@charset "UTF-8";
:root {
  --colors-yellow-light: #FFFF93;
  --colors-yellow: #FEFF00;
  --colors-yellow-dark: #FCE902;
  --colors-lime-light: #E9FF52;
  --colors-lime: #E9FF52;
  --colors-lime-dark: #C3ED00;
  --colors-green-light: #C6FFCD;
  --colors-green: #85FF7A;
  --colors-green-dark: #17C501;
  --colors-blue-light: #B8FFFF;
  --colors-blue: #03FFFF;
  --colors-blue-dark: #00CCCC;
  --colors-blue-alt: #3A9FC7;
  --colors-purple-light: #747AC2;
  --colors-purple: #524A99;
  --colors-purple-dark: #503B7C;
  --colors-pink-light: #FFCAEE;
  --colors-pink: #FFA2DC;
  --colors-pink-dark: #FF65CC;
  --colors-red-light: #FFD2CD;
  --colors-red: #FF8FA1;
  --colors-red-dark: #FF6353;
  --colors-orange-light: #FFD185;
  --colors-orange: #FFA900;
  --colors-orange-dark: #FF9601;
}

*, *:before, *:after {
  box-sizing: border-box;
}

html, body, div, span, object, iframe, figure, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, code, em, img, small, strike, strong, sub, sup, tt, b, u, i, ol, ul, li, fieldset, form, label, table, caption, tbody, tfoot, thead, tr, th, td, main, canvas, embed, footer, header, nav, section, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  vertical-align: baseline;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  text-size-adjust: none;
}

footer, header, nav, section, main {
  display: block;
}

