@charset "UTF-8";
/*
====>> サイトの基準値になる値を持つファイル <<====

・このファイルはベースのスタイルになるので、原則オーバーライド(上書き)はしない事
・幅の値等をここに記載
・ただし、基本設定に加えてサイトに応じて新たなプロパティ追加が必要な場合はここに記述する

*/
/*		基本設定：幅
-----------------------------------------------------*/
:root {
  --w-liquid: 100%;
  --w-solid-base: 1200px;
  --w-solid-wide: 1680px;
  --w-solid-short: 980px;
}

@media screen and (max-width: 767px) {
  :root {
    --w-liquid: 92%;
    --w-solid-base: 92%;
    --w-solid-wide: 92%;
    --w-solid-short: 92%;
  }
}
/*  END Break Point  */
/*		基本設定：フォント
-----------------------------------------------------*/
/*		基本設定：カラー
-----------------------------------------------------*/
:root {
  --brown: #504226;
  --orange: #ea885d;
  --yellow: #fcffcc;
}

/*		新規追加設定：カラー
-----------------------------------------------------*/
/*		新規追加設定：フォント
-----------------------------------------------------*/
/*
====>> サイトのレイアウトに関わるデフォルトスタイリング <<====

・このファイルはベースのスタイルになるので、原則オーバーライド(上書き)はしない事
・共通パーツの大まかレイアウトやサイトの幅に関するスタイルを格納

*/
/*		コンテンツタイプと幅
-----------------------------------------------------*/
.l-wrapper {
  width: 100%;
  max-width: 100%;
  max-width: 100vw;
  max-width: 100dvw;
  overflow: hidden;
}

.l-container {
  width: var(--w-liquid);
  max-width: var(--w-solid-base);
  margin: 0 auto;
}
@media screen and (min-width: 768px) {
  .l-container {
    padding: 0 20px;
  }
}
.l-container > .l-inner {
  width: 100%;
  max-width: var(--w-solid-short);
  margin: 0 auto;
  padding: 0 20px;
}
.l-container.--wide {
  width: var(--w-liquid);
  max-width: var(--w-solid-wide);
  margin: auto;
}
@media screen and (min-width: 768px) {
  .l-container.--wide {
    padding: 0 20px;
  }
}
.l-container.--wide > .l-inner {
  width: 100%;
  max-width: var(--w-solid-short);
  margin: 0 auto;
  padding: 0 20px;
}

@media screen and (max-width: 767px) {
  .l-container {
    padding: 0;
  }
  .l-container > .l-inner {
    width: 100%;
    margin: 0;
    padding: 0;
  }
  .l-container.--wide {
    padding: 0;
  }
  .l-container.--wide > .l-inner {
    width: 100%;
    margin: 0;
    padding: 0;
  }
}
.l-inner {
  max-width: var(--w-solid-wide);
  margin: auto;
}

