html, body {
  margin: 0;
  padding: 0;
}

header,
#main {
  font-family: "Noto Sans JP", sans-serif;
}
header *,
header *::before,
header *::after,
#main *,
#main *::before,
#main *::after {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-font-feature-settings: "palt";
          font-feature-settings: "palt";
  margin: 0;
  padding: 0;
}
header article, header aside, header details, header figcaption, header figure, header footer, header header, header hgroup, header menu, header nav, header section, header main,
#main article,
#main aside,
#main details,
#main figcaption,
#main figure,
#main footer,
#main header,
#main hgroup,
#main menu,
#main nav,
#main section,
#main main {
  display: block;
}
header ul, header li,
#main ul,
#main li {
  list-style: none;
}
header blockquote, header q,
#main blockquote,
#main q {
  quotes: none;
}
header blockquote::before, header blockquote::after, header q::before, header q::after,
#main blockquote::before,
#main blockquote::after,
#main q::before,
#main q::after {
  content: "";
  content: none;
}
header a,
#main a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  background: transparent;
  -webkit-transition: 0.3s;
  transition: 0.3s;
  display: block;
  position: relative;
  z-index: 2;
  -webkit-transform: translateZ(1px);
          transform: translateZ(1px);
}
header a:hover,
#main a:hover {
  opacity: 0.7;
}
header button,
#main button {
  background-color: transparent;
  border: none;
  cursor: pointer;
  outline: none;
  padding: 0;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
header address,
#main address {
  font-style: normal;
}
header ins,
#main ins {
  color: #000;
  text-decoration: none;
}
header mark,
#main mark {
  color: #000;
  font-style: italic;
  font-weight: bold;
}
header del,
#main del {
  text-decoration: line-through;
}
header table,
#main table {
  border-collapse: collapse;
  border-spacing: 0;
}
header hr,
#main hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #444;
  margin: 1em 0;
  padding: 0;
}
header input, header select,
#main input,
#main select {
  vertical-align: middle;
}
header button,
#main button {
  margin: 0;
}
header a,
header a:link,
header a:visited,
#main a,
#main a:link,
#main a:visited {
  text-decoration: none;
}
header img,
#main img {
  width: 100%;
  height: auto;
}

/*========================================== 
  Common (PC)
========================================== */
#main {
  background: #221714;
}
#main .-tb,
#main .-sp {
  display: none !important;
}
#main .-pc {
  display: block !important;
}
#main .wrap {
  max-width: 890px;
  padding: 0 20px;
  margin: auto;
}

/*========================================== 
  HEADER (PC)
========================================== */
header .wrap {
  max-width: 1280px;
  margin: auto;
  position: relative;
}
header .logo {
  width: 9.0625%;
  min-width: 100px;
  position: absolute;
  top: 50px;
  left: 4.140625%;
}

/*========================================== 
  MV (PC)
========================================== */
#main .mv {
  background: url("../img/mv_bg.png") top center no-repeat;
  background-size: auto;
  padding: 20px 0 133px;
}
#main .mv-head {
  max-width: 1280px;
  margin: auto;
  position: relative;
}
#main .mv h1 {
  width: 58.59375%;
  margin: auto;
}
#main .mv-pop {
  width: 14.6875%;
  position: absolute;
  top: 37%;
  left: 4%;
}
#main .mv-sub {
  width: 10%;
  position: absolute;
  top: 3.5%;
  right: 3.5%;
}

/*========================================== 
  ANCHOR (PC)
========================================== */
#main .anchor {
  position: relative;
  padding: 0 0 50px;
  overflow-x: hidden;
}
#main .anchor::before {
  content: "";
  background: url("../img/light.png") center center no-repeat;
  width: 1035px;
  height: 189px;
  position: absolute;
  bottom: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
