@charset "utf-8";

/*コンテンツ全体設定*/
*{
   margin : 0;
   padding : 0;
}


/*全体共通設定*/
html, body {
	font-family: 'Noto Serif JP', 'Yu Mincho', 'YuMincho', serif;
	width: 100%;
	overflow-x: hidden;
	font-size: 1vw;
}
@media(max-width: 768px){
	html, body {
		font-size: 10px;
	}
}
@media(min-width: 1600px){
	html, body {
		font-size: 16px;
	}
}

/*HOME*/
#main_view {
	position: relative;
	width: 100%;
	height: calc(100vh - 5.5rem);
	overflow: hidden;
}

#main_view .main-img {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	opacity: 0;
	z-index: 1;
}
@media(max-width: 1200px){
	#main_view .main-img{
		height: 100%;
		width: 100%;
	}
}
#main_view .main-img:nth-of-type(1) {
	-webkit-animation-delay: 0s;
	animation-delay: 0s;
	opacity: 1;
	animation: main-img-anim1 20s infinite;
}
#main_view .main-img:nth-of-type(2) {
	animation: main-img-anim2 20s infinite;
}
#main_view .main-img:nth-of-type(3) {
	animation: main-img-anim3 20s infinite;
}
@keyframes main-img-anim1{
	0%{
		opacity: 1;
	}
	23%{
		opacity: 1;
	}
	33%{
		opacity: 0;
	}
	89%{
		opacity: 0;
	}
	99%{
		opacity: 1;
	}
}
@keyframes main-img-anim2{
	23%{
		opacity: 0;
	}
	33%{
		opacity: 1;
	}
	56%{
		opacity: 1;
	}
	66%{
		opacity: 0;
	}
}
@keyframes main-img-anim3{
	56%{
		opacity: 0;
	}
	66%{
		opacity: 1;
	}
	89%{
		opacity: 1;
	}
	99%{
		opacity: 0;
	}
}

#main_view .main-title {
	position: absolute;
	width: 4.1rem;
	height: 30.9rem;
	max-height: 90%;
	top: 10%;
	left: calc(50% - 2.05vw);
	z-index: 10;
}

#main_view .main-description {
	z-index: 10;
	position: absolute;
	bottom: 2%;
	right: calc(50% + 2.05vw + 3.1vw);
	color: #ffffff;
	writing-mode: vertical-rl;
	line-height: 2.3em;
	letter-spacing: 0.1em;
}

#main_menu {
	display: flex;
	justify-content: space-between;
	align-items: center;
	height: 5.5rem;
	background-color: #040838;
	color: #ffffff;
}
#main_menu .menu-logo {
	width: 17.3rem;
	height: 4.5rem;
	margin-left: 2.5vw;
}
#main_menu .menu-wrapper {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	list-style: none;
	height: 100%;
}
#main_menu .menu-wrapper li {
	height: 100%;
}
#main_menu .menu-wrapper li a {
	color: #ffffff;
	text-decoration: none;
	padding: 0 1.5em;
	display: flex;
	align-items: center;
	height: 100%;
}
#main_menu .menu-wrapper li.contact-button {
	background-color: #af3c3c;
}

/*グローバルメニュー*/

#global_header {
	position: fixed;
	top: 0;
	left: 0;
	height: 5.6rem;
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
#global_header.colored {
	background-color: #040838;
}
#global_header .menu-wrapper {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	list-style: none;
	height: 100%;
}
#global_header .menu-logo {
	width: 17.3rem;
	height: 4.5rem;
	margin-left: 2.5vw;
}
#global_header .menu-wrapper li {
	height: 100%;
}
#global_header .menu-wrapper li a {
	color: #ffffff;
	text-decoration: none;
	padding: 0 1.5em;
	display: flex;
	align-items: center;
	height: 100%;
}
#global_header.colored .menu-wrapper li.contact-button {
	background-color: #af3c3c;
}

/*ビジョンページ*/
#vision_main {
	background-image: url(./img/photo1.jpg);
	background-repeat: no-repeat;
	background-size: 100% 30.6rem;
	background-position: center top;
	height: 30.6rem;
}
#vision_main h1 {
	padding: 15rem 0 0;
	text-align: center;
	color: #ffffff;
	font-size: 2rem;
	letter-spacing: 0.1em;
	font-weight: normal;
}
#vision_maintext {
	height: 50rem;
	padding: 4.4rem 10.9rem 0;
	letter-spacing: 0.1em;
	line-height: 2em;
}

/*フッター*/
footer {
	height: 5rem;
	background-color: #040838;
}