/*
Theme Name: yokoyama
Template: twentyfifteen
Description: 益子焼窯元よこやま
Author: Yamazen Communications co.,ltd.
Author URI: http://www.yamazen-net.co.jp/
*/


/* reset style
----------------------------------------------------------- */

*{
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
}
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, dialog, figure, footer, header,
hgroup, menu, nav, section,
time, mark, audio, video {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
}
body {
	line-height:1;
}

article, aside, dialog, figure, footer, header,
hgroup, nav, section {
	display:block;
}

h1,h2,h3,h4,h5,h6,p {
	font-weight:normal;
	font-size: 100%;
	text-align:left;
}

ol,ul,li,nav ul {
	list-style:none;
}

ul,li,img{
	margin:0;
	padding:0;
	list-style:none;
	vertical-align:bottom;
	line-height:1.6;
	text-align:left;
}

caption,th {
	text-align:left;
}
address,caption,cite,code,dfn,em,strong,th,var {
	font-style:normal;
	font-weight:normal;
}

blockquote, q {
	quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content:'';
	content:none;
}

a {
	text-decoration:none;
	outline:0;
	line-height:1.6;
/* Hides from IE-mac \*/
	overflow:hidden;
/* End hide from IE-mac */
}

ins {
	background-color:#ff9;
	color:#000;
	text-decoration:none;
}

mark {
	background-color:#ff9;
	color:#000;
	font-style:italic;
	font-weight:bold;
}

del {
	text-decoration: line-through;
}

abbr[title], dfn[title] {
	border-bottom:1px dotted #000;
	cursor:help;
}

img,td,th {
	border:0;
}

table {
	border-collapse:collapse;
	border-spacing:0;
}

td,th{
	text-align: left;
	vertical-align: top;
}

hr {
    display:block;
    height:1px;
    border:0;
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}

input, select {
	vertical-align:middle;
}


