@charset "UTF-8";

/* reset */
@import url(reset.css);

/* web font*/
/*@import url(//netdna.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.css);*/



/* common --------------------------------------------------------------- */	
.dsk {
	display: block !important;
	}

.mob {
	display: none !important;
	}

@media screen and (min-width:1px) and (max-width:768px){
	.dsk {
		display: none !important;
		}
		
	.mob {
		display: block !important;
		}
	}
	


/* a --------------------------------------------------------------- */
.fade {
	transition: all 0.3s ease;
	}
	
	.fade:hover {
		opacity: 0.5;
		}
	
	
	
/* scrinT --------------------------------------------------------------- */
.scrinT {
	opacity: 0;
	transform : translate(0, 100px);
	transition : all 1200ms;
	}
	
	.scrinT.actT {
		opacity: 1;
		transform : translate(0, 0);
		}

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

/* scrinL / scrinR --------------------------------------------------------------- */
.scrinL,
.scrinR {
	opacity: 0;
	transition : all 1000ms;
	}
	
.scrinL {
	transform : translate(-100px, 0);
	}
	
.scrinR {
	transform : translate(100px, 0);
	}
	
	.scrinL.actL,
	.scrinR.actR {
		opacity: 1;
		transform : translate(0, 0);
		}


@media screen and (min-width:1px) and (max-width:768px){
	}
	
	
	
/* zoom --------------------------------------------------------------- */
.zoom {
	overflow: hidden;
	}
	
	.zoom img {
		transition: all 0.1s ease-out;
		}
		
	.zoom:hover img {
		transform: scale(1.08, 1.08);
		}

@media screen and (min-width:1px) and (max-width:768px){
	}
	
	
	
/* rotate --------------------------------------------------------------- */
.rotate {
	animation: rotateY 1s linear 0s infinite;
	}
	
@keyframes rotateY {
	0% {
		-webkit-transform: rotateY(0deg);
		-moz-transform: rotateY(0deg);
		transform: rotateY(0deg);
		}
	25% {
		-webkit-transform: rotateY(90deg);
		-moz-transform: rotateY(90deg);
		transform: rotateY(90deg);
		}
	50% {
		-webkit-transform: rotateY(180deg);
		-moz-transform: rotateY(180deg);
		transform: rotateY(180deg);
		}
	75% {
		-webkit-transform: rotateY(270deg);
		-moz-transform: rotateY(270deg);
		transform: rotateY(270deg);
		}
	100% {
		-webkit-transform: rotateY(360deg);
		-moz-transform: rotateY(360deg);
		transform: rotateY(360deg);
		}
	}



/* kuru --------------------------------------------------------------- */
.kuru {
	transition: 1s;
	transform: rotateY(0deg);
	position: relative;
	}
	
	.kuru:hover {
		transform: rotateY(180deg);
		}

@media screen and (min-width:1px) and (max-width:768px){
	.kuru:hover {
		transform: none;
		}
	}
				
				
				
/* loading --------------------------------------------------------------- */
#loading {
	width: 100%;
	height: 100vh;
	padding: 0 10%;
	text-align: center;
	box-sizing: border-box;
	background-color: #ffffff;
	z-index: 999;
	position: fixed;
	left: 0;
	top: 0;
	}
	
	#loading p {
		width: 80px;
		height: 80px;
		margin: -40px 0 0 -40px;
		position: absolute;
		left: 50%;
		top: 50%;
		}
		
		#loading p img {
			width: 100%;
			}
	
	#loading #video {
		width: 200px;
		height: 200px;
		transform: translate(-50%, -50%);
		position: absolute;
		left: 50%;
		top: 50%;
		}



/* body --------------------------------------------------------------- */
body,
a,
input,
select,
textarea {
	color: #333333;
	font-size: 14px;
	line-height: 1;
	letter-spacing: 0.1em;
	font-family: 'Noto Serif JP', 'ヒラギノ明朝 Pro W3', 'Hiragino Mincho Pro', 'ＭＳ Ｐ明朝', 'MS PMincho', serif;
	}

@media screen and (min-width:1px) and (max-width:768px){
	body,
	a,
	input,
	select,
	textarea {
		font-size: 13px;
		}
	}
	
	
	
/* wrapper --------------------------------------------------------------- */
#wrapper {
	margin: 0 auto;
	overflow: hidden;
	background-color: #f1f1f2;
	position: relative;
	}

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

/* nav --------------------------------------------------------------- */
#nav,
#navInner,
#navInner ul {
	height: 150px;
	}

