@charset "UTF-8";
/*まずはお決まりのボックスサイズ算出をborer-boxに */
*,
*:before,
*:after {
  -webkit-box-sizing: inherit;
  box-sizing: inherit;
}

html {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.btn,
a.btn,
button.btn {
  position: relative;
  display: inline-block;
  padding: 1rem 4rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #212529;
  border-radius: 0.5rem;
}

.btn-wrap-pc-sp {
  max-width: 435px;
  margin: 0 auto 20px;
}

.btn-wrap {
  gap: 20px;
  margin-bottom: 20px;
}

a.btn-pc-sp {
  line-height: 1.4;
  width: 49.5%;
  padding: 1.25rem 0;
  color: #ffff;
}

a.btn--contact {
  display: block;
  padding: 1.5rem 0;
  color: #fff;
  background: #e56b8b;
  -webkit-box-shadow: 0 5px 0 #e56b8b;
  box-shadow: 0 5px 0 #e56b8b;
}

a.btn--contact i {
  font-size: 2rem;
}

a.btn--contact i.fa-position-left {
  font-size: 3rem;
  left: 2rem;
}

a.btn--contact :hover {
  color: #fff;
}

a.btn--tel {
  display: block;
  margin-top: 15px;
  padding: 1rem 0;
  color: #fff;
  background: #73453c;
  -webkit-box-shadow: 0 5px 0 #73453c;
  box-shadow: 0 5px 0 #73453c;
}

a.btn--tel i {
  font-size: 2rem;
}

a.btn--tel i.fa-position-left {
  font-size: 3rem;
  left: 2rem;
}

a.btn--tel .number {
  line-height: 1;
  display: inline-block;
  margin-top: 0.5rem;
  padding: 0.25rem 2rem;
  letter-spacing: 0;
  color: #73453c;
  border-radius: 0.5rem;
  background: #fff;
}

a.btn--tel:hover {
  color: #fff;
}

.fa-position-left {
  position: absolute;
  top: calc(50% - 0.5em);
  left: 1rem;
}

.fa-position-right {
  position: absolute;
  top: calc(50% - 0.5em);
  right: 1rem;
}

* {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  font-family: 'Noto Serif JP', serif;
  text-decoration: none;
  list-style-type: none;
}

a {
  color: #333;
}

#wrapper {
  margin: 0 30px;
  background-color: #fff;
  max-width: 959px;
  text-align: center;
  padding-top: 30px;
  overflow: hidden;
}

@media (min-width: 1000px) {
  #wrapper {
    width: 1000px;
    margin: 0 auto;
    padding: 0 30px;
  }
}

section {
  padding: 10px 0;
  margin-left: 30px;
  margin-right: 30px;
}

@media (min-width: 1000px) {
  section {
    padding: 10px 0;
  }
}

img {
  max-width: 100%;
  vertical-align: bottom;
}

h1 {
  font-size: 18px;
}

h1 span {
  margin-left: 5px;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  color: #333;
}

p {
  font-size: 18px;
}

@media (min-width: 1000px) {
  p {
    font-size: 20px;
  }
}

/*ヘッダーまわりはサイトに合わせて調整してください*/
header {
  padding: 10px;
  background-color: #efddce;
}

@media (min-width: 1000px) {
  header {
    padding: 10px 100px 10px 10px;
  }
}

#header-innner {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

/*チェックボックス等は非表示に*/
.nav-unshown {
  display: none;
}

/*アイコンのスペース*/
#nav-open {
  display: inline-block;
  width: 30px;
  height: 22px;
  vertical-align: middle;
}

@media (min-width: 1000px) {
  #nav-open {
    display: initial;
    width: initial;
    height: initial;
    vertical-align: initial;
  }
}

/*ハンバーガーアイコンをCSSだけで表現*/
#nav-open span,
#nav-open span:before,
#nav-open span:after {
  position: absolute;
  height: 3px;
  /*線の太さ*/
  width: 25px;
  /*長さ*/
  border-radius: 3px;
  background: #333;
  display: block;
  content: '';
  cursor: pointer;
}

