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

/*=======================TOC=======================*/
/*                                                 */
/*                 01  Base                        */
/*                 02  Container                   */
/*                 03  Header                      */
/*                 04  Navigation                  */
/*                 05  Footer                      */
/*                 06  Contents                    */
/*                 07  Index                       */
/*                 08  Staff                       */
/*                 09  Treatment                   */
/*                 10  Access                      */
/*                 11  Perio                       */
/*                 12  Denture                     */
/*                 13  Prevent                     */
/*                 14  Aesthe                      */
/*                 15  Implant                     */
/*                 16  Recruit                     */
/*                 17  Sitemap                     */
/*                                                 */
/*=======================TOC-END===================*/

/*====================COLOR SCHEME=================*/
/*                                                 */
/*                                                 */
/*==================COLOR SCHEME-END===============*/

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



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

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

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

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

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

#main {
	margin: 0 0 20px 6px;
	background: url(../images/main_bg.jpg) repeat-y;
	}

#content {
	width: 605px;
	float: right;
	margin-right:6px;
	font-size: 100%;
	line-height: 1.6;
	color: #2F2F2F;
	background: #fff;
	}
*html #content {
	margin-right:3px;
	}

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

#header {
	background: url(../images/header_bg.jpg) 0 0 no-repeat;
	height: 167px;
	width: 800px;
	margin: 0 0 0 6px;
	padding: 0;
	}

#header .header_l{
   float:left;
   width:360px;
   }
* html #header .header_l{
   margin-left:-18px;
   }   
#header .header_r{
   float:right;
   margin-right:4px;
   }
* html #header .header_r{
   float:right;
   margin-left:72px;
   }

h1 {
	text-indent: -9999px;
	width: 360px;
	height: 80px;
	line-height: 1.0;
	float: left;
	margin: 14px 0 0 18px;
	}
h1 a {
	display: block;
	width: 360px;
	height: 85px;
	background: url(../images/h1.jpg) 0 0 no-repeat;
	}

.header_text{
    text-align:left;
	color: #442F28;
	line-height:0px;
	margin:0 0 0 20px;
	padding:20px 0 0 0;
    }
* html .header_text{
	margin:0 0 0 40px;
    }

#header .section {
	width: 350px;
	float: right;
	margin: 0;
	padding: 0;
	}

#header p.tel {
	margin: 10px 0 0 145px;
	padding: 0;
	height: 80px;
	}
#header p.tel img { display: block; }

#header_nav {
	margin: 0 0 0 103px;
	padding: 0;
	list-style: none;
	width: 243px;
	height: 30px;
	}

#header_nav li {
	height: 30px;
	float: left;
	text-indent: -9999px;
	list-style: none;
	margin: 0;
	padding: 0;
	}
#header_nav li a {
	display: block;
	height: 30px;
	}

#nav01 { width: 121px; }
#nav02 { width: 121px; }
#nav01 a {background: url(../images/header_nav.jpg) 0 0 no-repeat;width: 121px;}
#nav02 a {background: url(../images/header_nav.jpg) -121px 0 no-repeat;width: 121px;}

#gnav {
	padding: 0;
	margin:12px 0 0 0 ;
	width: 800px;
	height: 30px;
	list-style: none;
	float:left;
	}
* html #gnav{margin-top:14px;}
*:first-child+html #gnav{margin-top:18px;}

#gnav ul {
	padding: 0;
	margin:0;
	list-style: none;
    }

#gnav .g_internal li {
	height: 30px;
	padding:0;
	margin:0;
	float:left;
	text-indent: -9999px;
	list-style: none;
	}

#gnav .g_internal li a {
	display: block;
	height: 30px;
	}

