/* すべてに適用 */

*{ 
  margin: 0px; 
  padding: 0px; 
}



/* タグに適用 */

span{
  display: inline-block;
}

img {
  border-radius: 8px;
  padding: 0px 0px 10px 0px;
}

body {
  margin: 0px;
  padding: 0px;
  background-color: rgb(247, 236, 222);
  margin-top: 0;
}

h1 {
  color: rgb(247, 236, 222);
  width: 100%;
  font-size: 28pt;
  margin:0px;
}

p{
  font-size:14pt;
} 

span {
  display: inline-block;
}

/* classに適用 */

.wrapper{
    min-height: 100vh;
    position: relative;/*←相対位置*/
    padding-bottom: 120px;/*←footerの高さ*/
    box-sizing: border-box;/*←全て含めてmin-height:100vhに*/
}

.contents{
  /* background: url(../images/MusaForum.png); */
  background-color: rgb(247, 236, 222);
  height: 90px;
  width:100%;
  padding: 20px 20px 0 20px;
  /* width: 90%;
  height: 100%;
  padding: 20px 20px 0 20px; */
  /* display: flex; */
}

.quizheader {
  height: 90px;
  width: 100%;
  padding: 20px 20px 0 20px;
  background-color: #6b493d;
  color: #fff;
  font-family: 'MS UI Gothic','sans-serif';
  font-size: 35px;
  font-weight: bold;
}

.quizcontents {
    font-size: 30px;
    font-family: 'sans-serif';
    padding: 20px 20px 0 20px;
}

.footer1 {
    font-size: 15px;
    padding: 0px 0px 0 0px;
    margin-bottom: -18px;
    text-align: center;
}

.footer2 {
    font-size: 10px;
    margin-bottom: 0;
}

[class^="button_n_"],[class^="button_s_"],[class^="button_d_"] {
  display: inline-block;
 }


.button_style {
  width: 104px;
  height: auto;
  background-color: rgb(158, 210, 198);
  border-radius:15px;
  margin-left:5px;
  margin-right:5px;
  display: inline-block;
}

.button_style_pale {
  width: 104px;
  height: 104px;
  background-color: rgb(158, 210, 198 , 0.5);
  border-radius:15px;
  margin-left:5px;
  margin-right:5px;
  display: inline-block;
}

.flex{
    display: flex;
    justify-content: space-between;
}
.flex>p{
    width: 100px;
}

.pc{
  display: block;
}
.sp{
  display: none;
}

@media only screen and (max-width: 480px){
  .pc{
    display: none;
  }
  .sp{
    display: block;
  }
}

/* idに適用 */

#header{
  height: ;
  width:100%;
  padding: 0 ;
  background-color: rgb(84, 186, 185);
  color: #fff;
  margin-top: 0;
  text-align: center;
}

#content{
  height: ;
  width:100%;
  padding: 0 ;
  background-color: rgb(247, 236, 222);
  color: #000;
  margin-top: -8;
  margin-bottom: -16;
}

#foot{
  height: ;
  width:100%;
  padding: 0 ;
  background-color: rgb(84, 186, 185);
  color: #000;
  margin-top: 0;
  text-align: center;
  position: absolute;
  bottom: 0;
}

#bgcolor{
  background-color: rgb(247, 236, 222);
}

[id^="invisible"] {
  display: none;
}

#blue {
  color: rgb(84, 186, 185);
}

#bar {
  height: 5px;
  background-color: rgb(84, 186, 185);
  border-radius: 10px;
  opacity: 1;
}

#middle {
  top: 500;
  right: 0;
  bottom: 0;
  left: 0;
}

#caption {
  font-size:10pt;
}

#caption_c {
  font-size:7pt;
  padding-top:3pt;
}

#caption_x {
  font-size:9pt;
}


#concretion_size {
  width:104px;
  height:auto;
  padding-top:6.5px;
  padding-bottom: 6.5px;
}

#concretion_size_ssd {
  width:104px;
  height:auto;
  padding-top:6.5px;
  padding-bottom: 6.5px;
  margin-bottom:4px;
}

#tetsuo_size {
  width:auto;
  height:104px;
  padding-left:13.225px;
  padding-right:13.225px;
}

#tetsuo_size_ssd {
  width:auto;
  height:104px;
  padding-left:13.225px;
  padding-right:13.225px;
  margin-bottom:4px;
}

#hisui_size {
  width:104px;
  height:auto;
  padding-top:29.43335px;
  padding-bottom: 29.43335px;
  margin-bottom:4px;
}

#rapi_size {
  width:104px;
  height:auto;
  padding-top:11.78335px;
  padding-bottom: 11.78335px;
  margin-bottom:4px;
}

#metacrinus_size {
  width:104px;
  height:auto;
  padding-top:13px;
  padding-bottom: 13px;
  margin-bottom:4px;
}

#radiolaria_size {
  width:auto;
  height:104px;
}

#radiolaria_size_ssd {
  width:auto;
  height:104px;
  margin-bottom:4px;
}