@charset "utf-8";

.main,
.main .section { overflow:hidden; }
.main .section > div { padding-top:3%; }
.main .section.main1 > div,
.main .section.main2 > div,
.main .section.main3 > div,
.main .section.main6 > div { padding-top:0; }
@media screen and (max-width:1024px){
    .fp-section {
        pointer-events:auto !important;
        overflow: visible !important;
        height: auto !important;
    }
    html, body {
        overflow: auto !important;
    }
	.section .fp-tableCell,
	.section .fp-scrollable { height:auto !important;; }
	
	.fp-section, .fp-tableCell{height:auto !important;}
	.iScrollIndicator,
	.fp-scrollable { height:100% !important; }
	.main .section.main2 > div,
	.main .section.main4 > div,
	.main .section.main5 > div { padding:100px 0; }
	.fullpage { height:auto !important; overflow:auto !important;}
}
@media screen and (max-width:640px){
	.main .section.main2 > div,
	.main .section.main4 > div,
	.main .section.main5 > div { padding:60px 0; }
}
@media screen and (max-height:760px){
	.section { padding:0; }
	.main .section.main2 > div,
	.main .section.main4 > div,
	.main .section.main5 > div { padding:60px 0; }
}

/* #fp-nav { display:block  !important; } */
#menu { opacity:1; position:fixed; right:80px !important; top:50% !important; margin-top:0 !important;transform:translateY(-50%); width:7px; display:none; justify-content:center; z-index:999; transition:all 0.8s }
#menu li { text-align:center; }
#menu li:not(:last-child) { margin-bottom:24px; }
#menu li a { position:relative; width:7px; height:7px; margin:0 auto; text-indent:-9999em; display:block; }
#menu li a:before { content:""; display:block; width:7px; height:7px; border-radius:7px; background-color:rgba(255, 255, 255, 0.70); transition:all 0.3s }
#menu li a:after { content:""; display:block; opacity:0; transition:all 0.5s; position:absolute; left:50%; top:50%; transform:translate(calc(-50% - 0.5px), calc(-50% - 0.5px)); width:15px; height:18px; background:url(/img/main/fp_icon.png) no-repeat center; }
#menu li.active a:before { opacity:0; }
#menu li.active a:after { opacity:1; }


#visual { position:relative; width:100vw; height:100%; }
#visual .swiper-container { position:relative; width:100%; height:100vh; overflow:hidden; }
#visual .swiper-container .swiper-slide { position:relative; width:100%; height:100vh; overflow:hidden; display:flex; opacity:0 !important; }
#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.3); }
#visual .swiper-container .swiper-slide .mov { position:relative; width:100%; height:100%; overflow:hidden; }
#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 .mvisualImage { position:absolute; left:0; right:0; top:0; bottom:0; background-position:center center; background-repeat:no-repeat; background-size:cover; opacity:0; }
#visual .swiper-container .swiper-slide .txtbox { color:#fff; position:absolute; top:45%; left:0; width:100%; transform:translate(0, -50%); z-index:15; }
#visual .swiper-container .swiper-slide .txtbox .txtCont { max-width:1600px; margin:0 auto; text-align:center }
#visual .swiper-container .swiper-slide .txtbox .logo { overflow:hidden; }
#visual .swiper-container .swiper-slide .txtbox .logo span { display:block; opacity:0; }
#visual .swiper-container .swiper-slide .txtbox .txt { position:relative; overflow:hidden; }
#visual .swiper-container .swiper-slide .txtbox .txt.txt_1 { margin-top:30px; }
#visual .swiper-container .swiper-slide .txtbox .txt > span { display:block; }
#visual .swiper-container .swiper-slide .txtbox .txt > span { opacity:0; font-family:var(--engFont1); font-size:58px; font-weight:700; color:#fff; line-height:1.4; display:inline-block; position:relative; }
#visual .swiper-container .swiper-slide.swiper-slide-active { opacity:1 !important; }
#visual .swiper-container .swiper-slide.swiper-slide-active .txtbox .logo > span { animation:txtUp 0.8s 0.2s; animation-fill-mode:both; }
#visual .swiper-container .swiper-slide.swiper-slide-active .txtbox .txt > span { animation:txtUp 0.8s 0.7s; animation-fill-mode:both; }
#visual .swiper-container .swiper-slide.swiper-slide-active .txtbox .txt.txt_2 > span { animation:txtUp 0.8s 1.0s; animation-fill-mode:both; }
#visual .btn_pn { display:none }

