html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
table, th, td {
border: 0 none;
font-size: 1.0em;
vertical-align: top;
}
ul {
list-style: none;
}
/* ClearFix
------------------------------------------*/
footer, header, #header, nav, .snav, article, .clearfix {
zoom: 1;
}
footer:after, header:after, #header:after, nav:after, .snav:after, article:after, .clearfix:after {
content: "";
display: block;
clear: both;
}
.clear {
clear: both;
}
/* 基本
------------------------------------------*/

html {
-webkit-font-smoothing: antialiased;
}
body {
margin: 0;
color: #333;
font: normal normal 400 100%/170% "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
a {
font-size: 100%;
margin: 0;
padding: 0;
}
a:link, a:visited, a:hover, a:focus, a:active {
text-decoration: none;
color: rgb(0,48,85);
}
a:hover, a:focus {
text-decoration: none;
color: rgb(0,153,204);
}
figure img {
display: block;
}
img {
max-width: 100%;
height: auto;
width: auto\9; /* ie8 */
}
a:hover img {
cursor: pointer;
filter: alpha(opacity=60);        /* ie lt 8 */
-ms-filter: "alpha(opacity=60)";  /* ie 8 */
-moz-opacity: 0.6;                 /* FF lt 1.5, Netscape */
-khtml-opacity: 0.6;              /* Safari 1.x */
opacity: 0.6;
zoom: 1;
}

/* ヘッダー
------------------------------------------*/
   
header {
margin: 0 auto 3px;
width: 98%;
padding: 10px 1% 7px;
border-top: 5px solid #03508C;
border-bottom: 1px solid #03508C;
}
header div#header {
margin: 0 auto;
width: 100%;
max-width: 980px;
position: relative;
}
header #logo {
/*width: 17.55102040%;-*/
float: left;
}
/* グローバルナビ
------------------------------------------*/
body{
	position:relative;
}
nav.slimmenu {
	visibility:hidden;
position:absolute;
}
nav#gnav {
padding: 0 1%;
margin: 0 auto 7px;
width: 98%;
max-width: 980px;
height: 39px;
}
nav#gnav a {
display: block;
text-align: center;
float: left;
height: 39px;
margin-right: 1.0204816326531%;
text-indent: 100%;
white-space: nowrap;
overflow: hidden;
}
nav#gnav a.company:hover, nav#gnav a.engineering:hover, nav#gnav a.general:hover, nav#gnav a.recruit:hover, 
body#company nav#gnav a.company, body#engineering nav#gnav a.engineering, body#general nav#gnav a.general, body#recruit nav#gnav a.recruit {
background-position: center -39px;
}
nav#gnav a.company {
background: url(/images/gnav_01.gif) no-repeat center 0;
width: 17.4489795918367%;
}
nav#gnav a.engineering {
background: url(/images/gnav_02.gif) no-repeat center 0;
width: 19.3877551020408%;
}
nav#gnav a.general {
background: url(/images/gnav_03.gif) no-repeat center 0;
width: 42.65306122448988%;
}
nav#gnav a.recruit {
background: url(/images/gnav_04.gif) no-repeat center 0;
width: 17.4489795918367%;
margin-right: 0;
}
nav img {
}
nav li:first-child a {
margin-left: 0;
}
nav li:last-child a {
margin-right: 0;
}
nav#snav {
float: right;
text-align: right;
position: absolute;
bottom: 0;
right: 0;
}
nav#snav a {
background: url(/images/icon_link.png) no-repeat left 50%;
padding-left: 10px;
margin-left: 10px;
}
nav#pnav a {
background: url(/images/icon_plink.png) no-repeat left 50%;
padding-left: 25px;
margin-right: 4.25531%;
display:inline-block;
}



