@charset "utf-8";

.nonbr{ display: block;}

#sub3sec1{ position: relative;  padding: 0px 60px 0px;}
#sub3sec1 .introTop{ padding: 30px 0; display: inline-block;}

#sub3sec1 .sub3mainWrap{ display: flex; justify-content: space-between; padding-bottom: 80px; border-bottom: 1px solid #64635e;}
.sub3mainWrap .mainHalf{ width: 50%; padding: 0;}
.mainHalf .mainBnCon{ width: 86%; aspect-ratio: 1; background: url(../img/main/image4.jpg) no-repeat center/cover; display: flex; align-items: flex-end;}
.mainBnCon .mainBnConIn{ width: 100%; height: auto; padding: 0px 0 60px 40px;}
.mainBnConIn h2{ font-family: "Cormorant Garamond", serif; font-size: 42px; font-weight: 500; color: #f2f4e6; line-height: 1.25em; margin-bottom: 50px; text-shadow: 2px 3px 2px rgba(10, 10, 10, 0.7);}
/* .mainBnConIn .moreScroll{ margin-top: ;} */
.mainBnConIn .moreScroll span{ display: inline-block; color: #f2f4e6; padding-bottom: 10px; font-family: "Nunito", sans-serif; font-size: 16px; font-weight: 400; }
.mainBnConIn .moreScroll::after{ content: ""; display: block; width: 240px; height: 2px; background: #f2f4e6; transition: all ease-in-out; animation: moreScroll 2s ease-in-out Infinite Alternate;}

@keyframes moreScroll{
    from{ width: 0px; }
    to{ width: 20%; }

}

.introLogo a img{ width: 150px;}

/* mainHalf 오른쪽 */
.mainConWrap{ width: 100%; height: 100%; display: flex; justify-content: space-between; flex-direction: column; }
.mainConWrap .mainConTit{ padding-right: 60px;}
.mainConWrap .mainConTit h2{ font-family: "Cormorant Garamond", serif; font-size: 36px; font-weight: 400; line-height: 1.5em; color: #24211c; margin-bottom: 30px; } 
.mainConTit .mainTitTxt{ display: flex; justify-content: space-between; margin: 30px 0;}
.mainConTit .mainTitTxt p{ font-family: 'SUIT Variable', sans-serif;  font-size: 14px; font-weight: 400; line-height: 1.5em; color: #64635e; margin-right: 10px;}
.mainConTit .mainTitTxt p:last-child{ margin-right: 0;}

/* notiTxtWrap */
.notiTxtWrap .notiNum{ margin-bottom: 30px;}
.notiNum p{ font-size: 16px; font-weight: 400;}
.notiNum p span{ font-size: 16px; font-weight: 500; }
.notiTxtWrap .notiTxt{ margin-bottom: 30px;}
.notiTxtWrap .notiTxt p{ font-size: 14px; font-weight: 400; line-height: 1.5em;}

/* notiSec2 */
#notiSec2{ padding: 80px 60px;}
#notiSec2 .notiWrap{ display: flex; justify-content: space-between;}
.notiWrap .notiHalf{ width: 50%; margin-right: 30px;}
.notiWrap .notiHalf:last-child{ margin-right: 0;}
.notiHalf .notiSec2Tit{ margin-bottom: 30px;}
.notiSec2Tit h2{font-family: "Nunito", sans-serif; font-size: 18px; font-weight: 500; color: #24211c; line-height: 1.5em;}
.notiSec2Tit h3{ font-size: 14px; font-weight: 400; color: #64635e;}
.notiHalf .notiSec2Txt p{ font-weight: 400; font-size: 14px; color: #64635e;}
.notiHalf .notiSec2Txt p span{ display: block; padding-left: 10px; font-weight: 400; font-size: 14px; color: #64635e;}

/* 환불규정 떠나요 연동 */
.cancelfee{ width: 100%; margin-top: 20px;}
.cancelfee th{ background-color: #24211c; color: #f2f4e6; padding: 15px 10px;}
.cancelfee td{ background: #edede5; padding: 10px 10px;}

/* 떠나요 연동 */
.ad{ display: none;}

/* banner */
#banner{ width: 100%; height: 33vh; display: flex; justify-content: center; align-items: center; background: url(../img/main/image8.jpg) no-repeat 50% 30%/cover;}
#banner p{ font-family: 'singlong'; font-size: 2.25rem; color: #f9f0df; }

/* 반응형 */
@media all and (max-width: 1440px){

    /* #sub3sec1{ padding: 0 60px 60px;} */
    .sub3mainWrap .mainHalf{ width: 49%;}
    .mainConWrap .mainConTit{ padding-right: 0;}
    .mainHalf .mainBnCon{width: 100%;}
    .mainBnCon .mainBnConIn{ padding: 0 0 30px 20px;}
    .mainBnConIn h2{ margin-bottom: 40px; font-size: 30px;}
    .mainConTit .mainTitTxt{ padding-right: 0px; margin: 15px 0;}
    .mainConWrap .mainCenterSwip{ aspect-ratio: 16/9; margin-bottom: 15px;}
    .mainTxtwrap{ padding-right: 0px;}
    .mainConTit .mainTitTxt p{ font-size: 13px;}
    .mainTxtwrap p{ font-size: 13px;}

    .mainConWrap .mainConTit h2{font-size: 24px;}

    /* .swiper-button-next.subBnNext{ right: 42%;} */
 }
@media all and (max-width: 1024px){

    #sub3sec1{ padding: 0 30px;}
    #sub3sec1 .sub3mainWrap{ flex-direction: column;}
    .sub3mainWrap .mainHalf{ width: 100%;}
    .sub3mainWrap .mainHalf:first-child{ margin-bottom: 30px;}
    .mainHalf .mainBnCon{ aspect-ratio: 16/5; }
    .mainBnConIn h2{ margin-bottom: 20px;}
    .sub3mainWrap .mainHalf{ margin-bottom: 50px;}
    .mainConTit .mainTitTxt{ padding-right: 30px;}
    .mainTxtwrap{ padding-right: 30px;}

    #sub1ImgLst{ margin: 80px auto;}

    #sub3sec1 .sub3mainWrap{ padding-bottom: 0;}

    #notiSec2{ padding: 50px 30px;}

    #banner p{ font-size: 1.875rem;}
    
}

@media all and (max-width: 768px){

    .introLogo a img{ width: 110px;}
    .mainConWrap .mainConTit h2{ font-size: 30px;}

    #notiSec2 .notiWrap{ flex-direction: column;}
    .notiWrap .notiHalf{ width: 100%; margin-right: 0;}
    .notiWrap .notiHalf:last-child{ margin-top: 50px;}
    .notiHalf .notiSec2Tit{ margin-bottom: 15px;}

    #banner{ height: 18vh;}
    #banner p{ font-size: 1.5rem;}
}
@media all and (max-width: 520px){
    
    #sub3sec1{ padding:  0 20px;}

    .nonbr{ display: none;}
    .mainHalf .mainBnCon{ aspect-ratio: 16/7;}
    .mainBnConIn h2{ margin-bottom: 0; font-size: 24px;}
    .mainBnCon .mainBnConIn{ padding: 0 0 30px 10px;}
    .mainConWrap .mainConTit h2{ font-size: 24px;}

    #notiSec2{ padding: 30px 20px;}

    
}