@charset 'utf-8';

html{
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}

body{
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}

.clrfx:before,.clrfx:after {content: " ";display: table;}
.clrfx:after {clear: both;}
.clrfx {*zoom: 1;}
.fl {float: left;}
.fr {float: right;}
.tac{text-align: center;}
.ml_05 {margin-left: -0.5em;}
.hoverOp:hover{	filter: alpha(opacity=60);	opacity: 0.6;}
.opcity{filter: alpha(opacity=50);opacity: 0.5;}


a:hover {/*マウスをのせたとき*/
	color:#4E4E4E;
	font-style:normal;
	text-decoration:underline;
	opacity: 0.5;
}

a:link{
	color: #86c0ce;
	text-decoration: none;
}
a:active {/*クリック中*/
	text-decoration:none;
}

/* Common
 * --------------------------------------------------------*/

#wrapper{
	background-image: url(/store/techo/ja/amacho/images/back_img.png);
	background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  height: 100%;
	font-family: "Hiragino Kaku Gothic W1 JIS2004";
	color: #686868;
	margin-top: 79px;
}
.header{
	width: 800px;
	margin: 0 auto;
	display: table;
	height: 80px;
	position: relative;
	top: -80px;
}
.techo{
	display: table-cell;
	vertical-align: middle;
	padding-top: 20px;
	float: left;
}
.share{
	display: inline-block;
	vertical-align: baseline;
}
ul.share__{
	float: right;
  padding-top: 10px;
}
li.share{
	list-style-type: none;
	display: table-cell;
	vertical-align: top;
	padding-left: 5px;
}
.title_area{
	background-image: url(/store/techo/ja/amacho/images/titleback_1.png);
	background-position: top;
	background-repeat: no-repeat;
	position: relative;
	top: -80px;
}
.title{
	width: 350px;
  margin: 0 auto;
  height: 1100px;
	padding-top: 60px;
}
.yodogawa{
	position: relative;
	display: block;
	top: -80px;
	width: 100%;
	height: 920px;
	background-color: #FFF;
}

.yodogawa p{
	writing-mode: tb-rl; /*IE*/
	-o-writing-mode: vertical-rl; /*Opera*/
	-webkit-writing-mode: vertical-rl; /*Chrome, Safari*/
	writing-mode: vertical-rl; /*Firefox, Edge*/
	position:absolute;
  top:25%;
  left:48%;
  display:inline;
  transform:translate(-50%, -50%);
	line-height: 1.9em;
	letter-spacing: 0.095em;
}
span.tcy{
	text-combine-upright: all;
	letter-spacing: 0em;
}
span.upright{
	text-orientation: upright;
}
.contents{
	width: 700px;
	margin: 0 auto;
	position: relative;
	top: -470px;
	font-size: 17px;
	letter-spacing: 0.12em;
}
.contents p{
	border-bottom-style: dotted;
  border-width: thin;
	padding-bottom: 17px;
	padding-left: 5px;
	padding-right: 5px;
}
span.date{
	float: right;
  letter-spacing: 0.1em;
  font-size: 13px;
}

.honmon_area{
	width: 800px;
	margin: 0 auto;
	background-color: #FFF;
	position: relative;
	top: -370px;
	margin-bottom: -300px;
}

.honmon_ph{
	width: 600px;
	margin: 0 auto;
}

.profile_left{
	width: 290px;
  position: relative;
  left: 30px;
  top: -130px;
}

.profile_left p.name{
	color: #86c0ce;
	font-size: 15px;
  letter-spacing: 0.08em;
}

.profile_left p.prof{
	font-size: 11px;
	padding-bottom: 10px;
}

.profile_right{
	width: 290px;
  position: relative;
	left: 500px;
  top: -260px;
}

.profile_right p.name{
	color: #86c0ce;
	font-size: 15px;
  letter-spacing: 0.08em;
}

.profile_right p.prof{
	font-size: 11px;
	padding-bottom: 10px;
}

