﻿/*=====================================
  reset
  =====================================*/
html, body, h1, h2, h3, h4, h5, h6, table, thead, tfoot, tbody, form, fieldset, legend, div, p, span, dl, dt, dd, ul, ol, li, blockquote, pre, q, cite, code, input, select, textarea {margin:0; padding:0;}
h1, h2, h3, h4, h5, h6, strong, em, cite, address, sup, sub, th {font-weight:normal; font-style:normal; vertical-align:auto; font-size:1em;}
i {font-style:normal;}
ul, ol {list-style-type:none;}
a:link, a:visited {text-decoration:none; outline:0 none;}
a:hover, a:active {text-decoration:none; outline:0 none;}
fieldset, a img {border:none;}
*{box-sizing: border-box;}
/*img {vertical-align:top;}*/
input, textarea, button {font-size:100%; font-family:inherit;outline:0 none;}
button {cursor: pointer;}
textarea {resize:none; overflow:auto;}
table {border-collapse:collapse; border-spacing:0;}
select optgroup {font-style:normal;}
legend {display:none;}
input[type="radio"],
input[type="checkbox"],
textarea {vertical-align:middle;}
.iswin input[type="radio"],
.iswin input[type="checkbox"],
.iswin textarea {vertical-align:-3px;}
input[type="radio"],
input[type="checkbox"] {margin-right:3px;}
input[type="text"],
input[type="password"],
textarea {border:1px solid #ccc;}
.fl{float: left;}
.fr{float: right;}
.txtIpt{line-height: 14px; height: 14px; padding: 5px; vertical-align: middle; border: solid 1px #CCC;}
.clearfix {zoom:1;}
.clearfix:after {content:""; display:block; height:0; font-size:0; clear:both; overflow:hidden; visibility:hidden;}
.ellipsis{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.pdr5{
    padding-right: 15px !important;
}
/*=====================================
全局
=====================================*/
html {height:100%;}
body {position:relative; min-height:100%; font-size:12px;background:#fff;font-family:Microsoft YaHei,Arial,simsun;}

.wrap{
    width: 1420px;
    height: 100%;
    margin: 0 auto;
}
.header{
    width: 100%;
    height: 140px;
}
.header .wrap{
    position: relative;
    border-bottom: 1px #e5e5e5 solid;
}
.header .wrap .con{
    position: absolute;
    bottom: 0;
    height: 50px;
    width: 100%;
    padding: 0 25px;
}
.header .wrap .con .weather img{
    width: 22px;
    height: 22px;
    vertical-align: middle;
    margin-top: -8px;
}
.header .wrap .con .code{
    position: relative;
}
.header .wrap .con .care{
    height: 50px;
    line-height: 50px;
    font-size: 14px;
}
.header .wrap .con .care .caremore{
    display: inline-block;
    height: 50px;
    padding: 0 20px 0 40px;
    background-image: url('../images/ico-!.png');
    background-repeat: no-repeat;
    background-size: 30px 30px;
    background-position: 0 center;
    transition: all 0.5s;
    color: #333;
}
.header .wrap .con .care .caremore:hover{
    color: #00a4c0;
}
.header .wrap .con .code img{
    width: 30px;
    height: 30px;
    vertical-align: middle;
    margin-top: -2px;
    z-index: 10;
    position: relative;
}
.header .wrap .con .code .big-code{
    position: absolute;
    width: 180px;
    height: 180px;
    background-image: url('../images/img-code.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    z-index: 5;
    display: none;
    top: 39px;
    border: 1px #eee solid;
}
.header .wrap .con .weather p,
.header .wrap .con .code p{
    display: inline-block;
    font-size: 14px;
    color: #666;
    height: 50px;
    line-height: 50px;
    margin-left: 13px;
}
.header .wrap .con .logo{
    position: absolute;
    width: 335px;
    height: 144px;
    left: 542px;
    bottom: 0;
    background: url('../images/logo.png') 0 0 no-repeat;
    cursor: pointer;
    /* animation: logomove 10s linear infinite; */
}
@-moz-keyframes logomove {
    0%{
        transform: skewX(0deg) skewY(0deg) 
    
    }
    25%{
        transform: skewX(10deg) skewY(3deg) 

    }
    50%{
        transform: skewX(0deg) skewY(0deg) 
    }
    75%{
        
        transform: skewX(-10deg) skewY(-3deg) 
    }
    100%{
        transform: skewX(0deg) skewY(0deg) 
    }
}
@-o-keyframes logomove {
    0%{
        transform: skewX(0deg) skewY(0deg) 
    
    }
    25%{
        transform: skewX(10deg) skewY(3deg) 

    }
    50%{
        transform: skewX(0deg) skewY(0deg) 
    }
    75%{
        
        transform: skewX(-10deg) skewY(-3deg) 
    }
    100%{
        transform: skewX(0deg) skewY(0deg) 
    }
}
@-webkit-keyframes logomove {
    0%{
        transform: skewX(0deg) skewY(0deg) 
    
    }
    25%{
        transform: skewX(10deg) skewY(3deg) 

    }
    50%{
        transform: skewX(0deg) skewY(0deg) 
    }
    75%{
        
        transform: skewX(-10deg) skewY(-3deg) 
    }
    100%{
        transform: skewX(0deg) skewY(0deg) 
    }
}
@-ms-keyframes logomove {
    0%{
        transform: skewX(0deg) skewY(0deg) 
    
    }
    25%{
        transform: skewX(10deg) skewY(3deg) 

    }
    50%{
        transform: skewX(0deg) skewY(0deg) 
    }
    75%{
        
        transform: skewX(-10deg) skewY(-3deg) 
    }
    100%{
        transform: skewX(0deg) skewY(0deg) 
    }
}
@keyframes logomove {
    0%{
        transform: skewX(0deg) skewY(0deg) 
    
    }
    25%{
        transform: skewX(10deg) skewY(3deg) 

    }
    50%{
        transform: skewX(0deg) skewY(0deg) 
    }
    75%{
        
        transform: skewX(-10deg) skewY(-3deg) 
    }
    100%{
        transform: skewX(0deg) skewY(0deg) 
    }
}
.nav{
    width: 100%;
    height: 51px;
}
@media screen and (max-width:1036px){
    .nav{
        width: 100%;
    }
    .nav .wrap{
        width: 100%;
    }
}
@media screen and (max-width:1280px) and (min-width:460px){
    .header{
        width: 100%;
    }
    .header .wrap{
        width: 100%;
    }
}
.nav .wrap{
    padding-top: 17px;
    text-align: center;
}
.nav .wrap ul{
    height: 51px;
    display: inline-block;
    min-width: 730px;
}
.nav .wrap ul li{
    padding: 0 18px;
    border-right: 1px #8d9aad solid;
    border-left: 1px #425d80 solid;
    font-size: 16px;
    height: 20px;
    line-height: 20px;
    position: relative;
}
.nav .wrap ul li::after{
    content: "";
    position: absolute;
    width: 0%;
    height: 0px;
    left: 0;
    bottom: -10px;
    border-bottom: 3px solid #00a4c0;
    transition: width 0.3s ease-in-out;
}
.nav .wrap ul li:hover a{
    color: #00a4c0;
}
.nav .wrap ul li:hover::after{
    width: 100%;
}
.nav .wrap ul li a{
    color: #003366;
    cursor: pointer;
    font-size: 20px;
}
.nav .wrap ul li.active a{
    color: #00a4c0;
}
.nav .wrap ul li:first-of-type{
    border-left:none;
}
.nav .wrap ul li:last-of-type{
    border-right: none;
}

.footer{
    width: 100%;
    height: 90px;
}
.footer .wrap{
    padding-top: 17px; 
    border-top: 1px #e5e5e5 solid;
}
.footer .wrap .footer-link{
    width: 442px;
    height: 18px;
    color: #999;
    font-size: 14px;
    margin: 0 auto 17px;
}
.footer .wrap .footer-link .footer-link-list li{
    float: left;
    padding: 0 12px;
    border-right: 1px #999 solid;
}
.footer .wrap .footer-link .footer-link-list li:last-of-type{
    border:none;
}
.footer .wrap .footer-link .footer-link-list li a{
    color: #999;
}
.footer .wrap .footer-link .footer-link-list li a:hover{
    text-decoration: underline;
}
.footer .wrap .beian{
    width: 480px;
    margin:0 auto;
}
.footer .wrap .beian .gongan{
    float: left;
}
.footer .wrap .beian a{
    float: left;
    color: #666;
    font-size: 12px;
    margin-right: 20px;
}
.footer .wrap .beian .right{
    color: #666;
    font-size: 12px;
    float: left;
}