@charset "utf-8";

/* Reset */
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 {

		margin: 0;	padding: 0;	border: 0;	font: inherit;	vertical-align: baseline;}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}

img{ margin: 0; padding: 0; vertical-align: bottom;}

.bgCol-Y { background:#FFF509; color: #e30203}

.bgCol-B { background:#d1effb;}

.bgCol-B .wrap { background: url("../img/tireBg.png") no-repeat right bottom;}

.bgCol-R {background:#e30203; color:#fff}
.bgCol-R td {color:#fff!important}
.bgCol-R1 {background: url("../img/sougaku.png") no-repeat left top #e30203; color: #fff}

.bgCol-NB { background:#122132; padding: 15px;}

.bgCol-g { background:#e6e6e6; color: #000;}

.bgCol-g2 {background: #f5f5f5; overflow: auto;}

.bgCol-g3 {background: #dfdfdf; overflow: auto;}

.bgCol-g4 {background: #50423e; overflow: auto; color: #fff}

.bgGr {background: #f7b5cd url("img/tireCBg.gif") repeat-y; overflow: auto; padding: 20px 0}

.bgCol-Bl { background:#000;}
.bgCol-B2 {background: #009cff url("../img/bgR2.jpg") center center no-repeat;background-size:cover; padding: 15px}
.bgCol-B2 .img100 {width: auto;}

.bgCol-Blue {background:#e6f6ff;}

.bgCol-Bl2 {background:#8acff3;}

.carItem {background:#fff; border: solid 4px #009de2; border-radius: 20px; overflow: auto;}

.carItem h3 {text-align: center;background:#009de2; padding: 0 20px;}

.bgCol-P {background: #ffdede;}

.boxL{ float:left; width:49%; margin:0 1% 0 0;}

.boxR{ float:right; width:50%; margin:0;}

.kadoR { border-radius: 8px;        /* CSS3草案 */  

    -webkit-border-radius: 8px; /* Safari,Google Chrome用 */  

    -moz-border-radius: 8px;   /* Firefox用 */  }

a img{background:none!important;}

a:hover img{

opacity:0.8;

filter:alpha(opacity=80);

-ms-filter: "alpha( opacity=80 )";

background:none!important;

}

.Pc-none,.Pc-none2{ display: none;}

.offMb{ display: inherit;}

.pc-line { border-left:1px solid #fff; border-right:1px solid #fff}



/*font*/

h1,h5 {font-size:24px; font-weight:bold; margin-bottom: 20px; color: #000;padding:3px 0 0 10px;}

h2 {margin-bottom: 20px; font-size:20px; padding:10px 10px 8px 20px;background: url("../img/hBG-2.jpg") repeat bottom left; color: #fff;} 

h3 {clear:both; margin-bottom: 20px;font-weight:bold; line-height: 1.2em;font-size: 20px; position: relative; background: url("../img/h3.gif") no-repeat bottom left;padding-bottom:10px;}

h3 span.f16 {display:block; position: absolute;top: 0px}

h3 span.f16-2 {display:block; position: relative;font-size: 16px;}

h4 {font-size: 18px;color: #fff;margin: 0 0 20px; background: #c51112;font-weight:bold; padding: 3px 3px 3px 10px; }

h4.yoyaku {background:none; text-align: center;border-bottom: solid 1px #ccc;border-top:solid 1px #ccc; display: inline-block;padding: 10px 40px;line-height: 1.2em;font-size: 20px; color:#000;}

h5 {border-left: solid 6px #1d2088; }

strong { font-weight:bold;} 

.f-red {color:#eb0912;}

.f-wh {color:#fff;}

.f-gr {color:#acacac;}

.f12 { font-size:12px; line-height:1.3em;}

.f14 { font-size:14px; line-height:1.4em;}

.f16 { font-size:16px; line-height:1.4em;}

.f18 { font-size:18px; line-height:1.5em;}

.f20 { font-size:20px; line-height:1.6em;}

.f22 { font-size:22px; line-height:1.6em;}

.f30 { font-size:30px; line-height:1em;}

.texCenter { text-align: center}

.texRight { text-align: right}



/*space*/

.clearfix { clear:both;}

.mbL, .mbL2 {margin-bottom:40px;}

.mbS {margin-bottom:10px;}

.mbM {margin-bottom:25px;}

.mlL {margin-left: 50px;}

.pdL {padding:50px 0;}

.linkSpace { position: relative; top: -50px; display: block;}



/*base*/

body {background: #fff;text-align: center;font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; font-size:16px; line-height:1.4em;}

.wrap {	margin: 0px auto;padding: 0px; text-align:left; clear: both;width:1020px;}

	

/*header*/

header {clear: both; text-align: left; min-height: 80px; background:rgba(255,255,255,100); }

#logo {float: left;padding:10px 0;}

#logo img.logo {margin:0 10px 0;}

#topBt {float: right;padding: 0;}

.yoyakuBt { display: table-cell; background: #ea3214;height: 80px;vertical-align: middle;}

.telBt {display: table-cell; background: #e9e9e9;height: 80px;vertical-align: middle;}



/*menu*/

#sidebar-nav { clear: both; background:#f8f8f8; width: 100%;height:40px;}

#sidebar-nav ul {width: 900px; margin: 0 auto; text-align: center; padding: 10px 0 0}

#sidebar-nav li { list-style: none;float: left; font-size: 12px;border-right: 1px solid #404040;display: table-cell;width:14%;}

#sidebar-nav li:last-child { border-right: none;}

#sidebar-nav a { text-decoration: none; padding: 5px;color:#404040;}



/*contents*/

#mainImg { background:url("../img/bgSummer.jpg") center bottom repeat-x #fff;margin-top:-40px; width: 100%;background-size: cover;}

#mainImg img {position: relative;top:0px;width: 100%;margin-bottom: 10px;}

.box20 { width:20%; float: left; padding: 0 1%; margin-bottom: 15px;}

_::-webkit-full-page-media, _:future, :root .box20 　{width:18%;}

.box25 { width:25%; float: left; padding: 0 1%; margin-bottom: 15px;}

_::-webkit-full-page-media, _:future, :root .box25 　{width:23%;}

.box3 { width:33%; float: left; padding: 0 1%; margin-bottom: 15px;}

_::-webkit-full-page-media, _:future, :root .box3 　{width:31%;}

.box40 { float: left; width: 38%; text-align: left;}

.box50 { float: left; width:50%; padding: 0 1%;}

.box60 { float: left; width:62%;}

.tel { font-size:20px; font-weight: bold; background: url("../img/tel.png") no-repeat left center; padding-left: 30px;}

.tel a {color:#333; text-decoration: none;}

.tel a:hover {color:#e54525; text-decoration: underline;}

.map {background: url("../img/map.png") no-repeat left 1px; padding-left:20px; margin-bottom: 3px;}

.clock {background: url("../img/clock.png") no-repeat left 2px; padding-left:20px;}

.pdL { padding: 40px 0;}

table td { padding: 3px 5px; }

table.noLine th, td { padding: 0; }

td.line {border-bottom: 1px solid #c9c9c9;}

td img {vertical-align: top;}

td.bgCol-P3 {height:70px;}

ul { padding:0 0 0 20px; margin:0 0 20px;}

ul.liA {padding:0;}

ul.liA li{background: url("../img/li-icon.png") no-repeat left 5px; list-style: none;padding-left:20px;}

ol {padding-left:20px;}

ol li {margin-bottom:3px;}

strong.line {background: #fff600;}

p { margin-bottom:15px;}

a {color:#cc2e2f;text-decoration: underline;}

a:hover {color:#cc2e2f;text-decoration: underline;}

a.linkBt {display:block; padding: 10px; background: #3280fe url("../img/btBg.jpg"); color: #fff; font-size:20px; line-height: 45px;}

a.linkBt:hover {background: #3280fe url("../img/btBg-r.jpg"); }

hr {clear: both; padding: 0 0 20px; margin-top: 20px;}

.itemA { border: 1px solid #e6e6e6;padding: 0;margin: 0 0.5% 1%;width: 24%;}
.itemB { border: 1px solid #e6e6e6;padding: 0;margin: 0 0.5% 1%;width: 32%;}
.itemC { border: 1px solid #e6e6e6;padding: 0;margin: 0 0.5% 1%;width: 19%;}
.itemA p, .itemB p, .itemC p{ padding:5px; margin-bottom: 0; }
.itemA.mbL, .itemB.mbL, .itemC.mbL {margin-bottom:40px;}


/*nav*/

#global-nav ul { padding-left:0px;} 

#global-nav a {
	color: #000;
	text-decoration: none;
	display: block;
	padding:0 25px;width: 100%;
}

#global-nav a:hover {color: rgba(229,51,2,1.00)}



/*pagenav*/

#pagenav {padding:20px 0 0 0}
#pagenav .wrap {background: #eeeeee; height: 60px;}
#pagenav a {color: #ea3214; display:inline-block; width: 100%; text-align: center; font-size: 14px;text-decoration: none; height: 60px;line-height: 60px;}
#pagenav a:hover { color:#fff;background: #ea3214;}
#pagenav .box25 { width:25%; float: left; padding: 0;}


img.a100 {width:100%;}


/*coupon*/

.coupon {background: url("img/couponBg.png") top repeat-x #fcfaee; border-radius: 20px; text-align: center; padding:50px 20px 20px;}
#couponPage {padding: 30px; width:800px; text-align: center;margin: 0 auto;}
#couponPage ul li {list-style: none; width: 50%; float: left;}

/*couponBox*/
.couponBox { background: url("../img/couponBg.jpg") no-repeat top center; text-align: center;width:370px; padding-top: 20px;height: 260px; position: relative; float: left;margin: 0 1%;}
.couponBox h2 {background: none;margin-bottom: 0px;color:#492011;font-size: 22px ; font-weight: bold}
.couponBox h3 {background: none;margin-bottom: 0px;color:#e60012;font-size: 30px ; padding-bottom: 0}
.couponBox h3 .fontL {font-size: 40px;}
.couponBox h3 .fontS {font-size: 14px;color:#492011}
.couponBox p {padding: 5px 30px; }
.couponBox p.bgBr {color:#fff; background:#492011; font-size: 14px; padding: 3px; width:85%;margin:0 auto; border-radius:10px;}
.couponBox p.fontS {font-size: 12px; text-align: left; line-height: 1.4em}
.couponBox p.day {position: absolute; bottom:18px;padding: 0; width: 100%} 

@media only screen and (max-width: 912px) {
#couponPage {padding: 30px 1%; width:98%;}
}
@media only screen and (max-width: 480px) {
#couponPage img {width: 100%;}
#couponPage ul li {list-style: none; width: 96%; float: inherit;}
.couponBox { float: inherit; margin:0 auto;}
}

/*shoplist*/
#shoplist div.box50 {padding: 20px!important;}

/*pagetop*/

.pagetop { display: none; position: fixed; bottom: 20px; right: 10px;}

.pagetop a {display: block;text-align: center; text-decoration: none; padding: 0px; border:none;}

.pagetop a:hover {display: block;text-align: center;text-decoration: none;padding:0px;}



/*footer*/

footer{	color: #6c6c6c;text-align: center;padding: 0;clear: both; margin: 0;font-size: 12px; border-top:1px solid #ccc; background:#fff ;min-height: 60px; padding: 20px 0 0}

footer a {color: #6c6c6c; text-decoration:underline;}

footer a:hover {color: #e26464;	text-decoration: underline;}

footer ul {	list-style: none;padding:0px; margin: 0 auto;}

footer li {	}

#copy {	font: Arial, Helvetica, sans-serif;clear: both;padding: 30px 0; background: url("../img/ftLine.png") no-repeat top center;}



@media only screen and (max-width:960px) {

.wrapTop, .wrap {width:100%;}

footer .wrapTop, .wrap {padding-left:10px; padding-right: 10px;}

#sidebar-nav li {float: inherit;border-right:none;display: inline-block;width:100%;}

}



@media only screen and (max-width: 960px) {

	/*menu*/

	.navbar {

position: fixed;

top: 0;

left: auto;

width: 100%;

margin-bottom: 0;v

padding: 0 !important;

border-radius: 0;

z-index: 1000;

min-height: 30px;

background: rgba(255,255,255,0.88);

transition :all 0.2s ease-in-out 0s;

}



.sticky {

padding: 0.25em 0;

background: rgba(255,255,255,0.98);

}

#sidebar-nav {

	display: inherit;

	font-size: 14px;

	padding-top: 70px;

	width: 130px;

	height: 100%;

	position: fixed;

	background: #f8f8f8;

	text-align: center;

}



#global-nav ul {
	list-style: none;
	margin-left: 0; padding-left: 0; width: 100%;
}

#global-nav > ul > li {
	position: relative; display: inherit; 
}



#global-nav a {
	color: #000;
	text-decoration: none;
	display: block;
	padding: 8px 0;width: 100%;
	-moz-transition: background-color .3s linear;
	-webkit-transition: background-color .3s linear;
	transition: background-color .3s linear;line-height: inherit;
}

#global-nav .sub-menu.is-active > a,

#global-nav a:hover {
	color: #fff;
	background: #ea3214;
}



#global-nav .sub-menu-nav a,
#global-nav .sub-menu:hover .sub-menu-nav {
	/*width: 230px;*/
}

/* nav-toggle */

#nav-toggle {

	display: none;

	position: fixed;top: 33px;

	right: 15px;

	height: 32px;

	/*position: relative; float: right;height: 32px;top: 8px;left: 15px;*/	

}

#nav-toggle > div {
	position: relative;
	width: 32px;
}

#nav-toggle span {
	width: 100%;
	height: 4px;
	left: 0;
	display: block;
	background: #545454;
	position: absolute;
	-webkit-transition: .35s ease-in-out;
	-moz-transition: .35s ease-in-out;
	transition: .35s ease-in-out;
}

#nav-toggle span:nth-child(1) {	top: 0;}
#nav-toggle span:nth-child(2) {	top: 11px;}
#nav-toggle span:nth-child(3) {	top: 22px;}

#overlay {
	display: none;
	position: fixed;
	background: rgba(0,0,0,.6);
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}

#main-in {padding-left: 0;}

	#global-head {

		width: 100%;

		padding: 10px;

		background: rgba(255,255,255,.8);

		display: -webkit-flex;

		display: flex;

	}

	#sidebar-nav {

		/*display: none;*/

		position: fixed;

		right: -300px;

		top: 0;

		height: 100%;

		width: 300px;

		color: #333;

		background: #f8f8f8;

		-webkit-transition: .35s ease-in-out;

		transition: .35s ease-in-out;

	}



/*  */

	#global-nav .sub-menu-head:after,

	#global-nav .sub-menu-nav {/*display: none;*/}

	#nav-toggle {display: block;}



/* nav open */

	.open {overflow: hidden;}

	.open #overlay {display: block;}

	.open #sidebar-nav  {

		-webkit-transform: translate3d(-300px,0,0);

		transform: translate3d(-300px,0,0);

	}



/* #nav-toggle close */

	.open #nav-toggle span:nth-child(1) {

		top: 11px;

		-webkit-transform: rotate(45deg);

		-moz-transform: rotate(45deg);

		transform: rotate(45deg);

	}

	.open #nav-toggle span:nth-child(2) {

		width: 0;

		left: 50%;}

	.open #nav-toggle span:nth-child(3) {

		top: 11px;

		-webkit-transform: rotate(-45deg);

		-moz-transform: rotate(-45deg);

		transform: rotate(-45deg);

	}



	/* z-index */

	#overlay {z-index: 200;}

	#sidebar-nav {z-index: 300;}

	#nav-toggle {z-index: 400;}

	



#topBt {/*display: none;*/ }

#topBt {float:right; padding-right: 50px;}

.yoyakuBt { display: table-cell; background: #ea3214;height: 80px;vertical-align: middle;}

.telBt {display: table-cell; background: #e9e9e9;height: 80px;vertical-align: middle;}



.wrap {margin: 0px auto;text-align:left;}

.wrap2 {float:none; width:100%; margin:0%;}



#mainImg img {margin: 25px 0 0} 

#close {display:inherit;}

.box40, .box60 { float:none; width:100%; margin:0%;}

.box40 {margin-bottom: 15px;}

#mainImg {padding-top:100px; overflow: auto;}

#pagenav .box25 { width:25%;}

}



@media only screen and (max-width: 480px) {

	.box25, .box20 { width:50%; float: left; padding: 0 1%;}

    .box3 { width:100%; float: left; padding: 0 1%; margin-bottom: 15px;}

	.box50 { float: inherit; width:98%; padding: 0 1%;}

    .itemA, .itemB, .itemC { border: 1px solid #e6e6e6;padding: 0;margin: 0 0.5% 1%;width: 49%;}

	.wrap, .wrap2 {margin: 0 2%; width: 96%;}

	.wrap .wrap2 {width:100% !important; margin: 0; padding: 0;}

	header {height: 50px;margin:0; padding: 0;}

	header .wrap {margin:0; padding: 0; }

.Pc-none{ display: inherit;}

.offMb{ display: none;}

	/*.navbar {min-height: 55px;}*/

	#nav-toggle {top: 15px;}

    header img {width:100%;}

    #logo {width: 90px;}

    #topBt {float:right; padding-right: 40px; width:60%}

.yoyakuBt { background: #ea3214;height: 50px;vertical-align: middle;}

.telBt {background: #e9e9e9;height: 50px;vertical-align: middle;}

    

    .bgCol-B2 {background: #009cff url("../img/bgR2.jpg") center center no-repeat;}
    .bgCol-B2 .img100 {width: auto;}
	
	
	#mainImg {padding-top:50px; overflow: auto;}

	.del {display:none;}

	.tel {font-size:16px}

	.pdL {padding:20px 0;}

	.boxL, .boxR { width: 100%;margin-bottom: 15px; float: inherit;}

	img.img100 { width:	100%;}

	.mbL2, .mbM2 {margin-bottom:20px;}

.pstR { position: inherit; height: 95px; z-index: 800;}

	.linkSpace {top: -50px;}

	.bgCol-Br {padding: 10px;}

	.bgCol-Br .boxR {margin:0}

	.f30 { font-size:20px; line-height:1em;}

    .bgCol-Y.f18 { font-size:16px; line-height:1em;}

	.f12 { font-size:10px; line-height:1.2em;}

	/*h3 span.f16 {display:block; position: relative;}*/

	

	td.bgCol-P3 {height:45px;}

  .bgCol-R1 {background: url("../img/sougakuS.png") no-repeat left top #e30203; color: #fff}

    

/*pagenav*/

#pagenav {padding:15px 0 0}

#pagenav .wrap {background: #fff; height:120px;}

#pagenav a {color: #ea3214; height: 50px;line-height:1.2em; padding: 10px; border-bottom: 2px solid #ea3214}

#pagenav .box25 {width:48%; margin-bottom: 0;padding: 0 1%;}  

#pagenav a.linkA {line-height:50px;padding: 0px;}

    

}


@media only screen and (max-width: 480px) {

	#mainImg {margin-top:-30px;}

    .bgCol-P .a100 {width: auto;}

    .pc-line { border-left:none; border-right:none; border-top:1px solid #fff; border-bottom:1px solid #fff}

	.w100 {width:100%;}

}

@media only screen and (max-width: 380px) {

	#mainImg {margin-top:-30px;}

	.Pc-none2 {display: inherit;}

	td.lineHs {line-height: 0.7em; padding: 8px 0 5px;}

}

@media only screen and (max-width: 320px) {

#mainImg {margin-top:-30px;}

	.tel {font-size:14px}

	.linkBt {font-size: 18px !important;}

	h5 {margin-left:0;}

}