*,
*::before,
*::after {
  min-width: 0px;
  min-height: 0px;
}

body {
  font-family: var(--font-serif);
  color: var(--snow);
  background-color: var(--ink);
  letter-spacing: 0.05em;
}

#root {
  max-width: 1920px;
  margin: 0 auto;
}

p, h1, h2, h3, h4, h5, h6 {
  margin: 0;
}
h1, h2, h3, h4, h5, h6 {
  font-weight: inherit;
  line-height: inherit;
}

img, iframe {
  max-width: 100%;
}
iframe {
  border: none;
  box-shadow: none;
}

a, a:hover {
  color: var(--snow);
}

[id] {
  scroll-margin-top: 3.75rem;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

button {
  position: relative;
  appearance: none;
  cursor: pointer;
  box-shadow: none;
  border: 0;
  outline: none;
  background: none;
  padding: 0;
}

.list {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  padding-left: 1.5rem;
  list-style: disc outside none;

  & > p {
    margin: 0;
    display: list-item;
  }
}

.webgene-pagination {
  & ul {
    list-style: none;
    display: flex;
    justify-content: center;
    gap: 1.25rem;
    padding: 0;
    margin: 0;

    & li {
      & a {
        display: inline-block;
        width: 3rem;
        line-height: 3rem;
        text-align: center;
        background-color: var(--gold-silver);
        &:hover {
          text-decoration: none;
        }
      }

      &.selected {
        & a {
          background-color: var(--gold);
          &:hover {}
        }
      }
    }
  }
}

.webgene-no-items {
  width: 100%;
  text-align: center;
  font-size: 0.875rem;
}

.thumbnail {
  position: relative;

  &.thumbnail--16x9 {
    padding-top: 56.25%;
  }

  & img,
  &:empty::before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  &:empty::before {
    content: "";
    background-image: url("/system_panel/uploads/images/thumbnail.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
  }
}

.article-body {
  line-height: 2.2;
  & > p {
    margin: 1em 0;
  }

  & > h1,
  & > h2,
  & > h3,
  & > h4,
  & > h5,
  & > h6 {
    margin: 2em 0 1em;
    line-height: 1.25;
  }

  & > *:first-child {
    margin-top: 0;
  }

  & > *:last-child {
    margin-bottom: 0;
  }

  & a,
  & a:hover {
    color: var(--blue);
    text-decoration: underline;
  }
}

.backdrop-object {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.page-hero {
  display: flex;
  flex-direction: column;
  padding: 7.5rem 1.25rem 1.25rem 2.5rem;
  gap: 3rem;
  height: 30rem;
  justify-content: end;
  position: relative;
  
  @media screen and (min-width: 768px) {
    padding: 7.5rem 2.5rem 3.75rem 7.5rem;
    height: 34rem;
  }
  @media screen and (min-width: 1024px) {
    padding-right: 3.75rem;
    padding-left: 12.5rem;
    height: 38.75rem;
  }
  @media screen and (min-width: 1200px) {
    padding-right: 5rem;
    padding-left: 17.5rem
  }
  
  &.page-hero--lg {
    height: auto;
    min-height: calc(var(--vh, 1vh) * 100);
    padding: 4rem 1.25rem 13.75rem 1.25rem;
    justify-content: end;
    
    @media screen and (min-width: 768px) {
      min-height: calc(var(--vh, 1vh) * 100 + 120px);
      padding-right: 2.5rem;
      padding-bottom: 15rem;
      padding-left: 7.5rem;
    }
    @media screen and (min-width: 1024px) {
      padding-right: 3.75rem;
      padding-bottom: 17.5rem;
      padding-left: 12.5rem;
    }
    @media screen and (min-width: 1200px) {
      padding-right: 5rem;
      padding-left: 17.5rem
    }
  }
}

.page-hero__image::before {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-image: linear-gradient(180deg, rgba(39, 38, 37, 0.65) 0%, rgba(39, 38, 37, 0.20) 34.62%, rgba(39, 38, 37, 0.30) 65.87%, #272625 100%);
  pointer-events: none;
}

.page-hero__title-box {
  display: flex;
  flex-direction: column;
  gap: 1.125rem;
  position: relative;
  
  & .page-hero__title--en {
    line-height: 1;
    letter-spacing: 0.15em;
    color: var(--snow);
    opacity: 40%;
    font-size: 2.5rem;
    
    @media screen and (min-width: 768px) {
      font-size: 4rem;
    }
    @media screen and (min-width: 1024px) {
      font-size: 6rem;
    }
  }
  
  & .page-hero__title--ja {
    line-height: 1.1;
    letter-spacing: 0;
    font-weight: 500;
    font-size: 1.125rem;
    
    @media screen and (min-width: 768px) {
      font-size: 1.5rem;
    }
    @media screen and (min-width: 1024px) {
      font-size: 2rem;
    }
  }
}

.section-title {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  line-height: 1.1;
  
  & .section-title__en {
    letter-spacing: 0.15em;
    color: var(--gold-silver);
    font-size: 1.25rem;
    
    @media screen and (min-width: 768px) {
      font-size: 1.75rem;
    }
    @media screen and (min-width: 1024px) {
      font-size: 2rem;
    }
  }
  
  & .section-title__ja {
    letter-spacing: 0;
    font-weight: 500;
    font-size: 1.75rem;
    
    @media screen and (min-width: 768px) {
      font-size: 2.5rem;
    }
    @media screen and (min-width: 1024px) {
      font-size: 3rem;
    }
  }
  
  &.section-title--small {
    & .section-title__en {
      @media screen and (min-width: 768px) {
        font-size: 1.5rem;
      }
      @media screen and (min-width: 1024px) {
        font-size: 1.5rem;
      }
    }
    & .section-title__ja {
      @media screen and (min-width: 768px) {
        font-size: 2rem;
      }
      @media screen and (min-width: 1024px) {
        font-size: 2rem;
      }
    }
  }
}

.button {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  color: var(--snow);
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.25;
  font-size: 1.25rem;
  transition: opacity ease 200ms;
  
  &::before {
    content: "";
    display: block;
    background-color: var(--snow);
    height: 0.0625rem;
    width: 5rem;
  }
  
  &::after {
    content: "";
    display: block;
    background-color: var(--gold);
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 9999px;
    transition: all ease 200ms;
  }
  
  &:hover {
    color: var(--snow);
    opacity: 80%;
    text-decoration: none;
    
    &::after {
      transform: scale(0.5);
    }
  }
}

.commitment-num {
  --num-size: 2rem;
  font-weight: 500;
  font-size: var(--num-size);
  letter-spacing: 0;
  line-height: 1;
  position: relative;
  
  & p {
    position: relative;
    margin-left: 0.75rem;
    
    @media screen and (min-width: 768px) {
      margin-left: 1.125rem;
    }
    @media screen and (min-width: 1024px) {
      margin-left: 1.5rem;
    }
  }
  
  &::before {
    content: "";
    display: block;
    height: var(--num-size);
    width: var(--num-size);
    border: 1px solid var(--gold);
    position: absolute;
    top: -0.75rem;
    left: -0.75rem;
    
    @media screen and (min-width: 768px) {
      top: -1.25rem;
      left: -1.125rem;
    }
    @media screen and (min-width: 1024px) {
      top: -1.75rem;
      left: -1.25rem;
    }
  }
  
  @media screen and (min-width: 768px) {
    --num-size: 3rem;
  }
  @media screen and (min-width: 1024px) {
    --num-size: 3.75rem;
  }
}

.footer-contact-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  
  & img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
  }
  &::after {
    content: "";
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, rgba(39, 38, 37, 0.00) 0%, rgba(39, 38, 37, 0.00) 72.6%, #272625 100%);
    pointer-events: none;
  }
}

.commitment-stamp {
  position: absolute;
  width: 40.625%;
  top: 0;
  z-index: -1;
  transform: translateY(-38.46153846%);
  &.commitment-stamp--right {
    right: -10.9375%;
  }
  &.commitment-stamp--left {
    left: -10.9375%;
  }
}

@media screen and (min-width: 1024px) {
  .has-bottom-header #chatbot-btn {
    bottom: 6rem !important;
  }
}

.product-item {
  &.product-item--wadama {
    position: relative;
    &::before {
      content: "";
      background-image: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2280%22%20height%3D%2280%22%20viewBox%3D%220%200%2080%2080%22%20fill%3D%22none%22%3E%0A%3Cpath%20d%3D%22M61.6084%206.2142C68.3224%206.2142%2073.7857%2011.6775%2073.7857%2018.3914V61.6086C73.7857%2068.3225%2068.3224%2073.7858%2061.6084%2073.7858H18.3913C11.6774%2073.7858%206.21407%2068.3225%206.21407%2061.6086V18.3914C6.21407%2011.6775%2011.6774%206.2142%2018.3913%206.2142H61.6084ZM61.6084%200H18.3913C8.23369%200%20-0.00012207%208.23381%20-0.00012207%2018.3914V61.6086C-0.00012207%2071.7662%208.23369%2080%2018.3913%2080H61.6084C71.7661%2080%2079.9999%2071.7662%2079.9999%2061.6086V18.3914C79.9973%208.23381%2071.7635%200%2061.6084%200Z%22%20fill%3D%22%23CB472D%22%2F%3E%0A%3Cpath%20d%3D%22M27.464%2041.7931C26.9099%2041.1276%2026.5915%2040.413%2026.5138%2039.6492C26.6717%2038.7507%2026.7908%2037.8703%2026.8711%2037.0055V33.0673L26.6924%2030.8224L26.216%2030.7214C25.2658%2031.6872%2024.1757%2032.5158%2022.9484%2033.2149C22.5522%2033.3469%2022.1949%2033.5489%2021.879%2033.813L20.5715%2034.7115C19.9785%2034.9782%2019.3442%2035.1594%2018.6709%2035.2604C17.4436%2035.3924%2016.3743%2035.5763%2015.4629%2035.8093L14.1553%2035.3614L13.7384%2034.9626L12.7286%2034.9134C12.0554%2034.2816%2011.6774%2033.567%2011.5997%2032.7695C11.7965%2031.7727%2012.115%2030.8095%2012.55%2029.8773L13.5598%2029.577L14.1527%2029.3284C14.9839%2029.8929%2015.9341%2030.1751%2017.0035%2030.1751C18.2696%2029.9757%2019.44%2029.4941%2020.5093%2028.7277C22.2907%2027.3994%2023.9142%2025.9857%2025.3797%2024.4891L24.7272%2024.3389H23.7174C21.7366%2024.704%2019.7973%2025.1701%2017.8942%2025.7345L17.2417%2026.2835C16.5296%2026.5502%2015.7762%2026.6822%2014.9839%2026.6822L14.5074%2026.3818C14.2692%2025.9494%2014.0699%2025.517%2013.9145%2025.0846L14.0932%2024.5357L14.1527%2023.5389C14.2304%2022.8087%2014.5696%2022.2261%2015.1625%2021.7937C17.8165%2020.6648%2020.7268%2020.1159%2023.896%2020.1469L25.025%2020.2971C25.9752%2020.1651%2026.9048%2020.0485%2027.8162%2019.9476L27.6971%2019.2485L27.7566%2018.8497C27.9948%2018.3189%2028.29%2017.9021%2028.6473%2017.6017L29.7167%2017.5033C30.2319%2017.9694%2030.5478%2018.4691%2030.6669%2018.9999L30.9051%2019.7974C33.44%2019.8647%2035.7962%2020.2453%2037.9738%2020.9444C38.2897%2021.2448%2038.4683%2021.6099%2038.5072%2022.0423C38.1887%2022.441%2037.9531%2022.889%2037.7951%2023.3887L36.7258%2024.2871L35.8351%2024.238C34.6466%2024.1396%2033.5177%2024.0722%2032.4483%2024.0386C31.8942%2024.0049%2031.3971%2024.1059%2030.9621%2024.3389C30.6436%2024.805%2030.5245%2025.3047%2030.6048%2025.8355C30.843%2026.0685%2031.1589%2026.2524%2031.555%2026.3844C32.6244%2026.7159%2033.6523%2027.1819%2034.644%2027.78C35.4752%2028.4118%2035.892%2029.1601%2035.892%2030.0249L35.5943%2031.071C34.8822%2031.3377%2034.1288%2031.5862%2033.3364%2031.8193C32.148%2031.4205%2031.0786%2030.8561%2030.1284%2030.1233C29.929%2030.3227%2029.8513%2030.5713%2029.8902%2030.8716C29.6131%2033.3987%2029.494%2035.9569%2029.5328%2038.5513C29.4137%2039.6828%2029.116%2040.6641%2028.6421%2041.4927C28.2848%2041.7257%2027.8887%2041.8241%2027.4537%2041.7931H27.464ZM22.3554%2017.6095L19.6833%2016.711L18.8522%2014.0182C18.891%2013.5185%2019.1681%2013.055%2019.6833%2012.6226C20.7139%2012.3222%2021.703%2011.9908%2022.6532%2011.6257L23.1296%2011.4264C24.0799%2011.7267%2025.0094%2012.0581%2025.9208%2012.4232L26.5138%2012.7728C30.4727%2011.7086%2034.3955%2010.5952%2038.2767%209.43263C38.7532%209.53361%2039.1881%209.71486%2039.5843%209.98155L39.8225%2010.6806L39.17%2011.6775C38.2586%2012.5087%2037.21%2013.257%2036.0215%2013.9224C34.0796%2015.1859%2031.8632%2015.9679%2029.3671%2016.2657L28.8907%2016.7136C27.8602%2016.9466%2026.8115%2017.1305%2025.7422%2017.2625L24.7919%2017.4127L23.7821%2017.2625C23.386%2017.4282%2022.9095%2017.5447%2022.3554%2017.6121V17.6095ZM62.5147%2034.5639C59.941%2033.9658%2057.3077%2033.4997%2054.6149%2033.1683L53.486%2033.3184L52.9526%2033.1683C52.1214%2033.3003%2051.3084%2033.4013%2050.5161%2033.4686C50.0811%2033.2356%2049.584%2033.1372%2049.0325%2033.1683C46.9326%2033.5334%2044.8741%2033.9839%2042.8545%2034.5147L42.3211%2034.015C41.4097%2034.0823%2040.5993%2033.8984%2039.8847%2033.466L39.6464%2032.8679C39.6464%2031.8374%2040.0219%2030.9571%2040.7754%2030.2243C41.2518%2030.1233%2041.6065%2029.9084%2041.8447%2029.577C42.8338%2027.6817%2043.4889%2025.6879%2043.8048%2023.5932L41.7852%2022.7465C41.4278%2022.4799%2041.2518%2022.1821%2041.2518%2021.8481L41.5495%2020.802C41.8654%2020.2039%2042.1036%2019.6394%2042.2616%2019.1061L43.8643%2018.7565V18.1092L44.5168%2018.06C44.7939%2018.2257%2045.0916%2018.293%2045.4075%2018.2594C46.2387%2018.0937%2047.1501%2017.9771%2048.1392%2017.9098L48.7321%2018.0108L49.9206%2017.8606C55.6247%2017.827%2061.0285%2018.8083%2066.1396%2020.802L66.497%2021.4001C66.4167%2021.8999%2066.1785%2022.3141%2065.7849%2022.6482L65.0133%2023.2955C64.6974%2023.6295%2064.5395%2024.0101%2064.5395%2024.4425C64.6172%2025.2089%2064.8372%2025.921%2065.192%2026.5864V27.0861L65.1324%2027.635C65.6477%2028.8649%2066.0231%2030.1466%2066.2613%2031.4749C66.1811%2032.1067%2065.8056%2032.6711%2065.1324%2033.1709C64.7751%2033.3702%2064.3401%2033.5359%2063.8248%2033.6706L63.3484%2034.4189L62.5173%2034.5691L62.5147%2034.5639ZM62.8694%2030.6748L62.9885%2030.1751C62.6312%2027.8474%2062.0564%2025.5869%2061.2667%2023.3939C59.8012%2023.0624%2058.3149%2022.8631%2056.8106%2022.7957C53.5637%2022.7284%2050.3349%2022.7465%2047.1268%2022.8449C47.0465%2024.1422%2046.7902%2025.3876%2046.3552%2026.5838C46.1558%2027.5159%2045.9772%2028.4299%2045.8218%2029.3258C46.2568%2029.5252%2046.7513%2029.5744%2047.3054%2029.476L49.0868%2029.3258L49.5633%2029.375C50.7906%2029.2766%2051.9997%2029.2093%2053.1856%2029.1756L53.8977%2029.2248C57.1834%2029.2922%2060.174%2029.7738%2062.8668%2030.6722L62.8694%2030.6748Z%22%20fill%3D%22%23CB472D%22%2F%3E%0A%3Cpath%20d%3D%22M60.2569%2070.4172C59.5837%2070.2515%2058.9286%2070.135%2058.2968%2070.0676C50.8915%2067.9393%2044.4754%2066.7767%2039.0483%2066.5773C38.0178%2066.51%2037.0676%2066.4272%2036.1976%2066.3288C35.7211%2066.4608%2035.2473%2066.5126%2034.7709%2066.4789C33.3054%2066.378%2031.8787%2066.2977%2030.4935%2066.2304C29.582%2066.3314%2028.6525%2066.3469%2027.7022%2066.2796C26.594%2066.4453%2025.4651%2066.5618%2024.3155%2066.6291L23.8417%2066.5799C22.3347%2067.0123%2020.7708%2067.3774%2019.1474%2067.6778C18.948%2068.1102%2018.6528%2068.4934%2018.2567%2068.8248L17.7828%2069.1744C17.4255%2069.2417%2017.1666%2069.3737%2017.0112%2069.5731C16.6539%2069.9382%2016.2992%2070.2722%2015.9419%2070.57H15.2894C14.4168%2070.3369%2013.5675%2070.0547%2012.7338%2069.7233C12.4153%2069.3582%2012.3169%2068.9413%2012.436%2068.4753C12.594%2068.0428%2012.6328%2067.5949%2012.5551%2067.1288L12.4956%2066.7793C13.4458%2066.0802%2014.4556%2065.4665%2015.525%2064.9332C17.2287%2064.102%2019.1085%2063.5712%2021.1696%2063.3382L22.7128%2063.4884L30.8508%2063.188L34.5922%2063.2372L35.3043%2062.7375C35.5813%2061.6733%2035.7211%2060.578%2035.7211%2059.4465C35.6823%2058.416%2035.7004%2057.37%2035.7807%2056.3058L34.0588%2056.1556H33.3468C32.0004%2056.1556%2030.9103%2056.355%2030.0792%2056.7537C29.8021%2056.9868%2029.3853%2057.0696%2028.8312%2057.0023C27.8006%2057.0696%2027.2465%2057.0852%2027.1689%2057.0515C26.5759%2057.0852%2025.9597%2057.168%2025.3279%2057.3001C24.1783%2056.9686%2023.7252%2056.3032%2023.9608%2055.3063C24.2378%2054.8739%2024.3776%2054.3587%2024.3776%2053.7606L24.8515%2053.6104L25.2683%2053.2608C26.6536%2053.0278%2027.6039%2052.8621%2028.1191%2052.7611H28.6525C29.2843%2052.8595%2029.9186%2052.8932%2030.553%2052.8595C32.5338%2052.7611%2034.3152%2052.6265%2035.8998%2052.4608L35.9594%2051.7125C35.9205%2050.5499%2035.6823%2049.4365%2035.2473%2048.3723L33.9397%2048.3231L33.3468%2048.4241C32.3163%2048.5225%2031.1278%2048.7245%2029.7814%2049.0222C29.6623%2049.2216%2029.4733%2049.2812%2029.217%2049.1957C28.958%2049.1129%2028.6525%2049.0714%2028.2952%2049.0714L27.8188%2049.1206C27.4614%2048.9213%2027.0264%2048.8539%2026.5112%2048.9213C25.5221%2048.8229%2024.6702%2048.639%2023.9556%2048.3723C23.6397%2047.9063%2023.4818%2047.4247%2023.4818%2046.9275L23.5413%2046.6272C23.5802%2046.1611%2023.8184%2045.7805%2024.2534%2045.4801C25.9959%2044.5817%2028.0337%2043.9836%2030.3718%2043.6858C30.7291%2043.9861%2031.1822%2044.1027%2031.7389%2044.0353C33.3235%2044.1027%2035.1852%2044.0353%2037.3239%2043.836H42.492C45.5007%2043.735%2048.8279%2044.3176%2052.4736%2045.5811C52.9888%2046.3113%2053.1079%2047.0777%2052.8309%2047.8752L51.6424%2048.2739L51.166%2048.6235H50.6896C49.0273%2048.4578%2047.422%2048.3413%2045.8788%2048.2739C43.8592%2048.0409%2042.3936%2047.8597%2041.4822%2047.725L40.8297%2047.826H39.8795L39.4626%2048.0254L40.0555%2049.1724C40.2135%2049.8715%2040.1928%2050.5525%2039.996%2051.2179C39.996%2051.6503%2040.1332%2052.0491%2040.4129%2052.4141C43.9783%2052.2484%2047.8777%2052.7637%2052.1163%2053.9599L52.5927%2054.7082L53.0691%2055.5549L52.4762%2056.1038L51.4068%2056.4534C50.1381%2056.355%2048.9108%2056.3213%2047.7249%2056.355C46.7746%2056.0883%2045.7648%2055.9407%2044.6955%2055.907C43.4267%2056.1064%2042.7147%2056.2229%2042.5568%2056.2566L41.4278%2056.1582L40.7754%2056.2566L40.0633%2056.3576L40.0038%2059.4983C39.8458%2059.765%2039.7656%2060.0473%2039.7656%2060.345C39.7656%2061.2098%2039.8251%2062.0565%2039.9442%2062.8877L39.7656%2063.2372C42.7354%2063.636%2044.8949%2063.8535%2046.2413%2063.8845L45.9435%2063.2864C45.9047%2062.854%2045.9047%2062.3232%2045.9435%2061.6914L45.7648%2060.9431C45.5655%2060.4434%2045.4075%2059.8971%2045.2884%2059.2964L44.755%2058.996C45.1123%2058.9287%2045.4464%2058.864%2045.7648%2058.7967L46.1817%2058.4471C46.5779%2058.3461%2046.873%2058.2969%2047.0724%2058.2969C48.0615%2058.2633%2048.8927%2058.5144%2049.5684%2059.0452C50.5187%2060.1094%2050.9951%2061.2901%2050.9951%2062.5847C50.7957%2063.2502%2050.5394%2063.8975%2050.2235%2064.5292C54.0634%2065.0937%2057.1524%2065.5261%2059.4904%2065.8265C62.0253%2065.262%2064.4204%2064.6121%2066.6782%2063.8819L67.2711%2063.7318L68.4%2063.9803L67.8071%2065.0264L67.1546%2065.6245L66.2044%2065.974C65.5312%2066.9062%2064.6379%2067.6027%2063.5323%2068.0687L62.7607%2068.4183C62.2454%2068.9827%2061.4143%2069.6482%2060.2646%2070.412L60.2569%2070.4172Z%22%20fill%3D%22%23CB472D%22%2F%3E%0A%3C%2Fsvg%3E');
      width: 5rem;
      height: 5rem;
      background-size: contain;
      background-repeat: no-repeat;
      position: absolute;
      transform: rotate(-11.72deg);
      top: -1.25rem;
      left: -1.25rem;
    }
  }
}

.blog-section-grid {
  display: grid;
  gap: 4rem;
  
  @media screen and (min-width: 1200px) {
    grid-template-columns: 15rem 1fr;
  }
  @media screen and (min-width: 1440px) {
    gap: 5rem;
  }
}

.category-list {
  & .webgene-blog {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    
    & a {
      display: flex;
      line-height: 1.25;
      align-items: center;
      gap: 0.5rem;
      font-size: 0.875rem;
      &::before {
        width: 0.5rem;
        height: 0.5rem;
        border-radius: 9999px;
        background-color: var(--gold);
        content: "";
        display: inline-block;
      }
    }
  }
}

.blog-list {
  & .webgene-blog {
    display: grid;
    gap: 2rem;
  }
  & .webgene-item {
    & a {
      display: block;
      padding-top: 125%;
      z-index: 0;
      &::after {
        content: "";
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(180deg, rgba(39, 38, 37, 0.00) 0%, #272625 100%);
        z-index: -1;
      }
    }
    & .thumbnail {
      padding: none;
      height: 100%;
      width: 100%;
      position: absolute;
      top: 0;
      left: 0;
      z-index: -1;
    }
  }
  & .webgene-pagination {
    padding-top: 2rem;
  }
  
  @media screen and (min-width: 768px) {
    & .webgene-blog {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      row-gap: 0;
    }
    & .webgene-item:nth-child(even) {
      margin-top: 2.5rem;
    }
    & .webgene-no-items, & .webgene-pagination {
      grid-column: span 2 / span 2;
    }
  }
   @media screen and (min-width: 1440px) {
    & .webgene-blog {
      column-gap: 3rem;
    }
  }
}

.adapted-section {
  display: flex;
  flex-direction: column;
  z-index: 0;
  gap: 4rem;
  position: relative;

  & .adapted-section__image {
    position: relative;
    z-index: -1;
  }
  
  @media screen and (min-width: 1200px) {
    flex-direction: row;
    align-items: center;
    gap: 0;
    & .adapted-section__content {
      flex: 1 0 0%;
    }
    &.adapted-section--left {
      padding-left: 0;
      & .adapted-section__image {
        margin-right: -13.15789474%;
        width: 43.42%;
        &::after {
          content: "";
          position: absolute;
          inset: 0;
          width: 100%;
          height: 100%;
          background: linear-gradient(90deg, rgba(39, 38, 37, 0.00) 0%, rgba(39, 38, 37, 0.00) 56.95%, #272625 100%);
          z-index: 1;
          pointer-events: none;
        }
      }
      & .adapted-section__content {
      }
    }
    &.adapted-section--right {
      flex-direction: row-reverse;
      padding-right: 0;
      & .adapted-section__image {
        width: 52.94117647%;
        margin-left: -15rem;
        &::after {
          content: "";
          position: absolute;
          inset: 0;
          width: 100%;
          height: 100%;
          background: linear-gradient(90deg, #272625 0%, rgba(39, 38, 37, 0.00) 56.95%, rgba(39, 38, 37, 0.00) 100%);
          z-index: 1;
          pointer-events: none;
        }
      }
    }
    &.adapted-section--konjac {
      &.adapted-section--left {
        & .adapted-section__image {
          width: auto;
        }
      }
      &.adapted-section--right {
        & .adapted-section__image {
          width: auto;
        }
      }
    }
  }
}

.wadama-promise {
  padding-top: 22.5rem;
  padding-bottom: 10rem;
  position: relative;
  
  & .wadama-promise__logo {
    position: absolute;
    top: 1.25rem;
    left: 7.5rem;
    width: 156px;
  }
  & .wadama-promise__image {
    position: absolute;
    opacity: 0.35;
    top: 1.875rem;
    right: 40%;
    transform: translateX(50%);
    width: 57.5625%;
    max-width: 57.5625rem;
    min-width: 660px;
    & img {
      width: 100%;
      aspect-ratio: 4 / 3;
      object-fit: cover;
    }
  }
}

.wadama-future {
  min-height: calc(var(--vh, 1vh) * 100);
}
.wadama-gallery {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 95vw;
  max-width: 90rem;
  height: 66.6666%;
  opacity: 0.35;
  
  & .swiper {
    overflow: visible;
    width: 100%;
    height: 100%;

    &:not(.swiper-initialized) {
      & .swiper-wrapper {
        overflow: auto;
        display: flex;
      }
      & .swiper-slide {
        min-width: 800px;
        width: 800px;
      }
    }
    & .swiper-wrapper {
      transition-timing-function: linear;
    }
    & .swiper-slide {
      & img {
        width: 100%;
        height: 100%;
        object-fit: cover;
      }
    }
  }
}

.konjac-bg-image {
  opacity: 35%;
  position: absolute;
  
  & img {
    object-fit: cover;
    aspect-ratio: 4 / 3;
    width: 100%;
  }
  
  &.konjac-bg-image--tl {
    width: 37.5%;
    max-width: 37.5rem;
    top: 0;
    left: 0;
    transform: translate(23.333%, 17.777%);
  }
  
  &.konjac-bg-image--br {
    width: 45%;
    max-width: 45rem;
    right: 1.25rem;
    bottom: 1.5rem;
  }
}


.swiper:not(.swiper-initialized) .swiper-wrapper {
  display: flex;
  overflow: auto;
  
  & .swiper-slide {
    min-width: 100%;
  }
}