@charset"utf-8";

/*layout*/
section:after,
a:after,
ul:after,
div:after,
header:after,
footer:after{content:""; display:block; clear:both;}

.group{position:relative; margin:0 auto; padding:5px; max-width:900px;}

body{background-color:#373d4e;}

/*header*/
header{position: relative; margin:0 auto; max-width:1200px;}
header h1{margin:0 auto; width:102px;}
.logo{display:block; width:102px; height:70px;background:url("../img/logo5.png") no-repeat; background-size: 102px 70px}
.side{position: absolute; top:20px; right:0px; width:110px;}
.side a{display:inline-block; margin-left:10px; width:40px; height:40px; line-height:40px; font-size:20px; color:#8691ad; border-radius:50%; text-align:center; background-color:#4f576d; transition: all 0.8s}
.side a:hover{color:#fff; background-color:#608fc3;}

/*content*/
.content{margin-top:15px;}
/*list*/
.list li{width:100%; margin-bottom:2px;}
.list li a{display:block; background-color:#fff; border:1px solid #373d4e; box-shadow: 0px 0px 5px rgba(0,0,0,0.3)}
.list li a div.img{ float:left; width:35%; max-width:110px; border-right:1px solid #ddd;}
.list li a div.txt{ float:left; width:60%;}
.list li a div.txt p{padding:10px;}
.list li a div.txt strong{display:inline-block;color:#333; padding-bottom: 5px; font-size:16px; font-weight:bold;}
.list li a:hover{border:1px solid #608fc3; box-shadow: 0px 0px 5px rgba(91, 135, 184)}
.list li:nth-child(1) a div.txt strong {color:#5c6fce;}
.list li:nth-child(2) a div.txt strong {color:#222222;}
.list li:nth-child(3) a div.txt strong {color:#f95759;}
.list li:nth-child(4) a div.txt strong {color:#ff9711;}
.list li:nth-child(5) a div.txt strong {color:#4ea2da;}
.list li a div.txt p span.subtitle{display: inline-block; width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: normal; line-height: 1.3; height: 2.8em; text-align: left; word-wrap: break-word; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.list li a div.txt span.link{display:inline-block; color:#b9b9b9; font-weight:bold;}

/**/
.copyright{margin-top:20px; font-size:11px; text-align:center; color:#596073;}

/*TAB*/
@media (min-width:640px) {

	
}

@media (min-width:768px) {
	.group{padding:10px 30px;}
	header h1{width:125px;}
	.logo{width:125px; height:86px; background-size: 125px 86px}
	.content{margin-top:20px;}
	.list li{float:left; width:50%;margin-bottom:10px;}
	.list li a{margin-right:5px;}
	.list li:nth-child(2n) a{margin-right:0px; margin-left:5px;}
	.list li a div.img{width:43%; max-width:170px;}
	.list li a div.txt{width:56%;}
	.list li a div.txt p{padding:20px;}
	.list li a div.txt strong{font-size:20px;  padding-bottom:10px; }
	.list li a div.txt p span.subtitle{height: 3.8em; -webkit-line-clamp: 3; }

}


/*PC*/
@media (min-width:1024px) {
	.group{padding:10px;}
	header h1{width:225px;}
	.logo{ width:255px; height:155px; background-size: 255px 155px}
	
}

