@charset "utf-8";

/*메인 페이지 스타일*/
.main-swiper-wrapper{width: 100%;margin: 0 auto;padding: 0 var(--container-padding)}
.main-swiper-section{width: 100%;max-width:1800px;overflow: hidden;position: relative;border-radius: 30px;margin: 0 auto;}
.main-swiper-section .swiper-slide{width: 100%;}
.main-swiper-section .swiper-slide .bg-box{display:block;width: 100%;height: auto;aspect-ratio: 1800 / 700;}
.main-swiper-section .swiper-slide .bg-box :is(picture,img){display: block;width: 100%;height: 100%;object-fit: cover}
.main-swiper-section .swiper-control-box{position: absolute;bottom: 14%;z-index: 1;left: 50%;transform: translateX(-50%);}
.main-swiper-section .swiper-control-box .swiper-pagination-bullet {width: 14px;height: 14px;display: inline-block;border-radius: 40px;background-color: var(--white);opacity: 1;transition-duration: 0.3s;transition-property: width,background-color;}
.main-swiper-section .swiper-control-box .swiper-pagination-bullet.swiper-pagination-bullet-active {width: 50px;border-radius: 40px;background-color: var(--orange1);}

.search-section{width: 100%;max-width: calc(var(--content-width) + (var(--container-padding) * 2));padding: 0 var(--container-padding);margin: 0 auto;padding-top: 130px;padding-bottom:80px;position: relative;}
.search-section .search-box{width:  calc(100% - (var(--container-padding) * 2));background-color: var(--orange1);border-radius: 100px;display: flex;padding:0 40px;align-items: center;transform: translate(-50%,-50%);position: absolute;z-index: 10;top:0;left: 50%;column-gap: 40px;}
.search-section .search-box .t-box{flex: none;font-size: 32px;font-weight: 800;color:var(--white);font-family:var(--GangwonEduPower);display: flex;align-items: center}
.search-section .search-box .t-box::before{content:'';background-image: url("../images/search-cat.svg");background-size: cover;display: block;width: 150px;height: 102px;}
.search-section .search-box .button-box{display: flex;column-gap: 10px;width: 100%;}
.search-section .search-box .search-input{width: calc(100% - 170px);background-color: var(--white);border-radius: 60px;height: 60px;position: relative;display: flex;}
.search-section .search-box .search-input > input{border:0;height: 100%;width: calc(100% - 60px);padding:0 40px;background-color: transparent;font-size: 22px;font-weight: 700;letter-spacing: -0.03em;font-family: var(--NanumSquareNeo);color:var(--black1)}
.search-section .search-box .search-input > input:focus{outline:0;}
.search-section .search-box .search-input > input::placeholder{color:var(--black1)}
.search-section .search-box .search-input .search-button{width: 60px;height: 60px;background-image: url("../images/icons/icon-search-orange.svg");background-size: 29px auto;background-position: center;background-repeat: no-repeat;font-size: 0;text-indent: -9999px;}
.search-section .search-box .detail-search-button{width: 160px;height: 60px;border:1px solid var(--white);border-radius: 50px;display: flex;justify-content: space-between;align-items: center;padding:0 20px;font-size: 22px;font-weight: 700;letter-spacing: -0.03em;color:var(--white);line-height: 1;}
.search-section .search-box .detail-search-button::after{content:'';width: 28px;height: 28px;display: block;background-image: url("../images/icons/icon-detail.svg");background-size: cover;}


