@charset "utf-8";
/*** skin03 ***/

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

/* 全体背景色 */
body, article, #stormFrame{
	background-color: #FFFFFF;
}

.indexHover{color:#fff!important;}
.naviRollOver:active,.noviRollOver:hover{
	background-color: #4165B1;}

.naviRollOver.naviHover{
	background-color:#A0B2D8 !important;
	-webkit-transition: border-color 0.5s ease-out, background-color 0.5s ease-out;
	-moz-transition: border-color 0.5s ease-out, background-color 0.5s ease-out;
	transition: border-color 0.5s ease-out, background-color 0.5s ease-out;
}

#stormHeader{
	border-bottom: 1px solid transparent;
	-webkit-box-shadow: 0 5px 3px -3px rgba(0,0,0,.12);
	box-shadow: 0 4px 3px -3px rgba(0,0,0,.12);
}

/*右スペース共通背景色
------------------------------------------------------------*/
#tablet-pc.landscape #stormImage,#stormNav2,#stormChapter,#stormScript,#stormNote,
#chapter_bottom,#script_bottom,#note_bottom{
	background-color: #fff;
}

/*------------------------------------------------------------
タイトル
------------------------------------------------------------*/
.titleBGColor{background-color: #fff;}
.titleFontColor{color:#333;}

/*------------------------------------------------------------
スライド背景
------------------------------------------------------------*/
#stormSlide{background-color: #eee;}

/*------------------------------------------------------------
テロップ
------------------------------------------------------------*/
.telopFontColor{color:#333;}
.telopBGColor{background-color: #fff;}

/*------------------------------------------------------------
スライダー
------------------------------------------------------------*/
#stormOperationboard{
	background-color: #fff;
	color:#333;}

#stormOperationboard #indexInfo {
	background-color: rgba(255, 255, 255, 0.5);
}

.slideMode #stormOperationboard{
	background-color: rgba(255,255,255,.8);
}

.js-mark,.js-markarea,.js-progress,.js-handle{top:0;}
.js-base,.js-base,.js-handle,.js-progress,.js-mark,.js-markarea{height: 7px;}

.js-base{
	background-color: #ccc;
	border: none;
}
.js-mark{background-color: #fff;}
.js-progress{
	background:#4a66a5;
	-webkit-box-shadow: 0 0 0;
	box-shadow: 0 0 0;
}

#phone .js-base{border-bottom:none!important;}

/*------------------------------------------------------------
コントローラー
------------------------------------------------------------*/

#stormNav{ border-top: 2px solid #fff;}
.naviBGColor{background-color: #fff;}

/*ボタン画像位置調整------------------------------------------------------------*/


/*スピード調整ボタン設定---------------------------------------------------------*/

#speedBtn #speedBtnBox {
	border: 2px solid #444;
	background-color: rgba(0,0,0,0.0);
	box-shadow: 0 0 0;
}
#speedBtn #speedBtnLabel{color:#444;text-shadow:0 0 0;}
#speedBtn.naviHover #speedBtnLabel{color:#fff;}
#speedBtn.naviHover #speedBtnBox {border-color:#fff;}

.speedPanel_portrait li{background-color: #fff;
color:#333;}

/*------------------------------------------------------------
右ブロック
------------------------------------------------------------*/

/*ビデオ
---------------------------------*/
#stormVideo{background-color: #efefef;}

/*フリースペース
-------------------------------*/
#phone #stormImage{background-color: #fff;}

/*------------------------------------------------------------
INDEX/NOTE表示ナビゲーション stormNav2
------------------------------------------------------------*/

#stormNav2_bg{
	position: absolute;
	left:5px;
	right:5px;
	top:10px;
	bottom:0;
}

#stormNavCol2_2 .navBtnImg,#stormNavCol2_3 .navBtnImg{
	display: inline-block;
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
	line-height: 32px;
	color:#333;
	font-size: 13px;
	font-weight: bold;
	background-image: none;
	text-indent: 0%;
	white-space: normal;
	overflow: visible;
}

#stormNavCol2_2 .naviHover .navBtnImg,
#stormNavCol2_3 .naviHover .navBtnImg{
	color:#fff;
}

/*PCのみ-----------------------------------------------------------*/

#tablet-pc #stormNavCol2_2,#tablet-pc #stormNavCol2_3{
	box-sizing:border-box;
	width: 50%;
}

#tablet-pc #stormNavCol2_2 .navBtnImg, #tablet-pc #stormNavCol2_3 .navBtnImg{
	height: 32px;
}

#tablet-pc #indexBtn2,#tablet-pc #noteBtn{
	border-bottom: 1px solid #333
}

