#header {
    position: relative;
    background-color: #FFF;
    box-shadow: 0 0 .5rem rgba(170,170,170,0.75);
    z-index: 100
}

#header .top-right {
    display: flex;
    margin: 1rem 3rem 0 0;
    align-items: center;
    position: absolute;
    top: 0;
    right: 0
}

#header .top-right a {
    display: inline-block;
    padding: 5px;
    font-size: 1.8rem;
    line-height: 100%;
    color: #ffa939
}

#header .top-right a:hover {
    color: #ef6c00
}

#language-drop {
    display: inline-block;
    position: relative;
    margin: 0 0 0 .5rem
}

#language-drop a,#language-drop button {
    font-size: 1.4rem;
    line-height: 100%;
    color: #ffa939
}

#language-drop a small,#language-drop button small {
    font-size: 75%
}

#language-drop a.active,#language-drop button.active {
    color: #FFF;
    background-color: #ffa939
}

#language-drop .dropdown-toggle {
    display: block;
    padding: .3rem .5rem;
    background-color: inherit;
    border: 1px solid #ffa939;
    border-radius: 0
}

#language-drop .dropdown-toggle:focus {
    box-shadow: none
}

#language-drop .dropdown-toggle::after {
    content: "";
    display: none
}

#language-drop .dropdown-menu {
    min-width: inherit;
    left: 0;
    margin: 0;
    padding: 0;
    width: 100%;
    border: 1px solid #ffa939;
    border-radius: 0
}

#language-drop .dropdown-menu .dropdown-item {
    min-width: inherit;
    font-size: 1.2rem
}

#language-drop .dropdown-menu a {
    padding: .5rem
}

#language-drop .dropdown-menu a:hover {
    color: #ef6c00
}

#logo {
    padding: 2.1rem 0 1rem
}

#nav {
    padding-bottom: 0
}

#nav .navbar-toggler {
    font-size: 2.5rem;
    color: #999;
    outline: 0
}

#nav .navbar-toggler[aria-expanded="true"] {
    color: #ffa939
}

#nav #nav-menu .nav-item a.nav-link {
    display: block;
    margin: 0;
    padding: 1rem 2rem 2.5rem;
    font-size: 1.4rem;
    color: #737373;
    border-bottom: 2px solid hidden
}

#nav #nav-menu .nav-item.active a.nav-link {
    border-bottom: 2px solid #ffa939
}

#nav #nav-menu .nav-item .dropdown-menu {
    position: absolute;
    width: 100%;
    font-size: 1.4rem
}

#nav #nav-menu .nav-item .dropdown-menu a {
    color: #999
}

@media(max-width: 768px) {
    #header .top-right {
        position:relative;
        margin: .5rem 0;
        padding: 1rem 1.5rem
    }

    #header .top-right>a,#header .top-right .dropdown {
        margin: 0 .5rem
    }

    #header .top-right .icon-sina,#header .top-right .icon-wechat {
        font-size: 2.5rem
    }

    #language-drop .dropdown-toggle {
        font-size: 1.2rem;
        padding: .6rem
    }

    #language-drop .dropdown-menu {
        width: auto;
        top: 0;
        left: 100%;
        height: 100%
    }

    #language-drop .dropdown-menu .dropdown-item {
        display: inline-block;
        float: left;
        position: relative;
        font-size: 1.2rem;
        padding: .6rem
    }

    #language-drop.show .dropdown-menu {
        display: flex
    }

    #nav #nav-menu .navbar-nav {
        flex-direction: row;
        justify-content: space-between
    }

    #nav #nav-menu .navbar-nav .nav-item a {
        padding: .5rem 0;
        text-align: center
    }
}

@media(max-width: 576px) {
    #logo {
        padding:1.5rem 0 .5rem
    }

    #logo img {
        height: 4rem
    }

    #nav #nav-menu {
        position: relative;
        top: 10px
    }

    #nav #nav-menu .navbar-nav {
        flex-direction: column
    }

    #nav #nav-menu .navbar-nav .nav-item a.nav-link {
        padding: 1rem 1.5rem;
        font-size: 1.6rem;
        text-align: left!important
    }

    #nav #nav-menu .navbar-nav .nav-item.active a {
        color: #FFF;
        background-color: #ffa939
    }

    #nav #nav-menu .navbar-nav .dropdown-menu {
        position: relative;
        border: 0;
        border-top: 1px solid #CCC
    }

    #nav #nav-menu .navbar-nav .dropdown-menu a {
        padding: .5rem 3rem;
        font-size: 1.6rem;
        text-align: left
    }
}

