@font-face{font-family:BaseFont;font-weight:400;font-style:normal;font-display:swap;src:url(../fonts/NotoSansJP-Regular.ttf) format('truetype')}body{--header-height:40px;--base-padding:20px;--smaller-font:11px;--small-font:13px;--base-font:16px;--big-font:25px;--biger-font:30px;--light-color:hsl(40deg, 1%, 98%);--base-color:hsl(40deg, 1%, 90%);--middle-color:hsl(40deg, 1%, 83%);--shadow-color:hsl(40deg, 1%, 70%);--dark-color:hsl(40deg, 1%, 35%)}body.dark{--light-color:hsl(40deg, 1%, 98%);--base-color:hsl(40deg, 1%, 35%);--middle-color:hsl(40deg, 1%, 83%);--shadow-color:hsl(40deg, 1%, 70%);--dark-color:hsl(40deg, 1%, 90%)}body,html{width:100%;height:100%;background:var(--base-color);overflow:hidden}*{margin:0;padding:0;color:var(--dark-color);background:0 0;font-family:BaseFont,sans-serif;font-size:var(--base-font);text-decoration:none;border:none;outline:0;box-sizing:border-box;scroll-behavior:smooth;touch-action:manipulation;appearance:none;-webkit-appearance:none;-moz-appearance:none;tab-size:2;overflow:hidden}main{--left-width:0px;--right-width:0px;--title-height:70px;--search-height:30px;--footer-height:70px}main{width:100%;height:100%;display:flex;position:relative}main.openLeftScreen{--left-width:280px}main.openRightScreen{--right-width:280px}@media only screen and (max-width:600px){main.openLeftScreen.openRightScreen{--left-width:0px;--right-width:0px}main.openLeftScreen{--left-width:100%;--right-width:0px}main.openRightScreen{--left-width:0px;--right-width:100%}}article{height:100%;overflow-y:auto}article.leftScreen{width:var(--left-width);border-right:1px solid var(--middle-color)}article.centerScreen{width:calc(100% - var(--left-width) - var(--right-width))}article.rightScreen{width:var(--right-width);border-left:1px solid var(--middle-color)}article>div.header{width:100%;height:var(--header-height);padding:0 var(--base-padding);display:flex;align-items:center;justify-content:space-between}article>div.header>button{width:var(--big-font);height:var(--big-font);background-size:cover}article>div.header>button.hidden{width:0}article>div.header>button.closeLeftScreen{background-image:url('../images/icons/left-panel-close.svg')}article>div.header>button.openLeftScreen{background-image:url('../images/icons/left-panel-open.svg')}article>div.header>button.openRightScreen{background-image:url('../images/icons/right-panel-open.svg')}article>div.header>button.closeRightScreen{background-image:url('../images/icons/right-panel-close.svg')}article.leftScreen>div.header>button.edit,article.rightScreen>div.header>button.edit{background-image:url('../images/icons/edit.svg')}article.leftScreen>div.title,article.rightScreen>div.title{width:100%;height:var(--title-height);padding:0 var(--base-padding);display:flex;align-items:center}article.leftScreen>div.title>button.name,article.rightScreen>div.title>button.name{font-size:var(--big-font)}article.leftScreen>div.search,article.rightScreen>div.search{width:100%;height:var(--search-height);padding:0 var(--base-padding);display:flex;align-items:center;position:relative}article.leftScreen>div.search>input.word,article.rightScreen>div.search>input.word{width:100%;height:100%;padding:0 var(--base-padding);display:block;background:var(--middle-color);font-size:var(--small-font);border-radius:5px}article.leftScreen>div.search>input.word::placeholder,article.rightScreen>div.search>input.word::placeholder{color:var(--dark-color);opacity:.5}article.leftScreen>div.search>button.filter,article.rightScreen>div.search>button.filter{width:var(--big-font);height:var(--big-font);display:block;position:absolute;bottom:10%;right:12%;background-image:url('../images/icons/search.svg');background-size:cover}article.leftScreen>div.body,article.rightScreen>div.body{width:100%;height:calc(100% - var(--header-height) - var(--title-height) - var(--search-height) - var(--footer-height));padding:var(--base-padding);overflow-y:auto}article.leftScreen>div.footer,article.rightScreen>div.footer{width:100%;height:var(--footer-height);padding:0 var(--base-padding);display:flex;align-items:center;justify-content:space-between}article.leftScreen>div.footer>button,article.rightScreen>div.footer>button{display:flex;flex-direction:column;align-items:center}article.leftScreen>div.footer>button:before,article.rightScreen>div.footer>button:before{content:'';width:var(--biger-font);height:var(--biger-font);background-size:cover}article.leftScreen>div.footer>button:after,article.rightScreen>div.footer>button:after{font-size:var(--smaller-font)}article.leftScreen>div.footer>button.list:before{background-image:url('../images/icons/list.svg')}article.leftScreen>div.footer>button.list.active:before{background-image:url('../images/icons/list-active.svg')}article.leftScreen>div.footer>button.list:after{content:'一覧'}article.leftScreen>div.footer>button.set:before{background-image:url('../images/icons/set.svg')}article.leftScreen>div.footer>button.set.active:before{background-image:url('../images/icons/set-active.svg')}article.leftScreen>div.footer>button.set:after{content:'設定'}article.leftScreen>div.footer>button.doc:before{background-image:url('../images/icons/doc.svg')}article.leftScreen>div.footer>button.doc.active:before{background-image:url('../images/icons/doc-active.svg')}article.leftScreen>div.footer>button.doc:after{content:'読み物'}article.leftScreen>div.footer>button.store:before{background-image:url('../images/icons/store.svg')}article.leftScreen>div.footer>button.store.active:before{background-image:url('../images/icons/store-active.svg')}article.leftScreen>div.footer>button.store:after{content:'ストア'}article.rightScreen>div.footer>button.layer:before{background-image:url('../images/icons/layer.svg')}article.rightScreen>div.footer>button.layer.active:before{background-image:url('../images/icons/layer-active.svg')}article.rightScreen>div.footer>button.layer:after{content:'レイヤー'}article.rightScreen>div.footer>button.page:before{background-image:url('../images/icons/page.svg')}article.rightScreen>div.footer>button.page.active:before{background-image:url('../images/icons/page-active.svg')}article.rightScreen>div.footer>button.page:after{content:'ページ'}article.rightScreen>div.footer>button.tool:before{background-image:url('../images/icons/tool.svg')}article.rightScreen>div.footer>button.tool.active:before{background-image:url('../images/icons/tool-active.svg')}article.rightScreen>div.footer>button.tool:after{content:'ツール'}article.rightScreen>div.footer>button.forum:before{background-image:url('../images/icons/forum.svg')}article.rightScreen>div.footer>button.forum.active:before{background-image:url('../images/icons/forum-active.svg')}article.rightScreen>div.footer>button.forum:after{content:'フォーラム'}