@charset "UTF-8";

html{
	height:100%;
}

body{
	font-size:1.0rem;
	line-height:1.3em;
	background-color:#fefeff;
	color:#444;
	height:100%;
	background-image:url(../images/bg-body.jpg);
	background-attachment: fixed;
    background-size: cover;
    font-family: 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN","Hiragino Mincho Pro",HGS明朝E,メイリオ,Meiryo,serif;
    font-weight: 500;
}

#wrap{
	height:100%;
	min-height:100%;
	margin:0 auto;
}


body > #wrap{
	height:auto;
    color: #2d2d2d;
}

a{
	color:#636363;;
	text-decoration:none;
}

#header{
	padding:10px;
	margin:10px;
	border-radius:5px;
}

#header div.top{
	display:table;
	width:100%;
	margin-bottom:10px;
}

#header p.logo{
	display:table-cell;
	width:50%;
	vertical-align:middle;
}

#header p.logo a{
	display:block;
}

#header p.logo img{
	width:100%;
	vertical-align:bottom;
	border-radius:5px;
}

#header p.welcome{
	display:table-cell;
	width:50%;
	vertical-align:middle;
	font-size:0.8rem;
	line-height:1.5em;
	text-align:center;
}

#header p.welcome span{
	font-weight:bold;
}

#header ul.btn{
}

#header ul.btn li{
	width:33%;
	float:left;
	text-align:center;
	font-size:0.6rem;
	line-height:1.0em;
}

#header ul.btn li.home{
	margin-left:0.5%;
}

#header ul.btn li.logout{
	margin-right:0.5%;
}

#header ul.btn li a{
	display:block;
	margin:0 5px;
	padding:10px 5px;
	border-radius:2px;
	color:#fff;
    background-color: #ce3c3c;

}

#header ul.btn li a:hover{
	background-image:-moz-linear-gradient(
    top,
    #fc0 0%,
    #f60 49%,
    #f30 50%,
    #f00);
 
    background-image:-webkit-gradient(
    linear,left top,left bottom,
    from(#fa0),
    color-stop(0.49,#f80),
    color-stop(0.50,#f60),
    to(#f40));
}

#membership{
	background-color: #fff;
    padding:10px;
	margin:10px;
	border-radius:5px;
}

#membership div.states{
	margin-bottom:10px;
}

#membership div.states p.rank{
	width:30%;
	float:left;
	text-align:center;
	font-size:0.7em;
	line-height:1.0em;
    margin: 9px 0px;
}

#membership div.states p.rank span{
	display:block;
	font-size:1.8em;
	line-height:1.0em;
	font-weight:bold;
	margin:10px 0;
}

#membership div.states p.rank a{
	font-size:0.6rem;
	line-height:1.0em;
}
/**** 15.02.2017 鬩幢ｽ｢隴擾ｽｴ郢晢ｽｻ驍ｵ・ｺ陋滂ｽ｡繝ｻ・ｹ繝ｻ・ｧ郢晢ｽｻ繝ｻ・､鬩幢ｽ｢隴趣ｽ｢繝ｻ・ｽ繝ｻ・ｳ鬯ｮ・ｴ隰・∞・ｽ・ｽ繝ｻ・ｽ鬮ｯ・ｷ闔ｨ螟ｲ・ｽ・｣繝ｻ・ｰ ****/

#membership div.states p.rank img{
	width:60%;
	max-width:120px;
}
/*
#membership div.states p.rank img{
	width:60%;
	max-width:120px;
	margin: -55px 0px 0px 100px;
}*/
#membership div.states p.rankimg {
	width:30%;
	float: left;
	text-align: center;
}

#membership div.states p.rankimg img{
	width:75%;
	max-width:120px;
}

/*******************************/

#membership div.states p.point{
	width:40%;
	float:right;
	text-align:center;
	font-size:0.7em;
	line-height:1.0em;
    margin: 9px 0px;
}

#membership div.states p.point span{
	display:block;
	font-size:1.8em;
	line-height:1.0em;
	font-weight:bold;
	margin:10px 0;
}

#membership div.states p.point a{
	font-size:0.6rem;
	line-height:1.0em;
}

#membership div.states p.point a.pbook {
	color: #484848;;
}
#membership div.states p.point a.pbook:hover {
	color: #f4a142;
}

#membership ul.btn{
	margin-bottom:10px;
}

