body {
    font-family: '微软雅黑';
}

.header-box {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 80px;
    background: rgba(255, 255, 255, .8);
    z-index: 100;
}

.h-img-b {
    height: 80px;
    float: left;
    padding: 10px;
}

.h-img-b img {
    height: 60px;
}

.h-nav-box {
    float: right;
    height: 80px;
    padding: 20px 0;
}

.nav-item {
    display: inline-block;
    height: 30px;
    line-height: 30px;
    cursor: pointer;
    color: rgb(80,80,80);
    margin: 5px 20px 0 20px;
}

.nav-item.active {
    color: rgb(243, 72, 0);
    border-bottom: 1px solid rgb(243, 72, 0);
}

.nav-item:hover {
    text-decoration: none;
    color: rgb(243, 72, 0);
    border-bottom: 1px solid rgb(243, 72, 0);
}

.h-sub-nav {
    position: fixed;
    top: 80px;
    height: 50px;
    left: 0;
    right: 0;
    background-color: rgb(243, 72, 0);
    z-index: 100;
}

.sub-nav-item {
    display: inline-block;
    line-height: 30px;
    width: 100px;
    position: relative;
}

.sub-nav-item.active {
    background-color: rgb(245, 109, 51);
}

.sub-nav-item:hover {
    background-color: rgb(245, 109, 51);
}

.carousel-inner .item img {
    width: 100%;
}

.carousel-control img {
    position: absolute;
    top: 50%;
    height: 100px;
    margin-top: -50px;
}

.carousel-control.left img {
    left: 30px;
}

.carousel-control.right img {
    right: 30px;
}

.m-p-b {
    padding: 0 10%;
}

.f-s-28 {
    font-size: 28px;
}

.f-s-18 {
    font-size: 18px;
}

.f-s-14 {
    font-size: 14px;
}

.f-s-12 {
    font-size: 12px;
}

.f-s-16 {
    font-size: 16px;
}

.m-t-30 {
    margin-top: 30px;
}

.p-t-10 {
    padding-top: 10px;
}

.p-t-5 {
    padding-top: 5px;
}

.p-b-5 {
    padding-bottom: 5px;
}

.p-t-20 {
    padding-top: 20px;
}

.p-l-20 {
    padding-left: 20px;
}

.p-r-20 {
    padding-right: 20px;
}

.p-t-40 {
    padding-top: 40px;
}

.p-b-40 {
    padding-bottom: 40px;
}

.p-l-40 {
    padding-left: 40px;
}

.p-r-40 {
    padding-right: 40px;
}

.p-l-120 {
    padding-left: 120px;
}

.p-b-20 {
    padding-bottom: 20px;
}

.p-b-10 {
    padding-bottom: 10px;
}

.p-l-5 {
    padding-left: 5px;
}

.p-r-5 {
    padding-right: 5px;
}

.m-l-10 {
    margin-left: 10px;
}
.m-l-30 {
    margin-left: 30px;
}
.m-r-20 {
    margin-right: 20px;
}

.m-t-5 {
    margin-top: 5px;
}

.m-b-0 {
    margin-bottom: 0;
}

.m-l-0 {
    margin-left: 0;
}

.m-r-0 {
    margin-right: 0;
}

.m-l-80 {
    margin-left: 80px;
}

.m-r-80 {
    margin-right: 80px;
}

.p-l-0 {
    padding-left: 0;
}

.p-r-0 {
    padding-right: 0;
}

.p-r-10 {
    padding-right: 10px;
}

.p-l-10 {
    padding-left: 10px;
}

.f-c-g {
    color: rgb(160, 160, 160);
}

.f-c-100 {
    color: rgb(100, 100, 100);
}

.f-c-140 {
    color: rgb(140, 140, 140);
}

.f-c-o {
    color: rgb(243, 72, 0);
}

.f-c-w {
    color: white;
}

.f-c-r {
    color: rgb(235, 45, 109);
}

.f-w-600 {
    font-weight: 600;
}

.bg-g {
    background-color: rgb(230, 230, 230);
}

