@charset "utf-8";
/* ===================================================================
CSS information
 file name  :cate_pcs.css
 style info :PCS施工店向け for PC
=================================================================== */
/* Structure */
#col-main-one {
	width: 960px;
	padding: 30px 20px;
}
body {
	text-align: center !important;
}
h1.siteName {
	margin: 0;
}
.pcsContainer {
	width: 960px;
	margin: 0 auto;
	padding: 0;
	text-align: left;
}
.pcsHeader,
.pcsContent,
.pcsFooter {
}
.pcsHeader {
	margin: 0 0 30px;
}
.pcsContent {
	margin: 30px 0;
}
.pcsFooter {
	margin: 60px 0 0;
	padding: 0 0 40px;
}

/* Header */
/* Nav */
.pcsHeader .nav li {
	position: relative;
	display: inline;
	float: left;
	margin: 0;
	padding: 0;
}
.pcsHeader .nav li img {
	cursor: pointer;
	vertical-align: top;
}
.pcsHeader .nav li img:hover {
     filter: alpha(opacity=80);
    -moz-opacity: 0.8;
    opacity: 0.8;
}
.pcsHeader .nav li ul {
	position: absolute;
	top: 51px;
	left: 0;
	z-index: 5;
	display: none;
	width: 192px;
	padding: 5px 0;
	background: #063058;
     filter: alpha(opacity=90);
    -moz-opacity: 0.9;
    opacity: 0.9;
}
.pcsHeader .nav li ul li {
	display: block;
	float: none;
	padding: 4px 0 4px 32px;
	color: #fff;
}
.pcsHeader .nav li ul li a {
	margin-left: -14px;
	padding-left: 14px;
	background: url(/usr/assets/images/ico_bullet5.png) no-repeat 0 .4em;
	color: #fff;
}
.pcsHeader .nav li a:hover img {
	text-indent: -9999px;
}
.pcsHeader .nav li.nav01 {
	background: url(/uploads/pcs/img/common/nav_01_on.gif) no-repeat 0 0;
}
.pcsHeader .nav li.nav02 {
	background: url(/uploads/pcs/img/common/nav_02_on.gif) no-repeat 0 0;
}
.pcsHeader .nav li.nav03 {
	background: url(/uploads/pcs/img/common/nav_03_on.gif) no-repeat 0 0;
}
.pcsHeader .nav li.nav04 {
	background: url(/uploads/pcs/img/common/nav_04_on.gif) no-repeat 0 0;
}
.pcsHeader .nav li.nav05 {
	background: url(/uploads/pcs/img/common/nav_05_on.gif) no-repeat 0 0;
}
.pcsHeader .nav li.nav07 {
	background: url(/uploads/pcs/img/common/nav_07_on.gif) no-repeat 0 0;
}

/* Footer */
.pcsFooter .contactNav {
	margin: 0;
}
.pcsFooter .contactNav li {
	display: inline;
	margin: 0;
}
.pcsFooter .contactNav li.inquiry {
}
.pcsFooter .contactNav li.firstChild {
	margin: 0;
}

/* Content */
.pcsContent .mainVisual {
	margin: 30px 0;
}
.pcsBlock01 {
	margin: 0 0 30px;
}

