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

#ttlbox .inner-Box{padding: 23.9rem 0 0 0;margin-bottom: -126px;}
#ttlbox .inner-Box h1 .en{line-height: 1.3;margin-bottom: 1.2rem;}

span.fl-line {display: block;line-height: 1;width: 612px;height: 75px;overflow: visible; /* sticky等に影響させない */margin: 0 auto;left: 33px;position: relative;}
span.fl-line img { width: 100%; height: 100%; object-fit: contain; display: block; clip-path: inset(0 100% 0 0); transition: clip-path 0.3s ease-out; }
span.fl-line.is-show img { clip-path: inset(0 0 0 0); }


#contents00 {margin: 0 auto -686px;position: relative;padding: 9.6rem 4rem 70rem;background: url(../images/flow/contentsmain-back00.jpg)repeat-x top center,url(../images/flow/contentsmain-back002.jpg)repeat-x bottom center,url(../images/commitment/back.jpg)repeat top center;}
#contents00 .inner-Box{width: 800px;position: relative;margin: 0 auto;min-height: 898px;}
#contents00 .inner-Box h2 {margin-bottom: 3.9rem;font-size: 2.8rem;line-height: 1.7;letter-spacing: 0.14rem;font-weight: 400;}
#contents00 .inner-Box p.text {margin-bottom: 2.2rem;position: relative;font-size: 1.8rem;line-height: 1.96;letter-spacing: 0;font-weight: 500;}
#contents00 .inner-Box .img{right: -130px;top: 400px;aspect-ratio: 46 / 34;width: 460px;}
#contents00 .inner-Box .img2{left: -160px;top: 700px;aspect-ratio: 1 / 1;width: 240px;}
#contents00 .inner-Box figure{ position: absolute;}
#contents00 .inner-Box figure img{ width: 100%; height: auto; display: block; }
#contents00 .line-center {position: absolute;top: 190px;left: 50%;transform: translateX(-50%);max-width: 1122px;       /* 初期 */height: 10px;overflow: hidden;pointer-events: none;}
#contents00 .line-center img{ width: 100%; height: auto;}

#contents00 .inner-Box2{width: 800px;position: relative;margin: 0 auto;min-height: 635px;padding-left: 290px;}
#contents00 .inner-Box2 h2 {margin-bottom: 3.9rem;font-size: 2.8rem;line-height: 1.7;letter-spacing: 0.14rem;font-weight: 400;margin-right: -50px;}
#contents00 .inner-Box2 p.text {margin-bottom: 2.2rem;position: relative;font-size: 1.8rem;line-height: 1.96;letter-spacing: 0;font-weight: 500;}

#contents00 .inner-Box3{position: relative;margin: 0 auto;min-height: 868px;}
#contents00 .inner-Box3 .img3{left: 7.81vw;top: 0;width: 49vw;aspect-ratio: 94 / 62;}
#contents00 .inner-Box3 .img4{right: 7.81vw;top: 16.73vw;width: 20.76vw;aspect-ratio: 4 / 6;}
#contents00 .inner-Box3 .img5{top: 47.88vw;left: -2.13vw;width: 17.76vw;aspect-ratio: 34 / 37;}
#contents00 .inner-Box3 figure{ position: absolute;}
#contents00 .inner-Box3 figure img{ width: 100%; height: auto; display: block; }

#contents01 {background: url(../images/flow/contentsmain-back00.jpg)repeat-x bottom center;margin: 0 auto;position: relative;padding: 12.3rem 4rem 15.8rem 4rem;}
#contents01 h2.f-min {margin-bottom: 8.2rem;position: relative;font-size: 3.2rem;line-height: 1.25;letter-spacing: 0.16rem;font-weight: 400;text-align: center;}
#contents01 .back-Box{background: #fff;max-width: 1400px;margin: 0 auto;padding: 13.6rem 2rem 0.6rem 2rem;}
#contents01 .inner-Box {margin: 0 auto 7.6rem;position: relative;max-width: 1000px;border-bottom: #D6D6D6 1px solid;padding: 10rem 4rem 9.3rem 47.6rem;}
#contents01 .inner-Box h3.f-min {position: absolute;top: 102px;left: 46px;font-size: 2.8rem;line-height: 1.7;letter-spacing: 0;font-weight: 400;}
#contents01 .inner-Box h3.f-min span.f-en {display: block;font-size: 1.4rem;line-height: 1.5;letter-spacing: 0.112rem;color: #0097A3;margin-top: 9px;}
#contents01 .inner-Box p.text {margin-bottom: 2rem;position: relative;font-size: 1.6rem;line-height: 2.2;letter-spacing: 0.032rem;font-weight: 400;}
#contents01 .inner-Box .circle-container{ position: absolute; top: 0; left: 42px; }
#contents01 .inner-Box.noline{border-bottom: none;margin-bottom: 32px;}



