/*-----------------------------------------------------------------------------------

    Template Name: Driveon - Driving School HTML Template
    Template URI: http://hastech.company/
    Description: Bootstrap HTML Template
    Author: Hastech
    Author URI: http://hastech.company/
    Version: 1.0

-----------------------------------------------------------------------------------

    CSS INDEX
    ===================

    1.   Page Banner Title Area
    2.   Feature Area
	3.   Course Area
	4.   Video Area
	5.   Instructor Area
	6.   FAQ Area
	7.   Call To Action Area
	8.   Contact Area
	9.   Dark Version Style


-----------------------------------------------------------------------------------*/
/*--------------------------
	1. Page Banner Title Area
--------------------------*/
*{  font-family: "微软雅黑", "STHeiti", "WenQuanYi Micro Hei", SimSun, sans-serif;  }
/*.page-banner-area {*/
    
    /*background-repeat: no-repeat;*/
    /*background-position: center center;*/
    /*-webkit-background-size: cover ;*/
    /*background-size: cover ;*/
    /*padding: 270px 0 150px;*/
/*}*/
.page-banner{}
.page-banner h1 {
    color: #fff;
    display: block;
    font-size: 36px;
    font-weight: 900;
    line-height: 30px;
    margin-bottom: 0;
    text-transform: uppercase;
}
.page-banner.text-left h1 {
    float: left;
}
.page-banner.text-right h1 {
    float: right;
}
.page-banner ul {
    display: inline-block;
    vertical-align: top;
    margin-top: 10px;
}
.page-banner.text-left ul {
    float: right;
}
.page-banner.text-right ul {
    float: left;
}
.page-banner ul li {
    display: block;
    float: left;
    padding: 0 6px;
    position: relative;
}
.page-banner ul li:first-child {
    padding-left: 0;
}
.page-banner ul li:last-child {
    padding-right: 0;
}
.page-banner ul li + li::before {
    color: #fff;
    content: "/";
    display: block;
    left: -3px;
    line-height: 9px;
    overflow: hidden;
    position: absolute;
    top: 0;
}
.page-banner ul li a, .page-banner ul li span {
    color: #fff;
    display: block;
    font-size: 12px;
    line-height: 9px;
    text-transform: uppercase;
}
.page-banner ul li a:hover {
    color: #dec839;
}
/*--------------------------
	2. Feature Area
--------------------------*/
.feature-wrapper {}
.feature-left{}
.feature-right{}
/* Feature Image */
.feature-image {
    z-index: 9;
}
/* Single Feature */
.single-feature {
    position: relative;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    z-index: 1;
}
.single-feature:nth-child(1) {
    padding:48px 0 30px;
}
.single-feature:nth-child(2) {
    padding: 38px 0;
}
.single-feature:nth-child(3) {
    padding: 16px 0 15px;
}
/* Single Feature Hover */
.single-feature:hover {
    background-color: #fff;
}
.single-feature::before {
    background-color: #fff;
    bottom: 0;
    content: "";
    opacity: 0;
    position: absolute;
    top: 0;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    width: 50%;
    z-index: -1;
}
.single-feature:hover::before {
    opacity: 1;
}
.feature-left .single-feature::before {
    left: 100%;
}
.feature-right .single-feature::before {
    Right: 100%;
}
/* Left Single Feature */
.feature-left .single-feature {
    margin-right: -7px;
}
.feature-left .single-feature:nth-child(2) {
    margin-left: -15px;
    padding-right: 24px;
}
/* Right Single Feature */
.feature-right .single-feature {
    margin-left: -7px;
}
.feature-right .single-feature:nth-child(2) {
    margin-right: -15px;
    padding-left: 24px;
}
/* Featue Icon */
.single-feature .icon {
    display: block;
    margin-top: 19px;
    min-width: 36px;
}
.feature-left .icon {
    float: right;
    margin-left: 29px;
    text-align: left;
}
.feature-right .icon {
    float: left;
    margin-right: 29px;
    text-align: right;
}
.single-feature .icon i {
    color: #dec839;
    font-size: 36px;
    display: block;
}
/* Feature Text */
.single-feature .text{}
.single-feature .text h4 {
    margin-bottom: 9px;
}
.single-feature .text p{}
/*--------------------------
	3. Course Area
--------------------------*/
.course-wrapper{}
.course-item {
    -webkit-background-size: cover ;
    background-size: cover ;
    overflow: hidden;
    padding: 100px 25px 100px;
    position: relative;
    transition: all 1s ease 0s;
    z-index: 1;
}
.course-item i {
    color: #dec839;
    display: inline-block;
    font-size: 48px;
    margin-bottom: 18px;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}
.course-item h4 {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 19px;
    padding-bottom: 19px;
    position: relative;
    text-transform: uppercase;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}
