ul, ol { list-style: none; }
.container-screen .center { width: 1300px; margin: 0 auto; }
.container-screen { padding-top: 62px; }
.navbar { z-index: 4000; }
.navbar-max { border-bottom: 1px solid #d3d3d3; }
.screen-first-pic { position: relative; z-index: 3; }
.first-pic { width: 500px; height: 450px; position: fixed; left: 50%; top: 50%; margin: -185px 0 0 -250px; }
.first-pic-a { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 2; }
.first-pic-b { position: absolute; overflow: hidden; left: 0; top: 0; z-index: 1; width: 490px; height: 440px; position: absolute; left: 5px; top: 5px; }
.first-pic-in { overflow: hidden; }
.img-pc { display: block; }
.img-ph { display: none; }
.download-menu { display: none; z-index: 3333; height: 70px; position: fixed; left: 0; top: 62px; width: 100%; line-height: 70px; font-size: 16px; }
.download-menu a { color: #ffffff; margin: 0 50px; position: relative; z-index: 3; display: inline-block; line-height: 26px; padding: 4px 16px; border: 1px solid transparent; }
.download-menu a:hover { opacity: 0.7; }
.d-m-bg { position: absolute; top: 0; left: 0; height: 100%; width: 100%; background: #022d94; opacity: 0.75; }
.screen-download-display { display: none; text-align: center; position: fixed; left: 0; top: 0; height: 100%; width: 100%; background: url('http://www.ssxhl.com/uploadfile/content/2018/02/zwcad2019/images/cadpic/bg001.jpg') top center no-repeat; background-size: 100% 100%; z-index: 99; }
.s-d-list { display: inline-block; width: 180px; text-align: left; margin: 0 70px; }
.s-d-d { width: 660px; position: absolute; top: 50%; left: 50%; height: 200px; margin: -30px 0 0 -300px; }
.s-d-tit { background: url('http://www.ssxhl.com/uploadfile/content/2018/02/zwcad2019/images/cadpic/icon13.png') left center no-repeat; padding-left: 33px; font-size: 16px; color: #fff; }
.s-d-con { padding-left: 33px; line-height: 30px; padding-top: 30px; }
.s-d-d-close { position: absolute; left: 50%; margin-left: 22px; bottom: 30px; width: 44px; height: 44px; display: inline-block; background: url('http://www.ssxhl.com/uploadfile/content/2018/02/zwcad2019/images/cadpic/icon12.png') no-repeat; }
.s-d-d-close:hover { opacity: 0.6; }
.download-menu.opening a { color: #fff; }
.download-menu.opening a.active { border: 1px solid #fff; }
.s-d-con a { color: #fff; }
.s-d-con a:hover { opacity: 0.7; }
.first-pic-out { position: absolute; left: -100px; top: 20px; z-index: 10; }
.first-pic-in { opacity: 1; }
.firstOut .first-pic-in { opacity: 0; }
.thIE.firstOut .first-pic-in { display: none; }
.thIE .first-pic-out { display: none; }
.thIE.firstOut .first-pic-out { display: block; }
.first-pic-out { opacity: 0; }
.firstOut .first-pic-out { opacity: 1; }
.screen-first-pic.abs .first-pic { position: absolute; margin-top: 0; }
.screen-first-pic { min-height: 2000px; background: #fff; }
.first-word { width: 700px; padding-top: 80px; }
.screen-h1 { color: #fff; font-size: 70px; }
.screen-h2 { color: #fff; font-size: 24px; }
.screen-h3 { color: #fff; font-size: 24px;}
.screen-h3 span { display: block; }
.screen-download { margin-top: 65px; position: relative; z-index: 33; }
.download-list { display: inline-block; position: relative; width: 160px; margin: 0 5px; margin-bottom: 30px; }
.download-list ul { display: none; position: absolute; left: 0; top: 0; background: #021662; width: 100%; padding: 0; }
.d-l-a { display: inline-block; background: #ffffff; height: 36px; font-size: 16px; line-height: 36px; width: 100%; text-align: center; position: relative; color: #021662; }
.d-l-a i { display: inline-block; width: 27px; height: 23px; background: url('http://www.ssxhl.com/uploadfile/content/2018/02/zwcad2019/images/cadpic/icon10.png') no-repeat; vertical-align: -6px; margin-right: 10px; }
.d-l-a:hover, .d-l-a.active { background: #021662; color: #fff; }
.download-list ul li a { color: #fff; font-size: 14px; display: block; line-height: 36px; text-align: center; position: relative; }
.download-list ul li a:after { content: ''; right: 0; top: 12px; bottom: 12px; width: 1px; background: #fff; position: absolute; }
.download-list ul li { padding: 0; float: left; width: 50%; }
.download-list ul li:last-child a:after { display: none; }
.download-list ul li a:hover { opacity: 0.7; }
.screen-more { margin-top: 50px; }
.screen-more a { font-size: 18px; color: #072a7c; display: inline-block; padding-left: 36px; background: url('http://www.ssxhl.com/uploadfile/content/2018/02/zwcad2019/images/cadpic/icon02.png') left center no-repeat; }
.screen-more a:hover { opacity: 0.7; }
/* topic */
.d-l-a { position: relative; }
.d-l-a { -webkit-transition: all 0.6s ease-in; transition: all 0.6s ease-in; }
.d-l-a:before, .d-l-a:after { content: ''; display: block; position: absolute; }
.d-l-a:after, .d-l-a:before { box-sizing: border-box; border: 1px solid transparent; width: 0; height: 0; }
.d-l-a:before { bottom: 0; right: 0; transition: border-color 0s ease-in 1.4s, width 0.2s ease-in 0.2s, height 0.2s ease-in; }
.begin .d-l-a:after, .begin .d-l-a:before { width: 100%; height: 100%; }
.begin .d-l-a:before { border-bottom-color: #021662; border-left-color: #021662; transition: width 0.8s ease-out 2.2s, height 0.4s ease-out 3.0s; }
.d-l-a:after, .d-l-a:before { box-sizing: border-box; border: 1px solid transparent; width: 0; height: 0; }
.d-l-a:after { top: 0; left: 0; transition: width 0.8s ease-in 2.6s, height 0.4s ease-in 3.4s; }
.begin .d-l-a:after { border-top-color: #021662; border-right-color: #021662; transition: width 0.8s ease-out 1s, height 0.4s ease-out 1.8s; }
.screen-h3, .screen-download, .screen-more { opacity: 1; transform: translate3d(0, 0, 0); }
.begin .screen-h3, .begin .screen-download, .begin .screen-more { opacity: 1; transform: translate3d(0, 0, 0); }
.elements { position: absolute; background-repeat: no-repeat; background-size: 100%; }
.jq-h1 { font-size: 32px; color: #000000; }
.jq-h2 { font-size: 16px; line-height: 1.6; color: #666666; opacity: 0.75; padding-top: 40px; }
.jq-h2 span,.jq-h1 span { display: block; }
.jq-h1 { opacity: 0; transform: translate3d(0,40px,0); }
.begin .jq-h1 { opacity: 1; transform: translate3d(0,0,0); }
.jq-h2,.jq-h3 { opacity: 0; transform: translate3d(0,40px,0); }
.begin .jq-h2,.begin .jq-h3 { opacity: 1; transform: translate3d(0,0,0); }
.f9f9f9 { background: #f9f9f9; }
.pic-m { display: none; }
.tab-container { position: relative; }
.tab-screen { position: relative; z-index: 4 }
.tab-hide { opacity: 0; z-index: 3; position: absolute; width: 100%; top: 0; bottom: 0; }
/* 1 */
.first-screen { background: url(/uploadfile/content/2019/10/tzpic/first-img01.png) top center no-repeat; height: 880px; width: 100%; padding-top: 135px; text-align: center; }
.fi-h1 { font-size: 42px; color: #fff; }
.fi-h2 { font-size: 20px; line-height: 48px; color: #fff; padding-top: 5px; }
.fi-h2 span { display: block; }
.fi-button { padding-top: 65px; }
.fi-button a { display: inline-block;opacity: 0.85; }
.fi-button a:hover { opacity: 1; }
/* 2 */
.second-screen { text-align: center; background: #FAFAFA; padding-bottom: 140px; }
.se-tit { font-size: 42px; color: #000; padding-top: 85px; }
.se-item { float: left; width: 358px; margin:0 30px;}
.se-item-con:after { content: ''; background: url(/uploadfile/content/2019/10/tzpic/icon04.png) no-repeat; width: 40px; height: 24px; z-index: 4; display: inline-block; position: absolute; left: 50%; top: -24px; margin-left: -20px; }
.se-item:first-child { margin-left: 0; }
.se-item:last-child { margin-right: 0; }
.se-list { margin-top: 80px; }
.se-item-title { font-size: 20px; color: #1A1A1A; line-height: 24px; padding-top: 60px; }
.se-item-title span { display:block; }
.se-item-con { margin-top: 38px; background: #fff; padding: 0 28px; padding-top: 45px;box-shadow:0px 3px 10px 3px rgba(4,0,0,0.06); min-height: 380px; position: relative; }
.se-item-con p { font-size: 13px; line-height: 20px; color: #5D5D5D; text-align: left; height: 135px; }
/* 3 */
.third-screen { height: 538px;background: url(/uploadfile/content/2019/10/tzpic/third-bg.png) top center no-repeat; text-align: center; }
.th-tit { font-size: 38px; color: #fff; line-height: 48px; padding-top: 94px; }
.th-tit span { display: block; }
.th-list { margin-top: 60px; }
.th-item { display: inline-block; margin: 0 30px; }
.th-item p { font-size: 20px; color: #5FC0FD; padding-top: 30px; }
/* form */
.form-screen { display: none; background: rgba(0,0,0,0.9); padding: 40px 0; text-align: center; position: fixed; bottom: 0; width: 100%; left: 0; z-index: 99000 }
.form-con span { display: inline-block; background: #313131; border-radius: 6px; padding-left: 18px; height: 38px; line-height: 38px; margin: 0 2px; }
.form-con span em { font-size: 14px; color: #fff; opacity: 0.45; }
.form-con span input { border: none; height: 38px; line-height: 38px; width: 170px; background: none; color: #fff; opacity: 0.6;}
.form-con span a {border:1px solid #5E6DFE; border-radius: 0 6px 6px 0; display: inline-block; height: 38px; line-height: 38px; width: 90px; background: #5E6DFE; color: #fff; font-size: 14px; }
.form-btn { display: inline-block; background: #5E6DFE; height: 38px; line-height: 38px; color: #fff; font-size: 14px; padding: 0 50px; border-radius: 6px; }
.download-menu-close { z-index: 5; position: absolute; top: 22px; right: 22px; font-size: 14px; width: 22px; height: 22px; line-height: 19px; text-align: center; color: #fff; border: 1px solid #fff; }
.form-con span a.link-click.gray { background-color: #ccc; }
.form-con span a.get-link-click { background: #fff; border:1px solid #5E6DFE; color: #5E6DFE; }
.form-con span select{
background-color: #313131;
border: none;
color: #fff;
opacity: 0.45;
text-align: center;
font-size: 14px;
outline: none;
}
.form-con span select option{
color: #979797;
text-align: center;
}
/* 4 */
.fourth-screen { background: #FAFAFA; padding:92px 0 138px 0; }
.fo-tit { text-align: center; font-size: 42px; color: #000; }
.fo-list { margin-top: 100px; }
.fo-item { width: 586px; height: 235px; float: left; background: #fff; padding: 42px 52px 0 52px;box-shadow:0px 3px 10px 3px rgba(4,0,0,0.06); }
.fo-item:first-child { margin-right: 26px; border-left: 7px solid #4A26A0; padding-left: 45px; }
.fo-logo span { display: inline-block; position: relative; }
.fo-logo span:after { content: ''; position: absolute; right: -60px; top: 5px; background: url(../images/tzpic/four-icon01.png) no-repeat; width: 17px;height: 9px; }
.fo-con { font-size: 14px; color: #535353; line-height: 24px; padding-top: 30px; }
/* css style */
@media (max-width:1300px) {
.container-screen .center { width: 100%; padding: 0 30px; }
.form-con span{
margin-bottom: 5px;
}
}
@media (max-width:1220px) {
.se-item { width: 30%; margin: 0 2%; }
.fo-item { width: 48%; height: 250px; }
.fo-item:first-child { margin-right: 4%; }
}
@media (max-width:1024px) {
.fo-item { width: 48%; height: 280px; }
.form-btn { margin-top: 20px; }
}
@media (max-width:990px) {
.se-item-title span { display: inline; }
.se-item-con p { height: 160px; }
.th-item { margin: 0 16px; }
}
@media (max-width:900px) {
.first-screen { background-size: auto 760px; height: 760px; padding-top: 80px; }
img { max-width: 100%; }
.se-item { width: 100%; margin: 0; }
.se-item-con p { height: auto; margin-bottom: 40px; }
.se-item-con { min-height: 0; }
.se-item-con { margin-bottom: 50px; }
.se-item-con { padding-bottom: 50px; }
.th-item img { width: 120px; }
.fo-item { width: 100%; margin-right: 0; margin-bottom: 30px; }
.form-btn { width: 250px; text-align: center; }
}
@media (max-width:767px) {
.fi-h1 { font-size: 30px; padding-bottom: 10px; }
.fi-h2 { font-size: 16px; line-height: 2 }
.th-item img { width: 96px; }
.form-con span { width: 250px; display: block; margin:0 auto; margin-bottom: 10px; text-align: left; }
.form-btn { margin-top: 0px; }
.form-con span a { position: absolute; right: 0; top: 0; text-align: center; }
.form-code { position: relative; }
.form-code input { width: 100px !important; }
}
@media (max-width:600px) {
.fi-h1 { font-size: 1.8rem; }
.fi-h2 { font-size: 0.8rem; }
.fi-button img { width: 160px; }
.fi-button { padding-top: 30px; }
.se-tit { font-size: 1.8rem; padding-top: 50px; }
.se-list { margin-top: 60px; }
.se-number img { width: 90px; }
.se-item-title { font-size: 1.2rem; line-height: 1.6; padding-top: 30px; }
.se-item-title span { display: block; }
.th-tit { font-size: 1.8rem; line-height: 1.5; padding-top: 60px; }
.th-item img { width: 64px; }
.th-item p { font-size: 0.8rem; padding-top: 20px; }
.th-item { margin: 0 8px; }
.third-screen { padding-bottom: 60px; height: auto; }
.fo-tit { font-size: 1.8rem; }
.fourth-screen { padding: 60px 0; }
.fo-list { margin-top: 32px;}
.fo-item { height: auto; margin-right: 0 !important; padding-bottom: 30px; font-size: 0.8rem; padding-left: 40px; padding-right: 40px; }
.fo-item:first-child { padding-left: 33px; }
.fo-con { font-size: 0.8rem; }
}
@media (max-width:420px) {
}
@media (max-width:400px) {
}
@media (max-width:360px) {
.container-screen .center { padding: 0 10px; }
.th-tit span { display: inline; }
.th-item { margin: 0 3px; }
}
@media (max-width:375px) {
}
@media (max-width:320px) {
}