#nav {
	margin: 0 auto;
	position: relative;
	}
	
	#nav #navInner {
		width: 600px;
		margin: 0 auto;
		z-index: 9999;
		
		width: 450px;
		}
	
		#nav #navInner ul {
			transition: all 0.5s ease-in-out;
			overflow: hidden;
			}
			
			#nav #navInner ul li {
				float: left;
				width: 25%;
				
				width: 33.33%;
				}
				
				#nav #navInner ul li a,
				#nav #navInner ul li a img {
					width: 100%;
					}

@media screen and (min-width:1px) and (max-width:768px){
	#nav,
	#navInner,
	#navInner ul {
		height: auto;
		}
		
		#nav #navInner {
			width: 96%;
			}
	}
	
	

/* sec1 --------------------------------------------------------------- */
#sec1 {
	margin: 0 auto;
	padding-top: 70px;
	background-image: url(../img/sec1/bg.jpg);
	background-position: center center;
	background-size: auto 100%;
	}
	
	#sec1 #sec1Inner {
		width: 100%;
		max-width: 600px;
		margin: 0 auto;
		}

	#sec1 #sec1Inner img {
		width: 100%;
		}

@media screen and (min-width:1px) and (max-width:768px){
	#sec1 {
		padding-top: 30px;
		}
	}
	
	
		
/* sec2 --------------------------------------------------------------- */
#sec2 {
	margin: 0 auto;
	padding: 70px 0;
	background-color: #ffffff;
	}
	
	#sec2 #sec2Inner {
		width: 96%;
		max-width: 600px;
		margin: 0 auto;
		}
		
		#sec2 #sec2Inner h1 {
			width: 80%;
			margin-bottom: 30px;
			}
			
			#sec2 #sec2Inner h1 a img {
				width: 100%;
				}
		
		#sec2 #sec2Inner ul {
			}
			
			#sec2 #sec2Inner ul li {
				float: left;
				width: 33.33%;
				position: relative;
				}
				
			#sec2 #sec2Inner ul li:nth-of-type(6) {
				z-index: 99;
				}
			
				#sec2 #sec2Inner ul li a,
				#sec2 #sec2Inner ul li img {
					width: 100%;
					}
				
				#sec2 #sec2Inner ul li img.bun {
					position: absolute;
					left: 0;
					top: 0;
					}
				
				#sec2 #sec2Inner ul li a {
					position: relative;
					}

@media screen and (min-width:1px) and (max-width:768px){
	#sec2 {
		padding: 30px 0;
		}
	}



/* sec3 --------------------------------------------------------------- */
#sec3 {
	margin: 0 auto;
	padding: 70px 0 30px 0;
	}
	
	#sec3 #sec3Inner {
		width: 100%;
		max-width: 600px;
		margin: 0 auto;
		}
		
		#sec3 #sec3Inner h2 {
			width: 26%;
			margin: 0 auto 30px auto;
			}

			#sec3 #sec3Inner h2 img {
				width: 100%;
				}
		
		#sec3 #sec3Inner .sec3cont {
			margin: 0 auto 30px auto;
			line-height: 1.8;
			}
			
			#sec3 #sec3Inner .sec3cont dl {
				display: table;
				width: 100%;
				margin-bottom: 5px;
				}
				
				#sec3 #sec3Inner .sec3cont dl dt,
				#sec3 #sec3Inner .sec3cont dl dd {
					display: table-cell;
					vertical-align: middle;
					}
				
				#sec3 #sec3Inner .sec3cont dl dt {
					width: 30%;
					font-size: 22px;
					}
				
				#sec3 #sec3Inner .sec3cont dl dd {
					width: 70%;
					opacity: 0.6;
					}
			
			#sec3 #sec3Inner .sec3cont h3 {
				font-size: 28px;
				color: #1312a2;
				line-height: 1.4;
				margin-bottom: 10px;
				}
				
				#sec3 #sec3Inner .sec3cont h3 span {
					display: inline-block;
					font-size: 75%;
					margin-left: 5px;
					}
			
			#sec3 #sec3Inner .sec3cont p {
				opacity: 0.6;
				}

@media screen and (min-width:1px) and (max-width:768px){
	#sec3 {
		padding: 30px 0 0 0;
		}
		
		#sec3 #sec3Inner {
			}
			
			#sec3 #sec3Inner h2 {
				width: 30%;
				}
			
			#sec3 #sec3Inner .sec3cont {
				width: 85%;
				margin: 0 0 30px auto;
				}
				
				#sec3 #sec3Inner .sec3cont h3 {
					font-size: 24px;
					}
	}