#footer .head {
    background-color: #e8e8e8;
    color: #575757;
    line-height: 170%
}

#footer .bottom {
    margin: 0;
    padding: .8rem 0;
    background-color: #737373
}

#footer #footer-logo {
    width: 165px;
    margin: 0 auto 15px auto
}

#footer #footer-code {
    width: 115px;
    margin: auto
}

#website-maps .col-4 {
    margin-bottom: 2rem;
    padding: 0
}

#website-maps p {
    font-size: 1.6rem;
    font-weight: bold
}

#website-maps ul {
    list-style: none;
    margin: 0 0 .5rem 0;
    padding: 0;
    font-size: 1.4rem;
    line-height: 170%
}

#friend-link {
    list-style: none;
    margin: 0;
    padding: 0
}

#friend-link li {
    display: inline-block;
    margin: .5rem;
    padding: 0
}

@media(max-width: 1200px) {
    #footer .font16 {
        font-size:1.4rem
    }

    #footer .font14 {
        font-size: 1.2rem
    }

    #footer .font12 {
        font-size: 1rem
    }

    #footer .head .col-md-7>.row {
        padding-left: 1.5rem;
        padding-right: 1.5rem
    }

    #friend-link p,#website-maps p {
        font-size: 1.4rem
    }

    #friend-link li,#website-maps li {
        font-size: 1.2rem
    }
}

.index-title {
    margin: 0;
    padding: 4rem 0 3rem 0;
    color: #737373;
    text-align: center
}

.index-title span {
    display: block;
    position: relative;
    left: 0;
    right: 0;
    margin: auto
}

.index-title .font50 {
    font-size: 5rem;
    font-weight: 100
}

.index-title .font40 {
    margin-top: 1rem;
    width: 300px;
    font-size: 4rem;
    font-weight: 100;
    border-top: 1px dotted #737373
}

.index-title.orange {
    color: #ffa939
}

#index-banner {
    mar gin-top: -10rem
}

#index-banner .img-box {
    display: block;
    position: relative;
    width: 100%;
    height: 100%
}

#index-banner .img-box img {
    display: block;
    position: absolute;
    width: 100%;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%)
}

#index-products .products-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

#index-products .list .pull-left {
    width: 20%;
    text-align: center
}

#index-products .list .simg-box {
    display: block;
    border: 1px solid #999
}

#index-products .list .simg-box .bg {
    position: relative;
    width: 100%;
    height: auto
}

#index-products .list .simg-box .img {
    position: absolute;
    max-height: 50%;
    top: 25%
}

#index-products .list .simg-box .title {
    position: absolute;
    top: 5%;
    left: 0;
    right: 0;
    font-size: 2.4rem;
    text-align: center;
    color: #737373
}

#index-products .list .simg-box .title .bd {
    display: block;
    position: relative;
    bottom: -10px;
    left: 0;
    right: 0;
    margin: auto;
    width: 50px;
    height: 1px;
    background-color: #666;
    transition: all .3s
}

#index-products .list .simg-box .descript {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    padding: 10px;
    font-size: 1.4rem;
    text-align: center;
    color: #575757
}

#index-products .list .simg-box .descript .btn {
    display: inline-block;
    margin: 1rem 0;
    padding: .4rem 2rem;
    font-size: 1.4rem;
    color: #575757;
    background-color: inherit;
    border: 1px solid #999
}

#index-products .list .simg-box:hover {
    border: 1px solid #ffa939;
    z-index: 10
}

#index-products .list .simg-box:hover .title .bd {
    bottom: -25px;
    transform: rotateZ(90deg)
}

#index-products .list .simg-box:hover .descript .btn {
    color: #FFF;
    background-color: #ffa939;
    border-color: #ffa939
}

@media(min-width: 575px) and (max-width:1024px) {
    #index-products .list .pull-left {
        width:50%
    }
}

@media(max-width: 575px) {
    #index-products .list .pull-left {
        float:none;
        width: 100%
    }
}

