﻿/* ----- スマホ試聴ページ用 ----- */


@charset "utf-8"; /*文字コード指定*/

/* ----- css reset(各ブラウザで指定されているスタイルを初期化)と全体設定 ----- */

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, form, input, textarea, p, th, td, img {
	margin: 0; /*ボックス外側の余白(値1つは上下左右をまとめて指定)*/
	padding: 0; /*ボックス内側の余白(値1つは上下左右をまとめて指定)*/
	border: 0; /*境界線指定*/
	outline:none;
}

body {
	line-height: 1.7;	/*行の高さ指定(数値のみの場合はfont-sizeの倍数)*/
	font-family: "メイリオ", Meiryo, "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro"; /*フォントの種類指定(左から優先順位)*/
	font-size: 85%; /* フォントサイズ指定(%はブラウザに設定した標準文字サイズ(通常16px)に対する値)*/
	color: #333; /*文字色指定*/
}

ol, ul {
	list-style: none; /*リストマーカーの種類指定(noneはなし)*/
}

a { /*リンクの文字設定(マウスをのせる前)*/
	color: #205faa; 
	text-decoration: none; 
}

a:hover { /*リンクの文字設定(マウスをのせた時)*/
	color: #3333ff; 
	text-decoration: none; 
}

a:active { color:#3355ff; text-decoration:none;}

/*------------------------------------------------------------
	ヘッダー
------------------------------------------------------------*/

#header {
	width:100%;
	overflow:hidden;}
}



#logo_top {
	position: absolute; /*ボックスの配置方法(absoluteは絶対位置配置)*/
	left: 0; /*左からの距離(positionで指定している場合に適用)*/
	top: 0; /*上からの距離(positionで指定している場合に適用)*/
}

#logo img {
              opacity: 0.95;
              float: left;
              margin-left: 7px;  
              margin-top: 0px; 
              width: 148px;
              height: 26px;

}


/*------------------------------------------------------------
	プルダウンメニュー
------------------------------------------------------------*/

/****メニュー全体****/
#menu{
	/*配置*/
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	pointer-events: none;
	z-index: 100;
}

/****メニュー開閉ボタン****/
#menu div{
	/*デザイン*/
	width: 32px;
	height: 32px;
	background: #ffffff;
	/*配置*/
	overflow: hidden;
	position: absolute;
	top: 0;
	right: 0;
}

#menu .menuopen{
	/*デザイン*/
	color: #363636;
	font-size: 20px;
	/*配置*/
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 2px;
	right: 5px;
	pointer-events: auto;
}

#menu .menuclose{
	/*デザイン*/
	color: #363636;
	font-size: 20px;
	/*配置*/
	display: none;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 3px;
	right: 5px;
	pointer-events: auto;
}

/****メニュー一覧****/
#menu ul{
	/*デザイン*/
	background: #ffffff;
	width: 58%;
	/*配置*/
	position: absolute;
	top: 30px;
	right: 0;
}

#menu li{
	/*アニメーション*/
	-webkit-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
	/*デザイン*/
	padding: 0 10px;
	color: #36263e;
	font-size: 15px;
	font-weight: bold;
	border-bottom: 0px #eee solid;
	height: 0;
	/*配置*/
	overflow: hidden;
	pointer-events: auto;
}

#menu li a {
	color: #16160e;
              display: block;
}

#menu li a:hover {
	color: #66f;
	text-decoration: none;
	background: #eee;
}


/****メニューオープン時****/
#menu:target .menuopen{
	/*配置*/
	display: none;
}

#menu:target .menuclose{
	/*配置*/
	display: block;
}

#menu:target li{
	/*デザイン*/
	padding: 10px;
	height: 26px;
	border-bottom: 1px #eee solid;
}

/*------------------------------------------------------------
	本文
------------------------------------------------------------*/

/* ----- レイアウト ----- */

#container { /*container(入れ物、容器)の中に各要素(ボックス)を配置*/
	width: 100%; /*幅指定(100%は画面横幅いっぱいに表示)*/
	margin: auto; /*ボックス外側の余白(autoはボックス幅や隣接する他ボックス幅による自動余白割り当て)*/
	background-color:#fff; /*背景色指定*/
}

#container a:hover img { /*画像にマウスをのせた時半透明にする*/
	filter: Alpha(opacity=70); /*視覚効果(IE独自) Alphaは透過表示 opacityは開始透明度*/
	opacity: 0.7; /*要素の透明度*/
}


/* ----- フレーム ----- */


