@charset "UTF-8";
/* CSS Document */


body { font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif"; }
header,
nav,
.trunk { width: 800px; margin: 0 auto; overflow: hidden;}
.trunk { padding:20px 0;}
footer { width:800px;margin:0 auto; }

@media (max-width: 500px) {
	header,
	nav { width: 100%; margin: 0 auto; }
	.trunk { width: 96%; margin: 0 2%; padding:50px 0; }
	footer { width: 100%; margin: 0 0%; }
	}



/* ------------------- */
/* ------------------- */
/* ----------------------------------------------------------------- p*/
p {text-align:center;}


/* ----------------------------------------------------------------- header*/
header { }

.trunk { /* box-shadow */ box-shadow: 0px 0px 6px 3px rgba(5,5,5,0.18); }
header { display: flex; }
header .logo { padding: 10px 30px 10px 60px; }
header .copy { padding: 40px 30px 40px 50px; text-align: center; }

@media (max-width: 500px) {
header { display: block; }
.trunk { /* box-shadow */ box-shadow: none; text-align: center;}
header .logo { text-align: center; padding: 10px 0px; } 
header .copy { text-align: center; padding: 10px 0px; }
}

/* ----------------------------------------------------------------- footer*/
footer img { width:100%; }

@media (max-width: 500px) {
	footer { overflow: hidden;position: relative;width:100%;height:100px;}
	footer img { width:200%; display: block;position: absolute; top:0;left:-100%;}
	}


/* ----------------------------------------------------------------- / header*/
/* ------------------- */
/* ------------------- */
/* ----------------------------------------------------------------- nav*/
nav { position: relative; top: 0; left: 0; }
.switch { display: none;  height: 90px;}
ul.gnavUL { display: flex; }
li[class^="gnavLI"] { list-style-type: none; }
li.gnavLI-1 { }
li.gnavLI-2 { }
li.gnavLI-3 { }
li.gnavLI-4 { }
li[class^="gnavLI"] a { background-repeat: no-repeat; width: 200px; height: 30px; display: block; text-indent: 100%; white-space: nowrap; overflow: hidden; }
li.gnavLI-1 a { background-image: url(top2_img/bo_1.gif) }
li.gnavLI-2 a { background-image: url(top2_img/bo_5.gif) }
li.gnavLI-3 a { background-image: url(top2_img/bo_3.gif) }
li.gnavLI-4 a { background-image: url(top2_img/bo_4.gif) }
li[class^="gnavLI"] a:hover { }
li.gnavLI-1 a:hover { background-image: url(top2_img/bo_1_o.gif) }
li.gnavLI-2 a:hover { background-image: url(top2_img/bo_5_o.gif) }
li.gnavLI-3 a:hover { background-image: url(top2_img/bo_3_o.gif) }
li.gnavLI-4 a:hover { background-image: url(top2_img/bo_4_o.gif) }
body.toppage li.gnavLI-1 a { background-image: url(top2_img/bo_1_o.gif) }
body.menu li.gnavLI-3 a { background-image: url(top2_img/bo_3_o.gif) }

@media (max-width: 500px) {
.switch { display: block; position: absolute; top:18px; right:18px;}
.switch a { display: block; background: url(sp/script/hiddenMenu/btnMenu.png) no-repeat; background-size: contain; width: 60px; height: 60px; margin: 0 0 0 0; }
nav { position: absolute; top: 0; left: 0; padding: 0 0 0 0; }
ul.gnavUL { display: block; background: #fff; padding: 100px 0 0 0; }
ul.gnavUL { display: none; }
li[class^="gnavLI"] a { background-repeat: no-repeat; width: 100%; height: auto; display: block; text-indent: 0%; white-space: nowrap; overflow: hidden; padding: 20px; border: solid 1px #f00; color: #f00; text-align: center; background-color: #fff; }
li.gnavLI-1 a { background-image: none; }
li.gnavLI-2 a { background-image: none; }
li.gnavLI-3 a { background-image: none; }
li.gnavLI-4 a { background-image: none; }
li.gnavLI-1 a:hover { background-image: none; }
li.gnavLI-2 a:hover { background-image: none; }
li.gnavLI-3 a:hover { background-image: none; }
li.gnavLI-4 a:hover { background-image: none; }
body.toppage li.gnavLI-1 a { background-image: none; }
body.menu li.gnavLI-3 a { background-image: none; }
}

@media (min-width: 501px) {
ul.gnavUL { display: flex;}
}
/* ----------------------------------------------------------------- / nav*/
/* ------------------- */
/* ------------------- */
/* ----------------------------------------------------------------- table.type01 */
/* ----------------------------------------------------------------- トップページの店舗情報など */
table.type01{}
table.type01 th ,
table.type01 td{}
table.type01 th{}
table.type01 td{}

table.type01{}
table.type01 th ,
table.type01 td{text-align: left;vertical-align: top; font-weight: normal;padding:3px 3px 3px 0;}
table.type01 th{padding-right:20px;}
table.type01 th:before{content:"■";color:#f00;}
table.type01 td{}


/* ------------------- */
/* ------------------- */
/* ----------------------------------------------------------------- .flex */

.flex{
	display:flex;
	justify-content:space-around;
	align-items:center;
	padding:0 5%;
}
.flex > div {margin:0;flex-grow: 1;}
@media (max-width: 500px) {
.flex{
	display:block;
}
.flex > div {margin:0px 0 40px 0; text-align: center;}
}


/* ------------------- */
/* ------------------- */
/* ----------------------------------------------------------------- h2 */
/* ----------------------------------------------------------------- 文中の黄緑の見出し */
h2{text-align:center; margin:30px auto 30px auto;}


/* ------------------- */
/* ------------------- */
/* ----------------------------------------------------------------- h3 */
/* ----------------------------------------------------------------- 着付けのところの赤字 */
h3{text-align:center; margin:30px auto 30px auto; font-size:16px; font-wight:bold; color:#f00;}

/* ------------------- */
/* ------------------- */
/* ----------------------------------------------------------------- table */
table td ,
table th {text-align: left}

@media (max-width: 500px) {
table td ,
table th {text-align: left}
}

/* ------------------- */
/* ------------------- */
/* ----------------------------------------------------------------- btn & btnplace */
.btnplace {
	
	margin:40px auto;
	text-align: center;
}
a.btn{
	display:inline-block;
	background: #c00;
	padding:15px 30px;
	font-size:14px;
	line-height:16px;
	color:#fff;
	text-decoration: none;
	border-radius: 6px;transition: all 300ms 0s ease;
}
a.btn:hover{
	
	background: #f00;
	position: relative;
	top:2px;
}
@media (max-width: 500px) {
	a.btn{
	padding:15px 0;
	width:80%;}
}


/* ------------------- */
/* ------------------- */
/* ----------------------------------------------------------------- #toppage_outline */
#toppage_outline_data_LINE1{font-size:14px; line-height:18px; color:#f00;}
#toppage_outline_data_LINE2{font-size:16px; line-height:22px; color:#f00; font-weight: bold;margin:0 0 10px 0;}
#toppage_outline_data_LINE1 ,
#toppage_outline_data_LINE2{text-align: left;}

