@charset "utf-8";

/* popup */
.popup {
  position: fixed;
  top: 50%;
  left: 150px;
  right: 150px;
  transform: translateY(-50%);
  width: calc(100% - 300px);
  max-height: calc(calc(var(--vh, 1vh) * 100) - 30px);
  display: flex;
  justify-content: center;
  gap: 0 40px;
  z-index: 103;
}
.popup-layer:first-child {
  z-index: 104;
}
.popup-content {
  font-size: 0;
  line-height: 0;
}
.popup-bottom {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: 8px 12px;
  gap: 10px;
  width: 100%;
  height: 40px;
  background: #353535;
}
.popup-bottom a {
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  letter-spacing: -0.5px;
  color: #fff;
}
.popup-bottom .popup-close {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 4px;
  width: 48px;
  height: 24px;
}
.popup-bottom .popup-close span {
  display: inline-block;
  width: 16px;
  height: 16px;
  background: url(../img/popup-close.png) center top no-repeat;
  background-size: 16px auto;
}
@media screen and (max-width: 1000px) {
  .popup {
    gap: 0 25 px;
  }
}
@media screen and (max-width: 768px) {
  .popup {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    transform: unset;
    width: auto;
  }
  .popup-layer {
    position: fixed;
    top: 50%;
    left: 15px;
    right: 15px;
    transform: translateY(-50%);
    width: calc(100% - 30px);
    max-height: calc(calc(var(--vh, 1vh) * 100) - 30px);
    display: flex;
    justify-content: center;
    z-index: 103;
  }
}

/* sec1 */
.sec1 {
  margin-top: 100px;
  overflow: hidden;
  transition: border-radius 1s;
}
.sec1 .wrap {
  position: relative;
  z-index: 1;
}
.sec1.hero-scrolled {
  border-radius: 0px 0px 80px 80px;
}
.sec1 .shadow {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.sec1 .shadow:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.2);
  z-index: 1;
}
.sec1 .shadow img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sec1 .wrap {
  height: calc(calc(var(--vh, 1vh) * 100) - 100px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.sec1 h1 {
  margin-top: 1px;
}
.sec1 p {
  margin-top: 13px;
}

@media screen and (max-width: 1000px) {
  .sec1 {
    margin-top: 115px;
  }
  .sec1 .wrap {
    height: calc(calc(var(--vh, 1vh) * 100) - 115px);
  }
}
@media screen and (max-width: 768px) {
  .sec1 {
    margin-top: 62px;
    border-radius: unset !important;
  }
  .sec1 .wrap {
    height: calc(calc(var(--vh, 1vh) * 100) - 62px - 84px);
  }
  .sec1 h1 {
    margin-top: 0;
  }
  .sec1 p {
    margin-top: 16px;
  }
}

/* sec2 */
.sec2 {
  position: relative;
  padding: 130px 0 255px;
}
.sec2:after {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 0;
  display: inline-block;
  width: 344px;
  height: 217px;
  background: url(../img/sec2-img2.png) center bottom no-repeat;
  background-size: 100% auto;
}
section h2 {
  margin-top: 4px;
}
.sec2 ul {
  margin: 60px auto 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  font-size: 0;
  gap: 20px 24px;
  width: 1170px;
  max-width: 100%;
}
.sec2 ul li {
  position: relative;
  display: flex;
  align-items: center;
  padding: 19.5px 30px 19.5px 84px;
  text-align: left;
  background: #00aee1;
  border-radius: 80px;
}
body:not(.resize) .sec2 ul.scroll-ani.active li:nth-child(1),
body:not(.resize) .sec2 ul.scroll-ani.active li:nth-child(2) {
  transition-delay: 300ms;
}
body:not(.resize) .sec2 ul.scroll-ani.active li:nth-child(3),
body:not(.resize) .sec2 ul.scroll-ani.active li:nth-child(4) {
  transition-delay: 600ms;
}
body:not(.resize) .sec2 ul.scroll-ani.active li:nth-child(5),
body:not(.resize) .sec2 ul.scroll-ani.active li:nth-child(6) {
  transition-delay: 900ms;
}
.sec2 ul li:before {
  content: "";
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  display: inline-block;
  width: 57px;
  height: 57px;
  background: url(../img/sec2-img1.svg) no-repeat;
  background-size: 100% auto;
}
@media screen and (max-width: 1190px) {
  .sec2 ul {
    display: flex;
    flex-direction: column;
    gap: 16px 0;
    width: 100%;
  }
  .sec2 ul li {
    justify-content: center;
    padding: 17.5px 20px;
    width: 100%;
    height: 65px;
    text-align: center;
    border-radius: 65px;
  }
  .sec2 ul.scroll-ani.fade-up > li {
    transform: translateY(60px);
  }
  body:not(.resize) .sec2 ul.scroll-ani.active li:nth-child(1) {
    transition-delay: 300ms;
  }
  body:not(.resize) .sec2 ul.scroll-ani.active li:nth-child(2) {
    transition-delay: 600ms;
  }
  body:not(.resize) .sec2 ul.scroll-ani.active li:nth-child(3) {
    transition-delay: 800ms;
  }
  body:not(.resize) .sec2 ul.scroll-ani.active li:nth-child(4) {
    transition-delay: 1000ms;
  }
  body:not(.resize) .sec2 ul.scroll-ani.active li:nth-child(5) {
    transition-delay: 1200ms;
  }
  body:not(.resize) .sec2 ul.scroll-ani.active li:nth-child(6) {
    transition-delay: 1400ms;
  }

  .sec2 ul li:before {
    display: none;
  }
}
@media screen and (max-width: 768px) {
  .sec2 {
    padding: 60px 0 212px;
  }
  .sec2:after {
    width: 304px;
    height: 191px;
  }
  section h2 {
    margin-top: 0;
  }
  .sec2 ul {
    margin: 40px auto 0;
    gap: 12px 0;
  }
  .sec2 ul li {
    padding: 17.5px 20px;
    height: 60px;
    border-radius: 60px;
  }
}

/* sec3 */
.sec3 {
  padding: 180px 0;
  background-repeat: no-repeat;
  background-size: cover;
}
.sec3 .cont-box {
  position: relative;
  margin: 0 auto;
  padding: 103.5px 20px 82.7px;
  width: 890px;
  max-width: 100%;
  display: inline-block;
  background-color: rgba(255, 255, 255, 0.7);
  z-index: 1;
}
.sec3 .cont-box:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: calc(100% - 40px);
  height: calc(100% - 40px);
  border: 1.5px solid #fff;
}
.sec3 h2 {
  margin: 0;
  line-height: 62.4px;
}
.sec3 p {
  margin-top: 37px;
  font-size: 20px;
  line-height: 34px;
}
.sec3 .video {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  text-align: center;
}
.sec3 .video:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.sec3 .video > div {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
}
.sec3 #player1 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  opacity: 1;
  display: block;
  text-align: center;
  transition: unset;
}
.sec3 .player1.scroll-ani > * {
  opacity: 1;
  display: block;
  text-align: center;
  transition: unset;
}
@media screen and (max-width: 768px) {
  .sec3 {
    padding: 89px 0;
  }
  .sec3 .cont-box {
    padding: 48.5px 20px 50.73px;
  }
  .sec3 .cont-box:before {
    width: calc(100% - 24px);
    height: calc(100% - 24px);
  }
  .sec3 h2 {
    font-size: 30px;
    line-height: 39px;
  }
  .sec3 p.text-l-regular.type2 {
    margin-top: 16px;
    line-height: 25.6px;
  }
}

