@charset "utf-8";
/* CSS Document */
body{ font-family:Microsoft Yahei;}
.f1{ background:url(/Template/skin1/static2020/agent/bg.png) left top;}
.grayBg {background: #f6f6f6;}
.titleBox .bigTitle{ margin-bottom:0; color:#565656;font-weight: 300;}
.titleBox .infoTitle{margin: 10px auto;padding-bottom: 20px; color:#848484;}
.titleBox{margin-bottom: 40px;}
.m-t60{ margin-top:60px;}

/*第一层*/
.drag-shortlist ul{ margin-left:-15px; margin-right:-15px;}
.community-edition{background:#fff;padding:40px 15px;transition:.3s ease-in-out;-moz-transition:.3s ease-in-out;-webkit-transition:.3s ease-in-out;margin:0 15px 25px;text-align: center;}
.community-edition:hover{-webkit-transform: translateY(-5px);transform: translateY(-5px);}
.community-edition:before {pointer-events: none;position: absolute;z-index: -1;content: '';top: 100%;left: 5%;height: 10px;width: 90%;opacity: 0;background: -webkit-radial-gradient(center, ellipse, rgba(0, 0, 0, 0.25) 0%, rgba(0, 0, 0, 0) 80%);background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.25) 0%, rgba(0, 0, 0, 0) 80%);-webkit-transition-duration: 0.3s;transition-duration: 0.3s;-webkit-transition-property: transform, opacity;transition-property: transform, opacity;}
.community-edition:hover:before {opacity: 1;-webkit-transform: translateY(5px);transform: translateY(5px);}
.community-edition:hover{background:#46b7bf;color:#fff;}
.community-edition:hover i {color:#fff;}
.community-edition .separator {height: 2px;width: 80px;margin: auto;background: #ededed;}
.community-edition:hover h4 {color:#fff;}
.community-edition:hover p {color:#fff;}

.community-edition i{font-size:60px;color:#46b7bf;margin-bottom: 20px;display: inline-block;}
.community-edition h4{font-size:18px;color:#000;text-transform:uppercase;font-weight:500;letter-spacing:1px;margin-top:15px;line-height: 44px;text-align: center;margin-bottom: 10px;}
.community-edition p{font-size:15px;color:#777777; text-align:center;line-height: 30px;margin: 0 15px;}
.portfolio-wrapper2{margin-top:25px;}

/*第二层*/
.f2 .drag-functBoxleft{ text-align:left;}
.f3 .drag-functBoxleft{ text-align:right;}
.drag-functBoxleft img{height:460px;}
.drag-functBoxright {margin-top:10%;}
.drag-functBoxright h2 {margin-bottom: 40px;font-size:40px;color:#222222;font-weight: 300;}
.drag-functBoxright p{font-size:16px;line-height: 35px;color: #707070;}

/*第四层*/
.single_service2{ margin:30px 15px;}
.single_service_left{float: left;margin-top: 20px;}
.single_service2 img{width: 70px;margin-top: -70px;}
.single_service2 .single_service_right{display: inline-block;width: 70%;padding-left:30px;overflow: hidden;}
.single_service_right h2{font-size:24px;text-transform:uppercase;color:#222222;line-height: 45px;font-weight: 300;margin: 0 0 10px;}
.single_service_right p{font-size:15px;color:#777777;line-height: 30px;height: 90px;margin-right: 30px;height:auto;}
.single_service_left .st-feature-icon {width: 102px;line-height: 102px;height: 102px;text-align: center;background-color: #46b7bf;border-radius: 50%;position: relative;-webkit-transform: rotate(0) scale(1);-ms-transform: rotate(0) scale(1);transform: rotate(0) scale(1);-webkit-transition: color 0.3s, border-color 0.3s, background-color 0.3s, -webkit-transform 0.3s;transition: color 0.3s, border-color 0.3s, background-color 0.3s, transform 0.3s;}
.single_service_left .st-feature-icon i{font-size: 42px;color: #fff;}
.single_service2:hover .st-feature-icon{border-color: #46b7bf;background-color: transparent;-webkit-transform: rotate(360deg) scale(1.8);-ms-transform: rotate(360deg) scale(1.8);transform: rotate(360deg) scale(1.8);}
.single_service2:hover .st-feature-icon i{color: #46b7bf;}


/*第五层*/
.f5{ background:url(/Template/skin1/static2020/agent/f5bg.jpg) no-repeat fixed center;position: relative;background-size: cover; padding:112px 0;}
.f5bg{ position:absolute; width:100%; height:100%;background: rgba(0, 0, 0, 0.7);left:0;top:0;}
.topNum,.bottomNum{ color:#fff; text-align:center;}
.topNum{ font-size:45px;}
.bottomNum{ font-size:18px;margin-top:25px;}
.f5 .ks-container{ z-index:1;}

/*第八层*/
.f8 .drag-functBoxleft{text-align:right;}

/*最后一层*/
.messageBox{width: 542px;margin: auto;}
.messageBox .itemBox{ margin-bottom:10px;}
.messageBox .itemBox .textBox{ width:100%; height:50px; border:0; background:#f5f5f5; padding:0 15px; box-sizing:border-box; font-size:16px;}
.areaBox{ width:100%;background:#f5f5f5;border:0; padding:15px; font-size:16px; box-sizing:border-box;height: 162px;}
.suBtn{background: #46b7bf;width: 100%;height: 60px;font-size: 18px;color: #fff;border: 0;}
.bigBanner img
{
    display:block;margin:0 auto;
   }
   
   

.channel-banner{
    position: relative;
    overflow: hidden;
    background:#2E65EF;
    
}

.channel-banner .ks-container{
    position: relative;
    height: 100%;
}
.channel-banner .ks-container::after{
    content: '';
    width: 1220px;
    background: url(/Template/skin1/static2020/agent/691597747163.png) no-repeat 0 50%;    
    background-size: auto 1100px;
    position: absolute;
    right:-340px;
    top:0;
    height: 100%;
}
.channel-banner__info{
    position: absolute;
    top:50%;
    margin-top:-210px;
    z-index: 1;
}
.channel-banner__title{
    font-size: 78px;
    color:#fff;
    font-weight: bold;
}
.channel-banner__desc{
    font-size: 36px;
    color:#fff;
    font-weight: 500;
    margin-top: 35px;
}
.channel-banner__button{
    width: 240px;
    height: 54px;
    line-height: 54px;
    padding:0px;
    font-size: 24px;
    background-color: #fff;
    color: #2E65EF;
    margin-top: 80px;
}

@media screen and (max-width: 1180px) {
	.drag-shortlist ul{ margin:0 15px;}
	.community-edition p {font-size: 14px;}
	.copy-r{ display:none;}
	.community-edition p{ margin:0;}
	.single_service_right p{ font-size:14px;}
	.community-edition{margin: 0 10px 25px;}
	.f2,.f3{ padding:90px 15px;}
	.drag-functBoxleft img{ width:80%; height:auto;}
	.titleBox .bigTitle{ font-size:30px;}
	.drag-functBoxright h2 {margin-bottom: 30px;font-size: 30px;}
	.single_service_right h2 {font-size: 20px;}
	.bottomNum {font-size: 16px;}
}
@media screen and (max-width:1024px)
{
     .channel-banner__title{
        font-size: 56px;
    }
    .channel-banner__desc{
        font-size: 26px;
        margin-top: 25px;
    }
    .channel-banner__info{
        left:60px;
        margin-top:-160px;
    }
    .channel-banner__button{
        font-size: 22px;
        width: 220px;
        height: 50px;
        line-height: 50px;
        margin-top:60px;
    }
  
    .channel-banner .ks-container::after{
        width: 100%;
        background-size: auto 125%;
        right: -320px;
    }
	.bigBanner{
		height:360px;
	}
	.floor{
		padding: 90px 0;
	}
	.bigBanner img{
		display: block;
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
	.drag-shortlist ul{ margin-left:15px;margin-right:15px;}
	.messageBox{ width:90%;}
	.copy-r{ display:none;}
	.f5 li{ margin:20px 0;}
	.drag-functBoxleft img{ width:80%; height:auto; margin:auto;}
	.drag-functBoxright{ margin:0 20px;}
	}
@media screen and (max-width:480px)
{
       .channel-banner .ks-container{
        background-position: 50% 50%;
        background-size: auto 76%;
    }

    .channel-banner .ks-container::after{
        right: 0px;
        background-size: 160% auto;
        background-position:50% 80%;
    }
    .channel-banner__info{
        top:6%;
        width: 100%;
        left:0;
        margin-top:50px;
        height: 74%;
    }
    .channel-banner__info::after{
        content: '';
        width: 30px;
        height: 30px;
        background: url(/Template/skin1/common/images/common_icon_more@2x.png) no-repeat;
        background-size: auto 100%;
        position: absolute;
        left:0;
        right: 0;
        margin: 0 auto;
        bottom: -50px;
        animation: bannermore 2s linear infinite;
    }
    @keyframes bannermore{
        0% {
           bottom: -50px;
        }
        50% {
            bottom: -65px;
        }
        100% {
            bottom: -50px;
        }
      }
    .channel-banner__title{
        font-size: 32px;
        margin-left: 35px;
    }
    .channel-banner__desc{
        margin-left: 35px;
        font-size: 18px;
        margin-top: 20px;
    }
    .channel-banner__button{
        font-size: 16px;
        width: 160px;
        height: 38px;
        line-height: 38px;
        left:0;
        right: 0;
        margin: 0 auto;
        position: absolute;
        bottom: 0;
    }
	.floor{
		padding: 70px 0;
	}
	.titleBox .bigTitle{ font-size:22px;}
	.bigBanner{height:240px;}
	
	.titleBox .infoTitle{ padding-bottom:0;}
	.drag-shortlist{ padding:20px;}
	.community-edition p {font-size: 13px;}
	.community-edition{margin: 0 15px 10px;}
	.drag-functBoxleft img{ width:80%; height:auto; margin:auto;}
	.drag-functBoxright{ margin:0 20px;}
	.titleBox{ margin-bottom:20px;}
	.f4 li{ margin-bottom:0;}
	.single_service2{ margin:10px 15px;}
	.single_service_left .st-feature-icon{width:62px;line-height:62px;height:62px;}
	.single_service_left .st-feature-icon i {font-size: 25px;}
	.single_service2 .single_service_right{ width:65%;padding-left: 20px;}
	.single_service_right h2{ margin-bottom:0;font-size:16px;}
	.single_service_right p{font-size: 13px;line-height: 26px; margin-right:0;}
	.drag-functBoxright h2 {margin-bottom: 20px;font-size:22px; text-align:center;}
	.drag-functBoxright p {font-size: 13px;line-height:26px;}
	.f5{ padding:50px 0;}
	.f5 li{ margin:20px 0;}
	.topNum{ font-size:35px;}
	.bottomNum{margin-top: 10px;font-size: 16px;}
	.messageBox{ width:90%; margin:auto;}	
	.messageBox .itemBox .textBox{ height:40px;}
	.suBtn{ height:40px;}
}
@media screen and (max-width:320px){
	.bigBanner{height:220px;}
}<!--耗时1782866655.2901秒-->