@charset "utf-8";
/* 문자열설정 */
/* 폰트설정 */
@import url("../../fonts/NotoSansCJK/NotoSansCJK.css");
@import url("../../fonts/Roboto_KR/Roboto_KR.css");

.wrap {overflow: hidden;}
#content {margin-top: 100px; background: #fff; overflow: hidden;}

.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: -0.04em; margin-bottom: 1rem;}
.top_banner .inner p {font-size: 27px; letter-spacing: -0.1em;}
/****** content ******/
section .title_box .highlight{border-bottom: 10px solid #CFD4DB;display: inline-block;}

#faq .inner{padding: 80px 14.7%;}
#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; }
#faq .question::before,#faq .question::after{content: "";position: absolute;right: 56px;top: 50%;width: 16px;height: 2px;background-color:var(--black-color-950) ;transition: transform 0.3s;}
#faq  .question::after {transform: rotate(90deg);}
#faq .question p{ font-size: 24px;font-weight: 500;}
#faq .answer{padding: 16px 56px;}
#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 영역 [S]***/
.usp_wrap h4.title{font-size: 48px;letter-spacing: -0.02em;font-weight: 400;}
.usp_wrap .title_box{text-align: center;}
.usp_top .inner{padding: 140px 0;}
.usp_wrap .content_box{margin-top: 100px;}
.usp_bottom .inner{padding: 110px 14.7% 60px;}
.usp_top .point_list li{background-repeat: no-repeat; background-position: center; background-size: cover;
    background-color: rgba(96, 96, 96, 0.70);background-blend-mode:darken;aspect-ratio: 1 /1;}
.usp_top .point_list li:nth-child(6n+1) {background-image:url(../../common/images/bg_proposition_01.jpg);}
.usp_top .point_list li:nth-child(6n+2) {background-image:url(../../common/images/bg_proposition_02.jpg);}
.usp_top .point_list li:nth-child(6n+3) {background-image:url(../../common/images/bg_proposition_03.jpg);}
.usp_top .point_list li:nth-child(6n+4) {background-image:url(../../common/images/bg_proposition_04.jpg);}
.usp_top .point_list li:nth-child(6n+5) {background-image:url(../../common/images/bg_proposition_05.jpg);}
.usp_top .point_list li:nth-child(6n)   {background-image:url(../../common/images/bg_proposition_06.jpg);}
.usp_top .text_box{padding: 32px 0 25px;color: #fff; text-align:center;letter-spacing: -0.02em; display: flex; flex-direction: column; justify-content: space-between;height: 100%;}
.usp_top .text_box h5{font-size: 32px;line-height: 1.4;}
.usp_top .text_box .sub_title{font-size: 18px;line-height: 1.6;}
.usp_top .text_box .desc_text{font-size: 14px;line-height: 1.4;margin-top:auto;}
.usp_wrap .swiper-container{position: relative;padding-bottom:40px;}
.usp_wrap .swiper-pagination{display: none;top: auto;bottom: 0 !important;}
.usp_wrap .swiper-pagination .swiper-pagination-bullet{background: var(--man-color-06) !important; opacity: 1; width:10px;height: 10px;}
.usp_wrap .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{background: var(--man-color-03) !important;width: 20px; border-radius: 30px;}

.usp_bottom{background: #f8f8f8;}
.usp_bottom .swiper-wrapper{display: flex; justify-content: space-between; align-items: flex-start; gap: 20px;}
.usp_bottom .link_box{flex:1;}
.usp_bottom .link_box h5{font-size: 18px;line-height: 47px; background-color: var(--man-color-05);text-align: center;}
.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_bottom .link_list li:last-of-type a{border-bottom: none;}
.usp_bottom .link_list img{width:70px; height: 70px; border-radius: 9px;}
.usp_bottom .link_title{font-size: 14px; line-height: 1.4; letter-spacing: -0.02em; width: 60%;}
.usp_bottom .more_text{font-size: 12px;font-weight: 700;color: var(--man-color-03); transition: all .2s;}
.usp_bottom .link_list li a:hover .more_text{transform:translateX(2px);}
/*** 하단 USP 영역 [E]***/


@media screen and (max-width:1760px) {
    .usp_bottom .inner{padding: 110px 10% 60px;}
}
/* PC (해상도 1440px ~ 1540px) */
@media screen and (max-width:1540px) {
    .line_map {padding: 56px 12% 40px;}
    .usp_bottom .inner{padding: 110px 5% 60px;}
}
/* PC (해상도 1058px ~ 1440px) */
@media screen and (max-width:1440px) {
    .line_map {padding: 56px 8% 40px;}
    .usp_bottom .swiper-wrapper{flex-wrap: wrap;width: 70%;margin: 0 auto;}
    .usp_bottom .link_box{flex:none; width: 48%;}
}
/* PC (해상도 1024px ~ 1058px) */
@media screen and (max-width:1058px) {
    .line_map {padding: 56px 6% 40px;}
}

/* 태블릿 (해상도 769px ~ 1024px) */
@media screen and (max-width:1024px) {
    #content {margin-top: 94px;}
    /* content */
    .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_wrap .inner{padding: 80px 5% 60px;}
    .usp_wrap .content_box{margin-top: 64px;}
    .usp_wrap h4.title{font-size: 30px;}
    .usp_wrap .swiper-pagination{display: block;}
    .usp_bottom .swiper-wrapper{gap: 0;}
    .usp_bottom .swiper-wrapper{flex-wrap: nowrap;width: 100%;}
    .usp_bottom .link_box{flex:none; width: 100%;}



}

/* 모바일 가로, 모바일 세로 (해상도 375px ~ 768px)*/
@media screen and (max-width:767px) {
    .wrap { min-width: 375px; }
    /* content */
    #content {margin-top: 62px;}
    .line_map {display: none;}

    /* header */
    #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: 0px 4px 8px rgba(116, 53, 255, 0.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: -0.01em; text-align: center; color: rgba(46, 21, 102, 0.5);
        background: #FFFFFF; box-shadow: inset 0px -1px 0px rgba(46, 21, 102, 0.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: 0px 5%; justify-content: normal; align-items: center; border-top: 1px solid rgba(46, 21, 102, 0.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_wrap .inner{padding: 50px 5% 60px;}
    .usp_wrap .content_box{margin-top: 24px;}
    .usp_wrap 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::before,#faq .question::after{right: 24px;width: 14px;}

    .note_box{padding: 24px 16px;margin-top: 40px;}
    .note_text{font-size: 14px;}
}

/* 2025010 추가*/

/* PC 에서만 보이도록 설정*/
.show-pc,.hide-mobile{display: block;}

.show-mobile, .show-tablet,.hide-pc{display: none;}

@media screen and (max-width:1024px) {
    .hide-pc{display: block;}
}

@media (min-width: 768px) and (max-width: 1024px){
    /* Tablet 에서만 보이도록 설정*/


    .show-tablet{display: block;}
    .show-mobile,.show-pc{display: none;}

    .cell {display: table-cell;vertical-align: top;padding-top:40px;}
}

@media (max-width: 767px){
    /* Mobile 에서만 보이도록 설정*/
    .show-mobile{display: block;}
    .show-tablet,.show-pc,.hide-mobile{display: none;}


}