﻿@charset "utf-8";
/* CSS Document */
#mamedeco{
	font-family: "游ゴシック体","游ゴシック",YuGothic,"メイリオ",Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック","MS PGothic",Osaka,sans-serif;
	font-size: 86%;
	color: #726E66;
	background:url(https://www.maedahousing.co.jp/mamedeco/images/mamedeco_line1.jpg) repeat-x bottom;
	margin-bottom:30px;
}
#mamedeco_head{
	background:url(https://www.maedahousing.co.jp/mamedeco/images/mamedeco_line1.jpg) repeat-x top;
	width:100%;
	padding-top:40px;
	padding-bottom:20px;
	margin-top:10px;
	overflow:hidden;
}
#mamedeco .wrapper{
	max-width:940px;
	width:100%;
	margin:auto;
}
#mamedeco .img100,
#mamedeco_head nav li img{
	max-width:100%;
}

#mamedeco .sp{
	display:none;
}
#mamedeco_head h2{
	float: left;
	width: 210px;
	
}
#mamedeco_head nav{
	width:650px;
	margin:auto;
	background-color: #fff;
	float: right;
}
#mamedeco_head nav li{
	width:90px;
	padding: 0 20px;
	float:left;
	text-align:center;
}
#mamedeco_head .sns li{
	width:32px;
	float: right;
	padding-left:15px;
}
#mamedeco_head .sns li img{
	width:100%;
}
#mamedeco #mainimg {
	text-align:center;
	background: url(/mamedeco/images/mainimage.jpg) no-repeat;
	background-size: cover;
	padding: 16% 0;
	width: 100%;
	font-size: 28px;
	color: #fff;
	font-weight: bold;
}
#mamedeco #mainimg p {
text-shadow: 2px 2px 1px #666;
}
#mamedeco #mainimg .box{
    float: none;
    background: #fff;
    display: inline-block;
    color: #000;
    font-weight: normal;
    font-size: 20px;
    padding: 20px 5%;
    margin-top: 2%;
    opacity: 0.9;
}
#mamedeco #mainimg img{
	width:100%;
}
#mamedeco .workshop,
#mamedeco .product,
#mamedeco .works,
#mamedeco .news{
	color:#fff;
	font-size:80%;
	text-align:center;
	border-radius:10px;
	width:100px;
	padding:1px;
	display:inline-block;
	margin-left:15px;
}
#mamedeco .workshop{
	background:#0084ff;
}
#mamedeco .works{
	background:#ff9600;
}
#mamedeco .product{
	background:#4aba00;
}
#mamedeco .news{
	background:#e6002d;
}
#mamedeco #new dd{
	padding-bottom:20px;
	padding-left: 15px;
	overflow:hidden;
	color:#434343;
}
#mamedeco #new dt{
	margin-bottom:5px;
	overflow:hidden;
	padding-left: 1em; 
    text-indent: -.7em;
}
#mamedeco #new dt:before {
    content: "• ";
    color: #e6002d;
}
#mamedeco #new{
	width: 40%;
	float: left;
}
.pb60{
	padding-bottom: 60px;
}
.pb20{
	padding-bottom: 20px;
}
#bnr{
	width: 55%;
	float: right;
}
#bnr div:nth-child(1){
	width: 48%;
	padding-right: 4%;
	float: left;
}
#bnr div:nth-child(2){
	width: 48%;
	float: left;
}
#mamedeco #footer{
	background:url(https://www.maedahousing.co.jp/mamedeco/images/mamedeco_line1.jpg) repeat-x bottom #e6002e;
	padding-top:50px;
	padding-bottom:60px;
}
#mamedeco #footer a,
#mamedeco #footer a:hover{
	color: #fff !important;
	font-size:120%;
}
@media screen and (max-width: 740px) {
#mamedeco .pc{
	display:none;
}
#mamedeco .sp{
	display:block;
}
#mamedeco_head{
	padding-bottom:30px;
}
#mamedeco #mainimg,
#mamedeco #mainimg .box {
	    font-size: 22px;
}

#mamedeco #mamedeco_head h2 img{
	width: auto;
	margin:0 auto;
}	
	#mamedeco #mamedeco_head h2{
	max-width: 50%;
	}
#mamedeco_head nav{
	width:100%;
}
#mamedeco_head nav li,
#mamedeco_head nav.fixed li.scr {
	width:50% !important;
	box-sizing: border-box;
	padding: 0 5px 2px 5px !important;
}

#mamedeco_head .sns{
		width: 40%;
		float: right;
}
#mamedeco_head .sns li {
    padding: 0 5% 20px ;
    text-align: center;
    width: 40%;
}
#mamedeco_head .sns li img{
	width:100%;
}
#mamedeco #new{
	padding:0 10px 30px 10px;
	box-sizing:border-box;
}
#mamedeco #new h2 img{
	max-width:50%;
}
#mamedeco .wrapper{
	width:98%;
	padding:0 1%;
}
#bnr,#mamedeco #new{
	width: 100%;
}

}



/* 下層ページ */