#nav03 {width: 160px;}
#nav04 {width: 160px;}
#nav05 {width: 160px;}
#nav06 {width: 160px;}
#nav07 {width: 160px;}
#nav03 a {background: url(../images/gnav.jpg) 0 0 no-repeat;width: 160px;}
#nav04 a {background: url(../images/gnav.jpg) -160px 0 no-repeat;width: 160px;}
#nav05 a {background: url(../images/gnav.jpg) -320px 0 no-repeat;width: 160px;}
#nav06 a {background: url(../images/gnav.jpg) -480px 0 no-repeat;width: 160px;}
#nav07 a {background: url(../images/gnav.jpg) -640px 0 no-repeat;width: 160px;}
#nav03 a:hover {background: url(../images/gnav.jpg) 0 -31px no-repeat;width: 160px;}
#nav04 a:hover {background: url(../images/gnav.jpg) -160px -31px no-repeat;width: 160px;}
#nav05 a:hover {background: url(../images/gnav.jpg) -320px -31px no-repeat;width: 160px;}
#nav06 a:hover {background: url(../images/gnav.jpg) -480px -31px no-repeat;width: 160px;}
#nav07 a:hover {background: url(../images/gnav.jpg) -640px -31px no-repeat;width: 160px;}

/*----------04  Navigation -----------*/
#nav h2{text-indent:-9999px;}
#nav h2#nav_title01 {background: url(../images/nav_h2-01.jpg) 0 0 no-repeat;height:50px;}

#nav {
	width: 180px;
	float: left;
	padding: 5px 0 100px 0;
	margin-left:5px;
	background: url(../images/nav_bg.jpg) bottom no-repeat;
	}

* html #nav {margin-left:2px;}
	
#nav ul,
#nav li {
	margin: 0 0 0 2px;
	padding: 0;
	list-style: none;
	}
#nav .internal li {
	text-indent: -9999px;
	}
#nav .internal li a {
	display: block;
	}

#nav08 {height:45px;}
#nav09 {height:45px;}
#nav10 {height:45px;}
#nav11 {height:45px;}
#nav12 {height:60px;}

#nav08 a { background: url(../images/nav.jpg) 0 0 no-repeat;height:45px; }
#nav09 a { background: url(../images/nav.jpg) 0 -45px no-repeat;height:45px; }
#nav10 a { background: url(../images/nav.jpg) 0 -90px no-repeat;height:45px; }
#nav11 a { background: url(../images/nav.jpg) 0 -135px no-repeat;height:45px; }
#nav12 a { background: url(../images/nav.jpg) 0 -180px no-repeat; height:60px;}

#nav08 a:hover { background: url(../images/nav.jpg) -180px 0 no-repeat;height:45px; }
#nav09 a:hover { background: url(../images/nav.jpg) -180px -45px no-repeat;height:45px; }
#nav10 a:hover { background: url(../images/nav.jpg) -180px -90px no-repeat;height:45px; }
#nav11 a:hover { background: url(../images/nav.jpg) -180px -135px no-repeat;height:45px; }
#nav12 a:hover { background: url(../images/nav.jpg) -180px -180px no-repeat; height:60px;}

#nav p { margin-left: 4px; }

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

#footer {
	clear: both;
	padding:0;
	margin: 0;
	background: #fff url(../images/footer_bg.jpg) bottom no-repeat;
	font-size: 85%;
	text-align: left;
	color: #353535;
	height:60px;
	}
*:first-child+html #footer { font-size: 9px; } /*  for IE7 only */
* html body #footer { font-size: 9px; } /*  for IE6 only */

#footer a {
	text-decoration: none;
	color: #ffffff;
	}
#footer a:hover { text-decoration: underline; }

#footer ul { 
	list-style: none;
	margin: 0 1em 2px 1em;
	padding: 5px 0 0 10px;
	clear: both;
	}
* html #footer ul{padding: 8px 0 0 10px;}
*:first-child+html #footer ul{padding: 8px 0 0 10px;}

#footer  .no_padding{padding: 0 0 0 10px;}
*:first-child+html #footer .no_padding {padding: 0 0 0 10px;}

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

