@charset "UTF-8";
/* ----------------
COMMON
---------------- */
article {
  padding-top: 30px;
  width: 90%;
  margin: 0 auto;
}
.two-col {
  display: flex;
  width: 90%;
  margin: 0 auto;
}
a {
  display: block;
}
/* --- PAGE TITLE ---*/
.pages-title {
  display: flex;
  align-items: center;
}
.pages-title .sp-icon{
  width: 45px;
  height: 45px;
}
.pages-title h3 {
  margin-left: 2rem;
  white-space: nowrap;
}
.pages-title span,.line {
  width: 90%;
  border-top: 2px solid #18585F;
  margin-left: 2rem;
  margin-right: 2rem;
}
/* ----------------
HERO
---------------- */
.hero {
  width: 100vw;
  height: 200px;
  position: relative;
}
.hero .title-img {
  width: 100vw;
  height: 200px;
  object-fit: cover;
}
.hero .title-copy {
  color: #fff;
  font-weight: 500;
  position: absolute;
  bottom: 10%;
  left: 50%;
  transform: translate(-50%, -10%);
}
/* ----------------
診療案内
---------------- */
.menus {
  width: 100%;
  padding-top: 3rem;
}
.menus ul {
  max-width: 65%;
  width: fit-content;
  display: flex;
  justify-content: center;
  margin: 0 auto;
}
li.menu {
  text-align: center;
  padding: 1.2rem 1.8rem;
  border: 2.5px solid #18585F;
  border-radius: 16px;
  margin-right: 0.5rem;
}
li.menu:last-child {
  margin-right: 0;
}
li.menu:hover {
  background-color: #aadce1;
}
li.menu a {
  display: block;
  color: #18585F;
}
.info {
  width: 100%;
  padding-top: 30px;
}
.info > .section-info {
  display: flex;
  width: 80%;
  margin: 0 auto;
  padding-top: 2rem;
}
.info > .section-info .article-img {
  width: 250px;
  height: 150px;
  object-fit: cover;
  margin-right: 3rem;
  background-color: #eee;
}
.info > .sub-info {
  padding-top: 2rem;
}
.sub-info > .bottom-line {
  width: 90%;
  margin: 0 auto;
}
.info > .sub-info > .section-info > p {
  width: 80%;
  margin: 20px auto;
}
.info > .sub-info > p:first-child {
  font-weight: 500;
}
.bottom-line {
  text-decoration-color: #18585F;
  text-decoration-line: underline ;
  text-underline-offset: 6px;
  text-decoration-thickness: 3px;
}
.sub-info.pick-up  {
  width: 80%;
  background-color: #EAF4F5;
  padding: 2rem 0;
  margin: 2rem auto 0;
}
.sub-info.pick-up > .section-info {
  width: 80%;
  font-size: 1.6rem;
  margin: 20px auto;
}
.pick-up > .section-info > ul {
  list-style: disc;
  font-size: 1.6rem;
  padding: 1.5rem 0;
}
.info > .sub-info~.section-info > div > p:nth-child(2) {
  margin-top: 1rem;
  background-color: #EAF4F5;
  padding: 2rem;
}
/* -------TABEL------- */
.brace-info {
  width: 80%;
  border-collapse: collapse;
  table-layout: fixed;
  margin: 3rem auto;
  border-top: 2px solid #18585F; 
  border-bottom: 2px solid #18585F;
}
.brace-info th {
  padding: 1rem;
  font-weight: 500;
  text-align: center;
}
.brace-info > thead > tr:first-child {
  background-color: #EAF4F5;
  border-bottom: 1px solid #18585F;
}
.brace-info td {
  padding: 2rem;
}
.brace-info > thead > tr > th:first-child {
  border-right: 1px solid #18585F;
}
.brace-info > thead > tr:nth-child(2) {
  border-bottom: 1px solid #18585F;
}
.brace-info > tr,
.pragraph-font > td:nth-child(2) {
  border-left: 1px solid #18585F;
  border-right: 1px solid #18585F;
}

