@charset "UTF-8";

.f-lato {font-family: "lato", sans-serif; font-style: normal;}

@media screen and (min-width: 768px),print {
main {line-height: 1.9;}

#con1 {width: 100%; max-width: 1920px; margin: 0 auto;}
#con1 .bx{width: 1200px; margin: 0 auto -30px; position: relative; 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; flex-direction: row-reverse;}
#con1 .bx .r-bx{width: 470px; margin-left: auto; margin-right: 106px; margin-top: 66px;}
#con1 .bx .r-bx .ttl{font-size: 32px; letter-spacing: 1.7px; line-height: 1.9; margin-bottom: 12px;}
#con1 .bx .r-bx .ttl1{font-size: 22px; letter-spacing: 1px; line-height: 1.8; background: #F2F2F2; padding: 3px 22px; display: inline-block;}
#con1 .bx .l-bx{}

#con1 .bx1{width: 100%; max-width: 1920px; margin: 0 auto 0; padding: 100px 0 0; background: linear-gradient(360deg, #fff 0%, #fff 55px, #5F5E5E 55px, #5F5E5F 100%);}
#con1 .bx1 .inner1{width: 1100px; margin: -247px auto 140px; color: #fff; position: relative;}
#con1 .bx1 .inner1 .ttl2{font-size: 102px; font-weight: 200; text-align: left; letter-spacing: 5px; line-height: 1.15; margin-bottom: 125px;}
#con1 .bx1 .inner1 .ttl3{font-size: 32px; letter-spacing: 1.65px; text-align: center; line-height: 1.6; padding-bottom: 14px; margin-bottom: 25px; position: relative;}
#con1 .bx1 .inner1 .ttl3::after{content: ""; width: 636px; height: 1px; margin: 0 auto; background: url(../images/after/con1-ttl-icon.png) repeat-x bottom; position: absolute; left: -37px; right: 0; bottom: 0;}
#con1 .bx1 .inner1 .txt{font-size: 16px; letter-spacing: 0.8px; text-align: center; line-height: 1.7; margin-bottom: 35px;}
#con1 .bx1 .inner1 .list{margin-bottom: 22px; 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;}
#con1 .bx1 .inner1 .list li{ margin-right: 18px;}
#con1 .bx1 .inner1 .list li:last-child{margin-right: 0;}
#con1 .bx1 .inner1 .list-link{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;}
#con1 .bx1 .inner1 .list-link li{ margin-right: 50px;}
#con1 .bx1 .inner1 .list-link li:last-child{margin-right: 0;}


#con2 {width: 100%; max-width: 1920px; margin: 0 auto;}
#con2 .bx{width: 100%; max-width: 1560px; margin: 0 auto 63px; background: #F2F2F2; border-top: 6px solid #5F5D5D; padding-top: 76px;}
#con2 .bx .inner{width: 1100px; margin: 0 auto; position: relative;}
#con2 .bx .inner .ttl{ text-align: center; line-height: 1.8; margin-bottom: 92px;}
#con2 .bx .inner .ttl .ss1{font-size: 26px;font-weight: 300;letter-spacing: 0.5px;padding-right: 7px;}
#con2 .bx .inner .ttl .ss2{font-size: 42px; letter-spacing: 1.8px; padding-left: 5px; position: relative;}
#con2 .bx .inner .ttl .ss2::after{content: ""; width: 343px; height: 1px; margin: 0 auto; background: #1C1C1C; position: absolute; left: -15px; right: 0; bottom: -6px;}

#con2 .bx .inner .bx1{position: relative; padding-bottom: 140px}
#con2 .bx .inner .bx1::before{content: ""; width: 1px; height: 100%; margin: 0 auto; background: url(../images/after/con2-all-icon.svg) repeat-y bottom; position: absolute; left: 33px; top: 0;}
#con2 .bx .inner .bx1 .inner{padding-left: 113px;}
#con2 .bx .inner .bx1 .inner .num{position: absolute; left: 0; top: -10px}
#con2 .bx .inner .bx1 .inner .ttl1{font-size: 24px; letter-spacing: 1px; line-height: 1.7; width: 314px; position: relative; margin-bottom: 18px;}
#con2 .bx .inner .bx1 .inner .ttl1::after{content: ""; width: 314px; height: 1px; background: #8E8D8D; position: absolute; left: 0; right: 0; bottom: 3px;}
#con2 .bx .inner .bx1 .inner .txt1{font-size: 16px; letter-spacing: 0.8px; line-height: 1.75; margin-bottom: 35px;}
#con2 .bx .inner .bx1 .inner .list{margin-left: -38px; 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;}
#con2 .bx .inner .bx1 .inner .list li{margin-right: 30px;}
#con2 .bx .inner .bx1 .inner .list li:last-child{margin-right: 0;}

#con2 .bx .inner .bx2{position: relative; padding-bottom: 110px}
#con2 .bx .inner .bx2::before{content: ""; width: 1px; height: 100%; margin: 0 auto; background: url(../images/after/con2-all-icon.svg) repeat-y bottom; position: absolute; left: 33px; top: 0;}
#con2 .bx .inner .bx2 .inner{padding-left: 112px;}
#con2 .bx .inner .bx2 .inner .num{position: absolute; left: 0; top: -10px}
#con2 .bx .inner .bx2 .inner .flex-bx{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;}
#con2 .bx .inner .bx2 .inner .flex-bx .l-bx{width: 600px; }
#con2 .bx .inner .bx2 .inner .flex-bx .l-bx .ttl1{font-size: 24px; letter-spacing: 1px; line-height: 1.7; width: 314px; position: relative; margin-bottom: 18px;}
#con2 .bx .inner .bx2 .inner .flex-bx .l-bx .ttl1::after{content: ""; width: 314px; height: 1px; background: #8E8D8D; position: absolute; left: 0; right: 0; bottom: 3px;}
#con2 .bx .inner .bx2 .inner .flex-bx .l-bx .txt1{font-size: 16px; letter-spacing: 0.8px; line-height: 1.75; margin-bottom: 35px;}
#con2 .bx .inner .bx2 .inner .flex-bx .r-bx{}
#con2 .bx .inner .bx2 .inner .flex-bx .r-bx .img{position: absolute; top: -40px; right: 0;}

#con2 .bx .inner .bx3{position: relative; padding-bottom: 130px}
#con2 .bx .inner .bx3::before{content: ""; width: 1px; height: 100%; margin: 0 auto; background: url(../images/after/con2-all-icon.svg) repeat-y bottom; position: absolute; left: 33px; top: 0;}
#con2 .bx .inner .bx3 .inner{padding-left: 112px;}
#con2 .bx .inner .bx3 .inner .num{position: absolute; left: 0; top: -10px}
#con2 .bx .inner .bx3 .inner .flex-bx{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;}
#con2 .bx .inner .bx3 .inner .flex-bx .l-bx{width: 600px; }
#con2 .bx .inner .bx3 .inner .flex-bx .l-bx .ttl1{font-size: 24px; letter-spacing: 1px; line-height: 1.7; width: 314px; position: relative; margin-bottom: 18px;}
#con2 .bx .inner .bx3 .inner .flex-bx .l-bx .ttl1::after{content: ""; width: 314px; height: 1px; background: #8E8D8D; position: absolute; left: 0; right: 0; bottom: 3px;}
#con2 .bx .inner .bx3 .inner .flex-bx .l-bx .txt1{font-size: 16px; letter-spacing: 0.8px; line-height: 1.75; margin-bottom: 35px;}
#con2 .bx .inner .bx3 .inner .flex-bx .r-bx{}
#con2 .bx .inner .bx3 .inner .flex-bx .r-bx .img{position: absolute; top: -50px; right: 0;}

#con2 .bx .inner .bx4{position: relative; padding-bottom: 122px}
#con2 .bx .inner .bx4::before{content: ""; width: 1px; height: 100%; margin: 0 auto; background: url(../images/after/con2-all-icon.svg) repeat-y bottom; position: absolute; left: 33px; top: 0;}
#con2 .bx .inner .bx4 .inner{padding-left: 112px;}
#con2 .bx .inner .bx4 .inner .num{position: absolute; left: 0; top: -10px}
#con2 .bx .inner .bx4 .inner .flex-bx{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;}
#con2 .bx .inner .bx4 .inner .flex-bx .l-bx{width: 600px; }
#con2 .bx .inner .bx4 .inner .flex-bx .l-bx .ttl1{font-size: 24px; letter-spacing: 1px; line-height: 1.7; width: 314px; position: relative; margin-bottom: 18px;}
#con2 .bx .inner .bx4 .inner .flex-bx .l-bx .ttl1::after{content: ""; width: 314px; height: 1px; background: #8E8D8D; position: absolute; left: 0; right: 0; bottom: 3px;}
#con2 .bx .inner .bx4 .inner .flex-bx .l-bx .txt1{font-size: 16px; letter-spacing: 0.8px; line-height: 1.75; margin-bottom: 35px;}
#con2 .bx .inner .bx4 .inner .flex-bx .r-bx{}
#con2 .bx .inner .bx4 .inner .flex-bx .r-bx .img{position: absolute; top: -50px; right: 0;}

#con2 .bx .inner .bx5{position: relative; padding-bottom: 140px}
#con2 .bx .inner .bx5::before{content: ""; width: 1px; height: 100%; margin: 0 auto; background: url(../images/after/con2-all-icon.svg) repeat-y bottom; position: absolute; left: 33px; top: 0;}
#con2 .bx .inner .bx5 .inner{padding-left: 112px;}
#con2 .bx .inner .bx5 .inner .num{position: absolute; left: 0; top: -10px}
#con2 .bx .inner .bx5 .inner .flex-bx{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;}
#con2 .bx .inner .bx5 .inner .flex-bx .l-bx{width: 600px; }
#con2 .bx .inner .bx5 .inner .flex-bx .l-bx .ttl1{font-size: 24px; letter-spacing: 1px; line-height: 1.7; width: 314px; position: relative; margin-bottom: 18px;}
#con2 .bx .inner .bx5 .inner .flex-bx .l-bx .ttl1::after{content: ""; width: 314px; height: 1px; background: #8E8D8D; position: absolute; left: 0; right: 0; bottom: 3px;}
#con2 .bx .inner .bx5 .inner .flex-bx .l-bx .txt1{font-size: 16px; letter-spacing: 0.8px; line-height: 1.75; margin-bottom: 35px;}
#con2 .bx .inner .bx5 .inner .flex-bx .r-bx{}
#con2 .bx .inner .bx5 .inner .flex-bx .r-bx .img{position: absolute; top: -40px; right: 0;}

#con2 .bx .inner .bx6{position: relative; padding-bottom: 130px}
#con2 .bx .inner .bx6::before{content: ""; width: 1px; height: 100%; margin: 0 auto; background: url(../images/after/con2-all-icon.svg) repeat-y bottom; position: absolute; left: 33px; top: 0;}
#con2 .bx .inner .bx6 .inner{padding-left: 112px;}
#con2 .bx .inner .bx6 .inner .num{position: absolute; left: 0; top: -10px}
#con2 .bx .inner .bx6 .inner .flex-bx{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;}
#con2 .bx .inner .bx6 .inner .flex-bx .l-bx{width: 600px; }
#con2 .bx .inner .bx6 .inner .flex-bx .l-bx .ttl1{font-size: 24px; letter-spacing: 1px; line-height: 1.7; width: 314px; position: relative; margin-bottom: 18px;}
#con2 .bx .inner .bx6 .inner .flex-bx .l-bx .ttl1::after{content: ""; width: 314px; height: 1px; background: #8E8D8D; position: absolute; left: 0; right: 0; bottom: 3px;}
#con2 .bx .inner .bx6 .inner .flex-bx .l-bx .txt1{font-size: 16px; letter-spacing: 0.8px; line-height: 1.75; margin-bottom: 35px;}
#con2 .bx .inner .bx6 .inner .flex-bx .r-bx{}
#con2 .bx .inner .bx6 .inner .flex-bx .r-bx .img{position: absolute; top: -50px; right: 0;}

#con2 .bx .inner .bx7{position: relative; padding-bottom: 130px}
#con2 .bx .inner .bx7::before{content: ""; width: 1px; height: 100%; margin: 0 auto; background: url(../images/after/con2-all-icon.svg) repeat-y bottom; position: absolute; left: 33px; top: 0;}
#con2 .bx .inner .bx7 .inner{padding-left: 112px;}
#con2 .bx .inner .bx7 .inner .num{position: absolute; left: 0; top: -10px}
#con2 .bx .inner .bx7 .inner .flex-bx{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;}
#con2 .bx .inner .bx7 .inner .flex-bx .l-bx{width: 600px; }
#con2 .bx .inner .bx7 .inner .flex-bx .l-bx .ttl1{font-size: 24px; letter-spacing: 1px; line-height: 1.7; width: 314px; position: relative; margin-bottom: 18px;}
#con2 .bx .inner .bx7 .inner .flex-bx .l-bx .ttl1::after{content: ""; width: 314px; height: 1px; background: #8E8D8D; position: absolute; left: 0; right: 0; bottom: 3px;}
#con2 .bx .inner .bx7 .inner .flex-bx .l-bx .txt1{font-size: 16px; letter-spacing: 0.8px; line-height: 1.75; margin-bottom: 35px;}
#con2 .bx .inner .bx7 .inner .flex-bx .r-bx{}
#con2 .bx .inner .bx7 .inner .flex-bx .r-bx .img{position: absolute; top: -50px; right: 0;}

#con2 .bx .inner .bx8{position: relative; padding-bottom: 130px}
#con2 .bx .inner .bx8::before{content: ""; width: 1px; height: 100%; margin: 0 auto; background: url(../images/after/con2-all-icon.svg) repeat-y bottom; position: absolute; left: 33px; top: 0;}
#con2 .bx .inner .bx8 .inner{padding-left: 112px;}
#con2 .bx .inner .bx8 .inner .num{position: absolute; left: 0; top: -10px}
#con2 .bx .inner .bx8 .inner .flex-bx{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;}
#con2 .bx .inner .bx8 .inner .flex-bx .l-bx{width: 600px; }
#con2 .bx .inner .bx8 .inner .flex-bx .l-bx .ttl1{font-size: 24px; letter-spacing: 1px; line-height: 1.7; width: 314px; position: relative; margin-bottom: 18px;}
#con2 .bx .inner .bx8 .inner .flex-bx .l-bx .ttl1::after{content: ""; width: 314px; height: 1px; background: #8E8D8D; position: absolute; left: 0; right: 0; bottom: 3px;}
#con2 .bx .inner .bx8 .inner .flex-bx .l-bx .txt1{font-size: 16px; letter-spacing: 0.8px; line-height: 1.75; margin-bottom: 35px;}
#con2 .bx .inner .bx8 .inner .flex-bx .r-bx{}
#con2 .bx .inner .bx8 .inner .flex-bx .r-bx .img{position: absolute; top: -50px; right: 0;}

#con2 .bx .inner .bx9{position: relative; padding-bottom: 135px}
#con2 .bx .inner .bx9 .inner{padding-left: 112px;}
#con2 .bx .inner .bx9 .inner .num{position: absolute; left: 0; top: -10px}
#con2 .bx .inner .bx9 .inner .flex-bx{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;}
#con2 .bx .inner .bx9 .inner .flex-bx .l-bx{width: 600px; }
#con2 .bx .inner .bx9 .inner .flex-bx .l-bx .ttl1{font-size: 24px; letter-spacing: 1px; line-height: 1.7; width: 314px; position: relative; margin-bottom: 18px;}
#con2 .bx .inner .bx9 .inner .flex-bx .l-bx .ttl1::after{content: ""; width: 314px; height: 1px; background: #8E8D8D; position: absolute; left: 0; right: 0; bottom: 3px;}
#con2 .bx .inner .bx9 .inner .flex-bx .l-bx .txt1{font-size: 16px; letter-spacing: 0.8px; line-height: 1.75; margin-bottom: 35px;}
#con2 .bx .inner .bx9 .inner .flex-bx .r-bx{}
#con2 .bx .inner .bx9 .inner .flex-bx .r-bx .img{position: absolute; top: -40px; right: 0;}



#con3 {width: 100%; max-width: 1920px; margin: 0 auto 207px;}
#con3 .bx{width: 100%; max-width: 1560px; margin: 0 auto -43px; background: #F2F2F2; border-top: 6px solid #5F5D5D; padding-top: 76px; padding-bottom: 25px; position: relative; z-index: 1;}
#con3 .bx .inner{width: 1100px; margin: 0 auto; position: relative;}
#con3 .bx .inner .ttl{ text-align: center; line-height: 1.8; margin-bottom: 87px;}
#con3 .bx .inner .ttl .ss1{font-size: 26px;font-weight: 300;letter-spacing: 1.5px;}
#con3 .bx .inner .ttl .ss2{font-size: 42px; letter-spacing: 1.8px; padding-left: 5px; position: relative;}
#con3 .bx .inner .ttl .ss2::after{content: ""; width: 386px; height: 1px; margin: 0 auto; background: #1C1C1C; position: absolute; left: -15px; right: 0; bottom: -6px;}


#con3 .bx .inner .bx1{width: 1100px; margin: 0 auto 140px; position: relative;}
#con3 .bx .inner .bx1 .inner1{width: 587px; margin-left: auto; background: #F2F2F2; padding: 38px 95px 30px 36px; position: relative; z-index: 1;}
#con3 .bx .inner .bx1 .inner1 .ttl1{font-size: 24px; letter-spacing: 1.1px; line-height: 1.6; padding: 7px 0 7px 30px; display: inline-block; background: #FFFFFF; margin-bottom: 17px; }
#con3 .bx .inner .bx1 .inner1 .txt{font-size: 16px; letter-spacing: 0.8px; line-height: 1.75; padding-left: 25px;}
#con3 .bx .inner .bx1 .img{position: absolute; left: 0; top: -34px;}

#con3 .bx .inner .bx2{}
#con3 .bx .inner .bx2 .inner2{width: 1100px; margin: 0 auto 114px;}
#con3 .bx .inner .bx2 .inner2 .ttl {text-align: center; line-height: 1.2; margin-bottom: 7px;}
#con3 .bx .inner .bx2 .inner2 .ttl .ss1{font-size: 26px; font-weight: 200; letter-spacing: 1.5px; }
#con3 .bx .inner .bx2 .inner2 .ttl .ss2{font-size: 60px; letter-spacing: 1.5px; }
#con3 .bx .inner .bx2 .inner2 .ttl .ss2::after{ width:0; height:0; }
#con3 .bx .inner .bx2 .inner2 .ttl .ss3{font-size: 36px; letter-spacing: 1.5px; }

#con3 .bx .inner .bx2 .inner2 .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;}
#con3 .bx .inner .bx2 .inner2 .list li{width: 350px; margin-right: 25px; background: #fff; padding: 16px 25px 36px;}
#con3 .bx .inner .bx2 .inner2 .list li:last-child{margin-right: 0}
#con3 .bx .inner .bx2 .inner2 .list li .num{font-size: 14px; font-weight: 300; text-align: center; letter-spacing: 0.8px; margin-bottom: 8px;}
#con3 .bx .inner .bx2 .inner2 .list li .ttl1{font-size: 20px; font-weight: 400; text-align: center; letter-spacing: 1.0px; margin-bottom: 12px;}
#con3 .bx .inner .bx2 .inner2 .list li .img{text-align: center; margin-bottom: 15px;}
#con3 .bx .inner .bx2 .inner2 .list li .txt{font-size: 16px; font-weight: 400; line-height: 1.7; letter-spacing: 0.8px; }

#con3 .bx .inner .bx3{}
#con3 .bx .inner .bx3 .inner3{width: 1100px; margin: 0 auto 120px;}
#con3 .bx .inner .bx3 .inner3 .ttl {font-size: 32px; font-weight: 400; letter-spacing: 1.5px; text-align: center; margin-bottom: 30px;}

#con3 .bx .inner .bx3 .inner3 .hint-bx {margin-bottom: 22px;}
#con3 .bx .inner .bx3 .inner3 .hint-bx .img{}

#con3 .bx .inner .bx3 .inner3 .txt {font-size: 14px; font-weight: 400; letter-spacing: 0.7px; width: 980px; margin: 0 auto 11px; padding-left: 100px;}
#con3 .bx .inner .bx3 .inner3 .txt1 {font-size: 13px; font-weight: 400; letter-spacing: 0.7px; width: 980px; margin: 0 auto; padding-left: 100px;}

#con3 .last-bg{content: ""; width: 100%; height: 703px; max-width: 1920px; margin: 0 auto 105px; background: url(../images/after/con3-last-bg.png) no-repeat top center; position: relative;;}
#con3 .last-bg::after{content: ""; width: 1px; height: 150px; margin: 0 auto; background: #5F5E5E; position: absolute; left: 0; right: 0; bottom: -70px;}
#con3 .last-ttl{font-size: 24px; font-weight: 400; letter-spacing: 1.2px; line-height: 2.2; text-align: center;}


#con4 {}
#con4 .list{width: 1100px; margin: 0 auto 175px; 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;}
#con4 .list li{width: 340px; margin-right: 40px;}
#con4 .list li:last-child{margin-right: 0}
#con4 .list li .img{margin-bottom: 15px;}
#con4 .list li .txt{font-size: 14px; font-weight: 400; letter-spacing: 0.6px; line-height: 1.7;}

}





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