#index-news .tab-box {
    border: 1px solid #CCC;
    background-color: #FFF;
    box-shadow: 0 4px 13px rgba(180,180,180,0.75)
}

#index-news .tab-box .tab {
    margin: -2px 0
}

#index-news .tab-box .tab a {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    margin: 2px 0;
    width: 100%;
    height: 12rem;
    font-size: 2rem;
    color: #000;
    background-color: #dedede
}

#index-news .tab-box .tab a i {
    display: inline-block;
    margin-right: 1.5zrem;
    font-size: 2.6rem;
    color: #737373
}

#index-news .tab-box .tab a::before {
    content: "";
    display: block;
    position: absolute;
    left: 100%;
    width: 0;
    height: 0;
    border-left: 15px solid #dedede;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent
}

#index-news .tab-box .tab a:hover {
    background-color: #CCC
}

#index-news .tab-box .tab a:hover::before {
    border-left: 15px solid #CCC
}

#index-news .tab-box .tab a.active {
    color: #FFF;
    background-color: #ffa939
}

#index-news .tab-box .tab a.active i {
    color: #FFF
}

#index-news .tab-box .tab a.active::before {
    border-left: 15px solid #ffa939
}

#index-news .tab-box .content .box {
    padding: 2rem 3rem 0 3rem
}

#index-news .tab-box .content .box .title {
    margin: 2rem 0;
    font-size: 1.8rem;
    color: #575757
}

#index-news .tab-box .content .box .description {
    font-size: 1.6rem;
    line-height: 150%;
    color: #737373
}

#index-news .tab-box .content .box .list {
    margin: 2rem 0 0 0;
    padding: 0;
    list-style: none
}

#index-news .tab-box .content .box .list li {
    display: block;
    border-top: 1px solid #CCC
}

#index-news .tab-box .content .box .list li a {
    display: inline-block
}

#index-news .tab-box .content .box .list li .add-time {
    float: right;
    margin-top: 2.4rem;
    font-size: 1.6rem;
    color: #CCC
}

@media(max-width: 768px) {
    #index-news .tab-box .tab {
        float:none;
        width: 100%!important
    }

    #index-news .tab-box .tab a {
        display: inline-block;
        padding: 1rem 0;
        width: 25%;
        height: auto;
        font-size: 1.4rem;
        text-align: center
    }

    #index-news .tab-box .tab a::before {
        display: none
    }

    #index-news .tab-box .tab a i {
        display: block
    }

    #index-news .tab-box .content .box {
        padding: 2rem 1rem
    }

    #index-news .tab-box .content .box .list li {
        display: block;
        padding: 1.5rem 0
    }

    #index-news .tab-box .content .box .list li a {
        display: block;
        margin: 0
    }

    #index-news .tab-box .content .box .list li .add-time {
        display: block;
        float: none;
        font-size: 1.2rem;
        color: #999;
        margin: 0
    }
}

#index-case {
    position: relative;
    width: 100%;
    height: 500px;
    overflow: hidden;
    background-color: #CCC
}

#index-case .boxs {
    list-style: none;
    position: relative;
    margin: 0;
    padding: 0
}

#index-case .boxs .box[data-layer] {
    visibility: visible;
    position: absolute
}

#index-case .boxs .box[data-layer].active {
    z-index: 5;
    max-width: 60%;
    max-height: 100%
}

#index-case .boxs .box[data-layer][data-layer="2"] {
    z-index: 4;
    max-width: 50%;
    max-height: 80%
}

#index-case .boxs .box[data-layer][data-layer="3"] {
    z-index: 3;
    max-width: 40%;
    max-height: 60%
}

#index-about {
    background: url(../image/index/about.jpg) no-repeat center
}

#index-about .w-50 {
    padding: 1px 0;
    background-color: rgba(0,0,0,0.45)
}

#index-about p {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    position: relative;
    padding-right: 30rem;
    margin: 3rem 0;
    height: 10rem;
    font-size: 2rem;
    text-align: right;
    color: #FFF;
    background-color: rgba(255,169,57,0);
    transition: all .4s
}

#index-about p span {
    display: none;
    position: relative;
    font-size: 1.4rem;
    white-space: pre-wrap
}

#index-about p a {
    display: none;
    position: absolute;
    right: 5rem;
    font-size: 2.4rem
}

