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

/*=======================TOC=======================*/
/*                                                 */
/*                 01  Base                        */
/*                 02  Container                   */
/*                 03  Header                      */
/*                 04  Navigation                  */
/*                 05  Footer                      */
/*                 06  Contents                    */
/*                 07  Index                       */
/*                 08  Concept                     */
/*                 09  Clinic                      */
/*                 10  Guide                       */
/*                 11  Child                       */
/*                 12  Prevent                     */
/*                 13  Denture                     */
/*                 14  Esthe                       */
/*                 15  White                       */
/*                 16  Access                      */
/*                 17  Recruit                     */
/*                                                 */
/*=======================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: #E0FFFF url(../images/body_bg.jpg) top repeat-x; }

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

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

#content {
	width: 520px;
	float: right;
	font-size: 100%;
	line-height: 1.4;
	color: #666;
	background: #fff;
	padding: 20px 0 10px 0 ;
	margin-right:40px;
	}
* html #content {
	margin-right:20px;
	}

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

#header {
	background: url(../images/header_bg.jpg) 0 0 no-repeat;
	height: 320px;
	width: 800px;
	margin: 0 0 0 10px;
	padding: 0;
	}
#index #header {
	background: url(../images/index_header_bg.jpg) 0 0 no-repeat;
	height: 380px;
	width: 800px;
	margin: 0 0 0 10px;
	padding: 0;
	}

h1 {
	text-indent: -9999px;
	width: 500px;
	height: 95px;
	line-height: 1.0;
	float: left;
	}
h1 a {
	display: block;
	width: 500px;
	height: 95px;
	background: url(../images/h1.jpg) 0 0 no-repeat;
	}

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

#header p.tel {
	margin: 0;
	padding: 0;
	height: 40px;
	line-height:10px;
	}
#header p.tel img { display: block; }

#header .header_res {
    text-indent:-9999px;
    width:171px;
    height:100px;
    float:right;
    margin:6px 10px 0 0;
    }
* html #header .header_res {
    margin:6px 5px 0 0;
    }

#header .header_res a {
    display:block;
    height: 100px;
	background: url(../images/header_res.jpg) 0 0 no-repeat;
	}
#header .header_res a:hover {
	background: url(../images/header_res.jpg) 0 0 no-repeat;
	}

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

#nav {
	width: 230px;
	float: left;
	padding: 0 0 30px 10px;
	}

#nav ul {
	margin: 0;
	padding: 10px 0 50px 0 ;
	list-style: none;
	background: url(../images/nav.jpg) top left no-repeat; 
	}
#nav li {
	margin: 0 0 0 19px;
	padding:0;
	list-style: none;
	}
*:first-child+html #nav li {
	padding: 0 0 0 19px;
	margin:0;
	}

#nav .internal li {
    width:182px;
	height: 30px;
	text-indent: -9999px;
	}

#nav .internal li a {
	display: block;
	height: 30px;
	}
	
#nav01 a { background: url(../images/nav.jpg) -19px -10px no-repeat; }
#nav02 a { background: url(../images/nav.jpg) -19px -40px no-repeat; }
#nav03 a { background: url(../images/nav.jpg) -19px -70px no-repeat; }
#nav04 a { background: url(../images/nav.jpg) -19px -100px no-repeat; }
#nav05 a { background: url(../images/nav.jpg) -19px -130px no-repeat; }
#nav06 a { background: url(../images/nav.jpg) -19px -160px no-repeat; }
#nav07 a { background: url(../images/nav.jpg) -19px -190px no-repeat; }
#nav08 a { background: url(../images/nav.jpg) -19px -220px no-repeat; }
#nav09 a { background: url(../images/nav.jpg) -19px -250px no-repeat; }
#nav10 a { background: url(../images/nav.jpg) -19px -280px no-repeat; }

#nav01 a:hover { background: url(../images/nav.jpg) -249px -10px no-repeat; }
#nav02 a:hover { background: url(../images/nav.jpg) -249px -40px no-repeat; }
#nav03 a:hover { background: url(../images/nav.jpg) -249px -70px no-repeat; }
#nav04 a:hover { background: url(../images/nav.jpg) -249px -100px no-repeat; }
#nav05 a:hover { background: url(../images/nav.jpg) -249px -130px no-repeat; }
#nav06 a:hover { background: url(../images/nav.jpg) -249px -160px no-repeat; }
#nav07 a:hover { background: url(../images/nav.jpg) -249px -190px no-repeat; }
#nav08 a:hover { background: url(../images/nav.jpg) -249px -220px no-repeat; }
#nav09 a:hover { background: url(../images/nav.jpg) -249px -250px no-repeat; }
#nav10 a:hover { background: url(../images/nav.jpg) -249px -280px no-repeat; }

#nav p { text-align: center; }

* html #nav p { margin-left:10px;}


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

#footer {
    height:80px;
	clear: both;
	padding: 0;
	margin: 0;
	background: #fff url(../images/footer_bg.jpg) bottom repeat-x;
	text-align: right;
	color: #3599D4;
	}

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

#footer .section {
    padding:20px 40px 0 0 ;
    }

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

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

#footer address { margin: 8px 1em; color:#4088FE;font-size: 85%;}
*:first-child+html #footer address { font-size: 9px; } /*  for IE7 only */
* html body #footer address { font-size: 9px; } /*  for IE6 only */


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

