@charset "utf-8";
/* CSS Document */

body {
    line-height:1;
font-family: Verdana, "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
	color:#333333;
    font-size:62.5%;
	line-height:1.6em;
    -webkit-text-size-adjust: 100%;
}


/*レスポンシブ用イメージ*/
img{
max-width: 100%;
height: auto;
width /***/:auto;　
}


/* レスポンシブで画像を切り替える（CSS） */
@media screen and (max-width:960px) {
    .pc {
        display:none; /* PC用画像を非表示にする */
    }
}
/* レスポンシブで画像を切り替える（CSS） */
@media screen and (min-width: 959px) {
    .sp {
        display:none; /* PC用画像を非表示にする */
    }
}

/*==================
header
====================*/
html, body, #wrapper {
    height: 100%;
}
#wrapper {
    position: relative;
}

#svg-bg {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 70px;
    left: 0;
    z-index: -1;
}

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

header h1{
	text-align:center;
}

#svg-bg {
    top: 52px;
}
}

/*==================
NavigationPC
====================*/
header{
	background:url(../img/common/header_back.png) left top repeat-x;
	height:150px;
}
header h1{
	background:url(../img/common/logo_back.png) left bottom no-repeat;
	width:440px;
	height:150px;
	text-align:center;
}
header h1 .logo{
	padding:20px 10px;
}
.pcmenu{
	max-width:800px;
	width:55%;
	overflow:hidden;
	padding:10px 0;
	margin:0 auto;
	position:absolute;
	top:20px;
	right:10px;
}
.pcmenu ul{
	display:flex;
	flex-wrap:no-wrap;
	font-size:1.5em;
}
.pcmenu li.gm{
	text-align:center;
	padding:10px 0;
	margin:30px auto;
}
.pcmenu li.gm a{
	color:#222;
}

@media screen and (max-width: 959px){
header{
	background:url(../img/common/header_back.png) center bottom repeat-x;
	height:110px;
	text-align:center;
}	
header h1{
	background:url(../img/common/logo_back.png) center bottom no-repeat;
	width:100%;
	text-align:center;
	margin:0 auto;
	height:120px;
}
header h1 .logo{
	padding:10px;
	max-width:60%;
	max-height:60px;
	text-align:center;
	margin:0 auto;
}
	
	
}

/*==================
NavigationSP
====================*/

.menu {
	position: fixed;
	display: table;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(255,255,255,.9);
	-webkit-transition: all .5s;
	transition: all .5s;
	visibility: hidden;
	opacity: 0;
	z-index:1000;
}

.side-open .menu {
	cursor: url(../img/common/cross.svg),auto;
	-webkit-transition: all .5s;
	transition: all .5s;
	visibility: visible;
	opacity: 1;
}

.menu ul {
	display: table-cell;
	vertical-align: middle;
}

.menu li {
	width: 300px;
	margin: 25px auto;
	text-align: center;
	opacity: 0;
	font-size:1.5em;
}
.menu li a{
	color:#333;
}

.side-open .menu li {
	opacity: 1;
}

.side-open .menu li:nth-child(1) {
	-webkit-transition: opacity 1s ease .5s;
	transition: opacity 1s ease .5s;
}

.side-open .menu li:nth-child(2) {
	-webkit-transition: opacity 1s ease .6s;
	transition: opacity 1s ease .6s;
}

.side-open .menu li:nth-child(3) {
	-webkit-transition: opacity 1s ease .7s;
	transition: opacity 1s ease .7s;
}

.side-open .menu li:nth-child(4) {
	-webkit-transition: opacity 1s ease .8s;
	transition: opacity 1s ease .8s;
}

.side-open .menu li:nth-child(5) {
	-webkit-transition: opacity 1s ease .9s;
	transition: opacity 1s ease .9s;
}

.side-open .menu li:nth-child(6) {
	-webkit-transition: opacity 1s ease .9s;
	transition: opacity 1s ease 1s;
}
.side-open .menu li:nth-child(7) {
	-webkit-transition: opacity 1s ease .9s;
	transition: opacity 1s ease 1.1s;
}


/* --------------------------------------------------- menu-btn */
.menu-btn {
	position: fixed;
	top: 0px;
	padding:5px;
	right: 5px;
	text-align: center;
	cursor: pointer;
	z-index: 1000;
}
.menu-btn span {
    color: #333;
}
.menu-btn span:after {
	content: attr(data-txt-open);
}

.side-open .menu-btn span:after {
	content: attr(data-txt-close);
}

