@import url(https://fonts.googleapis.com/earlyaccess/sawarabigothic.css);
@import url(//fonts.googleapis.com/css?family=Open+Sans:400,400italic,600,600italic,700,700italic);
@font-face {
	font-family: 'Icons';
	src: url('./font/whhg/font/webhostinghub-glyphs.eot'); /* IE9 Compat Modes */
	src: url('./font/whhg/font/webhostinghub-glyphs.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	/*url('./font/whhg/font/webhostinghub-glyphs.woff') format('woff'), /* Modern Browsers */
	url('./font/whhg/font/webhostinghub-glyphs.ttf')  format('truetype'), /* Safari, Android, iOS */
	url('./font/whhg/font/webhostinghub-glyphs.svg#svgFontName') format('svg'); /* Legacy iOS */
}
@font-face {
	font-family: 'Icons2';
	src: url('./font/foundation/foundation-icons/foundation-icons.eot'); /* IE9 Compat Modes */
	src: url('./font/foundation/foundation-icons/foundation-icons.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	url('./font/foundation/foundation-icons/foundation-icons.woff') format('woff'), /* Modern Browsers */
	url('./font/foundation/foundation-icons/foundation-icons.ttf')  format('truetype'), /* Safari, Android, iOS */
	url('./font/foundation/foundation-icons/foundation-icons.svg#svgFontName') format('svg'); /* Legacy iOS */
}
@font-face {
	font-family: 'SNSIcons';
	src: url('./font/icomoon/fonts/icomoon.eot'); /* IE9 Compat Modes */
	src: url('./font/icomoon/fonts/icomoon.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	url('./font/icomoon/fonts/icomoon.woff') format('woff'), /* Modern Browsers */
	url('./font/icomoon/fonts/icomoon.ttf')  format('truetype'), /* Safari, Android, iOS */
	url('./font/icomoon/fonts/icomoon.svg#svgFontName') format('svg'); /* Legacy iOS */
}

/****************************************
RESET
****************************************/
html{
	color: #000000;
	background: #ffffff;
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video, input, textarea,
p, blockquote, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

table {
	border-collapse:collapse;
	border-spacing:0;
}
fieldset,
img {
	border:0;
}
address, caption, cite, code, dfn, em, strong, th, var {
	font-style:normal;
	font-weight:normal;
}
li {
	list-style:none;
}

caption,
th {
	text-align:left;
}
h1, h2, h3, h4, h5, h6 {
	font-size:100%;
	font-weight:normal;
}
q:before, q:after {
	content:”;
}
abbr, acronym {
	border:0;
	font-variant:normal;
}
/* to preserve line-height and selector appearance */
sup {
	vertical-align:text-top;
}
sub {
	vertical-align:text-bottom;
}
input,
textarea,
select {
	font-family:inherit;
	font-size:inherit;
	font-weight:inherit;
}
/*to enable resizing for IE*/
input,
textarea,
select {
	*font-size:100%;
}
/*because legend doesn’t inherit in IE */
legend {
	color:#000;
}
img {
	margin: 0;
	padding: 0;
	vertical-align: bottom;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: ”;
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* iOSでのデフォルトスタイルをリセット */
input[type="submit"],
input[type="reset"],
input[type="button"] {
	border-radius: 0;
	-webkit-box-sizing: content-box;
	-webkit-appearance: button;
	appearance: button;
	border: none;
	box-sizing: border-box;
	cursor: pointer;
}
input[type="submit"]::-webkit-search-decoration,
input[type="reset"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
	display: none;
}
input[type="submit"]::focus,
input[type="reset"]::focus,
input[type="button"]::focus {
	outline-offset: -2px;
}


/****************************************
BASE
****************************************/
a:link	{ color: #d91319; font-weight: normal; text-decoration: none; } /* 普通のリンク色 */
a:visited { color: #d91319; font-weight: normal; text-decoration: none; } /* すでに見たリンク色 */
a:active { color: #ffba49; font-weight: normal; text-decoration: none; } /* クリックしたときのリンク色 */
a:hover	{ color: #ffba49; font-weight: normal; text-decoration: none; } /* カーソルが乗ったときのリンク色 */
a:hover,a.hover {
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}
/*
a:hover img,a.hover img {
	filter:alpha(opacity=80);
	-moz-opacity: 0.8;
	opacity: 0.8;
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}
*/
html, body {
	height: 100%;
		}
body {
	background: #ffffff;
	margin: 0 auto;
	font-size: 100%;
	line-height: 180%;
	color: #1b1b1b;
	font-family: "Sawarabi Gothic",sans-serif;
	-webkit-text-size-adjust : none;
/*
font-family: Avenir,"Open Sans","Helvetica Neue",Helvetica,Arial,Verdana,Roboto,"游ゴシック","Yu Gothic","游ゴシック体","YuGothic","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","Meiryo UI","メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
font-family: "KozGoPro-Light", "小塚ゴシック Pro L", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック", YuGothic, "メイリオ", Meiryo, sans-serif;
font-family: "ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
font-family: 'Noto Sans Japanese', "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
font-family: -apple-system,BlinkMacSystemFont,"Helvetica Neue","Hiragino Sans","Hiragino Kaku Gothic ProN","游ゴシック  Medium",meiryo, sans-serif;
font-family: "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "MS P明朝" , "MS PMincho" , serif;
*/
}
@media screen and (max-width: 680px) {

}
img {
	margin: 0;
	padding: 0;
	width: 100%;
}

h1,h2,h3,h4,h5,h6 {

}
h1 {
	background: #663300;
	width: 100%;
	margin: 0 auto;
	padding: 3px 8px;
    box-sizing: border-box;
	font-size: 75%;
	text-align: center;
	color: #ffffff;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	position: relative;
	z-index: 100;
}
h1 .lang_zone {
	position: absolute;
	top: 5%;
	right: 3%;
}
h1 .lang_zone ul {
	width: auto;
}
h1 .lang_zone ul:after {
	content: "";
	display: block;
	clear: both;
}
h1 .lang_zone ul li {
	display: inline-block;
	width: auto;
	margin: 0 0.5%;
}
h1 .lang_zone ul li:first-child {
	margin: 0 0.5% 0 0;
}
h1 .lang_zone ul li:last-child {
	margin: 0 0 0 0.5%;
}
h1 .lang_zone ul li a {
	display: block;
	text-decoration: underline;
}
h1 .lang_zone ul li a:hover,h1 .lang_zone ul li a.hover {
	text-decoration: none;
}
@media only screen and (max-width: 680px) {
	h1, h1 .lang_zone {
		display: none;
	}
}
#wall h2 {
	background: #d91319;
	margin: 5% auto;
	padding: 2px 0;
	font-size: 130%;
	font-weight: bold;
	text-align: center;
	color: #ffffff;
}
#wall h2.title {
	margin: 0 auto 3%;
}
#wall h2:before {
	margin: 0;
	display: block;
	content: "";
	border-top: 1px #ffffff dashed;
}
#wall h2:after {
	margin: 0;
	display: block;
	content: "";
	border-bottom: 1px #ffffff dashed;
}
@media only screen and (max-width: 680px) {
	#wall h2 {
		display: none;
	}
	#wall h2.title {
		display: block;
		margin: 3% auto;
	}
}
#wall h3 {
	background: #d91319;
	display: block;
	margin: 0 auto 1%;
	padding: 1% 2%;
	font-size: 130%;
	color: #ffffff;
	position: relative;
}
#wall h3:before {
	font-family: "Icons";
	content: "\f717";
	padding: 0 1% 0 0;
	font-size: 120%;
	vertical-align: sub;
}
#wall h3 span {
	font-size: 80%;
	position: absolute;
	bottom: 15%;
	right: 2%;
}
#wall h3 span:before {
	content: "-";
	padding: 0 2px 0 0;
}
#wall h3 span:after {
	content: "-";
	padding: 0 0 0 2px;
}
@media only screen and (max-width: 680px) {
	#wall h3	{
		font-size: 110%;
	}
}
h4:before {

}
h4 {

}
h4 span {

}
@media only screen and (max-width: 680px) {

}
h5 {

}

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

}
#wall {
	width: 100%;
	max-width: 1000px;
	height: auto;
	min-height: 600px;
	margin: 0 auto;
	padding: 0 0 10%;
	position: relative;
}
.menu_bar {
	width: 19%;
	margin: 0 1% 0 0;
	float: left;
}
#content {
	width: 58%;
	float: left;
    padding-left: 1%;
    padding-right: 1%;
    box-sizing: border-box;
}
.calam2 #content {
	width: 80%;
	margin: 0;
	float: left;
}
.content_inner {
	margin: 0 auto 5%;
	max-width: 1000px;
	width: 100%;
}
.right_side {
	width: 19%;
	margin: 0 0 0 1%;
	float: left;
}
.under_side {
	display: none;
}
#wall:after,#content:after,.content_inner:after {
	content: "";
	display: block;
	clear: both;
}
#content p,.content_inner p {

}
@media only screen and (max-width: 680px) {
	.content_inner {
		width: 98%;
		margin: 0 auto 10%;
	}
	#content,.calam2 #content {
		width: 96%;
		margin: 0 auto;
		padding: 0 2%;
		float: none;
	}
	#content p,.content_inner p {

	}
	.menu_bar {
		display: none;
	}
	.right_side {
		width: 96%;
		margin: 8% auto 0;
		padding: 0 2%;
		float: none;
	}
	.under_side {
		display: block;
	}
}
.pc {
	display: inline-block;
}
.sp {
	display: none;
}
@media only screen and (max-width: 1000px) {
	.pc {
		display: none;
	}
	.sp {
		display: block;
	}
}
.clear {
	clear: both;
}
.big {
	font-size: 200%;
}
.small {
	font-size: 75%;
}
.mincho {
	/* font-family: "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "MS P明朝" , "MS PMincho" , serif; */
	font-family: "Sawarabi Mincho";
}
.no_data {
    text-align: center;
}