/* CLEAR FIX*/
.clearfix:after,
p.text:after{
	content: ".";  
	display: block;  
	visibility: hidden;  
	height: 0.1px;  
	font-size: 0.1em;  
	line-height: 0;  
	clear: both;  
}
.clearfix,
p.text{display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix { height: 1%;}
* html p.text { height: 1%;}
.clearfix,
p.text{display: block;}
/* End hide from IE-mac */



/* style
----------------------------------------------------------------------------------*/
img{max-width:100%;height:auto;}
@media only print, only screen and (min-width: 641px){
a:hover img{
    opacity:0.50;
    filter: alpha(opacity=50);
}
}

/* margin */
.mt0  {margin-top:0px!important;}
.mt5  {margin-top:5px!important;}
.mt10 {margin-top:10px!important;}
.mt15 {margin-top:15px!important;}
.mt20 {margin-top:20px!important;}
.mt25 {margin-top:25px!important;}
.mt30 {margin-top:30px!important;}
.mt40 {margin-top:40px!important;}
.mt50 {margin-top:50px!important;}
.mt60 {margin-top:60px!important;}
.mt70 {margin-top:70px!important;}
.mt80 {margin-top:80px!important;}
.mt90 {margin-top:90px!important;}
.mt100{margin-top:100px!important;}

.mb0  {margin-bottom:0px!important;}
.mb5  {margin-bottom:5px!important;}
.mb10 {margin-bottom:10px!important;}
.mb15 {margin-bottom:15px!important;}
.mb20 {margin-bottom:20px!important;}
.mb25 {margin-bottom:25px!important;}
.mb30 {margin-bottom:30px!important;}
.mb40 {margin-bottom:40px!important;}
.mb50 {margin-bottom:50px!important;}
.mb60 {margin-bottom:60px!important;}
.mb70 {margin-bottom:70px!important;}
.mb80 {margin-bottom:80px!important;}
.mb90 {margin-bottom:90px!important;}
.mb100{margin-bottom:100px!important;}

.mr0  {margin-right:0px!important;}
.mr5  {margin-right:5px!important;}
.mr10 {margin-right:10px!important;}
.mr15 {margin-right:15px!important;}
.mr20 {margin-right:20px!important;}
.mr25 {margin-right:25px!important;}
.mr30 {margin-right:30px!important;}
.mr40 {margin-right:40px!important;}
.mr50 {margin-right:50px!important;}

.ml0  {margin-left:0px!important;}
.ml5  {margin-left:5px!important;}
.ml10 {margin-left:10px!important;}
.ml15 {margin-left:15px!important;}
.ml20 {margin-left:20px!important;}
.ml25 {margin-left:25px!important;}
.ml30 {margin-left:30px!important;}
.ml40 {margin-left:40px!important;}
.ml50 {margin-left:50px!important;}

/* padding */
.pt0  {padding-top:0px!important;}
.pt5  {padding-top:5px!important;}
.pt10 {padding-top:10px!important;}
.pt15 {padding-top:15px!important;}
.pt20 {padding-top:20px!important;}
.pt25 {padding-top:25px!important;}
.pt30 {padding-top:30px!important;}
.pt40 {padding-top:40px!important;}
.pt50 {padding-top:50px!important;}

.pb0  {padding-bottom:0px!important;}
.pb5  {padding-bottom:5px!important;}
.pb10 {padding-bottom:10px!important;}
.pb15 {padding-bottom:15px!important;}
.pb20 {padding-bottom:20px!important;}
.pb25 {padding-bottom:25px!important;}
.pb30 {padding-bottom:30px!important;}
.pb40 {padding-bottom:40px!important;}
.pb50 {padding-bottom:50px!important;}

.pr0  {padding-right:0px!important;}
.pr5  {padding-right:5px!important;}
.pr10 {padding-right:10px!important;}
.pr15 {padding-right:15px!important;}
.pr20 {padding-right:20px!important;}
.pr25 {padding-right:25px!important;}
.pr30 {padding-right:30px!important;}
.pr40 {padding-right:40px!important;}
.pr50 {padding-right:50px!important;}

.pl0  {padding-left:0px!important;}
.pl5  {padding-left:5px!important;}
.pl10 {padding-left:10px!important;}
.pl15 {padding-left:15px!important;}
.pl20 {padding-left:20px!important;}
.pl25 {padding-left:25px!important;}
.pl30 {padding-left:30px!important;}
.pl40 {padding-left:40px!important;}
.pl50 {padding-left:50px!important;}

.fs10{font-size:10px!important;}
.fs12{font-size:12px!important;}
.fs14{font-size:14px!important;}
.fs16{font-size:16px!important;}
.fs18{font-size:18px!important;}
.fs20{font-size:20px!important;}
.fs22{font-size:22px!important;}
.fs24{font-size:24px!important;}
.fs26{font-size:25px!important;}
.fs28{font-size:28px!important;}
.fs30{font-size:30px!important;}
.fs36{font-size:36px!important;}
.fs48{font-size:48px!important;}

.fb{font-weight: bold!important;}

.red{color: #ff0000!important;}
.glay{color: #646464!important;}

.tL{text-align:left!important;}
.tR{text-align:right!important;}
.tC{text-align:center!important;}

.clear{clear:both!important;}
.wrap{overflow:hidden;zoom:1;}
.db{display: block;}

/* form */
select,
textarea,
input[type="text"]{
    padding:5px;
	color:#646464;
    border:1px solid #c3c3c3;
	background: #efede9;
}
input[type="radio"],
input[type="checkbox"]{
    position:relative; 
    top:-2px;
}

.fR{float:right!important;}
.fL{float:left!important;}
@media only screen and (max-width: 640px){
.pc{display:none!important;}
.tLsp{text-align:left!important;}
.tRsp{text-align:right!important;}
.tCsp{text-align:center!important;}
.fRsp,
.fLsp{float:none!important;margin: 0 0 10px!important;text-align: center;}}
@media only print, only screen and (min-width: 641px){
.sp{display:none!important;}
}



/* common
----------------------------------------------------------------------------------*/

body {
	margin: 0 auto;
	font-size: 87.5%;
	font-family: Verdana,Arial,"メイリオ",Meiryo,"Osaka","ヒラギノ角ゴPro W3","Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック",sans-serif;
	line-height: 1.6;
	color: #232323;
	vertical-align: top;
	background: url(img/bg-body.png) repeat 0 0;
	-webkit-text-size-adjust: 100%;
}

a:link   {color: #643c3c;text-decoration: underline;}
a:visited{color: #643c3c;text-decoration: underline;}
a:hover  {color: #ff6400;text-decoration: none;}
a:active {color: #643c3c;text-decoration: underline;}



/* structure
----------------------------------------------------------------------------------*/
.w980{
	width: 980px;
	margin: 0 auto;
}
.w1024{
	width: 1024px;
	margin: 0 auto;
}
#container{
	margin: 63px 0 0;
	padding: 0 0 150px;
	background: url(img/bg-left.gif) repeat-y 0 0,url(img/bg-right.gif) repeat-y right 0;
}
#container .w980{
	padding: 30px 0 0;
}
#side{
	float: left;
	width: 320px;
}
#contents{
	float: right;
	width: 660px;
}
#special{margin: 10px 0 20px;}
@media only screen and (max-width: 1140px){
	#container{
		margin: 119px 0 0;
	}
}
@media only screen and (max-width: 640px){
	.w980,
	.w1024{
		width: auto;
	}
	#container{
		margin: 47px 0 0;
		background: url(img/bg-left.gif) repeat-y -13px 0,url(img/bg-right.gif) repeat-y 104% 0;
		-webkit-background-size: 30px auto;
		background-size: 30px auto;
	}
	#container .w980,
	#container .w1024{
		padding: 0 10px;
	}
	#side{
		float: none;
		width: auto;
	}
	#contents{
		float: none;
		width: auto;
	}
}


