@charset "utf-8";
/*!
* general CSS
* ---------------------------------------------
* 汎用ページのみ適用されるCSSです
*/

/* contentTitle
----------------------------------------------- */
header.h2tl {
position: relative;
margin-bottom: 20px;
display: block;
width: 100%;
line-height: 50px;
background: rgba(180,134,69,0.5);
}
header.h2tl:before {
content: '';
position: absolute;
bottom: 5px;
left: 0;
display: block;
width: 100%;
height: 1px;
background: #ffffff;
}
header .headerWrap h2 {
position: relative;
display: block;
width: 100%;
}
header .headerWrap h2:before {
content: '';
position: absolute;
bottom: 4px;
left: 0;
display: block;
width: 10em;
height: 3px;
background: #ffffff;
}

#Error header.h2tl {
display: none!important;
}
header .headerWrap {
margin: 0 auto;
width: 960px;
}

/* contentWrap
----------------------------------------------- */
.container {
display: block;
margin: 0 auto 0 auto;
width: 960px;
}

/* h3〜h5
----------------------------------------------- */
.contentWrap h3 {
position: relative;
margin: 0 0 10px 0;
padding: 0 0 0 1.5em;
}
.contentWrap h3::before {
content: '';
position: absolute;
top: 0;
left: 0;
display: block;
width: 10px;
height: 100%;
background: #552E31;
border-radius: 4px;
}
.contentWrap h3::after {
content: '';
position: absolute;
top: 0;
left: 15px;
display: block;
width: 7px;
height: 100%;
background: #f08300;
border-radius: 4px;
}
.contentWrap h4 {
position: relative;
margin: 0 0 10px 0.3em;
padding: 0 0 0 1.5em;
}
.contentWrap h4::before {
content: '';
position: absolute;
top: 0;
left: 0;
display: block;
width: 13px;
height: 14px;
background: #552E31;
border-radius: 4px;
}
.contentWrap h4::after {
content: '';
position: absolute;
top: 6px;
left: 6px;
display: block;
width: 13px;
height: 14px;
background: #E16362;
border-radius: 4px;
}
.contentWrap h5 {
position: relative;
margin: 0 0 10px 0;
padding: 0 0 0 1.5em;
}
.contentWrap h5::before {
content: '';
position: absolute;
top: 5px;
left: 5px;
display: block;
width: 13px;
height: 14px;
background: #552E31;
border-radius: 4px;
}
.contentWrap h6 {
font-weight: bold;
margin: 0 0 10px 0;
}

/* ul,ol
----------------------------------------------- */
.contentWrap ol, .contentWrap ul {
margin: 0 0 15px 0;
}
.contentWrap ol li {
list-style-type: decimal;
list-style-position: inside;	
}
.contentWrap ul li {
list-style-type: disc;
list-style-position: inside;	
}

/* news
----------------------------------------------- */
#News .postList .postList {
margin: 0 0 20px 0;
}
#News .postList {
margin: 0 0 20px 0;
}

#News .postList .postWrap {
display: table;
width: 100%;
border-bottom: 1px solid #552E31;
}
#News .postList .postWrap h3 {
display: inline-block;
position: relative;
margin: 0 0 10px 0;
padding: 0 0 0 1.5em;
}
#News .postList .postWrap h3::before {
content: '';
position: absolute;
top: 0;
left: 0;
display: block;
width: 10px;
height: 100%;
background: #552E31;
border-radius: 4px;
}
#News .postList .postWrap h3::after {
content: '';
position: absolute;
top: 0;
left: 15px;
display: block;
width: 7px;
height: 100%;
background: #f08300;
border-radius: 4px;
}

#News .postList .thume {
margin: 0 10px 0 0;
display: table-cell;
width: 220px;
vertical-align: top;
}
#News .postList .thume img {
width: 200px;
}
#News .postList .dateWrap {
display: inline-block;
width: 100%;
vertical-align: top;
word-break: break-all;
overflow-wrap : break-word;
}
#News .postList .time {
margin: 0 0 0 2em;
width: auto;
}
#News .postList .date {
display: inline-block;
width: 100%;
}
#News .postList .category {
margin: 0 0 10px 0;
display: inline-block;
width: 100%;
text-align: right;
}
#News .postList .category:empty {
display: none!important;
}
#News .postDetail .meta span.category a,
#News .postList .category a {
padding: 0 10px;
display: inline-block;
width: auto;
border: 1px solid #552E31;
border-radius: 10px;
color: #552E31;	
text-decoration: none;
-webkit-transition: all .3s;
transition: all .3s;
}
#News .postDetail .meta span.category a:hover,
#News .postList .category a:hover {
background: #552E31;
color: #ffffff;
}