.section { padding: .5em 0 10px 0 ; }
.section .section { padding: .5em 0 0 0 ; }

p.center { text-align: center; }

#content h2 {
    width:520px;
	height: 45px;
	text-indent: -9999px;
	clear:both;
	}
#content h3 {
	clear: both;
    width:520px;
	height: 37px;
	text-indent: -9999px;
	clear:both;
	}
#content h4 {
	height: 25px;
	text-indent: -9999px;
	margin-left:-5px;
	}

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

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

#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: 0 16px 16px 0;
	}

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

.case {
	margin: 10px 20px;
	background: url(../images/arrow_h.png) center center no-repeat;
	}
.case2 {
	margin: 10px 20px;
	}	
.case img,
.case2 img {
	display: block;
	}

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


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

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

p.caution {
	padding-left: 24px;
	background: url(../images/caution.jpg) 0 1px no-repeat;
	}

/* 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 */


#content .alpha,
#content .beta{
    float:left;
    }
#content .gamma{
    float:left;
    }
#header .catch{
	width: 550px;
	height: 80px;
	text-indent:-9999px;
	line-height:0;
	margin:-10px 0 0 0;
	float:right;
    }
*:first-child+html #header .catch {
	margin:0 0 0 0;
	}
* html #header .catch {
	margin:0 0 0 0;
	}

.img_border {
    border:2px solid #9BDCFC;
    padding:1px 1px 1px 1px;
    }

#content table {
    margin-top:10px;
    border: 1px solid #BFAE6B;
    line-height:20px;
    table-layout:fixed;
    }
#content table td {
    border: 1px solid #BFAE6B;
    color:#6F6F6F;
    background:#fff;
    vertical-align: top;
    }
#content table dl {
    padding:0;
    margin:0;
    }  
#content table th{
    text-align:center;
    border: 1px solid #BFAE6B;
    background:#FFF7D9;
    color:#F07908;
    font-weight:bold;
    }
#content table ul{
    margin:0;
    padding:0;
    }
#content table ol{
    margin-top:0;
    margin-bottom:0;
    }
#content table li{
    line-height:20px;
    } 
* html #content table{font-size:95%;}
* html #content table th {padding:3px 5px 3px 5px;}

#content .subtitle{
    font-size:124%;
    font-weight:bold;
    color:#FF744F;
    }
    
#content .reservation {
    text-indent:-9999px;
    width:522px;
    height: 82px;
    clear:both;
    }
#content .reservation a {
    display:block;
    height: 82px;
	background: url(../images/reservation.png) 0 0 no-repeat;
	}
#content .reservation a:hover {
	background: url(../images/reservation.png) 0 -82px no-repeat;
	}
#content .time_table {
    width:457px;
    margin-left:10px;
    }
#content .time_table .comment{
    text-align:right;
    line-height:1.3;
    margin-top:-5px;
    }

/*-------- 07  Index --------*/
#index h2#title01 {
    background: url(../images/index_h2-01.png) 0 0 no-repeat;
    height:45px;
    width:520px;
    margin:0;
    }
#index h3#title02 {
    background: url(../images/index_h3-02.png) 0 0 no-repeat;
    height:35px;
    width:220px;
    margin:0;
    }
