@charset "UTF-8";
/* CSS Document */

@media screen and (max-width: 1100px) {
  html { scroll-behavior: smooth; scroll-padding-top: 180px; }
  .l-content { overflow: visible; }
}
@media screen and (max-width: 750px) {
  html { scroll-behavior: smooth; scroll-padding-top: 15vw; }
}

#pokemon2026 { font-family: -apple-system, BlinkMacSystemFont, Roboto, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "游ゴシック体", "Yu Gothic", YuGothic, sans-serif; width: min(100%,750px); margin: 0 auto; }
#pokemon2026 img { width: 100%; height: auto; }
#pokemon2026 a img { cursor: pointer; }
.target {  }

body.preload { overflow: hidden; }
#loading { width: 100%; height: 100%; background: rgba(255,255,255,1); position: fixed; top: 0; left: 0; z-index: 3000; }
.load-anime { width: 100px; height: 100px; margin: auto; position: absolute; inset: 0; }
.load-anime .dot { display: inline-block; width: 20px; height: 20px; border-radius: 50%; background-color: #333; opacity: 0; position: absolute; top: 50%; left: 50%;
  --angle: calc(360deg / 8 * var(--index));
  --x: calc(cos(var(--angle)) * 50px);
  --y: calc(sin(var(--angle)) * 50px);
  translate: calc(var(--x) - 50%) calc(var(--y) - 50%);
  --duration: 0.8s;
  --delay: calc(var(--duration) * var(--index) / 8);
  animation: animate var(--duration) var(--delay) infinite ease-in-out;
}
@keyframes animate {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    transform: scale(0.7);
  }
}
#loading.complete, #loading.complete .load-anime, #loading.complete .load-anime .dot { pointer-events: none; }



