@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Barlow:700&display=swap');

#main-contents {
  background: #e5e3e0;
}
.load {
  display: none;
}
#main-contents .center {
  width: 920px;
  margin: 0 auto;
  padding: 70px 0;
}
#main-contents .flex {
  display: flex;
  justify-content: flex-start;
  flex-wrap:wrap;
}
#main-contents .inblock {
  position: relative;
  border-radius: 4px;
  background: #fff;
  box-shadow:6px 6px 0px 0px rgba(0,0,0,0.15);
}
#main-contents .originalBg {
  background: #0f1b25 url("../../img/bg_tamaboke.jpg") no-repeat center top;
}
#main-contents h2.ttl {
  margin-bottom: 40px;
  text-align: center;
}
#main-contents h2.ttl span {
  color: #fff000;
  font-family: 'Barlow', sans-serif;
  font-style: italic;
  font-weight: 700;
  font-size: 1.125em;
}
#main-contents h2.ttl.blk span {
  color: #d11e00;
}
#main-contents h2.ttl strong {
  display: block;
  margin-top: 10px;
  color: #fff;
  font-weight: bold;
  font-size: 38px;
}
#main-contents h2.ttl.blk strong {
  color: #000;
}



/* mainvisual */
#main-contents .mainvisual {
  background: url("../../img/main.jpg") no-repeat center top;
  height: 544px;
}
#main-contents .mainvisual .center {
  padding-top: 60px;
}
#main-contents .mainvisual .ttl {
  width: 750px;
  margin: 0 auto;
}


/* oatime */
#main-contents .oatime {
  width:780px;
  margin: -60px auto 70px;
  padding: 16px 20px 20px;
  border-radius: 14px;
  background: #000;
  text-align: center;
}
#main-contents .oatime h2 {
  color: #ee1b21;
  font-family: 'Barlow', sans-serif;
  font-weight: 700;
  font-size: 34px;
  font-style: italic;
}
#main-contents .oatime .mainTime {
  line-height: 1.2;
  margin: 10px 0 15px;
  color: #fff;
  font-weight: 700;
  font-size: 24px;
  letter-spacing: 0.05em;
}
#main-contents .oatime .mainTime span {
  font-size: 0.66em;
}
#main-contents .oatime .otherarea {
  line-height: 1.4;
  padding: 15px;
  border-radius: 8px;
  background: #fff;
  color: #000;
  font-weight: 700;
  font-size: 1.063em;
}
#main-contents .oatime .otherarea p:not(:first-child) {
  margin-top: 5px;
}
#main-contents .oatime .otherarea p span {
  font-weight: 400;
  font-size: 0.875em;
}
#main-contents .intro {
  padding-bottom: 90px;
}
#main-contents .intro .center {
  width: 910px;
  padding: 0;
}
/* about */
#main-contents #about {
  margin-bottom: 70px;
}
#main-contents #about .inblock {
  padding: 20px;
  background: url("../../img/bg_tamaboke.jpg") center center / cover;
}
#main-contents #about .inblock .text {
  padding: 35px 45px;
  border-radius: 4px;
  background: #fff;
  text-align: center;
}
#main-contents #about .inblock .text p {
  line-height: 1.5;
  margin-bottom: 10px;
  font-size: 1.125em;
}
#main-contents #about .inblock .text p:last-child {
  margin-bottom: 0;
}
#main-contents #about .inblock .text p strong {
  color: #00a5ea;
  font-weight: bold;
  font-size: 1.111em;
}


/* next */
#main-contents #oaNext {
  justify-content: space-between;
  padding: 35px;
}
#main-contents .ribbonTtl {
  position: absolute;
  top: -23px;
  left: -12px;
  width: 260px;
  height: 35px;
  background: url("../../img/bg_ribbon.gif");
  text-align: center;
}
#main-contents .ribbonTtl:after {
  display: block;
  content: "";
  position: absolute;
  top: 35px;
  left: 0;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 12px 10px 0;
  border-color: transparent #000 transparent transparent;
}
#main-contents .ribbonTtl span {
  display: inline-block;
  line-height: 35px;
  color: #eb1a20;
  font-family: 'Barlow', sans-serif;
  font-style: italic;
  font-weight: 700;
  font-size: 14px;
}
#main-contents .ribbonTtl strong {
  display: inline-block;
  line-height: 35px;
  margin-left: 10px;
  color: #fff;
  font-weight: 500;
  font-size: 18px;
}
#main-contents #oaNext .oaImg {
  border-radius: 4px;
  overflow: hidden;
}
#main-contents #oaNext .oaMov {
  width: 430px;
  border-radius: 4px;
  height: 242px;
  overflow: hidden;
}
#main-contents #oaNext .oaMov iframe {
  display: block;
  width: 100%;
  height: 100%;
}
#main-contents #oaNext .oaTxt {
  width: 385px;
  /*padding-top: 10px;*/
}
#main-contents #oaNext .oaTtl {
  line-height: 1.5;
  margin-bottom: 5px;
  color: #eb1a20;
  font-weight: 500;
  font-size: 1.250em;
  text-align: justify;
}
#main-contents #oaNext .oaData {
  line-height: 1.7em;
  font-size: 0.938em;
  text-align: justify;
}


/* movie-list */
#main-contents .movie-list {
  background: #a7c3db;
}
#main-contents .movie-list .ttl-group .ttl {
  margin-top: 0;
}


/* oaInfo */
#main-contents .oaInfo .block-list .flex {
  justify-content: flex-start;
}
#main-contents .oaInfo .block-list .flex .block {
  height: auto !important;
}


