@charset "utf-8";
/*----------------------------------
	common
-----------------------------------*/
.section-block {
	width: 95%;
	max-width: 1200px;
	margin: 0 auto;
}
.section-block-large {
	position: relative;
    max-width: 1440px;
	margin: 0 auto;
}
.section-ttl {
	font-size: 3.0rem;
	font-weight: 600;
	letter-spacing: 0.2rem;
}
.section-subttl {
	font-family: "Montserrat", sans-serif;
	background: #00a0e9;
	color: #fff;
	font-size: 2.1rem;
	padding: 0.5rem 3.0rem;
	display: inline-block;
	letter-spacing: 0.1rem;
}
main{
	width: 100%;
}
.index-txt {
	font-size: 1.6rem;
}
/*----------------------------------
	keyv
-----------------------------------*/
#index-keyv {
	position: relative;
	width: 100vw;
	height: 48vw;
	margin-bottom: 10.0rem;
}
#index-keyv:after{
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.3);
	z-index: 100;
}
#index-keyv .keyv-txt {
	position: absolute;
	top: 50%;
	right: 5.0rem;
	transform: translate(0, -50%);
	color: #fff;
	z-index: 101;
}
#index-keyv .keyv-txt h2{
	font-size: 5.0rem;
	font-weight: 700;
	letter-spacing: 0.2rem;
	line-height: 1.4;
	margin-bottom: 2.0rem;
}
#index-keyv .keyv-txt h3{
	font-family: "Montserrat", sans-serif;
	font-size: 2.7rem;
	font-weight: 700;
	background: #00a0e9;
	letter-spacing: 0.2rem;
	line-height: 1.4;
	display: inline-block;
	padding: 1.0rem 4.0rem;
}
.slider {
  height: 48vw;
  margin-inline: auto;
  overflow: hidden; /* 画像がはみ出ないようにする */
  width: 100vw;
}
.slick-img img {
  width: 100%;
}
@keyframes zoomUp {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(1.15); /* 拡大率 */
  }
}
.add-animation {
  animation: zoomUp 10s linear 0s normal both;
}
/*----------------------------------
	about
-----------------------------------*/
#index-about {
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	padding: 5.0rem 0;
	margin-bottom: 10.0rem;
}
#index-about .flex-box {
	align-items: center;
}
#index-about .flex-box .index-about-L {
	width: 45%;
}
#index-about .flex-box .index-about-R {
	width: 55%;
}
/*----------------------------------
	advantage
-----------------------------------*/
#index-advantage {
	margin-bottom: 35.0rem;
}
#index-advantage:before{
	content: " ";
	background: #00a0e9;
	position: absolute;
    top: 70px;
    right: 0;
    width: 1000px;
    width: 70%;
    height: 480px;
    z-index: -1;
}
#index-advantage article:after{
    content: "";
    display: table;
    clear: both;
}
#index-advantage .image {
    max-width: 840px;
    width: 58%;
}
#index-advantage .detail {
	position: absolute;
	background: #fff;
	top: 150px;
	right: 120px;
	max-width: 600px;
	padding: 9.0rem 10.0rem;
	box-shadow: 0 10px 25px 0 rgba(0, 0, 0, .5);
}
#index-advantage .section-subttl {
	margin-bottom: 3.0rem;
}
/*----------------------------------
	index-plan
-----------------------------------*/
#index-plan {
	height: 466px;
	margin-bottom: 35.0rem;
}
#index-plan:before{
	content: " ";
	background: #00a0e9;
	position: absolute;
    top: 70px;
    left: 0;
    width: 1000px;
    width: 70%;
    height: 480px;
    z-index: -1;
}
#index-plan article:after{
    content: "";
    display: table;
    clear: both;
}
#index-plan .image {
	position: absolute;
	top: 0;
	right: 0;
    max-width: 840px;
    width: 58%;
    
}
#index-plan .detail {
	position: absolute;
	background: #fff;
	top: 150px;
	left: 120px;
	max-width: 600px;
	padding: 9.0rem 10.0rem;
	box-shadow: 0 10px 25px 0 rgba(0, 0, 0, .5);
}
#index-plan .section-subttl {
	margin-bottom: 3.0rem;
}
/*----------------------------------
	index-column
-----------------------------------*/
#index-column {
	margin-bottom: 10.0rem;
	padding: 5.0rem;
	background: #f1f1f1;
}
.index-column-header {
	text-align: center;
	margin-bottom: 5.0rem;
}
#index-column .column-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
#index-column .column-list li {
  margin: 0;
  display: flex;
  flex-direction: column;
}
#index-column .column-list li:nth-child(3n){
	margin-right: 0;
}
#index-column .column-list li a {
  display: flex;                /* 追加！ */
  flex-direction: column;       /* 追加！ */
  flex: 1 1 auto;               /* 追加！これでaがliの高さに伸びる */
  padding: 2.0rem;
  background: #fff;
  transition: .3s;
  height: 100%;                 /* 追加！（念のため） */
}
#index-column .column-list li a:hover {
	background: #00a0e9;
	color: #fff;
}
#index-column .column-list li a:hover .icon {
	color: #fff;
}
#index-column .column-list li a .image {
	margin-bottom: 2.0rem;
	overflow: hidden;
}
#index-column .column-list li a .image img {
  height: auto;
  transition: transform .6s ease; /* ゆっくり変化させる */
}
#index-column .column-list li a:hover .image img {
  transform: scale(1.1); /* 拡大 */
}
#index-column .column-list li a h3{
	margin-bottom: 2.0rem;
}
#index-column .column-list li a .flex-box {
	margin-top: auto;
	align-items: center;
}
#index-column .column-list li a .date {
	background: #00a0e9;
	border: 1px solid #fff;
	display: inline-block;
	color: #fff;
	padding: 0.5rem 1.5rem;
	font-size: 1.2rem;
}
#index-column .column-list li a .icon {
	font-size: 2.5rem;
	line-height: 1;
	color: #00a0e9;
}
























