@charset "utf-8";

body.front main .inner {
	max-width: 1320px;
	margin: auto;
	padding: 0 20px;
}



body.front h2 {
	text-align: center;
	color: #233b68;
	font-size: 1.5em;
	padding-top: 10px;
	padding-bottom: 0px;
  margin-bottom: 20px;
	line-height: 1.4;
  font-family: "Noto Serif JP", serif;
}
body.front h2 .sub_title {
	font-size: 60%;
	display: block;
	text-align: center;
	color: rgb(62, 112, 132);
	padding-bottom: 0.2em;
}
@media (min-width: 960px){
	body.front h2 {
		font-size: 28px;
	}
}


body.front h3 {
	text-align: left;
	line-height: 1.4;
	color: rgb(62, 112, 132);
	text-shadow: none;
	background: transparent;
	outline: none;
	padding: 0px;
	margin: 0px;
	padding-bottom: 15px;
	font-size: 20px;
	font-weight: bold;
}
body.front h3 .sub_title {
	font-size: 60%;
  display: block;
  padding-bottom: 0.2em;
  font-family: "Noto Serif JP", serif;
}
@media (min-width: 960px){
	body.front h3 {
		font-size: 22px;
	}
}

body.front h4 {
	background: transparent;
    padding: 0px;
    border: none;
    filter: none;
    text-shadow: none;
    text-align: left;
    font-size: 19px;
    line-height: 1.5;
    outline-offset: none;
    outline: none;
    color: #333;
    margin: 0 0 1.2em;
}
@media (min-width: 960px){
	body.front h4 {
    	font-size: 20px;
	}
}



/*==================================================================

メイン画像上のテキスト

==================================================================*/

.mainvisual {
	position: relative;
}
.mainvisual_slide img {
  image-rendering: crisp-edges;
  image-rendering: -webkit-optimize-contrast;
  backface-visibility: hidden;
}
.mainvisual_contents_inner {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: grid;
	align-items: center;
	justify-content: end;
/*	font-size: min(2.5vw,32px);*/
  font-size: min(2.3vw,30px);
	padding: 20px;
	line-height: 1;
	text-align: right;
}
.mainvisual_contents_text {
    padding: 20px;
    filter: unset;
    position: relative;
    z-index: 1;
    color: #000;
    text-align: left;
}
@media (min-width: 960px){
  .mainvisual_contents_text {
    right: -20vw;
  }
}
@media (max-width: 559px){
  .mainvisual_contents_text {
    padding: 20px 0;
  }
}
/*
.mainvisual_contents_text::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
    background: rgba(0, 0, 0, 0.5);
	z-index: -1;
  
}
*/
.mainvisual_contents_text {
  line-height: 2;
}
.mainvisual_contents_text .maincopy {
  margin-bottom: -0.5em;
  font-size: 140%;
  font-weight: bold;
  line-height: 1.4;
  text-align: center
}
/*
.mainvisual_contents_text > div:not(:last-child) {
	margin-bottom: 0.5em;
}
*/

  #top_slider {
    position: absolute;
    left: 0;
    top: 0;
  }

@media (max-width: 959px){
	.mainvisual_contents_inner {
		font-size: max(3vw,18px);
		align-items: end;
    justify-content: center;
    position: static;
    margin-top: -0.5em;
	}
  #top_slider img {
    width: 100%;
  }
  .slider {
    overflow: hidden;
  }
}
@media (min-width: 960px){
  .mainvisual {
    max-width: 80%;
    margin: 0 0 auto;
  }
  .mainvisual_contents_inner::after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width:100%;
    height: 100%;
    pointer-events: none;
    background: linear-gradient(90deg, rgba(255,255,255,0) 70%, #fff 95% ,#fff 100%)
  }
}
.mainvisual .slick-slide,
.mainvisual #top_slider:not(.slick-slider) > div:first-child {
    transform: translate3d(0, 0, 0);
}
.mainvisual #top_slider:not(.slick-slider) > div:first-child {
  position: absolute;
  top: 0;
  left: 0;
}
.mainvisual #top_slider:not(.slick-slider) > div:nth-child(n+2) {
  display: none;
}
.mainvisual .slick-list.draggable {
  width: 100%;
  height: 100%;
}
.mainvisual .slick-track {
  height: 100%;
}
.mainvisual #top_slider img {
    image-rendering: crisp-edges; /* 標準 */
    image-rendering: high-quality;
    position: absolute;
    top: 0;
    height: 100%;
    left: 0;
    object-fit: cover;
}
@media (resolution: 2dppx) {
  @media (min-width: 960px){
    .mainvisual .slick-slide img {
      image-rendering: pixelated; /* Safariや旧ブラウザ向け */
      image-rendering: -moz-crisp-edges; /* Firefox向け */
      image-rendering: crisp-edges; /* 標準 */
      filter: blur(0.1px);
    }
  }
}
/*==================================================================

診療メニュー

==================================================================*/

.top__menu {
	display: grid;
	grid-template-columns: repeat(2,1fr);
	margin-top: 30px;
}
.top__menu__box {
	border: 1px solid #f1f1f1;
}
.top__menu__box__text {
	margin-bottom: 0.5em;
	padding-left: 0.8em;
	padding-right: 0.8em;
	padding-bottom: 1.8em;
}
.top__menu__box__link {
	text-align: center;
	padding-bottom: 0.8em;
}

@media (min-width: 960px) {
	.top__menu {
		grid-template-columns: repeat(4,1fr);
	}
}

/*==================================================================

tour

==================================================================*/

.top__tour {
	display: grid;
	grid-template-columns: repeat(1,1fr);
	grid-gap: 30px;
	margin-top: 30px;
}
.top__tour__box {
	display: grid;
	grid-template-columns: 48% auto;
	grid-gap: 1em;
    font-size: 14px;
}
.top__tour__box__title {
	padding: 2px 10px 5px;
	background: #666;
	color: #fff;
	text-align: center;
    margin-bottom: 10px;
	grid-column: 1 / 3;
}
.top__tour__box__img {
    border: 1px solid #fff;
	position: relative;
    margin-bottom: .8em;
}
.top__tour__box__img img {
	outline: 1px solid rgba(255, 255, 255, 0.5);
    outline-offset: -10px;
}

@media (min-width: 960px) {
	.top__tour {
		grid-template-columns: repeat(3,1fr);
	}
	.top__tour__box {
		display: block;
		font-size: unset;
	}
}

#mainvisual ~ .post_box:first-of-type {
	padding-top: 40px;
}

.main_title_greeting {
	letter-spacing: -0.4em;
    white-space: nowrap;
}
.main_title_greeting {
	display: inline-block;
	position: relative;
  overflow: hidden;
}
.main_title_greeting > span {
  opacity: 0;
  transition-duration: 0.2s;
  transition-timing-function: ease-in;
  transition-property: opacity;
    letter-spacing: 0.2em;
}
.main_title_greeting.lazyloaded > span {
  opacity: 1;
}
/* .main_title_greeting::before {
  content: "";
  position: absolute;
  left: 0;
  width: 100%;
  top: 0;
  height: 50%;
  background: #fff;
}
.main_title_greeting::after {
  content: "";
  position: absolute;
  left: 0;
  width: 100%;
  top: 50%;
  height: 50%;
  background: #fff;
}
.lazyloaded.main_title_greeting::before {
  animation: maintext 1s linear 2s both;
}
.lazyloaded.main_title_greeting::after {
  animation: maintext 1s linear 4s both;
}

@keyframes maintext {
  0% {
    left: 0%;
  }
  100% {
    left: 100%;
  }
} */