@charset "UTF-8";
@import "base.css";

/*=======================TOC=======================*/
/*                                                 */
/*                   Base                          */
/*                   Container                     */
/*                   Header                        */
/*                   Navigation                    */
/*                   Footer                        */
/*                   Contents                      */
/*                   Index                         */
/*                   Clinic                        */
/*                   Staff                         */
/*                   Perio                         */
/*                   Implant                       */
/*                   Esthe                         */
/*                   Prevent                       */
/*                   Ortho                         */
/*                   Implant-Regeneration          */
/*                   Price                         */
/*                   Link                          */
/*                   Sitemap                       */
/*                                                 */
/*=======================TOC-END===================*/

/*====================COLOR SCHEME=================*/
/*                                                 */
/*        Main Color - Yellow         #fe9900      */
/*        Main Color - Light Blue     #bbfffe      */
/*        Main Color - Dark Blue      #028eaf      */
/*                                                 */
/*        Sub Color - Magenta         #f667f5      */
/*                                                 */
/*==================COLOR SCHEME-END===============*/

/*================フォントサイズ換算===============*/
/*                                                 */
/*                   10px      77%                 */
/*                   11px      85%                 */
/*                   12px      93%                 */
/*                   14px     108%                 */
/*                   16px     124%                 */
/*                                                 */
/*===============フォントサイズ換算-END============*/



/*---------- Base -----------*/

/*-- 冒頭の @import で外部CSSを読み込み --*/



/*---------- Container -----------*/

body { background: url(../images/body_bg.jpg) top repeat-x; }
body#index { background: url(../images/index_body_bg.jpg) top repeat-x; }

#wrapper {
	background: url(../images/wrapper_bg.jpg) repeat;
	width: 900px;
	margin: 0 auto;
	text-align: center;
	}

#main {
	width: 800px;
	margin: 0 auto;
	height: 100%;
	text-align: left;
	}

#content {
	width: 600px;
	float: right;
	line-height: 1.6;
	color: #666;
	background: #fff;
	padding: 1em 0;
	}


/*---------- Header -----------*/

#header {
	background: url(../images/header_bg.jpg) 0 0 no-repeat;
	height: 348px;
	width: 900px;
	margin: 0;
	padding: 0;
	position: relative;
	}
#index #header {
	height: 448px;
	background: url(../images/index_header_bg.jpg) 0 0 no-repeat;
	}
#index #header #flash {
	position: absolute;
	top: 43px;
	left: 50px;
	}

#header .alpha {
	position: absolute;
	top: 0;
	left: 50px;
	height: 30px;
	}

#header .beta {
	position: absolute;
	top: 0;
	right: 50px;
	line-height: 1.0;
	font-size: 10px;
	text-align: right;
	}

h1 {
	text-indent: -9999px;
	width: 197px;
	}
h1 a {
	display: block;
	width: 197px;
	height: 30px;
	background: url(../images/h1_logo.png) 0 0 no-repeat;
	}

#header .beta address {
	margin: 3px;
	padding: 0;
	}

#header .beta ul {
	margin: 3px 3px 0 0;
	}

#header .beta ul li {
	display: inline;
	list-style: none;
	margin: 0 0 0 12px;
	padding: 0 0 0 12px;
	background: url(../images/header_nav_li.png) 0 0 no-repeat;
	}
#header .beta ul li a {
	text-decoration: none;
	}


/*---------- Navigation -----------*/

#nav {
	width: 180px;
	float: left;
	font-size: 85%;
	margin-top: 12px;
	}

#nav ul {
	width: 165px;
	margin: 0;
	padding: 21px 0 19px 0;
	background: url(../images/nav.png) 0 0 no-repeat;
	}
#nav ul li {
	list-style: none;
	margin: 0;
	padding: 0;
	text-indent: -9999px;
	}

#nav ul li a {
	display: block;
	height: 25px;
	}

