@charset "utf-8";
/* 無添加住宅リフォーム */


#S03 .cap,
#S04 .cap {
	text-align:left;
	font-size:10px;
}

#reform h2{
    text-align: center;
}


#S01 ul{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    padding: 0;
    margin: 40px 0 0;
}

#S01 p{
text-align: center;
}

#S01 .contents {
   background-image:url("/wp-content/themes/original-child/assets/img/reform_01_bg.jpg");
}

#reform h3{
    font-size: 20px;
    padding: 20px 0;
    letter-spacing: 3px;
    text-align: left;
    font-weight: 600;
    line-height: 1.4em;
    border-bottom: 1px solid #666666;
    margin: 0 0 20px;
}

#S01 ul li{
    width: 32.9%;
    padding: 0;
}

#S01 ul li img{
width: 100%;
}


 .contentsDetail img{
    width: 100%;
}

#S02 ul{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    padding: 0;
    margin: 40px 0 0;
}


#S02 ul li img{
width: 100%;
}

#S02 .contentsDetail div{
width: 100%;
max-width: 960px;
margin: auto;
}


#S02 .contentsDetail ul li{
    background-color: #FFF;
    margin-bottom: 20px;
    width:47%
	
}


#S02 .contentsDetail ul li h4{
    font-size: 18px;
    padding: 10px 0 10px;
	position: relative;
}

#S02 .contentsDetail ul li p{
padding: 0;
}

#S02 .contentsDetail ul li span{
    margin-right: 8px;
    padding: 0px 8px 3px;
    width: 10px;
    background: #000;
    color: #FFF;
    left: 0;
}



#S02 .contents,#S04 .contents{
background: #F4F4F4;
}


#S03 .contentsDetail div{
width: 100%;
max-width: 960px;
margin: auto;
}

#S03 .contentsDetail ul{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    padding: 0;
    margin: 40px 0 0;
}

#S03 .contentsDetail ul li{
    background-color: #F4F4F4;
    margin-bottom: 20px;
    width:47%
	
}

#S03 .contentsDetail ul li img{
width: 100%;
}



#S03 .contentsDetail div p,
#S04 .contentsDetail div p{
margin-top:20px;
}

#S04 .contentsDetail div{
width: 100%;
max-width: 960px;
margin: auto;
}

#S04 .contentsDetail ul{
    display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

#S04 .contentsDetail ul li{
    width: 32%;
    padding: 0;
}

#S03 .contentsDetail ul li h4{
    font-size: 18px;
    padding: 10px 0 10px;
	position: relative;
}

#S03 .contentsDetail ul li p{
padding: 0;
}

#S03 .contentsDetail ul li span{
    margin-right: 8px;
    padding: 0px 8px 3px;
    width: 10px;
    background: #000;
    color: #FFF;
    left: 0;
}



/*----------------------------------------------------------- 820px */
@media screen and (max-width: 820px) {
	
#S01,#S01 p{
	text-align: left;
}
	
#reform .contentsDetail div p {
/*    font-size: 16px;*/
    text-align: left;
}	

.contentsDetail div {
    margin: 0px 0 20px;
}	
	
#S01 .contentsDetail {
    background-color: #F5F2F2;
    margin-top: 0;
}	
	
}
/*----------------------------------------------------------- 680px */
@media screen and (max-width: 680px) {

#S01 ul li {
    width: 100%;
    padding: 0;
}

#S02 .contentsDetail ul li {
    width: 100%;
}

#S03 .contentsDetail ul li {
    width: 100%;
}

#S04 .contentsDetail ul li {
    width: 100%;
    padding: 0;
}	
	
}
/*----------------------------------------------------------- 580px */
@media screen and (max-width: 580px) {

}
/*----------------------------------------------------------- 540px */
@media screen and (max-width: 540px) {
}
/*----------------------------------------------------------- 480px */
@media screen and (max-width: 480px) {
}
/*----------------------------------------------------------- 375px */
@media screen and (max-width: 375px) {

}