@charset "utf-8";

.wrap {
  overflow:hidden;
  max-width:100%;
  overflow-x:hidden
}

#content {
  margin-top:100px;
  background:#fff;
  overflow:hidden;
  max-width:100%
}
/* 일부 페이지는 크롤된 콘텐츠가 자체 article#content 를 포함해 #content 가 중첩됨.
   바깥 #content 만 고정헤더 오프셋(margin-top)을 갖고, 중첩된 안쪽은 0 으로 리셋(이중 공백 방지). */
#content #content {
  margin-top:0
}

.w_color {
  color:var(--woman-color-main)
}

.swiper-container {
  overflow:hidden
}

.table {
  display:table;
  table-layout:fixed;
  width:100%;
  height:100%
}

.cell {
  display:table-cell;
  vertical-align:middle
}

.line_map {
  padding:36px 16.66% 40px
}

.line_map p {
  font-size:16px;
  text-align:right
}

.line_map p span {
  color:#0c82fe
}

.top_banner {
  position:relative
}

.top_banner .inner {
  color:#fff;
  text-align:center;
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%)
}

.top_banner .inner h2 {
  font-size:84px;
  letter-spacing:-.04em;
  margin-bottom:1rem
}

.top_banner .inner p {
  font-size:27px;
  letter-spacing:-.1em
}

section .title_box .highlight {
  border-bottom:10px solid #cfd4db;
  display:inline-block
}

#faq .inner {
  padding:80px 14.7%
}

#faq .faq_item {
  margin-bottom:10px
}

#faq .faq_item span {
  font-size:40px;
  font-weight:700;
  text-transform:uppercase
}

#faq .faq_item>div {
  width:100%;
  display:flex;
  gap:16px
}

#faq .question {
  background:var(--man-color-04);
  padding:12px 56px;
  position:relative;
  align-items:center;
  cursor:pointer
}

#faq .question::after,#faq .question::before {
  content:"";
  position:absolute;
  right:56px;
  top:50%;
  width:16px;
  height:2px;
  background-color:var(--black-color-950);
  transition:transform .3s
}

#faq .question::after {
  transform:rotate(90deg)
}

#faq .faq_item.active .question::after {
  transform:rotate(360deg)
}

#faq .question p {
  font-size:24px;
  font-weight:500
}

#faq .faq_item .answer {
  padding:16px 56px;
  overflow:hidden;
  max-height:0;
  padding-top:0;
  padding-bottom:0;
  transition:max-height .4s ease,padding .4s ease
}

#faq .faq_item.active .answer {
  max-height:500px;
  padding-top:16px;
  padding-bottom:16px
}

#faq .answer span {
  color:var(--man-color-02)
}

#faq .answer p {
  font-size:20px;
  line-height:1.7;
  padding:10px 0
}

.note_box {
  width:100%;
  background-color:#f8f8f8;
  padding:24px;
  display:flex;
  justify-content:center;
  align-items:flex-start;
  gap:8px;
  flex-direction:column;
  margin-top:120px
}

.note_text {
  font-size:16px;
  line-height:1.4;
  color:var(--black-color-300);
  font-weight:500;
  text-align:left
}

#usp h4.title {
  font-size:48px;
  letter-spacing:-.02em;
  font-weight:400
}

#usp .title_box {
  text-align:center
}

#usp .usp_top .inner {
  padding:140px 0
}

#usp .content_box {
  margin-top:100px
}

#usp .usp_bottom .inner {
  padding:110px 14.7% 60px
}

#usp .usp_top .point_list li {
  background-repeat:no-repeat;
  background-position:center;
  background-size:cover;
  background-color:rgba(96,96,96,.7);
  background-blend-mode:darken;
  aspect-ratio:1/1
}

#usp .usp_top .point_list li:nth-child(6n+1) {
  background-image:url(/images/common/bg_proposition_01.jpg)
}

#usp .usp_top .point_list li:nth-child(6n+2) {
  background-image:url(/images/common/bg_proposition_02.jpg)
}

#usp .usp_top .point_list li:nth-child(6n+3) {
  background-image:url(/images/common/bg_proposition_03.jpg)
}

#usp .usp_top .point_list li:nth-child(6n+4) {
  background-image:url(/images/common/bg_proposition_04.jpg)
}

#usp .usp_top .point_list li:nth-child(6n+5) {
  background-image:url(/images/common/bg_proposition_05.jpg)
}

#usp .usp_top .point_list li:nth-child(6n) {
  background-image:url(/images/common/bg_proposition_06.jpg)
}

#usp .usp_top .text_box {
  padding:32px 0 25px;
  color:#fff;
  text-align:center;
  letter-spacing:-.02em;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  height:100%
}