.course-item h4::before {
    background-color: #dec839;
    bottom: 0;
    content: "";
    height: 2px;
    left: 50%;
    margin-left: -25px;
    position: absolute;
    width: 50px;
}
.course-item p {
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}
/* Course Hover */
.course-item:hover {
    transform: rotate(360deg);
}
.course-item:hover i {
    color: #fff;
}
.course-item:hover h4 {
    color: #fff;
}
.course-item:hover h4::before {
    background-color: #fff;
}
.course-item:hover p {
    color: #fff;
}
/*--------------------------
	4. Video Area
--------------------------*/
.video-area {

    -webkit-background-size: cover;
    background-size: cover;
    padding: 80px 0;
}
.video-content {}
.video-content a {
    color: #ffffff;
    display: inline-block;
}
.video-content a:hover {
    color: #dec839;
}
.video-content a i {
    display: block;
    font-size: 60px;
}
.video-content h3 {
    color: #fff;
    font-size: 20px;
    line-height: 18px;
    margin: 30px 0 0;
    text-transform: uppercase;
}
/*--------------------------
	5. Instructor Area
--------------------------*/
.instructor-details{}
.instructor-name {
    font-size: 18px;
    font-weight: bold;
    text-transform: uppercase;
}
.instructor-title {
    color: #333;
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 20px;
}
.instructor-details p {
    margin-bottom: 17px;
}
.instructor-social{}
.instructor-social a {
    border: 1px solid #aaaaaa;
    color: #aaaaaa;
    display: block;
    float: left;
    height: 35px;
    margin-right: 15px;
    text-align: center;
    width: 35px;
}
.instructor-social a i {
    display: block;
    font-size: 18px;
    line-height: 33px;
}
.instructor-social a:hover {
    background-color: #dec839;
    border-color: #dec839;
    color: #fff;
}
.instructor-image {
    margin-top: 74px;
}
.instructor-image img {
    width: 100%;
}
/* Instructor Tab List */
.instructor-tab-list {
    float: left;
    margin-top: -127px;
}
.instructor-tab-list li {
    display: block;
    float: left;
    margin-right: 30px;
    padding-bottom: 12px;
    width: 115px;
}
.instructor-tab-list li:last-child {
    margin-right: 0;
}
.instructor-tab-list li a {
    display: block;
    position: relative;
}
.instructor-tab-list li a::before {
    background-color: #000;
    bottom: 0;
    content: "";
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
}
.instructor-tab-list li a:hover::before, .instructor-tab-list li.active a::before {
    opacity: 0.5;
}
.instructor-tab-list li a::after {
    background-color: #dddddd;
    border-radius: 50%;
    bottom: -12px;
    content: "";
    height: 2px;
    left: 10px;
    opacity: 0;
    position: absolute;
    right: 10px;
}
.instructor-tab-list li a:hover::after, .instructor-tab-list li.active a::after {
    opacity: 1;
}
.instructor-tab-list li a img {
    width: 100%;
}
/*--------------------------
	6. FAQ Area
--------------------------*/
.faq-image {
    margin-top: 75px;
}
.faq-image img {
    width: 100%;
}
/*--------------------------
	7. Call To Action Area
--------------------------*/
.cta-area {
    background-color: #dec839;
}
.call-to-action{}
.call-to-action h3 {
    color: #fff;
    display: block;
    float: left;
    font-weight: 600;
    line-height: 36px;
    margin: 0;
    text-transform: uppercase;
}
/*.call-to-action a {*/
    /*float: right;*/
/*}*/
/*--------------------------
	8. Contact Area
--------------------------*/
#contact-map {
    height: 530px;
}
.contact-info{}
.contact-info .single-info{}
.contact-info .single-info + .single-info {
    margin-top: 38px;
}
.contact-info .single-info .icon {
    background-color: #dec839;
    border-radius: 2px;
    color: #fff;
    display: block;
    float: left;
    height: 44px;
    margin-left: 10px;
    margin-right: 40px;
    margin-top: 10px;
    text-align: center;
    transform: rotate(45deg);
    width: 44px;
}
.contact-info .single-info .icon i {
    display: block;
    font-size: 24px;
    line-height: 44px;
    transform: rotate(-45deg);
}
.contact-info .single-info .content{}
.contact-info .single-info .content h5 {
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 11px;
    text-transform: uppercase;
}
.contact-info .single-info .content p{}
.contact-info .single-info .content p a {
    display: block;
}
.contact-info .single-info .content p a:hover {
    color: #dec839;
}
/*--------------------------
	9. Dark Version Style
--------------------------*/
.dark-wrapper .bg-white, .dark-wrapper.bg-white {
    background-color: #1e2127;
}
.dark-wrapper .bg-gray, .dark-wrapper.bg-gray {
    background-color: #252830;
}
.dark-wrapper .overlay-white::before, .dark-wrapper.overlay-white::before {
    background-color: #000;
}
.dark-wrapper p, .dark-wrapper span {
    color: #d0d0d0;
}
.dark-wrapper h1, .dark-wrapper h2, .dark-wrapper h3, .dark-wrapper h4,  .dark-wrapper h5, .dark-wrapper h6, .dark-wrapper a {
    color: #fff;
}
.dark-wrapper .section-title::before, .dark-wrapper .section-title::after {
    background-color: #444;
}
/* Course Form */
.dark-wrapper .find-course-form h5 span {
    color: #555555;
}
/* Feature */
.dark-wrapper .single-feature:hover {
    background-color: #1e2127;
}
.dark-wrapper .single-feature::before {
    background-color: #1e2127;
}
/* Funfact */
.dark-wrapper .single-facts i {
    color: #d0d0d0;
}
.dark-wrapper .single-facts h1::before {
    background-color: #d0d0d0;
}

