/* //////////////////////////////////////////////////

Title : page.scss
For   : bell-c/

Created       : 2025-11-18
Last Modified : 2025-11-18

==========================================

Content

////////////////////////////////////////////////// */
/**
 * layouts
 */
/* --- for small viewport --- */
/* --- for large viewport --- */
@media (min-width: 768px) {
  .p-page-layout[data-layout-type=columns] {
    display: grid;
    grid-template-columns: 95rem auto;
    justify-content: space-between;
  }
  .p-page-layout[data-layout-type=columns] > *:not(.p-page-layout__stiky-item) {
    grid-column: 1;
  }
  .p-page-layout[data-layout-type=columns] [data-layout-item=sticky-item] {
    grid-column: 2;
    grid-row: 2;
    align-self: start;
  }
  .p-page-layout[data-layout-type=columns] [data-layout-item=full-columns] {
    grid-column: 1/-1;
  }
}
/**
 * common
 */
/* --- for small viewport --- */
@media (max-width: 767px) {
  :where(p, ol, ul) {
    font-size: 1.4rem;
  }
}
/* --- for large viewport --- */
@media (min-width: 768px) {
  :where(p, ol, ul) {
    font-size: 1.8rem;
  }
}
/**
 * page section
 */
.l-page-section__container {
  max-width: var(--container-middle);
  margin-inline: auto;
}

/* --- for small viewport --- */
@media (max-width: 767px) {
  .l-page-section {
    width: 100%;
    padding-inline: 2rem;
    padding-bottom: 4rem;
  }
}
/* --- for large viewport --- */
@media (min-width: 768px) {
  .l-page-section {
    width: var(--page-section-width, 75%);
    max-width: var(--page-section-max-width, var(--container-wide));
    margin: 0 auto;
    padding-bottom: 12rem;
  }
  .l-page-section:last-of-type {
    padding-bottom: 16rem;
  }
}
.l-page-section-bg {
  background-color: var(--color-background-default);
}
.l-page-section-bg .c-page-section__inner {
  border-radius: var(--section-inner-border-radius, 1.2rem);
  background-color: var(--color-white);
}
.l-page-section-bg--gradient {
  background: var(--color-background-gradient);
}

/* --- for small viewport --- */
@media (max-width: 767px) {
  .l-page-section-bg {
    width: 100%;
    padding: 4rem 2rem;
  }
  .l-page-section-bg .c-page-section__inner {
    padding: 4rem 1.75rem;
  }
}
/* --- for large viewport --- */
@media (min-width: 768px) {
  .l-page-section-bg {
    padding-block: 12rem;
    padding-inline: var(--global-gutter);
  }
  .l-page-section-bg .c-page-section__inner {
    padding-block: 8rem;
    padding-inline: 12rem;
    width: 100%;
    max-width: var(--container-wide);
    margin: 0 auto;
  }
}
/**
 * sitemap
 */
.p-sitemap {
  --contents-gutter: 2rem;
  max-width: calc(120rem + var(--contents-gutter) * 2);
  margin-inline: auto;
  padding-inline: var(--contents-gutter);
  -webkit-padding-after: 8rem;
          padding-block-end: 8rem;
  line-height: 2;
}
.p-sitemap__list {
  display: grid;
}
.p-sitemap__item h2 {
  padding-inline: 1em;
  background-color: var(--color-background-default);
  font-size: 1.5em;
  color: var(--color-primary);
  font-weight: 700;
}
.p-sitemap__item h2 + * {
  -webkit-margin-before: 1.5em;
          margin-block-start: 1.5em;
}
.p-sitemap__item :where(ul, ol) {
  -webkit-padding-start: 1.5em;
          padding-inline-start: 1.5em;
}
.p-sitemap__item :where(ul, ol) > * + * {
  -webkit-margin-before: 1em;
          margin-block-start: 1em;
}
.p-sitemap__item :where(ul) li {
  list-style: disc;
}
.p-sitemap__item :where(ol) li {
  list-style: decimal;
}

/* --- for small viewport --- */
@media (max-width: 767px) {
  .p-sitemap__list {
    grid-template-columns: 100%;
    row-gap: 2rem;
    font-size: 1.2rem;
  }
}
/* --- for large viewport --- */
@media (min-width: 768px) {
  .p-sitemap__list {
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem;
    font-size: 1.6rem;
  }
}
/*# sourceMappingURL=page.css.map */