main{font-family: "Noto Sans Japanese",sans-serif; }
#mainWrap{ padding-bottom: 200px;
  /*background-color: #f2ede9;*/ background-image: url(../img/event/aboutbg.png);
background-repeat: repeat-y; background-position: 0 0 ;}



/* R */
.rmark2{  line-height: 1em; padding-right: 10px; 
 display: inline-block;  position: relative;}

 .rmark2 .rmark{ bottom: 0px; position: absolute; line-height: 0.1em;height: -1px;}

 .frameTitle .rmark2 i.rmark{ margin-left: -4px; line-height: 0.5em; }
 #event .maintxt .rmark2 i.rmark{  margin-left: -2px; line-height: 0.1em; }
.qtxt .rmark2{ padding-right: 12px; }
.eventtxt .rmark2{ font-size: 20px; }
.everytxt .rmark2 i.rmark{ margin-left: -2px; }

.contbox{ width: 90%; max-width: 1200px;
    margin-left: auto; margin-right: auto; box-sizing: border-box; position: relative;
    background-color: rgba(255, 255, 255, 0.85); color: #0033a0; }


#aboutTxt p, #aboutTxt rb, #aboutTxt .rmark2 i,  #aboutTxt .rmark2 i.rmark,
#event .maintxt, #event .maintxt rb,
#observation .subtxt,#observation .subtxt rb,#pinch .subtxt,#pinch .subtxt rb,
#missiontxt,#missiontxt rb,#missiontxt span,
#quiz li dt .questionbar span,#quiz li dt .questionbar rb,
.atxt,.atxt rb,.frameTitle .rmark2 i,
#event .maintxt .rmark2 i,
.everytxt,.everytxt rb,.everytxt .rmark2 i{ font-weight: 600; }

#quiz li dt .questionbar,.qtxt,
.qtxt span i{ font-weight: 500; }

#aboutTxt p:first-child{ letter-spacing: 0.1px;}
#aboutTxt p:not(:first-child){ letter-spacing: 0.4px; }
#aboutTxt.contbox{ padding-bottom: 10px; }

.contbox figcaption{ color:#120b10; }
.contbox#aboutTxt figcaption rb{ font-weight: inherit; }



.contbox .frameTitle{ position: absolute; top: -80px; left: 50%;
transform: translate(-50%, 0);
-webkit-transform: translate(-50%, 0%);
-ms-transform: translate(-50%, 0);}

#observation::before,
#intestinal,#fellow,#observation,#pinch,
#fine,#quiz{ background-position:center 0 ; background-size: 100%; background-repeat: no-repeat;}


#intestinal{ margin-top: -140px; 
   background-image:url(../img/event/intestinalbg.png) ;}

#intestinal .contbox figure{margin-bottom: 40px;}


#event .maintxt,
#intestinal p.eventtxt:not(:last-child),
#fellow p.eventtxt:not(:last-child),
#observation p.eventtxt:not(:last-child),
#fine p.eventtxt:not(:last-child),
#pinch p.eventtxt:not(:last-child),
#quiz p.eventtxt:not(:last-child),
#every p.eventtxt:not(:last-child){ margin-bottom: 26px; }

#observation .subtxt,#pinch .subtxt,#event .maintxt,
.everytxt,#fellow figure{ text-align: center; }

#fellow { background-image:url(../img/event/fellowbg.png) ; }

#fellow figure{ max-width: 859px; width: 82%; margin-left: auto; margin-right: auto;}

#observation::before{ position: absolute; content: ""; background-image:url(../img/event/bacteriatop.png) ;
   height: 318px; top: /*-130px*/ -9vw; width: 100%;}
#observation{margin-top: 0; 
   background-image:url(../img/event/bacteriabg.png) ;
  background-color: #56a4e3; position: relative;}

#bacteriaimg{ display: flex; justify-content: space-between; }


#observation .contbox  #bacteriaimg figure{  margin-bottom: inherit; }

.maintxt2{ text-align: center;
  margin-bottom: 40px;
  font-size: 1.64em;
  line-height: 2.2em; }