/* header
----------------------------------------------------------------------------------*/
#header{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	padding: 10px 0;
	padding: 10px 20px 10px 10px;
	background: url(img/bg-brown.png) repeat 0 0;
	z-index: 10000;
}
#h-logo{
	width: 300px;
	float: left;
}
#h-logo a{
	width: 100%;
	display:block;
	padding-left:45px;
	background:url(img/icon_home.png) no-repeat 10px center;
}
#h-logo a:hover img{
    opacity:1.0;
    filter: alpha(opacity=100);
}
#h-logo a:hover{
    opacity:0.50;
    filter: alpha(opacity=50);
}

@media only screen and (max-width: 1140px){
	#h-logo{
		width: auto;
		float: none;
		text-align:center;
	}
	#h-logo a{
		background:none;
	}
}
@media only screen and (max-width: 640px){
	#header{
		padding: 10px 0 0;
	}
	#btn-menu{
		float: right;
		margin: 0 10px 0 0;
	}
	#h-logo{
		float: none;
		width: 200px;
		margin-left: 10px;
	}
}



/* gnavi
----------------------------------------------------------------------------------*/
#gnavi{
	float: right;
	width: 700px;
	width: auto;
	padding: 7px 0 0;
	letter-spacing: -0.4em;
	text-align: right;
}
#gnavi li{
	display: inline-block;
	margin: 0 0 0 15px;
	letter-spacing: normal;
	vertical-align: middle;
}
#gnavi li ul{
	display: none;
	position: fixed;
	top: 63px;
	left: 0;
	width: 100%;
	padding: 20px 0;
	text-align: center;
	background: url(img/bg-black.png) repeat 0 0;
}
#gnavi li ul li{
	margin: 0 10px;
	width: 180px;
	vertical-align: top;
}
#gnavi li ul li span{
	display: block;
	margin: 5px 0 0;
	padding-left: 20px;
	color: #fff;
	background: url(img/icon-leaf.png) no-repeat 0 1px;
}
#gnavi li ul li a{
	text-decoration: none;
}

