@charset "UTF-8";
/* ---------------------------------- */
/* layout.css                         */
/* ---------------------------------- */


/* =================================
   @MAIN
================================= */
#mainvisual{
  position: relative;
  background: url(../images/shared/mv.jpg) no-repeat center top;
  background-size: cover;
  width: 100%;
  height: 700px;
}
#mainvisual p{
  position: absolute;
}
#mainvisual p.info{
  bottom: -70px;
  left: 50%;
  margin-left: -375px;
}
#mainvisual p.thanks{
  bottom: -210px;
  left: 50%;
  margin-left: -375px;
}
#mainvisual p img{
  width: 100%;
  height: auto;
}
#mainvisual h2 {
  position: absolute;
  left: 50%;
  bottom: 20px;
  margin-left: -375px;
}
#mainvisual .grad {
  position: absolute;
  background: url(../images/shared/grad.png) repeat-x 0 center;
  bottom: 0;
  width: 100%;
  height: 188px;
}

#mainvisual .detail {
  text-align: center;
  padding: 0 0 48px;
  margin: 247px 0 0;
}

.btn a:hover,.btn a:visited,.btn a:focus,.btn a:active{
  outline: none;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  tap-highlight-color: rgba(0,0,0,0);
}

@media (max-width: 750px) {
#mainvisual{
  width: 750px;
  height: 360px;
}
#mainvisual h2 {
  bottom: -150px;
}
#mainvisual p.info{
  bottom: -250px;
}
}

/* =================================
   @CONTENTS
================================= */

section{
  position: relative;
  margin: 0px auto 0;
  padding: 150px 0 0;
  overflow: hidden;
}

section h3{
  position: absolute;
  top: 70px;
  left: 50%;
  margin-left: -424px;
}

section .line{
  background: #ff3b72;
  width: 100%;
  height: 4px;
  margin-bottom: 80px;
}

#about_area{
  padding: 150px 0 60px;
}

#about_area .btn_area{
  position: relative;
}

#about_area .btn_area p:last-child{
  position: absolute;
  bottom: 40px;
  left: 50%;
  margin-left: -135px;
}

#ticket_area{
  padding: 150px 0 70px;
}

#ticket_area .btn_area{
  position: relative;
}

#ticket_area .btn_area p:last-child{
  position: absolute;
  top: 130px;
  left: 50%;
  margin-left: -306px;
}

#ticket_area h3{
  top: 70px;
}

#ticket_area02{
  position: relative;
  background: #f9f9f9;
  margin: 25px 0 0;
  padding: 80px 0 100px;
}

#ticket_area02 h4{
  position: absolute;
  top: -25px;
}

#ticket_area02 ul{
  width: 675px;
  margin: 30px auto;
}
#ticket_area02 ul li{
  float: left;
  margin-right: 22px;
}
#ticket_area02 ul li:last-child{
  margin-right: 0;
}

#day_ticket_area{
  position: relative;
  background: #eeeeee;
  padding: 80px 0 60px;
}

#day_ticket_area h4 {
  position: absolute;
  top: -25px;
}

#privilege_area{
  padding: 150px 0 60px;
}

#attraction_area{
  padding: 150px 0 60px;
}

#attraction_area .btn_area{
  position: relative;
}

#attraction_area .btn_area p:last-child{
  position: absolute;
  bottom: 27px;
  left: 50%;
  margin-left: -311px;
}
#attraction_area .btn_area #purple {
  bottom: 1495px;
  margin-left: -135px;
}

#goods_area{
  padding: 150px 0 60px;
}

#goods_area .btn_area{
  position: relative;
}

#goods_area .btn_area p:last-child{
  position: absolute;
  top: 470px;
  left: 50%;
  margin-left: -330px;
}

#contents .news_area{
  width: 708px;
  margin: 40px auto 0;
}

#contents .news_area a{
  color: #5d5d5d;
  text-decoration: underline;
}

#contents .news_area a:hover{
  color: #5d5d5d;
  text-decoration: none;
}

#contents .news_area dl{
  padding: 20px;
  border: 4px solid #ff3b72;
  border-radius: 0px 0px 10px 10px;
  color: #000;
}

#contents .news_area dl dt{
  color: #ff3b72;
  font-size: 22px;
  -webkit-text-size-adjust: 100%;
  font-weight: bold;
}

#contents .news_area dl dd{
  font-size: 18px;
  -webkit-text-size-adjust: 100%;
}

@media (max-width: 750px) {

section{
  padding: 230px 0 0;
}

section h3{
  top: 70px;
}

section .line{
  display: none;
}

#about_area{
  padding: 230px 0 60px;
}

#ticket_area{
  padding: 230px 0 70px;
}

#privilege_area{
  padding: 230px 0 60px;
}

#attraction_area{
  padding: 230px 0 60px;
}

#goods_area{
  padding: 230px 0 60px;
}

}


/* 概要
---------------------- */
.container .about{
  margin: 10px 0 20px;
}
.container .about em{
  color: #ff3d73;
}

.container .period{
  background-color: #fff7f7;
  border-radius: 10px;
  width: 670px;
  padding: 52px 0 15px;
  margin: -43px auto 30px;
}
.container .period dl {
  width: 535px;
  margin: 0 auto 15px;
}
.container .period dt,
.container .period dd {
  float: left;
}
.container .period dt {
  background-color: #ff3b72;
  border-radius: 20px;
  width: 170px;
  font-size: 18px;
  color: #fff;
  text-align: center;
  line-height: 1;
  padding: 5px 0 3px;
  margin: 5px 0 0;
}
.container .period dd {
  margin: 0 0 0 10px;
}