/*　上から下に上がって表示 初期状態（まだ表示されてない） */
.js-shu {
  opacity: 0;
  transform: translateY(18px) scale(0.96);
  transition: opacity 600ms ease, transform 600ms cubic-bezier(.2,.8,.2,1);
  will-change: opacity, transform;
}

/* 表示状態 */
.js-shu.is-inview {
  opacity: 1;
  transform: translateY(0) scale(1);
}

/* 連続表示を気持ちよくしたい場合（任意） */
.js-shu[data-delay="1"] { transition-delay: 80ms; }
.js-shu[data-delay="2"] { transition-delay: 160ms; }
.js-shu[data-delay="3"] { transition-delay: 240ms; }

/* アニメ苦手な人への配慮 */
@media (prefers-reduced-motion: reduce) {
  .js-shu {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

.slide-wideslide-wideslide-wide.top-greeting {
  position: relative;
  z-index: 1;
}
.top-greeting .top-greeting__sky {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
}

@media screen and (min-width: 768px) {
  .top-greeting .top-greeting__sky {
    height: auto
  }
}


.top-greeting .top-greeting__sky::before, .top-greeting .top-greeting__sky::after {
  content: "";
  position: absolute;
  display: block;
  width: max(13rem, 10vw);
  aspect-ratio: 1;
}
@media screen and (max-width: 767px) {
  .top-greeting .top-greeting__sky::before, .top-greeting .top-greeting__sky::after {
    display: none
  }
}
.top-greeting .top-greeting__sky::before {
  top: max(35.8rem, 27.5384615385vw);
  left: calc((100% - max(136rem, 104.6153846154vw))/2);
  scale: -1 1
}
@media screen and (min-width: 768px)and (max-width: 1300px) {
  .top-greeting .top-greeting__sky::before {
    left: -3rem
  }
}
.top-greeting .top-greeting__sky::after {
  top: max(38.6rem, 29.6923076923vw);
  right: calc((100% - max(132rem, 101.5384615385vw))/2)
}
.top-greeting .top-greeting__sky img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover
}
.top-greeting .top-greeting__in {
  position: relative;
  z-index: 1;
  padding-top: max(5rem, 3.8461538462vw)
}


.top-greeting .top-greeting__in::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: max(-2rem, -1.5384615385vw);
  left: 0;
  right: 0;
  display: block;
  width: max(72.2rem, 55.5384615385vw);
  aspect-ratio: 1;
  margin: auto;
  border-radius: 50%;
  background-color: #fff
}
@-webkit-keyframes kf-heroCircle {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1)
  }
  9% {
    -webkit-transform: scale(1);
    transform: scale(1)
  }
  14% {
    -webkit-transform: scale(0.9);
    transform: scale(0.9)
  }
  16% {
    -webkit-transform: scale(1.1);
    transform: scale(1.1)
  }
  18% {
    -webkit-transform: scale(0.95);
    transform: scale(0.95)
  }
  20% {
    -webkit-transform: scale(1);
    transform: scale(1)
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1)
  }
}
@keyframes kf-heroCircle {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1)
  }
  9% {
    -webkit-transform: scale(1);
    transform: scale(1)
  }
  14% {
    -webkit-transform: scale(0.9);
    transform: scale(0.9)
  }
  16% {
    -webkit-transform: scale(1.1);
    transform: scale(1.1)
  }
  18% {
    -webkit-transform: scale(0.95);
    transform: scale(0.95)
  }
  20% {
    -webkit-transform: scale(1);
    transform: scale(1)
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1)
  }
}
@media screen and (max-width: 767px) {
  .top-greeting .top-greeting__in::before {
    top: 2.8rem;
    width: 31.5rem
  }
}
.top-greeting .top-greeting__in.top-greeting__in--active::before {
  -webkit-animation: kf-heroCircle 3.5s 1 forwards ease;
  animation: kf-heroCircle 3.5s 1 forwards ease
}
.top-greeting .top-greeting_illust {
  position: absolute;
  width: max(13rem, 10vw);
}
@media screen and (max-width: 767px) {
  .top-greeting .top-greeting_illust {
    width: 8rem
  }
}
.top-greeting .top-greeting_illust:nth-of-type(1) {
  top: max(3.6rem, 2.7692307692vw);
  left: calc((100% - max(66rem, 50.7692307692vw))/2)
}
@media screen and (max-width: 767px) {
  .top-greeting .top-greeting_illust:nth-of-type(1) {
    top: 9.3rem;
    left: 1.3rem
  }
}
.top-greeting .top-greeting_illust:nth-of-type(1) img {
  -webkit-animation: kf-heroIllust01 6s infinite forwards ease;
  animation: kf-heroIllust01 6s infinite forwards ease
}
@-webkit-keyframes kf-heroIllust01 {
  40% {
    -webkit-transform: translate3d(0.5rem, -2rem, 0px) rotate(-10deg);
    transform: translate3d(0.5rem, -2rem, 0px) rotate(-10deg)
  }
}
@keyframes kf-heroIllust01 {
  40% {
    -webkit-transform: translate3d(0.5rem, -2rem, 0px) rotate(-10deg);
    transform: translate3d(0.5rem, -2rem, 0px) rotate(-10deg)
  }
}
.top-greeting .top-greeting_illust:nth-of-type(1) img:nth-of-type(1) {
  -webkit-animation-delay: -0.5s;
  animation-delay: -0.5s
}
.top-greeting .top-greeting_illust:nth-of-type(1) img:nth-of-type(2) {
  position: absolute;
  top: 0;
  left: 0
}
.top-greeting .top-greeting_illust:nth-of-type(2) {
  top: max(13.4rem, 10.3076923077vw);
  right: calc((100% - max(117rem, 90vw))/2);
  -webkit-animation: kf-heroIllust02 6s infinite forwards ease;
  animation: kf-heroIllust02 6s infinite forwards ease
}
@-webkit-keyframes kf-heroIllust02 {
  40% {
    -webkit-transform: translate3d(0px, -2rem, 0px);
    transform: translate3d(0px, -2rem, 0px)
  }
}
@keyframes kf-heroIllust02 {
  40% {
    -webkit-transform: translate3d(0px, -2rem, 0px);
    transform: translate3d(0px, -2rem, 0px)
  }
}
@media screen and (max-width: 767px) {
  .top-greeting .top-greeting_illust:nth-of-type(2) {
    display: none
  }
}