@media only screen and (max-width: 1140px){
	#gnavi{
		float: none;
		padding: 7px 0 10px;
		text-align:center;
	}
	#gnavi li ul{
		top: 119px;
	}
}
@media only screen and (max-width: 640px){
	#gnavi{
		display: none;
		float: none;
		width: 100%;
		padding: 15px 0 10px;
		text-align: left;
	}
	#gnavi li{
		display: block;
		margin: 0;
	}
	#gnavi li a{
		display: block;
		padding: 5px 10px;
		background: url(img/arrow-down.png) no-repeat 95% center;
	}
	#gnavi li a.active{
		background: url(img/arrow-up.png) no-repeat 95% center;
	}
	#gnavi li ul{
		display: none;
		position: static;
		top: 0;
		left: 0;
		width: 100%;
		padding: 0 0 10px;
		text-align: left;
	}
	#gnavi li ul li{
		width: auto;
		padding:8px 0;
		border-bottom:1px #faebc8 dotted;
	}
	#gnavi li ul li:last-child{
		border-bottom:none;
	}
	#gnavi li ul li a{
		background: none;
	}
	#gnavi li ul li img{
		display: none;
	}
	#gnavi li ul li span{
		display: block;
		margin: 5px 0 0;
		padding-left: 20px;
		color: #fff;
		background: url(img/icon-leaf.png) no-repeat 0 1px;
	}
}
@media only screen and (min-width: 641px){
	#gnavi{display: block!important;}
}



/* side
----------------------------------------------------------------------------------*/
#side #side-menubtn{
	display: none;
}
#side #reserve{
	margin-left: -25px;
	cursor: pointer;
}
#side #lnavi{
	margin: 20px 0 40px;
}
#side #lnavi li a{
	display: block;
	padding: 7px 10px 7px 30px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	background: url(img/arrow.png) no-repeat 10px 12px;
}
#side #lnavi li a:hover{
	color: #fff;
	background: url(img/arrow02.png) no-repeat 10px 12px #ff6400;
}
#side #lnavi li ul{
	margin-left: 30px;
}
#side #s-info{
	margin: 0 0 40px;
}
#side #s-info p{
	padding: 15px 20px;
	background: #fff;
}
#side #side-bnr{
	margin: 0 0 40px;
}
#side #side-bnr li{
	margin: 0 0 25px;
}
#side #side-bnr li span{
	display: block;
	margin: 5px 0 0;
}
#side .sub-menu {
    display: none;
}
@media only screen and (max-width: 640px){
#side{padding: 0 0 20px;}
#side #reserve,
#side #lnavi,
#side #s-info,
#side #side-bnr,
#side .fb-page{display: none;}
#side #side-menubtn{
	display: block;
	padding: 10px 50px 10px 10px;
	color: #fff;
	text-align: center;
	background: url(img/arrow-down.png) no-repeat 97% center,url(img/bg-brown.png) repeat 0 0;
}
#side #side-menubtn.active{
	background: url(img/arrow-up.png) no-repeat 97% center,url(img/bg-brown.png) repeat 0 0;
}
}
@media only screen and (min-width: 641px){
#side #side-bnr{display: block!important;}
}

/* title
----------------------------------------------------------------------------------*/
#cttl{
	padding: 40px 0 30px;
	text-align: center;
}
#cttl-shop{
	margin: 20px 0;
}


#pttl,
.blog-ttl{
	margin: 0 0 20px;
	padding: 15px;
	color: #e9d7b6;
	font-size: 142.857%;
	text-align: center;
	font-weight: bold;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	background: url(img/bg-brown.png) repeat 0 0;
}
@media only screen and (max-width: 640px){
#cttl{
	padding: 5px 0 20px;
	text-align: center;
}
#pttl{
	margin: 0 0 10px;
	padding: 6px;
}
}


/* topicpath
----------------------------------------------------------------------------------*/
#topicpath{
	padding: 5px 0;
	background: url(img/bg-white.png) repeat 0 0;
}
#topicpath li{
	display: inline;
	margin-right: 10px;
	padding-left: 20px;
	background: url(img/arrow.png) no-repeat 0 center;
}
#topicpath li.home{
	background: url(img/icon-home.png) no-repeat 0 center;
}
@media only screen and (max-width: 640px){
#topicpath{display: none;}
}



/* footer
----------------------------------------------------------------------------------*/
#footer-t{
	position: relative;
	padding: 273px 0 0;
	background: url(img/top/anime05.gif) no-repeat 80% 40px,url(img/bg-footer.png) repeat-x center 0;
}
#footer-m{
	padding: 30px 0 50px;
	background: #cfdf74; /* Old browsers */
	/* IE9 SVG, needs conditional override of 'filter' to 'none' */
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2NmZGY3NCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlOGVhN2IiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
	background: -moz-linear-gradient(top,  #cfdf74 0%, #e8ea7b 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#cfdf74), color-stop(100%,#e8ea7b)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #cfdf74 0%,#e8ea7b 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #cfdf74 0%,#e8ea7b 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #cfdf74 0%,#e8ea7b 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #cfdf74 0%,#e8ea7b 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cfdf74', endColorstr='#e8ea7b',GradientType=0 ); /* IE6-8 */
	  }