#nav01 a { background: url(../images/nav.png) 0 -21px no-repeat; }
#nav02 a { background: url(../images/nav.png) 0 -46px no-repeat; }
#nav03 a { background: url(../images/nav.png) 0 -71px no-repeat; }
#nav04 a { background: url(../images/nav.png) 0 -96px no-repeat; }
#nav05 a { background: url(../images/nav.png) 0 -121px no-repeat; }
#nav06 a { background: url(../images/nav.png) 0 -146px no-repeat; }
#nav07 a { background: url(../images/nav.png) 0 -171px no-repeat; }
#nav ul li#nav08 a {
	background: url(../images/nav.png) 0 -196px no-repeat;
	height: 45px;
	}
#nav09 a { background: url(../images/nav.png) 0 -241px no-repeat; }
#nav10 a { background: url(../images/nav.png) 0 -266px no-repeat; }

#nav01 a:hover { background: url(../images/nav.png) -165px -21px no-repeat; }
#nav02 a:hover { background: url(../images/nav.png) -165px -46px no-repeat; }
#nav03 a:hover { background: url(../images/nav.png) -165px -71px no-repeat; }
#nav04 a:hover { background: url(../images/nav.png) -165px -96px no-repeat; }
#nav05 a:hover { background: url(../images/nav.png) -165px -121px no-repeat; }
#nav06 a:hover { background: url(../images/nav.png) -165px -146px no-repeat; }
#nav07 a:hover { background: url(../images/nav.png) -165px -171px no-repeat; }
#nav ul li#nav08 a:hover { background: url(../images/nav.png) -165px -196px no-repeat; }
#nav09 a:hover { background: url(../images/nav.png) -165px -241px no-repeat; }
#nav10 a:hover { background: url(../images/nav.png) -165px -266px no-repeat; }

#nav p.tel {
	margin: 12px 0 8px 0;
	padding: 0;
	}

#nav p.adr {
	padding: 0 18px;
	margin: 0;
	color: #122f5b;
	font-size: 10px;
	}


/*---------- Footer -----------*/

#footer {
	clear: both;
	padding: 14px 0 6px 0;
	margin: 0 auto;
	background: #fff url(../images/footer_bg.png) top repeat-x;
	font-size: 85%;
	text-align: center;
	}

#footer ul { 
	list-style: none;
	margin: 0 1em 4px 1em;
	padding: 0;
	clear: both;
	}

#footer ul li {
	display: inline;
	margin: 0;
	padding: 0;
	}

#footer a { text-decoration: none; }

#footer address,
#footer address a { color: #fe9900; }


/*---------- Contents -----------*/


.section { padding: .5em 15px; }

p.center { text-align: center; }

#content h2 {
	height: 46px;
	text-indent: -9999px;
	margin: 0;
	}
#content h3 {
	clear: both;
	height: 44px;
	text-indent: -9999px;
	}
#content h4 {
	clear: both;
	height: 25px;
	text-indent: -9999px;
	}

#content h5 {
	font-size: 108%;
	font-weight: bold;
	margin: 1em 0 .3em .3em;
	}

#content ul.olist li {
	background-image: none;
	padding-left: 0;
	}

#content dt { font-weight: bold; }

a { color: #122f5b; text-decoration: none; }
a:hover { color: #028eaf; }

#content blockquote {
	margin: .5em;
	background: url(../images/blockquote_bg.jpg) top left repeat-y;
	padding: .5em 1em;
	}

p.image_l {
	float: left;
	margin: 0 12px 12px 0;
	}
p.image_r {
	float: right;
	margin: 0 0 12px 12px;
	}
p.image_l img,
p.image_r img { border-bottom: 2px solid #ccc; }

img.image_l {
	float: left;
	margin: 0 12px 12px 0;
	}
img.image_r {
	float: right;
	margin: 0 0 12px 12px;
	}

p.detail {
	text-align: right;
	margin-right: 16px;
	}

p.caption { text-align: center; }

#content ul.totop li {
	list-style: none;
	width: 140px;
	height: 20px;
	float: right;
	margin: 0;
	padding: 0;
	text-indent: -9999px;
	}

#content ul.totop li a {
	display: block;
	background: url(../images/to_top.png) 0 0 no-repeat;
	height: 20px;
	}

#content .case {
	margin: 0 10px 10px 10px;
	background: url(../images/icon02.gif) center center no-repeat;
	}

