@charset "utf-8";

/* Basic Structure ============================================================= */
html,
body{ height:auto !important;  height:100%; min-height:100%; margin: 0; padding: 0; }

#Wrap,
#Skip,
#Loader,
#Background,
#Background .bglayer{ height:auto !important; height:100%;min-height:100%;}

img{max-width: 100%; height: auto; width: auto\9;}
p{ margin: 0 0 1em 0; }

#Wrap,
#Background,
#Foreground,
#Skip,
#Loader,
#Header,
#Content,
#Footer{ width:100%; margin: 0; position: relative;}
.fr1{ width: 1200px; margin: 0 auto; }
.fr2{ width: 1000px; margin: 0 auto; }
.fr3{ width: 960px; margin: 0 auto; }



/* 深度設定 */
#Skip{position: absolute; top:0; left: 0; z-index: 101; }
#Loader{position: absolute; top:0; left: 0; z-index: 100; }
#Wrap{position: absolute; top:0; left: 0; z-index: 0;}
#Background{position: absolute; top:0; left: 0; z-index: -1; overflow: hidden; }
#Background .bglayer{ width:100%; position: absolute; top:0; left: 0;}
#Background .l1{ z-index: -199;}
#Background .l2{ z-index: -198;}
#Background .l3{ z-index: -197;}
#Background .l4{ z-index: -196;}
#Background .l5{ z-index: -195;}
#Background .l6{ z-index: -194;}
#Background .l7{ z-index: -193;}
#Background .l20{ z-index: -190;}
#Background .l21{ z-index: -189;}



