@charset "utf-8";

/* reset */

body,p,h1,h2,h3,h4,h5,h6 {
	margin: 0;
	padding: 0;
}

html {
	font-size: 62.5%;
}

a {
	text-decoration: none;
	color: #fff;
}

/* 全体 */
body {
	font-family: -apple-system, BlinkMacSystemFont,"Noto Sans Japanese","Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
	font-size: 16px;
	color: #fff;
	/* カーニングの設定 */
	letter-spacing: 1.5px;
	font-feature-settings: "palt" 1;
	font-kerning: auto;
	/* 行間の設定 */
	line-height: 1.75;
	position: relative;

	background: #000 url(../images/background.png) no-repeat;
	background-size: cover;
	background-attachment:fixed;
}

.wrapper {
	max-width: 1400px;
	margin: 0 auto;
}

.flash {
	animation-name: flash;
	transform-origin: center bottom;
	-webkit-animation-duration: .1s;
	animation-duration: .1s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	animation-iteration-count: 5;
}

#loader-bg {
	display: block;
	background: #000;
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 4;
}

.loader {
	font-family: 'Electrolize', sans-serif;
	color: #fff;
	position: fixed;
	bottom: 20px;
	right: 20px;
}

.loader span {
	display: inline-block;
	margin: 0 -.05em;
	animation: loading 3.5s infinite;
}

.loader span:nth-child(2) {
  animation-delay: .2s;
}
.loader span:nth-child(3) {
  animation-delay: .4s;
}
.loader span:nth-child(4) {
  animation-delay: 1s;
}
.loader span:nth-child(5) {
  animation-delay: 1.2s;
}
.loader span:nth-child(6) {
  animation-delay: 1.4s;
}
.loader span:nth-child(7) {
  animation-delay: 1.6s;
}
.loader span:nth-child(8) {
  animation-delay: 1.8s;
}
.loader span:nth-child(9) {
  animation-delay: 2s;
}
.loader span:nth-child(10) {
  animation-delay: 2.2s;
}
.loader span:nth-child(11) {
  animation-delay: 2.4s;
}
.loader span:nth-child(12) {
  animation-delay: 2.6s;
}
@keyframes loading {
  0%, 20%, 100% {
    transform: translateY(0);
  }
  10% {
    transform: translateY(-15px);
  }
}

.loader_logo {
	width: 120px;
	position: fixed;
	bottom: 70px;
	right: 60px;
	animation: fuwa 3s infinite;
	animation-timing-function:ease-in-out;
}

/*--------------------
　ヘッダー
--------------------*/
header {
	font-family: 'Electrolize', sans-serif;
	position: fixed;
	padding: 30px 30px;
	z-index: 3;
	width: 100%;
	max-width: 1400px;
	box-sizing: border-box;
}

header h2 {
	font-size: 14px;
}

.header_entry {
	background: rgba(0,0,0,.4);
	font-size: 20px;
	border: 1px solid #fff;
	display: block;
	width: 200px;
	height: 50px;
	line-height: 50px;
	margin: 20px 30px;
	box-sizing: border-box;
	position: absolute;
	top: 0;
	right: 0;
	text-align: center;
	text-shadow: 0 0 10px #42d4ba;
}

.header_entry.new_graduate {
	top: 60px;
}

.header_entry:hover {
  border: 1px solid #42d4ba;
  color: #42d4ba;
}

.header_entry:before,
.header_entry:after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
  left: 0;
  width: 100%;
  height: 100%;
}

.header_entry,
.header_entry:before,
.header_entry:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}

.header_entry:before {
	top: 0;
}

.header_entry:after {
	bottom: 0;
}

.header_entry:hover:before,
.header_entry:hover:after {
  height: 0;
  background-color: #42d4ba;
}

/*--------------------
　コンテンツ
--------------------*/
.contents {
	width: 100%;
	max-width: 1400px;
	text-align: center;
	position: absolute;
/*	top: 200px;*/
	z-index: 2;
}

/* タイトル */

.title_box {
/*	margin-bottom: 100px;*/
}

.title {
	font-size: 120px;
	font-family: 'Electrolize', sans-serif;
	line-height: normal;
}

h1.subtitle {
	opacity: 0;
}

.subtitle span {
	display: none;
}

.subtitle img {
	width: 490px;
}

.arrow_bottom {
	font-size: 20px;
	text-shadow: 0 0 15px #42d4ba;
	margin: 40px 0;
}

.arrow_bottom p {
	font-family: 'Electrolize', sans-serif;
	margin-bottom: 10px;
}

.continue_btn a {
	display: inline-block;
	width: 100%;
	text-shadow: 0 0 0;
	font-size: 14px;
	color: #ccc;
  transition: .3s;
  -webkit-transform: scale(1);
  transform: scale(1);
}

.continue_btn a:hover {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}


/* menu */
.menu {
	position: relative;
  overflow: hidden;
  margin: 0;
  padding: 120px 0 200px 0;
}

.menu:before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 120%;
	height: 55%;
	margin: 3% -10% 0;
	background: rgba(0,0,0,.4);
	background-size: cover;
	background-blend-mode: soft-light;
  -webkit-transform-origin: right center;
  -ms-transform-origin: right center;
  transform-origin: right center;
  -webkit-transform: rotate(-5.8deg);
  -ms-transform: rotate(-5.8deg);
  transform: rotate(-5.8deg);
  z-index: -1;
}

.menu div {
	width: 60%;
	margin: 0 auto;
	padding: 40px 0 40px;
	margin-bottom: 120px;
	background-blend-mode: overlay;
	background-size: 50%;
	transition: .8s;
	opacity: 0;
}

