@charset "utf-8";
@import url("fullpage.css");

.section { overflow:hidden; position:relative; }

#fp-nav.right { right:100px !important; top:50% !important; transform:translateY(-50%) !important; margin-top:0 !important; }
#fp-nav ul li, 
.fp-slidesNav ul li { margin:25px 0 !important; }
#fp-nav ul li:last-child { display:none !important; }
#fp-nav ul li a span, .fp-slidesNav ul li a span { background:#d3d3d3 !important; width:6px !important; height:6px !important; margin:-2px 0 0 0 !important; }
.fp-viewing-0 #fp-nav ul li a span, .fp-viewing-0 .fp-slidesNav ul li a span { background:#d3d3d3 !important; }
#fp-nav ul li a.active span, .fp-slidesNav ul li a.active span, #fp-nav ul li:hover a.active span, .fp-slidesNav ul li:hover a.active span { background-color:#3835a2 !important; width:5px !important; height:5px !important; }
#fp-nav ul li:first-child a.active span, .fp-slidesNav ul li:first-child a.active span, #fp-nav ul li:first-child:hover a.active span, .fp-slidesNav ul li:first-child:hover a.active span { background-color:#1355af !important; width:5px !important; height:5px !important; }
 

/* visual s */
#mainVisual { position:relative; width:100vw; height:100vh; }
#mainVisual .swiper-container { position:relative; width:100%; height:100vh; overflow:hidden; }
#mainVisual .swiper-container .swiper-slide { position:relative; width:100%; height:100vh; overflow:hidden; display:flex; }
#mainVisual .swiper-container .swiper-slide .mvisualImage { position:absolute; left:0; right:0; top:0; bottom:0; background-position:center center; background-repeat:no-repeat; background-size:cover; transform:scale(1.1);  }
#mainVisual .swiper-container .swiper-slide.swiper-slide-active .mvisualImage { animation:vsImg 4.5s; transform:scale(1.1); }

#mainVisual .swiper-container .swiper-pagination.swiper-pagination { position:absolute; width:auto !important; bottom:80px !important; left:90px !important; z-index:99; }
#mainVisual .swiper-container .swiper-pagination.swiper-pagination .swiper-pagination-bullet { background-color:#fff; width:4px; height:4px; border:none; margin:0 10px; display:inline-block; vertical-align:middle; }
#mainVisual .swiper-container .swiper-pagination.swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { width:5px; height:5px; border:1px solid #fff; background:none; }

#mainVisual .swiper-container .swiper-slide .num { position:absolute; bottom:150px; left:96px; color:#fff; transform:rotate(90deg); font-family:'Montserrat' sans-serif; font-size:12px; }
#mainVisual .swiper-container .swiper-slide.swiper-slide-active .num { animation:txt_vs 0.8 0.8s; animation-fill-mode:forwards; transform:rotate(-95deg); } 
#mainVisual .swiper-container .swiper-slide.slide2 .num { left:121px; }
#mainVisual .swiper-container .swiper-slide.slide3 .num { left:146px; }
#mainVisual .swiper-container .swiper-slide.slide4 .num { left:171px; }
#mainVisual .swiper-container .swiper-slide.slide5 .num { left:196px; }

#mainVisual .swiper-container .swiper-slide .txtbox { opacity:0; color:#fff; position:absolute; top:50%; left:50%; z-index:9; text-align:center; transform:translate(-50%, -50%); }
#mainVisual .swiper-container .swiper-slide.swiper-slide-active .txtbox .txt { position:relative; font-size:20px;  color:#fff; opacity:0; font-family:'Montserrat', 'Noto Sans KR', sans-serif; width:100vw; }
#mainVisual .swiper-container .swiper-slide.swiper-slide-active .txtbox .txt.txt_1 { font-size:24px; }
#mainVisual .swiper-container .swiper-slide.swiper-slide-active .txtbox .txt.txt_2 { margin:25px 0 0 0; font-size:68px; color:#fff; font-weight:800; text-transform:uppercase; }
#mainVisual .swiper-container .swiper-slide.swiper-slide-active .txtbox .txt.txt_3 { margin:45px 0 0 0; font-size:24px; color:#fff; font-weight:300; line-height:36px; letter-spacing:-0.04em }
#mainVisual .swiper-container .swiper-slide.swiper-slide-active .txtbox .txt a { color:#fff; }

#mainVisual .swiper-container .btn_pn {  position:absolute; top:auto; bottom:80px; transform:translateX(-50%); left:50%; width:30px; height:auto; outline:none; }
#mainVisual .swiper-container .btn_pn span { font-weight:200; overflow:hidden; text-indent:-9999em; display:block; }
#mainVisual .swiper-container .swiper-button-next { margin-left:15px; background:url(/img/main/btn-next.png) right center no-repeat; }
#mainVisual .swiper-container .btn_pn:after { display:none; }
#mainVisual .swiper-container .swiper-button-prev { margin-left:-15px; background:url(/img/main/btn-prev.png) left center no-repeat;}
#mainVisual .swiper-container .swiper-button-next:after { content:""; display:block; width:1px; height:18px; position:absolute; left:0; top:0; background-color:rgba(255,255,255, 0.4); }

