html, body {
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
}

.site-box {
        width : 100% ;
height: auto;
        height: 100% ;
  display: flex;  /*要素をflexboxに対応させる */
  align-items: center;  /*縦方向の中央揃え */
  flex-direction: column;  /*子要素の並びを上から下にする（要素の改行に対応） */
  justify-content: center; /* 横方向の中央揃え */
 overflow-x: hidden;
/*background-color: #CBFFD3;*/
}





#header {
  width: 100%;
  text-align: center;
  margin: 100 ;
background-color: #9cf;
}

#container {
  width: 100%;
 /* max-width: 1200px; */
 /* min-width: 320px; */
  position: relative;
 overflow-x: hidden;
  background-color: #9cf;      背景色指定 
    margin:  10px;             /* 余白指定 */
padding-bottom: 50px;
}

#content {
  width: 100%;
  position: relative;
/*  background-color: #9cf;      背景色指定 */
    margin:  50px 50px 50px 50px;             /* 余白指定 */
z-index: 10;
}


#bottom {
/*	bottom: 0;*/
    width: 100%;
    text-align: center;
}



.footer {
    position: absolute; 
    bottom: 0;
    width: 100%;
    height: 50px;
    background-color: black;
opacity:0.5;
}

 
.mar1 {
    margin: 10px;
}

.tate {
    display: block;
text-align: center
}

.points {
    max-height:200px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 20px;
}



/*----------------------------------ここからPCモニターの記述-----------*/
@media screen and (min-width: 600px) {
 
nav{
 display: flex;
}
 
.Toggle{
 display: none;
}
.menu{
width: 100%;
font-size:0.9em;
background-color: transparent;
margin:0 10px;
-webkit-transform: translateX(0);
transform: translateX(0);
}
.menu ul{
 height: 70px;
 display: flex;
 flex-wrap: wrap;
 justify-content: flex-end;
 align-items: center;
 list-style: none;
}
.menu ul li a{
 padding: 0 1em;
 border-bottom: none;
}
.menu ul li a:hover{
background-color:transparent;
}
.mar1 {
    margin: 50px 200px;
}
.tate {
    display: flex;
 justify-content: center;
 flex-wrap: wrap;
}
}





 


#formmail { width: 80%; }

fieldset {
  margin: 0;
  padding: 1em;
  min-width :300px;
  width: 80%;
}

#formmail dt {
  font-weight: bold;
  margin: 0 ;
  padding: 0;
}

#formmail dt span {
  font-weight: normal;
  color: #ff0000;
  padding: 0;
}

#formmail dd {
  margin: 0 ;
  padding: 0;
}

textarea {
  min-width :300px;
  width: 90%;
  height: 200px;
}


.registration {
  min-width :340px;
  width: 50%;
  border: 0px solid #000;
  padding: 0px;
  margin: auto;
}


dt{
  float: left;
}

dd{
  margin-left: 80px;
}

.message{
/*  margin-left: 10px;*/
    margin: auto;
}

.center_img{
 display: block;
 margin: auto;
 max-width: 500px;
}

.top_img{
 z-index: 50;
position: relative;
}

p.text1 {line-height: 150%; font-size: 15px; color: #333333; font-family: Verdana;}

p.text2 {font-size: 18px; color: #333333; font-family: Verdana; vertical-align:1em;}

p.text3 {line-height: 150%; font-size: 20px; color: #0000FF; font-weight: bold; font-family: Verdana;}

p.text4 { font-size: 12px; color: #333333; font-family: Verdana;}

p.text5 { font-size: 15px; color: #FFFFFF; font-family: Verdana; text-align: center;}