nav#submenu a{
  width:33%;
}

.img_popup{
  display:inline-block;
  border:1px #900 solid;
  background-color:#FFF;
  padding:0 5px;
  font-weight:bold;
  text-decoration:none;
  color:#900;
  border-radius:4px;
}

/*---main--*/
.box{
  background-repeat:repeat;
  background-image:url(../images/common/stripe_bg.png);
  background-attachment:fixed;
  padding:2%;
}

.box .box_info{
  background-color: rgba(255,255,255,0.75);
  position:relative;
  padding:2%;
  margin-top:-3vw;
  border-radius:5px;
  box-shadow:5px 5px rgba(0,0,0,0.2);
}

.box .box_info h4{
  font-size:120%;
  margin-top:3%;
  margin-bottom:0.5%;
}
.box .box_info h4:first-child{
  margin-top:0;
}
.box .box_info ul{
  margin:0;
  padding:0;
  margin-left:1.5em;
}

.box .box_info ul li{
  margin-bottom:0.5%;
  font-size:80%;
}
.box .box_img{
  display:block;
  width:100%;
  max-width:1000px;
  margin:2% auto;
}

.info_early{
  background-color:rgba(152,14, 48, 0.7);
  color:#FFF;
  padding:1%;
  border-radius:3px;
  margin-top:3%;
}
.info_early h4{
  text-align:center;
  font-size:160% !important;
}

.info_early h4:after{
  content:"（早期予約の受付は終了しました）";
  color: #FF0;
  font-weight:bold;
  padding:0 5px;
  display:block;
  margin-left:2px;
  font-size:60%;
}
.info_early .screenshots a{
  color:#FFF;
  line-height:1.7;
  font-weight:normal;
}

.box .box_order{
  display:flex;
  flex-flow: row wrap;
  margin-top:3%;
}
.box .box_order a{
  display:inline-block;
  border-radius:5px;
  text-align:center;
  padding:2%;
  color:#FFF;
  text-decoration: none;
  line-height: 1.0;
  font-size:150%;
  position:relative;
  height:80px;
  margin:1%;
  font-weight:bold;
  border:1px #FFF solid;
  box-shadow:0 0 3px rgba(0,0,0,0.5);
  color:#FFF;
  text-shadow:0 0 3px rgba(0,0,0,0.8),0 0 5px rgba(0,0,0,0.5),0 0 8px rgba(0,0,0,0.3);
}

.box .box_order a>span{
  display:inline-block;
  width:100%;
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
}

.box .box_order a.order_gc{width:60%;}
.box .box_order a.order_shops{width:35%;font-size:120%;}

.ano_item{
  border:1px #d4c87a solid;
  background-color:#e8deab;
  font-size:75%;
  padding:0 5px;
  display:inline-block;
  vertical-align: 1px;
}

.screenshots a{
  width:24.1%;
}
.screenshots a:after{
  top:-6px;
}

#box_ano{background-color: rgb(234, 225, 201);}
#box_fv{background-color: rgb(86, 135, 219);}
#box_as{background-color: rgb(227, 196, 66);}

#box_ano .box_order a{background:linear-gradient(-45deg,rgba(154, 144, 110, 1) 50%,rgba(208, 199, 140, 1) 50.5%);}
#box_fv .box_order a{background:linear-gradient(-45deg,rgba(49, 97, 168, 1) 50%,rgba(92, 152, 255,1) 50.5%);}
#box_as .box_order a{background:linear-gradient(-45deg,rgba(170, 141, 42, 1) 50%,rgba(244, 221, 123, 1) 50.5%);}

#package{
  padding:2%;
  background:linear-gradient(to bottom,#FFF,#EEE);
}
#package .content{
  display:flex;
  flex-flow: wrap row;
  justify-content:center;
  text-align: center;
}
#package .content h3{
  display:block;
  width:100%;
  font-size:200%;
  margin-top:0;
}
#package .content .package_info{width:30%;margin:0 6%;}
#package .content .package_info img{width:100%;box-shadow:5px 5px 0 rgba(0,0,0,0.2);}
#package .content .package_info h5{margin:2% 0;}
#package .content .package_info .package_order .package_price{
}
#package .content .package_info .package_order .package_price span{
  display:block;
  font-size:60%;
}
#package .content .package_info .package_order a{
  display: block;
  border:1px #AAA solid;
  background-color:rgba(255,255,255,0.8);
  color:#222;
  text-decoration:none;
  padding:3% 2% 2.5%;
  margin-top:0.5%;
  border-radius:4px;
}

@media screen and (max-width:767px){
  .box .box_order a{
    width:100% !important;
    height:60px;
  }
  .box .box_order a:last-child{
    height:45px;
  }
  .box .box_img{
    width: 118%;
    margin-left:-9%
  }

  .screenshots a{width:48.5%;}


  #package .content .package_info{width:46%;margin:0 2%;}
  #package .content .package_info{font-size:2.5vw;}

}