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

/*=======================TOC=======================*/
/*                                                 */
/*                 01  Base                        */
/*                 02  Container                   */
/*                 03  Header                      */
/*                 04  Navigation                  */
/*                 05  Footer                      */
/*                 06  Contents                    */
/*                 07  Index                       */
/*                 08  Concept                     */
/*                 09  Staff                       */
/*                 10  Clinic                      */
/*                 11  Recruit                     */
/*                 12  Perio                       */
/*                 13  Prevent                     */
/*                 14  Laser                       */
/*                 15  Child                       */
/*                 16  Ortho                       */
/*                 17  Aesthe                      */
/*                 18  Implant                     */
/*                 19  Sitemap                     */
/*                                                 */
/*=======================TOC-END===================*/

/*====================COLOR SCHEME=================*/
/*                                                 */
/*        Main Color - Pink           #de91a2      */
/*        Main Color - Light Pink     #fce6e6      */
/*        Main Color - Fresh Pink     #f94956      */
/*                                                 */
/*        Sub Color  - Yellow Green   #7ac300      */
/*                                                 */
/*==================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;
  }

#body02 { 
  background: url(../images/body_bg02.jpg) bottom repeat-x;
  }

#wrapper {
  width: 960px;
  margin: 0 auto;
  padding: 0;
  text-align: left;
  }

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

#content {
  width: 600px;
  float: right;
  font-size: 108%;
  line-height: 1.6;
  color: #666;
  padding: 20px 0 0 0;
  }


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

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

#header p.tel {
  float: right;
  margin: 0;
  padding: 0;
  }
#header p.tel img { display: block; }

#header .section01 {
  height: 72px;
  margin: 0;
  padding: 0;
  }

#header .section02 {
  height: 206px;
  margin: 0;
  padding: 0;
  }

#header .section02 p {
  margin: 0;
  padding: 0;
  }

/*---------- Main -----------*/

#top_nav {
  margin: 0;
  padding: 0;
  height: 60px;
  background: url(../images/top_nav.jpg) 0 0 no-repeat;
  }

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

#top_nav li {
  float: left;
  text-indent: -9999px;
  list-style: none;
  margin: 0;
  padding: 0;
  height: 60px;
  width: 160px;
  }
#top_nav li a {
  display: block;
  height: 60px;
  width: 160px;
  }

#nav01 a { background: url(../images/top_nav.jpg) 0 0 no-repeat; }
#nav02 a { background: url(../images/top_nav.jpg) -160px 0 no-repeat; }
#nav03 a { background: url(../images/top_nav.jpg) -320px 0 no-repeat; }
#nav04 a { background: url(../images/top_nav.jpg) -480px 0 no-repeat; }
#nav05 a { background: url(../images/top_nav.jpg) -640px 0 no-repeat; }

#nav01 a:hover { background: url(../images/top_nav.jpg) 0 -60px no-repeat; }
#nav02 a:hover { background: url(../images/top_nav.jpg) -160px -60px no-repeat; }
#nav03 a:hover { background: url(../images/top_nav.jpg) -320px -60px no-repeat; }
#nav04 a:hover { background: url(../images/top_nav.jpg) -480px -60px no-repeat; }
#nav05 a:hover { background: url(../images/top_nav.jpg) -640px -60px no-repeat; }

#main02 {
  clear: both;
  margin: 0;
  padding: 0 0 0 5px;
  }


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

#nav {
  width: 190px;
  float: left;
  padding: 0 0 20px 0;
  }

#nav  dl.internal {
  clear: both;
  margin: 0 0 10px 0;
  padding: 0;
  text-indent: -9999px;
  width: 190px;
  }

#nav .internal dt,
#nav .internal dd {
  margin: 0;
  padding: 0;
  text-indent: -9999px;
  width: 190px;
  }

#nav .internal dt {
  height: 35px;
  }

#nav .internal dd {
  height: 30px;
  }

#nav .internal dd a {
  display: block;
  height: 30px;
  }

#nav .internal #nav06 { 
  background: url(../images/nav.png) 0 0 no-repeat;
  height: 40px;
  }
