@charset "utf-8";
/* *******************************************************
 * filename : layout_pc.css
 * description : pc만 사용하는 CSS
 * date : 2023-06-26
******************************************************** */

/* ========================================================
 * SETTING
======================================================== */
:root{
	--main-color: #ea1d22;
	--area-wrap-width: 1760px;
	--area-box-width: 1600px;
	--area-width: 1410px;
	--area-sub-width: 990px;
	--area-padding: 80px;
	--header-height: 125px;
	--sub-visual-height: 40rem;
	--sub-menu-height: 69px;
	--full-height: 100vh;
	--transition-custom: all 0.4s ease-in-out;
	--transition-custom2: all 0.8s ease-in-out; /* data-scroll */
	--font-family1: 'PALEGOLDENROD';
}

#wrap {overflow:hidden; width:100%; min-width:1630px; position:relative;}
/* header */
/* #gnbMenuContent {position: relative ;} */

@media all and ( max-width: 1630px ){
	.gnb-menu-bottom-controls {right: 2.5rem; bottom: 6rem;}
}

/* -------- 메인컨텐츠 2 (여행지 추천)  -------- */
/* 여행지 탭 내부 - 오른쪽 슬라이드 */
.main-travle-right {position: relative; display: block; width: 63.44%; }
.main-travle-container01,
.main-travle-container02,
.main-travle-container03 {right: -12rem;}
.main-travle-right:after {position: absolute; top: -5rem; left: calc(-100% - 12rem); content: ''; width: 100%; height: 150%; background-color: #fff; z-index: 5;}
.main-travle-item {position: relative; height: 50rem !important; display: flex; align-items: center;}
.main-travle-item .main-travle-item-inner {  position: absolute;width: 26rem !important; overflow: hidden;  box-sizing: border-box; height: 36rem; border: 1px solid #e8e8e8; background: #fff; box-shadow: 10px 10px 20px rgba(0,0,0,0.12); transition: all 0.4s;
    border-radius: 2rem;}
.main-travle-item .main-travle-item-inner .img-thum-box {position: relative; padding-top: 77.27%; overflow: hidden; }
.main-travle-item .main-travle-item-inner .img-thum-box .img-thum { position: absolute; top: 0; left: 0;right: 0; bottom: 0;display: block;overflow: hidden;}
.main-travle-item .main-travle-item-inner .img-thum-box .img-thum img {    position: absolute;top: 0;  left: 0; width: 100%; height: 100%;-webkit-transition: all 0.4s;-moz-transition: all 0.4s;-o-transition: all 0.4s; transition: all 0.4s;}
.main-travle-item .main-travle-item-inner:hover .img-thum-box img {
	-webkit-transform: scale(1.1) rotate(0.002deg); 
	-moz-transform: scale(1.1) rotate(0.002deg);
	-ms-transform: scale(1.1) rotate(0.002deg);
	-o-transform: scale(1.1) rotate(0.002deg); 
	transform: scale(1.1) rotate(0.002deg);
}
.main-travle-item .main-travle-item-inner .txt-box {position: relative; padding: 2.3rem; box-sizing: border-box;}
.main-travle-item .main-travle-item-inner .txt-box .item-tit {font-size: 1.6rem; font-weight: 600; letter-spacing: -0.050em; color: #222222; line-height: 1.18; margin-bottom: 1rem; overflow:hidden; display:block;display: -webkit-box;
    -webkit-line-clamp: 2; -webkit-box-orient: vertical;  transition: var(--transition-custom)}
.main-travle-item .main-travle-item-inner .txt-box .item-txt {font-size: 1rem; font-weight: 300; line-height: 1.1; color: #222222; letter-spacing: -0.050em; overflow:hidden; display:block;display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;  transition: var(--transition-custom)}
.main-travle-item .main-travle-item-inner .item-price {position: absolute; bottom: 2.3rem; left: 2.3rem; font-size: 1.4rem; font-weight: 600; letter-spacing: -0.050em; line-height: 1.1; color: #222222;}
.main-travle-item .main-travle-item-inner .cm-main-btn-style {opacity: 0; visibility: hidden; z-index: 1; position: absolute; width: 5rem; height: 5rem; top: 50%; transform: translateY(-50%) rotate(45deg); margin-top: 8.5%; right: 2rem; }
.main-travle-item .main-travle-item-inner .cm-main-btn-style i {font-size: 2.25rem; transform: rotate(-45deg); transition: var(--transition-custom);}

/* active */
.main-travle-item.swiper-slide-active {position: relative;cursor: pointer; overflow: visible; }
.main-travle-item.swiper-slide-active:after {position: absolute; content: ''; left: calc(-100% - 105rem); content: ''; width: calc(100% + 105rem); height:calc(100% + 9rem); background-color: #fff; z-index: 1;}
.main-travle-item.swiper-slide-active .main-travle-item-inner {width: 38rem !important; height: 50rem; border-radius: 3rem; transform: translateX(-12rem); box-shadow: 15px 15px 30px rgba(0,0,0,0.12); z-index: 99999;}
.main-travle-item.swiper-slide-active .main-travle-item-inner .img-thum-box {padding-top: 79%; } 
.main-travle-item.swiper-slide-active .main-travle-item-inner .txt-box { padding: 3rem; }
.main-travle-item.swiper-slide-active .main-travle-item-inner .txt-box .item-tit {font-size: 2.2rem;}
.main-travle-item.swiper-slide-active .main-travle-item-inner .txt-box .item-txt {font-size: 1.6rem;}
.main-travle-item.swiper-slide-active .main-travle-item-inner .item-price {font-size: 2rem; left: 3rem; bottom: 3rem;}
.main-travle-item.swiper-slide-active .main-travle-item-inner .cm-main-btn-style {opacity: 1; margin-top: 13%; visibility: visible;}
.main-travle-item.swiper-slide-active .main-travle-item-inner:hover .cm-main-btn-style i {transform: rotate(45deg);}