@charset "UTF-8";

/*========================================
               PRINT CSS ON LAST 
==========================================*/

/* ========margin上下は、基本bottomで指示======== */
/* ========nav内ulは、nav_cssで指示======== */

/*========================================
                  BASIC 
==========================================*/


* { margin:0; padding:0; /*全要素のマージン・パディングをリセット*/
}

* { border:0; /*全imgのborderは0*/
}


* { font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
    font-weight: 500;
    color:#111111;
    font-size:16px;
    line-height:2;
    letter-spacing:0.1em;
}

a { text-decoration:none;
    font-size:16px;
    color:#111111;
    letter-spacing:0.1em;
}
     a:hover { color:#468efa;
     }

/* ===========================================================
              LARGE DIV CONST 

[--------------------body ----------------------]
  [------header:width:100% With BG Image------]
   [------------ in_head_:W1024px ------------]
   [-------------- nav:W1024px ---------------]
  [-----------wrapper:width:100%--------------]
  [------ main:width:100% With BG Color------]
   [------------in_main:W1024px---------------]
  [--------footer:100%  With BG Color---------]
   [-------------in_foot:W1024px--------------]

=========================================================== */

html { width:100%;
}

/*body背景はYouTube動画*/
body {  width:100%;
        margin-top: 0px;
        background-color :#f3f2d6;
}


/* ================================
            LARGE DIV Style
================================ */

div#out-drawer { display:none;
}

#youtube { width:100%;
           max-height:858px;
}


header { width:100%;
         height:165px;
         position: absolute;
         top: 0;
         left: 0;
         z-index:2;
         background : url(../image/bg/top_bg.png) top center repeat-x rgba(13,106,96,0.5);
}

header.h_sub { width:100%;
         height:175px;
         position: absolute;
         top: 0;
         left: 0;
         z-index:2;
         background : url(../image/bg/top_bg.png) top center repeat-x transparent;
}

div.wrapper { width :100%; 
              height: auto;
              margin:0;
              padding:0;
}

div.in_head { position:relative;
              width :100%;
              height:78px;
              padding-top:26px;
              margin:0 auto 0;
}

nav { width :960px;
      margin:10px auto 0;
}

main { width :100%;
       background-color :#f3f2d6;
}

div.in_main,div.in_main_close,div.in_main_sub 
{ position:relative;
  width :980px; 
  margin:0 auto 0;
  padding-top:80px;
  padding-bottom:140px;
}

     div.in_main_sub { padding-top:15px;
     }

     div.in_main_close { overflow: hidden;
                         padding-top:190px;
     }

footer { width :100%;
         height:240px; 
         margin:0 auto 0;
         padding-top:10px;
         background-color : #0d6a60;
}

div.in_foot { width :960px;
              height:190px; 
              margin:0 auto 0;
}


/* ================================
      DETAIL DIV Style A TO Z
================================ */

div.c_zone,div.c_zone_bt { position:relative;
             width:984px;
             background-color : #ffffff;
             margin:0 auto 50px;
}

     div.c_zone_bt { margin:0 auto 110px;
     }

div.k_zone { clear:both;
             width:800px;
             margin-left:120px;
             padding-bottom:30px;
}

div.n_zone,div.qa_zone { width:984px;
             background-color:#ffffff;
             margin:0 auto 50px;
             padding:30px 0 20px 0;
}

     div.qa_zone { border-radius:8px;
     }

div.m_zone { width:954px;
             background-color:#ffffff;
             margin:0 auto 50px;
             padding:20px 0 50px 0;
}

div.rule_zone,div.rule_zone2 { clear:both;
                width:924px;
                padding:20px ;
                margin:0 auto 90px;
                background-color : #ffffff;
                border-radius:8px;
                border:2px solid #ff0000;
}

      div.rule_zone2 { border:none;
     }

div.prev_info,div.prev_info_l,div.prev_info_l_d,div.prev_info_d 
{ position:absolute;
right:40px;
top:125px;
z-index:2;
width:510px;
padding-top:38px;
padding-bottom:25px;
background: url(../image/bg/trans.png) left top repeat transparent;
}

      div.prev_info_l { left:40px;
      }

div.prev_zone { position:relative;
                width :980px;
                height:460px;
                margin-bottom:42px;
}

div.prev_zone2 { position:relative;
                 width :980px;
                 height:460px;
                 margin-bottom:82px;
}

/* ================================
      nav li Styleは、nav_cssで指示
================================ */

/* ================================
            H Style
================================ */

/* =======In header========= */
h1 { text-align:center;
}

