/* ======================================================================================

    COMMON

====================================================================================== */

  body {
    background-image: url(../../images/pages/chicken-curry/bg_ptrn.webp);
    font-family: "Zen Old Mincho", serif;
    font-weight: 400;
    font-size: 16px;
  }
  .bg_ptrn,
  .bg_ptrn-bf::before {
    background-image: url(../../images/pages/chicken-curry/bg_ptrn.webp);
  }

/* animation
**************************************** */
  [data-show], [data-step] {
    opacity: 0;
    transform: translateY(12px);
    transition: opacity .8s cubic-bezier(0.17,0.84,0.44,1),
    transform .8s ease;
  }
  [data-show].no_trans, [data-step].no_trans {
    transform: translateY(0);
  }
  .is-show { opacity: 1; transform: none; filter: blur(0px); }

/* ttl
**************************************** */

  h1,h2,h3,h4,h5 {
    font-weight: 500;
  }

  /* --- heading & fnt-size--- */
  .head1 {    font-size: 375%; }
  .head2 {    font-size: 312%; }
  .head3 {    font-size: 250%; }
  .head4 {    font-size: 188%; }
  .head5 {    font-size: 137%; }
  .fnt-xl  {  font-size: 125%; }
  .fnt-lg  {  font-size: 113%; }
  .fnt-sm  {  font-size: 88%; }
  .fnt-xs  {  font-size: 81% }
  .fnt-xxs {  font-size: 75% }
  .fnt-maxs { font-size: 70% }

  @media (max-width: 1480px) {
    .head1 {    font-size: 312%; }
    .head2 {    font-size: 250%; }
    .head3 {    font-size: 188%; }
    .head4 {    font-size: 160%; }
    .head5 {    font-size: 125%; }
    .fnt-xl  {  font-size: 116%; }
    .fnt-lg  {  font-size: 108%; }
  }
  @media (max-width: 1064px) {
    .head1 {    font-size: 250%; }
    .head2 {    font-size: 188%; }
    .head3 {    font-size: 160%; }
    .head4 {    font-size: 150%; }
    .head5 {    font-size: 116%; }
    .fnt-xl  {  font-size: 108%; }
    .fnt-lg  {  font-size: 104%; }
  }
  @media (max-width: 560px) {
    .head1 {    font-size: 188%; }
    .head2 {    font-size: 150%; }
    .head3 {    font-size: 140%; }
    .head4 {    font-size: 130%; }
    .head5 {    font-size: 112%; }
    .fnt-xl  {  font-size: 106%; }
  }
  @media (min-width: 561px) {
    body:is([data-height~="b-3"],[data-height~="b-2"]) .head1 { font-size: 250%; }
    body:is([data-height~="b-3"],[data-height~="b-2"]) .head2 { font-size: 188%; }
    body:is([data-height~="b-3"],[data-height~="b-2"]) .head3 { font-size: 160%; }
    body:is([data-height~="b-3"],[data-height~="b-2"]) .head4 { font-size: 150%; }
    body:is([data-height~="b-3"],[data-height~="b-2"]) .head5 { font-size: 125%; }
    body:is([data-height~="b-3"],[data-height~="b-2"]) .fnt-xl  {  font-size: 116%; }
    body:is([data-height~="b-3"],[data-height~="b-2"]) .fnt-lg  {  font-size: 108%; }
  }


/* layout
**************************************** */

  /* --- inner --- */
  .inner {
    width: 90%;
    max-width: 1280px;
    margin: 0 auto;
  }
  .inner-xs { max-width: 880px; }
  .inner-sm { max-width: 1064px; }
  .inner-lg { max-width: 1600px; }
  .inner-xl { max-width: 1920px }

  /* --- sect_pdg --- */
  .sect_pdg-sm {
    padding-top: 120px;
    padding-bottom: 120px;
  }
  .sect_pdg {
    padding-top: 144px;
    padding-bottom: 144px;
  }
  .sect_pdg-sm {
    padding-top: 96px;
    padding-bottom: 96px;
  }
  .sect_pdg-lg {
    padding-top: 200px;
    padding-bottom: 200px;
  }
  .pdg_no { padding: 0 !important; }
  .pdg_no-top { padding-top: 0 !important; }
  .pdg_no-btm { padding-bottom: 0 !important; }

  @media screen and  (max-width: 1064px) {
    .sect_pdg {
      padding-top: 96px;
      padding-bottom: 96px;
    }
    .sect_pdg-sm {
      padding-top: 80px;
      padding-bottom: 80px;
    }
  }
  @media screen and  (max-width: 560px) {
    .inner { width: calc(100% - 32px); }
    .sect_pdg {
      padding-top: 64px;
      padding-bottom: 64px;
    }
    .sect_pdg-sm {
      padding-top: 48px;
      padding-bottom: 48px;
    }
  }

