/*
Theme Name: TVアニメ「ヴァルキリードライヴ　マーメイド」公式サイト
Description: TVアニメ「ヴァルキリードライヴ　マーメイド」公式サイト用テーマ
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/
@charset "utf-8";
/***********************************************************************
main style
************************************************************************/

html,body{ font-size: 18px; color: #111; background-color:#FFF; line-height: 1.4;}
a,
a:active,
a:visited{ color: #c6080f; text-decoration: underline; }
a:hover{ color: #ff000a; text-decoration: none; }
body, textarea { font-family: sans-serif; }
input, select { font-family: sans-serif; }

/* Basic Structure =================================================== */
html,body{ height:auto !important;  height:100%; min-height:100%; margin: 0; padding: 0; }
body{ background-repeat: repeat-x; background-position: center top; }
#Wrap{ height:auto !important; height:100%; min-height:100%;}
#Wrap{ width:100%; margin: 0; position: relative;}
#Header{ width:100%; margin: 0; position: relative;}
#Content{ width:100%; margin: 0; position: relative;}
#Footer{ width:100%; margin: 0; position: relative;}

/* --- body , #Wrap --- */
body{  }
#Wrap{ min-width: 1200px; padding: 0; height: 100%; margin: 0 auto; background: url(./images/common/background_0.jpg) no-repeat fixed center top; }
#Wrap .exbg{ }

/* --- #Header --- */
#Header{ height: 140px; padding: 0; position: relative; background: url(./images/common/header_bg.png) no-repeat center top; }
#Header .inner{ width: 1200px; margin: 0 auto; position: relative; }
h1#Logo{ width: 216px; height: 135px; padding:0; margin: 0; overflow: hidden; position: absolute; top: 0px; left: 0px; z-index: 100; }
h1#Logo a{ width: 216px; height: 0px; padding:135px 0 0 0; display: block; background: url(./images/common/logo.png) no-repeat; overflow: hidden; }
#Onair{ width: 147px; height: 42px; margin: 0; overflow: hidden; position: absolute; top: 70px; left: 220px; z-index: 101; }

#Navi{ width: 800px; height: 135px; padding:0; margin: 0; overflow: hidden; position: absolute; top: 0px; left: 400px; z-index: 102; }
#Navi li{ margin-bottom: 0px; }
#Navi ul{ list-style-type: none; margin: 0; padding: 5px 0 0 0; display: block; font-size: 0; }
#Navi ul li{ height: 34px; margin: 0 3px 3px 0; padding: 0; display: inline-block; /display: inline; /zoom: 1; list-style: none; font-size: 14px; }
#Navi ul li a{ width: 144px; height: 0; padding-top: 34px; display: block; background-image: url(./images/common/navi.png); background-repeat: no-repeat; overflow: hidden; }
#Navi ul li:nth-child(1) a{ background-position: 0px 0px; }
#Navi ul li:nth-child(1) a:hover{  background-position: 0px -34px; }
#Navi ul li:nth-child(2) a{ background-position: -144px 0px; }
#Navi ul li:nth-child(2) a:hover{  background-position: -144px -34px; }
#Navi ul li:nth-child(3) a{ background-position: -288px 0px; }
#Navi ul li:nth-child(3) a:hover{  background-position: -288px -34px; }
#Navi ul li:nth-child(4) a{ background-position: -432px 0px; }
#Navi ul li:nth-child(4) a:hover{  background-position: -432px -34px; }
#Navi ul li:nth-child(5) a{ background-position: -576px 0px; }
#Navi ul li:nth-child(5) a:hover{  background-position: -576px -34px; }
#Navi ul li:nth-child(6) a{ background-position: -720px 0px; }
#Navi ul li:nth-child(6) a:hover{  background-position: -720px -34px; }
#Navi ul li:nth-child(7) a{ background-position: -864px 0px; }
#Navi ul li:nth-child(7) a:hover{  background-position: -864px -34px; }
#Navi ul li:nth-child(8) a{ background-position: -1008px 0px; }
#Navi ul li:nth-child(8) a:hover{  background-position: -1008px -34px; }
#Navi ul li:nth-child(9) a{ background-position: -1152px 0px; }
#Navi ul li:nth-child(9) a:hover{  background-position: -1152px -34px; }

#Navi ul li:nth-child(6){ margin-left: 35px; }

#Banner{ display: none; }

/* --- #Footer --- */
#Footer{ min-width: 1200px; padding: 0; margin: 0 auto; position: relative;  }
#Footer .inner{  }
#Footer #Copyright{ font-size: 0.8em; color: #790004; font-family: serif; padding: 15px 0; text-align: center;  }
#Social{  height: 30px; padding:0; margin: 0 auto;}
#Social ul{ text-align: center; }
#Social ul > li{ width: 30px; height: 30px; margin-right: 10px; overflow: hidden; }
#Social ul > li a{ display: block; width: 30px; height: 0px; padding-top: 33px; overflow: hidden; background: url(./images/common/social_btn.png) no-repeat left top;  }
#Social .tw a{ background-position: 0px 0px; }
#Social .tw a:hover{ background-position: 0px -30px; }
#Project{ background: #790004; padding: 0.5em 0; margin-bottom: 1em; }
#Project ul{ text-align: center; }
#Project ul li{ margin-left: 10px; }

/* --- #Content --- */
#Content{ width: 1200px; min-height: 550px; padding: 0; margin: 0 auto 1em auto; position: relative;}
#Content .inner{  }
#Content .content-left{ width: 350px; float: left; }
#Content .content-right{ width: 850px; float: left; }
.page-title{ color: #000; border-bottom: #000 solid 5px; font-size: 30px; font-family: serif; line-height: 20px; }
#ContentWindow{ width: 830px; padding: 10px; background: url(./images/common/w75.png); }
#ContentWindow .inner{ padding: 40px; border: #DDDDDD solid 1px; }
#ContentWindow .entry{ margin-bottom: 4em; }
#ContentWindow .entry .entry-date{ color: #9A0000; margin: 0 0 0 0; border-top: #9A0000 dotted 1px; }
#ContentWindow .entry .entry-date:before{ content:"■ " }
#ContentWindow .entry .entry-title{ font-size: 1.4em; color: #000; margin: 0 0 1em 0; border-bottom: #9A0000 dotted 1px; }
#ContentWindow .entry .entry-body{ color: #222; }

.pagetop{ display: block; text-align: right; padding-right: 20px; }
.pagetop{ border-bottom: #999 dotted 1px; padding: 5px 0; margin-bottom: 3em; }

.pager{}
.pager ul{ padding: 20px 0; margin: 0; display: block; list-style-type: none; /* border-top: #9A0000 dotted 1px;*/ }
.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.hide a{ display: none; }
.pager ul li a{ color: #FFF; background: #790004; padding: 5px 10px; text-decoration: none;}
.pager ul li a:hover{ color: #FFF; background: #c6080f;}
.pager ul li.off a{ display: none;}

.sub-navi{ list-style-type: none; margin: 140px 1px 0 90px; padding: 15px 0 3px 5px; display: block; }
.sub-navi li{ margin: 0 0 5px 0; padding: 0; display: block; background: url(./images/common/subnavi-li_bg.png) no-repeat left bottom ;  list-style: none; font-size: 24px;  font-family: serif;}
.sub-navi li a{ text-decoration: none; display: block; padding: 0 0 0 20px; background: url(./images/common/subnavi-li_ind.png) no-repeat 7px 9px ; }
.sub-navi li.cs a{ color: #666; background-image: url(./images/common/subnavi-li_ind_cs.png); }
/* Common =================================================== */
/*.ttl2{ color: #990000; font-family: serif; font-size: 30px; font-weight: bold; border-bottom: #990000 solid 3px; }*/
.ttl2{ color: #990000; font-family: serif; font-size: 30px; font-weight: bold; background: url(images/common/ttl2_uline.png) no-repeat left bottom; }
.ttl3{ border-bottom: #af0707 solid 2px; color: #af0707; font-weight: bold; }
.ttl4{ border-left: #af0707 solid 4px; color: #af0707; padding-left: 4px; font-weight: bold; display: block; background: #f9f3f3; }

.ilink:before{ content:'> '; }
.ilink,
.ilink:active,
.ilink:visited{ color: #FFF; background: #790004; padding: 5px 10px; text-decoration: none;}
.ilink:hover{ color: #FFF; background: #c6080f;}
/* TopPage =================================================== */

#Page_top #Wrap{ min-width: 1200px; padding: 0; height: 100%; margin: 0 auto; background: url(./images/top/background_0.jpg) no-repeat scroll center top; }
#Page_top #Header{ height: 500px; }
#Page_top h1#Logo{ width: 474px; height: 294px; padding:0; margin: 0; overflow: hidden; position: absolute; top: 160px; left: 0px; z-index: 100; }
#Page_top h1#Logo a{ width: 474px; height: 0px; padding:294px 0 0 0; display: block; background: url(./images/top/logo.png) no-repeat; overflow: hidden; }
#Page_top #Onair{ width: 309px; height: 103px; margin: 0; overflow: hidden; position: absolute; top: 280px; left: 865px; z-index: 101; }
#Page_top #PV{ width: 280px; height: 158px; margin: 0; overflow: hidden; position: absolute; top: 110px; left: 880px; z-index:102; }
#Page_top #Banner{ width: 300px; height: 90px; margin: 0; overflow: hidden; display: block; position: absolute; top: 395px; left: 870px; z-index:103;}

#Page_top #BannerRadio{ width: 300px; margin-left: 50px; margin-top: 30px; }

#Page_top #News{ width: 240px; margin-left: 50px; }
#Page_top #News .ttl{ line-height: 0; }
#Page_top #News .container{ width: 240px; margin: 0 auto;  }
.news-list{ width: 240px; padding: 0.5em 0 0 0 ; border-top: #980000 dotted 1px; }
.news-list dl{ margin: 0 0 0.5em 0 ; padding:0px; list-style-type: none; border-bottom: #980000 dotted 1px; }
.news-list dl dt{ font-size: 0.7em; display: block; padding: 0 ; margin: 0; color: #980000; }
.news-list dl dd{ font-size: 0.7em; display: block; margin: 0;padding: 0;}
.news-list dl dd a{ color: #000;}
.news-list dl dd a:hover{color: #980000;}

#Page_top #Twitter{ width: 240px; margin-left: 600px;  }
#Page_top #Twitter .ttl{ line-height: 0; }
#Page_top #Twitter .container{ width: 240px; padding: 0; margin: 0 auto;}
#Page_top #Twitter .twt-btn{ padding: 0.5em 0 0 0 ; border-top: #980000 dotted 1px; }
#Page_top #Twitter .twt-widget{ width: 235px; padding: 0 0 0 5px ; height: 400px; background: url(./images/common/w75.png);}
#Page_top #Twitter #twitter-widget-0{ height: 400px; }

/* onair */
#Page_onair #Wrap .exbg{background: url(images/onair/exbg.png) no-repeat fixed center top;}

/* story */
.episode-navi{ list-style-type: none; margin: 140px 1px 0 90px; padding: 15px 0 3px 5px; display: block; font-size: 0; background: url(./images/story/navi_cont-bg.png) no-repeat left top ;  }
.episode-navi li{ height: 72px; margin: 0 3px 3px 0; padding: 0; display: inline-block; background-image: url(./images/story/navi-bg.png); background-repeat: no-repeat; /display: inline; /zoom: 1; list-style: none; font-size: 14px; }
.episode-navi li:hover{ background-position: 0px -72px;}
.episode-navi li a{ width: 80px; height: 0; padding-top: 72px; display: block; background-image: url(/anime/_upload/outline/navi.png); background-repeat: no-repeat; overflow: hidden; }
.episode-navi li:nth-child(1) a{ background-position: 0px 0px; }
.episode-navi li:nth-child(2) a{ background-position: -80px 0px; }
.episode-navi li:nth-child(3) a{ background-position: -160px 0px; }
.episode-navi li:nth-child(4) a{ background-position: -240px 0px; }
.episode-navi li:nth-child(5) a{ background-position: -320px 0px; }
.episode-navi li:nth-child(6) a{ background-position: -400px 0px; }
.episode-navi li:nth-child(7) a{ background-position: -480px 0px; }
.episode-navi li:nth-child(8) a{ background-position: -560px 0px; }
.episode-navi li:nth-child(9) a{ background-position: -640px 0px; }
.episode-navi li:nth-child(10) a{ background-position: -720px 0px; }
.episode-navi li:nth-child(11) a{ background-position: -800px 0px; }
.episode-navi li:nth-child(12) a{ background-position: -880px 0px; }
.episode-navi li:nth-child(13) a{ background-position: -960px 0px; }

#Page_story #slider{ width: 748px; height: 370px; margin: 0 auto; position: relative; background: url(./images/story/slider_bg.png) no-repeat center top; }
#Page_story #slider #imageMain{ width: 600px; height: 337px; padding: 15px 7px 0 13px; float: left; }
#Page_story #slider ul{ display: block; padding: 0; margin: 0; list-style-type: none; }
#Page_story #slider ul li{ display: block; padding: 0; margin: 0; }
#Page_story #slider ul.sceneImage{ width: 600px; height: 337px; overflow: hidden;}
#Page_story #slider ul.sceneImage li{  width: 600px; height: 337px; float: left; }
#Page_story #slider ul.thumb{ width: 114px; padding:15px 0 0 0; float: left; }
#Page_story #slider ul.thumb li{ width: 112px; height: 51px; margin-bottom: 4px; line-height: 0; overflow: hidden; border: #fff solid 1px; }
#Page_story #slider ul.thumb li img{ }
#Page_story .ep-text{ font-size: 20px; padding: 0 20px; font-family: serif; line-height: 1.7; }
#Page_story .ep-staff{ font-size: 12px; color: #bf1010; padding: 10px 20px ; border-top: #980000 dotted 1px; border-bottom: #980000 dotted 1px; }

/* character */
.character-navi{ list-style-type: none; margin: 140px 1px 0 90px; padding: 15px 0 3px 5px; display: block; font-size: 0; background: url(./images/character/navi_cont-bg.png) no-repeat left top ;  }
.character-navi li{ height: 72px; margin: 0 3px 3px 0; padding: 0; display: inline-block; background-image: url(./images/character/navi-bg.png); background-repeat: no-repeat; /display: inline; /zoom: 1; list-style: none; font-size: 14px; }
.character-navi li:hover{ background-position: 0px -72px;}
.character-navi li a{ width: 80px; height: 0; padding-top: 72px; display: block; background-image: url(./images/character/navi.png); background-repeat: no-repeat; overflow: hidden; }
.character-navi li:nth-child(1) a{ background-position: 0px 0px; }
.character-navi li:nth-child(2) a{ background-position: -80px 0px; }
.character-navi li:nth-child(3) a{ background-position: -160px 0px; }
.character-navi li:nth-child(4) a{ background-position: -240px 0px; }
.character-navi li:nth-child(5) a{ background-position: -320px 0px; }
.character-navi li:nth-child(6) a{ background-position: -400px 0px; }
.character-navi li:nth-child(7) a{ background-position: -480px 0px; }
.character-navi li:nth-child(8) a{ background-position: -560px 0px; }
.character-navi li:nth-child(9) a{ background-position: -640px 0px; }
.character-navi li:nth-child(10) a{ background-position: -720px 0px; }

/* staff&cast */
.stafflist{ display: block; }
.stafflist dt{ display: block; margin: 0; padding: 0; color: #990000; font-size: 14px; font-family: serif; }
.stafflist dd{ display: block; margin: 0 0 7px; padding: 0; color: #000; font-size: 18px; font-family: serif; }

/* product */
#Page_product #ContentWindow .entry .entry-title{ border-bottom: #af0707 solid 2px; color: #af0707; font-weight: bold;  }
.bd_date{  margin: -1em 0 1em 0; color: #af0707; font-size: 16px; font-weight: bold; }
.bd_th{ text-align: center; margin-bottom: 0.5em; }
.bd_tkt{ font-size: 14px; margin: 0 0 1em 0;  white-space: pre; }

.bd_spec{ font-size: 12px; padding: 10px; margin: 0; border: #af0707 solid 1px; list-style-type: none; display: block; vertical-align: middle; }
.bd_spec dt{ width: 60px; text-align: center; color: #af0707; font-weight: bold; background: #f9f3f3; margin: 0 5px 5px 0; padding: 3px 5px; display: inline-block; vertical-align: middle; }
.bd_spec dd{ margin: 0 5px 5px 0; padding: 3px; display: inline-block; vertical-align: middle;}

/* special */
#Page_special #Wrap .exbg{background: url(images/special/exbg.png) no-repeat fixed center top;}
.movie-th{ display: inline-block; padding: 4px 4px 8px 4px; margin: 0; line-height: 0; background: url(images/special/movie_thbg.png) no-repeat left top; }