#fine{ background-image:url(../img/event/finebg.png) ; background-color: #dff2fc; }
 

#pinch, #quiz{ position: relative; background-repeat: repeat-y; }
#pinch::before, #quiz::before{ position: absolute; content: ""; width: 100%;
   background-repeat: no-repeat; background-position: center 0; background-size: 100%; top: 0;}

#pinch{  background-image:url(../img/event/pinchbg.png) ;}
#pinch .frameTitle{ max-width: 440px; width: 60%; }
#pinch::before{ height: 218px; 
   background-image: url(../img/event/pinchtop.png);}
#pinch figure p{ margin-top: 30px; }
#pinch p#missiontxt.eventtxt{ text-align: center; }
#missiontxt span{  font-size: 1.19em; background-color: #caeaf9; padding:18px 0 8px }


#pinch #movie img{ width: 100%; }


#quiz{ background-image:url(../img/event/quizbg.png) ;
  background-position: center -6vw; }

#quiz::before{  height: 500px; margin-top: -8vw;
  background-image: url(../img/event/quiztop.png); }

#quiz .contbox{  padding-bottom: 1px; }
#drimg{ padding-top:5px; margin-bottom: 50px; }  
#event #quiz .maintxt{ margin-bottom: 30px; margin-top: inherit; }

#quiz li {  background: #0033a0; border-radius: 40px 0;}
#quiz li dt{color: #fff; display: flex; align-items: center;}
.qtxt{ font-size: 25px; line-height: 2em;}
#quiz li dt .questionbar{ 
  letter-spacing: 5px;
  display: flex;
  line-height: 0;
  justify-content: center;
  box-sizing: border-box;
  background-color: #b2e0f7; color: #0033a0; text-align: center; border-radius: 6px; }

#quiz li dt .questionbar span{ font-size: 40px; line-height:0.9em; font-weight: 500; }

#quiz li dd{  background: #fff; border-radius: 20px; }
.atxt{  letter-spacing: 1px; }



#every{ position: relative;
  background-repeat: repeat-y;
  background-position: center 0;
  background-size: 100% auto;
  font-weight: 300; }

#every::before,#every::after{ position: absolute; content:""; background-repeat: no-repeat; background-size: 100%; 
width: 100%; background-position: center 0;}

#every::before{  height: 348px;
  background-image: url(../img/event/everybg.png); }

#every::after{ height: 1507px;  top:0; z-index: -1;
  background-image: url(../img/event/everyicon.png); background-position: center 5.2vw; }

#every .frameTitle{ max-width: 640px; width: 84%;}
.everytxt{ letter-spacing: 0.6px;}


