@charset "utf-8";
html {
	text-size-adjust:100%;
	-webkit-text-size-adjust:100%;
}

/* page
-----------------------------------------------*/
.productImg, .productImg h1{
	margin:0;
	padding:0;
	clear:both;
}
.productNavi{
	margin:0;
	padding:10px 10px 10px 10px;
	width:671px;
	background:transparent url(../images/product_navi_bg.jpg) repeat-x 0 0;
	clear:both;
}
.productNaviLeft{
	margin:0;
	padding:4px 0 0 0;
	width:575px;
	float:left;
}
.productNaviIcon{
	margin:0;
	padding:0 10px 0 0;
	width:55px;
	float:left;
	display:inline;
}
.contentsLeft p.productNaviPrice{
	margin:0;
	padding:2px 0 0 0;
	width:500px;
	font-weight:bold;
	float:left;
	display:inline;
}
.productNaviRight{
	margin:0;
	padding:0;
	width:96px;
	height:27px;
	float:right;
}
.productAnchor{
	margin:15px 0;
	padding:0;
	clear:both;
	overflow:hidden;
}
.productAnchor ul{
	margin:0 auto;
	padding:0;
	list-style:none;
}
.productAnchor li{
	float:left;
	margin:0;
	padding:0 10px 0 5px;
}
.productAnchor li a{
	margin:0;
	padding:0 0 0 12px;
	background:transparent url(/common/images/arrow_anchor.gif) no-repeat 0 3px;
}
/**/
.contentsLeft p.productLayoutLead{
	margin:20px 0 0 0;
	padding:0 10px 0 10px;
	width:671px;
}
/* こんな方はB-Frame
===========================================*/
.contentsLeft p.requestImg{
	margin:20px 0 50px;
	text-align:center;
}
/* 特長
===========================================*/
.featureSection{
	margin:25px 0 0;
	padding:0 10px 25px;
	width:671px;
	background:url(/common/images/line_dot.gif) repeat-x scroll 0 100% transparent;
}
.featureLeft{
	float:left;
	width:420px;
}
.featureLeft h4{
	margin:7px 0 15px;
	padding:0;
}
.featureLeft p{
	line-height:150%;
}
.featureLeft p.link{
	padding:0 0 0 15px;
	background:transparent url(/common/images/arrow02.gif) no-repeat 0 0.2em;
}
.featureImg{
	float:right;
	width:240px;
}
.featureSection p.featureImgL{
	clear:both;
	margin:20px 0 0 0;
}
/* 建築工程
===========================================*/
.productFlow{
	margin:20px 0 0 0;
	padding:0;
}
.productFlow ul{
	margin:0 0 15px 10px;
	padding:0;
	width:660px;
	overflow:hidden;
	list-style:none;
}
.productFlow li{
	float:left;
	margin:0 1px 0 0;
	padding:0 19px 0 0;
	width:150px;
	background:url(../images/flow_arrow.gif) no-repeat right 42px;
	line-height:120%;
}
.productFlow li.rightEnd{
	margin:0;
	padding:0;
	width:150px;
	background:none;
}
.productFlow li span{
	display:block;
	font-size:10px;
	line-height:110%;
}
/* カラーバリエーション
===========================================*/
#colorVariation{
	margin:0 0 0 10px;
	width:670px;
	overflow:hidden;
}
#colorVariation .left{
	float:left;
}
#colorVariation .right{
	float:right;
}
#colorVariation dl{
	margin:20px 0 0;
	width:320px;
}
#colorVariation dt img{
	margin:0;
	padding:0;
	vertical-align:bottom;
}
#colorVariation dd{
	margin:2px 0 0;
	padding:0;
}
/* 仕様表
===========================================*/
#detail .note{
	margin:5px 0 0 10px;
	font-size:90%;
}
.productTable{
margin:25px 0 0 10px;
padding:0;
width:671px;
border-top:solid 1px #CACACA;
border-left:solid 1px #CACACA;
}
.productTable th{
margin:0;
padding:10px;
background:#F3F8FB;
border-right:solid 1px #CACACA;
border-bottom:solid 1px #CACACA;
font-weight:normal;
text-align:left;
white-space:nowrap;
}
.productTable thead th{
margin:0;
padding:10px;
background:#DEEBF6;
border-right:solid 1px #CACACA;
border-bottom:solid 1px #CACACA;
font-weight:normal;
text-align:center;
}
.productTable td{
margin:0;
padding:10px;
border-right:solid 1px #CACACA;
border-bottom:solid 1px #CACACA;
text-align:center;
}
.productTable td.pdf{
margin:0;
padding:10px;
text-align:center;
}
.productTable td.pdf a{
margin:0;
padding:0 0 0 8px;
background:transparent url(/common/images/arrow01.gif) no-repeat 0 3px;
vertical-align:middle;
}
.productTable td.pdf a img{
margin:0;
padding:0;
vertical-align:middle;
}
/* ご購入をご検討の方へ　以下
===========================================*/
.productLink{
margin:25px 0 0 10px;
padding:0;
width:671px;
background:transparent url(../images/product02_bg02.gif) no-repeat 0 100%;
}
.productLink h3{
margin:0;
padding:0 0 5px 0;
font-size:120%;
border-bottom:solid 2px #30527A;
}
.productLink h3 a{
margin:0;
padding:0 0 0 15px;
background:transparent url(/common/images/arrow02.gif) no-repeat 0 50%;
display:block;
height:2.4em;
}
.productLink h3 a.link01{
margin:0 0 0 0;
padding:0.6em 0 0 15px;
background:transparent url(/common/images/arrow02.gif) no-repeat 0 50%;
display:block;
height:1.8em;
}
.contentsLeft .productLink p{
margin:10px 0 0 0;
padding:0;
}
.productLinkLeft{
margin:0;
padding:10px 7px;
width:143px;
background:transparent url(../images/product02_bg01.jpg) no-repeat 0 0;
float:left;
}
.productLinkRight{
margin:0 0 0 14px;
padding:10px 7px;
width:143px;
background:transparent url(../images/product02_bg01.jpg) no-repeat 0 0;
float:left;
}
.productNote{
margin:25px 0 0 10px;
padding:5px 15px 15px 15px;
width:641px;
background:#F7F7F7;
clear:both;
}
.productNote h3{
margin:10px 0 0 0;
padding:0;
font-size:120%;
color:#FF8C3F;
clear:both;
}
.contentsLeft .productNote p{
margin:0;
padding:0;
clear:both;
}
.productNote ul{
margin:0;
padding:0;
list-style:none;
clear:both;
}
.productNote li{
margin:0;
padding:0 0 0 1.2em;
text-indent:-1.2em;
}
.relationBox{
margin:25px 0 0 10px;
padding:2px;
width:664px;
border:solid 1px #CCC;
clear:both;
}
.relationBg{
margin:0;
padding:8px;
width:648px;
background:transparent url(../images/relation_bg01.jpg) repeat-x 0 0;
clear:both;
}
.relationBg dl{
margin:0;
padding:0;
width:648px;
clear:both;
}
.relationBg dt{
margin:0;
padding:0;
width:78px;
float:left;
}
.relationBg dd{
margin:0;
padding:0 0 0 10px;
float:left;
}
.relationBg ul{
margin:5px 0 0 0;
padding:10px 0 0 0;
background:transparent url(../images/line_dot.gif) repeat-x 0 0;
clear:both;
}
.relationBg li{
margin:0 15px 0 0;
padding:0;
font-size:120%;
font-weight:bold;
float:left;
display:inline;
}
.relationBg li a{
margin:0;
padding:0 0 0 10px;
background:transparent url(/common/images/arrow01.gif) no-repeat 0 5px;
}

