﻿/* layout */

#top {
	background: #eaedf4;
}


@media screen and (min-width: 768px){

	footer {
		padding-top: 150px;
	}

}

/*
visual
*******************************************************/

.visual {
	overflow: hidden;
}

.visual img {
	vertical-align: bottom;
	display: block;
}

.visual .slick {
	width: 100%;
	margin: 0;
	padding: 0;
}

.visual .slick > div {
	margin: 0;
	padding: 0;
}

.visual .slick div dl {
	background-image: linear-gradient(60deg, #0050be, #032468 65%);
}

.visual .slick div dl,
.visual .slick div dl dt,
.visual .slick div dl dd {
	margin: 0;
	padding: 0;
	line-height: 1;
}

.visual .slick div dl dt {
	display: block;
	position: absolute;
	width: 5%;
	left: 11%;
	top: 8%;
}

.visual .slick .slick-active dl dt {
	animation: anim 2s forwards;
}

.visual .slick div dl dd {
	width: 85%;
	margin: 0 0 0 15%;
}

.visual .slick div dl img {
	display: block;
	width: 100%;
}

@keyframes anim{
	0%{ trasform: translateY(-50%); opacity: 0; }
	100%{ trasform: translateY(0); opacity: 1; }
}


.slick-arrow.slick-prev {
	background: url(/assets/top/visual_icon_left.png) no-repeat;
	background-size: contain;
	z-index: 10;
}

.slick-arrow.slick-next {
	background: url(/assets/top/visual_icon_right.png) no-repeat;
	background-size: contain;
	z-index: 10;
}

.slick-prev:before,
.slick-prev:after,
.slick-next:before,
.slick-next:after {
	content: '';
}

.slick-next {
	right: 20px;
}

.slick-prev {
	left: 20px;
}


@media screen and (min-width: 768px){

	.slick-arrow.slick-prev,
	.slick-arrow.slick-next {
		width: 50px;
		height: 50px;
		opacity: 0.5;
		transition: .3s;
	}

	.slick-arrow.slick-prev:hover,
	.slick-arrow.slick-next:hover {
		opacity: 1;
	}

}

@media screen and (max-width: 768px){

	.slick-prev, .slick-next,
	[dir='rtl'] .slick-prev:before,
	[dir='rtl'] .slick-prev:after {
		width: 2em;
		height: 2em;
	}

}


/*
topics
*******************************************************/

#top_wrap #top_news {
	background: #fff;
}

#top_wrap #top_news ul {
	border-top: 1px solid #ddd;
	list-style: none;
	margin: 0;
	padding: 0;
}

#top_wrap #top_news ul li {
	border-bottom: 1px solid #ddd;
	margin: 0;
	padding: 0;
}

#top_wrap #top_news ul li a {
	line-height: 1.2;
	display: flex;
	font-weight: 400;
	padding: 1em 0.5em;
}

#top_wrap #top_news ul li a span {
	display: block;
}

#top_wrap #top_news ul li a span.date {
	font-weight: 600;
	width: 15%;
	text-align: left;
}

#top_wrap #top_news ul li a span.icon {
	color: #fff;
	padding: 0.25em 0.5em;
	width: 4em;
	display: inline-block;
	margin: 0 1.5em 0 0.5em;
	height: 1.3em;
	font-size: 80%;
}

#top_wrap #top_news ul li a strong {
	display: block;
	width: calc( 100% - 15% - 5em );
	text-align: left;
	font-weight: 400;
}

#top_wrap #top_news ul li a span.icon._news {
	background: #4c11e2;
}

#top_wrap #top_news ul li a span.icon._release {
	background: #1da586;
}

#top_wrap #top_news ul li a span.icon._topics {
	background: #e26911;
}

#top_wrap #top_news ul li a span.icon._recruit {
	background: #b31d3d;
}

