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

/*=======================TOC=======================*/
/*                                                 */
/*                 01  Base                        */
/*                 02  Container                   */
/*                 03  Header                      */
/*                 04  Navigation                  */
/*                 05  Footer                      */
/*                 06  Contents                    */
/*                 07  Index                       */
/*                 08  Infomation                    */
/*                 09  Clinic                      */
/*                 10  Access                      */
/*                 11  Whitening                   */
/*                 12  Implant                     */
/*                 13  Caries_perio                */
/*                 14  Aesthe                      */
/*                 15  Ortho                       */
/*                                                 */
/*=======================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:#FBE8DE url(../images/body_bg.jpg) top repeat-x; }
#body_back{
    background:url(../images/body_back.jpg) top no-repeat; 
	margin: 0;
	padding: 0;
    }

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

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

#content {
	width: 585px;
	float: right;
	font-size: 100%;
	line-height: 1.6;
	color: #777777;
	padding: 125px 0 1em 10px;
	margin-right:5px;
	}
	
#box {
  padding: 0 20px 0 5px;
	margin: 0 0 10px 0;
  background:url(../images/greeting_bg02.jpg) 0 0 no-repeat;

}

.atention {
 background: url(../images/index_h3-04.jpg) top no-repeat;
 text-indent:-9999px;
 width:350px;
 height:30px;
 clear: none;
 margin:5px 0 10px 5px;
}

.naiyou {
  padding: 10px 5px 0 5px;
}

.indent {
  text-align: right;
	padding: 0 20px 10px 0;
}	


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

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

h1 {
	text-indent: -9999px;
	width: 330px;
	height: 85px;
	line-height: 1.0;
	float: left;
	margin:48px 0 0 10px;
	}
* html h1{
	margin:48px 0 0 5px;
    }	
h1 a {
	display: block;
	width: 330px;
	height: 85px;
	background: url(../images/h1.jpg) 0 0 no-repeat;
	}

#header .section {
    clear:both;
	width: 320px;
	float: left;
	margin: 17px 0 0 15px;
	padding: 0;
	}
* html #header .section {
	margin: 17px 0 0 8px;
	padding: 0;
	}

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


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

#nav {
	width: 200px;
	float: left;
	margin-left:10px;
	}
* html #nav {
	margin-left:5px;
	}

#nav .menu_area {
	background: url(../images/nav_f_bg.jpg) bottom no-repeat; 
	padding-bottom:17px;
    }
#nav .menu_bt {
	background: url(../images/nav_h_bg.jpg) top no-repeat; 
	}
#nav ul,
#nav li {
	margin: 0;
	padding: 0;
	list-style: none;
	}


#nav .internal li {
    width:190px;
	height: 50px;
	padding:0 0 0 5px;
	text-indent: -9999px;
	}

#nav .internal li a {
	display: block;
	height: 50px;
	}

#nav01 a { background: url(../images/nav.jpg) 0 -48px no-repeat; }
#nav02 a { background: url(../images/nav.jpg) 0 -98px no-repeat; }
#nav03 a { background: url(../images/nav.jpg) 0 -148px no-repeat; }
#nav04 a { background: url(../images/nav.jpg) 0 -198px no-repeat; }
#nav05 a { background: url(../images/nav.jpg) 0 -248px no-repeat; }
#nav06 a { background: url(../images/nav.jpg) 0 -298px no-repeat; }
#nav07 a { background: url(../images/nav.jpg) 0 -348px no-repeat; }
#nav08 a { background: url(../images/nav.jpg) 0 -398px no-repeat; }
#nav09 a { background: url(../images/nav.jpg) 0 -448px no-repeat; }

#nav01 a:hover { background: url(../images/nav.jpg) -190px -48px no-repeat; }
#nav02 a:hover { background: url(../images/nav.jpg) -190px -98px no-repeat; }
#nav03 a:hover { background: url(../images/nav.jpg) -190px -148px no-repeat; }
#nav04 a:hover { background: url(../images/nav.jpg) -190px -198px no-repeat; }
#nav05 a:hover { background: url(../images/nav.jpg) -190px -248px no-repeat; }
#nav06 a:hover { background: url(../images/nav.jpg) -190px -298px no-repeat; }
#nav07 a:hover { background: url(../images/nav.jpg) -190px -348px no-repeat; }
#nav08 a:hover { background: url(../images/nav.jpg) -190px -398px no-repeat; }
#nav09 a:hover { background: url(../images/nav.jpg) -190px -448px no-repeat; }

#nav p { text-align: center; }

#nav .banners{
    padding-left:10px;
    margin-top:30px;
    }
#nav .banners #nav_ban01 { text-indent:-9999px; }
#nav .banners #nav_ban01 a {
    float:left;
    display:block;
    width:180px;
    height:40px;
    margin-bottom:10px;
    background:url(../images/ban_nav01.jpg) 0 0 no-repeat;
    }
#nav .banners #nav_ban01 a:hover { background:url(../images/ban_nav01.jpg) 0 0 no-repeat;}

#nav .banners #nav_ban02 { text-indent:-9999px; }
#nav .banners #nav_ban02 a {
    float:left;
    display:block;
    width:180px;
    height:80px;
    margin-bottom:10px;
    background:url(../images/ban_nav02.jpg) 0 0 no-repeat;
    }
#nav .banners #nav_ban02 a:hover { background:url(../images/ban_nav02.jpg) 0 0 no-repeat;}

#nav .banners #nav_ban03 { text-indent:-9999px; }
#nav .banners #nav_ban03 a {
    float:left;
    display:block;
    width:180px;
    height:40px;
    margin-bottom:10px;
    background:url(../images/ban_nav03.jpg) 0 0 no-repeat;
    }
#nav .banners #nav_ban03 a:hover { background:url(../images/ban_nav03.jpg) 0 0 no-repeat;}

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

#footer {
    height:80px;
	clear: both;
	padding:0 ;
	margin: 0;
	background: #fff url(../images/footer_bg.jpg) 0 0  repeat-x;
	font-size: 85%;
	text-align: center;
	color: #FFFFFF;
	}
*: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: #BF7582;
	}
#footer a:hover { text-decoration: underline; }

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

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

#footer address { margin: 15px 1em; }

* html #footer address { margin: 19px 1em; }

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

.section { padding: .5em 30px; }
.section .section { padding: .2em 10px; }

p.center { text-align: center; }

#content h2 {
	height: 60px;
	text-indent: -9999px;
	}
#content h3 {
	clear: both;
	height: 38px;
	text-indent: -9999px;
	margin-left: -10px;
	}
#content h4 {
	height: 25px;
	text-indent: -9999px;
	}

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

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

#content a { text-decoration: underline; }
a {
	color: #BF7582;
	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;
	}
.case img {
	display: block;
	}

.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: 75px;
	height: 25px;
	margin: 0;
	padding: 0;
	text-indent: -9999px;
	float: right;
	background-image: none;
	}
#content ul.totop li a {
	display: block;
	height: 25px;
	background: url(../images/totop.png) 0 0 no-repeat;
	}

p.caution {
    font-size:93%;
    color:#BF7582;
	}

/* 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 table {
    margin-top:10px;
    border: 1px solid #ccc;
    line-height:20px;
    }
#content table td {
    border: 1px solid #ccc;
    color:#6F6F6F;
    background:#fff;
    vertical-align: top;
    }
#content table dl {
    padding:0;
    }  
#content table th{
    text-align:center;
    border: 1px solid #ccc;
    background:#FBE8DE;
    color:#BF7582;
    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;}


.link{
    clear:both;
    text-align:right;
    }
    
.subtitle{
    color:#BF7582;
    font-size:105%;
    font-weight:bold;
    }

.img_border{
    border:2px #BF7582 solid;
    }

#reservation {
    text-indent:-9999px;
    }
#reservation a {
    display:block;
    width:570px;
    height:102px;
    background:url(../images/reservation.png) 0 0 no-repeat;
    }
#reservation a:hover { background:url(../images/reservation.png) 0 0 no-repeat;}

   
/*-------- 07  Index --------*/
#index h2#title01 {
    clear:none;
    float:left;
    background:url(../images/index_h2-01.jpg) 0 0 no-repeat;
    width:110px;
    height:160px;
    margin:0 0 0 4px;
    }
