@charset "utf-8";
/* CSS Document */

a:hover{
	text-decoration: none;
}

h3.color01{
	color: #ec6d7b;
}
h3.color02{
	color: #68be83;
}
h3.color03{
	color: #4a8dcb;
}

/* PC (1025～)
-----------------------------------------------------------------
----------------------------------------------------------------- */

@media screen and (min-width: 641px), print {


/* section.mainVisual
---------------------------------------------------- */
section.mainVisual {
	width:100%;
	height:auto;
	margin: 0 auto 66px;
}




/* section.catch
---------------------------------------------------- */
	section.catch .sectionBlock{
		margin: 0 auto;
	}
	h1 span{
		display: inline-block;
		font-size: 66%;
		margin-bottom: 8px;
	}
		section.catch p{
			font-size: 106%;
			line-height: 2;
			letter-spacing: 0.01em;
			text-align: center;
			width: 100%;
			margin: 0 auto 0;
		}

/* section.smartBlock
---------------------------------------------------- */
		section.contents .sectionBlock{
			padding-bottom: 80px;
			border-bottom: 1px solid #ABD4AB;
		}
			section.contents .sectionBlock div.sec{
				width: 100%;
			}
				section.contents .sectionBlock div.sec .photoBox{
					width: 100%;
					overflow: hidden;
					margin-top: 50px;
				}
					section.contents .sectionBlock div.sec .photoBox div{
						float: left;
						width: 32%;
						margin: 0 2% 0 0;
					}
						section.contents .sectionBlock div.sec .photoBox div figure{
							width: 100%;
						}
							section.contents .sectionBlock div.sec .photoBox div figure img{
								width: 100%;
								height: auto;
							}
						section.contents .sectionBlock div.sec .photoBox div h3{
							width: 100%;
							text-align: center;
							font-weight: 900;
							margin-top: 5px;
							letter-spacing: 0.03em;
						}
				section.contents .sectionBlock div.sec dl{
					width: 86%;
					overflow: hidden;
				    font-size: 136%;
				    letter-spacing: 0.01em;
					margin: 80px auto 0;
				}
					section.contents .sectionBlock div.sec dl dt{
						float: left;
						width: 19%;
						font-weight: 600;
						border-bottom: 3px solid #3EB034;
						margin-right: 4%;
					}
					section.contents .sectionBlock div.sec dl dd{
						float: right;
						width: 77%;
						margin-bottom: 11px;
						padding-left: 36px;
						background: url(../images/soundproof/icon01.png) no-repeat left center;
						background-size: 27px auto;
						-webkit-box-sizing: border-box;
						box-sizing: border-box;
					}
	

				p.figTitle{
					text-align: center;
					width: 60%;
					margin: 36px auto 16px;
					color: #3eb134;
					font-size: 106%;
					-webkit-box-sizing: border-box;
					box-sizing: border-box;
					line-height: normal;
					position: relative;
				}
					 p.figTitle span{
						display: inline-block;
						text-align: center;
						width: 60%;
						padding: 0.7em 0.3em;
						background: #fff;
						color: #333;
					}
				p.figTitle::after{
					position: absolute;
					z-index: -100;
					top: 47%;
					left: 0;
					content: "";
					display: block;
					width: 100%;
					height: 1px;
					border-bottom: 1px solid #ABD4AB;
				}	
/* section.functionList
---------------------------------------------------- */
section.functionList{
	width: 100%;
	margin-bottom: 80px;
}
	section.functionList div.sectionBlock{
		width: 1000px;
		margin: 0 auto;
	}
		section div.sectionBox{
			width: 100%;
		}
			section.functionList h2{
				width: 100%;
				font-size: 166%;
				font-weight: 900;
				letter-spacing: 0.01em;
				text-align: center;
				margin: 0 auto 36px;
			}
			section.functionList div.sectionBlock div.flow{
				width: 97%;
				overflow: hidden;
				margin: 0 auto 47px;
			}
				section.functionList div.sectionBlock div.flow div.listBox{
					width: 100%;
					overflow: hidden;
					margin: 0 auto 33px;
				}
				section.functionList div.sectionBlock div.flow div figure{
					float: left;
					width: 8%;
				}
					section.functionList div.sectionBlock div.flow div figure img{
						width: 100%;
						height: auto;
					}
				section.functionList div.sectionBlock div.flow div div{
					float: left;
					width: 62%;
					margin-left: 3%;
				}
					section.functionList div.sectionBlock div.flow div div h3{
						font-size: 166%;
						font-weight: 900;
						letter-spacing: 0.01em;
						margin: 24px auto 0;
						padding-left: 1.5em;
					}
					section.functionList div.sectionBlock div.flow div div h3.list1{
						background: url(../images/soundproof/line01.png) no-repeat left center;
					}
					section.functionList div.sectionBlock div.flow div div h3.list2{
						background: url(../images/soundproof/line02.png) no-repeat left center;
					}
					section.functionList div.sectionBlock div.flow div div h3.list3{
						background: url(../images/soundproof/line03.png) no-repeat left center;
					}
						section.functionList div.sectionBlock div.flow div div h3 span{
							display: inline-block;
							margin-left: 1em;
							font-size: 76%;
							font-weight: 400;
						}
					section.functionList div.sectionBlock div.flow div div p{
						font-size: 116%;
						letter-spacing: 0.01em;
						margin: 12px auto 0;
						padding-left: 2.3em;
						border-bottom: 2px solid #ec6d7b;
					}
					section.functionList div.sectionBlock div.flow div div p.list1{
						border-bottom: 2px solid #ec6d7b;
					}
					section.functionList div.sectionBlock div.flow div div p.list2{
						border-bottom: 2px solid #227fc5;
					}
					section.functionList div.sectionBlock div.flow div div p.list3{
						border-bottom: 2px solid #3fb135;
					}
				section.functionList div.sectionBlock div.flow div.listBox div.rightBox{
					float: left;
					width: 22%;
					margin-right: 3%;
					margin-left: 0;
				}
					section.functionList div.sectionBlock div.flow div.listBox div.rightBox figure{
						width: 100%;
						margin-top: 33px;
					}
						section.functionList div.sectionBlock div.flow div.listBox div.rightBox figure img{
							width: 100%;
							height: auto;
						}
					section.functionList div.sectionBlock div.flow div.listBox div.rightBox figcaption{
						width: 100%;
						text-align: center;
					}
	
			section.functionList div.sectionBlock div.sec{
				width: 100%;
				overflow: hidden;
			}
				section.functionList div.sectionBlock div.sec figure{
					float: left;
					width: 51%;
				}
					section.functionList div.sectionBlock div.sec figure img{
						width: 100%;
						height: auto;
					}
				section.functionList div.sectionBlock div.sec dl{
					float: right;
					width: 44%;
				}
					section.functionList div.sectionBlock div.sec dl dt{
						width: 100%;
						font-size: 166%;
						font-weight: 900;
						letter-spacing: 0.01em;
						line-height: 1.8;
						margin: 30px 0;
					}
					section.functionList div.sectionBlock div.sec dl dd{
						width: 100%;
						font-size: 106%;
						letter-spacing: 0.01em;
						line-height: 2;
						text-align: justify;
					}

	

/* navBtn
---------------------------------------------------- */
				p.borderBox{
					width: 410px;
					margin: 50px auto;
					text-align: center;
					font-size: 116%;
					letter-spacing: 0.05em;
					color: #000;
					padding: 0.7em 3em;
					border: 2px solid #000;
					-webkit-box-sizing: border-box;
					box-sizing: border-box;
				}
	
	

}