main {line-height: 1.9;}


#con1 {width: 100%; margin: 0 auto;}
#con1 .bx{width: 100%; margin: 0 auto -15vw; position: relative; }
#con1 .bx .r-bx{width: 100%; margin: 13vw auto 14vw; }
#con1 .bx .r-bx .ttl{font-size: 6vw; letter-spacing: 0.05vw; line-height: 1.9; text-align: center; margin-bottom: 2vw;}
#con1 .bx .r-bx .ttl1{font-size: 5.4vw; letter-spacing: 0.2vw; line-height: 1.8; background: #F2F2F2; padding: 1vw 0; text-align: center; display: block; width: 77%; margin: 0 auto 5vw;}
#con1 .bx .l-bx{width: 92%; margin: 0 auto;}

#con1 .bx1{width: 100%; margin: 0 auto 0; padding: 10vw 0 0; background: linear-gradient(360deg, #fff 0%, #fff 5.5%, #5F5E5E 5.5%, #5F5E5F 100%);}
#con1 .bx1 .inner1{width: 96%; margin: -14.5vw auto 24vw; color: #fff; position: relative;}
#con1 .bx1 .inner1 .ttl2{font-size: 10vw; font-weight: 200; text-align: left; letter-spacing: 0.9vw; line-height: 1.2; margin-bottom: 10vw; padding: 0 0 0 5vw;}
#con1 .bx1 .inner1 .ttl3{font-size: 5.8vw; letter-spacing: 0.8vw; text-align: center; line-height: 2.5; padding-bottom: 5vw; margin-bottom: 1vw; position: relative;}
#con1 .bx1 .inner1 .ttl3 .ss1{position: relative;}
#con1 .bx1 .inner1 .ttl3 .ss1::after{content: ""; width: 100%; height: 1px; margin: 0 auto; background: url(../images/after/con1-ttl-icon.png) repeat-x bottom; position: absolute; left: -4vw; right: 0; bottom: -3vw;}
#con1 .bx1 .inner1 .ttl3 .ss2{position: relative;}
#con1 .bx1 .inner1 .ttl3 .ss2::after{content: "";  width: 100%;  height: 1px;  margin: 0 auto;  background: url(../images/after/con1-ttl-icon.png) repeat-x bottom;  position: absolute;  left: -3vw;  right: 0;  bottom: -3vw;}
#con1 .bx1 .inner1 .txt{font-size: 3.8vw;  letter-spacing: 0.25vw;  line-height: 1.75;  margin-bottom: 9vw;  padding: 0 4.5vw;}
#con1 .bx1 .inner1 .list{width: 91%; margin: 0 auto 6vw; 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; }
#con1 .bx1 .inner1 .list li{ margin-bottom: 1%;}
#con1 .bx1 .inner1 .list li:nth-child(2){width: 49%; margin-right: 2%;}
#con1 .bx1 .inner1 .list li:nth-child(3){width: 49%; }
#con1 .bx1 .inner1 .list-link{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;}
#con1 .bx1 .inner1 .list-link li{ width: 44%; margin-right: 3%;}
#con1 .bx1 .inner1 .list-link li:last-child{margin-right: 0;}


