@charset "utf-8";

@media screen and (min-width:768px){
/*pc・タブレットcss*/

.recruit-ttl01{
	text-align:center;
	margin-bottom:3vw;
}
.recruit-ttl01 .en{
	display:block;
	font-size:0.8vw;
	line-height:1;
	color:#000;
	font-family: "Oswald", serif;
	font-weight:500;
	margin-bottom:0.5vw;
}
.recruit-ttl01 .jp{
	position:relative;
	display:block;
	font-size:1.5vw;
	line-height:1;
	color:#000;
	font-weight:700;
}

/* ++++++++++ */

.recruit-ttl01.c01{
}
.recruit-ttl01.c01 .en{
	color:#88DD00;
}
.recruit-ttl01.c01 .jp{
	color:#fff;
}

/* ++++++++++ */

.recruit-ttl01.c02{
}
.recruit-ttl01.c02 .en{
	color:#00398D;
}
.recruit-ttl01.c02 .jp{
	color:#000;
}

/* +++++++++++++++++++++++++ */

#recruit-mv{
	position:relative;
	padding-top:8vw;
	padding-bottom:8vw;
	background-color:#00398D;
	color:#fff;
}
#recruit-mv:before{
	content:"";
	position:absolute;
	top:0;
	right:0;
	width:55%;
	height:100%;
	background: url(../img/recruit/rec_mv.jpg) no-repeat top left / cover;
}
#recruit-mv:after{
	content:"";
	position:absolute;
	top:3vw;
	left:0;
	width:43%;
	padding-top:13%;
	background: url(../img/recruit/rec_deco.svg) no-repeat left / 100% auto;
}
#recruit-mv .mv-ttl-box{
	position:relative;
	z-index:2;
	padding-left:5vw;
	padding-top:7vw;
	margin-bottom:5vw;
}
#recruit-mv .mv-ttl{
	margin-bottom:3vw;
	font-size:1.5vw;
	font-weight:700;
}
#recruit-mv .mv-copy{
	font-size:5vw;
	line-height:1.3;
	font-weight:700;
}
#recruit-mv .mv-txt-box{
	margin-left:19vw;
	width:18vw;
	font-size:0.9vw;
}
#recruit-mv .mv-txt-box p{
	margin-bottom:2vw;
}



/* +++++++++++++++++++++++++ */

#point{
	padding-top:8vw;
	padding-bottom:8vw;
	background-color:#00398D;
	color:#fff;
}
#point .point-box{
	position:relative;
	width:52vw;
	margin:0 auto;
}
#point .point-box ol{
	-js-display: flex; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex;
	-webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; justify-content: space-between;
	-ms-flex-wrap:wrap; -webkit-flex-wrap:wrap; flex-wrap:wrap;
}
#point .point-box li{
	width:47.5%;
}
#point .point-box .no{
	position:relative;
	text-align:center;
	margin-bottom:1vw;
}
#point .point-box .no:before{
	content:"";
	position:absolute;
	top:50%;
	left:0;
	width:100%;
	height:1px;
	margin-top:-4px;
	background-color:#88DD00;
}
#point .point-box .no:after{
	content:"";
	position:absolute;
	top:50%;
	left:0;
	width:100%;
	height:1px;
	background-color:#88DD00;
}
#point .point-box .no span{
	position:relative;
	z-index:2;
	background-color:#00398D;
	padding:0 0.4em;
	color:#88DD00;
	font-size:2vw;
	line-height:1;
	font-family: "Oswald", serif;
	font-weight:500;
}
#point .point-box .ttl{
	margin-bottom:1.5vw;
	font-size:2vw;
	font-weight:700;
	text-align:center;
}

/* +++++++++++++++++++++++++ */

