body,html{
    height: 100%;
    width: 100%;
}
.clearfix{
    display: block;
}
.clearfix:after {
    content:'';
    display:block;
    height:0;
    clear:both;
}
.home-content{
    /* width: 1200px; */
    margin: 0 auto;
}
.line{
    border-bottom: 1px solid #F2F3F5;
    width: 100%;
}
.dashed-border {
    border-bottom: 1px dashed #EAEBED;
}
.home-banner{
    width: 100%;
    height: 360px;
    position: relative;
}
.home-banner-video{
    object-fit:cover;
    object-position:center;
    position: absolute;
    bottom:0;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    height: 100%;
}
.home-banner-content{
    position: absolute;
    top: 71px;
    left: 50%;
    transform: translate(-50%,0);
}
.home-banner-content h1{
    color: #fff;
    font-size: 60px;
    font-weight: bold;
    text-align: center;
}
.banner-title-img{
    height: 68px;
    margin: 0 auto;
    display: block;
}
.home-banner-desc{
    margin-top: 27px;
    background-image: url("/Modules/images/hainan_tao/banner_back_img.png");
    background-size: 100% 100%;
    width: 624px;
    height: 64px;
    position: relative;
}
.home-banner-dawanqu-desc{
    background-image: url("/Modules/images/hainan_tao/banner_dawanqu_back_img.png");
    width: 834px;
}
.home-banner-texto{
    position: absolute;
    top: 14px;
    left: 155px;
    font-weight: bold;
    font-size: 20px;
    color: #FFFFFF;
    line-height: 36px;
    text-shadow: 0px 2px 4px #0C50C7;
}
.home-banner-textt{
    position: absolute;
    top: 14px;
    right: 124px;
    font-weight: bold;
    font-size: 20px;
    color: #FFFFFF;
    line-height: 36px;
    text-shadow: 0px 2px 4px #0C50C7;
}
.home-banner-textx{
    position: absolute;
    top: 14px;
    right: 59px;
    font-weight: bold;
    font-size: 20px;
    color: #FFFFFF;
    line-height: 36px;
    text-shadow: 0px 2px 4px #0C50C7;
}
.home-banner-dawanqu-desc .home-banner-texto{
    left: 163px;
}
.home-banner-dawanqu-desc .home-banner-textt{
    right: 315px;
}
.home-banner-dawanqu-desc .home-banner-textx{
    right: 59px;
}
.home-banner-button{
    position: relative;
    width: 380px;
    height: 50px;
    font-size: 0;
    margin: 0 auto;
    margin-top: 26px;
    text-align: center;
    cursor: pointer;
    background-image: url("/Modules/images/hainan_tao/banner_button.png");
    background-size: 100% 100%;
    box-sizing: border-box;
}
.home-banner-button:hover{
    background-image: url("/Modules/images/hainan_tao/banner_button_active.png");
}
.banner-button-text{
    display: inline-block;
    font-size: 20px;
    color: #FFFFFF;
    font-weight: bold;
    line-height: 50px;
    text-align: center;
    vertical-align: middle;
}
.banner-button-text .contact-way{
    margin-right: 16px;
}
.banner-button-icon{
    display: inline-block;
    width: 24px;
    height: 24px;
    vertical-align: middle;
    margin-left: 8px;
}

.settled-unindustry-limit{
    position: relative;
    margin: 24px 0;
    overflow: hidden;
    cursor: pointer;
}
.settled-unindustry-limit img{
    display: block;
    width: 1200px;
    height: 78px;
}
.settled-unindustry-limit div{
    position: absolute;
    top: 20px;
    right: 60px;
    width: 220px;
    height: 38px;
    color: #FFFFFF;
    font-size: 14px;
    line-height: 38px;
    font-weight: bold;
    text-align: center;
    border-radius: 8px;
    background: #FA6113;
    box-shadow: 1px 2px 6px 0px rgba(213,84,21,0.28);
}
.settled-unindustry-limit div span{
    color: #FFFFFF;
    font-size: 14px;
    line-height: 38px;
    font-weight: bold;
}