#con2 {width: 92%; margin: 0 auto;}
#con2 .bx{width: 100%; margin: 0 auto 12.5vw; background: #F2F2F2; border-top: 6px solid #5F5D5D; padding-top: 13vw;}
#con2 .bx .inner{width: 100%; margin: 0 auto; position: relative;}
#con2 .bx .inner .ttl{ text-align: center; line-height: 1.7; margin-bottom: 15vw;}
#con2 .bx .inner .ttl .ss1{font-size: 4.8vw;font-weight: 300;letter-spacing: 0.2vw;padding-right: 2vw;}
#con2 .bx .inner .ttl .ss2{font-size: 7.15vw; letter-spacing: 0.5vw; padding-right: 2vw; position: relative;}
#con2 .bx .inner .ttl .ss2::after{content: ""; width: 100%; height: 1px; margin: 0 auto; background: #1C1C1C; position: absolute; left: -2vw; right: 0; bottom: -1.5vw;}

#con2 .bx .inner .bx1{position: relative; padding-bottom: 10.5vw}
#con2 .bx .inner .bx1::before{content: ""; width: 1px; height: 100%; margin: 0 auto; background: url(../images/after/con2-all-icon.svg) repeat-y bottom; position: absolute; left: 7.5vw; top: 0; }
#con2 .bx .inner .bx1 .inner{padding-left: 16vw;}
#con2 .bx .inner .bx1 .inner .num{position: absolute; left: 2.5vw; top: 0vw; width: 12%;}
#con2 .bx .inner .bx1 .inner .ttl1{font-size: 4.8vw; letter-spacing: 0.3vw; line-height: 1.7; position: relative; margin-bottom: 3vw;}
#con2 .bx .inner .bx1 .inner .ttl1::after{content: ""; width: 94%; height: 1px; background: #8E8D8D; position: absolute; left: 0; right: 0; bottom: -1vw;}
#con2 .bx .inner .bx1 .inner .txt1{font-size: 3.5vw; letter-spacing: 0.05vw; line-height: 1.75; margin-bottom: 5.5vw; padding-right: 5vw;}
#con2 .bx .inner .bx1 .inner .list{}
#con2 .bx .inner .bx1 .inner .list li{width: 94%; margin-bottom: 2.5vw;}
#con2 .bx .inner .bx1 .inner .list li:last-child{margin-bottom: 0;}

