@charset "utf-8";
* { font-family: "Roboto Slab" , Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
	box-sizing: border-box; }

html { font-size: 15px; overflow: auto; -webkit-text-size-adjust: 100%; }
body { height:100%; color: #222222; line-height:1.7; background: #FFF; overflow: hidden; }

body, h1, h2, h3, h4, dl, dd, ul, form, textarea, figure { margin:0; padding:0; font-size:100%; }

img, input[type="image"] { font-size:0; line-height:0; vertical-align:bottom; }
ul { list-style-type:none; }
fieldset { border:none; }
strong { font-size:1.1em; margin: 0 2px; }
em { font-style:normal; font-weight:bold; }
label { display:inline-block; }
/*table { border-collapse:collapse; border-spacing:0; }*/

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

/*回り込み解除clearfix*/
.clearfix:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }
.clearfix {display:inline-block;}
/* Hides from IE-mac \*/
* html .clearfix {height:1%;}
.clearfix {display:block;}
/* End hide from IE-mac */

/* 共通 ------------------------ */
a { color:#d80300; }
a:active, a:hover { color:#d80300; text-decoration: none; }
a.hover_none:hover { color:#333; }
a img { border-width:0px; }

.left   { text-align:left; }
.center { text-align:center; }
.right  { text-align:right; }
.small  { font-size:0.85em; }
.big    { font-size:1.2em; }
.bold { font-weight:bold; }
.indent{ text-indent: -1em; padding-left: 1em; line-height: 1.4; }
.clear { clear:both; }
.hide { display:none; }
.iblock { display:inline-block; }

ul.disc, ul.square { padding-left:1.3em; }
.decimal{ margin-left: 30px; }
.decimal li{ margin-bottom: 5px; }
.disc li { list-style-type:disc; }
.square li { list-style-type:square; }
.upper-alpha li { list-style-type:upper-alpha; }
ul.upper-alpha, ol { margin-left:1.5em; padding:0; }

img.middle { vertical-align:middle; }

.red { color:#de3225; }
.orange { color:#F75A0D; }

.fleft { float:left; }
.fright { float:right; }
.shadow { box-shadow: 0 0 6px rgba(0,0,0,0.2); }

input[type="radio"] { vertical-align:-1px; }
input[type="checkbox"] { vertical-align:middle; }

a, .anime {
	-ms-transition: all .5s;
	transition: all .5s;
}

#wrapper{ width: 100%; position: relative; overflow: hidden; }
.inner{ width: 980px; margin: 0 auto; }
.wide{ width: 100%; }

.pc_none{ display: none;}

/* header------------------------*/
header{ position: relative; height: 420px; }
#top header{ height: 540px; background-color: #f4f4f4; }
#company header, #recruit header, #contact header, #privacy header{ height: 260px; }
#shop.index header{ height: auto; }
header .bg_w{ position: relative; z-index: 1; }
header .inner{ width: 1200px; margin: 0 auto; overflow: hidden; }
header .logo{ width: 306px; float: left; padding-top: 22px; }

.headimage{ position: absolute; top: 0; left: 50%; margin: 0 0 0 -750px; }
#company .headimage, #recruit .headimage, #contact .headimage, #privacy .headimage{ width: 1700px; margin-left: -850px; text-align: center; }
#company .headimage img, #recruit .headimage img, #contact .headimage img, #privacy .headimage img{ width: 100%; }
#top .headimage{ margin-left: -850px; }

.header_menu{ display: none; }
.drawr{  display: none; }

/* gnav------------------------*/
#gnav{ width: 770px; float: right; }
#gnav ul{ height: 68px; position: relative; margin: 0 auto; padding-top: 16px; }
#gnav ul > li{ float: left; }
#gnav ul > li a { display: block; height: 68px; overflow:hidden; position:relative; }
#gnav ul > li img { display: block; left:0; position: absolute; }

#gnav ul > li.home a { width: 134px; } #gnav ul > li.home a img{ left: 0; }
#gnav ul > li.company a { width: 160px; } #gnav ul > li.company a img{ left: -134px; }
#gnav ul > li.shop a { width: 160px; } #gnav ul > li.shop a img{ left: -294px; }
#gnav ul > li.recruit a { width: 160px; } #gnav ul > li.recruit a img{ left: -454px; }
#gnav ul > li.contact a { width: 126px; } #gnav ul > li.contact a img{ left: -644px; }
#gnav ul > li.contact{ margin-left: 20px; }

#gnav a:hover img, #gnav .current img { top: -68px; }

/* 店舗ロゴリスト */
.logo_slider{ position: relative; padding: 0 0 8px; background: rgba(255,255,255,0.8); z-index: 2; }
.logo_slider .bx-wrapper{ width: 100%; margin: 0 auto; }
.logo_slider .bx-viewport{ padding: 10px 0; }
.logo_slider li{ height: 110px; }
.logo_slider li img{ width: 100%; padding: 8px 8px; background-color: #FFF; box-shadow: 0 0 6px rgba(0,0,0,0.2); }

/* contents------------------------*/
.vida{ font-family: 'Vidaloka', serif; }

.flex{ display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap;
	-webkit-justify-content: space-between; justify-content: space-between; }
.bg_w{ background-color: #FFF; }

.vertical{
	-ms-writing-mode: tb-rl; /* for MS IE8+ */
  -webkit-writing-mode: vertical-rl;
  writing-mode: vertical-rl; }

.link_tate{ margin: 0; background: url(../img/link_tate.png) no-repeat; }
.link_tate:hover{ background-position: -56px 0; }
.link_tate a{ display: block; width: 56px; overflow:hidden; padding: 60px 20px 20px 8px; color: #FFF; font-size: 1.2em; text-decoration: none; }
.link_tate a:hover, .link_tate a:active, .link_tate a:visited{ color: #FFF; }
.link_yoko{  margin: 0; background: url(../img/link_yoko.png) no-repeat; }
.link_yoko a{ display: block; overflow:hidden; padding: 10px 10px 10px 40px;
 color: #FFF; font-size: 1.1em; text-decoration: none; }
.link_yoko2{  margin: 0; background: url(../img/link_yoko2.png) no-repeat; }
.link_yoko2 a{ display: block; overflow:hidden; padding: 10px 30px 6px 65px;
 color: #FFF; font-size: 1.1em; text-align:left; text-decoration: none; line-height:22px; }
.link_yoko:hover{ background-position: 0 -48px; color: #FFF; }
.link_yoko2:hover{ background-position: 0 -60px; color: #FFF; }

/* 各店舗枠 */
.s_box{ position: relative; width: 980px; min-height: 378px; margin-bottom: 60px; overflow: hidden; background: url(../img/top/bg_gozo.png) no-repeat; }
.s_box .logo{ width: 200px; float: left; }
.s_box .txt{ width: 490px; float: right; }
.s_box .logo img{ width: 100%; }
.img_right{ padding: 280px 0 0 250px; }
.img_left{ padding: 280px 150px 0 60px; }
.img_right .link_tate{ position: absolute; top: 0; left: 0; }
.img_left .link_tate{ position: absolute; top: 0; right: 0; }

.bg_daisen{ background-image: url(../img/top/bg_daisen.png); }
.bg_gozo{ background-image: url(../img/top/bg_gozo.png); }
.bg_genki{ background-image: url(../img/top/bg_genki.png); }
.bg_gyuta{ background-image: url(../img/top/bg_gyuta.png); }
.bg_hiro{ background-image: url(../img/top/bg_hiro.png); }
.bg_saitama{ background-image: url(../img/top/bg_saitama.png); }
.bg_tajima{ background-image: url(../img/top/bg_tajimaya.png); }
.bg_mztable{ background-image: url(../img/top/bg_mztable.png); }
.bg_manzo{ background-image: url(../img/top/bg_manzo.png); }
.bg_satsuma{ background-image: url(../img/top/bg_satsuma.png); }

/* footer------------------------*/
#pagetop { position: fixed; bottom: 0; right: 15px; height: 76px; margin:0; z-index: 400; }
/*チャットボット用ページトップ*/
.hiro #pagetop,
.tajima #pagetop { bottom: 95px!important; }

footer{ padding: 40px 0 0; background: url(../img/bg_footer.png) no-repeat; border-top: 2px solid #686868; }
footer a{ color: #333; }
footer p{ margin: 0; }
footer h2{ margin-bottom: 15px; }
footer h3{ width: 120px; font-size: 1.1em; float: left; }

footer .appsBtn { float:right; min-width:400px; margin-top:-80px; padding:10px 20px; border:2px solid #ea4e48; background:url(../img/bg_apps.jpg)top 0 left 0 / cover no-repeat; overflow:hidden; }
footer .appsBtn .txt { float:left; width:68%; margin-top:9px; }
footer .appsBtn .btnList { float:right; width:28%; text-align:right; }
footer .appsBtn .btnList li + li { margin-top:5px; }


.flink{ clear: both; padding: 40px 0 30px; }
.flink ul{ overflow: hidden; }
.flink > ul li{ float: left; margin-right: 50px; margin-bottom: 20px; }
.flink > ul > li a{ padding: 8px 15px; background: url(../img/arrow_red.png) no-repeat 0 10px; text-decoration: none; }
.flink > ul > li:nth-child(3){ width: 440px; margin-right: 0; }
.flink > ul > li:nth-child(3) ul{ margin: 10px 0 0 15px; }
.flink > ul > li:last-child a{ background: none; }
.flink > ul > li li{ width: 170px; margin-right: 5px; margin-bottom: 5px; }
.flink > ul > li li a{ font-size: 0.9em; background: url(../img/arrow_bla.png) no-repeat 0 50%; }


.copyright{ margin: 0; padding: 8px 0; text-align: center; font-size: 0.9em; color: #FFF; background-color: #686868; }
.copyright a{ color: #FFF; }

/*1200px 以下  980px-1199px */
@media screen and (max-width:1199px) {

	/* header------------------------*/
	header .inner{ width: 980px; }
	header .logo{ width: 21%; padding-top: 25px; }
	header .logo img{ width: 100%; }



}

/*980px 以下  768px-979px */
@media screen and (max-width:979px) {

	.sp_none{ display: none; }
	.sp_wide{ width: 100%; }
	.inner{ width: auto; margin: 0 15px; }

	/* header------------------------*/
	header{ height: 300px; }
	#top header{ height: 300px; }
	#company header, #recruit header, #contact header, #privacy header{ height: 180px; }
	header .logo{ width: auto; padding: 0; }
	header .bg_w{ padding: 15px; }

	.headimage{ width: 980px; margin: 0 0 0 -490px; }
	.headimage img{ width: 100%; }
	#company .headimage, #recruit .headimage, #contact .headimage, #privacy .headimage{ width: 980px; margin-left: -490px; }
	#top .headimage{ margin-left: -490px; }

	/* 店舗ロゴリスト */
	.logo_slider{ display: none; }

	/* スマホメニュー */
	#gnav { display: none; }
	.header_menu{ display: block; position: absolute; top: 5px; right: 10px; z-index: 80; padding: 10px; width: 60px; height: 60px; }
	.menu-trigger,
	.menu-trigger span {
		display: inline-block;
		transition: all .4s;
	}
	.menu-trigger {
		position: relative;
		width: 80%;
		height: 60px;
		padding: 0 0 0 1px;
	}
	.menu-trigger span {
		position: absolute;
		left: 4px;
		width: 100%;
		height: 4px;
		background-color: #d80300;
	}
	.menu-trigger span:nth-of-type(1) { top: 5px; }
	.menu-trigger span:nth-of-type(2) {	top: 15px; }
	.menu-trigger span:nth-of-type(3) {	top: 25px; }
	.menu-trigger.active span:nth-of-type(1) {
		-webkit-transform: translateY(10px) rotate(-405deg);
		transform: translateY(10px) rotate(-405deg);
	}
	.menu-trigger.active span:nth-of-type(2) {
		opacity: 0;
	}
	.menu-trigger.active span:nth-of-type(3) {
		-webkit-transform: translateY(-10px) rotate(405deg);
		transform: translateY(-10px) rotate(405deg);
	}

	/* メニューが開いたとき */
	.drawr {
			display: none;
			background-color: rgba(216,3,0,0.9);
			position: absolute;
			top: 0;
			right: 0;
			width: 100%;
			margin-top: 64px;
			z-index: 301;
	}

	#open_menu li {
			width: 100%;
	}
	#open_menu li a {
			font-size: 1.0em;
			color: #fff;
			font-weight: bold;
			display: block;
			position: relative;
			padding: 12px 10px 12px 40px;
			text-align: left; text-decoration: none;
			background: url(../img/icon_arrow.png) no-repeat 20px 18px;
			border-bottom: 1px solid #b00200;
	}
	#open_menu li:last-child a{ border-bottom: none; }

	/* contents------------------------*/
	.link_tate{ background-size: 100px 357px; }
	.link_tate:hover{ background-position: -50px 0; }
	.link_tate a{ width: 50px; padding: 50px 16px 10px 8px; font-size: 1.0em; }

  .link_yoko2 a{ padding-left:50px; padding-bottom:7px; font-size:1.0em; text-align:center; }

	/* 各店舗枠 */
	.s_box{ width: 100%; min-height: 250px; margin-bottom: 30px; background-size: contain; }
	.s_box .logo{ width: 20%; }
	.s_box .txt{ width: 78%; }
	.s_box .logo img{ width: 100%; }
	.img_right{ padding: 30% 0 0 10%; }
	.img_left{ padding: 30% 10% 0 0; }

	/* footer------------------------*/
	#pagetop { width: 80px; }
	#pagetop img{ width: 100%; }

}
/*768px 以下*/
@media screen and (max-width:767px) {

	header{ height: 150px; }
	#top header{ height: 150px; }
	header .logo{ width: 20%; }
	.headimage{ width: 480px; margin: 0 0 0 -240px; }
	#top .headimage{ margin-left: -240px; }
	.link_yoko a{ width: 100%; font-size: 0.9em; }
  .link_yoko2 a{ width: 100%;  padding-bottom:8px;font-size: 0.9em; line-height:20px}

	/* メニューが開いたとき */
	.drawr { margin-top: 55px; }

	/* 各店舗枠 */
	.img_right .link_tate{ top: 80px; left: 0; }
	.img_left .link_tate{ top: 80px; right: 0; }
	.s_box .logo{ width: 60%; float: none; margin: 0 auto; }
	.s_box .txt{ width: 85%; float: none; }
	.img_right .txt{ margin-left: 10%; }

	/* footer */
	#pagetop { right: 10px; width: 70px; }
    /*チャットボット用ページトップ*/
    .hiro #pagetop,
    .tajima #pagetop { bottom: 0!important; }
    
	footer{ padding: 30px 0 0; }
	footer h2{ width: 80%; }
	footer h2 img{ width: 100%; }
	footer h3{ float: none; font-size: 1.0em; }

	footer .appsBtn { float:none; min-width:auto; margin:20px 0; }
	footer .appsBtn img { max-width:100%; }

	.flink{ padding: 20px 0 0; }
	.flink > ul li{ float: left; margin-right: 20px; }
	.flink > ul > li:nth-child(3){ width: auto; margin-right: 0; }
	.flink > ul > li li{ width: 100%; float: 0; margin-right: 0; }
	.flink > ul > li li:nth-child(2), .flink > ul > li li:nth-child(6){ width: auto; margin-right: 0; }


	.pc_none{ display: block; }
}

@media print{
	header, footer{ display: none; }
	#wrapper{ width: 100%; }
	.management.flex{ display: block; overflow: hidden;}
	.management.flex li{ float: left; min-height: 550px;}

 }