@charset "UTF-8";
/* カラー指定　*/
body {
  font-size: 1.125rem;
}

p {
  margin-bottom: 1rem;
}

/* =====================
  よく使うスタイル付与用
===================== */
/* PC改行解除用*/
.u-sp {
  display: none;
}

/* =====================
  ヘッダー
===================== */
.header {
  width: 100%;
  height: 100px;
  position: relative;
  z-index: 100;
  background: none;
}
.header h1 a {
  width: 166px;
  height: 43px;
  margin-top: 18px;
  margin-left: 100px;
  transform: scale(1.2);
}
.header h1 a:before {
  width: 70px;
  height: 76px;
  top: -16px;
  left: -62px;
}
.header .text-scale {
  position: absolute;
  height: 36px;
  top: 0;
  bottom: 0;
  right: 100px;
  margin: auto;
  z-index: 101;
  display: flex;
  justify-content: center;
  align-items: center;
}

/* 文字サイズ調節ボタン  */
.size-button {
  background-color: #fff;
  border: 1px solid #ddd;
  cursor: pointer;
  line-height: 1;
  padding: 0;
  text-align: center;
  width: 30px;
  height: 30px;
  margin: 0 auto;
  transition: all .4s;
}
.size-button-large {
  font-size: 1.275rem;
  width: 36px;
  height: 36px;
  margin-right: 10px;
}
.size-button:hover, .size-button.active {
  border: 1px solid #111111;
  color: #111111;
}

*:focus {
  outline: #111;
}

/* =====================
  ハンバーガーメニュー
===================== */
/* メニュー開いた中 */
.header #navi {
  padding: 6rem 5rem;
  width: 85vw;
  right: -85vw;
  display: flex;
  justify-content: flex-start;
}

.naviopen-content > li {
  font-size: 1.2rem;
  padding: 0;
  position: relative;
}
.naviopen-content > li a {
  display: block;
  padding: 0.4rem 1.5rem;
  transition: .3s ease-in-out;
}
.naviopen-content > li span {
  font-size: 17px;
  margin: 1rem;
}
.naviopen-content > li a:hover {
  background: #F8F8F8;
  color: #999999;
}
.naviopen-content > li:after {
  content: "";
  background: #B5BBC1;
  height: 1px;
  width: 8rem;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  margin: auto;
  transition: .3s ease-in-out;
}
.naviopen-content > li:hover:after {
  width: 1.5rem;
  background: #999999;
}

.naviopen-service li a {
  font-size: 20px;
  background: #fff;
  padding: 0.3rem 2rem;
}
.naviopen-service li a:hover {
  background: #eee;
}

.naviopen-sns {
  width: 85%;
  margin: 15px auto 10px auto;
}
.naviopen-sns li {
  transition: .3s ease-in-out;
  margin-right: 15px;
}
.naviopen-sns li:hover {
  filter: brightness(120%);
}

.naviopen-contact a {
  width: 85%;
  margin: 0 auto;
  padding: 1rem 0;
  background: #111111;
  font-size: 1.2rem;
  letter-spacing: 0.1em;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: .3s ease-in-out;
  position: relative;
}
.naviopen-contact a:hover {
  color: #999999;
}
.naviopen-contact a:after {
  width: 3rem;
  transition: .3s ease-in-out;
}
.naviopen-contact a:hover:after {
  width: 1.5rem;
}

/* ボタン */
.header #nav_btn {
  width: 100px;
  height: 100px;
}

.hamburger_line {
  transition: all .3s;
}
.hamburger_line:nth-child(1) {
  width: 38px;
  top: 37px;
}
.hamburger_line:nth-child(2) {
  width: 26px;
  top: 51px;
}

/* 表示された時用のCSS */
.nav_open .hamburger_line:nth-child(1) {
  top: 40px;
}

.nav_open .hamburger_line:nth-child(2) {
  top: 40px;
  width: 38px;
}

/* インタビューナビ */
#navi .interviewNavi {
  margin: 0;
  width: 44vw;
  height: 44vw;
}
#navi .interviewNavi a {
  font-size: 1.25rem;
}
#navi .contentnavi_2 {
  margin: 0;
  margin-left: 3vw;
}
#navi .contentnavi_2 a {
  width: 20vw;
  margin-bottom: 0.5em;
}


@media screen and (min-width: 1300px) {
  .header #navi {
    width: 1000px;
    right: -1000px;
    padding-right: 6rem;
  }

  .interviewNavi {
    max-width: 500px;
    max-height: 500px;
  }

  .contentnavi_2 {
    margin-left: 5vw;
  }
}
@media screen and (min-width: 1500px) {
  .header #navi .contentnavi_2 a {
    width: 14vw;
  }
}
.interviewNavi {
  width: 33vw;
  height: 28vw;
  margin: 0 auto;
}
.interviewNavi:after {
  font-size: 1rem;
  top: -2.5em;
}
.interviewNavi a {
  font-size: 1.03rem;
  position: relative;
  overflow: visible;
}
.interviewNavi:before {
  left: -30%;
}
.interviewNavi a.contentBtn:after {
  background: rgba(255, 255, 255, 0.8);
  z-index: 2;
}

.interviewNavi .contentBtn h2.btn-title{
  padding: 0.5rem;
  font-size: 1.1vw;
  width: 60%;
  background: rgba(255, 255, 255, 0.8);
}
#nav .interviewNavi .contentBtn h2.btn-title{
  font-size: 1.25rem;
}