#contentsmain .line-center2 {position: absolute;top: -79px;left: 50%;transform: translateX(-58%);max-width: 1319px;       /* 初期 */height: 10px;overflow: hidden;pointer-events: none;}
#contentsmain .line-center2 img{ width: 100%; height: auto;}

#contentsmain {position: relative;z-index: 1;width: 100%;background-color: #DFF3FB;background-image: url(../images/about/contentsmain-back02.png), url(../images/flow/contents01-back01.png);background-repeat: repeat, no-repeat;background-position: center center, center calc(100% + 100px); /* 初期：bottom -100px */background-size: auto, 100% auto;margin-bottom: 147px;}
#contentsmain .inner-Box {margin: 0 auto;position: relative;z-index: 2;padding: 0rem 4rem 32.2rem;max-width: 1080px;}
#contentsmain .backimgbox {width: 100%;height: 147px;background: url(../images/common/fix-bottom.svg) no-repeat bottom center;background-size: 100% auto;position: -webkit-sticky;position: absolute;bottom: 0;z-index: 10;opacity: 0;visibility: hidden;}
#contentsmain .inner-Box h2.f-min {margin-bottom: 8.5rem;text-align: center;font-size: 3.2rem;line-height: 1.25;letter-spacing: 0.16rem;font-weight: 400;}

#contentsmain .inb-Box{position: relative;margin: 0 auto 273px;}
#contentsmain .inb-Box h2 {margin-bottom: 2.3rem;font-size: 2.8rem;line-height: 1.7;letter-spacing: 0.14rem;font-weight: 400;}
#contentsmain .inb-Box p.text {margin-bottom: 2.2rem;position: relative;font-size: 1.8rem;line-height: 1.96;letter-spacing: 0;font-weight: 500;}
#contentsmain .inb-Box figure{position: absolute;top: 163px;right: -50px;width: 460px;aspect-ratio: 46 / 34;}
#contentsmain .inb-Box figure img{ width: 100%; height: auto; display: block; }

#contentsmain .inb-Box2{/* width: 800px; */position: relative;margin: 0 auto 112px;padding-left: 513px;}
#contentsmain .inb-Box2 h2 {margin-bottom: 2.3rem;font-size: 2.8rem;line-height: 1.7;letter-spacing: 0.14rem;font-weight: 400;}
#contentsmain .inb-Box2 p.text {margin-bottom: 2.2rem;position: relative;font-size: 1.8rem;line-height: 1.96;letter-spacing: 0;font-weight: 500;margin-right: -30px;}
#contentsmain .inb-Box2 figure{position: absolute;top: -48px;left: -50px;width: 460px;aspect-ratio: 46 / 34;}
#contentsmain .inb-Box2 figure img{ width: 100%; height: auto; display: block; }

#contentsmain .inb-Box2.hhh2{margin-bottom: 112px;}
#contentsmain .inb-Box2.hhh2 figure{top: -89px;}
#contentsmain .inb-Box.hhh {margin-bottom: 69px;}
#contentsmain .inb-Box.hhh figure{top: 134px;}
#contentsmain .inb-Box.hhh3{ margin-bottom: 155px; }
#contentsmain .inb-Box.hhh3 figure{top: 133px;}



#contentsmain .bbttmcontents{text-align: center;padding: 10.2rem 0 0;}
#contentsmain .bbttmcontents h2{margin-bottom: 4.2rem;font-size: 2.8rem;line-height: 1.63;letter-spacing: 0.14rem;font-weight: 400;}
#contentsmain .bbttmcontents p.text{font-size: 1.8rem;line-height: 1.96;letter-spacing: 0;font-weight: 500;margin-bottom: 2.3rem;}

