@charset "UTF-8";
/*颜色*/
/*字体*/
/*主内容区域宽度*/
.erweima { display: none !important; }

.circle-content { display: none !important; }

#content { width: 100% !important; margin: 0; padding: 0; }

.codet { margin-left: 15px; }

.banner-top { width: 1164px; height: 306px; }

.banner-top img { width: 100%; height: 100%; }

.box { overflow: hidden; background: #f1f8ff; width: 100%; margin: 0 auto; }

.download-bg { width: 100%; height: 1100px; background: url("/images/download/banner-bg3.png") no-repeat; background-size: cover; padding-top: 63px; }

.download-bg .download-con1 .title8 { width: 1420px; margin: 0 auto; }

.download-bg .download-con1 .title8 img { width: 689px; height: 691px; position: absolute; left: -90px; top: 360px; }

.download-bg .download-con { margin-left: 698px; width: 1200px; margin: 0 auto; right: 0; }

.download-bg .download-con .download-top { width: 100%; height: 21px; font-size: 20px; font-family: PingFangSC-Regular; font-weight: 400; color: white; opacity: 0.6; }

.download-bg .download-con .download-option { position: absolute; margin-top: 78px; right: 0; }

.download-bg .download-con .download-option .option { width: 394px; height: 37px; margin: 0; float: left; line-height: 46px; margin-right: 30px; }

.download-bg .download-con .download-option .option i { font-size: 44px; font-family: PingFangSC-Regular; font-weight: 400; color: white; text-shadow: 0px 0px 10px rgba(128, 165, 199, 0.75); }

.download-bg .download-con .download-option .option span { font-size: 32px; font-family: PingFangSC-Regular; font-weight: 400; color: white; }

.download-bg .download-con .download-option .option b { width: 6px; height: 40px; display: block; margin-right: 21px; background: #56d2f2; margin-top: 5px; float: left; }

.download-bg .download-con .download-option .option b:hover { background: #7ff59e; }

.download-bg .download-con .download-option .option .option2 { width: 360px; height: 2px; background: white; opacity: 0.5; margin-left: 27px; }

.download-bg .download-con .download-option .option .con { width: 362px; height: auto; font-size: 22px; font-family: PingFangSC-Regular; font-weight: 400; color: white; line-height: 26px; margin-left: 21px; margin-top: 9px; }

.download-bg .download-con .download-option .option .code { width: 100%; margin-top: 30px; overflow: hidden; margin-left: 27px; }

.download-bg .download-con .download-option .option .code .codel { float: left; }

.download-bg .download-con .download-option .option .code .codel .code1 { padding: 8px; border: 1px solid white; border-radius: 10px; display: table-cell; vertical-align: middle; text-align: center; }

.download-bg .download-con .download-option .option .code .codel .code1 img { width: 133px; height: 134px; }

.download-bg .download-con .download-option .option .code .coder { float: left; margin-left: 15px; height: 148px; display: table-cell; vertical-align: middle; box-sizing: border-box; line-height: 148px; }

.download-bg .download-con .download-option .option .code .coder .code2 { width: 190px; height: 50px; margin-top: 8px; vertical-align: middle; border: 1px solid white; border-radius: 25px; line-height: 50px; margin-bottom: 32px; }

.download-bg .download-con .download-option .option .code .coder .code2:hover { background: rgba(255, 255, 255, 0.5); border-color: rgba(255, 255, 255, 0.5); }

.download-bg .download-con .download-option .option .code .coder .code2 a { display: block; }

.download-bg .download-con .download-option .option .code .coder .code2 a .img { width: 20px; height: 24px; margin-top: -7px; margin-left: 39px; margin-right: 10px; }

.download-bg .download-con .download-option .option .code .coder .code2 a span { font-size: 18px; font-family: PingFangSC-Semibold; font-weight: 600; color: white; }

.constrct { width: 100%; height: 2000px; background: #F1F8FF; height: 100%; clear: both; margin-top: -36px; }

.constrct .types { width: 760px; height: 74px; margin: 0 auto; line-height: 74px; }

.constrct .types li { float: left; width: 380px; text-align: center; background: #d4e8fe; cursor: pointer; font-size: 26px; font-family: PingFangSC-Regular; font-weight: 400; color: #52A0F8; position: relative; }

.constrct .types li:last-child { border-radius: 0 18px 18px 0; }

.constrct .types li:first-child { border-radius: 18px 0 0 18px; }

.constrct .types .active::after { content: ""; display: block; border-top: 21px solid #52A0F8; border-left: 21px solid transparent; border-right: 21px solid transparent; width: 0; position: absolute; bottom: -21px; left: 169px; }

.constrct .types .active { background: #52a0f8; color: white; }

.constrct .card1 { width: 100%; height: 100%; z-index: 10; padding-bottom: 138px; position: relative; }

.constrct .card1 .title05 { width: 14%; height: 705px; position: absolute; top: 912px; left: -3%; }

.constrct .card1 .title05 img { width: 100%; height: 100%; }

.constrct .card1 .title01 { width: 492px; clear: both; margin: 109px auto 85px auto; }

.constrct .card1 .title01 img { width: 100%; height: 100%; }

.constrct .card1 .title02 { width: 381px; height: 287px; margin: 109px auto 85px auto; position: absolute; left: 50%; clear: both; top: -3%; transform: translate(-200%); }

.constrct .card1 .title02 img { width: 100%; height: 100%; }

.constrct .card1 .title03 { width: 237px; height: 608px; margin: 109px auto 85px auto; position: absolute; clear: both; right: 0; top: 327px; }

.constrct .card1 .title03 img { width: 100%; height: 100%; }

.constrct .card1 .contents { width: 1048px; height: 340px; clear: both; overflow: hidden; box-shadow: 0px 27px 20px 0px rgba(207, 216, 220, 0.15); opacity: 0.85; border-radius: 20px 20px 120px 20px; position: absolute; top: 6%; left: 50%; transform: translate(-50%); background-position-x: left; background-position-y: bottom; background-size: 167px 165px; z-index: 100; background-color: white; }

.constrct .card1 .contents ul { padding: 75px 0 0 180px; }

.constrct .card1 .contents ul .l1 { height: 30px; font-size: 30px; font-family: PingFangSC-Semibold; font-weight: bold; color: #56d2f2; }

.constrct .card1 .contents ul .l2 { font-size: 22px; width: 785px; font-family: PingFangSC-Semibold; font-weight: bold; color: #333333; line-height: 36px; margin-top: 29px; }

.constrct .card1 .contents ul .l3 { font-size: 22px; font-family: PingFangSC-Semibold; font-weight: bold; color: #333333; line-height: 36px; margin-top: 30px; }

.constrct .card1 .contents .title04 { width: 155px; height: 161px; position: absolute; left: -15px; top: 193px; z-index: -1; clear: both; }

.constrct .card1 .contents .title04 img { width: 100%; height: 100%; }

.constrct .card1 .bottoms { width: 100%; margin-top: 575px; }

.constrct .card1 .bottoms .title07 { width: 744px; height: 105px; margin: 0 auto; }

.constrct .card1 .bottoms .title07 img { width: 100%; height: 100%; }

.constrct .card1 .countryBoxs { width: 1200px; margin: 0 auto; display: block; }

.constrct .card1 .country { width: 1200px; height: 828px; margin: 0 auto; position: relative; display: table-cell; vertical-align: middle; clear: both; padding-bottom: 30px; }

.constrct .card1 .country .clefts { width: 534px; float: left; }

.constrct .card1 .country .clefts .div1 { height: 60px; line-height: 60px; }

.constrct .card1 .country .clefts .div1 .co { margin-left: 29px; }

.constrct .card1 .country .clefts .div1 i { width: 6px; display: block; height: 56px; background: #c7ecff; float: left; line-height: 40px; }

.constrct .card1 .country .clefts .div1 span { display: block; height: 60px; line-height: 55px; font-size: 44px; font-family: PingFangSC-Semibold; font-weight: 600; color: #56d2f2; float: left; margin-right: 16px; }

.constrct .card1 .country .clefts .div1 img { width: 22px; height: 24px; margin-left: -8px; vertical-align: middle; }

.constrct .card1 .country .clefts .div2 { width: 424px; height: 59px; font-size: 26px; font-family: PingFangSC-Regular; font-weight: 400; color: #333333; line-height: 34px; margin-top: 29px; margin-bottom: 38px; margin-left: 35px; }

.constrct .card1 .country .clefts .div3 { width: 238px; height: 68px; margin-left: 29px; }

.constrct .card1 .country .clefts .div3 img { width: 100%; height: 100%; }

.constrct .card1 .country .crights { width: 562px; height: 682px; position: absolute; right: 0px; top: 45px; }

.constrct .card1 .country .crights .a31 { width: 190px; height: 233px; position: absolute; right: 0px; bottom: -37px; }

.constrct .card1 .country .crights .a31 img { width: 100%; height: 100%; }

.constrct .card1 .country .crights img { width: 100%; height: 100%; }

.constrct .card1 .country1 { width: 1200px; height: 600px; position: relative; margin: 0 auto; margin-top: 89px; clear: both; padding-bottom: 30px; }

.constrct .card1 .country1 .clefts { width: 507px; float: left; margin-left: 571px; margin-top: 30px; text-align: right; }

.constrct .card1 .country1 .clefts .div1 { height: 60px; line-height: 60px; }

.constrct .card1 .country1 .clefts .div1 i { width: 6px; display: inline-block; height: 56px; background: #c7ecff; vertical-align: middle; line-height: 40px; }

.constrct .card1 .country1 .clefts .div1 span { display: inline-block; height: 60px; line-height: 55px; vertical-align: middle; font-size: 44px; font-family: PingFangSC-Semibold; font-weight: 600; color: #56d2f2; margin-left: 29px; text-align: right; margin-right: 24px; }

.constrct .card1 .country1 .clefts .div1 img { width: 22px; height: 24px; margin-left: 18px; vertical-align: middle; }

.constrct .card1 .country1 .clefts .div2 { width: 307px; height: 59px; font-size: 26px; font-family: PingFangSC-Regular; font-weight: 400; color: #333333; line-height: 34px; margin-top: 29px; margin-bottom: 38px; margin-left: 165px; }

.constrct .card1 .country1 .clefts .div3 { width: 238px; height: 68px; margin-left: 253px; }

.constrct .card1 .country1 .clefts .div3 img { width: 100%; height: 100%; }

.constrct .card1 .country1 .crights { width: 645px; height: 628px; float: left; position: absolute; left: -96px; z-index: -11; }

.constrct .card1 .country1 .crights .a31 { width: 190px; height: 233px; position: absolute; right: 0px; bottom: -37px; }

.constrct .card1 .country1 .crights .a31 img { width: 100%; height: 100%; }

.constrct .card1 .country1 .crights img { width: 100%; height: 100%; }

.animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; }

@-webkit-keyframes rotateInDownRight { from { -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0; }
  to { -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1; } }

@keyframes rotateInDownRight { from { -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0; }
  to { -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1; } }

.rotateInDownRight { -webkit-animation-name: rotateInDownRight; animation-name: rotateInDownRight; }

@keyframes rotateInDownLeft { from { -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0; }
  to { -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1; } }

.rotateInDownLeft { -webkit-animation-name: rotateInDownLeft; animation-name: rotateInDownLeft; }

@-webkit-keyframes rotateInDownRight { from { -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0; }
  to { -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1; } }

.rotateInDownRight { -webkit-animation-name: rotateInDownRight; animation-name: rotateInDownRight; }

.upgradeBox { background: #fff; }

.upgradeBox .imgBox { width: 1200px; margin: 0 auto; }

.upgradeBox .imgBox img { width: 100%; }

.upgradeBox .textBox { padding: 10px 0; background: #fff6f0; overflow: hidden; }

.upgradeBox .textBox .main { width: 1200px; margin: 0 auto; }

.upgradeBox .textBox .main .img { width: 20px; height: 20px; float: left; }

.upgradeBox .textBox .main .img img { width: 100%; }

.upgradeBox .textBox .main p { float: left; margin-left: 10px; line-height: 20px; }

.upgradeBox .textBox .main p a { color: #5496c5; }
