@charset "utf-8";

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


  ◇◆◇ ホワイトニング ◇◆◇
  
  
========================================================================================================================*/

.about_lead {
  background: url("../image/lead_bg.jpg") no-repeat right top;
  background-size: cover;
  position: relative;
}
.about_lead:before {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  background: url("../image/lead_new.png") no-repeat left center;
  position: absolute;
  left: 0;
  top: 0;
}
.about_lead p {
  display: none;
}
@media print,screen and (min-width:641px) {
  #about {
    width: 1200px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 80px;
  }
  .about_lead {
    height: 400px;
    margin-bottom: 60px;
  }
}
@media screen and (max-width:640px) {  
  #about {
    padding-top: 2.5rem;
    text-align: left;
  }
  .about_lead {
    padding-top: 45%;
    margin-bottom: 3rem;
  }
  .about_lead:before {
    background-position: -15%;
    background-size: contain;
  }
  .about_txt {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
}

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

  ホワイトニングメニュー
  
----------------------------------------------------------------------------------------------------*/
#course .l-hdLine span {
  padding-bottom: 0;
}
#course .l-hdLine span:after {
  display: none;
}
@media print, screen and (min-width:641px) {
  #course {
    width: 1200px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 100px;
    padding-bottom: 100px;
  }
  .course_info {
    padding-top: 40px;
  }
  .course_block {
    padding-top: 40px;
  }
}
@media screen and (max-width:640px) {
  #course {
    padding: 3rem 1.5rem;
  }
  .course_info {
    padding-top: 1.5rem;
  }
  .course_block {
    padding-top: 2rem;
  }
}

.courseTbl-scr {
  overflow-x:auto;
}
.courseTbl-scr .scroll-hint-icon {
  transform: translateX(50%);
}
.courseTbl {
  width: 100%;
  border-collapse: separate;
  border: 0;
}
.courseTbl-scr .courseTbl thead th:first-child,
.courseTbl-scr .courseTbl tbody th {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  left: 0;
}
.courseTbl th,
.courseTbl td {
  line-height: 1.4;
  text-align: center;
  vertical-align: middle;
}
.courseTbl-scr .courseTbl thead th,
.courseTbl-scr .courseTbl tbody th {
  white-space: nowrap;
}
.courseTbl thead th {
  font-weight: inherit;
  padding: 1rem;
}
.courseTbl thead tr:first-child th:not(:first-child),
.courseTbl thead tr:not(:first-child) th:not(:first-child) {
  min-width: 200px;
}
.courseTbl thead tr:first-child th:not(:first-child):not(:last-child),
.courseTbl thead tr:not(:first-child) th:not(:first-child) {
  border-right: 1px solid #F0F8F8;
}
.courseTbl thead tr:not(:first-child) th:not(:first-child):not(:last-child) {
  border-right: 1px solid rgba(0,0,0,0.1);
}
.courseTbl thead th:first-child {
  background-color: #F0F8F8;
}
.courseTbl thead th.gp1,
.courseTbl thead th.gp2 {
  font-weight: 400;
  color: #FFF;
}
.courseTbl thead th.gp1 { background-color: #79B6E2; }
.courseTbl thead th.gp2 { background-color: #FBB19B; }
.courseTbl thead th.gp1_2 { background-color: #D4EAF9; }
.courseTbl tbody th {
  font-weight: 400;
  background-color: #DCE6E6;
  white-space: nowrap;
}
.courseTbl tbody td {
  background-color: #FFF;
  text-align: left;
  vertical-align: top;
}
.courseTbl tbody tr:not(:last-child) th {
  border-bottom: 1px solid rgba(0,0,0,0.12);
}
.courseTbl tbody tr:not(:last-child) td {
  border-bottom: 1px solid rgba(0,0,0,0.12);
}
.courseTbl tbody td:not(:last-child) {
  border-right: 1px solid rgba(0,0,0,0.12);
}
.courseTbl td.gp1 .price { color: #3B87BF; }
.courseTbl td.gp2 .price { color: #E18A70; }
.courseTbl .price b { font-weight: 600; }
.courseTbl .price .sen { display: inline-block; padding-left: 0.55em; }
.courseTbl .bikou { display: inline-block; padding-top: 0.5em; }
.courseTbl ul { margin-left:1.25rem; }
.courseTbl ul li:not(:first-child) { padding-top:0.5rem; }
@media print, screen and (min-width:641px) {
  .courseTbl tbody th,
  .courseTbl tbody td {
    padding: 1.5rem;
  }
}
@media screen and (max-width:640px) {
  .courseTbl {
    font-size: 87.5%;
  }
  .courseTbl tbody th,
  .courseTbl tbody td {
    padding: 1rem;
  }
}