@charset "utf-8";

.main,
.main .section { overflow:hidden }
@media screen and (max-width:1024px){
	.section .fp-tableCell,
	.section .fp-scrollable { height:auto !important; height:-webkit-fill-available !important; }
	
	.fp-section, .fp-tableCell{height:auto !important;}
	.iScrollIndicator,
	.fp-scrollable { height:100% !important; height:-webkit-fill-available !important; }
	.iScrollVerticalScrollbar { display:none !important; } 

    #fullpage { overflow:hidden }
}
@media screen and (max-width:1024px){
	.section { padding:60px 0; }
    .section.fp-auto-height { padding:0; }
}
@media screen and (max-width:640px){
	.section { padding:40px 0; }
}
@media screen and (max-height:760px){
	.section { padding:40px 0; }
}

.section { position:relative; }
.section:before { content:""; display:block; width:1px; height:100%; position:absolute; left:100px; top:100px; background-color:rgba(235, 235, 235, 1); }
.section.main3:before { background:rgba(255, 255, 255, 0.10); }
.section.main5:before { display:none }

@media screen and (max-width:1850px){
    .section .inner1600 { padding:0 7%; }
}
@media screen and (max-width:1500px){
    .section:before { left:80px; }
    .section .inner1600 { padding:0 10%; }
}
@media screen and (max-width:1024px){
    .section:before { display:none }
    .section .inner1600 { padding:0 20px; }
}


/* #fp-nav { display:block !important; } */
#menu { opacity:1; position:fixed; left:46px !important; top:50% !important; margin-top:0 !important;transform:translateY(-50%); width:7px; display:flex; justify-content:center; z-index:999; transition:all 0.8s }
#menu li { text-align:center; }
#menu li:not(:last-child) { margin-bottom:40px; }
#menu li a { position:relative; width:8px; height:8px; margin:0 auto; text-indent:-9999em; display:block; }
#menu li a:before { content:""; display:block; width:8px; height:8px; border-radius:8px; background-color:#ddd; 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(-50%, -50%); width:26px; height:26px; border:1px solid var(--mainColor); border-radius:26px; }
#menu li.active a:before { background-color:var(--mainColor);  }
#menu li.active a:after { opacity:1; }
@media screen and (max-width:1500px){
    #menu { left:38px !important; }
}
@media screen and (max-width:1024px){
    #menu { display:none }
}

.main1 { position:relative; background:url(/img/main/visual_bg.jpg) no-repeat right center / cover; overflow:hidden }
#visual { position:relative; width:100vw; height:100%; }
#visual .swiper-container { position:relative; width:100%; height:100%; overflow:hidden; }
#visual .swiper-container .swiper-slide { position:relative; width:100%; height:100vh; overflow:hidden; display:flex; align-items:flex-end; opacity:0; }
#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 .imgbox { opacity:0; }
#visual .swiper-container .swiper-slide .txtbox { color:#fff; position:absolute; top:50%; left:50%; width:50%; transform:translate(0, -50%); z-index:15; }
#visual .swiper-container .swiper-slide .txtbox .txt { position:relative; }
#visual .swiper-container .swiper-slide .txtbox .txt > div { overflow:hidden; display:inline-block; }
#visual .swiper-container .swiper-slide .txtbox .txt > div span { opacity:0; font-size:34px; font-weight:500; color:#111; line-height:1.3;letter-spacing:-0.02em; display:inline-block; position:relative; }
#visual .swiper-container .swiper-slide .txtbox .txt_1 { margin-bottom:30px; overflow:hidden; }
#visual .swiper-container .swiper-slide .txtbox .txt_2 img { width:577px; }
#visual .swiper-container .swiper-slide.swiper-slide-active { opacity:1; }
#visual .swiper-container .swiper-slide.swiper-slide-active .imgbox { animation:bgs5_1 2.0s 0.5s; animation-fill-mode:both; }
#visual .swiper-container .swiper-slide.swiper-slide-active .txtbox .txt > div span { animation:txtLeft 1.5s 1.0s; animation-fill-mode:both; }
#visual .swiper-container .swiper-slide.swiper-slide-active .txtbox .txt.txt_2 > div span { animation:txtLeft 1.5s 1.5s; animation-fill-mode:both; }
#visual .btn_pn { display:none }
#visual .control_box { position:absolute; left:50%; bottom:30%; z-index:10; padding:9px 35px; width:160px; font-family:var(--mainFont); font-size:18px; color:rgba(51, 51, 51, 0.30);  }
#visual .control_box .txt { position:absolute; top:0; left:0; font-family:var(--mainFont); color:#333; font-size:15px; font-weight:600; line-height:1.3; letter-spacing:-0.02em; }
#visual .control_box .txt span { font-family:var(--mainFont); font-weight:600; }
#visual .control_box .total { left:unset; right:0; }
#visual .control_box .swiper-btn { display:none; }
#visual .control_box .swiper-pagination-progressbar { position:relative; background:rgba(0,0,0,0.1); height:1px; width:100%; }
#visual .control_box .swiper-pagination-progressbar .swiper-pagination-progressbar-fill { background:#111; }

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

