@charset "utf-8";




/* -------------- 
												仕事紹介 
																			-------------- */

/*見出し*/
#top  {
	display: block;
	width: 100%;
	padding:13% 0 9%;
	position: relative;
}

#top::before{
	display: block;
	position: absolute;top:10%;
	z-index: -2;
	content: "";
	width: 100%;height: 506px;
	background: url(../img/works_topBg.png) no-repeat 0 0;
	background-size: cover;
}

#top h2.works_h2 {
	display: block;
	width:78%;
	max-width: 651px;
	position: absolute;top: 2%;left:3% ; right: 0;
}

#top h2.works_h2 img{
	width: 100%;
}

#top p.shoukai{
	display: block;
	width: 30%;
	max-width: 137px;
	margin: 0 auto ; 
	text-align: center;
}

p.shoukai img{
	display: block;
	width: 100%;
}

.h2_hr{
	display: block;
	width: 100%;
	max-width:92px ;
	margin: 1.5% auto 2%;
	text-align: center;
}

.shoukaiText{
	width: 87%;
	margin: 0 auto;
	text-align: center;
	font-size: 18px ;
	font-size: 1.8rem ;
	line-height:200% ;
}

.br_Sp {
	display: none
}

@media screen and (max-width:1280px) {
	
#top  {
	padding:22% 0 6%;
}

#top::before{
	position: absolute;top:15%;
}
}

@media screen and (max-width:768px) {
	
#top  {
	margin: 4% auto 7%;
	padding:58% 0 6%;
}
	
#top h2.works_h2 {
	position: absolute;top: 4%;left:3% ;
}
}

@media screen and (max-width:480px) {
	
#top  {
	margin: 6% auto 30%;
	padding:40% 0 6%;
}
	
#top h2.works_h2 {
	position: absolute;top:3%;left: 3% ;
}

#top p.shoukai{
	width: 30%;
	margin: 12% auto 0 ; 
}
	
p.shoukaiText{
	margin-top:6% ;
	font-size: 15px;
	font-size: 1.5rem;
}
	
#top::before{
	position: absolute;top:7%;
}
}


/*部署リンク*/
ul#slanting04 {
	display: block;
	width: 100%;
	max-width: 910px;
	margin: 2% auto 0 ;	
	text-align: center;
}

ul#slanting04 li{
	width: 100%;
	max-width: 211px;
	height: 50px;
	margin:0 0.5%;
	display:inline-block;
	vertical-align: top;
	position: relative;
	/* background:#FDAB75;*/
	/*transform:skewX(-15deg);*/
}	

ul#slanting04 li a {
	display: block;
	width: 100%;
}


ul#slanting04 li a p.imgTxt{
	display: block;
	width: 100%;
	max-width: 187px;
	padding: 6% 0 0 10% ;
}

ul#slanting04 li a p.imgTxt img{
	display: block;
	width: 100%;
}

ul#slanting04 li a{
	display: block;
	position: relative;
	width: 100%;
	text-align: center;
}

ul#slanting04 li a::before{
	display: block;
	content: "";
	position: absolute; top: 0; left: 0;
	z-index: -1;
	width: 100%;
	height: 50px;
	transform:skewX(-15deg);
	background: #0A71B6;
}

ul#slanting05 {
	display: block;
	margin: 1% auto 0 ;	
	text-align: center;
}

ul#slanting05 li{
	width: 211px;
	height: 50px;
	margin:0 0.5%;
	display:inline-block;
	vertical-align: top;
	position: relative;
}	

ul#slanting05 li a {
	display: block;
	width: 100%;
}

ul#slanting05 li a p.imgTxt{
	display: block;
	width: 100%;
	max-width: 187px;
	padding: 6% 0 0 10% ;
}

ul#slanting05 li a p.imgTxt img{
	width: 100%;
}

ul#slanting05 li a{
	display: block;
	position: relative;
	width: 100%;
	text-align: center;
}

ul#slanting05 li a::before{
	display: block;
	content: "";
	position: absolute; top: 0; left: 0;
	z-index: -1;
	width: 100%;
	height: 50px;
	transform:skewX(-15deg);
	background: #0A71B6;
}

