@charset "UTF-8";
:root {
  /* （フォントサイズ倍率） */
  --lv1-text: 1.5;
  --lv2-text: 1.2;
}

@media (max-width:1279px) {
  :root {
    --lv1-text: 1.2;
  }
}

@media (max-width:599px) {
  :root {
    --lv1-text: 1;
    --lv2-text: 0.9;
  }
}

body {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 500;
  color: #777;
  letter-spacing: .1em;
}

/* ぱんくず */
/*=====================*/
.breadcrumb {
  margin: 0 0 38px 38px;
}

.breadcrumb__list {
  white-space: nowrap;
  overflow-x: scroll;
  /* スクロールバー非表示 */
  /*IE(Internet Explorer)・Microsoft Edgeへの対応*/
  -ms-overflow-style: none;
  /*Firefoxへの対応*/
  scrollbar-width: none;
}

.breadcrumb__list::-webkit-scrollbar{
  display: none;
}

.breadcrumb__item {
  display: inline-block;
  font-size: calc(11px * var(--lv1-text));
}

.breadcrumb__item a {
  color: #2cc7c5;
}

.breadcrumb__item::before {
  content: "\f054";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  display: inline-block;
  margin: 0 18px;
}

.breadcrumb__item:first-of-type::before {
  content: none;
}

@media (max-width:1024px) {
  .breadcrumb {
    margin: 0 0 24px 24px;
  }
}

@media (max-width:750px) {
  .breadcrumb {
    margin: 0 0 24px 10px;
  }

  .breadcrumb__item::before {
    margin: 0 12px;
  }
}