/* Gallery */
.dark-wrapper .gallery-filter button::before, .dark-wrapper .gallery-filter button::after {
    background-color: #d0d0d0;
}
.dark-wrapper .gallery-filter button {
    color: #d0d0d0;
}
/* Testimonial */
.dark-wrapper .ts-arrows {
    color: #fff;
}
/* FAQ */
.dark-wrapper .panel-group .panel {
    background-color: #252830;
}
/* Blog */
.dark-wrapper .blog-item .meta p {
    color: #d0d0d0;
}
.dark-wrapper .blog-item .title a {
    color: #fff;
}
.dark-wrapper .category-sidebar ul li a {
    color: #fff;
}
/* Contact */
.dark-wrapper .form .input input[type="text"], .dark-wrapper .form .input input[type="email"], .dark-wrapper .form .input input[type="tel"], .dark-wrapper .form .input input[type="password"], .dark-wrapper .form .input input[type="search"], .dark-wrapper .form .input input[type="url"], .dark-wrapper .form .input textarea {
    color: #fff;
}
/* Other */
.dark-wrapper .pagination ul li a {
    color: #d0d0d0;
}

/*huang-banner*/
.banner-panel {
    background: #0b1225 url(/webstatic/block/index_gxb_06.png) center center no-repeat;
    background-size: auto;
}
.banner-panel {
    position: relative;
}
.banner-panel .container {
    position: relative;
}
/*.container {*/
    /*min-width: 1170px;*/
/*}*/
/*@media (min-width: 1200px){*/
    /*.container {*/
        /*width: 1170px;*/
    /*}*/
/*}*/
/*@media (min-width: 992px){*/
    /*.container {*/
        /*width: 970px;*/
    /*}*/
/*}*/
/*@media (min-width: 768px){*/
        /*.container {*/
            /*width: 750px;*/
        /*}*/
        /*.container {*/
            /*margin-right: auto;*/
            /*margin-left: auto;*/
        /*}*/
/*}*/

#particles-js {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9;
}

.banner-text {
    position: absolute;
    top: 225px;
    left: 580px;
    z-index: 99;
}
.banner-panel .container button {
    margin: 10px 0 20px 10px;
    padding: 20px 50px;
    color: #fff;
    font-size: 30px;
    background: #1d8fcb;
    border: none;
    border-radius: 8px;
}

.banner-panel .container p {
    margin-left: 30px;
    color: #999;
    font-size: 18px;
}
/*.hidden-xs,.sticky{ background-color:rgba(0,0,0,0.7)}*/

