
/* Format */

body{
	background-image:url(../images/bg_texture.jpg);
	}

header{
	background-image:url(../images/head_curtain.png);
	background-position:center;
	background-repeat:repeat-x;
	text-align:center;
	width:100%;
	position:relative;
	z-index:5;
	}

.md-head__menubox, .md-footer__menu, .md-bn--recruit, .md-Gr, .md-company, .md-service__box, .md-ourstyle__ic-mini, .md-seminar__link, .md-schedule__list, .md-contact__notices {
  *zoom: 1;
}
.md-head__menubox:after, .md-footer__menu:after, .md-bn--recruit:after, .md-Gr:after, .md-company:after, .md-service__box:after, .md-ourstyle__ic-mini:after, .md-seminar__link:after, .md-schedule__list:after, .md-contact__notices:after {
  content: "";
  display: block;
  clear: both;
}

.l-footer{
  width: 100%;
  margin: 0 auto;
}

.l-footer {
  font-size: 15px;
  font-size: 1.5rem;
  line-height: 2;
}

.md-footer {
  width: 100%;
  padding: 20px 0;
}
.md-footer__menu {
  text-align: center;
  border-top: 2px solid #000;
  border-bottom: 2px solid #000;
  color: #ccc;
}
.md-footer__menubox {
  display: inline-block;
  text-align: left;
  vertical-align: top;
  width: 19%;
  margin-right: 0.5%;
}
.md-footer__menubox:last-of-type {
  margin-right: 0;
}
.md-footer__menulist {
  display: block;
  width: 100%;
}
.md-footer__menulist a {
  display: block;
}
.md-footer__menulist:first-child {
  border-bottom: 1px dashed #000;
  margin-bottom: 1rem;
}
.md-footer__menulist:not(:first-child) {
  font-size: 12px;
  font-size: 1.2rem;
  line-height: 2.5;
  padding-left: 0;
}
.md-footer__notices {
  display: block;
  width: 100%;
}
.md-footer__notices-list {
  display: inline-block;
  text-align: left;
  margin: 0 3% 0 0;
}
.md-footer__notices-list a {
  display: block;
  padding: 1.5rem 0;
}
.md-footer__notices-list:last-of-type {
  margin-right: 0;
}
.md-footer__noticesbox {
  display: block;
  width: 100%;
  text-align: center;
}

footer{
	background-color:#ffffff;
	width:100%!important;
	max-width:none;
	}


.md-isms {
    padding-bottom: 1rem;
    text-align: center;
}

/* format */



#mainVisual{
	margin-top: -105px;
	}
	
	#mainVisual img.bg{
		width:100%;
		}
	
	#mainVisual h1{
		width:814px;
		margin:-196px auto 60px;
		}
		
		.innr{
			width: 960px;
			margin: 0 auto;
			position: relative;
			height: 250px;
			margin-top: -250px;
			}
		
		#mainVisual h1 img{
			margin-left:40px;
			}
	
	#mainVisual .ju01 {
		position: absolute;
		top: -150px;
		left: 0;
		display:inline-block;
		opacity:0;
		display:none;
	}
	
	#mainVisual .ju02 {
		position: absolute;
		top: -50px;
		left: 120px;
		display:inline-block;
		opacity:0;
		display:none;
	}
	
	#mainVisual .ju03 {
		position: absolute;
		top: -150px;
		right: -20px;
		display:inline-block;
		opacity:0;
		display:none;
		}

/* menu */