/* sec4 --------------------------------------------------------------- */
#sec4 {
	margin: 0 auto;
	padding-top: 70px;
	background-color: #a5ff00;
	}
	
	#sec4 #sec4Inner {
		width: 100%;
		max-width: 600px;
		margin: 0 auto;
		}
		
		#sec4 #sec4Inner h2 {
			width: 26%;
			margin: 0 auto 30px auto;
			}

			#sec4 #sec4Inner h2 img {
				width: 100%;
				}
		
		#sec4 #sec4Inner .sec4cont {
			margin: 0 auto 30px auto;
			line-height: 1.8;
			}
		
		#sec4 #sec4Inner .sec4cont:last-of-type {
			margin-bottom: 0;
			}
			
			#sec4 #sec4Inner .sec4cont dl {
				display: table;
				width: 100%;
				margin-bottom: 5px;
				}
				
				#sec4 #sec4Inner .sec4cont dl dt,
				#sec4 #sec4Inner .sec4cont dl dd {
					display: table-cell;
					vertical-align: middle;
					}
				
				#sec4 #sec4Inner .sec4cont dl dt {
					width: 32%;
					font-size: 22px;
					}
				
				#sec4 #sec4Inner .sec4cont dl dd {
					width: 68%;
					opacity: 0.6;
					}
			
			#sec4 #sec4Inner .sec4cont h3 {
				font-size: 28px;
				color: #1312a2;
				line-height: 1.4;
				margin-bottom: 10px;
				}
				
				#sec4 #sec4Inner .sec4cont h3 span {
					display: inline-block;
					font-size: 75%;
					margin-left: 5px;
					}
			
			#sec4 #sec4Inner .sec4cont p.txt {
				margin-bottom: 40px;
				opacity: 0.6;
				}
				
				#sec4 #sec4Inner .sec4cont p.txt a {
					line-height: 1.8;
					text-decoration: underline;
					}
			
			#sec4 #sec4Inner .sec4cont p.img {
				line-height: 1;
				}
					
				#sec4 #sec4Inner .sec4cont p.img img {
					width: 100%;
					}

@media screen and (min-width:1px) and (max-width:768px){
	#sec4 {
		padding-top: 30px;
		}
		
			#sec4 #sec4Inner .sec4cont {
				width: 85%;
				margin: 0 0 30px auto;
				}
				
				#sec4 #sec4Inner .sec4cont p.txt {
					margin-bottom: 20px;
					}
	}
	
	

/* sec5 --------------------------------------------------------------- */
#sec5 {
	margin: 0 auto;
	padding: 70px 0;
	background-color: #d3d4d4;
	}
	
	#sec5 #sec5Inner {
		width: 100%;
		max-width: 600px;
		margin: 0 auto;
		}
		
		#sec5 #sec5Inner h2 {
			width: 16%;
			margin: 0 auto 30px auto;
			}

			#sec5 #sec5Inner h2 img {
				width: 100%;
				}
		
		#sec5 #sec5Inner .sec5cont {
			margin: 0 auto 30px auto;
			line-height: 1.8;
			}
		
		#sec5 #sec5Inner .sec5cont:first-of-type,
		#sec5 #sec5Inner .sec5cont:nth-of-type(2),
		#sec5 #sec5Inner .sec5cont:nth-of-type(3) {
			margin-bottom: 70px;
			}
			
		#sec5 #sec5Inner .sec5cont:last-of-type {
			margin-bottom: 0;
			}
			
			#sec5 #sec5Inner .sec5cont dl {
				display: table;
				width: 100%;
				margin-bottom: 5px;
				}
				
				#sec5 #sec5Inner .sec5cont dl dt,
				#sec5 #sec5Inner .sec5cont dl dd {
					display: table-cell;
					vertical-align: middle;
					}
				
				#sec5 #sec5Inner .sec5cont dl dt {
					width: 100%;
					font-size: 22px;
					}
					
					#sec5 #sec5Inner .sec5cont dl dt span {
						font-size: 85%;
						display: inline-block;
						}
			
			#sec5 #sec5Inner .sec5cont h3 {
				font-size: 20px;
				color: #1312a2;
				line-height: 1.4;
				margin-bottom: 10px;
				}
				
				#sec5 #sec5Inner .sec5cont h3 span {
					display: inline-block;
					font-size: 75%;
					margin-left: 5px;
					}
			
			#sec5 #sec5Inner .sec5cont p.txt {
				margin-bottom: 40px;
				opacity: 0.6;
				}
			
			#sec5 #sec5Inner .sec5cont p.txtL {
				margin-bottom: 40px;
				opacity: 1;
				font-size: 120%;
				}
			
			#sec5 #sec5Inner .sec5cont p.last {
				margin-top: 40px;
				margin-bottom: 0;
				}
				
				#sec5 #sec5Inner .sec5cont p.last span {
					font-size: 80%;
					}
				
			#sec5 #sec5Inner .sec5cont p.img {
				line-height: 1;
				}
					
				#sec5 #sec5Inner .sec5cont p.img img {
					width: 100%;
					}

