/*1300px-----------------------------------------*/


@media only screen and (max-width: 1300px) {


#lineup .artist_wrap.clr:after {
	content : ' ';
	display : inline;
	clear : none;
	height: auto;
}

#lineup .artist_wrap.large {
	width: 1100px;
	margin: 0 auto;
	overflow: hidden;
}
#lineup .artist_wrap {
	width: 900px;
	margin: 0 auto;
}
#lineup .artist_wrap.small{
	width: 300px;
	margin: 0 auto;
}

#lineup .artist_wrap div.artist{
	float: left;
	text-align: center;
	width: 33%;
	padding: 0 10px;
	margin-bottom: 45px;
	position: relative;
}
#lineup .artist_wrap.large div.artist{
	float: left;
	text-align: center;
	width: 25%;
	padding: 0 10px;
	margin-bottom: 45px;
	position: relative;
}
#lineup .artist_wrap div.artist img.new{
	display: block;
	position: absolute;
	top:0px;
	left: 0;
}


}



/*1200px-----------------------------------------*/


@media only screen and (max-width: 1200px) {


header .inner{
	width: 100%;
	margin: 0 auto;
	padding: 0 0 80px 0;
	background: url(../img/header_bg_illust.png) no-repeat;
}

}




/*970px-----------------------------------------*/


@media only screen and (max-width: 970px) {

#contents_wrap,
#contents_wrap_goods{
	width: 95%;
}

#lineup .artist_wrap.clr:after {
	content : ' ';
	display : inline;
	clear : none;
	height: auto;
}

#lineup .artist_wrap .artist_img {
	height: auto;
}

#lineup .artist_wrap,
#lineup .artist_wrap.large,
#lineup .artist_wrap.small{
	width: 90%;
	margin: 0 auto;
}

#lineup .artist_wrap .a_inner{
	width: calc(100% + 5%);
	margin-bottom: 60px;
}

#lineup .artist_wrap div.artist,
#lineup .artist_wrap.large div.artist{
	float: left;
	text-align: center;
	width: 50%;
	padding-right: 5%;
	margin-bottom: 35px;
	position: relative;
}
#lineup .artist_wrap.small div.artist{
	float: none;
	text-align: center;
	width: 50%;
	margin: 0 auto 35px;
	position: relative;
}

#lineup .artist_wrap.topics{
	padding-top: 50px;
}

#lineup .artist_wrap.topics div.artist{
	width: 50%;
}

section#timetable,
section#timetable img.timetable {
	width: 100% !important;
}
.bird01 {
	position: absolute;
	right: 50px;
	top: -45px;
}
.bird01 img {
	width: 30px;
}

#museum .museum_wrap,
#museum .museum_wrap.large,
#museum .museum_wrap.small{
	width: 90%;
	margin: 0 auto;
}

#museum .museum_wrap .a_inner{
	width: calc(100% + 5%);
}

#museum .museum_wrap div.museum,
#museum .museum_wrap.large div.museum{
	float: left;
	text-align: center;
	width: 50%;
	padding-right: 3%;
	margin-bottom: 20px;
	position: relative;
}
#museum .museum_wrap.small div.museum{

	text-align: center;
	width: 50%;
	margin: 0 auto 20px;
	position: relative;
}


}



/*768px-----------------------------------------*/


@media only screen and (max-width: 768px) {

header .inner{
	background: url(../img/header_bg_illust_sp.png) no-repeat center top;
	background-size: contain;
}

h1{
	width: 95%;
	margin: 0 auto;
}

h1 img{
	width: 100%;
	height: auto;
}

#ship{
	width: 30%;
	right: -15%;
 }

#ship img{
	width: 100%;
	height: auto;
 }
 

footer .inner,
footer .inner2{
	width: 90%;
	margin: 0 auto;
}

footer #logo_area div{
	width: 100%;
	float: none;
	padding-left: 0;
	border-right: none;
}
footer #logo_area div:last-child{
	float: none;
	width: 100%;	
	border-right:none;
	padding-right: 0;
}
footer #logo_area div img{
	width: auto;
	height: auto;
	display: inline;
}
footer #logo_area div a{
	display: inline;
}


footer #logo_area div:last-child img{
	width: auto;
	height: auto;
}

section h2{
	top: 0px;

}

.topics img {
	width: 90%;
}

.title_otodamarina img {
	width: 100%;
}

.soldout {
	text-align: center;
	font-size: 16px;
	margin: 0 0 20px;
}
section#ticket th,
section#ticket td{
	display: block;
}

section#ticket td{
	margin-bottom: 12px;
}

section#ticket td.price span{
	display: block;
	padding-left: 0px;
}
.tb-ticket {
	width: 100%;
}
section#ticket .tb-ticket th,
section#ticket .tb-ticket td{
	display: table-cell;
}


