@charset "utf-8";

@media screen and (max-width: 639px){
	/* サービスメニュー */
	#top-menu {
		background: -webkit-linear-gradient(#f7cece, #fff 60%);
		background: linear-gradient(#6dd0fe, #fff 60%);
	}

	#top-menu-back {
		width: 320px;
		height: 560px;
		margin: 0 auto;
		padding: 20px 0;
		background: url(../images/top_house.png) no-repeat 50% 0;
	}

	.box {
		width: 150px;
		float: left;
		margin: 0 3px 10px;
		border: 2px solid #00a0ea;
		border-top-left-radius: 20px;
		box-shadow: 2px 2px 10px #333;
		text-indent: -9999px;
		background: #fff;
	}

	.box a {
		display: block;
		width: 153px;
		height: 185px;
	}

	.box h2 {
		margin: 0;
		padding: 0;
	}

	.box li {
		display: inline;
	}

	#top-menu-aircon a {
		background: url(../images/top_menu_aircon2.png) no-repeat 50% 0;
	}

	#top-menu-kitchen a {
		background: url(../images/top_menu_kitchen2.png) no-repeat 50% 0;
	}

	#top-menu-bath a {
		background: url(../images/top_menu_bath2.png) no-repeat 50% 0;
	}

	#top-menu-senmen a {
		background: url(../images/top_menu_senmen2.png) no-repeat 50% 0;
	}

	#top-menu-toilet a {
		background: url(../images/top_menu_toilet2.png) no-repeat 50% 0;
	}

	#top-menu-room a {
		background: url(../images/top_menu_room2.png) no-repeat 50% 0;
	}

	/* 悩み */
	#trouble {
		display: none;
	}

	/* 詳細 */
	#top-detail {
		width: 320px;
		margin: 0 auto;
	}

	/* セットキャンペーン・ご契約の流れ */
	#top-detail .top-entry1-box {
		width: 320px;
		margin-bottom: 20px;
		padding: 0;
	}

	#top-detail .top-entry1-box h2 {
		width: 320px;
		height: 54px;
		text-indent: -9999px;
	}

	#top-detail .top-entry1-box ul {
		margin-top: 10px;
	}

	/* セットキャンペーン */
	#top-entry-campaign h2 {
		background: url(../images/top_entry_campaign.jpg) no-repeat 0 50%;
	}

	/* 対応エリア・お困りごと */
	#top-detail .top-entry2-box {
		width: 320px;
		margin-bottom: 20px;
	}

	#top-detail .top-entry2-box h2 {
		height: 54px;
		text-indent: -9999px;
	}

	/* 対応エリア */
	#top-detail-area {
		width: 320px;
		height: 279px;
		background: url(../images/area.jpg) no-repeat 50% 100%;
	}

	#top-detail-area h2 {
		background: url(../images/top_entry_area4.jpg) no-repeat 0 50%;
	}

	#top-detail-area h3 {
		display: none;^
	}

	#top-detail-area ul {
		display: none;
	}

	/* お困りごと */
	#top-detail-trouble h2 {
		background: url(../images/top_entry_komarigoto4.jpg) no-repeat 0 50%;
	}

	#top-detail-trouble h3 {
		margin-top: 10px;
		margin-left: 10px;
		padding-left: 20px;
		font-weight: bold;
		background: url(../images/maru.jpg) no-repeat 0 50%;
	}

	#top-detail-trouble p {
		margin-left: 10px;
		padding-left: 10px;
		font-size: 90%;
		line-height: 1.3em;
	}

	/* ご契約の流れ */
	#top-entry-flow h2 {
		background: url(../images/top_entry_flow4.jpg) no-repeat 0 50%;
	}

	.top-entry-flow-box {
		float: left;
		margin-top: 5px;
		padding: 0 10px 30px;
		background: url(../images/top_flow_sankaku.jpg) no-repeat 40px 100%;
	}

	.top-entry-flow-box.lust {
		background: none;
		padding-bottom: 0;
	}

	.top-entry-flow-box-text {
		width: 200px;
		float: right;
	}

	.top-entry-flow-box img {
		float: left;
	}

	.top-entry-flow-box h3 {
		padding: 5px 0 0 10px;
		font-weight: bold;
		color: #E95378;
	}

	.top-entry-flow-box p {
		padding: 0 0 5px 10px;
		font-size: 90%;
		line-height: 1.3em;
	}
}


