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

	#header-telephone {
		float: left;
	}
}

#navi-wrapper {

	float: right;
	text-align: right;
	margin: 0px 10px 0px 0px;
}

#navi-menu-cb {

	display: none;
	margin: 0px 0px 0px 0px;
}

#navi-menu-toggle-button {

	display: none;
	margin: 0px 0px 0px 0px;
}

#navi-menu-title {

	display: none;
	margin: 0px 0px 0px 0px;
}

#navigation-menu {

	margin: 0px 0px 0px 0px;
	padding: 0px;
	list-style: none;
	z-index: 1000;
}

#navigation-menu li {

	display: block;
	float: left;
	margin: 0px 15px 0px 0px;
}

#navigation-menu li:last-child {
	margin: 0px 0px 0px 0px;
}

#navigation-menu li a {

	display: block;
	text-align: center;
	text-decoration: none;
	color: #000000;
	font-size: 20px;
	font-size: 0.20rem;
	font-weight: bold;
}

#navigation-menu li a:hover {

	color: #ff0000;
	/*text-decoration: underline;*/
}

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

	#navi-wrapper {
		margin: 0px 0px 0px 0px;
	}

	#navi-menu-wrapper {

		position: absolute;
		width: 100%;
		top: 95px;
		left: -100%;
		background-color: rgba(0, 0, 255, 0.8);
		-webkit-transition: left 0.4s;
		transition: left 0.4s;
	}

	/** バーガーメニュー上線 */
	#navi-menu-toggle-button {

		display: block;
		position: ralative;
		float: right;
		width: 30px;
		height: 30px;
		cursor: pointer;
		margin: 20px 15px 0px 0px;
		padding: 0px 0px 0px 0px;
		background-color: #ffffff;
	}

	/** バーガーメニュー中線（位置は上に準拠） */
	#navi-menu-toggle-button::before {

		-webkit-box-shadow: #000000 0 12px 0;
		box-shadow: #000000 0 12px 0;
	}

	/** バーガーメニュー下線位置 */
	#navi-menu-toggle-button::after {

		bottom: 0;
		margin: 0px 0px 22px 0px;
	}

	#navi-menu-toggle-button::before,
	#navi-menu-toggle-button::after {

		width: 30px;
		height: 6px;
		background: #000000;
		display: block;
		content: "";
		position: absolute;
		-webkit-transition: -webkit-box-shadow 0.2s linear, -webkit-transform 0.2s 0.2s;
		transition: box-shadow 0.2s linear, transform 0.2s 0.2s;
	}

	#navi-menu-title {

		font-size: 10px;
		font-size: 0.1rem;
		clear: both;
		display: block;
		float: right;
		margin: 0px 0px 0px 0px;
	}

	#navi-menu-cb:checked ~ #navi-menu-toggle-button::before {

		-webkit-box-shadow: transparent 0 0 0;
		box-shadow: transparent 0 0 0;
		-webkit-transform: rotate(45deg) translate3d(6px, 12px, 0);
		transform: rotate(45deg) translate3d(6px, 12px, 0);
	}

	#navi-menu-cb:checked ~ #navi-menu-toggle-button::after {

		-webkit-transform: rotate(-45deg) translate3d(6px, -12px, 0);
		transform: rotate(-45deg) translate3d(6px, -12px, 0);
	}

	#navi-menu-cb:checked ~ #navi-menu-wrapper {
		left: 0px;
	}

	#navigation-menu {

		float: left;
		margin: 10px 10px 10px 10px;
		padding: 0px 0px 0px 15px;
	}

	#navigation-menu li {

		float: none;
		padding: 0px;
		margin: 0px;
	}

	#navigation-menu li a {

		text-align: left;
		color: #ffffff;
	}
}

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

	#navi-menu-toggle-button {
		margin: 15px 10px 0px 0px;
	}

	#navi-menu-toggle-button::after {
		margin: 0px 0px 13px 0px;
	}

	#navi-menu-wrapper {
		top: 85px;
	}
}

.spacer {

	clear: both;
	height: 150px;
}

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

	.spacer {
		height: 110px;
	}
}

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

	.spacer {
		height: 95px;
	}
}

#main-image {
	margin: 0px 0px 20px 0px;
}

#information {

	background-color: #ff0000;
	color: #ffffff;
	text-align: center;
}

#inquiry {

	background-color: #5fc2f5;
	color: #ffffff;
	text-align: center;
}

.service-contents {

	float: left;
	width: 310px;
	margin: 0px 5px 15px 0px;
	padding: 10px 10px 10px 10px;
}

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

	.service-contents {

		width: 100%;
		float: none;
		padding: 0px 0px 0px 0px;
		margin: 0px 0px 15px 0px;
	}

	.service-contents > .wrapper {
		padding: 10px;
	}
}

.service-title {

	border: none;
	color: #ffffff;
	font-size: 20px;
	font-size: 0.20rem;
	font-weight: bold;
	margin: 0px 0px 0px 0px;
	padding: 5px 5px 5px 5px;
	text-align: center;
	border: 0px;
}

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

	.service-title {

	}
}

.service-image {

	width: 100%;
	margin: 10px 0px 10px 0px;
}

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

	.service-image {
	}
}

.price-contents {

	width: 285px;
	margin: 0px auto 0px auto;
}

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

	.price-contents {
	}
}

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

	.price-contents {
		width: 260px;
	}
}

.price-logo {

	width: 45px;
	float: left;
	margin: 5px 10px 0px 0px;
}

