@charset "UTF-8";
/* ========== ========== ==========
resetcss
========== ========== ========== */

/* header */
.c-header-wrapper {
  display: block;
  position:fixed;
  top: 0;
  left:0;
  width: 100%;
  height: 100px;
  background-color: #383838;
  border-bottom:1px solid #c9b79e;
  z-index:999;
}
.c-header-area {
  height: 100%;
}
.l-row {
  display: flex;
  -webkit-box-orient:horizontal;
  -webkit-box-direction:normal;
  flex-flow:row;
  flex-wrap: wrap;
  margin-left:calc(30px/-2);
  margin-right: calc(30px/-2);
}
[class*=-grid-] {
  position: relative;
  font-size: 1rem;
}
.l-grid-3 {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(100%/(12/3) - 30px - .1px);
  margin:0 calc(30px/2);
  max-width:calc(100%/(12/3) - 30px);
}
.l-grid-9 {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(100%/(12/9) - 30px - .1px);
  margin:0 calc(30px/2);
  max-width:calc(100%/(12/9) - 30px);  
}
.c-header-logo-link {
  display: inline-flex;
  align-items:center;
  color:#fff;
  font-family: "Josefin Sans","Roboto","Noto Sans JP","Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;
  font-size:28px;
  font-weight: bold;
  padding: 0 0 0 15px;
  transition: ease .3s;
  text-decoration: none;
  margin-top: 6px;
}
.c-header-logo-link:hover {
  transition: ease .3s;
  opacity: .7;
}
.c-header-logo {
  display: block;
  width:auto;
  max-width: 100%;
  max-height: 70px;
}
.display-pc {
  display: block;
}
.c-header-nav-cont {
  display: flex;
  -webkit-box-pack:center;
  -webkit-box-align:center;
  justify-content:flex-end;
  align-items: center;
  width:100%;
}
.c-header-nav {
  -webkit-box-pack:center;
  -webkit-box-align:center;
  align-items: center;
  display: inline-flex;
  justify-content: flex-end;
  width: auto;
  padding-right:25px;
}
.c-header-nav-list {
  vertical-align: middle;
}
.c-header-nav-menu {
  display: block;
  letter-spacing: .08em;
  line-height: 1.75;
  text-align: left;
  position: relative;
  top:0;
  left:0;
  font-size: 1vw;
  font-weight: bold;
  color:#fff;
  transition: ease .3s;
  background-color: rgba(0,0,0,0);
  padding: .5vw 1vw;
  text-decoration: none;
}
.c-header-nav-menu:hover {
  background-color: #fff;
  color:#000000;
}
.c-header-nav-wrap {
  display: inline-block;
  width: auto;
  text-align: right;
}
.c-header-tel {
  color:#fff;
  font-size: 1.6vw;
  margin-right: 20px;
  transition: ease .3s;
  text-decoration: none;
  letter-spacing: 1px;
}
.c-header-tel:hover {
  color:rgb(225, 51, 255);
  transition: ease .3s;

}
.c-header-tel span {
  font-size: 1.4vw;
  margin-right: 0.5vw;
}
.c-header-sns-link {
  color:#fff;
  font-size: 1.4vw;
  margin:0 .8vw;
  transition: ease .3s;
}
.c-header-sns-link:hover {
  color:rgb(225, 51, 255);
}
.fa-x-twitter {
  --fa:"\e61b";
}
.fa, .fa-brands, .fa-classic, .fa-regular, .fa-sharp, .fa-solid, .fab, .far, .fas {
  -webkit-font-smoothing:antialiased;
  display: var(--fa-display,inline-block);
  font-style:normal;
  font-variant:normal;
  line-height:1;
  text-rendering:auto;
}
.fa-brands, .fab {
  font-family:"Font Awesome 6 Brands";
  font-weight: 400;
}
*, *::before, *::after {
  margin:0;
  padding: 0;
  -webkit-box-sizing:border-box;
}
.fa-x-twitter:before {
  content:"\e61b";
}
.c-header-nav-wrap-sp {
  display: none;
}
.c-header-trigger-wrapper {
  cursor: pointer;
  position: relative;
  top:0;
  left:0;
  width:52px;
  height: 52px;
  padding:0;
  z-index: 9999;
  transition:ease-out .3s; 
}
.c-header-trigger-line {
  position: absolute;
  width: 30px;
  height: 1px;
  left:12px;
  margin:0 auto;
  text-align: left;
  transition: ease .3s;
  background-color: #fff;
}
.c-header-trigger-line:nth-of-type(1) {
  top:14px;
}
.c-header-trigger-line:nth-of-type(2) {
  top:25px;
}
.c-header-trigger-line:nth-of-type(3) {
  top:36px;
  width: 25px;
}
.c-header-trigger-wrapper.active .c-header-trigger-line:nth-of-type(1) {
  transform: translate3d(0, 11px, 0) rotate3d(0, 0, 1, -315deg);
  transition: ease .4s;
}
.c-header-trigger-wrapper.active .c-header-trigger-line:nth-of-type(2) {
  opacity: 0;
  transition: ease-out .4s;
}
.c-header-trigger-wrapper.active .c-header-trigger-line:nth-of-type(3) {
  transform: translate3d(0, -11px, 0) rotate3d(0, 0, 1, 315deg);
  transition: ease .4s;
  width:30px;
}
.c-header-navmenu-wrapper {
  -webkit-box-pack:center;
  -webkit-box-align:center;
  align-items: center;
  position: fixed;
  top:0;
  left: 0;
  width: 100%;
  height: 100vh;
  padding: 0;
  z-index: 999;
  display: none;
  visibility: hidden;
}
.c-header-navmenu-wrapper.active {
  visibility: visible!important;
  display: flex;
  -webkit-box-pack:center;
  justify-content:center;
  -webkit-box-align:center;
  align-items: center;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  padding: 0 ;
  transform: translate3d(0, 0, 0);
  animation:c-header-navmenu-fade .2s ease-in 0s both;
  background-color: #383838;
}
.c-header-navmenu-wrapper.active::before {
  content:"";
  position: absolute;
  top:0;
  left:0;
  width:100%;
  height: 100vh;
  background-color: rgba(240,240,240,.5);
}
.c-header-navmenu-list {
  padding: 10px 0;
  text-align: center;
  margin:0 auto;
}
.c-header-navmenu-listin-box {
  display: block;
}
.c-header-navmenu-listin {
  width: 100%;
}

