@charset "UTF-8";
@font-face {
  font-family: "AmarilloUSAF";
  src: url("../font/AmarilloUSAF.eot");
  src: url("../font/AmarilloUSAF.eot?#iefix") format("embedded-opentype"), url("../font/AmarilloUSAF.woff2") format("woff2"), url("../font/AmarilloUSAF.woff") format("woff"), url("../font/AmarilloUSAF.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "TB";
  src: url("../font/TBGoStdB-Normal.otf");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
.fnt-amarillo {
  font-family: "AmarilloUSAF", sans-serif;
}

.fnt-tb {
  font-family: "TB", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
}

:root {
  --sp-content-width: 100vw;
}
@media (min-width: 751px) {
  :root {
    --sp-content-width: 603px;
  }
}

@media (max-width: 767px) {
  .only-pc {
    display: none !important;
  }
}

@media (min-width: 768px) {
  .only-sp {
    display: none !important;
  }
}

html {
  font-size: 1.1111111111vw;
  font-weight: 500;
  font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic";
  scroll-behavior: smooth;
}

main picture {
  text-align: center;
  display: block;
}
main img {
  max-width: 100%;
}
main .bg-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(to bottom, #6099f4 0%, #fff 100%);
}
main header,
main footer {
  position: relative;
  z-index: 1;
}

body {
  color: #000;
  background-color: #f7f7f7;
  margin: 0;
}

.display--pc {
  display: block;
}

@media screen and (max-width: 767px) {
  .display--pc {
    display: none;
  }
}
.display--sp {
  display: none;
}

@media screen and (max-width: 767px) {
  .display--sp {
    display: block;
  }
}
* {
  padding: 0;
  margin: 0;
}

a {
  color: inherit;
  text-decoration: none;
}

.vCenter {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.main-content {
  width: calc(var(--sp-content-width) * 1);
  margin: 0 auto;
  overflow: hidden;
  position: relative;
  z-index: 2;
}

.header {
  background: #fff;
  padding: calc(var(--sp-content-width) * 0.0373333333) calc(var(--sp-content-width) * 0.0373333333) calc(var(--sp-content-width) * 0.0266666667);
}
.header .logo {
  display: block;
  width: 100%;
  max-width: calc(var(--sp-content-width) * 0.172);
}
.header .logo img {
  aspect-ratio: 104/28;
}

.kv {
  position: relative;
  overflow: hidden;
  line-height: 0;
  aspect-ratio: 375/622;
}
.kv__txt--ele {
  position: absolute;
  z-index: 1;
  transition: opacity 0.45s ease, transform 0.45s cubic-bezier(0.49, 0.25, 0.3, 1.31);
  opacity: 0;
  transform: scale(0);
}
.kv__txt--ele.--txt01 {
  top: calc(var(--sp-content-width) * 0.1499466667);
  right: calc(var(--sp-content-width) * 0.1837333333);
  width: calc(var(--sp-content-width) * 0.2773333333);
  transition-delay: 0.6s;
}
.kv__txt--ele.--txt02 {
  bottom: calc(var(--sp-content-width) * 0.032);
  left: calc(var(--sp-content-width) * 0.1133333333);
  width: calc(var(--sp-content-width) * 0.364);
  transition-delay: 0.75s;
}
.kv__txt--ele.--txt03 {
  top: calc(var(--sp-content-width) * 0.3266666667);
  left: calc(var(--sp-content-width) * 0.0133333333);
  width: calc(var(--sp-content-width) * 0.9693333333);
  transition-delay: 0.9s;
}
.kv__txt--ele.--txt03 {
  top: calc(var(--sp-content-width) * 0.3266666667);
  left: calc(var(--sp-content-width) * 0.0133333333);
  width: calc(var(--sp-content-width) * 0.9693333333);
  transition-delay: 0.9s;
}
.kv__txt--ele.--txt04 {
  top: calc(var(--sp-content-width) * 1.0693333333);
  right: calc(var(--sp-content-width) * 0.0933333333);
  width: calc(var(--sp-content-width) * 0.1506666667);
  transition-delay: 0.9s;
}
.kv__txt--ele.--txt05 {
  bottom: calc(var(--sp-content-width) * 0.3506666667);
  left: calc(var(--sp-content-width) * 0.3466666667);
  width: calc(var(--sp-content-width) * 0.3053333333);
  transition-delay: 1.1s;
}
.kv__deco--ele {
  position: absolute;
  z-index: 1;
  opacity: 0;
  transform: scale(0);
  transition: opacity 0.45s ease, transform 0.45s cubic-bezier(0.49, 0.25, 0.3, 1.31);
}
.kv__deco--ele.--deco01 {
  top: calc(var(--sp-content-width) * -0.0106666667);
  left: calc(var(--sp-content-width) * -0.0106666667);
  width: calc(var(--sp-content-width) * 0.4426666667);
  transition-delay: 0.25s;
}
.kv__deco--ele.--deco02 {
  top: calc(var(--sp-content-width) * 0.0186666667);
  right: calc(var(--sp-content-width) * -0.168);
  width: calc(var(--sp-content-width) * 0.3746666667);
  transition-delay: 0.35s;
}
.kv__deco--ele.--deco03 {
  bottom: calc(var(--sp-content-width) * -0.144);
  right: calc(var(--sp-content-width) * -0.0986666667);
  width: calc(var(--sp-content-width) * 0.528);
  transition-delay: 0.45s;
}
.kv.anim .kv__txt--ele,
.kv.anim .kv__deco--ele {
  opacity: 1;
  transform: scale(1);
}

.footer {
  padding: calc(var(--sp-content-width) * 0.0666666667) 0 calc(var(--sp-content-width) * 0.0666666667);
  background: #f2f2f2;
}
.footer .f-logo {
  width: calc(var(--sp-content-width) * 0.2826666667);
  margin: 0 auto;
}
.footer .copyright {
  color: #2986CC;
  text-align: center;
  margin-top: calc(var(--sp-content-width) * 0.0266666667);
  font-size: calc(var(--sp-content-width) * 0.032);
}

.main-bg {
  background: url("../images/main-bg.jpg") center top;
  background-size: 100% 100%;
}

.datetime {
  padding: calc(var(--sp-content-width) * 0.1653333333) calc(var(--sp-content-width) * 0.0826666667) 0;
}
.datetime .inner {
  position: relative;
  z-index: 1;
  padding: calc(var(--sp-content-width) * 0.2453333333) 0 calc(var(--sp-content-width) * 0.0693333333);
}
@media (min-width: 768px) {
  .datetime .inner {
    padding-bottom: calc(var(--sp-content-width) * 0.0613333333);
  }
}
.datetime .inner:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: calc(var(--sp-content-width) * -0.0026666667);
  bottom: 0;
  background: url("../images/datetime-bg.png") center center no-repeat;
  background-size: 100% 100%;
  z-index: -1;
}
.datetime .inner .deco {
  position: absolute;
}
.datetime .inner .deco.deco01 {
  top: calc(var(--sp-content-width) * 0.0826666667);
  right: calc(var(--sp-content-width) * -0.2026666667);
  width: calc(var(--sp-content-width) * 0.3453333333);
}
.datetime .inner .deco.deco02 {
  top: calc(var(--sp-content-width) * 0.7786666667);
  left: calc(var(--sp-content-width) * -0.1973333333);
  width: calc(var(--sp-content-width) * 0.3333333333);
}
.datetime--ttl {
  position: absolute;
  top: calc(var(--sp-content-width) * -0.024);
  left: 52.7%;
  transform: translateX(-50%);
  width: calc(var(--sp-content-width) * 0.5386666667);
}
.datetime--day {
  width: calc(var(--sp-content-width) * 0.5466666667);
  margin: 0 auto;
}
.datetime--description {
  text-align: center;
  color: #2986cc;
  margin-top: calc(var(--sp-content-width) * 0.048);
}
.datetime--description p {
  display: inline-block;
  font-size: calc(var(--sp-content-width) * 0.0866666667);
  line-height: calc(var(--sp-content-width) * 0.1146666667);
  letter-spacing: 0.04em;
  font-weight: 600;
  position: relative;
  z-index: 1;
}
.datetime--description p:before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  z-index: -1;
  bottom: calc(var(--sp-content-width) * 0.008);
  height: calc(var(--sp-content-width) * 0.0306666667);
  background: #d0e000;
  opacity: 0.6;
  transform: skewX(15deg);
}
.datetime--description p i {
  width: calc(var(--sp-content-width) * 0.0666666667);
  display: inline-block;
  margin-right: calc(var(--sp-content-width) * 0.008);
  transform: translateY(calc(var(--sp-content-width) * 0.0133333333));
}
.datetime--description p span {
  font-size: calc(var(--sp-content-width) * 0.12);
  letter-spacing: 0;
  display: inline-block;
  margin-left: calc(var(--sp-content-width) * 0.0106666667);
  font-weight: 400;
}
.datetime--description p .letter-sm {
  margin: 0 calc(var(--sp-content-width) * 0.024) 0 0;
}
.datetime--time {
  text-align: center;
  width: calc(var(--sp-content-width) * 0.4253333333);
  margin: calc(var(--sp-content-width) * 0.0346666667) auto 0;
}
.datetime--btn {
  text-align: center;
  width: calc(var(--sp-content-width) * 0.528);
  margin: calc(var(--sp-content-width) * 0.056) auto 0;
}
@media (min-width: 768px) {
  .datetime--btn {
    margin-top: calc(var(--sp-content-width) * 0.0453333333);
  }
}
.datetime--btn a {
  display: inline-block;
  transition: all 0.35s ease;
}
@media (min-width: 768px) and (hover: hover) {
  .datetime--btn a:hover {
    opacity: 0.7;
  }
}
.datetime--btn img {
  transform: translate(calc(var(--sp-content-width) * 0.008), 0);
}

.studio {
  padding: calc(var(--sp-content-width) * 0.2266666667) calc(var(--sp-content-width) * 0.0533333333) calc(var(--sp-content-width) * 0.0693333333);
  font-size: calc(var(--sp-content-width) * 0.0426666667);
  line-height: calc(var(--sp-content-width) * 0.088);
  text-align: center;
  color: #2986cc;
}
.studio .inner {
  position: relative;
  z-index: 1;
  padding: calc(var(--sp-content-width) * 0.1893333333) 0 calc(var(--sp-content-width) * 0.1093333333);
}
.studio .inner:before {
  content: "";
  position: absolute;
  top: calc(var(--sp-content-width) * -0.0826666667);
  left: calc(var(--sp-content-width) * -0.088);
  bottom: calc(var(--sp-content-width) * -0.1786666667);
  right: calc(var(--sp-content-width) * -0.1093333333);
  background: url("../images/studio-bg.png") center no-repeat;
  background-size: 100% 100%;
  z-index: -1;
}
.studio .inner:after {
  content: "";
  position: absolute;
  left: calc(var(--sp-content-width) * -0.0666666667);
  bottom: calc(100% + var(--sp-content-width) * 0.0266666667);
  width: calc(var(--sp-content-width) * 0.928);
  height: calc(var(--sp-content-width) * 0.188);
  background: url("../images/studio-deco.png") center no-repeat;
  background-size: 100% 100%;
  z-index: 1;
}
.studio--ttl {
  width: calc(var(--sp-content-width) * 0.764);
  margin: 0 auto calc(var(--sp-content-width) * 0.0586666667);
}
.studio--content {
  font-weight: 600;
  letter-spacing: -0.04em;
}
.studio--content p + p {
  margin-top: calc(var(--sp-content-width) * 0.064);
}
.studio--content p:nth-last-child(1) {
  margin-top: calc(var(--sp-content-width) * 0.0533333333);
}
.studio--content span {
  font-size: calc(var(--sp-content-width) * 0.0541333333);
  display: inline-block;
  line-height: calc(var(--sp-content-width) * 0.0826666667);
}
.studio--content span.letter-lg {
  letter-spacing: 0;
}

.survey {
  padding: calc(var(--sp-content-width) * 0.32) calc(var(--sp-content-width) * 0.0533333333) 0;
  position: relative;
  z-index: 3;
}
.survey:before {
  content: "";
  position: absolute;
  width: calc(var(--sp-content-width) * 1.1253333333);
  height: calc(var(--sp-content-width) * 1.4586666667);
  top: calc(var(--sp-content-width) * -0.008);
  left: calc(var(--sp-content-width) * -0.0933333333);
  z-index: -1;
  background: url("../images/survey-deco.png") center no-repeat;
  background-size: 100% 100%;
}
.survey--ttl {
  width: calc(var(--sp-content-width) * 0.7586666667);
  margin: 0 0 calc(var(--sp-content-width) * 0.0506666667) calc(var(--sp-content-width) * 0.056);
  position: relative;
}
.survey--ttl .sub {
  position: absolute;
  top: calc(var(--sp-content-width) * 0.04);
  right: calc(var(--sp-content-width) * 0.04);
  font-size: calc(var(--sp-content-width) * 0.0266666667);
  transform: rotate(-5.8deg);
  color: #2986CC;
}
@media (min-width: 768px) {
  .survey--ttl {
    margin-bottom: calc(var(--sp-content-width) * 0.04);
  }
}
.survey--photo {
  width: calc(var(--sp-content-width) * 0.9226666667);
  margin-left: calc(var(--sp-content-width) * -0.016);
  position: relative;
}
.survey--photo .sub {
  position: absolute;
  right: calc(var(--sp-content-width) * 0.1066666667);
  bottom: calc(var(--sp-content-width) * 0.0586666667);
  font-size: calc(var(--sp-content-width) * 0.0266666667);
  font-weight: 400;
  transform: rotate(4.5deg);
}
@media (min-width: 768px) {
  .survey--photo .sub {
    bottom: calc(var(--sp-content-width) * 0.0693333333);
  }
}
.survey--photo-label {
  position: absolute;
  top: calc(var(--sp-content-width) * -0.0693333333);
  right: calc(var(--sp-content-width) * -0.072);
  width: calc(var(--sp-content-width) * 0.6053333333);
}
.survey--photo-label.--02 {
  top: auto;
  right: auto;
  left: calc(var(--sp-content-width) * -0.0746666667);
  bottom: calc(var(--sp-content-width) * -0.1893333333);
  width: calc(var(--sp-content-width) * 0.5653333333);
  z-index: 2;
}

.unique {
  padding: calc(var(--sp-content-width) * 0.2293333333) calc(var(--sp-content-width) * 0.032) 0 calc(var(--sp-content-width) * 0.056);
  position: relative;
  z-index: 2;
}
@media (min-width: 768px) {
  .unique {
    padding-top: calc(var(--sp-content-width) * 0.216);
  }
}
.unique .inner {
  position: relative;
  z-index: 1;
  padding-bottom: calc(var(--sp-content-width) * 0.1226666667);
}
@media (min-width: 768px) {
  .unique .inner {
    padding-bottom: calc(var(--sp-content-width) * 0.112);
  }
}
.unique .inner:before {
  content: "";
  position: absolute;
  top: calc(var(--sp-content-width) * -0.2426666667);
  left: calc(var(--sp-content-width) * -0.088);
  right: calc(var(--sp-content-width) * -0.0506666667);
  bottom: 0;
  background: url("../images/unique-bg.png") center no-repeat;
  background-size: 100% 100%;
  z-index: -1;
}
.unique .inner:after {
  content: "";
  position: absolute;
  top: calc(var(--sp-content-width) * -0.1866666667);
  right: calc(var(--sp-content-width) * -0.112);
  width: calc(var(--sp-content-width) * 0.34);
  height: calc(var(--sp-content-width) * 0.2786666667);
  background: url("../images/unique-deco.png") center no-repeat;
  background-size: 100% 100%;
}
.unique .photo {
  margin: calc(var(--sp-content-width) * -0.08) calc(var(--sp-content-width) * -0.1226666667) 0 calc(var(--sp-content-width) * -0.0773333333);
  position: relative;
}
.unique .photo .txt-sub {
  position: absolute;
  bottom: calc(var(--sp-content-width) * 0.0266666667);
  left: calc(var(--sp-content-width) * 0.1733333333);
  font-size: calc(var(--sp-content-width) * 0.0266666667);
  color: #2986CC;
}
@media (min-width: 768px) {
  .unique .photo {
    margin-top: calc(var(--sp-content-width) * -0.0906666667);
  }
}

.sticker {
  padding: 0 calc(var(--sp-content-width) * 0.06) calc(var(--sp-content-width) * 0.0053333333) calc(var(--sp-content-width) * 0.0826666667);
}
.sticker .inner {
  position: relative;
  z-index: 1;
  padding-top: calc(var(--sp-content-width) * 0.0053333333);
  padding-bottom: calc(var(--sp-content-width) * 0.2533333333);
}
@media (min-width: 768px) {
  .sticker .inner {
    padding-top: calc(var(--sp-content-width) * 0.0133333333);
  }
}
.sticker .inner:before {
  content: "";
  position: absolute;
  top: calc(var(--sp-content-width) * -0.1013333333);
  left: calc(var(--sp-content-width) * -0.0906666667);
  right: calc(var(--sp-content-width) * -0.0613333333);
  bottom: 0;
  background: url("../images/sticker-bg.png") center no-repeat;
  background-size: 100% 100%;
  z-index: -1;
}
.sticker .inner:after {
  content: "";
  position: absolute;
  left: calc(var(--sp-content-width) * -0.2106666667);
  bottom: 0;
  width: calc(var(--sp-content-width) * 1.1546666667);
  height: calc(var(--sp-content-width) * 0.4266666667);
  background: url("../images/sticker-deco.png") center no-repeat;
  background-size: 100% 100%;
}
.sticker .photo {
  margin: calc(var(--sp-content-width) * -0.0186666667) calc(var(--sp-content-width) * -0.0133333333) calc(var(--sp-content-width) * -0.016) calc(var(--sp-content-width) * -0.072);
}
@media (min-width: 768px) {
  .sticker .photo {
    margin-top: calc(var(--sp-content-width) * -0.0133333333);
  }
}
.sticker .txt-sub {
  font-size: calc(var(--sp-content-width) * 0.0266666667);
  position: absolute;
  bottom: calc(var(--sp-content-width) * 0.1733333333);
  right: calc(var(--sp-content-width) * 0.0133333333);
  color: #2986CC;
}

.access {
  padding: calc(var(--sp-content-width) * 0.032) calc(var(--sp-content-width) * 0.0426666667) calc(var(--sp-content-width) * 0.1333333333) calc(var(--sp-content-width) * 0.096);
  position: relative;
  z-index: 1;
}
.access .map {
  position: relative;
  z-index: 1;
  padding-bottom: calc(var(--sp-content-width) * 0.0546666667);
}
.access .map:before {
  content: "";
  position: absolute;
  top: calc(var(--sp-content-width) * -0.1866666667);
  left: calc(var(--sp-content-width) * -0.104);
  bottom: calc(var(--sp-content-width) * -0.1146666667);
  right: calc(var(--sp-content-width) * -0.056);
  background: url("../images/map-bg.png") center no-repeat;
  background-size: 100% 100%;
  z-index: -1;
}
.access .map--ttl2 {
  width: calc(var(--sp-content-width) * 0.22);
  margin: calc(var(--sp-content-width) * 0.04) auto calc(var(--sp-content-width) * 0.0133333333);
}
.access .map-frame {
  margin: calc(var(--sp-content-width) * 0.0026666667) calc(var(--sp-content-width) * 0.0106666667) calc(var(--sp-content-width) * 0.0266666667) calc(var(--sp-content-width) * 0.0293333333);
  position: relative;
  padding: calc(var(--sp-content-width) * 0.0213333333);
  background: #fff;
  box-shadow: calc(var(--sp-content-width) * 0.0026666667) calc(var(--sp-content-width) * 0.0026666667) calc(var(--sp-content-width) * 0.0026666667) calc(var(--sp-content-width) * 0.0013333333) rgba(0, 0, 0, 0.15);
}
.access .map-frame .map-frame-inner {
  height: calc(var(--sp-content-width) * 0.3893333333);
  min-height: 200px;
  position: relative;
}
.access .map-frame iframe {
  width: 100%;
  height: 100%;
}
.access .map--description {
  text-align: center;
  font-weight: 600;
  color: #2986CC;
  margin-top: calc(var(--sp-content-width) * -0.0053333333);
}
.access .map--description i {
  width: calc(var(--sp-content-width) * 0.056);
  display: inline-block;
  margin-right: calc(var(--sp-content-width) * 0.02);
  transform: translate(0, calc(var(--sp-content-width) * 0.0106666667));
}
.access .map--description .txt-lg {
  font-size: calc(var(--sp-content-width) * 0.0666666667);
  letter-spacing: -0.06em;
  position: relative;
  display: inline-block;
}
.access .map--description .txt-lg:before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  z-index: -1;
  bottom: calc(var(--sp-content-width) * 0.0186666667);
  height: calc(var(--sp-content-width) * 0.0306666667);
  background: #d0e000;
  opacity: 0.6;
  transform: skewX(15deg);
}
.access .map--description .txt-lg span {
  font-weight: 400;
  font-size: calc(var(--sp-content-width) * 0.0933333333);
  letter-spacing: 0.02em;
}
.access .map--description .txt-lg .letter-sm {
  margin: 0 calc(var(--sp-content-width) * 0.0106666667) 0 0;
  letter-spacing: 0;
}
.access .map--description .txt-sm {
  font-size: calc(var(--sp-content-width) * 0.0533333333);
  line-height: calc(var(--sp-content-width) * 0.0666666667);
  font-weight: 600;
  margin-top: calc(var(--sp-content-width) * 0.0053333333);
}
.access .map--description .txt-sm span {
  display: inline-block;
}
.access .info--ttl {
  width: calc(var(--sp-content-width) * 0.272);
  margin: calc(var(--sp-content-width) * 0.1146666667) auto calc(var(--sp-content-width) * 0.016);
}
@media (min-width: 768px) {
  .access .info--ttl {
    margin-bottom: calc(var(--sp-content-width) * 0.0133333333);
  }
}
.access .info-description {
  text-align: center;
  color: #2986CC;
}
.access .info-description .txt1 {
  font-size: calc(var(--sp-content-width) * 0.072);
  display: inline-block;
  font-weight: 600;
  line-height: calc(var(--sp-content-width) * 0.0986666667);
  position: relative;
  z-index: 1;
  letter-spacing: 0.05em;
}
.access .info-description .txt1 span {
  font-weight: 500;
  display: inline-block;
  margin-left: calc(var(--sp-content-width) * 0.016);
  margin-right: calc(var(--sp-content-width) * 0.0053333333);
}
.access .info-description .txt1:before {
  content: "";
  position: absolute;
  left: calc(var(--sp-content-width) * -0.0133333333);
  right: calc(var(--sp-content-width) * -0.0133333333);
  z-index: -1;
  bottom: calc(var(--sp-content-width) * 0.0026666667);
  height: calc(var(--sp-content-width) * 0.0306666667);
  background: #d0e000;
  opacity: 0.6;
  transform: skewX(15deg);
}
.access .info-description .txt2 {
  font-size: calc(var(--sp-content-width) * 0.0466666667);
  line-height: calc(var(--sp-content-width) * 0.072);
  font-weight: 600;
  margin-top: calc(var(--sp-content-width) * 0.0213333333);
}
.access .info-description .txt2 span {
  font-weight: 500;
}
.access .info-description .txt3 {
  font-size: calc(var(--sp-content-width) * 0.054);
  line-height: calc(var(--sp-content-width) * 0.068);
  margin-top: calc(var(--sp-content-width) * 0.048);
}

