@charset "UTF-8";
html {
  font-size: 10px;
}

body {
  color: #333;
  font-family: "ヒラギノ角ゴ ProN W3", HiraKakuProN-W3, 游ゴシック, "Yu Gothic", メイリオ, Meiryo, Verdana, Helvetica, Arial, sans-serif;
  font-weight: 500;
  /* font-family: "noto-sans-cjk-jp", sans-serif; */
  /* font-weight: 400; */
  font-style: normal;
}

body::-webkit-scrollbar{
  width: 14px;
}
body::-webkit-scrollbar-track{
  background-color: #fff;
}
body::-webkit-scrollbar-thumb{
  background-color: #777;
  border-radius: 4px;
  cursor: pointer;
}
.button:active{
  transform: scale(97%, 98%);
  transition: .2s;
}
.space{
  width: 100%;
  height: 40px;
}

.icon_dl{
  width: 1em;
  padding-bottom: 2px;
}
.fa-envelope.white{
  color: #fff;
}

/* 2023/12/26 */
.footer-inner-contact .fa-envelope{
  padding-right: .3em;
}

@media screen and (max-width: 768px) {
  .space{
    height: 24px;
  }
}

a {
  text-decoration: none;
  cursor: pointer;
}

img {
  max-width: 100%;
  height: auto;
  object-fit: cover;
  vertical-align: bottom;
}

p {
  line-height: 1.6;
}
h4{
  font-weight: normal;
}

.is--pc {
  display: block !important;
}
@media screen and (max-width: 768px) {
  .is--pc {
    display: none !important;
  }
}

.is--sp {
  display: none !important;
}
@media screen and (max-width: 768px) {
  .is--sp {
    display: block !important;
  }
}

.wrapper {
  margin-top: 41px;
  overflow-x: hidden;
}
/* @media screen and (min-width: 768px) {
  .wrapper {
    margin-top: 59px;
  }
} */

.button {
  display: block;
  width: 100%;
  padding: 9px 0;
  border-radius: 2px;
  /* background-color: #596EB1; */
  background-color: #E85959;
  line-height: 1;
  text-align: center;
  font-size: 1.4rem;
  color: #fff;
}
.button a{
  color: #fff;
  line-height: 1.4;
}
@media (min-width: 769px) {
  .button {
    padding: 10px 14px;
    font-size: 2rem;
    transition: .3s;
    /* border-radius: 30px; */
  }
}

.button2 {
  font-size: 14.5px;
  background-color: #596EB1;
  border-radius: 7.1px;
  display: block;
  padding: 10px 35px;
  text-align: center;
  color: #fff;
  line-height: 1;
  transition: .3s;
}
.button:hover, .button2:hover{
  opacity: .7;
  transition: .3s;
}

