*{ margin: 0; padding: 0; font-family: "微软雅黑"; font-size: 16px; color: #222327; box-sizing: border-box;}
img{ border: 0; -ms-interpolation-mode: bicubic; outline: 0;}
a,p,span,h1,i{ text-decoration: none; margin: 0;}
li,ul{ list-style: none;}
input,button{ border: none; outline: none; background: none; margin: 0;}
a{cursor: pointer;}
a,li{cursor: pointer;-webkit-tap-highlight-color: rgba(255, 255, 255, 0);
-webkit-user-select: none;
-moz-user-focus: none;
-moz-user-select: none;}
@font-face {
    font-family : written;
    src : url(../font/impact.ttf);
}
@font-face {
    font-family : boldcond;
    src : url(../font/MyriadPro-BoldCond.otf);
}


.header{ position: fixed; width: 100%; top: 0; left: 0; z-index: 99999; background: #fff; text-align: center; transition: all 0.5s;}
.header .header_logo{ float: left; overflow: hidden;}
.header_logo img{ float: left;}
.header_pc{ float: right; opacity: 1; visibility: visible; transition: all 0.5s; opacity: 1; visibility: visible;}
.header_pc ul::after{ content:''; display:block; width: 0; height:0; clear:both; visibility:hidden;}
.header_pc .header_topic{ float: left; cursor: pointer; position: relative; transition: all 0.3s;}
.header_pc .header_active{ background: #0d53a9;}
.header_pc .header_active .header_word01 a{ color: #fff;}
.header_word01{ transition: all 0.3s; position: relative;}
.header_word01 a{ display: inline-block; color: #333;}
.header_word02{ position: absolute; left: 0; z-index: 99999; width: 100%; padding: 0; background: #fff; box-shadow: 0 1px 3px #e1e1e1;
opacity: 0; visibility: hidden; transition: all 0.5s;}
.header_word02 a{ display: block; white-space: nowrap; text-align: center;}
.header_tip{ float: right; overflow: hidden; cursor: pointer; transition: all 0.5s;}
.searcher{ position: absolute; width: 30%; padding: 0 4% 0 3%; right: 20%; z-index: 2000; border-bottom: solid 1px #0d53a9; 
transition: all 0.5s ease 0.2s; opacity: 0; visibility: hidden;}
.searcher input{ width: 100%;}
.searcher img{ position: absolute; top: 50%; transform: translateY(-50%); z-index: 3000; cursor: pointer; transition: all 0.3s;}
.header_tip_act{ opacity: 0; visibility: hidden;}
.header_pc_act{ opacity: 0; visibility: hidden;}
.searcher_act{ opacity: 1; visibility: visible;}
.searcher .search_close:hover{ transform: translateY(-50%) rotate(180deg);}

.header_topic:hover{ background: #0d53a9;}
.header_topic:hover .header_word01 a{ color: #fff;}
.header_topic:hover .header_word02{ opacity: 1; visibility: visible; padding: 15px 0;}
.header_topic:hover .header_word02 span{ width: 100%;}
.header_word02 a:hover{ color: #0d53a9; font-weight: bold;}

.header_title{ display: none; position: fixed; width: 100%; left: 0; top: 0; z-index: 999999; background: #004aa4;}
.header_title01{ padding: 1rem 8%; border-bottom: solid 1px #215faa; overflow: hidden; line-height: 1.2rem;}
.header_title01 p{ color: #fff; font-weight: bold; float: left; font-size: 0.8rem;}
.header_title01 span{ color: #fff; font-weight: bold; float: right; font-size: 0.9rem; padding: 0 0 0.15rem 0.3rem;}
.header_title02{ max-height: 80vh; overflow-y: scroll;}
.dropdown-menu{ border-bottom: solid 1px #215faa;}
.dropdown-menu p{ font-size: 0.7rem; color: #fff; padding: 0 8%; line-height: 2.2rem;}
.dropdown-menu ul{ display: flex; align-items: center; flex-wrap: wrap; padding: 0.3rem 0 0.3rem 8%; background: #1e69c3;}
.dropdown-menu li{ line-height: 1.8rem; height: 1.8rem;} 
.dropdown-menu .dropdown-ul li{ width: 49%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #fff; text-align: left;}
.dropdown-menu li a{ font-size: 0.65rem; color: #fff;}

.container{ margin: 0 auto;}
.flow{ overflow: hidden;}
.rel{ position: relative;}
.proL{ float: left;}
.proR{ float: right;}
.banner{ position: relative;}
.banner_pic{ width: 100%; height: 70vh; overflow: hidden;}
.banner_pic img{ width: 100%; height: 100%; object-fit: cover; object-position: center top;}
.banner_word{ position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 9;}
.pvBtn,.ntBtn{ position: absolute; top: 50%; transform: translateY(-50%); z-index: 99; cursor: pointer;}

.product{ padding: 2em 0;}
.product_title{ position: relative;}
.product_title p{ color: #333; font-family: written; text-transform: uppercase;}
.product_title span{ display: block; font-weight: bold;}
.product_title .product_hue01{ color: #004aa4;}
.product_title .product_hue02{ color: #fff;}
.product_title button{ background: #004aa4; box-shadow: 0 2px 12px #95bcec; color: #fff; text-align: center; cursor: pointer;}
.product_title .product_cen{ text-align: center;}
.product_title h1{ color: #000;}
.product_title h2{ color: #000; font-family: written; font-weight: normal; letter-spacing: 1px; text-transform: capitalize;}
.product_title button:hover{ background: #004190;}

.info_bg{ background: url(../img/info_tu.png) left top no-repeat;}
.info_title{ position: relative;}
.info_pic{ width: 100%; overflow: hidden; border-bottom: solid 1px #fff;}
.info_pic img{ display: block; width: 100%; height: 100%; object-fit: cover;}
.info_btn{ position: absolute; top: 50%; transform: translateY(-50%); z-index: 99; background: #004aa4; 
box-shadow: 0 2px 12px #95bcec; color: #fff; text-align: center; cursor: pointer;}
.info_btn:hover{ background: #004190;}
.info_r li{ overflow: hidden; position: relative;}
.info01{ float: left;}
.info02{ float: right;}
.info01 span,.info02 p,.info02 button{ display: none;}
.info01 span{ font-family: written;}
.info01 p{ color: #fff; background: #0d53a9; text-align: center;}
.info02 h1{ color: #333; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden;}
.info02 button{ background: #004aa4; box-shadow: 0 2px 12px #95bcec; color: #fff; text-align: center;}
.info_line{ display: none; position: absolute; left: 0; top: 0; z-index: 9; height: 100%; background: #004aa4;}
.info_active .info01 span,.info_active .info02 p,.info_active .info02 button{ display: block;}
.info_active .info02 h1{ -webkit-line-clamp: 2;}
.info_active .info02 p{ display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;}
.info_active .info_line{ display: block;}
.info_active .info02 button:hover{ background: #004190; cursor: pointer;}
.poster{ width: 100%;}
.poster img{ display: block; width: 100%;}

.plate ul{ overflow: hidden;}
.plate li{ float: left; position: relative;}
.plate_bg{ width: 100%; overflow: hidden;}
.plate_bg img{ display: block; width: 100%; height: 100%; object-fit: cover; transition: all 0.5s;}
.plate_w{ position: absolute; top: 50%; transform: translateY(-50%); z-index: 9;}
.plate_w p{ color: #fff; letter-spacing: 8px;}
.plate_w span{ color: #fff; font-family: written; text-transform: uppercase; letter-spacing: 2px;}
.plate_w img{ position: absolute; right: 0; top: 50%; transform: translateY(-50%); z-index: 99;}
.plate li:hover .plate_bg img{ transform: scale(1.03);}

.rule_bg{ background: url(../img/rule_tu.png) right bottom no-repeat; background-size: 90% 100%;}
.rule ul::after{ content:''; display:block; height:0; clear:both; visibility:hidden;}
.rule li{ float: left; background: #fff; box-shadow: 0 5px 30px #bbb; transition: all 0.3s;}
.rule span{ display: inline-block; background: #0d53a9; color: #fff; letter-spacing: 2px;}
.rule p{ font-family: written;}
.rule section{ color: #000; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;}
.rule li:hover{ box-shadow: 0 8px 50px #aaa;}

.intro_bg{ background: url(../img/intro_tu.jpg) center no-repeat; background-size: cover;}
.intro_w{ text-align: center;}
.intro_pic{ overflow: hidden;}
.intro_pic li{ float: left; text-align: center; position: relative;}
.intro_pic section{ position: absolute; top: 50%; transform: translateY(-50%); z-index: 9; color: #fff;}
.intro_pic p{ color: #fff;}
.intro_pic span{ color: #fff;}

.clubber_bg{ background: url(../img/clubber_tu.jpg) center no-repeat; background-size: cover;}
.clubberswiper .swiper-slide .clubber_pic{ text-align: center; overflow: hidden;}
.clubber_btn button{ background: #004aa4; color: #fff; text-align: center; cursor: pointer;}
.clubber_btn button:hover{ background: #004190;}
#clubber-scrollbar{ background: rgba(255,255,255,0.2);}
#clubber-scrollbar .swiper-scrollbar-drag{ background: #fff;}

.footer{ background: url(../img/footer_bg.jpg) center no-repeat; background-size: cover;}
.footer01a{ float: left;}
.footer01b{ float: right;}
.footer01a .line{ height: 2px; background: #004aa4;}
.footer01a span{ display: inline-block; color: #000; letter-spacing: 2px;}
.footer01a p{ font-family: boldcond; letter-spacing: 5px;}
.footer01a h1{ color: #000; font-weight: normal; letter-spacing: 3px;}
.footer01b ul{ overflow: hidden;}
.footer01b li{ float: left;}
.footer01b p{ color: #000; font-weight: bold;}
.footer01b span{ display: block;}
.footer02{ background: #004aa4; overflow: hidden;}
.footer02 span{ color: #fff; float: left;}
.footer02 span a{ color: #fff; display: inline-block;}
.footer02 p{ color: #fff; float: right;}
.footer01b span:hover{ text-decoration: underline;}

.picture{ width: 100%; height: 47vh; overflow: hidden; position: relative;}
.picture img{ width: 100%; height: 100%; object-fit: cover;}
.picture_word{ position: absolute; bottom: 0; z-index: 99; background: url(../img/pic_bg.png) left bottom no-repeat;}
.picture_word p{ color: #fff; font-family: written; letter-spacing: 5px; text-transform: uppercase;}
.picture_word h1{ font-weight: normal; color: #fff; letter-spacing: 3px;}

.about_bg{ background: url(../img/aboutbg.png) center top no-repeat; background-size: 100%;}
.about ul{ overflow: hidden;}
.about li{ float: left; position: relative;}
.about_pic{ width: 100%; overflow: hidden;}
.about_pic img{ display: block; width: 100%; height: 100%; object-fit: cover; transition: all 0.5s;}
.about_w{ position: absolute; top: 50%; z-index: 99;}
.about_w span{ display: block; color: #fff;}
.about_w button{ background: #004aa4; color: #fff; text-align: center; cursor: pointer; transition: all 0.2s;}
.about_icon{ width: 100%; position: absolute; bottom: 0; right: 0; z-index: 9;}
.about li:hover .about_pic img{ transform: scale(1.05);}
.about_w button:hover{ background: #004190;}

.guide ul{ overflow: hidden;}
.guide li{ float: left; color: #fff;}
.guide li a{ display: inline-block; color: #fff;}

.news li{ border-bottom: dashed 1px #ddd;}
.news li::after{ content:''; display:block; height:0; clear:both; visibility:hidden;}
.news_tip{ float: left;}
.news_tip span{ display: inline-block; font-family: written;}
.news_tip p{ color: #fff; background: #0d53a9; text-align: center;}
.news_pic{ float: left; overflow: hidden;}
.news_pic img{ width: 100%; height: 100%; object-fit: cover;}
.news_w{ float: right; position: relative;}
.news_w h1{ overflow: hidden; text-overflow:ellipsis; white-space: nowrap;}
.news_w p{ display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;}
.news_w button{ position: absolute; bottom: 0; left: 0; z-index: 99; background: #004aa4; color: #fff; box-shadow: 0 2px 12px #95bcec; text-align: center; cursor: pointer;}
.news_w button:hover{ background: #004190;}
.news li:hover .news_w h1{ color: #004aa4;}

/* .pagination{ overflow: hidden;}
.pagination p{ display: inline-block; border: solid 1px #dcdcdc; text-align: center; transition: all 0.2s;}
.pagination span{ display: inline-block; border: solid 1px #dcdcdc; text-align: center;}
.pagination p:hover{ background: #004190; border: solid 1px #004190; color: #fff;}
.pagination span:hover{ background: #004190; border: solid 1px #004190; color: #fff;}
.pagination .page_active{ background: #004190; border: solid 1px #004190; color: #fff;} */

.download li{ border-bottom: dashed 1px #ddd; overflow: hidden; position: relative;}
.download img{ float: left;}
.download h1{ float: left;}
.download button{ background: #004aa4; color: #fff; box-shadow: 0 2px 12px #95bcec; text-align: center; cursor: pointer;
position: absolute; right: 0; top: 50%; transform: translateY(-50%); z-index: 99;}

.educate li{ width: 100%; position: relative; cursor: pointer;}
.educate_pic{ width: 100%; overflow: hidden;}
.educate_pic img{ width: 100%; height: 100%; object-fit: cover; transition: all 0.5s;}
.educate_w{ width: 80%; position: absolute; top: 50%; transform: translateY(-50%); left: 10%; z-index: 9;}
.educate_w h1{ color: #fff;}
.educate_w p{ color: #fff;}
.educate_w button{ background: #004aa4; color: #fff; text-align: center; cursor: pointer;}
.educate_w button:hover{ background: #004190;}
.educate li:hover .educate_pic img{ transform: scale(1.03);}
.map{ width: 100%;}
.touch{ position: absolute; top: 50%; transform: translateY(-50%); right: 0; z-index: 99; background: #fff; border-left: solid 3px #004aa4;}
.touch span{ display: inline-block; color: #000;}
.touch p{ font-family: boldcond; color: #004aa4; letter-spacing: 2px;}
.touch h1{ color: #0d53a9; letter-spacing: 3px;}

.content_bg{ background: #f5f5f5;}
.article{ background: #fff;}
.article_title{ text-align: center; font-weight: bold; color: #000; border-bottom: solid 1px #e1e1e1; overflow: hidden;}
.article_word{ overflow: hidden;}
.article_date,.article_see{ color: #666;}
.article_tip{ display: flex; align-items: center;}
.article_tip ul,.article_tip li{ display: inline-block;}
.article_tip .article_icon{ display: inline-block;}
.article_tip .article_icon_a{ display: none;}
.article_tip li:hover>.article_icon{ display: none;}
.article_tip li:hover>.article_icon_a{ display: inline-block;}
.article_other{ overflow: hidden; position: relative;}
.article_other01{ float: left; cursor: pointer;}
.article_other02{ position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 99; text-align: center; cursor: pointer;}
.article_other03{ float: right; text-align: right; cursor: pointer;}
.article_other span{ color: #999;}
.article_other p{ color: #000; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.article_other h1{ color: #000; font-weight: normal;}
.article_other01:hover>span{ color: #000;}
.article_other03:hover>span{ color: #000;}
.article_other02:hover>h1{ color: #004aa4;}

.graceful ul{ overflow: hidden;}
.graceful li{ float: left;}
.graceful_pic{ width: 100%; overflow: hidden;}
.graceful_pic img{ width: 100%; height: 100%; object-fit: cover; transition: all 0.5s;}
.graceful_w{ border-bottom: solid 1px #e1e1e1; text-align: center; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
.graceful li:hover .graceful_pic img{ transform: scale(1.05);}