body{font-family: 'Pretendard';}
html{font-family: 'Pretendard';}
div{font-family: 'Pretendard';}
h2{font-weight:800; font-family: 'SUITE'}
*{box-sizing:border-box}
/* 전체 레이아웃 */
.main-section {display: flex;    gap: 50px;	height:860px;	 align-items:stretch; position:relative}
/* 공통 박스 */
.main-box {position: relative;    overflow: hidden;	background:#000;	flex:1;	cursor:pointer;    /* 애니메이션 기본 상태 */    opacity: 0;    transition: all 0.6s ease;border-radius:20px; box-shadow:5px 5px 5px #e3e3e3 }

/* 좌측 큰 박스 */
.main-left {    width: 50%;    height: 860px;    /*background: url('/images/mtour/main/main_box_img1.jpg') no-repeat center/cover;*/    position: relative;	margin-left:50px}

/* 우측 */
.main-right {position: relative;width: 50%;	height:100%;    display: flex;    gap: 50px;    align-items:stretch;}
.main-right .col{position: relative;display: flex;	flex-direction:column;	gap:50px;	width:50%;	align-items:stretch;}

/* 비율로 분배 */
.main-right .col:nth-child(1){    flex:5.5;}
.main-right .col:nth-child(1) .main-box:nth-child(1){flex:5.7}
.main-right .col:nth-child(1) .main-box:nth-child(2){flex:4.3}
.main-right .col:nth-child(2){flex:4.5;}
.main-right .col:nth-child(2) .main-box:nth-child(1){flex:5.5}
.main-right .col:nth-child(2) .main-box:nth-child(2){flex:4.5}

/*
.main-right .main-box:nth-child(1) { background: url('/images/mtour/main/main_box_img2.jpg') center/cover; }
.main-right .main-box:nth-child(2) { background: url('/images/mtour/main/main_box_img4.jpg') center/cover; }
.main-right .main-box:nth-child(3) { background: url('/images/mtour/main/main_box_img3.jpg') center/cover; }
.main-right .main-box:nth-child(4) { background: url('/images/mtour/main/main_box_img5.jpg') center/cover; }
*/


/* 등장 방향 */
.from-bottom { transform: translateY(40px); }
.from-left   { transform: translateX(-40px); }
.from-right  { transform: translateX(40px); }

/* 등장 후 */
.main-box.show {opacity: 1;    transform: translate(0,0);}
.main-section img{object-fit:cover; width:100%; height:100%; }

.main-section .main-left img {opacity:.9; /*animation: opacityLoopL 3s infinite ease-in-out;*/}
.main-section .main-right .main-box img {transition: all 0.8s ease; 	opacity:.6;}
.main-section .main-right .main-box:hover img{	opacity:1}
.main-right .col:nth-child(1) .main-box:first-child img {transition: all 0.8s ease; 	opacity:.75; 	animation: opacityLoopR 3s infinite ease-in-out;}
.main-right .col:nth-child(1) .main-box:last-child img {transition: all 0.8s ease; 	opacity:.75; 	animation: opacityLoopRD 3s infinite ease-in-out;}
.main-right .col:nth-child(1) .main-box:first-child:hover img{opacity:1}

.main-right .col:nth-child(2) .main-box:first-child img {transition: all 0.8s ease; 	opacity:.75; 	animation: opacityLoopRD 3s infinite ease-in-out;}
.main-right .col:nth-child(2) .main-box:last-child img {transition: all 0.8s ease; 	opacity:.75; 	animation: opacityLoopR 3s infinite ease-in-out;}


/* 텍스트 */
.main-section .txt {    position: absolute;    left: 20px;    top: 2em;    color: #fff;	z-index:1;	width:90%; }
a.bk_btn{	display:table; 	margin:1.2em auto auto auto; 	color:#fff; 	background:#0bab6d; 	border-radius:30px; 	padding:.5em 1.2em; 	text-align:center;	font-size:105%; 	font-weight:500; font-family:SUITE; font-weight:700; transition: all 0.4s ease; }
a.bk_btn:hover{background:yellow; color:rgba(0,0,0,.6)}
.main-section .main-left .txt {font-size:110%;	text-align:center}
.main-section .main-left .txt h2{font-size:220%; padding-bottom:10px;}

.main-section .main-right .txt {font-size:110%; left:2em}
.main-section .main-right .txt h2{font-size:130%; padding-top:5px;}
.main-section .main-right .txt p{font-size:82%}


@keyframes opacityLoopL {
    0%   { opacity: 1; }
    50%  { opacity: 0.6; }
    100% { opacity: 1; }
}

@keyframes opacityLoopR {
    0%   { opacity: 0.6; }
    50%  { opacity: 1; }
    100% { opacity: 0.6; }
}

@keyframes opacityLoopRD {
    0%   { opacity: 0.8; }
    50%  { opacity: 0.4; }
    100% { opacity: 0.8; }
}

/* 순차적으로 나타나기 div */
.sc {
    opacity: 0;
    transform: translateY(50px);
    transition: opacity 0.8s ease, transform 0.8s ease;
    will-change: opacity, transform;
}

.sc.show {
    opacity: 1;
    transform: translateY(0);
}

.main_gallery{clear:both; background:#239c67;padding:3.5em; margin:3em 0}

.main_gallery .gallery_title{position:relative; text-align:center; font-size:108%; display:flex; width:auto; align-items:baseline; justify-content:center}
.main_gallery .gallery_title h2{color:#fff951; width:auto; position:relative}
.main_gallery .gallery_title h2 img{position:absolute; margin-left:-30px; top:-22px; animation: zoom .3s ease-in-out infinite alternate;}
.main_gallery .gallery_title p{color:#fff; padding:0.5em; font-weight:700}
.main_gallery .gallery_title .title_icon_left{padding-right:20px}
.main_gallery .gallery_title .title_icon_left img{margin-top:-30px; width:100%; max-width:112px;animation: twinkles 1s ease-in-out infinite alternate;}
.main_gallery .gallery_title .title_icon_right {}
.main_gallery .gallery_title .title_icon_right img{margin-top:-30px;    animation: twinkles 1s ease-in-out infinite alternate; width:100%; max-width:185px}

.main_gallery .gallery_box{background:#fff; padding:2em 2em 0.5em 2em; text-align:center; margin-top:1em; border-radius:15px;}
.main_gallery .gallery_box ul{display:flex; gap:1em;}
.main_gallery .gallery_box ul li{}
.main_gallery .gallery_box ul li p{width:95%; margin:auto}
.main_gallery .gallery_box ul li p span{font-size:90%; opacity:.7}
.main_gallery .gallery_box .box_in{}


@keyframes swing {
    0%   { transform: rotate(-5deg); }
    100% { transform: rotate(5deg); }
}
@keyframes zoom {
    0%   { transform: scale(.7); }
    100% { transform: scale(1); }
}
@keyframes twinkles {
    0%   { opacity: 0.2; transform: scale(1); }
    100% { opacity: 1;   transform: scale(1); }
}

.main_bottom{width:95%; max-width:1650px; margin:auto; display:flex; justify-content:space-between; align-items:flex-start; padding:3em 0; align-items: stretch;}
		.main_notice{width:50%}
		.main_notice .notice_title{display:block; position:relative}
		.main_notice .notice_title h2{margin:0; padding:0; font-size:132%; }
		.main_notice .notice_title span{position:absolute; right:20px; top:0px; width:37px; height:37px; line-height:35px; border:1px solid rgba(0,0,0,0.4);border-radius:50%; font-size:30px; font-weight:100; font-family:SUIT; text-align:center; opacity:.5; display:block}
		.main_notice .notice_list{padding-top:1.2em}

		.program_banner{position:relative; background:#000; max-width:545px; margin:0 2em; cursor:pointer; border-radius:15px;}
		.program_banner .banner_title{position:absolute; width:100%; top:50%; transform:translateY(-50%); color:#fff; z-index:1; font-size:120%; text-align:center;}
		.program_banner .banner_title b{font-weight:800; font-size:132%;}
		.program_banner .banner_title span{font-size:70%; display:block}
		.program_banner img{opacity:.5; transition:all 1s; border-radius:15px;object-fit: cover;    width: 100%;    height: 100%}
		.program_banner:hover img{opacity:.7; }
		


		.main_sns{position:relative; width:245px; background:#000; transition:all 1s; border-radius:15px;}
		.main_sns a img{width:100%; max-width:245px; opacity:.7; transition:all 1s; border-radius:15px;}
		.main_sns .sns_icon{position:absolute; top:15px; left:15px; z-index:1}
		.main_sns .sns_icon img{opacity:1}
		.main_sns:hover img{opacity:1}




		footer .footer {max-width:1650px}
		footer div{font-size:87%; font-family:Pretendard}
		footer .footer address p{padding:.2rem 0}
		footer .footer .private_btn a{padding:0.6rem 1.5rem}



/* 커서 따라다니며 반짝거리기 */



@keyframes twinkle {
    from { transform: translate(-50%, -50%) scale(1); opacity: 0.7; }
    to   { transform: translate(-50%, -50%) scale(1.3); opacity: 1; }
}



.star {
    position: fixed;
    width: 20px;
    height: 20px;
    pointer-events: none;
    background: url('/images/mtour/common/star_cursor.png') no-repeat center / contain;
    transform: translate(-30%, -30%);
    z-index: 9999;
    display: none;
    animation: twinkle 1s infinite alternate;
}

/* ⭐ 잔상 */
.star-trail {
    position: fixed;
    width: 20px;
    height: 20px;
    pointer-events: none;
    background: url('/images/mtour/common/star_cursor.png') no-repeat center / contain;
    transform: translate(-30%, -30%);
    z-index: 9998;

    opacity: 0.8;
    animation: trailFade 0.8s ease-out forwards;
}

/* 잔상 사라지는 애니메이션 */
@keyframes trailFade {
    0% {
        opacity: 0.8;
        transform: translate(-30%, -30%) scale(1);
    }
    100% {
        opacity: 0;
        transform: translate(-30%, -30%) scale(0.5);
    }
}



@media (max-width:1024px){
.main-box{font-size:80%; word-break:keep-all}

.main-section{flex-direction:column; height:auto; gap:15px; margin:auto;  width:90%}
.main-left{margin-left:0; width:100%; margin:auto}
.main-section .main-right .txt{left:auto; text-align:center; width:100%; padding:0 0.5em}
.main-section .main-right .txt h2{padding-top:0px}
.main-section .txt{top:1.5em}
.main-section .main-left .txt p{word-break:keep-all; width:70%; margin:auto}
a.bk_btn{margin:9.2em auto auto auto}

.main-right{width:100%; gap:20px; width:100%; margin:auto; gap:10px;}
.main-right .col{gap:10px}
.main-right .col:nth-child(1){flex:5}
.main-right .col:nth-child(2){flex:5}
.main-right .col:nth-child(1) .main-box:nth-child(2){flex:5}
.main-right .col:nth-child(2) .main-box:nth-child(2){flex:5}


.main_gallery{margin:2em 0; padding:2em 1.5em; overflow:hidden}
.main_gallery .gallery_title{display:block; width:100%; position:relative; font-size:100%}
.main_gallery .gallery_title .title_icon_left{position:absolute; left:-10px; top:10px}
.main_gallery .gallery_title .title_icon_left img{width:50%; }
.main_gallery .gallery_title .title_icon_right{position:absolute; right:-70px; top:10px}
.main_gallery .gallery_title .title_icon_right img{width:50%}
.main_gallery .gallery_title h2{width:100%}
.main_gallery .gallery_title h2 img{width:12%; max-width:40px}

.main_gallery .gallery_title p{font-weight:500; font-size:87%;}
.main_gallery .gallery_box{padding:1em}

.main_bottom{flex-direction:column; padding:0 0 1em 0}
.main_notice{width:93%; margin:auto}
.main_notice .notice_title span{right:0; width:30px; height:30px; line-height:29px; font-size:24px;}
.program_banner{width:97%; margin:1em auto}
.program_banner .banner_title b{font-size:105%}

.main_sns{max-width:100%; background:#fff;}
.main_sns .sns_div{background:#000; border-radius:15px; width:50%; margin-righ:10px;}
.main_sns .slick-slide{margin:5px;}
.main_sns a img{width:100%; height:100%; max-width:100%; object-fit:cover}


}