/* 基本スタイル */
@font-face {
  font-family: 'RocknRollOne';
  src: url('/fonts/RocknRollOne-Regular.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "Kaisei Opti";
  src: url("/fonts/KaiseiOpti-Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}


.wrap {
    position: relative;
    padding: 0px 0 0px 0 !important;
    min-height: 45vh;
    overflow: visible;
    width: 90%;
    margin: auto;

}


html {
  scroll-behavior: smooth;
}




.pff-hero-section,
.pff-about-section {
    overflow: hidden;
}

/* 固定ヘッダーの高さが例えば 80px の場合 */
section[id] { /* IDを持つ全てのセクションに適用 */
    scroll-margin-top: 80px; /* ヘッダーの高さ分をオフセット */
    /* max-width: 900px; */
}


#main-content {
    display: block; /* 初期状態から表示 */
    /* opacity: 0; と transition: opacity 1s ease-in; は削除 */
    /* #main-content.visible も不要になる */
    /* text-align: center; */
    width: 100%;
}
















body {
    font-family: 'Inter', sans-serif;
    color: #333;
    margin: 0;
    padding: 0;
    line-height: 1.5; /* Default line height for better readability */
}







/* アプリ全体を覆うラッパー */
.pff-app-wrapper {
    /* display: flex; */
    /* flex-direction: column; */
    /* min-height: 100vh; */
     /* 背景色 */
     /* 格子の大きさ */
     /* 格子の位置 */
     /* 高さを画面いっぱいに設定 */
     /* 背景色 */
    
     /* 格子の大きさ */
     /* 格子の位置 */
     /* 格子を少し大きく */
     /* 高さを画面いっぱいに設定 */
     /* 背景色 */
    
     /* 格子の大きさ */
     /* 格子の位置 */
    /* background-color: #ffffff; */ /* 背景色 */
    /* background-image: 
    linear-gradient(90deg, #e0e0e0 1px, transparent 1px), 
    linear-gradient(180deg, #e0e0e0 1px, transparent 1px); */ /* 縦線 */
    /* background-size: 30px 30px; */ /* 格子の大きさ */
    /* background-position: 0 0, 0 0; */ /* 格子の位置（最初は左上） */
    /* background-attachment: fixed; */
    /* width: 100%; */
}

/* コンテナ共通スタイル */
.pff-section-container {
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
    /* padding-left: 1rem; */ /* px-4 */
    /* padding-right: 1rem; */ /* px-4 */
    padding-top: 2rem;
    width: 90%;
}

/* セクション見出し共通スタイル */
.pff-section-heading {
    font-size: 2.2rem; /* text-3xl */
    font-weight: 800; /* font-extrabold */
    text-align: center; /* text-center */
    margin-bottom: 3rem; /* mb-8 */
    color: #1F2937; /* gray-800 */
    font-weight: bold;
}

/* スクロールバーのスタイル（非表示） */
.no-scrollbar::-webkit-scrollbar {
    display: none;
}
.no-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}





.pff-error-message {
    text-align: center;
    color: #EF4444; /* red-500 */
    margin-top: 1rem; /* mt-4 */
}
.pff-news-no-items {
    text-align: center;
    color: #4B5563; /* gray-600 */
    width: 100%;
}


/* === ヘッダー === */
.pff-header {
    /* background-color: rgb(255 255 255 / 66%); */ /* bg-white */
    /* box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); */ /* shadow-md */
    /* padding-top: 1rem; */ /* py-4 */
    padding-bottom: 1rem; /* py-4 */
    position: relative; /* relative */
    z-index: 50; /* z-50 */
    position: relative;
    width: 100%;
    /* backdrop-filter: blur(5px); */ /* ここでぼかす */
/*    -webkit-backdrop-filter: blur(10px); /* Safari対応 */*/
    /* background: rgb(255 255 255 / 0%); */   /* ぼかしの上に半透明の色を重ねる例 */
    padding-bottom: 0;
}

.pff-header-container {
    /* max-width: 1210px; */
    margin-left: auto;
    margin-right: auto;
    padding-left: 1rem; /* px-4 */
    /* padding-right: 1rem; */ /* px-4 */
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    margin-right: 0;
    /* padding-top: 1rem; */
}

.pff-header-logo-group {
    display: flex;
    align-items: center;
    gap: 0.5rem; /* space-x-2 */
    /* padding-top: 1rem; */
    padding-left: 30px;
}

.pff-header-logo {
    border-radius: 0.5rem; /* rounded-lg */
}

.pff-header-title {
    font-size: 1.5rem; /* text-2xl */
    font-weight: 700; /* font-bold */
    color: #1F2937; /* gray-800 */
}

.pff-header-title img {
    width: 8.1rem;
    text-align: center;
    margin: auto;
}


.pff-header {
    /* 通常時のスタイル */
    background-color: transparent; /* 背景なし */
    height: 100px; /* 通常時の高さ */

    /* 高さや背景色が変更されるときに0.3秒かけて変化させる */
    transition: height 0.3s ease, background-color 0.3s ease;
    background-color: transparent;
    transform: translateY(0); /* 通常時の位置 */
    transition: height 0.3s ease, 
                background-color 0.3s ease, 
                transform 0.3s ease; /* ← この行に transform を追加 */
    display: flex;
    position: fixed;
}

.pff-header.is-scrolled {
    /* スクロール後のスタイル */
    background-color: white; /* 背景を白に */
    height: 110px; /* スクロール後の高さ */
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); /* 任意: 影をつけて立体感を出す */
    margin: 0 1%;
    width: 98%;
    border-radius: 100px;
    overflow: hidden;
    transform: translateY(20px);
    transform: scale(0.99) translateY(20px);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    background: rgb(255 255 255 / 88%);
    display: flex;
    position: fixed;
}


.pff-hamburger-button {
    padding: 0.5rem; /* p-2 */
    color: #1F2937; /* text-gray-800 */
    outline: none; /* focus:outline-none */
    border-radius: 0.5rem; /* rounded-lg */
    display: block; /* md:hidden の代わり */
}
.pff-hamburger-button:focus {
    box-shadow: 0 0 0 2px rgba(100, 116, 139, 0.5); /* focus:ring-2 focus:ring-gray-500 */
}
@media (max-width: 768px) { /* md:hidden */
    .pff-hamburger-button {
        /* display: none; */
    }


    div#main-content {
    margin-top: 17vw;
}


.pff-hamburger-icon {
    width: 2rem; /* w-8 */
    height: 2rem; /* h-8 */
}

    }

.pff-nav-desktop {
    display: none; /* hidden */
    height: 100%;
}
@media (min-width: 768px) { /* md:block */
    .pff-nav-desktop {
        display: flex;
    }
}

.pff-nav-desktop-list {
    display: flex;
    /* gap: 1rem; */ /* space-x-4 */
    list-style: none;
    padding: 0;
    margin: 0;
    /* height: 100%; */
}
@media (min-width: 768px) { /* md:space-x-8 */
    .pff-nav-desktop-list {
        gap: 1rem;
    }
}

.pff-nav-desktop-link {
    color: #000000; /* text-gray-600 */
    font-weight: 900; /* font-medium */
    text-decoration: none;
    transition: color 0.2s ease-in-out;
    text-align: center;
    display: inline-block;
    line-height: 1em;
    font-size: 1.4rem;
}
.pff-nav-desktop-link:hover {
    color: #1F2937; /* hover:text-gray-900 */
}

/* === モバイルメニュー === */
.pff-mobile-menu {
    position: fixed;
    top: 0px;
    right: 0;
    height: 100vh; /* h-full */
    width: 75%; /* w-3/4 */
    background-color: #EC4899; /* bg-pink-500 */
    transform: translateX(100%); /* translate-x-full */
    transition: transform 0.3s ease-in-out; /* transition-transform duration-300 */
    z-index: 50; /* z-50 */
    box-shadow: -4px 0 10px rgba(0, 0, 0, 0.1); /* shadow-lg */
    padding: 1.5rem; /* p-6 */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2rem; /* space-y-8 */
}



.pff-mobile-menu.pff-mobile-menu--open {
    transform: translateX(0);
}


.pff-mobile-menu--hidden { /* JSで追加/削除するクラス */
    transform: translateX(100%);
}

.pff-close-menu-button {
    position: absolute;
    top: 0rem; /* top-4 */
    right: 1rem; /* right-4 */
    padding: 0.5rem; /* p-2 */
    color: #FFFFFF; /* text-white */
    outline: none; /* focus:outline-none */
    border-radius: 0.5rem; /* rounded-lg */
    cursor: pointer;
    background: none;
    border: none;
}
.pff-close-menu-button:focus {
    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.5); /* focus:ring-2 focus:ring-white */
}

.pff-close-icon {
    width: 3.5rem; /* w-10 */
    height: 3.5rem; /* h-10 */
    right: 2vw;
    top: 3vw;
}

.pff-mobile-nav {
    display: flex;
    flex-direction: column;
    gap: 1.5rem; /* space-y-6 */
    font-size: 1.5rem; /* text-2xl */
    font-weight: 700; /* font-bold */
    color: #FFFFFF; /* text-white */
}

.pff-mobile-nav-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    font-family: "RocknRoll One", sans-serif;
    font-weight: 400;
    font-style: normal;
}

.pff-mobile-nav-link {
    color: #FFFFFF;
    text-decoration: none;
    transition: color 0.2s ease-in-out;
}
.pff-mobile-nav-link:hover {
    color: #E5E7EB; /* hover:text-gray-200 */
}


/* === メインコンテンツ共通 === */
.pff-main-content {
    flex-grow: 1;
    /* background: #000000 !important; */
    /* margin-top: 2rem; */
    margin-left: 20%;
    width: 80%;
    padding-left: 0%;
}

/* === ヒーローセクション === */

/* メインビジュアルのラップ */
.main-visual {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
  width: 100%;
  margin: auto;
  /* margin-top: 8rem; */
  flex-wrap: wrap;
  /* max-width: 1100px; */
  gap: 1rem;
}

/* 左側（イラスト） */
.left .main-image {
  width: 57%;
  /* position: absolute; */
  top: 0;
  left: 4%;
  position: absolute;
  /* max-width: 74rem; */
  width: 80rem;
}

img.main-logo.pc {
    position: absolute;
    width: 50%;
    bottom: 7vw;
    left: 6vw;
}

/* 右側（テキスト） */
.right .main-logo {
  /* height: 40vw; */
  width: 39rem;
  z-index: 1;
  position: relative;
  top: -166px;
  right: -23px;
}

/* ↓↓↓ 紙吹雪用CSSをすべてこれに置き換えてください ↓↓↓ */

/* 紙吹雪が舞う範囲をヒーローセクションに限定するための設定 */
.pff-hero-section {
    position: relative;
/*    overflow: hidden;*/
}

/* 紙吹雪コンテナ */
.confetti-container {
    position: absolute;
    bottom: 0vh;
    left: 0;
    width: 100%;
    height: 150vh;
    pointer-events: none;
    z-index: 10;
}

/* 個々の紙吹雪（imgタグ）のスタイル */
.confetti {
    position: absolute;
    width: 25px;
    height: auto;
    opacity: 1; /* ← 0 → 1に変えることで即座に表示される */
/*    transform: scale(0.5); */
}

/* 弾けるアニメーションを実行するためのクラス */
.confetti.animate-burst {
    animation: burst-effect var(--duration) ease-out forwards;
}

/* 舞い落ちるアニメーションを実行するクラス */
.confetti.animate-falling {
    animation: fall-effect var(--duration) linear var(--delay) infinite;
}

/* 弾ける動きの定義 */
@keyframes burst-effect {
    0% {
        transform: scale(0.5);
        opacity: 1;
    }
    70% {
        opacity: 1;
    }
    100% {
        transform: translate(var(--x-end), var(--y-end)) rotate(var(--r-end)) scale(1);
        opacity: 0;
    }
}

/* 舞い落ちる動きの定義 */
@keyframes fall-effect {
    0% {
        transform: translateX(0px) rotate(var(--r-start-fall));
        opacity: 1;
    }
    90% {
        opacity: 1;
    }
    100% {
        transform: translateY(150vh) translateX(var(--x-fall-sway)) rotate(var(--r-end-fall));
        opacity: 0;
    }
}


