
/* CSS Document */


@import url(http://fonts.googleapis.com/css?family=Oswald:400,300,700);
@import url(http://fonts.googleapis.com/css?family=Lato:400,700);


 hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

html,
body {
    height: 100%;
}




*{
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	
}
body{
	margin: 0;
	min-width: 240px;
	padding: 0;
	background:#fff;
	-webkit-text-size-adjust: ('none' '100%' 'auto');
		font-size:1.2rem;
font-family:sans-serif;
}

p{
	margin: 0 0 10px 0;	
}

p, ul{
	
	font-size-adjust:0.488;
	font-weight:200;
	font-style:normal;
}

img{
	border: 0;
	vertical-align: bottom;
}

#pixels{
	font-family:"Museo 900", Verdana, serif;
	font-size-adjust:0.40;
	font-weight:700;
	font-style:normal;
}

h1,h2{
	font-family:"Beau Sans Pro Book", Verdana, sans-serif;
	font-size-adjust:0.531;
	font-weight:500;
	font-style:normal;
}

.pre{ 
width:100%;
p{text-align:center; width:100%; font-size:70%; line-height:1.5em; margin:0 auto 0; color:#333;}
	samp{}	
}	

.float-left{
	float: left;	
	margin: 0 0 0 20px;
}


#header, #intro, #second{
	width: 100%;
}

/* ------TOPB---------------------*/
.langC{
	overflow:hidden;
	width:auto;
		position: absolute;
	top: 0px;
	right: 0px;
	font-size:0.9rem;
}

.langC a{
	overflow:hidden;
display:inline-block;
	padding:0.4em 0.6em;

}


.langC a:first-child{
	background:#cfcfcf;
	color:#000;
	border-radius:0 0 0 10px;
}

.langC a:last-child{
	background:#000;
	color:#fff;	
}
/* ------TOPB---------------------*/

.container{
	text-align:center;	
	color: #000;
	margin: 0 auto 1rem;
	padding: 0;
width:90%;
overflow:hidden;
}

.container img{
		width:20%;margin-bottom:0.5em;
}
.container ul img{
width:10%; min-width:120px; margin-bottom:0.1em;
	}
	

#intro{
		
background:url(ninjinBUDOU.jpg) 0% 50% no-repeat fixed;
	color: #000;
background-color:#fff;
	margin: 0 auto ;
	padding:50px 0 0 0;
	background-size:50% 80%;
overflow:hidden;
	text-align:center;
	
	img{max-width:800px;}
	p{text-align:center; font-size:80%;}
}
/* --------COPY-------- */
.cptMas{
	background-color:#dedede;
	
	background: linear-gradient(90deg, #ffffff 0%, #f3ebeb 99%);
	
		color: #000;
		width:100%;
	overflow:hidden;
	margin: 0 auto 2rem;
	padding:6em 1rem;
	text-align:center;
	line-height:1.8;
	font-size:1rem;
	ul{display:inline-block;}
	
	h3{font-size:1.3rem; letter-spacing:0.2em;}
		h4{font-size:1rem;margin-bottom: 2rem; letter-spacing:0.1em;}
	p{font-size:0.9rem;margin-bottom: 2rem; letter-spacing:0.1em;}
	p span{font-size:0.96rem;}
}


.cptMas table {
	font-size:0.8rem;
	border-collapse:collapse;
	 margin:0 auto;
	th{text-align:right; padding:0.3em 0; line-height:1.5em;}
	td{text-align:left; padding:0.3em 0;}
}




/* --------COPY-------- */

.fifth{
	background: url(budouHaNinjinL2.jpg) 0% 50% no-repeat fixed;
	background-color:#fff;
	color: #000;
	overflow:hidden;
	margin: 0 auto;
	
	padding:100px 60px 0;
	background-size:contain;
background-size:80% 80%;
/* --------BG alfa-------- */
background-color:rgba(255,255,255,0.4);
background-blend-mode:lighten;
/* --------BG alfa-------- */		
}

.fifth2{
	background: url(budouHaNinjinL2.jpg) 0% 50% no-repeat fixed;
	background-color:#fff;
	color: #000;
	overflow:hidden;
	margin: 0 auto;
	
	padding:100px 60px 0;
	background-size:80% 80%;

/* --------BG alfa-------- */
background-color:rgba(255,255,255,0.8);
background-blend-mode:lighten;
/* --------BG alfa-------- */		
}


	

.inBox{
overflow:hidden;
	margin: 0 auto;
	background: none;
  display: flex;
    flex-direction: row;
	width:90%;	max-width:1080px;	
	overflow:hidden;
	
	.hidariLEFT{flex-basis: 64%; }	
	.migiRight{flex-basis: 36%; }		
				
	}

.hidariLEFT{text-align:right;

		img{max-width:300px;}

}	

 	.hidariLEFT{flex-basis: 64%; }	
	.migiRight{flex-basis: 36%; }	
	



.zairyo{
overflow:hidden;
	margin: 0 auto 3em;
	background: none;
  display: flex;
    flex-direction: row;
width:100%;			overflow:hidden; background-color:#fff;
		
		.zai{flex-basis: 33.33%;}		
	
	}
	
/* ------zaI---------------------*/

.zai{
	display:block;
	background-color:#fff;
	color: #000;
	margin: 0 auto;
	overflow:hidden;
	height:auto;

		font-size:80%;
}

.zai span{
display:block;
	color: #000;
	padding-left:3em;
}


/* ------zaI---------------------*/

#ninnjin{
	background-color:#fff;
	color: #000;
	margin: 0 auto;
	overflow:hidden;
	
}

