.container,.header{position:relative}.canvas-wrap,.canvas-wrap canvas,.container,.contents,.wrapper,body,html{width:100%;height:100%}*{margin:0;padding:0;color:#fff;box-sizing:border-box;font-family:Comfortaa,"M PLUS Rounded 1c";font-weight:300;font-style:normal}body,html{background-color:#000;overflow:hidden}.header{display:flex;align-items:center;justify-content:space-between;left:0;top:0;width:100%;padding:30px 50px;z-index:10}.about-back,.contents-back,.header-title{display:inline-block}.header-title{font-size:30px;font-family:"Bebas Neue",serif;text-decoration:none}.canvas-wrap{position:fixed;left:0;top:0}.contents{position:absolute;left:0;top:0}.contents-data{position:absolute;left:50px;bottom:50px}@media only screen and (max-width:800px){.header{padding:10px 20px 20px}.header-title{padding:10px 0 15px;font-size:23px}.contents-data{left:20px;bottom:20px}}.contents-data-title{font-size:120px;font-family:"Bebas Neue";height:125px;transform:translateY(20px);opacity:0;transition:1s}@media only screen and (max-width:800px){.contents-data-title{font-size:80px;height:85px}}[data-info=true] .contents-data-title{transform:translateY(0);opacity:1}.contents-data-description{font-size:14px;font-family:Roboto;margin-bottom:2px;opacity:0;transform:translateY(20px);transition:1s}@media only screen and (max-width:800px){.contents-data-description{font-size:12px}}[data-info=true] .contents-data-description{opacity:1;transition-delay:.2s;transform:translateY(0)}.contents-data-date{font-family:Roboto;font-size:14px;opacity:0;transform:translateY(20px);transition:1s}.about-link a,.contents-back a{font-family:"Noto Serif JP",sans-serif;text-decoration:none}@media only screen and (max-width:800px){.contents-data-date{font-size:12px}}[data-info=true] .contents-data-date{transform:translateY(0);opacity:1;transition:1s;transition-delay:.4s}.about-link,.contents-back,.ui-scroll{position:absolute;transition:1s}.contents-back{right:20px;bottom:25px;opacity:0}[data-info=true] .contents-back{opacity:1}.contents-back a{padding:0 3px 0 30px;font-size:16px}.contents-back a::after{content:"";position:absolute;bottom:0;right:0;width:70px;height:1px;background:#ccc;transform:scaleX(.6);transform-origin:right;transition:transform 1s}[data-info=true] .contents-back a::after{opacity:1;transform:scaleX(1)}.ui{position:absolute;width:100%;height:100%;left:0;top:0;pointer-events:none}.ui-scroll{display:flex;width:90%;left:50%;top:50%;transform:translate(-50%,-50%);bottom:30px;align-items:center;justify-content:space-between;opacity:0}@media only screen and (max-width:800px){.ui-scroll{width:90%}}[data-info=true] .ui-scroll{opacity:1}.ui-scroll-item{left:25px;width:25px;height:25px;border-top:2px solid rgba(255,255,255,.4);border-left:2px solid rgba(255,255,255,.4);transform:translateX(10px) rotate(-45deg);opacity:0;transition:.4s;pointer-events:none;cursor:pointer}@media only screen and (max-width:800px){.ui-scroll-item{left:20px;width:20px;height:20px}}.ui-scroll-item[data-active=true]{opacity:1;pointer-events:auto;transform:rotate(-45deg)}.ui-scroll-item.next{transform:translateX(-10px) rotate(135deg)}.ui-scroll-item.next[data-active=true]{transform:rotate(135deg)}.about-link{bottom:0;left:30px;transform-origin:right bottom;transform:translateX(-100%) rotate(90deg) translateX(100%);padding:0 20px 0 2px;border-bottom:1px solid #999;opacity:0}[data-info=true] .about-link{opacity:1;transform:translate(-100%,0) rotate(90deg)}.about-link a{position:relative;font-size:15px;color:#ddd;opacity:0;transition:.5s;transition-delay:.5s}.about,.about-sns{transition:opacity 1s;position:absolute}[data-info=true] .about-link a{opacity:1}@media only screen and (max-width:800px){.about-link{left:20px}.about-link a{font-size:15px}}.about{width:100%;height:100%;left:0;top:0;display:flex;flex-direction:column;justify-content:center;align-items:center;background:rgba(0,0,0,.4);opacity:0}[data-about=true] .about{opacity:1}.about-inner{width:90%}.about-inner p{text-align:center;letter-spacing:5px;font-family:"Noto Serif JP",serif;width:100%;margin:0 auto}@media only screen and (min-width:800px){.about-inner p br{display:none}}.about-sns{right:20px;bottom:20px;opacity:0}.about-sns a{font-family:"Bebas Neue",serif;text-decoration:none;margin-bottom:10px;font-weight:400;margin-right:10px;font-size:20px;color:#ccc}@media only screen and (max-width:800px){.about-inner p{letter-spacing:4px;line-height:28px}.about-sns a{font-size:16px}.about-sns{right:10px;bottom:25px;transform-origin:right bottom;transform:rotate(-90deg) translateX(100%)}}[data-about=true] .about-sns{opacity:1}.about-back{position:absolute;left:50%;bottom:80px;transform:translateX(-20%);opacity:0;transition:1s}@media only screen and (max-width:800px){.about-back{bottom:40px}}[data-about=true] .about-back{opacity:1;transform:translateX(-50%)}.about-back a{padding:0 3px 0 30px;font-size:16px;font-family:"Noto Serif JP",sans-serif;text-decoration:none}.about-back a::after{content:"";position:absolute;bottom:0;right:0;width:70px;height:1px;background:#ccc;transform:scaleX(.6);transform-origin:right;transition:transform 1s}[data-about=true] .about-back a::after{opacity:1;transform:scaleX(1)}