#index h3#title03 {
    background: url(../images/index_h3-03.png) 0 0 no-repeat;
    height:35px;
    width:485px;
    margin:0;
    }
#index h4{width:160px;height:36px;margin:0;padding:0; clear:both; }
#index h4 a {display:block;height:36px;}
   
#index h4#title04 a { background: url(../images/index_h4-04.jpg) 0 0 no-repeat;height:36px;}
#index h4#title05 a { background: url(../images/index_h4-05.jpg) 0 0 no-repeat;height:36px;}
#index h4#title06 a { background: url(../images/index_h4-06.jpg) 0 0 no-repeat;height:36px;}
#index h4#title04 a:hover { background: url(../images/index_h4-04.jpg) 0 -36px no-repeat;height:36px;}
#index h4#title05 a:hover { background: url(../images/index_h4-05.jpg) 0 -36px no-repeat;height:36px;}
#index h4#title06 a:hover { background: url(../images/index_h4-06.jpg) 0 -36px no-repeat;height:36px;}
    
#index .greeting dl{
    margin:0;
    padding:0;
    }
#index .greeting dt{
    float:left;
    width:50px;
    
    }
#index .greeting dd{
    margin-left:50px;
    }

#index .clinic_info{
    margin:30px 0 0 0 ;
    width:520px;
    background: url(../images/clinic_info_bg.png) bottom no-repeat;
    }

#index .clinic_area{
    width:520px;
    background: url(../images/clinic_info_h_bg.png) top no-repeat;
    }
#index .address_area{
    width:520px;
    padding:20px 5px 15px 20px;
    }
#index .address_area .alpha p{
    margin-left:10px;
    }
#index .clinic_area .beta {
    margin-left:10px;
    width:250px;
    }
#index .clinic_area .access_link {
    float:right;
    width:112px;
    height:20px;
    text-indent:-9999px;
    }    
#index .clinic_area .access_link a {
    display:block;
    height:20px;
    background: url(../images/maplink.png) 0 0 no-repeat;
    }
#index .clinic_area .access_link a:hover {
    background: url(../images/maplink.png) 0 -20px no-repeat;
    }

#index #map_s{
    width:255px;
    height:180px;
    border:2px solid #ccc;
    margin-top:15px;
    }    

#index .pkup {
    clear:both;
    margin:20px 0 10px 0;
    width:520px;
    }

#index .pkup .alpha,
#index .pkup .beta,
#index .pkup .gamma {
    width:160px;
    height:250px;
    margin:0;
    padding:0;
    }

#index .pkup .beta,
#index .pkup .gamma {
    margin-left:20px;
    }


#index .pkup .alpha .text_area{
    width:160px;
    height:214px;
    margin:-10px 0 0 0;
    padding:0;
    background: url(../images/pkup01.jpg) 0 0  no-repeat;
    }

*:first-child+html #index .pkup .alpha .text_area{
    margin:0 0 0 0;
    }
* html #index .pkup .alpha .text_area{
    margin:0 0 0 0;
    }

#index .pkup .beta .text_area{
    width:160px;
    height:214px;
    margin:-10px 0 0 0;
    padding:0;
    background: url(../images/pkup02.jpg) bottom no-repeat;
    }
*:first-child+html #index .pkup .beta .text_area{
    margin:0 0 0 0;
    }
* html #index .pkup .beta .text_area{
    margin:0 0 0 0;
    }    
#index .pkup .gamma .text_area{
    width:160px;
    height:214px;
    margin:-10px 0 0 0;
    padding:0;
    background: url(../images/pkup03.jpg) bottom no-repeat;
    }
*:first-child+html  #index  .pkup .gamma .text_area{
    margin:0 0 0 0;
    }
* html #index .pkup .gamma .text_area{
    margin:0 0 0 0;
    }     
#index .text_area p{
    width:140px;
    padding:110px 0 0 10px;
    }
* html #index .text_area p{
    width:150px;
    padding:110px 0 0 8px;
    }  
#index .text_area a{
	text-decoration: none;
    color:#666666;
    }
#index .text_area a:hover{
    text-decoration: underline; 
    }
#index .sr_bn01 {
    margin:15px 0 -10px 0;
    padding:0;
    }
