/*tml{
   font-size: 62.5%
}*/
/* { margin: 0px;
    padding: 0px;
   }*/
body{
    line-height: 1.7;
    background: #fff;
    width: 100%;
    font-size: 1rem;
    color: #000;
}
a{
  text-decoration: none;
  font-family: "Noto Sans JP", serif;
  font-weight: 400;
  font-style: normal;
}
.border1{
  border-top: 2px solid #8c8b8b;
  margin-top: 64px;
  padding: 0 0 64px 0;
}
p{
  font-family: "Noto Sans JP", serif;
  font-weight: 400;
  font-style: normal;
}
/*-----------ヘッダー----------*/
/*---ロゴと電話番号住所---*/
.box {
   box-sizing: border-box;
}
/*ロゴ*/
.lo-img{
    height: 9vh;
    margin: 0;
}
.c-header {
  align-items: center;
  box-sizing: border-box;
  display: flex;
  justify-content: space-between;
  padding: 1rem; /* カスタマイズしてください */
  max-width: 1120px;
  margin: 0 auto;
  height: 10vh;
}
.c-header__list {
  box-sizing: border-box;
  display: flex;
  margin: 0;
  padding: 0;
}
.c-header__list-item {
  list-style: none;
  text-decoration: none;
}
.c-header__list-link {
  color: #000; /* カスタマイズしてください */
  display: block;
  margin-right: 20px; /* カスタマイズしてください */
  text-decoration: none;
  padding: 10px 0px; /* カスタマイズしてください */
}
.c-header__list-link:hover {
  filter: opacity(0.6); /* カスタマイズしてください */
}
.c-hamburger-menu {
  position: relative;
}
@media screen and (max-width: 750px) {
  .c-hamburger-menu__list {
    background-color: #eeeeee; /* カスタマイズしてください */
    align-items: flex-start;
    display: flex;
    flex-direction: column;
    left: 0;
    padding: 2rem; /* カスタマイズしてください */
    position: absolute;
    transform: translateX(-100%);
    transition: 0.3s; /* カスタマイズしてください */
    top: 100%;
    width: 100%;
  }
  #hamburger:checked ~ .c-hamburger-menu__list {
    transform: translateX(0%);
    transition: 0.3s;
  }
}
.c-hamburger-menu__input {
  display: none;
}
.c-hamburger-menu__bg {
  background-color: #000; /* カスタマイズしてください */
  cursor: pointer;
  display: none;
  height: 100vh;
  left: 0;
  opacity: 0.4; /* カスタマイズしてください */
  position: absolute;
  top: 0;
  width: 100%;
  z-index: -1;
}

#hamburger:checked ~ .c-hamburger-menu__bg {
  display: block;
}

.c-hamburger-menu__button {
  display: none;
}
@media screen and (max-width: 750px) {
  .c-hamburger-menu__button {
    align-items: center;
    appearance: none;
    background-color: transparent;
    border: none;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    gap: 5px; /* カスタマイズしてください */
    height: 32px; /* カスタマイズしてください */
    width: 32px; /* カスタマイズしてください */
    justify-content: center;
  }
.c-hamburger-menu__button-mark {
  background-color: #000; /* カスタマイズしてください */
  display: block;
  height: 1px; /* カスタマイズしてください */
  transition: 0.3s; /* カスタマイズしてください */
  width: 20px; /* カスタマイズしてください */
}
  #hamburger:checked
    ~ .c-hamburger-menu__button
    .c-hamburger-menu__button-mark:nth-of-type(1) {
    transform: translate(2px, 1px) rotate(45deg); /* カスタマイズしてください */
    transform-origin: 0%; /* カスタマイズしてください */
  }
  #hamburger:checked
    ~ .c-hamburger-menu__button
    .c-hamburger-menu__button-mark:nth-of-type(2) {
    opacity: 0;
  }
  #hamburger:checked
    ~ .c-hamburger-menu__button
    .c-hamburger-menu__button-mark:nth-of-type(3) {
    transform: translate(2px, 3px) rotate(-45deg); /* カスタマイズしてください */
    transform-origin: 0%; /* カスタマイズしてください */
  }
  .lo-img{
    height: 65px;
    margin: 0;
}
.c-header{
  height: 10vh;
}
}
/*-----------main----------*/
.firstview{
      background-image: url(../img/top1.jpg);
      background-size: cover;
      background-position: center;
      height: 90vh;
}
@media screen and (max-width: 520px){
  .firstview{
    background-image: url(../img/top2.jpg);
}
  }