/*------------------------------------------
sp
------------------------------------------*/
@media screen and (max-width: 750px) {
  #intestinal{ padding-bottom: 26vw ;}
  #fellow,
  #quiz,
  #observation,
  #fine{ padding-bottom: 20vw ;}
  #fellow { margin-top: -14vw; }  

#fine,#quiz{ margin-top: -12vw; }
.contbox figcaption{ font-size: 3vw; }
.contbox .frameTitle{top: -13vw; }
.frameTitle { font-size: 5.5vw; line-height: 1.6em; padding: 4% 3% 2%;}
#intestinal .contbox .frameTitle{ width: 64%; }   
#observation .contbox .frameTitle,#fellow .frameTitle,
#fine .contbox .frameTitle, #quiz .contbox .frameTitle{ width: 80%; }

.frameTitle span{ font-size: 5vw;}
#intestinal .frameTitle span{ margin-left:-3vw }
.frameTitle rt{ font-size: 0.35em; }
.titlesp {  margin-left: -2vw;}
#event .maintxt .rmark2 i.rmark{ font-size: 16px; margin-left: -0.6px;}

#event .maintxt{  margin-bottom: 8%; font-size: 4.3vw; line-height: 2.2em;}

.eventtxt{ font-size: 3.7vw; line-height:2.25em}
.eventtxt .rmark2{ font-size: 3.7vw; }
.eventtxt .rmark2 .rmark{ font-size: 1.3em; }

#intestinal,#fellow{padding-top: 25vw;}
#fine{padding-top: 32vw;}
#pinch{padding-top: 28vw;}
#quiz{padding-top: 23vw;}
#observation{ padding-top:18vw; }

.contbox{ border-radius: 8vw 0 ; padding: 8% 7%;}

#intestinal .contbox,
#fine .contbox,
#fellow .contbox{padding-top: 20vw;}
#observation .contbox,
#every .contbox,
#pinch .contbox,
#quiz .contbox{ padding-top: 22vw; }


#event .maintxt rt,#event .subtxt rt,.qtxt rt{ font-size: 0.5em; }
.questionbar rt,.everytxt rt{ font-size: 9px; }


#aboutTxt p, #observation .subtxt,#pinch .subtxt{ font-size: 4.63vw; line-height: 2.1em; }
#aboutTxt p:first-child{ margin-bottom: 6%;}
#aboutTxt p:not(:first-child),
#observation .contbox figure,
.contbox figure{ margin-bottom: 10%; }
.contbox figcaption{ margin-top: 5.5%; }

#observation .subtxt{ margin-top: 12%; }

#bacteriaimg{ margin-top: 5%; flex-wrap: wrap;  }
#bacteriaimg li{ width: 100%;}
#bacteriaimg li:not(:last-child){ margin-bottom: 4.5%;}
#bacteriaimg figcaption{ margin-top: 6%; }

#fine .contbox figure{ margin-top: 12%; margin-bottom: 6%; }

#missiontxt span{ font-size: 4.5vw; margin-top: 7px;
  display: inline-block; padding:4% 4%; }
#missiontxt span.sptxt{ display: none; }
#pinch{ margin-top: -12vw; padding-bottom: 34vw;}
#pinch .maintxt { letter-spacing: -0.7px; }
#pinch .maintxt2 { font-size: 4.3vw; line-height: 2.2em; }
#pinch p#missiontxt.eventtxt{ font-size: 4vw; margin-bottom: 12%; line-height: 1.5em;}
#pinch #anime.subtxt{ margin-top: 12%; margin-bottom:5%}
#pinch figure p{ letter-spacing: -0.6px; margin-top: 6%;}
#pinch figure#sadimg p{ margin-top: 8%; }
#pinch #tansaimg{ padding-top: 2%; margin-bottom: 12%; }
#pinch .subtxt{ font-size: 4.6vw; letter-spacing: -1.4px; line-height: 1.9em; margin-bottom: 6%; padding-top: 3%;}
figure#missionimg{ margin-bottom: 12%; }


.frameTitle .rmark2 i.rmark { margin-left: -1px; line-height: 0.3em; }

#quiz li { margin-bottom: 10%; padding: 10% 9%; border-radius: 10vw 0;}
#event #quiz #quizabout.maintxt{  padding-top: 6%; margin-bottom: 6%;}
#quiz li dt{ margin-bottom: 8%; }
#quiz li dt .questionbar { font-size: 4.2vw;
  padding: 4% 5% 1.5%; margin-bottom: 8%;}
#quiz li dt .questionbar span { font-size: 8vw; line-height: 1.2em;}
.qtxt{ font-size: 4.25vw; line-height: 2.1em;}
#quiz li dd{ padding:11% 7% 10%; }
.atxt{ font-size: 4.15vw; margin-bottom: 9%; }
#quiz li dd .eventtxt br{ display: none; }
.questionbar rt{ padding-bottom: 1px; }
figure#chalengeimg{ margin-bottom: 12%; }
#anime.subtxt{  letter-spacing: 0.2px;}

#every{ background-image: url(../img/footerBg.gif);
  padding: 7vw 0 6vw;}
#every::before{ margin-top: -22vw; }
#every .contbox{   margin-top: 8vw; }
#every .frameTitle{ width: 86%; }
#every .eventtxt{ letter-spacing: -0.6px; }
#every figure{ margin-top: 12%; margin-bottom: 20%;}
.everytxt{ font-size:4.3vw ; line-height: 2em; letter-spacing: -0.45px;}



}