.menu_title {
	font-size: 90px;
	font-family: 'Electrolize', sans-serif;
	text-shadow: 0px 0px 15px rgba(56, 247, 213, 0.90);
	text-align: center;
	line-height: 1.1;

}

.menu_subtitle {
	font-family: 'Noto Sans Japanese', sans-serif;
	font-weight: bold;
	text-align: center;
	margin-bottom: 30px;
}

.menu_txt {
	font-family: 'Noto Sans Japanese', sans-serif;
	font-weight: bold;
	font-size: 20px;
	text-align: center;text-shadow: 0 0 15px #42d4ba;
	margin-bottom: 50px;
/*	padding-right: 60px;*/
}

.menu_link {
	text-align: center;
}

.coming {
	display: inline-block;
	position: relative;
	font-size: 20px;
	font-family: 'Electrolize', sans-serif;
	border: 1px solid #fff;
	width: 250px;
	height: 50px;
	line-height: 50px;
/*	padding: 20px 0 10px 33px;*/
	text-shadow: 0 0 10px #42d4ba;
	z-index: 2;
}

.menu_link a {
	display: inline-block;
	position: relative;
	font-size: 20px;
	font-family: 'Electrolize', sans-serif;
	border: 1px solid #fff;
	width: 200px;
	height: 50px;
	line-height: 50px;
/*	padding: 20px 0 10px 33px;*/
	text-shadow: 0 0 10px #42d4ba;
	z-index: 2;
}

.menu_link a:hover {
  border: 1px solid #42d4ba;
  color: #42d4ba;
}

.menu_link a:before,
.menu_link a:after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
  left: 0;
  width: 100%;
  height: 100%;
}

.menu_link a,
.menu_link a:before,
.menu_link a:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}

.menu_link a:before {
	top: 0;
}

.menu_link a:after {
	bottom: 0;
}

.menu_link a:hover:before,
.menu_link a:hover:after {
  height: 0;
  background-color: #42d4ba;
}

.ty_kerning{
	letter-spacing: 10px;
}

/* entry */

.entry {
	position: relative;
  overflow: hidden;
  margin: 0;
  padding: 80px 0 50px 0;
}

.entry:before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 120%;
	height: 120%;
	margin: 3% -10% 0;
	background: rgba(0,0,0,0.4);
	background-size: cover;
	background-blend-mode: soft-light;
  -webkit-transform-origin: right center;
  -ms-transform-origin: right center;
  transform-origin: right center;
  -webkit-transform: rotate(-5.8deg);
  -ms-transform: rotate(-5.8deg);
  transform: rotate(-5.8deg);
  z-index: -1;
}

.entry_title {
	width: 60%;
	margin: 0 auto;
	padding: 80px 0 0;
	background-blend-mode: overlay;
	background-size: 50%;
	transition: .8s;
}

.entry_box {
	text-shadow: 0 0 15px #42d4ba;
	width: 100px;
	min-width: 300px;
	opacity: 1;
	padding: 50px 0;
	margin: auto;
	margin-bottom: 50px;
	background: url(../images/left-top.png) no-repeat left -2px top -2px, url(../images/right-top.png) no-repeat right -2px top -2px, url(../images/left-bottom.png) no-repeat left -2px bottom -2px, url(../images/right-bottom.png) no-repeat right -2px bottom -2px, url(../images/back_border.png), rgba(0,0,0,.1);
/*	background-size: auto 100%;*/
	border: 1px solid rgba(255,255,255,.6);
	line-height: 1.4;
	position: relative;
	transition: .8s;
}

.finger {
	position: absolute;
	top: 95px;
	left: 50%;
	width: 48px;
	height: 27px;
	font-size: 60px;
	margin-left: -2.7em;
	background: url(../images/finger.png) no-repeat;
}

.entry_box p {
	font-size: 20px;
}

.entry_btn {
	margin: 5px 0 0;
	font-family: 'Electrolize', sans-serif;
}

.entry_btn a {
	display: inline-block;
	font-size: 65px;
  transition: .3s;
  -webkit-transform: scale(1);
  transform: scale(1);
}

.entry_btn a:hover {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

.entry .new_graduate a {
	font-size: 16px;
}

.top_return {
	background: rgba(0,0,0,1);
}

.top_return a {
	position: fixed;
	bottom: 0;
	right: 50px;
	display: inline-block;
	padding: 25px 0 20px;
	font-family: 'Electrolize', sans-serif;
	background: url(../images/arrow_top.png)no-repeat top center;
	text-shadow: 0 0 15px #42d4ba;
}

footer {
	background: rgba(0,0,0,1);
	color: #fff;
	font-family: 'Electrolize', sans-serif;
	text-shadow: 0 0 15px #42d4ba;
	padding: 20px 0;
}

.animation-wrapper {
	z-index: 1;
}

/* 背景パララックス */

.num{
  margin: 0;
  position: fixed;
  right: 10px;
  top: 10px;
	z-index: 10;
}

.para {
  width: 100%;
  position: fixed;
}

.chukei {
	max-width: 1400px;
	height: 2196px;
	margin: 0 auto;
	background: url(../images/rail.png) no-repeat bottom center;
	background-position: center bottom 0;
}

.kinkei {
	max-width: 1400px;
	height: 2600px;
	background: url(../images/kinkei.png)no-repeat bottom -200px center;
	background-position: center bottom 0;
}

.enkei {
	max-width: 1400px;
	height: 2400px;
	background: url(../images/supernatant.png) center top no-repeat, url(../images/enkei.jpg) no-repeat bottom center;
	background-position: center top 0;
}
