@charset "UTF-8";


/*--------------------------------------------------------------------
初期設定
--------------------------------------------------------------------*/


/* --------------- タグのリセット */

html {overflow-y: scroll; margin:0; padding:0;}
body {margin:0; padding:0;}
h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dt, dd, p, address, blockquote, form {margin:0; padding:0; font-size:1em; font-style:normal; font-weight:normal;}
table {border-collapse:collapse; border-spacing:0;}
abbr, acronym, fieldset, img {border:0;}
ul {list-style:none;}
caption, th {text-align:left;}
a {outline:none;}


/* --------------- タグの基本設定 */

body {font-size:80%; line-height:1.6; font-family:Arial, Helvetica, sans-serif; width:100%;}  
a {text-decoration:none; color:#38a;}
a:hover {text-decoration:underline;}
b, em, strong {font-weight:bold;}
ol {padding-left:2em; list-style-type:decimal;}
p {margin-bottom:0.6em;}
hr {height:1px; border-width:1px 0 0; border-color:#555; background:#555; padding:0;}
img {max-width:100%;}
.IB {display:inline-block;}


/*--------------------------------------------------------------------
共通設定
--------------------------------------------------------------------*/


/* --------------- マージン調整各種 */

.noMgnTop {margin-top:0!important;}
.noMgnBtm {margin-bottom:0!important;}
.top10 {margin-top:10px!important;}
.top15 {margin-top:15px!important;}
.top20 {margin-top:20px!important;}
.top25 {margin-top:25px!important;}
.btm10 {margin-bottom:10px!important;}
.btm15 {margin-bottom:15px!important;}
.btm20 {margin-bottom:20px!important;}
.btm25 {margin-bottom:25px!important;}
.h5 {margin-left:5px!important; margin-right:5px!important;}
.h10 {margin-left:10px!important; margin-right:10px!important;}
.h15 {margin-left:15px!important; margin-right:15px!important;}
.h20 {margin-left:20px!important; margin-right:20px!important;}
.w60 {width:60%; margin-left:auto; margin-right:auto;}
.w70 {width:70%; margin-left:auto; margin-right:auto;}
.w80 {width:80%; margin-left:auto; margin-right:auto;}
.w90 {width:90%; margin-left:auto; margin-right:auto;}
.w100 {width:100%; margin-left:auto; margin-right:auto;}
.v5 {margin-top:5px; margin-bottom:5px;}
.v10 {margin-top:10px; margin-bottom:10px;}
.v15 {margin-top:15px; margin-bottom:15px;}
.sml {font-size:0.8em;}

/* --------------- 回り込み解除 */

.clear {clear:both;}
.clearfix {zoom:1;}
.clearfix:after {content:""; display:block; clear:both;}


/* --------------- サイズをゼロに */

.hidden {height:0!important; width:0!important; overflow:hidden!important;}


/* --------------- マウスオーバーで透明度変更 */

.opacity a:hover, .opacity a:hover * {filter:alpha(opacity=70); opacity:0.70; -moz-opacity:0.70;}
.opacity_minus, .opacity_minus * {filter:alpha(opacity=70); opacity:0.70; -moz-opacity:0.70;}
.opacity_minus a:hover, .opacity_minus a:hover * {filter:alpha(opacity=100); opacity:1.00; -moz-opacity:1.00;}


/* --------------- 折り畳みメニュー化 */

dl.accordion dt {cursor:pointer;}
dl.accordion dt:hover {color:#aaa;}
dl.accordion dd {overflow:hidden;}


/* --------------- リスト見出しマークを表示 */

ul.square {margin:0; padding:0 0 0 1.5em; list-style-type:square;}
ul.disc {margin:0; padding:0 0 0 1.5em; list-style-type:disc;}


/* --------------- レイアウト確認用 ※iを消して使用 */

i div {border:1px #f00 solid;}	/* divのみにボーダー表示 */
i * {border:1px #f00 solid; display:none;}	/* 全要素にボーダー表示 */


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


body {font:14px/1.6 'Lucida Grande','Hiragino Kaku Gothic ProN',Meiryo,sans-serif; *font-size:small; *font:x-small; background:#000 url(../../../images/bg.jpg) repeat-y 0 0; color:#fff;}

#header {margin:20px 16px 20px 34px;}

h1 {color:#5ac; text-align:center;}
h1 span {display:block; color:#fff;}
h2 {font-size:1.3em; font-weight:bold; text-align:center; margin:10em 0 2em;}
h3 {font-size:1.1em; margin:3em 0 1em; font-weight:bold; border-left:0.6em #fff solid; padding-left:0.6em;}
.content {margin:0 16px 50px 34px;}

a#btn_backtotop * {filter:alpha(opacity=33); opacity:0.33; -moz-opacity:0.33;}
a#btn_backtotop:hover * {filter:alpha(opacity=80); opacity:0.80; -moz-opacity:0.80}

#footer {padding:25px 14px 10px 36px;}
#footer address {display:block; text-align:center; font-size:0.85em; color:#ccc;}



/* --------------- 振り分け */

@media only screen and (min-width: 540px) {				/* iPad, PC */
	h1 {font-size:60px;}
	h1 span {font-size:60px;}
	#header {margin-left:auto; margin-right:auto; width:620px; padding-left:34px; padding-right:16px;}
	#header p {font-size:25px;}
	.content {width:620px; margin-left:auto; margin-right:auto; padding-left:34px; padding-right:16px;}
}
@media only screen and (min-width: 480px) and (max-width: 539px) { 	/* iPhone 横 */ 
	#wrap {overflow:hidden;}
	h1 {font-size:40px;}
	h1 span {font-size:40px;}
	#header p {font-size:20px;}
}
@media only screen and (max-width: 479px) { 
	#wrap {overflow:hidden;}
	h1 {font-size:25px;}
	h1 span {font-size:25px;}
}

.ie	h1 {font-size:70px;}
.ie	h1 span {font-size:60px;}
.ie	#header {margin-left:auto; margin-right:auto; width:620px; padding-left:34px; padding-right:16px;}
.ie	#header p {font-size:25px;}


.sizeByHeight img {height:100%;}
.sizeByWidth img {width:100%;}
.width100 {width:100%;}
.width90 {width:90%;}
.width80 {width:80%;}
.width75 {width:75%;}
.width70 {width:70%;}
.width60 {width:60%;}
.width50 {width:50%;}
.width40 {width:40%;}
.width30 {width:30%;}
.width25 {width:25%;}
.width20 {width:20%;}
.width10 {width:10%;}
.width5 {width:5%;}
.width100 img,
.width90 img,
.width80 img,
.width75 img,
.width70 img,
.width60 img,
.width50 img,
.width40 img,
.width30 img,
.width25 img,
.width20 img,
.width10 img,
.width5 img {width:100%;}
.height100 {height:100%;}
.height90 {height:90%;}
.height80 {height:80%;}
.height75 {height:75%;}
.height70 {height:70%;}
.height60 {height:60%;}
.height50 {height:50%;}
.height40 {height:40%;}
.height30 {height:30%;}
.height25 {height:25%;}
.height20 {height:20%;}
.height10 {height:10%;}
.height5 {height:5%;}
.height100 img,
.height90 img,
.height80 img,
.height75 img,
.height70 img,
.height60 img,
.height50 img,
.height40 img,
.height30 img,
.height25 img,
.height20 img,
.height10 img,
.height5 img {height:100%;}



/* マージン調整 */
.noMgnTop {margin-top:0!important;}
.noMgnBtm {margin-bottom:0!important;}
.top10 {margin-top:10px!important;}
.top15 {margin-top:15px!important;}
.top20 {margin-top:20px!important;}
.top25 {margin-top:25px!important;}
.btm10 {margin-bottom:10px!important;}
.btm15 {margin-bottom:15px!important;}
.btm20 {margin-bottom:20px!important;}
.btm25 {margin-bottom:25px!important;}
.v10 {margin-top:10px!important; margin-bottom:10px!important;}
.v15 {margin-top:15px!important; margin-bottom:15px!important;}
.v20 {margin-top:20px!important; margin-bottom:20px!important;}
.v25 {margin-top:25px!important; margin-bottom:25px!important;}
.h5 {margin-left:5px!important; margin-right:5px!important;}
.h10 {margin-left:10px!important; margin-right:10px!important;}
.h15 {margin-left:15px!important; margin-right:15px!important;}
.h20 {margin-left:20px!important; margin-right:20px!important;}

/* その他 */
.center {margin-left:auto; margin-right:auto; text-align:center;}
.clear {clear:both;}
.clearfix:after {content:""; display:block; clear:both;}
.hidden {height:0!important; width:0!important; overflow:hidden!important;}
.bold {font-weight:bold;}
.italic {font-style:italic;}
.float_left {float:left;}
.float_right {float:right;}

ul.square {padding-left:1.5em; list-style-type:square;}
ul.disc {padding-left:1.5em; list-style-type:disc;}
ul.padded {margin-bottom:1.4em;}
ul.padded li {margin-bottom:0.6em;}
p {margin-bottom:2em;}



/*--------------------------------------------------------------------
通常設定
--------------------------------------------------------------------*/

#discs li {width:140px; text-align:center; margin:5px; float:left;}
#discs li span {display:block; height:140px; margin-bottom:0.5em;}
#discs img {width:100%; height:100%;}
#discs p {height:5em; line-height:1.3;}