#mainVisual .swiper-container .swiper-slide.swiper-slide-active .txtbox { animation:ani_over 0.5 0.2s; animation-fill-mode:forwards; } 
#mainVisual .swiper-container .swiper-slide.swiper-slide-active .txtbox .txt_1 { animation:ani_3 0.5s; animation-fill-mode:forwards; } 
#mainVisual .swiper-container .swiper-slide.swiper-slide-active .txtbox .txt_2 { animation:ani_3 1.0s; animation-fill-mode:forwards; } 
#mainVisual .swiper-container .swiper-slide.swiper-slide-active .txtbox .txt_3 { animation:ani_3 1.5s; animation-fill-mode:forwards; } 
@media screen and (max-width:960px){
	.section,
	.fp-tableCell  { height:auto !important; }
	#mainVisual,
	#mainVisual .swiper-container,
	#mainVisual .swiper-container .swiper-slide { height:700px !important; }
	#mainVisual .swiper-container .swiper-slide.swiper-slide-active .txtbox .txt { font-size:18px; }
	#mainVisual .swiper-container .swiper-slide.swiper-slide-active .txtbox .txt.txt_1 { font-size:20px; }
	#mainVisual .swiper-container .swiper-slide.swiper-slide-active .txtbox .txt.txt_2 { margin:20px 0 0 0; font-size:54px; }
	#mainVisual .swiper-container .swiper-slide.swiper-slide-active .txtbox .txt.txt_3 { margin:40px 0 0 0; font-size:20px; line-height:30px; }
	#mainVisual .swiper-container .swiper-slide .num { position:absolute; bottom:40px; left:16px  !important; }
	#mainVisual .swiper-container .swiper-pagination.swiper-pagination { bottom:40px !important; left:50% !important; transform:translateX(-50%); }
}
@media screen and (max-width:640px){
	#mainVisual,
	#mainVisual .swiper-container,
	#mainVisual .swiper-container .swiper-slide { height:600px !important; }
	#mainVisual .swiper-container .swiper-slide.swiper-slide-active .txtbox .txt { font-size:14px; }
	#mainVisual .swiper-container .swiper-slide.swiper-slide-active .txtbox .txt.txt_1 { font-size:16px; }
	#mainVisual .swiper-container .swiper-slide.swiper-slide-active .txtbox .txt.txt_2 { margin:15px 0 0 0; font-size:38px; }
	#mainVisual .swiper-container .swiper-slide.swiper-slide-active .txtbox .txt.txt_3 { margin:20px 0 0 0; font-size:16px; line-height:26px; }
	#mainVisual .swiper-container .btn_pn { bottom:120px; }
	#mainVisual .swiper-container .swiper-slide .num { position:absolute; bottom:70px; }
	#mainVisual .swiper-container .swiper-pagination.swiper-pagination { bottom:70px !important; }
}

