.top_banner img {
    width: 100%;
    height: auto;

}

.menu {
    width: 100%;
    height: .5rem;
    background: #F81C25;
}

.menu_info {
    margin: 0 auto;
    justify-content: center;
    width: 100%;
}

.Project_area {
    background: url(dangjian100-left_left.png) left 4rem no-repeat,
        url(dangjian100-left_right.png) right 4rem no-repeat, url(dangjian100-bottom.png) left bottom no-repeat;
}

.menu_info li a {
    font-size: .18rem;
    font-family: MicrosoftYaHei;
    font-weight: 400;
    color: #FFFFFF;
    line-height: .32rem;
    width: 100px;
    display: block;
    text-align: center;
    margin: 0 .3rem;

}

.Project_area {
    padding-top: .7rem;
}

.area_title {
    margin: 0 auto;
    width: 4.14rem;
    height: auto;
    display: block;
}

.spirit_main {
    margin-top: .28rem;
}

.spirit_left {
    width: 5.1rem;
    margin-right: .5rem;
    flex-shrink: 0;
}

.spirit_left img {
    width: 100%;
    height: 3.4rem;
}

.spirit_right {
    flex: 1;
}

.spirit_info>li {
    border-bottom: 1px solid #eee;
    padding: .05rem 0;
}

.xi_title img {
    display: inline-block;
    vertical-align: middle;
    margin-right: .1rem;
    width: .13rem;
    height: .13rem;
}

.xi_title {
    font-size: .18rem;
    font-family: MicrosoftYaHei;
    font-weight: 400;
    color: #333333;
    line-height: .32rem;

}

.xi_intro {
    font-size: .14rem;
    font-family: MicrosoftYaHei;
    font-weight: 400;
    color: #666666;
    line-height: .22rem;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-indent: 2em;
}

.story {
    padding-top: .8rem;
}

.story_main {
    padding-top: .5rem;
}

.story_left {
    max-width: 5.8rem;
    flex-shrink: 0;
    margin-right: .6rem;
}

.story_title {
    font-size: .2rem;
    font-family: MicrosoftYaHei;
    font-weight: 400;
    color: #333333;
    line-height: .32rem;
}

.story_p {
    font-size: .16rem;
    font-family: MicrosoftYaHei;
    font-weight: 400;
    color: #666666;
    line-height: .32rem;
}

.story_a {
    display: block;
    width: 1.5rem;
    height: .32rem;
    line-height: .32rem;
    text-align: center;
    font-size: .16rem;
    color: #fff;
    background: #F81C25;
    margin-top: .2rem;
}

.state {
    padding-top: 1.1rem;
}

.state_info {
    flex-wrap: wrap;
    width: 100%;
    padding-top: .6rem;
}

