@font-face{font-family:pop;src:url(../fonts/851MkPOP_100.8ae8bdfa.ttf) format("truetype")}body{margin:0;font-family:Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro,Yu Gothic Medium,游ゴシック Medium,YuGothic,游ゴシック体,メイリオ,sans-serif;color:#333;overflow:hidden}section{position:relative;width:100%;height:100vh}section .content{position:relative;padding:100px 0;margin:0 auto 100px auto;width:600px;text-align:center}section .content h2{font-size:32px;font-weight:400;margin-top:0;margin-bottom:50px}section .footer{position:absolute;left:0;bottom:0;width:100%}section .footer p.copywrite{height:50px;padding:0;margin:0;font-style:italic;font-weight:700;font-size:14px;text-align:center}#main .content{position:absolute;top:0;right:0;bottom:0;left:0;padding:0;margin:auto;height:480px}#main .content h1{font-family:pop;font-size:32px;margin:0 0 100px 0}#main .content img{text-align:center;width:250px;margin:0 0 70px 0}#main .content h1 span{font-size:48px}#main .content h1 span:first-child{font-size:62px}#main .content p{position:absolute;right:50px;top:-50px;font-family:pop;font-weight:700;font-size:20px;margin:0;width:100px;height:80px;line-height:80px;border:3px solid #333;border-radius:50%;transform:rotate(20deg)}#main .content p span{font-size:32px}#main .content p:before{content:"";position:absolute;bottom:-18px;left:50%;margin-left:-8px;border:6px solid transparent;border-top:14px solid #fff;z-index:2}#main .content p:after{content:"";position:absolute;bottom:-26px;left:50%;margin-left:-10px;border:8px solid transparent;border-top:16px solid #333;z-index:1}#main .content nav ul{text-align:center;padding:0;margin:0}#main .content nav ul li{display:inline-block;margin:0 20px}#main .content nav ul li a{position:relative;color:#333;font-weight:700;text-decoration:none;-webkit-transition:all .5s}#main .content nav ul li a svg{fill:#666;vertical-align:middle;padding:0 10px 0 0}#main .content nav ul li a:hover{opacity:.6}#company{overflow-y:scroll}#company .content ul{padding:0;margin:0;text-align:left}#company .content ul li{display:inline-block;margin-bottom:20px;width:100%}#company .content ul li span{display:inline-block;margin:0 10px}#company .content label{position:relative;display:inline-block;padding:0;margin:0 10px 10px 10px;width:160px;font-weight:700;font-size:18px;border:none;vertical-align:top;text-align:center;cursor:pointer}#company .content p{padding:0;margin:0 10px;max-width:400px;font-size:16px;display:inline-block;line-height:30px;color:#666;font-family:メイリオ}#company .content .profile{margin-top:100px}#company .content .profile img{display:inline-block;width:160px;height:160px;border-radius:50%;vertical-align:middle}#company .content .profile p{margin-left:30px;text-align:left;vertical-align:middle}#service{overflow-y:scroll}#service .content dt{font-weight:700;font-size:18px;margin-bottom:10px;display:list-item;list-style:disc outside;text-align:left}#service .content dd{margin-bottom:30px;text-align:left;color:#666;font-family:メイリオ}#contact .content{position:absolute;top:0;right:0;bottom:0;left:0;padding:0;margin:auto;height:480px}#contact .content p{text-align:left;font-family:メイリオ;margin-bottom:50px}#contact .content .social{margin-top:100px}#contact .content .social ul{padding:0}#contact .content .social ul li{display:inline-block;margin:0 10px}#contact .content .social ul li a{-webkit-transition:all .5s}#contact .content .social ul li a.facebook svg{fill:#3b5998}#contact .content .social ul li a.twitter svg{fill:#1da1f2}#contact .content .social ul li a.linkedin svg{fill:#0077b5}#contact .content .social ul li a:hover{opacity:.6}.arrow{position:absolute;left:50%;bottom:1vh;width:50px;height:50px;margin-left:-25px;-webkit-animation:arrow .5s ease-out 1s infinite alternate}.arrow:hover,.arrow:hover:after,.arrow:hover:before{-webkit-animation-play-state:paused}.arrow:before{-webkit-transform:rotate(225deg);left:17px;-webkit-transform-origin:5px 50%;-webkit-animation:leftArrow .5s ease-out 1s infinite alternate}.arrow:after,.arrow:before{content:"";position:absolute;height:2px;width:25px;background:#000;top:30px;-webkit-border-radius:4px}.arrow:after{-webkit-transform:rotate(-45deg);left:23px;-webkit-transform-origin:5px 50%;-webkit-animation:rightArrow .5s ease-out 1s infinite alternate}@-webkit-keyframes arrow{0%{bottom:1vh}to{bottom:2vh}}@-webkit-keyframes leftArrow{to{-webkit-transform:rotate(235deg)}}@-webkit-keyframes rightArrow{to{-webkit-transform:rotate(-55deg)}}.pagetop{position:fixed;right:10vw;bottom:10vh;-webkit-transition:all .5s}.pagetop:hover{opacity:.6}.dialog{position:absolute;top:0;left:0;right:0;bottom:0;margin:auto;width:0;height:0;background-color:#fff;-webkit-transition:all 0s;z-index:1}.dialog.show{width:100%;height:100%;background-color:rgba(0,0,0,.8);-webkit-transition:all .5s}.dialog .content{opacity:0;position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;text-align:center;height:300px;-webkit-transition-duration:0s}.dialog.show .content{opacity:1;-webkit-transition-duration:1.5s;color:#fff}.dialog .content h1{font-size:3rem;margin-bottom:50px}.button{position:relative;padding:12px 30px;background-color:#333;color:#fff;text-decoration:none;border-radius:4px;-webkit-transition:all .5s}.button svg{fill:#fff;vertical-align:top;padding:0 10px 0 0}.button:hover{opacity:.6}@media (max-width:480px){section .content{width:100%}#main .content{height:360px!important}#main .content h1{font-size:24px}#main .content h1 span{font-size:36px}#main .content h1 span:first-child{font-size:50px}#main .content p{top:-100px}#main .content nav{display:none}#company .content label{display:block;text-align:left}#company .content p{padding:0 10px}#company .content .profile p{margin:30px 20px;padding:0}#service .content dt{margin-left:40px}#service .content dd{margin:0 25px 30px 25px}#contact .content p{padding:0 20px}}