.pcsTtl01 {
	margin: 0 0 15px;
	padding: 4px 10px 2px;
	background: url(/uploads/sp/img/common/bg_ttl01.gif) repeat-x 0 0;
	border: 1px solid #a3cdf1;
	color: #fff;
	font-size: 116.7%;
}
.sampleGallery {
	margin: 0 0 30px;
}
.gallery {
    float: left;
    width: 594px;
    height: 300px;
    padding-right: 7px;
}
.gallery img {
    position: absolute;
}
.gallery {
}
.gallery img {
}
.navi1, .navi2, .navi3, .navi4, .navi5, .navi6, .navi7 {
    float: left;
    height: 300px;
    padding-right: 6px;
    width: 70px;
}
.navi1 li, .navi2 li, .navi3 li, .navi4 li, .navi5 li, .navi6 li, .navi7 li, .navi8 li {
    float: left;
    list-style-type: none;
    width: 70px;
	height: 70px;
	margin-bottom: 4px;
	border: 1px solid #aaabab;
	box-shadow: 2px 2px 4px #999; /* CSS3 */
	-moz-box-shadow: 2px 2px 4px #999; /* Firefox用*/
	-webkit-box-shadow: 2px 2px 4px #999; /* Google Chrome, Safari用*/
	background-color: #f7f7f7;
	filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius='2', MakeShadow='true', ShadowOpacity='0.5');
}
.navi1 li img, .navi2 li img, .navi3 li img, .navi4 li img, .navi5 li img, .navi6 li img, .navi7 li img, .navi8 li img {
}
.navi1 ul li a:link img, .navi2 ul li a:link img, .navi3 ul li a:link img, .navi4 ul li a:link img, .navi5 ul li a:link img, .navi6 ul li a:link img, .navi7 ul li a:link img, .navi8 ul li a:link img {
}
.navi1 ul li a:hover img, .navi2 ul li a:hover img, .navi3 ul li a:hover img, .navi4 ul li a:hover img, .navi5 ul li a:hover img, .navi6 ul li a:hover img, .navi7 ul li a:hover img, .navi8 ul li a:hover img {
}
.pcsecs {
	margin: 0 19px;
}
.pcsecs h3 {
	margin: 0;
}
.pricebox {
	margin: 0 0 30px;
	padding: 20px 14px 15px;
	border: 1px solid #ccc;
	border-width: 0 1px 1px;
}
.pricebox .one-line{
	padding-top:20px;
}
.pricebox .one-line:after{
	content: "."; display: block; visibility: hidden; height: 0.1px; font-size: 0.1em; line-height: 0; clear: both;
}
.pricebox .one-line div.box-l{
	width: 180px;
	margin-bottom:15px;
}
.pricebox .one-line div.box-l div.type{
	padding:8px 0px;
	text-align:center;
	background:#3f3a39;
	font:Geneva, Arial, Helvetica, sans-serif;
	font-weight:bold;
	color:#FFFFFF;
	}
.pricebox .one-line div.box-r{
	width: 504px;
	margin-bottom:15px;
	background:#efefef;
}
.pricebox .one-line div.box-r div.boxin{
	padding:10px;
	}
.pricebox .one-line div.box-r div.boxin div.p-left{
	width: 225px;
	padding-right:8px;
	float:left;
	}
.pricebox .one-line div.box-r div.boxin div.p-left2{
	float: left;
	width:250px;
	/*padding:8px;*/
}
.pricebox .one-line div.box-r div.boxin div.p-left table,
.pricebox .one-line div.box-r div.boxin div.p-left table th,
.pricebox .one-line div.box-r div.boxin div.p-left table td,
.pricebox .one-line div.box-r div.boxin div.p-left2 table,
.pricebox .one-line div.box-r div.boxin div.p-left2 table th,
.pricebox .one-line div.box-r div.boxin div.p-left2 table td{
	border:1px #918f8e solid;
	}
.pricebox .one-line div.box-r div.boxin div.p-left table th,
.pricebox .one-line div.box-r div.boxin div.p-left2 table th{
	padding:5px 10px;
	text-align:center;
	background:#3f3a39;
	font-weight:bold;
	color:#fff;
	/*text-shadow: 0px -1px #fafafa, 1px 0px #fafafa, 0px 1px #fafafa, -1px 0px #fafafa;*/
	}
.pricebox .one-line div.box-r div.boxin div.p-left table td,
.pricebox .one-line div.box-r div.boxin div.p-left2 table td{
	padding:3px 0px;
	text-align:center;
	background:#ffffff;
	vertical-align:middle;
	}
.pricebox .one-line div.box-r div.boxin div.p-left table td p,
.pricebox .one-line div.box-r div.boxin div.p-left2 table td p{
	margin: 0;
	color:#231815;
	font-weight:bold;
	font-size:14px;
	/*text-shadow: 0px -1px #fafafa, 1px 0px #fafafa, 0px 1px #fafafa, -1px 0px #fafafa;*/
	}
.pricebox .one-line div.box-r div.boxin div.p-left table td strike,
.pricebox .one-line div.box-r div.boxin div.p-left2 table td strike{
	font-size:10px;
	font-style:italic;
	font-weight:bold;
}
.pricebox .one-line div.box-r div.boxin div.p-left table td p.price,
.pricebox .one-line div.box-r div.boxin div.p-left2 table td p.price{
	font-weight:bold;
	font-size:16px;
	color:#990000;
	/*通常color:#2C529D;*/
	/*text-shadow: 0px -1px #fafafa, 1px 0px #fafafa, 0px 1px #fafafa, -1px 0px #fafafa;*/
	}