#main .swiper {
  position: relative;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 20px 20px 15px;
  overflow-x: hidden;
}
#main .swiper .swiper-slide {
  width: 34.0170940171%;
  -webkit-transition: opacity 0.3s, -webkit-transform 0.3s, -webkit-filter 0.3s;
  transition: opacity 0.3s, -webkit-transform 0.3s, -webkit-filter 0.3s;
  transition: transform 0.3s, opacity 0.3s, filter 0.3s;
  transition: transform 0.3s, opacity 0.3s, filter 0.3s, -webkit-transform 0.3s, -webkit-filter 0.3s;
  -webkit-transform: scale(0.6658291457);
          transform: scale(0.6658291457);
  -webkit-transform-origin: top center;
          transform-origin: top center;
  filter: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="filter"><feColorMatrix type="matrix" color-interpolation-filters="sRGB" values="0.2126 0.7152 0.0722 0 0 0.2126 0.7152 0.0722 0 0 0.2126 0.7152 0.0722 0 0 0 0 0 1 0" /><feComponentTransfer color-interpolation-filters="sRGB"><feFuncR type="linear" slope="0.6" /><feFuncG type="linear" slope="0.6" /><feFuncB type="linear" slope="0.6" /></feComponentTransfer></filter></svg>#filter');
  -webkit-filter: grayscale(100%) brightness(0.6);
          filter: grayscale(100%) brightness(0.6);
  pointer-events: none;
  position: relative;
  padding-bottom: 2%;
}
#main .swiper .swiper-slide::before {
  content: "";
  background: url("../img/shadow.png") center center no-repeat;
  background-size: 100% 100%;
  width: 108.5427135678%;
  height: 12.7516778523%;
  position: absolute;
  bottom: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  z-index: 1;
}
#main .swiper .swiper-slide-active {
  -webkit-transform: translateY(20px) scale(1);
          transform: translateY(20px) scale(1);
  -webkit-filter: none;
          filter: none;
  pointer-events: auto;
}
#main .swiper .swiper-button-prev,
#main .swiper .swiper-button-next {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  z-index: 10;
  width: 42px;
  height: 42px;
}
#main .swiper .swiper-button-prev::after,
#main .swiper .swiper-button-next::after {
  content: none;
}
#main .swiper .swiper-button-prev {
  left: 28%;
}
#main .swiper .swiper-button-next {
  right: 28%;
  -webkit-transform: translateY(-50%) scale(-1, 1);
          transform: translateY(-50%) scale(-1, 1);
}

/*========================================== 
  EVENT (PC)
========================================== */
#main .event {
  padding: 0 0 195px;
  position: relative;
}
#main .event::after {
  content: "";
  background: url("../img/bg.png") top center no-repeat;
  background-size: cover;
  width: 100%;
  max-width: 1280px;
  height: 111.1%;
  position: absolute;
  top: -11.1%;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  z-index: 1;
  pointer-events: none;
}
#main .event .wrap {
  position: relative;
  z-index: 2;
}
#main .event-item {
  padding-top: 70px;
}
#main .event-item {
  position: relative;
}
#main .event-item button {
  cursor: pointer;
  position: absolute;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  background-image: url(../img/icon-plus.svg);
  background-size: 30px 30px;
  background-position: bottom 5% right 5%;
  background-repeat: no-repeat;
}
#main .event-item button:hover {
  background-color: rgba(0, 0, 0, .3);
}
#main .event-item01 button {
  width: 19.7647058824%;
  height: 23.6033519553%;
}
#main .event-item01 .btn01 {
  left: 4.4705882353%;
  top: 47.625698324%;
}
#main .event-item01 .btn02 {
  left: 26.2352941176%;
  top: 47.625698324%;
}
#main .event-item01 .btn03 {
  left: 48%;
  top: 47.625698324%;
}
#main .event-item02 button {
  width: 31.7647058824%;
  height: 47.2180451128%;
}
#main .event-item02 .btn04 {
  left: 35.7647058824%;
  top: 38.4962406015%;
}
#main .event-item03 button {
  width: 39.0588235294%;
  height: 32.9457364341%;
}
#main .event-item03 .btn05 {
  left: 3.5294117647%;
  top: 45.3488372093%;
}
#main .event-item06 button {
  width: 62.9411764706%;
  height: 42.1669106881%;
}
#main .event-item06 .btn06 {
  left: 3.5294117647%;
  top: 53.7335285505%;
}
#main .event-item .link {
  cursor: pointer;
  position: absolute;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
#main .event-item .link:hover {
  background: rgba(0, 0, 0, .3);
}
#main .event-item08 .btn07 {
  left: 61.5%;
  top: 71%;
  width: 35.5%;
  height: 22.5%;
}
#main .event-item08 .btn08 {
  left: 23.5%;
  top: 62.5%;
  width: 13%;
  height: 32.5%;
}
#main .event-item08 .btn09 {
  left: 39%;
  top: 62.5%;
  width: 16%;
  height: 32.5%;
}