#footer address { margin: 8px 1em; padding: 0 0 0 10px;}

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

.section { padding: .5em 20px; }
.section .section { padding: .4em 10px; }

p.center { text-align: center; }

#content{margin-left:5px;}

#content h2 {
	height: 40px;
	text-indent: -9999px;
	margin: 12px 0 0 5px;
	}
#content h3 {
	clear: both;
	height: 35px;
	text-indent: -9999px;
	}
#content h4 {
	height: 24px;
	text-indent: -9999px;
	margin: 0;
	}

#content h5 {
	font-size: 100%;
	font-weight: bold;
	margin: 1em 0 .3em .3em;
	color:#638FBF;
	}

#content ul li {
	list-style: none;
	background: url(../images/li_bg.jpg) 0 4px no-repeat;
	padding-left: 20px;
	}
#content ul.olist li {
	background-image: none;
	padding-left: 0;
	}

#content dt { font-weight: bold; }

#content a { text-decoration: underline; }
a {
	color: #028eaf;
	outline: none;
	}
a:hover { color: #de91a2; }

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

.image_l  {
	float: left;
	margin: 8px 16px 16px 0;
	}

.image_r {
	float: right;
	margin: 8px 0 16px 16px;
	}

.case {
	margin: 10px 20px;
	background: url(../images/arrow_h.jpg) center center no-repeat;
	}
.case img {
	display: block;
	border: 3px solid #eee4cf;
	}

.img_border{
	border: 3px solid #eee4cf;
	}
.case .caption {
	text-align: center;
	border-top: 2px solid #ccc;
	}

.subtitle{
    font-weight:bold;
    color:#638FBF;
    font-size:105%;
    }

#content ul.totop {
	clear: both;
	padding-bottom: 20px;
	}

#content ul.totop li {
	list-style: none;
	width: 100px;
	height: 14px;
	margin: 0;
	padding: 0;
	text-indent: -9999px;
	float: right;
	background-image: none;
	}
#content ul.totop li a {
	display: block;
	height: 14px;
	background: url(../images/to_top.jpg) 0 0 no-repeat;
	}

#content p.totop {
	margin: 0 10px 0 0;
	padding: 0 0 10px 0;
	text-indent: -9999px;
	height: 30px;
	width: 110px;
	float: right;
	}
* html body #content p.totop {
	height: 30px;
	margin: 0 6px 0 0;
	}

#content p.totop a {
	display: block;
	height: 30px;
	background: url(../images/to_top.jpg) 0 0 no-repeat;
	}


#content table {
    border: 1px solid #332100;
    }
#content table th {
    background:#CFC2A6;
    border: 1px solid #332100;
    }
#content table td {
    border: 1px solid #332100;
    }

* html #content table{font-size:95%;}
* html #content table th {padding:3px 5px 3px 5px;}

p.caution {
	color:#CC4319;
	}

/* Hides from IE-mac \*/
p.answer:first-letter {
	display: block;
	padding: 2px;
	background: #4499af;
	color: #fff;
	font-size: 18px;
	font-weight: bold;
	border: 1px solid #ccc;
	margin: 0 5px 0 0;
	float: left;
	}
/* End hide from IE-mac */


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

#index h2#title01{background: url(../images/index_h2-01.jpg) 0 0 no-repeat;margin: 0;}
#index h3#title02{background: url(../images/index_h3-02.jpg) 0 0 no-repeat;height:25px;}
#index h3#title03{background: url(../images/index_h3-03.jpg) 0 0 no-repeat;}

#index .greeting{width:592px; padding-bottom:10px;}
#index .greeting h3 {height: 15px;}
#index .greeting ul{margin:0;}
#index .greeting ul li{margin:0;padding:0 0 0 16px;}
#index .clinic{width:300px;float:left;margin-top:5px;}
#index .clinic dl{margin:0;padding:0;}
#index .clinic dt{
    font-weight:normal;
    width:90px;float:left;
    }