#visual .scrollDown { position:absolute; left:50%; bottom:50px; transform:translateX(-50%); z-index:11; font-family:var(--mainFont); font-size:14px; font-weight:700; color:#222; line-height:1.3; letter-spacing:-0.01em; }
#visual .scrollDown > span > span { font-family:var(--mainFont); font-weight:300; animation:scrollDown 0.8s 1.5s forwards infinite; animation-fill-mode:both; animation-direction:alternate; }
#visual .scrollDown:before { content:""; display:block; width:12px; height:7px; position:absolute; top:30px; left:50%; transform:translateX(-50%); background:url(/img/main/scroll_arr.png) no-repeat center; animation:scroll_arr 0.8s 0.1s forwards infinite; animation-fill-mode:both; animation-direction:alternate; }
@media screen and (max-width:1500px){
    #visual .swiper-container .swiper-slide .imgbox img { width:90%; }
    #visual .swiper-container .swiper-slide .txtbox .txt > div span { font-size:30px; }
    #visual .swiper-container .swiper-slide .txtbox .txt_2 img { width:480px; }
}
@media screen and (max-width:1280px){
    #visual .swiper-container .swiper-slide .imgbox img { width:90%; }
    #visual .swiper-container .swiper-slide .txtbox .txt > div span { font-size:24px; }
    #visual .swiper-container .swiper-slide .txtbox .txt_1 { margin-bottom:20px; }
    #visual .swiper-container .swiper-slide .txtbox .txt_2 img { width:380px; }
}
@media screen and (max-width:1024px){
    .main1 { padding:0;}
    #visual .swiper-container .swiper-slide  { align-items:flex-start; }
    #visual .swiper-container .swiper-slide .imgbox img { width:860px; }
    #visual .swiper-container .swiper-slide .txtbox  { left:unset; right:0; top:280px; width:auto; transform:translate(0, 0); }
    #visual .swiper-container .swiper-slide .txtbox .txt > div span { font-size:20px; }
    #visual .swiper-container .swiper-slide .txtbox .txt_1 { margin-bottom:15px; }
    #visual .swiper-container .swiper-slide .txtbox .txt_2 img { width:280px; }
    #visual .control_box { bottom:120px; width:140px; transform:translateX(-50%); }
    #visual .scrollDown { bottom:40px; }
}
@media screen and (max-width:760px){
    #visual .swiper-container .swiper-slide { flex-direction:column; justify-content:center;}
    #visual .swiper-container .swiper-slide .imgbox img { width:580px; }
    #visual .swiper-container .swiper-slide .txtbox  { left:unset; right:unset; top:unset; position:relative; width:100%; padding-top:50px; padding-left:20px; }
    #visual .swiper-container .swiper-slide .txtbox .txt > div span { font-size:18px; }
    #visual .swiper-container .swiper-slide .txtbox .txt_1 { margin-bottom:15px; }
    #visual .swiper-container .swiper-slide .txtbox .txt_2 img { width:220px; }
    #visual .control_box { bottom:80px; width:140px; transform:translateX(-50%); }
    #visual .scrollDown { bottom:40px; }
}
@media screen and (max-width:580px){
    #visual .swiper-container .swiper-slide .imgbox img { width:540px; }
}
@media screen and (max-width:480px){
    #visual .swiper-container .swiper-slide .imgbox img { width:480px; }
    #visual .swiper-container .swiper-slide .txtbox { padding-top:30px; }
    #visual .swiper-container .swiper-slide .txtbox .txt > div span { font-size:16px; }
    #visual .swiper-container .swiper-slide .txtbox .txt_1 { margin-bottom:12px; }
    #visual .swiper-container .swiper-slide .txtbox .txt_2 img { width:200px; }
}

