@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;
}
.course_info { text-align: left; }
@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;
    display: inline-block;
    margin-inline: auto;
  }
  .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;
  }
}

/*-----------------------------------------------------------------------------------
  初めての来院でホワイトニングをご希望の方
-----------------------------------------------------------------------------------*/
@media print, screen and (min-width:641px) {
  #fast {
    width: 1200px;
    margin-left: auto;
    margin-right: auto;
    padding-bottom: 100px;
  }
}
@media screen and (max-width:640px) {
  #fast { padding: 0 1.5rem 3rem 1.5rem; }
}
@media print, screen and (min-width:641px) {
  .fast_block { padding-top: 60px; }
}
@media screen and (max-width:640px) {
  .fast_block { padding-top: 2rem; }
}

.fast_priceTbl {
  width: 100%;
  border-collapse: separate;
  border: 0;
}
.fast_priceTbl th, .fast_priceTbl td {
  box-sizing: border-box;
  line-height: 1.4;
}
.fast_priceTbl thead th {
  font-weight: 400;
  color: #FFF;
  text-align: center;
  background-color: #61c5b4;
}
.fast_priceTbl tbody th {
  font-weight: 400;
  background-color: #ceece9;
  text-align: center;
  vertical-align: middle;
  border-bottom: 1px solid #f0f8f8;
}
.fast_priceTbl tbody td {
  text-align: left;
  vertical-align: middle;
  background-color: #fff;
  border-bottom: 1px solid #d2eae8;
}
.fast_priceTbl tbody td:last-child {
  text-align: right;
}
.fast_priceTbl tbody tr:last-child th, .fast_priceTbl tbody tr:last-child td {
  border-bottom: 0;
}
.fast_priceTbl .price span,
.fast_priceTbl .price small { display: inline-block; white-space: nowrap; }
@media print, screen and (min-width:641px) {
  .fast_priceTbl th, .fast_priceTbl td { padding: 1.25rem 1rem; }
}
@media screen and (max-width:640px) {
  .fast_priceTbl { font-size: 87.5%; }
  .fast_priceTbl th, .fast_priceTbl td { padding: 1rem; }
}

/*-----------------------------------------------------------------------------------
  backaup 202508
  初めての来院でホワイトニングをご希望の方
-----------------------------------------------------------------------------------*/
.whitening_gaiyou {
  padding-top: 60px;
  text-align: left;
}
.gaiyouTbl {
  width: 100%;
  border-collapse: collapse;
  border: 0;
  margin-bottom: 2rem;
}
.gaiyouTbl caption {
  text-align: left;
  padding-bottom: 0.75rem;
}
.gaiyouTbl th, .gaiyouTbl td {
  box-sizing: border-box;
  line-height: 1.4;
}
.gaiyouTbl th {
  font-weight: 400;
  background-color: #ceece9;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid #f0f8f8;
}
.gaiyouTbl td {
  text-align: left;
  vertical-align: middle;
  background-color: #fff;
  border-bottom: 1px solid #d2eae8;
}
.gaiyouTbl tr:last-child th, .gaiyouTbl tr:last-child td {
  border-bottom: 0;
}
.gaiyouTbl td ol {
  margin-left: 1.6rem;
}
.gaiyouTbl td .price dt {
  width: 6.5em;
  float: left;
  clear: both;
}
.gaiyouTbl td .price dd {
  float: left;
  width: 6.5em;
  text-align: right;
}
.gaiyouTbl td ol li:not(:first-child), .gaiyouTbl td .price dt:not(:first-child), .gaiyouTbl td .price dt:not(:first-child) + dd {
  margin-top: 0.25rem;
}
@media print, screen and (min-width:641px) {
  .gaiyouTbl th, .gaiyouTbl td {
    padding: 1.5rem;
  }
}
@media screen and (max-width:640px) {
  .kinouteika_gaiyou {
    padding: 3rem 0 0 0;
  }
  .gaiyouTbl colgroup {
    width: 100%;
  }
  .gaiyouTbl th, .gaiyouTbl td {
    display: block;
    width: 100%;
  }
  .gaiyouTbl th {
    text-align: left;
    border-bottom: 0;
    padding: 1rem 1.25rem;
  }
  .gaiyouTbl td {
    border-bottom: 0;
    padding: 1.5rem 1.25rem;
  }
}