#guideline{
	position:relative;
	padding-top:8vw;
	padding-bottom:13vw;
	background-color:#00398D;
}
#guideline:before{
	content:"";
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:70%;
	background-color:#003080;
}
#guideline .guideline-box{
	position:relative;
	width:56vw;
	margin:0 auto;
	background-color:#fff;
}
#guideline .guideline-box .guideline-inner{
	position:relative;
	width:100%;
	height:100%;
	padding:8.5vw 8vw;
}
#guideline .guideline-box:before,
#guideline .guideline-box:after,
#guideline .guideline-box .guideline-inner:before,
#guideline .guideline-box .guideline-inner:after{
	content:"";
	position:absolute;
	width:1.8vw;
	height:1.8vw;
}
#guideline .guideline-box:before{ top:-0.2vw; left:-0.2vw; background:url(../img/top/work_deco_kakko01.svg) no-repeat top left / 100% 100%;}
#guideline .guideline-box:after{ top:-0.2vw; right:-0.2vw; background:url(../img/top/work_deco_kakko02.svg) no-repeat top left / 100% 100%;}
#guideline .guideline-box .guideline-inner:before{ bottom:-0.2vw; left:-0.2vw; background:url(../img/top/work_deco_kakko03.svg) no-repeat top left / 100% 100%;}
#guideline .guideline-box .guideline-inner:after{ bottom:-0.2vw; right:-0.2vw; background:url(../img/top/work_deco_kakko04.svg) no-repeat top left / 100% 100%;}

#guideline .guideline-box{
	position:relative;
	z-index:2;
}
#guideline .recruit-ttl01{
	position:relative;
	z-index:2;
}

/* +++++++++++++++++++++++++ */

#company {
	margin-bottom:8vw;
}
#company .company-mv{
	position:relative;
	padding-top:40vw;
	margin-bottom:3vw;
}
#company .company-mv:before{
	content:"";
	position:absolute;
	top:-5vw;
	right:0;
	width:64%;
	height:100%;
	background:url(../img/recruit/prof_mv.jpg) no-repeat top left / cover;
}
#company .company-mv:after{
	content:"";
	position:absolute;
	top:10vw;
	left:0;
	width:38.5%;
	padding-top:14%;
	background: url(../img/recruit/prof_deco.svg) no-repeat left / 100% auto;
}
#company .company-mv .ttl{
	content:"";
	position:absolute;
	top:56%;
	left:5.5vw;
	font-size:1.5vw;
	font-weight:700;
}

#company .company-box{
	position:relative;
	width:46vw;
	margin:0 auto;
}

/* +++++++++++++++++++++++++ */

#access {
	margin-bottom:8vw;
}
#access .access-box {
	position:relative;
	width:56vw;
	margin:0 auto;
}
#access .map {
	margin-bottom:1vw;
	height: 0;
	overflow: hidden;
	padding-bottom: 56.25%;
	position: relative;
}
#access .map iframe {
	position: absolute;
	left: 0;
	top: 0;
	height: 100%;
	width: 100%;
}

/* +++++++++++++++++++++++++ */

#main-customer{
	padding:8vw 0;
	background-color:#E4EBF3;
}
#main-customer .customer-box{
	width:38vw;
	margin:0 auto;
}
#main-customer .customer-list{
	-js-display: flex; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex;
	-webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; justify-content: space-between;
	-ms-flex-wrap:wrap; -webkit-flex-wrap:wrap; flex-wrap:wrap;
}
#main-customer .customer-list ul{
	width:47.5%;
	padding-left:1.5em;
}
#main-customer .customer-list li{
	list-style-type: disc;
}
#main-customer .customer-list li.nodisc{
	list-style: none;
}

/* +++++++++++++++++++++++++ */

#history{
	padding:8vw 0;
}
#history .history-box{
	width:38vw;
	margin:0 auto;
}
#history .history-list{
	position:relative;
	padding-top:1.5vw;
}
#history .history-list:before{
	content:"";
	position: absolute;
	left:0;
	top:0;
	width:2px;
	height:100%;
	background-color:#8B9AAF;
}
#history .history-list li{
	position:relative;
	padding-left:2vw;
	margin-bottom:1.5vw;
	-js-display: flex; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex;
	-ms-flex-wrap:wrap; -webkit-flex-wrap:wrap; flex-wrap:wrap;
}
#history .history-list li:before{
	content:"";
	position: absolute;
	top:0.5vw;
	left:-0.25vw;
	width:0.7vw;
	height:0.7vw;
	background-color:#87DD00;
	box-sizing:border-box;
	border-radius:10000px;
}
#history .history-list .year{
	width:6vw;
	font-size:1.5vw;
	line-height:1;
	font-family: "Oswald", serif;
	font-weight:500;
	color:#023A8D;
}
#history .history-list .txt{
	width:calc(100% - 6vw);

}


/* +++++++++++++++++++++++++ */

#history{
	padding:8vw 0 13vw;
}

/* +++++++++++++++++++++++++ */

