@charset "UTF-8";
.sp-only, .tb-only {
    display:none;
}
article {
    width: 950px;
    margin: 120px auto 0;
}
img {
	width:auto;
}
article.tech h1, article.tech h2, article.tech h3, article.tech h4, article.tech h5, article.tech h6, article.tech p {
	font-family:"游明朝","YuMincho","Hiragino Mincho ProN","Hiragino Mincho Pro","ＭＳ 明朝",serif !important;
}
article p {
	text-align:justify;
	line-height:2;
}
/*main-banner------------------------------------------*/
.main-banner {
	margin:0 0 50px;
}

/*ヘーベルパワーボードとは？------------------------------------------*/
.what {
	margin:0 0 50px;
}
.what h2 img {
	display:block;
	margin:0 auto 5px;
}
.what p {
	padding:10px 0;
}
.what .what-alc {
	background:url(images/what-alc-bg.jpg) top center /cover no-repeat;
	padding:50px 120px;
	overflow:hidden;
}
.what .what-alc dt {
	float:left;
	margin:0 20px 0 0;
}
.what .what-alc ul {
	margin:20px 0 0;
}
.what .what-alc li {
	float:left;
	margin:0 25px 0 0;
}
.what .what-alc li:last-child {
	margin:0;
}
.what .what-alc li p {
	text-align:center;
}
/*CTA------------------------------------------*/
.cta {
	margin:0 0 50px;
}
.cta img {
	display:block;
	margin:0 auto;
}
/*6つのおすすめする理由------------------------------------------*/
.recommend {
	margin:0 0 50px;
}
.recommend h2 img {
	display:block;
	margin:0 auto 5px;
}
.recommend-inner {
	background:url(images/recommend-bg.jpg) top center /cover no-repeat;
	padding:55px 40px;
	overflow:hidden;
}
.recommend-inner-01 {
	padding:0 20px 20px;
	margin:0 0 30px;
	background:#ffffff;
	overflow:hidden;
	box-shadow:2px 2px 1px 1px rgba(0,0,0,.5);
}
.recommend-inner-01 h3 {
	font-size:28px;
	letter-spacing:0.1rem;
	text-align:center;
	background:#6E1328;
	color:#ffffff;
	padding:10px 0;
	margin:0 0 10px;
}
img.recommend-photo {
	width:280px;
	float:left;
	margin:0 50px 0 0;
}
.recommend-inner-01 ul.point {
	margin:10px 0 30px 355px;
	/*list-style-type:disc !important;*/
}
.recommend-inner-01 ul.example li {
	float:left;
	width:200px;
	margin:0 10px 0 0;
}
.recommend-inner-01 ul.example li:last-child {
	margin:0;
}
.recommend-inner-01 ul.example li img {
	width:100%;
}
.recommend-inner-01 p.example-p {
	border-top:1px solid #666666;
	padding:30px 0 10px;
}

.recommend-inner-02 {
	padding:20px;
	margin:0 0 30px;
	background:#ffffff;
	overflow:hidden;
	box-shadow:2px 2px 1px 1px rgba(0,0,0,.5);
}
.recommend-inner-02 ul.point {
	margin:10px 0 0 355px;
	/*list-style-type:disc !important;*/
}

.recommend-inner-03, .recommend-inner-05 {
	width:420px;
	float:left;
	padding:20px;
	margin:0 30px 30px 0;
	background:#ffffff;
	overflow:hidden;
	box-shadow:2px 2px 1px 1px rgba(0,0,0,.5);
}
.recommend-inner-04, .recommend-inner-06 {
	width:420px;
	float:left;
	padding:20px;
	margin:0 0 30px 0;
	background:#ffffff;
	overflow:hidden;
	box-shadow:2px 2px 1px 1px rgba(0,0,0,.5);
}
.recommend-inner-03 ul.point, .recommend-inner-04 ul.point, .recommend-inner-05 ul.point, .recommend-inner-06 ul.point {
	margin:0 0 0 160px;
	/*list-style-type:disc !important;*/
}
img.recommend-title {
	display:block;
	margin:0 auto 10px;
	height:70px;
}
img.recommend-photo-small {
	width:130px;
	float:left;
	margin:0 20px 0 0;
}

