@charset "UTF-8";

@import "base.css";

@import "fonts.css";



/*==========================================================================*/

/*//////////////////////////////////////////////////////////////////////////*/

/*//////                                                              //////*/

/*//////  Copyright (C) 2009 株式会社フリーセル All Rights Reserved.  //////*/

/*//////                                                              //////*/

/*//////////////////////////////////////////////////////////////////////////*/

/*                                                                          */

/*    base.css   スタイルの初期設定を行うため、変更しないで下さい。      */

/*    fonts.css  フォントの初期設定を行うため、変更しないで下さい。      */

/*                                                                          */

/*==========================================================================*/



/*==========================================================================*/

/*                           Common-Setting                                 */

/* 

/* 汎用要素スタイル

/* ├ a

/* ├ table

/* ├ title

/* ├ p

/* └ div

/*  

/* 汎用classスタイル 

/* ├ image

/* ├ text,font

/* ├ gotop

/* └ banner

/*  

==========================================================================*/

/* 基本タグのフォントサイズを指定（12px -> 120% or 1.2em ） */

h1,h2,h3,h4,h5,h6,input,button,textarea,select,p,blockquote,table,pre,address,ul,ol,dl {

}



/* 汎用要素スタイル

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



/* ========================= a */

a {

	color: #CC6666;

}

a:hover,

a:active {

	color: #CC6666; text-decoration: none;

}



/* ========================= table */

#content table {

	width: 640px;

	background: #fff;

	border-spacing: 1px;

	border-collapse: separate;

}

#content th,

#content td {

	padding: 5px 10px;

	border: 1px #B0A484 solid;

	text-align: left;

	vertical-align: middle;

}

#content th {

	width: 180px;

	background: #E4E0D6;

	font-weight: normal;

}

#content td {

	background: #fff;

}



/* ========================= title */

#content h3 {

	margin: 30px 0 12px;

}

#content h4,

#content h5 {

	margin: 20px 0 10px;

}

#content h3.firstChild,

#content h4.firstChild,

#content h5.firstChild {

	margin-top: 0;

}

#indexPage #content #leftCol p.firstChild {
	margin: 0 0 12px 0;
}

#indexPage #content #leftCol p.tph3 {
	margin: 30px 0 12px;
}



/* ========================= p */

#content p {

	margin: 0 0 1em;

}

#content p.last {

	margin-bottom: 0;

}



/* ========================= div */

.section {

	overflow: hidden;

	margin: 0 10px;

	_zoom: 1;

}

.over {

	overflow: hidden;

	_zoom: 1;

}

.over_beauty {

	overflow: hidden;

	_zoom: 1;

	width:640px;

}



/* 汎用classスタイル

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



/* ========================= image */

img {

	vertical-align: bottom;

}

#content .imgL {

	float: left;

	margin: 0 15px 0 0;

}

#content .imgLbtm {

	float: left;

	margin: 0 15px 15px 0;

}

#content .imgR {

	float: right;

	margin: 0 0 0 15px;

}

#content .imgRbtm {

	float: right;

	margin: 0 0 15px 15px;

}

#content .summaryImg {

	margin: 1em 0;

}

#content .imgMboth {

	float: left;

	margin: 0 20px 15px 20px;

}

.mb15{
	margin-bottom:15px;
}


/* ========================= text,font */

.emphasis {

	color: #990033;

	font-weight: bold;

}



.bold {

	font-weight: bold;

}



#content p.defList,

#content .defList li,

#content .defList dt {

	padding-left: 15px;

	background: url(../images/common/content_icon.gif) no-repeat 0 7px;

}

#content .defList dd {

	padding-left: 15px;

}



#content p.attention,

#content .attention li,

#content .attention dt {

	padding-left: 15px;

	background: url(../images/common/icon_attention.gif) no-repeat 0 7px;

}

#content .attention dd {

	padding-left: 15px;

}





/* ========================= gotop */

p.gotop {

	clear: both;

	margin-top: 20px;

	text-align: right;

	font-size: 0;

}





/* ========================= banner */

.bnrBtm {

	margin-top: 20px;

	text-align: center;

}

.bnrBtm li {

	margin-bottom: 50px;

}



/* ========================= float */

.fleft {

	float: left;

}

.fright {

	float: right;

}





/*==========================================================================*/

/*                            Container                                     */

/*==========================================================================*/



html {

	overflow-y: scroll;

	background: none;

}



body {

  background: url(../images/common/wrapper_bg.jpg) top repeat-x;

	color: #61583E;

	text-align: center;

}

#wrapper {

	width: 909px;

	margin: 0 auto;

  background: url(../images/wrapper_bg.jpg) 940px top no-repeat;

}

