input,button,select,textarea{outline:none} /*取消chrome下input和textarea的聚焦边框*/ textarea{resize:none} /* 取消chrome下textarea可拖动放大 */
*{ -moz-box-sizing:border-box;box-sizing:border-box;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{ margin:0; padding:0;}
table{ border-collapse:collapse;border-spacing:0px;}
fieldset,img{ border:0;} em,th,var{ font-style:normal; font-weight:normal;}
ol,ul{ list-style:none;} caption,th{ text-align:left;} i{ font-style: normal;}
h1,h2,h3,h4,h5,h6{ font-size:100%; font-weight:normal;} li{list-style-type:none;}
q:before,q:after{ content:'';} abbr,acronym { border:0;} 
img{ width: 100%; height: 100%; vertical-align:middle; border:0;}
a,button,input,select{ -webkit-tap-highlight-color:rgba(255,0,0,0); outline: none;}
a{ text-decoration: none; color: #222;}

html{ -webkit-text-size-adjust:none;}
body{ font: 14px/26px "Microsoft YaHei", "微软雅黑", "宋体", Arial; color: #666; letter-spacing: .03em; -webkit-font-smoothing: antialiased; background: #f4f4f4;}
input,select,textarea,button{ font: 14px/26px "Microsoft YaHei", "微软雅黑", "宋体", Arial; border: 0 none; color: #333;}
input:focus{ outline: none;} button, input[type='button']{ border: 0 none; background: transparent;}
table{ font-size:inherit; font:100%;} p{ margin: 0;}
select{ -moz-appearance: none; -webkit-appearance:none; appearance:none;}
::-webkit-input-placeholder{ color: #999;}  
:-moz-placeholder { color: #999; opacity: 1;}
::-moz-placeholder{ color: #999; opacity: 1;}  
:-ms-input-placeholder{ color: #999;}  

/* Clearfix */
.clearfix:after, .clearfixlist li:after, .container:after, .mod:after, .form-group:after{ content:"\0020"; display:block; clear:both; height:0; font-size:0;}
.clearfix, .clearfixlist li, .container, .mod, .form-group{ zoom:1;}
.clear{ clear:both; display:block;} .hide, .show-pad{ display: none;}
.fl{ float: left;} .fr{ float: right;}

.flex-row{ -webkit-display: flex; -moz-display: flex; -o-display: flex; display: flex; flex-wrap: wrap; flex-direction: row; align-items: center;}
.flex-col{ -webkit-display: flex; -moz-display: flex; -o-display: flex; display: flex; flex-wrap: wrap; flex-direction: column;}
.around{ justify-content: space-around;} .between{ justify-content: space-between;}
.start{ justify-content: flex-start;} .end{ justify-content: flex-end;} .center{ justify-content: center;}
.vertical{ display: table-cell; vertical-align: middle;}
.text-left{ text-align: left;} .text-right{ text-align: right;} .text-center{ text-align: center;}
.text-ellipsis, .name{ text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}

.red{ color: #dc0930;}
.pic{ text-align: center; overflow: hidden;} .font12{ font-size: 12px; line-height: 20px;}
.form-control{ -webkit-border-radius: 0; -moz-border-radius: 0; -o-border-radius: 0; -ms-border-radius: 0; border-radius: 0;}
.circle, .scroll-top{ -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%;}
.rect2{ -webkit-border-radius: 2px; -moz-border-radius: 2px; -o-border-radius: 2px; -ms-border-radius: 2px; border-radius: 2px;}
.rect{ -webkit-border-radius: 8px; -moz-border-radius: 8px; -o-border-radius: 8px; -ms-border-radius: 8px; border-radius: 8px;}
.mirect{ -webkit-border-radius: 4px; -moz-border-radius: 4px; -o-border-radius: 4px; -ms-border-radius: 4px; border-radius: 4px;}
.mxrect{ -webkit-border-radius: 16px; -moz-border-radius: 16px; -o-border-radius: 16px; -ms-border-radius: 16px; border-radius: 16px;}
.trans, .remark{ -webkit-transition: all 0.38s ease; -moz-transition: all 0.38s ease; transition: all 0.38s ease;}
.scale{ -webkit-transform: scale(1); -moz-transform: scale(1); -o-transform: scale(1); transform: scale(1); transition: all ease 0.38s;}
.rotate{ -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: all 0.38s ease; -moz-transition: all 0.38s ease; transition: all 0.38s ease;}
.blur{ -webkit-filter: blur(2px); -moz-filter: blur(2px); -ms-filter: blur(2px); filter: blur(2px);}
a:hover .scale{ -webkit-transform: scale(1.08); -moz-transform: scale(1.08); -o-transform: scale(1.08); transform: scale(1.08);}

.nodata{ padding: 138px 28px 38px; color: #999; text-align: center; background: url(../images/empty.png) no-repeat center 28px; background-size: 108px;}
.alert{ position: fixed; z-index: 68; top: 48%; left: 50%; width: 156px; min-height: 40px; padding: 10px; margin-left: -8px; margin-top: -24px; line-height: 20px; color: #fff; text-align: center; background: rgba(0,0,0,.68);}
.model{ display: none; position: fixed; z-index: 999; top: 0; left: 0; width: 100%; height: 100%; color: #333; background: rgba(13,13,13,.7);}
.model .inner{ position: fixed; top: 50%; left: 50%;}
.model .btn-close{ position: absolute; top: 0; right: 0; width: 38px; height: 38px; background-color: #bababa; background-position: center -1128px;}
.model-alert .inner{ width: 488px; height: 200px; padding: 25px 50px; margin-top: -100px; margin-left: -244px; font-size: 18px; line-height: 32px; text-align: center; background: #fff;}
.model-alert .btn-solid{ width: 100%; height: 52px; margin: 20px 0; line-height: 52px; background: #eb008b;}
.model-alert .imore{ display: block; padding-right: 13px; font-size: 14px; color: #fe6817; text-align: right; background-position: right -1096px;}
.model-alert .imore:hover{ text-decoration: underline;}

.scroll-top{ opacity:0; position: fixed; z-index: 8; bottom: 38px; right: 38px; width: 68px; height: 68px; padding: 32px 0 16px; color: #fff; text-align: center; -webkit-transform:translateX(100%) rotate(360deg); transform:translateX(100%) rotate(360deg); transition:all .5s ease; background: url(../images/top.png) no-repeat center 18px #303135;}
.scroll-top.rollIn{ opacity:1; -webkit-transform:translateX(0px) rotate(0deg); transform:translateX(0px) rotate(0deg); transition:all .5s ease;}

.pagination{ margin: 28px 0; text-align: center;}
.pagination a{ display: inline-block; height: 32px; padding: 0 12px; margin: 0 2px; line-height: 32px; color: #818181; text-align: center; background-color: #dedede;}
.pagination a:hover, .pagination .active{ color: #fff; background-color: #008ae5;}
.pagination .icon{ text-indent: -9999em;}
.pagination.text-left{ text-align: left;}

.btn-solid{ display: block; width: 100%; height: 48px; line-height: 48px; color: #fff; text-align: center; background: #008ae5;}
.btn-more{ margin-top: 12px; text-align: right;} .btn-more a:hover{ color: #008ae5;}

.bounce-to-right{ position: relative; vertical-align: middle; -webkit-transform: translateZ(0); transform: translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); -webkit-backface-visibility: hidden; backface-visibility: hidden; -moz-osx-font-smoothing: grayscale; -webkit-transition-property: color; transition-property: color; -webkit-transition-duration: 0.5s; transition-duration: 0.5s;}
.bounce-to-right:before{ content: ""; position: absolute; z-index: -1; top: 0; left: 0; right: 0; bottom: 0; background: #e81421; -webkit-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: 0 50%; transform-origin: 0 50%; -webkit-transition-property: transform; transition-property: transform; -webkit-transition-duration: 0.5s; transition-duration: 0.5s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out;}
.bounce-to-right:hover, .bounce-to-right:focus, .bounce-to-right:active{ border-color: #e81421; color: #fff;}
.bounce-to-right:hover:before, .bounce-to-right:focus:before, .bounce-to-right:active:before{ -webkit-transform: scaleX(1); transform: scaleX(1); -webkit-transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66); transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);}

.form-free{ padding: 38px 0 12px 12px;}
.form-list li{ margin-bottom: 15px;}
.form-list input{ width: 100%; height: 50px; padding: 0 10px; border: 1px solid #d9d9d9; border-radius: 4px; line-height: 48px;}

.container{ position: relative; width: 95%; max-width: 1200px; margin: 0 auto;}
.col-2, .col-3{ float: left;}
.col-1{ float: right; width: 30%;} .col-2{ width: 50%;} .col-3{ width: 68%;}

/* header */
.fixedNav{ position:fixed; z-index:9998; top:0px; left:0px; width:100%; _position:absolute; _top:expression(eval(document.documentElement.scrollTop));}
.header{ height: 98px; background: #fff;}
.header .container{ padding: 0 218px 0 168px;}
.header .tel, .logo{ position: absolute; top: 24px;}
.header .tel{ right: 0; padding-left: 38px; font-size: 22px; font-weight: bold; line-height: 48px; color: #6f6f6f; background: url(../images/tel.png) no-repeat 0 center;}
.logo{ left: 0; width: 150px; height: 48px;}
.header-search{ padding: 6px 0; background: #f0f0f0;}
.form-search{ float: right; position: relative; width: 198px; height: 28px; padding-right: 42px; line-height: 28px;}
.form-search .isearch{ display: block; position: absolute; top: 5px; left: 4px; width: 20px; height: 20px; background: url(../images/search.png) no-repeat center center;}
.form-search input{ width: 100%; height: 28px; padding: 0 6px 0 26px;}
.form-search .btn-search{ position: absolute; z-index: 66; top: 0; right: 0; width: 42px; color: #fff; text-align: center; background: #008ae5;}

.navbar{ width: 100%;}
.nav-list li{ float: left; width: 11.1%; font-size: 16px; line-height: 98px; text-align: center;}
.nav-list a{ display: block; position: relative; color: #222;} .nav-list .show-pad{ display: none;}
.nav-list a:after{ content: '\0020'; display: block; position: absolute; bottom: 0; left: 50%; width: 32px; height: 3px; margin-left: -16px; background: transparent;}
.nav-list .active>a, .nav-list a:hover{ color: #008ae5;}
.nav-list .active>a:after, .nav-list a:hover:after{ background-color: #008ae5;}
.sublist{ display: none; position: fixed; z-index: 9999; top: 136px; left: 0; width: 100%; line-height: 48px; text-align: center; background: rgba(0,0,0,.48);}
.sublist a{ display: inline-block; margin: 0 20px; font-size: 14px; color: #fff;}
.sublist a:hover{ color: #fff;}
.sublist a:hover:after{ width: 28px; height: 2px; background-color: #fff;}
.fixedNav .sublist{ top: 98px;}

.fixed-nav{ display: none; position: fixed; z-index: 66; bottom: 0; left: 0; width: 100%; height: 48px; text-align: center; background: #f1f1f1;}
.fixed-nav a{ float: left; width: 50%; padding-top: 22px; font-size: 11px; font-weight: bold; line-height: 26px; color: #008ae5; background-repeat: no-repeat; background-position: center 6px; background-size: 18px;}
.fixed-nav .ihome{ background-image: url(../images/ihome.png);}
.fixed-nav .itel{ color: #fff; background-image: url(../images/itel.png); background-color: #008ae5;}

.footer, .footer a{ color: #bfbfbf;} .footer a:hover{ color: #008ae5;}
.footer{ padding-top: 36px; background: #3b3b3b;}
.footer .qrcode{ position: absolute; top: 0; right: 0; width: 132px; height: 132px;}
.footer-tel{ font-size: 23px; line-height: 30px;} .footer-tel .name{ font-size: 38px; line-height: 46px;}
.footer-nav, .footer-links{ padding: 32px 0;}
.footer-links{ border-top: 1px solid #656565;}
.footer-nav a, .footer-links span, .footer-links a{ display: inline-block; margin-right: 20px;}
.copyright{ padding: 25px 0; line-height: 24px; color: #bfbfbf; line-height: 30px; text-align: right; background: #303030;}
.copyright .container{ padding-left: 168px;}
.copyright .logo{ top: 5px;}

.mod-white, .bg-white{ background: #fff;}
.mod{ padding: 60px 0; background-repeat: no-repeat; background-position: center top; background-size: cover;}
.mod .hd{ margin-bottom: 28px; line-height: 48px;}
.mod .title{ font-size: 26px; font-weight: bold; color: #161c40;}
.mod .more{ float: right; padding-right: 26px; font-size: 16px; color: #333; background: url(../images/imore.png) no-repeat right center;}

.swiper-server{ padding: 0 0 16px; font-size: 16px;}
.swiper-server .swiper-slide{ box-shadow: 0 0 8px 8px #f2f2f2;}
.swiper-server .pic{ position: relative; width: 100%; -webkit-border-radius: 5px 5px 0 0; -moz-border-radius: 5px 5px 0 0; border-radius: 5px 5px 0 0;}
.swiper-server .remark{ position: absolute; top: 0; left: 0; width: 100%; padding-top: 12%; text-align: center;}
.swiper-server .icon{ width: 82px; height: 82px;}
.swiper-server .name{ margin-top: 8px; font-size: 18px; font-weight: bold; color: #fff;}
.swiper-server .info{ padding: 20px 26px 26px; -webkit-border-radius: 0 0 5px 5px; -moz-border-radius: 0 0 5px 5px; border-radius: 0 0 5px 5px; background: #fff;}
.swiper-server .txt{ height: 52px; overflow: hidden;}

.server-list li{ position:relative; padding:15px 15px 15px 72px; border:1px solid #dedede; min-height:80px; border-radius:10px; box-sizing:border-box; margin-bottom:10px;}
.server-list img{ position:absolute; left: 15px; top:18px; width:45px; max-height: 56px;}
.server-list .name{ font-weight:normal; color:#333; font-size:15px; line-height: 24px; margin-bottom:3px;}
.server-list .txt{ height: 40px; font-size:12px; color:#888; line-height:1.6; overflow: hidden;}

.mod-free .sub{ font-size: 16px; font-weight: normal; color: #5b5b5b;}
.mod-free .pic{ padding: 20px 18px 0 0;}
.notice{ width: 100%; margin: -52px 0 8px;text-align:right;}
#list{ position: relative; width: 100%; height: 48px; overflow: hidden;}
#list ul{position:absolute;top:0;width:100%;}
#list li a{display:block;position:relative; height:26px; color:#333; overflow: hidden;}

.mod-third{ background-image: url(../images/bg1.jpg);}
.mod-third .caption{ margin-bottom: 48px; font-size: 32px; line-height: 48px; color: #fff; text-align: center;}
.ball-list li{ float: left; width: 33.3%;}
.ball-list a{ display: block; width: 200px; height: 200px; padding: 18% 20px 0; margin: 0 auto; text-align: center; background: url(../images/ball.png) no-repeat center center; background-size: 100%;}
.ball-list .name{ font-size: 24px; font-weight: bold; line-height: 40px; color: #008ae5;}
.ball-list .txt{ height: 48px; line-height: 24px; overflow: hidden;}
.forth-list li{ width: 25%;}

.comlist{ margin: 0 -1%;}
.comlist li{ float: left; width: 23%; margin: 0 1%;} .comlist a{ color: #777;}
.comlist .info{ padding: 16px 0; text-align: center;}
.comlist .name{ color: #111;}
.comlist a:hover .name{ color: #008ae5;}
.recom-list .name{ font-size: 20px; font-weight: bold; line-height: 32px;}
.case-list li{ margin: 10px 1%;}

.tab-panel{ display: none;} .tab-panel.active{ display: block;}
.switch-nav{ float: right; text-align: right;}
.switch-nav a{ display: inline-block; border-bottom: 3px solid transparent; margin-right: 48px; font-size: 16px; font-weight: bold; color: #333;}
.switch-nav a:hover, .switch-nav .active{ color: #008ae5; border-color: #008ae5;}
.switch-reason{ margin-bottom: 20px; text-align: center;}
.switch-reason a{ display: inline-block; height: 36px; padding: 0 3%; border: 1px solid #cfcfcf; margin: 0 1% 16px; line-height: 34px; -webkit-border-radius: 18px; -moz-border-radius: 18px; border-radius: 18px;}
.switch-reason a:hover, .switch-reason .active{ border-color: #fff; color: #fff; background: #008ae5;}

.mod-news{ padding-top: 0;}
.swiper-news{ float: left; width: 49%;}
.swiper-news .name, .news-list .name{ font-size: 16px; font-weight: bold; color: #0c1235;}
.swiper-news .txt, .news-list .txt{ height: 48px; line-height: 24px; color: #666; overflow: hidden;}
.swiper-news .name{ margin: 12px 0 6px;}
.swiper-news a:hover .name, .news-list a:hover .name{ color: #008ae5;}
.swiper-news .swiper-button-prev, .swiper-news .swiper-button-next{ top: 28%; width: 40px; height: 40px; margin: 0; background-color: rgba(0,0,0,.66); background-size: 12px 18px;}
.swiper-news .swiper-button-prev:hover, .swiper-news .swiper-button-next:hover{ background-color: #008ae5;}
.swiper-news .swiper-button-prev{ left: 0;}
.swiper-news .swiper-button-next{ right: 0;}
.col-news{ float: right; width: 49%;}
.news-list li{ padding: 10px 0 12px; border-bottom: 1px solid #d4d4d4;}
.news-list .txt{ margin: 12px 0;}
.news-list .date{ color: #898989;}

.press-list li{ position: relative; margin-bottom: 28px;}
.press-list .pic, .press-list .info{ height: 74px;}
.press-list .pic{ position: absolute; top: 0; left: 0; width: 120px;}
.press-list .info{ margin-left: 132px;}
.press-list .name{ margin-bottom: 8px; font-weight: bold; line-height: 20px; color: #161c40;}
.press-list .txt{ height: 48px; line-height: 24px; overflow: hidden;}

/* init */
.init-about .caption{ margin-bottom: 30px; font-size: 24px; color: #333;}
.mod-about .pic{ float: left; width: 38%;}
.mod-about .info{ float: right; width: 60%;}
.mod-about .caption{ margin-bottom: 8px; font-size: 20px; color: #008ae5; font-style: italic;}
.mod-brand{ color: #fff; text-align: center; background-image: url(../images/bg3.jpg);}
.mod-brand .caption{ margin: 0; font-weight: bold; color: #fff;}
.mod-brand .line{ width: 62px; height: 3px; margin: 18px auto 12px; background: #fff;}
.mod-brand .sname{ font-weight: bold; text-transform: uppercase;}
.mod-brand .txt{ width: 92%; margin: 48px auto 0;}

.cert-list{ margin: 0 -1%;}
.cert-list li{ float: left; width: 23%; margin: 0 1% 20px 1%; text-align: center;}
.cert-list .pic{ width: 100%; border: 1px solid #d4d4d4;}
.cert-list .name{ margin: 16px 0; font-size: 16px; color: #6f6f6f;}
.cert-list a:hover .pic{ border-color: #008ae5;}
.cert-list a:hover .caption{ color: #008ae5;}

.dong-list{ margin-right: -2%;}
.dong-list li{ float: left; width: 31.3%; margin-right: 2%;}
.dong-list .pic{ margin-bottom: 18px;}
.dong-list .name{ font-size: 16px; font-weight: bold; color: #0c1235;}
.dong-list .txt{ margin-top: 5px; height: 44px; line-height: 22px; color: #666; overflow: hidden;}
.dong-list a:hover .name{ color: #008ae5;}

.about-list{ overflow: hidden;}
.about-list li{ float: left; width: 26%; cursor: pointer;}
.about-list .active{ width: 48%;}
.about-list .pic{ position: relative; width: 100%; background-position:center center; background-size:cover; background-repeat:no-repeat;}
.about-list .remark{ position: absolute; top: 50%; width: 100%; margin-top: -70px; color: #fff; text-align: center;}
.about-list .name{ margin-bottom: 16px; font-size: 28px; line-height: 36px;}
.about-list .icon{ width: 52px; height: 52px; margin: 0 auto;}

/* contact */
.mod-contact .caption{ font-style: italic; color: #008ae5;}
.mod-contact .pic{ float: right; width: 56%;}
.mod-contact .info{ float: left; width: 40%;}
.contact-list li{ position: relative; padding-left: 72px; margin-bottom: 8px;}
.contact-list .attr{ position: absolute; top: 0; left: 0; width: 72px;}
.mod-swiper{ padding-top: 20px;}
.swiper-contact{ margin-bottom: 40px; text-align: center;}
.swiper-contact a{ padding: 12px 16px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; line-height: 20px; color: #929292; background: #f2f2f2;}
.swiper-contact a:hover, .swiper-contact .active{ color: #fff; background: #008ae5;}
.swiper-contact .name{ margin-bottom: 5px; font-size: 18px; font-weight: bold; line-height: 30px;}
.swiper-contact .txt{ height: 40px; overflow: hidden;}
.table .tr{ border-bottom: 1px solid #ededed;}
.table .td{ float: left; width: 16%; padding: 13px 6px 15px; overflow: hidden;}
.table .taddr{ width: 32%;} .table .tmail{ width: 20%;}
.table .tcity{ text-align: center;}
.table .thead{ height: 42px; font-size: 18px; line-height: 42px; color: #fff; background: #008ae5;}
.table .thead .td{ padding: 0;}

.switch-case{ height: 76px; margin-bottom: 60px; line-height: 76px; text-align: center; background: #fff;}
.switch-case a{ float: left; position: relative; width: 146px; color: #5c5c5c}
.switch-case a:after{ content: '\0020'; display: block; position: absolute; bottom: -32px; left: 50%; border: 16px solid transparent; margin-left: -16px;}
.switch-case a:hover, .switch-case .active{ color: #fff; background: #008ae5;}
.switch-case a:hover:after, .switch-case .active:after{ border-top-color: #008ae5;}

.isee{ padding-left: 20px; background: url(../images/see.png) no-repeat 0 center;}
.iappoint{ padding-right: 20px; background: url(../images/iyue.png) no-repeat right center;}
.tcase-list{ margin: 0 -1%;}
.tcase-list li{ float: left; width: 23%; margin: 0 1% 40px;}
.tcase-list a{ display: block; border: 1px solid transparent;}
.tcase-list .pic{ width: 100%;}
.tcase-list .info{ padding: 8px; color: #888; background: #fff;}
.tcase-list .name{ font-size: 16px; font-weight: bold; color: #333;}
.tcase-list .isee{ float: right;}
.tcase-list a:hover{ border-color: #008ae5;}
.tcase-list a:hover .name{ color: #008ae5;}

.know-list li{ margin-bottom: 20px;}
.know-list a{ display: block; position: relative; padding: 20px; color: #888; background: #fff;}
.know-list .pic{ position: absolute; top: 20px; left: 20px; width: 234px; height: 146px;}
.know-list .info{ margin-left: 248px;}
.know-list .name{ font-size: 20px; font-weight: bold; line-height: 30px; color: #333;}
.know-list .txt{ height: 66px; margin: 13px 0; line-height: 22px; color: #717171; overflow: hidden;}
.know-list .date{ margin-right: 20px;}

.tab-aside .container{ position: relative; padding-right: 328px;}
.aside{ position: absolute; top: 0; right: 0; width: 318px;}
.mod-aside{ margin-bottom: 20px;}
.mod-srecom{ padding: 0 16px 25px; background: #fff;}
.mod-srecom .hd, .mod-mcase .hd{ padding: 22px; border-bottom: 1px solid #dcdcdc; font-size: 18px; color: #008ae5; background: url(../images/irecom.png) no-repeat 0 center;}
.rnews-list li{ position: relative; height: 70px; padding-left: 120px; margin-top: 25px;}
.rnews-list .pic{ position: absolute; top: 0; left: 0; width: 112px; height: 70px;}
.rnews-list .txt{ font-weight: bold; color: #161c40;}
.mod-appoint .hd{ height: 52px; font-size: 16px; line-height: 52px; color: #fff; text-align: center; background: #008ae5;}
.mod-appoint .bd{ padding: 16px 20px; border: 1px solid #dadada; background: #fff;}
.mod-appoint .hint{ font-size: 16px; color: #6d6d6d; text-align: center;}
.mod-appoint .red{ color: #eb2c00;}
.mod-appoint .tel{ font-size: 20px; font-weight: bold; color: #e73910;}
.mod-appoint .txt{ margin-top: 16px;}
.form-appoint{ margin: 18px 0;}
.form-appoint li{ margin-bottom: 6px;}
.form-appoint input, .form-appoint .btn-solid{ height: 40px; line-height: 38px;}
.form-appoint .btn-solid{ border: 1px solid #d5d5d5; font-size: 14px;}

.detail img{ width: auto; height: auto; max-width: 100%;}
.main{ padding: 40px 30px; margin-bottom: 20px; font-size: 16px; line-height: 30px; color: #151515; background: #fff;}
.main .title{ font-size: 30px; font-weight: bold; line-height: 32px; color: #333;}
.main .time{ margin: 20px 0; font-size: 12px; color: #888;}
.main .txt, .main .pic{ margin-bottom: 12px;}
.main .btn-page{ margin-top: 20px;} .main a:hover{ color: #008ae5;}
.main .prev, .main .next{ width: 48%;}
.main .next{ float: right; text-align: right;}

.mcase-list{ padding-top: 8px;}
.mcase-list li{ margin-top: 18px;}
.mcase-list .pic{ width: 100%; margin-bottom: 6px;}
.mcase-list .name{ font-size: 16px; font-weight: bold; color: #383838;}

@media(max-width: 1200px){
	.nav-list li, .footer-nav, .mod .more, .mod-free .sub, .swiper-server, .font-16{ font-size: 15px;}
	.mod{ padding: 50px 0;}
	.mod .hd{ margin-bottom: 20px;}
	.mod .title{ font-size: 20px;}
	
	.mod-free .sub{ font-size: 14px;}
	.mod-free .pic{ padding: 0;}
	.form-free{ padding: 0;}
	.form-list li{ margin-bottom: 12px;}
	.notice{ margin: -62px 0 18px;}
	.mod-third .caption{ margin-bottom: 28px; font-size: 26px;}
	.ball-list .name{ font-size: 20px;}
	.recom-list .name{ font-size: 18px;}
	
	.swiper-contact{ margin-bottom: 28px;}
	.swiper-contact .name{ font-size: 16px;}
	.mod-swiper{ padding-top: 10px;}
	.table{ font-size: 13px;} .table .thead{ font-size: 15px;}

	.know-list .name{ font-size: 17px;}
	.mod-srecom .hd, .mod-mcase .hd{ padding: 13px 0 13px 22px;}

	.main{ padding: 30px 20px; font-size: 14px; line-height: 26px;}
	.main .title{ font-size: 26px;} .main .time{ margin: 12px 0; line-height: 20px;}
	.about-list .remark{ margin-top: -42px;}
	.about-list .name{ margin-bottom: 10px; font-size: 24px; line-height: 32px;}
	.about-list .icon{ width: 40px; height: 40px;}
}
@media(max-width: 992px){
	.nav-list li, .footer-nav, .mod .more, .swiper-server, .font-16{ font-size: 14px;}
	.header{ height: 80px;} .nav-list li{ line-height: 80px;}
	.header .container{ padding-right: 0;}
	.header .tel{ display: none;}
	.header .logo{ top: 20px; width: 132px; height: 42px;}

	.footer{ padding-top: 26px;}
	.footer-nav a, .footer-links span, .footer-links a{ margin-right: 10px; font-size: 13px;}
	.footer-nav, .footer-links{ padding: 13px 0;}
	.footer-tel{ font-size: 18px;}
	.footer-tel .name{ font-size: 30px;}
	.footer .qrcode{ width: 100px; height: 100px;}
	.copyright{ padding: 18px 0; font-size: 13px; line-height: 24px;}
	.copyright .logo{ width: 120px; height: 38px;}

	.mod .hd{ margin-bottom: 20px;}
	.mod-news{ padding-top: 0;}

	.swiper-server .icon{ width: 66px; height: 66px;}
	.swiper-server .info{ padding: 16px;}
	.swiper-server .name{ font-size: 16px;}

	.form-list li{ margin-bottom: 8px;}
	.form-list input{ height: 42px; line-height: 40px;}
	.btn-solid{ height: 42px; line-height: 42px;}

	.comlist .info{ padding: 12px 0;}
	.recom-list .name{ font-size: 16px;}
	.case-list li{ margin: 3px 1%;}
	.news-list .txt{ margin: 5px 0;}
	.press-list li{ margin-bottom: 18px;}

	.init-about .caption{ margin-bottom: 18px; font-size: 20px;}

	.switch-case{ height: 68px; margin-bottom: 40px; line-height: 68px;}
	.tcase-list{ margin: 0 -0.5%;}
	.tcase-list li{ width: 24%; margin: 0 0.5% 28px;}
	.know-list a{ padding: 16px;}
	.know-list .pic{ top: 15px; left: 15px; width: 200px; height: 125px;}
	.know-list .info{ margin-left: 208px;}
	.know-list .name{ font-size: 16px;}
	.know-list .txt{ margin: 0;} .know-list .sub{ font-size: 13px;}

	.main{ padding: 20px 12px;} .main .time{ margin: 8px 0;}
	.main .title{ font-size: 20px;}
	.about-list .remark{ margin-top: -34px;}
	.about-list .name{ margin-bottom: 10px; font-size: 20px; line-height: 26px;}
	.about-list .icon{ width: 32px; height: 32px;}
}
@media(max-width:768px){ body{ padding: 50px 0 48px;}
	.hide-pad, .header-search{ display: none;} .show-pad, .fixed-nav{ display: block;}
	.scroll-top{ right: 0; bottom: 28px; width: 46px; height: 46px; padding: 16px 0 0; font-size: 12px; background-position-y: 8px;}
	.header{ position: fixed; z-index: 999; top: 0; left: 0; width: 100%;}
	.header, .header .container{ height: 50px;} .header .container{ width: 100%; padding: 0;}
	.header .logo{ left: 13px; top: 13px; width: 88px; height: 28px;}
	.header .tel{ display: block; right: auto; top: 12px; left: 138px; padding-left: 32px; font-size: 17px; line-height: 28px; background-size: 24px;}
	.menu{ position: absolute; top: 0; right: 0; width: 50px; height: 50px; background: url(../images/menu.png) no-repeat center center; background-size: 50px;}
	.menu.btn-close{ background-image: url(../images/close.png); background-size: 40px;}
	.navbar{ display: none; position: fixed; z-index: 9999; top: 48px; right: 0; width: 100%; height: 100%; background: #262626;}
	.navbar .form-search{ float: none; display: block; width: 88%; height: 38px; padding-right: 56px; margin: 16px auto;}
	.navbar .form-search .isearch{ top: 8px;}
	.navbar .form-search input{ width: 100%; height: 36px; border: 1px solid #575757; line-height: 36px; color: #fff; background: #262626;}
	.navbar .form-search .btn-search{ width: 58px; height: 36px; line-height: 36px;}
	.nav-list, .nav-list li{ display: block; width: 100%; line-height: 46px;}
	.nav-list li{ border-bottom: 1px solid #565656; text-align: left;}
	.nav-list .target{ display: block; padding: 0 20px; color: #fff;}
	.nav-list .active>a, .nav-list a:hover{ color: #fff; background: #1b1b1b;}
	.nav-list .active>a:after, .nav-list a:hover:after, .nav-list .hide-pad{ display: none;}
	.nav-list .show-pad{ display: block;}
	.nav-list span.target{ padding-right: 38px; background: url(../images/tright.png) no-repeat 98% center; background-size: 16px;}
	.nav-list span.target.active{ background-image: url(../images/trighted.png);}
	.nav-list .sublist{ position: static; width: 100%; padding-left: 52px; text-align: left;}
	.sublist a{ display: block; border-bottom: 1px solid #565656;} .sublist a:last-child{ border: 0 none;}
	.pagination{ margin: 20px 0;}
	.pagination a{ padding: 0 10px;}

	.col-1, .col-3{ float: none; width: 100%;}
	.mod{ padding: 30px 0;} .mod-news{ padding-top: 0;}
	.mod .hd{ margin-bottom: 8px; line-height: 40px;}
	.mod .title{ font-size: 18px;}
	.mod-third .caption{ margin-bottom: 16px; font-size: 20px;}
	.ball-list a{ width: 150px; height: 150px;}
	.ball-list .name{ font-size: 15px;} .ball-list .txt{ font-size: 13px;}
	.forth-list a{ width: 120px; height: 120px;}
	.forth-list .name{ line-height: 28px;}

	.recom-list .name{ font-size: 15px;}
	.comlist .info{ padding: 8px 0;}

	.swiper-server .icon{ width: 52px; height: 52px;}
	.mod-free .pic{ margin-bottom: 10px;}
	.mod-free .col-1{ position: relative; padding: 0 0 60px;}
	.mod-free .notice{ position: absolute; bottom: 0; left: 0; height: 48px; margin: 0; text-align: center;}
	#list li a{ font-size: 13px; color: #919191;}
	
	.mod-case .hd{ position: relative; padding: 0 0 48px;}
	.switch-nav{ position: absolute; bottom: 12px; left: 0; width: 100%; text-align: center;}
	.switch-reason{ margin: 0;}
	.switch-nav a, .switch-reason a{ border: 0 none; font-size: 13px; font-weight: bold; color: #333; background: #e9e9e9;}
	.switch-nav a{ display: inline-block; height: 36px; padding: 0 3%; margin: 0 1%; line-height: 36px; -webkit-border-radius: 18px; -moz-border-radius: 18px; border-radius: 18px;}

	/* init */
	.mod-about .caption{ margin-bottom: 8px;}
	.mod-about .pic, .mod-about .info{ float: none; width: 100%;}
	.mod-about .pic{ margin-top: 13px;}

	.mod-brand .txt{ width: 100%; margin: 12px 0 0;}
	.mod-brand .line{ width: 58px; height: 2px; margin: 8px auto;}

	.cert-list li{ width: 31.3%; margin-bottom: 0;}
	.cert-list .name{ font-size: 15px;}
	.dong-list .pic{ margin-bottom: 12px;}

	.contact-list li{ margin-bottom: 4px;}
	.mod-swiper{ padding-top: 0;}
	.swiper-contact{ margin-bottom: 18px;}
	.table .tmail{ display: none;}
	.table .td{ width: 24%; padding: 10px 4px;}
	.table .tcity{ width: 14%;}
	.table .taddr{ width: 38%;}

	.switch-case{ height: 58px; margin-bottom: 30px; line-height: 58px;}
	.tcase-list li{ width: 32.3%; margin-bottom: 20px; font-size: 13px;}
	.tcase-list .name{ font-size: 15px}

	.tab-aside .container{ padding: 0;}
	.aside{ position: static; width: 100%;}
	.mod-aside{ float: left; width: 48%;} .mod-appoint{ float: right;}
	.mod-srecom{ padding: 0 12px 18px;}
	.mod-srecom .hd, .mod-mcase .hd, .aside-list li{ margin-top: 16px;}

	.about-list .remark{ margin-top: -30px;}
	.about-list .name{ margin-bottom: 6px; font-size: 16px;}
	.about-list .icon{ width: 28px; height: 28px;}
}
@media(max-width:480px){
	.scroll-top{ bottom: 68px; background-position-y: 10px; background-size: 16px 8px;}
	
	.footer, .copyright{ background: #323232;}
	.footer{ padding: 0;} .footer .qrcode{ top: 20px; right: 20px;}
	.footer .container{ width: 100%; padding: 0;}
	.footer-nav, .footer-links{ padding: 13px;}
	.footer-tel{ padding: 28px 20px 38px; background: #3b3b3b;}
	.footer-links{ width: 96%; height: 42px; padding: 8px; border: 0 none; margin: 0 auto; background: url(../images/down.png) no-repeat 97% 12px #3e3e3e; background-size: 15px; overflow: hidden;}
	.footer-links.down{ height: auto; background-image: url(../images/top.png); background-position-y: 15px;}
	.footer-links span{ display: block; margin-bottom: 8px;}
	.copyright{ font-size: 10px;} .copyright .container{ padding-left: 118px;}
	.copyright .logo{ width: 94px; height: 30px;} .copyright .font-8{ font-size: 8px;}
	.pagination.text-left{ text-align: center;}

	.switch-nav{ bottom: 4px;} .switch-reason{ margin-bottom: 8px;}
	.switch-nav a, .switch-reason a{ height: 30px; line-height: 30px;}
	.switch-reason a{ margin-bottom: 12px;}
	.comlist li{ width: 48%; margin-bottom: 8px;}
	.mod{ padding: 15px 0;} .mod-news{ padding-top: 0;}
	.mod .title{ font-size: 16px;} .mod .more{ padding-right: 18px; font-size: 11px; opacity: 0.8; background-size: 12px;}
	.mod-free .hd{ margin-bottom: 16px;}
	.mod-free .title{ text-align: center;}
	.mod-free .sub{ display: block; line-height: 24px;}

	.swiper-server .icon{ width: 40px; height: 40px;}
	.swiper-server .info{ padding: 10px;}
	.swiper-server .name{ font-size: 14px;}

	.mod-third .caption{ margin-bottom: 8px; font-size: 17px;}
	.ball-list a{ width: 106px; height: 106px; padding: 18% 12px 0; margin-bottom: 8px;}
	.ball-list .name{ line-height: 32px;}
	.ball-list .txt{ height: 32px; font-size: 12px; line-height: 16px;}
	.forth-list a{ width: 80px; height: 80px; padding-top: 10%;}
	.forth-list .name{ line-height: 26px;}

	.btn-more a{ color: #696969;}
	.mod-news, .mod-news .col-1{ position: relative;}
	.mod-news .col-1{ margin-top: 20px;}
	.mod-news .btn-more{ position: absolute; top: 6px; right: 0; margin: 0;}
	.swiper-news, .col-news{ float: none; width: 100%;}
	.col-news{ border-top: 1px solid #d4d4d4; margin-top: 16px;}
	/* init */
	.init-about .caption{ font-size: 18px;} .mod-brand .caption{ margin-bottom: 12px;}
	.cert-list li{ width: 48%;}
	.cert-list .name{ margin: 10px 0; font-size: 14px;}

	.dong-list li{ width: 100%; margin: 0 0 16px;}

	.mod-contact .caption{ margin-bottom: 8px;}
	.mod-contact .info, .mod-contact .pic{ float: none; width: 100%;}
	.mod-contact .pic{ margin-top: 12px;}
	.swiper-contact{ padding-right: 28px;}
	.table{ line-height: 20px;}
	
	.switch-case{ height: 48px; margin-bottom: 20px; line-height: 48px;}
	.switch-case a{ width: 30%;}
	.switch-case a:after{ bottom: -20px; border-width: 10px; margin-left: -10px;}
	.tcase-list li{ width: 49%; margin-bottom: 12px; font-size: 12px;}
	.tcase-list .name{ font-size: 14px}

	.mod-aside{ float: none; width: 100%;}
	.know-list li{ margin-bottom: 10px;}
	.know-list a{ padding: 12px;}
	.know-list .pic{ width: 116px; height: 72px;}
	.know-list .info{ margin-left: 128px;}
	.know-list .name{ margin-top: -5px;}
	.know-list .txt{ height: 26px;}

	.about-list .remark{ margin-top: -25px;}
	.about-list .name{ margin-bottom: 4px; font-size: 14px;}
	.about-list .icon{ width: 20px; height: 20px;}
	
	.main{ padding: 13px; margin-bottom: 16px;} .main .title{ font-size: 17px;} .main .time{ margin: 5px 0;}
	.main .btn-page{ margin: 12px 0 0;}
	.main .prev, .main .next{ display: block; float: none; width: 100%; margin-top: 6px; text-align: left;}
}