@charset "UTF-8";
/*! sanitize.css | CC0 Public Domain | github.com/jonathantneal/sanitize.css */
/* These browsers currently include
** Android 4.3-4.4+,
** Chrome 39-40+,
** Firefox 34-35+,
** Internet Explorer 10-11+,
** iOS 7-8+,
** Safari 7-8+,
** Windows Phone 8.1+.
*/
/*
 * Normalization
 */
:root {
		-ms-overflow-style: -ms-autohiding-scrollbar;
		-webkit-text-size-adjust: 100%;
		   -moz-text-size-adjust: 100%;
		    -ms-text-size-adjust: 100%;
		        text-size-adjust: 100%;
}

audio:not([controls]) {
		display: none;
}

details {
		display: block;
}

input[type=number] {
		width: auto;
}
input[type=search] {
		-webkit-appearance: textfield;
}
input[type=search]::-webkit-search-cancel-button, input[type=search]::-webkit-search-decoration {
		-webkit-appearance: none;
}

main {
		display: block;
}

summary {
		display: block;
}

pre {
		overflow: auto;
}

progress {
		display: inline-block;
}

small {
		font-size: 75%;
}

template {
		display: none;
}

textarea {
		overflow: auto;
}

[hidden] {
		display: none;
}

[unselectable] {
		-webkit-user-select: none;
		   -moz-user-select: none;
		    -ms-user-select: none;
		        user-select: none;
}

/*
 * Universal inheritance
 */
*,
::before,
::after {
		-webkit-box-sizing: inherit;
		        box-sizing: inherit;
}

* {
		font-size: inherit;
		line-height: inherit;
}

::before,
::after {
		text-decoration: inherit;
		vertical-align: inherit;
}

/*
 * Opinionated defaults
 */
*,
::before,
::after {
		border-style: solid;
		border-width: 0;
}

* {
		margin: 0;
		padding: 0;
}

:root {
		-webkit-box-sizing: border-box;
		        box-sizing: border-box;
		cursor: default;
		font: 62.5%/1em sans-serif;
		text-rendering: optimizeLegibility;
}
@media screen and (min-width: 769px) {
		:root {
				font: 0.78125vw/1em sans-serif;
		}
}
@media screen and (min-width: 1600px) {
		:root {
				font: 78.125%/1em sans-serif;
		}
}

html {
		background-color: #FFFFFF;
}

a {
		text-decoration: none;
}

audio,
canvas,
iframe,
img,
svg,
video {
		vertical-align: middle;
}

button,
input:not([type=radio]),
select,
textarea {
		background-color: transparent;
}

button,
input:not([type=radio]),
select,
textarea {
		color: inherit;
		font-family: inherit;
		font-style: inherit;
		font-weight: inherit;
}

button,
[type=button],
[type=date],
[type=datetime],
[type=datetime-local],
[type=email],
[type=month],
[type=number],
[type=password],
[type=reset],
[type=search],
[type=submit],
[type=tel],
[type=text],
[type=time],
[type=url],
[type=week],
select,
textarea {
		min-height: 1em;
}

input[type=submit],
input[type=button] {
		border-radius: 0;
		-webkit-appearance: button;
		   -moz-appearance: button;
		        appearance: button;
		border: none;
		-webkit-box-sizing: border-box;
		        box-sizing: border-box;
		cursor: pointer;
}

input[type=submit]::-webkit-search-decoration,
input[type=button]::-webkit-search-decoration {
		display: none;
}

input[type=submit]::focus,
input[type=button]::focus {
		outline-offset: -2px;
}

code,
kbd,
pre,
samp {
		font-family: monospace, monospace;
}

nav ol,
nav ul {
		list-style: none;
}

select {
		-moz-appearance: none;
		-webkit-appearance: none;
}
select::-ms-expand {
		display: none;
}
select::-ms-value {
		color: currentColor;
}

table {
		border-collapse: collapse;
		border-spacing: 0;
}

textarea {
		resize: vertical;
}

::-moz-selection {
		color: #FFFFFF;
		background-color: #000000;
		text-shadow: none;
}

::selection {
		color: #FFFFFF;
		background-color: #000000;
		text-shadow: none;
}