#usp .usp_top .text_box h5 {
  font-size:32px;
  line-height:1.4
}

#usp .usp_top .text_box .sub_title {
  font-size:18px;
  line-height:1.6
}

#usp .usp_top .text_box .desc_text {
  font-size:14px;
  line-height:1.4;
  margin-top:auto
}

#usp .swiper-container {
  position:relative;
  padding-bottom:40px
}

#usp .swiper-pagination {
  display:none;
  top:auto;
  bottom:0!important
}

#usp .swiper-pagination .swiper-pagination-bullet {
  background:var(--man-color-06)!important;
  opacity:1;
  width:10px;
  height:10px
}

#usp .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background:var(--man-color-03)!important;
  width:20px;
  border-radius:30px
}

#usp .usp_bottom {
  background:#f8f8f8
}

#usp .usp_bottom .swiper-wrapper {
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:20px
}

#usp .usp_bottom .link_box {
  flex:1
}

#usp .usp_bottom .link_box h5 {
  font-size:18px;
  line-height:47px;
  background-color:var(--man-color-05);
  text-align:center
}

#usp .usp_bottom .link_list li a {
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:12px 8px;
  border-bottom:1px solid var(--black-color-200)
}

#usp .usp_bottom .link_list li:last-of-type a {
  border-bottom:none
}

#usp .usp_bottom .link_list img {
  width:70px;
  height:70px;
  border-radius:9px
}

#usp .usp_bottom .link_title {
  font-size:14px;
  line-height:1.4;
  letter-spacing:-.02em;
  width:60%
}

#usp .usp_bottom .more_text {
  font-size:12px;
  font-weight:700;
  color:var(--man-color-03);
  transition:all .2s
}

#usp .usp_bottom .link_list li a:hover .more_text {
  transform:translateX(2px)
}

@media screen and (max-width:1760px) {
  #usp .usp_bottom .inner {
    padding:110px 10% 60px
  }

}

@media screen and (max-width:1540px) {
  .line_map {
    padding:56px 12% 40px
  }
  #usp .usp_bottom .inner {
    padding:110px 5% 60px
  }

}

@media screen and (max-width:1440px) {
  .line_map {
    padding:56px 8% 40px
  }
  #usp .usp_bottom .swiper-wrapper {
    flex-wrap:wrap;
    width:70%;
    margin:0 auto
  }
  #usp .usp_bottom .link_box {
    flex:none;
    width:48%
  }

}

@media screen and (max-width:1058px) {
  .line_map {
    padding:56px 6% 40px
  }

}

@media screen and (max-width:1024px) {
  #content {
    margin-top:94px
  }
  .line_map {
    padding:32px 5% 46px
  }
  .line_map p {
    font-size:11px
  }
  #faq .inner {
    padding:120px 5%
  }
  #faq .question {
    padding:12px 24px
  }
  #faq .question p {
    font-size:22px;
    font-weight:500
  }
  #faq .answer {
    padding:16px 24px
  }
  #faq .answer p {
    font-size:18px
  }
  .note_box {
    padding:24px 40px;
    align-items:flex-start;
    gap:8px;
    margin-top:56px;
    text-align:left
  }
  .note_text {
    font-size:16px;
    line-height:1.4;
    color:var(--black-color-300);
    font-weight:500
  }
  #usp .inner {
    padding:80px 5% 60px
  }
  #usp .content_box {
    margin-top:64px
  }
  #usp h4.title {
    font-size:30px
  }
  #usp .swiper-pagination {
    display:block
  }
  #usp .usp_bottom .swiper-wrapper {
    gap:0
  }
  #usp .usp_bottom .swiper-wrapper {
    flex-wrap:nowrap;
    width:100%
  }
  #usp .usp_bottom .link_box {
    flex:none;
    width:100%
  }

}

