@charset "utf-8";

@import url(default.css);
@import url(base.css);


	#contentheader{margin-bottom:40px;}

		#contentheader h1{width:380px;}
		.flexible #contentheader h1{width:285px;}
		.active-sp #contentheader h1{width:190px;}
		
		.flexible #contentheader h1 img{width:285px;}
		.active-sp #contentheader h1 img{width:190px;}
		

	#contentmain{
		max-width:980px;
		margin:0 auto;
		font-family:'kozuka-gothic-pro',"Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
		font-weight:400;
		line-height:1.9em;
		letter-spacing:0.07em;
	}

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

	#contentmain{
		width:96%;
	}

}

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

	#contentmain{
		padding-top:70px;
	}

}

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

	#contentmain{
		position:relative;
		top:-10px;
	}

}

	.contentblock{
		padding-bottom: 50px;
		-moz-box-shadow:0px 0px 3px 0px #aaa;
		-webkit-box-shadow:0px 0px 3px 0px #aaa;
		box-shadow:0px 0px 3px 0px #aaa;
		background-color:#fff;		
	}

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

	.contentblock{
		padding:10px 0 40px;
	}

}

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

	.contentblock{
		padding:10px 0 20px;
	}

}

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

	.contentblock{
		padding:20px 0 10px;
	}

}

		.contentblock .inner{
			max-width:900px;
			width:92%;
			margin:0 auto;
		}
	
			.contentblock .inner .enerezza{
				display: block;
				max-width:330px;
				width:60%;
				margin: 0 auto;
			}
			.contentblock .inner .enerezza img{
				width:100%;
				height: auto;
			}
	
				.contentblock .inner .enerezza + p{
					color:#f60;
					font-weight: 700;
					font-size: 3.2em;
					text-align: center;
				}

			@media screen and (max-width:770px){
	
				.contentblock .inner .enerezza + p{
					font-size: 2.0em;
				}

			}

			@media screen and (max-width:480px){
	
				.contentblock .inner .enerezza + p{
					font-size: 1.4em;
				}

			}

		.contentblock + p{
			max-width: 840px;
			width: 90%;
			margin: 50px auto;
			color:#0D318F;
			font-size: 1.2em;
			line-height: 2.0em;
		}


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

		.contentblock + p{
			margin: 40px auto;
			font-size: 1.1em;
			line-height: 1.9em;
		}

	}

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

		.contentblock + p{
			margin: 30px auto;
			font-size: 1.0em;
			line-height: 1.8em;
		}

	}

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

		.contentblock + p{
			margin: 20px auto;
		}

	}

	.contentblock h2{
		margin-bottom:20px;
		position:relative;
		top:-20px;
	}
	.contentblock h2 img{
		width:100%;
	}

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

	.contentblock h2{
		margin-bottom:0;
	}

}


		.contentblock .remarks{
			margin:5px 0 20px;
			font-size:0.9em;
			position:relative;
		}

		.contentblock .catch{
			color:#0d318f;
			font-size:2.45em;
			font-family: 'Sawarabi Mincho', Helvetica, Arial, sans-serif;
			text-align:center;
		}

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

		.contentblock .catch{
			font-size:3.3vw;
		}

	}

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

		.contentblock .catch{
			font-size:1.4em;
		}

	}

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

		.contentblock .catch{
			font-size:1.2em;
		}

	}

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

		.contentblock .catch{
			font-size:1.1em;
		}

	}
	



		#outlinepoint{
			max-width:690px;
			width:90%;
			margin:0 auto;
			position:relative;
			z-index:10;
		}


			#outlinepoint li{
				width:210px;
				height:210px;
				margin:0 10px;
				color:#fff;
				font-size:2.4em;
				font-weight:700;
				text-align:center;
				list-style:none;
				line-height:1.3em;
				float:left;
				border-radius:105px;
				background-color:#4D5269;
			}

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

		#outlinepoint{width:630px;}

	
			#outlinepoint li{
				width:190px;
				height:190px;
				margin:0 10px;
				font-size:2.0em;
				border-radius:95px;
			}
	
	}

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

		#outlinepoint{width:480px;}

	
			#outlinepoint li{
				width:150px;
				height:150px;
				margin:0 5px;
				font-size:1.7em;
				line-height:1.4em;
				border-radius:75px;
			}
	
	}

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

		#outlinepoint{width:300px;}

	
			#outlinepoint li{
				width:140px;
				height:140px;
				font-size:1.5em;
				border-radius:70px;
			}
			#outlinepoint li:nth-last-of-type(1){
				line-height:1.3em;
				position:relative;
				top:-13px;
				left:75px;
			}

	}

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

		#outlinepoint{width:220px;}
	
			#outlinepoint li{
				width:100px;
				height:100px;
				font-size:1.2em;
				-moz-box-shadow:0 0 0 2px #6e83bc inset;
				-webkit-box-shadow:0 0 0 2px #6e83bc inset;
				box-shadow:0 0 0 2px #6e83bc inset;
			}
			#outlinepoint li:nth-last-of-type(1){
				line-height:1.2em;
				top:-5px;
				left:55px;
			}

	}



			#outlinepoint li p{
				width:100%;
				height:100%;
				margin:0;
				display:-webkit-flex;
				display:flex;
				-webkit-align-items:center;
				align-items:center;
				justify-content: center;
				-ms-flex-align: center;
			}




