@charset "utf-8";

/* ------------------------------------------------------------------------------------------------------ ページタイトル */

.pagettl {
	width: 100%;
	height: 70px;
	padding-top: 26px;
	background-color: #fff;
}

.pagettl h2 {
	width: 1000px;
	margin: 0 auto;
	padding: 0;
	font-size: 24px;
	font-size: 2.4rem;
	line-height: 1.0em;
	font-weight: normal;
}

.pagettl h2:before {
	padding-right: 0.7em;
	font-size: 15px;
	font-size: 1.5rem;
	color: #999;
}

.program .pagettl h2:before,
.personality .pagettl h2:before { content: "PROGRAM"; }
.timetable .pagettl h2:before   { content: "TIMETABLE"; }
.information .pagettl h2:before { content: "INFORMATION"; }
.event .pagettl h2:before       { content: "EVENT"; }
.music .pagettl h2:before       { content: "MUSIC"; }
.media .pagettl h2:before       { content: "BLOG & MEDIA"; }
.listen .pagettl h2:before      { content: "HOW TO"; }
.bousai .pagettl h2:before      { content: "PREPARATION"; }
.link .pagettl h2:before        { content: "LINK"; }



/* ------------------------------------------------------------------------------------------------------ 共通Lead */

.lead1 {
	margin: 0;
	padding: 14px 30px 12px;
	background-color: #252525;
	font-size: 16px;
	font-size: 1.6rem;
	line-height: 1.5em;
	color: #fff;
}



/* ------------------------------------------------------------------------------------------------------ 募集情報＆特別番組＆イベント情報 共通 */

/***********************************************
 投稿一覧
 ***********************************************/
.post-list {
    position: relative;
    padding: 40px 55px;
    border-top: 1px solid #e6e6e6;
    *zoom:1;

    -webkit-transition: 0.5s;
    -moz-transition: 0.5s;
    -ms-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
}
.post-list:before,
.post-list:after { content:""; display:table; }
.post-list:after { clear:both; }

.post-list:first-child {
    border-top: none;
}

.post-list .new {
    position: absolute;
    top: 30px;
    left: 40px;
}

.post-list .eyecatch {
    float: left;
}

.post-list .post-exp {
    float: right;
    width: 450px;
}

.post-list .post-exp h4 {
    margin: 0;
    padding: 0;
	font-size: 16px;
	font-size: 1.6rem;
	line-height: 1.5em;
}

.post-list .post-exp time {
    display: block;
    margin: 8px 0 16px;
	font-size: 12px;
	font-size: 1.2rem;
	line-height: 1.75em;
    font-weight: bold;
    color: #808080;
}

.post-list .post-exp div {
	text-align: justify;
	text-justify: inter-ideograph;
}

.post-list:hover {
    background-color: #ececec;
}

.post-list:hover a {
    text-decoration: underline;
    color: #0080c6;
}


/***********************************************
 投稿詳細
 ***********************************************/
.post-cover {
}

.post-cover header {
    padding: 15px 30px 15px 20px;
    background-color: #252525;
    border-left: 3px solid #fc1b1c;
    color: #fff;
}

.post-cover header h3 {
    margin: 0;
    padding: 0;
	font-size: 16px;
	font-size: 1.6rem;
	line-height: 1.25em;
}

.post-innr {
    padding: 40px 55px;
    line-height: 1.8em;
}

.post-innr img {
    height: auto !important;
}

.post-innr a {
    text-decoration: underline;
    color: #0080c6;
}

.post-innr a:hover {
    color: #fc1b1c;
}

.post-innr .img-center {
    display: block;
    margin: 0 auto;
}

.post-innr .img-left {
    float: left;
    margin-right: 20px;
    margin-bottom: 20px;
}

.post-innr .img-right {
    float: right;
    margin-bottom: 20px;
    margin-left: 20px;
}

.post-innr .post-table {
    clear: both;
    width: 100%;
    margin: 20px auto 0;
    border-collapse: collapse;
    border-spacing: 0;
    border: 1px solid #d1d1d1;
}

.post-innr .post-table th {
    width: 125px;
    padding: 15px;
    border: 1px solid #d1d1d1;
    text-align: left;
}

.post-innr .post-table td {
    padding: 15px;
    border: 1px solid #d1d1d1;
}

.post-cover .post-apply {
    padding: 0 55px 40px;
    line-height: 1.8em;
}

.post-cover .post-apply h4 {
    margin: 0;
    padding: 0;
    text-align: center;
	font-size: 20px;
	font-size: 2.0rem;
	line-height: 1.5em;
    color: #c34b4b;
}

.post-cover .post-apply a {
    width: 400px;
    height: 70px;
    margin: 10px auto 0;
    color: #fff !important;
}