/* sec4 */
.sec4 {
  padding: 130px 0 120px;
  background: #dff4fa;
}
.sec4:after {
  opacity: 0;
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  margin-left: 310px;
  bottom: 0;
  display: inline-block;
  width: 571px;
  height: 857px;
  background: url(../img/sec4-bg2.png) no-repeat;
  background-size: 100% auto;
}
.sec4.active:after {
  opacity: 1;
}
body:not(.resize) .sec4.active:after {
  transition-duration: 0.6s;
  transition-timing-function: ease-out;
  transition-delay: 600ms;
}
.sec4 .wrap:before {
  content: "";
  position: absolute;
  top: -292px;
  right: -133px;
  display: inline-block;
  width: 963px;
  height: 734px;
  background: url(../img/sec4-bg1.png) no-repeat;
  background-size: 100% auto;
}
.sec4 .content {
  position: relative;
  padding-top: 77px;
  padding-left: 95px;
  text-align: left;
}
.sec4 .content .name h3 {
  display: flex;
  align-items: end;
  gap: 0 17px;
}
.white-border-box {
  position: relative;
  padding: 48px 48px 50px;
  background: #fff;
  border-radius: 40px;
}
.sec4 .white-border-box {
  margin-top: 31px;
  width: 580px;
  max-width: 100%;
}
.ul-style1 {
  font-size: 0;
  line-height: 0;
}
.ul-style1 li {
  margin-bottom: 8px;
}
.ul-style1 li .inner {
  position: relative;
  display: inline-block;
  padding: 4.5px 20px 4.5px 53px;
  background: #00a0de;
  border-radius: 999px;
}
.ul-style1 li:last-child {
  margin-bottom: 0;
}
.ul-style1 li .inner:before {
  content: "";
  position: absolute;
  left: 13px;
  top: 11px;
  display: inline-block;
  width: 28px;
  height: 28px;
  background: url(../img/sec4-img1.png) no-repeat;
  background-size: 100% auto;
}
.sec4 .ul-style1 .text-xl-semibold {
  font-weight: 500;
}
.ul-style2 {
  margin-top: 24px;
  font-size: 0;
  line-height: 0;
}
.ul-style2 li {
  position: relative;
  padding-left: 30px;
}
.ul-style2 li:before {
  content: "•";
  position: absolute;
  top: 0;
  left: 0;
  width: 30px;
  height: 34px;
  background: none;
  font-weight: 400;
  font-size: 20px;
  line-height: 34px;
  letter-spacing: -0.5px;
  text-align: center;
}
.br2 {
  display: none;
}
@media screen and (max-width: 1150px) {
  .sec4 .content {
    padding-left: 0;
  }
}
@media screen and (max-width: 940px) {
  .sec4:after {
    margin-left: 225px;
    background-size: 78% auto;
    background-position: bottom right;
  }
}
@media screen and (max-width: 768px) {
  .sec4 {
    padding: 60px 0 145px;
  }
  .sec4 .wrap:before {
    display: none;
  }
  .sec4:before {
    content: "";
    position: absolute;
    top: -58px;
    right: 0;
    width: 287px;
    height: 266px;
    background: url(../img/sec4-bg1-m.png) no-repeat;
    background-size: 100% auto;
  }
  .sec4:after {
    left: auto;
    transform: unset;
    right: 0;
    bottom: -23px;
    margin-left: 0;
    width: 233px;
    height: 419px;
    background: url(../img/sec4-bg2-m.png) no-repeat;
    background-size: 100% auto;
  }
  .sec4 .content {
    padding-top: 42px;
  }
  .sec4 .content .name h3 {
    gap: 0 13px;
    font-size: 26px;
    line-height: 24.7px;
    letter-spacing: -1.5px;
    align-items: center;
  }
  .sec4 .content .name .text-l-regular.bar {
    font-size: 22px;
    line-height: 37.4px;
    letter-spacing: -0.5px;
  }
  .sec4 .content .name .text-l-regular {
    font-size: 18px;
    line-height: 28.8px;
    letter-spacing: -0.5px;
  }
  .sec4 .content .name .text-l-regular:not(.bar) {
    padding-top: 6px;
  }
  .white-border-box {
    padding: 48px 48px 50px;
    border-radius: 40px;
  }
  .sec4 .white-border-box {
    margin-top: 14px;
    padding: 0;
    width: 100%;
    background: none;
  }
  .ul-style1 li {
    margin-bottom: 8px;
  }
  .ul-style1 li .inner {
    padding: 3.5px 18px 3.5px 40px;
  }
  .ul-style1 li .inner:after {
    content: "";
    clear: both;
  }
  .ul-style1 li .inner:last-child {
    margin-bottom: 0;
  }
  .ul-style1 li .inner:before {
    content: "";
    position: absolute;
    left: 10px;
    top: 7px;
    display: inline-block;
    width: 22px;
    height: 22px;
  }
  .ul-style1 li .text-xl-semibold {
    font-size: 18px;
    line-height: 29px;
  }
  .ul-style2 {
    margin-top: 16px;
  }
  .ul-style2 li {
    padding-left: 24px;
  }
  .ul-style2 li:before {
    width: 24px;
    height: 26px;
    font-size: 16px;
    line-height: 26px;
  }
}
@media screen and (max-width: 600px) {
  .br2 {
    display: block;
  }
}
@media screen and (max-width: 384px) {
  .sec4:after {
    background-size: 80% auto;
    background-position: bottom right;
  }
}

