@charset "UTF-8";
div, p, ul, li, table, table tr td, table tr th, nav, footer { -webkit-box-sizing: border-box; box-sizing: border-box; }

/*
h2, h3, dl dt, nav > ul li {
	font-feature-settings: "palt";
	letter-spacing: 0.08em;
}
*/
html { font-size: 62.5%; /* 10px */ }

body { font-family: source-han-sans-japanese, "Noto Sans JP", "Helvetica Neue", Helvetica, Arial, Verdana, Roboto, 游ゴシック, "Yu Gothic", 游ゴシック体, YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; text-align: center; line-height: 1.8; word-break: break-all; font-size: 1.6em; color: #1a1a1a; -webkit-text-size-adjust: 100%; /*スマホを横向きにした時用*/ background: #ffd202; letter-spacing: 0.06em; overflow-x: hidden; }

a { color: #fa508b; }

a:hover { text-decoration: none; }

a.mouse_over { -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; }

a.mouse_over:hover { opacity: 0.7; }

.bold { font-weight: 900; }

.f-small { font-size: 1.2rem; }

.f-middle { font-size: 1.4rem; }

.f-large { font-size: 2rem; }

.f-xlarge { font-size: 2.2rem; }

/* -------------------------------------------------------------------------------------------------------------------
TOP
------------------------------------------------------------------------------------------------------------------- */
#top img.logo { width: 65%; margin: 40px auto 10px; }

#top img.onair { width: 70%; margin: 0 auto 20px; }

#wrap { max-width: 850px; margin-left: auto; margin-right: auto; }

#wrap img { width: 100%; }

h2 { width: 92%; margin: 0 auto; background: url(../img/h2_bg.png) no-repeat top; background-size: 100%; color: #FFF; padding: 6px 0 6px; font-size: 18px; letter-spacing: 0.08em; }

h2 img { width: 50%; max-width: 180px; }

/* -------------------------------------------------------------------------------------------------------------------
youtube
------------------------------------------------------------------------------------------------------------------- */
#youtube_wrap { width: 92%; margin: 0 auto 40px; }

#youtube { position: relative; padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/ height: 0; overflow: hidden; }

#youtube iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

/* -------------------------------------------------------------------------------------------------------------------
intro
------------------------------------------------------------------------------------------------------------------- */
#intro { width: 92%; margin: 0 auto 10px; padding-top: 20px; }

/* -------------------------------------------------------------------------------------------------------------------
about
------------------------------------------------------------------------------------------------------------------- */
#about { width: 92%; margin: 0 auto 40px; padding: 0 0 20px; background: #FFF; border-left: 5px solid #000; border-right: 5px solid #000; border-bottom: 5px solid #000; }

#about img.about_txt { width: 80%; margin: 20px auto; }

/* -------------------------------------------------------------------------------------------------------------------
odairei
------------------------------------------------------------------------------------------------------------------- */
#odairei { width: 90%; margin: 0 auto; }

/* -------------------------------------------------------------------------------------------------------------------
cast
------------------------------------------------------------------------------------------------------------------- */
#cast { width: 92%; margin: 0 auto 20px; padding: 0 0 20px; background: #FFF; border-left: 5px solid #000; border-right: 5px solid #000; border-bottom: 5px solid #000; }

#cast ul { width: 90%; margin: 0 auto 0; padding-top: 20px; letter-spacing: -0.5em; }

#cast ul li { position: relative; display: inline-block; width: 50%; letter-spacing: normal; margin-bottom: 20px; }

#cast ul li:nth-of-type(odd) { padding-right: 2%; }

#cast ul li:nth-of-type(even) { padding-left: 2%; }

#cast ul li:nth-of-type(5) { margin-bottom: 0; }

#cast ul li:nth-of-type(6) { margin-bottom: 0; }

#cast ul li img { border: 1px solid #ccc; }

#cast ul li img.name { width: 80%; max-width: 180px; padding-top: 5px; border: none; }

#cast ul li img.job { position: absolute; top: -10px; right: 0; width: 30%; max-width: 68px; -webkit-transform: rotate(8deg); -ms-transform: rotate(8deg); transform: rotate(8deg); border: none; }

@media screen and (min-width: 960px) { #cast { margin-bottom: 100px; border-left: 10px solid #000; border-right: 10px solid #000; border-bottom: 10px solid #000; }
  #cast ul { width: 90%; margin: 0 auto 20px; padding-top: 50px; }
  #cast ul li { display: inline-block; width: 300px; letter-spacing: normal; margin: 20px auto; }
  #cast ul li:nth-of-type(odd) { padding-right: 25px; padding-left: 25px; }
  #cast ul li:nth-of-type(even) { padding-right: 25px; padding-left: 25px; }
  #cast ul li img.job { top: -15px; right: -3px; max-width: 80px !important; } }

#chuun_info { width: 92%; margin: 0 auto 30px; }

/* -------------------------------------------------------------------------------------------------------------------
footer                                                                                                       
------------------------------------------------------------------------------------------------------------------- */
footer { width: 100%; text-align: center; font-size: 0.8em; line-height: 1.5; padding: 2rem 0 0; }

footer .footer-inner { width: 100%; margin: 0 auto; }

footer .copyright { clear: both; padding: 35px 0; }

footer .copyright a { display: block; text-decoration: none; }

footer .copyright a:hover { opacity: 0.7; -webkit-transition: 0.2s; -o-transition: 0.2s; transition: 0.2s; }

@media screen and (min-width: 960px) { footer { padding: 30px 0 0; }
  footer .copyright a { color: #1a1a1a; } }

div#haro_root_element { overflow: hidden; }

.sns-archive { max-width: 1100px; margin: 0 auto !important; padding: 20px 0 !important; width: 90%; font-family: source-han-sans-japanese,sans-serif; font-weight: 400; font-style: normal; background: transparent !important; -webkit-box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0) !important; box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0) !important; }

/* -------------------------------------------------------------------------------------------------------------------
Tablet&SP                                                                                                        
------------------------------------------------------------------------------------------------------------------- */
@media screen and (max-width: 959px) { .pc { display: none; }
  .sp { display: block; } }

/* -------------------------------------------------------------------------------------------------------------------
961px-                                                                                                           
------------------------------------------------------------------------------------------------------------------- */
@media screen and (min-width: 960px) { .pc { display: block; }
  .sp { display: none; }
  .f-small { font-size: 1.4rem; }
  .f-middle { font-size: 1.6rem; }
  #top img.logo { max-width: 480px; margin: 60px auto 25px; }
  #youtube_wrap { margin: 40px auto 80px; }
  h2 { padding: 10px 0 10px; }
  h2 img { width: 50%; max-width: 240px; }
  #about { border-left: 10px solid #000; border-right: 10px solid #000; border-bottom: 10px solid #000; margin: 0 auto 80px; padding: 0 0 40px; }
  #about img.about_txt { width: 72%; margin: 20px auto; }
  #intro { margin: 0 auto 20px; padding-top: 40px; }
  #chuun_info { margin: 20px auto 80px; } }
