/* slick-slider 필수 css */
.slick-slider{position:relative; display:block; box-sizing:border-box; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; -webkit-touch-callout:none; -khtml-user-select:none; -ms-touch-action:pan-y; touch-action:pan-y; -webkit-tap-highlight-color:transparent;}
.slick-list{position:relative; display:block; overflow:hidden; margin:0; padding:0;}
.slick-list:focus{outline:none;}
.slick-list.dragging{cursor:pointer; cursor:hand;}
.slick-slider .slick-track,.slick-slider .slick-list{-webkit-transform:translate3d(0, 0, 0); -moz-transform:translate3d(0, 0, 0); -ms-transform:translate3d(0, 0, 0); -o-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0);}
.slick-track{position:relative; top:0; left:0; display:block;}
.slick-track:before,.slick-track:after{display:table; content:'';}
.slick-track:after{clear:both;}
.slick-loading .slick-track{visibility:hidden;}
.slick-slide{display:none; float:left; height:100%; min-height:1px; -webkit-transform:translate3d(0,0,0);}
.slick-slide img{display:block; margin:0 auto;}
.slick-slide.slick-loading img{display:none;}
.slick-slide.dragging img{pointer-events:none;}
.slick-initialized .slick-slide{display:block;}
.slick-loading .slick-slide{visibility:hidden;}
.slick-vertical .slick-slide{display:block;height:auto; border:1px solid transparent;}
.slick-arrow.slick-hidden{display:none;}

.slick-slider .slick-track,
.slick-slider .slick-list { transform:translate3d(0, 0, 0); }
.slick-slide { transform:translate3d(0,0,0); }



