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

* {
  margin: 0;
  padding: 0;
}

.top_business{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
}

.top_business li{
  width: 49.5%;
  text-align: center;
  color: #fff;
  font-size: 25px ;
  font-weight: 700;
  line-height: 1;
}
.top_business li a{
  display: block;
  color: #fff;
	height: 100%;
  text-decoration: none;
  background: #00aced;
	background: linear-gradient(45deg, rgba(67,155,196,1),rgba(35,100,180,1));
	position:relative;
}
.top_business li .bgimg{
	overflow: hidden;
}
.top_business li img{
	opacity: 0.5;
	transition: all .4s ease-out;
/*	mix-blend-mode: overlay;*/
}
.top_business li p{
  padding: 15px ;
		width:100%;
	height:100%;
	top:0; left: 0;
	position: absolute;
	z-index: 10;
  margin: 0;
	line-height: 1.4;

	display: -webkit-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      -webkit-justify-content: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      -webkit-align-items: center;
      align-items: center;
}

@media (min-width: 788px) {
	.top_business li a:hover img{opacity: 0.2;
		transform: scale(1.05);
	-webkit-transform:scale(1.05);}
}
@media (max-width: 787px) {
	.top_business li{width: 100%; margin-bottom: 15px;font-size: 21px ; overflow: hidden;}
	.top_business li img{margin-top: -10%; margin-bottom: -10%;}
	/*.top_business li img{width: 35%; float: left; opacity: 1;}
	.top_business li p{ height: 100%; }*/
}
@media (max-width: 599px) {
	.top_business li{font-size: 16px ;}
}


.top_develop{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
}



.top_develop li{
  width: 33.2%;
  text-align: center;
  color: #fff;
  font-size: 21px ;
  font-weight: 700;
  line-height: 1;
}
.top_develop.company_cate li{width: 49.5%; margin-bottom: 1%;}
.top_develop li a{
  display: block;
  color: #fff;
	height: 100%;
  text-decoration: none;
	transition: background .4s ease;
  background: #00365a;
}
.top_develop.ctr{max-width: 900px; margin: 0 auto;}
.top_develop.ctr li{width: 100%; margin-bottom: 5px;}
.top_develop.ctr li .bgimg{width: 35%; float: left;}
.top_develop.ctr li p{ height: 100%;}