#con2 .bx .inner .bx2{position: relative; padding-bottom: 4vw}
#con2 .bx .inner .bx2::before{content: ""; width: 1px; height: 100%; margin: 0 auto; background: url(../images/after/con2-all-icon.svg) repeat-y bottom; position: absolute; left: 7.5vw; top: 0; }
#con2 .bx .inner .bx2 .inner{padding-left: 16vw; padding-right: 4vw;}
#con2 .bx .inner .bx2 .inner .num{position: absolute; left: 2.5vw; top: -1vw; width: 12%;}
#con2 .bx .inner .bx2 .inner .flex-bx{}
#con2 .bx .inner .bx2 .inner .flex-bx .l-bx{ }
#con2 .bx .inner .bx2 .inner .flex-bx .l-bx .ttl1{font-size: 4.8vw; letter-spacing: 0.3vw; line-height: 1.7; position: relative; margin-bottom: 6vw;}
#con2 .bx .inner .bx2 .inner .flex-bx .l-bx .ttl1::after{content: ""; width: 100%; height: 1px; background: #8E8D8D; position: absolute; left: 0; right: 0; bottom: -1vw;}
#con2 .bx .inner .bx2 .inner .flex-bx .l-bx .txt1{font-size: 3.5vw; letter-spacing: 0.05vw; line-height: 1.8; margin-bottom: 5.5vw; }
#con2 .bx .inner .bx2 .inner .img{margin-bottom: 3vw;}

