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

/*ALL
--------------------------------------------------*/
div,p,h1,h2,h3,h4,ul,li,dl,dt,dd,ol,table,th,td,form,input,fieldset,a,article,nav{
	margin:0;
	padding:0;
	/*-webkit-tap-highlight-color: rgba(0, 0, 0, 0);*/
	/*-webkit-touch-callout: none;*/
	box-sizing: border-box;
}
fieldset{
	border: none;
}
.wrapper{
	width: 100%;
	margin: 0 auto;
	box-sizing: border-box;
}
.clear{
	clear: both;
}
.clearfix{
	height: 1%;
	overflow: hidden;
}
.clearfix:after{
	content: "";
	display: block;
	clear: both;
}
a{
	color: #00afcc;
}
a img{
	border: none;
}
img{
	width: 100%;
	height: auto;
}
li{
	list-style: none;
}

/*LAYOUT共通
--------------------------------------------------*/
body{
	font-family: 'Lucida Grande','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3',Meiryo,メイリオ,sans-serif;
	line-height:1.4;
	text-align:center;
	margin:0;
	padding:0;
	font-size-adjust:100%;
}
body.active{
	overflow: hidden;
}
.wrapper{
	margin: 0 auto;
	box-sizing: border-box;
	background: #fff;
}
/*HEADER---------------------------*/
#header{
	position: relative;
}
#header .logo{
	padding: 25px 10px 10px 10px;
	text-align: center;
}
#header .logo a img{
	width: 240px;
}
#header .menu_area{
	background: #00afcc;
}
#header .main_nav .open_trg{
	position: fixed;
	right: 5px;
	top: 22px;
	width: 40px;
	z-index: 200;
}
#header .main_nav .open_trg img:nth-child(2){
	display: none;
}
#header .main_nav .open_trg.active img:nth-child(2){
	display: block;
}
#header .main_nav .open_trg.active img:nth-child(1){
	display: none;
}
#header .main_nav .list{
	overflow: hidden;
	height: 0;
	width: 0;
	position: fixed;
	top: 0;
	right: 0;
	z-index: 100;
	background: #fff;
	-webkit-transition:all 0.3s;
	-moz-transition:all 0.3s;
	-ms-transition:all 0.3s;
	-o-transition:all 0.3s;
	transition:all 0.3s;
	text-align: center;
}
#header .main_nav .list.active{
	width: 100%;
	height: 100vh;
}
#header .main_nav .list .wrp{
	margin: 5px;
	padding: 10px;
}
#header .main_nav .list ul{
	background: #fff;
}
#header .main_nav .list ul li{
	border-bottom: 1px #ccc dotted;
	margin: 10px 2px 10px 0;
}
#header .main_nav .list ul li:last-child{
	border: none;
}
#header .main_nav .list ul li a{
	position: relative;
	color: #00afcc;
	display: block;
	text-align: left;
	padding: 10px 10px 10px 41px;
	background-repeat: no-repeat;
	background-position: 12px 50%;
	background-size: 20px;
	text-decoration: none;
}
#header .main_nav .list ul li a:after{
	position: absolute;
	left: 2px;
	top: calc(50% - 11px);
	content: "";
	background: #00afcc;
	width: 3px;
	height: 22px;
}
#header .main_nav .list ul li.on a,
#header .main_nav .list ul li a:hover{
	color: #666;
	background-color: #fff;
}
#header .main_nav .list ul li a span{
	color: #ccc;
	font-weight: normal;
}
#header .main_nav .list ul li:nth-child(1) a{
	background-image: url(../images/icons/home_gray.png)
}
#header .main_nav .list ul li:nth-child(2) a{
	background-image: url(../images/icons/business_gray.png)
}
#header .main_nav .list ul li:nth-child(3) a{
	background-image: url(../images/icons/business2_gray.png)
}
#header .main_nav .list ul li:nth-child(4) a{
	background-image: url(../images/icons/man3_gray.png)
}
#header .main_nav .list ul li:nth-child(5) a{
	background-image: url(../images/icons/map_gray.png)
}
#header .main_nav .list ul li:nth-child(6) a{
	background-image: url(../images/icons/padlock_gray.png)
}
#header .main_nav .list ul li:nth-child(7) a{
	background-image: url(../images/icons/mail_gray.png)
}
#header .main_nav .list ul li:nth-child(8) a{
	background-image: url(../images/icons/sitemap_gray.png)
}
/*CONTENTS---------------------------*/
#main_image{
	line-height: 1;
	font-size: 0;
}
#contents .sect_title{
	color: #666;
	text-align: left;
	font-size: 15px;
	font-weight: normal;
	position: relative;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