.top_develop li p{
  padding: 15px ;
  margin: 0;
	line-height: 1.4;


	display: -webkit-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      -webkit-justify-content: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      -webkit-align-items: center;
      align-items: center;
}
.top_develop.ctr li p::after{
	content: "\f30f";
	font-family: ionicons;
	padding:0 0.2em 0 0.8em;
	transition: all .4s ease-out;
}
.top_develop li .bgimg{
	overflow: hidden;
}
.top_develop li img{
	width: 100%;
	height: auto;
	transition: all .4s ease-out;
}
@media (min-width: 788px) {
	.top_develop li a:hover img{
		transform: scale(1.05);
	-webkit-transform:scale(1.05);}
	.top_develop li a:hover{background: #00aced;}
	.top_develop.ctr li a:hover p::after{padding:0 0 0 1em;}
}
@media (max-width: 787px) {
	.top_develop li,.top_develop.company_cate li{width: 100%; margin-bottom: 5px;}
	.top_develop li .bgimg{width: 35%; float: left;}
	.top_develop li p{ height: 100%;}
}
@media (max-width: 599px) {
	.top_develop li{font-size: 16px ;}
}
.top_company{
  margin:0;
  padding: 0;
  background: url(../images/top_company.jpg) bottom right no-repeat;
  background-position: bottom right;
  background-size: contain;
  width: 100%;
  height: 600px;
}


.top_cbox{
	width: 40%;

}

.top_company ul{
	display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content:space-between;

}



.top_company ul li{
  flex-basis:47%;
  text-align: center;
  color: #fff;
  font-size: 18px ;
  font-weight: 700px;
  line-height: 1;
	height: 0;
	padding-top: 47%;
	position: relative;
	margin-bottom: 6%;
}

.top_company ul li a{
  display: block;
	position: absolute;
	top:0; left: 0;
  color: #fff;
  text-decoration: none;
	width: 100%;
	height: 100%;


	display: -webkit-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      -webkit-justify-content: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      -webkit-align-items: center;
      align-items: center;
}
.top_company ul li a::before{
	position: absolute;
	content: '';
	width: 100%; height: 100%;
	top:0; left: 0;
	background: linear-gradient(45deg, rgba(67,155,196,1),rgba(35,100,180,1));
	border: 2px solid #fff;
	opacity: 0.95;
}
.top_company ul li p{
  padding: 15px ;
  margin: 0;
	line-height: 1.4;
	position: relative;
	z-index: 1;
}



@media (max-width: 787px) {
	.top_company{height: 500px;}
	.top_cbox{	width: 90%; margin: 0 auto;	}
	.top_company ul li{padding-top: 25%; font-size: 16px ;}
}
@media (min-width: 1025px) {
	.top_company{ background-size: 1025px auto;}
}



.top_recruit_wrap{
  margin: 6% auto;
  padding: 0;
	position: relative;
}
.recruit_bbox{
	position: absolute;
	top:25%;
	left: 36.915%;
	width:26.17%;
	height: 50%;
	background: rgb(67,155,196);
background: linear-gradient(0deg, rgba(67,155,196,1) 0%, rgba(35,100,180,1) 100%);

	display: -webkit-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      -webkit-justify-content: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      -webkit-align-items: center;
      align-items: center;
	z-index: 10;
}
.recruit_bbox h2{color: #fff;}

ul.top_recruit{
  margin: 0;
  padding: 0;
}
ul.top_recruit li{
	position: relative;
    width: 100%;
/*    height: 335px;*/
    padding-top: 26.17%;
}

ul.top_recruit li:first-child{
  background: #eee url(../images/top_new2.jpg) left center no-repeat;
	background-size: 100% auto;
}
ul.top_recruit li:last-child{
  background: #eee url(../images/top_recriot.jpg) right center no-repeat;
	background-size: 100% auto;
}

ul.top_recruit li a{
	position: absolute;
	color: #222;
	height: 100%;
	top:0; left :0;
	text-decoration: none;
  display: block;
  width: 100%;
  padding: 0 ;
  font-size: 30px ;

	display: -webkit-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      -webkit-justify-content: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      -webkit-align-items: center;
      align-items: center;
}
ul.top_recruit li p{
	text-align: right;
	width: 90%;
  color: #fff;

}
ul.top_recruit li:last-child p{
	text-align: left;
}
@media (max-width: 599px) {
	.recruit_bbox h2{font-size:1.2em;}
	.recruit_bbox h2 span{font-size:0.8em;}
	ul.top_recruit li a{font-size: 20px ;}
}


.anniversarybox{
	width: 100%;
	margin: 8% auto 2%;
	max-width: 850px;
	background-image: url(../images/img_company.jpg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	position: relative;
	overflow: hidden;
	font-family: yu-mincho-pr6, sans-serif;
}
.anniversarybox::after{
	position: absolute;
	content: '';
	width: 100%; height: 100%;
	top:0; left: 0;
	background-color: #000;
	opacity: 0.6;
}
.anniversarybox .anniv-num{
	font-size: 30vw;
	margin-bottom: -0.1em;
	color: #fff;
	opacity: 0.3;
	bottom: 0;
	right: 0;
	position: absolute;
	z-index: 1;
	line-height: 1;
	letter-spacing: -0.1em;
	vertical-align: baseline;
}
.anniversarybox .anniv-num span{font-size: 0.4em;
	letter-spacing: normal;}
main .container .anniversarybox p{
	font-size: 3vw;
	width: 50%;
	padding: 1.5em;
	line-height: 1.6;
	text-align: center;
	color: #fff;
	position: relative;
	z-index: 1;
}
@media (max-width: 599px) {
	main .container .anniversarybox p{
		font-size: 5vw;
		width: 80%;
	}
}
@media (min-width: 1025px) {
  main .container .anniversarybox p{
		font-size:30.75px;
	}
	.anniversarybox .anniv-num{font-size:307.5px;}
}

/*------------------------
スマホ
------------------------------*/
@media (max-width: 787px) {

}

@media (max-width: 599px) {
   body {
   }



}

/*------------------------
タブレット
------------------------------*/
@media (min-width: 600px) and (max-width: 1024px) {
   body {

   }

}
/*------------------------
PC
------------------------------*/
@media (min-width: 1025px) {
   body {

   }

}

/*------------------------
PC　lg
------------------------------*/
@media (min-width: 1580px) {
   body {

   }

}