/* banner */
#banner{position:relative;z-index:10}
#banner img.dight{position:absolute;bottom:0;left:50%;-webkit-transform:translate(-50%,0);transform:translate(-50%,0);z-index:11;min-width:100%;width:1920px}
#banner .workframe{margin:60px 30px 60px auto;position:relative;width:370px}
.scrollDownBox #scroll_btn:after{content:"";width:80px;height:1px;display:block;background:#2f2e4047;margin:-6px 0px;position:absolute;top:10px;left:-100px}
#banner .fix_txt .btn{padding:15px 50px;width:120px;height:120px;left:50%;border:1px rgb(211 211 211 / 25%) solid;display:block;opacity:1;position:absolute;border-radius:50%;display:flex;justify-content:center;align-items:center;z-index:5;background:var(--secondary);left:0;right:0;margin:auto;display:none}
#banner .fix_txt .btn:before{position:absolute;width:0;height:100%;display:block;top:0;left:0;z-index:1;content:"";border-radius:50%}
#banner .fix_txt .btn font{position:relative;font-weight:400;color:#ffffff;z-index:2;font-size:13px}
#banner .fix_txt .btn font svg{width:18px;height:15px;display:inline-block;fill:#ffffff;vertical-align:middle}
#banner .item:hover .btn{border:1px rgb(211 211 211 / 25%) solid}
#banner .item:hover .fix_txt .btn:before{width:100%;background:var(--thirdly)}
#banner .item:hover .fix_txt .btn font{color:#fff}
#banner .item:hover .fix_txt .btn font svg{fill:#fff}
#banner .img_box img{position:relative;background:no-repeat 50% / cover;margin:auto 80px 0 0px;padding:0;border-radius:0 30px 30px 0;width:1460px;height:100%;background:no-repeat 50% / cover;margin:0 auto 0 0}
#banner .img_box video,#banner .img_box iframe{position:absolute;width:100%;height:100%;top:50%;left:50%;transform:translate(-50%,-50%)}
#banner .info_box{min-width:100vw;height:100%;display:flex;align-items:center;top:0}
#banner .fix_txt:before{content:'';position:absolute;height:97px;width:84px;top:-180px;left:0;background:url(/images/00/img-bn-01.png);background-repeat:no-repeat;z-index:0}
#banner .fix_txt:after{content:'';position:absolute;height:218px;width:245px;bottom:-180px;right:0;background:url(/images/00/img-bn-02.png);background-repeat:no-repeat;z-index:-1}
#banner .info_box h2{overflow:hidden;width:0;font-weight:600;font-size:5.8vmin;line-height:120%;text-underline-offset:5px;color:#00396d;white-space:nowrap;/* -webkit-transition-duration:.5s; *//* transition-duration:.5s; */margin-top:20px}
#banner .info_box h3{word-spacing: 0.4vmin;font-weight:300;font-size: 2.1vmin;color:#00396d;white-space:pre-line;font-weight:500;letter-spacing: 0;position:relative}
#banner .info_box p{color:#00396d;font-size:2.6vmin;font-weight:500;line-height:170%;position:relative}
#banner .banner_dots{position:absolute;width:100vw;bottom:10px;left:0;display:none}
#banner .banner_dots a{margin-right:15px;padding:5px 10px 5px 0;display:inline-flex;align-items:center;color:#fff}
#banner .banner_dots a:after{margin-left:10px;width:40px;height:2px;background:#fff;display:block;content:""}
#banner .slick-current h2{width:100%;-webkit-transition-delay:.5s;transition-delay:.5s}
#banner .slick-current h3{-webkit-transition-delay:.7s;transition-delay:.7s}
#banner .item .atag_item{z-index:10}
#banner .item .fix_txt .btn:after{content:"";position:absolute;top:6%;left:6%;width:calc(100% - 6% * 2);height:calc(100% - 6% * 2);border:1px solid rgba(255,255,255,0.3);border-radius:50%;z-index:6}


