@charset "UTF-8";
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
    font-size: 100%;
    vertical-align: baseline;
}

html {
    line-height: 1;
}

ol, ul {
    list-style: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

caption, th, td {
    text-align: left;
    font-weight: normal;
    vertical-align: middle;
}

q, blockquote {
    quotes: none;
}

q:before, q:after, blockquote:before, blockquote:after {
    content: "";
    content: none;
}

a img {
    border: none;
}

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
    display: block;
}


/* CSS Document */


/* Fonts
------------------------------------------------------------*/


/* clearfix
------------------------------------------------------------*/

.clearfix:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}

* html .clearfix {
    zoom: 1;
}


/* IE6 */

*:first-child+ html .clearfix {
    zoom: 1;
}


/* IE7 */


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

p {
    color: #000;
    line-height: 1.7;
}


/* ------------------------------------------------------------------------
    #default
------------------------------------------------------------------------  */

* {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

html, body {
    font-size: 62.5%;
}

body {
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, arial, helvetica, "ＭＳ Ｐゴシック", sans-serif;
    color: #333;
    -webkit-text-size-adjust: 100%;
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 1;
    position: relative;
}

img {
    vertical-align: bottom;
    border: none;
}

a, a img {
    color: #004ea6;
    text-decoration: none;
    outline: none;
    cursor: pointer;
    transition: opacity 0.8s ease;
}

a:hover, a:hover img, a:active, a:focus, a img:hover, a img:hover img, a img:active, a img:focus {
    color: #666;
    outline: none;
    noFocusLine: expression(this.onFocus=this.blur());
}


/* ------------------------------------------------------------------------
    #header
------------------------------------------------------------------------  */

.header {
    background-image: url("../img/header_bg.png");
    height: 73px;
}

.header .inner {
    width: 1000px;
    margin: auto;
    position: relative;
}

.logo {
    position: absolute;
    top: 18px;
    right: 0px;
    width: 106px;
    height: 25px;
}

.logo-gungho {
    position: absolute;
    right: 4px;
    top: 18px;
}

.header-title {
    position: absolute;
    left: 62px;
    top: 24px;
}


/* ------------------------------------------------------------------------
    #footer
------------------------------------------------------------------------  */

.footer {
    width: 1000px;
    height: 140px;
    margin: auto;
    padding: 15px 0 40px;
    font-size: 11px;
    font-size: 1.1rem;
    text-align: center;
}

.copyright {
    line-height: 1.4;
}

.footer-logo {
    margin-bottom: 10px;
}


/* ------------------------------------------------------------------------
    #layout
------------------------------------------------------------------------  */

.wrapper {
    margin: 0 auto;
    width: 1400px;
    background-image: url(../img/bg_contents.jpg);
    background-repeat: no-repeat;
    background-position: top center;
}


/* ------------------------------------------------------------------------
    #contents
------------------------------------------------------------------------  */

.main-visual {
    position: relative;
    height: 635px;
    width: 1400px;
}

.main-visual-title {
    position: absolute;
    top: 0px;
    right: 200px;
}

.character-area {
    left: 0;
    top: 0px;
}

.comment {
    position: absolute;
    left: 175px;
    top: 260px;
    z-index: 100;
    /*width: 148px;
  height: 329px;*/
}

.comment02 {
    position: absolute;
    left: 195px;
    top: 500px;
    z-index: 100;
    /*width: 148px;
  height: 329px;*/
}

.character01 {
    position: absolute;
    left: 173px;
    top: -72px;
    /*z-index: 100;*/
    /*width: 618px;
  height: 1203px;*/
}

.character02 {
    position: absolute;
    left: 223px;
    top: -15px;
    width: 425px;
    height: 797px;
}

.character03 {
    position: absolute;
    left: 32px;
    top: -41px;
    width: 483px;
    height: 678px;
}

.btn-main {
    position: absolute;
    bottom: -54px;
    right: -36px;
    z-index: 11;
    width: 216px;
    height: 209px;
}

.slide-area {
    position: absolute;
    width: 628px;
    height: 460px;
    right: 190px;
    top: 115px;
}

.slider-container {
    width: 602px !important;
    height: 386px;
    margin: 20px 0 0 8px;
}

.slider-contents img {
    width: 100%;
}

.slider-frame {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 10;
    width: 628px;
    height: 460px;
}

.bx-viewport {
    margin-top: -3px;
}

.bx-controls {
    z-index: 100;
    position: absolute;
    width: 300px;
    overflow: hidden;
    bottom: 90px;
    text-align: center;
    left: 140px;
}

.bx-pager-item {
    display: inline-block;
    *display: inline;
    *zoom: 1;
}

.bx-pager-link {
    overflow: hidden;
    height: 0;
    padding-top: 25px;
    width: 26px;
    margin: 0 5px;
    display: block;
    background-image: url("../img/pagination.png");
    background-position: center 0;
    background-repeat: no-repeat;
}

.bx-pager-link.active {
    background-position: center -26px;
}

.block02 {
    position: relative;
    width: 1127px;
    height: 744px;
    margin: auto;
    left: 23px;
    margin-top: -16px;
}

.btn02 {
    position: absolute;
    bottom: 46px;
    right: 133px;
}

.block03 {
    position: relative;
    width: 1084px;
    height: 734px;
    margin: auto;
    margin-top: 37px;
    left: 1px;
}

.block04 {
    position: relative;
    width: 1102px;
    height: 766px;
    margin: 0 auto 40px;
    margin-top: 1px;
    left: -9px;
}

.btn03 {
    position: absolute;
    bottom: 90px;
    left: 125px;
}

.btn04 {
    position: absolute;
    bottom: 90px;
    right: 86px;
}

.character-sub01 {
    position: absolute;
    top: -32px;
    left: -110px;
    width: 132px;
    height: 149px;
}

.character-sub02 {
    position: absolute;
    top: 182px;
    right: -157px;
    width: 211px;
    height: 196px;
}

.character-sub03 {
    position: absolute;
    top: 2px;
    left: -140px;
    width: 273px;
    height: 295px;
}

.character-sub04 {
    position: absolute;
    bottom: -99px;
    right: -131px;
    width: 155px;
    height: 165px;
}

.sns4 img {
    position: relative;
    top: 2px;
}

.sns5 img {
    position: relative;
    top: 3px;
}

.block04 .openid-area {
    position: absolute;
    bottom: 46px;
    left: 580px;
}

.block04 .openid-area li {
    margin-right: 8px;
    display: inline-block;
    *display: inline;
    *zoom: 1;
}

.main-visual .openid-area {
    position: absolute;
    z-index: 12;
    bottom: 35px;
    left: 270px;
}

.main-visual .openid-area li {
    display: inline-block;
    *display: inline;
    *zoom: 1;
    margin-right: 3px;
}

.share-area {
    position: absolute;
    top: 21px;
    right: 110px;
}

.share-area li {
    margin-right: 8px;
    display: inline-block;
    *display: inline;
    *zoom: 1;
}

.btn-popup {
    position: absolute;
    top: 583px;
    left: 320px;
    z-index: 10;
}