/* common */
#sv .subVisual{ position: relative; height: 450px; display:flex; justify-content:center; align-items: center; text-align: center; color:#fff; }
#sv .subVisual:before{ content:''; display:block; position: absolute; top: 0; left: 0; background: rgba(0,0,0,0.4); width: 100%; height: 100%; transition:all 1s 0.3s; z-index: 1;}
#sv .subVisual .bg{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1;}
#sv .subVisual .txt-box{ position: relative; z-index: 2; text-align: center; }
#sv .subVisual .txt-box ul{ display:flex; align-items:center; justify-content:center; margin-bottom: 20px;  font-weight: 500; letter-spacing: -0.34px; }
#sv .subVisual .txt-box ul li{ display:flex; align-items:center; }
#sv .subVisual .txt-box ul li span.dot{ margin: 0 20px;}
#sv .subVisual .txt-box .title{ letter-spacing: -1.66px; }

#subContents{ padding: 150px 0 200px;}
#subContents .tab-wrap{ text-align: center; padding: 0 20px; margin-bottom: 120px;}
#subContents .tab-wrap .depth2{ display:inline-flex; justify-content:center; align-items:center; background: #F8F8F8; padding: 20px; border-radius:50px; }
#subContents .tab-wrap .depth2 li a{ display:block; padding: 0 40px; height: 55px; line-height: 55px; color:#ccc; border-radius:50px;  font-weight: 500; letter-spacing: -0.4px; transition:all 0.3s; 
text-transform: uppercase; }
#subContents .tab-wrap .depth2 li.on a{ background: var(--mainC); color:#fff;  }
#subContents .tab-wrap .depth2 li:not(.on):hover a{ color:var(--mainC); }

#subContents .tab-wrap2{ margin-top: 60px; }
#subContents .tab-wrap2 .depth3{ display:flex; justify-content:center; align-items:center; }
#subContents .tab-wrap2 .depth3 li{ display:flex; align-items:center; }
#subContents .tab-wrap2 .depth3 li a{ color: #CCC; font-size: 18px; font-weight: 500; letter-spacing: -0.36px;  transition:all 0.3s;  }
#subContents .tab-wrap2 .depth3 li:not(:last-child):after{ content:''; display: block; width: 1px; height: 15px; background: #e5e5e5; margin: 0 30px; }
#subContents .tab-wrap2 .depth3 li.on a{ color:var(--mainC); }
#subContents .tab-wrap2 .depth3 li:hover a{ color:#aaa; }

h3.title{ color:#111; text-align: center; letter-spacing: -1.08px; font-weight: 500; margin-bottom: 80px; }

#aboutus section:not(:last-of-type){ margin-bottom: 180px; }
#aboutus .outline .content{ position: relative; overflow: hidden;}
#aboutus .outline .content .txt-box{ position: absolute; top: 0; left: -100%; padding: 60px; width: 480px; background: rgba(0, 0, 0, 0.60); height: 100%; color:#fff; display:flex; align-items:flex-end;
transition:all 1.2s; }
#aboutus .outline .content .txt-box ul li:not(:last-child){ margin-bottom: 20px; }
#aboutus .outline .content.aos-animate .txt-box{ left: 0; }
#aboutus .history .content{ display:flex; flex-wrap:wrap; gap:80px; }
#aboutus .history .content .item-box{ width: calc((100% - 160px) / 3); min-height:260px; padding: 60px;  border-radius: 20px; border: 2px solid rgba(255, 255, 255, 0.50); background: linear-gradient(135deg, #EAEAEA 0%, rgba(255, 255, 255, 0.00) 100%); box-shadow: 30px 30px 45px 0px rgba(160, 160, 160, 0.10); color:#111; font-weight: 300; letter-spacing: -0.56px; }
#aboutus .history .content .item-box .day{ display:flex; align-items:center; color:var(--mainC); letter-spacing: -0.42px; font-weight: 600; margin-bottom: 40px; }
#aboutus .history .content .item-box .day img{ margin-right: 15px; }
#aboutus .history .content .slide-arrow{ display:flex; justify-content:center; align-items:center; margin-top: 80px; }
#aboutus .history .content .slide-arrow button{ display:flex; justify-content:center; align-items:center; }
#aboutus .history .content .slide-arrow span{ display:block; width: 2px; height: 14px; background: #000; margin: 0 20px;}
:root {
	--inno : 455px; 
}
#aboutus .innovation .content{ position: relative; }
#aboutus .innovation .content .bar{ position: absolute; top: 0; left: var(--inno); width: 5px; height: 100%; border-radius:5px; background: #F8F8F8; }
#aboutus .innovation .content .bar span{ display: block; width: 5px; border-radius:5px; background: var(--mainC); position: absolute; left: 0; top: 0; height: 100%; }
#aboutus .innovation .content .item-box{ position: relative; display:flex; }
#aboutus .innovation .content .item-box:not(:last-child){ margin-bottom: 180px; }
#aboutus .innovation .content .item-box .date{ min-width:var(--inno); color:#111; letter-spacing: -1.08px; flex-shrink:0; }
#aboutus .innovation .content .item-box .item{ position: relative; padding-top: 20px; padding-left: 80px; }
#aboutus .innovation .content .item-box .item:before{ content:''; display:block; width: 5px; height: 5px; border-radius:50%; border:5px solid var(--mainC);  background: #fff; position: absolute; top: 28px; left: -5px; transition:all 0.5s; }
#aboutus .innovation .content .item-box .item .txt{ color:#333; font-weight: 300; letter-spacing: -0.46px; margin-bottom: 60px; }
#aboutus .innovation .content .item-box .item .flex-box figure:not(:last-child){ margin-right: 20px; }

