/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
1.0 - Reset
2.0 - Typography
3.0 - Elements
4.0 - Navigation
	4.1 - Links
	4.2 - Menus
7.0 - Clearings
8.0 - Content
9.0 - grid
10.0 - General
11.0 - etc.
12.0 - Media Queries
--------------------------------------------------------------*/
/*--------------------------------------------------------------
1.0 - 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, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
 border:0;
 font-family:inherit;
 font-size:100%;
 font-style:inherit;
 font-weight:inherit;
 margin:0;
 outline:0;
 padding:0;
 vertical-align:baseline;
 -webkit-font-smoothing:antialiased;
 -moz-osx-font-smoothing:grayscale;
}
html {
 font-size:62.5%;
 scroll-behavior: smooth;
 -webkit-text-size-adjust:100%;
 -ms-text-size-adjust:100%;
}
*, *:before, *:after {
 -webkit-box-sizing:border-box;
 -moz-box-sizing:border-box;
 box-sizing:border-box;
}
body { background:#fff; }
article, aside, details, figcaption, figure, footer, header, main, nav, section { display:block; }
ol, ul { list-style:none; }
table { border-collapse:separate; border-spacing:0;}
caption, th, td { font-weight:normal; text-align:left;}
blockquote:before, blockquote:after, q:before, q:after { content:""; }
blockquote, q { quotes:"" ""; }
a { text-decoration:none; cursor: pointer;}
a:focus { outline:none; }
a:hover, a:active { outline:0; }
a:hover img { border:0; opacity:0.8; -webkit-transition:0.3s; transition:0.3s;}
img,video { display:block; width:100%; height:auto;}
figure { padding:0; margin:0 auto;}
.clear:before, .clear:after { content:''; display:table;}
.clear:after { clear:both; }
/*--------------------------------------------------------------
2.0 Typography
--------------------------------------------------------------*/
body {
 color:#333;
 font-size:14px;
 font-size:1.4rem;
 line-height:1.9;
 font-family:'游ゴシック', YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", 'メイリオ', Meiryo, Helvetica, Arial, sans-serif;
 text-decoration:none;
}
h1, h2, h3, h4, h5, h6 { font-weight:normal; }

/*--------------------------------------------------------------
3.0 Elements
--------------------------------------------------------------*/
figcaption { font-size:1.3rem; margin:0.5em auto;}
/*--------------------------------------------------------------
4.0 Navigation
--------------------------------------------------------------*/
/*--------------------------------------------------------------
4.1 Links
--------------------------------------------------------------*/
a { display:block; color:#333;}
.btn a {
 background-color:#006600;
 color:#FFF;
 font-size:1.2rem;
 display:inline-block;
 box-sizing:border-box;
 border:solid 1px #006600;
 padding:0 10px;
}
#osusume .btn a {line-height:32px;padding:0 10px 0 20px;}
.btn a:hover {
 background-color:#FFF;
 color:#006600;
 box-sizing:border-box;
 border:solid 1px #006600;
 cursor:pointer;
 -webkit-transition:0.3s;
 transition:0.3s;
}
#page_top {
 position:fixed;
 bottom:20px;
 right:0;
 font-size:1.2rem;
 line-height:1.5;
 text-align:center;
}
#page_top a {
 width:4em;
 height:auto;
 background:#cbd0bf;
 color:#006600;
 line-height:1.4;
 display:block;
 padding:0.3em 0.8em;
 box-sizing:border-box;
 border-bottom-left-radius:5px;
 border-top-left-radius:5px;
}
/*--------------------------------------------------------------
4.2 Menus
--------------------------------------------------------------*/
/*** menu ***/
.menu {
 float:right;
 color:#FFF;
 letter-spacing:2px;
 margin:0.7em auto 0;
}
.menu ul:before { content:url(../img/header_copy.svg); display:block;}
.menu ul:after { content:""; display:block; clear:both;}
.menu li { display:inline-block; margin:0 2rem 0 0;}
.menu li:last-child { margin-right:0; }
.menu li a {
 font-size:1em;
 padding:0.05em 0;
 border-radius:2px;
 position:relative;
 transition:.3s;
}
.menu li a::after {
 position:absolute;
 bottom:0;
 left:50%;
 content:'';
 width:0;
 height:1px;
 background-color:#006600;
 transition:.3s;
 -webkit-transform:translateX(-50%);
 transform:translateX(-50%);
}
.menu li a:hover::after { width:100%; }
/*--------------------------------------------------------------
7.0 Clearings
--------------------------------------------------------------*/
.container:after, .inner:after, #backNO .col_2:after {
 content:""; display:table; clear:both;}