#bringing img,
#info p img {
	width: 100%;
}

}



/*640px-----------------------------------------*/


@media only screen and (max-width: 640px) {

#ship{
	width: 48%;
	right: -30%;
 	bottom: 3%;
}

 
@keyframes fuwafuwa{
  0%{bottom: 3%;right: -20%; transform: rotateY(0deg);}
  5%{bottom: 3%;right: -10%; transform: rotateY(0deg);}
  10%{bottom: 6%;right: 0%; transform: rotateY(0deg);}
  15%{bottom: 3%;right: 10%; transform: rotateY(0deg);}
  20%{bottom: 6%;right: 20%; transform: rotateY(0deg);}
  25%{bottom: 3%;right: 30%; transform: rotateY(0deg) rotate(6deg);}
  30%{bottom: 6%;right: 40%; transform: rotateY(0deg);}
  35%{bottom: 3%;right: 50%; transform: rotateY(0deg) rotate(0deg);}
  40%{bottom: 6%;right: 60%; transform: rotateY(0deg);}
  45%{bottom: 3%;right: 70%; transform: rotateY(0deg) rotate(6deg);}
  50%{bottom: 6%;right: 80%; transform: rotateY(0deg);}
  51%{bottom: 3%;right: 80%; transform: rotateY(180deg);}
  55%{bottom: 6%;right: 70%; transform: rotateY(180deg) rotate(0deg);} 
  60%{bottom: 3%;right: 60%; transform: rotateY(180deg);}
  65%{bottom: 6%;right: 50%; transform: rotateY(180deg) rotate(6deg);}
  70%{bottom: 3%;right: 40%; transform: rotateY(180deg);}
  75%{bottom: 6%;right: 30%; transform: rotateY(180deg) rotate(0deg);}
  80%{bottom: 3%;right: 20%; transform: rotateY(180deg);}
  85%{bottom: 6%;right: 10%; transform: rotateY(180deg) rotate(6deg);}
  90%{bottom: 3%;right: 0%; transform: rotateY(180deg);} 
  95%{bottom: 6%;right: -10%; transform: rotateY(180deg);}
  100%{bottom:0%;right: -20%; transform: rotateY(180deg);}
}
 

@-webkit-keyframes fuwafuwa /* Safari and Chrome */{
  0%{bottom: 3%;right: -20%; -webkit-transform: rotateY(0deg);}
  5%{bottom: 3%;right: -10%; -webkit-transform: rotateY(0deg);}
  10%{bottom: 6%;right: 0%; -webkit-transform: rotateY(0deg);}
  15%{bottom: 3%;right: 10%; -webkit-transform: rotateY(0deg);}
  20%{bottom: 6%;right: 20%; -webkit-transform: rotateY(0deg);}
  25%{bottom: 3%;right: 30%; -webkit-transform: rotateY(0deg) rotate(6deg);}
  30%{bottom: 6%;right: 40%; -webkit-transform: rotateY(0deg);}
  35%{bottom: 3%;right: 50%; -webkit-transform: rotateY(0deg) rotate(0deg);}
  40%{bottom: 6%;right: 60%; -webkit-transform: rotateY(0deg);}
  45%{bottom: 3%;right: 70%; -webkit-transform: rotateY(0deg) rotate(6deg);}
  50%{bottom: 6%;right: 80%; -webkit-transform: rotateY(0deg);}
  51%{bottom: 3%;right: 80%; -webkit-transform: rotateY(180deg);}
  55%{bottom: 6%;right: 70%; -webkit-transform: rotateY(180deg) rotate(0deg);} 
  60%{bottom: 3%;right: 60%; -webkit-transform: rotateY(180deg);}
  65%{bottom: 6%;right: 50%; -webkit-transform: rotateY(180deg) rotate(6deg);}
  70%{bottom: 3%;right: 40%; -webkit-transform: rotateY(180deg);}
  75%{bottom: 6%;right: 30%; -webkit-transform: rotateY(180deg) rotate(0deg);}
  80%{bottom: 3%;right: 20%; -webkit-transform: rotateY(180deg);}
  85%{bottom: 6%;right: 10%; -webkit-transform: rotateY(180deg) rotate(6deg);}
  90%{bottom: 3%;right: 0%; -webkit-transform: rotateY(180deg);} 
  95%{bottom: 6%;right: -10%; -webkit-transform: rotateY(180deg);}
  100%{bottom:0%;right: -20%; -webkit-transform: rotateY(180deg);}
}
 
.apology_btn {
	width: 90%;
}
.apology_btn h2 {
	font-size: 15px;
	margin: 0 0 20px;
}
.apology_btn p {
	text-align: left;
	padding: 0 20px;
}

