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

#link01{ position: relative; top: -90px; }
#link02{ position: relative; top: -90px; }
#link03{ position: relative; top: -90px; }
#link04{ position: relative; top: -90px; }
#link05{ position: relative; top: -90px; }

#contentsmain { background: url('../images/reason/main-back.jpg')no-repeat top center; margin-top: 55px;margin-bottom: 115px;}
#contentsmain .inner-Box { width: 1100px; margin: 0 auto; padding-top: 51px;}
#contentsmain .inner-Box h2 { text-align: center; margin-bottom: 56px;}
#contentsmain .inner-Box h2 img{  }
#contentsmain .inner-Box ul{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;}
#contentsmain .inner-Box ul li { margin-right: 25px; border-radius: 30px 0px 0px 30px; border: 1px solid #000; width: 350px; height: 270px; background-color: #ffffff; overflow: hidden; position: relative; margin-bottom: 30px;}
#contentsmain .inner-Box ul li a{ width: 350px; height: 270px; }
#contentsmain .inner-Box ul li a::before{ content: url('../images/reason/main-arr.png'); position: absolute; bottom: 0; right: 7px; }
#contentsmain .inner-Box ul li a:hover{ text-decoration: none; }
#contentsmain .inner-Box ul li:nth-child(3){ margin-right: 0px; }
#contentsmain .inner-Box ul li:nth-child(4){ margin-left: 186px; }
#contentsmain .inner-Box ul li img{  margin-bottom: 37px;}
#contentsmain .inner-Box ul li h3{ background-color: #6cae30; position: absolute; top: 115px; left: 0; display: inline-block; color: #fff; font-size: 22px; font-weight: 700; letter-spacing: 1.1px; padding: 6px 24px;}
#contentsmain .inner-Box ul li p{  text-align: center;font-size: 16px;line-height: 26px;}