/***********************************************
 リンクボタン / 申込フォーム
 ***********************************************/
#formlink {
    margin: 20px;
    text-align: center;
}

#formlink a {
    margin: 0 auto;
}

#formlink a:hover {
    filter: alpha(opacity=70);
    -moz-opacity: 0.70;
    opacity: 0.70;
}


/***********************************************
 リンクボタン / フリー
 ***********************************************/
#freelink {
	margin:20px;
	text-align:center;
	font-size:14px;
	}
  #freelink a {
	  margin:0 auto;
	  padding:12px 25px 11px;
	  background:#000;
	  border:none;
	  border-radius:3px;
	  letter-spacing:1px;
	  display:inline-block;
	  text-decoration:none !important;
	  color: #fff !important;
	  -webkit-transition: 0.5s;
	  -moz-transition: 0.5s;
	  -ms-transition: 0.5s;
	  -o-transition: 0.5s;
	  transition: 0.5s;
	  }
   #freelink a:hover {
	   background:#fc1b1c;
	  }


/***********************************************
 リンクボタン / ミュージックサロン
 ***********************************************/
#musicsalonlink{
	margin:20px;
	text-align:center;
	font-size:16px;
	}
  #musicsalonlink a {
	  margin:0 auto;
	  padding:15px 15px 14px;
	  background:#8884f6;
	  border:none;
	  border-radius:3px;
	  display:inline-block;
	  text-decoration:none !important;
	  color: #fff !important;
	  -webkit-transition: 0.5s;
	  -moz-transition: 0.5s;
	  -ms-transition: 0.5s;
	  -o-transition: 0.5s;
	  transition: 0.5s;
	  }
   #musicsalonlink a:hover {
	   background:#fc1b1c;
	  }


/* 特別告知　*/

#spc-info {
	width:90%;
	margin:20px auto !important;
	text-align:center;
	padding:10px 0;
	background:#ee0000;
	border-radius:3px;
	font-size:1.3em;
	font-weight:bold;
	color:#fff !important;
	}

/* リスト形式リンクボタン */


#free-li{
	width:86%;
	margin:0 auto;
	text-align:center;
	}

#free-li ul {
	margin:0 auto 20px;
	padding:0 0 10px;
	border-bottom:solid 1px #ccc;
	}
#free-li li {
	display:inline-block;
	list-style:none;
	}


/* 各ファイルダウンロードボタン */

  #pdf a, #xls a, #doc a {
	  display:inline-block;
	  min-width:228px;
	  position: relative;
	  margin:5px;
	  list-style:none;
	  line-height:48px;
	  border-radius:3px;
	  letter-spacing:1px;
	  text-align:center;
	  font-size:14px;
	  font-weight:bold;
	  color: #fff !important;
	  text-decoration:none !important;
	  padding:0 35px 0 40px;
	  background-repeat:no-repeat;
	  background-position:left center;
	  background-size:30px 28px;
	  -webkit-transition: 0.5s;
	  -moz-transition: 0.5s;
	  -ms-transition: 0.5s;
	  -o-transition: 0.5s;
	  transition: 0.5s;
	  }
	  
/* #pdf a:after, #xls-f a:after {
			content: "▼";
			top: 50%;
			margin-top: -0.2em;
			font-size:15px;
			margin-left:0.4em;
			color: #fff;
			} */
    #pdf a:after, #xls a:after, #doc a:after {
			content: "▼";
			position: absolute;
			top: 50%;
			right: 10px;
			margin-top: -25px;
			font-size:15px;
			color: #fff;
			}

  #pdf a {
	  background-color:#fc1b1c;
	  border:solid 1px #fc1b1c;
	  background-image:url(https://fmk.fm/common/bg_pdf-f.png);
	  }
  #pdf a:hover {
	  background-color:#fff;
	  color:#fc1b1c !important;
	  background-image:url(https://fmk.fm/common/bg_pdf-ro.png);
	  }
    #pdf a:hover:after {color:#fc1b1c !important;}

  #xls a {
	  background-color:#207347;
	  border:solid 1px #207347;
	  background-image:url(https://fmk.fm/common/bg_xls-f.png);
	  }
  #xls a:hover {
	  background-color:#fff;
	  color:#207347 !important;
	  background-image:url(https://fmk.fm/common/bg_xls-ro.png);
	  }
    #xls a:hover:after {color:#207347 !important;}
	  
  #doc a {
	  background-color:#2c5898;
	  border:solid 1px #2c5898;
	  background-image:url(https://fmk.fm/common/bg_doc-f.png);
	  }
  #doc a:hover {
	  background-color:#fff;
	  color:#2c5898 !important;
	  background-image:url(https://fmk.fm/common/bg_doc-ro.png);
	  }
    #doc a:hover:after {color:#2c5898 !important;}

  /* #pdf a:hover, #xls a:hover, #doc a:hover {
	  background-color:#222;
	  } */



