@charset "utf-8";

.pc_br {display:block;}
.pt_br {display:block;}
.tb_br {display:none !important;}
.tm_br {display:none !important;}
.mb_br{display:none !important;}

/* ========================================================================== */

.outline span{background:#fff;position: fixed;z-index: 5;-webkit-transition: .3s ease-out;transition: .3s ease-out;}
.outline span.l1{top:0;left:0;width:100%;height:0px}
.outline span.l2{top:0;right:0;height:100%;width:0px}
.outline span.l3{bottom:0;right:0;width:100%;height:0px}
.outline span.l4{bottom:0;left:0;height:100%;width:0px}
.outline.on span.l1{height:10px}
.outline.on span.l2{width:10px}
.outline.on span.l3{height:10px}
.outline.on span.l4{width:10px}
#main_slide_g {min-height: 750px;}
#wrap footer{position:absolute;bottom:0;left:0;width:100%;z-index:0;opacity:0;transition:1s 1.2s;transform:translateY(30px)}
#wrap .swiper-slide.on footer{transition-delay:.6s;opacity:1;transform:translateY(0px);background:0}
#main_slide_g{height:100vh;position:relative;width:100%;background:#111;}
#main_slide{height:100%}
#main_slide .text_g{position:absolute;top:0;left:0;z-index:1;width:100%;height:100%;display:flex;align-items:flex-end}
#main_slide .text_g em{font-weight:600}
#main_slide .text{margin-left:15%}
#main_slide .product-cate-logo{margin-left:15%}
#main_slide .product-logo{margin-left:15%;margin-bottom:25px}
#main_slide .img{height:100%;background:#000 url(/img/main/v1.jpg) no-repeat center /cover;transition:opacity .8s .4s,transform .8s .3s;transform: scale(1.2) rotate(0.00002deg);}
#main_slide .swiper-slide.on .img{opacity:1;transform: scale(1) rotate(0.00002deg);}
#main_slide .v2 .img{background-image:url(/img/main/v2.jpg)}
#main_slide .v3 .img {
    background: #1a1615;
}
#main_slide .v4 .img{background-image:url(/img/main/v4.jpg)}
#main_slide .sub_text{color:rgba(255,255,255,0.8);font-size:2rem;font-weight:300;opacity:0;transition:transform .8s .7s,opacity 1s 1s;transform:translateX(50px)}
#main_slide .swiper-slide.on .sub_text{opacity:1;transform:translateX(0px)}
#main_slide tspan{font-size:9.4rem;color:transparent;paint-order:stroke;stroke:#fff;stroke-width: 3px;font-weight: 700;stroke-linecap:butt;stroke-linejoin:miter;fill:rgba(255,255,255,0);font-family:'Montserrat',sans-serif;line-height:1.3;letter-spacing:-1.5px;}
#main_slide .swiper-slide text{opacity:0;transition:.8s .6s;transform:translateX(50px)}
#main_slide .swiper-slide.on text{opacity:1;transform:translateX(0px)}
#main_slide .swiper-slide tspan{opacity:0;transition:.8s .6s}
#main_slide .swiper-slide.on tspan{opacity:1}
#main_slide .swiper-slide.on tspan:nth-child(2){transition-delay:1s}
#main_slide tspan.b{fill:#fff;stroke-width:0}
#main_slide .text_b{width:100%;padding:0 140px;box-sizing:border-box;margin-bottom:130px}
#main_slide svg{width:100%;height:260px}
#main_slide .text_g:before{content:'';position:absolute;bottom:279px;left:0;width:100%;height:1px;background:rgba(255,255,255,0.3);opacity: 0;}
#main_slide .v3 .img .bg1 {
    position: absolute;
    top: 10px;
    left: 10px;
    width: 0;
    height: calc(50% - 10px);
    background: url(/img/main/v3_bg1.jpg) no-repeat left top;
    transition: opacity .8s .4s,width .8s .3s;
}
#main_slide .v3 .img .bg2 {
    position: absolute;
    top: 10px;
    left: 50%;
    width: calc(50% - 10px);
    height: 0;
    background: url(/img/main/v3_bg2.jpg) no-repeat left top;
    transition: opacity .8s .4s, height .8s .3s;
}
#main_slide .v3.on .img .bg1 {
    width: calc(50% - 10px);
}
#main_slide .v3.on .img .bg2 {
    height: calc(100% - 20px);
}
.main_slide_util{position:absolute;bottom:110px;right:140px;z-index:10}
.main_slide_util .btn{font-size:0;width:9px;height:17px;position:relative;padding:15px}
.main_slide_util .btn:before{content:'';position:absolute;top:9px;left:11px;width:10px;height:10px;transform:rotate(45deg);border-left:1px solid #fff;border-bottom:1px solid #fff}
.main_slide_util .btn.next:before{transform:rotate(-135deg);left:unset;right:11px}
.main_slide_util .swiper-pagenav{display:flex;align-items:center;font-size:0}
.main_slide_util .swiper-pagination-bullet{position:relative;width:17px;height:17px;border-radius:unset;border:unset;opacity:unset;background:0;margin-top:-1px;outline:0}
.main_slide_util .swiper-pagination-bullet + .swiper-pagination-bullet{margin-left:7px}
.main_slide_util .swiper-pagination-bullet:before{content:'';position:absolute;width:7px;height:7px;border:1px solid #fff;box-sizing:border-box;border-radius:5px;top:5px;left:5px}
.main_slide_util .swiper-pagination-bullet-active:after{content:'';position:absolute;top:0;left:0;width:100%;height:100%;border-radius:100%;border:1px solid #fff;box-sizing:border-box}
.main_slide_util .swiper-pagination-bullet-active:before{background:#fff}
.swiper-slide{z-index:1;overflow: hidden;}
.notice_wrap{display:flex;flex-direction:column;justify-content:center;padding:0 140px;box-sizing:border-box;z-index:0}
.section_title{font-size:3.6rem;color:#fff;line-height:1em;font-family:'Montserrat',sans-serif;font-weight:600;opacity:0;transition:1s 1.2s}
.swiper-slide.on .section_title{opacity:1;transition-delay:.4s}
#notice_slide{margin:40px 0 20px;opacity:0;transition:1s 1.2s;transform:translateY(30px);width:100%}
.swiper-slide.on #notice_slide{opacity:1;transition-delay:.5s;transform:translateY(0px)}
.notice_list .item{border:1px solid #888;box-sizing:border-box;position:relative;transition:.3s;height:auto}
.notice_list .item a{display:block;padding:48px 34px 120px;box-sizing:border-box}
.notice_list .item:hover{border-color:#3199c7}
.notice_list .item:nth-child(4){margin-right:0}
.notice_cate{padding:0 11px;height:28px;display:block;border:1px solid #3199c7;box-sizing:border-box;line-height:28px;text-align:center;font-family:'Montserrat',sans-serif;color:#3199c7;font-weight:700;display:inline-block;vertical-align:top;transition:.3s}
.item:hover .notice_cate{transform:translateY(30px)}
.notice_title{font-size:2rem;color:#fff;letter-spacing:-.4px;-webkit-line-clamp:2;margin-top:18px;height:58px;transition:.3s}
.item:hover .notice_title{transform:translateY(45px);transition:.3s}
.notice_text{font-size:1.7rem;color:rgba(255,255,255,0.8);letter-spacing:-.5px;-webkit-line-clamp:2;font-weight:300;margin-top:10px;transition:.3s}
.item:hover .notice_text{opacity:0}
.notice_date{font-size:1.6rem;color:#fff;font-weight:300;margin-top:18px;display:block;transition:.3s}
.item:hover .notice_date{opacity:0}
.notice_list .arr{width:49px;height:49px;border-radius:50px;background:#3199c7;position:absolute;bottom:38px;left:auto;display:flex;align-items:center;justify-content:center;transition:.3s}
.notice_list .item:hover .arr{transform:scale(0.95) translateY(-60px)}
.notice_list .i_arr{width:20px;height:7px;display:block;position:relative}
.notice_list .i_arr:before{content:'';position:absolute;top:3px;left:0;width:100%;height:1px;background:#111}
.notice_list .i_arr:after{content:'';position:absolute;top:1px;right:1px;width:5px;height:5px;border-right:1px solid #111;border-bottom:1px solid #111;box-sizing:border-box;transform:rotate(-45deg)}
.notice_bg{width:585px;height:583px;background:url(/img/main/notice_fig.jpg) no-repeat left top;position:absolute;top:-45px;right:-90px;z-index:-1;transform:scale(0);transition:1s .6s;opacity:0}
.swiper-slide.on .notice_bg.fig1{transform:scale(1);opacity:1}
.swiper-slide.on .notice_bg.fig2{transform:scale(1) rotate(45deg);opacity:1}
.notice_bg.fig2{left:-200px;bottom:-260px;top:unset;right:unset;transition-delay:1s}
.notice_slide_util .btn{width:64px;height:40px;position:relative}
.notice_slide_util .btn:before{content:'';position:absolute;top:12px;left:26px;width:16px;height:16px;transform:rotate(45deg);border-left:1px solid #fff;border-bottom:1px solid #fff}
.notice_slide_util .btn.next:before{transform:rotate(-135deg);left:unset;right:26px}
.notice_slide_util{position:absolute;top:0;right:-22px;font-size:0;z-index:1;opacity:0;transition:1s 1.2s;transform:translateY(30px)}
.swiper-slide.on .notice_slide_util{transition-delay:.6s;opacity:1;transform:translateY(0px)}
.notice_slide_util:before{content:'';position:absolute;top:8px;left:50%;width:1px;height:25px;background:rgba(255,255,255,0.3);z-index:1}
.notice_layout{position:relative;z-index:1}

@media (max-width: 1500px) {
#main_slide .text_b{padding:0 5%;margin-bottom:100px}
#main_slide .text_g:before {bottom: 252px;}
.notice_wrap{padding:0 5%;}
}

@media (max-height: 800px) {
	.notice_text{display:none}
	.notice_title{-webkit-line-clamp:1;height:30px}
	.notice_date{margin-top:12px}
	.notice_list .item:hover .arr{transform:scale(0.95) translateY(-20px)}
	.item:hover .notice_title{transform:translateY(25px)}
}