.pricebox .one-line div.box-r div.boxin div.p-left table td p.price span,
.pricebox .one-line div.box-r div.boxin div.p-left2 table td p.price span{
	color:#231815;
	font-weight:bold;
	font-size:10px;
	/*text-shadow: 0px -1px #fafafa, 1px 0px #fafafa, 0px 1px #fafafa, -1px 0px #fafafa;*/
	}
.pricebox .one-line div.box-r div.boxin div.p-left table tr.blue td,
.pricebox .one-line div.box-r div.boxin div.p-left2 table tr.blue td{
	background:#fff;
	}

.pricebox .one-line div.box-r div.boxin div.p-left .size,
.pricebox .one-line div.box-r div.boxin div.p-left2 .size{
	padding:10px 5px;
	min-height:61px;
	margin-right:5px;
	line-height:1.5em;
}	
.pricebox .one-line div.box-r div.boxin div.p-left .icon,
.pricebox .one-line div.box-r div.boxin div.p-left2 .icon{
	float:left;
	padding-left:3px;
}	
.pricebox .one-line div.box-r div.boxin div.p-left .icon div,
.pricebox .one-line div.box-r div.boxin div.p-left2 .icon div{
	width:109px;
	height:28px;
	}
.pricebox .one-line div.box-r div.boxin div.p-left .icon div p,
.pricebox .one-line div.box-r div.boxin div.p-left2 .icon div p{
	padding:0;
	text-align:center;
	color:#231815;
	font-size:11px;
	font-weight:bold;
	text-shadow: 0px -1px #fafafa, 1px 0px #fafafa, 0px 1px #fafafa, -1px 0px #fafafa;
	}
.pricebox .one-line div.box-r div.boxin div.p-left .icon div.icon01,
.pricebox .one-line div.box-r div.boxin div.p-left .icon div.icon02,
.pricebox .one-line div.box-r div.boxin div.p-left .icon div.icon03,
.pricebox .one-line div.box-r div.boxin div.p-left .icon div.icon04 {
	display: inline;
	float: left;
	margin: 0 2px 2px 0;
}
.pricebox .one-line div.box-r div.boxin div.p-left .icon div.icon01{
	/*background:url(../uploads/sp/spicon01.jpg) no-repeat;
	background-position:top;*/
	}
.pricebox .one-line div.box-r div.boxin div.p-left .icon div.icon02{
	/*background:url(../uploads/sp/spicon02.jpg) no-repeat;
	background-position:top;*/
	}
.pricebox .one-line div.box-r div.boxin div.p-left .icon div.icon03{
	/*background:url(../uploads/sp/spicon03.jpg) no-repeat;
	background-position:top;*/
	}
.pricebox .one-line div.box-r div.boxin div.p-left .icon div.icon04{
	/*background:url(../uploads/sp/spicon04.jpg) no-repeat;
	background-position:top;*/
	}
.pricebox .one-line .box-l,
.usage .one-line .box-l{
	float: left;
	}
.pricebox .one-line .box-r,
.usage .one-line .box-r{
	float: right;
	}
.pcsList01 {
	margin: 15px 0;
}
.pcsList01 li {
	display: inline;
	float: left;
	margin-right: 2em;
}
.pcsList01 li a {
	padding-left: 12px;
	background: url(/usr/assets/images/ico_bullet2.png) no-repeat 0 0.4em;
}

/* toppage */
.riskBlock01,
.problemBlock01 {
	margin: 0 0 30px;
}
.pcsBlock01 .riskBlock {
	display: inline;
	float: left;
	width: 430px;
	margin-left: 30px;
}
.pcsBlock01 .problemBlock {
	display: inline;
	float: right;
	width: 430px;
	margin-right: 30px;
}
.riskQBlock,
.problemQBlock {
	padding: 4px 12px;
	border: 3px solid;
	-moz-border-radius: 6px;    /* Firefox */
	-webkit-border-radius: 6px; /* Safari,Chrome */
	border-radius: 6px;         /* CSS3 */
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #ffffff), color-stop(100%, #edecec) );
	background:-moz-linear-gradient( center top, #ffffff 5%, #edecec 100% );
	background:-ms-linear-gradient( top, #ffffff 5%, #edecec 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#edecec');
	background-color:#fff;
	font-size: 83.3%;
}
.riskQBlock {
	border-color: #3a6b99;
}
.problemQBlock {
	border-color: #736051;
}
.riskQBlock .text,
.problemQBlock .text {
	padding: 0 5px;
}
.riskABlock,
.problemABlock {
	margin: -8px 0 0;
	padding: 0;
}
.riskTitle01 {
	color: #3a6b99;
}
.problemTitle01 {
	color: #736051;
}
#risk04 .riskQBlock,
#problem04 .problemQBlock {
	/*min-height: 172px;*/
}
* html #risk04 .riskQBlock,
* html #problem04 .problemQBlock {
	/*height: 172px;*/
}