#index h3#title02 {
    background:url(../images/index_h3-02.jpg) 0 0 no-repeat;
    width:385px;
    height:35px;
	margin:0;
	clear: none;
    }
#index h3#title03 {
    background:url(../images/index_h3-03.jpg) 0 0 no-repeat;
    width:150px;
    height:30px;
	clear: none;
    margin:20px 0 0 5px;
	
    }
#index .news{
    float:left;
    margin-right:10px;
    width:360px;
    height:160px;
	background: url(../images/news_bg.jpg) 0 0 no-repeat;
    }
#index .news_area{
    width:570px;
    }
#index .news_content{
    float:left;
    margin-left:16px;
    }
#index .news .text{
    width:220px;
    padding-top:5px;
    height:15px;
    color:#BF7582;
    text-decoration: underline;
    }    
#index .news .box{
	background: url(../images/news_box_bg.jpg) 0 0 no-repeat;
    width:220px;
    height:90px;
    }
#index .news .box .box_contents{
    padding:5px 5px 5px 5px;
    }    

#index #perio_link { 
    margin: 0;
    text-indent:-9999px;
    }
#index #perio_link a {
    float:left;
    display:block;
    width:200px;
    height:160px;
    background:url(../images/index_perio.jpg) 0 0 no-repeat;
    }