@-webkit-keyframes kf-heroSun {
  100% {
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%)
  }
}
@keyframes kf-heroSun {
  100% {
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%)
  }
}

/* ここをチェック */


.top-greeting .top-greeting__copy {
  position: relative;
  z-index: 2;
  width: max(36.6rem, 28.1538461538vw);
  margin: max(2.6rem, 2vw) auto 0
}




@media screen and (max-width: 767px) {
  .top-greeting .top-greeting__copy {
    width: 18.5rem;
    margin-top: 0
  }
}
.top-greeting .top-greeting__copy.js-load {
  opacity: 0;
  translate: 0 max(2rem, 1.5384615385vw);
  -webkit-transition: opacity .5s ease, translate .5s ease;
  transition: opacity .5s ease, translate .5s ease
}
.top-greeting .top-greeting__copy.js-load .top-greeting__copyspan img {
  -webkit-animation-play-state: paused;
  animation-play-state: paused；
}
.top-greeting .top-greeting__copy.js-load--on {
  opacity: 1;
  translate: 0
}
.top-greeting .top-greeting__copy.js-load--on .top-greeting__copyspan img {
  -webkit-animation-play-state: running;
  animation-play-state: running
}
.top-greeting .top-greeting__copyspan {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 0 .95rem
}
@media screen and (max-width: 767px) {
  .top-greeting .top-greeting__copyspan {
    gap: 0 .45rem
  }
}
.top-greeting .top-greeting__copyspan img {
  width: 2.7rem;
  -webkit-animation: kf-heroText 3.5s infinite forwards ease;
  animation: kf-heroText 3.5s infinite forwards ease
}
@-webkit-keyframes kf-heroText {
  0% {
    -webkit-transform: translate3d(0px, 0px, 0px) rotate(0deg);
    transform: translate3d(0px, 0px, 0px) rotate(0deg)
  }
  5% {
    -webkit-transform: translate3d(0px, 0px, 0px) rotate(0deg);
    transform: translate3d(0px, 0px, 0px) rotate(0deg)
  }
  5.5% {
    -webkit-transform: translate3d(0px, -1rem, 0px) rotate(20deg);
    transform: translate3d(0px, -1rem, 0px) rotate(20deg)
  }
  10% {
    -webkit-transform: translate3d(0px, -1rem, 0px) rotate(20deg);
    transform: translate3d(0px, -1rem, 0px) rotate(20deg)
  }
  10.5% {
    -webkit-transform: translate3d(0px, -1rem, 0px) rotate(0deg);
    transform: translate3d(0px, -1rem, 0px) rotate(0deg)
  }
  15% {
    -webkit-transform: translate3d(0px, -1rem, 0px) rotate(0deg);
    transform: translate3d(0px, -1rem, 0px) rotate(0deg)
  }
  15.5% {
    -webkit-transform: translate3d(0px, 0px, 0px) rotate(0deg);
    transform: translate3d(0px, 0px, 0px) rotate(0deg)
  }
  50% {
    -webkit-transform: translate3d(0px, 0px, 0px) rotate(0deg);
    transform: translate3d(0px, 0px, 0px) rotate(0deg)
  }
}
@keyframes kf-heroText {
  0% {
    -webkit-transform: translate3d(0px, 0px, 0px) rotate(0deg);
    transform: translate3d(0px, 0px, 0px) rotate(0deg)
  }
  5% {
    -webkit-transform: translate3d(0px, 0px, 0px) rotate(0deg);
    transform: translate3d(0px, 0px, 0px) rotate(0deg)
  }
  5.5% {
    -webkit-transform: translate3d(0px, -1rem, 0px) rotate(20deg);
    transform: translate3d(0px, -1rem, 0px) rotate(20deg)
  }
  10% {
    -webkit-transform: translate3d(0px, -1rem, 0px) rotate(20deg);
    transform: translate3d(0px, -1rem, 0px) rotate(20deg)
  }
  10.5% {
    -webkit-transform: translate3d(0px, -1rem, 0px) rotate(0deg);
    transform: translate3d(0px, -1rem, 0px) rotate(0deg)
  }
  15% {
    -webkit-transform: translate3d(0px, -1rem, 0px) rotate(0deg);
    transform: translate3d(0px, -1rem, 0px) rotate(0deg)
  }
  15.5% {
    -webkit-transform: translate3d(0px, 0px, 0px) rotate(0deg);
    transform: translate3d(0px, 0px, 0px) rotate(0deg)
  }
  50% {
    -webkit-transform: translate3d(0px, 0px, 0px) rotate(0deg);
    transform: translate3d(0px, 0px, 0px) rotate(0deg)
  }
}
@media screen and (max-width: 767px) {
  .top-greeting .top-greeting__copyspan img {
    width: 1.2rem
  }
}
.top-greeting .top-greeting__copyspan img:nth-of-type(1) {
  -webkit-animation-delay: 0.8s;
  animation-delay: 0.8s
}
.top-greeting .top-greeting__copyspan img:nth-of-type(2) {
  -webkit-animation-delay: 0.96s;
  animation-delay: 0.96s
}
.top-greeting .top-greeting__copyspan img:nth-of-type(3) {
  -webkit-animation-delay: 1.12s;
  animation-delay: 1.12s
}
.top-greeting .top-greeting__copyspan img:nth-of-type(4) {
  -webkit-animation-delay: 1.28s;
  animation-delay: 1.28s
}
.top-greeting .top-greeting__copyspan img:nth-of-type(5) {
  -webkit-animation-delay: 1.44s;
  animation-delay: 1.44s
}
.top-greeting .top-greeting__copyspan img:nth-of-type(6) {
  -webkit-animation-delay: 1.6s;
  animation-delay: 1.6s
}
.top-greeting .top-greeting__copyspan img:nth-of-type(7) {
  -webkit-animation-delay: 1.76s;
  animation-delay: 1.76s
}
.top-greeting .top-greeting__copyspan img:nth-of-type(8) {
  -webkit-animation-delay: 1.92s;
  animation-delay: 1.92s
}
.top-greeting .top-greeting__copyspan img:nth-of-type(9) {
  -webkit-animation-delay: 2.08s;
  animation-delay: 2.08s
}
.top-greeting .top-greeting__copyspan img:nth-of-type(10) {
  -webkit-animation-delay: 2.24s;
  animation-delay: 2.24s
}

