.container1 { height:370px; } .container1 .main3 { box-sizing: border-box;position:absolute;left:0;top:110px; } .container1 .main3 img{ width:21px;height:23px;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: space-around;align-items: center; height:132px;box-sizing: border-box;padding-left:173px;padding-right: 173px; } .container2 .main .logo img{ width:200px;height:63px; } .container2 .main .sperator { width:1px;height:45px;background-color: #979797; } .container2 .main .callline { background-image: url("../img/house/icon_telephone.png");background-repeat: no-repeat; background-size: 43px 43px;padding-left:56px; } .container2 .main .callline .title{ font-size:12px;font-family:PingFangSC-Regular,PingFang SC,Microsoft Yahei;font-weight:400; color:rgba(38,13,0,1);line-height:21px; } .container2 .main .callline .telephone { font-size:30px;font-family:DINCondensed-Bold,DINCondensed,Microsoft Yahei;font-weight:bold; color:rgba(74,74,74,1);line-height:36px; } .container3 { background-color: #FEF2EC; } .container3 .main { height:692px;text-align:center;box-sizing: border-box; padding-top:30px; } .container3 .en{ font-size:24px;font-family:DINCondensed-Bold,DINCondensed,Microsoft Yahei;font-weight:bold;color:rgba(2,118,139,1); line-height:29px; } .container3 .cn{ font-size:18px;font-family:PingFangSC-Semibold,PingFang SC,Microsoft Yahei;font-weight:600;color:rgba(74,74,74,1); line-height:25px; } .container3 .content { font-size:14px;font-family:PingFangSC-Regular,PingFang SC,Microsoft Yahei;font-weight:400;color:rgba(74,74,74,1); line-height:24px;margin-top:20px;text-align:justify; } .container3 .carousel { margin-top:20px;position:relative;height:456px; } .container3 .list_box{ overflow:hidden;height:100%;width:1160px;position:relative; } .container3 .list_box ul { width:100%;height:456px;position:absolute;z-index:99; } .container3 .list_box ul li{ float:left; } .container3 .list_box ul li, .container3 .list_box ul li img{ width:1160px;height:456px; } .container3 .btn_pre{ background-image: url("../img/house/icon_pre.png");background-size: 37px 37px; width:37px;height:37px;position:absolute;left:-53px;top:210px;z-index:100; } .container3 .btn_next{ background-image: url("../img/house/icon_next.png");background-size: 37px 37px; width:37px;height:37px;position:absolute;right:-53px;top:210px;z-index:100; } .container3 .btn_pre:hover{ background-image: url("../img/house/icon_pre_active.png"); } .container3 .btn_next:hover{ background-image: url("../img/house/icon_next_active.png"); } .container4 .main{ padding-top:25px;box-sizing: border-box;text-align:center;height:345px; } .container4 .en{ font-size:24px;font-family:DINCondensed-Bold,DINCondensed,Microsoft Yahei;font-weight:bold;color:rgba(51,51,51,1); line-height:29px; } .container4 .cn{ font-size:18px;font-family:PingFangSC-Semibold,PingFang SC,Microsoft Yahei;font-weight:600;color:rgba(102,102,102,1); line-height:25px; } .container4 .list_box { display:flex;flex-direction: row;justify-content: space-between;margin-top:20px; } .container4 .list_box .item{ width:283px;height:215px;border:1px solid rgba(207,203,203,1);box-sizing: border-box; padding:12px;position:relative; } .container4 .list_box .item:hover{ cursor: pointer; } .container4 .list_box .item img { width:260px;height:160px; } .container4 .list_box .item .title div { font-size:12px;font-family:PingFangSC-Medium,PingFang SC,Microsoft Yahei;font-weight:500;color:rgba(119,119,119,1); line-height:43px; } .container4 .list_box .item .opt_view{ position:absolute;left:90px;bottom:41px;width:105px;height:0; background-image: url("../img/house/icon_view.png");background-size: 100% 100%; -webkit-transition:.5s;transition: .5s; } .container4 .list_box .item:hover .opt_view{ height:52px;-webkit-transition:.5s;transition: .5s; } .container4 .list_box .item .opt_mask{ position:absolute;left:90px;top:172px;width:105px;height:0; background-color:#B39EBA;-webkit-transition:.5s;transition: .5s; font-size:12px;font-family:PingFangSC-Medium,PingFang SC,Microsoft Yahei;font-weight:500;color:#fff; line-height:43px;overflow:hidden; } .container4 .list_box .item:hover .opt_mask{ -webkit-transition:.5s;transition: .5s;height:43px; } .container5{ background-color:#4A4A4A;display:none; } .container5.active{ display:block; } .container5 .center_area{ background-color: #FFFFFF;height:737px;padding-top:85px;box-sizing: border-box; } .container5 .opt_back{ height:56px;width:56px;background-size: 100% 100%;position:absolute;right:46px;top:26px; background-image: url("../img/icon/icon_back.png"); } .container5 .list{ margin-left:161px; } .container5 .list .item{ display:none;box-sizing: border-box; } .container5 .list .item.active{ display:block; } .container5 .list .item img{ width:840px;height:456px; } .container5 .list .item .title{ font-size:16px;font-family:PingFangSC-Medium,PingFang SC,Microsoft Yahei;font-weight:500; color:#4a4a4a;margin-top:12px; } .container5 .list .item .content{ font-size:12px;font-family:PingFangSC-Regular,PingFang SC,Microsoft Yahei;font-weight:400; color:#4a4a4a;margin-top:12px;line-height:22px;width:840px; } .container6 { background-color:#6F6358;height:500px; } .container6 .main{ display: flex;flex-direction: row; } .container6 .main .left img { width:677px;height:446px; } .container6 .left { position:relative;height:446px; } .container6 .list_box{ overflow:hidden;height:100%;width:677px;position:relative; } .container6 .list_box ul { width:100%;height:446px;position:absolute;z-index:99; } .container6 .list_box ul li{ float:left; } .container3 .list_box ul li img{ width:100%;height:100%; } .container6 .list_box ul li{ width:677px;height:446px; } .container6 .btn_pre{ background-image: url("../img/icon/icon_left_red.png");background-size: 37px 37px; width:37px;height:37px;position:absolute;left:20px;top:210px;z-index:100; } .container6 .btn_next{ background-image: url("../img/icon/icon_right_red.png");background-size: 37px 37px; width:37px;height:37px;position:absolute;right:20px;top:210px;z-index:100; } .container6 .btn_pre:hover{ background-image: url("../img/icon/icon_left_red_active.png"); } .container6 .btn_next:hover{ background-image: url("../img/icon/icon_right_red_active.png"); } .container6 .right { position:relative;box-sizing: border-box;padding:27px 0 0 34px; } .container6 .right .en{ font-size:30px;font-family:DINCondensed-Bold,DINCondensed,Microsoft Yahei;font-weight:bold;color:rgba(245,166,35,1); line-height:30px; } .container6 .right .cn{ font-size:18px;font-family:PingFangSC-Semibold,PingFang SC,Microsoft Yahei;font-weight:600;color:rgba(244,244,244,1); line-height:25px; } .container6 .right .content { font-size:13px;font-family:PingFangSC-Regular,PingFang SC,Microsoft Yahei;font-weight:400;color:rgba(244,244,244,1); line-height:18px;border-bottom:2px solid #FFFFFF;margin-top:13px;padding-bottom:13px; } .container6 .right .items .item { display:none; } .container6 .right .items .item.active{ display:inline-block; } .container6 .right .item .title{ position:absolute;width:308px;height:32px;line-height:32px;box-sizing: border-box;padding-left:35px; border-bottom-right-radius: 16px;border-top-right-radius: 16px; background-color:#9A9CC4;left:0;top:262px;color:#fff; } .container6 .right .item .summary{ font-size:13px;font-family:PingFangSC-Regular,PingFang SC,Microsoft Yahei;font-weight:400;color:rgba(244,244,244,1); line-height:18px;margin-top:110px; } .container6 .right .item .title span{ width:30px;height:30px;line-height:30px;border-radius: 15px;background-color:#F5A623;color:#fff; font-size:12px;text-align:center;display:inline-block;box-sizing: border-box; position:absolute;right:1px;top:1px; }