body{margin:0;height:100vh;width:100%;background-color:#fff;font-family:Noto Sans JP,serif}#root{height:100%}.bg-light{background-color:#fcfcfc;color:#000}.navigation__wrapper{height:55px;width:100%;box-shadow:0 5px 10px #3f3f3f;display:flex;flex-direction:row;align-items:center}.navigation__title,.navigation__nav-item{padding:0 8px;cursor:pointer}.navigation__title{flex:1;text-align:start;padding-left:12vw}@media screen and (max-width: 900px){.navigation__title{text-align:start;padding-left:24px}}.navigation__nav-items{flex:1;display:flex;flex-direction:row;justify-content:flex-end;text-align:center;padding-right:12vw}@media screen and (max-width: 900px){.navigation__nav-items{text-align:center;padding-right:24px}}.footer{height:55px;width:100%;display:grid;justify-content:center;align-items:center}.template{height:100%;display:flex;flex-direction:column}.template__navigation{flex:1}.template__container{flex:15;width:70%;margin:15px auto}@media screen and (max-width: 900px){.template__container{width:90%}}.template__footer{flex:1;display:grid;align-items:end}.search{height:50px;overflow-y:scroll}.search__wrapper{height:100%;width:100%;text-align:center}.search__input{height:24px;width:96%;padding:0 8px;margin-top:13px;background-color:#eee}@media screen and (max-width: 1300px){.search__input{width:95%}}@media screen and (max-width: 1000px){.search__input{width:90%}}.search__input:focus{box-shadow:0 5px 5px #3f3f3f;outline:1px solid #383838}.tag__wrapper{display:flex;flex-direction:row;flex-wrap:wrap;gap:10px;max-height:40px;overflow-y:auto}.tag__item{height:18px;width:max-content;display:grid;justify-content:center;align-items:center;font-size:12px;color:#a0a0a0}.tag__link{padding:1px 8px;border:1px solid #383838;color:#383838;cursor:pointer}.tag__link:hover{transition:.5s;background-color:#383838;color:#fff}.tab__wrapper{height:80px;padding:8px}.tab__controller{display:flex;flex-direction:row}.tab__controller--search,.tab__controller--tag{height:30px;width:60px;margin-bottom:-1px;display:grid;align-items:center;justify-content:center;border:1px solid #383838;border-bottom:1px solid #fff;background-color:#383838;border-bottom:1px solid #383838;color:#fff;cursor:pointer}.tab__controller--active{background-color:#fff;border-bottom:1px solid #fff;color:#383838}.tab__controller--search{margin-left:-1px}.tab__search,.tab__tag{display:none}.tab__search--active,.tab__tag--active{display:flex;flex-direction:row;align-items:center;height:50px;border:1px solid #383838;overflow-y:scroll}.tab__search--active{justify-content:center}.tab__tag--active{padding-left:8px}.card{height:200px;width:100%;display:flex;flex-direction:column;cursor:pointer}.card:hover{transition:.7s;box-shadow:0 5px 10px #3f3f3f}.card__header,.card__footer{display:grid;align-items:center}.card__header{flex:1;margin:8px 8px 0;display:flex;flex-direction:row;border-bottom:1px solid #bbb}.card__title{flex:5}.card__datetime{flex:2;text-align:end;font-size:10px;color:#a0a0a0}.card__tag{flex:1}.card__content{flex:5}.card__content--picture__wrapper{text-align:center;margin-bottom:8px}.card__content--picture{size:200px;height:200px;object-fit:cover;border-radius:100%}.card__footer{flex:1;cursor:pointer}.card__article{height:100%;width:100%;display:flex;flex-direction:column}.card__article .card__content{flex:14}.card__item{padding:8px}.card__touched{transition:.7s;box-shadow:0 5px 10px #3f3f3f}.main__cards{display:flex;flex-direction:column;gap:10px}.article__wrapper{height:100%}.loading__wrapper{height:100%;width:100%;display:grid;justify-content:center;align-items:center;position:relative}.loading__content{height:400px;width:800px;border-radius:100%;border:3px solid #000000;animation-duration:1s;animation-iteration-count:infinite;animation-timing-function:linear;animation-name:rotate;display:grid;justify-content:center;align-items:center}@keyframes rotate{0%{transform:rotate3d(1,1,1,0)}to{transform:rotate3d(1,1,1,360deg)}}@media screen and (max-width: 900px){.loading__content{height:200px;width:400px}}.loading__text{font-size:24px}