@media screen and (min-width: 768px){

	#top_wrap {
		margin: -90px 0;
		position: relative;
	}

	#top_wrap #top_news {
		max-width: 1100px;
		width: 100%;
		box-sizing: border-box;
		padding: 60px;
		margin: 0 auto;
		position: relative;
	}

	#top_wrap #top_news h2 {
		width: 25%;
		float: left;
		margin: 0;
	}

	#top_wrap #top_news h2 img {
		display: block;
		width: 62%;
	}

	#top_wrap #top_news ul {
		margin-left: 27%;
		list-style: none;
	}

	#top_wrap #top_news ul li a {
		font-size: 60%;
		transition: .3s;
	}

	#top_wrap #top_news ul li a:hover {
		text-decoration: none;
		opacity: 0.5;
	}

	#top_wrap #top_news .top_btn01 {
		margin-top: 30px;
		font-size: 65%;
		text-align: right;
	}

	#top_wrap #top_news .top_btn01 a {
		width: 12em;
	}

}

@media screen and (max-width: 768px){

	#top_wrap #top_news {
		overflow: hidden;
		margin: 1em;
	}
	
	#top_wrap #top_news .top_sec01 {
		margin: 1em;
	}

	#top_wrap #top_news h2 {
		margin-bottom: 0.5em;
	}

	#top_wrap #top_news h2 img {
		display: block;
		width: 30%;
	}

	#top_wrap #top_news ul {
		list-style: none;
		font-size: 60%;
		margin: 1em 0;
	}

	#top_wrap #top_news ul li a {
		flex-wrap: wrap;
	}

	#top_wrap #top_news ul li a span.date,
	#top_wrap #top_news ul li a span.icon {
		width: auto;
		margin-bottom: 0.5em;
	}

	#top_wrap #top_news ul li a strong {
		display: block;
		width: 100%;
	}

	#top_wrap #top_news .top_btn01 {
		font-size: 65%;
		margin-top: 1.5em;
	}

}


/*
mission
*******************************************************/

#top_mission ul li {
	position: relative;
}

#top_mission ul li:nth-child(1) dt strong {
	color: #004098;
}

#top_mission ul li:nth-child(1) dt span {
	background: #004098;
}

#top_mission ul li:nth-child(2) dt strong {
	color: #1da586;
}

#top_mission ul li:nth-child(2) dt span {
	background: #1da586;
}

#top_mission ul li dl {
	width: 100%;
	padding-top: 100%;
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 0 10px #eaedf4;
}

#top_mission ul li dl dt {
	position: absolute;
	top: 40%;
	text-align: center;
	transform: translateY( -50% ) scale( 1, 0.9 );
	letter-spacing: 0.5rem;
	width: 100%;
	font-size: 200%;
	height: 60%;
}

#top_mission ul li dl dt strong {
	font-weight: 400;
	line-height: 2.5;
}

#top_mission ul li dl dt span {
	display: block;
	width: 1px;
	height: 30%;
	margin: 0 auto;
}

#top_mission ul li dl dd {
	top: 50%;
	position: absolute;
	height: 50%;
	width: 100%;
}

#top_mission ul li dl dd span {
	display: block;
	margin-top: 2em;
}

@media screen and (min-width: 768px){

	#top_mission {
		margin: 100px 0;
		font-size: 70%;
	}

	#top_mission .top_sec02 {
		max-width: 1100px;
		margin: 0 auto;
	}

	#top_mission h2 img {
		display: block;
		width: 35%;
		margin: 0 auto;
	}

	#top_mission ul {
		margin: 80px auto;
		max-width: 900px;
		display: flex;
		justify-content: space-between;
	}

	#top_mission ul li {
		width: 47.5%;
	}

}

@media screen and (max-width: 768px){

	#top_mission {
		font-size: 60%;
		margin: 3em 0;
	}

	#top_mission .top_sec02 {
		margin: 1em;
	}

	#top_mission h2 img {
		width: 65%;
	}

	#top_mission ul li {
		width: 65%;
		margin: 1.5em auto;
	}

}