.search-section .tab-wrapper{display: flex;column-gap: 30px;}
.search-section .tab-wrapper .tag-box {width: calc(100% - 327px);background-color: var(--orange3);border-radius: 30px;padding: 40px;display: flex;column-gap: 40px;position: relative;}
.search-section .tab-wrapper .tag-box .deco-item{position: absolute;}
.search-section .tab-wrapper .tag-box .deco-item > img{display: block;width: 100%;height: auto;}
.search-section .tab-wrapper .tag-box .deco-item:nth-of-type(1){width:175px;bottom:40px;left: -29px;}
.search-section .tab-wrapper .tag-box .deco-item:nth-of-type(2){width:77px;top:25px;right: -20px;}
.search-section .tab-wrapper .tag-box .deco-item:nth-of-type(3){width: 71px;top:120px;right: -12px;}
.search-section .tab-wrapper .tag-box .title-box{width: 180px;}
.search-section .tab-wrapper .tag-box .top-title-box {display: none;}
.search-section .tab-wrapper .tag-box .title-box .t-box{}
.search-section .tab-wrapper .tag-box .title-box .button-box{display: flex;column-gap: 10px;margin-top: 24px;}
.search-section .tab-wrapper .tag-box .title-box .button-box .search-button{width: 120px;height: 50px;background-color: var(--black1);border-radius: 50px;color:var(--white);font-family: var(--NanumSquareNeo);font-size: 24px;letter-spacing: -0.03em;font-weight: 800;display: flex;;align-items: center;column-gap: 10px;padding:0 14px;transition-duration: 0.3s;transition-property: background-color;}
.search-section .tab-wrapper .tag-box .title-box .button-box .search-button::before{content:'';display: inline-block;background-image: url("../images/icons/icon-search-white.svg");background-size: 32px auto;background-repeat: no-repeat;background-position: center;width: 32px;height: 33px;border-radius: 50px;}
.search-section .tab-wrapper .tag-box .title-box .button-box .refresh-button{width: 50px;height: 50px;background-image: url("../images/icons/icon-refresh.svg");background-repeat: no-repeat;background-position: center;background-color: var(--button_off);border-radius: 50px;font-size: 0;text-indent: -9999px;transition-duration: 0.3s;transition-property: background-color;}

.search-section .tab-wrapper .tag-box .tag-list{display: flex;gap: 10px;flex-wrap: wrap;width: calc(100% - 220px);}
.search-section .tab-wrapper .tag-box .tag-list .tag-item{}
.search-section .tab-wrapper .tag-box .tag-list .tag-item input[type='checkbox']{display: none;}
.search-section .tab-wrapper .tag-box .tag-list .tag-item input[type='checkbox'] + label{color:var(--black2);background-color: var(--white);padding:10px;border-radius: 30px;display: inline-block;cursor: pointer;transition-duration: 0.2s;transition-property: background-color,color,box-shadow,transform;}
.search-section .tab-wrapper .tag-box .tag-list .tag-item input[type='checkbox'] + label::before{content:'#';}
.search-section .tab-wrapper .tag-box .tag-list .tag-item input[type='checkbox']:checked + label{background-color: var(--orange1);color:var(--white);box-shadow: var(--shadow4);transform: translateY(-3px)}
.search-section .tab-wrapper .banner-box{width: 297px;height: 368px;}
.search-section .tab-wrapper .banner-box > a{display:block;width: 100%;height: 100%;}
.search-section .tab-wrapper .banner-box > a img{display:block;width: 100%;height: 100%;}


.best-section{padding:95px 0;background-color: var(--orange2);}
.best-section .section-wrapper{position: relative;}
.best-section .section-wrapper::before{content:'';display:block;background-image: url("../images/cloud.svg");position: absolute;width: 306px;height: 100px;left: -48px;transform: translateX(-100%);top:0;}
.best-section .section-wrapper::after{content:'';display:block;background-image: url("../images/cloud.svg");position: absolute;width: 306px;height: 100px;right: -48px;transform: translateX(100%);top:0;}

.best-section .title-box{display: flex;column-gap: 60px;justify-content: space-between;align-items: flex-end}
.best-section .title-box .t-box{}
.best-section .title-box .t-box::before{content:'';background-image: url("../images/text-best.svg");display: block;width:150px;height: 47px;margin-bottom: 20px;}
.best-section .title-box .text{font-family: var(--NanumSquareNeo);font-size: 16px;letter-spacing: -0.03em;display: flex;flex-direction: column;row-gap: 4px;}
.best-section .title-box .text em{}
.best-section .best-swiper-box{width: 100%;margin: 87px auto 0;max-width: var(--content-width)}