/****************************************
effect
****************************************/
/* 画面外にいる状態 */
.effect {
	opacity : 0.1;
	transform : translate(0, 50px);
	transition : all 500ms;
}

/* 画面内に入った状態 */
.effect.scrollin {
	opacity : 1;
	transform : translate(0, 0);
}

/****************************************
tub
****************************************/
.tub {
    width: 100%;
    max-width: 1000px;
    margin: 0.5% auto;
    font-size: 80%;
    /* margin-top: 60px; */
    padding: 10px;
}
@media only screen and (max-width: 680px) {
	.tub {
        width: 90%;
	}
}
.breadcrumb {
	width: 100%;
    line-height: 1.3;
}
.breadcrumb li {
	display: inline-block;
	margin: 0;
	width: auto;
}
.breadcrumb li a {
	display: inline-block;
	margin: 0;
	padding: 0;
	width: auto;
	text-decoration: underline;
}
.breadcrumb li a:hover,.breadcrumb li a.hover {
	text-decoration: none;
}
.breadcrumb li::after {
	content: '\00bb';
	margin: 0 10px;
	display: block;
	float: right;
}
.breadcrumb li:last-child::after {
	display: none;
}

/****************************************
CALAM
****************************************/
.main-contents {

}
.side_bar {

}

@media screen and (max-width: 1000px) {

}