/* =======In main ========= */
h2 { 
}


/* ================================
             FONT Style
================================ */

/* ========p Style general ======== */

p { font-size:16px;
}

p.messa,p.song_name,p.song_detail_ly,p.song_detail_ly_ind,p.news,p.name,p.comic,p.comic2,p.comic3
{ font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
  font-weight: 500;
}


/* ======================================== 
               p Style A TO Z
======================================== */
 
p.comic { text-indent:1em;
          font-size:20px;
          font-weight:bold;
          width:800px;
          line-height:1.6;
          margin:0 0 50px 100px; 
}

p.c_detail { float:left;
             width:440px;
             margin:0 0 20px 25px; 
}

p.comic2 { font-size:20px;
           font-weight:bold;
           margin:0 0 50px 34px; 
}

p.comic3 { font-size:20px;
           font-weight:bold;
           line-height:1.6;
           margin:0 0 15px 34px; 
}

p.foot_p { clear:both;
           text-align:center;
           font-size:13px;
           color:#ffffff;
           line-height:2;
}

p.kyoka { 
          text-align:center;
          width:700px;
          margin-bottom:30px;
}

p.in_box { font-size:18px;
           margin:0 20px 0 20px;
}

p.in_navi_sp { display:none;
}

p.messa { font-size:22px;
          font-weight:bold;
          letter-spacing:0.1em;
          color:#111111;
          line-height:2;
          margin:0 0 100px 40px;
}

p.name { font-size:26px;
         font-weight:bold;
         margin:0 0 20px 100px;
}

p.news,p.c_title,p.music { float:left;
         width:510px;
         font-size:20px;
         font-weight:bold;
         color:#01703b;
         margin:0 0 20px 25px; 
         padding:10px 0 0 32px;
         background : url(../image/bg/bar.png) top left no-repeat transparent;
}

     p.c_title { width:380px;
                 margin-top:30px;
     }

     p.music { width:640px;
                margin:0 0 20px 34px; 
     }

p.news_detail { float:left;
                width:510px;
                margin:0 0 20px 25px; 
}

p.news_detail_bt { float:left;
                   width:500px;
                   margin:0 0 80px 25px; 
}

p.num_p,p.num_p_pc { text-align:center;
          margin-bottom:8px;
}

p.num_p_sm { display:none;
}

p.song_detail { line-height:2;
                margin:0 40px 30px 40px;
}

p.song_detail_ly { font-size:20px;
                   margin:0 40px 25px 40px;
                   line-height:1.5;
}

p.song_detail_ly_ind { font-size:20px;
                       margin:0 40px 25px 110px;
                       line-height:1.5;
}

p.song_info { font-size:16px;
              line-height:2;
              margin:0 40px 73px 34px;
}

p.song_info_s { font-size:16px;
              line-height:2;
              margin:0 40px 13px 34px;
}

p.song_name { font-size:26px;
              font-weight:bold;
              color:#01703b;
              margin:0 0 20px 34px;
}

p.thanks { clear:both;
           margin:0 0 20px 34px; 
}

p.thanks_r { clear:both;
             color:#ff0000;
             margin:0 0 20px 34px; 
}


p.title,p.title_close,p.title_close_dl,p.title_de,p.title_no,p.title_no2,p.title_c,p.title_s,p.title_w
                    { text-align:center;
                        font-size:20px;
                        width:954px;
                        color:#01703b;
                        letter-spacing:0.1em;
                        padding-bottom:45px;
                        border-bottom:1px solid #000000;
                        margin:0 0 75px 20px;
                        line-height:1;
}

     p.title_close_dl { padding-top:95px;
                        padding-bottom:45px;
     }

     p.title_no { margin-bottom:50px;
                  border-bottom:none;
     }


     p.title_no2 { margin-bottom:20px;
                   border-bottom:none;
     }

     p.title_c { clear:both;
                 margin:0 0 35px 20px;
     }

     p.title_s { margin-bottom:20px;
     }

p.title_no_sp { display:none;
}

p.use,p.use_sp { margin:0 0 20px 0;
        text-indent:-1em;
        padding-left:1em;
        padding-bottom:2px;
        line-height:1.5;
        border-bottom:1px dashed #aaaaaa;
}


p.w_ico { font-size:18px;
          text-indent:-3.8em;
          padding-left:3.8em;
          margin:0 20px 25px 40px;
}

p.w_ico_b { font-size:18px;
            font-weight:bold;
            color:#01703b;
            margin:0 0 25px 40px;
}

