/* ===============================
	PC
 =============================== */

/* main-visual */
	
#main-visual {
	width: 100%;
	height: 300px;
	background-image: url(../gallery/images/h2_bg.jpg);
	background-size: cover;
	display: flex;
	align-items: center;
	justify-content: center;
}

#main-visual .h2_box {
width: 200px;
height: 200px;
border: solid 1px #FFF;
	display: flex;
	align-items: center;
	justify-content: center;
}

#main-visual h2 {
color: #FFF;
font-weight: normal;
font-size: 3.0rem;
line-height: 3.2rem;
text-align: center;
}

#main-visual h2 span{
	font-size:1.8rem;
	color: #FFF100;
}

#main  {
width: 100%;
padding-top: 50px;
}

#main .top_copy {
font-size: 2.0rem;
line-height: 3.0rem;
text-align: center;
margin-bottom: 70px;
}

#main #topics {
padding: 0 20px 0 20px;
overflow: hidden;
}

#main #topics .inner{
max-width: 900px;
margin: 0 auto 80px 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{
padding-top: 10px;
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;
	font-weight: bold;
	text-align: left;
	margin-bottom: 10px;
}

#main #topics .inner .listInner dt span{
background-color: #003366;
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;
	padding-bottom: 10px;
	margin-bottom: 10px;
	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: 2.4rem;
margin-bottom: 30px;
}

#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;
}


/*  PC ここまで
-------------------------------------------------------------------------------------------------------------------------*/

/*  max-width:960pxここから
-------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width : 960px ){




/*  max-width:960pxここまで
-------------------------------------------------------------------------------------------------------------------------*/
}


/*  max-width:768pxここから
-------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width : 768px ){



/*  max-width:768pxここまで
-------------------------------------------------------------------------------------------------------------------------*/
}




/*  max-width:480pxここから
-------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width: 480px) {



/*  max-width:480pxここまで
-----------------------------------------------------------------------------------------------------------------*/
}