@charset "UTF-8";
/* ===================================
VARIABLE
=================================== */
/* h1 40px */
/* h2 32px */
/* h3 28px */
/* h4 24px */
/* h5 20px */
/* h6 16px */
/* h7 14px */
/* h8 12px */
/* h9 10px */
.h1 {
  font-size: 2.5rem; }

/* h1 40px */
.h2 {
  font-size: 2rem; }

/* h2 32px */
.h3 {
  font-size: 1.75rem; }

/* h3 28px */
.h4 {
  font-size: 1.5rem; }

/* h4 24px */
.h5 {
  font-size: 1.25rem; }

/* h5 20px */
.h6 {
  font-size: 1rem; }

/* h6 16px */
.h7 {
  font-size: 0.875rem; }

/* h7 14px */
.h8 {
  font-size: 0.75rem; }

/* h8 12px */
.h9 {
  font-size: 0.625rem; }

/* h9 10px */
/* 80px */
/* 72px */
/* 64px */
/* 56px */
/* 48px */
.topSpace {
  padding-top: 60px; }

html {
  scroll-padding-top: 150px; }

body {
  font-family: "Montserrat", "Noto Sans JP", Helvetica, "Neue", Arial, sans-serif !important;
  color: #000 !important;
  background: #eeeeee !important;
  font-size: clamp(0.875rem, 3vw, 1rem) !important;
  line-height: 2; }

/* ===================================
COMMON
=================================== */
.mainContainer {
  margin: 0 auto;
  width: 95%;
  max-width: 1200px; }

.bold {
  font-weight: bold; }

p {
  margin: 0 !important;
  padding: 0; }

table th, table td {
  margin: 0;
  font-weight: normal; }

ul {
  list-style: none;
  margin: 0 !important;
  padding: 0 !important; }
  ul li {
    margin: 0;
    padding: 0; }

ol {
  margin: 0 !important;
  padding: 0 !important; }

dl {
  margin: 0; }
  dl dt, dl dd {
    margin: 0;
    font-weight: normal; }