#illust_bottom_area img{
	zoom: 0.65;
	-moz-transform: scale(0.65,0.65);
 }



.illust_bottom_01{
	position: absolute;
	bottom: 0%;
	right: -40%;
	animation:fuwafuwa2 12s infinite normal linear;
	-webkit-animation:fuwafuwa2 12s infinite normal linear;
	-moz-animation:fuwafuwa2 12s infinite normal linear;
}

.illust_bottom_02{
	position: absolute;
	bottom: 0%;
	right: -40%;
	animation:fuwafuwa3 12s infinite 3s linear;
	-webkit-animation:fuwafuwa3 12s infinite 3s linear;
	-moz-animation:fuwafuwa3 12s infinite 3s linear;
 }

.illust_bottom_03{
	position: absolute;
	bottom: 0%;
	right: -40%;
	animation:fuwafuwa3 12s infinite 6s linear;
	-webkit-animation:fuwafuwa3 12s infinite 6s linear;
	-moz-animation:fuwafuwa3 12s infinite 6s linear;

}

.illust_bottom_04{
	position: absolute;
	bottom: 0%;
	right: -40%;
	animation:fuwafuwa2 12s infinite 9s linear;
	-webkit-animation:fuwafuwa2 12s infinite 9s linear;
	-moz-animation:fuwafuwa2 12s infinite 9s linear;
	zoom: 0.55!important;
	-moz-transform: scale(0.55,0.55)!important;
  } 
  
@keyframes fuwafuwa2{
  0%{bottom: -5%;right: -60%; transform: rotate(0deg)translateX(50%);}
  10%{bottom: -5%;right: -40%; transform: rotate(6deg) translateY(10%)translateX(50%);}
  20%{bottom: -2%;right: -20%; transform: rotate(0deg)translateX(50%);}
  30%{bottom: -2%;right: 0%; transform: rotate(6deg) translateY(10%)translateX(50%);}
  40%{bottom: -5%;right: 20%; transform: rotate(0deg)translateX(50%);}
  50%{bottom: -5%;right: 40%; transform: rotate(6deg) translateY(10%)translateX(50%);}
  60%{bottom: -2%;right: 60%; transform: rotate(0deg)translateX(50%);}
  70%{bottom: -2%;right: 80%; transform: rotate(6deg) translateY(10%)translateX(50%);}
  80%{bottom: -5%;right: 100%; transform: rotate(0deg)translateX(50%);}
  90%{bottom: -5%;right: 120%; transform: rotate(6deg) translateY(10%)translateX(50%);} 
  100%{bottom:-2%;right: 140%; transform: rotate(0deg)translateX(50%);}
}

@-webkit-keyframes fuwafuwa2{
  0%{bottom: -5%;right: -60%; transform: rotate(0deg)translateX(50%);}
  10%{bottom: -5%;right: -40%; transform: rotate(6deg) translateY(10%)translateX(50%);}
  20%{bottom: -2%;right: -20%; transform: rotate(0deg)translateX(50%);}
  30%{bottom: -2%;right: 0%; transform: rotate(6deg) translateY(10%)translateX(50%);}
  40%{bottom: -5%;right: 20%; transform: rotate(0deg)translateX(50%);}
  50%{bottom: -5%;right: 40%; transform: rotate(6deg) translateY(10%)translateX(50%);}
  60%{bottom: -2%;right: 60%; transform: rotate(0deg)translateX(50%);}
  70%{bottom: -2%;right: 80%; transform: rotate(6deg) translateY(10%)translateX(50%);}
  80%{bottom: -5%;right: 100%; transform: rotate(0deg)translateX(50%);}
  90%{bottom: -5%;right: 120%; transform: rotate(6deg) translateY(10%)translateX(50%);} 
  100%{bottom:-2%;right: 140%; transform: rotate(0deg)translateX(50%);}
}

@keyframes fuwafuwa3{
  0%{bottom: -5%;right: -60%; transform: rotate(0deg);}
  10%{bottom: -5%;right: -40%; transform: rotate(6deg) translateY(10%);}
  20%{bottom: -2%;right: -20%; transform: rotate(0deg);}
  30%{bottom: -2%;right: 0%; transform: rotate(6deg) translateY(10%);}
  40%{bottom: -5%;right: 20%; transform: rotate(0deg);}
  50%{bottom: -5%;right: 40%; transform: rotate(6deg) translateY(10%);}
  60%{bottom: -2%;right: 60%; transform: rotate(0deg);}
  70%{bottom: -2%;right: 80%; transform: rotate(6deg) translateY(10%);}
  80%{bottom: -5%;right: 100%; transform: rotate(0deg);}
  90%{bottom: -5%;right: 120%; transform: rotate(6deg) translateY(10%);} 
  100%{bottom:-2%;right: 140%; transform: rotate(0deg);}
} 

