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

#contentsmain {   margin-bottom: 96px;}
#contentsmain .inner-Box1 { text-align: center; width: 1100px; margin: 0 auto -140px; padding-top: 36px;}
#contentsmain .inner-Box1 h2{ width: 530px; height: 80px; border-radius: 40px; background-color: #2686d1; color: #fff; font-size: 40px; font-weight: 700; margin: 0 auto -40px; position: relative;}
#contentsmain .inner-Box1 figure.photo1 {  margin-bottom: -85px;}
#contentsmain .inner-Box1 p{ font-size: 24px; font-weight: 700; letter-spacing: 1.2px; line-height: 1; }
#contentsmain .inner-Box1 p span{ background: #fff; padding: 17px 25px; display: inline-block; margin-bottom: 6px; }
#contentsmain .inner-Box2 {  background-color: #f4efe7;padding-top: 193px;padding-bottom: 284px;margin-bottom: -202px;}
#contentsmain .inner-Box2 figure.photo2 { position: absolute; top: 0; left: 0; }
#contentsmain .inner-Box2 .inbox { width: 1280px; margin: 0 auto;  min-height: 432px; position: relative; }
#contentsmain .inner-Box2 .textbox { background: #fff; padding: 56px 60px 20px 60px; width: 640px; position: absolute; top: 53px; right: 40px; }
#contentsmain .inner-Box2 .inbox .textbox h3{ font-size: 24px; font-weight: 700; letter-spacing: 1.2px; line-height: 40px; margin-bottom: 23px;}
#contentsmain .inner-Box2 .inbox .textbox p{ font-size: 16px; letter-spacing: 0.8px; line-height: 28px; margin-bottom: 30px;}

#contentsmain .inner-Box3 { width: 1100px; background-color: #f3f2f3; margin: 0 auto; }
#contentsmain .inner-Box3 h4{ color: #ffffff; font-size: 24px; font-weight: 700; letter-spacing: 1.2px; text-align: center; background-color: #332e1b; padding: 9px;margin-bottom: 36px;}
#contentsmain .inner-Box3 ul{ padding-left: 326px;  margin-bottom: 35px;}
#contentsmain .inner-Box3 ul li{ position: relative; font-size: 22px; letter-spacing: 1.1px; margin-bottom: 10px; }
#contentsmain .inner-Box3 ul li p{  }
#contentsmain .inner-Box3 ul li span{ position: absolute; top: -9px; left: -35px; display: block;}
#contentsmain .inner-Box3 .inbox{ text-align: center; background-color: #ffe412; height: 140px; position: relative; padding-top: 21px;line-height: 1.6;}
#contentsmain .inner-Box3 .inbox::before{position: absolute;bottom: -8px;left: 110px;}
#contentsmain .inner-Box3 .inbox::after{ content: url('../images/renovation/main-photo04.png'); position: absolute; bottom: -8px; right: 110px; }
#contentsmain .inner-Box3 .inbox p{ text-align: center; font-size: 32px; font-weight: 700; letter-spacing: 1.6px; }
#contentsmain .inner-Box3 .inbox p span{ font-size: 22px; display: block; }

#contents01 { width: 1200px; margin: 0 auto 80px; }
#contents01 span.no { display: block; margin-bottom: 18px;}
#contents01 h2{ width: 1200px; height: 160px; text-align: center; background: url('../images/renovation/contents-ttlback.png')no-repeat top center; padding-top: 37px;color: #ffffff;font-size: 32px;font-weight: 700;letter-spacing: 1.6px;line-height: 1;}
#contents01 .inner-Box { background-color: #f4efe7; border-bottom: 30px solid #2686d1; padding-top: 55px;padding-bottom: 31px;}
#contents01 .inner-Box .inbox { margin: 0 80px; position: relative; padding-right: 540px }
#contents01 .inner-Box h3{ font-size: 24px; font-weight: 700; letter-spacing: 1.2px; margin-bottom: 17px; }
#contents01 .inner-Box figure{ position: absolute; top: 5px; right: 0; }
#contents01 .inner-Box p{ font-size: 16px; letter-spacing: 0.8px; line-height: 28px; margin-bottom: 30px; }