/* sec5 */
.sec5 {
  padding: 130px 0;
  background: url(../img/sec5-bg.jpg) center no-repeat;
  background-size: cover;
}
.sec5 h3 {
  font-size: 0;
  line-height: 0;
}
.sec5 h3 img {
  margin: 0 auto;
  width: 227px;
}
.sec5 h2 {
  margin-top: 16px;
}
.sec5 .content {
  margin: 60px auto 0;
  overflow: visible;
}
.sec5 .white-border-box {
  display: inline-block;
  padding: 0;
  width: 1170px;
  max-width: 100%;
  border-radius: 40px;
  text-align: left;
}
.sec5 .white-border-box:before {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 23px;
  width: 1px;
  height: calc(100% - 46px);
  background: #e2e2e2;
}
.sec5 .white-border-box ul {
  display: flex;
  position: relative;
  width: 100%;
}
@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.sec5 .white-border-box ul:before {
  content: "";
  position: absolute;
  top: -79px;
  right: -25px;
  display: inline-block;
  width: 176px;
  height: 176px;
  background: url(../img/sec5-img3.png) no-repeat;
  background-size: 100% auto;
  animation: spin 12s linear infinite;
}
.sec5 .white-border-box ul:after {
  content: "";
  position: absolute;
  top: -79px;
  right: -25px;
  display: inline-block;
  width: 176px;
  height: 176px;
  background: url(../img/sec5-img2.png) no-repeat;
  background-size: 100% auto;
  z-index: 1;
}
.sec5 .white-border-box li {
  position: relative;
  flex: 1;
  padding: 60px 46px 61.5px;
}

