@charset "UTF-8";
/* CSS Document */

/*----------
 hd
----------*/
#hd_global .top_logo {
	display: block;
}
#hd_global .lower_logo {
	display: none;
}

/*----------
 top
----------*/
#mv {
	width: 100%;
	height: 100vh;
	background: url("../img/top_mv_pc.jpg") no-repeat;
	background-size: cover;
}
#mv h1 {
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
	width: 722px;
	height: 377px;
	margin: auto;
	-webkit-transform: translateY(-65px);
	-ms-transform: translateY(-65px);
	-o-transform: translateY(-65px);
	transform: translateY(-65px);
}
#mv h1 img {
	width: 100%;
}
#copy {
	position: absolute;
	top: 0;
	right: 20px;
	bottom: 0;
	width: 14px;
	height: 269px;
	margin: auto;
	color: #fff;
	-webkit-transform: translateY(-65px);
	-ms-transform: translateY(-65px);
	-o-transform: translateY(-65px);
	transform: translateY(-65px);
}
#copy img {
	width: 100%;
	height: 100%;
}
@media (max-width: 768px) {
	#mv {
		background: url("../img/top_mv_sp.jpg") no-repeat;
		background-size: cover;
	}
	#mv h1 {
		width: 205px;
		height: 369px;
		-webkit-transform: translateY(-32.5px);
		-ms-transform: translateY(-32.5px);
		-o-transform: translateY(-32.5px);
		transform: translateY(-32.5px);
	}
	#copy {
		right: 10px;
		width: 9.5px;
		height: 191.5px;
		font-size: 10px;
		-webkit-transform: translateY(-32.5px);
		-ms-transform: translateY(-32.5px);
		-o-transform: translateY(-32.5px);
		transform: translateY(-32.5px);
	}
}
@media (max-width: 375px) {
	#mv h1 {
		width: 54.66667vw;
		height: 98.4vw;
		-webkit-transform: translateY(-8.66667vw);
		-ms-transform: translateY(-8.66667vw);
		-o-transform: translateY(-8.66667vw);
		transform: translateY(-8.66667vw);
	}
	#copy {
		right: 8.66667vw;
		width: 2.53333vw;
		height: 51.06667vw;
		font-size: 8.66667vw;
		-webkit-transform: translateY(-8.66667vw);
		-ms-transform: translateY(-8.66667vw);
		-o-transform: translateY(-8.66667vw);
		transform: translateY(-8.66667vw);
	}
}


/*----------
 ft_nav
----------*/
#ft_nav {
	position: fixed;
	bottom: 0;
	width: 100%;
}
#ft_nav ul {
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-wrap: nowrap;
	-ms-flex-wrap: nowrap;
	flex-wrap: nowrap;
	-webkit-justify-content: space-between;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center;
	width: 100%;
}
#ft_nav ul li {
	width: 20%;
	background: #fff;
}
#ft_nav ul li.about a {
	background: url("../img/icon_about.png") no-repeat #0068b7;
	background-position: top -15px center;
	background-size: auto;
}
#ft_nav ul li.vision a {
	background: url("../img/icon_vision.png") no-repeat #0dab20;
	background-position:  top -15px center;
	background-size: auto;
}
#ft_nav ul li.solutions a {
	background: url("../img/icon_solutions.png") no-repeat #ea8400;
	background-position: top -15px center;
	background-size: auto;
}
#ft_nav ul li.case_study a {
	background: url("../img/icon_case_study.png") no-repeat #d54f8b;
	background-position: top -15px center;
	background-size: auto;
}
#ft_nav ul li.contact a {
	background: url("../img/icon_contact.png") no-repeat #873fb0;
	background-position: top -15px center;
	background-size: auto;
}
#ft_nav ul li a {
	display: block;
	height: 130px;
	padding-top: 75px;
	color: #fff;
	font-size: 22px;
	font-weight: 600;
	text-align: center;
	-webkit-transition: .3s opacity ease-out;
	-o-transition: .3s opacity ease-out;
	transition: .3s opacity ease-out;
}
#ft_nav ul li a:hover {
	opacity: .7;
}
#ft_nav ul li.disabled a {
	pointer-events: none;
}
#ft_nav ul li.case_study.disabled a {
	color: #e284ae;
}
#ft_nav ul li.disabled a span {
	display: block;
	margin-top: 5px;
	font-size: 16px;
}

@media (max-width: 768px) {
	#ft_nav ul li.about a {
		background: url("../img/icon_about.png") no-repeat #0068b7;
		background-position: top -10px center;
		background-size: 100px;
	}
	#ft_nav ul li.vision a {
		background: url("../img/icon_vision.png") no-repeat #0dab20;
		background-position: top -10px center;
		background-size: 100px;
	}
	#ft_nav ul li.solutions a {
		background: url("../img/icon_solutions.png") no-repeat #ea8400;
		background-position: top -10px center;
		background-size: 100px;
	}
	#ft_nav ul li.case_study a {
		background: url("../img/icon_case_study.png") no-repeat #d54f8b;
		background-position: top -10px center;
		background-size: 100px;
	}
	#ft_nav ul li.contact a {
		background: url("../img/icon_contact.png") no-repeat #873fb0;
		background-position: top -10px center;
		background-size: 100px;
	}
	#ft_nav ul li a {
		height: 75px;
		padding-top: 48px;
		font-size: 12px;
	}
	#ft_nav ul li a:hover {
		opacity: 1;
	}
	#ft_nav ul li a:active {
		opacity: .7;
	}
	#ft_nav ul li.disabled a span {
		margin-top: 2px;
		font-size: 10px;
	}
}

@media (max-width: 375px) {
	#ft_nav ul li.about a {
		background: url("../img/icon_about.png") no-repeat #0068b7;
		background-position: top -2.66667vw center;
		background-size: 26.66667vw;
	}
	#ft_nav ul li.vision a {
		background: url("../img/icon_vision.png") no-repeat #0dab20;
		background-position: top -2.66667vw center;
		background-size: 26.66667vw;
	}
	#ft_nav ul li.solutions a {
		background: url("../img/icon_solutions.png") no-repeat #ea8400;
		background-position: top -2.66667vw center;
		background-size: 26.66667vw;
	}
	#ft_nav ul li.case_study a {
		background: url("../img/icon_case_study.png") no-repeat #d54f8b;
		background-position: top -2.66667vw center;
		background-size: 26.66667vw;
	}
	#ft_nav ul li.contact a {
		background: url("../img/icon_contact.png") no-repeat #873fb0;
		background-position: top -2.66667vw center;
		background-size: 26.66667vw;
	}
	#ft_nav ul li a {
		height: 20vw;
		padding-top: 12.8vw;
		font-size: 3.2vw;
	}
	#ft_nav ul li.disabled a span {
		margin-top: 0.53333vw;
		font-size: 2.66667vw;
	}
}