/*========================================== 
  MAP (PC)
========================================== */
#main .map {
  background: #fff;
  padding: 160px 0 80px;
}
#main .map .sup-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin-top: 13px;
}
#main .map .sup-list li {
  font-size: 13px;
  font-weight: 400;
  line-height: 1.3846153846;
  letter-spacing: -0.03em;
  color: #221714;
}
#main .map .sup-list.strong li {
  font-size: 20px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 0.05em;
}
#main .map .col2 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 12px;
}
#main .map .attention {
  background: #af1e25;
  width: 59.4117647059%;
  font-size: 22px;
  line-height: 1.4545454545;
  color: #fff;
  padding: 2px 15px 4px;
}
#main .map .logo {
  width: 34.7058823529%;
}

/*========================================== 
  MODAL (PC)
========================================== */
#main .modal-wrap {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  text-align: center;
  background: rgba(0, 0, 0, .5);
  padding: 60px 30px;
  overflow: auto;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: 0.3s;
  transition: 0.3s;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  z-index: 10;
}
#main .modal-wrap:before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  height: 100%;
}
#main .modal-wrap.active {
  opacity: 1;
  visibility: visible;
}
#main .modal-inner {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  max-width: 428px;
  width: 90%;
}
#main .modal-close {
  position: absolute;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  top: -60px;
  right: -60px;
  width: 60px;
  height: 60px;
  font-size: 60px;
  color: #fff;
  cursor: pointer;
}
#main .modal-cont {
  background: #fff;
  border: solid #221714 2px;
  -webkit-box-shadow: 9px 9px 9px rgba(0, 0, 0, .6);
          box-shadow: 9px 9px 9px rgba(0, 0, 0, .6);
  border-radius: 21px;
  text-align: left;
  padding: 23px 30px 33px;
  min-height: 650px;
}
#main .modal-cont h3 {
  width: 80px;
  line-height: 0;
}
#main .modal-cont .profile-img {
  width: 207px;
  margin: 23px auto 0;
}
#main .modal-cont .profile-detail {
  margin-top: 23px;
}
#main .modal-cont .profile-detail dt {
  font-size: 36px;
  font-weight: 500;
  letter-spacing: 0.19em;
  text-align: center;
}
#main .modal-cont .profile-detail dt span {
  font-size: 18px;
  font-weight: 400;
  letter-spacing: 0.07em;
  display: block;
}
#main .modal-cont .profile-detail dd {
  margin-top: 30px;
}
#main .modal-cont .profile-detail dd p {
  font-size: 17px;
  line-height: 1.9090909091;
  letter-spacing: 0.045em;
}
#main .modal-cont .link {
  margin-top: 36px;
}
#main .modal-cont .link + .link {
  margin-top: 17px;
}
#main .modal-cont .link dt {
  font-size: 11px;
}
#main .modal-cont .link a {
  font-size: 14px;
  font-weight: 700;
  color: #000;
  font-style: italic;
}
#main .modal06 .profile-img {
  width: 100%;
  margin: 68px auto 0;
}

