@charset "utf-8";

@import url("https://fonts.googleapis.com/css2?family=Cormorant+Infant:ital,wght@0,300..700;1,300..700&family=Zen+Kaku+Gothic+New:wght@300;400;500;700;900&family=Zen+Old+Mincho:wght@400;500;600;700;900&display=swap");

/* CSS Document */

/*　toko_twobtn01　*/
.toko_twobtn01 a {
  justify-content: space-between;
  padding: 10px 20px;
}
.toko_twobtn01 a.btnlight.ico_detail .reason_btn_ico img {
  filter: brightness(0) saturate(100%) invert(55%) sepia(68%) saturate(2465%) hue-rotate(313deg) brightness(101%)
    contrast(95%);
}
.toko_twobtn01 a .reason_btn_ico {
  width: 40px;
  margin: 0 auto;
  text-align: center;
}
.toko_twobtn01 a .reason_btn_ico img {
  margin: 0 auto;
}
.toko_twobtn01 a .reason_btn_txt {
  flex: 1;
  text-align: center;
}
@media (max-width: 979px) {
  .toko_twobtn01 a {
    justify-content: space-between;
    padding: 10px 15px;
  }
  .toko_twobtn01 a img {
    margin: 0 5px;
  }
}


/* #emergency_covid19 */
#emergency_covid19.ac_ar_001 {
  margin: 60px auto 0;
}
@media (max-width: 979px) {
  #emergency_covid19.ac_ar_001 {
    margin: 30px auto 0;
  }
}