/* banner area */
#main-contents .intro .bnrArea {
  width: 700px;
  margin: 65px auto 0;
}
#main-contents .bnrArea li {
  margin-bottom: 20px;
  border-radius: 4px;
  background: #fff;
  box-shadow:6px 6px 0px 0px rgba(0,151,230,0.15);
  overflow: hidden;
}
#main-contents .bnrAreaMini {
  justify-content: center;
}
#main-contents .bnrAreaMini li {
  width: 450px;
}
#main-contents .bnrAreaMini li:nth-child(odd) { margin-right: 20px; }
#main-contents .bnrAreaMini li:last-child { margin-right: 0; }
#main-contents .bnrArea li a {
  display: block;
}


/* prgPoint */
#main-contents .prgPoint .center {
  max-width: 1000px;
  width: 90%;
}
#main-contents .more-btn {
  background: #cd1c1c;
}

/* recommend program */
#main-contents .rcmndProgram.center{
  max-width: 1000px;
  width: 90%;
}


@media all and (max-width: 812px) {
#main-contents {
  padding: 0 0 100px;
}
#main-contents .originalBg {
  background: #0f1b25 url(../../img/bg_tamaboke.jpg) no-repeat center -42vw / 187vw;
}
#main-contents .center {
  width: 85%;
  padding: 70px 0;
}
#main-contents h2.ttl strong {
  font-size: 34px;
}
.block-list .flex {
  display: block;
}


/* mainvisual */
#main-contents .mainvisual {
  background: url("../../img/main_sp.jpg") no-repeat center top / 100% auto;
  height: 105vw;
}
#main-contents .mainvisual .center {
  width: 100%;
  padding: 14vw 0 0;
}
#main-contents .mainvisual .ttl {
  width: 80%;
  margin: 0 auto 8.6vw;
}
#main-contents .mainvisual .text {
  width: 80%;
  margin: 0 auto;
  font-size: 3.7vw;
}


/* oatime */
#main-contents .oatime {
  width:85%;
  margin: -37vw auto 100px;
  padding: 2.8vw 3vw 3vw;
}
#main-contents .oatime h2 {
  font-size: 5vw;
}
#main-contents .oatime .mainTime {
  margin: 1.8vw 0 3.2vw;
  font-size: 4vw;
}
#main-contents .oatime .otherarea {
  font-size: 3.6vw;
}


/* about */
#main-contents #about {
  margin-bottom: 70px;
}
#main-contents #about .inblock {
  padding: 15px;
}
#main-contents #about .inblock .text {
  padding: 6%;
  text-align: left;
}
#main-contents #about .inblock .text p span {
  display: block;
}
#main-contents #about .inblock .text p br {
  display: none;
}

  
#main-contents .intro {
  padding-bottom: 15vw;
}
#main-contents .intro .center {
  display: block;
  width: 85%;
  padding: 0;
}
/* next */
#main-contents #oaNext {
  display: block;
  width: 100%;
  padding: 5% 5% 4% 5%;
}
#main-contents #oaNext .oaMov {
  position: relative;
  width: 100%;
  height: auto;
  margin-bottom: 10px;
  padding-top: 56.25%;
}
#main-contents #oaNext .oaMov img,
#main-contents #oaNext .oaMov iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#main-contents #oaNext .oaMov img {
  height: auto;
}
#main-contents #oaNext .oaTxt {
  width: 100%;
  padding-top: 0;
}

  
/* bnrArea */
#main-contents .intro .bnrArea {
  width: 85%;
  margin: 65px auto 0;
}
#main-contents .bnrAreaMini li {
  width: 100%;
}
#main-contents .bnrAreaMini li:nth-child(odd) { margin-right: 0; }
  

/* prgPoint */
#main-contents .prgPoint .center {
  width: 90%;
}
}



@media all and (max-width: 568px) {
#main-contents .center {
  width: 90%;
  padding: 12vw 0;
}
#main-contents h2.ttl {
  margin-bottom: 6vw;
}
#main-contents h2.ttl span {
  font-size: 4vw;
}
#main-contents h2.ttl strong {
  margin-top: 2.6vw;
  font-size: 6vw;
}
#main-contents #snsBnr h2.ttl strong {
  font-size: 5.5vw;
  letter-spacing: 0;
}


#main-contents .mainvisual .ttl {
  width: 80vw;
}
#main-contents .oatime {
  width: 90%;
  margin: -37vw auto 15vw;
  padding: 2.8vw 3vw 3vw;
}  
#main-contents .oatime h2 {
  font-size: 7vw;
}
#main-contents .oatime .mainTime {
  font-size: 4.68vw;
  letter-spacing: 0;
}
#main-contents .oatime .text span {
  display: block;
}
#main-contents .oatime .text {
  font-size: 3.7vw;
}


/* about */
#main-contents #about {
  margin-bottom: 12vw;
}
#main-contents #about .inblock .text p {
  margin-bottom: 15px;
  font-size: 0.937em;
  text-align: justify;
}  
#main-contents #about .inblock .text p span {
  display: inline;
}

  
/* next */
#main-contents #oaNext {
  padding: 10% 6% 8% 6%;
}
#main-contents .ribbonTtl {
  width: 200px;
}
#main-contents #oaNext .oaImg {
  margin-bottom: 10px;
}
#main-contents #oaNext .oaTtl {
  font-size: 1.125em;
}  
#main-contents #oaNext .oaData {
  font-size: 0.875em;
}  
  
  
}