﻿.ratio-img{width: 100%;}

 /*font-size*/
.fnt_16 { font-size:16px;}
.fnt_18 { font-size:18px;}
.fnt_24 { font-size:24px;}
.fnt_40 { font-size:40px;}
.fnt_50 { font-size:50px;}
.fnt_72 { font-size:72px;}


@media only screen and (max-width:1660px) {
.fnt_24 { font-size:20px;}
.fnt_40 { font-size:32px;}
.fnt_50 { font-size:40px;}
.fnt_72 { font-size:50px;}
}
@media only screen and (max-width:1366px) {
.fnt_16 { font-size:14px;}
.fnt_18 { font-size:16px;}
.fnt_24 { font-size:18px;}
.fnt_40 { font-size:24px;}
.fnt_50 { font-size:32px;}
.fnt_72 { font-size:36px;}
}
@media only screen and (max-width:767px) {
.fnt_18 { font-size:14px;}
.fnt_24 { font-size:16px;}
.fnt_40 { font-size:18px;}
.fnt_50 { font-size:22px;}
.fnt_72 { font-size:28px;}

}

.n_block01{position: relative;}
.banner_text_n{color: #ff0000;width: 100%;
transform: translate(0,-50%); -webkit-transform: translate(0,-50%);-ms-transform: translate(0,-50%);-moz-transform: translate(0,-50%);-o-transform: translate(0,-50%); position:absolute; left:0; top:50%;
}
.banner_insert{display: inline-block;} 
.b_p01{border: 1px solid #ff0000;padding: 10px;}
.b_p01 h1{font-size: 72px;line-height: 82px;margin-bottom: 120px;}
.b_p01 p{line-height: 18px;font-weight: bold;font-family: "Arial";}
.b_p02{margin:30px 0;}
.n_title{text-align: center;margin-bottom: 50px;}
.n_edit{margin-bottom: 60px;}
.n_block02{padding: 90px 0;overflow: hidden;}
.n_case{padding-bottom: 90px;}
.n_case dl{text-align: center;}
.n_case dt{font-size:60px; line-height: 80px; font-family: "Arial";font-weight: bold;color: #ff0000;margin-bottom: 10px;}
.n_case dt em{font-size: 100px;}
.n_case dt span{font-weight: normal;}
.n_case ul{overflow: hidden;}
.n_case li{float: left;width: 25%;*margin-left: -1px;}

.n_picture{position: relative;max-width: 1167px;margin:auto;}
.n_picture .pic01{width: 100%;}
.n_picture .pic02{position: absolute;right: 0;bottom:0;width: 26.6%}



.n_block03{padding-bottom: 40px;overflow: hidden;}
.n_block03 .inspur-list{padding-top: 40px;}
.inspur-list ul{margin:0 -7px;}
.inspur-list li { float: left; width: 25%;*margin-left: -1px; text-align: center; position: relative; top: 0; -webkit-transition: all 0.5s; -o-transition: all 0.5s; -moz-transition: all 0.5s; transition: all 0.5s;margin-bottom: 50px; }
.inspur-list li .inspurbox{padding: 0 7px;}

.inspur-list li .insimg{width: 120px;height: 120px; margin: 0 auto; margin-bottom: 50px;}
.inspur-list li img { width: 120px;}

.inspur-list li h2 {text-align: center;margin-bottom: 35px;}

.inspur-line {
    width: 100%;
    height: 1px;
    background: #ff0000;
    position: relative;
    margin-bottom: 20px;
}

.inspur-line span {
    display: block;
    width: 13px;
    height: 8px;
    background: url("../images/red_arrow.png") no-repeat right center;
    position: absolute;
    top: 50%;
    left: 0;
    margin-top: -8px;
    -webkit-transition: all 0.5s;
    -o-transition: all 0.5s;
    -moz-transition: all 0.5s;
    transition: all 0.5s;
}

.inspur-line i {
    width: 100%;
    height: 1px;
    background: #ff0000;
    position: absolute;
    top: 50%;
    left: 0;
    margin-top: 3px;
}

.inspur-list li p {
    color: #595959;
    text-align: left;line-height: 26px;
   opacity: 0; -webkit-transition: all 0.5s; -o-transition: all 0.5s; -moz-transition: all 0.5s; transition: all 0.5s; 
}

.inspur-list li:nth-child(4n+1){clear: both;}


.n_block04{padding: 140px 0 80px 0;position: relative;color: #fff;overflow: hidden;}
.n_block04 .blank25{position: absolute;top:0;left: 0;width: 100%;height: 100%;background: rgba(0,0,0,0.25)}
.n_block04 .wrap{position: relative;z-index: 2;overflow: hidden;}
.n_block04 .left{width: 45%;float: left;}
.n_block04 .left h1{height: 104px; line-height: 104px;overflow: hidden;margin-bottom: 50px;}
.n_block04 .left h1 span{display: inline-block;padding-right: 60px;margin-right: 55px;border-right: 1px solid rgba(255,255,255,0.3);}
.n_block04 .left p{line-height: 30px;}

.n_btn{overflow: hidden;padding-top: 80px;}
.n_btn a{display: inline-block;width: 212px;line-height: 46px;box-sizing:border-box;text-align: center;color: #fff;border: 2px solid #fff;border-radius: 5px;float: left;margin-right: 20px;}
.n_btn .n_btn02{border: 2px solid #ff0000;background: #ff0000;}
.n_block04 .right{width: 36%;float: right;height: 568px;}
.n_block04 .right li{margin-bottom: 45px;}
.n_block04 .right li dd{margin-bottom: 40px;}
.n_block04 .right li p{line-height: 30px;}
.n_block04 .right li h1{line-height: 50px;}
.n_block04 .right li h1 span{margin-right: 20px;padding-right: 15px;border-right: 1px solid rgba(255,255,255,0.3);}

.n_block04 .right dt{height: 36px; line-height: 36px;cursor: pointer;margin-bottom: 15px;}
.n_block04 .right dd h1{margin-bottom: 10px;}
.n_block04 .right .inspur-line{margin: 0;    background:rgba(255,255,255,0.25);opacity: 0;visibility: hidden;}
.n_block04 .right .inspur-line i{height: 2px;}

.n_block04 .right dd{/*visibility: hidden;opacity: 0;height: 0;*/ display: none;}

.n_block04 .right li.on dt{display: none;}
.n_block04 .right li.on .inspur-line{visibility: visible;opacity: 1;}
.n_block04 .right li.on .inspur-line span {width: 70%;}
.n_block04 .right li.on dd{display: block;}

.n_block05{padding: 150px 0 170px 0;}
.example_list ul{overflow: hidden;}
.example_list li{float: left;width: 33.33%;*margin-left: -1px;}
.example_list li a{position: relative;display: block;}
.example_text{position:absolute; width:100%; height:100%; z-index:3; display:block; text-align:center; left:0; top:0; opacity:0; filter:alpha(opacity=0);  background:#ff0000;transition:1s all; -webkit-transition:1s all;}
.example_text em{ position:absolute; width:80%; left:10%; color:#fff;  top:50%; margin-top:-15px; display:block; }
.n_block05 .n_btn {text-align: center;margin-top: 15px;}
.n_block05 .n_btn a{float: none;margin: 0;}





@media only screen and (max-width: 1660px) {
.b_p01 h1{font-size: 60px;line-height: 70px;margin-bottom: 80px;}
.n_case dt em{font-size: 80px;}
.n_case dt{font-size: 44px;}

.n_block04 .right dt{margin-bottom: 0;}
.n_block04 .right li{margin-bottom: 30px;}
.n_block04 .right{min-height: 460px;}


}

@media only screen and (max-width: 1440px) {
.b_p01 h1{font-size: 48px;line-height: 58px;}
.n_case dt em{font-size: 70px;}
.n_case dt{font-size: 34px;line-height: 70px;}
.n_block04 .right{width: 44%;}

.n_block05 .n_btn{margin-top: 0;}

}
@media only screen and (max-width: 1366px) {
.n_block05,.n_block02{padding: 70px 0;}
.n_block03{padding-bottom: 0;}
.n_block04{padding: 100px 0;}

.n_btn{padding-top: 50px;}
.n_block04 .left h1 span{padding-right: 30px;margin-right: 30px;}
.inspur-list li .insimg{margin-bottom: 30px;}
.inspur-list li{margin-bottom: 20px;}
.n_block04 .right{height: 396px;}

}
@media only screen and (max-width: 1280px) {
.b_p01 h1{font-size: 40px;line-height: 50px;margin-bottom: 50px;}
.inspur-list li img{width: 120px;}
.n_block03 .inspur-list{padding-top: 0;}
.n_btn a{width: 170px;}

}
@media only screen and (max-width: 1024px) {
.n_block05,.n_block02{padding: 40px 0;}
.inspur-list li{padding-bottom: 40px;margin-bottom: 0;}
.n_block04{padding: 60px 0;}

.b_p01 h1{font-size: 24px;line-height: 30px;margin-bottom: 20px;}
.b_p02{margin:0;margin-top: 10px;}
.n_title{margin-bottom: 20px;}
.inspur-list li .insimg{width: 100px;height: 100px;margin-bottom: 20px;}
.inspur-list li img{width: 100px;}
 .inspur-list li h2{margin-bottom: 20px;}
 .inspur-list li p{opacity: 1;}
 .n_block04 .left{width: 50%;}
 .n_block04 .left h1 img{width: 150px}
 .n_block04 .left h1{height: 72px;line-height: 72px;margin-bottom: 20px;}
 .n_block04 .left h1 span{padding-right: 20px;margin-right: 20px;}
 .n_btn a{width: 150px;line-height: 36px;}
 .n_block04 .right li{margin-bottom: 20px;}
 .n_block04 .right li h1{line-height: 26px;}
 .n_block04 .right li p{line-height: 24px;}
 .n_block04 .right li dd{margin-bottom: 20px;}
 .n_block04 .left p{font-size: 14px;line-height: 24px;}
 .n_btn{padding-top: 30px;}

}
@media only screen and (max-width:767px) {
.n_block04{padding: 40px 0;}
.n_case{padding-bottom: 20px;}
.n_block01 img{display: none;}
.n_block01{height: 250px;}
.b_p01 h1{font-size: 18px;line-height: 24px;margin-bottom: 10px;}
.n_case li{width: 50%;}
.n_case dt{font-size: 18px;font-weight: normal;line-height: 30px;}
.n_case dt em{font-size: 36px;}
.n_case li{margin-bottom: 30px;}
.n_case li:nth-child(2n+1){clear: both;}
.inspur-list li{width: 50%;}
.inspur-list li:nth-child(2n+1){clear: both;}
.inspur-list li .insimg{width: 60px;height: 60px;margin-bottom: 10px;}
.inspur-list li img{width: 60px;}
.n_case dl{padding: 0 10px;}
.n_case ul{margin: 0 -10px;}

.n_block04 .left,.n_block04 .right{float:none;width: 100%;}
.example_list li{width: 50%;}
.n_btn{padding-top: 20px;}
.n_btn a{width: 120px;line-height: 36px;margin:0 5px;}
.n_block04 .left{margin-bottom: 40px;padding-bottom: 40px;border-bottom: 1px dashed rgba(255,255,255,0.4)}
.n_block04 .left h1{height: 48px;line-height: 48px;margin-bottom: 20px;text-align: center;}
.n_block04 .left h1 span{margin-right: 10px;padding-right: 10px;}
.n_block04 .left h1 img{width: 100px;}
.n_block04 .right li h1{line-height: 30px;}
.n_block04 .right li dd{margin-bottom: 15px;}
.inspur-list li p{line-height: 24px;}
.n_block04 .right li{margin-bottom: 10px;}
.n_edit{margin-bottom: 40px;}
.n_block04 .n_btn{text-align: center;}
.n_block04 .n_btn a{float: none;}
.n_block04 .right{height: auto;min-height: inherit;}
.inspur-list li{padding-bottom: 20px;}

}




@media only screen and (min-width:1025px) {
.inspur-list li:hover .inspur-line span {width: 100%;}
.inspur-list li:hover { top: -15px; -webkit-transition: all 0.5s; -o-transition: all 0.5s; -moz-transition: all 0.5s; transition: all 0.5s; }
.inspur-list li:hover p { opacity: 1; -webkit-transition: all 0.5s; -o-transition: all 0.5s; -moz-transition: all 0.5s; transition: all 0.5s; -webkit-transition-delay: 0.4s; -moz-transition-delay: 0.4s; -o-transition-delay: 0.4s; transition-delay: 0.4s; }



.n_btn a{transition:all 0.3s;-webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;-ms-transition:all 0.3s;}
.n_btn a:hover{opacity:0.7;filter:alpha(opacity=80); -moz-opacity:0.7; -khtml-opacity:0.7;}


/*.n_block04 .right dd{transition:all 0.3s;-webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;-ms-transition:all 0.3s;}
*/.example_list li:hover .example_text  { opacity:0.9; filter:alpha(opacity=95);}


}





































