#mamedeco .contents{
	background: url(images/mamedeco_line2.jpg) repeat-x top;
}
#mamedeco .h2_style{
	padding:30px 0;
	background: url(images/mamedeco_line2.jpg) repeat-x bottom;
	text-align:center;
	margin-bottom:60px;
}
#mamedeco .h3_style{
    background: #e9e9e9 url("images/list01.jpg") no-repeat scroll 20px center;
    border-radius: 5px;
    box-sizing: border-box;
    font-size: 140%;
    margin-bottom: 30px;
    padding: 10px 20px 10px 50px;
}
#mamedeco .box_img50{
	float:left;
	width:48%;
	padding:0 1% 20px 1%;
	text-align:center;
}
#mamedeco .box_img50 img{
	max-width:100%;
}
#mamedeco .h4_style{
	background:url(images/list02.jpg) no-repeat left 7px;
	padding-left:15px;
	font-size:110%;
	text-align:left;
	margin-bottom:10px;
	color:#1F1F1F;
}

#mamedeco .mt30{
	margin-top:30px;
}
#mamedeco .mb30{
	margin-bottom:30px;
}
.box_line_red{
	width:100%;
	padding:3%;
	box-sizing:border-box;
	margin-bottom:20px;
	border:dotted 1px #eabfc7;
}
#mamedeco .box_line_red .box_img50{
	padding-bottom:0;
	}
	
.tbl01{
width: 100%;
border-collapse: collapse;
}
.tbl01 th{
width: 25%;
padding: 6px;
vertical-align: top;
color: #333;
background-color: #ffe8ed;
border: 1px solid #b9b9b9;
}
.tbl01 td{
padding: 6px;
background-color: #fff;
border: 1px solid #b9b9b9;
text-align: left;
}
.font-l{
	font-size:200%;
}
.font-up{
	font-weight:bold;
	color:#e6002d;
	font-size:150%;
}
.font-navy{
	color:#000953;
	font-size:110%;
}
.txt_l{
	text-align:left;
}
@media screen and (max-width: 740px) {
#mamedeco .h2_style{
	padding:20px 0;
	margin-bottom:30px;
}
#mamedeco .h3_style{
    box-sizing: border-box;
    margin-bottom:20px;
}
#mamedeco #workshop .box_img50{
	float:none;
	width:100%;
	padding-bottom:20px;
}
}

/* メニュー関係 */
#layout01_bg{
	position: absolute !important;
}
.scr{
	display: none;
}
.fixed .scr {
    display: inline-block;
    width: 180px !important;
    padding-top: 7px !important;
}

.fixed {
    position: fixed;
    top: 0;
    width: 100% !important;
    z-index: 10000;
	max-width: 940px;
}
.switch2 {
    max-height: 60px;
}


/* 201807追加 */
.flex-container {
	display: inline-flex;
	width: 100%;
	  -webkit-box-align: center;
     -ms-flex-align: center;
        align-items: center;

}

/*flexコンテナの高さ（または幅）いっぱいに配置*/
.flex-container.stretch {
	align-content: stretch;
}
/* 横複数行に配置 */
.flex-container.wrap {
	flex-wrap: wrap;
}
.flex-container.col4 li {
	width: 23%;
	margin: 1%;
}
.flex-container.col3 li {
	width: 31.333%;
	margin: 1%;
}
.flex-container.col2 li {
	width: 48%;
	margin: 1%;
}
.flex-container.center {
	flex-wrap: wrap;
	justify-content: center;
}
.flex-container.col4 li {
	width: 23%;
	margin: 1%;
}
.flex-container.col3 li {
	width: 31.333%;
	margin: 1%;
}
.flex-container.col2 li {
	width: 48%;
	margin: 1%;
}
.w30p {
	width: 28% !important;
	margin: 1%;
}
.w70p {
	width: 68% !important;
	margin: 1%;
}
.w20p {
	width: 18% !important;
	margin: 1%;
}
.w80p {
	width: 78% !important;
	margin: 1%;
}
.w100p {
	width: 100%;
}



#product .menu li span,
#works .menu li span{
	text-align: center;
	display: block;
}
#product .menu li,
#works .menu li{
	padding-bottom: 30px;
}
@media screen and (max-width: 740px) {
	.fixed {
		left:0;
}
	.sp_center {
	text-align: center;
}
	.pt0_sp {
	padding-top: 0px !important;
}
.pt10_sp {
	padding-top: 10px !important;
}
.pt20_sp {
	padding-top: 20px !important;
}
.pt30_sp {
	padding-top: 30px !important;
}
.pt50_sp {
	padding-top: 50px !important;
}
.pb30_sp {
	padding-bottom: 30px !important;
}
.pb50_sp {
	padding-bottom: 50px !important;
}
.mt0_sp {
	margin-top: 0px !important;
}
.mt10_sp {
	margin-top: 10px !important;
}
.mt20_sp {
	margin-top: 20px !important;
}
.mt30_sp {
	margin-top: 30px !important;
}
.flex-container.stretch, .flex-container.sp_cl {
	display: block;
}
.flex-container.col3 li, .flex-container.sp_cl li {
	width: 97% !important;
	padding: 5px 0 !important;
	box-sizing: border-box !important;
	margin: 1.5% !important;
}
.flex-container.col2_sp li, .flex-container.col4_sp li {
	width: 47% !important;
	margin: 1.5% !important;
}

.w100p_sp {
	width: 100% !important;
}
}

.case li img{
	border-radius: 15px;
}

.header,
#navi
{
	position: relative !important;
}