/* pcsTable01 */
.pcsTable01 table,
.pcsTable01 table th,
.pcsTable01 table td{
	padding:8px;
	border:1px #918f8e solid;
	}
.pcsTable01 table th{
	text-align:left;
	background:#d3dde7;
	font-weight:bold;
	color:#333;
	/*text-shadow: 0px -1px #fafafa, 1px 0px #fafafa, 0px 1px #fafafa, -1px 0px #fafafa;*/
	}
.pcsTable01 table td{
	text-align:left;
	background:#fff;
	vertical-align:middle;
	}
.pcsTable01 table td p{
	margin: 0;
	color:#231815;
	font-weight:bold;
	font-size:14px;
	/*text-shadow: 0px -1px #fafafa, 1px 0px #fafafa, 0px 1px #fafafa, -1px 0px #fafafa;*/
	}
.pcsTable01 table td strike{
	font-size:10px;
	font-style:italic;
	font-weight:bold;
}
.pcsTable01 table td p.price{
	font-weight:bold;
	font-size:16px;
	color:#990000;
	/*通常color:#2C529D;*/
	/*text-shadow: 0px -1px #fafafa, 1px 0px #fafafa, 0px 1px #fafafa, -1px 0px #fafafa;*/
	}
.pcsTable01 table td p.price span{
	color:#231815;
	font-weight:bold;
	font-size:10px;
	/*text-shadow: 0px -1px #fafafa, 1px 0px #fafafa, 0px 1px #fafafa, -1px 0px #fafafa;*/
	}
.pcsTable01 table tr.blue td{
	background:#fff;
	}
.pcsContent h3{
	margin:28px 0 0;
	border-bottom:1px #ccc solid;
	padding:0 0 12px 12px;
}
	/* pcsTable02 */
.pcsTable02 table,
.pcsTable02 table th,
.pcsTable02 table td{
	/*padding:12px 14px;*/
	/*border:1px #ccc solid;*/
	}
.pcsTable02 table th.th_top01{
	text-align:center;
	background:#fff;
	font-weight:bold;
	color:#000;
	border:none;
	padding:20px;
	}
.pcsTable02 table th.th_top02{
	text-align:center;
	background:#d5e4ed;
	font-size:14px;
	font-weight:bold;
	color:#000;
	border:1px #fff solid;
	border-bottom:none;
	width: 27%;
	padding:20px;
	}
.pcsTable02 table th.th_top03{
	text-align:center;
	background:#bcdbee;
	font-size:14px;
	font-weight:bold;
	color:#000;
	border:1px #fff solid;
	border-bottom:none;
	width: 27%;
	padding:20px;
	}
.pcsTable02 table th.th_top04{
	text-align:center;
	background:#a3c9e0;
	font-size:14px;
	font-weight:bold;
	color:#000;
	border:1px #fff solid;
	border-bottom:none;
	width: 27%;
	padding:20px;
	}
.pcsTable02 table th.th_left{
	text-align:left;
	background:#93aebf;
	font-weight:bold;
	color:#000;
	width: 17%;
	border:1px #ccc solid;
	padding:28px 20px;
	}
.pcsTable02 table td.td_col01{
	text-align:center;
	background:#f2f2f2;
	vertical-align:middle;
	border:1px #ccc solid;
	padding:20px;
}
.pcsTable02 table td.td_col02{
	text-align:center;
	background:#e4e4e4;
	vertical-align:middle;
	border:1px #ccc solid;
	padding:20px;
}
.pcsTable02 table td img{
	max-width:73%;
}
.pcsTable02 table td span.txt_price{
	color:#ff0000;
	font-size:24px;
	font-weight:bold;
}
.txt_link a{
	font-size:10px;
	color:#1e5e85;
	margin-left: -8px;
}
.txt_small{
	font-size:10px;
}
.mt-210{
	margin-top:210px;
}
.p_l40{
	padding-left:40px;
}


