/*Created by LK on 2018/4/19.*/

html, body{margin: 0; padding: 0; font-size: 14px; background: #fff; font-family: "Microsoft YaHei", sans-serif}

div{box-sizing: border-box}

ul, li ,ol{margin: 0; padding: 0}

h1,h2,h3,h4,h5,h6{margin: 0; font-weight: normal}

p{margin: 0}

a{text-decoration: none; display: block; outline: none}

img{border: 0; float: left}

.clearfix:after{content: ""; display: block; height: 0; clear: both; visibility: hidden; font-size: 0}

ul:after {clear:both;content:'.';display:block;width: 0;height: 0;visibility:hidden;}

.left{float: left}
.right{float: right}
.w1200{width: 1200px; margin: 0 auto; position: relative}
.w1440{width: 1440px; margin: 0 auto; position: relative}


@font-face{
    font-family: 'novecentowide-book';
    src: url('../font/novecentowide-book-webfont.eot');
    src: url('../font/novecentowide-book-webfont.eot?#iefix') format('embedded-opentype'),
    url('../font/novecentowide-book-webfont.woff2') format('woff2'),
    url('../font/novecentowide-book-webfont.woff') format('woff'),
    url('../font/novecentowide-book-webfont.otf') format('opentype'),
    url('../font/novecentowide-book-webfont.svg#novecentowide-bold-webfont') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'novecento_sans_widelight';
    src: url('../font/Novecentosanswide-Light-webfont.eot');
    src: url('../font/Novecentosanswide-Light-webfont.eot?#iefix') format('embedded-opentype'), url('../font/Novecentosanswide-Light-webfont.woff2') format('woff2'), url('../font/Novecentosanswide-Light-webfont.woff') format('woff'), url('../font/Novecentosanswide-Light-webfont.ttf') format('truetype'), url('../font/Novecentosanswide-Light-webfont.svg#novecento_sans_widelight') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'DisneyEnglish-Bold';
    src: url('../font/DisneyEnglish-Bold.otf');
    src: url('../font/DisneyEnglish-Bold.ttf');
    font-weight: normal;
    font-style: normal;
}


/*----header----*/
.header{width: 100%; height: 70px; position: fixed; top: 0; left: 0; border-bottom:1px solid rgba(255,255,255,.3); z-index: 99}
.header .logo{width: 120px; height: 40px; float: left; margin: 15px 30px; background: url("../image/logo.png") no-repeat center; background-size: cover}
.header .tel{float: left; width: 180px; height: 70px; color: #fff; border-left: 1px solid rgba(255,255,255,.3); border-right: 1px solid rgba(255,255,255,.3); position: relative}
.header i{position: absolute; top: 24px; left: 22px; font-size: 24px; opacity: .6}
.header .tel p{font-size: 13px; text-align: center; padding-top: 28px; padding-left: 20px; font-family:'novecentowide-book' }
.header .OA{width: 120px; float: left; padding: 28px 20px 24px 26px; font-size: 12px; color: #fff; text-align: center; position: relative; background: url("../image/oa.png") no-repeat 24px 22px}
.header .add{float: right; height: 70px; color: #fff; border-right: 1px solid rgba(255,255,255,.3); position: relative}
.header .add p{font-size: 12px; text-align: center; padding-top: 28px; padding-left: 50px; padding-right: 30px}
.header .lan{float: right; height: 70px; position: relative; margin-right: 80px; padding: 0 20px; color: #fff; border-right: 1px solid rgba(255,255,255,.3); cursor: pointer}
.header .lan p{font-size: 12px; text-align: center; padding-top: 28px; padding-left: 40px; padding-right: 20px}
.header .language{list-style: none; width: 100%; position: absolute; top: 71px; left: 0; background: rgba(0,0,0,.4)}
.header .language li{width: 100%; height: 0; opacity: 0; position: relative; transition: all .4s; -webkit-transition: all .4s}
.header .language li:hover{background: #fff}
.header .language li i{position: absolute; top: 13px; left: 30px; font-size: 13px;}
.header .language li:hover i{color: #000}
.header .language li a{font-size: 12px; height: 38px; line-height: 38px; padding-left: 60px; color: #fff; box-sizing: border-box}
.header .language li:hover a{color: #000}

.header .lan:hover .language li{height: 38px; opacity: 1}

.mini{background: rgba(0,0,0,.6)}

.header .button{position: absolute; right: 0; top: 0; width: 40px; height: 40px; padding: 5px; margin-top: 15px; margin-right: 20px; background: none; border: none; cursor: pointer; display: block}
.header button{outline: none}
.header .button span{width: 32px; height: 3px; position: absolute; top: 0; left: 5px; display: block; background: #fff; transition: all .5s; -webkit-transition: all .5s}
.header .button:hover span:nth-child(2){width: 0}

.header .button span:nth-child(1){top: 10px}
.header .button span:nth-child(2){top: 20px}
.header .button span:nth-child(3){top: 30px}

#button .span1{top: 20px; transform: rotate(-45deg); -webkit-transform: rotate(-45deg)}
#button .span2{opacity: 0}
#button .span3{top: 20px; transform: rotate(45deg); -webkit-transform: rotate(45deg)}


/*----menu----*/
.menu{width: 100%; height: 100%; position: fixed; top: 0; left: 0; background: #1f2b45; display: none; z-index: 11}
.menu .box{height: auto; position: absolute; top: 50%; left: 50%; margin: -295px 0 0 -600px}


.menu .box .nav{width: 100%; margin-bottom: 30px; padding-bottom: 10px; border-bottom: 1px solid rgba(255,255,255,.2)}
.menu .box .nav h3{font-size: 16px; color: #fff; font-family: 'novecentowide-book'}
.menu .box .nav .nav_bar{list-style: none; padding-top: 20px}
.menu .box .nav .nav_bar li{float: left; margin-right: 40px; margin-bottom: 20px}
.menu .box .nav .nav_bar li a{padding: 4px 10px 4px 0; color: #fff}
.menu .box .nav .nav_bar li:hover a{color: #666}

.menu .box .menu_product{width: 100%;}
.menu .box .menu_product h3{margin-bottom: 10px; font-size: 26px; font-weight: normal; color: #fff; font-family: 'novecentowide-book'}
.menu .box .menu_product span{display: block; width: 30px; height: 1px; background: #f0f0f0;}
.menu .box .menu_product .menu_product_list{list-style: none; padding-top: 40px; margin-right: -2%}
.menu .box .menu_product .menu_product_list li{width: 18%; margin-right: 2%; float: left; margin-bottom: 30px}
.menu .box .menu_product .menu_product_list li h3{font-size: 15px; color: #fff; margin-bottom: 12px; transition: all ease .3s; -webkit-transition: all ease .3s}
.menu .box .menu_product .menu_product_list li:hover h3{color: #666}
.menu .box .menu_product .menu_product_list li .pro_img{width: 100%; overflow: hidden}
.menu .box .menu_product .menu_product_list li .pro_img img{width: 100%; transition: all ease .3s; -webkit-transition: all ease .3s}
.menu .box .menu_product .menu_product_list li:hover .pro_img img{transform: scale(1.06); -webkit-transform: scale(1.06)}


#footer{background: #26324a; z-index: 5}
#footer .footer_title{position: relative; padding: 30px 0 20px 0; border-bottom: 1px solid rgba(255,255,255,.2)}
#footer .footer_title h3{font-size: 18px; color: #fff}
#footer .footer_title .top{width: 46px; height: 46px; position: absolute; right: 0; top: 24px; cursor: pointer}
#footer .footer_title .top img{width: 100%}
#footer .footer_con{padding: 20px 0; border-bottom: 1px solid rgba(255,255,255,.2)}
#footer .footer_con .footer_left{width: 80%;}
#footer .footer_con .footer_left .footer_add span{display: inline-block;font-size: 13px; color: #e0e0e0; line-height: 30px; font-weight: 100; padding-right: 40px;}
#footer .footer_con .footer_left .footer_add .sp{display: block;}

#footer .footer_con .footer_left .footer_ying{margin-top: 10px; margin-bottom: 10px;}
#footer .footer_con .footer_left .footer_ying a{display: inline-block; padding: 0 6px; margin-right: 2px; font-size: 13px; color: #e0e0e0;}
#footer .footer_con .footer_left .footer_ying .ying{font-size: 13px; color: #e0e0e0; padding: 0 6px 0 0; margin-right: 4px;}

#footer .footer_con .footer_left .footer_link{margin-bottom: 10px;}
#footer .footer_con .footer_left .footer_link a{display: inline-block; padding: 0 6px; margin-right: 2px; font-size: 13px; color: #e0e0e0;}
#footer .footer_con .footer_left .footer_link .f_link{font-size: 13px; color: #e0e0e0; padding: 0 6px 0 0; margin-right: 4px;}

#footer .footer_con .footer_ewm{width: 20%;}
#footer .footer_con .footer_ewm img{float: right; display: block;}

#footer .footer_end{padding: 10px 0; text-align: center;}
#footer .footer_end span{display: block; text-align: center; font-size: 12px; color: #e0e0e0; line-height: 22px;}
#footer .footer_end a{display: inline-block; font-size: 12px; color: #e0e0e0; line-height: 16px; margin-right: 20px; font-weight: 100;}
#footer .footer_end .right a{margin: 0 0 0 20px;}
#footer .footer_end .design{width: 64px; height: 16px; color: transparent; background: url("../image/power.png") no-repeat; background-size: cover}


.page_info{padding-top: 40px; text-align: center}
.page_info span{padding: 8px 12px; background: #f0f0f0}

.page_list{padding-top: 40px; text-align: center}
.page_list a{display: inline-block; width: 20px; height: 20px; background: #e0e0e0; text-align: center; font-size: 13px; color: #333; line-height: 20px;  margin: 0 3px}
.page_list a.on{background: #164190; color: #fff;}
.page_list a:first-child{display: none}
.page_list a:last-child{display: none}

.preNext{margin-top: 60px}
.preNext .text{list-style: none}
.preNext .text li{color: #333; margin: 0 20px}
.preNext .text li:nth-child(1){float:left}
.preNext .text li:nth-child(2){float:right}
.preNext .text li a{color: #333333}
.preNext .text li:hover a{color: #164190}


/*----right_list----*/
.right_list{width: 48px; position: fixed; right: 20px; bottom: 0; margin-bottom: 16%; z-index: 99;}
.right_list .li{position: relative; width: 50px; height: 50px; margin-bottom: 4px; text-align: center; line-height: 50px; background: #dedede; cursor: pointer; transition: all ease .3s; -webkit-transition: all ease .3s}
.right_list .li i{font-size: 32px; color: #333; vertical-align: middle; transition: all ease .3s; -webkit-transition: all ease .3s}
.right_list .li.top{height: 38px; line-height: 32px}

.right_list .li .img{width: 120px; height: 150px; position: absolute; top: 0; right: 0; margin: 40px 60px 0 0; background: #fcfcfc; box-shadow: 0 0 10px 3px rgba(0,0,0,.2); visibility: hidden; opacity: 0; transition: all ease .3s .1s; -webkit-transition: all ease .3s .1s}
.right_list .li .img img{width: 100%; display: block; float: none; margin: 0 auto 5px auto;}
.right_list .li .img p{line-height: 10px; font-size: 13px; color: #333}

.right_list .li .tel{width: 220px; height: 50px; position: absolute; top: 0; right: 0; margin: 0 0 0 0; background: #fff; box-shadow: 0 0 10px 3px rgba(0,0,0,.2); visibility: hidden; opacity: 0; transition: all ease .3s; -webkit-transition: all ease .3s}
.right_list .li .tel h3{font-size: 18px; color: #26324a; line-height: 50px; font-family: 'novecentowide-book'}
.right_list .li .tel h3 i{font-size: 20px; color: #26324a; padding-right: 6px; vertical-align: middle; padding-bottom: 2px}
.right_list .li .tel h3 a{display: inline-block; color: #333}

.right_list .li:hover{background: #000}
.right_list .li:hover i{color: #fff;}
.right_list .li:hover .img{visibility: visible; opacity: 1; margin: 0 60px 0 0}
.right_list .li:hover .tel{margin: 0 60px 0 0; visibility: visible; opacity: 1}


/*----measure----*/
.measure{position: fixed; top: 0; left: 0; margin: 120px 0 0 10px; z-index: 10}
.measure .measure_con{width: 200px; height: 170px; background: rgba(255,255,255,.8); padding: 20px 30px; border-radius: 8px; box-shadow: 0 0 10px 3px rgba(0,0,0,.2);}
.measure .measure_con .img{width: 70%; margin: 0 auto 10px auto; overflow: hidden}
.measure .measure_con .img img{width: 100%}
.measure .measure_con h3{font-size: 22px; color: #26324a; font-weight: bold; text-align: center}
.measure .measure_con h3 i{font-style: normal; color: #ff0000; padding-left: 2px}
.measure .measure_con .measure_link{width: 120px; line-height: 38px; background: #ff0000; font-size: 14px; color: #fff; border-radius: 8px; margin: 20px auto 0 auto; text-align: center}

/*----message----*/
.message{width: 100%; height: 100%; background: rgba(0,0,0,.6); position: fixed; top: 0; left: 0; z-index: 11}
.message .message_con{position: relative; width: 580px; margin: 10% auto 0 auto; padding: 0 40px; background: #fff; border-radius: 8px;}
.message .message_con h3{font-size: 18px; color: #333; text-align: center; padding: 30px 0 20px 0}
.message .message_con .close{width: 25px; height: 25px; position: absolute; top: 0; right: 0; margin: 30px 40px 0 0; font-size: 13px; color: #666; text-align: center; line-height: 25px;}
.message .message_con .close i{transition: all ease .3s; -webkit-transition: all ease .3s}
.message .message_con .close:hover i{transform: rotateZ(180deg); -webkit-transform: rotateZ(180deg) }

.message .form{width: 500px; margin: 0 auto}
.message .msgtitle{font-size: 14px; color: #555; margin-right: 10px;}
.message .msg_input{width: 400px; margin-bottom: 10px; border: 1px solid #e0e0e0; padding: 4px 9px; background: #fff; font-size: 13px; color: #888; box-shadow: 0 2px 0 0 rgba(0,0,0,.03); border-radius: 2px; outline: none}
.message .msg_input_on{width: 400px; margin-bottom: 20px; border: 1px solid #e0e0e0; padding: 8px 9px; background: #fff; font-size: 13px; color: #888; box-shadow: 0 2px 0 0 rgba(0,0,0,.03); border-radius: 2px; outline: none}

.message p {margin: 7px 0;  position: relative;  display: block; padding-left: 80px;}
.message p span {line-height: 37px; display: block; position: absolute;  left: 0;  top: 0; width: 100px; font-weight: bold;}
.message p input {height: 28px; text-indent: 5px;}
.message p textarea {width: 100%; height: 40px; border: 1px solid #ddd; font-size: 12px; text-indent: 5px; outline: 0;}
.message p.yanz {}
.message p.yanz span {float: left; padding-right: 10px; color: #555}
.message p.yanz input {width: 40%;  float: left;}
.message p.yanz img {height: 37px;  display: block;}
.message p .btn {height: 42px; width: 150px; border: none; background: #26324a; color: #fff; cursor: pointer; margin: 20px 0 40px 270px;}
.message p .btn:hover {background: #0e4c89;}