@charset "Shift_JIS";

/*--------------------------------------------------------
  フルCSSプロフェッショナルテンプレート部品設定
--------------------------------------------------------*/

.hpb-parts-cnt-style
{
	border-color: #E4C7A1;
}

.hpb-parts-hl-style
{
    color: #5d3800 !important;
    background-image: none !important;
    padding: 4px 3px 2px !important;
    border-color: #5d3800;
}

.hpb-parts-cbox-style
{
	border-color: #E4C7A1;
}

.hpb-parts-img-02
{
	background-color: #FFFFFF;
}

.hpb-parts-hr-style
{
    border-color: #5d3800;
}

.hpb-parts-pbox-style
{
    border-color: #E4C7A1;
}
.hpb-parts-pbox-style h4
{
    padding: 0px;
    background-image: none !important;
	padding-bottom:0 !important;
	margin-bottom:0 !important;
}
.hpb-parts-pbox-style img
{
    background-color: #FFFFFF;
}

.hpb-parts-blist-style
{
    border-color: #5d3800;
	background-color: #FAE8CB;
}
a.hpb-parts-blist-style:hover
{
	background-color: #c8e1bb;
}

/*--------------------------------------------------------
  ユーザー設定スタイル
--------------------------------------------------------*/
/*-----------------------
  Googleマップ レスポンシブ対応
-----------------------*/
.ggmap {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
}
 
.ggmap iframe,
.ggmap object,
.ggmap embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
max-height: 400px;
}

/*-----------------------
  TOPへ戻るボタン
-----------------------*/
#page-top {
    position: fixed;
    bottom: 40px;
    right: 0;
    font-size: 77%;
    z-index:99;
}
#page-top a {
    /*background: #666;
    text-decoration: none;
    color: #fff;*/
    /*width: 100px;
    padding: 30px 0;*/
    text-align: center;
    display: block;
    /*border-radius: 5px;*/
}
#page-top a:hover {
    text-decoration: none;
    /*background: #999;*/
}

#video{
  position:relative;
  height:0;
  padding:30px 0 56.25%;
  overflow:hidden;
}
#video iframe{
  position: absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
}
#main-footer-in .parts h4{
  color:#5d3800;
}
#main-footer-in .parts a{
  color:#5d3800;
}
.l{
  float:left;
}
.r{
  float:right;
}
.none{
  pointer-events: none;
}

#hpb-main .works ul li{
padding:0;
border:none;
}
.works{
position:relative;
}
.works h2{
color:#fff;
position:absolute;
top:5%;
left:30%;
right:30%;
z-index:10;
text-align:center;
}
.works p{
color:#fff;
position:absolute;
top:20%;
left:35%;
right:35%;
z-index:10;
text-align:center;
}
.works a.btn{
color:#fff;
position:absolute;
left:35%;
right:35%;
bottom:5%;
z-index:10;
text-align:center;
border:2px solid;
width:150px;
margin:0 auto;
text-decoration:none;
}
a.btn{
text-align:center;
width:150px;
margin:0 auto;
text-decoration:none;
display:block;
position:static;
margin-top:10px;
border:2px solid #000;
color:#544f3f;
}
#contact a.btn{
background-color:#fff;
}
#contact a.btn:hover{
background-color:#000;
}
.subtitle{
  position:relative;
  background-position:center center;
  background-repeat:no-repeat;
  background-size:cover;
}
.subtitle h2{
  /*color:#fff;*/
  padding-top:2.5%;
  padding-bottom:2.5%;
  margin-top:0;
  text-align:center;
  color:#333;
}
.subtitle p{
  /*color:#fff;*/
  /* padding-bottom:2%; */
  /* margin-top:0; */
  /* text-align:center; */
  /* color:#333; */
}
.aa1{
  /*background-image:url(../image/01s.png);*/
  background-color:#cce5f3;
}

.worklist{
  float: left;
  width: 300px;
  margin-right: 25px;
}

.worklist:last-child{
  margin-right: 0;
}

#photo{
    width:65%;
}



#hpb-main .box{
	width:100%;
	clear: both;
}

#hpb-main .box-child{
	width:50%;
	float: left;
}
#hpb-main .box-child img{
	width:100%;
}
#hpb-main .box-child ul li{
	width:30%;
	float:left;
	padding:5px 8px;
	border:none;
}

#hpb-main h3.midashi{
	border-bottom: solid 2px #ccc;
	position: relative;
	text-align:left;
	margin-bottom:20px;
}
#hpb-main h3.midashi:after {
	position: absolute;
	content: " ";
	display: block;
	border-bottom: solid 2px #333;
	bottom: -2px;
	width: 20%;
}

#hpb-main h4.midashi{
	padding: 10px 15px 8px;
	background-color: #efefef;
	border-radius: 4px;
}
#hpb-main h4.midashi:before {
  content: '●';
  color: white;
  margin-right: 8px;
}

/* =======================================================
  レスポンシブル設定
======================================================= */
@media screen and (max-width: 960px) {

	.hpb-parts-hl-08 {
		background: none !important;
		border-color: #5d3800 !important;
	}
	.hpb-parts-hl-07 {
		background: none !important;
		border-color: #5d3800 !important;
	}
	.hpb-parts-hl-06 {
		background: none !important;
	}
	.hpb-parts-hl-05 {
		background: none !important;
		border-color: #5d3800 !important;
	}
	.hpb-parts-hl-04 {
		background: none !important;
		border-color: #5d3800 !important;
	}
	.hpb-parts-hl-03 {
		background: none !important;
		border-color: #5d3800 !important;
	}
	.hpb-parts-hl-02 {
		background: none !important;
		border-color: #5d3800 !important;
	}
	.hpb-parts-hl-01 {
		background: none !important;
	}

.l, .r{
  float:none;
}
/*.header{
  width:auto;
}*/

.works p{
top:37%;
}

.works{
text-align:center;
padding-bottom:30px;
}

.works h2{
top:0;
}
.works p{
display:none;
}

.works a.btn{
display:none;
}
.works a.btn.hidden{
display:block;
position:static;
margin-top:10px;
border:2px solid #000;
color:#544f3f;
}
.works a.btn.hidden:hover{
color:#fff;
}

.worklist{
  float: none;
  margin-right: 0;
  margin-bottom: 20px;
}

#photo{
    width:100%;
}




#hpb-main .box{
	width:100%;
	clear: both;
}

#hpb-main .box-child{
	width:100%;
	float: none;
}
#hpb-main .box-child img{
	width:100%;
}
#hpb-main .box-child ul li{
	width:30%;
	float:left;
	padding:1% 2.5%;
	border:none;
}

#hpb-main .box-child ul li:nth-child(1),
#hpb-main .box-child ul li:nth-child(4),
#hpb-main .box-child ul li:nth-child(7){
	padding-left:0;
}
#hpb-main .box-child ul li:nth-child(3),
#hpb-main .box-child ul li:nth-child(6),
#hpb-main .box-child ul li:nth-child(9){
	padding-right:0;
}

}