/* intro */
.intro {
  background: url("https://www.s-b-c.net/assets/datsumo/images/intro01.jpg") center center/cover no-repeat;
  margin-top: 80px;
  padding: 60px 0;
  color: #000000;
}
.intro .container {
  width: 980px;
  text-align: center;
  margin: 0 auto;
}
.intro .container p {
  font-family: "Zen Old Mincho", serif;
  font-weight: 700;
  font-style: normal;
  font-size: 22px;
  font-weight: 700;
}
.intro .container p + p {
  margin-top: 20px;
}
.intro .container p > span {
  font-size: 26px;
}
.intro .container p > .str {
  color: #9c6c20;
}
.intro .container p > .ul {
  background: #e4cb74;
  background: linear-gradient(0deg, #e4cb74 0%, #f0e5a1 35%, transparent 35%);
}
.intro .container p.clname > span {
  font-family: "Cormorant Infant", serif;
  font-optical-sizing: auto;
  font-weight: bold;
  font-style: normal;
  background: linear-gradient(0deg, #d4ac3e 0%, #915e02 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.intro .container p.clname > span.main {
  font-size: 40px;
}
.intro .container p.btn_common {
  text-align: center;
}
.intro .container p.btn_common a {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  width: fit-content;
  height: 100%;
  font-family: initial;
  font-size: 18px;
  font-weight: normal;
  color: #ffffff;
  text-decoration: none;
  line-height: 1.2;
  background: #9d7406;
  background: linear-gradient(0deg, #9d7406 0%, #d1a93b 100%);
  border: 1px solid #9d7406;
  border-radius: 100px;
  margin: auto;
  padding: 15px 55px 15px 60px;
  position: relative;
}
.intro .container p.btn_common a > span {
  font-size: 26px;
}
.intro .container p.btn_common a::before {
  content: "";
  width: 28px;
  height: 28px;
  background: #9d7406;
  border-radius: 100%;
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translate(0, -50%);
}
.intro .container p.btn_common a::after {
  content: "";
  width: 10px;
  height: 11px;
  background: #fff;
  clip-path: polygon(0 0, 80% 40%, 0 80%);
  position: absolute;
  right: 27px;
  top: 50%;
  transform: translate(0, -45%);
}
.intro .container p.note {
  font-family: initial;
  font-size: 10px;
  font-weight: normal;
}
@media (max-width: 979px) {
  .intro {
    background-image: url("https://www.s-b-c.net/assets/datsumo/images/intro01_sp.jpg");
    margin: 30px auto 0;
    padding: 8vw 0 10vw;
  }
  .intro .container {
    width: 95%;
  }
  .intro .container p {
    font-size: Min(3.5vw,22px);
    line-height: 1.5;
  }
  .intro .container p + p {
    margin-top: 3vw;
  }
  .intro .container p > span {
    font-size: Min(4vw,26px);
  }
  .intro .container p.clname > span.main {
    font-size: Min(6vw,40px);
  }
  .intro .container p.btn_common a {
    font-size: Min(3vw,18px);
    padding: 10px 45px 10px 55px;
  }
  .intro .container p.btn_common a > span {
    font-size: Min(4vw,26px);
  }
  .intro .container p.btn_common a::before {
    width: 20px;
    height: 20px;
    right: 18px;
  }
  .intro .container p.btn_common a::after {
    width: 8px;
    height: 10px;
    right: 22px;
  }
  .intro .container p.note {
    font-size: Min(1.6vw,10px);
  }
}

/* NEWS */
#main .toko_topnews {
  padding: 100px 0 0;
}
@media (max-width: 979px) {
  #main .toko_topnews {
    padding: 60px 0 0;
  }
}

/*　REASON　*/
.toko_reason {
  padding: 85px 0;
}
@media (max-width: 979px) {
  .toko_reason {
    padding: 60px 0;
  }
  .toko_reasonbox + .toko_reasonbox {
    margin-top: 30px;
    padding-top: 30px;
  }
  .toko_reasonbox .toko_reasonflex {
    margin-bottom: 20px;
  }
}

/*　RANKING　*/

/* Ranking tab */
#main .tabacc.-pc-tab > .tabs,
.tabacc.-sp-tab > .tabs {
  justify-content: flex-start;
  padding: 0 0 0 30px;
  border-bottom: 2px solid #f9647e;
}
#main #tabRanking .tabs .title {
  width: 300px;
  font-size: 20px;
  font-weight: normal;
  line-height: 1.4;
  min-height: inherit;
  padding: 12px 0;
  color: #999;
  border: 2px solid #e3e3e3;
  background: #e3e3e3;
  border: none;
}
#main #tabRanking .tabs .title.-active {
  background: none;
  border: 2px solid #f9647e;
  border-bottom: none;
  color: #f9647e;
}
#main #tabRanking .tabs .title.-active::before {
  content: "";
  width: 100%;
  height: 2px;
  background: #fdf6f6;
  position: absolute;
  left: 0;
  bottom: -2px;
}
#main #tabRanking .tabs .title.-active:hover {
  opacity: 1;
}
#main .tabacc.-pc-tab > .tabs > .title:not(:first-child),
#main .tabacc.-sp-tab > .tabs > .title:not(:first-child) {
  margin: 0 0 0 10px;
}
#main #tabRanking .contents {
  padding: 20px 0 0;
  border: none;
  margin: 0;
}
#main #tabRanking .contents .content {
  height: 0;
  overflow: hidden;
}
#main #tabRanking .contents .content.-active {
  height: inherit;
  overflow: inherit;
}
#main #tabRanking .contents .content .toko_topranslider .toko_toprancont a {
  padding: 15px;
}
#main #tabRanking .contents .content .toko_topranslider .toko_toprancont a .toko_topranimg {
  margin-bottom: 10px;
  line-height: 1.4;
}
#main #tabRanking .contents .content .toko_topranslider .toko_toprancont a .toko_toprantit {
  margin-bottom: 0;
}
#main #tabRanking .contents .content .toko_topranslider .toko_twobtn01 {
  margin-top: 10px;
}

@media (max-width: 979px) {
  #main .tabacc.-pc-tab > .tabs,
  #main .tabacc.-sp-tab > .tabs {
    justify-content: center;
    padding: 0;
    border-bottom: 1px solid #f9647e;
  }
  #main #tabRanking .tabs .title {
    width: 42vw;
    font-size: 3.6vw;
    padding: 1vw 0;
    border: 1px solid #e3e3e3;
  }
  #main #tabRanking .tabs .title.-active {
    border: 1px solid #f9647e;
  }
  #main #tabRanking .tabs .title.-active::before {
    height: 1vw;
    bottom: -0.6vw;
  }
  #main .tabacc.-pc-tab > .tabs > .title:not(:first-child),
  #main .tabacc.-sp-tab > .tabs > .title:not(:first-child) {
    margin: 0 0 0 2vw;
  }
  #main #tabRanking .contents {
    padding: 2.5vw 0 0;
    border: none;
  }
  #main #tabRanking .contents .content .toko_topranslider .toko_twobtn01 {
    margin-top: 20px;
  }
}