/*
business
*******************************************************/

#top_business {
	position: relative;
}

#top_business:before,
#top_business:after {
	background: #fff;
	position: absolute;
	content: "";
	display: block;
	position: absolute;
	height: 100%;
	top: 0;
}

#top_business:before {
	width: 50%;
	right: 0;
}

#top_business .top_sec03 {
	z-index: 1;
}

@media screen and (min-width: 768px){

	#top_business {
		margin: 100px 0;
		font-size: 60%;
		overflow: hidden;
	}

	#top_business:after {
		max-width: 1100px;
		width: 100%;
		left: 50%;
		transform: translateX( -50% );
		top: 0;
	}

	#top_business .top_sec03 {
		background: #fff url(/assets/top/top_img01.png) left no-repeat;
		background-size: contain;
		max-width: 950px;
		margin: 80px auto;
		display: flex;
		position: relative;
	}

	#top_business .top_sec03 h2 {
		width: 40%;
		text-align: left;
	}

	#top_business .top_sec03 h2 img {
		width: 67%;
		margin: 0;
	}

	#top_business .top_sec03 > div {
		width: 60%;
		text-align: left;
		line-height: 2.5;
	}

	#top_business .top_sec03 > div p.top_btn02 {
		text-align: right;
		margin-top: 50px;
	}

}

@media screen and (max-width: 768px){



	#top_business .top_sec03 {
		background: #fff url(/assets/top/top_img01.png) right no-repeat;
		background-size: 50%;
		margin: 1em 1.5em;
		position: relative;
		font-size: 60%;
		padding: 0.5em 1.75em;
		text-align: left;
	}

	#top_business:after {
		width: calc( 100% - 2em );
		left: 50%;
		transform: translateX( -50% );
		top: 0;
	}

	#top_business .top_sec03 h2 img {
		width: 58%;
		display: block;
	}

	#top_business .top_sec03 p.top_btn02 {
		text-align: center;
	}

}

/*
network
*******************************************************/

#top_network {
}

#top_network .top_sec04 .map {
	position: relative;
}

#top_network .top_sec04 .map picture {
	width: 60%;
	margin: 0 auto;
	display: block;
}

#top_network .top_sec04 .map picture img {
	width: 100%;
	display: block;
}

#top_network .top_sec04 .map ul,
#top_network .top_sec04 .map ul li {
	display: inline;
}

#top_network .top_sec04 .map ul li dl {
	background: #fff;
	position: absolute;
	width: 20%;
	text-align: left;
}

#top_network .top_sec04 .map ul li dl dt {
	padding: 0.5em;
	box-sizing: border-box;
}

#top_network .top_sec04 .map ul li dl dt strong {
	color: #004098;
	display: block;
}

#top_network .top_sec04 .map ul li dl dt span {
	display: block;
}

#top_network .top_sec04 .map ul li dl dt {
}

#top_network .top_sec04 .map ul li dl dd a {
	width: 100%;
	box-sizing: border-box;
}

#top_network .top_sec04 .map ul li:nth-child(1) dl {
	top: 27%;
	left: 4%;
}

#top_network .top_sec04 .map ul li:nth-child(2) dl {
	top: 27%;
	right: 4%;
}

#top_network .top_sec04 .map ul li:nth-child(3) dl {
	top: 48%;
	left: 4%;
}

#top_network .top_sec04 .map ul li:nth-child(4) dl {
	top: 49%;
	right: 4%;
}

#top_network .top_sec04 .map ul li:nth-child(5) dl {
	bottom: 8%;
	left: 40%;
}

@media screen and (min-width: 768px){

	#top_network {
		margin: 100px 0;
	}

	#top_network h2 img {
		display: block;
		width: 19%;
		margin: 0 auto;
	}

	#top_network .top_sec04 {
		max-width: 1100px;
		margin: 0 auto;
		position: relative;
	}

	#top_network .top_sec04 .map {
		padding: 0 0 100px;
		font-size: 60%;
	}

}