/* トップページメインパネル
------------------------------------------*/
article#company {
width: 100%;
height: 349px;
background: url(/images/company_bg.jpg) no-repeat center bottom;
border-bottom: 5px solid #03508C;
margin-bottom: 20px;
}
article#company h2 {
padding: 38px 25px;
}
article#company p {
text-align: right;
padding: 75px 20px 20px;
}
article#engineering {
width: 48.9795918367347%;
height: 195px;
background: url(/images/engineering_bg.jpg) no-repeat center 0;
border-bottom: 5px solid #03508C;
float: left;
margin-bottom: 20px;
}
article#engineering h2, article#general h2, article#recruit h2 {
padding: 38px 0 0;
text-align: center;
}
article#inquiry h2 {
padding: 38px 0 28px;
text-align: center;
}
article#company h2 span, article#company p span, article#engineering h2 span, article#general h2 span, article#inquiry h2 span, article#recruit h2 span, article#connection h2 span {
display: none;
}
article#engineering div {
width: 42.71%;
padding: 48px 0 0 7%;
float: left;
}
article#general {
width: 48.9%;
height: 195px;
background: url(/images/general_bg.jpg) no-repeat center 0;
border-bottom: 5px solid #03508C;
float: right;
margin-bottom: 20px;
}
article#inquiry {
width: 48.9795918367347%;
min-height: 195px;
border-bottom: 5px solid #03508C;
float: left;
margin-bottom: 20px;
}
article#inquiry p {
font-size: 190%;
font-weight: bold;
text-align: center;
line-height: 150%;
}
article#inquiry p a.tel {
display: none;
}
article#recruit {
width: 48.9795918367347%;
height: 195px;
background: url(/images/recruit_bg.jpg) no-repeat center 0;
border-bottom: 5px solid #03508C;
float: right;
margin-bottom: 20px;
}
article#connection {
width: 99.8%;
height: 90px;
border: 1px solid #CCC;
margin-bottom: 20px;
}
article#connection h2 {
display: table-cell;
vertical-align: middle;
padding-left: 25px;
height: 90px;
width: 17%;
}
article#connection p {
display: table-cell;
vertical-align: middle;
padding: 0 10px;
height: 90px;
}
article#connection p.fb {
text-align: right;
padding-right: 25px;
width: 29%;
}
/* コンテンツ
------------------------------------------*/
#home section#main {
margin: 0 auto;
width: 98%;
max-width: 980px;
padding: 0 1%;
}
section#main {
margin: 0 auto;
width: 96%;
max-width: 940px;
padding: 0 2%;
}
#home p,
#home div {
margin: 0;
}

/* フッター
------------------------------------------*/
footer#copyright {
border-top: 1px solid #03508C;
width: 96%;
padding: 15px 2%;
text-align: center;
font-size: 90%;
}
footer#pagetop {
margin: 0 auto;
width: 100%;
height: 24px;
max-width: 960px;
padding: 30px 0;
text-align: right;
text-decoration: underline;
}


/* スマートフォン用640px
------------------------------------------*/

@media only screen and (max-width: 640px) {
body {
-webkit-text-size-adjust: none;
font-size:95%;
}
header {
width: 94%;
max-width: 640px;
margin: 0;
padding: 10px 3% 0;
border-top: 5px solid #03508C;
}
header div#header {
margin: 0 auto;
width: 100%;
max-width: 640px;
position: relative;
}
#logo h1{
	width:70%;
}
nav#gnav {
display: none;
}
nav.slimmenu{
visibility: visible;
position: absolute;
top: 36px;
width: 100%;
z-index: 999;
left: -1px;
}
nav.slimmenu a {
	background-color: #FFF;
display: block;
text-align: center;
float: none;
margin-right: 0;
text-indent: 0;
white-space: nowrap;
overflow: hidden;
border-top: 1px solid #03508C;
border-bottom: 2px solid #03508C;
padding:5px;
font-size:80%;
}
body#company nav.slimmenu a.company, body#engineering nav.slimmenu a.engineering, body#general nav.slimmenu a.general, body#recruit nav.slimmenu a.recruit{
background-color:#DAEFFF;
}
nav.slimmenu a.snav {
	font-size:80%;
}
nav.slimmenu a:hover, nav.slimmenu a:focus{
background-color:#DAEFFF;
}
nav#snav {
display:none;
}