#contentsbottom {margin: -23px auto 16rem;position: relative;max-width: 1280px;padding: 0 4rem;}
#contentsbottom h2{font-size: 2rem;line-height: 1.92;letter-spacing: 0;font-weight: 500;text-align: center;margin-bottom: 48px;}
#contentsbottom .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;}
#contentsbottom .inner-Box ul li {position: relative;width: 31.7%;margin-right: 2.4%;}
#contentsbottom .inner-Box ul li:nth-child(3n) { margin-right: 0px; }
#contentsbottom .inner-Box ul li a {display: block;height: 119px;background: #EEF7F9;position: relative;padding: 37px 10px 0 145px;}
#contentsbottom .inner-Box ul li a:hover {  }
#contentsbottom .inner-Box figure.figbo { position: absolute; top: 0; left: 0; }
#contentsbottom .inner-Box figure.figbo img{  }
#contentsbottom .inner-Box p.ltext {position: relative;font-size: 1.3rem;line-height: 1.5;letter-spacing: 0;font-weight: 400;}
#contentsbottom .inner-Box p.ltext span.f-en {display: block;margin-bottom: 10px;font-size: 1.6rem;line-height: 1;letter-spacing: 0.128rem;}
#contentsbottom .inner-Box ul li .arr{position: absolute;bottom: 15px;right: 17px;transition: all 0.3s ease-in-out;}
#contentsbottom .inner-Box ul li a:hover .arr{  right: 10px;}
#contentsbottom .inner-Box ul li.acv a{ background: #0097A3; color: #fff;}

}
@media screen and (min-width:768px) and ( max-width:1400px) {
#contentsmain .inb-Box figure{ right: 0;}
}

@media screen and (min-width:768px) and ( max-width:1100px) {

#contents00 .inner-Box .img{ right: 0px;  }
#contents00 .inner-Box .img2{ left: 0px;  }


}


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

#contents00 .line-center,#contentsmain .line-center2{ display: none;}

span.fl-line {display: block;line-height: 1;width: 75.01vw;height: 20.29vw;overflow: visible; /* sticky等に影響させない */margin: -9.9vw auto 0 auto;}
span.fl-line img { width: 100%; height: 100%; object-fit: contain; display: block; clip-path: inset(0 100% 0 0); transition: clip-path 0.3s ease-out; }
span.fl-line.is-show img { clip-path: inset(0 0 0 0); }

#contentsmain {position: relative;z-index: 1;width: 100%;background-color: #DFF3FB;background-image: url(../images/about/contentsmain-back02.png), url(../images/about/contentsmain-back01.png);background-repeat: repeat, no-repeat;background-position: center center, center calc(100% + 24.15vw); /* 初期：bottom 0vw */background-size: auto, 142vw auto;margin-bottom: 23vw;}
#contentsmain .inner-Box {position: relative;z-index: 2;padding: 13vw 3vw 0;}
#contentsmain .backimgbox { width: 100%; height: 35.51vw; background: url(../images/common/fix-bottom.svg) no-repeat bottom center; background-size: 100% auto; position: -webkit-sticky; position: sticky; bottom: 0; z-index: 10; opacity: 0; visibility: hidden; }
#contentsmain .inner-Box h2.f-min {margin-bottom: 8.9vw;text-align: center;font-size: 5.76vw;line-height: 1.6;letter-spacing: 0;font-weight: 400;}

#contents00 {margin: 0 auto -154.6vw;padding: 1.8vw 2.5vw 170vw;background: url(../images/commitment/sp-contents00-line.png)no-repeat top center, url(../images/flow/contentsmain-back00.jpg)repeat-x top center,url(../images/flow/contentsmain-back002.jpg)repeat-x bottom center,url(../images/commitment/back.jpg)repeat top center;background-size: 100% auto,19vw auto,5vw auto,10vw auto;}
#contents00 .inner-Box{position: relative;margin: 0 4vw;padding-bottom: 91vw;}
#contents00 .inner-Box h2 {margin-bottom: 3.9vw;font-size: 5.87vw;line-height: 1.8;letter-spacing: 0;font-weight: 500;}
#contents00 .inner-Box p.text {margin-bottom: 4.2vw;position: relative;font-size: 4vw;line-height: 2;letter-spacing: 0;font-weight: 500;}
#contents00 .inner-Box .img{right: 0vw;top: 90.72vw;width: 64vw;aspect-ratio: 46 / 34;}
#contents00 .inner-Box .img2{left: 0vw;top: 122.5vw;width: 42.5vw;aspect-ratio: 1 / 1;}
#contents00 .inner-Box figure{position: absolute;}
#contents00 .inner-Box figure img{ width: 100%; height: auto; display: block; }