.sec5 .white-border-box dl dt {
  margin-bottom: 12px;
  word-break: break-all;
}
.sec5 .white-border-box dl dd {
  word-break: break-all;
}
@media screen and (max-width: 1050px) {
  .sec5 .white-border-box ul {
    flex-direction: column;
  }
  .sec5 .white-border-box:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 23px;
    transform: translate(0, -50%);
    width: calc(100% - 46px);
    height: 1px;
  }
}
@media screen and (max-width: 768px) {
  .sec5 {
    padding: 60px 0;
    background: url(../img/sec5-bg-m.jpg) center no-repeat;
    background-size: cover;
  }
  .sec5 .white-border-box:before {
    left: 19px;
    width: calc(100% - 38px);
  }
  .sec5 h3 img {
    width: 150px;
  }
  .sec5 .content {
    margin: 40px auto 0;
  }
  .sec5 .white-border-box {
    width: 100%;
    border-radius: 24px;
    flex-direction: column;
  }
  .sec5 .white-border-box ul:before {
    display: none;
  }
  .sec5 .white-border-box ul:after {
    display: none;
  }
  .sec5 .white-border-box li {
    flex: 1;
    padding: 24px;
  }
  .sec5 .white-border-box dl dt {
    margin-bottom: 12px;
    word-break: break-all;
  }
}