.best-section .best-swiper-box .swiper-slide{transition-duration: 0.3s;}
.best-section .best-swiper-box .swiper-slide .img-box{display:block;width: 100%;height: auto;aspect-ratio: 1 / 1;overflow: hidden;border-radius: 30px;position: relative;}
.best-section .best-swiper-box .swiper-slide .img-box::selection { background:transparent; }
.best-section .best-swiper-box .swiper-slide .img-box img{display:block;width: 100%;height: 100%;object-fit: cover;}
.best-section .best-swiper-box .swiper-slide .text-box{display: flex;height: 100px;align-items: center;justify-content: center;overflow: hidden;border-radius: 30px;background-color: var(--white);text-align: center;padding:20px 50px;color: var(--black1);transition-duration: 0.3s;transition-property:box-shadow; }
.best-section .best-swiper-box .swiper-slide .text-box::selection {  background:transparent; }
.best-section .best-swiper-box .swiper-slide.up {transform: translateY(-47px)}


.best-section .best-swiper-box .swiper-slide .best-item-box .img-box::before{content:'';width:60px;height: 66px;display: block;border-radius: 0 0 30px 30px;background-color: var(--white);position: absolute;top:0;left: 24px;background-size: 60px 60px;background-position: top;background-repeat: no-repeat;}
.best-section .best-swiper-box .swiper-slide .best-item-box.forest .img-box::before{background-image: url("../images/icons/icon-theme001.svg");}
.best-section .best-swiper-box .swiper-slide .best-item-box.city .img-box::before{background-image: url("../images/icons/icon-theme002.svg");}
.best-section .best-swiper-box .swiper-slide .best-item-box.beach .img-box::before{background-image: url("../images/icons/icon-theme003.svg");}
.best-section .best-swiper-box .swiper-slide .best-item-box.valley .img-box::before{background-image: url("../images/icons/icon-theme004.svg");}
.best-section .best-swiper-box .swiper-slide .best-item-box.island .img-box::before{background-image: url("../images/icons/icon-theme005.svg");}
.best-section .best-swiper-box .swiper-slide .best-item-box.mount .img-box::before{background-image: url("../images/icons/icon-theme006.svg");}
.best-section .best-swiper-box .swiper-slide .best-item-box.lake .img-box::before{background-image: url("../images/icons/icon-theme007.svg");}
.best-section .best-swiper-box .swiper-slide .best-item-box.river .img-box::before{background-image: url("../images/icons/icon-theme008.svg");}

.board-section{background-image: url("../images/main-sns-bg.png");background-size: 2004px 675px;background-repeat: no-repeat;background-position: center 80px;padding: 80px 0;background-color: var(--white);}
.board-section .sns-box .title-box{display: flex;justify-content: space-between;}
.board-section .sns-box .title-box .sns-button{display: flex;}
.board-section .sns-box .title-box .sns-button >  button{width: 60px;height: 60px;display: block;background-size: cover;background-repeat: no-repeat;transition-duration: 0.3s;transition-property: background-image;}
.board-section .sns-box .title-box .sns-button >  button.instagram{background-image: url("../images/icons/icon-instagram-off.svg");}
.board-section .sns-box .title-box .sns-button >  button.instagram.active{background-image: url("../images/icons/icon-instagram-on.svg");}
.board-section .sns-box .title-box .sns-button >  button.facebook{background-image: url("../images/icons/icon-facebook-off.svg");}
.board-section .sns-box .title-box .sns-button >  button.facebook.active{background-image: url("../images/icons/icon-facebook-on.svg");}
.board-section .sns-box .title-box .sns-button >  button.blog{background-image: url("../images/icons/icon-blog-off.svg");}
.board-section .sns-box .title-box .sns-button >  button.blog.active{background-image: url("../images/icons/icon-blog-on.svg");}
.board-section .sns-box .title-box .sns-button >  button.youtube{background-image: url("../images/icons/icon-youtube-off.svg");}
.board-section .sns-box .title-box .sns-button >  button.youtube.active{background-image: url("../images/icons/icon-youtube-on.svg");}
.board-section .sns-box .board-swiper-box{display: flex;margin-top: 30px;/*overflow: hidden;*/}
.board-section .sns-box .board-swiper-box .swiper-slide{}
.board-section .sns-box .board-swiper-box .swiper-slide > a{width: 100%;display: block;}
.board-section .sns-box .board-swiper-box .swiper-slide .img-box{width: 100%;height: auto;aspect-ratio: 1 / 1;border-radius: 30px;overflow: hidden;transition-duration: 0.3s;transition-property: transform,box-shadow;}
.board-section .sns-box .board-swiper-box .swiper-slide .img-box > img{width: 100%;height: 100%;object-fit: cover;}
.board-section .sns-box .board-swiper-box .swiper-slide .text-box{padding:20px 30px;}
.board-section .sns-box .board-swiper-box .swiper-slide .text-box p {overflow: hidden;white-space: normal;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;color: var(--black1);}