#index .clinic dd{
    margin-left:90px;
    }
#index .timetable{
    float:right;
    margin-right:10px;
    width:210px;
    }

#index .timetable table{
    margin:0;
    padding:0;
    margin-top:8px;
    }    
#index .timetable table th{
    padding:0 5px 0 5px;
    font-weight:normal;
    background:#CFC2A6;
    border: 1px solid #332100;
    }
#index .timetable table td{
    margin:0;
    padding:0 5px 0 5px;
    border: 1px solid #332100;
    }

#index .timetable .title{
    background:#CFC2A6;
    }

#index .pk01{
    float:right;
    background: url(../images/pic02.jpg) 0 0 no-repeat;
    width:211px;
    height:236px;
    margin:10px 0 0 0;
    padding:0;
    }
#index .pkmsg{
    width:110px;
    height:30px;
    margin:10px 0 0 15px;
    font-size:95%;
    }

#index .link{text-align:right;}

/*-------- 08  Staff --------*/
#staff h2#title01{background: url(../images/staff_h2-01.jpg) 0 0 no-repeat;}
#staff h3#title02{background: url(../images/staff_h3-02.jpg) 0 0 no-repeat;}
#staff h3#title03{background: url(../images/staff_h3-03.jpg) 0 0 no-repeat;}
#staff h4#title04{background: url(../images/staff_h4-04.jpg) 0 0 no-repeat;}
#staff h3#title05{background: url(../images/staff_h3-05.jpg) 0 0 no-repeat;}
#staff h4#title06{background: url(../images/staff_h4-06.jpg) 0 0 no-repeat;}
#staff h3#title07{background: url(../images/staff_h3-07.jpg) 0 0 no-repeat;}

#staff .alpha{
	float: left;
    width:235px;
	margin:0;
	padding:0;
	}
	
#staff .beta {
  width:295px;
	float: right;
	margin:0 15px 0 0;
	padding:0;
	}
* html #staff .beta {
	float: left;
	margin:0;
	}	
#staff .alpha .image_l{margin-top:12px;}

#staff #content dt {
	float:left;
	width:65px;
	}
#staff #content dd {
	margin-left:65px;
	}
#staff #content dl{margin-left:0;}
#staff #content ul{margin-left:0;}

#staff .alphap{
	float: left;
    width:235px;
	margin:0;
	padding:0;
	text-align:left;
	}
#staff .sp {margin-top:40px;}


/*-------- 09  Treatment --------*/
#treatment h2#title01{background: url(../images/treatment_h2-01.jpg) 0 0 no-repeat;}
#treatment h3#title02{background: url(../images/treatment_h3-02.jpg) 0 0 no-repeat;}
#treatment h4#title03{background: url(../images/treatment_h4-03.jpg) 0 0 no-repeat;}
#treatment h4#title04{background: url(../images/treatment_h4-04.jpg) 0 0 no-repeat;}
#treatment h4#title05{background: url(../images/treatment_h4-05.jpg) 0 0 no-repeat;}
#treatment h4#title06{background: url(../images/treatment_h4-06.jpg) 0 0 no-repeat;}
#treatment h4#title07{background: url(../images/treatment_h4-07.jpg) 0 0 no-repeat;}

/*-------- 10  Access --------*/
#access h2#title01{background: url(../images/access_h2-01.jpg) 0 0 no-repeat;}
#access h3#title02{background: url(../images/access_h3-02.jpg) 0 0 no-repeat;}
#access h3#title03{background: url(../images/access_h3-03.jpg) 0 0 no-repeat;}
#access #map {width: 425px;  
   height: 350px;  
   border: 2px solid #ccc;  
   margin: 18px 18px 18px 50px;  
   }  
#access .subtitle{
   background: url(../images/arrow.jpg) 0 0 no-repeat;
   text-indent:25px;
   } 
#access .clinic_info{margin:15px 0 0 50px;}
#access .clinic_info table {width:425px;}
#access .alpha{
    width:200px;
	float: left;
	margin: 0 0 15px 0;
	}