@media screen and (max-width: 680px) {

}

/****************************************
backtop
****************************************/
.backtotop {
	position: fixed;
	right: 15px;
	bottom: 35px;
	z-index: 9000;
	display: none;
	text-align: center;
}

.backtotop a {
	display: block;
	color: #eeeeee;
	padding: 15px 20px;
	margin: 0;
	background-color: #a0a0a0;
	border-radius: 0;
	text-decoration: none;
	font-weight: bold;
	font-size: 12px;
}
.backtotop a:before {
	font-family: "Icons2";
	font-size: 200%;
	content: "\f144";
}
.backtotop a:hover {
	text-decoration: none;
	filter:alpha(opacity=80);
	-moz-opacity: 0.8;
	opacity: 0.8;
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}
@media screen and (max-width: 680px) {
	.backtotop {
		position: relative;
		right: 0;
		bottom: 0;
		z-index: 1;
		margin: 2% auto;
	}
	.backtotop a {
		padding: 10px 15px;
		line-height: 100%;
	}
}

/****************************************
header
****************************************/

header {
	background: #ffffff;
	background-size: 5%;
	width: 98%;
	height: auto;
	margin: 0;
	padding: 1%;
	text-align: center;
	/* z-index: 9998; */
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;

}
header + #wall,
header + .tub,
header + .slider {
    margin-top: 60px;
}
header .inner {
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
	position: relative;
}
header:after,header .inner:after {
	content: "";
	clear: both;
	display: block;
}
header .logo {
	display: flex;
    align-items: center;
	width: 36%;
    min-width: 150px;
	position: relative;
    min-height: 50px;
}
@media only screen and (max-width: 1000px) {
}
header .logo span {
	display: block;
	font-size: 80%;
	text-align: center;
	line-height: 35%;
}
header .logo i {
	position: absolute;
	bottom: 15px;
	font-size: 80%;
	right: 5px;
	font-weight: bold;
	text-shadow: 2px 2px 0 #FFF, -2px -2px 0 #FFF, -2px 2px 0 #FFF, 2px -2px 0 #FFF, 0px 2px 0 #FFF, 0-2px 0 #FFF, -2px 0 0 #FFF, 2px 0 0 #FFF;
}
/*
@keyframes turnY{
	0%{transform:rotateY(0deg);}
	100%{transform:rotateY(360deg);}
}
header .logo:hover {
	animation-name:turnY;
	animation-duration:3s;
	animation-iteration-count:1;
}
*/
header .logo img {

}