@media screen and (min-width:1px) and (max-width:768px){
	#sec5 {
		padding: 30px 0 20px 0;
		}
			
			#sec5 #sec5Inner h2 {
				width: 18%;
				}
				
			#sec5 #sec5Inner .sec5cont {
				}
			
			#sec5 #sec5Inner .sec5cont:first-of-type,
			#sec5 #sec5Inner .sec5cont:nth-of-type(2),
			#sec5 #sec5Inner .sec5cont:nth-of-type(3) {
				margin-bottom: 20px;
				}
				
			#sec5 #sec5Inner .sec5cont:last-of-type {
				margin-bottom: 0;
				}
				
				#sec5 #sec5Inner .sec5cont dl {
					width: 85%;
					margin: 0 0 5px 15%;
					}
				
				#sec5 #sec5Inner .sec5cont h3 {
					margin: 0 0 10px 15%;
					}
					
				#sec5 #sec5Inner .sec5cont p.txt {
					margin: 0 0 20px 15%;
					}
				
				#sec5 #sec5Inner .sec5cont p.txtL {
					margin: 0 0 20px 15%;
					}
				
				#sec5 #sec5Inner .sec5cont p.last {
					margin-top: 20px;
					}
	}
	
	

/* sec6 --------------------------------------------------------------- */
#sec6 {
	margin: 0 auto;
	padding: 70px 0;
	}
	
	#sec6 #sec6Inner {
		width: 100%;
		max-width: 600px;
		margin: 0 auto;
		}
		
		#sec6 #sec6Inner h2 {
			width: 70%;
			margin: 0 auto 30px auto;
			}

			#sec6 #sec6Inner h2 img {
				width: 100%;
				}
		
		#sec6 #sec6Inner .sec6cont {
			margin: 0 auto 30px auto;
			line-height: 1.8;
			}
		
		#sec6 #sec6Inner .sec6cont:last-of-type {
			margin-bottom: 0;
			}
			
			#sec6 #sec6Inner .sec6cont p.txt {
				margin-bottom: 40px;
				opacity: 0.6;
				line-height: 2.2;
				}
				
			#sec6 #sec6Inner .sec6cont p.img {
				line-height: 1;
				}
					
				#sec6 #sec6Inner .sec6cont p.img img {
					width: 100%;
					}

@media screen and (min-width:1px) and (max-width:768px){
	#sec6 {
		padding: 30px 0;
		}
		
			#sec6 #sec6Inner h2 {
				width: 80%;
				}
				
				#sec6 #sec6Inner .sec6cont p.txt {
					width: 85%;
					margin: 0 auto 20px auto;
					line-height: 2;
					}
	}



/* sec7 --------------------------------------------------------------- */
#sec7 {
	margin: 0 auto;
	}
	
	#sec7 #sec7Inner {
		width: 100%;
		max-width: 600px;
		margin: 0 auto;
		}
		
		#sec7 #sec7Inner .link {
			margin: 0 auto;
			}
			
			#sec7 #sec7Inner .link a {
				padding: 50px 0;
				text-align: center;
				font-size: 16px;
				background-color: #17ff00;
				}
			
		#sec7 #sec7Inner h2 {
			width: 40%;
			margin: 0 auto 30px auto;
			}

			#sec7 #sec7Inner h2 img {
				width: 100%;
				}
		
		#sec7 #sec7Inner .sec7cont {
			margin: 0 auto 30px auto;
			line-height: 1.8;
			}
		
		#sec7 #sec7Inner .sec7cont:last-of-type {
			margin-bottom: 0;
			}
			
			#sec7 #sec7Inner .sec7cont p.img {
				line-height: 1;
				margin-bottom: 40px;
				}
					
				#sec7 #sec7Inner .sec7cont p.img img {
					width: 100%;
					}
					
			#sec7 #sec7Inner .sec7cont dl {
				display: table;
				width: 80%;
				margin: 0 auto 40px auto;
				}
				
				#sec7 #sec7Inner .sec7cont dl dt,
				#sec7 #sec7Inner .sec7cont dl dd {
					display: table-cell;
					vertical-align: top;
					}
				
				#sec7 #sec7Inner .sec7cont dl dt {
					width: 10%;
					font-size: 40px;
					font-weight: bold;
					}
				
				#sec7 #sec7Inner .sec7cont dl dd {
					padding-top: 15px;
					}