#nav07 a { background: url(../images/nav.png) 0 -40px no-repeat; }
#nav08 a { background: url(../images/nav.png) 0 -70px no-repeat; }
#nav09 a { background: url(../images/nav.png) 0 -100px no-repeat; }
#nav10 { background: url(../images/nav.png) 0 -130px no-repeat; }
#nav11 a { background: url(../images/nav.png) 0 -165px no-repeat; }
#nav12 a { background: url(../images/nav.png) 0 -195px no-repeat; }
#nav13 a { background: url(../images/nav.png) 0 -225px no-repeat; }
#nav14 a { background: url(../images/nav.png) 0 -255px no-repeat; }
#nav15 a { background: url(../images/nav.png) 0 -285px no-repeat; }
#nav16 { background: url(../images/nav.png) 0 -315px no-repeat; }
#nav17 a { background: url(../images/nav.png) 0 -350px no-repeat; }
#nav18 a { background: url(../images/nav.png) 0 -380px no-repeat; }
#nav19 a { background: url(../images/nav.png) 0 -410px no-repeat; }
#nav .internal #nav20 a { 
  background: url(../images/nav.png) 0 -440px no-repeat;
  height: 35px;
  }

#nav07 a:hover { background: url(../images/nav.png) -190px -40px no-repeat; }
#nav08 a:hover { background: url(../images/nav.png) -190px -70px no-repeat; }
#nav09 a:hover { background: url(../images/nav.png) -190px -100px no-repeat; }
#nav11 a:hover { background: url(../images/nav.png) -190px -165px no-repeat; }
#nav12 a:hover { background: url(../images/nav.png) -190px -195px no-repeat; }
#nav13 a:hover { background: url(../images/nav.png) -190px -225px no-repeat; }
#nav14 a:hover { background: url(../images/nav.png) -190px -255px no-repeat; }
#nav15 a:hover { background: url(../images/nav.png) -190px -285px no-repeat; }
#nav17 a:hover { background: url(../images/nav.png) -190px -350px no-repeat; }
#nav18 a:hover { background: url(../images/nav.png) -190px -380px no-repeat; }
#nav19 a:hover { background: url(../images/nav.png) -190px -410px no-repeat; }
#nav .internal #nav20 a:hover { background: url(../images/nav.png) -190px -440px no-repeat; }


#nav p { 
  text-align: center;
  margin: 5px 0 ;
  padding: 0;
  }


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

#footer {
  clear: both;
  padding: 0 80px 0 0;
  margin: 0;
  font-size: 85%;
  text-align: right;
  color: #8B5C29;
  }
*:first-child+html #footer { font-size: 9px; } /*  for IE7 only */
* html body #footer { font-size: 9px; } /*  for IE6 only */

#footer .alpha {
  float: left;
  width: 340px;
  }

#footer .alpha p {
  margin: 0;
  padding: 0;
  }
#footer .alpha img {
  display: block;
  }

#footer .beta {
  float: right;
  width: 500px;
  margin: 35px 0 0 0;
  padding: 0;
  }

#footer .totop {
  float: right;
  margin: 0;
  padding: 0;
  }


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

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

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

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


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

#content .section { padding: 1em 20px 0 20px; }
#content .section .section { padding: 1em 10px 0 10px; }

#content .section02 {
  clear: both;
  border:1px solid #558556;
  margin-top: 10px;
  }

.center { text-align: center; }

#content h2 {
  height: 40px;
  text-indent: -9999px;
  margin: 0 15px;
  }
#content h3 {
  clear: both;
  height: 32px;
  text-indent: -9999px;
  }
#content h4 {
  height: 17px;
  text-indent: -9999px;
  }

#content h5 {
  font-size: 100%;
  font-weight: bold;
  margin: .5em 0 .3em 0;
  padding: .3em .4em .2em;
  background : #558556;
  color: #fff;
  height: 15px;
  }

#content .section02 h5 {
  margin: .3em;
  }

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

#content dl {
  margin: 5px 10px;
  }

#content dt { 
  font-weight: bold;
  color: #558556;
  }

#content dl ul {
  margin: 5px 0;
  }

#content a { 
  text-decoration: underline;
  color: #FF7D50;
  }

#content a:hover {
  color: #FFB000;
  }

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

.image_l  {
  float: left;
  margin: 6px 12px 6px 0;
  }

.image_r {
  float: right;
  margin: 6px 0 6px 12px;
  }

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

.case-narrow {
  margin: 10px 40px;
  background: url(../images/arrow_h.png) center center no-repeat;
  }

.case-noimg { margin: 10px 20px; }

