@charset "utf-8";

/* Page Header ----------------------------------------- */
.pageHead {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 500px;
	background: url("../images/pghead_bg.jpg") center center no-repeat;
	background-size: cover;
}

.pageHead img {
	flex-basis: 250px;
	max-width: 250px;
	height: auto;
}

.contentNav {
	display: flex;
	flex-flow: row nowrap;
	justify-content: space-between;
	width: 1000px;
	max-width: 100%;
	margin: 0 auto;
	padding: 60px 20px 120px;
}

.contentNav li {
	flex-basis: 32.083%;
	max-width: 32.083%;
}

.contentNav li a {
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	padding: 12.98% 0;
	border: 4px solid #ffffff;
	border-radius: 20px;
	text-align:  center;
	font-size: 2.4rem;
	font-weight: bold;
	color: #ffffff;
}

.contentNav li.cNav01 a {
	background: url(../images/btn_cnav02_bg.jpg) center center no-repeat;
	background-size: cover;
}
.contentNav li.cNav02 a {
	background: url(../images/btn_cnav01_bg.jpg) center center no-repeat;
	background-size: cover;
}
.contentNav li.cNav03 a {
	background: url(../images/btn_cnav03_bg.jpg) center center no-repeat;
	background-size: cover;
}

section#works {
	padding: 0 0 100px;
}

@media only screen and (min-width: 979px) {
section#works .sectionInr {
	width: 100%;
	max-width: 100%;
	padding: 0 0 470px;
	background: url("../images/bg_works.png?v=260417") 50% 100% no-repeat;
}
}

@media only screen and (max-width: 978px) {
section#works .sectionInr {
	max-width: 960px;
	padding: 0 0 41.22%;
	background: url("../images/bg_works_s.png?v=260417") 20px 100% no-repeat;
	background-size: contain;
}
}
section#works dl {
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
	padding: 0 20px 60px;
}

section#works dt {
	border-bottom: 2px solid #15588e;
	margin: 0 0 .5em;
	padding: 0 0 .25em;
	text-align: left;
	line-height: 1.3;
	font-size: 3.0rem;
	font-weight: bold;
	color: #15588e;
}

section#works dd {
	line-height: 1.8;
	text-align: left;
	font-weight: bold;
}

/* 製品 */
section#product01 {
	overflow: hidden;
	padding: 60px 0 0;
}

section#product02 {
	overflow: hidden;
	padding: 0 0 80px;
	border-top: 60px solid #ffffff;
}

.catTitle {
	width: 100%;
	position: relative;
}

.catTitle::after {
	content: "";
	position: absolute;
	top: 48%;
	left: -10%;
	display: block;
	width: 120%;
	height: 160px;
	background: #15588e;
	transform: rotate(-3deg);
}

section#product02 .catTitle {
	background-color: #ffffff;
}

.catTitle h2 {
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
	padding: 0 20px;
	font-size: 8.0rem;
	font-weight: bold;
	text-align: left;
}

.fixedBg {
	height: 500px;
	background-position: center center;
	background-attachment: fixed;
	background-size: cover;
}

section#product01 .fixedBg {
	background-image: url("../images/bg_product02.jpg");
}
section#product02 .fixedBg {
	background-image: url("../images/bg_product01.jpg");
}
.fixedBg.machinery {
	background-image: url("../images/bg_machinery.jpg");
}

section#product01 .sectionInr,
section#product02 .sectionInr {
	width: 100%;
	max-width: 100%;
}

section#product01 .sectionInr {
	background: #ffffff;
}

p.catLeadTxt {
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
	padding: 52px 20px 36px;
	text-align: center;
	font-weight: bold;
}

.productList {
}

.item {
	position: relative;
	padding: 100px 0 60px;
}

.item .itemHead {
	position: absolute;
	top: 100px;
	left: 50%;
	width: 100%;
	max-width: 1170px;
	margin: 0 auto;
	padding: 40px 20px 0 105px;
	transform: translateX(-50%);
	z-index: 2;
}

.item .itemHead::before {
	content: "";
	display: block;
	width: 205px;
	height: 150px;
	background-position: 0 50%;
	background-repeat: no-repeat;
	background-size: contain;
	position: absolute;
	left: 20px;
	top: -75px;
	opacity: .5;
	z-index: 0;
}

.item .itemHead h3 {
	position: relative;
	width: 100%;
	max-width: 440px;
	margin: 0 auto .5em 0;
	padding: 0 0 .25em;
	border-bottom: 1px solid #000000;
	letter-spacing: 2px;
	text-align: left;
	font-size: 4.0rem;
	font-weight: bold;
	z-index: 1;
}

.item .itemHead table {
	width: 100%;
	max-width: 440px;
}

.item .itemHead table th,
.item .itemHead table td {
	padding: .25em .25em .25em 0;
	line-height: 1.5;
	text-align: left;
	vertical-align: top;
}

.item .itemHead table th {
	width: 7em;
	font-weight: bold;
}

.item .itemHead table td {
	width: auto;
}