@media screen and (min-width:1px) and (max-width:768px){
		#sec7 #sec7Inner .link {
			width: 90%;
			}
			
				#sec7 #sec7Inner .sec7cont p.img {
					width: 96%;
					margin: 0 auto 20px auto; 
					}
					
				#sec7 #sec7Inner .sec7cont dl {
					margin: 0 auto 20px auto;
					}
					
					#sec7 #sec7Inner .sec7cont dl dt {
						width: 15%;
						}
	}



/* sec8 --------------------------------------------------------------- */
#sec8 {
	margin: 0 auto;
	padding: 70px 0;
	background-color: #f9ffa2;
	}
	
	#sec8 #sec8Inner {
		width: 100%;
		max-width: 600px;
		margin: 0 auto;
		}
		
		#sec8 #sec8Inner h2 {
			width: 38%;
			margin: 0 auto 30px auto;
			}

			#sec8 #sec8Inner h2 img {
				width: 100%;
				}
		
		#sec8 #sec8Inner .sec8cont {
			margin: 0 auto 30px auto;
			line-height: 1.8;
			}
		
		#sec8 #sec8Inner .sec8cont:last-of-type {
			margin-bottom: 0;
			}
					
			#sec8 #sec8Inner .sec8cont dl {
				display: table;
				width: 100%;
				margin: 0 auto;
				}
			
			#sec8 #sec8Inner .sec8cont:last-of-type dl {
				padding-bottom: 0;
				}
			
				#sec8 #sec8Inner .sec8cont dl dt,
				#sec8 #sec8Inner .sec8cont dl dd {
					display: table-cell;
					vertical-align: top;
					line-height: 2.2;
					padding-bottom: 40px;
					}
				
				#sec8 #sec8Inner .sec8cont dl dt {
					width: 8em;
					}
				
				#sec8 #sec8Inner .sec8cont dl dd {
					}

@media screen and (min-width:1px) and (max-width:768px){
	#sec8 {
		padding: 30px 0;
		}
		
				#sec8 #sec8Inner .sec8cont dl {
					width: 80%;
					}
				
					#sec8 #sec8Inner .sec8cont dl dt,
					#sec8 #sec8Inner .sec8cont dl dd {
						line-height: 2;
						}
					
					#sec8 #sec8Inner .sec8cont dl dt {
						width: 5em;
						}
	}



/* sec9 --------------------------------------------------------------- */
#sec9 {
	width: 100%;
	max-width: 600px;
	padding: 70px 0;
	margin: 0 auto;
	}
	
	#sec9 p {
		padding-bottom: 20px;
		line-height: 2;
		}
			
	#sec9 p:last-of-type {
		margin-bottom: 0;
		}
		
		#sec9 p a {
			display: inline;
			text-decoration: underline;
			}

@media screen and (min-width:1px) and (max-width:768px){
	#sec9 {
		width: 80%;
		padding: 30px 0;
		}
	}


	
/* footer --------------------------------------------------------------- */
#footer {
	position: fixed;
	left: 15px;
	bottom: 20px;
	}
	
	#footer p {
		font-size: 10px;
		text-align: center;
		}

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



/* pagetop --------------------------------------------------------------- */
#pagetop {
	display: none;
	width: 40px;
	position: fixed;
	right: 10px;
	bottom: 10px;
	z-index: 99;
	}
		
	#pagetop a {
		width: 40px;
		height: 40px;
		}
		
		#pagetop a img {
			width: 100%;
			}

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



/* loading --------------------------------------------------------------- */
#loading {
	width: 100%;
	height: 100vh;
	z-index: 99999;
	background-color: #ffffff;
	background-image: url(../img/common/loader.gif);
	background-position: center center;
	background-size: 100px auto;
	position: fixed;
	left: 0;
	top: 0;
	}