#index-about p:hover {
    margin-right: -40rem;
    padding-right: 48rem;
    background-color: #ffa939
}

#index-about p:hover span {
    display: inline-block
}

#index-about p:hover a {
    display: block;
    position: absolute
}

@media(max-width: 1024px) {
    #index-about .pull-left.w-50 {
        float:none;
        width: 100%!important
    }

    #index-about .pull-left.w-50 p {
        display: block;
        margin: 0;
        padding: 2rem 1.5rem;
        height: auto;
        text-align: center
    }

    #index-about .pull-left.w-50 p:hover {
        margin-right: 0;
        background-color: rgba(255,169,57,0.8)
    }

    #index-about .pull-left.w-50 p span {
        margin-top: 1rem;
        display: block
    }
}

#pd-nav {
    border-bottom: 1px solid #AAA
}

#pd-nav a {
    display: inline-block;
    margin: 0 .5rem -2px .5rem;
    padding: 0 3rem;
    font-size: 1.6rem;
    line-height: 6rem;
    border-bottom: 3px solid rgba(255,170,57,0)
}

#pd-nav a.active {
    border-bottom-color: #ffa939
}

@media(min-width: 400px) and (max-width:992px) {
    #pd-nav {
        display:flex;
        text-align: center
    }

    #pd-nav a {
        display: inline-block;
        margin: 0 0 -2px 0;
        padding: 1rem;
        font-size: 1.4rem;
        line-height: 100%
    }
}

@media(max-width: 400px) {
    #pd-nav {
        display:flex;
        text-align: center
    }

    #pd-nav a {
        display: inline-block;
        margin: 0 0 -2px 0;
        padding: 0 .5rem;
        font-size: 1.2rem;
        line-height: 400%
    }
}

#pd-list {
    margin-top: 5rem
}

#pd-list .row {
    padding: 0 40px;
    align-items: center
}

#pd-list .row .col-md-6 {
    position: relative;
    overflow: hidden
}

#pd-list .row .col-md-6 img {
    display: block;
    position: relative;
    left: 50%;
    transform: translateX(-50%)
}

#pd-list .row .col-md-6 .info {
    margin: 0 10%
}

#pd-list .row .col-md-6 .info .title {
    margin-bottom: 2rem
}

#pd-list .row .col-md-6 .info .title span {
    display: inline-block;
    padding: 2rem 0;
    font-size: 2.6rem;
    font-weight: bold;
    color: #575757;
    border-bottom: 1px solid #999
}

#pd-list .row .col-md-6 .info .descript {
    margin: 2rem 0;
    padding: 0;
    font-size: 1.4rem;
    color: #575757
}

#pd-list .row .col-md-6 .info .btn-blue {
    font-size: 1.2rem;
    font-weight: bold;
    border: 0;
    border-radius: 0
}

@media(max-width: 992px) {
    #pd-list {
        margin:2rem 0 0 0
    }

    #pd-list .row {
        display: block;
        padding: 0 15px
    }

    #pd-list .row .col-md-6 .info {
        margin: 0 0 40px 0
    }
}

#product-show {
    margin-top: 2.5rem
}

#product-show #product-show-img .big-img {
    margin: 0;
    padding: 0;
    text-align: center
}

#product-show #product-show-img .big-img img {
    max-width: 100%
}

#product-show #product-show-img .control {
    max-height: 350px
}

#product-show #product-show-img .btn {
    padding: 0;
    font-size: 2.2rem;
    line-height: 100%;
    color: #999;
    background-color: inherit;
    border: 0
}

#product-show #product-show-img .btn:hover {
    color: #ffa939
}

#product-show #product-show-img .box {
    width: 100%;
    position: relative;
    overflow: hidden
}

#product-show #product-show-img .list {
    position: relative;
    list-style: none;
    margin: 0;
    padding: 0;
    width: 100%
}

#product-show #product-show-img .list li {
    position: relative;
    margin: 10px 0;
    padding: 0;
    width: 100%;
    height: 90px;
    border: 1px solid #666;
    overflow: hidden
}

#product-show #product-show-img .list li img {
    position: absolute;
    max-width: 100%;
    top: 50%;
    transform: translateY(-50%)
}

#product-show #product-show-img .list li.active {
    border-color: #ffa939
}

#product-show .info .top {
    padding: 3rem 0 4rem 0
}

