@charset "UTF-8";
/* -------------------------------------------------- */
/* file   : top.css                                   */
/* update : 2020                                      */
/* -------------------------------------------------- */
.mv {
  position: relative;
  z-index: 0;
}

.mv img {
  width: 100%;
  max-width: inherit;
}

.mv .li01 {
  width: 100%;
}

.mv .li02 {
  width: 100%;
}

.mv_text {
  position: absolute;
  top: 50%;
  left: 10%;
  z-index: 111;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

.main_imgBox {
    height: 700px;
    overflow: hidden;
    position: relative; }


.main_img {
    z-index:10;
    opacity: 0;
    width: 100%;
    height: 680px;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    position: absolute;
    left: 0;
    top: 0;
    -webkit-animation: anime 30s 0s infinite;
    animation: anime 30s 0s infinite; }
 
	.main_img:nth-of-type(1) {
      -webkit-animation-delay: 0s;
      animation-delay: 0s; 
	background-image: url("../../img/mv01_no.png");}

    .main_img:nth-of-type(2) {
      -webkit-animation-delay: 6s;
      animation-delay: 6s; 
	background-image: url("../../img/mv02_no.png");}

    .main_img:nth-of-type(3) {
      -webkit-animation-delay: 12s;
      animation-delay: 12s;
background-image: url("../../img/mv03_no.png");}

    .main_img:nth-of-type(4) {
      -webkit-animation-delay: 18s;
      animation-delay: 18s; 
background-image: url("../../img/mv04_no.png");}

    .main_img:nth-of-type(5) {
      -webkit-animation-delay: 24s;
      animation-delay: 24s;
background-image: url("../../img/mv05_no.png");}

 
@keyframes anime {
    0% {
        opacity: 0;
    }
    10% {
        opacity: 1;
    }
    20% {
        opacity: 1;
    }
    30% {
        opacity: 0;
         transform: scale(1.05);
                    z-index:9;
    }
    100% { opacity: 0 }
}

@-webkit-keyframes anime {
    0% {
        opacity: 0;
    }
    10% {
        opacity: 1;
    }
    20% {
        opacity: 1;
    }
    30% {
        opacity: 0;
         -webkit-transform: scale(1.1);
            z-index:9;
    }
    100% { opacity: 0 }
}


/* --------------#news_sec------------------- */
#news_sec .sec_wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

.news_wrap {
  width: 82%;
  padding-bottom: 50px;
}

.news_h2 {
  font-size: 25px;
  font-weight: 500;
  font-family: 'Lusitana', serif;
  border-bottom: solid 5px #2f5080;
}

.news_box {
  margin-bottom: 30px;
}

.news_box .news_li {
  width: 100%;
  position: relative;
  padding: 15px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  border-bottom: solid 2px #2f5080;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.news_box a {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}

.news_box .news_date {
  width: 90px;
}

.news_box .news_tit {
  width: calc(100% - 90px);
}

#news_sec .more_btn {
  text-align: right;
  margin-right: 20px;
}

/* --------------#about_sec------------------- */
#about_sec {
  background: url(../../img/about_bg.png) no-repeat bottom center/auto 100%;
  height: 554px;
  position: relative;
}

#about_sec .sec_wrap {
  position: absolute;
  bottom: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  width: 100%;
}

#about_sec .more_btn {
  margin-bottom: 48px;
  margin-top: 20px;
  text-align: right;
}

.about_wrap {
  width: 55%;
}

.top_h2_sub {
  color: #fff;
  font-family: 'Lusitana', serif;
  font-size: 6vw;
  position: relative;
  line-height: 0.9;
}

.top_h2_sub::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: #fff;
}

.top_h2 {
  color: #fff;
  font-family: 'Noto Serif JP', serif;
  font-size: 2.2vw;
  margin-bottom: 15px;
  bottom: 0;
  letter-spacing: 1px;
}

.top_h2 span {
  color: #fff;
  font-family: 'Noto Serif JP', serif;
  font-size: 2.8vw;
}

.text_bg {
  background: #2f5080;
}

.about_text {
  color: #fff;
  font-size: 16px;
}