#footer-b{
	padding: 0 0 20px;
	background: url(img/bg-brown.png) repeat 0 0;
}
#f-bnr{
	margin: 50px 0;
	padding: 0 10px;
	text-align: center;
}
#footer-t #pagetop{
	position: fixed;
	bottom: 30px;
	right: 60px;
}
#f-navi{
	margin: -63px 0 30px;
	text-align: center;
	letter-spacing: -0.4em;
}
#f-navi li{
	display: inline-block;
	margin: 0 10px 10px;
	letter-spacing: normal;
}
#f-sbnavi{
	margin: 0 0 65px;
	text-align: center;
	letter-spacing: -0.4em;
}
#f-sbnavi li{
	display: inline-block;
	letter-spacing: normal;
}
#f-logo{
	margin: 0 0 15px;
	text-align: center;
}
.copyright{text-align: center;}

@media only screen and (max-width: 640px){
#footer-m{
	padding: 30px 10px 50px;
}
#footer-t #pagetop{
	bottom: 10px;
	right: 10px;
	width: 50px;
}
#f-logo{
	width: 225px;
	margin: 0 auto 15px;
}
.copyright{font-size: 85.714%;}
}
@media only screen and (max-width: 520px){
#f-navi li{
	width: 20%;
	margin: 0;
	padding: 0 5px 10px;
	text-align: center;
}
}


/* home
----------------------------------------------------------------------------------*/
#top-reserve{
	position: relative;
	padding: 0!important;
}
#top-reserve #canvas{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 5000;
	cursor: pointer;
}
#top-reserve a:hover{
    opacity:0.70;
    filter: alpha(opacity=70);
}
.film_roll_pager{
	position: relative;
	margin: -30px 0 0;
	z-index: 100;
}
.film_roll_pager a{
	width: 10px!important;
	height: 10px!important;
	border: 1px solid #fff!important;
	-webkit-border-radius: 10px!important;
	-moz-border-radius: 10px!important;
	border-radius: 10px!important;
	background: #fff!important;
}
.film_roll_pager a.active{
	background: #333!important;
}
.film_roll_prev,
.film_roll_next{
	width: 50px!important;
	height: 50px!important;
	border: none!important;
	text-indent: 100%;
	white-space: nowrap;
	opacity: 1!important;
	overflow: hidden;
}
.film_roll_prev:hover,
.film_roll_next:hover{
	opacity: 0.5!important;
}
.film_roll_prev{background: url(img/top/arrow-prev.png) no-repeat 0 0!important;}
.film_roll_next{background: url(img/top/arrow-next.png) no-repeat 0 0!important;}

#container #top-contents{
	padding: 60px 0 0;
}
#top-contents #map{
	position: relative;
	width: 880px;
	height: 470px;
	margin: 0 auto 30px;
	background: url(img/top/anime01.gif) no-repeat right bottom;
}
#top-contents #map .bg,
#top-contents #map ul li{
	position: absolute;
}
#top-contents #map .bg{
	left: 0;
	top: 0;
	max-width: none;
	height: auto;
}
#top-contents #map ul li.map01{left: 280px;top: 160px;}
#top-contents #map ul li.map02{left: 620px;top: 184px;}
#top-contents #map ul li.map03{left: 136px;top: 98px;}
#top-contents #map ul li.map04{left: 300px;top: 25px;}
#top-contents #map ul li.map05{left: 469px;top: 200px;}
#top-contents #map ul li.map06{left: 333px;top: 223px;}
#top-contents #map ul li.map07{left: 561px;top: 46px;}
#top-contents #map ul li.map08{left: 437px;top: 67px;}
#top-contents #map ul li.map09{left: 317px;top: 307px;}
#top-contents #map ul li.map10{left: 458px;top: 350px;}
#top-contents #map ul li.map11{left: 175px;top: 40px;}

