@charset "utf-8";
/* =======================================

	structure CSS

========================================== */
html,body {
	height:100%;}

#container {
	position:relative;
	width:100%;
	height:100%;
	height:auto!important;
	min-height:100%;
	padding:0 0 290px 0;}

#headerArea {
	width:100%;
	height:146px;}

#navArea {
	width:1100px;
	height:46px;
	margin:0 auto;}

#mvArea {
	width:1100px;
	height:520px;
	margin:0 auto 30px auto;}

#contentsArea {
	width:100%;
	height:auto;}
	
#footer {
	width:100%;
	height:290px;
	position:absolute;
	bottom:0;}

/* 【SP】 */
@media screen and (max-width: 767px) {
#headerArea {
	width:100%;
	height:auto;}

#mvArea {
	width:100%;
	height:auto;
	margin:0;}

#contentsArea {
	width:90%;
	height:auto;
	margin:0 auto;}
	
#footer {
	width:100%;
	height:290px;
	position:absolute;
	bottom:0;}
}
/* =======================================

	common

========================================== */
/* PCのみ表示 */
@media screen and (max-width: 767px) {
.pc {
	display:none;}
}
/* SPのみ表示 */
@media screen and (min-width: 768px) {
.sp {
	display:none;}
}
a:link {color:#000; text-decoration:none;}
a:visited {color:#000; text-decoration:none;}
a:hover {color:#555; text-decoration:none;}

.clearfix:after {
  display: block;
  clear: both;
  content: "";}

a:hover img.ImgOn {
	opacity: 0.7;}

.colorRed {
	color:#f00;}

/* =======================================

	body

========================================== */
/*【PC】*/
@media screen and (min-width: 768px) {
body {
	min-width:1100px;
	color:#191919;
	font-size:1.3rem; line-height:1.95rem;/*150%*/}
}
/*【SP】*/
@media screen and (max-width: 767px) {
body {
	font-size:1.3rem; line-height:1.95rem;/*150%*/}
}
/* =======================================

	【01】#headerArea

========================================== */
#headerArea {
	background:url(images/h_bg.gif) repeat-x;}

.header {
	width:1100px;
	height:auto;
	padding:25px 0 0 0;
	margin:0 auto;}

.h_logoArea {
	width:235px;
	height:auto;
	padding:10px 0 0 0;
	float:left;}

.h_infoArea {
	width:410px;
	height:auto;
	padding:20px 0 0 0;
	float:right;}

.h_telfax {
	padding:30px 0 0 0;
	float:left;}

.h_telfax dt,
.h_telfax dd {
	font-size:1.8rem; line-height:2.16rem;/*120%*/
	float:left;}

.h_contactArea {
	float:right;}

/*【SP】*/
@media screen and (max-width: 767px) {
#headerArea {
	background:none;}

.header {
	width:100%;
	height:auto;
	padding:15px 0 0 0;
	margin:0;}

.h_logoArea {
	width:100%;
	height:auto;
	padding:10px 0 0 0;
	text-align:center;
	float:none;}

.h_logoArea img {
	width:180px;
	height:auto;}

.h_infoArea {
	width:100%;
	height:auto;
	text-align:center;
	padding:0 0 0 0;
	float:none;}

.h_telfax {
	width:200px;
	height:auto;
	padding:20px 0 20px 0;
	margin:0 auto;
	float:none;}

.h_contactArea {
	float:none;}
}

/*【SP】*/
@media screen and (max-width: 767px) {
.spNav {
	padding:10px 0 0 0;
	background:#2a47a5;}

.spNavTxt {
	width:95%;
	height:auto;}
	
.spNavTxt p {
	width:85%;
	padding:0 0 8px 0;
	float:left;}

.spNavBtn {
	width:15%;
	height:auto;
	float:right;}

#btn_gnav {
	width:70%;
	height:auto;
	margin:0 0 10px 0;
	float:right;}

#sp_gnav {
	display:none;
	background:#fff;
	border-top:2px solid #ccc;
	border-right:2px solid #ccc;
	border-left:2px solid #ccc;}

#sp_gnav li a {
	display:block;
	border-bottom:2px solid #ccc;
	padding:14px;}

.navArr {
	font-size:20px; font-size:2.0rem;
	color:#bbb;
	font-weight:bold;
	float:right;}
}
/* =======================================

	【02】#navArea

========================================== */
.gNav {
	width:1095px;
	height:42px;
	margin:0 auto 4px 0;}

.gNav li a:link {
	display:block;
	width:auto;
	height:42px;
	float:left;}

.gNav li a:hover,
.current {
	display:block;
	width:auto;
	height:42px;
	background:url(images/bdr.gif) repeat-x bottom;
	float:left;}

/* =======================================

	【03】#mvArea

========================================== */
/* 【SP】 */
@media screen and (max-width: 767px) {
#mvArea {
	padding:20px 0 40px 0;}

#mvArea img {
	width:100%;
	height:auto;}
}