#main {

	width: 900px;

	margin: 10px auto 0 8px;

	text-align: left;

}

#main .last {

	margin-bottom: 0;

}

#main ol#locus {

	width: 900px;

	height: 20px;

	margin-bottom: 5px;

}

#main ol#locus li {

	float: left;

	padding-left: 20px;

	background: url(../images/common/main_bg_locus.gif) no-repeat 5px 3px;

	font-size: 120%;

}

#main ol#locus li.firstChild {

	padding-left: 0;

	background: none;

}





/*==========================================================================*/

/*                               Header                                     */

/*==========================================================================*/



#header {

	position: relative;

	width: 909px;

	height: 360px;

	color: #7B6F4F;

	text-align: left;

}



/*  ========================= general */

#header .h1,

#header h1,

#header h2#pageImg,

#indexPage #wrapper #header p#pageImg,

#header #logo,

#header #contactNav,

#header #globalNav,

#header #headInfo {

	position: absolute;

}



/*  ========================= h1 */

#header h1,
#header .h1 {

	top: 9px;

	left: 10px;

	font-size: 140%;

	line-height: 16px;

}



/*  ========================= logo */

#header #logo {

	top: 37px;

	left: 0;

}



/*  ========================= guideNavi */

#header dl#contactNav {

	top: 14px;

	left: 706px;

}

#header dl#contactNav dt,

#header dl#contactNav dd#tel,

#header dl#contactNav dd#btn {

	position: absolute;

	top: 0;

	left: 2px;

}

#header dl#contactNav dd#tel {

	top: 35px;

	left: 3px;

}

#header dl#contactNav dd#btn {

	top: 75px;

	left: 0;

}



/*  ========================= globalNavi */

#header ul#globalNav {

	top: 142px;

	left: 458px;

	width: 449px;

	height: 36px;

}

#header ul#globalNav li {

	float: left;

}



/*  ========================= h2 */

#header h2#pageImg {

	top: 178px;

	left: 8px;

	font-size: 100%;

}

/*  ========================= index p h2 */
#indexPage #wrapper #header p#pageImg {

	top: 178px;
	left: 8px;
	font-size: 100%;
}



/*  ========================= headInfo */

#header #headInfo {

	top: 42px;

	left: 493px;

}



/*==========================================================================*/

/*                              Footer                                      */

/*==========================================================================*/



#footer {

	overflow: hidden;

	width: 100%;

	margin-top: 10px;

	padding-bottom: 20px;

	background: url(../images/common/footer_bg.gif) repeat-x left top;

}

#footer #inner {

	width: 909px;

	margin: 0 auto;

	padding-top: 12px;

}

#footer #inner p#footInfo {

	display: inline;

	float: right;

}

#footer #inner address {

	display: inline;

	float: left;

	margin-left: 330px;

	margin-top: 5px;

	color: #7B6F4F;

	font-size: 100%;

	line-height: 14px;

}





/*==========================================================================*/

/*                            Navigation                                    */

/*==========================================================================*/



#nav {

	float: left;

	width: 230px;

	margin-bottom: 20px;

	font-size: 140%;

}

#nav a {

	color: #62583E;

}



/*  ========================= localnavi */

#localNav {

	width: 230px;

	margin-bottom: 12px;

	padding-bottom: 10px;

	background: url(../images/common/side_bg_lnav.gif) no-repeat left bottom;

}

#localNav ul {

	margin-top: 7px;

}

#localNav ul li,

#localNav dl dt {

	border-top: 1px #ACA691 solid;

}

#localNav dl.firstChild dt {

	border-top: none;

}

#localNav ul li,

#localNav dl dt,

#localNav dl dd {

	margin: 0 10px;

}

#localNav ul li a,

#localNav dl dt a,

#localNav dl dd a {

	display: block;

	width: 190px;

	_width: 210px;

	height: 24px;

	_height: 29px;

	padding-top: 5px;

	padding-left: 20px;

}

#localNav ul li a,

#localNav dl dt a {

	background: url(../images/common/side_bg_dt_off.gif) no-repeat left top;

}

#localNav dl dd a {

	background: url(../images/common/side_bg_lnav_off.gif) no-repeat left top;

}
#localNav dl dd.double a{
	background: url(../images/common/side_bg_lnav02_off.gif) no-repeat left top;
	display: block;
	width: 190px;
	_width: 210px;
	height: 50px;
	_height: 50px;
	padding-top: 5px;
	line-height:20px;
}
#localNav dl dd.double a:hover{
	background: url(../images/common/side_bg_lnav02_on.gif) no-repeat left top;
}