.case img,
.case-narrow img,
.case-noimg img { display: block; }

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

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

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

p.caution {
  padding-left: 24px;
  background: url(../images/caution.png) 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 table {
  border: 1px solid #558556;
  font-size: 100%;
  color: #666;
  width: 540px;
  margin-top: 10px;
  }

#content table th,
#content table td {
  padding: 4px 8px;
  border: 1px solid #558556;
  }

#content table th {
  background: #DFF4DF;
  color: #558556;
  }

input.submit {
  font-weight: bold;
  margin-right: 1.5em;
  }

.induction {
  margin-left: 20px;
  }

.flow {
  background: url(../images/arrow_d.png) center bottom no-repeat;
  padding-bottom: 45px;
  }

.flow dl {
  clear: both;
  margin: 5px 40px 5px 10px;
  padding: .3em;
  border: 1px solid #558556; 
  }

.flow dt {
  background: #FFF6AF;
  padding-left: .5em;
  }

.flow dd {
  margin: .3em;
  }

#end {
  background-image: none;
  padding-bottom: 0;
  }

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

#index #header {
  background: url(../images/index_header_bg.jpg) 0 0 no-repeat;
  height: 478px;
  margin: 0;
  padding: 0;
  }

#index h2#title01 { background: url(../images/index_h2-01.png) 0 0 no-repeat; } 
#index h3#title02 { background: url(../images/index_h3-02.png) 0 0 no-repeat; } 
#index h4#title03 { background: url(../images/index_h4-03.png) 0 0 no-repeat; }  
#index h3#title04 { background: url(../images/index_h3-04.png) 0 0 no-repeat; } 

#pickup {
  height: 240px;
  margin: 0;
  padding: 0;
  }

#content #pickup ul,
#content #pickup li {
list-style: none;
  text-indent: -9999px;
  margin: 0;
  padding: 0;
  }

#content #pickup li {
  float: left;
height: 240px;
  width: 190px;
  background-image: none;
  }
#content #pickup li#pick02 {
  width: 180px;
  }

#content #pickup li a {
  height: 240px;
  display: block;
  margin: 0;
  padding: 0;
  }

#content #pick01 a{ 
  background: url(../images/pick01.jpg) 0 0 no-repeat;
  width: 190px;
  }

#content #pick02 a{ 
  background: url(../images/pick02.jpg) 0 0 no-repeat;
  width: 180px;
  }

#content #pick03 a{ 
  background: url(../images/pick03.jpg) 0 0 no-repeat;
  width: 190px;
  }

.schedule {
  clear: both;
  padding: 1em 20px 0 15px; }

.schedule h3 {
  margin-left: 5px;
  }

.schedule h4 {
  margin-left: 5px;
  }

.schedule p {
  margin: 0;
  padding: 0;
  }

#index_greeting {
  background: url(../images/index_greeting_bg.png) right bottom no-repeat;
  }

/*---------- Greeting -----------*/
#greeting h2#title01 { background: url(../images/greeting_h2-01.png) 0 0 no-repeat; } 


/*---------- 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 h4#title03 { background: url(../images/clinic_h4-03.png) 0 0 no-repeat; } 
#clinic h4#title04 { background: url(../images/clinic_h4-04.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 .photo {
  clear: both;
  }

#clinic .photo .alpha {
  float: left;
  width: 330px;
  }

#clinic .photo .beta {
  float: right;
  width: 200px;
  }

/*---------- 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 h4#title03 { background: url(../images/access_h4-03.png) 0 0 no-repeat; } 
#access h4#title04 { background: url(../images/access_h4-04.png) 0 0 no-repeat; } 

#access .info .alpha {
  float: left;
  width: 200px;
  }
#access .info .beta {
  float: right;
  width: 330px;
  }

#map {
  width: 370px;
  height: 340px;
  }

/*---------- General -----------*/
#general h2#title01 { background: url(../images/general_h2-01.png) 0 0 no-repeat; } 
#general h3#title02 { background: url(../images/general_h3-02.png) 0 0 no-repeat; } 
#general h4#title03 { background: url(../images/general_h4-03.png) 0 0 no-repeat; } 
#general h4#title04 { background: url(../images/general_h4-04.png) 0 0 no-repeat; } 
#general h4#title05 { background: url(../images/general_h4-05.png) 0 0 no-repeat; } 
#general h4#title06 { background: url(../images/general_h4-06.png) 0 0 no-repeat; } 
#general h4#title07 { background: url(../images/general_h4-07.png) 0 0 no-repeat; } 

