@charset "UTF-8";

@font-face {
	font-family: 'font1';
	src: url(/um/library/fonts/Lusitana/Lusitana-Regular.ttf);
}

.vol1 .box #Img1{background-image: url(../interview/img/vol1_p1.jpg);}
.vol1 .box #Img2{background-image: url(../interview/img/vol1_p2.jpg);}
.vol1 .box #Img3{background-image: url(../interview/img/vol1_p3.jpg);}
#backnumber .thum1 a{ background-image:url(../interview/img/vol1_p1.jpg);}
@media all and (min-width: 768px) {.vol1 #mainImg{ background-image: url(../interview/img/vol1_main.jpg);}}
@media all and (max-width: 767px) {.vol1 #mainImg{ background-image: url(../interview/img/vol1_main_smp.jpg);}}

.vol2 .box #Img1{background-image: url(../interview/img/vol2_p1.jpg);}
#backnumber .thum2 a{ background-image:url(../interview/img/vol2_p1.jpg);}
@media all and (min-width: 768px) {.vol2 #mainImg{ background-image: url(../interview/img/vol2_main.jpg);}}
@media all and (max-width: 767px) {.vol2 #mainImg{ background-image: url(../interview/img/vol2_main_smp.jpg);}}

.vol3 .box #Img1{background-image: url(../interview/img/vol3_p1.jpg);}
.vol3 .box #Img2{background-image: url(../interview/img/vol3_p2.jpg);}
#backnumber .thum3 a{ background-image:url(../interview/img/vol3_p1.jpg);}
@media all and (min-width: 768px) {.vol3 #mainImg{ background-image: url(../interview/img/vol3_main.jpg);}}
@media all and (max-width: 767px) {.vol3 #mainImg{ background-image: url(../interview/img/vol3_main_smp.jpg);}}

.vol4 .box #Img1{background-image: url(../interview/img/vol4_p1.jpg);}
.vol4 .box #Img2{background-image: url(../interview/img/vol4_p2.jpg);}
.vol4 .box #Img3{background-image: url(../interview/img/vol4_p3.jpg);}
#backnumber .thum4 a{ background-image:url(../interview/img/vol4_p1.jpg);}
@media all and (min-width: 768px) {.vol4 #mainImg{ background-image: url(../interview/img/vol4_main.jpg);}}
@media all and (max-width: 767px) {.vol4 #mainImg{ background-image: url(../interview/img/vol4_main_smp.jpg);}}

.vol5 .box #Img1{background-image: url(../interview/img/vol5_p1.jpg);}
.vol5 .box #Img2{background-image: url(../interview/img/vol5_p2.jpg);}
.vol5 .box #Img3{background-image: url(../interview/img/vol5_p3.jpg);}
#backnumber .thum5 a{ background-image:url(../interview/img/vol5_p1.jpg);}
@media all and (min-width: 768px) {.vol5 #mainImg{ background-image: url(../interview/img/vol5_main.jpg);}}
@media all and (max-width: 767px) {.vol5 #mainImg{ background-image: url(../interview/img/vol5_main_smp.jpg);}}

.vol6 .box #Img1{background-image: url(../interview/img/vol6_p1.jpg);}
.vol6 .box #Img2{background-image: url(../interview/img/vol6_p2.jpg);}
.vol6 .box #Img3{background-image: url(../interview/img/vol6_p3.jpg);}
#backnumber .thum6 a{ background-image:url(../interview/img/vol6_p1.jpg);}
@media all and (min-width: 768px) {.vol6 #mainImg{ background-image: url(../interview/img/vol6_main.jpg);}}
@media all and (max-width: 767px) {.vol6 #mainImg{ background-image: url(../interview/img/vol6_main_smp.jpg);}}

/* -----------------------------------------------------------
   NEWS
------------------------------------------------------------*/
#contentsArea h1{text-indent:-9999px;}

.box:last-child{ margin-bottom:0;}
.box p:last-child{ margin-bottom:0;}
.box a{
	color:#e4007f;
	}

/* BACKNUMBER*/
#backnumber ul{list-style:none;}
#backnumber li{
	overflow:hidden;
	text-align:center;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;}
#backnumber li span{
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
	}

@media all and (min-width: 768px) {
#contentsArea{
	background-image:url(../img/interview_header.jpg);
	background-repeat: no-repeat;
	background-color: #fff;
	padding-top: 200px;
}
#contentsArea #mainImg{
	width: 900px;
	height: 360px;
	margin: 0 auto 30px;
}

#contentsArea .inner{
	padding:0 40px 40px;
	}
#contentsArea h1,#contentsArea h2{
	text-indent:-9999px;
	display: none;
	}
.box{
	margin-bottom:20px;
	}
.box h3{
	font-size:100%;
	line-height:1.4;
	padding:10px  8px 8px;
	color: #3c87a7;
	background-color: #f3f5f6;
	text-align: center;
	margin-bottom: 20px;
	}
.box p{
	font-size:94%;
	line-height:1.6;
	margin-bottom:15px;
	}
.box .photo{
	width: 300px;
	height: 200px;
	background-size: cover;
}
.box .p-left{
	float: left;
	margin: 0 20px 10px 0;
}
.box .p-right{
	float: right;
	margin: 0 0 10px 20px;
}

/* BACKNUMBER*/
#backnumber h3{
	display:block;
	width:980px;
	font-family: font1;
	font-size:180%;
	background:#cdd8dc;
	color:#5e7179;
	text-align:center;
	padding:15px 0 10px;
	letter-spacing:0.06em;
	}
#backnumber ul{
	padding:30px;
	}
#backnumber li{
	width:170px;
	float:left;
	margin-right:17.5px;
	margin-bottom:10px;
	letter-spacing:0.06em;
	}
#backnumber li:nth-child(5n){
	margin-right:0;
	}
#backnumber a{
	display:block;
	width:170px;
	color:#5e7179;
	font-weight:bold;
	padding-top:116px;
	background-size:contain;
	background-repeat:no-repeat;
	background-position:center top;
	}
#backnumber a:hover{
	filter: alpha(opacity=80);-moz-opacity:0.80;opacity:0.80;
	}
#backnumber span{
	display:block;
	padding-top:2px;
	font-size:90%;
	}

}
@media all and (max-width: 767px) {
#contentsArea h1{
	display:block;
	width:100%;
	height:0;
	padding-top:28.125%;
	background-size:cover;
	background-image:url(../img/interview_header_smp.jpg);
	}