/* --------------#movie_sec------------------- */
#movie_sec {
  background: #256A82 url("../../img/movie_bg.jpg") no-repeat bottom center/auto 100%;
  height: 394px;
  position: relative;
}

#movie_sec .sec_wrap {
  max-width: 1540px;
  position: absolute;
    top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
	padding: 0 20px;
	display: flex;
	justify-content: space-between;
}
.title_wrap {
  width: 45%;
	text-align: center;
}

#movie_sec .top_h2 {
  color: #fff;
  font-family: 'Noto Serif JP', serif;
  font-size: 2.2vw;
  margin-bottom: 15px;
  bottom: 0;
  letter-spacing: 1px;
}

#movie_sec .top_h2_sub {
	font-size: 4vw;
}

.movie_wrap {
  width: 45%;
	text-align: center;
}

.movie_text{
  color: #fff;
  font-family: 'Noto Serif JP', serif;
  font-size: 1.3vw;
  margin-bottom: 15px;
  bottom: 0;
  letter-spacing: 1px;
  margin: -20px auto 15px;
}

/* --------------#clinic_sec------------------- */
#clinic_sec {
  background: #d9ecff;
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(90%, #d9ecff), color-stop(95%, #f6fbff));
  background-image: linear-gradient(#d9ecff 90%, #f6fbff 95%);
  padding: 95px 0 90px;
  position: relative;
  z-index: 0;
}

.top02_h2_sub {
  font-family: 'Lusitana', serif;
  font-size: 4.2vw;
  position: relative;
  line-height: 1.2;
  text-align: center;
}

.top02_h2_sub::before {
  content: '';
  position: absolute;
  bottom: 8px;
  left: 50%;
  width: 75%;
  height: 1px;
  background: #fff;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}

.top02_h2 {
  font-family: 'Noto Serif JP', serif;
  font-size: 2.8vw;
  text-align: center;
  margin-bottom: 60px;
}

.clinic_li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-bottom: 70px;
}

.kind span {
  color: #fff;
  font-size: 3vw;
  font-weight: bold;
  padding: 10px;
  opacity: 0.8;
}

.clinic_text {
  color: #fff;
  margin-top: 10px;
  padding: 8px 15px;
  min-height: 137px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  opacity: 0.8;
  font-size: 16px;
  position: relative;
}

.clinic_text::before {
  content: '';
  position: absolute;
  bottom: 10px;
  right: 9px;
  width: 48px;
  height: 1px;
  background: #fff;
}

.clinic_text::after {
  content: '';
  position: absolute;
  bottom: 15px;
  right: 8px;
  width: 14px;
  height: 1px;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  background: #fff;
}

.clinic_box {
  width: calc(100% / 3);
  position: relative;
  padding-top: 200px;
  z-index: auto;
}

.clinic_box a {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9;
}

.clinic_box::before {
  content: '';
  width: calc(100% - 40px);
  height: calc(100% + 40px);
  background: #2f5080;
  position: absolute;
  top: -20px;
  left: 20px;
  z-index: -1;
}

.clinic01 {
  background: url(../../img/clinic01.jpg) #fff no-repeat center top/cover;
}

.clinic01 .kind span {
  background: #2c625c;
}

.clinic01 .clinic_text {
  background: #2c625c;
}

.clinic02 {
  background: url(../../img/clinic02.jpg) #fff no-repeat center top/cover;
}

.clinic02 .kind span {
  background: #63407f;
}

.clinic02 .clinic_text {
  background: #63407f
}

.clinic03 {
  background: url(../../img/clinic03.jpg) #fff no-repeat center top/cover;
}

.clinic03 .kind span {
  background: #db7337;
}

.clinic03 .clinic_text {
  background: #db7337;
}

/* --------------#research_sec------------------- */
.top_text {
  font-size: 16px;
  color: #fff;
}

#research_sec {
  background: url(../../img/research_bg.jpg) no-repeat center top/auto 100%;
  height: 418px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

#research_sec .sec_wrap {
  position: relative;
  width: 80%;
  margin-right: 0;
  padding: 0 20px;
}