/* 特徴 */

	.block{
		margin-bottom: 40px;
		padding:60px 0 40px;
		-moz-box-shadow:0px 0px 3px 0px #aaa;
		-webkit-box-shadow:0px 0px 3px 0px #aaa;
		box-shadow:0px 0px 3px 0px #aaa;
		background-color:#fff;		
	}

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

	.block{
		padding:50px 0 40px;
	}

}

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

	.block{
		padding:40px 0 20px;
	}

}

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

	.block{
		padding:30px 0 10px;
	}

}

		.block .inner{
			width:90%;
			margin:0 auto;
		}

		.block h2{
			color:#0D318F;
			font-size: 3.2em;
			font-weight: 700;
			text-align: center;
		}

	@media screen and (max-width:770px){
	
		.block h2{
			font-size: 2.0em;
		}

	}

	@media screen and (max-width:480px){
	
		.block h2{
			font-size: 1.4em;
		}

	}




	.features{
		overflow: hidden;
	}

	.features ol{
		width:90%;
		margin:20px auto;
	}

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

	.features ol{
		margin:0 auto 20px;
	}

}
	

		.features ol li{
			padding-left:40px;
			list-style: none;
		}
		.features ol li:before{
			color:#0D318F;
			font-family: 'Sawarabi Mincho', Helvetica, Arial, sans-serif;
			font-size: 4.0em;
			position: relative;
			top:40px;
			left:-50px;
		}
		.features ol li:nth-of-type(1):before{content:"1";}
		.features ol li:nth-of-type(2):before{content:"2";}
		.features ol li:nth-of-type(3):before{content:"3";}
		.features ol li:nth-of-type(4):before{content:"4";}

	@media screen and (max-width:770px){
	
		.features ol li:before{
			font-size: 3.2em;
			top:35px;
			left:-40px;
		}

	}

	@media screen and (max-width:480px){
	
		.features ol li:before{
			font-size: 2.4em;
			top:30px;
			left:-30px;
		}

	}


		.features h3{
			margin: 0 0 20px;
			color:#0D318F;
			font-size:2.2em;
			font-weight:400;
		}

	@media screen and (max-width:770px){
	
		.features h3{
			font-size: 1.8em;
		}

	}

	@media screen and (max-width:480px){
	
		.features h3{
			font-size: 1.4em;
		}

	}


		.features p{
			margin-bottom: 0;
		}

	.features ol + p{
		max-width:600px;
		width:90%;
		margin: 30px auto 0;
	}
	.features ol + p img{
		width:100%;
		height:auto;
	}