.board-section .board-box{display: flex;column-gap: 30px;margin-top: 80px;}
.board-section .notice-box{width: calc(100% - 327px);background-color: var(--orange2);border-radius: 30px;padding: 30px;position: relative;}
.board-section .notice-box::before{content:'';display: block;position: absolute;background-image: url("../images/notice-deco001.svg");background-size:100% auto;width: 72px;height: auto;aspect-ratio:72 / 123;top:-39px;left: 52px;}
.board-section .notice-box::after{content:'';display: block;position: absolute;;background-image: url("../images/notice-deco002.svg");background-size:100% auto;width: 96px;height: auto;aspect-ratio:96 / 57;bottom:13px;right: 12px;}
.board-section .notice-box .title-box{text-align: center}
.board-section .notice-box .list-box{display: flex;column-gap: 10px;margin-top: 20px;}
.board-section .notice-box .list-box .item-box{width: calc((100% - 10px) / 2);background-color: var(--white);border-radius: 20px;padding:12px 30px;transition-duration: 0.3s;transition-property: background-color;}
.board-section .notice-box .list-box .item-box .text-box{}
.board-section .notice-box .list-box .item-box .text-box::before{content:'';display: block;background-image: url("../images/icons/icon-notice.svg");background-size:100% auto;margin: 0 auto 20px;width: 28px;height: auto;aspect-ratio: 29 / 24;}
.board-section .notice-box .list-box .item-box .text-box .subject{overflow: hidden;white-space: normal;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;color: var(--black1);text-align: center;}
.board-section .notice-box .list-box .item-box .text-box .info{display: flex;justify-content: center;margin-top: 20px;color:var(--black2)}
.board-section .notice-box .list-box .item-box .text-box .info > li{font-size: 18px;letter-spacing: -0.03em;display: flex;align-items: center;}
.board-section .notice-box .list-box .item-box .text-box .info > li.icon-view::before{content:'';background-image: url("../images/icons/icon-view.svg");background-size: 100% auto;width: 25px;height: 25px;display: inline-block;}
.board-section .notice-box .list-box .item-box .text-box .info > li:after{content:'|';font-size: 14px;margin: 0 0.5em;color:var(--line1)}
.board-section .notice-box .list-box .item-box .text-box .info > li:last-of-type:after{content:none;}


.board-section .banner-box{width: 297px;border-radius: 30px;overflow: hidden}
.board-section .banner-box > a{display:block;width: 100%;height: 100%;}
.board-section .banner-box > a img{display:block;width: 100%;height: auto;aspect-ratio:  1 / 1; }


@media all and (max-width:1400px) {
    .best-section .title-box {flex-direction: column;row-gap: 20px;align-items: center;}
    .best-section .title-box .t-box::before {margin-left: auto;margin-right: auto;}
}

@media all and (max-width:1200px) {
    .search-section .m-view {display: block;}
    .search-section .search-box .search-input {width: calc(100% - 60px);}
    .search-section .search-box .detail-search-button {font-size: 0;width: 60px;height: 60px;padding: 0;position: relative;}
    .search-section .search-box .detail-search-button::after {position: absolute;top:0;left: 0;width: 100%;height: 100%;display: block;background-image: url(../images/icons/icon-detail.svg);background-size: 34px auto;background-position: center;background-repeat: no-repeat;}
}

@media all and (max-width:1100px) {
    .board-section .section-wrapper{padding:0;}
    .board-section .sns-box .title-box {padding: 0 var(--container-padding);}
}


