.container {
  font-family: serif;
}

/*ヘッダー部分*/
.header {
  display: flex;
  justify-content: center;
  margin-bottom: 10px;
}

.header-clinic-logo {
  width: 100px;
  padding: 15px 15px 0 15px;
}

.header-clinic-logo img {
  width: 60px;
  height: 50px;

}

.header-clinic-name {
  width: 100%;
  margin-top: 15px;
}

.header-clinic-name h1 {
  font-family: sans-serif;
  font-size: 30px;
  line-height: 50px;
  font-weight: bold;
  color: #707070;
  text-shadow: 1px 2px #CBCBCB;
}

.header-clinic-nav {
  width: 60px;
  margin: 30px 15px 0 30px;
  align-items: center;
  text-align: center;
}

.menu-btn {
  position: fixed;
  top: 10px;
  right: 10px;
  display: flex;
  height: 60px;
  width: 60px;
  justify-content: center;
  align-items: center;
  z-index: 90;
  background-color: #FFFFFF;
}
.menu-btn span,
.menu-btn span:before,
.menu-btn span:after {
  content: '';
  display: block;
  height: 3px;
  width: 25px;
  border-radius: 3px;
  background-color: #707070;
  position: absolute;
}
.menu-btn span:before {
  bottom: 8px;
}
.menu-btn span:after {
  top: 8px;
}

#menu-btn-check:checked ~ .menu-btn span {
  background-color: rgba(255, 255, 255, 0);/*メニューオープン時は真ん中の線を透明にする*/
}
#menu-btn-check:checked ~ .menu-btn span::before {
  bottom: 0;
  transform: rotate(45deg);
}
#menu-btn-check:checked ~ .menu-btn span::after {
  top: 0;
  transform: rotate(-45deg);
}

#menu-btn-check {
  display: none;
}

.menu-content {
  width: 250px;
  position: fixed;
  top: 70px;
  right: -300px;
  z-index: 80;
  background-color: rgba(255, 255, 255, 0.95);
  text-align: right;
  transition: all 0.5s;
}

.menu-content li {
  color: #3B3B3B;
  margin: 30px 10px 20px 0;
}

#menu-btn-check:checked ~ .menu-content {
  right: 0;/*メニューを画面内へ*/
}

.header-clinic-nav-desktop {
  display: none;
}

/*コンテンツ部分*/
.contents {
  max-width: 500px;
  margin: 0 auto 70px auto;
}

.main-title {
  font-size: 21px;
  font-weight: bold;
  color: #3B3B3B;
  text-align: center;
  margin-bottom: 20px;
}

.main-pic {
  display: block;
  width: 365px;
  height: 200px;
  margin: 0 auto 30px auto;
}

.main-text {
  text-align: center;
  color: #3B3B3B;
  margin-bottom: 30px;
}

.information {
  display: flex;
  align-items: center;
  width: 365px;
  height: 100px;
  margin: 0 auto 30px auto;
  font-size: 12px;
  color: #3B3B3B;
}

.information-date {
  width: 100px;
  text-align: center;
  border-right: 1px solid #3B3B3B;
  margin: 0 10px 0 10px;
}

.information-text {
  width: 200px;
}

.sub-title {
  text-align: center;
  color: #3B3B3B;
  margin-bottom: 50px;
}

.content {
  width: 340px;
  margin: 0 auto 50px auto;
}

.content h3 {
  font-size: 15px;
  font-weight: bold;
  color: #ffffff;
  line-height: 24px;
  text-align: center;
  margin: 0 auto 30px auto;
  background-color: #84A640;
}

.wrap h5 {
  font-size: 13px;
  color: #3B3B3B;
  border-bottom: 1px solid #84A640;
  margin-bottom: 5px;
}

.wrap-inner {
  display: flex;
  font-size: 12px;
  color: #3B3B3B;
}

.items div {
  display: flex;
  margin-bottom: 30px;
}

.item-title {
  width: 90px;
  text-align: right;
}

.item-text {
  width: 240px;
  margin-left: 10px;
}

/*アクセス部分*/
.information-about-clinic {
  margin-bottom: 60px;
  text-align: center;
}

.information-access {
  margin-bottom: 60px;
}

.information-access h3 {
  text-align: center;
  font-size: 21px;
  font-weight: bold;
  color: #3B3B3B;
}

.information-address-top {
  display: flex;
  justify-content: center;
}

.clinic-logo {
  height: 50px;
  margin: 15px 15px 10px 0;
}

.clinic-name {
  font-family: sans-serif;
  font-size: 30px;
  line-height: 50px;
  font-weight: bold;
  color: #707070;
  text-shadow: 1px 2px #CBCBCB;
  margin-top: 15px;
}

.information-address-middle {
  margin-bottom: 20px;
}

.information-address-middle p {
  font-size: 12px;
  color: #3B3B3B;
  line-height: 20px;
  text-align: center;
}

.map {
  width: 327px;
  height: 180px;
  display: block;
  margin: 0 auto;
}

/*フッター部分*/
.footer-contents {
  width: 100%;
  background-color: #F2F7F3;
  padding: 15px 20px 10px 25px;
  margin-bottom: 20px;
}

.footer-content-top ul {
  width: 300px;
  margin: 0 auto 20px auto;
  color: #3B3B3B;
}

.footer-content-top li {
  margin-bottom: 20px;
  font-size: 12px;
}

.footer-content-bottom {
  display: flex;
  align-items: center;
  justify-content: center;
}

.footer-clinic-logo img {
  height: 50px;
  margin-right: 15px;
}

.footer-clinic-name {
  font-family: sans-serif;
  font-size: 30px;
  line-height: 50px;
  font-weight: bold;
  color: #707070;
  text-shadow: 1px 2px #CBCBCB;
  margin-right: 10px;
}

.copyright {
  text-align: center;
  font-size: 10px;
  color: #3B3B3B;
}