#general .caries {
  clear: both;
  margin: 5px 40px 10px 10px;
  padding: .3em;
  border: 1px solid #558556; 
  }

#general .caries h5 {
  margin :0;
  }

#general .caries .alpha {
   float: left;
   width: 110px;
   margin: 0;
   padding: 0;
   }

#general .caries .beta {
   float: right;
   width: 300px;
   margin: 0;
   padding: 0;
   }

#general .caries .beta dl {
  margin: 5px 0 0 0;
  padding: 0;
  }

/*---------- 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 h4#title03 { background: url(../images/prevent_h4-03.png) 0 0 no-repeat; } 
#prevent h4#title04 { background: url(../images/prevent_h4-04.png) 0 0 no-repeat; } 
#prevent h4#title05 { background: url(../images/prevent_h4-05.png) 0 0 no-repeat; } 

/*---------- 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; } 
#denture h4#title04 { background: url(../images/denture_h4-04.png) 0 0 no-repeat; } 
#denture h4#title05 { background: url(../images/denture_h4-05.png) 0 0 no-repeat; } 
#denture h4#title06 { background: url(../images/denture_h4-06.png) 0 0 no-repeat; } 


/*---------- 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 #type {
  background: url(../images/type_bg.jpg) right repeat-y;
  }

#aesthe #type .alpha {
  float: left;
  width: 380px;
  border: 1px dotted #FFD0B0;
  margin-bottom: 10px;
  padding: 0 5px;
  }

#aesthe #type h5 {
  background: #FFF6AF;
  color: #558556;
  }

#aesthe .treatment {
  background: url(../images/dl_bg.png) top no-repeat;
  margin: 0;
  padding: 0;
  }

#aesthe .treatment dt{
  margin: 0;
  padding: .5em;
  color: #FF7A47;
  }

/*---------- 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 h4#title03 { background: url(../images/implant_h4-03.png) 0 0 no-repeat; } 
#implant h4#title04 { background: url(../images/implant_h4-04.png) 0 0 no-repeat; } 

/*---------- Gnathology -----------*/
#gnathology h2#title01 { background: url(../images/gnathology_h2-01.png) 0 0 no-repeat; } 
#gnathology h3#title02 { background: url(../images/gnathology_h3-02.png) 0 0 no-repeat; } 

/*---------- Occulusion -----------*/
#occlusion h2#title01 { background: url(../images/occlusion_h2-01.png) 0 0 no-repeat; } 
#occlusion h3#title02 { background: url(../images/occlusion_h3-02.png) 0 0 no-repeat; } 
#occlusion h4#title03 { background: url(../images/occlusion_h4-03.png) 0 0 no-repeat; } 
#occlusion h4#title04 { background: url(../images/occlusion_h4-04.png) 0 0 no-repeat; } 

/*---------- Malocclusion -----------*/
#malocclusion h2#title01 { background: url(../images/malocclusion_h2-01.png) 0 0 no-repeat; } 
#malocclusion h3#title02 { background: url(../images/malocclusion_h3-02.png) 0 0 no-repeat; } 
#malocclusion h4#title03 { background: url(../images/malocclusion_h4-03.png) 0 0 no-repeat; } 
#malocclusion h4#title04 { background: url(../images/malocclusion_h4-04.png) 0 0 no-repeat; } 
#malocclusion h4#title05 { background: url(../images/malocclusion_h4-05.png) 0 0 no-repeat; } 
#malocclusion h4#title06 { background: url(../images/malocclusion_h4-06.png) 0 0 no-repeat; } 
#malocclusion h4#title07 { background: url(../images/malocclusion_h4-07.png) 0 0 no-repeat; } 

/*---------- Achievement -----------*/
#achievement h2#title01 { background: url(../images/achievement_h2-01.png) 0 0 no-repeat; } 
#achievement h3#title02 { background: url(../images/achievement_h3-02.png) 0 0 no-repeat; } 

/*---------- Inquiry -----------*/
#inquiry h2#title01 { background: url(../images/inquiry_h2-01.png) 0 0 no-repeat; } 
#inquiry h3#title02 { background: url(../images/inquiry_h3-02.png) 0 0 no-repeat; } 

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