#membership ul.btn li{
	width:50%;
	float:left;
	text-align:center;
}

#membership ul.btn li a{
	display:block;
	margin:0 5px;
	padding:10px 5px;
	position:relative;
	color: #fff;
	border-radius:2px;
	background-image:-moz-linear-gradient(
    top,
    #f80 0%,
    #fa2 40%,
    #f60);
	/* background-image:-webkit-gradient(
    linear,left top,left bottom,
    from(#f80),
    color-stop(0.4,#fa2),
    to(#f60)); */
	background-color: #c50d0d;
}

#membership ul.btn li a:hover{
	background-color:#f80;
	background-image:inherit;
}

#membership ul.btn li label{
	position:absolute;
	top:-5px;
	left:-5px;
	width:15px;
	height:15px;
	font-size:0.6rem;
	line-height:15px;
	background-color:#fff;
	color:#f80;
	border:solid 1px #f80;
	border-radius:100px;
}

#membership div.reservation{
	margin-bottom:10px;
}

#membership div.reservation p.text{
	width:60%;
	float:left;
	font-size:0.8rem;
	line-height:1.0em;
	text-align:center;
}

#membership div.reservation p.text span{
	display:block;
	font-size:1.0rem;
	line-heght:1.0em;
	font-weight:bold;
	margin-top:5px;
}

#membership div.reservation p.comfirm{
	width:40%;
	float:right;
	font-size:0.8rem;
	line-height:1.0em;
	text-align:center;
}

#membership div.reservation p.comfirm a{
	display:block;
	margin:0 5px;
	padding:10px 5px;
	color:#fff;
	border-radius:2px;
    background-color: #ff9600;
}

#membership div.reservation p.comfirm a:hover{
	background-image:-moz-linear-gradient(
    top,
    #fc0 0%,
    #f60 49%,
    #f30 50%,
    #f00);
 
    background-image:-webkit-gradient(
    linear,left top,left bottom,
    from(#fa0),
    color-stop(0.49,#f80),
    color-stop(0.50,#f60),
    to(#f40));
}

#g-navi{
	margin:10px;
}

#g-navi li{
	width:50%;
	float:left;
	text-align:center;
	font-size:1.2rem;
	line-height:1.0em;
	font-weight:bold;
}

#g-navi li a{
	display:block;
	margin:0px;
	padding:2px;
	background-color:#fff;
	color:#fff;
	-webkit-box-shadow:none;
	box-shadow:none;
}

#g-navi li img{
	width:100%;
	vertical-align:bottom;
}

#g-navi li a:hover{
	background-color:#f80;
	-webkit-box-shadow:none;
	box-shadow:none;
	opacity:0.8;
}

#contents div.container{
	background-color: rgba(255, 255, 255, 0.56);
	padding:10px;
	margin:10px;
	border-radius:5px;
}

#contents header.content-header{
	padding-bottom:10px;
	margin-bottom:20px;
}

#contents header.content-header h2{
	font-size: 1.2rem;
    line-height: 1.5em;
    font-weight: bold;
    margin-bottom: 5px;
    background-repeat: repeat;
    background-size: 30%;
    background-position: center;
    padding: 5px 10px;
    border-radius: 2.5px;
    color: #ffffff;
    background: linear-gradient(to bottom,#da5d5d, #870000);
}

#contents header.content-header h2 img{
	width:100%;
	vertical-align:bottom;
	max-width:300px;
}

#contents header.content-header p.caption{
	padding:10px;
	padding-bottom:0;
}

#contents header.content-header p.attention{
	font-size:0.8rem;
	line-height:1.75em;
	color:#f00;
}

#contents h3{
    background: linear-gradient(to bottom,#ab9035, #caa66f);
    border-radius: 15px;
	color:#fff;
	font-weight:bold;
	padding:0 10px;
	margin-bottom:20px;
	line-height: 25px;
	/* font-size: unset; */
}

.castlist div.inner{
	text-align:center;
	padding:5px;
	margin:5px;
}

.castlist p.thum img{
	width:100%;
	max-width:360px;
	margin:0 auto;
	vertical-align:bottom;
}

.castlist p.thum2 img{
	width:100%;
	max-width:360px;
	margin:0 auto;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 5px;
}

.castlist p{
	white-space: nowrap;
	overflow:hidden;
	text-overflow: ellipsis;
}

.castlist p.name{
	font-weight:bold;
}