@-webkit-keyframes anim {
	0% {-webkit-transform:translateY(0px);transform:translateY(0px);}
	50% {-webkit-transform:translateY(-5px);transform:translateY(-5px);}
	100% {-webkit-transform:translateY(0px);transform:translateY(0px);}
}

@keyframes anim {
	0% {-webkit-transform:translateY(0px);transform:translateY(0px);}
	50% {-webkit-transform:translateY(-5px);transform:translateY(-5px);}
	100% {-webkit-transform:translateY(0px);transform:translateY(0px);}
}

.otoiawase{
	position:absolute;
	top:0;
	right:0;
	font-size:1.3em;
	z-index:100;
	display:flex;
    justify-content: center;
    align-items: center; 
	border-bottom:1px solid #dfdfdf;
}
.haitatubr{
	display:none;
}
img.truck{
	padding:5px 8px;
}
@media screen and (max-width: 1089px){

.haitatubr{
	display:block;
}
.car span{
	display:block;
}
	
}

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

.haitatubr{
	display:none;
}
.otoiawase{
	position:fixed;
	top:auto;
	bottom:0;
	right:0;
	font-size:1.3em;
	z-index:100;
	display:flex;
    justify-content: center;
    align-items: center; 
	border-top:1px solid #dfdfdf;
	background:#fff;
	width:100%;
}
.car{
	line-height:1.6em;
}
.imgtel{
	text-align:right;
}
	
}

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

.otoiawase{
	position:fixed;
	flex-wrap:wrap;
    justify-content: flex-end;
}
	
}
/*==================
TOPPAGE
====================*/
#topmain{
	position:relative;
	background:url(../img/top/main.png) center center no-repeat;
	background-size:cover;
	height:680px;
	margin-top:-35px;
	z-index:-1;
}
#topmain .catch{
	position:absolute;
	left: 5%;
	bottom:10%;
	max-width:60%;
}
#topmain .catch img{
}

#topcontents .inner{
	max-width:1280px;
	padding:40px 10px;
	margin: 0 auto;
	}
#topcontents .inner h2{
	margin:50px auto;
	text-align:center;
	font-size:2.0em;
	line-height:1.6em;
	letter-spacing:0.1em;
}
#topcontents .inner .greetingbtn{
	margin:80px auto 50px;
	text-align:center;
}
	
#topcontents .tBtn{
	margin:0 auto;
	padding:15px 0;
	background:url(../img/top/business_back.png) center center no-repeat;
	background-size:cover;
	}
#topcontents .tBtn h3{
	margin:0px auto 20px;
	text-align:center;
	max-width:70%;
	}
#topcontents .tBtn p{
	margin:30px auto 50px;
	text-align:center;
	font-size:1.6em;
	line-height:1.6em;
	font-weight:bold;
	letter-spacing:0.1em;
	}
#topcontents .tBtn ul{
	display:flex;
	max-width: 960px;
	margin: auto;
	}
#topcontents .tBtn ul li{
	width:50%;
	text-align:center;
	padding:5px;
	}
	
#topcontents .tBtnc{
	margin:0 auto;
	padding:15px 0;
	background:#f4f2ea url(../img/top/btn_back.png) center bottom repeat-x;
	border-top:1px solid #fff;
	}
	
#topcontents .tBtnc ul{
	display:flex;
	max-width: 960px;
	margin: auto;
	}
#topcontents .tBtnc ul li{
	width:50%;
	text-align:center;
	padding:5px;
	}
	
	

#topcontents ul li a:hover {
	filter: sepia(0);
	-webkit-filter: sepia(0);
}


@media screen and (max-width: 979px) {
#topmain{
	position:relative;
	background:url(../img/top/main.png) center center no-repeat;
	background-size:cover;
	height:480px;
}
}
@media screen and (max-width: 779px) {
#topmain{
	position:relative;
	background:url(../img/top/main.png) center center no-repeat;
	background-size:cover;
	height:380px;
}
}
@media screen and (max-width: 480px) {
header{
	background:url(../img/common/header_back.png) center bottom repeat-x;
	height:95px;
	text-align:center;
}	
header h1{
	background:url(../img/common/logo_back.png) center bottom no-repeat;
	width:100%;
	text-align:center;
	margin:0 auto;
	height:105px;
}
header{
	text-align:left;
}
header h1 .logo{
	padding:10px;
	max-width:60%;
	max-height:60px;
	text-align:left;
	margin:0 10px;
}
header h1{
	text-align:left;
}


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

#topmain{
	position:relative;
	background:url(../img/top/main.png) center center no-repeat;
	background-size:cover;
	height:280px;
}
#topcontents .inner{
	max-width:1280px;
	padding:20px 15px;
	margin: 0 auto;
	}