#News .postList .excerpt {
margin: 0 0 15px 0;
display: block;
}

#News .postList .tag {
margin: 0 0 10px 0;
text-align: right;
border-top: 2px dotted #552E31;
}
#News .postList .tag a {
margin: 10px 5px 0 0;
display: inline-block;
}
#News .postDetail .meta {
text-align: right;
}

#News .postDetail .meta span {
margin: 0 0 15px 0;
display: block!important;
}

/* flow
----------------------------------------------- */
#Flow .contentWrap h3 {
margin: 0 0 10px 0;
padding: 0;
border: 2px solid #bfd62f;
}
#Flow .contentWrap h3::before,
#Flow .contentWrap h3::after {
display: none!important;
background: none;
}
#Flow .h3tl span {
margin: 0 10px 0 0;
padding: 0 1em;
display: inline-block;
background: #dbedc4 url("../img/btn_news_list.png")  -5px top no-repeat;	
}
#Flow section {
margin: 0 0 50px 0;
}
#Flow section .text {
margin: 0 30px 0 10px;
display: inline-block;
width: 60%;
vertical-align: top;
}
#Flow section .text p {
margin: 0 0 2em 0;
}
#Flow section .image {
margin: 20px 0 0 0;
display: inline-block;
width: 315px;
text-align: center;
vertical-align: middle;
border: 1px solid #552E31;
border-right: 2px solid #552E31;
border-bottom: 2px solid #552E31;
border-radius: 10px;
}
#Flow section img {
padding: 20px;
display: inline-block;
}


/* works
----------------------------------------------- */

/* works index
------------------------ */