.castlist p.name span{
	font-size:0.8rem;
	line-height:1.75em;
	font-weight:normal;
	margin-left:2.5px;
}

.castlist p.size{
	font-size:0.6rem;
	line-height:1.75em;
	margin-bottom:5px;
}

.castlist ul.btn li{
	font-size:0.8rem;
	line-height:1.0em;
	font-weight:bold;
	width:120px;
	margin:7.5px auto;
}

.castlist ul.btn li a{
	display:block;
	padding:5px 0;
	border-radius:5px;
}

.castlist ul.btn li.profile a{
	background-image:-moz-linear-gradient(
    top,
    #dca 0%,
    #ba8 49%,
    #a97 50%,
    #875);
 
    background-image:-webkit-gradient(
    linear,left top,left bottom,
    from(#dca),
    color-stop(0.49,#ba8),
    color-stop(0.50,#a97),
    to(#875));
	
	color:#fff;
}

.castlist ul.btn li.profile a:hover{
	background-color:#f80;
	background-image:inherit;
}

.castlist ul.btn li.reservation a{
	background-image:-moz-linear-gradient(
    top,
    #fc0 0%,
    #f60 49%,
    #f30 50%,
    #f00);
 
    background-image:-webkit-gradient(
    linear,left top,left bottom,
    from(#fa0),
    color-stop(0.49,#f80),
    color-stop(0.50,#f60),
    to(#f40));
	
	color:#fff;
}

.castlist ul.btn li.reservation a:hover{
	background-color:#f60;
	background-image:inherit;
}

#page-top a{
	display:block;
	width:40px;
	height:40px;
	border-radius:2.5px;
	font-size:1.2rem;
	line-height:40px;
	text-align:center;
	background:#f80;
	color:#FFF;
	position:fixed;
	bottom:20px;
	right:20px;
	opacity:0.8;
}

#page-top:hover{
	text-decoration:none;
	background:#888;
}

#footer{
	background-color: rgba(255, 255, 255, 0.37);
	padding:10px;
	margin:10px;
}

#shoplink{
	margin-bottom:20px;
}

#shoplink p.ttx{
	text-align:center;
	margin-bottom:10px;
}

#shoplink ul.banner li{
	width:50%;
	float:left;
	text-align:center;
}

#shoplink ul.banner li a{
	display:block;
	margin:5px;
}

#shoplink ul.banner li a:hover{
	opacity:0.5;
}

#shoplink ul.banner li img{
	width:100%;
	vertical-align:bottom;
}

/** 13.02.2017 鬩幢ｽ｢隴擾ｽｴ郢晢ｽｻ驍ｵ・ｺ陋滂ｽ｡繝ｻ・ｹ繝ｻ・ｧ郢晢ｽｻ繝ｻ・､鬩幢ｽ｢隴趣ｽ｢繝ｻ・ｽ繝ｻ・ｳ鬮ｯ讓奇ｽｺ・ｽ陋ｻ・､髯晢ｽｲ繝ｻ・ｩ鬩幢ｽ｢隴趣ｽ｢繝ｻ・ｽ繝ｻ・ｻ鬯ｮ・ｴ隰・∞・ｽ・ｽ繝ｻ・ｽ鬮ｯ・ｷ闔ｨ螟ｲ・ｽ・｣繝ｻ・ｰ **/
#shoplink p.card {
	/* margin-left: 15px; */
	text-align: center;
}
#shoplink p.card a {
	display:block;
}

#shoplink p.card img{
	vertical-align: bottom;
	max-width: 360px;
	border-radius: 5px;
}
/**************************/

#siteinfo{
	text-align:center;
	margin-bottom:20px;
}

#siteinfo p.logo{
	margin-bottom:0px;
}

#siteinfo p.logo a{
	display:block;
}

#siteinfo p.logo img{
	width:100%;
	vertical-align:bottom;
	max-width:360px;
	border-radius:5px;
	
}

#siteinfo p.time{
	font-size:1.0rem;
	line-height:1.0em;
	font-weight:bold;
	margin:5px 0;
	margin-bottom:5px;
}

#siteinfo p.card img{
	width:100%;
	vertical-align:bottom;
	max-width:240px;
}

