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

/*=======================TOC=======================*/
/*                                                 */
/*                 01  Base                        */
/*                 02  Container                   */
/*                 03  Header                      */
/*                 04  Navigation                  */
/*                 05  Footer                      */
/*                 06  Contents                    */
/*                 07  Index                       */
/*                 08  Guide                       */
/*                 09  Implant                     */
/*                 10  Type                        */
/*                 11  Flow                        */
/*                 12  Aftercare                   */
/*                 13  Cost                        */
/*                 14  Case                        */
/*                 15  Question                    */
/*                 16  Clinic                      */
/*                                                 */
/*=======================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; }
body#index { background: url(../images/index_body_bg.jpg) top repeat-x; }

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

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

#content {
    width: 570px;
    float: right;
    font-size: 100%;
    line-height: 1.6;
    color: #666;
    padding:70px 0 20px 0;
    margin-right:15px;
    }
* html #content {
    margin-right:10px;
    }


/*---------- 03  Header -----------*/
#header {
    background: url(../images/header_bg.jpg) 0 0 no-repeat;
    height: 190px;
    width: 810px;
    margin: 0;
    padding: 0;
	position: relative;
    }
	
#header h1 {
    position: absolute;
	top: 1px;
	left: 26px;
	font-size: 85%;
	color: #FFF;
	padding-top: 2px;
    }

#header p.logo {
    width: 450px;
    height: 59px;
    line-height: 1.0;
    float: left;
	margin: 0;
    }
#header p.logo a {
    display: block;
    width: 450px;
    height: 59px;
    }

#header .section {
    width: 200px;
    float: right;
    margin: 5px 24px 0 0;
    padding: 0;
    }
#header p.tel {
    margin: 0;
    padding: 0;
    height: 50px;
    text-indent: -9999px;
    background: url(../images/header_tel.jpg) 0 0 no-repeat;
    }
#header p.tel a {
    display: block; 
    margin: 0;
    padding: 0;
    height: 50px;
    width: 200px;
    }

#header p.tel a:hover {
    background: url(../images/header_tel.jpg) 0 -50px no-repeat;
    }


* html #header .section {
    margin: 5px 12px 0 0;
    }

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

#nav {
    width: 200px;
    float: left;
    padding: 0 0 20px 0;
    margin-left:5px;
    }
* html #nav {
    width: 199px;
    margin-left:3px;
    }

#nav .main_nav{
    background: url(../images/nav_bg.jpg) bottom no-repeat;
    padding:10px 0 10px 8px;
    }

#nav ul{
    width: 200px;
    margin: 0;
    padding: 3px 3px 3px 3px;
    }
* html #nav ul{
    padding: 3px 3px 3px 2px;
    }

#nav .internal {
    background:#94A9AA;
    width:180px;
    }

#nav li {
    width:174px;
    margin: 3px 3px 3px 3px;
    padding: 0;
    list-style: none;
    }
    
#nav .internal li {
    height: 38px;
    text-indent: -9999px;
    }

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

#nav01 a { background: url(../images/nav.jpg) 0 0 no-repeat; }
#nav02 a { background: url(../images/nav.jpg) 0 -41px no-repeat; }
#nav03 a { background: url(../images/nav.jpg) 0 -82px no-repeat; }
#nav04 a { background: url(../images/nav.jpg) 0 -123px no-repeat; }
#nav05 a { background: url(../images/nav.jpg) 0 -164px no-repeat; }
#nav06 a { background: url(../images/nav.jpg) 0 -205px no-repeat; }
#nav07 a { background: url(../images/nav.jpg) 0 -246px no-repeat; }
#nav08 a { background: url(../images/nav.jpg) 0 -287px no-repeat; }
#nav09 a { background: url(../images/nav.jpg) 0 -328px no-repeat; }
#nav10 a { background: url(../images/nav.jpg) 0 -369px no-repeat; }

#nav01 a:hover { background: url(../images/nav.jpg) -174px 0 no-repeat; }
#nav02 a:hover { background: url(../images/nav.jpg) -174px -41px no-repeat; }
#nav03 a:hover { background: url(../images/nav.jpg) -174px -82px no-repeat; }
#nav04 a:hover { background: url(../images/nav.jpg) -174px -123px no-repeat; }
#nav05 a:hover { background: url(../images/nav.jpg) -174px -164px no-repeat; }
#nav06 a:hover { background: url(../images/nav.jpg) -174px -205px no-repeat; }
#nav07 a:hover { background: url(../images/nav.jpg) -174px -246px no-repeat; }
#nav08 a:hover { background: url(../images/nav.jpg) -174px -287px no-repeat; }
#nav09 a:hover { background: url(../images/nav.jpg) -174px -328px no-repeat; }
#nav10 a:hover { background: url(../images/nav.jpg) -174px -369px no-repeat; }