/* 運転モード */

		.modelbl{
			margin: 50px 0 30px;
			color:#0D318F;
			font-size:2.2em;
			font-family: 'Sawarabi Mincho', Helvetica, Arial, sans-serif;
			text-align: center;
		}

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

		.modelbl{
			margin: 40px 0 20px;
			font-size:2.0em;
		}
		
	}

	@media screen and (max-width:770px){
	
		.modelbl{
			margin: 30px 0 20px;
			font-size: 1.4em;
		}

	}

	@media screen and (max-width:480px){
	
		.modelbl{
			margin:10px 0 10px;
			font-size: 1.2em;
		}

	}

	@media screen and (max-width:430px){
	
		.modelbl{
			font-size: 1.0em;
		}

	}

	@media screen and (max-width:370px){
	
		.modelbl{
			line-height: 1.3em;
		}

	}

	@media screen and (max-width:480px){
	
		.features h3{
			font-size: 1.4em;
		}

	}

		.mode h3{
			display:-webkit-flex;
			display:flex;
			justify-content: center;
			-webkit-align-items:center;
			align-items:center;
			height:65px;
			color:#fff;
			font-size: 2.7em;
			text-align: center;
			background: #0d318f;
			border-radius: 10px;
		}
		.mode h3 span{
			color:#f60;
			font-weight: 700;
		}

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

		.mode h3{
			height:60px;
			font-size: 2.4em;
		}

	}

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

		.mode h3{
			height:50px;
			font-size: 2.0em;
			border-radius: 5px;
		}

	}

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

		.mode h3{
			height:40px;
			font-size: 1.6em;
		}

	}

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

		.mode h3{
			height:35px;
			font-size: 1.4em;
		}

	}


		.mode h3 + p{
			margin: 25px 0;
			color:#0D318F;
			font-size:2.2em;
			font-family: 'Sawarabi Mincho', Helvetica, Arial, sans-serif;
			line-height: 1.5em;
		}

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

		.mode h3 + p{
			margin: 20px 0;
			font-size:1.8em;
		}
		
	}

	@media screen and (max-width:770px){
	
		.mode h3 + p{
			margin: 20px 0;
			font-size: 1.4em;
		}

	}

	@media screen and (max-width:480px){
	
		.mode h3 + p{
			margin:15px 0;
			font-size: 1.2em;
		}

	}

	@media screen and (max-width:430px){
	
		.mode h3 + p{
			font-size: 1.0em;
		}

	}

	@media screen and (max-width:370px){
	
		.mode h3 + p{
			line-height: 1.3em;
		}

	}


		.mode h3 + p + p{
			margin: 0 0 25px;
		}

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

		.mode h3 + p + p{
			margin: 0 0 20px;
		}
		
	}

	@media screen and (max-width:480px){
	
		.mode h3 + p + p{
			margin: 0 0 15px;
		}

	}

		.mode h3 + p + p span{
			font-size:0.9em;
		}



		.flow1{
			max-width: 860px;
			width:100%;
			margin:0 auto;
		}
		.flow1 img{
			width:100%;
			height: auto;
		}

		.flow2{
			display: none;
			max-width: 340px;
			width:100%;
			margin:0 auto;
		}
		.flow2 img{
			width:100%;
			height: auto;
		}

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

		.flow1{
			display: none;
		}

		.flow2{
			display: block;
		}

	}


	/* 停電に備える */

		.teiden h3{
			display:-webkit-flex;
			display:flex;
			justify-content: center;
			-webkit-align-items:center;
			align-items:center;
			max-width:300px;
			width:80%;
			height:50px;
			margin: 30px auto 50px;
			color:#fff;
			font-size: 2.0em;
			text-align: center;
			background-color: #f60;
			border-radius: 5px;
		}

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

		.teiden h3{
			height:40px;
			margin: 20px auto 30px;
			font-size: 1.6em;
		}

	}

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

		.teiden h3{
			font-size: 1.4em;
		}

	}

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

		.teiden h3{
			height:35px;
			margin: 15px auto 30px;
			font-size: 1.3em;
		}

	}



		.teiden h3 + p{
			color:#0d318f;
			font-size: 2.8em;
			font-family: 'Sawarabi Mincho', Helvetica, Arial, sans-serif;
			text-align: center;
		}

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

		.teiden h3 + p{
			font-size: 2.4em;
		}

	}

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

		.teiden h3 + p{
			font-size: 1.8em;
		}

	}

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

		.teiden h3 + p{
			font-size: 1.3em;
		}

	}


		.teiden .note img{
			width:240px;
			height:auto;
			margin: 0 0 20px 30px;
			float: right;
		}

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

		.teiden .note img{
			display: block;
			margin: 0 auto 30px;
			float: none;
		}

	}

		.teiden .note ul{
			margin-left: 20px;
		}

		.teiden .note ul li{
			margin-bottom: 8px;
		}


		.teiden .note h4{
			margin-bottom: 5px;
			color:#0d318f;
			font-weight: 700;
		}
			
			.teiden .note h4 + ul{
				font-size:0.9em;
				line-height: 1.8em;
			}

		.teiden .blockfooter{
			margin-top:30px;
		}


			.teiden .blockfooter .box{
				width:34%;
				padding: 15px 2%;
				background-color: #e7eaf4;
				float: left;
			}

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

			.teiden .blockfooter .box{
				width:90%;
				margin-bottom: 30px;
				padding: 15px 5%;
				float:none;
			}

		}


				.teiden .blockfooter .box h4{
					padding: 7px 0;
					color:#fff;
					font-size: 1.3em;
					text-align: center;
					background-color: #0d318f;

				}

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

				.teiden .blockfooter .box h4{
					font-size: 1.1em;
				}

			}



				.teiden .blockfooter .box p{
					margin: 12px 0 0;
					font-size: 0.9em;
					line-height: 1.7em;
				}

			.teiden .blockfooter .box:nth-last-of-type(1){
				width:21%;
				float:right;
			}

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

			.teiden .blockfooter .box:nth-last-of-type(1){
				width:40%;
			}

		}

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

			.teiden .blockfooter .box:nth-last-of-type(1){
				width:90%;
				padding: 15px 5%;
				float: none;
			}

		}

				.teiden .blockfooter .box:nth-last-of-type(1) p{
					color: #0d318f;
				}

			.teiden .blockfooter .box:nth-last-of-type(1) img{
				display: block;
				width:138px;
				height:auto;
				margin:0 auto;
			}

			.teiden .blockfooter .box + p{
				width:37%;
				text-align: center;
				float: left;
			}

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

			.teiden .blockfooter .box + p{
				width:50%;
				margin: 0;
			}

		}

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

			.teiden .blockfooter .box + p{
				width:90%;
				float: none;
				padding: 0 5% 15px;
			}

		}


	/* 充実の保証 */

		.hosho h2{
			margin-bottom: 50px;
		}

	@media screen and (max-width:770px){
	
		.hosho h2{
			margin-bottom:30px;
		}

	}

			.hosho table{
				width:100%;
				border-collapse: collapse;
			}

			.hosho th{
				padding: 15px 1%;
				color:#f60;
				font-size:1.4em;
				border:1px solid #ccc;
				vertical-align: top;
				background-color: #fff6f0;
			}

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

			.hosho th{
				display: block;
				width:100%;
				padding: 15px 0;
				font-size:1.2em;
			}
			.hosho tr:nth-last-of-type(1) th{
				border-top:none;
			}

		}

			.hosho td:nth-last-of-type(1){
				padding: 15px 2%;
				border:1px solid #ccc;
				vertical-align: top;
 	            overflow-wrap: break-word;
				word-wrap: break-word;
				word-break: break-all;
			}
			.hosho td:nth-last-of-type(2){
				padding: 15px 2%;
				border:1px solid #ccc;
				text-align: center;
				color: #0d318f;
				white-space: nowrap;
				line-height: 1.5em;
			}

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

			.hosho td{
				display: block;
				padding: 15px 5%;
				width:90%;
			}
			.hosho tr:nth-of-type(1) td{
				text-align: center;
			}

			.hosho td:nth-last-of-type(2){
				padding: 5px 5%;
				border-top:none;
				border-bottom:none;
				background-color: #f2f2f2;
			}
			.hosho td:nth-last-of-type(2) br{
				display: none;
			}

		}



	/* 我が家にとって最適な選択は */

		.conclusion h2{
			margin-top: 70px;
			color:#c30;
			font-size: 3.2em;
			font-weight: 700;
			text-align: center;
		}

	@media screen and (max-width:770px){
	
		.conclusion h2{
			margin-top: 50px;
			font-size: 2.0em;
		}

	}

	@media screen and (max-width:480px){
	
		.conclusion h2{
			margin-top: 20px;
			font-size: 1.4em;
		}

	}

		.conclusion p{
			max-width: 840px;
			width: 90%;
			margin: 50px auto;
			color:#0D318F;
			font-size: 1.2em;
			line-height: 2.0em;
		}


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

		.conclusion p{
			margin: 30px auto;
			font-size: 1.1em;
			line-height: 1.9em;
		}

	}

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

		.conclusion p{
			margin: 30px auto;
			font-size: 1.0em;
			line-height: 1.8em;
		}

	}

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

		.conclusion p{
			margin: 20px auto;
		}

	}













	/* ※付き番号 */
	
	ol.komenum li{
		margin-left:35px;
		list-style:none;
	}
	
	ol.komenum li:before{
		margin-right:-23px;
		position:relative;
		left:-35px;
	}
	ol.komenum li:nth-of-type(1):before{content:"※1"}
	ol.komenum li:nth-of-type(2):before{content:"※2"}
	ol.komenum li:nth-of-type(3):before{content:"※3"}
	ol.komenum li:nth-of-type(4):before{content:"※4"}
	ol.komenum li:nth-of-type(5):before{content:"※5"}
	ol.komenum li:nth-of-type(6):before{content:"※6"}
	ol.komenum li:nth-of-type(7):before{content:"※7"}
	ol.komenum li:nth-of-type(8):before{content:"※8"}
	ol.komenum li:nth-of-type(9):before{content:"※9"}
	ol.komenum li:nth-of-type(10):before{content:"※10"}