/* sec6 */
.sec6 {
  padding: 130px 0 95px;
}
.swiper {
  margin: 65px auto 0;
  width: 1170px;
  max-width: 100%;
}
.sec6 .swiper-wrapper {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px 24px;
  width: 100%;
}
body:not(.mo) .sec6 .swiper-wrapper {
  transform: unset !important;
}
.sec6 .swiper-slide {
  width: 100% !important;
  text-align: left;
}
body:not(.mo) .sec6 .swiper-slide {
  opacity: 0;
  transform: translateY(80px);
}
body:not(.mo) .sec6 .content.scroll-ani.active .swiper-slide {
  opacity: 1;
  transform: translateZ(0) !important;
  transition-timing-function: ease-out;
  transition-property: all;
}
body:not(.mo):not(.resize) .sec6 .content.scroll-ani.active .swiper-slide {
  transition-duration: 0.6s;
}
body:not(.mo):not(.resize) .sec6 .content.scroll-ani.active .swiper-slide:nth-child(1),
body:not(.mo):not(.resize) .sec6 .content.scroll-ani.active .swiper-slide:nth-child(2),
body:not(.mo):not(.resize) .sec6 .content.scroll-ani.active .swiper-slide:nth-child(3) {
  transition-delay: 600ms;
}
body:not(.mo):not(.resize) .sec6 .content.scroll-ani.active .swiper-slide:nth-child(4),
body:not(.mo):not(.resize) .sec6 .content.scroll-ani.active .swiper-slide:nth-child(5),
body:not(.mo):not(.resize) .sec6 .content.scroll-ani.active .swiper-slide:nth-child(6) {
  transition-delay: 900ms;
}
.swiper-slide .img {
  position: relative;
  width: 100%;
  font-size: 0;
  line-height: 0;
  overflow: hidden;
}
.sec6 .swiper-slide .img {
  border-radius: 24px;
}
.swiper-slide .img img {
  width: 100%;
}
.sec6 .swiper-slide h4 {
  margin-top: 16px;
  word-break: break-all;
}
.sec6 .swiper-slide p {
  margin: 8px 0 16px;
  word-break: break-all;
}
.swiper .arrow {
  display: inline-block;
  position: absolute;
  top: calc(180 / 390 * 100vw);
  width: 44px;
  height: 44px;
  margin: 0;
  border-radius: unset;
  background-image: url(../img/slide-arrow.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 24px auto;
  border: none;
  transition: 0.3s;
}
.sec6 .swiper .arrow {
  display: none;
}
.swiper-button-prev {
  left: 5px;
  transform: rotate(180deg);
}
.swiper-button-next {
  right: 5px;
}
.swiper-button-next.swiper-button-disabled,
.swiper-button-prev.swiper-button-disabled {
  opacity: 0.4;
}
.swiper .arrow:hover {
  opacity: 0.8;
}
.swiper-pagination {
  display: none;
  bottom: 0;
  left: 0;
  width: 100%;
  justify-content: center;
  gap: 8px;
}
.swiper-pagination span {
  margin: 0 !important;
  padding: 0;
  width: 10px;
  height: 10px;
  border-radius: 100%;
  overflow: hidden;
  background: #ccc;
}
.swiper-pagination span.swiper-pagination-bullet-active {
  background: #6b6b6b;
}
@media screen and (max-width: 768px) {
  .sec6 {
    padding: 60px 0 71px;
  }
  .sec6 .swiper {
    margin: 42px auto 0;
    padding-bottom: 34px;
    border-radius: 12px;
  }
  .sec6 .swiper-wrapper {
    display: flex;
    gap: 0;
  }
  .sec6 .swiper-slide {
    width: inherit !important;
  }
  .sec6 .swiper-slide .img {
    padding-top: calc(403 / 358 * 100%);
  }
  .sec6 .swiper-slide .img img {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    object-fit: cover;
  }
  .sec6 .swiper-slide p {
    margin: 5px 0 0;
  }
  .sec6 .swiper .arrow {
    display: inline-block;
  }
  .swiper-pagination {
    display: flex;
  }
}

/* sec6-1 */
.sec6-1 {
  padding: 96px 0 60px;
}
.sec6-1:before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 92px;
  height: 72px;
  background-image: url(../img/sec6-1-img1.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
}
.sec6-1 h3 {
  line-height: 45px;
}
@media screen and (max-width: 768px) {
  .sec6-1 h3 {
    font-size: 26px;
    line-height: 34px;
    /* or 34px */
    letter-spacing: -1.5px;
  }
}

/* sec6-2 */
.sec6-2 {
  padding: 100px 0;
  background: #fff9e7;
}
.flex-box.type1 .img {
  display: inline-block;
  border-radius: 160px;
  border-top-right-radius: 60px;
  text-align: center;
  overflow: hidden;
}
.flex-box.type1 .img img {
  display: inline-block;
}
.text-box1 {
  padding-right: 60px;
  line-height: 0;
}
.clinic {
  font-size: 0;
  line-height: 0;
}
.clinic > div {
  display: inline-block;
  padding: 4px 12px;
  border-radius: 27px;
  overflow: hidden;
}
.clinic span {
  font-weight: 500;
  font-size: 16px;
  line-height: 27px;
}
.text-box1 h2 {
  margin-top: 24px;
}
.text-box1 p {
  margin-top: 24px;
}
.text-box1 p span {
  word-break: break-all;
}
.flex-box.type1 .img-box1 {
  text-align: right;
  line-height: 0;
}
.sec6-2 h3 {
  margin-top: 60px;
}
.sec6-2 .text-box2 {
  margin-top: 32px;
}
.text-box2 > li {
  overflow: visible;
}
.sec6-2 .text-box2 > li {
  flex: 1;
}
.white-border-box24 {
  flex: 1;
  padding: 32px 24px;
  height: 100%;
  line-height: 0;
  background: #fff;
  border-radius: 24px;
  overflow: hidden;
}
.sec6-2 .white-border-box24 {
  text-align: center;
}
.sec6-2 .circle-img {
  display: inline-block;
  width: 120px;
  height: 120px;
  background: #f4f4f4;
  border-radius: 100%;
  overflow: hidden;
}
.sec6-2 .text-box2 b {
  display: block;
  margin-top: 24px;
}
.sec6-2 .text-box2 p {
  margin-top: 6px;
  padding: 0 10px;
}
@media screen and (max-width: 980px) {
  .sec6-2 .text-box2 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
  }
}
@media screen and (max-width: 768px) {
  .sec6-2 {
    padding: 60px 0;
  }
  .flex-box.type1 .img {
    margin-top: 24px;
    border-radius: 100% !important;
  }
  .flex-box.type1 .img img {
    width: 358px;
  }
  .flex-box.type1 {
    flex-direction: column;
  }
  .text-box1 {
    padding: 0 !important;
    text-align: center;
  }
  .clinic > div {
    padding: 4px 12.71px;
    border-radius: 34px;
  }
  .clinic span {
    line-height: 26px;
    letter-spacing: -0.5px;
  }
  .text-box1 h2 {
    margin-top: 16px;
  }
  .text-box1 p {
    margin-top: 16px;
  }
  .sec6-2 h3 {
    margin-top: 40px;
  }
  .text-box2 {
    margin-top: 24px;
    display: flex !important;
    flex-direction: column;
    gap: 16px;
  }
  .white-border-box24 {
    padding: 24px 20px;
    display: flex;
    align-items: center;
    gap: 24px;
  }
  .sec6-2 .circle-img {
    width: 80px;
    height: 80px;
  }
  .sec6-2 .text-wrap {
    flex: 1;
    text-align: left;
  }
  .sec6-2 .text-box2 b {
    margin-top: 0;
  }
  .sec6-2 .text-box2 p {
    margin-top: 6px;
    padding: 0;
  }
}