/* =======================================

	【05】#contentsArea

========================================== */
.contents {
	width:960px;
	height:auto;
	margin:0 auto 30px auto;}

/* 【SP】 */
@media screen and (max-width: 767px) {
.contents {
	width:100%;
	height:auto;}
}
/*
 {
text-indent:-9999px;
font-size:1px;
line-height:1px;}
*/
/*-------------------------------------------------------
	.catchArea
-------------------------------------------------------*/
.catchArea {
	/* Firefox v3.6+ */
background-image:-moz-linear-gradient(50% 106% 90deg,rgb(227,227,227) 0%,rgb(255,255,255) 81%,rgb(255,255,255) 100%); 
/* safari v4.0+ and by Chrome v3.0+ */
background-image:-webkit-gradient(linear,50% 106%,50% 48%,color-stop(0, rgb(227,227,227)),color-stop(0.81, rgb(255,255,255)),color-stop(1, rgb(255,255,255)));
/* Chrome v10.0+ and by safari nightly build*/
background-image:-webkit-linear-gradient(90deg,rgb(227,227,227) 0%,rgb(255,255,255) 81%,rgb(255,255,255) 100%);
/* Opera v11.10+ */
background-image:-o-linear-gradient(90deg,rgb(227,227,227) 0%,rgb(255,255,255) 81%,rgb(255,255,255) 100%);
/* IE v10+ */
background-image:-ms-linear-gradient(90deg,rgb(227,227,227) 0%,rgb(255,255,255) 81%,rgb(255,255,255) 100%);
background-image:linear-gradient(0deg,rgb(227,227,227) 0%,rgb(255,255,255) 81%,rgb(255,255,255) 100%);
border-color:rgb(221,221,221);
border-width:2px;
border-style:solid;
-ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffffffff,endColorstr=#ffe3e3e3,GradientType=0)";
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffffffff,endColorstr=#ffe3e3e3,GradientType=0);
	padding:20px;
	margin:0 0 30px 0;}

.catchArea p {
	font-size:2.4rem; line-height:3.12rem;
	font-weight:bold;}

.catch {
	padding:30px 0 0 20px;
	float:left;}

.catch li {
	padding:0 0 12px 0;}

.catchImg {
	padding:0 15px 5px 0;
	float:right;}

/* 【SP】 */
@media screen and (max-width: 767px) {
.catchArea {
	margin:0 0 40px 0;
	text-align:center;}

.catchArea p {
	font-size:1.8rem; line-height:2.52rem;/*140%*/
	text-align:left;
	padding:0 0 10px 0;}

.catch img {
	width:100%;
	height:auto;}

.catch {
	padding:15px 0 0 0;
	float:none;}


.catch li {
	padding:0 0 12px 0;}

.catchImg {
	padding:0;
	float:none;}
}
/*-------------------------------------------------------
	.contentsList
-------------------------------------------------------*/
.contentsList {
	margin:0 0 30px 0;}