/* ------------------------------------------------------------------------------------------------------ テキストボックス等 共通指定 */

textarea,
select,
input[type="text"],
input[type="date"] {
	border: 1px solid #ccc;
	outline: none;
}

textarea,
select {
	padding: 5px;
	background-color: #fff;
}

input[type="text"],
input[type="date"] { padding: 0 5px; }

textarea:focus,
select:focus,
input[type="text"]:focus,
input[type="date"]:focus {
	border: 1px solid #07abb1;
}



/* ------------------------------------------------------------------------------------------------------ 共通フォーム */

.formstyle {
    width: 100%;
    background-color: #fff;
    border-bottom: 1px solid #ccc;
}

.formstyle header {
    width: 100%;
    min-width: 700px;
    margin: 0 auto;
    border-bottom: 1px solid #ccc;
    text-align: center;
}

.formstyle header h2 {
    max-width: 700px;
    margin: 0 auto;
    padding: 40px 0 0;
    font-size: 2.0em;
	font-size: 20px;
	font-size: 2.0rem;
	line-height: 1.5em;
    color: #252525;
}

.formstyle header h3 {
    width: 280px;
    margin: 15px auto;
    padding: 5px 0;
    background-color: #e9455e;
    border-radius: 5px;
	font-size: 16px;
	font-size: 1.6rem;
	line-height: 1.5em;
    color: #fff;
}

.formstyle header p {
    margin: 30px 0;
}

.formstyle section {
    width: 700px;
    margin: 0 auto;
    padding: 40px 0;
}

.formstyle section dl {
    margin: 0 0 40px;
    padding: 0;
}

.formstyle section dl dt {
    position: relative;
    clear: left;
    float: left;
    width: 200px;
    min-height: 35px;
    margin: 0;
    padding: 6px 46px 0 0;
    text-align: right;
}

.formstyle section dl dt.req {
}

.formstyle section dl dt.req:after {
    content: "＊";
    position: absolute;
    top: 7px;
    right: 16px;
    font-weight: bold;
    color: #fc1b1c;
}

.formstyle section dl dd {
    min-height: 35px;
    margin: 0 0 20px;
    padding: 0 0 0 200px;
}

.formstyle section dl dd.p-t6 {
    padding-top: 6px;
}

.formstyle section dl dd select,
.formstyle section dl dd input[type="text"] {
    width: 100%;
    height: 35px;
}

.formstyle section dl dd textarea {
    width: 100%;
    height: 240px;
}

.formstyle section dl .btn {
    width: 400px;
    height: 70px;
    margin: 0 auto;
}


/***********************************************
 エラー表示
 ***********************************************/
p.error {
    margin: 0;
	font-size: 12px;
	font-size: 1.2rem;
	line-height: 1.5em;
    font-weight: bold;
    color: #fc1b1c;
}


/***********************************************
 確認時
 ***********************************************/
.formstyle section.formch {
}

.formstyle section.formch dl dd {
    padding-top: 6px;
}

.formstyle section.formch .formback {
    display: block;
    width: 160px;
    height: 30px;
    margin: 30px auto 0;
    background-color: #296890;
    text-align: center;
    line-height: 30px;
    color: #fff;

    -webkit-transition: 0.5s;
    -moz-transition: 0.5s;
    -ms-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
}

.formstyle section.formch .formback:hover {
    background-color: #173a50;
}

/* 送信後 */
.formstyle section.formth {
    text-align: center;
}


/***********************************************
 セレクトボックススタイル
 ***********************************************/
.easy-select-box {
    display: inline-block;
    background-color: #fff;
    border: 1px solid #ccc;
}

.easy-select-box .esb-displayer {
    padding: 0 3px;
    background-image: url(../common/selectbox_arrow.gif);
    background-position: right center;
    text-indent: 5px;
    cursor: default;
}

.easy-select-box .esb-displayer:hover {
    filter: alpha(opacity=80);
    -ms-filter: 'alpha(opacity=80)';
    opacity: 0.8;
}

.easy-select-box:hover .esb-displayer {
    text-decoration: none;
}

.easy-select-box .esb-dropdown {
    display: none;
    position: absolute;
    z-index: 999;
    background-color: #fff;
    border: 1px solid #ccc;
    overflow: auto;
}

.easy-select-box .esb-item {
    padding: 3px 7px;
    background-color: #fafafa;
    color: #0c2245;
    cursor: default;
}

.easy-select-box .esb-item:hover {
    background-color: #bbb;
    text-decoration: none;
    color: #fff;
}


/***********************************************
 共通ボタン
 ***********************************************/