.spOnly {
	display: none;
}
@media screen and (max-width: 767px) {
	.pcOnly {
		display: none;
	}
	.spOnly {
		display: block;
	}
	.mainBox {
		padding: 0 10px;
	}
	.productNavi,
	.contentsLeft p.productNaviPrice,
	.contentsLeft p.productLayoutLead {
		width: auto;
	}
	.productNaviLeft {
		width: fit-content;
	}
	.productAnchor li a {
		background-position: 0 8px;
		font-size: 14px;
	}
	.contentsLeft p.requestImg img {
		width: 100%;
	}
	.featureSection,
	.featureLeft {
		width: auto;
	}
	.featureImg {
		float: unset;
		width: auto;
		margin-top: 20px;
	}
	.featureImg img {
		width: 100%;
	}
	.featureLeft {
		float: unset;
	}
	.featureLeft p.link {
		background-position: 0 5px;
	}
	.featureLeft h4 img {
		max-width: 320px;
		object-fit: contain;
	}
	.productFlow ul {
		display: flex;
		flex-wrap: wrap;
		column-gap: 13px;
		row-gap: 10px;
		width: auto;
		margin: 0 0 10px 0;
	}
	.productFlow li {
		position: relative;
		width: calc(100% / 2 - 12px) !important;
		float: unset;
		padding: 0;
		margin: 0;
	}
	.productFlow li:after {
		content: '';
		position: absolute;
		z-index: -1;
		right: -13px;
		top: 45%;
		width: 13px;
		height: 16px;
		background: url(../images/flow_arrow.gif) no-repeat 0 0 / 100% 100%;
		transform: translateY(-50%);
	}
	.productFlow li img {
		width: 100%;
		object-fit: cover;
	}
	#colorVariation {
		width: auto;
		margin: 0 10px;
	}
	#colorVariation .right {
		float: unset;
	}
	#colorVariation .left {
		float: unset;
	}
	#colorVariation dl dt img {
		width: 100%;
	}
	.scroll-table {
    position: relative;
    overflow-x: scroll;
    -webkit-overflow-scrolling: touch;
  }
  .scroll-table > img {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 120px;
    transform: translate(-50%, -50%);
  }
  .s-guide {
    display: block;
    opacity: 1;
    transition: opacity 0.3s ease;
  }
	.productTable {
		/* width: auto; */
		margin: 0;
	}
	.productLink {
		width: auto;
		margin: 25px 0 0;
		padding: 0 10px;
		background: none;
	}
	.productLink > div {
		width: auto;
	}
	.productLinkLeft {
		background: none;
		float: unset;
	}
	.productLinkRight {
		background: none;
		float: unset;
		margin: 0;
	}
	.productLink h3 {
		font-size: 140%;
	}
	.productLink h3 a {
		height: auto;
	}
	.productLink h3 a.link01 {
		height: auto;
		padding: 0 0 0 15px;
	}
	.contentsLeft .productLink p {
		margin: 6px 0 0 0;
	}
	.productNote {
		width: auto;
		margin: 25px 10px 0;
	}
	.relationBox {
		width: auto;
		margin: 25px 10px;
	}
	.relationBg {
		width: auto;
	}
	.relationBg dl {
		width: auto;
	}
	.relationBg dt,
	.relationBg dd {
		float: none;
	}
	.relationBg dd {
		padding: 5px 0 0 0;
	}
	.relationBg li {
		margin: 0 15px 8px 0;
	}
	.relationBg li a {
		background-position: 0 7px;
	}
}