#Works .caseWrap {
margin: 0 auto;
width: 815px;
text-align: center;
}
#Works .caseWrap div {
display: inline-block;
}
#Works .case01, 
#Works .case02, 
#Works .case03 {
margin: 0 0 50px 0;
}
#Works .caseWrap .top, 
#Works .caseWrap .bottom {
width: 100%;
text-align: center;
}
#Works .caseWrap .top {
margin: 0 0 30px 0;
}
#Works .caseWrap a {
display: inline-block;
width: 100%;
height: 100%;
text-decoration: none;
font-size: 14pt;
}
#Works .caseWrap a span {
margin: 30px 0 0 0;
display: block;
}
#Works .caseWrap a:hover {
color: #552E31;
background: rgba(240,131,0,0.2);
border-radius: 10px;
}
#Works .caseWrap .parts, 
#Works .caseWrap .apartment, 
#Works .caseWrap .all, 
#Works .caseWrap .housing, 
#Works .caseWrap .kitchen, 
#Works .caseWrap .washroom, 
#Works .caseWrap .toilet, 
#Works .caseWrap .other, 
#Works .caseWrap .bath, 
#Works .caseWrap .wall, 
#Works .caseWrap .roof_tile, 
#Works .caseWrap .exterior, 
#Works .caseWrap .interior, 
#Works .caseWrap .entrance {
position: relative;
width: 250px;
height: 240px;
border-right: 1px solid #552E31;
border-bottom: 1px solid #552E31;	
border-radius: 10px;
text-align: center;
}
#Works .caseWrap .parts, 
#Works .caseWrap .apartment, 
#Works .caseWrap .kitchen, 
#Works .caseWrap .washroom, 
#Works .caseWrap .toilet, 
#Works .caseWrap .other, 
#Works .caseWrap .exterior {
margin: 0;
}
#Works .caseWrap .all,
#Works .caseWrap .housing {
margin: 0 30px 0 0;
}
#Works .caseWrap .bath, 
#Works .caseWrap .wall, 
#Works .caseWrap .interior {
margin: 0 30px;
}
#Works .caseWrap .parts::after, 
#Works .caseWrap .apartment::after, 
#Works .caseWrap .all::after, 
#Works .caseWrap .housing::after, 
#Works .caseWrap .kitchen::after, 
#Works .caseWrap .bath::after, 
#Works .caseWrap .washroom::after, 
#Works .caseWrap .toilet::after, 
#Works .caseWrap .wall::after, 
#Works .caseWrap .other::after, 
#Works .caseWrap .roof_tile::after, 
#Works .caseWrap .exterior::after, 
#Works .caseWrap .interior::after, 
#Works .caseWrap .entrance::after {
content: "";
background: url("../img/work_ic_bk.png")  left top no-repeat;
bottom: 0;
right: 0;
position: absolute;
z-index: 1;
width: 45px;
height: 46px;		
}
#Works .caseWrap .all {
background: #faf6ed url("../img/work_ic01.png") 50% 70% no-repeat;
}
#Works .caseWrap .parts {
background: #faf6ed url("../img/work_ic02.png") 50% 70% no-repeat;
}
#Works .caseWrap .housing {
background: #faf6ed url("../img/work_ic03.png") 50% 70% no-repeat;
}
#Works .caseWrap .apartment {
background: #faf6ed url("../img/work_ic04.png") 50% 70% no-repeat;
}
#Works .caseWrap .kitchen {
background: #faf6ed url("../img/work_ic05.png") 50% 70% no-repeat;
}
#Works .caseWrap .bath {
background: #faf6ed url("../img/work_ic06.png") 50% 70% no-repeat;
}
#Works .caseWrap .washroom {
background: #faf6ed url("../img/work_ic07.png") 50% 70% no-repeat;
}
#Works .caseWrap .toilet {
background: #faf6ed url("../img/work_ic08.png") 50% 70% no-repeat;
}
#Works .caseWrap .wall {
background: #faf6ed url("../img/work_ic09.png") 50% 70% no-repeat;
}
#Works .caseWrap .other {
background: #faf6ed url("../img/work_ic10.png") 50% 70% no-repeat;
}
#Works .caseWrap .roof_tile {
background: #faf6ed url("../img/work_ic11.png") 50% 70% no-repeat;
}
#Works .caseWrap .exterior {
background: #faf6ed url("../img/work_ic12.png") 50% 70% no-repeat;
}
#Works .caseWrap .interior {
background: #faf6ed url("../img/work_ic13.png") 50% 70% no-repeat;
}
#Works .caseWrap .entrance {
background: #faf6ed url("../img/work_ic14.png") 50% 70% no-repeat;
}
#Works .caseLast {
text-align: left!important;
}

/* works post list
------------------------ */
#Works .postList {
margin: 0 5px 15px 5px;
padding: 0;
border-radius: 10px;
display: inline-block;
max-width: 306px;
border: 1px solid #552E31;	
box-sizing: border-box;
vertical-align: top;
}
#Works .postWrap {
position: relative;
}
#Works .postList h3.title {
margin: 30px 0 20px 10px;
padding: 0;
text-align: left;
}
#Works .postList h3::before,
#Works .postList h3::after {
display: none;
}
#Works article .entryList {
margin: 0 0 30px 0;	
}
#Works .listCateTl,
#Question .listCateTl {
display: block;
font-size: 13pt;
border-top: 2px dotted #BFD62F; 
}
#Works .listCateTl span,
#Question .listCateTl span {
display: block;
line-height: 2.5;
}
#Works .widget-area-1,
#Question .widget-area-5 {
border-bottom: 2px dotted #BFD62F; 
}
#Works .widget-area-1 li,
#Question .widget-area-5 li {
display: inline-block;	
}
#Works .widget-area-1 ul li a,
#Question .widget-area-5 ul li a {
text-decoration: none;
background: rgba(191,214,47,0.4);
}
#Works .widget-area-1 .depth-1,
#Question .widget-area-5 .depth-1 {
margin: 0!important;
}
#Works .widget-area-1 .depth-1 li,
#Question .widget-area-5 .depth-1 li {
margin: 0 20px 0 0;
}
#Works .widget-area-1 .depth-1 li a,
#Question .widget-area-5 .depth-1 li a {
margin: 0 0 10px 0;
padding: 0 1.5em;
display: inline-block;
line-height: 30px;
border: 1px solid #BFD62F;
border-radius: 5px;
box-sizing: border-box;
vertical-align: bottom;
}
#Works .widget-area-1 .depth-2,
#Question .widget-area-5 .depth-2 {
margin: 0 0 5px 0;
}
#Works .widget-area-1 .depth-2 li,
#Question .widget-area-5 .depth-2 li {
margin: 0 15px 0 0;
}