#access .gamma {
	float: right;
    width:300px;
	margin: 0 5px 0 0;
	padding: 0;
	}

#access .ver_img{margin-left:25px;}
* html #access .ver_img{margin-left:13px;}

/*-------- 11  Perio --------*/
#perio h2#title01{background: url(../images/perio_h2-01.jpg) 0 0 no-repeat;}
#perio h3#title02{background: url(../images/perio_h3-02.jpg) 0 0 no-repeat;}
#perio h4#title03{background: url(../images/perio_h4-03.jpg) 0 0 no-repeat;}
#perio h3#title04{background: url(../images/perio_h3-04.jpg) 0 0 no-repeat;}
#perio h4#title05{background: url(../images/perio_h4-05.jpg) 0 0 no-repeat;}
#perio h4#title06{background: url(../images/perio_h4-06.jpg) 0 0 no-repeat;}
#perio h4#title07{background: url(../images/perio_h4-07.jpg) 0 0 no-repeat;}
#perio img.intro {float:right;display: block;border: 3px solid #eee4cf;margin:3px 0 0 10px;}


/*-------- 12  Denture --------*/
#denture h2#title01{background: url(../images/denture_h2-01.jpg) 0 0 no-repeat;}
#denture h3#title02{background: url(../images/denture_h3-02.jpg) 0 0 no-repeat;}
#denture h3#title03{background: url(../images/denture_h3-03.jpg) 0 0 no-repeat;}
#denture h4#title04{background: url(../images/denture_h4-04.jpg) 0 0 no-repeat;}
#denture h4#title05{background: url(../images/denture_h4-05.jpg) 0 0 no-repeat;}
#denture h4#title06{background: url(../images/denture_h4-06.jpg) 0 0 no-repeat;}
#denture h4#title07{background: url(../images/denture_h4-07.jpg) 0 0 no-repeat;}
#denture h4#title08{background: url(../images/denture_h4-08.jpg) 0 0 no-repeat;}

#denture .large_text{
    font-size:120%;
    font-weight:bold;
    color:#3B7BBF;
    margin-top:30px;
    }

#denture #step_nav{
    width:520px;
    margin:10px 0 0 50px;
    }
#denture #step_nav ul {
	padding: 0;
	margin:0;
	list-style: none;
    }

#denture #step_nav li {
	height: 30px;
	padding:0;
	margin:0;
	float:left;
	text-indent: -9999px;
	list-style: none;
	}

#denture #step_nav li a {
	display: block;
	height: 30px;
	}

#denture .alpha{
	float: left;
    width:300px;
	margin:0;
	padding:0;
	}
	
#denture .beta {
  width:200px;
	float: right;
	margin:0 15px 0 0;
	padding:0;
	}

#step01 {width: 127px;}
#step02 {width: 127px;}
#step03 {width: 127px;}
#step04 {width: 127px;}
#step01 a {background: url(../images/denture_nav.jpg) 0 -30px no-repeat;width: 127px;}
#step02 a {background: url(../images/denture_nav.jpg) -127px -30px no-repeat;width: 127px;}
#step03 a {background: url(../images/denture_nav.jpg) -254px -30px no-repeat;width: 127px;}
#step04 a {background: url(../images/denture_nav.jpg) -381px -30px no-repeat;width: 127px;}
#step01 a:hover {background: url(../images/denture_nav.jpg) 0 0 no-repeat;width: 127px;}
#step02 a:hover {background: url(../images/denture_nav.jpg) -127px 0 no-repeat;width: 127px;}
#step03 a:hover {background: url(../images/denture_nav.jpg) -254px 0 no-repeat;width: 127px;}
#step04 a:hover {background: url(../images/denture_nav.jpg) -381px 0 no-repeat;width: 127px;}

