@charset "UTF-8";
.sec-allon4 {
  position: relative;
  overflow: hidden;
  container-type: inline-size;
  background: #f3f3f3;
  color: var(--c-text);
  font-family: var(--font-heading);
  font-feature-settings: normal;
  text-spacing-trim: space-all;
  text-autospace: no-autospace;
  line-break: strict;
}
.allon4-inner {
  --u: min(1px, calc((100cqw - 80px) / 1180));
  position: relative;
  min-height: calc(909 * var(--u));
}
.allon4-band {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: calc(64 * var(--u));
  background: url("../../assets/img/allon4/band-tile.webp") repeat;
  background-size: 21px 21px;
  pointer-events: none;
}
.allon4-title {
  position: relative;
  box-sizing: border-box;
  height: calc(149 * var(--u));
  padding-top: calc(113 * var(--u));
  font-weight: 400;
  font-size: calc(48 * var(--u));
  line-height: calc(36 * var(--u));
  color: var(--c-text);
  text-align: center;
}
.allon4-title-main {
  white-space: nowrap;
}
.allon4-title-s {
  font-size: calc(40 * var(--u));
}
.allon4-title-en {
  position: absolute;
  left: 50%;
  top: calc(116 * var(--u));
  width: calc(164 * var(--u));
  transform: translateX(calc(-50% + 67.67 * var(--u)));
  font-size: calc(28 * var(--u));
  line-height: calc(36 * var(--u));
  text-align: center;
  white-space: nowrap;
}
.allon4-rule {
  display: block;
  width: calc(80 * var(--u));
  height: 1px;
  margin: calc(50.5 * var(--u)) auto 0;
  background: #666666;
}
.allon4-tablewrap {
  width: calc(1180 * var(--u));
  margin: calc(55.5 * var(--u)) auto 0;
}
.allon4-table {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
}
.allon4-table th,
.allon4-table td {
  padding: 0;
  vertical-align: top;
  text-align: center;
  font-weight: 400;
}
.allon4-c1 { width: 39.9229%; position: relative; }
.allon4-c2 { width: 18.3237%; }
.allon4-c3 { width: 18.3237%; }
.allon4-c4 { width: 23.4297%; }
.allon4-headrow {
  height: calc(57 * var(--u));
  background: #e2e6ef;
}
.allon4-headrow th {
  padding-top: calc(14.5 * var(--u));
  font-weight: 500;
  font-size: calc(18 * var(--u));
  line-height: calc(18 * var(--u));
}
.allon4-th-in { display: block; }
.allon4-headrow .allon4-c1 .allon4-th-in { transform: translateX(calc(53.445 * var(--u))); }
.allon4-headrow .allon4-c4 .allon4-th-in { transform: translateX(calc(-10.425 * var(--u))); }
.allon4-row { height: calc(160 * var(--u)); }
.allon4-row--economy  { --rowpad: 64.45; --phototop: 6.84; background: #ffffff; }
.allon4-row--standard { --rowpad: 60.49; --phototop: 5.88; background: #f8f8f8; }
.allon4-row--premium  { --rowpad: 60.49; --phototop: 7.88; background: #ffffff; }
.allon4-c1-inner { display: block; }
.allon4-photo {
  display: block;
  position: absolute;
  left: calc(49 * var(--u));
  top: calc(var(--phototop) * var(--u));
  width: calc(210 * var(--u));
  height: calc(144.23 * var(--u));
}
.allon4-photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.allon4-name {
  display: block;
  padding-top: calc(var(--rowpad) * var(--u));
  font-weight: 400;
  font-size: calc(18 * var(--u));
  line-height: 1.6;
  white-space: nowrap;
  transform: translateX(calc(125.445 * var(--u)));
}
.allon4-label { display: none; }
.allon4-val {
  display: block;
  padding-top: calc(var(--rowpad) * var(--u));
  font-weight: 300;
  font-size: calc(18 * var(--u));
  line-height: 1.6;
}
.allon4-c4 .allon4-val { transform: translateX(calc(-10.425 * var(--u))); }
.allon4-c4--multi .allon4-val { padding-top: calc(31.49 * var(--u)); }
.allon4-pc { display: inline; }
.allon4-sp { display: none; }
.allon4-note {
  width: calc(1180 * var(--u));
  margin: calc(12 * var(--u)) auto 0;
  font-weight: 300;
  font-size: calc(16 * var(--u));
  line-height: calc(20 * var(--u));
  text-align: right;
}
@media (max-width: 767px) {
  .allon4-inner {
    --u: min(1px, calc(100cqw / 390));
    min-height: calc(1579 * var(--u));
  }
  .allon4-band {
    height: calc(40 * var(--u));
    bottom: calc(-0.5 * var(--u));
  }
  .allon4-title {
    height: calc(107 * var(--u));
    padding-top: calc(71 * var(--u));
    font-size: calc(28 * var(--u));
    line-height: calc(36 * var(--u));
  }
  .allon4-title-s { font-size: calc(24 * var(--u)); }
  .allon4-title-en {
    top: calc(73 * var(--u));
    width: calc(94 * var(--u));
    transform: translateX(calc(-50% + 34.5 * var(--u)));
    font-size: calc(16 * var(--u));
    line-height: calc(36 * var(--u));
  }
  .allon4-rule {
    width: calc(64 * var(--u));
    margin-top: calc(33.5 * var(--u));
  }
  .allon4-tablewrap {
    display: flow-root;
    width: auto;
    margin: calc(46.5 * var(--u)) 0 0;
  }
  .allon4-table,
  .allon4-table tbody {
    display: block;
    width: auto;
  }
  .allon4-table thead { display: none; }
  .allon4-table th,
  .allon4-table td {
    display: block;
    width: auto;
    text-align: left;
  }
  .allon4-row {
    display: block;
    width: calc(342 * var(--u));
    margin: calc(40 * var(--u)) auto 0;
    background: #ffffff;
  }
  .allon4-row--economy  { margin-top: 0;   height: calc(406 * var(--u)); }
  .allon4-row--standard { height: calc(412 * var(--u)); }
  .allon4-row--premium  { height: calc(413.5 * var(--u)); }
  .allon4-c1 { position: static; }
  .allon4-c1-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .allon4-row--economy  .allon4-c1-inner { padding-top: calc(23.166 * var(--u)); }
  .allon4-row--standard .allon4-c1-inner { padding-top: calc(33.666 * var(--u)); }
  .allon4-row--premium  .allon4-c1-inner { padding-top: calc(23.666 * var(--u)); }
  .allon4-name {
    order: -1;
    padding-top: 0;
    transform: none;
    font-size: calc(20 * var(--u));
    line-height: calc(20 * var(--u));
    text-align: center;
  }
  .allon4-photo {
    position: static;
    width: calc(210 * var(--u));
    height: calc(144 * var(--u));
    margin-top: calc(22.334 * var(--u));
  }
  .allon4-row td {
    box-sizing: border-box;
    height: calc(56 * var(--u));
    margin: 0 calc(11.5 * var(--u)) 0 calc(27 * var(--u));
    border-top: 1px solid #dddddd;
    padding-top: calc(13.7328 * var(--u));
    font-size: calc(16 * var(--u));
    line-height: 1.6;
    white-space: nowrap;
  }
  .allon4-row--economy  td { padding-left: calc(32.5 * var(--u)); }
  .allon4-row--standard td { padding-left: calc(48.5 * var(--u)); }
  .allon4-row--premium  td { padding-left: calc(39 * var(--u)); }
  .allon4-row--economy  td:first-of-type { margin-top: calc(28.5 * var(--u)); }
  .allon4-row--standard td:first-of-type { margin-top: calc(24 * var(--u)); }
  .allon4-row--premium  td:first-of-type { margin-top: calc(29.25 * var(--u)); }
  .allon4-row--premium td { padding-top: calc(13.2328 * var(--u)); }
  .allon4-row--premium td:nth-of-type(3) {
    height: calc(62.25 * var(--u));
    padding-top: calc(2.2328 * var(--u));
  }
  .allon4-label {
    display: inline;
    font-weight: 500;
  }
  .allon4-val {
    display: inline;
    padding-top: 0;
    transform: none;
    font-weight: 300;
    font-size: inherit;
    line-height: inherit;
  }
  .allon4-c4 .allon4-val { transform: none; }
  .allon4-c4--multi .allon4-val { padding-top: 0; }
  .allon4-l2 {
    display: block;
    line-height: calc(22.4 * var(--u));
    margin-top: calc(-1.2 * var(--u));
  }
  .allon4-pc { display: none; }
  .allon4-sp { display: inline; }
  .allon4-note {
    width: calc(342 * var(--u));
    margin: calc(11.5 * var(--u)) auto 0;
    font-size: calc(14 * var(--u));
    line-height: calc(18 * var(--u));
  }
}
.allon4-note { text-wrap: pretty; }
@media (min-width: 768px) and (max-width: 1360px) {
  .allon4-title .allon4-title-en {
    --t: min(calc(48 * var(--u)), calc(-6.6757px + 4.0203vw));
    width: calc(3.41667 * var(--t));
    transform: translateX(calc(-50% + 1.40979 * var(--t)));
    font-size: max(12px, calc(0.58333 * var(--t)));
  }
}

/* 2026-10-16 PC・タブレット（768〜1920px）で（All-on-4）が「の費用」に重なる不具合の修正
   tablet-type.css で見出しの文字サイズが小さくなった後も、（All-on-4）の幅・位置が旧サイズ基準のままだったため。
   1921px 以上（デザイン原寸）と同じ比率で、「オールオン4」と「の」の間の空きに収める。
   見出しの文字サイズは tablet-type.css の .allon4-title / .allon4-title-s と同じ式。式を変えたらここも合わせる。 */
@media (min-width: 768px) and (max-width: 1920px) {
  .allon4-title {
    --a4-f: min(calc(48 * var(--u)), calc(3.3333px + 2.066vw));
    --a4-fs: min(calc(40 * var(--u)), calc(9.6667px + 1.5799vw));
  }
  .allon4-title .allon4-title-en {
    width: auto;
    font-size: calc(0.58333 * var(--a4-f));
    transform: translateX(calc(-50% + 1.826 * var(--a4-f) - var(--a4-fs) / 2));
  }
}