.contentsList dl {
	position:relative;
	width:228px;
	height:380px;
	/* Firefox v3.6+ */
background-image:-moz-linear-gradient(rgb(255,255,255) 0%,rgb(253,253,253) 80%,rgb(247,247,247) 98%); 
/* safari v4.0+ and by Chrome v3.0+ */
background-image:-webkit-gradient(linear,color-stop(0, rgb(255,255,255)),color-stop(0.8, rgb(253,253,253)),color-stop(0.98, rgb(247,247,247)));
/* Chrome v10.0+ and by safari nightly build*/
background-image:-webkit-linear-gradient(rgb(255,255,255) 0%,rgb(253,253,253) 80%,rgb(247,247,247) 98%);
/* Opera v11.10+ */
background-image:-o-linear-gradient(rgb(255,255,255) 0%,rgb(253,253,253) 80%,rgb(247,247,247) 98%);
/* IE v10+ */
background-image:-ms-linear-gradient(rgb(255,255,255) 0%,rgb(253,253,253) 80%,rgb(247,247,247) 98%);
background-image:linear-gradient(rgb(255,255,255) 0%,rgb(253,253,253) 80%,rgb(247,247,247) 98%);
border-color:rgb(153,153,153);
border-width:1px;
border-style:solid;
/* Firefox v3.5+ */
-moz-box-shadow:0px 1px 3px 0px rgba(145,145,145,0.75) ,inset 0px 0px 1px 0px rgb(255,255,255);
/* Safari v3.0+ and by Chrome v0.2+ */
-webkit-box-shadow:0px 1px 3px 0px rgba(145,145,145,0.75) ,inset 0px 0px 1px 0px rgb(255,255,255);
/* Firefox v4.0+ , Safari v5.1+ , Chrome v10.0+, IE v10+ and by Opera v10.5+ */
box-shadow:0px 1px 3px 0px rgba(145,145,145,0.75) ,inset 0px 0px 1px 0px rgb(255,255,255);
-ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffffffff,endColorstr=#fff7f7f7)
	progid:DXImageTransform.Microsoft.dropshadow(OffX = 0,OffY = 1,Color = #bf919191,Positive = true)";
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffffffff,endColorstr=#fff7f7f7)
	progid:DXImageTransform.Microsoft.dropshadow(OffX = 0,OffY = 1,Color = #bf919191,Positive = true);
	float:left;}

.contentsList dt {
	padding:12px 0 0 5px;}

.contentsImgTxt {
	padding:20px 0 0 8px;}

.contentsImgTxt p {
	padding:15px 0 0 0;}

.contentsLink {
	display:block;
	width:200px;
	height:40px;
	position:absolute;
	bottom:14px;
	left:0;
	right:0;
	margin:0 auto;}

.contents01,
.contents02,
.contents03 {
	margin:0 15px 0 0;}

/* 【SP】 */
@media screen and (max-width: 767px) {
.contentsList {
	margin:0 0 40px 0;}

.contentsList dl {
	position:relative;
	width:280px;
	height:380px;
	float:none;
	text-align:center;}

.contents01,
.contents02,
.contents03,
.contents04 {
	margin:0 auto 20px auto;}

.contentsImgTxt p {
	text-align:left;}
}
/*-------------------------------------------------------
	.contentsList2
-------------------------------------------------------*/
.contentsList2 {
	width:920px;
	height:auto;
	font-size:1.5rem; line-height:1.95rem;/*130%*/
	margin:0 auto;}

.contentsList2 h3 {
	padding:0 0 12px 0;}

.materialArea,
.techArea {
	/* Firefox v3.6+ */
background-image:-moz-linear-gradient(36% 98% 90deg,rgb(227,227,227) 0%,rgb(255,255,255) 81%,rgb(255,255,255) 100%); 
/* safari v4.0+ and by Chrome v3.0+ */
background-image:-webkit-gradient(linear,36% 98%,36% 9%,color-stop(0, rgb(227,227,227)),color-stop(0.81, rgb(255,255,255)),color-stop(1, rgb(255,255,255)));
/* Chrome v10.0+ and by safari nightly build*/
background-image:-webkit-linear-gradient(90deg,rgb(227,227,227) 0%,rgb(255,255,255) 81%,rgb(255,255,255) 100%);
/* Opera v11.10+ */
background-image:-o-linear-gradient(90deg,rgb(227,227,227) 0%,rgb(255,255,255) 81%,rgb(255,255,255) 100%);
/* IE v10+ */
background-image:-ms-linear-gradient(90deg,rgb(227,227,227) 0%,rgb(255,255,255) 81%,rgb(255,255,255) 100%);
background-image:linear-gradient(0deg,rgb(227,227,227) 0%,rgb(255,255,255) 81%,rgb(255,255,255) 100%);
border-color:rgb(221,221,221);
border-width:2px;
border-style:solid;
-ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffffffff,endColorstr=#ffe3e3e3,GradientType=0)";
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffffffff,endColorstr=#ffe3e3e3,GradientType=0);
	float:left;}

.materialArea {
	width:400px;
	height:auto;
	padding:10px 20px 18px 20px;
	margin:0 20px 0 0;}

.materialBody img {
	padding:0 50px 0 0;
	float:left;}

.techArea {
	width:500px;
	height:auto;
	padding:10px 20px 18px 20px;}
	
.techBody img {
	padding:0 25px 0 0;
	float:left;}

.techBody .techList {
	float:right;}

.techList ul {
	float:left;}

.techList01 {
	padding:0 15px 0 0;}

/* 【SP】 */
@media screen and (max-width: 767px) {
.contentsList2 {
	width:100%;
	height:auto;
	margin:0;}

.materialArea,
.techArea {
	float:none;}

.materialArea {
	width:280px;
	height:auto;
	margin:0 auto 20px auto;}

.materialBody img {
	padding:0 0 10px 0;
	float:none;}

.techArea {
	width:280px;
	height:auto;
	margin:0 auto;}
	
.techBody img {
	padding:0 0 10px 0;
	float:none;}

.techBody .techList {
	float:none;}

.techList ul {
	float:none;}

.techList01 {
	padding:0;}
}
/* =======================================

	【05】#footer

========================================== */
#footer {
	background:url(images/bdr.gif) repeat-x top;
	padding:25px 0 20px 0;}

.footerContents {
	width:960px;
	height:255px;
	margin:0 auto;}

.f_infoArea {
	width:240px;
	height:auto;
	margin:0 115px 0 0;}

.f_infoArea ul {
	padding:20px 0 0 65px;}

.f_infoAdd {
	padding:0 0 15px 0;}

.f_infoArea,
.f_menu {
	float:left;}

.f_menu01,
.f_menu02,
.f_menu03 {
	padding:5px 0 0 0;
	float:left;}
	
.f_menu dl {
	width:150px;
	height:auto;}

.f_menu01,
.f_menu02 {
	margin:0 60px 0 0;}

.f_menu dt {
	background:url(images/f_arr01.gif) no-repeat 12px 2px;
	border-bottom:1px dotted #989898;
	font-weight:bold;
	padding:0 0 5px 25px;
	margin:0 0 15px 0;}

.f_menu dd {
	background:url(images/f_arr02.gif) no-repeat 12px 4px;
	padding:0 0 3px 25px;}

/* 【SP】 */
@media screen and (max-width: 767px) {
.footerContents {
	width:60%;
	height:auto;
	margin:0 auto;}

.f_infoArea {
	width:100%;
	height:auto;
	margin:0;
	padding:0 0 20px 0;
	float:none;
	text-align:center;}

.f_infoArea img {
	width:180px;
	height:auto;
	padding:0 5px 0 0;}

.f_infoArea ul {
	padding:20px 0 0 15px;}

.f_infoAdd {
	padding:0 0 10px 0;}

.f_menu {
	float:none;}

.f_menu01,
.f_menu02,
.f_menu03 {
	padding:5px 0 15px 0;
	float:none;}
	
.f_menu dl {
	width:100%;
	height:auto;}

.f_menu01,
.f_menu02 {
	margin:0;}

.f_menu dd {
	padding:0 0 10px 25px;}
}

/* =======================================

	【06】.copyrightArea

========================================== */
.copyrightArea{
	width:100%;
	height:35px;
	color:#fff;
	text-align:center;
	font-size:1.2rem; line-height:1.44rem;/*120%*/
	background:#223f9c;
	padding:10px 0 0 0;}

/* 【SP】 */
@media screen and (max-width: 767px) {
.copyrightArea{
	width:100%;
	height:auto;
	padding:10px 0 10px 0;}
}

/* =======================================

	【07】#pageTop

========================================== */
#pageTop{
	position:fixed;
	background-color:rgba(34,63,156,0.9);
	/* Firefox v1.0+ */
	-moz-border-radius:7px ;
	/* Safari v3.0+ and by Chrome v0.2+ */
	-webkit-border-radius:7px ;
	/* Firefox v4.0+ , Safari v5.0+ , Chrome v4.0+ , Opera v10.5+  and by IE v9.0+ */
	border-radius:7px ;
	color:#fff;
	bottom:20px;
	right:30px;
	padding:20px 20px 17px 20px;
	z-index: 100;}

#pageTop:hover{
	background-color:rgba(34,63,156,0.7);}

/* 【SP】 */
@media screen and (max-width: 767px) {
#pageTop {
	bottom:10px;
	right:10px;
	padding:15px 15px 12px 15px;}
}
