@charset "UTF-8";
/*******************************************
  /css/component.css
*******************************************/
/*
基本
750px【sp切り替わりポイント】 */
/*------------------------------------------
  パンくず
------------------------------------------*/
.breadcrumbs {
  padding: 10px 0;
}

.breadcrumbs span a {
  text-decoration: underline;
}

.breadcrumbs_split {
  padding: 0 6px;
  color: #dc4013;
}

/*------------------------------------------
  メインビジュアル
------------------------------------------*/
.hero_area {
  width: 100%;
  padding-top: 106%;
  background: url(/images/top/hero_top_sp.png) center/cover no-repeat;
}
.hero_area .hero_box {
  position: relative;
}
.hero_area .hero_box img {
  position: absolute;
  width: 40%;
  right: 0;
  bottom: 10px;
}

@media screen and (min-width: 750px) {
  .hero_area {
    padding-top: 0;
    margin-top: 0;
    height: 557px;
    background: url(/images/top/hero_top_pc.png) center/cover no-repeat;
  }
  .hero_area .hero_box {
    width: 1114px;
    padding-top: 557px;
  }
  .hero_area .hero_box img {
    width: 287px;
    right: 0;
    bottom: 15px;
  }
}
/*------------------------------------------
内部ページメインビジュアル
------------------------------------------*/
.main_visual_area {
  width: 100%;
}
.main_visual_area .main_visual_box {
  position: relative;
  height: 110px;
}
.main_visual_area .main_visual_box img {
  position: absolute;
  top: 50%;
  left: 50%;
  /* Safari用 */
  transform: translate(-50%, -50%);
  width: 100%;
}

/* paddingで文字の大きさ調整
(imgのwidth / 一番多い文字数) * (一番多い文字数 - 対象の文字数) / 2 */
/* 一番多い文字数 */
/*メニュー*/
/*店舗検索*/
/*お知らせ*/
/*商品情報*/
#menus .main_visual_box img,
#shops .main_visual_box img,
#news .main_visual_box img,
#goods .main_visual_box img {
  padding: 0 calc(100% / 13 * (13 - 4) / 2);
}

/*お問い合わせ（cta）*/
/*ご意見ご感想*/
#cta .main_visual_box img,
#feedbacks .main_visual_box img {
  padding: 0 calc(100% / 13 * (13 - 6) / 2);
}

/*このHPについて*/
#about .main_visual_box img {
  padding: 0 calc(100% / 13 * (13 - 8) / 2);
}

/*SNSガイドライン*/
#sns_guideline .main_visual_box img {
  padding: 0 calc(100% / 13 * (13 - 9) / 2);
}

/*プライバシーポリシー*/
#privacy_policy .main_visual_box img {
  padding: 0 calc(100% / 13 * (13 - 10) / 2);
}

/*メニュー*/
body#menus .main_visual_area {
  background: url(/images/main_visual/main_visual_menu_pc.jpg) center/cover no-repeat;
}

/*ピックアップ*/
body#pickup .main_visual_area {
  background: url(/images/main_visual/main_visual_pickup.jpg) center/cover no-repeat;
}

/*お知らせ*/
body#news .main_visual_area {
  background: url(/images/main_visual/main_visual_news.jpg) center/cover no-repeat;
}

/*商品情報*/
body#goods .main_visual_area {
  background: url(/images/main_visual/main_visual_news-menus.jpg) center/cover no-repeat;
}

/*店舗検索*/
body#shops .main_visual_area {
  background: url(/images/main_visual/main_visual_shops_pc.jpg) center/cover no-repeat;
}

/*店舗詳細*/
body#shops_details .main_visual_area {
  background: url(/images/main_visual/main_visual_shops-details.jpg) center/cover no-repeat;
}

/*ご意見ご感想*/
body#feedbacks .main_visual_area {
  background: url(/images/main_visual/main_visual_feedbacks.jpg) center/cover no-repeat;
}

/*このHPについて*/
body#about .main_visual_area {
  background: url(/images/main_visual/main_visual_about.jpg) center/cover no-repeat;
}

/*SNSガイドライン*/
body#sns_guideline .main_visual_area {
  background: url(/images/main_visual/main_visual_sns_guideline.jpg) center/cover no-repeat;
}

/*プライバシーポリシー*/
body#privacy_policy .main_visual_area {
  background: url(/images/main_visual/main_visual_privacy_policy.jpg) center/cover no-repeat;
}

/*CTa*/
body#cta .main_visual_area {
  background: url(/images/main_visual/main_visual_cta.jpg) center/cover no-repeat;
}

@media screen and (min-width: 750px) {
  .main_visual_area {
    padding-top: 0;
    margin-top: 0;
  }
  .main_visual_area .main_visual_box {
    height: 400px;
  }
  .main_visual_area .main_visual_box img {
    top: 58%;
    width: 950px;
  }
  /* paddingで文字の大きさ調整
  (imgのwidth / 一番多い文字数) * (一番多い文字数 - 対象の文字数) / 2 */
  /*メニュー*/
  /*店舗検索*/
  /*お知らせ*/
  /*商品情報*/
  #menus .main_visual_box img,
  #shops .main_visual_box img,
  #news .main_visual_box img,
  #goods .main_visual_box img {
    padding: 0 calc(950px / 13 * (13 - 4) / 2);
  }
  /*お問い合わせ（cta）*/
  /*ご意見ご感想*/
  #cta .main_visual_box img,
  #feedbacks .main_visual_box img {
    padding: 0 calc(950px / 13 * (13 - 6) / 2);
  }
  /*このHPについて*/
  #about .main_visual_box img {
    padding: 0 calc(950px / 13 * (13 - 8) / 2);
  }
  /*SNSガイドライン*/
  #sns_guideline .main_visual_box img {
    padding: 0 calc(950px / 13 * (13 - 9) / 2);
  }
  /*プライバシーポリシー*/
  #privacy_policy .main_visual_box img {
    padding: 0 calc(950px / 13 * (13 - 10) / 2);
  }
}/*# sourceMappingURL=component.css.map */