:root {
	/* 色変更される場合は、#以降のカラーコードを変更してください IE非対応 */
	--base-color: #153368;
	scroll-behavior: smooth;
}

.promo-bg{
	padding:20px;
}

.promo-bg:before {
	content: '';
	display: block;
	position: absolute;
	z-index: 1;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	/*background: linear-gradient(30deg, #1ECDBC, #1ECDBC, #16bbe4, #1ECDBC, #1ECDBC);
    background-size: 600% 600%;
	-webkit-animation: AnimationName 9s ease infinite;
	-moz-animation: AnimationName 9s ease infinite;
	animation: AnimationName 9s ease infinite;*/
	background: linear-gradient(90deg, var(--key-color4) 0, var(--key-color5) 100%);
}


/*
動くグラデーション
–––––––––––––––––––––––––––––––––––––––––––––––––– */

@-webkit-keyframes AnimationName {
    0%{background-position:0% 58%}
    50%{background-position:100% 43%}
    100%{background-position:0% 58%}
}
@-moz-keyframes AnimationName {
    0%{background-position:0% 58%}
    50%{background-position:100% 43%}
    100%{background-position:0% 58%}
}
@keyframes AnimationName {
    0%{background-position:0% 58%}
    50%{background-position:100% 43%}
    100%{background-position:0% 58%}
}

.promo-front {
	position: relative;
	z-index: 2;
	padding: 0%;
}
@media screen and (min-width: 1200px) {
	.promo-front {
		padding: 2%;
	}
}

.promo-h1 {
	font-weight: 700;
	margin: 0;
	font-size: 2.5em;
	color: #FFF;
}
.promo-h2 {
	font-weight: 700;
	margin: 1em 0;
	font-size: 0.3em;
	color: #FFF;
}

.wrap-original-transform-1 {
	perspective: 600px;
	transform-style: preserve-3d;
}

.original-transform-1 {
	transform: translateX(15px) translateY(80px) scale(0.9);
}
@media screen and (min-width: 1200px) {

	.original-transform-1 {
		transform: translateX(-50px) translateY(25px) scale(1.2);
	}
}


.conclusion{
	width:100%;
	max-width: 450px;
	margin-top: -80px;

}

@media screen and (min-width: 1200px) {
	.conclusion{
		width:100%;
		max-width: 600px;
	}	
}

.right{
	text-align: right;
}
/*
ボタン
–––––––––––––––––––––––––––––––––––––––––––––––––*/

.btn {
	font-size: 1.6rem;
	font-weight: 700;
	line-height: 1.5;
	position: relative;
	display: inline-block;
	padding: 1rem 4rem;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	-webkit-transition: all 0.3s;
	transition: all 0.3s;
	text-align: center;
	vertical-align: middle;
	text-decoration: none;
	letter-spacing: 0.1em;
	border-radius: 0.5rem;
}

a.simplebutton {
	color: #fff;
	border: 2px solid #fff;
	border-radius: 0;
  }
  
a.simplebutton:hover {
	color: #fff;
	background: #00000044;
  }

/*
ボタン
–––––––––––––––––––––––––––––––––––––––––––––––––– */

  a.masterbutton {
	font-size: 1.8rem;
	border-radius: 100vh;
	background: linear-gradient(0deg, var(--key-color), var(--key-color) 100%);
	color: #fff;
  }
  
  a.masterbutton:hover {
	background: linear-gradient(45deg, var(--key-color2), var(--key-color) 100%);
}

/* レポート例-------------------------- */

.catch2 {
	text-align: center;
	padding-top: 2rem;
	padding-bottom: 2rem;
}

/* オリジナルカバーヘッダ　ここから-------------------------- */

.ContentOver-box {
	padding: 2em 0;
	margin: 0 calc(50% - 50vw);
	width: 100vw;
	background-color: #153368;
	background-position: center center;
	background-size: cover;
  }
  
  .ContentOver-box2 {
	padding: 1em 0;
	margin: 0 calc(50% - 50vw);
	width: 100vw;
	background-color: rgba(247, 247, 247, 0.9);
  }
  
  .ContentOver-box-inner1 {
	margin: auto;
	padding: 3px;
	width: 95%;
	max-width: 1350px;
	background-position: center center;
	background-size: cover;
	backdrop-filter: blur(3px);
  }
  
  .ContentOver-box-inner2 {
	margin: auto;
	padding-top: 2em;
	width: 95%;
	max-width: 1350px;
	text-align: center;
  }
  
  /* オリジナルカバーヘッダ　ここまで-------------------------- */