@charset "utf-8";

 








/* 手机端导航按钮样式一 */

#nav_btn_box{ height:100%; z-index:999; margin-left:20px; position:fixed; height:4.5rem; right:0; top: 0; display:none; }

#nav_btn_box .m{ height: 100%; display: flex; align-items: center;}

#nav_btn_box.on{ background:none;  }

#nav_btn{}

#nav_btn .point.on .navbtn::after, #nav_btn .point.on .navbtn::before{background: #a0a0a0;}

#nav_btn{ cursor: pointer; text-align: center;z-index:99999; padding-bottom:4px; transition:.5s;-webkit-transition:.5s;-moz-transition:.5s;-ms-transition:.5s;-o-transition:.5s; outline:none; box-shadow:none;}

#nav_btn .point{display: inline-block;width: 1.875rem;height: 22px; position: relative; outline:none;}

#nav_btn .navbtn{position: absolute;top: 12px;left: 0;display: inline-block;width: 18px;height: 2px;-webkit-transition: all .3s ease-out 0s;-moz-transition: all .3s ease-out 0s;-ms-transition: all .3s ease-out 0s;-o-transition: all .3s ease-out 0s;transition: all .3s ease-out 0s; background: #999; }

#nav_btn .navbtn::after,

#nav_btn .navbtn::before{position: absolute;left: 0;display: inline-block;width: 100%;height: 2px;content: '';-webkit-transition: all .3s ease-out 0s;-moz-transition: all .3s ease-out 0s;-ms-transition: all .3s ease-out 0s;-o-transition: all .3s ease-out 0s;transition: all .3s ease-out 0s;background: #999;}

.ny #nav_btn .navbtn::after,

.ny #nav_btn .navbtn::before{ background: #999;}

#nav_btn .navbtn::after{top: -6px;}

#nav_btn .navbtn::before{top: 6px;}

#nav_btn .point.on .navbtn{background: transparent;}

#nav_btn .point.on .navbtn::after{-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);-ms-transform: rotate(45deg);-o-transform: rotate(45deg);transform: rotate(45deg);top: 0px;}

#nav_btn .point.on .navbtn::before{-webkit-transform: rotate(-45deg);-moz-transform: rotate(-45deg);-ms-transform: rotate(-45deg);-o-transform: rotate(-45deg);transform: rotate(-45deg);top: 0px;}



/* 手机端导航按钮样式二 */
 

 

/* 手机端导航按钮样式三 */

.mtrans, .mtrans:hover {

    -webkit-transition: all .8s cubic-bezier(.19,1,.22,1) 0s;

    -moz-transition: all .8s cubic-bezier(.19,1,.22,1) 0s;

    transition: all .8s cubic-bezier(.19,1,.22,1) 0s;

    -ms-transition: all .8s cubic-bezier(.19,1,.22,1) 0s;

  }

.menu-handler{z-index:1000000;background: rgba(0,0,0,0.35);width: 48px;height: 45px;cursor:pointer;position: relative;transition:all .3s cubic-bezier(.445,.145,.355,1);-webkit-transition:all .3s cubic-bezier(.445,.145,.355,1);-moz-transition:all .3s cubic-bezier(.445,.145,.355,1);transform: scale(.7);}

.menu-handler .box{display:block;height:45px;overflow:hidden;position:  relative;}

.menu-handler::after{width:48px;height:45px;box-sizing:border-box;content:'';display:block;position:absolute;top:0;left:0;pointer-events:none;border:5px solid rgba(0,0,0,.3);-webkit-animation-duration:2s;animation-duration:2s;-webkit-animation-name:intervalHamburgerBorder;animation-name:intervalHamburgerBorder;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}

@-webkit-keyframes intervalHamburgerBorder{0%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}80%{-webkit-transform:scale(1.6);transform:scale(1.6)}100%{opacity:0;-webkit-transform:scale(1.6);transform:scale(1.6)}}

@keyframes intervalHamburgerBorder{0%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}80%{-webkit-transform:scale(1.6);transform:scale(1.6)}100%{opacity:0;-webkit-transform:scale(1.6);transform:scale(1.6)}}

.hamburger{width:45px;height:45px;display:block;position:relative;cursor:pointer;float:right;z-index:110;margin-top:50px;margin-right:20px;border:1px solid #fff;pointer-events:auto;-webkit-tap-highlight-color:transparent}

.menu-handler .burger{width: 26px;height: 2px;background: #fff;display:block;position:absolute;z-index:5;top: 13px;left:50%;margin: 0 0 0 -13px;transform-origin:center;-webkit-transform-origin:center;-moz-transform-origin:center;-o-transform-origin:center;-ms-transform-origin:center;}

.menu-handler .burger-2{top: 21px;}

.menu-handler .burger-3{top: 29px;}

.menu-handler.active .burger-1{top: 22px;-webkit-transform:rotate(225deg);-moz-transform:rotate(225deg);-ms-transform:rotate(225deg);transform:rotate(225deg);}

.menu-handler.active .burger-2{-ms-filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=0);filter:alpha(opacity=0);opacity:0;-moz-opacity:0;-khtml-opacity:0;-webkit-opacity:0;left:-100%}

.menu-handler.active .burger-3{top: 22px;-webkit-transform:rotate(-225deg);-moz-transform:rotate(-225deg);-ms-transform:rotate(-225deg);transform:rotate(-225deg);}

.fp-viewing-page1 .menu-handler{ opacity: 0; visibility: hidden;}

.nicescroll-cursors{ border: 0 !important; background-color: rgba(66, 66, 66,.5) !important;}

@keyframes clipPathLeft {

	0% {

		clip-path: polygon(30% 44%, 65% 44%, 65% 63%, 30% 63%);

	}

	100% {

		clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);

	}

}