/* sec6-3 */
.sec6-3 {
  padding: 100px 0;
  background: #ffe7f1;
}
.fd-row-revers .text-box1 {
  padding: 0 0 0 60px;
}
.flex-box.type1.fd-row-revers .img {
  border-radius: 160px;
  border-top-left-radius: 60px;
}
.sec6-3 .text-box2 {
  margin-top: 60px;
}
.sec6-3 .white-border-box24 {
  display: flex;
  flex-direction: column;
  padding: 48px;
  gap: 24px;
}
.ul-style2.type2 {
  margin-top: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.ul-style2.type2 > li {
  padding-left: 28px;
}
.ul-style2.type2 > li span {
  display: block;
}
.ul-style2.type2 li:before {
  content: "";
  position: absolute;
  left: 0;
  top: 7px;
  display: inline-block;
  width: 20px;
  height: 20px;
  font-size: 0;
  line-height: 0;
  border-radius: unset;
  background-image: url(../img/sec6-3-icon1.png);
  background-color: unset;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% auto;
}
@media screen and (max-width: 940px) {
  .sec6-3 .text-box2 {
    flex-direction: column;
  }
}
@media screen and (max-width: 768px) {
  .sec6-3 {
    padding: 60px 0;
  }
  .sec6-3 .text-box2 {
    margin-top: 40px;
  }
  .sec6-3 .white-border-box24 {
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
    padding: 24px;
    text-align: left;
  }
  .ul-style2.type2 {
    gap: 8px;
  }
  .ul-style2.type2 > li {
    padding-left: 28px;
  }
  .ul-style2.type2 li:before {
    top: 3px;
  }
}

/* sec6-4 */
.sec6-4 {
  padding: 100px 0;
  background: #eeffe5;
}
.sec6-4 .text-box1 {
  padding-right: 40px;
}
.sec6-4 .flex-box.step2 {
  margin-top: 60px;
}
.sec6-4 .flex-box.step2 .text-box1 {
  padding: 0 0 0 60px;
}
.sec6-4 .flex-box.step2 .text-box1 p {
  margin-top: 32px;
}
.sec6-4 .flex-box.step2 .img-box1 {
  width: 55.38461538461538%;
}
.sec6-4 .flex-box.step2 .img-box1 .img {
  border-radius: unset !important;
}
@media screen and (max-width: 768px) {
  .sec6-4 {
    padding: 60px 0;
  }
  .sec6-4 .flex-box.step2 {
    margin-top: 40px;
  }
  .sec6-4 .flex-box.step2 .text-box1 p {
    margin-top: 16px;
  }
  .sec6-4 .flex-box.step2 .img-box1 {
    width: 100%;
  }
}

/* sec6-5 */
.sec6-5 {
  padding: 130px 0;
  background: url(../img/sec6-5-bg.jpg) center no-repeat;
  background-size: cover;
}
.sec6-5 h2 {
  margin-top: 16px;
}
.sec6-5 p.noto-serif-kr {
  margin-top: 16px;
}
.sec6-5 .cont-box {
  margin-top: 60px;
}
.sec6-5 .white-border-box24 {
  padding: 50px 48px;
}
.flex-box .flex-box {
  width: 100%;
}
.sec6-5 .cont-box ul > li > ul > li .white-border-box24 {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.sec6-5 .white-border-box24.bg-primary500:before {
  content: "";
  position: absolute;
  right: -15px;
  bottom: -3px;
  display: inline-block;
  width: 292px;
  height: 255px;
  background: url(../img/sec6-5-img1.png) no-repeat;
  background-size: 100% auto;
}
.sec6-5 h3 {
  word-break: break-all;
}
.sec6-5 .link a {
  display: inline-block;
  padding: 5px 23px;
  border: 1px solid #ffffff;
  border-radius: 999px;
}
.sec6-5 .link a span {
  position: relative;
  display: inline-block;
  width: 113px;
}
.sec6-5 .link a span:before {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url(../img/sec6-5-arrow.png) no-repeat;
  background-size: 100% auto;
}
.ul-style2.type3 {
  margin-top: 0;
}
.ul-style2.type3 li {
  padding-left: 19px;
}
.ul-style2.type3 li:before {
  content: "•";
  width: 19px;
  height: 34px;
  top: 0;
  left: 0;
  background: none;
  font-weight: 400;
  font-size: 20px;
  line-height: 34px;
  letter-spacing: -0.5px;
  text-align: center;
}
.sec6-5 ol {
  margin-top: 16px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.sec6-5 ol p {
  padding-right: 5px;
  word-break: break-all;
}
.sec6-5 h4 {
  margin-top: 60px;
}
@media screen and (max-width: 1000px) {
  .sec6-5 .text-box2 {
    flex-direction: column;
  }
}
@media screen and (max-width: 768px) {
  .sec6-5 {
    padding: 60px 0;
    background-size: 100% 100%;
  }
  .sec6-5 .cont-box {
    margin-top: 40px;
  }
  .sec6-5 .cont-box .text-box2 {
    margin-top: 0;
  }
  .sec6-5 .white-border-box24 {
    padding: 24px;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }
  .sec6-5 .cont-box ul > li > ul > li .white-border-box24 {
    gap: 16px;
  }
  .sec6-5 .white-border-box24.bg-primary500 {
    padding: 30px 24px 26px;
  }
  .sec6-5 .white-border-box24.bg-primary500:before {
    right: -34px;
    bottom: -6px;
    width: 226px;
    height: 197px;
  }
  .sec6-5 .white-border-box24.bg-primary500 p {
    margin-top: 6px;
  }
  .sec6-5 .link a {
    margin-top: 2px;
  }
  .sec6-5 .link a span {
    width: 95px;
  }
  .ul-style2.type3 {
    margin-top: 0;
  }
  .ul-style2.type3 li {
    padding-left: 15px;
  }
  .ul-style2.type3 li:before {
    width: 15px;
    height: 26px;
    font-size: 16px;
    line-height: 26px;
  }
  .sec6-5 ol {
    margin-top: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
  }
  .sec6-5 ol .text-l-semibold {
    font-weight: 600;
    font-size: 18px;
    line-height: 37px;
    letter-spacing: -0.5px;
  }
  .sec6-5 .empty {
    letter-spacing: 0.5px;
  }
  .sec6-5 ol p {
    padding-right: 0;
    word-break: break-all;
  }
  .sec6-5 h4 {
    margin-top: 40px;
  }
}
@media screen and (max-width: 350px) {
  .sec6-5 h3 br {
    display: none !important;
  }
}

/* sec7 */
.sec7 {
  padding: 125px 0 calc(1100 / 1920 * 100%);
}
.sec7:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  padding-top: calc(1236 / 1920 * 100%);
  background-image: url(../img/sec7-bg.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
}
.ul-style3 {
  position: relative;
  margin: 59.6px auto 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 1170px;
  max-width: 100%;
  overflow: visible;
  z-index: 1;
}
.ul-style3 > li {
  position: relative;
  display: flex;
  align-items: center;
  padding: 26px 41px;
  gap: 20px 63px;
  background: #dcefee;
  border-radius: 32px;
}
.sec7 .ul-style3 > li:first-child:before {
  content: "";
  position: absolute;
  right: 65px;
  bottom: 100%;
  width: 210px;
  height: 207px;
  border-radius: unset;
  background-image: url(../img/sec7-img1.png);
  background-repeat: no-repeat;
  background-size: cover;
}
body:not(.resize) .sec7 .ul-style3.scroll-ani.active > li:nth-child(1) {
  transition-delay: 600ms;
}
body:not(.resize) .sec7 .ul-style3.scroll-ani.active > li:nth-child(2) {
  transition-delay: 800ms;
}
body:not(.resize) .sec7 .ul-style3.scroll-ani.active > li:nth-child(3) {
  transition-delay: 1000ms;
}
body:not(.resize) .sec7 .ul-style3.scroll-ani.active > li:nth-child(4) {
  transition-delay: 1200ms;
}
.ul-style3 .title {
  width: 302px;
  display: flex;
  align-items: center;
  gap: 16px;
}
.ul-style3 .icon-box {
  position: relative;
  display: inline-block;
  width: 70px;
  height: 70px;
  border-radius: 100%;
  background: #fff;
}
.ul-style3 .icon-box:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 36px;
  height: 36px;
  background-repeat: no-repeat;
  background-size: 100% auto;
}
.ul-style3 > li:nth-child(1) .icon-box:before {
  background-image: url(../img/sec7-icon1.png);
}
.ul-style3 > li:nth-child(2) .icon-box:before {
  background-image: url(../img/sec7-icon2.png);
}
.ul-style3 > li:nth-child(3) .icon-box:before {
  background-image: url(../img/sec7-icon3.png);
}
.ul-style3 > li:nth-child(4) .icon-box:before {
  background-image: url(../img/sec7-icon4.png);
}
.ul-style3 .ul-style2 {
  flex: 1;
  margin-top: 0;
  text-align: left;
}
.sec7 .ul-style2 li {
  padding-left: 32px;
}
.sec7 .ul-style2 li:before {
  width: 33px;
  height: 37px;
  font-size: 22px;
  line-height: 37px;
  letter-spacing: -0.5px;
  font-weight: 400;
}
@media screen and (max-width: 1000px) {
  .ul-style3 > li {
    flex-direction: column;
  }
}
@media screen and (max-width: 768px) {
  .sec7 {
    padding: 67.41px 0 calc(363 / 390 * 100%);
  }
  .sec7:after {
    content: "";
    position: absolute;
    left: 0;
    width: 100%;
    padding-top: calc(355 / 390 * 100%);
    background-image: url(../img/sec7-bg-m.jpg);
  }
  .ul-style3 {
    margin: 40px auto 0;
  }
  .ul-style3 > li {
    flex-direction: column;
    padding: 24px 41px;
    gap: 8px;
  }
  .sec7 .ul-style3 > li:first-child:before {
    display: none;
  }
  .ul-style3 .title {
    width: 100%;
    flex-direction: column;
    gap: 12px;
  }
  .ul-style3 .icon-box {
    width: 50px;
    height: 50px;
  }
  .ul-style3 .icon-box:before {
    width: 30px;
    height: 30px;
  }
  .sec7 .ul-style2 {
    margin-top: 0.61px;
  }
  .sec7 .ul-style2 li:before {
    display: none;
  }
  .sec7 .ul-style2 li {
    padding-left: 0;
    text-align: center;
  }
  .sec7 .ul-style2 li:not(:first-child) {
    display: none;
  }
  .sec7 .ul-style3 li .h3-bold {
    font-size: 26px;
    line-height: 130%;
    letter-spacing: -1.5px;
  }
  .sec7 .ul-style2 li .text-base-regular {
    font-size: 18px;
    line-height: 160%;
  }
}

/* sec8 */
.sec8 {
  padding: 130px 0;
}
.sec8 p {
  margin-top: 16px;
  line-height: 37.4px;
}
.sec8 .swiper .arrow {
  top: 50%;
  transform: translateY(-50%);
  background-size: 34px auto;
}
.sec8 .swiper .arrow.swiper-button-prev {
  left: 11px;
  transform: translateY(-50%) rotate(180deg);
}
.sec8 .swiper .arrow.swiper-button-next {
  right: 11px;
}
.sec8 .swiper.thumbs {
  margin: 24px auto;
  width: 1170px;
  max-width: 100%;
}
body:not(.mo) .sec8 .swiper.thumbs .swiper-slide {
  margin-top: 0 !important;
}
@media screen and (max-width: 1250px) {
  .sec8 .swiper.thumbs {
    margin: calc(24 / 1170 * 100vw) auto 0;
  }
}
@media screen and (max-width: 768px) {
  .sec8 {
    padding: 60px 0;
  }
  .sec8 .text-l-regular.type2 {
    font-size: 18px;
    line-height: 29px;
  }
  .sec8 .swiper.gallery {
    margin-top: 40px;
  }
  .sec8 .thumbs-box {
    margin-top: calc(20 / 390 * 100vw);
    width: 100%;
    overflow: hidden;
  }
  .sec8 .swiper.thumbs {
    margin: 0;
    width: 100%;
    overflow: hidden;
  }
  .sec8 .swiper.thumbs .swiper-wrapper {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: calc(8 / 390 * 100vw);
    box-sizing: border-box;
  }
  .sec8 .swiper.thumbs .swiper-slide {
    width: auto !important;
    height: calc(76 / 390 * 100vw);
  }
  .sec8 .swiper.thumbs .swiper-slide .img {
    height: 100%;
  }
  .sec8 .swiper.thumbs .swiper-slide .img img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}

/* sec9 */
.sec9 {
  padding: 130px 0;
  background: #faf1df;
}

.sec9 .content {
  margin: 60px auto 0;
  display: flex;
  gap: 24px;
  width: 1170px;
  max-width: 100%;
}
.sec9 .content > li {
  position: relative;
  flex: 1;
  text-align: left;
}
#map {
  position: relative;
  width: 100%;
  height: 100%;
}
#map .root_daum_roughmap_landing {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100% !important;
  height: 100% !important;
}
#map .wrap_map {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100% !important;
  height: 100% !important;
}
#map .root_daum_roughmap .map {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
#map .cont {
  display: none !important;
}
#map .wrap_controllers {
  display: none !important;
}
#map .map_border {
  display: none !important;
}

