@charset "UTF-8";

/* !HTML5 elements
---------------------------------------------------------- */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section
{ display: block;}

body, div, p,
dl, dt, dd, ul, ol, li,
h1, h2, h3, h4, h5, h6,
pre,
form, input, textarea,
table, th, td{  
margin:0px; 
padding:0px; 
}

ul, ol{
list-style-type: none;
}

img{
border:0px;
vertical-align:bottom;
}

table{
border-collapse:collapse;
border-spacing:0px;
width: 100%;
}

th, td {
padding: 15px 30px;
margin: 0;
border-bottom: : 5px solid #FFFFFF;
vertical-align: middle;
}

th {
font-weight: normal;
text-align: center;
background-color: #E1E5E9;
}

.columnRight {
display: block;
float: right;
}

.columnLeft {
display: block;
float: left;
}

.textRed {
color: #ff0000;
}

.center {
	text-align: center;
}


/* common
------------------------------------*/

a:link {
	color: #B0B9C4;
	text-decoration: none;}
a:visited {
	color: #B0B9C4;
	text-decoration: none;}
a:hover { color: #192C3F; }
a:active { color: #192C3F; }

a:hover img { opacity: 0.7;}

body{
background-color:#E1E5E9;
font-size:95%;
text-align:center;
line-height:1;
color: #192C3F;
font-family: 'Lato', sans-serif;
letter-spacing: 0.01em;
-webkit-text-size-adjust: 100%;
}

header{
	position: fixed;
	z-index: 100;
	background: url(../img/header_bg.png) repeat-x left top;
	width: 100%;
}

header #headerIn {
	width: 980px;
	text-align: left;
	padding: 0 0 20px;
	margin: 0 auto;}

header #headerIn h1 {
	float: left;
	width: 345px;
}

header #headerIn h1 .columnLeft {padding: 28px 0 0;}
header #headerIn h1 .columnRight {padding: 16px 0 0;}

header #headerIn h1 .columnRight img {
	padding: 10px 0 3px;
}

header #headerIn div.columnRight {
	padding: 16px 0 0;
	width: 610px;
}

header #headerIn #subNavi ul.columnLeft {
	margin: 0 0 0 20px;
	padding: 13px 0 0;
	font-weight: bold;
	font-size: 90%;
}
header #headerIn #subNavi .columnLeft li{
	float: left;
	margin: 0 0 0 8px;
}

header #headerIn #subNavi ul.columnRight {
	width: 430px;
	padding: 0;}

header #headerIn #subNavi ul.columnRight .columnLeft {
	margin: 10px 25px 0 0 ;
}

header #headerIn #subNavi ul.columnRight .info {
	width: 110px;
	font-size: 75%;
	margin: 0 10px 0 0;
	line-height: 1.2;
}

header #headerIn #gNavi {
	padding: 20px 0;
}

header #headerIn #gNavi a:hover img { opacity: 1;}

header #headerIn #gNavi ul li {
	float: left;
	padding: 0 0 0 40px;
}

#contents {
	line-height:1.6;
	position: relative;
	top: 120px;}

h3 {
	font-size: 190%;
	margin: 0 0 30px;
	font-weight: normal;
}

h4 {
	font-size: 110%;
	margin: 0 0 30px;
	font-weight: normal;
}

.cassette .divIn,
.cassette1 .divIn {
	text-align: left;
	width: 980px;
	margin: auto;
}

footer{
	background-color: #243D5A;
	color: #FFF;
	padding: 8px 0;
}

/* indexLayout
------------------------------------*/
.indexLayout #main {
	position: absolute;
	z-index: 99;
	width: 100%;
}

.indexLayout #main h2 {
	width: 980px;
	margin: 0 auto;
	text-align: center;
	padding: 210px 0;
}

.indexLayout #contents ul.slider li {
	background-position: 100% 100%;
    background-size: cover;
    height: 580px;
	min-width: 1200px;
	max-width: 1920px;
}
.indexLayout #contents .cassette1 .divIn { padding: 60px 0;}