.products .content{ display:flex; flex-wrap:wrap; gap:120px; } 
.products .content .item-box{ width: calc((100% - 120px) / 2); }
.products .content .item-box .img-box{ border-radius: 20px; border: 2px solid rgba(255, 255, 255, 0.50); background: linear-gradient(135deg, #EAEAEA 0%, rgba(255, 255, 255, 0.00) 100%); box-shadow: 30px 30px 45px 0px rgba(160, 160, 160, 0.10); padding: 80px 20px; text-align: center; display:flex; justify-content:center; align-items:center; }
.products .content .item-box .img-box figure:first-child{ margin-right: 80px; }
.products .content .item-box p{ text-align: center; margin-top: 40px; color:#111; letter-spacing: -0.64px; }
.products .content .item-box p span{ display:block; color:var(--mainC); font-weight: 500; letter-spacing: -0.38px; margin-bottom: 10px;}

#auto .content{ gap:120px 50px; }
#auto .content .item-box{ width: calc((100% - 100px) / 3); }
#auto .content .item-box .img-box{ padding: 70px 20px; }

#contact{ position: relative; }
#contact .txt-box{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding-top: 150px; z-index: 3; }
#contact .txt-box .title{ color: #111; font-weight: 500; letter-spacing: -1.08px; margin-bottom: 80px; } 
#contact .txt-box .info-box{ max-width: 720px; padding: 60px; border-radius: 20px; border: 2px solid rgba(255, 255, 255, 0.50); background: linear-gradient(135deg, #EAEAEA 0%, rgba(255, 255, 255, 0.00) 100%); box-shadow: 30px 30px 45px 0px rgba(160, 160, 160, 0.10); }
#contact .txt-box .info-box dl{ display:flex; align-items:flex-start; }
#contact .txt-box .info-box dl:not(:last-child){ margin-bottom: 30px; }
#contact .txt-box .info-box dl dt{ display:flex; align-items:center; color:#111; font-weight: 500; letter-spacing: -0.42px; min-width:140px; line-height: 1.5; }
#contact .txt-box .info-box dl dt img{ margin-right: 15px; }
#contact .txt-box .info-box dl dd{ letter-spacing: -0.42px; line-height: 1.5; font-weight: 200; color:#333; }
#contact .bg{ width: 100%; height: 100%; min-height:937px; }
#contact .bg svg{ height: 100%; }
#contact .bg svg .smallC{ animation: circle01 3s 0.3s forwards infinite; }
#contact .bg svg .bigC{ animation: circle02 3s forwards infinite; }


@keyframes circle01{
	0%{ r: 5; opacity: 0; }
	50%{ r:250; opacity: 0.05; }
	100%{ r:250; opacity: 0; }
}

@keyframes circle02{
	0%{ r: 5; opacity: 0.05; }
	100%{ r:500; opacity: 0;}
}