@charset "utf-8";
/* *******************************************************
 * filename : main_responsive.css
 * description : 메인 레이아웃 및 컨텐츠 반응형 CSS
 * date : 2022-06-03
******************************************************** */

@media all and (max-width: 1280px) {
    /* 공통 :: 레이아웃 */
    #fullpage .section {
        height: auto !important;
    }
    #fullpage .fp-section .fp-tableCell {
        height: auto !important;
    }
}
/* ******************  메인 비주얼 ********************** */
@media all and (max-width: 1280px) {
    #fullpage #mainVisual {
        height: 100vh !important;
    }
    .main-visual-txt-box .main-visual-txt img {
        max-width: 100%;
    }
}
@media all and (max-width: 950px) {
    /* 메인 비주얼 :: 비주얼영상 */
    .video-wrapper {
        background: url(/images/main/main_visual_01_m.jpg) no-repeat 50% 50%;
        background-size: cover;
    }
}
@media all and (max-width: 550px) {
    /* 메인 비주얼 :: 비주얼영상 */
    .video-wrapper {
        background: url(/images/main/main_visual_02_m.jpg) no-repeat 50% 50%;
        background-size: cover;
    }
}
@media all and (max-width: 820px) {
    /* 메인 비주얼 :: 이미지 */
    .main-visual-item .main-visual-pc-img {
        display: none;
    }
    .main-visual-item .main-visual-m-img {
        display: block;
    }
    /* 메인 비주얼 :: 텍스트 */
    .main-visual-txt-con {
        top: 0;
    }
    .main-visual-txt-con .main-visual-txt-box {
        display: flex;
        align-items: center;
        flex-direction: column-reverse;
        justify-content: center;
        height: 100%;
        padding-bottom: 0;
    }
    .main-visual-txt-inner {
        text-align: center;
        margin-bottom: 3.2rem;
        transition: all 0.3s;
        opacity: 0;
        transform: translateY(-5rem);
    }
    .main-visual-txt-box .main-visual-txt .hidden-item {
        opacity: 1;
        transform: none;
    }
    .main-visual-txt-box .main-visual-txt {
        font-size: 5rem;
    }
    .main-visual-txt-box .main-visual-txt img {
        max-width: 70%;
    }

    .active .main-visual-txt-inner {
        opacity: 1;
        transform: translateY(0);
    }

    /* 메인 비주얼 :: controls */
    .visual-controls {
        display: block;
        text-align: center;
    }
    .visual-controls .visual-line-box {
        display: none;
    }
    .visual-controls .play-controls-btn {
        margin-left: 0;
        margin-top: 1.6rem;
        font-size: 3rem;
    }
    .main-scroll-icon {
        display: block;
    }
}

/* ******************  메인 컨텐츠 :: 공통 ********************** */
@media all and (max-width: 800px) {
    /* 공통 :: 타이틀 */
    .main-tit-box {
        margin-bottom: 8.4rem;
    }
    .main-section-cate {
        font-size: 1.6rem;
    }
    .main-big-tit {
        font-size: 5.4rem;
    }
    .main-sm-tit {
        font-size: 4.2rem;
    }
    .main-sub-txt {
        font-size: 1.5rem;
    }
    .main-sub-txt2 {
        margin-top: 2rem;
    }
    .main-sub-txt2 + .main-detail-btn {
        margin-top: 5rem;
    }
    /* 공통 :: 버튼 */
    .main-detail-btn {
        margin-top: 7rem;
    }
    .main-detail-btn .txt {
        display: none;
    }
    .main-detail-btn .icon {
        margin-left: 0;
    }
}

/* ******************  MAIN :: 특장점 ********************** */
@media all and (max-width: 1280px) {
    #mainFeatureCon .main-feature-container {
        /* height: 60rem; */
        padding: 10rem 0;
    }
    #mainFeatureCon .main-feature-container .main-tit-box {
        /* width: 38rem; */
    }
}
@media all and (max-width: 800px) {
    #mainFeatureCon {
        height: auto !important;
        padding-bottom: 0;
        padding: 8rem 0 10.6rem;
    }
    #mainFeatureCon .main-feature-container {
        display: block;
        padding: 0;
        padding-top: 10rem;
        height: auto;
    }
    #mainFeatureCon .main-feature-container .main-tit-box {
        width: auto;
    }
}
@media all and (max-width: 950px) {
    #mainFeatureCon .main-feature-container .feature-square-box {
        grid-template-columns: 1fr 1fr;
    }
}

@media all and (max-width: 550px) {
    #mainFeatureCon .main-feature-container .feature-square-box {
        grid-template-columns: 1fr;
    }

    #mainFeatureCon .main-feature-container .feature-square-box .square-item {
        height: auto;
        padding: 4rem 2rem;
    }
    #mainFeatureCon .main-feature-container .feature-square-box .square-item .txt-box {
        margin-top: 2.5rem;
    }
    #mainFeatureCon .main-feature-container .feature-square-box .square-item .img-box {
        min-height: auto;
    }
}

