@import url(//fonts.googleapis.com/earlyaccess/notosansjapanese.css);

body {
  color: #000;
}

.jackbox-social {
  display: none;
}

.content_area {
  background: #ffffff;
  font-family: "Noto Sans Japanese", sans-serif;
}

.top_content {
  min-height: 40px;
}

.header-design2 .top_content .info_bar {
  margin: auto;
  padding: 0 0 25px;
}


.read_font {
  font-family: fot-tsukubrdgothic-std, sans-serif;
  font-weight: 400;
  font-style: normal;
}

.content_holder img {
  transition: 1s;
  width:100%;
}

a:hover img {
  opacity: 0.7;
}

h2.copy {
  color: #000;
  text-align: center;
  font-family: fot-tsukubrdgothic-std, sans-serif;
  font-size: 36px;
  font-style: normal;
}

ｘh4.topics {
  font-size: 20px;
  border-bottom: 1px solid #000;
  margin-bottom: 0.5rem;
}


p.read_txt {
  font-size: 18px;
  line-height: 1.8;
  padding-top: 1em;
  text-align: center;
  font-weight: 200;
}

p.read_txt2 {
  font-size: 16px;
  line-height: 1.8;
  padding-top: 1.5em;
  text-align: center;
  font-weight: 200;
}

.main_titletab {width: 260px; margin-left: 160px;}
.main_title {font-family: fot-tsukubrdgothic-std, sans-serif; font-size: 2rem; text-align: center; margin: 25px 0;}

h2.featured_article_title {
  background: url(/img/labo/trialclass2022/tt_bg01.png) no-repeat center;
  background-size: 50%;
  font-family: fot-tsukubrdgothic-std, sans-serif;
  font-size: 1.4rem;
  font-weight: 400;
  color: #000;
  text-align: center;
}

h3.featured_article_title {
  font-family: fot-tsukubrdgothic-std, sans-serif;
  font-size: 1.2rem;
  font-weight: 400;
  color: #000;
  text-align: center;
  margin:2rem 0 1rem;
}

h3.featured_article_title02 {
  background: url(/img/labo/trialclass2022/tt_bg02.png) no-repeat center;
  background-size: 65%;
  font-family: fot-tsukubrdgothic-std, sans-serif;
  font-size: 1.6rem;
  font-weight: 400;
  color: #000;
  text-align: center;
  margin:2rem 0 2.5rem;
}

.festlogo {width:30%; margin:0 auto 15px;}

.traial_inner01 {max-width:800px; margin:0 auto;}

.year_gallery {
  max-width:740px; margin:0 auto;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  text-align: center;
  overflow: hidden;
  }
.yearcard {
  width: 44%;
  margin: 5px 0;
  text-align: center; line-height: 1.6; font-size: .8rem; 
}

.trial_day {font-size:3.5rem; color:#924a8f; font-family: Avenir; font-weight: 600;}
.trial_day span {font-size:1.6rem;}
.daypct {max-width:650px; margin:0 auto;}

/** instbox **/
.instbox {max-width:780px; margin:0 auto; overflow: hidden;}
.instbox a {text-decoration:none;}
.col-y {background:#fffbe0; padding:40px 0; overflow: hidden;}
.col-b {background:#e8f5fd; padding:40px 0; overflow: hidden;}
.col-p {background:#fdeff5; padding:40px 0; overflow: hidden;}
img.inst_main {margin-bottom:10px;}
.inst_name {float:left; font-size:1.4rem; padding:.3rem; text-align:center; width:25.5%; line-height:1.4;}
.inst_copy {text-align:center; padding:.5rem; float:left; width:71%; background:#dceedc;}
.inst_copy02 {text-align:center; padding:.5rem; float:left; width:71%; background:#ced3eb;}

.inst_insta {text-decoration:none;}
.inst_insta img {width:24px; display:unset; vertical-align: middle;}
.inst_insta span {font-size:.8rem; margin-left:10px; vertical-align: middle;}
p.inst_txt {clear:both;font-size: 14px;
  line-height: 1.8;
  padding: 1rem 0 2rem;
  text-align: center;
  font-weight: 200;}
.instbox .inst-class {width:140px; float:left;}
.instbox .class-title {text-align:center; margin-left:10px;  padding:.5rem 1rem; float:left; xwidth:30%; background:#924a8f; color:#fff;}
.instbox a:hover .class-title {opacity: .8; transition: 1s;}

.inst_youtube {
  max-width: 460px;
  margin: 20px auto;
  padding: 20px 0;
}

.inst_gallery {
  max-width:780px; margin:0 auto 80px;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  text-align: center;
  overflow: hidden;
  }
.card {
  width: 32.5%;
  margin: 5px 0;
}



@media only screen and (min-width: 1024px) {

}

@media only screen and (max-width: 768px) {
  p.read_txt { font-size: 16px; }
  p.read_txt2 { font-size: 14px; }
  .instbox {padding:10px;}
  .inst_name {font-size:1.3rem; width:24.5%;}
  .inst_copy,
  .inst_copy02 {width:70%;}
}

@media only screen and (max-width: 375px) {
  .festlogo { width: 60%;}
  h3.featured_article_title {font-size: 1rem; }
  h2.featured_article_title {background-size: 100%;}

  .yearcard {
    width: 48%;
    margin: 5px 0;
    text-align: center; line-height: 1.6; font-size: .8rem; 
  }
  .main_titletab {width: 160px; margin-left: 15px;}
  .main_title {font-family: fot-tsukubrdgothic-std, sans-serif; font-size: 2rem; text-align: center; margin: 25px 0;}

  h3.featured_article_title02 { background-size: 100%;}

  .trial_day {font-size:2.5rem; }
  .trial_day span {font-size:1.5rem;}

  .inst_name {font-size: 1.1rem; width: 100%; float:none;}
  .inst_name br {display: none;}
  .inst_insta img {margin-left:1rem;}
  .inst_copy,
  .inst_copy02 {width:96%; float:none;}
  p.inst_txt { font-size: 13px; padding: 0 1rem 2rem; letter-spacing: -0.05rem;}

  .instbox .inst-class { width: 100px;}
  .instbox .class-title { margin: 3px 0 10px 3px; padding: 0.2rem 0.5rem; font-size:12px;}
}