.story{
	margin: 0 auto;
	min-width:240px;
	overflow: auto;
	width: 90%;
background:none;color:#000;
}

.storyWrap{	width: 100%;
}


.story h4 span{display:inline-block;
	    vertical-align:20%; padding-left:1em;
	
}
.story h4{
color:#8D9F00;
font-size:80%;

	}

/* ---------Balance-----------*/
.tech{
	width:86%; 
	margin:0 auto 2rem;
	text-align:center;
		h2{ margin-bottom:1em;font-size:110%;}
		p{font-size:80%;  line-height:2em;}
}

/* ---------888-------------*/
.eightNO{width:80%;
	max-width:960px;
	text-align:center;
	margin:0 auto 2rem;
	h3{font-size:80%;}
	p{font-size:70%;}
}
	
.sqr{font-size:40px; text-align:center;
	display:inline-block;
	border-radius:50%;background:#000; color:#fff;
	width:60px;
line-height:60px;height:60px;
margin:0 auto 0.5em;}

.seibun li{
list-style-type:none;	
	margin-bottom:0.6em;
	padding-bottom:0.6em;
	border-bottom:1px solid #000;
	font-size:105%;letter-spacing:0.2em;
}
.seibun li span{
	font-size:70%; padding:0.6em;
}
/* ---------------------------*/


#page-top {
	position: fixed;
	bottom: 50px;
	right: 0px;
}
#page-top a {
	background: #000;
	text-decoration: none;
	color: #fff;
	width: 70px;
	font-size: 16px;
	padding: 15px 0;
	text-align: center;
	display: block;
	border-radius:50% 0 0 50%;

}
#page-top a:hover {
	text-decoration: none;
		background: #000;
	color: #f08080;
}






/* sera tablet---------------------*/


.migiRight h3{
	font-size:86%;
	margin-bottom:1.6em;
	color:#333;
	}
	
.migiRight h4{
	font-size:76%;
	margin-bottom:1em;
	padding-bottom:0.3em;
	border-bottom:1px solid #000;

	}
	
.migiRight p{
	font-size:80%;
		padding-bottom:0.3em;
margin-bottom:1em;
	}

.migiRight ol{
	font-size:80%;
	padding-left:1rem;
margin-bottom:1em;
	}



#headerwrap h1{text-align:center; margin:0 auto 1rem;font-size:80%;	font-weight: bold;
	line-height:2em;}
#headerwrap h1 span{font-size:140%;}
#headerwrap{text-align:center; margin:0 auto;padding-top:3rem;
	img{width:10%;}
	
}
#headerwrap p{
	padding:0 10px;
	
	font-size: 80%;
	font-weight: bold;
	line-height:2em;
	background:#000;
color:#fff;
}


footer{padding:10px 0;text-align:center;
	h4{letter-spacing:1.5em;}
	img{width:10%;}
	small{font-size:0.7rem;}
}





/* Service Wrap */


.serviceWrap { display:block;margin:0 auto ; width:100%;
	padding:4rem 0;
background: #eaebe8;
background: linear-gradient(90deg,rgba(234, 235, 232, 0.8) 0%, rgba(255, 255, 255, 1) 20%, rgba(255, 255, 255, 1) 81%, rgba(234, 235, 232, 0.8) 100%);
}
.service { display:block;margin:0 auto 2em; width:50%;
	text-align: left; 

}

.service small {
	font-size: 12px;
	font-weight: bold
}

.service i {
	float: left;
	margin-right: 15px;
	font-size: 30px;
	vertical-align: middle;
}
.service h4 {
		line-height:1.5em;
		margin-bottom:1rem;
}
.service .text {
	color: #666;
	line-height:1.5em;
}


/* ++++++++++++++++++++++++++++++++++++++++++ */


/* ---------------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------------- */
@media(max-width:960px){

}

@media(max-width:860px){
	

#headerwrap h2{text-align:center; margin:0 auto 1rem;font-size:70%;line-height:1.5em;}
#headerwrap h2 span{font-size:130%;}
#headerwrap{text-align:center; margin:0 auto;padding-top:3rem;
	img{width:26%;}
	
		}

	
.container img{
	width:50%; max-width:200px;margin-bottom:0.5em;
}
.container ul img{
width:30%; max-width:120px; margin-bottom:0.1em;
	}
	
	
	