/*ここまで*/






/* SP版（レスポンシブ） */
@media (max-width: 767px) {
  .main-visual {
    flex-direction: column;
    align-items: center;
    /* margin-top: 9vw; */
    height: auto;
    width: 100%;
    gap: 8vw;
  }

    .news-item:nth-child(3) {
    display: none;
}

.news-item:nth-child(4) {
    display: none;
}

  .left .main-image {
    width: 100%;
  }

  .right .main-logo {
    width: 100%;
    height: auto;
  }



  .confetti {
    width: 25px;
    height: 25px;
  }

  /* SP版のイラストとロゴ */
  .left .main-image {
    margin-bottom: 20px;
    position: relative;
    width: 105%;
    margin: auto;
    /* transform: translate(-50%, 0%); */
    margin-left: -3%;
  }

    .pff-app-wrapper:before {display: none;}

}




/* === ニュースセクション === */
.pff-news-section {
    padding-top: 0; /* py-12 */
    /* padding-bottom: 3rem; */ /* py-12 */
    /* background-color: #FFFFFF; */ /* bg-white */
    position: relative;
}

.pff-news-carousel-wrapper {
    position: relative;
}

.pff-news-carousel {
    display: flex;
    flex-direction: unset; /* flex-col */
    gap: 0.8rem; /* gap-6 */
    /* padding-left: 1rem; */ /* px-4 */
    /* padding-right: 1rem; */ /* px-4 */
    /* overflow-x-scroll no-scrollbar snap-x snap-mandatory pb-6 space-x-6 */
    /* カルーセル機能のCSSは現在削除 */
    width: 100%;
}

.pff-news-card {
    background-color: #F3F4F6; /* bg-gray-100 */
    border-radius: 1rem; /* rounded-2xl */
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); /* shadow-lg */
    padding: 1rem; /* p-4 */
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.pff-news-card-image {
    width: 100%; /* w-full */
    height: 10rem; /* h-40 */
    object-fit: cover;
    border-radius: 0.75rem; /* rounded-xl */
    margin-bottom: 1rem; /* mb-4 */
}

.pff-news-card-title {
    font-size: 1.125rem; /* text-lg */
    font-weight: 600; /* font-semibold */
    margin-bottom: 0.5rem; /* mb-2 */
    color: #1F2937; /* gray-800 */
}

.pff-news-card-date {
    color: #4B5563; /* text-gray-600 */
    font-size: 0.875rem; /* text-sm */
    margin-bottom: 1rem; /* mb-4 */
}

.pff-news-card-link {
    color: #2563EB; /* blue-600 */
    text-decoration: none;
    font-weight: 500; /* font-medium */
    transition: text-decoration 0.2s ease-in-out;
}
.pff-news-card-link:hover {
    text-decoration: underline; /* hover:underline */
}

.pff-more-news-button-container {
    text-align: center; /* text-center */
    margin-top: 2rem; /* mt-8 */
}

.pff-more-news-button {
    display: inline-block;
    background-color: #2563EB; /* bg-blue-600 */
    color: #FFFFFF; /* text-white */
    font-weight: 700; /* font-bold */
    padding: 0.75rem 2rem; /* py-3 px-8 */
    border-radius: 9999px; /* rounded-full */
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); /* shadow-lg */
    transition: all 0.3s ease-in-out;
    text-decoration: none;
}
.pff-more-news-button:hover {
    background-color: #1D4ED8; /* hover:bg-blue-700 */
}


/* === PFF アワード紹介セクション === */
.pff-award-section {
    /* padding-top: 4rem; */ /* py-16 */
    padding-bottom: 1rem; /* py-16 */
    /* background-color: #FFFFFF; */ /* bg-white */
    position: relative;
}

.pff-award-cards-wrapper {
    display: flex;
    flex-direction: column; /* flex-col */
    gap: 1.5rem; /* gap-6 */
}
@media (min-width: 768px) { /* md:flex-row */
    .pff-award-cards-wrapper {
        flex-direction: row;
    }
}

.pff-award-card-yellow {
    background-color: #ffffff; /* bg-yellow-50 */
    padding: 1.5rem; /* p-6 */
    border-radius: 41px; /* rounded-2xl */
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); /* shadow-lg */
    flex: 1; /* flex-1 */
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    border: 2px dashed #fa343d;
    justify-content: center;
    font-family: "RocknRoll One", sans-serif;
    font-weight: 400;
    font-style: normal;
}

.pff-award-card-pink {
    background-color: #ffffff; /* bg-pink-50 */
    padding: 1.5rem; /* p-6 */
    border-radius: 1rem; /* rounded-2xl */
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); /* shadow-lg */
    flex: 1; /* flex-1 */
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    border: 2px dashed #fa343d;
    border-radius: 41px;
    font-size: 19px;
    font-family: "RocknRoll One", sans-serif;
    font-weight: 400;
    font-style: normal;
}

.pff-award-card-title {
    font-size: 1.8rem; /* text-2xl */
    font-weight: 700; /* font-bold */
    color: #e62d8b; /* gray-800 */
    margin-bottom: 0.5rem; /* mb-4 */
}

.pff-award-card-subtitle {
    font-size: 3.7rem; /* text-3xl */
    font-weight: 800; /* font-extrabold */
    color: #000000; /* red-600 */
    margin-bottom: 1.3rem; /* mb-4 */
    line-height: 1em;
}

.pff-award-card-sub-title {
    font-size: 1rem; /* text-xl */
    font-weight: 700; /* font-bold */
    color: #ffffff; /* gray-800 */
    margin-bottom: 0.5rem; /* mb-2 */
    background: #e62d8b;
    padding: 0 19px;
    letter-spacing: 0.05em;
}

.pff-award-card-sub-title-small { /* 新規追加 */
    font-size: 1.55rem; /* text-xl */
    font-weight: 700; /* font-bold */
    color: #e62d8b; /* gray-800 */
    margin-bottom: 0.2rem; /* mb-4 */
}