.top-greeting .top-greeting__copyimg {
  margin-top: max(0rem,0vw)
}
@media screen and (max-width: 767px) {
  .top-greeting .top-greeting__copyimg {
    margin-top: 1.5rem
  }
}
.top-greeting .top-greeting__en {
  position: relative;
  z-index: 2;
  margin-top: max(4.5rem, 3.4615384615vw);
  font-size: 2rem;
  font-size: max(2rem, 10px);
  line-height: 1.7;
  letter-spacing: 2.3em;
  text-indent: 2.3em
}
@media screen and (min-width: 768px)and (min-width: 1600px) {
  .top-greeting .top-greeting__en {
    font-size: 1.5384615385vw
  }
}
@media screen and (max-width: 767px) {
  .top-greeting .top-greeting__en {
    margin-top: 2rem;
    font-size: 1rem;
    font-size: max(1rem, 10px);
    scale: .9
  }
}
.top-greeting .top-greeting__en.js-load {
  opacity: 0;
  translate: 0 max(2rem, 1.5384615385vw);
  -webkit-transition: opacity .5s ease, translate .5s ease;
  transition: opacity .5s ease, translate .5s ease
}
.top-greeting .top-greeting__en.js-load--on {
  opacity: 1;
  translate: 0
}
.top-greeting .top-greeting-slider {
  position: absolute;
  top: max(20rem, 9.2307692308vw);
  left: 0;
  right: 0;
  width: max(100rem, 74.6153846154vw);
  margin: auto;
  padding-right: max(0rem, .0vw)
}

