@charset "UTF-8";
@import "base.css";
@import "fonts.css";
/*==========================================================================*/
/*//////////////////////////////////////////////////////////////////////////*/
/*//////                                                              //////*/
/*//////  Copyright (C) 2009 株式会社フリーセル All Rights Reserved.  //////*/
/*//////                                                              //////*/
/*//////////////////////////////////////////////////////////////////////////*/
/*                                                                          */
/*    base.css   スタイルの初期設定を行うため、変更しないで下さい。      */
/*    fonts.css  フォントの初期設定を行うため、変更しないで下さい。      */
/*                                                                          */
/*==========================================================================*/

/*==========================================================================*/
/*                           Common-Setting                                 */
/*==========================================================================*/

/* 基本タグのフォントサイズを指定（12px -> 120% or 1.2em ） */
h1,
h2,
h3,
h4,
h5,
h6,
input,
button,
textarea,
select,
p,
blockquote,
th,
td,
pre,
address,
li,
dt,
dd {
	font-size: 140%;
}
h1 {
} /* Header内で設定 */
h2 {
}
h3 {
}
h4 {
}
a {
	color: #00ADCC;
}
a:hover,
a:active {
	color: #f96;
	text-decoration: none;
}
a:visited {
}
ul {
}
li {
}
dl {
}
dt {
}
dd {
}
table {
}
th,
td {
}
th {
}
td {
}
p {
	margin: 0 0 1em;
}
dt img,
dd img,
li img {
	vertical-align: bottom;
}
.section {
	padding: 0 10px 30px;
}
.section .section {
	padding: .5em .5em 1em;
}
.image_l {
	float: left;
	margin: 0 16px 8px 0;
}
.image_r {
	float: right;
	margin: 0 0 8px 16px;
}
.case {
	margin: 10px 20px;
	background: url(../images/arrow_h.jpg) center center no-repeat;
}
.case-narrow {
	margin: 10px 40px;
	background: url(../images/arrow_h.jpg) center center no-repeat;
}
.case-noimg {
	margin: 10px 20px;
}
ul.totop {
	clear: both;
	padding-bottom: 20px;
}
ul.totop li {
	float: right;
	list-style: none;
}
/*==========================================================================*/
/*                            Container                                     */
/*==========================================================================*/

html {
	background: none;
}
body {
	background: url(../images/bg.jpg) top repeat-x;
	color: #333;
	text-align: center;
}
#wrapper {
	width: 950px;
	margin: 0 auto;
}
#main {
	width: 950px;
	margin: 0 auto;
	text-align: left;
	background: #FFF url(../images/content_bg.gif) repeat-y 0 0;
	overflow: hidden;
}
#content {
	width: 661px;
	float: right;
	margin-right: 18px;
}
/*==========================================================================*/
/*                               Header                                     */
/*==========================================================================*/

#header {
	width: 950px;
	height: auto;
	margin: 0 auto;
	text-align: left;
	overflow: hidden;
}
#header h1 {
	height: 25px;
	padding: 0;
	font-size: 16px;
	line-height: 2;
	margin: 0;
}
#header .logo {
	float: left;
	width: 560px;
}
#header .freedial {
	float: right;
	width: 381px;
}
#header p {
	margin: 0;
	padding: 0;
}
.path {
	margin: 25px 0 20px;
	padding: 0 0 0 23px;
	background: url(../images/path_bg.gif) no-repeat 0px 3px;
}
.path a {
	color: #333;
	text-decoration: none;
}
.path a:hover {
	color: #f96;
	text-decoration: underline;
}

/*==========================================================================*/
/*                              Footer                                      */
/*==========================================================================*/

p.pagetop {
	text-align: right;
	margin: 0;
	padding: 15px 10px 15px 0;
	width: 940px;
	_width: 950px;
}
#footer {
	border: 5px solid #09C;
	clear: both;
	width: 950px;
	height: auto;
	margin-right: auto;
	margin-left: auto;
	margin-top: auto;
	overflow: auto;
}
#footer-wrapper {
	width: 940px;
}
#footer-wrapper .service {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 16px;
	font-weight: bold;
	float: left;
	clear: left;
}

