@charset "UTF-8";  
@import url(https://fonts.googleapis.com/earlyaccess/notosansjp.css);/*------------------------------------common------------------------------------*/
html,body {width: 100%;color: #2c2c2c;min-width: 750px;}
body {font-family: "Noto Sans JP","游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;box-sizing: border-box;}
.l-container img {vertical-align: bottom;display: block;}
.m_auto {margin: 0 auto;}
a {transition: .3s;}
a:hover {opacity: .8;}
video {width: 100%;}
.wrap {width: 750px;margin: 0 auto;background: #fff;box-shadow: 0 0 10px 2px #d6d6d6;overflow: hidden;padding:0;}
.wrapInner {width: 670px;margin: 0 auto;}
.white_cont {width: 670px;margin: 0 auto;box-shadow: 0 0 10px 2px #e4dac4;border-radius: 20px;box-shadow: 10px 10px 15px 0px #e4dac4;}
.header {/*box-shadow: 0px 0px 15px -5px #777777;*/position: relative;}
.l-container main {margin-top: 0;}


/* ========================cta======================== */
.cta {
  display: grid;
  background-color: #000;
}
.cta .cta_base {
  grid-area: 4 / 1 / 6;
}
.cta .cta_btn {
  grid-area: 4 / 1 / 5 ;
  width: min(calc(653/750 * 100vw), 653px);
  margin: auto;
  position: relative;
}

.ank {
  background: #EFECE8;
}

.check {
  background: #3F454A;
}

.support {
  background: #FBEDEB;
}

/* ボタンの光 */
.shine {
	position: absolute;
	width: 96.91%;
	padding-top: 25.58%;
	border-radius: 100vh;
	overflow: hidden;
	top: 0;
	left: 0;
	z-index: 1;
	pointer-events: none;
	mix-blend-mode: overlay;
}

.shine::before {
	content: "";
	width: 200%;
	height: 200%;
	background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 20%, rgba(255, 255, 255, 1) 45%, rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 1) 55%, rgba(255, 255, 255, 0) 80%, rgba(255, 255, 255, 0) 100%);
	background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 20%, rgba(255, 255, 255, 1) 45%, rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 1) 55%, rgba(255, 255, 255, 0) 80%, rgba(255, 255, 255, 0) 100%);
	background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 20%, rgba(255, 255, 255, 1) 45%, rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 1) 55%, rgba(255, 255, 255, 0) 80%, rgba(255, 255, 255, 0) 100%);
	position: absolute;
	top: -50%;
	left: -50%;
	z-index: 1;
	animation: shine 2s linear infinite;
}

@keyframes shine {

	from,
	0% {
		-webkit-transform: translate3d(-100%, 0, 0) rotate(45deg);
		transform: translate3d(-100%, 0, 0) rotate(45deg);
		opacity: 0;
	}

	20% {
		-webkit-transform: translate3d(-100%, 0, 0) rotate(45deg);
		transform: translate3d(-100%, 0, 0) rotate(45deg);
		opacity: 1;
	}

	70% {
		-webkit-transform: translate3d(100%, 0, 0) rotate(45deg);
		transform: translate3d(100%, 0, 0) rotate(45deg);
		opacity: 1;
	}

	80% {
		-webkit-transform: translate3d(100%, 0, 0) rotate(45deg);
		transform: translate3d(100%, 0, 0) rotate(45deg);
		opacity: 0;
	}

	to,
	100% {
		-webkit-transform: translate3d(-100%, 0, 0) rotate(45deg);
		transform: translate3d(-100%, 0, 0) rotate(45deg);
		opacity: 0;
	}
}

@media screen and (max-device-width: 768px){html,body {min-width: 100%;max-width: 750px;width: 100%;}
.wrap {width: 100%;box-shadow: none;}
.wrapInner {width: calc(670/750*100vw);}
.white_cont {width: calc(670/750*100vw);box-shadow: 0 0 calc(10/750*100vw) calc(2/750*100vw) #e4dac4;border-radius: calc(20/750*100vw);box-shadow: calc(10/750*100vw) calc(10/750*100vw) calc(15/750*100vw) 0px #e4dac4;}

}