#menu{
	width:960px;
	margin:0 auto 40px;
	}
	
	#menu h2{
		position:relative;
		}
		
		#menu h2 img{
			width:100%;
			}
	
	#menu .innr{
		background-image:url(../images/bg_menu.jpg);
		background-repeat:no-repeat;
		background-color:#ebe8d3;
		min-height:480px;
		margin-top:0;
		}
	
	#menu h1 {
		margin-left:30px;
		}
	
	#menu h1 img{
		margin-top:-88px;
		}
	
	#menu figure.region{
		position: absolute;
		top: -180px;
		right: -10px;
		}
		
	#menu figure.price{
		position: absolute;
		bottom: -70px;
		right: -20px;
		z-index: 2;
		}
	
	
	#menu p{
		margin:20px 0 60px 62px;
		font-size:1.8rem;
		line-height:1.5em;
		}
		
		#menu p strong{
			color:#dd3c15;
			font-weight:bold;
			padding:0 5px;
			}
		
		#menu p br.sp{
			display:none;
			}
	
	#menu dl{
		margin:40px 0 40px 62px;
		font-size:1.8rem;
		line-height:1.5em;
		width:411px;
		border-top:solid 3px #642323;
		border-bottom:solid 3px #642323;
		padding-bottom:15px;
		}
		
		#menu dl dt{
			display:block;
			margin-bottom:20px;
			margin-top:-23px;
			}
		
		#menu dl dt span{
			background-color:#642323;
			color:#ffffff;
			font-weight:bold;
			padding:10px;
			display:inline-block;
			}
		
		#menu dl dd{
			display:block;
			font-weight:bold;
			color:#a06f00;
			margin-bottom:10px;
			}
	
	#menu .bottom{
		background-color:#ffffff;
		text-align:right;
		border-radius:0 0 20px 20px;
		box-shadow:rgba(0, 0, 0, 0.3) 0px 10px 0px 0px;
		-webkit-box-shadow:rgba(0, 0, 0, 0.3) 0px 10px 0px 0px;
		-moz-box-shadow:rgba(0, 0, 0, 0.3) 0px 10px 0px 0px;
		}
		
		#menu .bottom img{
			position:relative;
			margin-top:-71px;
			}
	
	
.btnOrder{
	display:block;
	width:940px;
	margin:0 auto 40px;
	}

.separator{
	height:54px;
	background-image:url(../images/separator_baige.png);
	background-repeat:repeat-x;
	background-position:center;
	}


/* qa */

#qa{
	background-color:#e5dbba;
	background-image:url(../images/bg_qa.jpg);
	background-repeat:no-repeat;
	background-size:100%;
	}
	
	#qa .innr{
		margin-top:0;
		height:auto;
		padding-bottom:60px;
		}
	
	#qa h2{
		text-align:center;
		padding:30px 0 40px;
		}
	
	#qa dl{
		margin-bottom:30px;
		}
	
	#qa dl dt{
		border-radius:10px 10px 0 0;
		display:block;
		padding:25px 20px 25px 80px;
		color:#ffffff;
		background-image:url(../images/bg_texture.jpg);
		font-size:2.0rem;
		font-weight:bold;
		position:relative;
		}
		
		#qa dl dt:after{
			content:"";
			width:47px;
			height:42px;
			background-image:url(../images/Q.png);
			display:block;
			position:absolute;
			top:50%;
			left:20PX;
			margin-top:-23px;
			}
	
	#qa dl dd{
		background-color:#ffffff;
		display:block;
		border-radius:0 0 10px 10px;
		box-shadow:rgba(0, 0, 0, 0.3) 0px 10px 0px 0px;
		-webkit-box-shadow:rgba(0, 0, 0, 0.3) 0px 10px 0px 0px;
		-moz-box-shadow:rgba(0, 0, 0, 0.3) 0px 10px 0px 0px;
		padding:30px 20px 20px 80px;
		font-size:1.6rem;
		line-height:1.7em;
		position:relative;
		}
		
		#qa dl dd:after{
			content:"";
			width:47px;
			height:42px;
			background-image:url(../images/A.png);
			display:block;
			position:absolute;
			top:20px;
			left:20PX;
			}
		
		#qa dl dd strong{
			color:#dd3c15;
			font-weight:bold;
			font-size:3.0rem;
			display:inline-block;
			margin-bottom:20px;
			}
		
		#qa dl dd p.gray{
			color:#555555;
			margin-top:15px;
			}


/* order */

#order .innr{
	margin-top:0;
	padding:40px 0 0 0;
	height:auto;
	}
	
	#order a{
		display:block;
		}
	
	#order p{
		padding:0 20px 40px 20px;
		text-align:center;
		font-size:1.8rem;
		color:#ffffff;
		line-height:1.5;
		}
	
	#order p strong{
		font-weight:bold;
		color:#FFCC00;
		}
	
	#order ul{
		padding-bottom:60px;
		font-size:1.4rem;
		color:#ffffff;
		line-height:1.8;
		border-top: dotted 1px #ffffff;
		padding: 30px 140px 60px;
		}