@keyframes clipPathDown {

	0% {

		clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%);

	}

	10% {

		clip-path: polygon(0 0, 100% 0, 100% 78%, 0 36%);

	}

	100% {

		clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);

	}

}

@keyframes fadeUpAni {

	0% {

		opacity:0;

		transform:translate3d(0,100%,0);

	}

	100% {

		opacity:1;

		transform:translate3d(0,0%,0);

	}

}

@keyframes opacityAni {

	0% {

		opacity:0;

	}

	100% {

		opacity:1;

	}

}





.menubtn{ width:40px; height: 40px; padding: 9px; border-radius: 2px; position: relative; cursor: pointer; display: flex; align-items: center; transition: .5s;}
.menubtn.active{ background: rgba(0, 51, 128, 0) !important;}
.menubtn span{display:block;width: 18px;height: 2px;background:#fff;position:relative;vertical-align: middle;-webkit-transition-duration: .3s,.3s;-moz-transition-duration: .3s,.3s;-ms-transition-duration: .3s,.3s;-o-transition-duration: .3s,.3s;transition-duration: .3s,.3s;-webkit-transition-delay: .3s,0s;-moz-transition-delay: .3s,0s;-ms-transition-delay: .3s,0s;-o-transition-delay: .3s,0s;transition-delay: .3s,0s;}
.menubtn span:after,
.menubtn span:before {content:"";position:absolute;display:inline-block;width:115%;height:2px;left:0;background:#fff;-webkit-transition-duration: .3s,.3s;-moz-transition-duration: .3s,.3s;-ms-transition-duration: .3s,.3s;
 -o-transition-duration: .3s,.3s;transition-duration: .3s,.3s;-webkit-transition-delay: .3s,0s;-moz-transition-delay: .3s,0s;-ms-transition-delay: .3s,0s;-o-transition-delay: .3s,0s;transition-delay: .3s,0s;
}
.menubtn span:before {top: -6px;-webkit-transition-property: top,transform;-moz-transition-property: top,transform;-ms-transition-property: top,transform;-o-transition-property: top,transform;transition-property: top,transform;}
.menubtn span:after {bottom: -6px;-webkit-transition-property: bottom,transform;-moz-transition-property: bottom,transform;-ms-transition-property: bottom,transform;-o-transition-property: bottom,transform;transition-property: bottom,transform;}
.menubtn.active span {background-color: transparent;-webkit-transition-delay: 0s,0s;-moz-transition-delay: 0s,0s;-ms-transition-delay: 0s,0s;-o-transition-delay: 0s,0s;transition-delay: 0s,0s}
.menubtn.active span:after,.menubtn.active span:before { background-color: #fff !important;-webkit-transition-delay: 0s,.3s;-moz-transition-delay: 0s,.3s; -ms-transition-delay: 0s,.3s; -o-transition-delay: 0s,.3s; transition-delay: 0s,.3s}
.menubtn.active span:before {top: 0px;-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);-ms-transform: rotate(45deg);-o-transform: rotate(45deg);transform: rotate(45deg)}
.menubtn.active span:after {bottom:0px;-webkit-transform: rotate(-45deg);-moz-transform: rotate(-45deg);-ms-transform: rotate(-45deg);-o-transform: rotate(-45deg);transform: rotate(-45deg);}


/* 视频弹窗 */



.tc_btn {

    cursor: pointer;

  }

  

  .tc_video {

    width: 90%;

    max-width: 800px;

    margin: 0 auto;

    background: none;

    position: relative;

  }

  

  .tc_video #my-video {

    position: relative;

    height: 0;

    padding-top: 60%;

  }

  

  .tc_video #my-video video {

    width: 100%;

    height: 100%;

    position: absolute;

    left: 0;

    top: 0;

  }

  

  .tc_video .tc_close {

    display: block;

    position: absolute;

    top: -2rem;

    right: -3rem;

    border-radius: 50%;

  }

  

  .video-js {

    width: 100% !important;

    height: 100% !important;

  }

  

  .video-js .vjs-big-play-button {

    left: 50% !important;

    top: 50% !important;

    margin-left: calc(-1.6rem - 5px);

    margin-top: calc(-1.6rem - 5px);

    background-color: rgba(0, 0, 0, 0) !important;

  }

  

  video {

    object-fit: fill;

  }

  

  .vjs-poster {

    background-size: cover !important;

  }

  

  .s_video .mask {

    position: absolute;

    left: 0;

    top: 0;

    width: 100%;

    height: 100%;

    display: flex;

    align-items: center;

    justify-content: center;

  }

  

  .s_video {

    position: relative;

  }