#office .office-mv{
	position:relative;
	padding-top:58vw;
	margin-bottom:3vw;
}
#office .office-mv:before{
	content:"";
	position:absolute;
	top:-5vw;
	right:0;
	width:78%;
	height:100%;
	background:url(../img/recruit/office_mv.jpg) no-repeat top left / cover;
}
#office .office-mv .copy{
	position:absolute;
	bottom:10vw;
	left:0;
	color:#00398D;
	font-size:4.8vw;
	font-weight:700;
	line-height:1.4;
}
#office .office-mv .copy .bar{
	position:relative;
}
#office .office-mv .copy .bar:before{
	content:"";
	position:absolute;
	background-color:#88DD00;
	height:100%;
	width:100%;
}
#office .office-mv .copy .inner{
	position:relative;
	z-index:2;
	padding: 0 1em;
}
#office .office-mv .copy{
}
#office .office-mv .copy .bar {
	position:relative;
	display:inline-block;
}
#office .office-mv .copy .bar:before {
	content: '';
	display: inline-block;
	width: 0;
	height: 100%;
	background:#000;
	position: absolute;
	top: 0;
	z-index: 1;
}

#office{
	position:relative;
	background-color:#00398D;
	padding-bottom:8vw;
}
#office:before{
	content:"";
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:50%;
	background-color:#003080;
}
#office .office-box{
}
#office .office-list{
	position:relative;
	z-index:2;
	width:46vw;
	margin:0 auto 5vw;
	-js-display: flex; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex;
	-webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; justify-content: space-between;
	-ms-flex-wrap:wrap; -webkit-flex-wrap:wrap; flex-wrap:wrap;
}
#office .office-list li{
	width:48.5%;
	margin-bottom:3vw;
}
#office .office-list .ttl .no{
	display: inline-block;
	font-size:0.8w;
	line-height:2vw;
	width:2vw;
	height:2vw;
	font-family: "Oswald", serif;
	font-weight:500;
	color:#88DD00;
	border: solid 1px #88DD00;
	border-radius:1000px;
	text-align:center;
	margin-right:0.5em;
}
#office .office-list .ttl{
	margin-bottom:1vw;
	font-size:1vw;
	font-weight:700;
	color:#fff;
}



}

