@charset "utf-8";
/* =========================
*  基本（PC/SP共通）
========================= */
body {
  background: #ffffff;
  color: #3d4851;
  font-family: 'Noto Sans JP', sans-serif;
  width: 100%;
}
header {
	position: relative;
}
#wrap {
	overflow: hidden;
}
/*
h1,
.menu.open p {
	font-family: "franklin-gothic-urw", sans-serif;
}
*/
h2 {
	font-family: 'Montserrat', sans-serif;
}
section.about h2,
section.ir h2,
section.company h2 {
	color: #005ca2;
}
h1 a {
	color: #ffffff;
}
h3 {
	font-weight: 500;
}
img {
	max-width: 100%;
	height: auto;
}
a {
	color: #3d4851;
	text-decoration: none;
}
a:hover {
	opacity: 0.7;
}

li {
	list-style: none;
}
.bg_area {
	background: linear-gradient(90deg,  #008cd5 0%,#005ca2 100%);
	border-radius: 45px 0 0 0;
}
.bg_dots {
	background: url(../images/bg_dots_press-release.png) top center;
}
.more {
	position: relative;
	text-align: center;
	border-radius: 100vh;
	display: flex;
	align-items: center;
}
.more.wht {
	background: #ffffff;
}
.more.blu {
	background: #005ca2;
}
.more a {
	display: block;
	color: #005ca2;
	font-weight: 600;
	width: 100%;
}
.more.wht a {
	color: #005ca2;
}
.more.blu a {
	color: #ffffff;
}
.more a::after {
	display: block;
	content: "";
	position: absolute;
}
.more.wht a::after {
	background: no-repeat top center url(../images/arrow2_blu.png);
}
.more.blu a::after {
	background: no-repeat top center url(../images/arrow2_wht.png);
}
.kasou h1 a {
	color: #005ca2;
}

header .news ul li.news_lead span.news_txt a {
	display: -webkit-box;
	overflow: hidden;
	word-break: break-all;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

/* ==================== newyear(謹賀新年)&top_bnr(バナー) .start ==================== */
.newyear {
	max-width: 1080px;
	margin: 0 auto 30px;
}
.newyear img {
	/* filter: drop-shadow(5px 5px 10px #ccc); */
	box-shadow: 5px 5px 10px #ccc;
}
.top_bnr {
	max-width: 1080px;
	margin: 60px auto 30px;
	text-align: center;
}
.top_bnr a {
	display: inline-block;
}
.top_bnr img {
	width: 660px;
	margin: 0 auto;
	box-shadow: 5px 5px 10px #ccc;
}
/* ==================== newyear(謹賀新年)&top_bnr(バナー) .end ==================== */

@media screen and (min-width: 768px) {
	/* =========================
	*  TOP（PC）
	========================= */
	html {
		font-size: 62.5%;
		/* overflow-y: scroll; */
	}
	body {
		line-height: 1.5;
		min-width: 1280px;
		font-size: 17px;
		/* overflow-x: hidden; */
	}
	.sp {
		display: none !important;
	}
	header nav .toggle {
		display: none;
	}
	header nav {
		display: -webkit-flex;
		display: flex;
		justify-content: space-between;
		width: 100%;
		position: absolute;
		z-index: 999;
	}
	h1 {
		font-size: 27px;
    color: #fff;
    font-weight: bold;
    position: absolute;
    z-index: 1;
    height: 90px;
    line-height: 90px;
    left: 45px;
    letter-spacing: 0.05em;
	}
	header nav .menu {
		width: 50%;
	}
	header nav ul {
		/* width: 50%; */
		display: -webkit-flex;
		display: flex;
		align-items: center;
		background: #005ca2;
		color: #ffffff;
		border-radius: 0 0 0 30px;
		font-weight: bold;
		height: 90px;
	}
	header nav ul li {
		text-align: center;
		width: 20% !important;
		line-height: 87px;
		position: relative;
	}
	header nav ul li span {
		display: block;
	}
	header nav ul li span::before {
    position: absolute;
    bottom: -1px;
    height: 3px;
    content: '';
    border-radius: 3px;
    background: #ffffff;
	}
	header nav ul li:nth-of-type(1) span::before {
    left: calc(50% - 1.5em);
    width: 3em;
	}
	header nav ul li:nth-of-type(2) span::before {
    left: calc(50% - 3.5em);
    width: 7em;
	}
	header nav ul li:nth-of-type(3) span::before {
    left: calc(50% - 1.5em);
    width: 3em;
	}
	header nav ul li:nth-of-type(4) span::before {
    left: calc(50% - 2em);
    width: 4em;
	}
	header nav ul li a {
		color: #ffffff;
		display: block;
	}
	header nav ul li a:hover:before {
		position: absolute;
    bottom: -1px;
    height: 3px;
    content: '';
    border-radius: 3px;
    background: #ffffff;
	}
	header nav ul li:nth-of-type(1) a:hover:before {
    left: calc(50% - 1.5em);
    width: 3em;
	}
	header nav ul li:nth-of-type(2) a:hover:before {
    left: calc(50% - 3.5em);
    width: 7em;
	}
	header nav ul li:nth-of-type(3) a:hover:before {
    left: calc(50% - 1.5em);
    width: 3em;
	}
	header nav ul li:nth-of-type(4) a:hover:before,
	header nav ul li:nth-of-type(5) a:hover:before {
    left: calc(50% - 2em);
    width: 4em;
	}
	header .main_visual {
		position: relative;
		margin: 0 90px 0 0;
	}
	header .main_visual img {
		border-radius: 0 0 30px 0;
	}
	header .main_visual .catch {
		position: absolute;
		font-family: "ta-kobe", sans-serif;
		font-style: normal;
		/* font-size: 4.25vw; */
		font-size: 54px;
		color: #ffffff;
		/* top: 33%; */
		top: 240px;
		/* right: 7.5%; */
		right: 90px;
		/* padding-top: 12%; */
	}
	header .news {
		position: absolute;
		bottom: 0;
		background: #ffffff;
		padding: 30px;
		font-size: 16px;
		font-weight: 500;
		border-radius: 0 30px 0 0;
		/* border-bottom: 1px solid #8b9197; */
		width: 48em;
	}
	header .news ul {
		display: -webkit-flex;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	header .news ul li {
		padding: 0.25em 0;
	}
	header .news ul li.news_head {
		color: #005ca2;
		border-right: 2px solid #005ca2;
		font-weight: 600;
		min-width: 5em;
	}
	header .news ul li.news_lead {
		min-width: 32em;
		display: flex;
    align-items: center;
	}
	header .news ul li.news_lead span.news_date {
		color: #8b9197;
		padding: 0 0.5em 0 0;
		display: block;
		min-width: 5em;
	}
	header .news ul li.news_lead span.news_label {
    background: #005ca2;
    color: #ffffff;
    font-size: 10px;
    padding: 0.4em 0;
    min-width: 5em;
    text-align: center;
    border-radius: 0.5em;
    font-weight: 300;
		display: block;
	}
	header .news ul li.news_lead span.news_txt {
		padding: 0 0 0 0.5em;
		display: block;
		max-width: 23em;
	}
	header .news ul li.news_link {
		min-width: 6em;
		text-align: right;
	}
	header .news ul li.news_link a {
		color: #005ca2;
	}
	header .news ul li.news_link a.more_blu::after {
		content: '';
		display: inline-block;
		width: 32px;
		height: 32px;
		background-image: url(../images/arrow_blu.png);
		background-size: contain;
		background-repeat: no-repeat;
		vertical-align: middle;
		margin-left: 0.5em;
	}
	main {
		margin: 90px 0 0;
	}
	h2 {
		font-size: 52px;
		margin: 0 0 0.3em;
	}
	h3 {
		font-size: 24px;
		margin: 0 0 0.25em;
	}
	.more {
		width: 300px;
		margin: 60px auto 0;
		height: 60px;
		box-shadow: 0px 0px 14px -2px #3d4851;
	}
	.more a {
		padding: 17px 0;
		width: 100%;
	}
	.more.wht a {
		color: #005ca2;
	}
	.more.blu a {
		color: #ffffff;
	}
	.more a::after {
		top: 24px;
		right: 24px;
		width: 7px;
		height: 12px;
	}
	.more.wht a::after {
		background: no-repeat top center url(../images/arrow2_blu.png);
	}
	.more.blu a::after {
		background: no-repeat top center url(../images/arrow2_wht.png);
	}

	/* ==================== ABOUT US .start ==================== */
	section.about {
		position: relative;
		background-image: url(../images/bg_img_about-us.png);
		background-size: auto;
		background-repeat: no-repeat;
		background-position: left bottom;
		height: 960px;
		padding: 90px 0 0;
	}
	section.about::after {
		display: block;
		content: "";
		position: absolute;
		z-index: -999;
		top: 0;
		left: 0;
		background: no-repeat top center url(../images/bg_txt_about-us.png);
		width: 122px;
		height: 540px;
	}
	section.about .head {
		margin: 30px 60px 0;
	}
	section.about .head p {
		margin: 60px 0 0;
	}
	.aboutBox {
		display: -webkit-flex;
		display: flex;
		/* width: 1360px; */
		margin: 0 auto;
		justify-content: space-around;
	}
	.group {
		position: relative;
		width: 720px;
	}
	.group div:nth-of-type(1) {
		position: absolute;
		width: 720px;
		height: 620px;
		background: #ffffff;
		box-shadow: 0px 0px 12px -5px #005ca2;
		border-radius: 20px;
		padding: 90px 60px;
		z-index: 2;
	}
	.group ul {
		display: -webkit-flex;
		display: flex;
	}
	.group li {
		text-align: center;
	}
	/*
	.group li a {
		display: inline-block;
	}
	*/
	/*
	.group li img.bsn-wave {
		padding: 15px 0 0;
	}
	*/
	.group li img.b-itec,
	.group li img.netmsc {
		width: 240px;
		margin: 0 auto;
	}
	.group li img.itsquare {
		width: 210px;
		margin: 0 auto;
	}
	.group li img.nts {
		margin: 0 auto;
		max-height: 45px;
	}
	.group li img.gnc {
		margin: 0 auto;
	}
	.group li img.n-facility {
		margin: 10px auto 0;
		max-height: 40px;
	}
	.flexUpper {
		align-items: center;
		justify-content: center;
		flex-wrap: wrap;
	}
	.flexUpper li {
		width: 270px;
	}
	.flexUpper li:nth-of-type(3) {
		width: 100%;
	}
	.flexUpper li:nth-of-type(1) {
		margin: 0 60px 60px 0;
	}
	.flexUpper li:nth-of-type(2),
	.flexUpper li ul li {
		margin: 0 0 60px 0;
	}
	.flexUpper li ul {
		justify-content: center;
	}
	.flexLower {
		align-items: center;
		justify-content: center;
	}
	.flexLower li:nth-of-type(1) {
		width: 15%;
	}
	.flexLower li:nth-of-type(1) img {
		max-height: 45px;
		margin: 0 auto;
	}
	.flexLower li:nth-of-type(2) {
		width: 20%;
	}
	.flexLower li:nth-of-type(3) {
		width: 40%;
	}
	.flexLower li:nth-of-type(4) {
		width: 25%;
	}
	.group div:nth-of-type(2) {
		position: absolute;
		background: url(../images/bg_dots_about-us.png) top center, linear-gradient(90deg,  #008cd5 0%,#005ca2 100%);
		width: 720px;
		height: 620px;
		border-radius: 20px;
		z-index: 1;
		left: 90px;
		top: 90px;
	}

	/* ==================== ABOUT US .end ==================== */



	/* ==================== PRESS RELEASE .start ==================== */

	section.release {
		position: relative;
		/* background: linear-gradient(90deg,  #008cd5 0%,#005ca2 100%); */
		padding: 150px 0;
	}
	section.release::before {
		display: block;
		content: "";
		position: absolute;
		top: 0;
		right: 0;
		background: no-repeat top center url(../images/bg_txt_press-release.png);
		width: 876px;
		height: 94px;
		z-index: 999;
	}
	section.release .bg_dots {
		background: url(../images/bg_dots_press-release.png) top center;
		padding: 150px 0 90px;
	}
	section.release .head {
		text-align: center;
		color: #ffffff;
	}
	section.release .items {
		width: 1080px;
		margin: 60px auto;
		color: #ffffff;
	}
	section.release .item {
		border-bottom: 1px solid #ffffff;
		padding: 0 0 21px;
		margin: 0 0 21px;
	}
	section.release .item a {
		display: flex;
		align-items: center;
		color: #ffffff;
		margin: 0 1em;
	}
	section.release .item .dt-tl {
		width: 60em;
	}
	section.release .item .date {
		font-weight: 500;
	}
	section.release .item .title {
		padding: 0 0 0 1em;
	}

	/* ==================== PRESS RELEASE .end ==================== */



	/* ==================== INVESTOR RELATIONS .start ==================== */
	section.ir {
		position: relative;
		background: #ffffff;
		border-radius: 0 45px 0 0;
		padding: 150px 0;
	}
	section.ir::before {
		display: block;
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		background: no-repeat top center url(../images/bg_txt_investor-relations.png);
		width: 1192px;
		height: 115px;
		z-index: 999;
	}
	.irBox {
		display: -webkit-flex;
		display: flex;
		width: 1080px;
		margin: 0 auto;
	}
	section.ir .head {
		margin: 0 90px 0 0;
	}
	section.ir .list ul {

	}
	section.ir .row {
		border-bottom: 1px solid #c1c4c7;
		padding: 0 0 21px;
		margin: 0 0 21px;
	}
	section.ir .row a {
		display: flex;
		color: #3d4851;
		margin: 0 1em;
		align-items: center;
	}
	section.ir .dt-tl {
		width: 36em;
		display: flex;
	}
	section.ir .date {
		font-weight: 500;
	}
	section.ir .title {
		padding: 0 0 0 1em;
	}
	section.ir .arrow {
		padding: 0 0 0 1em;
	}

	/* ==================== INVESTOR RELATIONS .end ==================== */



	/* ==================== COMPANY .start ==================== */
	section.company {
		background: no-repeat top center url(../images/bg_img_company.png);
		background-size: cover;
		padding: 120px 0;
	}
	.companyBox {
		background: #ffffff;
		width: 755px;
		margin: 0 auto;
		border-radius: 30px;
		padding: 60px;
	}
	section.company .head {
		text-align: center;
	}
	section.company .detail {
		text-align: center;
		margin: 45px 0 0;
		line-height: 1.75em;
	}

	/* ==================== COMPANY .end ==================== */


	.ftBox {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 60px 0;
		width: 1080px;
		margin: 0 auto;
	}
	.ftBox .head {
		font-size: 22px;
		font-weight: 600;
	}
	.ftBox div {
		width: 50%;
	}
	.ftBox ul {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		font-size: 15px;
		font-weight: 600;
	}
	.ftBox li {
		position: relative;
		margin: 0 0 0.5em;
	}
	.ftBox ul:nth-of-type(2) li {
		margin: 0;
	}
	.ftBox li a {
		padding: 0 0 0 21px;
	}
	.ftBox li a::before {
		display: block;
		content: "";
		position: absolute;
		top: 6px;
		left: 0;
		width: 7px;
		height: 12px;
		background: no-repeat top center url(../images/arrow2_blu.png);
	}
	footer .copy {
		font-family: 'Montserrat', sans-serif;
		text-align: center;
		font-size: 15px;
		color: #c1c4c7;
		padding: 30px 0;
		border-top: 1px solid #c1c4c7;
	}

	/*==================== scroll .start ====================*/

	/*スクロールダウン全体の場所*/
	.scrolldown1 {
		position: absolute;
		right: 45px;
		bottom: 15%;
		height: 100px;
	}

	/*Scrollテキストの描写*/
	.scrolldown1 span {
		position: absolute;
		left: -0.75em;
		top: -4em;
		color: #3d4851;
		font-size: 12px;
		writing-mode: vertical-rl;
	}

	/* 線の描写 */
	.scrolldown1::after {
		content: "";
		position: absolute;
		top: 0;
		width: 1px;
		height: 80px;
		background: #3d4851;
		animation: pathmove 2.0s ease-in-out infinite;
		opacity:0;
	}

	/*高さ・位置・透過が変化して線が上から下に動く*/
	@keyframes pathmove{
		0% {
			height: 0;
			top: 0;
			opacity: 0;
		}
		20% {
			height: 80px;
			opacity: 1;
		}
		100% {
			height: 0;
			top: 100px;
			opacity: 0;
		}
	}
	/*==================== scroll .end ====================*/

	/* =========================
	*  下層共通（PC）
	========================= */
	.kasou .head {
		margin: 0 0 90px !important;
		text-align: center;
		color: #3d4851 !important;
	}
	.kasou .head h2 {
		color: #005ca2;
	}
	.kasou .breadCrumb {
		width: 1080px;
		margin: 0 auto;
		font-size: 12px;
		color: #c1c4c7;
	}
	.kasou .breadCrumb ul {
		display: flex;
	}
	.kasou .breadCrumb a {
		position: relative;
		margin: 0 20px 0 0;
		color: #c1c4c7;
	}
	.kasou .breadCrumb a:hover {
		text-decoration: underline;
	}
	.kasou .breadCrumb a::after {
		position: absolute;
		right: -12px;
		top: 6px;
		width: 6px;
		height: 6px;
		display: block;
		border-top: 1px solid #c1c4c7;
		border-right: 1px solid #c1c4c7;
		transform: rotate(45deg);
		content: "";
	}

	/* =========================
	*  IR情報（PC）
	========================= */
	.kasou main {
		padding: 90px 0 0;
	}
	.kasou .ir {
		position: relative;
		background: #ffffff;
		border-radius: 0 45px 0 0;
		padding: 60px 0;
	}
	.kasou .irBox {
		display: block;
		position: relative;
		z-index: 9999;
	}
	/*
	.kasou .list {
		margin: 90px 0;
	}
	*/
	.kasou section.ir .dt-tl {
		width: 58.5em;
	}
	.kasou section .archive {
		margin: 60px 0 0;
	}
	.kasou section .archive ul {
		display: flex;
    flex-wrap: wrap;
		border-top: 1px solid #005ca2;
		border-left: 1px solid #005ca2;
	}
	.kasou section .archive li {
		width: 20%;
		text-align: center;
		border-bottom: 1px solid #005ca2;
		border-right: 1px solid #005ca2;
	}
	.kasou section .archive li a,
	.kasou section .archive p a {
		display: block;
		padding: 15px 0;
	}
	.kasou section .archive p {
		border: 1px solid #005ca2;
    text-align: center;
    width: 20%;
    margin: 0 auto;
	}

	/* =========================
	*  プレスリリース（PC）
	========================= */
	.kasou .release {
		position: relative;
		background: #ffffff;
		border-radius: 0 45px 0 0;
		padding: 60px 0;
	}
	.kasou section.release::before {
		display: block;
		content: "";
		position: absolute;
		top: -15px;
		left: 0;
		background: no-repeat top center url(../images/bg_txt_kasou_press-release.png);
		width: 863px;
		height: 90px;
		z-index: 999;
	}
	.kasou .releaseBox {
		display: block;
		position: relative;
		z-index: 9999;
		width: 1080px;
		margin: 0 auto;
	}
	/*
	.kasou .list {
		margin: 90px 0;
	}
	*/
	.kasou section.release .row a {
		display: flex;
		color: #3d4851;
		margin: 0 1em;
		align-items: center;
	}
	.kasou section.release .row {
		border-bottom: 1px solid #c1c4c7;
		padding: 0 0 21px;
		margin: 0 0 21px;
	}
	.kasou section.release .dt-tl {
		width: 58.5em;
	}
	.kasou section.release .date {
		font-weight: 500;
	}
	.kasou section.release .title {
		padding: 0 0 0 1em;
	}
	.kasou section.release .arrow {
		padding: 0 0 0 1em;
	}

	/* =========================
	*  会社概要（PC）
	========================= */
	.kasou .company {
		position: relative;
		background: #ffffff;
		border-radius: 0 45px 0 0;
		padding: 60px 0;
	}
	.kasou section.company {
		background: no-repeat top center url(../images/bg_img_company.png);
		background-size: cover;
		padding: 120px 0;
		margin: 0 0 30px;
	}
	.kasou .company .head {
		margin: 0;
		text-align: center;
		color: #3d4851;
	}
	.kasou .company .head h2 {
		color: #005ca2;
	}
	.kasou .companyBox {
		display: block;
		position: relative;
		z-index: 9999;
		width: 1080px;
		margin: 0 auto;
	}
	.kasou .table {
		margin: 90px 0 30px;
	}
	.kasou section.company .row {
		display: flex;
		margin: 0 1em;
		/* align-items: center; */
		border-bottom: 1px solid #c1c4c7;
		padding: 0 0 21px;
		margin: 0 1em 21px;
	}
	.kasou section.company .row li:nth-of-type(1) {
		width: 25%;
		padding: 0 1em;
	}
	.kasou section.company .row li:nth-of-type(2) {
		width: 75%;
		padding: 0 1em 0 0;
	}
	.kasou section.company .row .g-map {
		margin: 1em 0 0;
	}
}


@media screen and (max-width: 767px) {
	/* =========================
	*  共通（SP）
	========================= */

	/* ==================== footer .start ==================== */
	.ftBox {
		padding: 45px;
		margin: 0 auto;
		border-radius: 45px 0 0 0;
	}
	.ftBox .head {
		font-size: 15px;
		font-weight: 600;
		margin: 0 0 20px 0;
	}
	.ftBox ul {
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		font-size: 14px;
		font-weight: 600;
	}
	.ftBox li {
		position: relative;
		margin: 0 0 0.5em;
	}
	.ftBox ul:nth-of-type(1) li {
		width: 10em;
	}
	.ftBox ul:nth-of-type(2) li {
		width: 12em;
	}
	.ftBox li a {
		padding: 0 0 0 21px;
		color: #3d4851;
	}
	.ftBox li a::before {
		display: block;
		content: "";
		position: absolute;
		top: 6px;
		left: 0;
		width: 7px;
		height: 12px;
		background: no-repeat top center url(../images/arrow2_blu.png);
	}
	footer .copy {
		font-family: 'Montserrat', sans-serif;
		text-align: center;
		font-size: 10px;
		color: #c1c4c7;
		padding: 12px 0;
		border-top: 1px solid #c1c4c7;
	}
	/* ==================== footer .end ==================== */


	/* =========================
	*  TOP（SP）
	========================= */
	html {

	}
	body {
		width: 100%;
		line-height: 1.5;
		font-size: 12px;
	}
	a {
		text-decoration: none;
	}
	h2 {
		font-size: 32px;
		margin: 0 0 8px;
	}
	h3 {
		font-size: 16px;
		margin: 0 0 4px;
	}
	.pc {
		display: none !important;
	}
	.head p {
		font-size: 13px;
	}
	nav{
		width: 100%;
		height: 70px;
		position: absolute;
    z-index: 9999;
	 }
	.drawer{
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		position: relative;
		height: 55px;
		padding: 0 1em;
	}
	h1 {
		font-size: 14px;
    color: #ffffff;
    position: absolute;
    z-index: 1;
    top: 0;
    left: 15px;
    height: 56px;
    line-height: 56px;
    letter-spacing: 0.05em;
	}
	.menu ul li {
		text-align: center;
		padding: 15px 0;
		font-weight: bold;
		color: #ffffff;
	}
	.menu ul li:last-child {
		border-bottom: none;
	}
	.menu ul li a {
		display:block;
		color: #ffffff;
		text-decoration: none;
	}
	.menu{
		text-align: center;
		background: #005ca2;
		transition: 0.5s ease;
		-webkit-transform: translateX(100%);
		position: fixed;
    width: 100%;
		height: 100%;
		top: 0;
    z-index: 99998;
	}
	.menu.open {
		-webkit-transform: translateX(0%);
		transform: translateX(0%);
	}
	.menu p {
		font-size: 14px;
		height: 56px;
    line-height: 56px;
    color: #fff;
    font-weight: 600;
    text-align: left;
    margin: 0 0 0 1em;
		letter-spacing: 0.05em;
	}
	.toggle {
		display: block;
    position: fixed;
    width: 56px;
    height: 56px;
    cursor: pointer;
    z-index: 99999;
    right: 0;
    background: #005ca2;
    border-radius: 0 0 0 10px;
	}
	.toggle span {
		display: block;
    position: absolute;
		left: 20px;
    width: 16px;
    border-bottom: solid 2px #ffffff;
    -webkit-transition: .35s ease-in-out;
    -moz-transition: .35s ease-in-out;
    transition: .35s ease-in-out;
	}
	.toggle span:nth-child(1) {
		top: 20px;
	}
	.toggle span:nth-child(2) {
		top: 28px;
	}
	.toggle span:nth-child(3) {
		top: 36px;
	}
	.toggle.active span:nth-child(1) {
		top: 28px;
		-webkit-transform: rotate(-45deg);
		-moz-transform: rotate(-45deg);
		transform: rotate(-45deg);
	}

	.toggle.active span:nth-child(2),
	.toggle.active span:nth-child(3) {
		top: 28px;
		-webkit-transform: rotate(45deg);
		-moz-transform: rotate(45deg);
		transform: rotate(45deg);
	}

	header .news {
		position: absolute;
    bottom: 0;
    background: #ffffff;
    padding: 12px;
    font-size: 12px;
    font-weight: 500;
    border-radius: 0 12px 0 0;
    width: 95%;
	}
	header .news ul {
		display: -webkit-flex;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	header .news ul li {
		padding: 0.5em 0;
	}
	header .news ul li.news_head {
		color: #005ca2;
    font-weight: 600;
    width: 15%;
		text-align: center;
	}
	header .news ul li.news_lead {
		width: 60%;
		padding-left: 12px;
    border-left: 2px solid #005ca2;
	}
	header .news ul li.news_lead span:first-child {
		color: #8b9197;
		font-size: 11px;
	}
	header .news ul li.news_lead span.news_label {
		background: #005ca2;
    color: #ffffff;
    font-size: 10px;
    padding: 0.25em 0.5em;
    text-align: center;
    border-radius: 0.25em;
    font-weight: 300;
    margin: 0 0 0.5em 0.75em;
    display: inline-block;
		vertical-align: middle;
	}
	header .news ul li.news_link {
		width: 20%;
		text-align: right;
	}
	header .news ul li.news_link a {
		color: #005ca2;
	}
	header .news ul li.news_link a.more_blu::after {
		content: '';
		display: inline-block;
		width: 24px;
		height: 24px;
		background-image: url(../images/arrow_blu.png);
		background-size: contain;
		background-repeat: no-repeat;
		vertical-align: middle;
		margin-left: 6px;
	}
	.more {
		width: 280px;
		margin: 40px auto 0;
		height: 56px;
		font-size: 16px;
		box-shadow: 0px 0px 5px -2px #3d4851;
	}
	.more a {
		padding: 16px 0;
		width: 100%;
	}
	.more.wht a {
		color: #005ca2;
	}
	.more.blu a {
		color: #ffffff;
	}
	.more a::after {
		top: 24px;
		right: 24px;
		width: 7px;
		height: 12px;
	}
	.more.wht a::after {
		background: no-repeat top center url(../images/arrow2_blu.png);
	}
	.more.blu a::after {
		background: no-repeat top center url(../images/arrow2_wht.png);
	}

	/*==================== scroll .start ====================*/

	/*スクロールダウン全体の場所*/
	.scrolldown1 {
		position: absolute;
		right: 11px;
		bottom: 10%;
		height: 50px;
	}

	/*Scrollテキストの描写*/
	.scrolldown1 span {
		position: absolute;
		left: -0.75em;
		top: -4em;
		color: #3d4851;
		font-size: 11px;
		writing-mode: vertical-rl;
	}

	/* 線の描写 */
	.scrolldown1::after {
		content: "";
		position: absolute;
		top: 0;
		width: 1px;
		height: 30px;
		background: #3d4851;
		animation: pathmove 2.0s ease-in-out infinite;
		opacity:0;
	}

	/*高さ・位置・透過が変化して線が上から下に動く*/
	@keyframes pathmove{
		0% {
			height: 0;
			top: 0;
			opacity: 0;
		}
		20% {
			height: 30px;
			opacity: 1;
		}
		100% {
			height: 0;
			top: 50px;
			opacity: 0;
		}
	}
	/*==================== scroll .end ====================*/

	/* ==================== newyear(謹賀新年)&top_bnr(バナー) .start ==================== */
	.newyear {
		width: 90%;
		margin: 30px auto;
	}
	.newyear img {
		/* filter: drop-shadow(3px 3px 6px #ccc); */
		box-shadow: 3px 3px 6px #ccc;
	}
	.top_bnr {
		width: 80%;
		margin: 30px auto;
	}
	.top_bnr a {
		display: inline;
	}
	.top_bnr img {
		/* filter: drop-shadow(3px 3px 6px #ccc); */
		box-shadow: 3px 3px 6px #ccc;
		width: 100%;
	}
	/* ==================== newyear(謹賀新年)&top_bnr(バナー) .end ==================== */

	/* ==================== ABOUT US .start ==================== */
	section.about {
		position: relative;
		background-image: url(../images/bg_img_about-us.png);
		background-size: contain;
		background-repeat: no-repeat;
		background-position: left bottom;
	}
	/*
	section.about::before {
    content: "";
    display: block;
    padding-top: 190%;
	}
	*/
	section.about::after {
		display: block;
		content: "";
		position: absolute;
		z-index: -999;
		top: 0;
		left: 0;
		background: no-repeat top left url(../images/bg_txt_about-us.png);
		width: 75px;
		height: 332px;
		background-size: 75px;
	}
	.aboutBox {
		margin: 60px 0 0;
    padding: 0 0 60vw;
	}
	section.about .head {
		margin: 0 0 0 30px;
	}
	.group {
		position: relative;
		margin: 60px 0 0;
	}
	.group div:nth-of-type(1) {
		position: relative;
    width: 85%;
    height: auto;
    background: #ffffff;
    box-shadow: 0px 0px 12px -5px #005ca2;
    border-radius: 6vw;
    padding: 8% 6%;
    z-index: 2;
    margin: 0 auto;
	}
	.group ul {
		display: -webkit-flex;
		display: flex;
	}
	.group li {
		text-align: center;
	}
	/*
	.group li a {
		display: inline-block;
	}
	*/
	/*
	.group li img.bsn-wave {
		padding: 10px 0 0;
	}
	*/
	.group li img.b-itec,
	.group li img.netmsc {
		width: 95%;
		margin: 0 auto;
	}
	.group li img.itsquare {
		width: 90%;
		margin: 0 auto;
	}
	/*
	.group li img.nts {
		max-height: 6vw;
    margin: 0 auto;
	}
	*/
	.group li img.gnc {
		width: 90%;
		margin: 0 auto;
	}
	.group li img.n-facility {
    width: 90%;
		margin: 1em auto 0;
	}
	.flexUpper {
		align-items: center;
		justify-content: center;
		flex-wrap: wrap;
	}
	.flexUpper li {
		width: 45%;
	}
	.flexUpper li:nth-of-type(3) {
		width: 100%;
	}
	.flexUpper li:nth-of-type(1) {
		margin: 0 10% 10% 0;
	}
	.flexUpper li:nth-of-type(2),
	.flexUpper li ul li {
		margin: 0 0 10% 0;
	}
	.flexUpper li ul {
		justify-content: center;
	}
	.flexLower {
		align-items: center;
    justify-content: space-between;
    width: 70%;
    flex-wrap: wrap;
    margin: 0 auto;
	}
	/*
	.flexLower li {
		margin: 0 2% 0 0;
	}
	*/
	.flexLower li:nth-of-type(1) {
		width: 32%;
		margin: 0 0 8%;
	}
	.flexLower li:nth-of-type(1) img {
		max-height: 8vw;
		margin: 0 auto;
	}
	.flexLower li:nth-of-type(2) {
		width: 60%;
		margin: 0 0 8% 8%;
	}
	.flexLower li:nth-of-type(3) {
		width: 40%;
	}
	.flexLower li:nth-of-type(4) {
		width: 60%;
	}
	.flexLower li:nth-of-type(4) img {
		max-height: 8vw;
		margin: 0 auto;
	}
	.group div:nth-of-type(2) {
		position: absolute;
    background: url(../images/bg_dots_about-us.png) top right, linear-gradient(90deg, #008cd5 0%,#005ca2 100%);
    background-size: cover;
    width: 85%;
    height: auto;
    /* padding-top: 90%; */
    border-radius: 6vw;
    z-index: 1;
    right: 0%;
    top: 10%;
    aspect-ratio: 1/1.05;
	}

	/* ==================== ABOUT US .end ==================== */



	/* ==================== PRESS RELEASE .start ==================== */

	section.release {
		position: relative;
		/* background: linear-gradient(90deg,  #008cd5 0%,#005ca2 100%); */
		padding: 90px 0 60px;
	}
	section.release::before {
		display: block;
		content: "";
		position: absolute;
		top: 0;
		right: 0;
		background: no-repeat top right url(../images/bg_txt_press-release_sp.png);
		background-size: 275px;
		width: 275px;
		height: 94px;
		z-index: 999;
	}
	section.release .head {
		text-align: center;
		color: #ffffff;
	}
	section.release .items {
		margin: 60px 20px;
		color: #ffffff;
	}
	section.release .item {
		border-bottom: 1px solid #ffffff;
		padding: 0 0 1em;
		margin: 0 0 1em;
		font-size: 13px;
	}
	section.release .item a {
		color: #ffffff;
		margin: 0 1em;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	section.release .dt-tl {
		width: 92%;
	}
	section.release .item .date {
		font-weight: 500;
	}
	section.release .item .title {
		display: block;
		margin: 0.25em 0.5em 0 0;
	}
	section.release .item .arrow {
		width: 8%;
	}
	section.release .item .arrow img {
		width: 24px;
		height: auto;
		margin: 0 0 0 auto;
	}
	/* ==================== PRESS RELEASE .end ==================== */



	/* ==================== INVESTOR RELATIONS .start ==================== */
	section.ir {
		position: relative;
		background: #ffffff;
		border-radius: 0 45px 0 0;
		padding: 90px 0;
	}
	section.ir::before {
		display: block;
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		background: no-repeat top center url(../images/bg_txt_investor-relations_sp.png);
		background-size: 360px;
		width: 360px;
		height: 100px;
		z-index: 999;
	}
	.irBox {

	}
	section.ir .head {
		text-align: center;
	}
	section.ir .list {
		margin: 60px 20px;
		font-size: 13px;
	}
	section.ir .row {
		border-bottom: 1px solid #c1c4c7;
		padding: 0 0 1em;
		margin: 0 0 1em;
	}
	section.ir .row a {
		display: flex;
		align-items: center;
		justify-content: space-between;
		color: #3d4851;
		margin: 0 1em;
	}
	section.ir .dt-tl {
		width: 92%;
	}
	section.ir .date {
		font-weight: 500;
	}
	section.ir .title {
		display: block;
		/* width: 21em; */
		margin: 0.25em 0.5em 0 0;
	}
	section.ir .arrow {
		width: 8%;
	}
	section.ir .arrow img {
		width: 24px;
		height: auto;
		margin: 0 0 0 auto;
	}

	/* ==================== INVESTOR RELATIONS .end ==================== */



	/* ==================== COMPANY .start ==================== */
	section.company {
		background: no-repeat top center url(../images/bg_img_company_sp.png);
		background-size: cover;
		padding: 60px 20px;
	}
	.companyBox {
		background: #ffffff;
		border-radius: 20px;
		padding: 40px 20px;
	}
	section.company .head {
		text-align: center;
	}
	section.company .detail {
		text-align: left;
		margin: 60px auto 0;
		font-size: 13px;
		width: 18em;
		line-height: 1.75em;
	}

	/* ==================== COMPANY .end ==================== */



	/* ===========================================================================
	*  下層（SP）
	=========================================================================== */
	.kasou main {
		padding-top: 90px;
	}
	.kasou section {
		position: relative;
		background: #ffffff;
		padding: 8vw 0 0;
		margin: 0 15px;
	}

	/* ==================== breadCrumb .start ==================== */
	.kasou .breadCrumb {
		width: 100%;
		margin: 45px 4vw 0;
		font-size: 10px;
		color: #c1c4c7;
	}
	.kasou .breadCrumb ul {
		display: flex;
	}
	.kasou .breadCrumb a {
		position: relative;
		margin: 0 18px 0 0;
		color: #c1c4c7;
	}
	.kasou .breadCrumb a:hover {
		text-decoration: underline;
	}
	.kasou .breadCrumb a::after {
		position: absolute;
		right: -10px;
		top: 8px;
		width: 4px;
		height: 4px;
		display: block;
		border-top: 1px solid #c1c4c7;
		border-right: 1px solid #c1c4c7;
		transform: rotate(45deg);
		content: "";
	}
	/* ==================== breadCrumb .end ==================== */


	/* ===========================================================================
	*  プレスリリース（SP）
	=========================================================================== */
	.kasou .release::before {
		display: block;
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		background: no-repeat top left url(../images/bg_txt_kasou_press-release.png);
		background-size: contain;
		width: 95%;
		z-index: 999;
	}
	.kasou .release .head {
		margin: 0 0 60px;
		text-align: center;
		color: #3d4851;
		position: relative;
		z-index: 1000;
	}
	.kasou .release .head h2 {
		color: #005ca2;
	}
	.kasou .releaseBox {
		display: block;
		position: relative;
		width: 100%;
		margin: 0 auto;
		font-size: 13px;
	}
	.kasou .release .list {
		margin: 0;
	}
	.kasou .release .row a {
		display: flex;
		color: #3d4851;
		margin: 0 1em;
		align-items: center;
	}
	.kasou .release .row {
		border-bottom: 1px solid #c1c4c7;
		padding: 0 0 1em;
		margin: 0 0 1em;
	}
	.kasou .release .dt-tl {
		width: 92%;
	}
	.kasou .release .date {
		font-weight: 500;
	}
	.kasou .release .title {
		display: block;
		padding: 0 0.5em 0 0;
	}
	.kasou .release .arrow {
		width: 8%;
	}
	.kasou .release .arrow img {
		width: 24px;
		height: auto;
		margin: 0 0 0 auto;
	}

	/* =========================
	*  IR情報（SP）
	========================= */
	.kasou .ir::before {
		display: block;
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		background: no-repeat top left url(../images/bg_txt_investor-relations_sp.png);
		background-size: contain;
		width: 95%;
		z-index: 999;
	}
	.kasou .ir .head {
		margin: 0 0 60px;
		text-align: center;
		color: #3d4851;
		position: relative;
		z-index: 1000;
	}
	.kasou .ir .head p {
		font-size: 12px;
	}
	.kasou .ir .list {
		margin: 0;
	}
	.kasou .ir .row a {
		display: flex;
		color: #3d4851;
		margin: 0 1em;
		align-items: center;
	}
	.kasou .ir .row {
		border-bottom: 1px solid #c1c4c7;
		padding: 0 0 1em;
		margin: 0 0 1em;
	}
	.kasou .ir .dt-tl {
		width: 92%;
	}
	.kasou .ir .date {
		font-weight: 500;
	}
	.kasou .ir .title {
		display: block;
		padding: 0 0.5em 0 0;
	}
	.kasou .ir .arrow {
		width: 8%;
	}
	.kasou .ir .arrow img {
		width: 24px;
		height: auto;
		margin: 0 0 0 auto;
	}
	.kasou section .archive {
		margin: 45px 0 0;
		font-size: 3vw
	}
	.kasou section .archive ul {
		display: flex;
    flex-wrap: wrap;
		border-top: 1px solid #005ca2;
		border-left: 1px solid #005ca2;
	}
	.kasou section .archive li {
		width: 25%;
		text-align: center;
		border-bottom: 1px solid #005ca2;
		border-right: 1px solid #005ca2;
	}
	.kasou section .archive li a,
	.kasou section .archive p a {
		display: block;
		color: #3d4851;
		padding: 1em 0;
	}
	.kasou section .archive p {
		border: 1px solid #005ca2;
    text-align: center;
    width: 25%;
    margin: 0 auto;
	}

	/* =========================
	*  会社概要（SP）
	========================= */
	.kasou section.company {
		background: no-repeat top center url(../images/bg_img_company.png);
    background-size: cover;
    padding: 45px 0;
    margin: 0;
	}
	.kasou .company .head {
		margin: 0;
		text-align: center;
		color: #3d4851;
	}
	.kasou .company .head h2 {
		color: #005ca2;
	}
	.kasou .companyBox {
		background: #ffffff;
    border-radius: 15px;
    padding: 30px 15px;
		margin: 0 15px;
	}
	.kasou .table {
		margin: 45px 0 15px;
	}
	.kasou section.company .row {
		display: flex;
		margin: 0 0.5em;
		border-bottom: 1px solid #c1c4c7;
		padding: 0 0 1em;
		margin: 0 0 1em;
	}
	.kasou section.company .row li:nth-of-type(1) {
		width: 25%;
		padding: 0 0.5em;
	}
	.kasou section.company .row li:nth-of-type(2) {
		width: 75%;
		padding: 0 0.5em 0 0;
	}
	.kasou section.company .row .g-map {
		margin: 1em 0 0;
		width: 100%;
    padding-bottom: 56.25%;
		height: 0;
		overflow: hidden;
		position: relative;
	}
	.g-map iframe, .yt_box iframe {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
	}

}

@media screen and (min-width: 1279px) {
	/***** TOP *****/
	header .main_visual .catch {
		position: absolute;
		font-family: "ta-kobe", sans-serif;
		/* font-weight: bold; */
		font-style: normal;
		font-size: 4.25vw;
		color: #ffffff;
		top: 33%;
		right: 7.5%;
		/* padding-top: 12%; */
	}
	/***** RECRUIT *****/
	.recruitBox .head img {
		width: 20vw !important;
	}
	.recruitBox .head img {
		width: 18vw !important;
	}
}

/* ==========
 * RECRUIT *
========== */
@media screen and (min-width: 768px) {
	.kasou header nav {
		background: #ffffff;
	}
	.recruitBox section {
		width: 1080px;
		margin: 0 auto;
	}
	.recruitBox .head {
		background: url(../images/bg_recruit_head.png) top center;
		background-size: cover;
		background-repeat: no-repeat;
		position: relative;
		aspect-ratio: 6794/4087;
		/* height: 720px; */
	}
	.recruitBox .head .head_center {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translateY(-50%) translateX(-50%);
		/* -webkit- transform: translateY(-50%) translateX(-50%); */
		margin: auto;
		background: rgba(255,255,255,0.75);
		padding: 30px 60px;
	}
	.recruitBox .head h2 {
		filter: drop-shadow(3px 3px 4px #999999);
	}
	.recruitBox .head li {
		position: absolute;
	}
	.recruitBox .head li:nth-of-type(1) {
		top: 10%;
		left: 7.5%;
	}
	.recruitBox .head li:nth-of-type(2) {
		top: 12.5%;
		right: 52%;
	}
	.recruitBox .head li:nth-of-type(3) {
		top: 7.5%;
		left: 52%;
	}
	.recruitBox .head li:nth-of-type(4) {
		top: 10%;
		right: 7.5%;
	}
	.recruitBox .head li:nth-of-type(5) {
		top: 31%;
		right: 10%;
	}
	.recruitBox .head li:nth-of-type(6) {
		bottom: 31%;
		right: 5%;
	}
	.recruitBox .head li:nth-of-type(7) {
		bottom: 10%;
		right: 7.5%;
	}
	.recruitBox .head li:nth-of-type(8) {
		bottom: 12.5%;
		left: 52%;
	}
	.recruitBox .head li:nth-of-type(9) {
		bottom: 7.5%;
		right: 52%;
	}
	.recruitBox .head li:nth-of-type(10) {
		bottom: 10%;
		left: 7.5%;
	}
	.recruitBox .head li:nth-of-type(11) {
		bottom: 31%;
		left: 10%;
	}
	.recruitBox .head li:nth-of-type(12) {
		top: 31%;
		left: 5%;
	}
	.recruitBox .head li img {
		box-shadow: 2px 2px 5px;
	}
	.recruitBox .head li:nth-of-type(-n+4) img {
		width: 240px;
	}
	.recruitBox .head li:nth-last-of-type(-n+8) img {
		width: 210px;
	}
	.search {
		position: relative;
	}
	.search_title {
		text-align: center;
		color: #009BDA;
		font-size: 48px;
		font-weight: 600;
		line-height: 1.25em;
	}
	.search_title span:nth-of-type(1) {
		border-bottom: 2px solid;
	}
	.search_title span:nth-of-type(2) {
		color: #3d4851;
		font-size: 24px;
	}
	.search_box {
		background: url(../images/bg_recruit_search.png) top center;
		background-size: cover;
		background-repeat: no-repeat;
		/* position: relative; */
		aspect-ratio: 1600/1200;
		/* padding: 60px 0; */
		margin: 60px 0 0;
		min-height: 1200px;
	}
	.comp_items {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-around;
		/* width: 1080px; */
		width: 1200px;
		/* margin: 0 auto; */
		position: absolute;
		top: 55%;
		left: 50%;
		transform: translateY(-50%) translateX(-50%);
		margin: auto;
	}
	.comp {
		/* width: 480px; */
		width: 360px;
		background: #ffffff;
		padding: 30px;
		border-radius: 30px;
		box-shadow: 5px 5px 5px;
		position: relative;
	}
	.comp:nth-of-type(n+4) {
		margin: 45px 0 0;
	}
	.comp .logo {
		width: 270px;
		margin: 0 auto;
		text-align: center;
		display: flex;
		align-items: center;
		justify-content: center;
		height: 72px;
	}
	.comp .logo img {
		display: inline;
		max-height: 72px;
	}
	.comp .cat {
		margin: 15px 0 0;
		display: flex;
		flex-wrap: wrap;
	}
	.comp .cat li {
		border-radius: 100vh;
		padding: 0.5em 1.25em;
		margin: 0 1em 0.5em 0;
		font-size: 14px;
	}
	.comp .cat li:nth-of-type(odd) {
		background: #005ca2;
		border: 2px solid #005ca2;
		color: #ffffff;
	}
	.comp .cat li:nth-of-type(even) {
		background: #ffffff;
		border: 2px solid #005ca2;
		color: #005ca2;
	}
	.comp .link {
		text-align: right;
		font-weight: 500;
		height: 36px;
		font-size: 20px;
	}
	.comp .link a {
		position: absolute;
		bottom: 30px;
		right: 30px;
	}
	.comp .link a span {
		position: relative;
		display: inline-block;
		padding: 0 2em 0 1em;
		color: #333;
		text-decoration: none;
		outline: none;
	}
	.comp .link a span::before {
		content: '';
		position: absolute;
		bottom: -8px;
		left: 0;
		width: 97%;
		height: 2px;
		background: #009BDA;
		transition: all .3s;
	}
	.comp .link a span::after{
		content: '';
		position: absolute;
		bottom: 0px;
		right: 0;
		width: 24px;
		height: 2px;
		background: #009BDA;
		transform: rotate(45deg);
		transition: all .3s;
	}

	/*hoverした際の移動*/
	.comp .link a span:hover::before{
		left: 10%;
	}
	.comp .link a span:hover::after{
		right: -10%;
	}

	/*アニメーション要素のスタイル*/
	.animation{
		opacity : 0;
		visibility: hidden;
		transition: 1.5s;
		transform: translateY(60px);
	}
	/*アニメーション要素までスクロールした時のスタイル*/
	.anime-active{
		opacity: 1;
		visibility: visible;
		transform: translateY(0);
	}

	/* 画像読み込み遅延 */
	.gallery {

	}
	.gallery .gallery-item {
		opacity: 0;
		/* bottom: -15px; */
		transition: 1s;
	}

	/* スクロールした時に追加されるclass */
	.gallery .gallery-item.fadein {
		opacity: 1;
		bottom: 0;
	}
}

@media screen and (max-width: 767px) {
	section.recruit {
		padding: 0 !important;
		margin: 0 !important;
	}
	.recruitBox .head {
		background: url(../images/bg_recruit_head.png) top center;
		background-size: cover;
		background-repeat: no-repeat;
		position: relative;
		/*aspect-ratio: 6794/4087;*/
		height: 120vw;
	}
	.recruitBox .head .head_center {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translateY(-50%) translateX(-50%);
		/* -webkit- transform: translateY(-50%) translateX(-50%); */
		margin: auto;
		background: rgba(255,255,255,0.75);
		padding: 1.5em 3em;
		text-align: center;
		z-index: 999;
	}
	.recruitBox .head h2 {
		filter: drop-shadow(2px 2px 1px #999999);
    font-size: 10vw;
    color: #005ca2;
		margin: 0 0 0.25em;
	}
	.recruitBox .head h3 {
		font-size: 5vw;
	}
	.recruitBox .head li {
		position: absolute;
	}
	.recruitBox .head li:nth-of-type(1) {
    top: 5%;
    left: -2.5%;
    z-index: 1000;
	}
	.recruitBox .head li:nth-of-type(2) {
		top: 15%;
    left: 20%;
		z-index: 900;
	}
	.recruitBox .head li:nth-of-type(3) {
    top: 5%;
    right: 20%;
    z-index: 800;
	}
	.recruitBox .head li:nth-of-type(4) {
    top: 15%;
    right: -2.5%;
		z-index: 700;
	}
	.recruitBox .head li:nth-of-type(5) {
		top: 33%;
    right: 2.5%;
	}
	.recruitBox .head li:nth-of-type(6) {
		bottom: 33%;
		right: 2.5%;
	}
	.recruitBox .head li:nth-of-type(7) {
		bottom: 15%;
		right: -2.5%;
		z-index: 125;
	}
	.recruitBox .head li:nth-of-type(8) {
		bottom: 5%;
    right: 20%;
		z-index: 150;
	}
	.recruitBox .head li:nth-of-type(9) {
		bottom: 15%;
    left: 20%;
		z-index: 175;
	}
	.recruitBox .head li:nth-of-type(10) {
		bottom: 5%;
    left: -2.5%;
		z-index: 200;
	}
	.recruitBox .head li:nth-of-type(11) {
		bottom: 33%;
		left: 2.5%;
	}
	.recruitBox .head li:nth-of-type(12) {
		top: 33%;
		left: 2.5%;
	}
	.recruitBox .head li img {
		box-shadow: 2px 2px 5px;
	}
	.recruitBox .head li img {
		width: 32vw;
	}
	.recruitBox .head li:nth-of-type(5) img,
	.recruitBox .head li:nth-of-type(6) img,
	.recruitBox .head li:nth-of-type(11) img,
	.recruitBox .head li:nth-of-type(12) img {
		width: 30vw;
	}
	/*
	.recruitBox .head li:nth-of-type(-n+4) img {
		width: 32vw;
	}
	.recruitBox .head li:nth-last-of-type(-n+8) img {
		width: 27vw;
	}
	*/
	.recruitBox .contents {
		margin: 12vw 0 0;
	}
	.search {
		position: relative;
	}
	.search_title {
		text-align: center;
		color: #009BDA;
		font-size: 8vw;
		font-weight: 600;
		line-height: 1.25em;
	}
	.search_title span:nth-of-type(1) {
		border-bottom: 2px solid;
	}
	.search_title span:nth-of-type(2) {
		color: #3d4851;
		font-size: 4vw;
	}
	.search_box {
		background: url(../images/bg_recruit_search.png) top center;
    background-size: contain;
    background-repeat: repeat;
    margin: 6vw 0 0;
    padding: 6vw 0;
	}
	.comp_items {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-around;
	}
	.comp {
    width: 90%;
    background: #ffffff;
    padding: 4vw;
    border-radius: 4vw;
    box-shadow: 1vw 1vw 1vw;
    position: relative;
	}
	.comp:nth-of-type(n+2) {
		margin: 4vw 0 0;
	}
	.comp .logo {
		width: 64vw;
		margin: 0 auto;
		text-align: center;
		display: flex;
		align-items: center;
		justify-content: center;
		height: 18vw;
	}
	.comp .logo img {
		display: inline;
		max-height: 18vw;
	}
	.comp .cat {
		margin: 2vw 0 0;
		display: flex;
		flex-wrap: wrap;
	}
	.comp .cat li {
		border-radius: 100vh;
		padding: 0.5em 1.25em;
		margin: 0 1em 0.5em 0;
		font-size: 3vw;
	}
	.comp .cat li:nth-of-type(odd) {
		background: #005ca2;
		border: 0.25em solid #005ca2;
		color: #ffffff;
	}
	.comp .cat li:nth-of-type(even) {
		background: #ffffff;
		border: 0.25em solid #005ca2;
		color: #005ca2;
	}
	.comp .link {
		text-align: right;
		font-weight: 500;
		height: 6vw;
		font-size: 4vw;
	}
	.comp .link a {
		position: absolute;
		bottom: 4vw;
		right: 4vw;
	}
	.comp .link a span {
		position: relative;
		display: inline-block;
		padding: 0 2em 0 1em;
		color: #333;
		text-decoration: none;
		outline: none;
	}
	.comp .link a span::before {
		content: '';
		position: absolute;
		bottom: -2vw;
		left: 0;
		width: 97%;
		height: 2px;
		background: #009BDA;
		transition: all .3s;
	}
	.comp .link a span::after{
		content: '';
		position: absolute;
		bottom: 0px;
		right: 0;
		width: 6vw;
		height: 2px;
		background: #009BDA;
		transform: rotate(45deg);
		transition: all .3s;
	}

	/*hoverした際の移動*/
	.comp .link a span:hover::before{
		left: 10%;
	}
	.comp .link a span:hover::after{
		right: -10%;
	}

	/*アニメーション要素のスタイル*/
	.animation{
		opacity : 0;
		visibility: hidden;
		transition: 1.5s;
		transform: translateY(60px);
	}
	/*アニメーション要素までスクロールした時のスタイル*/
	.anime-active{
		opacity: 1;
		visibility: visible;
		transform: translateY(0);
	}

	/* 画像読み込み遅延 */
	.gallery {

	}
	.gallery .gallery-item {
		opacity: 0;
		/* bottom: -15px; */
		transition: 1s;
	}

	/* スクロールした時に追加されるclass */
	.gallery .gallery-item.fadein {
		opacity: 1;
		bottom: 0;
	}
}