#intro{
	background:url(ninjinBUDOU.jpg) 0% 100% no-repeat;
	color: #000;
	margin: 0 auto 1rem;
	padding: 0;
	background-size:cover;
	overflow: hidden;	background-color:#fff;

}


		
.fifth,.fifth2{
	background-color:#fff;
	color: #000;
	overflow:hidden;
	margin: 0 auto;
		background: none;
		padding:0px 0px 0;
	
	}
	
	
	
.inBox{
overflow:hidden; width:100%;	
	margin: 0 auto;
	background: none;
  display: flex;
   flex-direction: column;
	}
	

	.migiRight{padding:30px;}	
	
.fifth .hidariLEFT{text-align:center; 
		background: url(budouHaNinjin.png) 20% 20% no-repeat fixed;overflow:hidden;
/* --------BG alfa-------- */
background-color:rgba(255,255,255,0.6);
background-blend-mode:lighten;
/* --------BG alfa-------- */
		background-size:contain;	
			img{width:240px;}
	}
	
.fifth2 .hidariLEFT{text-align:center; 
		background: url(budouHaNinjin.png) 20% 40% no-repeat fixed;overflow:hidden;
/* --------BG alfa-------- */
background-color:rgba(255,255,255,0.8);
background-blend-mode:lighten;
/* --------BG alfa-------- */
		background-size:100% 120%;	
	img{width:240px;}
	}
	
	
	
.migiRight h3{
	font-size:86%;
	margin-bottom:1.6em;
		color:#333;
		text-align:center;
	}	


	
.zairyo{
overflow:hidden;
	margin: 0 auto 2rem;
	background: none;
  display: flex;
    flex-direction: column;
		width:100%;
		overflow:hidden; 
		background-color:#000;
		
			.zai span{width:90%;margin: 0 auto;}		
	}
	/* ------zaI---------------------*/

.zai{
	display:block;
	background-color:#fff;
	color: #000;

}

.zai span{
display:block;
	color: #000;
	padding:0.5em;
	}
	
.zairyo .zai:nth-child(1) strong {	color: #6b8e23; }
.zairyo .zai:nth-child(2) strong {	color: #ff8c00; }
.zairyo .zai:nth-child(3) strong {	color: #87cefa; }
	
	
/* ------zaI---------------------*/
/* ----------------------------------- */


.story{
	
	width: 100%;
background:#fff;
		padding:10px;
		
		h4{
			color:#8D9F00;
			font-size:80%;
			line-height: 3em;
			padding-bottom:0;text-align:center;
			}
		img{width:40%;}

}

	
	

.story h2{
color:#efefef;
font-size:16px;
}
.story p{
color:#efefef;
font-size:16px;
}


.story span{
display:block;
texit-align:center;

	}
	
footer{padding:10px 0;text-align:center;
	
	img{width:30%;}
	
		}	
		
		
.service { display:block;margin:0 auto 2em; width:84%;
	text-align: left; font-size:86%; color:#000;

}		
		
.sqr{font-size:30px; text-align:center;
	display:inline-block;
	border-radius:50%;background:#000; color:#fff;
	width:50px;
line-height:50px;height:50px;
		margin:0 auto 0.5em;}	
		
	.seibun li{
list-style-type:none;	
	margin-bottom:0.6em;
	padding-bottom:0.6em;
	border-bottom:1px solid #000;
	font-size:90%; letter-spacing:0.1em;
		}	
		
		
.pre{ text-align:left;

p{width:100%; font-size:70%; line-height:1.3em; margin:0 auto;padding:1em;}
	
}		
/* ----------------------------------- */
}
/* ++++++++++++++++++++++++++++++++++++++ */
/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

@media only screen and (min-device-width: 768px) and (max-device-width: 1030px) {
	
}

/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */




#underfoot{
		background:#333;text-align:center;width:100%;height:2em;	padding:0.2em;
		color:#ccc;
		 a{color:#999;}
}





.wideBox {
	background: url(budoNnjinF.jpg) no-repeat;overflow:hidden;padding:50px 0 30px;text-align:center;
		background-size:cover; color:#333;letter-spacing:0.2em;
		
		small{font-size:0.6em;}
	}
	
.morefoot {
	text-align:center;font-size:70%;
	 color:#333;letter-spacing:0.1em;
	padding-bottom:1em;
		
	}
	
.scope { display:block;margin:0 auto;

}

@media(min-width:861px){
  .kaigyo{display:none;}  
	
}

footer img{width:10%;}

.buyNOW { text-align:right;

}
	
.space80{height:clamp(2rem, calc(2rem + 6vw), 5rem); display:block;}

/*----------------------------------------------------*/
.arrow01{
    margin:0 auto 2em;
    display: block;
    width: 30px;
    height:30px;
    border-bottom: solid 6px #cdcdcd;
    border-left: solid 6px #9b9b9b;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}


.arrow01 {
	animation: flash 2s linear infinite;
}