@charset "UTF-8";
@media screen and (min-width: 768px),print {

#contentsmain { background-color:  #f3f2f3; height: 560px; margin-top: 53px;margin-bottom: 158px;}
#contentsmain .inner-Box { width: 1243px; margin: 0 auto; text-align: center; position: relative;}
#contentsmain .inner-Box span.subttl { font-size: 28px; font-weight: 700; letter-spacing: 1.4px; line-height: 47px; display: block; position: absolute;top: 20px;left: 490px;z-index: 1;}
#contentsmain .inner-Box h2{ width: 498px; height: 265px; background: url('../images/living/main-ttl.png')no-repeat top center; font-size: 54px; font-weight: 700; letter-spacing: 2.7px; margin: 0 auto -234px;padding-top: 142px;position: relative;top: -27px;left: -38px;padding-left: 80px;}
#contentsmain .inner-Box h2 span{ font-size: 44px; }
#contentsmain .inner-Box figure{ position: relative; left: 11px;}

#contents01 { width: 1150px; margin: 0 auto; position: relative; height: 823px; }
#contents01 .inner-Box {  padding-right: 540px;padding-left: 25px;}
#contents01 .inner-Box h2 {  position: relative;left: -50px;margin-bottom: 37px;}
#contents01 .inner-Box h2 img{  }
#contents01 .inner-Box figure{  position: absolute;right: -25px;top: 40px;}
#contents01 .inner-Box h3{  font-size: 24px;font-weight: 700;letter-spacing: 1.2px;line-height: 40px;margin-bottom: 21px;}
#contents01 .inner-Box p{  font-size: 16px;letter-spacing: 0.8px;line-height: 28px;margin-bottom: 29px;}

#contents02 { background-color: #f3f2f3; padding-top: 40px;}
#contents02 .inner-Box { width: 1150px; margin: 0 auto; position: relative; height: 793px; }
#contents02 .inner-Box h2 {  position: relative;left: -25px;margin-bottom: 37px;}
#contents02 .inner-Box h2 img{  }
#contents02 .inner-Box figure{  position: absolute;left: -25px;top: 168px;}
#contents02 .inner-Box h3{  font-size: 24px;font-weight: 700;letter-spacing: 1.2px;line-height: 40px;margin-bottom: 21px;margin-left: 544px;margin-right: 20px;}
#contents02 .inner-Box p{  font-size: 16px;letter-spacing: 0.8px;line-height: 28px;margin-bottom: 29px;margin-left: 544px;width: 580px;}

#contents03 {  width: 1100px;margin: 0 auto 117px;padding-top: 80px;}
#contents03 h2 {  text-align: center;position: relative;left: -20px;margin-bottom: -39px;}
#contents03 h2 img{  }
#contents03 figure.photo01 {  margin-bottom: -38px;}
#contents03 .inner-Box {  min-height: 428px;position: relative;}
#contents03 .inner-Box h3{  font-size: 24px;font-weight: 700;letter-spacing: 1.2px;width: 580px;line-height: 40px;margin-bottom: 20px;}
#contents03 .inner-Box figure.photo02 {  position: absolute;top: 103px;right: 0;}
#contents03 .inner-Box p{  width: 580px;font-size: 16px;letter-spacing: 0.8px;line-height: 28px;margin-bottom: 28px;}

#contentsbottom { background: url('../images/living/bottom-back.jpg')no-repeat top center; padding-top: 563px;margin-bottom: 95px;}
#contentsbottom .inner-Box { width: 1100px; margin: 0 auto; text-align: center;  }
#contentsbottom .inner-Box h2{ font-size: 32px; font-weight: 700; letter-spacing: 1.6px; line-height: 54px; margin-bottom: 10px;}
#contentsbottom .inner-Box p{ font-size: 24px; font-weight: 700; letter-spacing: 1.2px; line-height: 40px; }

.bottom-banner{ width: 750px; margin: 0 auto 104px; display: -webkit-box; display: -moz-flex; display: -ms-flex; display: -o-flex; display: -ms-flexbox; display: flex; -webkit-box-lines: multiple; -moz-box-lines: multiple; -ms-flex-wrap: wrap; flex-wrap: wrap; }
.bottom-banner li{ width: 360px; float: left; margin-right: 30px; text-align: center; }
.bottom-banner li:nth-child(2){ margin-right: 0px; }
.bottom-banner li img{ margin-bottom: 16px; }
.bottom-banner li p{ font-size: 16px; letter-spacing: 0.8px; line-height: 28px; font-weight: bold;}


}
@media screen and (max-width: 767px) {

#contentsmain { background: url('../images/living/sp-main-back.jpg')no-repeat top center; background-size: 100% auto; height: 93vw; margin-top: 6.9vw;margin-bottom: 2.6vw;}
#contentsmain .inner-Box {  margin: 0 4vw; text-align: center; position: relative;padding-top: 7vw;}
#contentsmain .inner-Box span.subttl { font-size: 3.7vw; font-weight: 700; letter-spacing: 0.3vw; line-height:1.6; display: block; z-index: 1;}
#contentsmain .inner-Box h2{  font-size: 8vw; font-weight: 700; letter-spacing: 0.3vw; margin: 0 auto -30.5vw;padding-top: 1.5vw;}
#contentsmain .inner-Box h2 span{ font-size: 5.7vw; }
#contentsmain .inner-Box figure{ margin-bottom: 4vw; }

#contents01 {  margin: 0 4vw 12vw; position: relative;  }
#contents01 .inner-Box {  }
#contents01 .inner-Box h2 {  position: relative;margin-bottom: 4.8vw;padding-right: 5vw;}
#contents01 .inner-Box h2 img{  }
#contents01 .inner-Box figure{ margin: 0 5vw 7vw; }
#contents01 .inner-Box h3{  font-size: 4vw;font-weight: 700;letter-spacing: 0.3vw;line-height:1.6;margin-bottom: 3.7vw;margin-left: 5vw;margin-right: 5vw;}
#contents01 .inner-Box p{  font-size: 3.6vw;letter-spacing: 0.3vw;line-height:1.6;margin: 0 5vw 6vw;}

#contents02 { background-color: #f3f2f3; padding-top: 10.2vw;padding-bottom: 6vw;}
#contents02 .inner-Box {  margin: 0 4vw; position: relative;  }
#contents02 .inner-Box h2 {  position: relative;margin: 0 5vw 4vw 0vw;}
#contents02 .inner-Box h2 img{  }
#contents02 .inner-Box figure{ margin: 0 5vw 4vw; }
#contents02 .inner-Box h3{  font-size: 3.8vw;font-weight: 700;letter-spacing: 0.3vw;line-height:1.6;margin-bottom: 4.7vw;margin-left: 4.7vw;margin-right: 4.6vw;}
#contents02 .inner-Box p{  font-size: 3.6vw;letter-spacing: 0.3vw;line-height:1.6;margin: 0 5vw 3.8vw;}

#contents03 {  margin: 0 auto 15.3vw;padding-top: 10.4vw;}
#contents03 h2 {  text-align: center;position: relative;margin: 0 5vw -5.1vw;}
#contents03 h2 img{  }
#contents03 figure.photo01 {  margin: 0 5vw 4vw;}
#contents03 .inner-Box {  position: relative;}
#contents03 .inner-Box h3{  font-size: 3.6vw;font-weight: 700;letter-spacing: 0.3vw;line-height:1.6;margin: 0 6vw 2.6vw;}
#contents03 .inner-Box figure.photo02 {  margin: 0 6vw 4vw;}
#contents03 .inner-Box p{  font-size: 3.6vw;letter-spacing: 0.3vw;line-height:1.6;margin: 0 6vw 3.7vw;}

#contentsbottom { background: url('../images/living/sp-bottom-back.jpg')no-repeat top center; background-size: 100% auto; padding-top: 73.4vw;margin-bottom: 12.4vw;}
#contentsbottom .inner-Box {  margin: 0 4vw; text-align: center;  }
#contentsbottom .inner-Box h2{ font-size: 5.2vw; font-weight: 700; letter-spacing: 0.3vw; line-height:1.6; margin-bottom: 2.3vw;}
#contentsbottom .inner-Box p{ font-size: 3.6vw; font-weight: 700; letter-spacing: 0.3vw; line-height:1.6; }



.bottom-banner{  margin: 0 14vw 4vw; display: -webkit-box; display: -moz-flex; display: -ms-flex; display: -o-flex; display: -ms-flexbox; display: flex; -webkit-box-lines: multiple; -moz-box-lines: multiple; -ms-flex-wrap: wrap; flex-wrap: wrap; }
.bottom-banner li{   margin-bottom: 5vw; text-align: center; }
.bottom-banner li:nth-child(2){ margin-right: 0vw; }
.bottom-banner li img{ margin-bottom: 2vw; }
.bottom-banner li p{ font-size: 3.8vw; letter-spacing: 0.3vw; line-height:1.6; font-weight: bold;}


}