.home-content-box{
    background: #FAFAFA;
    width: 100%;
}
.home-construction{
    padding: 80px 0;
    box-sizing: border-box;
    position: relative;
    height: 604px;
}
.home-construction-title{
    margin: 0 auto;
    font-weight: bold;
    font-size: 36px;
    color: #1A1A1A;
    line-height: 48px;
    /* width: max-content; */
    max-width: 324px;
}
.home-construction-cardbox{
    margin: 0 auto;
    margin-top: 40px;
    /* 980px */
    /* width: fit-content;   */
    /* max-width: 1200px; */
    display: flex;
    justify-content: center;
}
.home-construction-cardbox-dawanqu{
    display: none;
}
.home-construction-cardbox-active{
    display: block;
}
.home-cardbox-marginri{
    margin-right: 16px;
}
.home-cardbox-item{
    width: 229px;
    height: 356px;
    background: #FFFFFF;
    border-radius: 8px;
    padding: 40px 17px 28px 16px;
    box-sizing: border-box;
    position: relative;
    transition: width 300ms;
}
.content-district{
    width: 658px;
    margin: 0 auto;
    margin-top: 40px;
    overflow: hidden;
}
.content-div{
    overflow: hidden;
    float: left;
    margin-right: 64px;
    padding-bottom: 10px;
    cursor: pointer;
}
.content-div-active.content-div div{
    font-weight: bold;
}
.content-div-active.content-div{
    border-bottom: 3px solid #1f6cDD;
}
.content-div img{
    width: 28px;
    display: block;
    float: left;
}
.content-div div{
    float: left;
    font-size: 20px;
    color: #303030;
    margin-top: 4px;
    margin-left: 8px;

}
.content-div div:hover{
    font-weight: bold;
}
.content-div-last{
    margin-right: 0;
}