#Works .widget-area-1 .depth-2 li a,
#Question .widget-area-5 .depth-2 li a {
display: inline-block;
width: auto!important;
background: rgba(240,131,0,0.4);
border: 1px solid #f08300;
}
#Works .postList .thume {
margin: 10px 0 0 0;
height: 210px;
border-bottom: 1px solid #552E31;
box-sizing: border-box;
overflow: hidden;
}
#Works .postList .date {
position: absolute;
top: 195px;
left: 0;
margin: 0;
display: inline-block;
line-height: 1.0;
text-align: left;
background: #552E31;
border-radius: 0 10px 10px 0;
color: #ffffff;
font-size: 9pt;
}
#Works .postList .category {
margin: 10px;
}
#Works .postList .category a {
text-decoration: none;
color: #ffffff;
}
#Works .postList .category a:hover {
text-decoration: underline;
background: none;
}
#Works .postList .excerpt {
margin: 10px;
text-align: left;
}
#Works .postList .thume .eyeCatch {
width: 100%;
}
#Works .postList .tag {
margin: 10px;
}
#Works .postList .tag a {
margin: 5px 0 0 0;
display: inline-block;
}
#Works .postList .time {
margin: 10px;
}

/* works post detail
------------------------ */
#Works .articleDitail header {
margin-bottom: 20px;
border-bottom: 1px dashed #552E31;
}
#Works .articleDitail .date {
margin-bottom: 10px;
display: block;
}
#Works .img-eye-catch {
float: none!important;
}
#Works .articleDitail dl.meta {
margin-bottom: 10px;
display: block;
}
#Works .articleDitail dl dt,
#Works .articleDitail dl dd {
display: inline-block;
}
#Works .articleDitail dl dd.category {
margin-right: 5px;
}
#Works .articleDitail dl dt.tag {
margin: 0;
}
#Works .post-body {
margin: 0;
display: none;
}
#Works .beforeAfter  {
margin-bottom: 20px;
padding-top: 20px;
}

#Works .worksSummary header, 
#Works .beforeAfter header {
padding: 5px;
font-size: 13pt;
background: rgba(240,131,0,0.4);
border-bottom: 0px!important;
border-radius: 5px;
}
#Works .beforeAfter .comment {
margin: 10px 0 20px 0;
}
#Works .beforeAfter .comment li {
margin-left: 1em!important;
}
#Works .beforeTable {
vertical-align: top;
}
#Works .afterTable {
vertical-align: top;
}
#Works .beforeTable img,
#Works .afterTable img, 
#Works .otherTable img {
margin: 0!important;
}
#Works .beforeTable .beforeTl,
#Works .afterTable .afterTl {
border-bottom: 2px solid #552E31;	
font-size: 12pt;
}
#Works .beforeTable dd a, 
#Works .afterTable dd a {
margin-left: 10px;
}
#Works .otherTable a {
margin: 0 10px 10px 0;
}
#Works .beforeTable .beforeTl2,
#Works .afterTable .afterTl2 {
margin: 10px 0 5px 0;
border-bottom: 1px dashed #552E31;	
font-size: 12pt;
}
#Works .beforeTable dt,
#Works .afterTable dt {
margin-bottom: 1em;
display: block!important;
}
#Works .beforeTable dd,
#Works .afterTable dd {
display: block!important;
}