#music_video {
      width: 100%;
      height: 250px;
      border: 0px;
      margin: 0px;
      display: block;
    }


/* ----- コンテンツ ----- */

.post {
	clear: both; /*floatの回り込みを解除*/
	width: auto; /*幅指定(autoは初期値に戻す)*/
}

.post h1{
	color: #333333; 
	font-size: 75%; 
	padding-top: 2px; 
	padding-right: 7px; 
	padding-bottom: 18px;
}

.post h2 {
	margin: 0; /*ボックス外側の余白(値1つは上下左右をまとめて指定)*/
	font-size: 1.1em; 
	line-height: 28px; 
	border-bottom: solid 1px #ddd; 
	margin-bottom: 20px; 
	padding-left: 10px;
	padding-top: 4px;
}

.post h3 {
	margin: 0; 
	font-size: 1em; 
	line-height: 30px; 
	border-bottom: solid 1px #cccccc; 
	margin-bottom: 8px; 
}

.post ul {
	margin-top: 3px; 
	margin-bottom: 5px; 
	font-size: 9pt; 
	color: #666; 
	padding-left: 5px; 
	padding-right: 8px; 
}

.post ul li {
	padding-left: 5px; /*ボックス内側左の余白*/
	padding-right: 5px; /*ボックス内側右の余白*/
}

/* ----- 挿絵 ----- */

.image_a img {
      width: 172px;
      height: 80px;
      margin-top: 15px; 
      margin-left: 0px; 
      margin-bottom: 0px; 
      opacity: 1; /*要素の透明度*/
}

.image_b img {
      width: 100%;
      height: auto;
     margin-top: 20px; 
     margin-left: 0px; 
     margin-bottom: 50px; 
}


.disc ul {
	margin-top: 3px; 
	margin-bottom: 5px; 
	font-size: 10pt; 
	color: #666; 
	padding-left: 10px; 
	padding-right: 8px; 
}

.haishin {
	line-height: 25px; 
	font-size: 13px;
	font-weight: normal;
        width: auto; 
        margin-top: 15px; 
        margin-left: -15px; 
        margin-bottom: 26px; 
  text-align: center;
}

.haishin a {
	color: #7a9090; 
	text-decoration: none; 
}

.haishin a:active { color:#77aaaa; text-decoration:none;}


/* ----- MVコンテンツ ----- */

.newlist {
	margin: 0px; /*ボックス外側下の余白*/

}

.newlist dl {
	width: auto; /*幅指定(autoは初期値に戻す)*/
	height: 210px; 
	overflow: auto; 
	padding-left: 10px; 
	padding-right: 10px; 
	text-align: left; /*行の水平方向の揃え方(leftは左寄せ)*/
}

.newlist dd {

	margin: 5px 10px 0px 5px; /*ボックス外側の余白(左から上,右,下,左)*/
	font-size: 9pt; 
	line-height: 1.4em; 
	color: #666; 
	padding-top: 5px;
}

.newlist dt {
	color: #333; 
	font-size: 10pt; 
	line-height: 1.2em; 
	font-weight: 600;
	margin-bottom: 5px; 
	padding-left: 5px;
	padding-top: 4px;
}


.newlist img {
    width: 120px;
    height: 68px; 
    border: 1px solid #aaaaaa;
    border-radius: 2px;
    float: left;
    margin-left: 5px; 
    margin-right: 10px; 
    margin-bottom: 5px; 
}

/* ----- クロスフェード ----- */

 .crossfade {
	overflow-x: auto; 
	white-space: nowrap; 
              width: auto; 
              height: 100px; 
              background-color: #fff;
              margin-left: 3px; 
              margin-right: 3px; 
}


.item {
    display: inline-block;
    width: 120px;
    height: 68px; 
    margin: 0px; 

}

.item img {
    border: 1px solid #aaaaaa;
    border-radius: 2px;
}


/* ----- フッター(ページの一番下の部分) ----- */

#footer {
	clear: both; /*floatの回り込みを解除*/
	height: 30px; 
	width: auto; 
	font-size: 0.7em; 
}

#footer p {
	float: right; 
	padding-right: 5px; 
}

/* ----- フッターメニュー ----- */

#footmenu {
	float: left; 
}

#footmenu li {
	padding-left: 12px; 
	display: inline; /*要素の表示形式指定(inlineはインラインレベルで表示(リストを横並び))*/
	list-style-type: none; /*リストマーカーの種類指定(noneはなし)*/
}

