@charset "UTF-8";


/* -------------------------------------
news
------------------------------------- */
#newslist {
	margin-bottom:50px;
}
#newslist li:not(:last-child) {
	margin-bottom:60px;
}
#newslist li a {
	padding:35px 50px;
	border:5px solid #EAE7D5;
	position:relative;
}
#newslist li .cat {
	font-size:13px;
	color:#FFF;
	text-align:center;
	line-height:1.0;
	min-width:110px;
	padding:8px 10px 9px 10px;
	background-color:#58A3BA;
	position:absolute;
	top:-2px;
	left:50px;
	z-index:1;
	transform:translateY(-50%);
}
#newslist li .name {
	font-size:19px;
	font-weight:500;
	color:#58A3BA;
	line-height:1.6;
	letter-spacing:0.2em;
	flex:1;
	padding-right:20px;
}
#newslist li .date {
	font-size:13px;
	font-weight:500;
	text-align:center;
	letter-spacing:0.2em;
	width:100px;
	padding-top:5px;
}


.post {
	padding:40px 50px 40px 50px;
	border:5px solid #EAE7D5;
	position:relative;
}
.post .cat {
	font-size:13px;
	font-weight:500;
	color:#FFF;
	text-align:center;
	line-height:1.0;
	letter-spacing:0.2em;
	min-width:110px;
	padding:8px 10px 9px 10px;
	background-color:#58A3BA;
	position:absolute;
	top:-2px;
	left:50px;
	z-index:1;
	transform:translateY(-50%);
}
.post .head {
	padding-bottom:25px;
	margin-bottom:30px;
	border-bottom:1px solid #E6E6E6;
}
.post .head h1 {
	font-size:19px;
	font-weight:500;
	color:#58A3BA;
	letter-spacing:0.2em;
	flex:1;
	padding-right:20px;
}
.post .head .date {
	font-size:13px;
	font-weight:500;
	text-align:center;
	letter-spacing:0.2em;
	width:100px;
	padding-top:5px;
}



@media screen and (max-width:1340px) {
	#newslist li:not(:last-child) {
		margin-bottom:58px;
	}
	#newslist li a {
		padding:35px 45px;
	}
	#newslist li .cat {
		left:45px;
	}
	
	
	.post {
		padding:38px 45px 38px 45px;
	}
	.post .cat {
		left:45px;
	}
}
@media screen and (max-width:1240px) {
	
}
@media screen and (max-width:1100px) {
	#newslist li:not(:last-child) {
		margin-bottom:56px;
	}
	#newslist li a {
		padding:35px 40px;
	}
	#newslist li .cat {
		left:40px;
	}
	#newslist li .name {
		font-size:18px;
	}
	
	
	.post {
		padding:37px 40px 37px 40px;
	}
	.post .cat {
		left:40px;
	}
}
@media screen and (max-width:980px) {
	#newslist li:not(:last-child) {
		margin-bottom:54px;
	}
	#newslist li a {
		padding:35px 35px 33px 35px;
	}
	#newslist li .cat {
		left:35px;
	}
	
	
	.post {
		padding:35px 35px 35px 35px;
	}
	.post .cat {
		left:35px;
	}
}
@media screen and (max-width:768px) {
	#newslist li:not(:last-child) {
		margin-bottom:52px;
	}
	#newslist li a {
		padding:35px 30px 30px 30px;
	}
	#newslist li .cat {
		left:30px;
	}
	#newslist li .name {
		font-size:17px;
		padding-right:0;
		margin-bottom:5px;
	}
	#newslist li .date {
		text-align:left;
		width:100%;
		padding-top:0;
	}
	
	
	.post {
		padding:35px 30px 35px 30px;
	}
	.post .cat {
		left:30px;
	}
	.post .head {
		padding-bottom:20px;
		margin-bottom:25px;
	}
	.post .head h1 {
		font-size:18px;
		padding-right:0;
		margin-bottom:5px;
	}
	.post .head .date {
		text-align:left;
		width:100%;
		padding-top:0;
	}
}
@media screen and (max-width:640px) {
	#newslist li:not(:last-child) {
		margin-bottom:50px;
	}
	#newslist li a {
		padding:33px 25px 25px 25px;
	}
	#newslist li .cat {
		left:25px;
	}
	
	
	.post {
		padding:33px 25px 33px 25px;
	}
	.post .cat {
		left:25px;
	}
}
@media screen and (max-width:500px) {
	#newslist li a {
		padding:30px 20px 25px 20px;
	}
	#newslist li .cat {
		left:20px;
	}
	#newslist li .name {
		font-size:16px;
	}
	
	
	.post {
		padding:30px 20px 30px 20px;
	}
	.post .cat {
		left:20px;
	}
}
@media screen and (max-width:320px) {
	
}