﻿body {
font-family:Verdana;
}
.nav { position: fixed; top: 0; left: 0; right: 0; height: 80px; padding: 5px 10%; z-index: 11; background-color: #fff; border-bottom: 1px solid #d3d3d3 }
    .nav li:nth-child(1) { width: 40% }
        .nav li:nth-child(1) img { width: 67% }
    .nav li { padding: 5px 7px; margin-left: 10px; font-weight: 700; border-radius: 5px; text-overflow: ellipsis; white-space: nowrap; font-size: 16px }
        .nav li:hover { animation: nav-checked 1s forwards; -webkit-animation: nav-checked 1s forwards; color: #fff }
        .nav li:nth-child(1):hover { background-color: #fff; animation: none; -webkit-animation: none }
.english { position: fixed; top: 10px; right: 10px; width: 10%; text-align: right; z-index: 11; font-size: 12px }
    .english img { width: 11%; vertical-align: middle }

.search { height: 80px; margin: 5px 0; background-color: #f5f5f5; text-align: left }
.yzmbox { width: 40% }
.innerDiv_search { display: inline-block; vertical-align: middle; margin: 0 5px; }
    .innerDiv_search span { font-size: 16px; }
    .innerDiv_search i { font-size: 8px; }
.txt_cpid, .txt_yzm { padding: 8px 0; font-size: 17px; text-align: center; border-radius: 5px; margin-left: 7px; border: 1px solid #008DCA; }
.yzmImg { width: 20%; margin-left: 5px }
.btn-zw { width: 8%; border-radius: 3px; background-color: #008DCA; color: white; padding: 7px 0; font-size: 18px; text-align: center } 
.btn-zw:hover { cursor: pointer; animation: pulse 1s forwards }

.header { margin-top: 90px }
    .header img { width: 100% }
.entrance { padding: 10px 10%; background: url(../img/bg/bg1.jpg) no-repeat; background-size: 100% 100%; overflow: hidden; animation: changepage 1s forwards; -webkit-animation: changepage 1s forwards }
    .entrance img { width: 5%; vertical-align: middle }
    .entrance .swiper-container { display: inline-block; vertical-align: middle; width: 80% }
    .entrance span { vertical-align: middle; font-size: 18px; font-weight: 700; margin-left: 2%; font-family: Verdana,'Microsoft YaHei',SimHei,sans-serif }
        .entrance span i { color: red; font-family: Verdana; font-size: 20px }
.w-2 { width: 20% }
.w-25 { width: 25% }
.w-7 { width: 70% }
.w-72 { width: 72% }
.container { padding: 10px 10% 2%; background: #f5f5f5; animation: changepage 1s forwards; -webkit-animation: changepage 1s forwards }
    .container a:hover { color: red }
.box { background-color: #fff; box-shadow: 5px 5px 2px #d3d3d3; border-radius: 3px; border: 1px solid #E5E5E5; }
.smallbox { background-color: #fff; box-shadow: 1px 1px 1px #DEDEDE; border-radius: 5px; border: 1px solid #E5E5E5 }
.subtitle { height: 60px; line-height: 60px; font-size: 20px; text-align: center }
    .subtitle span { margin-left: 7px; font-size: 15px }
.mask-case { position: absolute; z-index: 2; top: 0; left: 0; width: 100%; height: 100%; text-align: center; color: #fff; background-color: rgba(0,0,0,.5); opacity: 0; cursor: pointer }
.c { display: none }
.open { animation: changepage 1.5s forwards; -webkit-animation: changepage 1.5s forwards; display: block !important }
.open-zoomin { animation: zoomIn 1s forwards; -webkit-animation: zoomIn 1s forwards; display: block !important }
.margintop5 p { margin-top: 5px }
.diamond, .diamond span { display: inline-block; transform-origin: 0 100%; -webkit-transform-origin: 0 100%; -moz-transform-origin: 0 100%; -ms-transform-origin: 0 100%; -o-transform-origin: 0 100% }
.diamond { position: relative; left: 40px; top: 10px; width: 50px; height: 50px; text-align: center; line-height: 50px; border-right: 2px solid #fff; border-bottom: 2px solid #fff; box-shadow: 2px 7px 1px gray; transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg) }
    .diamond span { color: #fff; font-size: 25px; transform: rotate(45deg) translate(-12.5px); -webkit-transform: rotate(45deg) translate(-12.5px); -moz-transform: rotate(45deg) translate(-12.5px); -ms-transform: rotate(45deg) translate(-12.5px); -o-transform: rotate(45deg) translate(-12.5px) }
.oblong { display: inline-block; padding: 0 50px; height: 40px; line-height: 40px; font-size: 14px; text-align: center; border: 2px solid #fff; border-radius: 7px; box-shadow: 7px 5px 1px gray }
.title-icon-small { display: inline-block; padding: 0 10px; height: 30px; line-height: 30px; color: #fff; font-weight: 700; font-size: 17px; text-align: center; border: 2px solid #fff; box-shadow: 1px 1px 1px #d3d3d3; border-radius: 7px }
#mask { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 100; background-color: rgba(0,0,0,.4); display: none }
.icon-time-wrapper { text-align: right }
    .icon-time-wrapper span { display: inline-block; font-size: 12px; color: red; vertical-align: middle }
.icon-time { height: 15px; width: 15px; background: url(../img/time.png) no-repeat; background-size: 100% 100% }
.icon-time-wrapper span:nth-child(2) { margin-left: 5px }
.aside { transition: all .3s }
.content { padding: 20px 3% }
.innercontent { padding: 50px 0; }
.aside p:first-child { height: 60px; line-height: 60px; background: url(../img/titlebg.png) no-repeat; background-size: 100% 100%; text-align: center; color: #fff; font-size: 20px }
.aside ul { width: 80%; margin: 3% 0 0 10% }
.aside li { height: 55px; line-height: 55px; border-bottom: 1px dotted #d3d3d3; cursor: pointer; font-size: 15px; color: #222 }
    .aside li:first-child { margin-top: 20px }
    .aside li:hover { color: red }
    .aside li:last-child { border: none }
.checked { color: red !important }
    .checked span:after { content: "》"; color: red; float: right; line-height: 55px }
.nav-content { font-size: 14px }
    .nav-content a { margin: 0 2px }
        .nav-content a:first-child { border-left: 5px solid #cc1d0b; padding-left: 20px }
.now { color: red }
.article { padding: 10px 0; line-height: 200%; letter-spacing: 1.5px; font-size: 16px ;font-family:Verdana;}
.indent { text-indent: 32px; }
.title-img { margin: 20px auto }
.title-article { border-left: 7px solid #cc1d0b; padding-left: 5px; color: #4d4d4d; font-size: 1.1em; margin-top: 30px ;font-family:Verdana }
.subtitle-article { margin-top: 15px; text-align: center; padding-bottom: 12px; border-bottom: 1px solid #d3d3d3; font-size: 22px; font-weight: 700 ;font-family:Verdana }
.popup, .popup-video { position: fixed; top: 15%; left: 15%; z-index: 16; height: 70%; width: 70%; text-align: center; display: none; border-radius: 2px ;font-family:Verdana }
.popup-wrapper { background-color: rgba(0,0,0,.5); height: 100%; width: 100% }
.popup-video .popup-wrapper div { height: 100% }
.popup-wrapper img { height: 100% }
.popup-wrapper embed { height: 100%; width: 80% }
.closepopup { position: absolute; top: 5px; right: 5px; width: 30px; height: 30px; text-align: center; line-height: 30px; color: red; background-color: #fff; border-radius: 15px; cursor: pointer }
.openflag { cursor: pointer }
.list-article { width: 95%; margin: 10px 0 0 2.5%; list-style: decimal }
    .list-article li { margin: 5px 0; color: #666; font-size: 15px; letter-spacing: 1.2px; line-height: 200% ;font-family:Verdana;}
.article-news { width: 80%; margin: 20px 0 0 10%; padding: 30px 0; text-align: center ;font-family:Verdana }
    .article-news .article { color: #666; letter-spacing: normal; text-align: justify  ;font-family:Verdana}
    .article-news img { margin: 10px 0 }
.uptime { font-size: 16px; color: gray; padding-bottom: 30px; border-bottom: 1px solid #d3d3d3  ;font-family:Verdana}
.container-link { position: fixed; z-index: 55; }
.icon-link, .box-link { position: fixed; bottom: 5%; right: 5%; height: 40px; line-height: 40px; border-radius: 20px; text-align: center; }
.icon-link { z-index: 56; width: 40px; cursor: pointer; animation: iconrotate 10s infinite;border-radius:20px;overflow:hidden }
.box-link { z-index: 55; padding: 0 50px 0 30px; background-color: #F55151; color: white; font-size: 14px; display: none; overflow: hidden; }
    .box-link a { margin: 0 5px; font-weight: bold }
        .box-link a:hover { color: black }

.icon-link-1, .box-link-1 {
    bottom: 13%;
}


.showbox-link {
    animation: showlinkbox .5s forwards;
    display: block
}

@keyframes closelinkbox1 {
    0% { width:30%;}
    100% { width: 0;padding: 0 20px;}
}

@keyframes closelinkbox1 {
    0% {   width:30%;}
    100% {  width: 0; padding: 0 20px;}
}

.showbox-link1 {
    animation: showlinkbox1 .5s forwards;
    display: block
}
.closebox-link1 {
    animation: closelinkbox1 .5s forwards;
    display: block
}


@keyframes showlinkbox1 {
    from {
        width: 0;
        opacity: 0
    }

    to {
        width:30%;
        opacity: 1;
    }
}

@keyframes closelinkbox1 {
    0% {
        width:30%;
    }

    100% {
        width: 0;
        padding: 0 20px;
    }
}
.closebox-link { animation: closelinkbox .5s forwards; display: block }
.btn-gotop { position: fixed; bottom: 30%; right: 5%; z-index: 2; width: 40px; height: 40px; border-radius: 20px; background-color: rgba(0,0,0,.4); text-align: center; opacity: 1; display: none; cursor: pointer; animation: gotop 5s infinite }
    .btn-gotop img { height: 13px; margin-top: 13.5px }
    .btn-gotop:hover { background-color: rgba(0,0,0,.7) }
.btn_ali { position: fixed; bottom: 21%; right: 5%; z-index: 2; width: 40px; height: 40px; cursor: pointer; animation: iconrotate 10s infinite; }
.icon_info { position: absolute; top: 10%; left: 2%; display: inline-block; height: 28px; padding-left: 10px; line-height: 28px; font-size: 12px; background-color: #FEC763; border-radius: 7px; color: white }
.triangle { position: relative; left: 8px; display: inline-block; width: 0; height: 0; border-top: 5px solid transparent; border-left: 8px solid #FEC763; border-bottom: 1px solid transparent; }
.footer a:hover { color: darkorange }
.footer { padding: 0 10%; background-color: #222; color: #fff; font-size: 14px; font-weight: 700 }
.left-footer { width: 90% }
    .left-footer p { text-align: center; margin: 5px 0 }
.right-footer { width: 7%; padding: 10px 0; }
.hideword { overflow: hidden; text-overflow: ellipsis; white-space: nowrap }
.point { background: #ff8c00; opacity: 1 }
.point-red { background: red; opacity: 1 }
.img-hover-wrapper img:hover { animation: imghover 3s forwards; -webkit-animation: imghover 3s forwards; z-index: 33 }
.hover:hover { transform: scale(1.05); -ms-transform: scale(1.05); -moz-transform: scale(1.05); -webkit-transform: scale(1.05); -o-transform: scale(1.05); transition: all 1s ease 0s }
.jump:hover { animation: jump 1.5s forwards; -webkit-animation: jump 1.5s forwards }
.zoomIn { animation: zoomIn 1s; -webkit-animation: zoomIn 1s }

.honer-container{

}
.honer-wrapper{ 
    width:30%;
    margin:10px 0;
}

@keyframes nav-checked {
    from { background: #fff }
    to { background: #CC1D0B }
}

@keyframes imghover {
    30% { transform: scale(1.5); -ms-transform: scale(1.5); -moz-transform: scale(1.5); -webkit-transform: scale(1.5); -o-transform: scale(1.5) }
    100% { transform: scale(3); -ms-transform: scale(3); -moz-transform: scale(3); -webkit-transform: scale(3); -o-transform: scale(3) }
}

@keyframes changepage {
    from { opacity: 0 }
    to { opacity: 1 }
}

@keyframes jump {
    50% { transform: scale(1.5); -ms-transform: scale(1.5); -moz-transform: scale(1.5); -webkit-transform: scale(1.5); -o-transform: scale(1.5) }
    100% { transform: scale(1.3); -ms-transform: scale(1.3); -moz-transform: scale(1.3); -webkit-transform: scale(1.3); -o-transform: scale(1.3) }
}

@keyframes td {
    50% { transform: scale(1.05); -ms-transform: scale(1.05); -moz-transform: scale(1.05); -webkit-transform: scale(1.05); -o-transform: scale(1.05) }
    100% { transform: scale(1); -ms-transform: scale(1); -moz-transform: scale(1); -webkit-transform: scale(1); -o-transform: scale(1) }
}

@keyframes zoomIn {
    from { opacity: 0; transform: scale3d(.3,.3,.3); -ms-transform: scale3d(.3,.3,.3); -moz-transform: scale3d(.3,.3,.3); -webkit-transform: scale3d(.3,.3,.3); -o-transform: scale3d(.3,.3,.3) }
    50% { opacity: 1 }
}

@keyframes gotop {
    50% { transform: translate(0,-50px); -ms-transform: translate(0,-50px); -moz-transform: translate(0,-50px); -webkit-transform: translate(0,-50px); -o-transform: translate(0,-50px) }
    100% { transform: translate(0,0); -ms-transform: translate(0,0); -moz-transform: translate(0,0); -webkit-transform: translate(0,0); -o-transform: translate(0,0) }
}

@keyframes iconrotate {
    50% { transform: rotate(360deg); -ms-transform: rotate(360deg); -moz-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg) }
    100% { transform: rotate(0); -ms-transform: rotate(0); -moz-transform: rotate(0); -webkit-transform: rotate(0); -o-transform: rotate(0) }
}

@keyframes showlinkbox {
    from { width: 0; opacity: 0 }
    to { width: 70%; opacity: 1; }
}

@keyframes closelinkbox {
    0% { width: 70%; }
    100% { width: 0; padding: 0 20px; }
}

@keyframes pulse {
    from { transform: scale3d(1, 1, 1); } 
    50% { transform: scale3d(1.05, 1.05, 1.05); } 
    to { transform: scale3d(1, 1, 1); }
}

.lion { position: fixed; bottom: 0; left: 1%; width: 8%; z-index: 2 }
.zwpopup-container { position: fixed; top: 0; height: 100%; z-index: 60; left: 0; width: 100%; background-color: rgba(0,0,0,.4); overflow: auto }
.zwpopup-wrapper { height: 90%; width: 50%; margin: 5% auto 0; overflow: auto }
.zwpopup-bg { padding: 10% 0; background: url(../img/bg/bgzw.png) no-repeat; text-align: center; background-size: 100% 100%; }
    .zwpopup-bg img:nth-child(1) { width: 15%; }
