@charset "utf-8";
/* CSS Document */

@import url(https://fonts.googleapis.com/earlyaccess/mplus1p.css);
html {
  background: none;
  background: url("../images/bg.jpg") repeat;
  background-size: 256px 257px;
  animation: none
}

body {
  font-family: "ten-mincho", serif
}

.firstView {
  display: flex;
  display: -webkit-flex;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap
}

.firstView .main {
  width: 50%
}

@media screen and (max-width: 768px) {
  .firstView .main {
    width: 100%
  }
}

.firstView .main h1 {
  text-indent: -9999px;
  display: block;
  background: url("../images/logo_tate.svg") no-repeat;
  background-size: auto 100%;
  width: 125px;
  height: 400px;
  margin: 50px auto 10px auto
}

@media screen and (max-width: 768px) {
  .firstView .main h1 {
    margin: 10px auto;
    background: url("../images/logo_yoko.svg") no-repeat;
    width: calc(100% - 20px);
    height: 140px;
    margin: 20px auto 500px auto
  }
}

.firstView .main .onair {
  font-size: 24px;
  text-align: center;
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
  width: 400px;
  margin: 20px auto;
  padding: 10px 0
}

@media screen and (max-width: 768px) {
  .firstView .main .onair {
    width: calc(100% - 20px);
    margin: 0 auto;
    font-size: 18px
  }
}

.firstView .main .onair+p {
  width: 400px;
  margin: 20px auto
}

@media screen and (max-width: 768px) {
  .firstView .main .onair+p {
    width: calc(100% - 20px);
    margin: 20px auto
  }
}

.firstView .main p {
  font-size: 13px;
  line-height: 1.5em
}

.firstView .main .themeSong {
  display: flex;
  display: flex;
  -webkit-flex-wrap: nowrap;
  flex-wrap: nowrap;
  margin-bottom: 20px
}

.firstView .main .themeSong div {
  width: 50%
}

.firstView .main .themeSong div img {
  width: 100%
}

.firstView .main .themeSong dl {
  width: 50%;
  padding: 20px;
  display: flex;
  display: -webkit-flex;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-line-pack: center;
  align-content: center
}

.firstView .main .themeSong dl dt {
  width: 100%;
  font-size: 16px;
  padding-bottom: 20px
}

.firstView .main .themeSong dl dd {
  width: 100%;
  font-size: 14px
}

.firstView .yuukaMV {
  width: 50%
}

@media screen and (max-width: 768px) {
  .firstView .yuukaMV {
    width: calc(100% - 20px);
    margin: 0 auto;
    position: absolute;
    top: 400px
  }
}

.firstView .yuukaMV img {
  width: 100%
}

.cntArea {
  color: #FFF;
  letter-spacing: .1em
}

.cntArea .tab {
  display: flex;
  display: flex;
  -webkit-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between
}

.cntArea .tab li {
  font-size: 25px;
  background: #979797;
  text-align: center;
  padding: 20px;
  width: 100%;
  letter-spacing: .1em;
  transition: .2s
}

.cntArea .tab li:hover {
  background: #333;
  transition: .2s
}

.cntArea .tab li.active {
  background: #000
}

.cntArea .cntBlock {
  background: #000;
  color: #FFF;
  position: relative;
  width: 100%;
  min-height: 260px;
  display: flex;
  display: -webkit-flex;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap
}

.cntArea .cntBlock section {
  position: absolute;
  padding: 50px;
  line-height: 1.5em;
  display: none;
  background: #000
}

@media screen and (max-width: 768px) {
  .cntArea .cntBlock section {
    padding: 20px
  }
}

.cntArea .cntBlock section.active {
  display: block
}

.cntArea .cntBlock section strong {
  font-size: 36px
}

.cntArea .cntBlock section p {
  font-size: 16px;
  line-height: 1.5em
}

.spEvent {
  text-align: center;
	margin: 2.5em 0;
}

.spEvent h2 {
  /*font-size: 25px;
  margin: 1.5em*/
	font-size: 24px;
  width: 900px;
  margin: 20px auto;
  padding: 10px 0;
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
  text-align: center
}

.spEvent h3 {
  font-size: 21px;
  margin: 1em 0
}

.spEvent h4 {
  font-size: 16px;
  color: #BF272D;
  margin-bottom: 1em
}

.spEvent p {
  font-size: 16px;
  margin-bottom: 1em
}

.spEvent .w100per {
  width: 100%
}

.spEvent .w100per img {
  width: 100%
}

.spEvent .flex_2 {
  display: flex;
  display: -webkit-flex;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap
}

.spEvent .flex_2 div {
  width: 420px;
  padding: 10px;
  margin: 20px
}
.spEvent .flex_2 div img {
  width: calc(100% - 20px);
  border: 10px solid #FFF;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.2)
}
.spEvent .guest img {
  width: 50%;
	border: 10px solid #FFF;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.2);
	} 
.spEvent .ev-bnr img {
  width: 50%;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.2);
	} 