#nav p { text-align: center; }

#nav .nav_banner {
    margin-top:10px;
    }

#nav .nav_banner p{
    margin-left:10px;
    }

#nav #ban01 {
    width:180px;
    height: 60px;
    clear:both;
    }

#nav #ban02 {
    width:180px;
    height: 65px;
    clear:both;
    }

#nav #ban03 {
    width:180px;
    height: 60px;
    clear:both;
    }

#nav #ban04 {
    width:180px;
    height: 60px;
    clear:both;
    }


#nav  .dental-info p{ 
color:#FFFFFF;
line-height:150%;
padding-top:5px;
}
.small { font-size:80%; }
.big { font-size:140%; font-weight:bold; }

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

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

#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; }

#footer .links{
    padding:15px 5px 0 0;
    }

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

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

p.center { text-align: center; }

#content h2 {
    height: 40px;
    text-indent: -9999px;
    margin-bottom:10px;
    }
#content h3 {
    clear: both;
    height: 30px;
    text-indent: -9999px;
    }
#content h4 {
    height: 25px;
    text-indent: -9999px;
    clear: both;
    }

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

#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;
    }

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

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

/* Hides from IE-mac \*/
.question dt: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 */

.img_border{
    border:solid 1px #8C8C8C;
    }

#header .catch{
    text-indent:-9999px;
    width:385px;
    height:30px;
    margin:70px 0 0 0;
    float:left;
    }

.reservation {
padding-top:10px;
    text-indent:0;
    width:558px;
    height: 78px;
    clear:both;
    }

table, th, td{
    border: 1px #8C8C8C solid;
    border-collapse: collapse; 
    text-align: left;
    font-size: 100%;
    }

th { background-color: #E2F2F0;}

.detail {
    text-indent: -9999px;
    }

.detail a {
    display: block;
    width: 100px;
    height: 25px;
    background: url(../images/detail.jpg) 0 0 no-repeat;
    }
		
.shoureiL {
width:230px;
height:160px;
float:left;
    border:solid 1px #8C8C8C;
		margin-left:25px;
		display:inline;
}
.shoureiR {
width:230px;
height:160px;
float:right;
    border:solid 1px #8C8C8C;
		margin-right:25px;
		display:inline;
}    
/*-------- 07  Index --------*/
#index #header {
    background: url(../images/index_header_bg.jpg) 0 0 no-repeat;
    height: 320px;
    width: 810px;
    margin: 0;
    padding: 0;
	position:relative;
    }

#index h2#title01 {
    height:30px;
    margin:10px 0;
	text-indent: 0;
    }

#index .guide_link {
    text-indent:0;
    width:570px;
    height: 100px;
    clear:both;
    }

#index .greeting{
    padding:0 8px 0 8px;
    margin-bottom:20px;
    }
	
	
#index .pkup{ 
    width:558px;
    margin-bottom:15px;
    }

#index .pkup #titlePk {
	float:right;
	width:170px;
    height:37px;
	text-indent: 0;
	margin: 0;
    }

#index .pkup p.txtPk{ 
    width:160px;
    float:right;
    font-size:85%;
    line-height:1.3;
    margin:0 10px 0 0;
    }
	
#index .pkup a{ 
    color: #666;
    text-decoration: none;
    }
#index .pkup a:hover{ 
    text-decoration: underline;
    }
	
#index .pk01{
    float:left;
    width:274px;
    height:104px;
    background: url(../images/pk01_bg.jpg) 0 0 no-repeat;
    }
#index .pk02{
    float:right;
    width:274px;
    height:104px;
    background: url(../images/pk02_bg.jpg) 0 0 no-repeat;
    }
#index .pk03{
    float:left;
    width:274px;
    height:104px;
    background: url(../images/pk03_bg.jpg) 0 0 no-repeat;
    }
#index .pk04{
    float:right;
    width:274px;
    height:104px;
    background: url(../images/pk04_bg.jpg) 0 0 no-repeat;
    }


