/* visual */
.main_visual{ color: #fff; }
.main_visual .swiper-slide{ position: relative; }
.main_visual .swiper-slide::before{ content: ''; position: absolute; inset: 0; background: var(--black) no-repeat 50% / cover; }
.main_visual .slide1::before{ background-image: url('/images/main/visual2.jpg'); }
.main_visual .slide2::before{ background-image: url('/images/main/visual3.jpg'); }
.main_visual .slide3::before{ background-image: url('/images/main/visual4.jpg'); }
.main_visual .swiper-slide .inr{ display: flex; align-items: center; padding-bottom: 1.8%; box-sizing: border-box; }
.main_visual__small{ display: block; }
.main_visual__h2{ font-size: var(--fs48); font-weight: 400; line-height: 1.125; }
.main_visual__p{ margin: 19rem 0 0 10rem; font-size: 18rem; font-weight: 500; }
.main_visual__a{ margin-left: 25rem; display: inline-flex; align-items: center; vertical-align: bottom; font-size: 16rem; font-weight: 700; }
.main_visual__a::before{ content: ''; margin-right: 30rem; display: inline-block; width: 60rem; height: 1px; background: currentColor; opacity: .8; }
.main_visual__a::after{ content: ''; position: relative; top: -1rem; margin-left: 10rem; display: inline-block; width: 9rem; height: 9rem; border: solid currentColor; border-width: 2px 2px 0 0; box-sizing: border-box; transform: rotate(45deg); }
.main_visual__contorl{ position: absolute; inset: auto 0 min(9.13043478%, 84rem); display: flex; align-items: center; height: auto; pointer-events: none; }
.main_visual__btn{ position: relative; top: 1rem; flex-shrink: 0; width: 10rem; height: 16rem; pointer-events: auto; }
.main_visual__btn::after{ content: ''; position: absolute; inset: -20rem; }
.main_visual__btn.prev{ margin-left: 3rem; }
.main_visual__btn.next{ margin: 0 42rem 0 52rem; }
.main_visual__bar{ position: relative; max-width: 180rem; width: 100%; height: 1px; }
.main_visual__bar::before,
.main_visual__bar::after{ content: ''; position: absolute; inset: 0; background: currentColor; }
.main_visual__bar::before{ opacity: .2; }
.main_visual__bar::after{ width: 0; }
.main_visual__bar.play::after{ animation: progress_bar 5s linear both; }
@keyframes progress_bar {
	0%{ width: 0%; }
	100%{ width: 100%; }
}
.main_visual__pager{ margin-left: 31rem; display: inline-flex; gap: 10rem; }
.main_visual__pager .swiper-pagination-bullet{ position: relative; display: flex; align-items: center; justify-content: center; width: 20rem; height: 20rem; background: 0; border: 1px solid #0000; border-radius: 50%; box-sizing: border-box; color: #fff; opacity: .6; pointer-events: auto; }
.main_visual__pager .swiper-pagination-bullet-active{ border-color: currentColor; color: #88bee9; opacity: 1; }
.main_visual__pager .swiper-pagination-bullet::before{ content: ''; display: inline-block; width: 6rem; height: 6rem; background: currentColor; border-radius: 50%; }
.main_visual__pager .swiper-pagination-bullet::after{ content: ''; position: absolute; inset: -5rem; }
.main_down{ position: absolute; right: 13.25%; bottom: 0; display: flex; flex-direction: row; gap: 29rem; font-weight: 500; color: rgba(255, 255, 255, 0.6); writing-mode: vertical-rl; pointer-events: none; z-index: 11; }
.main_down::before{ content: ''; position: absolute; top: -29rem; left: -18rem; width: 60rem; height: 60rem; background: var(--secondary); border-radius: 50%; opacity: .4; }
.main_down__p{ opacity: .6; }
.main_down::after{ content: ''; margin: 0 auto; display: block; width: 1px; height: 60rem; background: currentColor; opacity: .8; }
@media (prefers-reduced-motion: no-preference){
	.main_visual .swiper-slide-active::before{ animation: slide_bg 3s both; }
	@keyframes slide_bg{
		0%{ transform: scale(1.05); }
		100%{ transform: scale(1); }
	}
	.main_visual__h2{ opacity: 0; }
	.main_visual__p{ opacity: 0; }
	.main_visual__a{ opacity: 0; }
	.main_visual .swiper-slide-active .main_visual__h2{ animation: visual_txt .6s .3s both; }
	.main_visual .swiper-slide-active .main_visual__p{ animation: visual_txt .6s .5s both; }
	.main_visual .swiper-slide-active .main_visual__a{ animation: visual_txt .6s .7s both; }
	@keyframes visual_txt{
		0%{ transform: translateX(40rem); opacity: 0; }
		100%{ transform: translateX(0); opacity: 1; }
	}
}
@media(min-width:768px){
	.main_visual{ aspect-ratio: 1920/920; }
}
@media(max-width:767px){
	.main_visual{ height: 100vh; }
	.main_down{ right: 30rem; }
}

/* common */
main *{ letter-spacing: -.025em; }
.common_cat{ position: relative; font-size: 20rem; font-weight: 700; color: var(--secondary); }
.common_cat::before{ content: ''; position: absolute; left: -21rem; bottom: 7rem; display: inline-block; width: 40rem; height: 40rem; background: linear-gradient(120deg, var(--primary), #e7f2ff); border-radius: 50%; z-index: -1; }
.common_h2{ margin-top: .1em; font-size: var(--fs40); font-weight: 700; line-height: 1.25; }
.common_p{ margin-top: 47rem; font-size: 18rem; font-weight: 500; line-height: 1.55555556; color: #444; }
.common_a{ margin-top: clamp(50rem, calc( 81 / var(--inner) * 100vw ), 81rem); display: inline-flex; align-items: center; gap: 12rem; padding: 10rem 29rem 8rem 32rem; border: 1px solid #666; border-radius: 0 20rem 0 20rem; font-weight: 700; white-space: nowrap; }
.common_a .common_arrow{ height: 12rem; }
.common_arrow{ height: 14rem; fill:none; stroke:currentColor; stroke-linecap:round; stroke-linejoin:round; stroke-width:2px;}
.common_arrow.next{ transform: rotate(180deg); }
.common_btn{ display: flex; align-items: center; justify-content: center; width: 39rem; height: 39rem; border: 1px solid currentColor; border-radius: 50%; box-sizing: border-box; color: var(--primary); }

/* business */
.main_biz{ padding: clamp(90rem, calc( 160 / var(--inner) * 100vw ), 160rem) 0 clamp(90rem, calc( 141 / var(--inner) * 100vw ), 141rem); background: url('/images/main/biz_bg.jpg') no-repeat 100% 0 / cover; }
.main_biz .inr{ display: grid; align-items: center; gap: 70rem clamp(40rem, calc( 80 / var(--inner) * 100vw ), 80rem) }
.main_biz__img{ aspect-ratio: 660/540; width: 100%; box-shadow: 4px 7px 17px 3px rgba(0, 0, 0, 0.1); }
@media(min-width:768px){
	.main_biz .inr{ grid-template-columns: repeat(2, 1fr); }
}

/* product */
.main_prod{ padding: 76rem 0 90rem; background: #f7f9fb; }
.main_prod__control{ margin-top: clamp(50rem, calc( 81 / var(--inner) * 100vw ), 81rem); display: flex; gap: 20rem; }
.main_prod__btn{ display: flex; align-items: center; justify-content: center; width: 39rem; height: 39rem; border: 1px solid currentColor; border-radius: 50%; box-sizing: border-box; color: var(--primary); }
.main_prod .common_arrow{ height: 13rem; }
.main_prod__swiper{ margin-top: 51rem; }
.main_prod__a{ display: flex; align-items: flex-end; justify-content: space-between; aspect-ratio: 68/48; width: 100%; padding: 30rem; background: #000 no-repeat 50% / cover; box-sizing: border-box; font-size: var(--fs28); font-weight: 700; color: #fff; }
.main_prod .a1{ background-image: url('/images/main/prod1.jpg'); }
.main_prod .a2{ background-image: url('/images/main/prod2.jpg'); }
.main_prod .a3{ background-image: url('/images/main/prod3.jpg'); }
.main_prod .a4{ background-image: url('/images/main/prod4.jpg'); }
.main_prod__title{ position: relative; padding-bottom: 4rem; background: linear-gradient(0deg, currentColor 2px, #0000 2px); }
.main_prod__box{ display: flex; align-items: center; justify-content: center; width: 60rem; height: 60rem; background: var(--primary); }
.main_prod__arrow{ height: 16rem; fill:none; stroke:currentColor; stroke-linecap:round; stroke-linejoin:round; stroke-width:2px;}
@media(min-width:768px){
	.main_prod__txt{ margin-top: -4rem; display: grid; grid-template: 'cat cat' 'h2 h2' 'p c' / 1fr auto; align-items: baseline; }
	.main_prod .common_cat{ grid-area: cat; }
	.main_prod .common_h2{ grid-area: h2; }
	.main_prod .common_p{ grid-area: p; position: relative; top: -1px; }
	.main_prod__control{ grid-area: c; position: relative; bottom: 10rem; margin: 0; }
	.main_prod__a{ padding-left: 62rem; }
}
@media(min-width:1280px){
	.main_prod__txt{ grid-template: 'cat cat cat' 'h2 p c' / auto 1fr auto; }
	.main_prod .common_p{ margin: 0 0 0 19rem; }
}

/* contact */
.main_cont{ padding: 73rem 0 82rem; background: #193043 url('/images/main/cont_bg.jpg') no-repeat 50% / cover; text-align: center; color: #fff; }
.main_cont .common_cat{ color: currentColor; }
.main_cont .common_cat::before{ display: none; color: inherit; }
.main_cont .common_p{ margin-top: 27rem; color: inherit; }
.main_cont .common_a{ margin-top: 44rem; border-color: currentColor; }

/* case */
.main_case{ overflow: hidden; padding: clamp(90rem, calc( 118 / var(--inner) * 100vw ), 118rem) 0 clamp(90rem, calc( 113 / var(--inner) * 100vw ), 113rem); }
.main_case__control{ margin-top: clamp(50rem, calc( 81 / var(--inner) * 100vw ), 81rem); display: flex; align-items: center; gap: 20rem; }
.main_case__more{ margin-left: 10rem; display: flex; align-items: center; justify-content: center; width: 50rem; height: 50rem; background: var(--primary); color: #fff; }
.main_case__plus{ height: 18rem; fill:none; stroke:currentColor; stroke-linecap:round; stroke-linejoin:round; stroke-width:2px; }
.main_case__swiper{ margin-top: 51rem; clip-path: inset(0 -100vw 0 0); }
.main_case__img_wrap{ overflow: hidden; position: relative; aspect-ratio: 44/34; background: #eee; border-radius: 20rem; }
.main_case__img_wrap::before{ content: ''; position: absolute; inset: 0; background: url(/images/common/no_image.png) no-repeat 50%; filter: grayscale(1); opacity: .5; }
.main_case__img{ position: relative; width: 100%; height: 100%; text-indent: -100vw; }
.main_case__title{ margin-top: 24rem; font-size: 20rem; }
.main_case__date{ margin-top: 8rem; font-weight: 500; color: #888; }
@media(min-width:768px){
	.main_case__txt{ margin-top: -4rem; display: grid; grid-template: 'cat cat' 'h2 h2' 'p c' / 1fr auto; align-items: baseline; }
	.main_case .common_cat{ grid-area: cat; }
	.main_case .common_h2{ grid-area: h2; }
	.main_case .common_p{ grid-area: p; position: relative; top: -1px; }
	.main_case__control{ grid-area: c; position: relative; bottom: 15rem; margin: 0; }
	.main_case__a{ padding-left: 62rem; }
	.main_case__swiper{ margin-top: 22rem; }
}
@media(min-width:1280px){
	.main_case__txt{ grid-template: 'cat cat cat' 'h2 p c' / auto 1fr auto; }
	.main_case .common_p{ margin: 0 0 0 39rem; }
}

/* location */
.main_loc{ padding: 70rem 0; background: #39566c url('/images/main/loc_bg.jpg') no-repeat 50% / cover; }
.main_loc .inr{ display: grid; align-items: center; gap: clamp(40rem, calc( 80 / var(--inner) * 100vw ), 80rem); }
.main_loc .common_cat{ color: #fff; }
.main_loc .common_cat::before{ display: none; }
.main_loc .common_h2{ color: #fff; }
.main_loc__info{ margin-top: 54rem; padding: 30rem clamp(30rem, calc( 50 / var(--inner) * 100vw ), 50rem) 36rem; background: #fff; border-radius: 0 20rem 0 20rem; }
.main_loc__time{ padding: 19rem 0 13rem; border: 1px solid #ccc; border-radius: 10rem; box-sizing: border-box; text-align: center; font-weight: 500; color: #222; }
.main_loc__p.p1{ display: flex; align-items: center; justify-content: center; gap: 12rem; }
.main_loc__clock{ position: relative; top: -1rem; height: 22rem; fill:none; stroke:#000; stroke-linecap:round; stroke-linejoin:round; stroke-width:2px;}
.main_loc__p.p2{ margin-top: -1rem; font-size: 15rem; color: #85a3b8; }
.main_loc__ul{ margin-top: 22rem; }
.main_loc__li{ display: grid; grid-template-columns: 100rem 1fr; }
.main_loc__li + li{ margin-top: 10rem; }
.main_loc__icon{ position: relative; fill:none; stroke:var(--primary); stroke-linecap:round; stroke-linejoin:round; stroke-width:2px; }
.main_loc__icon.i1{ top: -2rem; height: 24rem; }
.main_loc__icon.i2{ height: 20rem; }
.main_loc__icon.i3{ height: 16rem; }
.main_loc__head{ display: flex; align-items: center; gap: 10rem; font-weight: 700; color: #444; }
.main_loc__data{ font-weight: 500; color: #666; }
#wrap .root_daum_roughmap{ width: 100%; border-radius: 20rem; box-shadow: 4rem 7rem 17rem 3rem rgba(0, 0, 0, 0.1); }
#wrap .root_daum_roughmap .wrap_map{ height: 440rem; }
.root_daum_roughmap svg{ pointer-events: none; }
.map_border,
.wrap_controllers{ display: none }
@media(min-width:768px){
	.main_loc .inr{ grid-template-columns: min(50%, 560rem) 1fr; }
	.main_loc__txt{ position: relative; top: 1rem; }
}