#contents .sect_title:after{
	display: block;
	content: "";
	border-bottom: 2px #666 solid;
}
#contents .sect_title span{
	display: inline-block;
	font-weight: bold;
	color: #00afcc;
	padding: 10px 5px 0 36px;
	font-size: 24px;
	background-repeat: no-repeat;
	background-position: 10px 70%;
	background-size: 22px;
}
.banners li{
	padding: 5px 5px 0 0;
}
/*INDEX*/
#main_image ul li .topimage{
	position: relative;
}
#main_image ul li .topimage img:nth-child(2){
	position: absolute;
}
#main_image ul li .topimage img:nth-child(3){
    display: none;
	position: absolute;
}
#info .sect_title span{
	background-image: url(../images/icons/pencil_gray.png);
}
#info .wrp{
	margin: 5px;
	border: 1px #ccc solid;
}
#info .list{
	text-align: left;
}
#info .list li{
	padding: 5px;
}
#info .list li p{
	overflow: hidden;
	border-bottom: 1px #ccc dotted;
	padding: 5px;
	text-overflow: ellipsis;
	white-space: nowrap;
}
/*#info .list li:last-child p{
	border: none;
}*/
#info .list li p span{
	display: inline-block;
	font-size: 11px;
	color: #666;
	position: relative;
	margin-right: 1.4em;
}
#info .list li p span:after{
	content: "…";
	position: absolute;
	left: 100%;
	bottom: 0;
}
#index .flexwrp{
	display:-webkit-flex;
	display:-moz-flex;
	display:-ms-flex;
	display:-o-flex;
	display:flex;
	align-items:stretch;
    padding: 5px;
}
#index #info .flexwrp .wrp{
	width: 75%;
}
#index #info .flexwrp .banners{
	width: 25%;
}
/*COMPANY*/
#company_data .sect_title span{
	background-image: url(../images/icons/business_gray.png);
}
#company_data .data{
	text-align: left;
	padding: 10px;
	margin-bottom: 15px;
}
#company_data .data ul{
	border: 1px #ccc solid;
	padding: 2px;
}
#company_data .data li{
	display:-webkit-flex;
	display:-moz-flex;
	display:-ms-flex;
	display:-o-flex;
	display:flex;
	align-items:stretch;	
}
#company_data .data .th{
	background: #efefef;
	width: 98px;
	border-bottom: 1px #fff dotted;
	padding: 10px 5px;
}
#company_data .data .td{
	width: calc(100% - 98px);
	border-bottom: 1px #ccc dotted;
	padding: 10px 5px;
}
#access .sect_title span{
	background-image: url(../images/icons/map_gray.png);
}
#access .flexwrp{
	display:-webkit-flex;
	display:-moz-flex;
	display:-ms-flex;
	display:-o-flex;
	display:flex;
	align-items:stretch;
	padding: 5px;
}
#access .map{
	padding: 5px;
	margin-bottom: 10px;
}
/*BUSINESS*/
#business_data .sect_title span{
	background-image: url(../images/icons/map_gray.png);
}
#business_data .flexwrp{
	display:-webkit-flex;
	display:-moz-flex;
	display:-ms-flex;
	display:-o-flex;
	display:flex;
	align-items:stretch;
	padding: 5px;
}
#business_data .wrp{
	padding: 5px;
	margin-bottom: 10px;
}
#business_data .wrp .data{
	border: 1px #ccc solid;
	padding: 2px;
	text-align: left
}
#business_data .wrp .data li{
	border-bottom: 1px #ccc dotted;
	padding: 10px 5px;
}
#business_data .wrp .data li p{
	border-left: 3px #00afcc solid;
	padding-left: 5px;
}
#business_data .wrp .data li:last-child{
	border: none;
	padding: 5px;
}
/*RECRUIT*/
#requirements_list .sect_title span{
	background-image: url(../images/icons/man3_gray.png);
}
#requirements_list .data{
	text-align: left;
	padding: 10px;
	margin-bottom: 15px;
}
#requirements_list .data ul{
	border: 1px #ccc solid;
	padding: 2px;
}
#requirements_list .data li{
	display:-webkit-flex;
	display:-moz-flex;
	display:-ms-flex;
	display:-o-flex;
	display:flex;
	align-items:stretch;	
}
#requirements_list .data .th{
	background: #efefef;
	width: 98px;
	border-bottom: 1px #fff dotted;
	padding: 10px 5px;
}
#requirements_list .data .td{
	width: calc(100% - 98px);
	border-bottom: 1px #ccc dotted;
	padding: 10px 5px;
}
#requirements_list .data .td p{
	margin-bottom: 10px;
}
/*PRIVACY*/
#policy_list .sect_title span{
	background-image: url(../images/icons/padlock_gray.png);
}
#policy_list .data{
	text-align: left;
	padding: 10px;
	margin-bottom: 15px;
}
#policy_list .data ul{
	border: 1px #ccc solid;
	padding: 5px;
}
#policy_list .data .title{
	padding: 10px 5px 0 5px;
	color: #00afcc;
	border-bottom: 1px #00afcc solid;
	margin-bottom:10px;
}
#policy_list .data .text{
	text-indent:1em;
	margin-left:-1em;
	padding: 10px 10px 10px 20px;
	line-height: 1.6;
}
#policy_list .data .text li{
	text-indent:-2em;
	margin-left:2em;
}
#policy_list .data .td p{
	margin-bottom: 10px;
}

