@charset "utf-8";

.section { margin-top:260px; }
.section.main1 { margin-top:0; }
@media screen and (max-width:1440px){
	.section:not(.innovation-box) { overflow:hidden }
	.section { margin-top:200px; }
}
@media screen and (max-width:1280px){
	.section { margin-top:160px; }
}
@media screen and (max-width:1024px){
	.section { margin-top:120px; }
}
@media screen and (max-width:640px){
	.section { margin-top:80px; }
}

#visual { opacity:0; position:relative; width:100%; height:100vh; overflow:hidden;}
.subOn #visual { opacity:1; }
#visual .swiper-container { position:relative; width:100%; height:100vh; overflow:hidden; }
#visual .swiper-container .swiper-slide { position:relative; width:100%; height:100%; overflow:hidden; display:flex; }
#visual .swiper-container .swiper-slide .bg { z-index:2; position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0, 0, 0, 0.1); }
#visual .swiper-container .swiper-slide .mov { position:absolute; left:0; top:0; width:100%; height:100%; overflow:hidden; }
#visual .swiper-container .swiper-slide .ImgBg { width:100%; height:100%; background-repeat:no-repeat; background-position:center center; background-size:cover !important; }
#visual .swiper-container .swiper-slide .mov video { position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; -o-object-fit:cover; }
#visual .swiper-container .swiper-slide.swiper-slide-active { opacity:1; z-index:2 }
#visual .txtbox { color:#fff; position:absolute; top:45%; left:0; width:100%; z-index:15; }
#visual .txtbox .aniBox { display:flex; align-items:center; justify-content:space-between; gap:0 15px; }
#visual .txtbox .txt { font-size:9.0rem; font-weight:700; color:#fff; line-height:1.3; letter-spacing:-0.06em; text-wrap:nowrap; }
#visual .txtbox .txt span { font-size:10.0rem; }
#visual .txtbox .txt-1,
#visual .txtbox .txt-2 { position:relative; }
#visual .txtbox .line { position:relative; height:70px; margin-left:0; }
#visual .txtbox .line { width:0; }
#visual .txtbox .line span { position:absolute; background:#fff; }
#visual .txtbox .line span.p1 { width:100%; height:8px; top:50%; left:50%; transform:translateX(-50%); margin-top:-4px; background:#fff; }
#visual .txtbox .line span.p2 { width:8px; height:0; left:50%; top:50%; transform:translateY(-50%); margin-left:-4px; background:#fff; }
#visual .txtCont { position:absolute; top:50%; left:0; width:100%; text-align:right; margin-top:120px; color:#fff; font-size:2.2rem; font-weight:400; line-height:1.63; }
#visual .txtCont * { font-family:var(--subFont); }
#visual .txtCont > div { opacity:0; }

#visual .txtCont_n {  position:absolute; top:50%; left:0; width:100%; transform:translateY(-50%); }
#visual .txtCont_n * { font-family:var(--subFont); }
#visual .txtCont_n .txt-1 { position:relative; overflow:hidden; }
#visual .txtCont_n .txt-1 span { opacity:0; color:#fff; font-size:8.0rem; font-weight:700; line-height:1.3; display:block; letter-spacing:-0.04em; }
#visual .txtCont_n .txt-2 { position:relative; margin-top:30px; overflow:hidden; }
#visual .txtCont_n .txt-2 span { opacity:0; color:#fff; font-size:2.6rem; font-weight:500; line-height:1.6; display:block; letter-spacing:-0.03em; }

#visual .swiper-slide.swiper-slide-active .txtCont_n .txt-1 span { animation:ani_3 0.8s 0.3s; animation-fill-mode:both; }
#visual .swiper-slide.swiper-slide-active .txtCont_n .txt-2 span { animation:ani_3 1.0s 0.5s; animation-fill-mode:both; }

#visual .swiper-container .swiper-slide.swiper-slide-active .txtCont > div { animation:ani_3 1.5s 0.3s; animation-fill-mode:both; }
#visual .swiper-pagination { position:absolute; left:unset; right:50px; bottom:40px; width:auto; display:flex; gap:10px; }
#visual .swiper-pagination span { outline:none; margin:0 !important; color:#fff; font-size:1.4rem; font-weight:700; line-height:1.3; display:flex; align-items:center; justify-content:center; width:30px; height:30px; background:#aaa; border-radius:10px; opacity:1; }
#visual .swiper-pagination span.swiper-pagination-bullet-active { background:var(--mainColor); }

#visual .scrolldown { position:absolute; left:50%; bottom:30px; transform:translateX(-50%); z-index:30; text-align:center }
#visual .scrolldown .line { position:relative; width:30px; height:50px; display:block; margin:0 auto; border-radius:22px; border:2px solid #fff; }
#visual .scrolldown .line:before { content:""; display:block; width:2px; height:10px; border-radius:2px; background:#fff; position:absolute; top:8px; left:50%; transform:translateX(-50%); animation:scrollDown 2s infinite; }
.swiper-button-next, 
.swiper-button-prev,
.swiper-button-next:after, 
.swiper-button-prev:after { display:none; }

/* animation */
.subOn #visual .txtbox .line { margin-left:10px; }
#visual .txtbox .line { animation:lineWidth 1.5s 0.1s; animation-fill-mode:both; }
#visual .txtbox .aniBox .box:last-child { animation:rightBox 1.5s 0.1s; animation-fill-mode:both; }
#visual .txtbox .line span.p1 { animation:ani_w70 1.5s 1.6s; animation-fill-mode:both; }
#visual .txtbox .line span.p2 { animation:ani_h 1.3s 1.9s; animation-fill-mode:both; }
@keyframes scrollDown {
    0% { top:8px; }
    50% { top:calc(100% - 16px); }
    100% { top:8px; }
}
@keyframes ani_w70 {
    0% { width:100%; }
    100% { width:70px; }
}