#index .sr_bn01 a{
    margin:0;
    padding:0;
	background:url(../images/banner_01.jpg) ;
	width:520px;
	height:90px;
	text-indent:-9999px;
	overflow:hidden;
	display:block;
    }
#index .sr_bn01 a:hover{
	background:url(../images/banner_01_ov.jpg) ;
   }
   
.sr_txt01 { color:#FF0000; font-weight:bold; }
/*-------- 08  Concept --------*/
#concept h2#title01 { background: url(../images/concept_h2-01.png) 0 0 no-repeat; }
#concept h3#title02 { background: url(../images/concept_h3-02.png) 0 0 no-repeat; }
#concept h3#title03 { background: url(../images/concept_h3-03.png) 0 0 no-repeat; }
#concept h4#title04 { background: url(../images/concept_h4-04.png) 0 0 no-repeat; }
#concept h4#title05 { background: url(../images/concept_h4-05.png) 0 0 no-repeat; }

/*#concept .catch{ background: url(../images/catch_concept.jpg) 0 0 no-repeat;}*/

#concept .concept dl{
    margin:10px 0 20px 10px ;
    padding:0;
    }
#concept .concept dt{
    float:left;
    width:50px;
    }
#concept .concept dd{
    margin-left:50px;
    }

#concept .dr_photo p {
    text-indent:30px;
    }
.fl { float:left; }
.fr { float:right; margin-right:40px; margin-top:10px; }
*html body .fr { float:right; margin-right:20px; margin-top:10px; }
.marT10 { margin-top:10px; }
.marT20 { margin-top:20px; }


/*-------- 09  Clinic --------*/
#clinic h2#title01 { background: url(../images/clinic_h2-01.png) 0 0 no-repeat; }
#clinic h3#title02 { background: url(../images/clinic_h3-02.png) 0 0 no-repeat; margin-bottom:10px;}
#clinic h4#title03 { background: url(../images/clinic_h4-03.png) 0 0 no-repeat; width:250px;clear:none;}
#clinic h4#title04 { background: url(../images/clinic_h4-04.png) 0 0 no-repeat; width:250px;clear:none;}
#clinic h4#title05 { background: url(../images/clinic_h4-05.png) 0 0 no-repeat; width:250px;clear:none;}
#clinic h4#title06 { background: url(../images/clinic_h4-06.png) 0 0 no-repeat; width:250px;clear:none;}
#clinic h4#title07 { background: url(../images/clinic_h4-07.png) 0 0 no-repeat; width:250px;clear:none;}
#clinic h4#title08 { background: url(../images/clinic_h4-08.png) 0 0 no-repeat; width:250px;clear:none;}
#clinic h4#title09 { background: url(../images/clinic_h4-09.png) 0 0 no-repeat; width:250px;clear:none;}


#clinic .clinic_area{
   clear:both;
   }

#clinic .text_area{
   width:280px; 
   float:left;
   }

/*-------- 10  Guide --------*/
#guide h2#title01 { background: url(../images/guide_h2-01.png) 0 0 no-repeat; }
#guide h3#title02 { background: url(../images/guide_h3-02.png) 0 0 no-repeat; }
#guide #content dl{
    margin-left:5px;
    }
#guide #content dt{
    font-weight:bold;
    font-size:105%;
	background: url(../images/li_bg.gif) 0 2px no-repeat;
	text-indent:20px;
    }
#guide #content dd{
    margin-bottom:30px;
    }


/*-------- 11  Child --------*/
#child h2#title01 { background: url(../images/child_h2-01.png) 0 0 no-repeat; }
#child h3#title02 { background: url(../images/child_h3-02.png) 0 0 no-repeat; }
#child h3#title03 { background: url(../images/child_h3-03.png) 0 0 no-repeat; }
#child h4#title04 { background: url(../images/child_h4-04.png) 0 0 no-repeat; clear:both; }
#child h4#title05 { background: url(../images/child_h4-05.png) 0 0 no-repeat; clear:both; }
#child h4#title06 { background: url(../images/child_h4-06.png) 0 0 no-repeat; clear:both; }
#child h3#title07 { background: url(../images/child_h3-07.png) 0 0 no-repeat; }


