/*


 */
body { color: #333; background-image:none;  background-color:#00002c !important; font-family: 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; }

.pure-g [class*="pure-u"],
.pure-g.pure-g      {  font-family: 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; }

#bg_tr          { background:url('main_bg.jpg') center top no-repeat; background-color:#27100e; width:100%; height:100%; position:fixed; z-index:-3 }

#bg_tr.bg_dark      { opacity: 0.3; }


/* Quicksand, 游ゴシック体, 'Yu Gothic', YuGothic,  */

a:link,
a       { text-decoration:none;  }

a ,a:link ,a:visited {
    color: rgb(190, 93, 13);
  }

a:focus, *:focus { outline:none; }

p {
    line-height: 1.6em;
}


h2, h3 {
    letter-spacing: 0.25em;    
    font-weight: 600;
}

h3          {
    font-weight: bold;
    font-size: 120%;
    color: #450881;
}


#g_head_wrap                { overflow:hidden; }
#header                     {  max-width: 900px; }

#header h2  		     { margin: 6px 0 3px; }

#g_body_wrap                {  }


#contents_wrap              {  margin:0 auto 10px; max-width:1000px; background:rgb(1, 1, 1); box-shadow:0 0 30px 2px rgba(255,255,200,0.75); letter-spacing:normal;  }

#contents_wrap.bgimage_wrap                 { background:url('bg_cstm02.png') center top no-repeat, rgb(26, 1, 1); }




#contents_head              {  }


footer                      { margin:2em auto 1em; }
.footer_bg                  { text-align:center; margin-top:1em; padding:0 0.5em; }
.footer_bg small            { font-size:75%; color:#fff; line-height:1.2; }



.main_box_wrap              { padding:10px 1%; }



.adtag_area                     { height:1px; overflow:hidden; }


.page_top                       { text-align:right; margin:0.5em 0; }



/* sns linker */
.sns {
    margin: 0 auto;
    padding: 3rem 0 1rem;
    z-index: 1;
    position: relative;
    text-align: center;
}

.sns a {
    display: inline-block;
    margin: 0 0.8em;
    line-height: 1;
    transition: all .3s;
}

.sns a img {
    padding: 1.6vw;
    width: 50px;
}

.sns .tw { background: #1DA1F2; }
.sns .ln { background: #00b900; }
.sns .yt { background: #f00; }





/* 2box col */


.fbox_wrap                  {  }
.fbox                       { box-sizing: border-box;  overflow: hidden;  display: flex; } /* max-height: 300px; */

#mov_wrap2           { margin: 10px auto;  width: 100%;  max-width:600px;  }
#mov_wrap2 a:hover {
    filter: saturate(120%) drop-shadow(0 0 6px rgba(158, 6, 6,0.7));
}




#mov_wrap,
#tw_bg           {   }

#mov_wrap        { width: 100%; background:url('mov_thn.jpg') center  no-repeat; background-size: cover;  }
#tw_bg           { overflow: auto; width: 100%; max-width: 800px; max-height: 400px; margin: 10px auto;  }

#mov_wrap a      { display: block; height: 100%; width: 100%; }




.blk_wrapper    { margin: 2.0em auto; }

.cont_blk h5 			{ font-weight: bold; font-size: 1.0rem; color: hsla(5,10%,70%,1.0); margin-bottom: 0.75em; }
.game_feature_wrap              { scroll-snap-type: y mandatory; }

.game_feature              { scroll-snap-align: start; font-size: 80%; line-height: 1.4; box-sizing: border-box;
     padding: 0.25em; line-height: 1.1; margin: 0 auto 1em; max-width: 900px;    }

.game_feature h5             {   }
.game_feature p             { color: #aaa;  }




/* 2003 apendblk */
.blk_begginer                { padding: 1em; border: 2px solid hsla(4, 100%, 69%, 0.99); border-radius: 0.5em; margin: 0 auto 2em; max-width: 860px;   }

.cont_blk .blk_begginer_tit  { color:hsla(4, 73%, 55%, 0.99) ;  }












/* lecture_blk */

.hd_cp                      { margin: 0 auto 5em;  }

.game_lecture_wrap          { max-width: 860px; margin: 0 auto 2em;  }

.mov                { width: 100%; }


.cont_blk .game_lecture_title         { color:hsl(51, 90.4%, 55.1%); font-size: 200%; margin-bottom: 0.25em; }
.game_lecture_body_copy         { color: #FFF; font-size:140% ; margin-top: 2em;  }

.game_lecture_wrap              { margin-bottom: 4em;  }




.game_feature_lecbt             { max-width: 900px;  }


.game_feature_wrap .game_feature_lecbt       { margin:0 auto 2em;   }

.min_atention                       { margin: 1em auto; }
.min_atention li                    { font-size: 1em; color:#777; text-align: right;  }


/* slick */

.game_disc-img_wrap             { width: 95%; margin: 2.0em auto; }

.slack_wrap                     {  }

.slack_wrap dd                  { margin: 0.1em ;  }

.slack_wrap .pure-img           {   }


.slick-slide            {  } /* max-height:500px; */

 .slick-slide img       {  margin: 0 auto; width: 95%; }


.logo_wrapper           { text-align: center; }
.logo-img                   { display: inline-block; margin: 0 auto; }



.data-app-wrap          { width: 100%; margin: 2.0em auto; max-width:800px ;  }
.data-app-table         { width: 100%; background: #ddd; font-size: 90%; }

.data-app-table td        { padding: 0.4em }


.data-app-table li                   { line-height: 1.4;  }
.data-app-table li.li_attention          { font-size: 90%;  }



.button-play                    {  background: #1e295f;  color: #FFF !important; font-size:120%; /* border: 1px solid #fff; */
box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.3);
    border-radius: 1em;
    font-weight: bold;
    position: relative;
    display:block; width:90%; margin:6px auto; }
     
.button-play:visited ,
.button-play			{ background: #293270; background: linear-gradient(to bottom, #293270 0%,#1e295f 75%); }


.button-play:focus ,
.button-play:hover ,
.button-play:active	{ background: #1e295f; background: linear-gradient(to bottom, #1e295f 0%,#1e295f 90%); }     
 
 
 
.new_user 			{ padding:0.5em; }
a.img-wrap 			{ display:block; margin: 0.5em auto;  }
a.img-wrap img      { margin: 0 auto;  }

 
#game_disc              {  }
/* background:url('main_bg.jpg') center top no-repeat; background-size:cover; */
#game_disc h3           {  }
     
#game_disc p            { font-size:120%; line-height:1.5; }


.cont_blk 		 	{ margin-top:1em; padding:0.5em; border-radius:1em;  color:#555; overflow: hidden; }


.cont_blk h3 		{
color:hsla(10,0%,100%,1.0); 
font-size: 170%;
line-height: 1.4; text-align: center;
 }

 
.cont_blk h4 			{ font-weight: bold; font-size: 1.4rem; color:#fbbd00; margin-bottom: 0.25em; text-align: center;   }
.cont_blk h4+p 			{ font-weight: bold; font-size: 1.0rem; line-height:1.2; margin-bottom: 0.5em; }

.cont_blk h6            { font-weight: bold; font-size: 1.1rem; color:#ddd; text-align: center;  } 


.pre_oder_blk           { border: 2px solid #900; border-radius: 1em; padding: 1.2em; background-color:hsla(5,50%,100%,0.1);
    margin: 2em auto; max-width: 800px; box-sizing: border-box; }


#download_blk.pre_oder_blk              { margin-top: 0;} 


.pre_oder_blk_notice        { padding: 1em; border-radius: 0.8em; margin: 0.75em auto; background-color: hsla(55,95%,85%,1.0);  font-size: 0.85em; color: #333; }
.pre_oder_blk_notice h6     { font-size: 1.2rem; line-height: 1.3; margin-bottom: 0.25em; color: #900; border-bottom: 1px solid; display: inline-block; }

.notice_ul li                 { font-size: 1.1rem; line-height: 1.1; margin-top: 0.5em; margin-left: 1em; text-indent: -1em; }


.pre_oder_blk_notice.upper_area             { text-align: center; max-width: 500px; margin: 0 auto; padding: 0.25em; }




.new_user .icon_intext,
.icon_intext            { width: 1.5em; display: inline-block; margin-right: 0.5em; }


.pre_order_mod_wrap     { max-width: 800px; margin: 1em auto 0; }
.pre_order_mod          { padding: 0 0.5em 1em; box-sizing: border-box; }

.pre_order_mod img:hover   { filter: drop-shadow(0 0 6px rgb(158, 6, 6)); }

.sns_wrap .pre_order_mod .btn-wrap:hover   { filter: drop-shadow(0 0 6px rgb(158, 6, 6)); }

.pre_order_mod img         {  margin: 0 auto; max-height: 70px;  } /*  */

.sns_wrap .btn-wrap    {
margin: 0 auto;
line-height: 40px;
border-radius: 1em;
font-size: 15px;
background: #222;
max-width: 290px;
text-align: left;
box-sizing: border-box;
}

.sns_wrap .btn-wrap a {  text-decoration: none; display: block;  padding: 0.5em 0.1em 0.5em 0.5em; }

.sns_wrap .btn-tw             { border: 2px solid #aaa; }
.sns_wrap .btn-ln             { border: 2px solid #aaa; }
.sns_wrap .btn-ml             { border: 2px solid #aaa; }

.sns_wrap .btn-tw a            { color: #fff;  }
.sns_wrap .btn-ln a            { color: #fff;  }
.sns_wrap .btn-ml a            { color: #fff;  }

/*
.sns_wrap .btn-tw a            { color: #00acee;  }
.sns_wrap .btn-ln a            { color: #00b900;  }
.sns_wrap .btn-ml a            { color: #da342c;  }
*/


.sns_wrap    { width: 40px; margin: 0 0.75em 0 0;  display: inline-block; }


#live_bcast.pre_oder_blk            { padding: 0.5em; max-width: 964px; }

.live_wrap .btn-wrap                { background:
    #eee; max-width: 360px; margin: 0 auto;
    padding: 0.2em; border-radius: 0.5em; border: 1px solid #555; }

.btn-wrap.btn-pli               { background: #34a1c8; }






.live_blkwrap               { padding: 0.75em 0.25em; border-radius: 0.5em; background: url("live001.jpg") ;  background-size:cover; margin-bottom: 1em; }

.live_blkwrap.live_blkwrap2             { background-image: url("live002.jpg");  }

.live_blk_live_disc         { font-size: 0.95rem; color:rgb(255, 228, 177); margin: 0.25em auto; line-height: 1.4; padding: 0.75rem;   }


.live_inner_blk:hover,
.live_wrap .btn-wrap:hover      {  filter: drop-shadow(0 0 6px rgb(208, 106, 106)); }


.live_wrap .btn-wrap img            { display: block; max-width: 200px;  }

.live_wrap .pre_order_mod               { text-align:center; }
.live_wrap .pre_order_mod img:hover      { filter: none; }


.live_inner_blk                         { margin-top: 0.75em; text-align: left;  }

.live_inner_blk .icon_intext            { width: 1.0em; margin-right: 0.2em; }
.live_inner_blk a                       { color: #ccc;  }
.live_inner_blk div                     { text-indent: -1.2em; margin-left: 1.2em; padding: 0 0.2em; }



.btn_lead           { font-size: 0.75rem; color:#ccc;  }

strong.btn_lead           { font-size: 1.0rem; font-weight: bold; color:#eee; margin-top: 0.25em; display: block;  }


.btn_inact                  { filter: brightness(0.3); }
.pre_order_mod.btn_inact img:hover      { filter: none; }


.new_user.cont_blk h5 			{
font-weight: bold;
font-size: 1.1rem;
width: 96%;
padding: 0.2em;
display: block;
box-sizing: border-box;
margin: 1em auto 0;
background: #666;
color: #fff;
}

.cont_blk hr 			{ width: 98%; margin: 1em auto 1.5em; }


.tb_reward 				{ width: 96%; margin:0.25em auto 2em; }

.tb_reward th,
.tb_reward td 				{ padding: 0.4em; vertical-align: middle; font-size:98%; }

.tb_reward .tb_reward-tit 	 			{ width:16%; font-weight:bold; }
.tb_reward .tb_reward-img 				{ border-left: 1px solid #999 !important; }
.tb_reward .tb_reward-img img 				{ min-width:20px;  }

.tb_reward .tb_reward-name				{ width: 28%; }
.tb_reward .tb_reward-disc				{ width: 49%; }






.game_title_wrap        { margin:2em 0 0;  }
    
.game_title_wrap h3     {  letter-spacing:normal;  }
 
.gt_img img             {  }


.g_ss_wrap li          { padding:0.5em; box-sizing:border-box;  }

.g_ss_wrap img         { width:100%; border:1px solid #777; }


.best4_box div          { margin:0.5em; }
.best4_box img          { margin:0 auto; }


.gamelist_wrap          { margin-top:1em;  }


.best4_box              {  }

.mygc_datajs_wrap       { margin-top:1em;  }


.game_title             { box-sizing:border-box;  margin:0.5em; border-radius:1em;  clear:both; overflow:hidden; background:#BDF; }

.game_title.gt1,
.game_title.gt2         { background:#fda;  }


.game_title.gt0         { background:#900; color:#FFFFFF; font-weight:bold; }


.game_title img         { width:100%; }
.game_title.gtex         { padding:1em; background:#bdf; }

.game_title.gtex strong  { font-weight:bold; font-size:120%; color:#20A; }


.game_title.gtex .attention     { color:#20A; }

.game_title .tx_wrap     { padding:0.5em; }

.game_title .tx_wrap h5  { font-size:120%; font-weight:bold; }

img.max_w_ctrl           { width:auto; margin:0 auto; }


.gt_inner                   { padding:1.0em; }


.cam_intro                  { font-size:120%; }

.t_scd                      { border-radius:1em; display:inline-block; font-weight:bold; padding:0.25em 1.0em; margin:0.25em 0; background:#911; color:#fff;  }



/*  */

.rew_table                          { background:rgba(255,255,255,0.9); margin:1em auto; }
.rew_table tr                       {  }


.rew_table th,
.rew_table td                       { width:30%; padding:0.25em 0.5em;   }

.rew_table th                       {  border-bottom: 1px solid #cbcbcb; background:rgba(110,0,0,0.90); color:#fff;  }



.rew_table .col_quest_name          { width:40%; }


.rew_table th.col_quest_name          { background:rgba(140,0,0,0.90) }
.rew_table td.col_quest_name          { background:rgba(250,200,200,0.90); color:#555; font-weight:bold; }


/*  */








h3+.game_title  {  }

.gt_img                 { width:28%; float:left; }
.gt_disc                { width:71%; margin-left:1%; float:left; vertical-align:top; }

.gt_disc h4             { font-weight:bold; font-size:150%; margin-bottom:0.25em; padding-bottom:0.25em; border-bottom:1px dotted #555; color:#444;  }

.gt_disc dl             {   }
.gt_disc dt             { display:inline-block; font-weight:bold; font-size:110%; margin-bottom:0.5em; background:#F62; padding:0.5em; color:#fff; border-radius:0.5em; }
.gt_disc dd             {  font-size:120%; }



.gt_banner              { clear:both; padding:10px 0 0; }



.gt_caminfo             { clear:both; padding:1.0em; background:#FFFFFF; border:2px solid #b00; border-radius:0.5em; margin:0.5em auto;  }

.gt_caminfo h5          { font-weight:bold; }

.gt_caminfo p           { line-height:1.2;  }




/* youtube flex */

.youtube_mov_wrap			{  max-width:800px; margin:0 auto 10px; padding:0.5em; line-height: 0; } /* box-shadow: 0 0 5px rgba(0, 0, 0, 0.7);  */

.t_promo,
#t_promo {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}



.t_promo iframe,
#t_promo iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}


.chara_wrap     { width:100%; margin:0 auto; position:fixed; bottom:410px; z-index:-1 }

.chara_wrap .lefty_pos       { position:absolute; right:50%; }
.chara_wrap .righty_pos      { position:absolute; left:50%; }

.chara_wrap li img           { -webkit-filter: drop-shadow(2px 2px 4px rgba(0, 0, 0, 0.5)); filter: drop-shadow(2px 2px 4px rgba(0, 0, 0, 0.5)); }





.bt_wrap {
    text-align: center;
    margin: 1em auto 1em;
}

.bt_wrap a 		{ display: inline-block; }


.bt_wrap a:hover {
    filter: saturate(120%);
}

.bt_wrap img 		{ display:block; margin:0 auto;   }


.play_alert 				{ font-weight:bold;   }

.play_alert a 			{ display:inline;  }



.ft_bn_blk              { margin: 1em auto; max-width: 500px;  }



/* common hack */

.common_sng_dox,
.campaign_common_mygcdata .btn_mygc_box,
.campaign_common_mygcdata .wp      { width:auto; }




/* body id exclusive */


.new_user img           { display:block; margin:0 auto 0;  }



.btn_mygc_box            { display:none; }




/* ex block  */
.blk_exelm                  { margin:16px auto; max-width:900px;  }



/* glower eff */

.ex_ef_glow  { 
-webkit-animation: ex_ef_glower 10s ease-in -2s infinite alternate;
animation: ex_ef_glower 10s ease-in -2s infinite alternate;
 }


@-webkit-keyframes ex_ef_glower {
    0% {   box-shadow:0 0 10px 2px rgba(70,90,255,0.9); }
	50% {  box-shadow:0 0 16px 4px rgba(120,160,255,1.0); }
    100% { box-shadow:0 0 10px 2px rgba(70,90,255,0.9); }
}

@keyframes ex_ef_glower {
    0% {   box-shadow:0 0 10px 2px rgba(70,90,255,0.9);  }
	50% {  box-shadow:0 0 16px 4px rgba(120,160,255,1.0); }	
    100% { box-shadow:0 0 10px 2px rgba(70,90,255,0.9); }
}




/* bg effect */

.ex_ef_wrap	 {
	
-webkit-animation: ex_ef 30s linear 0s infinite normal;
animation: ex_ef 30s linear 0s infinite normal;

}


@-webkit-keyframes ex_ef {
    0% { -webkit-filter: hue-rotate(0deg);  }
	50% { -webkit-filter: hue-rotate(180deg); }
    100% { -webkit-filter: hue-rotate(360deg); }
}

@keyframes ex_ef {
    0% {   filter: hue-rotate(0deg);   -webkit-filter: hue-rotate(0deg); -ms-filter: hue-rotate(0deg);  }
	50% {  filter: hue-rotate(180deg); -webkit-filter: hue-rotate(180deg); -ms-filter: hue-rotate(180deg); }	
    100% { filter: hue-rotate(360deg); -webkit-filter: hue-rotate(360deg); -ms-filter: hue-rotate(360deg); }
}




/* modal */
.modaal-container          { max-width: 860px !important; }

.ex_msg_blk                 { max-width: 800px; margin: -1em auto 4em;   /*  0 auto 1em */
    padding: 0.5em;
    text-align: center;
    background:
    #eee;
    border-radius: 1.0em; border: 2px solid #900;
    box-sizing: border-box;

}

.ex_msg_blk a             { color:hsl(5, 85%, 40%); display: block; }

.ex_msg_blk b             { font-weight: bold; font-size: 110%; line-height: 1.5; }


.ex_msg_blk2                { margin: 0 auto 1em; }

.info_pop_wrap              { color: #333; font-size: 100%; }
.info_pop_wrap p            { margin-bottom: 0.25em; }


.info_pop_wrap b            { color:hsl(5, 85%, 40%); }


.info_pop_wrap2 h5      { margin-bottom: 1.0em; }
.info_pop_wrap2 div    { line-height: 1.6; margin-bottom: 3.5em;   }

.info_pop_wrap2 div:last-child      { margin-bottom: 1.0em; }


.info_pop_wrap2 h4       { font-size: 1.25em; color:hsl(5, 85%, 40%);  }

.info_pop_wrap2 h6       { font-size: 105%; color:hsl(28, 100%, 31%);  }


.info_pop_wrap2 dl          { font-size: 0.9em; margin-left: 0.5em; margin-bottom: 1.25em; }
.info_pop_wrap2 dt          { font-weight: bold;   }
.info_pop_wrap2 dd          { margin-left: 1em; margin-bottom: 0.5em; }


.attention                   {   }
ul.attention                 { font-size:85%; text-align:left; margin-top:0.5em; }

ul.attention li              { color:hsl(5, 85%, 20%); margin-left:1.2em; text-indent:-1em;  margin-bottom:0.5em; line-height:1.1; }









/* MEDIA QUERIES */

/*
 * -- TABLET (under) MEDIA QUERIES --
 */
@media(max-width: 767px) {

/* min */

#g_head                         { background-size:80% 80%; padding-bottom:4px; }
#header h2                      { background-size:contain; width:90px; height:24px; }

#contents_wrap              { margin-top: 0;   }


.pre_oder_blk_notice h6     { font-size: 0.9rem;  }
.notice_ul li               { font-size: 0.8rem;  }

    .banner-head                            { margin-top:0; }

    .main_contents .block_wrap            { padding:0 ; }
    
    #menu_start                 { max-width:610px; }
    
    #footer                     { margin-bottom:50px; } /* fixed block height */
    
    #under_block                    {  width:100%; }
    
    #under_block                    {   position:fixed; bottom:0; left:0; }

    #under_block .block_wrap        { height:50px; background:rgba(0,0,0,0.6);  }

.ex_ef_glow         { animation:none; }


.cont_blk               { margin-top: 0; }
.hd_cp                  { margin-bottom: 1em; }
.cont_blk h3            { font-size: 3vw; }
.cont_blk .game_lecture_title          { font-size: 4vw; }
.game_lecture_body_copy                 { margin-top: 0; font-size: 2.8vw;  }
.game_lecture_wrap                      { margin-bottom: 1.5em; }

.mov                            { width: 75%; margin: 0 auto; display: block;  }

.live_inner_blk                 { text-align: center; }


}

/*
 * -- PHONE MEDIA QUERIES -- 479px
 */
 
.for_sp          { display: none }

@media (max-width: 567px) {
    .for_pc          { display: none }
    .for_sp          { display: block }
    .pre_order_mod img         {  margin: 0 auto; max-width: 240px; max-height: 100%;  } /* max-height: 70px; */

    .sns_wrap .btn-wrap          { max-width: 240px;}

    #g_body_wrap     { min-width:320px; overflow:hidden;  }   /* min-width:320px;  */

    .banner {
        height: 200px;
        margin-bottom: 1em;
    }

 

    
}