#top-contents #access{
	width: 780px;
	margin: 0 auto 80px;
}
#top-contents #access li{
	min-height: 60px;
	margin: 0 0 20px;
	padding: 0 0 0 80px;
}
#top-contents #access li.bus{
	background: url(img/top/icon-bus.png) no-repeat 0 0;
}
#top-contents #access li.car{
	background: url(img/top/icon-car.png) no-repeat 0 0;
}
#top-contents #access li h3{
	color: #643c3c;
	font-size: 18px;
	font-weight: bold;
}
#top-contents h2.ttl{
	margin: 35px 0;
	text-align: center;
}
#top-contents h2#topics-list-ttl{
	margin: 0;
	padding: 35px 0;
	background: url(img/top/anime02.gif) no-repeat left top;
}
#top-contents .topics-list{
	margin: 0 0 10px;
}
#top-contents .pickup li{
	margin: 0;
}
#top-contents .bx-wrapper .bx-prev{left: -50px;}
#top-contents .bx-wrapper .bx-next{right: -50px;}
#top-contents .btn-list{
	margin: 20px 0 80px;
	text-align: center;
}
#top-contents .btn-list a{
	display: inline-block;
	padding: 15px 20px;
	color: #fff;
	line-height: 1;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	background: #643c3c;
}
#top-contents .btn-list a:hover{
	background: #ff6400;
}
#top-contents #facebook{
	float: left;
	width: 500px;
}

#top-contents #banner-wrap{
	position: relative;
	float: right;
	width: 400px;
}
#top-contents #banner{
}
#top-contents #banner li{
	position: relative;
	margin: 0 0 20px;
	z-index: 10;
}
#top-contents #banner-wrap .anime03{
	position: absolute;
	left: 60%;
	top: -40px;
	z-index: 20;
}
#top-contents #banner-wrap .anime04{
	position: absolute;
	left: -40px;
	bottom: 20px;
	z-index: 1;
}

@media only screen and (max-width: 640px){
#container #top-contents{
	padding: 60px 10px 0;
}
#top-reserve{
	position: relative;
	padding: 0!important;
}
#top-reserve #canvas{
	width: 120px;
	height: 82px;
}
#top-contents #map{
	width: 100%;
	height: 490px;
	overflow: scroll;
}

#top-contents #access{
	width: auto;
}
#top-contents h2#topics-list-ttl{
	margin: 35px 0;
	padding: 0;
	background: none;
}
#top-contents .topics dt{
	float: none;
}
#top-contents .topics dd{
	padding: 5px 0;
	border-bottom: 1px dotted #503232;
}
#top-contents .pickup li{
	display: inline-block;
	width: 200px;
	margin: 0;
	padding: 0;
	border-bottom: none;
}
#top-contents .pickup li .thum{
	width: auto;
	float: none;
	margin: 0 0 5px;
}
#top-contents .bx-wrapper .bx-prev{left: 10px;}
#top-contents .bx-wrapper .bx-next{right: 10px;}

#top-contents #facebook,
#top-contents #banner-wrap{
	float: none;
	width: auto;
}
#top-contents #facebook{
	margin: 0 10px 40px;
}
#top-contents #banner li{
	max-width: 400px;
	margin: 0 auto 20px;
	text-align: center;
}
#top-contents #banner-wrap .anime03,
#top-contents #banner-wrap .anime04{
	display: none;
}
}



/* category
----------------------------------------------------------------------------------*/
.topics-list dt{
	float: left;
	width: 80px;
	padding: 5px 0 0;
	line-height: 1.8;
}

.topics-list dd{
	padding: 5px 0 8px 90px;
	border-bottom: 1px dotted #503232;
}
.archive-list dd{
	border-top: 1px dotted #503232;
	border-bottom: none;
}
.topics-list dd .new{
	padding-left: 5px;
}
.topics-list dd.list{
	padding: 5px 0;
	border-bottom: none;
}
.topics-list dd.noentry{
	padding: 10px 0;
}
.pickup{
	padding: 0 0 25px;
	text-align: center;
}
.pickup li{
	display: block;
	margin: 0 0 20px;
	padding: 0 0 5px;
	border-bottom: 1px dotted #503232;
	overflow: hidden;
}
.pickup li .thum{
	width: 200px;
	float: left;
	margin-right: 30px;
}
.pickup li .wrap{
	display: block;
}
.pickup li .icon{
	margin-right: 10px;
}
.pickup li .title{
	display: block;
	margin: 5px 0 0;
	padding-left: 20px;
	background: url(img/arrow.png) no-repeat 0 4px;
}
.archive-pickup{
	border-bottom: none;
}