#index #perio_link a:hover { background:url(../images/index_perio.jpg) 0 0 no-repeat;}


#index .access{
	background: url(../images/index_access_bg.jpg) bottom left no-repeat;
    width:570px;
    height:180px;
    font-size:93%;
    line-height:15px;
    margin-top:10px
    }
#index .access .accsee_info{
    float:left;
    width:390px;
    }
    
#index .access dl {
    margin-left:10px;
    }
#index .access dt {
    width:65px;
    color:#BF7582;
    }
#index .access dd dt {
    color:#777777;
    }    
#index .access dd {
    margin-left:65px;
    }
#index .access dd dl {
    margin:0px;
    }
#index .access dd dt {
    float:left;
    width:80px;
    }
#index .access dd dd {
    margin-left:80px;
    }

#index .accsee_photo{
    float:right;
    width:80px;
    }
    
#index #access_link p{ 
    margin:0;
    padding:0;
    }

#index #access_link { 
    text-indent:-9999px;
    }
#index #access_link a {
    display:block;
    float:right;
    width:180px;
    height:180px;
    background:url(../images/index_access_link.jpg) 0 0 no-repeat;
    }
#index #access_link a:hover { background:url(../images/index_access_link.jpg) 0 0 no-repeat;}

#index .greeting{
    margin-top:10px;
    width:570px;
    height:130px;
    background:url(../images/greeting_bg.jpg) 0 0 no-repeat;
    }
#index .greeting p{
    padding:5px 8px 5px 8px;
    }
*:first-child+html #index .greeting p{
    padding:0px 8px 5px 8px;
    }

/*-------- 08  Infomation --------*/
#infomation h2#title01 { background:url(../images/infomation_h2-01.png) 0 0 no-repeat; }




/*-------- 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; }
#clinic h3#title03 { background:url(../images/clinic_h3-03.png) 0 0 no-repeat; }
#clinic h3#title04 { background:url(../images/clinic_h3-04.png) 0 0 no-repeat; margin-top:10px;}
#clinic h3#title12 { background:url(../images/clinic_h3-12.png) 0 0 no-repeat; }
#clinic h4#title05 { background:url(../images/clinic_h4-05.png) 0 0 no-repeat; }
#clinic h4#title06 { background:url(../images/clinic_h4-06.png) 0 0 no-repeat; }
#clinic h4#title07 { background:url(../images/clinic_h4-07.png) 0 0 no-repeat; }
#clinic h4#title08 { background:url(../images/clinic_h4-08.png) 0 0 no-repeat; }
#clinic h4#title09 { background:url(../images/clinic_h4-09.png) 0 0 no-repeat; }
#clinic h4#title10 { background:url(../images/clinic_h4-10.png) 0 0 no-repeat; }
#clinic h4#title11 { background:url(../images/clinic_h4-11.png) 0 0 no-repeat; }
#clinic h4#title12 { background:url(../images/clinic_h4-12.png) 0 0 no-repeat; }
#clinic h4#title13 { background:url(../images/clinic_h4-13.png) 0 0 no-repeat; }
#clinic h4#title14 { background:url(../images/clinic_h4-14.png) 0 0 no-repeat; }
#clinic h4#title15 { background:url(../images/clinic_h4-15.png) 0 0 no-repeat; }

#clinic .dr_photo{
    float:left;
    }
#clinic .dr_info{
    float:left;
    margin-left:20px;
    width:350px;
    }
#clinic .dr_info dt{
    width:70px;
    }
#clinic .dr_info dd{
    margin-left:70px;
    }
#clinic .clinic_info{
    clear:both;
    margin-bottom:10px;
    }
#clinic .clinic_info .img_exp{
    float:right;
    width:260px;
    }

/*-------- 10  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 .tel{
    font-size:105%;
    font-weight:bold;
    }

#access .clinic_area{
    margin-bottom:10px;
    }

#access .clinic_info{
    width:280px;
    float:left;
    margin-left:10px;
    }
#access .clinic_info dl{
    margin:0;
    }
#access .clinic_info dt{
    width:65px;
    color:#BF7582;
    }
#access .clinic_info dd{
    margin-left:65px;
    }
#access  #map {  
    width: 350px;  
    height: 300px;  
    border: 2px solid #ccc;  
    margin: 20px;  
    }



/*-------- 11  Whitening --------*/
#whitening h2#title01 { background:url(../images/whitening_h2-01.png) 0 0 no-repeat; }
#whitening h3#title02 { background:url(../images/whitening_h3-02.png) 0 0 no-repeat; }
#whitening h4#title03 { background:url(../images/whitening_h4-03.png) 0 0 no-repeat; }
#whitening h4#title04 { background:url(../images/whitening_h4-04.png) 0 0 no-repeat; }
#whitening h4#title05 { background:url(../images/whitening_h4-05.png) 0 0 no-repeat; }