.address {
	background: #FFFFFF;
    width: 500px;
    height: auto;
    margin: 0;
    padding: 1.4%;
    font-size: 95%;
    text-align: left;
    color: #663300;
    position: absolute;
    top: 49px;
    right: 220px;
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    background: rgba(102,51,0,0.20);
}

.address:after {
	display: block;
	content: "";
	clear: both;
}
.address .time {
	width: 40%;
	margin: 0 auto;
	line-height: 140%;
	display: block;
	font-size: 90%;
	text-align: right;
	float: left;
}
.address .time div.time_title {
	background: #ffffff;
	padding: 1px 2px;
	text-align: center;
	font-size: 110%;
}
.address .time div.time_days {
    margin-top: 2%;
	line-height: 170%;
}
.address .time span.br {
	display: block;
}
header.fixed .address .time {
	/* display: none; */
}
.address .tel_frame {
	width: auto;
	float: right;
}
.address .tel {
	display: block;
	padding: 10px 0 5px;
	font-size: 250%;
	text-align: center;
}
.address .tel:before {
	font-family: "Icons";
	font-size: 70%;
	padding-right: 5px;
	content: "\f15b";
}
@keyframes Flash1{
	50%{
		opacity: 0;
	}
}
.address .atend {
	display: block;
	text-align: center;
	font-size: 95%;
	animation: Flash1 1s infinite;
}

@media only screen and (max-width: 1000px) {
	header {
        width: 100%;
        padding: 0;
        /* position: fixed; */
        top: 0;
        left: 0;
        z-index: 999;
}
	header .logo {
		width: 20%;
		margin: 0 auto;
		padding: 2% 0 1%;
	}
	header .logo i {
		bottom: 17%;
		right: 5%;
	}
	.address {
		width: 97.5%;
		position: relative;
	}
	.address .time {
		width: 100%;
		text-align: center;
		float: none;
	}
	.address .time span.br {
		display: unset;
		padding: 0 0 0 1%;
	}
	.address .tel_frame {
		float: none;
		font-size: 80%;
		line-height: 150%;
	}
}

@media only screen and (max-width: 1000px) {
	header .logo {
		margin: 0 0 0 2%;
	}
	header .logo span {
		display: none;
	}
	header .logo i {
		font-size: 50%;
	}
	.address {
		font-size: 80%;
	}
	.address .tel_frame {
		display: none;
	}
	header .menu_button {
		width: 35px;
		height: 35px;
		position: absolute;
		text-align: center;
		z-index: 999;
		right: 3%;
		top: 10%;
		text-align: center;
		font-size: 55%;
		color: #663300;
		line-height: 70%;
		cursor: pointer;
	}
	header .menu_button.active{
		top: 15%;
	}

	header .menu_button span {
		display: block;
		width: 100%;
		margin: 0 auto;
		padding: 3px 0;
		border-top: 3px #663300 solid;
	}
	header .menu_button span.text {
		padding: 0;
		border: none;

	}
	header .menu_button.active span.text {
		background: none;
		transform: rotate(0);
		margin-top: 9px;
		margin-left: -4px;
	}

	header .menu_button.active span
	{
		opacity: 1;
		transform: rotate(45deg) translate(0, 4px);
		background: #663300;
		border-top: 0;
		padding: 1.5px 0;

	}

	header .menu_button.active span:nth-last-child(3)
	{
		opacity: 0;
		transform: rotate(0deg) scale(0, 0);
	}

	header .menu_button.active span:nth-last-child(2)
	{
		transform: rotate(-45deg) translate(0, -5px);
	}

	header nav.menu {
		position: absolute;
		top: 100%;
		background: rgba(255,255,255,1);
		color: #ffffff;
		width: 100%;
		left: 0;
		font-size: 70%;
		line-height: 220%;
		z-index: 9999;
		box-shadow: 0 3px 3px rgb(0 0 0 / 16%);
	}
	header header nav.menu ul {
		list-style-type: none;
		margin: 0;
		padding: 0;
	}
	header nav.menu ul li {
		border-bottom: dotted 1px #1b1b1b;
		text-align: right;
	}
	header nav.menu ul li:last-child {
		border-bottom: none;
	}
	header nav.menu ul li a {
		display: block;
		padding: 4px 3% 4px 0;
		color: #663300;
		font-size: 110%;
	}

    header + #wall,
    header + .tub,
    header + .slider {
        margin-top: 160px;
    }

}

