@charset "utf-8";@media screen and (min-width:768px){html{-webkit-text-size-adjust:100%;font-size:62.5%}article,aside,figure,footer,header,main,nav,section{display:block}body,div,figure,h1,h2,h3,li,p,section,ul{margin:0;padding:0}body{font-family:"Noto Serif JP",Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,Meiryo,Osaka,メイリオ,ＭＳ Ｐゴシック,MS PGothic,sans-serif}*{box-sizing:border-box}ul{list-style-type:none}img{border:none;vertical-align:bottom}a{color:#09d}p{padding:0 0 1em}dt,p{margin:0}dd,dt{padding:0}dd{line-height:150%;margin:0 0 15px}header{background-color:#fff;height:50px;position:fixed;width:100%;z-index:100}#logo{fill:#57c3ea;box-sizing:border-box;height:auto;margin:12px 60px 0;width:220px}footer{background-color:#fff;bottom:0;color:#333;height:50px;letter-spacing:.1em;padding-top:16px;position:fixed;text-align:center;width:100%}#story-last,#story-start,#story1,#story2,#story3,#story4,#story5,#story6,#story7{border-left:50px solid #fff;border-right:50px solid #fff;position:relative;width:100%;-ms-writing-mode:tb-rl;writing-mode:vertical-rl}#story1,#story2,#story3,#story4,#story5,#story6,#story7{background-color:#faf9f6}#story-last h2,#story1 h2,#story2 h2,#story3 h2,#story4 h2,#story5 h2,#story6 h2,#story7 h2{font-size:1.8em;letter-spacing:.1em;margin-left:1.4em;text-orientation:upright}#story-last p,#story-start p,#story1 p,#story2 p,#story3 p,#story4 p,#story5 p,#story6 p,#story7 p{letter-spacing:.02em;margin:0 10px;text-indent:1em}#story1 div,#story3 div,#story5 div,#story7 div{left:76%}#story1 div,#story2 div,#story3 div,#story4 div,#story5 div,#story6 div,#story7 div{background-color:#faf9f6;box-sizing:border-box;color:#333;height:64vh;padding:.5vmin 4vmin;position:absolute;top:50%;transform:translate(-50%,-50%)}#story2 div,#story4 div,#story6 div{left:26%}#story-start div{box-sizing:border-box;color:#fff;height:56vh;left:50%;padding:.5vmin;position:absolute;top:50%;transform:translate(-50%,-50%)}#story-start h1{font-size:2em;letter-spacing:-.02em;margin:0 0 0 30px}#story-start h1 span{display:block;text-indent:4em}#story-last div{box-sizing:border-box;color:#fff;left:50%;padding:.5vmin;position:absolute;top:50%;transform:translate(-50%,-50%)}#story1{background-image:url(../images/pic_01.jpg);background-position:20% 50%}#story1,#story2{background-repeat:no-repeat}#story2{background-image:url(../images/pic_02.jpg);background-position:88% 50%}#story3{background-image:url(../images/pic_03.jpg);background-position:20% 50%}#story3,#story4{background-repeat:no-repeat}#story4{background-image:url(../images/pic_04.jpg);background-position:88% 50%}#story5{background-image:url(../images/pic_05.jpg);background-position:20% 50%}#story5,#story6{background-repeat:no-repeat}#story6{background-image:url(../images/pic_06.jpg);background-position:88% 50%}#story7{background-image:url(../images/pic_07.jpg);background-position:20% 50%;background-repeat:no-repeat}#story-last:after,#story-start:after{color:#fff;content:"INTERNET ACADEMY STORY";font-size:.64em;letter-spacing:.3em;margin:auto;position:absolute;right:6px;text-align:center;top:40%;width:10%;-ms-writing-mode:tb-rl;writing-mode:vertical-rl}#story1:before,#story3:before,#story5:before,#story7:before{color:#333;font-family:Cardo,serif;font-size:10em;left:10%;letter-spacing:.01em;margin:auto;position:absolute;text-align:center;top:26%;-ms-writing-mode:lr-tb;writing-mode:horizontal-tb}#story1:before{content:"1995"}#story3:before{content:"2000"}#story5:before{content:"2010"}#story7:before{content:"2020"}#story2:before,#story4:before,#story6:before{color:#333;font-family:Cardo,serif;font-size:10em;left:66%;letter-spacing:.01em;margin:auto;position:absolute;text-align:center;top:74%;-ms-writing-mode:lr-tb;writing-mode:horizontal-tb}#story2:before{content:"1998"}#story4:before{content:"2001"}#story6:before{content:"2017"}#story1:after,#story2:after,#story3:after,#story4:after,#story5:after,#story6:after,#story7:after{color:#b4a67d;font-size:.64em;letter-spacing:.3em;margin:auto;position:absolute;right:6px;text-align:center;top:40%;width:10%;-ms-writing-mode:tb-rl;writing-mode:vertical-rl}#story1:after{content:"INTERNET ACADEMY STORY 1"}#story2:after{content:"INTERNET ACADEMY STORY 2"}#story3:after{content:"INTERNET ACADEMY STORY 3"}#story4:after{content:"INTERNET ACADEMY STORY 4"}#story5:after{content:"INTERNET ACADEMY STORY 5"}#story6:after{content:"INTERNET ACADEMY STORY 6"}#story7:after{content:"INTERNET ACADEMY STORY 7"}#story-start:before{background:#0bd url(../images/main01.jpg);background-blend-mode:screen;background-position:top;background-repeat:no-repeat;background-size:cover}#story-last:before,#story-start:before{content:" ";display:block;height:100%;opacity:.3;position:absolute;width:100%;z-index:-1}#story-last:before{background:#0bd url(../images/main02.jpg);background-blend-mode:screen;background-position:top;background-repeat:no-repeat;background-size:cover}#story-last a{background-color:#fff;display:block;margin:0 50px 0 0;padding:0 20px;text-align:center;text-decoration:none;transition:all .3s ease}#story-last a:hover{background-color:#222;color:#fff}main{color:#222;font-size:1.6em;height:auto;line-height:200%;position:relative;width:100%}.container{-ms-scroll-snap-points-y:repeat(100vh);scroll-snap-points-y:repeat(100vh);height:100vh;overflow-y:auto;-ms-scroll-snap-type:y mandatory;scroll-snap-type:y mandatory}.area{height:100vh;scroll-snap-align:start}.bg{animation:slide 3s ease-in-out infinite alternate;background-image:linear-gradient(-90deg,#3abfef 50%,#09f 0);bottom:0;left:-50%;opacity:.5;position:fixed;right:-50%;top:0;z-index:-1}.bg2{animation-direction:alternate-reverse;animation-duration:4s}.bg3{animation-duration:5s}#hamburgerui{background-color:#222;color:#fff;display:block;height:100px;position:absolute;right:0;text-decoration:none;top:0;transition:all .5s;width:100px;z-index:100}#hamburgerui ul{font:700 16px Bitter,sans-serif;list-style-type:none;margin:0;padding:0}#hamburgerui li{display:inline;margin:0}#hamburgerui:after{content:"Menu";visibility:hidden}#hamburgerui:hover{background:blue}#navtoggler{border:.6em solid #fff;border-width:.6em 0;cursor:pointer;font-size:8px;height:2.5em;left:50%;padding:0;text-indent:-1000px;transform:translate3D(-50%,-50%,0);width:4em}#navtoggler,#navtoggler:after,#navtoggler:before{display:block;position:absolute;top:50%;transition:all .3s ease-in}#navtoggler:after,#navtoggler:before{background-color:#fff;content:"";height:.6em;left:0;margin-top:-.3em;width:100%}#fullscreenmenu{background:#222;box-sizing:border-box;height:100%;left:0;opacity:.9;overflow:auto;padding-top:80px;position:fixed;top:0;transform:translate3D(0,-100%,0);transition:transform .5s,visibility 0s .5s;visibility:hidden;width:100%;z-index:1}#fullscreenmenu ul{font-family:Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,Meiryo,Osaka,メイリオ,ＭＳ Ｐゴシック,MS PGothic,sans-serif;font-size:2em;list-style:none;margin:0;opacity:0;padding:0;position:relative;transform:translate3D(0,-40px,0);transition:all .5s .4s;width:100%}#fullscreenmenu ul li{box-sizing:border-box;display:inline;font-size:1.4em;text-align:center;width:100%}#fullscreenmenu ul li span{display:block;font-size:.8em}#fullscreenmenu ul li span:first-child{background-color:#57c3ea;color:#fff;font-size:.6em;font-weight:700;margin:0 auto 10px;padding:10px 0;width:20%}#fullscreenmenu ul li a{color:#fff;display:block;padding:50px;position:relative;text-decoration:none;transition:background .3s}#fullscreenmenu ul li a:hover{background-color:#57c3ea}#fullscreenmenu ul li a:hover:after{width:100%}#hamburgerui.shrink li:nth-last-of-type(n+2) a{opacity:0;pointer-events:none}#hamburgericonmenuwrapper.open #fullscreenmenu{transform:translateZ(0);transition:transform .4s;visibility:visible}#hamburgericonmenuwrapper.open #navtoggler{border-width:0}#hamburgericonmenuwrapper.open #navtoggler:before{transform:rotate(-45deg)}#hamburgericonmenuwrapper.open #navtoggler:after{transform:rotate(45deg)}#hamburgericonmenuwrapper.open #hamburgerui li:nth-last-of-type(n+2) a{opacity:0;pointer-events:none}#hamburgericonmenuwrapper.open #fullscreenmenu ul{opacity:1;transform:translateZ(0)}}@media (max-width:800px){#hamburgerui li a{padding:25px}#fullscreenmenu ul{font-size:2em}}@media (max-width:600px){#hamburgerui li a{padding:20px}#fullscreenmenu ul{font-size:1.5em}}@media (max-width:480px){#fullscreenmenu ul{font-size:1em}}@keyframes slide{0%{transform:translateX(-25%)}to{transform:translateX(25%)}}