#footer p {
	padding-top: 12px;
	clear: left;
	text-align: left;
}
#footer_left .call {
	float: left;
	height: 49px;
	width: 341px;
}
.areaname {
}
#footer_left {
	width: 500px;
	float: left;
	margin-left: 10px;
}
#footer_left .service {
	float: left;
	text-align: left;
	font-size: 16px;
	font-weight: bold;
	color: #333;
	clear: both;
}
#footer_right {
	width: 400px;
	float: right;
	margin-right: 10px;
	margin-top: 10px;
	clear: right;
}
#footer_botom {
	margin-right: 10px;
	margin-bottom: 10px;
	margin-top: 10px;
}
/*==========================================================================*/
/*                             footer_patern2                                  */
/*==========================================================================*/
#footer2 {
	border: 5px solid #09C;
	clear: both;
	width: 950px;
	height: auto;
	margin-right: auto;
	margin-left: auto;
	overflow: auto;
}
#footer2 p {
	padding-top: 12px;
	clear: left;
	text-align: left;
}
#footer_left2 {
	float: left;
	margin-left: 20px;
	clear: none;
	margin-right: 20px;
}
#footer_left2 .call {
	float: left;
	height: 49px;
	width: 341px;
}
#footer_left2 .chiba_right {
	float: right;
	margin-left: 20px;
}
#footer_left2 .service {
	float: left;
	text-align: left;
	font-size: 16px;
	font-weight: bold;
	color: #333;
	clear: left;
}

/*==========================================================================*/
/*                             gnavi                                  */
/*==========================================================================*/

#nav,
#nav li {
	margin: 0;
	padding: 0;
	list-style: none;
}
ul#nav {
	width: 950px;
	position: relative;
	zoom: 1;
	z-index: 99;
	height:45px;
	border-bottom: 1px solid #4792C4;
}
ul#nav li {
	float: left;
	position: relative;
}
ul#nav li.fee-list a#gnavi-fee-list {
	display: block;
	width: 199px;
	height: 45px;
}
ul#nav ul li {
	float: none;
	position: static;
}
ul#nav li ul {
	position: absolute;
	left: 0;
	top: 45px;
	display: none;
	border-bottom: none;
}

ul#nav.top {
	border-bottom: none;
}

#gnavi-sub-item.hover {
	cursor: pointer;
	display: block;
}


/*

#nav li {
	float: left;
}

#nav ul li {
	float: none;
}

#nav li.fee-list {
	position: relative;
	width:199px;
	background:url(../images/gn_fee_off.gif) no-repeat left top;
}
#nav li#gnavi-sub-item.hover {
	background:url(../images/gn_fee_on.gif) no-repeat left top;
}

#nav li.hover #gnavi-fee-list img {
	visibility:hidden;
}

#nav li.fee-list ul {
	display: none;
	position: absolute;
	top: 45px;
	left: 0px;
	width: 199px;
	border-bottom: none;
}
* html #nav li.fee-list ul { line-height: 0;}

#gnavi-sub-item.hover {
	cursor: pointer;
	display: block;
}

*/

/*==========================================================================*/
/*                            Navigation                                    */
/*==========================================================================*/

#navi {
	float: left;
	width: 237px;
	padding-top: 19px;
	text-align: right;
	padding-left: 19px;
}
#navi dl,
#navi ul {
	margin: 0;
	width: 237px;
}
#navi dl dt,
#navi dl dd,
#navi ul li {
	list-style: none;
	margin: 0;
	vertical-align: top;
}
#navi li.space {
	margin: 0 0 10px;
}
#navi dd.flow {
	background: url(../images/navi_card_bg.gif) no-repeat 0px 0px;
	padding-top: 0px;
	padding-right: 14px;
	padding-bottom: 10px;
	padding-left: 0px;
}
#navi #pick_up {
	background-color: #15A3BD;
	width: 237px;
	height: auto;
}#pick_up .trable {
   border-radius: 5px;/* CSS3 */
   -moz-border-radius: 5px;/* Firefox */
   -webkit-border-radius: 5px;/* Safari,Chrome */
	background-color: #FFF;
	height: auto;
	margin-right: 10px;
	margin-left: 10px;
	padding: 5px;
	margin-top: 5px;
	margin-bottom: 10px;
}
#pick_up .trable p {
	color: #333;
	text-align: justify;
}
#pick_up .trable h5 {
	font-weight: bold;
	color: #C90;
	text-align: center;
	line-height: 1.2em;
}
#pick_up #maker {
	background-color: #FFF;
	margin-top: 10px;
	padding-top: 10px;
}

/*==========================================================================*/
/*                             Contents                                     */
/*==========================================================================*/