.section .btn_list { text-align:center; }
.section .btn_list a { display:block; text-align:center; width:180px; margin:0 auto; padding:17px 0; border:1px solid #999; box-sizing:border-box; }
.section .btn_list a span { position:relative; padding:0 48px 0 0; color:#666; font-size:16px; line-height:14px; font-weight:300; }
.section .btn_list a span:before { content:""; display:block; position:absolute; right:5px; top:50%; width:28px; height:7px; margin-top:-3px; background:url(/img/main/icon_arr1.png) left center no-repeat; transition:all 0.3s ease-in-out; }
.section .btn_list a:hover span:before { right:-5px; }
@media screen and (max-width:1400px){
	.section .btn_list a { width:160px; padding:15px 0; }
	.section .btn_list a span { font-size:15px; line-height:12px; }
}
@media screen and (max-width:960px){
	.section .btn_list a { width:140px; padding:13px 0; }
	.section .btn_list a span { font-size:14px; line-height:12px; }
	.section .btn_list a span:before { right:0; }
}

@keyframes txt_vs {
	0% { transform:rotate(90deg); }
	100% { transform:rotate(-95deg); }
}
/* business */ 
.main_business { position:absolute; top:50%; left:0; z-index:3; transform:translateY(-50%); width:100%; }
.main_business .box { margin:0 auto; max-width:1400px; }
.main_business .box .tit { font-family:'Montserrat', sans-serif; font-weight:700; font-size:40px; color:#333; }
.main_business .box .txt { margin:25px 0 0 0; font-weight:300; font-size:18px; color:#333; line-height:32px; letter-spacing:-0.04em; }
.main_business .box .list { margin:50px 0 0 -100px; }
.main_business .box .list:after {content:""; display:block; visibility:hidden; clear:both; height:0; }
.main_business .box .list li { float:left; width:calc(33.3% - 100px); margin:0 0 0 100px; vertical-align:top;  }
.main_business .box .list li .imgbox { position:relative; overflow:hidden; height:300px; }
.main_business .box .list li .imgbox img { border-radius:0 40px 0 0; transition:all 0.3s; }
.main_business .box .list li:hover .imgbox img { box-shadow:0 15px 15px 0 #ddd,0 -10px 15px 0 #ddd; }
.main_business .box .list li .imgbox .more { opacity:0; transition:all 0.3s; position:relative; z-index:5; float:right; margin:-40px -5px 0 0; background-color:#9fc01c; width:197px; height:54px; padding:22px 0 0 36px; text-transform:uppercase; box-sizing:border-box; color:#fff; font-size:14px; line-height:12px; font-family:'Montserrat', sans-serif; }
.main_business .box .list li .imgbox .more:after { content:""; display:block; position:absolute; right:35px; top:50%; margin-top:-5px; width:7px; height:10px; background:url(/img/main/icon_arr.png) left center no-repeat; }
.main_business .box .list li:hover .imgbox .more { opacity:1; }
.main_business .box .list li .txtbox { display:block; margin:29px 0 0 0; }
.main_business .box .list li .txtbox strong { color:#333; font-size:18px; font-weight:500; display:block; }
.main_business .box .list li .txtbox span { margin:10px 0 0 0; font-size:15px; color:#666; line-height:26px; font-weight:300; letter-spacing:-0.04em; display:block; }
.main_business .box .list li:nth-child(2) { margin-top:-130px; }
.main_business .box .btn_list { margin:-40px 0 0 0; }
.main2:after { opacity:0; content:""; display:block; position:absolute; right:-120px; top:30px; width:376px; height:289px; background:url(/img/main/bg_section_1.png) left center no-repeat; }
.main2:before { opacity:0; content:""; display:block; position:absolute; left:-230px; bottom:125px; width:437px; height:437px; background:url(/img/main/bg_section_2.png) left center no-repeat; }

/* animation */
.main2.on:after { opacity:1; animation:ani_4 0.5s; animation-fill-mode:forwards; }
.main2.on:before { opacity:1; animation:ani_5 1s; animation-fill-mode:forwards; }
.main_business .box .list li,
.main_business .box .btn_list { opacity:0; }
.main2.on .main_business .box .list li:nth-child(1) { animation:ani_3  0.5s 0.3s; animation-fill-mode:forwards; }
.main2.on .main_business .box .list li:nth-child(2) { animation:ani_4  0.5s 0.6s; animation-fill-mode:forwards; }
.main2.on .main_business .box .list li:nth-child(3) { animation:ani_3  0.5s 0.9s; animation-fill-mode:forwards; }
.main2.on .main_business .box .btn_list { animation:ani_3  0.5s 1.2s; animation-fill-mode:forwards; }
.main2 .txt_over { position:absolute; bottom:0; left:100px; }
.main2 .txt_over span{ display:inline-block; }
.main2 .txt_over span i { opacity:0; font-weight:800; min-width:35px; font-family:'Montserrat', sans-serif; color:#eee; font-size:120px; text-transform:uppercase; line-height:90px; font-style:normal; display:inline-block; transform:translateY(100px); transition:transform 1000ms cubic-bezier(0.425,0.005,0,1); }
.main2.on .txt_over span i { opacity:1; transform:translateY(0); }
.main2.on .txt_over span:nth-child(1) i{ transition-delay:0.5s; }
.main2.on .txt_over span:nth-child(2) i{ transition-delay:0.6s; }
.main2.on .txt_over span:nth-child(3) i{ transition-delay:0.7s; }
.main2.on .txt_over span:nth-child(4) i{ transition-delay:0.8s; }
.main2.on .txt_over span:nth-child(5) i{ transition-delay:0.9s; }
.main2.on .txt_over span:nth-child(6) i{ transition-delay:1.0s; }
.main2.on .txt_over span:nth-child(7) i{ transition-delay:1.1s; }
.main2.on .txt_over span:nth-child(8) i{ transition-delay:1.2s; }
.main2.on .txt_over span:nth-child(9) i{ transition-delay:1.3s; }
.main2.on .txt_over span:nth-child(10) i{ transition-delay:1.4s; }
.main2.on .txt_over span:nth-child(11) i{ transition-delay:1.5s; }
.main2.on .txt_over span:nth-child(12) i{ transition-delay:1.6s; }
.main2.on .txt_over span:nth-child(13) i{ transition-delay:1.7s; }
.main2.on .txt_over span:nth-child(14) i{ transition-delay:1.8s; }
.main2.on .txt_over span:nth-child(15) i{ transition-delay:1.9s; }
.main2.on .txt_over span:nth-child(16) i{ transition-delay:2.0s; }
.main2.on .txt_over span:nth-child(17) i{ transition-delay:2.1s; }
.main2.on .txt_over span:nth-child(18) i{ transition-delay:2.2s; }
.main2.on .txt_over span:nth-child(19) i{ transition-delay:2.3s; }
.main2.on .txt_over span:nth-child(20) i{ transition-delay:2.4s; }

@media screen and (max-width:1440px){
	.main_business .box { padding:0 20px; max-width:auto; }
	.main_business .box .tit { font-size:36px; }
	.main_business .box .txt { margin:20px 0 0 0; font-size:16px; line-height:28px; }
	.main_business .box .list li .imgbox { height:auto; }
	.main_business .box .list li .imgbox img { width:100%; }
	.main_business .box .list li .imgbox .more { margin:-40px 0 0 0; }
	.main_business .box .list { margin:40px 0 0 -60px; }
	.main_business .box .list li { width:calc(33.3% - 60px); margin:0 0 0 60px; }
	.main_business .box .list li .txtbox { margin:22px 0 0 0; }
	.main_business .box .list li .txtbox strong { font-size:16px; }
	.main_business .box .list li .txtbox span { margin:8px 0 0 0; font-size:14px; line-height:24px; }
	.main_business .box .list li .txtbox span br { display:none; }
	.main_business .box .list li:nth-child(2) { margin-top:-90px; }
	.main2:after { right:-250px; }
	.main2:before { left:-350px; }
	.main2 .txt_over { left:20px; }
	.main2 .txt_over span i { min-width:30px; font-size:80px; line-height:60px; }
}
@media screen and (max-width:1024px){
	.main_business .box .list { margin:30px 0 0 -20px; }
	.main_business .box .list li { width:calc(33.3% - 20px); margin:0 0 0 20px; }
	.main_business .box .list li:nth-child(2) { margin-top:-50px; }
	.main_business .box .btn_list { margin:-20px 0 0 0; }
	.main_business .box .list li .imgbox .more { width:140px; height:36px; padding:12px 0 0 20px; margin:-25px 0 0 0;  } 
	.main_business .box .list li .imgbox .more:after { right:15px; }
	.main2 .txt_over span i { min-width:28px; font-size:60px; line-height:40px; }
}
@media screen and (max-width:960px){
	.main_business { position:relative; top:0; left:0; transform:translateY(0); padding:50px 0 100px 0; }
}
@media screen and (max-width:640px){
	.main_business .box .tit { font-size:30px; text-align:center; }
	.main_business .box .txt { margin:12px 0 0 0; font-size:14px; line-height:22px; text-align:center; }
	.main_business .box .list { margin:30px 0 0 0; }
	.main_business .box .list li { width:100%; margin:30px auto 0 auto; float:none; display:block; }
	.main_business .box .list li .txtbox { text-align:left; }
	.main_business .box .list li:nth-child(2) { margin-top:30px; }
	.main_business .box .btn_list { margin:40px 0 0 0; }
	.main2 .txt_over { left:0; text-align:center; width:100%; }
	.main2 .txt_over span i { min-width:12px; font-size:30px; line-height:25px; }
}

/* company */ 
.main3 { background:#f8f8f8 url(/img/main/bg_section3.jpg) center bottom no-repeat; background-size:cover; }
.main_company {  width:100%; }
.main_company .box { margin:0 auto; max-width:1400px;  }
.main_company .box .tit { font-family:'Montserrat', sans-serif; font-weight:700; font-size:40px; color:#333; text-align:center; }
.main_company .box .txt { margin:25px 0 0 0; font-weight:300; font-size:18px; color:#333; line-height:32px; letter-spacing:-0.04em; text-align:center; }
.main_company .box .list { margin:50px 0 0 -60px; }
.main_company .box .list:after {content:""; display:block; visibility:hidden; clear:both; height:0; }
.main_company .box .list li { float:left; text-align:center; width:calc(25% - 60px); margin:0 0 0 60px; vertical-align:top; height:360px; background-color:#fff; }
.main_company .box .list li .sbox { padding:57px 0 0 0; }
.main_company .box .list li .txtbox { margin:22px 0 0 0; }
.main_company .box .list li .txtbox .txt_1 { color:#28266e; font-size:20px; font-weight:300; letter-spacing:-0.04em; display:block; }
.main_company .box .list li .txtbox .txt_2 { margin:25px 0 0 0; color:#333; font-size:16px; font-weight:300; letter-spacing:-0.04em; display:block; }
.main_company .box .list li .txtbox .txt_2 span { font-weight:700; font-size:45px; display:inline-block; margin-right:5px; }
.main_company .box .list li .txtbox .txt_2.txt_2_1 span { font-size:28px; font-weight:700; vertical-align:middle; }
.main_company .box .list li .txtbox .txt_2.txt_2_1 strong  { font-size:45px; font-weight:700; }
.main_company .box .list li .txtbox .txt_3 { margin:2px 0 0 0; color:#333; font-size:16px; font-weight:300; letter-spacing:-0.04em; display:block; }
.main_company .box .btn_list { margin:60px 0 0 0; }

/* animation */
.main_company .box .list li,
.main_company .box .btn_list { opacity:0; }
/*
.main3 .main_company .box .list li .sbox .icon img { opacity:0; will-change:transform; transform-style:preserve-3d; transform:rotate3d(0,1,0,90deg); transition:transform 800ms cubic-bezier(0.425,0.005,0,1); }
.main3.on .main_company .box .list li .sbox .icon img { opacity:1; transform:rotate3d(0,1,0,0.01deg); }
.main3.on .main_company .box .list li:nth-child(1) .sbox .icon img { transition-delay:1.0s; }
.main3.on .main_company .box .list li:nth-child(2) .sbox .icon img { transition-delay:1.2s; }
.main3.on .main_company .box .list li:nth-child(3) .sbox .icon img { transition-delay:1.4s; }
.main3.on .main_company .box .list li:nth-child(4) .sbox .icon img { transition-delay:1.6s; }
*/
.main3 .main_company .box .list li .sbox .icon img { opacity:0; }
.main3.on .main_company .box .list li:nth-child(1) .sbox .icon img { animation:ani_3  0.5s 0.3s; animation-fill-mode:forwards; }
.main3.on .main_company .box .list li:nth-child(2) .sbox .icon img { animation:ani_3  0.5s 0.6s; animation-fill-mode:forwards; }
.main3.on .main_company .box .list li:nth-child(3) .sbox .icon img { animation:ani_3  0.5s 0.9s; animation-fill-mode:forwards; }
.main3.on .main_company .box .list li:nth-child(4) .sbox .icon img { animation:ani_3  0.5s 1.2s; animation-fill-mode:forwards; }
.main3.on .main_company .box .btn_list { animation:ani_3  0.5s 0.4s; animation-fill-mode:forwards; }
.main3.on .main_company .box .list li:nth-child(1) { animation:ani_3  0.1s 0.3s; animation-fill-mode:forwards; }
.main3.on .main_company .box .list li:nth-child(2) { animation:ani_3  0.1s 0.6s; animation-fill-mode:forwards; }
.main3.on .main_company .box .list li:nth-child(3) { animation:ani_3  0.1s 0.9s; animation-fill-mode:forwards; }
.main3.on .main_company .box .list li:nth-child(4) { animation:ani_3  0.1s 1.2s; animation-fill-mode:forwards; }

@media screen and (max-width:1440px){
	.main_company .box { padding:0 20px; max-width:auto; }
	.main_company .box .tit { font-size:36px; }
	.main_company .box .txt { margin:20px 0 0 0; font-size:16px; line-height:28px; }
	.main_company .box .list { margin:50px 0 0 -20px; }
	.main_company .box .list li { width:calc(25% - 20px); margin:0 0 0 20px; height:300px; }
	.main_company .box .list li .sbox { padding:40px 0 0 0; }
	.main_company .box .list li .txtbox { margin:20px 0 0 0; }
	.main_company .box .list li .txtbox .txt_1 { font-size:18px; }
	.main_company .box .list li .txtbox .txt_2 { margin:20px 0 0 0; font-size:24px; }
	.main_company .box .list li .txtbox .txt_2 span { font-size:40px; margin-right:5px; }
	.main_company .box .list li .txtbox .txt_3 { margin:2px 0 0 0; font-size:15px; }
	.main_company .box .btn_list { margin:50px 0 0 0; }
}
@media screen and (max-width:960px){
	.main_company { position:relative; top:0; left:0; transform:translateY(0); padding:50px 0 50px 0;}
}
@media screen and (max-width:865px){
	.main_company .box .list { margin:40px 0 0 -20px; }
	.main_company .box .list li { width:calc(50% - 20px); margin:20px 0 0 20px; height:300px; }
}
@media screen and (max-width:640px){
	.main_company .box .tit { font-size:30px; }
	.main_company .box .txt { margin:12px 0 0 0; font-size:14px; line-height:22px; }
	.main_company .box .list { margin:30px 0 0 -10px; }
	.main_company .box .list li { width:calc(50% - 10px); margin:10px 0 0 10px; height:220px; }
	.main_company .box .list li .sbox { padding:25px 0 0 0; }
	.main_company .box .list li .txtbox { margin:10px 0 0 0; }
	.main_company .box .list li .txtbox .txt_1 { font-size:14px; }
	.main_company .box .list li .txtbox .txt_2 { margin:5px 0 0 0; font-size:18px; }
	.main_company .box .list li .txtbox .txt_2 span { font-size:28px; margin-right:5px; }
	.main_company .box .list li .txtbox .txt_3 { margin:2px 0 0 0; font-size:13px; }
	.main_company .box .btn_list { margin:40px 0 0 0; }
}


/* performance */ 
.mainPerformance { position:relative; height:100vh; width:100%; overflow:hidden; margin:0 auto; }
.mainPerformance .box { position:absolute; width:100%; bottom:147px; top:50%; transform:translateY(-50.04%); height:525px; }
.mainPerformance .box .owl-carousel { margin-left:-600px; width:calc(100% + 600px); max-height:525px; overflow:hidden; }
.mainPerformance .box .owl-item { position:relative; }
.mainPerformance .box .owl-item:after {content:""; display:block; visibility:hidden; clear:both; height:0; }
.mainPerformance .box .owl-item .imgbox { float:left; width:700px !important; }
.mainPerformance .box .owl-item .imgbox img { width:100% !important; overflow:hidden;}
.mainPerformance .box .owl-item .txtbox { display:none; float:left; text-align:left; padding:110px 0 0 0; }
.mainPerformance .box .owl-item .txtbox .title { color:#333; font-size:40px; line-height:50px; font-weight:700; font-family:'Montserrat', sans-serif; }
.mainPerformance .box .owl-item .txtbox .txt { margin:25px 0 0 0; color:#333; font-size:18px; line-height:32px; letter-spacing:-0.04em; font-weight:300; font-family:'Montserrat', sans-serif; }
.mainPerformance .box .owl-item .txtbox .num { position:relative; margin:35px 0 0 0; color:#333; font-size:22px; letter-spacing:-0.04em; font-weight:400; font-family:'Montserrat', sans-serif; }
.mainPerformance .box .owl-item .txtbox .num strong { font-weight:700; font-size:45px; color:#e0e0e0; display:inline-block; width:65px; vertical-align:middle; }
.mainPerformance .box .owl-item .txtbox .num span { display:inline-block; width:calc(100% - 70px); font-weight:400; font-family:'Montserrat', sans-serif; vertical-align:middle;; }
.mainPerformance .box .owl-item .txtbox .btn_list { text-align:left; margin:25px 0 0 0; }
.mainPerformance .box .owl-item .txtbox .btn_list a { margin:0; }
.mainPerformance .box .owl-item.active.center { width:1320px !important;}
.mainPerformance .box .owl-item.active.center .txtbox { display:block; }
.mainPerformance .box .owl-item.active.center .imgbox { float:right; }
.mainPerformance .btn_pn { position:absolute; bottom:-32px; left:50%; transform:translateX(-50.04%); z-index:5; margin-left:-100px; }
.mainPerformance .btn_pn > div { position:relative; cursor:pointer; width:100px; padding:20px 0; box-sizing:border-box; text-align:center; display:inline-block; margin:0 -2px; background-color:#9fc01c; }
.mainPerformance .btn_pn > div span { position:relative; display:inline-block; color:#fff; font-family:'Montserrat', sans-serif; font-weight:400; font-size:14px; line-height:12px; text-transform:uppercase; }
.mainPerformance .btn_pn > div span:after {content:""; display:block; width:7px; height:10px; position:absolute; top:50%; margin-top:-6px; transition:all .3s ease-in-out; }
.mainPerformance .btn_pn .btn_prev span { padding-left:15px; }
.mainPerformance .btn_pn .btn_next span { padding-right:15px; }
.mainPerformance .btn_pn .btn_prev span:after { left:0; background:url(/img/main/icon_pn_p.png) left center no-repeat; }
.mainPerformance .btn_pn .btn_next span:after { right:0; background:url(/img/main/icon_pn_n.png) left center no-repeat; }
.mainPerformance .btn_pn .btn_next:after { content:""; display:block; width:1px; height:25px; position:absolute; top:50%; left:0; margin-top:-13px; background-color:#c7da79; }
.mainPerformance .btn_pn .btn_prev:hover span:after { left:-5px; }
.mainPerformance .btn_pn .btn_next:hover span:after { right:-5px; }

/* animation */
.mainPerformance .box .owl-item .txtbox .title,
.mainPerformance .box .owl-item .txtbox .txt,
.mainPerformance .box .owl-item .txtbox .num,
.mainPerformance .box .owl-item .txtbox .btn_list,
.mainPerformance .box .owl-item .imgbox,
.mainPerformance .btn_pn { opacity:0; }
.main4.on .mainPerformance .box .owl-item .txtbox .title { animation:ani_3 0.5s 0.3s; animation-fill-mode:forwards; }  
.main4.on .mainPerformance .box .owl-item .txtbox .txt { animation:ani_3 0.5s 0.5s; animation-fill-mode:forwards; } 
.main4.on .mainPerformance .box .owl-item .txtbox .num { animation:ani_3 0.5s 0.7s; animation-fill-mode:forwards; } 
.main4.on .mainPerformance .box .owl-item .txtbox .btn_list { animation:ani_3 0.5s 0.9s; animation-fill-mode:forwards; }
.main4.on .mainPerformance .box .owl-item .imgbox { animation:ani_5 0.5s 0.5s; animation-fill-mode:forwards; }
.main4.on .mainPerformance .box .owl-item.active.center .imgbox { animation:ani_1 0.5s 0.3s; animation-fill-mode:forwards; }
.main4.on .mainPerformance .btn_pn { animation:ani_3 0.5s 0.5s; animation-fill-mode:forwards; }
.main4 .txt_over { position:absolute; bottom:0; right:100px; }
.main4 .txt_over span{ display:inline-block; }
.main4 .txt_over span i { opacity:0; font-weight:800; min-width:35px; font-family:'Montserrat', sans-serif; color:#eee; font-size:120px; text-transform:uppercase; line-height:90px; font-style:normal; display:inline-block; transform:translateX(120px); transition:transform 1000ms cubic-bezier(0.425,0.005,0,1); }
.main4.on .txt_over {  }
.main4.on .txt_over span i { transform:translateX(0);  }
.main4.on .txt_over span:nth-child(1) i{ transition-delay:0.5s; animation:ani_5 0.5s 0.5s; animation-fill-mode:forwards; }
.main4.on .txt_over span:nth-child(2) i{ transition-delay:0.6s; animation:ani_5 0.6s 0.6s; animation-fill-mode:forwards; }
.main4.on .txt_over span:nth-child(3) i{ transition-delay:0.7s; animation:ani_5 0.7s 0.7s; animation-fill-mode:forwards; }
.main4.on .txt_over span:nth-child(4) i{ transition-delay:0.8s; animation:ani_5 0.8s 0.9s; animation-fill-mode:forwards; }
.main4.on .txt_over span:nth-child(5) i{ transition-delay:0.9s; animation:ani_5 0.9s 0.9s; animation-fill-mode:forwards; }
.main4.on .txt_over span:nth-child(6) i{ transition-delay:1.0s; animation:ani_5 1.0s 1.0s; animation-fill-mode:forwards; }
.main4.on .txt_over span:nth-child(7) i{ transition-delay:1.1s; animation:ani_5 1.1s 1.1s; animation-fill-mode:forwards; }
.main4.on .txt_over span:nth-child(8) i{ transition-delay:1.2s; animation:ani_5 1.2s 1.2s; animation-fill-mode:forwards; }
.main4.on .txt_over span:nth-child(9) i{ transition-delay:1.3s; animation:ani_5 1.3s 1.3s; animation-fill-mode:forwards; }
.main4.on .txt_over span:nth-child(10) i{ transition-delay:1.4s; animation:ani_5 1.4s 1.4s; animation-fill-mode:forwards; }
.main4.on .txt_over span:nth-child(11) i{ transition-delay:1.5s; animation:ani_5 1.5s 1.5s; animation-fill-mode:forwards; }
.main4.on .txt_over span:nth-child(12) i{ transition-delay:1.6s; animation:ani_5 1.6s 1.6s; animation-fill-mode:forwards; }
.main4.on .txt_over span:nth-child(13) i{ transition-delay:1.7s; animation:ani_5 1.7s 1.7s; animation-fill-mode:forwards; }
.main4.on .txt_over span:nth-child(14) i{ transition-delay:1.8s; animation:ani_5 1.8s 1.8s; animation-fill-mode:forwards; }
.main4.on .txt_over span:nth-child(15) i{ transition-delay:1.9s; animation:ani_5 1.9s 1.9s; animation-fill-mode:forwards; }
.main4.on .txt_over span:nth-child(16) i{ transition-delay:2.0s; animation:ani_5 2.0s 2.0s; animation-fill-mode:forwards; }
.main4.on .txt_over span:nth-child(17) i{ transition-delay:2.1s; animation:ani_5 2.1s 2.1s; animation-fill-mode:forwards; }
.main4.on .txt_over span:nth-child(18) i{ transition-delay:2.2s; animation:ani_5 2.2s 2.2s; animation-fill-mode:forwards; }
.main4.on .txt_over span:nth-child(19) i{ transition-delay:2.3s; animation:ani_5 2.3s 2.3s; animation-fill-mode:forwards; }
.main4.on .txt_over span:nth-child(20) i{ transition-delay:2.4s; animation:ani_5 2.4s 2.4s; animation-fill-mode:forwards; }

@media screen and (max-width:1600px){
	.mainPerformance .box { height:375px; }
	.mainPerformance .box .owl-carousel { margin-left:-430px; width:calc(100% + 430px); max-height:375px; }
	.mainPerformance .box .owl-item .imgbox { width:500px !important; }
	.mainPerformance .box .owl-item.active.center { width:1000px !important;}
	.mainPerformance .box .owl-item .txtbox { padding:50px 0 0 0; }
	.mainPerformance .box .owl-item .txtbox .title { font-size:30px; line-height:40px; }
	.mainPerformance .box .owl-item .txtbox .txt { margin:15px 0 0 0; font-size:16px; line-height:28px; }
	.mainPerformance .box .owl-item .txtbox .num { margin:25px 0 0 0; font-size:20px; }
	.mainPerformance .box .owl-item .txtbox .num strong { font-size:38px; width:60px; }
	.mainPerformance .box .owl-item .txtbox .num span { width:calc(100% - 65px);}
	.mainPerformance .box .owl-item .txtbox .btn_list { margin:20px 0 0 0; }
}
@media screen and (max-width:1440px){
	.mainPerformance .btn_pn { margin-left:-90px; }
	.mainPerformance .btn_pn > div { width:90px; padding:16px 0;  }
	.mainPerformance .btn_pn > div span { font-size:13px; line-height:12px; }
	.mainPerformance .btn_pn .btn_next:after { height:22px; margin-top:-11px; }
	.main4 .txt_over { right:20px; }
	.main4 .txt_over span i { min-width:30px; font-size:80px; line-height:60px; }
}
@media screen and (max-width:1200px){
	.mainPerformance .box { height:375px; }
	.mainPerformance .box .owl-carousel { margin-left:-470px; width:calc(100% + 470px); max-height:375px; }
	.mainPerformance .box .owl-item .imgbox { width:500px !important; }
	.mainPerformance .box .owl-item.active.center { width:950px !important;}
}
@media screen and (max-width:1024px){
	.mainPerformance .box { height:375px; }
	.mainPerformance .box .owl-carousel { margin-left:-470px; width:calc(100% + 470px); max-height:375px; }
	.mainPerformance .box .owl-item .imgbox { position:relative; width:300px !important; height:375px }
	.mainPerformance .box .owl-item .imgbox:after { content:""; display:block; padding-bottom:100%; }
	.mainPerformance .box .owl-item .imgbox img { position:absolute; left:0; top:0; width:100% !important; height:100% !important; object-fit:cover; -o-object-fit: cover; transition:all .4s ease-in-out; }
	.mainPerformance .box .owl-item.active.center { width:750px !important;}
	.mainPerformance .btn_pn { margin-left:-80px; }
	.mainPerformance .btn_pn > div { width:80px; padding:12px 0;  }
	.mainPerformance .btn_pn > div span { font-size:12px; line-height:12px; }
	.mainPerformance .btn_pn .btn_next:after { height:16px; margin-top:-8px; }
	.main4 .txt_over span i { min-width:28px; font-size:60px; line-height:40px; }
}
@media screen and (max-width:960px){
	.mainPerformance { position:relative; top:0; left:0; transform:translateY(0); padding:50px 0 200px 0; height:340px; }
	.mainPerformance .box { height:340px; }
	.mainPerformance .box .owl-carousel { margin-left:-50vw; width:calc(100% + 50vw); max-height:340px; }
	.mainPerformance .box .owl-item .imgbox { position:relative; width:45vw !important; height:340px }
	.mainPerformance .box .owl-item .imgbox:after { content:""; display:block; padding-bottom:100%; }
	.mainPerformance .box .owl-item .imgbox img { position:absolute; left:0; top:0; width:100% !important; height:100% !important; object-fit:cover; -o-object-fit: cover; transition:all .4s ease-in-out; }
	.mainPerformance .box .owl-item.active.center { width:100vw !important;}
	.mainPerformance .box .owl-item .txtbox { padding:50px 0 0 10px; width:50vw !important;}
	.mainPerformance .box .owl-item .txtbox .title { font-size:26px; line-height:32px; }
	.mainPerformance .box .owl-item .txtbox .txt { margin:12px 0 0 0; font-size:14px; line-height:24px; }
	.mainPerformance .box .owl-item .txtbox .txt br { display:none; }
	.mainPerformance .box .owl-item .txtbox .num { margin:15px 0 0 0; font-size:16px; }
	.mainPerformance .box .owl-item .txtbox .num strong { font-size:30px; width:50px; }
	.mainPerformance .box .owl-item .txtbox .num span { width:calc(100% - 55px);}
	.mainPerformance .box .owl-item .txtbox .btn_list { margin:12px 0 0 0; }
}
@media screen and (max-width:640px){
	.mainPerformance .box { height:500px; position:relative; width:100%; bottom:auto; top:0; transform:translateY(0); }
	.mainPerformance .box .owl-carousel { margin-left:-50vw; width:calc(100% + 50vw); max-height:500px;  }
	.mainPerformance .box .owl-item .imgbox { position:relative; width:100vw !important; height:200px !important; overflow:hidden !important; }
	.mainPerformance .box .owl-item .imgbox:after { content:""; display:block; padding-bottom:100%; }
	.mainPerformance .box .owl-item .imgbox img { position:absolute; left:0; top:0; width:100% !important; height:100% !important; object-fit:cover; -o-object-fit: cover; transition:all .4s ease-in-out; }
	.mainPerformance .box .owl-item .txtbox { padding:20px 20px 20px 10px; width:calc(100vw - 30px) !important;}
	.mainPerformance .box .owl-item.active.center { width:calc(100vw - 11px) !important;}
	.mainPerformance .box .owl-item .txtbox .btn_list { margin:0 0 0 0; position:absolute; bottom:10px; right:20px;}
	.mainPerformance .box .owl-item .txtbox .title br { display:none; }
	.mainPerformance .box .owl-item .txtbox .num span br { display:none; }
	.mainPerformance .btn_pn {  bottom:auto; top:161px; }
	.main4 .txt_over { left:0; text-align:center; width:100%; }
	.main4 .txt_over span i { min-width:12px; font-size:30px; line-height:25px; }
}
@media screen and (max-width:480px){
	.mainPerformance .box { height:480px; }
	.mainPerformance .box .owl-carousel { max-height:480px; }
}
   
/* notice */ 
.main5 { background:#eee; }
.main5:before { opacity:0; content:""; display:block; position:absolute; left:75px; bottom:-350px; width:437px; height:437px; background:url(/img/main/bg_section_2.png) left center no-repeat; }
.main_notice { width:100%; }
.main_notice .box { margin:0 auto; max-width:1400px;  }
.main_notice .box .tit { font-family:'Montserrat', sans-serif; font-weight:700; font-size:40px; color:#333; text-align:center; }
.main_notice .box .txt { margin:25px 0 0 0; font-weight:300; font-size:18px; color:#333; line-height:32px; letter-spacing:-0.04em; text-align:center;  }
.main_notice .box .list { margin:50px 0 0 -62px; }
.main_notice .box .list:after {content:""; display:block; visibility:hidden; clear:both; height:0; }
.main_notice .box .list li { position:relative; float:left; text-align:center; width:calc(25% - 62px); margin:0 0 0 62px; padding:0 0 0 0; vertical-align:top; border-radius:0 30px 0 0; transition:all .3s ease-in-out; }
.main_notice .box .list li a { display:block; height:420px; background-color:#fff; border-radius:0 30px 0 0; }
.main_notice .box .list li .imgbox { position:relative; width:100%; height:225px; display:block; overflow:hidden; border-radius:0 30px 0 0; }
.main_notice .box .list li .imgbox:after { content:""; display:block; padding-bottom:100%; }
.main_notice .box .list li .imgbox img { position:absolute; left:0; top:0; width:100% !important; height:100% !important; object-fit:cover; -o-object-fit: cover; transition:all .4s ease-in-out; }
.main_notice .box .list li .txtbox { padding:25px 27px 0 30px; text-align:left; display:block; }
.main_notice .box .list li .txtbox .type { color:#28266e; font-size:16px; font-weight:300; display:block; }
.main_notice .box .list li .txtbox .title { margin:15px 0 0 0; color:#333; font-size:18px; font-weight:400; display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; letter-spacing:-0.04em; }
.main_notice .box .list li .txtbox .stxt { margin:7px 0 0 0; color:#333; font-size:15px; font-weight:300; line-height:22px; height:42px; letter-spacing:-0.04em; display:block; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;}
.main_notice .box .list li .txtbox .date { text-align:right; margin:15px 0 0 0; display:block; font-weight:300; font-size:16px; color:#666; }
.main_notice .box .list li .more { opacity:0; transition:all 0.3s; position:absolute; right:0; top:188px; text-align:left; z-index:5; background-color:#9fc01c; width:160px; height:48px; padding:18px 0 0 25px; text-transform:uppercase; box-sizing:border-box; color:#fff; font-size:14px; line-height:12px; font-family:'Montserrat', sans-serif; }
.main_notice .box .list li .more:after { content:""; display:block; position:absolute; right:26px; top:50%; margin-top:-5px; width:7px; height:10px; background:url(/img/main/icon_arr.png) left center no-repeat; }
.main_notice .box .list li:hover { margin-top:-30px;  box-shadow:0 10px 10px 0 #ddd,0 -7px 10px 0 #dfdfdf; }
.main_notice .box .list li:after { content:""; display:block; width:0; height:3px; position:absolute; bottom:-1px; left:50%; transform:translateX(-50.04%);background-color:#9fc01c; transition:all .3s ease-in-out;}
.main_notice .box .list li:hover:after { width:100%; }
.main_notice .box .list li:hover img{ transform:scale(1.1)  rotate(.001deg);}
.main_notice .box .list li:hover .more { opacity:1; }

/* animation */
.main5.on:before { opacity:1; animation:ani_5 1s; animation-fill-mode:forwards; }
.main_notice .box .list li { opacity:0; }
.main5.on .main_notice .box .list li:nth-child(1) { animation:ani_3  0.5s 0.3s; animation-fill-mode:forwards; }
.main5.on .main_notice .box .list li:nth-child(2) { animation:ani_3  0.5s 0.6s; animation-fill-mode:forwards; }
.main5.on .main_notice .box .list li:nth-child(3) { animation:ani_3  0.5s 0.9s; animation-fill-mode:forwards; }
.main5.on .main_notice .box .list li:nth-child(4) { animation:ani_3  0.5s 1.2s; animation-fill-mode:forwards; }

@media screen and (max-width:1440px){
	.main_notice .box { padding:0 20px; max-width:auto; }
	.main_notice .box .tit { font-size:36px; }
	.main_notice .box .txt { margin:20px 0 0 0; font-size:16px; line-height:28px; }
	.main_notice .box .list { margin:40px 0 0 -20px; }
	.main_notice .box .list li { width:calc(25% - 20px); margin:0 0 0 20px; }
	.main_notice .box .list li a { height:400px; }
	.main_notice .box .list li .txtbox { padding:20px 15px 0 20px; }
	.main_notice .box .list li .txtbox .type { font-size:15px; }
	.main_notice .box .list li .txtbox .title { margin:12px 0 0 0; font-size:16px; }
	.main_notice .box .list li .txtbox .stxt { margin:5px 0 0 0; font-size:14px; line-height:20px; height:40px; }
	.main_notice .box .list li .txtbox .date { margin:13px 0 0 0; font-size:14px; }
	.main_notice .box .list li .more { top:185px; }
}
@media screen and (max-width:1024px){
	.main_notice .box .list li a { height:300px; }
	.main_notice .box .list li .imgbox { height:150px; }
	.main_notice .box .list li .more { width:140px; height:36px; padding:12px 0 0 20px; } 
	.main_notice .box .list li .more:after { right:15px; }
	.main_notice .box .list li .more { top:125px; }
}
@media screen and (max-width:960px){
	.main_notice { position:relative; top:0; left:0; transform:translateY(0); padding:50px 0 50px 0;}
	.main_notice .box .list li:hover { margin-top:0;}
}
@media screen and (max-width:865px){
	.main_notice .box .list { margin:20px 0 0 -20px; }
	.main_notice .box .list li { width:calc(50% - 20px); margin:20px 0 0 20px; }
	.main_notice .box .list li:hover { margin-top:20px;}
}
@media screen and (max-width:640px){
	.main_notice .box .tit { font-size:30px; }
	.main_notice .box .txt { margin:12px 0 0 0; font-size:14px; line-height:22px; }
	.main_notice .box .list li a { height:260px; }
	.main_notice .box .list li .imgbox { height:120px; }
	.main_notice .box .list li .txtbox { padding:15px 10px 0 15px; }
	.main_notice .box .list li .txtbox .type { font-size:14px; }
	.main_notice .box .list li .txtbox .title { margin:10px 0 0 0; font-size:15px; }
	.main_notice .box .list li .txtbox .stxt { margin:5px 0 0 0; font-size:13px; line-height:18px; height:38px; }
	.main_notice .box .list li .txtbox .date { margin:11px 0 0 0; font-size:13px; }
	.main_notice .box .list li .more { top:95px; }
}
@media screen and (max-width:480px){
	.main_notice .box .list li a { height:280px; }
	.main_notice .box .list li .imgbox { height:140px; }
	.main_notice .box .list { margin:20px 0 0 0; }
	.main_notice .box .list li { width:100%; margin:20px 0 0 0; }
	.main_notice .box .list li .more { top:115px; }
}