
.visual .swiper-slide{height:90vh;background-blend-mode: multiply}
.visual .swiper-slide.slide01{background:url('/common/img/vi.png') no-repeat top center / cover , rgba(0, 0, 0, 0.0);}
.visual .swiper-slide.slide02{background:url('/common/img/vi2.png') no-repeat top center / cover , rgba(0, 0, 0, 0.4);}
.visual .txt-box  {
	position: absolute;
	width: 92%;
	left:8%;
	top:50%;
 	box-sizing: border-box;
 	z-index: 10;
}
.visual .txt-box > h2  {
	color: #fff;
	font-size: 4em;
	font-weight: 700;
	line-height: 1.2;
	word-break: keep-all;
 	opacity: 0;
	transition: 1s 0.2s;
}
.visual .txt-box > p  {
		color: #fff;
		margin-top:10px;
		font-size: 2em;
		transform: translateY(20px);
		opacity: 0;
		font-weight:300; 
		word-break: keep-all;
		transition: 1s 0.4s;
}
.visual .swiper-slide-active .txt-box > h2,
.visual .swiper-slide-active .txt-box > p  {
	transform: translateY(0);
	opacity: 1;
}

.visual .all-box  {
	position: absolute;
	display: inline-flex;
	width: 92%;
	left:8%;
	height: 25px;
 	bottom:10%;
  	box-sizing: border-box;
    font-size:1.3em; 
	z-index: 20; 
 	font-weight:400;
	letter-spacing:3px;
	line-height:1;
}
.visual .progress-box  {
	position: relative;
	width: 170px;
	height: 50px;
	z-index: 11;
}
.autoplay-progress  {
	position: absolute;
	left: 30px;
	top: 10px;
	z-index: 10;
	width: 100px;
	height: 3px;
	background-color: rgba(0, 0, 0, 0.1);
}

.autoplay-progress svg  {
	--progress: 0;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 10;
	width: 100%;
 	stroke-width: 4px;
	stroke: #fff;
	fill: none;
	stroke-dashoffset: calc(100 * (1 - var(--progress)));
	stroke-dasharray: 100;
}


.visual .swiper-pagination  {
	display: flex;
	color: #fff;
	justify-content: space-between;
	position: static;
	text-align: left;
	letter-spacing:-1px;
}
.visual .swiper-pagination span {color:#fff}
.visual .arrow-box  {
	position: relative;
	width: 80px;
	height: 50px;
}
.visual .swiper-button-next:after, .visual .swiper-button-prev:after{display:none;}

.visual .swiper-button-next,
.visual .swiper-button-prev {
	width: 21px;
	height: 21px;
	top: 0;
	margin-top: 0;
	background: none;
}

.visual .swiper-button-next::before,
.visual .swiper-button-prev::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 8px;
	height: 8px;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	transform-origin: center;
}
.visual .swiper-button-prev::before {
	transform: translate(-50%, -50%) rotate(-135deg);
}

  .visual .swiper-button-next::before {
	transform: translate(-50%, -50%) rotate(45deg);
}


@media(max-width:900px){
		.visual .swiper-slide.slide01{background-position:70% center; background-color:rgba(0, 0, 0, 0.2);}
		.visual .txt-box {width:92%; left:4%;}
		.visual .txt-box > h2 {font-size:2.5em}
		.visual .txt-box > p {font-size:1.1em;}
		.visual .all-box  { width:90%; left:5%; }
 
}

