.area3, .area2{ display:none; } .container1{ height:370px;width:100%; } .container1 .main3 { box-sizing: border-box;position:absolute;left:0;top:110px; } .container1 .main3 img{ width:22px;height:22px;position:relative; } .container1 .main3 .cn{ font-size:36px;font-family:PingFangSC-Semibold,PingFang SC,Microsoft Yahei;font-weight:600;color:#fff; margin-top:16px; } .container1 .main3 .en{ font-size:14px;font-family:DINCondensed-Bold,DINCondensed,Microsoft Yahei;font-weight:bold;color:#fff; margin-top:7px; } .container2 .main { display:flex;flex-direction: row;justify-content: center;height:68px;align-items: center; } .container2 .main div{ width:174px;height:40px;text-align:center;border:1px solid #8285BB;box-sizing: border-box; color:#8285BB;line-height:40px;margin-right:30px;cursor:pointer;transition: all 400ms; } .container2 .main div:hover{ background-color:#B39EBA;border:1px solid #B39EBA;transition: all 400ms;color:#fff; } .container2 .main div.active{ background-color:#8285BB;color:#fff; } .container2 .main div:last-child{ margin-right:0; } .container3 .main1 { text-align:center;margin-top:34px; } .container3 .main1 .en{ font-size:30px;font-family:DINCondensed-Bold,DINCondensed,Microsoft Yahei;font-weight:bold;color:rgba(74,74,74,1); line-height:36px; } .container3 .main1 .cn{ font-size:18px;font-family:PingFangSC-Semibold,PingFang SC,Microsoft Yahei;font-weight:600;color:rgba(51,51,51,1); line-height:25px; } .container4 { background:linear-gradient(180deg,rgba(255,255,255,1) 0%,rgba(243,236,232,1) 100%); } .container4 .main2{ margin-top:24px;display:flex;flex-direction: row;height:500px; } .container4 .main2 .left{ width:480px;padding:30px 40px 0 60px;box-sizing: border-box;background-color:#fff; } .container4 .main2 .left .logo{ width:239px;height:64px; } .container4 .main2 .left .content{ margin-top:30px;font-size:14px;font-family:PingFangSC-Regular,PingFang SC,Microsoft Yahei;font-weight:400; color:rgba(102,102,102,1);line-height:24px;text-align:justify; } .container4 .main2 .right{ width:680px;background-color:#D0021B;height:100%; } .container4 .main2 .right .img{ width:100%;height:330px; } .container4 .main2 .right .bottom{ padding-top:38px;padding-left:60px; } .container4 .main2 .right .bottom img{ width:39px;height:42px; } .container4 .main2 .right .bottom .en{ font-size:36px;font-family:DINCondensed-Bold,DINCondensed,Microsoft Yahei;font-weight:bold;color:rgba(255,255,255,0.5); margin-top:10px;line-height:36px; } .container4 .main2 .right .bottom .cn{ font-size:18px;font-family:PingFangSC-Semibold,PingFang SC,Microsoft Yahei;font-weight:600; color:rgba(255,255,255,1);margin-top:5px; } .container5 { background-color:#CFCBCB;height:374px; } .container5 .main3{ display:flex;flex-direction: row;height:325px; } .container5 .main3 .left{ width:480px;background-color:#4A4A4A;box-sizing: border-box; padding:30px 19px 19px 30px; } .container5 .main3 .left .en{ font-size:30px;font-family:DINCondensed-Bold,DINCondensed,Microsoft Yahei; color:rgba(255,255,255,1);line-height:36px; } .container5 .main3 .left .cn{ font-size:18px;font-family:PingFangSC-Semibold,PingFang SC,Microsoft Yahei;font-weight:600; color:rgba(255,255,255,1);line-height:25px; } .container5 .main3 .right{ background-color:#D0021B;width:680px;height:100%; } .container5 .main3 .right .text{ font-size:18px;font-family:PingFangSC-Regular,PingFang SC,Microsoft Yahei;font-weight:400;color:rgba(244,244,244,1); line-height:32px;letter-spacing:3px;text-align:right;margin-top:100px;margin-right:70px; } .container5 .main3 .left .items{ margin-top:32px;width:431px;height:124px;overflow:hidden; padding-bottom:14px; } .container5 .main3 .left .item{ flex-direction: row;display:none; } .container5 .main3 .left .item.active{ display:flex; } .container5 .main3 .left .item .img{ margin-right:20px; } .container5 .main3 .left .item .img img{ width:190px;height:122px; } .container5 .main3 .left .item .title{ font-size:14px;font-family:PingFangSC-Semibold,PingFang SC,Microsoft Yahei;font-weight:600;color:rgba(255,255,255,1); line-height:20px; } .container5 .main3 .left .item .summary{ margin-top:16px; } .container5 .main3 .left .item .summary,.container5 .main3 .left .item .telephone{ font-size:13px;font-family:PingFangSC-Regular,PingFang SC,Microsoft Yahei;font-weight:400;color:rgba(255,255,255,1); line-height:18px;vertical-align: top; } .container5 .main3 .left .item .telephone{ margin-top:20px; } .container5 .main3 .left .item .telephone span{ font-size:24px;font-family:DINCondensed-Bold,DINCondensed,Microsoft Yahei;font-weight:bold;color:rgba(255,121,59,1); line-height:29px; } .container5 .main3 .left .opt{ display:flex;flex-direction: row;border-top:1px solid #CFCBCB;padding-top:8px; justify-content: center;align-items: center; } .container5 .main3 .left .btn_left{ width:37px;height:37px;cursor: pointer;margin-right:11px; background-image: url("../img/other/icon_left.png");background-size: 100% 100%; } .container5 .main3 .left .btn_left:hover{ background-image: url("../img/other/icon_left_active.png");background-size: 100% 100%; } .container5 .main3 .left .btn_right{ width:37px;height:37px;cursor: pointer; background-image: url("../img/other/icon_right.png");background-size: 100% 100%; } .container5 .main3 .left .btn_right:hover{ background-image: url("../img/other/icon_right_active.png");background-size: 100% 100%; } .container6 { background:linear-gradient(180deg,rgba(255,255,255,1) 0%,rgba(243,236,232,1) 100%);height:450px; margin-top:45px; } .container6 .main{ display:flex;flex-direction: row;height:450px; } .container6 .main .left{ width:670px;height:100%; } .container6 .main .left img{ width:100%;height:100%; } .container6 .main .right{ width:490px;background-color:#fff;text-align:center;padding:44px 64px 0 72px;box-sizing: border-box; } .container6 .main .right img{ width:148px;height:118px; } .container6 .main .right .content{ font-size:13px;font-family:PingFangSC-Regular,PingFang SC,Microsoft Yahei;font-weight:400;color:rgba(74,74,74,1); line-height:24px;margin-top:40px;text-align:left; } .container7 { height:397px;background-color:#174C8E;position:relative; } .container7 .bg_left{ position:absolute;left:0;top:0;width:50%;height:100%;background-color:#00B5D6; z-index:10; } .container7 .center_area{ z-index:20; } .container7 .main{ display:flex;flex-direction: row; } .container7 .main .left{ width:670px;height:397px;background-color:#00B5D6;text-align:center; } .container7 .main .left img{ width:40px;height:45px;margin-top:90px; } .container7 .main .left .en{ font-size:36px;font-family:DINCondensed-Bold,DINCondensed,Microsoft Yahei;font-weight:bold; color:rgba(255,255,255,1);line-height:43px;margin-top:23px; } .container7 .main .left .cn{ font-size:18px;font-family:PingFangSC-Semibold,PingFang SC,Microsoft Yahei;font-weight:600; color:rgba(255,255,255,1);line-height:25px;margin-top:8px; } .container7 .main .right{ width:490px;height:397px;background-color:#174C8E;box-sizing: border-box; padding-top:126px;padding-left:45px;position:relative; } .container7 .main .right .text{ font-size:14px;font-family:PingFangSC-Regular,PingFang SC,Microsoft Yahei;font-weight:400; color:rgba(255,255,255,1);line-height:20px; } .container7 .main .right .telephone{ font-size:48px;font-family:DINCondensed-Bold,DINCondensed,Microsoft Yahei;font-weight:bold;color:rgba(0,157,196,1); line-height:58px;margin-left:70px;margin-top:-20px; } .container7 .main .right .pointer { width:25px;height:25px;background-color:#00B5D6;transform:rotate(45deg); -webkit-transform:rotate(45deg); /*兼容-webkit-引擎浏览器*/ -moz-transform:rotate(45deg); /*兼容-moz-引擎浏览器*/ position:absolute;left:-15px;top:126px; } .container8 { background-color:#9A9CC4;margin-top:40px; } .container8 .main{ display:flex;flex-direction: row;height:456px; } .container8 .main .left{ width:562px;height:100%;background-color:#8285BB; } .container8 .main .left img { width:562px;height:376px; } .container8 .main .right{ padding:26px 20px 20px 37px;box-sizing: border-box;width:598px; } .container8 .main .right .en{ font-size:36px;font-family:DINCondensed-Bold,DINCondensed,Microsoft Yahei;font-weight:bold;color:rgba(255,255,255,1); line-height:43px; } .container8 .main .right .cn{ font-size:18px;font-family:PingFangSC-Semibold,PingFang SC,Microsoft Yahei;font-weight:600;color:rgba(255,255,255,1); line-height:25px; } .container8 .main .right .info{ margin-top:20px;margin-bottom:10px;border-top:1px solid #CFCBCB;border-bottom:1px solid #CFCBCB; padding-top:8px;padding-bottom:8px; } .container8 .main .right .info .telephone{ font-size:36px;font-family:DINCondensed-Bold,DINCondensed,Microsoft Yahei;font-weight:bold;color:rgba(2,15,89,1); line-height:43px;padding-left:30px;padding-top:6px;box-sizing: border-box; background-image:url("../img/other/icon_tel_1.png");background-size:21px 23px; background-repeat: no-repeat;background-position: left center; } .container8 .main .right .info .addr{ font-size:14px;font-family:PingFangSC-Semibold,PingFang SC,Microsoft Yahei;font-weight:600;color:rgba(255,255,255,1); line-height:23px;padding-left:30px; background-image:url("../img/other/icon_addr_1.png");background-size:16px 23px; background-repeat: no-repeat;background-position: left center; } .container8 .main .right .content{ font-size:13px;font-family:PingFangSC-Regular,PingFang SC,Microsoft Yahei;font-weight:400;color:rgba(255,255,255,1); line-height:24px;text-align:justify; } .container9 { height:487px;background-color: #F4F4F4; } .container9 .main{ display:flex;flex-direction: row;height:487px; } .container9 .main .right{ width:598px;height:100%;background-color:#CFCBCB; } .container9 .main .right img { width:100%;height:400px; } .container9 .main .left { width:562px;padding:61px 58px 0 0;box-sizing: border-box; } .container9 .main .left .en{ font-size:36px;font-family:DINCondensed-Bold,DINCondensed,Microsoft Yahei;font-weight:bold;color:rgba(74,74,74,1); line-height:43px; } .container9 .main .left .cn{ font-size:18px;font-family:PingFangSC-Semibold,PingFang SC,Microsoft Yahei;font-weight:600;color:rgba(74,74,74,1); line-height:25px; } .container9 .main .left .info{ margin-top:20px;margin-bottom:10px;border-top:1px solid #CFCBCB;border-bottom:1px solid #CFCBCB; padding-top:8px;padding-bottom:8px; } .container9 .main .left .info .telephone{ font-size:36px;font-family:DINCondensed-Bold,DINCondensed,Microsoft Yahei;font-weight:bold;color:rgba(2,15,89,1); line-height:43px;padding-left:30px;padding-top:6px;box-sizing: border-box; background-image:url("../img/other/icon_tel_2.png");background-size:21px 23px; background-repeat: no-repeat;background-position: left center; } .container9 .main .left .info .addr{ font-size:14px;font-family:PingFangSC-Semibold,PingFang SC,Microsoft Yahei;font-weight:600;color:rgba(74,74,74,1); line-height:23px;padding-left:30px; background-image:url("../img/other/icon_addr_2.png");background-size:16px 23px; background-repeat: no-repeat;background-position: left center; } .container9 .main .left .content{ font-size:13px;font-family:PingFangSC-Regular,PingFang SC,Microsoft Yahei;font-weight:400;color:rgba(74,74,74,1); line-height:24px;text-align:justify; }