@charset "UTF-8";


@font-face {
   font-family: 'Ogg';
   src: url('../font/Ogg-Roman.woff') format('woff'),
       url("/font/Ogg-Roman.ttf") format("truetype"),
       url("/font/Ogg-Roman.otf") format("opentype")
}

html{
   font-size: 62.5%;
}

.sp-img{
   display: none;
}


.sp-reverse{
   display: none;
}


img{
   max-width: 100%;
   height: auto;
}

body{
   font-family: YakuHanJP,"montserrat","Ogg",'Noto Serif JP','Noto Sans JP',sans-serif,serif;
   font-size: 1.6rem;
   font-feature-settings: "palt";
   -webkit-font-feature-settings: "palt";
   background-color: #f5f0ed;
   color: #252525;
}

.arrow{
   width: 10%;
   position: absolute;
   top: -14%;
   margin-left: 5%;
}
.cls-1,.cls-2{
   fill:none;
   stroke:#1b1b1b;
}
.cls-1{
   stroke-linecap:round;
   stroke-linejoin:round;
   stroke-width:0.45px;
}
.cls-2{
   stroke-miterlimit:10;
   stroke-width:0.46px;
   stroke-dasharray: 41px;
   /* stroke-dashoffset: 41px; */
   transform-origin: center;
   -webkit-animation: arrow-button__border-out2 1.5s cubic-bezier(0.215, 0.61, 0.355, 1) both;
   animation: arrow-button__border-out2 1.5s cubic-bezier(0.215, 0.61, 0.355, 1) both;

}

.btn-hover:hover .cls-2{
   -webkit-animation: arrow-button__border-out 1.5s cubic-bezier(0.215, 0.61, 0.355, 1) both;
   animation: arrow-button__border-out 1.5s cubic-bezier(0.215, 0.61, 0.355, 1) both;

}

@-webkit-keyframes arrow-button__border-out {
   0% {
       stroke-dashoffset: 41px;
   }

   to {
       stroke-dashoffset: -82px;
       transform: rotate(270deg);
   }
}

@keyframes arrow-button__border-out {
   0% {
       stroke-dashoffset: 41px;
   }

   to {
       stroke-dashoffset: -82px;
       transform: rotate(270deg);
   }
}

@-webkit-keyframes arrow-button__border-out2 {
   0% {
       stroke-dashoffset: -82px;
   }

   to {
       stroke-dashoffset: 41px;
       transform: rotate(-90deg);
   }
}

@keyframes arrow-button__border-out2 {
   0% {
      stroke-dashoffset: -82px;
   }

   to {
       stroke-dashoffset: 41px;
       transform: rotate(-90deg);
   }
}

.img-anime{
   overflow: hidden;
}

.js-monitored.is-show .img-anime::after,.img-anime.is-show::after,.js-monitored.is-show .img-anime canvas{
   animation: img-anime 1.2s cubic-bezier(.58,.3,.32,.63) .1s both;
   -webkit-animation: img-anime 1.2s cubic-bezier(.58,.3,.32,.63) .1s both;
}

.img-anime::after,.img-anime canvas{
   transform: scale(1.3);
   filter: blur(5px);
}

@keyframes img-anime{
   0%{
       transform: scale(1.3);
       filter: blur(5px);
   }

   to{
       transform: scale(1);
       filter: blur(0);
   }
}

@-webkit-keyframes img-anime{
   0%{
       transform: scale(1.3);
       filter: blur(5px);
   }

   to{
       transform: scale(1);
       filter: blur(0);
   }
}

