@charset "utf-8";
/* CSS Document */
@import url("normalize.css");
/*幅が狭い時に読み込まれるCSS*/
@media screen and (max-width: 1000px){

/*ハンバーガーメニューを再表示する*/
#nav-wrapper {
display: block;
}
/*PC版のナビゲーションを非表示にする*/
#nav_nav {
display: none;
}
.sp-nav a {
  color: #000000; 
}
.hamburger {
  position: absolute;
  right: 20px;
  top: 20px;
  width: 50px;
  height: 40px;
  cursor: pointer;
  z-index: 300;
}
.hamburger__line {
  position: absolute;
  width: 50px;
  height: 3px;
  right: 0;
  background-color: #000;
  transition: all 0.5s;
}

.hamburger__line--1 {
  top: 1px;
}

.hamburger__line--2 {
  top: 18px;
}

.hamburger__line--3 {
  top: 36px;
}

/*ハンバーガーがクリックされたら*/
.open .hamburger__line--1 {
  transform: rotate(-45deg);
  top: 11px;
}

.open .hamburger__line--2 {
  opacity: 0;
}

.open .hamburger__line--3 {
  transform: rotate(45deg);
  top: 11px;
}

/* 
sp-nav(ナビ)
=================================== */
.sp-nav {
  position: fixed;
  top: -100%; /*ハンバーガーがクリックされる前はWindow上部に隠す*/
  right: 0;
  width: 25%;/* 出てくるスライドメニューの幅 */
  height: 55vh;
  background-color: #fff;
  transition: all 0.5s;
  z-index: 200;
  overflow-y: auto;
}

/*ハンバーガーがクリックされたら上からスライド*/
.open .sp-nav {
  top: 0;
}
/*ハンバーガーメニューのナビゲーションのレイアウト*/
.sp-nav ul {
  display: flex;
  flex-direction: column;/*縦並びにレイアウト*/
}
.sp-nav ul li a {
  height: 20px;
  text-decoration: none;
  padding-top: 60px;
  text-indent: 15px;
}
/* 
black-bg(ハンバーガーメニュー解除用bg)
=================================== */
.black-bg {
  position: fixed;
  left: 0;
  top: 0;
  width: 100vw;
  height: 100vh;
  z-index: 5;
  background-color: #000;
  opacity: 0;
  visibility: hidden;
  transition: all 0.5s;
  cursor: pointer;
}

/*ハンバーガーメニューが開いたら表示*/
.open .black-bg {
  opacity: 0.3;
  visibility: visible;
}

header, nav, #contents, footer {
  max-width: 1000px;
}
h1 {
margin-top: 50px;
margin-bottom: 10px;
}
#midasi p img {
  width: 376px;
  height: 200px;
  margin-top: 30px;
}
#main {
display: block;
margin-top: 100px;
max-width: 376px;
}
#main img {
  width: 100%;
  height: auto;
}
#main ul li {
  width: 100%;
  margin: 30px 0 0 -20px;
}
#main ul h2 li {
  font-size: 0.8em;
}
#sub {
display: block;
margin-top: 30px;
max-width: 376px;
}
#sub img {
  width: 100%;
  height: auto;
}
#sub ul li {
  width: 100%;
  margin: 30px 0 0 -20px;
}
#sub ul h2 li {
  font-size: 0.8em;
  }
#panpan {
  margin-top: 30px;
  margin-bottom: 30px;
  max-width: 376px;
  width: 100%;
  font-size: 0.8em;
  }
.news2 {
  padding: 5px;
}
footer {
  margin-top: 30px;
}
footer div ul {
  max-width: 1000px;
  padding: 0;
}
footer div ul li {
margin: 0 auto 0 auto;
}
/*↑　ここまでトップページ　↑*/
/*↓　ここまでコンセプトページ　↓*/

/*↑　ここまでコンセプトページ　↑*/
/*↓　ここまでメニューページ　↓*/
.menu {
  display: block;
  max-width: 1000px;
}
.menu figure {
max-width: 300px;
margin: 50px auto 0 auto;
}
.menu figure figcaption p {
margin-bottom: 10px;
}
/*↑　ここまでメニューページ　↑*/

/*↓　ここまでお問い合わせページ　↓*/
form {
  max-width: 1000px;
}
form p {
width: 100%;
max-width: 376px;
}
/*↑　ここまでお問い合わせページ　↑*/

/*↓　ここからアクセスページ　↓*/
#access_section {
  max-width: 1000px;
  width: 100%;
  margin: 50px auto 0 auto;
  text-align: center;
  display: block;
}
.access img {
  max-width: 300px;
  width: 100%;
  height: auto;
}
.access p {
  margin-top: 30px;
  text-indent: 0;
}
.access p:nth-of-type(2){
  text-indent: -75px;
  margin-top: 20px;
}
#section_zyouhou {
  max-width: 1000px;
  width: 100%;
  margin: 30px auto 0 auto;
  display: block;
  text-align: center;
}
.zyouhou {
 margin: 30px 0 0 0;
 padding: 20px 0 0 0;
}
.zyouhou:nth-of-type(2) { 
  border-top: 3px dotted #BF830B;
  border-left: none;
  max-width: 376px;
  width: 100%;
  margin: 0 auto 0 auto;
}
/*↑　ここまでアクセスページ　↑*/