#research_sec .trapezoid {
  width: 80%;
  background: url(../../img/trapezoid01.png) no-repeat center left/cover;
  height: 100%;
  padding: 20px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#research_sec .top_h2_sub {
  text-align: right;
}

#research_sec .top_h2 {
  margin: 0px auto 10px;
  margin-right: 0;
  font-size: 3.2vw;
  width: 65%;
}

#research_sec .top_text {
  margin: 0 auto 25px;
  margin-right: 0;
  width: 65%;
}

/* --------------#education_sec------------------- */
#education_sec {
  background: url(../../img/education_bg.jpg) no-repeat center top/auto;
  height: 418px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
}

#education_sec .sec_wrap {
  position: relative;
  width: 92%;
  margin-left: 0;
}

#education_sec .trapezoid {
  width: 76%;
  background: url(../../img/trapezoid02.png) no-repeat center right/cover;
}

#education_sec .top_h2 {
  margin-left: 55px;
  font-size: 3.2vw;
  width: 65%;
}

#education_sec .top_text {
  margin-left: 55px;
  margin-bottom: 35px;
  width: 65%;
}

/* --------------#other_sec------------------- */
#other_sec .staff {
  margin: 120px auto 55px;
  position: relative;
  text-align: center;
}

#other_sec .staff img {
  margin: 0 auto;
}

#other_sec .staff .sec_wrap {
  position: absolute;
  bottom: 0px;
  right: 50%;
  width: 100%;
  text-align: right;
  -webkit-transform: translateX(50%);
          transform: translateX(50%);
  margin-bottom: 0;
}

#other_sec .staff .top_h2_sub {
  font-size: 48px;
}

#other_sec .staff .top_h2_sub:before {
  right: 0;
  bottom: 0;
  width: 5em;
  left: inherit;
}

#other_sec .staff .top_h2 {
  font-size: 22px;
  letter-spacing: 0px;
  margin-top: -5px;
}

.other_link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.other_link li {
  width: 32%;
  position: relative;
}

.other_link li a {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.link_name {
  width: 100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  background: #666;
  color: #fff;
  text-align: center;
  font-size: 25px;
  letter-spacing: 2px;
  position: relative;
  padding: 17px 10px;
}

.link_name:before {
  content: '';
  position: absolute;
  bottom: 23px;
  right: 20px;
  width: 48px;
  height: 1px;
  background: #fd824c;
}

.link_name:after {
  content: '';
  position: absolute;
  bottom: 28px;
  right: 19px;
  width: 14px;
  height: 1px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  background: #fd824c;
}

#other_sec .sec_wrap {
  margin-bottom: 100px;
}

/* ---------------全デバイス共通(PC)-end--------------------- */
/*----------------------------------------------------------*/
/* pcホバー用のCSS */
/*----------------------------------------------------------*/
@media screen and (min-width: 560px) {
  /* pc */
  .news_box .news_li:hover {
    opacity: 0.8;
    text-decoration: underline;
  }
  .clinic_box:hover:before {
    -webkit-filter: brightness(1.1);
            filter: brightness(1.1);
    opacity: 0.8;
  }
  .clinic_box:hover a {
    opacity: 0.2;
    background: #fff;
  }
  .other_link li:hover {
    opacity: 0.8;
  }
  #other_sec .staff:hover a {
    opacity: 0.8;
  }
  /* --------------pcホバー用のCSS END----------------- */
}

/*----------------------------------------------------------*/
/* pc設定以上の横幅用のCSS */
/*----------------------------------------------------------*/
@media screen and (min-width: 1690px) {
  /* pc */
  #movie_sec .top_h2_sub {
    font-size: 85px;
  }
 }

@media (min-width: 1400px) and (max-width: 1689px) {
	  /* pc */
  #movie_sec .top_h2_sub {
    font-size: 65px;
  }
 }