@media all and (max-width:1000px) {
    .search-section {padding-top: 60px;}
    .search-section .search-box {align-items: flex-start;flex-direction: column;padding:8px 16px 16px;border-radius: 24px;position: relative;        transform: translate(-50%, -30px);}

    .search-section .tab-wrapper .tag-box{flex-direction: column;row-gap: 24px;}
    .search-section .tab-wrapper .tag-box .top-title-box{display: block;}
    .search-section .tab-wrapper .tag-box .title-box .t-box{display: none;}
    .search-section .tab-wrapper .tag-box .title-box {width: 100%;order: 2;}
    .search-section .tab-wrapper .tag-box .title-box .button-box{justify-content: flex-end;}
    .search-section .tab-wrapper .tag-box .tag-list {width: 100%;}
    .search-section .tab-wrapper .tag-box .deco-item:nth-of-type(1) {width: 175px;bottom: 0;left: -10px;}



}

@media all and (max-width:900px) {
    .search-section .tab-wrapper {flex-direction: column;row-gap: 30px;}
    .search-section .tab-wrapper .tag-box {width: 100%;}
    .search-section .tab-wrapper .banner-box {width: 100%;height: auto;aspect-ratio: 343 / 140;}

    .board-section .notice-box {width: 100%;border-radius: 0;padding: var(--container-padding);}
    .board-section .board-box{flex-direction: column;row-gap: 30px;margin-top: 24px;}
    .board-section .board-box .banner-box{width:100%;padding:0 var(--container-padding);}
    .board-section .board-box .banner-box img {width: 100%;height: auto;aspect-ratio: 343 / 120;}
}

@media all and (max-width:750px) {
    .main-swiper-wrapper{padding:0;}
    .main-swiper-section {border-radius: 0;}
    .main-swiper-section .swiper-slide .bg-box {aspect-ratio: 375 / 520;}
    .main-swiper-section .swiper-control-box {bottom: 16%;}
    .main-swiper-section .swiper-control-box .swiper-pagination-bullet {width: 10px;height: 10px;}
    .main-swiper-section .swiper-control-box .swiper-pagination-bullet.swiper-pagination-bullet-active {width: 40px;}

    .search-section {padding-top: 120px;padding-bottom: 24px;}
    .search-section .search-box {transform: translate(-50%, -20%);top: -24px;position: absolute;}
    .search-section .search-box .t-box {font-size: 24px;width: 100%;justify-content: space-between;padding: 0 16px;}
    .search-section .search-box .t-box::before {background-position: bottom;background-repeat: no-repeat;background-size: 100% auto;display: block;width: 109px;height: 77px;transform: translateY(1px);}
    .search-section .search-box .search-input {width: calc(100% - 48px);border-radius: 40px;height: 48px;}
    .search-section .search-box .search-input > input {font-size: 16px;padding: 10px 16px;}
    .search-section .search-box .search-input .search-button {width: 48px;height: 48px;background-size: 24px auto;}
    .search-section .search-box .detail-search-button {width: 48px;height: 48px;}
    .search-section .search-box .detail-search-button::after {background-size: 24px auto;}
    .search-section .tab-wrapper .tag-box {border-radius: 24px;padding: 30px 16px;}
    .search-section .tab-wrapper .tag-box .deco-item:nth-of-type(1) {width: 133px;bottom: -15px;left: -5px;}
    .search-section .tab-wrapper .tag-box .deco-item:nth-of-type(2) {width: 63px;top: -25px;right: -28px;}
    .search-section .tab-wrapper .tag-box .deco-item:nth-of-type(3) {width: 63px;top: 50px;right: -23px;}
    .search-section .tab-wrapper .tag-box .tag-list {gap: 8px;}
    .search-section .tab-wrapper .tag-box .title-box .button-box {margin-top: 0;}
    .search-section .tab-wrapper .tag-box .title-box .button-box .search-button {width: 102px;height: 40px;font-size: 18px;column-gap: 0;padding: 8px 14px;}
    .search-section .tab-wrapper .tag-box .title-box .button-box .search-button::before {background-size: 24px auto;width: 24px;height: 24px;}
    .search-section .tab-wrapper .tag-box .title-box .button-box .refresh-button {width: 40px;height: 40px;background-size: 16px auto;}

    .best-section {padding: 50px 0;}
    .best-section .section-wrapper::before {background-image: url(../images/m-cloud-left.svg);background-size: contain;width: 123px;height: 63px;left: 0;transform: translateX(0);top: -15px;}
    .best-section .section-wrapper::after {background-image: url(../images/m-cloud-right.svg);background-size: contain;width: 123px;height: 63px;right: 0;transform: translateX(0);top: -25px;}
    .best-section .title-box {row-gap: 16px;}
    .best-section .title-box .t-box::before {background-size: 100% auto;background-repeat: no-repeat;width: 119px;height: auto;aspect-ratio: 119 / 40;}
    .best-section .best-swiper-box {margin: 24px auto 0;}
    .best-section .best-swiper-box .swiper-slide.up {transform: translateY(0);}
    .best-section .best-swiper-box .swiper-slide .text-box {display: flex;height: 50px;padding: 0 16px;}
    .best-section .best-swiper-box .swiper-slide .best-item-box .img-box::before {width: 50px;height: 46px;background-size:40px 40px;}

    .board-section {padding: 30px 0;}
    .board-section .sns-box .title-box .sns-button > button {width: 40px;height: 40px;}
    .board-section .sns-box .board-swiper-box .swiper-slide .text-box {padding: 16px;}
    .board-section .sns-box .board-swiper-box .swiper-slide .text-box p br{display: none;}

    .board-section .notice-box {padding: 30px var(--container-padding);}
    .board-section .notice-box::before {width: 53px;top: -5px;left: 52px;}
    .board-section .notice-box::after {width: 73px;bottom: -10px;right: -10px;}
    .board-section .notice-box .list-box{flex-direction: column;row-gap: 10px;}
    .board-section .notice-box .list-box .item-box {width: 100%;padding: 12px 16px;}
    .board-section .notice-box .list-box .item-box .text-box::before {margin: 0 auto 8px;width: 20px;}
    .board-section .notice-box .list-box .item-box .text-box .info {margin-top: 8px;}
    .board-section .notice-box .list-box .item-box .text-box .info > li {font-size: 14px;}
    .board-section .notice-box .list-box .item-box .text-box .info > li.icon-view::before {background-image: url(../images/icons/icon-view.svg);width: 20px;height: 20px;transform: translateY(2px);}

}

