@import url(https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700&display=swap);
.annotation-modal .modal{display:flex;justify-content:center;align-items:center;position:fixed;top:0;left:0;width:100%;height:100%}@media(max-width: 767px){.annotation-modal .modal{align-items:flex-end}}.annotation-modal .background{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.6)}.annotation-modal .content{position:relative;width:100%;max-width:800px;background:#fff}.annotation-modal .scrollable{padding:60px}@media(max-width: 767px){.annotation-modal .scrollable{padding:30px}}.annotation-modal .body{font-size:1.6rem}@media(max-width: 767px){.annotation-modal .body{max-height:200px;overflow-y:scroll}}.annotation-modal .close{display:flex;justify-content:center;align-items:flex-end;position:absolute;top:-84px;right:0;height:67px;color:#fff}@media(max-width: 767px){.annotation-modal .close{top:-70px;right:10px;height:60px;font-size:1.2rem;letter-spacing:.08em}}.annotation-modal .close::before{content:"";position:absolute;top:21px;left:calc(50% - 28px);width:57px;height:1px;background:#fff;transform:rotateZ(45deg)}@media(max-width: 767px){.annotation-modal .close::before{width:44px;left:calc(50% - 22px)}}.annotation-modal .close::after{content:"";position:absolute;top:21px;left:calc(50% - 28px);width:57px;height:1px;background:#fff;transform:rotateZ(-45deg)}@media(max-width: 767px){.annotation-modal .close::after{width:44px;left:calc(50% - 22px)}}.annotation-modal-enter-active,.annotation-modal-leave-active{transition:opacity 400ms}.annotation-modal-enter,.annotation-modal-leave-to{opacity:0}.scroll-mark .mark{position:absolute;bottom:20px;left:50%;transform:translateX(-50%)}.scroll-mark .scrolltext{margin-bottom:5px;font-size:1.2rem;color:#91979d}.scroll-mark .mouse{position:relative;width:17px;height:28px;margin:0 auto;border-radius:999px;border:1px solid #91979d}.scroll-mark .wheel{position:absolute;top:4px;left:calc(50% - 1.5px);width:3px;height:3px;border-radius:100%;background:#91979d}.curtain-enter-active,.curtain-leave-active{transition:opacity 800ms}.curtain-enter,.curtain-leave-to{opacity:0}.annotation-anchor{color:#00a040;text-decoration:underline}.annotation-anchor::after{content:url(/chronicle/130th/img/ico-fukidashi.svg);display:inline-block;padding:0 5px}.main-content{padding-top:0}.global-header{background:rgba(255,255,255,.8);border:none;transition:400ms;visibility:hidden;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.global-header.-mounted{visibility:visible}.global-header.-hidden{transform:translateY(-100%)}.loop-component{min-height:100vh}.scroll-mark{transform:translateY(-100px)}.loop-page{background:#000}.loop-page .scene{position:relative;width:100%;overflow:hidden}.loop-page>.curtain{position:fixed;z-index:999999;top:0;left:0;width:100%;height:100%;background:#fff;pointer-events:none}.loop-scene1{height:100vh;background:#000}.loop-scene1 .wrapper{position:relative;width:100%;height:100%;overflow:hidden}.loop-scene1 .title{position:absolute;visibility:hidden}.loop-scene1 .svg{position:absolute}.loop-scene1 .picture{position:absolute;width:100%;height:100%}.loop-scene1 .picture.-bg1{padding-top:100px;background:#fff}.loop-scene1 .picture.-bg1 .image{width:100%;height:100%;object-fit:cover}.loop-scene1 .picture.-bg2 .image{width:100%;height:100%;object-fit:cover;-webkit-clip-path:url(#titlepath);clip-path:url(#titlepath)}@media(max-width: 767px){.loop-scene1 .picture.-bg2 .image{-webkit-clip-path:url(#titlepathSP);clip-path:url(#titlepathSP)}}.loop-scene1 .clippath{position:absolute;top:50%;left:50%}.loop-scene1 .path.-pc{transform-origin:435.75px 37.15px}.loop-scene1 .path.-sp{transform-origin:113.25px 138.5px}.loop-scene1 .text{position:absolute;top:50%;left:50%;width:100%;transform:translate(-50%, -50%);font-size:2.5rem;font-weight:700;text-align:center;color:#fff}@media(max-width: 767px){.loop-scene1 .text{font-size:2rem;padding:0 20px}}.loop-scene1 .lead:not(:first-child){margin-top:60px}.loop-scene2{height:100vh;color:#fff}.loop-scene2 .lead{font-size:2.5rem;font-weight:700;text-align:center}@media(max-width: 767px){.loop-scene2 .lead{font-size:2rem;padding:0 20px}}.loop-scene2 .picture{display:flex;justify-content:center;align-items:center;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);background:#000}.loop-scene2 .picture.-picture1{width:1400px;height:990px}@media(max-width: 767px){.loop-scene2 .picture.-picture1{width:100%;height:auto}}.loop-scene2 .picture.-picture1 .image{width:1400px;height:990px}@media(max-width: 767px){.loop-scene2 .picture.-picture1 .image{width:100%;height:auto}}@media(max-width: 767px){.loop-scene2 .picture.-picture2{width:100%}}.loop-scene2 .picture.-picture3{width:100%;height:100%}@media(max-width: 767px){.loop-scene2 .picture.-picture3{padding:0 20px}}.loop-scene2 .picture.-picture3 .image{width:657px;height:548px}@media(max-width: 767px){.loop-scene2 .picture.-picture3 .image{width:100%;height:auto}}.loop-scene2 .video{transform:translate(-75px, 60px)}@media(max-width: 767px){.loop-scene2 .video{width:100%;height:auto;transform:translate(0, 0)}}.loop-scene2 .text{position:absolute;width:100%}.loop-scene2 .text.-text1{top:50%;left:50%;transform:translate(-50%, -50%)}.loop-scene2 .text.-text2{top:50%;left:50%;transform:translate(-50%, -50%)}.loop-scene2 .text.-text2 .lead:not(:first-child){margin-top:100px}.loop-scene2 .text.-text3{top:calc(50% + 250px);left:50%;transform:translate(-50%, 0)}@media(max-width: 767px){.loop-scene2 .text.-text3{top:auto;bottom:30px;text-align:left}}.loop-scene2 .text.-text4{top:calc(50% + 250px);left:50%;transform:translate(-50%, 0)}@media(max-width: 767px){.loop-scene2 .text.-text4{top:auto;bottom:30px;text-align:left}}.loop-scene2 .text.-text5{top:calc(50% + 250px);left:50%;transform:translate(-50%, 0)}@media(max-width: 767px){.loop-scene2 .text.-text5{top:auto;bottom:30px;text-align:left}}.loop-scene2 .text.-text6{display:flex;justify-content:center;align-items:center;height:100%;background:rgba(0,0,0,.6)}.loop-scene2 .info{position:absolute;top:50%;left:50%}.loop-scene2 .info.-add{transform:translate(277px, -327px)}.loop-scene2 .info.-add .path{width:142.26px;height:150.57px}.loop-scene2 .info.-add .line{top:40px;left:-93px}.loop-scene2 .info.-add .highlight{top:137px;left:-168px}.loop-scene2 .info.-add .image{width:150px}.loop-scene2 .info.-remove{transform:translate(180px, -327px)}.loop-scene2 .info.-remove .path{width:111.87px;height:78.56px}.loop-scene2 .info.-remove .line{top:39px;left:-62px}.loop-scene2 .info.-remove .highlight{top:64px;left:-134px}.loop-scene2 .info.-remove .image{width:121px}@media(max-width: 767px){.loop-scene2 .mapobject{position:absolute;top:0;left:0;width:100%;height:100%;transform:translate(-3px, 0);transform-origin:50% 50%;white-space:nowrap}}.loop-scene2 .line{position:absolute}.loop-scene2 .line.-distribution1{top:calc(50% - 128px);left:calc(50% - 119px)}.loop-scene2 .line.-distribution2{top:calc(50% - 53px);left:calc(50% - 102px)}.loop-scene2 .line.-distribution3{top:calc(50% - 120px);left:calc(50% + 4px)}.loop-scene2 .line.-add{top:calc(50% + 147px);left:calc(50% + 98px)}.loop-scene2 .line.-remove{top:calc(50% + 164px);left:calc(50% + 10px)}.loop-scene2 .line.-move{top:calc(50% - 47px);left:calc(50% - 46px)}.loop-scene2 .line.-supply{top:calc(50% + 154px);left:calc(50% + 102px)}.loop-scene2 .highlight{position:absolute}.loop-scene2 .highlight.-add{top:calc(50% + 58px);left:calc(50% + 47px)}.loop-scene2 .highlight.-remove{top:calc(50% + 80px);left:calc(50% - 4px)}.loop-scene2 .label{position:absolute;font-weight:700;transform-origin:0 50%}@media(max-width: 767px){.loop-scene2 .label{transform:scale(2.2);background:rgba(0,0,0,.6)}}.loop-scene2 .label.-facility{top:calc(50% - 73px);left:calc(50% - 66px);font-size:1rem}@media(max-width: 767px){.loop-scene2 .label.-facility{left:calc(50% - 99px)}}.loop-scene2 .label.-add{top:calc(50% + 172px);left:calc(50% + 149px);font-size:1.6rem}.loop-scene2 .label.-remove{top:calc(50% + 209px);left:calc(50% + 71px);font-size:1.6rem}.loop-scene2 .label.-move{top:calc(50% - 52px);left:calc(50% - 28px);font-size:1.4rem;color:#f59e06}@media(max-width: 767px){.loop-scene2 .label.-move{top:calc(50% - 32px)}}.loop-scene2 .label.-supply{top:calc(50% + 208px);left:calc(50% + 256px);font-size:1.4rem;color:#bc6600}@media(max-width: 767px){.loop-scene2 .label.-supply{top:calc(50% + 179px);left:calc(50% + 182px)}}.loop-scene2 .label.-distribution{top:calc(50% - 142px);left:calc(50% - 3px);font-size:1.4rem;color:#fdf001}@media(max-width: 767px){.loop-scene2 .label.-distribution{top:calc(50% - 157px)}}.loop-scene2 .strong{font-size:5.5rem}@media(max-width: 767px){.loop-scene2 .strong{font-size:3.5rem}}.loop-scene2 .name{font-size:2.5rem;font-weight:700}.loop-scene2 .description{font-size:1.6rem;width:320px}.loop-scene2 .circulation{position:absolute;top:50%;left:50%}.loop-scene2 .circulation.-main{text-align:center;transform:translate(-50%, -50%)}.loop-scene2 .circulation.-main .circulationtitle{margin-bottom:20px}.loop-scene2 .circulation.-main .circulationdescription{width:220px}.loop-scene2 .circulation.-loop{display:flex;transform:translate(-46px, -310px)}.loop-scene2 .circulation.-loop .circulationtitle{margin-right:30px}.loop-scene2 .circulation.-loop .circulationicon{transform:translate(-12px, 54px)}.loop-scene2 .circulation.-forest{transform:translate(-577px, 112px)}.loop-scene2 .circulation.-forest .circulationtitle{width:320px;margin-bottom:20px;text-align:right}.loop-scene2 .circulation.-forest .circulationicon{left:auto;right:0;transform:translate(140px, -70px)}.loop-scene2 .circulation.-biomass{transform:translate(260px, 112px)}.loop-scene2 .circulation.-biomass .circulationtitle{margin-bottom:20px}.loop-scene2 .circulation.-biomass .circulationicon{transform:translate(-143px, -70px)}.loop-scene2 .circulationtitle{font-size:2.5rem;font-weight:700}.loop-scene2 .circulationdescription{width:320px;font-size:1.6rem}.loop-scene2 .circulationicon{position:absolute;top:0;left:0}.loop-scene2 .outline{display:flex;justify-content:center;align-items:center;position:absolute;width:100%;height:100%;background:#000}@media(max-width: 767px){.loop-scene2 .outline{padding:0 20px}}@media(max-width: 767px){.loop-scene2 .outlineimage{width:100%;height:auto}}.loop-scene3{padding-bottom:200px;background:#fff}.loop-scene3 .lead{margin-top:400px;font-size:2.5rem;font-weight:700;text-align:center}@media(max-width: 767px){.loop-scene3 .lead{margin-top:200px;padding:0 20px;font-size:2rem}}.loop-scene3 .pictures{display:flex;justify-content:space-between;position:relative;left:50%;width:1400px;margin-top:300px;transform:translate(-50%, 0)}@media(max-width: 767px){.loop-scene3 .pictures{display:block;left:0;width:100%;margin-top:50px;transform:translate(0, 0)}}.loop-scene3 .picture.-picture1 .image{width:880px;height:621px}@media(max-width: 767px){.loop-scene3 .picture.-picture1 .image{width:100%;height:auto}}.loop-scene3 .picture.-picture2{margin-top:240px}@media(max-width: 767px){.loop-scene3 .picture.-picture2{margin-top:0}}.loop-scene3 .picture.-picture2 .image{width:460px;height:650px}@media(max-width: 767px){.loop-scene3 .picture.-picture2 .image{width:100%;height:auto}}.loop-scene4{background:#000;padding:200px 0 200px}.loop-scene4 .movie{display:flex;flex-direction:column;align-items:flex-start;width:960px;margin:0 auto}@media(max-width: 767px){.loop-scene4 .movie{width:100%}}.loop-scene4 .name{margin-top:20px;font-size:1.5rem;color:#fff}.loop-scene4 .video{width:960px;aspect-ratio:16/9}@media(max-width: 767px){.loop-scene4 .video{width:100%}}.-safari14 .loop-scene4 .video{height:540px}@media(max-width: 767px){.-safari14 .loop-scene4 .video{height:240px}}.loop-scene5{background:#fff;height:100vh}.loop-scene5 .lead{font-size:2.5rem;font-weight:700}@media(max-width: 767px){.loop-scene5 .lead{font-size:1.6rem}}.loop-scene5 .text.-text1{display:flex;justify-content:center;align-items:center;position:absolute;width:100%;height:100%;text-align:center}.loop-scene5 .text.-text2{width:410px;margin-top:40px}@media(max-width: 767px){.loop-scene5 .text.-text2{width:100%;margin-top:20px}}.loop-scene5 .oyproject{position:absolute;width:100%;height:100%;background:url(/chronicle/130th/story/loop50/img/img-oy.jpg) calc(50% - 240px) center no-repeat #b7c3cc}@media(max-width: 767px){.loop-scene5 .oyproject{background-size:100% auto;background-position:center bottom}}.loop-scene5 .info{position:absolute;top:calc(50% - 100px);left:calc(50% + 70px);width:100%;padding:0 20px;transform:translateY(-50%)}@media(max-width: 767px){.loop-scene5 .info{top:60px;left:0;transform:none}}@media(max-width: 767px){.loop-scene5 .image{width:200px;height:auto}}.loop-scene5 .link{margin-top:30px}.loop-scene5 .anchor{display:flex;justify-content:space-between;align-items:center;position:relative;width:188px;height:50px;padding:0 20px;border:1px solid #000;font-size:1.4rem;color:#222;text-decoration:none;background:rgba(183,195,204,.6);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);overflow:hidden;transition:.3s cubic-bezier(0.13, 0.78, 0.38, 0.98)}.loop-scene5 .anchor::before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:#000;transform:translateX(-100%);transition:.3s cubic-bezier(0.13, 0.78, 0.38, 0.98)}.loop-scene5 .anchor:hover{color:#fff}.loop-scene5 .anchor:hover::before{transform:translateX(0)}.loop-scene5 .anchor:hover .icon{fill:#fff}.loop-scene5 .anchortext{position:relative}.loop-scene5 .icon{position:relative;fill:#000;transition:.3s cubic-bezier(0.13, 0.78, 0.38, 0.98)}.loop-scene6{background:#fff}.loop-scene6 .lead{font-size:2.5rem;font-weight:700;text-align:center}@media(max-width: 767px){.loop-scene6 .lead{font-size:1.8rem;padding:0 20px}}.loop-scene6 .text{margin-top:300px}@media(max-width: 767px){.loop-scene6 .text{margin-top:100px}}.loop-scene6 .slider{margin-top:100px}.loop-scene6 .list{display:flex}.loop-scene6 .item{flex:none;margin-right:5px}.loop-scene6 .image{width:276px;height:148px}.loop-scene7{display:flex;justify-content:center;align-items:center;height:100vh;background:#fff}.loop-scene7 .lead{font-size:5.5rem;font-weight:700;text-align:center}@media(max-width: 767px){.loop-scene7 .lead{font-size:3rem;padding:0 20px}}.loop-scene8{height:100vh;background:url(/chronicle/130th/story/loop50/img/img-footer.jpg) center center no-repeat;background-size:cover}.loop-scene8 .lead{font-size:5.5rem;font-weight:700}@media(max-width: 767px){.loop-scene8 .lead{font-size:2.5rem}}.loop-scene8 .move{display:flex;flex-direction:column;justify-content:space-between;height:100%}.loop-scene8 .text{padding:136px 0 0 80px}@media(max-width: 767px){.loop-scene8 .text{padding:20px}}.loop-scene8 .buttons{display:flex;flex-direction:column;align-items:center;padding-bottom:100px}.loop-scene8 .button.-button2{margin-top:30px}.loop-scene8 .anchor{position:relative;display:flex;align-items:center;width:300px;height:72px;text-decoration:none;overflow:hidden}.loop-scene8 .anchor::before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;transition:.3s cubic-bezier(0.13, 0.78, 0.38, 0.98);transition-duration:.5s}.loop-scene8 .anchor.-anchor1{justify-content:flex-end;padding-right:40px;background:#fff;border:1px solid #b4b9be;color:#666;font-size:1.6rem;transition:.3s cubic-bezier(0.13, 0.78, 0.38, 0.98);transition-duration:.5s}.loop-scene8 .anchor.-anchor1::before{background:#00a040;transform:translateX(100%)}.loop-scene8 .anchor.-anchor1::after{content:"";position:absolute;top:50%;left:30px;width:11px;height:11px;border-top:1px solid #b4b9be;border-left:1px solid #b4b9be;transition:.3s cubic-bezier(0.13, 0.78, 0.38, 0.98);transition-duration:.5s;transform:translate(0, -50%) rotateZ(-45deg)}.loop-scene8 .anchor.-anchor2{justify-content:flex-start;padding:0 60px 0 40px;background:rgba(0,0,0,.7);border:1px solid #b4b9be;color:#fff;font-size:1.4rem;transition:.3s cubic-bezier(0.13, 0.78, 0.38, 0.98);transition-duration:.5s}.loop-scene8 .anchor.-anchor2::before{background:#00a040;transform:translateX(-100%)}.loop-scene8 .anchor.-anchor2::after{right:30px;border-top:1px solid #b4b9be;border-right:1px solid #b4b9be;transform:translate(0, -50%) rotateZ(45deg)}.loop-scene8 .anchor:hover{border-color:#00a040;background:#00a040;color:#fff}.loop-scene8 .anchor:hover::before{transform:translateX(0)}.loop-scene8 .anchor:hover::after{border-color:#fff}.loop-scene8 .anchortext{position:relative}.loop-scene8 .icon{position:absolute;right:30px;width:13px;height:13px;fill:#fff}