#contents02 { width: 1200px; margin: 0 auto 80px; }
#contents02 span.no { display: block; margin-bottom: 18px;}
#contents02 h2{ width: 1200px; height: 160px; text-align: center; background: url('../images/renovation/contents-ttlback.png')no-repeat top center; padding-top: 37px;color: #ffffff;font-size: 32px;font-weight: 700;letter-spacing: 1.6px;line-height: 1;}
#contents02 .inner-Box { background-color: #f4efe7; border-bottom: 30px solid #2686d1; padding-top: 55px;padding-bottom: 31px;}
#contents02 .inner-Box .inbox1 { margin: 0 80px; position: relative; padding-right: 540px ;min-height: 298px;}
#contents02 .inner-Box .inbox1 h3{ font-size: 24px; font-weight: 700; letter-spacing: 1.2px; margin-bottom: 17px; }
#contents02 .inner-Box .inbox1 figure{ position: absolute; top: 5px; right: 0; }
#contents02 .inner-Box .inbox1 p{ font-size: 16px; letter-spacing: 0.8px; line-height: 28px; margin-bottom: 30px; }
#contents02 .inner-Box .inbox2 { margin: 0 80px; position: relative; padding-left: 540px;}
#contents02 .inner-Box .inbox2 h3{ font-size: 24px; font-weight: 700; letter-spacing: 1.2px; margin-bottom: 17px; }
#contents02 .inner-Box .inbox2 figure{ position: absolute; top: 5px; left: 0; }
#contents02 .inner-Box .inbox2 p{ font-size: 16px; letter-spacing: 0.8px; line-height: 28px; margin-bottom: 30px; }

#contents03 { width: 1200px; margin: 0 auto 119px; }
#contents03 span.no { display: block; margin-bottom: 18px;}
#contents03 h2{ width: 1200px; height: 160px; text-align: center; background: url('../images/renovation/contents-ttlback.png')no-repeat top center; padding-top: 37px;color: #ffffff;font-size: 32px;font-weight: 700;letter-spacing: 1.6px;line-height: 1;}
#contents03 .inner-Box { background-color: #f4efe7; border-bottom: 30px solid #2686d1; padding-top: 55px;padding-bottom: 31px;}
#contents03 .inner-Box .inbox { margin: 0 80px; position: relative; padding-right: 540px }
#contents03 .inner-Box h3{ font-size: 24px; font-weight: 700; letter-spacing: 1.2px; margin-bottom: 17px; }
#contents03 .inner-Box figure{ position: absolute; top: 5px; right: 0; }
#contents03 .inner-Box p{ font-size: 16px; letter-spacing: 0.8px; line-height: 28px; margin-bottom: 30px; }

#contentsbottom { text-align: center; margin-bottom: -30px;}
#contentsbottom .inner-Box {  }
#contentsbottom .inner-Box h2 {  }
#contentsbottom .inner-Box h2 img{  }

