@charset "UTF-8";

/**
 * スマホ用固定フッターバーの設定
 */
@font-face {
  font-family: 'footer_bar';
  src: url('../fonts/footer_bar.woff?v=1.1') format('woff');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'tiktok_x_icon';
  src: url('../fonts/tiktok_x_icon.eot?v=1.0');
  src: url('../fonts/tiktok_x_icon.eot?v=1.0#iefix') format('embedded-opentype'),
       url('../fonts/tiktok_x_icon.woff?v=1.0') format('woff'),
       url('../fonts/tiktok_x_icon.ttf?v=1.0') format('truetype'),
       url('../fonts/tiktok_x_icon.svg?v=1.0#tiktok_x_icon') format('svg');
  font-weight: normal;
  font-style: normal;
}
@media not all and (max-width: 767px) {
  .p-footer-bar { display:none; }
}

/* フッターバー */
.p-footer-bar { position: sticky; position: -webkit-sticky; bottom:0px; z-index:999999; width:100%; pointer-events: none; }
.p-footer-bar__inner { overflow: hidden; }
.p-footer-bar__list { width:100%; display:-webkit-box; display:-ms-flexbox; display:flex; }

.p-footer-bar__item { -webkit-box-flex:1; -ms-flex:1 1 0%; flex:1 1 0%; }
.p-footer-bar__item-link {
  display:-webkit-box; display:-ms-flexbox; display:flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
  -webkit-box-align: center; -ms-flex-align: center; align-items: center;
  -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end;
  height:50px; padding-bottom:8px; color:inherit; transition:opacity 0.3s ease;
}

/* アニメーション - FadeIn */
html:not(.show-drawer) .p-footer-bar.is-active { pointer-events: auto; }
.p-footer-bar__list { opacity: 0; transition: opacity 0.4s ease; pointer-events: none; }
.mobile_device .p-footer-bar__list a[href^="tel:"]{ pointer-events: none; }
html:not(.show-drawer) .p-footer-bar.is-active .p-footer-bar__list { opacity: 1; pointer-events: auto; }
html:not(.show-drawer) .mobile_device .p-footer-bar.is-active .p-footer-bar__list a[href^="tel:"]{ pointer-events: auto; }


/* タイプ 2 - ダークカラー */
.p-footer-bar--type2 { color:#fff; font-size:10px; background:#000; }
.p-footer-bar--type2 .p-footer-bar__item:not(:first-of-type) { border-left:1px solid rgba(255,255,255,0.3); }

/* タイプ 3 - ライトカラー */
.p-footer-bar--type3 { color:#000; font-size:10px; background:#fafafa; border-top:1px solid #ddd; }
.p-footer-bar--type3 .p-footer-bar__item:not(:first-of-type) { border-left:1px solid #ddd; }

/* タイプ 4 - アイコン無し */
.p-footer-bar--type4 { color:#fff; font-size:12px; background:#000; }
.p-footer-bar--type4 .p-footer-bar__item-link { padding-bottom:0; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }

/* ホバー */
@media (hover: hover) and (pointer: fine) {
  .p-footer-bar__item-link:hover { opacity:0.7; }
}

/* アイコン */
.p-footer-bar__icon:before {
  display:block; font-family:"footer_bar"; font-size:1.6em; margin-bottom:5px;
}
.p-footer-bar__icon--twitter:before { font-family: 'tiktok_x_icon'; content: "\e901"; }
.p-footer-bar__icon--facebook:before { content: "\e944"; font-family: 'design_plus'; font-size:22px; }
.p-footer-bar__icon--instagram:before { content: "\ea92"; }
.p-footer-bar__icon--youtube:before { content: "\ea9d"; }
.p-footer-bar__icon--line:before { content: "\e90f"; font-size:18px; }
.p-footer-bar__icon--spotify:before { content: "\ea94"; }
.p-footer-bar__icon--heart:before { content: "\e9da"; }
.p-footer-bar__icon--star1:before { content: "\e9d9"; }
.p-footer-bar__icon--star2:before { content: "\e9d7"; }
.p-footer-bar__icon--list1:before { content: "\e9bb"; }
.p-footer-bar__icon--list2:before { content: "\e907"; }
.p-footer-bar__icon--fire:before { content: "\e9a9"; }
.p-footer-bar__icon--bubble:before { content: "\e96c"; }
.p-footer-bar__icon--cart:before { content: "\e93a"; }
.p-footer-bar__icon--bell:before { content: "\e951"; }
.p-footer-bar__icon--profile:before { content: "\e923"; }
.p-footer-bar__icon--user:before { content: "\e90a"; font-size:16px; }
.p-footer-bar__icon--map:before { content: "\e909"; }
.p-footer-bar__icon--film:before { content: "\e913"; }
.p-footer-bar__icon--camera:before { content: "\e905"; font-size:14px; }
.p-footer-bar__icon--news:before { content: "\e904"; }
.p-footer-bar__icon--office:before { content: "\e903"; }
.p-footer-bar__icon--home:before { content: "\e900"; }
.p-footer-bar__icon--help:before { content: "\e901"; font-size:19px; }
.p-footer-bar__icon--light:before { content: "\e902"; font-size:20px; }
.p-footer-bar__icon--menu:before { content: "\e90e"; font-size:13px; }
.p-footer-bar__icon--grid:before { content: "\e90d"; font-size:14px; }
.p-footer-bar__icon--search:before { content: "\e90c"; }
.p-footer-bar__icon--tel:before { content: "\e90b"; }
.p-footer-bar__icon--calendar:before { content: "\e908"; }
.p-footer-bar__icon--mail:before { content: "\e906"; font-size:12px; }
.p-footer-bar__icon--pdf:before { content: "\e910"; }
.p-footer-bar__icon--pencil:before { content: "\e911"; }
.p-footer-bar__icon--clock:before { content: "\e912"; }
.p-footer-bar__icon--tiktok:before { content: "\e94d"; font-family: 'design_plus'; }
.p-footer-bar__icon--crown:before { content: "\e940"; font-family: 'design_plus'; font-size: 21px; }
.p-footer-bar__icon--share:before { content: "\f1e0"; font-family: 'design_plus'; }

/* モーダル */
.p-footer-bar__modal {
  position:fixed; top:0; left:0; width:100%; height:100%; z-index:99999;
  display:-webkit-box; display:-ms-flexbox; display:flex;
  -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;
  -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end;
}
.p-footer-bar__modal:not(.is-active) { display:none; }
.p-footer-bar__modal-share { position:relative; z-index:1; display:-webkit-box; display:-ms-flexbox; display:flex; padding-bottom:150px; }
.p-footer-bar__modal-share-item { width:50px; }
.p-footer-bar__modal-share-item a { display:block; }
.p-footer-bar__modal-share-item + .p-footer-bar__modal-share-item { margin-left:5px; }
.p-footer-bar__modal-overlay { position: absolute; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.5); }
.p-footer-bar__modal-share-item img:not(.c-logo__image) { max-width:100%; height:auto; vertical-align: bottom; }