a:hover{
	opacity:0.7;
	}

/* animation */

.element-animation{
  animation: animationFrames linear 1s;
  animation-iteration-count: infinite;
  transform-origin: 50% 50%;
  -webkit-animation: animationFrames linear 1s;
  -webkit-animation-iteration-count: infinite;
  -webkit-transform-origin: 50% 50%;
  -moz-animation: animationFrames linear 1s;
  -moz-animation-iteration-count: infinite;
  -moz-transform-origin: 50% 50%;
  -o-animation: animationFrames linear 1s;
  -o-animation-iteration-count: infinite;
  -o-transform-origin: 50% 50%;
  -ms-animation: animationFrames linear 1s;
  -ms-animation-iteration-count: infinite;
  -ms-transform-origin: 50% 50%;
}

@keyframes animationFrames{
  0% {
    transform:  rotate(0deg) ;
  }
  24% {
    transform:  rotate(10deg) ;
  }
  50% {
    transform:  rotate(0deg) ;
  }
  100% {
    transform:  rotate(0deg) ;
  }
}

@-moz-keyframes animationFrames{
  0% {
    -moz-transform:  rotate(0deg) ;
  }
  24% {
    -moz-transform:  rotate(10deg) ;
  }
  50% {
    -moz-transform:  rotate(0deg) ;
  }
  100% {
    -moz-transform:  rotate(0deg) ;
  }
}

@-webkit-keyframes animationFrames {
  0% {
    -webkit-transform:  rotate(0deg) ;
  }
  24% {
    -webkit-transform:  rotate(10deg) ;
  }
  50% {
    -webkit-transform:  rotate(0deg) ;
  }
  100% {
    -webkit-transform:  rotate(0deg) ;
  }
}

@-o-keyframes animationFrames {
  0% {
    -o-transform:  rotate(0deg) ;
  }
  24% {
    -o-transform:  rotate(10deg) ;
  }
  50% {
    -o-transform:  rotate(0deg) ;
  }
  100% {
    -o-transform:  rotate(0deg) ;
  }
}

@-ms-keyframes animationFrames {
  0% {
    -ms-transform:  rotate(0deg) ;
  }
  24% {
    -ms-transform:  rotate(10deg) ;
  }
  50% {
    -ms-transform:  rotate(0deg) ;
  }
  100% {
    -ms-transform:  rotate(0deg) ;
  }
}


.element-animation02{
  animation: animationFrames02 linear 1s;
  animation-iteration-count: infinite;
  transform-origin: 50% 50%;
  -webkit-animation: animationFrames02 linear 1s;
  -webkit-animation-iteration-count: infinite;
  -webkit-transform-origin: 50% 50%;
  -moz-animation: animationFrames02 linear 1s;
  -moz-animation-iteration-count: infinite;
  -moz-transform-origin: 50% 50%;
  -o-animation: animationFrames02 linear 1s;
  -o-animation-iteration-count: infinite;
  -o-transform-origin: 50% 50%;
  -ms-animation: animationFrames02 linear 1s;
  -ms-animation-iteration-count: infinite;
  -ms-transform-origin: 50% 50%;
}

@keyframes animationFrames02{
  0% {
    transform:  rotate(0deg) ;
  }
  24% {
    transform:  rotate(-15deg) ;
  }
  50% {
    transform:  rotate(0deg) ;
  }
  100% {
    transform:  rotate(0deg) ;
  }
}

@-moz-keyframes animationFrames02{
  0% {
    -moz-transform:  rotate(0deg) ;
  }
  24% {
    -moz-transform:  rotate(-15deg) ;
  }
  50% {
    -moz-transform:  rotate(0deg) ;
  }
  100% {
    -moz-transform:  rotate(0deg) ;
  }
}

@-webkit-keyframes animationFrames02 {
  0% {
    -webkit-transform:  rotate(0deg) ;
  }
  24% {
    -webkit-transform:  rotate(-15deg) ;
  }
  50% {
    -webkit-transform:  rotate(0deg) ;
  }
  100% {
    -webkit-transform:  rotate(0deg) ;
  }
}

