.information-page .information-hero .hero-grid {
  grid-template-columns: minmax(0, 1fr) 180px;
  gap: 40px;
  align-items: center;
  padding: 0 0 10px
}

.information-page .information-hero h1 {
  font-size: 36px;
  line-height: 1.35;
  margin-bottom: 16px
}

.information-hero-art {
  position: relative;
  width: 145px;
  height: 150px;
  display: grid;
  place-items: center;
  background: linear-gradient(150deg, #fffbff, #e9dcfc);
  border: 1px solid #fff;
  border-radius: 28px;
  transform: rotate(7deg);
  box-shadow: 0 12px 25px #6e45881a;
  color: #9c79c5
}

.information-hero-art>span:first-child>.icon {
  width: 68px;
  height: 68px;
  stroke-width: 1.2
}

.information-art-badge {
  position: absolute;
  right: -14px;
  bottom: -5px;
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: #6035ce;
  color: #fff;
  border: 2px solid #ffffffb0;
  box-shadow: 0 6px 15px #6035ce20;
  transform: rotate(-7deg)
}

.information-art-badge .icon {
  width: 27px;
  height: 27px
}

.information-page .content-layout {
  grid-template-columns: minmax(0, 1fr) 315px;
  gap: 26px;
  align-items: start
}

.information-page .information-article {
  padding: 30px
}

.information-section {
  padding: 27px 0;
  border-bottom: 1px solid var(--line);
  scroll-margin-top: 25px
}

.information-section:first-child {
  padding-top: 0
}

.information-section:last-child {
  border: 0;
  padding-bottom: 0
}

.information-section h2 {
  font-size: 23px;
  line-height: 1.5;
  letter-spacing: -.4px;
  margin: 0 0 17px
}

.information-page .information-section p {
  font-size: 16px;
  line-height: 1.9;
  margin: 0 0 17px
}

.information-page .information-section p:last-child {
  margin-bottom: 0
}

.information-section a {
  color: #6d3cbd;
  text-decoration: underline;
  text-underline-offset: 3px
}

.information-section strong {
  font-weight: 700;
  color: #493354
}

.information-section:first-child>p:first-of-type {
  padding: 17px 19px;
  border-left: 3px solid #a681d6;
  border-radius: 0 8px 8px 0;
  background: #f7f3fc;
  color: #665074
}

.information-source-list {
  padding: 0;
  margin: 19px 0 22px;
  list-style: none;
  display: grid;
  gap: 15px
}

.information-source-list li {
  position: relative;
  padding-left: 20px;
  font-size: 16px;
  line-height: 1.9;
  color: var(--muted)
}

.information-source-list li:before {
  content: '';
  position: absolute;
  width: 6px;
  height: 6px;
  top: 12px;
  left: 1px;
  border-radius: 50%;
  background: #a17dca
}

.information-page .information-contents {
  border-top: 3px solid #a57bd5;
  padding: 24px
}

.information-contents>h2 {
  font-size: 19px;
  line-height: 1.5;
  margin: 0 0 14px
}

.information-contents .download-contents {
  border: 0
}

.information-contents .download-contents a {
  font-size: 14px;
  padding: 12px 0;
  line-height: 1.7
}

.information-page .section-nav-track a {
  font-size: 14px
}

.simple-footer [aria-current="page"] {
  text-decoration: underline;
  text-underline-offset: 4px
}

@media(max-width:1100px) and (min-width:801px) {
  .information-page .content-layout {
    grid-template-columns: minmax(0, 1fr) 280px;
    gap: 22px
  }

  .information-page .information-hero .hero-grid {
    grid-template-columns: minmax(0, 1fr) 160px
  }

  .information-page .information-hero h1 {
    font-size: 32px
  }

  .information-page .information-article {
    padding: 26px
  }

  .information-hero-art {
    width: 130px;
    height: 140px
  }
}

@media(max-width:800px) {
  .information-page .information-hero .hero-grid {
    grid-template-columns: minmax(0, 1fr) 115px;
    gap: 22px
  }

  .information-page .information-hero h1 {
    font-size: 29px
  }

  .information-hero-art {
    width: 100px;
    height: 110px;
    border-radius: 22px
  }

  .information-hero-art>span:first-child>.icon {
    width: 48px;
    height: 48px
  }

  .information-art-badge {
    width: 36px;
    height: 36px;
    right: -9px;
    bottom: -4px
  }

  .information-art-badge .icon {
    width: 21px;
    height: 21px
  }

  .information-page .main-column {
    display: block;
    width: 100%
  }

  .information-page .content-layout>aside {
    display: none
  }

  .information-page .information-article {
    padding: 24px
  }

  .information-section h2 {
    font-size: 22px
  }

  .information-section {
    padding: 24px 0
  }
}

@media(max-width:550px) {
  .information-page .information-hero .hero-grid {
    grid-template-columns: minmax(0, 1fr) 76px;
    gap: 14px
  }

  .information-page .information-hero .hero-copy {
    display: contents
  }

  .information-page .information-hero h1 {
    grid-column: 1;
    grid-row: 1;
    font-size: 26px;
    align-self: center;
    margin: 0
  }

  .information-hero-art {
    grid-column: 2;
    grid-row: 1;
    width: 67px;
    height: 78px;
    border-radius: 17px
  }

  .information-hero-art>span:first-child>.icon {
    width: 35px;
    height: 35px
  }

  .information-art-badge {
    width: 26px;
    height: 26px;
    right: -5px;
    bottom: -3px
  }

  .information-art-badge .icon {
    width: 16px;
    height: 16px
  }

  .information-page .information-article {
    padding: 20px
  }

  .information-section h2 {
    font-size: 21px
  }

  .information-page .information-section p,
  .information-source-list li {
    font-size: 16px;
    line-height: 1.85
  }

  .information-section:first-child>p:first-of-type {
    padding: 15px
  }

  .information-source-list {
    gap: 14px
  }

  .information-section {
    padding: 23px 0
  }
}

.information-contents nav.download-contents {
  display: flex;
  flex-direction: column;
  gap: 0;
  margin: 0;
  padding: 0
}

.information-contents nav.download-contents>a {
  display: block;
  width: 100%;
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
  font-size: 14px;
  line-height: 1.7;
  overflow-wrap: break-word;
  color: var(--muted)
}

.information-contents nav.download-contents>a:last-child {
  border-bottom: 0;
  padding-bottom: 0
}

.information-contents nav.download-contents>a:hover,
.information-contents nav.download-contents>a.active {
  color: #6035ce
}

.information-toc {
  border: 0
}

.information-toc>summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  list-style: none;
  padding: 0;
  cursor: pointer
}