/* txt
**************************************** */

  /* --- default --- */
  .clr-def, .clr-def-bf::before, .clr-def-af::after,
  a, .wp-pagenavi a, .wp-pagenavi span, select, button,
  .cf_form .btn-form.btn-back {
    color: #231815; fill: #231815;
  }
  .bg_clr-def, .bg_clr-def-bf::before, .bg_clr-def-af::after {
    background-color: #231815;
  }
  .bdr_clr-def, .bdr_clr-def-bf::before, .bdr_clr-def-af::after {
    border-color: #231815;
  }
  @media (any-hover: hover) {
    .hov_area:hover .hov-clr-def, .hov-clr-def:hover,
    .hov_area:hover .hov-clr-def-bf::before, .hov-clr-def-bf:hover::before,
    .hov_area:hover .hov-clr-def-af::after, .hov-clr-def-af:hover::after {
      color: #231815; fill: #231815;
    }
    .hov_area:hover .hov-bg_clr-def, .hov-bg_clr-def:hover,
    .hov_area:hover .hov-bg_clr-def-bf::before, .hov-bg_clr-def-bf:hover::before,
    .hov_area:hover .hov-bg_clr-def-af::after, .hov-bg_clr-def-af:hover::after {
      background-color: #231815;
    }
    .hov_area:hover .hov-bdr_clr-def, .hov-bdr_clr-def:hover,
    .hov_area:hover .hov-bdr_clr-def-bf::before, .hov-bdr_clr-def-bf:hover::before,
    .hov_area:hover .hov-bdr_clr-def-af::after, .hov-bdr_clr-def-af:hover::after {
      border-color: #231815;
    }
  }

  /* --- main --- */
  .clr-main, .clr-main-bf::before, .clr-main-af::after {
    color: #e8380d; fill: #e8380d;
  }
  .bg_clr-main, .bg_clr-main-bf::before, .bg_clr-main-af::after {
    background-color: #e8380d;
  }
  .bdr_clr-main, .bdr_clr-main-bf::before, .bdr_clr-main-af::after {
    border-color: #e8380d;
  }
  @media (any-hover: hover) {
    .hov_area:hover .hov-clr-main, .hov-clr-main:hover,
    .hov_area:hover .hov-clr-main-bf::before, .hov-clr-main-bf:hover::before,
    .hov_area:hover .hov-clr-main-af::after, .hov-clr-main-af:hover::after {
      color: #e8380d; fill: #e8380d;
    }
    .hov_area:hover .hov-bg_clr-main, .hov-bg_clr-main:hover,
    .hov_area:hover .hov-bg_clr-main-bf::before, .hov-bg_clr-main-bf:hover::before,
    .hov_area:hover .hov-bg_clr-main-af::after, .hov-bg_clr-main-af:hover::after {
      background-color: #e8380d;
    }
    .hov_area:hover .hov-bdr_clr-main, .hov-bdr_clr-main:hover,
    .hov_area:hover .hov-bdr_clr-main-bf::before, .hov-bdr_clr-main-bf:hover::before,
    .hov_area:hover .hov-bdr_clr-main-af::after, .hov-bdr_clr-main-af:hover::after {
      border-color: #e8380d;
    }
  }

  /* --- main_lt --- */
  .clr-main_lt, .clr-main_lt-bf::before, .clr-main_lt-af::after {
    color: #e7582e; fill: #e7582e;
  }
  .bg_clr-main_lt, .bg_clr-main_lt-bf::before, .bg_clr-main_lt-af::after {
    background-color: #e7582e;
  }
  .bdr_clr-main_lt, .bdr_clr-main_lt-bf::before, .bdr_clr-main_lt-af::after {
    border-color: #e7582e;
  }
  @media (any-hover: hover) {
    .hov_area:hover .hov-clr-main_lt, .hov-clr-main_lt:hover,
    .hov_area:hover .hov-clr-main_lt-bf::before, .hov-clr-main_lt-bf:hover::before,
    .hov_area:hover .hov-clr-main_lt-af::after, .hov-clr-main_lt-af:hover::after {
      color: #e7582e; fill: #e7582e;
    }
    .hov_area:hover .hov-bg_clr-main_lt, .hov-bg_clr-main_lt:hover,
    .hov_area:hover .hov-bg_clr-main_lt-bf::before, .hov-bg_clr-main_lt-bf:hover::before,
    .hov_area:hover .hov-bg_clr-main_lt-af::after, .hov-bg_clr-main_lt-af:hover::after {
      background-color: #e7582e;
    }
    .hov_area:hover .hov-bdr_clr-main_lt, .hov-bdr_clr-main_lt:hover,
    .hov_area:hover .hov-bdr_clr-main_lt-bf::before, .hov-bdr_clr-main_lt-bf:hover::before,
    .hov_area:hover .hov-bdr_clr-main_lt-af::after, .hov-bdr_clr-main_lt-af:hover::after {
      border-color: #e7582e;
    }
  }

  /* --- sub --- */
  .clr-sub, .clr-sub-bf::before, .clr-sub-af::after {
    color: #2c8756; fill: #2c8756;
  }
  .bg_clr-sub, .bg_clr-sub-bf::before, .bg_clr-sub-af::after {
    background-color: #2c8756;
  }
  .bdr_clr-sub, .bdr_clr-sub-bf::before, .bdr_clr-sub-af::after {
    border-color: #2c8756;
  }
  @media (any-hover: hover) {
    .hov_area:hover .hov-clr-sub, .hov-clr-sub:hover,
    .hov_area:hover .hov-clr-sub-bf::before, .hov-clr-sub-bf:hover::before,
    .hov_area:hover .hov-clr-sub-af::after, .hov-clr-sub-af:hover::after {
      color: #2c8756; fill: #2c8756;
    }
    .hov_area:hover .hov-bg_clr-sub, .hov-bg_clr-sub:hover,
    .hov_area:hover .hov-bg_clr-sub-bf::before, .hov-bg_clr-sub-bf:hover::before,
    .hov_area:hover .hov-bg_clr-sub-af::after, .hov-bg_clr-sub-af:hover::after {
      background-color: #2c8756;
    }
    .hov_area:hover .hov-bdr_clr-sub, .hov-bdr_clr-sub:hover,
    .hov_area:hover .hov-bdr_clr-sub-bf::before, .hov-bdr_clr-sub-bf:hover::before,
    .hov_area:hover .hov-bdr_clr-sub-af::after, .hov-bdr_clr-sub-af:hover::after {
      border-color: #2c8756;
    }
  }

  /* --- sub_lt --- */
  .clr-sub_lt, .clr-sub_lt-bf::before, .clr-sub_lt-af::after {
    color: #4f9566; fill: #4f9566;
  }
  .bg_clr-sub_lt, .bg_clr-sub_lt-bf::before, .bg_clr-sub_lt-af::after {
    background-color: #4f9566;
  }
  .bdr_clr-sub_lt, .bdr_clr-sub_lt-bf::before, .bdr_clr-sub_lt-af::after {
    border-color: #4f9566;
  }
  @media (any-hover: hover) {
    .hov_area:hover .hov-clr-sub_lt, .hov-clr-sub_lt:hover,
    .hov_area:hover .hov-clr-sub_lt-bf::before, .hov-clr-sub_lt-bf:hover::before,
    .hov_area:hover .hov-clr-sub_lt-af::after, .hov-clr-sub_lt-af:hover::after {
      color: #4f9566; fill: #4f9566;
    }
    .hov_area:hover .hov-bg_clr-sub_lt, .hov-bg_clr-sub_lt:hover,
    .hov_area:hover .hov-bg_clr-sub_lt-bf::before, .hov-bg_clr-sub_lt-bf:hover::before,
    .hov_area:hover .hov-bg_clr-sub_lt-af::after, .hov-bg_clr-sub_lt-af:hover::after {
      background-color: #4f9566;
    }
    .hov_area:hover .hov-bdr_clr-sub_lt, .hov-bdr_clr-sub_lt:hover,
    .hov_area:hover .hov-bdr_clr-sub_lt-bf::before, .hov-bdr_clr-sub_lt-bf:hover::before,
    .hov_area:hover .hov-bdr_clr-sub_lt-af::after, .hov-bdr_clr-sub_lt-af:hover::after {
      border-color: #4f9566;
    }
  }

/* btn
**************************************** */
  .btn-def {
    width: 510px;
    max-width: 100%;
  }
  .btn-def .btn--in {
    height: 80px;
    padding-left: 40px;
    padding-right: 40px;
  }
  .btn-def .svg_ico-arrow {
    scale: .8;
  }
  .btn-def .bg,
  .btn-def .bg::before {
    border-radius: 100vmax;
  }
  .btn-def .bg {
    box-shadow: 0 0 0 5px rgba(255,255,255,.8);
  }
  @keyframes arrow_mov {
    0% {
      opacity: 1;
      translate: 0 0;
    }
    40% {
      opacity: 0;
      translate: 8px 0;
    }
    60% {
      opacity: 0;
      translate: -8px 0;
    }
    100% {
      opacity: 1;
      translate: 0 0;
    }
  }
  @media (any-hover: hover) {
    .btn-def:hover .bg::before {
      opacity: 0;
    }
    .hov_area:hover .svg_ico-arrow {
      animation-duration: 1.8s;
      animation-timing-function: cubic-bezier(0.22, 0.61, 0.36, 1);
      animation-delay: 0s;
      animation-iteration-count: infinite;
      animation-fill-mode: forwards;
      animation-name: arrow_mov;
    }
  }
  @media (min-width: 561px) {
    body:is([data-height~="b-3"],[data-height~="b-2"]) .btn-def {
      width: 420px;
    }
    body:is([data-height~="b-3"],[data-height~="b-2"]) .btn-def .btn--in {
      height: 64px;
      padding-left: 32px;
      padding-right: 32px;
    }
    body:is([data-height~="b-3"],[data-height~="b-2"]) .btn-def svg {
      width: 32px;
      height: 32px;
    }
  }
  @media (max-width: 768px) {
    .btn-def {
      width: 320px;
    }
    .btn-def .btn--in {
      padding-left: 24px;
      padding-right: 24px;
      height: 64px;
    }
    .btn-def .btn--in .head4 {
      font-size: 128%;
    }
    .btn-def .btn--in svg {
      width: 24px;
      height: 24px;
    }
  }
  @media (max-width: 413px) {
    .btn-def {
      width: 100%;
    }
    .btn-def .btn--in {
      height: 56px;
    }
    .btn-def .btn--in .head4 {
      font-size: 116%;
    }
  }

/* prlx
**************************************** */
  .prlx_area {
    width: 100%;
    padding-top: 42%;
  }
  .prlx {
    height: 100%;
  }
  .prlx_in {
    height: 110%;
  }
  .prlx_cont {
    top: -5%;
    height: 110%;
  }
  .prlx-full {
    height: 60vh;
  }

  .sect-prlx .inner .img_area {
    width: 100%;
    height: 30vw;
    margin-top: -10vw;
  }

/* stripe
**************************************** */
  .stripe {
    position: absolute;
  }
  .stripe::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
  .stripe-ver {
    width: 16px;
    height: 100%;
  }
  .stripe-ver::before {
    background-repeat: repeat-y;
    background-size: 16px 6px;
  }
  .stripe-ver.stripe-wht::before {
    background-image: url(../../images/pages/chicken-curry/stripe-ver-wht.png);
  }
  .stripe-ver.stripe-blk::before {
    background-image: url(../../images/pages/chicken-curry/stripe-ver-blk.png);
  }
  .stripe-ver.flip::before {
    transform: scale(-1, 1);
  }
  .stripe-hor {
    width: 100%;
    height: 16px;
  }
  .stripe-hor::before {
    background-repeat: repeat-x;
    background-size: 6px 16px;
  }
  .stripe-hor.stripe-wht::before {
    background-image: url(../../images/pages/chicken-curry/stripe-hor-wht.webp);
  }
  .stripe-hor.stripe-blk::before {
    background-image: url(../../images/pages/chicken-curry/stripe-hor-blk.webp);
  }
  .stripe-hor.flip::before {
    transform: scale(-1, -1);
  }
  @media (max-width: 768px) {
    .stripe-ver {
      width: 12px;
    }
    .stripe-ver::before {
      background-size: 12px 5px;
    }
    .stripe-hor {
      height: 12px;
    }
    .stripe-hor::before {
      background-size: 5px 12px;
    }
  }