@media screen and (min-width: 640px) and (max-width: 767px) {
	/* サービスメニュー */
	#top-menu {
		background: -webkit-linear-gradient(#f7cece, #fff 60%);
		background: linear-gradient(#6dd0fe, #fff 60%);
	}

	#top-menu-back {
		width: 640px;
		height: 560px;
		margin: 0 auto;
		padding: 20px 0;
		background: url(../images/top_house.png) no-repeat 50% 0;
	}

	.box {
		width: 203px;
		height: 249px;
		float: left;
		margin: 0 3px 10px;
		border:2px solid #00a0ea;
		border-top-left-radius: 30px;
		box-shadow: 2px 2px 10px #333;
		text-indent: -9999px;
		background: #fff;
	}

	.box a {
		display: block;
		width: 203px;
		height: 249px;
	}

	.box h2 {
		margin: 0;
		padding: 0;
	}

	.box li {
		display: inline;
	}

	#top-menu-aircon a {
		background: url(../images/top_menu_aircon.png) no-repeat 50% 0;
	}

	#top-menu-kitchen a {
		background: url(../images/top_menu_kitchen.png) no-repeat 50% 0;
	}

	#top-menu-bath a {
		background: url(../images/top_menu_bath.png) no-repeat 50% 0;
	}

	#top-menu-senmen a {
		background: url(../images/top_menu_senmen.png) no-repeat 50% 0;
	}

	#top-menu-toilet a {
		background: url(../images/top_menu_toilet.png) no-repeat 50% 0;
	}

	#top-menu-room a {
		background: url(../images/top_menu_room.png) no-repeat 50% 0;
	}

	/* 悩み */
	#trouble {
		display: none;
	}

	/* 詳細 */
	#top-detail {
		width: 640px;
		margin: 0 auto;
	}

	/* セットキャンペーン・ご契約の流れ */
	#top-detail .top-entry1-box {
		width: 640px;
		margin-bottom: 20px;
		padding: 0;
	}

	#top-detail .top-entry1-box h2 {
		width: 640px;
		height: 54px;
		text-indent: -9999px;
	}

	#top-detail .top-entry1-box ul {
		margin-top: 10px;
	}

	/* セットキャンペーン */
	#top-entry-campaign h2 {
		background: url(../images/top_entry_campaign.jpg) no-repeat 0 50%;
	}

	/* 対応エリア・お困りごと */
	#top-detail .top-entry2-box {
		width: 640px;
		margin-bottom: 20px;
	}

	#top-detail .top-entry2-box h2 {
		height: 54px;
		text-indent: -9999px;
	}

	/* 対応エリア */
	#top-detail-area {
		width: 485px;
		height: 279px;
		margin: 0 auto 20px;
		background: url(../images/top_area.jpg) no-repeat 0 100%;
	}

	#top-detail-area h2 {
		background: url(../images/top_entry_area.jpg) no-repeat 0 50%;
	}

	#top-detail-area h3 {
		padding-top: 20px;
		padding-left: 40px;
		font-weight: bold;
		color: #E95378;
	}

	#top-detail-area ul {
		height: 205px;
		padding-top: 10px;
		padding-left: 20px;
	}

	#top-detail-area ul li {
		padding-left: 20px;
	}

	/* お困りごと */
	#top-detail-trouble h2 {
		background: url(../images/top_entry_komarigoto3.jpg) no-repeat 50% 0;
	}

	#top-detail-trouble h3 {
		margin-top: 10px;
		margin-left: 10px;
		padding-left: 20px;
		font-weight: bold;
		background: url(../images/maru.jpg) no-repeat 0 50%;
	}

	#top-detail-trouble p {
		margin-left: 10px;
		padding-left: 10px;
		font-size: 90%;
		line-height: 1.3em;
	}

	/* ご契約の流れ */
	#top-entry-flow h2 {
		background: url(../images/top_entry_flow3.jpg) no-repeat 50% 0;
	}

	.top-entry-flow-box {
		float: left;
		margin-top: 5px;
		padding: 0 10px 30px;
		background: url(../images/top_flow_sankaku.jpg) no-repeat 40px 100%;
	}

	.top-entry-flow-box.lust {
		background: none;
		padding-bottom: 0;
	}

	.top-entry-flow-box-text {
		width: 524px;
		float: right;
	}

	.top-entry-flow-box img {
		float: left;
	}

	.top-entry-flow-box h3 {
		padding: 5px 0 0 10px;
		font-weight: bold;
		color: #E95378;
	}

	.top-entry-flow-box p {
		padding: 0 0 5px 10px;
		font-size: 90%;
		line-height: 1.3em;
	}
}