@media all and (max-width:375px) {
    .best-section .section-wrapper::before {left: -15px;}
    .best-section .section-wrapper::after {right: -15px;}
}

/*호버 이벤트가 가능할때만 적용*/
@media (hover: hover) and (pointer: fine) and (min-width:750px){
    .search-section .tab-wrapper .tag-box .title-box .button-box :is(.search-button,.refresh-button):hover{background-color: var(--orange1);}

    .search-section .tab-wrapper .tag-box .tag-list .tag-item input[type='checkbox'] + label:hover{background-color: var(--orange1);color:var(--white);}

    .best-section .best-swiper-box .swiper-slide:hover {transform: translateY(-5px)}
    .best-section .best-swiper-box .swiper-slide.up:hover {transform: translateY(-52px)}
    .best-section .best-swiper-box .swiper-slide:hover .text-box{box-shadow: var(--shadow1);}

    .board-section .sns-box .board-swiper-box .swiper-slide > a:hover .img-box{box-shadow: var(--shadow1);transform: translateY(-5px)}

    .board-section .notice-box .list-box .item-box:hover{background-color: var(--green1);}
    .board-section .notice-box .list-box .item-box:hover .subject{color:var(--white);}
    .board-section .notice-box .list-box .item-box:hover .text-box .info > li.icon-view::before{content:'';background-image: url("../images/icons/icon-view-hover.svg");}
    .board-section .notice-box .list-box .item-box:hover .text-box .info > li{color:var(--white);}


    .board-section .sns-box .title-box .sns-button >  button.instagram:hover{background-image: url("../images/icons/icon-instagram-on.svg");}
    .board-section .sns-box .title-box .sns-button >  button.facebook:hover{background-image: url("../images/icons/icon-facebook-on.svg");}
    .board-section .sns-box .title-box .sns-button >  button.blog:hover{background-image: url("../images/icons/icon-blog-on.svg");}
    .board-section .sns-box .title-box .sns-button >  button.youtube:hover{background-image: url("../images/icons/icon-youtube-on.svg");}

}