@charset "utf-8";
/* CSS Document */
html {
  font-size: 16px;
  font-family: "a-otf-ud-shin-go-pr6n", sans-serif;
}
body {
  margin: 0;
  padding: 0;
}
main {
  width: 90%;
  max-width: 62.5rem;
  margin: 0 auto;
  box-sizing: border-box;
  line-height: 1.8;
  color: #333333;
  background-color: #fff;
  margin-top: 7rem;
}
h2 {
  scroll-margin-top: 7rem; /* ヘッダーの高さと同じ値を設定 効いてない・・ */
  max-width: 100%;
  font-family: "a-otf-ud-shin-go-pr6n", sans-serif;
  font-size: 1.875rem;
  font-weight: bold;
  letter-spacing: 0.2em;
  text-align: left;
  border-bottom: 1px solid #333;
  margin: 6.25rem 0 3.75rem;
  padding-bottom: 0.625rem;
}
h3 {
  font-size: 1.25rem;
  font-weight: bold;
  letter-spacing: 0.1em;
  padding-bottom: 1.25rem;
}
p {
  font-size: 1rem;
  line-height: 1.8;
  letter-spacing: 0.05em;
}
a {
  transition: all 0.5s ease;
}
a:hover {
  opacity: 0.5;
  cursor: pointer;
}
a .ja:active {
  color: #97CDF3
}
/*ーーーーーーーーーーー
	 ヘッダーNav
ーーーーーーーーーーーー*/
header {
  width: 100%;
  /*height: 5.625rem;*/
  background-color: #fff;
  padding: 1rem 3.125rem;
  z-index: 100;
  position: fixed;
  box-sizing: border-box;
  left: 0;
  box-shadow: 0px 10px 10px -6px rgba(0, 0, 0, 0.2);
}
.header_inner {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 0 auto;
}
header nav ul {
  padding: 0;
  margin: 0;
  display: flex;
}
header nav li {
  padding-left: 2.5rem;
  font-family: "a-otf-ud-shin-go-pr6n", sans-serif;
  text-align: center;
}
header nav a {
  color: #333;
}
.header_left {
  display: flex;
  align-items: center;
}
header p {
  padding-left: 1.25rem;
}
/*日本語*/
.ja {
  font-size: 1rem;
  display: block;
  padding-bottom: 0.9375rem;
}
/*英語*/
.en {
  font-size: 0.8125rem;
  display: block;
  color: #97CDF3;
}
/*ーーーーーーーーーーー
  　　　　MV
ーーーーーーーーーーーー*/
#fv_container {
  width: 100%;
  position: relative;
}
/* MVテキスト */
#fv_container h1 {
  position: absolute;
  top: 20%;
  left: 10%;
  font-family: "a-otf-ud-shin-go-pr6n", sans-serif;
  color: #fafafa;
  font-size: 3em;
  z-index: 10;
  text-shadow: 0px 0px 18px rgba(3, 114, 154, 1);
  line-height: 1.8;
  letter-spacing: 0.4em;
  font-weight: bold;
}
/* MV画像 */
#fv {
  max-width: 100%;
  display: block;
  margin: 0 auto;
}
/*ーーーーーーーーーーー
　  重要なお知らせ
ーーーーーーーーーーーー*/
#important_notice {
  position: absolute;
  bottom: 0;
  right: 0;
  background-color: #F0D0EB;
  font-family: "a-otf-ud-shin-go-pr6n", sans-serif;
  padding: 1.25rem;
  text-align: left;
  max-width: 25rem;
  z-index: 10;
}
#important_notice h3 {
  font-size: 1.2em;
  margin-bottom: 0.625rem;
  text-align: center;
}
#important_notice p {
  font-size: 0.9em;
  line-height: 1.4;
}
.important_notice_text {
  display: flex;
}
.important_notice_text p:first-child {
  width: 30%;
  font-weight: bold;
}
/*ーーーーーーーーーーー
  　　診療科目アイコン
ーーーーーーーーーーーー*/
#icon_wrapper {
  width: 100%;
  justify-content: center;
  align-items: center;
  margin-left: auto;
  margin-right: auto;
}
#icon_wrapper img {
  box-shadow: 0px 10px 10px -6px rgba(0, 0, 0, 0.2);
}
.icon_container {
  display: flex;
  justify-content: center;
  align-items: center; /*外来とその他のアイコンを揃える*/
}
.icon_column {
  display: flex;
  flex-direction: column;
}
.icon_row {
  display: flex;
  justify-content: center;
  margin-bottom: 10px;
}
.icon_row a {
  margin: 0 0.3125rem;
}
img {
  max-width: 100%;
  height: auto;
}
/*ーーーーーーーーーーー
     NEWS
ーーーーーーーーーーーー*/
#news {
  background-color: #97CDF3;
  padding: 3.125rem;
  text-align: center; /* 全体の中央寄せ */
  margin-top: 7rem;
  margin-bottom: 1rem;
  ;
  box-shadow: 0px 10px 10px -6px rgba(0, 0, 0, 0.2);
}
#news h2 {
  margin-top: 0;
  border-bottom: 1px solid #000;
  padding-bottom: 0.625rem;
}
.news_container {
  width: 100%;
  max-width: 62.5rem;
  margin: 0 auto;
}
.news_item {
  display: flex;
  align-items: flex-start;
  margin-bottom: 1em;
  max-width: 62.5rem;
  background-color: #fafafa;
  padding: 1.25rem 3rem;
}
.news_item dt {
  min-width: 6em;
  font-weight: bold;
  margin-right: 2em;
  text-align: left;
  line-height: 1.5;
  letter-spacing: 0.05em;
}
.news_item dd {
  margin: 0;
  text-align: left;
  flex: 1;
  line-height: 1.5;
  letter-spacing: 0.05em;
}
.address {
  display: flex;
  justify-content: space-around;
  align-items: center;
}
iframe {
  max-width: 100%;
  display: block;
}
/*ーーーーーーーーーーー
     Table
ーーーーーーーーーーーー*/
#schedule {
  width: 100%;
  max-width: 62.5rem;
  margin: 0 auto;
  font-family: "a-otf-ud-shin-go-pr6n", sans-serif;
}
#schedule table {
  width: auto;
  min-width: 100%;
  margin: 0 auto;
}
#schedule th, #schedule td {
  padding: 0.625rem;
  text-align: center;
}
#schedule thead th {
  padding: 0.625rem;
  text-align: center;
  border-bottom: 1px solid #ccc;
}
#schedule tbody th {
  padding: 1.25rem;
  text-align: center;
  border-right: 1px solid #ccc;
}
#schedule .available {
  display: inline-block;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: #7FD9D2; /* 水色の丸 */
}
#schedule table, #schedule th, #schedule td {
  border: none;
  border-bottom: 1px solid #ccc;
}
.day th:nth-child(2) {
  border-left: 1px solid #ccc;
}
/*ーーーーーーーーーーー
     提携病院 →　動かさない
ーーーーーーーーーーーー*/
#hospitals {
  width: 100%;
  max-width: 62.5rem;
  margin: 6.25rem auto 7.5rem;
  font-family: "a-otf-ud-shin-go-pr6n", sans-serif;
  font-size: 1.25rem;
  font-weight: 500;
  line-height: 1.8;
}
.hospital_list {
  display: flex;
  justify-content: space-between;
}
.hospital_list li {
  margin-bottom: 1.25rem;
}
.hospital_list a {
  width: 25rem;
  display: inline-block;
  padding: 0.625rem 1.25rem;
  border: 1px solid #97CDF3;
  border-radius: 5px;
  color: #97CDF3;
  background-color: #fff;
  text-align: center;
  box-shadow: 5px 5px 0px 0px rgba(112, 156, 185, 0.8), 10px 10px 0px 0px rgba(112, 156, 185, 0.3)
}
.hospital_list a:hover {
  background-color: #97CDF3;
  color: #000;
}
/*ーーーーーーーーーーー
  下層①　お問い合わせフォーム
ーーーーーーーーーーーー*/
/* 全体 */
.wrapper {
  max-width: 62.5rem;
  margin: 0 auto;
  padding: 1rem; /* 全体に適度なパディングを追加 */
}
/* お問い合わせフォームエリア */
#contact #foam_area {
  width: 100%;
  background-color: #E6F0F0;
  border-radius: 5px;
  box-sizing: border-box;
  font-family: "a-otf-ud-shin-go-pr6n", sans-serif;
  padding: 2rem;
}
#contact #foam_area h3 {
  padding: 0.5rem;
  margin-bottom: 1.5rem;
  border-left: 10px solid #7FD9D2;
  font-size: 1.2rem;
}
#contact dt, #customer_info dt {
  margin-bottom: 0.5rem;
  font-weight: bold;
}
#contact dd, #customer_info dd {
  margin-bottom: 3rem;
}
/* ラジオボタン */
#radio {
  display: flex;
}
#radio li {
  margin-bottom: 0.5rem;
  margin-right: 1.5rem; /* ラジオボタンの間隔を調整 */
}
label:hover {
  cursor: pointer;
}
/* 入力フィールド */
#contact .input_text, textarea, select {
  width: 100%;
  padding: 0.75rem;
  border: 1px solid #ccc;
  border-radius: 0.25rem;
  box-sizing: border-box;
  font-size: 1rem;
  margin-top: 0.3rem;
}
#contact .name, select {
  width: 20em;
}
#contact textarea {
  height: 6rem;
}
/* 必須項目 */
#contact sup {
  margin-left: 0.25rem;
  padding: 0.1rem 0.4rem;
  background-color: #E8204E;
  color: #fff;
  font-size: 0.7rem;
  border-radius: 5px;
  vertical-align: super;
}
/* プライバシーポリシー */
.privacypolicy {
  text-align: center;
  margin-top: 2rem;
  margin-bottom: 2rem;
}
.privacypolicy p {
  margin-bottom: 1rem;
}
/* 確認ボタン */
#Btn_check {
  text-align: center;
  margin-top: 3rem;
}
#foam_area button {
  width: 12.5rem;
  padding: 0.9375rem 0;
  color: #fff;
  background-color: #7FD9D2;
  transition: 0.2s ease-in-out 0s;
  cursor: pointer;
  border: none;
}
#foam_area button:hover {
  opacity: 0.7;
}
/*ーーーーーーーーーーー
  下層②　当院について
ーーーーーーーーーーーー*/
#about_container {
  max-width: 62.5rem;
  margin-bottom: 10rem;
}
/* 院長セクション */
#doctor {
  font-family: "Zen Kurenaido", serif;
  font-size: 2.5rem;
  padding: 2rem;
}
#about_container {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
#about_container img {
  max-width: 80%;
  margin-left: 3rem;
  box-shadow: 25px 25px 0px 0px rgba(127, 217, 210, 1), 30px 30px 0px 0px rgba(127, 217, 210, 0.3), 35px 35px 0px 0px rgba(127, 217, 210, 0.2), 40px 40px 0px 0px rgba(127, 217, 210, 0.1);
}
#about_container p {
  text-align: left;
  font-size: 1rem;
  line-height: 1.6;
  margin-bottom: 3rem;
}
.about_text {
  max-width: 40%;
}
/* 地域医療セクション */
#community {
  background: url("../img/bg_green.png") center/cover no-repeat;
  padding: 3rem 13.125rem;
}
.community_item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 3rem;
}
#community p {
  text-align: left;
  font-size: 1rem;
  line-height: 1.6;
  padding: 2rem;
}
.community_item h3 {
  text-align: center;
}
/*ーーーーーーーーーーー
  　　　フッター
ーーーーーーーーーーーー*/
.footer {
  width: 100%;
  box-sizing: border-box;
  display: flex;
  justify-content: space-between;
  padding: 3.125rem;
}
.footer_column {
  width: 20%;
}
.footer_column li {
  margin-bottom: 0.625rem;
}
.footer_column a:hover {
  color: #97CDF3
}
#copyright {
  width: 100%;
  font-family: "Open Sans", sans-serif;
  font-weight: lighter;
  background-color: #97CDF3;
  color: #fff;
  text-align: center;
  padding: 0.625rem;
  box-sizing: border-box;
}
/*ーーーーーーーーーーーーーーーータブレット以下時の表示ーーーーーーーーーーーーーーー*/
@media (max-width: 768px) {
  body {
    font-size: 0.875rem;
    text-align: center;
  }
  main {
    width: 100%;
    margin: 3rem auto 0;
  }
  h2 {
    font-size: 1.5rem;
    margin: 2em auto;
  }
  .sinryou_h2 {
    margin-top: 0;
  }
  section {
    margin-bottom: 2rem;
  }
  /* Header */
  header {
    padding: 0 1.25rem;
    height: 4rem;
  }
  .header_inner {
    flex-direction: column;
    align-items: flex-start;
    padding: 1rem;
  }
  .header_left {
    margin-bottom: 5px;
  }
  .header_logo {
    width: 50%;
  }
  header p {
    display: none;
  }
  nav {
    display: none;
    width: 100%;
    text-align: center;
    margin-top: 10px;
  }
  nav ul {
    flex-direction: column;
    padding: 0;
  }
  nav li {
    padding: 0.625rem 0;
    border-bottom: 1px solid #ccc;
  }
  nav a {
    display: block;
  }
  nav.active {
    display: block;
  }
  /* MV */
  #fv_container {
    width: 100%;
    box-sizing: border-box;
  }
  #fv {
    width: 100%;
    height: auto;
    display: block;
    padding-top: 3rem;
  }
  #fv_container h1 {
    font-size: 2em;
    position: absolute;
    top: 40%;
    left: 10%;
  }
  /* 重要なお知らせ */
  #important_notice {
    width: calc(100% - 50px);
    margin-right: auto;
    margin-left: auto;
    position: relative;
    margin-top: 0.8rem;
  }
  #important_notice h3 {
    padding-bottom: 0;
  }
  /*アイコン*/
  #icon_wrapper {
    width: 90%;
    flex-direction: column;
    align-items: center;
  }
  #icon_wrapper img[alt="外来アイコン"] {
    width: 60%;
    height: auto;
  }
  .icon_container {
    flex-direction: column;
    align-items: center;
  }
  /*NEWS*/
  #news {
    margin: 1.25rem auto;
    padding: 1rem;
  }
  .news_item {
    padding: 1rem;
  }
  .news_item dt {
    margin-right: 0;
  }
  .news_item:last-child, .news_item:nth-child(2) {
    display: none;
  }
  #news h2 {
    margin-top: 0;
  }
  /*アクセス*/
  #access {
    width: 90%;
    margin: 0 auto;
  }
  .address {
    display: flex;
    flex-direction: column;
  }
  .address p:first-child {
    width: 100%;
    margin-bottom: 10px;
  }
  #access h3 {
    font-size: 18px;
    text-align: left;
  }
  /* 休診日 Table */
  #schedule {
    width: 90%;
    margin: 1.25rem auto;
  }
  table {
    width: 100%;
    font-size: 0.75rem;
  }
  #schedule th, #schedule td {
    padding: 0.3125rem;
  }
  /* 提携病院 Partners */
  #hospitals {
    width: 90%;
    margin: 1.25rem auto;
  }
  #hospitals .hospital_list {
    flex-direction: column;
  }
  #hospitals .hospital_list li {
    width: 100%;
  }
  #hospitals .hospital_list a {
    width: 80%;
    box-sizing: border-box;
  }
  .footer {
    padding: 1rem;
  }
  .footer_column {
    text-align: left;
  }
  .footer a {
    font-size: 0.8rem;
  }
  /*    お問い合わせフォーム*/
  .wrapper {
    padding: 0.25rem;
  }
  #foam_area {
    padding: 1rem;
    text-align: left;
  }
  #foam_area h3 {
    font-size: 1rem;
    margin-bottom: 0.75rem;
    text-align: left;
    /* 左寄せ */
  }
  #contact dt, #customer_info dt {
    margin-bottom: 0.2rem;
    text-align: left;
    /* 左寄せ */
  }
  #contact dd, #customer_info dd {
    margin-bottom: 2rem;
  }
  textarea {
    height: 4rem;
  }
  #radio {
    flex-direction: column;
    align-items: flex-start;
  }
  #radio li {
    margin-bottom: 0.5rem;
    margin-right: 0; /* 間隔をリセット */
  }
  .privacypolicy {
    margin-top: 1rem;
    margin-bottom: 1rem;
  }
  #about_container {
    flex-direction: column;
    align-items: center;
    margin-bottom: 5rem;
  }
  #about_container img {
    max-width: 100%;
    margin-left: 0;
    margin-bottom: 1rem;
    box-shadow: none;
  }
  .about_text {
    max-width: 100%;
  }
  #about_container p {
    text-align: left;
  }
  /* 地域医療セクション */
  #community {
    padding: 1rem;
    text-align: center;
  }
  .community_item {
    flex-direction: column;
    align-items: center;
    margin-bottom: 2rem;
  }
  .community_item:nth-child(2) {
    flex-direction: column-reverse;
  }
  .community_item h3 {
    text-align: center;
  }
  #community p {
    text-align: left;
    padding: 1rem;
  }
  #copyright {
    font-size: 0.5rem;
  }
}