@charset "UTF-8";
main { font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro",  Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;}

@media screen and (min-width: 768px),print {
a[id]{display:block;height:0px;overflow:hidden;text-indent:-9999px;margin-top:-100px;padding-bottom:100px;}

#main-bx {}
#main-bx .bx{width: 1250px; margin: 68px auto 120px; position: relative; background: url(../images/reason/main-bg-icon.svg) no-repeat top 40px left 280px;}
#main-bx .bx .ttl{text-align: center; margin-left: 70px; margin-bottom: 29px;}
#main-bx .bx .list{margin-left: 8px; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex;-webkit-box-lines: multiple; -moz-box-lines: multiple; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; justify-content: center;}
#main-bx .bx .list li{width: 262px; margin-right: 47px;}
#main-bx .bx .list li:last-child{margin-right: 0;}

#con1 {}
#con1 .bx{width: 1200px; margin: 0 auto 148px; position: relative; }
#con1 .bx::before{content: ""; width: 980px; height: 570px; margin: 0 auto; background: url(../images/reason/con-all-bg.png) repeat top center; position: absolute; top: 126px; left: 170px;}
#con1 .bx .inner{width: 1200px; margin: 0 auto; position: relative;}
#con1 .bx .inner .in-inner{width: 540px; margin-right: auto; margin-top: 35px;}
#con1 .bx .inner .in-inner .num{position: absolute; left: 5px; top: -36px; z-index: 1;}
#con1 .bx .inner .in-inner .ttl{font-size: 48px; font-weight: bold; letter-spacing: 5px; position: absolute; left: 170px; top: 23px; z-index: 1;}
#con1 .bx .inner .in-inner .ttl span{color: #fff; background: #FC3C40; padding: 10px 30px 10px 40px; margin: 0 13px;}
#con1 .bx .inner .in-inner .ttl1{font-size: 24px; font-weight: bold; letter-spacing: 1.2px; margin-bottom: 22px; padding-top: 150px;}
#con1 .bx .inner .in-inner .img{position: absolute; right: 0; top: 65px;}
#con1 .bx .inner .in-inner .txt{font-size: 16px; letter-spacing: 0.8px; margin-bottom: 32px; line-height: 1.85;}
#con1 .bx .inner .in-inner .btn{margin-top: 40px;}

#con2 {}
#con2 .bx{width: 1200px; margin: 0 auto 148px; position: relative; }
#con2 .bx::before{content: ""; width: 980px; height: 540px; margin: 0 auto; background: url(../images/reason/con-all-bg.png) repeat top center; position: absolute; top: 126px; left: 50px;}
#con2 .bx .inner{width: 1200px; margin: 0 auto; position: relative;}
#con2 .bx .inner .in-inner{width: 540px; margin-left: auto; margin-top: 35px;}
#con2 .bx .inner .in-inner .num{position: absolute; left: 505px; top: -36px; z-index: 1;}
#con2 .bx .inner .in-inner .ttl{font-size: 48px; font-weight: bold; letter-spacing: 5px; position: absolute; right: -15px; top: 23px; z-index: 1;}
#con2 .bx .inner .in-inner .ttl span{color: #fff; background: #33CFBD; padding: 10px 23px 10px 30px; margin: 0 13px 0 8px;}
#con2 .bx .inner .in-inner .ttl1{font-size: 24px; font-weight: bold; letter-spacing: 1.2px; margin-bottom: 22px; padding-top: 150px;}
#con2 .bx .inner .in-inner .img{position: absolute; left: 0; top: 65px;}
#con2 .bx .inner .in-inner .txt{font-size: 16px; letter-spacing: 0.8px; margin-bottom: 32px; line-height: 1.85;}
#con2 .bx .inner .in-inner .btn{margin-top: 40px;}

#con3 {}
#con3 .bx{width: 1200px; margin: 0 auto 148px; position: relative; }
#con3 .bx::before{content: ""; width: 980px; height: 630px; margin: 0 auto; background: url(../images/reason/con-all-bg.png) repeat top center; position: absolute; top: 126px; left: 170px;}
#con3 .bx .inner{width: 1200px; margin: 0 auto; position: relative;}
#con3 .bx .inner .in-inner{width: 540px; margin-right: auto; margin-top: 35px;}
#con3 .bx .inner .in-inner .num{position: absolute; left: 5px; top: -36px; z-index: 1;}
#con3 .bx .inner .in-inner .ttl{font-size: 48px; font-weight: bold; letter-spacing: 5px; position: absolute; left: 170px; top: 23px; z-index: 1;}
#con3 .bx .inner .in-inner .ttl span{color: #fff; background: #0533DD; padding: 10px 25px 10px 35px; margin: 0 13px;}
#con3 .bx .inner .in-inner .ttl1{font-size: 24px; font-weight: bold; letter-spacing: 1.2px; margin-bottom: 22px; padding-top: 150px;}
#con3 .bx .inner .in-inner .img{position: absolute; right: 0; top: 65px;}
#con3 .bx .inner .in-inner .txt{font-size: 16px; letter-spacing: 0.8px; margin-bottom: 32px; line-height: 1.85;}
#con3 .bx .inner .in-inner .btn{margin-top: 40px;}

#con4 {}
#con4 .bx{width: 1200px; margin: 0 auto 148px; position: relative; }
#con4 .bx::before{content: ""; width: 980px; height: 600px; margin: 0 auto; background: url(../images/reason/con-all-bg.png) repeat top center; position: absolute; top: 126px; left: 50px;}
#con4 .bx .inner{width: 1200px; margin: 0 auto; position: relative;}
#con4 .bx .inner .in-inner{width: 540px; margin-left: auto; margin-top: 35px;}
#con4 .bx .inner .in-inner .num{position: absolute; left: 502px; top: -36px; z-index: 1;}
#con4 .bx .inner .in-inner .ttl{font-size: 48px; font-weight: bold; letter-spacing: 5px; position: absolute; right: -6px; top: 23px; z-index: 1;}
#con4 .bx .inner .in-inner .ttl span{color: #fff; background: #1A9D23; padding: 10px 20px 10px 20px; margin: 0 10px 0 10px;}
#con4 .bx .inner .in-inner .ttl1{font-size: 24px; font-weight: bold; letter-spacing: 1.2px; margin-bottom: 22px; padding-top: 150px;}
#con4 .bx .inner .in-inner .img{position: absolute; left: 0; top: 65px;}
#con4 .bx .inner .in-inner .txt{font-size: 16px; letter-spacing: 0.8px; margin-bottom: 32px; line-height: 1.87;}
#con4 .bx .inner .in-inner .btn{margin-top: 40px;}

#con5 {}
#con5 .bx{width: 1400px; margin: -300px auto -233px; background: url(../images/reason/con5-bg.png) no-repeat top center; padding-bottom: 290px; padding-top: 360px;;}
#con5 .bx .inner{width: 1200px; margin: 0 auto; position: relative; background: url(../images/reason/con5-bg-icon.svg) no-repeat top center; padding: 135px 0;;}
#con5 .bx .inner .in-inner{width: 800px; margin-right: auto; margin-left: 35px;}
#con5 .bx .inner .in-inner .img{position: absolute; right: 0; top: 40px;}
#con5 .bx .inner .in-inner .ttl{font-size: 32px; font-weight: bold; letter-spacing: 3.5px; line-height: 1.65; margin-bottom: 28px; position: relative;}
#con5 .bx .inner .in-inner .ttl .span2{font-size: 42px; font-weight: bold; letter-spacing: 4.3px; padding: 3px 15px 3px 30px; position: relative; left: -30px; background: linear-gradient(transparent 0%, #FFFE00 0%);}
#con5 .bx .inner .in-inner .txt{font-size: 20px; font-weight: bold; letter-spacing: 1px; line-height: 2;}


}


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

a[id]{display:block;height:0px;overflow:hidden;text-indent:-9999px;margin-top:-15vw;padding-bottom:15vw;}

#main-bx {}
#main-bx .bx{width: 100vw; margin: 0 auto 20vw; position: relative; background: url(../images/reason/main-bg-icon.svg) no-repeat top left 0; right: 0; background-size: 100%; padding-top: 15vw;}
#main-bx .bx .ttl{width: 90vw; margin: 0 auto 5vw;}
#main-bx .bx .list{display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex;-webkit-box-lines: multiple; -moz-box-lines: multiple; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; justify-content: center;}
#main-bx .bx .list li{width: 38vw; margin-right: 3vw; margin-left: 3vw; margin-bottom: 3vw;}
#main-bx .bx .list li:nth-child(3){width: 41vw; margin-right: 3vw; margin-left: 3vw; margin-bottom: 3vw; margin-top: 1vw;}
#main-bx .bx .list li:nth-child(2n){margin-right: 0;}

#con1 {}
#con1 .bx{width: 100vw; margin: 0 auto 15vw; position: relative; }
#con1 .bx::before{content: ""; width: 80vw; height: 60vw; margin: 0 auto; background: url(../images/reason/con-all-bg.png) repeat top center; position: absolute; top: 20vw; left: 0;}
#con1 .bx .inner{width: 100vw; margin: 0 auto; position: relative;}
#con1 .bx .inner .in-inner{width: 90vw; margin: 0 auto;}
#con1 .bx .inner .in-inner .num{width: 15vw; position: absolute; left: 5vw; top: -2vw; z-index: 1;}
#con1 .bx .inner .in-inner .ttl{font-size: 5.4vw; font-weight: bold; letter-spacing: 0.5vw; position: absolute; left: 25vw; top: 5vw; z-index: 1;}
#con1 .bx .inner .in-inner .ttl span{color: #fff; background: #FC3C40; padding: 0.5vw 3vw; margin: 0 2vw;}
#con1 .bx .inner .in-inner .ttl1{font-size: 4.8vw; font-weight: bold; letter-spacing: 0.2vw; margin-bottom: 5vw; padding-top: 25vw;}
#con1 .bx .inner .in-inner .img{margin: 0 auto 5vw;}
#con1 .bx .inner .in-inner .txt{font-size: 3.6vw; letter-spacing: 0.2vw; margin-bottom: 3vw; line-height: 1.8;}
#con1 .bx .inner .in-inner .btn{width: 75vw; margin: 5vw auto 0;}

#con2 {}
#con2 .bx{width: 100vw; margin: 0 auto 15vw; position: relative; }
#con2 .bx::before{content: ""; width: 80vw; height: 60vw; margin: 0 auto; background: url(../images/reason/con-all-bg.png) repeat top center; position: absolute; top: 20vw; left: 0;}
#con2 .bx .inner{width: 100vw; margin: 0 auto; position: relative;}
#con2 .bx .inner .in-inner{width: 90vw; margin: 0 auto;}
#con2 .bx .inner .in-inner .num{width: 15vw; position: absolute; left: 5vw; top: -2vw; z-index: 1;}
#con2 .bx .inner .in-inner .ttl{font-size: 5.4vw; font-weight: bold; letter-spacing: 0.5vw; position: absolute; left: 25vw; top: 5vw; z-index: 1;}
#con2 .bx .inner .in-inner .ttl span{color: #fff; background: #33CFBD; padding: 0.5vw 3vw; margin: 0 2vw;}
#con2 .bx .inner .in-inner .ttl1{font-size: 4.8vw; font-weight: bold; letter-spacing: 0.2vw; margin-bottom: 5vw; padding-top: 25vw;}
#con2 .bx .inner .in-inner .img{margin: 0 auto 5vw;}
#con2 .bx .inner .in-inner .txt{font-size: 3.6vw; letter-spacing: 0.2vw; margin-bottom: 3vw; line-height: 1.8;}
#con2 .bx .inner .in-inner .btn{width: 75vw; margin: 5vw auto 0;}

#con3 {}
#con3 .bx{width: 100vw; margin: 0 auto 15vw; position: relative; }
#con3 .bx::before{content: ""; width: 80vw; height: 60vw; margin: 0 auto; background: url(../images/reason/con-all-bg.png) repeat top center; position: absolute; top: 20vw; left: 0;}
#con3 .bx .inner{width: 100vw; margin: 0 auto; position: relative;}
#con3 .bx .inner .in-inner{width: 90vw; margin: 0 auto;}
#con3 .bx .inner .in-inner .num{width: 15vw; position: absolute; left: 5vw; top: -2vw; z-index: 1;}
#con3 .bx .inner .in-inner .ttl{font-size: 5.4vw; font-weight: bold; letter-spacing: 0.5vw; position: absolute; left: 25vw; top: 5vw; z-index: 1;}
#con3 .bx .inner .in-inner .ttl span{color: #fff; background: #0533DD; padding: 0.5vw 3vw; margin: 0 2vw;}
#con3 .bx .inner .in-inner .ttl1{font-size: 4.8vw; font-weight: bold; letter-spacing: 0.2vw; margin-bottom: 5vw; padding-top: 25vw;}
#con3 .bx .inner .in-inner .img{margin: 0 auto 5vw;}
#con3 .bx .inner .in-inner .txt{font-size: 3.6vw; letter-spacing: 0.2vw; margin-bottom: 3vw; line-height: 1.8;}
#con3 .bx .inner .in-inner .btn{width: 75vw; margin: 5vw auto 0;}

#con4 {}
#con4 .bx{width: 100vw; margin: 0 auto 15vw; position: relative; }
#con4 .bx::before{content: ""; width: 80vw; height: 60vw; margin: 0 auto; background: url(../images/reason/con-all-bg.png) repeat top center; position: absolute; top: 20vw; left: 0;}
#con4 .bx .inner{width: 100vw; margin: 0 auto; position: relative;}
#con4 .bx .inner .in-inner{width: 90vw; margin: 0 auto;}
#con4 .bx .inner .in-inner .num{width: 15vw; position: absolute; left: 5vw; top: -2vw; z-index: 1;}
#con4 .bx .inner .in-inner .ttl{font-size: 5.4vw; font-weight: bold; letter-spacing: 0.5vw; position: absolute; left: 25vw; top: 5vw; z-index: 1;}
#con4 .bx .inner .in-inner .ttl span{color: #fff; background: #1A9D23; padding: 0.5vw 3vw; margin: 0 2vw;}
#con4 .bx .inner .in-inner .ttl1{font-size: 4.8vw; font-weight: bold; letter-spacing: 0.2vw; margin-bottom: 5vw; padding-top: 25vw;}
#con4 .bx .inner .in-inner .img{margin: 0 auto 5vw;}
#con4 .bx .inner .in-inner .txt{font-size: 3.6vw; letter-spacing: 0.2vw; margin-bottom: 3vw; line-height: 1.8;}
#con4 .bx .inner .in-inner .btn{width: 75vw; margin: 5vw auto 0; position: relative; z-index: 2;}

#con5 {}
#con5 .bx{width: 100vw; margin: -45vw auto -25vw; background: url(../images/reason/sp-con5-bg.png) no-repeat top center; padding-bottom: 30vw; padding-top: 35vw; background-size: 100%;}
#con5 .bx .inner{width: 100vw; margin: 0 auto; position: relative; background: url(../images/reason/con5-bg-icon.svg) no-repeat top 10vw center; padding: 13vw 0; background-size: 90%;}
#con5 .bx .inner .in-inner{width: 90vw; margin: 0 auto;}
#con5 .bx .inner .in-inner .img{margin: 0 auto -15vw;}
#con5 .bx .inner .in-inner .ttl {margin-bottom: 3vw;}
#con5 .bx .inner .in-inner .ttl .span1{font-size: 5vw; font-weight: bold; letter-spacing: 0.5vw; line-height: 1.65; padding: 1.5vw 3vw 0.5vw; margin-bottom: 1vw; position: relative; display: inline-block; background: #fff;}
#con5 .bx .inner .in-inner .ttl .span2{font-size: 5.6vw; font-weight: bold; letter-spacing: 0.5vw; padding: 1vw 3vw; position: relative; left: 0; background: #FFFE00;}
#con5 .bx .inner .in-inner .txt{font-size: 3.8vw; font-weight: bold; letter-spacing: 0.2vw; line-height: 2; margin-left: 1vw;}


}