#con2 .bx .inner .bx3{position: relative; padding-bottom: 4vw}
#con2 .bx .inner .bx3::before{content: ""; width: 1px; height: 100%; margin: 0 auto; background: url(../images/after/con2-all-icon.svg) repeat-y bottom; position: absolute; left: 7.5vw; top: 0; }
#con2 .bx .inner .bx3 .inner{padding-left: 16vw; padding-right: 4vw;}
#con2 .bx .inner .bx3 .inner .num{position: absolute; left: 2.5vw; top: -1vw; width: 12%;}
#con2 .bx .inner .bx3 .inner .flex-bx{}
#con2 .bx .inner .bx3 .inner .flex-bx .l-bx{ }
#con2 .bx .inner .bx3 .inner .flex-bx .l-bx .ttl1{font-size: 4.8vw; letter-spacing: 0.3vw; line-height: 1.7; position: relative; margin-bottom: 6vw;}
#con2 .bx .inner .bx3 .inner .flex-bx .l-bx .ttl1::after{content: ""; width: 100%; height: 1px; background: #8E8D8D; position: absolute; left: 0; right: 0; bottom: -1vw;}
#con2 .bx .inner .bx3 .inner .flex-bx .l-bx .txt1{font-size: 3.5vw; letter-spacing: 0.05vw; line-height: 1.8; margin-bottom: 5.5vw; }
#con2 .bx .inner .bx3 .inner .img{margin-bottom: 3vw;}

