@charset "utf-8";

/*=====================================================================================
	
	Document    : quality.css
	Description : PC用（幅900px以上）
 
=====================================================================================*/

.ct .block:first-child {
	padding-bottom:0;
}


/*---------------------------------------------------------------------------

   Nav

---------------------------------------------------------------------------*/

.quality-nav {
	list-style:none;
	max-width:1000px;
	margin-left:auto;
	margin-right:auto;
}

@media screen and (max-width:1060px) {
	.quality-navB {
		padding-left:3%;
		padding-right:3%;
	}
}


.quality-nav li {
	width:32.5%;
	float:left;
	text-align:center;
	font-weight:bold;
}

.quality-nav li:nth-child(2) {
	margin:0 1.25%;
}

.quality-nav li a {
	display:block;
	padding:10px 10px 12px 10px;
	text-decoration:none !important;
	background:url(../../image/bg-black25.png) repeat center top;
	margin-bottom:9px;
}

.quality-nav li a:hover {
	background:url(../../image/bg-black50.png) repeat center top;
}

.quality-nav li.selected a {
	background:url(../../image/bg-black90.png) repeat center top;
}

.quality-nav li.selected:after {
	content:"";
	border:10px solid transparent;
	border-top-color:rgba(66,66,66,1);
}


/*---------------------------------------------------------------------------

   contents load

---------------------------------------------------------------------------*/

#quality-load-wp .quality-nav li.selected:after,
#quality-load .quality-nav li.selected:after {
	border:none !important;
	border-top-color:none !important;
}


/*---------------------------------------------------------------------------

   見出し

---------------------------------------------------------------------------*/

.quality-md {
	background:url(../image/quality/md-line.gif) repeat-x center center;
}

.quality-md h3 {
	padding-left:1.5em;
	padding-right:1.5em;
	background:url(../../image/bg.gif) repeat center center;
}


/*---------------------------------------------------------------------------

   01 性能

---------------------------------------------------------------------------*/

/*-------------------------------------------------------
   C値
-------------------------------------------------------*/

.block01-A {
	text-align:center;
	position:relative;
	min-height:210px;
}

.block01-A p {
	padding-top:1em;
	text-align:left;
	padding-right:290px;
}	

.block01-A .pic {
	position:absolute;
	right:0;
	top:30px;
}


/*-------------------------------------------------------
   なぜ気密化が必要か
-------------------------------------------------------*/

.block01-B {
	max-width:100% !important;
	background:url(../../image/bg-black5.png) repeat center top;
}

.block01-B dl {
	max-width:1000px;
	margin-left:auto;
	margin-right:auto;
	text-align:left;
}

.block01-B dt:before {
	font-size:60px;
	font-family:"Times New Roman", Times, serif;
	font-style:italic;
	display:block;
	width:60px;
	margin-top:5px;
	float:left;
}

.block01-B dt.no1:before {
	content:"1";
}
.block01-B dt.no2:before {
	content:"2";
}
.block01-B dt.no3:before {
	content:"3";
}
.block01-B dt.no4:before {
	content:"4";
}

.block01-B dt {
	font-weight:bold;
	padding-bottom:0.5em;
}

.block01-B dd {
	padding-left:60px;
}


/*-------------------------------------------------------
   気密性と換気効率の関係
-------------------------------------------------------*/

.block01-C h5 br {
	display:none;
}

.block01-C table {
	width:71%;
	border-collapse:collapse;
	margin-left:auto;
	margin-right:auto;
}

.block01-C th,
.block01-C td {
	border:1px solid #c3c3c3;
	background-color:#fff;
	padding:15px;
	text-align:center;
	vertical-align:middle;
}

.block01-C tr td:first-child {
	white-space:nowrap;
}

.block01-C th {
	background:url(../../image/bg-black5.png) repeat center top;
}


/*-------------------------------------------------------
   photo
-------------------------------------------------------*/

#loopslider-wp {
	width:100%;
	overflow:hidden;
}

#loopslider {
	margin:0 auto;
	width:100%;
	width:2000px;
	height:199px;
	text-align:left;
	position:relative;
	overflow:hidden;
}

#loopslider ul {
	float:left;
	display:inline;
	overflow:hidden;
}

#loopslider ul li {
	width:300px;
	height:199px;
	float:left;
	display:inline;
	overflow:hidden;
}