.sec9 .content > li > ul {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.sec9 .content > li > ul > li {
  position: relative;
}
.sec9 .content > li > ul > li:before {
  content: "";
  position: absolute;
  top: 24px;
  left: 24px;
  width: 48px;
  height: 48px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 24px auto;
  background-color: #dff4fa;
  border-radius: 100%;
  overflow: hidden;
}
.sec9 .content > li > ul > li:nth-child(1):before {
  background-image: url(../img/sec9-icon1.png);
}
.sec9 .content > li > ul > li:nth-child(2):before {
  background-image: url(../img/sec9-icon2.png);
}
.sec9 .content > li > ul > li:nth-child(3):before {
  background-image: url(../img/sec9-icon3.png);
}
.sec9 .content > li > ul .white-border-box24 {
  padding: 24px 24px 24px 92px;
}
.sec9 .content dt {
  margin-bottom: 3px;
}
.sec9 .content dd {
  padding-top: 1px;
  line-height: 27px;
}
.sec9 .content dd.red {
  color: #e7000b;
}
.sec9 .img {
  position: relative;
  margin: 60px auto 0;
  width: 362px;
  max-width: 100%;
  line-height: 0;
  font-size: 0;
}
@media screen and (max-width: 768px) {
  .sec9 {
    padding: 60px 0;
  }
  .sec9 .content {
    margin: 40px auto 0;
    flex-direction: column;
    gap: 16px;
  }
  #map {
    height: 358px;
  }
  .sec9 .content > li > ul {
    gap: 16px;
  }
  .sec9 .content dt {
    margin-bottom: 2px;
  }
  .sec9 .content dd {
    padding-top: 2px;
    line-height: 26px;
  }
  .sec9 .img {
    margin: 40px auto 0;
    width: 330px;
  }
}