/*///----- column -----///*/
#columnBox{ background-color: #fff;}
#columnBox h2{position:relative;
	background-image:url(../img/relay_column/title.jpg) ;background-repeat:no-repeat;}
#columnBox h2 small{position: absolute;bottom: 0px; right: 5px;font-size:120%;line-height:100%;font-weight:bold;color:#004561;transform: rotate(.03deg);}
#columnBox h3{font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue","游ゴシック Medium",YuGothic,YuGothicM,"Hiragino Kaku Gothic ProN",メイリオ,Meiryo,sans-serif;
	color:#004561;
}
.writer{ float: right; margin:0.5em 0 0;}
	#columnBox .txt small{font-size:80%;}
	.book_name{ font-weight: 800;}

@media all and (min-width: 768px) {
#columnBox {width:590px;margin:30px 0;}
#columnBox h2{width:590px;height:240px;}
	#columnBox .innerbox{width:540px;padding:20px 0;margin:0 auto;}
	#columnBox .innerbox2{width:540px;padding:10px 0;margin:0px auto 25px;}
	#columnBox h3{font-size:140%;}
	#columnBox h3 span{line-height:1.5;}
	#columnBox .txt{margin-top:20px;font-size:100%;}
	.br-sp { display:none;}
}

@media all and (max-width: 767px) {
#columnBox{width:100%;margin:0;padding:0;}
#columnBox h2{width:100%;height:0;padding-top:40.7%;background-size:cover;}
	#columnBox .innerbox{width:90%;;padding:2em 0;margin:0 auto;}
	#columnBox .innerbox2{width:90%;;padding:2em 0;margin:0 auto;}
	#columnBox h3{font-size:110%;}
	#columnBox h3{height:30px;}
	#columnBox h3 span{display:block;line-height:30px;}
	#columnBox .txt{margin-top:2em;}
}

@media all and (max-width: 320px) {
	#columnBox h3 span{line-height:1;}
}

/*///////////////// btnBox ////////////////*/
.btnBox{
	padding: 15px 25px;
	background-image:url(../img/relay_column/column_border.png);
	background-repeat:repeat-x;
	background-position: bottom;
}
.btnBox_bottom{
	padding: 15px 25px;
	background-image:url(../img/relay_column/column_border.png);
	background-repeat:repeat-x;
	background-position: top;
}
.btnBox li{
	background-repeat: no-repeat;
}
.btnBox li.b_btn{
	float: left;
}
.btnBox li.n_btn{
	float: right;
}
.btnBox li a{
	display: block;
}
.btnBox li.b_btn a{
	background-image:url(../img/relay_column/b_btn.png);
}
.btnBox li.n_btn a{
	background-image:url(../img/relay_column/n_btn.png);
}
.btnBox li.b_btn a:hover{
	background-image:url(../img/relay_column/b_btn2.png);
}
.btnBox li.n_btn a:hover{
	background-image:url(../img/relay_column/n_btn2.png);
}
@media all and (min-width: 768px) {
.btnBox li{
	width: 80px;
	height: 43px;
}
.btnBox li a{
	width: 80px;
	height: 43px;
	transition: 0.2s ease-in-out;
}
}
@media all and (max-width: 767px) {
.btnBox li{
	width: 70px;
	height: 38px;
}
.btnBox li a{
	width: 70px;
	height: 38px;
	background-size: 70px 38px;
}
}

/*///////////////// fukidashi ////////////////*/
.point{  display: flex;
  justify-content: center;
  flex-flow: row wrap;}