@-webkit-keyframes fuwafuwa3{
  0%{bottom: -5%;right: -60%; transform: rotate(0deg);}
  10%{bottom: -5%;right: -40%; transform: rotate(6deg) translateY(10%);}
  20%{bottom: -2%;right: -20%; transform: rotate(0deg);}
  30%{bottom: -2%;right: 0%; transform: rotate(6deg) translateY(10%);}
  40%{bottom: -5%;right: 20%; transform: rotate(0deg);}
  50%{bottom: -5%;right: 40%; transform: rotate(6deg) translateY(10%);}
  60%{bottom: -2%;right: 60%; transform: rotate(0deg);}
  70%{bottom: -2%;right: 80%; transform: rotate(6deg) translateY(10%);}
  80%{bottom: -5%;right: 100%; transform: rotate(0deg);}
  90%{bottom: -5%;right: 120%; transform: rotate(6deg) translateY(10%);} 
  100%{bottom:-2%;right: 140%; transform: rotate(0deg);}
}  



section{
	margin-bottom: 100px;
}

section#lineup{
	padding-top: 80px;
	margin-bottom: 80px;
}

section h2{
	top: -10px;

}

.openmenu .openmenu_nav_wrapper{
	padding: 20px 20px 13px;
}
.openmenu .openmenu_nav {
	padding-top: 30px;
	line-height: 1.5;
}
.openmenu .openmenu_nav li {
  font-size: 124%;
  font-weight: bold;
  margin-bottom: 22px;
}
.openmenu .openmenu_btn {
	width: 40px;
	height: 40px;
	top: 3%;
	right: 3%;
	padding: 11px;
}


.openmenu .openmenu_btn .toggle {
  margin-bottom: 6px;

}


.openmenu .openmenu_btn.active .toggle:nth-child(1) {
	transform:translate(3px , 3px) rotate(40deg);
	-moz-transform:translate(3px , 3px) rotate(40deg);
	-webkit-transform:translate(3px , 3px) rotate(40deg);
	-ms-transform:translate(3px , 3px) rotate(40deg);
}

.openmenu .openmenu_btn.active .toggle:nth-child(2) {
	opacity: 0;
}

.openmenu .openmenu_btn.active .toggle:nth-child(3) {
	transform:translate(2px , -1px) rotate(-40deg);
	-moz-transform:translate(2px , -1px) rotate(-40deg);
	-webkit-transform:translate(2px , -1px) rotate(-40deg);
	-ms-transform:translate(2px , -1px) rotate(-40deg);
}



.openmenu img{
	width: 90%;
	height: auto;
	margin: 0 auto;
}

.openmenu .logo_area img {
	width: 200px;
}

section .inner{
	background: url(../img/section_bg.png) repeat-y;
	background-size: contain;
	padding: 30px 10% 20px 10%;
}
section#ticket .inner{
	background-size: contain;
}


.btn img{
	width: 100%;
}

footer #banner_area img{
	margin-bottom: 20px;
}

footer #banner_area {
	text-align: center;
}
footer #banner_area img{
	margin: 10px 0;
} 


#lineup .artist_wrap .a_inner{
	width: 95%!important;
	margin: 0 auto!important;
}

#lineup .artist_wrap div.artist img.new{
	display: block!;
	position: absolute;
	top: -10px;
	left: 0;	
}

#lineup .artist_wrap div.artist img.new{
	width: 50px;
	height: auto; 
}

#lineup .artist_wrap.topics div.artist,
#lineup .artist_wrap div.artist,
#lineup .artist_wrap.large div.artist,
#lineup .artist_wrap.small div.artist{
	float: none;
	text-align: center;
	width: 100%;
	height: auto;
	padding-right: 0%;
	margin-bottom: 20px;
	position: relative;
}


section#parking .parking_list,
section#parking .parking_list2{
	width: 100%;
	float: none;

}
/*goods-----------------------------------------*/

#goods p {
	font-size: 15px;
	text-align: left;
}


}




/*540px-----------------------------------------*/


@media only screen and (max-width: 540px) {


section#bus .bus_list th,
section#bus .bus_list td{
	display: block;
	padding: 3px 15px 3px 0;
}

section h2 img{
	width: 90%;
	zoom: 0.75;
	-moz-transform:
  scale(0.75,0.75)
}

#illust_bottom_area img{
	zoom: 0.55;
	-moz-transform:
  scale(0.55,0.55)
 }
 
 .illust_bottom_04{
	zoom: 0.45!important;
	-moz-transform: scale(0.45,0.45)!important;
  } 
  
  
footer #banner_area .banner-twitter img{
	width: 100%;
}

}