#Works .eye-catch {
margin-bottom: 1em;
}
#Works .beforeAfter .summaryComment {
margin-bottom: 1.5em;
}
#Works .summaryTable {
width: 100%;
display: table;
}
#Works .beforeBox .head {
margin-bottom: 1em;
font-size: 12pt;
border-bottom: 2px solid #552e31;
}
#Works .afterBox .head {
margin-bottom: 1em;
font-size: 12pt;
border-bottom: 2px solid #552e31;
}
#Works #post-detail {
padding-left: 0!important;
}

#Works #post-detail a.cboxElement {
margin: 1%;
display: inline-block;
}
#Works #post-detail a.cboxElement img {
width: 100%;
}


/* aboutus
----------------------------------------------- */
#Aboutus dl.aboutList {
margin: 0 10px 0 0;	
display: inline-block;
width: 460px;
vertical-align: top;
}
#Aboutus .aboutList dt {
display: inline-block;
margin: 0 0 10px 0;
padding: 0 10px 0 5px;
background: rgba(240,131,0,0.4);
border-radius: 5px;
border-left: 10px solid #552E31;	
}
#Aboutus .aboutList dd {
margin: 0 0 20px 0;
border-bottom: 1px dashed #552E31;
}
#Aboutus .gmap {
display: inline-block;
width: 460px;
height: 460px;
overflow: hidden;
}
#Aboutus .gmapWrap {
width: 100%;
height: 100%;
background: gray;
}
#Aboutus .gmap p {
display: inline-block;
margin: 0 0 10px 0;
padding: 0 10px 0 5px;
background: rgba(240,131,0,0.4);
border-radius: 5px;
border-left: 10px solid #552E31;	
}
#Aboutus .gmap iframe {
width: 100%;
height: 100%;
aspect-ratio: 16 / 9;
}
/* question
----------------------------------------------- */
#Question .contentWrap section {
margin: 0 0 30px 0;
}
#Question .postList {
margin: 0 0 40px 0;
padding: 0 0 10px 0;
display: block;
border-bottom: 1px dotted #552E31;
}
#Question .postList h3 {
position: relative;
margin: 0 0 10px 0;
padding: 0 0 0 2.5em;
}
.contentWrap .postList h3::before {
content: 'Q.';
position: absolute;
top: 0;
left: 0;
display: block;
width: 40px;
height: 100%;
background: rgba(240,131,0,0.4);
border-radius: 15px;
text-align: center;
}
#Question .postList h3::after {
content: '';
position: absolute;
top: 0;
left: 15px;
display: none;
width: 7px;
height: 100%;
background: #f08300;
border-radius: 4px;
}
#Question .postList .category {
margin: 0 0 0 2.5em;
display: block;
}
#Question .postList .category a {
padding: 0 10px;
line-height: 1.7;
box-sizing: border-box;
vertical-align: bottom;
font-size: 10pt;
text-decoration: none;
}
#Question .postList .category a:hover {
background: rgba(191,214,47,0.4);
border-radius: 5px;
}

/* question post detail
------------------------ */
#Question header.category {
margin: 0px 0 20px 0;
padding: 0 0 0 0.5em;
font-size: 16pt;
border-left: 10px solid	rgba(180,134,69,0.5);
}
#Question header.category a {
text-decoration: none;
}
#Question header.h3tl {
margin: 0 0 30px 0;
}
#Question header.h3tl h3 {
position: relative;
margin: 0 0 10px 0;
padding: 0 0 0 2.5em;
}
#Question header.h3tl h3::before {
content: 'Q.';
position: absolute;
top: 0;
left: 0;
display: block;
width: 40px;
height: 100%;
background: rgba(240,131,0,0.4);
border-radius: 15px;
text-align: center;
}
#Question header.h3tl h3::after {
content: '';
position: absolute;
top: 0;
left: 15px;
display: none;
width: 7px;
height: 100%;
background: #f08300;
border-radius: 4px;
}

#Question .postDetail #post-detail {
margin: 0 0 20px 0;
}
#Question .eye-catch:empty {
display: none!important;	
}
#Question .meta {
padding: 10px 0 0 0;
}
#Question .meta span {
margin: 0 0 0 0;
}

/* publication
----------------------------------------------- */
#Publication .contentWrap {
display: block;
text-align: center;
}
#Publication .contentWrap a {
margin: 0 20px 20px 0;
display: inline-block!important;
}

#Publication .contentWrap img {
}