@media (min-width: 1000px) {
  #nav-open span,
  #nav-open span:before,
  #nav-open span:after {
    position: initial;
    width: initial;
    height: initial;
    border-radius: initial;
    background: initial;
    display: initial;
    cursor: initial;
  }
}

#nav-open span:before {
  bottom: -8px;
}

@media (min-width: 1000px) {
  #nav-open span:before {
    bottom: initial;
  }
}

#nav-open span:after {
  bottom: -16px;
}

@media (min-width: 1000px) {
  #nav-open span:after {
    bottom: initial;
  }
}

/*閉じる用の薄黒カバー*/
#nav-close {
  display: none;
  /*はじめは隠しておく*/
  position: fixed;
  z-index: 99;
  top: 0;
  /*全体に広がるように*/
  left: 0;
  width: 100%;
  height: 100%;
  background: black;
  opacity: 0;
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}

@media (min-width: 1000px) {
  #nav-close {
    display: initial;
    position: initial;
    z-index: initial;
    top: initial;
    left: initial;
    width: initial;
    height: initial;
    background: initial;
    opacity: initial;
    -webkit-transition: initial;
    transition: initial;
  }
}

/*中身*/
#nav-content {
  overflow: auto;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  /*最前面に*/
  width: 90%;
  /*右側に隙間を作る（閉じるカバーを表示）*/
  max-width: 330px;
  /*最大幅（調整してください）*/
  height: auto;
  background: #fff;
  /*背景色*/
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
  /*滑らかに表示*/
  -webkit-transform: translateX(-105%);
  transform: translateX(-105%);
  /*左に隠しておく*/
  list-style-type: none;
}

@media (min-width: 1000px) {
  #nav-content {
    overflow: initial;
    position: initial;
    top: initial;
    left: initial;
    z-index: initial;
    width: initial;
    height: initial;
    background: initial;
    max-width: initial;
    -webkit-transition: initial;
    transition: initial;
    -webkit-transform: initial;
            transform: initial;
    list-style-type: initial;
  }
}

@media (min-width: 1000px) {
  #nav-content ol {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0 auto;
    background-image: url(../images/tes3.png);
    background-position: center bottom;
    background-repeat: repeat-x;
  }
}

#nav-content li {
  list-style-type: none;
  background-color: #efddce;
  padding: 15px 10px;
}

#nav-content li a {
  color: #fff;
}

@media (min-width: 1000px) {
  #nav-content li {
    padding: 10px;
    margin-left: 80px;
  }
  #nav-content li a {
    color: #333;
    position: relative;
    display: inline-block;
    text-decoration: none;
  }
  #nav-content li a::after {
    position: absolute;
    bottom: -4px;
    left: 0;
    content: '';
    width: 100%;
    height: 1px;
    background: #333;
    -webkit-transform: scale(0, 1);
            transform: scale(0, 1);
    -webkit-transform-origin: left top;
            transform-origin: left top;
    -webkit-transition: -webkit-transform .3s;
    transition: -webkit-transform .3s;
    transition: transform .3s;
    transition: transform .3s, -webkit-transform .3s;
  }
  #nav-content li a:hover::after {
    -webkit-transform: scale(1, 1);
            transform: scale(1, 1);
  }
}

/*チェックが入ったらもろもろ表示*/
#nav-input:checked ~ #nav-close {
  display: block;
  /*カバーを表示*/
  opacity: .5;
}

#nav-input:checked ~ #nav-content {
  -webkit-transform: translateX(0%);
  transform: translateX(0%);
  /*中身を表示（右へスライド）*/
  -webkit-box-shadow: 6px 0 25px rgba(0, 0, 0, 0.15);
          box-shadow: 6px 0 25px rgba(0, 0, 0, 0.15);
}

@media (min-width: 1000px) {
  #nav-drawer {
    display: block;
  }
}

.tel {
  position: absolute;
  bottom: 30px;
  right: 30px;
  width: 35%;
}

