body{

    font-family: "Source Han Sans SC", "HanHei SC", "PingFang SC", "Helvetica Neue", Helvetica, "Hiragino Sans GB", "Microsoft YaHei", 微软雅黑, Arial, sans-serif;

    font-size: 12px;

    color: rgb(67, 67, 67);

    margin: 0px;

    min-width: 1230px;

    padding: 0px;

}

* {

    box-sizing: border-box;

}

.hidden {

    display: none;

}

a {

    -webkit-user-select: none;

    -moz-user-select: none;

    -ms-user-select: none;

    user-select: none;

    text-decoration: none;

    color: #555;

}



#ohomeHeader .nav-container {

    width: 1144px;

    margin: 0 auto;

    position: relative

}



#ohomeHeader .nav-box1 {

    background-color: #eee;

    height: 30px;

    line-height: 30px

}



#ohomeHeader .nav-box1 .iconfont {

    font-size: 16px

}



#ohomeHeader .nav-box1 .left {

    position: absolute;

    left: 0

}



#ohomeHeader .nav-box1 .right {

    position: absolute;

    right: 0

}



#ohomeHeader .nav-box1 .nav-item {

    letter-spacing: 1px;

    display: inline-block;

}



#ohomeHeader .nav-box1 .nav-item:after {

    content: "|";

    margin: 0 10px

}



#ohomeHeader .nav-box1 .nav-item:last-child:after {

    display: none

}



#ohomeHeader .nav-box1 .nav-item i {

    letter-spacing: 0

}



#ohomeHeader .nav-box1 .hover {

    position: relative

}



#ohomeHeader .nav-box1 .hover .nav-hover-panel {

    opacity: 0;

    height: 0;

    overflow: hidden;

    position: absolute;

    left: -50%;

    margin-top: 10px;

    box-shadow: 1px 1px 5px #999;

    background-color: #fff;

    width: 130px;

    z-index: 3;

    transition: all .3s ease

}



#ohomeHeader .nav-box1 .hover:hover .nav-hover-panel {

    opacity: 1;

    height: 130px

}



#ohomeHeader .nav-box2 {

    height: 65px

}



#ohomeHeader .nav-box2 .nav-container {

    padding: 15px 0

}



#ohomeHeader .nav-box2 .navbar {

    height: 65px;

    line-height: 70px;

    position: absolute;

    top: 0;

    right: 0

}



#ohomeHeader .nav-box2 .nav-box2-item {

    position: relative;

    float: left;

    font-size: 16px;

    margin-left: 38px

}



#ohomeHeader .nav-box2 .nav-box2-item.active {

    color: #ee7800

}



#ohomeHeader .nav-box2 .second-navbar {

    overflow: hidden;

    transition: all .3s ease-in-out;

    opacity: 0;

    visibility: hidden;

    position: absolute;

    text-align: center;

    width: 120px;

    left: 50%;

    margin-left: -60px;

    line-height: 1.8;

    font-size: 14px;

    z-index: 5;

    margin-top: 5px;

    border-top: 4px solid #ee7800;

    background-color: rgba(0,0,0,.6)

}



#ohomeHeader .nav-box2 .second-navbar a {

    color: #fff

}



#ohomeHeader .nav-box2 .second-navbar.active {

    visibility: visible;

    opacity: 1

}







/* banner */



.swiper-container {

    max-height: 650px;

    width: 100%;

}



@media screen and (max-width: 1500px) {

    .swiper-container {

        height: 420px

    }

}



.index-banner .swiper-wrapper img {

    border: 0;

    -ms-interpolation-mode:bicubic;

    vertical-align:middle;

    max-width: 100%;

}







/* sec-2 */

