
/* CSS Document */

.TBox { margin-top: 0.7em; display: flex; justify-content: space-between; align-items: stretch;}
.TBox .conL { width: 29%; background-color: #17222f;
-moz-border-radius:0.3em; -webkit-border-radius:0.3em; border-radius:0.3em;}
.TBox .conC { flex: 1; width: 51.5%;}
.TBox .conR { margin-left: 0.83%; width: 18.66%; background-color: #17222f;
-moz-border-radius:0.3em; -webkit-border-radius:0.3em; border-radius:0.3em;}

.TBox .conL .tit { padding: 1.2em 1.4em 0; display: flex; justify-content: space-between; align-items: center;}
.TBox .conL .tit .name { font-weight: bold; color: #bcd5d6;}
.TBox .conL .tit a { color: #384950;}
.TBox .conL .tit a:hover { color: #bcd5d6;}
.TBox .conL .txt {color: rgb(224,255,255); text-align: left; padding: 0.8em 1.6em 1em;}
.TBox .conL .list ul { padding-top: 1em; line-height: 3.2;}
.TBox .conL .list li a { padding: 0 2.4em 0 1.4em; color: rgb(224,255,255); text-align: left;
 display: flex; justify-content: flex-start; align-items: center;
  position: relative; z-index: 0;}
.TBox .conL .list li:hover { background-color: #387196;}
.TBox .conL .list li a .arrow { width: 1em; height: 1em; font-size: 1em; line-height: 1em;
position: absolute; right: 1.4em; top: 50%; margin-top: -0.5em; display: block;}
.TBox .conL .list .pic { display: block; width: 18px; height: 18px;margin-right: 14px;}
.TBox .conL .list .pic img {display: block;  width: 18px; height: 18px;}
.TBox .conL .list .name { flex: 1; display: block;  line-height: 3.2em; height: 3.2em;
overflow: hidden;}

.TBox .conC .conZ {}
.TBox .conC .conZ li { display: none;}
.TBox .conC .conZ li.show { display: block;}

.videoBox { width: 100%; padding-top: 75%; position: relative; z-index: 0;}
.videoBox video { position: absolute; left: 0; top: 0;
 width: 100%; height: 100%; object-fit: contain;background-color: #000;}

.TBox .conR .sepBox {}
.TBox .conR .sepBox .tit { border-bottom: 1px solid #1d2b3c; padding-top: 0.5em; color: #bcd5d6;}
.TBox .conR .sepBox .tit .pics { vertical-align: middle; margin-right: 0.15em; font-size: 2.1em; color: #5c7e10;}
.TBox .conR .sepBox .tit .name { vertical-align: middle;}
.TBox .conR .sepBox .list li { margin-top: 1.5em;}
.TBox .conR .sepBox .list li .pic { display:block; position: relative; z-index: 0; padding-top: 56.7%;}
.TBox .conR .sepBox .list li .pic img{ position: absolute; left: 0; top: 0;
width: 100%; height: 100%; object-fit: contain;}
.TBox .conR .sepBox .list li .name { margin-top: .5em; color: #497180;}
.TBox .conR .sepBox .list li .name a { color: #497180;}
.TBox .conR .sepBox .list li .txt { color: #c6d4df;margin-top: 2em;}
.TBox .conR .sepBox .list li .txt a { color: #c6d4df;}

.TBox .conR .cTab { padding: 1em;}
.TBox .conR .cTab ul {}
.TBox .conR .cTab li { margin-top: 0.6em; cursor: pointer; border: 1px solid rgba(255,255,255,0.5); 
background-color: rgba(255,255,255,0.1);
 padding:0.6em 0; line-height: 1.5; overflow: hidden;color: #fff;
text-overflow:ellipsis;
display:-webkit-box; 
-webkit-box-orient:vertical;
-webkit-line-clamp:1;}
.TBox .conR .cTab li.cur { color: #fff;
 border: 1px solid transparent; background-color: transparent; 
 }
 .TBox .conR .cTab li span { padding: 0 1em; display: block;}

@media only screen and (max-width:980px) {
	.TBox .conL { display: none;}
	.TBox .conR { display: none;}
}

.proBox { display: flex; justify-content: space-between; align-items: flex-start;}
.proBox .conL { width: 18.66%; text-align: left;}
.proBox .conR { margin-left: 1.2em; flex: 1;}

@media only screen and (max-width:980px) {
	.proBox { display: block;}
	.proBox .conL { width: 100%;}
	.proBox .conR { margin-left: 0; width: 100%;}
}

.proBox .conL .tit { margin-top: 1.2em; text-align: left;}
.proBox .conL .tit .name { color: #fff;}
.proBox .conL .list { margin-top: 1.3em;}
.proBox .conL .list a,
.proBox .conL .list li{ cursor: pointer; margin-top: 0.7em; padding: 0.1em 1em 0 1em; text-align: left;
 display: flex; justify-content: flex-start; align-items: center;
 border: 2px solid #000;
 -moz-border-radius:0.5em; -webkit-border-radius:0.5em; border-radius:0.5em;
  position: relative; z-index: 0;
 color: #fff;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#1e5799+0,2989d8+50,207cca+51,7db9e8+100;Blue+Gloss+Default */
background: rgb(30,87,153); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(30,87,153,1) 0%, rgba(41,137,216,1) 50%, rgba(32,124,202,1) 51%, rgba(125,185,232,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(30,87,153,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(30,87,153,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e5799', endColorstr='#7db9e8',GradientType=0 ); /* IE6-9 */
}
.proBox .conL .list a:hover,.proBox .conL .list li.cur,
.proBox .conL .list li:hover{ color: #fff;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#eab92d+0,c79810+100;Yellow+3D+%232 */
background: rgb(234,185,45); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(234,185,45,1) 0%, rgba(199,152,16,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(234,185,45,1) 0%,rgba(199,152,16,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(234,185,45,1) 0%,rgba(199,152,16,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eab92d', endColorstr='#c79810',GradientType=0 ); /* IE6-9 */
}

.proBox .conL .list .pics { position: relative; top: 0; display: block; width: 18px; height: 18px;margin-right: 10px;}
.proBox .conL .list .pics img {display: block;  width: 18px; height: 18px;}
.proBox .conL .list .name {  flex: 1; display: block;  line-height: 2.8em; height:2.8em;
overflow: hidden;}
.proBox .conL .more { margin-top: 1em; cursor: pointer; line-height: 2.5em;
 display: inline-block; border: 1px solid #768591; color: #fff; padding: 0 1.8em;}
.proBox .conL .more:hover { color: #67c1f5;}

.proBox .conPZ {}
.proBox .conP { display: none;}
.proBox .conP.show { display: block;}

.proBox .proList { margin-top: 1.3em;}
.proBox .proList ul { display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: stretch;}
.proBox .proList li { width: 23.8%; margin-top: 1.6%; margin-right: 1.6%; background-color: #17222f;
-moz-border-radius:0.5em; -webkit-border-radius:0.5em; border-radius:0.5em; overflow: hidden;}
.proBox .proList li:nth-child(4n) { margin-right: 0;}
.proBox .proList .pic { display: block; padding-top: 64.28%; position: relative; z-index: 0;}
.proBox .proList .pic img { position: absolute; left: 0; top: 0; width: 100%; height: 100%;
object-fit: cover;}
.proBox .proList .txtb { padding: 0 0.3em;}
.proBox .proList .name { margin-top: 1em;}
.proBox .proList .name a { color: #ff0000;}
.proBox .proList .intro { margin-top: 0.3em; color:#497180; line-height: 1.6em; height: 6.4em; overflow: hidden;
text-overflow:ellipsis;
display:-webkit-box; 
-webkit-box-orient:vertical;
-webkit-line-clamp:4; 
}
.proBox .proList .intro span{ color: #ffa900;}
.proBox .proList .btnW{ margin-top: 1em; padding: 1.4em 0.1em;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#184e70+0,1e6d93+100 */
	background: rgb(24,78,112); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(24,78,112,1) 0%, rgba(30,109,147,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(24,78,112,1) 0%,rgba(30,109,147,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(24,78,112,1) 0%,rgba(30,109,147,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#184e70', endColorstr='#1e6d93',GradientType=0 ); /* IE6-9 */
display: flex; justify-content: center; align-items: center;
}
/* .proBox .proList .btnW .btn1 { display: block; background-color: #ddc373;
line-height: 2.5em; cursor: pointer; padding: 0 1em; color: #624e22;}
.proBox .proList .btnW .btn1:hover { color: #624e22;}
.proBox .proList .btnW .btn2 { display: block; background-color: #0b2d3b;
line-height: 2.5em; cursor: pointer;padding: 0 1em;
color: #fbd07c;} */

.proBox .proList .btnW .btn1,
.proBox .proList .btnW .btn2{ margin: 0.7em 0.2em 0; padding: 0.1em 1em 0 1em; text-align: left;
 display: flex; justify-content: flex-start; align-items: center;
 border: 1px solid #000; line-height: 2.4;
 -moz-border-radius:0.5em; -webkit-border-radius:0.5em; border-radius:0.5em;
  position: relative; z-index: 0;
 color: #fff;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#1e5799+0,2989d8+50,207cca+51,7db9e8+100;Blue+Gloss+Default */
background: rgb(30,87,153); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(30,87,153,1) 0%, rgba(41,137,216,1) 50%, rgba(32,124,202,1) 51%, rgba(125,185,232,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(30,87,153,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(30,87,153,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e5799', endColorstr='#7db9e8',GradientType=0 ); /* IE6-9 */
}
.proBox .proList .btnW .btn1:hover,
.proBox .proList .btnW .btn2:hover { color: #fff;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#eab92d+0,c79810+100;Yellow+3D+%232 */
background: rgb(234,185,45); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(234,185,45,1) 0%, rgba(199,152,16,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(234,185,45,1) 0%,rgba(199,152,16,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(234,185,45,1) 0%,rgba(199,152,16,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eab92d', endColorstr='#c79810',GradientType=0 ); /* IE6-9 */
}

@media only screen and (max-width:980px) {
	.proBox .proList li { width:48.4%; margin-top: 1.6%; margin-right: 1.6%;}
	.proBox .proList li:nth-child(2n) { margin-right: 0;}
}

.newBox { margin-top: 3em; padding-bottom: 1em;}
.newBox  .tit { display: flex; justify-content: space-between; align-items: center;  text-align: left;}
.newBox  .tit .name { color: #fff;}
.newBox  .tit .more {  cursor: pointer; line-height: 2.5em;
 display: inline-block; border: 1px solid #768591; color: #fff; padding: 0 1.8em;}
.newBox .list { margin-top: 0}
.newBox .list ul { display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: stretch;}
.newBox .list li { width: 48.4%; margin-top: 1.6%; margin-right: 1.6%; background-color: #17222f;
-moz-border-radius:0.5em; -webkit-border-radius:0.5em; border-radius:0.5em; overflow: hidden;}
.newBox .list li:nth-child(2n) { margin-right: 0;}
.newBox .list li .lib { padding: 0.9em; text-align: left;
display: flex; justify-content: space-between; align-items: center;}
.newBox .list .picb { width: 15em;}
.newBox .list .pic { display: block; padding-top: 64.28%; position: relative; z-index: 0;}
.newBox .list .pic img { position: absolute; left: 0; top: 0; width: 100%; height: 100%;
object-fit: cover;}
.newBox .list .txtb { flex: 1; margin-left: 1em; padding: 0 0.3em;}
.newBox .list .name { line-height: 1.4; height: 2.8em;
overflow: hidden;}
.newBox .list .name a { color: #c6d4df;}
.newBox .list .label { border-top:1px solid #252f3c; padding: 1.2em 0; margin-top: 0.3em; color:#fff; line-height: 1.7;
}
.newBox .list .label span{ padding: 0 0.8em; display: inline-block; background-color: #000; color: #fff;
-moz-border-radius:1em; -webkit-border-radius:1em; border-radius:1em;}
.newBox .list .date { color: #577180;}

@media only screen and (max-width:980px) {
	.newBox .list li { width: 100%; margin-right: 0;}
	.newBox .list .picb { width: 11.3em;}
	.newBox .list .label {
	    padding: 0.5em 0;
	    margin-top: 0.1em;}
	.newBox .list .name { line-height: 1.3; height: 2.6em;}
}

.tipTxt { margin-top: 1em; color: #fff; text-align: right; padding: 1em 1em 0;}