/* SmartPhone
-----------------------------------------------------------------
----------------------------------------------------------------- */

@media screen and (max-width:640px)  {


/* section.mainVisual
---------------------------------------------------- */
section.mainVisual {
	display: block;
	width:100%;
	height:auto;
	margin: 0 auto 33px;
}




/* section.catch
---------------------------------------------------- */
	section.catch .sectionBlock{
		margin: 0 auto;
	}
	h1 span{
		display: inline-block;
		font-size: 77%;
		margin-bottom: 8px;
	}
		section.catch p.readCopy{
			width: 100%;
			font-size: 133%;
			font-weight: 900;
			letter-spacing: 0.01em;
			text-align: center;
		}	
		section.catch p{
			font-size: 106%;
			line-height: 2;
			letter-spacing: 0.01em;
			width: 86%;
			margin: 0 auto 30px;
		}



/* section.smartBlock
---------------------------------------------------- */
		section.contents .sectionBlock{
			padding-bottom: 33px;
			border-bottom: 1px solid #ABD4AB;
		}
			section.contents .sectionBlock div.sec{
				width: 100%;
			}
				section.contents .sectionBlock div.sec .photoBox{
					width: 90%;
					overflow: hidden;
					margin: 0 auto;
				}
					section.contents .sectionBlock div.sec .photoBox div{
						width: 100%;
						margin: 0 auto 22px;
					}
						section.contents .sectionBlock div.sec .photoBox div figure{
							width: 100%;
						}
							section.contents .sectionBlock div.sec .photoBox div figure img{
								width: 100%;
								height: auto;
							}
						section.contents .sectionBlock div.sec .photoBox div h3{
							width: 100%;
							text-align: center;
							font-weight: 900;
							margin-top: 5px;
							letter-spacing: 0.03em;
						}
				section.contents .sectionBlock div.sec dl{
					width: 90%;
					overflow: hidden;
				    font-size: 116%;
				    letter-spacing: 0.01em;
					margin: 11px auto 0;
				}
					section.contents .sectionBlock div.sec dl dt{
						width: 40%;
						font-weight: 600;
						border-bottom: 3px solid #3EB034;
						margin-bottom: 22px;
					}
					section.contents .sectionBlock div.sec dl dd{
						width: 100%;
						margin-bottom: 11px;
						padding-left: 26px;
						line-height: 21px;
						background: url(../images/soundproof/icon01.png) no-repeat left 1px center;
						background-size: auto 17px;
						-webkit-box-sizing: border-box;
						box-sizing: border-box;
					}
	
				p.figTitle{
					text-align: center;
					width: 100%;
					margin: 22px auto 11px;
					color: #3eb134;
					font-size: 106%;
					-webkit-box-sizing: border-box;
					box-sizing: border-box;
					line-height: normal;
					position: relative;
				}
					 p.figTitle span{
						display: inline-block;
						text-align: center;
						width: 64%;
						padding: 0.7em 0.3em;
						background: #fff;
						color: #333;
					}
				p.figTitle::after{
					position: absolute;
					z-index: -100;
					top: 47%;
					left: 0;
					content: "";
					display: block;
					width: 100%;
					height: 1px;
					border-bottom: 1px solid #ABD4AB;
				}	

/* section.functionList
---------------------------------------------------- */
section.functionList{
	width: 100%;
	margin-bottom: 33px;
}
	section.functionList div.sectionBlock{
		width: 94%;
		margin: 0 auto;
	}
		section div.sectionBox{
			width: 100%;
		}
			section.functionList h2{
				width: 100%;
				font-size: 133%;
				font-weight: 900;
				letter-spacing: 0.01em;
				text-align: center;
				margin: 0 auto 22px;
			}
			section.functionList div.sectionBlock div.flow{
				width: 100%;
				overflow: hidden;
				margin: 0 auto;
			}
				section.functionList div.sectionBlock div.flow div.listBox{
					width: 100%;
					overflow: hidden;
					margin: 0 auto 33px;
				}
				section.functionList div.sectionBlock div.flow div figure{
					float: left;
					width: 22%;
				}
					section.functionList div.sectionBlock div.flow div figure img{
						width: 100%;
						height: auto;
					}
				section.functionList div.sectionBlock div.flow div div{
					float: right;
					width: 75%;
					margin-left: 3%;
				}
					section.functionList div.sectionBlock div.flow div div h3{
						font-size: 133%;
						font-weight: 900;
						letter-spacing: 0.01em;
						margin: 0 auto 0;
						padding-left: 1.5em;
					}
					section.functionList div.sectionBlock div.flow div div h3.list1{
						background: url(../images/soundproof/line01.png) no-repeat left top;
						background-size: 16px auto;
					}
					section.functionList div.sectionBlock div.flow div div h3.list2{
						background: url(../images/soundproof/line02.png) no-repeat left top;
						background-size: 16px auto;
					}
					section.functionList div.sectionBlock div.flow div div h3.list3{
						background: url(../images/soundproof/line03.png) no-repeat left top;
						background-size: 16px auto;
					}
						section.functionList div.sectionBlock div.flow div div h3 span{
							display: block;
							font-size: 76%;
							font-weight: 400;
						}
					section.functionList div.sectionBlock div.flow div div p{
						font-size: 96%;
						margin: 8px auto 0;
						padding-left: 2em;
						padding-bottom: 6px;
						border-bottom: 2px solid #ec6d7b;
					}
					section.functionList div.sectionBlock div.flow div div p.list1{
						border-bottom: 2px solid #ec6d7b;
					}
					section.functionList div.sectionBlock div.flow div div p.list2{
						border-bottom: 2px solid #227fc5;
					}
					section.functionList div.sectionBlock div.flow div div p.list3{
						border-bottom: 2px solid #3fb135;
					}
				section.functionList div.sectionBlock div.flow div.listBox div.rightBox{
					float: left;
					width: 22%;
					margin: 0 auto;;
				}
					section.functionList div.sectionBlock div.flow div.listBox div.rightBox figure{
						width: 100%;
					}
						section.functionList div.sectionBlock div.flow div.listBox div.rightBox figure img{
							width: 100%;
							height: auto;
						}
					section.functionList div.sectionBlock div.flow div.listBox div.rightBox figcaption{
						width: 100%;
						text-align: center;
					}
	
			section.functionList div.sectionBlock div.sec{
				width: 100%;
				overflow: hidden;
			}
				section.functionList div.sectionBlock div.sec figure{
					width: 100%;
					overflow: hidden;
				}
					section.functionList div.sectionBlock div.sec figure img{
						width: 100%;
						height: auto;
						transform-origin: top right;
						transform: scale(1.1);
					}
				section.functionList div.sectionBlock div.sec dl{
					width: 100%;
				}
					section.functionList div.sectionBlock div.sec dl dt{
						width: 100%;
						font-size: 133%;
						font-weight: 900;
						letter-spacing: 0.01em;
						line-height: 1.8;
						margin: 18px 0;
					}
					section.functionList div.sectionBlock div.sec dl dd{
						width: 100%;
						font-size: 100%;
						letter-spacing: 0.01em;
						line-height: 2;
						text-align: justify;
					}


/* navBtn
---------------------------------------------------- */
				p.borderBox{
					width: 84%;
					margin: 22px auto 33px;
					text-align: center;
					font-size: 106%;
					letter-spacing: 0.05em;
					color: #000;
					padding: 0.7em 2em;
					border: 2px solid #000;
					-webkit-box-sizing: border-box;
					box-sizing: border-box;
				}

	
}