#localNav ul li a:hover,

#localNav dl dt a:hover,

#localNav ul li a.current,

#localNav dl dt a.current {

	background: url(../images/common/side_bg_dt_on.gif) no-repeat left top;

	color: #990033;

}

#localNav dl dd a:hover,

#localNav dl dd a.current {

	background: url(../images/common/side_bg_lnav_on.gif) no-repeat left top;

	color: #990033;

}

#localNav dl {

	margin-bottom: 11px;

}

#bannerNav {

	width: 230px;

	padding-bottom: 9px;
	margin-bottom:15px;
	background: url(../images/common/side_bg_lnav.gif) no-repeat left bottom;

}

#bannerNav dt {

	margin-bottom: 13px;

}

#bannerNav dd {

	margin-bottom: 10px;

	padding: 0 10px;

}

#bannerNav dd.last {

	margin-bottom: 0;

}



/*==========================================================================*/

/*                             Contents                                     */

/*==========================================================================*/

#content {

	float: right;

	width: 660px;

	margin-bottom: 20px;

	font-size: 140%;

	text-align: left;

	line-height: 1.7;

}

#content dl.txtArea {
	width: 640px;
	margin-top: 20px;
	overflow: hidden;
}

#content p.txtArea,

#content dl.txtArea dd {

	width: 620px;

	_width: 640px;

	padding: 10px;

	background: #FFEBEB;

}

#content p.txtArea {

	margin-top: 20px;

}



/* 01 index

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

#indexPage #header {

	height: 470px;

}

#indexPage #content {

	overflow: hidden;

	margin-top: 0;

}

#indexPage #content #leftCol {

	float: left;

	width: 470px;

}

#indexPage #content #leftCol .section.bg {

	background: url(../images/index_bg_section.gif) no-repeat right top;

}

#indexPage #content #leftCol .section.bg dl dd {

	margin-left: 40px;

	margin-bottom: 10px;

}

#indexPage #content #leftCol ul#pickupNav {

	overflow: hidden;

	width: 470px;

}

#indexPage #content #leftCol ul#pickupNav li {

	margin-bottom: 20px;

	margin-right: 10px;

}

#indexPage #content #leftCol ul#pickupNav li.fright {

	margin-right: 0;

}

#indexPage #content #leftCol ul#pickupNav li.last {

	margin-bottom: 0;

}

#indexPage #content #rightCol {

	float: right;

	width: 180px;

	font-size: 85%;

}

#indexPage #content #rightCol dl {

	width: 180px;

	margin-bottom: 10px;

	padding-bottom: 15px;

	background: url(../images/index_right_bg.gif) no-repeat left bottom;

}

#indexPage #content #rightCol dl dt {	

	margin-bottom: 10px;

}

#indexPage #content #rightCol dl dd {

	margin: 0 10px;
	line-height: 1.3;

}

#indexPage #content #rightCol dl dd ul {

	width: 150px;

	_width: 160px;

	padding: 5px;

	border-top: 1px #7B6F4F solid;

	border-bottom: 1px #7B6F4F solid;

	background: url(../images/index_right_bg_news.gif) repeat-y left top;

}

#indexPage #content #rightCol dl dd ul li {

	padding-left: 15px;

	background: url(../images/common/content_icon.gif) no-repeat 3px 7px;
	line-height:20px;

}
.new{
	margin:0 3px 5px 0;
}

#indexPage #content #rightCol dl dd span.img {

	display: block;

	margin-top: 10px;

}

#indexPage p.gotop {

	margin-right: 190px;

}

#content p {

	margin: 0 0 1em;

}

.ban_link{
	margin-bottom:10px;
	text-align:center;
}



/* 02 outline/

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

#outlinePage #content .section p {

	margin: 0 0 2em;

}





/* 03 outline/access

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

#accessPage #content table#time {

	width: 565px;

	margin: 0 auto;

	border: 1px #7B6F4F solid;

	border-collapse: collapse;

}

#accessPage #content table#time th {

	background: #B0A484;

	border: 1px #7B6F4F solid;

	text-align: center;

}

#accessPage #content table#time td {

	border: 1px #7B6F4F solid;

	text-align: center;

}

#accessPage #content table#time td div#map {

	margin-top: 5px;

	padding: 2px;

	width: 400px;

	height: 400px;

	border: 1px solid #ccc;

}
#accessPage #content .comment {
	margin-left: 50px;
}


/* 04 outline/facility

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

#Page #content {

}



/* 05 contact/fmail.cgi

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

#contactPage #content .bnrContact {

	margin-top: 100px;

}

#contactPage #content table {

	border-collapse: collapse;

}



/* 06 treatment/

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

#treatmentPage #content .bg {

	background: url(../images/treatment_bg_flow.jpg) no-repeat right bottom;

}

#treatmentPage #content dl.flow {

	overflow: hidden;

	width: 640px;

}

#treatmentPage #content dl.flow dt,

#treatmentPage #content dl.flow dd {

	float: left;

}

#treatmentPage #content dl.flow dt {

	width: 18px;

	margin-right: 10px;

}

#treatmentPage #content dl.flow dd {

	width: 450px;

	margin-top: 2px;

}

#treatmentPage #content ul.defList {

	width: 310px;

}



/* 07 treatment/skin

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

#Page #content {

}



/* 08 treatment/beauty

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

#Page #content {

}



/* 09 treatment/hair

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

#treatmentPage #content dl#note {

	width: 628px;

	margin: 20px auto 10px;

	padding-bottom: 64px;

	background: url(../images/hair_bg_check.gif) no-repeat left bottom;

}

#treatmentPage #content dl#note dt {

	margin-bottom: 20px;

}

#treatmentPage #content dl#note dd {

	margin-left: 68px;

}



/* 10 treatment/other

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

#Page #content {

}



/* 11 topics/

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

#Page #content {

}



/* 12 topics/children

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

#childrenPage #content #message {

	width: 532px;

	_width: 628px;

	margin: 0 16px;

	padding: 54px 48px 25px;

	background: url(../images/children_bg_note.gif) no-repeat left top;

}

#childrenPage #content #message #message01 {

	margin-bottom: 30px;

}

#childrenPage #content #message #message02 {

	margin-bottom: 11px;

}

#childrenPage #content ul.defList.emphasis {

	margin-bottom: 20px;

}

#childrenPage #content table {

	margin-top: 20px;

}



/* 13 topics/aftercare

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

#Page #content {

}



/* 14 topics/yourself

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

#yourselfPage #content dl.txtArea.lastChild {

	margin-bottom: 20px;

}



/* 15 topics/firstaid

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

#Page #content {

}







/* contact

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



/*  ========================= table style */