@media (min-width: 1000px) {
  .tel {
    width: 30%;
  }
}

.tel img {
  max-width: 100%;
  position: relative;
}

/* body */
.heroimage {
  background-repeat: no-repeat;
  background-size: cover;
  height: 50vh;
  margin: 0 auto;
  max-height: 768px;
  max-width: 1920px;
  width: 100%;
  position: relative;
}

@media (min-width: 1000px) {
  .heroimage {
    height: 90vh;
  }
}

.hero_ttl {
  font-size: 28px;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  font-weight: bold;
}

@media (min-width: 959px) {
  .hero_ttl {
    font-size: 40px;
  }
}

#wrapper {
  margin: 0 30px;
  background-color: #fff;
  max-width: 959px;
  text-align: center;
}

@media (min-width: 1000px) {
  #wrapper {
    width: 1000px;
    margin: 0 auto;
  }
}

.pt50 {
  padding-top: 50px;
}

.figure {
  padding-bottom: 30px;
  width: 100%;
  margin: 0 auto;
}

@media (min-width: 1000px) {
  .figure {
    margin-bottom: 60px;
    width: 50%;
    text-align: center;
  }
}

.figure_txt {
  font-size: 18px;
  margin-top: 20px;
  text-align: left;
  display: inline-block;
}

@media (min-width: 1000px) {
  .figure_txt {
    font-size: 20px;
    width: 70%;
  }
}

@media (min-width: 1000px) {
  .figure_img {
    width: 70%;
    height: 70%;
  }
}

@media (min-width: 1000px) {
  .figure-flx {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
}

@media (min-width: 1000px) {
  .figure-flx:nth-of-type(3) {
    margin-bottom: 0px;
  }
}

.ttl {
  margin: 30px;
  background-image: url(../images/arrow.png);
  background-position: bottom;
  background-repeat: no-repeat;
  font-size: 20px;
  padding-bottom: 15px;
}

#access_txt {
  margin: 20px 0;
}

/* gmap */
.gmap {
  position: relative;
  width: 100%;
  height: 0;
  padding-top: 56.25%;
}

.gmap iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* footer */
#footer-inner {
  text-align: center;
  background-color: #efddce;
  padding-bottom: 15px;
  padding-top: 10px;
}

@media (min-width: 1000px) {
  #footer-inner {
    padding-bottom: 15px;
    padding-top: 15px;
  }
}

#footer-inner_ol {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  list-style-type: none;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  width: 70%;
  margin: 0 auto;
}

@media (min-width: 1000px) {
  #footer-inner_ol {
    width: 70%;
    margin: 0 auto;
  }
}

#footer-inner_li {
  width: 50%;
  margin-top: 20px;
}

#footer-inner_li a {
  color: #333;
}

@media (min-width: 1000px) {
  #footer-inner_li {
    width: 25%;
    margin-top: 5px;
  }
  #footer-inner_li:nth-of-type(4) {
    width: 25%;
  }
  #footer-inner_li a {
    color: #333;
    position: relative;
    display: inline-block;
    text-decoration: none;
  }
  #footer-inner_li a::after {
    position: absolute;
    bottom: -4px;
    left: 0;
    content: '';
    width: 100%;
    height: 1px;
    background: #333;
    -webkit-transform: scale(0, 1);
            transform: scale(0, 1);
    -webkit-transform-origin: left top;
            transform-origin: left top;
    -webkit-transition: -webkit-transform .3s;
    transition: -webkit-transform .3s;
    transition: transform .3s;
    transition: transform .3s, -webkit-transform .3s;
  }
  #footer-inner_li a:hover::after {
    -webkit-transform: scale(1, 1);
            transform: scale(1, 1);
  }
}

#footer-inner_copyLight {
  color: #333;
  display: inline-block;
  margin-top: 15px;
  font-size: 10px;
}

/* SNS */
#btn-sns--instagram {
  margin: 20px 0;
}
/*# sourceMappingURL=common.css.map */