#topcontents .inner h2{
	margin:20px auto 30px;
	text-align:left;
	font-size:1.8em;
}
#topcontents .inner .greetingbtn{
	margin:30px auto 20px;
}
#topcontents .tBtn h3{
	margin:10px auto;
	}
#topcontents .tBtn p{
	margin:20px auto;
	font-weight:normal;
	text-align:left;
	font-size:1.4em;
	}
#topcontents .tBtnc ul{
	display:flex;
	flex-wrap:wrap;
	}
#topcontents .tBtn ul{
	display:flex;
	flex-wrap:wrap;
	text-align:center;
	justify-content:center;
	}
	
#topcontents .tBtn ul li{
	width:100%;
	text-align:center;
	padding:5px;
	}
#topcontents .tBtnc ul li{
	width:100%;
	text-align:center;
	padding:5px;
	}
}



/*----------------------------------------------------
共通
----------------------------------------------------*/

.greeting #main{
	background:#f4f2ea url(../img/greeting/greeting_ico.png) right bottom no-repeat;
	height:205px;
	margin-top:-35px;
	z-index:-1;	
	position:relative;
}
.company #main{
	background:#f4f2ea url(../img/company/company_ico.png) right bottom no-repeat;
	height:205px;
	margin-top:-35px;
	z-index:-1;	
	position:relative;
}
.kyushoku #main{
	background:#f4f2ea url(../img/kyushoku/kyushoku_ico.png) right bottom no-repeat;
	height:205px;
	margin-top:-35px;
	z-index:-1;	
	position:relative;
}
.kojin #main{
	background:#f4f2ea url(../img/kojin/kojin_ico.png) right bottom no-repeat;
	height:205px;
	margin-top:-35px;
	z-index:-1;	
	position:relative;
}
.business #main{
	background:#f4f2ea url(../img/business/business_ico.png) right bottom no-repeat;
	height:205px;
	margin-top:-35px;
	z-index:-1;	
	position:relative;
}
.recruit #main{
	background:#f4f2ea url(../img/recruit/recruit_ico.png) right bottom no-repeat;
	height:205px;
	margin-top:-35px;
	z-index:-1;	
	position:relative;
}
#main h2{
	padding:50px 10px;
	text-align:center;
}
@media screen and (max-width: 959px) {

#main h2{
	padding:70px 10px 0;
	text-align:center;
	max-width:80%;
	margin:0 auto;
}
}

@media screen and (max-width:580px) { 
.greeting #main{
	background:#f4f2ea url(../img/greeting/greeting_ico.png) right bottom no-repeat;
	height:150px;
	background-size:40%;
}
.company #main{
	background:#f4f2ea url(../img/company/company_ico.png) right bottom no-repeat;
	height:150px;
	background-size:40%;
}
.kyushoku #main{
	background:#f4f2ea url(../img/kyushoku/kyushoku_ico.png) right bottom no-repeat;
	height:150px;
	background-size:40%;
}
.kojin #main{
	background:#f4f2ea url(../img/kojin/kojin_ico.png) right bottom no-repeat;
	height:150px;
	background-size:40%;
}
.business #main{
	background:#f4f2ea url(../img/business/business_ico.png) right bottom no-repeat;
	height:150px;
	background-size:40%;
}
.recruit #main{
	background:#f4f2ea url(../img/recruit/recruit_ico.png) right bottom no-repeat;
	height:150px;
	background-size:40%;
}
#main h2{
	padding:50px 10px 0;
	text-align:center;
}
}

#contents .inner{
	max-width:1200px;
	padding:30px 10px;
	margin: 0 auto;
	}
#contents .inner h2{
	margin:50px auto;
	text-align:center;
	font-size:2.0em;
	line-height:1.6em;
	letter-spacing:0.1em;
}
#contents .inner h3{
	margin:80px auto;
	text-align:center;
	font-size:2.2em;
	line-height:1.6em;
	letter-spacing:0.1em;
	border-bottom:3px solid #ff5e27;
	padding:5px;
	width:96%;
}
#contents .inner h4{
	margin:20px auto 0px;
	font-size:2.0em;
	line-height:1.6em;
	letter-spacing:0.1em;
	width:96%;
}
#contents .flex{
	display:flex;
	flex-wrap:no-wrap;
}

#contents p{
	padding:12px 10px;
	font-size:1.5em;
	line-height:1.8em;
	width:96%;
	margin:10px auto;
	}


#contents table {
	width:90%;
	margin:30px auto 50px;
	}