.sub_text{
	text-align: center;
  line-height: 1.8em;
  letter-spacing: 0.1em;
  font-size: 18px;
  padding-top: 20px;
	position: relative;
	top: -200px;
}

.conv{
	width: 600px;
	margin: 0 auto;
	padding-top: 20px;
	line-height: 1.8em;
	letter-spacing: 0.06em;
	font-size: 15px;
	position: relative;
	top: -150px;
}
.conv dl{
	display: table;
	width: 100%;
	padding-bottom: 40px;
}

.conv dt{
	vertical-align: top;
	display: table-cell;
	width: 100px;
	padding-left: 25px;
	text-align: right;
	color: #86c0ce;
	text-align: center;
}

.conv dd{
	display: table-cell;
	vertical-align: top;
	padding-left: 15px;
}

.next{
	text-align: center;
	font-size: 12px;
	padding-bottom: 30px;
}

.date_end{
	text-align: center;
	font-size: 12px;
	padding-bottom: 20px;
}

.info_guidebook{
	text-align: center;
	font-size: 15px;
	padding-bottom: 50px;
}

.footer{
	width: 550px;
	margin: 0 auto;
	padding-bottom: 50px;
}

.footer ul li{
	float: left;
	list-style-type: none;
}

.copyright{
	text-align: center;
	letter-spacing: 0.15em;
	font-size: 12px;
	padding-top: 30px;
	color: #FFF;
}

/* 2回目
 * --------------------------------------------------------*/
.sub_text_02{
	text-align: center;
	line-height: 1.8em;
	letter-spacing: 0.1em;
	font-size: 18px;
	padding-top: 20px;
	position: relative;
	top: 0px;
}

.conv{
	top: 0px;
}

.cap{
	text-align: center;
  font-size: 14px;
  padding-bottom: 30px;
}

 .colum{
	 width: 600px;
   margin: 0 auto;
   border-style: solid;
   border-radius: 10px;
   border-color: #86c0ce;
   height: 100%;
   margin-top: 50px;
   border-width: thin;
   padding-top: 25px;
   margin-bottom: 50px;
   padding-bottom: 25px;
  }

 .colum_title{
	 width: 570px;
   margin: 0 auto;
   height: 50px;
   border-radius: 25px;
   text-align: center;
   background-color: #86c0ce;
   position: relative;
   top: -60px;
  }

.colum_title p{
	color: #FFF;
  padding-top: 10px;
  font-size: 20px;
  font-weight: 600;
}

 .colum_sub_text{
	text-align: center;
	font-size: 16px;
	position: relative;
	top: -50px;
 }
 .colum_ph{
	 width: 480px;
	 margin: 0 auto;
 }
 .colum_talk{
	 width: 480px;
	 margin: 0 auto;
	 text-align: left;
	 padding-top: 30px;
	 font-size: 16px;
 }

 span.colum_name{
	 color: #86c0ce;
 }

 .mark{
	 width: 480px;
	 height: auto;
	 background-color: #86c0ce;
	 border-radius: 10px;
	 padding: 5px 0px 5px 25px;
 }

 .mark p{
	 color: #FFF;
	 line-height: 2.3em;
 }

.navi{
	width: 300px;
	margin: 0 auto;
	padding-bottom: 60px;
}

.navi ul{
	padding: 0 0 0 0;
}

.navi ul li{
	list-style-type: none;
	float: left;
	padding-bottom: 20px;
	padding-right: 19px;
}

/* 3回目
 * --------------------------------------------------------*/
.ex_name{
	text-align: center;
	font-size: 18px;
	color: #86c0ce;
	margin-top: 50px;
}


/* アーカイブ用
 * --------------------------------------------------------*/
 .honmon_area_archive01{
	 width: 800px;
	 margin: 0 auto;
	 background-color: #FFF;
	 position: relative;
	 top: -80px;
	 margin-bottom: -300px;
 }

 .honmon_area_archive02{
 	width: 800px;
 	margin: 0 auto;
 	background-color: #FFF;
 	position: relative;
 	top: -370px;
 	margin-bottom: -300px;
 }
