@charset "UTF-8";



.layout_back {padding: 60px 0 10px; background-image: url(images/layout_back.gif);background-position: center;}
.layout {width: 1000px; margin: 0 auto 60px;padding:0;text-align: left; background: #ffffff url(../images/layout_lobo.jpg) right top no-repeat;position: relative;}
.layout dl {margin: 0 60px;}
.layout dl dt {font-size: 20px;line-height: 30px;font-family: YuMincho, "游明朝体", "Yu Mincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;margin: 0 0 30px;padding: 60px 0 0 ;}
.layout dl dt:before {
content: '';
position: absolute;
left: 115px;
top: -12px;/*線の上下位置*/
display: inline-block;
width: 110px;/*線の長さ*/
height: 24px;/*線の太さ*/
-moz-transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);/*位置調整*/
background-color: #565a36;/*線の色*/
}
.layout dl dd {font-size: 14px;line-height: 24px;margin: 0 0 20px;}
.layout dl dd p.no {font-size: 12px;line-height: 1em;padding: 8px 16px;margin: 0 0 10px; color: #ffffff;display: inline-block;background: #85a742;}
.layout .layout_plan {width: 100%;}
.layout .layout_plan img {width: 100%;}

#outline_layout {width: 1000px;margin: 60px auto;}
#outline_layout img {width: 65%;}


@media screen and (max-width: 1020px) {
.layout_back {padding: 60px 0 10px; background-image: url(images/layout_back.gif);background-position: center;}
.layout {width: 90%; margin: 0 auto 60px;padding:0;text-align: left; background: #ffffff url(../images/layout_lobo.jpg) right top no-repeat;position: relative;background-size: 22%;}

.layout dl {margin: 0 5%;}
.layout dl dt {font-size: 16px;line-height: 26px;font-family: YuMincho, "游明朝体", "Yu Mincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;margin: 0 0 30px;padding: 30px 0 0 ;}
.layout dl dt:before {
content: '';
position: absolute;
left: 80px;
top: -12px;/*線の上下位置*/
display: inline-block;
width: 90px;/*線の長さ*/
height: 24px;/*線の太さ*/
-moz-transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);/*位置調整*/
background-color: #565a36;/*線の色*/
}

.layout dl dd {font-size: 14px;line-height: 24px;margin: 0 0 5%;}
.layout dl dd p.no {font-size: 12px;line-height: 1em;padding: 8px 16px;margin: 0 0 10px; color: #ffffff;display: inline-block;background: #85a742;}
.layout .layout_plan {width: 100%;}
.layout .layout_plan img {width: 100%;}
#outline_layout {width: 90%;margin: 5% auto;}
#outline_layout img {width: 100%;}

}
@media screen and (max-width: 767px) {
.layout_back {padding: 10% 0 1%; background-image: url(images/layout_back.gif);background-position: center;}
.layout {width: 90%;height: auto; margin: 0 auto 10%;padding:0;text-align: left; background: #ffffff url(../images/layout_lobo.jpg) right top no-repeat ;background-size: 33%; position: relative;}

.layout dl {margin: 0 5%;}
.layout dl dt {width: 70%; font-size: 10px;line-height: 16px;font-family: YuMincho, "游明朝体", "Yu Mincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;margin: 0 0 5%;padding: 7% 0 0 ;}
.layout dl dt:before {
content: '';
position: absolute;
left: 15%;
top:-8px;/*線の上下位置*/
display: inline-block;
width: 20%;/*線の長さ*/
height: 16px;/*線の太さ*/
-moz-transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);/*位置調整*/
background-color: #565a36;/*線の色*/
}
.layout dl dd {font-size: 12px;line-height: 22px;margin: 0;}
.layout dl dd p.no {font-size: 10px;line-height: 1em;padding: 8px 16px;margin: 0 0 10px; color: #ffffff;display: inline-block;background: #85a742;}
.layout .layout_plan {width: 100%;margin: 0 auto;position: inherit;left:inherit;right: inherit; top: inherit;bottom: inherit;}
.layout .layout_plan img {width: 100%;}
#outline_layout {width: 90%;margin: 5% auto;}
#outline_layout img {width: 100%;}
}


br.sph {display: none;}
br.pc {display: block;}
br.tab {display: none;}
@media screen and (max-width: 1020px) {
br.sph {display: none;}
br.pc {display: block;}
br.tab {display: block;}
}
@media screen and (max-width: 767px) {
br.sph {display: block;}
br.pc {display: none;}
br.tab {display: none;}
}