/*--------------------------------------------------------------
8.0 Content
--------------------------------------------------------------*/
/* MAIN CONTAINER */
.container {
 max-width:960px;
 margin:0 auto;
 padding:0 15px;
}
.inner { max-width:860px; margin:0 auto;}
.shop_info {
 position:absolute;
 bottom:1em;
 left:1em;
 float:left;
 width:97.3%;
 font-size:1.3rem;
 z-index:2;
 color:#006600;
 background:#FFF;
 padding:1em;
 opacity:0.85;
}
.shop_info h2 {
 float:left;
 width: 12%;
 text-align:center;
 padding: 1% 3% 1% 2%;
}
.shop_info h3 { margin:0.5em auto 0; }
/*.shop_info div:last-of-type { float:left; display:block;}*/
.shop_info ul { line-height:1.7; display:block; overflow:hidden; }
.shop_info li { margin-right:0.8em; }
.shop_info li:last-child { margin-right:0; }
/* top > map */
.map__wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.map__body {
  text-align: left;
  background: url("../img/icon-parking.svg") left top 8px/25px no-repeat;
  padding-left: 40px;
}
.map__txt { margin-bottom: 1em;}
.map__hl { font-size: 1.2857em/*18*/; line-height: 1.5;}
.map__hl span { display: block; font-size: .777em;}
.map__photo{ width: 65.7%; max-width: 565px;}

section { margin:0 auto 6em; }
#info { padding:0 12.209302325581394%;}
/*#info h2:after { content:url(../img/icon-newyear.svg); display:inline-block; padding-left:1em;}*/
#info dt { letter-spacing:1px;}

#osusume h2, #cont_menu dt {
 font-size:1.6rem;
 display:block;
 margin-bottom:1em;
}
#osusume {
 float:left;
 width:100%;
 border:#cbd0bf 3px solid;
 box-sizing:border-box;
 padding:10% 12.209302325581394%;
 margin:0 auto;
}
#info h3,#osusume h3 { font-size:1.6rem; }

#osusume h2:before, #cont_menu dt:before, #cont_menu div h2:before {
 content:'';
 background:url(../img/link.svg) no-repeat left;
 padding-left:1.8em;
}
#osusume h2 span{
 font-size:1.3rem;
 letter-spacing:1px;
 border-bottom:solid 1px #006600;
 margin:0 0 0 1em;
}
#osusume .fa-lg { vertical-align:baseline;}
.osusume__item {
  clear: both !important;
  display: block;
  margin-bottom: 2em;
}
.osusume__item + .osusume__item {
  border-top:solid 1px #eee;
  padding-top: 3em;
  }
/* 2021 summer#osusume h3:before {
 content:"";
 display:inline-block;
 width:2em;
 height:2em;
 background:url(../img/osusume/icon-made_japan.svg) no-repeat;
 background-size:contain;
 margin-right:.5em;
}*/
#backNO section div:first-of-type {
 float:none;
 width:96.96969696969697%;
 border:none;
 padding:0;
 margin:0 auto;
}
#backNO section div div + div { margin-top: 30px;}
#backNO figure {
 float:left;
 width:46.875%;
 margin-right:3.75%;
 overflow:hidden;
}
#backNO section div p,#backNO h3 { overflow:auto; margin-bottom:0.5em; }
#backNO section p:first-of-type { margin-bottom:0.5em; line-height:1; letter-spacing:1px; color:#006600;}
#backNO .label {
 display:inline-block;
 width:9em;
 font-size:1.2rem;
 line-height:1;
 text-align:center;
 color:#FFF;
 background:#006600;
 padding: 3px 0;
 margin:0 1em .5em 0;
 border-radius:2px;
 vertical-align: middle;
}
#backNO section div.img-set {
  display: flex;
  justify-content: space-between;
  width: 100%;
  padding: 0 0;
  margin: 0 auto;
}
#backNO .img-set .img-set__item { width:46.585%; margin:1em 0 0;}
.img-set span {
  display:inline-block;
  color: #fff;
  font-size: .9em;
  background-color:#727171;
  line-height: 1.5;
  padding: 1px 10px;
  margin-bottom: 5px;}