.honmon_area_archive03{
 	width: 800px;
 	margin: 0 auto;
 	background-color: #FFF;
 	position: relative;
 	top: -160px;
 	margin-bottom: -100px;
 }


/* スマホ対応
 * --------------------------------------------------------*/

@media only screen and (max-device-width: 600px) {

	br.br__{
		display: none;
		letter-spacing: -0.5em;
	}

	body{
		width: 100%;
	}
	#wrapper{
		width: 100%;
		background-image: none;
	}
	.header{
		width: 60%;
    margin: 0 auto;
	}
	.techo{
		position: relative;
		left: 20%;
	}

	ul.share{
		float: right;
		padding-top: 10px;
		padding-left: 0px;
		width: 100%;
	}
	.share{
		text-align: center;
	}
	.title_area{
		background-image: url(/store/techo/ja/amacho/images/titleback_sp.png);
	}
	.title{
		width: 100%;
	  height: 900px;
	}
	.title img{
		width: 70%;
		margin-left: 15%;
	}
	.yodogawa{
		width: 90%;
	}

	.yodogawa p{
		-webkit-writing-mode: horizontal-tb;
		width: 80%;
		position: relative;
		top: 0%;
		left: 5%;
	}
	.contents{
		width: 80%;
		position: relative;
		top: 0px;
	}

	.contents p{
		padding-bottom: 25px;
	}

	.honmon_area{
		width: 80%;
		position: relative;
		top:0%;
	}
	.honmon_ph img{
		width: 100%;
	}
	.honmon_ph{
		width: 100%;
	}

	.profile_left{
		width: 100%;
		position: relative;
		left: 0%;
		top: 0%;
	}

	.profile_left p.name{
		padding-bottom: 0px;
	}

	.profile_left p.prof{
		font-size: 13px;
	}

	.profile_right{
		width: 100%;
		position: relative;
		left: 0%;
		top: 0%;
	}

	.profile_right p.name{
		padding-bottom: 0px;
	}

	.profile_right p.prof{
		font-size: 13px;
	}

	.sub_title img{
		width: 100%;
	}

	.sub_text{
		position: relative;
		top: 0%;
		text-align: left;
		font-size: 15px;
	}

	.conv{
		width: 100%;
		position: relative;
		top:0%;
	}

	.conv dl, .conv dt, .conv dd {
		display: block;
		width: auto;
		text-align: left;
		margin-left: 0px;
		padding-left: 0px;
	}

	.conv dl:first-child dt {
		padding-top: 0;
	}

	.conv dd {
		padding-top: 0.5em;
	}

	.next{
		text-align: center;
		font-size: 12px;
		padding-bottom: 30px;
	}

	.date_end{
		text-align: center;
		font-size: 12px;
		padding-bottom: 20px;
	}

	.info_guidebook{
		text-align: center;
		font-size: 12px;
	}

	.footer{
		width: 100%;
		margin: 0 auto;
		background-color: #86c0ce;
		position: relative;
		top: 300px;
		padding-top: 20px;
	}

	.footer ul{
		width: 80%;
	}

	.footer ul li img{
		width:50%;
	}

	.copyright{
		text-align: center;
		letter-spacing: 0.15em;
		font-size: 12px;
		padding-top: 30px;
		color: #FFF;
	}

	/* 2回目
	 * --------------------------------------------------------*/
	 .sub_text_02{
		position: relative;
		top: 0%;
		text-align: left;
		font-size: 15px;
	 }

	 .colum{
		width: 100%;
	  }

	 .colum_title{
		width: 100%;
	  }

	.colum_title p{
	  font-size: 16px;
	}

	 .colum_sub_text{
		 font-size: 14px;
		 width: 90%;
		 margin: 0 auto;
		 text-align: left;
	}

	 .colum_ph{
		 width: 90%;
		 margin: 0 auto;
	 }

	 .colum_ph img{
		 width: 100%;
	 }

	 .colum_talk{
		width: 90%;
		font-size: 16px;
	}

	.mark{
		width: 90%;
		margin: 0 auto;
	}


}