.state_info>li {
    background: #FFF7ED;
    padding: .1rem .1rem .03rem .24rem;
    width: 5.5rem;
    box-sizing: border-box;
    margin-bottom: .3rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.state_left {
    margin-right: .5rem;
}

.state_info li>a>img {
    display: inline-block;
    vertical-align: middle;
    margin-right: .15rem;
    width: .26rem;
    height: auto;
}

.state_info li a {
    font-size: .16rem;
    font-family: MicrosoftYaHei;
    font-weight: 400;
    color: #333333;
    line-height: .32rem;
}

.Action {
    padding-top: .6rem;
}

.Action_main {
    padding-top: .39rem;
}

.work h5 {
    width: 1.8rem;
    height: .5rem;
    background: #F18D00;
    text-align: center;
    color: #fff;
    font-size: .2rem;
    font-family: MicrosoftYaHei;
    font-weight: 400;
    color: #FFFFFF;
    line-height: .5rem;
}

.work i {
    display: inline-block;
    width: .05rem;
    height: .48rem;
    background-color: #CA0915;
    margin-top: 2px;
}

.Action_left {
    width: 5.5rem;
    margin-right: .5rem;
    flex-shrink: 0;
}

.Action_info>li {
    padding: .2rem 0 .16rem;
    border-bottom: 1px solid #eee;
}

.Action_title img {
    display: inline-block;
    vertical-align: middle;
    width: .13rem;
    height: .13rem;
    margin-right: .1rem;
}

.Action_title {
    font-size: .18rem;
    font-family: MicrosoftYaHei;
    font-weight: 400;
    color: #333333;
    line-height: .32rem;
}

.Action_list {
    padding-top: .1rem;
}

.Action_img {
    width: .88rem;
    height: .66rem;
    margin-right: .2rem;
}

.Action_p {
    font-size: .14rem;
    font-family: MicrosoftYaHei;
    font-weight: 400;
    color: #666666;
    line-height: .22rem;
    text-indent: 2em;
}

.Action_right {

    flex: 1;
    background: url(dangjian100_40.png) no-repeat center;
    background-size: 100%;
    flex-shrink: 0;
}

.gnosis {
    padding-top: .6rem;
    padding-left: .16rem;
}

.gnosis h5 {
    padding: .3rem .15rem .48rem;
    width: .5rem;
    height: 1.8rem;
    box-sizing: border-box;
    background: #F18D00;
    font-size: .2rem;
    font-family: MicrosoftYaHei;
    font-weight: 400;
    color: #FFFFFF;
    line-height: .32rem;
}

.gnosis i {
    display: block;
    width: .48rem;
    height: .05rem;
    background: #CA0915;
    margin-left: 2px;
}

.gnosis_ul {
    padding-left: .5rem;
    padding-top: .6rem;
}

.gnosis_list img {
    display: inline-block;
    vertical-align: middle;
    margin-right: .1rem;
    width: .13rem;
    height: .13rem;
}

.gnosis_list {
    font-size: .16rem;
    font-family: MicrosoftYaHei;
    font-weight: 400;
    color: #333333;
    line-height: .32rem;
}

.gnosis_ul li {
    padding: .1rem 0;
    border-bottom: 1px solid #eee;
}

.video_zb {
    padding-top: .9rem;
}

.video_info {
    padding-top: .4rem;
    flex-wrap: wrap;

}

.video_info>li {
    width: 25%;



}

.video_info>li img {
    width: 2.72rem;
    height: 1.53rem;
    padding-bottom: .1rem;
}

.video_info>li a {
    display: block;
    padding: 0 .05rem;
}

.video_info>li p {
    font-size: .16rem;
    font-family: MicrosoftYaHei;
    font-weight: 400;
    color: #333333;
    line-height: .24rem;

}

.stone {
    padding: .8rem 0;
}

.stone_info {
    flex-wrap: wrap;
    padding-top: .4rem;
}

.stone_info li {
    border-bottom: 1px solid #eee;
    width: 5.5rem;
    flex-shrink: 0;
    padding: .1rem 0;
}

.stone_info li:nth-child(odd) {
    margin-right: .5rem;
}

.tone_list img {
    display: inline-block;
    width: .13rem;
    height: .13rem;
    margin-right: .1rem;
}

.tone_list {
    font-size: .16rem;
    font-family: MicrosoftYaHei;
    font-weight: 400;
    color: #333333;
    line-height: .32rem;

}

.footer {
    background: url(dangjian100_footer.png) repeat-x left top;
    height: .5rem;
    background-size: auto;
}

.footer_text p {
    color: #fff;
    font-size: .12rem;
    font-family: MicrosoftYaHei;
    font-weight: 400;
    color: #FFFFFF;
    padding-top: .05rem;
    text-align: center;
}
/* phone */
@media screen and (min-width:320px) and (max-width:767px) {

    .menu_info li a{
         width: auto;
           margin: 0 .1rem;
    }
    .spirit_main{  display: block;}
    .spirit_left{ padding: .3rem; width: 100%; margin: 0;}
    .spirit_right{   padding: 0 .3rem;}
    .xi_intro{  line-height: normal;}
    .story_main{ display: block;}
    .story_left{ width: 100%;
     max-width: none;
       padding: .3rem
    }
    .story_right{ padding:0 0.3rem ;}
    .state_main{ display: block; padding:0 .3rem;}
    .state_left{ margin-right: 0;}
    .state_info>li{ width: 100%;}
    .state_info{ padding-top: 0;}
    .Action_main{ display: block;  padding: .3rem;}
    .Action_left{ width: 100%; margin-right: 0;

     }
     .Action_img{ width: 1.76rem; height: 1.32rem;}
     .Action_p{ line-height:normal; height: 1.2rem;}
     .Action_right{
          margin-top: .3rem;
     }
     .gnosis_ul{ padding-left: .3rem; padding-top: .3rem;}
     .video_info{ padding: 0 .3rem;}
     .video_info>li{ width: 50%; margin-bottom: .3rem;}
     .video_info>li img{ display: block; margin: 0 auto; width: 100%;}
     .video_info>li p{ line-height: normal;}
     .stone_info{ padding: 0 .3rem;}
     .stone_info li{ width: 100%;}
     .footer{ height: auto; padding:0 .3rem;}
     .Project_area{ background-size: 100%; }
}

/*头部左侧图片切换 */

.spirit_left{ /*width:521px;*/ float:left; }

.spirit_left .slideBox{ /*width:521px; height:335px;*/ overflow:hidden; position:relative; border:0px solid #ddd;  }
.spirit_left .slideBox .hd{ height:8px; overflow:hidden; position:absolute; right:5px; bottom:18px; z-index:1; }
.spirit_left .slideBox .hd ul{ overflow:hidden; zoom:1; float:left;  }
.spirit_left .slideBox .hd ul li{ float:left; margin-right:5px;  line-height:14px; text-indent: -999999px; text-align:center; background: url(dangjian100_baidian.png) no-repeat; width: 8px; height: 8px; }
.spirit_left .slideBox .hd ul li.on{ background: url(dangjian100_hongdian.png) no-repeat;  color:#fff; }
.spirit_left .slideBox .bd{ position:relative; height:100%; z-index:0;   }
.spirit_left .slideBox .bd li{ zoom:1; vertical-align:middle; }
.spirit_left .slideBox .bd img{ /*width:570px; height:346px;*/ width:100%; height:100%; display:block;  }

.spirit_left .slideBox .title_touming{ background: url(dangjian100_touminghei.png); height: 50px; /*padding-top: 30px;*/ line-height: 50px; text-align: center; position: absolute; width: 100%; left: 0px; bottom: 0px; font-size: 18px; color: #fff;}

/* 下面是前/后按钮代码，如果不需要删除即可 */
.spirit_left .slideBox .prev,
.spirit_left .slideBox .next{ position:absolute; left:3%; top:50%; margin-top:-25px; display:block; width:32px; height:40px; background:url(dangjian100_slider-arrow.png) -110px 5px no-repeat; filter:alpha(opacity=50);opacity:0.5;   }
.spirit_left .slideBox .next{ left:auto; right:3%; background-position:8px 5px; }
.spirit_left .slideBox .prev:hover,
.spirit_left .slideBox .next:hover{ filter:alpha(opacity=100);opacity:1;  }
.spirit_left .slideBox .prevStop{ display:none;  }
.spirit_left .slideBox .nextStop{ display:none;  }