.backk{ background-color: #f4efe7; padding: 90px 0 1px 0; margin-bottom: 90px;}

#contents01 { width: 1100px; background-color: #f4efe7; margin: 0 auto 90px; position: relative; padding-bottom: 25px;}
#contents01 span.no { position: absolute; top: 0; left: 0; }
#contents01 h2{  background-color: #6cae30; text-align: center; color: #ffff; font-size: 32px; font-weight: 700; letter-spacing: 1.6px; height: 86px;padding-top: 15px;margin-bottom: 55px;}
#contents01 .inner-Box1 { margin: 0 50px 35px; padding-left: 530px; min-height: 280px; position: relative; }
#contents01 .inner-Box1 h3{ font-size: 22px; font-weight: 700; color: #332e1b; letter-spacing: 1.1px; margin-bottom: 17px; }
#contents01 .inner-Box1 figure{ position: absolute; top: 5px; left: 0; }
#contents01 .inner-Box1 p{ font-size: 16px; width: 489px;}
#contents01 .inner-Box2 { margin: 0 50px 35px; padding-right: 390px; min-height: 179px; position: relative; background-color: #ffffff;}
#contents01 .inner-Box2 figure{ position: absolute; top: 0; right: 0; }
#contents01 .inner-Box2 p{padding: 36px 60px 0; font-size: 16px; }


#contents02 { width: 1100px; background-color: #fff; margin: 0 auto 90px; position: relative; padding-bottom: 25px;}
#contents02 span.no { position: absolute; top: 0; left: 0; }
#contents02 h2{  background-color: #6cae30; text-align: center; color: #ffff; font-size: 32px; font-weight: 700; letter-spacing: 1.6px; height: 86px;padding-top: 15px;margin-bottom: 55px;}
#contents02 .inner-Box1 { margin: 0 50px 35px; padding-right: 510px; min-height: 280px; position: relative; }
#contents02 .inner-Box1 h3{ font-size: 22px; font-weight: 700; color: #332e1b; letter-spacing: 1.1px; margin-bottom: 17px; }
#contents02 .inner-Box1 figure{ position: absolute; top: 5px; right: 0; }
#contents02 .inner-Box1 p{ font-size: 16px; width: 489px;letter-spacing: 0.3px;}
#contents02 .inner-Box2 { margin: 0 50px 35px;  min-height: 169px; position: relative; background-color: #f4efe7;text-align: center;}
#contents02 .inner-Box2::before{ content: url('../images/reason/contents02-photo02.png');position: absolute; bottom: -4px; right: 107px; transform: scale(0.49); transform-origin: bottom right;}
#contents02 .inner-Box2 figure{ position: absolute; top: 0; right: 0; }
#contents02 .inner-Box2 p{padding: 36px 60px 0; font-size: 16px; font-weight: 700;  }
#contents02 .inner-Box2 p span{padding: 36px 60px 0; font-size: 22px; font-weight: 700; display: block; letter-spacing: 1.1px;  margin-top: -30px;}

#contents03 { width: 1100px; background-color: #f4efe7; margin: 0 auto 90px; position: relative; padding-bottom: 25px;}
#contents03 span.no { position: absolute; top: 0; left: 0; }
#contents03 h2{  background-color: #6cae30; text-align: center; color: #ffff; font-size: 32px; font-weight: 700; letter-spacing: 1.6px; height: 86px;padding-top: 15px;margin-bottom: 55px;}
#contents03 .inner-Box1 { margin: 0 20px 35px 50px; padding-left: 499px; min-height: 280px; position: relative; }
#contents03 .inner-Box1 h3{ font-size: 22px; font-weight: 700; color: #332e1b; letter-spacing: 1.1px; margin-bottom: 17px; }
#contents03 .inner-Box1 figure{ position: absolute; top: 5px; left: 0; }
#contents03 .inner-Box1 p{ font-size: 16px; width: 489px;letter-spacing: 0px;}
#contents03 .inner-Box2 { margin: 0 50px 35px; padding-right: 390px; min-height: 149px; position: relative; background-color: #ffffff;}
#contents03 .inner-Box2 figure{ position: absolute; top: -60px; right: 21px; }
#contents03 .inner-Box2 p{padding: 36px 80px 0 70px; font-size: 16px; letter-spacing: 0;}


#contents04 { width: 1100px; background-color: #fff; margin: 0 auto 90px; position: relative; padding-bottom: 43px;}
#contents04 span.no { position: absolute; top: 0; left: 0; z-index: 3;}
#contents04 h2{ position: relative; background-color: #6cae30; text-align: center; color: #ffff; font-size: 32px; font-weight: 700; letter-spacing: 1.6px; height: 86px;padding-top: 15px;margin-bottom: 55px;}
#contents04 h2::before{ content: url('../images/reason/contents04-icon01.png'); position: absolute; top: -123px; right: 50px; }
#contents04 .inner-Box1 { margin: 0 50px 35px; padding-right: 510px; min-height: 280px; position: relative; }
#contents04 .inner-Box1 h3{ font-size: 22px; font-weight: 700; color: #332e1b; letter-spacing: 1.1px; margin-bottom: 12px; }
#contents04 .inner-Box1 figure{ position: absolute; top: 5px; right: 0; }
#contents04 .inner-Box1 p{ font-size: 16px; width: 489px;letter-spacing: 0px;}
#contents04 .inner-Box1 .icon{ position: absolute; bottom: -120px; left: -100px; }
#contents04 .inner-Box1 .icon02{ position: absolute; bottom: -78px; right: -35px; z-index: 3;}


#contents05 { width: 1100px; background-color: #f4efe7; margin: 0 auto 160px; position: relative; padding-bottom: 65px;}
#contents05 span.no { position: absolute; top: 0; left: 0; }
#contents05 h2{  background-color: #6cae30; text-align: center; color: #ffff; font-size: 32px; font-weight: 700; letter-spacing: 1.6px; height: 86px;padding-top: 15px;margin-bottom: 55px;}
#contents05 .inner-Box1 { margin: 0 50px -2px; padding-left: 500px; min-height: 280px; position: relative; }
#contents05 .inner-Box1 h3{ font-size: 22px; font-weight: 700; color: #332e1b; letter-spacing: 1.1px; margin-bottom: 17px; }
#contents05 .inner-Box1 figure{ position: absolute; top: 5px; left: 0; }
#contents05 .inner-Box1 p{ font-size: 16px; width: 489px;letter-spacing: 0;}
#contents05 .inner-Box2 { margin: 0 50px 65px -12px; padding-right: 470px; min-height: 179px; position: relative; }
#contents05 .inner-Box2 figure{ position: absolute; top: 40px; right: 0; }
#contents05 .inner-Box2 p{padding: 36px 60px 0; font-size: 16px; }
#contents05 .inner-Box3 { width: 919px; margin: 0 auto; outline: 5px #fff solid; border: 1px dashed #38240e; height: 136px; position: relative; background: #fff; padding-top: 31px;padding-left: 229px;}
#contents05 .inner-Box3 figure{ position: absolute; bottom: 0; right: 0; }
#contents05 .inner-Box3 p{  font-size: 20px;font-weight: 700;line-height: 34px;letter-spacing: 0px;}

#contentsbottom { background: url('../images/reason/bottom-back.jpg')no-repeat bottom center;  margin-bottom: 70px;}
#contentsbottom .inner-Box { width: 1246px; margin: 0 auto; text-align: center; background: url('../images/reason/bottom-back02.png')no-repeat top center; padding-top: 339px;padding-bottom: 102px;position: relative;left: -10px;padding-left: 20px;}
#contentsbottom .inner-Box h2{ font-size: 32px; letter-spacing: 1.6px; line-height: 54px; font-weight: 700;  }
#contentsbottom .inner-Box h2 span{ font-size: 22px; display: block; }

.bottom-banner{ width: 1200px; padding: 50px 30px 15px 30px; 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; float: left; margin-right: 30px; text-align: center; }
.bottom-banner li:nth-child(3){ 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) {

#link01{ position: relative; top: -11.7vw; }
#link02{ position: relative; top: -11.7vw; }
#link03{ position: relative; top: -11.7vw; }
#link04{ position: relative; top: -11.7vw; }
#link05{ position: relative; top: -11.7vw; }

#contentsmain { background: url('../images/reason/sp-main-back.jpg')no-repeat top center; background-size: 100% auto; margin-top: 7.2vw;margin-bottom: 15.0vw;padding-bottom: 10vw;}
#contentsmain .inner-Box {  margin: 0 4vw; padding-top: 19.6vw;}
#contentsmain .inner-Box h2 { text-align: center; margin: 0 -3vw -3.7vw 11vw;}
#contentsmain .inner-Box h2 img{  }
#contentsmain .inner-Box ul{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;margin: 0 4vw 4vw 6vw;}
#contentsmain .inner-Box ul li {  border-radius: 3.9vw 0px 0px 3.9vw; border: 0.1vw solid #000;  height: 70.2vw; background-color: #ffffff; overflow: hidden; position: relative; margin-bottom: 3.9vw;}
#contentsmain .inner-Box ul li a{  height: 35.2vw; }
#contentsmain .inner-Box ul li a::before{ content: url('../images/reason/main-arr.png'); position: absolute; bottom: 2vw; right: 2vw; transform: scale(0.5); transform-origin: bottom right;}
#contentsmain .inner-Box ul li a:hover{ text-decoration: none; }
#contentsmain .inner-Box ul li img{  margin-bottom: 10vw;}
#contentsmain .inner-Box ul li:nth-child(3) img{margin-bottom: 7vw;}
#contentsmain .inner-Box ul li:nth-child(4) img{margin-bottom: 7vw;}
#contentsmain .inner-Box ul li img{  margin-bottom: 10vw;}
#contentsmain .inner-Box ul li h3{ background-color: #6cae30; position: absolute; top: 36vw; left: 0; display: inline-block; color: #fff; font-size: 6vw; font-weight: 700; letter-spacing: 0.3vw; padding: 0vw 3.1vw;}
#contentsmain .inner-Box ul li p{  text-align: center;font-size: 3.6vw;line-height:1.6;}

.backk{ background-color: #f4efe7; padding: 11.7vw 0 0.1vw 0; margin-bottom: 11.7vw;}

span.no img{ height: 13vw; width: auto;  }

#contents01 {  background-color: #f4efe7; margin: 0 4vw 11.7vw; position: relative; padding-bottom: 3.3vw;}
#contents01 span.no { position: absolute; top: 0; left: 0; }
#contents01 h2{  background-color: #6cae30; text-align: center; color: #ffff; font-size: 5.2vw; font-weight: 700; letter-spacing: 0.3vw; height: 13vw;padding-top: 2.0vw;margin-bottom: 7.2vw;}
#contents01 .inner-Box1 { margin: 0 4vw 4.6vw;   position: relative; }
#contents01 .inner-Box1 h3{ font-size: 4.5vw; font-weight: 700; color: #332e1b; letter-spacing: 0.3vw; margin-bottom: 3.9vw; }
#contents01 .inner-Box1 figure{ margin-bottom: 4vw; }
#contents01 .inner-Box1 p{ font-size: 3.6vw; }
#contents01 .inner-Box2 { margin: 0 4vw 4.6vw;   position: relative; background-color: #ffffff;}
#contents01 .inner-Box2 figure{ margin-bottom: 4vw; }
#contents01 .inner-Box2 p{padding: 0 3vw 4vw; font-size: 3.6vw; }


#contents02 {  background-color: #fff; margin: 0 4vw 11.7vw; position: relative; padding-bottom: 3.3vw;}
#contents02 span.no { position: absolute; top: 0; left: 0; }
#contents02 h2{  background-color: #6cae30; text-align: center; color: #ffff; font-size: 5.2vw; font-weight: 700; letter-spacing: 0.3vw; height: 13vw;padding-top: 2.0vw;margin-bottom: 7.2vw;}
#contents02 .inner-Box1 { margin: 0 4vw 4.6vw;   position: relative; }
#contents02 .inner-Box1 h3{ font-size: 4.5vw; font-weight: 700; color: #332e1b; letter-spacing: 0.3vw; margin-bottom: 3.9vw; }
#contents02 .inner-Box1 figure{ margin-bottom: 4vw; }
#contents02 .inner-Box1 p{ font-size: 3.6vw; }
#contents02 .inner-Box2 { margin: 0 4vw 4.6vw;   position: relative; background-color: #f4efe7;text-align: center;}
#contents02 .inner-Box2::before{ content: url('../images/reason/contents02-photo02.png');position: absolute; bottom: -0.5vw; right: 0vw; transform: scale(0.25); transform-origin: bottom right;}
#contents02 .inner-Box2 figure{ margin-bottom: 4vw; }
#contents02 .inner-Box2 p{padding: 4vw; font-size: 3.6vw; font-weight: 700;  }
#contents02 .inner-Box2 p span{padding: 4vw; font-size: 4.9vw; font-weight: 700; display: block; letter-spacing: 0.3vw;  margin-top: -3.9vw;}

#contents03 {  background-color: #f4efe7; margin: 0 4vw 11.7vw; position: relative; padding-bottom: 3.3vw;}
#contents03 span.no { position: absolute; top: 0; left: 0; }
#contents03 h2{  background-color: #6cae30; text-align: center; color: #ffff; font-size: 5.2vw; font-weight: 700; letter-spacing: 0.3vw; height: 13vw;padding-top: 2.0vw;margin-bottom: 7.2vw;}
#contents03 .inner-Box1 { margin: 0 4vw 4.6vw;   position: relative; }
#contents03 .inner-Box1 h3{ font-size: 4.5vw; font-weight: 700; color: #332e1b; letter-spacing: 0.3vw; margin-bottom: 3.9vw; }
#contents03 .inner-Box1 figure{ margin-bottom: 4vw; }
#contents03 .inner-Box1 p{ font-size: 3.6vw; }
#contents03 .inner-Box2 { margin: 0 4vw 4.6vw;   position: relative; background-color: #ffffff;}
#contents03 .inner-Box2 figure{ margin: 0 0vw 2vw -3.5vw; }
#contents03 .inner-Box2 p{padding: 0 3vw 4vw; font-size: 3.6vw; }


#contents04 {  background-color: #fff; margin: 0 4vw 11.7vw; position: relative; padding-bottom: 3.3vw;}
#contents04 span.no { position: absolute; top: 0; left: 0; }
#contents04 h2{  background-color: #6cae30; text-align: center; color: #ffff; font-size: 5.2vw; font-weight: 700; letter-spacing: 0.3vw; height: 13vw;padding-top: 2.0vw;margin-bottom: 7.2vw;}
#contents04 .inner-Box1 { margin: 0 4vw 4.6vw;   position: relative; }
#contents04 .inner-Box1 h3{ font-size: 4.5vw; font-weight: 700; color: #332e1b; letter-spacing: 0.3vw; margin-bottom: 3.9vw; }
#contents04 .inner-Box1 figure{ margin-bottom: 4vw; }
#contents04 .inner-Box1 p{ font-size: 3.6vw; }

#contents04 h2::before{ content: url('../images/reason/contents04-icon01.png'); position: absolute; top: -17vw; right: 6.5vw; transform: scale(0.5); transform-origin: top right;}
#contents04 .inner-Box1 .icon{ position: absolute; bottom: -12.6vw; left: -5vw; width: 20vw;}
#contents04 .inner-Box1 .icon02{ position: absolute; bottom: -10.2vw; right: -4.6vw; z-index: 3;width: 9vw;}


#contents05 {  background-color: #f4efe7; margin: 0 4vw 11.7vw; position: relative; padding-bottom: 3.3vw;}
#contents05 span.no { position: absolute; top: 0; left: 0; }
#contents05 h2{  background-color: #6cae30; text-align: center; color: #ffff; font-size: 5.2vw; font-weight: 700; letter-spacing: 0.3vw; height: 13vw;padding-top: 2.0vw;margin-bottom: 7.2vw;}
#contents05 .inner-Box1 { margin: 0 4vw 4.6vw;   position: relative; }
#contents05 .inner-Box1 h3{ font-size: 4.5vw; font-weight: 700; color: #332e1b; letter-spacing: 0.3vw; margin-bottom: 3.9vw; }
#contents05 .inner-Box1 figure{ margin-bottom: 4vw; }
#contents05 .inner-Box1 p{ font-size: 3.6vw; }
#contents05 .inner-Box2 { margin: 0 4vw 4.6vw;   position: relative; }
#contents05 .inner-Box2 figure{ margin-bottom: 4vw; }
#contents05 .inner-Box2 p{padding: 0 3vw 4vw; font-size: 3.6vw; }
#contents05 .inner-Box3 {  margin: 0 4vw; outline: 1vw #fff solid; border: 1px dashed #38240e;  position: relative; background: #fff; padding: 5vw 15vw 4vw 4vw;}
#contents05 .inner-Box3 figure{ position: absolute; bottom: 0; right: 0; width: 20vw; }
#contents05 .inner-Box3 p{  font-size: 3.6vw;font-weight: 700;line-height:1.6;letter-spacing: 0.3vw;}

#contentsbottom { background: url('../images/reason/sp-bottom-back.jpg')no-repeat top center; background-size: 100% auto; }
#contentsbottom .inner-Box {  margin: 0 4vw; text-align: center;padding-bottom: 33vw;padding-top: 61vw;position: relative;left: -1.3vw;padding-left: 2.6vw;}
#contentsbottom .inner-Box h2{ font-size: 4.5vw; letter-spacing: 0.3vw; line-height:1.6; font-weight: 700;  }
#contentsbottom .inner-Box h2 span{ font-size: 3.9vw; display: block; }





.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: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;}


}