body {
  background: white;
  margin: 0;
  font-size: 14px;
  line-height: 1.5;
  font-family: "NanumSquare", "Apple SD Gothic Neo", Sans-serif;
  border-collapse: collapse;
}
@media screen and (max-width: 800px) {
  body {
    line-height: 1.2;
  }
}

.wrapper {
  margin: 0 auto;
  max-width: 1100px;
  min-width: 360px;
  position: relative;
  padding: 0px 20px;
}

.logo {
  margin: 110px 0px 50px 0px;
  @media screen and (max-width: 800px) {
    img {
      width: 200px;
    }
  }
}
@media screen and (max-width: 800px) {
  .logo {
    margin: 60px 0px 30px 0px;
    width: 250px;
  }
}

.mainArea {
  width: 100%;
  height: 0;
  padding-top: calc(650 / 1000 * 100%);
  background: url("../img/main.jpg") center center;
  background-size: cover;
  position: relative;

  .title {
    position: absolute;
    top: 5%;
    left: 5%;
  }
  dl {
    display: flex;
    flex-direction: column;
    justify-items: flex-start;
  }
  dt {
    font-size: 24px;
    font-weight: 400;
    text-align: left;
  }
  dd {
    font-size: 52px;
    font-weight: 800;
    margin: 20px 0px 0px 0px;
  }
  .url {
    position: absolute;
    bottom: 5%;
    left: 5%;
    font-size: 30px;
    color: #000000;
  }
}
@media screen and (max-width: 800px) {
  .mainArea {
    dt {
      font-size: 20px;
    }
    dd {
      font-size: 40px;
      margin: 10px 0px 0px 0px;
    }
    .url {
      font-size: 20px;
    }
  }
}
@media screen and (max-width: 600px) {
  .mainArea {
    dt {
      font-size: 16px;
    }
    dd {
      font-size: 26px;
    }
    .url {
      font-size: 16px;
    }
  }
}

.mainDescription {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  margin: 20px 0px;

  .left {
    font-weight: 700;
    font-size: 32px;
    margin: 0;
  }
  .right {
    font-weight: 400;
    font-size: 18px;
    margin: 0;
  }
}
@media screen and (max-width: 1024px) {
  .mainDescription {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .left {
    font-size: 26px;
  }
  .right {
    font-size: 14px;
  }
}

.pressTitle {
  margin-top: 150px;
  font-size: 48px;
  font-weight: 800;
}
@media screen and (max-width: 800px) {
  .pressTitle {
    margin-top: 100px;
    font-size: 36px;
  }
}

.pressList {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 80px;
  padding: 0;
  margin: 20px 0px 0px 0px;
  .pressListItem {
    overflow: hidden;
    a {
      color: #000000;
      text-decoration: none;
      .inner {
        display: flex;
        gap: 10px;
        flex-direction: column;
      }
      .pic {
        box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
        img {
          width: 100%;
        }
      }
      .listTitle {
        font-weight: 700;
        font-size: 24px;
        margin: 10px 0px 10px 0px;
        line-height: 1.2;
      }
      .date {
        font-size: 18px;
        margin: 0;
      }
      .description {
        font-size: 18px;
        margin: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
      }
    }
  }
}
@media screen and (max-width: 800px) {
  .pressList {
    gap: 60px;
    grid-template-columns: repeat(1, 1fr);

    .pressListItem {
      .listTitle {
        font-size: 20px;
        margin: 0;
      }
      .date {
        font-size: 14px;
      }
      .description {
        font-size: 14px;
      }
    }
  }
}

footer {
  background: #f7f8fa;
  padding: 50px 100px;
  margin-top: 150px;
  font-size: 16px;
  min-width: 360px;
  color: rgba(70, 83, 100, 1);
  .inner {
    position: relative;
    max-width: 1100px;
    margin: auto;
  }
  .youtube {
    position: absolute;
    top: 0;
    right: 0;
  }

  p {
    margin: 0;
  }
  .footer-logo {
    width: 206px;
    padding: 20px 0px;
  }

  .box {
    display: grid;
    grid-template-columns: 70% 30%;
    align-items: end;
    gap: 30px;
    .info {
      .email {
        color: #465364;
        font-weight: 700;
        text-decoration: underline;
      }
      address {
        font-style: normal;
      }
    }
    .cs {
      .time {
        font-weight: 500;
        font-size: 24px;
      }
      .tel {
        font-weight: 800;
        font-size: 48px;
        margin: 10px 0px 0px 0px;
        color: #465364;
        text-decoration: none;
      }
    }
  }
}
@media screen and (max-width: 1280px) {
  footer {
    padding: 30px 20px;
    .youtube {
      top: 10px;
    }
    .box {
      grid-template-columns: 1fr;
      .cs {
        .time {
          font-size: 20px;
        }
        .tel {
          font-size: 38px;
        }
      }
    }
  }
}