@charset "utf-8";

.contents_wrap.top { width:100%; background:url(../img/bg_top.jpg); background-size:cover; padding-top:0; padding-bottom:80px; margin-bottom:80px;  position:relative; }
.contents_wrap .contents { width:100%; }
h1 { font-weight:bold; color:#000; font-size:32px; line-height:1.43em; margin-bottom:40px; }
.photo_top { width:100%; height:250px; overflow:hidden; border-radius:10px; margin-bottom:56px; }
.photo_top img { width:100%; height:100%; object-fit: cover;}
 .contents_wrap.top .bg_top_pc { display:none; }
@media screen and (min-width: 768px) {
    .contents_wrap.top { overflow:visible; margin-bottom:0; padding-bottom:0; background:none; position:relative; }
    .contents_wrap.top .bg_top_pc { width:100%; height:440px; position:absolute; z-index:0; display:block; }

    .photo_top {  height:400px; }
    
}
  

.contents_wrap.back_gray { width:100%; padding:120px 0; margin-top:80px; }
.contents_wrap { position:relative; }
.contents_wrap .tate_english { width:100px; position:absolute; left:0; top:0; display:none; }
@media screen and (min-width: 768px) {
    .contents_wrap.back_gray .contents { width:1100px; }
    .contents_wrap .tate_english  { display:block; height:300px; margin-left:-1%; }
}


h2 { margin-bottom:40px; }

.button_more { margin:0 auto 80px auto; }
.button_more.center { margin:0 auto 80px auto; }
@media screen and (min-width: 768px) {
  .button_more { margin-top:40px; margin-bottom:0; }
  .button_more.center { margin:40px auto 180px auto; }
}
.contents_wrap.contact { margin-top:0; }


.staff_info { width:100%; display:flex; justify-content: space-between; position:relative; z-index:1; flex-wrap:wrap; }
@media screen and (min-width: 768px) {
  .staff_info { width:90%; }
}
.staff_info li { width:100%; color:#fff; }
.staff_info li:nth-child(1) img { width:100%; }
.staff_info li:nth-child(2) { width:90%; margin:-60px 5% 0 5%; }
.staff_info li:nth-child(2) dl { width:100%; display:flex; justify-content: space-around; margin-bottom:0;  font-size:16px;font-weight:500; letter-spacing:0.1em; }
@media screen and (min-width: 768px) {
  .staff_info li:nth-child(2) { margin:initial; }
  .staff_info li:nth-child(2) dl { width:135%; margin-bottom:0; }
}

.staff_info li:nth-child(2) dl dt { width:21%; text-align:left; }
.staff_info li:nth-child(2) dl dd { width:79%; text-align:left; }
.staff_info li span { color:#137CD3;  position: relative; display: inline-block; z-index: 1; padding:0 10px; font-size:16px; letter-spacing:0.1em; font-weight:bold; }
.staff_info li span::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    width: 0; /* 初期は幅ゼロ */
    height: 1.2em;
    background-color: rgba(255, 255, 255, 1);
    transform: translateY(-50%);
    z-index: -1;
    animation: slideInWhite 1s ease-out forwards;
  }
  
  /* アニメーション定義 */
  @keyframes slideInWhite {
    from {
      width: 0;
    }
    to {
      width: 100%;
    }
  }

.staff_info li h1 { font-size:28px; color:#137CD3; position: relative; display: inline-block; z-index: 1;margin-bottom:0; line-height:1.7em;  padding-left:5px; padding-right:5px; }
.staff_info li h1::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: 1.2em; /* 文字の高さに合わせる */
    background-color: #fff;
    transform: translateY(-50%);
    z-index: -1;
    animation: slideInWhite 1s ease-out forwards;
  }
.staff_info li em { font-size:28px; letter-spacing:0.1em; color:rgba(255, 255, 255, 0.5) ; font-weight:bold;margin-top:0; display:block; margin-bottom:40px; }
@media screen and (min-width: 768px) {
  .staff_info li em { margin-top:16px; }
}

@media screen and (min-width: 768px) {
    .staff_info { padding-bottom:0; }
    .staff_info li:nth-child(1) { width:40%; }
    .staff_info li:nth-child(1) img { width:100%; margin-top:80px; border-radius:10px; }
    .staff_info li:nth-child(2) { width:55%; margin-top:80px; }
}
@media screen and (min-width:1200px) {
    .contents_wrap .contents { width:1100px; }
}

 .contents .message { width:90%; height:auto; padding:30px 5%; margin:40px auto 0 auto; background:#fff;  border-radius:10px; position:relative; z-index:1;}
 .contents .message p { width:100%; display:block; }
 @media screen and (min-width: 768px) {
  .contents .message { width:100%; margin:40px 0 80px 0; padding: 30px 65px; background:#EBF6FF; }

}

.message strong { margin-bottom:20px; }






/*スライド*/
.swiper {width: 90%;height:280px; margin: 0.5rem auto}
.swiper .others { display:none; }
@media screen and (min-width: 768px) {
  .swiper {width: 90%;height:280px; margin: 0.5rem auto 0 10%;}
  .swiper { position:relative; }
  .swiper .others { position:absolute; left:-5.7%; top:-50px; display:block; }

}

.swiper-slide { width:auto;height: 100%;display: flex;justify-content: center;align-items: center;color: #fff;font-weight: bold;font-size:30px;flex-wrap:wrap; }
.swiper-slide{height:350px; border-radius:10px; }
.swiper-slide div.photo { width:100%; height:230px; border-radius:10px; overflow:hidden; }
.swiper-slide div.photo img { width:100%; height:100%; object-fit:cover;transition: transform 0.4s ease; display:block;  }
@media screen and (min-width: 768px) {
.swiper-slide div.photo { /*width:250px;*/ height:277px; position:relative; }
}





.contents_wrap.kaitori .swiper-slide p { width:100%; color:#000; float:left; display:block; font-size:18px; font-weight:bold; letter-spacing:0.1; line-height:1.66em; margin-top: 15px; margin-bottom: 20px;}


.swiper-slide div.arrow_swiper {position:relative; overflow:visible; }
.swiper-slide div.arrow_swiper { height:30px; display:flex; align-items: center; justify-content: center;}
.swiper-slide div.arrow_swiper img { width:22px; height:22px; }
.swiper-slide div.arrow_swiper:before {content: "";width: 32px;height: 1px;background-color: #000;position: absolute;left: -47px;top: 50%;-webkit-transform: translateY(-50%);transform: translateY(-50%);-webkit-transition: width 0.3s ease;transition: width 0.3s ease;}




.swiper-slide a:hover .arrow_swiper:before {content: "";width: 32px;height: 1px;background-color: #000;position: absolute;left: -47px;top: 50%;-webkit-transform: translateY(-50%);transform: translateY(-50%);-webkit-transition: width 0.3s ease;transition: width 0.3s ease;}
/*.swiper-slide a:hover .arrow_swiper::before {width:40px; }*/
.swiper-slide a:hover .arrow_swiper img {transform: translateX(8px); /* 矢印が右へスライド */}



.swiper-slide {width: 100%; }
@media screen and (min-width: 768px) {
  .swiper-slide {width: 250px}
}



.contents_wrap.kaitori .swiper-slide p { width:100%; color:#000; float:left; display:block; font-size:18px; font-weight:bold; letter-spacing:0.1; line-height:1.66em; margin-top: 15px; margin-bottom: 20px;}
.date_wrap { width:100%; height:30px; display:flex; justify-content:space-between; align-items:center; } 
.date_wrap li { text-align:left; }
.date_wrap li .date { width:130px; height:30px; display:block; font-size:16px; border-radius:12px; background:#F5F5F5; color:#137CD3; font-weight:bold; letter-spacing:0.1; text-align:center; }

@media screen and (max-width: 768px) {
 .photo .arrow_wrap { bottom:6vw; }
}