@charset "utf-8";
@media screen and (max-width:640px){
	.hide {
		display : none;
	}
	.pcH{
		display : block;
	}
	.spH{
		display : none;
	}
	
	.pcVisible{
		display	:	none;
	}
	
/* title */
/*------------------------------------------------------*/
	h3.blueBack{
		background-color : #3f8ecb;
		color : #fff;
		padding-left : 4.5%;
		padding-top : 3%;
		padding-bottom : 5%;
		line-height : 100%;
	}
	h3.pinkBack{
		background-color : #f9b3cc;
		color : #fff;
		padding-left : 4.5%;
		padding-top : 3%;
		padding-bottom : 3%;
		line-height : 100%;
	}
	h3.greenBack{
		background-color : #009b73;
		color : #fff;
		padding-left : 4.5%;
		padding-top : 3%;
		padding-bottom : 3%;
		line-height : 100%;
	}
	h3.purpleBack{
		background-color : #cc80bd;
		color : #fff;
		padding-left : 4.5%;
		padding-top : 3%;
		padding-bottom : 3%;
		line-height : 100%;
	}
	h3.orangeBack{
		background-color : #ffb13e;
		color : #fff;
		padding-left : 4.5%;
		padding-top : 3%;
		padding-bottom : 3%;
		line-height : 100%;
	}
	h3.limegreenBack{
		background-color : #32cd32;
		color : #fff;
		padding-left : 4.5%;
		padding-top : 3%;
		padding-bottom : 3%;
		line-height : 100%;
	}
/* box */
/*------------------------------------------------------*/
	.inner{
		width	:	96%;
		margin-left	:	auto;
		margin-right	:	auto;
	}
	
	
	
/* header */
/*------------------------------------------------------*/
	#headWrap{
		padding : 1.5% 0;
	}
	#logo{
		width : 80%;
		float : left;
		margin-left : 3.3%;
	}
	#logo img{
		width : 100%;
	}
	#headNav{
		display: none;
	}
	#spMenu{
		width : 12.6%;
		float : right;
		margin-right : 1.7%;
	}
	#spMenu img{
		width : 100%;
	}
	