/* Special tab */
#main #tabSpecial.tabacc.-pc-tab > .tabs,
#main #tabSpecial.tabacc.-sp-tab > .tabs {
  justify-content: center;
  padding: 0;
  border-bottom: 2px solid #f9647e;
}
#main #tabSpecial .tabs .title {
  width: 300px;
  font-size: 20px;
  font-weight: normal;
  line-height: 1.4;
  min-height: inherit;
  padding: 12px 0;
  color: #999;
  border: 2px solid #e3e3e3;
  background: #e3e3e3;
  border: none;
}
#main #tabSpecial .tabs .title.-active {
  background: none;
  border: 2px solid #f9647e;
  border-bottom: none;
  color: #f9647e;
}
#main #tabSpecial .tabs .title.-active::before {
  content: "";
  width: 100%;
  height: 2px;
  background: #fff;
  position: absolute;
  left: 0;
  bottom: -2px;
}
#main #tabSpecial .tabs .title.-active:hover {
  opacity: 1;
}
#main #tabSpecial .tabacc.-pc-tab > .tabs > .title:not(:first-child),
#main #tabSpecial .tabacc.-sp-tab > .tabs > .title:not(:first-child) {
  margin: 0 0 0 10px;
}
#main #tabSpecial .contents {
  padding: 25px 0 0;
  border: none;
  margin: 0;
}
#main #tabSpecial .contents .toko_reclist {
  margin: 25px 0 0;
}
#main #tabSpecial .contents .content {
  height: 0;
  overflow: hidden;
}
#main #tabSpecial .contents .content.-active {
  height: inherit;
  overflow: inherit;
}
#main #tabSpecial .contents .contentInner {
  width: 96%;
  padding: 0;
}
@media (max-width: 979px) {
  #main #tabSpecial.tabacc.-pc-tab > .tabs,
  #main #tabSpecial.tabacc.-sp-tab > .tabs {
    justify-content: center;
    padding: 0;
    border-bottom: 1px solid #f9647e;
  }
  #main #tabSpecial .tabs .title {
    width: 42vw;
    font-size: 3.6vw;
    padding: 1vw 0;
  }
  #main #tabSpecial .tabs .title.-active {
    border: 1px solid #f9647e;
  }
  #main #tabSpecial .tabs .title.-active::before {
    height: 1vw;
    bottom: -0.6vw;
  }
  #main #tabSpecial .tabacc.-pc-tab > .tabs > .title:not(:first-child),
  #main #tabSpecial .tabacc.-sp-tab > .tabs > .title:not(:first-child) {
    margin: 0 0 0 2vw;
  }
  #main #tabSpecial .contents {
    padding: 3.5vw 0 0;
    border: none;
  }
  #main #tabSpecial .contents .toko_reclist {
    margin: 3.5vw 0 0;
  }
  #main #tabSpecial .contents .contentInner {
    width: 100%;
    padding: 0 2.5vw 2.5vw;
  }
}
/* Recommend tab */
#main #tabRecommend.tabacc.-pc-tab > .tabs,
#main #tabRecommend.tabacc.-sp-tab > .tabs {
  justify-content: center;
  padding: 0;
}
#main #tabRecommend .tabs .title {
  width: 300px;
  font-size: 20px;
  font-weight: normal;
  line-height: 1.4;
  min-height: inherit;
  padding: 12px 0;
  border: 2px solid #e3e3e3;
  background: #e3e3e3;
  border: none;
  color: #999;
}
#main #tabRecommend .tabs .title.-active {
  background: none;
  border: 2px solid #fb637e;
  border-bottom: none;
  color: #fb637e;
}
#main #tabRecommend .tabs .title.-active::before {
  content: "";
  width: 100%;
  height: 2px;
  background: #fff;
  position: absolute;
  left: 0;
  bottom: -2px;
}
#main #tabRecommend .tabs .title.-active:hover {
  opacity: 1;
}
#main #tabRecommend .tabacc.-pc-tab > .tabs > .title:not(:first-child),
#main #tabRecommend .tabacc.-sp-tab > .tabs > .title:not(:first-child) {
  margin: 0 0 0 10px;
}
#main #tabRecommend .contents {
  padding: 25px 0 0;
  border: none;
  margin: 0;
}
#main #tabRecommend .contents .toko_reclist {
  margin: 25px 0 0;
}
#main #tabRecommend .contents .content {
  height: 0;
  overflow: hidden;
}
#main #tabRecommend .contents .content.-active {
  height: inherit;
  overflow: inherit;
}
#main #tabRecommend .contents .contentInner {
  width: 96%;
  padding: 0;
}
@media (max-width: 979px) {
  #main #tabRecommend.tabacc.-pc-tab > .tabs,
  #main #tabRecommend.tabacc.-sp-tab > .tabs {
    justify-content: center;
    padding: 0;
    border-bottom: 1px solid #f9647e;
  }
  #main #tabRecommend .tabs .title {
    width: 42vw;
    font-size: 3.6vw;
    padding: 1vw 0;
  }
  #main #tabRecommend .tabs .title.-active {
    border: 1px solid #f9647e;
  }
  #main #tabRecommend .tabs .title.-active::before {
    height: 1vw;
    bottom: -0.6vw;
  }
  #main #tabRecommend .tabacc.-pc-tab > .tabs > .title:not(:first-child),
  #main #tabRecommend .tabacc.-sp-tab > .tabs > .title:not(:first-child) {
    margin: 0 0 0 2vw;
  }
  #main #tabRecommend .contents {
    padding: 3.5vw 0 0;
    border: none;
  }
  #main #tabRecommend .contents .toko_reclist {
    margin: 3.5vw 0 0;
  }
  #main #tabRecommend .contents .contentInner {
    width: 100%;
    padding: 0 2.5vw 2.5vw;
  }
}
/* sns widget Instagram */
#main section#sns .sns_inner {
  width: 980px;
  margin: auto;
  display: flex;
  justify-content: space-between;
}
#main section#sns .sns_inner .sns_cont {
  width: 48%;
}
#main section#sns .sns_inner .sns_cont .toko_insacc {
  margin-bottom: 20px;
}
#main #sns #instaWidget::after {
  content: "";
  display: block;
  clear: both;
}
#main section#sns #instaWidget {
  list-style: none;
  display: -ms-grid;
  display: grid;
  gap: 10px;
  -ms-grid-columns: 1fr 1fr 1fr;
  grid-template-columns: 1fr 1fr 1fr;
}
#main section#sns #instaWidget li {
  float: left;
  width: 100%;
}
#main section#sns #instagram #instaWidget li > p {
  height: 0px;
  padding-bottom: 100%;
  overflow: hidden;
}
#main section#sns #instagram #instaWidget li > p img {
  -o-object-fit: cover;
  object-fit: cover;
}
#main section#sns #instagram #instaWidget li:first-child {
  -ms-grid-row: 1;
  -ms-grid-row-span: 2;
  grid-row: 1 / 3;
  -ms-grid-column: 1;
  -ms-grid-column-span: 2;
  grid-column: 1 / 3;
}
#main section#sns #instagram #instaWidget li:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  grid-row: 1/ 2;
  -ms-grid-column: 3;
  -ms-grid-column-span: 1;
  grid-column: 3 / 4;
}
#main section#sns #instagram #instaWidget li:nth-child(3) {
  -ms-grid-row: 2;
  -ms-grid-row-span: 1;
  grid-row: 2 / 3;
  -ms-grid-column: 3;
  -ms-grid-column-span: 1;
  grid-column: 3 / 4;
}
#main section#sns .toko_inner_insta + p {
  margin: 70px 0 0;
}
#main section#sns .toko_inner_insta .toko_btn {
  margin-top: 20px;
}
@media screen and (max-width: 979px) {
  #main section#sns .sns_inner {
    width: 100%;
    flex-direction: column;
  }
  #main section#sns .sns_inner .sns_cont {
    width: 100%;
    margin-bottom: 60px;
  }
  #main section#sns #instaWidget {
    list-style: none;
    display: -ms-grid;
    display: grid;
    gap: 10px;
    -ms-grid-columns: 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr;
  }
  #main section#sns #instaWidget li {
    float: left;
    width: 100%;
  }
  #main section#sns #instagram #instaWidget li > p {
    height: 0px;
    padding-bottom: 100%;
    overflow: hidden;
  }
  #main section#sns #instagram #instaWidget li > p img {
    -o-object-fit: cover;
    object-fit: cover;
  }
  #main section#sns #instagram #instaWidget li:first-child {
    -ms-grid-row: 1;
    -ms-grid-row-span: 2;
    grid-row: 1 / 3;
    -ms-grid-column: 1;
    -ms-grid-column-span: 2;
    grid-column: 1 / 3;
  }
  #main section#sns #instagram #instaWidget li:nth-child(2) {
    -ms-grid-row: 1;
    -ms-grid-row-span: 1;
    grid-row: 1/ 2;
    -ms-grid-column: 3;
    -ms-grid-column-span: 1;
    grid-column: 3 / 4;
  }
  #main section#sns #instagram #instaWidget li:nth-child(3) {
    -ms-grid-row: 2;
    -ms-grid-row-span: 1;
    grid-row: 2 / 3;
    -ms-grid-column: 3;
    -ms-grid-column-span: 1;
    grid-column: 3 / 4;
  }
  #main section#sns #instagram #instaWidget li:nth-child(4) {
    -ms-grid-row: 3;
    -ms-grid-row-span: 2;
    grid-row: 3 / 5;
    -ms-grid-column: 1;
    -ms-grid-column-span: 2;
    grid-column: 1 / 3;
  }
  #main section#sns #instagram #instaWidget li:nth-child(5) {
    -ms-grid-row: 3;
    -ms-grid-row-span: 1;
    grid-row: 3 / 4;
    -ms-grid-column: 3;
    -ms-grid-column-span: 1;
    grid-column: 3 / 4;
  }
  #main section#sns #instagram #instaWidget li:nth-child(6) {
    -ms-grid-column: 3;
    -ms-grid-column-span: 1;
    grid-column: 3 / 4;
    -ms-grid-row: 4;
    -ms-grid-row-span: 1;
    grid-row: 4 / 5;
  }
  .toko_inner_insta + p {
    margin: 50px 0 0;
  }
}
/* sns widget Youtube */
#main .toko_topmov .sns_inner {
  width: 980px;
  margin: auto;
  display: flex;
  justify-content: space-between;
}
#main .toko_topmov .sns_inner .sns_cont {
  width: 48%;
}
#main .toko_topmov .sns_inner .sns_cont .toko_insacc {
  margin-bottom: 20px;
}
#main .toko_topmov .youtubeContainer {
  width: 100%;
  /* flex-direction: column; */
  display: flex;
  justify-content: space-between;
}
#main .toko_topmov .youtubeContainer > div {
  margin-bottom: 30px;
}