@media screen and (min-width: 1400px) {
  /* pc */
  .top_h2_sub {
    font-size: 85px;
  }
  .top_h2 {
    font-size: 30px;
  }
  .top_h2 span {
    font-size: 40px;
  }
  .top02_h2_sub {
    font-size: 60px;
  }
  .top02_h2 {
    font-size: 40px;
  }
  .kind span {
    font-size: 42px;
  }
  #about_sec .top_h2 span {
    letter-spacing: -1px;
  }
  #research_sec .top_h2_sub,
  #education_sec .top_h2_sub {
    font-size: 85px;
  }
  #research_sec .top_h2,
  #education_sec .top_h2 {
    font-size: 45px;
  }
	
.main_imgBox {
    height: 1150px;
    overflow: hidden;
    position: relative; }


.main_img {
    z-index:10;
    opacity: 0;
    width: 100%;
    height: 1150px;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    position: absolute;
    left: 0;
    top: 0;
    -webkit-animation: anime 30s 0s infinite;
    animation: anime 30s 0s infinite; }	
	
  /* --------------pcホバー用のCSS END----------------- */
}

/*----------------------------------------------------------*/
/* tablet用のCSS */
/*----------------------------------------------------------*/
@media screen and (max-width: 959px) {
  /* tablet */
  /* -------------------tablet END------------------------- */
}

