@charset "utf-8";

/**
 * --------------------------------
 * tour CSS
 * --------------------------------
*/

/**
* --------------------------------
* Fonts CSS
* --------------------------------
*/
@font-face { font-family: "Pretendard"; font-weight: 400; src: local("Pretendard Regular"), url("../fonts/Pretendard-Regular.woff2") format("woff2"), url("/resources/fonts/Pretendard-Regular.woff") format("woff"); font-display: swap; }

@font-face { font-family: "Pretendard"; font-weight: 500; src: local("Pretendard Medium"), url("../fonts/Pretendard-Medium.woff2") format("woff2"), url("/resources/fonts/Pretendard-Medium.woff") format("woff"); font-display: swap; }

@font-face { font-family: "Pretendard"; font-weight: 700; src: local("Pretendard Bold"), url("../fonts/fonts/Pretendard-Bold.woff2") format("woff2"), url("/resources/fonts/Pretendard-Bold.woff") format("woff"); font-display: swap; }


section.tour > .inner {position: relative;min-width: 1920px;margin: 0 auto;width: 100%;}
.tour .con .inner {position: relative;max-width: 1720px;width: 100%;margin: 0 auto;}
.tour .visual-area {position: relative;width: 100%;height: 100vh;overflow: hidden;}
.tour .visual-area .btn-area {position: absolute;left: 247px; bottom: 142px;display: block;width: 112px;height: 48px;}
.tour .visual-area .swiper-button-prev,
.tour .visual-area .swiper-button-next {margin: 0; width: 48px;height: 48px;z-index: 5;left: auto;right: auto;top: 0;bottom: 0;transform: translate(0);}
.tour .visual-area .swiper-button-prev {left: 0;}
.tour .visual-area .swiper-button-next {right: 0;}
.tour .visual-area .swiper-button-prev::after {content: '';background-image: url('../images/tour/arrow_btn.svg');width: 48px;height: 48px;}
.tour .visual-area .swiper-button-next::after {content: '';background-image: url('../images/tour/arrow_btn.svg');width: 48px;height: 48px;transform: rotate(180deg);}

.tour .visual-area .view {position: absolute;right: 100px;bottom: 0px;z-index: 2;height: 760px; padding: 40px;overflow-y: scroll;-ms-overflow-style: none;background: linear-gradient(98deg, rgba(255, 255, 255, 0.09) 15.47%, rgba(255, 255, 255, 0.09) 85.14%);box-shadow: 0px 4px 34px 0px rgba(0, 0, 0, 0.15);backdrop-filter: blur(10px);}
.tour .visual-area .view::-webkit-scrollbar{display:none;}
.tour .visual-area .view::after {content: '';display: block;position: absolute;top: 0;left: 0;width: 100%;height: 100vh;;z-index: -1; }
.tour .visual-area .view .view-detail {margin-top: 32px;position: relative;}
.tour .visual-area .view .view-detail button {position: absolute;top: 0; left: 0;width: 100%;height: 100%; cursor: pointer;}

.tour .visual-area .swiper {width: 100%;height: 100%;}
.tour .visual-area .swiper-slide {position: relative;width: 100%;height: 100%;}
.tour .visual-area .swiper-slide .txt-area { position: absolute;top: 340px;left: 246px;}
.tour .visual-area .swiper-slide .video {width: auto;height: 100%;z-index: -2;position: relative; transition: opacity ease-in .4s;}
.tour .visual-area .swiper-slide .video video {width: 100%;height: 100%;object-fit: cover;object-position: 50% 50%;}
.tour .visual-area .swiper-slide {z-index: 1;}
.tour .visual-area .swiper-slide .dim {position: absolute;top: 0;left: 0;width: 100%;height: 100%;opacity: 0.5;background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, #000 100%);z-index: -1;}
.tour .visual-area .swiper-slide .dim::after {content: '';display: block;position: absolute;top: 0;left: 0;width: 100%;height: 100%;opacity: 0.7;background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 63.8%, rgba(0, 0, 0, 0.80) 81.36%, #000 100%);z-index: -1;}
.tour .visual-area .swiper-slide:nth-of-type(1) {background-image: url('../images/tour/tour_visual_01.png');background-position: center center; background-repeat: no-repeat;background-size: cover;}
.tour .visual-area .swiper-slide:nth-of-type(2) {background-image: url('../images/tour/tour_visual_02.png');background-position: center center; background-repeat: no-repeat;background-size: cover;}
.tour .con01 {padding-top: 120px;}
.tour .con01 .img-wrapper {display: flex;justify-content: center;gap: 32px;}
.tour .con01 .banner {position: relative; margin-top: 118px;height: 280px; background-image: url('../images/tour/con_banner.png');background-repeat: no-repeat;background-size: cover;text-align: center;}
.tour .con01 .banner::after {display: block;content: ''; position: absolute;top: 0;left: 0;width: 100%;height: 100%;opacity: 0.4;background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 63.8%, rgba(0, 0, 0, 0.80) 80.09%, #000 100%);}
.tour .con01 .banner::before {display: block;content: ''; position: absolute;top: 0;left: 0;width: 100%;height: 100%;opacity: 0.2;background: #000;}
.tour .con01 .banner img {position: absolute;top: 50%;left:50%;transform: translate(-50%,-50%);z-index: 1;}
.tour .con02 {padding-top: 120px;padding-bottom: 120px;}
.tour .con02 .gallery {display: flex;flex-direction: column;gap: 32px;}
.tour .con02 .gallery .main-cont {position: relative;}
.tour .con02 .gallery .main-cont .txt-area {position: absolute;top: 234px;left: 146px;}
.tour .con02 .gallery .sub-cont {display: flex;gap: 32px;}
.tour .con02 .gallery .sub-cont > div {position: relative; overflow: hidden;}
.tour .con02 .gallery .sub-cont .hover {position: absolute;left: 0;bottom: 0; opacity: 0;transform: translateY(50px);transition: transform ease-in .4s, opacity ease-in .4s;z-index: 1;}
.tour .con02 .gallery .sub-cont .dim {position: absolute;top: 0;left: 0;width: 100%;height: 100%;opacity: 0;background: #000;transition: opacity ease-in .4s;}
.tour .con02 .gallery .sub-cont > div:hover .hover {opacity: 1;transform: translateY(0);}
.tour .con02 .gallery .sub-cont > div:hover .dim {opacity: 0.3;}
.tour .con03 {padding-top: 104px;padding-bottom: 38px; text-align: center;position: relative;}
.tour .con03 .bg {position: absolute;top: 0;left: 0; height: 380px;width: 100%;background-image: url('../images/tour/con03_bg.png'); background-repeat: no-repeat;background-size: cover;}
.tour .con03 .card-area {margin-top: 40px; display: flex;flex-direction: column; gap: 32px;}

.tour .con04 {padding-top:120px;padding-bottom: 160px; text-align: center;}
.tour .con04 .swiper {margin-top: 40px; padding: 0 100px;}
.tour .con04 .swiper .swiper-slide {width: 552px;}
.tour .con04 .swiper .swiper-slide:nth-of-type(even) {margin-top: 150px;}

footer {text-align: center;background-color: #000;}