@media screen and (min-width: 768px) and (max-width: 964px) {
	/* サービスメニュー */
	#top-menu {
		background: -webkit-linear-gradient(#f7cece, #fff 60%);
		background: linear-gradient(#6dd0fe, #fff 60%);
	}

	#top-menu-back {
		width: 768px;
		height: 560px;
		margin: 0 auto;
		padding: 20px 0;
		background: url(../images/top_house.png) no-repeat 50% 0;
	}

	.box {
		width: 203px;
		height: 249px;
		float: left;
		margin: 0 20px 30px;
		border:2px solid #00a0ea;
		border-top-left-radius: 30px;
		box-shadow: 2px 2px 10px #333;
		text-indent: -9999px;
		background: #fff;
	}

	.box a {
		display: block;
		width: 203px;
		height: 249px;
	}

	.box h2 {
		margin: 0;
		padding: 0;
	}

	.box li {
		display: inline;
	}

	#top-menu-aircon a {
		background: url(../images/top_menu_aircon.png) no-repeat 50% 0;
	}

	#top-menu-kitchen a {
		background: url(../images/top_menu_kitchen.png) no-repeat 50% 0;
	}

	#top-menu-bath a {
		background: url(../images/top_menu_bath.png) no-repeat 50% 0;
	}

	#top-menu-senmen a {
		background: url(../images/top_menu_senmen.png) no-repeat 50% 0;
	}

	#top-menu-toilet a {
		background: url(../images/top_menu_toilet.png) no-repeat 50% 0;
	}

	#top-menu-room a {
		background: url(../images/top_menu_room.png) no-repeat 50% 0;
	}

	/* 悩み */
	#trouble {
		display: none;
	}

	/* 詳細 */
	#top-detail {
		width: 768px;
		margin: 0 auto;
	}

	/* セットキャンペーン・ご契約の流れ */
	#top-detail .top-entry1-box {
		width: 768px;
		margin-bottom: 20px;
		padding: 0 14px 0 15px;
	}

	#top-detail .top-entry1-box h2 {
		width: 768px;
		height: 54px;
		text-indent: -9999px;
	}

	#top-detail .top-entry1-box ul {
		margin-top: 10px;
	}

	/* セットキャンペーン */
	#top-entry-campaign h2 {
		background: url(../images/top_entry_campaign.jpg) no-repeat 0 50%;
	}

	/* 対応エリア・お困りごと */
	#top-detail .top-entry2-box {
		width: 768px;
		margin-bottom: 20px;
	}

	#top-detail .top-entry2-box h2 {
		height: 54px;
		text-indent: -9999px;
	}

	/* 対応エリア */
	#top-detail-area {
		width: 485px;
		height: 279px;
		margin: 0 auto 20px;
		background: url(../images/top_area.jpg) no-repeat 0 100%;
	}

	#top-detail-area h2 {
		background: url(../images/top_entry_area.jpg) no-repeat 0 50%;
	}

	#top-detail-area h3 {
		padding-top: 20px;
		padding-left: 40px;
		font-weight: bold;
		color: #E95378;
	}

	#top-detail-area ul {
		height: 205px;
		padding-top: 10px;
		padding-left: 20px;
	}

	#top-detail-area ul li {
		padding-left: 20px;
	}

	/* お困りごと */
	#top-detail-trouble h2 {
		background: url(../images/top_entry_komarigoto2.jpg) no-repeat 50% 0;
	}

	#top-detail-trouble h3 {
		margin-top: 10px;
		margin-left: 10px;
		padding-left: 20px;
		font-weight: bold;
		background: url(../images/maru.jpg) no-repeat 0 50%;
	}

	#top-detail-trouble p {
		margin-left: 10px;
		padding-left: 10px;
		font-size: 90%;
		line-height: 1.3em;
	}

	/* ご契約の流れ */
	#top-entry-flow h2 {
		background: url(../images/top_entry_flow2.jpg) no-repeat 50% 0;
	}

	.top-entry-flow-box {
		float: left;
		margin-top: 5px;
		padding: 0 10px 30px;
		background: url(../images/top_flow_sankaku.jpg) no-repeat 40px 100%;
	}

	.top-entry-flow-box.lust {
		background: none;
		padding-bottom: 0;
	}

	.top-entry-flow-box-text {
		width: 624px;
		float: right;
	}

	.top-entry-flow-box img {
		float: left;
	}

	.top-entry-flow-box h3 {
		padding: 5px 0 0 10px;
		font-weight: bold;
		color: #E95378;
	}

	.top-entry-flow-box p {
		padding: 0 0 5px 10px;
		font-size: 90%;
		line-height: 1.3em;
	}
}