@media screen and (max-width:767px) {
  #content {
    margin-top:62px
  }
  .wrap {
    min-width:375px
  }
  .line_map {
    display:none
  }
  #headerAreaMobile .sub_page .header_inner .header_inner_top .btn_back {
    display:inline-block;
    text-indent:-999px;
    width:24px;
    height:24px;
    background:url(../images/btn_back_mo.png) center no-repeat;
    background-size:contain
  }
  #headerAreaMobile .sub_page .header_inner .header_inner_top .here {
    font-weight:700;
    font-size:16px;
    position:relative;
    color:#29203b;
    padding-right:26px
  }
  #headerAreaMobile .sub_page .header_inner .header_inner_top .here::after {
    content:'';
    display:inline-block;
    width:6px;
    height:6px;
    position:absolute;
    top:50%;
    right:0;
    border:2px solid var(--black-color-900);
    border-top:none;
    border-left:none;
    transform:rotate(45deg) translate(-50%,-50%);
    transition:all .2s
  }
  #headerAreaMobile .sub_page .header_inner .header_inner_top .here.on::after {
    transform:rotate(225deg);
    top:40%
  }
  #headerAreaMobile .sub_page .header_inner .header_inner_top .here.non_arrow {
    pointer-events:none;
    cursor:default
  }
  #headerAreaMobile .sub_page .header_inner .header_inner_top .here.non_arrow::after {
    display:none
  }
  #headerAreaMobile .sub_page .header_inner .header_inner_top .here.non_arrow::before {
    display:none
  }
  #headerAreaMobile .sub_page .header_inner .header_inner_top .dropdown_menu {
    position:absolute;
    top:48px;
    left:50%;
    transform:translateX(-50%);
    z-index:100;
    width:70%;
    border:1px solid #d9d9d9;
    box-shadow:0 4px 8px rgba(116,53,255,.15);
    border-radius:8px;
    display:none
  }
  #headerAreaMobile .sub_page .header_inner .header_inner_top .dropdown_menu>li a {
    display:block;
    width:100%;
    box-sizing:border-box;
    padding:18px 5%;
    font-weight:500;
    font-size:14px;
    letter-spacing:-.01em;
    text-align:center;
    color:rgba(46,21,102,.5);
    background:#fff;
    box-shadow:inset 0 -1px 0 rgba(46,21,102,.15)
  }
  #headerAreaMobile .sub_page .header_inner .header_inner_top .dropdown_menu>li a.on {
    color:var(--man-color-03)
  }
  #headerAreaMobile .sub_page .header_inner .header_inner_top .dropdown_menu>li:first-child a {
    border-radius:8px 8px 0 0
  }
  #headerAreaMobile .sub_page .header_inner .header_inner_top .dropdown_menu>li:last-child a {
    border-radius:0 0 8px 8px
  }
  #headerAreaMobile .sub_page .header_inner .header_inner_top .all_menu {
    width:32px;
    height:32px;
    text-align:center;
    display:inline-flex;
    flex-direction:column;
    align-items:flex-end;
    gap:6px
  }
  #headerAreaMobile .sub_page .header_inner .header_inner_top .all_menu span {
    display:block;
    width:70%;
    height:2px;
    background:#161718
  }
  #headerAreaMobile .header_inner .header_inner_bottom {
    padding:0 5%;
    justify-content:normal;
    align-items:center;
    border-top:1px solid rgba(46,21,102,.1)
  }
  #headerAreaMobile .header_inner .header_inner_bottom nav {
    overflow:hidden;
    position:relative;
    height:46px
  }
  #headerAreaMobile .header_inner .header_inner_bottom nav h3 {
    font-weight:500;
    font-size:15px;
    line-height:46px;
    text-align:center;
    color:#2a1d39
  }
  .sub_visual .cell {
    display:table-cell;
    vertical-align:top;
    padding-top:40px;
    position:relative
  }
  #usp.usp_wrap .inner {
    padding:50px 5% 60px
  }
  #usp.usp_wrap .content_box {
    margin-top:24px
  }
  #usp h4.title {
    font-size:18px
  }
  #faq .inner {
    padding:60px 24px
  }
  #faq .faq_item span {
    font-size:22px
  }
  #faq .question {
    padding:16px 24px
  }
  #faq .question p {
    font-size:16px;
    width:78%
  }
  #faq .answer {
    padding:14px 24px 24px
  }
  #faq .answer p {
    font-size:14px;
    padding:0
  }
  #faq .question::after,#faq .question::before {
    right:24px;
    width:14px
  }
  .note_box {
    padding:24px 16px;
    margin-top:40px
  }
  .note_text {
    font-size:14px
  }

}

@media (min-width:768px) and (max-width:1024px) {
  .cell {
    display:table-cell;
    vertical-align:top;
    padding-top:40px
  }

}
/* 서브페이지 모바일 헤더: 원본 .sub_page(뒤로+카테고리 드롭다운+햄버거) 사용, 기본 헤더 숨김 + 페이지와 함께 스크롤 */
#headerAreaMobile > .header_inner{display:none}
#headerAreaMobile .sub_page .header_inner{position:absolute !important;left:0 !important;transform:none !important;background:#fff !important;border:0 !important;border-bottom:1px solid #E2E2E2 !important;box-shadow:none !important;backdrop-filter:none !important;-webkit-backdrop-filter:none !important}