@media screen and (min-width: 761px) and (max-width: 1023px){

/* ----------base---------- */
html{
	margin: 0;
	padding: 0;
	height: 100%;
	width: 100%;
	font-size: 62.5%;
	-webkit-overflow-scrolling: touch;
	overflow-x: hidden;
}
 body{
	margin: 0;
	padding: 0;
	height: 100%;
	width: 100%;
	background-color: #fff;
	color: #000; 
	font-family: 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro',sans-serif;
	font-weight: 400;
	font-size: 1.5rem;
	-webkit-text-size-adjust: 100%;	
}
img{
	border: none; 
	max-width: 100%;
	height: auto;
	width /***/:auto;　
}
a{
	outline: none;
	transition: 0.3s ease;
}
a:link,
a:visited{
	color: #F08300;
	text-decoration: underline;
 	transition: 0.3s ease;
}
a:hover,
a:active{
	text-decoration: none;
}
.clear{
	clear: both;
}
.br{
	display: block;
}
a.btn{
	margin: 30px auto 0;
	font-size: 1.8rem;
	width: 250px;
	height: 50px;
	line-height: 50px;
	border-radius: 25px;
	display: inline-block;
	font-weight: bold;
	color: #fff;
	background-color: #F08300;
	text-decoration: none;
}
a.btn:hover{
	color: #fff;
	background-color: #F8B551;	
}

/* ----------loading---------- */
.loadingWrap{
	width: 100%;
	height: 100%;
	background: #F08300;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 20001;
}
.loadingWrap div{
	width: 150px;
	height: 150px;
	background-color: #fff;
	border-radius: 50%;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -75px;
	margin-left: -75px;
	overflow: hidden;
	text-align: center;
	box-shadow: 2px 4px 1px 0px rgba(0,0,0,0.5) inset;
}	
.loadingWrap img{
	width: 100px;
	margin: 10px auto;
}



/* ----------pagescroll---------- */
.pagescroll {
	position: fixed;
	bottom: 14px;
	right: 10px;
	z-index: 11;
}
.pagescroll a{
	display: block;
	font-size: 1rem;
	color: #fff;
	text-align: center;
	text-decoration: none;
	line-height: 30px;
	width: 30px;
	height: 30px;
	background-color: #F08300;
	border-radius: 50%;
 	transition: 0.3s ease;
}
.pagescroll a:hover{
	background-color: #eee;
	color: #F08300;
	transform: translate(0,-5px);
}






 /* ----------header---------- */
.header{
	clear: both;
	width: 100%;
	height: 55px;
	margin: 0;
	padding: 0;
	z-index: 101;
	position: relative;
	color: #fff;
	background-image: url(../img/header.png);
	background-position: top left; 	
	background-repeat: repeat-x;
}
.header .inner{
	width: 98%;
	margin: 0 auto;
	display: flex;
}

 /* -----noren----- */
.header .noren{
	width: 180px;
}
.header .noren img{
	width: 160px;
	transition: 0.3s ease;
    filter: drop-shadow(1px 1px 1px rgba(0,0,0,0.4)); 
}
.header .noren img:hover{
	opacity: 0.5;
}

 /* -----desc----- */
.header .desc{
	text-align: left;
	flex-grow: 2;
	font-size: 1.3rem;
	line-height: 1.4;
	padding: 10px;
	display: flex;
	align-items: center;
}

 /* --tel-- */
.header .tel{
	width: 50px;
	font-size: 0;
}


.page .header{
	color: #000;
	background-image: url(../img/header2.png);
}
.page .header a{
	color: #F08300;
}



/* ----------footer---------- */
.footer{
	clear: both;
	width: 100%;
	margin: 0;
	padding: 0;
	height: 60px;
	z-index: 6;
	position: relative;
	text-align: center;
	line-height: 50px;
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 1.2rem;
}



/* -------section------- */
.section{
	clear: both;
	width: 100%;
	margin: 0;
	padding: 50px 0 100px;
	box-sizing: border-box;
	position: relative;
	text-align: center;
}
.section .inner{
	clear: both;
	width: 94%;
	margin: 0 auto;
	padding: 0;
	position: relative;	
}

.section h1{
	font-size: 3.6rem;
	font-family: 'Noto Sans JP', sans-serif;
	color: #F08300;
	margin: 15px 0 20px;
}



/* --intro-- */
.intro{
	width: 100%;
	height: 750px;
	position: relative;
	color: #fff;
	background-color: #F08300;
   	z-index: 0;
	margin: -55px 0 0;
	text-align: center;
}

/* copy */
.intro .copy{
	position: relative;
	top: 100px;
   	z-index: 12;
	width: 90%;
	max-width: 700px;
	margin: 0 auto;
	padding: 0;
}
.intro .copy h1{
	font-size: 4.6rem;
	font-family: 'Noto Sans JP', sans-serif;
	margin: 0;
    filter: drop-shadow(1px 3px 1px rgba(0,0,0,0.9)); 
}
.intro .copy h2{
	font-size: 1.8rem;
	margin: 0;
	line-height: 1.6;
}


/* fukidashi */
.fukidashi{
	position: relative;
	top: 160px;
	width: 730px;
	margin: 0 auto;
	box-sizing: border-box;
}
.fukidashi .menu01{
	width: 280px;
	position: absolute;
	top: -80px;
	left: 40px;
	transition: 0.3s ease;
}
.fukidashi .menu02{
	width: 290px;
	position: absolute;
	bottom: -70px;
	left: -20px;
	transition: 0.3s ease;
}
.fukidashi .menu03{
	width: 280px;
	position: absolute;
	top: -90px;
	right: 30px;
	transition: 0.3s ease;
}
.fukidashi .menu04{
	width: 290px;
	position: absolute;
	bottom: -80px;
	right: -20px;
	transition: 0.3s ease;
}
.fukidashi .menu01:hover,
.fukidashi .menu02:hover,
.fukidashi .menu03:hover,
.fukidashi .menu04:hover{
	animation: buruburu 0.2s linear infinite;
}
@keyframes buruburu{
	0%	{transform:rotate(0deg)	translate(0,0);}
	12.5%	{transform:rotate(0.4deg)	translate(1px,-1px);}
	25%	{transform:rotate(0.8deg)	translate(0px,1px);}
	37.5%	{transform:rotate(0.4deg)	translate(-1px,0);}
	50%	{transform:rotate(0deg)	translate(0,0);}
	62.5%	{transform:rotate(-0.4deg)	translate(1px,0);}
	75%	{transform:rotate(-0.8deg)	translate(0,1px);}
	87.5%	{transform:rotate(-0.4deg)	translate(-1px,-1px);}
	100%	{transform:rotate(0deg)	translate(0,0);}
}

.fukidashi .fuwa1{
    -webkit-animation:fuwa1 3s infinite linear alternate;
    animation:fuwa1 3s infinite linear alternate;
}
@keyframes fuwa1 {
    0% {transform:translate(0, 0) rotate(-5deg);}
    50% {transform:translate(0, -5px) rotate(0deg);}
    100% {transform:translate(0, 0)rotate(5deg);}
}
.fukidashi .fuwa2{
    -webkit-animation:fuwa2 3s infinite linear alternate;
    animation:fuwa2 3s infinite linear alternate;
}
@keyframes fuwa2 {
    0% {transform:translate(0, 0) rotate(5deg);}
    50% {transform:translate(0, 5px) rotate(0deg);}
    100% {transform:translate(0, 0)rotate(-5deg);}
}

.fukidashi .face{
	width: 200px;
	margin: 0 auto;
}


/* track */
.track{
	position: absolute;
	bottom: -40px;
	width: 100%;
	text-align: right;
	z-index: 10;
	overflow: hidden;
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}
.track .car{
	position: relative;
	width: 140px;
	animation: car 8s infinite linear;
	margin-right: -70px;
}
@keyframes car {
	0% { right: -50%;}
	10% { right: 0;}
	40% { right: 50%;}
	60% { right: 50%;}
	90% { right: 100%;}
	100% { right: 150%;}
}


/* -----menu----- */
.section.menu{
	width: 100%;
	position: relative;
	text-align: center;
	padding-top: 50px;
}
.menu p{
	line-height: 1.6;
}
.menu .list{
	display: flex;
	justify-content: center;
	margin: 50px auto;
}
.menu .list  .item img{
	max-width: 330px;
}
.menu .list.normal .item{
	width: 33%;
}
.menu .list.event .item{
	width: 25%;
}
.menu .list .item h3{
	font-size: 1.6rem;
	margin: 5px 0;
}
.menu .list .item p{
	text-align: left;
	font-size: 1.4rem;
	max-width: 230px;
	margin: 0 auto;
}
.menu .list .item p br{
	display: none;
}



/* -----request----- */
.section.request{
	background-color: #FEF4E0;
}
.request p{
	line-height: 1.6;
}


/* -----request page----- */
.page .section.request{
	background-color: #fff;
}
.page .section.request p{
	line-height: 1.6;
}
.page .section.request p a{
	color: #F08300;
	text-decoration: underline;
}
.page .section.request p a:hover{
	color: #000;
}

.page .column{
	display: flex;
	justify-content: space-between;
	margin: 30px auto;
}
.page .column div{
	width: 49%;
	text-align: left;
	padding: 0 20px 10px;
	box-sizing: border-box;
	background-color: #FEF4E0;
	border-radius: 10px;
}

.page .column div h2{
	text-align: center;
	font-size: 2.4rem;
	font-family: 'Noto Sans JP', sans-serif;
	color: #F08300;
	margin: 20px 0;
	padding: 0 0 5px;
}
.page .column div h3{
	color: #F08300;
	font-size: 1.8rem;
	border-bottom: 1px dotted #ccc;
	margin: 0 0 5px;
	padding: 0 0 5px;
}
.page .column div p{
	margin: 0 0 20px;
}

.page .track{
	bottom: -150px;
}





/* -----schedule----- */
.section.schedule{
}
.schedule p{
	line-height: 1.6;
}
.schedule .qr{
	width: 650px;
	margin: 0 auto;
	text-align: left;
	display: flex;
	align-items: flex-start;
}
.schedule .qr .left{
	width: 110px;
}	
.schedule .qr .left img{
	width: 95px;
}
.schedule .qr .right p{
	margin: 0;
}

.schedule .twitter{
	margin: 30px auto;
	width: 100%;
	max-width: 700px;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.schedule .twitter div{
	width: 100%;
	margin: 0;
	padding: 5px;
	box-sizing: border-box;
	background-color: #FEF4E0;
	border-radius: 6px;
}
.schedule .twitter div h3{
	height: 30px;
	margin: 10px 0;
	padding: 0;
	color: #F08300;
	font-size: 1.8rem;
}	
	

/* -----recruit----- */
.section.recruit{
	background-color: #FEF4E0;
}
.recruit p{
	line-height: 1.6;
}
.recruit a{
	color: #F08300;
	text-decoration: underline;:
}
.recruit a:hover{
	color: #000;
}



/* -----contact----- */
.section.contact{
	color: #fff;
	background-color: #F08300;
	overflow: hidden;
	z-index: 0;
}
.contact p{
	line-height: 1.6;
}
.contact h1{
	color: #fff;
}

.contact table{
	width: 450px;
	margin: 30px auto;
	text-align: left;
}
.contact table th{
	font-size: 1.6rem;
	width: 110px;
	margin: 0;
	padding: 0;
}	
.contact table td{
	font-size: 3.6rem;
	font-family: 'Noto Sans JP', sans-serif;
	margin: 0;
	padding: 0;
}
.contact a{
	color: #fff;
	text-decoration: none;
}
.contact a:hover{
	color: #000;
}

.contact .maido{
	position: absolute;
	top: 97%;
	right: 15%;
	width: 90px;
	overflow: hidden; 
}
.contact .maido .mov{
	position: relative;
	animation: mov 5s infinite linear;
}
@keyframes mov {
	0% { bottom: -130px;}
	30% { bottom: -130px;}
	31% { bottom: 0;}
	69% { bottom: 0;}
	70% { bottom: -130px;}
	100% { bottom: -130px;}
}



/* -----map page----- */
.page .section.map{
	background-color: #fff;
}
.page .section.map iframe{
	width: 100%;
	margin: 20px 0 0;
	box-sizing: border-box;
	border-radius: 10px;
	border: 6px solid #F08300;
}
.page .section.map .btn{
	margin-bottom: 50px;
}

.page .section.map .explain{
	width: 98%;
	margin: 10px auto 5px;
	color: #fff;
	background-color: #F08300;
	padding: 10px;
	box-sizing; border-box;
	border-radius: 10px;
	position: relative;
}
.page .section.map .explain:after{
	content: "";
	position: absolute;
	left: 15px;
	bottom: -16px;
	background-color: #F08300;
	width: 22px;
	height: 16px;
	clip-path: polygon(0 0, 100% 0, 50% 100%);
}
.page .section.map .explain p{
	margin: 0 0 0 40px;
	position: relative;
	text-align: left;
}
.page .section.map .explain p:before{
	content: "";
	position: absolute;
	left: -38px;
	top: 0px;
	width: 30px;
	height: 30px;
	border-radius: 5px;
	background-image: url(../img/icon-map.png);
	background-position: center center; 	
	background-repeat: no-repeat;	
}

.page .section.map .explain p span{
	padding: 3px 0 3px 22px;
	background-image: url(../img/icon-marker.png);
	background-position: left center; 	
	background-repeat: no-repeat;	
	background-size: 20px;
}


}