@charset "UTF-8";
/* Footer */
footer {
  /* wrapper（反転専用） */
  /* 波本体（揺れ・マスク専用） */
  /* 横に流す（mask-positionを動かす） */
  /* 上下にゆらゆら（本体を動かす） */ }
  footer .infoArea {
    text-align: center;
    background-color: #3A310E;
    color: #FFF;
    background-image: url("../images/bg_img.png");
    position: relative;
    z-index: 1; }
    footer .infoArea .inBox {
      width: 90%;
      max-width: 1100px;
      padding: 50px 0;
      margin: 0 auto;
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      align-items: center; }
      @media screen and (max-width: 768px) {
        footer .infoArea .inBox {
          padding: 40px 0; } }
      @media screen and (max-width: 480px) {
        footer .infoArea .inBox {
          padding: 30px 0; } }
      footer .infoArea .inBox .f-info {
        width: 48%;
        margin: 0 auto;
        text-align: left; }
        @media screen and (max-width: 768px) {
          footer .infoArea .inBox .f-info {
            width: 100%; } }
        footer .infoArea .inBox .f-info .indent5em {
          text-indent: -5em;
          padding-left: 5em; }
        footer .infoArea .inBox .f-info figure {
          width: 260px;
          margin-bottom: 1em; }
          @media screen and (max-width: 1100px) {
            footer .infoArea .inBox .f-info figure {
              width: 220px; } }
          @media screen and (max-width: 768px) {
            footer .infoArea .inBox .f-info figure {
              width: 200px; } }
          @media screen and (max-width: 480px) {
            footer .infoArea .inBox .f-info figure {
              width: 180px; } }
        footer .infoArea .inBox .f-info a {
          color: #FFF; }
        footer .infoArea .inBox .f-info .s-font {
          font-size: 0.8em; }
        footer .infoArea .inBox .f-info .b-font {
          font-size: 1.4em; }
      footer .infoArea .inBox .map {
        width: 46%; }
        @media screen and (max-width: 768px) {
          footer .infoArea .inBox .map {
            width: 100%;
            margin-top: 30px; } }
        footer .infoArea .inBox .map img {
          border-radius: 15px; }
      footer .infoArea .inBox .parking {
        margin-top: 10px;
        width: 80%;
        box-sizing: border-box;
        border: 2px solid #FFF;
        text-align: center;
        padding: 8px 1em;
        font-size: clamp(20px, 18px + 0.5vw, 24px);
        font-weight: 600; }
        @media screen and (max-width: 768px) {
          footer .infoArea .inBox .parking {
            width: 100%; } }
        footer .infoArea .inBox .parking span {
          font-size: 1.4em;
          color: #fff500; }
  footer .waveMaskWrap {
    width: 100%;
    height: 120px;
    overflow: hidden;
    line-height: 0;
    font-size: 0; }
  footer .waveTop {
    transform: scaleY(-1); }
  footer .waveBottom {
    transform: none; }
  footer .waveMask {
    width: 100%;
    height: 120px;
    background-color: #3A310E;
    background-image: url("../images/bg_img.png");
    background-repeat: repeat;
    -webkit-mask-image: url("../images/wave.svg");
    -webkit-mask-repeat: repeat-x;
    -webkit-mask-size: 1440px 120px;
    -webkit-mask-position: 0 0;
    mask-image: url("../images/wave.svg");
    mask-repeat: repeat-x;
    mask-size: 1440px 120px;
    mask-position: 0 0;
    /* 横＋上下の動き（transformはここで使ってOK） */
    animation: waveMaskMove 10s linear infinite, waveMaskFloat 4.8s ease-in-out infinite; }
  footer .waveMask {
    -webkit-mask-type: luminance;
    mask-type: luminance; }
@keyframes waveMaskMove {
  0% {
    -webkit-mask-position: 0 0;
    mask-position: 0 0; }
  100% {
    -webkit-mask-position: -1440px 0;
    mask-position: -1440px 0; } }
@keyframes waveMaskFloat {
  0% {
    transform: translateY(0); }
  50% {
    transform: translateY(10px); }
  100% {
    transform: translateY(0); } }
  footer .copyR {
    text-align: center;
    font-size: clamp(12px, 11px + 0.2vw, 14px);
    line-height: 1.6;
    padding: 10px 0;
    letter-spacing: 0.03em;
    opacity: 0.85; }