#content h2 {
	margin-top: 0;
	margin-right: 0;
	margin-left: 0;
	margin-bottom: 10px;
	padding-top: 20px;
}
#content h3 {
	background: url(../images/common_line.gif) repeat-x 0% 100%;
	margin: 0 0 20px;
	padding: 0 0 8px;
}
#content h4 {
	margin: 0 0 10px;
}
#content h5 {
	margin: 0 0 10px;
}
table.common {
	border: 1px solid #999;
	width: 660px;
	margin: 0 0 20px;
	background: #E1E1E1;
	border-collapse: collapse;
}
table.common td,
table.common th {
	border:1px solid #999;
	text-align: left;
	padding: 7px;
}
table.common th {
	background: #E6E6E6;
	vertical-align: top;
	font-weight: normal;
}
table.common th.col {
	background: #DDFAFF;
}
table.common td {
	background: #FFF;
	vertical-align: top;
	text-align: left;
}
.notes {
	text-align: right;
	margin-top: -10px;
}
ul.common {
	margin: 0 0 1em 10px;
}
ul.common li {
	background: url(../images/list_bg.gif) no-repeat 0px 6px;
	padding: 0px 0px 0px 17px;
}

.float-left {
	float: left;
}

.float-right {
	float: right;
}
.main-top {
	width: 660px;
	margin-bottom: 0px;
}
.top-main-aboutus {
	margin-top: 20px;
	clear: left;
}
.rc-works-materials {
	width: 660px;
	height: 632px;
	margin-bottom: 20px;
}

/* faq
------------------------------------------------------------------------*/

dl.faq {
}

dl.faq dt {
	font-weight: bold;
	background: url(../images/faq_icon_q.gif) no-repeat 0px 0px;
	margin: 0 0 10px;
	padding: 0 0 0 34px;
	min-height: 28px;
	_height: 28px;
}

dl.faq dd {
	background: #EEEEEE url(../images/faq_icon_a.gif) no-repeat 10px 10px;
	margin: 0 0 25px;
	padding: 5px 5px 5px 50px;
	min-height: 38px;
	_height: 48px;
}

/* estimate
------------------------------------------------------------------------*/

ol.step {
}

ol.step li {
	background: url(../images/estimate_step_bg.gif) no-repeat 0% 100%;
	margin: 0px 0px 10px;
	padding: 0px 0px 20px;
	width: 640px;
	overflow: hidden;
}

ol.step .float-left {
	width: 220px;
}

ol.step .float-right {
	width: 420px;
}

ol.step li li {
	background: url(../images/list_bg.gif) no-repeat 0px 6px;
	padding: 0px 0px 0px 17px;
	margin: 0;
	width: auto;
}

ol.step li.end {
	background: none;
}

/* area
------------------------------------------------------------------------*/

.tab-menu {
}

.tab-menu ul {
	width: 670px;
	overflow: hidden;
	margin: 0 0 10px;
	
}

.tab-menu ul li {
	width: 127px;
	float: left;
	margin-right: 5px;
}

ul.credit-card {
	overflow: hidden;
}

ul.credit-card li {
	float: left;
}

ul.products {
	width: 670px;
	overflow: hidden;
	margin: 0 0 20px;
}

ul.products li {
	width: 305px;
	_width: 325px;
	float: left;
	margin: 0 10px 10px 0;
	background: url(../images/products_bg.gif);
	padding: 10px;
}

ul.products li.right {
	margin-right: 0;
	text-align: left;
}

ul.products .products-wrapper {
	background: #FFF;
	padding: 10px;
}

ul.products h4 {
	font-weight: bold;
	color: #003399;
	font-size: 100%;
}

ul.products .price {
	font-weight: bold;
	margin: 0;
}

ul.products .price .yen {
	color: #F00;
	font-size: 160%;
}
#service_area {
	font-size: 14px;
	color: #333;
	border: 3px solid #999;
	padding: 10px;
	width: auto;
}
#content #service_area_L {
	width: 280px;
	padding: 0px;
	float: left;
}
#service_area h2 {
	font-size: 18px;
	color: #09C;
	font-weight: bold;
}#service_area_R {
	float: right;
	width: 320px;
	clear: right;
	margin-left: 12px;
	height: auto;
}
#service_area #service_area_R ul li {
	line-height: 1.5em;
	text-indent: 20px;
	background-image: url(../images/randmark.gif);
	background-repeat: no-repeat;
	font-size: 15px;
}
#service_area #service_area_R ul {
	float: right;
	width: 320px;
}

#service_area #coution {
	text-align: center;
	height: 20px;
	margin-top: 10px;
	clear: both;
}
.coution_botom {
	font-size: 14px;
	color: #09C;
}
/* index
------------------------------------------------------------------------*/

#s3 {
	margin: 0;
}

ul.main-price {
	width: 660px;
	overflow: hidden;
	background: #FFF;
}

ul.main-price li {
	float: left;
}

.index-campaign {
	display: block;
}