body {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after, q:before, q:after {
  content: "";
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

input {
  border-radius: 0;
}

html, body {
  font-family: "Nunito", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 16px;
  line-height: 1.36;
  overflow-x: hidden;
}
@media (min-width: 1200px) {
  html, body {
    font-size: 20px;
  }
}

img, svg {
  display: block;
  max-width: 100%;
  height: auto;
}

a {
  cursor: pointer;
  text-decoration: none;
}

h1, h2, h3, h4, h5, h6 {
  font-family: inherit;
  font-size: 1.3rem;
  font-weight: 900;
}

.Button {
  color: #f0f6b6;
  background: var(--colors-purple-dark);
  font-weight: 900;
  font-size: 1rem;
  text-align: center;
  text-decoration: none;
  padding: 12px 24px;
  border-radius: 30em;
  line-height: 1;
  display: flex;
  justify-content: center;
  align-items: center;
}

.Button--lg {
  font-size: 1.125rem;
  padding: 16px 32px;
}

.Button--rot2 {
  transform: rotate(-2deg);
}
.Button--rot2 .Button__inner {
  display: inline-block;
  transform: rotate(2deg);
}

.Hero {
  background-image: radial-gradient(circle at center left, #ffd0af, transparent 50%), linear-gradient(to top right, #938bf5, #7dcbf1);
  overflow-x: hidden;
  overflow-y: hidden;
  display: flex;
  flex-direction: column;
  z-index: 0;
  will-change: contents;
  position: relative;
  height: 100vh;
  min-height: 760px;
  max-height: 1200px;
}
@media (min-width: 820px) {
  .Hero {
    min-height: 900px;
    max-height: 1200px;
  }
}

.Hero__head {
  display: flex;
}

.Hero__galleryButton {
  color: var(--colors-purple);
  display: block;
  margin-left: auto;
  margin-top: 20px;
  margin-right: 20px;
  font-weight: 900;
  z-index: 100;
}
@media (min-width: 1200px) {
  .Hero__galleryButton {
    margin: 0;
    position: absolute;
    top: 30px;
    right: 30px;
  }
}

.Hero__galleryButtonInner {
  display: inline-flex;
  align-items: center;
}

.Hero__galleryButtonIcon {
  width: 1.5em;
  margin-left: 0.5em;
  margin-right: 0.5em;
}

.Hero__main {
  width: 100%;
  max-width: 360px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 12px;
  padding-right: 12px;
  padding-left: max(env(safe-area-inset-left), 12px);
  padding-right: max(env(safe-area-inset-right), 12px);
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
@media (min-width: 820px) {
  .Hero__main {
    max-width: 820px;
  }
}
@media (min-width: 1200px) {
  .Hero__main {
    max-width: 1208px;
  }
}

.Hero__splash {
  padding-bottom: 120px;
  display: flex;
  flex-direction: column-reverse;
  position: relative;
}
@media (min-width: 820px) {
  .Hero__splash {
    margin-top: 40px;
    flex-direction: row;
    margin-left: 16.6666666667%;
    margin-right: 5.5555555556%;
  }
}

.Hero__image {
  z-index: 6;
  width: 100%;
  max-width: 500px;
}
@media (min-width: 820px) {
  .Hero__image {
    margin-left: -40px;
    margin-top: -40px;
    max-width: 750px;
  }
}
@media (min-width: 1200px) {
  .Hero__image {
    margin-left: -60px;
    margin-top: -80px;
    max-width: 750px;
  }
}

.Hero__intro {
  display: flex;
  z-index: 6;
  flex-direction: column;
  align-items: center;
}
@media (min-width: 820px) {
  .Hero__intro {
    margin-left: -300px;
    margin-right: 10px;
    margin-top: -50px;
  }
}
@media (min-width: 1200px) {
  .Hero__intro {
    margin-left: -380px;
    margin-right: 100px;
    margin-top: -60px;
  }
}

.Hero__logo {
  width: 220px;
  margin-bottom: 0.25rem;
}
@media (min-width: 820px) {
  .Hero__logo {
    width: 240px;
  }
}

.Hero__tagline {
  color: var(--colors-purple-dark);
  margin-bottom: 1rem;
  text-align: center;
  max-width: 25ch;
  text-shadow: 0px 0px 28px white;
  position: relative;
}

.Hero__sparkle1 {
  position: absolute;
  top: -100px;
  right: -30px;
  width: 50px;
  z-index: -1;
  will-change: transform;
  transform: translateY(calc(var(--scroll) * 250px));
}
@media (prefers-reduced-motion: reduce) {
  .Hero__sparkle1 {
    transform: none;
  }
}
@media (min-width: 820px) {
  .Hero__sparkle1 {
    top: -80px;
    right: -200px;
    width: 70px;
  }
}

.Hero__button {
  display: inline-block;
  color: #fff8c3;
  background: var(--colors-orange-dark);
  box-shadow: 0px 0px 32px -4px white;
}

.Hero__sparkle2 {
  position: absolute;
  left: -50px;
  top: 30%;
  width: 100px;
  z-index: -1;
  will-change: transform;
  transform: translateY(calc(var(--scroll) * 250px));
}
@media (prefers-reduced-motion: reduce) {
  .Hero__sparkle2 {
    transform: none;
  }
}
@media (min-width: 820px) {
  .Hero__sparkle2 {
    left: -190px;
    top: 40%;
    width: 150px;
  }
}

.Hero__sparkle3 {
  position: absolute;
  right: -30px;
  bottom: 40%;
  width: 30px;
  z-index: -5;
  will-change: transform;
  transform: translateY(calc(var(--scroll) * 250px));
}
@media (prefers-reduced-motion: reduce) {
  .Hero__sparkle3 {
    transform: none;
  }
}
@media (min-width: 820px) {
  .Hero__sparkle3 {
    right: 0px;
    bottom: 30%;
    width: 36px;
  }
}

.Hero__foot {
  background: var(--colors-purple-dark);
  height: 60px;
  display: flex;
  justify-content: center;
}

.Hero__gfxContainer {
  z-index: -6;
  bottom: 0;
  position: absolute;
  display: flex;
  justify-content: center;
}
@media (max-width: 819px) {
  .Hero__gfxContainer {
    left: 30%;
    right: -30%;
  }
}

.Hero__gfx {
  position: absolute;
  bottom: -2px;
  max-width: initial;
}

.Hero__gfx--1 {
  z-index: 5;
}

.Hero__gfx--2 {
  z-index: 4;
  will-change: transform;
  transform: translateY(calc(var(--scroll) * 50px));
}
@media (prefers-reduced-motion: reduce) {
  .Hero__gfx--2 {
    transform: none;
  }
}

.Hero__gfx--3 {
  z-index: 3;
  will-change: transform;
  transform: translateY(calc(var(--scroll) * 100px));
}
@media (prefers-reduced-motion: reduce) {
  .Hero__gfx--3 {
    transform: none;
  }
}

.Hero__gfx--4 {
  z-index: 2;
  will-change: transform;
  transform: translateY(calc(var(--scroll) * 150px));
}
@media (prefers-reduced-motion: reduce) {
  .Hero__gfx--4 {
    transform: none;
  }
}

.Trailer {
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-top: 3rem;
  margin-bottom: 4rem;
  width: 100%;
  max-width: 360px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 12px;
  padding-right: 12px;
  padding-left: max(env(safe-area-inset-left), 12px);
  padding-right: max(env(safe-area-inset-right), 12px);
}
@media (min-width: 820px) {
  .Trailer {
    max-width: 820px;
  }
}
@media (min-width: 1200px) {
  .Trailer {
    max-width: 1208px;
  }
}
@media (min-width: 820px) {
  .Trailer {
    margin-top: 4rem;
    margin-bottom: 8rem;
  }
}

.Trailer__container {
  box-sizing: border-box;
  display: flex;
  flex: 0 1 auto;
  flex-direction: row;
  flex-wrap: wrap;
  margin-right: -8px;
  margin-left: -8px;
}

.Trailer__embedWrapper {
  position: relative;
  box-sizing: border-box;
  flex: 0 0 auto;
  padding-right: 8px;
  padding-left: 8px;
  flex-basis: 100%;
  max-width: 100%;
}
@media (min-width: 820px) {
  .Trailer__embedWrapper {
    box-sizing: border-box;
    flex: 0 0 auto;
    padding-right: 8px;
    padding-left: 8px;
    flex-basis: 55.5555555556%;
    max-width: 55.5555555556%;
    margin-left: 22.2222222222%;
    margin-right: 22.2222222222%;
  }
}

.Trailer__sparkle {
  position: absolute;
  width: 20px;
  top: -40px;
  left: -15px;
}
@media (min-width: 820px) {
  .Trailer__sparkle {
    width: 20px;
    top: -10px;
    left: -50px;
  }
}

.Trailer__forceAspect {
  padding-bottom: 56.25%;
  position: relative;
  margin-bottom: 1em;
}

.Trailer__embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.PressHype {
  display: flex;
  justify-content: center;
  width: 100%;
  color: var(--colors-blue);
  margin-top: 1em;
}

.PressHype__item {
  width: 17ch;
  text-align: center;
  font-weight: bolder;
  position: relative;
}
.PressHype__item:before, .PressHype__item:last-child:after {
  width: 18px;
  height: 18px;
  display: block;
  content: " ";
  position: absolute;
  top: 50%;
  left: 0;
  transform: translate(-50%, -50%);
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='17' viewBox='0 0 18 17'%3E %3Cpolygon fill='%230FF' fill-rule='evenodd' points='639 31.5 633.71 34.281 634.72 28.391 630.44 24.219 636.355 23.359 639 18 641.645 23.359 647.56 24.219 643.28 28.391 644.29 34.281' transform='translate(-630 -18)'/%3E %3C/svg%3E");
  background-size: 100%;
  background-repeat: no-repeat;
}
.PressHype__item:last-child:after {
  left: initial;
  right: 0;
  transform: translate(50%, -50%);
}
@media (max-width: 819px) {
  .PressHype__item:first-child:before, .PressHype__item:last-child:after {
    display: none;
  }
}

.PressHype__score {
  font-size: 1.5em;
  font-weight: 900;
}

.PressHype__outlet {
  font-size: 1em;
}

.FeatureSection {
  background: var(--colors-purple-dark);
  color: #faf7ff;
  padding: 2em 0;
  position: relative;
  z-index: 0;
}

.FeatureSection__scrollHint {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  color: #f1fab8;
  font-weight: 900;
}

.FeatureSection__scrollHintIcon {
  margin-right: 0.75em;
  width: 32px;
}

.FeatureSection__scrollHintGuy {
  margin-left: 0.75em;
  width: 28px;
}

.FeatureSection__wrapper {
  width: 100%;
  max-width: 360px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 12px;
  padding-right: 12px;
  padding-left: max(env(safe-area-inset-left), 12px);
  padding-right: max(env(safe-area-inset-right), 12px);
}
@media (min-width: 820px) {
  .FeatureSection__wrapper {
    max-width: 820px;
  }
}
@media (min-width: 1200px) {
  .FeatureSection__wrapper {
    max-width: 1208px;
  }
}

.FeatureBlock {
  box-sizing: border-box;
  display: flex;
  flex: 0 1 auto;
  flex-direction: row;
  flex-wrap: wrap;
  margin-right: -8px;
  margin-left: -8px;
  margin-bottom: 3em;
}
.FeatureBlock h3 {
  color: var(--colors-green-light);
  margin-bottom: 0.75em;
}
.FeatureBlock p,
.FeatureBlock ul {
  color: var(--colors-yellow-light);
  font-weight: 600;
}
@media (min-width: 820px) {
  .FeatureBlock {
    margin-bottom: 8em;
  }
}

.FeatureBlock:last-of-type {
  margin-bottom: 4em;
}

.FeatureBlock--paintingFeatures {
  align-items: center;
}

.PaintingFeatures__image {
  margin-top: 1em;
  box-sizing: border-box;
  flex: 0 0 auto;
  padding-right: 8px;
  padding-left: 8px;
  flex-basis: 100%;
  max-width: 100%;
}
@media (min-width: 820px) {
  .PaintingFeatures__image {
    box-sizing: border-box;
    flex: 0 0 auto;
    padding-right: 8px;
    padding-left: 8px;
    flex-basis: 44.4444444444%;
    max-width: 44.4444444444%;
  }
}
@media (min-width: 1200px) {
  .PaintingFeatures__image {
    box-sizing: border-box;
    flex: 0 0 auto;
    padding-right: 8px;
    padding-left: 8px;
    flex-basis: 41.6666666667%;
    max-width: 41.6666666667%;
    margin-left: 5.5555555556%;
  }
}

.PaintingFeatures__info {
  box-sizing: border-box;
  flex: 0 0 auto;
  padding-right: 8px;
  padding-left: 8px;
  flex-basis: 100%;
  max-width: 100%;
}
@media (max-width: 819px) {
  .PaintingFeatures__info {
    margin-top: 2rem;
  }
}
@media (min-width: 820px) {
  .PaintingFeatures__info {
    box-sizing: border-box;
    flex: 0 0 auto;
    padding-right: 8px;
    padding-left: 8px;
    flex-basis: 50%;
    max-width: 50%;
    margin-left: 5.5555555556%;
  }
}
@media (min-width: 1200px) {
  .PaintingFeatures__info {
    box-sizing: border-box;
    flex: 0 0 auto;
    padding-right: 8px;
    padding-left: 8px;
    flex-basis: 41.6666666667%;
    max-width: 41.6666666667%;
    margin-left: 4.1666666667%;
  }
}

.PaintingFeatures__infoBox {
  background-color: #676BAA;
  border-radius: 24px;
}
.PaintingFeatures__infoBox ul {
  margin-left: 1.5ch;
}
.PaintingFeatures__infoBox li {
  margin-bottom: 0.5em;
  position: relative;
}
.PaintingFeatures__infoBox li::before {
  background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E %3Cpolygon fill='%23FFD185' fill-rule='evenodd' points='7.553 11.404 3.494 13.538 4.269 9.018 .985 5.817 5.523 5.158 7.553 1.046 9.582 5.158 14.12 5.817 10.837 9.018 11.612 13.538' transform='rotate(10 7.498 10.532)'/%3E %3C/svg%3E");
  display: block;
  content: " ";
  width: 15px;
  height: 15px;
  position: absolute;
  left: -20px;
  top: 5px;
}
@media (min-width: 820px) {
  .PaintingFeatures__infoBox {
    transform: rotate(-2deg);
  }
}

.PaintingFeatures__infoBoxInner {
  padding: 24px;
  position: relative;
}
@media (min-width: 820px) {
  .PaintingFeatures__infoBoxInner {
    padding: 0;
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
    margin-left: 10%;
    margin-right: 10%;
    transform: rotate(2deg);
  }
}

.PaintingFeatures__sparkle {
  position: absolute;
  top: -40px;
  right: -60px;
  height: 30px;
}
@media (min-width: 820px) {
  .PaintingFeatures__sparkle {
    top: -20px;
    right: -120px;
    height: 40px;
  }
}

.Sonarpen__header {
  margin: 0;
  box-sizing: border-box;
  flex: 0 0 auto;
  padding-right: 8px;
  padding-left: 8px;
  flex-basis: 100%;
  max-width: 100%;
}
@media (min-width: 820px) {
  .Sonarpen__header {
    margin: 0;
    box-sizing: border-box;
    flex: 0 0 auto;
    padding-right: 8px;
    padding-left: 8px;
    flex-basis: 38.8888888889%;
    max-width: 38.8888888889%;
    margin-left: 11.1111111111%;
  }
}

.Sonarpen__info {
  margin: 0.5rem 0;
  box-sizing: border-box;
  flex: 0 0 auto;
  padding-right: 8px;
  padding-left: 8px;
  flex-basis: 100%;
  max-width: 100%;
}
@media (min-width: 820px) {
  .Sonarpen__info {
    margin: 0;
    box-sizing: border-box;
    flex: 0 0 auto;
    padding-right: 8px;
    padding-left: 8px;
    flex-basis: 33.3333333333%;
    max-width: 33.3333333333%;
    margin-left: 5.5555555556%;
    margin-right: 11.1111111111%;
  }
}

.Sonarpen__imageWrapper {
  box-sizing: border-box;
  flex: 0 0 auto;
  padding-right: 8px;
  padding-left: 8px;
  flex-basis: 100%;
  max-width: 100%;
  margin-top: 2em;
  position: relative;
}
@media (min-width: 820px) {
  .Sonarpen__imageWrapper {
    box-sizing: border-box;
    flex: 0 0 auto;
    padding-right: 8px;
    padding-left: 8px;
    flex-basis: 83.3333333333%;
    max-width: 83.3333333333%;
    margin-left: 8.3333333333%;
    margin-right: 8.3333333333%;
  }
}

.Sonarpen__sparkle {
  position: absolute;
  bottom: -30px;
  left: -80px;
  height: 50px;
}
@media (min-width: 820px) {
  .Sonarpen__sparkle {
    bottom: -60px;
    left: -80px;
    height: 80px;
  }
}

.Sonarpen__image {
  background-color: var(--colors-orange-light);
  border-radius: 24px;
  height: 140px;
  transform: rotate(1deg);
  display: flex;
  justify-content: center;
  align-items: center;
}
@media (min-width: 820px) {
  .Sonarpen__image {
    height: 160px;
    margin-top: 2em;
    margin-bottom: 2em;
  }
}
@media (min-width: 1200px) {
  .Sonarpen__image {
    height: 200px;
    margin-top: 2em;
    margin-bottom: 2em;
  }
}
.Sonarpen__image img {
  height: 140px;
  width: initial;
  max-width: initial;
  margin-top: -20px;
}
@media (min-width: 820px) {
  .Sonarpen__image img {
    margin-top: 20px;
    height: 220px;
  }
}
@media (min-width: 1200px) {
  .Sonarpen__image img {
    height: 280px;
    margin-left: 20px;
    margin-top: 40px;
  }
}

.FeatureBlock.FeatureBlock--quest {
  align-items: center;
}
.Quest__image {
  margin-bottom: 2rem;
  box-sizing: border-box;
  flex: 0 0 auto;
  padding-right: 8px;
  padding-left: 8px;
  flex-basis: 100%;
  max-width: 100%;
}
@media (min-width: 820px) {
  .Quest__image {
    margin-bottom: 0;
    box-sizing: border-box;
    flex: 0 0 auto;
    padding-right: 8px;
    padding-left: 8px;
    flex-basis: 38.8888888889%;
    max-width: 38.8888888889%;
    margin-left: 11.1111111111%;
  }
}

.Quest__info {
  margin: 0.5rem 0;
  box-sizing: border-box;
  flex: 0 0 auto;
  padding-right: 8px;
  padding-left: 8px;
  flex-basis: 100%;
  max-width: 100%;
}
@media (min-width: 820px) {
  .Quest__info {
    margin: 0;
    box-sizing: border-box;
    flex: 0 0 auto;
    padding-right: 8px;
    padding-left: 8px;
    flex-basis: 33.3333333333%;
    max-width: 33.3333333333%;
    margin-left: 5.5555555556%;
    margin-right: 5.5555555556%;
  }
}

.FeatureBlock.FeatureBlock--gallery {
  box-sizing: border-box;
  flex: 0 0 auto;
  padding-right: 8px;
  padding-left: 8px;
  flex-basis: 100%;
  max-width: 100%;
}
@media (min-width: 820px) {
  .FeatureBlock.FeatureBlock--gallery {
    box-sizing: border-box;
    flex: 0 0 auto;
    padding-right: 8px;
    padding-left: 8px;
    flex-basis: 1600%;
    max-width: 1600%;
    margin-left: 5.5555555556%;
    margin-right: 5.5555555556%;
  }
}

.Gallery__box {
  position: relative;
  background: #676BAA;
  border-radius: 24px;
  transform: rotate(1deg);
}

.Gallery__boxInner {
  box-sizing: border-box;
  display: flex;
  flex: 0 1 auto;
  flex-direction: row;
  flex-wrap: wrap;
  margin-right: -8px;
  margin-left: -8px;
  padding: 24px;
  align-items: center;
  transform: rotate(-1deg);
}
@media (min-width: 820px) {
  .Gallery__boxInner {
    padding: 0;
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }
}

.Gallery__sparkle {
  position: absolute;
  bottom: -40px;
  right: -30px;
  height: 35px;
}
@media (min-width: 820px) {
  .Gallery__sparkle {
    bottom: -40px;
    right: -30px;
    height: 45px;
  }
}

.Gallery__info {
  margin-bottom: 2rem;
  box-sizing: border-box;
  flex: 0 0 auto;
  padding-right: 8px;
  padding-left: 8px;
  flex-basis: 100%;
  max-width: 100%;
}
@media (min-width: 820px) {
  .Gallery__info {
    margin-bottom: 0;
    box-sizing: border-box;
    flex: 0 0 auto;
    padding-right: 8px;
    padding-left: 8px;
    flex-basis: 37.5%;
    max-width: 37.5%;
    margin-left: 6.25%;
  }
}

.Gallery__image {
  box-sizing: border-box;
  flex: 0 0 auto;
  padding-right: 8px;
  padding-left: 8px;
  flex-basis: 100%;
  max-width: 100%;
}
@media (min-width: 820px) {
  .Gallery__image {
    box-sizing: border-box;
    flex: 0 0 auto;
    padding-right: 8px;
    padding-left: 8px;
    flex-basis: 43.75%;
    max-width: 43.75%;
    margin-left: 6.25%;
  }
}

.ProductSection {
  position: relative;
  background: linear-gradient(to bottom, #f8adcc, #FFBEA2, #ffcd83);
  padding-top: 86px;
}

.ProductSection__divider {
  position: absolute;
  background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='1440' height='86' viewBox='0 0 1440 86'%3E %3Cdefs%3E %3Cpath id='divider-a' d='M2416,62 L2165.2679,77.5 L2112.39788,74.5 L1939.07137,96.2805868 L1866.08066,86.7332966 L1738.5,80 L1692,64 L1638.16976,60.5 L1560.46684,80 L1447.5,93 L1324.15385,86.5 L1239.5,95 L1181.96686,89.8488975 L1159.5,80 L1099.5,76.5 L1056.5,84.5 L974.5,90 L865.5,85 L756.5,95 L660,97.5 L550,90 L479.265681,97.7376655 L450,95 L402.5,77.5 L372,81.5 L188.249337,97 L97.729443,107.5 L0,95 L0,0 L2416,0 L2416,62 Z'/%3E %3C/defs%3E %3Cg fill='none' fill-rule='evenodd' transform='translate(-288 -41)'%3E %3Cmask id='divider-b' fill='%23fff'%3E %3Cuse xlink:href='%23divider-a'/%3E %3C/mask%3E %3Cuse fill='%23513C7D' opacity='.809' xlink:href='%23divider-a'/%3E %3Cpath fill='%23503B7C' d='M1861,-32 L1861,43.594 L1831.73428,44.4326161 L1699,41 L1672.11089,51.7724323 L1582.17143,61 L1529,56 L1511,59.5 L1464,47.5 L1437,53 L1415.49418,62 L1349.70053,70.5 L1212.60423,80 L1173.12804,67 L916.971429,73 L890.349017,68.4336248 L789.5,65.5 L758,58 L725,56 L656,73 L571.33545,80 L522.209524,65.5 L383.5,56 L340.619048,65.5 L113.41164,92 L30.7618504,83.7023109 L-312.931217,86.5 L-402.410582,73 L-644.531217,73 L-785,88.435 L-785,-32 L1861,-32 Z' mask='url(%23divider-b)'/%3E %3C/g%3E %3C/svg%3E");
  background-size: cover;
  background-position: center;
  height: 86px;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.ProductSection__head {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding-top: 6em;
  padding-bottom: 4em;
}
@media (min-width: 820px) {
  .ProductSection__head {
    padding-bottom: 8em;
    flex-direction: row;
  }
}
@media (min-width: 1200px) {
  .ProductSection__head {
    flex-direction: row;
  }
}

.ProductSection__intro {
  display: flex;
  justify-content: center;
  text-align: center;
  align-items: center;
}
@media (min-width: 820px) {
  .ProductSection__intro {
    text-align: left;
  }
}

.ProductSection__introGuy {
  width: 3em;
  margin-right: 1.25em;
  margin-bottom: -1%;
  display: none;
}
@media (min-width: 820px) {
  .ProductSection__introGuy {
    display: block;
  }
}

.ProductSection__introText {
  display: flex-inline;
  flex-direction: column;
  justify-content: center;
}
@media (min-width: 820px) {
  .ProductSection__introText {
    margin-right: -4em;
    display: block;
  }
}

.ProductSection__title {
  display: inline-block;
  text-align: center;
  width: auto;
  text-align: center;
  font-size: 20px;
  font-weight: 900;
  color: #f8febf;
  background: var(--colors-purple);
  border-radius: 40px;
  margin-bottom: 0.1em;
  padding: 0.3em 1em;
}
@media (min-width: 820px) {
  .ProductSection__title {
    text-align: left;
  }
}
@media (min-width: 1200px) {
  .ProductSection__title {
    font-size: 22px;
  }
}

.ProductSection__subtitle {
  text-align: center;
  font-size: 20px;
  font-weight: 900;
  max-width: 35ch;
  color: var(--colors-purple-dark);
  margin-top: 0.5em;
  margin-left: 0.75em;
  max-width: 30ch;
}
@media (min-width: 820px) {
  .ProductSection__subtitle {
    text-align: left;
  }
}
@media (min-width: 1200px) {
  .ProductSection__subtitle {
    font-size: 22px;
  }
}

.ProductSection__compatibleWith {
  width: 300px;
}
@media (min-width: 820px) {
  .ProductSection__compatibleWith {
    margin-top: -1em;
  }
}
@media (min-width: 1200px) {
  .ProductSection__compatibleWith {
    margin-top: -1em;
    width: 377px;
  }
}

.ProductSection__body {
  width: 100%;
  max-width: 360px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 12px;
  padding-right: 12px;
  padding-left: max(env(safe-area-inset-left), 12px);
  padding-right: max(env(safe-area-inset-right), 12px);
}
@media (min-width: 820px) {
  .ProductSection__body {
    max-width: 820px;
  }
}
@media (min-width: 1200px) {
  .ProductSection__body {
    max-width: 1208px;
  }
}

.ProductSection__grid {
  box-sizing: border-box;
  display: flex;
  flex: 0 1 auto;
  flex-direction: row;
  flex-wrap: wrap;
  margin-right: -8px;
  margin-left: -8px;
}

.ProductSection__item {
  box-sizing: border-box;
  flex: 0 0 auto;
  padding-right: 8px;
  padding-left: 8px;
  flex-basis: 100%;
  max-width: 100%;
  margin-top: 16px;
}
@media (min-width: 820px) {
  .ProductSection__item {
    box-sizing: border-box;
    flex: 0 0 auto;
    padding-right: 8px;
    padding-left: 8px;
    flex-basis: 33.3333333333%;
    max-width: 33.3333333333%;
  }
}
.ProductSection__item.ProductSection__item--galleryPreview {
  box-sizing: border-box;
  flex: 0 0 auto;
  padding-right: 8px;
  padding-left: 8px;
  flex-basis: 100%;
  max-width: 100%;
}

.SonarpenCardWrapper {
  box-sizing: border-box;
  display: flex;
  flex: 0 1 auto;
  flex-direction: row;
  flex-wrap: wrap;
  margin-right: -8px;
  margin-left: -8px;
  margin-top: 4em;
  width: 100%;
  justify-content: center;
}

.SonarpenCard {
  box-sizing: border-box;
  flex: 0 0 auto;
  padding-right: 8px;
  padding-left: 8px;
  flex-basis: 88.8888888889%;
  max-width: 88.8888888889%;
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.68);
  color: #141414;
  transform: rotateZ(3deg);
  position: relative;
}
@media (min-width: 820px) {
  .SonarpenCard {
    box-sizing: border-box;
    flex: 0 0 auto;
    padding-right: 8px;
    padding-left: 8px;
    flex-basis: 44.4444444444%;
    max-width: 44.4444444444%;
  }
}
@media (min-width: 1200px) {
  .SonarpenCard {
    box-sizing: border-box;
    flex: 0 0 auto;
    padding-right: 8px;
    padding-left: 8px;
    flex-basis: 33.3333333333%;
    max-width: 33.3333333333%;
  }
}

.SonarpenCard__inner {
  padding: 32px;
  transform: rotateZ(-3deg);
}

.SonarpenCard__title {
  color: var(--colors-purple);
  font-weight: 900;
  margin-bottom: 0.4em;
}

.SonarpenCard__subtitle {
  color: var(--colors-purple-light);
  font-weight: 900;
  font-size: 1.025em;
  display: inline-block;
  max-width: 25ch;
}

.SonarpenCard__imageWrapper {
  position: relative;
  height: 100px;
}
@media (min-width: 820px) {
  .SonarpenCard__imageWrapper {
    height: 140px;
  }
}

.SonarpenCard__image {
  position: absolute;
  width: auto;
  height: auto;
  top: 25px;
  left: -100px;
  max-width: 440px;
  max-height: 95px;
  transform: rotate(-12deg);
}
@media (min-width: 820px) {
  .SonarpenCard__image {
    top: 35px;
    left: -140px;
    max-width: 560px;
    max-height: 95px;
    transform: rotate(-15deg);
  }
}
@media (min-width: 1200px) {
  .SonarpenCard__image {
    top: 30px;
    left: -170px;
    max-width: 660px;
    max-height: 95px;
    transform: rotate(-12deg);
  }
}

.SonarpenCard__foot {
  display: flex;
  justify-content: flex-end;
}

.SonarpenCard__button {
  background: var(--colors-purple-light);
}

.Product {
  height: 100%;
  display: flex;
  flex-direction: column;
}
.Product.Product--physical {
  padding-top: 230px;
}
@media (min-width: 820px) {
  .Product.Product--physical {
    padding-top: 0;
  }
}

.ProductImage {
  overflow: hidden;
  border-radius: 24px;
  margin-bottom: 16px;
  border: 1px solid white;
}
@media (min-width: 820px) {
  .ProductImage {
    height: 130px;
  }
}
@media (min-width: 1200px) {
  .ProductImage {
    height: 195px;
  }
}

.Product--physical .ProductImage {
  border: 0;
}

.ProductCard {
  flex: 1;
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.68);
  color: #141414;
  transform: rotateZ(0.25deg);
  position: relative;
}

.Product--physical .ProductCard {
  margin-top: -120px;
  padding-top: 120px;
}
@media (min-width: 820px) {
  .Product--physical .ProductCard {
    margin-bottom: 24px;
  }
}
@media (min-width: 1200px) {
  .Product--physical .ProductCard {
    margin-top: -180px;
    padding-top: 180px;
  }
}

.ProductCard__inner {
  padding: 24px;
  height: 100%;
  display: flex;
  flex-direction: column;
  transform: rotateZ(-0.25deg);
}

.ProductCard__floatingImage {
  position: absolute;
  width: 150px;
  top: -240px;
  left: 0;
  right: 0;
  margin: 0 auto;
  border-radius: 0;
  z-index: 1;
}
@media (min-width: 1200px) {
  .ProductCard__floatingImage {
    width: 186px;
    top: -290px;
  }
}

.Product--physical .ProductCard {
  transform: rotateZ(0.25deg);
}
.Product--physical .ProductCard .ProductCard__inner {
  transform: rotateZ(-0.25deg);
}

.Product--basic .ProductCard {
  transform: rotateZ(-0.25deg);
}
.Product--basic .ProductCard .ProductCard__inner {
  transform: rotateZ(0.25deg);
}

.Product--patron .ProductCard {
  transform: rotateZ(0.3deg);
}
.Product--patron .ProductCard .ProductCard__inner {
  transform: rotateZ(-0.3deg);
}

.ProductCard__title {
  font-size: 1.17rem;
  font-weight: 900;
  margin-bottom: 0.125em;
  color: var(--colors-orange-dark);
}
.Product--physical .ProductCard__title {
  color: var(--colors-purple-light);
}
@media (min-width: 1200px) {
  .ProductCard__title {
    font-size: 1.3rem;
  }
}

.ProductCard__price {
  color: var(--colors-purple-dark);
  flex: 1;
  font-weight: 900;
  font-size: 1.17rem;
}
@media (min-width: 1200px) {
  .ProductCard__price {
    font-size: 1.3rem;
  }
}

.ProductCard__priceCurrency {
  font-size: 1rem;
  margin-right: 0.25ch;
}

.ProductCard__priceAccess {
  font-size: 1rem;
}

.ProductCard__quote {
  margin: 0.5em 0;
  font-style: italic;
}
@media (min-width: 820px) {
  .ProductCard__quote {
    min-height: 5rem;
  }
}
@media (min-width: 1200px) {
  .ProductCard__quote {
    min-height: 4rem;
  }
}

.ProductCard__contentsList {
  margin-left: 1.5ch;
  margin-bottom: 1.5em;
}
.ProductCard__contentsList li {
  margin-bottom: 0.25em;
  position: relative;
}
.ProductCard__contentsList li::before {
  background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E %3Cpolygon fill='%23FF9400' fill-rule='evenodd' points='7.553 12.355 3.494 14.489 4.269 9.969 .985 6.768 5.523 6.109 7.553 1.997 9.582 6.109 14.12 6.768 10.837 9.969 11.612 14.489' transform='rotate(10 7.272 8.267)'/%3E %3C/svg%3E");
  display: block;
  content: " ";
  width: 15px;
  height: 15px;
  position: absolute;
  left: -20px;
  top: 5px;
}

.ProductCard__purchase {
  margin-top: auto;
  margin-left: -16px;
  margin-bottom: -16px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}

.ProductCard__button {
  margin-left: 16px;
  margin-bottom: 16px;
  min-height: 2em;
  background: var(--colors-orange-dark);
}
.Product--physical .ProductCard__button {
  background: var(--colors-purple-light);
}

.ProductCard__shipping {
  margin-top: 1em;
  font-size: 0.75em;
}

.PaintingGrid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: -6px;
}

.PaintingGrid__item {
  width: auto;
  height: 90px;
  margin: 6px;
}
.PaintingGrid__item img {
  box-shadow: 0 3px 6px rgba(157, 135, 105, 0.62);
  height: 100%;
}
@media (min-width: 1200px) {
  .PaintingGrid__item {
    height: 110px;
  }
}

.PaintingGrid__break {
  visibility: collapse;
}

.GalleryCard {
  margin-bottom: 4em;
}
@media (min-width: 820px) {
  .GalleryCard {
    margin-top: 6em;
    margin-bottom: 6em;
  }
}

.GalleryCard__inner {
  height: 100%;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  display: flex;
  flex: 0 1 auto;
  flex-direction: row;
  flex-wrap: wrap;
  margin-right: -8px;
  margin-left: -8px;
  align-items: center;
}

.GalleryCard__head {
  box-sizing: border-box;
  flex: 0 0 auto;
  padding-right: 8px;
  padding-left: 8px;
  flex-basis: 100%;
  max-width: 100%;
  text-align: center;
  min-height: 16em;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
@media (min-width: 820px) {
  .GalleryCard__head {
    box-sizing: border-box;
    flex: 0 0 auto;
    padding-right: 8px;
    padding-left: 8px;
    flex-basis: 27.7777777778%;
    max-width: 27.7777777778%;
    margin-left: 2.7777777778%;
    margin-right: 2.7777777778%;
    min-height: initial;
    display: block;
  }
}

.GalleryCard__body {
  box-sizing: border-box;
  flex: 0 0 auto;
  padding-right: 8px;
  padding-left: 8px;
  flex-basis: 100%;
  max-width: 100%;
}
@media (max-width: 819px) {
  .GalleryCard__body .PaintingGrid .PaintingGrid__item {
    max-width: 50%;
  }
  .GalleryCard__body .PaintingGrid .PaintingGrid__break {
    visibility: collapse;
  }
  .GalleryCard__body .PaintingGrid .PaintingGrid__break:nth-child(4n) {
    visibility: visible;
    flex-basis: 100%;
  }
  .GalleryCard__body .PaintingGrid .PaintingGrid__item:nth-child(n+17) {
    display: none;
  }
}
@media (min-width: 820px) and (max-width: 1199px) {
  .GalleryCard__body {
    box-sizing: border-box;
    flex: 0 0 auto;
    padding-right: 8px;
    padding-left: 8px;
    flex-basis: 66.6666666667%;
    max-width: 66.6666666667%;
  }
  .GalleryCard__body .PaintingGrid .PaintingGrid__item {
    max-width: 33.3333333333%;
  }
  .GalleryCard__body .PaintingGrid .PaintingGrid__break {
    visibility: collapse;
  }
  .GalleryCard__body .PaintingGrid .PaintingGrid__break:nth-child(6n) {
    visibility: visible;
    flex-basis: 100%;
  }
}
@media (min-width: 1200px) {
  .GalleryCard__body {
    box-sizing: border-box;
    flex: 0 0 auto;
    padding-right: 8px;
    padding-left: 8px;
    flex-basis: 66.6666666667%;
    max-width: 66.6666666667%;
  }
  .GalleryCard__body .PaintingGrid .PaintingGrid__item {
    max-width: 25%;
  }
  .GalleryCard__body .PaintingGrid .PaintingGrid__break {
    visibility: collapse;
  }
  .GalleryCard__body .PaintingGrid .PaintingGrid__break:nth-child(8n) {
    visibility: visible;
    flex-basis: 100%;
  }
}

.GalleryCard__title {
  color: var(--colors-purple-dark);
  margin: 0 auto;
  max-width: 25ch;
  font-weight: 900;
  font-size: 1.2em;
  margin-top: 0.5em;
  margin-bottom: 1em;
}

.GalleryCard__callToAction {
  width: auto;
  display: inline-flex;
  justify-items: center;
  background: var(--colors-purple-dark);
}

.GalleryCard__buttonIcon {
  display: inline-block;
  width: 1.5em;
  margin-left: 0.5em;
}

@font-face {
  font-family: "swiper-icons";
  src: url("data:application/font-woff;charset=utf-8;base64, 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") format("woff");
  font-weight: 400;
  font-style: normal;
}
:root {
  --swiper-theme-color: #007aff;
}

.swiper-container {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  overflow: hidden;
  list-style: none;
  padding: 0;
  /* Fix of Webkit flickering */
  z-index: 1;
}

.swiper-container-vertical > .swiper-wrapper {
  flex-direction: column;
}

.swiper-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1;
  display: flex;
  transition-property: transform;
  box-sizing: content-box;
}

.swiper-container-android .swiper-slide,
.swiper-wrapper {
  transform: translate3d(0px, 0, 0);
}

.swiper-container-multirow > .swiper-wrapper {
  flex-wrap: wrap;
}

.swiper-container-multirow-column > .swiper-wrapper {
  flex-wrap: wrap;
  flex-direction: column;
}

.swiper-container-free-mode > .swiper-wrapper {
  transition-timing-function: ease-out;
  margin: 0 auto;
}

.swiper-container-pointer-events {
  touch-action: pan-y;
}
.swiper-container-pointer-events.swiper-container-vertical {
  touch-action: pan-x;
}

.swiper-slide {
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  position: relative;
  transition-property: transform;
}

.swiper-slide-invisible-blank {
  visibility: hidden;
}

/* Auto Height */
.swiper-container-autoheight,
.swiper-container-autoheight .swiper-slide {
  height: auto;
}
.swiper-container-autoheight .swiper-wrapper {
  align-items: flex-start;
  transition-property: transform, height;
}

/* 3D Effects */
.swiper-container-3d {
  perspective: 1200px;
}
.swiper-container-3d .swiper-wrapper,
.swiper-container-3d .swiper-slide,
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top,
.swiper-container-3d .swiper-slide-shadow-bottom,
.swiper-container-3d .swiper-cube-shadow {
  transform-style: preserve-3d;
}
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top,
.swiper-container-3d .swiper-slide-shadow-bottom {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 10;
}
.swiper-container-3d .swiper-slide-shadow-left {
  background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-container-3d .swiper-slide-shadow-right {
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-container-3d .swiper-slide-shadow-top {
  background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-container-3d .swiper-slide-shadow-bottom {
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

/* CSS Mode */
.swiper-container-css-mode > .swiper-wrapper {
  overflow: auto;
  scrollbar-width: none;
  /* For Firefox */
  -ms-overflow-style: none;
  /* For Internet Explorer and Edge */
}
.swiper-container-css-mode > .swiper-wrapper::-webkit-scrollbar {
  display: none;
}
.swiper-container-css-mode > .swiper-wrapper > .swiper-slide {
  scroll-snap-align: start start;
}

.swiper-container-horizontal.swiper-container-css-mode > .swiper-wrapper {
  scroll-snap-type: x mandatory;
}

.swiper-container-vertical.swiper-container-css-mode > .swiper-wrapper {
  scroll-snap-type: y mandatory;
}

.Slideshow {
  display: flex;
  flex-wrap: wrap;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.swiper-container {
  margin-top: 16px;
  flex: 1;
  flex-basis: 100%;
  width: 0;
}

.swiper-slide {
  cursor: pointer;
}

.Slideshow__nav {
  display: flex;
  flex-basis: 100%;
  width: 100%;
  padding: 16px;
  justify-content: center;
  align-items: center;
}

.Slideshow__pagination {
  display: flex;
}

.swiper-pagination-bullet {
  width: 10px;
  height: 10px;
  margin-right: 16px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.3);
  cursor: pointer;
}

.swiper-pagination-bullet:last-of-type {
  margin-right: 0;
}

.swiper-pagination-bullet-active {
  background: rgba(255, 255, 255, 0.6);
}

.Slideshow__button {
  cursor: pointer;
}
.Slideshow__button svg {
  height: 34px;
}

.Slideshow__button--prev {
  margin-right: 1em;
  margin-top: -3px;
}

.Slideshow__button--next {
  margin-left: 1em;
  margin-top: 3px;
}

.Footer {
  background: var(--colors-purple-dark);
  color: var(--colors-pink-light);
  font-weight: bold;
  position: relative;
  font-size: 0.8em;
}

.Footer__divider {
  background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='292' height='16' viewBox='0 0 292 16'%3E %3Cpath fill='%23503B7C' fill-rule='evenodd' d='M-581.96473,7.71095254 C-509.574812,7.71095254 -508.966494,0 -435.968257,0 C-362.970021,0 -363.578339,7.71095254 -289.971784,7.71095254 C-216.365229,7.71095254 -216.973548,0 -143.975311,0 C-70.9770747,0 -71.5853933,7.71095254 2.02116183,7.71095254 C75.627717,7.71095254 76.2360356,0 148.017635,0 C219.799234,0 221.015871,7.71095254 294.014108,7.71095254 C367.012344,7.71095254 391.953409,0 440.010581,0 C488.067753,0 513.617136,7.71095254 586.007054,7.71095254 C658.396972,7.71095254 658.396972,0 732.003527,0 C805.610082,0 805.610082,7.71095254 878,7.71095254 L874.96473,440.530071 L-585,444 L-581.96473,7.71095254 Z'/%3E %3C/svg%3E");
  background-size: 292px 16px;
  background-repeat: repeat-x;
  background-position: center;
  height: 16px;
  width: 100%;
  position: absolute;
  top: -10px;
  left: 0;
}

.Footer__wrapper {
  width: 100%;
  max-width: 360px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 12px;
  padding-right: 12px;
  padding-left: max(env(safe-area-inset-left), 12px);
  padding-right: max(env(safe-area-inset-right), 12px);
  padding-top: 3em;
}
@media (min-width: 820px) {
  .Footer__wrapper {
    max-width: 820px;
  }
}
@media (min-width: 1200px) {
  .Footer__wrapper {
    max-width: 1208px;
  }
}

.Footer__main {
  box-sizing: border-box;
  display: flex;
  flex: 0 1 auto;
  flex-direction: row;
  flex-wrap: wrap;
  margin-right: -8px;
  margin-left: -8px;
  padding-bottom: 2em;
}
@media (min-width: 820px) {
  .Footer__main {
    align-items: center;
  }
}

.FooterSection {
  box-sizing: border-box;
  flex: 0 0 auto;
  padding-right: 8px;
  padding-left: 8px;
  flex-basis: 100%;
  max-width: 100%;
}

.FooterSection.FooterSection--ratings {
  box-sizing: border-box;
  flex: 0 0 auto;
  padding-right: 8px;
  padding-left: 8px;
  flex-basis: 100%;
  max-width: 100%;
}
@media (min-width: 820px) {
  .FooterSection.FooterSection--ratings {
    box-sizing: border-box;
    flex: 0 0 auto;
    padding-right: 8px;
    padding-left: 8px;
    flex-basis: 33.3333333333%;
    max-width: 33.3333333333%;
  }
}

.FooterSection.FooterSection--legal {
  box-sizing: border-box;
  flex: 0 0 auto;
  padding-right: 8px;
  padding-left: 8px;
  flex-basis: 100%;
  max-width: 100%;
  text-align: center;
}
.FooterSection.FooterSection--legal p:not(:first-of-type) {
  margin-top: 0.5em;
}
@media (min-width: 820px) {
  .FooterSection.FooterSection--legal {
    box-sizing: border-box;
    flex: 0 0 auto;
    padding-right: 8px;
    padding-left: 8px;
    flex-basis: 33.3333333333%;
    max-width: 33.3333333333%;
  }
}

.FooterSection.FooterSection--guy {
  box-sizing: border-box;
  flex: 0 0 auto;
  padding-right: 8px;
  padding-left: 8px;
  flex-basis: 100%;
  max-width: 100%;
  display: flex;
  justify-content: center;
}
.FooterSection.FooterSection--guy svg {
  height: 2.25em;
}
@media (min-width: 820px) {
  .FooterSection.FooterSection--guy {
    box-sizing: border-box;
    flex: 0 0 auto;
    padding-right: 8px;
    padding-left: 8px;
    flex-basis: 33.3333333333%;
    max-width: 33.3333333333%;
    justify-content: flex-end;
  }
}

.FooterSection--links {
  box-sizing: border-box;
  flex: 0 0 auto;
  padding-right: 8px;
  padding-left: 8px;
  flex-basis: 100%;
  max-width: 100%;
  text-align: center;
}

.FooterSection__link {
  color: inherit;
  margin: 0 0.5ch;
}

.RatingList {
  display: grid;
  grid-template-columns: repeat(3, 42px);
  grid-gap: 16px;
  justify-content: center;
  align-items: center;
}
.RatingList .RatingList__item {
  width: auto !important;
}
@media (min-width: 820px) {
  .RatingList {
    justify-content: flex-start;
  }
}
@media (min-width: 1200px) {
  .RatingList {
    grid-template-columns: repeat(3, 58px);
    grid-gap: 32px;
  }
}
/*# sourceMappingURL=maps/main.css.map */