.h-header-top p span{color: #b8bfcc; }
/*.navbar-header{}*/
.main-menu nav ul li {
    padding: 16px 0!important;
}

.funfact-area .container .single-facts img{margin-bottom:2rem;}
.funfact-area .container .single-facts span{color: #fff; line-height: 2rem; }
.funfact-area .container .single-facts h3{color: #fff; margin-bottom: 2rem;}
.funfact-area .container .single-facts{ padding-left:2rem; padding-right: 2rem; }

/*解决方案*/
.course-area .course-wrapper .h-Immediately{ background-color: #fff; border: 1px #999999 dashed; margin-top: 3rem;}
.course-area .course-wrapper .h-Immediately h3{ text-align: center; margin-top:0.8rem; margin-bottom:0.8rem; color: #dec839;font-weight: bold;}
.h-overlay .container h3 span{font-size: 2.4rem; color: #dec839; }
.h-overlay .container h3 { line-height: 4rem; }
.h-overlay .container .h-custom-made span{ padding: 0.8rem 2rem; background-color: #dec839;color: #fff; font-size: 2rem; }
.h-overlay .container .h-custom-made{margin-top: 3rem;}
.h-overlay .container .h-experience{ margin-top: 5rem;}
.h-overlay .container .h-experience p{line-height: 6rem;font-size: 2.2rem;color: #fff; }

.cta-area .container .h-transparent{float: right;color: #fff;}
.cta-area .container .h-transparent a{line-height: 36px;}
.h-nav ul{margin-left:35%; margin-bottom:3rem; color:#e5e5e5;}

.h-single-facts{ margin-bottom: 3rem; margin-top: 2rem;}

.h-nav li{float: left;color: #fff;}
.h-foont-img{ margin: 0 auto;}
.h-foont{ width: 100%;}
.footer-area .h-foont .h-foont-img{ width: 20%; margin: 0 auto;}
.h-foont .h-foont-img img{width: 100%; margin-bottom: 2em;}
.h_right{ display: none;}
.padding-left2 p{ text-indent: 2em; text-align: justify;}
#contact-area .content p{ margin-bottom: 4px; float: left;}
#contact-area .content h4{ float: left;font-size: 14px; line-height: 24px;  font-weight:bold;}
.contact-info .single-info{min-height: 62px;}
.contact-info .zixun1{margin-top: 10px;}
.line-box{
    width: 120px;
    height: 30px;
    cursor: pointer;
    text-align: center;
    color: #fff;
}
.j-left{display: none;}
.h-contact-info{display: block;}




@media (min-width: 1121px){
    .banner-text {
        top: 245px;
        left: 580px;}
    #home .banner-panel{height: 523px; overflow: hidden;}
    .h-nav ul{margin-left: 32%;}
}


@media (min-width: 768px) {

    #home .banner-panel{ height: 523px;overflow: hidden;}
    /*.course-item {*/
         /*padding: 3rem 3rem!important;*/
    /*}*/
}
@media (max-width: 767px){
    .call-to-action a{ float: none!important;}
    .call-to-action h3{ margin-bottom: 1rem;}
    .h-nav {display: none; }

    .jiang {
        width: 80% !important;
        margin: 0 auto;
        margin-top: 100px!important;
        z-index: 99;
    }
    .banner-text{left: 3rem;top:260px; text-align: center}
    #home .banner-panel{height: 500px; overflow: hidden;}

    .container {
    width: auto!important;
    }
    .h-Immediately{ display:none;}
    .h-single-facts {  margin-bottom: 1rem;  margin-top: 1rem;  }
    .h-footer-area{padding-bottom: 6rem!important; padding-top: 30px;}

    .gallery-filter button {  margin: 0 8px;}
    .contact-info .single-info .icon {  height: 26px;  margin-left: 6px;  margin-right: 0;  width: 26px;
    }
    .h-contact-info{ padding: 0;}
    .contact-info .single-info .icon i {  font-size: 18px;  line-height: 26px;  }
    .pt-90{padding-top: 30px;}
    .pb-90,.pb-80{padding-bottom: 30px;}
    .pb-60 {  padding-bottom: 40px;  }
    .h-overlay .container .h-experience p{ font-size: 1.8rem;}
    .video-area {  padding:50px 0!important; }
    .banner-panel .container button {  padding: 10px 24px;  color: #fff;  font-size: 16px;  border-radius: 4px; margin-bottom: 5px }
    .banner-panel .container p {  margin-left: 10px;  color: #999;  font-size: 14px;  }
    .h-funfact-area img {  max-width: 30%;  }
    .h4{font-size: 16px;}
    .section-title h3{  font-size: 22px!important;  }
 .h-overlay .container h3 {  font-size: 18px!important;  }
.navbar-header{ width: 50%;float: left;}
    .navbar-header img{width: 100%;}
    .h_right{width: 45%!important; float: right; display: block;margin-top: 10px; margin-bottom: 10px;margin-left: 5%; }
    .h_right img{width: 100%; display: block;}
    .feature-left .icon {
        float:left;
        margin-right: 29px;
        text-align: right;
        margin-left: 0;
    }
    .text-right{
        text-align: left;
    }
    .feature-left  .icon {
        display: block;
        margin-top: 19px;
        min-width: 36px;
    }
   #about2 .about-text{margin-left:0!important;}
    #about2 .htex1{ display: none;}
    #contact-area .content span{ font-weight: bold;}
    #contact-area .content h4{ width:28%; text-align: right;}
    #contact-area .content p { width: 72%;  }
    .cta-area{ display: none;}
    #about2 .img-responsive {  width: 100%!important;  }
    .mb-45 {
        margin-bottom: 30px!important;
    }
    #contact-area .contact-form{ padding-left: 0; padding-right: 0; margin-top: 20px; background-color: #fff;}
    .banner-text {  width: 80%;  }
    .banner-text img {  width: 100%;  }
    .footer-area .h-foont .h-foont-img{ width: 40%; margin: 0 auto;}
    .h-foont .h-foont-img img{margin-bottom: 10px;}
    .j-left{display: block;}
    .h-contact-info{display: none;}
     .j-tit {
        border-bottom: 1px #e3e3e3 solid;
        border-bottom-width: 1px;
        border-bottom-style: solid;
        border-bottom-color: rgb(227, 227, 227);
        line-height: 2.4em;
        position: relative;
    }
    .j-left p {
        font-size: 20px;
        color: #0a6dee;
    }

    .j-left .hline {
        width: 3em;
        height: 0.2em;
        background-color: #0a6dee;
        position: absolute;
        bottom: 0;
        left: 0;
    }
    .j-conp {
        margin-top: 1em;
    }

    .j-left .j-p span {
        font-weight: bold;
        width: 66px;
        padding-right: 8px;
        display: inline-block;
        margin-right: 8px;
        color: #333;
    }
    .j-left .j-p {
        font-size: 14px;
        margin-bottom: 0.6em;
    }
    #contact-area .container-area{ padding-left: 0; padding-right: 0; padding-bottom: 0;}
    .j-left{ padding-left: 15px; padding-right: 15px;}
    #contact-area .contact-form{ padding-top: 30px; padding-bottom: 20px;}
    #contact-area  .form .input {  margin-bottom: 20px;  }
    .footer-bottom {
        padding-bottom: 10px;
        padding-top: 10px;
    }
   /* .jiang{ display: none;}*/

}
@media (max-width: 991px) {
    .feature-left .icon {
        float:left;
        margin-right: 29px;
        text-align: right;
        margin-left: 0;
    }
    .text-right{
        text-align: left;
    }
    .feature-left  .icon {
        display: block;
        margin-top: 19px;
        min-width: 36px;
    }
}

@media only screen and (max-width: 767px) and (min-width: 480px){
    .single-facts{width: 100%!important;}
    .h-Immediately{ display:none;}
    #gallery-area .h-experience p{ font-size: 2rem;}
    .gallery-filter button{ margin: 0 12px;}
    .h-nav ul{margin-left:10%; }
    .copyright a{display:block;}
    .container{ margin-top: -2rem; margin-bottom: -2rem; padding-left: 0;padding-right: 0;}
    .h-container{ margin: auto!important; }
    .banner-text{left: 12rem!important; top: 7rem;}
    #home .banner-panel{ height: 600px;}
    /*.h-foont-img img{ margin-left: 20%!important;}*/


}


@media only screen and (max-width: 1120px) and (min-width: 768px) {
    .banner-text {
        top: 100px;
        left: 50%;}
    #home .banner-panel{height:600px; overflow: hidden;}
    .h-nav ul{margin-left:30%;  }
    .banner-panel .jiang{ width: 50%; margin-top: 100px;margin-left: -5%;}
}
#about2 p {
    margin-top: 20px;
    margin-bottom: 30px;
}
#about2 .about-text {
    margin-left: 10px;
    margin-top: 20px;
}
#about2 {
    background-size: cover;
}
#about2 H4 {
    color: #333;
    font-weight: 700;
}
#about2 .img-responsive {
    width: 90%;
    margin: 0 auto;
}

/*.container {*/
    /*width: auto!important;*/
/*}*/


/*最新头部*/
.navbar-brand1 img{ height: 52px;}
 .navbar-header.navbar-header1 {
    margin-bottom: 22px;
    margin-top: 0;
}
 /*.stick{ padding-top: 20px;}*/

@media (max-width: 767px){
    .navbar-header.navbar-header1{ width: 65%; margin-left: 4%;margin-bottom: 20px; margin-top: 20px; }
    .navbar-header1 img {
        width: 100%; height: auto;
    }
    .stick{ padding-top:0;}
}

/*banner奖牌*/
.jiang{ width: 50%; margin-top: 280px; }
.jiang img{width: 100%;}


/*新版*/
#main-menu > nav > ul {
    list-style: none;
    display: flex;

}
#main-menu > nav > ul > li {
    text-align: center;
    flex: 1;
}
.main-menu nav > ul > li > a{
    font-size: 18px;
    color: #666;
}
.main-menu nav > ul > li > a:hover{
    color: #35a5f3;
    text-decoration: none;
}
.main-menu nav > ul > li > a::before{
    width: 0;
    height: 0;
}
.main-menu nav > ul > li:hover > a::after{
    width: 100%;
    bottom: -10px;

}
.main-menu nav > ul > li > a::after {
    background-color: #fff;
    content: "";
    height: 2px;
    opacity: 0;
    position: absolute;
    width: 100%;
    border-radius: 0 !important;
}
.main-menu nav > ul > li.active > a::before, .main-menu nav > ul > li.active > a::after {

    width: 100%;
    bottom: -10px;
}

.header-top-wrapper {
    padding: 30px 0 4px;
    position: relative;
}
.header-top-right p span{
    font-size: 14px;
}
.header-bottom{
    -webkit-transition: all .3s;
    transition: all .3s;
}
@media (max-width: 1169px) and (min-width: 992px){
    .header-absolute {
        background: none !important;
        position: absolute !important;
    }
}
@media (max-width: 991px) and (min-width: 768px){
    .header-absolute {
        background: none !important;
        position: absolute !important;
    }
}
@media (max-width: 767px){
    .header-absolute {
        background: none !important;


    }
    .header-bottom{
        width: 100%;
        position: fixed;
        left: 0;
        right: 0;
    }
    .wrapper {
        position: absolute !important;
        z-index: 999;
    }

}


/*l-style*/
/*html {*/
    /*font-size: 625%;*/
/*}*/

/*@media screen and (max-width: 383px) and (min-width: 375px) and (orientation: portrait){*/
    /*html {*/
        /*font-size: 73.24%;*/
    /*}*/
/*}*/




/*区块链方案*/
.program{
    background: #fafafa;
}

.block-top{
    margin-top: 30px;
    margin-bottom: 50px;
}

.top-title{
    font-size: 30px;
    text-align: center;
    font-weight: 700;
    line-height: 80px;
}

.top-border{
    width: 270px;
    height: 2px;
    position: relative;
    margin: 0px auto;
    background: #d2d2d2;
}

.top-cont{
    color: #a8a8a8;
    font-size: 16px;
    padding-top: 10px;
    text-align: center;
    line-height: 20px;
}

.mode-item-box{
    margin-bottom: 50px;
}

.mode-item {
    float: left;
    position: relative;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.2);
    -webkit-transition: all .3s;
    transition: all .3s;
}
.mode-item:hover{
    margin-top: -10px;
}
.line {
    height: 2px;
    width: 36px;
    background: linear-gradient(to right, rgba(56, 176, 252, 1) 0%,rgba(57, 177, 161, 1) 100%);
    margin: 25px auto;
    float: none !important;
}

.mode-item-text {
    height: 140px;
    padding: 0 15px 15px 15px;
}

.mode-item-title {
    font-size: 18px;
    margin-bottom: 15px;
    text-align: center;
}

.mode-item-decs {
    font-size: 14px;
    color: #999;
    line-height: 24px;
}

/*end*/

/*配套解决方案*/
.solution{
    background: url(/webstatic/block/dapp_solve.png) no-repeat center;
    padding: 0px 0 40px;
}

.advan-item {
    float: left;
    width: 100%;
    height: 300px;
    padding: 50px 30px;
    text-align: center;
    box-shadow: 0 5px 20px 0 rgba(0,0,0,0.07);
    border-radius: 4px;
    background: #fff;
    margin: 0 18px 32px;
    -webkit-transition: all .3s;
    transition: all .3s;
}
.advan-item:hover{
    transform:scale(1.1);
    -webkit-transform:scale(1.1);
    -moz-transform:scale(1.1);
    -o-transform:scale(1.1);
    -ms-transform:scale(1.1);


}
.advan-title {
    font-size: 20px;
    line-height: 54px;
    font-weight: bold;
    color: #2a3e57;
    margin: 5px 0;
}

.advan-decs {
    font-size: 14px;
    line-height: 24px;
    color: #999;
    text-align: center;
    position: relative;
    /*width: 80%;*/
    /*margin: 0 auto;*/
}

/*.advan-decs::before {
    display: block;
    content: '';
    position: absolute;
    left: -10px;
    top: 10px;
    width: 5px;
    height: 5px;
    border-radius: 3px;
    background: #8c99f5;
}*/

.cor-white .top-title,.cor-white .top-cont{
    color: #fff;
}

.cor-white .top-border{
    background: #fff;
}

/*end*/

/*区块链应用*/
.conKN {
    margin-top: 50px;
    margin-bottom: 50px;
}
.new_item{
    height:350px;
    box-sizing: border-box;
    background:#FFFFFF;
}
.new_body{
    height:240px;
}
.new_body .nei_list_s{
    text-align: center;
}
.body_item{
    height:40px;
    color:#666666;
    font-size:14px;
    line-height: 40px;
    display: block;
    border-bottom: 1px dashed #888888;
    padding:0 5px;
}
.body_left{
    width:177px;
    float: left;
}
.body_left_{
    width:175px;
    float: left;
}
.body_left_ a:hover{
    text-decoration: underline !important;
    color:#298EE8;
}
.body_left a:hover{
    text-decoration: underline;
    color:#298EE8;
}
.body_right{
    width:75px;
    float: left; 
    font-size:14px;
    text-align: right;
}
.new_title{
    margin: 0;
    padding: 10px;
    text-align: center;
    font-size: 24px;
    color: #2983e6;
    background: rgba(42, 131, 230, 0.07);
    border-top: 1px dashed #c4d3e2;
    border-bottom: 1px dashed #c4d3e2;
    margin: 20px 0 5px 0;
}
a.conKHa {
    width: 265px;
    display: block;
    color: #000;
    text-decoration: none;
}

.conKpic{
    width: 265px;
    height: 138px;
    overflow: hidden;
}

.conKpic img, .Bchainpic img {
    width: 100%;
    transition: 0.5s;
}

.appliA {
    box-shadow: 0 3px 10px #ccc;
}

.fl {
    float: left;
}

.appliN {
    background: #f9f9f9;
    padding: 15px 20px;
    height: 210px;
    width: 265px;
}

.appliNt {
    /*color: #3c4295;*/
        /*background-image: -webkit-gradient(linear, left center, right center, from(rgba(56, 176, 252, 1)), to(rgba(57, 177, 161, 1)));*/
    background-image: -webkit-gradient(linear, left center, right center, from(rgba(33, 135, 247, 1)), to(rgba(57, 135, 247, 1)));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 18px;
    line-height: 40px;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: center;
}

.appliNr {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 6;
    overflow: hidden;
    font-size: 14px;
    color: #181818;
    line-height: 25px;
    text-align: justify;
}

a.conKHa:hover img, a.BchainA:hover img {
    -ms-transform: scale(1.05);
    -moz-transform: scale(1.05);
    -webkit-transform: scale(1.05);
    -o-transform: scale(1.05);
    transform: scale(1.05);
    transition: 0.5s;
}

@media (min-width: 768px) {
    .top-cont{
        width: 740px;
        margin-left: auto;
        margin-right: auto;
    }
}
/*end*/

/*底部banner图*/
.bottom-banner {
    height: 268px;
    text-align: center;
    color: #fff;
    padding-top: 50px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.bottom-text {
    font-size: 34px;
    line-height: 84px;
}

.bottom-btn {
    background: #dfc726;
    width: 294px;
    height: 54px;
    border-radius: 27px;
    display: block;
    margin: 0 auto;
    line-height: 54px;
    color: #fff;
    font-size: 24px;
}
/*end*/

/*独立钱包*/
.wallet{
    padding-bottom: 30px;
}

.feature-item {
    width: 255px;
    height: 226px;
    float: left;
    margin: 0 15px 30px;
    padding-top: 88px;
    text-align: center;
    -webkit-transition: all .3s;
    transition: all .3s;
}
.feature-item:hover{
    transform:scale(1.05);
    -webkit-transform:scale(1.05);
    -moz-transform:scale(1.05);
    -o-transform:scale(1.05);
    -ms-transform:scale(1.05);
}
.fea-item-title {
    line-height: 40px;
    font-size: 24px;
    color: #fff;
}

.fea-item-decs {
    font-size: 16px;
    line-height: 26px;
    color: #fff;
}

.feature1 {
}

.feature2 {

}

.feature3 {
}
.feature4 {
}
/*end*/

/*我们的优势*/
.advantage{
    width: 100%;
    height: 700px;
}

.advantage .shadow-box {
    position: relative;
    width: 1200px;
    margin: 0 auto;
}

.advantage .info-group {
    width: 1200px;
    position: absolute;
    top: 5px;
    left: 0;
}

.advantage .info-item {
    width: 255px;
    height: 226px;
    margin: 0 15px 70px;
    text-align: center;
    float: left;
    position: relative;
    background: #fff;
    border-radius: 5px;
    padding-top: 60px;
    -moz-box-shadow: 0 5px 12px rgba(0,0,0,.1);
    box-shadow: 0 5px 12px rgba(0,0,0,.1);
    -webkit-transition: all .3s;
    transition: all .3s;
    top: 0;
}
.advantage .info-item:hover{
    top: -10px;
    -webkit-transition: all .3s;
    transition: all .3s;
}
.advantage .item-center {
    margin: 0 30px;
}

.advantage .info-item .icon-box {
    position: absolute;
    left: 50%;
    margin-left: -58px;
    top: -60px;
    width: 117px;
    height: 117px;
    background: url(/webstatic/block/column2-icons.png) no-repeat;
    background-position: 0 0;
}

.advantage .info-item .icon-box1 {
    background-position: 0 0;
}

.advantage .info-item .icon-box2 {
    background-position: -117px 0;
}

.advantage .info-item .icon-box3 {
    background-position: -234px 0;
}

.advantage .info-item .icon-box4 {
    background-position: -351px 0;
}

.advantage .info-item .icon-box5 {
    background-position: 0 -117px;
}

.advantage .info-item .icon-box6 {
    background-position: -117px -117px;
}

.advantage .info-item .icon-box7 {
    background-position: -234px -117px;
}

.advantage .info-item .icon-box8 {
    background-position: -351px -117px;
}

.advantage .info-group.t2{
    top: 350px;
}

.advantage .info-item .info-point {
    font-size: 22px;
    color: #5b6173;
    text-align: center;
}

.advantage .info-item .info-desc {
    font-size: 15px;
    color: #999;
    margin-top: 12px;
    padding: 0 30px;
    line-height: 24px;
}
/*end*/

/*关于我们*/
.about{
    margin-top: 80px;
    margin-bottom: 50px;
}

.ConaboutP {
    width: 601px;
    height: 274px;
    border: 8px solid #e5e5e5;
    float: right;
    margin-left: 50px;
}

.ConaboutP img {
    width: 100%;
}

.ConaboutN {
    width: 489px;
    float: right;
}

.ConaboutNt {
    color: #484848;
}

.ConaboutNt span {
    padding-bottom: 15px;
    font-size: 28px;
    font-weight: 800;
    border-bottom: 1px solid #e7e7e7;
    display: inline-block;
}

.ConaboutNr {
    color: #838383;
    font-size: 14px;
    text-align: justify;
    line-height: 25px;
    padding-top: 15px;
}
/*end*/

.padg {
    margin-top: 30px !important;
    margin-bottom: 10px;
}

/*成功案例*/
.case{
    /*background: #fafafa;*/
    padding-bottom: 0px;
}

.images-box {
    margin-top: 25px;
}

.images-item {
    float: left;
    margin-right: 25px;
    text-align: center;
}

.example-image-link {
    display: block;
    width: 260px;
    /*height: 260px;*/
    overflow: hidden;
    position: relative;
    margin-bottom: 15px;
    /*box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.2);*/
    border-radius: 2px;
    -webkit-transition: all .3s;
    transition: all .3s;
}
.example-image-link:hover{
    margin-top: -10px;
    /*box-shadow: 0px 20px 30px 0px rgba(0, 0, 0, 0.2);*/
}
.example-image {
    /*height: 100%;*/
    width: auto;
    max-width: 100%;
}

.images-item p {
    text-align: center;
    font-size: 18px;
    line-height: 26px;
    color: #5a6b99;
}
/*end*/

/*手机版调整*/
@media (max-width: 720px){
    .mode-item-text {
        padding: 5%;
        height: 13rem;
    }
    .mode-item-title {
        font-size: 1.6rem;
        line-height: 2rem;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        text-align: center;
        margin-bottom: 0.5rem;
    }
    .mode-item-decs {
        font-size: 1rem;
        color: #6c6c6c;
        text-align: center;
        line-height: 1.7rem;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 5;
        overflow: hidden;
    }
    .line{
        margin: 1rem auto 0 auto;
    }
    .block-top{
        margin-bottom: 2rem;
        margin-top: 2rem;
    }
    .mode-item{
        margin: 0;
        padding: 0;
        width: 100%;
    }
    .advan-title{
        font-size: 1.4rem;
    }
    .advan-decs{
        font-size: 1rem;
        width: 80%;
        margin: 0 auto;
        line-height: 1.8rem;
        margin-bottom: 1rem;
    }
    .advan-item{
        height: 21rem;
        margin: 0;
        padding: 0;
        margin-bottom: 2rem;
    }
    .solution{
        background: #5f4877;
    }
    .advan-title{
        line-height: 2rem;
        margin-top: 1rem;
    }
    .advan-img{
        margin-top: 1.5rem;
    }
    a.conKHa,.conKpic,.appliN{
        width: 100%;
    }
    .conKpic{
        height: auto;
    }
    .appliN{
        padding: 1.2rem 1rem;
    }
    .appliNt{
        font-size: 1.4rem;
        text-align: left;
    }
    .appliNr{
        font-size: 1.2rem;
        line-height: 1.6rem;
        -webkit-line-clamp: 7;
    }
    .pad0{
        padding: 0;
    }
    .padg{
        width: 48%;
        padding: 0;
        padding-left: 4%;
        margin-bottom: 1.5rem;
    }
    .bottom-banner{
        padding-top: 2rem;
        padding-bottom: 2rem;
        height: auto;
    }
    .bottom-text{
        font-size: 2rem;
        line-height: 4rem;
    }
    .bottom-btn{
        width: 12rem;
        height: 3rem;
        line-height: 3rem;
        font-size: 1.6rem;
        margin-top: 1rem;
    }
    .wallet .top-cont{
        width: 90%;
        margin: 0 auto;
    }
    .feature-item{
        width: 100%;
        margin: 0;
        height: auto;
    }
    .fea-item-title{
        font-size: 1.4rem;
        line-height: 2.6rem;
    }
    .fea-item-decs{
        font-size: 1rem;
        margin-bottom: 1rem;
    }
    .advantage .shadow-box,.advantage .info-group{
        width: 100%;
    }
    .advantage .info-item{
        width: 100%;
        height: 17rem;
        margin: 0 0 5rem;
    }
    .advantage .info-item .info-point{
        font-size: 1.6rem;
    }
    .advantage .info-item .info-desc{
        padding: 0 1.2rem;
        line-height: 1.6rem;
        font-size: 1rem;
        margin-top: 1rem;
    }
    .advantage{
        height: auto;
        background: #6680DD;
        padding-bottom: 0.2rem;
    }
    .advantage .info-group{
        position: inherit;
    }
    .Conabout {
        margin-top: 0.2rem;
        width: 100%;
        padding: 0;
    }
    .ConaboutP {
        width: 100%;
        background: #e5e5e5;
        margin-left: 0;
        height: auto;
    }
    .ConaboutN{
        width: 100%;
    }
    .ConaboutNt span {
        margin-top: 1.8rem;
        padding-bottom: 1rem;
        font-size: 1.5rem;
        font-weight: 800;
        border-bottom: 1px solid #e7e7e7;
    }
    .ConaboutNr {
        color: #838383;
        font-size: 1.2rem;
        text-align: justify;
        line-height: 1.8rem;
        padding-top: 1rem;
        padding-bottom: 1rem;
    }
    .about{
        margin-top: 0.1rem;
        margin-bottom: 0.2rem;
    }
    .images-item{
        margin-right: 0;
    }
    .example-image-link{
        width: 100%;
    }
    .images-item p{
        font-size: 1.4rem;
        line-height: 1.8rem;
    }
}


/*end*/