.swiper-button-next:after, 
.swiper-button-prev:after { display:none; }

#visual .swiper-container .control_box { position:absolute; left:50%; transform:translateX(-50%); padding:0; bottom:22%; z-index:5; display:flex; align-items:center; justify-content:center; gap:0 15px; }
#visual .swiper-container .control_box .swiper-btn { position:relative; left:unset; top:unset; right:unset; bottom:unset; margin:0; padding:0; display:inline-block; width:19px; height:19px; background:url(/img/main/swiper_btn.png) no-repeat center center; }
#visual .swiper-container .control_box .swiper-btn.swiper-button-next { transform:rotate(180deg); }
#visual .swiper-container .control_box .swiper-pagination { position:relative; left:unset; top:unset; right:unset; bottom:unset; margin:0; padding:0; display:inline-block; display:flex; align-items:center; gap:0 15px;}
#visual .swiper-container .control_box .swiper-pagination span { position:relative; width:8px; height:8px; opacity:1; background:none; transition:all 0.3s; }
#visual .swiper-container .control_box .swiper-pagination span:before { content:""; display:block; width:6px; height:6px; position:absolute; left:0; top:0; border-radius:100px; border:1px solid #fff; transition:all 0.3s; }
#visual .swiper-container .control_box .swiper-pagination span:after { content:""; display:block; width:0; height:1px; position:absolute; left:20px; top:50%; border-radius:100px; background:#fff; }
#visual .swiper-container .control_box .swiper-pagination .swiper-pagination-bullet-active { width:40px; }
#visual .swiper-container .control_box .swiper-pagination .swiper-pagination-bullet-active:before { background:#fff; }
#visual .swiper-container .control_box .swiper-pagination .swiper-pagination-bullet-active:after { width:20px; animation:ani_w20 1s 0.3s; animation-fill-mode:both;}


#visual .scrollDown { position:absolute; left:50%; bottom:80px; transform:translateX(-50%) rotate(90deg); z-index:11; font-family:var(--mainFont); font-size:14px; font-weight:300; color:rgba(255, 255, 255, 0.20); line-height:1.3; letter-spacing:-0.01em; }
#visual .scrollDown > span > span { font-family:var(--engFont1); font-weight:300; animation: scrollDown 0.8s 1.8s forwards infinite; animation-fill-mode:both; animation-direction:alternate; }
@media screen and (max-width:1800px){
	#visual .swiper-container .swiper-slide .txtbox { padding:0 80px; }
}
@media screen and (max-width:1400px){
	#visual .swiper-container .swiper-slide .txtbox { padding:0 40px; }
	#visual .swiper-container .swiper-slide .txtbox .txt > span { font-size:40px; }
}
@media screen and (max-width:1280px){
	#visual .swiper-container .swiper-slide .txtbox .txt > span { font-size:34px; }
}
@media screen and (max-width:1024px){
	#visual .swiper-container .swiper-slide .txtbox .logo img { width:150px; }
	#visual .swiper-container .swiper-slide .txtbox .txt > span { font-size:28px; }
}
@media screen and (max-width:640px){
	#visual .swiper-container .swiper-slide .txtbox .logo img { width:120px; }
	#visual .swiper-container .swiper-slide .txtbox .txt > span { font-size:20px; }
}