.txt-anime h2,.txt-anime h2,.txt-anime p{
   -webkit-transform-origin: 0% 0%;
    -ms-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
    -webkit-transform: skewY(5deg) translate(0, 20px);
    -ms-transform: skewY(5deg) translate(0, 20px);
    transform: skewY(5deg) translate(0, 20px);
    opacity: 0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.js-monitored.is-show .txt-anime h2,.js-monitored.is-show .txt-anime p,.txt-anime.is-show h2,.txt-anime.is-show p{
   -webkit-transition: opacity 1.2s cubic-bezier(0.4, 0.2, 0.1, 1) .2s, -webkit-transform 1.2s cubic-bezier(0.4, 0.2, 0.1, 1) .2s; 
   transition: opacity 1.2s cubic-bezier(0.4, 0.2, 0.1, 1) .2s, -webkit-transform 1.2s cubic-bezier(0.4, 0.2, 0.1, 1) .2s; 
   -o-transition: opacity 1.2s cubic-bezier(0.4, 0.2, 0.1, 1) .2s, transform 1.2s cubic-bezier(0.4, 0.2, 0.1, 1) .2s; 
   transition: opacity 1.2s cubic-bezier(0.4, 0.2, 0.1, 1) .2s, transform 1.2s cubic-bezier(0.4, 0.2, 0.1, 1) .2s; 
   transition: opacity 1.2s cubic-bezier(0.4, 0.2, 0.1, 1) .2s, transform 1.2s cubic-bezier(0.4, 0.2, 0.1, 1) .2s, -webkit-transform 1.2s cubic-bezier(0.4, 0.2, 0.1, 1) .2s; 
   opacity: 1;
   -webkit-transform: skewY(0deg) translate(0, 0);
   -ms-transform: skewY(0deg) translate(0, 0);
   transform: skewY(0deg) translate(0, 0);
}

.js-monitored.is-show .txt-anime p{
   transition-delay: .5s;
}


/* ----------------------
* header 
-------------------------*/

.header{
   width: 100%;
   position: fixed;
   top: 0;
   left: 0;
   z-index: 1000;
}
.header-inner{
   display: flex;
   align-items: center;
   justify-content: space-between;
   padding: 1.875% 4.1%;
   box-sizing: border-box;
}

.header-title a{
   text-indent: 100%;
   overflow: hidden;
   white-space: nowrap;
   line-height: 0;
   display: block;
   width: 173px;
   height: 17px;
   background-repeat: no-repeat;
   background-size: cover;
   background-image: url(../img/common/header-logo.png);
}

.nav-wrapper{
   display: flex;
   align-items: flex-start;
   width: 100%;
   position: fixed;
   top: 0;
   left: 0;
   z-index: 100016;
   height: 100vh;
   background-color: #f5f0ed;
   box-sizing: border-box;
   padding: 12% 10% 0;
   transform: translateY(-120%);
   transform-origin: bottom left;
}

.header-navList{
   width: 65%;
   display: block;
}

.header-navListitem{
   overflow: hidden;
   margin: 14.5% 0;
}

.header-navListitem:first-of-type{
  margin-top: 0;
}

.header-navListitem:last-of-type{
   border-bottom: unset;
}

.header-navListitem>a,.header-navListitem>div{
   transform: translateY(100%);
   display: block;
   cursor: pointer;
   overflow: hidden;
}

.header-navListitem>a span,.header-navListitem>div span{
   font-family: "ogg",serif;
   font-size: 5.2rem;
   font-size: 3.6vw;
   letter-spacing: 0.06em;
   padding-left: 1em;
   margin: 0 0;
   box-sizing: border-box;
   color: #a7916d;
   text-transform: uppercase;
   display: block;
}

.header-navListitem:hover>a span,.header-navListitem:hover>div span{
   -webkit-animation: up 1.2s cubic-bezier(0.215, 0.61, 0.355, 1) forwards;
   animation: up 1.2s cubic-bezier(0.215, 0.61, 0.355, 1) forwards;
}

.header-navListitem ul li:hover a span{
   -webkit-animation: up2 1.2s cubic-bezier(0.215, 0.61, 0.355, 1) forwards;
   animation: up2 1.2s cubic-bezier(0.215, 0.61, 0.355, 1) forwards;
}

@-webkit-keyframes up {
   0% {
       -webkit-transform: matrix(1, 0, 0, 1, 0, 0) translate(0%, 0%);
       transform: matrix(1, 0, 0, 1, 0, 0) translate(0%, 0%)
   }

   30% {
       -webkit-transform: matrix(1, -0.15, 0.15, 1, 0, 0) translate(0%, -190%);
       transform: matrix(1, -0.15, 0.15, 1, 0, 0) translate(0%, -190%)
   }

   30.1% {
       -webkit-transform: matrix(1, 0.15, 0.15, 1, 0, 0) translate(0%, 190%);
       transform: matrix(1, 0.15, 0.15, 1, 0, 0) translate(0%, 190%)
   }

   100% {
       -webkit-transform: matrix(1, 0, 0, 1, 0, 0) translate(0%, 0%);
       transform: matrix(1, 0, 0, 1, 0, 0) translate(0%, 0%)
   }
}

@keyframes up {
   0% {
       -webkit-transform: matrix(1, 0, 0, 1, 0, 0) translate(0%, 0%);
       transform: matrix(1, 0, 0, 1, 0, 0) translate(0%, 0%)
   }

   30% {
       -webkit-transform: matrix(1, -0.15, 0.15, 1, 0, 0) translate(0%, -190%);
       transform: matrix(1, -0.15, 0.15, 1, 0, 0) translate(0%, -190%)
   }

   30.1% {
       -webkit-transform: matrix(1, 0.15, 0.15, 1, 0, 0) translate(0%, 190%);
       transform: matrix(1, 0.15, 0.15, 1, 0, 0) translate(0%, 190%)
   }

   100% {
       -webkit-transform: matrix(1, 0, 0, 1, 0, 0) translate(0%, 0%);
       transform: matrix(1, 0, 0, 1, 0, 0) translate(0%, 0%)
   }
}

@-webkit-keyframes up {
   0% {
       -webkit-transform: matrix(1, 0, 0, 1, 0, 0) translate(0%, 0%);
       transform: matrix(1, 0, 0, 1, 0, 0) translate(0%, 0%)
   }

   30% {
       -webkit-transform: matrix(1, -0.15, 0.15, 1, 0, 0) translate(0%, -160%);
       transform: matrix(1, -0.15, 0.15, 1, 0, 0) translate(0%, -160%)
   }

   30.1% {
       -webkit-transform: matrix(1, 0.15, 0.15, 1, 0, 0) translate(0%, 160%);
       transform: matrix(1, 0.15, 0.15, 1, 0, 0) translate(0%, 160%)
   }

   100% {
       -webkit-transform: matrix(1, 0, 0, 1, 0, 0) translate(0%, 0%);
       transform: matrix(1, 0, 0, 1, 0, 0) translate(0%, 0%)
   }
}

@keyframes up2 {
   0% {
       -webkit-transform: matrix(1, 0, 0, 1, 0, 0) translate(0%, 0%);
       transform: matrix(1, 0, 0, 1, 0, 0) translate(0%, 0%)
   }

   30% {
       -webkit-transform: matrix(1, -0.15, 0.15, 1, 0, 0) translate(0%, -160%);
       transform: matrix(1, -0.15, 0.15, 1, 0, 0) translate(0%, -160%)
   }

   30.1% {
       -webkit-transform: matrix(1, 0.15, 0.15, 1, 0, 0) translate(0%, 160%);
       transform: matrix(1, 0.15, 0.15, 1, 0, 0) translate(0%, 160%)
   }

   100% {
       -webkit-transform: matrix(1, 0, 0, 1, 0, 0) translate(0%, 0%);
       transform: matrix(1, 0, 0, 1, 0, 0) translate(0%, 0%)
   }
}

.header-navListitem ul li a{
   display: block;
   overflow: hidden;
}

.header-navListitem ul li a span{
   font-size: 3.6rem;
   font-size: 2.5vw;
   display: inline-block;
   margin: .5em 0;
   color: #a7916d;
   font-family: "Ogg",serif;
   text-transform: uppercase;
}

.header-navListitem ul{
   padding-left: 8%;
   display: none;
}

.header-navListitem ul li:last-of-type {
   margin-bottom: 0;
}

.header-navListitem ul li:last-of-type a span{
   margin-bottom: 0;
}

.header-navListitem>a::before,.header-navListitem>div::before{
   display: block;
   position: absolute;
   left: 0;
   top: 10%;
   font-size: 1.6rem;
   font-size: 1.11vw;
   font-family: "ogg",serif;
   opacity: .6;
   letter-spacing: 0.06em;
   color: #a7916d;
}

.header-navListitem:first-of-type>a::before{
   content: "01";
}

.header-navListitem:nth-of-type(2)>div::before{
   content: "02";
   top: 15%;
}

.header-navListitem:nth-of-type(3)>a::before{
   content: "03";
}

.header-navListitem:first-of-type>a{
   margin-left: 0;
}
.header-navListitem:last-of-type>a{
   margin-right: 0;
   margin-bottom: 0;
}

.other-contents{
   margin-bottom: 20%;
}

.other-contents h3,.nav-sns div h3{
   overflow: hidden;
   margin-bottom: 8%;
}

.other-contents h3 p,.nav-sns div h3 p{
   transform: translateY(100%);
   font-family: "Montserrat",sans-serif;
   text-transform: uppercase;
   font-size: 2.2rem;
   font-size: 1.52vw;
   color: #a7916d;
   font-weight: 500;
   letter-spacing: 0.08em;
}

.other-contents ul li a,.other-contents ul li p,.nav-sns div a{
   display: block;
   outline: none;
   font-family: "Montserrat",sans-serif;
   text-transform: uppercase;
   font-size: 1.6rem;
   font-size: 1.11vw;
   color: #cec6ba;
   font-weight: 400;
   letter-spacing: 0.06em;
   line-height: 1.4em;
   opacity: 0;
}

.other-contents ul li a{
   margin: 2% 0;
}

.other-contents ul li p{
   margin-top: 10%;
}

.nav-sns div a{
   margin: 5% 0;
   position: relative;
}

.nav-sns div a .arrow{
   width: 6%;
   width: 6%;
   top: 8.75%;
   margin-left: 2%;
}

.nav-sns div a .arrow polyline, .nav-sns div a .arrow circle{
   stroke: #a7916d;
}

.slide{
   position: relative;
}

.slide-icon{
   width: 2.083vw;
   height: 2.083vw;
   position: absolute;
   top: 50%;
   transform: translateY(-50%);
   left: 60%;
   transition: all .4s ease-in;
}

.slide-icon.is-slide{
   transform: translateY(-50%) rotate(45deg);
}

.slide-icon::before,.slide-icon::after{
   content: "";
   position: absolute;
   display: block;
   background-color: #a7916d;
}

.slide-icon::before{
   width: 100%;
   height: 1px;
   top: 50%;
   transform: translateY(-50%);
   left: 0;
}

.slide-icon::after{
   width: 1px;
   height: 100%;
   left: 50%;
   transform: translateX(-50%);
   top: 0;
}

/* ----------------------
* /header 
-------------------------*/

/* ----------------------
* Common 
-------------------------*/

.section-title{
   overflow: hidden;
}

.section-title span{
   display: block;
   -webkit-transform-origin: 0% 0%;
   -ms-transform-origin: 0% 0%;
   transform-origin: 0% 0%;
   transform: skewY(10deg) translateY(100%);
   font-size: 3.2rem;
   font-size: 2.22vw;
   color: #A7916D;
   font-family: "montserrat",sans-serif;
   font-weight: 500;
   text-transform: uppercase;
   letter-spacing: 0.06em;
   text-align: center;
}

.btn-trigger, .btn-trigger span{
   display: inline-block;
   transition: all .4s;
}

.btn-trigger{
   display: block;
   appearance: none;
   -webkit-appearance: none;
   border: none;
   width: 20px;
   height: 11px;
   position: fixed;
   top: 3.7%;
   right: 4.3%;
   z-index: 100017;
   background-color: transparent;
   outline: none;
}

.btn-trigger.black span{
   background-color: #fff;
}

.btn-trigger span{
   position: absolute;
   left: 0;
   width: 100%;
   height: 1px;
   background-color: #a7916d;
   border-radius: 100px;
}

.btn-trigger span:first-of-type{
   top: 0;
}
.btn-trigger span:nth-of-type(2){
   top: 5px;
}
.btn-trigger span:last-of-type{
   bottom: 0;
}
.btn-trigger.active span:nth-of-type(1) {
   -webkit-transform: translateY(5px) rotate(-45deg);
   transform: translateY(5px) rotate(-45deg);
}
.btn-trigger.active span:nth-of-type(2) {
   left: 200%;
   opacity: 0;
   -webkit-transform: translateY(0);
   transform: translateY(0);
   -webkit-animation: active-btn-bar02 .8s forwards;
   animation: active-btn-bar02 .8s forwards;
}

@keyframes active-btn-bar02 {
   100% {
       height: 0;
   }
}
.btn-trigger.active span:nth-of-type(3) {
   -webkit-transform: translateY(-5px) rotate(45deg);
   transform: translateY(-5px) rotate(45deg);

}
/* ----------------------
* /Common 
-------------------------*/

/* ----------------------
* insta 
-------------------------*/

.section-insta{
   padding-top: 8.3%;
}

.insta-list{
   padding-top: 2.9%;
   display: flex;
   justify-content: space-between;
}

.insta-listItem{
   overflow: hidden;
   width: 49.2%;
}

.insta-listItem a{ 
   text-align: center;
   width: 100%;
   display: block;
   outline: none;
   position: relative;
}

.insta-listItem a::after{
   content: "";
   display: block;
   padding-top: 69%;
   background-repeat: no-repeat;
   background-size: cover;
}

.insta-listItem:first-of-type a::after{
   background-image: url(../img/common/lim-insta.png);
}

.insta-listItem:last-of-type a::after{
   background-image: url(../img/common/miske-insta.png);
}

.insta-listItem a p{
   overflow: hidden;
   position: absolute;
   top: 50%;
   transform: translateY(-50%);
   left: 0;
   right: 0;
   margin: auto;
   z-index: 10;
}

.insta-listItem a p span{
   -webkit-transform-origin: 0% 0%;
   -ms-transform-origin: 0% 0%;
   transform-origin: 0% 0%;
   transform: skewY(10deg) translateY(100%);
   color: #fff;
   font-family: "ogg",serif;
   font-size: 4.5rem;
   font-size: 3.125vw;
   letter-spacing: 0.06em;
   display: block;
   margin: .1em 0;
}

.title-anime.is-show span{
   animation: title-show 1.2s cubic-bezier(.2,.43,.25,1.05) .6s both;
   -webkit-animation: title-show 1.2s cubic-bezier(.2,.43,.25,1.05) .6s both;
}

@keyframes title-show{
   0%{
       transform: skewY(10deg) translateY(100%);
   }
   100%{
       transform: skewY(0) translateY(0);
   }
}

@-webkit-keyframes title-show{
   0%{
       transform: skewY(10deg) translateY(100%);
   }
   100%{
       transform: skewY(0) translateY(0);
   }
}

/* ----------------------
* /insta 
-------------------------*/

/* -----------------------
* footer
------------------------- */

.sp-menu{
   display: none;
}

.footer{
   margin-top: 6.6%;
   background-color: #a7916d;
}

.footer-inner{
   width: 91.6%;
   padding: 5% 4.1% 2%; 
}

.footer-contents{
   display: flex;
   justify-content: space-between;
}

.footer-title{
   text-indent: 100%;
   white-space: nowrap;
   overflow: hidden;
   letter-spacing: 0;
   width: 247px;
   height: 24px;
   background-repeat: no-repeat;
   background-size: cover;
   background-image: url(../img/common/footer-logo.png);
}

.footer-navWrap{
   width: 46%;
}

.footer-navList{
   width: 100%;
   display: flex;
}

.footer-navListitem{
   padding-left: 0.8%;
   width: 33.333%;
}

.footer-navListitem:first-of-type{
   margin-left: 0;
}

.footer-navListitem h3{
   text-transform: uppercase;
   color: #fff;
   font-size: 1.5rem;
   font-size: 1.04vw;
   padding-bottom: 1.25em;
   font-weight: 500;
   letter-spacing: 0.08em;
}

.footer-navListitem ul li a,.footer-navListitem ul li p{
   outline: none;
   display: block;
   font-size: 1.3rem;
   font-size: 0.902vw;
   color: #fff;
   text-transform: uppercase;
   font-weight: 200;
   margin-bottom: 1.5em;
}

.footer-navListitem ul li p{
   line-height: 2;
}

.footer-others{
   padding-top: 5.5%;
}

.privacy,.copyright{
   display: inline-block;
   font-size: 1.3rem;
   font-size: 0.902vw;
   color: #fff;
   outline: none;
   font-family: "montserrat",sans-serif;
   font-weight: 200;
}

.privacy{
   letter-spacing: 0.08em;
   text-transform: uppercase;
}

.copyright{
   margin-left: 2em;
   letter-spacing: 0.05em;
}
/* -----------------------
* footer
------------------------- */

@media screen and (max-width:768px){
   body{
      font-size: 1.6rem;
      font-size: 4.2vw;
   }

   .sp-reverse{
      display: block;
   }

   .pc-reverse{
      display: none;
   }

   .sp-img{
      display: block;
   }

   .pc-img{
      display: none;
   }
   /* ----------------------
   * header 
   -------------------------*/

   .header-inner{
      display: block;
      width: 100%;
      padding: 3% 4.1%;
      box-sizing: border-box;
   }
   
   .header-title{
      width: 30.5%;
   }

   .header-title a {
      display: block;
      width: 100%;
      height: auto;
      background-image: none;
      background-repeat:unset;
      background-size: unset;
  }

  .header-title a::after{
      width: 100%;
     content: "";
     background-repeat: no-repeat;
     background-size: auto 100%;
     background-image: url(../img/common/header-logo.png);
     padding-top: 9%;
     display: block;
  }

   .nav-wrapper{
      display: block;
      padding: 12% 10% 0;
      overflow: scroll;
   }

   
   .header-navList{
      width: 100%;
      display: block;
   }

   .header-navListitem{
      margin: 12% 0;
   }

   .header-navListitem:last-of-type{
      border-bottom: unset;
   }

   .header-navListitem ul {
      padding-left: 13%;
  }
   
   .header-navListitem>a span,.header-navListitem>div span{
      font-size: 3.2rem;
      font-size: 8.5vw;
      letter-spacing: 0.06em;
      padding-left: 1.1em;
   }

   .header-navListitem ul li a span{
      font-size: 2.4rem;
      font-size: 6.4vw;
      margin: .75em 0;
      letter-spacing: 0.06em;
  }

  .header-navListitem ul li:first-of-type a span{
   margin-bottom: 0;
}

  .header-navListitem ul li:last-of-type a span{
     margin-bottom: 0;
  }

  .header-navListitem:hover>a span,.header-navListitem:hover>div span{
      animation: unset;
      -webkit-animation: unset;
}

.header-navListitem ul li:hover a span{
   animation: unset;
   -webkit-animation: unset;
}


   .header-navListitem>a::before,.header-navListitem>div::before{
      top: 13%;
      font-size: 1.2rem;
      font-size: 3.2vw;
   }

   .header-navListitem:nth-of-type(2)>div::before{
      top: 10%;
   }

   .headerNav__other{
      margin-top: 5%;
   }

   .other-contents{
      margin-bottom: 10%;
   }
   
   .other-contents h3 p,.nav-sns div h3 p{
      font-size: 1.6rem;
      font-size: 4.2vw;
   }
   
   .other-contents ul li a,.other-contents ul li p,.nav-sns div a{
      font-size: 1.3rem;
      font-size: 3.4vw;
      line-height: 1.4em;
   }
   
   .other-contents ul li a{
      margin: 1% 0;
   }
   
   .other-contents ul li p{
      margin-top: 5%;
   }
   
   .nav-sns div a{
      margin: 5% 0;
      position: relative;
   }
   
   .nav-sns div a .arrow{
      width: 5%;
   }
   
   .slide-icon{
      width: 6vw;
      height: 5.8vw;
      left: unset;
      right: 0;
   }

   
   /* ----------------------
   * /header 
   -------------------------*/
   
   /* ----------------------
   * Common 
   -------------------------*/
   .pc-reverse{
      display: none;
   }

   .section-title span{
      font-size: 1.8rem;
      font-size: 4.8vw;
   }
   .btn-trigger, .btn-trigger span{
      display: inline-block;
      transition: all .4s;
  }

  .btn-trigger{
      display: block;
      appearance: none;
      -webkit-appearance: none;
      border: none;
      width: 20px;
      height: 11px;
      position: fixed;
      top: 11px;
      right: 5.3%;
      z-index: 100017;
      background-color: transparent;
      outline: none;
  }

  .btn-trigger.black span{
      background-color: #fff;
  }

  .btn-trigger span{
      position: absolute;
      left: 0;
      width: 100%;
      height: 1px;
      background-color: #a7916d;
      border-radius: 100px;
  }

 
   /* ----------------------
   * /Common 
   -------------------------*/
   
   /* ----------------------
   * insta 
   -------------------------*/
   
   .section-insta{
      width: 100%;
      padding: 18.3% 0 0;
   }
   
   .insta-list{
      padding-top: 6%;
      display: block;
   }
   
   .insta-listItem{
      width: 100%;
   }

   .insta-listItem:not(:last-of-type){
      padding-bottom: 8%;
   }
   
   .insta-listItem a::after{
      content: "";
      display: block;
      padding-top: 60%;
      background-repeat: no-repeat;
      background-size: cover;
   }
   
   .insta-listItem a p span{
      font-size: 2.4rem;
      font-size: 6.4vw;
   }
   
   /* ----------------------
   * /insta 
   -------------------------*/
   
   /* -----------------------
   * footer
   ------------------------- */

   .pc-menu{
      display: none;
   }

   .sp-menu{
      display: block;
   }
   
   .footer{
      margin-top: 8%;
   }
   
   .footer-inner{
      width: 100%;
      box-sizing: border-box;
      padding: 10% 5% 5%; 
   }
   
   .footer-contents{
      display: block;
   }
   
   .footer-title{
      margin: 0 auto;
      width: 57.6%;
      height: auto;
      background-image: unset;
      line-height: 0;
   }

   .footer-title::after{
      content: "";
      display: block;
      width: 100%;
      padding-top: 9%;
      background-repeat: no-repeat;
      background-size: auto 100%;
      background-image: url(../img/common/footer-logo.png);
   }
   
   .footer-navWrap{
      width: 100%;
   }
   
   .footer-navList{
      margin-top: 11%;
      width: 100%;
      display: flex;
      flex-wrap: wrap;
   }
   
   .footer-navListitem{
      box-sizing: border-box;
      width: 50%;
   }

   .footer-navListitem:last-of-type{
      width: 100%;
   }

   .footer-navListitem:last-of-type{
      padding-top: 5%;
   }
   
   .footer-navListitem:first-of-type{
      margin-left: 0;
   }
   
   .footer-navListitem h3{
      font-size: 1.5rem;
      font-size: 4vw;
      padding-bottom: .75em;
   }
   
   .footer-navListitem:last-of-type ul{
      display: flex;
      justify-content: space-between;
   }

   .footer-navListitem:last-of-type ul li{
      width: 50%;
   }

   .footer-navListitem ul li a,.footer-navListitem ul li p{
      font-size: 1.2rem;
      font-size: 3.2vw;
      margin-bottom: 1.2em;
   }

   .footer-navListitem ul li a{
      letter-spacing: 0.15em;
   }

   .footer-navListitem:last-of-type ul li a{
      line-height: 1.8;
   }
   
   .footer-navListitem ul li p{
      line-height: 1.8;
      letter-spacing: 0.05em;
   }


   
   
   .footer-others{
      text-align: center;
      padding-top: 10.5%;
   }
   
   .copyright{
      text-align: center;
      display: block;
      font-size: 1rem;
      font-size: 2.6vw;
      margin-left: 0;
   }
   /* -----------------------
   * footer
   ------------------------- */

}