#topics-nav{
	margin: 40px 0;
}
#topics-nav .nav{
	padding: 15px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
	letter-spacing: -0.4em;
	background: url(img/bg-brown.png) repeat 0 0;
}
#topics-nav .nav li{
	display: inline-block;
	width: 200px;
	margin: 5px;
	letter-spacing: normal;
	vertical-align: top;
}
#topics-nav .nav li a{
	display: block;
	height: 55px;
	text-indent: 100%;
	white-space: nowrap;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	overflow: hidden;
	background: url(img/topics-nav.gif) no-repeat 0 0;
}
#topics-nav .nav li.nav01 a{background-position: 0 0;}
#topics-nav .nav li.nav02 a{background-position: -200px 0;}
#topics-nav .nav li.nav03 a{background-position: -400px 0;}
#topics-nav .nav li.nav04 a{background-position: 0 -55px;}
#topics-nav .nav li.nav05 a{background-position: -200px -55px;}
#topics-nav .nav li.nav06 a{background-position: -400px -55px;}
#topics-nav .nav li.nav07 a{background-position: 0 -110px;}
#topics-nav .nav li.nav08 a{background-position: -200px -110px;}
#topics-nav .nav li.nav09 a{background-position: -400px -110px;}
#topics-nav .nav li.nav10 a{background-position: 0 -165px;}
#topics-nav .nav li.nav11 a{background-position: -200px -165px;}

#topics-nav .nav li.nav01 a:hover{background-position: 0 -220px;}
#topics-nav .nav li.nav02 a:hover{background-position: -200px -220px;}
#topics-nav .nav li.nav03 a:hover{background-position: -400px -220px;}
#topics-nav .nav li.nav04 a:hover{background-position: 0 -275px;}
#topics-nav .nav li.nav05 a:hover{background-position: -200px -275px;}
#topics-nav .nav li.nav06 a:hover{background-position: -400px -275px;}
#topics-nav .nav li.nav07 a:hover{background-position: 0 -330px;}
#topics-nav .nav li.nav08 a:hover{background-position: -200px -330px;}
#topics-nav .nav li.nav09 a:hover{background-position: -400px -330px;}
#topics-nav .nav li.nav10 a:hover{background-position: 0 bottom;}
#topics-nav .nav li.nav11 a:hover{background-position: -200px bottom;}

#topics-nav .link-style{
	margin: 5px 0 0;
	color: #643c3c;
	background-position: 0 center;
}

.blog-list{
	margin: 0 0 80px;
}
@media only screen and (max-width: 640px){
#topics-nav{
	display: none;
}
.pickup{
	border-bottom: none;
}
.pickup li .thum{
	width: 120px;
	margin-right: 15px;
}
}



/* single
----------------------------------------------------------------------------------*/



/* pagenavi
----------------------------------------------------------------------------------*/
.wp-pagenavi {
    clear: both;
	padding: 35px 0 0;
	text-align: center;
	border-top: 1px solid #c8c8c8;
}
.wp-pagenavi a, .wp-pagenavi span {
    border: 1px solid #643c3c;
    margin: 2px;
    padding: 6px 10px;
	color: #fff;
    text-decoration: none;
	vertical-align: middle;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	background: #643c3c;
}
.wp-pagenavi span.current {
	color: #646464;
    border-color: #c8c8c8;
	background: #fff;
}
.wp-pagenavi a:hover {
	color: #fff;
    border-color: #ff6400;
	background: #ff6400;
}