strong { color: #ff9900; }


/*---------- Index -----------*/

#index h2#title01 {
	height: 40px;
	background: url(../images/h2_index01.png) 0 0 no-repeat;
	}
#index h3#title04 {
	height: 30px;
	background: url(../images/h3_index04.png) 0 0 no-repeat;
	}
#index h3#title05 {
	height: 30px;
	background: url(../images/h3_index05.png) 0 0 no-repeat;
	}

#index #content .alpha {
	width: 350px;
	float: left;
	}
* html body#index #content .alpha { width: 340px; }

#index #content .beta {
	width: 225px;
	float: left;
	padding-left: 25px;
	}
* html body#index #content .beta {
	width: 205px;
	float: right;
	padding-left: 0;
	}

#index .alpha #pckp01 { background: url(../images/index_pckp01.jpg) 0 0 no-repeat; }
#index .alpha #pckp02 { background: url(../images/index_pckp02.jpg) 0 0 no-repeat; }

#index .alpha #pckp01 p,
#index .alpha #pckp02 p {
	margin: 0 0 0 150px;
	padding: 24px 12px 12px 0;
	font-size: 10px;
	}

#index .beta .section { padding: 8px 0; }

#index .beta .section p { padding: .5em 17px; }

#index .beta .section ul, 
#index .beta .section table { padding: .5em 15px; }

#index .beta #clinic_info {
	border: 1px solid #fe9900;
	margin-bottom: 20px;
	}
#index .beta dl {
	margin: 0;
	float: left;
	width; 190px;
	padding: .5em 0 0 15px;
	}
* index body#index .beta dl { width: 200px; }

#index .beta dl dt {
	width: 3em;
	margin: 0;
	padding: 0;
	float: left;
	}
#index .beta dl dd {
	margin: 0 0 0 3em;
	padding: 0;
	}

#index .beta #clinic_info ul {
	margin: .5em 0 .5em 18px;
	}

#index .beta table {
	border: 1px solid #122f5b;
	font-size: 10px;
	color: #122f5b;
	}
#index .beta table th,
#index .beta table td { border: 1px solid #122f5b; }
#index .beta table td { padding: 2px; }
#index .beta table td.o-c {
	font-size: 14px;
	font-weight: bold;
	text-align: center;
	}

#index #topics {
	margin: 1em 0;
	padding: 1em 1em 2em 1em;
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
	}

#index #topics dl { margin: 0; }
#index #topics dt { color: #ff9900; }
#index #topics dd { margin-left: 0; }


/*---------- Clinic -----------*/

#clinic h2#title01 { background: url(../images/h2_clinic01.png) 0 0 no-repeat; }
#clinic h3#title02 { background: url(../images/h3_clinic02.png) 0 0 no-repeat; }
#clinic h3#title03 { background: url(../images/h3_clinic03.png) 0 0 no-repeat; }
#clinic h4#title04 { background: url(../images/h4_clinic04.png) 0 0 no-repeat; }
#clinic h4#title05 { background: url(../images/h4_clinic05.png) 0 0 no-repeat; }
#clinic h4#title06 { background: url(../images/h4_clinic06.png) 0 0 no-repeat; }
#clinic h4#title07 { background: url(../images/h4_clinic07.png) 0 0 no-repeat; }
#clinic h4#title08 { background: url(../images/h4_clinic08.png) 0 0 no-repeat; }
#clinic h4#title09 { background: url(../images/h4_clinic09.png) 0 0 no-repeat; }
#clinic h3#title10 { background: url(../images/h3_clinic10.png) 0 0 no-repeat; }


#clinic #clinic-info dl { margin: 36px 0 0 12px; }
#clinic #clinic-info dl dt {
	width: 5em;
	float: left;
	}
#clinic #clinic-info dl dd { margin-left: 5em; }


/*---------- Staff -----------*/

#staff h2#title01 { background: url(../images/h2_staff01.png) 0 0 no-repeat; }
#staff h3#title02 { background: url(../images/h3_staff02.png) 0 0 no-repeat; }
#staff h3#title03 { background: url(../images/h3_staff03.png) 0 0 no-repeat; }
#staff h3#title04 { background: url(../images/h3_staff04.png) 0 0 no-repeat; }

