/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Oct 17 2025 | 06:48:29 */
/***********************************************************
* 枠線アニメーション（共通クラス版）
***********************************************************/
.anim-border {
  position: relative;
}

/* 4辺の線（上・右は自身の擬似要素、下・左は子 span 擬似要素） */
.anim-border::before,
.anim-border::after,
.anim-border > .anim-edges::before,
.anim-border > .anim-edges::after {
  content: "";
  position: absolute;
  background: #7f7f7f;
  transition: all 0.6s ease;
}

/* 上線 */
.anim-border::before {
  top: 0;
  left: 0;
  width: 0;
  height: 1px;
}
/* 右線 */
.anim-border::after {
  top: 0;
  right: 0;
  width: 1px;
  height: 0;
}
/* 下線 */
.anim-border > .anim-edges::before {
  bottom: 0;
  right: 0;
  width: 0;
  height: 1px;
}
/* 左線 */
.anim-border > .anim-edges::after {
  bottom: 0;
  left: 0;
  width: 1px;
  height: 0;
}

/* 表示時に順番に描画 */
.anim-border.is-show::before {
  width: 100%;
  transition-delay: 0s;
}
.anim-border.is-show::after {
  height: 100%;
  transition-delay: 0.25s;
}
.anim-border.is-show > .anim-edges::before {
  width: 100%;
  transition-delay: 0.5s;
}
.anim-border.is-show > .anim-edges::after {
  height: 100%;
  transition-delay: 0.75s;
}

/* リセット中はトランジション無効 */
.anim-border.no-anim::before,
.anim-border.no-anim::after,
.anim-border.no-anim > .anim-edges::before,
.anim-border.no-anim > .anim-edges::after {
  transition: none !important;
}










.btn-zoomin {
  opacity: 0;
  transform: scale(0.8);
  transition: none;
  will-change: transform, opacity;
}
.btn-zoomin.is-show {
  animation: zoomIn 0.8s cubic-bezier(0.25, 1, 0.5, 1) 0.5s forwards;
}
@keyframes zoomIn {
  0% {
    transform: scale(0.8);
    opacity: 0;
  }
  100% {
	opacity: 1;
    transform: scale(1);
  }
}






/* フェードアップ */
.fade-up {
  opacity: 0;
  transform: translateY(30px);
  transition: transform .7s ease, opacity .7s ease;
}
.fade-up.is-show {
  opacity: 1;
  transform: translateY(0);
}

.concept .image1 .fade-up{
	transition: transform 0.7s ease .8s, opacity 0.7s ease .8s;
}
.concept .image2 .fade-up{
	transition: transform 0.7s ease .3s, opacity 0.7s ease .3s;
}

.kodawari1 .image1 .fade-up{
	transition: transform 0.8s ease .4s, opacity 0.8s ease .4s;
}
.kodawari1 .image2 .fade-up{
	transition: transform 0.7s ease 1s, opacity 0.7s ease 1s;
}
.kodawari2 .image3 .fade-up{
	transition: transform 0.5s ease .4s, opacity 0.5s ease .4s;
}