/* visual */
.main_visual{ color: #fff; }
.main_visual .swiper-slide{ position: relative; display: flex;}
.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/main_visual01.jpg'); }
.main_visual .slide2::before{ background-image: url('/images/main/main_visual02.jpg'); }
.main_visual .slide3::before{ background-image: url('/images/main/main_visual03.jpg'); }
.main_visual .swiper-slide .inr{ display: flex; align-items: center; justify-content: center; text-align: center; padding-top: 2.5%; box-sizing: border-box; }
.main_visual__small{ display: block; }
.main_visual__h2{ font-size: var(--fs54);  line-height: 1.125; font-family: 'poppins'; font-weight: 600; letter-spacing:-0.025em;}
.main_visual__p{ margin: 22rem 0 0 10rem; font-size: 24rem; font-weight: 500; line-height: 1.25;letter-spacing: 0em;}
.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_control {position: absolute; max-width: calc(var(--inner) * 1rem); width: calc(var(--inner_width) * 100%); margin: 0 auto; inset: 0;}
.main_visual__contorl{ position: absolute; z-index: 2; bottom: 0; right: 0; display: flex; flex-direction: column; align-items: center;}
/* .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;width: 1px;  height: 160rem; }
.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{ height: 0; }
.main_visual__bar.play::after{ animation: progress_bar 5s linear both; }
@keyframes progress_bar {
	0%{ height: 0%; }
	100%{ height: 100%; }
}
.main_visual__pager{ display: flex; flex-direction: column; align-items: center; margin-bottom: 10rem;}
.main_visual__pager .swiper-pagination-bullet{ position: relative; display: flex; align-items: center; justify-content: center; width: 25rem; height: 25rem; background: 0;  box-sizing: border-box; color: #fff; opacity: .6; pointer-events: auto; }
.main_visual__pager .swiper-pagination-bullet-active{ border-color: currentColor; opacity: 1; }
.main_visual__pager .swiper-pagination-bullet::before{ content: ''; display: inline-block; width: 9rem; height: 9rem; background: currentColor; border-radius: 50%; }
.main_visual__pager .swiper-pagination-bullet::after{ content: ''; position: absolute; inset: -5rem; }
.main_down{ position: absolute;  bottom: 0; display: flex; flex-direction: column; font-weight: 500; color: rgba(255, 255, 255, 0.6); writing-mode: vertical-rl; pointer-events: none; z-index: 11; }
.main_down div .circle {width: 9rem; height: 9rem; background: #fff; border-radius: 50%; position: absolute; left: -12%;}
.main_down div .line {width: 1px ; height: 280rem; background: #fff;}
.main_down__p{ opacity: .6; margin-left: 5px; font-family: 'poppins';}
.swiper-button-pause {width: 35px; height: 35px; background: url(/images/common/pause.png) no-repeat center/contain; transition: .3s;}
.swiper-button-pause.on {background: url(/images/common/play.png) no-repeat center/contain;}
@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(max-width:1280px){
	.main_down div .line {height: 160rem;}
	.main_visual__bar {height: 60rem;}
}
@media(min-width:768px){
	.main_visual{ aspect-ratio: 1920/920; }
}
@media(max-width:767px){
	.main_visual{ height: 100vh; }
	.main_visual__p {font-size: 20rem;}
}

/* common */
main *{ letter-spacing: -.025em; }
.common_cat{ position: relative; font-size: 20rem; font-weight: 700; color: var(--secondary); font-family: 'poppins';}
.common_cat::before{ content: ''; position: absolute; left: -21rem; bottom: 7rem; display: inline-block; width: 40rem; height: 40rem; background: url(/images/common/cat.png) no-repeat;z-index: -1; }
.common_h2{position: relative; margin-top: .1em; font-family: 'poppins'; font-size: var(--fs54); font-weight: 700; line-height: 1.15; color: var(--primary);}
.common_h2::before{ content: ''; position: absolute; left: -20rem; top: -20rem;  display: inline-block; width: 40rem; height: 40rem; background: url(/images/common/cat.png) no-repeat;z-index: -1; }
.common_p{ margin-top: 47rem; font-size: 24rem; font-weight: 500; line-height: 1.55555556; color: #444; }
.common_a{ display: flex; align-items: center; gap: 10px; margin-bottom: 17px; font-size: 18rem;}
.common_a .common_arrow{ height: 12rem; color: #fff;}
.common_a > div {background: #2f96c1; width: 36rem; height: 36rem; border-radius: 50%; display: flex; justify-content: center; align-items: center;}
.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: 60rem; height: 60rem; border: 1px solid #cccccc; box-sizing: border-box; color: var(--primary); background: #ededed;}
.cont_head {display: flex; justify-content: space-between; align-items: end;}
.cont_head_line {height: 1px; width: 58%; opacity: 0.3;  background: #000; box-sizing: border-box; margin-bottom: 35px;}

@media(max-width:1280px){
	.cont_head_line {width: 20%;}

}
@media(max-width:767px){
	.cont_head_line {display: none;}
	.cont_head {flex-direction: column; gap: 20rem;}
	

}

/* business */
.main_biz{ padding: 140rem 0;}
.main_biz .inr{ display: flex; flex-direction: column; align-items: center; background: url(/images/main/biz_bg.jpg) no-repeat 100% 0; padding-bottom: 50rem;}
.main_biz__img{ margin-top: 0rem; aspect-ratio: 1660/420; width: 100%; border-radius: 40px 0 0 40px;}
.main_biz__txt {width: 100%;}
.biz_img_wrap {height: 100%; margin: 0 0 0 auto; display: flex; justify-content: flex-end; width: calc(50% + 700px);}

@media(max-width:767px){
	.main_biz__img {aspect-ratio: 1660/580;}
	.biz_img_wrap {width: 580px;}

}
/* product */
.main_prod{ padding: 20rem 0 90rem;  }
.main_prod ~ div {background: #fafafa; padding: 40rem 0 50rem; position: relative; margin-top: -30rem; margin-bottom: 100rem;}
.main_prod__swiper {max-width: 1400px; margin: 0 auto;}
.main_prod__control{ display: flex; width: 90%; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); justify-content: space-between;}
.main_prod__btn{ display: flex; align-items: center; justify-content: center; width: 60rem; height: 60rem; border: 1px solid currentColor; box-sizing: border-box; color: var(--primary); }
.main_prod .common_arrow{ height: 15rem; }
.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__swiper .a1{ background-image: url('/images/main/prod1.jpg'); }
.main_prod__swiper .a2{ background-image: url('/images/main/prod2.jpg'); }
.main_prod__swiper .a3{ background-image: url('/images/main/prod3.jpg'); }
.main_prod__swiper .a4{ background-image: url('/images/main/prod4.jpg'); }
.main_prod__swiper .a5{ background-image: url('/images/main/prod5.jpg'); }
.main_prod__a ~ figcaption {border: 1px solid #ededed; background: #fff; display: flex; justify-content: space-between; align-items: flex-end; padding: 20px 0 0  20px;}
.main_prod__a ~ figcaption ul {font-size: 20rem; margin-bottom: 30px;}
.main_prod__title{ position: relative; padding-bottom: 10rem; font-size: 20rem; color: var(--primary); font-weight: 600; display: flex; gap: 10px; align-items: center;}
.main_prod__title::before {content: ''; display: block; width: 10px; height: 10px; border-radius: 50%; background: var(--primary);}
.main_prod__box{ display: flex; align-items: center; justify-content: center; width: 60rem; height: 60rem; background: #ededed; }
.main_prod__arrow{ height: 16rem; fill:none; stroke:var(--primary); stroke-linecap:round; stroke-linejoin:round; stroke-width:2px; transform: rotate( 90deg )}
.main_prod__swiper a:hover .main_prod__box {background: var(--primary); transition: .3s;}
.main_prod__swiper a:hover .main_prod__arrow {stroke: #ededed;  transition: .3s;}
@media(max-width:1700px){
	
	.main_prod__control {width: 100%; z-index: 9; }
	.main_prod ~ div {padding: 80rem 0 50rem;}
}
@media(max-width:1280px){
	.main_prod__swiper {width: 96%;}
	.main_prod__control {top: 35px;}
}
@media(max-width:767px){
	.common_btn {width: 40rem; height: 40rem;}

}
@media(min-width:768px){
	
	.main_prod__a{ padding-left: 62rem; }
}
@media(min-width:1280px){
	.main_prod .common_p{ margin: 0 0 0 19rem; }
}

/* brands */
.main_brands{padding: 110rem 0 160rem; background: #ecf5fb; }
.main_brands__txt{margin-right: 40rem; align-items: center;}
.main_brands__txt .cont_head {flex-direction: column; align-items: start; margin-right: 5%; justify-content: start;}
.main_brands__swiper{margin:0 auto; position:relative;}
.main_brands__swiper .a1 {background-image: url('/images/main/brands01.jpg');}
.main_brands__swiper .a2 {background-image: url('/images/main/brands02.jpg');}
.main_brands__swiper .a3 {background-image: url('/images/main/brands03.jpg');}
.main_brands__swiper .a4 {background-image: url('/images/main/brands04.jpg');}
.main_brands__swiper .a5 {background-image: url('/images/main/brands05.jpg');}
.main_brands__swiper .a6 {background-image: url('/images/main/brands06.jpg');}
.main_brands__swiper .a7 {background-image: url('/images/main/brands07.jpg');}
.main_brands__a{aspect-ratio: 90/58; width:55%; padding: 30rem; box-sizing: border-box;  border-radius: 40rem; background-repeat: no-repeat; background-size: cover;}
.main_brands__swiper a.swiper-slide {display:flex; flex-direction:row-reverse; justify-content:space-between; padding-top: 40rem;}
.main_brands__title {font-size: var(--fs40); color: var(--primary); font-family: 'poppins'; line-height: 1.2;}
.main_brands__title span {font-size: var(--fs32); display: block;    letter-spacing: -0.03em;}
.main_brands__swiper figcaption {padding:40rem 0; width:40%;}
.main_brands__swiper figcaption div {background: var(--primary); height: 1px; width: 100%; opacity: 0.6; margin: 10rem 0 20rem;}
.main_brands__swiper figcaption p {font-size: 24rem;}
.main_brands__btn{display:flex; align-items:center; justify-content:space-between; margin-top:40rem;}
.main_brands .common_a{ border-color: currentColor; margin-bottom:0;}
.main_brands .common_a::after {content: ''; display: block; height: 1px; width:54%; position: absolute; right:17%; background: #a5abaf;}
.main_brands__pager{display: inline-flex; gap: 10rem; width:30% !important;}
.main_brands__pager .swiper-pagination-bullet{ position: relative; display: flex; align-items: center; justify-content: center; width: 28rem; height: 28rem; background: 0;  box-sizing: border-box; color: #fff; opacity: .6; pointer-events: auto; }
.main_brands__pager .swiper-pagination-bullet-active{ border-color: currentColor; opacity: 1; border: 1px solid #2f96c1; border-style: dashed;}
.main_brands__pager .swiper-pagination-bullet-active::before {background: #2f96c1 !important;}
.main_brands__pager .swiper-pagination-bullet::before{ content: ''; display: inline-block; width: 12rem; height: 12rem; background: currentColor; border-radius: 50%; border: 1px solid #2f96c1;}
.main_brands__pager .swiper-pagination-bullet::after{ content: ''; position: absolute; inset: -5rem; }

@media(max-width:1280px){
	.main_brands__txt .cont_head {width: 100%; margin-right: auto;}
	.main_brands__txt {flex-direction: column; }
	.main_brands__txt {margin-right: 0;}
	.main_brands {padding: 100rem 0;}
    .main_brands__swiper figcaption{padding:20rem 0;}
    .main_brands .common_a::after{width:45%; right:19%;}
}
@media(max-width:767px){
	
	.main_brands__swiper {margin-top:30rem; width: 100%;}
	.main_brands__swiper figcaption {position: static; padding:0; width: 100%; box-sizing: border-box; margin-top:30rem;}
    .main_brands__swiper a.swiper-slide{display:block; padding-top:0;}
    .main_brands__a{width:100%; border-radius:30rem;}
    .main_brands__btn{margin-top:25rem;}
    .main_brands .common_a::after{display:none;}
    .main_brands__pager{width:70% !important;}
}



/* notice */
.main_notice__txt {display: flex; justify-content: space-between; align-items: end;}
.main_notice__txt div {display: flex; align-items: center;}
.main_notice .common_p{ margin: 20rem 0 0 40rem; }

.main_notice{ overflow: hidden; padding: 160rem 0; background:url(/images/main/notice_bg.jpg) no-repeat center/cover;}
.main_notice__more{ margin-left: 10rem; display: flex; align-items: center; justify-content: center; width: 50rem; height: 50rem; background: var(--primary); color: #fff; }
.main_notice__plus{ height: 18rem; fill:none; stroke:currentColor; stroke-linecap:round; stroke-linejoin:round; stroke-width:2px; }
.main_notice__swiper{ margin-top: 51rem; overflow: hidden;}
.main_notice__title{ margin-top: 24rem; font-size: 20rem; font-weight: 600;}
.main_notice__a p {font-size: 16rem; color: #333333; margin: 30rem 0 60rem;}
.main_notice__date{ margin-top: 8rem; font-weight: 600; color: #666; }
.main_notice__swiper ul li {position: relative; border: 1px solid #eeeeee; background: #fff; padding: 60rem 30rem 50rem; box-sizing: border-box; transition: .3s; height: 320rem;}
.main_notice__pager {display: flex; margin-top: 40rem;}
.main_notice__pager span {width: calc(100% / 2); border-radius: 0; height: 3px; }
.main_notice__pager .swiper-pagination-bullet-active {background: var(--primary);}
.notice_btn {width: 60rem; height: 54rem; display: flex; justify-content: center; align-items: center; background: #ededed; position: absolute; bottom: 0;right: 0;}
.main_notice__swiper ul li:hover {border: 5px solid #2f96c1; box-sizing: border-box; }
.main_notice__swiper ul li:hover .notice_btn {background: #2f96c1; transition: .3s;}
@media(max-width:768px){
	.main_notice__txt {flex-direction: column; gap: 10rem;}
	.main_notice__swiper {margin-top: 20rem;}
}
@media(min-width:768px){
	.main_notice__swiper{ margin-top: 22rem; }

}

/* 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; display: inline-block; font-size: 22rem;}
.main_cont .common_cat::before{ background: url(/images/common/cat_white.png) no-repeat; left: -30rem;}
.main_cont .common_p{ margin-top: 24rem; font-size: 32rem; color: inherit; line-height: 42rem;}
.main_cont .common_a{ margin-top: 38rem;  background: #24527a; display: inline-block; padding: 18rem 100rem;}