/*------お知らせ------*/
.news{
  margin: 0 auto;
  max-width: 1120px;
}
/*---見出し---*/
.title1{
   font-weight: bold;
   font-size: 26px;
   padding: 1rem 0rem;
   margin-top: 108px;
   border-bottom: 4px solid #00BFFF;
}
/*---お知らせ本文---*/
.news-list{
   list-style: none outside;
   margin: 64px 0px 0px 0px;
   padding: 0;
 }
 .news-list .item a{
   display: flex;
   flex-wrap: wrap;
   flex-wrap: nowrap;
   text-decoration: none;
   border-bottom: 1px solid #CCC;
   padding: 20px 0px 20px 0px;
 }
 .news-list .item:first-child a{
   border-top: 1px solid #CCC;
 }
 .news-list .item .date{
   margin: 0px 29px 0px 0px;
   font-size: 1rem;
   color:black;
 }
 .news-list .item .category{
   margin: 0px 29px 0px 0px;
 }
 .green1{
   background: green;
   color: #FFF;
   text-align: center;
   display: inline-block;
   padding: 7px 10px;
   font-size: 0.8rem;
   width: 74px;
   line-height: 1;
 }
 .red1{
   background: red;
   color: #FFF;
   text-align: center;
   display: inline-block;
   padding: 7px 10px;
   font-size: 0.8rem;
   width: 74px;
   line-height: 1;
 }
 .news-list .item .title{
   margin: 0;
   width: 100%;
 }
 .news-list .item a:hover .title{
   color: #00F;
 }
 
 @media screen and (max-width: 750px){
 .news-list .item a{
   flex-wrap: wrap;
 }
 .news-list .item .date{
   min-width: 80px;
 }
 .news-list .item .title{
   margin-top: 10px;
 }
 }
 @media (max-width: 750px){
  .news{
    width: 90vw;
    margin: 0 auto;
   }
   .news-list{
    margin-top: 48px;
   }
   .news h1{
    margin-top: 96px;
   }
  }
 /*------診療内容------*/
 .sinryou1{
   margin: 0 auto;
   max-width: 1120px;
 }
 .container{
   display: grid;
   row-gap: 48px;
   column-gap: 48px;
   grid-template-columns: repeat(2,1fr);
   margin: 70px auto 0px auto;
   max-width: 848px;
 }
 .naiyou{ 
   width: 400px;
   margin: 0;
 }
 @media (max-width: 750px){
  .sinryou1{
    width: 90vw;
   }
   .naiyou img{
    width: 90vw;
   }
   .container{
    grid-template-columns: 1fr;
  }
  .sinryou1 h1{
    margin-top: 96px;
   }
 }
/*------院長あいさつ------*/
.aisatu{
  height: 900px;
  background-image: url(../img/haikei3.jpg);
  display: flex;
  justify-content: center;
  align-items: center;
}
.aisatu figure img{
 height: 400px;
}
.title2{
  font-weight: bold;
  font-size: 26px;
  padding: 1rem 0rem 1rem 20px;
  border-bottom: 4px solid blue;
}
.text1{
  height: 400px;
  width: 30vw;
  background-color: #FFF;
}
.text1 p{
  font-size: 1rem; 
  margin: 30px 0px 0px 20px;
}
@media (max-width: 750px){
  .aisatu{
    flex-direction: column;
 }
 .aisatu figure img{
  height: 350px;
 }
 .text1{
  width: 233.33px;
  height: 382px;
 }
 .text1 p{
  margin:0px;
  padding: 10px;
 }
}
/*------診療日時・アクセス------*/
/*------ロゴ------*/
.po1{
  margin: 0 auto;
  width: 300px;
}
.ac_time_flex{
  display: flex;
  justify-content: center;
}
.te1{
  height: 200px;
  display:flex;
  flex-flow: column;
  justify-content:space-between;
}
.te1 img{
  width: 200px;
  height: 100px;
}
.ac_time_w{
 display: flex; 
 text-align: center;
 margin-right: 20px;
}
.te2-h{
  font-size: 0.8rem;
  padding: 2px 5px;
  border: 1px solid blue;
  color: #00F;
  margin-right: 20px;
  max-height: 25px;
  text-align: center;
}
.te3-h{
  font-size: 0.8rem;;
  border: 1px solid blue;
  color: #00F;
  max-width: 50px;
  text-align: center;
  padding: 2px 0px 2px 0px;
}
.te1 img{
  width: 332px;
  height: 142px;
}
.ac_time_w p{
  font-size: 0.8rem;
}
@media (max-width: 750px){
  .ac_time_flex{
    flex-direction: column;
    margin: 0 auto;
    max-width: 300px;
 }
 .te1{
  margin-top: 50px;
 }
}
/*------地図------*/
.map1 iframe{
  width: 100%;
  height: 300px;
  margin-top: 96px;
}
@media (max-width: 750px){
  .map1 iframe{
    aspect-ratio: 16 / 9;
    width: 100%;
    height: auto;
  }
}
/*------フッター------*/
.ft_wrapper2{
  background-color: #2C7CFF;
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0;
  margin: 0 0 0 0;
}
.f__item{
  list-style: none;
  display: inline-block;
  text-align: center;
  font-size: 0.8rem;
  padding: 10px 20px 10px 20px;
}
.copyright{
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: blue;
}
.copyright p{
  color: #FFF;
}
@media (max-width: 750px){
  .ft_wrapper2{
    flex-direction: column;
    height: auto;
    padding: 36px 0 36px 0;
 }
}