@media screen and (max-width: 979px) {
  #main .toko_topmov .sns_inner {
    width: 100%;
    flex-direction: column;
  }
  #main .toko_topmov .sns_inner .sns_cont {
    width: 100%;
    margin-bottom: 30px;
  }
}

/*　CLINIC　*/
#main .toko_clinic {
  padding: 110px 0 80px;
}
#main .toko_clinic .toko_cliheight {
  min-height: unset;
}
#main .toko_clinic .toko_clibtn {
  justify-content: center;
}
@media screen and (max-width: 979px) {
  #main .toko_clinic {
    padding: 60px 0;
  }
}

/* クリニック一覧 */
#main .ac_ar_002.area-04 {
  margin-top: 0;
  padding: 80px 0;
}

/* 監修医師紹介 */
#main #kansyu .kansyu_cont .col.left .dr_cont .dr_info .dr_link {
  margin-top: 15px;
}
@media screen and (min-width: 980px) {
  #main #kansyu .kansyu_cont .col.right {
    flex: 1.5;
  }
}
@media screen and (max-width: 979px) {
	#main #kansyu .kansyu_cont .col.left .dr_cont .dr_info {
		width: 100%;
	}
  #main #kansyu .kansyu_cont .col.left .dr_cont .dr_info .dr_name_cont img {
		width: Min(50vw,252px);
	}
}