.sec1-banner .swiper-button-next, .sec3-slider .swiper-button-next, .sec6-slider .swiper-button-next, .sec1-banner .swiper-button-prev, .sec3-slider .swiper-button-prev, .sec6-slider .swiper-button-prev, .sec2-icon.icon1, .sec2-icon.icon2, .sec2-icon.icon3, .sec7-slider .slider-prev, .sec7-slider .slider-next, .sec8-content .left .icon-player, .sec9-content .sec9-icon .icon1, .sec9-content .sec9-icon .icon2, .sec9-content .sec9-icon .icon3, .sec9-content .sec9-icon .icon4, .sec9-content .sec9-icon .icon5, .sec9-content .sec9-icon .icon6, .sec9-content .sec9-icon .icon7, .sec10-brand .swiper-button-next, .sec10-brand .swiper-button-prev {

    background-image: url(http://static.o-home.com/v3/views/web/index/index/index_z_78b1354.png);

}

.sec2-icon.icon1 {

    background-position: 0px -116px

}



.sec2-icon.icon2 {

    background-position: 0px -197px

}



.sec2-icon.icon3 {

    background-position: 0px -278px

}



.sec2 {

    background-color: #f5f5f5;

    padding: 25px 0

}



.sec2-header {

    padding-top: 12px;

    font-weight: 500;

    position: relative;

    letter-spacing: 1px;

    font-size: 26px;

    height: 70px

}



.sec2-header:after {

    content: "";

    position: absolute;

    left: 0;

    margin-top: 7px;

    height: 2px;

    width: 52px;

    background-color: #333;

    display: block

}



.sec2-col {

    float: left;

    position: relative;

    overflow: hidden;

    padding-left: 44px;

}



.sec2-col:nth-child(1) {

    width: 24%;

    padding-left: 0px;

}



.sec2-col:nth-child(1):after {

    display: none;

}



.sec2-col:nth-child(2) {

    width: 20%

}



.sec2-col:nth-child(3) {

    width: 20%

}



.sec2-col:nth-child(4) {

    width: 20%;

}



.sec2-col:nth-child(5):after {

    display: none

}



.sec2-col:after {

    content: "";

    position: absolute;

    top: 0;

    right: 0;

    margin-top: 7px;

    height: 68px;

    width: 2px;

    background-color: #d8d8d8;

    display: block

}



.sec2-col .header-b {

    display: inline-block;

    font-size: 30px;

    color: #ee7800;

    vertical-align: middle;

    padding-top: 20px

}



.sec2-col .phase {

    display: inline-block;

    font-size: 30px;

    vertical-align: middle;

    padding-top: 20px

}





.sec2-icon {

    width: 78px;

    height: 78px;

    float: left;

    margin-right: 20px;

    transform: scale(0)

}



.sec2-icon.icon1 {

    background-repeat: no-repeat;

}



.sec2-icon.icon2 {

    background-repeat: no-repeat;

}



.sec2-icon.icon3 {

    background-repeat: no-repeat;

}



.start .sec2-icon {

    transform: scale(1);

    animation-name: sec2IconShow;

    animation-timing-function: ease-in-out

}



.start .sec2-icon.icon1 {

    animation-duration: .3s

}



.start .sec2-icon.icon2 {

    animation-duration: .5s

}



.start .sec2-icon.icon3 {

    animation-duration: .7s

}



@keyframes sec2IconShow {

    from {

        transform: scale(0)

    }



    to {

        transform: scale(1)

    }

}





/* sec3 */



.sec3 {

    padding-top: 90px

}



.sec3-slider-ctrl {

    width: 750px;

    margin: 0 auto;

    margin-top: 30px;

    border: 1px solid #d8d8d8;

    border-bottom: 0;

    border-left: 0;

    line-height: 40px

}



.sec3-slider-ctrl li {

    overflow: hidden;

    text-align: center;

    display: table-cell;

    width: 1%;

    border-left: 1px solid #d8d8d8;

    border-bottom: 1px solid #d8d8d8;

    height: 40px;

    position: relative

}



.sec3-slider-ctrl li a {

    font-size: 14px;

    display: block;

    width: 100%;

    height: 100%

}



.sec3-slider-ctrl li:after {

    content: "";

    width: 100%;

    position: absolute;

    height: 2px;

    background-color: #ee7800;

    left: 0;

    bottom: 0;

    transform: scale(0);

    transition: height,transform .3s ease-in-out

}



.sec3-slider-ctrl li:hover:after {

    transform: scale(1)

}



.sec3-slider-ctrl li.active {

    border-bottom: 1px solid #ee7800

}



.sec3-slider-ctrl li.active a {

    color: #ee7800

}



.sec3-slider-ctrl li.active:after {

    transform: scale(1)

}



.sec3-slider {

    margin-top: 40px;

    height: 450px;

    overflow: hidden;

    position: relative

}



.sec3-slider .swiper-lazy-preloader {

    height: 450px

}



.sec3-slider .swiper-button-next {

    right: 120px;

    background-repeat: no-repeat;

}



.sec3-slider .swiper-button-prev {

    left: 120px;

    background-repeat: no-repeat;

}



.sec3-slider .swiper-button {

    height: 55px;

    background-size: auto;

    background-position: inherit;

    opacity: 0;

    transition: opacity .3s ease-in-out

}



.sec3-slider .swiper-button-disabled.swiper-button {

    opacity: 0

}



.sec3-slider:hover .swiper-button {

    opacity: 1

}



.sec3-slider:hover .swiper-button-disabled {

    opacity: .35

}



.sec3-slider-panel {

    position: absolute;

    left: 860px;

    top: 300px;

    color: #fff;

    transition: all .3s ease-in-out

}



.sec3-slider-panel .btn {

    transition: all .3s ease-in-out;

    width: 260px;

    height: 46px;

    line-height: 46px;

    padding: 0;

    display: block;

    border: 1px solid #fff;

    font-size: 16px;

    margin-bottom: 15px;

    margin-top: 5px

}



.sec3-slider-panel .btn span {

    display: block;

    color: #fff;

    animation: btnJab .3s ease-in-out infinite;

    animation-direction: alternate

}



@media (max-width:1400px) {

    .sec3-slider {

        height: 405px

    }



    .sec3-slider .swiper-lazy-preloader {

        height: 405px

    }



    .sec3-slider-panel {

        left: 780px;

        top: 270px

    }



    .sec3-slider-panel .btn {

        width: 230px;

        height: 40px;

        line-height: 46px

    }

}



.sec3-cards {

    padding: 18px 0;

    margin: 0 -5px

}



.sec3-cards .sec3-cards-wrapper {

    width: 75%;

    float: left

}



.sec3-cards .card {

    -webkit-user-select: none;

    -moz-user-select: none;

    -ms-user-select: none;

    user-select: none;

    float: left;

    width: 33.333%;

    height: 124px;

    padding-right: 5px;

    padding-left: 5px;

    overflow: hidden

}



.sec3-cards .card .card-content {

    border: 1px solid #d8d8d8

}



.sec3-cards .card:hover .card-content {

    box-shadow: 0 0 5px #999

}



.sec3-cards .swiper-card {

    padding-right: 5px;

    padding-left: 5px;

    -webkit-user-select: none;

    -moz-user-select: none;

    -ms-user-select: none;

    user-select: none;

    padding-bottom: 5px

}



.sec3-cards .swiper-card .card-content {

    border: 1px solid #d8d8d8

}



.sec3-cards .swiper-card:hover .card-content {

    box-shadow: 0 0 8px rgba(0,0,0,.2)

}



.sec3-cards .top {

    padding: 10px 10px 0

}



.sec3-cards .top .wrapper {

    padding-bottom: 10px;

    display: -ms-flexbox;

    display: flex;

    -ms-flex-align: center;

    align-items: center;

    border-bottom: 1px solid #d8d8d8

}



.sec3-cards .avatar {

    width: 54px;

    height: 54px;

    border-radius: 50%;

    margin-right: 15px

}



.sec3-cards .info h6 {

    font-size: 16px

}



.sec3-cards .info span {

    font-size: 14px;

    color: gray;

    margin-right: 10px

}



.sec3-cards .bottom p {

    white-space: nowrap;

    height: 20px;

    overflow: hidden;

    text-overflow: ellipsis

}



.sec3-cards .sec3-card-post {

    width: 25%;

    float: left

}



.sec3-card-post {

    padding-left: 5px

}



.sec3-card-post h3 {

    font-weight: 500;

    font-size: 18px;

    margin-bottom: 4px

}



.sec3-card-post .btn {

    width: 100%;

    border-radius: 0;

    margin-top: 10px

}



.sec3-card-post .btn-orange {

    color: #fff;

    background-color: #ee7800

}



.sec3-card-post .btn-grey {

    background-color: #d8d8d8

}



.sec3-modal-input {

    margin-top: 20px;

    font-size: 16px;

    width: 100%;

    padding: 15px

}

.sec-header {

    text-align: center;

}

.sec-header header {

    position: relative;

    display: inline-block;

}

.sec-header header:before {

    content: "";

    width: 120px;

    height: 2px;

    background-color: #d8d8d8;

    display: block;

    position: absolute;

    top: 50%;

    left: -180px;

    margin-top: 0px;

}

.start .sec-header h1 {

    opacity: 1;

    animation: secHeaderShow .3s ease-in-out;

    margin-bottom: 0px;

    margin-top: 0px;

}

.sec-header h1 {

    font-size: 38px;

    font-weight: 400;

}

.sec-header header:after {

    content: "";

    width: 120px;

    height: 2px;

    background-color: #d8d8d8;

    display: block;

    position: absolute;

    top: 50%;

    right: -180px;

    margin-top: 8px;

}

.start .sec-header h2 {

    opacity: 1;

    margin-bottom: 40px;

    padding: 0px;

    animation: secHeaderShow .5s ease-in-out;

}

.sec-header h2 {

    font-weight: 500;

    font-size: 17px;

    letter-spacing: 1.5px;

    margin-top: 18px;

}



.sec3 {

    padding-bottom: 70px

}



.sec3 li {

    float: left;

    width: 286px;

    transition: all ease .3s 0s;

    -moz-transition: all ease .3s 0s;

    -webkit-transition: all ease .3s 0s;

    list-style: none;

}



.sec3 li.active {

    width: 415px

}



.sec3 li .lazy {

    display: block;

    width: 100%;

    height: 463px

}



.sec3 li:hover {

    transform: scale(1.05);

    -moz-transform: scale(1.05);

    -webkit-transform: scale(1.05);

    -ms-transform: scale(1.05);

    z-index: 1;

    box-shadow: 0 5px 20px #ccc

}



.sec3 li:hover .con {

    background: #fff;

    border-bottom: solid 3px #e74c3c;

    left: -1px;

    bottom: -1px;

    right: -1px

}



.sec3 li:hover .con::before {

    content: '';

    width: 0px;

    height: 0;

    overflow: hidden;

    border-width: 0 15px 15px;

    border-style: solid;

    border-color: transparent transparent #fff;

    position: absolute;

    left: 50%;

    top: -14px;

    margin-left: -15px;

    background: none

}



.sec3 li:hover .con .tit,.sec3 li:hover .con .subTit {

    color: #333

}



.sec3 li:hover .con .des {

    color: #666

}



.sec3 li:hover .con .button-primary.is-plain {

    background: #e74c3c;

    color: #fff

}



.sec3 li:hover .con .button-primary.is-plain:hover {

    background: #d62c1a

}



.sec3 .con {

    position: absolute;

    left: 0;

    right: 0;

    bottom: 0;

    padding: 30px 30px 37px;

    color: #fff;

    z-index: 1

}



.sec3 .con:before {

    content: '';

    width: 16px;

    height: 9px;

    background: #e74c3c;

    display: block;

    margin-bottom: 10px

}



.sec3 .con .tit {

    font-size: 30px

}



.sec3 .con .subTit {

    margin-top: 5px;

    font-size: 18px

}



.sec3 .con .des {

    min-height: 38px;

    font-size: 14px;

    margin-top: 10px;

    color: #b9b9b9

}



.sec3 .con .is-plain {

    background: none;

    padding: 8px 40px;

    margin-top: 15px

}



.sec3 .con .is-plain:hover {

    background: #e74c3c

}



.sec3 .shadow {

    width: 100%;

    height: 100%;

    left: 0;

    top: 0;

    position: absolute;

    background: linear-gradient(transparent, rgba(0,0,0,0.7))

}



.sec3 .bom .iconfont {

    color: #898989

}



.sec3 .bom dl {

    padding: 40px 10px 0;

    width: 300px;

    float: left;

    box-sizing: border-box;

    position: relative

}



.sec3 .bom dl.active dt {

    background: #e74c3c;

    border: 0

}



.sec3 .bom dl.active dt i {

    color: #fff

}



.sec3 .bom dl:hover dt {

    transition: .5s all;

    background: #e74c3c;

    border: 0

}



.sec3 .bom dl:hover dt i {

    color: #fff

}



.sec3 .bom dt {

    width: 70px;

    height: 70px;

    box-sizing: border-box;

    border-radius: 50%;

    border: 2px solid #f0f0f0;

    text-align: center;

    line-height: 70px;

    margin: auto

}

.mr5 {

    margin-right: 5px !important;

}

.pr {

    position: relative;

}





/* sec6 */

.sec6{

    padding-bottom: 70px;

}



.desinger_content{

    margin-right: -24px;

}



.desinger_content, .home .sampleCases_box {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -ms-flex-wrap: wrap;

    flex-wrap: wrap;

}

.designer_card {

    width: 282px;

    position: relative;

    margin-bottom: 24px;

    margin-right: 24px;

    cursor: pointer;

    transition: all .2s;

    overflow: hidden;

}

.designer_card .tag {

    position: absolute;

    top: 0;

    right: 0;

    font-size: 10px;

    color: #fff;

    background: #ff9000;

    height: 20px;

    width: 40px;

    text-align: center;

    line-height: 20px;

}

.designer_card .top{

    height: 290px;

    width: 282px;

    overflow: hidden;

    background: #f9f9f9;

}

.designer_card .top img{

    width: 100%;

    transform: scale(1);

    transition: all 0.8s ease-in-out;

}

.designer_card .bottom {

    background: #f9f9f9;

    width: 100%;

    height: 75px;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-orient: vertical;

    -webkit-box-direction: normal;

    -ms-flex-direction: column;

    flex-direction: column;

    -webkit-box-align: center;

    -ms-flex-align: center;

    align-items: center;

    padding: 14px 0;

    box-sizing: border-box;

    -webkit-box-pack: justify;

    -ms-flex-pack: justify;

    justify-content: space-between;

    color: #d5d5d5;

}

.designer_card .bottom .title{

    font-size: 14px;

    color: #333;

}

.designer_card .bottom .content .reservationNumber span{

    color: #ff9000;

}

.designer_card:hover {

    box-shadow: 0 2px 8px 2px hsla(0,0%,87%,.8);

}

.designer_card:hover img{

    transform: scale(1.1);



}



.designer_card .fadetext {

    position: absolute;

    left: 0;

    top: 0;

    width: 100%;

    height: 100%;

    background-color: rgba(0, 0, 0, .5);

    box-sizing: border-box;

    text-align: center;

    color: #fff;

    transform: translateY(15rem);

    transition: all 0.8s;

    padding-top: 10px;

    font-size: 0.7rem;

}

.designer_card .fadetext .fadetit {

    font-size: 1.1rem;

    font-weight: 700;

    /* line-height: 1.5em; */

    margin-top: 1rem;

    transform: translateY(-1rem);

    transition: all 0.8s;

}

.designer_card .fadetext p {

    width: 1.5rem;

    height: 2px;

    background-color: #e45857;

    margin: 10px auto;

}



.designer_card .fadetext .p2 {

    width: 80%;

    line-height: 1.5;

    background: none;

    width: 100%;

    padding: 0px 5%;;

}

.designer_card:hover .fadetext{

    transform: translateY(0);

}

.sec6 .container{

    padding: 0px 60px;

}



/** sec7 **/

.sec7{

    padding-bottom: 70px;

}





/* 官网服务流程 */

.sec8 {

    margin-bottom: 70px;

}



.index-reservation-content{width: 100%; height: 72px; display: flex; display: -webkit-flex; display: -ms-flex; -webkit-justify-content:space-between; justify-content:space-between;}

.index-reservation-content li{width: 160px; height: 70px; border: 1px solid #e5e5e5; padding: 15px 20px; display: flex; display: -webkit-flex; display: -ms-flex; -webkit-justify-content:space-between; justify-content:space-between; -webkit-align-content:center; align-content:center; -webkit-align-items:center; align-items:center; transition: all .5s; -moz-transition: all .5s; -webkit-transition: all .5s; -o-transition: all .5s; cursor: pointer;}

.index-reservation-content li i{background: url(/App/Tpl/Home/Default/Public/new_index/images/icon.png); }

.index-reservation-content li h5{width: 60px; color: #8a8a8a; transition: all .5s; -moz-transition: all .5s; -webkit-transition: all .5s; -o-transition: all .5s;font-size: 14px;}

.index-reservation-content a:nth-child(1) li i{width: 36px; height: 34px; background-position: 0 -383px;}

.index-reservation-content a:nth-child(2) li i{width: 34px; height: 34px; background-position: 0 -856px;}

.index-reservation-content a:nth-child(3) li i{width: 28px; height: 33px; background-position: 0 -621px;}

.index-reservation-content a:nth-child(4) li i{width: 35px; height: 33px; background-position: 0 -699px;}

.index-reservation-content a:nth-child(5) li i{width: 30px; height: 33px; background-position: 0 -777px;}

.index-reservation-content a:nth-child(6) li i{width: 34px; height: 34px; background-position: 0 -541px;}

.index-reservation-content a:nth-child(7) li i{width: 32px; height: 35px; background-position: 0 -460px;}

.index-reservation-content .active{ border-color: #E93137; box-shadow: 0 0 20px #E93129;}

.index-reservation-content a:nth-child(1) .active i{background-position: 0 -422px;}

.index-reservation-content a:nth-child(2) .active i{background-position: 0 -895px;}

.index-reservation-content a:nth-child(3) .active i{background-position: 0 -659px;}

.index-reservation-content a:nth-child(4) .active i{background-position: 0 -738px;}

.index-reservation-content a:nth-child(5) .active i{background-position: 0 -816px;}

.index-reservation-content a:nth-child(6) .active i{background-position: 0 -581px;}

.index-reservation-content a:nth-child(7) .active i{background-position: 0 -500px;}

.index-reservation-content .active h5{color: #E93137;}







    .reason {

        width: 1180px;

        margin: 0 auto;

        margin-bottom:0px

    }

    .reason p {

        margin: 0;

        padding: 0;

        outline: 0;

        border: 0;

        font: inherit;

        background: 0 0;

        -webkit-tap-highlight-color: transparent;

    }

    

    .reason .title {

        width: 1180px;

        height: 24px

    }

    

    .reason .title p {

        font-size: 24px;

        color: #1b1d1d;

        line-height: 24px;

        font-weight: 600

    }

    

    .reason .reason-list {

        width: 1180px;

        display: -webkit-box;

        display: -webkit-flex;

        display: -ms-flexbox;

        display: flex;

        -webkit-box-orient: horizontal;

        -webkit-box-direction: normal;

        -webkit-flex-direction: row;

        -ms-flex-direction: row;

        flex-direction: row;

        -webkit-box-pack: justify;

        -webkit-justify-content: space-between;

        -ms-flex-pack: justify;

        justify-content: space-between;

        -webkit-box-align: center;

        -webkit-align-items: center;

        -ms-flex-align: center;

        align-items: center;

        margin-top: 20px

    }

    

    .reason .reason-list .reson-item {

        width: 283px;

        height: 292px;

        background: #fff;

        display: -webkit-box;

        display: -webkit-flex;

        display: -ms-flexbox;

        display: flex;

        -webkit-box-orient: vertical;

        -webkit-box-direction: normal;

        -webkit-flex-direction: column;

        -ms-flex-direction: column;

        flex-direction: column;

        -webkit-box-pack: start;

        -webkit-justify-content: flex-start;

        -ms-flex-pack: start;

        justify-content: flex-start;

        -webkit-box-align: center;

        -webkit-align-items: center;

        -ms-flex-align: center;

        align-items: center

    }

    

    .reason .reason-list .reson-item .t1,.reason .reason-list .reson-item .t2 {

        font-size: 16px;

        color: #444;

        line-height: 16px;

        font-weight: 500

    }

    

    .reason .reason-list .reson-item .title-active {

        width: 24px;

        height: 4px;

        background: #E93137

    }

    

    .reason .reason-list .reson-item .p1,.reason .reason-list .reson-item .p2,.reason .reason-list .reson-item .p3,.reason .reason-list .reson-item .p4 {

        font-size: 16px;

        color: #999;

        line-height: 22px

    }

    

    .reason .reason-list .reson-item .t1 {

        margin-top: 20px

    }

    

    .reason .reason-list .reson-item .title-active {

        margin-top: 11px

    }

    

    .reason .reason-list .reson-item .p1,.reason .reason-list .reson-item .p3 {

        margin-top: 11px

    }

    

    .reason .reason-list .reson-item .t2 {

        margin-top: 40px

    }

    /*热门家装攻略*/

    .index-strategy-info h4 {

        font-size: 16px;

        margin: 0;

        padding: 0;

        -webkit-tap-highlight-color: rgba(0,0,0,0);

        text-align: left;

    }

    .index-strategy-info h5{

        text-align: left;

        margin: 0;

        padding: 0;

    }

    .index-strategy-info p{

        text-align: left;

        margin: 0;

        padding: 0;

    }

    .strategy-type a{

        font-size: 14px;

    }

    .index-strategy-container{width: 100%; height: 980px; background: #fff;}

    .index-strategy-scroll{width: 1250px; height: 391px; margin: 0 auto;position: relative;overflow: hidden;}

    .container .strategy-type{width: 600px; height: 40px; display: flex; display: -webkit-flex; display: -ms-flex; -webkit-justify-content:space-between; justify-content:space-between; margin: 0 auto 35px;}

    .container .strategy-type a{width: 160px; height: 100%; display: block; border: 1px solid #e5e5e5; border-radius: 5px; text-align: center; line-height: 40px; transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s; -o-transition: all .3s;}

    .container .strategy-type a.active{background: #E93137; color: #fff; border-color: #E93137; cursor: pointer;}

    .index-strategy-content{width: 100%; height: auto; padding-bottom: 10px; border-bottom: 1px solid #f7f7f7; display: flex; display: -webkit-flex; display: -ms-flex; -webkit-justify-content:space-between; justify-content:space-between; -webkit-flex-wrap:wrap;

        flex-wrap:wrap;transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s; -o-transition: all .3s;position: absolute;}

    .none{display: none}

    .index-strategy-content ul{width: 600px; height: 380px; display: flex; display: -webkit-flex; display: -ms-flex; -webkit-justify-content:space-between; justify-content:space-between; -webkit-flex-wrap:wrap; flex-wrap:wrap;}

    .index-strategy-content ul li{width: 100%; height: auto; position: relative; overflow: hidden; display: flex; display: -webkit-flex; display: -ms-flex; transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s; -o-transition: all .3s;}

    .index-strategy-imageDiv{width: 220px; height: 110px; background-size: cover; background-position: center center; }

    .index-strategy-info{width: 360px; height: 110px; margin-left: 20px; padding-right: 20px;}

    .index-strategy-info h4{font-weight: bold; overflow: hidden; text-overflow:ellipsis; white-space: nowrap; color: #5f5f5f; line-height: 30px; transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s; -o-transition: all .3s;}

    .index-strategy-info h5,.index-strategy-info p{color: #9d9d9d; font-size: 14px;}

    .index-strategy-info h5{overflow: hidden; text-overflow:ellipsis; white-space: nowrap; margin: 8px 0 11px; }

    .index-strategy-info p{line-height: 22px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;}

    .index-strategy-left li:hover .index-strategy-info h4{color: #E93137;}

    .index-strategy-left li:hover{box-shadow: 0 0 20px #efefef;}

    .index-strategy-right li{border-bottom: 1px solid #f1f1f1; height: 50px; line-height: 50px; width: 600px !important;font-size: 16px;}

    .index-strategy-right li h4{display: flex; display: -webkit-flex; display: -ms-flex; -webkit-align-items:center; align-items:center; margin: 0px;}

    .index-strategy-right li h4 strong{margin: 0 25px;}

    .index-strategy-right li h4 p{margin:0px;padding:0px;margin-right: 44px; width: 310px; overflow: hidden; text-overflow:ellipsis; white-space: nowrap;text-align: left;}

    .index-strategy-right li h4 i{background-image: url(/App/Tpl/Home/Default/Public/new_index/images/icon.png); background-position: 0 -1804px; width: 24px; height: 14px; margin-left: 20px; transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s; -o-transition: all .3s;}

    .index-strategy-right li:hover{background: #E93137; }

    .index-strategy-right li:hover h4{color: #fff;}

    .index-strategy-right li:hover h4 i{background-position: -38px -1804px;}





    .buttons{

        width: 100px;

    }

    .solutit img{

        width: 100%;

        transform: scale(1);

        transition: all 0.8s ease-in-out;

    }

    .solutit img:hover{

        transform: scale(1.1);

    }

    .solutions li{

        width: 320px;

        overflow: hidden;

    }

    .solutions li:nth-child(3n) {

        margin-right: 0px;

    }

    .index-swiper-banner div:first-child {

        width: 70px;

        background: #000 url(/App/Tpl/Home/Default/Public/new_index/images/icon.png) no-repeat;

        background-position: 15px -953px;

        position: absolute;

        top: 0;

        left: 0;

        z-index: 2;

    }

    .swiper-button-next, .swiper-button-prev {

        position: absolute;

        top: 50%;

        width: 27px;

        height: 44px;

        margin-top: -22px;

        z-index: 10;

        cursor: pointer;

        -moz-background-size: 27px 44px;

        -webkit-background-size: 27px 44px;

        background-size: 27px 44px;

        background-position: center;

        background-repeat: no-repeat;

    }

    .index-swiper-banner {

        width: 70px;

        height: 80px;

        overflow: hidden;

        z-index: 2;

        background: none;

    }

    .index-banner .swiper-button-next {

        right: 0;

        transform: rotate(180deg);

        -ms-transform: rotate(180deg);

        -moz-transform: rotate(180deg);

        -webkit-transform: rotate(180deg);

        -o-transform: rotate(180deg);

    }

    .index-banner .swiper-button-prev {

        left: 0;

    }

    .index-swiper-banner div {

        width: 235px;

        height: 80px;

        float: left;

    }

    .index-swiper-banner .btn-hover {

        background: #fff url(/App/Tpl/Home/Default/Public/new_index/images/icon.png) !important;

        background-position: 50px -953px !important;

    }

    .index-swiper-banner, .index-swiper-banner>* {

        transition: all .5s;

        -moz-transition: all .5s;

        -webkit-transition: all .5s;

        -o-transition: all .5s;

    }

    .index-banner{

        position: relative;

    }



    .index-banner .swiper-pagination-bullet{width: 30px; height: 4px; background: #fff; border-radius: 0;}

    .index-banner .banner-info{position: absolute; bottom: 50px; left: calc(50% - 390px); background: rgba(0,0,0,.4); z-index: 3; padding: 10px 20px 15px;}

    .index-banner .banner-info h5{color: #fff; margin-bottom: 5px;}

    .index-banner .banner-info input{height: 40px; border: none; margin-right: 20px; width: 180px;}

    .index-banner .banner-info input:last-child{margin-right: 0;}

    .index-banner .banner-info .info{text-indent: 10px;}

    .index-banner .banner-info .info:nth-child(2){width: 340px;}

    .index-banner .banner-info input[type='button']{background: #E93137; color: #fff; vertical-align: bottom; cursor: pointer;}







    .container .navigation2 ul a{

        box-sizing: unset;

    }

    .solutions ul{

        padding-left: 50px;

    }



    .sec5  .mian .hd {

        padding: 30px 0;

        text-align: center;

    }



        .sec5  .mian .hd ul {

            display: inline-block;

        }



            .sec5  .mian .hd ul li {

                float: left;

                margin: 0 15px;

                padding: 0 20px;

                border: 1px solid #e1e1e1;

                background: #fff;

                line-height: 32px;

                cursor: default;

                -webkit-transition: all .5s;

                transition: all .5s;

                cursor: pointer;

            }



                .sec5  .mian .hd ul li.on, .sec5  .mian .hd ul li:hover {

                    border: 1px solid #E1112A;

                    background: #E1112A;

                    color: #fff;

                    -webkit-transform: scale(1.05);

                    transform: scale(1.05);

                }



    .sec5  .mian .bd .box-sec5 .gg {

        position: relative;

        overflow: hidden;

    }

    .sec5  .mian .bd .box-sec5{

        height: auto;

    }





            .sec5  .mian .bd .box-sec5 .gg > div > a {

                display: block;

            }



                .sec5  .mian .bd .box-sec5 .gg > div > a > img {

                    width: 100%;

                    background: url(../images/loading.gif) no-repeat center;

                    -webkit-transition: all .8s;

                    transition: all .8s;

                }



                .sec5  .mian .bd .box-sec5 .gg > div > a > span {

                    position: absolute;

                    left: 0;

                    bottom: -64px;

                    width: 100%;

                    height: 64px;

                    padding: 6px 20px 0 20px;

                    background: url(../images/icon_5.png) repeat;

                    box-sizing: border-box;

                    -webkit-transition: all .5s;

                    transition: all .5s;

                }



                    .sec5  .mian .bd .box-sec5 .gg > div > a > span font {

                        display: block;

                        font-size: 13px;

                        color: #f5f5f5;

                        line-height: 26px;

                    }



                        .sec5  .mian .bd .box-sec5 .gg > div > a > span font:first-child {

                            font-size: 16px;

                        }



            .sec5  .mian .bd .box-sec5 .gg > div:hover > a > span {

                bottom: 0;

            }



            .sec5  .mian .bd .box-sec5 .gg > div:hover > a > img {

                -webkit-transform: scale(1.01);

                transform: scale(1.01);

            }



        .sec5  .mian .bd .box-sec5 .gg .a1 {

            top: 0;

            left: 0;

            width: 696px;

            margin-right: 11px;

            float: left;

            height: auto;

            position: relative;

            overflow: hidden;

            border-radius: 5px;

        }

        .sec5  .mian .bd .box-sec5 .gg .a1 img{

            width: 100%;

            transform: scale(1);

            transition: all 0.5s;

        }





        .sec5  .mian .bd .box-sec5 .gg .a2 {

            top: 0;

            left: 405px;

            width: 390px;

            height: 231px;

        }



        .sec5  .mian .bd .box-sec5 .gg .a3 {

            top: 246px;

            left: 405px;

            width: 390px;

            height: 231px;

        }



        .sec5  .mian .bd .box-sec5 .gg .a4 {

            bottom: 0;

            left: 405px;

            width: 390px;

            height: 231px;

        }



        .sec5  .mian .bd .box-sec5 .gg .a5 {

            bottom: 0;

            right: 0;

            width: 390px;

            height: 477px;

            background-position: top left;

            -webkit-transition: all 5.5s;

            transition: all 5.5s;

        }



        .sec5  .mian .bd .box-sec5 .gg .a6 {

            bottom: 0;

            left: 0;

            width: 390px;

            height: 231px;

        }



        .sec5 .mian .bd .box-sec5 .gg .a7 {

            top: 11px;

            right: 0;

            width: auto;

            float: left;

            height: 231px;

            position: relative;

            margin-right: 40px;

        }

        .sec5 .mian .bd .box-sec5 .gg .a7 img{

            border-radius: 3px;

        }

        .sec5  .mian .bd .box-sec5 .gg .a7:nth-last-child(1){

            margin-right: 0px;

        }



        .sec5  .mian .bd .box-sec5 .gg .a1:hover a {

            background-position: top right;

        }



        .sec5  .mian .bd .box-sec5 .gg .a5:hover {

            background-position: top right;

        }



        .sec5  .mian .bd .box-sec5 .gg .aa p {

            display: none;

            position: absolute;

            left: 0px;

            top: 0px;

            width: 100%;

            height: 216px;

            background: rgba(0, 0, 0, 0.5) none repeat scroll 0% 0% ! important;

        }



        .sec5  .mian .bd .box-sec5 .gg .aa:hover p {

            display: block;

            animation-name: topAni5;

        }



        .sec5  .mian .bd .box-sec5 .gg .aa p em {

            visibility: hidden;

            position: absolute;

            top: 0;

            right: 0;

            z-index: 1;

            width: 100%;

            height: 100%;

            background: url(../images/icon_68.png) repeat;

            -webkit-transition: all .5s;

            transition: all .5s;

            /*opacity: 0;*/

            visibility: inherit;

            opacity: 1;

        }



        .sec5  .mian .bd .box-sec5 .gg .aa p font {

            padding: 65px 15px 0px;

            text-indent: 2em;

            color: rgb(255, 255, 255);

            display: block;

            font-size: 14px;

        }



                .sec5  .mian .bd .box-sec5 .gg .aa p font i {

                    display: block;

                    font-size: 20px;

                    color: #fff;

                    line-height: 0;

                    -webkit-transition: all .5s;

                    transition: all .5s;

                    -webkit-transform: translateY(30px);

                    transform: translateY(30px);

                    opacity: 0;

                }



        /*.sec5  .mian .bd .box-sec5 .gg .aa:hover p em {

            visibility: inherit;

            opacity: 1;

        }



        .sec5  .mian .bd .box-sec5 .gg .aa:hover p font {

            background: url(../images/icon_74.png) no-repeat top center;

            color: #fff;

        }*/



            .sec5  .mian .bd .box-sec5 .gg .aa:hover p font i {

                -webkit-transform: translateY(0);

                transform: translateY(0);

                opacity: 1;

            }



    .sec5  .mian .bd .box-sec5 .kk {

        margin-top: 40px;

        padding: 25px 0;

        text-align: center;

    }



        .sec5  .mian .bd .box-sec5 .kk a {

            display: inline-block;

            width: 200px;

            height: 50px;

            background: #3f4a55;

            font-size: 16px;

            color: #fff;

            text-align: center;

            line-height: 50px;

            -webkit-transition: all .5s;

            transition: all .5s;

        }



            .sec5  .mian .bd .box-sec5 .kk a:hover {

                background: #E1112A;

            }



            .sec5 .form {

                width: 488px;

                float: left;

                box-shadow: 2px 2px 10px #ddd;

                margin-right: 2px;

            }

            

            .sec5 .form dl {

                overflow: hidden;

                font-size: 16px;

                padding: 8px 0 10px 146px

            }

            

            .sec5 .form dt {

                float: left;

                width: 6em;

                margin-left: -6em;

                line-height: 40px;

                color: #212628

            }

            

            .sec5 .form dd {

                position: relative;

                float: left

            }

            

            .sec5 .form dd .button {

                padding-left: 50px;

                padding-right: 50px;

                background: #e74c3c;

                color: #fff;

            }

            .sec5 .form .button {

                background: #e74c3c;

                color: #fff;

                margin: 0 auto;

                display: block;

                margin-bottom: 14px;

            }

            

            .sec5 .form dd .dw {

                position: absolute;

                right: 10px;

                top: 50%;

                margin-top: -10px;

                font-size: 14px

            }

            

            .sec5 .form .line {

                width: 31px;

                height: 7px;

                background: #e74c3c;

                margin: 12px auto 30px

            }

            

            .sec5 .form input    .sec5 .form select {

                border: solid 1px #ddd;

                background: #fafafa;

                padding: 9px 15px;

                font-size: 14px

            }

            

            .sec5 .form select {

                width: 87px;

                margin-right: 10px

            }

            

            .sec5 .form input {

                width: 259px

            }



            .f26 {

                font-size: 26px !important;

            }

            .mt40 {

                margin-top: 40px !important;

            }

            .tc {

                text-align: center;

            }

            .text-title {

                color: #212628;

            }

            .box-sec5 .form input, .box-sec5 .form select {

                border: solid 1px #ddd;

                background: #fafafa;

                padding: 9px 15px;

                font-size: 14px;

            }

            .sec5 .mian .bd .float-span {

                position: absolute;

                left: 0;

                bottom: -64px;

                width: 100%;

                height: 64px;

                padding: 6px 14px 0 16px;

                background: url(http://www.xydec.cn/images/icon_5.png) repeat;

                box-sizing: border-box;

                -webkit-transition: all .5s;

                transition: all .5s;

                color: #fff;

            }

            .sec5 .mian .bd .a1:hover .float-span{

                bottom: 0px;

            }

            .sec5 .mian .bd .box-sec5 .gg .a1:hover img{

                transform: scale(1.1);

            }

            .sec5{

                padding-bottom: 70px;

            }