.price {

	float: left;
	font-size: 45px;
	font-size: 0.45rem;
	font-weight: bold;
	color: #ff0000;
	margin: 0px 0px 0px 0px;
}

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

	.price {

	}
}

.service-body {
	clear: both;
}

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

	.service-body {
	}
}

#toilet {
	background-color: #cfeaf5;
}

#toilet-title {
	background-color: #224fa1;
}

#bath {
	background-color: #dfedca;
}

#bath-title {
	background-color: #76bc2e;
}

#kitchen {
	background-color: #fcedf4;
}

#kitchen-title {
	background-color: #de609f;
}

#pipe {
	background-color: #fce5b7;
}

#pipe-title {
	background-color: #f5ab46;
}

#washroom  {
	background-color: #f0d0e3;
}

#washroom-title {
	background-color: #964d9a;
}

#other  {
	background-color: #9fadd8;
}

#other-title {
	background-color: #0f308f;
}

.question {

	background-color: #0000ff;
	color: #ffffff;
}

.answer {
	background-color: #f1f1f1;
}

.map-title {

	font-size: 24px;
	font-size: 0.24rem;
	font-weight: bold;
}

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

	.map-title {

		font-size: 14px;
		font-size: 0.14rem;
	}
}

#map-canvas {

	position: relative;
	padding: 0 0 56%;
	height: 0;
	overflow: hidden;
	width: 100%;
}

#map-canvas iframe {

	position: absolute;
	top: 0;
	left: 0;
	width: 100% !important;
	height: 100% !important;
}

.pratice-item {
}

.pratice-text {

	text-align: right;
	width: 95%;
	height: 15px;
	font-size: 0.14rem;
	margin: 0px 0px 10px 0px;
}

.analysis-text {
	width: 50px;
}

.practice-radio {
	display: none;
}

.practice-label {

	clear: both;
	padding: 5px 5px 5px 5px;
	text-align: center;
	font-size: 0.14rem;
	font-wieght: bold;
	border: 1px solid #000000;
	margin: 0px 0px 0px 0px;
	/*border-radius: 6px;*/
	/*background: linear-gradient(#fed6e3 0%, #ffaaaa 100%);*/
	/* 水平方向の距離 垂直方向の距離 ぼかし距離 広がり距離 影の色 */
	box-shadow: 2px 2px 2px 0px rgba(0, 0, 0, 0.4);
}

.radio-wrapper input[type="radio"]:checked + .switch-on,
.radio-wrapper input[type="radio"]:checked + .switch-off {

	background: #aebcbf; /* Old browsers */
	background: -moz-linear-gradient(top,  #aebcbf 0%, #6e7774 50%, #0a0e0a 51%, #0a0809 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #aebcbf 0%,#6e7774 50%,#0a0e0a 51%,#0a0809 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #aebcbf 0%,#6e7774 50%,#0a0e0a 51%,#0a0809 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#aebcbf', endColorstr='#0a0809',GradientType=0 ); /* IE6-9 */
	color: #ffffff;
}

.practice-button {

	width: 50px;
	padding: 5px 0px 5px 0px;
	text-align: center;
	font-size: 0.14rem;
	font-wieght: bold;
	border: 1px solid #000000;
	margin: 0px 10px 0px 0px;
	color: #ffffff;
	/*border-radius: 6px;*/
	/*background: linear-gradient(#fed6e3 0%, #ffaaaa 100%);*/
	/* 水平方向の距離 垂直方向の距離 ぼかし距離 広がり距離 影の色 */
}

.wide {
	width: 75px;
}

.button-color1 {

	box-shadow: 2px 2px 2px 0px rgba(0, 0, 0, 0.4);
	background: rgb(255,255,255);
	background: linear-gradient(0deg, rgba(165, 174, 251, 1) 0%, rgba(165, 174, 251, 1) 53%, rgba(255, 255, 255, 1) 100%);
}

.button-color2 {

	box-shadow: 2px 2px 2px 0px rgba(0, 0, 0, 0.4);
	background: rgb(255,255,255);
	background: linear-gradient(0deg, rgba(77, 94, 244, 1) 0%, rgba(77, 94, 244, 1) 53%, rgba(255, 255, 255, 1) 100%);
}

.button-color3 {

	box-shadow: 2px 2px 2px 0px rgba(0, 0, 0, 0.4);
	background: rgb(255,255,255);
	background: linear-gradient(0deg, rgba(27, 65, 189, 1) 0%, rgba(27, 65, 189, 1) 53%, rgba(255, 255, 255, 1) 100%);
}

.button-color4 {

	box-shadow: 2px 2px 2px 0px rgba(0, 0, 0, 0.4);
	background: rgb(255,255,255);
	background: linear-gradient(0deg, rgba(11, 28, 179, 1) 0%, rgba(11, 28, 179, 1) 53%, rgba(255, 255, 255, 1) 100%);
}

input[type = "checkbox"].description-swicth {
	display: none;
}

div.spec-description {
	margin: 0px 0px 15px 0px;
}

input[type = "checkbox"].description-swicth + div.spec-description {
	/*display: block;*/
	display: none;
}

input[type = "checkbox"].description-swicth:checked + div.spec-description {
	/*display: none;*/
	display: block;
}

.history-item {

	width: 50px;
	padding: 5px 0px 5px 0px;
	text-align: center;
	font-size: 0.14rem;
	font-wieght: bold;
	border: 1px solid #000000;
	margin: 0px 10px 5px 0px;
}