@charset "UTF-8";

/*----------------------------------------
Initial Layout Prevention
----------------------------------------*/
/* MVが読み込まれるまでの初期表示制御 */
.p-main-visual {
  position: relative !important;
  z-index: 2 !important;
  height: 100vh !important;
  min-height: 640px !important;
  overflow: hidden !important;
  display: block !important;
}

@media screen and (max-width: 767px) {
  .p-main-visual {
    height: 100vh !important;
    min-height: 500px !important;
  }
}

/* 次のセクションが上に来るのを防ぐ */
.p-main-visual + * {
  position: relative;
  z-index: 1;
}

/*----------------------------------------
Variables
----------------------------------------*/
/*

# Color */
/* $brown: #352f2d; */
/* $sub: #e8da65; */
/* $black-natural: #000; */
/* $black: #454545; */
/* $black: #454545; */
/* $white: $white; */
/* $glay: #777; */
/* $gray-dull: #999; */
/* $gray-black: #212121; */
/* $gray-dark: #444; */
/* $gray-pale: #ededed; */
/* $gray-light: #aeaeae; */
/* $primary: #feb300; */
/* $primary-dark: #0e1b2d; */
/* $primary-white: #f1e8d2; */
/* $primary-black: #f4dda8; */
/* $red: #e60012; */
/* $orange: #ff7200; */
/* $yellow-gray: #b09a57;*/
/* $white-gray: #f5f5f5; */
/* $white-gray2: #f9f9f9; */
/*

# Border */
/* $color-border: #ddd; */
/* $color-border-black: #111; */
/* $color-border-gray: #555; */
/* $color-border-table: #e5e5e5; */
/*

# ScrollBar */
/* $color-track: #f1f1f1; */
/* $color-thumb: #c1c1c1; */
/*

# Shadow */
/* $shadow: rgba(#777, .1); */
/* $shadow-hover: rgba(#777, .3); */
/*

# Hover */
/* $opacity: .7; */
/*

# Font Family */
/* $font: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif; */
/* $font-en: "Cormorant Infant", "Noto Sans JP", Arial, Helvetica, sans-serif; */
/* $font-cn: "Microsoft Yahei", "PingHei"; */
/* $font-kr: "Malgun Gothic", "Yoon Gothic"; */
/* $font-min: 'Noto Serif JP', '游明朝体', YuMincho, '游明朝', 'Yu Mincho', 'ヒラギノ明朝 ProN W3', 'Hiragino Mincho ProN W3', HiraMinProN-W3, 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'ヒラギノ明朝 Pro', 'Hiragino Mincho Pro', 'HGS明朝E', serif; */
/*

# Font Weight */
/* $regular:400; */
/* $medium: 500; */
/* $bold: 700; */
/*

# Width */
/* $max-width: 1600px; */
/* $outer-width: 1440px; */
/* $content-width: 1000px; */
/* $subpage-content-width: 1280px; */
/* $min-width: 960px; */
/*

# Easing */
/* $ease: cubic-bezier(.19, 1, .22, 1); */
/*


*/
/*----------------------------------------
reset
----------------------------------------*/
@import url("https://fonts.googleapis.com/css2?family=Cormorant+Infant&display=swap");
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  font-size: 100%;
  vertical-align: baseline;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block;
}