@keyframes c-navmenu-list-fade {
  0% {
    opacity: 0;
    transform: translateX(20px);
  }
  100% {
    opacity: 1;
    transform: translateX(0px);    
  }
}

.c-header-navmenu-listin.active:nth-child(1) {
  animation:c-navmenu-list-fade .2s ease .1s both;
}
.c-header-navmenu-listin.active:nth-child(2) {
  animation:c-navmenu-list-fade .2s ease .2s both;  
}
.c-header-navmenu-listin.active:nth-child(3) {
  animation:c-navmenu-list-fade .2s ease .3s both; 
}
.c-header-navmenu-listin.active:nth-child(4) {
  animation:c-navmenu-list-fade .2s ease .4s both; 
}
.c-header-navmenu-listin.active:nth-child(5) {
  animation:c-navmenu-list-fade .2s ease .5s both; 
}
.c-header-navmenu-sns-box {
  margin-top: 40px;
}

.c-header-navmenu-logo {
  display: block;
  text-align: center;
  margin:0 auto;
  width: 140px;
}
.c-header-navmenu-link {
  position: relative;
  display: inline-block;
  font-size: 2rem;
  font-weight: bold;
  letter-spacing: .1em;
  line-height: 1;
  color:#111;
  text-align: center;
  padding: 5px 0;
  margin:0 auto;
  transition: ease .4s;
  z-index: 9999;
}
.c-header-navmenu-sns-area {
  margin-top: 20px;
}

@media screen and (max-width: 767px) {
  .c-header-wrapper {
    height: 80px;
  }
  .l-grid-sp-6 {
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: calc(100% / (12 / 6) - 30px - .1px);
    margin:0 calc( 30px / 2);
    max-width:calc(100% / (12 / 6) - 30px);
  }
  .c-header-logo-link {
    font-size: 17px;
    line-height: 16px;
    letter-spacing: 0.05em;
  }
  .c-header-logo {
    max-height: 60px;
  }
  .display-pc {
    display: none;
  }
  .c-header-nav-wrap-sp {
    display: flex;
    align-items: center;
  }
  .c-header-nav-wrap {
    width: auto;
    padding-right: 2vw;
  }
  .c-header-navmenu-list {
    /* max-width: 150px; */
    margin-top: 38%;
  }
  .c-header-nav-sp {
    display: flex;
    -webkit-box-pack:center;
    -webkit-box-align:center;
    align-items: center;
    justify-content: flex-end;
  }
  .c-header-sp-tel {
    font-size: 6vw;
    display: block;
    position: relative;
    top:0;
    right:0;
    color:#fff;
    text-align: right;
    margin:0 auto;
    padding: 0 15px;
  }
  .c-header-menu-sp {
    display: inline-block;
    text-align: right;
    margin-left:auto;
    padding-right: 2vw;
  }
  .c-header-navmenu-link {
    font-size:1.2rem;
    text-decoration: none;
  }
  .c-header-navmenu-listin {
    margin:0 auto 10px auto;
  }
  .c-header-sns-link {
    font-size:7vw;
    margin:0 3vw;
  }
}

/* footer */
.c-footer {
  display: block;
  position: relative;
  top: 0;
  left: 0;
  width: 100%;
  padding: 60px 0;
  overflow: hidden;
  background-color: #383838;
}
.l-container {
  margin: 0 auto;
  max-width:1200px;
  padding:0;
}
.l-row {
  display: flex;
  -webkit-box-orient:horizontal;
  -webkit-box-direction:normal;
  flex-flow:row;
  flex-wrap:wrap;
  margin-left:calc(30px/-2);
  margin-right:calc(30px/-2);
}
.l-offset-right-4 {
  margin-right:calc(100%/(12/4));
  margin-left:calc(100%/(12/4));
  flex-grow:0;
  flex-shrink:0;
  flex-basis:calc(100%/(12/4) - 30px - .1px);
  max-width: calc(100%/(12/4) - 30px);
}
.c-footer-copy {
  display: block;
  font-size: 1rem;
  font-weight: normal;
  letter-spacing: .08em;
  line-height: 1.75;
  text-align:center;
  color:#fff;
}

@media screen and (max-width: 768px) {


  .l-container {
    max-width:100%;
  }
  .l-offset-right-4 {

    flex-grow:1;
    flex-shrink:0;
    flex-basis:calc(100% - 30px - .1px);
    max-width: calc(100% - 30px);
    margin-right:calc(30px/2);
    margin-left:calc(30px/2);
  }

  .c-footer-copy {
    font-size: 1rem;
  }
}



.display-pc {
  display: block;
}
@media screen and (max-width: 768px) {
  .display-pc {
    display: none;
  }
}

.display-sp {
  display: none;
}
@media screen and (max-width: 768px) {
  .display-sp {
    display: block;
  }
}