#pc-bg { width: 100%; height: 100svh; position: absolute; background: url("../images/sky.jpg") no-repeat bottom center; background-size: cover; position: fixed; top: 0; left: 0; z-index: -1; }
.side-area { width: calc((100% - 750px) / 2); height: 100svh; display: flex; align-items: center; justify-content: center; position: fixed; top: 0; }
#side-left { left: 0; }
#side-right { right: 0; }
.side-area dl dt, .side-area #side-image { width: min(90%,600px); margin: 0 auto; }
.side-area dl dd { width: 90%; margin: 0 auto; }
.side-area dl dd h3 { width: min(90%,300px); margin: 0 auto; padding: 2% 0 4% 0; }
.side-area dl dd ul { width: min(90%,300px); margin: 0 auto; }
.side-area dl dd ul li { padding-bottom: 2px; }
.side-area dl dd ul li a { border-radius: .5rem; display: block; transition: 0s; cursor: pointer; }
.side-area dl dd ul li a i, .side-area dl dd ul li a span { display: none; visibility: hidden; }
.side-area dl dd ul li a:hover { background: #06C; }
.side-area dl dd ul li:first-child a { background: #D00; box-shadow: .3rem .3rem .4rem rgba(0,0,0,.3); }
.side-area dl dd ul li:first-child a:hover { background: #900; box-shadow: .2rem .2rem .2rem rgba(0,0,0,.5); }
.side-area dl dd ul li#side-menu1.active a {}
.side-area dl dd ul li#side-menu2.active a strong, .side-area dl dd ul li#side-menu3.active a strong, .side-area dl dd ul li#side-menu4.active a strong, .side-area dl dd ul li#side-menu5.active a strong { display: none; visibility: hidden; }
.side-area dl dd ul li#side-menu2.active a span, .side-area dl dd ul li#side-menu3.active a span, .side-area dl dd ul li#side-menu4.active a span, .side-area dl dd ul li#side-menu5.active a span { display: block; visibility: visible; }
.side-area dl dd ul li a.active { background: #D00; }
.side-item.hidden { opacity: 0; transition: opacity 0s; }
.side-item.show { opacity: 1; transition: opacity 0s; }
.side-area #side-eng { width: min(60%,200px); margin: 1rem auto 0 auto; }
.side-area #side-eng img { width: min(45%,100px); }
.side-area #side-eng a { text-align: center; padding: .5rem 0; border-radius: 2rem; background: #FFF; display: block; }
.side-area #side-eng a:hover { background: #FF0; }
@media screen and (max-width: 1100px) {
  .side-area dl, .side-area div { width: 0; height: 0; display: none; visibility: hidden; }
}
@media screen and (max-width: 750px) {
  #pc-bg { width: 0; height: 0; display: none; visibility: hidden; }
}

#pokemon2026 article { width: min(100%,750px); margin: 0 auto; position: relative; }

/* Slide Column */
#period { padding: 1rem 0 3rem 0; background: url("../images/period_bg.jpg") no-repeat center center; background-size: cover; }
.slide-dots ul.slick-dots { text-align: center; padding-bottom: 2rem; }
.slide-dots ul.slick-dots li { display: inline-block; }
.slide-dots ul.slick-dots button { font-size: 0; width: 15px; height: 15px; margin: 0 10px; padding: 0; border: 0; border-radius: 50%; background: rgba(255,255,255,.8); display: block; outline: none; cursor: pointer; }
.slide-dots ul.slick-dots button:hover { background: rgba(255,255,255,1); }
.slide-dots ul.slick-dots .slick-active button { background: #FF0; }
#period #period2 { width: min(80%,450px); margin: 0 auto; }
@media screen and (max-width: 750px) {
  #period { padding: 1rem 0 2rem 0; }
  .slide-dots ul.slick-dots { padding-bottom: 1.5rem; }
  #period dl dt img { width: 30%; }
}

#sp-menubox { width: 100%; height: 0; display: none; visibility: hidden; position: absolute; }
#sp-menubox.sp-fix { position: sticky; top: 0; left: 0; box-shadow: 0 0 .3rem rgba(0,0,0,.2); z-index: 100; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); -webkit-backface-visibility: hidden; backface-visibility: hidden; overflow: hidden; }
.sp-menu { background: #FE0; }
.sp-menu ul { width: 94%; margin: 0 auto; padding: .8rem 0; display: flex; flex-wrap: wrap; justify-content: space-between; }
.sp-menu ul li { width: calc(100% / 3); }
.sp-menu ul li#sp01 { width: 100%; }
.sp-menu ul li#sp05 { width: calc((100% / 3) * 2); }
.sp-menu ul li a { display: block; }
.sp-menu ul li a:hover img { opacity: .9; }
@media screen and (max-width: 1100px) {
  #sp-menubox { height: auto; display: block; visibility: visible; position: relative; }
}

#xlink { background: #C4D700; padding: 2.5% 0; }
#xlink div { width: 86%; margin: 0 auto; }
#xlink div a { text-align: center; border-radius: 1rem; background: #008F43; box-shadow: .4rem .4rem .15rem rgba(0,0,0,.3); display: block; transition: .3s; }
#xlink div a:hover { background: #009F43; box-shadow: .3rem .3rem .15rem rgba(0,0,0,.4); }
@media screen and (max-width: 750px) {
  #xlink.x-fix { /* padding-top: calc(2.5% + 80px); */ }
  #xlink div { width: 94%; }
  #xlink div a { box-shadow: .2rem .2rem .15rem rgba(0,0,0,.3); }
  #xlink div a:hover { box-shadow: .15rem .15rem .15rem rgba(0,0,0,.4); }
}

@media screen and (max-width: 750px) {
  .target { content: ""; margin-top: -9vw; padding-top: 9vw; display: block; visibility: hidden; }
}

#rules { background: #FF9; }
.inner-box { width: 86%; margin: 0 auto; padding: 2rem 0; }
.rules-column { margin-bottom: 1.5rem; padding: 1rem; border: solid 2px #D00; border-radius: 1rem; background: #FFF; }
#rule1 { padding: 0; }
.rules-column:nth-last-of-type(1) { margin-bottom: 0; }
.rules-column h2 { padding: .6rem 1rem; border-radius: .8rem .8rem 0 0; background: #D00; }
.rules-column p { padding: 1rem 1rem; }
#rule1 h2 { padding: 1rem 1rem; }
#rule2 ul { padding-top: 1rem; display: flex; justify-content: space-between; }
#rule2 ul li { width: 48%; }
#rule2 ul li a { border-radius: .6rem; background: #B28146; box-shadow: .3rem .3rem .3rem rgba(0,0,0,.4); display: block; transition: .3s; }
#rule2 ul li a:hover { background: #963; box-shadow: .2rem .2rem .2rem rgba(0,0,0,.6); }
#rule3 h3 { padding-bottom: 1rem; }
#rule3 dl { border: solid 2px #D00; border-radius: .8rem; }
#rule3 dl dt { padding: 1rem 0; background: #D00; }
#rule3 dl dd { padding: 1rem; }
#rule3 dl dd ul { margin-bottom: 2rem; display: flex; justify-content: space-between; position: relative; }
#rule3 dl dd ul::after { content: ""; width: 2px; height: 100%; background: #D00; position: absolute; top: 0; left: 50%; transform: translateX(-1px); }
#rule3 dl dd ul li { width: 48%; }
#rule3 dl dd ul li dl { border: none; }
#rule3 dl dd ul li dl dt { padding: 0; border-radius: .6rem; background: #09E; box-shadow: .3rem .3rem .3rem rgba(0,0,0,.4); }
#rule3 dl dd ul li:first-child dl dt { background: #094; }
#rule3 dl dd ul li dl dd { width: 80%; margin: 0 auto; padding: 1.5rem 0 0 0; }
#rule3 dl dd ul li dl dd .coupon { padding-bottom: 1rem; }
#rule3 dl dd h4 { margin: 2rem 0 1rem 0; border-radius: .6rem; background: #D00; box-shadow: .3rem .3rem .3rem rgba(0,0,0,.4); }
#rule3 #add-line { padding: 1rem 0; }
#rule3 .attention { padding: 1rem 1rem 0 1rem; border-top: solid 2px #D00; }
#rule3 .notes { padding: 2rem 1rem 1rem 1rem; }
@media screen and (max-width: 750px) {
  .inner-box { width: 92%; padding: 1.5rem 0; }
  .rules-column { margin-bottom: 1rem; padding: .8rem; }
  .rules-column h2 { padding: 0 .6rem .4rem .6rem; }
  .rules-column p { padding: .6rem; }
  #rule1 h2 { padding: .6rem 1rem .2rem 1rem; }
  #rule2 ul { padding-top: .6rem; }
  #rule2 ul li { width: 49%; }
  #rule2 ul li a { box-shadow: .2rem .2rem .2rem rgba(0,0,0,.4); }
  #rule3 h3 { }
  #rule3 dl dt { padding: .4rem 0 .6rem 0; }
  #rule3 dl dd { padding: .8rem; }
  #rule3 dl dd h4 { margin: 1rem 0 .6rem 0; }
  #rule3 .attention { padding: .5rem 0 0 0; }
  #rule3 .notes { padding: 1.5rem 0 1rem 0; }
}


.background1, #tickets { background: #EA5846; background: linear-gradient(-45deg, #584C9D 0%, #FFF 50%, #EA5846 100%); }
.background2 { background: #003D96; background: linear-gradient(-45deg, #003D96 0%, #1EAEDE 30%, #FFF 50%, #1EAEDE 70%, #003D96 100%); }
.background3 { background: #FEA; background: url("../images/bg_stripe.jpg") repeat-y; background-size: 100% auto; }
.bg-ball { background: url("../images/bg_ball.png"); background-size: 100% auto; }
.bg-scroll { width: 86%; margin: 0 auto; padding: 2% 0 1% 0; background: url("../images/scroll_bg_middle.png") repeat-y; background-size: 100% auto; position: relative; }
.scroll-inner { width: 90%; margin: 0 auto; position: relative; }

#entry1 .bg-ball { padding-top: 3rem; }
#areamap { margin-top: 3rem; scroll-margin-top: 200px; }
#areamap::before { content: ""; width: 100%; height: 0; padding-top: 30px; background: url("../images/scroll_bg_top.png") no-repeat; background-size: 100% auto; position: absolute; top: -30px; }
.background2 .bg-ball { padding-bottom: 3rem; }
.background2 .bg-scroll { margin-bottom: 3rem; padding-top: 2rem; }
.background2 .bg-scroll::after { content: ""; width: 100%; height: 0; padding-bottom: 40px; background: url("../images/scroll_bg_bottom.png") no-repeat; background-size: 100% auto; position: absolute; bottom: -40px; }
#enjoy { padding-bottom: 3rem; }
#enjoy .bg-scroll { margin: 3rem auto; }
#enjoy .bg-scroll::before { content: ""; width: 100%; height: 0; padding-top: 30px; background: url("../images/scroll_bg_top.png") no-repeat; background-size: 100% auto; position: absolute; top: -30px; }
#enjoy .bg-scroll::after { content: ""; width: 100%; height: 0; padding-bottom: 40px; background: url("../images/scroll_bg_bottom.png") no-repeat; background-size: 100% auto; position: absolute; bottom: -40px; }
@media screen and (max-width: 750px) {
  .bg-scroll { width: 94%; padding: 1.5rem 0; }
  #areamap { margin-top: 1rem; }
  #areamap::before { top: -18px; }
  #enjoy .bg-scroll { margin-top: 1rem; padding-top: 0; }
  #enjoy .bg-scroll::before { top: -18px; }
}

#areamap #map { width: 90%; margin: 0 auto; position: relative; }
#areamap #map ul { width: 100%; height: 0; padding-top: 102.25%; position: absolute; top: 0; }
#areamap #map ul li { width: 16%; position: absolute; }
#areamap #map ul li:first-child { bottom: 26%; left: -3%; }
#areamap #map ul li:last-child { bottom: 6%; right: -3%; }
#areamap #location-btn { width: 90%; margin: 2.5% auto; }
#areamap #location-btn a { border-radius: 1rem; background: #7D6954; box-shadow: .3rem .3rem .3rem rgba(0,0,0,.4); display: block; transition: .3s; }
#areamap #location-btn a:hover { box-shadow: .2rem .2rem .2rem rgba(0,0,0,.6); }

#goal2 { padding-top: 0; }
.goal-column { width: 90%; margin: 0 auto 2rem auto; padding: 2rem; border: solid 2px #A15E3C; border-radius: 2rem; background: #FFF; }
.goal-column h2 { margin-bottom: 1rem; border-radius: 1rem; background: #B2793E; background: linear-gradient(90deg, #B2793E 0%, #CCA26A 25%, #F0BA73 50%, #CCA26A 75%, #B2793E 100%); }
.goal-column ul { display: flex; flex-wrap: wrap; justify-content: space-between; }
.goal-column ul li { width: 48%; padding-bottom: 2rem; }
.goal-column ul li:first-child { width: 100%; }
.goal-column ul li dl dt { margin-bottom: 1rem; border-radius: .5rem; background: #B2793E; background: linear-gradient(90deg, #B2793E 0%, #CCA26A 25%, #F0BA73 50%, #CCA26A 75%, #B2793E 100%); }
.goal-column .stationmap { margin-bottom: 2rem; border: solid 2px #A15E3C; }
.goal-column .goal-btn { padding-bottom: 2rem; }
.goal-column .goal-btn a { border-radius: 1rem; background: #D00; box-shadow: .3rem .3rem .3rem rgba(0,0,0,.4); display: block; transition: .3s; }
.goal-column .goal-btn a:hover { box-shadow: .2rem .2rem .2rem rgba(0,0,0,.6); }
@media screen and (max-width: 750px) {
  #goal1 { padding-top: 0; }
  #goal2 { margin-bottom: 0; }
  .goal-column { margin-bottom: 1rem; padding: 1rem; }
  .goal-column ul li { padding-bottom: .5rem; }
  .goal-column ul li dl dt { margin-bottom: 0; }
  .goal-column .stationmap { margin-bottom: 1rem; }
  .goal-column .goal-btn { padding-bottom: 1rem; }
}


/* Entry Course */
#entry-course { padding-bottom: 2rem; }
#entry-course h2 { padding-bottom: 2rem; }
.entry-column { }
.course-frame { padding: 2rem .5rem 1.5rem .5rem; background: url("../images/course_frame.png") no-repeat; background-size: 100% 100%; }
.course-foot { line-height: 0em; height: auto; margin: 0; padding: 0; }
.prize-inner { width: min(92%,515px); margin: 0 auto; }
.prize-btn { padding-top: 2rem; }
.prize-btn a { border-radius: 1rem; background: #D00; box-shadow: .3rem .3rem .3rem rgba(0,0,0,.4); display: block; transition: .3s; }
.prize-btn a:hover { box-shadow: .2rem .2rem .2rem rgba(0,0,0,.6); }
#entry-book ul { display: flex; justify-content: space-between; position: relative; }
#entry-book ul::after { content: ""; width: 2px; height: 100%; background: #A15E3C; position: absolute; top: 0; left: 50%; transform: translateX(-50%); }
#entry-book ul li { width: 48%; position: relative; }
#entry-book ul li .link-btn { width: min(94%,260px); position: absolute; left: 0; bottom: 0; }
#entry-book ul li .link-btn a { border-radius: 1rem; background: #D00; box-shadow:  .3rem .3rem .3rem rgba(0,0,0,.4); display: block; transition: .3s; }
#entry-book ul li .link-btn a:hover { box-shadow: .2rem .2rem .2rem rgba(0,0,0,.6); }
#entry6 .prize-inner { padding-top: 2rem; }
@media screen and (max-width: 750px) {
  #entry-course { padding-bottom: 1rem; }
  #entry-course h2 { padding-bottom: 1rem; }
}

#shinkansen-column {  }
.shinkansen-frame { padding: 2rem 2rem 1.5rem 2rem; background: url("../images/shinkansen_frame.png") no-repeat; background-size: 100% 100%; }
#shinkansen-prize { padding: 2rem; border: solid 2px #09D; border-radius: 1rem; }
#shinkansen-prize .attention { padding-top: 2rem; }
#shinkansen-prize .link-btn { padding: 1.5rem 0 .5rem 0; }
#shinkansen-prize .link-btn a { border-radius: 1rem; background: #D00; box-shadow:  .3rem .3rem .3rem rgba(0,0,0,.4); display: block; transition: .3s; }
#shinkansen-prize .link-btn a:hover { box-shadow: .2rem .2rem .2rem rgba(0,0,0,.6); }
#shinkansen-map h4 { margin: 2rem 0; border-radius: 1rem; background: #09D; }
@media screen and (max-width: 750px) {
  .shinkansen-frame { padding: 1rem 1rem .5rem 1rem; }
  #shinkansen-prize { padding: 1rem; }
  #shinkansen-map h4 { margin: 1rem 0; }
}


/* Tickets*/
#tickets { padding: 4rem 0 3rem 0; background-size: cover; }
#ticket-list { width: 86%; margin: 2rem auto; padding: 6% 0 1% 0; border: solid 2px #6FBA2C; border-radius: 2rem; background: #FFF; position: relative; }
#ticket-list h2 { width: 90%; position: absolute; top: 0; left: 50%; transform: translate(-50%,-50%); }
#ticket-list ul { width: 90%; margin: 0 auto; display: flex; flex-wrap: wrap; justify-content: space-between; }
#ticket-list ul li { width: 48%; margin-bottom: 3%; }
#ticket-list ul li a { padding: .5rem .3rem; border: solid 2px #6FBA2C; border-radius: 1rem; background: #FFF; box-shadow: .4rem .4rem .15rem rgba(0,0,0,.3); display: block; transition: .3s; }
#ticket-list ul li a img { transition: .3s; }
#ticket-list ul li a:hover { box-shadow: .3rem .3rem .15rem rgba(0,0,0,.4); }
#ticket-list ul li a:hover img { opacity: .8; }
#advice-btn { width: 86%; margin: 0 auto; }
#advice-btn a { border: solid 2px #FFF; border-radius: 1.5rem; background: #6FBA2C; box-shadow: .4rem .4rem .15rem rgba(0,0,0,.3); display: block; transition: .3s; }
#advice-btn a:hover { box-shadow: .3rem .3rem .15rem rgba(0,0,0,.4); }
@media screen and (max-width: 750px) {
  #ticket-list { width: 94%; margin: 0 auto 1rem auto; }
  #advice-btn { width: 94%; }
}


/* Enjoy */
#enjoy h2 { padding: 1rem 0 2rem 0; }
.enjoy-column { margin-bottom: 2rem; position: relative; }

#sp-book .inner-box { width: 100%; padding: 2rem 2rem 1rem 2rem; background: url("../images/enjoy1_frame.png") no-repeat; background-size: 100% 100%; }
.enjoy-foot { line-height: 0rem; }
#sp-book h4 { margin-bottom: 2rem; border-radius: 1rem; background: #094; }
#sp-book #newdays { padding: 2rem 0; display: flex; flex-wrap: wrap; justify-content: space-between; }
#sp-book #newdays h4 { width: 100%; }
#sp-book #newdays ul#shoplist1 { width: 44.5%; }
#sp-book #newdays ul#shoplist2 { width: 51.5%; }
#sp-book #newdays ul li { padding-bottom: 1.2rem; }
#sp-book #newdays ul li a dl dt { padding-bottom: .1rem; transition: .3s; }
#sp-book #newdays ul li a dl dd { font-size: min(2.1vw,1.5rem); line-height: 1.3; text-decoration: underline; color: #122E8A; transition: .3s; }
#sp-book #newdays ul li a:hover dl dt { opacity: .8; }
#sp-book .link-btn {}
#sp-book .link-btn a { border-radius: 1rem; background: #D00; box-shadow:  .3rem .3rem .3rem rgba(0,0,0,.4); display: block; transition: .3s; }
#sp-book .link-btn a:hover { box-shadow: .2rem .2rem .2rem rgba(0,0,0,.6); }
#captain .link-btn { width: 53%; position: absolute; left: 4.5%; bottom: 6%; }
#captain .link-btn a { border-radius: 1rem; background: #00A0E9; box-shadow:  .3rem .3rem .3rem rgba(0,0,0,.4); display: block; transition: .3s; }
#captain .link-btn a:hover { box-shadow: .2rem .2rem .2rem rgba(0,0,0,.6); }
#stack .inner-box { width: 100%; padding: 2rem 2rem 1rem 2rem; background: url("../images/enjoy5_frame.png") no-repeat; background-size: 100% 100%; }
#stack ul li:first-child { margin-bottom: 2rem; }
#reserve .inner-box { width: 100%; padding: 2rem 2rem 1rem 2rem; background: url("../images/enjoy7_frame.png") no-repeat; background-size: 100% 100%; }
#reserve dl dt { padding-bottom: 1rem; }
#reserve dl dd ul li { padding-top: 1rem; }
#reserve dl dd ul li a { border-radius: 1rem; background: #06B; box-shadow: .3rem .3rem .3rem rgba(0,0,0,.4); display: block; transition: .3s; }
#reserve dl dd ul li a:hover { background: #05A; box-shadow: .2rem .2rem .2rem rgba(0,0,0,.6); }
#honda .inner-box { width: 100%; background: url("../images/enjoy8_frame.png") no-repeat; background-size: 100% 100%; }
#honda .inner-box dl { width: 94%; margin: 1rem auto; }
#honda .inner-box dt { padding-bottom: 1rem; }
#honda .inner-box dd a { border-radius: 1rem; background: #E20314; box-shadow:  .3rem .3rem .3rem rgba(0,0,0,.4); display: block; transition: .3s; }
#honda .inner-box dd a:hover { box-shadow: .2rem .2rem .2rem rgba(0,0,0,.6); }
@media screen and (max-width: 750px) {
  #sp-book .inner-box, #stack .inner-box { padding: 1rem 1.5rem .5rem 1.5rem; }
  #sp-book h4 { margin-bottom: 1rem; }
  #sp-book #newdays ul#shoplist1, #sp-book #newdays ul#shoplist2 { width: 100%; }
  #sp-book #newdays ul#shoplist1 dl dt { width: 86.8%; }
  #sp-book #newdays ul li a dl dd { font-size: 4.2vw; line-height: 1.3; }
  #sp-book #newdays ul#shoplist2 li:last-child { padding-bottom: 0rem; }
  #honda .inner-box dl { width: 90%; margin: 0 auto; }
}

/* TV PR */
#wonder { background: #FFF; }
#wonder a img { transition: .3s; }
#wonder a:hover img { opacity: .8; }


/* Frienda */
#frienda { padding: 4rem 0 2rem 0; background: #FE0; }
#frienda h2 { width: min(90%,650px); margin: 0 auto; border-radius: 1rem; background: #D00; position: relative; }
#frienda h2 strong { width: 13.5%; height: auto; position: absolute; top: 40%; right: 3%; transform: translateY(-50%); }
#frienda dl { width: min(90%,650px); margin: 0 auto; display: flex; align-items: stretch; justify-content: space-between; }
#frienda dl dt { width: 51%; margin-left: -4%; }
#frienda dl dd { width: 52%; position: relative; }
#frienda dl dd p { padding: 7% 0 5% 0; }
#frienda dl dd .link-btn {}
#frienda dl dd .link-btn a { border-radius: 1rem; background: #D00; box-shadow: .3rem .3rem .3rem rgba(0,0,0,.4); display: block; transition: .3s; }
#frienda dl dd .link-btn a:hover { box-shadow: .2rem .2rem .2rem rgba(0,0,0,.6); }
#frienda dl dd .copyright { width: 120%; position: absolute; right: 0; bottom: 5%; }
@media screen and (max-width: 750px) {
  #frienda { padding: 2rem 0 1rem 0; }
}

#notes { background: #FFF; }
#notes .inner-box { width: 86%; margin: 0 auto; padding: 4rem 0; }
#notes ul { padding-bottom: 1.5rem; }
#notes ul li { font-size: min(2.1vw,1.5rem); line-height: 1.4; font-weight: bold; text-align: justify; padding-bottom: .1rem; }
#notes ul.attention li { text-indent: -1em; padding-left: 1em; }
#notes ul li i { font-style: normal; }
#notes ul li i::before { content: "\A"; white-space: pre; }
#notes ul li a { color: #0AE; text-decoration: underline; }
#notes ul li a:hover { color: #D00; }
#notes ul.overview li { padding-left: 6em; position: relative; }
#notes ul.overview li h4 { width: 5em; text-align-last: justify; position: absolute; left: 0; }
#notes ul.overview li span { position: absolute; left: 5em; }
#notes p { font-size: min(2.1vw,1.5rem); line-height: 1.4; font-weight: bold; }
@media screen and (max-width: 750px) {
  #notes .inner-box { width: 92%; margin: 0 auto; padding: 2rem 0; }
}


/* Modal Window */
html.modalset { overflow: hidden; }
.modalwindow { width: 100%; height: 100vh; position: fixed; top: 0; left: 0; z-index: 9999; display: none; }
.modal-wrap { text-align: center; width: 100%; height: 100%; padding: 20px; overflow: auto; -webkit-overflow-scrolling: touch; -ms-overflow-style: none; overflow: -moz-scrollbars-none; white-space: nowrap; }
.modal-wrap::-webkit-scrollbar { display: none; }
.modal-wrap:after { content: ''; width: 1px; height: 100%; vertical-align: middle; display: inline-block; }
.modal-background { width: 100%; height: 100%; background: rgba(0,0,0,.8); position: fixed; top: 0; left: 0; }
.modal-box { width: min(94%,900px); vertical-align: middle; display: inline-block; position: relative; }
#modal-coupon .modal-box { width: min(90%,600px); }
.modal-box .inner { text-align: left; padding: 1rem; background: #FFF; border-radius: 2rem; }
.modal-box .inner > :first-child { margin-top: 0; }
#modal-image { position: relative; }
#modal-image a { width: 42%; height: 26%; display: block; position: absolute; top: 51%; left: 6% }
.modal-box .modal-close { width: 44px; height: 44px; position: absolute; top: -5px; right: -5px; }
.modal-box .modal-close ul { width: 100%; height: 100%; border: solid 2px #FFF; border-radius: 50%; background: #7A6A56; position: relative; }
.modal-box .modal-close ul li { width: 80%; height: 3px; background: #FFF; position: absolute; top: 50%; left: 50%; }
.modal-box .modal-close ul li:first-child { transform: translate(-50%,-50%) rotate(45deg); }
.modal-box .modal-close ul li:last-child { transform: translate(-50%,-50%) rotate(-45deg); }