/* banner_btns */
.banner_btns{height:30%;display:flex;position:absolute;right:calc(2vw - -3px);bottom:490px;align-items:center;display:none}
.banner_btns a{display:block}
.banner_btns a.fb_icon{margin-bottom:1.5rem}
.banner_btns a svg{width:24px;height:24px;fill:#173054}

/* scroll_btn */
.scrollDownBox{position:absolute;right:calc(18vw - -45px);bottom:20px;margin:auto;z-index:20}
.scrollDownBox #scroll_btn{text-align:center;flex-direction:column;position:absolute;align-items:center;letter-spacing:.3em;font-weight:300;font-size:12px;left:30px;white-space:nowrap;transform:rotate(90deg);transform-origin:top left;display:flex;bottom:-10px;padding:0px 10px;animation:godown 1s infinite linear;-webkit-animation:godown 1s infinite linear;text-transform:uppercase;z-index:10}
@-webkit-keyframes godown { 0% , 100% { padding: 0 0 0px 0px; } 50% { padding: 0px 0 0px 0px; } }
@keyframes godown { 0% , 100% { padding: 0px 0 0px 0px; } 50% { padding: 0px 0 0px 10px; } }
.scrollDownBox #scroll_btn:before{position:absolute;width:9vmin;height:50vmin;background:#fff;display:block;left:0;bottom:0;content:"";width:60px;height:60px;border-radius:50%;background-color:#fff;-webkit-transform:translate(0%,40%);transform:translate(-30%,40%);-webkit-box-shadow:2px 5px 10px rgba(0,0,0,0.2);box-shadow:2px 5px 10px rgba(0,0,0,0.2)}
.scrollDownBox #scroll_btn .dot{font-size:13px;padding-bottom:12px;letter-spacing:2.5px;font-size:12px;color:#173054;display:none}
.scrollDownBox #scroll_btn .arrow{border:solid #173054;border-width:0 1px 1px 0;display:inline-block;padding:5px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);background-color:#fff}

@media screen and (min-width:1141px){
	#banner .info_box p{padding-left:0}
	#banner .info_box p::before{content:"";width:120px;height:1px;display:block;background:#bcbcbc;margin-right:0;position:absolute;top:50%;right:0px}
}
@media screen and (max-width:1800px){
	#banner .img_box img{width:1340px}
	#banner .workframe{width:330px}
}
@media screen and (max-width:1580px){
	#banner .img_box img{width:1160px}
	#banner .workframe{width:290px}
}
@media screen and (max-width:1500px){
	#banner .workframe{width:340px;margin-right:50px}
	.banner_btns a svg{fill:#fff}
	#scroll_btn:before,#scroll_btn:after{background:#fff}
	#scroll_btn span{color:#fff}
	#banner .img_box img{width:100%;height:100%;background:no-repeat 50% / cover;margin:auto 80px 0 0px;max-width:1020px}
	.scrollDownBox{right:calc(24vw - -45px);bottom:-10px}
}
@media screen and (max-width:1440px){
	#banner .img_box img{max-width:980px}
}
@media screen and (max-width:1366px){
	#banner .img_box img{max-width:850px}
}
@media screen and (max-width:1280px){
	#banner .img_box img{margin:auto 80px 0 0px;max-width:940px}
	#banner .info_box h2{font-size:40px}
	#banner .workframe{width:260px;margin-right:50px}
	.scrollDownBox{right: calc(24vw - -5px);bottom:-10px}
}
@media screen and (max-width:1140px){
	#banner .item .atag_item{position:relative}
	#banner .workframe{width:auto;margin-right:0;margin:30px auto}
	#banner .img_box img{margin:auto;max-width:100%;border-radius:0}
	#banner .fix_txt:before,#banner .fix_txt:after,.scrollDownBox{display:none}
	#banner .info_box p,#banner .info_box h2,#banner .slick-current h3{text-align:center}
	#banner .info_box{position:relative}
}
@media screen and (max-width:960px){
	.scrollDownBox{display:none}
	#banner .slick-current h2{font-size:42px;margin-top:10px}
	#banner .info_box h3{margin-top:10px;font-size:18px;width:auto}
	#banner .fix_txt .btn{padding:15px 30px;width:60px;height:60px;border:1px rgb(211 211 211 / 25%) solid;opacity:1;position:absolute;border-radius:50%;display:flex;justify-content:center;align-items:center;z-index:5;background:var(--secondary);right:auto;left:0px;bottom:30px;display:none}
	#banner .banner_dots{display:none}
	.banner_btns{right:5vmax;height:60%}
	#banner .info_box p{font-size:22px;margin:0}
}
@media screen and (max-width:640px){
	#banner .img_box img{min-height:60vw;height:60vw}
	#scroll_btn:before{bottom:5vh}
	#scroll_btn:after{height:7vh}
	@-webkit-keyframes scroll_dot{0%,100%{bottom:5vh}
	50%{bottom:0}
	}
	@keyframes scroll_dot{0%,100%{bottom:5vh}
	50%{bottom:0}
	}
	#banner .fix_txt .btn{bottom:-80px;display:none}
}
@media screen and (max-width:550px){
	#banner .workframe{padding:calc(30px + 0vmax);width:100vw;margin:0px auto}
#banner .info_box h2{}
#banner .info_box h3{}
}
