@charset "UTF-8";
/* common
================================================== */
/*
 * media query
**/
/**
 * フォントサイズの可変
 *
 * @param {number} $fontsize 基準となるフォントサイズ
 * @param {number} $basewidth 基準となる幅
 * @param {number} $maxwidth フォントサイズの拡大をとめる幅（未指定時は上限なし）
 * @param {number} $minwidth フォントサイズの縮小をとめる幅（未指定時は下限なし）
 */
@media screen and (max-width: 767px) {
  .pc {
    display: none !important;
  }
}

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

/* http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  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;
}

html,
body {
  overscroll-behavior-y: none;
  overscroll-behavior: none;
}

.fixedBody {
  width: 100%;
}

.modal-video {
  background-color: rgba(0, 0, 0, 0.8) !important;
}

.fixbg {
  background-image: url(/assets/img/bg-07.jpg);
  background-size: 100%;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
.fixbg > span {
  display: block;
  position: absolute;
  background-repeat: no-repeat;
  background-size: contain;
}
.fixbg > span:nth-of-type(1) {
  top: 0;
  left: 0;
  background-image: url(/assets/img/hanabi-01.png);
  width: 16.0322108346vw;
  height: 7.467057101vw;
}
.fixbg > span:nth-of-type(2) {
  top: 0;
  right: 0;
  background-image: url(/assets/img/hanabi-02.png);
  width: 7.8330893119vw;
  height: 3.7335285505vw;
  margin-right: 5.4172767204vw;
}
.fixbg > span:nth-of-type(3) {
  bottom: 0;
  right: 0;
  background-image: url(/assets/img/hanabi-03.png);
  width: 6.3689604685vw;
  height: 6.9546120059vw;
}

#main {
  font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  display: block;
  background-image: url(/assets/img/bg.jpg);
  background-position: top center;
  background-size: cover;
  color: #fff;
}
#main * {
  box-sizing: border-box;
}
#main a {
  text-decoration: none;
  color: inherit;
}
@media screen and (min-width: 768px) {
  #main {
    width: 375px;
    margin: 0 auto;
  }
}
#main #kv {
  position: relative;
}
#main #kv .kv-unilogo {
  position: absolute;
  top: 0;
  left: 0;
  margin-top: 15px;
  margin-left: 20px;
  z-index: 2;
  pointer-events: none;
}
@media screen and (max-width: 767px) {
  #main #kv .kv-unilogo {
    margin-top: 4vw;
    margin-left: 5.3333333333vw;
  }
}
#main #kv .kv-unilogo img {
  width: 85px;
}
@media screen and (max-width: 767px) {
  #main #kv .kv-unilogo img {
    width: 22.6666666667vw;
  }
}
#main #kv .kv-highlight {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  pointer-events: none;
}
#main #kv .kv-highlight img {
  width: 100%;
}
#main #kv .kv-ttl {
  text-align: center;
}
@media screen and (min-width: 768px) {
  #main #kv .kv-ttl {
    padding-top: 320px;
    margin-bottom: 27px;
  }
}
@media screen and (max-width: 767px) {
  #main #kv .kv-ttl {
    padding-top: 85.3333333333vw;
    margin-bottom: 7.3333333333vw;
  }
}
@media screen and (min-width: 768px) {
  #main #kv .kv-ttl img {
    width: 321px;
  }
}
@media screen and (max-width: 767px) {
  #main #kv .kv-ttl img {
    width: 85.6vw;
  }
}
#main #kv .kv-btn {
  text-align: center;
}
@media screen and (min-width: 768px) {
  #main #kv .kv-btn a:hover img {
    filter: brightness(1.2);
  }
}
@media screen and (min-width: 768px) {
  #main #kv .kv-btn a img {
    width: 295px;
    transition: all 0.3s ease;
  }
}
@media screen and (max-width: 767px) {
  #main #kv .kv-btn a img {
    width: 78.6666666667vw;
  }
}
#main #campaign {
  background-image: url(/assets/img/bg-02.png);
  background-size: 100% 100%;
}
@media screen and (min-width: 768px) {
  #main #campaign {
    margin: 40px 20px 0;
    padding-bottom: 45px;
    padding-top: 45px;
  }
}
@media screen and (max-width: 767px) {
  #main #campaign {
    margin-top: 10.6666666667vw;
    margin-left: 5.3333333333vw;
    margin-right: 5.3333333333vw;
    padding-bottom: 12vw;
    padding-top: 12vw;
  }
}
#main #campaign h2 {
  text-align: center;
}
@media screen and (min-width: 768px) {
  #main #campaign h2 img {
    width: 270px;
    margin-bottom: 35px;
  }
}
@media screen and (max-width: 767px) {
  #main #campaign h2 img {
    width: 72vw;
    margin-bottom: 9.3333333333vw;
  }
}
@media screen and (min-width: 768px) {
  #main #campaign .campaign-head {
    margin-bottom: 35px;
  }
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-head {
    margin-bottom: 9.3333333333vw;
  }
}
#main #campaign .campaign-head h3 {
  text-align: center;
}
@media screen and (min-width: 768px) {
  #main #campaign .campaign-head h3 {
    margin-bottom: 25px;
  }
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-head h3 {
    margin-bottom: 6.6666666667vw;
  }
}
@media screen and (min-width: 768px) {
  #main #campaign .campaign-head h3 img {
    width: 295px;
  }
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-head h3 img {
    width: 78.6666666667vw;
  }
}
#main #campaign .campaign-head p {
  font-weight: 600;
}
#main #campaign .campaign-head p > span {
  display: block;
  text-align: center;
}
@media screen and (min-width: 768px) {
  #main #campaign .campaign-head p > span.ttl {
    font-size: 19px;
    margin-bottom: 9px;
  }
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-head p > span.ttl {
    font-size: 5.0666666667vw;
    margin-bottom: 2.4vw;
  }
}
@media screen and (min-width: 768px) {
  #main #campaign .campaign-head p > span.date {
    font-size: 19px;
    margin-bottom: 20px;
  }
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-head p > span.date {
    font-size: 5.0666666667vw;
    margin-bottom: 5.3333333333vw;
  }
}
@media screen and (min-width: 768px) {
  #main #campaign .campaign-head p > span.date > span {
    font-size: 12px;
  }
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-head p > span.date > span {
    font-size: 3.2vw;
  }
}
#main #campaign .campaign-head p > span.txt {
  line-height: 1.538;
}
@media screen and (min-width: 768px) {
  #main #campaign .campaign-head p > span.txt {
    font-size: 13px;
  }
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-head p > span.txt {
    font-size: 3.4666666667vw;
  }
}
#main #campaign .campaign-content dl {
  margin: 0 auto;
  background-position: center;
  background-size: 100% 100%;
}
@media screen and (min-width: 768px) {
  #main #campaign .campaign-content dl {
    width: 301px;
    padding: 3px;
    padding-bottom: 0;
  }
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content dl {
    width: 80.2666666667vw;
    padding-left: 0.8vw;
    padding-right: 0.8vw;
    padding-top: 0.8vw;
  }
}
#main #campaign .campaign-content dl.easy {
  background-image: url(/assets/img/frame-01.png);
}
#main #campaign .campaign-content dl.normal {
  margin-top: 50px;
  background-image: url(/assets/img/frame-02.png);
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content dl.normal {
    margin-top: 13.3333333333vw;
  }
}
#main #campaign .campaign-content dl.normal dt {
  background-image: linear-gradient(180deg, rgb(62, 173, 52) 0%, rgb(22, 131, 46) 50%);
}
#main #campaign .campaign-content dl.normal dt img {
  width: 271px;
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content dl.normal dt img {
    width: 72.2666666667vw;
  }
}
#main #campaign .campaign-content dl.hard {
  margin-top: 50px;
  background-image: url(/assets/img/frame-03.png);
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content dl.hard {
    margin-top: 13.3333333333vw;
  }
}
#main #campaign .campaign-content dl.hard dt {
  background-image: linear-gradient(180deg, rgb(154, 69, 214) 0%, rgb(110, 42, 181) 50%);
}
#main #campaign .campaign-content dl.hard dt img {
  width: 269px;
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content dl.hard dt img {
    width: 71.7333333333vw;
  }
}
#main #campaign .campaign-content dl dt {
  text-align: center;
  background-image: linear-gradient(180deg, rgb(0, 150, 228) 0%, rgb(0, 123, 193) 50%);
  display: flex;
  align-items: center;
  justify-content: center;
}
@media screen and (min-width: 768px) {
  #main #campaign .campaign-content dl dt {
    height: 90px;
  }
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content dl dt {
    height: 24vw;
  }
}
@media screen and (min-width: 768px) {
  #main #campaign .campaign-content dl dt img {
    width: 270px;
  }
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content dl dt img {
    width: 72vw;
  }
}
#main #campaign .campaign-content dl dd {
  position: relative;
}
#main #campaign .campaign-content dl dd .line {
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 1;
  pointer-events: none;
}
#main #campaign .campaign-content dl dd .line.easy > span:nth-of-type(4), #main #campaign .campaign-content dl dd .line.easy > span:nth-of-type(5), #main #campaign .campaign-content dl dd .line.easy > span:nth-of-type(6) {
  height: 497px;
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content dl dd .line.easy > span:nth-of-type(4), #main #campaign .campaign-content dl dd .line.easy > span:nth-of-type(5), #main #campaign .campaign-content dl dd .line.easy > span:nth-of-type(6) {
    height: 132.5333333333vw;
  }
}
#main #campaign .campaign-content dl dd .line.normal > span:nth-of-type(1), #main #campaign .campaign-content dl dd .line.normal > span:nth-of-type(2), #main #campaign .campaign-content dl dd .line.normal > span:nth-of-type(3) {
  background-image: url(/assets/img/line-01-normal.png);
}
#main #campaign .campaign-content dl dd .line.normal > span:nth-of-type(4), #main #campaign .campaign-content dl dd .line.normal > span:nth-of-type(5), #main #campaign .campaign-content dl dd .line.normal > span:nth-of-type(6) {
  height: 455px;
  background-image: url(/assets/img/line-02-normal.png);
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content dl dd .line.normal > span:nth-of-type(4), #main #campaign .campaign-content dl dd .line.normal > span:nth-of-type(5), #main #campaign .campaign-content dl dd .line.normal > span:nth-of-type(6) {
    height: 121.3333333333vw;
  }
}
#main #campaign .campaign-content dl dd .line.normal > span:nth-of-type(7) {
  background-image: url(/assets/img/line-03-normal.png);
}
#main #campaign .campaign-content dl dd .line.normal > span:nth-of-type(8) {
  background-image: url(/assets/img/line-04-normal.png);
}
#main #campaign .campaign-content dl dd .line.hard > span:nth-of-type(1), #main #campaign .campaign-content dl dd .line.hard > span:nth-of-type(2), #main #campaign .campaign-content dl dd .line.hard > span:nth-of-type(3) {
  background-image: url(/assets/img/line-01-hard.png);
}
#main #campaign .campaign-content dl dd .line.hard > span:nth-of-type(4), #main #campaign .campaign-content dl dd .line.hard > span:nth-of-type(5), #main #campaign .campaign-content dl dd .line.hard > span:nth-of-type(6) {
  height: 455px;
  background-image: url(/assets/img/line-02-hard.png);
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content dl dd .line.hard > span:nth-of-type(4), #main #campaign .campaign-content dl dd .line.hard > span:nth-of-type(5), #main #campaign .campaign-content dl dd .line.hard > span:nth-of-type(6) {
    height: 121.3333333333vw;
  }
}
#main #campaign .campaign-content dl dd .line.hard > span:nth-of-type(7) {
  background-image: url(/assets/img/line-03-hard.png);
}
#main #campaign .campaign-content dl dd .line.hard > span:nth-of-type(8) {
  background-image: url(/assets/img/line-04-hard.png);
}
#main #campaign .campaign-content dl dd .line > span {
  display: block;
  background-repeat: no-repeat;
  background-size: cover;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
}
#main #campaign .campaign-content dl dd .line > span.active {
  opacity: 1;
}
#main #campaign .campaign-content dl dd .line > span:nth-of-type(1), #main #campaign .campaign-content dl dd .line > span:nth-of-type(2), #main #campaign .campaign-content dl dd .line > span:nth-of-type(3) {
  width: 295px;
  height: 20px;
  background-image: url(/assets/img/line-01.png);
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content dl dd .line > span:nth-of-type(1), #main #campaign .campaign-content dl dd .line > span:nth-of-type(2), #main #campaign .campaign-content dl dd .line > span:nth-of-type(3) {
    width: 78.6666666667vw;
    height: 5.3333333333vw;
  }
}
#main #campaign .campaign-content dl dd .line > span:nth-of-type(1) {
  margin-top: 86px;
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content dl dd .line > span:nth-of-type(1) {
    margin-top: 22.9333333333vw;
  }
}
#main #campaign .campaign-content dl dd .line > span:nth-of-type(2) {
  margin-top: 229px;
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content dl dd .line > span:nth-of-type(2) {
    margin-top: 61.0666666667vw;
  }
}
#main #campaign .campaign-content dl dd .line > span:nth-of-type(3) {
  margin-top: 364px;
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content dl dd .line > span:nth-of-type(3) {
    margin-top: 97.0666666667vw;
  }
}
#main #campaign .campaign-content dl dd .line > span:nth-of-type(4), #main #campaign .campaign-content dl dd .line > span:nth-of-type(5), #main #campaign .campaign-content dl dd .line > span:nth-of-type(6) {
  width: 20px;
  height: 477px;
  background-image: url(/assets/img/line-02.png);
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content dl dd .line > span:nth-of-type(4), #main #campaign .campaign-content dl dd .line > span:nth-of-type(5), #main #campaign .campaign-content dl dd .line > span:nth-of-type(6) {
    width: 5.3333333333vw;
    height: 127.2vw;
  }
}
#main #campaign .campaign-content dl dd .line > span:nth-of-type(4) {
  margin-left: 39px;
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content dl dd .line > span:nth-of-type(4) {
    margin-left: 10.4vw;
  }
}
#main #campaign .campaign-content dl dd .line > span:nth-of-type(5) {
  margin-left: 138px;
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content dl dd .line > span:nth-of-type(5) {
    margin-left: 36.8vw;
  }
}
#main #campaign .campaign-content dl dd .line > span:nth-of-type(6) {
  margin-left: 235px;
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content dl dd .line > span:nth-of-type(6) {
    margin-left: 62.6666666667vw;
  }
}
#main #campaign .campaign-content dl dd .line > span:nth-of-type(7), #main #campaign .campaign-content dl dd .line > span:nth-of-type(8) {
  width: 295px;
  height: 476px;
  background-image: url(/assets/img/line-03.png);
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content dl dd .line > span:nth-of-type(7), #main #campaign .campaign-content dl dd .line > span:nth-of-type(8) {
    width: 78.6666666667vw;
    height: 126.9333333333vw;
  }
}
#main #campaign .campaign-content dl dd .line > span:nth-of-type(8) {
  background-image: url(/assets/img/line-04.png);
}
#main #campaign .campaign-content dl dd .bingo {
  padding-bottom: 16px;
  padding-top: 16px;
  background-color: #000520;
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content dl dd .bingo {
    padding-bottom: 4.2666666667vw;
    padding-top: 4.2666666667vw;
  }
}
#main #campaign .campaign-content dl dd .bingo ul {
  display: flex;
  flex-wrap: wrap;
}
#main #campaign .campaign-content dl dd .bingo ul li {
  width: 33.3333333333%;
  position: relative;
}
#main #campaign .campaign-content dl dd .bingo ul li .missionData {
  position: absolute;
  top: 0;
  left: 0;
  font-size: 10px;
  font-weight: 600;
  margin-top: 36px;
  margin-left: 14px;
  color: #ffd800;
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content dl dd .bingo ul li .missionData {
    font-size: 2.6666666667vw;
    margin-top: 9.6vw;
    margin-left: 3.7333333333vw;
  }
}
#main #campaign .campaign-content dl dd .bingo ul li img {
  max-width: 100%;
  display: block;
}
@media screen and (min-width: 768px) {
  #main #campaign .campaign-content dl dd .bingo ul li .img {
    min-height: 134px;
  }
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content dl dd .bingo ul li .img {
    min-height: 35.7333333333vw;
  }
}
#main #campaign .campaign-content dl dd .bingo ul li:nth-of-type(5) {
  display: flex;
  justify-content: center;
  align-items: center;
}
#main #campaign .campaign-content dl dd .bingo ul li a {
  display: block;
  margin: 0 auto;
}
@media screen and (min-width: 768px) {
  #main #campaign .campaign-content dl dd .bingo ul li a {
    width: 91px;
  }
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content dl dd .bingo ul li a {
    width: 24.2666666667vw;
  }
}
#main #campaign .campaign-content dl dd .bingo ul li a.disabled {
  pointer-events: none;
}
#main #campaign .campaign-content dl dd .rich .rich-accordion {
  position: relative;
}
#main #campaign .campaign-content dl dd .rich .rich-accordion:before, #main #campaign .campaign-content dl dd .rich .rich-accordion:after {
  position: absolute;
  content: "";
  top: 0;
  right: 0;
  background-color: #fff;
  z-index: 1;
}
#main #campaign .campaign-content dl dd .rich .rich-accordion:before {
  top: 50%;
  width: 16px;
  height: 2px;
  margin-top: -1px;
  margin-right: 15px;
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content dl dd .rich .rich-accordion:before {
    width: 4.2666666667vw;
    height: 0.5333333333vw;
    margin-top: -0.5333333333vw;
    margin-right: 4vw;
  }
}
#main #campaign .campaign-content dl dd .rich .rich-accordion:after {
  top: 50%;
  width: 2px;
  height: 16px;
  margin-top: -8px;
  margin-right: 22px;
  transition: all 0.3s ease;
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content dl dd .rich .rich-accordion:after {
    width: 0.5333333333vw;
    height: 4.2666666667vw;
    margin-top: -2.1333333333vw;
    margin-right: 5.8666666667vw;
  }
}
@media screen and (min-width: 768px) {
  #main #campaign .campaign-content dl dd .rich .rich-accordion {
    cursor: pointer;
  }
}
@media screen and (min-width: 768px) {
  #main #campaign .campaign-content dl dd .rich .rich-accordion:hover img {
    filter: brightness(1.2);
  }
}
#main #campaign .campaign-content dl dd .rich .rich-accordion.open:after {
  transform: rotate(90deg);
}
@media screen and (min-width: 768px) {
  #main #campaign .campaign-content dl dd .rich .rich-accordion img {
    width: 296px;
    margin-left: -1px;
    transition: all 0.3s ease;
  }
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content dl dd .rich .rich-accordion img {
    width: 78.9333333333vw;
    margin-left: -0.2666666667vw;
  }
}
#main #campaign .campaign-content dl dd .rich .rich-accordion-content {
  background-color: #fff;
  display: none;
}
@media screen and (min-width: 768px) {
  #main #campaign .campaign-content dl dd .rich .rich-accordion-content {
    padding: 22.5px 17px 35px;
    width: 295px;
    margin-top: -2px;
  }
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content dl dd .rich .rich-accordion-content {
    padding-left: 4.5333333333vw;
    padding-right: 4.5333333333vw;
    padding-top: 6vw;
    padding-bottom: 9.3333333333vw;
    width: 78.6666666667vw;
    margin-top: -0.5333333333vw;
  }
}
#main #campaign .campaign-content dl dd .rich .rich-accordion-content h3 {
  text-align: center;
}
@media screen and (min-width: 768px) {
  #main #campaign .campaign-content dl dd .rich .rich-accordion-content h3 {
    margin-bottom: 17px;
  }
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content dl dd .rich .rich-accordion-content h3 {
    margin-bottom: 4.5333333333vw;
  }
}
@media screen and (min-width: 768px) {
  #main #campaign .campaign-content dl dd .rich .rich-accordion-content h3 img {
    width: 269px;
  }
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content dl dd .rich .rich-accordion-content h3 img {
    width: 71.7333333333vw;
  }
}
#main #campaign .campaign-content dl dd .rich .rich-accordion-content > p {
  color: #010101;
  font-weight: 600;
  font-size: 15px;
  line-height: 1.833;
  text-align: center;
  margin-bottom: 15px;
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content dl dd .rich .rich-accordion-content > p {
    font-size: 4vw;
    margin-bottom: 4vw;
  }
}
#main #campaign .campaign-content dl dd .rich .rich-accordion-content > p > span {
  color: #d40015;
  font-size: 18.5px;
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content dl dd .rich .rich-accordion-content > p > span {
    font-size: 4.9333333333vw;
  }
}
#main #campaign .campaign-content dl dd .rich .rich-accordion-content .rich-img {
  overflow-y: scroll;
}
@media screen and (min-width: 768px) {
  #main #campaign .campaign-content dl dd .rich .rich-accordion-content .rich-img {
    width: 255px;
  }
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content dl dd .rich .rich-accordion-content .rich-img {
    width: 68vw;
  }
}
@media screen and (min-width: 768px) {
  #main #campaign .campaign-content dl dd .rich .rich-accordion-content .rich-img img {
    width: 919px;
  }
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content dl dd .rich .rich-accordion-content .rich-img img {
    width: 245.0666666667vw;
  }
}
@media screen and (min-width: 768px) {
  #main #campaign .campaign-content dl dd .rich .rich-accordion-content .onop {
    margin-top: 22.5px;
  }
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content dl dd .rich .rich-accordion-content .onop {
    margin-top: 6vw;
  }
}
#main #campaign .campaign-content dl dd .rich .rich-accordion-content .onop h4 {
  text-align: center;
  position: relative;
}
#main #campaign .campaign-content dl dd .rich .rich-accordion-content .onop h4 img {
  width: 265px;
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content dl dd .rich .rich-accordion-content .onop h4 img {
    width: 70.6666666667vw;
  }
}
#main #campaign .campaign-content dl dd .rich .rich-accordion-content .onop .onop-txt {
  padding: 25px 20px 20px;
  border-left: 3px solid #0096e4;
  border-right: 3px solid #0096e4;
  border-bottom: 3px solid #0096e4;
  margin-top: -19px;
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content dl dd .rich .rich-accordion-content .onop .onop-txt {
    padding-left: 5.3333333333vw;
    padding-right: 5.3333333333vw;
    border-width: 0.8vw;
    margin-top: -5.0666666667vw;
    padding-top: 6.6666666667vw;
    padding-bottom: 5.3333333333vw;
  }
}
#main #campaign .campaign-content dl dd .rich .rich-accordion-content .onop .onop-txt ul li {
  font-weight: 600;
  color: #010101;
  font-size: 13px;
  position: relative;
  padding-left: 12.5px;
  line-height: 1.53;
  margin-bottom: 5px;
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content dl dd .rich .rich-accordion-content .onop .onop-txt ul li {
    font-size: 3.4666666667vw;
    padding-left: 3.3333333333vw;
    margin-bottom: 1.3333333333vw;
  }
}
#main #campaign .campaign-content dl dd .rich .rich-accordion-content .onop .onop-txt ul li:last-child {
  margin-bottom: 0;
}
#main #campaign .campaign-content dl dd .rich .rich-accordion-content .onop .onop-txt ul li:before {
  content: "・";
  position: absolute;
  left: 0;
  top: 0;
}
#main #campaign .campaign-content .complete {
  padding-top: 30px;
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content .complete {
    padding-top: 8vw;
  }
}
#main #campaign .campaign-content .complete .complete-ttl {
  text-align: center;
}
#main #campaign .campaign-content .complete .complete-ttl.ttl-03 {
  margin-top: 35px;
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content .complete .complete-ttl.ttl-03 {
    margin-top: 9.3333333333vw;
  }
}
#main #campaign .campaign-content .complete .complete-ttl.ttl-04 {
  margin-top: 40px;
  padding-top: 40px;
  position: relative;
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content .complete .complete-ttl.ttl-04 {
    margin-top: 10.6666666667vw;
    padding-top: 10.6666666667vw;
  }
}
#main #campaign .campaign-content .complete .complete-ttl.ttl-04:before {
  content: "";
  position: absolute;
  width: 295px;
  height: 2px;
  background-color: #3e4f70;
  left: 50%;
  top: 0;
  margin-left: -147.5px;
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content .complete .complete-ttl.ttl-04:before {
    width: 78.6666666667vw;
    height: 0.5333333333vw;
    margin-left: -39.3333333333vw;
  }
}
#main #campaign .campaign-content .complete .complete-ttl img {
  width: 276px;
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content .complete .complete-ttl img {
    width: 73.6vw;
  }
}
#main #campaign .campaign-content .complete .complete-btn .note {
  font-size: 10px;
  padding-left: 20px;
  padding-right: 20px;
  margin-top: 15px;
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content .complete .complete-btn .note {
    font-size: 2.6666666667vw;
    margin-top: 4vw;
    padding-left: 5.3333333333vw;
    padding-right: 5.3333333333vw;
  }
}
#main #campaign .campaign-content .complete .complete-btn a {
  display: block;
  margin-top: 14px;
  text-align: center;
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content .complete .complete-btn a {
    margin-top: 3.7333333333vw;
  }
}
#main #campaign .campaign-content .complete .complete-btn a.btn-01 img {
  width: 310px;
  margin-left: 15px;
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content .complete .complete-btn a.btn-01 img {
    width: 82.6666666667vw;
    margin-left: 4vw;
  }
}
#main #campaign .campaign-content .complete .complete-btn a.btn-04 {
  margin-top: 0;
}
@media screen and (min-width: 768px) {
  #main #campaign .campaign-content .complete .complete-btn a:hover img {
    filter: brightness(1.2);
  }
}
#main #campaign .campaign-content .complete .complete-btn a img {
  width: 295px;
}
@media screen and (min-width: 768px) {
  #main #campaign .campaign-content .complete .complete-btn a img {
    transition: all 0.3s ease;
  }
}
@media screen and (max-width: 767px) {
  #main #campaign .campaign-content .complete .complete-btn a img {
    width: 78.6666666667vw;
  }
}
#main #twitterCampaign {
  margin-top: 40px;
}
@media screen and (max-width: 767px) {
  #main #twitterCampaign {
    margin-top: 10.6666666667vw;
  }
}
#main #twitterCampaign .twitterCampaign-head h2 {
  text-align: center;
  margin-bottom: 20px;
}
@media screen and (max-width: 767px) {
  #main #twitterCampaign .twitterCampaign-head h2 {
    margin-bottom: 5.3333333333vw;
  }
}
#main #twitterCampaign .twitterCampaign-head h2 img {
  width: 337px;
}
@media screen and (max-width: 767px) {
  #main #twitterCampaign .twitterCampaign-head h2 img {
    width: 89.8666666667vw;
  }
}
#main #twitterCampaign .twitterCampaign-head p {
  font-weight: 600;
}
#main #twitterCampaign .twitterCampaign-head p > span {
  display: block;
  text-align: center;
}
@media screen and (min-width: 768px) {
  #main #twitterCampaign .twitterCampaign-head p > span.ttl {
    font-size: 19px;
    margin-bottom: 9px;
  }
}
@media screen and (max-width: 767px) {
  #main #twitterCampaign .twitterCampaign-head p > span.ttl {
    font-size: 5.0666666667vw;
    margin-bottom: 2.4vw;
  }
}
@media screen and (min-width: 768px) {
  #main #twitterCampaign .twitterCampaign-head p > span.date {
    font-size: 19px;
    margin-bottom: 20px;
  }
}
@media screen and (max-width: 767px) {
  #main #twitterCampaign .twitterCampaign-head p > span.date {
    font-size: 5.0666666667vw;
    margin-bottom: 5.3333333333vw;
  }
}
@media screen and (min-width: 768px) {
  #main #twitterCampaign .twitterCampaign-head p > span.date > span {
    font-size: 12px;
  }
}
@media screen and (max-width: 767px) {
  #main #twitterCampaign .twitterCampaign-head p > span.date > span {
    font-size: 3.2vw;
  }
}
#main #twitterCampaign .twitterCampaign-head p > span.txt {
  margin-top: 20px;
  text-align: center;
}
@media screen and (max-width: 767px) {
  #main #twitterCampaign .twitterCampaign-head p > span.txt {
    margin-top: 5.3333333333vw;
  }
}
#main #twitterCampaign .twitterCampaign-head p > span.txt img {
  width: 272px;
}
@media screen and (max-width: 767px) {
  #main #twitterCampaign .twitterCampaign-head p > span.txt img {
    width: 72.5333333333vw;
  }
}
#main #twitterCampaign .twitterCampaign-panel {
  margin-top: 37.5px;
}
@media screen and (min-width: 768px) {
  #main #twitterCampaign .twitterCampaign-panel {
    padding: 0 20px;
  }
}
@media screen and (max-width: 767px) {
  #main #twitterCampaign .twitterCampaign-panel {
    margin-top: 10vw;
  }
}
@media screen and (min-width: 768px) {
  #main #twitterCampaign .twitterCampaign-panel .ownlyUgcWidget_block .ownlyUgcsetPost {
    width: 150px;
  }
}
@media screen and (min-width: 768px) {
  #main #twitterCampaign .twitterCampaign-panel .ownlyUgcWidget_block .ownlyUgcsetPostPhoto {
    width: 150px;
    height: 150px;
  }
}
@media screen and (min-width: 768px) {
  #main #twitterCampaign .twitterCampaign-panel img.ownlyPostImage {
    width: 150px;
    height: 150px;
  }
}
#main #twitterCampaign .twitterCampaign-panel .ownlyUgcWidget_block .ownlyUgcsetPostComment {
  color: #fff;
}
#main #twitterCampaign .twitterCampaign-panel .ownlyUgcWidget_block .ownlyUgc {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
}
#main #twitterCampaign .twitterCampaign-panel .ownlyUgcWidget_block div.ownlyUgcPagination a.ugcPaging {
  text-transform: uppercase;
  background-color: #ad001d;
  border: none;
}
#main #twitterCampaign .twitterCampaign-method {
  margin-top: 40px;
  text-align: center;
}
@media screen and (max-width: 767px) {
  #main #twitterCampaign .twitterCampaign-method {
    margin-top: 10.6666666667vw;
  }
}
#main #twitterCampaign .twitterCampaign-method h4 {
  position: relative;
}
#main #twitterCampaign .twitterCampaign-method h4 img {
  width: 335px;
}
@media screen and (max-width: 767px) {
  #main #twitterCampaign .twitterCampaign-method h4 img {
    width: 89.3333333333vw;
  }
}
#main #twitterCampaign .twitterCampaign-method h4 a {
  position: absolute;
  display: block;
  top: 0;
  left: 50%;
  width: 262px;
  height: 30px;
  margin-top: 36px;
  transform: translateX(-50%);
}
@media screen and (max-width: 767px) {
  #main #twitterCampaign .twitterCampaign-method h4 a {
    width: 69.8666666667vw;
    height: 8vw;
    margin-top: 9.6vw;
  }
}
#main #twitterCampaign .twitterCampaign-method a {
  margin-top: 22.5px;
  display: block;
  text-align: center;
}
@media screen and (max-width: 767px) {
  #main #twitterCampaign .twitterCampaign-method a {
    margin-top: 7.3333333333vw;
  }
}
#main #twitterCampaign .twitterCampaign-method a img {
  width: 295px;
}
@media screen and (max-width: 767px) {
  #main #twitterCampaign .twitterCampaign-method a img {
    width: 78.6666666667vw;
  }
}
#main #twitterCampaign .twitterCampaign-banner {
  margin-top: 45px;
}
@media screen and (max-width: 767px) {
  #main #twitterCampaign .twitterCampaign-banner {
    margin-top: 12vw;
  }
}
#main #twitterCampaign .twitterCampaign-banner a {
  display: block;
  text-align: center;
}
#main #twitterCampaign .twitterCampaign-banner a img {
  width: 335px;
}
@media screen and (max-width: 767px) {
  #main #twitterCampaign .twitterCampaign-banner a img {
    width: 89.3333333333vw;
  }
}
#main #movie {
  border-bottom: 5px solid #ea808a;
}
@media screen and (min-width: 768px) {
  #main #movie {
    padding-top: 60px;
    padding-bottom: 65px;
  }
}
@media screen and (max-width: 767px) {
  #main #movie {
    padding-top: 16vw;
    padding-bottom: 17.3333333333vw;
    border-bottom-width: 1.3333333333vw;
  }
}
#main #movie h2 {
  text-align: center;
}
@media screen and (min-width: 768px) {
  #main #movie h2 img {
    width: 104px;
    margin-bottom: 25px;
  }
}
@media screen and (max-width: 767px) {
  #main #movie h2 img {
    width: 27.7333333333vw;
    margin-bottom: 6.6666666667vw;
  }
}
#main #movie .movie-list ul li {
  margin-bottom: 15px;
}
@media screen and (max-width: 767px) {
  #main #movie .movie-list ul li {
    margin-bottom: 4vw;
  }
}
#main #movie .movie-list ul li:last-child {
  margin-bottom: 0;
}
#main #movie .movie-list ul li a {
  display: block;
  padding-left: 20px;
  padding-right: 20px;
}
@media screen and (max-width: 767px) {
  #main #movie .movie-list ul li a {
    padding-left: 5.3333333333vw;
    padding-right: 5.3333333333vw;
  }
}
#main #movie .movie-list ul li a img {
  width: 100%;
}
#main #movie .movie-list dl {
  display: flex;
  flex-direction: column-reverse;
}
@media screen and (min-width: 768px) {
  #main #movie .movie-list dl {
    margin-bottom: 25px;
  }
}
@media screen and (max-width: 767px) {
  #main #movie .movie-list dl {
    margin-bottom: 6.6666666667vw;
  }
}
#main #movie .movie-list dl:last-child {
  margin-bottom: 0;
}
#main #movie .movie-list dl dt h3 {
  line-height: 1.25;
  font-weight: 600;
}
@media screen and (min-width: 768px) {
  #main #movie .movie-list dl dt h3 {
    font-size: 16px;
    margin-top: 15px;
  }
}
@media screen and (max-width: 767px) {
  #main #movie .movie-list dl dt h3 {
    font-size: 4.2666666667vw;
    margin-top: 4vw;
  }
}
#main #movie .movie-list dl dd {
  position: relative;
}
#main #movie .movie-list dl dd .movieThumb.hide {
  opacity: 0;
  pointer-events: none;
}
#main #movie .movie-list dl dd img {
  cursor: pointer;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  display: block;
}
@media screen and (min-width: 768px) {
  #main #movie .movie-list dl dd img {
    width: 335px;
    transition: filter 0.3s ease;
  }
}
@media screen and (max-width: 767px) {
  #main #movie .movie-list dl dd img {
    width: 89.3333333333vw;
  }
}
@media screen and (min-width: 768px) {
  #main #movie .movie-list dl dd img:hover {
    filter: brightness(1.2);
  }
}
#main #movie .movie-list dl dd iframe {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (min-width: 768px) {
  #main #movie .movie-list dl dd iframe {
    width: 335px;
    height: 190px;
  }
}
@media screen and (max-width: 767px) {
  #main #movie .movie-list dl dd iframe {
    width: 89.3333333333vw;
    height: 50.6666666667vw;
  }
}
#main #unimarket {
  background-color: #fff;
  padding-top: 40px;
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 30px;
  border-bottom: 5px solid #ea808a;
}
@media screen and (max-width: 767px) {
  #main #unimarket {
    padding-top: 10.6666666667vw;
    padding-left: 5.3333333333vw;
    padding-right: 5.3333333333vw;
    padding-bottom: 8vw;
    border-bottom-width: 1.3333333333vw;
  }
}
#main #unimarket .unimarket-wrap h2 {
  text-align: center;
}
#main #unimarket .unimarket-wrap h2 img {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (min-width: 768px) {
  #main #unimarket .unimarket-wrap h2 img {
    width: 225px;
  }
}
@media screen and (max-width: 767px) {
  #main #unimarket .unimarket-wrap h2 img {
    width: 73.3333333333vw;
  }
}
#main #unimarket .unimarket-wrap h2 span {
  display: block;
  font-weight: 600;
  color: #000;
  line-height: 1.3;
  font-size: 23px;
  margin-top: 15px;
}
@media screen and (max-width: 767px) {
  #main #unimarket .unimarket-wrap h2 span {
    font-size: 6.1333333333vw;
    margin-top: 4vw;
  }
}
#main #unimarket .unimarket-wrap .unimarket-banner {
  margin-top: 28px;
}
@media screen and (max-width: 767px) {
  #main #unimarket .unimarket-wrap .unimarket-banner {
    padding-top: 7.4666666667vw;
  }
}
#main #unimarket .unimarket-wrap .unimarket-banner a img {
  width: 100%;
}
#main footer {
  padding-top: 57px;
}
@media screen and (max-width: 767px) {
  #main footer {
    padding-top: 15.2vw;
  }
}
#main footer .footer-link {
  padding: 0 20px;
}
@media screen and (max-width: 767px) {
  #main footer .footer-link {
    padding-left: 5.3333333333vw;
    padding-right: 5.3333333333vw;
  }
}
#main footer .footer-link h2 {
  text-align: center;
  margin-bottom: 25px;
}
@media screen and (max-width: 767px) {
  #main footer .footer-link h2 {
    padding-bottom: 6.6666666667vw;
  }
}
@media screen and (min-width: 768px) {
  #main footer .footer-link h2 img {
    width: 127px;
  }
}
@media screen and (max-width: 767px) {
  #main footer .footer-link h2 img {
    width: 33.8666666667vw;
  }
}
#main footer .footer-link .footer-link-banner ul li:last-child a {
  margin-bottom: 0;
}
#main footer .footer-link .footer-link-banner ul li a {
  display: block;
  margin-bottom: 15px;
}
@media screen and (max-width: 767px) {
  #main footer .footer-link .footer-link-banner ul li a {
    margin-bottom: 4vw;
  }
}
#main footer .footer-link .footer-link-banner ul li a img {
  width: 100%;
}
#main footer .footer-link .footer-link-sns {
  display: flex;
  justify-content: center;
  padding-top: 39px;
  padding-right: 20px;
  padding-left: 20px;
  padding-bottom: 58px;
}
@media screen and (max-width: 767px) {
  #main footer .footer-link .footer-link-sns {
    padding-left: 5.3333333333vw;
    padding-right: 5.3333333333vw;
    padding-top: 10.2666666667vw;
    padding-top: 15.3333333333vw;
  }
}
#main footer .footer-link .footer-link-sns .panel {
  width: 50%;
}
#main footer .footer-link .footer-link-sns .panel:first-child {
  border-right: 1px solid #fff;
}
#main footer .footer-link .footer-link-sns .panel h3 {
  color: #fff;
  font-weight: 600;
  text-align: center;
  line-height: 1.3;
}
@media screen and (min-width: 768px) {
  #main footer .footer-link .footer-link-sns .panel h3 {
    font-size: 16px;
    margin-bottom: 15px;
  }
}
@media screen and (max-width: 767px) {
  #main footer .footer-link .footer-link-sns .panel h3 {
    font-size: 4.2666666667vw;
    margin-bottom: 4vw;
  }
}
#main footer .footer-link .footer-link-sns .panel ul {
  display: flex;
  justify-content: center;
}
@media screen and (min-width: 768px) {
  #main footer .footer-link .footer-link-sns .panel ul li {
    margin-right: 7.5px;
  }
}
@media screen and (max-width: 767px) {
  #main footer .footer-link .footer-link-sns .panel ul li {
    margin-right: 2vw;
  }
}
#main footer .footer-link .footer-link-sns .panel ul li:last-child {
  margin-right: 0;
}
#main footer .footer-link .footer-link-sns .panel ul li a {
  display: block;
}
@media screen and (min-width: 768px) {
  #main footer .footer-link .footer-link-sns .panel ul li a {
    width: 50px;
    transition: filter 0.3s ease;
  }
}
@media screen and (max-width: 767px) {
  #main footer .footer-link .footer-link-sns .panel ul li a {
    width: 13.3333333333vw;
  }
}
@media screen and (min-width: 768px) {
  #main footer .footer-link .footer-link-sns .panel ul li a:hover {
    filter: brightness(1.2);
  }
}
#main footer .footer-link .footer-link-sns .panel ul li a img {
  width: 100%;
  display: block;
}
@media screen and (min-width: 768px) {
  #main footer .footer-copy {
    padding-bottom: 15px;
  }
}
@media screen and (max-width: 767px) {
  #main footer .footer-copy {
    padding-bottom: 4vw;
  }
}
#main footer .footer-copy p {
  color: #fff;
  font-weight: 500;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media screen and (min-width: 768px) {
  #main footer .footer-copy p {
    font-size: 12px;
  }
}
@media screen and (max-width: 767px) {
  #main footer .footer-copy p {
    font-size: 3.2vw;
  }
}
#main footer .footer-copy p > span {
  font-weight: 300;
}
@media screen and (min-width: 768px) {
  #main footer .footer-copy p > span {
    font-size: 24px;
  }
}
@media screen and (max-width: 767px) {
  #main footer .footer-copy p > span {
    font-size: 6.4vw;
  }
}
#main #modal {
  position: fixed;
  z-index: 100;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 30px;
  overflow: auto;
  background-color: rgba(0, 0, 0, 0.7);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
}
@media screen and (max-width: 767px) {
  #main #modal {
    padding-top: 8vw;
    padding-bottom: 8vw;
    padding-left: 4vw;
    padding-right: 4vw;
  }
}
#main #modal.show {
  opacity: 1;
  pointer-events: visible;
}
#main #modal .modal-wrapper {
  margin-top: auto;
  margin-bottom: auto;
}
@media screen and (min-width: 768px) {
  #main #modal .modal-wrapper {
    width: 445px;
    margin-left: auto;
    margin-right: auto;
    padding: 0 50px;
  }
}
@media screen and (max-width: 767px) {
  #main #modal .modal-wrapper {
    width: 92vw;
  }
}
#main #modal .modal-wrapper .modal-content {
  position: relative;
  background-image: url(/assets/img/bg-07.png);
  background-position: top center;
  background-size: 100%;
  overflow: hidden;
}
@media screen and (min-width: 768px) {
  #main #modal .modal-wrapper .modal-content {
    padding-top: 40px;
    padding-bottom: 40px;
  }
}
@media screen and (max-width: 767px) {
  #main #modal .modal-wrapper .modal-content {
    padding-top: 10.6666666667vw;
    padding-bottom: 10.6666666667vw;
  }
}
#main #modal .modal-wrapper .modal-content:before {
  background: linear-gradient(180deg, rgb(1, 11, 49) 0%, rgb(11, 48, 142) 50%, rgb(2, 20, 70) 100%);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: "";
  pointer-events: none;
  z-index: -1;
}
#main #modal .modal-wrapper .modal-content:after {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: "";
  background-position: top center;
  background-size: 100% 100%;
  background-image: url(/assets/img/frame-04.png);
  pointer-events: none;
}
#main #modal .modal-wrapper .modal-content .modal-close {
  position: absolute;
  top: 0;
  right: 0;
  margin-top: 15px;
  margin-right: 15px;
}
@media screen and (max-width: 767px) {
  #main #modal .modal-wrapper .modal-content .modal-close {
    margin-top: 4vw;
    margin-right: 4vw;
  }
}
#main #modal .modal-wrapper .modal-content .modal-close a img {
  width: 16px;
}
@media screen and (max-width: 767px) {
  #main #modal .modal-wrapper .modal-content .modal-close a img {
    width: 4.2666666667vw;
  }
}
#main #modal .modal-wrapper .modal-content h2 {
  text-align: center;
  position: relative;
}
#main #modal .modal-wrapper .modal-content h2:before {
  content: "";
  top: 0;
  left: 0;
  width: 219px;
  height: 102px;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  background-image: url(/assets/img/hanabi.png);
  position: absolute;
  margin-top: -71px;
  margin-left: -13px;
  z-index: -1;
}
@media screen and (max-width: 767px) {
  #main #modal .modal-wrapper .modal-content h2:before {
    width: 58.4vw;
    height: 27.2vw;
    margin-top: -18.9333333333vw;
    margin-left: -3.4666666667vw;
  }
}
#main #modal .modal-wrapper .modal-content h2 img {
  width: 309px;
}
@media screen and (max-width: 767px) {
  #main #modal .modal-wrapper .modal-content h2 img {
    width: 82.4vw;
  }
}
#main #modal .modal-wrapper .modal-content h2 > a {
  position: absolute;
  top: 0;
  left: 50%;
  width: 240px;
  height: 28px;
  margin-top: 98px;
  margin-left: -120px;
}
@media screen and (max-width: 767px) {
  #main #modal .modal-wrapper .modal-content h2 > a {
    width: 64vw;
    height: 7.4666666667vw;
    margin-top: 26.1333333333vw;
    margin-left: -32vw;
  }
}
#main #modal .modal-wrapper .modal-content > p {
  margin-top: 30px;
  margin-bottom: 27px;
}
@media screen and (max-width: 767px) {
  #main #modal .modal-wrapper .modal-content > p {
    margin-top: 8vw;
    margin-bottom: 7.3333333333vw;
  }
}
#main #modal .modal-wrapper .modal-content > p > span {
  display: block;
  text-align: center;
  font-weight: 600;
}
#main #modal .modal-wrapper .modal-content > p > span.ttl {
  font-size: 17px;
  margin-bottom: 15px;
}
@media screen and (max-width: 767px) {
  #main #modal .modal-wrapper .modal-content > p > span.ttl {
    font-size: 4.6666666667vw;
    margin-bottom: 4vw;
  }
}
#main #modal .modal-wrapper .modal-content > p > span.date {
  font-size: 17px;
}
@media screen and (max-width: 767px) {
  #main #modal .modal-wrapper .modal-content > p > span.date {
    font-size: 4.6666666667vw;
  }
}
#main #modal .modal-wrapper .modal-content > p > span.date > span {
  font-size: 12px;
  font-weight: 400;
}
@media screen and (max-width: 767px) {
  #main #modal .modal-wrapper .modal-content > p > span.date > span {
    font-size: 3.2vw;
  }
}
#main #modal .modal-wrapper .modal-content .modal-content-wallp {
  margin-bottom: 45px;
}
@media screen and (max-width: 767px) {
  #main #modal .modal-wrapper .modal-content .modal-content-wallp {
    margin-bottom: 12vw;
  }
}
#main #modal .modal-wrapper .modal-content .modal-content-wallp:last-child {
  margin-bottom: 0;
}
#main #modal .modal-wrapper .modal-content .modal-content-wallp h4 {
  display: block;
  text-align: center;
  border: 1px solid #fff;
  padding: 7px 0;
  margin: 0 20px 30px;
  font-weight: 600;
}
@media screen and (max-width: 767px) {
  #main #modal .modal-wrapper .modal-content .modal-content-wallp h4 {
    padding-top: 2vw;
    padding-bottom: 2vw;
    margin-left: 5.3333333333vw;
    margin-right: 5.3333333333vw;
    margin-bottom: 8vw;
  }
}
#main #modal .modal-wrapper .modal-content .modal-content-wallp .modal-img {
  text-align: center;
  margin-bottom: 30px;
}
@media screen and (max-width: 767px) {
  #main #modal .modal-wrapper .modal-content .modal-content-wallp .modal-img {
    margin-bottom: 8vw;
  }
}
#main #modal .modal-wrapper .modal-content .modal-content-wallp .modal-img img {
  width: 178px;
}
@media screen and (max-width: 767px) {
  #main #modal .modal-wrapper .modal-content .modal-content-wallp .modal-img img {
    width: 47.4666666667vw;
  }
}
#main #modal .modal-wrapper .modal-content .modal-content-wallp .modal-content-copy {
  display: flex;
  justify-content: center;
  align-items: center;
}
#main #modal .modal-wrapper .modal-content .modal-content-wallp .modal-content-copy p {
  width: 212px;
  height: 29px;
  background-color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #010101;
  font-weight: 600;
  font-size: 15px;
}
@media screen and (max-width: 767px) {
  #main #modal .modal-wrapper .modal-content .modal-content-wallp .modal-content-copy p {
    width: 55.2vw;
    height: 7.8666666667vw;
    font-size: 4.1333333333vw;
  }
}
#main #modal .modal-wrapper .modal-content .modal-content-wallp .modal-content-copy a {
  display: block;
}
#main #modal .modal-wrapper .modal-content .modal-content-wallp .modal-content-copy a img {
  display: block;
  width: 100px;
  height: 31px;
}
@media screen and (max-width: 767px) {
  #main #modal .modal-wrapper .modal-content .modal-content-wallp .modal-content-copy a img {
    width: 26.6666666667vw;
    height: 8.2666666667vw;
  }
}
#main #modalBig {
  position: fixed;
  z-index: 100;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 30px;
  overflow: auto;
  background-color: rgba(0, 0, 0, 0.7);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
}
@media screen and (max-width: 767px) {
  #main #modalBig {
    padding-top: 8vw;
    padding-bottom: 8vw;
    padding-left: 4vw;
    padding-right: 4vw;
  }
}
#main #modalBig.show {
  opacity: 1;
  pointer-events: visible;
}
#main #modalBig .modalBig-wrapper {
  margin-top: auto;
  margin-bottom: auto;
}
@media screen and (min-width: 768px) {
  #main #modalBig .modalBig-wrapper {
    width: 360px;
    margin-left: auto;
    margin-right: auto;
    padding: 0 50px;
  }
}
@media screen and (max-width: 767px) {
  #main #modalBig .modalBig-wrapper {
    width: 74.6666666667vw;
    margin-left: auto;
    margin-right: auto;
  }
}
#main #modalBig .modalBig-wrapper .modalBig-content {
  position: relative;
  background-color: #000;
}
@media screen and (min-width: 768px) {
  #main #modalBig .modalBig-wrapper .modalBig-content {
    padding-top: 50px;
    padding-bottom: 30px;
  }
}
@media screen and (max-width: 767px) {
  #main #modalBig .modalBig-wrapper .modalBig-content {
    padding-top: 9.3333333333vw;
    padding-bottom: 8vw;
  }
}
#main #modalBig .modalBig-wrapper .modalBig-content .modalBig-close {
  position: absolute;
  top: 0;
  right: 0;
  margin-top: 15px;
  margin-right: 15px;
}
@media screen and (max-width: 767px) {
  #main #modalBig .modalBig-wrapper .modalBig-content .modalBig-close {
    margin-top: 4vw;
    margin-right: 4vw;
  }
}
#main #modalBig .modalBig-wrapper .modalBig-content .modalBig-close a img {
  width: 16px;
}
@media screen and (max-width: 767px) {
  #main #modalBig .modalBig-wrapper .modalBig-content .modalBig-close a img {
    width: 4.2666666667vw;
  }
}
#main #modalBig .modalBig-wrapper .modalBig-content .modalBig-img {
  text-align: center;
}
@media screen and (min-width: 768px) {
  #main #modalBig .modalBig-wrapper .modalBig-content .modalBig-img img {
    width: 196px;
  }
}
@media screen and (max-width: 767px) {
  #main #modalBig .modalBig-wrapper .modalBig-content .modalBig-img img {
    width: 52.2666666667vw;
  }
}