/*layout*/
@charset "utf-8";
html {
  scroll-behavior: smooth;
  scroll-padding-top: 60px;
}
@media screen and (max-width: 751px) {
  html {
    scroll-behavior: smooth;
    scroll-padding-top: 50px;
  }
}
@media screen and (max-width: 1201px) {
  html {
    scroll-behavior: smooth;
    scroll-padding-top: 75px;
  }
}

.contents-width { width: 100%; max-width: 750px; margin: 0 auto; }
.contents-wrap { width: 94%; max-width: 1100px;  margin: 0 auto; }

@media screen and (max-width: 900px) {
}
/*header*/
body {padding-top: 4rem; }
@media screen and (min-width: 1201px) {
  body {padding-top: 66px; }
}

.header { display: flex; padding: 1rem; background: #f4e9e1;  top: 0; left: 0; right: 0; justify-content: space-between; position: relative; z-index: 999; align-items: center; position: fixed; font-weight: bold; }

.head-logo { width: 40vw; display: block; }
.head-menu { display: flex; align-items: center; }
.head-mail { width: 8vw; height: auto; margin-right: 4vw; }
.head-line { width: 7vw; height: auto; margin-right: 4vw; }
.head-hamburger { width: 7vw; height: 7vw; display: block; background: none; border: none; white-space: nowrap; overflow: hidden; text-indent: 200%; position: relative; }
.head-hamburger::before,
.head-hamburger::after { content: ''; width: 90%; height: 0.7vw; display: block; border-radius: 2px; background: #3c2519; position: absolute; inset: 0; margin: auto; transition: transform .3s;  }
.head-hamburger::before { transform: translateY(-2vw); box-shadow: 0 2vw 0 #3c2519; }
.head-hamburger::after{ transform: translateY(2vw); }

.head-hamburger.open::before { transform: rotate(45deg); box-shadow: none; }
.head-hamburger.open::after{ transform: rotate(-45deg); }

.global-navi-wrap { display: none; }
.header.open .global-navi-wrap {display: block; }
.global-navi-wrap  .foot-sns { margin: 1rem 0 2rem; }

@media screen and (max-width: 750px) {
  .header.open::after { content: ''; width: 100%; height: 100vh; position: fixed; bottom: 0; left: 0; right: 0; margin: auto; background: rgba(0,0,0,.3); z-index: -2; display: block; }
  .global-navi-wrap {  position: fixed; top: 0; left: 0; right: 0; width: 100%; height: auto; padding: calc(7vw + 2rem) 0;  z-index: -1; background: #FFF; overflow-y: scroll; }
  .global-navi-wrap::before { content: ''; width: 100%; height: calc(7vw + 2rem); position: fixed; top: 0; left: 0; right: 0; margin: auto; background: #f4e9e1; box-shadow: 0 0px 0 2px rgba(0,0,0,.07); z-index: 2; }
  .global-navi > li { border-bottom: 1px solid #bab1ad; }
  .global-navi a { display: block; padding: 1em; position: relative; }
  .global-navi a::after { content: ''; width: .6em; height: .6em; display: block; position: absolute; right: 2em; top: 0; bottom: 0; margin: auto; border-right: 2px solid #ea745b; border-top: 2px solid #ea745b; transform:scaleX(.8) rotate(45deg); }
}
@media screen and (min-width: 751px) {
  .header {  padding: .6rem 1rem; align-items: center; }  
  .head-logo { width: 234px; }
  
  .head-hamburger { display: none; }
  .global-navi-wrap { display: block; }
  .global-navi { display: flex; font-size: 1.2vw; }
  .global-navi > li + li { margin-left: 1.5em;}

  .global-navi {  font-size: .8375rem; }
  .global-navi > li + li { margin-left: 3em;}
  
  .head-mail { width: 55px; margin-right: 30px; }
  .head-line { width: 47px; margin-right: 0; }
}

/* footer */
.footer { padding-bottom: 40vw; }
.foot-main-navi { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-bottom: 1px solid #5b463b; }
.foot-main-navi > li { border-top: 1px solid #5b463b; border-right: 1px solid #5b463b;}
.foot-main-navi > li:nth-child(2n) { border-right: none; }
.foot-main-navi > li:nth-child(2) {  border-bottom: 1px solid #5b463b; }
.foot-main-navi a { display: block; padding: 1em; text-align: center; }

.foot-sns { display: flex; justify-content: center; margin: 2.5rem 0 4.5rem; }
.foot-sns > li + li { margin-left: 2.5rem; }
.foot-sns img { width: 3.6rem; height: 3.6rem; }

.foot-logo { margin: 0 auto; display: block; width: 40vw; }

.copyright { font-size: .83rem; margin: .7em 0; text-align: center; display: block; }

@media screen and (min-width: 751px) {
  .footer { padding-top: 3rem; padding-bottom: 150px; }
  .foot-main-navi { display: flex; justify-content: center; border: none; font-size: .75rem;}
  .foot-main-navi > li + li { margin-left: 1.5em; }
  .foot-main-navi > li:nth-child(n) { border: none; }
  .foot-main-navi a { padding: 0; }
  .foot-sns { margin: 4.5rem 0 2.2rem;}
  .foot-sns > li + li { margin-left: 2rem; }
  .foot-sns img { width: 68px; height: 68px; }
  
  .foot-logo { width: 245px; }
}
@media screen and (min-width: 1000px) {
  .foot-main-navi { font-size: .8375rem;}
  .foot-main-navi > li + li { margin-left: 3em; }
}

.fixed-line-button { position: fixed; bottom: 0; left: 0; right: 0; margin: auto; z-index: 99; width: min(750px, 100vw); }
@media screen and (min-width: 751px) {
  .fixed-line-button { width: 400px; }
}

.js-modalYoutube { cursor: pointer; }
.js-overlay { position: fixed; top: 0; left: 0; overflow: hidden; width: 100%; height: 100%; background-color: rgba(0,0,0,0.6); z-index: 200; cursor: pointer; }
.js-contsWrap:before { content: "×"; position: absolute; top: 0; right: 0; font-size: 30px; color: #fff; font-weight: 100;} 
.js-contsWrap { width: 40vh; max-width: 1200px; margin: 0 auto; padding: 60px 0 0; top: 50%; position: relative; -webkit-transform: translateY(-50%);  transform: translateY(-50%);}
.js-contsInner {position: relative; padding-bottom: 177%; }
.is-modalActive .is-view {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}