#main .pagetop-btn {
  position: fixed;
  bottom: 30px;
  right: 30px;
  z-index: 10;
}
#main .pagetop-btn a {
  border-radius: 50%;
  z-index: 100;
  width: 110px;
  height: 110px;
  position: relative;
}
#main .pagetop-btn a::before {
  content: "";
  width: 100%;
  height: 100%;
  background: #fff;
  border-radius: 50%;
  position: absolute;
  left: 6px;
  top: 6px;
  z-index: -1;
}
#main .pagetop-btn.fadeIn {
  -webkit-animation: FadeIn 0.5s forwards;
          animation: FadeIn 0.5s forwards;
}
#main .pagetop-btn.fadeOut {
  -webkit-animation: Fadeout 0.5s forwards;
          animation: Fadeout 0.5s forwards;
}
@-webkit-keyframes FadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes FadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@-webkit-keyframes Fadeout {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
@keyframes Fadeout {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
@media screen and (max-width: 767px) {
  /*========================================== 
    Common (SP)
  ========================================== */
  header a:hover, #main a:hover {
    opacity: 1;
  }
  #main {
    max-width: 100%;
    margin: auto;
  }
  #main .-pc,
  #main .-tb {
    display: none !important;
  }
  #main .-sp {
    display: block !important;
  }
  #main .wrap {
    max-width: 76.1538461538vw;
    padding: 0;
  }
  #main img {
    height: auto;
  }
  /*========================================== 
    HEADER (SP)
  ========================================== */
  header .wrap {
    max-width: 100%;
  }
  header .logo {
    width: 8.9743589744vw;
    min-width: auto;
    top: 2.5641025641vw;
    left: 5.3846153846vw;
  }
  /*========================================== 
    MV (SP)
  ========================================== */
  #main .mv {
    background: url("../img/mv_bg-sp.png") top center no-repeat;
    background-size: cover;
    padding: 2.3076923077vw 0 10.5128205128vw;
  }
  #main .mv-head {
    max-width: 100%;
  }
  #main .mv h1 {
    width: 58.4615384615vw;
  }
  #main .mv-pop {
    width: 14.6153846154vw;
    top: 16.6666666667vw;
    left: 5.1282051282vw;
  }
  #main .mv-sub {
    width: 10vw;
    top: 1.0256410256vw;
    right: 4.6153846154vw;
  }
  /*========================================== 
    ANCHOR (SP)
  ========================================== */
  #main .anchor {
    padding: 0;
  }
  #main .anchor::before {
    content: "";
    background: url("../img/light.png") center center no-repeat;
    background-size: 100% 100%;
    width: 80.7692307692vw;
    height: 14.6153846154vw;
  }
  #main .swiper {
    max-width: 100%;
    padding: 2.0512820513vw 5.1282051282vw 3.8461538462vw;
    z-index: 10;
  }
  #main .swiper .swiper-slide {
    width: 64.1025641026vw;
    padding-bottom: 2.5641025641vw;
  }
  #main .swiper .swiper-slide::before {
    width: 64.1025641026vw;
    height: 5.641025641vw;
  }
  #main .swiper .swiper-slide-active {
    -webkit-transform: translateY(0) scale(1);
            transform: translateY(0) scale(1);
  }
  #main .swiper .swiper-button-prev,
  #main .swiper .swiper-button-next {
    top: 46%;
    width: 6.4102564103vw;
    height: 6.4102564103vw;
  }
  #main .swiper .swiper-button-prev {
    left: 5.1282051282vw;
  }
  #main .swiper .swiper-button-next {
    right: 5.1282051282vw;
  }
  /*========================================== 
    EVENT (SP)
  ========================================== */
  #main .event {
    padding: 0 0 25.641025641vw;
  }
  #main .event::after {
    content: "";
    background: url("../img/bg-sp.png") top center no-repeat;
    background-size: 100% auto;
    max-width: 100%;
    height: calc(100% + 45.64103vw);
    top: -45.641025641vw;
  }
  #main .event-item {
    padding-top: 8.9743589744vw;
  }
  #main .event-item + .event-item02 {
    padding-top: 8.9743589744vw;
  }
  #main .event-item + .event-item03 {
    padding-top: 10.7692307692vw;
  }
  #main .event-item + .event-item04 {
    padding-top: 9.7435897436vw;
  }
  #main .event-item + .event-item05 {
    padding-top: 9.4871794872vw;
  }
  #main .event-item + .event-item06 {
    padding-top: 9.2307692308vw;
  }
  #main .event-item + .event-item07 {
    padding-top: 11.7948717949vw;
  }
  #main .event-item + .event-item08 {
    padding-top: 10.7692307692vw;
  }
  #main .event-item button:hover {
    background: rgba(0, 0, 0, 0);
  }
  #main .event-item01 button {
    width: 25.641025641vw;
    height: 25.641025641vw;
  }
  #main .event-item01 .btn01 {
    left: 11.7948717949vw;
    top: 55.3846153846vw;
  }
  #main .event-item01 .btn02 {
    left: 39.7435897436vw;
    top: 55.641025641vw;
  }
  #main .event-item01 .btn03 {
    left: 11.7948717949vw;
    top: 88.4615384615vw;
  }
  #main .event-item02 button {
    width: 31.0256410256vw;
    height: 36.1538461538vw;
  }
  #main .event-item02 .btn04 {
    left: 5.8974358974vw;
    top: 43.0769230769vw;
  }
  #main .event-item03 button {
    width: 33.5897435897vw;
    height: 25.641025641vw;
  }
  #main .event-item03 .btn05 {
    left: 12.3076923077vw;
    top: 58.4615384615vw;
  }
  #main .event-item06 button {
    width: 46.9230769231vw;
    height: 25.641025641vw;
  }
  #main .event-item06 .btn06 {
    left: 15.3846153846vw;
    top: 60.7692307692vw;
  }
  #main .event-item08 .btn07 {
    left: 20px;
    top: 76%;
    width: 87%;
    height: 4%;
  }
  #main .event-item08 .btn08 {
    left: 41.5%;
    top: 87.5%;
    width: 22%;
    height: 4.5%;
  }
  #main .event-item08 .btn09 {
    left: 67%;
    top: 87.5%;
    width: 26.5%;
    height: 4.5%;
  }
  /*========================================== 
    MAP (SP)
  ========================================== */
  #main .map {
    padding: 12.3076923077vw 0 6.9230769231vw;
  }
  #main .map .sup-list {
    display: block;
    margin-top: 1.2820512821vw;
  }
  #main .map .sup-list li {
    font-size: 3.0769230769vw;
    line-height: 1.1666666667;
    padding-left: 3.0769230769vw;
    position: relative;
  }
  #main .map .sup-list li span {
    position: absolute;
    top: 0;
    left: 0;
  }
  #main .map .sup-list.strong li {
    font-size: 3.0769230769vw;
    line-height: 1.4166666667;
  }
  #main .map .col2 {
    display: block;
    margin-top: 1.7948717949vw;
  }
  #main .map .attention {
    width: 100%;
    font-size: 3.3333333333vw;
    line-height: 1.3846153846;
    padding: 0.5128205128vw 2.0512820513vw 1.0256410256vw;
  }
  #main .map .logo {
    width: 34.1025641026vw;
    margin: 2.0512820513vw auto 0;
  }
  /*========================================== 
    MODAL (SP)
  ========================================== */
  #main .modal-wrap {
    padding: 12vw 6vw;
  }
  #main .modal-inner {
    max-width: 85.6vw;
  }
  #main .modal-close {
    top: -10vw;
    right: -5vw;
    width: 8vw;
    height: 8vw;
    font-size: 8vw;
  }
  #main .modal-cont {
    border: solid #221714 0.4vw;
    -webkit-box-shadow: 1.8vw 1.8vw 1.8vw rgba(0, 0, 0, .6);
            box-shadow: 1.8vw 1.8vw 1.8vw rgba(0, 0, 0, .6);
    border-radius: 4.2vw;
    padding: 4.6vw 6vw 6.6vw;
    min-height: 130vw;
  }
  #main .modal-cont h3 {
    width: 16vw;
  }
  #main .modal-cont .profile-img {
    width: 41.4vw;
    margin: 4.6vw auto 0;
  }
  #main .modal-cont .profile-detail {
    margin-top: 4.6vw;
  }
  #main .modal-cont .profile-detail dt {
    font-size: 7.2vw;
  }
  #main .modal-cont .profile-detail dt span {
    font-size: 3.6vw;
  }
  #main .modal-cont .profile-detail dd {
    margin-top: 6vw;
  }
  #main .modal-cont .profile-detail dd p {
    font-size: 3.4vw;
  }
  #main .modal-cont .link {
    margin-top: 7.2vw;
  }
  #main .modal-cont .link + .link {
    margin-top: 3.4vw;
  }
  #main .modal-cont .link dt {
    font-size: 2.2vw;
  }
  #main .modal-cont .link a {
    font-size: 2.8vw;
  }
  #main .modal06 .profile-img {
    width: 100%;
    margin: 13.6vw auto 0;
  }
  #main .pagetop-btn {
    bottom: 3.5897435897vw;
    right: 3.5897435897vw;
  }
  #main .pagetop-btn a {
    width: 13.3333333333vw;
    height: 13.3333333333vw;
  }
  #main .pagetop-btn a::before {
    width: 100%;
    left: 0.7692307692vw;
    top: 0.7692307692vw;
  }
}