/*お客様の声------------------------------------------*/
.voice {
	margin:0 0 50px;
}
.voice h2 img {
	display:block;
	margin:0 auto 5px;
}
.voice-inner {
	background:url(images/voice-bg.jpg) top center /cover no-repeat;
	padding:55px 40px;
	overflow:hidden;
}
.voice-inner h3 {
	font-size:26px;
	color:#491328;
}
.voice-inner-01, .voice-inner-03 {
	padding:20px 20px 0;
	margin:0 0 30px;
	background:#ffffff;
	overflow:hidden;
	box-shadow:2px 2px 1px 1px rgba(0,0,0,.5);
}
.voice-inner-02 {
	padding:20px 20px 50px;
	margin:0 0 30px;
	background:#ffffff;
	overflow:hidden;
	box-shadow:2px 2px 1px 1px rgba(0,0,0,.5);
}
.voice-inner-02 h3.choice {
	margin:50px 0 0;
	text-align:center;
}
.voice-inner-02 p.choice {
	margin:10px auto;
	padding:5px 0;
	text-align:center;
	background:#491328;
	color:#ffffff;
	font-size:19px;
	border-radius:24px;
	width:650px;
}
.voice-inner-02 ul.design {
	width:600px;
	margin:20px auto 30px;
	overflow:hidden;
}
.voice-inner-02 ul.design li {
	width:120px;
	margin:0 30px 0 0;
	float:left;
}
.voice-inner-02 ul.design li:last-child {
	margin:0;
}
.voice-inner-02 ul.design li img {
	max-width:100%;
}
.voice-inner-02 ul.design li p {
	text-align:center;
}
.voice-inner-02 p.more-pattern {
	text-align:center;
	color:#491328;
	text-decoration:underline;
	font-size:25px;
}
.voice-inner-02 p.more-pattern:hover {
	text-decoration:none;
}
img.voice-photo {
	width:280px;
	float:left;
	margin:0 50px 0 0;
}
/*施工実績------------------------------------------*/
.works {
	background:url(images/works-bg.jpg);
	padding:50px 0;
	margin:0 0 50px;
}
.works h2 img {
	display:block;
	margin:0 auto 30px;
}

/*footer------------------------------------------*/
#footer {
    width: 950px;
    height: 140px;
    padding: 20px 0 0 0;
	margin:0 auto;
	border-bottom:none;
}
#footer #footer-logo {
    float: left;
}
#footer #footer-contact {
    float: left;
}
#page-top img {
	display:block;
	margin:30px auto 0;
}


/*slider------------------------------------------*/
.bx-wrapper {
	border:none !important;
}
.bx-wrapper .bx-pager {
	bottom: -95px !important;
}

.bx-wrapper .bx-pager a {
	opacity:0.8;
	display: block;
	margin: 0 5px;
	padding: 3px;
}

.bx-wrapper .bx-pager a:hover,
.bx-wrapper .bx-pager a.active {
	opacity:1;
}

.bx-wrapper {
	margin-bottom: 120px;
}
.bx-wrapper .bx-pager-item {
	width:90px !important;
}


/*-------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------Break Point----------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (min-width: 748px) and (max-width: 950px) {/*@media screen and (min-width: 768px) and (max-width: 950px)*/
	.pc-only {
		display:none;
	}
	.tb-only {
		display:block;
	}
    .sp-only {
        display:none;
    }
	img {
		max-width: 100%;
	}
	article {
		width:100%;
		padding:0 10px;
	}
	article p {
		line-height:1.8;
	}
/*header------------------------------------------*/
	header .inr {
		width:100%;
		padding: 0 10px;
	}
	#headerInner .LP {
		margin: 68px 0 0 5px;
		width: 316px;
	}
	#headerInner .LP img {
		width:100%;
	}
