@charset "UTF-8";

/**TOPICS**/
#topics .newsBox dl {
	width:100%;
	font-size:1.6rem;
	padding:.75em 1em;
	text-align:left;
	line-height:1.3;
	border-bottom:1px solid #cccccc;
}
#topics .newsBox .date {
	width:7em;
	background-color:#F5F3EC;
	text-align:center;
	padding:.33em 0;
}
#topics .newsBox dt {
	width:calc(100% - 9em);
}
#main #topics .single p.date {
	margin-top:-1em;
}
#topics .single .contents_inner {
	margin-bottom:60px;
}
#topics .single a.btn {
	display:block;
	margin:0 auto;
	font-family: fot-klee-pro, sans-serif;
	font-size:1.8rem;
	background-color:#2F8272;
	color:#FFFFFF;
	line-height:2;
	width:10em;
	text-align:center;
}

/**
BLOG
**/

#blog .blogitem {
	width:calc((100%/3) - 25px);
	border-top:1px solid #2F8272;
	padding:15px 10px 0;
}
#blog .blogitem dl {
	width:60%;
	font-size:1.5rem;
	padding-bottom:1.5em;
	position:relative;
	margin-bottom:45px;
}
#blog .blogitem .date {
	margin-bottom:.75em;
}
#blog .blogitem dt {
	line-height:1.5;
}
#blog .blogitem .link {
	position:absolute;
	right:0;
	bottom:0;
}
#blog .blogitem .link a {
	font-size:1.3rem;
	color:#2F8272;
}
#blog .blogitem .link a::after {
	content:'';
	display:inline-block;
	width:.5em;
	height:.5em;
	border-right:1px solid #2F8272;
	border-bottom:1px solid #2F8272;
	transform:translateY(-.16em) rotate(-45deg);
}
#blog .blogitem .img {
	width:calc(40% - 20px);
}

@media screen and (max-width:1300px){

}

@media screen and (max-width:1024px){

}

@media screen and (max-width: 768px){

}

@media screen and (max-width:640px){

/**TOPICS**/

#topics .newsBox dl {
	font-size:1.4rem;
	padding:.5em 0em;
}
#topics .newsBox .date {
	width:6em;
}
#topics .newsBox dt {
	width:calc(100% - 7em);
}
#main #topics .single p.date {
	margin-top:-.5em;
}
#topics .single .contents_inner {
	margin-bottom:30px;
}
#topics .single a.btn {
	font-size:1.5rem;
}
	
#blog .blogitem {
	width:100%;
	padding:15px 0;
}
#blog .blogitem dl {
	width:65%;
	font-size:1.4rem;
	margin-bottom:15px;
}
#blog .blogitem .date {
	margin-bottom:.75em;
}
#blog .blogitem dt {
	line-height:1.3;
}
#blog .blogitem .img {
	width:calc(35% - 20px);
}
	
}
	
@media screen and (max-width:480px){

}
	
@media screen and (max-width:360px){

}