#single-navi{
	margin: 80px 0;
	padding: 35px 0 0;
	letter-spacing: -0.4em;
	text-align: center;
	vertical-align: top;
	border-top: 1px solid #c8c8c8;
}
#single-navi li{
	display: inline-block;
	margin: 0 10px;
	letter-spacing: normal;
}
#single-navi li a{
	display: block;
	padding: 10px 20px 10px 50px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	color: #fff;
}
#single-navi li.list a      {background: url(img/icon-list.png)   no-repeat 20px center #643c3c;}
#single-navi li.home a      {background: url(img/icon-home-w.png) no-repeat 20px center #643c3c;}
#single-navi li.list a:hover{background: url(img/icon-list.png)   no-repeat 20px center #ff6400;}
#single-navi li.home a:hover{background: url(img/icon-home-w.png) no-repeat 20px center #ff6400;}
@media only screen and (max-width: 640px){
#single-navi li{
	display: block;
	margin: 0 0 10px;
}
}


/* decoration
----------------------------------------------------------------------------------*/
#article h3{
	margin: 45px 0 15px;
	padding: 10px 15px;
	color: #fff;
	font-size: 171.428%;
	font-weight: bold;
	line-height: 1.5;
	-webkit-border-radius: 10px 10px 0 0;
	-moz-border-radius: 10px 10px 0 0;
	border-radius: 10px 10px 0 0;
	background: url(img/bg-brown.png) repeat 0 0;
}
#article h4{
	margin: 30px 0 10px;
    color: #663333;
    font-size: 157.142%;
    font-weight: bold;
	line-height: 1.5;
    border-bottom: 5px solid #663333;
}
#article h5{
	margin: 20px 0 10px;
    padding: 0 0 0 10px;
    color: #663333;
    font-size: 128.571%;
    font-weight: bold;
	line-height: 1.5;
    border-left: 3px solid #663333;
}
#article strong{
	font-weight: bold;
}
.link-style{
	padding-left: 20px;
	background: url(img/arrow.png) no-repeat 0 2px;	
}
#article .link-style{
	padding-left: 20px;
	background: url(img/arrow.png) no-repeat 0 2px;	
}
#article .note{
	font-size: 85.714%;
}
#article table{
	width: 100%;
	margin: 0 0 10px;
	border-left: 1px solid #663333;
	border-bottom: 1px solid #663333;
}
#article table th,
#article table td{
	padding: 7px 12px;
	border-right: 1px solid #663333;
	border-top: 1px solid #663333;
}
#article .alignleft {
    float: left;
    margin: 7px 28px 28px 0;
}
#article .alignright {
    float: right;
    margin: 7px 0 28px 28px;
}
#article .aligncenter {
    clear: both;
    display: block;
    margin: 7px auto;
}
#article .col2,
#article .col3,
#article .col4{
	margin: 0 -20px;
	letter-spacing: -0.4em;
	overflow: hidden;
}
#article .col2 li,
#article .col3 li,
#article .col4 li{
	display: inline-block;
	margin: 0 0 40px;
	padding: 0 20px;
	vertical-align: top;
	letter-spacing: normal;
}
#article .col2 li{
	width: 50%;
}
#article .col3 li{
	width: 33.333%;
}
#article .col4 li{
	width: 25%;
}

table.noborder{
	border:none!important;
}
table.noborder th,
table.noborder tr,
table.noborder td{
	border:none!important;
}

@media only screen and (max-width: 640px){
#article h3{
	margin: 20px 0;
}
#article .col2,
#article .col3,
#article .col4{
	margin: 0;
}
#article .col2 li,
#article .col3 li,
#article .col4 li{
	margin: 0 0 40px;
	padding: 0;
}
#article .col2 li,
#article .col3 li,
#article .col4 li{
	width: 100%;
}
}


/* page
----------------------------------------------------------------------------------*/
#slideshow .slider{
	width: 100%;
}
.page-info{
	margin: 40px 0 50px;
}
#plan{
	margin: 0 0 50px;
}
#plan li{
	padding: 5px 0 5px 20px;
	border-bottom: 1px dotted #503232;
	background: url(img/arrow.png) no-repeat 0 10px;
}
#sp-bnr{
	display: none;
}
#sitemap_list,
#sitemap_list li{
	background: none!important;	
}
@media only screen and (max-width: 640px){
.page-info{
	margin: -10px 0 40px;
}
#sp-bnr{
	display: block;
}
.bx-wrapper{
	margin: 0 auto 30px!important;
}
}