/* bg
**************************************** */
  .bg_diza,
  .bg_diza-bf::before {
    background-image: url(../../images/pages/chicken-curry/diza.webp);
  }
  .bg_grad-main,
  .bg_grad-main-bf::before {
    background: linear-gradient(30deg, #e8380d 0%, #ffcb3d 100%);
  }
  .bg_grad-main_rev {
    background: linear-gradient(30deg, #ffcb3d 0%, #e8380d 100%);
    background-size: 130%;
    background-position: center;
  }

/* column
**************************************** */
  .clm {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  .clm-2 { gap: 40px; }
  .clm-2 > * { width: calc((100% - 40px) / 2); }
  .clm-3 { gap: 24px; }
  .clm-3 > * { width: calc((100% - 24px*2) / 3); }
  .clm-4 { gap: 24px; }
  .clm-4 > * { width: calc((100% - 24px*3) / 4); }
  .clm-5 { gap: 20px; }
  .clm-5 > * { width: calc((100% - 20px*4) / 5); }
  @media screen and (max-width: 1680px) {
    .clm-1-xlpc { gap: 48px; }
    .clm-1-xlpc > * { width: 100%; }
    .clm-2-xlpc { gap: 40px; }
    .clm-2-xlpc > * { width: calc((100% - 40px) / 2); }
    .clm-3-xlpc { gap: 32px; }
    .clm-3-xlpc > * { width: calc((100% - 32px*2) / 3); }
    .clm-4-xlpc { gap: 24px; }
    .clm-4-xlpc > * { width: calc((100% - 24px*3) / 4); }
    .clm-5-xlpc { gap: 20px; }
    .clm-5-xlpc > * { width: calc((100% - 20px*4) / 5); }
  }
  @media screen and (max-width: 1480px) {
    .clm-1-lgpc { gap: 48px; }
    .clm-1-lgpc > * { width: 100%; }
    .clm-2-lgpc { gap: 40px; }
    .clm-2-lgpc > * { width: calc((100% - 40px) / 2); }
    .clm-3-lgpc { gap: 32px; }
    .clm-3-lgpc > * { width: calc((100% - 32px*2) / 3); }
    .clm-4-lgpc { gap: 24px; }
    .clm-4-lgpc > * { width: calc((100% - 24px*3) / 4); }
    .clm-5-lgpc { gap: 20px; }
    .clm-5-lgpc > * { width: calc((100% - 20px*4) / 5); }
  }
  @media screen and (max-width: 1280px) {
    .clm-1-smpc { gap: 40px; }
    .clm-1-smpc > * { width: 100%; }
    .clm-2-smpc { gap: 32px; }
    .clm-2-smpc > * { width: calc((100% - 32px) / 2); }
    .clm-3-smpc { gap: 24px; }
    .clm-3-smpc > * { width: calc((100% - 24px*2) / 3); }
    .clm-4-smpc { gap: 20px; }
    .clm-4-smpc > * { width: calc((100% - 20px*3) / 4); }
    .clm-5-smpc { gap: 16px; }
    .clm-5-smpc > * { width: calc((100% - 16px*4) / 5); }
  }
  @media screen and (max-width: 1064px) {
    .clm-1-xspc { gap: 32px; }
    .clm-1-xspc > * { width: 100%; }
    .clm-2-xspc { gap: 24px; }
    .clm-2-xspc > * { width: calc((100% - 24px) / 2); }
    .clm-3-xspc { gap: 20px; }
    .clm-3-xspc > * { width: calc((100% - 20px*2) / 3); }
    .clm-4-xspc { gap: 16px; }
    .clm-4-xspc > * { width: calc((100% - 16px*3) / 4); }
    .clm-5-xspc { gap: 12px; }
    .clm-5-xspc > * { width: calc((100% - 12px*4) / 5); }
  }
  @media screen and (max-width: 960px) {
    .clm-1-tab { gap: 32px; }
    .clm-1-tab > * { width: 100%; }
    .clm-2-tab { column-gap: 24px; row-gap: 64px; }
    .clm-2-tab > * { width: calc((100% - 24px) / 2); }
    .clm-3-tab { gap: 20px; }
    .clm-3-tab > * { width: calc((100% - 20px*2) / 3); }
    .clm-4-tab { gap: 16px; }
    .clm-4-tab > * { width: calc((100% - 16px*3) / 4); }
    .clm-5-tab { gap: 12px; }
    .clm-5-tab > * { width: calc((100% - 12px*4) / 5); }
  }
  @media screen and (max-width: 768px) {
    .clm-1-lgsp { gap: 32px; }
    .clm-1-lgsp > * { width: 100%; }
    .clm-2-lgsp { gap: 24px; }
    .clm-2-lgsp > * { width: calc((100% - 24px) / 2); }
    .clm-3-lgsp { gap: 20px; }
    .clm-3-lgsp > * { width: calc((100% - 20px*2) / 3); }
    .clm-4-lgsp { gap: 16px; }
    .clm-4-lgsp > * { width: calc((100% - 16px*3) / 4); }
    .clm-5-lgsp { gap: 12px; }
    .clm-5-lgsp > * { width: calc((100% - 12px*4) / 5); }
  }
  @media screen and (max-width: 560px) {
    .clm-1-sp { gap: 24px; }
    .clm-1-sp > * { width: 100%; }
    .clm-2-sp { gap: 16px; }
    .clm-2-sp > * { width: calc((100% - 16px) / 2); }
    .clm-3-sp { gap: 16px; }
    .clm-3-sp > * { width: calc((100% - 16px*2) / 3); }
    .clm-4-sp { gap: 12px; }
    .clm-4-sp > * { width: calc((100% - 12px*3) / 4); }
    .clm-5-sp { gap: 8px; }
    .clm-5-sp > * { width: calc((100% - 8px*4) / 5); }
  }
  @media screen and (max-width: 413px) {
    .clm-1-smsp { gap: 16px; }
    .clm-1-smsp > * { width: 100%; }
    .clm-2-smsp { gap: 12px; }
    .clm-2-smsp > * { width: calc((100% - 12px) / 2); }
    .clm-3-smsp { gap: 12px; }
    .clm-3-smsp > * { width: calc((100% - 12px*2) / 3); }
    .clm-4-smsp { gap: 8px; }
    .clm-4-smsp > * { width: calc((100% - 8px*3) / 4); }
    .clm-5-smsp { gap: 6px; }
    .clm-5-smsp > * { width: calc((100% - 6px*4) / 5); }
  }
  @media screen and (max-width: 374px) {
    .clm-1-xssp { gap: 16px; }
    .clm-1-xssp > * { width: 100%; }
    .clm-2-xssp { gap: 12px; }
    .clm-2-xssp > * { width: calc((100% - 12px) / 2); }
    .clm-3-xssp { gap: 12px; }
    .clm-3-xssp > * { width: calc((100% - 12px*2) / 3); }
    .clm-4-xssp { gap: 8px; }
    .clm-4-xssp > * { width: calc((100% - 8px*3) / 4); }
    .clm-5-xssp { gap: 6px; }
    .clm-5-xssp > * { width: calc((100% - 6px*4) / 5); }
  }



/* ======================================================================================

    PLUGIN

====================================================================================== */
  .slick-dots {
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-bottom: 3px solid;
    padding-left: 8px;
    padding-right: 8px;
    translate: 0 -8px;
  }
  .slick-dots li {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 29px;
    height: 40px;
  }
  .slick-dots .slick-dot {
    width: 5px;
    height: 20px;
  }
  .slick-dots .slick-dot::before {
    opacity: 0;
  }
  .slick-dots .slick-active .slick-dot::before {
    opacity: 1;
  }
  @media (any-hover: hover) {
    .slick-dots li:not(.slick-active):hover .slick-dot {
      opacity: .6;
    }
  }
  @media (max-width: 1064px) {
    .slick-dots li {
      width: 25px;
      height: 36px;
    }
    .slick-dots .slick-dot {
      width: 4px;
      height: 18px;
    }
  }


/* ======================================================================================

    LOADING

====================================================================================== */
  .loading .herb {
    position: static;
    transform: scale(.7);
  }
  .loading .ls-0 {
    display: inline-block;
  }
  .loading .loading--cont {
    padding-top: 80px;
    padding-bottom: 96px;
    width: 960px;
    max-width: 100%;
  }
  .loading .stripe {
    position: absolute;
    top: 0;
    height: 100%;
    clip-path: inset(100% 0 -20% 0);
  }
  .loading .stripe-lft {
    left: 0;
  }
  .loading .stripe-rgt {
    right: 0;
  }
  .loaded .loading,
  .loaded .loading .stripe,
  .loaded .loading .herb_list,
  .loaded .loading .ttl,
  .loaded .loading .ttl .clr-main,
  .loaded .loading .txt {
    animation-timing-function: cubic-bezier(0.86,0,0.07,1);
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
    animation-duration: 1s;
  }
  .loaded .loading .stripe-lft {
    animation-name: mask-to_btm;
  }
  .loaded .loading .stripe-rgt {
    animation-name: mask-to_top;
  }
  .loading .herb_list,
  .loading .ttl,
  .loading .ttl .clr-main,
  .loading .txt {
    opacity: 0;
  }
  .loaded .loading .herb_list,
  .loaded .loading .ttl,
  .loaded .loading .ttl .clr-main,
  .loaded .loading .txt {
    animation-timing-function: cubic-bezier(0.17,0.84,0.44,1);
    animation-name: fade-to_top;
  }
  .loaded .loading .herb_list {
    animation-delay: 1s;
  }
  .loaded .loading .ttl {
    animation-delay: 1.1s;
  }
  .loaded .loading .txt {
    animation-delay: 1.2s;
  }
  .loaded .loading .ttl .clr-main {
    animation-duration: 1.5s;
    animation-delay: 1.8s;
    animation-name: fade_in-blur;
  }
  .loaded .loading .ttl .clr-main.clr_txt2 {
    animation-delay: 2s;
  }
  .loaded .loading {
    animation-timing-function: cubic-bezier(0.22,0.61,0.36,1);
    animation-delay: 4s;
    animation-duration: 2s;
    animation-name: fade_out-blur;
  }
  @media (min-width: 561px) {
    body:is([data-height~="b-3"],[data-height~="b-2"],[data-height~="b-1"]) .loading .herb_list {
      margin-top: -24px;
      margin-bottom: -24px;
    }
    body:is([data-height~="b-3"],[data-height~="b-2"],[data-height~="b-1"]) .loading .herb-mitsuba img {
      width: 85px;
      height: 100px;
    }
    body:is([data-height~="b-3"],[data-height~="b-2"],[data-height~="b-1"]) .loading .herb-yomogi img {
      width: 62px;
      height: 104px;
    }
    body:is([data-height~="b-2"]) .loading .loading--cont {
      padding-top: 56px;
      padding-bottom: 64px;
      width: 768px;
    }
    body:is([data-height~="b-1"]) .loading .loading--cont {
      padding-top: 40px;
      padding-bottom: 48px;
      width: 640px;
    }
  }
  @media (max-width: 1480px) {
    .loading .loading--cont {
      width: 768px;
      max-width: calc(100% - 104px);
      padding-top: 40px;
      padding-bottom: 56px;
    }
  }
  @media (max-width: 1064px) {
    .loading .loading--cont {
      width: 600px;
      padding-top: 16px;
      padding-bottom: 32px;
    }
    .loading .herb-mitsuba img {
      width: 85px;
      height: 100px;
    }
    .loading .herb-yomogi img {
      width: 62px;
      height: 104px;
    }
  }
  @media (max-width: 560px) {
    .loading .loading--cont {
      padding-top: 40px;
      padding-bottom: 56px;
      max-width: calc(100% - 32px);
    }
  }
  @media (max-width: 413px) {
    .loading .head2 {
      font-size: 120%;
    }
    .loading .txt {
      font-size: 100%;
    }
  }


/* ======================================================================================

    HEADER & FOOTER

====================================================================================== */

/* buy_btn
*************************************************** */
  @keyframes scr_imgs {
    0% {
      background-position: 0 0;
    }
    100% {
      background-position: -1267px 0; /* 画像のマイナス幅 */
    }
  }
  @keyframes loop_fade {
    0% {
      opacity: 0;
      translate: 0 12px;
    }
    40% {
      opacity: 1;
    }
    60% {
      opacity: 1;
    }
    100% {
      opacity: 0;
      translate: 0 -12px;
    }
  }
  .buy_btn {
    position: relative;
    bottom: 0;
    right: 0;
    z-index: 100;
    box-shadow: 0 0 0 5px rgba(255,255,255,.8);
    border-radius: 16px;
  }
  .buy_btn .img_area,
  .buy_btn .img_area::before {
    border-radius: 16px 16px 0 0;
  }
  .buy_btn .img_area .clip_img {
    translate: 0 -24px;
    margin-bottom: -20px;
  }
  .buy_btn .btn-def {
    width: 416px;
  }
  .buy_btn .btn-def .btn--in {
    height: 64px;
  }
  .buy_btn .btn-def svg {
    width: 30px;
    height: 30px;
  }
  .buy_btn .btn-def .head4 {
    font-size: 137%;
    font-weight: 700;
  }
  .buy_btn .btn-def .bg {
    display: none;
  }
  .buy_btn .buy_btn_herbs {
    position: absolute;
    width: 80px;
    height: 72px;
    top: -52px;
  }
  .buy_btn .buy_btn_herbs-lft {
    left: -8px;
  }
  .buy_btn .buy_btn_herbs-rgt {
    right: 32px;
  }
  .buy_btn .scr_imgs {
    position: absolute;
    top: 50%;
    left: 0;
    z-index: -1;
    translate: 0 -50%;
    height: 134px;
    width: 100%;
  }
  .buy_btn .scr_imgs .img_src {
    background-image: url(../../images/pages/chicken-curry/buy_btn_scr_imgs.webp);
    background-repeat: repeat-x;
    background-size: auto 134px;
    animation-duration: 100s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    animation-fill-mode: forwards;
    animation-name: scr_imgs;
  }
  .buy_btn .herb .loop_fade {
    display: block;
    animation-duration: var(--duration,3s);
    animation-timing-function: cubic-bezier(0.22, 0.61, 0.36, 1);
    animation-delay: var(--delay,0s);
    animation-iteration-count: infinite;
    animation-fill-mode: forwards;
    animation-name: loop_fade;
  }

  /* --- is-fixed --- */
  .buy_btn.is-fixed {
    position: fixed;
    bottom: 20px;
    right: 20px;
    border-radius: 12px;
    opacity: 0;
    translate: 0 8px;
    pointer-events: none;
  }
  .buy_btn.is-fixed.is-show {
    opacity: 1;
    translate: 0 0;
    pointer-events: all;
  }
  .buy_btn.is-fixed .img_area,
  .buy_btn.is-fixed .img_area::before {
    border-radius: 12px 12px 0 0;
  }
  .buy_btn.is-fixed .img_area .clip_img {
    width: 200px;
  }
  .buy_btn.is-fixed .scr_imgs {
    height: 88px;
  }
  .buy_btn.is-fixed .scr_imgs .img_src {
    background-size: auto 88px;
  }
  .buy_btn.is-fixed .buy_btn_herbs {
    scale: .65;
  }
  .buy_btn.is-fixed .buy_btn_herbs-lft {
    left: -16px;
  }
  .buy_btn.is-fixed .buy_btn_herbs-rgt {
    right: 12px;
  }
  .buy_btn.is-fixed .btn-def .head4 {
    font-size: 100%;
  }
  .buy_btn.is-fixed .btn-def {
    width: 280px;
  }
  .buy_btn.is-fixed .btn-def .btn--in {
    height: 48px;
    padding-left: 24px;
    padding-right: 24px;
  }
  .buy_btn.is-fixed .btn-def svg {
    width: 24px;
    height: 24px;
  }
  @media (max-width: 560px) {
    .buy_btn.is-fixed {
      left: 12px;
      bottom: 12px;
      width: calc(100% - 24px);
      background: #e8380d;
      /*background: linear-gradient(45deg, #e8380d 0%, #ffcb3d 100%);*/
      border-radius: 100vmax;
    }
    .buy_btn.is-fixed .img_area {
      display: none;
    }
    .buy_btn.is-fixed .btn-def {
      width: 100%;
    }
    .buy_btn.is-fixed .btn-def .btn--in {
      color: #fff;
      height: 56px;
    }
    .buy_btn.is-fixed .btn-def .head4 {
      font-weight: 500;
    }
    .buy_btn.is-fixed .btn-def svg {
      fill: #fff;
    }
    .buy_btn.is-fixed .buy_btn_herbs-lft {
      left: -24px;
    }
    .buy_btn.is-fixed .buy_btn_herbs-rgt {
      right: -16px;
    }
  }

  @media (any-hover: hover) {
    .buy_btn:hover .btn--in {
      color: #e8380d;
    }
    .buy_btn:hover svg {
      fill: #e8380d;
    }
    .buy_btn:hover .img_area::before {
      opacity: 0;
    }
    .buy_btn:hover .img_area img {
      translate: 0 -26px;
    }
  }

/* copyright
*************************************************** */
  .footer--copyright {
    padding-top: 30px;
    padding-bottom: 30px;
  }
  .footer .stripe {
    top: 56px;
    height: calc(100% - 56px * 2);
  }
  .footer .stripe-lft {
    left: 40px;
  }
  .footer .stripe-rgt {
    right: 40px;
  }
  @media (max-width: 1680px) {
    .footer--in {
      padding-top: 96px;
      padding-bottom: 96px;
    }
    .footer .inner {
      padding-left: 40px;
      padding-right: 40px;
    }
  }
  @media (max-width: 1280px) {
    .footer .inner {
      -webkit-align-items: center;
      -ms-flex-align: center;
      align-items: center;
      row-gap: 144px;
    }
    .footer .txt_area {
      text-align: center;
    }
  }
  @media (max-width: 1064px) {
    .footer .logo img {
      width: 250px;
    }
  }
  @media (max-width: 768px) {
    .footer .inner {
      padding-left: 32px;
      padding-right: 32px;
    }
    .footer .stripe {
      top: 32px;
      height: calc(100% - 32px * 2);
    }
    .footer .stripe-lft {
      left: 16px;
    }
    .footer .stripe-rgt {
      right: 16px;
    }
  }
  @media (max-width: 560px) {
    .footer .inner {
      row-gap: 72px;
    }
    .footer .head2 {
      font-size: 130%;
    }
    .footer .txt_area .fnt-lg {
      font-size: 80%;
      letter-spacing: .1em;
    }
    .footer--in {
      padding-top: 64px;
      padding-bottom: 64px;
    }
    .footer .logo img {
      width: 180px;
    }
    .footer .buy_btn {
      width: 100%;
      border-radius: 12px;
    }
    .footer .buy_btn .img_area {
      border-radius: 12px 12px 0 0;
    }
    .footer .buy_btn .img_area .clip_img {
      width: 200px;
    }
    .footer .buy_btn .scr_imgs {
      height: 88px;
    }
    .footer .buy_btn .scr_imgs .img_src {
      background-size: auto 88px;
    }
    .footer .buy_btn .buy_btn_herbs {
      scale: .65;
    }
    .footer .buy_btn .buy_btn_herbs-lft {
      left: -16px;
    }
    .footer .buy_btn .buy_btn_herbs-rgt {
      right: 12px;
    }
    .footer .buy_btn .btn-def .head4 {
      font-size: 100%;
    }
    .footer .buy_btn .btn-def {
      width: 280px;
    }
    .footer .buy_btn .btn-def .btn--in {
      height: 48px;
      padding-left: 24px;
      padding-right: 24px;
    }
    .footer .buy_btn .btn-def svg {
      width: 24px;
      height: 24px;
    }
  }

/* herbs
*************************************************** */
  .herbs {
    position: absolute;
    inset: 0;
    pointer-events: none;
    overflow: hidden;
  }
  .herb { --mx: 0px; --my: 0px; }
  .herb {
    position: absolute;
    left: calc(var(--lx, 50%) + var(--mx));
    top:  calc(var(--ly, 50%) + var(--my));
    --flip-x: 1;
    transform: translate(-50%, -50%) scaleX(var(--flip-x, 1)) scaleY(var(--flip-y, 1)) rotate(var(--rot, 0deg)) scale(var(--scale, 1));
    transform-origin: center;
    will-change: transform, left, top;
    filter: blur(var(--blur, 0px));
  }
  .herb.flip { --flip-x: -1; }
  .herb img {
    display: block;
    max-width: none;
    width: auto;
    height: auto;
    filter: none;
    opacity: 0;
    translate: 0 8px;
    transition-delay: calc(var(--del) + 5s);
  }
  .loaded .herb img {
    opacity: 1;
    translate: 0 0;
  }
  .is-scroll-up .herb img {
    transition-delay: 0s;
  }
  .loaded .herb.is-hide img {
    opacity: 0;
    translate: 0 -8px;
    transition-delay: 0s;
  }
  .herb-mitsuba img { width: 148px; height: 173px; }
  .herb-yomogi  img { width: 111px; height: 185px; }
  .herb .assign {
    display: block;
    will-change: transform;
    animation: floaty var(--dur, 10s) ease-in-out infinite;
    animation-delay: var(--delay, 0s);
  }
  @keyframes floaty{
    0%   { transform: translate(0,0) rotate(0deg) scale(1); }
    20%  { transform: translate(calc(var(--ax, 6px)*.6),  calc(var(--ay,-10px)*.6))
                     rotate(calc(var(--rot, 3deg)*.6)) scale(1.005);}
    50%  { transform: translate(var(--ax, 6px), var(--ay, -10px))
                     rotate(var(--rot, 3deg))    scale(1.01);}
    80%  { transform: translate(calc(var(--ax, -6px)*.6), calc(var(--ay, 8px)*-.6))
                     rotate(calc(var(--rot,-3deg)*.6))    scale(1);}
    100% { transform: translate(0,0) rotate(0deg) scale(1); }
  }
  @media (max-width: 768px) {
    .herb { --scale: calc(var(--scale, 1) * 0.8); }
  }



/* ##############################################################################

    HERO

############################################################################## */
  .hero {
    position: relative;
    overflow: hidden;
  }
  .hero .inner {
    width: 100%;
    max-width: 100%;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 1;
  }
  .hero .layer {
    position: absolute;
    top: 0;
    left: 50%;
    translate: -50% 0;
    width: 68px;
    height: 100%;
    z-index: 0;
    overflow: hidden;
  }
  .hero .layer::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    translate: 0 -110%;
    transition: .8s all;
  }
  .loaded .hero .layer::before {
    transition-delay: 4.8s;
    translate: 0 0;
  }
  .hero .ttl,
  .hero .main_img,
  .hero .btn {
    opacity: 0;
  }
  .loaded .hero .ttl,
  .loaded .hero .main_img,
  .loaded .hero .btn {
    animation-timing-function: cubic-bezier(0.22,0.61,0.36,1);
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
    animation-duration: 1.2s;
    animation-name: fade-to_top;
  }
  .loaded .hero .ttl {
    animation-delay: 5.9s;
  }
  .loaded .hero .main_img {
    animation-delay: 6s;
  }
  .loaded .hero .btn {
    animation-delay: 6.1s;
  }
  .is-resize .hero .ttl,
  .is-resize .hero .main_img,
  .is-resize .hero .btn {
    animation-delay: 0s;
  }
  @media (min-width: 561px) {
    body:is([data-height~="b-4"]) .hero .ttl img {
      width: 272px;
      height: 200px;
    }
    body:is([data-height~="b-4"]) .main_img img {
      width: 553px;
      height: 316px;
    }
    body:is([data-height~="b-3"],[data-height~="b-2"]) .hero .herb img { scale: .8 }
    body:is([data-height~="b-3"],[data-height~="b-2"]) .hero .ttl img {
      width: 238px;
      height: 175px;
    }
    body:is([data-height~="b-3"],[data-height~="b-2"]) .main_img img {
      width: 483px;
      height: 276px;
    }
  }
  @media (max-width: 1480px) {
    .hero .herb img {
      scale: .8;
    }
    .hero .ttl img {
      width: 272px;
      height: 200px;
    }
    .main_img img {
      width: 553px;
      height: 316px;
    }
  }

  @media (max-width: 1064px) {
    .hero .herb img { scale: .8 }
    .hero .ttl img {
      width: 238px;
      height: 175px;
    }
    .main_img img {
      width: 483px;
      height: 276px;
    }
  }
  @media (max-width: 768px) {
    .hero .herb img {
      scale: .6;
    }
    .hero .herb-mitsuba-01 {
      top: 40%;
      left: 17%;
    }
    .hero .herb-yomogi-01 {
      top: 44%;
      left: 83%;
    }
  }
  @media (max-width: 560px) {
    .hero .herb img {
      scale: .4;
    }
    .hero .ttl img {
      width: 190px;
      height: 140px;
    }
    .main_img img {
      width: 320px;
      height: 183px;
    }
  }


/* ##############################################################################

    MESSAGE - NEW STYLE & IBUKISAN

############################################################################## */
  .message .mgn_txts {
    margin-left: 104px;
  }
  .message .img_area {
    position: absolute;
  }
  .message .img_area .img {
    overflow: clip;
    clip-path: inset(0);
  }
  @media (max-width: 1280px) {
    .message .mgn_txts {
      margin-left: 64px;
    }
  }
  @media (max-width: 960px) {
    .message .mgn_txts {
      font-size: 90%;
    }
  }
  @media (max-width: 768px) {
    .message .mgn_txts {
      margin-left: 40px;
    }
  }
  @media (max-width: 560px) {
    .message .mgn_txts {
      margin-left: 24px;
      line-height: 2.5em;
    }
  }

/* new style
*************************************************** */
  .new_style .txt_area {
    margin-left: 44%;
    margin-bottom: 9vw;
  }
  .new_style .img_area-lft {
    top: 144px;
    right: calc(56% + 104px);
    width: 32vw;
    max-width: 54%;
  }
  .new_style .img_area-lft .img-back {
    width: 100%;
    height: calc(100vh - 240px);
  }
  .new_style .img_area-lft .img-back .prlx_cont {
    translate: 0 -100px;
  }
  .new_style .img_area-lft .img-front {
    position: absolute;
    top: calc(100% - 120px);
    right: calc(100% - 110px);
    width: 11vw;
    height: 11vw;
    z-index: 1;
  }
  .new_style .img_area-rgt {
    bottom: 16%;
    left: 92%;
    width: 22vw;
    height: 14vw;
  }
  @media (max-width: 1680px) {
    .new_style .txt_area {
      margin-left: 34%;
    }
    .new_style .img_area-lft {
      width: 28vw;
      right: calc(34% + 484px);
    }
    .new_style .img_area-lft .img-back {
      height: calc(100vh - 400px);
    }
    .new_style .img_area-rgt {
      left: 72%;
    }
    .new_style .herb img {
      scale: .8;
    }
  }
  @media (max-width: 1280px) {
    .new_style .img_area-lft {
      top: 470px;
      right: calc(34% + 364px);
    }
    .new_style .img_area-lft .img-back {
      height: 540px;
    }
    .new_style .img_area-lft .img-front {
      top: -96px;
    }
  }
  @media (max-width: 960px) {
    .new_style .herb img {
      scale: .6;
    }
    .new_style .herb-mitsuba {
      top: 0;
      left: 106%;
    }
    .new_style .txt_area {
      margin-left: 26%;
    }
    .new_style .img_area-lft {
      top: 350px;
      right: calc(34% + 274px);
    }
    .new_style .img_area-lft .img-back {
      height: 420px;
    }
    .new_style .img_area-lft .img-front {
      top: -80px;
      right: calc(100% - 80px);
    }
    .new_style .img_area-rgt {
      left: 78%;
      bottom: 68%;
    }
  }
  @media (max-width: 768px) {
    .new_style .txt_area {
      margin-left: 0%;
    }
    .new_style .img_area-lft {
      width: 24vw;
      top: 64%;
      right: 6%;
    }
    .new_style .img_area-lft .img-front {
      top: -72px;
      right: -24px;
      width: 13vw;
      height: 13vw;
    }
    .new_style .img_area-lft .img-back {
      height: 43vw;
    }
    .new_style .img_area-rgt {
      width: 26vw;
      height: 17vw;
      left: 60%;
      bottom: 65%;
    }
  }
  @media (max-width: 560px) {
    .new_style hgroup {
      z-index: 1;
    }
    .new_style .herb-mitsuba {
      top: 0%;
      left: 85%;
    }
    .new_style .herb-yomogi {
      top: 13%;
      left: 108%;
    }
    .new_style .herb img {
      scale: .4;
    }
    .new_style .img_area-rgt {
      bottom: 8%;
      left: 74%;
      width: 30vw;
      height: 19vw;
      display: none;
    }
    .new_style .img_area-lft {
      width: 30vw;
      top: 24px;
      right: 4%;
    }
    .new_style .img_area-lft .img-back {
      height: 56vw;
    }
    .new_style .img_area-lft .img-front {
      top: -56px;
      right: -16px;
      width: 17vw;
      height: 17vw;
    }
  }

/* ibukisan
*************************************************** */
  .ibukisan .txt_area {
    margin-left: 5%;
  }
  .ibukisan .silhouette {
    position: absolute;
    top: -64px;
    right: 0;
    translate: 100% 0;
  }
  .ibukisan .img_area-rgt {
    bottom: 13%;
    left: calc(56% + 104px);
    width: 33.5vw;
    max-width: 54%;
  }
  .ibukisan .img_area-rgt .img-back {
    position: absolute;
    width: 88%;
    bottom: calc(100% - 120px);
    right: -96px;
    height: 66%;
  }
  .ibukisan .img_area-rgt .img-back .prlx_cont {
    translate: 0 -100px;
  }
  .ibukisan .img_area-rgt .img-front {
    width: 33.5vw;
    height: 33.5vw;
    z-index: 1;
  }
  .ibukisan .img_area-lft {
    top: 37%;
    right: 92%;
    width: 22vw;
    height: 14vw;
  }
  .ibukisan .sect_line {
    position: absolute;
    bottom: 100%;
    left: 0;
    width: 100%;
    height: 9vw;
  }
  .ibukisan .sect_line img {
    width: 100%;
    scale: 1.1;
  }
  @media (max-width: 1680px) {
    .ibukisan .txt_area {
      margin-left: 10%;
    }
    .ibukisan .img_area-rgt {
      bottom: 29%;
      left: calc(56% + 96px);
    }
    .ibukisan .img_area-rgt {
      width: 30vw;
    }
    .ibukisan .img_area-rgt .img-front {
      width: 30vw;
      height: 30vw;
    }
    .ibukisan .img_area-rgt .img-back {
      bottom: calc(100% - 104px);
    }
    .ibukisan .img_area-lft {
      top: 39%;
      right: 89%;
      width: 20vw;
      height: 13vw;
    }
  }
  @media (max-width: 1280px) {
    .ibukisan .silhouette img {
      scale: .8;
    }
  }
  @media (max-width: 960px) {
    .ibukisan .silhouette {
      top: -64px;
      translate: 75% 0;
    }
    .ibukisan .silhouette img {
      scale: .6;
    }
  }
  @media (max-width: 768px) {
    .ibukisan .txt_area {
      margin-left: 0;
    }
    .ibukisan .img_area-lft {
      top: 24%;
      right: 17%;
      width: 25vw;
      height: 15vw;
    }
    .ibukisan .img_area-rgt {
      width: 26vw;
      bottom: 32%;
      left: calc(56% + 86px);
    }
    .ibukisan .img_area-rgt .img-front {
      width: 26vw;
      height: 26vw;
    }
    .ibukisan .img_area-rgt .img-back {
      bottom: calc(100% - 92px);
      height: 80%;
    }
  }
  @media (max-width: 560px) {
    .ibukisan .txt_area {
      margin-bottom: 0;
    }
    .ibukisan .silhouette {
      translate: 55% 0;
    }
    .ibukisan .img_area-lft {
      display: none;
    }
    .ibukisan .img_area-rgt {
      bottom: 72%;
      left: calc(56% + 40px);
    }
    .ibukisan .img_area-rgt .img-back {
      bottom: calc(100% - 92px);
      height: 38vw;
      right: -26px;
    }
  }

/* gsap
*************************************************** */
  .gsap-enl_blur {
    height: 400vh;
  }
  .gsap-enl_blur .gsap_inner {
    height: 100vh;
  }
  .gsap-enl_blur .img_area picture {
    position: absolute;
    top: 50%;
    left: 50%;
    translate: -50% -50%;
    display: block;
    width: 100vw;
    height: 100vh;
  }
  .gsap-enl_blur .txt {
    width: 100vw;
    height: 100vh;
    left: 50%;
    translate: -50% 0;
  }
  .gsap-enl_blur .txt .head2 {
    opacity: 0;
    filter: blur(10px);
    scale: 1.1;
    transition-duration: 3s;
  }
  .gsap-enl_blur .txt.is-show + picture img {
    opacity: .3;
  }
  .gsap-enl_blur .txt.is-show .head2 {
    opacity: 1;
    filter: blur(0px);
    scale: 1;
  }
  .gsap-zoom_out {
    height: 200vh;
  }
  .gsap-zoom_out .gsap_inner {
    height: 100vh;
  }
  .gsap-zoom_out .bg_img {
    z-index: -1;
  }
  .gsap-zoom_out .bg_img picture {
    position: absolute;
    top: 50%;
    left: 50%;
    translate: -50% -50%;
    display: block;
    width: 100vw;
    height: 100vh;
  }
  @media (max-width: 1064px) {
    .gsap-enl_blur,
    .gsap-enl_blur .gsap_inner {
      height: 150vh;
    }
    .gsap-enl_blur .img_area picture {
      height: calc(80% / 3);
    }
    .gsap-enl_blur .img_area picture:nth-of-type(1) {
      top: 0;
      translate: -64% -16%;
      scale: .6;
    }
    .gsap-enl_blur .img_area picture:nth-of-type(2) {
      translate: -40% -70%;
      scale: .8;
    }
    .gsap-enl_blur .img_area picture:nth-of-type(3) {
      top: auto;
      top: inherit;
      bottom: 0;
      translate: -50% 0;
    }
    .gsap-enl_blur .txt.is-show + picture img {
      opacity: 1;
    }
    .gsap-enl_blur .txt {
      height: 100%;
    }
    .gsap-enl_blur .txt,
    .gsap-enl_blur .txt.is-show .head2 {
      opacity: 1;
      transform: none;
      filter: blur(0px);
    }
    .gsap-enl_blur .txt .head2:nth-of-type(1) {
      translate: 0 calc(-37vh + 50%);
    }
    .gsap-enl_blur .txt .head2:nth-of-type(2) {
      translate: 0 calc(21vh - 50%);
    }
  }
  @media (max-width: 560px) {
    .gsap-enl_blur .txt .head2 {
      font-size: 125%;
    }
  }

/* support_herbs
*************************************************** */
  .support_herbs .ttl_herbs {
    column-gap: 32px;
  }
  .support_herbs .ttl_herbs .herb {
    position: static;
    transform: none;
  }
  .support_herbs .ttl_herbs .herb-mitsuba img {
    width: 104px;
    height: 121px;
  }
  .support_herbs .ttl_herbs .herb-yomogi img {
    width: 80px;
    height: 130px;
  }
  .support_herbs .herbs_list--item {
    padding-top: 32px;
    padding-bottom: 32px;
    padding-left: 32px;
    padding-right: 16px;
    column-gap: 24px;
    border-radius: 8px;
    opacity: 0;
    translate: 0 12px;
  }
  .support_herbs .herbs_list.is-show .herbs_list--item {
    opacity: 1;
    translate: 0 0;
    transition-delay: var(--delay);
  }
  .support_herbs .herbs_list--item .herb_cat {
    padding-left: 16px;
    padding-right: 16px;
  }
  .support_herbs .herbs_list--item .herb_cat::before {
    border-radius: 1px;
    background-color: #d9d4c4;
  }
  @media (max-width: 1480px) {
    .support_herbs .herbs_list--item {
      padding-top: 20px;
      padding-bottom: 20px;
      padding-left: 28px;
      padding-right: 24px;
    }
    .support_herbs .herbs_list--item .img_area {
      margin-top: auto;
    }
    .support_herbs .herbs_list--item .img_area img {
      width: 96px;
    }
  }
  @media (max-width: 1064px) {
    .support_herbs .ttl_herbs .herb-mitsuba img {
      width: 88px;
      height: 100px;
    }
    .support_herbs .ttl_herbs .herb-yomogi img {
      width: 63px;
      height: 104px;
    }
  }
  @media (max-width: 960px) {
    .support_herbs .herbs_list--item {
      padding-left: 24px;
    }
    .support_herbs .herbs_list--item .img_area {
      position: absolute;
      right: 24px;
      bottom: calc(100% - 96px);
      z-index: -1;
    }
  }
  @media (max-width: 768px) {
    .support_herbs .herbs_list.clm-2-tab {
      row-gap: 40px;
    }
    .support_herbs .herbs_list--item {
      padding-left: 16px;
      padding-right: 16px;
    }
    .support_herbs .herbs_list--item .img_area {
      width: 72px;
      bottom: calc(100% - 88px);
      right: 12px;
    }
  }
  @media (max-width: 640px) {
    .support_herbs .herbs_list.clm-2-tab {
      column-gap: 12px;
      row-gap: 32px;
    }
    .support_herbs .herbs_list.clm-2-tab > *  {
      width: calc((100% - 12px) / 2);
    }
  }
  @media (max-width: 560px) {
    .support_herbs .ttl_herbs {
      column-gap: 16px;
    }
    .support_herbs .ttl_herbs .herb-mitsuba img {
      width: 62px;
      height: 70px;
    }
    .support_herbs .ttl_herbs .herb-yomogi img {
      width: 45px;
      height: 74px;
    }
    .support_herbs .herbs_list.clm-2-tab > * {
      width: 100%;
    }
    .support_herbs .herbs_list--item {
      padding-top: 16px;
      padding-bottom: 16px;
    }
    .support_herbs .herbs_list--item .img_area {
      right: 16px;
    }
    .support_herbs .last_txt {
      word-break: keep-all;
    }
    .support_herbs .herbs img {
      scale: .6;
    }
  }
  @media (max-width: 413px) {
    .support_herbs .last_txt {
      font-size: 90%;
    }
  }

/* culture
*************************************************** */
  .culture .inner {
    z-index: 1;
    column-gap: 104px;
  }
  .culture .img_area {
    row-gap: 8px;
  }
  .culture .img_area .img {
    width: 32vw;
    max-width: 498px;
    height: 33vh;
  }
  .culture .img_area .img:nth-of-type(1) {
    translate: -40px 0;
  }
  .culture .img_area .img:nth-of-type(2) {
    translate: 40px 0;
  }
  .culture .stripe {
    top: 96px;
    height: calc(100% - 192px);
    clip-path: inset(100% 0 -20% 0);
    animation-delay: .4s;
  }
  .culture .stripe-lft {
    left: 96px;
  }
  .culture .stripe-rgt {
    right: 96px;
  }
  .culture .stripe.is-show {
    animation-duration: .4s;
    animation-timing-function: cubic-bezier(0.22, 0.61, 0.36, 1);
    animation-delay: 0s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
  }
  .culture .stripe.is-show.stripe-lft {
    animation-name: mask-to_btm;
  }
  .culture .stripe.is-show.stripe-rgt {
    animation-name: mask-to_top;
  }
  @media (min-width: 561px) {
    body:is([data-height~="b-2"],[data-height~="b-1"]) .culture .mgn_txts {
      font-size: 80%;
    }
    body:is([data-height~="b-2"],[data-height~="b-1"]) .culture .img_area .img {
      max-width: 240px;
    }
  }
  @media (max-width: 1680px) {
    .culture .inner {
      padding-left: 80px;
      padding-right: 80px;
      column-gap: 80px;
    }
    .culture .head2 {
      font-size: 200%;
      margin-bottom: 32px;
    }
    .culture .stripe {
      top: 80px;
      height: calc(100% - 160px);
    }
    .culture .stripe-lft {
      left: 64px;
    }
    .culture .stripe-rgt {
      right: 64px;
    }
  }
  @media (max-width: 1064px) {
    .culture .inner {
      row-gap: 64px;
      padding-top: 80px;
      padding-bottom: 80px;
    }
    .culture .gsap-zoom_out,
    .culture .gsap-zoom_out .gsap_inner {
      height: auto;
    }
    .culture .head2 {
      font-size: 188%;
    }
    .culture .img_area {
      -webkit-flex-direction: row;
      -ms-flex-direction: row;
      flex-direction: row;
      column-gap: 8px;
      width: 100%;
    }
    .culture .img_area .img {
      width: calc(50% - 4px);
      height: 23vw;
    }
    .culture .img_area .img:nth-of-type(1) {
      translate: 0 -16px;
    }
    .culture .img_area .img:nth-of-type(2) {
      translate: 0 16px;
    }
    .culture .bg_img {
      position: absolute;
      inset: 0 16px;
      overflow: hidden;
      border-radius: 16px;
    }
    .culture .bg_img img {
      opacity: .3;
      filter: blur(8px);
    }
    .culture .stripe {
      top: 24px;
      height: calc(100% - 48px);
    }
    .culture .stripe-lft {
      left: 24px;
    }
    .culture .stripe-rgt {
      right: 24px;
    }
    .culture.visible .stripe {
      animation-duration: .4s;
      animation-timing-function: cubic-bezier(0.22, 0.61, 0.36, 1);
      animation-delay: 0s;
      animation-iteration-count: 1;
      animation-fill-mode: forwards;
    }
    .culture.visible .stripe.stripe-lft {
      animation-name: mask-to_btm;
    }
    .culture.visible .stripe.stripe-rgt {
      animation-name: mask-to_top;
    }
  }
  @media (max-width: 768px) {
    .culture .inner {
      padding-left: 32px;
      padding-right: 32px;
    }
    .culture .stripe-lft {
      left: 12px;
    }
    .culture .stripe-rgt {
      right: 12px;
    }
  }
  @media (max-width: 560px) {
    .culture .inner {
      row-gap: 48px;
      padding-top: 64px;
      padding-bottom: 40px;
    }
    .culture .head2 {
      font-size: 140%;
    }
    .culture .txt_area {
      padding-left: 8px;
      padding-right: 8px;
    }
    .culture .txt_area .mgn_txts {
      font-size: 90%;
    }
    .culture .img_area .img {
      height: 36vw;
    }
    .culture .img_area .img:nth-of-type(1) {
      translate: 0 -12px;
    }
    .culture .img_area .img:nth-of-type(2) {
      translate: 0 12px;
    }
    .culture .stripe {
      top: 16px;
      height: calc(100% - 32px);
    }
    .culture .stripe-lft {
      left: 8px;
    }
    .culture .stripe-rgt {
      right: 8px;
    }
    .culture .gsap-zoom_out .bg_img picture {
      width: 100%;
      height: 100%;
    }
  }
  @media (max-width: 413px) {
    .culture .inner {
      padding-left: 24px;
      padding-right: 24px;
    }
    .culture .bg_img {
      inset: 0 10px;
    }
  }

/* feature
*************************************************** */
  .feature .ttl_area .head1 {
    position: absolute;
    top: 45%;
    left: 60%;
    translate: 0 -50%;
    white-space: nowrap;
  }
  .feature .ttl_area img {
    width: 100%;
  }
  .feature .sect_line {
    position: absolute;
    left: 0;
    width: 100%;
    height: 11.09vw;
  }
  .feature .ttl_area .sect_line-top {
    top: -24px;
    z-index: -1;
  }
  .feature .feature--cont::before {
    z-index: -5;
  }
  .feature .feature--cont::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    z-index: -2;
    width: 100%;
    height: 80px;
    background: linear-gradient(to bottom, #ffffffff 0%, #ffffff00 100%);
  }
  .feature .feature--cont .sect_line-btm {
    bottom: calc(100% - 5.5vw);
    z-index: -10;
  }
  .feature .feature_list {
    margin-top: -32px;
    translate: 0 -80px;
    margin-bottom: -80px;
  }
  .feature .feature_list .slick-list {
    overflow: visible;
  }
  .feature .feature_list--item {
    margin-left: 20px;
    margin-right: 20px;
    padding: 72px;
  }
  .feature .feature_list--item::before,
  .feature .feature_list--item::after {
    border-radius: 100vmax;
  }
  .feature .feature_list--item::after {
    inset: 24px;
  }
  .feature .feature_list .feature_list--item.is-raised {
    transform: translateY(-64px);
    z-index: 2;
  }
  .feature .feature_list--item .num {
    inset: 38px;
  }
  .feature .feature_list--item .img_area {
    overflow: hidden;
    border-radius: 100vmax 100vmax 0 0 / 100vmax 100vmax 0 0;
  }
  .feature .feature_list--item .txt_area {
    position: relative;
    height: 170px;
  }
  .feature .feature_list--item .txt_area::before {
    content: '';
    position: absolute;
    bottom: -8px;
    left: 50%;
    width: 180px;
    height: 42px;
    opacity: .3;
    background-image: url(../../images/pages/chicken-curry/silhouette-spoon.svg);
    background-position: bottom center;
    background-repeat: no-repeat;
    background-size: cover;
    translate: -50% 0;
  }
  .feature .feature_list--item .txt_area .fnt-xxl {
    translate: 0 -16px;
  }
  @media (max-width: 1064px) {
    .feature .ttl_area {
      margin-bottom: 0;
    }
    .feature .ttl_area .sect_line-top {
      top: -16px;
    }
    .feature .feature_list {
      margin-top: 0;
      margin-bottom: -40px;
      translate: 0 -32px;
    }
    .feature .feature_list--item {
      padding: 60px;
      margin-left: 12px;
      margin-right: 12px;
    }
    .feature .feature_list--item::after {
      inset: 16px;
    }
    .feature .feature_list--item .num {
      inset: 30px;
    }
    .feature .feature_list .feature_list--item.is-raised {
      transform: translateY(-32px);
    }
    .feature .feature_list--item .txt_area::before {
      width: 140px;
      height: 33px;
    }
    .feature .feature_list--item .txt_area .fnt-xxl {
      font-size: 108%;
    }
  }
  @media (max-width: 960px) {
    .feature .inner {
      max-width: 480px;
    }
  }
  @media (max-width: 768px) {
    .feature .ttl_area {
      padding-bottom: 96px;
    }
    .feature .ttl_area::before {
      inset: 80px 0 0 0;
      height: 100vh;
      background-color: #000;
    }
    .feature .ttl_area img {
      width: 200vw;
    }
    .feature .ttl_area .head1 {
      top: calc(100% - 154px);
      left: 50%;
      translate: -50% 0;
      line-height: 1.4em;
    }
  }
  @media (max-width: 560px) {
    .feature .ttl_area {
      padding-bottom: 80px;
    }
    .feature .ttl_area .head1 {
      top: calc(100% - 108px);
    }
    .feature .feature_list--item {
      padding: 44px;
      margin-left: 4px;
      margin-right: 4px;
    }
    .feature .feature_list--item::after {
      inset: 10px;
    }
    .feature .feature_list--item .num {
      inset: 20px;
    }
    .feature .feature_list--item .txt_area {
      height: 33vw;
    }
    .feature .feature_list--item .txt_area::before {
      width: 100px;
      height: 23px;
    }
    .feature .feature_list--item .txt_area .fnt-xxl {
      font-size: 93%;
    }
  }

/* recipi
*************************************************** */
  @media (max-width: 960px) and (min-width: 561px) {
    .recipi_list--item {
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-align-items: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-justify-content: center;
      -ms-flex-pack: center;
      justify-content: center;
      text-align: left;
    }
    .recipi_list--item .img_area {
      margin-bottom: 0;
      max-width: 260px;
    }
    .recipi_list--item .head5 {
      width: 280px;
    }
  }
  @media (max-width: 560px) {
    .recipi_list--item .img_area {
      max-width: 300px;
      margin-left: auto;
      margin-right: auto;
    }
  }

/* sales
*************************************************** */
  .sales {
    padding-top: 80px;
    padding-bottom: 80px;
  }
  .sales--in,
  .sales--in::before {
    border-radius: 24px;
  }
  .sales--in {
    backdrop-filter: blur(8px);
    padding-top: 56px;
    padding-bottom: 64px;
    padding-left: 72px;
    padding-right: 72px;
  }
  .sales .img_list {
    column-gap: 8px;
  }
  .sales .bg_img {
    inset: 15px;
    border-radius: 16px;
    height: calc(100% - 15px * 2);
  }
  @media (max-width: 1064px) {
    .sales {
      height: auto;
      padding-top: 80px;
      padding-bottom: 80px;
      padding-left: 40px;
      padding-right: 40px;
    }
  }
  @media (max-width: 768px) {
    .sales .img_area .herb img {
      scale: .6;
    }
    .sales--in {
      padding-top: 40px;
      padding-bottom: 64px;
      padding-left: 40px;
      padding-right: 40px;
    }
  }
  @media (max-width: 560px) {
    .sales {
      padding-top: 48px;
      padding-bottom: 48px;
      padding-left: 28px;
      padding-right: 28px;
    }
    .sales--in {
      width: 100%;
      padding-top: 32px;
      padding-bottom: 56px;
      padding-left: 20px;
      padding-right: 20px;
    }
    .sales .mgn_txts {
      font-size: 100%;
    }
  }