/* visual */
.area_visual{position:relative; width:100%; height: calc(100vh - 100px); background-size: cover; background-position:50%;}
/* visual */
.mainVis{ position: relative; color: #fff; }
.mainVis .swiper-slide{ position: relative; }
.mainVis .swiper-slide::before{ content: ''; position: absolute; inset: 0; background: var(--black) no-repeat 50% / cover; }
.mainVis .s1::before{ background-image: url('/images/main/vis1.jpg'); }
.mainVis .s2::before{ background-image: url('/images/main/vis2.jpg'); }
.mainVis .inr{ position: absolute; inset: 0; display: flex; align-items: center; gap: 60rem 0; box-sizing: border-box; z-index: 1;}
.mainVis__h2{position:relative; margin-top: 0.75em; font-size: var(--fs55); letter-spacing: .018em; font-weight: 400;}
.mainVis__h2 b {font-weight: 600; background: var(--primary); padding: 0 6rem;  }
.mainVis__h2 .main_Vis__h2__dot{display:inline-block; position:relative; width:30rem;}
.mainVis__h2 .main_Vis__h2__dot b{position:absolute; bottom:-12rem; left:8rem; background:none; color: var(--primary); font-size: 80rem; padding:0; line-height:1;}
.mainVis__h2 > br.show-mo{display:none;}
.main_Vis__control_wrap {display: flex;align-items: flex-end;height: 100%;}
.mainVis__contorl{ display: inline-flex; align-items: center; font-size: 15rem; font-weight: 600; }
.main_visual__btn {width: 110rem; height: 110rem; }
.main_visual__btn.prev {background: #000; margin-bottom: 55rem;}
.main_visual__btn.next {background-color: var(--primary); margin-top: 55rem;}
.mainVis__slash{ margin: 0 13rem 0 9rem; font-size: 10rem; }

@media (prefers-reduced-motion: no-preference){
	.mainVis .swiper-slide-active::before{ animation: slide_bg 3s both; }
	@keyframes slide_bg{
		0%{ transform: scale(1.05); }
		100%{ transform: scale(1); }
	}
	.mainVis__text > *{ animation: visual_txt .8s .3s both; }
	@keyframes visual_txt{
		0%{ transform: translateY(30rem); clip-path: inset(0 0 100%); }
		100%{ transform: translateY(0); clip-path: inset(0); }
	}
}
@media(min-width:768px){
	.mainVis{ aspect-ratio: 1920/938; }
	.mainVis .inr{ justify-content: space-between; }
}
@media(max-width:1279px){
}
@media(max-width:767px){
	.mainVis{ height: 100vh; min-height: 600rem;}
/*	.mainVis .inr{ flex-direction: column; justify-content: center; }*/
/*	.main_Vis__control_wrap {height: auto;}*/
    .mainVis__h2{font-size:40rem;}
    .mainVis__h2 > br.show-mo{display:block;}
    .main_Vis__control_wrap{position:absolute; bottom:0; right:0;}
    .main_visual__btn{width:80rem; height:80rem;}
}

/* common */
.common__p{display: inline-block; font-size: 18rem; font-weight: 700; color: #3579c9; position: relative;}
.common__p::before {content: ''; display: inline-block; width: 60rem; height: 1rem; background: #999; position: absolute; right: -75rem; top: 50%;     transform: translateY(-50%);}
.common__p::after {content: ''; display: inline-block; width: 9rem; height: 9rem; background: #3579c9; border-radius: 50%; position: absolute; right: -75rem; top: 50%;     transform: translateY(-50%);}
.common__h2{ margin: 20rem 0 30rem; text-transform: uppercase; font-size: var(--fs35); font-weight: 700; line-height: 1.29166667; letter-spacing: -.01em; }
.common__arrow.next{ transform: rotate(180deg); }


/* dialog modal */
body:has(#dialog[open]){ overflow: hidden; }
.dialogBtn.show{ display: contents; background: 0; font-size: inherit; }
#dialog{ position: fixed; inset: 0; margin: auto; display: block; width: min(600px, 92vw); padding: 0; background: #fff; border: 0; z-index: 151; }
#dialog:not([open]){ visibility: hidden; opacity: 0; }
#dialog::backdrop{ display: none; }
.dialogHead{ display: flex; align-items: center; justify-content: space-between; height: 3.4375em; padding: .9375em; background: #686e82; box-sizing: border-box; color: #fff; }
.dialogBtn.close{ position: relative; width: 1.1875em; height: 1.1875em; background: url('/images/module/btn_close.png') no-repeat 50% / contain; font-size: inherit; }
.dialogBtn.close::before{ content: ''; position: absolute; inset: -5px; }
.dialogBody,
.dialogIframe{ overflow: auto; display: block; width: 100%; height: min(590px, calc(85vh - 3.4375em)); padding: .9375em; background: #fff; box-sizing: border-box; border: 0; }
.dialogBackdrop{ position: fixed; inset: 0; background: #000; opacity: .8; z-index: -1; }
@media(prefers-reduced-motion:no-preference){
	#dialog{ transition: opacity .4s, visibility .4s; }
	.dialogBackdrop{ transition: .4s; }
}

.mainAbout {margin: 150rem 0;}
.mainAbout_cont {display: flex; justify-content: space-between; margin-bottom: 60rem;}
.mainAbout__head {width: 60%;}
.mainAbout__head p {font-size: 18rem; color: #777777;}
.mainAbout__head .common__p {color: var(--primary);}
.mainAbout__head .common__p::after {background: var(--primary);}
.mainAbout .common__h2 {margin: 25rem 0 45rem; font-size: var(--fs50); line-height: 1.0;}
.mainAbout__btns {display: flex;max-width: 200rem; width: 100%; align-items: flex-end;}
.mainAbout__more {border-bottom: 2px solid #dddddd; display: flex; justify-content: space-between; height: 36rem; width: 100%;  transition: .3s;}
.mainAbout__more span:first-child { color: #aaa; font-size: 20rem; font-family: 'montserrat'; font-weight: 600;transition: .3s;}
.mainAbout__more span:last-child {margin-top: 2rem; opacity: .3;transition: .3s;}
.mainAbout__more:hover { border-bottom: 2px solid #000;}
.mainAbout__more:hover span:first-child {color: #000;}
.mainAbout__more:hover span:last-child {opacity: 1;}
.mainAbout_bg {width: calc(700rem + 50%); margin-left: auto;}
.mainAbout_bg img {width: 100%;}

@media(max-width:1280px){
	.mainAbout_bg {width:96%;}
}

@media(max-width:767px){
    .mainAbout{margin:100rem 0;}
	.mainAbout_cont {flex-direction: column;gap: 40rem;}
	.mainAbout__head {width: 100%; }
	.mainAbout_bg img {aspect-ratio: 10/5;}
}

.mainCont_wrap .inr {display: flex; justify-content: space-between; margin-bottom: 310rem;  gap: 80rem;}
.mainBiz,
.mainPrd { width: 50%;}
.mainBiz_img img,
.mainPrd_img img {width: 100%;}
.mainBiz__title,
.mainPrd__title {display: flex; margin-right: -20rem; margin-bottom: 36rem;}
.mainBiz__head,
.mainPrd__head {width: calc(100% - 60rem);}
.mainBiz__btns,
.mainPrd__btns {width: 60rem; height: 60rem; background: #fff; border: 1px solid #000; box-sizing: border-box; opacity: .3; margin-right: 20rem; transition: .3s; }
.mainBiz__btns:hover,
.mainPrd__btns:hover {opacity: 1; box-shadow: 5px 12px 12px rgba(0, 0, 0, 0.1);}
.mainBiz__more,
.mainPrd__more{width:100%; height:100%;  display: flex; align-items: center; justify-content: center;}
.mainPrd__head > .common__p{color:#457038;}
.mainPrd__head > .common__p::after{background:#457038;}
.common__txt {color:#777; font-size:18rem;}

@media(max-width:1420px){
	.mainBiz,
	.mainPrd {width: 50%;}
	.mainBiz_img img,
	.mainPrd_img img {width: 100%;}
	.mainBiz_img img,
	.mainPrd_img img {width: 100%;}
	.mainCont_wrap .inr {gap: 20rem;}
}

@media(max-width:1280px){
	.common__txt {height: 80rem;}
}
@media(max-width:767px){
	.mainCont_wrap .inr {flex-direction: column; gap: 80rem; margin-bottom:210rem;}
	.mainBiz, .mainPrd {width: 100%;}
    .common__txt {height:auto;}
}



.mainCont_bottom {background: url(/images/main/main_bg.jpg) no-repeat center/cover;}
.mainCont_bottom .common__h2 {color: #fff;}
.mainCont_bottom p {color: #bbbbbb; font-size:18rem;}

.mainBoard {display: flex; justify-content: space-between; }
.mainBoard_obj{display:block; position:absolute; left:0; top:-37%; width:400rem; z-index:-1;}
.mainBoard__cont {position:relative; width: calc(100% * (6/14)); display: flex; flex-direction: column; justify-content: space-between; padding-top: 100rem;}
.youtube {margin-top: -160rem;}
.mainBoard__head .common__p {color: var(--primary);}
.mainBoard__head .common__p::after {background: var(--primary);}
.mainBoard__btns {display: flex;max-width: 200rem; width: 100%; align-items: flex-end; margin:50rem 0 0 auto;}
.mainBoard__more {margin-top:0;}
.mainBoard__more {border-bottom: 2px solid #dddddd; display: flex; justify-content: space-between; height: 36rem; width: 100%; transition: .3s;}
.mainBoard__more span:first-child { color: #aaa; font-size: 20rem; font-family: 'montserrat'; font-weight: 600;transition: .3s;}
.mainBoard__more span:last-child {margin-top: 2rem; opacity: .6;transition: .3s;}
.mainBoard__more:hover { border-bottom: 2px solid #fff;}
.mainBoard__more:hover span:first-child {color: #fff;}
.mainBoard__more:hover span:last-child {opacity: 1;}
.mainBoard__cont {max-width: 600rem; margin-right: 80rem;}
.mainBoard__img {margin-top:-130rem; width: calc(100% * (8/14));}
.mainBoard__img img {display:block; width: 100%; height:100%; object-fit:cover;}
@media(max-width:1280px){
    .mainBoard_obj{top:-31%; width:310rem;}
    .mainBoard__img {margin-top:-100rem;}
}
@media(max-width:767px){
	.mainBoard {flex-direction: column;}
    .mainBoard_obj{top:-17%; left:50%; transform:translateX(-50%); width:70%;}
    .mainBoard__btns{margin-top:30rem;}
	.mainBoard__img {margin-top: 40rem; width: 100%;}
	.mainBoard__cont {width: 100%;}
}

.map {width: 55%; height: 500rem; background: #ededed; position: absolute;}
.mainContact {padding: 150rem 0;}
.mainContact .inr {height: 500rem;}
.mainContact__head .common__p {color: #3579c9;}
.mainContact__head .common__p::after {background: #3579c9;}
.mainContact__cont {width: calc(100% * (6/14)); padding-left: 64rem; box-sizing: border-box; margin-left: auto; }


.tabs{ display: flex; flex-wrap: wrap; gap: 10rem;}
.tab_link{ cursor: pointer; width: 160rem; height: 50rem; display: flex; align-items: center; justify-content: center; background: #565151; color: #b6b6b6;}
.tab_link.current{ background: #000; color: #fff;}
.tabs span{ white-space: nowrap }
.map .tab_content {margin-top: 0; height: 500rem;}
.map .tab_content iframe {height: 100%;}
.tab_content{ display: none; margin-top: 30rem; }
.tab_content.current{ display: block }
.tab_content li {padding: 30rem 0; font-size: 18rem; color: #bbbbbb; border-bottom: 1px dashed #707070;}
.tab_content li b {color: #fff;}
.tab_content li b:nth-of-type(2) {margin-left: 26rem;}

@media(max-width:1280px){
	.tab_content li b:nth-of-type(2) {margin-left: 0rem;}

}

@media(max-width:767px){
	.mainContact {display: flex; flex-direction: column-reverse; padding-top:100rem;}
	.mainContact__cont {width: 100%; padding-left: 0;}
	.map {position: static; width: 100%;}
}