.cardbox-item-title{
    width: 100%;
    font-weight: 600;
    font-size: 20px;
    color: #303030;
    line-height: 28px;
}
.line-margin{
    position: absolute;
    top: 108px;
    width: 196px;
}
.cardbox-item-content{
    height: 110px;
    width: 196px;
    position: absolute;
    top: 128px;
    font-weight: 400;
    font-size: 14px;
    color: #5C5C5C;
    line-height: 22px;
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
.cardbox-item-bottom{
    width: calc(100% - 40px);
    position: absolute;
    bottom: 30px;
    left: 16px;
}
.item-bottom-mouth{
    font-size: 12px;
    color: #5C5C5C;
    line-height: 20px;
}
.item-bottom-date{
    font-weight: bold;
    font-size: 18px;
    color: #303030;
    line-height: 30px;
}
.item-bottom-icon{
    position: absolute;
    right: 0;
    bottom: 0;
    width: 28px;
    height: 28px;
    cursor: pointer;
}
/* 动态 */
.home-cardbox-item.active{
    background-size: 100% 100%;
    width: 465px;
}
.home-cardbox-construction.active{
    background-image: url("/Modules/images/hainan_tao/construction_card.png");
}
.home-cardbox-trade.active{
    background-image: url("/Modules/images/hainan_tao/trade_port_right.png");
}
.home-cardbox-industry.active{
    background-image: url("/Modules/images/hainan_tao/modern_industry_right.png");
}
.home-cardbox-village.active{
    background-image: url("/Modules/images/hainan_tao/guanyun_village_right.png");
}

.home-cardbox-item.active .cardbox-item-title{
    color: #FFFFFF;
}
.home-cardbox-item.active .line-margin,.home-cardbox-item.active .cardbox-item-content{
    width: 417px;
}
.home-cardbox-item.active .cardbox-item-content,.home-cardbox-item.active .item-bottom-date,.home-cardbox-item.active .item-bottom-mouth{
    color: #FFFFFF;
}
.home-cardbox-item.active .item-bottom-icon{
    display: none;
}
.home-cardbox-item.active .aggravation{
    color: #FA9600;
}
.home-cardbox-item.active .cardbox-item-content{
    overflow: unset;
    text-overflow: none;
    -webkit-line-clamp:unset;
}
.home-invest{
    background-image: url("/Modules/images/hainan_tao/invest_img.png");
    background-size: 100% 100%;
    width: 100%;
    height: 656px;
}
.home-dawanqu-invest{
    background-image: url("/Modules/images/hainan_tao/invest_dawanqu_img.png");
}
.home-xibu-invest{
    background-image: url("/Modules/images/hainan_tao/invest_xibu_img.png");
}
.home-invest-box{
    padding-top: 80px;
    padding-bottom: 40px;
    box-sizing: border-box;
    width: 1250px;
}
.home-invest-left{
    position: relative;
    width: 728px;
    float: left;
}
.invest-left-item{
    position: relative;
    box-sizing: border-box;
    width: 335px;
    height: 126px;
    float: left;
}
.invest-item-title{
    font-weight: bold;
    font-size: 20px;
    color: #303030;
    line-height: 28px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.invest-item-title:hover{
    color: #1F6CDD;
}
.invest-item-bottom{
    position: absolute;
    bottom: 25px;
    width: 100%;
}
.invest-bottom-area{
    font-size: 16px;
    color: #5C5C5C;
    line-height: 24px;
    margin-top: 14px;
    float: left;
}
.home-invest-content{
    margin-top: 60px;
}
.invest-bottom-price{
    float: right;
}
.invest-bottom-price .invest-price-num{
    font-weight: bold;
    font-size: 32px;
    color: #1F6CDD;
    line-height: 44px;
    float: left;
}
.invest-price-unit{
    margin-top: 14px;
    margin-left: 5px;
    line-height: 24px;
    font-size: 16px;
    color: #5C5C5C;
    float: left;
}
.invest-left-marri{
    margin-right: 58px;
}
.invest-left-martop{
    margin-top: 24px;
}
.home-invest-right{
    margin-left: 66px;
    float: left;
}
.invest-right-img{
    width: 456px;
    height: 394px;
}
.invest-right-xibu-img{
    height: 350px;
}
/* 服务内容 */
.service-content-box{
    padding: 55px 0 80px 0;
    width: 1200px;
}
.home-construction-titlecu{
    font-weight: bold;
    font-size: 36px;
    color: #1A1A1A;
    line-height: 48px;
    width: 144px;
    margin: 0 auto;
}
.service-content-boxst{
    margin-top: 40px;
}
.service-content-left{
    padding: 24px 0;
    background: linear-gradient( 90deg, #F4F9FF 0%, #ECF3FF 100%);
    border-radius: 8px;
    width: 592px;
    float: left;
}
.service-left-titlebox{
    padding:0 24px;
}
.service-left-titlebox::before{
    content: "";
}
.service-left-title{
    font-weight: bold;
    font-size: 20px;
    color: #303030;
    line-height: 28px;
    margin-right: 16px;
    float: left;
}
.service-left-sign{
    background: #FFFFFF;
    border-radius: 100px;
    padding: 2px 10px;
    font-size: 12px;
    color: #1F6CDD;
    line-height: 20px;
    float: left;
    margin-top: 2px;
}
.service-left-signmarg{
    margin-left: 8px;
}
.service-content-text{
    margin-top: 8px;
    padding: 0 24px;
    font-size: 14px;
    color: #5C5C5C;
    line-height: 22px;
}
.service-button-left{
    padding: 5px 16px;
    font-size: 14px;
    color: #FFFFFF;
    line-height: 22px;
    background: linear-gradient( 200deg, #148FEE 0%, #1F6CDD 100%);
    border-radius: 4px;
    width: 118px;
    box-sizing: border-box;
    float: left;
    cursor: pointer;
}
.service-button-right{
    margin-left: 12px;
    padding: 5px 16px;
    font-size: 14px;
    color: #1F6CDD;
    line-height: 22px;
    width: 118px;
    box-sizing: border-box;
    float: left;
    border-radius: 4px;
    border: 1px solid #1F6CDD;
    cursor: pointer;
}
.service-button-right:hover{
    opacity: 0.8;
}
.service-content-narle{
    margin-left: 16px;
}