#cont_menu dt span {
 font-size:1.2rem;
 letter-spacing:3px;
 font-weight:bold;
 color:#cbd0bf;
 margin-left:2em;
}
#osusume > div figure {
 float:left;
 width:46.585%;
 margin-right:3.7%;
 overflow:hidden;
}

#osusume h3 { margin-bottom:1em; }

#osusume .btn {
 clear: both;
 display:block;
 margin:0 auto;
 text-align:right;
}
#osusume p { overflow:auto; width:49.69%;}
#cont_menu div:last-of-type {
 background-image:url(../img/customer_title_bg.jpg);
 background-size:cover;
 text-align:center;
}
#cont_menu div a { display:block; }
#cont_menu div h2 {
 font-size:1.6rem;
 color:#FFF;
 margin:auto;
 padding:2em 0;
 text-align:center;
}
#page section, #title figure { width:70.96774193548387%; }
#page section { margin:0 auto 7.14em; }
#page section .col_2 div {
 float:left;
 display:block;
 width:47.72727272727273%;
 margin-bottom:2em;
 margin-left:4.545454545454546%;
}
#page section .col_2 div:nth-child(2n+1) { margin-left:0; }
#title { margin:0 auto 3em; }
#title h1, #customer #title h1 {
 font-size:2.1rem;
 text-align:center;
 padding:2.15em 0;
}
#title h1:before {
 content:url(../img/link.svg);
 display:inline;
 width:1.2em;
 height:1.2em;
 padding-right:1em;
}
#customer #title .inner {
 background-image:url(../img/customer_title_bg.jpg);
 background-size:cover;
 margin:1em auto 3em;
}
#customer #title h1 { color:#FFF; }
.price h3 {
 width:12em;
 text-align:center;
 color:#FFF;
 background:#006600;
 box-sizing:border-box;
 border-radius:3px;
 font-weight:bold;
}

#customer section { max-width:860px; }
#customer section div { float:left; width:70.93023255813954%;}/*610px*/
#customer section figure {
 float: left;
 width: 25.581395348837212%;
 margin-left: 3.488372093023256%;}/*220px-30px*/
#customer section h2 { font-size:2rem; }
#customer section h2 span { font-size:1.3rem; margin:0; border-bottom:none;}

/*--------------------------------------------------------------
9. Grid
--------------------------------------------------------------*/
[class*='col-'] {
 float:left;
 margin-left:2.7906976744186047%;
 margin-bottom:2.7906976744186047%;
}
.col-1-3:first-child { margin-left:0; }
.col-1-3 { width:31.3953488372093%; }
.clear { clear:both !important; }
/*--------------------------------------------------------------
10. General
--------------------------------------------------------------*/
body, html { height:100%; }

header {
 font-size:1em;
 letter-spacing:1px;
 margin:1em auto 0;
 border-bottom:solid 1px #e6e6e6;
 letter-spacing:1px;
 padding:1.7857em 0 1em;
}
header h1 {
 float:left;
 width:9.30232558139535%;
 height:5em;
}
header figure {
 float:left;
 display:inline-block;
 width:7.5%;
 max-width:60px;
 padding:1% 0 0 2%;}

.slider { z-index:0; }