.bottom-banner{ width: 360px;  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; position: relative;z-index: 3;background: #fff;}
.bottom-banner li{ width: 360px; text-align: center; }
.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 {   margin-bottom: 12.5vw;padding-top: 3vw;}
#contentsmain .inner-Box1 { text-align: center;  margin: 0 auto -18.3vw; padding-top: 4.7vw;}
#contentsmain .inner-Box1 h2{  height: 10.4vw; border-radius: 5.2vw; background-color: #2686d1; color: #fff; font-size: 6.2vw; font-weight: 700; margin: 0 13vw -5.2vw; position: relative;}
#contentsmain .inner-Box1 figure.photo1 {  margin: 0 4vw -11.1vw;}
#contentsmain .inner-Box1 p{ font-size: 3.6vw; font-weight: 700; letter-spacing: 0.3vw; line-height: 1; }
#contentsmain .inner-Box1 p span{ background: #fff; padding: 2.2vw 2.3vw; display: inline-block; margin-bottom: 0.8vw; }
#contentsmain .inner-Box2 {  background-color: #f4efe7;padding-top: 27.2vw;padding-bottom: 37.0vw;margin-bottom: -26.3vw;}
#contentsmain .inner-Box2 figure.photo2 {    margin-bottom: -5vw;}
#contentsmain .inner-Box2 .inbox {  margin: 0 4vw;   position: relative; }
#contentsmain .inner-Box2 .textbox { background: #fff; padding: 7vw 4vw 5vw 4vw;     margin: 0 3vw;position: relative;}
#contentsmain .inner-Box2 .inbox .textbox h3{ font-size: 4.5vw; font-weight: 700; letter-spacing: 0.3vw; line-height:1.6; margin-bottom: 3.0vw;}
#contentsmain .inner-Box2 .inbox .textbox p{ font-size: 3.6vw; letter-spacing: 0.3vw; line-height:1.6; margin-bottom: 3.9vw;}

#contentsmain .inner-Box3 {  background-color: #f3f2f3; margin: 0 4vw; }
#contentsmain .inner-Box3 h4{ color: #ffffff; font-size: 4.3vw; font-weight: 700; letter-spacing: 0.3vw; text-align: center; background-color: #332e1b; padding: 3.2vw 0;margin-bottom: 4.7vw;}
#contentsmain .inner-Box3 ul{   margin-bottom: 4.6vw;margin-left: 10vw;}
#contentsmain .inner-Box3 ul li{ position: relative; font-size: 3.6vw; letter-spacing: 0.3vw; margin-bottom: 1.3vw; }
#contentsmain .inner-Box3 ul li p{  }
#contentsmain .inner-Box3 ul li span{ position: absolute; top: -1.2vw; left: -4.6vw; display: block;width: 3vw;}
#contentsmain .inner-Box3 .inbox{ text-align: center; background-color: #ffe412;  position: relative; padding-top: 3.7vw; padding-bottom: 2vw;line-height: 1.6;}
#contentsmain .inner-Box3 .inbox::before{position: absolute;bottom: -1.0vw;left: 0vw;transform: scale(0.4);transform-origin: bottom left;}
#contentsmain .inner-Box3 .inbox::after{ content: url('../images/renovation/main-photo04.png'); position: absolute; bottom: -1.0vw; right: 0vw; transform: scale(0.4); transform-origin: bottom right;}
#contentsmain .inner-Box3 .inbox p{ text-align: center; font-size: 4.2vw; font-weight: 700; letter-spacing: 0.3vw; }
#contentsmain .inner-Box3 .inbox p span{ font-size: 3.4vw; display: block; }

#contents01 {  margin: 0 4vw 10.4vw; }
#contents01 span.no { display: block; margin: 0 auto 1vw;width: 6vw;}
#contents01 h2{  height: 27.8vw; text-align: center; background: url('../images/renovation/sp-contents-ttlback.png')no-repeat top center; background-size: 100% auto; padding-top: 0.8vw;color: #ffffff;font-size: 4.8vw;font-weight: 700;letter-spacing: 0.3vw;line-height: 1.6;}
#contents01 .inner-Box { background-color: #f4efe7; border-bottom: 3.9vw solid #2686d1; padding-top: 4vw;padding-bottom: 4.0vw;}
#contents01 .inner-Box .inbox { margin: 0 4vw; position: relative; }
#contents01 .inner-Box h3{ font-size: 4vw; font-weight: 700; letter-spacing: 0.3vw; margin-bottom: 2.2vw; }
#contents01 .inner-Box figure{ margin-bottom: 4vw; }
#contents01 .inner-Box p{ font-size: 3.6vw; letter-spacing: 0.3vw; line-height:1.6; margin-bottom: 3.9vw; }

#contents02 {  margin: 0 4vw 10.4vw; }
#contents02 span.no { display: block; margin: 0 auto 1vw;width: 6vw;}
#contents02 h2{  height: 27.8vw; text-align: center; background: url('../images/renovation/sp-contents-ttlback.png')no-repeat top center; background-size: 100% auto; padding-top: 0.8vw;color: #ffffff;font-size: 4.8vw;font-weight: 700;letter-spacing: 0.3vw;line-height: 1.6;}
#contents02 .inner-Box { background-color: #f4efe7; border-bottom: 3.9vw solid #2686d1; padding: 4vw;}
#contents02 .inner-Box .inbox { margin: 0 4vw; position: relative; }
#contents02 .inner-Box h3{ font-size: 4vw; font-weight: 700; letter-spacing: 0.3vw; margin-bottom: 2.2vw; }
#contents02 .inner-Box figure{ margin-bottom: 4vw; }
#contents02 .inner-Box p{ font-size: 3.6vw; letter-spacing: 0.3vw; line-height:1.6; margin-bottom: 3.9vw; }
#contents02 .inner-Box .inbox2 {  position: relative; }
#contents02 .inner-Box .inbox2 h3{ font-size: 4vw; font-weight: 700; letter-spacing: 0.3vw; margin-bottom: 2.2vw; }
#contents02 .inner-Box .inbox2 figure{ margin-bottom: 4vw; }
#contents02 .inner-Box .inbox2 p{ font-size: 3.6vw; letter-spacing: 0.3vw; line-height:1.6; margin-bottom: 3.9vw; }

#contents03 {  margin: 0 4vw 10.4vw; }
#contents03 span.no { display: block; margin: 0 auto 1vw;width: 6vw;}
#contents03 h2{  height: 27.8vw; text-align: center; background: url('../images/renovation/sp-contents-ttlback.png')no-repeat top center; background-size: 100% auto; padding-top: 0.8vw;color: #ffffff;font-size: 4.8vw;font-weight: 700;letter-spacing: 0.3vw;line-height: 1.6;}
#contents03 .inner-Box { background-color: #f4efe7; border-bottom: 3.9vw solid #2686d1; padding: 4vw;}
#contents03 .inner-Box .inbox {  position: relative; }
#contents03 .inner-Box h3{ font-size: 4vw; font-weight: 700; letter-spacing: 0.3vw; margin-bottom: 2.2vw; }
#contents03 .inner-Box figure{ margin-bottom: 4vw; }
#contents03 .inner-Box p{ font-size: 3.6vw; letter-spacing: 0.3vw; line-height:1.6; margin-bottom: 3.9vw; }

#contentsbottom { text-align: center; margin: 0 4vw;}
#contentsbottom .inner-Box {  }
#contentsbottom .inner-Box h2 {  }
#contentsbottom .inner-Box h2 img{  }

.bottom-banner{  padding: 8vw 14vw 4vw; margin: 0 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 img{ margin-bottom: 2vw; }
.bottom-banner li p{ font-size: 3.8vw; letter-spacing: 0.3vw; line-height:1.6; font-weight: bold;}

}