/*
====>> 再利用可能なパーツのデフォルトスタイリング <<====

・このファイルはベースのスタイルになるので、原則オーバーライド(上書き)はしない事
・タグに依存しないベースのコンポーネントパーツ
・単体、あるいはパーツ単位で独立した仕様のスタイル

*/
/*		見出し
-----------------------------------------------------*/
.c-heading {
  display: block;
  color: var(--brown, #504226);
  font-size: 32px;
  font-style: normal;
  font-weight: 700;
  line-height: 2;
  margin-bottom: 50px;
}
@media screen and (max-width: 767px) {
  .c-heading {
    font-size: 20px;
    margin-bottom: 30px;
  }
}
.c-heading--en {
  color: var(--brown, #504226);
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
  font-size: 88px;
  font-size: clamp(4.2rem, 5.5vw, 8.8rem);
  line-height: 1.1;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
@media screen and (max-width: 767px) {
  .c-heading--en {
    font-size: 32px;
  }
}
.c-heading--jp {
  color: var(--brown, #504226);
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: 1.1;
  margin-top: 10px;
}
@media screen and (max-width: 767px) {
  .c-heading--jp {
    font-size: 20px;
  }
}

/*		リスト
-----------------------------------------------------*/
ul.c-list_plain > li {
  position: relative;
  padding-left: 1.3em;
}
ul.c-list_plain > li::before {
  content: "・";
  position: absolute;
  left: 0;
  font-size: inherit;
}

/*		ボタン
-----------------------------------------------------*/
.c-btn_wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 20px 5%;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.c-btn {
  position: relative;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 0.5em;
  color: #fff;
  text-align: center;
  font-family: "Noto Sans JP";
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  background: var(--orange);
  border: 2px solid var(--orange);
  border-radius: 100px;
  padding: 16px 70px;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
@media screen and (min-width: 768px) {
  .c-btn {
    min-width: 420px;
    min-height: 70px;
  }
}
@media screen and (max-width: 767px) {
  .c-btn {
    display: block;
    width: 100%;
    font-size: 16px;
    padding: 12px 60px;
    margin-inline: auto;
  }
}
.c-btn ::-webkit-file-upload-button {
  inline-size: -webkit-fit-content;
  inline-size: fit-content;
  touch-action: manipulation;
  -webkit-user-select: none;
          user-select: none;
}
.c-btn ::file-selector-button {
  inline-size: -webkit-fit-content;
  inline-size: -moz-fit-content;
  inline-size: fit-content;
  -ms-touch-action: manipulation;
      touch-action: manipulation;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.c-btn::after {
  content: "";
  display: inline-block;
  width: 1.5em;
  height: 1.5em;
  position: absolute;
  top: 50%;
  right: 8%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  -webkit-mask-image: url("../img/icon_paws.svg");
  mask-image: url("../img/icon_paws.svg");
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: 100% auto;
  mask-size: 100% auto;
  background-color: #fff;
  line-height: 0;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
@media screen and (max-width: 767px) {
  .c-btn::after {
    right: 20px;
  }
}
@media (hover: hover) {
  .c-btn:hover {
    background-color: #fff;
    opacity: 1;
    color: var(--orange);
    text-decoration: none;
  }
  .c-btn:hover::after {
    background-color: var(--orange);
  }
}

/*		ユニットコンテンツ
-----------------------------------------------------*/
.c-unit {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-flow: row wrap;
          flex-flow: row wrap;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 40px 4%;
}
@media screen and (max-width: 767px) {
  .c-unit {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
.c-unit > * {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.c-unit + .c-unit {
  margin-top: 30px;
}
.c-unit.is-reverse {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
}
@media screen and (max-width: 767px) {
  .c-unit.is-reverse {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}

.c-link_map {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.2em;
  color: var(--orange);
  text-decoration: none;
  overflow: hidden;
  position: relative;
  padding: 5px;
  margin-left: auto;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.c-link_map::before {
  content: "";
  -ms-flex-negative: 0;
      flex-shrink: 0;
  display: inline-block;
  width: 1.5em;
  height: 1.5em;
  -webkit-mask-image: url("../img/icon_pin.svg");
  mask-image: url("../img/icon_pin.svg");
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: 100% auto;
  mask-size: 100% auto;
  background-color: currentColor;
  line-height: 0;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  -webkit-transition: -webkit-transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  transition: -webkit-transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
.c-link_map::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: currentColor;
  -webkit-perspective: 500px;
          perspective: 500px;
}
@media (hover: hover) {
  .c-link_map:hover {
    color: #ffb899;
  }
  .c-link_map:hover::before {
    -webkit-animation: coin-flip-bounce 0.6s ease-in-out;
            animation: coin-flip-bounce 0.6s ease-in-out;
  }
}

@-webkit-keyframes coin-flip-bounce {
  0% {
    -webkit-transform: translateY(0) rotateY(0);
            transform: translateY(0) rotateY(0);
  }
  50% {
    /* 空中で半分（180度）回転し、上に跳ねる */
    -webkit-transform: translateY(-5px) rotateY(180deg);
            transform: translateY(-5px) rotateY(180deg);
  }
  100% {
    /* 元の位置に戻りながら、1回転（360度）完了 */
    -webkit-transform: translateY(0) rotateY(360deg);
            transform: translateY(0) rotateY(360deg);
  }
}

@keyframes coin-flip-bounce {
  0% {
    -webkit-transform: translateY(0) rotateY(0);
            transform: translateY(0) rotateY(0);
  }
  50% {
    /* 空中で半分（180度）回転し、上に跳ねる */
    -webkit-transform: translateY(-5px) rotateY(180deg);
            transform: translateY(-5px) rotateY(180deg);
  }
  100% {
    /* 元の位置に戻りながら、1回転（360度）完了 */
    -webkit-transform: translateY(0) rotateY(360deg);
            transform: translateY(0) rotateY(360deg);
  }
}
/*
====>> サイトの共通パーツに関するデフォルトスタイリング <<====

・このファイルはベースのスタイルに加え、サイト(案件)毎にスタイルを記述していく
・ヘッダー、ナビゲーション、フッター、パンくずなどの各ページに対して1つのパーツをスタイルするファイル

*/
/*		独自追加
-----------------------------------------------------*/
:root {
  --base-sans-serif:
    "Noto Sans JP", "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "Hiragino Sans", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo,
    sans-serif;
  /* --mplus-font: MPLUSRounded-bold-subset, sans-serif; */
}

/* @font-face {
  font-family: "MPLUSRounded-bold-subset";
  font-style: normal;
  font-weight: 700;
  src: url("../fonts/MPLUSRounded-bold-subset.woff2") format("woff2"), url("../fonts/MPLUSRounded-bold-subset.woff") format("woff"), url("../fonts/MPLUSRounded-bold-subset.ttf") format("truetype");
} */
/* .font-mplus {
  font-family: var(--mplus-font);
  transform: var(--Jaggy-clear);
  font-weight: bold;
} */
.noto-sans-jp {
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: normal;
  font-style: normal;
}

.montserrat {
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
}

@media screen and (max-width: 767px) {
  .is-pc {
    display: none !important;
  }
}
@media screen and (min-width: 768px) {
  .is-sp {
    display: none !important;
  }
}
@media screen and (min-width: 1024px) {
  .is-tb {
    display: none !important;
  }
}
@media screen and (min-width: 768px) {
  a[href^="tel:"] {
    pointer-events: none;
  }
}
.u-inline-block {
  display: inline-block;
}

.u-text-right {
  text-align: right;
}

.u-text-center {
  text-align: center;
}

[data-scroll] {
  will-change: transform, opacity;
}

[data-scroll=fadeIn] {
  opacity: 0;
}

[data-scroll=fadeInUp] {
  opacity: 0;
  -webkit-transform: translateY(50px);
          transform: translateY(50px);
}

[data-scroll=fadeInDown] {
  opacity: 0;
  -webkit-transform: translateY(-50px);
          transform: translateY(-50px);
}

[data-scroll=fadeInLeft] {
  opacity: 0;
  -webkit-transform: translateX(-50px);
          transform: translateX(-50px);
}

[data-scroll=fadeInRight] {
  opacity: 0;
  -webkit-transform: translateX(50px);
          transform: translateX(50px);
}

[data-scroll=scaleUp] {
  opacity: 0;
  -webkit-transform: scale(0.8);
          transform: scale(0.8);
}

[data-scroll].is-show {
  opacity: 1;
  -webkit-transform: translate(0, 0) scale(1) rotate(0deg);
          transform: translate(0, 0) scale(1) rotate(0deg);
  -webkit-transition: opacity 0.5s ease-in-out, -webkit-transform 0.5s ease-in-out;
  transition: opacity 0.5s ease-in-out, -webkit-transform 0.5s ease-in-out;
  transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out;
  transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out, -webkit-transform 0.5s ease-in-out;
}

[data-scroll=scaleDown] {
  opacity: 0;
  -webkit-transform: scale(1.2);
          transform: scale(1.2);
}

[data-scroll=zoomDown] {
  visibility: hidden;
  opacity: 0;
  -webkit-transform: scale(1.12);
          transform: scale(1.12);
  -webkit-filter: blur(12px);
          filter: blur(12px);
  will-change: transform, filter, opacity;
}
[data-scroll=zoomDown].is-show {
  visibility: visible;
  -webkit-transition: unset;
  transition: unset;
  -webkit-animation: zoomDownBlur 700ms cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
          animation: zoomDownBlur 700ms cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
}

[data-scroll=textUp] {
  display: block;
  overflow: hidden;
}
[data-scroll=textUp] > span {
  display: inline-block;
  line-height: 1.5;
  line-height: 1.8;
  visibility: hidden;
  overflow: hidden;
  -webkit-transform: translateY(100%);
          transform: translateY(100%);
  opacity: 0;
}
[data-scroll=textUp].is-show > span {
  visibility: visible;
  will-change: transform, opacity;
  -webkit-animation: showTextFromBottom 0.6s both paused;
          animation: showTextFromBottom 0.6s both paused;
  -webkit-animation-play-state: running;
          animation-play-state: running; /* inline の animation-delay が効く */
}

[data-scroll=rotate] {
  opacity: 0;
  -webkit-transform: rotate(-10deg);
          transform: rotate(-10deg);
}

[data-scroll=textIn] {
  -webkit-transform: translateY(clamp(0px, -7%, -300px)) scale(1.2);
          transform: translateY(clamp(0px, -7%, -300px)) scale(1.2);
  opacity: 0;
  -webkit-filter: blur(3px);
          filter: blur(3px);
}
[data-scroll=textIn].is-show {
  opacity: 1;
  -webkit-transform: translateY(0) scale(1);
          transform: translateY(0) scale(1);
  -webkit-filter: blur(0);
          filter: blur(0);
  -webkit-transition: opacity 0.26s ease-out, -webkit-transform 0.26s ease-out, -webkit-filter 0.26s ease-out;
  transition: opacity 0.26s ease-out, -webkit-transform 0.26s ease-out, -webkit-filter 0.26s ease-out;
  transition: transform 0.26s ease-out, opacity 0.26s ease-out, filter 0.26s ease-out;
  transition: transform 0.26s ease-out, opacity 0.26s ease-out, filter 0.26s ease-out, -webkit-transform 0.26s ease-out, -webkit-filter 0.26s ease-out;
}

[data-scroll=split] {
  overflow: hidden;
}
[data-scroll=split] > span {
  -webkit-transform: scale(2);
          transform: scale(2);
  opacity: 0;
  display: inline-block;
}
[data-scroll=split].is-show > span {
  -webkit-animation: textZoomIn 1s ease-out forwards;
          animation: textZoomIn 1s ease-out forwards;
}

.is-hidden {
  opacity: 0;
  pointer-events: none;
  -webkit-transition: opacity 0.2s ease;
  transition: opacity 0.2s ease;
}

/*
====>> サイト(案件)毎にスタイルを記述していくファイル <<====

・このファイルはサイト(案件)独自のスタイルを記述するファイル
・ここに記述するファイルは、接頭辞に「p-」を付けたセレクタにする事　/　例：「.p-project-item」

*/
/*		TOPページ
-----------------------------------------------------*/
main {
  max-width: 100%;
  overflow: hidden;
}

.p-dogfes-wrap {
  font-family: var(--base-sans-serif);
  color: #000;
  font-style: normal;
  font-weight: 400;
  line-height: 2;
  background: #fffdeb;
}

.p-dogfes-hero {
  width: 100%;
  position: relative;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  padding: 0;
  margin: 0;
}
.p-dogfes-hero img {
  width: 100%;
  height: auto;
  vertical-align: bottom;
}

.p-dogfes-about {
  padding: 200px 0 245px;
}
@media screen and (max-width: 767px) {
  .p-dogfes-about {
    padding: 50px 0 80px;
  }
}
.p-dogfes-about .c-unit {
  gap: 60px 8%;
}
@media screen and (max-width: 767px) {
  .p-dogfes-about .c-unit {
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    gap: 0;
  }
}
.p-dogfes-about__content {
  position: relative;
  z-index: 2;
}
@media screen and (min-width: 768px) {
  .p-dogfes-about__content::after {
    content: "";
    display: inline-block;
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: -1;
    max-width: 157px;
    width: 20%;
    aspect-ratio: 157/100;
    pointer-events: none;
    background: url(../img/deco_paws_02.svg) no-repeat center center/cover;
  }
}
@media screen and (max-width: 767px) {
  .p-dogfes-about__content {
    display: contents;
  }
}
.p-dogfes-about__content .c-heading--en {
  position: relative;
  z-index: 2;
  padding-left: 0.4em;
}
@media screen and (max-width: 767px) {
  .p-dogfes-about__content .c-heading--en {
    margin-bottom: 10px;
  }
}
.p-dogfes-about__content .c-heading--en::before {
  content: "";
  display: inline-block;
  position: absolute;
  bottom: 82%;
  left: 0;
  z-index: -1;
  max-width: 172px;
  width: 2em;
  aspect-ratio: 172/100;
  pointer-events: none;
  background: url(../img/deco_paws_01.svg) no-repeat center center/cover;
}
.p-dogfes-about__content p {
  font-size: 18px;
}
@media screen and (max-width: 833px) {
  .p-dogfes-about__content p {
    font-size: 16px;
  }
}
@media screen and (max-width: 767px) {
  .p-dogfes-about__content p {
    font-size: 14px;
  }
}
.p-dogfes-about__content p + p {
  margin-top: 2em;
}
.p-dogfes-about__visual {
  max-width: 695px;
  position: relative;
}
@media screen and (max-width: 767px) {
  .p-dogfes-about__visual {
    -webkit-box-ordinal-group: 5;
        -ms-flex-order: 4;
            order: 4;
    margin-top: 30px;
  }
}
.p-dogfes-about__visual--close {
  display: none;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 2;
  max-width: 100%;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  color: #ff5d17;
  font-size: 42px;
  font-size: clamp(2rem, 2.625vw, 4.2rem);
  font-style: normal;
  font-weight: 700;
  text-align: center;
  -webkit-transform: rotate(7.534deg) translate(-52%, -50%);
          transform: rotate(7.534deg) translate(-52%, -50%);
  padding: 10px 50px;
  background: #fff;
  -webkit-box-shadow: 4px 4px 10px 0 rgba(0, 0, 0, 0.15);
          box-shadow: 4px 4px 10px 0 rgba(0, 0, 0, 0.15);
  pointer-events: none;
}
@media screen and (max-width: 767px) {
  .p-dogfes-about__visual--close {
    font-size: 18px;
    font-size: clamp(1.6rem, 4.6153846154vw, 1.8rem);
    padding: 10px 20px;
  }
}
.p-dogfes-about__visual--close.is-show {
  display: inline-block;
}
.p-dogfes-about__heading {
  color: var(--brown);
  font-size: 42px;
  font-size: clamp(2rem, 2.625vw, 4.2rem);
  font-weight: 700;
  margin-bottom: 50px;
}
@media screen and (max-width: 767px) {
  .p-dogfes-about__heading {
    font-size: 20px;
    margin-bottom: 30px;
  }
}
.p-dogfes-about__btn {
  width: 100%;
  margin-top: 70px;
}
@media screen and (max-width: 767px) {
  .p-dogfes-about__btn {
    -webkit-box-ordinal-group: 6;
        -ms-flex-order: 5;
            order: 5;
    margin-top: 40px;
  }
}

.p-dogfes-event {
  position: relative;
  padding: 120px 0;
  background-color: var(--yellow);
  border-radius: 100px 100px 0 0;
}
@media screen and (max-width: 767px) {
  .p-dogfes-event {
    border-radius: 40px 40px 0 0;
    padding: 60px 0;
  }
}
.p-dogfes-event .c-heading {
  text-align: left;
}
.p-dogfes-event__deco {
  position: absolute;
  top: 0;
  right: 10%;
  z-index: 1;
  -webkit-transform: translateY(-25%);
          transform: translateY(-25%);
  max-width: 387px;
  width: 20%;
  pointer-events: none;
  -webkit-animation: float-rotate-2d 3s ease-in-out infinite;
          animation: float-rotate-2d 3s ease-in-out infinite;
  -webkit-transform-origin: center bottom;
          transform-origin: center bottom;
}
@media screen and (max-width: 767px) {
  .p-dogfes-event__deco {
    max-width: 150px;
    width: 40%;
    top: -30px;
    right: 5%;
  }
}
@-webkit-keyframes float-rotate-2d {
  0% {
    -webkit-transform: translateY(-25%) rotate(0deg);
            transform: translateY(-25%) rotate(0deg);
  }
  50% {
    -webkit-transform: translateY(-27%) rotate(5deg);
            transform: translateY(-27%) rotate(5deg);
  }
  100% {
    -webkit-transform: translateY(-25%) rotate(0deg);
            transform: translateY(-25%) rotate(0deg);
  }
}
@keyframes float-rotate-2d {
  0% {
    -webkit-transform: translateY(-25%) rotate(0deg);
            transform: translateY(-25%) rotate(0deg);
  }
  50% {
    -webkit-transform: translateY(-27%) rotate(5deg);
            transform: translateY(-27%) rotate(5deg);
  }
  100% {
    -webkit-transform: translateY(-25%) rotate(0deg);
            transform: translateY(-25%) rotate(0deg);
  }
}
.p-dogfes-event .l-container {
  position: relative;
  z-index: 2;
}
.p-dogfes-event__content {
  background-color: #fff;
  border-radius: 40px;
  padding: 80px 20px;
}
@media screen and (max-width: 767px) {
  .p-dogfes-event__content {
    border-radius: 20px;
    padding: 10px 20px 40px;
  }
}
.p-dogfes-event__address {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
.p-dogfes-event__address p + p {
  margin-top: 1em;
}
.p-dogfes-event__list {
  max-width: 940px;
  width: 100%;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .p-dogfes-event__list {
    display: block;
  }
  .p-dogfes-event__list tbody {
    display: block;
    width: 100%;
  }
}
.p-dogfes-event__list tr {
  background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, #919191), color-stop(0%, rgba(255, 255, 255, 0)));
  background-image: linear-gradient(to right, #919191 50%, rgba(255, 255, 255, 0) 0%);
  background-position: bottom;
  background-size: 8px 2px; /* 横幅(破線の間隔) 縦幅(線の太さ) */
  background-repeat: repeat-x;
  padding-bottom: 2px; /* 文字と線の距離 */
}
@media screen and (max-width: 767px) {
  .p-dogfes-event__list tr {
    display: block;
    width: 100%;
  }
}
.p-dogfes-event__list th,
.p-dogfes-event__list td {
  color: var(--brown, #504226);
  padding-block: 30px 16px;
}
@media screen and (max-width: 767px) {
  .p-dogfes-event__list th,
  .p-dogfes-event__list td {
    display: block;
    width: 100%;
  }
}
.p-dogfes-event__list th {
  min-width: 280px;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.5;
  vertical-align: middle;
  padding-right: 20px;
}
@media screen and (max-width: 767px) {
  .p-dogfes-event__list th {
    font-size: 16px;
    padding-block: 24px 8px;
  }
}
.p-dogfes-event__list th span {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5em;
}
.p-dogfes-event__list th span::before {
  content: "";
  display: inline-block;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  width: 1.2em;
  height: 1.2em;
  -webkit-mask-image: url("../img/icon_paws.svg");
  mask-image: url("../img/icon_paws.svg");
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: 100% auto;
  mask-size: 100% auto;
  background-color: var(--orange);
  -webkit-transform: scale(-1, 1) rotate(17deg);
          transform: scale(-1, 1) rotate(17deg);
}
@media screen and (max-width: 767px) {
  .p-dogfes-event__list td {
    padding-top: 0;
  }
}

.p-dogfes-gallery {
  padding: 127px 0 238px;
}
@media screen and (max-width: 767px) {
  .p-dogfes-gallery {
    padding: 60px 0;
  }
}
.p-dogfes-gallery .c-heading {
  text-align: center;
}
.p-dogfes-gallery__list {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  grid-auto-rows: auto;
  grid-gap: 58px;
  margin: 65px auto 0;
  overflow: hidden;
}
@media screen and (max-width: 767px) {
  .p-dogfes-gallery__list {
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    grid-gap: 20px;
    margin-top: 40px;
  }
}
.p-dogfes-gallery__item {
  text-align: center;
}
.p-dogfes-gallery__item img {
  -o-object-fit: contain;
     object-fit: contain;
  width: 100%;
  height: 100%;
  border-radius: 40px;
}
@media screen and (max-width: 767px) {
  .p-dogfes-gallery__item img {
    border-radius: 20px;
  }
}