@charset "utf-8";
/* CSS Document */
.pDeBoxW { padding: 0 1em; }
.pDeBox { max-width: 1120px; margin: 0 auto;}
.pDeBox::after { clear: both; content: ""; display: block;}
.pDeBox .pSide { float: left; width: 24%;}
.pDeBox .pMain{ float: right; width: 72.3%;}

.pDeBox .navs { padding: 0.8em 1.2em 0.8em; background-color: #fff; color: #000; text-align: left;}
.pDeBox .navs .tit { padding: 0.6em 0 0.3em; line-height: 1.3em; font-size: 20px; font-weight: bold; 
text-transform: uppercase;}
.pDeBox .navs dl { margin-top: 0.6em;}
.pDeBox .navs dt { padding: 0.4em 0; line-height: 1.4em; 
 font-weight: bold; text-transform: uppercase;}
.pDeBox .navs dd { color: #616161; font-size: 14px; }
.pDeBox .navs dd li { padding: 0.4em 0; line-height: 1.4em;}
.pDeBox .navs dd a { display: block; color: #616161;padding-left: 1em;
 position: relative; z-index: 0;
transition: all 0.5s; right:0;
background:  0 0 no-repeat; background-size:1em auto;}
.pDeBox .navs dd a:hover {  right: -2px;
	background-image: url(../imgs/arrow2.png) ;}

/* #pDeBox .navs dd { display: none;} */
.pDeBox .navs dt { position: relative;z-index: 0;}
/* #pDeBox .navs dt::after { content: "";
    position: absolute;
    top: 50%;
    right: 0;
    margin-top: -0.4em;
    width: 0.8em;
    height: 0.8em;
    background: url(../imgs/arrow.png) center center no-repeat;
    background-size: contain;
	transform: rotate(-90deg);
	-ms-transform: rotate(-90deg);
	-webkit-transform: rotate(-90deg); }
#pDeBox .navs dt.show::after {
  transform: rotate(0);
  -ms-transform: rotate(0);
  -webkit-transform: rotate(0);} */


.contBox { margin-top: 1.6em;}
.contBox .con { position: relative; z-index: 0; padding-top: 81%; background: url(../imgs/contbg.jpg) center 0 no-repeat; background-size:cover;}
.contBox .con::after { content: ""; position: absolute; z-index: -1; left: 0; top: 0; width: 100%; height: 100%;
background:#000;
filter:Alpha(opacity=30);
background: rgba(0, 0, 0, 0.3)}
.contBox .btnW {position: absolute; text-align: center; left: 0; right: 0; bottom: 1.7em;}
.contBox .btn {  display: inline-block; cursor: pointer; 
padding: 2px 1.8em 0; line-height: 2.2em; 
background-color: #00B263; font-weight: bold;
transition: all 0.5s;}
.contBox .btn:hover {background-color:#000;  color: #00B263;}
.contBox .txt { color: #fff; position: absolute; bottom: 4em; right: 1em; left: 1em;
 text-align: center; font-weight: bold; font-size: 20px; line-height: 1.3em; }

.picdBox { position: relative; z-index: 0;
min-height: 424px; overflow: hidden; background: center center no-repeat; 
 background-size:cover;
 /* padding-top: 52.8%;
  height: 0; */ 
}
.picdBox>img { display: none;}
.picdBox .con { /* position: absolute; left: 0; top: 0; width: 100%; height: 100%; */
min-height: 424px;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
flex-wrap: nowrap; justify-content: space-between; align-items: stretch;}
.picdBox .con .txtb { width: 50%; overflow: hidden; color: #fff; text-align: left;
background:#000;
filter:Alpha(opacity=70);
background: rgba(0, 0, 0, 0.7);}
.picdBox .con .txtb .txtbc { padding: 2.4em 2em 1.6em;}
.picdBox .con .txtb h1 { font-size: 1.75em; line-height: 1.3em; text-transform: uppercase;}
.picdBox .con .txtb h2 { font-size: 1.3em; margin-top: 0.3em; line-height: 1.3em; text-transform: uppercase;}
.picdBox .con .txtb .txt { margin-top: 1.4em; line-height: 1.5em; }
.picdBox .con .txtb .txt2 { margin-top: 2em; line-height: 1.5em;
height: 9em; overflow: hidden;}
.picdBox .con .btnw { width: 50%; margin-bottom: 2em;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
flex-wrap: nowrap; flex-direction: column; justify-content: flex-end; align-items: center;
}
.picdBox .con .btnw .btn {  display: inline-block; cursor: pointer; 
padding: 2px 1.8em 0; line-height: 2.2em;  
background-color: #00B263; font-weight: bold;
transition: all 0.5s;}
.picdBox .con .btnw .btn:hover {background-color:#000;  color: #00B263;}
.picdBox .con .txtb .line { margin: 0.6em auto 0 0; width: 5.2rem; height: 4px; background-color: #00B263;}

.sheetBox { margin-top: 2.8em; padding: 1.9em 1.5em 0.8em; background-color: #fff;text-align: left;}
.sheetBox .titW::after{ display: block; content: ""; clear: both;}
.sheetBox .titL { float: left;}
.sheetBox .tit { font-size: 20px; text-transform: uppercase;}
.sheetBox .tab {float: right; font-size: 1rem; line-height: 1.6em;}
.sheetBox .tab li { cursor: pointer; display: inline-block; background-color: #f8f8f8; padding: 1px 1em 0;}
.sheetBox .tab .cur { background-color: #000; color: #fff; }
.sheetBox .line { margin: 0.6em auto 0 0; width: 5.2rem; height: 4px; background-color: #00B263;}
.sheetBox .con { display: none;}
.sheetBox .con:nth-child(2) { display: block;}
.sheetBox .sheet {  text-align: center;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
flex-wrap: nowrap; justify-content: center;
} 

.sheetBox .sheet dl {margin-top: 1em;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	flex-wrap: nowrap;flex-direction: column;
}
.sheetBox .sheet dt {border-top: 1px solid #000; border-bottom: 1px solid #000; 
padding: 0.7em 0.5em 0.4em; line-height: 1.2em;}
.sheetBox .sheet dt .t1 { font-weight: bold;overflow:hidden;text-overflow:ellipsis; white-space:nowrap; *white-space:nowrap;}
.sheetBox .sheet dt .t2 {line-height: 1.2em; margin-top:0.7em;}
.sheetBox .sheet dd { padding: 0.6em 0.5em 0; display: -ms-flexbox; flex: 1; line-height: 2em;
display: -webkit-flex;
display: flex;
flex-wrap: nowrap; align-items: stretch; justify-content: center; flex-direction: column;}
.sheetBox .sheet dd .item { line-height: 2.4em; border-bottom: 1px solid #000;}
.sheetBox .sheet dd .item:last-child { border-bottom: 0;}

.optionBox { margin-top: 2.8em; padding: 1.9em 1.5em; background-color: #fff;text-align: left;}
.optionBox .tit { font-size: 20px; text-transform: uppercase;}
.optionBox .line { margin: 0.6em auto 0 0; width: 5.2rem; height: 4px; background-color: #00B263;}
.optionBox .list dl { margin-top: 2.5em; line-height: 1.4em;}
.optionBox .list dl::after { display: block; clear: both; content: "";}
.optionBox .list dt {float:left; width: 15.5em;}
.optionBox .list dd {  margin-left: 16.2em;}
.optionBox .list .circle { position: relative; z-index: 0; margin-top: 0.1em; margin-right: 0.7em; display: inline-block; width: 1.2em; height: 1.2em; background-color: #1d1d1d;
-moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%; overflow: hidden;}
.optionBox .list .circle::before { content: ""; position: absolute; left: -140%; top: -30%; 
width: 160%; height: 160%; background-color: #fff;
-moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%; }
.optionBox .list .cur::before { display: none;}

.optionBox .list dd .op1 span { vertical-align: middle; margin-right: 0.5em; display: inline-block; width: 28px; height: 24px;
background:center center no-repeat; background-size:contain;}
.optionBox .list dd .op2 span {vertical-align: middle;  margin-right: 0.5em;
  display: inline-block; height: 38px;text-align: center;}
.optionBox .list dd .op2 span i { font-style: normal; display: block; font-size:12px ;
 line-height: 1.2em; text-align: center; margin-top: 4px;}
.optionBox .list dd .op2 span .oppic { width: 34px; margin: 0 auto; display: block; height: 24px;
background:center center no-repeat; background-size:contain;}

.dzBox { margin-top: 2.8em; padding: 1.3em 1.5em; background-color: #000; color: #fff;
text-align: left;}
.dzBox .btn { float: right; margin-left: 0.3em; padding:0 1.1em; display: inline-block; color: #000; 
background-color: #fff; transition: all 0.5s;
}
.dzBox .btn:hover {background-color: #000; color: #00B263}

.picsBox { margin-top: 2.8em; padding: 1.9em 1.5em; background-color: #fff;text-align: left;}
.picsBox .tit { font-size: 20px; text-transform: uppercase;}
.picsBox .line { margin: 0.6em auto 0 0; width: 5.2rem; height: 4px; background-color: #00B263;}
.picsBox .list { margin: 1em -0.5% 0;}
.picsBox .list ul::after { display: block; clear: both; content: "";}
.picsBox .list li { float: left; margin: 0.7% 0.7%; width: 23.6%;}
.picsBox .list .pic { display: block; cursor: pointer; padding-top: 65%; 
background: center center no-repeat; background-size:cover;}

.speBox { margin-top: 1.6em;}
.speBox .con {background:#000 url(../imgs/spebg.jpg) center 0 no-repeat; background-size:cover;
color: #00B263; text-align: left; padding: 2.4em 1em 2.4em 1.6em; transition: all 0.4s;}
.speBox .con .tit { font-size: 20px; line-height: 1.3em; text-transform: uppercase;}
.speBox .con .txt { margin-top: 0.6em; line-height: 1.75em;}

.speBox a:hover .con{ background-image: none; background-color: #00B263; color: #000;}

.quaBox { max-width: 1120px; margin: 3.3em auto 0;  text-align: left; background-color: #fff;}
.quaBox .quaBoxc { padding: 3em 5.8%;}
.quaBox .tit { line-height: 1.3em; font-size: 20px; text-transform: uppercase;}
.quaBox .line { margin: 0.6em auto 0 0; width: 5.2rem; height: 4px; background-color: #00B263;}
.quaBox .tab { margin-top: 1em;}
.quaBox .tab ul { font-size: 16px;}
.quaBox .tab li { cursor: pointer; text-transform: uppercase; font-weight: bold; display: inline-block;
color: #8d8d8d; padding:2px  1.2em 0;}
.quaBox .tab li h3 { font-size: 1em;}
.quaBox .tab li.cur { background-color: #000; color: #fff;}
.quaBox .con::after { display: block; clear: both; content: "";}
.quaBox .con { display: none; padding: 2em 0 0;}
.quaBox .con:first-child { display: block;}
.quaBox .conp {display: -ms-flexbox;
display: -webkit-flex;
display: flex;
flex-wrap: nowrap;
align-items: center; justify-content: space-between;}
.quaBox .con .pic { float: left; width: 8em;}
.quaBox .con .pic img { display: block; margin: 0 auto; max-width: 7em; height: auto;}
.quaBox .con .txt { flex: 1; margin-left: 0.5em;}

.quBox { max-width: 1120px; margin: 3.3em auto 0; background-color: #fff;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
flex-wrap: nowrap;align-items: stretch; justify-content: space-between;
}
.quBox2 { flex-direction: row-reverse;margin: 0 auto 0;}
.quBox .picb { width: 50%;}
.quBox .pic { width: 100%; height: 100%; 
background: center center no-repeat; background-size:cover;}

.quBox .txtb { width: 50%; padding: 3em 0 1.7em;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
flex-wrap: nowrap;align-items: center; }
.quBox .txtb .con { flex: 1; margin: 0 7% 0 11.7%; text-align: left;}
.quBox2 .txtb .con { margin: 0 11.7% 0 7%; text-align: right;}
.quBox .txtb .tit {font-weight: bold; font-size: 2em; line-height: 1.3em; text-transform: uppercase;}
.quBox .txtb .txt {  margin: 1em 0 0 auto; line-height: 1.7em;}
.quBox .txtb .btn { margin-top: 0.8em; display: inline-block; 
color: #000;font-weight: bold;
line-height: 1.8em; padding: 0.1em 0 0;  }
.quBox .txtb .btn:hover { text-decoration: underline;}
.quBox .txtb .line {  margin: 0.6em auto 0 0; width: 5.2rem; height: 4px; background-color: #00B263;}
.quBox2 .txtb .line {margin: 0.6em 0 0 auto;}
/* 
@media only screen and (max-width:1200px) {
.picdBox .con .txtb .txt2 {height: 7.5em; overflow: hidden;}
}

@media only screen and (max-width:1180px) {
.picdBox .con .txtb .txt2 {height: 6em; overflow: hidden;}
}

@media only screen and (max-width:1130px) {
.picdBox .con .txtb .txt2 {height: 4.5em; overflow: hidden;}
} */

@media only screen and (max-width:980px) {
.picdBox .con .txtb .txt2 {height: 3em; overflow: hidden;}
.picdBox .con .txtb h1 { font-size: 1.4em;}
.picdBox .con .txtb h2 { font-size: 1.1em;}
.picdBox .con .txtb .txt { font-size: 0.9em;}
.picdBox .con .txtb .txt2 { font-size: 0.9em;}
}

@media only screen and (max-width:880px) {
.picdBox .con .txtb h1 { font-size: 1.2em;}
.picdBox .con .txtb h2 { font-size: 1em;}
.picdBox .con .txtb .txt { font-size: 0.8em;}
.picdBox .con .txtb .txt2 { font-size: 0.8em;}
}

@media only screen and (max-width:942px) {
.contBox .txt {bottom: 3.4em;}
}

@media only screen and (max-width:828px) {
.pDeBoxW {font-size: 1em; padding: 0;}

.pDeBox .pSide {margin-top: 3.3em; float: none; width: auto;}
.pDeBox .pMain{ float: none; width: auto;}
.pDeBox .navs {padding:2.4em 9%}
.pDeBox .navs .tit { font-size: 1.3em;}

.pDeBox .pronavs .con { display: none;} 
.pDeBox .pronavs .tit { position: relative; z-index: 0;}
.pDeBox .pronavs .tit::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    display: block;
    margin-top: -0.6em;
    width: 1em;
    height: 1em;
    background: url(../imgs/arrow.png) 0 center no-repeat;
    background-size: 0.8em auto;
    transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
}
.pDeBox .pronavs .tit.show::after {
	transform: rotate(0);
	-ms-transform: rotate(0); /* IE 9 */
	-webkit-transform: rotate(0); /* Safari and Chrome */
}

.picdBox { padding-top: 0; height: auto; }
.picdBox>img { display: none; width: 100%; height: auto;}
.picdBox .con { position: static; display: block; height: auto;}
.picdBox .con .txtb { width: auto;}
.picdBox .con .txtb .txtbc { padding:3em 9% 6em;}
.picdBox .con .btnw { position: absolute; left: 0; width: 100%; bottom: 2em; 
display: block;  margin: 0;}

.picdBox .con .txtb h1 { font-size: 1.75em;}
.picdBox .con .txtb h2 { font-size: 1.3em;}
.picdBox .con .txtb .txt { font-size: 1em;}
.picdBox .con .txtb .txt2 { font-size: 1em; height: auto;}

.sheetBox { padding: 3em 9%;}
.sheetBox .tit { font-size: 1.3em; line-height: 1.3em;}

.quaBox .quaBoxc { padding: 0 9%;}
.quaBox .con .txt { margin-left: 0;}

.quBox { display: block;}
.quBox .txtb .tit { font-size: 1.3em;}
.quBox .txtb { width: 100%;}
.quBox .picb { width: 100%;}
.quBox .txtb .con { margin: 0 9%;}
.quBox2 .txtb .con { margin: 0 9%;}
.quBox .pic { height: 0; padding-top: 60%; overflow: hidden;} 

.picsBox { padding: 3em 9%;}
.picsBox .tit {font-size: 1.3em; line-height: 1.3em;}
.picsBox .list li { margin-top: 1.4%; width: 48.6%;}

.optionBox { padding: 3em 9%;}
.optionBox .tit { font-size: 1.3em; line-height: 1.3em;}
.optionBox .list dt { width: auto; float: none;}
.optionBox .list dd { margin-top: 1em; margin-left: auto;}

.sheetBox .sheet { overflow-x: auto; justify-content: start;}

.speBox .con { padding: 2.4em 9%;}

.dzBox { padding:3em 9%;}
.dzBox .btn { float: none; display: block; width: 8em; padding: 1px 0 0; text-align: center;
 margin:1.2em auto 0 0;}

.quaBox { margin-top: 2.8em; padding: 3em 0;}
.quaBox .tit { font-size: 1.3em;}
.quaBox .conp { display: block;}
.quaBox .tab ul { font-size: 0.7em;}
.quaBox .tab li { padding:2px 0.5em 0;}
.quaBox .con { padding-bottom: 0; padding-top: 1em;}
.quaBox .con .txt { line-height: 1.7em;}

.contBox,.speBox { display: none;}
}


.quTxtBox { max-width: 1120px;  margin: 1.0em auto 0; background-color: #fff;}
.quTxtBox .con { padding: 3em 5.8%; text-align: left;}
.quTxtBox .con1 { padding: 0em 5.8%; text-align: left;}
.quTxtBox .tit { font-weight: bold; font-size: 1.5em; line-height: 1.3em; text-transform: uppercase;}
.quTxtBox .line{  margin: 0.6em auto 0 0; width: 5.2rem; height: 4px; background-color: #00B263;}
.quTxtBox .txt {  margin: 1em 0 0 auto; line-height: 1.7em;}


.separate {padding-top: 6em}