/****************************************
footer
****************************************/
footer {
	padding: 5% 0 0;
}
footer:after {
	content: "";
	clear: both;
	display: block;
}
footer h4:before {
	padding-right: 3px;
	font-family: "Icons";
	font-size: 75%;
	content: "\f504";
}
footer h4 {
	margin: 0;
	padding: 0 0 0 2%;
	color: #ffffff;
	font-size: 110%;
	text-align: left;
}
footer h4 span {

}
footer .footer_group {
	margin: 0 auto;
	width: 98%;
	max-width: 1000px;
}
footer .footer_group:after {
	content: "";
	clear: both;
	display: block;
}
footer .footer_group .list {
	width: auto;
	margin: 0;
	padding: 0;
	text-align: center;
}
footer .footer_group .list ul {
	width: auto;
	margin: 0 auto;
	font-size: 85%;
}
footer .footer_group .list ul:after {
	content: "";
	clear: both;
	display: block;
}
footer .footer_group .list ul li {
	display: inline-block;
	padding: 0 1% 1% 0;
}
footer .footer_group .list ul li a {
	text-decoration: underline;
	color: #d91319;
}
footer .footer_group .list ul li a:hover,footer .footer_group .list ul li a.hover {
	text-decoration: none;
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}
footer .copy {
	text-align: center;
	font-size: 90%;
}
footer .copy a {
	color: #1b1b1b;
}
@media only screen and (max-width: 680px) {
	footer .footer_group .list ul {
		line-height: 160%;
	}
}

/****** FIXED_NAV ******/


@media screen and (max-width: 680px) {
	#fixed_nav .fixed_nav {
		position: fixed;
		z-index: 9999;
		bottom: 0;
		left: 0;
		overflow: hidden;
		width: 100%;
		height: auto;
		padding: 2% 0;
		background: rgba(102,51,0,0.9);
	}
	#fixed_nav .static {
		margin: 5% auto 0;
		position: static;
	}
	#fixed_nav .fixed_nav ul.fixed_menu {
		margin: 0 auto;
		width: 98%;
	}
	#fixed_nav .fixed_nav ul.fixed_menu li {
		margin: 0;
		width: 50%;
		display: block;
		float: left;
	}
	#fixed_nav .fixed_nav ul.fixed_menu li:first-child {
		margin: 0;
	}
	#fixed_nav .fixed_nav ul.fixed_menu li a {
		margin: 0 auto;
		padding: 10px 0;
		width: 96%;
		background: #ffffff;
		display: block;
		text-align: center;
		border-radius: 5px;
		color: #663300;
		font-size: 12px;
		font-weight: bold;
	}
	#fixed_nav .fixed_nav ul.fixed_menu li a:hover,#fixed_nav .fixed_nav ul.fixed_menu li a.hover {
		color: #d9c1a8;
		transition: all 0.5s ease;
		-webkit-transition: all 0.5s ease;
		-moz-transition: all 0.5s ease;
		-o-transition: all 0.5s ease;
	}
	#fixed_nav .fixed_nav ul.fixed_menu li.tel a:before {
		font-family: "Icons2";
		font-size: 200%;
		content: "\f1f8";
		vertical-align: bottom;
		padding: 5px;
	}
	#fixed_nav .fixed_nav ul.fixed_menu li.mail a:before {
		font-family: "Icons";
		font-size: 130%;
		content: "\f136";
		vertical-align: bottom;
		padding: 5px;
	}
	#fixed_nav .fixed_nav ul.fixed_menu li.line_b a:before {
		font-family: "Icons";
		font-size: 130%;
		content: "\f697";
		vertical-align: bottom;
		padding: 5px;
	}
	#fixed_nav .fixed_nav ul.fixed_menu li.register a:before {
		font-family: "Icons";
		font-size: 130%;
		content: "\f332";
		vertical-align: bottom;
		padding: 5px;
	}
}

