/* # =================================================================
   # CSS Reset  ::  ブラウザごとの差異を減らす
   # ================================================================= */

html {
    box-sizing: border-box;
    overflow-y: scroll;
    -webkit-text-size-adjust: 100%;
}

*,
::before,
::after {
    box-sizing: inherit;
}

::before,
::after {
    text-decoration: inherit;
    vertical-align: inherit;
}

* {
    padding: 0;
    margin: 0;
}

footer,
header,
main,
section {
    display: block;
}

a {
    background-color: transparent;
    -webkit-text-decoration-skip: objects;
    transition : all 0.3s ease-out;
    -webkit-transition : all 0.3s ease-out;
}

a:hover {
    opacity: 0.8;
}

a:active,
a:hover {
    outline-width: 0;
}

img {
    border-style: none;
}

svg:not(:root) {
    overflow: hidden;
}

@media screen {
    [hidden~="screen"] {
        display: inherit;
    }
    [hidden~="screen"]:not(:active):not(:focus):not(:target) {
        clip: rect(0 0 0 0) !important;
        position: absolute !important;
    }
}

[aria-busy="true"] {
    cursor: progress;
}

[aria-controls] {
    cursor: pointer;
}

[aria-disabled] {
    cursor: default;
}

::-moz-selection {
    background-color: #b3d4fc;
    color: #000;
    text-shadow: none;
}

::selection {
    background-color: #b3d4fc;
    color: #000;
    text-shadow: none;
}


/* # =================================================================
   # Common  ::  サイト全体の設定
   # ================================================================= */

html {
    font-family: -apple-system, BlinkMacSystemFont, Roboto, "游ゴシック体", YuGothic, "Yu Gothic Medium", sans-serif;
    font-feature-settings: "pkna" 1;
    line-height: 1.3;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, Roboto, "游ゴシック体", YuGothic, "Yu Gothic Medium", sans-serif;
    font-feature-settings: "pkna" 1;
    line-height: 1.3;
}

h1, h2, h3, h4, h5, h6, strong {
    font-family: -apple-system, BlinkMacSystemFont, Roboto, "游ゴシック体", YuGothic, "Yu Gothic", sans-serif;
    font-weight: 700;
}


/* # =================================================================
   # Header  ::  共通ヘッダー
   # ================================================================= */
header {
    border-bottom: 5px solid #cc0200;
    margin:0;
    padding: 13px 0;
}

.header_logo {
    margin: 0 0 0 12px;
    font-size: 20px;
    white-space: nowrap;
}

.header_logo img {
    display: block;
    margin: 0 auto;
    width: 100%;
}

@media screen and (max-width: 768px) {
    header {
        border-bottom: 0.7vw solid #cc0200;
        margin:0 0 5%;
        padding: 2.5% 0;
    }

    .header_logo {
        margin: 0 auto;
        font-size: 4.5vw;
        text-align: center;
    }
}

/* # =================================================================
   # Footer  ::  共通フッター
   # ================================================================= */

footer{
    background-color: #333;
    border-top: 5px solid #cc0200;
    color: #fff;
    display: block;
    font-size: 12px;
    margin: 0 auto;
    width: 100%;
}

.footerWrap{
    display: flex;
    flex-wrap: wrap;
    margin: 0 auto;
    padding: 0;
    width: 1000px;
}

.footerInfo{
    align-items: center;
    border-top: 1px solid #fff;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 0 auto;
    padding: 10px 0 0 0;
    width: 1000px;
}

.footerInfo ul{
    margin: 0 0 10px 0;
}


.footerInfo ul li{
    display: inline-block;
}

.footerInfo ul li + li{
    margin-left: 10px;
}

.footerInfo small{
    font-size: 12px;
}


.simpleFooter .footerInfo {
    border: none;
    justify-content: center;
    padding: 20px 0;
}

@media screen and (max-width: 768px) {

    footer{
        border-top: 0.7vw solid #cc0200;
        font-size: 3.733vw;
        height: auto;
    }

    .footerWrap{
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        margin: 0;
        padding: 0;
        width: 100%;
    }

    .footerInfo ul{
        margin: 0 0 2.667vw 0;
    }

    .footerInfo{
        flex-direction: column-reverse;
        margin: 0 auto;
        padding: 5.333vw 0;
        text-align: center;
        width: 95%;
    }

    .footerInfo small {
        font-size: 2.667vw;
    }

    .simpleFooter .footerInfo {
        padding: 6.4vw 0;
    }

}

/* # =================================================================
   # 本体
   # ================================================================= */
main {
    min-height: calc( 100vh - 126px );
}

/*コンテンツ 共通*/
.content {
    margin: 0 auto;
    padding: 40px 0 80px;
    width: 660px;
}

.content_meta {
    text-align: left;
    color: #000;
    font-size: 16px;
    line-height: 1.6;
    margin: 40px 0 0;
}

.content_head {
    color: #000;
    font-size: 24px;
    margin: 0 0 20px;
}

.content_text {
    color: #000;
    font-size: 16px;
    margin: 0 0 1em;
    white-space: pre-line;
    line-height: 1.8;
}

.content_subTitle {
    color: #000;
    font-size: 16px;
    font-weight: 500;
    margin: 40px 0 10px;
}

.content_mainte-date {
    color: #000;
    font-size: 16px;
    list-style: none;
    margin: 0 0 40px;
}

.content_mainte-text {
    margin: 0 0 0.8em;
    white-space: pre-line;
    line-height: 1.8;
}

.content_mainte-text a,
.content_text a {
    color: #cc0200;
    text-decoration: underline;
}


@media screen and (max-width: 768px) {
    main {
        min-height: calc( 100vh - 35vw );
    }

    .content {
        padding: 0 2.6vw 10vw;
        width: 100%;
    }

    .content_meta {
        font-size: 3.2vw;
        margin: 5.3vw 0 0;
    }

    .content_head {
        color: #000;
        font-size: 4.2vw;
        margin: 0 0 2.6vw;
    }

    .content_text {
        font-size: 3.2vw;
    }

    .content_subTitle {
        font-size: 3.2vw;
        margin: 5.3vw 0 1.3vw;
    }

    .content_mainte-date {
        font-size: 3.2vw;
        margin: 0 0 5.3vw;
    }

}