@media screen and (min-width: 1300px) {
  .topmain-cotents > .interviewNavi {
    width: 30vw;
    height: 30vw;
  }
  .topmain-cotents > .interviewNavi a {
    font-size: 1.3rem;
  }
}
@media screen and (min-width: 1500px) {
  .topmain-cotents > .interviewNavi {
    width: 26vw;
    height: 26vw;
  }
}
@media screen and (min-width: 1730px) {
  .topmain-cotents > .interviewNavi {
    width: 22vw;
    height: 22vw;
  }
}
/* コンテンツナビ */
.contentnavi_2 {
  width: 20vw;
  margin: 0;
  margin-left: 3vw;
  display: block;
}
.contentnavi_2 a {
  font-size: 1.5rem;
  width: 22vw;
  border-bottom: 1px solid #999999;
  margin: 0 0 1em 0;
  position: relative;
  transition: all .4s;
  display: block;
}
.contentnavi_2 a:hover {
  color: #16850B;
}
.contentnavi_2 a:hover:after {
  width: 100%;
  background: #16850B;
}

/* =====================
  ページの先頭へ戻るボタン
===================== */
#page-top {
  width: 6.25rem;
  height: 3.75rem;
  font-size: 1rem;
  padding-top: 2.5rem;
}
#page-top:hover {
  background: rgba(255, 255, 255, 0.8);
  border: 1px solid #111111;
  color: #111111;
}
#page-top:hover:after {
  background: url("../images/common/arrow.svg") no-repeat;
}
#page-top:after {
  width: 3rem;
  height: 3rem;
  top: 0;
}

/* =====================
  フッター
===================== */
.footer {
  text-align: left;
  padding: 2.5vw 6vw;
  margin-top: 10rem;
}
.footer .hospital-info-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
}
.footer .hospital-info-wrapper ul {
  margin-right: 30px;
  list-style-type: square;
}
.footer .hospital-info-wrapper ul li {
  line-height: 1.5em;
}
.footer .hospital-info {
  display: flex;
}
.footer .hospital-info a {
  transition: all .4s;
}
.footer .hospital-info a:hover {
  opacity: 0.8;
}
.footer .fb {
  margin-right: 2rem;
  margin-bottom: 0;
  transition: all .4s;
}
.footer .fb:hover {
  opacity: 0.8;
}
.footer address {
  font-size: 1.25rem;
  margin-left: 15px;
}
.footer address span {
  font-size: 1rem;
}
.footer small {
  font-size: 0.8rem;
  text-align: right;
  display: block;
}
.footer-inner {
  float: right;
}
.footer:after {
  content: "";
  display: block;
  clear: both;
}

/* =====================
  新着情報
===================== */
.news {
  padding: 5rem 8rem 5rem 0;
  margin-bottom: 0;
}
.news-list article {
  display: flex;
  text-align: left;
  margin-bottom: 2rem;
}
.news-list time {
  font-size: 1.25rem;
  margin-bottom: 0;
  flex-shrink: 0;
}
.news h3 a {
  font-size: 1.25rem;
  transition: all .4s;
}
.news h3 a:hover {
  color: #16850B;
}

/* =====================
  共通スタイル
===================== */
/* タイトル系 */
.page-title {
  font-size: 3rem;
  margin-left: -0.3rem;
}

.btn-title {
  padding: 0.2em 0.5em 0.5em 0.2em;
  font-size: 1.2rem;
}

@media screen and (min-width: 1440px) {
  .btn-title {
    padding: 0.5em 1em 1em 0.5em;
    font-size: 1.75rem;
  }
}
.content-title {
  font-size: 2.25rem;
  margin-bottom: 2rem;
}

.sub-title {
  font-size: 1.5rem;
  margin-bottom: 1rem;
}

.content-category {
  padding-left: 35px;
  transition: all .4s;
}
.content-category:hover {
  color: #16850B;
}

/* 英語タイトル */
.en-title {
  font-weight: 100;
  font-size: 1.75rem;
  margin-bottom: 1rem;
}

/* 画像拡大ボタン */
.contentBtn {
  overflow: hidden;
}
.contentBtn:before {
  transition: all .4s;
}
.contentBtn:hover:before {
  right: -10px;
}
.contentBtn:hover .contentImage {
  transform: scale(1.1);
}

.contentImage {
  transition: all .8s ease;
}

/* リンクボタン */
.linkBtn {
  border: 2px solid #333;
  padding: 1.5rem;
  font-size: 1.25rem;
  line-height: 1.5;
  color: #111111;
}
.linkBtn span {
  font-size: 1rem;
  display: block;
  color: #999999;
}
.linkBtn:hover {
  color: #16850B;
}

/* 中央寄せコンテンツ */
.contentCore {
  max-width: 1300px;
  margin: 0 auto;
  padding: 5rem;
}
.contentCore.pb0 {
  max-width: 1300px;
  margin: 0 auto;
  padding: 5rem 5rem 0;
}

/* リスト */
.list li {
  padding-left: 1rem;
  margin-bottom: 1.5rem;
}

/* olリスト */
.numList li {
  margin-bottom: 1.5rem;
}

/* 説明リスト */
.definition dt {
  width: 18%;
  margin-bottom: 1rem;
  padding-right: 2%;
}
.definition dd {
  width: 78%;
  margin-bottom: 1rem;
  padding-left: 2%;
}

/* 説明リスト2 */
.definition_2 {
  display: flex;
  flex-wrap: wrap;
  border-top: 1px solid #ddd;
}
.definition_2 dt {
  width: 20%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  padding: 2rem;
}
.definition_2 dd {
  width: 80%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  padding: 2rem;
  border-bottom: 1px solid #ddd;
}

/* キャプション */
.caption {
  font-size: 1rem;
}

/* 注釈上付き文字 */
.annotation {
  font-size: 0.7rem;
}

/* 第2階層へ戻るリンク  */
.back-category {
  font-size: inherit;
  margin-left: 5rem;
}