/**  鬮｣豈費ｽｼ螟ｲ・ｽ・ｽ繝ｻ・･鬮｣蛹・ｽｽ・ｳ髯区ｻゑｽｽ・ｶ郢晢ｽｻ繝ｻ・ｻ髯溘・螻ｮ繝ｻ・ｽ繝ｻ・ｧ髣費ｽｨ隲幢ｽｶ繝ｻ・ｽ繝ｻ・､鬨ｾ蛹・ｽｽ・ｻ髯晢ｽｲ繝ｻ・ｩ鬩幢ｽ｢隴趣ｽ｢繝ｻ・ｽ繝ｻ・ｻ鬩幢ｽ｢隴擾ｽｴ郢晢ｽｻ驍ｵ・ｺ陋滂ｽ｡繝ｻ・ｹ繝ｻ・ｧ郢晢ｽｻ繝ｻ・､鬩幢ｽ｢隴趣ｽ｢繝ｻ・ｽ繝ｻ・ｳ鬩搾ｽｵ繝ｻ・ｺ髫ｶ蜷晢ｽｯ繧・ｽｼ・ｯ鬩搾ｽｵ繝ｻ・ｺ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｮ驛｢譎｢・ｽ・ｻ髯懶ｽｨ陜｣・､繝ｻ・ｸ繝ｻ・ｺ郢晢ｽｻ繝ｻ・ｫ鬮ｯ貅ｷ萓帙・・ｾ繝ｻ・｡郢晢ｽｻ繝ｻ・ｻ髯区ｻゑｽｽ・･郢晢ｽｻ繝ｻ・ｰ **/
#siteinfo ul.tel {
	font-size:1.0rem;
	font-weight:bold;
	margin: 5px 0;
	text-align: center;
}

#siteinfo ul.tel li {
	margin-bottom: 10px;
    margin-right: 10%;
}

#siteinfo ul.tel li a {
	color: #000;
	padding-left: 15px;
}

.tellink {
	background-color: #0af;
	-webkit-box-shadow: 2px 2px #08c;
	box-shadow: 2px 2px #08c;
	color: #fff;
	font-family: "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
	font-size: 1.7em;
	line-height: 1.0em;
	font-weight: bold;
	cursor: pointer;
	display: block;
	width: 50%;
	padding: 10px;
	border-radius: 5px;
	border: none;
	text-align: center;
}
p.ttx {
	color: #f80;
	font-weight: bold;
	margin: 10px 5px 5px;
}
p.description {
	padding-left: 10px;
}

.paginator ul {
	float: right;
}

.paginator ul li {
	display: inline;
	list-style: none;
	padding: 5px;
}

/*****************************************/

address{
	font-size:0.6rem;
	line-height:1.0em;
	padding:10px 0;
	text-align:center;
}

@media only screen and (min-width:760px){
	
	#header div.container{
		display:table;
		width:100%;
	}
	
	#header div.top{
		display:table-cell;
		vertical-align:middle;
		margin-bottom:0;
        float: left;
	}
	
	#header ul.btn{
		display:table-cell;
		width:50%;
		vertical-align:middle;
	}
	
	#membership div.container{
		display:table;
		width:100%;
	}
	
	#membership div.states{
		display:table-cell;
		/*width:33%;*/
		width: 40%;
		vertical-align:middle;
		margin-bottom:0;
		margin-left:0.5%;
	}
	
	#membership div.states p.point span{
		font-size:1.5rem;
		line-height:1.0em;
		margin:10px 0;
	}
	
	#membership ul.btn{
		display:table-cell;
		width:33%;
		vertical-align:middle;
		margin-bottom:0;
	}
	
	#membership div.reservation{
		display:table-cell;
		width:33%;
		vertical-align:middle;
		margin-right:0.5%;
	}
	
	#g-navi li{
		width:25%;
	}
	
	#contents div.container{
		padding:20px;
	}
	
	#footer div.container{
		display:table;
		width:100%;
	}
	
	#shoplink{
		display:table-cell;
		width:50%;
		vertical-align:top;
	}
	
	#shoplink p.ttx{
		text-align:left;
		margin:0 20px 10px;
	}
	
	#shoplink ul.banner{
		margin:0 10px;
	}
	
	#shoplink ul.banner li{
		text-align:left;
	}
	
	#siteinfo{
		display:table-cell;
		width:50%;
		vertical-align: middle;
	}
}

@media only screen and (min-width:960px){
	#wrap{
		width:960px;
		margin:0 auto;
	}
}

@media only screen and (max-width: 480px){
 img{
   max-width:100% !important;
  }
}