.point .fukidashi{position: relative;display: inline-block;margin:0;padding: 0;background:#eff5fd;}
.point .fukidashi:after{
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  left: -15px;
  top: 30px;
  border-right: 15px solid #eff5fd;
  border-top: 15px solid transparent;
  border-bottom: 15px solid transparent;}
.point .icon1{display:block;background:url(../img/relay_column/icon.jpg) no-repeat;}
.point .icon2{display:block;background:url(../img/relay_column/icon2.jpg) no-repeat;}
.point .icon3{display:block;background:url(../img/relay_column/icon3.jpg?20180921) no-repeat;}
.point .icon4{display:block;background:url(../img/relay_column/icon4.jpg) no-repeat;}
.point .photographer{
	text-align: right;
	float: right;
	font-size: 70%;
	margin-top: -7px;
}
@media all and (min-width: 768px) {
.point .icon{width:160px;height:150px;}
.point .icon4{width:100px;height:144px; background-size: 100px 144px;}
.point .pointBox{width:380px;}
.pointBox p{padding:0 20px 20px;}
.innerbox2 .pointBox p{padding:0 20px 20px 50px;}
}

@media all and (max-width: 767px) {
.point{width:100%;}
.point .icon{width:30%;height:0;padding-top:30%;background-size:contain;}
.point .icon4{width:20%;height:0;padding-top:30.375%;background-size:contain;}
.point .pointBox{width:70%;}
.pointBox p{padding:0 1em 1em;}
.point .icon{position:relative;}
.point .icon img {position:absolute;top:0;left:0;}
}

/*	picBox
=================================== */
.pic1_2,
.pic1_2 .lazy{ width: 150px; height: 307px; background-size:150px 307px;}
.pic1_3,
.pic1_3 .lazy{ width: 240px; height: 307px; background-size:240px 307px;}
.pic3_1,
.pic3_1 .lazy{ width: 400px; height: 267px; background-size:400px 267px;}
.writer_name{
	font-weight:800;
	margin-bottom: 0.5em;
	display: block;
	color:#004561;
}
@media all and (min-width: 768px) {
.picBox {
	text-align: center;
	margin: 20px 0 15px 0;
}
.picBox .ph {
	background-color:#f4f1e4;
	margin: 0 auto;
}
.picBox .lazy {
	display: block;
}
.picBox .p_caption {
	font-size: 65%;
	text-align: center;
	line-height:1.7;
	color: #434343;
	display: inline-block;
	padding-top: 5px;
}
.pic1_1,
.pic1_1 .lazy{ width: 400px; height: 307px;}
.pic2_1,
.pic2_1 .lazy{ width: 335px; height: 253px;}
.pic2_2,
.pic2_2 .lazy{ width: 335px; height: 260px;}
.pic2_3,
.pic2_3 .lazy{ width: 240px; height: 364px;}
.pic3_1,
.pic3_1 .lazy{ width: 400px; height: 267px;}
.picBox_area{
	width: 400px;
	margin: 20px auto 0;
}
.picBox_l{
	float: left;
	width: 150px;
}
.picBox_r{
	float: right;
	width: 240px;
}
}
@media all and (max-width: 767px) {
.picBox {
	text-align: center;
	margin: 20px auto 10px;
}
.picBox .ph{
    display: block;
    background-repeat: no-repeat;
    background-position: center center;
    background-color:#f4f1e4;
		margin: 0 auto;
}
.picBox .lazy{
		display: block;
}
.pic1_1,
.pic1_1 .lazy{ width: 270px; height: 180px; background-size:270px 180px;}

.pic2_1,
.pic2_1 .lazy{ width: 270px; height: 204px; background-size:270px 204px;}
.pic2_2,
.pic2_2 .lazy{ width: 270px; height: 210px; background-size:270px 210px;}
.pic2_3,
.pic2_3 .lazy{ width: 240px; height: 364px; background-size:240px 364px;}
.pic3_1,
.pic3_1 .lazy{ width: 240px; height: 160px; background-size:240px 160px;}
.picBox_area{
	margin: 30px 0 0;
}
.picBox .p_caption {
	font-size: 80%;
	text-align: center;
	line-height: 1.2;
	color: #434343;
}
}

/*///////////////// photo ////////////////*/
.column .photo_tate,
.column .photo_yoko,
.column .photo_square{display:block;background-color:#f4f1e4;}

@media all and (min-width: 768px) {
.column .photo_tate .lazy{display:block;width:300px;height:400px;}
.column .photo_yoko .lazy{display:block;width:400px;height:300px;}
.column .photo_square .lazy{display:block;width:400px;height:400px;}
.column .photo_tate{display:block;width:300px;height:400px;margin:10px auto;}
.column .photo_yoko{display:block;width:400px;height:300px;margin:10px auto;}
.column .photo_square{display:block;width:400px;height:400px;margin:10px auto;}
}
@media all and (max-width: 767px) {
.column .photo_tate{width:70%;margin:1em auto;}
.column .photo_square{width:80%;margin:1em auto;}
.column .photo_tate .lazy{display:block;width:100%;height:0;padding-top:133.5%;}
.column .photo_yoko .lazy{display:block;width:100%;height:0;padding-top:75%;margin:1em auto;}
.column .photo_square .lazy{display:block;width:100%;height:0;padding-top:100%;margin:1em auto;}
 }