@charset "UTF-8";

/* components/page-banner.css
 * 担当範囲はこのファイルだけで編集。414px基準・既存の縮小式を維持。
 * 色は 店舗側 presentation/theme.css。条件・優先度は表示維持のため残しています。
 */


#indexbg:where(.ui-main *) {
  height: auto;
  width: 100%;
  margin: 0;
  padding: 0;
}

.easyp:where(.ui-main *) {
  font-size: 10px;
  height: 35px;
  line-height: 55px;
  margin: 0;
  padding: 0 0 0 5px;
}

:where(body[data-page="notice"]) #under_dot:where(.ui-main *) {
  width: 394px;
  height: 2px;
  padding: 15px 0 0 0;
  margin: 0 0 0 10px;
}

@media screen and (max-width: 413px) {
  :where(body[data-page="notice"]) #under_dot:where(.ui-main *) {
    width: clamp(304.5411px, 95.1691vw, 394px);
    height: 2px;
    padding: clamp(11.5942px, 3.6232vw, 15px) 0 0 0;
    margin: 0 0 0 clamp(7.7295px, 2.4155vw, 10px);
  }
}

:where(body[data-page="profile"]) #psindexbg:where(.ui-main *) {
  width: 100%;
}

@media screen and (max-width: 413px) {
  :where(body[data-page="profile"]) #psindexbg:where(.ui-main *) {
    width: 100%;
  }
}

.testbg:where(.ui-main *) {
  background: var(--ui-sp-main-base-bg-variant-5, var(--ui-sp-base-bg-variant-5)) !important;
  background-image: none !important;
}

.easyp:where(.ui-main *) {
  box-sizing: border-box;
  background: var(--ui-sp-page-caption-background, var(--ui-sp-main-base-bg-variant-39, var(--ui-sp-base-bg-variant-39))) !important;
  color: var(--ui-sp-main-breadcrumb-text, var(--ui-sp-base-text-variant-3)) !important;
}

body.natural-theme.natural-sp .testbg:where(.ui-main *) {
  background: var(--ui-sp-main-base-bg-variant-6, var(--ui-sp-base-bg-variant-6)) !important;
}