@media screen and (max-width: 768px) {
  .spEvent h2 {
    width: calc(100% - 20px);
    font-size: 18px;
    margin: 20px auto;
		}
	.spEvent .guest img,.spEvent .ev-bnr img {
    width: calc(100% - 20px);
	}
}


.message {
  display: flex;
  display: -webkit-flex;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center
}

.message h2 {
  font-size: 24px;
  width: 900px;
  margin: 20px auto;
  padding: 10px 0;
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
  text-align: center
}

@media screen and (max-width: 768px) {
  .message h2 {
    width: calc(100% - 20px);
    font-size: 18px;
    margin: 20px auto
  }
}

.message div {
  width: 50%
}

@media screen and (max-width: 768px) {
  .message div {
    width: 100%
  }
}

.message div a.button {
  display: block;
  background: #95001a;
  color: #FFF;
  font-size: 16px;
  text-align: center;
  transition: .2s;
  padding: 1em 0;
  width: calc(100% - 120px);
  margin: 0 auto
}

.message div a.button:hover {
  background: #333;
  transition: .2s
}

@media screen and (max-width: 768px) {
  .message div a.button {
    margin: 20px auto;
    width: calc(100% - 20px)
  }
}

.message div img {
  width: 100%;
  display: block;
  margin: auto
}


.omoide-yuuka{
  display: flex;
  flex-direction: column;
  }
.omoide-yuuka .logo-kaku{
  width: 25%;
  margin: 1em auto;
  }
.omoide-yuuka .logo-omo{
  width: 50%;
  margin: 0em auto 1em;
  }
.omoide-yuuka p{
  font-size: 1.5em;
  }
.omoide-yuuka p.rev{
  font-size: 3em;
  font-weight: bolder;
  margin-top: 0.5em;
  color: #eb6100;
  transform: rotate(-10deg);
  -moz-transform: rotate(-10deg);
  -webkit-transform: rotate(-10deg);
  }
@media screen and (max-width: 768px) {
  .omoide-yuuka .logo-kaku{width:70%;}
  .omoide-yuuka .logo-omo{width:100%;}
  .omoide-yuuka p{font-size:1.15em;}
  .omoide-yuuka p.rev{font-size:1.75em;}
  }
	
/* 動画埋込
--------------------------------------------------------- */
.movieBox{
  max-width:52%;
  padding:2px;
  margin:0 auto 24px;
  color:#FFF;
	}
.youtube{
  position:relative;
  width:100%;
  padding-top:56.25%;
	}
.youtube iframe {
  position:absolute;
  top:0;right:0;
  width:100% !important;
  height:100% !important;
	}
@media screen and (max-width: 768px) {
.movieBox{max-width:100%;}
}
.fontS{font-size:0.8em;}
.fontM{font-size:1.2em}
.fontMM{font-size:1.3em; line-height:1.6em;}
.fontL{font-size:1.5em;line-height:1.8}
.fontLL{font-size:2em}


/*# sourceMappingURL=kakuuchiYuuka.css.map */