/* =================================
	interview CSS
================================= */
.color1{ color: #f5855e;}

/*	text_box
============================== */
@media all and (min-width: 768px) {
.text_box{
	margin-bottom: 3em;
}
}
@media all and (max-width: 767px) {
.text_box{
	margin-bottom: 2em;
}
}

/*	title
============================== */
.interview01 h2{ background-image:url(../img/interview/interview01_tit.jpg?20190313);}
.interview02 h2{ background-image:url(../img/interview/interview02_tit.jpg?20190313);}
.interview03 h2{ background-image:url(../img/interview/interview03_tit.jpg);}

.inter h2{
	background-repeat: no-repeat;
	text-indent:110%;white-space:nowrap;overflow:hidden;
}

@media all and (min-width: 768px) {
.inter h2{
	width: 820px;
	height: 282px;
	margin:0 0 30px;
}
}
@media all and (max-width: 767px) {
.inter h2{
	width: 100%;
	position: relative;
	height:0;
	padding-top:34.3902%;
	background-size:contain;
	border:none;
	margin: 0px 0 20px;
}
}

/*	q_text
============================== */
.q_text{
	color: #5b4a1f;
	font-weight: bold;
	margin-bottom:0.5em;
	position: relative;
	text-shadow:rgba(214,185,130,0.4) 1px 1px 0;
	letter-spacing:0.05em;
}
.q_text:before{
    display:inline-block;
	content: "";
	/*top: 50%;*/
    background-image: url(../img/interview/q_icon.png);
    background-repeat: no-repeat;
    position: absolute;
}
.q_text span{
	color: #fff;
	padding: 3px;
}
@media all and (min-width: 768px) {
.q_text{
	font-size: 140%;
	line-height: 1.5;
}
.q_text:before{
    width: 26px;
    height: 26px;
    background-size: 26px 26px;
    margin-top: 3px;
}
.q_text span{
	padding-left: 32px;
}
}
@media all and (max-width: 767px) {
.q_text{
	font-size: 110%;
	line-height: 1.5;
}
.q_text:before{
    width: 18px;
    height: 18px;
    background-size: 18px 18px;
    margin-top: 1px;
}
.q_text span{
	padding-left: 25px;
}
}

/*	text
============================== */

main article.oa p.txt {
	line-height:1.5;
}
main article.oa p.txt:not(:last-child) {
	margin-bottom:1.5em;
}
main p.txt a{
	color:#ed1a3d;
	font-weight: bold;
}
main p.txt a:hover{
	text-decoration:none;
}
@media all and (min-width: 768px) {
main article.oa{
	padding-bottom: 30px;
}
main article.oa p.txt {
	font-size:87.5%;
}
}
@media all and (max-width: 767px) {
main article.oa{
	padding-bottom: 15px;
}
main article.oa p.txt {
	font-size:83%;
}
}

/*	pics
============================== */
.pic_area_l span,.pic_area_r span{
	display: block;
    background-repeat: no-repeat;
    background-color: #fff338;
    box-shadow: 4px 4px #fff338;
}
@media all and (min-width: 768px) {
.pic_area_r span{
	margin: 5px 0 30px 30px;
	float: right;
}
.pic_area_l span{
	margin: 5px 30px 30px 0;
	float: left;
}
.pics span{ width: 330px; height: 219px; background-size: 330px 219px;}
.pics_h span{ width: 210px; height: 300px; background-size: 210px 300px;}
}
@media all and (max-width: 767px) {
.pic_area_l span,.pic_area_r span{
	margin: 15px auto 20px;
	display: block;
    background-repeat: no-repeat;
    background-position: center center;
}
.pics span{ width: 250px; height: 166px; background-size: 250px 166px;}
.pics_h span{ width: 166px; height: 237px; background-size: 166px 237px;}
}

/*	backnumber
============================== */
.bknm{
	border-top: 2px dashed #645224;
	padding-top: 20px;
}
.bknm h3{
	background-repeat:no-repeat;
	text-indent:110%;white-space:nowrap;overflow:hidden;
}
.bknm ul li{
    background-repeat: no-repeat;
    float: left;
}
.bknm ul li a{
	text-indent:110%;white-space:nowrap;overflow:hidden;
	display: block;
}

@media all and (min-width: 768px) {
.bknm h3{ width: 200px; height: 35px; background-size: 200px 35px;
margin:0 auto 20px;}
.bknm ul li{
	width: 400px;
	height: 150px;
    margin-right: 20px;
    margin-bottom: 20px;
}
.bknm ul li:nth-child(2n){
  	margin-right: 0px;
}
.bknm ul li a{
	width: 400px;
	height: 150px;
	transition: 0.2s ease-in-out;
}
.bknm ul li a:hover{
	opacity:0.7;
	background-color: #fff;
}
}
@media all and (max-width: 767px) {
.bknm{
	margin-bottom: 20px;
}
.bknm h3{ width: 150px; height: 26px; background-size: 150px 26px;
margin:0 auto 10px;}
.bknm ul li{
	margin:10px auto 0;
	width: 49%;
	float: left;
	margin-right: 2%;
}
.bknm ul li:nth-child(2n){
	margin-right: 0%;
}
.bknm ul li a{
	height: 0;
	display: block;
	background-size:100% 100%;
	padding-top: 37.5%;
	position: relative;
	overflow: hidden;
	transition: color 0.3s;
}
.bknm ul li a span{
	display:block;
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
}

/*	guest_area
============================== */
.guest_tit{
	color: #5b4a1f;
	text-shadow:rgba(214,185,130,0.7) 2px 2px 1px;
	text-align: center;
}
@media all and (min-width: 768px) {
.guest_area{
	margin: 55px 0 0;
	padding-top: 25px;
}
.guest_tit{
	font-size: 160%;
	border-top:2px solid #5b4a1f;
	border-bottom:2px solid #5b4a1f;

}
}
@media all and (max-width: 767px) {
.guest_area{
	margin: 30px 0 10px;
	padding-top: 10px;
}
.guest_tit{
	font-size: 130%;
	border-top:1px solid #5b4a1f;
	border-bottom:1px solid #5b4a1f;
}
}

/*	bk_memlist
============================== */
ul.bk_memlist {
	display: flex;
	flex-wrap: wrap;
}
ul.bk_memlist li{
	background-color: #dac17f;
	box-shadow:rgba(218,193,127,0.4) 2px 2px 1px;
}
ul.bk_memlist li .lazy {
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center center;
	display: block;
	margin: 0 auto 0px;
	position: relative;
	height: 0;
	padding-top: 66.6666%;
	text-align: center;
}
ul.bk_memlist li a{
	display: block;
	text-decoration: none;
	color: #6e5a2c;
	text-align: center;
	line-height: 1.5;
	padding: 8px 0;
	position: relative;
}
ul.bk_memlist li a::after {
  content: '';
  width: 8px;
  height: 8px;
  border: 0px;
  border-top: solid 2px #4e3e1a;
  border-right: solid 2px #4e3e1a;
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  top: 50%;
  right: 13px;
  margin-top: -5px;
  transition: all 0.2s;
}
ul.bk_memlist .name{
	font-size: 130%;
	color: #4e3f1b;
}
@media all and (min-width: 768px) {
.bknm_area{
	margin: 70px 0 0;
}
ul.bk_memlist {
	margin: 25px auto 0;
}
ul.bk_memlist li {
	width: 33.3333%;
	float: left;
	margin: 3px 7px 30px;
	width: -webkit-calc(100% / 3 - 14px);
	width: calc(100% / 3 - 14px);
}
ul.bk_memlist li a{
	transition: 0.2s ease-in-out;
}
ul.bk_memlist li a:hover{
	filter: alpha(opacity=40);
	-moz-opacity:0.4;
	opacity:0.4;
}
ul.bk_memlist li .lazy{
	margin: 0 0 0px;
}
ul.bk_memlist .name{
	font-size: 130%;
}
}
@media all and (max-width: 767px) {
.bknm_area{
	margin: 30px 0 0;
}
ul.bk_memlist {
	margin: 15px auto 0;
}
  ul.bk_memlist li {
	width: 50%;
	float: left;
	margin: 2px 4px 20px;
	width: -webkit-calc(100% / 2 - 8px);
	width: calc(100% / 2 - 8px);
}
ul.bk_memlist li .lazy{
	margin: 0 0 0px;
}
ul.bk_memlist .name{
	font-size: 110%;
}
}