@media screen and (max-width:1800px){
	#visual .txtbox .txt { font-size:8.0rem; }
	#visual .txtbox .txt span { font-size:9.0rem; }
	#visual .txtCont_n .txt-1 span { font-size:7.5rem; }
	#visual .txtCont_n .txt-2 span { font-size:2.4rem; }
}
@media screen and (max-width:1600px){
	#visual .txtbox .txt { font-size:7.0rem; }
	#visual .txtbox .txt span { font-size:8.0rem; }
	#visual .txtCont_n .txt-1 span { font-size:7.0rem; }
	#visual .txtCont_n .txt-2 span { font-size:2.2rem; }
}
@media screen and (max-width:1440px){
	#visual .txtbox .txt { font-size:6.0rem; }
	#visual .txtbox .txt span { font-size:7.0rem; }
	#visual .txtCont { margin-top:80px; font-size:2.1rem; }
	#visual .txtCont_n .txt-1 span { font-size:5.6rem; }
	#visual .txtCont_n .txt-2 span { font-size:2.0rem; }
	#visual .txtbox .line { height:60px; }
	#visual .txtbox .line span.p1 { height:6px; margin-top:-3px; }
	#visual .txtbox .line span.p2 { width:6px; margin-left:-3px; }
	#visual .swiper-pagination { right:20px; }

	@keyframes ani_w70 {
		0% { width:100%; }
		100% { width:60px; }
	}
}
@media screen and (max-width:1280px){
	#visual .txtbox .txt { font-size:5.0rem; }
	#visual .txtbox .txt span { font-size:6.0rem; }
	#visual .txtCont { margin-top:50px; font-size:2.0rem; }
	#visual .txtCont_n .txt-1 span { font-size:5.0rem; }
	#visual .txtCont_n .txt-2 { margin-top:15px; }
	#visual .txtCont_n .txt-2 span { font-size:1.9rem; }
	#visual .txtbox .line { height:50px; }
	#visual .txtbox .line span.p1 { height:4px; margin-top:-2px; }
	#visual .txtbox .line span.p2 { width:4px; margin-left:-2px; }

	@keyframes ani_w70 {
		0% { width:100%; }
		100% { width:50px; }
	}
}
@media screen and (max-width:860px){
	#visual .txtbox .txt { font-size:4.5rem; }
	#visual .txtbox .txt span { font-size:5.5rem; }
	#visual .txtCont { margin-top:50px; font-size:2.0rem; }
	#visual .txtCont_n .txt-1 span { font-size:3.8rem; }
	#visual .txtCont_n .txt-2 span { font-size:1.8rem; }
	#visual .txtbox .line { height:34px; }
	#visual .scrolldown .line { width:26px; height:44px; }
	#visual .scrolldown .line:before { width:2px; height:8px; }
	#visual .swiper-pagination { gap:8px; }
	#visual .swiper-pagination span { width:26px; height:26px; border-radius:5px; }

	@keyframes ani_w70 {
		0% { width:100%; }
		100% { width:34px; }
	}
}
@media screen and (max-width:760px){
	#visual .txtbox { top:30%; }
	#visual .txtbox .txt { font-size:3.8rem; }
	#visual .txtbox .txt span { font-size:4.8rem; }
	#visual .txtbox .line { height:30px; }
	#visual .txtbox .aniBox { justify-content:center; gap:15px; flex-direction:column; }
	#visual .txtCont_n .txt-1 span { font-size:3.0rem; }
	#visual .txtCont_n .txt-2 { margin-top:10px; }
	#visual .txtCont_n .txt-2 span { font-size:1.7rem; }
	#visual .txtCont_n .txt-2 span br { display:none }
	#visual .aniBox .box {  opacity:0; }
	.subOn #visual .aniBox .box:first-child { animation:ani_1 0.8s 0.5s; animation-fill-mode:both; }
	.subOn #visual .aniBox .box:last-child { animation:ani_2 0.8s 0.5s !important; animation-fill-mode:both !important; }
	#visual .txtCont { text-align:center; }

	@keyframes ani_w70 {
		0% { width:100%; }
		100% { width:30px; }
	}
}
@media screen and (max-width:640px){
	#visual .txtCont { font-size:1.9rem; }
}

