@charset "UTF-8";

/* ==================================================================
CSS information
style info :INDEX用
================================================================== */


/* --------------------------------------------------------
#mainvisual
-------------------------------------------------------- */
#mainvisual { width: 100%; height: auto; position: relative;}
#mainvisual img { width: 100%; height:auto;}
#mainvisual h1 { }


#contents { padding: 30px 0px; background: url(../_img/index/bg_r2.png) top center repeat;}
.contents-inner { padding-left: 30px; padding-right: 30px;}

/* #infomation
-------------------------------------------------------- */
#infomation { position: relative; border: 1px solid #ffea9c; padding: 1px; background: #000; margin-bottom: 20px;}
#infomation #infomation-inner { position: relative; border: 1px solid #90835e; }
#infomation #infomation-inner:after { content: ""; display: block; clear: both; }
#infomation #infomation-inner { zoom:1; }
#infomation .ttl { border-bottom: 1px solid #9d8741;}
#infomation .bx-wrapper { margin: 0; border-left: 1px solid #9d8741; }
#infomation ul li { font-size: 2.0rem; color: #FFF; min-height: 51px; overflow: hidden; padding: 0.5em 0 0.5em 1.0em; }
#infomation ul li .date { display: inline-block; padding-right: 1em; float: left; width: 20%; }
#infomation ul li .text { display: inline-block; line-height: 1.41; float: left; width: 75%; }
#infomation ul li a { text-decoration: underline; color: #FFF;}

#infomation .btn_prev,
#infomation .btn_next { position: absolute; top: 0px; }
#infomation .btn_prev { right: 49px;}
#infomation .btn_next { right: 0px;}
#infomation .btn_prev a,
#infomation .btn_next a { display: block; width: 49px; height: 52px; }
#infomation .btn_prev a { background: url(../_img/index/btn_prev.png) no-repeat center center;}
#infomation .btn_next a { background: url(../_img/index/btn_next.png) no-repeat center center;}
#infomation .btn_prev a.disabled,
#infomation .btn_next a.disabled { opacity: 0.5;}


/* #bnr_amiibo
-------------------------------------------------------- */
#bnr_amiibo { margin-bottom: 20px;}
#bnr_amiibo img { width: 100%; height:auto;}



/* #bnr01, #bnr02
-------------------------------------------------------- */
#bnr01 { width: 63.62069%; display: inline-block; float: left;}
#bnr02 { width: 32.588621%; display: inline-block; float: right; margin-bottom: 20px;}
#bnr03 { width: 100%; display: block; float: right; margin-bottom: 20px;}
#bnr04 { width: 100%; display: block; float: right; margin-bottom: 30px;}
#bnr01 img , #bnr02 img , #bnr03 img , #bnr04 img{ width: 100%; height:auto;}




hr { background: url(../_common/img/line.png) center center repeat-x; width: 100%; height: 24px; border: none; margin: 0;}
hr.line { background: url(../_img/index/line_p.png) center center no-repeat; width: 100%; height: 35px; border: none; margin: 0;}



/* --------------------------------------------------------
#evolution
-------------------------------------------------------- */
#evolution { background: #000; position: relative; padding-bottom: 40px;}
#evolution .bx-wrapper { margin-bottom: 0;}
#evolution img { width: 100%; height: auto;}

#evolution #pager_Custom { position: relative; z-index: 1; z-index: 101;}
#evolution #pager_Custom .bx-pager { letter-spacing: -.45em; width: 100%; text-align: center;}
#evolution #pager_Custom .bx-pager-item { letter-spacing: normal; vertical-align: top; display: inline-block; width: 41px; height: 41px; overflow:hidden; margin: 0 18px; }
#evolution #pager_Custom .bx-pager-item a { display: block; width: 41px; height: 41px; background: url(../_img/index/hdpic_btn.png) no-repeat center center; text-indent: 100%; }
#evolution #pager_Custom .bx-pager-item a.active { background: url(../_img/index/hdpic_btn_on.png) no-repeat center center; }

#evolution .copy { position: absolute; top: 36%; left: 0; width: 100%; }
#evolution .text { }



/* #c1
-------------------------------------------------------- */
#c1 { background: url(../_img/index/bg_r.png) top center repeat-x; padding-bottom: 80px;}

#c1 #block1 { position: relative; }
#c1 #block1 img { width: 100%; height: auto;}
#c1 #block1 .copy {}
#c1 #block1 .text { margin-bottom: 30px;}
#c1 #block1 .pic { position: absolute; top: -31px; right: 0;}
#c1 #block1 .btn_wolf { width: 66.4062%; margin: 0 auto 50px; }

#c1 #block2 { position: relative; }
#c1 #block2 img { width: 100%; height: auto;}
#c1 #block2 .subcopy { margin-bottom: 20px; }
#c1 #block2 .pic { margin-bottom: 18px;}
#c1 #block2 .text { margin-bottom: 13px;}
#c1 #block2 .notes { text-align: left; margin-bottom: 40px; }
#c1 #block2 .btn_amiibo { width: 66.4062%; margin: 0 auto 0px; }
#c1 #block2 .amiibo_zelda { width:580px;margin: 0 auto 0px; }

/* #c2
-------------------------------------------------------- */
#c2 { padding-top: 30px; padding-bottom: 50px; }
#c2 img { width: 100%; height: auto;}

#c2 .copy { margin-bottom: 20px; }
#c2 .btn { }
#c2 .text { }


/* #c3
-------------------------------------------------------- */
#c3 { padding-top: 40px; padding-bottom: 50px; }
#c3 img { width: 100%; height: auto;}

#c3 .copy { margin-bottom: 30px; }
#c3 .text { margin-bottom: 30px; }
#c3 .picList { position: relative; letter-spacing: -.45em; font-size: 0.1; vertical-align: top; }
.end_miiverse_txt {
    padding: 20px 0 0 25px;
    color: #fff;
    font-size: 14px;
}
#c3 .picList li { display: inline-block; letter-spacing: normal; width: 50%; }
#c3 .picList li:first-child { padding-left: 25px; padding-right: 10px;}
#c3 .picList li:last-child { padding-left: 10px; padding-right: 25px;}


/* #c4
-------------------------------------------------------- */
#c4 { padding-top: 40px; padding-bottom: 30px; }
#c4 img { width: 100%; height: auto;}

#c4 .copy { margin-bottom: 26px; }
#c4 .picList { }
#c4 .picList li { margin-bottom: 30px;}




#spec_wrap { background: #000; padding: 30px 0 10px;}
#spec { width: 100%; margin:0 auto; text-align: center; position: relative; }


#aptext { width: 92%; margin: 0 auto 30px; color: #FFF; font-size: 1.8rem; text-indent: -1em; padding-left: 1em; line-height: 1.61;}