#product-show .info .title {
    font-size: 2.2rem;
    font-weight: bold;
    color: #333
}

#product-show .info .link-blue {
    margin-top: .5rem;
    font-size: 1.4rem
}

#product-show .info .link-blue .icon-store {
    margin: 0 5px;
    font-size: 1.6rem
}

#product-show .info p {
    margin: 0;
    font-size: 1.6rem;
    color: #575757
}

#product-show .info .color-box {
    margin: 3rem 0;
    padding-top: 3rem;
    border-top: 1px solid #CCC
}

#product-show .info .color-box .row {
    margin: 0
}

#product-show .info .color-box p {
    margin-bottom: 2rem
}

#product-show .info .color {
    margin: 0 2rem 0 0;
    text-align: center
}

#product-show .info .color a {
    display: inline-block;
    margin: 0;
    padding: .5rem;
    border: 1px solid #FFF
}

#product-show .info .color a.active {
    border-color: #ffa939
}

#product-show .info .color p {
    margin: 1rem 0;
    font-size: 1.4rem;
    text-align: center
}

#product-detail .title {
    margin-bottom: 2rem;
    padding: 2rem 1rem;
    font-size: 2rem;
    color: #575757;
    border-bottom: 1px solid #CCC
}

#mblike .title span {
    display: inline-block;
    padding: 1rem;
    font-size: 2rem;
    color: #575757;
    border-bottom: 3px solid #ffa939
}

#mblike #mblike-list {
    margin-top: 2rem;
    color: #333
}

#mblike #mblike-list p {
    margin: 1.5rem 0;
    font-size: 1.5rem;
    font-weight: bold
}

#mblike #mblike-list .carousel-indicators {
    position: relative
}

#mblike #mblike-list .carousel-indicators li {
    margin: 1rem;
    padding: 0;
    width: 1rem;
    height: 1rem;
    background-color: #999;
    border: 0;
    border-radius: 50%
}

#mblike #mblike-list .carousel-indicators li.active {
    background-color: #ffa939
}

@media(max-width: 768px) {
    #mblike #mblike-list p {
        margin:.5rem 0;
        font-size: 1rem
    }
}

#news-list .col-md-4 {
    margin: 1rem 0;
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
    border: 1px solid #FFF;
    transition: all .2s
}

#news-list .col-md-4:hover {
    border: 1px solid #dedede;
    box-shadow: 0 .2rem 1rem rgba(0,0,0,0.08)
}

#news-list .col-md-4 .simg-box {
    max-height: 24rem;
    margin-bottom: 2rem;
    overflow: hidden
}

#news-list .col-md-4 p {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

#news-list .col-md-4 .title {
    margin-bottom: 1.5rem;
    font-size: 1.8rem;
    line-height: 1.2
}

#news-list .col-md-4 .description {
    font-size: 1.4rem;
    color: #666
}

#news-list .col-md-4 .small {
    font-size: 1.2rem;
    color: #999
}

#news-list .col-md-4 .small .more {
    display: inline-block;
    float: right;
    width: 5rem;
    height: 2rem;
    line-height: 2rem;
    text-align: center;
    color: #ffa939;
    border: 1px solid #ffa939
}

#news-list .carousel-indicators {
    position: relative
}

#news-list .carousel-indicators li {
    margin: 1rem;
    padding: 0;
    width: 1rem;
    height: 1rem;
    background-color: #999;
    border: 0;
    border-radius: 50%
}

#news-list .carousel-indicators li.active {
    background-color: #ffa939
}

.pagination {
    font-size: 1.6rem
}

.pagination .page-link {
    padding-left: 1rem;
    padding-right: 1rem;
    color: #666
}

.pagination .page-link:hover {
    color: #ffa939;
    background-color: inherit
}

.pagination .page-item.active .page-link {
    color: #FFF;
    background-color: #ffa939;
    border-color: #ffa939
}

.article {
    font-size: 1.4rem;
    color: #666
}

.article p {
    line-height: 170%;
    white-space: pre-wrap
}

.article img {
    disp lay: block;
    position: relative;
    mar gin: 2rem auto;
    padding: 0;
    max-width: 100%
}

#case-carousel {
    color: #333
}