@media screen and (max-width: 767px) {
  .top-greeting .top-greeting-slider {
    top: 15rem;
    width: 42rem;
    margin-left: -2.5rem
  }
}
.top-greeting .top-greeting-slider.js-load {
  opacity: 0;
  -webkit-transform-origin: center bottom;
  transform-origin: center bottom;
  scale: .8;
  -webkit-transition: opacity .4s .3s ease, scale .4s .3s cubic-bezier(0.3, 1.64, 0.45, 0.99);
  transition: opacity .4s .3s ease, scale .4s .3s cubic-bezier(0.3, 1.64, 0.45, 0.99)
}
.top-greeting .top-greeting-slider.js-load--on {
  opacity: 1;
  scale: 1
}
.top-greeting .top-greeting-slider .splide__track {
  overflow: visible
}
.top-greeting .top-greeting-slider__item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-transition: opacity 0s 1s !important;
  transition: opacity 0s 1s !important
}
.top-greeting .top-greeting-slider__item.is-active {
  -webkit-transition: opacity 0s .45s !important;
  transition: opacity 0s .45s !important
}
.top-greeting .top-greeting-slider__item.is-active .top-greeting-slider__img, .top-greeting .top-greeting-slider__item.is-active .top-greeting-slider__illust {
  translate: 0;
  -webkit-transition: translate 0s ease;
  transition: translate 0s ease;
	z-index: 1!important

}
.top-greeting .top-greeting-slider__item.is-active .top-greeting-slider__img img, .top-greeting .top-greeting-slider__item.is-active .top-greeting-slider__illust img {
  -webkit-transform-origin: center bottom;
  transform-origin: center bottom;
  rotate: X 0deg;
  -webkit-transition: rotate .3s .45s cubic-bezier(0.3, 1.78, 0.48, 0.83);
  transition: rotate .3s .45s cubic-bezier(0.3, 1.78, 0.48, 0.83)
}
.top-greeting .top-greeting-slider__img, .top-greeting .top-greeting-slider__illust {
  -webkit-perspective: 800px;
  perspective: 500px;
  translate: 0 max(45rem, 34.6153846154vw);
  -webkit-transition: translate .6s cubic-bezier(0.65, 0.22, 0.1, 0.97);
  transition: translate .6s cubic-bezier(0.65, 0.22, 0.1, 0.97);
	z-index: 1
	
}
@media screen and (max-width: 767px) {
  .top-greeting .top-greeting-slider__img, .top-greeting .top-greeting-slider__illust {
    translate: 0 20rem
  }
}
.top-greeting .top-greeting-slider__img img, .top-greeting .top-greeting-slider__illust img {
  rotate: X 90deg;
  -webkit-transition: rotate 0s .6s ease;
  transition: rotate 0s .6s ease;
		z-index: 1
}
.top-greeting .top-greeting-slider__img {
  width: max(25rem, 20.0769230769vw)
}

