@charset "UTF-8";
.f-zen {font-family: "Zen Old Mincho", serif;font-style: normal;}

@media screen and (min-width: 768px),print {
main {letter-spacing: 1px;}

#con1 {}
#con1 .bx{width: 100%; max-width: 1920px; margin: 80px auto 176px; position: relative;}
#con1 .bx::before{content: ""; width: 100%; height: 340px; margin: 0 auto; background: #EEECE7; position: absolute; left: 0; right: 0; bottom: -65px; z-index: -1;}
#con1 .bx .inner{width: 1200px; margin: 0 auto; }
#con1 .bx .inner .ttl{font-size: 56px; letter-spacing: 2.8px; line-height: 0.9; text-align: center; margin-bottom: 63px;}
#con1 .bx .inner .img{text-align: center; margin-bottom: 58px;}
#con1 .bx .inner .txt{font-size: 16px; letter-spacing: 0.75px; line-height: 1.95; text-align: center; position: relative; margin-bottom: 100px; padding-left: 38px;}

#con2 {}
#con2 .bx{width: 100%; max-width: 1920px; margin: 0 auto 105px; }
#con2 .bx .inner{width: 1100px; margin: 0 auto; }

#con2 .bx .inner .tab-all .content {display: none;/*必須*/}
#con2 .bx .inner .tab-all .content.show {display: block;/*必須*/}
#con2 .bx .inner .tab-all .tab {cursor: pointer;}
#con2 .bx .inner .tab-all .tab-container {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 .tab-all .tab-container .tab {position: relative;}

#con2 .bx .inner .tab-all .con-left .list {border: 1px solid #C6C6C6; padding: 65px 50px 47px;}
#con2 .bx .inner .tab-all .con-left .list li {position: relative; margin-bottom: 73px;}
#con2 .bx .inner .tab-all .con-left .list li::after {content: ""; width: 1px; height: 100%; margin: 0 auto; background: url(../images/roadmap/con2-icon.png) repeat-y; position: absolute; left: 86px; top: 70px;}
#con2 .bx .inner .tab-all .con-left .list li:last-child:after {background: none;}
#con2 .bx .inner .tab-all .con-left .list li .num{position: absolute; left: -2px; top: -16px; z-index: 1;}
#con2 .bx .inner .tab-all .con-left .list li .flex-bx{width: 786px; margin: 0 auto; position: relative;}
#con2 .bx .inner .tab-all .con-left .list li .flex-bx::after{content: ""; width: 786px; height: 1px; margin: 0 auto; background: #E0E0E0; position: absolute; left: 105px; right: 0; bottom: -38px;}
#con2 .bx .inner .tab-all .con-left .list li:last-child .flex-bx::after{background: none;}
#con2 .bx .inner .tab-all .con-left .list li .flex-bx .l-bx{width: 400px; margin-right: auto; margin-left: 107px;}
#con2 .bx .inner .tab-all .con-left .list li .flex-bx .l-bx .ttl{font-size: 20px; font-weight: bold; letter-spacing: 1px; margin-bottom: 18px;}
#con2 .bx .inner .tab-all .con-left .list li .flex-bx .img{position: absolute; right: -106px; top: 4px;}
#con2 .bx .inner .tab-all .con-left .list li .flex-bx .l-bx .txt1{font-size: 16px; letter-spacing: 0.8px; line-height: 1.98; margin-bottom: 1px; position: relative; padding-left: 21px;}
#con2 .bx .inner .tab-all .con-left .list li .flex-bx .l-bx .txt1::before{content: "①"; position: absolute; left: 0; top: 0;}
#con2 .bx .inner .tab-all .con-left .list li .flex-bx .l-bx .txt2{font-size: 16px; letter-spacing: 0.8px; line-height: 1.98; margin-bottom: 20px; position: relative; padding-left: 21px;}
#con2 .bx .inner .tab-all .con-left .list li .flex-bx .l-bx .txt2::before{content: "②"; position: absolute; left: 0; top: 0;}
#con2 .bx .inner .tab-all .con-left .list li .flex-bx .l-bx .txt{font-size: 16px; letter-spacing: 0.8px; line-height: 1.98; margin-bottom: 1px; position: relative; }
#con2 .bx .inner .tab-all .con-left .list li .flex-bx .l-bx .ttl-job{font-size: 16px; font-weight: bold; letter-spacing: 0.7px; margin-bottom: 16px; display: inline-block; background: #F7F6F4; padding: 10px 17px 5px 11px;}


#con2 .bx .inner .tab-all .con-right .list {border: 1px solid #C6C6C6; padding: 65px 50px 52px;}
#con2 .bx .inner .tab-all .con-right .list li {position: relative; margin-bottom: 90px;}
#con2 .bx .inner .tab-all .con-right .list li:nth-child(2) {position: relative; margin-bottom: 164px;}
#con2 .bx .inner .tab-all .con-right .list li:last-child {margin-bottom: 0;}
#con2 .bx .inner .tab-all .con-right .list li::after {content: ""; width: 1px; height: 100%; margin: 0 auto; background: url(../images/roadmap/con2-icon.png) repeat-y; position: absolute; left: 86px; top: 150px;}
#con2 .bx .inner .tab-all .con-right .list li:last-child:after {background: none;}
#con2 .bx .inner .tab-all .con-right .list li .num{position: absolute; left: -2px; top: -16px; z-index: 1;}
#con2 .bx .inner .tab-all .con-right .list li .flex-bx{width: 786px; margin: 0 auto; position: relative;}
#con2 .bx .inner .tab-all .con-right .list li .flex-bx::after{content: ""; width: 786px; height: 1px; margin: 0 auto; background: #E0E0E0; position: absolute; left: 105px; right: 0; bottom: -56px;}
#con2 .bx .inner .tab-all .con-right .list li:nth-child(2) .flex-bx::after{content: ""; width: 786px; height: 1px; margin: 0 auto; background: #E0E0E0; position: absolute; left: 105px; right: 0; bottom: -126px;}
#con2 .bx .inner .tab-all .con-right .list li:last-child .flex-bx::after{background: none;}
#con2 .bx .inner .tab-all .con-right .list li .flex-bx .l-bx{width: 400px; margin-right: auto; margin-left: 107px;}
#con2 .bx .inner .tab-all .con-right .list li .flex-bx .l-bx .ttl{font-size: 20px; font-weight: bold; letter-spacing: 1px; margin-bottom: 18px;}
#con2 .bx .inner .tab-all .con-right .list li .flex-bx .img{position: absolute; right: -106px; top: 4px;}

#con2 .bx .inner .tab-all .con-right .list li .flex-bx .l-bx .list-bx1{font-size: 16px; letter-spacing: 0.8px; line-height: 1.98; margin-bottom: 1px; position: relative; padding-left: 38px;}
#con2 .bx .inner .tab-all .con-right .list li .flex-bx .l-bx .list-bx1::before{content: "①"; position: absolute; left: 0; top: 0;}
#con2 .bx .inner .tab-all .con-right .list li .flex-bx .l-bx .list-bx1 .list-txt{position: relative; margin-bottom: 0;}
#con2 .bx .inner .tab-all .con-right .list li .flex-bx .l-bx .list-bx1 .list-txt::before{content: ""; width: 5px; height: 5px; background: #E95504; border-radius: 100%; position: absolute; left: -12px; top: 10px;}
#con2 .bx .inner .tab-all .con-right .list li .flex-bx .l-bx .list-bx1 .list-txt::after {background: none;}

#con2 .bx .inner .tab-all .con-right .list li .flex-bx .l-bx .list-bx2{font-size: 16px; letter-spacing: 0.8px; line-height: 1.98; margin-bottom: 1px; position: relative; padding-left: 38px;}
#con2 .bx .inner .tab-all .con-right .list li .flex-bx .l-bx .list-bx2::before{content: "②"; position: absolute; left: 0; top: 0;}
#con2 .bx .inner .tab-all .con-right .list li .flex-bx .l-bx .list-bx2 .list-txt{position: relative; margin-bottom: 0;}
#con2 .bx .inner .tab-all .con-right .list li .flex-bx .l-bx .list-bx2 .list-txt::before{content: ""; width: 5px; height: 5px; background: #E95504; border-radius: 100%; position: absolute; left: -12px; top: 10px;}
#con2 .bx .inner .tab-all .con-right .list li .flex-bx .l-bx .list-bx2 .list-txt::after {background: none;}



#con3 {}
#con3 .bx{width: 100%; max-width: 1200px; margin: 0 auto 140px; position: relative;}
#con3 .bx::before{content: ""; width: 1100px; height: 401px; margin: 0 auto; background: #F5F5F5; position: absolute; left: 0; right: 0; top: 80px; z-index: -1;}
#con3 .bx .ttl{font-size: 32px; letter-spacing: 1.5px; text-align: center; margin-bottom: 84px;}
#con3 .bx .list{margin-bottom: 140px; position: relative; z-index: 1; 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;}
#con3 .bx .list li{margin-right: 100px; box-shadow: 0px 8px 16px -2px rgba(10,10,10,0.1), 0px 0px 15px 15px rgba(10,10,10,0.02);}
#con3 .bx .list li:last-child{margin-right: 0;}
#con3 .bx .link{text-align: center;}


}