@media screen {
		[hidden~=screen] {
				display: inherit;
		}

		[hidden~=screen]:not(:active):not(:focus):not(:target) {
				clip: rect(0 0 0 0) !important;
				position: absolute !important;
		}
}
* {
		margin: 0;
		padding: 0;
		outline: 0;
}

/* general params
--------------------*/
h1, h2, h3, h4, h5, h6,
div, p, pre, ul, ol, dl, dt, dd,
address, form, blockquote {
		margin: 0;
		padding: 0;
		/* margin&padding reset */
		font-style: normal;
}

h1, h2, h3, h4, h5, h6, dt {
		font-weight: 700;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
		display: block;
		margin: 0;
}

table {
		border-collapse: collapse;
		font-size: small;
		margin: 0;
		empty-cells: show;
}

hr, .areaAnchor, .anchor {
		display: none;
}

img {
		vertical-align: bottom;
		border: none;
		/* img do not want a border */
}

li {
		list-style: none;
}

blockquote, q {
		quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
		content: "";
		content: none;
}

ins {
		text-decoration: none;
		color: #000;
}

small, sub, sup {
		font-size: 0.83em;
}

sub {
		display: inline-block;
		vertical-align: middle;
		-webkit-transform: translateY(15%);
		        transform: translateY(15%);
}

sup {
		display: inline-block;
		vertical-align: middle;
		-webkit-transform: translateY(-15%);
		        transform: translateY(-15%);
}

mark {
		font-weight: bold;
		font-style: italic;
		color: #000;
}

del {
		text-decoration: line-through;
}

abbr[title], dfn[title] {
		cursor: help;
		border-bottom: 1px dotted;
}

table {
		border-spacing: 0;
		border-collapse: collapse;
}

/* acronyms and abbreviations styles
-------------------------------------*/
acronym, abbr {
		cursor: help;
}

/* word break
-------------------------------------*/
p {
		word-break: normal;
}

/* image position
-------------------------------------*/
img {
		vertical-align: bottom;
}

/*
===== 2: form setting ===========================
*/
option {
		padding-right: 10px;
}

input, select {
		vertical-align: middle;
}

/*--------------------------------------------------------------- */
/* 全体で使用する common style を記述
/*--------------------------------------------------------------- */
/**/
@font-face {
		font-family: "UNTRACE";
		src: url("fonts/Revolt-Light.woff") format("woff");
		font-weight: 400;
}
@font-face {
		font-family: "UNTRACE";
		src: url("../woff/UNTRACE-Light.woff") format("woff");
		font-weight: 300;
}
@font-face {
		font-family: "UNTRACE";
		src: url("../woff/UNTRACE-Medium_1.woff") format("woff");
		font-weight: 500;
}
@font-face {
		font-family: "UNTRACE";
		src: url("../woff/UNTRACE-Bold.woff") format("woff");
		font-weight: 700;
}
/* 游ゴシック */
@font-face {
		font-family: "Yu Gothic";
		src: local("Yu Gothic Medium");
		font-weight: 100;
}
@font-face {
		font-family: "Yu Gothic";
		src: local("Yu Gothic Medium");
		font-weight: 200;
}
@font-face {
		font-family: "Yu Gothic";
		src: local("Yu Gothic Medium");
		font-weight: 300;
}
@font-face {
		font-family: "Yu Gothic";
		src: local("Yu Gothic Medium");
		font-weight: 400;
}
@font-face {
		font-family: "Yu Gothic";
		src: local("Yu Gothic Bold");
		font-weight: bold;
}
/*-------------------------------------------> font */
.EN {
		font-family: "UNTRACE", "Yu Gothic", "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "メイリオ", sans-serif;
}

.f_def {
		font-weight: 300;
}

.f_light {
		font-weight: 300;
}

.f_med {
		font-weight: 500;
}

.f_bold {
		font-weight: 700;
}

/*-------------------------------------------> html / body style */
html {
		height: 100%;
}