#contentsArea h2{
	text-indent:-9999px;
	display: none;
	}
#contentsArea .inner{
	width:90%;
	margin:0 auto;
	padding:0 0 20px;
	}
#contentsArea #mainImg{
	width: 90%;
	height: 0;
	margin: 0 auto 20px;
	padding-top: 70.3125%;
	background-size: cover;
}
.box{
	margin-bottom:10px;
	}
.box h3{
	font-size:86%;
	line-height:1.4;
	padding:8px;
	color: #3c87a7;
	background-color: #f3f5f6;
	text-align: center;
	margin-bottom:10px;
	}
.box p{
	font-size:80%;
	line-height:1.6;
	margin-bottom:15px;
	}
.box .photo{
	width: 100%;
	height: 0;
	margin: 0 auto 10px;
	padding-top: 66.666%;
	background-size: cover;
}

/* BACKNUMBER*/
#backnumber{
	width:100%;
	margin:0 auto;
	}
#backnumber h3{
	width:100%;
	font-family: font1;
	font-size:100%;
	background:#cdd8dc;
	color:#5e7179;
	text-align:center;
	padding:8px 0 6px;
	letter-spacing:0.02em;
	margin-bottom:10px;
	}
#backnumber ul{
	width:96%;
	margin:0 auto;
	}
#backnumber li{
	width:24%;
	float:left;
	margin-right:1%;
	margin-bottom:1%;
	text-align:center;
	text-align:center;
	}
#backnumber li:nth-child(4n){
	margin-right:0;
	}
#backnumber a{
	display:block;
	width:100%;
	color:#5e7179;
	padding-top:66.176%;
	background-size:contain;
	background-repeat:no-repeat;
	background-position:center top;
	}
#backnumber span{
	display:block;
	padding:3px 6px;
	font-size:64%;
	line-height:1.2;
	font-weight: normal;
	}
}