#con2 .bx .inner .bx4{position: relative; padding-bottom: 4vw}
#con2 .bx .inner .bx4::before{content: ""; width: 1px; height: 100%; margin: 0 auto; background: url(../images/after/con2-all-icon.svg) repeat-y bottom; position: absolute; left: 7.5vw; top: 0; }
#con2 .bx .inner .bx4 .inner{padding-left: 16vw; padding-right: 4vw;}
#con2 .bx .inner .bx4 .inner .num{position: absolute; left: 2.5vw; top: -1vw; width: 12%;}
#con2 .bx .inner .bx4 .inner .flex-bx{}
#con2 .bx .inner .bx4 .inner .flex-bx .l-bx{ }
#con2 .bx .inner .bx4 .inner .flex-bx .l-bx .ttl1{font-size: 4.8vw; letter-spacing: 0.3vw; line-height: 1.7; position: relative; margin-bottom: 6vw;}
#con2 .bx .inner .bx4 .inner .flex-bx .l-bx .ttl1::after{content: ""; width: 100%; height: 1px; background: #8E8D8D; position: absolute; left: 0; right: 0; bottom: -1vw;}
#con2 .bx .inner .bx4 .inner .flex-bx .l-bx .txt1{font-size: 3.5vw; letter-spacing: 0.05vw; line-height: 1.8; margin-bottom: 5.5vw; }
#con2 .bx .inner .bx4 .inner .img{margin-bottom: 3vw;}

#con2 .bx .inner .bx5{position: relative; padding-bottom: 3vw}
#con2 .bx .inner .bx5::before{content: ""; width: 1px; height: 100%; margin: 0 auto; background: url(../images/after/con2-all-icon.svg) repeat-y bottom; position: absolute; left: 7.5vw; top: 0; }
#con2 .bx .inner .bx5 .inner{padding-left: 16vw; padding-right: 4vw;}
#con2 .bx .inner .bx5 .inner .num{position: absolute; left: 2.5vw; top: -1vw; width: 12%;}
#con2 .bx .inner .bx5 .inner .flex-bx{}
#con2 .bx .inner .bx5 .inner .flex-bx .l-bx{ }
#con2 .bx .inner .bx5 .inner .flex-bx .l-bx .ttl1{font-size: 4.8vw; letter-spacing: 0.3vw; line-height: 1.7; position: relative; margin-bottom: 6vw;}
#con2 .bx .inner .bx5 .inner .flex-bx .l-bx .ttl1::after{content: ""; width: 100%; height: 1px; background: #8E8D8D; position: absolute; left: 0; right: 0; bottom: -1vw;}
#con2 .bx .inner .bx5 .inner .flex-bx .l-bx .txt1{font-size: 3.5vw; letter-spacing: 0.05vw; line-height: 1.8; margin-bottom: 5.5vw; }
#con2 .bx .inner .bx5 .inner .img{margin-bottom: 3vw;}