/****** MENU_BAR ******/
.menu_bar ul.list {
	width: 100%;
}
.menu_bar ul.list li {
	width: 100%;
	margin: 0 auto 1%;
}
.menu_bar ul.list li:last-child {
	margin: 0 auto;
}
.menu_bar ul.list li a {
	background: #A9DBE6;
	display: block;
	margin: 0;
	padding: 6% 5%;
	font-size: 90%;
	color: #ffffff;
	overflow: hidden;
	position: relative;
}
.menu_bar ul.list li a span {
	font-size: 80%;
	position: absolute;
	bottom: 0;
	right: 2%;
}
.menu_bar ul.list li a span:before {
	content: "-";
	padding: 0 2px 0 0;
}
.menu_bar ul.list li a span:after {
	content: "-";
	padding: 0 0 0 2px;
}
/*
.menu_bar ul.list li a:before {
	margin: 0;
	display: block;
	content: "";
	border-top: 1px #ffffff dashed;
}
.menu_bar ul.list li a:after {
	margin: 0;
	display: block;
	content: "";
	border-bottom: 1px #ffffff dashed;
}
*/
.menu_bar ul.list li a:before {
	font-family: "Icons";
	padding: 0 2% 0 0;
	font-size: 130%;
	vertical-align: bottom;
}
.menu_bar ul.list li:nth-child(1) a:before {
	content: "\f033";
}
.menu_bar ul.list li:nth-child(2) a:before {
	content: "\21b8";
}
.menu_bar ul.list li:nth-child(3) a:before {
	content: "\f5e4";
}
.menu_bar ul.list li:nth-child(4) a:before {
	content: "\f304";
}
.menu_bar ul.list li:nth-child(5) a:before {
	content: "\f2a1";
}
.menu_bar ul.list li:nth-child(6) a:before {
	content: "\f0a1";
}
.menu_bar ul.list li:nth-child(7) a:before {
	content: "\f1b7";
}
.menu_bar ul.list li:nth-child(8) a:before {
	content: "\f78c";
}
.menu_bar ul.list li:nth-child(9) a:before {
	content: "\f092";
}
.menu_bar ul.list li:nth-child(10) a:before {
	content: "\f136";
}
.menu_bar ul.list li a:hover,.menu_bar ul.list li a.hover {
	background: #dff7fc;
	color:#64bfd2;
	/*
	-webkit-transform: scale(1.1);
	-moz-transform: scale(1.1);
	-o-transform: scale(1.1);
	-ms-transform: scale(1.1);
	transform: scale(1.1);
	text-decoration: none;
	filter:alpha(opacity=90);
	-moz-opacity: 0.9;
	opacity: 0.9;
	*/
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}