a {
  text-decoration: none !important;
  color: #000 !important;
  transition: .5s all; }
  a:hover {
    color: #d9d9d9; }

.btn, button {
  border: none; }

.disabled {
  background: lightgray !important;
  border: 1px solid lightgray !important;
  pointer-events: none; }

.secPdg {
  padding: 7.5vmax 0; }

.w520only {
  display: none !important; }

.w960only {
  display: none !important; }

a[href*="tel:"] {
  text-decoration: none;
  pointer-events: none; }

.width_95 {
  width: 95%;
  margin: 0 auto !important; }

.width_90 {
  width: 90%;
  margin: 0 auto !important; }

.width_80 {
  width: 80%;
  margin: 0 auto !important; }

.width_60 {
  width: 60%;
  margin: 0 auto !important; }

.width_70 {
  width: 70%;
  margin: 0 auto !important; }

.width_50 {
  width: 50%;
  margin: 0 auto !important; }

.width_30 {
  width: 30%;
  margin: 0 auto !important; }

.__w95 {
  width: clamp(330px, 85vw, calc(1200px * 0.95));
  margin: 0 auto !important; }

.__w90 {
  width: clamp(330px, 85vw, calc(1200px * 0.9));
  margin: 0 auto !important; }

.__w80 {
  width: clamp(330px, 85vw, calc(1200px * 0.8));
  margin: 0 auto !important; }

.__w70 {
  width: clamp(330px, 85vw, calc(1200px * 0.7));
  margin: 0 auto !important; }

.__w60 {
  width: clamp(330px, 85vw, calc(1200px * 0.6));
  margin: 0 auto !important; }

.__w50 {
  width: clamp(330px, 85vw, calc(1200px * 0.5));
  margin: 0 auto !important; }

.__w40 {
  width: clamp(330px, 85vw, calc(1200px * 0.4));
  margin: 0 auto !important; }

.__w30 {
  width: clamp(330px, 85vw, calc(1200px * 0.3));
  margin: 0 auto !important; }

/* ===================================
*HEADER
=================================== */
header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  background-color: rgba(200, 193, 175, 0.65);
  width: 100%;
  height: 60px;
  z-index: 1002; }
  header ul li {
    cursor: default !important; }
    header ul li a:hover {
      color: #d9d9d9 !important; }

.header {
  position: relative;
  width: 100%;
  margin: auto;
  height: 60px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 20px;
  z-index: 1002; }
  .header .logo {
    width: 10rem; }

/*.logo a { font-size: $clh5h6;
  font-weight: bold;
  color: #333; }*/
/* PCメニューはSPでは非表示 */
.pc-menu {
  display: none; }

/* NAVエリア */
.nav {
  display: flex;
  align-items: center;
  gap: 15px; }

/* お問い合わせボタンの共通スタイル */
.purchaseBtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.5rem 1rem;
  background-color: #FF9900;
  color: white !important;
  border: 1px solid #d9d9d9;
  border-radius: 5px;
  white-space: nowrap; }
  .purchaseBtn:hover {
    background: #eeeeee;
    color: #FF9900 !important; }

/*---------------------------------------------------- SP ハンバーガーメニューアイコン*/
.hamburger-menu {
  display: block;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  width: 30px;
  height: 30px;
  position: relative;
  z-index: 1003; }
  .hamburger-menu span {
    display: block;
    width: 100%;
    height: 2px;
    background-color: #333;
    margin: 6px 0;
    /* 🍔 ハンバーガーアイコンの変形速度 */
    transition: transform 0.5s, opacity 0.5s; }

/* ハンバーガーアイコンを閉じるボタン(X)に変化 */
.hamburger-menu.is-active span:nth-child(1) {
  transform: translateY(8px) rotate(45deg); }

.hamburger-menu.is-active span:nth-child(2) {
  opacity: 0; }

.hamburger-menu.is-active span:nth-child(3) {
  transform: translateY(-8px) rotate(-45deg); }

/*---------------------------------------------------- SP 全画面メニュー*/
.sp-menu-fullscreen {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: rgba(255, 255, 255, 0.65);
  backdrop-filter: blur(2px);
  z-index: 1001;
  transition: opacity 0.75s ease, transform 0.75s ease;
  /* 🚀 【重要】メニューが開く速度を0.5秒に設定 */
  opacity: 0;
  /* 初期状態：透明で、画面右端の外に配置 */
  transform: translateY(-100%);
  display: flex;
  /* transitionが効くように display: flex; を残す */
  flex-direction: column;
  justify-content: center;
  align-items: center;
  pointer-events: none;
  /* 非表示時、下の要素をクリックできないようにする */ }
  .sp-menu-fullscreen .btnArea {
    margin: 5vmax auto;
    text-align: center; }

/* SPメニュー表示時 */
.sp-menu-fullscreen.is-open {
  opacity: 1;
  /* 表示状態：完全に不透明で、画面内に配置 */
  transform: translateX(0);
  pointer-events: auto; }

/* 操作を可能にする */
.sp-menu-list a {
  display: block;
  font-size: 1rem;
  text-align: center;
  line-height: 3; }

/* SPメニュー内のお問い合わせボタン */
.contact-button-sp {
  margin-top: 30px;
  background-color: #ffc107;
  color: #333;
  font-size: 16px;
  font-weight: bold;
  border-radius: 5px; }

/*---------------------------------------------------- SP MEDIA*/
@media (min-width: 520px) {
  .hamburger-menu {
    display: none; }

  /* PCではハンバーガーメニューを非表示 */
  .sp-menu-fullscreen {
    display: none !important; }

  /* PCではSP全画面メニューを完全に非表示 */
  /* PC用メニューを表示 */
  .pc-menu {
    display: flex;
    gap: 30px;
    font-size: 16px; }
    .pc-menu a:hover {
      opacity: 0.7; }

  /* ナビゲーション全体 (メニュー一覧 + お問い合わせボタン) */
  .nav {
    gap: 30px; }

  /* PCではお問い合わせボタンを少し大きく 
  .contact-button { padding: 10px 20px; }*/ }
/* メディアクエリ (PC表示) end */
header {
  background-color: rgba(255, 255, 255, 0.65);
  /* 最初は透明（または元の色） */
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
  transition: background-color 0.5s ease;
  /* 0.5秒かけて色を変える */ }
  header.scrolled {
    background-color: rgba(255, 255, 255, 0.65);
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px); }