ul#slanting05 li:nth-last-of-type(1) a::before{
	background: #F9C40A;
}

@media screen and (max-width:915px) {
	
#top  {
	margin: 4% auto 7%;
	padding:30% 0 6%;
}
	
ul#slanting04{
	max-width: 500px;
	margin: 8% auto 0 ;	
}

ul#slanting04 li{
	margin: 0 2% 4%;
}	
	
ul#slanting05{
	max-width: 500px;
	margin: 3% auto 0 ;
}
	
ul#slanting05 li{
	margin: 0 2% 4%;	
}


}

@media screen and (max-width:480px) {
	
	
ul#slanting04{
	max-width:212px;
	margin: 15% auto 0 ;	
	text-align: center;
}
		
ul#slanting05{
	max-width: 212px;
	margin: 0 auto ;	
	text-align: center;
}
	
ul#slanting05 li,
ul#slanting04 li{
	width: 80%;
	margin:3% 0 0 0;
}
	
ul#slanting04 li a::before{
	transform:skewX(0deg);
}
	
ul#slanting05 li a::before{
	transform:skewX(0deg);
}

ul#slanting04 li{
	margin:0 0 1% 0;
}	

ul#slanting05 li{
	margin:0 0 1% 0;
}	

ul#slanting04 li a p.imgTxt,
ul#slanting05 li a p.imgTxt{
	padding: 8% 6% 0 10% ;
}


}


/*仕事説明*/
.work_01 {
	display: block;
	max-width:100% ;
	margin: 0 auto 10%;
	text-align: center;
}

.work_01 .workImg01 video{
	width: auto;
	height: 100%;
}


.work_01 .workImg01{
	width: 56vw;
	/*max-width: 757px;*/
	height: 60vw;
	float: left;
	overflow: hidden
}

.work_01 .midashi_r {
	float: right;
	width: 42.5vw;
	height: 60vw;
	/*max-width: 598px;*/
	padding: 8% 10% 0 ;
}

.work_01 .midashiImg {
	display: block;
	width: 70%;
	max-width: 412px;
	margin: 0 auto;
	text-align: center;
}

.midashi_r .midashiImg img{
	width: 100%;
}

.midashi_r .midashiImg02 {
	display: block;
	width: 100%;
	max-width: 468px;
	margin: 14% auto 12%;
}

.work_01 .midashiImg02 img{
	display: block;
	width: 100%;
}


.midashi_r .midashiImg02 video{
	display: block;
	width: 100%;
}

.midashi_r .midashiImg02 img{
	display: block;
	width: 100%;
}

.work_01 .midashi_r p.workText01{
	display: block;
	width: 100%;
	margin: 0 auto;
	font-size: 19px;
	font-size: 1.9rem;
	margin-bottom: 5%;
	color: #10348D;
	font-weight: bold;
	line-height: 1.6;
}

.work_01 .midashi_r p.workText01_02{
	padding: 0 8% 0 0;
	line-height: 2.1;
}

.work_02 {
	display: block;
	width: 100%;
	margin: 0 auto 10%;
	text-align: center;
}

.work_02 .workImg01 video{
	width: auto;
	height: 100%;
}

.work_02 .workImg01{
	width: 56vw;
	/*max-width: 757px;*/
	height: 60vw;
	float: right;
	overflow: hidden
}

.work_02 .midashi_l {
	float: left;
	width: 42.5vw;
	height: 60vw;
	/*max-width: 598px;*/
	padding: 8% 10% 0 ;
}

.work_02 .midashiImg {
	display: block;
	width: 70%;
	max-width: 412px;
	margin: 0 auto;
	text-align: center;
}

.midashi_l .midashiImg img{
	width: 100%;
}

.midashi_l .midashiImg02 {
	display: block;
	width: 100%;
	max-width: 468px;
	margin: 14% auto 12%;
}


.midashi_l .midashiImg02 video{
	display: block;
	width: 100%;
}

