@charset "utf-8";

/* ---- css reset ---- */
@import url(reset.css);
@import url(common.css);
/* ---- Structure ---- */
#Background,
#Foreground,
header,
#Wrap,
footer{ width:100%; margin: 0;}
.frame_pri{ max-width: 1200px; margin: 0 auto; }
.frame_sec{ max-width: 1100px; margin: 0 auto; }
article{ width: 70.7%; float: left; }
aside{ width: 26.7%; float: right; }

/* 深度設定 */
#Background{ height:100%; position: absolute; top:0; left: 0; z-index: 0; }
#Background .layer1{ width:100%; height:100%; position: absolute; top:0; left: 0; z-index: 1;}
#Background .layer2{ width:100%; height:100%; position: absolute; top:0; left: 0; z-index: 2;}
#Background .layer3{ width:100%; height:100%; position: absolute; top:0; left: 0; z-index: 3;}
#Background .layer4{ width:100%; height:100%; position: absolute; top:0; left: 0; z-index: 4;}
#Background .layer5{ width:100%; height:100%; position: absolute; top:0; left: 0; z-index: 5;}
#Background .layer6{ width:100%; height:100%; position: absolute; top:0; left: 0; z-index: 6;}
#Background .layer7{ width:100%; height:100%; position: absolute; top:0; left: 0; z-index: 7;}
#Background .layer8{ width:100%; height:100%; position: absolute; top:0; left: 0; z-index: 8;}
#Foreground{ height:100%; position: absolute; top:0; left: 0; z-index: 50; }

/* background */
body{ background: url(../images/common/background.jpg); }
#Main0,
#Main1,
#Main2,
#Main3,
#Main4,
#Main5{ width: 64%; max-width: 768px; margin-left: 36%;}
#Bgimage{ width: 45%; max-width: 540px;}

/* Header */
header{ padding-bottom: 1.5%;}
header nav{ width: 100%; clear:both; padding-bottom: 0.5%; }
header nav ul{ list-style-type: none; max-width: 1000px; margin: 0 auto; padding: 0; display: block;}
header nav ul li{ margin: 0; padding: 0; display: block; float: left;}
header nav ul .nv1,
header nav ul .nv2,
header nav ul .nv3,
header nav ul .nv4,
header nav ul .nv6,
header nav ul .nv7{ width:12%; }
header nav ul .nv5{ width:18%;}
header nav ul .nv8{ width:10%;}

header #Logo{ width: 39.3%; margin-left: 1.6%; }
header #Onair{ width: 38.8%; margin-left: 1.6%;  }
header #PV{ width: 26.7%; margin-left: 7%; /*margin-top: 1%;*/ }
header #Exbanner{ width: 30%; margin-left: 5%; }

#AnimeBadge{ width: 14%; position: absolute; top:650; left: 440; z-index: 200;}

/* Wrap */
#Wrap{ margin-bottom: 2%; }
#Wrap .shadowBx{ margin: 0 1.8%; text-align: center; line-height: 0; }
#Wrap .flowerBg{ margin: 0 1.8%; padding: 1% 2.8%; background: #000 url(../images/common/ptn_flowerBg.jpg); border: #000 solid 5px; }
article{ background: #FF0000; width: 67.9%; padding: 1.2%; }
article > .inside{ background: #FFF url(../images/top/article_insideBg.jpg) no-repeat right top;background-size: cover;  padding: 0; }
aside{}

/* Article / Aside */
/* WhatsNew */
#WhatsNew{ width: 91.1%; line-height: 1.2; margin: 0 auto 5% auto; }
#WhatsNew h3{ margin: 0; padding: 0; line-height: 0; }
#WhatsNew .container{ padding: 0 5%;}
#WhatsNew .container .entry{ font-size: 12px; font-size: 1.2rem; display: block; margin: 0; padding: 2% 0 2% 0; border-bottom: #000 dotted 1px; }
#WhatsNew .container .entry .date{ color:#714F45; display: inline;}
#WhatsNew .container .entry h4{ display: inline; padding-left: 1%; font-size: 12px; font-size: 1.2rem; font-weight: normal;}

/* Twitter */
#Twitter{ width: 91.1%; line-height: 1.2; margin: 0 auto;}
#Twitter .container{ padding: 2.5% 2.5%; background: url(../images/top/twitterBg.png) no-repeat center top;background-size:100% 100%;}
#Twitter h3{ margin: 0 0 1% 0;}
#Twitter .timeline{ margin-bottom: 15%; }
#Twitter .timeline #twitter_update_list{list-style-type: none; margin: 0; padding: 0; display: block;}
#Twitter .timeline #twitter_update_list li{font-size: 12px; font-size: 1.2rem; display: block; margin: 0; padding: 1% 0 1% 0; border-bottom: #000 dotted 1px; }

/* Banner */
#Banner{}
#Banner ul{ list-style-type: none; margin: 0; padding: 0; display: block; }
#Banner ul li{ margin: 0 0 1% 0; padding: 0; display: block; text-align: center; }
#Banner ul li img,
#Banner ul li a img{ border: #FFF solid 2px; }
#Banner ul li a:hover img{ border: #FF0000 solid 2px; }

/* Footer */
footer{ text-align: center; }
footer #Copyright{ height: 20px; font-size: 10px; font-size: 1.0rem; line-height:1.2; display: inline-block; /display:inline; /zoom:1; }

/* Mediaqueries */
/* PC(768~1200px) ============================================================= */
@media screen and (max-width: 1200px) {

}
/* Tablet(Landscape) =================================================================== */
@media screen and (max-width: 768px) {

}
/* Smartphone(Landscape) ============================================================== */
@media screen and (max-width: 480px) {
article{ width: 100%; float: none; margin-bottom: 5%; }
aside{ width: 100%; float: none; }
}
/* Smartphone(Portrait) =============================================================== */
@media screen and (max-width: 320px) {

}