#case-carousel .title {
    margin: 1rem 0;
    padding: 1rem 0;
    font-size: 1.4rem;
    font-weight: bold;
    border-bottom: 2px solid #ffa939
}

#case-carousel .description p {
    margin: 0;
    padding: 0;
    font-size: 1.4rem;
    font-weight: bold;
    line-height: 170%
}

#case-carousel [class^="carousel-control"] {
    position: absolute;
    width: 2rem;
    height: 7.5rem;
    font-size: 2.3rem;
    line-height: 7.5rem;
    top: 3rem;
    left: auto;
    color: #FFF;
    background-color: #ffa939;
    opacity: 1
}

#case-carousel .carousel-control-next {
    left: 102%
}

#case-carousel .carousel-control-prev {
    right: 102%
}

@media(max-width: 768px) {
    #case-carousel .carousel-control-next {
        right:0;
        left: auto
    }

    #case-carousel .carousel-control-prev {
        left: 0;
        right: auto
    }
}

#case-title {
    margin: 0 0 1rem 0;
    padding: 1rem 0;
    font-size: 2rem;
    font-weight: bold;
    border-bottom: 1px solid #999
}

#case-title::before {
    content: "";
    display: inline-block;
    position: relative;
    margin: 0 1rem 0 0;
    padding: 0;
    width: 7px;
    height: 20px;
    background-color: #ffa939
}

#service1-1 {
    padding: 4rem 0;
    background-color: #e8e8e8
}

#service1-1 .box {
    padding: 5rem 0;
    width: 100%;
    background-color: #FFF;
    font-size: 1.6rem;
    box-shadow: 0 .5rem 1rem rgba(0,0,0,0.15)
}

#service1-1 .box p {
    padding: 1rem 0;
    text-align: center
}

#service1-1 .box p .font-orange {
    color: #ffa939
}

#service1-1 .box p .bg-blue {
    display: inline-block;
    margin: 0 5px;
    padding: 0 5px;
    color: #FFF;
    background-color: #0e4098
}

#service1-2 {
    padding: 4rem 0 10rem;
    background: url("../image/service/bg-1.jpg") no-repeat center
}

#service1-2 .t-title {
    font-size: 1.8rem;
    font-weight: bold;
    text-align: center;
    color: #0e4098
}

#service1-2 .box {
    position: relative;
    top: 0;
    margin: auto;
    margin-top: 3rem;
    padding: 3rem 3rem 2rem;
    max-width: 220px;
    text-align: center;
    background-color: #FFF;
    border-radius: 2rem;
    box-shadow: 0 .5rem 1rem rgba(0,0,0,0.2);
    transition: top .4s
}

#service1-2 .box:hover {
    top: -1rem
}

#service1-2 .box [class^="icon-service-"] {
    font-size: 6rem
}

#service1-2 .box .icon-service-1 {
    color: #257fc3
}

#service1-2 .box .icon-service-2 {
    color: #37bda0
}

#service1-2 .box .icon-service-3 {
    color: #18a2cf
}

#service1-2 .box .title {
    margin: 0;
    padding: 1rem 0;
    font-size: 1.6rem;
    font-weight: bold;
    color: #333
}

#service1-2 .box .detail {
    margin: 0;
    font-size: 1.6rem;
    line-height: 120%;
    text-align: left;
    color: #666
}

#service2 .nav .nav-item {
    font-size: 1.8rem
}

#service2 .nav .nav-item a {
    padding: 6px 20px;
    color: #999
}

#service2 .nav .nav-item a.active {
    color: #ffa939
}

#service2 .title {
    margin: 4rem 0;
    font-size: 2rem;
    font-weight: bold;
    color: #0e4098
}

#service2 .title::before {
    content: "";
    display: inline-block;
    width: .8rem;
    height: .8rem;
    margin: 0 1rem 0 0;
    padding: 0;
    background-color: #0e4098;
    border-radius: 50%
}

#service2 .q-box {
    margin: 1rem 0;
    list-style: none
}

#service2 .q-box .question {
    margin: 2rem 0;
    font-size: 1.6rem;
    color: #000
}

#service2 .q-box .question .plus,#service2 .q-box .question .minus {
    font-size: 22px;
    width: 22px;
    height: 22px;
    color: #333;
    text-align: center
}

#service2 .q-box .question .plus {
    display: block
}

#service2 .q-box .question .plus::before {
    content: "+";
    display: inline
}