#whitening ul.subtitle {
  margin-top: 30px;
  }
#whitening ul.subtitle li{
  background: none;
  padding-left: 0;
  }
  
#whitening .text01{
  margin-bottom:20px;
  }
	
#whitening .ind{
	margin-left:100px;
}
  
/*-------- 12  Implant --------*/
#implant h2#title01 { background:url(../images/implant_h2-01.png) 0 0 no-repeat; }
#implant h3#title02 { background:url(../images/implant_h3-02.png) 0 0 no-repeat; }

#implant table td{
  vertical-align: top;
  }
  
#implant .t_title_m{
  text-align:center;
  background:#FFEFF2;
  color:#CF7480;
  font-weight:bold;
  }
#implant .t_title_d{
  text-align:center;
  background:#EFF9FF;
  color:#549EC6;
  font-weight:bold;
  }

#implant td.t_bg_m{
  color:#CF7480;
  width:210px;
  }
#implant td.t_bg_d{
  color:#549EC6;
  width:210px;
  }

#implant table th img{margin-top:5px;}
#implant table th {
  background:#fff;
  }

.bnr_dainet a {
	display: block;
	width: 500px;
	height: 60px;
	clear: both;
	margin: 10px 0;
	padding: 0;
	background: url(../images/bnr_dainet.jpg) no-repeat 0 0;
	text-indent: -9999em;
	outline: none;
}
.bnr_dainet a:hover { background-position: bottom; }


/*-------- 13  Caries_perio --------*/
#caries_perio h2#title01 { background:url(../images/caries_perio_h2-01.png) 0 0 no-repeat; }
#caries_perio h3#title02 { background:url(../images/caries_perio_h3-02.png) 0 0 no-repeat; }
#caries_perio h4#title03 { background:url(../images/caries_perio_h4-03.png) 0 0 no-repeat; }
#caries_perio h4#title04 { background:url(../images/caries_perio_h4-04.png) 0 0 no-repeat; }
#caries_perio h4#title05 { background:url(../images/caries_perio_h4-05.png) 0 0 no-repeat; }

#caries_perio table.cond{
   width:440px;
   }
  
/*-------- 14  Aesthe --------*/
#aesthe h2#title01 { background:url(../images/aesthe_h2-01.png) 0 0 no-repeat; }
#aesthe h3#title02 { background:url(../images/aesthe_h3-02.png) 0 0 no-repeat; }
#aesthe h4#title03 { background:url(../images/aesthe_h4-03.png) 0 0 no-repeat; }

#aesthe ul.subtitle li{
  background: none;
  padding-left: 0;
  }
#aesthe ul.subtitle {
  margin-left: 0;
  }
    
#aesthe .text01{
  margin-bottom:20px;
  }

/*-------- 15  Ortho --------*/
#ortho h2#title01 { background:url(../images/ortho_h2-01.png) 0 0 no-repeat; }
#ortho h3#title02 { background:url(../images/ortho_h3-02.png) 0 0 no-repeat; }
#ortho h4#title03 { background:url(../images/ortho_h4-03.png) 0 0 no-repeat; clear:both;}
#ortho h5{color:#B8AD8D}

#ortho .step{
  width:480px;
  border-bottom:dotted 1px #B8AD8D;
  }

/*-------- 99  Dock_Area --------*/

.dock_connect{
	color: #e67;
	text-align: center;
	font-weight: bold;
	margin: 15px 0 0;
	padding: 0;
}

#dock2 {
   height:140px;
   }
#dock_area{
    background: url(../images/dock_bg.jpg) center center no-repeat;
  }
#dock_area .dock-container2 {
   height: 140px;
}