/* フッター */


	#contentfooter{
		margin-bottom:30px;
		padding-footer:50px;
	}
	
		#contentfooter > img{
			width:100%;
			/*margin-bottom:-280px;*/
		}

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

	#contentfooter{
		margin-bottom:0;
	}
		
}
	
	
		#contentfooter .inner{
			width:560px;
		}
		#contentfooter #footerlogo{width:100%;}

		#contentfooter #footerlogo img{
			width:auto;
			margin:0 10px;
		}

		#contentfooter .inner{
			position:relative;
			z-index:10;
		}


	@media screen and (max-width:700px){
		
		#contentfooter .inner{
			width:100%;
		}
		
		#contentfooter #footerlogo{
			width:233px;
			margin:0 auto;
			float:none;
		}

		#contentfooter #footerlogo img{
			width:100%;
			margin:0;
		}
		
	}


		#contentfooter .inner a{
			display:block;
			width:180px;
			margin:0 auto;
			padding:10px 0 10px 20px;
			font-weight:700;
			text-decoration:none;
			text-align:center;
			background-color:#fc0;
			background-image:url(../tochiboshu/images/ico_contact.png);
			background-repeat:no-repeat;
			background-size:24px auto;
			background-position:20px 8px;
			border-radius:5px;
			position:relative;
			top:20px;
			
		}





		#contentfooter #inner-footer{
			text-align:center;
		}

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

		#contentfooter #inner-footer{
			width:280px;
			text-align:left;
			margin:10px auto 0;
		}

	}



		#catchfooter{
			width:96%;
			margin:60px auto 0;
		}

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

		#catchfooter{margin:40px auto 0;}

	}

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

		#catchfooter{margin:30px auto 0;}

	}
	
		#catchfooter img{
			width:100%;
			height:auto;
		}





	.blocksp{display:none;}
	.blocksp0{display:none;}
	.blocksp0-5{display:none;}
	.blocksp1{display:none;}
	.blocksp1-5{display:none;}
	.blocksp2{display:none;}
	.blocksp2-5{display:none;}
	.blocksp3{display:none;}
	
	.inlinesp{display:none;}
	.inlinesp0{display:none;}
	.inlinesp0-5{display:none;}
	.inlinesp1{display:none;}
	.inlinesp1-5{display:none;}
	.inlinesp2{display:none;}
	.inlinesp2-5{display:none;}
	.inlinesp3{display:none;}
	
	.noblsp{display:block;}
	.noblsp0{display:block;}
	.noblsp0-5{display:block;}
	.noblsp1{display:block;}
	.noblsp1-5{display:block;}
	.noblsp2{display:block;}
	.noblsp2-5{display:block;}
	.noblsp3{display:block;}
	
	.noilsp{display:inline;}
	.noilsp0{display:inline;}
	.noilsp0-5{display:inline;}
	.noilsp1{display:inline;}
	.noilsp1-5{display:inline;}
	.noilsp2{display:inline;}
	.noilsp2-5{display:inline;}
	.noilsp3{display:inline;}

	@media screen and (max-width:1200px){
		.blocksp{display:block;}
		.inlinesp{display:inline;}
		.noblsp{display:none;}
		.noilsp{display:none;}
	}

	@media screen and (max-width:1020px){
		.blocksp0{display:block;}
		.inlinesp0{display:inline;}
		.noblsp0{display:none;}
		.noilsp0{display:none;}
	}

	@media screen and (max-width:840px){
		.blocksp0-5{display:block;}
		.inlinesp0-5{display:inline;}
		.noblsp0-5{display:none;}
		.noilsp0-5{display:none;}
	}

	@media screen and (max-width:770px){
		.blocksp1{display:block;}
		.inlinesp1{display:inline;}
		.noblsp1{display:none;}
		.noilsp1{display:none;}
	}

	@media screen and (max-width:640px){
		.blocksp1-5{display:block;}
		.inlinesp1-5{display:inline;}
		.noblsp1-5{display:none;}
		.noilsp1-5{display:none;}
	}


	@media screen and (max-width:480px){
		.blocksp2{display:block;}
		.inlinesp2{display:inline;}
		.noblsp2{display:none;}
		.noilsp2{display:none;}
	}

	@media screen and (max-width:400px){
		.blocksp2-5{display:block;}
		.inlinesp2-5{display:inline;}
		.noblsp2-5{display:none;}
		.noilsp2-5{display:none;}
	}

	@media screen and (max-width:370px){
		.blocksp3{display:block;}
		.inlinesp3{display:inline;}
		.noblsp3{display:none;}
		.noilsp3{display:none;}
	}