@keyframes scrollDown {
	0% { color:#222;  }
	100% { color:#222;  }
}
@keyframes scroll_arr {
	0% { top:30px; }
	100% { top:40px; }
}


/* animation */
.main .news-box .listbox .list li { opacity:0; }
.main .news-box .listbox .list .tabCont.on li:nth-child(1) { animation:ani_2 0.5s 0.3s; animation-fill-mode:both; }
.main .news-box .listbox .list .tabCont.on li:nth-child(2) { animation:ani_2 0.5s 0.5s; animation-fill-mode:both; }
.main .news-box .listbox .list .tabCont.on li:nth-child(3) { animation:ani_2 0.5s 0.7s; animation-fill-mode:both; }
.main .news-box .listbox .list .tabCont.on li:nth-child(4) { animation:ani_2 0.5s 0.9s; animation-fill-mode:both; }
.main .news-box .listbox .list .tabCont.on li:nth-child(5) { animation:ani_2 0.5s 1.1s; animation-fill-mode:both; }


.main .topTitle h3 { font-family:var(--mainFont); color:#111; font-size:64px; font-weight:700; line-height:1.3; letter-spacing:-0.02em; }
@media screen and (max-width:1500px){
    .main .topTitle h3 { font-size:52px; }
}
@media screen and (max-width:1280px){
    .main .topTitle h3 { font-size:42px; }
}
@media screen and (max-width:1024px){
    .main .topTitle h3 { font-size:38px; }
}
@media screen and (max-width:640px){
    .main .topTitle h3 { font-size:28px; }
}

/* animation */
.main .topTitle h3 { overflow:hidden; }
.main .topTitle h3 span { opacity:0; display:inline-block; }
.main .aniBox.on .topTitle h3 span { animation:ani_2 0.8s 0.1s; animation-fill-mode:both; }


.main2 { position:relative; }
.main2 .p_title h3 { font-family:var(--mainFont); color:#111; font-size:35px; font-weight:800; line-height:1.2; }
.main2 .p_title { position:absolute; top:180px; left:0; z-index:5;}
.main2 .products-list { width:100%; max-width:1920px; margin:0 auto; }
.main2 .products-list .swiper-container { position:relative; width:100%; }
.main2 .products-list .swiper-container:before { content:""; display:block; width:791px; height:937px; position:absolute; right:0; top:0; background:url(/img/main/products_bg.png) no-repeat center / cover; }
.main2 .products-list .swiper-slide { position:relative; z-index:1; width:100%; opacity:1;}
.main2 .products-list .swiper-slide.swiper-slide-prev { opacity:0 !important; }
.main2 .products-list .swiper-slide .box { display:flex; align-items:center; height:100vh; }
.main2 .products-list .txtbox { position:absolute; top:50%; left:0; transform:translateY(-50%); width:70%; display:block; opacity:0; z-index:10; }
.main2 .products-list .swiper-slide.swiper-slide-active .txtbox { opacity:1 }
.main2 .products-list .txtbox dt { font-size:65px; font-weight:800; line-height:1.2; color:#262626; display:flex; align-items:center; }
.main2 .products-list .txtbox dt img { margin-right:15px; margin-top:8px; width:320px; vertical-align:middle }
.main2 .products-list .txtbox dd { margin-top:20px; color:#333; font-size:20px; font-weight:400; line-height:1.5; letter-spacing:-0.02em; }
.main2 .products-list .swiper-slide .txtbox { display:none; width:48%; }
.main2 .products-list .swiper-slide .imgbox { position:absolute; left:unset; right:-15%; top:50%; transform:translateY(-50%) scale(0.5); opacity:0.2; z-index:5; }
.main2 .products-list .swiper-slide .imgbox .i-img { position:relative; z-index:5; opacity:0; }
.main2 .products-list .swiper-slide.swiper-slide-prev .imgbox .i-img,
.main2 .products-list .swiper-slide.swiper-slide-next .imgbox .i-img { animation:bgs3 0.8s 0.8s; animation-fill-mode:both; }
.main2 .products-list .swiper-slide .imgbox .txt { display:none; }
.main2 .products-list .swiper-slide.swiper-slide-active { display:flex; z-index:10; }
.main2 .products-list .swiper-slide.swiper-slide-active .bg { opacity:1; }
.main2 .products-list .swiper-slide.swiper-slide-active .txtbox { display:block }
.main2 .products-list .swiper-slide.swiper-slide-active .txtbox dt { animation:ani_2 0.7s 0.7s; animation-fill-mode:both; }
.main2 .products-list .swiper-slide.swiper-slide-active .txtbox dd { animation:ani_2 0.7s 0.9s; animation-fill-mode:both; }
.main2 .products-list .swiper-slide.swiper-slide-active .imgbox { position:absolute; top:50%; left:40%; transform:translateY(-50%); opacity:1; z-index:2 }
.main2 .products-list .swiper-slide.swiper-slide-active .imgbox .i-img { animation:ani_2 0.7s 0.6s; animation-fill-mode:both; }
.main2 .products-list .swiper-slide.swiper-slide-active .imgbox .txt { position:absolute; left:-100px; top:0; font-size:200px; font-weight:900; color:#f4f4f4; line-height:1.0; display:block; opacity:0; }
.main2 .products-list .swiper-slide.swiper-slide-active .imgbox .txt { animation:bgs3 1.0s 0.8s; animation-fill-mode:both; }
.main2 .control_box { display:none }
.main2 .products-list .list { position:absolute; bottom:180px; left:0; z-index:5; }
.main2 .products-list .list ul { display:flex; }
.main2 .products-list .list li:not(:last-child) { margin-right:10px; }
.main2 .products-list .list li a { transition:all 0.3s ease-in-out; font-family:var(--mainFont); color:var(--mainColor); font-weight:600; font-size:15px; line-height:1.3; height:43px; padding:0 20px; display:flex; justify-content:center; align-items:center; border-radius:50px; background:#f8f8f8; }
.main2 .products-list .list li.on a { color:#fff; background:var(--mainColor); }
@media screen and (max-width:1850px){
    .main2 .p_title { left:7%; }
    .main2 .products-list { padding:0 0 0 7%; }
    .main2 .products-list .swiper-slide .imgbox { right:-20%; transform:translateY(-50%) scale(0.40); }
    .main2 .products-list .swiper-slide.swiper-slide-active .imgbox { transform:translateY(-50%) scale(0.9); }
}
@media screen and (max-width:1720px){
    .main2 .products-list .swiper-slide.swiper-slide-prev .imgbox,
    .main2 .products-list .swiper-slide.swiper-slide-next .imgbox { display:none }
}
@media screen and (max-width:1500px){
    .main2 .p_title { left:10%; }
    .main2 .p_title h3 { font-size:30px; }
    .main2 .products-list { padding:0 0 0 10%; }
    .main2 .products-list .txtbox dt { font-size:48px; }
    .main2 .products-list .txtbox dt img { margin-right:10px; margin-top:6px; width:240px; }
    .main2 .products-list .swiper-slide.swiper-slide-active .imgbox { left:35%; }
    .main2 .products-list .swiper-slide.swiper-slide-active .imgbox .txt { left:-80px; font-size:180px; }
    .main2 .products-list .swiper-slide .txtbox { width:45%; }
}
@media screen and (max-width:1280px){
    .main2 .products-list .swiper-slide.swiper-slide-active .imgbox { left:30%; transform:translateY(-50%) scale(0.7); }
    .main2 .products-list .swiper-slide.swiper-slide-active .imgbox .txt { left:-50px; font-size:160px; }
    .main2 .products-list .txtbox dt { font-size:38px; }
    .main2 .products-list .txtbox dt img { margin-right:10px; width:200px; }
    .main2 .products-list .txtbox dd { margin-top:15px; font-size:19px; }
    .main2 .products-list .list li:not(:last-child) { margin-right:8px; }
    .main2 .products-list .list li a { font-size:15px; line-height:1.3; height:43px; padding:0 18px; }
}
@media screen and (max-width:1024px){
    .main2 .p_title h3 { font-size:26px; }
    .main2 { background:url(/img/main/products_bg.png) no-repeat 120% top; background-size:500px auto }
    .main2 .p_title { position:relative; top:unset; left:unset; font-size:22px; }
    .main2 .p_title br { display:none }
    .main2 .products-list { padding:0; }
    .main2 .products-list .swiper-container,
    .main2 .products-list .swiper-wrapper { height:auto; }
    .main2 .products-list .swiper-container:before { display:none }
    .main2 .products-list .swiper-slide { flex-wrap:wrap; align-items:center; flex-direction:column-reverse; justify-content:flex-end; height:auto; }
    .main2 .products-list .swiper-slide .box { height:auto; width:100%; padding:0 20px; }
    .main2 .products-list .swiper-slide .imgbox { position:relative; left:unset; right:unset; top:unset; transform:translateY(0) scale(1); }
    .main2 .products-list .swiper-slide.swiper-slide-active .imgbox { position:relative; top:unset; left:unset; transform:translateY(0) scale(1); width:100%; } 
    .main2 .products-list .swiper-slide.swiper-slide-active .imgbox .i-img { padding-left:20%; }
    .main2 .products-list .swiper-slide.swiper-slide-active .imgbox .i-img img { width:100%; max-width:640px; }
    .main2 .products-list .swiper-slide.swiper-slide-active .imgbox .txt { left:20px; font-size:140px; }
    .main2 .products-list .swiper-slide .txtbox { width:100%; }
    .main2 .products-list .txtbox { position:relative; top:unset; left:unset; right:unset; transform:translateY(0); width:100%; padding-top:80px; }
    .main2 .products-list .txtbox dd { margin-top:15px; font-size:18px; }
    .main2 .products-list .txtbox dd br { display:none }
    .main2 .products-list .list { left:unset; bottom:unset; bottom:unset; position:relative; text-align:center; padding:0 0 30px; }
    .main2 .products-list .list ul { justify-content:center; }
    .main2 .products-list .list li:not(:last-child) { margin-right:8px; }
    .main2 .products-list .list li a { font-size:15px; line-height:1.3; height:43px; padding:0 18px; white-space:nowrap; }
}
@media screen and (max-width:640px){
    .main2 { background:url(/img/main/products_bg.png) no-repeat 130% top; background-size:290px auto }
    .main2 .products-list .swiper-slide { height:560px; }
    .main2 .products-list .swiper-slide.swiper-slide-active .imgbox .i-img { padding-left:15%; }
    .main2 .products-list .swiper-slide.swiper-slide-active .imgbox .txt { font-size:70px; }
    .main2 .products-list .txtbox { padding-top:60px; }
    .main2 .products-list .txtbox dt { font-size:28px; }
    .main2 .products-list .txtbox dt img { margin-right:8px; margin-top:4px; width:150px; }
    .main2 .products-list .txtbox dd { margin-top:12px; font-size:17px; }
    .main2 .products-list .list li:not(:last-child) { margin-right:5px; }
    .main2 .products-list .list li a { font-size:14px; height:40px; padding:0 15px; }
    .main2 .control_box { display:block; width:100%; }
    .main2 .control_box .swiper-pagination-p { display:none }
    .main2 .control_box .swiper-btn { cursor:pointer; display:block; position:absolute; z-index:5; width:30px; height:35px; top:40%; background:rgba(0,0,0,0.2) url(/img/main/swiper-btn1.png) no-repeat center; }
    .main2 .control_box .swiper-button-next-p { right:0; transform:rotate(180deg); }
    .main2 .control_box .swiper-button-prev-p { left:0; }
}
@media screen and (max-width:580px){
    .main2 .products-list .swiper-slide { height:520px; }
}
@media screen and (max-width:520px){
    .main2 .products-list .swiper-slide { height:500px; }
}
@media screen and (max-width:480px){
    .main2 .products-list .swiper-slide { height:470px; }
}
@media screen and (max-width:420px){
    .main2 .products-list .swiper-slide { height:460px; }
}

/* animation */
.main .p_title h3 { overflow:hidden; }
.main .p_title h3 span { opacity:0; display:inline-block; }
.main .aniBox.on .p_title h3 span { animation:ani_2 0.5s 0.01s; animation-fill-mode:both; }


.main3 { position:relative; padding-top:40px; background:url(/img/main/resources_bg.jpg) no-repeat center / cover; overflow:hidden }
.main3 .topTitle h3 { color:#fff }
.main3 .topTitle h3 a.btn { display:inline-block; margin:-2px 0 0 10px; }
.main3 .topTitle h3 a.btn img { vertical-align:middle; transition:all 0.5s;  }
.main3 .topTitle h3 a.btn:hover img { transform:rotate(180deg); transform-origin:50% 50%; }
.main3 .resources-box { margin-top:80px; }
.main3 .resources-box .swiper-container { position:relative; width:100%; overflow:hidden; }
.main3 .resources-box .swiper-container .swiper-slide { position:relative; display:flex; }
.main3 .resources-box .swiper-container .swiper-slide .box { position:relative; overflow:hidden; transition:all 0.3s ease-in-out; width:100%; height:385px; padding:60px 40px; border-radius:20px; border:1px solid rgba(255, 255, 255, 0.10); background:rgba(255, 255, 255, 0.05); backdrop-filter:blur(5px); }
.main3 .resources-box .swiper-container .swiper-slide .box .bg { position:absolute; opacity:0; left:0; top:0; width:100%; height:100%; background-position:center center; background-repeat:no-repeat; background-size:cover; transform:scale(1.1);}
.main3 .resources-box .swiper-container .swiper-slide .box .txtbox { position:relative; z-index:3 }
.main3 .resources-box .swiper-container .swiper-slide .box dl { position:relative; z-index:2; }
.main3 .resources-box .swiper-container .swiper-slide .box h4 { font-family:var(--mainFont); color:var(--mainColor); font-size:18px; font-weight:600; line-height:1.3; letter-spacing:-0.02em; }
.main3 .resources-box .swiper-container .swiper-slide .box dt { margin-top:10px; color:#fff; font-size:22px; font-weight:500; line-height:1.4; letter-spacing:-0.02em; min-height:62px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.main3 .resources-box .swiper-container .swiper-slide .box dd { margin-top:40px; color:rgba(255, 255, 255, 0.80); font-size:16px; font-weight:400; line-height:1.4; letter-spacing:-0.02em; min-height:70px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; }
.main3 .resources-box .swiper-container .swiper-slide .box .date { margin-top:40px; color:#ccc; font-size:16px; font-weight:700; line-height:1.4; letter-spacing:-0.02em; }
.main3 .resources-box .swiper-container .swiper-slide:hover .box .bg { animation:bgs 0.8s 0.1s; animation-fill-mode:both; }
.main3 .resources-box .control_box { position:relative; padding:0 50px 20px 0; margin-top:50px; }
.main3 .resources-box .control_box .swiper-btn { cursor:pointer; display:block; width:20px; height:30px; position:absolute; top:-15px; right:22px; background:url(/img/main/swiper-btn.png) no-repeat center; }
.main3 .resources-box .control_box .swiper-button-next-n { right:0px; transform:rotate(180deg);}
.main3 .resources-box .swiper-pagination-progressbar { position:relative; background:rgba(255,255,255,0.2); height:2px; width:100%; }
.main3 .resources-box .swiper-pagination-progressbar .swiper-pagination-progressbar-fill { background:var(--mainColor); }
@media screen and (max-width:1280px){
    .main3 .resources-box { margin-top:40px; }
    .main3 .resources-box .swiper-container .swiper-slide .box { height:346px; padding:50px 30px; }
    .main3 .resources-box .swiper-container .swiper-slide .box h4 { font-size:17px; }
    .main3 .resources-box .swiper-container .swiper-slide .box dt { margin-top:8px; font-size:20px; min-height:58px; }
    .main3 .resources-box .swiper-container .swiper-slide .box dd { margin-top:30px; font-size:15px; min-height:66px; }
    .main3 .resources-box .swiper-container .swiper-slide .box .date { margin-top:30px; font-size:15px; }
}
@media screen and (max-width:1024px){
    .main3 .resources-box { margin-top:20px; }
    .main3 .topTitle h3 a.btn img { width:50px; }
    .main3 .resources-box .swiper-container .swiper-slide .box { height:300px; padding:40px 20px; }
    .main3 .resources-box .swiper-container .swiper-slide .box h4 { font-size:15px; }
    .main3 .resources-box .swiper-container .swiper-slide .box dt { margin-top:8px; font-size:20px; min-height:54px; }
    .main3 .resources-box .swiper-container .swiper-slide .box dd { margin-top:25px; font-size:14px; min-height:60px; }
    .main3 .resources-box .swiper-container .swiper-slide .box .date { margin-top:25px; font-size:14px; }
    .main3 .resources-box .swiper-container .swiper-slide.swiper-slide-active .box .bg { animation:bgs 0.8s 0.1s; animation-fill-mode:both; }
    .main3 .resources-box .control_box {  margin-top:40px; }
}
@media screen and (max-width:640px){
    .main3 .inner1600 { padding:0; }
    .main3 .topTitle { padding-left:20px; }
    .main3 .topTitle h3 a.btn img { width:40px; }
    .main3 .resources-box .re-box { padding:0 20px; overflow:hidden }
    .main3 .resources-box .swiper-container .swiper-slide .box { height:330px; padding:40px 15px; }
    .main3 .resources-box .swiper-container .control_box { margin-top:20px; }
    .main3 .resources-box .swiper-container .swiper-slide .box dt { -webkit-line-clamp:3; font-size:18px; min-height:85px; }
    .main3 .resources-box .swiper-container .swiper-slide .box dd { margin-top:18px; -webkit-line-clamp:4;  min-height:84px; }
    .main3 .resources-box .swiper-container .swiper-slide .box .date { margin-top:18px; }
    .main3 .resources-box .swiper-pagination-progressbar { height:1px; }
    .main3 .resources-box .control_box { padding:0 0 20px 0; margin:20px 20px 0; width:calc(100% - 40px)}
    .main3 .resources-box .control_box .swiper-btn { z-index:5; width:30px; height:35px; top:-210px; background:rgba(255,255,255,0.2) url(/img/main/swiper-btn.png) no-repeat center; }
    .main3 .resources-box .control_box .swiper-button-next-n { right:-20px; transform:rotate(180deg); }
    .main3 .resources-box .control_box .swiper-button-prev-n { left:-20px; }
}


/* animation */
.main3 .topTitle h3 a.btn { opacity:0; }
.main3 .aniBox.on .topTitle h3 a.btn { animation:ani_3 0.8s 0.3s; animation-fill-mode:both; }

.main4 { position:relative; padding-top:40px; background:url(/img/main/action_bg.jpg) no-repeat center / cover; overflow:hidden }
.main4 .action-box { margin-top:40px; display:flex; flex-wrap:wrap; gap:0 100px; }
.main4 .action-box dt, 
.main4 .action-box .title { color:#222; font-size:24px; font-weight:400; line-height:1.3; letter-spacing:-0.02em; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.main4 .action-box dt { margin-top:20px; }
.main4 .action-box dd { margin-top:20px; color:#888; font-size:16px; font-weight:400; line-height:1.4; letter-spacing:-0.02em; min-height:45px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.main4 .action-box .date { margin-top:20px; color:#ccc; font-size:16px; font-weight:700; line-height:1.4; letter-spacing:-0.02em; }
.main4 .action-box .l-box { width:calc(44% - 50px); }
.main4 .action-box .r-box { width:calc(56% - 50px); }
.main4 .action-box .l-box li { position:relative; }
.main4 .action-box .l-box li:not(:last-child) { margin-bottom:20px; }
.main4 .action-box .l-box li a { position:relative;transition:all 0.5s; padding:40px 100px; text-align:center; display:flex; flex-direction:column; justify-content:center; width:100%; height:258px; border-radius:20px; background:#fff; box-shadow:0px 0px 25px 0px rgba(0, 0, 0, 0.05);  overflow:hidden }
.main4 .action-box .l-box li:before { transition:all 0.5s; content:""; display:block; width:50px; height:44px; position:absolute; top:40px; left:40px; z-index:2; background:url(/img/main/review_icon_off.png) center center no-repeat; }
.main4 .action-box .l-box li:after { transition:all 0.5s; content:""; display:block; width:50px; height:44px; position:absolute; bottom:40px; right:40px; background:url(/img/main/review_icon1_off.png) center center no-repeat; }
.main4 .action-box .l-box li:hover:before { background:url(/img/main/review_icon.png) center center no-repeat; }
.main4 .action-box .l-box li:hover:after { background:url(/img/main/review_icon1.png) center center no-repeat; }
.main4 .action-box .l-box li .title { color:#222; font-size:24px; font-weight:400; line-height:1.3; letter-spacing:-0.02em; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; }
.main4 .action-box .l-box li h4 { font-family:var(--mainFont); color:var(--mainColor); font-size:16px; font-weight:700; line-height:1.3; letter-spacing:-0.02em; }
.main4 .action-box .r-box ul { display:flex; gap:40px; }
.main4 .action-box .r-box li { width:calc(50% - 20px); }
.main4 .action-box .r-box li a { position:relative; transition:all 0.5s; display:block; width:100%; height:536px; border-radius:20px; background:#fff; box-shadow:0px 0px 25px 0px rgba(0, 0, 0, 0.05); overflow:hidden }
.main4 .action-box .r-box li .imgbox { position:relative; }
.main4 .action-box .r-box li .imgbox:before {content:""; display:block; padding-bottom:73.5%; }
.main4 .action-box .r-box li .imgbox img { position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; -o-object-fit:cover; border-radius:20px 20px 0 0; }
.main4 .action-box .r-box li .imgbox .play { display:block; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:80px; height:80px; background:url(/img/main/play_icon_on.png) center center no-repeat; }
.main4 .action-box .r-box li .txtbox { padding:30px; }
.main4 .action-box .r-box li .txtbox dt { margin-top:0; }
.main4 .action-box .r-box li .more { position:absolute; bottom:35px; right:30px; padding:0 51px 0 0; font-family:var(--mainFont); color:#111; font-size:14px; font-weight:700; line-height:1.3; letter-spacing:-0.02em; }
.main4 .action-box .r-box li .more:before { transition:all 0.5s; content:""; display:block; width:36px; height:36px; position:absolute; top:50%; right:0; transform:translateY(-50%); background:url(/img/main/more_icon.png) center center no-repeat; }
.main4 .action-box .r-box li a:hover .more:before { transform:translateY(-50%) rotate(180deg); transform-origin:50% 50%;}
.main4 .action-box li a:before { transition:all 0.5s; content:""; display:block; width:calc(100% - 2px); height:calc(100% - 2px); position:absolute; top:0; left:0; z-index:4; border:1px solid var(--mainColor); opacity:0; border-radius:20px; }
.main4 .action-box li a:hover:before { opacity:1; }
@media screen and (max-width:1720px){
    .main4 .action-box { gap:0 80px; }
    .main4 .action-box .l-box { width:calc(44% - 40px); }
    .main4 .action-box .r-box { width:calc(56% - 40px); }
}
@media screen and (max-width:1500px){
    .main4 .action-box { gap:0 40px; }
    .main4 .action-box .l-box { width:calc(44% - 20px); }
    .main4 .action-box .r-box { width:calc(56% - 20px); }
    .main4 .action-box .r-box ul { gap:20px; }
    .main4 .action-box .r-box li { width:calc(50% - 10px); }
    .main4 .action-box .l-box li a { height:220px; padding:40px 80px; }
    .main4 .action-box .r-box li a { height:460px;}
    .main4 .action-box .l-box li:before { top:30px; left:20px; background-size:42px auto; }
    .main4 .action-box .l-box li:after { bottom:30px; right:20px; background-size:42px auto; }
    .main4 .action-box .l-box li:hover:before,
    .main4 .action-box .l-box li:hover:after { background-size:42px auto; }
}
@media screen and (max-width:1280px){
    .main4 .action-box { gap:0 40px; }
    .main4 .action-box dt,
    .main4 .action-box .title {font-size:20px; }
    .main4 .action-box dt { margin-top:15px; }
    .main4 .action-box dd { margin-top:15px; font-size:15px; min-height:42px; }
    .main4 .action-box .date { margin-top:15px; font-size:15px; }
    .main4 .action-box .l-box { width:calc(44% - 20px); }
    .main4 .action-box .l-box li .title { font-size:21px; }
    .main4 .action-box .r-box { width:calc(56% - 20px); }
    .main4 .action-box .r-box ul { gap:20px; }
    .main4 .action-box .r-box li { width:calc(50% - 10px); }
    .main4 .action-box .l-box li a { height:200px; padding:40px 60px; }
    .main4 .action-box .r-box li a { height:420px;}
    .main4 .action-box .l-box li:before { top:20px; left:10px; background-size:35px auto; }
    .main4 .action-box .l-box li:after { bottom:20px; right:10px; background-size:35px auto; }
    .main4 .action-box .l-box li:hover:before,
    .main4 .action-box .l-box li:hover:after { background-size:35px auto; }
}
@media screen and (max-width:1024px){
    .main4 .action-box { margin-top:20px; }
    .main4 .action-box dt,
    .main4 .action-box .title { font-size:18px; }
    .main4 .action-box dt { margin-top:12px; }
    .main4 .action-box dd { margin-top:12px; font-size:14px; min-height:45px; }
    .main4 .action-box .date { margin-top:12px; font-size:14px; }
    .main4 .action-box .l-box li a { height:190px; }
    .main4 .action-box .l-box li .title { font-size:19px; }
    .main4 .action-box .r-box li a { height:400px;}
    .main4 .action-box .r-box li .imgbox .play { width:60px; height:60px; background-size:60px auto; }
    .main4 .action-box .l-box li:before,
    .main4 .action-box .l-box li:after,
    .main4 .action-box .l-box li:hover:before,
    .main4 .action-box .l-box li:hover:after { background-size:30px auto; }
}
@media screen and (max-width:860px){
    .main4 .action-box .l-box,
    .main4 .action-box .r-box { width:100%; }
    .main4 .action-box .r-box { margin-top:20px; } 
    .main4 .action-box .l-box ul { display:flex; flex-wrap:wrap; gap:10px; }
    .main4 .action-box .l-box li { width:100%; }
    .main4 .action-box .l-box li:not(:last-child) { margin-bottom:0; }
    .main4 .action-box .l-box li a { height:auto; padding:35px 50px; }
    .main4 .action-box dt { margin-top:0; }
    .main4 .action-box .r-box dt { margin-top:12px; }
    .main4 .action-box .r-box ul { gap:10px; }
    .main4 .action-box .r-box li { width:calc(50% - 5px); }
    .main4 .action-box .r-box li .txtbox { padding:20px 20px 60px; }
    .main4 .action-box .r-box li a { height:auto; }
    .main4 .action-box .r-box li .more { bottom:15px; }
    .main4 .action-box .r-box li .imgbox .play { width:45px; height:45px; background-size:45px auto; }
    .main4 .action-box .l-box li:before { top:10px; }
    .main4 .action-box .l-box li:after { bottom:10px; }
    .main4 .action-box .l-box li:before,
    .main4 .action-box .l-box li:after,
    .main4 .action-box .l-box li:hover:before,
    .main4 .action-box .l-box li:hover:after { background-size:25px auto; }
}
@media screen and (max-width:640px){
    .main4 .action-box { margin-top:10px; }
}

/* animation */
.main4 .action-box .l-box li { opacity:0; }
.main4 .aniBox.on .action-box .l-box li:nth-child(1) { animation:bgs3 0.5s 0.4s; animation-fill-mode:both; }
.main4 .aniBox.on .action-box .l-box li:nth-child(2) { animation:bgs3 0.5s 0.7s; animation-fill-mode:both; }
.main4 .action-box .r-box li { opacity:0; }
.main4 .aniBox.on .action-box .r-box li:nth-child(1) { animation:ani_3 0.5s 0.6s; animation-fill-mode:both; }
.main4 .aniBox.on .action-box .r-box li:nth-child(2) { animation:ani_3 0.5s 0.9s; animation-fill-mode:both; }

/* Cursor */
.cursor { position:fixed; left:0;top:0; pointer-events:none !important; z-index:999999 !important; animation:cursor_bs_off 0.5s; animation-fill-mode:both; position:absolute; width:120px; height:120px; border-radius:50%; transform:translate(-50%, -50%); border-radius:100px; background:rgba(255, 255, 255, 0.1); display:flex; align-items:center; justify-content:center; color:#fff; font-size:16px; font-weight:700; letter-spacing:-0.02em; line-height:1; font-family:var(--mainFont); }
.cursor:before{ content:"\e930";  font-family:'xeicon'; color:#fff; position:absolute; top:50%; left:15%; margin-top:0; transform:translateY(-50%) rotate(-90deg); font-size:14px; font-weight:500 }
.cursor:after{ content:"\e930";  font-family:'xeicon'; color:#fff; position:absolute; top:50%; right:15%; margin-top:0; transform:translateY(-50%) rotate(90deg); font-size:14px; font-weight:500 }
.cursor.more-p { border:1px solid #ddd; background:none }
.cursor.more-p,
.cursor.more-p:before,
.cursor.more-p:after{ color:var(--mainColor);}
.cursor.more,
.cursor.more-p { animation:cursor_bs 0.5s 0.2s; animation-fill-mode:both; }
@media screen and (max-width:1024px){
    .cursor.more,
    .cursor.more-p { display:none }
}