body{background:#333}header a{display:inline-block;padding:2vw;text-decoration:none;color:#fff;opacity:.5}header a:hover{opacity:1}header a::before{content:"●";font-size:5px;vertical-align:text-top;padding-right:10px}.page{padding:5vh 5vw}.page .contents-body{display:flex;flex-wrap:wrap;justify-content:center}.page .contents-body .contents-item{border:1px dotted #555;width:500px;height:500px;display:flex;justify-content:center;align-items:center;position:relative}.label{padding:5px 10px;border:#333;color:#fff;position:absolute;background:#222;top:0;left:0;font-size:13px;cursor:pointer;text-decoration:underline;text-decoration-color:#fff}.label::after{content:"</>";position:relative;padding-left:10px;font-weight:600}.popup{position:absolute;width:90vw;top:5vw;left:5vw;padding-bottom:5vw;z-index:10;opacity:0;display:none}.popup .popup-body{width:100%;background:#1e1e1e}.popup .popup-body pre{width:100%;padding:2.5vh 0;border:1px dotted #555;margin:0}.popup_close{position:absolute;top:2.5vw;right:5vw;z-index:11;display:flex;justify-content:center;align-items:center;opacity:0;color:#fff;font-size:30px;font-weight:100;cursor:pointer}.popup-bg{top:0;left:0;position:fixed;height:100vh;width:100vw;background:#000000a3;z-index:5;opacity:0;display:none}body{width:100vw;height:500vh}.slide-navi{width:500px;margin:0 auto;display:block;position:relative;bottom:0}#container{position:fixed;top:0;left:0;width:100vw;height:100vh}.img_box{width:100vw;height:100vh;display:flex;justify-content:center;align-items:center;position:absolute;top:-10vw;z-index:100;background:red;opacity:0}.img_box .img_item{width:25vw;height:30vw;background:#eee;z-index:5;opacity:.2}