.indexLayout #contents #about .divIn { padding: 30px 0;}

.indexLayout #contents .cassette1 .divIn div.columnRight {
	width: 480px;
	padding: 60px 0 30px;
}
.indexLayout #contents .cassette1 .divIn h3 { margin: 0 0 20px;}
.indexLayout #contents .cassette2 {
	background-color: #fff;
	max-height: 802px;
	position: relative;
}

.indexLayout #contents .cassette2 .divIn {
	text-align: left;
	margin: auto;
	max-width: 1280px;
	min-width: 980px;
	background-color: #243D5A;
	z-index: -10;
}

.indexLayout #contents .cassette2 .divIn div.columnLeft,
.indexLayout #contents .cassette2 .divIn div.columnRight {
	width: 50%;
}

.indexLayout #contents .cassette2 .divIn div.columnLeft .divIn2 {
	padding: 6% 10% 0 4%;
	color: #fff;
}


.indexLayout #contents .cassette2 .divIn div.columnLeft .divIn2 ul li { margin: 0 0 15px;}

.indexLayout #contents #service h3{
	position: absolute;
	left: 0;
	right: 0;
	margin: 0 auto;
	top: 37%;
	z-index: 10;
}

.indexLayout #contents #product h3{
	padding: 20px 0 30px;
}

.indexLayout #contents .cassette1 .divIn ul {
	margin: 0 0 50px;
}
.indexLayout #contents .cassette1 .divIn ul li {
	float: left;
	margin: 0 8px 16px;
}

.indexLayout #contents .cassette1 .divIn ul li {
	position: relative;
	overflow: hidden;
	width: 310px;
}

.indexLayout #contents .cassette1 .divIn ul li a img {
	-webkit-transform: scale(1);
	transform: scale(1);
	-webkit-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

.indexLayout #contents .cassette1 .divIn ul li a:hover img {
	-webkit-transform: scale(1.2);
	transform: scale(1.2);
	-webkit-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

.indexLayout #contents .cassette1 .divIn ul li div {
	position: absolute;
	top: -100%;
	left: 0;
	z-index: 2;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,.6);
	-webkit-transition: .3s;
	transition: .3s;
	opacity: 1;
}

.indexLayout #contents .cassette1 .divIn ul li div p {
	color: #FFF;
	font-weight: bold;
	text-align: center;
	position: relative;
	top: 45%;
}

.indexLayout #contents .cassette1 .divIn ul li a:hover div{
	top: 0;
	left: 0;
}

.indexLayout #contents #product .divIn p a{
	display: block;
	color: #A50D00;
	font-size: 110%;
	border: 1px solid #A50D00;
	padding: 20px;
	width: 220px;
	margin: 0 auto;
	text-align: center;
	background-color: none;
	-webkit-transition: all 0.3s ease-in;
	transition: all 0.3s ease-in;
}

.indexLayout #contents #product .divIn p a:hover{
	background-color: #A50D00;
	color: #FFF;
	-webkit-transition: all 0.3s ease-in;
	transition: all 0.3s ease-in;
}

.indexLayout #contents .cassette3 {
	background: url(../../../img/bg_01.jpg) no-repeat center 0;
	background-size: cover;
	height: 1180px;
	background-color: #000;
}
.indexLayout #contents .cassette3 .divIn {
	width: 980px;
	margin: 0 auto;
	padding: 125px 0 60px;
	color: #fff;
}
.indexLayout #contents .cassette3 .divIn h3 { margin: 0 0 130px;}
.indexLayout #contents .cassette3 .divIn ul { margin: 0 0 60px;}
.indexLayout #contents .cassette3 .divIn ul li {
	margin: 0 25px 0 0;
	float:left;
}
.indexLayout #contents .cassette3 .divIn ul li.lustLi { margin: 0;}
.indexLayout #contents .cassette3 .divIn p {
	text-align: left;
	width: 650px;
	margin: 0 auto 60px;
}
.indexLayout #contents .cassette3 .divIn h4 { margin: 0 0 30px;}