.brace-img {
  text-align: center;
}
.brace-img img {
  width: 150px;
}
#sp-table {
  display: none;
}
/* ----------------
院内紹介
---------------- */
.pages-title {
  padding-top: 20px;
}
.clinic-info {
  width: 100%;
  padding-bottom: 20px;
}
.clinic-info:last-child {
  padding-bottom: 50px;
}
.clinic-info > .article-img {
  display: block;
  width: 800px;
  height: 450px;
  object-fit: cover;
  margin: 0 auto;
}
.clinic-info .img-info {
  text-align: center;
  margin-top: 1rem;
}
.two-col.clinic-info {
  display: flex;
  justify-content: center;
  gap: 40px;
}
.two-col.clinic-info div .article-img {
  width: 380px;
  height: 285px;
  object-fit: cover;
}
.two-col.clinic-info .img-info {
  text-align: center;
  margin-top: 1rem;
  max-width: 380px;
}
/* ----------------
スタッフ紹介
---------------- */
.two-col .profile+div .profile .pages-title span, .line {
  margin-right: 0;
}
.profile>.section-info {
  width: 85%;
  padding-top: 15px;
  display: flex;
  margin: 0 auto;
}
.profile .section-info .article-img {
  width: 200px;
  height: 200px;
  object-fit: cover;
  margin-right: 3rem;
}
.profile > .section-info > div > ul {
  font-size: 1.6rem;
  margin: 0;
  padding-bottom: 1.5rem;
}
.profile>.two-col {
  padding-bottom: 30px;
  gap: 2rem;
}
.two-col > .profile {
  width: 50%;
}
.profile:nth-child(2) > .section-info {
  width: 85%;
  padding-top: 15px;
  display: block;
  margin: 0 auto;
}
.doctor {
  margin-bottom: 2rem;
}
.doctor p:nth-child(3) {
  margin-bottom: 1rem;
}
.two-col .section-info-detail:nth-child(2),
.two-col .section-info-detail:nth-child(3) {
  margin-top: 1.5rem;
}
/* ----------------
アクセス
---------------- */
.access-info {
  display: flex;
}
.main-info {
  width: 75%;
}
.aside {
  width: 25%;
}
.access-add {
  margin-left: 5rem;
}
.hospital {
  padding: 30px 0;
  color: #333;
}
.hospital .pages-title span,.line {
  width: 90%;
  border-top: 2px solid #18585F;
  margin-left: 2rem;
  margin-right: 2rem;
}
.hospital ul {
  padding-top: 20px;
  margin-left: 45px;
}
.google-map {
  padding-top: 50px;
}
.access-img {
  width: 400px;
  height: 250px;
  object-fit: cover;
}
.access-img~p {
  padding-bottom: 20px;
}
/* ----------------
リクルート
---------------- */
.recruit > .section-info {
  width: 85%;
  display: flex;
  margin: 0 auto;
}
.recruit > .section-info > .article-img {
  width: 200px;
  height: 200px;
  object-fit: cover;
  margin-right: 3rem;
}
.recruit{
  padding-top: 20px;
}
.recruit .section-info {
  padding-left: 20px;
}
.recruit:last-child {
  margin-bottom: 30px;
}
.ml-2 {
  margin-left: 2rem;
}
/* ----------------
感染予防
---------------- */
.topatient {
  width: 80%;
  margin: 0 auto;
}
.topatient:first-child {
  padding-top: 30px;
}
.topatient > h2,
.topatient > h2~p {
  text-align: center;
}
.topatient > .section-info {
  width: 80%;
  padding-top: 15px;
  margin: 0 auto;
}
.topatient:last-child {
  padding-bottom: 30px;
}
.topatient:nth-child(2)> .pages-title,
.topatient:nth-child(3) > .pages-title {
  padding-top: 0;
}
.article-imgs {
  width: 100%;
  margin-top: 20px;
  display: flex;
  justify-content: center;
  gap: 20px;
  text-align: center;
}
.article-imgs img {
  height: 150px;
  object-fit: cover;
}
.topatient .article-imgs p {
margin-top: 2rem;
}
