@charset "utf-8";

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

html{font-size:10px;}
a:hover {
  opacity:1;
  filter:alpha(opacity=100);
}
img {max-width: 100%;height:auto;}
#container{min-width:100%;}
.home .contents,
.article .contents {
width: 100%;
}
.contents ,
header .inner,
footer .inner {
width: 100%;
}
.section-index .block .box{
  width:100%;
  text-align: center;
  padding:2rem 0;
}

.article .flex {
display:  block;
}

.article .block.flex .text, .article .block.flex .image {
padding: 2.5rem 2.5rem 0;
}
.article .block.flex .image img{width: 100%}

/*vision*/

.lead .text {
padding-top: 3rem;
padding-left: 0;
width:86%;
margin:0 auto;
}
.lead .text h2 {
font-size: 2.4rem;
}
.lead .text p {
  text-align: center;
font-size: 1.4rem;
}
.contents-title {
padding: 3rem 0;
}
.lead .image img {
display: block;
transform: translate(0,0);
margin-top:2rem;
}
.vision .section01 {
margin-top: 2rem;
}


/*company*/

.company .section {
width: 90%;
margin: 0 auto;
}
.company table th, .company table td {
display: block;
 width: 100%
}
.company .section h3 {
padding: 0 0 1rem;
}
.company table th{border:none;padding: 1.6rem 0 0.4rem;}
.company table td{padding: 0 0 1.6rem;}

.company .section03 table th{width:100%;}

/*staff*/
.staffs .title .text{position: relative; top:0;display: block;
width:auto; height: auto;}
.staffs .title .text div{
width: 86%;
margin: 0 auto;
padding:2rem 0;
}
.staffs .title .text h2 {
font-size: 2.4rem;
}
.staffs .title .text p {
font-size: 1.4rem;
}
.staffs .title .text p strong {
font-size: inherit;
}
.staffs .section h2 ,
.staffs .section h3 {
line-height: 1.4em;
}
.staffs .section h2 {
text-align: left;
font-size: 2.2rem;
padding: 4rem 4.5rem 4rem;
}
.staffs .section+.section{margin-top:3rem;}

/*recruit*/

.recruit.index article .inner{
  width:90%;
margin:0  auto;
}
.recruit.index article h3{text-align: left; font-size: 2rem;}
.recruit article h4{text-align: center; color:#1254D1; font-size: 2rem;}
.recruit article p.text{text-align: left;}

.recruit .guideline{
  width:90%;
margin:0  auto;
}
.recruit article h3{
}
.recruit article h4{
font-size: 1.6rem;
}
.recruit .guideline .col{
}
.recruit .guideline .col .col01,
.recruit .guideline .col .col02{
  width:100%;
padding-top: 0;
}
.recruit .guideline .icon{
  margin:6rem auto 0;
}
.block-links {width: 100%;margin-top: 30px ;}
.block-link {font-size:20px;display: block;}
.recruit.index .block-link {font-size:18px;text-align: center;}

/* col */
.col{display: block}
.col .col01,
.col .col02,
.col .col03{
display: block;
padding-right:0!important;
padding-left:0!important;
padding-top:2em;
}
/*.header-image */
.header-image  {
height: 480px;
min-width: 100%;
margin-top:0;
}

/*nav*/
header{
border-top:15px solid #11A3D9;
}
header h1 {
  padding-left:12px;
}
header h1 img{
width:280px;
}
header nav{
display: none;
position: fixed;
top: -0;
z-index: 100;
width:100%;
height: 100%
}
header nav .nav-inner{
	position: relative;
	height: 100%;
	overflow-y: auto;
	-webkit-overflow-scrolling:touch;
  padding:0;

}
header .nav-inner .truck{
  top:10px;
  left:10px;
}
header nav ul{
position: relative;
	z-index: 100;
top: auto;
right: auto;
text-align: center;
padding:30px 0;
}

header ul li{
padding: 0 0 0;
}
header ul li a{
	border-bottom: 1px solid #fff;
	padding:1.5em 0;
	display: block;
}

header ul li{display: block;height: auto;}

header .btn-contact{
position: relative;
top: 0;
right:0;
width:86%;
margin:0 auto 40px;
}
header .btn-contact a{
  color:#fff;
  padding:18px 0;
width:100%;
}

/* hamburger */


.hamburger,
.hamburger span {
transition: all .4s;
box-sizing: border-box;
}

.hamburger {
position: fixed;
top:35px;
right:15px;
cursor: pointer;
width: 36px;
height: 36px;
z-index: 999;
}
.hamburger .box {
position: absolute;
top:5px;
right:5px;
width: 26px;
height: 22px;
}
.hamburger .box span {
position: absolute;
left: 0;
width: 100%;
height: 2px;
background-color: #000;
}
.hamburger .box span:nth-of-type(1) {
top: 0;
}
.hamburger .box span:nth-of-type(2) {
top: 10px;
}
.hamburger .box span:nth-of-type(3) {
bottom: 0;
}
.hamburger.active .box span{background-color: #fff;}
.hamburger.active .box span:nth-of-type(1) {
-webkit-transform: translateY(10px) rotate(-45deg);
transform: translateY(10px) rotate(-45deg);
/*background-color: #1A55D1;*/
}
.hamburger.active .box span:nth-of-type(2) {
opacity: 0;
}
.hamburger.active .box span:nth-of-type(3) {
-webkit-transform: translateY(-10px) rotate(45deg);
transform: translateY(-10px) rotate(45deg);
/*background-color: #1A55D1;*/
}




/*///////////////////////////////////////////*/

.sp{display: block !important;}
.pc{display: none !important;}
.sp2{display: inline-block !important;}
.pc2{display: none !important;}

}