/* ===============================
	PC
 =============================== */

/* main-visual */

@import url('https://fonts.googleapis.com/css?family=Questrial');

.clearfix:after {
	height: 0;
	visibility: hidden;
	content: ".";
	display: block;
	clear: both;
}

#main .mainImg {
	padding: 130px 20px;
	background: url(../images/kinou/bg.jpg) no-repeat center center;
	background-size: cover;
} 

#main .mainImg h2 {
	font-size: 40px;
	font-size: 4rem;
	font-weight: bold;
}

#main .mainBox {
	padding: 66px 20px 80px;
}

#main .inner {
	margin: 0 auto;
	max-width: 1120px;
}

#main #head_copy {
padding: 0 20px 50px 20px;
}

#main #head_copy p {
text-align: center;
font-size: 1.6rem;
line-height: 2.6rem;
margin-bottom: 30px;
}

#main #topics {
padding: 0 20px 0 20px;
}

#main #topics .inner{
max-width: 900px;
margin: 0 auto 50px auto;
}

#main #topics .listInner h3{
	font-size: 3.0rem;
	line-height: 3.2rem;
	margin-bottom: 20px;
	text-align: center;
}

#main #topics .listInner h3 span{
font-size: 2.0rem;
color: #B60005;
border-bottom: 3px solid #B60005;
}

#main #topics .inner .listInner{
margin-bottom: 50px;
}

#main #topics .inner .listInner dl {
	display:block;
	padding-bottom: 10px;
	margin-bottom: 15px;
	clear: both;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #CCC;
}

#main #topics .inner .listInner dt {
	display:block;
	font-size:1.4rem;
	line-height:2.0rem;
	margin-bottom: 5px;
	font-weight: bold;
	text-align: left;
	margin-bottom: 10px;
}

#main #topics .inner .listInner dt span{
background-color: #2D4E93;
padding: 5px 15px 5px 15px;
color: #FFF;
}

#main #topics .inner .listInner dd {
	display:block;
	line-height:2.0rem;
	font-size:1.6rem;
	text-align: left;
	margin: 0;
}

#main #topics .inner .listInner dd a {
	color: #333;
	text-decoration: none;
}

#main #topics .inner .listInner dd a:hover {
	color: #333;
	text-decoration: underline;
}

.pagination {
background: #f2f2f2;
padding: 20px;
margin-bottom: 50px;
max-width: 900px;
margin-left: auto;
margin-right: auto;
}

.page {
    display: inline-block;
    padding: 10px;
    margin-right: 4px;
	margin-bottom: 4px;
    border-radius: 3px;
    border: solid 1px #c0c0c0;
    background: #e9e9e9;
    box-shadow: inset 0px 1px 0px rgba(255,255,255, .8), 0px 1px 3px rgba(0,0,0, .1);
    font-size: 1.6rem;
    font-weight: bold;
    text-decoration: none;
    color: #717171;
    text-shadow: 0px 1px 0px rgba(255,255,255, 1);
}

.page:hover, .page.gradient:hover {
    background: #fefefe;
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FEFEFE), to(#f0f0f0));
    background: -moz-linear-gradient(0% 0% 270deg,#FEFEFE, #f0f0f0);
}

.page.active {
    border: none;
    background: #616161;
    box-shadow: inset 0px 0px 8px rgba(0,0,0, .5), 0px 1px 0px rgba(255,255,255, .8);
    color: #f0f0f0;
    text-shadow: 0px 0px 3px rgba(0,0,0, .5);
}

.page.gradient {
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#f8f8f8), to(#e9e9e9));
    background: -moz-linear-gradient(0% 0% 270deg,#f8f8f8, #e9e9e9);
}


#topics .detailInner{
margin-bottom: 50px;
padding-left: 20px;
padding-right: 20px;
}

#topics .detailInner h3 {
	font-size: 2.0rem;
	line-height: 3.0rem;
	padding-bottom: 10px;
	margin-bottom: 20px;
	border-bottom: 1px solid #CCC;
	text-align: left;
}

#topics .detailInner .date {
	display:block;
	font-size:1.6rem;
	line-height:2.0rem;
	margin-bottom: 10px;
	font-weight: bold;
	text-align: left;
}

#topics .detailInner .copy {
font-size: 1.6rem;
line-height: 3.0rem;
margin-bottom: 30px;
word-wrap:break-word;
}

#topics .detailInner .photo {
max-width: 1000px;
margin-left: auto;
margin-right: auto;
overflow: hidden;
}

#topics .detailInner .photo ul {
margin: 0 -2% 0 0; //ネガティブマージン
}

#topics .detailInner .photo li {
width: 48%;
margin: 0 2% 0 0;
margin-bottom: 20px;
float: left;
overflow: hidden;
}

#topics .detailInner .photo li .photoCopy{
font-size: 1.4rem;
line-height: 3.0rem;
height: 30px;
}

#topics .listBtn {
text-align: center;
}


@media all and (-ms-high-contrast:none){

	#main .link a {
		line-height: 53px;
	}

}

/*  PC ここまで
-------------------------------------------------------------------------------------------------------------------------*/

/*  max-width:960pxここから
-------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width : 960px ){
/*  max-width:960pxここまで
-------------------------------------------------------------------------------------------------------------------------*/
}

/*  max-width:768pxここから
-------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width : 768px ){
	#main .mainImg {
		margin-bottom: 40px;
		padding: 45px 20px;
	}
	
	#main .mainImg h2 {
		font-size: 20px;
	}

	#main .mainBox {
		padding: 30px 20px 20px;
	}
	
	#main .inner h3{
font-size: 3.0rem;
line-height: 4.0rem;
margin-bottom: 30px;
}
	
		#main .link a {
		font-size: 1.6rem;
		line-height: 40px;
		height: 45px;
	}
	
/*  max-width:768pxここまで
-------------------------------------------------------------------------------------------------------------------------*/
}

/*  max-width:480pxここから
-------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width: 480px) {

#main #topics .inner{
padding: 0px 0px 20px 0px;
}

#main #topics .listInner h3{
	font-size: 2.4rem;
	line-height: 2.6rem;
	margin-bottom: 20px;
}

#main #topics .listInner h3 span{
font-size: 1.6rem;
border-bottom: 2px solid #B60005;
}

#main #topics .inner .listInner{
margin-bottom: 20px;
}

#main #topics .inner .listInner dd {
	line-height:2.0rem;
	font-size:1.4rem;
}

#topics .detailInner{
margin-bottom: 50px;
padding-left: 10px;
padding-right: 10px;
}

#topics .detailInner h3 {
	font-size: 1.6rem;
	line-height: 2.6rem;
	padding-bottom: 10px;
	margin-bottom: 10px;
}

#topics .detailInner .copy {
font-size: 1.4rem;
line-height: 2.4rem;
margin-bottom: 20px;
}

#topics .detailInner .photo {
max-width: 480px;
}

#topics .detailInner .photo ul {
}

#topics .detailInner .photo li {
width: 100%;
margin: 0;
margin-bottom: 20px;
float: none;
}

/*  max-width:480pxここまで
-----------------------------------------------------------------------------------------------------------------*/
}
