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

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

#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 div { width: min(90%,600px); margin: 0 auto; }
.side-area dl dd { width: 90%; margin: 0 auto; }
.side-area dl dd h3 { width: min(80%,300px); margin: 0 auto; padding: 4% 0 6% 0; }
.side-area dl dd ul {}
.side-area dl dd ul li { font-size: min(1.8rem,1.4vw); line-height: 1.3; font-weight: bold; text-align: center; padding-bottom: .4rem; }
.side-area dl dd ul li a { color: #000; transition: 0s; }
.side-area dl dd ul li a:hover { color: #C00; }
.side-area dl dd ul li#side-menu2.active a, .side-area dl dd ul li#side-menu3.active a, .side-area dl dd ul li#side-menu4.active a, .side-area dl dd ul li#side-menu5.active a { color: #C00; }
.side-area dl dd ul li a.active { color: #C00; text-decoration: underline; }
.side-item.hidden { opacity: 0; transition: opacity 0s; }
.side-item.show { opacity: 1; transition: opacity 0s; }
@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; }
}

#pokemon2025 main { width: min(100%,750px); margin: 0 auto; position: relative; }
#rally-news { font-size: 1.6rem; line-height: 1.4; font-weight: bold; text-align: center; padding: 1.4rem 0 1.2rem 0; background: #FFF; }
#rally-news strong { font-size: 110%; line-height: 1.4; vertical-align: middle; color: #E00; }

/* 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 dl { width: min(80%,450px); margin: 0 auto; }
#period dl dt { text-align: center; }
#period dl dt img { width: 20%; }
@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%; display: none; }
.sp-menubox.sp-fix { position: fixed; 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: 31%; margin-bottom: 2.5%; filter: drop-shadow(.4rem .4rem .15rem rgba(0,0,0,.3)); }
.sp-menu ul li#sp04 { width: 65.5%; }
.sp-menu ul li:nth-child(n + 4) { margin-bottom: 0; }
.sp-menu ul li a { height: 0; padding-top: 25%; clip-path: polygon(5% 0,95% 0,100% 20%,100% 80%,95% 100%,5% 100%,0 80%,0 20%); box-shadow: .5rem .5rem .3rem rgba(0,0,0,.2); display: block; position: relative; } 
.sp-menu ul li a img { max-width: 90%; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); }
.sp-menu ul li#sp01 a { background: #7D6954; }
.sp-menu ul li#sp02 a { background: #009143; }
.sp-menu ul li#sp03 a { background: #0095D7; }
.sp-menu ul li#sp04 a { padding-top: 11.8%; background: #F08300; clip-path: polygon(2.5% 0,97.5% 0,100% 20%,100% 80%,97.5% 100%,2.5% 100%,0 80%,0 20%); }
.sp-menu ul li#sp05 a { background: #FFF; }
@media screen and (max-width: 750px) {
  .sp-menubox { display: block; }
  .sp-menu { min-height: 80px; display: flex; align-items: center; justify-content: center; }
  .sp-menu ul li { filter: drop-shadow(.2rem .2rem .15rem rgba(0,0,0,.3)); }
}

#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); }
}

#stamparea { padding-top: 3%; background: url("../images/area_bg.jpg") repeat-y; background-size: 100% auto; }

#areamap { width: 86%; margin: 25px auto 0 auto; padding-top: 2%; background: url("../images/scroll_bg_middle.png") repeat-y; background-size: 100% auto; position: relative; }
#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; }
#areamap #map { width: 92%; margin: 0 auto; }
#areamap #location-btn { width: 90%; margin: 2.5% auto; }
#areamap #location-btn a { border-radius: 1rem; background: #7D6954; display: block; }
#areamap #newdays { width: 90%; margin: 0 auto; padding: 2rem; border: solid 2px #009242; border-radius: 1rem; background: #FFF; }
#areamap #newdays dl dd { padding-top: 2rem; }
#areamap #newdays dl dd h3 { width: min(80%,330px); margin: 0 auto; padding-bottom: 1.5rem; }
#areamap #newdays dl dd ul#newday-list li { padding-bottom: 2rem; }
#areamap #newdays dl dd .link-button { width: min(90%,440px); margin: 0 auto; }
#areamap #newdays dl dd .link-button a { margin-bottom: 2rem; border-radius: 1rem; background: #094; box-shadow: .4rem .4rem .15rem rgba(0,0,0,.3); display: block; transition: .3s; }
#areamap #newdays dl dd .link-button a:hover { background: #009F43; box-shadow: .3rem .3rem .15rem rgba(0,0,0,.4); }
#areamap #newdays dl dd ul.attention li { line-height: 1.4; text-align: justify; text-indent: -1em; padding: 0 0 .2em 1em; }
#areamap #tokyo-sta { width: 90%; margin: 2rem auto 0 auto; border: solid 2px #CCA26A; border-radius: 1rem; background: #FFF; padding: 2rem; }
#areamap #tokyo-sta dl dd { padding-top: 2rem; }
#areamap #tokyo-sta dl dd .map { padding: 2rem 0 1rem 0; }
#areamap #tokyo-sta dl dd .link-button { width: 100%; margin: 0 auto; }
#areamap #tokyo-sta dl dd .link-button a { margin-bottom: 2rem; border-radius: 1rem; background: #E60012; box-shadow: .4rem .4rem .15rem rgba(0,0,0,.3); display: block; transition: .3s; }
#areamap #tokyo-sta dl dd .link-button a:hover { background: #F00; box-shadow: .3rem .3rem .15rem rgba(0,0,0,.4); }
#areamap #tokyo-sta dl dd ul.attention li { line-height: 1.4; text-align: justify; text-indent: -1em; padding: 0 0 .2em 1em; }
@media screen and (max-width: 750px) {
  #areamap { width: 94%; }
  #areamap { margin: 12px auto 0 auto; }
  #areamap::before { padding-top: 12px; top: -12px; }
  #areamap #newdays, #areamap #tokyo-sta { padding: 1rem; }
  #areamap #newdays dl dd h3 { padding-bottom: .8rem; }
  #areamap #newdays dl dd, #areamap #tokyo-sta dl dd { padding-top: 1rem; }
  #areamap #newdays dl dd ul#newday-list li { padding-bottom: 1rem; }
  #areamap #tokyo-sta dl dd .map { padding: 1rem 0; }
}

#entry-stage { width: 86%; margin: 0 auto; padding: 2rem 0 1rem 0;  background: url("../images/scroll_bg_middle.png") repeat-y; background-size: 100% auto; }
#entry-stage .inner-box { width: 90%; margin: 0 auto; }
#entry-stage .inner-box h2 { margin-bottom: 2rem; }
#entry-stage .inner-box h3 { width: min(90%,490px); margin: 1rem auto 1.5rem auto; }
@media screen and (max-width: 750px) {
  #entry-stage { width: 94%; }
  #entry-stage .inner-box h2 { margin-bottom: 1rem; }
}

#entry-extra { padding-bottom: 3rem; background: url("../images/extra_bg.jpg") no-repeat; background-size: cover; }
#entry-extra .scroll-bg { width: 86%; margin: 0 auto; padding-top: 1rem; background: url("../images/scroll_bg_middle.png") repeat-y; background-size: 100% auto; }
#entry-extra .inner-box { width: 90%; margin: 0 auto; }
#entry-extra #extra-panel { padding: 2rem 0 0 0; }
#entry-extra .scroll-bottom { width: 86%; margin: 0 auto; }
@media screen and (max-width: 750px) {
  #entry-extra .scroll-bg { width: 94%; }
  #entry-extra #extra-panel { padding: 2rem 0 .2rem 0; }
  #entry-extra .scroll-bottom { width: 94%; margin-top: -.2rem; }
}

#ticket { padding: 3rem 0; background: url("../images/ticket_bg.jpg") no-repeat; 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; }
#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 { padding: 4rem 0; background: url("../images/enjoy_bg.jpg"); }
#enjoy h2 { width: 86%; margin: 0 auto; padding-bottom: 2rem; position: relative; }
#enjoy h2 strong { width: 60%; margin: 0 auto; display: block; }
#enjoy h2 .title-left { width: 19%; display: block; position: absolute; top: -2%; left: -2%; }
#enjoy h2 .title-right { width: 17%; display: block; position: absolute; bottom: -4%; right: 0; }
#enjoy-box { width: 86%; margin: 0 auto; }
#enjoy-box .scroll-bg { padding: 3rem 0 1rem 0; background: url("../images/scroll_bg_middle.png") repeat-y; background-size: 100% auto; }
.enjoy-column { width: 90%; margin: 0 auto 6rem auto; border: solid 2px #094; border-radius: 2rem; background: #FFF; position: relative; }
.enjoy-column .inner-box { padding: 10% 5% 5% 5%; }
#special-book { border-color: #094; }
#sunvisor { border-color: #F39800; }
#wrapped-train { border-color: #45B035; }
#takeshiba { border-color: #036EB8; }
#pokemon-goods { margin-bottom: 0; border-color: #E60012; }
.enjoy-column h3 { width: 90%; position: absolute; top: 0; left: 50%; transform: translate(-50%,-50%); }
.enjoy-column ul.attention li { line-height: 1.4; text-align: justify; text-indent: -1em; padding: 0 0 .2em 1em; }

#special-book dl { padding: 2rem 0; }
#special-book dl dt { padding-bottom: 1rem; }
#special-book dl dd { display: flex; flex-wrap: wrap; justify-content: space-between; }
#special-book dl dd ul#splist1 { width: 42.3%; }
#special-book dl dd ul#splist2 { width: 51.6%; }
#special-book dl dd ul li { padding-bottom: .6rem; }
#special-book dl dd ul li:last-child { padding-bottom: 0; }
#takeshiba dl#takeshiba01 { padding-bottom: 2rem; }
#takeshiba dl dt { padding-bottom: 1rem; }
#takeshiba dl dd { position: relative; }
#takeshiba dl dd .link-btn { width: min(60%,300px); position: absolute; bottom: 3rem; }
#takeshiba dl dd .link-btn a { border-radius: 1.5rem; background: #036EB8; box-shadow: .4rem .4rem .15rem rgba(0,0,0,.3); display: block; transition: .3s; }
#takeshiba dl dd .link-btn a:hover { background: #07B; box-shadow: .3rem .3rem .15rem rgba(0,0,0,.4); }
#sunvisor .inner-box div { padding-bottom: .3rem; }
#wrapped-train .inner-box div { padding-bottom: .5rem; }
#wrapped-train .inner-box div#wrapped-detail { padding-bottom: 2.5rem; }
@media screen and (max-width: 750px) {
  #enjoy { padding: 2rem 0; }
  #enjoy h2 { width: 94%; padding-bottom: 1rem; }
  #enjoy-box { width: 94%; }
  .enjoy-column { margin: 0 auto 4rem auto; }
  #special-book dl dd { flex-direction: column; }
  #special-book dl dd ul#splist1 { width: 82%; }
  #special-book dl dd ul#splist2 { width: 100%; }
  #special-book dl dd ul li { padding-bottom: .4rem; }
  #special-book dl dd ul#splist1 li:last-child { padding-bottom: .4rem; }
  #takeshiba dl dd .link-btn { bottom: 1.5rem; }
}

#pokemon-pr { background: linear-gradient(135deg,#EF7E25 0%,#F2922E 15%,#94C648 35%,#00AA83 50%,#009DD3 65%,#B873A9 80%,#E73683 100%); }
#pokemon-pr dl { width: 84%; margin: 0 auto; padding: 4rem 0 2rem 0; }
#pokemon-pr dl dd h2 { width: min(90%,420px); margin: 0 auto; padding: 1rem 0 .5rem 0; }
#pokemon-pr dl dd p.copyright { width: 80%; margin: 0 auto; padding: .5rem 0 1rem 0; }
#pokemon-pr dl dd ul { width: 40%; margin: 0 auto; display: flex; justify-content: space-between; }
#pokemon-pr dl dd ul li { width: 49%; }
#pokemon-pr dl dd p.link-btn { width: 55%; margin: 2rem auto 0 auto; }
#pokemon-pr dl dd p.link-btn a { background: #FFF; border-radius: 1rem; box-shadow: .4rem .4rem .15rem rgba(0,0,0,.3); display: block; transition: .3s; }
#pokemon-pr dl dd p.link-btn a:hover { background: #FF9; box-shadow: .3rem .3rem .15rem rgba(0,0,0,.4); }

#frienda { padding: 5rem 0 3rem 0; background: #FFE100; }
#frienda h2 { width: 86%; margin: 0 auto; padding-bottom: .5rem; position: relative; }
#frienda h2 strong { width: 18%; position: absolute; top: -4.5rem; right: 1rem; }
#frienda dl { width: 90%; margin: 0 auto; padding-right: 2%; display: flex; justify-content: space-between; }
#frienda dl dt { width: 46%; }
#frienda dl dd { width: 52%; }
#frienda dl dd p { padding: 10% 0 5% 0; }
#frienda dl dd .link-btn a { border-radius: 1rem; background: #E60012; box-shadow: .4rem .4rem .15rem rgba(0,0,0,.3); display: block; transition: .3s; }
#frienda dl dd .link-btn a:hover { background: #F00; box-shadow: .3rem .3rem .15rem rgba(0,0,0,.4); }
#frienda .copyright { text-align: right; width: 86%; margin: 0 auto; }
#frienda .copyright img { width: 65%; height: auto; }

#note { padding: 5% 7%; background: #FFF; }
#note ul { padding-bottom: 1rem; }
#note ul.attention li { text-align: justify; text-indent: -1em; padding: 0 0 .2em 1em; }
#note ul.support li { padding: 0 0 .2em 6em; position: relative; }
#note ul.support li span { text-align: justify; text-align-last: justify; width: 5em; position: absolute; left: 0; }
#note ul.support li i { font-style: normal; position: absolute; left: 5em; }
@media screen and (max-width: 750px) {
  #note { padding: 4% 3%; }
}

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(100%,900px); vertical-align: middle; display: inline-block; position: relative; }
.modal-box .inner { text-align: left; padding: 1rem; background: #FFF; border-radius: 2rem; }
.modal-box .inner > :first-child { margin-top: 0; }
.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); }