/*-------- 08  Guide --------*/
#guide .catch{ background: url(../images/guide_catch.jpg) 0 0 no-repeat; }
#guide h2#title01 { background: url(../images/guide_h2-01.jpg) 0 0 no-repeat; }
#guide h3#title02 { background: url(../images/guide_h3-02.jpg) 0 0 no-repeat; margin-bottom: 5px;}
#guide h4#title03 { background: url(../images/guide_h4-03.jpg) 0 0 no-repeat; }
#guide h4#title04 { background: url(../images/guide_h4-04.jpg) 0 0 no-repeat; }
#guide h4#title05 { background: url(../images/guide_h4-05.jpg) 0 0 no-repeat; }
#guide h4#title06 { background: url(../images/guide_h4-06.jpg) 0 0 no-repeat; }
#guide h4#title07 { background: url(../images/guide_h4-07.jpg) 0 0 no-repeat; }
#guide h3#title08 { background: url(../images/guide_h3-08.jpg) 0 0 no-repeat; }
#guide h3#title09 { background: url(../images/guide_h3-09.jpg) 0 0 no-repeat; }
#guide h3#title10 { background: url(../images/guide_h3-10.jpg) 0 0 no-repeat; margin-top: 10px;}
#guide h4#title11 { background: url(../images/guide_h4-11.jpg) 0 0 no-repeat; }
#guide h4#title12 { background: url(../images/guide_h4-12.jpg) 0 0 no-repeat; }
#guide h4#title13 { background: url(../images/guide_h4-13.jpg) 0 0 no-repeat; }
#guide h4#title14 { background: url(../images/guide_h4-14.jpg) 0 0 no-repeat; }
#guide h4#title15 { background: url(../images/guide_h4-15.jpg) 0 0 no-repeat; }
#guide h4#title16 { background: url(../images/guide_h4-16.jpg) 0 0 no-repeat; }
#guide h4#title17 { background: url(../images/guide_h4-17.jpg) 0 0 no-repeat; }
#guide h4#title18 { background: url(../images/guide_h4-18.jpg) 0 0 no-repeat; }
#guide h4#title19 { background: url(../images/guide_h4-19.jpg) 0 0 no-repeat; }
#guide h4#title20 { background: url(../images/guide_h4-20.jpg) 0 0 no-repeat; }
#guide h4#title21 { background: url(../images/guide_h4-21.jpg) 0 0 no-repeat; }



#guide .dr .image_l {
    margin-right: 5px;
    margin-left: 5px;
    }

#guide .dr #dr_profile {
    width: 270px;
    margin-left: 5px;
    }
    
#guide .dr dt {
    float: left;
    }
    
#guide .dr dd {
    padding-left: 60px;
    text-align: left;
    }

#guide .caption {
    text-align: center;
    }

#guide .staffphoto {   
    background: url(../images/arrow.gif) center center no-repeat;   
    padding: 0 30px;   
    }  

/*-------- 09  Implant --------*/
#implant .catch{ background: url(../images/implant_catch.jpg) 0 0 no-repeat; }
#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 h3#title03 { background: url(../images/implant_h3-03.jpg) 0 0 no-repeat; margin-bottom:5px;}
#implant h4#title04 { background: url(../images/implant_h4-04.jpg) 0 0 no-repeat; }
#implant h4#title05 { background: url(../images/implant_h4-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 h3#title08 { background: url(../images/implant_h3-08.jpg) 0 0 no-repeat; }


/*-------- 10  Type --------*/
#type .catch{ background: url(../images/type_catch.jpg) 0 0 no-repeat; }
#type h2#title01 { background: url(../images/type_h2-01.jpg) 0 0 no-repeat; }
#type h3#title02 { background: url(../images/type_h3-02.jpg) 0 0 no-repeat; }
#type h4#title03 { background: url(../images/type_h4-03.jpg) 0 0 no-repeat; }
#type h4#title04 { background: url(../images/type_h4-04.jpg) 0 0 no-repeat; }


/*-------- 11  Flow --------*/
#flow .catch{ background: url(../images/flow_catch.jpg) 0 0 no-repeat; }
#flow h2#title01 { background: url(../images/flow_h2-01.jpg) 0 0 no-repeat; }
#flow h3#title02 { background: url(../images/flow_h3-02.jpg) 0 0 no-repeat; margin-bottom: 5px;}
#flow h4#title03 { background: url(../images/flow_h4-03.jpg) 0 0 no-repeat; }
#flow h4#title04 { background: url(../images/flow_h4-04.jpg) 0 0 no-repeat; }
#flow h4#title05 { background: url(../images/flow_h4-05.jpg) 0 0 no-repeat; }

/*-------- 12  Aftercare --------*/
#aftercare .catch{ background: url(../images/aftercare_catch.jpg) 0 0 no-repeat; }
#aftercare h2#title01 { background: url(../images/aftercare_h2-01.jpg) 0 0 no-repeat; }
#aftercare h3#title02 { background: url(../images/aftercare_h3-02.jpg) 0 0 no-repeat; }
#aftercare h3#title03 { background: url(../images/aftercare_h3-03.jpg) 0 0 no-repeat; }
#aftercare h4#title04 { background: url(../images/aftercare_h4-04.jpg) 0 0 no-repeat; }
#aftercare h4#title05 { background: url(../images/aftercare_h4-05.jpg) 0 0 no-repeat; }
#aftercare h4#title06 { background: url(../images/aftercare_h4-06.jpg) 0 0 no-repeat; }


