body {
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    background-image: url(../images/screen_base.png);
    background-repeat: no-repeat;
    background-position: center bottom;
    background-attachment: fixed;
    background-size: cover;
    background-color: #000000;
    color: #FFFFFF;
}

a {
    color: #E6E6E6;
    text-decoration: none;
    transition: color .3s;
    border-bottom: 1px solid #FF6600;
}
.info_area a {
    color: cadetblue;
    text-decoration: none;
    border-bottom: 1px solid cadetblue;
    transition: color .3s;
}
a:hover{
    color: #FFFFFF;
    border-bottom: 1px solid #FF6600;
}
p {
    font-size: 2em;
}
h1 {
    color: #FFFFFF;
    /*
    text-shadow:2px
    2px 0 #000000, -2px -2px 0 #000000,
    -2px 2px 0 #000000, 2px -2px 0 #000000,
    0px 2px 0 #000000,  0-2px 0 #000000,
    -2px 0 0 #000000, 2px 0 0 #000000;
     */
    border-bottom: solid 3px #4c4c4c;
    text-align: center;
    font-size: 2em;
    margin-top: 2em;
    width: 100%;
}
h2 {
    color: #FFFFFF;
    text-shadow:2px
    2px 0 #000000, -2px -2px 0 #000000,
    -2px 2px 0 #000000, 2px -2px 0 #000000,
    0px 2px 0 #000000,  0-2px 0 #000000,
    -2px 0 0 #000000, 2px 0 0 #000000;
    border-bottom: solid 2px #D70C18;
    text-align: center;
    font-size: 1.5em;
    margin-top: 1.5em;
    margin-right: auto;
    margin-left: auto;
    width: 80%;
}

/*
img {
    width: 80%;
    max-width: 700px;
}
*/

section {
    padding-bottom: 30px;
    margin-bottom: 30px;
}

.container_content {
    padding-top: -50px;
    padding-top: 50px;
    padding-bottom: 100px;

}
.container_content2 {
    padding-bottom: 100px;

}

table {
    font-size: 2em;
    width: 80%;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 1em;
    border-collapse: collapse;
    border:1px solid #dfc6a2;
}
table th,table td {
    border:1px solid #dfc6a2;
}
#head_top {
    width: 100%;
    position: fixed;
    top: 0;
}
#header {
    border-bottom: 10px solid black;
}
#header img {
    margin-top: 1em;
    margin-bottom: 1em;
    max-width: 300px;
}
#footer img {
    margin-top: 1em;
    margin-bottom: 1em;
    max-width: 300px;
}
#top_img {
    text-align: center;
}
#top_img img {
    margin-top: 300px;
    width: 600px;
}


.back_white {
    background-color: rgba(255,255,255,0.9);
}

.back_black {
    background-color: rgba(0,0,0,0.7);
}

.color_green {
    color: #8fc31f;
}
.color_orange {
    color: #f39800;
}
.content_box {
    width: 60%;
    margin-left: auto;
    margin-right: auto;
    text-align: left;
}
.section_top{
    margin-top: 200px;
}


/**********************************************************************************************************************/
/**************************************** Extra small devices: Phones (<768px) ****************************************/
/**********************************************************************************************************************/
@media screen and (max-width:767px) {
    body{
        background-image: url(../images/screen_base_mobile.png);
        background-attachment:
    }
    body:before{
        content:"";
        display:block;
        position:fixed;
        top:0;
        left:0;
        z-index:-1;
        width:100%;
        height:100vh;
        background:url(../images/screen_base_mobile.png) center no-repeat;
        background-size:cover;
    }

    p {
        font-size: 1em;
    }
    h2 {
        width: 100%;
    }
    table {
        font-size: 1em;
        width: 98%;
    }
    #head_top {
        width: 100%;
        position: relative;
    }
    #header {
        border-bottom: none;
    }
    #header img {
        width: 50%;
    }
    #top_img img {
        margin-top: 20px;
        width: 96%;
    }
    .content_box {
        width: 90%;
    }
    .section_top{
        margin-top: 0px;
    }

}