/****** SIDE ******/
.right_side {

}
.right_side figure {
	margin: 0 auto 3%;
}
.menu_bar figure,.under_side figure {
	margin: 3% auto;
}
.right_side figure:last-child,.menu_bar figure:last-child,.under_side figure:last-child {
	margin: 3% auto 0;
}
.right_side figure h4,.menu_bar figure h4,.under_side figure h4 {
	background: #ffa69d;
	margin: 5% auto;
	padding: 2px 0;
	font-size: 95%;
	text-align: left;
	color: #ffffff;
}
.right_side figure h4 span,.menu_bar figure h4 span,.under_side figure h4 span {
	padding: 0 5%;
}
.right_side figure h4:before,.menu_bar figure h4:before,.under_side figure h4:before {
	margin: 0;
	display: block;
	content: "";
	border-top: 1px #ffffff dashed;
}
.right_side figure h4:after,.menu_bar figure h4:after,.under_side figure h4:after {
	margin: 0;
	display: block;
	content: "";
	border-bottom: 1px #ffffff dashed;
}
figure.banner_zone {

}
figure.banner_zone ul {
	width: 100%;
	margin: 0 auto;
}
figure.banner_zone ul li {
	margin: 0 auto 1%;
}
figure.banner_zone ul li:last-child {
	margin: 0 auto;
}
figure.banner_zone ul li a {
	display: block;
}
figure.banner_zone ul li a img {

}
figure.banner_zone ul li a:hover img {
	filter:alpha(opacity=80);
	-moz-opacity: 0.8;
	opacity: 0.8;
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}
figure.twitter_zone {
	width: 100%;
	margin: 0 auto;
}
figure.new_girl {
	width: 100%;
	margin: 0 auto;
}
figure.new_girl ul {
	background: #f3f1ef;
	width: 100%;
	max-height: 400px;
	margin: 0 auto;
	overflow-y: auto;
}
figure.new_girl ul li {
	width: 100%;
	margin: 0 auto 2%;
	text-align: center;
	border-bottom: 1px #663300 dashed;
}
figure.new_girl ul li:last-child {
	margin: 0 auto;
	border-bottom: none;
}
figure.new_girl ul li a {
	display: block;
	margin: 0;
	padding: 5%;
	color: #663300;
	line-height: 140%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	position: relative;
}
figure.new_girl ul li a:hover {
	filter:alpha(opacity=70);
	-moz-opacity: 0.7;
	opacity: 0.7;
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}
figure.new_girl ul li a img {
	width: 96%;
	margin: 0 auto 2%;
}
figure.new_girl ul li a p {
	margin: 0 0 1%;
}
figure.new_girl ul li:last-child a p {
	margin: 0;
}
figure.new_girl ul li a .name {
	font-weight: bold;
	font-size: 95%;
}
figure.new_girl ul li a .name i {
}
figure.new_girl ul li a .name i:before {
	content: "/";
	padding: 0 2%;
}
figure.new_girl ul li a .size {
	font-size: 90%;
}
figure.new_girl ul li a .comment {
	font-size: 75%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
@media only screen and (max-width: 1000px) {
	figure.twitter_zone {
		display: none;
	}
}
@media only screen and (max-width: 680px) {
	figure.new_girl ul {
		max-height: max-content;
	}
	figure.new_girl ul:after,figure.new_girl ul li a:after {
		display: block;
		content: "";
		clear: both;
	}
	figure.new_girl ul li a .name i {
		display: block;
	}
	figure.new_girl ul li a .name i:before {
		display: none;
	}
	figure.new_girl ul li,figure.new_girl ul li:last-child {
		width: 30.333333%;
		margin: 1%;
		text-align: center;
		font-size: 80%;
		border: 1px #663300 solid;
		overflow: hidden;
		float: left;
	}
	figure.twitter_zone {
		display: block;
	}
}

/****************************************
pager
****************************************/
.pager {
	margin: 10% auto 0;
}
.pager .pagination {
	text-align: center;
}
.pager .pagination li {
	display: inline;
	margin: 0 2px;
	padding: 0;
	display: inline-block;
	background: #eeeeee;
	width: 50px;
	height: 50px;
	text-align: center;
	position: relative;
	border-radius: 50%;
}
.pager .pagination li.omit {
	background: none;
	color: #ffffff;
	position: relative;
}
.pager .pagination li a {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	color: #333333;
	text-decoration: none;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all  0.3s ease;
}
.pager .pagination li.omit span {
	display: table-cell;
	vertical-align: middle;
	font-size: 150%;
	color: #333333;
	position: absolute;
	left: 35%;
	top: 10%;
}
.pager .pagination li:not(.disabled) a:hover,.pager .pagination li a.active {
	color: #ffffff;
	background: #d91319;
	border-radius: 50%;
}

#content .btn_reservation {
    background-color: #754621;
    padding: 5%;
    text-align: center;
    line-height: 1;
    color: #ffffff;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
	margin-top: 5px;
}

.btn_reservation::before {
    content: "";
    width: 1em;
    height: 1em;
    background: url(/icon/pen.svg) no-repeat center / cover;
    display: inline-block;
    margin-right: 0.5em;
}

.disabled {
    pointer-events: none;
    cursor: not-allowed;
    opacity: 0.5;
    color: #ccc;
}

button svg {
    width: 0.5em;
    margin-left: 0.5em;
}

