@charset "UTF-8";


/* 共通スタイル */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, button, p, blockquote {
  margin: 0;
  padding: 0; }

html, body {
  font-family: "MS PGothic", "Osaka", Arial, sans-serif;
  line-height: 1.22;
  font-size: 20px;
  width: 100%;
  height: 100%;
  word-break: break-all;
  word-wrap: break-word;
  -webkit-text-size-adjust: 100%;
  overflow-x: hidden; }

    header .logo img {
      max-width: 12rem;
      min-width: 9rem; }

h1{
  color: #553D27;
  font-family: 'Zen Maru Gothic', sans-serif;
}

a{
  text-decoration: none;
  color: #FFF;
}

ul{
  list-style: none;
  padding: 0;
  margin: 0;
}

p {
  margin-bottom: 1rem; }

/* ヘッダー */
header{
  height: 3.8rem;
  background-color: #FFFFFF;
  z-index: 2;
  width: 100%;
}

.header__inner{
    margin: 0 auto;
    padding: 0 2rem;
    height: 3.8rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.flex {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex; }

  header .logo img{
  width: 12vw;
}


/* ハンバーガーメニュー */
.hamburger-menu{
  display: flex;
  align-items: center;
  width: 2rem;
  height: 2rem;
  cursor: pointer;
  z-index: 10;
}

.hamburger-menu__line{
  display: block;
  width: 100%;
  height: 4px;
  border-radius: 4px;
  background-color: #553D27;
  position: relative;
  transition: all 0.4s;
}

.hamburger-menu__line::before,
.hamburger-menu__line::after{
  content: '';
  display: block;
  width: 100%;
  height: 4px;
  border-radius: 4px;
  background-color: #553D27;
  position: absolute;
  transition: all 0.4s;
}

.hamburger-menu__line::before{
  transform: translateY(-12px);
}
.hamburger-menu__line::after{
  transform: translateY(12px);
}

.hamburger-menu.open .hamburger-menu__line{
  background-color: transparent;
}
.hamburger-menu.open .hamburger-menu__line::before{
  transform: rotate(45deg);
}
.hamburger-menu.open .hamburger-menu__line::after{
  transform: rotate(-45deg);
}

/* ナビゲーション */
.nav-sp{
  box-sizing: border-box;
  position: absolute;
  z-index: 2;
  top: 0;
  right: -250px;
  width: 250px;
  height: 100%;
  padding: 4rem 2rem 0;
  background-color: rgba(222,189,210,0.8);
  text-align: left;
  transition: right 0.5s;
}
.nav-sp li{
  margin: 1rem auto;
}

.nav-sp a:link, .nav-sp a:visited{
  color: #553D27;
}
.nav-sp a:hover{
  text-decoration: underline;
}

.nav-sp.open{
  right: 0;
}

.nav-sp a{
  display: inline-block;
  padding: 5px 0;
}


.nav-pc ul{
display: flex;
list-style: none;
}
.nav-pc li{
  font-family: 'Saira Condensed', sans-serif;
  padding: 0 0.8rem;
  margin-top:0.5rem;
}
.nav-pc a{
  color: #D26F92;
}
      .nav-pc ul li a {
        color: #D26F92;
        position: relative; }
    .nav-pc ul li a::after {
      position: absolute;
      bottom: 0;
      left: 0;
      content: '';
      width: 100%;
      height: 0.1rem;
      background: #D26F92;
      transform: scale(0, 1);
      transform-origin: center top;
      transition: transform .2s; }
      .nav-pc ul li a:hover {
        text-decoration: none; }
        .nav-pc ul li a:hover::after {
          transform: scale(1, 1); }

.wrapper{
}
.wrapper_inner{
  background: #F6F9FB;
  position: relative;
  z-index: 1;
}

main {
  width: 100%;
  min-height: 80vh;
  padding-top: 5rem;
  padding-bottom: 3.5rem; }

.entry{
    margin: 0 auto;
    background: #ffffff;
    border-radius: 0.5rem; }
.entry img{
 width: 80vw;
 margin-bottom: 1rem;
}

.eyecatch{
  width: 100%;
  height: 8rem;
  background: no-repeat 50% top url("../img/entryh1.jpg");
  border-radius: 0.5rem;
  margin-bottom: 1rem;
    max-width: 1600px;
}

.eyecatch h1{
  width: 100%;
  font-size: 1.8rem;
  font-family: 'Zen Maru Gothic', sans-serif;
  line-height: 1.2;
  letter-spacing: 0.3rem;
  padding-left: 1rem;
  padding-top: 3rem;
  padding-bottom: 1rem;
  color: #000000;
}

.entry h2{
    font-weight: bold;
    line-height: 1.4;
    font-size: 1.3rem;
    font-family: 'Zen Maru Gothic', sans-serif;
    line-height: 1.3;
    letter-spacing: 0.1rem;
    position: relative;
    margin: 5rem 0 1rem;
    padding: 0.8rem 0 0.8rem;
    border-top: solid 2px #FCE3DD;
    border-bottom: solid 2px #FCE3DD; }
    .entry h2:after {
      content: '';
      position: absolute;
      /* top: 3.1rem; */
      bottom: 0;
      left: -0.3rem;
      width: 10rem;
      height: 0.5rem;
      background: #D26F92;
}

div.map {
 text-align: center;
 margin-top: 2rem;
}

div.map img {
 width: 75%;
 margin-bottom: 1rem;
 max-width: 800px;
}

p.tel img{
  width: 15rem;
}

table{
  border-collapse: separate;
  border-spacing: 0 0.5rem; }

table tr{
  border-bottom: solid 2px white;
}

table tr:last-child{
  border-bottom: none;
}

table th{
  position: relative;
  background-color: #bee379;
  color: #000000;
  text-align: center;
  padding: 10px 0;
}

table th:after{
  display: block;
  content: "";
  width: 0px;
  height: 0px;
  position: absolute;
  top:calc(50% - 10px);
  right:-10px;
  border-left: 10px solid #bee379;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
}

table td{
  text-align: left;
  background-color: #eee;
  padding: 10px 0;
  padding-left: 1.5rem;
}

span.chuu{
  font-size: 0.7rem;
  text-indent: -1em;
  padding-left: 1em;
}

.entry a{
  color: #000000;
  text-decoration: underline !important;
}

.entry ul, .entry ol {
  background: #FCE3DD;
  box-shadow: 0 0 0 0.5rem #FCE3DD;/*線の外側*/
  border: dashed 2px #FFFFFF;/*破線*/
  border-radius: 9px;
  margin-left: 0.5rem;/*はみ出ないように調整*/
  margin-right: 0.5rem;/*はみ出ないように調整*/
}

.entry ul li, .entry ol li {
  line-height: 1.5;
  padding: 0.5em 0;
  text-indent: -1em;
  padding-left: 1em;
}

.entry .shokuji img{
  width: 70%;
}


/* ギャラリー用ここからpadding-bottom and top for image */
.gallery{
columns: 5;/*段組みの数*/
padding:0 0.5rem;/*ギャラリー左右に余白をつける*/
margin:0;
}

.gallery li {
    margin-bottom: 1rem;/*各画像下に余白をつける*/
	list-style:none;
}

/*ギャラリー内のイメージは横幅100%にする*/
.gallery img{
	width: 100%;
	height: auto;
	vertical-align: bottom;/*画像の下にできる余白を削除*/}

/*　横幅900px以下の段組み設定　*/
@media only screen and (max-width: 900px) {
	.gallery{
	columns: 3;
	}	
}

@media only screen and (max-width: 768px) {
	.gallery{
	columns: 2;
	}	
}

/* ギャラリー用ここまで*/


footer{
background-color: #998881;
  position: sticky;
  bottom: 0;
  z-index: 0;
  padding: 2rem 0;
  width: 100%;
  text-align: center;
 }

.copyright{
  color: #FFFFFF;
}