.information-toc>summary:after {
  content: none
}

.information-toc>summary h2 {
  font-size: 19px;
  line-height: 1.5;
  margin: 0
}

.information-toc>summary>span {
  display: flex;
  color: #8d6cac
}

.information-toc>summary .icon {
  width: 18px;
  height: 18px
}

.information-toc[open]>summary .icon {
  transform: rotate(180deg)
}

.information-toc[open]>summary {
  margin-bottom: 8px
}

@media(max-width:800px) {
  .information-page .content-layout {
    display: flex;
    flex-direction: column;
    gap: 20px
  }

  .information-page .content-layout>aside {
    display: block;
    position: static;
    order: 0;
    width: 100%;
    max-height: none;
    overflow: visible
  }

  .information-page .main-column {
    order: 1
  }

  .information-page .information-contents {
    padding: 19px 22px
  }

  .information-toc>summary {
    min-height: 28px
  }

  .information-contents nav.download-contents>a {
    min-height: 44px;
    font-size: 14px
  }

  .privacy-page .information-contents nav.download-contents>a {
    font-size: 14px
  }
}

.about-page .information-hero .intro+.intro {
  margin-top: 10px
}

.about-page .about-contact-email {
  padding: 13px 16px;
  border: 1px solid #e4d9f0;
  border-radius: 8px;
  background: #f8f5fc;
  overflow-wrap: anywhere
}

@media(max-width:550px) {
  .about-page .information-hero .intro+.intro {
    margin-top: 0
  }
}
