.PortfolioPage{overflow:auto;height:var(--main-height)}.PortfolioPage p{white-space:pre-wrap}.portfolio-section-1 .portfolio-header{padding-top:1rem;display:flex;justify-content:center;position:relative}.portfolio-section-1 .portfolio-header .title{max-height:15rem}.portfolio-section-1 .portfolio-header .character{display:none}.portfolio-section-1 .grid{display:grid;height:calc(var(--main-height) - 10rem);min-height:23rem;max-height:30rem;grid:1fr 1fr 1fr / 1fr 1fr 230px;padding-left:16%;padding-top:2rem;gap:1rem}.portfolio-section-1 .grid .top{display:flex;align-items:center;justify-content:center;position:relative;grid-area:1 / 1 / 1 / 3;gap:1rem}.portfolio-section-1 .grid .top img{max-height:7rem}.portfolio-section-1 .grid .top .dialog-wrapper{display:flex;align-items:center;justify-content:center}.portfolio-section-1 .grid .top .dialog-wrapper h3{text-align:center;position:absolute;color:#fff;z-index:100;font-size:1.3rem;padding-left:1rem}.portfolio-section-1 .grid .top .dialog-wrapper h3 b{color:var(--theme-bg-color)}.portfolio-section-1 .grid .bottom{display:flex;flex-direction:column;grid-area:2 / 1 / 4 / 3;padding-right:2rem;padding-bottom:1rem}.portfolio-section-1 .grid .bottom .lie-wrapper{position:relative;display:flex;justify-content:center;align-items:end;overflow:hidden;flex:1}.portfolio-section-1 .grid .bottom img{max-height:22vh;height:12rem}.portfolio-section-1 .grid .right{grid-area:1 / 3 / 4 / 4;position:relative;display:flex;justify-content:center}.portfolio-section-1 .grid .right img.character{position:absolute;z-index:1;width:125%;top:-34%;left:-38%;max-width:inherit}.portfolio-section-1 .grid .right img.ladder{position:absolute;width:50%;top:3%}.book{overflow:hidden;border-radius:1rem;position:relative;height:calc(var(--main-height) - 6rem);min-height:23rem;max-height:40rem;filter:drop-shadow(0 0 .15rem rgba(0,0,0,.5));z-index:2}.book .cover-wrapper{height:100%;position:relative;display:flex;justify-content:center}.book .cover-wrapper .cover{position:absolute;top:0;right:0;height:100%}.book .cover-wrapper .middle-shadow{position:absolute;height:100%;mix-blend-mode:luminosity;opacity:.5}.book .cover-wrapper .middle{position:absolute;height:100%;padding-right:1.6rem;z-index:10}.book .text-wrapper{position:absolute;top:0;height:100%;width:50%;display:flex;flex-direction:column;align-items:center;justify-content:center}.book .text-wrapper .text-block{display:flex;flex-direction:column;align-items:center;max-width:21rem;gap:1rem}.book .text-wrapper .text-block img{width:80%}.book .text-wrapper p{text-align:left}.book .text-wrapper p.small{font-size:.8rem;text-align:center}.book .cover-wrapper .wind{position:absolute;background:url(/images/portfolio/s2-wind.png) center center;background-size:cover;height:100%;width:100%}.book .cover-wrapper{background:#80b9e4}.content-grid{padding:3rem 2rem;margin-top:-1rem;margin-bottom:-1rem;display:grid;grid:1fr 1fr / 1fr 1fr 170px;gap:1rem}.content-grid .left{grid-area:1 / 1 / 3 / 3;display:flex;flex-direction:column;gap:2rem}.content-grid .left article{display:flex;justify-content:center;align-items:center}.content-grid .left article div{padding:1rem;background-color:#fff;filter:drop-shadow(0 0 .15rem rgba(0,0,0,.2));border-radius:.5rem;overflow:hidden}.content-grid .left article img{overflow:hidden;border-radius:.5rem;max-height:calc(var(--main-height) - 19rem);min-height:20rem}.content-grid .right{position:relative;display:flex;justify-content:center;align-items:center;grid-area:1 / 3 / 3 / 4;padding-left:0%;height:100%}.content-grid .right .ladder{position:absolute;width:75%;top:-5%;height:calc(100% + 5rem);background:url(/images/portfolio/ladder-bg.png) center center;background-size:contain;background-repeat:repeat-y;z-index:1}.portfolio-section-2 .content-grid{background:#80b9e4}.portfolio-section-2 .content-grid .right img.character{position:absolute;width:114%;left:14%;top:37%;max-width:inherit;filter:drop-shadow(4px 0 .15rem rgba(0,0,0,.2));z-index:1}.portfolio-section-3 .book .cover-wrapper,.portfolio-section-3 .content-grid{background:#fcc92b}.portfolio-section-3 .content-grid .right img.character{position:absolute;width:120%;left:6%;bottom:11%;max-width:inherit;z-index:1}.portfolio-section-3 .content-grid .right img.gas-1{position:absolute;width:50%;left:65%;bottom:40%;filter:drop-shadow(0 0 .5rem rgba(0,0,0,.1))}.portfolio-section-3 .content-grid .right img.gas-2{position:absolute;width:43%;left:-9%;top:25%;z-index:1;transform:rotate(40deg);filter:drop-shadow(0 0 .5rem rgba(0,0,0,.1))}.portfolio-section-3 .content-grid .right img.gas-3{position:absolute;width:61%;left:63%;top:7%;z-index:1;transform:rotate(17deg);filter:drop-shadow(0 0 .5rem rgba(0,0,0,.1))}.portfolio-section-4 .book .cover-wrapper,.portfolio-section-4 .content-grid{background:#cfdb79}.portfolio-section-4 .content-grid .right img.character1{position:absolute;z-index:1;top:19%;left:-8%}.portfolio-section-4 .content-grid .right img.character2{position:absolute;z-index:1;left:10%;bottom:10%;width:113%;max-width:inherit}@media screen and (max-width:1300px){.ladder{display:none}.portfolio-section-1 .portfolio-header .character{display:block;position:absolute;width:23%;top:59%;right:3%;z-index:1}.portfolio-section-1 .grid .right{display:none}.portfolio-section-1 .grid{display:flex;flex-direction:column;padding:1rem 0;height:auto;min-height:auto}.portfolio-section-1 .grid .bottom img{display:none}.book{height:20rem}.book .middle-shadow,.book .middle{display:none}.book .text-wrapper .text-block img{width:50%}.book .text-wrapper .text-block{max-width:20rem}.content-grid{display:block}.content-grid .left{gap:1rem}.content-grid .right{display:none}.content-grid .left article img{min-height:auto}}@media screen and (max-width:750px){.content-grid{padding:1rem;margin:0}.content-grid .left article div{padding:.5rem}.book{height:auto;overflow:visible;filter:none}.book .cover-wrapper .cover{height:auto;position:relative}.book .text-wrapper{position:relative;width:100%;padding:1rem 0}}@media screen and (max-width:500px){.portfolio-section-1 .grid .top .dialog-wrapper h3{font-size:.8rem}}