@charset "UTF-8";

footer{
  color: #000000;
  font-family: 'Open Sans', 'Noto Sans JP', "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "メイリオ", "游ゴシック", "Yu Gothic", Meiryo, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-weight: 400;
  -webkit-font-feature-settings: "palt";
  letter-spacing: 0.1rem;
}

footer div, footer span, footer applet, footer object, footer iframe, footer h1, footer h2, footer h3, footer h4, footer h5, footer h6, footer p, footer blockquote, footer pre, footer a, footer abbr, footer acronym, footer address, footer big, footer cite, footer code, footer del, footer dfn, footer em, footer img, footer ins, footer kbd, footer q, footer s, footer samp, footer small, footer strike, footer strong, footer sub, footer sup, footer tt, footer var, footer b, footer u, footer i, footer center, footer dl, footer dt, footer dd, footer ol, footer ul, footer li, footer fieldset, footer form, footer label, footer legend, footer table, footer caption, footer tbody, footer tfoot, footer thead, footer tr, footer th, footer td, footer article, footer aside, footer canvas, footer details, footer embed, footer figure, footer figcaption, footer hgroup, footer menu, footer nav, footer output, footer ruby, footer section, footer summary, footer time, footer mark, footer audio, footer video{
  font-family: 'Open Sans', 'Noto Sans JP', "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "メイリオ", "游ゴシック", "Yu Gothic", Meiryo, sans-serif;
}

footer .inner{
  padding: 0;
}

footer .inner::before,
footer .inner::after{
  display: none !important;
}

body footer a {
  text-decoration: none;
  color: #000000;
  -webkit-transition: opacity .3s linear;
  transition: opacity .3s linear;
}

body footer a:link {
  text-decoration: none;
  color: #000000;
}

body footer a:visited {
  text-decoration: none;
  color: #000000;
}

body footer a:hover {
  text-decoration: none;
  color: inherit;
  opacity: 0.8;
}


@media screen and (min-width : 768px){

  footer .inner{
    width: auto;
    max-width: 90%;
    font-size: 0;
  }
  footer .footer-wrap.gray .inner{
    display: -webkit-flex;
    display:-ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }
  footer .footer-wrap.white .inner{
    display: -webkit-flex;
    display:-ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }

  .footer-wrap.gray{
    background-color: #F4F4F4;
    padding: 30px 0;
  }
  .footer-wrap.white{
    background-color: #ffffff;
    padding: 16px 0 11px 0;
  }

  .footer-list{
    display: -webkit-flex;
    display:-ms-flexbox;
    display: flex;
  }

  .footer-list li{
    line-height: 1;
    }
    .footer-list li:nth-of-type(n+2){
      margin: 0 0 0 30px;
    }
    .footer-wrap.gray .footer-list li{
      font-size: 0.875rem;
    }
    .footer-wrap.white .footer-list li{
      font-size: 0.75rem;
    }

  .footer-sns{
    display: -webkit-flex;
    display:-ms-flexbox;
    display: flex;
    font-size: 0.875rem;
  }

  .footer-sns a{
    display: -webkit-flex;
    display:-ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }

  .footer-sns a .link-arrow{
    padding: 0.5em 0;
    line-height: 1;
  }

  .footer-sns-list{
    width: 200px;
    margin: 0 0 0 20px;
    display: -webkit-flex;
    display:-ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 0;
  }
  .footer-sns-list li{
    width: 15%;
  }
  .footer-sns-list li img{
    width: 100%;
  }

  .footer-copy{
    margin: 20px 0 0 0;
    display: -webkit-flex;
    display:-ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }

  .footer-copy small{
    font-size: 0.625rem;
    letter-spacing: 0.05rem;
  }

  .footer-recycle{
    margin: 0 0 0 14px;
  }

  .footer-logo{
    width: 200px;
    margin: 0 -12px 0 0;
  }
  .footer-logo img{
    width: 100%;
  }

}@media screen and (max-width : 767px){

  footer .inner{
    width: 100%;
    max-width: 100%;
  }
  footer .footer-wrap.gray .inner{
  }
  footer .footer-wrap.white .inner{
    display: -webkit-flex;
    display:-ms-flexbox;
    display: flex;
  }

  .footer-wrap.gray{
    background-color: #F4F4F4;
  }
  .footer-wrap.white{
    padding: 5vw 0 4.27vw 0;
  }

  .footer-wrap.gray .footer-list{
    /*border-top: 1px solid #8F8F8F;*/
  }

  .footer-wrap.white .footer-list{
    width: 90%;
    margin: auto;
    display: -webkit-flex;
    display:-ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }

  .footer-list li{
    line-height: 1;
    }
    .footer-wrap.white .footer-list li:nth-of-type(odd){
      width: 33.3vw;
    }
    .footer-wrap.white .footer-list li:nth-of-type(even){
      margin: 0 0 0 0;
    }
    .footer-wrap.white .footer-list li{
      font-size: 3.2vw;
      margin: 0 0 6vw 0;
    }


  .footer-wrap.gray .footer-list li a{
    display: inline-block;
    vertical-align: top;
    font-size: 3.47vw;
    line-height: 1;
    padding: 6vw 5vw;
    width: 100%;
    box-sizing: border-box;
    position: relative;
  }
  .footer-sns .link-arrow{
    display: inline-block;
    vertical-align: top;
    font-size: 3.47vw;
    line-height: 1;
    width: 100%;
    box-sizing: border-box;
    position: relative;
  }

  .footer-wrap.gray .footer-list li a.link-arrow::after,
  .footer-sns .link-arrow::after{
    position: absolute;
    top: 0; right: 5vw; bottom: 0;
    margin: auto;
  }

  .footer-sns{
    padding: 6vw 0 5vw 5vw;
  }

  .footer-sns-list{
    width: 60vw;
    margin: 3vw 0 0 0;
    display: -webkit-flex;
    display:-ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }
  .footer-sns-list li{
    width: 15%;
  }
  .footer-sns-list li img{
    width: 100%;
  }

  .footer-group{
    width: 100%;
  }

  .footer-copy{
    display: -webkit-flex;
    display:-ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }

  .footer-copy small{
    font-size: 2.2vw;
    font-weight: 500;
    text-align: center;
    letter-spacing: 0.1vw;
  }
  .footer-recycle{
    margin: 2.5vw 0;
    text-align: center;
  }
  .footer-recycle img{
    width: 29.6vw;
    margin: 0 auto;
  }

  .footer-logo.sp{
    padding: 4vw 0 0 0;
    border-top: 1px solid #8F8F8F;
    text-align: center;
  }
  .footer-logo.sp img{
    display: inline-block;
    vertical-align: top;
    width: 48vw;
    margin: 0 auto;
  }


}


@media screen and (min-width : 768px) and (max-width : 1279px){
  footer .footer-wrap.gray .inner{
    display: block;
  }

  .footer-sns{
    margin: 24px 0 0 0;
  }

  .footer-list li:nth-of-type(n+2){
    margin: 0 0 0 18px;
  }

  .footer-logo{
    width: 160px;
  }

}