@media screen and (max-width: 767px) {
  .top-greeting .top-greeting-slider__img {
    width: 12.8rem
  }
}
.top-greeting .top-greeting-slider__illust {
  width: max(25rem, 20.0769230769vw);
		z-index: 1
}
@media screen and (max-width: 767px) {
  .top-greeting .top-greeting-slider__illust {
    width: 12.4rem
  }
}


.message-contanets{
  z-index: 100;
  position: relative;
	background: rgba(255,255,255,1.00);
	border-radius: 20px;
	padding: 40px;

}
.message-box{
	padding: 20px 40px 0;
	float: left;
		background: rgba(255,255,255,1.00);

}
@media screen and (max-width: 767px) {
.message-contanets{
	padding: 10px;

	
	

}}
.white-box{
  z-index: 1000;
	padding-top: 40px;
	margin-top: -30px;
	position: relative;
	background: #ffffff

}



.message-img{
  z-index: 100;
  position: relative;
	width: 50%;
		float: left;
		background: rgba(255,255,255,1.00);

}

.message-text {
	width: 50%;
	height: auto;
	  z-index: 100;
	  position: relative;
		float: left;
		background: rgba(255,255,255,1.00);
	padding-top: 20px
	
}
.message-img2{
  z-index: 100;
  position: relative;
	width: 40%;
		float: right;
		background: rgba(255,255,255,1.00);

}

.message-text2 {
	width: 60%;
	height: auto;
	  z-index: 100;
	  position: relative;
		float: left;
		background: rgba(255,255,255,1.00);
	padding-top: 20px
	
}



.message-text2 {
	width: 60%;
	height: auto;
	  z-index: 100;
	  position: relative;
		float: left;
		background: rgba(255,255,255,1.00);
	padding-top: 20px
	
}

@media screen and (max-width: 767px) {
	.message-img2{
	width: 100%;
}
	.message-text2 {
	width: 100%;
	
}
}


	.message-box{
			padding: 10px;
  top: 40px
}


.message-img{
	width: 100%;

}

.message-text {
	width: 100%;	
}
}
	
	
.basic-rule{
  position: relative;
  padding-bottom: 15rem;
	z-index: 1000;
	padding-top: 100px;
}