#contactPage #content table.mailform {

	width: 640px;

	margin: 10px;

	padding: 0;

	background: #FFFFFF;

}

#contactPage #content table.mailform tr th,

#contactPage #content table.mailform tr td {

	padding: 5px 10px;

	border: 1px #B0A484 solid;

	text-align: left;

	vertical-align: middle;

}

#contactPage #content table.mailform tr th {

	width: 150px;

	background: #E4E0D6;

}



/*  ========================= input style */

#contactPage #content table.mailform input {

	margin-right: 3px;

	vertical-align: middle;

}

#contactPage #content table.mailform select {

	margin-right: 3px;

}

#contactPage #content table.mailform textarea {

	width: 350px;

}



/*  ========================= label style */

#contactPage #content table.mailform label.fmail_label_enabled {

	text-indent: 5px;

	margin: 0;

	padding: 0;

	border: none;

	background-color: none;

	font-weight: bold;

}

#contactPage #content table.mailform label.fmail_label_disabled {

	text-indent: 5px;

	margin: 0;

	padding: 0;

	border: none;

}





/*  ========================= list style */

#contactPage ol.fmail_radio_list li,

#contactPage ol.fmail_checkbox_list li {

	list-style: none;

	float: left;

	padding: 5px 10px 5px 0;

	white-space: nowrap;

}



/*  ========================= button style */

#contactPage #content .button {

	margin-top: 20px;

	text-align: center;

}

#contactPage #content .button input {

	width: 160px;

	padding: 5px;

	border: none;

	background: #7B6F4F;

	color: #fff;

	font-weight: bold;

}

#contactPage #content .site_top{

	text-align: center;

}

#contactPage #content .site_top a{

	display:block;

	width:160px;

	height: auto;

	margin: 1em auto;

	padding: 10px 0;

	border: none;

	background-image: none;

	background: #7B6F4F;

	color: #fff;

	font-weight: bold;

	text-indent: 0;

	text-decoration: none;

}

#contactPage #content .button input:hover,

#contactPage #content .site_top a:hover{

	background: #B0A484;

}





/*  ========================= text style */

#contactPage #content th em {

	margin-left: 3px;

	color: #c00;

	font-size: 83.5%;

}

#contactPage #content td .info {

	color: #999;

	font-size: 83.5%;

}

#contactPage #content span.fmail_error {

	padding: 2px 0 3px 17px;

	background-position: left center;

}

#contactPage #content th.fmail_error,td.fmail_error,.fmail_error {

	background-color: none;

}