#service2 .q-box .question .minus {
    display: none
}

#service2 .q-box .question .minus::before {
    content: "-";
    display: inline
}

#service2 .q-box .question a[aria-expanded="true"] .plus {
    display: none
}

#service2 .q-box .question a[aria-expanded="true"] .minus {
    display: block
}

#service2 .q-box .collapse {
    font-size: 1.6rem;
    line-height: 200%;
    color: #666
}

#service3 h3 {
    position: relative;
    font-size: 2rem;
    margin: 2rem 0
}

#service3 h3::before {
    content: "";
    display: inline-block;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    margin-right: 2rem;
    width: .8rem;
    height: .8rem;
    background-color: #0e4098;
    border-radius: 50%
}

#service3 h3 .plus,#service3 h3 .minus {
    font-size: 22px;
    width: 22px;
    height: 22px;
    color: #333;
    text-align: center
}

#service3 h3 .plus {
    display: block
}

#service3 h3 .plus::before {
    content: "+";
    display: inline
}

#service3 h3 .minus {
    display: none
}

#service3 h3 .minus::before {
    content: "-";
    display: inline
}

#service3 h3 a[aria-expanded="true"] .plus {
    display: none
}

#service3 h3 a[aria-expanded="true"] .minus {
    display: block
}

#service3 .card.card-body {
    display: block;
    border: 0;
    border-top: 1px solid #CCC
}

#service3 .card.card-body .icon-download {
    display: inline;
    margin-right: .5rem;
    font-size: 3rem;
    color: #999
}

#service3 .card.card-body a {
    display: inline;
    font-size: 1.6rem;
    font-style: italic;
    text-decoration: underline;
    color: #0e4098
}

#about-4 .bg-ce8 {
    position: absolute;
    padding: 3rem 4rem;
    font-size: 1.6rem;
    top: 50%;
    transform: translateY(-50%)
}

#about-4 .bg-ce8.abs-right {
    right: 0
}

#about5-1 {
    margin-top: 6rem
}

#about5-1 .title {
    margin: 0;
    padding: 0;
    font-size: 2.4rem;
    font-weight: bold
}

#about5-1 .description {
    margin: 3rem 0;
    font-size: 1.4rem;
    line-height: 150%;
    color: #666
}

#about5-1 .description p {
    margin-bottom: .5rem
}

#about5-2 {
    margin: 0;
    padding: 6rem 0;
    background: url("../image/about/about-bg.jpg") no-repeat center
}

#about5-2 .title {
    font-size: 24px;
    text-align: center;
    color: #FFF
}

#about5-2 .description {
    margin: 4rem 0;
    font-size: 1.4rem;
    text-align: center;
    line-height: 170%;
    color: #FFF
}

#about5-2 form {
    margin-top: 3rem;
    color: #FFF
}

#about5-2 form .radio-box {
    display: inline-block;
    position: relative;
    margin: 0 1rem;
    padding-left: 2rem;
    font-size: 1.2rem
}

#about5-2 form .radio-box::before {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1.2rem;
    height: 1.2rem;
    border: 1px solid #FFF;
    border-radius: 50%
}

#about5-2 form .radio-box.active::after {
    content: "";
    display: block;
    position: absolute;
    left: .3rem;
    top: 50%;
    transform: translateY(-50%);
    width: .6rem;
    height: .6rem;
    background-color: #FFF;
    border-radius: 50%
}

#about5-2 form .radio-box input[type="radio"] {
    display: none
}

#about5-2 form label {
    position: relative;
    margin-bottom: 1.5rem
}

#about5-2 form label.mush::after {
    content: "*";
    display: block;
    position: absolute;
    color: #ffa939;
    top: .7rem;
    left: 2rem
}

#about5-2 form label .warning {
    display: none;
    position: absolute;
    top: 100%;
    margin-top: 5px;
    padding: .5rem 1rem;
    max-width: 100%;
    color: #FFF;
    background-color: #dc3545;
    border-radius: 3px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.3);
    z-index: 100;
    opacity: 0;
    transition: opacity .4s
}

#about5-2 form label .warning::before {
    content: "";
    display: block;
    position: absolute;
    margin-top: -6px;
    top: 0;
    left: 10px;
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-bottom: 8px solid #dc3545
}

