@charset "UTF-8";


/*mainimg
-----------------------------------------------------------------------------------------*/
#mainimg{
	mix-blend-mode:multiply;
	height:580px;
	background:url(images/mainimg.jpg) left center;
	background-size:cover;
	display:flex;
	align-items:center;
	padding-left:45%;
	padding-right:5%;
}
#mainimg p{
	font-size:50px;
	line-height:1.6;
	color:#FFF;
	font-family: 'Yu Mincho Light','YuMincho','Yu Mincho','游明朝体','ヒラギノ明朝 ProN','Hiragino Mincho ProN','ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
	text-shadow: 0 0 5px #000000;
}
@media screen and (max-width: 1300px) {
	#mainimg{height:500px;}
	#mainimg p{font-size:45px;}
}
@media screen and (max-width: 999px) {
	#mainimg{height:45vw;padding-right:0;}
	#mainimg p{font-size:4vw;}
}
@media screen and (max-width: 767px) {
	#mainimg{height:45vw;padding-right:0;}
	#mainimg p{font-size:5vw;}
}

/*topics
-----------------------------------------------------------------------------------------*/
#topics{
	background:#EAEAEA;
	padding:20px;
}
#topics > div{
	background:#FFF;
	padding:25px;
}
#topics h2{
	font-size:20px;
	line-height:25px;
}
/*-------------------------more*/
#topics .more a{
	float:right;
	background:#797979;
	color:#FFF;
	line-height:25px;
	padding:0 15px;
	border-radius:12.5px;
	margin-top:-25px;
}
#topics .more a:hover{
	background:#000;
}

/*about
-----------------------------------------------------------------------------------------*/
#about{
	padding:50px 20px;
	text-align:center;
}
@media screen and (max-width: 767px) {
	#about{padding:30px 20px;}
}
/*-------------------------h2*/
#about h2{
	display:inline-block;
	font-size:25px;
	line-height:40px;
	color:#0073D4;
	font-weight:bold;
	border-bottom:4px solid #C1E8FB;
}
@media screen and (max-width: 767px) {
	#about h2{font-size:20px;line-height:35px;}
}
/*-------------------------copy*/
#about .copy{
	font-size:18px;
	line-height:30px;
	text-align:left;
	max-width:980px;
	margin:30px auto;
}
@media screen and (max-width: 767px) {
	#about .copy{font-size:16px;margin:15px auto;}
}
/*-------------------------index*/
#about .index{
	font-size:0;
}
#about .index li{
	display:inline-block;
	padding:10px;
	width:25%;
}
@media screen and (max-width: 767px) {
	#about .index{max-width:500px;margin:0 auto;}
	#about .index li{width:50%;padding:5px;}
}
/*-------------------------banner*/
#about .banner{
	font-size:0;
	margin-top:20px;
}
#about .banner li{
	display:inline-block;
	padding:5px;
}
@media screen and (max-width: 767px) {
	#about .banner{margin-top:10px;}
}

/*topic_list
-----------------------------------------------------------------------------------------*/
.topic_list li{
	margin-top:15px;
	padding-left:140px;
	position:relative;
}
.topic_list li time{
	width:130px;
	font-size:13px;
	line-height:28px;
	float:left;
	margin-left:-140px;
	color:#FFF;
	text-align:center;
	background : -webkit-gradient(linear, left top, left bottom, from(#48A1E2), to(#0066CC));
	background : -webkit-linear-gradient(top, #48A1E2, #0066CC);
	background : linear-gradient(to bottom, #48A1E2, #0066CC);
	border-radius:3px;
}
.topic_list li .item{
	display:block;
	font-size:16px;
	line-height:24px;
	padding:2px;
}
.topic_list li a:hover{
	text-decoration:underline;
}
@media screen and (max-width: 767px) {
	.topic_list li{padding-left:0;}
	.topic_list li time{float:none;display:block;margin-left:0;line-height:24px;}
}
/*-------------------------new*/
.topic_list li.new::before{
	position:absolute;
	left:-42px;
	top:0;
	content:"NEW";
	background:#FF3C3B;
	color:#FFF;
	width:40px;
	font-size:12px;
	line-height:28px;
	display:block;
	text-align:center;
	border-radius: 50%;
	-webkit-transform : rotate(-10deg) ;
	-ms-transform : rotate(-10deg) ;
	transform : rotate(-10deg) ;
}
/*-------------------------notice*/
.notice{
	border:2px solid #CC0000;
	padding:0 15px 15px 15px;
	margin:15px -15px 0 -15px;
}