/*SITEMAP*/
#page_list .sect_title span{
	background-image: url(../images/icons/sitemap_gray.png);
}
#page_list .data{
	text-align: left;
	padding: 10px;
	margin-bottom: 15px;
}
#page_list .data ul{
	border: 1px #ccc solid;
	padding: 5px;
}
#page_list .data li{
	padding: 10px 5px;
	
}
#page_list .data li a{
	display: block;
	text-decoration: none;
	border-bottom: 1px #00afcc solid;
	color: #666;
	font-size: 12px;
	position: relative;
}
#page_list .data li a:after{
	left: calc(100% - 15px);;
	top: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(0, 117, 193, 0);
	border-left-color: #00afcc;
	border-width: 5px;
	margin-top: -8px;
}
#page_list .data li a span{
	display: inline-block;
	box-sizing: border-box;
	width: 140px;
	padding: 3px 10px;
	color: #fff;
	background: #00afcc;
	font-size: 15px;
	margin-right: 10px;
}
/*CONTACT*/
#form_box .sect_title span{
	background-image: url(../images/icons/mail_gray.png);
}
#contact form input[type="text"],
#contact form textarea{
	box-sizing: border-box;
	font-family:'Lucida Grande','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3',Meiryo,メイリオ,sans-serif;
	padding:8px 10px;
	line-height:1;
	width:100%;
	font-size:14px;
	height: 31px;
}
#contact #form .button{
	padding: 20px 0;
	text-align: center;
}
#contact #form input[type="submit"],
#contact #form input[type="reset"],
#contact #form input[type="button"],
#contact #form .conf_box .button a{
	font-family: 'Lucida Grande','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3',Meiryo,メイリオ,sans-serif;
	box-sizing: border-box;
	display: inline-block;
	color: #fff;
	border: none;
	height: 40px;
	padding: 0 15px;
	width: auto;
	min-width: 110px;
	margin: 10px 5px;
	font-size: 15px;
	cursor: pointer;
	background-color: #666;
	text-decoration: none;
	vertical-align: middle;
}
#contact #form .conf_box .button a{
	padding-top: 10px;
}
#contact #form .conf_box .button a,
#contact #form input[type="submit"],
#contact #form input[type="button"]{
	background-color: #00afcc;
}
#contact #form{
	padding: 10px 5px;
}
#contact #form .wrp p{
	display:-webkit-flex;
	display:-moz-flex;
	display:-ms-flex;
	display:-o-flex;
	display:flex;
	align-items:stretch;
	padding: 5px 5px 10px 5px;
	border-bottom: 1px #ccc dotted;
	margin-bottom: 5px;
	
}
#contact #form .wrp p span{
	display: inline-block;
	text-align: left;
	display:-webkit-flex;
	display:-moz-flex;
	display:-ms-flex;
	display:-o-flex;
	display:flex;
	align-items: center;
}
#contact #form .wrp p span:nth-child(1){
	width: 30%;
	border-left: 3px #00afcc solid;
	padding-left: 10px;
}
#contact #form .wrp p span:nth-child(2){
	width: 70%;
}
#contact #form .wrp p b{
	font-weight: normal;
	display: inline-block;
	margin-left: 5px;
	font-size: 11px;
	color: #ff0004;
}
#contact #form #inquiry{
	height: 120px;
}
#contact #form .title_s{
	font-size: 15px;
}
#contact #form .error_text{
	border: 1px #ff0004 dotted;
	text-align: left;
	padding: 10px;
	margin: 10px;
	color: #ff0004;
}
#contact #form .conf_title{
	font-size: 15px;
	border-bottom: 1px #00afcc solid;
}
#contact #form .conf_box{
	text-align: left;
	margin-top: 10px;
	padding: 0 10px;
}
#contact #form .conf_box p{
	margin-bottom: 10px;
}
/*FOOTER---------------------------*/
#footer{
	background: #efefef;
}
#footer .flexwrp{
	display:-webkit-flex;
	display:-moz-flex;
	display:-ms-flex;
	display:-o-flex;
	display:flex;
	justify-content: space-between;
	padding: 55px 10px 15px 10px;
}
#footer .wrapper{
	background: transparent;
}
#footer .company_item{
	text-align: left;
}
#footer .company_item img{
	width: 180px;
}
#footer .company_item p span{
	display: block;
}
#footer .menu_item{
	text-align: left;
}
#footer .menu_item.flexwrp{
	margin-top: 5px;
	justify-content: flex-end;
	padding: 0;
}
#footer .menu_item ul{
	display: inline-block;
	width: 120px;
}
#footer .menu_item li{
	margin-bottom: 10px;
}
#footer .menu_item a{
	color: #666;
	text-decoration: none;
}
#footer .copyright{
	color: #666;
	font-size: 11px;
	line-height: 1;
	padding: 20px 0 10px 0;
}
/*MEDIA QUERIES
--------------------------------------------------*/
/*smartphone*/
@media (max-width: 750px) {
	/*LAYOUT---------------------------*/
	body{
		font-size: 13px;
		min-width: 320px;
	}
    /*HEADER---------------------------*/
    #header .logo{
        text-align: left;
    }
	#header .main_nav .list ul li a{
		font-size: 15px;
		line-height: 1;
	}
	#header .main_nav .list ul li a span{
		display: block;
		font-size: 12px;
	}
	/*CONTENTS---------------------------*/
	#main_image{
		overflow: hidden;
	}
	#contents .banners ul li{
		float: left;
		width: 50%;
	}
	#contents .banners ul:after{
		content: "";
		display: block;
		clear: both;
	}
	/*INDEX*/
	#main_image ul li{
		text-align: center;
	}
	#main_image ul li .topimage img:nth-child(1){
		height: 90vw;
		width: auto;
	}
	#main_image ul li .topimage img:nth-child(2){
		display: none;
	}
	#main_image ul li .topimage img:nth-child(3){
		display: inline-block;
		height: auto;
		width: 100%;
		max-width: 589px;
		top: 0;
		left: 0;
		margin: 0 auto;
	}
	#index .flexwrp{
		display: block;
	}
	#index #info .flexwrp .wrp{
		width: calc(100% - 20px);
		margin: 5px 10px 0 10px;
	}
	#index #info .flexwrp .wrp li:last-child p{
		border: none;
	}
	#index #info .flexwrp .banners{
		width: 100%;
	}
	#index #info .banners ul{
		padding: 10px 5px;
	}
	/*COMPANY*/
	#company #access .flexwrp{
		display: block;
	}
	#company #access .map iframe{
		height: 60vw;
	}
	/*BUSINESS*/
	#business_data .flexwrp{
		display: block;
	}
	/*CONTACT*/
	#contact #form .wrp p{
		display: block;
	}
	#contact #form .wrp p span:nth-child(1){
		width: 100%;
		margin-bottom: 5px;
	}
	#contact #form .wrp p span:nth-child(2){
		width: 100%;
	}
	/*FOOTER---------------------------*/
    #footer .flexwrp{
        justify-content: center;
        padding: 25px 10px 15px 10px;
    }
    #footer .company_item{
        text-align: center;
    }
	#footer .menu_item{
		display: none;
	}
}
/*tablet*/
@media (min-width: 751px) and (max-width: 979px) {
	/*LAYOUT---------------------------*/
	body{
		font-size: 12px;
		min-width: 751px;
	}
	/*HEADER---------------------------*/
	#header .main_nav .list ul li a{
		font-size: 16px;
		line-height: 1;
	}
	#header .main_nav .list ul li a span{
		display: inline-block;
		font-size: 12px;
		margin-left: 5px;
	}
	/*CONTENTS---------------------------*/
	/*INDEX*/
	#main_image ul li .topimage img:nth-child(1){
		height: auto;
		width: 100vw;
	}
	#main_image ul li .topimage img:nth-child(2){
		height: auto;
		width: 100%;
		top: 0;
		left: 0;
	}
	/*COMPANY*/
	#company #access .flexwrp .map{
		width: 75%;
	}
	#company #access .map iframe{
		height: 48vw;
	}
	#company #access .flexwrp .banners{
		width: 25%;
	}
	#company #access .flexwrp .banners ul li{
		width: 100%;
	}
	/*BUSINESS*/
	 #business_data .flexwrp .wrp{
		width: 75%;
	}
	#business_data .flexwrp .banners{
		width: 25%;
	}
	#business_data .flexwrp .banners ul li{
		width: 100%;
	}
	/*FOOTER---------------------------*/
}
/*PC*/
@media (min-width: 980px) {
	/*LAYOUT---------------------------*/
	body{
		font-size: 12px;
		min-width: 980px;
		background: #fff;
	}
	body.active{
		overflow: auto;
	}
	.wrapper{
		width: 980px;
	}
    /*HEADER---------------------------*/
	#header .main_nav .open_trg{
		display: none;
	}
	#header .main_nav .list,
	#header .main_nav .list.active{
		position: relative;
		height: auto;
		width: 980px;
	}
	#header .main_nav .list .wrp{
		margin: 0;
		padding: 0;
		position: relative;
	}
	#header .main_nav .list{
		background: #00afcc;
	}
	#header .main_nav .list ul{
		display:-webkit-flex;
		display:-moz-flex;
		display:-ms-flex;
		display:-o-flex;
		display:flex;
		align-items:stretch;
		background: transparent;
		margin-top: 2px;
	}
	#header .main_nav .list ul li{
		display: inline-block;
		border: none;
		margin: 0 2px 0 0;
	}
	#header .main_nav .list ul li.on{
		background-color: #fff;
	}
	#header .main_nav .list ul li a:hover,
	#header .main_nav .list ul li.on a{
		position: relative;
	}
	#header .main_nav .list ul li a:hover{
		
	}
	#header .main_nav .list ul li a{
		color: #fff;
		font-size: 13px;
        font-weight: bold;
		line-height: 1;
		border-left: none;
		border-bottom: 2px #00afcc solid;
		background-position: 9px 45%;
		background-size: 22px;
		padding: 12px 10px 10px 35px
	}
	#header .main_nav .list ul li a:after{
		display: none;
	}
    #header .main_nav .list ul li.on a,
    #header .main_nav .list ul li a:hover{
        color: #00afcc;
	}
	#header .main_nav .list ul li a span{
		display: block;
		font-size: 10px;
		margin-left: 2px;
	}
	/*CONTENTS---------------------------*/
	/*INDEX*/
	#main_image ul li .topimage img:nth-child(1){
		height: auto;
		width: 980px;
	}
	#main_image ul li .topimage img:nth-child(2){
		width: 100%;
		height: auto;
		top: 0;
		left: 0;
	}
    #index #info .flexwrp{
		padding: 5px 5px 15px 5px;
	}
	#index #info .flexwrp .wrp{
		width: calc(100% - 195px)
	}
	#index #info .flexwrp .banners{
		width: 195px;
	}
	#index #info .flexwrp .banners ul li{
		width: 100%;
	}
	/*COMPANY*/
	#company #access .flexwrp .map{
		width: 780px;
	}
	#company #access .map iframe{
		height: 385px;
	}
	#company #access .flexwrp .banners{
		width: 195px;
	}
	#company #access .flexwrp .banners ul li{
		width: 100%;
	}
	/*BUSINESS*/
	#business_data .flexwrp .wrp{
		width: 780px;
	}
	#business_data .flexwrp .banners{
		width: 195px;
	}
	#business_data .flexwrp .banners ul li{
		width: 100%;
	}
	#business_data .imgbox{
		margin-top: 15px;
	}
	/*FOOTER---------------------------*/
}