﻿@charset "utf-8";

/* traveler ***************************/

#ov_custom .traveler{}



/*▼これまでの記録*/
/*枠*/
#ov_custom .traveler .archives{
	margin:0.5rem auto;
	padding-left:1%;
}
#ov_custom .traveler .archives:after{content:"";clear: both;display: block;}	/*cf*/

#ov_custom .traveler .archives > ul{
	position:relative;
}
#ov_custom .traveler .archives > ul > li{
	position:relative;
	display:inline-block;vertical-align: top;
	width:49%;
	margin-top:1rem;
}

/*データ*/
#ov_custom .traveler .archives .data{
	position:relative;
	border:1px solid #28375e;
	width:100%;height:16rem;
}

#ov_custom .traveler .archives .data li{
	position:absolute;
	padding:0.5rem;
}


#ov_custom .traveler .archives .data .number{
	font-size:1.6rem;color:white;background-color:#28375e;
	top:1rem;left:0.5rem;
}


#ov_custom .traveler .archives .data .photo{
	top:1rem;right:1rem;
	width:40%;max-width:120px;

}
#ov_custom .traveler .archives .data .storytitle{
	font-size:1.6rem;color:#28375e;font-weight:bold;
	top:6rem;left:1rem;
	width:58%;

}

#ov_custom .traveler .archives .data .storytitle a{
	color:#28375e;
}

#ov_custom .traveler .archives .data .storytitle a:after{
	content:"　";
	display:inline-block;
	width:1.6rem;
	height:1.6rem;
	background:url( /img/traveler/link_button-bw.gif);
	background-size:contain;
	background-position:right;
	vertical-align:middle;
}






/*表示領域が●px以下の場合**/

@media screen and (max-width: 1025px) {
/*↓↓*/
}/*↑↑*/

@media screen and (max-width: 800px) {
/*↓↓*/

#ov_custom .traveler .archives > ul > li{position:relative;display:block;width:96%;}
#ov_custom .traveler .archives .data .storytitle br{display:none;}

}/*↑↑*/

@media screen and (max-width: 670px) {
/*↓↓*/

#ov_custom .traveler .archives > ul > li{position:relative;display:block;width:100%;}
#ov_custom .traveler .archives .data .storytitle br{display:inline;}


}/*↑↑*/
@media screen and (max-width: 400px) {
/*↓↓*/

#ov_custom .traveler .archives > ul > li{position:relative;display:block;width:100%;}

#ov_custom .traveler .archives .data{position:relative;width:100%;height:14rem;}

	#ov_custom .traveler .archives .data .storytitle{
        top: 4.6rem;
        left: 1rem;
        width: 56%;
        font-size: 15px;
        text-shadow: none;
        line-height: 1.5;
	}

}/*↑↑*/

/******************************************/

/*▼ナンバリングページ*/
.traveler p img{
width:100%;	
}
#ov_custom .traveler .travels{
	width:100%;margin:2rem auto;
	padding:1rem 0em;
	background:url(/img/traveler/back01-penink.jpg) ;
	background-size:cover;
	background-position:bottom right;
	overflow:hidden;
}

#ov_custom .traveler .travels p{
	margin:0;
	font-size:1.6rem;
	line-height:2.6rem;
	background-size: 100% 2.6rem;

}




#ov_custom .traveler .travels p:before{content:"　";}
#ov_custom .traveler .travels p:after{content:"\A\A";white-space:pre;}



#ov_custom .traveler .travels .box_sideby{
	margin:1rem auto;width:90%;
	background-color:white;
}
#ov_custom .traveler .travels .box_sideby .box_item{}
#ov_custom .traveler .travels .box_sideby .box_item figure{}
#ov_custom .traveler .travels figure img{
	width:100%;
	margin-bottom:0.4rem;
}
#ov_custom .traveler .travels figure figcaption{
	font-size:1.2rem;line-height:1.2em;
}










/*表示領域が●px以下の場合**/

@media screen and (max-width: 800px) {
	
	#ov_custom .traveler .travels p{
	margin:0;
	font-size:1.5rem;


}
/*↓↓*/

#ov_custom .traveler .travels .box_sideby{
	width:100%;
}
#ov_custom .traveler .travels .box_sideby .yoko3 .box_item{
	width:47%;
}

}/*↑↑*/

@media screen and (max-width: 670px) {
/*↓↓*/


#ov_custom .traveler .travels .box_sideby .yoko3 .box_item{
	width:100%;
}

}/*↑↑*/

/******************************************/