/*ヘーベルパワーボードとは？------------------------------------------*/
	.what .what-alc {
		padding:20px;
	}
	.what .what-alc dl {
		overflow:hidden;
	}
	.what .what-alc dt {
		float:left;
		margin:0 20px 0 0;
	}
	.what .what-alc ul {
		margin:20px 0 0;
		width:100%;
	}
	.what .what-alc li {
		float:left;
		margin:0 2% 0 0;
		width:32%;
	}
	.what .what-alc li img {
		width:100%;
	}
/*6つのおすすめする理由------------------------------------------*/
	.recommend-inner-01 h3 {
		font-size:24px;
	}
	img.recommend-photo {
		width:30%;
		margin:0 5% 0 0;
	}
	.recommend-inner-01 ul.point {
		margin:10px 0 30px 35%;
	}
	.recommend-inner-01 ul.example {
		width:100%;
	}
	.recommend-inner-01 ul.example li {
		float:left;
		width:22%;
		margin:0 4% 0 0;
	}
	.recommend-inner-01 ul.example li:last-child {
		margin:0;
	}
	.recommend-inner-01 ul.example li img {
		width:100%;
	}
	.recommend-inner-01 p.example-p {
		border-top:1px solid #666666;
		padding:30px 0 10px;
	}
	.recommend-inner-02 ul.point {
		margin:10px 0 0 35%;
	}
	
	.recommend-inner-03, .recommend-inner-05 {
		width:48%;
		margin:0 4% 30px 0;
		padding:10px;
	}
	.recommend-inner-04, .recommend-inner-06 {
		width:48%;
		padding:10px;
	}
	.recommend-inner-03 ul.point, .recommend-inner-04 ul.point, .recommend-inner-05 ul.point, .recommend-inner-06 ul.point {
		margin:0 0 0 150px;
	}
	img.recommend-title {
		height:50px;
		margin:0;
	}
	img.recommend-photo-small {
		width:130px;
		float:left;
		margin:0 10px 0 0;
	}
/*footer------------------------------------------*/
	#footer {
		width:100%;
		height:100%;
		padding:0 10px;
	}
	#footer #footer-logo {
		width:55%;
	}
	#footer #footer-contact {
		width:45%;
	}
}
/*-------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------Break Point----------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------------------------------------------------------------------*/
		@media screen and (max-width: 748px) {/*@media screen and (max-width: 767px) */
			.pc-only {
				display:none;
			}
			.tb-only {
				display:none;
			}
			.sp-only {
				display:block;
			}
			img {
				max-width: 100%;
			}
			article {
				width:100%;
				padding:0 10px;
				margin:88px 0 0;
			}
			article p {
				font-size:12px;
				line-height:1.8;
			}
/*header------------------------------------------*/
			#contents_list {
				margin-top:0 !important;
			}
			header {
				position: fixed;
				z-index: 9999;
				width: 100%;
				background: #fff;
				height: 88px;
			}
			header .inr {
				padding-bottom: 11px;
			}
			header .logo {
				width: 160px;
				float: left;
				margin-top: 28px;
			}
			header .contact {
				float: right;
				margin-top: 13px;
				width: 230px;
				position: relative;
				z-index: 10;
			}
			header .contact .btn {
				margin-top: 8px;
			}
			
			#h1head {
				background: #eeeeee;
				margin-bottom: 10px;
				margin: 0;
			}
			#h1head #h1outer{
				width: 940px;
				display: block;
				margin: auto;
			}
			#h1head h1 {
				padding: 7px;
				max-width: 940px;
				margin: auto;
				/*font-size: 65%;*/
				background: #eeeeee;
				color: #333;
				line-height: 1;
			}
			#h1head h1 span.for-iphone5 {
				font-size: 12px;
				letter-spacing:-0.6px;
				font-family:"メイリオ",Meiryo,Tahoma,Verdana,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif !important;
			}
/*ヘーベルパワーボードとは？------------------------------------------*/
			.what h2 img {
				height:30px;
			}
			.what .what-alc {
				padding:0 10px 10px;
			}
			.what .what-alc dl {
				overflow:hidden;
			}
			.what .what-alc dt {
				float:left;
				margin:10px 5% 0 0;
				width:30%;
			}
			.what .what-alc dd {
				margin:0 0 0 35%;
			}
			.what .what-alc ul {
				margin:20px 0 0;
				width:100%;
			}
			.what .what-alc li {
				float:left;
				margin:0 2% 0 0;
				width:32%;
			}