ul.index-banner {
	width: 660px;
	overflow: hidden;
	margin: 0 0 20px;
}

ul.index-banner li {
	float: left;
}

ul.index-banner li.right {
	float: right;
}

.index-pick-up-block-wrapper {
	background: url(../images/index_pickup_bg_top.gif) no-repeat 0px 0px;
	padding: 10px 0px 0px;
}

.index-pick-up-block {
	background: url(../images/index_pickup_bg.gif) no-repeat 0% 100%;
	padding: 9px 14px 14px 30px;
}

.index-pick-up {
	overflow: hidden;
	width: 596px;
	_width: 606px;
	margin: 0 0 5px;
	padding: 0 0 0 10px;
}

.index-pick-up .float-left {
	float: left;
	width: 390px;
}

.index-pick-up .float-right {
	float: right;
	width: 197px;
}

#content .index-pick-up-block h3 {
	background: url(none);
	margin: 0 0 3px;
	padding: 0;
}

.index-pick-up-block p {
	margin: 0;
}
.rc-works-materials .top-left {
	background-image: url(../images/mizumore-topmenu.gif);
	background-repeat: no-repeat;
	float: left;
	height: 281px;
	width: 324px;
}
.rc-works-materials .top-right {
	background-image: url(../images/tumari-top-menu.gif);
	background-repeat: no-repeat;
	clear: none;
	float: right;
	height: 281px;
	width: 324px;
}
.rc-works-materials .top-left-botom {
	background-image: url(../images/seisou-top-menu.gif);
	background-repeat: no-repeat;
	height: 281px;
	width: 324px;
	margin-top: 10px;
	float: left;
	clear: left;
}
.rc-works-materials .top-right-botom {
	background-image: url(../images/torituke-top-menu.gif);
	background-repeat: no-repeat;
	height: 281px;
	width: 324px;
	margin-top: 10px;
	clear: right;
	float: right;
}
.fee-mizumore {
	color: #333;
	width: 175px;
	height: 172px;
	margin-top: 70px;
	margin-left: 5px;
}
.fee-mizumore .fee {
	font-size: 13px;
	line-height: 1.2em;
	list-style-image: url(../images/circle.gif);
	margin-left: 20px;
	margin-right: 6px;
}
.fee-botan {
	text-align: right;
	display: block;
	clear: right;
	float: right;
	margin-top: 5px;
	margin-right: 10px;
}
.materials-p {
	height: 165px;
	width: 128px;
	float: right;
	margin-right: 10px;
	margin-top: 70px;
	clear: left;
}

/* service
------------------------------------------------------------------------*/

ul.basic-charge {
	width: 670px;
	overflow: hidden;
	margin: 0 0 20px;
}

ul.basic-charge li {
	width: 305px;
	_width: 325px;
	float: left;
	margin: 0 10px 10px 0;
	background: url(../images/products_bg.gif);
	padding: 10px;
}

ul.basic-charge li.right {
	margin-right: 0;
	text-align: left;
}

ul.basic-charge .basic-charge-wrapper {
	background: #FFF;
	padding: 10px;
}

ul.basic-charge .basic-charge-block {
	width: 283px;
	overflow: hidden;
}

ul.basic-charge .basic-charge-block .float-left {
	width: 110px;
}

ul.basic-charge .basic-charge-block .float-right {
	width: 173px;
}

ul.basic-charge h4 {
	font-weight: bold;
	color: #003399;
	font-size: 100%;
}

ul.basic-charge .price {
	font-weight: bold;
}

ul.basic-charge .price .yen {
	color: #F00;
	font-size: 120%;
}

ul.basic-charge p {
	margin: 0 0 5px;
}

ul.service-banner-link {
	width: 630px;
	overflow: hidden;
	margin: 0 0 20px 22px;
}

ul.service-banner-link li {
	width: 196px;
	float: left;
	margin: 0 14px 0 0;
}

.access {
	overflow: hidden;
	height: 1px;
	font-size:1px;
	line-height:1px;
}
#material01 p {
	margin-left: 10px;
}

