body html { color: #202020}

.showMobile {display:none;}

.contentWrap { width: 100%; max-width: 1200px; margin: 0 auto;}

.cl_pageWrap { padding: 150px 0; box-sizing: border-box;}
.cl_collasterTitle { font-size: 50px; font-family: 'PretendardT'; text-align: center; margin-bottom: 50px;}
.cl_collasterTitle .bold{ font-family: 'PretendardSB';}
/*
    ****************** 헤더 ******************
*/

.header { position: relative; display: flex; align-items: center; justify-content: space-between; height: 100px;}
.header .gnb .menuList { display: flex;}
.header .gnb .menuList .list { position: relative; font-size: 20px; font-family: 'PretendardM'; text-align: center; display: flex; align-items: center; justify-content: center; padding: 41px 0; box-sizing: border-box;  margin-right: 45px;}
.header .gnb .menuList .list:last-child { margin-right: 0;}
.header .gnb .menuList .list a { color: #202020}
.header .gnb .menuList .list a .point{ color: #fff; font-size: 15px; font-family: 'PretendardM'; display: inline-block; margin-bottom: 5px; padding: 4px 5px; box-sizing: border-box; border-radius: 50px;  background-color: #393a39;}

/*.header .gnb .menuList .list.on:hover .subList{ display: block;}*/

.header .gnb .menuList .subList { display: none; position: absolute; top: 103px; left: -24px; width: 182px; padding: 20px; box-sizing: border-box; background-color: #fff; z-index: 10}
.header .gnb .menuList .subList li { margin-bottom: 25px; font-size: 16px;}
.header .gnb .menuList .subList li:last-child { margin-bottom: 0;}


.header .globalWrap { position: relative}
.header .globalWrap .global {  display: flex;  justify-content: center; cursor: pointer;}
.header .globalWrap .global .text { font-size: 20px; font-family: 'PretendardM';  margin: 0 10px;}
.header .globalWrap.on .listArea{ display: block;}
.header .globalWrap .listArea { display: none; position: absolute; top: 60px; left: -20px; width: 180px;  background-color: #fff; padding:  20px; box-sizing: border-box; z-index: 10}
.header .globalWrap .listArea .list a  { display: flex; align-items: center; font-family: 'PretendardM'; font-size: 16px; cursor: pointer;}
.header .globalWrap .listArea .list a img { margin-right: 10px;}
.header .globalWrap .listArea .list { margin-bottom: 20px;}
.header .globalWrap .listArea .list:last-child { margin-bottom: 0;}

.mobileMenuWrap { display: none;}
/*
.header .gnaArea { display: flex ; align-items: center}
.header .gnaArea .infoArea { display: flex;}
.header .gnaArea .infoArea .basketArea { position: relative;}
.header .gnaArea .infoArea .basketArea .basketNum{ position: absolute;top: 0; right: 0;}
*/

/*
    ****************** 푸터 ******************
*/
.footerWrap { background-color: #3a3a3a;}
.footerWrap .footer { display: flex; align-items: center; ;font-size: 16px; font-family: 'PretendardL'; color: #848484}
/*.footerWrap .footer .leftArea .logo  { margin-bottom: 45px;}*/

.footerWrap .footer .leftArea .address .text { margin-bottom: 15px;}
.footerWrap .footer .leftArea .address .text:last-child { margin-bottom: 0;}
.footerWrap .footer .leftArea .address .text:last-child { margin-bottom: 0;}

.footerWrap .footer .midArea { line-height: 1.4; margin-left: 100px; margin-right: 250px; text-align: center;}
.footerWrap .footer .address .text.tradeMarkComment {margin-top:20px; font-size:13px;}

.footerWrap .footer .rightArea { display: flex; color: #fff; }
.footerWrap .footer .rightArea .callNumber { margin-right: 110px;}
.footerWrap .footer .rightArea ul li { margin-bottom: 15px;}
.footerWrap .footer .rightArea ul li:last-child { margin-bottom: 0;}
.footerWrap .footer .rightArea ul a { color: #fff;}

/*
    ****************** 메인  ******************
*/

/* 메인비주얼 */

.mainVisualWrap .mainVisual img {  width: 100%;}
.mainVisualWrap .swiper-pagination-bullet { background-color: transparent; border: 1px solid #fff; opacity: 1}
.mainVisualWrap .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: #fff;}

/* collasterLine */
.collasterLine .titleArea { text-align: center; margin-bottom: 150px;}
.collasterLine .subText { font-size: 30px; font-family: 'PretendardR'; color: #aeaeae; margin-bottom: 10px;}
.collasterLine .mainText { font-size: 40px; font-family: 'PretendardB'; }
.collasterLine .mainText span { font-family: 'PretendardL';}
.collasterLine .collasterSwiper { position: relative;}
.collasterLine .collasterSwiper .slideArea img { width: 100%}
.collasterLine .collasterSwiper .slideArea .textArea { font-size: 20px; font-family: 'PretendardR'; color: #aeaeae;  margin-top: 15px; text-align: center; }
.collasterLine .collasterSwiper .slideArea .textArea span { display: block; font-size: 25px; font-family: 'PretendardB'; color: #202020; margin-bottom: 5px;}
.collasterLine .collasterSwiper .swiper-pagination { display: none;}
.collasterLine .collasterSwiper .collasterBtn:after { display: none;}
.collasterLine .collasterSwiper .collasterBtn { top: 42%;}
.collasterLine .collasterSwiper .collasterBtn.next { right: -25px; background: url("/app/layout/web/images/arrowIconR.png") no-repeat center center; width: 50px; height: 50px; background-size: cover;}
.collasterLine .collasterSwiper .collasterBtn.prev { left: -25px; background: url("/app/layout/web/images/arrowIconL.png") no-repeat center center; width: 50px; height: 50px; background-size: cover;}

/* collasterReviewWrap */
.collasterReviewWrap { background-color: #f6f6f6;}
.collasterReviewWrap .reviewAreaWrap .reviewArea.m { display: none;}
.collasterReviewWrap .reviewAreaWrap .reviewArea { display: flex;}
.collasterReviewWrap .reviewAreaWrap .reviewArea .reviewGrid { margin-right: 10px;}
.collasterReviewWrap .reviewAreaWrap .reviewArea .reviewGrid:last-child { margin-right: 0;}
.collasterReviewWrap .reviewAreaWrap .reviewArea .reviewGrid img { width: 100%; height: 100%; display: block; /*position: relative; z-index: -1;*/}
.collasterReviewWrap .reviewAreaWrap .reviewArea .reviewGrid.type1 { display: flex; flex-direction: column; align-items: center; justify-content: space-between}
.collasterReviewWrap .reviewAreaWrap .reviewArea .reviewGrid.type1 .img:first-child { margin-bottom: 10px;}
.collasterReviewWrap .reviewAreaWrap .reviewArea .reviewGrid.type3 { display: flex; flex-direction: column; align-items: center; justify-content: space-between}
.collasterReviewWrap .reviewAreaWrap .reviewArea .reviewGrid.type3 .img:first-child { margin-bottom: 10px;}
.collasterReviewWrap .reviewAreaWrap .reviewArea .reviewGrid.type3 .img.flex { display: flex;}
.collasterReviewWrap .reviewAreaWrap .reviewArea .reviewGrid.type3 .img.flex div { margin-right: 10px;}
.collasterReviewWrap .reviewAreaWrap .reviewArea .reviewGrid.type3 .img.flex div:last-child { margin-right: 0;}

.collasterReviewWrap .reviewAreaWrap .reviewArea .reviewGrid.type4 {  display: flex; flex-direction: column;}
.collasterReviewWrap .reviewAreaWrap .reviewArea .reviewGrid.type4 > div { display: flex;}
.collasterReviewWrap .reviewAreaWrap .reviewArea .reviewGrid.type4 > div:first-child { margin-bottom: 10px;}
.collasterReviewWrap .reviewAreaWrap .reviewArea .reviewGrid.type4 > div .img:first-child { margin-right: 10px;}

.collasterReviewWrap .reviewAreaWrap .reviewArea .reviewBox { display: flex; width: 100%; justify-content: flex-start;}
.collasterReviewWrap .reviewAreaWrap .reviewArea .reviewBox > div {margin-right: 10px; /*position: relative;*/ width:calc(100% / 4);}
.collasterReviewWrap .reviewAreaWrap .reviewArea .reviewBox:last-child {margin-right: 0px;}

/* collasterReviewWrap */
.youtubeWrap .iframe img { width: 100%}
/*iframe 시 주석 풀기*/
/*
.youtubeWrap .youtubeArea .iframe { position: relative; padding-bottom: 56.25%}
.youtubeWrap .youtubeArea .iframe iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
*/

/* infoTextWrap */
.infoTextWrap { background-color: #f6f6f6;}
.infoTextWrap .text { display: flex; align-items: center; justify-content: center;font-size: 40px; font-family: 'PretendardR';}
.infoTextWrap .text span { display: flex; align-items: center; justify-content: center; font-family: 'PretendardSB'; padding: 5px 10px; margin: 0 10px; box-sizing: border-box; /*border: 1px solid #070002;*/}

/*
    ****************** 서브 페이지  ******************
*/

.subVisual { width: 100%; max-width: 1920px; /*height: 9886px;*/ text-align: center; margin: 0 auto; background-size: cover; background-position: center top ; background-repeat: no-repeat;}
.subVisual.brightening { background-image: url("/app/layout/web/images/brighteningVisualNew.jpg");}
.subVisual.original { background-image: url("/app/layout/web/images/originalVisualNew.jpg");}
.subVisual.pore { background-image: url("/app/layout/web/images/poreVisualNew.jpg");}
.subVisual.nexosome { background-image: url("/app/layout/web/images/nexosomeNew.jpg");}
.subVisual.acSolution { background-image: url("/app/layout/web/images/acSolutionVisualNew.jpg");}
.subVisual.pdrn { background-image: url("/app/layout/web/images/pdrnVisualNew.jpg");}


/*
    ****************** findUs  ******************
*/

.findUs .subVisual img { width: 100%; }
.findUs .subVisual { height: auto; }

.findUs .tabArea { background: #393939; width: 100%; height: 60px; margin-bottom: 70px; }
.findUs .tabArea ul { width: 100%; height: 100%; max-width: 1200px; display: flex; align-items: center; margin: 0 auto;}
.findUs .tabArea ul li { height: 100%; width: calc(100%/7); text-align: center; }
.findUs .tabArea ul li.on { background: #afafaf; }
.findUs .tabArea ul li a { display: block; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 20px; font-family: 'PretendardB'; }

.findUs .contentWrap .pageTitle { display: flex; align-items: center; gap: 20px; font-size: 40px; color: #202020; font-family: 'PretendardB'; margin-bottom: 30px; }
.findUs .contentWrap .pageTitle .icon { display: flex; align-items: center; }

.findUs .contentWrap .gridWrapper {overflow:hidden; margin-bottom: 150px; }
.findUs .contentWrap .grid {display:flex; flex-wrap:wrap; padding:10px 0 0 10px; }
.findUs .contentWrap .grid .gridCell {box-sizing:border-box;width:calc(100% / 4);border:0 solid transparent;border-width:0 20px 20px 0;}
.findUs .contentWrap .grid .gridCell .gridBox { display: flex; align-items: center; justify-content: center; height: 175px; border: 1px solid #d0d0d0; border-radius: 10px; box-sizing: border-box; }
.findUs .contentWrap .grid .gridCell .gridBox.on { background: #eeeeee; border: 3px solid #393939; }
.findUs .contentWrap .grid .gridCell .gridBox a { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; color: #202020; font-size: 30px; font-family: 'PretendardB'; }
.findUs .contentWrap .grid .gridCell .gridBox a:hover { border: 2px solid #888; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2); background-color: #f9f9f9; font-weight: 600; border-radius: 10px;}


/*
    ****************** contact  ******************
*/
.contact {padding:300px 0; box-sizing: border-box; background-color: #f0f0f0;}
.contact .contentWrap{position: relative; display: flex; align-items: start; justify-content: space-between;}
.contact .contentWrap .pageTitle .mainTitle{color: #202020; font-size: 40px;font-family: 'PretendardB'; margin-top: 24px;}
.contact .formWrap{display: flex; flex-wrap: wrap; align-items: start; gap: 30px;}
.contact .formWrap .formRow{display: flex; flex-direction:column; gap: 18px;}
.contact .formWrap .formRow:not(:last-of-type){margin-bottom: 50px;}
.contact .formWrap .formRow .head{color: #333333; font-size: 20px;font-family: 'PretendardM';}
.contact .formWrap .formRow .head .text{position: relative;}
.contact .formWrap .formRow .head .text:after{position: absolute; top: 0; right: -10px; content: '*'; color: #393a39; display: block; }
.contact .formWrap .formRow .body{width: 342px; padding: 10px 12px; box-sizing: border-box; background-color: #fff;}
.contact .formWrap .formRow .body input{font-size: 14px;font-family: 'PretendardR'; width: 100%; border: 0;}
.contact .formWrap .formRow .body textarea{font-size: 14px;font-family: 'PretendardR'; width: 100%; height: 430px;resize: none;}
.contact .agreeWrap {position: absolute; left: 0; bottom: 0;}
.contact .agreeWrap .agreeCell{display: flex; align-items: center; gap:10px; margin-bottom: 25px;}
.contact .agreeWrap .agreeCell input[type="checkbox"]{width: 20px;height: 20px;cursor: pointer;}
.contact .agreeWrap .agreeCell label{color: #767676; font-size: 16px;font-family: 'PretendardR';}
.contact .agreeWrap .btnSubmit{color: #fff; font-size: 30px; font-family: 'PretendardM';width: 360px; height: 84px; display: flex; align-items: center; justify-content: space-between; padding-inline: 50px; box-sizing: border-box; border-radius: 50px; background-color: #393a39; cursor: pointer;}
.contact .agreeWrap .btnSubmit::after{content: "";width: 12px; height: 21px; display: inline-block; background: url("/app/layout/web/images/conact_iconArrowWhite.png") no-repeat top / 100% auto;}


@media (max-width: 1300px) {
    /*
       ****************** 헤더 ******************
   */
    .header .listArea {left: 0px; width: 100%;padding:  15px;}


}

@media (max-width:1024px) {
    /*
    *********************************** vands TV ************************************
    */
    #mainYoutube {width:100%; height:calc(100vw * 0.5625); margin-bottom:30px;}
    #mainYoutube > video {width:100%; height:100%;}
    #vandsTv {margin-bottom:50px;}
    #vandsTv .mainSectionTitle {margin-bottom:20px;}
    #vandsTv .slideArea {position:relative;}
    #vandsTv .swiper-container {}
    #vandsTv .swiper-slide {width:230px; cursor:pointer;}
    #vandsTv .swiper-slide .thumb {width:100%; height:auto;}
    #vandsTv .swiper-slide .playIcon {display:none;}
    #vandsTv .swiperArrow {position:absolute; top:50%; margin-top:-20px; cursor:pointer; z-index:10;}
    #vandsTv .swiperArrow img {width:40px;}
    #vandsTv .swiperArrow .over {display:none;}
    #vandsTv .swiperArrow:hover .normal {display:none;}
    #vandsTv .swiperArrow:hover .over {display:inline;}
    #vandsTv .swiperPrev {left:10px;}
    #vandsTv .swiperNext {right:10px;}

}

@media (max-width: 1200px) {
    .contentWrap { padding-left: 15px; padding-right: 15px; box-sizing: border-box;}
    .cl_collasterTitle { font-size: 45px; margin-bottom: 40px; }

    /*
        ****************** 헤더 ******************
    */
    .header .gnb .menuList .list { font-size: 18px;  margin-right: 22px;}
    .header .gnb .menuList .subList { top: 100px;}

    /*
       ****************** 푸터 ******************
   */
    .footerWrap .footer .midArea {  margin-left: 60px; margin-right: 150px;}

    /*
        ****************** 메인  ******************
    */

    /* collasterLine */
    .collasterLine { padding: 130px 30px; box-sizing: border-box; }
    .collasterLine .titleArea { margin-bottom: 100px; }
    .collasterLine .subText { font-size: 25px; }
    .collasterLine .mainText { font-size: 35px; }

    /*
        ****************** 서브 페이지  ******************
    */

    .subVisual { height: 7000px;}


    /*
        ****************** findUs  ******************
    */
    .findUs .tabArea ul li a { font-size: 18px; }
    .findUs .contentWrap .pageTitle { font-size: 34px; }
    .findUs .contentWrap .grid .gridCell .gridBox a { font-size: 24px; }

    /*
        ****************** contact  ******************
    */
    .contact .contentWrap {flex-direction: column; align-items: center;}
    .contact .contentWrap .pageTitle {text-align: center; margin-bottom: 25px;}
    .contact .contentWrap .pageTitle .icon img{width: 50%;}
    .contact .contentWrap .pageTitle .mainTitle {font-size: 24px;}
    .contact .agreeWrap {position: relative;display: flex;flex-direction: column;align-items: center; justify-content: center; margin-top: 30px;}
    .contact .agreeWrap .agreeCell {margin-bottom: 15px;}
    .contact .agreeWrap .btnSubmit {font-size: 20px; width: 200px; height: 50px; padding-inline: 20px;}

}

@media (max-width: 1000px) {
    .cl_pageWrap {  padding: 100px 0;}
    .cl_collasterTitle { font-size: 40px; margin-bottom: 30px;}

     /*
         ****************** 헤더 ******************
     */
    .header .logoArea { width: 170px;}
    .header .logoArea img { width: 100%;}
    .header .listArea {left: -20px; width: 120%;}

    .header .globalWrap .global .text { font-size: 18px; margin: 0 6px;}

    /*
        ****************** 푸터 ******************
    */

    .footerWrap .footer { font-size: 14px;}
    .footerWrap .footer .leftArea .logo  { margin-bottom: 35px;}
    .footerWrap .footer .leftArea .address .text { margin-bottom: 10px;}
    .footerWrap .footer .rightArea .callNumber { margin-right: 60px;}
    .footerWrap .footer .midArea {  margin-left: 40px; margin-right: 90px;}

    /*
        ****************** 메인  ******************
    */

    /* collasterLine */

    .collasterLine { padding: 90px 20px; }
    .collasterLine .titleArea { margin-bottom: 80px; }
    .collasterLine .subText { font-size: 20px; }
    .collasterLine .mainText { font-size: 30px; }
    .collasterLine .collasterSwiper .slideArea .textArea { font-size: 16px; margin-top: 10px; }
    .collasterLine .collasterSwiper .slideArea .textArea span { font-size: 20px; margin-bottom: 5px;}
    .collasterLine .collasterSwiper .collasterBtn.next { right: -20px; width: 40px; height: 40px; }
    .collasterLine .collasterSwiper .collasterBtn.prev { left: -20px; width: 40px; height: 40px; }

    /* collasterReviewWrap */
    .collasterReviewWrap .reviewAreaWrap .reviewArea .reviewGrid { margin-right: 5px;}
    .collasterReviewWrap .reviewAreaWrap .reviewArea .reviewGrid.type1 .img:first-child { margin-bottom: 5px;}
    .collasterReviewWrap .reviewAreaWrap .reviewArea .reviewGrid.type3 .img:first-child { margin-bottom: 5px;}
    .collasterReviewWrap .reviewAreaWrap .reviewArea .reviewGrid.type3 .img.flex div { margin-right: 5px;}

    /* infoTextWrap */
    .infoTextWrap .text { font-size: 30px; }

    /*
       ****************** 서브 페이지  ******************
    */

    .subVisual { height: 6000px;}

    /*
        ****************** findUs  ******************
    */
    .findUs .tabArea { height: 50px; margin-bottom: 50px; }
    .findUs .tabArea ul li a { font-size: 16px; }

    .findUs .contentWrap .pageTitle { font-size: 24px; gap: 10px; }
    .findUs .contentWrap .pageTitle .icon img { width: 24px; }

    .findUs .contentWrap .grid .gridCell { width: calc(100%/3); }
    .findUs .contentWrap .grid .gridCell .gridBox a { font-size: 18px; }
    .findUs .contentWrap .grid .gridCell .gridBox {height: 110px; }



}

@media (max-width: 768px) {
    .showMobile {display:block;}
    
    .cl_pageWrap {  padding: 50px 0;}
    .cl_collasterTitle { font-size: 20px; margin-bottom: 15px;}

    /*
        ****************** 헤더 ******************
    */
    .header { justify-content: center; height: 70px;}
    .header .logoArea { width: auto;}
    .header .gnb { display: none;}
    .header .gnbMenu { position: absolute; top: 50%; transform: translateY(-50%); left: 20px; cursor: pointer;}
    .header .globalWrap { display: none;}

    .mobileMenuWrap { display: none;position: fixed;top: 0; left:-100%;width: 100%; height: 100%; background-color: rgba(0,0,0,0.7); z-index: 9999}
    .mobileMenuWrap.on { display: block; left: 0;}
    .mobileMenuWrap .mobileMenu { position: relative; width: 90%; height: 100%; background-color: #fff; padding: 35px 25px; box-sizing: border-box;}
    .mobileMenuWrap .mobileMenu .logo { margin-bottom: 25px;}
    .mobileMenuWrap .mobileMenu .menuList .list:not(.only) { position: relative; width: 100%;margin-bottom: 25px; font-size: 13px; font-family: 'PretendardM'; background: url("/app/layout/web/images/gnbArrowUp.png") no-repeat 100% 8px; background-size: 10px 5px; cursor: pointer;}
    .mobileMenuWrap .mobileMenu .menuList .list:last-child { margin-bottom: 0;}
    .mobileMenuWrap .mobileMenu .menuList .list a {color: #202020}
    .mobileMenuWrap .mobileMenu .menuList .list.down { background: url("/app/layout/web/images/gnbArrowDown.png") no-repeat 100% 8px;background-size: 10px 5px;}
    .mobileMenuWrap .mobileMenu .menuList .subList { display: none; font-size: 11px; font-family: 'PretendardL'; padding-left: 10px; box-sizing: border-box;}
    .mobileMenuWrap .mobileMenu .menuList .subList li { margin-top: 15px;}

    .mobileMenuWrap .globalM { display: flex; align-items: center; margin-top: 25px;}
    .mobileMenuWrap .globalM .globalLogo { display: flex; width: 15px;}
    .mobileMenuWrap .globalM .globalLogo img{ width: 100%;}
    .mobileMenuWrap .globalM .text { font-size: 13px; font-family: 'PretendardM'; margin:0 8px;}
    .mobileMenuWrap .globalM .list { display: flex; align-items: center;}
    .mobileMenuWrap .globalM .list a{ display: flex; margin-right: 5px;}
    .mobileMenuWrap .globalM .list a:last-child{ margin-right: 0; }
    .mobileMenuWrap .mobileMenu .closeBtn { position: absolute; top: 5px; right: 5px; font-size: 20px;}

    /*
        ****************** 푸터 ******************
    */

    .footerWrap .footer { flex-direction: column; align-items: center; font-size: 14px;}
    .footerWrap .footer .leftArea { margin-bottom: 20px;}

    .footerWrap .footer .leftArea .logo  { margin-bottom: 20px;}
    .footerWrap .footer .leftArea .logo img { width: 160px}
    .footerWrap .footer .leftArea .address .text { margin-bottom: 3px; }
    .footerWrap .footer .leftArea .address .text.text1 { line-height: 1.3}
    .footerWrap .footer .midArea { margin-bottom: 20px; margin-left: 0 ;margin-right: 0; }
    .footerWrap .footer .midArea .address .text.tradeMarkComment {font-size:11px;}
    .footerWrap .footer .rightArea { flex-direction: column; }
    .footerWrap .footer .rightArea .callNumber { margin-right: 0; margin-bottom: 20px; line-height: 0.8}
    .footerWrap .footer .rightArea ul { display: flex;}
    .footerWrap .footer .rightArea ul li { margin-bottom: 0; margin-right: 15px;}
    .footerWrap .footer .rightArea ul li:last-child { margin-bottom: 0; margin-right: 0;}


    /*
        ****************** 메인  ******************
    */
    
    /* collasterLine */
    .collasterLine .titleArea { margin-bottom: 50px;}
    .collasterLine .subText { font-size: 15px; margin-bottom: 5px;}
    .collasterLine .mainText { font-size: 20px; }

    .collasterLine .collasterSwiper .slideArea .textArea { font-size: 12px; margin-top: 5px; }
    .collasterLine .collasterSwiper .slideArea .textArea span { font-size: 15px; margin-bottom: 0px;}
    .collasterLine .collasterSwiper .collasterBtn { display: none;}
    .collasterLine .collasterSwiper .swiper-pagination { display: block; left: 50%; transform: translateX(-50%)}
    .collasterLine .collasterSwiper .swiper-pagination .swiper-pagination-bullet { margin-right: 4px;}
    .collasterLine .collasterSwiper .swiper-pagination .swiper-pagination-bullet:last-child { margin-right: 0;}
    .collasterLine .collasterSwiper .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: #202020;}

    /* collasterReviewWrap */
    .collasterReviewWrap .reviewAreaWrap .reviewArea.pc { display: none;}
    .collasterReviewWrap .reviewAreaWrap .reviewArea.m { display: flex; flex-direction: column; align-items: center; justify-content: center}
    .collasterReviewWrap .reviewAreaWrap .reviewArea .reviewGrid { margin-bottom: 5px; margin-right: 0;}
    .collasterReviewWrap .reviewAreaWrap .reviewArea .reviewGrid:last-child { margin-bottom: 0;}
    .collasterReviewWrap .reviewAreaWrap .reviewArea .reviewGrid.type3 { flex-direction: row; }
    .collasterReviewWrap .reviewAreaWrap .reviewArea .reviewGrid.type3 .img:first-child  { margin-bottom: 0;}
    .collasterReviewWrap .reviewAreaWrap .reviewArea .reviewGrid.type3 .img { margin-right: 5px;  flex: 1}
    .collasterReviewWrap .reviewAreaWrap .reviewArea .reviewGrid.type3 .img:last-child {margin-right: 0px;}
    .collasterReviewWrap .reviewAreaWrap .reviewArea .reviewGrid.type3 .img.flex { flex-direction: column}
    .collasterReviewWrap .reviewAreaWrap .reviewArea .reviewGrid.type3 .img.flex div { margin-right: 0; margin-bottom: 5px; }
    .collasterReviewWrap .reviewAreaWrap .reviewArea .reviewGrid.type3 .img.flex div:last-child { margin-bottom: 0; }

    .collasterReviewWrap .reviewAreaWrap .reviewArea .reviewBox { display: flex; width: 100%; justify-content: flex-start;}
    .collasterReviewWrap .reviewAreaWrap .reviewArea .reviewBox > div {margin-right: 10px; /*position: relative;*/ width:calc(100% / 3);}

    /* infoTextWrap */

    .infoTextWrap { text-align: center; }
    .infoTextWrap .text { display: inline-flex;flex-direction: column;  font-size: 20px;  }
    .infoTextWrap .text span { display: block;padding: 4px 10px; margin: 5px 0;}
    .infoTextWrap .text span img { width: 70%; }
    /*
         ****************** 서브 페이지  ******************
    */

    .subVisual { height: auto; }
    .subVisual .mainImg { width: 100%}
    .subVisual.brightening { background-image: none;}
    .subVisual.original { background-image: none;}
    .subVisual.pore { background-image: none;}
    .subVisual.nexosome { background-image: none;}
    .subVisual.acSolution { background-image: none;}
    .subVisual.pdrn { background-image: none;}


    /*
        ****************** findUs  ******************
    */
    .findUs .tabArea { height: 50px; margin-bottom: 35px; }
    .findUs .tabArea ul { display: none; }

    .findUs .contentWrap .pageTitle { font-size: 20px; gap: 7px; margin-bottom: 15px; }
    .findUs .contentWrap .pageTitle .icon img { width: 20px; }

    .findUs .contentWrap .gridWrapper { margin-bottom: 70px; }
    .findUs .contentWrap .grid .gridCell { width: calc(100%/2); }
    .findUs .contentWrap .grid .gridCell .gridBox a { font-size: 15px; }
    .findUs .contentWrap .grid .gridCell .gridBox {height: 70px; }
    .findUs .contentWrap .grid .gridCell { border-width: 0 15px 15px 0; }

    .findUs .dropDownWrap { position: relative; height: 100%; padding: 0 15px; box-sizing: border-box; }
    .findUs .dropDownWrap a { height: 100%; display: flex; align-items: center; justify-content: space-between; color: #fff; font-family: 'PretendardB'; font-size: 16px; cursor: pointer; }

    .findUs .dropDownWrap .subMenuWrap { display: none; position: absolute; top: 50px; left: 0; width: 100%; box-sizing: border-box; padding: 10px 0; background: #393939; box-shadow: 0 6px 15px rgba(0, 0, 0, 0.1); z-index: 10; }
    .findUs .dropDownWrap.on .subMenuWrap { display: block; }
    .findUs .dropDownWrap .subMenuWrap .subMenu { display: flex; flex-direction: column; }
    .findUs .dropDownWrap .subMenuWrap .subMenu li { width: 100%; padding: 12px 16px; box-sizing: border-box; transition: background-color 0.2s; }
    .findUs .dropDownWrap .subMenuWrap .subMenu li a { display: block; font-size: 15px; font-family: 'PretendardB'; text-align: left; transition: color 0.2s; }
    .findUs .dropDownWrap .subMenuWrap .subMenu li:hover a { color: #fff; font-weight: 600; }

    .findUs .dropDownWrap.on i { transform: rotate(180deg); transition: transform 0.2s; }
    .findUs .tabArea ul li.on { background: #afafaf; color: #fff; }

    /*
        ****************** contact  ******************
    */
    .contact {padding: 45px 0;}
    .contact .contentWrap {flex-direction: column; align-items: center;}
    .contact .contentWrap .pageTitle {width: 100%; text-align: left; margin-bottom: 20px;}
    .contact .contentWrap .pageTitle .icon{width: 184px;}
    .contact .contentWrap .pageTitle .icon img{width: 100%;}
    .contact .contentWrap .pageTitle .mainTitle {font-size: 20px;margin-top: 15px;}
    .contact .contentWrap .contentArea {width: 100%;}
    .contact .formWrap {width: 100%; flex-direction: column;gap: 5px;}
    .contact .formWrap > div{width: 100%;}
    .contact .formWrap .formRow {flex-direction: row; align-items: center; gap: 0; padding: 10px; box-sizing: border-box; background-color: #fff;}
    .contact .formWrap .formRow:not(:last-of-type) {margin-bottom: 5px;}
    .contact .formWrap .formRow.alignStartM{align-items: start;}
    .contact .formWrap .formRow .head {font-size: 16px;min-width: 80px;}
    .contact .formWrap .formRow .body {width: 100%; padding: 0;}
    .contact .formWrap .formRow .body textarea {line-height: 1.5;}
    .contact .agreeWrap {width: 100%;}
    .contact .agreeWrap .agreeCell {gap: 5px;}
    .contact .agreeWrap .agreeCell label {font-size: 12px;}
    .contact .agreeWrap .agreeCell input[type="checkbox"] {width: 16px;height: 16px;}
    .contact .agreeWrap .btnSpace {width: 100%;}
    .contact .agreeWrap .btnSubmit {font-size: 15px; width: 100%; height: 44px; justify-content: center;}
    .contact .agreeWrap .btnSubmit::after {content: none;}


}