body {
		width: 100%;
		height: 100%;
		color: #000;
		font-family: "Yu Gothic", "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "メイリオ", sans-serif;
		font-weight: 300;
		text-align: center;
		overflow-y: scroll;
		overflow-x: auto;
		position: relative;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
}
body::after {
		opacity: 0;
		-webkit-transition: opacity 4s ease-out;
		transition: opacity 4s ease-out;
		content: "";
		display: block;
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 10;
		background-repeat: no-repeat;
		background-position: left top;
}
@media screen and (min-width: 769px) {
		body::after {
				background-image: url(../images/bg@1x.jpg);
		}
}
@media screen and (-webkit-min-device-pixel-ratio: 2), (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
		body::after {
				background-image: url(../images/bg@2x.jpg);
		}
}
@media screen and (max-width: 768px) {
		body::after {
				background-image: url(../images/bg@sp.jpg);
				background-size: 100% auto;
		}
}
body.bgFade::after {
		opacity: 1;
}
@media screen and (min-width: 769px) {
		body .pc {
				display: block;
		}
		body .sp {
				display: none;
		}
		body img.pc,
body .svg.pc {
				display: inline;
		}
		body > * {
				-webkit-font-feature-settings: "palt";
				        font-feature-settings: "palt";
		}
}
@media screen and (max-width: 768px) {
		body {
				min-width: initial;
				height: 100%;
		}
		body .pc {
				display: none;
		}
		body .sp {
				display: block;
		}
		body img.pc {
				display: none;
		}
		body img.sp,
body .svg.sp {
				display: inline;
		}
		body img {
				max-width: 100%;
				height: auto;
		}
		body > * {
				-webkit-font-feature-settings: "palt";
				        font-feature-settings: "palt";
		}
}

.hide {
		display: none;
}

/*-------------------------------------------> link style */
a {
		outline: none;
		cursor: pointer;
}
a:link {
		text-decoration: none;
}
a:visited {
		text-decoration: none;
}
a:hover {
		text-decoration: none;
}
a:active {
		text-decoration: none;
}

@media screen and (min-width: 769px) {
		.OverOpacity,
.OverOpacityGroup a {
				opacity: 1;
				-webkit-transition: opacity 0.15s ease-out;
				transition: opacity 0.15s ease-out;
		}
		.OverOpacity:hover,
.OverOpacityGroup a:hover {
				opacity: 0.3;
		}
}
/*-------------------------------------------> Common style */
img {
		max-width: 100%;
		height: auto;
		vertical-align: top;
}

br.pc {
		display: block;
}
br.pc.sp {
		display: block;
}
br.sp {
		display: none;
}
@media screen and (max-width: 768px) {
		br.pc {
				display: none;
		}
		br.sp {
				display: block;
		}
		br.sp.pc {
				display: block;
		}
}

.taLeft {
		text-align: left !important;
}

.taCenter {
		text-align: center !important;
}

.taRight {
		text-align: right !important;
}

.clearfix:after {
		content: "";
		display: block;
		clear: both;
}

/*-------------------------------------------> Header */
#Header {
		pointer-events: none;
}

#Navi {
		position: fixed;
		z-index: 100;
		top: 17px;
		right: 32px;
}
#Navi ul {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: end;
		    -ms-flex-pack: end;
		        justify-content: flex-end;
		-webkit-box-align: center;
		    -ms-flex-align: center;
		        align-items: center;
}
#Navi ul li {
		font-size: 14px;
		line-height: 24px;
}
#Navi ul li:nth-child(1) {
		padding-right: 16px;
}
#Navi ul li:nth-child(2) {
		border-left: solid 1px #000;
		padding-left: 16px;
}
#Navi ul li:nth-child(2) img {
		width: 20px;
}
#Navi ul li a {
		pointer-events: auto;
		color: #000;
}
@media screen and (max-width: 768px) {
		#Navi {
				top: 4vw;
				right: 4.2666666667vw;
		}
		#Navi ul li {
				font-size: 3.7333333333vw;
				line-height: 5.8666666667vw;
		}
		#Navi ul li:nth-child(1) {
				padding-right: 4.2666666667vw;
		}
		#Navi ul li:nth-child(2) {
				padding-left: 4.2666666667vw;
		}
		#Navi ul li:nth-child(2) img {
				width: 5.3333333333vw;
		}
}