.content {
	padding:5px;
}

.content li {
	color:#754621;
	border-bottom: 1px solid #D2D2D2;
	padding:5px;
}

.btn_reservation_detail {
	display: flex;
	align-items: center;
	justify-content: center;
	margin:0 0 4% auto;
}

.btn_reservation_detail a {
	text-align: center;
	width: 340px;
	font-size: 17px;
	padding: 9px;
	border-radius: 17px;
	background-color: #754621;
    text-align: center;
    line-height: 1;
    color: #ffffff;
    -webkit-border-radius: 17px;
    -moz-border-radius: 17px;
    -ms-border-radius: 17px;
    -o-border-radius: 17px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn_reservation_detail a::before {
    content: "";
    width: 1em;
    height: 1em;
    background: url(/icon/pen.svg) no-repeat center / cover;
    display: inline-block;
    margin-right: 0.5em;
}

.btn_reservation_details a {
	text-align: center;
	font-size: 10px;
	padding: 9px;
	border-radius: 17px;
	background-color: #754621;
    text-align: center;
    line-height: 1;
    color: #ffffff;
    -webkit-border-radius: 17px;
    -moz-border-radius: 17px;
    -ms-border-radius: 17px;
    -o-border-radius: 17px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn_reservation_details a::before {
    content: "";
    width: 1em;
    height: 1em;
    background: url(/icon/pen.svg) no-repeat center / cover;
    display: inline-block;
    margin-right: 0.5em;
}

@media only screen and (max-width: 680px) {
	header {
		position: fixed;
		top: 0;
		height: 62px;
		border-bottom: 1px solid rgba(225,215,206,255);
	}

	header .menu_button {
		top: 28%;
	}

	header .menu_button.active {
		top: 35%;
	}

	.address {
		top: 0;
		right: 0;
		z-index: 1;
		background:rgba(225,215,206,255);
	}

	.slider aside{
		margin-top: 92px;
	}

	.btn_reservation_details a {
		font-size: 1%;
    	border-radius: 10px;
	}

	.btn_reservation_details a::before {
		background:none;
	}

	.tub {
		margin-top:0;
		padding: 10px;
	}

	nav.menu .address
	{
		display: block !important;
	}
}

@media only screen and (max-width: 1000px) {
	h1.top {
		display: none;
	}

	header {
		position: fixed;
		top: 0;
		border-bottom: 1px solid rgba(225,215,206,255);
	}

	header .menu_button {
		top: 28%;
	}

	header .menu_button.active {
		top: 35%;
	}

	.address {
		top: 0;
		right: 0;
		z-index: 1;
		margin-top:63px;
		background:rgba(225,215,206,255);
	}

	.slider aside{
		margin-top: 92px;
	}

	.btn_reservation_details a {
		font-size: 1%;
    	border-radius: 10px;
	}

	.btn_reservation_details a::before {
		background:none;
	}

	nav.menu .address
	{
		display: block !important;
	}
}

@media screen and (min-width: 681px) and (max-width: 759px) {
	.address {
		margin-top: 72px;
	}

}

@media screen and (min-width: 759px) and (max-width: 788px) {
	.address {
		margin-top: 75px;
	}

}

@media screen and (min-width: 789px) and (max-width: 799px) {
	.address {
		margin-top: 78px;
	}

}

@media screen and (min-width: 800px) and (max-width: 810px) {
	.address {
		margin-top: 79px;
	}

}

@media screen and (min-width: 811px) and (max-width: 864px) {
	.address {
		margin-top: 80px;
	}

}

@media screen and (min-width: 865px) and (max-width: 889px) {
	.address {
		margin-top: 85px;
	}

}

@media screen and (min-width: 900px) and (max-width: 920px) {
	.address {
		margin-top: 87px;
	}

}

@media screen and (min-width: 921px) and (max-width: 949px) {
	.address {
		margin-top: 90px;
	}

}

@media screen and (min-width: 950px) and (max-width: 980px) {
	.address {
		margin-top: 93px;
	}

}

@media screen and (min-width: 981px){
	.address {
		margin-top: 95px;
	}

}

@media screen and (min-width: 1001px) and (max-width: 1280px) {
	.address {
		right:45px;
	}

}

@media screen and (min-width: 1001px){
	.address {
		margin-top: 0;
	}

}