/*------------------------------------------
tab
------------------------------------------*/
@media screen and (max-width: 1300px) and (min-width: 1001px) {
#intestinal,#fellow{padding-top: 220px;}
#fine{padding-top:19vw;}
#quiz{padding-top:13vw;}
#pinch{padding-top:22vw;}
#observation{ padding-top:150px; }

#intestinal .contbox,
#fine .contbox{ padding-top: 150px; }
#observation .contbox,
#every .contbox,
#fellow .contbox,
#pinch .contbox,
#quiz .contbox{ padding-top: 160px; }

}


@media screen and (max-width: 1000px) {
#quiz li dt{ flex-wrap: wrap; }
}


@media screen and (max-width: 1000px) and (min-width: 751px) {
  #intestinal,#fellow{padding-top: 22vw;}
  #fine{padding-top:28vw;}
  #quiz{padding-top:18vw;}
  #pinch{padding-top:26vw; margin-top: -190px;}
  #observation{ padding-top:18vw; }

  #intestinal, #fellow, #quiz {
    padding-bottom: 150px;  }

  #intestinal .contbox,
  #observation .contbox,
  #fellow .contbox,
  #quiz .contbox,
  #fine .contbox,
  #pinch .contbox,
  #every .contbox{ padding-top: 140px; }

  #fine .brtxt{ display: block; }
  .sptxt{ line-height: 0; }
  #quiz li dt .questionbar{ margin-bottom: 3%; }

}

@media screen and (max-width: 1300px) and (min-width: 751px) {
  #pinch .maintxt2{ letter-spacing: -1.79px; }
  #fellow .maintxt{ letter-spacing: -0.3px; }
  
  #bacteriaimg li{ width: 48%; }
  #event .maintxt{line-height: 1.9em;}
  #event .maintxt .rmark2 i.rmark{ height: 1px; line-height: 0; }
  #observation .brtxt{ display: block; }
  .contbox {  padding: 6% 5%;}

  }
  
  @media screen and (max-width: 1300px) {
  #fine br.pc{ display: none; }
   
  #aboutTxt { margin-top: 8%; }
  
  .contbox figcaption{ line-height: 2em; }
  
  }