@keyframes scrollDown {
	0% { color:rgba(255, 255, 255, 0.20);  }
	100% { color:#fff;  }
}

.title-box h3,
.title-box h3 span { font-family:var(--engFont2); color:#222; font-size:85px; font-weight:700; line-height:1.3; }
.title-box .txt { margin-top:20px; }
.title-box .txt,
.title-box .txt span { color:#666; font-size:16px; font-weight:500; line-height:1.5; }
.title-box .txt strong { color:var(--mainColor); font-weight:600; }
@media screen and (max-width:1280px){
	.title-box h3 span { font-size:65px; }
	.title-box .txt { margin-top:20px; }
	.title-box .txt span { font-size:16px; }
}
@media screen and (max-width:1024px){
	.title-box h3 span { font-size:48px; }
	.title-box .txt { margin-top:16px; }
	.title-box .txt span { font-size:15px; }
}
@media screen and (max-width:640px){
	.title-box { text-align:center }
	.title-box h3 span { font-size:30px; }
	.title-box .txt { margin-top:12px; }
	.title-box .txt span { font-size:15px; }
}

/* animation */
.title-box h3 { overflow:hidden; }
.title-box h3 > span { opacity:0; display:block; }
.on .title-box h3 > span { animation:ani_3 0.5s 0.1s; animation-fill-mode:both; }
.title-box .txt { overflow:hidden; }
.title-box .txt > span { opacity:0; display:block; }
.on .title-box .txt > span { animation:ani_3 0.5s 0.4s; animation-fill-mode:both; }

.btn-view { display:inline-block }
.btn-view a { display:flex; align-items:center; font-family:var(--engFont1); color:#111; font-size:14px; font-weight:700; line-height:1.3; transition:all 0.3s; }
.btn-view a span { position:relative; margin-left:18px; width:36px; height:36px; display:flex; align-items:center; justify-content:center; }
.btn-view a span img { position:relative; z-index:2 }
.btn-view a span:before { content:""; display:block; position:absolute; left:0; top:50%; transform:translate(0, -50%); background:var(--mainColor); width:4px; height:4px; border-radius:100%; transition:all 0.3s; }
.btn-view a:hover span:before { width:100%; height:100%; }

.main2 { background:url(/img/main/product_bg.png) no-repeat center / cover; }
.main2 .product-box { position:relative; width:100%; }
.main2 .product-box .pdList { position:relative; margin-left:50%; height:100vh; display:flex; }
.main2 .product-box .pdList .l-box { position:absolute; top:22%; right:100%; width:100%; max-width:800px; z-index:2; }
.main2 .product-box .pdList .line { margin:40px 0 35px; display:block; background:#e5e5e5; width:100vw; height:1px; }
.main2 .product-box .pdList .list li { position:relative; cursor:pointer; transition:all 0.3s;  }
.main2 .product-box .pdList .list li:not(:last-child) { margin-bottom:15px; }
.main2 .product-box .pdList .list li a { position:relative; font-family:var(--engFont1); font-size:20px; font-weight:500; color:#333; line-height:1.3; transition:all 0.3s ease-in-out; }
.main2 .product-box .pdList .list li a:before { content:""; display:block; position:absolute; left:0; bottom:-5px; width:calc(100% + 17px); height:0; background:rgba(11, 49, 143, 0.10);  transition:all 0.3s ease-in-out; }
.main2 .product-box .pdList .list li.on a { font-size:30px; font-weight:700; color:var(--mainColor); }
.main2 .product-box .pdList .list li.on a:before { height:20px; }
.main2 .product-box .pdList .r-box { position:relative; padding-top:22%; z-index:5; width:1560px; } 
.main2 .product-box .pdList .slider { position:relative; } 
.main2 .product-box .pdList .slider:before { content:""; display:block; position:absolute; left:0; top:0; z-index:5; width:127px; height:100%; background:linear-gradient(270deg, rgba(255, 255, 255, 0.00) 0%, #FFF 100%); }
.main2 .product-box .pdList .slider .item { position:relative; padding:0 0 0 }
.main2 .product-box .pdList .slider .item h4 { opacity:0; position:absolute; right:0; top:0; text-align:right; font-family:var(--engFont1); font-size:25px; font-weight:700; color:#5e6b8b; line-height:1.3 }
.main2 .product-box .pdList .slider .slick-current .item h4 { animation:ani_1 0.8s 0.3s; animation-fill-mode:both;}
.main2 .product-box .pdList .slider .item .imgbox { transition:all 0.5s; padding-left:0; }
.main2 .product-box .pdList .slider .slick-current .item .imgbox { padding-left:20% }
.main2 .product-box .pdList .slider .btn-view { position:absolute; left:0; bottom:0; transition:all 0.5s; }
.main2 .product-box .pdList .slider .slick-current .btn-view { left:160px; }
.main2 .product-box .pdList .btn_pn { position:absolute; top:calc(22% + 180px); z-index:10; border:1px solid #e5e5e5; background:#fff; width:80px; height:80px; border-radius:80px; display:flex; align-items:center; justify-content:center; }
.main2 .product-box .pdList .btn_pn:before { content:""; display:block; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); background:#fff; border-radius:80px; width:0; height:0; transition:all 0.3s; } 
.main2 .product-box .pdList .btn_pn:hover:before { width:100%; height:100%; background:var(--mainColor);  }
.main2 .product-box .pdList .btn_prev { left:0; }
.main2 .product-box .pdList .btn_next { left:48%; }
.main2 .product-box .pdList .btn_pn i { position:relative; font-size:22px; color:#000; font-weight:400; transition:all 0.2s; }
.main2 .product-box .pdList .btn_pn:hover i { color:#fff; }
@media screen and (max-height:760px){
	.main2,
	.main2 .fp-tableCell,
	.main2 .fp-scrollable,
	.main2 .product-box { height:700px !important; }
}
@media screen and (max-width:1640px){
	.main2 .product-box .pdList .l-box { padding-left:20px; }
	.main2 .product-box .pdList .r-box { padding-top:28%; width:1200px; } 
	.main2 .product-box .pdList .slider .item { padding-top:10%; } 
	.main2 .product-box .pdList .slider .item .imgbox img { width:420px; }
}
@media screen and (max-width:1280px){
	.main2 .product-box .pdList .line { margin:45px 0; }
	.main2 .product-box .pdList .list li:not(:last-child) { margin-bottom:15px; }
	.main2 .product-box .pdList .list li a { font-size:18px; }
	.main2 .product-box .pdList .list li.on a { font-size:26px; }
	.main2 .product-box .pdList .list li.on a:before { height:16px; }
	.main2 .product-box .pdList .r-box { padding-top:30%; width:1000px; }
	.main2 .product-box .pdList .slider .item { padding-top:20%; } 
	.main2 .product-box .pdList .slider .item h4 { font-size:22px; }
	.main2 .product-box .pdList .slider .item .imgbox img { width:360px; }
	.main2 .product-box .pdList .btn_pn { top:calc(22% + 162px); width:70px; height:70px; }
	.main2 .product-box .pdList .btn_next { left:45%; }
}
@media screen and (max-width:1024px){
	.main2 .product-box .pdList { margin-left:0; height:auto; flex-wrap:wrap; }
	.main2 .product-box .pdList .l-box { position:relative; top:unset; right:unset; width:100%; max-width:100%; }
	.main2 .product-box .pdList .line { margin:30px 0; }
	.main2 .product-box .pdList .list ul { display:flex; flex-wrap:wrap; gap:0 20px; }
	.main2 .product-box .pdList .list li { width:calc((100% - 20px) /2 )}
	.main2 .product-box .pdList .list li:not(:last-child) { margin-bottom:12px; }
	.main2 .product-box .pdList .list li a { font-size:15px; }
	.main2 .product-box .pdList .list li.on a { font-size:20px; letter-spacing:-0.06em }
	.main2 .product-box .pdList .list li.on a:before { height:15px; bottom:-2px; width:calc(100% + 10px); }
	.main2 .product-box .pdList .r-box { position:relative; padding-top:0; z-index:5; width:100%; margin-top:30px; }
	.main2 .product-box .pdList .slider { width:100% } 
	.main2 .product-box .pdList .slider .item { padding:60px 20px 20px; width:100%; overflow:hidden; } 
	.main2 .product-box .pdList .slider .item h4 { right:20px; }
	.main2 .product-box .pdList .slider .item h4 br { display:none }
	.main2 .product-box .pdList .slider .item .imgbox { transition:all 0.5s; padding-left:0; }
	.main2 .product-box .pdList .slider .slick-current .item .imgbox { padding-left:0; text-align:center; }
	.main2 .product-box .pdList .slider .item .imgbox { margin-right:-12%; }
	.main2 .product-box .pdList .slider .item .imgbox img { margin:0 auto; }
	.main2 .product-box .pdList .btn_pn { top:50%; transform:translateY(-50%); width:60px; height:60px; }
	.main2 .product-box .pdList .slider .btn-view,
	.main2 .product-box .pdList .slider .slick-current .btn-view { left:50%; transform:translateX(-50%); }
	.main2 .product-box .pdList .btn_next { left:unset; right:0; }
}
@media screen and (max-width:640px){
	.main2,
	.main2 .fp-tableCell,
	.main2 .fp-scrollable,
	.main2 .product-box { height:auto !important; }
	.main2 .product-box .pdList .line { margin:20px 0; }
	.main2 .product-box .pdList .list ul { display:flex; flex-wrap:wrap; gap:0 20px; }
	.main2 .product-box .pdList .list li { width:100%}
	.main2 .product-box .pdList .list li:not(:last-child) { margin-bottom:6px; }
	.main2 .product-box .pdList .list li a { font-size:14px; }
	.main2 .product-box .pdList .list li.on a { font-size:18px; }
	.main2 .product-box .pdList .list li.on a:before { height:10px; bottom:0; width:calc(100% + 5px); }
	.main2 .product-box .pdList .r-box { margin-top:20px; }
	.main2 .product-box .pdList .slider .item h4 { font-size:20px; }
	.main2 .product-box .pdList .slider:before { display:none }
	.main2 .product-box .pdList .slider .item .imgbox { margin-right:-18%; }
	.main2 .product-box .pdList .slider .item .imgbox img { width:280px; }
	.main2 .product-box .pdList .btn_pn { width:50px; height:50px; }
}
@media screen and (max-width:480px){
	.main2 .product-box .pdList .slider .item .imgbox { margin-right:-20%; }
}
@media screen and (max-height:820px){
	.main2 .product-box .pdList .l-box { padding-left:20px; }
	.main2 .product-box .pdList .r-box { padding-top:18%; } 
	.main2 .product-box .pdList .slider .item { padding-top:10%; } 
	.main2 .product-box .pdList .slider .item .imgbox img { width:420px; }
	.main2 .product-box .pdList .line { margin:25px 0; }
	.main2 .product-box .pdList .btn_pn { top:calc(22% + 162px); }
	.main2 .product-box .pdList .list li:not(:last-child) { margin-bottom:10px; }
}

/* animation */
.main2 .product-box .pdList .list li { opacity:0; }
.main2 .product-box.on .pdList .list li:nth-child(1) { animation:ani_2 0.5s 0.3s; animation-fill-mode:both; }
.main2 .product-box.on .pdList .list li:nth-child(2) { animation:ani_2 0.5s 0.5s; animation-fill-mode:both; }
.main2 .product-box.on .pdList .list li:nth-child(3) { animation:ani_2 0.5s 0.7s; animation-fill-mode:both; }
.main2 .product-box.on .pdList .list li:nth-child(4) { animation:ani_2 0.5s 0.9s; animation-fill-mode:both; }
.main2 .product-box.on .pdList .list li:nth-child(5) { animation:ani_2 0.5s 1.1s; animation-fill-mode:both; }
.main2 .product-box.on .pdList .list li:nth-child(6) { animation:ani_2 0.5s 1.3s; animation-fill-mode:both; }
.main2 .product-box.on .pdList .list li:nth-child(7) { animation:ani_2 0.5s 1.5s; animation-fill-mode:both; }
.main2 .product-box.on .pdList .list li:nth-child(8) { animation:ani_2 0.5s 1.7s; animation-fill-mode:both; }
.main2 .product-box.on .pdList .list li:nth-child(9) { animation:ani_2 0.5s 1.9s; animation-fill-mode:both; }
.main2 .product-box .pdList .slider { opacity:0; }
.main2 .product-box.on .pdList .slider { animation:ani_2 0.5s 0.5s; animation-fill-mode:both; }
.main2 .product-box .pdList .btn_pn { opacity:0; }
.main2 .product-box.on .pdList .btn_pn { animation:ani_5 0.5s 0.9s; animation-fill-mode:both; }

.main3 { position:relative; overflow:auto; scrollbar-width:none; }
.main3 .logo { position:absolute; right:57%; bottom:0; margin-right:-176px; }
.main3 .scroll { position:absolute; top:50%; left:43%; transform:translate(-50%, -50%); width:70px; height:70px; border-radius:70px; background:var(--mainColor); z-index:3; display:flex; align-items:center; justify-content:center; }
.main3 .scroll span { position:relative; width:16px; height:26px; border:1px solid #fff; border-radius:10px; }
.main3 .scroll span:before { content:""; display:block; position:absolute; left:50%; top:6px; transform:translateX(-50%); background:#fff; width:4px; height:4px; border-radius:4px; animation:scroll 1.6s infinite; }
.main3 .l-boxddd { position:sticky; }
.main3 .l-box { position:absolute; top:50%; right:57%; transform:translate(0, -50%); width:100%; max-width:500px; z-index:2; margin-right:160px; }
.main3 .l-box .btn-view { margin-top:130px; }
.main3 .history { position:relative; height:100vh; overflow:hidden; overflow-y:auto; z-index:1; }
.main3 .history { scrollbar-width:none; -ms-overflow-style:none; }
.main3 .history::-webkit-scrollbar { display:none; }
.main3 .history .l-boxddd { position:sticky; }
.main3 .history .r-box { position:relative; margin-left:43%; width:57%; }
.main3 .history .r-box li img { height:100%; object-fit:cover; -o-object-fit:cover; }
.main3 .scroll,
.main3 .logo,
.main3 .title-box { pointer-events:none; }
.main3 .title-box h3 span { font-family:var(--engFont1); font-weight:800; }
@media screen and (max-width:1640px){
	.main3 .logo img { height:108px; }
	.main3 .l-box { max-width:100%; right:unset; left:20px; }
}
@media screen and (max-width:1280px){
	.main3 .logo img { width:100%; height:auto; margin-right:0; }
}
@media screen and (max-width:1024px){
	.main3 .l-box { position:relative; top:unset; right:unset; padding-top:100px; transform:translate(0); width:100%; margin-right:0; }
	.main3 .l-box .btn-view { margin-top:60px; }
	.main3 .history { height:50vh; margin-top:30px; }
	.main3 .history .r-box { margin-left:0; width:100%; }
	.main3 .history .r-box li img { width:180%; }
	.main3 .scroll { top:350px; left:50%; transform:translate(-50%, -50%); width:65px; height:65px; }
}
@media screen and (max-width:640px){
	.main3 .l-box { padding-top:60px; left:0; width:100%; }
	.main3 .l-box .btn-view { margin-top:40px; }
	.main3 .l-box .btn-view {display:flex; justify-content:center; }
	.main3 .scroll { top:285px; }
}

@keyframes scroll {
    0% { top:6px; }
    50% { top:calc(100% - 10px); }
    100% { top:6px; }
}
/* animation */
.main3 .l-box .btn-view { opacity:0; }
.main3 .l-box.on .btn-view { animation:ani_3 0.5s 0.8s; animation-fill-mode:both; }

.main4 { background:url(/img/main/information_bg.jpg) no-repeat center / cover;}
.main4 .information { position:relative; overflow:hidden } 
.main4 .information .title-box h3 span { color:#fff }
.main4 .information .title-box .txt span > span{ color:#fff; opacity:0.8 }
.main4 .information .listbox { margin-top:70px; }
.main4 .information .listbox > ul { display:flex; flex-wrap:wrap; gap:30px; }
.main4 .information .listbox > ul > li { position:relative; width:calc((100% - 90px) / 4); overflow:hidden }
.main4 .information .listbox > ul > li:before { content:""; display:block; padding-bottom:110%; }
.main4 .information .listbox > ul > li .box { transition:all 0.3s; position:absolute; left:0; top:0; width:100%; height:100%; border-radius:20px; border:1px solid rgba(255, 255, 255, 0.20); background:rgba(255, 255, 255, 0.03); display:flex; align-items:center; justify-content:center; flex-direction:column; text-align:center; overflow:hidden }
.main4 .information .listbox > ul > li .box dl { position:relative; z-index:5; }
.main4 .information .listbox > ul > li .box dt { margin-top:40px; color:#fff; font-size:28px; font-weight:600; line-height:1.3; }
.main4 .information .listbox > ul > li .box dd { margin-top:14px; color:rgba(255,255,255,0.7); font-size:17px; font-weight:400; line-height:1.3; min-height:45px; }
.main4 .information .listbox > ul > li .box .icon { position:relative; z-index:5; }
.main4 .information .listbox > ul > li .box .icon img { transition:all 0.5s; }
.main4 .information .listbox > ul > li a:hover .box { border:1px solid var(--mainColor); }
.main4 .information .listbox > ul > li .box:before { content:""; display:none; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); background:var(--mainColor); width:0; height:0; border-radius:100%; transition:all 0.3s; }
.main4 .information .listbox > ul > li a:hover .box:before { width:500%; height:500%; }
.main4 .information .listbox > ul > li a:hover .box .icon img { transform:scale(1.05) rotate(-180deg); }
.main4 .information .listbox .circle { position:absolute; width:0; height:0; border-radius:500px; background:var(--mainColor); transition:width 0.8s ease, height 0.8s ease, top 0.8s ease, left 0.8s ease; pointer-events:none; }
@media screen and (max-width:1640px){
	.main4 .information .listbox > ul { gap:20px; }
	.main4 .information .listbox > ul > li { width:calc((100% - 60px) / 4); } 
	.main4 .information .listbox > ul > li .box dt { margin-top:20px; font-size:26px; }
	.main4 .information .listbox > ul > li .box dd { margin-top:14px; font-size:17px; min-height:42px; }
	.main4 .information .listbox > ul > li .box .icon img { width:80% }
}
@media screen and (max-width:1280px){
	.main4 .information .listbox > ul > li .box dt { margin-top:15px; font-size:20px; }
	.main4 .information .listbox > ul > li .box dd { margin-top:10px; font-size:15px; min-height:34px; }
	.main4 .information .listbox > ul > li .box .icon img { width:60% }
}
@media screen and (max-width:1024px){
	.main4 .information .listbox { margin-top:50px; }
	.main4 .information .listbox > ul { gap:20px; }
	.main4 .information .listbox > ul > li:before { padding-bottom:80%; }
	.main4 .information .listbox > ul > li { width:calc((100% - 20px) / 2); } 
	.main4 .information .listbox > ul > li .box { border-radius:10px; }
}
@media screen and (max-width:640px){
	.main4 .information .listbox { margin-top:30px; }
	.main4 .information .listbox > ul { gap:10px; }
	.main4 .information .listbox > ul > li:before { padding-bottom:110%; }
	.main4 .information .listbox > ul > li { width:calc((100% - 10px) / 2); } 
	.main4 .information .listbox > ul > li .box dt { margin-top:15px; font-size:18px; }
	.main4 .information .listbox > ul > li .box dd { margin-top:10px; font-size:15px; min-height:34px; }
	.main4 .information .listbox > ul > li .box .icon img { width:40% }
}
@media screen and (max-width:520px){
	.main4 .information .listbox > ul > li:before { padding-bottom:130%; }
}

/* animation */
.main4 .information .listbox > ul > li { opacity:0; }
.main4 .information.on .listbox > ul > li:nth-child(1) { animation:ani_3 0.5s 0.6s; animation-fill-mode:both; }
.main4 .information.on .listbox > ul > li:nth-child(2) { animation:ani_3 0.5s 0.8s; animation-fill-mode:both; }
.main4 .information.on .listbox > ul > li:nth-child(3) { animation:ani_3 0.5s 1.0s; animation-fill-mode:both; }
.main4 .information.on .listbox > ul > li:nth-child(4) { animation:ani_3 0.5s 1.2s; animation-fill-mode:both; }
.main4 .information.on .listbox > ul > li:nth-child(5) { animation:ani_3 0.5s 1.4s; animation-fill-mode:both; }


.main5 .newsroom { position:relative; overflow:hidden } 
.main5 .newsroom .title-box { }
.main5 .newsroom .listCont { margin-top:60px; }
.main5 .newsroom .listCont .nav { position:absolute; right:0; top:30px; display:flex; }
.main5 .newsroom .listCont .nav > li { position:relative; width:140px; }
.main5 .newsroom .listCont .nav > li:before { content:""; display:block; position:absolute; left:0; top:50%; transform:translateY(-50%); width:2px; height:15px; background:#e7e7e7; }
.main5 .newsroom .listCont .nav > li:last-child:after { content:""; display:block; position:absolute; right:0; top:50%; transform:translateY(-50%); width:2px; height:15px; background:#e7e7e7; }
.main5 .newsroom .listCont .nav > li a { display:flex; align-items:center; justify-content:center; text-align:center; font-family:var(--engFont3); color:#666; font-size:18px; font-weight:400; line-height:1.3; transition:all 0.3s; }
.main5 .newsroom .listCont .nav > li:nth-child(2) a { font-family:var(--engFont2); }
.main5 .newsroom .listCont .nav > li.active a { color:var(--mainColor); font-weight:700; }
.main5 .newsroom .listCont .listbox { position:relative; }
.main5 .newsroom .listCont .listbox .list { display:none; }
.main5 .newsroom .listCont .slider { overflow:hidden; }
.main5 .newsroom .listCont .listbox .swiper-slide { position:relative; width:calc((100% - 120px) / 3); }
.main5 .newsroom .listCont .listbox .swiper-slide .txtbox { padding-top:30px; }
.main5 .newsroom .listCont .listbox .swiper-slide .txtbox .tit { color:#222; font-size:24px; font-weight:700; line-height:1.5; text-overflow:ellipsis; overflow:hidden; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; }
.main5 .newsroom .listCont .listbox .swiper-slide .txtbox .txt { min-height:55px; margin-top:15px; color:#666; font-size:17px; font-weight:400; line-height:1.6; text-overflow:ellipsis; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.main5 .newsroom .listCont .listbox .swiper-slide .txtbox .date { position:relative; margin-top:40px; padding-top:25px; color:#666; font-size:16px; font-weight:300; line-height:1.3; text-align:right; border-top:1px solid #eee }
.main5 .newsroom .listCont .listbox .swiper-slide .txtbox .date:before { content:""; display:block;  position:absolute; left:50%; top:0; transform:translateX(-50%); width:0; height:1px; background:var(--mainColor); transition:all 0.3s; } 
.main5 .newsroom .listCont .listbox .swiper-slide:hover .txtbox .date:before { width:100%; }
.main5 .newsroom .listCont .listbox .swiper-slide .imgbox { position:relative; overflow:hidden; border-radius:15px; }
.main5 .newsroom .listCont .listbox .swiper-slide .imgbox:before { content:""; display:block; padding-bottom:57%; transition:all 0.3s; }
.main5 .newsroom .listCont .listbox .swiper-slide .imgbox img { transform:scale(1.00); transition:all 0.3s; position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; -o-object-fit:cover; }
.main5 .newsroom .listCont .listbox .swiper-slide:hover .imgbox img { transform:scale(1.05); }
.main5 .newsroom .listCont .listbox .list .btn { display:none }
.main5 .newsroom .listCont .listbox .list .btn_prev,
.main5 .newsroom .listCont .listbox .list .btn_next { background:rgba(71, 116, 185, 0.30) url(/img/main/btn_arr3.svg) center center no-repeat; cursor:pointer; }
.main5 .newsroom .listCont .listbox .list .btn_next { transform:rotateY(180deg); }
.main5 .newsroom .listCont .listbox .list .btn_prev { left:30%; }
.main5 .newsroom .listCont .listbox .list .btn_next { right:30%; transform:translateY(-50%) rotateY(180deg);  }
.main5 .newsroom .listCont .listbox .list .swiper-pagination-c { display:none; position:absolute; left:0; top:unset; bottom:0; width:100%; z-index:40; height:2px; background:rgba(238, 238, 238, 1); }
.main5 .newsroom .listCont .listbox .list .swiper-pagination-c .swiper-pagination-progressbar-fill { background:var(--mainColor); }
.main5 .newsroom .customer-btxt { position:absolute; left:0; bottom:-4px; white-space:nowrap; z-index:2; display:flex; overflow:hidden; }
.main5 .newsroom .customer-btxt span img { display:inline-block; margin-right:50px; }
@media screen and (max-width:1024px){
	.main5 .newsroom .listCont { margin-top:40px; }
	.main5 .newsroom .listCont .nav > li { width:110px; }
	.main5 .newsroom .listCont .slider { padding-bottom:30px; }
	.main5 .newsroom .listCont .listbox .swiper-slide .imgbox { border-radius:8px; }
	.main5 .newsroom .listCont .listbox .swiper-slide .txtbox { padding-top:20px; }
	.main5 .newsroom .listCont .listbox .swiper-slide .txtbox .tit { font-size:20px; }
	.main5 .newsroom .listCont .listbox .swiper-slide .txtbox .txt { min-height:50px; margin-top:12px; font-size:16px; }
	.main5 .newsroom .listCont .listbox .swiper-slide .txtbox .date { margin-top:35px; padding-top:25px; font-size:15px; }
	.main5 .newsroom .listCont .listbox .list .swiper-pagination-c { display:block; } 
}
@media screen and (max-width:640px){
	.main5 .newsroom .listCont { margin-top:20px; }
	.main5 .newsroom .listCont .nav { position:relative; right:unset; top:unset; display:flex; justify-content:center; }
	.main5 .newsroom .listCont .nav > li { width:100px; }
	.main5 .newsroom .listCont .nav > li a { font-size:16px; }
	.main5 .newsroom .listCont .slider { margin-top:20px; padding-bottom:20px; }
	.main5 .newsroom .listCont .listbox .swiper-slide .txtbox { padding-top:15px; }
	.main5 .newsroom .listCont .listbox .swiper-slide .txtbox .tit { font-size:18px; }
	.main5 .newsroom .listCont .listbox .swiper-slide .txtbox .txt { margin-top:10px; }
	.main5 .newsroom .listCont .listbox .swiper-slide .txtbox .date { margin-top:30px; padding-top:20px; font-size:14px; }
}

/* animation */
.main5 .newsroom .listCont .nav { opacity:0; }
.main5 .newsroom.on .listCont .nav { animation:ani_2 0.5s 0.3s; animation-fill-mode:both; }
.main5 .newsroom .listCont .listbox { opacity:0; }
.main5 .newsroom.on .listCont .listbox { animation:ani_3 0.5s 0.5s; animation-fill-mode:both; }

@keyframes marquee {
  0% { transform: translate3d(0, 0, 0); }
  100% { transform: translate3d(-100%, 0, 0); }			
}