#loopslider ul:after {
	content:".";
	height:0;
	clear:both;
	display:block;
	visibility:hidden;
}

#loopslider ul {
	display:inline-block;
	overflow:hidden;
}

	
@media screen and (max-width:800px) {
	#loopslider,
	#loopslider ul {
		width:1800px;
		height:132px;
	}

	#loopslider ul li {
		width:200px;
		height:132px;
	}
}


/*---------------------------------------------------------------------------

   02 工法

---------------------------------------------------------------------------*/

.block02 h4 {
	background-color:#7ab9d8;
	color:#fff;
	padding:15px;
}

.block02 p {
	text-align:left;
	padding-top:1em;
}

.block02 .block h4+p {
	padding-top:0;
}


/*-------------------------------------------------------
   ジョイ・コス住宅システム
-------------------------------------------------------*/

.block02-D {
    width: 100% !important;
    padding-top: 20px;
    padding-bottom: 55px;
	background:url(../../image/bg-black5.png) repeat center top;
    box-sizing: border-box;
}

@media screen and (max-width:1060px) {
	.block02-D .block {
		padding-left:3%;
		padding-right:3%;
	}
}

@media screen and (max-width:800px) {
	.block02-D .block {
		padding-top:7%;
		padding-bottom:7.5%;
	}
}

.block02-D table {
    width: calc(100% - 220px);
    border-collapse: collapse;
    box-sizing: border-box;
}

.block02-D table th {
    padding: 10px;
    color: #fff;
    background-color: #e5686c;
    border: 1px solid #ccc;
}

.block02-D table td {
    padding: 10px;
    background-color: #fff;
    border: 1px solid #ccc;
}

.block02-D dl {
    text-align: left;
}

.block02-D dt {
    color: #e5686c;
    font-weight: bold;
}

.block02-D dd {
    margin-bottom: 20px;
}

.works-list {
	list-style:none;
    overflow: hidden;
}

.works-list li {
	width:23%;
	float:left;
	margin-right:2.7%;
	margin-top:25px;
	position:relative;
	overflow:hidden;
}

.works-list li:nth-child(4n+1) {
	margin-right:2.6%;
}

.works-list li:nth-child(4n+4) {
	margin-right:0;
}

.works-list li .content {
	left:0;
	position:absolute;
	background:url(../../image/bg-black-op70.png) repeat left top;
	color:#fff;
	text-align:left;
}

@media screen and (max-width:800px) {
	.works-list li .content {
		display:none;
	}
}

.block02-D .end {
    text-align: center;
}


/*-------------------------------------------------------
   2×4
-------------------------------------------------------*/

.block02-B01 {
	width:48%;
	float:left;
}

.block02-B02 {
	width:48%;
	float:right;
}

.block02 .block div img+p {
	padding-top:0;
}


/*-------------------------------------------------------
   在来・合板貼り工法
-------------------------------------------------------*/

.block02-C iframe {
	width:80%;
	height:500px;
}

@media screen and (max-width:800px) {
	.block02-C iframe {
		width:100%;
		height:400px;
	}
}


/*---------------------------------------------------------------------------

   03 設備

---------------------------------------------------------------------------*/

.block03-A {
	padding-top:0;
}

.block03-A p {
	text-align:center;
}

.block03-A p br {
	display:none;
}

.block03-A ul {
	list-style:none;
}

.block03-A li {
	width:48.7%;
	float:left;
	margin-bottom:25px;
}

.block03-A li:nth-child(2n) {
	float:right;
}

.block03-A li.clm2 img:first-child {
	width:47.22792%;
	float:left;
}

.block03-A li.clm2 img:last-child {
	width:47.22792%;
	float:right;
}

@media screen and (max-width:800px) {
	.block03-A li {
		margin-bottom:2.5%;
	}
}


/*-------------------------------------------------------
   換気システム
-------------------------------------------------------*/

.block03-B img {
	float:right;
	margin-left:40px;
}

.block03-B h4,
.block03-B p {
	text-align:left;
}

@media screen and (max-width:1000px) {
	.block03-B img {
		width:54%;
		margin-left:4%;
		margin-bottom:3%;
	}
}

@media screen and (max-width:800px) {
	.block03-B img {
		width:inherit;
		float:none;
		margin-left:auto;
		margin-right:auto;
		margin-bottom:6%;
	}
}