/*------------------------------------------
pc
------------------------------------------*/
@media screen and (min-width: 751px) {
  #intestinal,#fellow,
  #quiz{ padding-bottom: 200px ;}
  #observation,
  #fine{ padding-bottom: 180px ;}
  #fellow { margin-top: -110px; }  

  #fellow .frameTitle,
  #observation .frameTitle,
  #fine .frameTitle,
  #pinch .frameTitle,
  #quiz .frameTitle,#every .frameTitle{line-height: 1.5em;}

  #intestinal .contbox .frameTitle{ max-width: 420px; width: 50%;}   
  #observation .contbox .frameTitle,#fellow .frameTitle,
  #fine .contbox .frameTitle, #quiz .contbox .frameTitle{ max-width: 600px; width: 74%;}
  .frameTitle{ padding:23px 25px 13px; }
  #fellow .frameTitle{ width: 78%; }
  #intestinal .frameTitle span{ margin-left:-25px }
  .frameTitle rt{ font-size: 0.25em; }
  .titlesp{ margin-left: -19px; }
  #event .maintxt .rmark2 i.rmark{ font-size: 22px;}

#observation .subtxt .brtxt2,
#fine .maintxt .brtxt2,
#pinch .maintxt .brtxt2, #pinch .maintxt2 br,
#missiontxt .brtxt2 ,#missiontxt .brtxt3,
#pinch .subtxt .brtxt2,
#quiz .maintxt .brtxt3, #quizabout .brtxt,
#every .maintxt .brtxt3,
.everytxt .brtxt3{ display: none; }

  #aboutTxt p, #observation .subtxt,#pinch .subtxt{ font-size: 1.31em; line-height: 2.2em; }
  #aboutTxt p:first-child{ margin-bottom: 25px;}
  #aboutTxt p:not(:first-child){ margin-bottom: 47px; }
  .contbox figure{ margin-bottom: 85px; }
  .contbox figcaption{ margin-top: 34px; }


    #event .maintxt{  margin:0px 0 40px; font-size: 1.64em; }
  .eventtxt{ font-size:1.125em; line-height:2.35em }
  .contbox{ border-radius: 80px 0 ;}

  #event .maintxt rt,#event .subtxt rt,.qtxt rt{ font-size: 11px; }
  .questionbar rt,.everytxt rt{ font-size: 10px; }

  #fine,#quiz{ margin-top: -150px; }
  #fine .contbox figure{ margin-top: 70px; margin-bottom: 30px; }

  #observation .contbox figure{  margin-bottom: 40px; }
  #observation .subtxt{ margin-top: 66px; }
  #bacteriaimg{ margin-top: 39px; }
  #pinch p#missiontxt.eventtxt{ font-size: 1.31em; margin-bottom: 45px;}
  #pinch #anime.subtxt{ margin-top: 70px; margin-bottom:45px}
  #pinch #tansaimg{ padding-top: 15px; }
  figure#missionimg{ margin-bottom: 60px; }
  #pinch{ padding-bottom: 340px;}


  #quiz li { margin-left:5% ; margin-right:5% ; padding: 45px 50px; }
  #quiz li:not(:last-child){ margin-bottom: 40px;}
  #quiz li:last-child{ margin-bottom: 50px;}
  #event #quiz #quizabout.maintxt{  padding-top: 44px; margin-bottom: 40px;}
  .qtxt{ font-size: 25px; line-height: 2em;}
  #quiz li dt{ margin-bottom: 30px; }
  #quiz li dt .questionbar{ 
  font-size: 21px; 
  padding: 17px 0 0;
    height: 63px;
    min-width: 122px;}
  
  #quiz li dd{ padding:40px 2.12vw 30px; }
  .atxt{ font-size: 24px; margin-bottom: 30px; }
  figure#chalengeimg{ margin-bottom: 70px; }

  #every{ background-image: url(../img/footerBg.gif);
      padding: 7vw 0 6vw;}

  #every figure{ margin-top: 88px; }
  .everytxt{ font-size: 24px; line-height: 2em;}

  }
  
  @media screen and (max-width: 1000px) and (min-width: 751px) {
  .frameTitle .rmark2 i{ font-size: 40px; }
  .frameTitle .rmark2 i.rmark { right: 0; font-size: 0.9em;}

  #every::before{ top: -16vw; }

  #fine .maintxt{letter-spacing: -1.49px;}
  #fine { padding-bottom: 220px;}
  #pinch{ padding-bottom: 290px; }
}

@media screen and (min-width: 1001px) {
  .frameTitle .rmark2 i{ font-size: 44px;}
  .frameTitle .rmark2 i.rmark{ font-size: 24px; }

  #observation .eventtxt{ letter-spacing: -0.442px; }
  #every::before{ top: -160px; }
  #pinch{ margin-top: -150px; }

  #fine .brtxt,
  #quiz .brtxt,
  #pinch #missiontxt .brtxt,
  #pinch .subtxt .brtxt{ display: none; }
  .sptxt{ display: none; }

  #quiz li dt .questionbar{ margin-right: 30px;}


}
@media screen and (min-width: 1131px) {
  #pinch .maintxt .brtxt{ display: none; }
}

@media screen and (min-width: 1301px) {
.contbox {  padding: 85px 70px;}
#intestinal .contbox{ padding-top: 141px; }
#observation .contbox{ padding-top: 165px; }
#fellow .contbox{padding-top: 170px;}
#fine .contbox,#pinch .contbox,
#quiz .contbox,#every .contbox{ padding-top: 160px; }

#aboutTxt { margin-top: 110px; }
.contbox figcaption{letter-spacing: 1px;}

#intestinal{padding-top: 250px;}
#fellow { padding-top: 230px; }
#fine,
#pinch{padding-top: 300px;}
#quiz{padding-top: 140px;}

#observation{ padding-top: /*290px*/12vw; }

#bacteriaimg li{ width: 49%; }
#event .maintxt{line-height: 2.2em;}
#observation .brtxt{ display: none; }


}