@media screen and (min-width: 965px){
	/* サービスメニュー */
	#top-menu {
		background: -webkit-linear-gradient(#f7cece, #fff 60%);
		background: linear-gradient(#6dd0fe, #fff 60%);
	}

	#top-menu-back {
		width: 950px;
		height: 560px;
		margin: 0 auto;
		padding: 20px 0;
		background: url(../images/top_house.png) no-repeat 50% 0;
	}

	.box {
		width: 203px;
		height: 249px;
		float: left;
		margin: 0 35px 30px 65px;
		border:2px solid #00a0ea;
		border-top-left-radius: 30px;
		box-shadow: 2px 2px 10px #333;
		text-indent: -9999px;
		background: #fff;
	}

	.box a {
		display: block;
		width: 203px;
		height: 249px;
	}

	.box h2 {
		margin: 0;
		padding: 0;
	}

	.box li {
		display: inline;
	}

	#top-menu-aircon a {
		background: url(../images/top_menu_aircon.png) no-repeat 50% 0;
	}

	#top-menu-kitchen a {
		background: url(../images/top_menu_kitchen.png) no-repeat 50% 0;
	}

	#top-menu-bath a {
		background: url(../images/top_menu_bath.png) no-repeat 50% 0;
	}

	#top-menu-senmen a {
		background: url(../images/top_menu_senmen.png) no-repeat 50% 0;
	}

	#top-menu-toilet a {
		background: url(../images/top_menu_toilet.png) no-repeat 50% 0;
	}

	#top-menu-room a {
		background: url(../images/top_menu_room.png) no-repeat 50% 0;
	}

	#top-menu-aircon a:hover {
		background-position: 50% -248px;
	}

	#top-menu-kitchen a:hover {
		background-position: 50% -248px;
	}

	#top-menu-bath a:hover {
		background-position: 50% -248px;
	}

	#top-menu-senmen a:hover {
		background-position: 50% -248px;
	}

	#top-menu-toilet a:hover {
		background-position: 50% -248px;
	}

	#top-menu-room a:hover {
		background-position: 50% -248px;
	}

	/* 悩み */
	#trouble {
		margin: 10px 0 30px;
		background: #e9f6fe;
	}

	#trouble ul {
		height: 468px;
		width: 950px;
		margin: 0 auto;
		position: relative;
		background: url(../images/top_trouble.jpg) no-repeat 62px 0;
	}

	#trouble li a {
		display: block;
		position: absolute;
		text-indent: -9999px;
	}

	#trouble #trouble-aircon a {
		width: 255px;
		height: 170px;
		top: 15px;
		left: 81px;
	}

	#trouble #trouble-aircon a:hover {
		background: #e9f6fe url(../images/top_trouble.jpg) no-repeat -19px -483px;
	}

	#trouble #trouble-kitchen a {
		width: 265px;
		height: 170px;
		top: 15px;
		left: 355px;
	}

	#trouble #trouble-kitchen a:hover {
		background: #e9f6fe url(../images/top_trouble.jpg) no-repeat -293px -483px;
	}

	#trouble #trouble-bath a {
		width: 235px;
		height: 160px;
		top: 25px;
		left: 625px;
	}

	#trouble #trouble-bath a:hover {
		background: #e9f6fe url(../images/top_trouble.jpg) no-repeat -563px -493px;
	}

	#trouble #trouble-senmen a {
		width: 275px;
		height: 165px;
		top: 160px;
		left: 205px;
	}

	#trouble #trouble-senmen a:hover {
		background: #e9f6fe url(../images/top_trouble.jpg) no-repeat -143px -1096px;
	}

	#trouble #trouble-toilet a {
		width: 275px;
		height: 155px;
		top: 305px;
		left: 70px;
	}

	#trouble #trouble-toilet a:hover {
		background: #e9f6fe url(../images/top_trouble.jpg) no-repeat -8px -773px;
	}

	#trouble #trouble-room a {
		width: 260px;
		height: 170px;
		top: 210px;
		left: 615px;
	}

	#trouble #trouble-room a:hover {
		background: #e9f6fe url(../images/top_trouble.jpg) no-repeat -553px -678px;
	}


	/* 詳細 */
	#top-detail {
		width: 970px;
		margin: 0 auto;
	}

	/* セットキャンペーン・ご契約の流れ */
	#top-detail .top-entry1-box {
		width: 456px;
		float: left;
		margin-bottom: 20px;
		padding: 0 14px 0 15px;
	}

	#top-detail .top-entry1-box h2 {
		width: 485px;
		height: 54px;
		text-indent: -9999px;
	}

	#top-detail .top-entry1-box ul {
		margin-top: 10px;
	}

	/* セットキャンペーン */
	#top-entry-campaign h2 {
		background: url(../images/top_entry_campaign.jpg) no-repeat 0 50%;
	}

	/* 対応エリア・お困りごと */
	#top-detail .top-entry2-box {
		width: 485px;
		float: left;
		margin-bottom: 20px;
	}

	#top-detail .top-entry2-box h2 {
		width: 485px;
		height: 54px;
		text-indent: -9999px;
	}

	/* 対応エリア */
	#top-detail-area {
		width: 485px;
		height: 279px;
		background: url(../images/top_area.jpg) no-repeat 0 100%;
	}

	#top-detail-area h2 {
		background: url(../images/top_entry_area.jpg) no-repeat 0 50%;
	}

	#top-detail-area h3 {
		padding-top: 20px;
		padding-left: 40px;
		font-weight: bold;
		color: #E95378;
	}

	#top-detail-area ul {
		height: 205px;
		padding-top: 10px;
		padding-left: 20px;
	}

	#top-detail-area ul li {
		padding-left: 20px;
	}

	/* お困りごと */
	#top-detail-trouble h2 {
		background: url(../images/top_entry_komarigoto.jpg) no-repeat 50% 0;
	}

	#top-detail-trouble h3 {
		margin-top: 10px;
		margin-left: 10px;
		padding-left: 20px;
		font-weight: bold;
		background: url(../images/maru.jpg) no-repeat 0 50%;
	}

	#top-detail-trouble p {
		margin-left: 10px;
		padding-left: 10px;
		font-size: 90%;
		line-height: 1.3em;
	}

	/* ご契約の流れ */
	#top-entry-flow h2 {
		background: url(../images/top_entry_flow.jpg) no-repeat 0 50%;
	}

	.top-entry-flow-box {
		float: left;
		margin-top: 5px;
		padding: 0 10px 30px;
		background: url(../images/top_flow_sankaku.jpg) no-repeat 40px 100%;
	}

	.top-entry-flow-box.lust {
		background: none;
		padding-bottom: 0;
	}

	.top-entry-flow-box-text {
		width: 322px;
		float: right;
	}

	.top-entry-flow-box img {
		float: left;
	}

	.top-entry-flow-box h3 {
		padding: 5px 0 0 10px;
		font-weight: bold;
		color: #E95378;
	}

	.top-entry-flow-box p {
		padding: 0 0 5px 10px;
		font-size: 90%;
		line-height: 1.3em;
	}
}