#tablet-pc #indexBtn2.naviSelected,#tablet-pc #noteBtn.naviSelected{
		/*border-bottom: 5px solid #4a66a5;*/
		background-color: #fff;
		-webkit-box-shadow:0 -4px #4a66a5 inset;
		box-shadow: 0 -4px #4a66a5 inset;
}

#indexBtn2.naviSelected .navBtnImg,#noteBtn.naviSelected .navBtnImg{color:#4a66a5;}

/*------------------------------------------------------------
チャプターの表示
------------------------------------------------------------*/
#stormChapter,#stormScript,#stormNote{
	box-sizing:border-box;
	padding: 10px; 
}

#stormChapter .list li{
	padding: 5px 10px 5px 0;
	margin-bottom: 4px;
	/*background-color: rgb(238,238,238);*/
	background-color: #fff;
	border: none;
}

#stormChapter .list li:nth-child(even){
	border: none;
	background-color: #fff;
}

#stormChapter .list li.active{background-color: #4a66a5;}
/*#stormChapter .list li.indexHover{color: #fff!important;}*/

/* スクリプト */
#stormScript .list li{
	padding: 5px 10px 5px 0;
	margin-bottom: 4px;
	/*background-color: rgb(238,238,238);*/
	background-color: #fff;
	border: none;
}

#stormScript .list li:nth-child(even){
	border: none;
	background-color: #fff;
}

#stormScript .list li.active{background-color: #9cb140;}

/*------------------------------------------------------------
ノート表示
------------------------------------------------------------*/
#note{
	/*border-color: #666 #aaa #aaa #666;*/
	background-color: #efefef;
	height: 85%;
}

/*------------------------------------------------------------
スライドモード
------------------------------------------------------------*/
#landscape_header{
	background-color: rgba(255,255,255,0.8);
}

.slideMode #stormNav .naviRollOver{height: 100%;}

#slideNextImageBtn,#slidePrevImageBtn {
	width: 40px;
	height: 40px;
	background-color: rgba(255,255,255,0.6);
	border-radius:20px;

}

#slideNextImageBtn {
	right:0!important;	
	
	/* border-right: none; */

	/* STORM V 2.1.0 icon.css */
	/*
	background: url(../images/nextSlide2.png) #fff;
	-webkit-background-size: cover;
	background-size: cover;
	*/
}

#slidePrevImageBtn {
	left:0!important;
	
	/*border-left: none;*/

	/* STORM V 2.1.0 icon.css */
	/*
	background: url(../images/prevSlide2.png) #fff;
	-webkit-background-size: cover;
	background-size: cover;
	*/
}


/*landscape時ボタン非表示*/
.slideMode.landscape #stormNavCol1_1,
.slideMode.landscape #stormNavCol1_2,
.slideMode.landscape #stormNavCol1_4{
	display: none!important;
}

#tablet-pc.slideMode.landscape #stormNavCol1_6{
	background-color: rgba(255,255,255,0.8);
	border-radius: 1px;
}

/*------------------------------------------------------------
スライドメニュー（スライドモードベース、変更箇所のみ指定）
------------------------------------------------------------*/

/*PC＋スライドメニュー＋ランドスケープ時メニュー表示、INDEXはモバイル時も表示*/
.slideMenu.landscape #stormNavCol1_1,
#tablet-pc.slideMenu.landscape #stormNavCol1_2,
#tablet-pc.slideMenu.landscape #stormNavCol1_4{
	display: block!important;
}

#tablet-pc.slideMenu.landscape #stormNavCol1_6{
	background-color: rgba(255,255,255,0);
	border-radius: none;
}

#phone.slideMenu.landscape #stormNav #stormNavCol1_1.navCol{
	  background-color: rgba(255,255,255,0.5);
}

/*------------------------------------------------------------
Mobile #phone
------------------------------------------------------------*/

#phone #landscape_header,
#phone #landscape_footer,
#phone .speedPanel_landscape li{
	background-color:rgba(255,255,255,0.9);
}

/* #phone.portrait #stormNav_bg{background-color: #fff;} */

#phone #stormNavCol2_2 .navBtnImg, #phone #stormNavCol2_3 .navBtnImg{line-height: 52px;}
#phone .naviSelected{background-color: #4165B1;}
#phone .naviSelected .navBtnImg{text-shadow: 0 0 0; color:#fff;}
#phone #stormNav #stormNavCol2_3{width: 34%;}
#phone .speedPanel_landscape li{color:#333;}

/*------------------------------------------------------------
preview
------------------------------------------------------------*/
#tablet-pc.preview #stormNav2_bg{
	top: 0 !important;
}

.previewModeIndexPadding{
	padding-top: 5px !important;
	padding-bottom: 5px !important;
}