#contents00 .inner-Box2{position: relative;margin: 0 4vw 9.3vw;}
#contents00 .inner-Box2 h2 {margin-bottom: 4.9vw;font-size: 5.87vw;line-height: 1.8;letter-spacing: 0;font-weight: 500;}
#contents00 .inner-Box2 p.text {margin-bottom: 4vw;position: relative;font-size: 4vw;line-height: 2;letter-spacing: 0;font-weight: 500;}

#contents00 .inner-Box3{position: relative;}
#contents00 .inner-Box3 .img3{right: 10.1vw;top: 0;width: 37.5vw;margin: 0 0 -22.3vw auto;z-index: 3;aspect-ratio: 46 / 34;}
#contents00 .inner-Box3 .img4{left: 4vw;top: 5.73vw;width: 62.76vw;margin-bottom: 14.3vw;aspect-ratio: 46 / 34;}
#contents00 .inner-Box3 .img5{top: 0;right: 0vw;width: 47.96vw;margin: 0 3.8vw 0 auto;aspect-ratio: 46 / 34;}
#contents00 .inner-Box3 figure{ position: relative;}
#contents00 .inner-Box3 figure img{ width: 100%; height: auto; display: block; }

#contents01 {background: url(../images/flow/contentsmain-back00.jpg)repeat-x bottom center;position: relative;padding: 0;background-size: 10vw auto;}
#contents01 h2.f-min {margin-bottom: 6.2vw;position: relative;text-align: center;font-size: 5.87vw;line-height: 1.6;letter-spacing: 0;font-weight: 500;}
#contents01 .back-Box{background: #fff;margin: 0 4.1vw;padding: 6.2vw 6.5vw 0.2vw 6.5vw;}
#contents01 .inner-Box {margin: 0 auto 6.1vw;padding-bottom: 7.6vw;position: relative;border-bottom: #D6D6D6 0.24vw solid;}
#contents01 .inner-Box h3.f-min {position: relative;font-size: 5.87vw;line-height: 1.6;letter-spacing: 0;font-weight: 400;margin: 0 0 5.5vw 14.7vw;}
#contents01 .inner-Box h3.f-min span.f-en {display: block;color: #0097A3;margin-top: 3.17vw;font-size: 3.2vw;line-height: 1.5;letter-spacing: 0.26vw;font-weight: 400;font-style: italic;}
#contents01 .inner-Box p.text {margin-bottom: 3vw;position: relative;font-size: 3.73vw;line-height: 1.7;letter-spacing: 0.07vw;font-weight: 400;}
#contents01 .inner-Box .circle-container{position: relative;top: 0vw;left: -2vw;margin: 0 0 -9.9vw;width: 12.2vw;height: 12vw;}
#contents01 .inner-Box .circle-container .number{ font-size: 4.9vw; left: -1.1vw; top: -1.2vw; }
#contents01 .inner-Box.noline{border-bottom: none;margin-bottom: -0.17vw;}

#contentsmain {position: relative;z-index: 1;width: 100%;background-color: #DFF3FB;background-image: url(../images/about/contentsmain-back02.png), url(../images/flow/sp-contents01-back01.png);background-repeat: repeat, no-repeat;background-position: center center, center calc(100% + 24.15vw); /* 初期：bottom 0vw */background-size: auto, 100% auto;margin-bottom: 23.51vw;padding-top: 11.9vw;}
#contentsmain .inner-Box { background: url(../images/commitment/sp-contentsmain-icon01.png)no-repeat top center; background-size: 100% auto; padding: 0 6.2vw;position: relative;z-index: 2;}
#contentsmain .backimgbox {width: 100%;height: 35.51vw;background: url(../images/common/fix-bottom.svg) no-repeat bottom center;background-size: 100% auto;position: -webkit-sticky;position: absolute;bottom: 0;z-index: 10;opacity: 0;visibility: hidden;}
#contentsmain .inner-Box h2.f-min {margin-bottom: 8.5rem;text-align: center;font-size: 7.73vw;line-height: 1.25;letter-spacing: 0.39vw;font-weight: 400;}