/* トップコンテンツ
------------------------------------------*/
#home section#main {
width: 100%;
padding: 0;
}
article#company {
width: 100%;
height: auto;
background: url(/images/company_bg02.jpg) no-repeat center bottom;
border-bottom: 5px solid #03508C;
margin-bottom: 0;
}
article#company a {
width: 100%;
display: block;
}
article#company h2 {
padding: 15px;
max-width: 462px;
}
article#company p {
text-align: right;
padding: 10px 20px 20px;
}
article#engineering {
background: url(/images/engineering_bg.jpg) no-repeat right 0;
background-size:contain;
}
article#general {
background: url(/images/general_bg.jpg) no-repeat right 0;
background-size:contain;
}
article#recruit {
background: url(/images/recruit_bg.jpg) no-repeat right 0;
background-size:contain;
}
article#engineering, article#general, article#inquiry, article#recruit {
width: 100%;
height: 90px;
border-bottom: 5px solid #03508C;
float: none;
margin-bottom: 0;
}
article#inquiry {
min-height: 90px;
}
article#engineering a, article#general a, article#recruit a {
width: 96%;
height: 90px;
display: block;
padding-left: 4%;
}
article#engineering h2, article#general h2, article#inquiry h2, article#recruit h2, article#connection h2 {
padding: 0;
text-align: left;
font-size: 180%;
font-weight: bold;
line-height: 130%;
}
article#inquiry h2 {
height: 90px;
width: 30%;
padding-left: 4%;
float: left;
}
article#inquiry p span {
display: none;
}
article#inquiry p a.tel {
display: inline;
}
article#company h2 span, article#company p span {
display: block;
font-size: 140%;
font-weight: bold;
color: rgb(255,255,255);
text-shadow: 3px 3px 3px #43586E;
line-height: 130%;
}
article#company p a:hover span, article#company p a:focus span {
text-decoration: none;
color: rgb(0,153,204);
}
article#engineering h2 span, article#general h2 span, article#inquiry h2 span, article#recruit h2 span, article#connection h2 span {
height: 90px;
display: table-cell;
vertical-align: middle;
white-space:nowrap;
}
article#company h2 img, article#company p img, article#engineering h2 img, article#general h2 img, article#inquiry h2 img, article#recruit h2 img, article#connection h2 img {
display: none;
}
article#engineering div {
display: none;
}
article#inquiry p {
height: 90px;
font-size: 140%;
font-weight: bold;
text-align: left;
padding-left: 25px;
height: 90px;
display: table-cell;
vertical-align: middle;
}
article#inquiry p {
}
article#connection {
width: 92%;
height: auto;
border: 1px solid #CCC;
margin: 10px auto;
}
article#connection h2 {
display: table-cell;
vertical-align: middle;
padding-left: 4%;
}
article#connection p {
display: table-cell;
vertical-align: middle;
padding: 0 0 0 4%;
height: 20px;
width: 73%;
font-size: 120%;
}
article#connection p.fb {
display: block;
text-align: center;
width: 100%;
height: 53px;
padding: 0 0 20px;
}
}
@media only screen and (max-width: 480px) {
body {
-webkit-text-size-adjust: none;
}
article#engineering h2, article#general h2, article#inquiry h2, article#recruit h2, article#connection h2 {
padding: 0;
text-align: left;
font-size: 150%;
font-weight: bold;
line-height: 130%;
white-space:nowrap;
}
article#company h2 span {
display: block;
font-size: 120%;
font-weight: bold;
color: rgb(255,255,255);
text-shadow: 3px 3px 3px #43586E;
line-height: 130%;
}
article#inquiry p {
height: 90px;
font-size: 100%;
font-weight: bold;
text-align: left;
padding-left: 25px;
height: 90px;
display: table-cell;
vertical-align: middle;
}
article#inquiry h2, article#connection h2 {
padding-left: 4%;
}
article#connection p {
font-size: 90%;
line-height: 120%;
padding: 0 0 0 8%;
}
footer {
font-size: 80%;
}
}
/* コンテンツ
------------------------------------------*/
ol{margin-left:1em;padding-left:1em;}