.section-title {
  position: relative;
  text-align: center;
  padding-bottom: 14px;
  font-size: min(46px,3.2vw);
  letter-spacing: 0.2em;
  line-height: 1;
  font-weight: 400;
  color: #555;
}
@media (max-width: 768px) {
  .section-title {
    padding-bottom: 8px;
    font-size: 21px;
  }
}
.section-title:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background-image: url(../img/border-bottom.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
@media (min-width: 768px) {
  .section-title:after {
    background-image: url(../img/pc/border-bottom.png);
    background-size: auto;
  }
}

.section-sub-title {
  text-align: center;
  padding-top: 11.5px;
  font-weight: 700;
  color: #898989;
  letter-spacing: 0.6em;
  font-size: 11.5px;
  line-height: 1;
}
@media (min-width: 768px) {
  .section-sub-title {
    padding-top: 20px;
    letter-spacing: 0.4em;
    font-size: 2rem;
  }
}

.link {
  font-size: 14px;
  text-align: right;
}
@media (min-width: 768px) {
  .link {
    width: min(95%, 1080px);
    margin: 0 auto;
    font-size: 1.6rem;
  }
}
.link a {
  color: #4C4948;
  text-decoration: none;
}

.common-wrap {
  width: 84.8%;
  margin: 0 auto;
}
@media (min-width: 768px) {
  .common-wrap {
    max-width: 1540px;
    width: 100%;
    padding: 0 20px;
    box-sizing: border-box;
  }
}
.common-wrap[id] {
  margin-top: -41px;
  padding-top: 41px;
}
@media (min-width: 768px) {
  .common-wrap[id] {
    margin-top: -59px;
    padding-top: 59px;
  }
}

.bg {
  position: relative;
  /* z-index: 1; */
}
.bg:after {
  border-style: solid;
  border-width: 25px 100vw 0 0;
  bottom: 0;
  left: 0;
  content: "";
  height: 0;
  position: absolute;
  z-index: 0;
}
@media (min-width: 768px) {
  .bg:after {
    border-width: 128px 100vw 0 0;
  }
}

.bg-thin {
  background-color: #FAF8EB;
}
.bg-thin:after {
  border-color: #FAF8EB #fdfcfa #FAF8EB #FAF8EB;
}
.bg-thin.white:after {
  border-color: #FAF8EB #fff #FAF8EB #FAF8EB;
}
.bg-white{
  background-color: #fff;
}
.bg-white:after {
  border-color: #fff #F6F2E7 #fff #fff;
}
.bg-thick {
  background-color: #fdfcfa;
}
.bg-thick:after {
  border-color: #fdfcfa #FAF8EB #fdfcfa #fdfcfa;
}
section:last-of-type:after{
  border: none;
}
.service-menu-link {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px 9.29%;
}
@media (min-width: 768px) {
  .service-menu-link {
    justify-content: space-between;
    flex-wrap: nowrap;
    gap: 0;
    /* width: min(95%, 1080px); */
    width: min(95%, 1360px);
    margin: 0 auto;
  }
}
@media (max-width: 767px) {
  .service-menu-link {
    max-width: 100%;
    margin: 0 auto;
    gap: 20px 2%;
  }
}
.service-menu-link-item {
  width: 30%;
}
/* @media (max-width: 767px) {
  .service-menu-link-item {
    max-width: 85px;
  }
} */
@media (min-width: 768px) {
  .service-menu-link-item {
    width: 14.2857142857%;
  }
}
.service-menu-link-item a {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.service-menu-link-item a .image {
  max-width: 100%;
  width: 128px;
  padding: 0 20px;
  margin: 0 auto;
  box-sizing: border-box;
  vertical-align: middle;
  display: flex;
  align-items: center;
  position: relative;
}
@media (min-width: 768px) {
  .service-menu-link-item a .image {
    width: 164px;
  }
}
.service-menu-link-item a .image:hover img.active {
  opacity: 1;
}
.service-menu-link-item a .image img {
  display: flex;
  align-items: flex-end;
  object-fit: contain;
}
.service-menu-link-item a .image img.active {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  opacity: 0;
  width: calc(100% - 40px);
}
@media (min-width: 768px) {
  .service-menu-link-item a .image img {
    max-height: 126px;
  }
}
.service-menu-link-item a p {
  /* margin-top: 10px; */
  text-align: center;
  font-size: 12px;
  font-weight: 500;
  color: #898989;
  line-height: 1.144;
}
@media (min-width: 768px) {
  .service-menu-link-item a p {
    font-size: 1.8rem;
  }
}

.news-menu-link {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 18px 0%;
  margin-bottom: 18.18px;
}
@media (min-width: 768px) {
  .news-menu-link {
    width: min(95%, 1080px);
    justify-content: center;
    gap: 20px 2%;
    margin: 0 auto 30px;
  }
}
.news-menu-link-item {
  width: 100%;
}
@media (min-width: 768px) {
  .news-menu-link-item {
    width: 35rem;
    width: 23.333%;
  }
}
/* ******************************************
   ***    topへ戻るボタン    ***
 * **************************************** */
/* #page-top{
  background-color: #262626;
  width: 66px;
  border-radius: 1px;
  position: fixed;
  z-index: 999;
  bottom: 4px;
  right: 4px;
}
#page-top a{
  color: #fff;
  font-size: 16px;
  letter-spacing: .08rem;
  text-decoration: none;
  padding: 7px 16px;
  display: block;
} */


#page-top {
  width: 100%;
  position: fixed;
  z-index: 99;
  bottom: 30px;
  right: 30px;
}


#page-top a {
  display: block;
  position: relative;
  z-index: 3;
  transition: .2s;
}
#page-top a:active #PageTop_arrow,
#page-top a:active #PageTop_circle{
  transform: scale(90%, 90%);
  transition: .2s;
}


