@charset "utf-8";
/**************************************** 작은 모니터, 노트북 ****************************************/

@media screen and (max-width: 1200px){
    /********** 공통사항 **********/
    .inner{width:calc(100dvw - 120px);}
    .tinner {width:calc(100dvw - 120px);}

    /**************************
    ** header
    **************************/

    /**************************
    ** index
    **************************/
    /** mainBanner **/
    .mainBannerBg {background:url('/img/mainBanner-t.jpg'); background-position:center; background-size:cover;}
    /** about **/
    .aboutSlideGroup{--about-slide-gap:24px; --about-slide-visible-count:5.4; --about-slide-visible-gap-count:5; overflow:hidden;}
    .aboutCrown {right:20px; top:-20px;}
    /** review **/
    .reviewMarquee{--review-slide-gap:20px; --review-visible-count:3; --review-profile-width:72px; margin-top:64px;}
    /** benefit **/
    .benefitCnts{grid-template-columns:1fr;}
    .benefitCol{display:contents;}
    .benefitCnt1{order:1;}
    .benefitCnt2{order:2;}
    .benefitCnt3{order:3;}
    .benefitCnt4{order:4;}
    .benefitCnt5{order:5;}
    .benefitBg {border-radius:0 0 0 160px;}
    /** step **/
    .stepCnt6 {background:url('/img/step-t-006.png'); background-position:center; background-size:cover;}
    /** item **/
    .itemCnts{grid-template-columns:repeat(4, minmax(0, 1fr));}
    /** subBanner **/
    .subBannerSet{gap:28px; padding-right:28px;}
    /** faq **/
    .faqItem.is-open .faqCnt{padding-bottom:20px;}
    .faqPanelInner{padding:0 24px 24px;}
    /**************************
    ** footer
    **************************/

    /**************************
    ** contact
    **************************/
    /** list **/
    .listRowsWrap{width:100%;}
    .listRowsWrap{--list-fade-size:88px; --list-fade-soft:22px;}
    .listRow{grid-template-columns:64px minmax(0, 1fr) minmax(0, 1fr) 48px auto; gap:12px;}
    .listBgTxt{left:-12px; bottom:-8px;}
    /** view **/
    /** write **/

    
}

/**************************************** 큰태블릿 사이즈 ****************************************/

@media screen and (max-width: 1024px){


}


/**************************************** 큰모바일 사이즈 ****************************************/

@media screen and (max-width: 768px){
    .inner{width:calc(100dvw - 40px);}
    .tinner {width:calc(100dvw - 40px);}
    /**************************
    ** header
    **************************/

    /**************************
    ** index
    **************************/
    /** mainBanner **/
    .mainBannerBg {background:url('/img/mainBanner-m.jpg'); background-position:center; background-size:cover;}
    /** about **/
    .aboutSlideGroup{--about-slide-gap:24px; --about-slide-visible-count:3.8; --about-slide-visible-gap-count:5; overflow:hidden;}
    .aboutCrown {right:16px; top:-16px;}
    /** review **/
    .reviewMarquee{--review-slide-gap:16px; --review-visible-count:1.5; --review-profile-width:64px; margin-top:48px;}
    /** item **/
    .itemCnts{grid-template-columns:repeat(3, minmax(0, 1fr));}
    .itemCnt{padding:24px 16px;}
    .itemModalPanel{width:min(92vw, 640px);}
    .itemModalClose{top:4px; right:0;}
    /** benefit **/
    .benefitBg {border-radius:0 0 0 80px;}
    /** step **/
    .stepCnts {grid-template-columns:repeat(1, 1fr);}
    .stepCnt6 {background:url('/img/step-m-006.png'); background-position:center; background-size:cover;}
    /** step **/
    .placeCnts {min-height:320px; max-height:320px;}
    /** subBanner **/
    .subBannerSet{gap:20px; padding-right:20px;}
    /** faq **/
    .faqItem.is-open .faqCnt{padding-bottom:16px;}
    .faqPanelInner{padding:0 20px 20px;}
    /**************************
    ** footer
    **************************/

    /**************************
    ** contact
    **************************/
    /** list **/
    .listRows{gap:10px;}
    .listRowsWrap{--list-fade-size:68px; --list-fade-soft:18px;}
    .listRow{padding:16px 12px; grid-template-columns:48px minmax(0, .9fr) minmax(0, 1.1fr) 36px auto; gap:4px;}
    .listCellDate,
    .listCellService,
    .listCellPhone,
    .listCellName,
    .listStatus{grid-column:auto; grid-row:auto;}
    .listCellName{text-align:center;}
    .listStatus{justify-self:end; align-self:center;}
    .listBgTxt{left:-8px; bottom:-4px; opacity:.14;}
    /** contact **/
    .contactPolicyIcon{width:20px; height:20px;}
    /** view **/
    /** write **/

}


/**************************************** 작은모바일 사이즈 ****************************************/

@media screen and (max-width: 568px){

}