.pcsBlock01 .blockinner {
	background: url(/uploads/pcs/img/top/img_pcs_top02.gif) repeat-x 0 0;
	margin: 0 0 30px;
	padding: 40px;
	height: 220px;
    text-align: center;
}
/*.pcsBlock01 p{
    line-height: 2.2em;
}*/
.txt_blue{
	color:#23709e;
	margin:0;
}
.txt_navy{
	color:#2a353d;
	margin:0;
}
.txt_brown{
	color:#4e3521;
	margin:0;
}
.txt_large{
	font-size:125%;
	line-height: 2.1em;
}
.txt_small{
	font-size:90%;
	margin: 0;
}
.txt_red{
	color:#990000;
}
.txt_bg{
	background:#990000;
	color:#fff;
	padding:8px 20px;
	display: inline-block;
}
.txt_c{
	text-align:center;
}
.bg_blue{
	background:#ebedf1;
	padding:10px;
	min-height: 140px;
}
.bg_brown{
	background:#f0efef;
	padding:10px;
	min-height: 140px;
}
.contents_inner{
	padding:0 12px;
}
.l_box01{
	float:left;
	width:548px;
	margin-right:30px;
}
.r_box01{
	float:left;
	width:358px
}
ul.col3 li{
	float:left;
	width:280px;
	margin-right: 48px;
}
ul.col3 li.lastchild{
	margin-right:0px;
}
.l_box02{
	float:left;
	margin-right:20px;
	width:489px;
}
.r_box02{
	float:left;
	width:427px;
}
.bg_dot{
	border:#000 dotted 1px;
	padding:10px;
	margin-top:75px;
}
.pcs_bg{
	background:#eeeded;
	padding:30px 10px;
}
h4 {
    margin: 28px 10px 0;
}
ul.col4 li{
	float:left;
	width:228px;
	/*margin-right: 48px;*/
}
ul.col4 li.lastchild{
	margin-right:0px;
}
ul.col4 li p{
	padding-left:20px;
}
.l_box02{
	float:left;
	width:450px;
	margin-right:20px;
}
.r_box02{
	float:left;
	width:445px
}
.l_box03{
	float:left;
	width:185px;
	margin-right:20px;
}
.r_box03{
	float:left;
	width:665px
}
.getstarted_box01{
	background:#efefef;
	border-radius:6px;
	padding:20px;
}
dl.getstarted_box02{
	border: #ccc 1px solid;
	margin-top:20px;
}
dl.getstarted_box02 dt{
	padding:20px;
	background:#d3dde7;
	float:left;
	width:200px;
	min-height: 62px;
}
dl.getstarted_box02 dd{
	padding:20px;
	float:left;
	width: 678px;
}
dl.getstarted_box03{
	border: #ccc 1px solid;
	margin-top:20px;
}
dl.getstarted_box03 dt{
	padding:20px;
	background:#d3dde7;
	float:left;
	width:200px;
	min-height: 93px;
}
dl.getstarted_box03 dd{
	padding:20px;
	float:left;
	width: 678px;
}

/*-- Begin code written on Feb.25.2021 --*/
.pcsContact .headerTop {
	position: relative;
	width: 960px;
	height: 90px;
}
.pcsContact .headerTop h2 {
	position: absolute;
	top: 32px;
	left: 0;
	width: 430px;
	margin: 0;
}
.pcsContact .headerTop h2 img {
	width: 100%;
}
.pcsContact .headerTop .btnPCSContact {
	position: absolute;
	top: 36px;
	right: 0;
}
.pcsContact .headerTop .btnPCSContact {
	display: none;
}
.pcsContact .headerTop .btnPCSContact a {
	margin: 0;
	padding: 5px 8px;
	background: #000;
	border-radius: 2px;
	font-size: 12px;
	font-family: serif;
	color: #fff;
}
.pcsContact .headerTop .btnPCSTop {
	position: absolute;
	top: 0;
	left: 0;
}
.pcsContact .headerTop .btnPCSTop a {
	margin: 0;
	padding: .5em;
}
/*-- End code written on Feb.25.2021 --*/