#staff dl.profile dt { color :#ff9900; }

/*---------- Perio -----------*/

#perio h2#title01 { background: url(../images/h2_perio01.png) 0 0 no-repeat; }
#perio h3#title02 { background: url(../images/h3_perio02.png) 0 0 no-repeat; }
#perio h3#title03 { background: url(../images/h3_perio03.png) 0 0 no-repeat; }
#perio h3#title04 { background: url(../images/h3_perio04.png) 0 0 no-repeat; }
#perio h4#title05 { background: url(../images/h4_perio05.png) 0 0 no-repeat; }
#perio h4#title06 { background: url(../images/h4_perio06.png) 0 0 no-repeat; }
#perio h4#title07 { background: url(../images/h4_perio07.png) 0 0 no-repeat; }


/*---------- Implant -----------*/

#implant h2#title01 { background: url(../images/h2_implant01.png) 0 0 no-repeat; }
#implant h3#title02 { background: url(../images/h3_implant02.png) 0 0 no-repeat; }
#implant h3#title03 { background: url(../images/h3_implant03.png) 0 0 no-repeat; }
#implant h3#title04 { background: url(../images/h3_implant04.png) 0 0 no-repeat; }
#implant h4#title05 { background: url(../images/h4_implant05.png) 0 0 no-repeat; }
#implant h4#title06 { background: url(../images/h4_implant06.png) 0 0 no-repeat; }
#implant h4#title07 { background: url(../images/h4_implant07.png) 0 0 no-repeat; }
#implant h4#title08 { background: url(../images/h4_implant08.png) 0 0 no-repeat; }
#implant h4#title09 { background: url(../images/h4_implant09.png) 0 0 no-repeat; }
#implant h4#title10 { background: url(../images/h4_implant10.png) 0 0 no-repeat; }
#implant h4#title11 { background: url(../images/h4_implant11.png) 0 0 no-repeat; }
#implant h4#title12 { background: url(../images/h4_implant12.png) 0 0 no-repeat; }
#implant h4#title13 { background: url(../images/h4_implant13.png) 0 0 no-repeat; }
#implant h3#title14 { background: url(../images/h3_implant14.png) 0 0 no-repeat; }

#implant dl.advantage dt {
	4em;
	float: left;
	}
#implant dl.advantage dd { margin-left: 4em; }

#implant dl.special dt { color :#ff9900; }



/*---------- Esthe -----------*/

#esthe h2#title01 { background: url(../images/h2_esthe01.png) 0 0 no-repeat; }
#esthe h3#title02 { background: url(../images/h3_esthe02.png) 0 0 no-repeat; }
#esthe h3#title03 { background: url(../images/h3_esthe03.png) 0 0 no-repeat; }
#esthe h4#title04 { background: url(../images/h4_esthe04.png) 0 0 no-repeat; }
#esthe h4#title05 { background: url(../images/h4_esthe05.png) 0 0 no-repeat; }
#esthe h4#title06 { background: url(../images/h4_esthe06.png) 0 0 no-repeat; }


/*---------- Prevent -----------*/

#prevent h2#title01 { background: url(../images/h2_prevent01.png) 0 0 no-repeat; }
#prevent h3#title02 { background: url(../images/h3_prevent02.png) 0 0 no-repeat; }
#prevent h3#title03 { background: url(../images/h3_prevent03.png) 0 0 no-repeat; }
#prevent h3#title04 { background: url(../images/h3_prevent04.png) 0 0 no-repeat; }
#prevent h3#title05 { background: url(../images/h3_prevent05.png) 0 0 no-repeat; }
#prevent h3#title06 { background: url(../images/h3_prevent06.png) 0 0 no-repeat; }
#prevent h3#title07 { background: url(../images/h3_prevent07.png) 0 0 no-repeat; }
#prevent h3#title08 { background: url(../images/h3_prevent08.png) 0 0 no-repeat; }
#prevent h3#title09 { background: url(../images/h3_prevent09.png) 0 0 no-repeat; }


/*---------- Ortho -----------*/