.btn {
	display: block;
	width: 400px;
	height: 70px;
	margin: 0 auto;
	background-color: #c34b4b;
	background-position: center;
	border: none;
	text-indent: -9999px;
    cursor: pointer;

	-webkit-transition : all 0.5s;
	-moz-transition: all 0.5s;
	-ms-transition: all 0.5s;
	-o-transition: all 0.5s;
	transition: all 0.5s;
}

.btn:hover {
    background-color: #833232;
}

#apply    { background-image: url(../common/btn_apply.png); } /* 応募する */
#check    { background-image: url(../common/btn_check.png); } /* 確認する */
#transmit { background-image: url(../common/btn_transmit.png); } /* 送信する */



/* ------------------------------------------------------------------------------------------------------ Pagetop */

.pagetop {
	display: none;
	position: fixed;
	right: 0;
	bottom: 0;
	z-index: 99;
	width: 60px;
	height: 60px;
}

.pagetop a {
	display: block;
	height: 100%;
	background-image: url(../common/btn_pagetop.gif);
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;

	filter: alpha(opacity=80);
	-moz-opacity: 0.8;
	opacity: 0.8;

	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	-ms-transition: 0.5s;
	-o-transition: 0.5s;
	transition: 0.5s;
}
	
.pagetop a:hover {
	filter: alpha(opacity=100);
	-moz-opacity: 1.0;
	opacity: 1.0;
}



/* ------------------------------------------------------------------------------------------------------ Bottom Navi */

.bottomnavi {
	margin-top: 10px;
	padding: 20px 0;
	background-color: #fff;
	text-align: center;
}

.bottomnavi a {
    display: block;
}

.bottomnavi .hback {
    width: 160px;
    margin: 0 auto;
    background-color: #296890;
    line-height: 40px;
    color: #fff;
}

.bottomnavi .hback:hover {
	background-color: #173a50;
}











/***********************************************
 共通hover
 ***********************************************/

.linkhover {
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	-ms-transition: 0.5s;
	-o-transition: 0.5s;
	transition: 0.5s;
}

	.linkhover:hover {
		filter: alpha(opacity=50);
		-moz-opacity:0.5;
		opacity: 0.5;
	}


/***********************************************
 FMKラベル
 ***********************************************/

#fmklbl {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 999;
	width: 100%;
	height: 30px;
	background-color: #252525;
	background-image: url(../common/img_fmklogo_S.png);
	background-position: 15px center;
	background-repeat: no-repeat;
}

	#fmklbl ul {
		margin: 0;
		padding: 0;
		list-style: none;
		text-align: right;
		letter-spacing: -0.4em;
		/*font-size: 0.9em;*/
	}

	#fmklbl li {
		display: inline-block;
		width: 100px;
		text-align: center;
		letter-spacing: normal;
		overflow: hidden;
	}

		#fmklbl li a {
			display: block;
			height: 30px;
			line-height: 30px;
			color: #fff;
			
			-webkit-transition: background-color 0.5s;
			-moz-transition: background-color 0.5s;
			-ms-transition: background-color 0.5s;
			-o-transition: background-color 0.5s;
			transition: background-color 0.5s;
		}

			#fmklbl li a:hover {
				background-color: #fc1b1c;
				text-decoration: none;
			}


@media screen and (max-width: 768px) {

#fmklbl {
	position: static;
	z-index: 0;
	width: 100%;
	height: auto;
	background-image: none;
}

	#fmklbl ul {
		width: 100%;
	}

	#fmklbl li {
		display: block;
		float: left;
		width: 50%;
		background: #ccc;
	}

	#fmklbl li + li {
		background-color: #bbb;
	}

		#fmklbl li a {
			height: 40px;
			line-height: 40px;
			color: #333;
		}

}



/* ------------------------------------------------------------------------------------------------------ class */

.clearfix:before,
.clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom:1; }

.clear { clear: both; }
.none  { display: none; }
.nobr  { }


@media screen and (max-width: 768px) {

.nobr	{
	display: none;
}

}



/* ------------------------------------------------------------------------------------------------------ Font Size  */

.fsmall { font-size: 0.9em; }



/* ------------------------------------------------------------------------------------------------------ Font Color */

.red { color: #fc1b1c; }



/* ------------------------------------------------------------------------------------------------------ Font Style */

.bold    { font-weight: bold; }
.italic  { font-style: italic; }
.dn      { text-decoration: none; }
.through { text-decoration: line-through; }



/* ------------------------------------------------------------------------------------------------------ text align */

.txt-right  { text-align: right; }
.txt-center { text-align: center; }
.txt-left   { text-align: left; }



/* ------------------------------------------------------------------------------------------------------ Width */

.w45 { width: 45px !important; }
.w55 { width: 55px !important; }



/* ------------------------------------------------------------------------------------------------------ Margin */

.m-t10 { margin-top: 10px; }