@charset "UTF-8";



/***
**************************************** 서브페이지 메인 ***********************************************
*/
.cl_subMainVisual{position: relative; width: 100%; height: 879px; background-repeat: no-repeat; background-position: center; background-size: cover;}
.cl_subMainVisual .imgWrap { position: absolute; top: calc(50% - 57px); left: 50%; transform: translate(-50%, -50%); max-width: 282px; width: 100%; text-align: center;}
.cl_subMainVisual .imgWrap img{width: 100%; display: block;}


.cl_subMainVisual .titleWrap { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; text-align: center;}
.cl_subMainVisual .titleWrap .mainTitle{color: #232323; font-size: 25px;font-family: 'kudryashev-d-excontrast-sans'; margin-bottom: 10px;}
.cl_subMainVisual .titleWrap .mainText{color: #232323; font-size: 40px;font-family: 'SUITR'; line-height: 1.5;}
.cl_subMainVisual .titleWrap.cWhite .mainTitle{color: #fff;}
.cl_subMainVisual .titleWrap.cWhite .mainText{color: #fff;}


/***
**************************************** 텝 페이지 및 텝 버튼  ***********************************************
*/
.cl_tabBtnArea { display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap; box-sizing: border-box; margin-bottom: 24px; background-color: #fff;}
.cl_tabBtnArea .tabBtn {width: calc(100% / 3 - 2px); flex: none; display: flex; justify-content: center ;align-items: center; border: 1px solid #d6d6d6; }
.cl_tabBtnArea .tabBtn a {color: #9d9d9d;font-size: 20px; font-family: 'SUITR';width: 100%; height: 100%; display: block;text-align: center; padding: 22px 0; box-sizing: border-box; cursor: pointer; }

.cl_tabBtnArea .tabBtn a:hover,
.cl_tabBtnArea .tabBtn.on {border-color:#c69c6d;}
.cl_tabBtnArea .tabBtn a:hover,
.cl_tabBtnArea .tabBtn.on a { color: #fff; background-color: #c69c6d;}



/***
**************************************** FAQ  ***********************************************
*/
.cl_faqPart {padding: 130px 0; background-color: #fcfcfc;}
.cl_faqPart .titleWrap{text-align: center; margin-bottom: 55px;}
.cl_faqPart .titleWrap .mainText{font-size: 40px; font-family: 'SUITR'; line-height: 1.25;}
.cl_faqPart .titleWrap .mainText .cPoint{color: #c69c6d;}
.cl_faqPart .titleWrap .mainText .bold{font-family: 'SUITEB';}
.cl_faqPart .faqWrap {display: flex; flex-direction: column; gap: 40px; padding-inline: 14px; box-sizing: border-box;}
.cl_faqPart .faqWrap li.on .answerArea {display: block;}
.cl_faqPart .faqWrap li.on .questionArea .iconArrow{text-align: right; transform: rotate(0);}
.cl_faqPart .faqWrap .questionArea {display: flex; align-items: center; justify-content: space-between; padding: 15px 0; box-sizing: border-box;border-bottom: 1px solid #cbcbcb;}
.cl_faqPart .faqWrap .questionArea .mainText{color: #1e1e1e;font-size: 24px; font-family: 'NotoSansB';}
.cl_faqPart .faqWrap .questionArea .mainText .cPoint{color: #c69c6d;}
.cl_faqPart .faqWrap .questionArea .iconArrow{display: flex; align-items: center; transform: rotate(180deg);}
.cl_faqPart .faqWrap .questionArea .iconArrow img{width: 26px; height: 16px;}
.cl_faqPart .faqWrap .answerArea {display: none; padding: 20px 0; box-sizing: border-box;}
.cl_faqPart .faqWrap .answerArea .subText{color: #2b2b2b;font-size: 20px;font-family:'NotoSansR'; line-height: 1.5;}



@media (max-width: 1024px) {
    /***
    **************************************** 서브페이지 메인 ***********************************************
    */

    .cl_subMainVisual {height: 950px;}


    /***
    **************************************** 텝 페이지 및 텝 버튼  ***********************************************
    */
    .cl_tabBtnArea { margin-bottom: 20px;}
    .cl_tabBtnArea .tabBtn a {font-size: 18px;padding: 8px 0;}


    /***
    **************************************** FAQ  ***********************************************
    */
    .cl_faqPart .faqWrap {padding-inline: 0;}
}


@media (max-width: 768px) {
    /***
    **************************************** 서브페이지 메인 ***********************************************
    */

    .cl_subMainVisual {height: 475px;}
    .cl_subMainVisual .imgWrap {max-width: 158px; top: 50%;}

    .cl_subMainVisual .titleWrap .mainTitle {font-size: 12px; margin-bottom: 0;}
    .cl_subMainVisual .titleWrap .mainText {font-size: 20px;}


    /***
    **************************************** 텝 페이지 및 텝 버튼  ***********************************************
    */
    .cl_tabBtnArea { margin-bottom: 10px;}
    .cl_tabBtnArea .tabBtn a { font-size: 9px;padding: 4px 0;}


    /***
    **************************************** FAQ  ***********************************************
    */
    .cl_faqPart {padding: 60px 0;}
    .cl_faqPart .titleWrap {margin-bottom: 25px;}
    .cl_faqPart .titleWrap .mainText {font-size: 25px;}
    .cl_faqPart .faqWrap {gap: 25px;}
    .cl_faqPart .faqWrap .questionArea {padding: 7px 0;}
    .cl_faqPart .faqWrap .questionArea .mainText {font-size: 12px;}
    .cl_faqPart .faqWrap .questionArea .iconArrow img {width: 12px; height: 7px;}
    .cl_faqPart .faqWrap .answerArea {padding: 10px 0;}
    .cl_faqPart .faqWrap .answerArea .subText {font-size: 10px;}

}