.bg-b-a {
    background-color: rgba(0, 0, 0, .5);
}

.bg-o {
    background-color: rgb(243, 72, 0);
}

.b-t-1 {
    border-bottom: 1px solid rgb(220, 220, 220);
}

.b-1 {
    border: 1px solid rgb(220, 220, 220);
}

.b-b-w {
    border-bottom: 1px solid white;
}

.w-90 {
    width: 90%;
}

.new-works-box {
    margin-top: 30px;
    position: relative;
    height: 350px;
    overflow: hidden;
}

.new-works-box .item {
    height: 350px;
    overflow: hidden;
    position: absolute;
    width:60%;
}

.new-works-box .item[data-index='0'] {
    right: 40%;
}

.new-works-box .item[data-index='1'] {
    right: -20%;
}

.new-works-box .item[data-index='2'] {
    right: -40%;
}

.new-works-box .item.active img {
    width: 100%;
}

.new-works-box .item img {
    height: 350px;
}

.line-ellipsis {
    overflow : hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.duo-ellipsis-2 {
    overflow : hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.about-box {
    height: 497px;
}

.new-list-box .item:hover .n-time-header {
    background: rgb(243, 72, 0);
}

.new-list-box .item:hover .n-time-header span, .new-list-box .item:hover .n-time-header p {
    color: white;
}

.new-list-box .item:hover .n-content .line-ellipsis {
    color: rgb(243, 72, 0);
}

.new-list-box .item {
    position: relative;
}

.n-time-header {
    width: 80px;
    height: 80px;
    padding: 10px;
    position: absolute;
    left: 0;
}

.n-content {
    padding-left: 90px;
}

.index-footer {
    margin-left: 0;
    margin-right: 0;
    border-top: 1px solid rgb(243, 72, 0);
}

.footer {
    margin-left: 0;
    margin-right: 0;
    padding-top: 30px;
    padding-bottom: 30px;
    background-color: #F5F5F5
}

.footer-input input {
    width: 100%;
    border-radius: 5px;
    background-color: black;
    outline: none;
    border: none;
    color: white;
    height: 40px;
    padding: 5px 10px;
}

.footer-input textarea {
    width: 100%;
    resize: none;
    border-radius: 5px;
    background-color: black;
    outline: none;
    border: none;
    color: white;
    height: 150px;
    padding: 10px;
    margin-top: 20px;
}

.product-bg {
    height: 400px;
}

.product-bg-1 {
    background: url(../images/018.png) no-repeat;
    background-size: cover;
}

.product-bg-2 {
    background: url(../images/021.png) no-repeat;
    background-size: cover;
}

.product-bg-3 {
    background: url(../images/023.png) no-repeat;
    background-size: cover;
}

.product-bg-4 {
    background: url(../images/025.png) no-repeat;
    background-size: cover;
}

.float-r {
    float: right;
}

.float-l {
    float: left;
}

.w-50 {
    width: 50%;
}

.product-item-img {
    display: inline-block;
}

.product-item-img img {
    display: block;
    width: 100px;
}

.z-p-b {
    /*margin: 0;*/
}

.z-p-b .z-p-i {
    border-radius: 10px;
    border: 1px solid rgb(220, 220, 220);
    padding: 20px 20px 60px 20px;
    margin-bottom: 20px;
}

.a-h-b {
    background: url(../images/010.png) no-repeat;
    height: 350px;
    background-size: cover;
}

.g-t-p {
    background: white;
    width: 100%;
    height: 80px;
}

.g-t-p-i {
    float: left;
    width: 150px;
    height: 80px;
    padding: 0 10px;
    border-right: 1px solid rgb(222, 222, 222);
}

.g-t-p-i.active {
    border: 1px solid rgb(243, 72, 0);
}

.g-t-p-c {
    background: rgb(240, 240, 240);
    height: 265px
}

.c-s-c {
    padding-left: 210px;
}

.c-s-i {
    height: 150px;
    padding: 20px 15px;
}

.c-s-i:nth-child(even) {
    background: rgb(241, 241, 241);
}

.c-n-l {
    font-size: 18px;
    padding-bottom: 10px;
    color: rgb(235, 45, 109);
    border-bottom: 3px solid rgb(235, 45, 109);
}

.c-n-r {
    padding: 15px 5px;
    border: 1px solid rgb(222, 222, 222);
}

.animated {
    -webkit-animation-duration: .2s;
    animation-duration: .2s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both
}

.slideOpen2 {
    -webkit-animation-name: slideOpen2;
    animation-name: slideOpen2;
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom
}

@-webkit-keyframes slideOpen2 {
    0% {
        right: -40%;
    }

    10% {
        right: -35%;
    }

    20% {
        right: -30%;
    }

    35% {
        right: -25%;
    }

    50% {
        right: -20%;
    }

    65% {
        right: -15%;
    }

    80% {
        right: -10%;
    }

    90% {
        right: -5%;
    }

    100% {
        right: 0;
    }
}

@keyframes slideOpen2 {
    0% {
        right: -40%;
    }

    10% {
        right: -35%;
    }

    20% {
        right: -30%;
    }

    35% {
        right: -25%;
    }

    50% {
        right: -20%;
    }

    65% {
        right: -15%;
    }

    80% {
        right: -10%;
    }

    90% {
        right: -5%;
    }

    100% {
        right: 0;
    }
}

.slideClose2 {
    -webkit-animation-name: slideClose2;
    animation-name: slideClose2;
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom
}

@-webkit-keyframes slideClose2 {
    0% {
        right: 0;
    }

    10% {
        right: -5%;
    }

    20% {
        right: -10%;
    }

    35% {
        right: -15%;
    }

    50% {
        right: -20%;
    }

    65% {
        right: -25%;
    }

    80% {
        right: -30%;
    }

    90% {
        right: -35%;
    }

    100% {
        right: 40%;
    }
}

@keyframes slideClose2 {
    0% {
        right: 0;
    }

    10% {
        right: -5%;
    }

    20% {
        right: -10%;
    }

    35% {
        right: -15%;
    }

    50% {
        right: -20%;
    }

    65% {
        right: -25%;
    }

    80% {
        right: -30%;
    }

    90% {
        right: -35%;
    }

    100% {
        right: 40%;
    }
}

.slideOpen1 {
    -webkit-animation-name: slideOpen1;
    animation-name: slideOpen1;
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom
}

@-webkit-keyframes slideOpen1 {
    0% {
        right: -20%;
    }

    10% {
        right: -15%;
    }

    20% {
        right: -10%;
    }

    35% {
        right: -5%;
    }

    50% {
        right: 0;
    }

    65% {
        right: 5%;
    }

    80% {
        right: 10%;
    }

    90% {
        right: 15%;
    }

    100% {
        right: 20%;
    }
}

@keyframes slideOpen1 {
    0% {
        right: -20%;
    }

    10% {
        right: -15%;
    }

    20% {
        right: -10%;
    }

    35% {
        right: -5%;
    }

    50% {
        right: 0;
    }

    65% {
        right: 5%;
    }

    80% {
        right: 10%;
    }

    90% {
        right: 15%;
    }

    100% {
        right: 20%;
    }
}

.slideClose1 {
    -webkit-animation-name: slideClose1;
    animation-name: slideClose1;
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom
}

@-webkit-keyframes slideClose1 {
    0% {
        right: 20%;
    }

    10% {
        right: 15%;
    }

    20% {
        right: 10%;
    }

    35% {
        right: 5%;
    }

    50% {
        right: 0;
    }

    65% {
        right: -5%;
    }

    80% {
        right: -10%;
    }

    90% {
        right: -15%;
    }

    100% {
        right: -20%;
    }
}

@keyframes slideClose1 {
    0% {
        right: 20%;
    }

    10% {
        right: 15%;
    }

    20% {
        right: 10%;
    }

    35% {
        right: 5%;
    }

    50% {
        right: 0;
    }

    65% {
        right: -5%;
    }

    80% {
        right: -10%;
    }

    90% {
        right: -15%;
    }

    100% {
        right: -20%;
    }
}