#contents table th{
	padding:12px 15px;
	font-size:1.3em;
	border-bottom:1px solid #ff5e27;
	line-height:1.8em;
	white-space:nowrap;
	vertical-align:top;
	text-align:left;
	}
#contents table td{
	padding:12px 10px;
	font-size:1.4em;
	line-height:1.8em;
	border-bottom:1px solid #e5e3d9;
	}
#contents table td ul li{
	background:url(../img/common/li_orange.png) 5px 50% no-repeat;
	padding-left:18px;
	}


@media screen and (max-width:580px) { 
#contents .inner{
	padding:20px 10px;
	}
br.spbr{
	display:none;
}

	
#contents .inner h2{
	margin:30px auto;
	text-align:left;
	font-size:1.8em;
	line-height:1.6em;
	letter-spacing:0.1em;
}
#contents .inner h3{
	margin:30px auto;
	text-align:center;
	font-size:1.8em;
	line-height:1.6em;
	letter-spacing:0.1em;
	border-bottom:3px solid #ff5e27;
	padding:5px;
	width:96%;
}
#contents .inner h4{
	font-size:1.6em;
}

#contents p{
	font-size:1.3em;
	width:96%;
	margin:10px 2%;
	}
#contents table {
	width:96%;
	margin:20px auto 30px;
	}
#contents table th{
	width:100%;
    display: block;
	text-align:left;
	background:#f3f3f3;
	}
#contents table td{
	width:100%;
	border-top:none;
    display: block;
	}
}

/*----------------------------------------------------
Greeting
----------------------------------------------------*/

.greetingback{
	background:url(../img/greeting/greeting_back.png) center bottom no-repeat;
	background-size:cover;
}
.greeting .mesblock{
	margin:50px auto 300px;
}
.greeting .message{
	font-size:1.8em;
	max-width:800px;
	text-align:center;
	margin:20px auto;
	font-weight:bold;
	line-height:2em;
	letter-spacing:0.1em;
}

@media screen and (max-width:779px) { 
.greeting .message{
	font-size:1.6em;
	text-align:center;
	margin:20px auto;
	font-weight:bold;
	line-height:2em;
	letter-spacing:0.05em;
}
}

@media screen and (max-width:580px) { 
.greeting .mesblock{
	margin:30px auto 200px;
}
.greeting .message{
	font-size:1.5em;
	text-align:left;
	margin:20px 10px;
	font-weight:bold;
	line-height:2em;
	letter-spacing:0.01em;
}
}

.company .map{
	width:90%;
	border:1px solid #ccc;
	margin:0 auto;
}

@media screen and (max-width:580px) { 
.company .map{
	width:96%;
	border:1px solid #ccc;
	margin:0 auto;
}
}


/*----------------------------------------------------
kyushoku
----------------------------------------------------*/
.kyushoku .kyushokuico{
	background:#f4f2ea;
	padding:10px;
	width:100%;
	text-align:center;
	margin:0 auto 20px;
	}
.kyushoku .kyushokuico .flex{
	margin:0 auto;
	max-width:1000px;
	justify-content:space-around;
	}
.kyushoku .kyushokuico .flex div{
	padding:10px;
	}

.kyushoku h3{
	font-size:2.2em;
	line-height:1.6em;
	margin:20px;
	}
.kyushoku .flexl{
	display:flex;
	max-width:1200px;
	margin:0 auto;
	}
.kyushoku .flexr{
	display:flex;
	flex-direction:row-reverse;
	max-width:1200px;
	margin:0 auto;
	}
.kyushoku .kyushoku_pic{
	width:50%;
	}
.kyushoku .kyushokutxt01{
	background:url("../img/kyushoku/kyushoku01.png") center center no-repeat;
	padding:30px 20px;
	width:50%;
	}
.kyushoku .kyushokutxt02{
	background:url("../img/kyushoku/kyushoku02.png") center center no-repeat;
	padding:30px 20px;
	width:50%;
	}
.kyushoku .kyushokutxt03{
	background:url("../img/kyushoku/kyushoku03.png") center center no-repeat;
	padding:30px 20px;
	width:50%;
	}
.kyushoku .kyushokutxt04{
	background:url("../img/kyushoku/kyushoku04.png") center center no-repeat;
	padding:30px 20px;
	width:50%;
	}

@media screen and (max-width:780px) { 
.kyushoku .flexl{
	display:flex;
	flex-direction:column;
	}
.kyushoku .flexr{
	display:flex;
	flex-direction:column;
	}
.kyushoku .kyushoku_pic{
	width:100%;
	text-align:center;
	}
.kyushoku .kyushokutxt01{
	width:100%;
	}
.kyushoku .kyushokutxt02{
	width:100%;
	}
.kyushoku .kyushokutxt03{
	width:100%;
	}
.kyushoku .kyushokutxt04{
	width:100%;
	}
	}