/* main */
/*------------------------------------------------------*/
	#spProduct ul h4{
		line-height: 1.2;
		margin-bottom: 3%;
		font-size : 110%;
	}
	#spProduct ul li{
		padding : 5% 3%;
		background-image: url(../images/sp/top/arrow.jpg);
		background-repeat: no-repeat;
		background-position: 97% center;
		background-size : auto 25px;
	}
	#spProduct ul li:first-child{
		border-bottom : 1px solid #d8d8d8;
	}
	.spProductPict{
		width : 30%;
		margin-right : 4%;
		float : left;
	}
	.spProductPict img{
		width : 100%;
	}
	#spProduct ul li p{
		width : 55%;
		float : left;
		font-size : 90%;
		line-height: 1.4;
	}
	
	#spIntro ul li{
		padding : 5% 3%;
		background-image: url(../images/sp/top/arrow.jpg);
		background-repeat: no-repeat;
		background-position: 97% center;
		background-size : auto 25px;
		border-top: 1px solid #d8d8d8;
	}
	#spIntro ul li:first-child{
		border-top: none;
	}
	.spIntroPict{
		width : 23%;
		margin-right : 4%;
		float : left;
	}
	.spIntroPict img{
		width : 100%;
	}
	.spIntroDetail{
		width : 66%;
		float : left;
	}
	.spIntroDetail h4{
		line-height: 1.2;
		margin-bottom: 3%;
		font-size : 110%;
		color : #009b73;
	}
	.spIntroDetail p{
		font-size : 90%;
		line-height: 1.4;
	}
	#spZirei li,#spSup li{
		padding : 5% 3%;
		background-image: url(../images/sp/top/arrow.jpg);
		background-repeat: no-repeat;
		background-position: 97% center;
		background-size : auto 25px;
		border-top: 1px solid #d8d8d8;
	}
	#spZirei li:first-child,#spSup li:first-child{
		border-top: none;
	}
	#spZirei h4{
		line-height: 1.2;
		margin-bottom: 3%;
		font-size : 110%;
		color : #cc80bd;
	}
	#spZirei p,#spSup p{
		font-size : 90%;
		line-height: 1.4;
		width : 90%;
	}
	
	#spSup h4{
		line-height: 1.2;
		margin-bottom: 3%;
		font-size : 110%;
		color : #ffb13e;
	}

	#spInfo h3{
		padding-bottom: 3%;
	}	
	/*#spInfo li{
		float: left;
		padding : 1% 1%;
		font-size : 80%;
		text-align: center;
		display: inline;
	}*/
	ul#info{
		margin-top: 4%;
	}

	ul#info li {
		display: inline;
		margin: 1% 1%;
		font-size : 80%;
	}
	ul#info li a:hover{
		color: #36F;
    	text-decoration: underline;
	}

	li#info_title{
		width: 100px;
		float: left;
		display: block;
		clear: both;
	}
	li#info_content{
		float: left;
		display: block;
		clear: both;
	}
	
	.w5{
		width : 5%;
	}
	.w25{
		width : 25%;
		padding : 0 2.5%;
	}
	.w70{
		width : 63%;
		padding-left : 2%;
	}
	
	
	
	/*下部グローバル*/
	#siteSup{
		width : 100%;
	}
	#siteSup ul{
		width : 100%;
		padding-top : 3.5%;
		padding-bottom : 7%;
	}
	#siteSup ul li{
		width : 45%;
		margin : 1.5% 2%;
		float : left;
		font-size : 85%;
		box-sizing: border-box;
		border : 1px solid #b4cef4;
		border-radius: 6px;
	}
	#siteSup ul li:nth-of-type(odd){
		margin-left : 3%;
	}
	#siteSup ul li:nth-of-type(even){
		margin-right : 3%;
	}
	#siteSup ul li a{
		display : block;
		padding : 5% 0;
		padding-left : 8.5%;
		background-image: url(../images/sp/arrow.jpg);
		background-position: 99% center;
		background-repeat: no-repeat;
		background-size: auto 30%;
	}
	
	/*フッター*/
	#footerWrap{
		padding : 3% 0;
		border-top : 2px solid #3f8ecb;	}
	
	#flogoL{
		float : none;
		width : 70%;
		margin : 0 auto;
	}
	#flogoL img{
		width : 100%;
	}
	#copyWrap{
		padding : 0 0 3%;
	}
	#copy{
		font-size : 60%;
		color : #363636;
		text-align: center;
	}
	
	
	/*---Menu 触らないこと---*/
	#build-menu-page {
	  left: 0;
	  position: relative;
	  background-color: #fff;
	}
	
	#build-menu {
		visibility: visible;
		z-index: 0;
		opacity: 1;
		-webkit-transform: none;
		-moz-transform: none;
		-o-transform: none;
		-ms-transform: none;
		transform: none;
		display: none;
		width: 220px;
	  padding: 0;
	  position: static;
	  z-index: 0;
	  top: 0;
	  height: 100%;
	  overflow-y: auto;
	  left: 0;
	  float: right;
	  box-sizing: border-box;
	  background-color : #ececec;
	}
	.mobile-nav-0{
		padding : 0% 0%;
	}
	.mobile-nav-0 li{
		background-image : url("../img/menu/arrow.png");
		background-repeat: no-repeat;
		background-position: right center;
		background-size: 6.0%;
		border-top : 1px solid #f7f7f7;
		border-bottom : 1px solid #fff;
		color : #2c6db2;
		font-size: 12px;
	}
	.mobile-nav-0 li a{
		padding : 9% 4%;
		color : #2c6db2;
		text-decoration: none;
	}
	.mobile-nav-0 li.or span{
		color : #ee7600;
		font-size : 120%;
		vertical-align: text-bottom;
	}
	.mobile-nav-0 li.gr span{
		color : #00879e;
		font-size : 120%;
		vertical-align: text-bottom;
	}
	.mobile-nav-0 li.pr span{
		color : #5d305f;
		font-size : 120%;
		vertical-align: text-bottom;
	}
	.mobile-nav-0 li.or a{
		color : #ee7600;
	}
	.mobile-nav-0 li.gr a{
		color : #00879e;
	}
	.mobile-nav-0 li.pr a{
		color : #5d305f;
	}
	.mobile-nav-0 li:first-child{
		border-top : none;
		border-bottom : 1px solid #fff;
	}
	.build-menu-animating #build-menu-page {
		position: fixed;
		overflow: hidden;
		width: 100%;
		top: 0;
		bottom: 0;
	}
	
	.build-menu-animating.build-menu-close #build-menu-page,
	.build-menu-animating.build-menu-open #build-menu-page {
		-webkit-transition: -webkit-transform 250ms;
		-moz-transition: -moz-transform 250ms;
		-o-transition: -o-transform 250ms;
		-ms-transition: -ms-transform 250ms;
		transition: transform 250ms;
	}
	
	.build-menu-animating.build-menu-open #build-menu-page {
		-webkit-transform: translate3d(0, 0, 0);
		-moz-transform: translate3d(0, 0, 0);
		-o-transform: translate3d(0, 0, 0);
		-ms-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
	
	.build-menu-animating #build-menu { display: block }
	
	.build-menu-open #build-menu {
		display: block;
		-webkit-transition-delay: 0ms, 0ms, 0ms;
		-moz-transition-delay: 0ms, 0ms, 0ms;
		-o-transition-delay: 0ms, 0ms, 0ms;
		-ms-transition-delay: 0ms, 0ms, 0ms;
		transition-delay: 0ms, 0ms, 0ms;
	}
	
	.build-menu-open #build-menu a{
		display	:	block;
	}
	
	.build-menu-open #build-menu,
	.build-menu-close #build-menu {
		-webkit-transition: -webkit-transform 250ms, opacity 250ms, visibility 0ms 250ms;
		-moz-transition: -moz-transform 250ms, opacity 250ms, visibility 0ms 250ms;
		-o-transition: -o-transform 250ms, opacity 250ms, visibility 0ms 250ms;
		-ms-transition: -ms-transform 250ms, opacity 250ms, visibility 0ms 250ms;
		transition: transform 250ms, opacity 250ms, visibility 0ms 250ms;
	}
	
	
	/**/
	
	
	
	/* content */
	#contentWrap{
		width : 100%;
		background-color: #f3f8fc;
		padding : 25px 0 ;
	}
	#content{
		width : 100%;
		margin : 0 auto;
		box-sizing: border-box;
		padding : 0 3%;
	}
	#main{
		width : 100%;
		float : none;
		box-sizing: border-box;
		margin-bottom : 6%;
	}
	#mainInner{
		width : 100%;
		background-color : #fff;
		box-sizing: border-box;
	}
	#side{
		width : 100%;
		float : none;
		box-sizing: border-box;
	}
	#sideMenu{
		width : 100%;
		padding : 10px;
		background-color : #fff;
		margin-bottom : 20px;
		box-sizing: border-box;
	}
	#sideMenu h3{
		color : #fff;
		font-size : 130%;
		padding : 5px 10px;
	}
	#sideMenu.pink h3{
		background-color : #f8b4cd;
	}
	#sideMenu.green h3{
		background-color : #019972;
	}
	#sideMenu.orange h3{
		background-color : #feb13d;
	}
	#sideMenu.gray h3{
		background-color : #666;
	}
	#sideMenu.purple h3{
		background-color : #744B86;
	}
	#sideMenu .icon-arrow{
		font-size : 65%;
		vertical-align: top;
	}
	#sideMenu.pink .icon-arrow{
		color : #f8b4cd;
	}
	#sideMenu.green .icon-arrow{
		color : #019972;
	}
	#sideMenu.orange .icon-arrow{
		color : #feb13d;
	}
	#sideMenu.gray .icon-arrow{
		color : #666;
	}
	#sideMenu.purple .icon-arrow{
		color : #744B86;
	}
	#sideMenu ul li{
		border-top : 1px solid #e8e8e8;
	}
	#sideMenu ul li:first-child{
		border-top : none;
	}
	#sideMenu ul li a{
		padding : 20px 0;
		display: block;
	}
	.sideSection{
		border-radius: 6px;
		margin-bottom : 10px;
	}
	.sideSection a{
		padding : 13px;
		display: block;
	}
	.sideSection.purple{
		background-color : #a2c3ee;
	}
	.sideSection.pink{
		background-color : #f8b4cd;
	}
	.sideSection.blue{
		background-color : #87c3f5;
	}
	.sideSection.green{
		background-color : #8CD98C;
	}
	.sideSection.violet{
	background-color : #875CC6;
	}
	.sideSection.orange{
	background-color : #FFAF78; 
	}
	.sideSection.mosgreen{
	background-color : #5E8E5E; 
	}
	
	.sideSection h4{
		font-size : 110%;
		color : #fff;
	}
	.sideSection div p{
		font-size : 90%;
		width : 77%;
		float : left;
		color : #fff;
		line-height : 1.2;
	}
	.sideSection div img{
		width : 20%;
		float : right;
	}
	
	
	
	
	
	/* sideArrow */
		@font-face {
			font-family: 'icomoon';
			src:url('/fonts/icomoon.eot?-e7ize5');
			src:url('/fonts/icomoon.eot?#iefix-e7ize5') format('embedded-opentype'),
				url('/fonts/icomoon.woff?-e7ize5') format('woff'),
				url('/fonts/icomoon.ttf?-e7ize5') format('truetype'),
				url('/fonts/icomoon.svg?-e7ize5#icomoon') format('svg');
			font-weight: normal;
			font-style: normal;
		}
		
		[class^="icon-"], [class*=" icon-"] {
			font-family: 'icomoon';
			speak: none;
			font-style: normal;
			font-weight: normal;
			font-variant: normal;
			text-transform: none;
			line-height: 1;
		
			/* Better Font Rendering =========== */
			-webkit-font-smoothing: antialiased;
			-moz-osx-font-smoothing: grayscale;
		}
		
		.icon-arrow:before {
			content: "\61";
		}
	
	
	#spMain{
		width : 100%;
	}
	#spMain img{
		width : 100%;
	}
	
	#spHuman ul{
		padding : 5% 3%;
	}
	#spHuman ul li{
		margin-bottom : 4%;
		width : 46.2%;
		float : left;
	}
	#spHuman ul li:nth-of-type(odd){
		margin-right : 7.6%;
	}
	#spHuman ul li img{
		width: 100%;
	}
	#spHuman ul li dl dt{
		font-size : 70%;
	}

	p.alignC{
		display: none;
	}

}/*END @media screen and (max-width:640px)*/