.tetugaku-cat {
  position: relative;
  padding-bottom: 7rem;
	z-index: 1000;
	background: rgba(255,255,255,1.00);
	margin-top: 100px
}
@media screen and (max-width: 767px) {
  .tetugaku-cat {
	  	margin-top: 60px;
    padding-bottom: 14.5rem
  }
}
.tetugaku-cat .tetugaku-cat__btn {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  min-width: 45rem;
  padding-block: 1.55rem;
}
@media screen and (max-width: 767px) {
  .tetugaku-cat .tetugaku-cat__btn {
    min-width: 30rem;
    padding-block: 1.8rem
  }
}
.ex-card-slider__link {
  -webkit-transition-delay: 0s, .07s, .07s, .07s, 0s;
  transition-delay: 0s, .07s, .07s, .07s, 0s;
	
}
.ex-card-slider__link {
  -webkit-transition-delay: 0s, .14s, .14s, .14s, 0s;
  transition-delay: 0s, .14s, .14s, .14s, 0s
}
.ex-card-slider.scr-anin .ex-card-slider__link {
  opacity: 0;
  rotate: Y 70deg;
  translate: 0 6rem
}
.ex-card-slider.scr-anin--on .ex-card-slider__link {
  opacity: 1;
  rotate: Y 0deg;
  translate: 0
}
.ex-card-slider .splide__track {
  overflow: visible
}
.ex-card-slider .splide__list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex
}
.ex-card-slider .splide__arrows {
  left: 0;
  right: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  width: 52.3rem;
  height: 7.5rem;
  margin: auto
}
@media screen and (max-width: 767px) {
  .ex-card-slider .splide__arrows {
    width: 35.4rem;
    height: 6rem
  }
}
.ex-card-slider .splide__arrow {
  width: 7.5rem;
  height: 7.5rem
}
@media screen and (max-width: 767px) {
  .ex-card-slider .splide__arrow {
    width: 6rem;
    height: 6rem
  }
}
.ex-card-slider .splide__arrow svg {
  width: 3.8rem
}
@media screen and (max-width: 767px) {
  .ex-card-slider .splide__arrow svg {
    width: 3rem
  }
}




.ex-card-slider__item.ex-card-slider__item--orange .ex-card-slider__link::before {
				  background-image: url("../img/card/card-orange.svg");
	background-size: 100%;
	
}


.ex-card-slider__item.ex-card-slider__item--red .ex-card-slider__link::before {
				  background-image: url("../img/card/card-red.svg");
	background-size: 100%;
	
}

.ex-card-slider__item.ex-card-slider__item--green-blue .ex-card-slider__link::before {
				  background-image: url("../img/card/card-green-blue.svg");
	background-size: 100%;
	
}


.ex-card-slider__item.ex-card-slider__item--green .ex-card-slider__link::before {
				  background-image: url("../img/card/card-green.svg");
	background-size: 100%;
	
}


.ex-card-slider__item.ex-card-slider__item--purple .ex-card-slider__link::before {
				  background-image: url("../img/card/card-purple.svg");
	background-size: 100%;
	
}


.ex-card-slider__item.ex-card-slider__item--pink .ex-card-slider__link::before {
				  background-image: url("../img/card/card-pink.svg");
	background-size: 100%;
	
}

.ex-card-slider__item.ex-card-slider__item--blue .ex-card-slider__link::before {
				  background-image: url("../img/card/card-blue.svg");
	background-size: 100%;
	
}
.ex-card-slider__item.ex-card-slider__item--yellow .ex-card-slider__link::before {
				  background-image: url("../img/card/card-yellow.svg");
	background-size: 100%;
	
}
@media screen and (min-width: 768px) {
  .ex-card-slider__item:has(+.is-active) {
    translate: -2rem
  }
}
.ex-card-slider__item.is-active .ex-card-slider__link {

  scale: 1.3
}
@media screen and (max-width: 767px) {
  .ex-card-slider__item.is-active .ex-card-slider__link {

    scale: 1.25
  }
}
.ex-card-slider__item.is-active .ex-card-slider__link::before {

}
@media screen and (max-width: 767px) {
  .ex-card-slider__item.is-active .ex-card-slider__link::before {

  }
}
.ex-card-slider__item.is-active .ex-card-slider__img {
  -webkit-transform: rotateY(360deg);
  transform: rotateY(360deg);
  -webkit-transition: -webkit-transform .6s .4s cubic-bezier(0.54, 0.2, 0.15, 0.99);
  transition: -webkit-transform .6s .4s cubic-bezier(0.54, 0.2, 0.15, 0.99);
  transition: transform .6s .4s cubic-bezier(0.54, 0.2, 0.15, 0.99);
  transition: transform .6s .4s cubic-bezier(0.54, 0.2, 0.15, 0.99), -webkit-transform .6s .4s cubic-bezier(0.54, 0.2, 0.15, 0.99);
}
.ex-card-slider__item.is-active .ex-card-slider__img.ex-card-slider__img--illust {
  -webkit-transform: rotateY(180deg);
  transform: rotateY(180deg)
}
@media screen and (min-width: 768px) {
  .ex-card-slider__item.is-active + .ex-card-slider__item {
    translate: 2rem
  }
}
.ex-card-slider__link {
  position: relative;
  z-index: 1;
  display: block;
  height: 100%;
  background-color: #fff;
  -webkit-box-shadow: 0px .3rem 3.1rem rgba(56, 129, 133, .3);
  box-shadow: 0px .3rem 3.1rem rgba(56, 129, 133, .3);
  overflow: hidden;
  pointer-events: all;
  -webkit-transition: border .6s ease, opacity .6s ease, rotate .6s cubic-bezier(0.36, 0.16, 0.1, 0.98), translate .6s ease, scale .6s ease;
  transition: border .6s ease, opacity .6s ease, rotate .6s cubic-bezier(0.36, 0.16, 0.1, 0.98), translate .6s ease, scale .6s ease
}