/* ボタン */
/*=====================*/
.btn-unit {
  margin: -18px 0 0 -66px;
  padding: 66px 45px 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.btn {
  display: inline-block;
  font-size: calc(14px * var(--lv1-text));
  font-weight: 900;
  color: #fff;
  background: #2cc7c5;
  margin: 18px 0 0 66px;
  width: calc(100% / 2 - 66px);
  max-width: 400px;
  text-align: center;
  border-radius: 90px;
  padding: 19px 60px;
  position: relative;
  text-align: center;
}

.btn::before {
  content: "\f054";
  position: absolute;
  top: 50%;
  right: 44px;
  transform: translateY(-50%);
  font-size: .93em;
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
}

@media (hover: hover) {
  .btn {
    transition: .15s ease;
  }

  .btn:hover {
    opacity: .7;
  }
}

@media (max-width:1279px) {
  .btn-unit {
    padding: 66px 22px 0;
    margin-left: -33px;
  }

  .btn {
    width: calc(100% / 2 - 33px);
    margin-left: 33px;
    padding: 19px 40px;
  }

  .btn::before {
    right: 22px;
  }
}

@media (max-width:1024px) {
  .btn {
    font-size: calc(12px * var(--lv1-text));
  }
}

@media (max-width:599px) {
  .btn-unit {
    display: block;
    margin-left: 0;
    padding: 33px 20px 0;
  }

  .btn {
    max-width: 350px;
    display: block;
    width: 100%;
    margin: 18px auto 0;
  }
}

/* クリニックの中Ver */
.clinic-item .btn-unit {
  padding-top: 40px;
}

.clinic-item .btn {
  font-size: calc(14px * var(--lv2-text));
}

@media (max-width:1279px) {
  .clinic-item .btn-unit {
    margin-left: 0;
  }

  .clinic-item .btn {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
  }
}

@media (max-width:599px) {
  .clinic-item .btn-unit {
    padding-left: 0;
    padding-right: 0;
  }
}


/* header */
/*=====================*/
.header,
.header__inner {
  height: 100px;
}

.header__inner {
  position: fixed;
  top: 0;
  left: 0;
  background: #fff;
  width: 100%;
  z-index: 9999;
  border-top: 4px solid #2cc7c5;
  border-bottom: 1px solid #ccc;
}

.header__cont {
  justify-content: space-between;
  display: flex;
  align-items: center;
  height: 95px;
  max-width: 1300px;
  padding: 0 50px;
  width: 100%;
  margin: 0 auto;
}

.header__logo {
  width: 359px;
  height: auto;
}

.header__logo a {
  display: block;
}

.header__logo img {
  height: auto;
  width: 100%;
}

@media (hover: hover) {
  .header__logo a {
    transition: .15s ease;
  }

  .header__logo a:hover {
    opacity: .7;
  }
}

@media (max-width:1279px) {
  .header__logo {
    width: 300px;
  }
}

@media (max-width:1024px) {
  .header,
  .header__inner {
    height: 80px;
  }

  .header__cont {
    padding: 0 30px;
    height: 75px;
  }
}

@media (max-width:850px) {
  .header__logo {
    width: 250px;
  }
}

@media (max-width:750px) {
  .header,
  .header__inner {
    height: 64px;
  }

  .header__cont {
    height: 59px;
    padding: 0 5px 0 15px;
  }

  .header__logo {
    width: 180px;
  }
}

/* Nav */
/*=====================*/
.header__nav {
  background: #e9f9f9;
  position: fixed;
  top: 100px;
  left: 0;
  width: 100%;
  z-index: 9999;
  height: 0;;
  overflow: hidden;
}

.header__nav.is-open {
  animation: openAnim 0.5s forwards;
}

.header__nav.is-close {
  animation: closeAnim 0.5s forwards;
}

@keyframes openAnim {
  0% {
    height: 0px;
  }
  99% {
    height: var(--nav-height);
  }
  100% {
    height: auto;
  }
}

@keyframes closeAnim {
  0% {
    height: var(--nav-height);
  }
  100% {
    height: 0px;
  }
}

.header__nav-list {
  padding: 30px 50px;
  max-width: 1300px;
  width: 100%;
  margin: 0 auto;
}

.header__nav-item + .header__nav-item {
  margin-top: 12px;
}

.header__nav-item a {
  border-radius: 5px;
  font-weight: 700;
  color: #777;
  display: block;
  height: 60px;
  line-height: 60px;
  padding: 0 20px 0 50px;
  position: relative;
  font-size: calc(12px * var(--lv1-text));
  background: #fff;
}

.header__nav-item i {
  margin-right: 8px;
}

.header__nav-item a::before {
  content: "\f0da";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  left: 20px;
  top: 50%;
  transform: translateY(-50%);
  position: absolute;
  color: #2cc7c5;
}

@media (hover: hover) {
  .header__nav-item a {
    transition: .15s ease;
  }

  .header__nav-item a:hover {
    color: #2cc7c5;
  }
}

@media (max-width:1024px) {
  .header__nav {
    top: 80px;
  }

  .header__nav-list {
    padding-left: 30px;
    padding-right: 30px;
  }
}

@media (max-width:750px) {
  .header__nav {
    top: 64px;
  }

  .header__nav-list {
    padding: 15px 30px;
  }

  .header__nav-item a {
    height: 45px;
    line-height: 45px;
    padding-left: 40px;
  }

  .header__nav-item + .header__nav-item {
    margin-top: 8px;
  }
}

.nav-btn {
  display: block;
  width: 60px;
  height: 60px;
  z-index: 9999;
  position: relative;
  touch-action: manipulation;
  display: flex;
  align-items: center;
  justify-content: center;
  outline: none;
}

.nav-btn__inner {
  display: block;
  height: 27px;
  width: 34px;
  position: relative;
}

.nav-btn__bar {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  margin: auto;
  width: 100%;
  height: 2px;
  transition: all 250ms ease-out;
  opacity: 1;
  background: #2cc7c5;
}

.nav-btn__bar:nth-child(2) {
  top: 13px;
  transform-origin: 0 0;
}

.nav-btn__bar:nth-child(3) {
  top: 25px
}

/* 動き */
.is-open .nav-btn__bar:nth-child(1) {
  transform: translateY(13px) rotate(45deg);
}

.is-open .nav-btn__bar:nth-child(2) {
  transform: rotate(0deg) scale(0.2, 0.2);
  opacity: 0;
}

.is-open .nav-btn__bar:nth-child(3) {
  transform: translateY(-12px) rotate(-45deg);
}

@media (max-width:750px) {
  .nav-btn__inner {
    height: 14px;
    width: 22px;
  }

  .nav-btn__bar:nth-child(2) {
    top: 6px;
  }

  .nav-btn__bar:nth-child(3) {
    top: 12px;
  }

  /* 動き */
  .is-open .nav-btn__bar:nth-child(1) {
    transform: translateY(6.5px) rotate(45deg);
  }

  .is-open .nav-btn__bar:nth-child(2) {
    transform: rotate(0deg) scale(0.2, 0.2);
  }

  .is-open .nav-btn__bar:nth-child(3) {
    transform: translateY(-6px) rotate(-45deg);
  }
}

/* タグ */
/*=====================*/
.tag-list {
  display: flex;
  flex-wrap: wrap;
  font-size: 0;
  margin: -11px 0 26px -11px;
}

.tag-list:last-of-type {
  margin-bottom: 0;
}

.tag-item {
  color: #2cc7c5;
  letter-spacing: .15em;
  background-color: rgba(44, 199, 197, 0.102);
  border-radius: 90px;
  padding: 8.5px 26px;
  line-height: 1;
  font-size: calc(11px * var(--lv1-text));
  margin: 11px 0 0 11px;
}

/* レイアウト */
/*=====================*/
.ly-cont {
  display: flex;
  flex-wrap: wrap;
  max-width: 1392px;
  width: 100%;
  padding: 0 50px;
  margin: 0 auto;
}

.ly-cont__main {
  width: calc(100% - 330px);
  padding-top: 62px;
  padding-bottom: 96px;
}

.ly-cont__side {
  width: 294px;
  padding: 62px 0 0 40px;
  border-left: 1px solid #ddd;
  margin-left: 36px;
  padding-bottom: 96px;
}

@media (max-width:959px) {
  .ly-cont {
    display: block;
    max-width: 840px;
  }

  .ly-cont__main {
    width: 100%;
    padding-bottom: 76px;
  }

  .ly-cont__side {
    border-top: 1px solid #ddd;
    border-left: none;
    margin: 0;
    padding: 76px 0 96px 0;

    /*full幅指定*/
    width: 100vw;
    position: relative;
    margin-left: -50vw;
    left: 50%;
  }

  .ly-cont__side-inner {
    max-width: 840px;
    width: 100%;
    margin: 0 auto;
    padding: 0 50px;
  }
}

@media (max-width:750px) {
  .ly-cont {
    padding: 0 20px;
  }

  .ly-cont__side-inner {
    padding: 0 40px;
  }

  .ly-cont__main {
    padding-bottom: 48px;
  }

  .ly-cont__side {
    padding: 48px 0 62px;
  }
}

/* セクション */
/*=====================*/
.sect {
  padding: 26px 0;
}

.sect:first-of-type {
  padding-top: 0;
}

.sect:last-of-type {
  padding-bottom: 0;
}

@media (max-width:1279px) {
  .sect {
    padding: 26px 0;
  }
}

@media (max-width:1024px) {
  .sect {
    padding: 16px 0;
  }
}

/* 見出し */
/*=====================*/
.lv2-heading {
  font-size: calc(18px * var(--lv1-text));
  font-weight: 900;
  color: #2cc7c5;
  text-align: center;
  margin-bottom: 25px;
  background: #e9f9f9;
  padding: 16px;
  border-radius: 5px;
}

.lv2-heading i {
  margin-right: .66em;
}

/* セレクトボックス */
/*=====================*/
.select-wrap {
  border: 1px solid #ddd;
  border-radius: 5px;
  position: relative;
  font-size: calc(16px * var(--lv2-text));
}

.select-wrap::before {
  content: "\f0d7";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  font-size: 1.125em;
  color: #2cc7c5;
  position: absolute;
  right: 30px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
}

.select {
  font-weight: 700;
  width: 100%;
  padding: 13px 3em 13px 32px;
  outline: none;
  cursor: pointer;
}

/* 施術で探すリスト */
/*=====================*/
.search-list {
  display: flex;
  flex-wrap: wrap;
  margin: -25px 0 0 -25px;
}

.search-item {
  width: calc(100% / 4 - 25px);
  margin: 25px 0 0 25px;
}

.search-item__link {
  display: flex;
  align-items: center;
  border: 1px solid #ddd;
  border-radius: 5px;
  padding: 24px 32px;
  min-height: 98px;
  height: 100%;
  justify-content: center;
}

.search-item__ttl {
  font-weight: 700;
  font-size: calc(16px * var(--lv2-text));
}

.search-item__icon {
  margin-right: 12px;
}

.search-item__icon img {
  height: auto;
  max-width: 100%;
}

@media (hover: hover)  {
  .search-item__ttl,
  .search-item__link {
    transition: .15s ease;
  }

  .search-item__link:hover {
    background: #e9f9f9;
  }

  .search-item__link:hover .search-item__ttl {
    color: #2cc7c5;
  }
}

@media (max-width:1279px) {
  .search-item {
    width: calc(100% / 2 - 25px);
  }
}

@media (max-width:750px) {
  .search-item__ttl br {
    display: none;
  }

  .search-list {
    margin: -16px 0 0 -12px;
  }

  .search-item {
    width: calc(100% / 2 - 12px);
    margin: 16px 0 0 12px;
  }

  .search-item__link {
    padding: 12px 16px;
    flex-direction: column;
  }

  .search-item__icon {
    margin: 0 0 8px 0;
  }
}

/* 検索フォーム */
/*=====================*/
.search-form__bar-col1 {
  display: flex;
  flex-wrap: wrap;
  margin: -19px 0 0 -5px;
  width: calc(100% - 47px);
}

.search-form__select-wrap {
  width: calc(100% / 3 - 5px);
  margin: 19px 0 0 5px;
}

.search-form__bar {
  display: flex;
  flex-wrap: wrap;
}

.search-form__search-btn {
  display: block;
  font-size: calc(18px * var(--lv2-text));
  color: #fff;
  width: 47px;
  background: #2cc7c5;
  text-align: center;
  margin-left: 5px;
  border-radius: 5px;
}

@media (hover: hover) {
  .search-form__search-btn {
    transition: opacity .15s ease;
  }

  .search-form__search-btn:hover {
    opacity: .7;
  }
}

@media (max-width:1279px) {
  .search-form__select-wrap {
    width: 100%;
    margin-left: 0;
  }

  .search-form__bar-col1 {
    width: 100%;
    margin-left: 0;
  }

  .search-form__search-btn {
    height: 50px;
    line-height: 50px;
    width: 100%;
    margin: 19px 0 0 0;
  }
}

@media (max-width:599px) {
  .select-wrap {
    font-size: 16px;
  }

  .select {
    padding: 13px 2em 13px 16px;
  }

  .select-wrap::before {
    right: 16px;
  }

  .search-form__bar-col1 {
    margin-top: -14px;
  }

  .search-form__select-wrap {
    margin-top: 14px;
  }

  .search-form__search-btn {
    margin-top: 14px;
  }
}

/* 口コミ */
/*=====================*/
.review__ttl {
  font-size: calc(18px * var(--lv1-text));
  font-weight: 900;
  margin-bottom: 30px;
}

.review__user-name {
  font-size: calc(12px * var(--lv1-text));
}

.review__user {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.review__user-icon {
  margin-right: 8px;
  width: 36px;
}

.review__user-icon img {
  width: 100%;
  border-radius: 90px;
}

.review__flex {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  margin: -15px 0 0 -15px;
}

.review__status,
.review__user {
  margin: 15px 0 0 15px;
}

.review__status {
  display: inline-block;
  font-size: calc(11px * var(--lv1-text));
  color: #dd458d;
  letter-spacing: .15em;
  padding: 6px 25px;
  line-height: 1;
  background-color: rgba(221, 69, 141, 0.102);
  border-radius: 90px;
}

.review__status i {
  margin-right: 6px;
}

.review__status.is-active {
  color: #4586dd;
  background-color: rgba(69, 134, 221, 0.102);
}

.review__star {
  margin-top: 20px;
}

.review__txt {
  font-size: calc(12px * var(--lv1-text));
  margin-top: 24px;
  line-height: 1.61;
}

/* サイドバナー */
/*=====================*/
.side-bnr-area {
  margin-bottom: 80px;
}

.side-bnr {
  max-width: 300px;
  width: 100%;
}

.side-bnr a {
  display: inline-block;
}

.side-bnr img {
  width: 100%;
  height: auto;
}

@media (hover: hover) {
  .side-bnr a {
    transition: .15s ease;
  }

  .side-bnr a:hover {
    opacity: .7;
  }
}

@media (max-width:1024px) {
  .side-bnr-area {
    margin-bottom: 60px;
  }
}

@media (max-width:750px) {
  .side-bnr-area {
    margin-bottom: 40px;
  }
}

@media (max-width:599px) {
  .side-bnr {
    margin: 0 auto;
  }
}

/* 注目ランキング */
/*=====================*/
.rank-widget__heading {
  color: #2cc7c5;
  font-weight: 900;
  background-color: rgb(233, 249, 249);
  font-size: calc(16px * var(--lv1-text));
  padding: 16px;
  border-radius: 5px;
  margin-bottom: 26px;
}

.rank-widget__heading i {
  margin-right: 10px;
}

.rank-widget__item {
  position: relative;
}

.rank-widget__item + .rank-widget__item {
  margin-top: 20px;
}

.rank-widget__item-link {
  display: block;
  border: 1px solid #ddd;
  border-radius: 5px;
  padding: 18px;
  margin-bottom: 20px;
}

.rank-widget__item-logo {
  text-align: center;
}

.rank-widget__item-logo img {
  max-width: 100%;
  height: auto;
}

.rank-widget__item-ttl {
  font-size: calc(14px * var(--lv1-text));
  font-weight: 700;
  line-height: 1.28;
}

@media (hover: hover) {
  .rank-widget__item {
    transition: .15s ease;
  }

  .rank-widget__item:hover {
    opacity: .7;
  }
}

/* 数字 */
.rank-widget__item::before {
  font-size: calc(14px * var(--lv1-text));
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  content: "";
  position: absolute;
  width: 46px;
  height: 46px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  pointer-events: none;
  border-radius: 5px 0 0 0;
  z-index: 8;
  background: #ddd;
}

/* 1位 */
.rank-widget__item:nth-of-type(1)::before {
  content: "1";
  background: #c6aa7e;
}

/* 2位 */
.rank-widget__item:nth-of-type(2)::before {
  content: "2";
  background: #acb2b6;
}

/* 3位 */
.rank-widget__item:nth-of-type(3)::before {
  content: "3";
  background: #c6977e;
}

/* 4位 */
.rank-widget__item:nth-of-type(4)::before {
  content: "4";
}

.rank-widget__item:nth-of-type(5)::before {
  content: "5";
}

@media (max-width:599px) {
  .rank-widget__heading {
    margin-bottom: 20px;
  }

  .rank-widget__item-link {
    padding: 14px 18px 18px;
  }

  .rank-widget__item::before {
    font-size: 18px;
  }

  .rank-widget__item-ttl {
    margin-top: 8px;
  }
}

/* MV */
/*=====================*/
.mv img {
  width: 100%;
  height: auto;
}

/* 最新の口コミを見る */
/*=====================*/
.post-item {
  border: 1px solid #ddd;
  border-radius: 5px;
}

.post-item + .post-item  {
  margin-top: 25px;
}

.post-item__thumb {
  width: 250px;
}

.post-item__thumb img {
  max-width: 100%;
  height: auto;
}

.post-item__link {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  padding: 40px 50px 40px 40px;
}

.post-item__review {
  width: calc(100% - 250px);
  padding-left: 25px;
}

@media (hover: hover) {
  a.post-item__link {
    transition: .15s ease;
  }

  a.post-item__link:hover {
    opacity: .7;
  }
}

@media (max-width:1279px) {
  .post-item__thumb {
    width: 200px;
  }

  .post-item__review {
    width: calc(100% - 200px);
  }
}

@media (max-width:599px) {
  .review__ttl {
    margin-bottom: 15px;
  }

  .post-item__thumb {
    margin: 0 auto 25px;
  }

  .post-item__link {
    display: block;
    padding: 30px 20px 30px 20px;
  }

  .post-item__review {
    width: 100%;
    padding-left: 0;
  }
}

/* クリニック情報 */
/*=====================*/
.clinic-item {
  border: 1px solid #ddd;
  border-radius: 5px;
  padding: 43px 52px 43px 40px;
}

.clinic-item + .clinic-item {
  margin-top: 25px;
}

.clinic-item__head {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 20px;
}

.clinic-item__head-col1 {
  width: calc(100% - 260px);
}

.clinic-item__head-col2 {
  width: 260px;
  padding-left: 10px;
}

.clinic-item__logo img {
  max-width: 100%;
}

.clinic-item__heading {
  font-size: calc(18px * var(--lv1-text));
  font-weight: 900;
  margin-bottom: 16px;
}

.clinic-item__lv4-heading {
  margin-bottom: 16px;
  font-weight: 900;
  font-size: calc(14px * var(--lv1-text));
}

.clinic-item__disc {
  font-size: calc(12px * var(--lv1-text));
  line-height: 1.61;
}

/* 特徴 */
.clinic-item__list {
  counter-reset: item;
  margin-bottom: 26px;
}

.clinic-item__item {
  position: relative;
  padding-left: 40px;
  font-size: calc(13px * var(--lv1-text));
}

/*.clinic-item__item::before {*/
/*  counter-increment: item;*/
/*  content: counter(item);*/
/*  position: absolute;*/
/*  left: 6px;*/
/*  font-weight: 700;*/
/*  font-family: 'Roboto', sans-serif;*/
/*  transform: translateY(2px);*/
/*}*/

.clinic-item__item + .clinic-item__item {
  margin-top: 8px;
}

/* 評価 */
.clinic-item__dl {
  background-color: rgba(221, 221, 221, 0.102);
  padding: 28px 66px;
  margin-bottom: 26px;
}

.clinic-item__dl-item + .clinic-item__dl-item {
  margin-top: 15px;
}

.clinic-item__dl-item {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.clinic-item__dl-head {
  font-weight: 700;
  font-size: calc(14px * var(--lv1-text));
}

@media (max-width:1024px) {
  .clinic-item__head-col1 {
    width: calc(100% - 210px);
  }

  .clinic-item__head-col2 {
    width: 210px;
  }
}

@media (max-width:599px) {
  .clinic-item {
    padding: 33px 20px 33px 20px;
  }

  .clinic-item__head {
    margin-bottom: 10px;
    flex-direction: column;
  }

  .clinic-item__head-col1 {
    width: 100%;
  }

  .clinic-item__dl {
    padding: 28px 15px;
  }

  .clinic-item__item {
    padding-left: 30px;
  }
}

/* 星 + スコア */
/*=====================*/
.star {
  display: flex;
  align-items: center;
}

.star__score {
  font-size: calc(14px * var(--lv1-text));
  margin-left: 16px;
  padding-top: 2.5px;
}

.star__icons {
  position: relative;
  z-index: 0;
  display: inline-block;
  white-space: nowrap;
  font-size: calc(16px * var(--lv1-text));
  color: #999;
}

.star__icons:before,
.star__icons:after{
  font-weight: 700;
  content: '\2605\2605\2605\2605\2605';
}

.star__icons:after{
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  overflow: hidden;
  white-space: nowrap;
  color: #f2c40c;
}

/* htmlにdata-rate="5.0"形式で使用 */
.star__icons[data-rate="5.0"]:after{ width: 100%; }
.star__icons[data-rate="4.9"]:after{ width: 98%; }
.star__icons[data-rate="4.8"]:after{ width: 96%; }
.star__icons[data-rate="4.7"]:after{ width: 94%; }
.star__icons[data-rate="4.6"]:after{ width: 92%; }
.star__icons[data-rate="4.5"]:after{ width: 90%; }
.star__icons[data-rate="4.4"]:after{ width: 88%; }
.star__icons[data-rate="4.3"]:after{ width: 86%; }
.star__icons[data-rate="4.2"]:after{ width: 84%; }
.star__icons[data-rate="4.1"]:after{ width: 82%; }
.star__icons[data-rate="4.0"]:after{ width: 80%; }
.star__icons[data-rate="3.9"]:after{ width: 78%; }
.star__icons[data-rate="3.8"]:after{ width: 76%; }
.star__icons[data-rate="3.7"]:after{ width: 74%; }
.star__icons[data-rate="3.6"]:after{ width: 72%; }
.star__icons[data-rate="3.5"]:after{ width: 70%; }
.star__icons[data-rate="3.4"]:after{ width: 68%; }
.star__icons[data-rate="3.3"]:after{ width: 66%; }
.star__icons[data-rate="3.2"]:after{ width: 64%; }
.star__icons[data-rate="3.1"]:after{ width: 62%; }
.star__icons[data-rate="3.0"]:after{ width: 60%; }
.star__icons[data-rate="2.9"]:after{ width: 58%; }
.star__icons[data-rate="2.8"]:after{ width: 56%; }
.star__icons[data-rate="2.7"]:after{ width: 54%; }
.star__icons[data-rate="2.6"]:after{ width: 52%; }
.star__icons[data-rate="2.5"]:after{ width: 50%; }
.star__icons[data-rate="2.4"]:after{ width: 48%; }
.star__icons[data-rate="2.3"]:after{ width: 46%; }
.star__icons[data-rate="2.2"]:after{ width: 44%; }
.star__icons[data-rate="2.1"]:after{ width: 42%; }
.star__icons[data-rate="2.0"]:after{ width: 40%; }
.star__icons[data-rate="1.9"]:after{ width: 38%; }
.star__icons[data-rate="1.8"]:after{ width: 36%; }
.star__icons[data-rate="1.7"]:after{ width: 34%; }
.star__icons[data-rate="1.6"]:after{ width: 32%; }
.star__icons[data-rate="1.5"]:after{ width: 30%; }
.star__icons[data-rate="1.4"]:after{ width: 28%; }
.star__icons[data-rate="1.3"]:after{ width: 26%; }
.star__icons[data-rate="1.2"]:after{ width: 24%; }
.star__icons[data-rate="1.1"]:after{ width: 22%; }
.star__icons[data-rate="1.0"]:after{ width: 20%; }
.star__icons[data-rate="0.9"]:after{ width: 18%; }
.star__icons[data-rate="0.8"]:after{ width: 16%; }
.star__icons[data-rate="0.7"]:after{ width: 14%; }
.star__icons[data-rate="0.6"]:after{ width: 12%; }
.star__icons[data-rate="0.5"]:after{ width: 10%; }
.star__icons[data-rate="0.4"]:after{ width: 8%; }
.star__icons[data-rate="0.3"]:after{ width: 6%; }
.star__icons[data-rate="0.2"]:after{ width: 4%; }
.star__icons[data-rate="0.1"]:after{ width: 2%; }
.star__icons[data-rate="0.0"]:after{ width: 0%; }

@media (max-width:599px) {
  .star__score {
    margin-left: 8px;
  }
}

/* クリニック情報（ランキング） */
/*=====================*/
.clinic-ranking .clinic-item {
  position: relative;
}

.clinic-ranking .clinic-item__heading {
  padding-left: 78px;
}

.clinic-ranking .clinic-item::before {
  font-family: 'Roboto', sans-serif;
  font-size: calc(21.33px * var(--lv1-text));
  font-weight: 700;
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  top: -1px;
  left: -1px;
  width: 70px;
  height: 70px;
  background: #7be2e1;
  color: #fff;
  border-radius: 5px 0 0 0;
  padding-top: 4px;
}

.clinic-ranking .clinic-item:first-of-type:before {
  content: "1";
}

.clinic-ranking .clinic-item:nth-child(2):before {
  content: "2";
}

.clinic-ranking .clinic-item:nth-child(3):before {
  content: "3";
}

.clinic-ranking .clinic-item:nth-child(4):before {
  content: "4";
}

.clinic-ranking .clinic-item:nth-child(5):before {
  content: "5";
}

@media (max-width:599px) {
  .clinic-ranking .clinic-item::before {
    width: 50px;
    height: 50px;
  }

  .clinic-ranking .clinic-item__heading {
    padding-left: 58px;
  }
}

/* クリニックの口コミ投稿フォーム */
/*=====================*/
.post {
  margin-top: 66px;
}

.post__lv1-heading {
  font-size: calc(18px * var(--lv1-text));
  font-weight: 900;
  letter-spacing: .1em;
  text-align: center;
  margin-bottom: 77px;
}

.post__form-caution {
  font-size: calc(12px * var(--lv1-text));
  font-weight: 500;
  letter-spacing: .1em;
  line-height: 1.6;
  text-align: center;
  margin-top: 70px;
}

.post__form-caution a {
  color: #2cc7c5;
}

/* カラム */
.post__form-wr-col1 {
  width: 116px;
  padding: 10px 0;
}

.post__form-wr-col2 {
  width: calc(100% - 116px);
  padding-left: 36px;
}

.post__form-txt {
  font-size: calc(14px * var(--lv1-text));
  font-weight: 900;
  letter-spacing: .1em;
}

.text-box {
  padding: 12px 12px;
  background-color: rgba(221, 221, 221, .2);
  width: 100%;
  outline: none;
}

.post__form-wr {
  display: flex;
  align-items: center;
  margin-bottom: 70px;
}

.post__form-wr.post__form-wr--top {
  align-items: flex-start;
}

.post__form-txtbox,
.post__form-txtarea {
  width: 100%;
}

.post__form-radio-btn-label {
  position: relative;
}

.post__radio-check {
  padding-left: 30px;
  cursor: pointer;
  position: relative;
  display: inline-block;
}

.post__radio-check::before,
.post__radio-check::after {
  position: absolute;
  content: "";
  display: block;
  top: calc(50% + 2.5px);
  transform: translateY(-50%);
  border-radius: 90px;
}

.post__radio-check::before {
  background-color: #eee;
  width: 20px;
  height: 20px;
  left: 0;
}

.post__radio-check::after {
  background-color: #2cc7c5;
  width: 12px;
  height: 12px;
  left: 4px;
  opacity: 0;
}

.post__form input[type="radio"] {
  display: none;
  z-index: 1;
}

.post__form input[type="radio"]:checked + .post__radio-check::after {
  opacity: 1;
  z-index: 1;
}

.post__form-radio-contents + .post__form-radio-contents {
  margin-top: 20px;
}

.sp-br {
  display: none;
}

@media(max-width: 599px) {
  .sp-br {
    display: block;
  }

  .post__form-wr {
    margin-bottom: 35px;
    display: block;
  }

  .post__form-wr-col1 {
    width: 100%;
    padding-bottom: 15px;
  }

  .post__form-wr-col2 {
    width: 100%;
    padding-left: 0;
  }

  .post__form-caution {
    margin-top: 35px;
  }

  .post__lv1-heading {
    margin-bottom: 38px;
  }

  .post__radio-check::before,
  .post__radio-check::after {
    top: calc(50% + 1px);
  }
}

/*確認画面*/
/*==============*/
.confirm__table {
  margin: 0 auto 50px;
  width: 100%;
  max-width: 900px;
}

.confirm__table th,
.confirm__table td {
  padding: 20px;
  border: 1px solid #ddd;
}

.confirm__table th {
  background-color: #eee;
  width: 150px;
}

.back-btn::before {
  right: auto;
  left: 44px;
  content: "\f053";
}

.confirm__txt {
  font-size: calc(12px * var(--lv1-text));
  font-weight: 500;
  letter-spacing: .1em;
  text-align: center;
}

@media (max-width:1279px) {
  .back-btn::before {
    left: 22px;
  }
}

@media(max-width: 960px) {
  .confirm table,
  .confirm tr,
  .confirm th,
  .confirm td,
  .confirm tbody {
    display: block;
    width: 100%;
  }

  .confirm th,
  .confirm td {
    margin-bottom: -1px;
  }
}

/*口コミ投稿完了*/
.complete__txt {
  font-size: calc(12px * var(--lv1-text));
  font-weight: 500;
  letter-spacing: .1em;
  text-align: center;
  margin-bottom: 20px;
}

/* フッター */
/*=====================*/
.footer {
  background: #e9f9f9;
  border-bottom: 4px solid #2cc7c5;
}

.footer__logo img {
  max-width: 100%;
  height: auto;
}

.footer__inner {
  max-width: 1300px;
  width: 100%;
  margin: 0 auto;
  padding: 22px 50px 30px;
}

.footer__cont {
  margin-bottom: 36px;
  display: flex;
}

.footer__col1 {
  width: 358px;
}

.footer__col2 {
  width: calc(100% - 358px);
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  padding-left: 50px;
}

.footer__logo a {
  display: inline-block;
}

@media (hover: hover) {
  .footer__logo a {
    transition: .15s ease;
  }

  .footer__logo a:hover {
    opacity: .7;
  }
}

@media (max-width:1279px) {
  .footer__col1 {
    width: 300px;
  }

  .footer__col2 {
    width: calc(100% - 300px);
  }
}

@media (max-width:959px) {
  .footer__inner {
    padding-left: 30px;
    padding-right: 30px;
  }
}

@media (max-width:850px) {
  .footer__col1 {
    width: 250px;
  }

  .footer__col2 {
    width: calc(100% - 250px);
  }
}

@media (max-width:750px) {
  .footer__inner {
    padding: 22px 20px 25px;
  }

  .footer__cont {
    display: block;
  }

  .footer__col1 {
    margin-bottom: 48px;
  }

  .footer__col2 {
    width: 100%;
    padding: 0;
    display: block;
  }
}

/* nav */
.footer__nav {
  display: flex;
  flex-wrap: wrap;
  margin: 0 -5px 0 -44px;
}

.footer__nav-item {
  font-size: calc(14px * var(--lv1-text));
  font-weight: 700;
  margin-left: 44px;
}

.footer__nav-item a {
  display: inline-block;
  padding: 5px;
}

@media (hover: hover) {
  .footer__nav-item a {
    transition: .15s ease;
  }

  .footer__nav-item a:hover {
    color: #2cc7c5;
  }
}

@media (max-width:959px) {
  .footer__nav {
    margin-left: -22px;
    justify-content: flex-end;
  }

  .footer__nav-item {
    margin-left: 22px;
  }
}

@media (max-width:750px) {
  .footer__nav {
    margin: -12px 0 0 0;
    display: block;
  }

  .footer__nav-item {
    margin: 12px 0 0 0;
  }
}

/* copyright */
.footer__copyright {
  font-weight: 400;
  text-align: right;
  font-size: calc(11px * var(--lv1-text));
}

.footer__copyright small {
  font-size: inherit;
}

@media (max-width:750px) {
  .footer__copyright {
    text-align: left;
  }
}

/* 口コミ詳細 */
/*=====================*/
.voice-list {
  margin-top: 60px;
}

.voice-item {
  border: 1px solid #ddd;
  padding: 40px 48px 40px 40px;
  border-radius: 5px;
}

.voice-item + .voice-item  {
  margin-top: 40px;
}

@media (max-width:599px) {
  .voice-list {
    margin-top: 40px;
  }

  .voice-item + .voice-item {
    margin-top: 20px;
  }

  .voice-item {
    padding: 30px 20px;
  }
}