.h2-container {
width: 100%;
border: 1px solid #D7D7D7;
margin: 20px 0;
padding: 13px 0 2px;
background: #F1F4F5;
background: -webkit-gradient(linear, 0 0, 0 bottom, from(#FFFFFF), to(#C9D8DD));
background: -webkit-linear-gradient(#FFFFFF, #C9D8DD);
background: -moz-linear-gradient(#FFFFFF, #C9D8DD);
background: -ms-linear-gradient(#FFFFFF, #C9D8DD);
background: -o-linear-gradient(#FFFFFF, #C9D8DD);
background: linear-gradient(#FFFFFF, #C9D8DD);
}
.h2-container h2 {
padding-bottom: 10px;
border-bottom: 2px solid #002F55;
background: url(/images/icon_h2.gif) no-repeat 20px 0;
padding-left: 58px;
font-size: 130%;
font-weight: bold;
}
p,div.list {
margin: 0 2% 1em;
}
h3 {
font-size: 120%;
border-left: 7px solid #01518B;
font-weight: bold;
padding-left: 10px;
margin: 0 2% 20px;
clear:both;
}
h4 {
font-weight: bold;
font-size: 100%;
padding-left: 10px;
margin: 0 3% 10px;
}
h4:before {
content: "● ";
color: #00518B;
}
ul {
margin: 0 7% 20px;
list-style-image: url(/images/icon_list.png);
}
table {
margin: 0 2%;
width: 95.7446%;
}
table tr th {
padding: 10px 2%;
width:16%;
background: #E3E6E8;
border-top: 1px solid #D4D4D4;
text-align: center;
valign: top;
white-space:nowrap;
}
table tr.president_s {
display:none;
}
@media only screen and (max-width: 480px) {
table tr.president{
display:none;
}
table tr.president_s {
display:table-row;
}
table tr.president_s th {
padding: 10px 2%;
width:16%;
background: #E3E6E8;
border-top: 1px solid #D4D4D4;
text-align: center;
valign: top;
white-space:nowrap;
}
}
table tr td {
padding: 10px 2%;
background: #FFFFFF;
border-top: 1px solid #D4D4D4;
valign: top;
}
table tr:first-child th {
border-top: 3px solid #00478A;
}
table tr:first-child td {
border-top: 3px solid #D7D4D5;
background: #FFFFFF;
}
table tr:last-child th {
border-bottom: 1px solid #D4D4D4;
}
table tr:last-child td {
border-bottom: 1px solid #D4D4D4;
}
/* !Floats ------------------------------------------------------------------ */
.fl_left      { display: inline; float: left;}
.fl_right     { display: inline; float: right;}
.fl_img_left  { display: inline; float: left; margin: 0 2.5% 20px 0; border:2px solid #DDD; line-height:50%;}
.fl_img_right { display: inline; float: right; margin:0 0 20px 2.5%; border:2px solid #DDD; line-height:50%;}
.ft_box  { margin: 0 3% 1em; overflow: hidden; *zoom: 1;}

/* コンテンツ
------------------------------------------*/
@media only screen and (max-width: 640px) {
ul {
margin: 0 5% 20px 12%;
list-style-image: url(/images/icon_list.png);
}
}
@media only screen and (max-width: 480px) {
	.fl_left      { display: block; float: none;}
	.fl_right     { display: block; float: none;}
	.fl_img_left  { display: block; float: none; margin: 0 auto 10px; border:2px solid #DDD; line-height:50%;}
.fl_img_right  { display: block; float: none; margin: 0 auto 10px; border:2px solid #DDD; line-height:50%;
}
}

/* フッター
------------------------------------------*/
@media only screen and (max-width: 640px) {
footer#copyright {
font-size: 80%;
}
}

/* スリムメニュー
------------------------------------------*/
.menu-collapser {
position: absolute;
top: 0;
width: 100%;
height: 38px;
padding: 0;
}
.collapse-button {
position: absolute;
right: 0;
top: 0;
background-color: #03508C;
padding: 9px 7px 7px;
cursor: pointer;
font-size: 14px;
text-align: center;
-moz-box-shadow: 1px 1px 3px #000;
-webkit-box-shadow: 1px 1px 3px #000;
z-index: 999;
color: #FFF;
}
.collapse-button:hover, .collapse-button:focus {
background-image: none;
background-color: #DAEFFF;
color: #03508C;
}
.collapse-button .icon-bar {
display: block;
line-height: 100%;
font-size: 150%;
}


/* 汎用
------------------------------------------*/

.pd5 {
padding: 10px !important;
}
.mgt5 {
margin-top: 5px !important;
}
.mgt8 {
margin-top: 8px !important;
}
.mgt10 {
margin-top: 10px !important;
}
.mgt20 {
margin-top: 20px !important;
}
.w33p {
	width:33%;
}
.w63p {
	width:63%;
}