/*-------- 12  Prevent --------*/
#prevent h2#title01 { background: url(../images/prevent_h2-01.png) 0 0 no-repeat; }
#prevent h3#title02 { background: url(../images/prevent_h3-02.png) 0 0 no-repeat; }
#prevent h3#title03 { background: url(../images/prevent_h3-03.png) 0 0 no-repeat; }
#prevent h4#title04 { background: url(../images/prevent_h4-04.png) 0 0 no-repeat; clear:both; }
#prevent h4#title05 { background: url(../images/prevent_h4-05.png) 0 0 no-repeat; clear:both; }
#prevent h4#title06 { background: url(../images/prevent_h4-06.png) 0 0 no-repeat; clear:both; }
#prevent h4#title07 { background: url(../images/prevent_h4-07.png) 0 0 no-repeat; clear:both; }


/*-------- 13  Denture --------*/
#denture h2#title01 { background: url(../images/denture_h2-01.png) 0 0 no-repeat; }
#denture h3#title02 { background: url(../images/denture_h3-02.png) 0 0 no-repeat; }
#denture h4#title03 { background: url(../images/denture_h4-03.png) 0 0 no-repeat; clear:both; }
#denture h4#title04 { background: url(../images/denture_h4-04.png) 0 0 no-repeat; clear:both; }
#denture h4#title05 { background: url(../images/denture_h4-05.png) 0 0 no-repeat; clear:both; }
#denture h3#title06 { background: url(../images/denture_h3-06.png) 0 0 no-repeat; }
#denture h3#title07 { background: url(../images/denture_h3-07.png) 0 0 no-repeat; }
#denture h4#title08 { background: url(../images/denture_h4-08.png) 0 0 no-repeat; clear:both; }
#denture h4#title09 { background: url(../images/denture_h4-09.png) 0 0 no-repeat; clear:both; }
#denture h4#title10 { background: url(../images/denture_h4-10.png) 0 0 no-repeat; clear:both; }
#denture h3#title11 { background: url(../images/denture_h3-11.png) 0 0 no-repeat; }


/*-------- 14  Esthe --------*/
#esthe h2#title01 { background: url(../images/esthe_h2-01.png) 0 0 no-repeat; }
#esthe h3#title02 { background: url(../images/esthe_h3-02.png) 0 0 no-repeat; }
#esthe h3#title03 { background: url(../images/esthe_h3-03.png) 0 0 no-repeat; }
#esthe h4#title04 { background: url(../images/esthe_h4-04.png) 0 0 no-repeat; clear:both; }
#esthe h4#title05 { background: url(../images/esthe_h4-05.png) 0 0 no-repeat; clear:both; }
#esthe h4#title06 { background: url(../images/esthe_h4-06.png) 0 0 no-repeat; clear:both; }


/*-------- 15  White --------*/
#white h2#title01 { background: url(../images/white_h2-01.png) 0 0 no-repeat; }
#white h3#title02 { background: url(../images/white_h3-02.png) 0 0 no-repeat; }
#white h4#title03 { background: url(../images/white_h4-03.png) 0 0 no-repeat; clear:both; }
#white h4#title04 { background: url(../images/white_h4-04.png) 0 0 no-repeat; clear:both; }


/*-------- 16  Access --------*/
#access h2#title01 { background: url(../images/access_h2-01.png) 0 0 no-repeat; }
#access h3#title02 { background: url(../images/access_h3-02.png) 0 0 no-repeat; }
#access h3#title03 { background: url(../images/access_h3-03.png) 0 0 no-repeat; }

#access #content table {
   width:450px;
   margin-left:20px;
   }

#access #content table th{
   width:70px;
   }
   
#access #map{
    width:330px;
    height:250px;
    border:2px solid #ccc;
    }    


/*-------- 17  Recruit --------*/
#recruit h2#title01 { background: url(../images/recruit_h2-01.png) 0 0 no-repeat; }
#recruit h3#title02 { background: url(../images/recruit_h3-02.png) 0 0 no-repeat; }

#recruit #content table {
   width:450px;
   margin-left:20px;
   }

#recruit #content table th{
   width:120px;
   }

#recruit #content table dt{
   float:left;
   }
#recruit #content table dd{
   margin-left:80px;
   }
#recruit #content table span{
   font-size:85%;
   }

#recruit #content table span.subtitle{
   font-size:108%;
   }