@media screen and (max-width: 767px) {
  .ex-card-slider__link {
    -webkit-box-shadow: 0px .2rem 1.3rem rgba(177,177,177,0.30);
    box-shadow: 0px .2rem .3rem rgba(56, 129, 133, .3)
  }
}
.ex-card-slider__link::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  display: block;
  width: calc(100% - 0.6rem);
  height: calc(100% - 0.6rem);
  margin: auto;
  -webkit-transition: background-color .25s ease;
  transition: background-color .25s ease
}
@media screen and (max-width: 767px) {
  .ex-card-slider__link::before {
    width: calc(100% - 0.2rem);
    height: calc(100% - 0.2rem);

  }
}
.ex-card-slider__ttl {
  width: 100%;
margin-top: 15px;
  font-size: max(1.2rem, 10px);
  line-height: 1.7;
  letter-spacing: 0;
	font-weight: 700;
	color: #ffffff;
	margin-bottom: 10px
}
@media screen and (max-width: 767px) {
  .ex-card-slider__ttl {
    font-size: 1rem;
    font-size: max(1rem, 10px)
  }
}




.lcl-works .lcl-works-slider__imgarea {
  position: relative;
  width: 22.3rem;
  margin: .8rem auto 0;
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d
}
@media screen and (max-width: 767px) {
  .lcl-works .lcl-works-slider__imgarea {
    width: 16.7rem
  }
}
.lcl-works .lcl-works-slider__img {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform: rotateY(180deg);
  transform: rotateY(180deg);
  -webkit-transition: -webkit-transform .6s ease;
  transition: -webkit-transform .6s ease;
  transition: transform .6s ease;
  transition: transform .6s ease, -webkit-transform .6s ease
}
.lcl-works .lcl-works-slider__img.lcl-works-slider__img--illust {
  position: absolute;
  top: 0;
  left: 0;
  -webkit-transform: rotateY(0deg);
  transform: rotateY(0deg)
}


.ex-card-slider__imgarea {
  position: relative;
  width: 18.3rem;
  margin: 1.3rem auto 0;
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d
}
@media screen and (max-width: 767px) {
  .ex-card-slider__imgarea {
	    margin: 0.3rem auto 0;
    width: 16.7rem
  }
}
.ex-card-slider__img {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform: rotateY(180deg);
  transform: rotateY(180deg);
  -webkit-transition: -webkit-transform .6s ease;
  transition: -webkit-transform .6s ease;
  transition: transform .6s ease;
  transition: transform .6s ease, -webkit-transform .6s ease
}
.ex-card-slider__img.ex-card-slider__img--illust {
  position: absolute;
  top: 120px;
  left: 0;
  -webkit-transform: rotateY(0deg);
  transform: rotateY(0deg)
}