@media (max-width: 768px) {
	
	.recruit-ttl01{
		text-align:center;
		margin-bottom:6vw;
	}
	.recruit-ttl01 .en{
		display:block;
		font-size:4vw;
		line-height:1;
		color:#000;
		font-family: "Oswald", serif;
		font-weight:500;
		margin-bottom:2vw;
	}
	.recruit-ttl01 .jp{
		position:relative;
		display:block;
		font-size:5.5vw;
		line-height:1;
		color:#000;
		font-weight:700;
	}
	
	/* ++++++++++ */
	
	.recruit-ttl01.c01{
	}
	.recruit-ttl01.c01 .en{
		color:#88DD00;
	}
	.recruit-ttl01.c01 .jp{
		color:#fff;
	}
	
	/* ++++++++++ */
	
	.recruit-ttl01.c02{
	}
	.recruit-ttl01.c02 .en{
		color:#00398D;
	}
	.recruit-ttl01.c02 .jp{
		color:#000;
	}
	
	/* +++++++++++++++++++++++++ */
	
	#recruit-mv{
		position:relative;
		padding-top:8vw;
		padding-bottom:8vw;
		background-color:#00398D;
		color:#fff;
	}
	#recruit-mv:before{
		content:"";
		position:absolute;
		top:20vw;
		right:0;
		width:90%;
		padding-top:70%;
		background: url(../img/recruit/rec_mv_sp.jpg) no-repeat top left / cover;
	}
	#recruit-mv:after{
		content:"";
		position:absolute;
		top:3vw;
		left:0;
		width:70%;
		padding-top:25%;
		background: url(../img/recruit/rec_deco.svg) no-repeat left / 100% auto;
	}
	#recruit-mv .mv-ttl-box{
		position:relative;
		z-index:2;
		padding-top:15vw;
	}
	#recruit-mv .mv-ttl{
		margin-bottom:40vw;
		font-size:4vw;
		font-weight:700;
		padding-left:5vw;
	}
	#recruit-mv .mv-copy{
		font-size:10vw;
		line-height:1.3;
		font-weight:700;
		padding-left:5vw;
		margin-bottom:10vw;
	}
	#recruit-mv .mv-txt-box{
		padding-left:10vw;
		padding-right:10vw;
	}
	#recruit-mv .mv-txt-box p{
		margin-bottom:2vw;
	}
	
	
	
	/* +++++++++++++++++++++++++ */
	
	#point{
		padding-top:8vw;
		padding-bottom:8vw;
		background-color:#00398D;
		color:#fff;
	}
	#point .point-box{
		position:relative;
		padding-left:5vw;
		padding-right:5vw;
	}
	#point .point-box ol{
	}
	#point .point-box li{
		width:100%;
		margin-bottom:15vw;
	}
	#point .point-box .no{
		position:relative;
		text-align:center;
		margin-bottom:1vw;
	}
	#point .point-box .no:before{
		content:"";
		position:absolute;
		top:50%;
		left:0;
		width:100%;
		height:1px;
		margin-top:-4px;
		background-color:#88DD00;
	}
	#point .point-box .no:after{
		content:"";
		position:absolute;
		top:50%;
		left:0;
		width:100%;
		height:1px;
		background-color:#88DD00;
	}
	#point .point-box .no span{
		position:relative;
		z-index:2;
		background-color:#00398D;
		padding:0 0.4em;
		color:#88DD00;
		font-size:6vw;
		line-height:1;
		font-family: "Oswald", serif;
		font-weight:500;
	}
	#point .point-box .ttl{
		margin-bottom:5vw;
		font-size:6vw;
		font-weight:700;
		text-align:center;
	}
	
	/* +++++++++++++++++++++++++ */
	
	#guideline{
		position:relative;
		padding-top:20vw;
		padding-bottom:20vw;
		background-color:#00398D;
		padding-left:5vw;
		padding-right:5vw;
	}
	#guideline:before{
		content:"";
		position:absolute;
		top:0;
		left:0;
		width:100%;
		height:70%;
		background-color:#003080;
	}
	#guideline .guideline-box{
		position:relative;
		background-color:#fff;
	}
	#guideline .guideline-box .guideline-inner{
		position:relative;
		width:100%;
		height:100%;
		padding:5vw;
	}
	#guideline .guideline-box:before,
	#guideline .guideline-box:after,
	#guideline .guideline-box .guideline-inner:before,
	#guideline .guideline-box .guideline-inner:after{
		content:"";
		position:absolute;
		width:5vw;
		height:5vw;
	}
	#guideline .guideline-box:before{ top:-0.2vw; left:-0.2vw; background:url(../img/top/work_deco_kakko01.svg) no-repeat top left / 100% 100%;}
	#guideline .guideline-box:after{ top:-0.2vw; right:-0.2vw; background:url(../img/top/work_deco_kakko02.svg) no-repeat top left / 100% 100%;}
	#guideline .guideline-box .guideline-inner:before{ bottom:-0.2vw; left:-0.2vw; background:url(../img/top/work_deco_kakko03.svg) no-repeat top left / 100% 100%;}
	#guideline .guideline-box .guideline-inner:after{ bottom:-0.2vw; right:-0.2vw; background:url(../img/top/work_deco_kakko04.svg) no-repeat top left / 100% 100%;}
	
	#guideline .guideline-box{
		position:relative;
		z-index:2;
	}
	#guideline .recruit-ttl01{
		position:relative;
		z-index:2;
	}
	
	/* +++++++++++++++++++++++++ */
	
	#company {
		margin-bottom:20vw;
	}
	#company .company-mv{
		position:relative;
		padding-top:63vw;
		margin-bottom:30vw;
	}
	#company .company-mv:before{
		content:"";
		position:absolute;
		top:20vw;
		right:0;
		width:90%;
		height:100%;
		background:url(../img/recruit/prof_mv.jpg) no-repeat top left / cover;
	}
	#company .company-mv:after{
		content:"";
		position:absolute;
		top:3vw;
		left:0;
		width:70%;
		padding-top:28%;
		background: url(../img/recruit/prof_deco.svg) no-repeat left / 100% auto;
	}
	#company .company-mv .ttl{
		content:"";
		position:absolute;
		top:38%;
		left:5.5vw;
		font-size:4vw;
		font-weight:700;
	}
	
	#company .company-box{
		position:relative;
		padding-left:5vw;
		padding-right:5vw;
	}
	
	/* +++++++++++++++++++++++++ */
	
	#access {
		margin-bottom:20vw;
	}
	#access .access-box {
		position:relative;
		padding-left:5vw;
		padding-right:5vw;
	}
	#access .map {
		margin-bottom:3vw;
		height: 0;
		overflow: hidden;
		padding-bottom: 56.25%;
		position: relative;
	}
	#access .map iframe {
		position: absolute;
		left: 0;
		top: 0;
		height: 100%;
		width: 100%;
	}
	
	/* +++++++++++++++++++++++++ */
	
	#main-customer{
		padding:20vw 0;
		background-color:#E4EBF3;
	}
	#main-customer .customer-box{
		padding-left:5vw;
		padding-right:5vw;
	}
	#main-customer .customer-list{
	}
	#main-customer .customer-list ul{
		width:100%;
		padding-left:1.5em;
	}
	#main-customer .customer-list li{
		list-style-type: disc;
	}
	#main-customer .customer-list li.nodisc{
		list-style: none;
	}
	
	/* +++++++++++++++++++++++++ */
	
	#history{
		padding:20vw 0;
	}
	#history .history-box{
		padding-left:5vw;
		padding-right:5vw;
	}
	#history .history-list{
		position:relative;
		padding-top:1.5vw;
	}
	#history .history-list:before{
		content:"";
		position: absolute;
		left:0;
		top:0;
		width:2px;
		height:100%;
		background-color:#8B9AAF;
	}
	#history .history-list li{
		position:relative;
		padding-left:5.5vw;
		margin-bottom:4vw;
		-js-display: flex; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex;
		-ms-flex-wrap:wrap; -webkit-flex-wrap:wrap; flex-wrap:wrap;
	}
	#history .history-list li:before{
		content:"";
		position: absolute;
		top:0.5vw;
		left:-1.5vw;
		width:4vw;
		height:4vw;
		background-color:#87DD00;
		box-sizing:border-box;
		border-radius:10000px;
	}
	#history .history-list .year{
		width:14vw;
		font-size:5vw;
		line-height:1;
		font-family: "Oswald", serif;
		font-weight:500;
		color:#023A8D;
	}
	#history .history-list .txt{
		width:calc(100% - 14vw);
	
	}
	
	
	/* +++++++++++++++++++++++++ */
	
	#history{
		padding:20vw 0 33vw;
	}
	
	/* +++++++++++++++++++++++++ */
	
	#office .office-mv{
		position:relative;
		padding-top:68vw;
		margin-bottom:10vw;
	}
	#office .office-mv:before{
		content:"";
		position:absolute;
		top:-5vw;
		right:0;
		width:95%;
		height:100%;
		background:url(../img/recruit/office_mv.jpg) no-repeat top left / cover;
	}
	#office .office-mv .copy{
		position:absolute;
		bottom:-2vw;
		left:0;
		color:#00398D;
		font-size:7vw;
		font-weight:700;
		line-height:1.4;
	}
	#office .office-mv .copy .bar{
		position:relative;
	}
	#office .office-mv .copy .bar:before{
		content:"";
		position:absolute;
		background-color:#88DD00;
		height:100%;
		width:100%;
	}
	#office .office-mv .copy .inner{
		position:relative;
		z-index:2;
		padding: 0 1em;
	}
	#office .office-mv .copy{
	}
	#office .office-mv .copy .bar {
		position:relative;
		display:inline-block;
	}
	#office .office-mv .copy .bar:before {
		content: '';
		display: inline-block;
		width: 0;
		height: 100%;
		background:#000;
		position: absolute;
		top: 0;
		z-index: 1;
	}
	
	#office{
		position:relative;
		background-color:#00398D;
		padding-bottom:8vw;
	}
	#office:before{
		content:"";
		position:absolute;
		top:0;
		left:0;
		width:100%;
		height:50%;
		background-color:#003080;
	}
	#office .office-box{
	}
	#office .office-list{
		position:relative;
		z-index:2;
		padding-left:5vw;
		padding-right:5vw;
		margin-bottom:5vw;
		-js-display: flex; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex;
		-webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; justify-content: space-between;
		-ms-flex-wrap:wrap; -webkit-flex-wrap:wrap; flex-wrap:wrap;
	}
	#office .office-list li{
		width:100%;
		margin-bottom:8vw;
	}
	#office .office-list .ttl{
		margin-bottom:3vw;
		font-size:4.5vw;
		font-weight:700;
		color:#fff;
	}
	#office .office-list .ttl .no{
		display: inline-block;
		font-size:4.5vw;
		line-height:10vw;
		width:10vw;
		height:10vw;
		font-family: "Oswald", serif;
		font-weight:500;
		color:#88DD00;
		border: solid 1px #88DD00;
		border-radius:1000px;
		text-align:center;
		margin-right:0.5em;
	}
		
}