body {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after, q:before, q:after {
  content: "";
  content: none;
}

table {
  border-spacing: 0;
  border-collapse: collapse;
}

/*----------------------------------------
class
----------------------------------------*/
.clearfix {
  *zoom: 1;
}

.clearfix:after {
  display: table;
  clear: both;
  content: "";
}

.f_cc {
  -webkit-box-pack: justify;
  justify-content: center;
  -webkit-box-align: center;
          align-items: center;
}

.f_box, .f_cc {
  display: -webkit-box;
  display: flex;
}

.f_item {
  -webkit-box-flex: 1;
          flex: 1 0 auto;
}

.f_h_start {
  -webkit-box-pack: start;
          justify-content: flex-start;
}

.f_h_center, .f_h_start {
  -ms-flex-pack: justify;
  -webkit-box-pack: justify;
}

.f_h_center {
  -webkit-box-pack: center;
          justify-content: center;
}

.f_h_end {
  -webkit-box-pack: end;
          justify-content: flex-end;
}

.f_h_end, .f_h_sb {
  -ms-flex-pack: justify;
  -webkit-box-pack: justify;
}

.f_h_sb {
  -webkit-box-pack: justify;
          justify-content: space-between;
}

.f_h_sa {
  -webkit-box-pack: justify;
  justify-content: space-around;
}

.f_wrap {
  -webkit-box-lines: multiple;
  flex-wrap: wrap;
}

.f_column {
  flex-direction: column;
  -webkit-box-direction: column;
}

.f_start {
  -webkit-box-align: start;
          align-items: flex-start;
}

.f_end {
  -webkit-box-align: end;
          align-items: flex-end;
}

.f_center {
  -webkit-box-align: center;
          align-items: center;
}

.f_baseline {
  -webkit-box-align: baseline;
          align-items: baseline;
}

.f_stretch {
  -webkit-box-align: stretch;
          align-items: stretch;
}

.alignR {
  text-align: right;
}

.alignL {
  text-align: left;
}

.alignC {
  text-align: center;
}

button {
  border: none;
  outline: none;
  background: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

/*
@mixin is-tablet-small() {
  @media screen and (max-width: $breakpoint-tablet) {
    @content;
  }
}
*/
/* IEハック用mixin */
/*----------------------------------------
Extend
----------------------------------------*/
@-webkit-keyframes c-btn-enter {
  0% {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}
@keyframes c-btn-enter {
  0% {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}

@-webkit-keyframes c-btn-leave {
  0% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  100% {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
}

@keyframes c-btn-leave {
  0% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  100% {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
}

@-webkit-keyframes c-cnt-enter {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-10%);
            transform: translateX(-10%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}

@keyframes c-cnt-enter {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-10%);
            transform: translateX(-10%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}

@-webkit-keyframes c-cnt-leave {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}

@keyframes c-cnt-leave {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}

/*----------------------------------------
Keyframes
----------------------------------------*/
@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes verticalFloat {
  0% {
    -webkit-transform: translateY(5px);
            transform: translateY(5px);
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}

@keyframes verticalFloat {
  0% {
    -webkit-transform: translateY(5px);
            transform: translateY(5px);
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}

/*----------------------------------------
loader
----------------------------------------*/
body {
  position: fixed;
  overflow: hidden;
  visibility: hidden;
}

/* Prevent drawer menu flash */
.p-global-header-nav {
  display: none !important;
}

/* Prevent header FOUC */
.p-header, .l-header {
  visibility: hidden !important;
  opacity: 0 !important;
}

body[data-status="loaded"] {
  position: static;
  overflow: auto;
  visibility: visible;
}

body[data-status="loaded"] .p-global-header-nav {
  display: block !important;
}

body[data-status="loaded"] .p-header,
body[data-status="loaded"] .l-header {
  visibility: visible !important;
  opacity: 1 !important;
  transition: opacity 0.2s ease-out;
}

/* loaded状態でメインコンテンツを表示（キャンペーン・ニュース除外） */
body[data-status="loaded"] .p-main-visual,
body[data-status="loaded"] main {
  visibility: visible !important;
  opacity: 1 !important;
  transition: opacity 0.3s ease-out;
}

/* キャンペーン・ニュースは即座に表示（動きを防ぐ） */
body[data-status="loaded"] .l-main,
body[data-status="loaded"] .p-main {
  visibility: visible !important;
  opacity: 1 !important;
}

/* Splide FOUC Prevention */
.splide:not(.is-initialized) {
  visibility: hidden !important;
  opacity: 0 !important;
}

.splide.is-initialized {
  visibility: visible !important;
  opacity: 1 !important;
  transition: opacity 0.3s ease-out;
}

/* メインビジュアルスライダー専用の初期化前非表示 */
.p-main-visual.splide:not(.is-initialized) .splide__list {
  visibility: hidden !important;
  opacity: 0 !important;
}

.p-main-visual.splide.is-initialized .splide__list {
  visibility: visible !important;
  opacity: 1 !important;
  transition: opacity 0.3s ease-out;
}

body[data-status="loaded"] .c-loader {
  pointer-events: none;
  animation: opacity 1s ease 1s reverse forwards;
}

.c-loader {
  position: relative;
  position: fixed;
  z-index: 100;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #fff;
}

.c-loader-wrap {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 80%;
  max-width: 1000px;
  height: 50%;
  margin: auto;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}

.c-loader-text {
  margin-top: 8.88889%;
  font-family: 'Cormorant Infant', serif;
  font-size: 24px;
  font-size: 2.4rem;
  text-align: center;
  opacity: 0;
  -webkit-animation: opacity .3s linear 1s forwards;
          animation: opacity .3s linear 1s forwards;
}

.c-loader-caution {
  position: absolute;
  bottom: 11.11111%;
  left: 0;
  width: 100%;
  padding-top: 8.88889%;
  font-family: "Noto Serif JP", "游明朝体", YuMincho, "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN W3", HiraMinProN-W3, "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "HGS明朝E", serif;
  font-size: 14px;
  font-size: 1.4rem;
  text-align: center;
  opacity: 0;
  -webkit-animation: opacity .3s ease 1s forwards;
          animation: opacity .3s ease 1s forwards;
}

@-webkit-keyframes opacity {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes opacity {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}