@charset "UTF-8";

/* #=#=#=#=#=#=#=#=#=#=#=#=#=#=#=#=#=#=#=#=# PC・スマホ 共通設定 #=#=#=#=#=#=#=#=#=#=#=#=#=#=#=#=#=#=#=#=# */

/* L1 ######################################## プロフィール ######################################## */

#request {
	position: relative;
	width: 1024px;
	margin: 0 auto;
}

#request h2 {
	position: relative;
	float: left;
	color: #ffffff;
	margin-bottom: 5px;
	padding: 0.4em 20px;
	font-family: "Century Gothic", "メイリオ", "Trebuchet MS";
	font-size: 1.8rem;
	font-weight: normal;
	line-height: 1.0;
	letter-spacing: 0.2em;
	
	border-radius: 22px;
	background: rgba(0, 0, 0, 0.85);
}
#request h2::before {
	content: "\f05a";
	margin-right: 6px;
	font-family: "FontAwesome";
}
#request h2::after {
	content: "－ リクエストガイド －";
	margin-left: 6px;
	color: #ffffff;
	font-family: "メイリオ", "Meryo", "HiraKakuProN-W3", "MS UI Gothic", "ＭＳ Ｐゴシック", "Osaka", sans-serif;
	font-size: 1.2rem;
	letter-spacing: 0;
}

html[lang="en"] #request h2::after {
	display: none;
}

/* L2 ****************************** リスト ****************************** */

#programs ul.category {
	text-align: center;
	margin: 2em 0;
}

#programs ul.category li {
	display: inline-block;
	position: relative;
	cursor: pointer;
	margin: 1px;
	padding: 0.8em 15px;
	color: #336699;
	font-size: 1.4rem;
	text-align: center;
	line-height: 1.2;
	vertical-align: middle;
	border: 1px solid #cccccc;
	background: #ffffff;
	
	border-radius: 5px;
	box-shadow: inset -4px -4px 12px rgba(0, 0, 0, 0.06);
	box-sizing: border-box;
}


#programs ul.category li::before {
	display: none;
}

#programs li span {
	display: block;
	text-align: left;
}


/* L2 ****************************** 番組情報 ****************************** L2*/

#programs {
	clear: both;
	position: relative;
	padding: 2em 4%;
	
	background: rgba(255, 255, 255, 0.85);
}

#programs h3 {
	display: none;
}

p[id^="tv"].title strong::before {
	content: "\f26c";
	font-family: "FontAwesome";
	margin-right: 0.3em;
}

p[id^="radio"].title strong::before {
	content: "\f1eb";
	font-family: "FontAwesome";
	margin-right: 0.3em;
}

#programs p.program {
	color: #666666;
	font-size: 1.8rem;
	font-weight: bold;
}

#programs p[class^="type"] {
	font-size: 1.6rem;
}

#programs p[class^="type"]::before {
	display: inline-block;
	margin-right: 0.6em;
	width: 7em;
	padding: 5px;
	color: #ffffff;
	font-size: 70%;
	text-align: center;
	line-height: 1.0;
	vertical-align: middle;
	white-space: nowrap;
	border-radius: 5px;
}

#programs p.type-form::before {
	content: "メールフォーム";
	background: #336699;
}
#programs p.type-mail::before {
	content: "メール形式";
	background: #336699;
}
#programs p.type-link::before {
	content: "番組一覧";
	background: #cc6600;
}

#programs p.website {
	margin-top: 0.3em;
}
#programs p.website::before {
	content: "\f0c1";
	font-family: "FontAwesome";
	margin-right: 0.6em;
}

#programs ul li + li {
	margin-top: 1.4em;
}

#programs ul + p.section-L1 {
	margin-top: 2em;
}

#programs p.group {
	margin-top: 2.5em;
	margin-bottom: 2.5em;
	text-align :center;
}

#programs p.group em {
	display: inline-block;
	position: relative;
	z-index: 2;
	padding: 0 1em;
	color: #777777;
	font-family: "Ubuntu Condensed", sans-serif;
	font-size: 2.0rem;
	font-style: normal;
	letter-spacing: 0.2em;
	white-space: nowrap;
}
#programs p.group em::before,
#programs p.group em::after {
	content: '';
	position: absolute;
	top: 50%;
	width: 300px;
	height: 1px;
}
#programs p.group em::before {
	right: 100%;
	
	background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
	background-image: -moz-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
	background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
	background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
}
#programs p.group em::after {
	left: 100%;
	
	background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0));
	background-image: -moz-linear-gradient(left, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0));
	background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0));
	background-image: linear-gradient(to right, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0));
}


/* #=#=#=#=#=#=#=#=#=#=#=#=#=#=#=#=#=#=#=#=# PC・スマホ 共通設定 ここまで #=#=#=#=#=#=#=#=#=#=#=#=#=#=#=#=#=#=#=#=# */