/*----------------------------------------------------------*/
/* SP用のCSS */
/*----------------------------------------------------------*/
@media screen and (max-width: 559px) {
  /* sp */
  .mv {
    margin-top: 48px;
  }
  .top_text {
    font-size: 15px;
  }
	
.main_imgBox {
    height: 50vh;
    overflow: hidden;
    position: relative; }

  .main_img {
    z-index:10;
    opacity: 0;
    width: 100%;
    height: 500px;
    background-position: top center;
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    left: 0;
    top: 0;
    -webkit-animation: anime 30s 0s infinite;
    animation: anime 30s 0s infinite; }
 
	.main_img:nth-of-type(1) {
      -webkit-animation-delay: 0s;
      animation-delay: 0s; 
	background-image: url("../../img/mv01_no_sp.png");}

    .main_img:nth-of-type(2) {
      -webkit-animation-delay: 6s;
      animation-delay: 6s; 
	background-image: url("../../img/mv02_no_sp.png");}

    .main_img:nth-of-type(3) {
      -webkit-animation-delay: 12s;
      animation-delay: 12s;
background-image: url("../../img/mv03_no_sp.png");}

    .main_img:nth-of-type(4) {
      -webkit-animation-delay: 18s;
      animation-delay: 18s; 
background-image: url("../../img/mv04_no_sp.png");}

    .main_img:nth-of-type(5) {
      -webkit-animation-delay: 24s;
      animation-delay: 24s;
background-image: url("../../img/mv05_no_sp.png");}

	
	
  /* --------------#news_sec------------------- */
  #news_sec .sec_wrap {
    padding-top: 10px;
  }
  .news_h2 {
    font-size: 24px;
    padding-bottom: 5px;
  }
  .news_box {
    margin-bottom: 15px;
  }
  .news_box .news_li {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    padding: 10px;
  }
  .news_box .news_date {
    width: 100%;
    font-size: 14px;
  }
  .news_box .news_tit {
    width: 100%;
    font-size: 14px;
  }
  .news_wrap {
    width: 100%;
  }
  #news_sec .more_btn {
    text-align: center;
    margin-right: 0px;
  }
  /* --------------#about_sec------------------- */
  #about_sec {
    background: url(../../img/about_bg_sp.png) no-repeat top center/cover;
  }
  #about_sec .more_btn {
    text-align: center;
    margin-bottom: 15px;
  }
  .about_wrap {
    width: 100%;
  }
  .top_h2_sub {
    width: 85%;
    font-size: 42px;
	  line-height: 0.85;
  }
  .top_h2 {
    font-size: 18px;
    text-align: right;
    margin-top: -2px;
  }
  .top_h2 span {
    font-size: 22px;
  }
  .top02_h2_sub {
    font-size: 42px;
  }
  .top02_h2_sub::before {
    bottom: 5px;
  }
  .top02_h2 {
    font-size: 20px;
    margin-bottom: 30px;
  }
	
  /* --------------#movie_sec------------------- */
	#movie_sec {
	  background: url("../../img/movie_bg_sp.jpg") no-repeat top center/cover;
	}

	#movie_sec .sec_wrap {
		position: absolute;
		left: 50%;
		transform: translateX(-50%);
		bottom: 20px;
		padding: 0 20px;
		display: flex;
		flex-direction: column;
	}

	#movie_sec .top_h2_sub {
		width: 100%;
		font-size: 42px;
	 }	

	.title_wrap {
		width: 100%;
		text-align: center;
  		margin-top: 30px;
	}
	.movie_wrap {
		width: 100%;
		text-align: center;
	}
	#movie_sec .top_h2{
		text-align: center;	
	}
	.movie_text{
		font-size: 3.5vw;
	}
	
  /* --------------#clinic_sec------------------- */
  #clinic_sec {
    padding: 35px 10px 30px;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(60%, #d9ecff), color-stop(75%, #f6fbff));
    background-image: linear-gradient(#d9ecff 60%, #f6fbff 75%);
  }
  #clinic_sec .top_h2_sub {
    font-size: 45px;
  }
  .clinic_box {
    width: 100%;
    margin-bottom: 10px;
    padding-top: 170px;
  }
  .clinic_box::before {
    top: -10px;
    height: calc(100% + 20px);
    -webkit-box-shadow: 0 3px 10px 0 grey;
            box-shadow: 0 3px 10px 0 grey;
  }
  .kind span {
    font-size: 18px;
  }
  .clinic_text {
    font-size: 13px;
    min-height: 95px;
  }
  .clinic_li {
    margin-bottom: 20px;
  }
  /* --------------#research_sec------------------- */
  #research_sec {
    height: 318px;
  }
  #research_sec .more_btn {
    text-align: right;
    margin-right: 19px;
  }
  #research_sec .more_btn a {
    width: 53%;
  }
  #research_sec .top_h2_sub {
    margin: auto;
    margin-right: 0;
  }
  #research_sec .sec_wrap {
    width: 100%;
    padding: 60px 0 0;
  }
  #research_sec .top_h2 {
    width: 90%;
    font-size: 20px;
    margin-top: 0;
    margin-left: 10px;
  }
  #research_sec .top_text {
    width: 78%;
    margin: 0 auto 5px;
    margin-right: 0;
  }
  #research_sec .trapezoid {
    background: url(../../img/trapezoid01_sp.png) no-repeat center left/cover;
    width: 100%;
  }
  /* --------------#education_sec------------------- */
  #education_sec {
    height: 318px;
    background: url(../../img/education_bg_sp.jpg) no-repeat right top/cover;
  }
  #education_sec .sec_wrap {
    width: 100%;
  }
  #education_sec .trapezoid {
    background: url(../../img/trapezoid02_sp.png) no-repeat center left/cover;
    width: 100%;
  }
  #education_sec .top_h2 {
    margin-left: 0px;
    font-size: 20px;
    margin-bottom: 5px;
    text-align: left;
    margin-left: 25px;
  }
  #education_sec .more_btn {
    text-align: left;
    margin-left: 25px;
  }
  #education_sec .more_btn a {
    width: 42%;
  }
  #education_sec .top_text {
    margin-left: 25px;
    margin-bottom: 5px;
  }
  /* --------------#other_sec------------------ */
  #other_sec .staff {
    margin: 60px 0 20px;
  }
  #other_sec .sec_wrap {
    margin-bottom: 30px;
  }
  .other_link li {
    width: 100%;
    margin-bottom: 30px;
  }
  .other_link li img {
    width: 100%;
    max-width: inherit;
  }
  .link_name {
    font-size: 20px;
    padding: 12px 10px;
  }
  /* -------------------sp END------------------------- */
}

@media screen and (max-width: 320px) {
  /* sp 小さいサイズ */
  header {
    padding: 10px 5px;
  }
  header .site_name {
    font-size: 9px;
  }
  header .site_name .bold {
    font-size: 9px;
  }
	
   .main_imgBox {
    height: 50vh;
    overflow: hidden;
    position: relative; }
	
  /* ---------------sp  小さいサイズEND-------------------- */
}