/* ******************  MAIN :: 신청 ********************** */
@media all and (max-width: 1280px) {
    #mainApplyCon .main-apply-container {
        /* height: 60rem; */
        /* padding: 10rem 0; */
    }
}
@media all and (max-width: 800px) {
    #mainApplyCon {
        height: auto !important;
        padding-bottom: 0;
        padding: 8rem 0 10.6rem;
    }
    #mainApplyCon .main-apply-container .main-tit-box {
        width: auto;
    }

    #mainApplyCon .apply-sequence-list-con {
        margin-top: 0;
    }
    #mainApplyCon .apply-sequence-list-con ul {
        flex-wrap: wrap;
        /* margin: 0 -1.2rem; */
    }

    #mainApplyCon .apply-sequence-list-con ul li.first-item {
        width: 100%;
        margin-bottom: 1.7rem;
    }

    #mainApplyCon .apply-sequence-list-con ul li {
        width: calc(50% - 2.4rem);
        margin: 0 1.2rem 2rem;
        font-size: 1.8rem;
        /* background: url(/images/main/chaevizone_spec_list_bg.jpg) no-repeat 100% 0; */
        /* background-size: cover; */

        /* border-radius: 10%; */
        /* box-shadow: 0px -4px 66.5px 3.5px rgba(4, 6, 25, 0.05); */
    }

    #mainApplyCon .apply-sequence-list-con ul li:before,
    #mainApplyCon .apply-sequence-list-con ul li:after {
        left: 50%;
        top: 100%;
        margin-top: 1rem;
        margin-left: -3px;
    }
    #mainApplyCon .apply-sequence-list-con ul li:before,
    #mainApplyCon .apply-sequence-list-con ul li:after {
        display: none;
    }
    #mainApplyCon .apply-sequence-list-con ul li.first-item:before,
    #mainApplyCon .apply-sequence-list-con ul li.first-item:after {
        display: block;
    }

    #mainApplyCon .apply-sequence-list-con ul li .icon {
        width: 5rem;
        height: 5rem;
    }

    #mainApplyCon .sequence-stit {
        display: none;
    }

    #mainApplyCon .main-apply-tit {
        margin-top: 1rem !important;
    }

    #mainApplyCon .apply-write-box {
        width: 100%;
    }
}

/* ******************  MAIN :: APP ********************** */
@media all and (max-width: 1280px) {
    #mainAppCon .main-app-container {
        height: 60rem;
        padding: 10rem 0;
    }
    #mainAppCon .main-app-gallery-wrapper {
        margin-right: -9rem;
    }
    #mainAppCon .main-app-rolling-con {
        transform: scale(0.8);
    }
}
@media all and (max-width: 800px) {
    #mainAppCon {
        height: auto !important;
        padding-bottom: 0;
        padding: 8rem 0 10.6rem;
    }
    #mainAppCon .main-app-bg {
        display: none;
    }
    #mainAppCon .main-app-container {
        display: block;
        padding: 0;
        padding-top: 10rem;
        height: auto;
    }
    #mainAppCon .main-app-container .main-tit-box {
        width: auto;
    }
}

/* ******************  MAIN :: CHARGE ********************** */
@media all and (max-width: 1280px) {
    #mainChargeCon {
        padding: 10rem 0;
    }
    #mainChargeCon .main-charge-bg {
        /* display: none; */
    }
    #mainChargeCon .charge-compre-item {
        width: 30rem;
    }
    #mainChargeCon .charge-compre-item .charege-compare-tit b {
        font-size: 4.4rem;
    }
}
@media all and (max-width: 800px) {
    #mainChargeCon {
        background: url(/images/main/main_charge_bg_m.jpg) no-repeat 0 0;
        background-size: 100% auto;
    }
    #mainChargeCon .main-charge-container {
        display: block;
    }
    #mainChargeCon .charge-compre-item {
        width: 50vw;
    }
}
@media all and (max-width: 640px) {
    #mainChargeCon .charge-compare-con {
        display: block;
    }
    #mainChargeCon .charge-compre-item {
        width: auto;
        margin: 0;
    }
}

/* ******************  MAIN ::  Parter ********************** */
@media all and (max-width: 1280px) {
    #mainPartnerCon {
        padding: 8rem 0 10.6rem;
    }
    #mainPartnerCon .brand-partner-item dd {
        justify-content: space-between;
    }
}
@media all and (max-width: 800px) {
    #mainPartnerCon .main-partner-container .main-tit-box {
        text-align: center;
        margin-bottom: 6.4rem;
    }

    #mainPartnerCon .brand-partner-item {
        flex-wrap: wrap;
    }
    #mainPartnerCon .brand-partner-item dt {
        width: 100%;
        border-bottom: 1px solid #eee;
        margin-bottom: 1rem;
    }
    #mainPartnerCon .brand-partner-item dt:before {
        background-size: 70% auto;
    }
    #mainPartnerCon .brand-partner-item dd {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        width: auto;
        margin: 0 -1rem;
    }
    #mainPartnerCon .brand-partner-item dd span {
        display: flex;
        align-items: center;
        margin: 1rem;
        width: calc(25% - 2rem);
    }
    #mainPartnerCon .brand-partner-item dd span img {
        max-width: 100%;
    }
}
@media all and (max-width: 650px) {
    #mainPartnerCon .brand-partner-item span {
        width: 150px;
    }
}
@media all and (max-width: 470px) {
    #mainPartnerCon .brand-partner-item span {
        width: 100px;
    }
}

/* ******************  메인 :: 오른쪽 퀵메뉴 (Fullpage) ********************** */
@media all and (max-width: 1280px) {
    #fp-nav {
        display: none !important;
    }
}

/* ******************  메인 :: 팝업 ********************** */
@media all and (max-width: 470px) {
    .fixed-popup-inner-container {
        width: 100%;
    }
}