@charset "utf-8";
/*-------------------------------------------

	下層共通CSS

--------------------------------------------*/

body {
	width: 100%;
	font-size: 1em;
	line-height: 1.4em;
	color: #000;
	font-family: verdana,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ","Meiryo","ＭＳ Ｐゴシック","MS PGothic",arial,Sans-Serif;
	background: url(../images/bg.gif) repeat 0 0;
	-webkit-text-size-adjust: none;}
	@media only screen and (orientation : landscape) {
		body { font-size: 1.3em; line-height:1.5em;}}

img {
	max-width: 100%;
	height: auto;}

a {
	color: #066eb2;
	text-decoration:underline;}

#container {
	width: 100%;
	padding: 8px 0;
	position: relative;}

header {
	width: 95%;
	margin: 0 auto;
	overflow: hidden;}

.bgTop, .bgBody, .bgBottom {
	max-width: 599px;
	margin: 0 auto;
	line-height:0;
	text-align:center;}

.bgBody {
	padding:4px 2% 8px 2%;
	background:#f4f0eb;
	overflow: hidden;
	-webkit-box-sizing:border-box;
		 -moz-box-sizing:border-box;
		 			box-sizing:border-box;}
	.bgBody div {
		padding: 7px 0;
		border-bottom: 2px solid #dfb0b2;
		overflow: hidden;}

#contents {
	width: 100%;
	padding: 10px 2%;
	margin-top: 10px;
	background:#f4f0eb url(../images/bg_contents.gif) no-repeat 0 0;
	background-size: 100%;
	-webkit-box-sizing:border-box;
		 -moz-box-sizing:border-box;
		 			box-sizing:border-box;}

#pageTop {
	text-align: right;
	margin:5px 0;}
	
	#pageTop img {
		width: 35%;}


/*-------------------------------------------

	過去の旅 一覧
	
-------------------------------------------*/

header h1 {
	width: 45%;
	float: left;}

nav {
	width:50%;
	margin: 10px 0 0 3%;
	float:left;}
	
nav li {
	margin: 0 0 5px 0;}
	
#contents > h1 {
	width: 30%;}

#backnumberList li{
	padding: 5px;
	margin: 10px 0;
	background: #fff url(../images/arrow_backnumber.gif) no-repeat 98% center;
	background-size: 9px 11px;
	border-left: 5px solid #dfb0b2;
	-webkit-box-shadow: 2px 2px 0 0 rgba(188,176,161,1.0);
		 -moz-box-shadow: 2px 2px 0 0 rgba(188,176,161,1.0);
					box-shadow: 2px 2px 0 0 rgba(188,176,161,1.0);
	-webkit-border-radius: 0.3em;
		 -moz-border-radius: 0.3em;
					border-radius: 0.3em;}
	@media only screen and (orientation : landscape) { /*横向き*/
		#backnumberList li{ background-size:auto;}}
		
#backnumberList li a {
	display: block;
	color:#000;
	text-decoration: none;}

li .place {

	font-weight: bold;
	color: #066eb2;}

/*-----------------------------------------

	過去の旅　詳細
	
-----------------------------------------*/
.number {
	padding:3px 2%;
	margin-right: 2%;
	background:#da4e7b;
	color: #fff;
	-webkit-border-radius: 1em;
		 -moz-border-radius: 1em;
					border-radius: 1em;}

.data {
	padding:3px 2%;
	background: #fff;
	-webkit-border-radius: 1em;
		 -moz-border-radius: 1em;
					border-radius: 1em;}

h2.place {
	margin: 10px 0;
	font-size:120%;
	font-weight: bold;
	color:#da4e7b;}

.tabibito {
	padding: 10px 4%;}

	.tabibito h1 {
		width:35%;}
	
	.tabibito > p {
		padding: 10px 0;}

#cast {
	padding:10px 0;
	text-align: center;
	overflow: hidden;}

#cast div {
	width: 50%;
	float:left;}

#cast p {
	width:95%;}
	
#cast img {
	border: 1px solid #c6c3bb;}

ul.jrodekake {
	margin-bottom: 20px;}
ul.jrodekake li {
	margin-bottom: 05px;}

/*旅詳細*/
.backnumber dl {
	background: #fff;
	margin-bottom: 15px;
	-webkit-border-radius: 0.4em;
		 -moz-border-radius: 0.4em;
					border-radius: 0.4em;
	-webkit-box-shadow: 2px 2px 0 0 rgba(188,176,161,1.0);
		 -moz-box-shadow: 2px 2px 0 0 rgba(188,176,161,1.0);
					box-shadow: 2px 2px 0 0 rgba(188,176,161,1.0);}
					
.backnumber dd {
	padding: 5px;}
.backnumber dd p {
	margin-bottom: 10px;}

.boxPink {
	border: 2px solid #e46d93;}
.boxBlue {
	border: 2px solid #209db4;}
.boxGreen {
	border: 2px solid #9fc127;}

/*アコーディオン：ヘッダー*/
.boxPink dt{
	border-top: 2px dotted #e46d93;
	background:url(../images/arrow_pink.gif) no-repeat 98% center;}
	.boxPink dd h4 {
		color: #e46d93;}
.boxBlue dt{
	border-top: 2px dotted #209db4;
	background:url(../images/arrow_blue.gif) no-repeat 98% center;}
	.boxBlue dd h4 {
		color: #209db4;}
.boxGreen dt{
	border-top: 2px dotted #9fc127;
	background:url(../images/arrow_green.gif) no-repeat 98% center;}

.boxPink dt:first-child, .boxBlue dt:first-child, .boxGreen dt:first-child {
	border:none;}

.boxPink dt, .boxBlue dt, .boxGreen dt{
	padding: 5px;
	padding-right: 6%;
	background-size: 10px 12px;}
	@media only screen and (orientation : landscape) { /*横向き*/
		.boxPink dt, .boxBlue dt, .boxGreen dt { background-size: auto;}}

			
/*アコーディオン：開いてる時*/
.select {
	font-weight: bold;
	font-size: 110%;
	color: #fff;
	background-size: 12px 11px;}

.boxPink .select {
	background:#e46d93 url(../images/arrow_yellow.png) no-repeat 98% center;
	background-size: 12px 11px;}
	@media only screen and (orientation : landscape) { /*横向き*/
		.boxPink .select { background-size: auto;}}

.boxBlue .select {
	background:#209db4 url(../images/arrow_yellow.png) no-repeat 98% center;
	background-size: 12px 11px;}
	@media only screen and (orientation : landscape) { /*横向き*/
		.boxBlue .select { background-size: auto;}}

.boxGreen .select {
	background:#9fc127 url(../images/arrow_yellow.png) no-repeat 98% center;
	background-size: 12px 11px;}
	@media only screen and (orientation : landscape) { /*横向き*/
		.boxGreen .select { background-size: auto;}}
	
/*-----------------------------------------

	ブリッジ
	
-----------------------------------------*/
#bridge, .bridge {
	padding: 20px 5%;
	color: #da4e7b;
	font-weight: bold;
	background: #fff;
	-webkit-border-radius: 0.4em;
		 -moz-border-radius: 0.4em;
					border-radius: 0.4em;}
					
#bridge .text, .bridge .text {
	padding-bottom: 20px;
	margin-bottom: 20px;
	border-bottom: 2px dotted #ddd8d1;}

#bridge .btn, .bridge .btn {
	width: 80%;
	margin: 0 auto;
	text-align: center;}

#bridge a, .bridge a,
#bridge .link, .bridge .link {
	color: #066eb2;
	text-decoration:underline;
	font-weight: bold;
	display: block;}