.title {
	margin-bottom: 10px;
	margin-top: 10px;
	display: block;
	margin-left: 0px;
}
#material03 .title2 {
	margin-top: 10px;
	margin-left: 10px;
}
.photo {
	width: 286px;
	display: block;
	margin-top: 5px;
	margin-right: 5px;
	margin-bottom: 10px;
	margin-left: 5px;
}
#material01 {
	height: 386px;
	width: 323px;
	border: 1px solid #09C;
	float: left;
}
#material02 {
	height: 386px;
	width: 323px;
	border: 1px solid #09C;
	float: right;
	clear: none;
}
#material02 p {
	margin-left: 10px;
}
#material03 {
	width: 660px;
	border: 1px solid #09C;
	height: auto;
	clear: left;
	float: left;
	display: block;
	margin-top: 10px;
	overflow: visible;
	margin-bottom: 10px;
}
#material03 .left {
	float: left;
	height: auto;
	width: 310px;
	margin-left: 10px;
	font-size: 16px;
	margin-bottom: 10px;
}
#material03 .right {
	float: right;
	width: 310px;
	margin-right: 10px;
	height: auto;
	font-size: 16px;
	text-align: left;
}
#content .fee-title-sub {
	font-size: 16px !important;
	color: #FFF !important;
	background-color: #F36;
	padding-top: 2px;
	padding-right: 4px;
	padding-bottom: 2px;
	padding-left: 2px;
	margin-bottom: 4px;
}
#material03 .left2 {
	font-size: 16px;
	margin-bottom: 10px;
	margin-left: 10px;
}
/* voice

------------------------------------------------------------------------*/


ul.customer-voice {
	overflow: hidden;
	width: 655px;
	margin: 0 0 25px;
}

ul.customer-voice li {
	float: left;
	margin: 0 5px 5px 0;
}

ul.customer-voice li.fourth {
	margin-right: 0;
}
#main #content {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color: #333;
	float: right;
}
.message {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 16px;
	line-height: 20px;
}

#main #content ul {
	display: block;
	text-decoration: none;
}
.toilet {
	float: left;
	width: 324px;
	clear: right;
	background-image: url(../images/mizumore-topmenu.gif);
	background-repeat: no-repeat;
	height: 281px;
}
.kitchin {
	float: right;
	width: 324px;
	background-image: url(../images/tumari-top-menu.gif);
	background-repeat: no-repeat;
	height: 281px;
}
.gesui {
	width: 324px;
	float: left;
	clear: right;
	background-image: url(../images/seisou-top-menu.gif);
	background-repeat: no-repeat;
	height: 281px;
	margin-top: 10px;
}
.tsumari {
	float: right;
	width: 324px;
	clear: right;
	height: 281px;
	background-image: url(../images/torituke-top-menu.gif);
	background-repeat: no-repeat;
	margin-top: 10px;
}
#main #content p {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 16px;
	line-height: 22px;
	color: #333;
}
#main #content p img {
	margin-top: 0px;
	text-align: center;
}

/*** InquiryLink **************************************************************************/
#Confirm {
	float: right;
	margin-top: 20px;
}

#Confirm h2 {
	margin-bottom: 20px;
}

#Confirm h3 {
	margin-bottom: 13px;
}

#Confirm p {
	margin-bottom: 10px;
}

#Confirm strong {
	font-weight: normal;
	font-size: 13pt;
	line-height: 1.2em;
	color:#1ba3ab;
}

#Inquiry {
	width: 660px;
}
#Inquiry li {
	width: 220px;
	height: 62px;
	overflow: hidden;
	float: left;
	margin-bottom: 7px;
}
#Inquiry li a {
	width: 220px;
	height: 62px;
	display: block;
	text-indent: -5000px;
	background-image: url(../images/area_inquiry_link.gif);
	background-repeat: no-repeat;
}
#Inquiry li.li01 a {
	background-position: left top;
}
#Inquiry li.li01 a:hover {
	background-position: left -62px;
}
#Inquiry li.li02 a {
	background-position: -220px top;
}
#Inquiry li.li02 a:hover {
	background-position: -220px -62px;
}
#Inquiry li.li03 a {
	background-position: -440px top;
}
#Inquiry li.li03 a:hover {
	background-position: -440px -62px;
}

.clogged-p {
	height: 100px;
	width: 150px;
	float: left;
	margin-top: 10px;
	margin-left: 10px;
}
.red {
	color: #F00;
}
.common ul .msg {
	color: #F00;
}
.button-center {
	text-align: center;
}
p.msg { 
color:#dd0000; margin:2em; !important
}
.qr {
	height: 152px;
	width: 650px;
	margin-right: auto;
	margin-left: auto;
	border: 1px solid #666;
	margin-top: 10px;
	padding-top: 10px;
	padding-left: 10px;
}
.qr p {
	float: left;
	font-size: 16px;
	color: #F00;
	/* [disabled]height: 200px; */
	width: 250px;
	font-weight: normal;
}
.qrcode {
	float: right;
	margin-left: 20px;
}
.qrbox {
	margin-top: 20px;
}
.haisuikan {
	clear: both;
}