article { text-align:left; text-align:justify;}
article h2, article h3, article p, section h2, section h3, section p { margin-bottom:1em; }
section p:first-of-type, article p:first-of-type { margin-bottom:2.5em; }
section h2, article h2 { font-size:2rem; }
section h3, article h3 { font-size:1.7rem; line-height:1.6; }

footer {
 background:#006600;
 padding:3em 0;
 color:#FFF;
 line-height:1.7;
}
footer#index_footer h1 {
 width:6.5em;
 padding:1em 0;
}
footer h1 {
 width:6.5em;
 font-size:1em;
 line-height:1;
 margin:0 0 1.5em;
}
.footer_sub {
 text-align:center;
 border-top:solid 1px #CCC;
 padding:3em 0 6em;
}
.footer_sub iframe {
 width:100%;
 height:400px;
 margin:20px auto 30px;
}
footer .inner div, footer .inner iframe { float:left;}
footer .inner div { width:40.69767441860465%; margin-left:0;}
footer .inner div p:first-of-type { margin-bottom:1em;}
footer .inner div span:last-of-type {font-size:.9em; line-height:1.7;}
footer .inner iframe {
 width:56.97674418604651%;
 min-height:250px;
 margin-left:2%;
}

/*--------------------------------------------------------------
11. etc.
--------------------------------------------------------------*/
.color { color:#006600; }
.center {text-align:center;}
.mb_2 { float:left; margin-bottom:2em;}

.boder_none { border-bottom:none;}
.copy {
 font-size:1.1rem;
 letter-spacing:0.2em;
 text-align:center;
 color:#006600;
 padding:0.5em;
}
.mb { margin-bottom:2em;}
.f-l { font-size:1.5rem;}
.lineR { text-align:right; margin-top:1em;}
.attention { font-size:1.3rem;}
.phoneNumber { display:inline;}
footer .phoneNumber,footer .phoneNumber a { color:#fff;font-size:17px;}
footer#index_footer .phoneNumber,footer#index_footer .phoneNumber a {font-size:17px;}
.shop_info .phoneNumber { color:#006600;}
/*--------------------------------------------------------------
12. Media Queries
--------------------------------------------------------------*/
@media print {
.shop_info li { display:inline;}
#page_top a {display:none;}
}
@media print, screen and (min-width:861px){
#info dt { float:left; width:8em; letter-spacing:1px;}
#info dd { margin-left:8em; margin-bottom:0.5em;}
.menubtn { display:none;}
}
@media only screen and (max-width:860px) {
body { font-size:13px; font-size:1.3rem;}
header .inner div { float:left; display:block; width:100%;}
.menu { display:none; margin:1em auto 0;}
.menubtn,
.menubtn span {
  display:inline-block;
  transition:all .4s;
  box-sizing:border-box;
}
.menubtn {
  position:absolute;
  top:18px;
  right:25px;
  width:40px;
  height:34px;
  background:none;
  border:solid 1px transparent;
  margin:1.7857em 0 1em;
}
.menubtn span {
  position:absolute;
  left:0;
  width:100%;
  height:4px;
  background-color:#006600;
  border-radius:4px;
}
.menubtn span:nth-of-type(1) { top:0;}
.menubtn span:nth-of-type(2) { top:14px;}
.menubtn span:nth-of-type(3) { bottom:0;}

.menubtn.active span:nth-of-type(1) {
  -webkit-transform:translateY(14px) rotate(-45deg);
  transform:translateY(14px) rotate(-45deg);
}
.menubtn.active span:nth-of-type(2) { opacity:0;}
.menubtn.active span:nth-of-type(3) {
  -webkit-transform:translateY(-14px) rotate(45deg);
  transform:translateY(-14px) rotate(45deg);
}

.menu ul { background:#e7eade/*cbd0bf*/; opacity:0.85; padding:1em 0;}
.menu li { line-height:2; width:43%; margin:0 10px; }
nav { width:100%; text-align:center; font-size:1em;}
#info dd { margin-bottom:0.5em;}

#title, #title figure { width:100%; margin:0 auto 2em;}
#page section { width:100%;/*margin:0 auto 3em;*/}
#title h1, #customer #title h1 {font-size:1.9rem;}
section h2, article h2, #customer section h2 { font-size:1.8rem;}
section h3, article h3 { font-size:1.6rem;}
}
@media only screen and (min-width:769px) {
#osusume h3 img { width: 46.585%;}
.shop_info li { display:inline-block; }
#cont_menu div:last-of-type { background-position:2%; }
}
@media only screen and (max-width: 767px) {
header { margin:1em auto 0; padding:0 0 1em;}
header .inner div { display:block; width:100%;}
header h1,header figure{ height:15%; }

.menubtn {
   position:absolute;
   width:30px;
   height:25px;
   top:18px;
   right:15px;
   margin:0 auto;
   }
   .menubtn span {
     position:absolute;
     left:0;
     width:100%;
     height:3px;
     background-color:#006600;
     border-radius:3px;
   }
   .menubtn span:nth-of-type(2) { top:10px;}
   .menubtn.active span:nth-of-type(1) {
     -webkit-transform:translateY(10px) rotate(-45deg);
     transform:translateY(10px) rotate(-45deg);
   }
   .menubtn.active span:nth-of-type(2) { opacity:0;}
   .menubtn.active span:nth-of-type(3) {
     -webkit-transform:translateY(-10px) rotate(45deg);
     transform:translateY(-10px) rotate(45deg);
   }
.shop_info {
 position:static;
 bottom:0;
 left:0;
 width:100%;
 color:#006600;
 margin:0 auto 5em;
}
.shop_info li {margin-right: 0;}
/* top > map */
.map__wrap { flex-direction: column;}
.map__body,.map__photo { width: 100%;}
.map__body {
  text-align: center;
  background: url("../img/icon-parking.svg") top center/25px no-repeat;
  padding-left: 0;
  padding-top: 20px;
  margin-bottom: 20px;
  }
 .map__body br{ display: none;}

#osusume h3 img { width: 100%; padding: 1em 0;}

[class*='col-'],
.shop_info div:first-of-type,
#backNO .col_2 div:first-of-type,
#backNO .col_2 div:last-of-type,
#backNO figure, #backNO p,
#osusume h2,#osusume > div figure,#osusume p,
#cont_menu dt,#cont_menu div:last-of-type,
footer .inner div, footer .inner iframe { clear:both; width:100%;}
  #osusume > div figure { margin: 0;}
  .img-set { margin-top: 1em;}

[class*='col-'] { margin-left:0; margin-bottom:20px;}
#backNO figure { margin:0 0 1em 0;}
#backNO .col_2 div:first-of-type,
#backNO .col_2 div:last-of-type { margin:0 auto;}
#backNO section div:first-of-type { padding:0 12px;}

footer .inner div { margin-bottom:1em;}
footer .inner iframe { margin-left:0; margin-bottom:1em;}

#osusume figure,#cont_menu h2 { margin-bottom:0.5em;}
.shop_info h2 { float:none; width: 4em; text-align:center; margin:1em auto; padding:0;}
.shop_info li { display:block;}

#cont_menu div:last-of-type {
 background-image:url(../img/customer_title_bg.jpg);
 background-size:cover;
 text-align:center;
}
#customer #title .inner { background-position:5%; }
.phoneNumber { font-size:1.5rem;}
}
@media only screen and (max-width : 480px){
 header h1 { width:3.5em;}
 header figure { width:3.2em; padding:0 0 0 1em;}
 #info dt,#info dd { clear:both;}
 #info dd { margin-left:0; margin-bottom:0.5em;}
 #page section .col_2 div { float:none; margin-left:0; padding:0 25px;}
 #page section .col_2 div,#customer section div { clear:both; width:100%;}
 #customer section figure { clear:both; float:none; width:50%; margin:1em auto 0;}
 #osusume h2 span {font-size:1.2rem; margin-left:0.5em;}
  #osusume .img-set { flex-direction: column;}
  #osusume .img-set figure { width: 100%;}
}