:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;background-color:#000}a{text-decoration:none;color:#2c638f}a:hover{text-decoration:none}h1,h2,p,body{margin:0}.background{position:fixed;width:100vw;height:100vh;background:#1d2b64;background:-webkit-linear-gradient(to right,#F8CDDA,#1D2B64);background:linear-gradient(to right,#f8cdda,#1d2b64)}.background-legend{visibility:hidden;opacity:0;position:fixed;width:100vw;bottom:0;font-size:14px;color:#282828;background-color:#ffffff1a;text-align:center;padding:2px}.background-legend i{color:#fff}.background-legend-show{visibility:visible;opacity:1}.event-cube-legend{visibility:hidden;opacity:0;position:fixed;left:64px;top:64px;font-size:16px;color:#282828;background-color:#fff6;padding:16px;transition:10s}.event-cube-legend .title{margin-bottom:8px}.event-cube-legend-show{visibility:visible;opacity:1;transition:.3s}.event-cube-legend i{color:#fff;width:16px;text-align:center;text-shadow:0 0 8px rgba(0,0,0,.1)}.loading-mask{position:fixed;width:100vw;height:100vh;display:flex;justify-content:center;align-items:center;z-index:50;background:#1d2b64;background:-webkit-linear-gradient(to right,#F8CDDA,#1D2B64);background:linear-gradient(to right,#f8cdda,#1d2b64)}.loading-mask img{width:40%}.intro-popup{position:fixed;z-index:2;background-color:transparent;cursor:pointer;width:100vw;height:100vh}.intro-popup-hidden{display:none}.portfolio{padding:24px 0;display:grid;grid-template-columns:1fr 1fr 1fr;grid-auto-rows:1fr;grid-gap:24px}.portfolio:before{content:"";width:0;padding-bottom:100%;grid-row:1 / 1;grid-column:1 / 1}.card-frame.visible{grid-row:1 / 1;grid-column:1 / 1}.card-frame.visible~.card-frame.visible{grid-row:unset;grid-column:unset}.container{width:80%;margin:0 auto}.main-content{opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s}.main-content-visible{opacity:1;visibility:visible}@media (max-width: 1100px){.portfolio{grid-template-columns:1fr 1fr;padding:32px 0}}@media (max-width: 600px){.portfolio{grid-template-columns:1fr}.container{width:90%}}.sidebar{position:fixed;display:flex;flex-direction:column;width:10%;align-items:center;justify-content:center;font-size:48px;top:50%;transform:translatey(-50%)}.sidebar a{display:inline-block;margin:16px 0;text-decoration:none;height:56px;display:flex;align-items:center;justify-content:center}.sidebar-right{right:0}.sidebar-right a{color:#8c8c8c66}.sidebar-left{left:0}.sidebar-left .icon{color:#50505066;cursor:pointer}.sidebar-left .icon-text{font-size:24px}.sidebar-left .icon:hover .icon-text{display:block}.sidebar-left .icon:hover i{display:none}@media (max-width: 600px){.sidebar-right{position:relative;flex-direction:row;width:100%;transform:none;justify-content:space-evenly}.sidebar-right a{color:#282828}.sidebar-left{display:none}.sidebar a{font-size:40px}}.intro-card{padding:80px 16%;background-color:#f0f0f04d;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);line-height:1.5em;text-align:justify;position:relative}.intro-card-frame{padding-top:24px}.intro-card h1{text-align:center;margin-bottom:16px}.intro-card strong{text-align:center;display:block;margin-bottom:32px}.intro-card p{font-size:16px}@media (max-width: 600px){.intro-card{padding:80px 16px}}.svelte-icon{width:1em;height:1em;filter:grayscale(1);background-size:contain;background-repeat:no-repeat;background-image:url(https://upload.wikimedia.org/wikipedia/commons/1/1b/Svelte_Logo.svg)}.svelte-icon:before{content:"　"}.vuejs-icon{width:1em;height:1em;filter:grayscale(1);background-size:contain;background-repeat:no-repeat;background-image:url(https://upload.wikimedia.org/wikipedia/commons/thumb/9/95/Vue.js_Logo_2.svg/1920px-Vue.js_Logo_2.svg.png)}.vuejs-icon:before{content:"　"}.card-frame{background-color:#f0f0f033;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);position:relative;padding:24px}.card-frame a{display:flex;flex-direction:column;color:#282828;height:100%}.card-frame .header{height:104px;margin-bottom:24px}.card-frame .title{display:flex;justify-content:space-between;align-items:flex-start}.card-frame .title h2{width:90%;font-size:20px;margin-bottom:24px}.card-frame .title p{margin-bottom:24px}.card-frame .icon{color:"#222";font-size:24px;display:flex}.card-frame .lang{font-size:20px;letter-spacing:4px;display:flex;gap:4px;align-items:center;margin-right:16px}.card-frame .media{position:relative;height:320px;background-size:cover;background-position:50% 50%}.card-frame video{position:absolute;z-index:2;display:none;height:100%;width:100%;object-fit:cover}.card-frame a:hover video{display:block}@media (max-width: 969px){.card-frame{padding:16px}.card-frame .header{height:102px}.card-frame .header h2{font-size:20px}.card-frame .icon{top:16px;right:16px}}@media (max-width: 769px){.card-frame{padding:8px}.card-frame .header{height:96px}.card-frame .header h2{font-size:20px}.card-frame .header p{font-size:16px}.card-frame .icon{top:8px;right:8px;font-size:16px}.card-frame .lang{font-size:14px;margin-right:8px}}