.visual { position:relative; width:100%; height:100%; z-index:2; overflow:hidden; }
.visual.swiper-container { position:relative; width:100%; height:100%; background-color:#0f0f0f }
.visual .swiper-slide { position:relative; width:100%; height:100vh; overflow:hidden; display:flex; transition:all 0.3s ease-in-out; z-index:9; }
.visual .swiper-slide .bg { position:absolute; width:100%; height:100%; right:0; bottom:0; background-color:#0f0f0f; background-position:right center; background-repeat:no-repeat;}
.visual .swiper-slide .inner { position:relative; width:100%; height:100%; z-index:6; }
.visual .swiper-slide .visual_txt { position:absolute; top:30%; left:0; z-index:100; }
.visual .swiper-slide .visual_txt .vs_title { opacity:0; color:#fff; font-size:90px; overflow:hidden; margin-bottom:0.5%; }
.visual .swiper-slide .visual_txt .vs_title span { display:block; line-height:1.2; font-weight:500; letter-spacing:-0.02em; }
.visual .swiper-slide .visual_txt .txt_c { color:#0898e3; }
.visual .swiper-slide .visual_txt .txt { opacity:0; color:rgba(255,255,255,0.8); font-size:19px; overflow:hidden; margin-top:3%;}
.visual .swiper-slide .visual_txt .txt span { display:block; line-height:1.6; font-weight:300; letter-spacing:-0.02em; }
.visual .swiper-slide.swiper-slide-active .visual_txt .vs_title { opacity:1; }
.visual .swiper-slide.swiper-slide-active .visual_txt .vs_title span { animation:txtLeft 1.5s 0.3s; animation-fill-mode:both; }
.visual .swiper-slide.swiper-slide-active .visual_txt .txt_c span { animation:blur_txt 1.8s 0.3s; animation-fill-mode:both;  }
.visual .swiper-slide.swiper-slide-active .visual_txt .txt { opacity:1; }
.visual .swiper-slide.swiper-slide-active .visual_txt .txt span { animation:txtLeft 1.5s 0.6s; animation-fill-mode:both; }
.visual .swiper-slide .pc { display:block; }
.visual .swiper-slide .mobile { display:none; }

.visual .control_box { position:absolute; left:0; top:20%; width:100%; text-align:left; z-index:100; }
.visual .swiper-pagination { position:relative; text-align:left; max-width:1500px; width:100%; margin:0 auto; }
.visual .swiper-pagination .swiper-pagination-bullet { position:relative; text-align:center; opacity:1; background-color:transparent; display:inline-block; margin-right:30px !important; }
.visual .swiper-pagination .swiper-pagination-bullet em { position:relative; box-sizing:border-box;display:flex; justify-content:center;  align-items:center; font-family: 'Jost', sans-serif; font-size:13px; color:rgba(255,255,255,0.3); font-weight:400; font-style:normal; }
.visual .swiper-pagination .swiper-pagination-bullet em:after {content:""; display:block; position:absolute; bottom:-3px; left:-3px; width:0; height:1px; background-color:#0898e3; transition:all 0.3s ease-in-out; }
.visual .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active em { color:#0898e3; font-weight:500 }
.visual .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active em:after { width:calc(100% + 6px);}
.visual .swiper-pagination .swiper-pagination-bullet span { position:relative; display:block; box-sizing:border-box; }

.swiper-btn { display:none; width:30px; height:56px; margin-top:-60px; }
.swiper-btn.swiper-button-prev { left:60px; background:url(/img/main/swiper_btn_l.png) no-repeat center;}
.swiper-btn.swiper-button-next { right:60px; background:url(/img/main/swiper_btn_r.png) no-repeat center; }
.swiper-btn.swiper-button-prev,
.swiper-btn.swiper-button-next { opacity:0; }
.swiper-btn.swiper-button-prev { animation:ani_2 0.8s 0.5s; animation-fill-mode:both; }
.swiper-btn.swiper-button-next { animation:ani_1 0.8s 0.5s; animation-fill-mode:both; }
.swiper-button-next:after, 
.swiper-button-prev:after { display:none; }
@media screen and (max-width:1540px){
	.visual .swiper-slide .inner { padding:0 20px; }
	.visual .swiper-slide .bg { background-position:50% center;  }
	.visual .swiper-slide .visual_txt,
	.visual .control_box { left:20px; width:calc(100% - 40px)}
	.visual .swiper-slide .visual_txt .vs_title { font-size:75px;  }
	.visual .swiper-slide .visual_txt .txt { font-size:18px; }
}
@media screen and (max-width:1280px){
	.visual .swiper-slide .bg { }
	.visual .swiper-slide .visual_txt .vs_title { font-size:65px;  }
	.visual .swiper-slide .visual_txt .txt { font-size:18px; }
}
@media screen and (max-width:1024px){
	.visual .swiper-slide .bg { background-size:cover !important; background-position:60% bottom; }
	.visual .swiper-slide .visual_txt .vs_title { font-size:45px;  }
	.visual .swiper-slide .visual_txt .txt { font-size:17px; }
}
@media screen and (max-width:760px){
	.visual .swiper-slide .visual_txt .vs_title { font-size:30px;  }
	.visual .swiper-slide .visual_txt .txt { font-size:16px; }
}
@media screen and (max-width:640px){
	.visual .swiper-slide .pc { display:none; }
	.visual .swiper-slide .mobile { display:block; }
	.visual .swiper-slide .bg { background-position:center bottom; }
}
@media screen and (max-width:500px){
	.visual .swiper-slide .visual_txt .txt br { display:none }
	.visual .swiper-slide .m_br { display:block; }
	.visual .swiper-slide .visual_txt > div { display:inline-block; }
}


/* title */
#main .title-box h3 { color:#0898e3; font-weight:600; font-size:14px; }
#main .title-box h3 > span { font-weight:600; }
#main .title-box p { margin-top:34px; color:#111; font-weight:500; font-size:100px; line-height:1.1; letter-spacing:-0.02em; }
#main .title-box p > span { font-weight:500; }
#main .title-box .txt { margin-top:50px; color:#111; font-weight:300; font-size:17px; line-height:1.4; letter-spacing:-0.02em; }
@media screen and (max-width:1280px){
	#main .title-box p { margin-top:30px; font-size:80px; }
	#main .title-box .txt { margin-top:45px; }
}
@media screen and (max-width:1024px){
	#main .title-box h3 { font-size:13px; }
	#main .title-box p { margin-top:25px; font-size:50px; }
	#main .title-box .txt { margin-top:40px; font-size:16px; }
}
@media screen and (max-width:640px){
	#main .title-box p { margin-top:20px; font-size:36px; }
	#main .title-box .txt { margin-top:25px; }
	#main .title-box .txt br { display:none }
}

/* animation */
#main .title-box h3,
#main .title-box p { overflow:hidden; }
#main .title-box span { display:block; }
#main .title-box h3 span,
#main .title-box p span,
#main .title-box .txt { opacity:0; }
#main .title-box.subOn h3 span { animation:txtUp 0.8s 0.2s; animation-fill-mode:both; }
#main .title-box.subOn p span { animation:txtUp 0.8s 0.5s; animation-fill-mode:both; }
#main .title-box.subOn .txt { animation:ani_3 0.8s 0.8s; animation-fill-mode:both; }

/* motion */
#main .geomedi-motion { position:relative; height:100vh; overflow:hidden }
#main .geomedi-motion .motion-box { position:relative; display:flex; width:100%; height:100%; justify-content:center; align-items:center; flex-direction:column; }
#main .geomedi-motion .motion-box .ani1 { margin:25px 0; position:relative; z-index:2; }
#main .geomedi-motion .motion-box .logo_s1 { width:312px; display:block }
#main .geomedi-motion .motion-box .logo_s2 { width:330px; display:block}
#main .geomedi-motion .motion-box .ani2 { position:absolute; left:0; top:0; padding-right:100px; display:flex; width:100%; height:100%; flex-direction:column; justify-content:center;align-items:center; }
#main .geomedi-motion .motion-box .ani2 .img1 { position:relative; z-index:3; }
#main .geomedi-motion .motion-box .ani2 .img2 { position:relative; z-index:2; }
#main .geomedi-motion .motion-box .ani2 .img3 { position:relative; z-index:1; }
#main .geomedi-motion .motion-box .ani2 .img1 > div { transform:rotate(2deg) translate(calc(-5px - 0.5px), calc(230px - 0.5px)); }
#main .geomedi-motion .motion-box .ani2 .img2 > div { transform:translate(calc(-24px - 0.5px), calc(140px - 0.5px)); }
#main .geomedi-motion .motion-box .ani2 .img3 > div { transform:translate(0, -150px); }
#main .geomedi-motion .motion-box .ani2 .img4 { position:absolute; z-index:4; top:50%;  transform:translateY(calc(-50% - 0.5px)); }
#main .geomedi-motion .motion-box .ani2 .img4 > div { transform:translate(0, 0); }
#main .geomedi-motion .txtbox { position:absolute; left:50%; top:50%; margin-top:80px; font-size:18px; color:#0898e3; font-weight:300; line-height:1.4; overflow:hidden; }
@media screen and (max-width:1400px){
	#main .geomedi-motion .motion-box .logo_s1 { width:200px; }
	#main .geomedi-motion .motion-box .logo_s2 { width:220px; }
	#main .geomedi-motion .motion-box .ani2 .img1,
	#main .geomedi-motion .motion-box .ani2 .img2,
	#main .geomedi-motion .motion-box .ani2 .img3 { margin-left:5%; }
	#main .geomedi-motion .motion-box .ani2 .img1 img { width:60px}
	#main .geomedi-motion .motion-box .ani2 .img2 img { width:46px}
	#main .geomedi-motion .motion-box .ani2 .img3 img,
	#main .geomedi-motion .motion-box .ani2 .img4 img { width:460px; }
	#main .geomedi-motion .motion-box .ani2 .img1 > div { transform:rotate(2deg) translate(-6px, 126px); }
	#main .geomedi-motion .motion-box .ani2 .img2 > div { transform:translate(-18px, 65px); }
	#main .geomedi-motion .motion-box .ani2 .img3 > div { transform:translate(-3px, -115px); }
	#main .geomedi-motion .motion-box .ani2 .img4 > div { transform:translate(-5px, -23px); }
	/*#main .geomedi-motion .txtbox { left:39%; margin-top:40px;  }*/
	#main .geomedi-motion .txtbox { left:40%; margin-top:40px;  }
}
@media screen and (max-width:1280px){
	#main .geomedi-motion .txtbox { left:0; margin-top:120px; transform:translate(0, 0) !important; text-align:center; width:100%;}
	#main .geomedi-motion .motion-box .ani2 .img1,
	#main .geomedi-motion .motion-box .ani2 .img2,
	#main .geomedi-motion .motion-box .ani2 .img3,
	#main .geomedi-motion .motion-box .ani2 .img4 { margin-left:6%; }
}
@media screen and (max-width:960px){
	#main .geomedi-motion .motion-box .ani2 .img1,
	#main .geomedi-motion .motion-box .ani2 .img2,
	#main .geomedi-motion .motion-box .ani2 .img3,
	#main .geomedi-motion .motion-box .ani2 .img4 { margin-left:8%; }
}
@media screen and (max-width:640px){
	#main .geomedi-motion .motion-box .logo_s1 { width:110px; }
	#main .geomedi-motion .motion-box .logo_s2 { width:130px; }
	#main .geomedi-motion .motion-box .ani2 { transform:translate(45px, 0); }
	#main .geomedi-motion .motion-box .ani2 .img1,
	#main .geomedi-motion .motion-box .ani2 .img2,
	#main .geomedi-motion .motion-box .ani2 .img3 { margin-left:1%; }
	#main .geomedi-motion .motion-box .ani2 .img1 img { width:50px}
	#main .geomedi-motion .motion-box .ani2 .img2 img { width:38px}
	#main .geomedi-motion .motion-box .ani2 .img3 img,
	#main .geomedi-motion .motion-box .ani2 .img4 img { width:350px; }
	#main .geomedi-motion .motion-box .ani2 .img1 > div { transform:rotate(2deg) translate(-4px, 101px); }
	#main .geomedi-motion .motion-box .ani2 .img2 > div { transform:translate(-14px, 51px); }
	#main .geomedi-motion .motion-box .ani2 .img3 > div { transform:translate(-3px, -99px); }
	#main .geomedi-motion .motion-box .ani2 .img4 > div { transform:translate(-24px, -12px); }
	#main .geomedi-motion .txtbox { transform:translate(-45px, 0) !important; margin-top:110px;}
}
@media screen and (max-width:520px){
	#main .geomedi-motion .motion-box .ani2 .img4 > div { transform:translate(-20px, -12px); }
}
@media screen and (max-width:480px){
	#main .geomedi-motion .motion-box .ani2 .img4 > div { transform:translate(-18px, -12px); }
}

@media screen and (max-width:400px){
	#main .geomedi-motion .motion-box .ani2 .img4 > div { transform:translate(-17px, -12px); }
}

/* product */
#main .main-product { padding:220px 0; background-color:#0f0f0f }
#main .main-product .title-box p  { color:#fff; }
#main .main-product .listbox { margin:0 auto; max-width:1920px; }
#main .main-product .listbox .list-swiper { margin-top:40px; padding:0 40px; width:100%; transition:all 0.3s ease-in-out; }
/*
#main .main-product .listbox.on .list-swiper { margin-left:8%;  }
*/
#main .main-product .listbox .swiper-container { padding:18px 20px; overflow:hidden }
#main .main-product .listbox .box { height:520px; box-shadow:0 0 20px rgba(136,197,229,0.2); border-radius:10px; }
#main .main-product .listbox .box a { position:relative; display:flex; flex-direction:column; align-items:center; width:100%; height:100%; padding-top:50px; }
#main .main-product .listbox .box .imgbox { text-align:center; }
#main .main-product .listbox .box .imgbox img { max-width:100%; margin:0 auto}
#main .main-product .listbox .box .txtbox { position:absolute; left:55px; bottom:40px; width:calc(100% - 100px); }
#main .main-product .listbox .box .txtbox dt { font-size:30px; color:#fff; font-weight:400; line-height:1.2; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; transition:all 0.3s ease-in-out; }
#main .main-product .listbox .box .txtbox dd { margin-top:25px; height:50px; }
#main .main-product .listbox .box .txtbox .txt { letter-spacing:0.04em; font-size:17px; color:rgba(255,255,255,0.7); font-weight:200; line-height:1.4; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; transition:all 0.3s ease-in-out; }
#main .main-product .swiper-btn { transition:all 0.3s ease-in-out; cursor:pointer; position:absolute; top:50%; width:100px; height:100px; border:1px solid rgba(255,255,255,0.5); border-radius:100px; z-index:55; display:flex;align-items: center; justify-content: center;  }
#main .main-product .swiper-btn i { transition:all 0.3s ease-in-out; font-size:30px; color:rgba(255,255,255,0.6); }
#main .main-product .swiper-button-prev-p { left:15px; }
#main .main-product .swiper-button-next-p { right:15px; }
#main .main-product .swiper-btn:hover { box-shadow:0 0 15px rgba(136,197,229,0.5); border:1px solid #0898e3 }
#main .main-product .swiper-btn:hover i { color:#0898e3 }
@media screen and (max-width:1540px){	
	#main .main-product { padding:200px 0; }
	#main .main-product .listbox.on .list-swiper { margin-left:0; }
	#main .main-product .listbox .list-swiper { padding:0 3px; }
}
@media screen and (max-width:1280px){
	#main .main-product { padding:160px 0; }
	#main .main-product .listbox .box { height:580px; }
	#main .main-product .listbox .box a { padding-top:60px; }
	#main .main-product .listbox .box .txtbox { left:35px; bottom:35px; width:calc(100% - 70px); }
	#main .main-product .listbox .box .txtbox dt { font-size:26px; }
	#main .main-product .listbox .box .txtbox dd { margin-top:22px; height:50px; }
	#main .main-product .listbox .box .txtbox .txt { font-size:16px; }
  #main .main-product .swiper-btn { width:80px; height:80px;  }
  #main .main-product .swiper-btn i {  font-size:25px; }
}
@media screen and (max-width:1024px){
	#main .main-product { padding:120px 0; }
	#main .main-product .listbox .list-swiper { margin-top:50px; }
	#main .main-product .listbox .box { height:450px; }
	#main .main-product .listbox .box a { padding-top:30px; }
	#main .main-product .listbox .box .imgbox img { max-width:75%; }
	#main .main-product .listbox .box .txtbox { left:35px; bottom:35px; width:calc(100% - 70px); }
	#main .main-product .listbox .box .txtbox dt { font-size:26px; }
	#main .main-product .listbox .box .txtbox dd { margin-top:22px; height:50px; }
	#main .main-product .listbox .box .txtbox .txt { font-size:16px; }
}
@media screen and (max-width:640px){
	#main .main-product { padding:80px 0; }
	#main .main-product .listbox .list-swiper { margin-top:30px; }
	#main .main-product .listbox .box { height:320px; }
	#main .main-product .listbox .box a { padding-top:25px; }
	#main .main-product .listbox .box .imgbox img { max-width:60%; }
	#main .main-product .listbox .box .txtbox { left:20px; bottom:20px; width:calc(100% - 40px); }
	#main .main-product .listbox .box .txtbox dt { font-size:18px; }
	#main .main-product .listbox .box .txtbox dd { margin-top:10px; height:48px; }
	#main .main-product .listbox .box .txtbox .txt { font-size:15px; }
  #main .main-product .swiper-btn { width:50px; height:50px; top:60%; }
  #main .main-product .swiper-btn i {  font-size:20px; }
}

/* animation */
#main .main-product .list-swiper { opacity:0; }
#main .main-product .list-swiper.subOn { animation:ani_3 0.5s 0.2s; animation-fill-mode:both; }

/* about */
#main .main-about { padding:220px 0; }
#main .main-about .title-box { text-align:center; }
#main .main-about .listbox { margin-top:90px; }
#main .main-about .listbox ul { display:flex; justify-content:center; flex-wrap:wrap; gap:30px 12px; }
#main .main-about .listbox li { position:relative; width:calc((100% - 36px) / 4); }
#main .main-about .listbox li:after {content:""; display:block; padding-bottom:100%; }
#main .main-about .listbox li .circle { transition:all 0.3s ease-in-out; position:absolute; top:0; left:0; width:100%; height:100%; display:flex; justify-content:center; align-items:center; text-align:center; box-shadow:8px 8px 20px rgba(0,0,0,0.08); border-radius:500px; }
#main .main-about .listbox li .circle .txt { transition:all 0.3s ease-in-out; opacity:1; }
#main .main-about .listbox li .circle .txt .icon { display:block; margin:0 auto; width:95px; }
#main .main-about .listbox li .circle .txt .stxt { display:block; margin-top:55px; color:#000; font-weight:600; font-size:22px; }
#main .main-about .listbox li .circle .over { transition:all 0s ease-in-out; opacity:0; position:absolute; top:120px; left:0; width:100%; }
#main .main-about .listbox li .circle .over .tit { color:#fff; font-weight:700; font-size:55px; display:block; transition:all 0.3s ease-in-out; }
#main .main-about .listbox li:nth-child(3) .circle .over .tit { font-size:40px; }
#main .main-about .listbox li .circle .over .txt-s { margin-top:25px; min-height:115px; line-height:1.4; color:#fff; font-weight:300; font-size:16px; display:block; transition:all 0.3s ease-in-out; }
#main .main-about .listbox li .circle .over .btn { color:#fff; font-weight:300; font-size:16px; display:block; transition:all 0.3s ease-in-out; }
#main .main-about .listbox li .circle .over .btn i { font-weight:100; font-size:14px; display:inline-block; margin-left:5px; }
#main .main-about .listbox li:nth-child(1):hover .circle { background:url(/img/main/about_bg1.jpg) no-repeat center top / cover; }
#main .main-about .listbox li:nth-child(2):hover .circle { background:url(/img/main/about_bg2.jpg) no-repeat center top / cover; }
#main .main-about .listbox li:nth-child(3):hover .circle { background:url(/img/main/about_bg3.jpg) no-repeat center top / cover; }
#main .main-about .listbox li:nth-child(4):hover .circle { background:url(/img/main/about_bg4.jpg) no-repeat center top / cover; }
#main .main-about .listbox li:hover .circle { height:calc(100% + 115px); }
#main .main-about .listbox li:hover .circle .txt { opacity:0; transition:all 0s ease-in-out; }
#main .main-about .listbox li:hover .circle .over { opacity:1; transition:all 0.3s ease-in-out; }
@media screen and (max-width:1540px){	
	#main .main-about { padding:200px 0; }
}
@media screen and (max-width:1280px){
	#main .main-about { padding:160px 0; }
	#main .main-about .listbox li .circle .txt .icon { width:75px; }
	#main .main-about .listbox li .circle .txt .stxt { margin-top:50px; }
	#main .main-about .listbox li .circle .over { top:100px; }
	#main .main-about .listbox li .circle .over .tit { font-size:40px; }
	#main .main-about .listbox li:nth-child(3) .circle .over .tit { font-size:28px; }
	#main .main-about .listbox li .circle .over .txt-s { margin-top:25px; min-height:80px; font-size:16px; }
	#main .main-about .listbox li .circle .over .btn { font-size:16px; }
	#main .main-about .listbox li .circle .over .btn i { font-size:13px; }
	#main .main-about .listbox li:hover .circle { height:calc(100% + 100px); }
}
@media screen and (max-width:1024px){
#main .main-about .listbox { margin-top:60px; }
	#main .main-about { padding:120px 0; }
	#main .main-about .listbox li .circle .txt .icon { width:55px; }
	#main .main-about .listbox li .circle .txt .stxt { margin-top:45px; font-size:18px; }
	#main .main-about .listbox li .circle .over { top:70px; }
	#main .main-about .listbox li .circle .over .tit { font-size:30px; }
	#main .main-about .listbox li:nth-child(3) .circle .over .tit { font-size:22px; }
	#main .main-about .listbox li .circle .over .txt-s { margin-top:20px; min-height:80px; font-size:15px; }
	#main .main-about .listbox li .circle .over .btn { font-size:15px; }
	#main .main-about .listbox li .circle .over .btn i { font-size:12px; }
	#main .main-about .listbox li:hover .circle { height:calc(100% + 80px); }
}
@media screen and (max-width:860px){
	#main .main-about .listbox li { width:calc((100% - 24px) / 2); }
	#main .main-about .listbox li:hover .circle { height:100%; }
	#main .main-about .listbox li .circle .over .tit { font-size:26px; }
	#main .main-about .listbox li:nth-child(3) .circle .over .tit { font-size:20px; }
	#main .main-about .listbox li .circle .over .txt-s { margin-top:10px; min-height:60px; }
	#main .main-about .listbox li .circle .over { top:25%; }
	#main .main-about .listbox li:nth-child(1) .circle { background:url(/img/main/about_bg1.jpg) no-repeat center top / cover; }
	#main .main-about .listbox li:nth-child(2) .circle { background:url(/img/main/about_bg2.jpg) no-repeat center top / cover; }
	#main .main-about .listbox li:nth-child(3) .circle { background:url(/img/main/about_bg3.jpg) no-repeat center top / cover; }
	#main .main-about .listbox li:nth-child(4) .circle { background:url(/img/main/about_bg4.jpg) no-repeat center top / cover; }
	#main .main-about .listbox li .circle .txt { opacity:0; transition:all 0s ease-in-out; }
	#main .main-about .listbox li .circle .over { opacity:1; transition:all 0.3s ease-in-out; }
}
@media screen and (max-width:640px){
#main .main-about .listbox { margin-top:30px; }
	#main .main-about { padding:80px 0; }
}

/* animation */
#main .main-about .listbox li { opacity:0; }
#main .main-about .listbox.subOn li:nth-child(1) { animation:ani_2 0.5s 0.2s; animation-fill-mode:both; }
#main .main-about .listbox.subOn li:nth-child(2) { animation:ani_2 0.5s 0.4s; animation-fill-mode:both; }
#main .main-about .listbox.subOn li:nth-child(3) { animation:ani_2 0.5s 0.6s; animation-fill-mode:both; }
#main .main-about .listbox.subOn li:nth-child(4) { animation:ani_2 0.5s 0.8s; animation-fill-mode:both; }
#main .main-about .listbox.subOn li:nth-child(5) { animation:ani_2 0.5s 1.0s; animation-fill-mode:both; }

/* network */
#main .main-network { background-color:#0f0f0f; padding-top:220px; }
#main .main-network .title-box { text-align:center; }
#main .main-network .title-box p  { color:#fff; }
#main .main-network .title-box .txt { color:rgba(255,255,255,0.7); }
#main .main-network .map { margin-top:115px; }
#main .main-network .map .cls-1 { fill:none; }
#main .main-network .map .cls-2 { fill:#272727; }
#main .main-network .map .land path,
#main .main-network .map .land polygon { transition:all 0.3s ease-in-out; }
#main .main-network .map .regionTxt { fill:rgba(255,255,255,0.65); font-size:0.35em; font-weight:600; letter-spacing:0.01em; }
#main .main-network .map .regionTxt-1 { fill:rgba(255,255,255,1); font-size:0.4em; font-weight:600; letter-spacing:0.01em; }
#main .main-network .map .circle1 { fill:rgba(16,165,243,1); }
#main .main-network .map .circle2 { fill:rgba(16,165,243,0.3);}
#main .main-network .map .circle3 { fill:rgba(16,165,243,0.3); filter: blur(2px); }
#main .main-network .map .circle4 { fill:rgba(16,165,243,0.5); filter: blur(4px); }
#main .main-network .map .pin { fill:rgba(16,165,243,1); }
@media screen and (max-width:1540px){	
	#main .main-network { padding-top:200px; }
}
@media screen and (max-width:1280px){
	#main .main-network { padding-top:160px; }
	#main .main-network .map .regionTxt { font-size:0.5em; }
	#main .main-network .map .regionTxt-1 { font-size:0.6em; }
}
@media screen and (max-width:1024px){
	#main .main-network { padding-top:120px; }
}
@media screen and (max-width:640px){
	#main .main-network { padding-top:80px; }
	#main .main-network .map .regionTxt { font-size:0.8em; transform:translateY(5px) }
	#main .main-network .map .regionTxt-1 { font-size:1em; transform:translateY(5px) }
}
@media screen and (max-width:480px){
	#main .main-network .map .regionTxt { font-size:1.1em; transform:translateY(8px) }
	#main .main-network .map .regionTxt-1 { font-size:1.3em; transform:translateY(8px) }
}


/* animation */
#main .main-network .map .land { opacity:0; }
#main .main-network .map.subOn .nMap_1 { animation:ani_3 0.5s 0.2s; animation-fill-mode:both; }
#main .main-network .map.subOn .nMap_2 { animation:ani_3 0.5s 0.4s; animation-fill-mode:both; }
#main .main-network .map.subOn .nMap_3 { animation:ani_3 0.5s 0.6s; animation-fill-mode:both; }
#main .main-network .map.subOn .nMap_4 { animation:ani_3 0.5s 0.8s; animation-fill-mode:both; }
#main .main-network .map.subOn .nMap_5 { animation:ani_3 0.5s 1.0s; animation-fill-mode:both; }
#main .main-network .map.subOn .nMap_6 { animation:ani_3 0.5s 1.2s; animation-fill-mode:both; }
#main .main-network .map.subOn .nMap_7 { animation:ani_3 0.5s 1.4s; animation-fill-mode:both; }
#main .main-network .map.subOn .nMap_8 { animation:ani_3 0.5s 1.6s; animation-fill-mode:both; }
#main .main-network .map.subOn .nMap_9 { animation:ani_3 0.5s 1.8s; animation-fill-mode:both; }



/* news */
#main .main-news { padding-top:185px; padding-bottom:60px; height:790px; overflow:hidden; }
#main .main-news .inner { display:flex; flex-wrap:wrap }
#main .main-news .title-box { width:calc(100% - 790px); }
#main .main-news .listbox {  position:relative; width:790px; }
#main .main-news .listbox ul { padding:10px 0 0 0; margin-right:-10px;  }
/*
#main .main-news .listbox li:not(:last-child) { margin-bottom:40px; transition:all 0.3s ease-in-out; }
#main .main-news .listbox li:hover { transform:translateX(-20px); }
*/
#main .main-news .listbox li .box { position:relative; width:100%; height:220px; padding:0 80px; display:flex; flex-direction:column; justify-content:center; box-shadow:0 0 10px rgba(0,0,0,0.1); border-radius:10px; }
#main .main-news .listbox li .box .bg { opacity:0; position:absolute; left:0; top:0; width:100%; height:220px; background-position:center center; background-repeat:no-repeat; background-size:cover; border-radius:10px; transition:all 0.3s ease-in-out; }
#main .main-news .listbox li .box .txtbox { position:relative; z-index:2; }
#main .main-news .listbox li .box dt { font-size:30px; color:#111; font-weight:500; line-height:1.2; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; transition:all 0.3s ease-in-out; }
#main .main-news .listbox li .box dd { margin-top:25px; height:90px; }
#main .main-news .listbox li .box dd .txt { font-size:17px; color:#333; font-weight:400; line-height:1.4; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; transition:all 0.3s ease-in-out; }
#main .main-news .listbox li .box .date { padding-left:20px; font-size:14px; line-height:1.1;color:rgba(51,51,51,0.7); font-weight:400; background:url(/img/main/icon_cal.png) no-repeat left 2px; transition:all 0.3s ease-in-out; }
#main .main-news .listbox .slick-list { padding:10px 10px 0 40px; margin:-20px 0; }
#main .main-news .listbox .slick-slide { margin:20px 0; transition:all 0.3s ease-in-out; }
#main .main-news .listbox .slick-slide:hover { transform:translateX(-20px); }
#main .main-news .listbox .slick-slide:hover .box .bg { opacity:1; }
#main .main-news .listbox .slick-slide:hover .box dt { color:#fff; }
#main .main-news .listbox .slick-slide:hover .box dd .txt { color:rgba(255,255,255,0.8); }
#main .main-news .listbox .slick-slide:hover .box .date { color:rgba(255,255,255,0.5); background:url(/img/main/icon_cal_on.png) no-repeat left 2px; }
#main .main-news .slick-btn { transition:all 0.3s ease-in-out; cursor:pointer; position:absolute; left:50%; margin-left:-28px; transform:translateY(-50%); width:100px; height:100px; border:1px solid rgba(0,0,0,0.3); border-radius:100px; z-index:55; display:flex;align-items: center; justify-content: center;  }
#main .main-news .slick-btn i { transition:all 0.3s ease-in-out; font-size:30px; color:rgba(0,0,0,0.6); }
#main .main-news .btn_prev { top:0; }
#main .main-news .btn_next { bottom:-100px; }
#main .main-news .slick-btn:hover { box-shadow:0 0 15px rgba(136,197,229,0.5); border:1px solid #0898e3 }
#main .main-news .slick-btn:hover i { color:#0898e3 }
@media screen and (max-width:1280px){
	#main .main-news { padding-top:160px; padding-bottom:100px; height:700px; }
	#main .main-news .title-box { width:calc(100% - 600px); }
	#main .main-news .listbox { width:600px;}
	#main .main-news .listbox li .box { height:210px; padding:0 55px; }
	#main .main-news .listbox li .box .bg { height:210px; }
	#main .main-news .listbox li .box dt { font-size:26px; }
	#main .main-news .listbox li .box dd { margin-top:20px; height:88px; }
	#main .main-news .listbox li .box dd .txt { font-size:16px; }
	#main .main-news .listbox li .box .date { padding-left:20px; font-size:14px; }
	#main .main-news .listbox .slick-list { padding:10px 10px 0 40px; margin:-18px 0; }
  #main .main-news .listbox .slick-slide { margin:18px 0; }
  #main .main-news .slick-btn { width:80px; height:80px; margin-left:-20px; }
  #main .main-news .slick-btn i {  font-size:25px; }
  #main .main-news .btn_prev { top:10px; }
  #main .main-news .btn_next { bottom:-87px; }
}
@media screen and (max-width:1024px){
	#main .main-news { padding-top:120px; height:730px; }
	#main .main-news .listbox li .box { height:160px; padding:30px 30px; }
	#main .main-news .listbox li .box .bg { height:160px; }
	#main .main-news .listbox li .box dd { margin-top:15px; height:65px; }
	#main .main-news .title-box { width:100%; }
	#main .main-news .title-box p br { display:none }
	#main .main-news .listbox { width:100%; margin-top:50px; }
	#main .main-news .listbox .slick-list { padding:10px 10px 0 0; }
	#main .main-news .listbox .slick-slide:hover { transform:translateX(0); }
}
@media screen and (max-width:640px){
	#main .main-news { padding-top:80px; height:560px; }
	#main .main-news .listbox { margin-top:30px; }
	#main .main-news .listbox li .box { height:140px; padding:20px 20px; }
	#main .main-news .listbox li .box .bg { height:140px; }
	#main .main-news .listbox li .box dt { font-size:20px; }
	#main .main-news .listbox li .box dd { margin-top:10px; height:60px; }
	#main .main-news .listbox li .box dd .txt { font-size:15px; }
	#main .main-news .listbox li .box .date { padding-left:18px; font-size:13px; }
  #main .main-news .listbox .slick-list { margin:-15px 0; }
  #main .main-news .listbox .slick-slide { margin:15px 0; }
  #main .main-news .slick-btn { width:50px; height:50px; }
  #main .main-news .slick-btn i {  font-size:20px; }
  #main .main-news .btn_prev { top:14px; }
  #main .main-news .btn_next { bottom:-57px; }
}


/* animation */
#main .main-news .listbox .slick-list { opacity:0; }
#main .main-news .listbox.subOn .slick-list { animation:ani_1 0.5s 0.2s; animation-fill-mode:both; }


/* Cursor */
.cursor { position:fixed; left:0;top:0; pointer-events:none !important; z-index:999999 !important;  background:none; display:none; }
.cursor.btnpn { display:block; position:absolute; width:106px; height:106px; border-radius:50%; pointer-events:none; transform:translate(-50%, -50%); }
.cursor.btnpn .cursor_arrows { pointer-events: none;position:absolute; top:50%; left:50%; background:none; transform:translate(-50%, -50%); width:100%; height:100%; border:none;  border-radius:180px; background:#0898e3 url(/img/main/icon_mouse.png) no-repeat center center }
.cursor.btnpn .cursor_arrows:before { content:'\e93f'; display:block; position:absolute; top:50%; right:-18px; transform:translateY(-50%);font-family:xeicon; color:#0898e3; font-size:18px; }
.cursor.btnpn .cursor_arrows:after { content:'\e93c'; display:block; position:absolute; top:50%; left:-18px; transform:translateY(-50%);font-family:xeicon; color:#0898e3; font-size:18px; }
.cursor.more { display:block; position:absolute; width:118px; height:118px; border-radius:50%; pointer-events:none; transform:translate(-50%, -50%); }
.cursor.more .cursor_arrows { pointer-events: none;position:absolute; top:50%; left:50%; background:none; transform:translate(-50%, -50%); width:100%; height:100%; border:none;  border-radius:180px; background-color:#0898e3; }
.cursor.more .cursor_arrows:before { content:'\e93f'; display:flex; align-items:center; justify-content:center; width:100%; height:100%; position:absolute; top:0; left:0; font-family:xeicon; color:#fff; font-size:16px; }
@media screen and (max-width:1024px){
	.cursor.btnpn,
	.cursor.more { display:none }
}