.pff-award-card-promo {
    font-size: 4.45rem; /* text-4xl */
    font-weight: bold; /* font-extrabold */
     /* pink-600 */
    line-height: 1em;
    margin-bottom: 0rem; /* mb-4 */
    color: #f8be05; /* 文字色 */
    -webkit-text-stroke: 3px #e12b87;
    font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

.pff-award-card-link {
    display: inline-flex;
    align-items: center;
    color: #ffffff; /* blue-600 */
    text-decoration: none;
    font-weight: bold; /* font-medium */
    transition: text-decoration 0.2s ease-in-out;
    /* background: #ffc502; */
    /* padding: 0.2em 1em; */
    border-radius: 7px;
    font-size: 1.2rem;
}



a.hv {
    transition: transform 0.3s cubic-bezier(.4,2,.6,1), box-shadow 0.3s;
  /* 基本はtransitionつけるだけでOK */
    display: inline-block; /* ←省略可。レイアウト次第で */
    border-radius: 50px;
}

a.hv:hover {
    transform: translateY(-8px) scale(1.04);
    box-shadow: 0 8px 20px rgba(0,0,0,0.15);
  /* 少し拡大&浮き上がる */
}
.pff-award-card-link:hover {
    text-decoration: underline;
}

.pff-award-card-icon {
    width: 1rem; /* w-4 */
    height: 1rem; /* h-4 */
    margin-left: 0.25rem; /* ml-1 */
}



.pff-feature-section {
  display: flex;
  flex-direction: column;
  gap: 32px;
  background: #8ee6fd; /* ブロックの間の背景色（水色） */
  padding: 48px 0 0 0;
  position: relative;
}

.pff-feature-block {
  background: #fff;
  border-radius: 18px;
  /* border: 3px dashed #fff; */
  box-shadow: 0 8px 32px rgba(0,0,0,0.04);
  padding: 1.4rem 2.3rem 2.4rem 1.1rem;
  margin: 0 auto;
  max-width: 900px;
  width: 90%;
  position: relative;
  min-height: 400px;
}

.pff-feature-block--orange {
  background: #ffb983;
  border-color: #ff6600;
  margin-right: 14%;
  min-height: 400px;
}

.pff-feature-block--pink {
  background: #f857a6;
  border-color: #fff;
  left: -10%;
  font-family: "RocknRoll One", sans-serif;
  font-weight: 400;
  font-style: normal;
  text-align: left;
  margin-bottom: 0.2rem;
}

.pff-feature-block--green {
  background: #b5e61d;
  border-color: #fff;
  right: -8%;
}

.pff-feature-block-header {
  display: flex;
  align-items: flex-end;
  gap: 2rem;
  margin-bottom: 16px;
  justify-content: l;
}
.pff-program-section {
  position: relative;
  padding: 0px 0 60px 0;
  min-height: 800px; /* ä»® */
  overflow: visible;
  margin-top: 3rem;
}

/* ==== 背景装飾 ==== */
.pff-bg-wave {
  position: absolute;
  top: 0;
  left: 0; right: 0;
  height: 110px;
  background: url('img/bg-wave.svg') repeat-x bottom;
  background-size: cover;
  z-index: 1;
}
.pff-bg-chair {
  position: absolute;
  top: 0;
  right: 10rem;
  width: 13rem;
  height: auto;
  z-index: 2;
  transform: translate(10px, -80%);
}
.pff-bg-cat {
  position: absolute;
  left: -40px;
  top: 0px;
  width: 50rem;
  height: auto;
  z-index: 1;
  transform: translate(0px, -28%);
}
/* モバイルで重なりやサイズを調整 */
@media (max-width: 700px) {
  .pff-bg-chair { top: 8px; right: 16px; width: 60px;}
  .pff-bg-cat { left: -18px; bottom: 170px; width: 190px;}
}

/* ==== 縦書きラベル ==== */
.pff-label-vertical {
  position: absolute;
  right: 40px;
  /* top: 310px; */
  font-size: 2.3rem;
  font-weight: bold;
  color: #111;
  background: #ff2786;
  padding: 18px 10px;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  border-radius: 12px;
  z-index: 5;
  letter-spacing: 0.08em;
  box-shadow: 2px 4px 20px rgba(0,0,0,0.05);
  text-align: center;
  transform: translate(0px, -80%);
}
@media (max-width: 700px) {
  .pff-label-vertical {
    top: 220px;
    right: 10px;
    font-size: 1.15rem;
    padding: 7px 5px;
  }
}

/* ==== プログラム本体 ==== */
.pff-program-main {
  position: relative;
  z-index: 10;
  max-width: 1000px;
  margin: 0 auto;
  /* background: #fff; */
  border-radius: 18px;
  box-shadow: 0 8px 28px rgba(0,0,0,0.04);
  padding: 40px 0px 36px 0px;
  width: 95%;
}

/* ボタン横並び→SPで縦積み */
.pff-program-buttons {
  display: flex;
  gap: 6rem;
  margin-bottom: 8rem;
  justify-content: end;
  align-items: flex-end;
  padding-top: 13rem;
}
.pff-btn {
  display: inline-block;
  padding: 12px 18px;
  border-radius: 15px;
  font-weight: bold;
  font-size: 2.0rem;
  text-align: center;
  text-decoration: none;
  background: #ff2786;
  color: #fff;
  box-shadow: 0 2px 10px rgba(0,0,0,0.08);
  transition: background .18s;
  display: block;
  height: 60px;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  line-height: 0;
}
.pff-btn-award {background: #e8336d;margin-bottom: 1rem;}
.pff-btn-special {background: #ffd400;color: #222;height: 150px;}
.pff-btn-special span { font-size: 0.93rem; display: block;}
@media (max-width: 700px) {
  .pff-program-buttons {
    flex-direction: column;
    gap: 8px;
  }
  .pff-btn { width: 100%; }
}

.pff-program-description {
  margin-top: 20px;
  border: 5px solid #e62d8b;
  border-radius: 20px;
  background: #fff8e0;
  max-width: 1000px;
  width: 95%;
  padding: 2rem;
  line-height: 1.05;
  font-family: "RocknRoll One", sans-serif;
  font-weight: 400;
  font-style: normal;
}
.pff-program-description h2 {
  font-size: 2rem;
  font-weight: bold;
  margin-bottom: 12px;
}
.pff-program-grid {
  display: flex;
  gap: 18px;
  width: 100%;
  justify-content: center;
  align-items: center;
}
.pff-program-grid-img {
  /* flex: 0 0 240px; */
  width: 48%;
}
.pff-program-grid-img img {
  width: 100%;
  border-radius: 10px;
  box-shadow: 0 2px 16px rgba(0,0,0,0.10);
}

.pff-program-grid-text p {
    font-size: 1rem;
    line-height: 1.5em;
}


.pff-program-grid-text {
  /* flex: 1 1 0; */
  /* min-width: 0; */
  width: 48%;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  height: 60%;
  text-align: left;
}
@media (max-width: 700px) {
  .pff-program-main {
    padding: 15px 4vw 20px 4vw;
  }
  .pff-program-grid {
    flex-direction: column;
    gap: 8px;
  }
  .pff-program-grid-img {
    max-width: 100%;
    margin-bottom: 8px;
  }
}

.pff-btn-list, .pff-btn-special2 {
  margin-top: 14px;
  display: block;
  width: 100%;
  background: #e8336d;
  color: #fff;
  border: none;
  border-radius: 16px;
  font-size: 1.15rem;
  font-weight: bold;
  padding: 10px 0;
  display: flex;
}
.pff-btn-special2 {
  background: #a72ad7;
}
.pff-note {
  font-size: 0.93rem;
  color: #111;
  margin-top: 6px;
}
.vertical-label-group {
  /* position: absolute; */   /* 配置は親要素で調整 */
  top: 100px;           /* 例：位置調整 */
  right: 40px;          /* 例：位置調整 */
  z-index: 10;
  display: flex;
  align-items: flex-end; /* 右揃え */
  gap: 0;
  font-size: 2.5rem;
  flex-wrap: wrap;
  flex-direction: row-reverse;
}

.vertical-label {
  background: #f62e87;
  color: #111;
  font-family: "Noto Sans JP", "Meiryo", sans-serif;
  /* font-size: 3.2rem; */
  font-weight: bold;
  line-height: 1.07;
  letter-spacing: 0;
  padding: 18px 12px;
  border-radius: 0;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  box-sizing: border-box;
  box-shadow: none;
  /* display: flex; */
  justify-content: center;
  align-items: center;
}

.pff-bg-flower {
    position: absolute;
    right: 16rem;
    top: 39rem;
    z-index: 13;
    width: 8rem;
}


.vertical-label-1 {
  /* 上のラベル、幅そのまま */
  margin-right: 0;
  top: -9rem;
  position: relative;
}

.vertical-label-2 {
  /* 下のラベルを少し右にずらす（=親のright方向に移動） */
  margin-top: 0px;    /* 少し重なる */
  margin-right: 0;  /* 右にはみ出す（画像見本に合わせ調整） */
  /* transform: translate(-100%, -40%); */
}

.pff-program-buttons .link_box {
    /* display: flex; */
    flex-wrap: wrap;
    width: 34%;
}

.pff-feature-number {
  line-height: 1;
  font-family: 'RocknRoll One', 'Inter', Arial, sans-serif;
  font-size: 5rem;
  font-weight: 900;
  color: #fff;
  -webkit-text-stroke: 1px #ea3d8f; /* ピンクの太縁 */
   /* 一部ブラウザ用 */
  letter-spacing: -0.1em;
  border-radius: 20px; /* テキストは元々角丸の書体を推奨 */
  display: inline-block;
  transform: scaleX(0.9);
}

.pff-feature-block--pink .pff-feature-number {
  color: #fff;
  text-shadow: 1px 2px 0 #ff41b4;
}


.pff-feature-title-main {
  font-size: 1.45rem;
  font-weight: 700;
  color: #fff;
  line-height: 1.2;
  letter-spacing: -0.07em;
  font-size: 1.825rem;
  color: #FFFFFF;
  line-height: 1.05;
  font-family: "RocknRoll One", sans-serif;
  font-weight: 400;
  font-style: normal;
  text-align: left;
  margin-bottom: 0.2rem;
}
.pff-feature-title-sub {
  color: #222;
  font-weight: 500;
}

.pff-feature-block--orange .pff-feature-title-main {color: #ffffff;}
.pff-feature-block--green .pff-feature-title-main {color: #000000;}

.pff-feature-block-body {
  margin-top: 14px;
}

.pff-feature-comment {
  background: #fff;
  color: #ea3d8f;
  padding: 6px 16px;
  border-radius: 16px;
  display: inline-block;
  font-weight: 700;
  font-size: 1.06rem;
  margin-bottom: 8px;
}

.pff-feature-block--pink .pff-feature-comment {
  background: transparent;
  color: #fff;
  font-size: 1.1rem;
  font-weight: 500;
}

.pff-feature-movie-thumb {
  margin: 14px 0 10px 0;
}
.pff-feature-movie-thumb img {
  width: 140px;
  border-radius: 10px;
}

.pff-feature-image {
  position: absolute;
  bottom: -30px;
  left: -36px;
  width: 100px;
  z-index: 3;
  /* サンプル用：画像サイズや位置は実際の画像で調整 */
}

.pff-feature-block--pink .pff-feature-image {
  left: unset;
  right: -36px;
}

.pff-feature-block--green .pff-feature-image {
  left: unset;
  right: -36px;
  bottom: -30px;
}

.pff-feature-note {
  margin-top: 12px;
  font-size: 1rem;
  color: #fff;
  font-weight: 700;
}

.pff-feature-block--green .pff-feature-note {
  color: #663b06;
}

.pff-feature-btn {
  display: inline-block;
  background: #fff;
  color: #f857a6;
  font-weight: 700;
  border-radius: 30px;
  padding: 6px 22px;
  font-size: 1.07rem;
  border: 2px solid #fff;
  margin-top: 8px;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
}
.pff-feature-btn:hover {
  background: #f857a6;
  color: #fff;
  border: 2px solid #fff;
}



.pff-feature-flex {
  display: flex;
  gap: 32px;
  align-items: flex-start;
  position: relative;
  font-family: "RocknRoll One", sans-serif;
  font-weight: 400;
  font-style: normal;
  text-align: left;
  margin-bottom: 0.2rem;
}

.pff-feature-col {
  flex: 1 1 0;
  min-width: 0;
}

.pff-feature-col--left {
  display: flex;
  /* flex-direction: column; */
  gap: 18px;
  /* align-items: flex-start; */
  max-width: 50%;
  align-items: end;
}

.pff-feature-col--right {
  display: flex;
  flex-direction: column;
  gap: 22px;
  align-items: flex-end;
  max-width: 50%;
}


.pff-feature-title {
  font-size: 1.7rem;
  font-weight: 700;
  color: #fff;
  line-height: 1.22;
  text-align: left;
}
.pff-feature-title-highlight {
  color: #e23697;
}

.pff-feature-balloon-group {
  /* display: flex; */
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  position: absolute;
  bottom: 0;
  width: unset;
}

.pff-feature-balloon {
  /* background: #fff; */
  /* border: 2px dashed #e23697; */
  /* border-radius: 50px 55px 55px 55px / 55px 50px 55px 55px; */
  /* padding: 22px 40px; */
  /* color: #222; */
  /* font-weight: 700; */
  /* font-size: 1.15rem; */
  /* position: relative; */
}
.pff-feature-balloon-small {
  background: #fff;
  border: 2px dashed #e23697;
  border-radius: 30px;
  padding: 5px 14px;
  color: #e23697;
  font-size: 1rem;
  font-weight: 700;
  position: absolute;
  left: 120px;
  top: 100px;
}

.pff-feature-char {
  z-index: 2;
}

.pff-feature-col--right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.5rem;
}

.pff-feature-movie {
  background: none;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
}

.pff-feature-movie-thumb {
  width: 320px;
  border: 3px solid #000;
  margin-bottom: 2px;
  /* border-radius: 7px; */
  height: 170px;
}

.pff-feature-movie-caption {
  font-size: 0.87rem;
  color: #222;
  margin-bottom: 8px;
}

.pff-feature-movie-btn {
  background: #fff;
  color: #222;
  border: 2px solid #e23697;
  border-radius: 24px;
  padding: 8px 24px;
  font-size: 1.17rem;
  font-weight: bold;
  cursor: pointer;
  margin-bottom: 10px;
  box-shadow: 0 1px 6px rgba(0,0,0,0.07);
  transition: background 0.2s, color 0.2s;
}
.pff-feature-movie-btn:hover {
  background: #e23697;
  color: #fff;
}

.pff-feature-link {
  display: inline-flex;
  align-items: center;
  background: none;
  color: #222;
  font-weight: bold;
  font-size: 1.2rem;
  margin-top: 18px;
  text-decoration: none;
  border-radius: 32px;
  /* padding: 6px 20px 6px 8px; */
  border: none;
  transition: background 0.2s, color 0.2s;
  font-family: "RocknRoll One", sans-serif;
  font-weight: 400;
  font-style: normal;
  text-align: left;
  margin-bottom: 0.2rem;
  position: relative;
  line-height: 0;
}
.pff-feature-link-arrow {
  display: inline-block;
  margin-left: 10px;
  color: #e23697;
  font-size: 1.8rem;
}
.pff-feature-link:hover {
  background: #fff;
  color: #e23697;
}

@media (max-width: 900px) {
  .pff-feature-flex {
    flex-direction: column;
    gap: 18px;
  }
  .pff-feature-col--left, .pff-feature-col--right {
    max-width: 100%;
    align-items: flex-start;
  }
  .pff-feature-link {
    font-size: 1.4rem;
  }
}


.pff-feature-section {
  display: flex;
  flex-direction: column;
  gap: 70px;
  background: #71d1ee; /* ブロックの間の背景色（水色） */
  padding: 48px 0 0 0;
  position: relative;
}

.pff-feature-block {
  background: #fff;
  border-radius: 18px;
  /* border: 3px dashed #fff; */
  box-shadow: 0 8px 32px rgba(0,0,0,0.04);
  padding: 1.4rem 2.3rem 2.4rem 1.1rem;
  margin: 0 auto;
  max-width: 900px;
  width: 90%;
  position: relative;
  min-height: 400px;
}

.pff-feature-block--orange {
  background: #ffb983;
  border-color: #ff6600;
  margin-right: 14%;
  min-height: 400px;
}

.pff-feature-block--pink {
  background: #f857a6;
  border-color: #fff;
  left: -10%;
  font-family: "RocknRoll One", sans-serif;
  font-weight: 400;
  font-style: normal;
  text-align: left;
  margin-bottom: 0.2rem;
}

.pff-feature-block--green {
  background: #98c31a;
  border-color: #fff;
  right: -8%;
}

.pff-feature-block-header {
  display: flex;
  align-items: flex-end;
  gap: 2rem;
  margin-bottom: 16px;
  justify-content: l;
}

.pff-feature-block-inner-border {
  position: absolute;
  top: 0.6rem;   /* 調整 */
  left: 0.6rem;
  right: 0.6rem;
  bottom: 0.6rem;
  border: 2px dashed #fff;
  border-radius: 14px;
  pointer-events: none; /* クリックを邪魔しない */
  z-index: 2;
}

.pff-feature-number {
  line-height: 1;
  font-family: 'RocknRoll One', 'Inter', Arial, sans-serif;
  font-size: 5rem;
  font-weight: 900;
  color: #fff;
  -webkit-text-stroke: 1px #ea3d8f; /* ピンクの太縁 */
   /* 一部ブラウザ用 */
  letter-spacing: -0.1em;
  border-radius: 20px; /* テキストは元々角丸の書体を推奨 */
  display: inline-block;
  transform: scaleX(0.9);
}

.pff-feature-block--pink .pff-feature-number {
  color: #fff;
  text-shadow: 1px 2px 0 #ff41b4;
}

.pff-feature-title-main {
  font-size: 1.45rem;
  font-weight: 700;
  color: #fff;
  line-height: 1.2;
  letter-spacing: -0.07em;
  font-size: 1.825rem;
  color: #FFFFFF;
  line-height: 1.05;
  font-family: "RocknRoll One", sans-serif;
  font-weight: 400;
  font-style: normal;
  text-align: left;
  margin-bottom: 0.2rem;
}
.pff-feature-title-sub {
  color: #e62d8b;
  font-weight: 500;
}

.pff-feature-block--orange .pff-feature-title-main {color: #ffffff;}
.pff-feature-block--green .pff-feature-title-main {}

.pff-feature-block-body {
  margin-top: 14px;
}

.pff-feature-comment {
  background: #fff;
  color: #ea3d8f;
  padding: 6px 16px;
  border-radius: 16px;
  display: inline-block;
  font-weight: 700;
  font-size: 1.06rem;
  margin-bottom: 8px;
}

.pff-feature-block--pink .pff-feature-comment {
  background: transparent;
  color: #fff;
  font-size: 1.1rem;
  font-weight: 500;
}

.pff-feature-movie-thumb {
  margin: 14px 0 10px 0;
}
.pff-feature-movie-thumb img {
  width: 140px;
  border-radius: 10px;
}

.pff-feature-image {
  position: absolute;
  bottom: -30px;
  left: -36px;
  width: 100px;
  z-index: 3;
  /* サンプル用：画像サイズや位置は実際の画像で調整 */
}

.pff-feature-block--pink .pff-feature-image {
  left: unset;
  right: -36px;
}

.pff-feature-block--green .pff-feature-image {
  left: unset;
  right: -36px;
  bottom: -30px;
}

.pff-feature-note {
  margin-top: 12px;
  font-size: 1rem;
  color: #fff;
  font-weight: 700;
}

.pff-feature-block--green .pff-feature-note {
  color: #663b06;
}

.pff-feature-btn {
  display: inline-block;
  background: #fff;
  color: #f857a6;
  font-weight: 700;
  border-radius: 30px;
  padding: 6px 22px;
  font-size: 1.07rem;
  border: 2px solid #fff;
  margin-top: 8px;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
}
.pff-feature-btn:hover {
  background: #f857a6;
  color: #fff;
  border: 2px solid #fff;
}



.pff-feature-flex {
  display: flex;
  gap: 32px;
  align-items: flex-start;
  position: relative;
  font-family: "RocknRoll One", sans-serif;
  font-weight: 400;
  font-style: normal;
  text-align: left;
  margin-bottom: 0.2rem;
}

.pff-feature-col {
  flex: 1 1 0;
  min-width: 0;
}

.pff-feature-col--left {
  display: flex;
  /* flex-direction: column; */
  gap: 18px;
  /* align-items: flex-start; */
  max-width: 50%;
  align-items: end;
}

.pff-feature-col--right {
  display: flex;
  flex-direction: column;
  gap: 22px;
  align-items: flex-end;
  max-width: 50%;
}


.pff-feature-title {
  font-size: 1.7rem;
  font-weight: 700;
  color: #fff;
  line-height: 1.22;
  text-align: left;
}
.pff-feature-title-highlight {
  color: #e23697;
}

.pff-feature-balloon-group {
  /* display: flex; */
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  position: absolute;
  bottom: -60px;
  width: 30%;
  height: 230px;
  z-index: 9;
}

.pff-feature-balloon {
  background: #fff;
  border: 2px dashed #e23697;
  border-radius: 50px 55px 55px 55px / 55px 50px 55px 55px;
  padding: 22px 40px;
  color: #222;
  font-weight: 700;
  font-size: 0.95rem;
  position: relative;
  width: 310px;
}

.pff-feature-block--pink .pff-feature-balloon-group {
    position: absolute;
    right: 0;
    bottom: -40px;
}

.pff-feature-block--pink .pff-feature-balloon-group .pff-feature-balloon {
    position: absolute;
    top: -50px;
    right: 130px;
    /* transform: translate(0px, -100%); */
}


.pff-feature-balloon-small {
  background: #fff;
  border: 2px dashed #e23697;
  border-radius: 30px;
  padding: 5px 14px;
  color: #e23697;
  font-size: 1rem;
  font-weight: 700;
  position: absolute;
  left: 120px;
  top: 100px;
}

.pff-feature-char {
  z-index: 2;
}



.pff-feature-balloon-group .c01 .pff-feature-balloon {
    position: absolute;
    top: 0;
    right: 0;
    transform: translate(50%, 0px);
}

.pff-feature-balloon-group .c02 {
    position: absolute;
    bottom: 0;
    left: 190px;
}

.pff-feature-balloon-group .c02 p.pff-feature-balloon {
    position: absolute;
    top: 0;
    right: 0;
    transform: translate(100%, 0px);
    width: 180px;
}

.pff-feature-balloon-group .c02 img.pff-feature-char {
    width: 80px;
}

.pff-feature-balloon-group .c01 img.pff-feature-char {
    width: 170px;
}

.pff-feature-col--right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.5rem;
}

.pff-feature-movie {
  background: none;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
}

.pff-feature-movie-thumb {
  width: 320px;
  border: 3px solid #000;
  margin-bottom: 2px;
  /* border-radius: 7px; */
  height: 170px;
}

.pff-feature-movie-caption {
  font-size: 0.87rem;
  color: #222;
  margin-bottom: 8px;
}

.pff-feature-movie-btn {
  background: #fff;
  color: #222;
  border: 2px solid #e23697;
  border-radius: 24px;
  padding: 8px 24px;
  font-size: 1.17rem;
  font-weight: bold;
  cursor: pointer;
  margin-bottom: 10px;
  box-shadow: 0 1px 6px rgba(0,0,0,0.07);
  transition: background 0.2s, color 0.2s;
}
.pff-feature-movie-btn:hover {
  background: #e23697;
  color: #fff;
}

.pff-feature-link {
  display: inline-flex;
  align-items: center;
  background: none;
  color: #222;
  font-weight: bold;
  font-size: 1.2rem;
  margin-top: 18px;
  text-decoration: none;
  border-radius: 32px;
  /* padding: 6px 20px 6px 8px; */
  border: none;
  transition: background 0.2s, color 0.2s;
  font-family: "RocknRoll One", sans-serif;
  font-weight: 400;
  font-style: normal;
  text-align: left;
  margin-bottom: 0.2rem;
  position: relative;
  line-height: 0;
}
.pff-feature-link-arrow {
  display: inline-block;
  margin-left: 10px;
  color: #e23697;
  font-size: 1.8rem;
}
.pff-feature-link:hover {
  background: #fff;
  color: #e23697;
}

@media (max-width: 900px) {
  .pff-feature-flex {
    flex-direction: column;
    gap: 18px;
  }
  .pff-feature-col--left, .pff-feature-col--right {
    max-width: 100%;
    align-items: flex-start;
  }
  .pff-feature-link {
    font-size: 1.4rem;
  }
}


.pff-feature-illust.pff-feature-illust--lefttop {
    top: 50px;
    right: -13px;
    width: 31rem;
    height: auto;
    position: absolute;
    transform: translate(0px, -100%);
}

.pff-feature-section {
  position: relative;
  z-index: 1;
  margin: 170px 0 60px 0; /* 必要に応じて調整 */
  /* section自体には背景色はつけないでOK */
  padding-bottom: 10rem;
}

/* 上のSVG波 */
.pff-feature-section::before {
  content: '';
  display: block;
  position: absolute;
  top: -100px;   /* 余白調整 */
  left: -70px;
  /* width: 120%; */
  right: 0;
  height: 110px; /* SVGの高さに合わせて調整 */
  background: url('img/pff-feature-section_bg01.svg') repeat-x top;
  background-size: cover; /* or contain、coverは横幅全体に伸びる */
  z-index: 0;
  pointer-events: none;
  animation: nyuwanWave 4s infinite alternate cubic-bezier(0.45,0,0.55,1);
}

/* 下のSVG波 */
.pff-feature-section::after {
  content: '';
  display: block;
  position: absolute;
  bottom: -100px;
  left: -20px;
  right: -20px;
  width: 120%;
  height: 110px; /* SVGの高さに合わせて調整 */
  background: url('img/pff-feature-section_bg02.svg') repeat-x bottom;
  background-size: cover;
  z-index: -1;
  pointer-events: none;
  animation: nyuwanWave 4s infinite alternate-reverse cubic-bezier(0.45,0,0.55,1);
}

/* 波をゆらす */
@keyframes nyuwanWave {
  0%   { transform: scaleX(1) scaleY(1);}
  20%  { transform: scaleX(1.04) scaleY(0.97);}
  50%  { transform: scaleX(0.97) scaleY(1.03);}
  100% { transform: scaleX(1) scaleY(1);}
}










/* === ぴあフィルムフェスティバルって? セクション === */
.pff-about-section {
    padding-top: 4rem; /* py-16 */
    padding-bottom: 5rem; /* py-16 */
     /* bg-gray-50 */
    overflow: hidden;
    position: relative;
    padding-right: 30%;
}

.pff-about-blob-bg {
    /*    inset: 0;
    z-index: 0;*/
    /* ペンキのような背景のアニメーション（既存） */
    /*    border-radius: 40% 70% 50% 60% / 60% 40% 60% 40%;
    background-color: #EF4444;
    animation: blob-animation 15s infinite alternate ease-in-out;*/
    position: absolute;
    top: 34px;
    /* bottom: 0; */
    right: 0;
    left: 0;
    height: 100%;
    width: auto;
}
.pff-about-section .pff-about-blob-bg {
    padding-right: 40%;
}
.pff-about-content {
    text-align: center;
    position: relative;
    z-index: 10;
    /* width: 800px; */
    text-align: center;
    padding-top: 4rem;
}

.pff-about-title {
    font-size: 2.25rem; /* text-4xl */
    font-weight: 800; /* font-extrabold */
    margin-bottom: 2rem; /* mb-6 */
    color: #FFFFFF; /* text-white */
    text-align: center;
    display: inline-block;
}

.pff-about-title img {
    width: 18rem;
    display: inline-block;
}

.pff-about-text {
    font-size: 1.225rem; /* text-lg */
    color: #FFFFFF; /* text-white */
    line-height: 1.75; /* leading-relaxed */
    margin-bottom: 1.5rem; /* mb-6 */
    font-family: "RocknRoll One", sans-serif;
    font-weight: 400;
    font-style: normal;
}

.pff-about-highlight {
    font-weight: 700; /* font-bold */
    /* Tailwindで付与されていた色（青、緑）はHTMLのinline styleではなくCSSで定義 */
    /* 現在はwhiteに統一されるため、必要であれば別途クラスで色指定 */
    position: relative;
    display: inline-block; /* å¿…é ˆ */
}

.pff-about-button {
    display: inline-flex;
    align-items: center;
    background-color: #FFFFFF; /* bg-white */
     /* text-purple-600 */
    font-weight: 700; /* font-bold */
    padding: 0.75rem 4rem; /* py-3 px-8 */
    border-radius: 9999px; /* rounded-full */
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); /* shadow-lg */
    transition: all 0.3s ease-in-out;
    text-decoration: none;
    font-size: 1.4rem;
    font-family: "RocknRoll One", sans-serif;
    font-weight: 400;
    font-style: normal;
}
.pff-about-button:hover {
    background-color: #E5E7EB; /* hover:bg-gray-200 */
}
.pff-about-button i.fas.fa-chevron-right {
    width: 26px;
    height: 26px;
    border: 2px solid #000000;
    font-size: 14px;
    border-radius: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: 1.4em;
}
.pff-about-button-icon {
    width: 1rem; /* w-4 */
    height: 1rem; /* h-4 */
    margin-left: 0.5rem; /* ml-2 */
}


.arrows01 {
    width: 30px;
    height: 30px;
    /* border: 1px solid #000000; */
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 100px;
    background: #e62d8b;
    color: white;
    margin-left: 0.5em;
}


/* === フッター === */
.pff-footer {
    /* position: relative; 不要な相対位置指定は削除 */
    /* padding-top: 3rem; padding-bottom: 3rem; 各セクションで管理 */
    overflow: hidden; /* スキュー背景のはみ出し防止 */
    /* background-color: #f8f8f8; */ /* デフォルトの背景色に合わせるか、各セクションで管理 */
}

/* 主催セクション */
.pff-organizers-section {
    /* background-color: #FFFFFF; */ /* 白い背景 */
    padding-top: 2rem; /* py-16 */
    /* margin-bottom: 4rem; */ /* mb-16 */
    position: relative;
    z-index: 10; /* お問い合わせ背景の上に表示 */
}

.pff-organizers-grid {
     /* bg-white */
     /* rounded-2xl */
     /* shadow-lg */
     padding: 1.5rem; /* p-6 */
     /* border border-pink-200 */
     flex-wrap: wrap; /* flex-wrap */
     justify-content: space-around; /* justify-center */
     align-items: center; /* items-center */
     gap: 2rem; /* gap-8 */
     font-weight: bold;
     /* font-size: 1.3rem; */
     line-height: 2em;
     border: 2px solid #ff7bac;
     border-radius: 1rem;
     background: white;
     width: 1000px;
     margin: auto;
}
@media (max-width: 768px) { /* md:p-8 md:gap-16 */
    .pff-organizers-grid {
        padding: 1em 0;
        justify-content: center;
        margin-bottom: 2em;
    }

    .wrap {
    width: 95%;
}
    
}

.pff-organizer-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    /* width: 48%; */
    flex: 0 0 33%;  /* 例：1行4個×2行＝8個の場合 */
    box-sizing: border-box;
    00;
    font-family: "toppan-bunkyu-gothic-pr6n", serif;
    font-weight: 800;
}

.pff-organizer-item img {
    /* height: 67px; */
}

.pff-organizer-logo {
    margin-bottom: 0.5rem; /* mb-2 */
    /* width: 5rem; */ /* w-20 */
    height: 5rem; /* h-20 */
    object-fit: contain;
}
.pff-organizer-logo-nfa {
    margin-bottom: 0.5rem;
    /* width: 8rem; */ /* w-32 */
    height: 5rem; /* h-20 */
    object-fit: contain;
}
.pff-organizer-logo-unijapan {
    margin-bottom: 0.5rem;
    /* width: 6rem; */ /* w-24 */
    height: 3.7rem; /* h-20 */
    object-fit: contain;
}


.pff-organizer-text {
    color: #374151; /* gray-700 */
    font-size: 0.875rem; /* text-sm */
    text-align: center;
}
@media (max-width: 768px) { /* md:text-base */
    .pff-organizer-text {
        font-size: 1rem;
    }
    
}




/* お問い合わせセクション */
.pff-contact-section {
    position: relative; /* 背景のabsolute基準 */
    overflow: hidden; /* skewYのはみ出し防止 */
    padding-top: 7rem; /* py-16 */
    padding-bottom: 7rem; /* py-16 */
    text-align: center;
    color: #FFFFFF; /* text-white */
    /* 背景色は .pff-contact-background で管理 */
    margin-bottom: 4rem;
    background: url(img/contact_bg_sp.svg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 949px;
    margin-top: -2rem;
    margin-bottom: -2rem;
}

/* お問い合わせセクションの背景 */
.pff-contact-background {
    /* position: absolute; */
    /* inset: 0; */ /* 親要素全体を覆う */
     /* bg-green-500 (初期値) */
    /* transform-origin: top; */ /* origin-top */
    /* transform: skewY(-3deg); */ /* -skew-y-3 */
    /* z-index: 0; */
    /* animation: contact-bg-color-change 12s infinite alternate ease-in-out; */
}

/* お問い合わせセクションのコンテンツラッパー */
.pff-contact-content-wrapper {
    position: relative; /* z-indexを有効にするため */
    z-index: 10; /* 背景の上に表示 */
    /* padding-bottom: 60px; */
    padding-top: 0;
}

.pff-contact-title {
    font-size: 3rem; /* text-4xl */
    font-weight: 800; /* font-extrabold */
    margin-bottom: 0.5rem; /* mb-2 */
    font-family: "RocknRoll One", sans-serif;
    font-weight: 400;
    font-style: normal;
}

.pff-contact-subtitle {
    font-size: 1.4rem; /* text-xl */
    margin-bottom: 2rem; /* mb-8 */
}

.pff-contact-details-wrapper {
    display: flex;
    flex-direction: column; /* flex-col */
    align-items: center; /* items-center */
    justify-content: center; /* justify-center */
    gap: 2rem; /* space-y-8 */
    margin-top: 4rem;
    font-family: "RocknRoll One", sans-serif;
    font-weight: 400;
    font-style: normal;
}
@media (min-width: 768px) { /* md:flex-row md:space-y-0 md:space-x-12 */
    .pff-contact-details-wrapper {
        flex-direction: row;
        gap: 0;
        /* space-x-12 を模擬、各要素間に直接marginを設定 */
    }
    .pff-contact-details-wrapper > div:not(:last-child) {
        margin-right: 3rem; /* ç´„ md:space-x-12 */
    }
}

.pff-contact-info {
    /* width: 48%; */
    display: block;
    justify-content: center;
    align-items: center;
    text-align: center;
    flex-direction: inherit;
}
    .pff-contact-info img {
    width: 16vw;
    margin: auto;
    padding-bottom: 0.5em;
}


.pff-contact-logo-large {
    margin-bottom: 1rem; /* mb-4 */
    width: 8rem; /* w-32 */
    height: 8rem; /* h-32 */
    object-fit: contain;
}

.pff-contact-org-name {
    font-size: 1.5rem; /* text-2xl */
    font-weight: 700; /* font-bold */
    /* margin-bottom: 0.5rem; */ /* mb-2 */
}

.pff-contact-tel {
    font-size: 1.5rem; /* text-2xl */
    font-weight: 700; /* font-bold */
    margin-bottom: 0.5rem; /* mb-2 */
}

.pff-contact-hours {
    font-size: 0.875rem; /* text-sm */
}

.pff-contact-website-button {
    display: inline-block;
    /* background-color: #FFFFFF; */ /* bg-white */
    color: #ffffff; /* text-green-700 */
    font-weight: 700; /* font-bold */
    padding: 1rem 3rem; /* py-4 px-12 */
    border-radius: 20px; /* rounded-full */
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); /* shadow-lg */
    transition: all 0.3s ease-in-out;
    font-size: 1.525rem; /* text-lg */
    text-decoration: none;
    text-align: center; /* 中央揃え */
    border: 2px solid #eee;
}
.pff-contact-website-button:hover {
    background-color: #E5E7EB; /* hover:bg-gray-200 */
}

/* Copyright */
.pff-copyright {
    text-align: center;
    /* margin-top: 3rem; */ /* mt-12 */
    color: #6B7280; /* gray-500 */
    font-size: 1.175rem; /* text-sm */
    /* position: relative; z-indexは親要素で管理されているため不要 */
    /* z-index: 10; */
    padding-bottom: 2rem; /* 必要に応じて調整 */
    position: relative;
    font-weight: bold;
    font-family: "toppan-bunkyu-gothic-pr6n", serif;
    font-weight: 800;
}

@keyframes undulatingTransform {
  0% {
    transform: scale(1) rotate(0deg) translateX(0px) translateY(0px);
          clip-path: polygon(10% 0%, 100% 0%, 90% 100%, 0% 100%);
  }
  25% {
    transform: scale(1.05) rotate(1deg) translateX(3px) translateY(-2px);
          clip-path: polygon(10% 0%, 100% 0%, 90% 90%, 0% 100%);
  }
  50% {
    transform: scale(0.95) rotate(-1deg) translateX(-3px) translateY(2px);
          clip-path: polygon(10% 0%, 90% 0%, 90% 100%, 0% 100%);
  }
  75% {
    transform: scale(1.03) rotate(1deg) translateX(2px) translateY(-3px);
          clip-path: polygon(10% 0%, 100% 0%, 90% 90%, 0% 100%);
  }
  100% {
    transform: scale(1) rotate(0deg) translateX(0px) translateY(0px);
          clip-path: polygon(20% 0%, 100% 0%, 90% 100%, 0% 100%);
  }
}

.random-transform {
  /* animation: randomTransform 3s infinite; */ /* 3秒で1回、無限ループ */
}

.random-transform {
    /* animation: undulatingTransform 20s infinite cubic-bezier(0.25, 0.5, 0.75, 1); */ /* 遅く、ウネるように */
    /* transform-origin: center; */ /* 変形の中心を中央に設定 */
}

.pff-about-blob-bg img {
    height: 90%;
    width: auto;
    text-align: center;
    margin: auto;
}



.pff-app-wrapper:before {
    background-color: #ffffff00;
    background-image: linear-gradient(90deg, #e0e0e0 1px, transparent 1px), /* 横線 */ linear-gradient(180deg, #e0e0e0 1px, transparent 1px);
    background-size: 40px 40px;
    background-position: 0 0, 0 0;
    content: "";
    display: block;
    position: fixed;
    animation: 0;
    bottom: 0;
    right: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
}

.main-visual .left {
    /* width: 80%; */
    /* background: #ff9200; */
    /* height: 100%; */
    /* display: inline-block; */
}

.main-visual .right {
    /* width: 40%; */
}

.pff-nav-desktop-list li {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 5rem;
    /* height: 5rem; */
    /* height: 6rem !important; */
}

.pff-nav-desktop-list li:last-child {
    background: #ffc502;
    width: 9rem;
}

.pff-nav-desktop-list li:last-child a {
    color: white;
}

.main-visual .left:before {
    content: "";
    display: block;
    width: 65%;
    height: 100%;
    /* background: #e62d8b; */
    position: absolute;
    top: 43px;
    left: -34px;
    border-radius: 20px;
}

.pff-organizers-section .pff-section-container {
    /* border: 2px solid #ff7bac; */
    /* border-radius: 1rem; */
    /* background: white; */
    width: 95%;
}

img.pff-organizer-logo-pff {
}

.arrows01 {
    width: 30px;
    height: 30px;
    /* border: 1px solid #000000; */
    display: flex !important;
    justify-content: center;
    align-items: center;
    border-radius: 100px;
    background: #e62d8b;
    color: white;
    margin-left: 0.5em;
}

.pff-contact-section .pff-contact-background.pff-contact-bg.random-transform img {
    /* transform: translate(50%, 0px); */
    /* max-width: inherit; */
    /* width: 50%; */
}

.pff-contact-info img {
    height: 7rem;
    padding-bottom: 1rem;
}

span.pff-about-highlight.color01:before {
    content: "";
    top: 50%;
    bottom: 0;
    right: 0;
    left: 0;
    background: #106afc;
    display: inline-block;
    z-index: -1;
    position: absolute;
    padding: 0.7em;
    transform: translate(0px, -50%);
}

span.pff-about-highlight.color02:before {
    content: "";
    top: 50%;
    bottom: 0;
    right: 0;
    left: 0;
    background: #7fc31d;
    display: inline-block;
    z-index: -1;
    position: absolute;
    padding: 0.7em;
    transform: translate(0px, -50%);
}


.sp {
    display: none;
    }



 .news-list {
      /* display: grid; */
      /* grid-template-columns: repeat(4, 1fr); */
      /* gap: 40px 24px; */
      /* padding: 40px 0px 0 0px; */
      /* max-width: 1100px; */
      /* margin: 0 auto; */
      /* position: relative; */
      /* width: 100%; */
 }

    .news-item {
      /* background: #fff; */
      border-radius: 12px;
      /* box-shadow: 0 3px 16px rgba(0,0,0,0.07); */
      padding: 0 0 24px 0;
      overflow: hidden;
      display: flex;
      flex-direction: column;
      min-width: 0;
      width: 24%;
    }
    .news-thumb {
      width: 100%;
      aspect-ratio: 4 / 3;
      object-fit: cover;
      border-radius: 0px 0px 0 0;
      display: block;
      background: #f0f0f0;
    }
.news-item .image {
    position: relative;
    border-radius: 15px 15px 15px 0;
    overflow: hidden;
}
    .news-label {
      font-size: 1.8rem;
      color: #f4a019;
      font-weight: bold;
      /* margin: 0 0px 8px 0px; */
      letter-spacing: 0.06em;
      line-height: 1.0;
      position: absolute;
      bottom: 0;
      left: 0;
      z-index: 2;
      background: #fff;
      border-radius: 0 10px 0px 0;
      display: inline-block;
      padding: 0 10px 0 0;
    }
    .news-title {
font-size: 0.9rem;
    font-weight: 500;
    color: #222;
    margin: 0 0px 0 0px;
    line-height: 1.5;
    /* min-height: 3.5em; */
    flex: 1 1 auto;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    font-weight: bold;
    overflow: hidden;
    margin-bottom: 8px;
    text-align: left;
    }
    .news-date {
color: #e23681;
    font-size: 0.9rem;
    font-weight: 500;
    /* margin: 6px 18px 0 18px; */
    letter-spacing: 0.03em;
    text-align: left;
    }
    .news-item a {
      text-decoration: none;
    }
    .more-link-wrap {
      text-align: right;
      max-width: 1100px;
      margin: 0px auto 0;
      padding: 0 0px 40px 0px;
      position: relative;
    }
    .more-link {
      display: inline-flex;
      align-items: center;
      font-size: 1.3rem;
      font-weight: 700;
      color: #222;
      background: transparent;
      border: none;
      cursor: pointer;
      text-decoration: none;
      transition: color 0.2s;
      justify-content: center;
      align-items: center;
      font-family: "RocknRoll One", sans-serif;
      font-weight: 400;
      font-style: normal;
    }
    .more-link:hover {
      color: #e23681;
    }
    .more-link-circle {
      display: inline-flex;
      justify-content: center;
      align-items: center;
      background: #e23681;
      color: #fff;
      font-size: 2.0rem;
      border-radius: 50%;
      width: 40px; height: 40px;
      margin-left: 10px;
      transition: background 0.2s;
    }
    .more-link:hover .more-link-circle {
      background: #f4a019;
      color: #fff;
    }

    /* SP: 2カラム→1カラム */
    @media (max-width: 1000px) {
      .news-list {/* grid-template-columns: repeat(2, 1fr); */}
    }




    @media (max-width: 767px) {
      .news-list {
    width: 100%;
}
.news-item {width: 48%;}
      .news-title, .news-date, .news-label {/* margin-left: 10px; */margin-right: 10px;}
      .more-link-wrap { padding-left: 10px; padding-right: 10px; }
    .news-label {
        font-size: 1.3rem;
        top: -9px;
        border-radius: 0 10px 0px 0;
        height: auto;
        top: inherit;
        left: 0;
        margin-left: 0;
    }
    .news-title {
        font-size: 0.88rem;
        letter-spacing: -0.05em;
    }
      .news-date {font-size: 0.8rem;}

        .arrows01 {
    width: 6vw;
    height: 6vw;
    top: -0.2vw;
    position: relative;
    margin-left: 0;
}
        
    }


    


    
.pff-about-blob-bg img {
    width: 130%;
    max-width: inherit;
    /* left: -10%; */
    position: relative;
}

.pff-about-blob-bg {
    width: 160%;
    margin-left: -30%;
    margin-right: -30%;
}

.pff-contact-section .pff-contact-background.pff-contact-bg.random-transform img {
    /* height: 120%; */
    width: 107vw;
    max-width: inherit;
    right: -6%;
    position: relative;
}





    @keyframes undulatingTransform {
  0% {
    transform: scale(1) rotate(0deg) translateX(0px) translateY(0px);
          clip-path: polygon(10% 0%, 100% 0%, 90% 100%, 0% 100%);
  }
  25% {
    transform: scale(1.05) rotate(1deg) translateX(3px) translateY(-2px);
          clip-path: polygon(10% 0%, 100% 0%, 90% 90%, 0% 100%);
  }
  50% {
    transform: scale(0.95) rotate(-1deg) translateX(-3px) translateY(2px);
          clip-path: polygon(10% 0%, 90% 0%, 90% 100%, 0% 100%);
  }
  75% {
    transform: scale(1.03) rotate(1deg) translateX(2px) translateY(-3px);
          clip-path: polygon(10% 0%, 100% 0%, 90% 90%, 0% 100%);
  }
  100% {
    transform: scale(1) rotate(0deg) translateX(0px) translateY(0px);
          clip-path: polygon(20% 0%, 100% 0%, 90% 100%, 0% 100%);
  }
}

.random-transform {
  /* animation: randomTransform 3s infinite; */ /* 3秒で1回、無限ループ */
}

.random-transform {
    /* animation: undulatingTransform 20s infinite cubic-bezier(0.25, 0.5, 0.75, 1); */ /* 遅く、ウネるように */
    /* transform-origin: center; */ /* 変形の中心を中央に設定 */
}

.pff-about-blob-bg img {
    height: 90%;
    width: 70%;
    text-align: center;
    margin: auto;
}



.pff-app-wrapper:before {
    background-color: #ffffff00;
    background-image: linear-gradient(90deg, #c4d9ff 2px, transparent 2px), /* 横線 */ linear-gradient(180deg, #c4d9ff 2px, transparent 2px);
    background-size: 40px 40px;
    background-position: 0 0, 0 0;
    content: "";
    display: block;
    position: fixed;
    animation: 0;
    bottom: 0;
    right: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    opacity: 0.3;
    display: none;
}

.main-visual .left {
    /* width: 80%; */
    /* background: #ff9200; */
    /* height: 100%; */
    /* display: inline-block; */
    width: 100%;
    height: 58vw;
}

.main-visual .right {
    width: 100%;
}

.pff-nav-desktop-list li {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 5rem;
    /* height: 5rem; */
    font-family: "RocknRoll One", sans-serif;
    font-weight: 400;
    font-style: normal;
}

.pff-nav-desktop-list li:last-child {
    background: #ffc502;
    width: 9rem;
    /* height: 6rem; */
}

.pff-nav-desktop-list li:last-child a {
    color: white;
}

.main-visual .left:before {
    content: "";
    display: block;
    width: 100%;
    height: 47.8rem;
    /* background: #e62d8b; */
    position: absolute;
    top: 0;
    left: 0px;
    border-radius: 20px;
    border: none;
    /* outline: 9px solid #e62d8b; */ /* 外側に太い線！ */
    outline-offset: 0px;        /* 外にずらす */
    transform: translate(0%, 0%);
}

.pff-organizers-section .pff-section-container {
    /* border: 2px solid #ff7bac; */
    /* border-radius: 1rem; */
    /* background: white; */
}

img.pff-organizer-logo-pff {
    height: 60px;
}

.pff-contact-section .pff-contact-background.pff-contact-bg.random-transform {/* width: 150%; *//* text-align: center; *//* margin-left: -25%; *//* margin-right: -25%; *//* top: 8rem; *//* display: flex; *//* justify-content: center; *//* align-items: center; */position: absolute;bottom: 6%;right: 0;display: none;}


.pff-contact-info img {
    /* width: 100px !important; */
    width: 144px;
    height: auto;
}

span.pff-about-highlight.color01:before {
    content: "";
    top: 50%;
    bottom: 0;
    right: 0;
    left: 0;
    background: #106afc;
    display: inline-block;
    z-index: -1;
    position: absolute;
    padding: 0.7em;
    transform: translate(0px, -50%);
}

span.pff-about-highlight.color02:before {
    content: "";
    top: 50%;
    bottom: 0;
    right: 0;
    left: 0;
    background: #7fc31d;
    display: inline-block;
    z-index: -1;
    position: absolute;
    padding: 0.7em;
    transform: translate(0px, -50%);
    left: 0;
    bottom: 0; /* テキストの一番下に */
    width: 100%;
    height: 2px; /* 線の太さ */
     /* 好きな色 */
    border-radius: 1px;
}






@media (max-width: 767px) {
.pc {
    display: none;
}

.sp {
    display: block;
}

    .main-visual .left:before {
    display: none !important;
}

.main-visual .left {
    background: inherit !important;
    width: 100% !important;
    height: 169vw;
}

    img.main-logo.sp {
    left: 5vw;
    width: 89vw;
    position: relative;
}

.main-visual .right {
    width: 90%;
}

    

.pff-award-card-yellow {
    min-height: inherit;
}

.pff-section-container {
    width: 95%;
}
.pff-award-card-subtitle {
        font-size: 9vw;
}
.pff-award-card-yellow {
    border: 3px dashed #fa343d;
    border-radius: 6vw;
    height: 67vw;
    max-height: inherit !important;
    min-height: inherit !important;
}
.pff-copyright {
    font-size: 3.5vw;
}
.pff-award-card-pink {
    border: 3px dashed #fa343d;
    align-items: center;
    justify-content: center;
    border-radius: 6vw;
    height: 63vw;
    max-height: inherit;
    min-height: inherit;
}
    p.pff-award-card-promo {
    font-size: 13vw;
}

.pff-award-cards-wrapper {
    height: auto;
    /* width: 95%; */
    margin: auto;
}

    


.pff-about-blob-bg img {
    /* width: 149%; */
    /* height: 100%; */
    /* max-height: inherit !important; */
}

.pff-about-blob-bg {
    width: 240%;
    margin-left: -70%;
    margin-right: -70%;
}

    .pff-main-content {
    margin-left: 0;
    width: 100%;
}

.pff-about-title img {
    width: 16rem;
    position: relative;
    top: 4px;
}

.pff-about-title {
    display: flex;
    align-items: baseline;
    gap: 0.2em;
    justify-content: center;
}

.pff-contact-section .pff-contact-background.pff-contact-bg.random-transform {
    width: 150%;
    margin-left: -40%;
    margin-right: -40%;
    top: 0rem;
}

.pff-contact-details-wrapper {
    flex-wrap: nowrap;
    flex-direction: inherit;
        width: 100%;
    margin: auto;
    gap: 1rem;
}

.pff-contact-info {
    /* width: 48%; */
}

.pff-contact-website-button {
        /* width: 48%; */
        padding: 1rem 1rem;
        font-size: 3vw;
        border-radius: 3vw;
}

.pff-contact-org-name {
    font-size: 1rem;
}

.pff-contact-info img {
    width: 22vw;
    margin-bottom: 0;
    padding-bottom: 0.5em;
}

.pff-contact-hours {
    font-size: 0.675rem;
}

p.pff-contact-tel {
    font-size: 1rem;
}
.pff-main-content {
    margin-top: 0;
}
    .pff-mobile-menu {
        top: 0rem;
        right: -1rem;
        height: 100vh;
        margin-top: 0;
        padding-top: 0;
}
    .pff-mobile-nav-list li {
    transform: rotate(-1deg);
}

.pff-header.is-scrolled {
    transform: scale(0.99) translateY(10px);
}

.pff-header {
    /* padding-top: 1rem; */
    overflow: unset !important;
}
    .pff-header-container {
    padding-left: 0;
    width: 95%;
    margin: auto;
    margin-right: 0;
    margin: 0;
}
    .pff-header-logo-group {
    padding-left: 0;
    position: absolute;
    left: 2vw;
    top: 2vw;
    z-index: 9999999;
}

.pff-header-title img {
    width: 21vw;
}

.pff-hamburger-icon {
    width: 4rem;
    height: 4rem;
}

.pff-contact-section .pff-contact-background.pff-contact-bg.random-transform img {
    /* height: 109%; */
    /* right: 4%; */
    /* position: relative; */
    width: 57rem;
}

    
.pff-about-text {
        font-size: 3.8vw;

}

    .pff-about-button {
    padding: 0.3em 1.3em;
}

    .pff-organizers-grid {
    padding: 0;
    justify-content: center;
    margin-bottom: 2em;
    padding: 6vw 0;
}

.pff-organizer-item {
    flex: 0 0 38%;
    font-size: 4vw;
}

.pff-organizer-item img {
    height: auto;
    width: 100%;
}

.pff-organizers-section .pff-section-container {
    padding-top: 1em;
}

.pff-section-heading {
    margin-bottom: 1em;
    font-size: 1.8rem;
}
    .pff-about-button i.fas.fa-chevron-right {
    width: 6vw;
    height: 6vw;
    border: 2px solid #000000;
    font-size: 3.3vw;
    border-radius: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: 1.4em;
}
    
    }



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

    .pff-left-sidebar {
    padding: 2em 0em;
    padding-right: 2em;
}
.pff-award-card-promo {
    font-size: 11vw !important;
    letter-spacing: 0.1em;
}
    
.main-visual .left:before {
    height: 66vw;
}

    
.news-list {
    /* width: 95%; */
}
.main-visual .left {height: 55vw;}

    
.pff-contact-section .pff-contact-background.pff-contact-bg.random-transform {
    width: 200%;
}

    
.pff-contact-section .pff-contact-background.pff-contact-bg.random-transform {
    width: 140%;
    text-align: center;
    /* padding-bottom: 60%; */
}
    .pff-contact-section .pff-contact-background.pff-contact-bg.random-transform img {width: 180%;}


.pff-left-sidebar {
    width: 25% !important;
}

.pff-main-content {
    width: 78%;
    margin-left: 22%;
}
    
}


.incolor {
    box-shadow: 2px 0 10px rgba(0, 0, 0, 0.05);
    background-color: #f8008d;
    width: 100%;
    height: 100vh;
    padding: 1.5rem 1em 1rem 1rem;
    padding-right: 1rem !important;
    /* overflow: scroll; */
    /* display: block; */
}

body.amiami {
    background-image: linear-gradient(90deg, #e0e0e0 1px, transparent 1px), linear-gradient(180deg, #e0e0e0 1px, transparent 1px);
    background-size: 30px 30px;
    background-position: 0 0, 0 0;
    background-attachment: fixed;
}

body {
    display: flex; /* サイドバーとメインコンテンツを横並びに */
    font-family: 'Inter', sans-serif;
    color: #333;
    margin: 0;
    padding: 0;
    line-height: 1.5;
    overflow-x: hidden;
}

/* 左サイドバー */
.pff-left-sidebar {
    width: 22%; /* サイドバーの幅 */
    position: fixed; /* 画面に固定 */
    left: 0;
    top: 0;
    min-height: 100vh; /* 画面の高さ一杯に */
    /* background-color: #f8008d; */ /* 背景色 */
    /* padding: 1.4rem 1.5em 1.4rem 1.5rem; */
    /* padding-right: 3rem !important; */
     /* å½± */
    display: flex;
    flex-direction: column; /* 中の要素を縦に並べる */
    align-items: center; /* 中央揃え */
    z-index: 1000;
    padding-right: 2rem;
    /* height: 800px; */
    /* overflow-y: scroll; */
}

.pff-left-sidebar a:hover {
    color: inherit;
    opacity: 0.8;
}

.pff-sidebar-logo {
    margin-bottom: 3rem;
}

.pff-sidebar-logo img {
    width: 120px;
}

.pff-sidebar-nav ul {
    list-style: none;
    padding: 0;
    margin: 0;
    text-align: left;
    /* height: 57vh; */
    display: flex;
    align-items: start;
    flex-wrap: wrap;
}

.pff-sidebar-nav li {
    /* margin-bottom: 1.5rem; */
    transform: rotate(-1.4deg);
}

.pff-sidebar-nav a {
    text-decoration: none;
    color: #ffffff;
    font-weight: 600;
    font-size: 1rem;
    transition: color 0.2s;
    font-family: "RocknRoll One", sans-serif;
    font-weight: 400;
    font-style: normal;
}

.pff-sidebar-nav a:hover {
    /* color: #e62d8b; */
    opacity: 0.8;
}

.pff-sidebar-sns {
    margin-top: auto; /* SNSアイコンを一番下に配置 */
    gap: 0.5rem;
    flex-wrap: inherit;
}

.pff-sidebar-sns a {
    color: #ffffff;
    font-size: 1rem;
    transition: color 0.2s;
    width: 100%;
    display: block;
    display: flex;
    justify-content: left;
    align-items: center;
    font-family: "RocknRoll One", sans-serif;
}

.pff-sidebar-sns a i.fab.fa-instagram {
    font-size: 2.5em;
}

.pff-sidebar-sns a i {
    line-height: 1em;
    height: 1em;
    font-size: 2em;
    text-align: center;
    /* display: flex; */
    /* justify-content: center; */
    /* max-width: inherit; */
    width: 50px;
}

.pff-sidebar-sns a i:before {
    /* width: 7em; */
}

.pff-sidebar-sns a:hover {
    /* color: #e62d8b; */
    opacity: 0.8;
}

/* メインコンテンツコンテナ */
.pff-main-container {
    flex-grow: 1; /* 残りの幅をすべて使用 */
    margin-left: 240px; /* サイドバーの幅だけ左にマージン */
    width: calc(100% - 240px); /* 幅を計算 */
}

/* === ヘッダー === */
/* ヘッダーはSP表示でのみ使用するため、PCでは非表示にする */
.pff-header {
    display: none; /* PCでは非表示 */
    position: fixed; /* SPで表示する際に固定 */
    /* width: 100%; */
    /* z-index: 99999; */
}

/* ===== SP表示 (767px以下) のためのメディアクエリ ===== */
@media (max-width: 767px) {
    body {
        display: block; /* 通常の縦並びに戻す */
    }

    /* PC用のサイドバーを非表示に */
    .pff-left-sidebar {
        display: none;
    }

    /* メインコンテンツを画面幅全体に */
    .pff-main-container {
        margin-left: 0;
        width: 100%;
    }

    /* SP用のヘッダーを表示 */
    .pff-header {
        display: flex; /* ハンバーガーメニューを表示するためにflexに */
        background-color: transparent;
        height: 17vw;
        transition: height 0.3s ease, background-color 0.3s ease;
        z-index: 99;
    }
    
    .pff-header.is-scrolled {
        background-color: rgb(255 255 255 / 88%);
        height: 110px;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
        margin: 0 1%;
        width: 98%;
        border-radius: 100px;
        transform: scale(0.99) translateY(10px);
        backdrop-filter: blur(16px);
        -webkit-backdrop-filter: blur(16px);
    }
    
    /* ハンバーガーボタンを表示 */
    .pff-hamburger-button {
        display: block;
        /* display: none; を上書き */
        /* border: 2px solid #000000; */
        border-radius: 100px;
        /* background: white; */
        right: 2vw;
        position: absolute;
        height: 14vw;
        width: 14vw;
        display: block;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap;
        padding: 3vw;
    }

        .pff-header {
        display: flex;
        background-color: transparent;
        height: 17vw;
        transition: height 0.3s ease, background-color 0.3s ease;
        z-index: 99;
        width: 100%;
    }

    body {
        display: block;
        width: 100%;
        overflow-x: hidden;
        max-width: 100%;
    }

    html {
        width: 100%;
        overflow-x: hidden;
    }

.pff-header {
    margin: 0;
}

.pff-header-container {
    margin: 0;
    padding: 0;
}

.pff-about-public {width: 100%;}
    
    /* PC用のナビゲーションを非表示に */
    .pff-nav-desktop {
        display: none;
    }
    
    /* その他SP用の調整 */
    .pff-main-content {
        /* margin-top: 3rem; */ /* ヘッダーとかぶらないように調整 */
    }
    
    /* PCクラスは非表示、SPクラスは表示 */
    .pc {
        display: none;
    }
    .sp {
        display: block;

        
    }translateX.custom-hamburger {
  width: 100px;
  height: 100px;
  background: #fff;
  border: 3px solid #111;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 18px;  /* 3本線の間隔 */
  box-shadow: 0 2px 8px rgba(0,0,0,0.04);
  cursor: pointer;
  padding: 0;
}

.bar {
  display: block;
  height: 1vw;
  background: #212a32;
  border-radius: 4.5px;
  transition: all 0.3s;
}

.bar1 {
  width: 8vw;
}
.bar2 {
  width: 8vw;
}
.bar3 {
  width: 8vw; /* 一番下の線だけ短く */
}

}


/* === 既存のCSSへの上書き・調整 === */
/* ヘッダー関連のスタイルはSP用に調整されるため、既存のPC用スタイルを上書きします */

.pff-header-container {
    width: 100%;
    margin-right: 0;
    padding-left: 1rem;
    padding-right: 1rem;
}

/* 既存の .pff-nav-desktop-list 関連のスタイルはサイドバーに移行したため、不要であれば削除可能です */
/* 例: .pff-nav-desktop-list li { ... } */

/* メインコンテンツのヒーローセクションのマージンを調整 */
.main-visual {
    margin-top: 0; /* ヘッダーがなくなったのでマージンをリセット */
}
@media (max-width: 767px) {
    .main-visual {
        margin-top: 9vw; /* SPではヘッダーがあるのでマージンを戻す */
    }
}



/* ===== 左サイドバー 縦書きテキストのアニメーション ===== */
.pff-sidebar-vertical-text-wrapper {
    position: absolute;
    top: 0;
    right: 0;
    transform: translate(0%, 0);
    width: 2rem; /* テキストの幅に合わせて調整 */
    height: 100%;
    overflow: hidden; /* アニメーションエリア外を隠す */
    z-index: 99999; /* 他のコンテンツの背面に配置 */
    pointer-events: none; /* クリックイベントを透過 */
    border: 3px dashed #f9008d;
}

.pff-sidebar-vertical-text {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    color: #e62d8b;
    font-size: 1.2rem;
    white-space: nowrap;
    writing-mode: vertical-rl; /* 縦書き（右から左へ） */
    -webkit-writing-mode: vertical-rl;
    /* text-orientation: upright; を削除 */
    line-height: 1.8;
    animation: scroll-vertical 45s linear infinite; /* アニメーション時間を45秒に変更 */
    font-weight: bold;
    writing-mode: sideways-lr;
    font-family: "RocknRoll One", sans-serif;
    font-weight: 400;
    font-style: normal;
    letter-spacing: -0.07em;
    /* color: #fff; */
    font-weight: 900;
    /* font-size: 1.18rem; */
    letter-spacing: 0.15em;
    text-shadow: 0 0 1px #ffffff, 0 0 1px #ffffff, 1px 1px 0 #fff, -1px -1px 0 #fff;
}

@keyframes scroll-vertical {
    0% {
        transform: translate(-50%, 0);
    }
    100% {
        /* アニメーションの終点を-50%に変更 */
        transform: translate(-50%, -50%);
    }
}

/* SP表示ではアニメーションを停止する場合 */
@media (max-width: 767px) {
    .pff-sidebar-vertical-text-wrapper {
        display: none;
    }

    .pff-sidebar-sns.sp {
position: absolute;
        bottom: 2vw;
        left: 6vw;
        width: 80%;
}

.pff-sidebar-sns a {
        font-size: 1.3rem;
        justify-content: left;
}

.pff-sidebar-sns.sp i {
    padding-right: 1.5em;
}
}

/* 必要に応じて、他のサイドバー要素との重なりなどを調整してください */
.pff-sidebar-logo {
    position: relative; /* z-indexを有効にするため */
    z-index: 1;
    margin-bottom: 3rem;
}

.pff-sidebar-nav {
    position: relative; /* z-indexを有効にするため */
    z-index: 1;
    /* height: 390px; */
}
.menu_03box {
    /* overflow: scroll; */
    height: 100%;
    overflow: scroll;
    width: 100%;
}

.menu_03box .inscroll {
    height: auto;
}
.pff-sidebar-sns {
    position: relative; /* z-indexを有効にするため */
    z-index: 1;
    width: 100%;
    display: flex;
    margin-top: 4rem;
    flex-wrap: wrap;
}
.pff-sidebar-sns a {
    width: 100%;
    text-align: center;
    display: inline-block;
    display: flex;
}

.pff-sidebar-bottom {
    display: flex;
    margin-top: 4rem;
}

.pff-sidebar-bottom a.pff-sidebar-bottom-item {
    display: flex;
    flex-wrap: wrap;
    /* flex-direction: column-reverse; */
    justify-content: center;
}

.pff-sidebar-bottom a.pff-sidebar-bottom-item {}
.pff-sidebar-bottom a.pff-sidebar-bottom-item small {
    display: block;
}
.pff-sidebar-bottom a.pff-sidebar-bottom-item img {
    width: auto !important;
    height: auto !important;
}

.pff-sidebar-bottom span {
    text-decoration: none;
    color: #ffffff;
    font-size: 1rem;
    transition: color 0.2s;
    font-family: "RocknRoll One", sans-serif;
    font-weight: 400;
    font-style: normal;
    line-height: 1em !important;
    text-align: center;
}





/* 基本：PC・SP共通 ナビリンクの色・挙動 */
.pff-mobile-nav-list a,
.pff-nav-desktop-link,
.pff-sidebar-menu li a {
  /* color: #fff; */
  text-decoration: none;
  transition: color 0.2s;
}

/* ホバー＆アクティブ時は黄色に */
.pff-mobile-nav-list li.active > a,
.pff-mobile-nav-list a.active,
.pff-mobile-nav-list a:hover,
.pff-nav-desktop-link.active,
.pff-nav-desktop-link:hover,
.pff-sidebar-menu li.active > a,
.pff-sidebar-menu li a.active,
.pff-sidebar-menu li a:hover {
  color: #FFE600 !important;
}

/* サブメニューにも同様の色変化 */
.pff-mobile-nav-list .submenu a,
.pff-sidebar-menu .submenu a {
  color: #fff;
  transition: color 0.2s;
}

.pff-mobile-nav-list .submenu a.active,
.pff-mobile-nav-list .submenu a:hover,
.pff-sidebar-menu .submenu a.active,
.pff-sidebar-menu .submenu a:hover {
  color: #FFE600;
}

/* 子メニュー（サブメニュー）用のインデントとサイズ調整 */
.pff-mobile-nav-list .submenu,
.pff-sidebar-menu .submenu {
  list-style: none;
  padding-left: 20px;
  margin-top: 4px;
  margin-bottom: 4px;
}

.pff-mobile-nav-list .submenu li,
.pff-sidebar-menu .submenu li {
  font-size: 1em;
  font-weight: 400;
  /* margin-bottom: 8px; */
  transform: inherit;
}

/* 親メニューにだけ下矢印 */
.pff-mobile-nav-list .has-children > a:after,
.pff-sidebar-menu .has-children > a:after {
  content: "▼";
  font-size: 0.8em;
  opacity: 0.7;
  margin-left: 0.2em;
}

/* モバイル用SNS部分の見た目改善 */
.pff-sidebar-sns.sp a {
  display: flex;
  align-items: center;
  color: #fff;
  margin-bottom: 10px;
  font-size: 1rem;
  gap: 6px;
  text-decoration: none;
  transition: color 0.2s;
}
.pff-sidebar-sns.sp a:hover {
  color: #FFE600;
}
.pff-sidebar-sns.sp i {
  font-size: 1.2em;
}









/*仮想ページ*/
.pff-public-desc {
  margin-bottom: 38px;
  font-family: "RocknRoll One", sans-serif;
  font-weight: 400;
  font-style: normal;
  text-align: center;
}



.pff-public-desc p {
  font-size: 1.1rem;
  color: #222;
  font-weight: 500;
  margin-bottom: 10px;
}

.text_center {
    text-align: center;
    /* transform: rotateZ(-1deg) translate(-50%, 0px); */
    font-family: "RocknRoll One", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 1.9rem;
    padding-top: 10vh;
    text-align: left;
    /* margin-left: 70%; */
    width: 100%;
    text-align: center;
}

.pff-public-desc .pff-public-marker {
  display: inline-block;
  background: #ffe180;
  color: #222;
  font-weight: bold;
  font-size: 1.05rem;
  padding: 0.2em 0.7em;
  margin: 12px 0;
  border-radius: 6px;
}


.sec_title {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  font-size: 2.3rem;
  font-weight: bold;
  margin-bottom: 48px;
  line-height: 1.25;
  z-index: 0;
  text-align: center;
  background: url('img/sec_title_bg.png') center center/contain no-repeat;
  padding: 62px 0 48px 0; /* 上下の余白は画像サイズで調整 */
  width: 95%;
  max-width: 800px;
  margin: auto;
  font-family: "RocknRoll One", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.sec_title .red {
  background: #e62d8b;
  color: #fff;
  padding: 0.18em 2.7em;
  border-radius: 5px;
  display: inline-block;
  font-size: 2.6rem;
  font-weight: normal;
  line-height: 1.12;
  margin-bottom: 12px;
}

.sec_title span:not(.red) {
  color: #111;
  font-size: 2.2rem;
  font-weight: bold;
  margin-top: 0;
  display: block;
  letter-spacing: 0.05em;
}

@media (max-width: 700px) {
  .sec_title {
    padding: 9vw 0 9vw 0;
    background-size: 150vw auto;
    margin: 0;
    /* max-width: 100%; */
    width: 105%;
    margin-left: -2.5%;
    margin-right: -2.5%;
    font-size: 1.7rem;
  }

    .pff-animal-walk-section {
    right: 0vw;
}

    .animal-walk-bg img:nth-child(1) {
    right: -141% !important;
}
    
  .sec_title .red {
    padding: 0.13em 0.2em;
    margin-bottom: 8px;
    font-size: 2.2rem;
  }
  .sec_title span:not(.red) {
    font-size: 1.09rem;
  }
}









.pff-judge-section {
  background: #fff url("your-grid-bg.png") repeat;
  /* グリッド背景画像（パターン）はここで指定 or 背景色だけでもOK */
  position: relative;
  padding: 60px 0 100px 0;
  background-image: linear-gradient(90deg, #e0e0e0 1px, transparent 1px), linear-gradient(180deg, #e0e0e0 1px, transparent 1px);
  background-size: 30px 30px;
  background-position: 0 0, 0 0;
  background-attachment: fixed;
  width: 100%;
  padding-bottom: 300px;
  margin-bottom: -260px;
  padding-top: 15rem;
  margin-top: -19rem;
  z-index: -1;
}

.pff-judge-bg {
  /* グリッド背景が画像の場合はこちら */
  /* position: absolute; left:0; top:0; width:100%; height:100%; z-index:0; opacity:0.8; */
}

.pff-judge-inner {
  max-width: 1200px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
  text-align: center;
}

.pff-judge-title-wrap {
  display: inline-block;
  align-items: flex-end;
  justify-content: center;
  gap: 18px;
  margin-bottom: 0;
  position: relative;
}

.pff-judge-bubble {
  color: #fff;
  padding: 12px 28px 7px 18px;
  font-size: 1.3rem;
  font-weight: bold;
  /* margin-right: 12px; */
  /* margin-bottom: 10px; */
  display: inline-block;
  position: relative;
  background-image: url(img/pff-judge-bubble.png);
  background-size: 130px;
  background-repeat: no-repeat;
  background-position: 2px 17px;
  height: 110px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  right: 0rem;
  top: -3rem;
  transform: translate(50%, -50%);
}

.pff-judge-title {
  font-size: 2.7rem;
  font-weight: bold;
  color: #222;
  font-family: 'RocknRoll One', 'sans-serif', 'Arial';
  letter-spacing: 0.01em;
  margin: 0 0 5px 0;
}

.pff-judge-desc {
  font-size: 1.13rem;
  color: #222;
  margin-top: 2px;
  margin-bottom: 54px;
  line-height: 1.65;
}
.pff-judge-desc .judge-note {
  font-size: 0.98em;
  color: #888;
  margin-left: 12px;
}

.pff-judge-list {
  display: flex;
  flex-direction: column;
  gap: 38px;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  max-width: 1100px;
}

.pff-judge-card {
  width: 94vw;
  max-width: 900px;
  min-height: 40vh;
  background: rgba(255,255,255,0.8);
  border: 3px solid #111;
  border-radius: 18px;
  font-size: 2.05rem;
  font-family: 'RocknRoll One', 'Arial', sans-serif;
  color: #111;
  font-weight: bold;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  box-sizing: border-box;
}

@media (max-width: 700px) {
  .pff-judge-title {
    font-size: 1.5rem;
  }
    .pff-judge-title-wrap h2.pff-judge-title {
    font-size: 2.4rem;
    font-weight: normal;
}
    .pff-judge-desc {
    font-size: 1rem;
    font-family: "RocknRoll One", sans-serif;
    font-weight: 400;
    font-style: normal;
}
  .pff-judge-card {
    font-size: 1.12rem;
    min-height: 44px;
    border-width: 2px;
  }
}















.pff-selection-section {
  z-index: 1;
  padding-top: 10rem;
  padding-bottom: 10rem;
  overflow: hidden;
  position: relative;
}

.pff-selection-bg {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  z-index: 0;
  overflow: hidden;
  width: 160%;
  margin-left: -30%;
  margin-right: -30%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.pff-selection-bg img {
  /* position: absolute; */
  left: 0;
  top: 0;
  object-fit: cover;
  z-index: 0;
  height: 100%;
  width: auto;
  text-align: center;
  margin: auto;
}
.pff-selection-bg .sp { display: none; }
@media (max-width: 800px) {
  .pff-selection-bg .pc { display: none; }
  .pff-selection-bg .sp { display: block; }
}

.pff-selection-content {
  position: relative;
  z-index: 1;
  max-width: 1020px;
  margin: 0 auto;
  text-align: center;
  color: #fff;
}

.pff-selection-title {
  margin-bottom: 42px;
  line-height: 1.18;
  font-size: 3rem;
  font-family: "RocknRoll One", sans-serif;
  font-weight: 400;
  font-style: normal;
  letter-spacing: -0.05em;
}

.pff-selection-list {
  display: flex;
  justify-content: center;
  gap: 1rem;
  margin-top: 14px;
}

.pff-selection-list ul {
  list-style: none;
  padding: 0;
  margin: 0;
  text-align: left;
  font-size: 1rem;
  font-weight: 500;
  line-height: 2.12;
  color: #fff;
  text-shadow: 0 2px 14px #ea2e9c4c, 0 1px 0 #e62d8b22;
}

@media (max-width: 800px) {
  .pff-selection-content {
    padding: 0 7vw;
  }
  .pff-selection-title {
    font-size: 1.28rem;
  }
  .pff-selection-list {
    flex-direction: column;
    gap: 18px;
  }
  .pff-selection-list ul {
    font-size: 1.02rem;
    text-align: center;
  }
}





.pff-judge-links {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 22px 34px;
  justify-content: center;
  align-items: center;
  width: fit-content;
  margin: 54px auto 48px auto;
}

.pff-judge-btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-width: 300px;
  max-width: 330px;
  min-height: 86px;
  background: #fff;
  border: 3px solid #e62d8b;
  border-radius: 20px;
  color: #e62d8b;
  font-weight: bold;
  font-size: 1.5rem;
  padding: 0 28px 0 28px;
  text-decoration: none;
  box-sizing: border-box;
  transition: box-shadow 0.2s, border-color 0.18s, transform 0.16s;
  box-shadow: 0 3px 10px #e62d8b09;
  letter-spacing: 0.02em;
}

.pff-judge-btn .arrow {
  font-size: 2.1rem;
  margin-left: 10px;
  display: flex;
  align-items: center;
}

.pff-judge-btn:hover {
  border-color: #ff63b3;
  box-shadow: 0 4px 22px #ff93d439;
  transform: translateY(-3px) scale(1.04);
  background: #fff4fa;
}

.pff-judge-btn span {
  display: block;
  text-align: left;
  line-height: 1.18;
  font-family: "RocknRoll One", "Kaisei Opti", sans-serif;
}

@media (max-width: 700px) {
  .pff-judge-links {
    /* grid-template-columns: 1fr; */
    gap: 5px;
    width: 95%;
    /* max-width: 370px; */
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  .pff-judge-btn {
    min-width: unset;
    width: 49%;
    font-size: 1rem;
    padding: 0 8px;
    min-height: 64px;
    max-width: none;
    margin-bottom: 0.5rem;
    gap: 0;
  }
}



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

.pff-contact-section {
    padding-top: 7rem;
    padding-bottom: 7rem;
    background-size: 160%;
    margin-top: -3rem;
    margin-bottom: -3rem;
}
        
}




.pff-animal-walk-section {
position: relative;
    width: 100%;
    min-height: 170px;
    overflow: hidden;

}
.animal-walk-bg img {
  display: block;
  width: 3rem;
  max-width: 100%;
  height: auto;
}
.animal {
  position: absolute;
  bottom: 30px; /* 床合わせ。個別調整可 */
  width: 90px;  /* 動物サイズ */
  animation-timing-function: linear;
  /* 初期位置を個別に調整（JSでアニメ） */
}


img {}

.animal-walk-bg img:nth-child(1) {
    width: 24rem;
    right: -111%;
    position: relative;
    transform: translate(-100%, 0px);
}