#PageTop_arrow, #PageTop_circle{
  position: absolute;
}
#PageTop_arrow{
  width: 26px;
  bottom: 29px;
  right: 24px;
  z-index: 3;
}
#PageTop_circle{
  width: 104px;
  height: 104px;
  bottom: -15px;
  right: -15px;
  z-index: 1;
  animation: rotate 20s linear infinite;
}
@keyframes rotate {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}

.fade-in {
  opacity: 0;
  transition-duration: 500ms;
  transition-property: opacity, transform;
}
.scroll-in {
  opacity: .98;
  -ms-transform: translate(0, 0);
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
}
@media screen and ( max-width: 500px ){
  #PageTop_arrow{
    width: 17px;
    bottom: 13px;
    right: 8px;
  }
  #PageTop_circle{
    width: 57px;
    height: 57px;
    bottom: -10px;
    right: -12px;
  }
}
/* ******************************************
   ***    お知らせカルーセル    ***
 * **************************************** */
 .swiper-button-next:after, .swiper-button-prev:after {
     color: #262626;
 }
 .swiper-3d .swiper-slide-shadow {
   background-color: rgb(0, 0, 0, 0%);
 }
 .swiper-wrapper {
   height: auto;
 }
 .wrapper {
   width: 100%;
   margin: 0 auto;
   overflow-x: hidden;
 }
 .carousel-wrapper {
   position: relative;
 }
 .carousel {
   margin-bottom: 3em;
 }
 .item {
   /* background-color: #F6F2E7; */
   background-color: #FAF8EB;
   display: flex;
   flex-wrap: wrap;
   align-items: flex-start;
   justify-content: space-evenly;
   padding: 1rem 7rem;
 }
 .item div {
   display: inline-block;
   width: 24%;
   margin: 1rem 0;
 }

 /* FAF8EB */
/* F6F2E7 */
/* E7E0CE */
 .bg-thick .item {
   background-color: #fdfcfa;
 }

/* 2023 6 30 お知らせ 日付・説明文追加 */
 .item .info_box{
   width: 23%;
   display: flex;
   flex-direction: column;
 }
 .item .info_box div{
   width: 100%;
   margin: 1rem 0;
   display: block;
 }
 .headline{
   width: 100%;
 }
 .headline h3{
   line-height: 1.5;
   margin: 4px 0 6px 0;
 }
 .info_box a{
   color: #555;
 }
 .info_box p{
   font-size: 14px;
   line-height: 1.5;
 }
 .headline_blank{
   width: 100%;
   height: auto;
   /* background-color: #E7E0CE; */
 }
 /* ****** お知らせ newラベル ****** */
 #first{
   display: inline-block;
   position: relative;
   z-index: 3;
   width: 100%;
   height: 100%;
 }
 #first::before{
   width: 22%;
   height: 30%;
   background-image: url(../img/animated_new.png);
   background-repeat: no-repeat;
   background-size: contain;
   position: absolute;
   z-index: 4;
   top: 2.3%;
   left: -0.9%;
   content: "";
 }

 /* ****** お知らせカルーセル　レスポンシブ ****** */
 @media screen and (max-width: 1200px){
   .item div{
     width: 30%;
   }
 }
 @media screen and (max-width: 1100px){
   .item .info_box {
      width: 30%;
    }
 }
 @media screen and (max-width: 768px){
   .headline h3{
     font-size: 1.5rem;
   }
   .info_box p {
    line-height: 1.4;
  }
   .item div{
     width: 45%;
     margin: 1rem 0;
   }
   .image.center.single {
     width: 90%;
     margin: 0 auto;
   }
   .item .info_box {
      width: 30%;
    }
 }
 @media screen and (max-width: 600px){
   .headline h3{
     font-size: 12px;
   }
   .info_box h4, .info_box p {
    font-size: 10px;
  }
  .item {
    padding: 1rem 2rem;
  }
  .item .info_box {
     width: 45%;
  }
  #first::before {
    top: 4.3%;
  }
 }
 @media screen and (max-width: 500px){
   .item div{
     width: 100%;
     margin: 1rem 0;
   }
   /* .item .info_box {
      width: 100%;
    } */
 }