/*-------- 13  Prevent --------*/
#prevent h2#title01{background: url(../images/prevent_h2-01.jpg) 0 0 no-repeat;}
#prevent h3#title02{background: url(../images/prevent_h3-02.jpg) 0 0 no-repeat;}
#prevent h3#title03{background: url(../images/prevent_h3-03.jpg) 0 0 no-repeat;}
#prevent h4#title04{background: url(../images/prevent_h4-04.jpg) 0 0 no-repeat;}
#prevent h3#title05{background: url(../images/prevent_h3-05.jpg) 0 0 no-repeat;}
#prevent h4#title06{background: url(../images/prevent_h4-06.jpg) 0 0 no-repeat;}
#prevent h4#title07{background: url(../images/prevent_h4-07.jpg) 0 0 no-repeat;}
#prevent h4#title08{background: url(../images/prevent_h4-08.jpg) 0 0 no-repeat;}
#prevent h3#title09{background: url(../images/prevent_h3-09.jpg) 0 0 no-repeat;}
#prevent h4#title10{background: url(../images/prevent_h4-10.jpg) 0 0 no-repeat;}
#prevent h4#title11{background: url(../images/prevent_h4-11.jpg) 0 0 no-repeat;}
#prevent h4#title12{background: url(../images/prevent_h4-12.jpg) 0 0 no-repeat;}
#prevent h3#title13{background: url(../images/prevent_h3-13.jpg) 0 0 no-repeat;}

#prevent .alpha{
	float: left;
  width:210px;
	margin:0;
	padding:0;
	}
	
#prevent .beta {
  width:250px;
	float: right;
	margin:0 15px 0 0;
	padding:0;
	text-align:left;
	}

/*-------- 14  Aesthe --------*/
#aesthe h2#title01{background: url(../images/aesthe_h2-01.jpg) 0 0 no-repeat;}
#aesthe h3#title02{background: url(../images/aesthe_h3-02.jpg) 0 0 no-repeat;}
#aesthe h3#title03{background: url(../images/aesthe_h3-03.jpg) 0 0 no-repeat;}
#aesthe h4#title04{background: url(../images/aesthe_h4-04.jpg) 0 0 no-repeat;}
#aesthe h4#title05{background: url(../images/aesthe_h4-05.jpg) 0 0 no-repeat;}
#aesthe h4#title06{background: url(../images/aesthe_h4-06.jpg) 0 0 no-repeat;}


/*-------- 15  Implant --------*/
#implant h2#title01{background: url(../images/implant_h2-01.jpg) 0 0 no-repeat;}
#implant h3#title02{background: url(../images/implant_h3-02.jpg) 0 0 no-repeat;}
#implant h4#title03{background: url(../images/implant_h4-03.jpg) 0 0 no-repeat;}
#implant h4#title04{background: url(../images/implant_h4-04.jpg) 0 0 no-repeat;}
#implant h3#title05{background: url(../images/implant_h3-05.jpg) 0 0 no-repeat;}
#implant h4#title06{background: url(../images/implant_h4-06.jpg) 0 0 no-repeat;}
#implant h4#title07{background: url(../images/implant_h4-07.jpg) 0 0 no-repeat;}
#implant img.intro {float:right;display: block;border: 3px solid #eee4cf;margin:3px 0 .5em 10px;}

/*-------- 16  Recruit --------*/
#recruit h2#title01{background: url(../images/recruit_h2-01.jpg) 0 0 no-repeat;}
#recruit h3#title02{background: url(../images/recruit_h3-02.jpg) 0 0 no-repeat;}
#recruit .recruit_table table{width:450px;margin-left:40px;}

/*-------- 17  Sitemap --------*/
#sitemap h2#title01{background: url(../images/sitemap_h2-01.jpg) 0 0 no-repeat;}

#sitemap dt{
    height:25px;
    background: url(../images/sitemap_li_bg.jpg) 0 0 no-repeat;
    text-indent:25px;
    }
#sitemap dd{margin-bottom:15px;}