html{height:100%}

body{
background-color: #a5e2ff;
height:100%;
background-size: cover;
background-attachment: fixed;
background-repeat: no-repeat;
font-family:"Lucida Grande", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "ＭＳ Ｐゴシック", Geneva, Arial, Verdana, sans-serif;
font-size:62.5%;}

a:link{color : #00bfff; text-decoration:none; font-weight:bold;}
a:visited{color : #de96da;}
a:hover{text-decoration:underline;}

#main_content{
max-width:1000px;
background-color:#eee;
background-image:url('images/bg_bbd.jpg');
margin: auto;
height:auto;
text-align:center;
color:#333;
line-height:160%;
font-size:1rem;}

.honbun{
background-position:top left;
background-repeat:no-repeat;
}

h1{
width:100%;
padding:5px 0px;
background:#007bc6;
color:#fff;
font-size:1.6em;
line-height:160%;
text-align:center;
font-weight:bold;
margin-bottom:1.5rem;}

div.lead{
width:100%;
color:#333;}

p.lead{width:80%;
padding:5px 0px;
line-height:170%;
text-align:left;
font-size:1rem;
margin-left:auto;
margin-right:auto;
text-shadow: 0 0 0.5rem #bde6ff;}

p.lead-story{
width:80%;
padding:5px 0px;
line-height:170%;
text-align:left;
font-size:1rem;
font-weight:600;
margin-left:auto;
margin-right:auto;
text-shadow: 0 0 0.5rem #bde6ff;}

img.shoei{
border:1px solid #333;
margin:10px;}

div.data{
width: 100%;
font-size:0.9em;
color:#fff;
background: #144a95;
text-align:center;
padding:15px 0px;
line-height:150%;
margin-top:1.5rem;}

img.sheet{border:1px solid #666666;}
img.sheet2{border:none;}


div#footer{
width:100%;
padding:10px 0px;
background: #333;
font-size: 0.8em;
color:#fff;
text-align: center;}

.caution{color:#666; font-size:0.8em; line-height:1rem;}

div.kakomi01{
width:95%;
text-align:left;
background:rgba(220,240,255,0.8);
margin-left:auto;
margin-right:auto;
margin-top:10px;
border:1px solid #34a9e9;
font-weight:bold;}

div.kakomi01 h2{
margin:0px;
font-weight:normal;
font-size:1.5em;
line-height:120%;
background-color:#34a9e9;
color:#fff;
font-weight:bold;
text-align:center;
padding:5px;}

div.kakomi01 p{
margin:10px;
text-align: left;
font-weight:normal;
line-height:150%;}

p.latest{color:#df0648; font-size:0.8rem;}
span.latest{color:#df0648;}

.update{
font-size:0.9em;
color:black;
margin:5px;}

div.download{
    display: flex;
    flex-wrap:wrap;
    justify-content: center;
    align-items: flex-start;
    padding:10px;
    border-bottom:1px solid #333;}

div.items{
    flex-basis: 23%;
    text-align: center;}

div.items2{
    flex-basis: 50%;
    text-align: left;}

.download dt{
    font-weight:bold;}

.download dd{
    font-weight:normal;
    margin-left:1rem;
    margin-bottom:1rem;}

p.eratta{
    margin:2rem;}

h3{
    margin:1rem;
    color:#2b4493;
    font-weight:700;
    font-size:1.2em;
    border-bottom:2px double #333;}

#logo{
    width:45%;}

.scenario_support{
    margin-left:1.5rem;
    margin-bottom: 2rem;}

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



    div.items {
        flex-basis: 45%;
        text-align: center;
        margin: 0.5em;}
    
div.sheet{
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    margin:3rem 0rem;}

.each_sheet{
    width:42%;
    margin:0rem 0.5rem 2rem;}
.each_sheet2{
    width:42%;
    margin:0rem 0.5rem 2rem;}

}