/*-------- 13  Cost --------*/
#cost .catch{ background: url(../images/cost_catch.jpg) 0 0 no-repeat; }
#cost h2#title01 { background: url(../images/cost_h2-01.jpg) 0 0 no-repeat; }
#cost h3#title02 { background: url(../images/cost_h3-02.jpg) 0 0 no-repeat; margin-bottom: 5px;}

#cost .section table {
    width: 520px;
    margin-left: 20px;
    }    

#cost .section table td {
    width: 160px;
    text-align: right;
    }

#cost .section .section p{
    padding-left: 25px;
    margin-top: 0px;
    }	

/*-------- 14  Case --------*/
#case .catch{ background: url(../images/case_catch.jpg) 0 0 no-repeat; }
#case h2#title01 { background: url(../images/case_h2-01.jpg) 0 0 no-repeat; }
#case h3#title02 { background: url(../images/case_h3-02.jpg) 0 0 no-repeat; }

#case div.alpha,
#case div.beta,
#case div.gamma {
    text-align: center;
    padding-right: 33px;
    background: url(../images/arrow.jpg) right center no-repeat;
    float: left;
    }

#case div.alpha {
    margin-left: 5px;
    }

#case div.gamma {
    background: none;
    padding-right: 0;
    margin-right: 6px;
    }

#case .section .section {
    margin-bottom: 10px;
    }

/*-------- 15  Question --------*/
#question .catch{ background: url(../images/question_catch.jpg) 0 0 no-repeat; }
#question h2#title01 { background: url(../images/question_h2-01.jpg) 0 0 no-repeat; }
#question h3#title02 { background: url(../images/question_h3-02.jpg) 0 0 no-repeat; }

#question .section dl{
    margin-left: 1em;
    }

#question .section dt {
    border-bottom: 1px #4499AF dotted;
    padding-bottom: 5px;
    line-height: 20px;
    }

#question .section dd{
    margin-top: 5px;
    }

#question #qa_text {
    padding-top: 30px;
    }

/*-------- 16  Clinic --------*/
#clinic .catch{ background: url(../images/clinic_catch.jpg) 0 0 no-repeat; }
#clinic h2#title01 { background: url(../images/clinic_h2-01.jpg) 0 0 no-repeat; }
#clinic h3#title02 { background: url(../images/clinic_h3-02.jpg) 0 0 no-repeat; margin-bottom: 5px;}

#clinic h3#title10 { background: url(../images/guide_h3-10.jpg) 0 0 no-repeat; margin-top: 10px;}
#clinic h4#title11 { background: url(../images/guide_h4-11.jpg) 0 0 no-repeat; }
#clinic h4#title12 { background: url(../images/guide_h4-12.jpg) 0 0 no-repeat; }
#clinic h4#title13 { background: url(../images/guide_h4-13.jpg) 0 0 no-repeat; }
#clinic h4#title14 { background: url(../images/guide_h4-14.jpg) 0 0 no-repeat; }
#clinic h4#title15 { background: url(../images/guide_h4-15.jpg) 0 0 no-repeat; }
#clinic h4#title16 { background: url(../images/guide_h4-16.jpg) 0 0 no-repeat; }
#clinic h4#title17 { background: url(../images/guide_h4-17.jpg) 0 0 no-repeat; }
#clinic h4#title18 { background: url(../images/guide_h4-18.jpg) 0 0 no-repeat; }
#clinic h4#title19 { background: url(../images/guide_h4-19.jpg) 0 0 no-repeat; }
#clinic h4#title20 { background: url(../images/guide_h4-20.jpg) 0 0 no-repeat; }
#clinic h4#title21 { background: url(../images/guide_h4-21.jpg) 0 0 no-repeat; }

#clinic .section .section .image_l {
    width: 240px;
    text-align: center;
    }

#clinic .section .section .image_r {
    width: 281px;
    margin-left: 5px;
    padding-top: 7px;
    }



#clinic .info {
    margin: 0 auto;
    width: 520px;
    }

#clinic .info table{
    width: 520px;
    margin: 0 5px;
    }

#clinic .info table th{
    width: 100px;
    text-align: center;
    }

#clinic .info table td p.detail {
    float: right;
    margin-top: 10px;
    }

#clinic #map {
    width: 420px;
    height: 350px;
    }