.item .itemBg {
	position: relative;
	height: 700px;
	background-position: 50% 50%;
	background-repeat: no-repeat;
}
.item .itemBg::after {
	position: absolute;
	left: auot;
	top: auto;
	right: auto;
	bottom: auto;
	content: "";
	display: block;
	width: 100%;
	height: 700px;
	background: url("../images/p_bg_main_cover.png") center center no-repeat;
	z-index: 0;
}

.item .itemFoot {
	display: flex;
	flex-flow: row nowrap;
	align-items: flex-start;
	width: 100%;
	max-width: 1170px;
	margin: 0 auto;
	padding: 0 20px 0 105px;
}

.item .itemFoot ul {
	width: 43.45%;
	display: flex;
	margin-right: 7.465%;
	flex-shrink: 0;
}

.item .itemFoot ul li {
	position: relative;
	border: 4px solid #ffffff;
	overflow: hidden;
}

.item .itemFoot ul li + li {
	margin-left: 10px;
}

.item .itemFoot ul li.before::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	display: block;
	width: 80px;
	height: 80px;
	background: url("../images/p_icon_before.png") center center no-repeat;
}

.item .itemFoot ul li.detail::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	display: block;
	width: 54px;
	height: 54px;
	background: url("../images/p_icon_feature.png") center center no-repeat;
}

.item .itemFoot .comment {
	width: 40.96%;
	padding: 0 0 143px;
}

.item .itemFoot p {
	position: relative;
	padding: 19px 17px 45px;
	background: #ffffff;
	border: 7px solid #15588e;
	border-radius: 20px;
	line-height: 1.5;
	font-size: 1.4rem;
}

.item .itemFoot p::before {
	content: "";
	position: absolute;
	bottom: -36px;
	right: 180px;
	display: block;
	width: 53px;
	height: 36px;
	background: url("../images/p_bg_fukidashi.png") center center no-repeat;
}

.item .itemFoot p::after {
	content: "";
	position: absolute;
	bottom: -150px;
	right: 0;
	display: block;
	width: 180px;
	height: 180px;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
}

@media only screen and (max-width: 978px) {
.item .itemFoot ul {
	width: 45.45%;
	margin-right: 3.465%;
}

.item .itemFoot .comment {
	width: 42.96%;
	padding: 0 0 123px;
}

.item .itemFoot p {
	padding: 19px 17px 30px;
}

.item .itemFoot p::before {
	right: 160px;
}

.item .itemFoot p::after {
	bottom: -130px;
	width: 160px;
	height: 160px;
}
}

/* 背景画像セット - タイトルNo */
#p01.item .itemHead::before {
	background-image: url("../images/icon_num01.svg");
}
#p02.item .itemHead::before {
	background-image: url("../images/icon_num02.svg");
}
#p03.item .itemHead::before {
	background-image: url("../images/icon_num03.svg");
}
#p04.item .itemHead::before {
	background-image: url("../images/icon_num04.svg");
}
#p05.item .itemHead::before {
	background-image: url("../images/icon_num05.svg");
}
#p06.item .itemHead::before {
	background-image: url("../images/icon_num06.svg");
}
#p07.item .itemHead::before {
	background-image: url("../images/icon_num07.svg");
}
#p08.item .itemHead::before {
	background-image: url("../images/icon_num08.svg");
}
#p09.item .itemHead::before {
	background-image: url("../images/icon_num09.svg");
}

/* 背景画像セット - 製品メイン画像 */
#p01.item .itemBg {
	background-image: url("../images/p08_bg_main.jpg");
}
#p02.item .itemBg {
	background-image: url("../images/p09_bg_main.jpg");
}
#p03.item .itemBg {
	background-image: url("../images/p01_bg_main.jpg");
}
#p04.item .itemBg {
	background-image: url("../images/p02_bg_main.jpg");
}
#p05.item .itemBg {
	background-image: url("../images/p03_bg_main.jpg");
}
#p06.item .itemBg {
	background-image: url("../images/p04_bg_main.jpg");
}
#p07.item .itemBg {
	background-image: url("../images/p07_bg_main.jpg");
}
#p08.item .itemBg {
	background-image: url("../images/p08_bg_main.jpg");
}
#p09.item .itemBg {
	background-image: url("../images/p09_bg_main.jpg");
}

/* 背景画像セット - 吹き出し人物 */
#p01.item .itemFoot p::after {
	background-image: url("../images/bg_cmnt_male02.png");
}
#p02.item .itemFoot p::after {
	background-image: url("../images/bg_cmnt_female02.png");
}
#p03.item .itemFoot p::after {
	background-image: url("../images/bg_cmnt_male01.png");
}
#p04.item .itemFoot p::after {
	background-image: url("../images/bg_cmnt_male03.png");
}
#p05.item .itemFoot p::after {
	background-image: url("../images/bg_cmnt_male02.png");
}
#p06.item .itemFoot p::after {
	background-image: url("../images/bg_cmnt_female02.png");
}
#p07.item .itemFoot p::after {
	background-image: url("../images/bg_cmnt_male03.png");
}
#p08.item .itemFoot p::after {
	background-image: url("../images/bg_cmnt_male02.png");
}
#p09.item .itemFoot p::after {
	background-image: url("../images/bg_cmnt_female02.png");
}