#Copy {
		position: fixed;
		z-index: 100;
		top: 22px;
		left: 10px;
		font-size: 16px;
		line-height: 1.375;
		letter-spacing: 0em;
		letter-spacing: 0.02em;
		white-space: nowrap;
		text-align: left;
		-webkit-transform-origin: left bottom;
		        transform-origin: left bottom;
		-webkit-transform: rotate(90deg) translate(-2.7em, 0em);
		        transform: rotate(90deg) translate(-2.7em, 0em);
}
@media screen and (max-width: 768px) {
		#Copy {
				top: 4.8vw;
				left: 1.3333333333vw;
				font-size: 12px;
				/* legacy */
				font-size: 3.2vw;
				line-height: 1.5;
				letter-spacing: 0em;
				-webkit-transform: rotate(90deg) translate(-3em, 0em);
				        transform: rotate(90deg) translate(-3em, 0em);
		}
}

/*-------------------------------------------> Cover */
#Cover {
		pointer-events: none;
		position: relative;
		z-index: 100;
		width: 100%;
		height: 100%;
}
#Cover .wrap {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		    -ms-flex-direction: column;
		        flex-direction: column;
		-webkit-box-pack: center;
		    -ms-flex-pack: center;
		        justify-content: center;
		-webkit-box-align: center;
		    -ms-flex-align: center;
		        align-items: center;
		width: 100%;
		height: 100%;
}
#Cover .logo {
		padding-top: 90px;
}
#Cover .logo img {
		width: 188px;
}
#Cover .button {
		margin-top: 95px;
		vertical-align: bottom;
}
#Cover .button a {
		pointer-events: auto;
		text-decoration: none;
		display: block;
		width: 205px;
		margin: 0 auto;
		font-size: 16px;
		line-height: 2.25;
		letter-spacing: 0em;
		letter-spacing: 0.02em;
		font-weight: bold;
		color: #000;
		border: solid 1px #000;
		cursor: pointer;
}
#Cover .button a span {
		display: inline-block;
		padding-top: 4px;
		padding-left: 15px;
		background: url(../images/arrow_button.svg) no-repeat left center;
		background-size: auto 12px;
}
@media screen and (min-width: 769px) {
		#Cover .button a {
				-webkit-transition: all 0.15s ease-out;
				transition: all 0.15s ease-out;
				opacity: 1;
		}
		#Cover .button a span {
				-webkit-transition: all 0.15s ease-out;
				transition: all 0.15s ease-out;
		}
		#Cover .button a:hover {
				opacity: 0.5;
		}
		#Cover .button a:hover span {
				background: url(../images/arrow_button.svg) no-repeat 3px center;
				background-size: auto 12px;
		}
}
@media screen and (max-width: 768px) {
		#Cover .wrap {
				-webkit-box-pack: end;
				    -ms-flex-pack: end;
				        justify-content: flex-end;
		}
		#Cover .logo {
				padding-top: 0;
		}
		#Cover .logo img {
				width: 37.0666666667vw;
		}
		#Cover .button {
				margin-top: 32.2666666667vw;
				padding-bottom: 14.6666666667vw;
		}
		#Cover .button a {
				width: 44.5333333333vw;
				font-size: 16px;
				/* legacy */
				font-size: 4.2666666667vw;
				line-height: 2.375;
				letter-spacing: 0em;
		}
		#Cover .button a span {
				padding-top: 1.3333333333vw;
		}
}

/*-------------------------------------------> Footer */
#Footer .copyright {
		position: fixed;
		z-index: 100;
		font-size: 12px;
		letter-spacing: 0.05em;
		left: calc(100% - 32px);
		bottom: 22px;
		-webkit-transform-origin: left bottom;
		        transform-origin: left bottom;
		-webkit-transform: rotate(-90deg) translate(0em, 1em);
		        transform: rotate(-90deg) translate(0em, 1em);
		white-space: nowrap;
}
@media screen and (max-width: 768px) {
		#Footer .copyright {
				font-size: 2.6666666667vw;
				left: calc(100% - (46/750*100vw));
				bottom: 5.0666666667vw;
		}
}

/*-------------------------------------------> Loading */
#Loading {
		position: fixed;
		z-index: 1000;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: #FFF;
}
#Loading .Loading-wrap {
		display: none;
}

/*-------------------------------------------> plugin style */