@-o-keyframes animationFrames02 {
  0% {
    -o-transform:  rotate(0deg) ;
  }
  24% {
    -o-transform:  rotate(-15deg) ;
  }
  50% {
    -o-transform:  rotate(0deg) ;
  }
  100% {
    -o-transform:  rotate(0deg) ;
  }
}

@-ms-keyframes animationFrames02{
  0% {
    -ms-transform:  rotate(0deg) ;
  }
  24% {
    -ms-transform:  rotate(-15deg) ;
  }
  50% {
    -ms-transform:  rotate(0deg) ;
  }
  100% {
    -ms-transform:  rotate(0deg) ;
  }
}


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

body{
	min-width:0!important;
	max-width:none!important;
	}

#mainVisual{
	overflow:hidden;
	margin-top:-92px;
	}

#mainVisual .innr{
	margin-top: -22%;
	}

#mainVisual h1{
	width: 90%;
    margin: -26% auto 8%;
	}
	
	#mainVisual h1 img{
		width:100%;
		margin-left:5%;
		max-width:none;
		}

#mainVisual .ju01{
	top: -20%;
    left: 5%;
    display: inline-block;
    width: 30%;
	}

#mainVisual .ju02{
	top: 10%;
    left: 16%;
    display: inline-block;
    width: 30%;
	}

#mainVisual .ju03{
	top: -21%;
    right: 10px;
    display: inline-block;
    width: 36%;
	}


#menu{
	width:96%;
	margin:5% auto;
	}

#menu .innr{
	height:auto;
	padding:5%;
	width:100%;
	margin:0;
	}

.innr,
.btnOrder{
	width:96%;
	margin:5% auto;
	}
	
	.btnOrder img{
		width:100%;
		}

#menu .bottom img{
	width:95%;
	margin-top:-7.5%;
	}

}

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


header{
	background-size:260%;
	background-position:center top;
	}
	
	header img{
		width:15%;
		}

.innr,
.btnOrder{
	width:96%;
	margin:5% auto;
	}

#mainVisual{
	overflow:hidden;
	margin-top:-60px;
	}

#mainVisual .innr{
	margin-top: -70%;
	}

#mainVisual img.bg{
	width:140%;
	margin-left:-20%;
	}

#mainVisual span img {
    
}

#mainVisual h1{
	width: 90%;
    margin: -26% auto 8%;
	}
	
	#mainVisual h1 img{
		width:100%;
		margin-left:5%;
		max-width:none;
		}

#mainVisual .ju01{
	top: 43%;
    left: 5%;
    display: inline-block;
    width: 30%;
	}

#mainVisual .ju02{
	top: 60%;
    left: 16%;
    display: inline-block;
    width: 30%;
	}

#mainVisual .ju03{
	top: 48%;
    right: 10px;
    display: inline-block;
    width: 36%;
	}


#qa h2,
#order h2{
	padding:5%;
	}

h2 img,
.btnOrder img{
	width:100%;
	}

#menu{
	width:96%;
	margin:5% auto;
	}

#menu .innr{
	height:auto;
	padding:5%;
	width:100%;
	margin:0;
	}
	
	#menu h1{
		margin-left:-5%;
		margin-top:-5%;
		width:100%;
		}
	#menu p,
	#menu dl{
		margin-left:0;
		width:100%;
		font-size:1.4rem;
		}
	
	#menu p br.sp{
		display:block;
		}
	#menu h1 img{
		width:100%;
		margin-top: -17%;
		}

#menu figure.region{
	position:static;
	width:60%;
	margin:0 auto;
	}
	

#menu figure.price{
	top:30%;
	right:0;
	width:50%;
	}
	
	#menu figure.region img,
	#menu figure.price img{
		width:100%;
		}

.separator{
	background-size:10%;
	background-position:center bottom;
	}


#qa dl dd strong{
	color:#dd3c15;
	font-weight:bold;
	font-size:2.0rem;
	display:inline-block;
	margin-bottom:20px;
	}

#order p{
	font-size:1.4rem;
	}
	
	#order p br{
		display:none;
		}

#order ul{
		padding-bottom:60px;
		font-size:1.2rem;
		color:#ffffff;
		line-height:1.8;
		border-top: dotted 1px #ffffff;
		padding: 30px 0px 60px;
		}
	
	a:hover{
		opacity:1;
		}

}