@charset "utf-8";
* { font-family:"メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Sans-Serif; }

html { font-size:14px; height:100%; }
body { color: #333; line-height:1.7; background: url(../img/bg.jpg) no-repeat center top; background-size: contain; }
body#top{ background-image: url(../img/top/bg.jpg); background-size: cover; }

body, h1, h2, h3, h4, dl, dd, ul, form, textarea, figure { margin:0; padding:0; font-size:100%; }

img, input[type="image"] { font-size:0; line-height:0; vertical-align:bottom; }
ul { list-style-type:none; }
fieldset { border:none; }
strong { font-size:1.1em; margin: 0 2px; }
em { font-style:normal; font-weight:bold; }
label { display:inline-block; }
/*table { border-collapse:collapse; border-spacing:0; }*/

article, aside, dialog, figure, footer, header, hgroup, nav, section { display:block; }

/*回り込み解除clearfix*/
.clearfix:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }
.clearfix {display:inline-block;}
/* Hides from IE-mac \*/
* html .clearfix {height:1%;}
.clearfix {display:block;}
/* End hide from IE-mac */

/* 共通 ------------------------ */
a { color:#223791; }
a:active, a:hover { color:#223791; text-decoration: none; }
a img { border-width:0px; }

.left   { text-align:left; }
.center { text-align:center; }
.right  { text-align:right; }
.small  { font-size:0.85em; }
.big    { font-size:1.2em; }
.bold { font-weight:bold; }
.indent{ text-indent: -1em; padding-left: 1em; }
.attention{ color:#B20000; }
.clear { clear:both; }
.hide { display:none; }
.iblock { display:inline-block; }

ul.disc, ul.square { padding-left:1.3em; }
.disc li { list-style-type:disc; }
.decimal li{ list-style-type:decimal; }
.square li { list-style-type:square; }
.upper-alpha li { list-style-type:upper-alpha; }
ul.upper-alpha, ol { margin-left:1.5em; padding:0; }

img.middle { vertical-align:middle; }

.red { color:#ee4f85; }
.orange { color:#F75A0D; }

.fleft { float:left; }
.fright { float:right; }
.shadow { box-shadow: 0 0 6px rgba(0,0,0,0.2); }

input[type="radio"] { vertical-align:-1px; }
input[type="checkbox"] { vertical-align:middle; }

a, .anime {
	-ms-transition: all .5s;
	transition: all .5s;
}

#wrapper { margin: 0 auto; position: relative; min-width: 1000px; }
.inner{ width: 1000px; margin: 0 auto; }

/* header------------------------*/
header{ position: relative; width: 100%; min-height: 155px; margin-bottom: 30px;
	background: url(../img/bg_header_main.png) no-repeat center bottom; background-size: cover; }
header .inner{ position: relative; z-index: 1; }
header h1{ position: absolute; width: 400px; font-size: 0.9em; font-weight: normal; top: 45px; left: 0; color: #FFF; }
#top header h1{ color: #000; }
header .logo{ position: absolute; margin: 0 0 0 -98px; left: 50%; top: 0; }
header .h_nav{ position: absolute; width: 390px; top: 0; right: 0; overflow: hidden; }
header .h_nav p{ float: left; }
header .h_nav p.tel{ margin: 15px 0 0; }
header .h_nav p.contact{ margin: 30px 0 0; }

header .menu { display:none; }

/* gnav------------------------*/
#gnav { width: 100%; position: absolute; bottom: 0; left: 0; background-color: #059bdb; box-shadow: 0 0 6px rgba(0,0,0,0.4); }
#gnav ul{ width: 1000px; margin: 0 auto; }
#gnav li{ float: left; }
#gnav li.works{ margin-right: 140px; }
#gnav li a { display:block; height: 50px; overflow:hidden; position:relative; }
#gnav li img { display:block; left:0; position: absolute; }

#gnav li.home a{ width: 110px; } #gnav li.home a img{ left :0; }
#gnav li.service a{ width: 170px; } #gnav li.service a img{ left: -110px; }
#gnav li.works a{ width: 150px; } #gnav li.works a img{ left: -280px; }
#gnav li.future a{ width: 180px; } #gnav li.future a img	 { left: -570px; }
#gnav li.company a{ width: 130px; } #gnav li.company a img{ left: -750px; }
#gnav li.kamibungu a{ width: 120px; } #gnav li.kamibungu a img{ left:-880px; }

#gnav a:hover img, #gnav .current img { top: -50px; }

/* contents------------------------*/
.p_link{ display: block; width: 160px; text-align: center; padding: 6px 0; color: #FFF; text-decoration: none;
	background-color: #dd127b\9; background-color: rgba(221,18,123,0.7); 
	background-image: url(../img/arrow.png); background-repeat: no-repeat;  background-position: 8px 50%; }
.b_link{ display: block; width: 160px; text-align: center; padding: 6px 0; color: #FFF; text-decoration: none; background-color: rgba(0,114,191,0.8); 
	background-image: url(../img/arrow.png); background-repeat: no-repeat;  background-position: 8px 50%; }

.bline{ border: 1px solid #0072bf; }
.gline{ border: 1px solid #32CD32; }
.gline_01{ 
padding: 2em 1em;
background-color: #fff;
color: #606060;
box-shadow: 0 0 5px 1px #b2b2b2;
border-left:3px solid #339933;
border-radius: 0 50px 0 50px; }
.bline_01{ 
padding: 2em 1em;
background-color: #fff;
color: #606060;
box-shadow: 0 0 5px 1px #b2b2b2;
border-left:3px solid #0072bf;
border-radius: 0 50px 0 50px; }
.pline_01{ 
padding: 2em 1em;
background-color: #fff;
color: #606060;
box-shadow: 0 0 5px 1px #b2b2b2;
border-left:3px solid #FFB4B6;
border-radius: 0 50px 0 50px; }

/* footer------------------------*/

#pagetop { position:fixed; bottom: 0; right:35px; height:100px; margin:0; z-index: 400; }

footer{ padding: 150px 0 0; 
	background: url(../img/bg_footer.jpg) no-repeat center bottom; background-size: cover; }
footer a{ color: #111; }
footer .inner{ width: 870px; min-height: 380px; position: relative; }
.f_link{ overflow: hidden; margin-left: 30px; }
.f_link li{ float: left; margin-right: 50px; }
.f_link li:last-child{ margin-right: 0; }
.f_link li a{ display: block; padding-left: 15px; background: url(../img/list_c.png) no-repeat 0 50%; }
.f_logo{ position: absolute; bottom: 0; left: 0; }
.f_info{ position: absolute; bottom: 10px; left: 230px; width: 550px; }
.f_info ul{ overflow: hidden; margin: 0 -20px 50px 0; }
.f_info ul li{ float: left; margin-right: 20px; }
.f_info p{ margin: 0; }
.f_info p.copy_footer{ margin: 0 0 0 -15px; }
.address{ margin-left: 26px; }
.copyright{ font-size:0.85em; }

@media screen and (max-width: 999px) {
  
#wrapper { min-width:100%; }
.inner{ width:100%; padding:0 10px; box-sizing:border-box; }

.sp_hide { display:none; }

/* header------------------------*/
header { margin-bottom:0; }
header h1{ display:none; }
header .logo{ margin:0; left: 10px; width:20%; }
header .logo img { max-width:100%; }

header .h_nav{ right:auto; left:24%; }
header .h_nav p.tel{ margin:0; }
header .h_nav p.contact{ margin:15px 0 0; }

/* gnav------------------------*/

#gnav { display:none; top:80px; bottom:auto; width:100%; position:absolute; z-index:500; }
#gnav ul { padding:0; }
#gnav li { float:none; margin:0 auto; padding: 0 10px; border-bottom:solid 1px #fff; }
#gnav li:last-child { border-bottom:none; }

#gnav li a { display:block; height:auto; padding:10px 10px 10px 20px; font-weight:bold; text-align:left; color:#fff; text-decoration:none; }
#gnav li.home a, #gnav li.service a, #gnav li.works a,#gnav li.future a, #gnav li.company a, #gnav li.recruit a
{ width:100%; }
#gnav li a:after { content:""; position:absolute; top:18px; left:0; width: 4px; height: 4px;
border-top: 2px solid #fff; border-right: 2px solid #fff;
-webkit-transform: rotate(45deg); transform: rotate(45deg); }
header #gnav li a img { display:none; }/*pc打消し*/
header #gnav li a:before { content: attr(data-label); }

/* menuボタン */
header .menu { display:block; position:absolute; top:8px; right:15px; z-index:999; height:50px; background-color:rgba(255, 255, 255, 0.3); box-shadow:0 0 10px 15px rgba(255, 255, 255, 0.3); }
header .menu p { margin:0 auto 5px; font-size:90%; text-indent: -1px; text-align:center; color:#333; }
.sp-btn,
.sp-btn span { display: inline-block; transition: all .4s; -webkit-transition: all .4s; box-sizing: border-box; }
.sp-btn { display:block; position:absolute; top:20px; right:0; width: 35px; height: 25px; }
.sp-btn span { position: absolute; left: 0;	width: 100%; height: 3px;	background-color: #333; }
#home .sp-btn span { background:#777; }
.sp-btn.active span { background:#777; } 

.sp-btn span:nth-of-type(1) { top: 0; }
.sp-btn span:nth-of-type(2) { top: 11px; }
.sp-btn span:nth-of-type(3) { bottom: 0; }

.sp-btn.active span:nth-of-type(1) {
	-webkit-transform: translateY(11px) rotate(-45deg);
	transform: translateY(11px) rotate(-45deg);
}
.sp-btn.active span:nth-of-type(2) {
	opacity: 0;
}
.sp-btn.active span:nth-of-type(3) {
	-webkit-transform: translateY(-11px) rotate(45deg);
	transform: translateY(-12px) rotate(45deg);
}

/* footer------------------------*/
footer { padding-top:50px; }
footer .inner { width:100%; padding-bottom:150px; text-align:center; }

.f_link { display:inline-block; margin-left:10%; }
.f_link li { width:26%; margin-right:0%; margin-bottom:10px; }
.f_link li:not(:nth-child(3n+1)) { margin-left:10%; }
.f_link li a { text-align:left; }

.f_logo { left:50%; margin-left:-88px; }
.f_info { position:static; width:100%; margin:30px auto 10px; }
.f_info p.copy_footer { margin:0 auto; }
.f_info ul { display:inline-block; margin-right:0; }
.f_info ul li { margin-right:0; } .f_info ul li:first-child { padding-right:20px; }

.address { display:inline-block; margin:0 auto; }

/* pagetop------------------------ */
#pagetop { width:64px; height:68px; right:10px; }
#pagetop img { max-width:100%; margin-top:15px; }

}

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

#pan { display:none; }

/* header------------------------*/
header { min-height:80px; }
header .logo{ margin:0; width:85px; }
header .h_nav { width:auto; left:115px; }
header .h_nav p.tel{ display:none; }
header .h_nav p.contact { margin:10px 0 0; width:130px; }
header .h_nav p.contact img { max-width:100%; }

header .menu { top:0; right:10px; }

/* footer------------------------*/
footer { padding-top:30px; }
footer .inner { padding-bottom:100px; }

.f_link { display:inline-block; margin-left:5%; }
.f_link li { width:48%; }
.f_link li:not(:nth-child(3n+1)) { margin-left:0; }
.f_link li:not(:nth-child(2n+1)) { margin-left:4%; }

.f_logo { left:50%; margin-left:-18%; width:36%; } .f_logo img { max-width:100%; }
.f_info { margin-top:0; }
.f_info p.copy_footer { margin:0 auto 10px; font-weight:bold; }
.f_info ul { margin-bottom:10px; }
.f_info ul li { width:100%; margin-right:0; margin-bottom:15px; text-align:center; }
.f_info ul li:first-child { padding-right:0; }

.address { display:inline-block; margin:0 auto 20px; }

/* pagetop------------------------ */
#pagetop { width:56px; height:60px; right:5px; }

}