.event {
  padding: calc(var(--sp-content-width) * 0.0453333333) calc(var(--sp-content-width) * 0.06) calc(var(--sp-content-width) * 0.0293333333);
}
.event .inner {
  position: relative;
  z-index: 1;
  padding: calc(var(--sp-content-width) * 0.2133333333) calc(var(--sp-content-width) * 0.088) calc(var(--sp-content-width) * 0.176) calc(var(--sp-content-width) * 0.0933333333);
}
@media (min-width: 768px) {
  .event .inner {
    padding-bottom: calc(var(--sp-content-width) * 0.1706666667);
  }
}
.event .inner:before {
  content: "";
  position: absolute;
  top: 0;
  left: calc(var(--sp-content-width) * -0.1946666667);
  bottom: 0;
  right: calc(var(--sp-content-width) * -0.2026666667);
  background: url("../images/event-bg.png") center no-repeat;
  background-size: 100% 100%;
  z-index: -1;
}
.event--ttl {
  width: calc(var(--sp-content-width) * 0.6413333333);
  position: absolute;
  top: calc(var(--sp-content-width) * -0.016);
  left: 52%;
  transform: translate(-50%, 0);
}
.event a {
  transition: all 0.35s ease;
}
@media (min-width: 768px) and (hover: hover) {
  .event a:hover {
    opacity: 0.8;
  }
}
.event .item-01 dt {
  width: calc(var(--sp-content-width) * 0.6386666667);
  margin-bottom: calc(var(--sp-content-width) * 0.024);
  margin-left: calc(var(--sp-content-width) * 0.0266666667);
}
.event .item-01 dd {
  width: calc(var(--sp-content-width) * 0.6213333333);
  margin: 0 auto;
}
.event .item-02 {
  margin-top: calc(var(--sp-content-width) * 0.088);
}
@media (min-width: 768px) {
  .event .item-02 {
    margin-top: calc(var(--sp-content-width) * 0.0773333333);
  }
}
.event .item-02 dt {
  width: calc(var(--sp-content-width) * 0.6986666667);
  margin-bottom: calc(var(--sp-content-width) * 0.032);
}
@media (min-width: 768px) {
  .event .item-02 dt {
    margin-bottom: calc(var(--sp-content-width) * 0.0213333333);
  }
}
.event .item-02 dd {
  width: calc(var(--sp-content-width) * 0.6186666667);
  margin: 0 auto;
}