@media screen and (max-width: 767px) {
main {letter-spacing: 0.3vw;}

#con1 {}
#con1 .bx{width: 100%; margin: 9vw auto 19.5vw; position: relative;}
#con1 .bx::before{content: ""; width: 100%; height: 80vw; margin: 0 auto; background: #EEECE7; position: absolute; left: 0; right: 0; bottom: -5vw; z-index: -1;}
#con1 .bx .inner{width: 100%; margin: 0 auto; }
#con1 .bx .inner .ttl{font-size: 6.2vw; letter-spacing: 0.5vw; line-height: 1.68; text-align: center; margin-bottom: 4.5vw;}
#con1 .bx .inner .img{text-align: center; margin-bottom: 6vw;}
#con1 .bx .inner .txt{font-size: 3.6vw; letter-spacing: 0.48vw; line-height: 2.15; position: relative; margin-bottom: 10vw; padding: 0 5vw;}

#con2 {}
#con2 .bx{width: 100%; margin: 0 auto 14vw; }
#con2 .bx .inner{width: 98%; margin: 0 auto; }

#con2 .bx .inner .tab-all .content {display: none;/*必須*/}
#con2 .bx .inner .tab-all .content.show {display: block;/*必須*/}
#con2 .bx .inner .tab-all .tab {cursor: pointer;}
#con2 .bx .inner .tab-all .tab-container {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 .tab-all .tab-container .tab {width: 50%; position: relative;}

#con2 .bx .inner .tab-all .con-left .list {border: 1px solid #C6C6C6; padding: 7vw 3vw 4vw;}
#con2 .bx .inner .tab-all .con-left .list li {position: relative; margin-bottom: 14vw;}
#con2 .bx .inner .tab-all .con-left .list li:nth-child(2) {position: relative; margin-bottom: 9vw;}
#con2 .bx .inner .tab-all .con-left .list li:nth-child(3) {position: relative; margin-bottom: 9vw;}
#con2 .bx .inner .tab-all .con-left .list li:last-child {position: relative; margin-bottom: 0;}
#con2 .bx .inner .tab-all .con-left .list li .num{width: 98%; margin: 0 auto 5vw;}
#con2 .bx .inner .tab-all .con-left .list li .flex-bx{width: 100%; margin: 0 auto; position: relative;}
#con2 .bx .inner .tab-all .con-left .list li .flex-bx::after{content: ""; width: 100%; height: 1px; margin: 0 auto; background: #E0E0E0; position: absolute; left: 0; right: 0; bottom: -4vw;}
#con2 .bx .inner .tab-all .con-left .list li:last-child .flex-bx::after{background: none;}
#con2 .bx .inner .tab-all .con-left .list li .flex-bx .l-bx{width: 100%; margin: 0 auto;}
#con2 .bx .inner .tab-all .con-left .list li .flex-bx .l-bx .ttl{font-size: 4.9vw; font-weight: bold; letter-spacing: 0.2vw; line-height: 1.78; margin-bottom: 2.8vw; padding: 0 2vw;}
#con2 .bx .inner .tab-all .con-left .list li .flex-bx .img{width: 95%; margin: 0 auto 3.5vw;}

#con2 .bx .inner .tab-all .con-left .list li .flex-bx .l-bx .txt1{font-size: 3.6vw; letter-spacing: 0.45vw; line-height: 2.15; position: relative; padding-left: 8vw;}
#con2 .bx .inner .tab-all .con-left .list li .flex-bx .l-bx .txt1::before{content: "①"; position: absolute; left: 2.5vw; top: 0;}
#con2 .bx .inner .tab-all .con-left .list li .flex-bx .l-bx .txt2{font-size: 3.6vw; letter-spacing: 0.45vw; line-height: 2.15; position: relative; padding-left: 8vw;}
#con2 .bx .inner .tab-all .con-left .list li .flex-bx .l-bx .txt2::before{content: "②"; position: absolute; left: 2.5vw; top: 0;}
#con2 .bx .inner .tab-all .con-left .list li .flex-bx .l-bx .txt{font-size: 3.6vw; letter-spacing: 0.45vw; line-height: 2.15; position: relative; padding: 0 2.5vw 5vw;}
#con2 .bx .inner .tab-all .con-left .list li .flex-bx .l-bx .ttl-job{font-size: 3.6vw; font-weight: bold; letter-spacing: 0.45vw; margin-bottom: 4vw; display: inline-block; background: #F7F6F4; padding: 2vw 4vw 2vw 2vw; margin-left: 3vw; margin-top: 1vw;}


#con2 .bx .inner .tab-all .con-right .list {border: 1px solid #C6C6C6; padding: 7vw 3vw 9.6vw;}
#con2 .bx .inner .tab-all .con-right .list li {position: relative; margin-bottom: 13.5vw;}
#con2 .bx .inner .tab-all .con-right .list li:nth-child(2) {position: relative; margin-bottom: 15vw;}
#con2 .bx .inner .tab-all .con-right .list li:nth-child(3) {position: relative; margin-bottom: 15vw;}
#con2 .bx .inner .tab-all .con-right .list li:last-child {position: relative; margin-bottom: 0;}
#con2 .bx .inner .tab-all .con-right .list li .num{width: 98%; margin: 0 auto 5vw;}
#con2 .bx .inner .tab-all .con-right .list li .flex-bx{width: 100%; margin: 0 auto; position: relative;}
#con2 .bx .inner .tab-all .con-right .list li .flex-bx::after{content: ""; width: 100%; height: 1px; margin: 0 auto; background: #E0E0E0; position: absolute; left: 0; right: 0; bottom: -9vw;}
#con2 .bx .inner .tab-all .con-right .list li:last-child .flex-bx::after{background: none;}
#con2 .bx .inner .tab-all .con-right .list li .flex-bx .l-bx{width: 100%; margin: 0 auto;}
#con2 .bx .inner .tab-all .con-right .list li .flex-bx .l-bx .ttl{font-size: 4.9vw; font-weight: bold; letter-spacing: 0.2vw; line-height: 1.78; margin-bottom: 2.8vw; padding: 0 2vw;}
#con2 .bx .inner .tab-all .con-right .list li .flex-bx .img{width: 95%; margin: 0 auto 3.5vw;}

#con2 .bx .inner .tab-all .con-right .list li .flex-bx .l-bx .list-bx1{font-size: 3.6vw; letter-spacing: 0.45vw; line-height: 2.15; position: relative; padding-left: 11.5vw;}
#con2 .bx .inner .tab-all .con-right .list li .flex-bx .l-bx .list-bx1::before{content: "①"; position: absolute; left: 2.5vw; top: 0;}
#con2 .bx .inner .tab-all .con-right .list li .flex-bx .l-bx .list-bx1 .list-txt{position: relative; margin-bottom: 0;}
#con2 .bx .inner .tab-all .con-right .list li .flex-bx .l-bx .list-bx1 .list-txt::before{content: ""; width: 1vw; height: 1vw; background: #E95504; border-radius: 100%; position: absolute; left: -3vw; top: 2.5vw;}
#con2 .bx .inner .tab-all .con-right .list li .flex-bx .l-bx .list-bx1 .list-txt::after {background: none;}
#con2 .bx .inner .tab-all .con-right .list li .flex-bx .l-bx .list-bx2{font-size: 3.6vw; letter-spacing: 0.45vw; line-height: 2.15; position: relative; padding-left: 11.5vw;}
#con2 .bx .inner .tab-all .con-right .list li .flex-bx .l-bx .list-bx2::before{content: "②"; position: absolute; left: 2.5vw; top: 0;}
#con2 .bx .inner .tab-all .con-right .list li .flex-bx .l-bx .list-bx2 .list-txt{position: relative; margin-bottom: 0;}
#con2 .bx .inner .tab-all .con-right .list li .flex-bx .l-bx .list-bx2 .list-txt::before{content: ""; width: 1vw; height: 1vw; background: #E95504; border-radius: 100%; position: absolute; left: -3vw; top: 2.5vw;}
#con2 .bx .inner .tab-all .con-right .list li .flex-bx .l-bx .list-bx2 .list-txt::after {background: none;}



#con3 {}
#con3 .bx{width: 100%; margin: 0 auto 15vw; position: relative;}
#con3 .bx::before{content: ""; width: 100%; height: 163vw; margin: 0 auto; background: #F5F5F5; position: absolute; left: 0; right: 0; top: 30vw; z-index: -1;}
#con3 .bx .ttl{font-size: 7.4vw; letter-spacing: 0.2vw; text-align: center; margin-bottom: 15vw;}
#con3 .bx .list{width: 87%; margin: 0 auto 17vw; position: relative; z-index: 1; }
#con3 .bx .list li{margin-bottom: 9.5vw; box-shadow: 0px 8px 16px -2px rgba(10,10,10,0.1), 0px 0px 15px 15px rgba(10,10,10,0.02);}
#con3 .bx .list li:last-child{margin-bottom: 0;}
#con3 .bx .link{width: 90%; margin: 0 auto 10vw; }

}