#ortho h2#title01 { background: url(../images/h2_ortho01.png) 0 0 no-repeat; }
#ortho h3#title02 { background: url(../images/h3_ortho02.png) 0 0 no-repeat; }
#ortho h3#title03 { background: url(../images/h3_ortho03.png) 0 0 no-repeat; }
#ortho h3#title04 { background: url(../images/h3_ortho04.png) 0 0 no-repeat; }
#ortho h4#title05 { background: url(../images/h4_ortho05.png) 0 0 no-repeat; }
#ortho h4#title06 { background: url(../images/h4_ortho06.png) 0 0 no-repeat; }
#ortho h4#title07 { background: url(../images/h4_ortho07.png) 0 0 no-repeat; }
#ortho h4#title08 { background: url(../images/h4_ortho08.png) 0 0 no-repeat; }
#ortho h4#title09 { background: url(../images/h4_ortho09.png) 0 0 no-repeat; }
#ortho h4#title10 { background: url(../images/h4_ortho10.png) 0 0 no-repeat; }
#ortho h4#title11 { background: url(../images/h4_ortho11.png) 0 0 no-repeat; }
#ortho h4#title12 { background: url(../images/h4_ortho12.png) 0 0 no-repeat; }
#ortho h4#title13 { background: url(../images/h4_ortho13.png) 0 0 no-repeat; }
#ortho h4#title14 { background: url(../images/h4_ortho14.png) 0 0 no-repeat; }
#ortho h4#title15 { background: url(../images/h4_ortho15.png) 0 0 no-repeat; }
#ortho h4#title16 { background: url(../images/h4_ortho16.png) 0 0 no-repeat; }

#ortho .case { width: 400px; }
#ortho .case .alpha {
	width: 160px;
	float: left;
	padding: auto;
	text-align: center;
	}
#ortho .case .beta {
	width: 160px;
	float: right;
	padding: auto;
	text-align: center;
	}


/*---------- Implant-Regeneration -----------*/

#implant-regeneration h2#title01 { background: url(../images/h2_implant-regeneration01.png) 0 0 no-repeat; }
#implant-regeneration h3#title02 { background: url(../images/h3_implant-regeneration02.png) 0 0 no-repeat; }
#implant-regeneration h3#title03 { background: url(../images/h3_implant-regeneration03.png) 0 0 no-repeat; }
#implant-regeneration h4#title04 { background: url(../images/h4_implant-regeneration04.png) 0 0 no-repeat; }
#implant-regeneration h4#title05 { background: url(../images/h4_implant-regeneration05.png) 0 0 no-repeat; }
#implant-regeneration h4#title06 { background: url(../images/h4_implant-regeneration06.png) 0 0 no-repeat; }

#implant-regeneration #content .alpha {
	width: 246px;
	float: left;
	}
#implant-regeneration #content .beta {
	width: 230px;
	float: right;
	}

/*---------- Price -----------*/

#price h2#title01 { background: url(../images/h2_price01.png) 0 0 no-repeat; }

#price #content table {
	font-size: 93%;
	color: #666;
	border-collapse: separate;
	border-spacing: 1px;
	border: 1px solid #fffd96;
	}
#price #content table th,
#price #content table td {
	border: 1px solid #fed442;
	margin: 1px;
	padding: 3px 12px;
	}
#price #content table th {
	background: #fed442;
	color: #fff;
	}
td.charge { text-align: right; }


/*---------- Link -----------*/

#link h2#title01 { background: url(../images/h2_link01.png) 0 0 no-repeat; }

#link #content table {
	font-size: 93%;
	color: #666;
	border-collapse: separate;
	border-spacing: 1px;
	border: 1px solid #fffd96;
	}
#link #content table th,
#link #content table td {
	border: 1px solid #fed442;
	margin: 1px;
	padding: 3px;
	}
#link #content table th {
	background: #fed442;
	color: #fff;
	}

#link #content table tr.even td,
#link #content table td.even { background: #fffd96; }

#link #content table colgroup#prefecture { width: 5em; }


/*---------- Sitemap -----------*/

#sitemap h2#title01 { background: url(../images/h2_sitemap01.png) 0 0 no-repeat; }