.title-box { overflow:hidden; }
.title-box .aniBox { display:flex; align-items:center; justify-content:space-between; gap:0 30px; }
.title-box h3 { font-family:var(--subFont); color:#000; font-size:7.0rem; font-weight:700; line-height:1.3; letter-spacing:-0.05em; text-wrap:nowrap; }
.title-box .stxt { color:var(--mainColor); font-size:10.0rem; font-weight:700; line-height:1.3; text-wrap:nowrap; }
.title-box .line { width:0; height:5px; background:#000; transform-origin:left; left:0; }
.title-box .txtbox { margin-top:40px; font-family:var(--subFont); color:#333; font-size:2.2rem; font-weight:300; line-height:1.54; }
@media screen and (max-width:1800px){
	.title-box h3 { font-size:7.0rem; }
	.title-box .stxt { font-size:8.0rem; }
}
@media screen and (max-width:1600px){
	.title-box h3 { font-size:6.0rem; }
	.title-box .stxt { font-size:7.0rem; }
}
@media screen and (max-width:1440px){
	.title-box h3 { font-size:5.0rem; }
	.title-box .stxt { font-size:6.0rem; }
	.title-box .line { height:4px; }
	.title-box .txtbox { margin-top:30px; font-size:2.1rem; }
}
@media screen and (max-width:1280px){
	.title-box h3 { font-size:4.0rem; }
	.title-box .stxt { font-size:5.0rem; }
	.title-box .line { height:3px; }
}
@media screen and (max-width:1024px){
	.title-box h3 { font-size:3.5rem; }
	.title-box .stxt { font-size:4.5rem; }
	.title-box .line { height:3px; }
	.title-box .txtbox { margin-top:20px; font-size:2.0rem; }
	.title-box .txtbox br { display:none }
	.title-box .txtbox span.m_br { display:block }
}
@media screen and (max-width:760px){
	.title-box h3 { font-size:3.0rem; }
	.title-box .stxt { font-size:4.0rem; }
}
@media screen and (max-width:640px){
	.title-box .aniBox { flex-direction:column; }
	.title-box .line { display:none }
}

/* animation */
.title-box .aniBox { opacity:0; }
.subOn .title-box .aniBox { animation:ani_3 0.8s 0.3s; animation-fill-mode:both; }
.subOn .title-box .line { animation:lineWidth 1.4s 0.6s; animation-fill-mode:both; }
.subOn .title-box .aniBox .box:last-child { animation:rightBox 1.4s 0.6s; animation-fill-mode:both; }
.title-box .txtbox { opacity:0; }
.subOn .title-box .txtbox { animation:ani_3 0.8s 0.6s; animation-fill-mode:both; }
@media screen and (max-width:640px){
	.title-box .aniBox .box:last-child { animation:none !important; }
}

.plus-box .btnMore { margin-top:100px; }
.plus-box .listbox { position:relative; margin-top:100px; }
.plus-box .swiper-container { overflow:hidden; }
.plus-box .swiper-container .swiper-wrapper { margin-left:calc(39.2% + 50px); display:flex; justify-content:center; }
.plus-box .swiper-container .swiper-slide { position:relative; overflow:hidden; width:300px; height:500px; transition:all 1.0s; display:flex; align-items:center; }
.plus-box .swiper-container .swiper-slide a { position:relative; display:block; width:100%; height:300px; }
.plus-box .swiper-container .swiper-slide figure { position:relative; z-index:3; overflow:hidden; border-radius:30px; width:100%; height:100%; }
.plus-box .swiper-container .swiper-slide figure:before { content:""; display:block; padding-bottom:64.4%; }
.plus-box .swiper-container .swiper-slide figure img { transition:all 1.5s; position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; -o-object-fit:cover; }
.plus-box .swiper-container .swiper-slide .txtbox { transition:all 1.5s 0.1s; opacity:0; position:absolute; left:0; bottom:-100px; width:100%; padding:0 0 60px 60px; z-index:3; }
.plus-box .swiper-container .swiper-slide .txtbox h4 { color:rgba(255,255,255,0.5); font-size:2.4rem; font-weight:700; line-height:1.3; }
.plus-box .swiper-container .swiper-slide .txtbox p { margin-top:10px; color:rgba(255,255,255,1); font-size:4.0rem; font-weight:700; line-height:1.3; letter-spacing:-0.03em; }
.plus-box .swiper-container .swiper-slide-active .txtbox { bottom:0; opacity:1; }
.plus-box .swiper-container .swiper-slide-prev,
.plus-box .swiper-container .swiper-slide-next { width:300px; }
.plus-box .swiper-container .swiper-slide-active { width:900px !important; }
.plus-box .swiper-container .swiper-slide-prev a,
.plus-box .swiper-container .swiper-slide-next a { height:400px; }
.plus-box .swiper-container .swiper-slide-active a { height:500px; }
.plus-box .swiper-container .swiper-slide-next .txtbox,
.plus-box .swiper-container .swiper-slide-prev .txtbox { padding-left:20px; }
.plus-box .swiper-container .swiper-slide-next .txtbox h4,
.plus-box .swiper-container .swiper-slide-prev .txtbox h4 { font-size:120%; }
.plus-box .swiper-container .swiper-slide-next .txtbox p,
.plus-box .swiper-container .swiper-slide-prev .txtbox p { font-size:170%; }
.plus-box .swiper-pagination { display:none }
@media screen and (max-width:1440px){
	.plus-box .swiper-container .swiper-wrapper { margin-left:calc(50% + 20px); }
	.plus-box .swiper-container .swiper-slide .txtbox { padding:0 0 40px 40px; }
	.plus-box .swiper-container .swiper-slide .txtbox h4 { font-size:2.3rem; }
	.plus-box .swiper-container .swiper-slide .txtbox p { font-size:3.8rem; }
}
@media screen and (max-width:1280px){
	.plus-box .swiper-container .swiper-slide .txtbox { padding:0 0 30px 30px; }
	.plus-box .swiper-container .swiper-slide .txtbox h4 { font-size:2.1rem; }
	.plus-box .swiper-container .swiper-slide .txtbox p { margin-top:5px; font-size:3.4rem;}
}
@media screen and (max-width:1024px){
	.plus-box .btnMore { margin-top:80px; }
	.plus-box .listbox { margin-top:70px; }
	.plus-box .swiper-container .swiper-wrapper { margin-left:calc(50% + 10px); }
	.plus-box .swiper-container .swiper-slide .txtbox { padding:0 0 20px 20px; }
	.plus-box .swiper-container .swiper-slide { width:200px; height:400px; }
	.plus-box .swiper-container .swiper-slide a { height:250px; }
	.plus-box .swiper-container .swiper-slide figure { border-radius:15px; }
	.plus-box .swiper-container .swiper-slide-prev,
	.plus-box .swiper-container .swiper-slide-next { width:200px; }
	.plus-box .swiper-container .swiper-slide-active { width:550px !important; }
	.plus-box .swiper-container .swiper-slide-prev a,
	.plus-box .swiper-container .swiper-slide-next a { height:300px; }
	.plus-box .swiper-container .swiper-slide-active a { height:400px; }
	.plus-box .swiper-container .swiper-slide-next .txtbox h4,
	.plus-box .swiper-container .swiper-slide-prev .txtbox h4 { font-size:70%; }
	.plus-box .swiper-container .swiper-slide-next .txtbox p,
	.plus-box .swiper-container .swiper-slide-prev .txtbox p { font-size:110%; }
}
@media screen and (max-width:640px){
	.plus-box .btnMore { margin-top:50px; }
	.plus-box .listbox { margin-top:40px; }
	.plus-box .swiper-container .swiper-slide { width:200px; height:300px; }
	.plus-box .swiper-container .swiper-slide a { height:180px; }
	.plus-box .swiper-container .swiper-slide figure { border-radius:15px; }
	.plus-box .swiper-container .swiper-slide-prev,
	.plus-box .swiper-container .swiper-slide-next { width:200px; }
	.plus-box .swiper-container .swiper-slide-active { width:340px !important; }
	.plus-box .swiper-container .swiper-slide-prev a,
	.plus-box .swiper-container .swiper-slide-next a { height:220px; }
	.plus-box .swiper-container .swiper-slide-active a { height:300px; }
	.plus-box .swiper-container .swiper-slide .txtbox { padding:0 0 20px 20px; }
	.plus-box .swiper-container .swiper-slide .txtbox h4 { font-size:2.0rem; }
	.plus-box .swiper-container .swiper-slide .txtbox p { font-size:2.9rem;}
	.plus-box .swiper-container .swiper-slide-next .txtbox h4,
	.plus-box .swiper-container .swiper-slide-prev .txtbox h4 { font-size:50%; }
	.plus-box .swiper-container .swiper-slide-next .txtbox p,
	.plus-box .swiper-container .swiper-slide-prev .txtbox p { font-size:90%; }
}

/* animation */
.plus-box .listbox { opacity:0; }
.plus-box.subOn .listbox { animation:ani_3 1.0s 0.3s; animation-fill-mode:both; }


/* PnT */
.pnt-box .btnMore { margin-top:100px; }
.pnt-box .listbox { position:relative; display:flex; flex-wrap:wrap; justify-content:center; gap:20px; margin-top:100px; }
.pnt-box .listbox .box { width:calc((100% - 40px) / 3); }
.pnt-box .listbox .box .imgbox { transition:all 0.5s; position:relative; border-radius:30px 30px 0px 0px; overflow:hidden; }
.pnt-box .listbox .box .imgbox .num-box { position:absolute; top:50%; left:0; width:100%; transform:translateY(-50%); display:flex; justify-content:center; gap:0 20px; align-items:center; }
.pnt-box .listbox .box .imgbox .num-box > div { color:#fff; font-size:9.0rem; font-weight:700; line-height:1; min-width:50px; display:flex; align-items:center; text-align:center; }
.pnt-box .listbox .box .imgbox .num-box > div span { font-weight:700; line-height:1; }
.pnt-box .listbox .box .counter { display:inline-block; overflow:hidden; position:relative; }
.pnt-box .listbox .box .counter em { color:transparent; opacity:0; }
.pnt-box .listbox .box .counter .comma { color:#fff; }
.pnt-box .listbox .box .txtbox { transition:all 0.5s; height:150px; background:#3e3a39; display:flex; align-items:center; justify-content:center; text-align:center; border-radius:0 0 30px 30px; }
.pnt-box .listbox .box .txtbox .txt { color:#fff; font-size:2.2rem; font-weight:500; line-height:1.63; letter-spacing:-0.04em; }
.pnt-box .listbox.active .box:hover .txtbox { border-radius:60px; background:var(--mainColor); } 
.pnt-box .listbox.active .box:hover .imgbox { border-radius:60px; }

.pnt-box .listbox .box .counter .num { display:flex; position:absolute; top:0; left:0; }
.pnt-box .listbox .box .counter .num div { display:flex; flex-direction:column; position:relative; }
.pnt-box .listbox .box .counter .num div:nth-of-type(odd){ top:calc(9.0rem + 0.1rem); transform: translateY(-100%); }

.pnt-box .listbox .box { position:absolute; }
.pnt-box .listbox .box:nth-child(1) { left:50%; transform:translateX(-50%) rotate(-10deg); z-index:3 } 
.pnt-box .listbox .box:nth-child(2) { position:relative; z-index:2 }
.pnt-box .listbox .box:nth-child(3) { right:50%; transform:translateX(50%) rotate(10deg); z-index:1 }
.pnt-box .listbox.active .box { position:relative; }
.pnt-box .listbox.active .box:nth-child(1),
.pnt-box .listbox.active .box:nth-child(2),
.pnt-box .listbox.active .box:nth-child(3) { left:0; right:0; transform:translateX(0) rotate(0deg); }

/* animation */
.pnt-box .listbox { opacity:0; }
.pnt-box.subOn .listbox { animation:ani_3 1.0s 0.3s; animation-fill-mode:both; } 
.pnt-box.subOn .listbox .box:nth-child(1) { animation:p_ani1 1.0s 0.8s; animation-fill-mode:both; } 
.pnt-box.subOn .listbox .box:nth-child(3) { animation:p_ani2 1.0s 0.8s; animation-fill-mode:both; } 
.pnt-box.subOn .listbox.active .counter .num div:nth-of-type(odd){ animation:counter 1.5s 0.1s ease-out both; }
.pnt-box.subOn .listbox.active .counter .num div:nth-of-type(even){ animation:counter 1.5s 0.1s ease-in reverse both; }

@keyframes p_ani1 {
  0% { transform:translateX(-50%) rotate(-10deg); }
  100% { transform:translateX(0) rotate(0deg); left:0; }			
}
@keyframes p_ani2 {
  0% { transform:translateX(50%) rotate(10deg); }
  100% { transform:translateX(0) rotate(0deg); right:0; }			
}
@keyframes counter{
	0%{ top:calc(9.0rem + 0.1rem); transform:translateY(-100%); }
	100%{ top: 0; transform: translateY(0); }
}
@media screen and (max-width:1440px){
	.pnt-box .listbox .box .imgbox .num-box { gap:0 18px; }
	.pnt-box .listbox .box .imgbox .num-box > div { font-size:8.0rem; min-width:46px; }
	.pnt-box .listbox .box .counter .num div:nth-of-type(odd){ top:calc(8.0rem + 0.1rem); }

	@keyframes counter{
		0%{ top:calc(8.0rem + 0.1rem); transform:translateY(-100%); }
		100%{ top: 0; transform: translateY(0); }
	}
}
@media screen and (max-width:1280px){
	.pnt-box .listbox .box .imgbox .num-box { gap:0 10px; }
	.pnt-box .listbox .box .imgbox .num-box > div { font-size:6.4rem; min-width:42px; }
	.pnt-box .listbox .box .counter .num div:nth-of-type(odd){ top:calc(6.4rem + 0.1rem); }
	.pnt-box .listbox .box .txtbox { height:130px; }
	.pnt-box .listbox .box .txtbox .txt { font-size:2.1rem; }

	@keyframes counter{
		0%{ top:calc(6.4rem + 0.1rem); transform:translateY(-100%); }
		100%{ top: 0; transform: translateY(0); }
	}
}
@media screen and (max-width:1024px){
	.pnt-box .btnMore { margin-top:80px; }
	.pnt-box .listbox { gap:10px; margin-top:70px; }
	.pnt-box .listbox .box { width:calc((100% - 20px) / 3); }
	.pnt-box .listbox .box .imgbox { border-radius:15px 15px 0px 0px; }
	.pnt-box .listbox .box .imgbox .num-box { gap:0 10px; }
	.pnt-box .listbox .box .imgbox .num-box > div { font-size:6.4rem; min-width:42px; }
	.pnt-box .listbox .box .counter .num div:nth-of-type(odd){ top:calc(6.4rem + 0.1rem); }
	.pnt-box .listbox .box .txtbox { height:130px; border-radius:0 0 15px 15px; }
	.pnt-box .listbox .box .txtbox .txt { font-size:2.1rem; }
	.pnt-box .listbox.active .box:hover .txtbox,
	.pnt-box .listbox.active .box:hover .imgbox { border-radius:30px; }

	@keyframes counter{
		0%{ top:calc(6.4rem + 0.1rem); transform:translateY(-100%); }
		100%{ top: 0; transform: translateY(0); }
	}
}
@media screen and (max-width:960px){
	.pnt-box .listbox .box { width:calc((100% - 10px) / 2); }
	.pnt-box .listbox .box figure { position:relative; overflow:hidden; }
	.pnt-box .listbox .box figure:before { content:""; display:block; padding-bottom:80%; }
	.pnt-box .listbox .box figure img { transition:all 0.5s; position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; -o-object-fit:cover; }
}
@media screen and (max-width:640px){
	.pnt-box .btnMore { margin-top:50px; }
	.pnt-box .listbox .box { width:100%; }
	.pnt-box .listbox .box figure:before { padding-bottom:60%; }
}


/* case */
.case-box .btnMore { margin-top:100px; }
.case-box .listbox { display:flex; flex-wrap:wrap; gap:20px; margin-top:100px; }
.case-box .listbox .box { width:calc((100% - 60px) / 4); }
.case-box .listbox .box a { position:relative; width:100%; height:100%; display:block; overflow:hidden; border-radius:30px; }
.case-box .listbox .box img { transition:all 0.5s; width:100%; }
.case-box .listbox .box a:hover img { transform:scale(1.10); }
.case-box .listbox .box dl { position:absolute; left:0; bottom:0; width:100%; padding:0 0 50px 50px; }
.case-box .listbox .box dl dt { transition:all 0.5s; color:rgba(255,255,255,0.5); font-size:2.4rem; font-weight:700; line-height:1.3; }
.case-box .listbox .box a:hover dl dt { color:var(--mainColor); }
.case-box .listbox .box dl dd { margin-top:10px; color:rgba(255,255,255,1); font-size:4.0rem; font-weight:700; line-height:1.3; letter-spacing:-0.03em; }
@media screen and (max-width:1440px){
	.case-box .listbox .box dl { padding:0 0 30px 30px; }
	.case-box .listbox .box dl dt { font-size:2.3rem; }
	.case-box .listbox .box dl dd { font-size:3.8rem;}
}
@media screen and (max-width:1280px){
	.case-box .listbox .box dl { padding:0 0 20px 20px; }
	.case-box .listbox .box dl dt { font-size:2.1rem; }
	.case-box .listbox .box dl dd { margin-top:5px; font-size:3.4rem;}
}
@media screen and (max-width:1024px){
	.case-box .btnMore { margin-top:80px; }
	.case-box .listbox { gap:10px; margin-top:70px; }
	.case-box .listbox .box { width:calc((100% - 10px) / 2); }
	.case-box .listbox .box a { border-radius:15px; }
}
@media screen and (max-width:640px){
	.case-box .btnMore { margin-top:50px; }
	.case-box .listbox { margin-top:40px; }
	.case-box .listbox .box dl dt { font-size:2.0rem; }
	.case-box .listbox .box dl dd { font-size:2.9rem;}
}

/* animation */
.case-box .listbox .box { opacity:0; }
.case-box.subOn .listbox .box { animation:ani_2 0.8s; animation-fill-mode:both; }
.case-box.subOn .listbox .box:nth-child(1) { animation-delay:0.6s }
.case-box.subOn .listbox .box:nth-child(2) { animation-delay:0.7s }
.case-box.subOn .listbox .box:nth-child(3) { animation-delay:0.8s }
.case-box.subOn .listbox .box:nth-child(4) { animation-delay:0.9s }
.case-box.subOn .listbox .box:nth-child(5) { animation-delay:1.0s }


/* innovation */
.innovation-box { position:relative; height:250vh; }
.innovation-box .innovationCont { position:sticky; top:0; z-index:5; height:100vh; width:100%; overflow:hidden; }
.innovation-box .txtCont { position:relative; z-index:5; height:100%; width:100%; }
.innovation-box .txtbox { padding:0 100px; height:100%; display:flex; flex-direction:column; justify-content:center; }
.innovation-box .txtbox .top .txt { color:#000; font-size:15.0rem; font-weight:700; line-height:1.3; }
.innovation-box .txtbox .top .txt.txt-2 { margin-left:20%; color:var(--mainColor); }
.innovation-box .txtbox .txt_b { position:relative; text-align:center; margin-top:30px; color:#eee; font-size:4.0rem; font-weight:600; line-height:1.5; letter-spacing:-0.07em; }
.innovation-box .txtbox .txt_b span { font-family:var(--subFont); font-weight:600; }
.innovation-box .bg { position:absolute; z-index:1; left:50%; top:50%; transform:translate(-50%, -50%); width:100px; height:100px; background:#fd8416; border-radius:100px; }
.innovation-box .chart-box { position:absolute; left:0; top:0; z-index:2; width:100%; height:calc(100vh + 1px); }
.innovation-box .chart-box .txt-1 { color:#fff; fill:#fff; font-size:2.4rem; font-weight:700;  }
.innovation-box .chart-box .txt-2 { color:#fff; fill:#fff; font-size:2.6rem; font-weight:700;  }
.innovation-box .chart-box .txt-3 { color:#fff; fill:#fff; font-size:2.4rem; font-weight:600; }
.innovation-box .chart-box .txt-4 { color:var(--mainColor); fill:var(--mainColor); font-size:2.4rem; font-weight:700; }
.innovation-box .list { display:none; opacity:0; margin-top:-18%; }
.innovation-box .list ul { display:flex; flex-wrap:wrap; gap:10px 20px; }
.innovation-box .list ul li { width:calc((100% - 20px ) / 2); color:#fff; font-size:2.0rem; font-weight:400; line-height:1.3; }
.innovation-box .list ul li strong { width:70px; font-weight:500; font-size:2.2rem; display:inline-block }
.innovation-box .list ul li span { font-size:2.2rem; font-weight:500; }

/* animation */
.innovation-box .txtbox .top { transform:translateY(200px); }
.innovation-box .txtbox .top .txt.txt-1 { margin-left:22%; transition:all 0.8s ease 0.3s; }
.innovation-box .txtbox .top .txt.txt-2 { margin-left:0; transition:all 0.8s ease 0.3s; }
.innovation-box.subOn .txtbox .top .txt.txt-1 { margin-left:0; }
.innovation-box.subOn .txtbox .top { transform:translateY(0); transition:all 0.8s ease 1.5s; }
.innovation-box.subOn .txtbox .top .txt.txt-2 { margin-left:19%; }
.innovation-box .txtbox .txt_b span { width:fit-content; color:#222; background-size:200% 100%; -webkit-background-clip:text; background-position:100%; }
.innovation-box .txtbox .txt_b { opacity:0; }
.innovation-box.subOn .txtbox .txt_b { opacity:1; transition:all 0.8s ease 1.8s; }
.innovation-box.subOn .txtbox .txt_b span { background-image:linear-gradient(to right, rgba(0,0,0,1), rgba(0,0,0,1), rgba(0,0,0,1), rgba(0,0,0,1) 50%, rgba(0,0,0,0.2) 50%); -webkit-text-fill-color:transparent; }
.innovation-box.subOn .txtbox .txt_b span { animation:gradientShift 2.0s 2.1s cubic-bezier(.33,.53,.52,.72); animation-fill-mode:both; }
.innovation-box .bg { opacity:0; }
.innovation-box.subOn .bg { opacity:1; transition:all 0.8s ease 4.6s; }
.innovation-box.aniOver .txtbox .txt_b { opacity:0; transition:opacity 0.8s ease 0.4s; z-index:-10 }
.innovation-box.aniOver .list { opacity:1; transition:opacity 0.8s ease 1.8s; }
.innovation-box.aniOver .bg { transition:all 1.0s ease 0.8s; width:100vw; height:calc(100vh + 1px); border-radius:0; }
.innovation-box.aniOver .txtbox .top { transform:translateY(-50%); transition:all 1.0s ease 0.8s; }
.innovation-box.aniOver .txtbox .top .txt { transition:all 1.0s ease 0.8s; color:#fff; font-size:10.0rem; }
.innovation-box.aniOver .txtbox .top .txt.txt-2 { margin-left:0; transition:all 1.0s ease 0.8s; }
.innovation-box .chart-box { opacity:0; }
.innovation-box.aniOver .chart-box { opacity:1; transition:all 1.0s ease 1.2s; }
.innovation-box .chart-box .barMask { width:0; }
.innovation-box.aniOver .chart-box .barMask { animation:ani_w 1.2s 1.3s linear; animation-fill-mode:both; }
.innovation-box.aniOver .chart-box .chartCls1 { animation:ani_opacity 0.8s 2.5s; animation-fill-mode:both; }
.innovation-box .chart-box .p-box { opacity:1; }
.innovation-box.aniOver .chart-box .p1 { animation:ani_3 0.5s 2.5s; animation-fill-mode:both; }
.innovation-box.aniOver .chart-box .p2 { animation:ani_3 0.5s 2.8s; animation-fill-mode:both; }
.innovation-box.aniOver .chart-box .p3 { animation:ani_3 0.5s 3.1s; animation-fill-mode:both; }
.innovation-box.aniOver .chart-box .p4 { animation:ani_3 0.5s 3.4s; animation-fill-mode:both; }
.innovation-box.aniOver .chart-box .p5 { animation:ani_3 0.5s 3.7s; animation-fill-mode:both; }
.innovation-box.aniOver .chart-box .p6 { animation:ani_3 0.5s 4.0s; animation-fill-mode:both; }
.innovation-box.aniOver .chart-box .p7 { animation:ani_3 0.5s 4.3s; animation-fill-mode:both; }
.innovation-box.aniOver .chart-box .p8 { animation:ani_3 0.5s 4.6s; animation-fill-mode:both; }
.innovation-box.aniOver .chart-box .circle1 { transform-box:content-box; transform-origin:center; visibility:inherit; animation:circle1 1s 4.0s linear infinite; opacity:0.8; }
.innovation-box.aniOver .chart-box .ani_p { animation:charta_ani 2.5s 5.0s infinite; }
@media screen and (max-height:800px){
	.innovation-box,
	.innovation-box .chart-box,
	.innovation-box .innovationCont,
	.innovation-box.aniOver .bg { height:860px; }
}
@media screen and (max-width:1850px){
	.innovation-box .txtbox .top .txt { font-size:13.0rem; }
	.innovation-box .txtbox .txt_b { margin-top:25px; font-size:3.5rem; }
	.innovation-box.aniOver .txtbox .top .txt { font-size:9.0rem; }
	.innovation-box .chart-box svg { width:100%; }
}
@media screen and (max-width:1600px){
	.innovation-box .txtbox .top .txt { font-size:11.0rem; }
	.innovation-box .txtbox .txt_b { font-size:3.0rem; }
	.innovation-box.aniOver .txtbox .top .txt { font-size:7.5rem; }
}
@media screen and (max-width:1340px){
	.innovation-box .txtbox { padding:0 20px; }
	.innovation-box .txtbox .top .txt { font-size:9.0rem; }
	.innovation-box .txtbox .txt_b { margin-top:15px; font-size:2.6rem; }
	.innovation-box.aniOver .txtbox .top .txt { font-size:6.0rem; }
}
@media screen and (max-width:1140px){
	.innovation-box .txtbox .top .txt { font-size:7.5rem; }
	.innovation-box .txtbox .txt_b { margin-top:10px; font-size:2.4rem; }
	.innovation-box.aniOver .txtbox .top .txt { font-size:5.6rem; }
}
@media screen and (max-width:1024px){
	.innovation-box .txtbox .top .txt { font-size:7.0rem; }
	.innovation-box .txtbox .txt_b { font-size:2.2rem; }
	.innovation-box .txtbox .txt_b br { display:none }
	.innovation-box .txtbox .txt_b span.m_br { display:block }
	.innovation-box.aniOver .txtbox .top .txt { font-size:5.0rem; }
	.innovation-box .chart-box { display:none }
	.innovation-box .list { display:block; }
}
@media screen and (max-width:640px){
	.innovation-box { height:150vh; }
	.innovation-box .innovationCont { height:95vh; }
	.innovation-box .txtbox .top .txt { font-size:4.0rem; }
	.innovation-box .txtbox .txt_b { font-size:2.0rem; }
	.innovation-box.aniOver .txtbox .top .txt { font-size:3.8rem; }
	.innovation-box .list ul li { width:100%; }
}
@media screen and (max-width:480px){
	.innovation-box .txtbox .top .txt { font-size:3.8rem; }
	.innovation-box.aniOver .txtbox .top .txt { font-size:3.6rem; }
	.innovation-box .list { margin-top:-25%; }
}
@keyframes charta_ani {
    0% { transform:translateY(0); }
    50% { transform:translateY(30px); }
    100% { transform:translateY(0); }
}
@keyframes circle1 {
  to {
    transform:scale(2.8);
    opacity:0;
  }
}
@keyframes ani_opacity {
  from { opacity: 1; }
  to { opacity: 0.2; }
}


/* partners */
.partners-box { margin:0; padding-top:310px; overflow:hidden; }
.partners-box .listbox { margin-top:100px; display:flex; flex-wrap:wrap; gap:20px; }
.partners-box .listbox .box { position:relative; overflow:hidden; width:calc((100% - 80px) / 5); height:260px; padding:20px; display:flex; align-items:center; justify-content:center; border-radius:30px; transition:all 0.5s ease 0.1s; border:1px dashed #f5f5f5; }
.partners-box .listbox .box::after { transition:all 0.5s ease 0.1s; content:""; position:absolute; inset:0; background:#f5f5f5; mix-blend-mode: multiply; pointer-events:none; }
.partners-box .listbox .box figure > img { max-width:100%; background-blend-mode:multiply; }
.partners-box .listbox .box:hover { border-color:var(--mainColor); }
.partners-box .listbox .box:hover::after { background:#fff; }
.partners-box .listbox .box.mov { width:calc((100% - 30px) / 2.5); }
.partners-box .listbox .box.mov,
.partners-box .listbox .box.mov:hover,
.partners-box .listbox .box.noBg,
.partners-box .listbox .box.noBg:hover { background:none; border:none }
.partners-box .listbox .box.noBg::after { display:none; }
.partners-box .listbox .mov-box { position:relative; overflow:hidden; border-radius:30px; margin:10% 0 0 50%; transition:all 2s ease 1.0s; z-index:2; flex:0 0 calc(100vw - 200px);; height:calc((100vw * 0.5625) - 200px); /* 16:9 비율 */}
.partners-box .listbox .mov-box:before { content:""; display:block; padding-bottom:56.25%; }
.partners-box .listbox .mov-box video { position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:100%; height:100%; object-fit:cover; -o-object-fit:cover; }
@media screen and (max-width:1440px){
	.partners-box { padding-top:260px; }
}
@media screen and (max-width:1280px){
	.partners-box { padding-top:200px; }
	.partners-box .listbox .box { width:calc((100% - 60px) / 4); height:220px; }
	.partners-box .listbox .box.mov { width:calc((100% - 20px) / 2); }
	.partners-box .listbox .mov-box { margin:-20% 0 0 calc(-100% - 40px); flex:0 0 calc(100vw - 40px); height:calc((100vw * 0.5625) - 40px); }
}
@media screen and (max-width:960px){
	.partners-box { padding-top:140px; }
	.partners-box .listbox { margin-top:80px; }
	.partners-box .listbox .box { width:calc((100% - 40px) / 3); height:200px; border-radius:15px; padding:10px; }
	.partners-box .listbox .box.mov { width:calc((100% - 20px) / 1.485); }
	.partners-box .listbox .mov-box { margin:-10% 0 0 calc(50% + 20px); border-radius:15px; }
}
@media screen and (max-width:640px){
	.partners-box { padding-top:100px; }
	.partners-box .listbox { margin-top:40px; gap:10px; }
	.partners-box .listbox .box { width:calc((100% - 10px) / 2); height:180px; }
	.partners-box .listbox .box.mov { width:100%; }
	.partners-box .listbox .mov-box { margin:0; width:100%; flex:0 0 100%; border-radius:300px; height:180px; }
}


/* animation */
.partners-box .listbox .box { opacity:0; }
.partners-box.subOn .listbox .box { animation:bgs3 0.8s 1.0s; animation-fill-mode:both; }
.partners-box.subOn .listbox .box.mov { animation:ani_5 0.8s 1.0s; animation-fill-mode:both; }
.partners-box .listbox .box.mov { opacity:1; }
.partners-box.subOn .listbox .box.mov { animation:none; }
.partners-box.subOn .listbox .mov-box { width:100%; flex:0 0 100%; border-radius:300px; height:260px; margin:0; }
@media screen and (max-width:1280px){
	.partners-box.subOn .listbox .mov-box { height:220px; }
}
@media screen and (max-width:960px){
	.partners-box.subOn .listbox .mov-box { height:200px; }
}
@media screen and (max-width:640px){
	.partners-box.subOn .listbox .mov-box { height:180px; }
}


/* news */
.news-box { position:relative; padding-bottom:230px; }
.news-box .btnMore { margin-top:100px; }
.news-box .listbox { position:relative; overflow:hidden; margin-top:115px; padding-bottom:60px; }
.news-box .swiper-container .swiper-slide { position:relative; width:560px; overflow:hidden; }
.news-box .swiper-container .swiper-slide a { display:block; }
.news-box .swiper-container .swiper-slide figure { position:relative; z-index:3; overflow:hidden; border-radius:30px; }
.news-box .swiper-container .swiper-slide figure:before { content:""; display:block; padding-bottom:64.4%; }
.news-box .swiper-container .swiper-slide figure img { transition:all 0.5s; position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; -o-object-fit:cover; }
.news-box .swiper-container .swiper-slide:hover figure img { transform:scale(1.10); }
.news-box .swiper-container .swiper-slide .txtbox .info { margin-top:30px; display:flex; gap:10px; }
.news-box .swiper-container .swiper-slide .txtbox .info .sbox { transition:all 0.5s; display:inline-flex; align-items:center; color:#aaa; font-size:1.6rem; font-weight:500; line-height:1.3; padding:0 10px; height:30px; border:1px solid #ddd; border-radius:30px; }
.news-box .swiper-container .swiper-slide:hover .txtbox .info .sbox { color:#fff; border-color:var(--mainColor); background:var(--mainColor);}
.news-box .swiper-container .swiper-slide .txtbox h4 { margin-top:10px; font-family:var(--mainFont); color:#111; font-size:2.4rem; font-weight:500; line-height:1.5; text-overflow:ellipsis; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.news-box .control_box { display:none }
.news-box .swiper-pagination { position:absolute; left:100px; bottom:0; width:auto; display:flex; gap:10px; }
.news-box .swiper-pagination span { outline:none; margin:0 !important; display:flex; align-items:center; justify-content:center; width:16px; height:16px; background:#aaa; border-radius:4px; opacity:1; }
.news-box .swiper-pagination span.swiper-pagination-bullet-active { background:var(--mainColor); }
@media screen and (max-width:1440px){
	.news-box { padding-bottom:180px; }
	.news-box .swiper-container .swiper-slide { width:500px; overflow:hidden; }
	.news-box .swiper-pagination { left:20px; }
}
@media screen and (max-width:1280px){
	.news-box { padding-bottom:140px; }
	.news-box .btnMore { margin-top:80px; }
	.news-box .listbox { margin-top:100px; }
}
@media screen and (max-width:1024px){
	.news-box { padding-bottom:100px; }
	.news-box .btnMore { margin-top:50px; }
	.news-box .listbox { margin-top:70px; padding-bottom:40px; }
	.news-box .swiper-container .swiper-slide figure { border-radius:15px; }
	.news-box .swiper-container .swiper-slide .txtbox .info { margin-top:15px; }
	.news-box .swiper-container .swiper-slide .txtbox h4 { font-size:2.2rem; }
	.news-box .swiper-pagination { gap:8px; justify-content:center; left:0; width:100%; }
	.news-box .swiper-pagination span { width:10px; height:10px; border-radius:2px; }
}
@media screen and (max-width:640px){
	.news-box { padding-bottom:60px; }
	.news-box .listbox { margin-top:40px; padding:0 20px 30px; }
}

/* animation */
.news-box .listbox { opacity:0; }
.news-box.subOn .listbox { animation:ani_5 0.8s 0.3s; animation-fill-mode:both; }
.news-box .swiper-pagination { opacity:0; }
.news-box.subOn .swiper-pagination { animation:ani_3 0.8s 0.7s; animation-fill-mode:both; }

@keyframes aniNews {
	0% { transform:translateX(80px); opacity:0; }
	100% { transform:translateX(0); opacity:1; }
}