#con2 .bx .inner .bx6{position: relative; padding-bottom: 4vw}
#con2 .bx .inner .bx6::before{content: ""; width: 1px; height: 100%; margin: 0 auto; background: url(../images/after/con2-all-icon.svg) repeat-y bottom; position: absolute; left: 7.5vw; top: 0; }
#con2 .bx .inner .bx6 .inner{padding-left: 16vw; padding-right: 4vw;}
#con2 .bx .inner .bx6 .inner .num{position: absolute; left: 2.5vw; top: -1vw; width: 12%;}
#con2 .bx .inner .bx6 .inner .flex-bx{}
#con2 .bx .inner .bx6 .inner .flex-bx .l-bx{ }
#con2 .bx .inner .bx6 .inner .flex-bx .l-bx .ttl1{font-size: 4.8vw; letter-spacing: 0.3vw; line-height: 1.7; position: relative; margin-bottom: 6vw;}
#con2 .bx .inner .bx6 .inner .flex-bx .l-bx .ttl1::after{content: ""; width: 100%; height: 1px; background: #8E8D8D; position: absolute; left: 0; right: 0; bottom: -1vw;}
#con2 .bx .inner .bx6 .inner .flex-bx .l-bx .txt1{font-size: 3.5vw; letter-spacing: 0.05vw; line-height: 1.8; margin-bottom: 5.5vw; }
#con2 .bx .inner .bx6 .inner .img{margin-bottom: 3vw;}

#con2 .bx .inner .bx7{position: relative; padding-bottom: 4vw}
#con2 .bx .inner .bx7::before{content: ""; width: 1px; height: 100%; margin: 0 auto; background: url(../images/after/con2-all-icon.svg) repeat-y bottom; position: absolute; left: 7.5vw; top: 0; }
#con2 .bx .inner .bx7 .inner{padding-left: 16vw; padding-right: 4vw;}
#con2 .bx .inner .bx7 .inner .num{position: absolute; left: 2.5vw; top: -1vw; width: 12%;}
#con2 .bx .inner .bx7 .inner .flex-bx{}
#con2 .bx .inner .bx7 .inner .flex-bx .l-bx{ }
#con2 .bx .inner .bx7 .inner .flex-bx .l-bx .ttl1{font-size: 4.8vw; letter-spacing: 0.3vw; line-height: 1.7; position: relative; margin-bottom: 6vw;}
#con2 .bx .inner .bx7 .inner .flex-bx .l-bx .ttl1::after{content: ""; width: 100%; height: 1px; background: #8E8D8D; position: absolute; left: 0; right: 0; bottom: -1vw;}
#con2 .bx .inner .bx7 .inner .flex-bx .l-bx .txt1{font-size: 3.5vw; letter-spacing: 0.05vw; line-height: 1.8; margin-bottom: 5.5vw; }
#con2 .bx .inner .bx7 .inner .img{margin-bottom: 3vw;}

#con2 .bx .inner .bx8{position: relative; padding-bottom: 4vw}
#con2 .bx .inner .bx8::before{content: ""; width: 1px; height: 100%; margin: 0 auto; background: url(../images/after/con2-all-icon.svg) repeat-y bottom; position: absolute; left: 7.5vw; top: 0; }
#con2 .bx .inner .bx8 .inner{padding-left: 16vw; padding-right: 4vw;}
#con2 .bx .inner .bx8 .inner .num{position: absolute; left: 2.5vw; top: -1vw; width: 12%;}
#con2 .bx .inner .bx8 .inner .flex-bx{}
#con2 .bx .inner .bx8 .inner .flex-bx .l-bx{ }
#con2 .bx .inner .bx8 .inner .flex-bx .l-bx .ttl1{font-size: 4.8vw; letter-spacing: 0.3vw; line-height: 1.7; position: relative; margin-bottom: 6vw;}
#con2 .bx .inner .bx8 .inner .flex-bx .l-bx .ttl1::after{content: ""; width: 100%; height: 1px; background: #8E8D8D; position: absolute; left: 0; right: 0; bottom: -1vw;}
#con2 .bx .inner .bx8 .inner .flex-bx .l-bx .txt1{font-size: 3.5vw; letter-spacing: 0.05vw; line-height: 1.8; margin-bottom: 5.5vw; }
#con2 .bx .inner .bx8 .inner .img{margin-bottom: 3vw;}

#con2 .bx .inner .bx9{position: relative; padding-bottom: 7vw}
#con2 .bx .inner .bx9 .inner{padding-left: 16vw; padding-right: 4vw;}
#con2 .bx .inner .bx9 .inner .num{position: absolute; left: 2.5vw; top: -1vw; width: 12%;}
#con2 .bx .inner .bx9 .inner .flex-bx{}
#con2 .bx .inner .bx9 .inner .flex-bx .l-bx{ }
#con2 .bx .inner .bx9 .inner .flex-bx .l-bx .ttl1{font-size: 4.8vw; letter-spacing: 0.3vw; line-height: 1.7; position: relative; margin-bottom: 6vw;}
#con2 .bx .inner .bx9 .inner .flex-bx .l-bx .ttl1::after{content: ""; width: 100%; height: 1px; background: #8E8D8D; position: absolute; left: 0; right: 0; bottom: -1vw;}
#con2 .bx .inner .bx9 .inner .flex-bx .l-bx .txt1{font-size: 3.5vw; letter-spacing: 0.05vw; line-height: 1.8; margin-bottom: 5.5vw; }
#con2 .bx .inner .bx9 .inner .img{margin-bottom: 3vw;}


#con3 {width: 100%; margin: 0 auto;}
#con3 .bx{width: 92%; margin: 0 auto -7.5vw; background: #F2F2F2; border-top: 6px solid #5F5D5D; padding-top: 14vw; position: relative; z-index: 1;}
#con3 .bx .inner{width: 100%; margin: 0 auto; position: relative; padding-bottom: 0.5vw;}
#con3 .bx .inner .ttl{ text-align: center; line-height: 1.7; margin-bottom: 11vw;}
#con3 .bx .inner .ttl .ss1{font-size: 4.8vw;font-weight: 300;letter-spacing: 0.2vw;}
#con3 .bx .inner .ttl .ss2{font-size: 7.15vw; letter-spacing: 0.5vw; padding-right: 2vw; position: relative;}
#con3 .bx .inner .ttl .ss2::after{content: ""; width: 100%; height: 1px; margin: 0 auto; background: #1C1C1C; position: absolute; left: -2vw; right: 0; bottom: -1.5vw;}