#about5-2 form label.err .warning {
    display: block;
    opacity: 1
}

#about5-2 form label.err input {
    border-color: #dc3545;
    outline: #dc3545
}

#about5-2 form .form-control {
    padding-left: 1.5rem;
    font-size: 1.2rem;
    line-height: 1.8rem;
    border-radius: 0
}

#about5-2 form .btn {
    margin: 2rem;
    width: 10rem;
    height: 3.5rem;
    border-radius: 0
}

#about5-2 form .btn-reset {
    color: #FFF;
    background-color: inherit;
    border: 1px solid #FFF
}

#about5-2 form .btn-reset:hover {
    background-color: rgba(255,255,255,0.3)
}

#about6-1 {
    margin: 11rem auto 5rem
}

#about6-1 p {
    margin: 3rem 0;
    font-size: 2rem;
    color: #575757
}

#about6-2 {
    position: relative;
    margin-bottom: -1.5rem;
    height: 600px;
    background-image: url(../image/about/about6-bg.png);
    background-repeat: no-repeat;
    background-position: center
}

#about6-2 .title {
    position: relative;
    top: 7rem;
    font-size: 3rem;
    font-weight: bold;
    color: #0e4098
}

#about6-2 .detail {
    position: absolute;
    bottom: 5rem;
    left: 0;
    right: 0;
    margin: auto;
    font-size: 1.4rem;
    line-height: 170%;
    color: #FFF
}

#about6-3 {
    position: relative
}

#about6-3 .table thead tr {
    margin-bottom: 2rem;
    color: #FFF;
    background-color: #0e4098
}

#about6-3 .table td,#about6-3 .table th {
    margin: 0;
    padding: 2rem 0 2rem 5rem;
    font-size: 1.6rem;
    line-height: 150%;
    border: 0
}

#about6-3 .table td[colspan],#about6-3 .table th[colspan] {
    padding: 5px;
    background-color: inherit
}

#about6-3 .table .tr {
    background-color: #e8e8e8;
    cursor: pointer
}

#about6-3 .table .tr:hover {
    background-color: #CCC
}

#about6-3 .table .tr td {
    padding: 0 0 0 5rem;
    height: 7rem;
    vertical-align: middle
}

#about6-3 .table .tr .icon-o-minus {
    display: none;
    font-size: 2.6rem
}

#about6-3 .table .tr .icon-o-plus {
    display: inline;
    font-size: 2.6rem
}

#about6-3 .table .tr[aria-expanded="true"] .icon-o-minus {
    display: inline
}

#about6-3 .table .tr[aria-expanded="true"] .icon-o-plus {
    display: none
}

#about6-3 .table .col-md-6 {
    padding: 2rem;
    font-size: 1.4rem
}

#about6-3 .table .col-md-6 .title {
    font-weight: bold
}

@media(max-width: 1024px) {
    #about6-3 .table td,#about6-3 .table th {
        padding:1rem .5rem;
        font-size: 1rem
    }
}

#about7 {
    position: relative;
    margin-top: 18rem;
    height: 740px;
    background: url(../image/about/about7-bg.jpg) no-repeat center
}

#about7 .row {
    position: relative;
    top: -15rem;
    color: #FFF;
    background-color: #d2903a
}

#about7 .row .col-md-6:first-of-type {
    padding: 4rem 3rem
}

#about7 .row .title {
    position: relative;
    margin: 0;
    font-size: 2.4rem;
    line-height: 100%;
    font-weight: bold
}

#about7 .row .title small {
    font-size: 1.6rem
}

#about7 .row .title::before {
    content: "";
    display: inline-block;
    top: 5px;
    position: relative;
    margin-right: 2rem;
    width: .5rem;
    height: 2.2rem;
    background-color: #FFF
}

#about7 .row .media {
    margin-top: 4rem;
    padding: 3rem 0;
    border-bottom: 1px solid rgba(255,255,255,0.4)
}

#about7 .row .media .media-body {
    font-size: 1.4rem;
    line-height: 170%
}

@media(max-width: 768px) {
    #about-4 .bg-ce8 {
        padding:1rem 2rem;
        font-size: 1.4rem
    }
}

.page-header {
    margin-bottom: 15px;
    border-bottom: 1px solid #CCC
}

.alert-download .box {
    height: 95px
}