.indexLayout #contents .cassette4 { background-color: #fff;}
.indexLayout #contents .cassette4 .divIn {
	width: 600px;
	margin: 0 auto;
	padding: 60px 0;
	text-align: left;
}
.indexLayout #contents .cassette4 .divIn h3 { margin: 0 0 50px;}

.indexLayout #contents .cassette4 .divIn ul li {
	margin: 0 0 20px 0;
}
.indexLayout #contents .cassette4 .divIn ul li span.columnLeft {
	width: 150px;
}
.indexLayout #contents .cassette4 .divIn ul li span.columnRight {
	width: 450px;
}

.indexLayout #contents .cassette5 { padding: 60px 0;}
.indexLayout #contents .cassette5 .divIn {
	width: 980px;
	margin: 0 auto;
	text-align: left;
}
.indexLayout #contents .cassette5 .divIn h4 { margin: 0 0 80px;}
.indexLayout #contents .cassette5 .divIn .columnLeft { width: 500px;}
.indexLayout #contents .cassette5 .divIn .columnLeft ul,
.indexLayout #contents .cassette5 .divIn .columnLeft ul li { margin: 0 0 20px 0;}
.indexLayout #contents .cassette5 .divIn .columnLeft ul li span.columnLeft {
	width: 140px;
	color: #7A8B9A;
}
.indexLayout #contents .cassette5 .divIn .columnLeft ul li span.columnRight {
	width: 360px;
	text-align: left;
}
.indexLayout #contents .cassette5 .divIn .columnLeft div .columnLeft,
.indexLayout #contents .cassette5 .divIn .columnLeft div .columnRight {
	width: 235px;
}
.indexLayout #contents .cassette5 .divIn .columnRight {
	width: 422px;
	text-align: right;
}
.indexLayout #contents .cassette5 .divIn .columnRight .map {
	margin: 0 0 100px;
	border: 1px solid #FFF;
	line-height: 0.8;
	}

/* productLayout
------------------------------------*/
.productLayout {
	background-color: #fff;
}

.productLayout #contents h2{
	background: url(../../../img/product_main_bg.jpg) no-repeat center 0;
	background-size: cover;
	height: 70px;
	padding: 90px 0;
	margin: 0 0 70px;
}

.productLayout #contents h3 {
	padding: 10px 0 0 10px;
	font-weight: bold;
	font-size: 140%;
}
.productLayout #contents .divIn {
	margin: 0 auto 100px;
}

.productLayout #contents .cassette .divIn .columnRight { width:570px;}
.productLayout #contents tr th { width: 100px;}
.productLayout #contents tr td {
	width: 360px;
}

/* clearfix
------------------------------------*/

#header:after,
#headerIn:after,
#container:after,
#contents:after,
#footer:after,
#main .cassette div:after,
#main .cassette ul:after,
#main .cassette li:after,
#main .cassette p:after,
#main .cassette .divIn:after,
.clearfix:after {
content: ".";
display: block;
clear: both;
height: 0;
visibility: hidden;
overflow:hidden;
font-size:0.1em;
line-height:0;
}

#header,
#headerIn,
#container,
#contents,
#footer,
#main .cassette div,
#main .cassette ul,
#main .cassette li,
#main .cassette p,
#main .cassette .divIn,
.clearfix {
display: inline-block;
}

/* exlude MacIE5 \*/
* html #header,
* html #headerIn,
* html #container,
* html #contents,
* html #footer,
* html #main .cassette div,
* html #main .cassette ul,
* html #main .cassette li,
* html #main .cassette p,
* html #main .cassette .divIn,
* html .clearfix {
height: 1%
}

#header,
#headerIn,
#container,
#contents,
#footer,
#main .cassette div,
#main .cassette ul,
#main .cassette li,
#main .cassette p,
#main .cassette .divIn,
.clearfix {
display:block;
}
/* end MacIE5 */