/*6つのおすすめする理由------------------------------------------*/
			.recommend h2 img {
				height:30px;
			}
			.recommend-inner {
				padding:10px;
			}
			.recommend-inner-01 {
				padding:0 10px 10px;
			}
			.recommend-inner-01 h3 {
				font-size:16px;
				padding:5px;
			}
			img.recommend-photo {
				width:70%;
				float:none;
				margin:0 auto;
			}
			.recommend-inner-01 ul.point {
				margin:10px 0;
			}
			.recommend-inner-01 ul.example li {
				float:left;
				width:48%;
				margin:0 4% 10px 0;
			}
			.recommend-inner-01 ul.example li:nth-child(even) {
				margin:0;
			}
			.recommend-inner-01 ul.example li img {
				width:100%;
				margin:0 0 10px;
			}
			.recommend-inner-01 p.example-p {
				border-top:1px solid #666666;
				padding:10px 0;
			}
			
			.recommend-inner-02 {
				padding:10px;
			}
			.recommend-inner-02 ul.point {
				margin:10px 0;
			}
			
			.recommend-inner-03, .recommend-inner-04, .recommend-inner-05, .recommend-inner-06 {
				width:100%;
				float:none;
				padding:10px;
				margin:0 0 30px;
			}
			img.recommend-title {
				display:block;
				margin:10px auto;
				height:40px;
			}
			.recommend-inner-03 ul.point, .recommend-inner-04 ul.point, .recommend-inner-05 ul.point, .recommend-inner-06 ul.point {
				margin:0 0 0 35%;
			}
			img.recommend-photo-small {
				width:30%;
				float:left;
				margin:0 5% 0 0;
			}
/*お客様の声------------------------------------------*/
			.voice {
				margin:0 0 50px;
			}
			.voice h2 img {
				height:40px;
			}
			.voice-inner {
				padding:10px;
			}
			.voice-inner h3 {
				font-size:15px;
				margin:5px 0;
			}
			.voice-inner-01, .voice-inner-03 {
				padding:10px;
				margin:0 0 30px;
			}
			.voice-inner-02 {
				padding:10px;
				margin:0 0 30px;
			}
			.voice-inner-02 h3.choice {
				margin:20px 0 0;
				text-align:center;
			}
			.voice-inner-02 p.choice {
				font-size:12px;
				width:100%;
			}
			.voice-inner-02 ul.design {
				width:100%;
				margin:10px auto;
				overflow:hidden;
			}
			.voice-inner-02 ul.design li {
				width:48%;
				margin:0 4% 0 0;
				float:left;
			}
			.voice-inner-02 ul.design li:nth-child(even) {
				margin:0;
			}
			.voice-inner-02 p.more-pattern {
				font-size:16px;
			}
			img.voice-photo {
				width:70%;
				float:none;
				margin:0 auto;
			}
/*施工実績------------------------------------------*/
			.works {
				background:url(images/works-bg.jpg);
				padding:10px 0;
				margin:0 0 50px;
			}
			.works h2 img {
				display:block;
				margin:0 auto 10px;
				width:70%;
				max-width:100%;
			}
/*slider------------------------------------------*/
			.bx-wrapper {
				border:none !important;
			}
			.bx-wrapper .bx-pager {
				bottom: -65px !important;
			}
			
			.bx-wrapper .bx-pager a {
				margin: 0;
			}
			
			.bx-wrapper .bx-pager a:hover,
			.bx-wrapper .bx-pager a.active {
				opacity:1;
			}
			
			.bx-wrapper .bx-pager-item {
				width:12% !important;
			}
/*footer------------------------------------------*/
			#footer {
				width: auto;
				height: 100%;
				padding: 10px 0;
				display:block;
				margin:0 0 5px 0;
			}
			#footer #footer-logo {
				float: none;
				width:100%;
			}
			#footer #footer-contact {
				float: none;
				display: none;
			}
		}