@layer project {
  @layer parts;
  @layer content;
}
@layer project {
  :root {
    /* be adjust */
  }
  @layer parts {
    /* font */
    /* animation */
    @keyframes example {
      from {
        transform: 0 0;
      }
      to {
        transform: 1 1;
      }
    }
    /* common */
    /* pj */
    /* _ */
    /* js */
    /* m */
    /* form */
    /* util */
    /* embed */
    /* tpl */
    /* _component */
  }
  @layer content {
    /* freespace */
    /* _backend */
    /* _area */
    /* _auth */
    /* _bank */
    /* _blog */
    /* _blog/_blogpost */
    ._blog._blogpost._embed_content a {
      display: -webkit-flex;
      -webkit-flex-direction: column;
      display: flex;
      flex-direction: column;
      height: 100%;
    }
    ._blog._blogpost._embed_content img {
      width: 100%;
      aspect-ratio: 4/3;
      background-color: white;
    }
    ._blog._blogpost._embed_content img.noImage {
      object-fit: contain;
      padding: 25%;
    }
    ._blog._blogpost._embed_content header {
      margin: 1em 0 0.5em;
    }
    ._blog._blogpost._embed_content header b {
      display: block;
      font-size: 0.8em;
    }
    ._blog._blogpost._embed_content header h3 {
      margin: 0.35em 0;
    }
    ._blog._blogpost._embed_content header span {
      display: inline-block;
      font-size: 0.8em;
      color: gray;
    }
    ._blog._blogpost._embed_content p {
      font-size: 0.9em;
      margin-bottom: 1em;
    }
    ._blog._blogpost._embed_content footer {
      -webkit-justify-content: end;
      justify-content: end;
      margin-top: auto;
    }
    ._blog._blogpost._embed_content footer span {
      display: inline-block;
      font-size: 0.7em;
      color: gray;
      border-bottom: 1px solid var(--color-border-gray);
      padding: 0.1em 0.5em;
    }
    ._blog._blogpost._embed_content footer span::after {
      font-family: "FontAwesome solid";
      content: "\f105";
      vertical-align: baseline;
      margin-left: 0.35em;
    }
    ._blog._blogpost._tpl_stickyHeader {
      position: sticky;
      top: var(--stickyPageTop);
    }
    @media (max-width: 750px) {
      ._blog._blogpost._tpl_stickyHeader {
        padding-top: 5vh;
      }
    }
    @media (min-width: 751px) {
      ._blog._blogpost._tpl_stickyHeader {
        padding-top: 10vh;
      }
    }
    ._blog._blogpost._tpl_stickyHeader .image {
      max-width: 400px;
      margin-right: auto;
      margin-left: auto;
      padding: max(2.5cqw, 1em);
    }
    ._blog._blogpost._tpl_stickyHeader .image img {
      width: 100%;
    }
    ._blog._blogpost._tpl_stickyHeader i {
      display: block;
      font-family: "Mrs Saint Delafield", cursive;
      font-size: 5em;
      color: lightgray;
      rotate: -5deg;
    }
    ._blog._blogpost._tpl_stickyHeader em {
      display: block;
      letter-spacing: 0.2em;
      margin-top: -1em;
    }
    ._blog._blogpost._tpl_stickyHeader span {
      display: block;
      border-bottom: 1px solid var(--color-border-gray);
      text-align: center;
      padding: 3em 1em;
    }
    ._blog._blogpost._tpl_stickyHeader p {
      font-size: 0.85em;
      color: gray;
      line-height: 1.75;
      padding: 3em 1em;
    }
    @media (min-width: 1201px) {
      ._blog._blogpost._info :where(._c, ._i) {
        width: initial;
      }
    }
    @media (min-width: 1401px) {
      ._blog._blogpost._info :where(._c, ._i) {
        width: calc((100dvw - 1400px) / 2);
      }
    }
    @media (max-width: 750px) {
      ._blog._blogpost._info ._efg {
        display: grid;
        grid-template: "_e" "_f" "_g";
      }
    }
    ._blog._blogpost._info ._efg {
      font-family: "Noto Serif JP", serif;
      font-optical-sizing: auto;
    }
    @container _container (min-width: 601px) {
      ._blog._blogpost._info ._f .postList {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 2.5em min(1.5em, 4cqw);
      }
    }
    @container _container (min-width: 901px) {
      ._blog._blogpost._info ._f .postList {
        grid-template-columns: repeat(3, 1fr);
      }
    }
    @container _container (max-width: 600px) {
      ._blog._blogpost._info ._f .postList li {
        margin-bottom: max(5vh, 2.5em);
      }
    }
    ._blog._blogpost._info ._h {
      background-color: white;
    }
    ._blog._blogpost._info ._h .t-resultCount {
      text-align: right;
      margin: 0;
    }
    ._blog._blogpost._post ._f .mainImage {
      width: 100%;
      aspect-ratio: 16/9;
    }
    ._blog._blogpost._post ._f .postHeader {
      padding: 1em 0;
    }
    ._blog._blogpost._post ._f .postHeader b {
      display: block;
      font-size: 0.9em;
      margin-bottom: 0.5em;
    }
    ._blog._blogpost._post ._f .postHeader h1 {
      font-size: min(2em, 5cqw);
      margin-bottom: 0.5rem;
    }
    ._blog._blogpost._post ._f .postHeader span {
      display: inline-block;
      font-size: 0.9em;
      color: gray;
    }
    ._blog._blogpost._post ._f .generateIndex {
      border-top: 1px solid var(--color-border-gray);
      border-bottom: 1px solid var(--color-border-gray);
      padding-left: 2em;
      margin-bottom: 2em;
      position: relative;
    }
    @container _container (max-width: 400px) {
      ._blog._blogpost._post ._f .generateIndex {
        padding-left: 0;
      }
    }
    ._blog._blogpost._post ._f .generateIndex h3 {
      font-size: 0.8em;
      transform: translateY(100%) rotate(90deg);
      position: absolute;
      top: 1em;
      left: -0.5em;
      z-index: 0;
    }
    ._blog._blogpost._post ._f .generateIndex > ul > li {
      counter-increment: h2;
    }
    ._blog._blogpost._post ._f .generateIndex > ul > li > a::before {
      content: counter(h2) ".";
    }
    ._blog._blogpost._post ._f .generateIndex ul {
      padding-left: 1.5em;
    }
    ._blog._blogpost._post ._f .generateIndex a {
      display: -webkit-flex;
      -webkit-align-items: start;
      display: flex;
      align-items: start;
      cursor: pointer;
      padding: min(1.5em, 4cqw);
      padding-right: 0;
    }
    ._blog._blogpost._post ._f .generateIndex a:hover {
      color: var(--color-main);
    }
    ._blog._blogpost._post ._f .generateIndex a:not(.lastEl) {
      border-bottom: 1px dotted lightgray;
    }
    ._blog._blogpost._post ._f .generateIndex a::before {
      content: "-";
      margin-right: 1em;
    }
    @container _container (min-width: 401px) {
      ._blog._blogpost._post ._f .cmEditor {
        padding-left: 4em;
      }
    }
    ._blog._blogpost._post ._f .cmEditor {
      position: relative;
    }
    ._blog._blogpost._post ._f .cmEditor .fixedTitle {
      display: block;
      font-size: 0.8em;
      margin-bottom: -2em;
      transform: translateX(-2em) rotate(90deg);
      transform-origin: top left;
      position: sticky;
      top: calc(var(--stickyPageTop) + 4em);
      left: 0;
      z-index: 1;
    }
    @container _container (max-width: 400px) {
      ._blog._blogpost._post ._f .cmEditor .fixedTitle {
        display: none;
      }
    }
    ._blog._blogpost._post ._f .cmEditor p {
      line-height: 2;
    }
    ._blog._blogpost._post ._f .cmEditor figure.image {
      width: fit-content !important;
      max-width: 100%;
      margin: 2em auto;
    }
    ._blog._blogpost._post ._f .cmEditor figure.image img {
      display: block;
      padding: 0;
    }
    ._blog._blogpost._post ._f .cmEditor figcaption {
      font-size: 0.85em;
      color: gray;
      margin-top: 0.5em;
    }
    ._blog._blogpost._post ._f .postFooter dl {
      display: grid;
      grid-template-columns: auto auto;
      -webkit-justify-content: end;
      justify-content: end;
      -webkit-align-items: center;
      align-items: center;
      background-color: white;
      border-radius: var(--radius-m);
      padding: 0.75em 1.5em;
      margin: 0.5em 0;
    }
    ._blog._blogpost._post ._f .postFooter dt {
      font-size: 0.85em;
      margin-right: 1em;
    }
    ._blog._blogpost._post ._h .u-manages:has(*) {
      -webkit-justify-content: center;
      justify-content: center;
      max-width: initial;
      background-color: rgba(245, 245, 245, 0.5);
      margin-bottom: 2em;
    }
    /* _blog/_blogmanage */
    /* _community */
    /* _community/_community */
    /* _community/_topic */
    /* _community/_event */
    /* _community/_member */
    /* _community/_comment */
    /* _community/_communitymanage */
    /* _earnings */
    /* _event */
    /* _event/_event */
    /* _event/_eventmanage */
    /* _knowledge */
    /* _knowledge/_knowledge */
    /* _knowledge/_knowledgemanage */
    /* _mypage */
    /* _mypage/_config */
    /* _notification */
    /* _purchase */
    /* _purchase/_cart */
    /* _purchase/_purchasemanage */
    /* _questionnaire */
    /* _register */
    /* _reset_password */
    /* _sale */
    /* _stc */
    /* _stc/_case */
    /* _stc/_casemanage */
    /* _stp */
    /* _stp/_product */
    /* _stp/_productmanage */
    /* _str */
    /* _str/_reserve */
    /* _str/_reservemanage */
    /* _shipping */
    /* _sitetop */
    /* _sitetop/_index */
    /* _special */
    /* _user */
  }
}