@font-face {
    font-family: "DSEG7ClassicMini-Bold";
    src: url("/assets/DSEG7ClassicMini-Bold.woff");
}

html, body{
    background-color: #3A6EA5;
    font-family: "BIZ UDGothic", sans-serif;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
}

.app, #app {
    display: flex;
    justify-content: center;
    width: 100%;
}

.window-container{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
}
.window-container>a{
    text-decoration: none;
    text-align: center;
    outline: none;
}
.window-container>a>img{
    width: 80%;
    max-width: 800px;
}

.window{
    width: 90%;
    max-width: 800px;
    margin: 0 0 1vw 0;
    padding: 0;
}

.window-body{
    margin: 2rem;
}

h1{
    font-size: 2.7em;
}

h2{
    font-size: 2em;
}

h3{
    font-size: 1.8em;
}

p,li {
    font-size: 1.5em;
    margin-bottom: 1em;
}

.status-bar-field{
    font-size: 1.25em;
}

.title-bar-text{
    overflow: hidden;
	white-space: nowrap;
    text-overflow: ellipsis;
}

.field-row{
    flex-wrap: wrap;
}

button{
    color: #222;
}

#counter,#todayCounter{
    font-family: "DSEG7ClassicMini-Bold", sans-serif;
    color: #ff4500
}

.banners{
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    padding: 1rem;
}
.banners>*{
    margin: 1em;
}
.banners>a>img{
    width: auto;
    max-height: 50px;
}


#reciprocal-link>ul>li>a{
    margin-right: 0.5rem;
}

.sns-list{
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    font-size: 1.5em;
}

.sns-list>a{
    margin-right: 0.5rem;
    line-height: 1.5;
}

.blogArticle>span{
    margin-right: 0.5rem;
}

.blogArticle>a{
    text-decoration: none;
}