html{ background-color: #000; }
body{ color: #FFF; }

#Skip .container { margin-top:10px; width: 100%; text-align: center;}

#Loader .container { font-family: 'Marvel', sans-serif; margin-top:350px; width: 100%; text-align: center; color: #F3514B;}
#Loader .container .load-text{ display: none; }
#Loader .container .bar {width: 0px;height: 2px;background: #F3514B;font-size: 1px;}

/* Font ======================================================== */
/* font-color */
body{ color: #222; }
a,
a:active,
a:visited{ color: #222; text-decoration: underline; }/*pink*/
a:hover{ color: #EB0089; text-decoration: none; }/*red*/
.color1{ color:#F39800;}/*orange*/
.color2{ color:#52C3F1;}/*blue*/
.color3{}

.dbrown{color:#3E1E14;}
.brown{color:#998075;}
.lbrown{color:#714F45;}
.llbrown{color:#C4B1AA;}
.pink{color:#E95098;}
.purple{color:#B979B1;}
.green{color:#AACD06;}
.lblue{color:#99E5FF;}
.red{color:#E94630;}
.orange{color:#F39800;}
.bgreen{color:#66CCCC;}
.pblue{color:#6666CC;}
.beige{color:#FBF8F0;}
.lyellow{color:#ffffbe;}
.yellow{color:#FEFE66;}
.navy{color: #0068b7;}
.black{color:#000;}

/* rem based fontsize <Firefox3.6+, Chrome, Safari5, IE9+ >*/
/* IE7/8対策のために最初にpx指定してからrem指定する  */
html{ font-size: 62.5%; line-height: 1;}
body { font-size: 14px; /*font-size: 1.4rem;*/ }
h1{ font-size: 48px; font-size: 4.8rem; font-weight: bold; margin: 0; padding: 0; }
h2{ font-size: 20px; font-size: 2.0rem; font-weight: bold; margin: 0; padding: 0; }
h3{ font-size: 18px; font-size: 1.8rem; font-weight: bold; margin: 0; padding: 0; }
h4{ font-size: 16px; font-size: 1.6rem; font-weight: bold; margin: 0; padding: 0; }
h5{ font-size: 14px; font-size: 1.4rem; font-weight: bold; margin: 0; padding: 0; }
h6{ font-size: 12px; font-size: 1.2rem; font-weight: bold; margin: 0; padding: 0; }
.xsmall { font-size: 10px; font-size: 1.0rem; }
.small { font-size: 11px; font-size: 1.1rem; }
.medium { font-size: 12px; font-size: 1.2rem; }
.regular { font-size: 14px; font-size: 1.4rem; }
.large { font-size: 16px; font-size: 1.6rem; }
.xlarge { font-size: 20px; font-size: 1.8rem; }
.xxlarge { font-size: 24px; font-size: 2.4rem; }
.clearsize{}

.n{ font-weight: normal; }
.b{ font-weight: bold; }
.i{ font-style: italic; }
.o{ font-style: oblique; }
.serif{ font-family: serif; }
.s-serif{ font-family: sans-serif; }

.lh0{ line-height: 0; }
.lh1{ line-height: 1; }
.lh15{ line-height: 1.5; }
/* font-face */
body, textarea { font-family: "メイリオ", "ＭＳ Ｐゴシック", sans-serif; }
input, select { font-family: Arial, "ＭＳ Ｐゴシック", sans-serif; }



/* Utility classes ============================================================ */
/* Left & Right alignment */
.centerT{ text-align: center; }
.leftT{ text-align: left; }
.rightT{ text-align: right; }
.left{ float: left; }
.right{ float: right; }
.t_center{ text-align: center; }
.t_left{ text-align: left; }
.t_right{ text-align: right; }
.v_top{ vertical-align: top; }
.v_middle{ vertical-align: middle; }
.v_bottom{ vertical-align: bottom; }
.v_ttop{ vertical-align: text-top; }

/*.clearFix (NN,IE6 is outdated) */
.clearfix {/zoom:1;}
.clearfix:after{content: ""; display: block; clear: both;}
.clearb{ clear:both; }

.bdimg{ border-width: 1px; border-style: solid; }
a .bdimg,
a:active .bdimg,
a:visited .bdimg{ border-color: #FFFFBF; }/*pink*/
a:hover .bdimg{ border-color: #FD7DC6; }/*red*/

.pre {
	white-space: pre;           /* CSS 2.0 */
	white-space: pre-wrap;      /* CSS 2.1 */
	white-space: pre-line;      /* CSS 3.0 */
	white-space: -pre-wrap;     /* Opera 4-6 */
	white-space: -o-pre-wrap;   /* Opera 7 */
	white-space: -moz-pre-wrap; /* Mozilla */
	white-space: -hp-pre-wrap;  /* HP Printers */
	word-wrap: break-word;      /* IE 5+ */
}

/* padding */
.pad{}

/* margin */
.l10{margin-left:10px;}
.r10{margin-right:10px;}
.t10{margin-top:10px;}
.b10{margin-bottom:10px;}

/* button */
.btn1{ font-size: 1em; color: #FFF; background-color: #FBA0C1; border-top:#EEE solid 1px; border-left:#EEE solid 1px; border-bottom: #666 solid 1px;border-right: #666 solid 1px; }
.btn1:hover{ color: #FFF; background-color: #FD74B8;}
.btn1{ margin-bottom: 0.4em; padding: 0.5em 0.8em; font-weight: bold; text-decoration: none; display:inline-block; /display:inline; /zoom:1; letter-spacing:normal; -moz-border-radius: 0.2em; border-radius: 0.3em; behavior: url(/lib/PIE.htc);/*for IE*/}


/* table */
.clear_table{ border-collapse: collapse; border: none;}

/* block */
.iblock{ margin: 0; padding: 0; display:inline-block; /display:inline; /zoom:1; letter-spacing:normal; vertical-align: top;}

/* The fraction classes are useful for column lists */
.half, .third, .quarter, .fifth, .sixth{display: block; list-style-type: none; margin: 0; padding: 0;  width: 100%; /zoom:1; }
.half:after, .third:after, .quarter:after, .fifth:after, .sixth:after{content: ""; display: block; clear: both;}
.half li, .third li, .quarter li, .fifth li, .sixth li{ float: left; }
.half li{ padding: 0 0.5%; width: 49% }
.third li{ padding: 0 0.5%; width: 32.3% }
.quarter li{ padding: 0 0.5%; width: 24% }
.fifth li{ padding: 0 0.5%; width: 19% }

/* List */
.clear_list{ display: block; list-style-type: none; margin: 0; padding: 0;}
.clear_list > li{ display: block; margin: 0; padding: 0;}

/* For when a <br /> just ain't enough */
.separator{clear: both;float: left;height: 1px;width: 100%; }

/* IE hack < http://www.positioniseverything.net/articles/cc-plus.html > */
#ltie8{}/*IE8未満*/
#ltie7{}/*IE7未満*/

/* Reusable classes ========================================================= */
/* frame */
.frame1{ border: #EEE solid 4px; padding: 2%; }
.frame2{ margin-bottom: 20px; padding: 10px; background: #1E223F; border: #3C426B solid 1px;}
.frame_dotted1{ border: #C4B1AA dotted 1px; }

/* table */
.table0{ width: 100%; border-collapse:separate; border-spacing: 1px;}
.table0 th,
.table0 td{ padding:5px; border: #DDD solid 1px; vertical-align: middle;}
.table0 th{ font-size: 80%; text-align:left;  }
.table0 td{ border: #777 solid 1px; }

.table1{ border-collapse: collapse; border: #DDD solid 2px; color:#222; }
.table1 th,
.table1 td{ padding:5px; border-bottom: #DDD dotted 1px;}
.table1 th{ font-size:12px; text-align:left; font-weight:bold; vertical-align: top; color: #222; background: #EFEFEF; }
.table1 td{ }

.table2{ border-collapse:separate; border-spacing: 1px; border: #CCC solid 1px; }
.table2 tr{ }
.table2 th,
.table2 td{ padding: 10px; background: #fafafa; border: #CCC solid 1px; }
.table2 th{ color: #444; font-weight: bold; background:#eee ; white-space: nowrap;}

/* List */
.list1{ list-style-type: none; display: block; margin: 0 auto; padding: 2% 0 0 0; background-image:url(../images/common/line_brownSolid.png); background-repeat: no-repeat; background-position: left top; }
.list1 li{ display: block;  margin: 0 0 2% 0; padding: 0 0 2% 0; line-height: 1.2; background-image:url(../images/common/line_brownSolid.png); background-repeat: no-repeat; background-position: left bottom;  }
.list2{ list-style-type: none; display: block; margin: 0 auto; padding: 2% 0 0 0; border-top: #714F45 dotted 1px; }
.list2 li{ display: block;  margin: 0 0 2% 0; padding: 0 0 2% 0; line-height: 1.2; border-bottom: #714F45 dotted 1px; }

/* block */
.iblock1{padding: 1%; border: #C4B1AA solid 1px; display:inline-block; /display:inline; /zoom:1;}

/* headline */
.ttl1{ color: #94d3ff; border-left:3px; padding: 2px ; margin: 0 0 10px 0;}
.ttl2{ color: #94d3ff; border-left:3px; padding: 2px ; margin: 0 0 10px 0;}
.ttl3{ color: #45aaf1; border-left:#45aaf1 3px solid; padding: 2px ; margin: 0 0 10px 0;}
.ttl4{ color: #94d3ff; border-left:3px; padding: 2px ; margin: 0 0 10px 0;}
.ttl5{ color: #94d3ff; border-left:3px; padding: 2px ; margin: 0 0 10px 0;}
.ttl6{ color: #94d3ff; border-left:3px; padding: 2px ; margin: 0 0 10px 0;}

hr.dot{ border-color: #333; border-width: 1px 0px 0px 0px; border-style: dashed; height: 1px; /* 高さ(IE) */}

/* common classes ========================================================= */


.container860{ width: 860px; margin: 0 auto;}
h4.common_ttl{ margin-bottom: 3px; padding: 8px 5px; border-left: #FFF solid 3px; background: #1A1341; }
.entry_common{ padding: 19px; border: #999 solid 1px; background: #130e32; }

.listtop{ margin-bottom: 20px; padding: 5px 0; text-align: right; font-size: 12px; }

.contb1{ width: 940px; margin: 0 auto; }
.contb1 .contb1-upr{ height: 55px; background: url(../images/common/contb1_upr.png) no-repeat center top; text-align: center; }
.contb1 .contb1-upr-nohd{ height: 19px; background: url(../images/common/contb1_upr_nohd.png) no-repeat center top; text-align: center; }
.contb1 .contb1-mdl{ background: url(../images/common/contb1_mdl.png) repeat-y center top; }
.contb1 .contb1-btm{ height: 15px; background: url(../images/common/contb1_btm.png) no-repeat center top;}

.sep{ width: 960px; margin: 0 auto; padding: 30px 0; background: url(../images/sep.png) no-repeat center center; }
.pagetop{ display: block; text-align: right; padding-right: 20px; }

.pager{}
.pager ul{ padding: 0; margin: 0; display: block; list-style-type: none; }
.pager ul li{ padding: 0; margin: 0; display: inline-block; width: 50%; font-weight: bold; }
.pager ul li.next{ text-align: right;}
.pager ul li a{ text-decoration: none;}
.pager ul li.off a{ display: none;}