@media screen and (max-width: 768px){

	#top_network {
		font-size: 40%;
		margin: 3em 0;
	}

	#top_network h2 img {
		width: 30%;
		display: block;
		margin: 0 auto;
	}

	#top_network .top_sec04 .map picture {
		padding-bottom: 4em;
	}

	#top_network .top_sec04 .map ul li dl {
		width: 26%;
	}

	#top_network .top_sec04 .map ul li:nth-child(1) dl {
		top: 10%;
		left: 4%;
	}

	#top_network .top_sec04 .map ul li:nth-child(2) dl {
		top: 14%;
		right: 4%;
	}

	#top_network .top_sec04 .map ul li:nth-child(3) dl {
		top: 48%;
		left: 4%;
	}

	#top_network .top_sec04 .map ul li:nth-child(4) dl {
		top: 49%;
		right: 4%;
	}

	#top_network .top_sec04 .map ul li:nth-child(5) dl {
		bottom: 0%;
		left: 35%;
	}


}

/*
profile
*******************************************************/


#top_profile {
	position: relative;
}

#top_profile:before,
#top_profile:after {
	background: #fff;
	position: absolute;
	content: "";
	display: block;
	position: absolute;
	height: 100%;
	top: 0;
}

#top_profile:before {
	width: 50%;
	left: 0;
}

#top_profile .top_sec05 {
	position: relative;
	z-index: 1;
}

@media screen and (min-width: 768px){

	#top_profile {
		margin: 100px 0 0;
		font-size: 60%;
		overflow: hidden;
	}

	#top_profile:after {
		max-width: 1100px;
		width: 100%;
		left: 50%;
		transform: translateX( -50% );
		top: 0;
	}

	#top_profile .top_sec05 {
		display: flex;
		max-width: 950px;
		margin: 0 auto;
		text-align: left;
		flex-wrap: wrap;
		padding: 80px 0 50px;
	}

	#top_profile .top_sec05 h2 {
		width: 25%;
	}

	#top_profile .top_sec05 h2 img {
		display: block;
		width: 80%;
	}

	#top_profile .top_sec05 ul {
		width: 75%;
		border-top: 1px solid #ddd;
	}

	#top_profile .top_sec05 ul li {
		border-bottom: 1px solid #ddd;
		position: relative;
		padding: 20px 0;
	}

	#top_profile .top_sec05 ul li dl {
		display: flex;
	}

	#top_profile .top_sec05 ul li dl dt {
		width: 25%;
	}

	#top_profile .top_sec05 ul li dl dd {
		width: 75%;
	}

	#top_profile .top_sec05 .top_btn02 {
		margin-top: 50px;
		text-align: right;
		width: 100%;
	}

	#top_profile .top_sec05 .top_btn02 a {
		width: 12em;
	}

}

@media screen and (max-width: 768px){

	#top_profile {
		margin: 3em 0;
		font-size: 60%;
		overflow: hidden;
	}

	#top_profile:before {
		width: calc( 100% - 1.5em );
		left: 0;
	}

	#top_profile .top_sec05 {
		text-align: left;
		background: #fff;
		margin: 0 3em 0 1.5em;
	}

	#top_profile .top_sec05 h2 {
	}

	#top_profile .top_sec05 h2 img {
		display: block;
		width: 40%;
	}

	#top_profile .top_sec05 ul {
		border-top: 1px solid #ddd;
	}

	#top_profile .top_sec05 ul li {
		border-bottom: 1px solid #ddd;
		position: relative;
		padding: 0.75em 0.25em;
	}

	#top_profile .top_sec05 ul li dl dt {
		font-weight: bold;
		margin-bottom: 0.5em;
		color: #004098;
	}

	#top_profile .top_sec05 .top_btn02 {
		margin: 1.5em 0 2em;
		text-align: center;
	}

}