/* ================================
           a Style A TO Z
================================ */

a.comic_cara { display:block;
               font-size:16px;
               color:#01703b;
               margin:0 0 60px 34px;
}

a.song_comic { position:absolute;
               bottom:25px;
               left:20px;
               font-size:16px;
               color:#01703b;
}

a.song_dl { font-size:20px;
            font-weight:bold;
             color:#01703b;
            margin:0 0 15px 20px;
}


a.song_to_yt { font-size:16px;
               color:#01703b;
               margin:0 0 0 34px;
}

a.sp_re,a.sp_re_foot { display:none;
}

a.to_comic,a.to_comic2,a.to_comic3 { display:block;
             float:left;
             text-align:center;
             font-size:16px;
             color:#01703b;
             margin:0 0 0 34px;
}

      a.to_comic2 { margin:38px 0 0 45px;
      }

      a.to_comic3 { margin:28px 0 0 45px;
      }

a.to_mail { display:block;
            clear:both;
             font-size:16px;
             color:#01703b;
             margin:0 0 50px 60px;
}

/* ================================
           img Style A TO Z
================================ */

img.ba,img.ba_seki { width:751px;
         height:219px;
}

img.ba_sp { display:none;
}

img.img_cara { width:910px;
}
 
img.img_cara_sp { display:none;
}

img.close { width:18px;
            height:18px;
            margin:0 6px 0 0;
            vertical-align:-0.2em;
}

img.dl { width:300px;
         padding-top:30px;
}

img.img_comic { float:right;
                width:500px;
                height:480px;
}

img.img_comic2 { float:right;
                 width:500px;
                 height:627px;
}

img.img_comic3 { float:right;
                 width:500px;
                 height:1629px;
}

img.img_comic4 { float:right;
                 width:472px;
                 height:511px;
}

img.con { float:right;
          margin:0 20px 0 0;
          width:391px;
          height:293px;
}


img.concert { float:right;
              margin:0 30px 0 0;
              width:370px;
              height:237px;
}

img.fb { width:32px;
         height:32px;
         border-radius:2px;
}

img.fb_f { display:none;
}

img.logo { width:381px;
}

img.logo_f { display:none;
}

img.logo_main { width:102px;
                height:89px;
                margin-bottom:5px;
}

img.my { width:249px;
         height:106px;
}

img.img_n { width:139px;
            height:82px
}

img.img_cara { width:910px;
               height:583px;
}


img.img_c { width:211px;
            height:86px
}

img.img_comi { width:321px;
               height:111px
}

img.img_intro { width:349px;
                height:93px
}

img.img_qa { width:217px;
             height:102px
}

img.img_new { width:364px;
               height:107px
}

img.mic { width:36px;
          height:36px;
          margin:0 25px 0 0;
          vertical-align:-0.3em;
}

img.nt { width:135px;
         height:71px;
}

img.num { width:54px;
          height:58px;
}

img.own { width:80px;
}

img.prev,img.prev_r { width:553px;
                      height:311px;
                      margin-left:40px;
                      box-shadow:10px 10px 10px #777777;
}

     img.prev_r { float:right;
                  margin-right:40px;
     }

img.prev_detail { width:450px;
                  margin:0 0 20px 40px;
                  box-shadow:6px 6px 6px #777777;
} 

img.top_img {  min-width: 100%;
               min-height: 100%;
               width: auto;
               margin-top:100px;
               padding:0;
}

img.top_img_ipad { max-width: 100%;
                   margin-top:100px;
                   padding:0;
}

img.top_img_sp { display:none;
}

img.tri { width:52px;
          height:19px;
          margin-top:30px;
}

img.tw { width:80px;
}

img.url { position:absolute;
          top: 40px;
          left:20px;
          z-index:2;
          width:194px;
          height:31px;
} 

img.yt_ar { width:27px;
            height:14px;
            margin:0 0 0 7px;
}

img.word_ico { width:80px;
               height:56px;
               margin:0 0 15px 40px;
               border-radius:6px;
}

/* ================================
           span_font ETC STYLE
================================ */

span.bold  { font-weight:bold;
}

span.ind  { margin-left:14.2em;
}

span.no_show { color:#ffffff;
}


span.only_sp { display:none;
}

span.p140 { font-size:140%;
            color:#ffffff;
} 

span.p80 { font-size:80%;
} 

/* ================================
           iframe STYLE
================================ */


/* ================================
          FOR PRINT
================================ */

@media print {

body { background-color : #ffffff;
}

main { background-color : #ffffff;
}

}