@media screen and (max-width:580px) { 
.kyushoku .kyushokuico .flex{
	flex-wrap:wrap; 
	}
.kyushoku .kyushokuico .flex div{
	width:50%;
	}
}
/*----------------------------------------------------
Kojin
----------------------------------------------------*/

.kojin .kojincatch{
	font-size:2.2em;
	font-weight:bold;
	line-height:1.8em;
	text-align:center;
	background:url(../img/kojin/kojin_catch_b.png) center center no-repeat;
	padding:50px 10px;
}

.kojin .waku{
	background:#f4f2ea;
	padding:20px;
	width:90%;
	margin:10px auto;
}
.kojin .waku ul li{
	font-size:1.5em;
	line-height:1.8em;
	font-weight:bold;
	padding:5px 0;
}
.kojin .waku ul li a{
	color:#333;
}
.kojin .waku ul li a:hover{
	color:#F53538;
}
.kojin .waku ul li a:before{
	content:url(../img/kojin/kojin_yaji.png);
	margin:5px 10px;
}
.kojin ol {
	margin:10px auto;
	width:90%;
}
.kojin ol li{
	font-size:1.5em;
	line-height:1.8em;
	margin:10px auto;
	padding:5px 0;
	list-style:none;
}
.kojin ol li:nth-child(1){
	background:url(../img/kojin/kojin1.png) left 5px no-repeat;
	padding-left:40px;
}
.kojin ol li:nth-child(2){
	background:url(../img/kojin/kojin2.png) left 5px no-repeat;
	padding-left:40px;
}
.kojin ol li:nth-child(3){
	background:url(../img/kojin/kojin3.png) left 5px no-repeat;
	padding-left:40px;
}
.kojin ol li:nth-child(4){
	background:url(../img/kojin/kojin4.png) left 5px no-repeat;
	padding-left:40px;
}

@media screen and (max-width:780px) { 
.kojin .kojincatch{
	font-size:2.0em;
}
}
@media screen and (max-width:580px) { 
.kojin .kojincatch{
	font-size:1.6em;
}
}

.saiyocontact{
	background:#ff5e27;
	width:90%;
	margin:0 auto 30px;
	color:#FFFFFF;
	display:flex;
  justify-content: center;
  align-items: center;
}
.saiyocontact div{
	width:70px;
}
.renrakusaki{
	text-align:center;
	flex:1;
}
.renrakusaki span.title{
	font-size:1.6em;
	margin-bottom:15px;
	display:block;
}
.renrakusaki span.num{
	font-size:2.2em;
}
.renrakusaki span.tantou{
	font-size:1.4em;
}
@media screen and (max-width:580px) { 

.renrakusaki span.title{
	font-size:1.3em;
	margin-bottom:15px;
	display:block;
}
.renrakusaki span.num{
	font-size:2em;
	display:block;
}
.renrakusaki span.tantou{
	font-size:1.3em;
	display:block;
}
}
.pagetop{
	position:fixed;
	bottom:70px;
	right:30px;
}

/*----------------------------------------------------
Footer
----------------------------------------------------*/

#globalFooter{
	padding:15px 10px;
	border-top:3px solid #ff5e27;
}
#globalFooter .inner{
	max-width:1200px;
	text-align:center;
	margin:0 auto;
	overflow:hidden;
}
#globalFooter .inner .fleft{
	float:left;
	width:60%;
	text-align:left;
	font-size:1.3em;
	line-height:1.6em;
}
#globalFooter .inner .fleft .flogo{
	float:left;
	margin-right:10px;
}
#globalFooter .inner .fleft strong{
	font-size:1.1em;
}
#globalFooter .inner .fright{
	float:right;
	text-align:right;
	font-size:1.2em;
	line-height:1.5em;
	width:40%;
}

@media screen and (max-width: 959px){
	#globalFooter{
		margin-bottom:40px;
	}
	
}
@media screen and (max-width:779px) { 
#globalFooter .inner .fleft{
	float:none;
	width:100%;
}
#globalFooter .inner .fright{
	clear:both;
	background:#f4f2ea;
	padding:5px;
	float:none;
	width:100%;
	text-align:center;
}
}
@media screen and (max-width:580px) { 
#globalFooter .inner .fleft .flogo{
	float:none;
	margin-right:auto;
	text-align:center;
}
}
@media screen and (max-width: 490px){
	#globalFooter{
		margin-bottom:100px;
	}
	
}