/* ===================================
*FOOTER
=================================== */
footer {
  background: white; }
  footer .copyrightsBox {
    display: flex;
    justify-content: space-around;
    font-size: clamp(0.625rem, 3vw, 0.75rem);
    text-align: center;
    margin-top: 3vmax !important;
    padding-bottom: 1rem !important; }
    footer .copyrightsBox a:hover {
      color: #d9d9d9 !important; }
  footer .logo {
    width: clamp(10rem, 20vw, 17rem);
    margin-bottom: 2rem; }
    footer .logo a:hover {
      filter: drop-shadow(2px 2px 4px #3c3C3C); }
  footer .sns {
    display: flex;
    align-items: center; }
    footer .sns .instagram, footer .sns .x {
      width: 2rem; }
    footer .sns a:first-child {
      margin-right: 2rem; }
    footer .sns a:hover {
      filter: drop-shadow(2px 2px 2px #3c3C3C); }
  footer .menuBox {
    display: flex;
    flex-direction: column; }
    footer .menuBox a {
      margin-bottom: 2rem; }
      footer .menuBox a:hover {
        color: #d9d9d9 !important; }

html {
  scroll-padding-top: 10px; }

/* スクロール時に自動でヘッダーの高さ分を避けるよう指示 */
/* ===================================
*SITE COMMON
=================================== */
.roboto {
  font-family: "Roboto", sans-serif; }

.notosans {
  font-family: "Noto Sans JP", sans-serif; }

.titleBox {
  margin-bottom: 5vmax; }
  .titleBox p:first-child {
    font-size: clamp(1.25rem, 3vw, 1.75rem);
    font-weight: lighter;
    margin-bottom: 1vmax !important; }
  .titleBox p:nth-child(2) {
    font-size: clamp(1.5rem, 3vw, 2.5rem);
    font-family: "Roboto", sans-serif;
    font-weight: bold;
    line-height: 1.25; }

.subCommonTop {
  position: relative; }
  .subCommonTop .title {
    position: absolute;
    inset: -10% 0 0 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center; }
    .subCommonTop .title p {
      font-size: clamp(1.75rem, 3vw, 2.5rem); }
      .subCommonTop .title p span {
        color: #ff3131;
        font-size: clamp(1.25rem, 3vw, 2rem); }

.btnArea {
  margin: 5vmax auto;
  text-align: center; }

.btnOutline, .btnSolid {
  color: #000 !important;
  border: 1px solid #000;
  border-radius: 5px;
  padding: 0.25rem 2em;
  transition: .5s all; }

.btnSolid {
  background-color: #FF9900;
  border: 1px solid #FF9900;
  color: white !important; }

.viewMoreArea {
  margin: 5vmax auto;
  text-align: center; }
  .viewMoreArea .btnOutline, .viewMoreArea .btnSolid {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    font-family: "Noto Sans JP", sans-serif;
    transition: .5s all; }
    .viewMoreArea .btnOutline p, .viewMoreArea .btnSolid p {
      padding-right: 1rem !important; }
    .viewMoreArea .btnOutline i, .viewMoreArea .btnSolid i {
      transition: transform 0.5s ease; }
    .viewMoreArea .btnOutline:hover i, .viewMoreArea .btnSolid:hover i {
      transform: translateX(0.5em); }

/* ===================================
*INDEX
=================================== */
/*----------------------------------------------------indexTop*/
.newsArea .listBox a {
  display: block;
  color: inherit;
  padding: 1vmax 0;
  text-decoration: none;
  transition: background-color 0.5s ease; }
  .newsArea .listBox a:hover {
    background-color: #d9d9d9; }
.newsArea .listBox .newsTitle {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden; }
.newsArea .title {
  text-align: center;
  font-size: clamp(1.5rem, 3vw, 2.5rem);
  margin-bottom: 3vmax !important; }
.newsArea .btnArea .btnOutline {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  transition: .5s all; }
  .newsArea .btnArea .btnOutline p {
    padding-right: 1rem !important; }
  .newsArea .btnArea .btnOutline i {
    transition: transform 0.5s ease; }
  .newsArea .btnArea .btnOutline:hover i {
    transform: translateX(0.5em); }

.aboutArea {
  position: relative;
  background: white;
  padding: 13vmax 0 clamp(1rem, 12vw, 13vmax);
  z-index: 0; }
  .aboutArea .box {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-top: 1vmax;
    height: 100%; }
    .aboutArea .box .titleBox {
      margin-bottom: 2rem; }
    .aboutArea .box .textBox {
      margin-bottom: 2rem; }
  .aboutArea .bgTriangleUp, .aboutArea .bgTriangleDown {
    position: absolute;
    z-index: -1; }
  .aboutArea .bgTriangleUp {
    top: 0; }
  .aboutArea .bgTriangleDown {
    bottom: -1px;
    z-index: 0; }

/*----------------------------------------------------indexLineUp*/
.indexLineUp .box a {
  display: block; }
  .indexLineUp .box a img {
    transition: .5s all; }
    .indexLineUp .box a img:hover {
      box-shadow: 2px 2px 10px #3c3C3C; }
.indexLineUp .lineupTextBox {
  margin-top: 1rem !important; }
  .indexLineUp .lineupTextBox p:first-child {
    font-size: clamp(1.25rem, 3vw, 1.5rem);
    font-weight: bold;
    margin-bottom: 1rem !important; }

/*----------------------------------------------------indexBottom*/
.indexBottom .purchaseArea {
  position: relative; }
  .indexBottom .purchaseArea img {
    max-height: 280px;
    min-height: 150px;
    object-fit: cover; }
  .indexBottom .purchaseArea .box {
    position: absolute;
    inset: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%; }
    .indexBottom .purchaseArea .box .viewMoreArea .btnSolid {
      font-size: clamp(1.25rem, 3vw, 1.5rem); }
.indexBottom .eventArea {
  position: relative; }
  .indexBottom .eventArea .bgImg {
    margin-top: -5%;
    min-height: 700px;
    max-height: 1000px; }
  .indexBottom .eventArea .contentsBox {
    position: absolute;
    inset: 0;
    display: flex; }
    .indexBottom .eventArea .contentsBox .eventImg {
      width: clamp(20rem, 26vw, 25rem);
      margin: 2vmax auto; }
    .indexBottom .eventArea .contentsBox .textBox {
      margin-top: 2vmax; }
      .indexBottom .eventArea .contentsBox .textBox .titleBox {
        margin-bottom: 1rem; }
      .indexBottom .eventArea .contentsBox .textBox .text {
        font-size: clamp(0.75rem, 3vw, 0.875rem); }
    .indexBottom .eventArea .contentsBox .viewMoreArea {
      margin: 5vmax 0 0 0;
      text-align: left; }
      .indexBottom .eventArea .contentsBox .viewMoreArea .btnSolid {
        background-color: #000;
        border-color: #000; }

/*----------------------------------------------------indexQA*/
.indexQA .qaBox {
  background: #3c3C3C;
  color: white;
  margin-bottom: 1rem;
  padding: 2vmax; }
  .indexQA .qaBox .question, .indexQA .qaBox .answer {
    display: flex;
    align-items: center; }
    .indexQA .qaBox .question:first-child, .indexQA .qaBox .answer:first-child {
      margin-bottom: 1rem !important; }
    .indexQA .qaBox .question .circle, .indexQA .qaBox .answer .circle {
      display: flex;
      justify-content: center;
      align-items: center;
      font-size: 2rem;
      width: 1.5em;
      height: 1.5em;
      border-radius: 250px;
      color: #3c3C3C;
      margin-right: 2vmax !important;
      padding: 0.5em;
      background-color: white; }
    .indexQA .qaBox .question p:last-child, .indexQA .qaBox .answer p:last-child {
      flex-grow: 1; }
  .indexQA .qaBox .answer .circle {
    background-color: #3c3C3C;
    border: 1px solid white;
    color: white; }

/* ===================================
*NEWS
=================================== */
/*----------------------------------------------------secNews*/
.secNews .newsContentsBox {
  border-top: 1px solid #d9d9d9;
  line-height: 5vmax;
  transition: .5s all; }
  .secNews .newsContentsBox:last-child {
    border-bottom: 1px solid #d9d9d9; }
  .secNews .newsContentsBox:hover {
    background-color: #d9d9d9; }
  .secNews .newsContentsBox .box {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-right: 0.5vmax; }
    .secNews .newsContentsBox .box p {
      width: 95%;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
      margin-right: 0.5vmax; }
    .secNews .newsContentsBox .box i {
      color: #ff3131;
      transition: transform 0.5s ease; }
    .secNews .newsContentsBox .box:hover i {
      transform: translateX(0.5em); }
.secNews .singleNewsBox .date {
  font-weight: lighter;
  margin-bottom: 1rem !important; }
.secNews .singleNewsBox .title {
  font-size: clamp(1.25rem, 3vw, 1.5rem);
  font-weight: bold; }
.secNews .singleNewsBox hr {
  margin: 3vmax 0; }
.secNews .singleNewsBox .article {
  margin: 2rem 0 4vmax !important; }
.secNews .singleNewsBox .img {
  text-align: center; }
  .secNews .singleNewsBox .img img {
    max-height: 600px;
    aspect-ratio: 4/3;
    object-fit: contain;
    margin: auto; }

/* ===================================
*Product
=================================== */
/*----------------------------------------------------secProducnt*/
.secProduct img {
  aspect-ratio: 1;
  object-fit: contain; }
.secProduct .main {
  margin-bottom: 1rem;
  transition: opacity 0.5s ease-in-out; }
.secProduct .thumb {
  display: flex;
  flex-wrap: wrap;
  gap: 3px; }
  .secProduct .thumb .item {
    cursor: pointer;
    border: 2px solid transparent; }
    .secProduct .thumb .item.is_active {
      border-color: #FF9900;
      opacity: 0.7; }
  .secProduct .thumb li {
    display: block;
    border: 1px solid #d9d9d9;
    box-sizing: border-box;
    width: calc((100% - (3px * 5)) / 6); }
.secProduct .itemBox {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding-top: 3vmax;
  height: 100%; }
  .secProduct .itemBox .topBox .name {
    font-size: clamp(1.75rem, 3vw, 2.5rem); }
  .secProduct .itemBox .topBox .catch {
    font-size: clamp(1.25rem, 3vw, 1.75rem);
    margin-bottom: 0.5rem !important; }
  .secProduct .itemBox .btmBox .price {
    font-size: clamp(1.25rem, 3vw, 1.75rem);
    font-family: "Noto Sans JP", sans-serif;
    text-align: end;
    font-weight: lighter;
    margin-top: 1rem !important; }
    .secProduct .itemBox .btmBox .price span {
      font-size: clamp(0.875rem, 3vw, 1rem);
      font-weight: normal;
      padding-left: 0.5rem; }
  .secProduct .itemBox .btmBox .btnArea {
    text-align: end;
    margin: 0 0 2rem 0; }
  .secProduct .itemBox .btmBox .notice {
    font-size: clamp(0.625rem, 3vw, 0.75rem);
    font-weight: lighter; }
    .secProduct .itemBox .btmBox .notice span {
      font-size: clamp(0.75rem, 3vw, 0.875rem);
      font-weight: bold; }
    .secProduct .itemBox .btmBox .notice .indent {
      text-indent: -1em;
      padding-left: 1em; }
.secProduct .ingredientBox dl {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  border: 1px solid #000; }
  .secProduct .ingredientBox dl dt, .secProduct .ingredientBox dl dd {
    display: flex;
    align-items: center;
    box-sizing: border-box;
    padding: 2vmax; }
  .secProduct .ingredientBox dl dt {
    flex-basis: 20%;
    border-right: 1px solid #000; }
    .secProduct .ingredientBox dl dt:not(:last-of-type) {
      border-bottom: 1px solid #000; }
  .secProduct .ingredientBox dl dd {
    flex-basis: 80%; }
    .secProduct .ingredientBox dl dd:not(:last-child) {
      border-bottom: 1px solid #000; }

/* ===================================
*RURE
=================================== */
/*----------------------------------------------------secPrivacyPolicy*/
.secPrivacyPolicy {
  counter-reset: number 0;
  font-family: "Noto Sans JP", sans-serif; }
  .secPrivacyPolicy .box {
    margin-bottom: 3vmax !important; }
    .secPrivacyPolicy .box ul {
      list-style-type: disc; }
      .secPrivacyPolicy .box ul li {
        margin-left: 1em; }
    .secPrivacyPolicy .box .link {
      color: blue !important;
      text-decoration: underline !important; }
      .secPrivacyPolicy .box .link:hover {
        color: #FF9900 !important; }
    .secPrivacyPolicy .box .title, .secPrivacyPolicy .box .numTitle {
      font-size: clamp(1rem, 3vw, 1.75rem);
      font-weight: bold;
      margin-bottom: 1rem !important; }
    .secPrivacyPolicy .box .numTitle:before {
      counter-increment: number 1;
      content: counter(number) ". "; }

/* ===================================
*CONTACT
=================================== */
/*---------------------------------------------------- *SUB subContact */
.subContact .contactFormBox {
  background: #eeeeee;
  padding: 7vmax 2vmax;
  border-radius: 10px; }
  .subContact .contactFormBox .title {
    text-align: end; }
  .subContact .contactFormBox input, .subContact .contactFormBox textarea {
    width: 100%;
    border: 1px solid lightgray; }
  .subContact .contactFormBox .title, .subContact .contactFormBox input, .subContact .contactFormBox textarea {
    margin-bottom: 3vmax;
    padding: 0.25rem;
    border-radius: 5px; }
  .subContact .contactFormBox textarea {
    resize: none; }
  .subContact .contactFormBox .privacyBox {
    text-align: center; }
    .subContact .contactFormBox .privacyBox input {
      width: auto;
      margin-right: 0.5rem; }
    .subContact .contactFormBox .privacyBox .wpcf7-not-valid-tip {
      display: none; }
  .subContact .contactFormBox .submitBox input {
    background: #d9d9d9;
    border: 1px solid #d9d9d9;
    color: white;
    border-radius: 250px;
    padding: 0.5rem;
    transition: .5s all; }
    .subContact .contactFormBox .submitBox input:hover {
      color: #d9d9d9;
      background-color: white; }
  .subContact .contactFormBox .screen-reader-response {
    font-size: clamp(0.75rem, 3vw, 0.875rem);
    text-align: center;
    color: red;
    line-height: 1.5; }
    .subContact .contactFormBox .screen-reader-response ul {
      margin-bottom: 3vmax; }
  .subContact .contactFormBox .wpcf7-response-output {
    display: none; }
.subContact .mandatory {
  font-size: clamp(0.75rem, 3vw, 0.875rem);
  color: red;
  margin: 0 0.5rem 0 1rem; }

input:-webkit-autofill {
  box-shadow: 0 0 0 1000px #3c3C3C inset; }

.wpcf7-form input::placeholder, 　.wpcf7-form textarea::placeholder {
  font-size: 0.75rem;
  color: #999;
  opacity: 1; }

/* 💡 オートコンプリート打ち消しCSSの再確認 */
.wpcf7-form input:-webkit-autofill,
.wpcf7-form input:-webkit-autofill:hover,
.wpcf7-form input:-webkit-autofill:focus,
.wpcf7-form textarea:-webkit-autofill,
.wpcf7-form textarea:-webkit-autofill:hover,
.wpcf7-form textarea:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0px 1000px white inset !important;
  /* 背景を白で上書き */
  -webkit-text-fill-color: #333 !important;
  /* 文字色を黒 #333 に強制（画像から判断）*/
  transition: background-color 5000s ease-in-out 0s !important; }

/* ===================================
*MEDIA
=================================== */
/*960px以下　Tablet(mini)*/
@media screen and (max-width: 960px) {
  /*必要ならばここにコードを書く*/
  /*----------------------------------------------------common 960*/
  .w960only {
    display: block !important; }

  .w960none {
    display: none !important; }

  .width_95, .width_60, .width_70, .width_50, .width_30 {
    width: 75%;
    margin: 0 auto; }

  .width_90, .width_80 {
    width: 95%; } }
/*576-375px以下　SP*/
@media screen and (max-width: 520px) {
  /*必要ならばここにコードを書く*/
  /*----------------------------------------------------common 520*/
  .width_95, .width_90, .width_80, .width_60, .width_70, .width_50, .width_30 {
    width: 100%; }

  .w520only {
    display: block !important; }

  .w520none {
    display: none !important; }

  /*----------------------------------------------------indexTop 520*/
  .newsArea .btnArea .btnOutline {
    width: 100%; }

  .aboutArea .box {
    margin-top: 0;
    padding-top: 0; }

  .indexBottom .eventArea .contentsBox .textBox .titleBox {
    text-align: center; }
  .indexBottom .eventArea .contentsBox .viewMoreArea {
    text-align: center; }
    .indexBottom .eventArea .contentsBox .viewMoreArea .btnSolid {
      width: 100%; }

  /*----------------------------------------------------secProduct 520*/
  .secProduct .ingredientBox dl {
    flex-direction: column; }
    .secProduct .ingredientBox dl dt, .secProduct .ingredientBox dl dd {
      justify-content: center; }
    .secProduct .ingredientBox dl dt {
      flex-basis: 15%;
      border-right: transparent;
      text-align: center; }
      .secProduct .ingredientBox dl dt:last-of-type {
        border-bottom: 1px solid #000; }
  .secProduct .itemBox .btmBox .btnArea .purchaseBtn {
    width: 100%; }

  /*----------------------------------------------------indexQA 520*/
  .indexQA .qaBox .answer {
    align-items: start; }

  /*----------------------------------------------------footer 520*/
  footer .logo {
    margin: 3vmax auto; }
  footer .sns {
    margin: 3vmax auto 3rem;
    justify-content: center; }
  footer .menuBox {
    text-align: center; }

  a[href*="tel:"] {
    color: pink;
    text-decoration: underline;
    pointer-events: auto; } }

/*# sourceMappingURL=style.css.map */