section#machinery table {
	width: 100%;
	max-width: 621px;
	margin: 0 auto 40px;
}

section#machinery table caption {
	padding: .5em;
	background-color: #15588e;
	font-size: 2.0rem;
	font-weight: bold;
	color: #ffffff;
}

section#machinery table tr {
	border-bottom: 2px solid #878a8c;
}

section#machinery table tr th {
	width: 13.5em;
	padding: .75em;
	text-align: left;
	vertical-align: middle;
}

section#machinery table tr td {
	width: auto;
	padding: .75em;
	text-align: left;
	vertical-align: middle;
}

section#machinery table tr td:nth-of-type(2) {
	width: 9.5em;
}
section#machinery table tr td:nth-of-type(3) {
	width: 4em;
	text-align: right;
}

.btmBgBox {
	width: 100%;
	height: 638px;
	background: url("../images/bg_machinery_03.jpg") center center no-repeat;
	background-size: cover; 
}

@media only screen and (max-width: 768px) {
.contentNav {
	padding: 60px 20px 80px;
}

section#works {
	padding: 0 0 40px;
}

.catTitle::after {
	content: "";
	position: absolute;
	top: 56%;
	left: -10%;
	display: block;
	width: 120%;
	height: 120px;
	background: #15588e;
	transform: rotate(-3deg);
}

.fixedBg {
	height: 500px;
	background-position: center center;
	background-attachment: scroll;
	background-size: cover;
}

.item {
	padding: 60px 0 30px;
}

.item .itemHead {
	position: relative;
	top: auto;
	left: auto;
	padding: 40px 20px 10px 92px;
	transform: none;
}

.item .itemHead::before {
	width: 180px;
	height: 132px;
	top: -57px;
}

.item .itemHead h3 {
	max-width: 100%;
}

.item .itemHead table {
	max-width: 100%;
}

.item .itemBg {
	height: 600px;
}

.item .itemFoot {
	display: block;
	width: 100%;
	max-width: 1000px;
	padding: 0 20px;
}

.item .itemFoot ul {
	width: 100%;
	max-width: 454px;
	margin: 0 auto 30px;
}

.item .itemFoot .comment {
	width: 100%;
	max-width: 454px;
	margin: 0 auto;
	padding: 0 0 123px;
}

.btmBgBox {
	height: 400px;
}

}

@media only screen and (max-width: 640px) {
section#machinery table {
    display: block;
    width: 100%;
    max-width: 100%;
	margin: 0 auto 30px;
}

section#machinery table caption {
	display: block;
	width: 100%;
}

section#machinery table tbody,
section#machinery table tbody tr {
	display: block;
	width: 100%;
}

section#machinery table tbody tr::after {
	content: "";
	display: block;
	clear: both;
	height: 1px;
	font-size: 0;
}

section#machinery table tr th {
	display: block;
	width: 100%;
	margin: 0 0 .5em;
	padding: .75em;
	border-bottom : 1px dashed #878a8c;
}

section#machinery table tr td {
	display: block;
	width: 100%;
	padding: 0 .75em .75em;
}

section#machinery table tr td:nth-of-type(1) {
	width: 100%;
}

section#machinery table tr td:nth-of-type(2) {
	float: left;
	width: 50%;
}
section#machinery table tr td:nth-of-type(3) {
	width: 50%;
	float: right;
	text-align: right;
}

section#machinery table tr th.emp {
	display: none;
}

section#machinery table tr th.emp + td {
	padding-top: .75em;
}

section#machinery table tr td.emp {
	height: 5px;
	padding: 0;
}

}

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

.contentNav li a {
	padding: 13.98% 0;
	font-size: 2.0rem;
}

.catTitle h2 {
	padding: 0 20px 14px;
	font-size: 6.0rem;
}

.fixedBg {
	height: 380px;
}

.item .itemBg {
	height: auto;
	padding-bottom: 100%;
	background-size: contain;
}

/* 背景画像セット - 製品メイン画像 */
#p01.item .itemBg {
	background-image: url("../images/p01_bg_main_sp.jpg");
}
#p02.item .itemBg {
	background-image: url("../images/p02_bg_main_sp.jpg");
}
#p03.item .itemBg {
	background-image: url("../images/p03_bg_main_sp.jpg");
}
#p04.item .itemBg {
	background-image: url("../images/p04_bg_main_sp.jpg");
}
#p05.item .itemBg {
	background-image: url("../images/p05_bg_main_sp.jpg");
}
#p06.item .itemBg {
	background-image: url("../images/p06_bg_main_sp.jpg");
}
#p07.item .itemBg {
	background-image: url("../images/p07_bg_main_sp.jpg");
}
#p08.item .itemBg {
	background-image: url("../images/p08_bg_main_sp.jpg");
}
#p09.item .itemBg {
	background-image: url("../images/p09_bg_main_sp.jpg");
}

}