.work_02 .midashi_l p.workText01{
	display: block;
	width: 100%;
	margin: 0 auto;
	font-size: 19px;
	font-size: 1.9rem;
	margin-bottom: 5%;
	color: #10348D;
	font-weight: bold;
	line-height: 1.6;
}

.work_02 .midashi_l p.workText01_02{
	padding: 0 8% 0 0;
	line-height: 2.1;
}


@media screen and (max-width:1280px) {
	
.work_01 .workImg01{
	width: 100%;
	height: auto;
	float: none;
	margin: 0 auto 2%;
}
	
.work_01 .workImg01 video,
.work_02 .workImg01 video{
	width: 100%;
}
	
.work_01 .midashi_r{
	width: 100%;
	height: auto;
	float: none;
	margin: 0;
}
	
.work_01 .midashi_r p.workText01{
	display: block;
	width: 100%;
	margin: 0 auto 3%;
	padding: 0;
}

br {display: none}
	
.work_01 .midashi_r p.workText01_02{
	display: block;
	margin: 0 auto;
	padding: 0;
}
	
.work_02 .workImg01{
	width: 100%;
	height: auto;
	float: none;
}
	
.work_02 .midashi_l{
	width: 100%;
	height: auto;
	float: none;
}	
	
.work_02 .midashi_l p.workText01{
	display: block;
	width: 100%;
	margin: 0 auto 3%;
	padding: 0;
}

br {display: none}
	
.work_02 .midashi_l p.workText01_02{
	display: block;
	margin: 0 auto;
	padding: 0;
}
}
	


@media screen and (max-width:768px) {
	
.work_01 {
	margin: 22% auto ;
}

.work_02{
	margin: 22% auto ;
}

.h2_hr{
	margin:4% auto;
}

.br_Sp {
	display:none
}
	
}

@media screen and (max-width:480px) {
	
br {display: none}
br.br_Sp {display: none}

}


/* -------------- 教育制度 -------------- */

#education {
	margin-bottom: 8%;
}

#education .education_top{
	display: block;
	width: 100%;
	margin: 0 auto;
	background: url("../img/educationBg.png") no-repeat 0 0;
	background-size: cover;
	padding:15% 0 ; 
}

#education p.shoukai{
	display: block;
	width: 30%;
	max-width: 137px;
	margin:0 auto ; 
	text-align: center;
}

#education ul.education_ul {
	display: block;
	width:100%;
	max-width:2000px ;
	margin: 3em auto;
	text-align: center;
	overflow: hidden;
}

#education ul.education_ul li{
	display: inline-block;
	width:90%;
	max-width:380px ;
	height: 418px;
	overflow: hidden;
	/*display: table-cell;*/
	vertical-align: top;
	margin: 0 1em 0 ;
	text-align: center;
}

#education ul.education_ul li:nth-of-type(1){
	height: 440px;
}

#education ul.education_ul li:nth-of-type(3){
	max-width: 415px;
}

#education ul.education_ul li img:nth-of-type(1){
	display: block;
	width: 50%;
	max-width:127px ;
	margin: 0 auto;
	text-align: center;
	margin-bottom:12%;
}

#education ul.education_ul li img:nth-of-type(2){
	display: block;
	width: 60%;
	max-width: 249px;
	margin: 0 auto;
	text-align: center;
}


#education ul.education_ul li img.education_hr{
	width: 50%;
	max-width: 93px;
	margin: 7% auto;
	text-align: center;
}

#education ul.education_ul p.educationText{
	width:100%;
	margin: 0 auto;
	text-align: center;
	font-size: 18px;
	font-size: 1.8rem;
	line-height:200% ;
}

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

#education ul.education_ul li:nth-of-type(3){
	margin-top: 4%;
}
	
}

@media screen and (max-width:768px) {
	
#education .education_top{
	padding:20% 0 27%; 
}

#education ul.education_ul li{
	margin: 0 auto;
	text-align: center;
}

}

@media screen and (max-width:480px) {
	
#education ul.education_ul p.educationText{
	font-size: 16px;
	font-size: 1.6rem;
}

}