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}.page .contents-body .contents-item .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}.page .contents-body .contents-item .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}.btn-body-1{display:inline-block;width:200px;height:40px;padding:30px;background:#000;position:relative;display:flex;justify-content:center;align-items:center;border-radius:100px;text-decoration:none}.btn-text-1{display:inline-block;position:relative;top:0;left:0;color:#fafafa;display:inline-block}.btn-body-2{display:inline-block;width:200px;height:40px;padding:30px;background:#eee;position:relative;border-radius:100px;text-decoration:none}.btn-text-2{display:inline-block;position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);color:#222;display:inline-block;overflow:hidden}.btn-text-2 span{display:inline-block;position:relative}.btn-body-3{display:inline-block;width:200px;height:40px;padding:30px;background:#eee;position:relative;border-radius:100px;text-decoration:none;overflow:hidden;z-index:1;border:2px solid #222}.btn-text-3{display:inline-block;position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);color:#111;display:inline-block;overflow:hidden;z-index:3}.btn-text-3 span{display:inline-block;position:relative}.btn-bg-3{background:#222;width:100%;height:100%;position:absolute;top:0;left:0;z-index:2}.btn-body-4{display:inline-block;width:200px;height:40px;padding:30px;background:#111;position:relative;border-radius:100px;text-decoration:none;overflow:hidden;z-index:1;border:2px solid #222}.btn-text-4{display:inline-block;position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);color:#eee;display:inline-block;overflow:hidden;z-index:3}.btn-text-4 span{display:inline-block;position:relative}.btn-body-5{display:inline-block;width:200px;height:40px;padding:30px;background:#6779db;position:relative;text-decoration:none;overflow:hidden;z-index:1}.btn-text-5{display:inline-block;position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);color:#fff;display:inline-block;overflow:hidden;z-index:3}.btn-text-5 span{display:inline-block;position:relative}.btn-bg-5{background:#5260ae;width:100%;height:100%;position:absolute;top:0;left:0;z-index:2}