.kuusou {
	  position: relative;
  width: 90%;
	float: right;
	height: 100px;
	padding: 8px 0 10px 0px;
 margin-top: 25px;

	z-index: 100;
font-family: "Klee One", cursive;
  font-weight: 300;
	margin-bottom: 20px;
	background-image: url("../img/card/fukidashi.png");
	background-size: 100% auto;
	background-repeat: no-repeat;
	background-position: right top;
	text-align: center;
}
@media screen and (max-width: 767px) {
.kuusou {
	  position: relative;
  width:90%;
		height: 60px;
		padding: 3px 0 5px 0px;
}
	}
.ex-card-slider__copy {
  margin-top: 1rem;
  font-size: 1.3rem;
  font-size: max(1.3rem, 10px);
  line-height: 1.6;
  letter-spacing: 0;
	font-weight: 700;
}
@media screen and (max-width: 767px) {
  .ex-card-slider__copy {
    margin-top: .8rem;
    font-size: 1.2rem;
    font-size: max(1.2rem, 10px)
  }
}
.ex-card-slider__box {
	width: 86%;
	height: 100px;
	float: left;
	margin-top: 5px;
  letter-spacing: 0;
	padding: 10px;
	text-align: center;
		background-image: url("../img/card/tesugaku.png");
		background-size: 100% auto;
	background-repeat: no-repeat;
	background-position: right top;
	margin-bottom: 20px
	
}
.ex-card-slider__em {
  font-size: 2rem;
  font-size: max(2rem, 10px);
  line-height: 0.5;
	  color: #ffffff;
	font-weight: 700;
	  display: flex;
  justify-content: center; /* 横中央 */
  align-items: center;     /* 縦中央 */
  text-align: center;
	margin-top: 0px
	
}


.ex-card-slider__box .nomber {
  display: block;
  font-size: 0.9em;
 font-weight: 400;
  opacity: 0.9;
	margin: 0px 0 0 10%;
	color: #ffffff;
	text-align: left!important;
}


@media screen and (max-width: 767px) {
	.ex-card-slider__box {
	width: 92%;
	height: 80px;
	float: left;
	margin-top: 5px;
  letter-spacing: 0;

	
}
.ex-card-slider__em {
  font-size: 1.3rem;
  font-size: max(1.6rem, 10px);
	
}
.ex-card-slider__box .nomber {
  display: block;
  font-size: 0.7em;
 font-weight: 400;
  opacity: 0.9;
	margin: 0px 0 0 10%;
	color: #ffffff;
	text-align: left!important;
}
}


.tetugaku-cat .tetugaku-cat__illust {
  position: absolute;
  width: 13rem
}
@media screen and (max-width: 767px) {
  .tetugaku-cat .tetugaku-cat__illust {
    width: 8rem
  }
}
.tetugaku-cat .tetugaku-cat__illust:nth-of-type(1) {
  left: 0;
  bottom: 7.5rem
}
@media screen and (max-width: 767px) {
  .tetugaku-cat .tetugaku-cat__illust:nth-of-type(1) {
    left: -0.6rem;
    bottom: 3.5rem
  }
}
.tetugaku-cat .tetugaku-cat__illust:nth-of-type(2) {
  left: 8.2rem;
  bottom: 8.5rem
}
@media screen and (max-width: 767px) {
  .tetugaku-cat .tetugaku-cat__illust:nth-of-type(2) {
    left: 6.4rem;
    bottom: 1.7rem
  }
}


.fusen-title {
	width: 400px;
    position: relative;
    margin-bottom: 0.2rem;
    padding: 1rem;
    border-left: 30px solid #fbe46c;
    background-color: #FAFAFA;
    color: #212121;
    font-size: 21px;
	font-weight: bold;
	margin-bottom: 10px
}

.usen-title::before {
    position: absolute;
    right: 1px;
    bottom: 10px;
    width: 40%;
    height: 50%;
    box-shadow: 0 5px 25px #333;
    transform: rotate(4deg);
    z-index: -1;
    content: '';
}
@media screen and (max-width: 767px) {
	.fusen-title {
	width: 90%;
}
}