@charset "utf-8";
html[lang="ja"] {
  margin: 0 !important;
}
body {
  background: #FBE600;
  font-size: 3.733vw;
}
body.nav--open {
  overflow: hidden;
}
.pc-only {
  display: none !important;
}
#wpadminbar {
  display: none !important;
}
@media all and (min-width:501px) {
  body {
    font-size: 18px;
  }
}
#calpas_fall {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  z-index: -2;
  pointer-events: none;
}
#calpas_fall .calpas {
  background-size: 60% auto;
  background-repeat: no-repeat;
  background-position: center center;
  position: absolute;
  -webkit-animation: animate-leaf 8s linear;
  animation: animate-leaf 8s linear;
}
#calpas_fall .calpas01 {
  background-image: url("../img/calpas01.svg");
}
#calpas_fall .calpas02 {
  background-image: url("../img/calpas02.svg");
}
#calpas_fall .calpas03 {
  background-image: url("../img/calpas03.svg");
}
.hiddenText {
  font-family: 'DF-MaruMojiSQ-W12';
  display: none;
}
/* == parts ============================================== */
.anime--scall {
  transition: all .7s;
  opacity: 0;
  transform: scale(.8);
  transition-timing-function: cubic-bezier(.35, .52, .3, 1.76)
}
.anime--scall.scroll--start {
  opacity: 1;
  transform: scale(1);
}
.list_calpasStep.scroll--anime > li {
  transition: all 1s;
  opacity: 0;
  transform: scale(.8);
  transition-timing-function: cubic-bezier(.35, .52, .3, 1.76)
}
.list_calpasStep.scroll--anime > li:nth-child(1) {
  transition-delay: .1s;
}
.list_calpasStep.scroll--anime > li:nth-child(2) {
  transition-delay: .4s;
}
.list_calpasStep.scroll--anime > li:nth-child(3) {
  transition-delay: .7s;
}
.list_calpasStep.scroll--anime > li:nth-child(4) {
  transition-delay: 1s;
}
.list_calpasStep.scroll--start > li {
  opacity: 1;
  transform: scale(1)
}
/* == header ============================================== */
header .h_logo {
  position: absolute;
  left: 5%;
  top: 20px;
  width: 26.67%;
  z-index: 100;
}
#menu-trigger {
  position: absolute;
  right: 5%;
  top: 18px;
  background: #fff;
  width: 13.33%;
  padding: 13.33% 0 0;
  border-radius: 50%;
  z-index: 1001;
}
#menu-trigger span {
  display: inline-block;
  background: #000000;
  position: absolute;
  width: 40%;
  height: 4%;
  left: 0;
  right: 0;
  margin: auto;
  transition: all .4s;
}
#menu-trigger span:nth-child(1) {
  top: 35%;
}
#menu-trigger span:nth-child(2) {
  top: 0;
  bottom: 0;
}
#menu-trigger span:nth-child(3) {
  bottom: 35%;
}
header nav {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(251, 230, 0, 0.95);
  z-index: 1000;
  display: flex;
  align-content: center;
  align-items: center;
  transform: scale(0);
  transform-origin: center;
  transition: all .5s;
  border-radius: 50%;
}
.list_mainNav {
  width: 100%;
  text-align: center;
}
.list_mainNav li {
  opacity: 0;
  transition: all .5s ease .5s;
}
.list_mainNav a {
  display: block;
  padding: 5.5% 0 4.5%;
  font-family: 'panda';
  position: relative;
  font-size: 121.4%;
}
.list_mainNav a::before {
  content: '';
  width: 1.2em;
  height: 0;
  padding: 1.2em 0 0;
  background: url(../img/logo03.svg) no-repeat center;
  background-size: contain;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  margin: auto;
  transition: all .3s;
  opacity: 0;
}
.list_mainNav li.active a::before {
  opacity: 1;
}
body.nav--open header nav {
  transform: scale(1);
  border-radius: 0;
}
body.nav--open .list_mainNav li {
  opacity: 1;
}
body.nav--open #menu-trigger span:nth-child(1) {
  transform: rotateZ(35deg);
  top: 48%;
}
body.nav--open #menu-trigger span:nth-child(2) {
  opacity: 0;
}
body.nav--open #menu-trigger span:nth-child(3) {
  transform: rotateZ(-35deg);
  bottom: 48%;
}
/* == footer ============================================== */
footer {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
}
footer .f_logo {
  position: absolute;
  z-index: 10;
  left: 5%;
  bottom: 20px;
  width: 22.67%;
}
footer .f_logo img {
  vertical-align: top;
}
footer .copyright {
  position: absolute;
  z-index: 10;
  right: 3%;
  bottom: 20px;
  font-size: 50%;
}
body#page_front footer {
  position: relative;
}
body.under footer {
  position: relative;
  background: url(../img/bg_footer_sp.svg) no-repeat left 10% top;
  background-size: 68% auto;
  padding: 45% 0 0;
}
/* == frontpage ==============================================*/
body#page_front {
  background: #FBE600;
  position: relative;
  box-sizing: border-box;
}
body#page_front::-webkit-scrollbar {
  display: none;
}
#css_animation {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  z-index: -1;
  background: url(../img/game/bg_star_sp.svg) no-repeat center;
  background-size: 98% 96%;
}
/**/
.list_frontPandas li {
  position: absolute;
  z-index: 10;
  pointer-events: none;
  -webkit-animation: fuwafuwa 15s linear 0s infinite;
  animation: fuwafuwa 15s linear 0s infinite;
  transform-origin: center bottom
}
.list_frontPandas li img {
  -webkit-animation: tikutaku-left 5s linear 0s infinite;
  animation: tikutaku-left 5s linear 0s infinite;
  vertical-align: top;
}
.list_frontPandas li:nth-child(1) img, .list_frontPandas li:nth-child(5) img, .list_frontPandas li:nth-child(7) img {
  -webkit-animation: tikutaku-right 5s linear 0s infinite;
  animation: tikutaku-right 5s linear 0s infinite;
}
.list_frontPandas li:nth-child(1) {
  width: 11%;
  left: 40.5%;
  top: 8%;
}
.list_frontPandas li:nth-child(2) {
  width: 10.3%;
  left: 58%;
  top: 19%;
}
.list_frontPandas li:nth-child(3) {
  width: 9.33%;
  left: 8.5%;
  top: 58%;
}
.list_frontPandas li:nth-child(4) {
  width: 10%;
  left: 74%;
  top: 13%;
}
.list_frontPandas li:nth-child(5) {
  width: 8.93%;
  left: 86%;
  top: 23.5%;
}
.list_frontPandas li:nth-child(6) {
  width: 10.3%;
  left: 12%;
  top: 72%;
}
.list_frontPandas li:nth-child(7) {
  width: 10.9%;
  left: 51%;
  top: 89%;
}
.list_frontPandas li:nth-child(8) {
  width: 10%;
  left: 82%;
  top: 84%;
}
/**/
.list_frontIllust li {
  position: absolute;
  z-index: 5;
  pointer-events: none;
  -webkit-animation: pulse 2s linear 0s infinite;
  animation: pulse 2s linear 0s infinite;
  transform-origin: center;
}
.list_frontIllust li.illust01 {
  width: 12.1%;
  left: 33%;
  top: 1%;
}
.list_frontIllust li.illust02 {
  width: 14.3%;
  left: 60%;
  top: 9%;
  -webkit-animation: shooting01 5s linear 0s infinite;
  animation: shooting01 5s linear 0s infinite;
}
.list_frontIllust li.illust03 {
  width: 9.5%;
  left: 34%;
  top: 9%;
}
.list_frontIllust li.illust04 {
  width: 16%;
  left: 8%;
  top: 67%;
}
.list_frontIllust li.illust05 {
  width: 24.4%;
  left: -14%;
  top: 27%;
  -webkit-animation: roll 5s linear 0s infinite;
  animation: roll 5s linear 0s infinite;
}
.list_frontIllust li.illust06 {
  width: 10.1%;
  left: 1%;
  top: 50%;
  -webkit-animation: tikutaku-right 5s linear 0s infinite;
  animation: tikutaku-right 5s linear 0s infinite;
}
.list_frontIllust li.illust07 {
  width: 8%;
  left: 53%;
  top: 17%;
}
.list_frontIllust li.illust08 {
  width: 13.1%;
  left: 81%;
  top: 20%;
}
.list_frontIllust li.illust09 {
  width: 6%;
  left: 92%;
  top: 19%;
  -webkit-animation: shooting01 5s linear 0s infinite;
  animation: shooting01 5s linear 0s infinite;
}
.list_frontIllust li.illust10 {
  width: 16%;
  left: 89%;
  top: 30%;
}
.list_frontIllust li.illust11 {
  width: 11%;
  left: 87%;
  top: 38%;
  -webkit-animation: shooting03 4s linear 0s infinite;
  animation: shooting03 4s linear 0s infinite;
}
.list_frontIllust li.illust12 {
  width: 14.8%;
  left: 77%;
  top: 57%;
}
.list_frontIllust li.illust13 {
  width: 14.1%;
  left: 25%;
  top: 93%;
}
.list_frontIllust li.illust14 {
  width: 13%;
  left: 35%;
  top: 67%;
  -webkit-animation: shooting02 7s linear 0s infinite;
  animation: shooting02 7s linear 0s infinite;
}
.list_frontIllust li.illust15 {
  width: 8%;
  left: 76%;
  top: 77%;
}
.list_frontIllust li.illust16 {
  width: 12.9%;
  left: 11%;
  top: 84%;
}
.list_frontIllust li.illust17 {
  width: 8.8%;
  left: 89%;
  top: 90%;
}
/**/
.calpas_rocket {
  width: 23%;
  position: absolute;
  left: 70%;
  top: 65%;
  -webkit-animation: rocket 20s linear 0s infinite;
  animation: rocket 20s linear 0s infinite;
}
.calpas_rocket img {
  vertical-align: top;
}
.calpas_rocket img.burner {
  width: 39%;
  position: absolute;
  right: -22%;
  bottom: -8%;
  -webkit-animation: burner 20s linear 0s infinite;
  animation: burner 20s linear 0s infinite;
}
/**/
.block_frontBase {
  padding: 23% 0 21%;
  position: relative;
  z-index: 5;
}
.block_frontBase .base_fukidashi {
  margin: 0 0 0 1%;
  width: 40%;
  z-index: 101;
  position: relative;
}
.block_frontBase .panda_base {
  background: url(../img/panda_base.svg) no-repeat center;
  background-size: contain;
  width: 95%;
  height: 0;
  padding: 57% 0 0;
  margin: -10% auto 0;
  pointer-events: none;
  z-index: 100;
  box-sizing: border-box;
  position: relative;
}
.block_frontBase .panda_base .panda_eye {
  position: absolute;
  width: 51%;
  height: 0;
	padding: 10% 0 0;
  left: 0;
  right: 0;
  margin: auto;
  top: 25%;
  background: url(../img/panda_eye01.svg) no-repeat center;
  background-size: contain;
}
.block_frontBase .panda_base .panda_eye img {
  display: block;
  vertical-align: top;
  position: absolute;
  width: 88%;
  top: 39%;
  left: 0;
  right: 0;
  margin: auto;
  -webkit-animation: kaoSP 20s linear 0s infinite;
  animation: kaoSP 20s linear 0s infinite;
}
.list_frontMenu {
  text-align: center;
  margin: 5% 0 0;
}
.list_frontMenu > li {
  margin: 0 0 5%;
  font-size: 121.4%;
  font-family: 'panda';
}
/* == underpage ============================================== */
body.under {
  position: relative;
}
#pagetop {
  position: absolute;
  right: 5%;
  bottom: 50px;
  width: 25%;
  padding: 0 0 10%;
  cursor: pointer;
  z-index: 1000;
}
#pagetop::after {
  content: '';
  width: 50%;
  height: 0;
  padding: 46% 0 0;
  background: url("../img/pagetop_fire01.png") no-repeat;
  background-size: contain;
  position: absolute;
  right: 6%;
  bottom: 0;
  transform-origin: center top;
  -webkit-animation: burner2 1s linear 0s infinite;
  animation: burner2 1s linear 0s infinite;
}
#pagetop.animation {
  -webkit-animation: pagetop 5s linear 0s 1;
  animation: pagetop 5s ease-in 0s 1;
}
body.under main {
  font-family: 'Noto Sans JP', sans-serif;
}
.inner {
  width: 90%;
  margin: auto;
}
.block_pageTitle {
  position: relative;
  background: url("../img/commodity/bg_main_sp.svg") no-repeat center;
  background-size: 98%;
  padding: 27% 0 23%;
  z-index: 10;
}
.block_pageTitle .title_main {
  text-align: center;
}
.list_pageIcon li {
  position: absolute;
  margin: auto;
  -webkit-animation: fuwafuwa 15s linear 0s infinite;
  animation: fuwafuwa 15s linear 0s infinite;
}
.list_pageIcon li:nth-child(odd) img {
  -webkit-animation: tikutaku-left 5s linear 0s infinite;
  animation: tikutaku-left 5s linear 0s infinite;
}
.list_pageIcon li:nth-child(even) img {
  -webkit-animation: tikutaku-right 5s linear 0s infinite;
  animation: tikutaku-right 5s linear 0s infinite;
}
.list_pageIcon li:nth-child(1) {
  display: none;
}
.list_pageIcon li:nth-child(2) {
  width: 11%;
  top: 45%;
  left: -75%;
  right: 0;
}
.list_pageIcon li:nth-child(3) {
  width: 11%;
  top: 52%;
  left: 0;
  right: -70%;
}
.list_pageIcon li:nth-child(4) {
  display: none;
}
.list_bread {
  position: absolute;
  width: 95%;
  margin: auto;
  left: 5%;
  top: 68%;
}
.list_bread li {
  display: inline-block;
  font-size: 85.7%;
  font-weight: 500;
}
.list_bread li + li::before {
  content: '＞';
  font-size: 70%;
  display: inline-block;
  vertical-align: middle;
  margin: 2px 5px 0;
}
.list_bread li a, .list_bread li span {
  display: inline-block;
  vertical-align: middle;
}
.list_bread li a {
  text-decoration: underline;
}
/* ====== 
page-name #commodity
======*/
#page_commodity .block_pageTitle .title_main {
  width: 50%;
  margin: auto;
}
.block_commodity {
  padding: 0 0 17%;
}
.list_itemMain > li {
  position: relative;
}
.list_itemMain > li::before {
  content: '';
  width: 100%;
  height: 200px;
  position: absolute;
  z-index: 5;
  top: -60px;
  left: 0;
  right: 0;
  margin: auto;
  background: #fff;
  border-radius: 50%;
}
.list_itemMain > li .bg {
  position: relative;
}
.list_itemMain li .bg::before {
  content: '';
  width: 100%;
  height: calc(100% - 80px);
  background: #fff;
  position: absolute;
  z-index: 5;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  transition: all .5s ease 0s;
}
.list_itemMain li.accordion__open .bg::before {
  transition: all .35s ease 0s;
}
.list_itemMain > li .bg::after {
  content: '';
  width: 100%;
  height: 200px;
  position: absolute;
  z-index: 5;
  bottom: -60px;
  left: 0;
  right: 0;
  margin: auto;
  background: #fff;
  border-radius: 50%;
}
.list_itemMain > li + li {
  margin: calc(120px + 15%) 0 0;
}
.list_itemMain > li:nth-child(2n)::after {
  content: '';
  width: 100%;
  height: 0;
  padding: 25% 0 0;
  background: url("../img/commodity/bg_odd_sp.svg") no-repeat center top;
  background-size: contain;
  position: absolute;
  left: 0;
  top: -120px;
  pointer-events: none;
}
.list_itemMain > li:nth-child(2n + 3)::after {
  content: '';
  width: 95%;
  height: 0;
  padding: 30% 0 0;
  background: url("../img/commodity/bg_even_sp.svg") no-repeat center top;
  background-size: contain;
  position: absolute;
  left: 2.5%;
  top: -150px;
  pointer-events: none;
}
.list_itemMain > li .inner {
  position: relative;
  z-index: 11;
}
.list_itemMain .parts_itemMain {
  margin: 5% 0 0;
}
.list_itemMain .parts_itemMain .item_img {
  pointer-events: none;
  text-align: center;
  width: 90%;
  margin: 0 auto 5%;
}
.list_itemMain .parts_itemMain .item_img img {
  vertical-align: top;
  max-height: 100%;
  width: auto;
}
.list_itemMain .parts_itemMain .item_logo {
  text-align: center;
  pointer-events: none;
  max-width: 75%;
  margin: auto;
}
.list_itemMain li.item01 .item_logo img {
  vertical-align: top;
}
.list_itemMain .parts_itemMain .item_price {
  text-align: center;
  font-size: 187.5%;
  font-weight: 700;
  margin: 0 0 5%;
  line-height: 1.5;
}
.list_itemMain .parts_itemMain .item_lead {
  font-size: 93.75%;
  font-weight: 500;
  margin: 0 0 5%;
}
.list_itemMain .parts_itemMain .boxCart {
  display: flex;
  justify-content: center;
}
.list_itemMain .parts_itemMain .boxCart .cart_btn {
  background: #e0361f;
  border-radius: 50px;
  width: 48%;
  box-shadow: 3px 6px 0 0 rgba(0, 0, 0, .15);
}
.list_itemMain .parts_itemMain .boxCart .cart_btn + .cart_btn {
  margin: 0 0 0 4%;
}
.list_itemMain .parts_itemMain .boxCart .cart_btn a {
  display: block;
  color: #fff;
  font-size: 93.75%;
  font-weight: 700;
  text-align: center;
  line-height: 1.3;
  padding: 9% 0;
}
.list_itemMain .parts_itemMain .boxCart .cart_btn span {
  display: inline-block;
  padding: 0 1em 0 2.3em;
  background: url("../img/icon_cart.svg") no-repeat left center;
  background-size: 1.5em auto;
}
.list_itemMain .parts_itemInfo {
  background: #fae500;
  border-radius: 30px;
  position: relative;
}
.list_itemMain .parts_itemInfo::before, .list_itemMain .parts_itemInfo::after {
  content: '';
  width: 17px;
  height: 2px;
  background: #fff;
  position: absolute;
  z-index: 5;
  top: 43px;
  right: 41px;
  transform-origin: center;
  transition: all .3s;
}
.list_itemMain .parts_itemInfo::after {
  transform: rotateZ(90deg);
}
.list_itemMain li.accordion__open .parts_itemInfo::after {
  transform: rotateZ(0);
}
.list_itemMain .parts_itemInfo .info_accordionBtn {
  position: relative;
  font-size: 21px;
  padding: 25px 0 25px 50px;
  font-weight: 700;
  margin: 10% 0 0;
  background: url("../img/icon_star.svg") no-repeat left 15px center;
  background-size: 50px auto;
  cursor: pointer;
}
.list_itemMain .parts_itemInfo .info_accordionBtn::before {
  content: '';
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #000000;
  position: absolute;
  right: 30px;
  top: 0;
  bottom: 0;
  margin: auto;
}
.list_itemMain .parts_itemInfo .info_accordionContents {
  padding: 10px 20px 20px;
}
.list_itemMain .parts_itemInfo .info_accordionContents dl + dl {
  margin: 25px 0 0;
}
.list_itemMain .parts_itemInfo .info_accordionContents dl dt {
  font-size: 106.25%;
  font-weight: 700;
  margin: 0 0 5px;
}
.list_itemMain .parts_itemInfo .info_accordionContents dl dt small {
  display: inline-block;
  font-size: 85%;
  margin: 0 0 0 20px;
}
.list_itemMain .parts_itemInfo .info_accordionContents dl dd .material01 {
  display: inline-block;
  padding: 0 0 4px 40px;
  background: url(../img/icon_pura.svg) no-repeat left center;
  background-size: 30px auto;
  margin: 0 50px 0 0;
}
.list_itemMain .parts_itemInfo .info_accordionContents dl dd .material02 {
  display: inline-block;
  padding: 0 0 4px 40px;
  background: url(../img/icon_kami.svg) no-repeat left center;
  background-size: 30px auto;
  margin: 0 50px 0 0;
}
.list_seibun {
  border: solid 2px #d39c00;
  border-radius: 10px;
  overflow: hidden;
}
.list_seibun li {
  box-sizing: border-box;
  width: 100%;
  text-align: center;
  display: flex;
  align-items: center;
  font-size: 87.5%;
  font-weight: 700;
}
.list_seibun li + li {
  border-top: solid 2px #d39c00;
}
.list_seibun li .dt {
  width: 50%;
  padding: 10px 0;
  background: #faf5b4;
}
.list_seibun li .dd {
  width: 50%;
  padding: 10px 0;
  background: #fff;
}
.list_itemMain .parts_itemInfo .check_wrap {
  background: #fff;
  border: solid 2px #d39c00;
  border-radius: 10px;
  overflow: hidden;
  margin: 10px 0 30px;
}
.list_itemMain .parts_itemInfo .check_wrap .check_allergy01 {
  padding: 15px 0;
  box-sizing: border-box;
  margin: 0 5%;
}
.list_itemMain .parts_itemInfo .check_wrap .check_allergy02 {
  box-sizing: border-box;
  border-top: solid 2px #d39c00;
  padding: 15px 0;
  margin: 0 5%;
}
.list_itemMain .parts_itemInfo .check_wrap .allergy_text {
  font-size: 87.5%;
  font-weight: 700;
  line-height: 1.55;
  margin: 0 0 4%;
  text-align: center;
}
.list_itemMain .parts_itemInfo .list_checkItem {
  display: flex;
  align-items: center;
}
.list_itemMain .parts_itemInfo .check_wrap .check_allergy01 .list_checkItem {
  flex-wrap: wrap;
  margin: 0 10%;
  justify-content: center;
}
.list_itemMain .parts_itemInfo .list_checkItem > li {
  font-size: 78%;
  font-weight: 500;
  width: 16.666%;
  background-repeat: no-repeat;
  background-position: center top;
  background-size: 70% auto;
  padding: 12% 0 0;
  text-align: center;
  color: rgba(0, 0, 0, 0.3);
  text-decoration: line-through;
}
.list_itemMain .parts_itemInfo .check_wrap .check_allergy01 .list_checkItem li {
  width: 25%;
  padding: 19% 0 0;
  margin: 1% 0 0;
}
.list_itemMain .parts_itemInfo .list_checkItem > li.check {
  color: #d72016;
  text-decoration: none;
}
.list_itemMain .parts_itemInfo .list_checkItem > li.allergy01 {
  background-image: url(../img/commodity/allergy01.png);
}
.list_itemMain .parts_itemInfo .list_checkItem > li.allergy02 {
  background-image: url(../img/commodity/allergy02.png);
}
.list_itemMain .parts_itemInfo .list_checkItem > li.allergy03 {
  background-image: url(../img/commodity/allergy03.png);
}
.list_itemMain .parts_itemInfo .list_checkItem > li.allergy04 {
  background-image: url(../img/commodity/allergy04.png);
}
.list_itemMain .parts_itemInfo .list_checkItem > li.allergy05 {
  background-image: url(../img/commodity/allergy05.png);
}
.list_itemMain .parts_itemInfo .list_checkItem > li.allergy06 {
  background-image: url(../img/commodity/allergy06.png);
}
.list_itemMain .parts_itemInfo .list_checkItem > li.allergy07 {
  background-image: url(../img/commodity/allergy07.png);
}
.list_itemMain .parts_itemInfo .list_checkItem > li.allergy08 {
  background-image: url(../img/commodity/allergy08.png);
}
.list_itemMain .parts_itemInfo .list_checkItem > li.allergy09 {
  background-image: url(../img/commodity/allergy09.png);
}
.list_itemMain .parts_itemInfo .list_checkItem > li.allergy10 {
  background-image: url(../img/commodity/allergy10.png);
}
.list_itemMain .parts_itemInfo .list_checkItem > li.allergy11 {
  background-image: url(../img/commodity/allergy11.png);
}
.list_itemMain .parts_itemInfo .list_checkItem > li.allergy12 {
  background-image: url(../img/commodity/allergy12.png);
}
.list_itemMain .parts_itemInfo .list_checkItem > li.allergy13 {
  background-image: url(../img/commodity/allergy13.png);
}
.list_itemMain .parts_itemInfo .list_checkItem > li.allergy14 {
  background-image: url(../img/commodity/allergy14.png);
}
.list_itemMain .parts_itemInfo .list_checkItem > li.check.allergy01 {
  background-image: url(../img/commodity/allergy01_on.png);
}
.list_itemMain .parts_itemInfo .list_checkItem > li.check.allergy02 {
  background-image: url(../img/commodity/allergy02_on.png);
}
.list_itemMain .parts_itemInfo .list_checkItem > li.check.allergy03 {
  background-image: url(../img/commodity/allergy03_on.png);
}
.list_itemMain .parts_itemInfo .list_checkItem > li.check.allergy04 {
  background-image: url(../img/commodity/allergy04_on.png);
}
.list_itemMain .parts_itemInfo .list_checkItem > li.check.allergy05 {
  background-image: url(../img/commodity/allergy05_on.png);
}
.list_itemMain .parts_itemInfo .list_checkItem > li.check.allergy06 {
  background-image: url(../img/commodity/allergy06_on.png);
}
.list_itemMain .parts_itemInfo .list_checkItem > li.check.allergy07 {
  background-image: url(../img/commodity/allergy07_on.png);
}
.list_itemMain .parts_itemInfo .list_checkItem > li.check.allergy08 {
  background-image: url(../img/commodity/allergy08_on.png);
}
.list_itemMain .parts_itemInfo .list_checkItem > li.check.allergy09 {
  background-image: url(../img/commodity/allergy09_on.png);
}
.list_itemMain .parts_itemInfo .list_checkItem > li.check.allergy10 {
  background-image: url(../img/commodity/allergy10_on.png);
}
.list_itemMain .parts_itemInfo .list_checkItem > li.check.allergy11 {
  background-image: url(../img/commodity/allergy11_on.png);
}
.list_itemMain .parts_itemInfo .list_checkItem > li.check.allergy12 {
  background-image: url(../img/commodity/allergy12_on.png);
}
.list_itemMain .parts_itemInfo .list_checkItem > li.check.allergy13 {
  background-image: url(../img/commodity/allergy13_on.png);
}
.list_itemMain .parts_itemInfo .list_checkItem > li.check.allergy14 {
  background-image: url(../img/commodity/allergy14_on.png);
}
.list_itemMain .parts_itemInfo .otherBox .box {
  box-sizing: border-box;
  text-align: left;
}
.list_itemMain .parts_itemInfo .otherBox .box + .box {
  margin: 25px 0 0;
}
.list_itemMain .parts_itemInfo .otherBox .box small {
  display: block;
  font-size: 87.5%;
  padding: 10px 0 0;
}
.list_itemMain .parts_itemInfo .accordion_close {
  width: 300px;
  margin: 25px auto 0;
  background: #000000;
  border-radius: 50px;
  text-align: center;
  cursor: pointer;
}
.list_itemMain .parts_itemInfo .accordion_close span {
  display: inline-block;
  color: #fff;
  font-size: 93.75%;
  font-weight: 700;
  line-height: 1;
  padding: 20px 0 20px 26px;
  background: url("../img/icon_batu.svg") no-repeat left center;
  background-size: 18px auto;
}
/* ====== 
page-name #calpas
======*/
#page_calpas .list_bread {
  top: 87%;
}
#page_calpas .block_pageTitle {
  padding: 27% 0 10%;
  margin: 0 0 6%;
}
#page_calpas .block_pageTitle .title_main {
  width: 49%;
  margin: 0 auto;
}
.block_calpas {
  position: relative;
  overflow: hidden;
  z-index: 100;
}
.title_fukudashi {
  font-family: "panda";
  font-size: 221%;
  font-weight: 400;
  color: #fff;
  background: #e1361f;
  width: 90%;
  margin: 0 auto 15px;
  border-radius: 100px;
  text-align: center;
  position: relative;
  line-height: 1;
  padding: 20px 0;
  z-index: 10;
}
.title_fukudashi span {
  position: relative;
  z-index: 5;
}
.title_fukudashi::before {
  content: '';
  width: 77px;
  height: 71px;
  margin: auto;
  background: url("../img/calpas/fukidasi.png") no-repeat center;
  background-size: contain;
  position: absolute;
  left: 0;
  right: 0;
  bottom: -25px;
}
.block_calpas .stepBase {
  position: relative;
  padding: 55px 0;
}
.block_calpas .stepBase + .stepBase {
  margin: -20px 0 0;
}
.block_calpas .stepBase .inner {
  position: relative;
  height: 100%;
  z-index: 5;
}
.block_calpas .area_step01 {
  background: url(../img/calpas/road01_sp.png) no-repeat center top 55%;
  background-size: 72% auto;
}
.block_calpas .area_step02 {
  background: url(../img/calpas/road02_sp.png) no-repeat center top 58%;
  background-size: 70% auto;
}
.block_calpas .area_step03 {
  background: url(../img/calpas/road02_sp.png) no-repeat center top 55%;
  background-size: 70% auto;
}
.block_calpas .stepBase::before {
  content: '';
  border-radius: 50%;
  position: absolute;
  z-index: -1;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  width: 1240px;
  height: 100%;
}
.block_calpas .area_step01::before {
  background: #ffce00;
}
.block_calpas .area_step02::before {
  background: #ffb600;
}
.block_calpas .area_step03::before {
  background: #ffaa00;
}
.block_calpas .step_title {
  text-align: center;
  font-size: 207.14%;
  font-weight: 400;
  font-family: "panda";
  line-height: 1.2;
  margin: 0 0 10%;
}
.list_calpasStep li {
  width: 92%;
  height: 0;
  padding: 92% 0 0;
  background: #fff;
  border-radius: 50%;
  box-sizing: border-box;
  text-align: center;
  position: relative;
}
.list_calpasStep li.step06, .list_calpasStep li.step10 {
  margin: 12% 0 0;
}
.list_calpasStep li.step02, .list_calpasStep li.step05, .list_calpasStep li.step09 {
  margin: 12% 0 0 auto;
}
.list_calpasStep li.step03, .list_calpasStep li.step07, .list_calpasStep li.step11 {
  margin: 12% auto 0;
}
.list_calpasStep li.step11 {
  width: 100%;
  padding: 100% 0 0;
}
.list_calpasStep .number {
  background: #e1361f;
  border-radius: 50%;
  text-align: center;
  width: 2.2em;
  height: 2.2em;
  line-height: 2.2em;
  box-sizing: border-box;
  font-size: 182%;
  font-weight: 700;
  color: #fff;
  font-family: "ttc";
  position: absolute;
  left: 0;
  right: 0;
  top: -.6em;
  margin: auto;
}
.list_calpasStep dl {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}
.list_calpasStep dt {
  font-size: 150%;
  font-weight: 700;
  margin: 0 0 1%;
}
.list_calpasStep li dt img {
  display: block;
  margin: 0 auto 2%;
  vertical-align: top;
}
.list_calpasStep li.step01 dt img {
  width: 52%;
  padding: 18% 0 0;
}
.list_calpasStep li.step02 dt img {
  width: 47%;
  padding: 22% 0 0;
}
.list_calpasStep li.step03 dt img {
  width: 70%;
  padding: 20% 0 0;
}
.list_calpasStep li.step04 dt img {
  width: 48%;
  padding: 20% 0 0;
}
.list_calpasStep li.step05 dt img {
  width: 48%;
  padding: 20% 0 0;
}
.list_calpasStep li.step06 dt img {
  width: 60%;
  padding: 20% 0 0;
}
.list_calpasStep li.step07 dt img {
  width: 48%;
  padding: 25% 0 0;
}
.list_calpasStep li.step08 dt img {
  width: 48%;
  padding: 18% 0 0;
}
.list_calpasStep li.step09 dt img {
  width: 48%;
  padding: 17% 0 0;
}
.list_calpasStep li.step10 dt img {
  width: 48%;
  padding: 16% 0 0;
}
.list_calpasStep li.step11 dt img {
  width: 48%;
  padding: 16% 0 0;
}
.list_calpasStep li.step11 .number {
  background: url("../img/calpas/illust11_title.svg") no-repeat;
  background-size: contain;
  width: 40%;
  height: 0;
  padding: 18% 0 0;
  overflow: hidden;
  text-indent: 120%;
  white-space: nowrap;
  border-radius: 0;
  top: -6%;
  z-index: 10;
}
.list_calpasStep li.step11 .bg {
  background: url(../img/calpas/illust11_bg01.png) no-repeat center top;
  background-size: contain;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
}
.list_calpasStep li.step11::after {
  content: '';
  width: 97%;
  height: 0;
  padding: 42% 0 0;
  background: url("../img/calpas/illust11_bg02.png") no-repeat center;
  background-size: contain;
  position: absolute;
  left: 3%;
  top: 13%;
  margin: auto;
  z-index: 0;
}
.list_calpasStep dd {
  font-size: 107%;
}
/* ====== 
page-name #panda
======*/
#page_panda .block_pageTitle .title_main {
  width: 60%;
  margin: auto;
}
.block_panda {
  position: relative;
  z-index: 5;
  overflow: hidden;
}
.block_panda .area_profile .profileWrap {
  position: relative;
  background: #fff;
  margin: 20% 0 40%;
}
.block_panda .area_profile .profileWrap::before {
  content: '';
  width: 200%;
  height: 118%;
  background: #fff;
  position: absolute;
  left: 50%;
  top: -8%;
  transform: translateX(-50%);
  border-radius: 50%;
}
.block_panda .area_profile .profileWrap .inner {
  position: relative;
  z-index: 5;
  align-items: center;
}
.block_panda .area_profile .profileWrap .profile_left {
  width: 60%;
  margin: 0 auto 8%;
}
.block_panda .area_profile .profileWrap .profile_lead {
  font-size: 112.5%;
  font-weight: 500;
  margin: 0 0 30px;
}
.list_profilePanda {
  border: solid 2px #d39c00;
  border-radius: 10px;
  overflow: hidden;
  font-size: 121%;
  font-weight: 500;
}
.list_profilePanda li + li {
  border-top: solid 2px #d39c00;
}
.list_profilePanda li dl {
  display: flex;
}
.list_profilePanda li dt {
  width: 35%;
  background: #f9e400;
  box-sizing: border-box;
  padding: 3% 4%;
}
.list_profilePanda li dd {
  width: 65%;
  background: #fff;
  box-sizing: border-box;
  padding: 3% 4%;
}
/**/
.block_panda .area_island .island_lead {
  width: 90%;
  font-weight: 500;
  margin: 40px auto 25px;
}
.block_panda .area_island .island_lead p + p {
  margin: 20px 0 0;
}
.block_panda .area_island .island_map {
  padding: 163% 0 0;
  height: 0;
  position: relative;
  background: url(../img/panda/bg_island_sp.svg) no-repeat left 36% center;
  background-size: 126% auto;
}
.block_panda .area_island .island_map .map--base {
  position: absolute;
  display: block;
  left: -5%;
  right: 0;
  top: 6%;
  width: 85%;
  z-index: 1;
  margin: auto;
  pointer-events: none;
}
.block_panda .area_island .island_map img {
  vertical-align: top;
}
/**/
.list_islandAnime li {
  position: absolute;
  z-index: 5;
  pointer-events: none;
}
.list_islandAnime li.cloud01 {
  width: 13%;
  left: -6%;
  top: 37%;
}
.list_islandAnime li.cloud02 {
  display: none;
}
.list_islandAnime li.cloud03 {
  width: 14%;
  left: 57%;
  top: 13%;
}
.list_islandAnime li.cloud04 {
  display: none;
}
.list_islandAnime li.cloud05 {
  display: none;
}
.list_islandAnime li.cloud06 {
  width: 6%;
  left: 64%;
  top: 29%;
  z-index: 5;
}
.list_islandAnime li.cloud07 {
  display: none;
}
.list_islandAnime li.cloud08 {
  width: 14%;
  left: 91%;
  top: 35%;
}
.list_islandAnime li.cloud01, .list_islandAnime li.cloud03, .list_islandAnime li.cloud04, .list_islandAnime li.cloud07 {
  -webkit-animation: fuwafuwa 20s ease infinite;
  animation: fuwafuwa 20s ease infinite;
}
.list_islandAnime li.cloud02, .list_islandAnime li.cloud05, .list_islandAnime li.cloud06, .list_islandAnime li.cloud08 {
  -webkit-animation: fuwafuwa 15s ease-out infinite;
  animation: fuwafuwa 15s ease-out infinite;
}
.list_islandAnime li.anime01 {
  width: 13%;
  left: 22.7%;
  top: 35%;
}
.list_islandAnime li.anime01 .img00 {
  position: absolute;
  width: 35%;
  top: 34%;
  left: 0;
  right: 0;
  margin: auto;
  z-index: 5;
}
.list_islandAnime li.anime01 .roll {
  -webkit-animation: kanransya 10s linear infinite;
  animation: kanransya 10s linear infinite;
}
.list_islandAnime li.anime01 .kanransya {
  position: absolute;
  -webkit-animation: kanransya 10s linear infinite;
  animation: kanransya 10s linear infinite;
  animation-direction: reverse;
  width: 25%;
}
.list_islandAnime li.anime01 .img01-2 {
  left: 36%;
  top: 0%;
}
.list_islandAnime li.anime01 .img01-3 {
  left: 65%;
  top: 7.5%;
}
.list_islandAnime li.anime01 .img01-4 {
  left: 76%;
  top: 37%;
}
.list_islandAnime li.anime01 .img01-5 {
  left: 65%;
  top: 66.5%;
}
.list_islandAnime li.anime01 .img01-6 {
  left: 36%;
  top: 77%;
}
.list_islandAnime li.anime01 .img01-7 {
  left: 7%;
  top: 66.5%;
}
.list_islandAnime li.anime01 .img01-8 {
  left: 0;
  top: 37%;
}
.list_islandAnime li.anime01 .img01-9 {
  left: 7%;
  top: 7.5%;
}
.list_islandAnime li.anime02 {
  width: 27%;
  top: 8%;
  left: 3%;
}
.list_islandAnime li.anime02 .img2-2 {
  width: 23%;
  position: absolute;
  left: 25%;
  top: -1%;
  -webkit-animation: rocket2 3s linear infinite;
  animation: rocket2 3s linear infinite;
}
.list_islandAnime li.anime02 .img2-3 {
  width: 20%;
  position: absolute;
  left: 19%;
  top: 31%;
  -webkit-animation: rocket2 3s ease-out infinite;
  animation: rocket2 3s ease-out infinite;
}
.list_islandAnime li.anime03 {
  width: 27.6%;
  top: 0%;
  left: 62%;
}
.list_islandAnime li.anime03 .img3-1 {
  -webkit-animation: tikutaku-left 5s ease-out infinite;
  animation: tikutaku-left 5s ease-out infinite;
}
.list_islandAnime li.anime03 .img3-2 {
  position: absolute;
  left: -5%;
  top: 40%;
  width: 30%;
  -webkit-animation: wind 2s ease-out infinite;
  animation: wind 2s ease-out infinite;
}
.list_islandAnime li.anime03 .img3-3 {
  position: absolute;
  left: -5%;
  top: 20%;
  width: 25%;
  -webkit-animation: wind 2s ease infinite;
  animation: wind 2s ease infinite;
}
.list_islandAnime li.anime04 {
  width: 17%;
  left: 79%;
  top: 75%;
}
.list_islandAnime li.anime04 .img4-1 {
  -webkit-animation: fuwafuwa 20s ease-out infinite;
  animation: fuwafuwa 20s ease-out infinite;
}
.list_islandAnime li.anime04 .img4-2 {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  -webkit-animation: fuwafuwa 20s ease infinite;
  animation: fuwafuwa 20s ease infinite;
}
.list_islandAnime li.anime05 {
  width: 13%;
  left: 50%;
  top: 5%;
  animation: rocket3 20s ease infinite;
}
.list_islandAnime li.anime05 .img5-2 {
  position: absolute;
  width: 30%;
  top: 47%;
  right: -27%;
  -webkit-animation: burner 20s ease-out infinite;
  animation: burner 20s ease-out infinite;
}
/**/
.list_islandLinke > li {
  position: absolute;
  left: 0;
  width: 100%;
  z-index: 10;
}
.list_islandLinke > li a {
  display: block;
  background: #f9e400;
  text-align: center;
  color: #000000;
  font-family: "panda";
  cursor: pointer;
  border-radius: 50px;
  padding: .4em 1em;
  white-space: nowrap;
  transition: all .2s;
  line-height: 1.2;
  position: absolute;
  top: 0;
}
.list_islandLinke > li.active a {
  background: #e0361f;
  color: #fff;
}
.list_islandLinke > li:nth-child(1) {
  top: 21%;
}
.list_islandLinke > li:nth-child(1) a {
  left: 2%;
}
.list_islandLinke > li:nth-child(2) {
  top: 7%;
}
.list_islandLinke > li:nth-child(2) a {
  left: 39%;
}
.list_islandLinke > li:nth-child(3) {
  top: 20%;
}
.list_islandLinke > li:nth-child(3) a {
  left: 54%;
}
.list_islandLinke > li:nth-child(4) {
  top: 15%;
}
.list_islandLinke > li:nth-child(4) a {
  left: 74.5%;
}
.list_islandLinke > li:nth-child(5) {
  top: 43%;
}
.list_islandLinke > li:nth-child(5) a {
  left: 1%;
}
.list_islandLinke > li:nth-child(6) {
  top: 41.5%;
}
.list_islandLinke > li:nth-child(6) a {
  left: 71.5%;
}
.list_islandLinke > li:nth-child(7) {
  top: 50%;
}
.list_islandLinke > li:nth-child(7) a {
  left: 4%;
}
.list_islandLinke > li:nth-child(8) {
  top: 54.5%;
}
.list_islandLinke > li:nth-child(8) a {
  left: 62.5%;
}
.list_islandLinke > li:nth-child(9) {
  top: 66.5%;
}
.list_islandLinke > li:nth-child(9) a {
  left: 18.5%;
}
.list_islandLinke > li:nth-child(10) {
  top: 86.5%;
}
.list_islandLinke > li:nth-child(10) a {
  left: 25%;
}
.list_islandLinke > li .pop_base {
  position: absolute;
  width: 90%;
  left: 0;
  right: 0;
  margin: auto;
  bottom: calc(100% + 20px);
  background-color: #e0361f;
  color: #fff;
  padding: 1.3em;
  border-radius: 10px;
  cursor: pointer;
  visibility: hidden;
  opacity: 0;
  transition: all .4s;
  transform-origin: center bottom;
  background-repeat: no-repeat;
  box-sizing: border-box;
}
.list_islandLinke > li.active {
  z-index: 11;
}
.list_islandLinke > li.active .pop_base {
  visibility: visible;
  opacity: 1;
}
.list_islandLinke > li:nth-child(1) .pop_base {
  background-image: url(../img/panda/island01.svg);
  background-size: 15% auto;
  background-position: right 2.4em center;
}
.list_islandLinke > li:nth-child(3) .pop_base {
  background-image: url(../img/panda/island03.svg);
  background-size: 20% auto;
  background-position: right 1.5em center;
}
.list_islandLinke > li:nth-child(4) .pop_base {
  background-image: url(../img/panda/island04.svg);
  background-size: 13.4% auto;
  background-position: right 2em center;
}
.list_islandLinke > li:nth-child(5) .pop_base {
  background-image: url(../img/panda/island05.svg);
  background-size: 20% auto;
  background-position: right 1.8em center;
}
.list_islandLinke > li:nth-child(7) .pop_base {
  background-image: url(../img/panda/island07.svg);
  background-size: 15% auto;
  background-position: right 1.8em center;
}
.list_islandLinke > li:nth-child(8) .pop_base {
  background-image: url(../img/panda/island08.svg);
  background-size: 15% auto;
  background-position: right 2em center;
}
.list_islandLinke > li:nth-child(9) .pop_base {
  background-image: url(../img/panda/island09.svg);
  background-size: 14% auto;
  background-position: right 1.9em center;
}
.list_islandLinke > li:nth-child(10) .pop_base {
  background-image: url(../img/panda/island10.svg);
  background-size: 16% auto;
  background-position: right 2em center;
}
.list_islandLinke > li .pop_base::before {
  content: '';
  width: .7em;
  height: .7em;
  background: url(../img/panda/batu.svg) no-repeat;
  background-size: contain;
  position: absolute;
  right: 1em;
  top: 1em;
}
.list_islandLinke > li .pop_base::after {
  content: '';
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 15px 9px 0 9px;
  border-color: #e0361f transparent transparent transparent;
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  margin: auto;
}
.list_islandLinke > li.island01 .pop_base::after {
  left: 7%;
  right: auto;
}
.list_islandLinke > li.island01 .pop_base::after {
  left: 7%;
  right: auto;
}
.list_islandLinke > li.island03 .pop_base::after {
  right: -35%;
}
.list_islandLinke > li.island04 .pop_base::after {
  left: auto;
  right: 7%;
}
.list_islandLinke > li.island05 .pop_base::after {
  left: 9%;
  right: auto;
}
.list_islandLinke > li.island06 .pop_base::after {
  left: auto;
  right: 11%;
}
.list_islandLinke > li.island07 .pop_base::after {
  left: 5%;
  right: auto;
}
.list_islandLinke > li.island08 .pop_base::after {
  left: auto;
  right: 20%;
}
.list_islandLinke > li.island09 .pop_base::after {
  left: 27%;
  right: auto;
}
.list_islandLinke > li.island10 .pop_base::after {
  left: 38%;
  right: auto;
}
.list_islandLinke > li .pop_base .pop_title {
  font-size: 129%;
  font-weight: 400;
  font-family: "panda";
}
.list_islandLinke > li .pop_base .pop_text {
  font-weight: 700;
}
.list_islandLinke > li .pop_base .pop_text.height--adjust {
  min-height: 3.6em;
}
/* ====== 
page-name #game
======*/
#page_game main.pop--open {
  position: relative;
  z-index: 10000;
  overflow: hidden;
}
#page_game header .h_logo::before {
  content: '';
  width: 60vw;
  height: 60vw;
  border-radius: 50%;
  background: #fff;
  position: absolute;
  left: -23vw;
  top: -39vw;
}
header .h_logo a {
  position: relative;
  z-index: 5;
}
#page_game footer {
  padding: 6.5% 0 0;
  position: absolute;
  z-index: 100;
  left: 0;
  bottom: 0;
  width: 100%;
  background: none;
}
.block_game {
  position: relative;
  overflow: hidden;
}
body.game_front {
  position: relative;
}
.block_game .list_gameCalpas {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  pointer-events: none;
  margin: auto;
}
.block_game .list_gameCalpas li {
  position: absolute;
  z-index: 5;
  transform-origin: center;
  animation: kanransya 10s linear 0s infinite;
}
.block_game .list_gameCalpas li:nth-child(1) {
  display: none;
}
.block_game .list_gameCalpas li:nth-child(2) {
  display: none;
}
.block_game .list_gameCalpas li:nth-child(3) {
  display: none;
}
.block_game .list_gameCalpas li:nth-child(4) {
  width: 7%;
  bottom: 13%;
  left: 2%;
}
.block_game .list_gameCalpas li:nth-child(5) {
  width: 13%;
  bottom: 6%;
  left: 15%;
  animation-duration: 15s;
  animation-direction: reverse;
}
.block_game .list_gameCalpas li:nth-child(6) {
  width: 6%;
  bottom: 4%;
  left: 60%;
  animation-duration: 10s;
  animation-direction: reverse;
}
.block_game .area_gacha {
  background: #ffb600;
  border-radius: 50%;
  width: 200vw;
  height: 200vw;
  overflow: hidden;
  position: absolute;
  z-index: 4;
  left: -95%;
  right: 0;
  top: -130vw;
  margin: auto;
}
.block_game .area_gacha .bg {
  width: 45%;
  height: 36%;
  position: absolute;
  right: 7.5%;
  bottom: 0%;
  background: url(../img/game/gacha_sp.png) no-repeat left top;
  background-size: cover;
}
.block_game .area_gameFront {
  position: relative;
  z-index: 5;
}
.block_game .area_gameFront .inner {
  padding: 70% 0 0;
}
.block_game .area_gameFront .game_title {
  width: 65%;
  margin: 0 auto 5%;
  position: relative;
}
.block_game .area_gameFront .game_title img {
  vertical-align: top;
  position: relative;
  z-index: 5;
}
.block_game .area_gameFront .game_title::before {
  content: '';
  width: 54%;
  height: 0;
  padding: 59% 0 0;
  background: url("../img/game/fukidasi_sp.svg") no-repeat;
  background-size: contain;
  position: absolute;
  right: -25%;
  top: -100%;
}
.list_pop {
  margin: 0 0 5%;
  display: flex;
  justify-content: space-between;
}
.list_pop > li {
  width: 49%;
  text-align: center;
  background-image: repeating-linear-gradient(0deg, #FBE600, #FBE600 5px, transparent 5px, transparent 10px, #FBE600 10px), repeating-linear-gradient(90deg, #FBE600, #FBE600 5px, transparent 5px, transparent 10px, #FBE600 10px), repeating-linear-gradient(180deg, #FBE600, #FBE600 5px, transparent 5px, transparent 10px, #FBE600 10px), repeating-linear-gradient(270deg, #FBE600, #FBE600 5px, transparent 5px, transparent 10px, #FBE600 10px);
  background-size: 3px calc(100% + 10px), calc(100% + 10px) 3px, 3px calc(100% + 10px), calc(100% + 10px) 3px;
  background-position: 0 0, 0 0, 100% 0, 0 100%;
  background-repeat: no-repeat;
  border-radius: 50px;
  position: relative;
}
.list_pop > li::before {
  content: '';
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  position: absolute;
  left: 0;
  top: 0;
  border: solid 3px #fff;
  z-index: -1;
  border-radius: 50px;
}
.list_pop > li a {
  display: block;
  box-sizing: border-box;
  font-weight: 700;
  background: url(../img/game/icon_pop.svg) no-repeat right 8% center;
  background-size: .8em auto;
  font-size: 121%;
  padding: 6% 0;
}
.block_game .btn_start {
  width: 75%;
  background: url(../img/game/btn_start--huti.svg) no-repeat center bottom;
  background-size: 100% auto;
  padding: 0 0 3%;
  margin: 0 auto;
}
.block_game .btn_start a {
  display: block;
  width: 100%;
  height: 0;
  padding: 44% 0 0;
  background-image: url(../img/game/btn_start.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% auto;
  overflow: hidden;
  white-space: nowrap;
  text-indent: 150%;
  position: relative;
  transition: all .5s;
}
.block_game .area_sns {
  background: #ffce00;
  position: relative;
  z-index: 3;
  padding: 36% 0 23%;
  margin: -15% 0 0;
}
.block_game .area_sns::before {
  content: '';
  width: 100%;
  height: 0;
  padding: 48% 0 0;
  background: #FBE600;
  position: absolute;
  top: -15%;
  left: 50%;
  transform: translateX(-50%);
  border-radius: 50%;
}
.block_game .area_sns::after {
  content: '';
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: url(../img/game/bg01_sp.png) no-repeat center bottom;
  background-size: contain;
}
.block_game .area_sns .inner {
  position: relative;
  z-index: 5;
}
.block_game .area_sns .sns_panda > div {
  animation: fuwafuwa 15s linear 0s infinite;
  transform-origin: center bottom;
}
.block_game .area_sns .sns_panda .panda01 {
  position: absolute;
  width: 15%;
  left: 2%;
  top: -4%;
  -webkit-animation: tikutaku-left 5s linear 0s infinite;
  animation: tikutaku-left 5s linear 0s infinite;
}
.block_game .area_sns .sns_panda .panda02 {
  position: absolute;
  width: 15%;
  right: 2%;
  top: -4%;
  -webkit-animation: tikutaku-right 5s linear 0s infinite;
  animation: tikutaku-right 5s linear 0s infinite;
}
.block_game .area_sns .sns_title {
  text-align: center;
  font-size: 207%;
  font-weight: 700;
  margin: 0 0 4%;
}
.list_gameSns {
  text-align: center;
  margin: 0 auto 8%;
}
.list_gameSns li {
  display: inline-block;
  width: 25%;
  vertical-align: middle;
  margin: 0 2%;
}
.list_gameSns li img {
  vertical-align: top;
  transition: all .5s ease-out 0s;
}
.block_game .btn_back {
  width: 75%;
  background: url(../img/game/btn_back--huti.svg) no-repeat center bottom;
  background-size: 100% auto;
  padding: 0 0 2%;
  margin: auto;
}
.block_game .btn_back a {
  display: block;
  width: 100%;
  height: 0;
  padding: 22% 00;
  background-image: url(../img/game/btn_back.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% auto;
  overflow: hidden;
  white-space: nowrap;
  text-indent: 150%;
  position: relative;
  transition: all .5s;
}
.block_game .btn_close {
  margin: 25px auto 0;
  background: #000000;
  border-radius: 50px;
  text-align: center;
  cursor: pointer;
}
.block_game .btn_close span {
  display: inline-block;
  color: #fff;
  font-size: 112.5%;
  font-weight: 700;
  line-height: 1;
  padding: 20px 0 24px 30px;
  background: url(../img/icon_batu.svg) no-repeat left center;
  background-size: 18px auto;
}
/**/
.block_game .pop_base {
  position: fixed;
  z-index: 100;
  left: 0;
  top: 0;
  width: 100%;
  height: 100vh;
  height: calc(var(--vh, 1vh) * 100);
  background: rgba(255, 206, 0, 0.8);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: all .8s;
  transform: scale(.5);
  border-radius: 50%;
}
.block_game .pop_base.active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: scale(1);
  border-radius: 0;
}
.block_game .pop_base .title_fukudashi {
  padding: 15px 0;
}
.block_game .pop_base .pop_wrap {
  position: absolute;
  left: 0;
  right: 0;
  top: 5%;
  height: 90%;
  width: 90%;
  margin: auto;
  box-sizing: border-box;
  padding: 15% 5% 10%;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 6px 0 0 rgba(191, 122, 0, 0.8);
}
.block_game .pop_base .pop_wrap .wrap_close {
  width: 10%;
  height: 0;
  padding: 10% 0 0;
  position: absolute;
  right: 4%;
  top: 2%;
  cursor: pointer;
}
.block_game .pop_base .pop_wrap .wrap_close img {
  vertical-align: top;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
}
.block_game .pop_base .pop_wrap .wrapScroll {
  height: calc(100% - 200px);
  overflow-y: scroll;
  box-sizing: border-box;
  padding: 10px 0;
  margin: 40px auto;
}
.block_game .pop_lead {
  margin: 0 0 8%;
  font-weight: 700;
}
.block_game .area_desc.pop_base .pop_lead {
  text-align: center;
}
.block_game .desc_flex {
  overflow-x: scroll;
  margin: 0 0 5%;
}
.block_game .list_descFlex {
  width: 700px;
  display: flex;
  justify-content: space-between;
}
.block_game .list_descFlex > li {
  width: 32%;
  position: relative;
}
.block_game .list_descFlex > li + li::before {
  content: '';
  width: 33px;
  height: 16.2px;
  background: url(../img/game/step_arrow.png) no-repeat;
  background-size: contain;
  position: absolute;
  top: 0;
  bottom: 0;
  left: -26px;
  margin: auto;
}
.dl_kiyaku + .dl_kiyaku {
  margin: 8% 0 0;
}
.dl_kiyaku dt {
  font-size: 129%;
  font-weight: 700;
  margin: 0 0 3%;
  position: relative;
  padding: 0 0 0 .8em;
}
.dl_kiyaku dt::before {
  content: "●";
  position: absolute;
  left: 0;
  top: 1.4em;
  color: #e1361f;
  font-size: 50%;
  line-height: 1
}
/**/
.h_back {
  width: 100px;
  background: url(../img/game/btn_back--huti.svg) no-repeat center bottom;
  background-size: 100% auto;
  padding: 0 0 6px;
  margin: auto;
  position: absolute;
  z-index: 10;
  left: 15px;
  top: 12px;
}
.h_back a {
  display: block;
  width: 100%;
  height: 0;
  padding: 22% 00;
  background-image: url(../img/game/btn_back02.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% auto;
  overflow: hidden;
  white-space: nowrap;
  text-indent: 150%;
  position: relative;
  transition: all .5s;
}
#page_game main.bg_maker::before {
  display: none;
}
.block_game .area_maker {
  padding: 28% 0 24%;
  background: url(../img/game/bg_maker_sp.svg) no-repeat center;
  background-size: cover;
}
.block_game .list_makerCalpas li {
  position: absolute;
  left: 0;
  right: 0;
  margin: auto;
  z-index: 3;
  transform-origin: center;
  -webkit-animation: kanransya 10s linear 0s infinite;
  animation: kanransya 10s linear 0s infinite;
}
.block_game .list_makerCalpas li:nth-child(1) {
  width: 8%;
  top: 5%;
}
.block_game .list_makerCalpas li:nth-child(2) {
  width: 8%;
  right: -60%;
  bottom: 6%;
}
.block_game .list_makerCalpas li img {
  width: 100%;
  vertical-align: top;
}
.block_game .area_maker .maker_bg {
  position: relative;
  box-sizing: border-box;
  background: -moz-linear-gradient(top, #ffffff 0%, #ffffff 80%, transparent 80%, transparent 100%);
  background: -webkit-linear-gradient(top, #ffffff 0%, #ffffff 80%, transparent 80%, transparent 100%);
  background: linear-gradient(to bottom, #ffffff 0%, #ffffff 80%, transparent 80%, transparent 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#000000', GradientType=0);
}
.block_game .area_maker .maker_bg::before {
  content: '';
  width: 120%;
  height: 20%;
  position: absolute;
  top: -5%;
  left: 50%;
  transform: translateX(-50%);
  background: #fff;
  border-radius: 50%;
}
.block_game .area_maker .maker_bg::after {
  content: '';
  width: 120%;
  height: 25%;
  position: absolute;
  bottom: -4%;
  left: 50%;
  transform: translateX(-50%);
  background: #fff;
  border-bottom-left-radius: 50%;
  border-bottom-right-radius: 50%;
}
.block_game .area_maker .inner {
  position: relative;
  z-index: 5;
}
.block_game .area_maker .inner::after {
  content: '';
  width: 32%;
  height: 0;
  padding: 29% 0 0;
  background: url(../img/game/fukidasi_maker.svg) no-repeat center;
  background-size: contain;
  position: absolute;
  right: -2%;
  top: -13%;
}
.block_game .area_maker .maker--base .base_illust {
  height: 0;
  padding: 60% 0 0;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  margin: 0 0 4%;
  position: relative;
}
.block_game .area_maker .maker--base .base_illust.color01 {
  background-image: url(../img/game/color01.png);
  animation: pyon .3s ease 1 forwards;
}
.block_game .area_maker .maker--base .base_illust.color02 {
  background-image: url(../img/game/color02.png);
  animation: pyon .3s ease 1 forwards;
}
.block_game .area_maker .maker--base .base_illust.color03 {
  background-image: url(../img/game/color03.png);
  animation: pyon .3s ease forwards;
}
.block_game .area_maker .maker--base .base_illust.color04 {
  background-image: url(../img/game/color04.png);
  animation: pyon .3s ease forwards;
}
.block_game .area_maker .maker--base .base_illust.color05 {
  background-image: url(../img/game/color05.png);
  animation: pyon .3s ease forwards;
}
.block_game .area_maker .maker--base .base_illust.color06 {
  background-image: url(../img/game/color06.png);
  animation: pyon .3s ease forwards;
}
.block_game .area_maker .maker--base .base_illust.color07 {
  background-image: url(../img/game/color07.png);
  animation: pyon .3s ease forwards;
}
.block_game .area_maker .maker--base .base_illust.color08 {
  background-image: url(../img/game/color08.png);
  animation: pyon .3s ease forwards;
}
.block_game .list_makerFlow {
  text-align: center;
  margin: 0 0 5%;
}
.block_game .list_makerFlow li {
  display: inline-block;
  width: 16px;
  height: 16px;
  border: solid 2px #f9e400;
  box-sizing: border-box;
  border-radius: 50%;
  text-align: center;
  line-height: 10px;
  font-size: 16px;
  font-weight: 400;
  font-family: "panda";
  color: #fff;
  position: relative;
}
.block_game .list_makerFlow li + li {
  margin: 0 0 0 30px;
}
.block_game .list_makerFlow li + li::before {
  content: '';
  width: 18px;
  height: 10px;
  background: url(../img/game/arrow.svg) no-repeat center;
  background-size: contain;
  position: absolute;
  left: -28px;
  top: 0;
  bottom: 0;
  margin: auto;
}
.block_game .list_makerFlow li.active {
  background: #dc4b2c;
  border-color: #dc4b2c;
  color: #fff;
  width: 32px;
  height: 32px;
  line-height: 28px;
}
.list_inputColor {
  text-align: center;
  display: flex;
  flex-wrap: wrap;
}
.list_inputColor li {
  width: 23%;
  margin: 4% 1%;
  position: relative;
}
.list_inputColor li input {
  opacity: 0;
  width: 0;
  height: 0;
  position: absolute;
  left: 0;
  top: 0;
}
.list_inputColor li label {
  display: block;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  cursor: pointer;
  position: relative;
  vertical-align: top;
  margin: auto;
}
.list_inputColor li label::before {
  content: '';
  width: calc(100% + 10px);
  height: calc(100% + 10px);
  box-sizing: border-box;
  border: solid 5px #000;
  position: absolute;
  left: -5px;
  top: -5px;
  border-radius: 50%;
  opacity: 0;
  transform: scale(0.8);
  transition: all .5s;
}
.list_inputColor li input:checked + label::before {
  opacity: 1;
  transform: scale(1);
}
.list_inputColor li.color01 label {
  background: #f7e22b;
}
.list_inputColor li.color02 label {
  background: #66ccff;
}
.list_inputColor li.color03 label {
  background: #cc6600;
}
.list_inputColor li.color04 label {
  background: #ff9900;
}
.list_inputColor li.color05 label {
  background: #ff99cc;
}
.list_inputColor li.color06 label {
  background: #00cc33;
}
.list_inputColor li.color07 label {
  background: #ff5151;
}
.list_inputColor li.color08 label {
  background: #cc99ff;
}
.block_game .area_maker .maker--base .base_input .input_bg {
  background: #fff8c2;
  padding: 4% 5% 2%;
  border-radius: 15px;
  width: 75%;
  margin: auto;
  box-sizing: border-box;
}
.block_game .area_maker .maker--base.step02 .base_input .input_bg {
  width: 100%;
  padding: 3%;
}
.block_game .area_maker .maker--base.step03 .base_input .input_bg {
  width: 100%;
  padding: 3%;
}
.block_game .area_maker .maker--base .maker_lead {
  text-align: center;
  font-size: 150%;
  font-family: "panda";
  margin: 0 0 3%;
}
.block_game .area_submit {
  width: 200px;
  margin: auto;
}
.block_game .area_submit .btn_submit {
  width: 200px;
  height: 95px;
  display: block;
  margin: 7% auto 0;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: none;
  background-color: #9b0b00;
  background-image: url(../img/game/btn_ok.svg);
  background-size: contain;
  background-repeat: no-repeat;
  cursor: pointer;
  overflow: hidden;
  text-indent: 150%;
  border-radius: 47%;
  box-sizing: border-box;
}
.block_game .area_submit .btn_submit.submit--last {
  background-image: url(../img/game/btn_end--on.svg);
}
.block_game .area_submit .btn_submit:disabled {
  background-color: #808080;
  background-image: url(../img/game/btn_off.svg);
  pointer-events: none;
}
.block_game .area_submit .btn_submit.submit--last:disabled {
  background-image: url(../img/game/btn_end.svg);
}
.block_game .area_maker .maker--base .input_active > span::before {
  content: '';
  width: calc(100% + .5em);
  height: 100%;
  position: absolute;
  left: -.25em;
  top: 0;
  background-position: 0 0, 0 0, 100% 0, 0 100%;
  background-repeat: no-repeat;
  background-image: repeating-linear-gradient(0deg, #e1361f, #e1361f 5px, transparent 5px, transparent 10px), repeating-linear-gradient(90deg, #e1361f, #e1361f 5px, transparent 5px, transparent 10px), repeating-linear-gradient(180deg, #e1361f, #e1361f 5px, transparent 5px, transparent 10px), repeating-linear-gradient(270deg, #e1361f, #e1361f 5px, transparent 5px, transparent 10px);
  background-size: 2px calc(100% + 5px), calc(100% + 5px) 3px, 3px calc(100% + 5px), calc(100% + 5px) 2px;
  -webkit-animation: boxBorderAnimation 1s infinite linear;
  animation: boxBorderAnimation 1s infinite linear;
}
@-webkit-keyframes boxBorderAnimation {
  from {
    background-position: 0 0, 120px 0, 100% -10px, 0 100%;
  }
  to {
    background-position: 0 -10px, 0 0, 100% 0, -10px 100%;
  }
}
@keyframes boxBorderAnimation {
  from {
    background-position: 0 0, -10px 0, 100% -10px, 0 100%;
  }
  to {
    background-position: 0 -10px, 0 0, 100% 0, -10px 100%;
  }
}
.block_game .area_maker .maker--base .area_nameInput {
  width: 56%;
  position: absolute;
  left: 23%;
  top: 7%;
  text-align: center;
}
.block_game .area_maker .maker--base .area_nameInput > span {
  font-size: 145%;
  text-align: center;
  display: inline-block;
  vertical-align: middle;
  min-width: .6em;
  min-height: 1em;
  height: 100%;
  line-height: 1;
  position: relative;
  letter-spacing: -.1em;
  margin: 1px 0 0;
}
.block_game .area_maker .maker--base .area_nameInput > span > span {
  position: relative;
  -webkit-text-stroke: 6px #000;
  text-stroke: 6px #000;
  font-family: 'DF-MaruMojiSQ-W12';
  font-weight: 400;
}
.block_game .area_maker .maker--base .area_nameInput > span small {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  color: #000;
  line-height: 1;
  font-size: 100%;
  -webkit-text-stroke: 0px #000;
  text-stroke: 0px #000;
}
.block_game .area_maker .maker--base .area_nameInput > span span:nth-child(1) small {
  color: #0096d6;
}
.block_game .area_maker .maker--base .area_nameInput > span span:nth-child(2) small {
  color: #ae4634;
}
.block_game .area_maker .maker--base .area_nameInput > span span:nth-child(3) small {
  color: #fbe600;
}
.block_game .area_maker .maker--base .area_nameInput > span span:nth-child(4) small {
  color: #e56900;
}
.block_game .area_maker .maker--base .area_nameInput > span span:nth-child(5) small {
  color: #e99aba;
}
.block_game .area_maker .maker--base .area_nameInput > span span:nth-child(6) small {
  color: #2fa138;
}
.block_game .area_maker .maker--base .area_nameInput img {
  width: 35%;
  display: inline-block;
  vertical-align: middle;
  margin: 0 0 0 1px;
}
.block_game .area_maker .maker--base .area_tasteInput {
  position: absolute;
  left: 28%;
  bottom: 7.5%;
  width: 47%;
  height: 1.8em;
  text-align: center;
}
.block_game .area_maker .maker--base .area_tasteInput > span {
  font-family: 'DF-MaruMojiSQ-W12';
  font-weight: 400;
  text-align: center;
  display: inline-block;
  vertical-align: middle;
  width: 100%;
  height: 100%;
  min-width: 0.6em;
  min-height: 1.8em;
  position: relative;
  color: #000000;
  letter-spacing: -.1em;
  font-size: 125%;
}
.block_game .area_maker .maker--base .area_tasteInput > span small {
  display: none;
}
.block_game .area_maker .maker--base .name_inputWrap {
  background: url(../img/game/name.svg) no-repeat right 5% center;
  background-size: 25% auto;
}
.block_game .area_maker .maker--base .name_inputWrap input {
  width: 63%;
  height: 55px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: none;
  background: #fff;
  border-radius: 6px;
  text-align: center;
  font-size: 150%;
  font-weight: 700;
  color: #666;
  margin: 0 0 0 5%;
}
.block_game .area_maker .maker--base .taste_inputWrap input {
  width: 100%;
  height: 55px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: none;
  background: #fff;
  border-radius: 6px;
  text-align: center;
  font-size: 150%;
  font-weight: 700;
  color: #666;
}
/*----------*/
.block_game.maker--end .area_sns {
  margin: -60% 0 0;
}
.block_game.maker--end .area_sns::before {
  display: none;
}
.block_game.maker--end .area_maker {
  padding: 24% 0 30%;
  position: relative;
  z-index: 5;
  background: url(../img/game/bg_end_sp.svg) no-repeat center top 2%;
  background-size: contain;
}
.block_game.maker--end .area_maker .inner::after {
  display: none;
}
.block_game.maker--end .area_maker .maker--base .base_illust {
  padding: 76% 0 0;
}
.block_game.maker--end .area_maker .maker_bg {
  padding: 5% 0;
  background: url(../img/game/download_bg_sp.svg) no-repeat center;
  background-size: cover;
}
.block_game.maker--end .area_maker .maker_bg::before, .block_game.maker--end .area_maker .maker_bg::after {
  display: none;
}
.block_game .area_download {
  position: relative;
  z-index: 10;
  padding: 80px 0 0;
}
.block_game .area_maker .download_title {
  width: 50%;
  margin: -10% auto 1%;
}
.block_game .area_maker .maker--base #calpas--front {
  padding: 46% 0 0;
  margin: 5% 0;
}
.block_game .area_maker .maker--base #calpas--front.color01 {
  background-image: url(../img/game/color01--front.png);
}
.block_game .area_maker .maker--base #calpas--front.color02 {
  background-image: url(../img/game/color02--front.png);
}
.block_game .area_maker .maker--base #calpas--front.color03 {
  background-image: url(../img/game/color03--front.png);
}
.block_game .area_maker .maker--base #calpas--front.color04 {
  background-image: url(../img/game/color04--front.png);
}
.block_game .area_maker .maker--base #calpas--front.color05 {
  background-image: url(../img/game/color05--front.png);
}
.block_game .area_maker .maker--base #calpas--front.color06 {
  background-image: url(../img/game/color06--front.png);
}
.block_game .area_maker .maker--base #calpas--front.color07 {
  background-image: url(../img/game/color07--front.png);
}
.block_game .area_maker .maker--base #calpas--front.color08 {
  background-image: url(../img/game/color08--front.png);
}
.block_game .area_maker .maker--base #calpas--front .area_nameInput {
  top: 12%;
}
.block_game .area_maker .btn_download input {
  width: 200px;
  height: 95px;
  display: block;
  margin: -1% auto 0;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: none;
  background-color: #9b0b00;
  background-image: url(../img/game/btn_download.svg);
  background-repeat: no-repeat;
  background-position: center top;
  background-size: contain;
  cursor: pointer;
  overflow: hidden;
  text-indent: 150%;
  transition: all .5s;
  border-radius: 47%;
  box-sizing: border-box;
}
/*---------- zukan ----------*/
.block_zukan {
  position: relative;
  z-index: 5;
  overflow: hidden;
}
.whiteEgg {
  position: relative;
  background: #fff;
  margin: 20% 0 35%;
}
.whiteEgg::before {
  content: '';
  width: 200%;
  height: 116%;
  background: #fff;
  position: absolute;
  left: 50%;
  top: -8%;
  transform: translateX(-50%);
  border-radius: 50%;
}
.whiteEgg .inner {
  position: relative;
  z-index: 5;
}
.block_zukan .area_himitu::before {
  width: 300%;
  height: 110%;
  top: -5%;
}
.block_zukan .area_himitu .img_base {
  width: 80%;
	max-width: 360px;
  margin: 0 auto 10%;
  position: relative;
}
.block_zukan .area_himitu .img_base .line {
  position: absolute;
}
.block_zukan .area_himitu .img_base .line img {
  max-width: none;
  width: 100%;
  position: relative;
  z-index: 5;
}
.block_zukan .area_himitu .img_base .line01 {
  width: 49%;
  left: -3%;
  top: -9%;
}
.block_zukan .area_himitu .img_base .line02 {
  width: 36%;
  top: 52%;
  left: -10%;
}
.block_zukan .area_himitu .img_base .line03 {
  width: 11%;
  left: 72%;
  top: -15%;
}
.block_zukan .area_himitu .img_base .line04 {
  width: 17%;
  left: 50%;
  top: 34%;
}
.block_zukan .area_himitu .img_base .base_text {
	    font-family: 'panda';
	line-height: 1;
	font-size: 150%;
	position: absolute;
}
.block_zukan .area_himitu .img_base .base_text.text01 {
	left:10%;
	top:-7%;
}
.block_zukan .area_himitu .img_base .base_text.text02 {
	left:-10%;
	bottom:2%;
}
.block_zukan .area_himitu .img_base .base_text.text03 {
	right:-11%;
	top:-13%;
}
.block_zukan .area_himitu .img_base .base_text.text04 {
	right:-17%;
	bottom:2%;
}
.block_zukan .area_himitu .list_zukanHimitu li {
  margin: 0 0 8%;
}
.list_zukanHimitu li .title {
  font-family: 'panda';
  font-size: 200%;
  line-height: 1.4;
  position: relative;
  padding: 0 0 0 1.8em;
  margin: 0 0 10px;
}
.list_zukanHimitu li .title::before {
  content: '';
  width: 1.5em;
  height: 1.5em;
  background: #e1361f;
  position: absolute;
  left: 0;
  top: 0;
  border-radius: 50%;
}
.list_zukanHimitu li .title::after {
  content: '';
  font-family: "ttc";
  font-weight: 700;
  color: #fff;
  position: absolute;
  line-height: 1.6em;
  left: 0;
  top: 0;
  width: 1.5em;
  text-align: center;
}
.list_zukanHimitu li:nth-child(1) .title::after {
  content: '1';
}
.list_zukanHimitu li:nth-child(2) .title::after {
  content: '2';
}
.list_zukanHimitu li:nth-child(3) .title::after {
  content: '3';
}
.list_zukanHimitu li:nth-child(4) .title::after {
  content: '4';
}
.list_zukanHimitu li .text {
  font-size: 106.7%;
}
.block_zukan .area_himitu .himitu_img01 {
  width: 80%;
  margin: auto;
  padding: 0 0 0 10%;
}
.block_zukan .area_himitu .himitu_img02 {
  width: 60%;
  margin: 0 auto 3%;
}
/**/
.block_zukan .area_nakama {
  margin: 15% 0 35%;
  position: relative;
}
.block_zukan .area_nakama::after {
  content: '';
  width: 100%;
  height: 0;
  padding: 29% 0 0;
  background: url(../img/zukan/bg_zukan_sp01.svg) no-repeat center;
  background-size: contain;
  position: absolute;
  z-index: 0;
  left: 0;
  top: -43%;
}
.list_nakama {
  margin: auto;
  overflow: hidden;
  padding: 5% 0;
}
.list_nakama li {
  float: left;
  width: 20%;
  box-sizing: border-box;
  padding: 2%;
}
/**/
.block_zukan .area_zukan {
  position: relative;
}
.block_zukan .area_zukan::after {
  content: '';
  width: 100%;
  height: 0;
  padding: 44% 0 0;
  background: url(../img/zukan/bg_zukan_sp02.svg) no-repeat center;
  background-size: contain;
  position: absolute;
  z-index: 0;
  left: 0;
  top: -26%;
}
.block_zukan .area_zukan .zukan_lead {
  text-align: center;
  font-weight: 500;
  margin: 0 0 8%;
}
.block_zukan .area_zukan .filmWrap {
  overflow: hidden;
  margin: auto;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.list_zukanFilm {
  width: 49%;
}
.list_zukanFilm:last-child {
  width: 100%;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}
.list_zukanFilm:last-child li {
  width: 49%;
  margin: 0 0 2%;
}
.list_zukanFilm:last-child li:nth-child(2), .list_zukanFilm:last-child li:nth-child(4) {
  margin: 0 0 2% 2%;
}
.list_zukanFilm li {
  position: relative;
  margin: 0 0 4% 0;
}
.list_zukanFilm li img {
  vertical-align: top;
}
.list_zukanFilm span {
  position: absolute;
  left: 32%;
  top: 29%;
  z-index: 5;
  display: block;
  font-weight: 700;
  font-size: 81.25%;
  transition: all .5s;
}
.list_zukanFilm li::before {
  content: '';
  width: 7%;
  height: 19%;
  position: absolute;
  left: 5%;
  top: 10%;
  transition: all .5s;
  transform-origin: right bottom;
}
.block_zukan .filmWrap .list_zukanFilm:nth-child(1) li::before {
  background: #f1de24;
}
.block_zukan .filmWrap .list_zukanFilm:nth-child(2) li::before {
  background: #f6d7e4;
}
.block_zukan .filmWrap .list_zukanFilm:nth-child(3) li::before {
  background: #b4e2f2;
}
.block_zukan .filmWrap .list_zukanFilm:nth-child(4) li::before {
  background: #ed964c;
}
.block_zukan .filmWrap .list_zukanFilm:nth-child(5) li::before {
  background: #84c788;
}