#contentsmain .inb-Box{position: relative;margin: 0 auto 19.06vw;}
#contentsmain .inb-Box h2 {margin-bottom: 4.3vw;font-size: 5.87vw;line-height: 1.8;letter-spacing: 0;font-weight: 500;}
#contentsmain .inb-Box p.text {margin-bottom: 3.2vw;position: relative;font-size: 4vw;line-height: 2;letter-spacing: 0;font-weight: 500;}
#contentsmain .inb-Box figure{position: relative;top: 6.9vw;right: 2.9vw;width: 64vw;margin: 0 0 0 auto;aspect-ratio: 46 / 34;}
#contentsmain .inb-Box figure img{ width: 100%; height: auto; display: block; }

#contentsmain .inb-Box2{position: relative;margin: 0 auto 17.36vw;}
#contentsmain .inb-Box2 h2 {margin-bottom: 4.3vw;font-size: 5.87vw;line-height: 1.8;letter-spacing: 0;font-weight: 500;}
#contentsmain .inb-Box2 p.text {margin-bottom: 3.9vw;position: relative;font-size: 4vw;line-height: 2;letter-spacing: 0;font-weight: 500;}
#contentsmain .inb-Box2 figure{position: relative;top: 5.5vw;left: -6.1vw;width: 80vw;aspect-ratio: 46 / 34;}
#contentsmain .inb-Box2 figure img{ width: 100%; height: auto; display: block; }

#contentsmain .inb-Box2.hhh2{margin-bottom: 17.85vw;}
#contentsmain .inb-Box2.hhh2 figure{top: 5.8vw;margin-left: 19.9vw;}
#contentsmain .inb-Box.hhh {margin-bottom: 17.76vw;}
#contentsmain .inb-Box.hhh figure{top: 6vw;left: -9.3vw;width: 69.2vw;aspect-ratio: 46 / 34;}
#contentsmain .inb-Box.hhh3{margin-bottom: -3.46vw;}
#contentsmain .inb-Box.hhh3 figure{top: 6.73vw;left: 0vw;margin: 0;width: 87.2vw;}

#contentsmain .bbttmcontents{text-align: center;padding: 23.2vw 0 49vw;}
#contentsmain .bbttmcontents h2{font-size: 5.47vw;line-height: 1.8;letter-spacing: 0.37vw;font-weight: 400;z-index: 3;position: relative;margin-bottom: 11vw;}
#contentsmain .bbttmcontents p.text{font-size: 4.35vw;line-height: 1.96;letter-spacing: 0;font-weight: 500;margin-bottom: 2.3rem;}


#contentsbottom {margin: -8vw auto 13vw;position: relative;padding: 0 6.6vw;}
#contentsbottom  h2 {margin-bottom: 8.2vw;text-align: center;font-size: 4.8vw;line-height: 1.5;letter-spacing: 0;font-weight: 500;}
#contentsbottom .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;}
#contentsbottom .inner-Box ul li {position: relative;width: 100%;margin-bottom: 3.9vw;}
#contentsbottom .inner-Box ul li a {display: block;height: 32.28vw;background: #EEF7F9;position: relative;padding: 10.43vw 2.42vw 0 27.88vw;}
#contentsbottom .inner-Box ul li a:hover {  }
#contentsbottom .inner-Box figure.figbo { position: absolute;top: 0;left: 0;width: 21.5vw; aspect-ratio: 8 / 12; overflow: hidden; text-align: center;}
#contentsbottom .inner-Box figure.figbo img { width: 100%; height: 100%; object-fit: cover; display: block; }

#contentsbottom .inner-Box p.ltext {font-weight: 500;margin-bottom: 3rem;position: relative;font-size: 3.38vw;line-height: 1.5;letter-spacing: 0;}
#contentsbottom .inner-Box p.ltext span.f-en {font-size: 3.85vw;line-height: 1;letter-spacing: 0.35vw;display: block;margin-bottom: 3.02vw;}
#contentsbottom .inner-Box ul li .arr{position: absolute;bottom: 4.26vw;width: 5.1vw;right: 4.11vw;transition: all 0.3s ease-in-out;}
#contentsbottom .inner-Box ul li a:hover .arr{  right: 2.42vw;}
#contentsbottom .inner-Box ul li.acv a{ background: #0097A3; color: #fff;}

}