#con3 .bx .inner .bx1{width: 94%; margin: 0 auto 18vw; position: relative;}
#con3 .bx .inner .bx1 .inner1{width: 100%; margin: 0 auto;}
#con3 .bx .inner .bx1 .inner1 .ttl1{width: 95%; margin: 0px auto -2vw; font-size: 4.3vw; letter-spacing: 0.25vw; line-height: 1.6; padding: 1.5vw 0vw 1.5vw 4vw; background: #FFFFFF; position: relative;}
#con3 .bx .inner .bx1 .inner1 .txt{font-size: 3.5vw; letter-spacing: 0.05vw; line-height: 1.8; margin-bottom: 5.5vw; padding-left: 2vw;}
#con3 .bx .inner .bx1 .img{margin-bottom: 3.5vw;}

#con3 .bx .inner .bx2{}
#con3 .bx .inner .bx2 .inner2{width: 100%; margin: 0 auto 17vw;}
#con3 .bx .inner .bx2 .inner2 .ttl {text-align: center; line-height: 1.2; margin-bottom: 3vw;}
#con3 .bx .inner .bx2 .inner2 .ttl .ss1{font-size: 4vw; font-weight: 200; letter-spacing: 0.6vw; padding-left: 1vw;}
#con3 .bx .inner .bx2 .inner2 .ttl .ss2{font-size: 11vw; letter-spacing: 0.5vw; padding-right: 0;}
#con3 .bx .inner .bx2 .inner2 .ttl .ss2::after{ width:0; height:0; }
#con3 .bx .inner .bx2 .inner2 .ttl .ss3{font-size: 6.4vw; letter-spacing: 0.5vw; }

#con3 .bx .inner .bx2 .inner2 .list{}
#con3 .bx .inner .bx2 .inner2 .list li{width: 90%; margin: 0 auto 5vw; background: #fff; padding: 4vw 5.5vw 9vw 5.8vw;}
#con3 .bx .inner .bx2 .inner2 .list li:last-child{margin-bottom: 0}
#con3 .bx .inner .bx2 .inner2 .list li .num{font-size: 3.4vw; font-weight: 300; text-align: center; letter-spacing: 0.2vw; margin-bottom: 2vw;}
#con3 .bx .inner .bx2 .inner2 .list li .ttl1{font-size: 4.7vw; font-weight: 400; text-align: center; letter-spacing: 0.2vw; margin-bottom: 3vw;}
#con3 .bx .inner .bx2 .inner2 .list li .img{text-align: center; margin-bottom: 3vw;}
#con3 .bx .inner .bx2 .inner2 .list li .txt{font-size: 3.5vw; font-weight: 400; line-height: 1.8; letter-spacing: 0.0vw;}

#con3 .bx .inner .bx3{}
#con3 .bx .inner .bx3 .inner3{width: 87%; margin: 0 auto 12vw;}
#con3 .bx .inner .bx3 .inner3 .ttl {font-size: 6.15vw; letter-spacing: 0.5vw; text-align: center; position: relative; margin-bottom: 3vw;}

#con3 .bx .inner .bx3 .inner3 .hint-bx {margin-bottom: 6vw;}

  /* スクロールエリア */
  .js-scrollable {
    overflow-x: auto;     /* 横スクロールを有効化 */
    overflow-y: hidden;
    white-space: nowrap;  /* 横並びで表示 */
    -webkit-overflow-scrolling: touch;
  }

  /* 画像を画面幅より広くしてスクロールさせる */
  .hint-bx .big-img {
    display: inline-block;
    width: 340%;        /* ←これが横スクロールのポイント！ */
  }

  .hint-bx .big-img img {
    width: 100%;
    height: 100%;
  }

/* PC では scroll-hint のアイコンを非表示 */
@media screen and (min-width: 768px){
  .scroll-hint-icon-wrap,
  .scroll-hint-text {
    display: none !important;
  }
}

#con3 .bx .inner .bx3 .inner3 .txt {font-size: 3.6vw; font-weight: 400; margin-bottom: 4vw; }
#con3 .bx .inner .bx3 .inner3 .txt1 {font-size: 3.3vw; font-weight: 400;  }

#con3 .last-bg{content: ""; width: 100%; height: 103vw; margin: 0 auto 18vw; background: url(../images/after/sp-con3-last-bg.png) no-repeat top center; position: relative; background-size: 100%;}
#con3 .last-bg::after{content: ""; width: 1px; height: 20vw; margin: 0 auto; background: #5F5E5E; position: absolute; left: 0; right: 0; bottom: -10vw;}
#con3 .last-ttl{font-size: 4.6vw; font-weight: 400; letter-spacing: 0; line-height: 1.7; text-align: center; margin-bottom: 29vw;}


#con4 {}
#con4 .list{width: 82%; margin: 0 auto 29vw; }
#con4 .list li{margin-bottom: 8vw;}
#con4 .list li:last-child{margin-bottom: 0}
#con4 .list li .img{margin-bottom: 4vw;}
#con4 .list li .txt{font-size: 3.5vw; font-weight: 400; letter-spacing: 0.05vw; line-height: 1.7;}



}