.eng{font-family:'Crimson Text' ; line-height:1 !important;}
.main_con .titbox{text-align:center; margin:180px 0 60px 0;}
.main_con .titbox h2{font-size:3.7em; color:#333; margin-bottom:0; position:relative; line-height:1; font-family:'Crimson Text'}
.main_con .titbox h2::before{
    content: '';
    position: absolute;
    left: calc(50% - 20px);
    width: 40px;
    height: 10px;
    background: linear-gradient(90deg, var(--main_c) 50%, #bbb 50%);
    border-radius: 2px;
    top: -12px;
 }
.main_con .titbox p{font-size:1.3em; color:#777; font-weight:400; margin-top:10px;} 

@media(max-width:900px){
	.main_con .titbox {margin:100px 0 30px 0;}
	.main_con .titbox h2{font-size:2.5em; }
	.main_con .titbox p{font-size:1em; }
}

.main_pd .wrap {
	display: flex;
	width: 100%;
	max-width:1600px;
	margin:0 auto;
	height: 85vh; 
	background: #333;
}

.main_pd .box {
	position: relative;
	flex: 1; 
	overflow: hidden; 
	cursor: pointer;
	border-right: 1px solid #fff; box-sizing:border-box;
}

.main_pd .box:last-child {
	border-right: none;
}

.main_pd img {
	width: 100%;
	height: 100%;
	object-fit: cover; 
	transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
	filter: brightness(0.9); 
}

.main_pd .overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgb(16 45 113 / 70%);
	opacity: 0;
	transition: opacity 0.4s ease;
	z-index: 1;
}

.main_pd .txtbox {
	position: absolute;
	bottom: 0;
	left: 50px;
	right: 50px;
	z-index: 2;
	color: #fff;
}

.main_pd .txtbox h3 {
	font-size: 3.2em; 
	font-weight: 700;
	margin-bottom: 20px;
	line-height: 1.2;
	text-shadow: 2px 2px 10px rgba(0,0,0,0.3);
	color:#fff;
	transform: translateY(10px);
	transition: transform 0.4s ease;
}

.main_pd .txtbox p {
	font-size: 1.3em;
	line-height: 1.6;
	font-weight: 300;
	opacity: 0;
	max-width: 500px;
	color:#fff;
	transform: translateY(30px);
	transition: all 0.4s ease 0.1s; 
}

.main_pd .arrow-icon {
	position: absolute;
	top: 40px;
	right: 40px;
	font-size: 3em;
	color: #fff;
	z-index: 2;
	transition: opacity 0.3s, transform 0.3s;
	font-family: 'Noto Sans KR', sans-serif;
}


.main_pd .box:hover img {
	transform: scale(1.1); 
}

.main_pd .box:hover .overlay {
	opacity: 1;
}

.main_pd .box:hover .txtbox h3 {
	transform: translateY(-50px); text-shadow:none;
}

.main_pd .box:hover .txtbox p {
	opacity: 1;
	transform: translateY(-60px);
}

.main_pd .box:hover .arrow-icon {
	opacity: 1;
	transform: rotate(-45deg); 
}


    @media (max-width: 900px) {
        .main_pd .wrap {
            flex-direction: column;
            height: auto;
        }
        .main_pd .box {
            height: 50vh; 
            border-right: none;
        }
		.main_pd .box:first-of-type{border-bottom: 1px solid #fff;}
		.main_pd .txtbox{left:30px;}
        .main_pd .txtbox h3 {font-size: 2em; transform: translateY(-20px);}
		.main_pd .txtbox p {display:none;}

    }



.gallery-slider .wrap {
    position: relative;
    overflow: hidden;
    border-radius: 8px;
    height: 450px; 
    cursor: pointer;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}

.gallery-slider .wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}


.gallery-slider .box {
    position: absolute;
    bottom: 0; left: 0; width: 100%;
    background: rgba(255, 255, 255, 0.95);
    padding: 20px 25px;
    display: flex;
    justify-content: space-between; 
    align-items: center;
	box-sizing:border-box;
    transform: translateY(35px); 
    transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1);
}


.gallery-slider .txtbox h4 {
    margin: 0;
    font-size: 1.3em;
    font-weight: 500;
    color: #222;    
	overflow: hidden; 
	text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

.gallery-slider .txtbox span {
    display: block;
    margin-top: 5px;
    font-size: 1.1em;
    color: #666;
    opacity: 0; 
    transform: translateY(10px);
    transition: all 0.3s ease;
}

.gallery-slider .arrow {
    width: 40px; height: 40px;
    display: flex; justify-content: center; align-items: center;
    border-radius: 50%;
    background: var(--main_c); 
    color: #fff;
    font-size: 1em;
    opacity: 0;
    transform: translateX(-20px); 
    transition: all 0.4s ease;
	flex-shrink:0;
}
.gallery-slider .arrow i{color:#fff;}

.gallery-slider .wrap:hover img {
    transform: scale(1.1);
}

.gallery-slider .wrap:hover .box {
    transform: translateY(0);
}

.gallery-slider .wrap:hover .txtbox span {
    opacity: 1;
    transform: translateY(0);
    color: var(--main_c); 
}
.gallery-slider .wrap:hover .arrow {
    opacity: 1;
    transform: translateX(0); 
}
.gallery-slider .swiper-pagination-bullet-active {
    background: var(--main_c) !important;
}

@media (max-width: 900px) {
	.gallery-slider .wrap {height:60vw;}
	.gallery-slider .box{padding:15px;}
	.gallery-slider .txtbox h4{font-size:1em;}
}

.col3 {
	margin-top:120px;
    background-color: #191919;
    padding: 120px 0;
	box-sizing:border-box;
    color: #fff;
    display: flex; justify-content: center;
}

.col3 .in {
    width: 100%;
    display: flex;
    gap: 40px;
    align-items: stretch;
}


.main_notice {
    width:40%; 
}

.main_notice .titbox {margin:0;
    display: flex; justify-content: space-between; align-items: center;
    margin-bottom: 30px; border-bottom: 1px solid rgba(255,255,255,0.4);
    padding-bottom: 5px; box-sizing:border-box;
}
.main_notice .titbox h3 { font-size: 2em; font-weight: 600; color: rgba(255,255,255,0.9); margin-bottom:0;}
.main_notice .titbox i{ color: rgba(255,255,255,0.5); transition: 0.3s; font-size:1.2em;}
.main_notice .titbox i:hover { color: var(--main_c); }

.main_notice ul { flex: 1; display: flex; flex-direction: column; gap: 15px;  }
.main_notice ul::-webkit-scrollbar { width: 4px; }
.main_notice ul::-webkit-scrollbar-thumb { background: #444; border-radius: 2px; }

.main_notice li {
    display: block; padding: 25px ; background:#333; box-sizing:border-box; transition: all 0.3s;
}
.main_notice li:hover {
   border:1px solid rgba(255,255,255,0.4); transform: translateX(5px); box-sizing:border-box;
}
.main_notice li .title {
    display: block; font-size: 1.15em; margin-bottom: 3px; font-weight: 500;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #fff; opacity:.9;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}
.main_notice li .date { font-size: 1.1em; color: #999; }



.video {
	width:30%;
	height:557px;
    position: relative;
    border-radius: 4px; overflow: hidden;
    box-shadow: 0 20px 40px rgba(0,0,0,0.3);
}
.video video { width: 100%; height: 100%; object-fit: cover; }
.video-overlay {
    position: absolute; bottom: 0; left: 0; width: 100%; padding: 40px 30px;
    background: linear-gradient(to top, rgba(0,0,0,0.9), transparent); box-sizing:border-box;
}
.video-overlay h4 {
    font-size: 1.8em; font-weight: 700; line-height: 1.3;
    text-shadow: 0 2px 10px rgba(0,0,0,0.5); color:#fff;
}
.video-overlay span { color: #2c62d3; display:inline-block;  margin-top:5px;}



.quick {
	width:30%;
    display: flex;
    flex-direction: column;
    gap: 15px; 
}

.quick .wrap{
    flex: 1; 
    border-radius: 4px;
    padding: 0 30px;
    display: flex; align-items: center;
    position: relative; overflow: hidden;
    cursor: pointer; transition: all 0.3s;
    border: 1px solid rgba(255,255,255,0.2);
    justify-content: flex-start; 
    gap: 20px;
	box-sizing:border-box;
}

.quick .wrap:hover {
    border-color: var(--main_c);
    transform: translateY(-3px);
}


.quick .wrap .iconbox {
    font-size: 2.5em; color: #999; transition: 0.3s;
}
.quick .wrap .iconbox i{color:#777;     font-size: 1.2em;}
.quick .wrap:hover .iconbox { color: var(--main_c); }


.quick .txtbox h4 { font-size: 1.7em; font-weight: 700; margin-bottom: 5px; color: rgba(255,255,255,0.9); line-height:1;}
.quick .txtbox p { font-size: 1em; color: #999; margin-bottom:0; font-weight:400;}


.quick .location {
    background: var(--main_c);
    justify-content: space-between;
    box-shadow: 0 10px 20px rgb(16 45 113 / 20%);
	border:none;
}
.quick .location:hover {
    transform: translateY(-3px);
    box-shadow: 0 15px 30px rgb(16 45 113 / 40%);
}


.quick .location > i {
    position: absolute; right: -10px; top: -10px;
    font-size: 140px; 
    color: rgba(255,255,255,0.1);
    transform: rotate(-15deg); pointer-events: none; transition: 0.5s;
}
.quick .location:hover i { transform: rotate(0deg) scale(1.1); }


.quick .location  { position: relative; z-index: 2; }
.quick .location span {
    font-size: 1em; font-weight: 700; opacity: 0.6; 
    letter-spacing: 2px; display: block; margin-bottom: 3px; color:#fff;
}
.quick .location h4 {  font-weight: 700; color: #fff; }


.btn-circle {
    width: 45px; height: 45px; border-radius: 50%;
    border: 1px solid rgba(255,255,255,0.2);
    display: flex; justify-content: center; align-items: center;
    color: #fff; transition: 0.3s;
    margin-left: auto; 
    position: relative; z-index: 3;
}
.btn-circle i{color:#fff; opacity:.9;}

.quick .wrap:hover .btn-circle {
    background: var(--main_c); border-color: var(--main_c);
}


.btn-white {
    background: #fff; border-color: #fff; color: var(--main_c); margin-left: 0;
}
.btn-white i{color:#333;}
.quick .location:hover .btn-white {
    background: #222; border-color: #222; color: #fff;
}
.quick .location:hover .btn-white i{color:#fff; opacity:.9;}

@media (max-width: 1200px) {
	 .col3{font-size:.8em; padding:100px 0; margin-top:100px;}
	 .col3 .in{gap:10px;}
	 .video{height:500px;}
}
@media (max-width: 900px) {
    .col3 .in { flex-direction: column; align-items: center; gap:60px;}
    .main_notice { width: 100%; }
    .video { width: 100%; height:auto;}
    .quick { width: 100%; }
	.quick .wrap{padding:30px;}
}	



.main_bn{ padding:120px 0; box-sizing:border-box; background: url('/common/img/main_bn.png') no-repeat center / cover , rgba(0,0,0,0.4); background-blend-mode:multiply;}
.main_bn .in {
   color: #fff;
	display: flex; justify-content: space-between; align-items: center;
	position: relative; 
}
.main_bn h3 { font-size: 2.8em; font-weight: 400; margin-bottom: 10px;  color:#fff; line-height:1.2;}
.main_bn  b { color:#fff; font-weight:700; letter-spacing:-2px;}
.main_bn p { font-size: 1.2em; opacity: 0.9; color:#fff; margin-bottom:0;}

.main_bn a {
	display: inline-flex; align-items: center; gap: 10px;
	padding: 20px 45px; background: var(--main_c); color: #fff;
	font-size: 1.2em; font-weight: 500; border-radius: 50px;
	box-shadow: 0 5px 15px rgb(16 45 113 / 40%); transition: all 0.3s ease; line-height:1;
}
.main_bn a:hover {
	background: #fff; color: var(--main_c); transform: translateY(-3px);
	box-shadow: 0 10px 25px rgb(16 45 113 / 30%);
}
.main_bn i { transition: transform 0.3s; margin-top: -4px; color:#fff;}
.main_bn a:hover i { transform: translateX(5px); color: var(--main_c);  }

@media (max-width: 900px) {
	.main_bn{padding:100px 0;}
	.main_bn .in{flex-direction:column; gap:10px; font-size:.8em;}
	.main_bn .in .left{text-align:center;}
}

.quick-menu {
	position: fixed; bottom: 40px; right: 40px;
	display: flex; flex-direction: column; gap: 15px; z-index: 999;
}
.quick-btn {
	width: 60px; height: 60px; border-radius: 50%;
	display: flex; justify-content: center; align-items: center;
	box-shadow: 0 4px 15px rgba(0,0,0,0.2);
	font-size: 24px; color: #fff; cursor: pointer; transition: 0.3s;
	position: relative;
}
.quick-btn.kakao { background: #ffe812; color: #3c1e1e; }
.quick-btn.inquiry { background: var(--main_c); }
.quick-btn.inquiry i { color:#fff;}
.quick-btn:hover { transform: translateY(-5px); }
    
@media (max-width: 900px) {
	.quick-menu{bottom:20px; right:20px;}
}