@charset "utf-8";

/*========================================================================================================================


  ◇◆◇ 小児歯科 ◇◆◇
  
  
========================================================================================================================*/

/*----------------------------------------------------------------------------------------------------

  小児歯科について
  
----------------------------------------------------------------------------------------------------*/

#about p {
  text-align:left;
}

@media print,screen and (min-width:641px) {
  #about {
    width:1200px;
    margin-left:auto;
    margin-right:auto;
    padding-top:80px;
  }
  
  #about p {
    display:inline-block;
    padding-top:50px;
  }
}

@media screen and (max-width:640px) {
  #about {
    padding:2.5rem 1.5rem 0 1.5rem;
  }
  
  #about p { padding-top:2rem; }
}


/*----------------------------------------------------------------------------------------------------

  定期検診の流れ
  
----------------------------------------------------------------------------------------------------*/

.teiki_flow {
  counter-reset:s-number;
}

.flowBox {
  background-color:#fff;
  box-sizing:border-box;
  text-align:left;
  counter-increment:s-number;
}

.flowBox h4 {
  position:relative;
}

.flowBox h4:before {
  content:counter(s-number);
  font-family:"Noto Serif JP", "Hiragino Mincho ProN", 游明朝, "Yu Mincho", YuMincho,sans-serif;
  font-weight:300;
  font-style:normal;
  text-align:center;
  display:inline-block;
  position:absolute;
  left:0;
  top:0.2rem;
  background-color:#61c5b4;
  color:#fff;
  line-height:1;
  padding:0.5rem;
  box-sizing:border-box;
  z-index:2;
}

@media print,screen and (min-width:641px) {
  #teiki {
    width:1200px;
    margin-left:auto;
    margin-right:auto;
    padding-top:100px;
    padding-bottom:100px;
  }
  
  .teiki_flow { padding-top:20px; }
  
  .flowBox {
    margin-top:40px;
    padding:40px;
  }
  
  .flowBox h4:before { width:2.25rem; }
  .flowBox h4 { margin-top:10px; margin-left:10px; }
  .flowBox h4,
  .flowBox .txt { padding-left:3.5rem; }
  
  .flowBox .photo {
    display:inline-block;
    width:300px;
    float:right;
    margin-top:-2.5rem;
  }
  
  .flowBox .txt {
    margin-right:360px;
    margin-left:10px;
    padding-bottom:10px;
    padding-top:1rem;
  }
}

@media screen and (max-width:640px) {
  #teiki {
    padding:2.5rem 1.5rem 3rem 1.5rem;
  }
  
  .flowBox {
    margin-top:2rem;
    padding:2.25rem 1.75rem 2rem 1.75rem;
  }
  
  .flowBox h4:before { width:2rem; }
  .flowBox h4 { padding-left:3rem; padding-bottom:1.5rem; }
  
  .flowBox .photo {
    display:block;
    text-align:center;
    padding-top:0.25rem;
    margin-bottom:1.5rem;
  }
  
  .flowBox .photo img {
    max-width:300px;
  }
}


/*----------------------------------------------------------------------------------------------------

  発達不全
  
----------------------------------------------------------------------------------------------------*/

.hattatsu_body {
  background-color:#fff;
  box-sizing:border-box;
  text-align:left;
}

.hattatsu__eikyou .photo { overflow:hidden; position:relative; }
.hattatsu__eikyou .photo img {
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
}
  

.hattatsu__eikyou ul {
  list-style:none;
}

.hattatsu__eikyou li {
  box-sizing:border-box;
  padding-top:0.5rem;
}

.hattatsu__eikyou li span {
  display:block;
  background-color:#e2f4f2;
  padding:0.75rem 1rem;
  line-height:1.4;
}

.hattatsu__eikyou li span:before {
  content:"";
  width:1.2em;
  height:1.2em;
  display:inline-block;
  background-image:url(../../../image/icon/checkbox.svg);
  background-repeat:no-repeat;
  background-position:left center;
  background-size:contain;
  vertical-align:top;
  margin-right:0.75rem;
}

.no-svg .hattatsu__eikyou li span:before {
  background-image:url(../../../image/icon/checkbox.png);
}

@media print,screen and (min-width:641px) {
  #hattatsu {
    width:1200px;
    margin-left:auto;
    margin-right:auto;
    padding-bottom:100px;
  }
  
  .hattatsu_hdLine {
    margin-top:50px;
    padding-bottom:50px;
    font-size:150%;
  }
  
  .hattatsu_body { padding:60px; }
  
  .hattatsu__eikyou { padding-bottom:50px; }
  
  .hattatsu__eikyou .photo {
    display:inline-block;
    width:300px;
    height:278px;
    float:left;
  }
  
  .hattatsu__eikyou .txt {
    margin-left:360px;
    padding-top:1rem;
  }
  
  .hattatsu__eikyou ul {
    display:inline-block;
    padding-top:0.5rem;
    padding-bottom:0.5rem;
  }
  
  .hattatsu__eikyou li {
    width:50%;
    float:left;
  }

  .hattatsu__eikyou li:nth-child(even) {
    padding-left:0.5rem;
  }
}

@media screen and (max-width:640px) {
  #hattatsu {
    padding:0 1.5rem 3rem 1.5rem;
  }
  
  .hattatsu_hdLine {
    margin-top:1.75rem;
    padding-bottom:1.75rem;
    font-size:118.8%;
  }
  
  .hattatsu_body { padding:1.75rem; }
  
  .hattatsu__eikyou { padding-bottom:1.5rem; }
  
  .hattatsu__eikyou .photo {
    display:block;
    height:240px;
    text-align:center;
    padding-top:0.25rem;
    margin-bottom:1.5rem;
  }
  
  .hattatsu__eikyou .photo img {
    max-width:400px;
  }
  
  .hattatsu__eikyou ul {
    padding-top:0.25rem;
    padding-bottom:0.75rem;
  }
}