@charset "UTF-8";
/* ====================================================
　CSS 3@ Document 2016.03.01
==================================================== */
/* ######################################################################################

	基本設定

###################################################################################### */
body {
	color: #091a24;
	font-family:"游ゴシック", YuGothic, "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", sans-serif;
	font-size: 14px;
}
p {
	margin: 0 0 1em;
	line-height: 1.5;
}
p:last-of-type {margin-bottom:0;}

a { color: #007dc9; }
.orange { color: #f07100; }
.alignL { text-align: left !important; }
.alignC { text-align: center !important; }
.alignR { text-align: right !important; }

img {vertical-align:bottom;}

@media print, screen and (min-width: 768px) {
	span.spbreak { display:inline;}
}

@media screen and (max-width: 767px) {
	span.spbreak { display:inline-block;}
    .contents img {width: 100%; height: auto;}
}
/* ######################################################################################

	フレーム

###################################################################################### */
.contents {
	position: relative;
	margin: 0 auto;
	padding-right: 15px;
	padding-left: 15px;
	width: 100%;
	max-width: 1170px;
}
@media print, screen and (min-width: 768px) {
/*    .contents {
        width: 1170px;
    }*/
}
@media screen and (max-width: 767px){
}

.gulfnav ul,
.gnav ul {
	position: relative;
	margin: 0 auto;
	width: 100%;
	max-width: 1110px;
}
/* ######################################################################################

	ヘッダ

###################################################################################### */
/* header { position: relative; } */
/* header li { list-style: none; } */
.spHeader { display: none; }
.pcHeader li.download,
.spHeader li.download { /*display: none;リリース時非表示*/
}

/*
@media screen and (max-width: 767px) {
	header { border-bottom: 1px solid #000000; }
}
*/
/* ====================================================
　グループヘッダ
==================================================== */
.groupHeader {
	position: relative;
	background: #1c1c1c;
	height: 40px;
}
.groupHeader ul {
	padding-top: 6px;
	text-align: right;
}
.groupHeader li {
	display: inline-block;
	list-style: none;
	margin-right: 20px;
	line-height: 1;
	font-size: 12px;
}
.groupHeader li.menu01 {
	float: left;
	background: rgba(255, 255, 255, 0.2);
}
.groupHeader li.menu01 a {
	padding-right: 20px;
	padding-left: 20px;
	font-size: 13px;
}
.groupHeader li.menu01 a:after {
	content: "\f105";
	font-family: FontAwesome;
	display: inline-block;
	padding: 0 0.5em;
	color: #ffffff;
}
.groupHeader li.menu01 a:hover { color: #999999; }
.groupHeader li.menu01 a:hover:after { color: #999999; }
.groupHeader li a {
	text-decoration: none;
	color: #FFF;
	display: table-cell;
	height: 26px;
	vertical-align: middle;
}
.groupHeader li a:hover { color: #999999; }
@media screen and (min-width: 768px) {
}

@media screen and (max-width: 767px) {
	.groupHeader { display: none; }
}
/* ====================================================
	PCヘッダ
==================================================== */
.pcHeader h1 {
	display: inline-block;
	float: left;
	margin-bottom: 7px;
	vertical-align: bottom;
}
.pcHeader .contact {
	float: right;
	margin: 8px 0;
	text-align: right;
	font-size: 0;
}
.pcHeader .contact li {
	display: inline-block; /*リリース時非表示*/
	vertical-align: middle;
	font-size: 0;
}
@media print, screen and (min-width: 768px) {
	.pcHeader {
        border-bottom:1px solid #e5e5e5;
		background: #ffffff;
		padding-top: 10px;
		padding-bottom: 10px;
	}
	.pcHeader h1{width:50%;}
	.pcHeader h1 img{
		max-width:462px;
		width:100%;
		height:auto;
	}
	.pcHeader .contact{width:50%}
	.pcHeader .contact .tel{
		width:47%;
		margin-left:3.7%
	}
	.pcHeader .contact .tel img{
		max-width:250px;
		width:100%;
		height:auto;
	}
	.pcHeader .contact li.download{
		width:47%;
		margin-left:1.8%;
	}
	.pcHeader .contact li.download .button {
		padding: 10px;
		max-width: 250px;
		width:100%;
	}
	.pcHeader .contact li.download img{
		max-width:230px;
		width:100%;
		height:auto;
	}
}
@media screen and (max-width: 767px) {
	.pcHeader {
		box-shadow: 0 0 5px rgba(0,0,0,0.2);
		background: #ffffff;
		padding-top: 5px;
		padding-bottom: 2px;
	}
	.pcHeader h1 { height: 50px; }
	.pcHeader h1 img {
		width: auto;
		height: 50px;
	}
	.pcHeader .contact { display: none; }
}
/* ====================================================
	SPヘッダ
==================================================== */
.spHeader li { list-style: none; }

@media screen and (max-width: 767px) {
	.spHeader {
		display: block;
		font-size: 0;
        padding-top:10px;
	}
	.spHeader img {
		width: 100%;
		height: auto;
	}
	.spHeader .tel {
		margin-bottom: 10px;
		width: 100%;
	}
	.spHeader .mail {
		margin-left: auto;
		margin-right: auto;
		width: 100%;
		max-width:250px;
	}
}

/* ######################################################################################

  フッタコンタクト

###################################################################################### */
@media print, screen and (min-width: 768px) {
    .footerConatct ul {
    }
    .footerConatct li {
        padding-left:3.0701%;
        padding-right:3.0701%;
    }
    .footerConatct li.material {text-align:right;}
    .footerConatct li.tel {text-align:left;}
    .footerConatct li.tel img {
        max-width:100%;
        height:auto;
    }
}

@media screen and (max-width: 767px) {
    .footerConatct li {text-align:center;}
    .footerConatct li.material .button {display:block;}
    .footerConatct li + li {margin-top:2em;}
    .footerConatct li img {max-width:404px;}
}
/* ######################################################################################

	フッタ

###################################################################################### */
footer { border-top: 1px solid #dadada; }
footer div.companyAddress p + p {
	background: none;
	margin-bottom: 0;
	padding: 0;
	font-weight: normal;
}

@media screen and (min-width: 768px) {
	footer { font-size: 13px; }
	footer .contents { padding: 30px 10px; font-size: 13px;}
	footer .customer_logo {
		width: 25%;
		float: left;
		padding-top:14px;
	}
	footer .customer_logo span img {
		max-width: 70px;
		height: auto;
		margin-right: 10px;
	}
	footer strong {
        display:inline-block;
    }
	footer .companyAddress {
		display: block;
		float: left;
		border-left: 1px dotted #288bcd;
		width: 30%;
		padding-left: 25px;
		padding-right: 25px;
	}
}

@media screen and (max-width: 767px) {
	footer { font-size: 13px; }
	footer .contents { padding: 10px 0; }
	footer .customer_logo {
		display: block;
		float: none;
		width: 100%;
		padding-bottom: 20px;
		text-align: center;
	}
	footer .customer_logo span { display: block; }
	footer .customer_logo span img {
		margin-right: 0px;
		width: 70px;
		height: auto;
		text-align: center;
	}
	footer div.companyAddress {
		float: none;
		width: 100%;
		padding: 0 0 15px;
		text-align: center;
	}
	footer div.companyAddress p {
		background: #f1f1f1;
		padding: 5px;
		font-weight: bold;
	}
}
/* =======================================================
	コピーライト
========================================================== */
small.copyright {
	display: block;
	background: #363947;
	margin-top: 14px;
	color: #FFF;
	text-align: center;
	font-size: 12px;
}

@media screen and (min-width: 768px) {
	small.copyright { padding: 14px 0; }
}

@media screen and (max-width: 767px) {
	small.copyright { padding: 10px 0; }
}
