@charset "UTF-8";

/* =============================================
 共通
============================================= */
html{
  height: 100%;
  overflow: auto;
}
body{
  background: #272727;
}
@media only screen and (max-width: 640px){
  body{
    padding-top: 17%;
  }
}
.vote_all{
  position: relative;
  width: 100%;
  max-width: 500px;
  margin: 0 auto;
  background: #000064 url(../img/vote_bg.jpg) 0 0 no-repeat;
  -webkit-background-size: 100% auto;
  background-size: 100% auto;
  padding-bottom: 60px;
}
#page-top{
  bottom: 25% !important;
}
.footer{
  padding-bottom: 250px;
}
.voteErr .footer{
  padding-bottom: 50px;
}
.none{
  display: none !important;
}
/* =============================================
 vote2.png
============================================= */
.vote_list_title2_txt,
.vote_txt_none_txt,
.vote_txt_after_txt,
.vote_txt_before_txt,
.vote_txt_cover_txt,
.voteCounter-inner:before,
.voteCounter-static7-inner:before,
.vote_finish_txt,
.vote_acpt_txt,
.vote_list_title_txt,
input[name="voteItem"]:checked + .list_inner:after,
.btn_vote_txt,
.voteChose_list:after,
.vote_btn_howto, 
.vote_howto_title,
.vote_ticket_title,
.list_img, 
.vote_list_bg_off, 
.vote_list_bg_on, 
.vote_list_bg_select, 
.vote_btn_mov_on, 
.vote_btn_mov_off, 
.vote_btn_combi, 
.vote_icon_select_on, 
.vote_select_title, 
.vote_catch_txt, 
.vote_catch2_txt, 
.vote_subtitle_txt, 
.vote_date_txt, 
.vote_title_txt, 
.voteList_title_txt_turn, 
.voteList_title_txt_entry{
  overflow: hidden;
  display: block;
  white-space: nowrap;
  text-indent: 100%;
  background: transparent url(../img/vote2.png) 0 0 no-repeat;
}

.vote_list_bg_off{
  width: 100%;
  height: 0;
  padding-top: 72.1973094170404%;

  background-size: calc( 750 / 223 * 100% ) calc( 5000 / 161 * 100% );
  background-position: calc( 0 * 100% ) calc( 1386 / (5000 - 161) * 100% );
}

.vote_list_bg_on{
  width: 100%;
  height: 0;
  padding-top: 72.1973094170404%;

  background-size: calc( 750 / 223 * 100% ) calc( 5000 / 161 * 100% );
  background-position: calc( 0 * 100% ) calc( 1215 / (5000 - 161) * 100% );
}

.vote_list_bg_select{
  width: 100%;
  height: 0;
  padding-top: 72.1973094170404%;

  background-size: calc( 750 / 223 * 100% ) calc( 5000 / 161 * 100% );
  background-position: calc( 0 * 100% ) calc( 1044 / (5000 - 161) * 100% );
}

.vote_btn_mov_on{
  cursor: pointer;
  width: 100%;
  height: 0;
  padding-top: 50%;

  background-size: calc( 750 / 138 * 100% ) calc( 5000 / 69 * 100% );
  background-position: calc( 0 * 100% ) calc( 1557 / (5000 - 69) * 100% );
}

.vote_btn_mov_off{
  width: 100%;
  height: 0;
  padding-top: 50%;

  background-size: calc( 750 / 138 * 100% ) calc( 5000 / 69 * 100% );
  background-position: calc( 154 / (750 - 138) * 100% ) calc( 1557 / (5000 - 69) * 100% );
}


.vote_btn_combi{
  width: 100%;
  height: 0;
  padding-top: 101.470588235294%;

  background-size: calc( 750 / 68 * 100% ) calc( 5000 / 69 * 100% );
  background-position: calc( 0 * 100% ) calc( 1636 / (5000 - 69) * 100% );
}

.vote_icon_select_on{
  width: 100%;
  height: 0;
  padding-top: 154.545454545455%;

  background-size: calc( 750 / 44 * 100% ) calc( 5000 / 68 * 100% );
  background-position: calc( 686 / (750 - 44) * 100% ) calc( 1626 / (5000 - 68) * 100% );
}

.vote_select_title{
  width: 100%;
  height: 0;
  padding-top: 31.4606741573034%;

  background-size: calc( 750 / 712 * 100% ) calc( 5000 / 224 * 100% );
  background-position: calc( 11 / (750 - 712) * 100% ) calc( 2945 / (5000 - 224) * 100% );
}



.vote_subtitle_txt{
  width: 100%;
  height: 0;
  padding-top: 37.0420624151967%;

  background-size: calc( 750 / 737 * 100% ) calc( 5000 / 273 * 100% );
  background-position: calc( 0 * 100% ) calc( 2162 / (5000 - 273) * 100% );
}

.vote_date_txt{
  width: 100%;
  height: 0;
  padding-top: 11.9284294234592%;

  background-size: calc( 750 / 503 * 100% ) calc( 5000 / 60 * 100% );
  background-position: calc( -1 / (750 - 503) * 100% ) calc( 1987 / (5000 - 60) * 100% );
}

.vote_title_txt{
  width: 100%;
  height: 0;
  padding-top: 20.6185567010309%;

  background-size: calc( 750 / 679 * 100% ) calc( 5000 / 140 * 100% );
  background-position: calc( 2 / (750 - 679) * 100% ) calc( 1806 / (5000 - 140) * 100% );
}

.voteList_title_txt_turn{
  width: 100%;
  height: 0;
  padding-top: 13.8263665594855%;

  background-size: calc( 750 / 622 * 100% ) calc( 5000 / 86 * 100% );
  background-position: calc( 64 / (750 - 622) * 100% ) calc( 872 / (5000 - 86) * 100% );
}

.voteList_title_txt_entry{
  width: 100%;
  height: 0;
  padding-top: 13.8263665594855%;

  background-size: calc( 750 / 622 * 100% ) calc( 5000 / 86 * 100% );
  background-position: calc( 64 / (750 - 622) * 100% ) calc( 700 / (5000 - 86) * 100% );
}
.voteChose_list:after{
  content: "";
  display: block;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  clear: both;
  width: 100%;
  height: 0;
  padding-top: 55.2%;

  background-size: calc( 750 / 750 * 100% ) calc( 5000 / 414 * 100% );
  background-position: calc( 0 * 100% ) calc( 239 / (5000 - 414) * 100% );
}

.btn_vote_txt{
  width: 100%;
  height: 0;
  padding-top: 25.531914893617%;

  background-size: calc( 750 / 376 * 100% ) calc( 5000 / 96 * 100% );
  background-position: calc( 0 * 100% ) calc( 96 / (5000 - 96) * 100% );
}

.voteChose_on .btn_vote_txt{
  width: 100%;
  height: 0;
  padding-top: 25.531914893617%;

  background-size: calc( 750 / 376 * 100% ) calc( 5000 / 96 * 100% );
  background-position: calc( 0 * 100% ) calc( 0 * 100% );
}
input[name="voteItem"]:checked + .list_inner:after {
    content: "";
    display: block;
    position: absolute;
    right: -1px;
    top: -11px;
    width: 18%;
    height: 0;
    padding-top: 27.5%;
    background-size: calc( 750 / 44 * 100% ) calc( 5000 / 68 * 100% );
    background-position: calc( 686 / (750 - 44) * 100% ) calc( 1626 / (5000 - 68) * 100% );
}
.vote_list_title_txt{
  width: 100%;
  height: 0;
  padding-top: 27.8551532033426%;

  background-size: calc( 750 / 718 * 100% ) calc( 5000 / 200 * 100% );
  background-position: calc( 12 / (750 - 718) * 100% ) calc( 3405 / (5000 - 200) * 100% );
  -webkit-transform: translateY(-53%);
  transform: translateY(-53%);

}


.vote_acpt_txt{
  width: 100%;
  height: 0;
  padding-top: 32%;

  background-size: calc( 750 / 325 * 100% ) calc( 5000 / 104 * 100% );
  background-position: calc( 213 / (750 - 325) * 100% ) calc( 3107 / (5000 - 104) * 100% );
}
.vote_finish_txt{
  width: 100%;
  height: 0;
  padding-top: 26.679462571977%;

  background-size: calc( 750 / 521 * 100% ) calc( 5000 / 139 * 100% );
  background-position: calc( 115 / (750 - 521) * 100% ) calc( 3236 / (5000 - 139) * 100% );
}
.vote_catch_txt{
  width: 100%;
  height: 0;
  padding-top: 19.4160583941606%;

  background-size: calc( 750 / 685 * 100% ) calc( 5000 / 133 * 100% );
  background-position: calc( 0 * 100% ) calc( 2493 / (5000 - 133) * 100% );
}
.vote_catch2_txt{
  width: 100%;
  height: 0;
  padding-top: 21.1800302571861%;

  background-size: calc( 750 / 661 * 100% ) calc( 5000 / 140 * 100% );
  background-position: calc( 49 / (750 - 661) * 100% ) calc( 3655 / (5000 - 140) * 100% );
}



.vote_list_title2_txt{
  width: 100%;
  height: 0;
  padding-top: 27.7333333333333%;

  background-size: calc( 750 / 750 * 100% ) calc( 5000 / 208 * 100% );
  background-position: calc( 0 * 100% ) calc( 4514 / (5000 - 208) * 100% );
  transform: translateY(-53%);
  -webkit-transform: translateY(-53%);
}

.vote_txt_none_txt{
  width: 100%;
  height: 0;
  padding-top: 8.0168776371308%;

  background-size: calc( 750 / 474 * 100% ) calc( 5000 / 38 * 100% );
  background-position: calc( 138 / (750 - 474) * 100% ) calc( 4415 / (5000 - 38) * 100% );
}

.vote_txt_after_txt{
  width: 100%;
  height: 0;
  padding-top: 12.7379209370425%;

  background-size: calc( 750 / 683 * 100% ) calc( 5000 / 87 * 100% );
  background-position: calc( 33 / (750 - 683) * 100% ) calc( 4256 / (5000 - 87) * 100% );
}

.vote_txt_before_txt{
  width: 100%;
  height: 0;
  padding-top: 12.8342245989305%;

  background-size: calc( 750 / 748 * 100% ) calc( 5000 / 96 * 100% );
  background-position: calc( 1 / (750 - 748) * 100% ) calc( 4127 / (5000 - 96) * 100% );
}


.vote_txt_cover_txt{
  width: 100%;
  height: 0;
  padding-top: 20.4255319148936%;

  background-size: calc( 750 / 470 * 100% ) calc( 5000 / 96 * 100% );
  background-position: calc( 140 / (750 - 470) * 100% ) calc( 4009 / (5000 - 96) * 100% );
}



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

.vote_type{
  width: 100%;
  margin: 0 auto;
  padding-top: 24%;
  position: relative;
}
.vote_type1{
  display: block;
}
.vote_type2{
  display: none;
}
.vote_list_title2_txt{
  display: none;
}
.status_3 .vote_list_title_txt{
  display: none;
}
.status_3 .vote_list_title2_txt{
  display: block;
}
.vote_txt_none,
.vote_txt_before,
.vote_txt_after,
.voteChose_cover{
  display: none;
}
.status_1 .vote_txt_before,
.status_2 .vote_txt_before{
  display: block;
}


.status_3 .vote_type1,
.status_4 .vote_type1{
  display: none;
}
.status_3 .vote_type2,
.status_4 .vote_type2{
  display: block;
}
.status_3 .vote_catch2_txt,
.status_4 .vote_catch2_txt{
  display: none;
}
.status_3 .vote_acpt{
  display: block;
}
.status_4 .vote_finish{
  display: block;
}
.header{
  position: relative;
}
.status_4 .header:before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.7);
  background: -webkit-linear-gradient(top, rgba(0,0,0,0.7) 0%,rgba(0,0,0,0.7) 88%,rgba(0,0,0,0) 100%); 
  background: linear-gradient(to bottom, rgba(0,0,0,0.7) 0%,rgba(0,0,0,0.7) 80%,rgba(0,0,0,0) 100%);
}
.status_4 .voteCounter-ttl{
  color: #fff;
}
.status_4 .movieFirstFlg{
  display: none;
}
.status_4 .movieFirstFlg{
  display: none;
}

.vote_title{
  width: 90%;
  margin: 0 auto;
  padding: 5% 0 0;
  position: absolute;
  left: 0;
  right: 0;
}
.vote_date{
  width: 75.467%;
  margin: 0 auto;
}
.vote_subtitle{
  width: 98.6%;
}
.vote_sponsor{
  width: 74.533%;
  margin: 0 auto;
}
.vote_sponsor .sponsor ul{
  width: 100%;
}
.vote_sponsor .sponsor{
  background: #000;
  margin: 10px auto;
}
.vote_sponsor a:hover{
  opacity: 0.6;
}
.vote_acpt{
  width: 43.333%;
  margin: 10px auto 5px;
  text-align: center;
  display: none;
}
.vote_finish{
  width: 69.467%;
  margin: 10px auto 5px;
  text-align: center;
  display: none;
}
.vote_catch{
  width: 91.8%;
  margin: 0 auto 5%;
}
.vote_catch2{
  position: relative;
  width: 88%;
  margin: 0 auto 5%;
  text-align: center;
  z-index: 1;
}
.voteList_title{
  width: 82.933%;
  margin: 0 auto 5%;
  text-align: center;
}
.voteChose_cover{
  width: 88%;
  top: 50%;
  left: 0;
  right: 0;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  margin: 0 auto;
  z-index: 2;
}
.vote_txt_before{
  width: 72%;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  margin: auto;
  transform: translateY(19%);
  -webkit-transform: translateY(19%);
}
.vote_txt_after{
  width: 72%;
  position: absolute;
  left: 0;
  right: 0;
  margin: auto;
  border-radius: 14px;
  box-shadow: 1px 1px 1px 1px #ffffff;
  transform: translateY(13%);
  -webkit-transform: translateY(13%);
}
.vote_txt_none{
  display: none;
  width: 50%;
  margin: 0 auto;
  position: absolute;
  left: 0;
  right: 0;
  transform: translateY(110%);
  -webkit-transform: translateY(110%);
}
.flash1{
  animation: flash 4s infinite;
  -webkit-animation: flash 4s infinite;
  -ms-animation: flash 4s infinite;
  animation-fill-mode:forwards;
}
.flash2{
  animation: flash2 1s infinite !important;
  -webkit-animation: flash2 1s infinite !important;
  -ms-animation: flash2 1s infinite !important;
  animation-fill-mode:forwards !important;
}

/* =============================================
 list
============================================= */
.voteList{
  position: relative;
  z-index: 1;
  padding-top: 15%;
  margin-top: 15%;
}
.voteList_turn{
  background: #ccc;
}
.voteList_turn .list_wrap{
  padding: 20px 0 0;
}
.list_wrap {
  font-size: 0;
  width: 96%;
  margin: 0 auto;
  position: relative;
}
.list_selectBg{
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: transparent url(../img/vote_select_bg.jpg) 0 0 no-repeat;
  -webkit-background-size: 100% auto;
  background-size: 100% auto;
  z-index: -1;
  padding: 11% 0 0;
}
.list_selectBg:before{
  content: '';
  display: block;
  clear: both;
  width: 100%;
  position: absolute;
  top: -6px;
  height: 8px;
  background: #876746;
  background: -webkit-linear-gradient(top, #876746 0%,#965c00 9%,#a87310 15%,#e69600 23%,#fcbd3c 31%,#fff6e0 54%,#fffae9 57%,#fff6e0 60%,#f6bc43 71%,#8a5200 80%,#7c5615 88%,#d3c596 100%);
  background: linear-gradient(to bottom, #876746 0%,#965c00 9%,#a87310 15%,#e69600 23%,#fcbd3c 31%,#fff6e0 54%,#fffae9 57%,#fff6e0 60%,#f6bc43 71%,#8a5200 80%,#7c5615 88%,#d3c596 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#876746', endColorstr='#d3c596',GradientType=0 );
  border-top: 1px solid #c4b488;
  border-bottom: 1px solid #c4b488;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.list_selectBg:after{
  content: '';
  display: block;
  clear: both;
  width: 100%;
  position: absolute;
  bottom: -6px;
  height: 8px;
  background: #876746;
  background: -webkit-linear-gradient(top, #876746 0%,#965c00 9%,#a87310 15%,#e69600 23%,#fcbd3c 31%,#fff6e0 54%,#fffae9 57%,#fff6e0 60%,#f6bc43 71%,#8a5200 80%,#7c5615 88%,#d3c596 100%);
  background: linear-gradient(to bottom, #876746 0%,#965c00 9%,#a87310 15%,#e69600 23%,#fcbd3c 31%,#fff6e0 54%,#fffae9 57%,#fff6e0 60%,#f6bc43 71%,#8a5200 80%,#7c5615 88%,#d3c596 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#876746', endColorstr='#d3c596',GradientType=0 );
  border-top: 1px solid #c4b488;
  border-bottom: 1px solid #c4b488;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.list_turnBg{
  position: absolute;
  padding: 20px 0;
}
.list{
  position: absolute;
  left: 0;
  top: 0;
  display: block;
  padding: 0 1%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  vertical-align: top;
}
.list_title{
  position: absolute;
  top: 0;
  width: 100%;
}
.list a:hover{
  opacity: 0.6;
}
.list_img{
  position: relative;
  width: 100%;
  height: 0;
  padding-top: 72.197%;
  background-size: calc( 750 / 223 * 100% ) calc( 5000 / 161 * 100% );
  background-position: calc( 0 * 100% ) calc( 1386 / (5000 - 161) * 100% );
  box-shadow: 0 3px 8px 1px rgba(0, 0, 0, 0.5);
}
.list_img label{
  position: absolute;
  left: 4px;
  top: 4px;
  width: calc(100% - 8px);
  height: calc(100% - 8px);
}
.list_movie a,
.list_link a{
  box-shadow: 0 3px 8px 1px rgba(0, 0, 0, 0.5);
}
.list_movie{
  width: 61%;
  display: inline-block;
  margin: 5% 1% 10%;
  vertical-align: top;
}
.list_link{
  width: 30%;
  display: inline-block;
  margin: 5% 1% 0 6%;
  vertical-align: top;
}
.list input[type="checkbox"]{
  display: none;
}
#select_anime .list_img,
.list[data-turn_flg="1"] .list_img,
.voteChose_list_qr .list_img,
.modalSelect .list_img{
  background-size: calc( 750 / 223 * 100% ) calc( 5000 / 161 * 100% );
  background-position: calc( 0 * 100% ) calc( 1215 / (5000 - 161) * 100% );
}
.list[data-turn_flg="1"] label,
.voteChose_list_qr label{
  cursor: pointer;
}
.list_inner{
  padding-bottom: 25px;
}

input[name="voteItem"]:checked + .list_inner .list_img{
  background-size: calc( 750 / 223 * 100% ) calc( 5000 / 161 * 100% );
  background-position: calc( 0 * 100% ) calc( 1044 / (5000 - 161) * 100% );
}


.movieFirstFlg{
  display: none;
  padding-top: 10px;
  text-decoration: underline;
}
.movieFirstFlg a{
  background: #000064;
}


.list[data-turn_flg="9"] .list_img {
    opacity: 0.6;
}


.list[data-turn_flg="9"]:before{
  content:"欠席";
  position:absolute;
  right:0;
  top:0;
  background: #000000;
  color:#fff;
  font-size: 12px;
  color: #fff;
  display: inline-block;
  z-index: 9;
  padding: 0;
  margin: 0;
  font-weight: bold;
  text-align: left;
  padding:2px 4px;
}




/* =============================================
 list_img
============================================= */
.list_img label{
  display: block;
  background: transparent url(../img/vote_list.jpg) 0 0 no-repeat;
  -webkit-background-size: 100% auto;
  background-size: 100% auto;
}
[data-id="1"] .list_img label{
  background-position: 0 0;
}
[data-id="2"] .list_img label{
  background-position: 0 calc( 146 * 1 / (2628 - 146) * 100% );
}
[data-id="3"] .list_img label{
  background-position: 0 calc( 146 * 2 / (2628 - 146) * 100% );
}
[data-id="4"] .list_img label{
  background-position: 0 calc( 146 * 3 / (2628 - 146) * 100% );
}
[data-id="5"] .list_img label{
  background-position: 0 calc( 146 * 4 / (2628 - 146) * 100% );
}
[data-id="6"] .list_img label{
  background-position: 0 calc( 146 * 5 / (2628 - 146) * 100% );
}
[data-id="7"] .list_img label{
  background-position: 0 calc( 146 * 6 / (2628 - 146) * 100% );
}
[data-id="8"] .list_img label{
  background-position: 0 calc( 146 * 7 / (2628 - 146) * 100% );
}
[data-id="9"] .list_img label{
  background-position: 0 calc( 146 * 8 / (2628 - 146) * 100% );
}
[data-id="10"] .list_img label{
  background-position: 0 calc( 146 * 9 / (2628 - 146) * 100% );
}
[data-id="11"] .list_img label{
  background-position: 0 calc( 146 * 10 / (2628 - 146) * 100% );
}
[data-id="12"] .list_img label{
  background-position: 0 calc( 146 * 11 / (2628 - 146) * 100% );
}
[data-id="13"] .list_img label{
  background-position: 0 calc( 146 * 12 / (2628 - 146) * 100% );
}
[data-id="14"] .list_img label{
  background-position: 0 calc( 146 * 13 / (2628 - 146) * 100% );
}
[data-id="15"] .list_img label{
  background-position: 0 calc( 146 * 14 / (2628 - 146) * 100% );
}
[data-id="16"] .list_img label{
  background-position: 0 calc( 146 * 15 / (2628 - 146) * 100% );
}
[data-id="17"] .list_img label{
  background-position: 0 calc( 146 * 16 / (2628 - 146) * 100% );
}
[data-id="18"] .list_img label{
  background-position: 0 calc( 146 * 17 / (2628 - 146) * 100% );
}
[data-id="19"] .list_img label{
  background-position: 0 calc( 146 * 18 / (2628 - 146) * 100% );
}
[data-id="20"] .list_img label{
  background-position: 0 calc( 146 * 19 / (2628 - 146) * 100% );
}





/* =============================================
 howto
============================================= */
.ticket,
.howto{
  position: relative;
  background: transparent url(../img/method_bg_t.png) 0 0 no-repeat;
  background-size: 100% auto;
  padding: 20px;
  margin: 20px auto 0;
  width: 86%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  box-shadow:0 6px 11px 1px rgba(0, 0, 0, 0.8);

}
.ticket:before,
.howto:before{
  content: "";
  display: block;
  clear: both;
  position: absolute;
  left: 0;
  bottom: -3px;
  width: 100%;
  height: 0;
  padding-top: 32.5622775800712%;


  background: transparent url(../img/method_bg_b.png) left bottom no-repeat;
  background-size: 100% auto;

  z-index: 1;
}
.txt_center{
  text-align: center;
}

.ticket_title,
.howto_title {
  width: 100%;
  margin: 0 auto;
  z-index: 2;
  position: relative;
}
.ticket_title img,
.howto_title img{
  width: 100%;
}
.ticket_txt,
.howto_txt{
  font-size: 1rem;
  line-height: 1.6rem;
  padding: 10px 0 20px;
  z-index: 1;
  position: relative;
}
.howto_btn{
  width: 86%;
  position: relative;
  margin: 0 auto;
  z-index: 2;
}
.howto_btn p{
  opacity: 0.2;
  filter: grayscale(100%);
}
.howto_btn a{
  display: block;
  box-shadow:0 3px 8px 1px rgba(0, 0, 0, 0.4);
}
.howto_btn a:hover{
  opacity: 0.6;
}

.vote_btn_howto{
  width: 100%;
  height: 0;
  padding-top: 19.8653198653199%;

  background-size: calc( 750 / 594 * 100% ) calc( 5000 / 118 * 100% );
  background-position: calc( 0 * 100% ) calc( 2964 / (5000 - 118) * 100% );
}

.vote_howto_title{
  width: 100%;
  height: 0;
  padding-top: 10.6666666666667%;

  background-size: calc( 750 / 750 * 100% ) calc( 5000 / 80 * 100% );
  background-position: calc( 0 * 100% ) calc( 2787 / (5000 - 80) * 100% );
}
.vote_ticket_title{
  width: 100%;
  height: 0;
  padding-top: 10.6666666666667%;

  background-size: calc( 750 / 750 * 100% ) calc( 5000 / 80 * 100% );
  background-position: calc( 0 * 100% ) calc( 2687 / (5000 - 80) * 100% );
}
.ticket p,
.howto p{
  text-align: left;
}




/* =============================================
 ムービーモーダル
============================================= */
.modalMovie-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 90%;
  padding: 0 5%;
  text-align: center;
  z-index: 10000;
  display: none; }
  .modalMovie-wrapper .modal-bg {
    cursor: pointer;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.8);
    z-index: 1; }
  .modalMovie-wrapper .modalMovie-inner {
    width: 100%;
    height: 100%;
    max-width: 560px;
    margin: 0 auto;
    position: relative; }
    .modalMovie-wrapper .modalMovie-inner .modalMovie-contents {
      position: absolute;
      top: 50%;
      left: 0;
      width: 100%;
      padding-top: 56.25%;
      height: 0; }
      .modalMovie-wrapper .modalMovie-inner .modalMovie-contents iframe {
        position: absolute;
        top: -50%;
        left: 0;
        height: 100%;
        width: 100%;
        z-index: 10; }
  .modalMovie-wrapper .modal-btn-close {
    cursor: pointer;
    position: absolute;
    top: 50%;
    right: 0;
    margin-top: -240px;
    z-index: 5; }




.btn_top{
  max-width: 1039px;
  display: block;
  position: absolute;
  left: 0;
  right: 0;
  margin: auto;
  height: 0;
  width: 100%;
}
.btn_top a{
  display: inline-block;
  position: absolute;
  left: 3%;
  top: 87px;
  text-align: center;
  width: 17%;
  z-index: 1;
}

@media only screen and (max-width: 870px) {
  .btn_top a{
    display: inline-block;
    position: absolute;
    top: 70px;
    text-align: center;
    width: 15%;
  }

}


.voteChose{
  position: fixed;
  bottom: -300px;
  z-index: 9;
  max-width: 500px;
  width: 100%;
}
.voteChose_list{
  width: 100%;
  padding-top: 55.2%;
  height: 0;
  position: absolute;
  bottom: 0;
  left: 0;
}
.voteChose_list > div{
  position: absolute;
}
.voteChose_list_qr{
  width: 93%;
  text-align: center;
  font-size: 0;
  left: 0;
  top: 32%;
  z-index: 1;
  right: 0;
  margin:auto;
}
.voteChose_list_qr > div{
  width: 32%;
  display: inline-block;
  position: relative;
}
.voteChose_list_qr .list{
  width: 100%;
  top: 0;
  transform-origin:center top;
  -webkit-transform-origin:center top;
  animation: buruburu 1s ease-in-out 0s 1;
  -webkit-animation: buruburu 1s ease-in-out 0s 1;
  animation-fill-mode:forwards;
}
.list input[name="voteItem"]:checked + .list_inner .list_img{
   animation: none;
  -webkit-animation: none;
}
.voteList .list_img{
  animation: buruburu2 1s ease-in-out 0s 1;
  -webkit-animation: buruburu2 1s ease-in-out 0s 1;
  animation-fill-mode:forwards;
}

.voteChose_btn{
  left: 0;
  right: 0;
  margin:auto;
  top: 72%;
  z-index: 2;
}
.voteChose_btn a{
  display: block;
  cursor: not-allowed;
  width: 48%;
  margin: 0 auto;
}
.voteChose_on .voteChose_btn a{
  cursor: pointer;
}


.lock{
  width: 100%;
  height: 100%;
  overflow: hidden;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.lock_bg{
  position: fixed;
  left: 0;
  top: 0;
  background: rgba(255,255,255,0);
  cursor: pointer;
  width: 100%;
  height: 100%;
  z-index: 900000;
}





/* =============================================
 modal SELECT
============================================= */
.modalSelect {
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  text-align: center;
  z-index: 10000;
  display: none; }
  .modalSelect .modal-bg {
    cursor: pointer;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.8);
    z-index: 1; }
  .modalSelect .modalMovie-inner {
    width: 100%;
    height: 100%;
    max-width: 560px;
    margin: 0 auto;
    position: relative;
  }

.modalSelect .list {
  position: relative;
  width: calc(100% /3);
  display: inline-block;
  cursor: pointer;
  padding: 0 0.5%;
}

.modalSelect .modalSelect-contents {
  z-index: 5;
  position: absolute;
  left: 0;
  right: 0;
  padding-top: 50px;
  width: 90%;
  bottom: 0;
  margin: auto;
  padding-bottom: calc(16.85% - 25px);
}
.select_se .list{
  z-index: 2;
}
.select_se {
  width: 100%;
  margin: 0 auto 50px;
  z-index: 2;
}
.select_list {
  width: 100%;
  font-size: 0;
}
.modal-p {
  font-size: 25px;
  text-align: center;
  z-index: 1;
  position: absolute;
  top: 30%;
  left: 0;
  right: 0;
  margin: auto;
}
.modalSelect .modalSelect-inner {
  width: 100%;
  height: 100%;
  max-width: 500px;
  margin: 0 auto;
  position: relative;
}
.modalSelect .modal-btn-close {
  cursor: pointer;
  position: absolute;
  top: 10%;
  right: 5%;
  z-index: 10;
}




/* =============================================
 counter
============================================= */

.voteCounter_static,
.voteCounter{
  display: block;
  position: relative;
  margin: 0 auto;
  text-align: center;
}
.voteCounter-ttl {
  text-align: center;
  margin-bottom: 10px 0 5px;
  vertical-align: middle;
  text-align: center;
  font-weight: bold;
  font-size: 1.2rem;
  color: #000;
  line-height: 1.2;
  width: 100%;
}
.voteCounter-ttl_end{
  text-align: center;
  margin-bottom: 10px;
  display: inline-block;
  width: 100px;
  vertical-align: middle;
}

.voteCounter-error,
.voteCounter-inner,
.voteCounter-static7-inner{
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  font-size: 0;
  display: inline-block;
  vertical-align: middle;
  position: relative;
  border: 3px solid rgba(95, 95, 95, 0.65);
  -webkit-border-radius: 10px;
  border-radius: 10px;
  background: rgba(95, 95, 95, 0.65);
  box-shadow: 0 0px 5px 3px rgba(255, 255, 255, 0.8);
  overflow: hidden;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin-top: 10px;

}
  .voteCounter-inner li,.voteCounter-static7-inner li{
    display: inline-block;
  }
  .voteCounter-inner .counter,
  .voteCounter-static7-inner .counter {
    display: block;
    width: 42px;
    background: url(../img/numbers.png) no-repeat;
    background-size: 1000% auto;
    background-position: 0px 0px;
    position: relative;
    z-index: 2;
    height: 0;
    padding-top: 214.286%;
  }

.voteCounter-error {
  position: relative;
  width: 62%;
  margin: 0 auto;
  text-align: center;
  display: none;
}
  /* -----------------------------------
  手動のカウンター
  */
  .voteCounter-static7-inner .counter.num0 {
  background-position: 0 0; }
  .voteCounter-static7-inner .counter.num1 {
  background-position: 11.1111% 0; }
  .voteCounter-static7-inner .counter.num2 {
  background-position: 22.2222% 0; }
  .voteCounter-static7-inner .counter.num3 {
  background-position: 33.3333% 0; }
  .voteCounter-static7-inner .counter.num4 {
  background-position: 44.4444% 0; }
  .voteCounter-static7-inner .counter.num5 {
  background-position: 55.5555% 0; }
  .voteCounter-static7-inner .counter.num6 {
  background-position: 66.6666% 0; }
  .voteCounter-static7-inner .counter.num7 {
  background-position: 77.7777% 0; }
  .voteCounter-static7-inner .counter.num8 {
  background-position: 88.8888% 0; }
  .voteCounter-static7-inner .counter.num9 {
  background-position: 100% 0; }


/* =============================================
 animation
============================================= */
/* =============================================
 animation
============================================= */
@keyframes buru{
  17% {transform: skew(-12deg);}
  33% {transform: skew(10deg);}
  50% {transform: skew(-6deg);}
  66% {transform: skew(5deg);}
  83% {transform: skew(-2deg);}
  100% {transform: skew(0);}
}
@-webkit-keyframes buru{
  17% {-webkit-transform: skew(-12deg);}
  33% {-webkit-transform: skew(10deg);}
  50% {-webkit-transform: skew(-6deg);}
  66% {-webkit-transform: skew(5deg);}
  83% {-webkit-transform: skew(-2deg);}
  100% {-webkit-transform: skew(0);}
}

@keyframes buru2{
  0% {transform: translate(0px, 0px) rotateZ(0deg)}
  25% {transform: translate(2px, 2px) rotateZ(1deg)}
  50% {transform: translate(0px, 2px) rotateZ(0deg)}
  75% {transform: translate(2px, 0px) rotateZ(-1deg)}
  100% {transform: translate(0px, 0px) rotateZ(0deg)}
}
@-webkit-keyframes buru2{
  0% {-webkit-transform: translate(0px, 0px) rotateZ(0deg)}
  25% {-webkit-transform: translate(2px, 2px) rotateZ(1deg)}
  50% {-webkit-transform: translate(0px, 2px) rotateZ(0deg)}
  75% {-webkit-transform: translate(2px, 0px) rotateZ(-1deg)}
  100% {-webkit-transform: translate(0px, 0px) rotateZ(0deg)}
}

@keyframes puru {
  0%   { transform: scale(1.0, 1.0) translate(0%, 0%); }
  15%  { transform: scale(0.9, 0.9) translate(0%, 2%); }
  30%  { transform: scale(1.2, 0.8) translate(0%, 4%); }
  50%  { transform: scale(0.9, 1.2) translate(0%, -4%); }
  70%  { transform: scale(1.1, 0.9) translate(0%, 2%); }
  100% { transform: scale(1.0, 1.0) translate(0%, 0%); }
}

@-webkit-keyframes puru {
  0%   { -webkit-transform: scale(1.0, 1.0) translate(0%, 0%); }
  15%  { -webkit-transform: scale(0.9, 0.9) translate(0%, 2%); }
  30%  { -webkit-transform: scale(1.2, 0.8) translate(0%, 4%); }
  50%  { -webkit-transform: scale(0.9, 1.2) translate(0%, -4%); }
  70%  { -webkit-transform: scale(1.1, 0.9) translate(0%, 2%); }
  100% { -webkit-transform: scale(1.0, 1.0) translate(0%, 0%); }
}

@keyframes puru2 {
  0%   { transform: scale(1.0, 1.0) translate(0%, 0%); }
  20%  { transform: scale(1.0, 1.06) translate(-5%, -4%) skew(6deg, 0deg); }
  50%  { transform: scale(1.0, 0.94) translate(5%, 4%) skew(-6deg, 0deg); }
  65%  { transform: scale(1.0, 1.03) translate(2%, -2%) skew(-3deg, 0deg); }
  80%  { transform: scale(1.0, 0.97) translate(-2%, 2%) skew(3deg, 0deg); }
  100% { transform: scale(1.0, 1.0) translate(0%, 0%); }
}
@-webkit-keyframes puru2 {
  0%   { -webkit-transform: scale(1.0, 1.0) translate(0%, 0%); }
  20%  { -webkit-transform: scale(1.0, 1.06) translate(-5%, -4%) skew(6deg, 0deg); }
  50%  { -webkit-transform: scale(1.0, 0.94) translate(5%, 4%) skew(-6deg, 0deg); }
  65%  { -webkit-transform: scale(1.0, 1.03) translate(2%, -2%) skew(-3deg, 0deg); }
  80%  { -webkit-transform: scale(1.0, 0.97) translate(-2%, 2%) skew(3deg, 0deg); }
  100% { -webkit-transform: scale(1.0, 1.0) translate(0%, 0%); }
}
@keyframes puruu {
  0%   { transform: scale(1.0, 1.0) translate(0%, 0%); }
  2%  { transform: scale(0.9, 0.9) translate(0%, 2%); }
  4%  { transform: scale(1.2, 0.8) translate(0%, 4%); }
  6%  { transform: scale(0.9, 1.2) translate(0%, -4%); }
  8%  { transform: scale(1.1, 0.9) translate(0%, 2%); }
  10% { transform: scale(1.0, 1.0) translate(0%, 0%); }
}

@-webkit-keyframes puruu {
  0%   { -webkit-transform: scale(1.0, 1.0) translate(0%, 0%); }
  2%  { -webkit-transform: scale(0.9, 0.9) translate(0%, 2%); }
  4%  { -webkit-transform: scale(1.2, 0.8) translate(0%, 4%); }
  6%  { -webkit-transform: scale(0.9, 1.2) translate(0%, -4%); }
  8%  { -webkit-transform: scale(1.1, 0.9) translate(0%, 2%); }
  10% { -webkit-transform: scale(1.0, 1.0) translate(0%, 0%); }
}

@keyframes uefadeIn {
  0%   { opacity:0; transform:translate(0%, 0%); }
  50%   { opacity:0.8; transform:translate(0%, 20%); }
  100% { zoom:1;opacity:1; transform:translate(0%, -200%); }
}
@-webkit-keyframes uefadeIn {
  0%   { opacity:0; -webkit-transform:translate(0%, 0%); }
  50%   { opacity:0.8; -webkit-transform:translate(0%, 20%); }
  100% { zoom:1;opacity:1; -webkit-transform:translate(0%, -200%); }
}

@keyframes uefadeIn2 {
  0%   { opacity:0; transform:translate(0%, -100%); }
  50%   { opacity:0.8; transform:translate(0%, 0%); }
  100% { zoom:1;opacity:1; transform:translate(0%, -3%); }
}
@-webkit-keyframes uefadeIn2 {
  0%   { opacity:0; -webkit-transform:translate(0%, -100%); }
  50%   { opacity:0.8; -webkit-transform:translate(0%, 0%); }
  100% { zoom:1;opacity:1; -webkit-transform:translate(0%, -3%); }
}


@keyframes spin {
  0% {transform: rotate(0deg);}
  100% {transform: rotate(360deg);}
}
@-webkit-keyframes spin {
  0% {-webkit-transform: rotate(0deg);}
  100% {-webkit-transform: rotate(360deg);}
}
@keyframes spin2 {
  0% {transform: rotate(360deg);}
  100% {transform: rotate(0deg);}
}
@-webkit-keyframes spin2 {
  0% {-webkit-transform: rotate(360deg);}
  100% {-webkit-transform: rotate(0deg);}
}



@keyframes poyo {
  0%   { transform: scale(1, 1) translate(0%, 0%); }
  40%  { transform: scale(1, 1.1) translate(0%, -2%); }
  70%  { transform: scale(1, 1.1) translate(0%, 1%); }
  100% { transform: scale(1, 1) translate(0%, 0%); }
}
@-webkit-keyframes poyo {
  0%   { -webkit-transform: scale(1, 1) translate(0%, 0%); }
  40%  { -webkit-transform: scale(1, 1.1) translate(0%, -2%); }
  70%  { -webkit-transform: scale(1, 1.1) translate(0%, 1%); }
  100% { -webkit-transform: scale(1, 1) translate(0%, 0%); }
}

@keyframes fadein {
  0%   { opacity:0; }
  100% { opacity:1; }
}
@-webkit-keyframes fadein {
  0%   { opacity:0; }
  100% { opacity:1; }
}

@keyframes fadeout {
  0%   { opacity:1; }
  100% { opacity:0; }
}
@-webkit-keyframes fadeout {
  0%   { opacity:1; }
  100% { opacity:0; }
}

@keyframes zoom {
  0%   { transform: scale(0, 0) }
  100% { transform: scale(1.0, 1.0) }
}
@-webkit-keyframes zoom {
  0%   { -webkit-transform: scale(0, 0) }
  100% { -webkit-transform: scale(1.0, 1.0) }
}
@keyframes zoom_inout {
  0% { transform: scale(1.0, 1.0) }
  50%   { transform: scale(0.8, 0.8) }
  100%   { transform: scale(1.0, 1.0) }
}
@-webkit-keyframes zoom_inout {
  0% { -webkit-transform: scale(1.0, 1.0) }
  50%   { -webkit-transform: scale(0.8, 0.8) }
  100%   { -webkit-transform: scale(1.0, 1.0) }
}
@keyframes zoom_inout2 {
  0% { transform: scale(1.0, 1.0) }
  50%   { transform: scale(0.3, 0.3) }
  100%   { transform: scale(1.0, 1.0) }
}
@-webkit-keyframes zoom_inout2 {
  0% { -webkit-transform: scale(1.0, 1.0) }
  50%   { -webkit-transform: scale(0.3, 0.3) }
  100%   { -webkit-transform: scale(1.0, 1.0) }
}



@keyframes tuntun {
  0%   { transform: translate(0, 0); }
  5%   { transform: translate(0, 9px); }
  10%  { transform: translate(0, 4px); }
  15%  { transform: translate(0, 7px); }
  20%  { transform: translate(0, 2px); }
  15%  { transform: translate(0, 6px); }
  20%  { transform: translate(0, 0); }
  100% { transform: translate(0, 0); }
}
@-webkit-keyframes tuntun {
  0%   { -webkit-transform: translate(0, 0); }
  5%   { -webkit-transform: translate(0, 9px); }
  10%  { -webkit-transform: translate(0, 4px); }
  15%  { -webkit-transform: translate(0, 7px); }
  20%  { -webkit-transform: translate(0, 2px); }
  15%  { -webkit-transform: translate(0, 6px); }
  20%  { -webkit-transform: translate(0, 0); }
  100% { -webkit-transform: translate(0, 0); }
}


@keyframes koma_1 {
  0% {background-position: 0 0;}
  100% {background-position: 0  58.34%;}
}
@-webkit-keyframes koma_1 {
  0% {background-position: 0 0;}
  100% {background-position: 0 58.34%;}
}
@keyframes koma_2 {
  0% {background-position: 0 58.34%;}
  100% {background-position: 0 100%;}
}
@-webkit-keyframes koma_2 {
  0% {background-position: 0 58.34%;}
  100% {background-position: 0 100%;}
}
@keyframes koma {
  0% {background-position: 0 0;}
  100% {background-position: 0 100%;}
}
@-webkit-keyframes koma {
  0% {background-position: 0 0;}
  100% {background-position: 0 100%;}
}

@-webkit-keyframes marquee {
  from   { -webkit-transform: translate(0%);}
  99%,to { -webkit-transform: translate(-100%);}
}
@keyframes marquee {
  from   { transform: translate(0%);}
  99%,to { transform: translate(-100%);}
}
/*
@-webkit-keyframes marquee {
  from {margin-left:100%; width:100%;}
  to {margin-left:-100%; width:100%;}
}
@keyframes marquee {
  from {margin-left:100%; width:100%;}
  to {margin-left:-100%; width:100%;}
}
*/

@-webkit-keyframes doorOpen_left{
  0%{transform-origin:0 0;-webkit-transform:perspective(800px) rotateY(0)}
  100%{transform-origin:0 0;-webkit-transform:perspective(800px) rotateY(-180deg)}
}
@keyframes doorOpen_left{
  0%{transform-origin:0 0;transform:perspective(800px) rotateY(0)}
  100%{transform-origin:0 0;transform:perspective(800px) rotateY(-180deg)}
}
@-webkit-keyframes doorOpen_right{
  0%{transform-origin:100% 0;-webkit-transform:perspective(800px) rotateY(0)}
  100%{transform-origin:100% 0;-webkit-transform:perspective(800px) rotateY(180deg)}
}
@keyframes doorOpen_right{
  0%{transform-origin:100% 0;transform:perspective(800px) rotateY(0)}
  100%{transform-origin:100% 0;transform:perspective(800px) rotateY(180deg)}
}

@-webkit-keyframes shake_left {
  0%{transform-origin:0 0;-webkit-transform:perspective(800px) rotateY(0)}
  50%{transform-origin:0 0;-webkit-transform:perspective(800px) rotateY(-10deg)}
  100%{transform-origin:0 0;-webkit-transform:perspective(800px) rotateY(0)}
}
@keyframes shake_left {
  0%{transform-origin:0 0;transform:perspective(800px) rotateY(0)}
  50%{transform-origin:0 0;transform:perspective(800px) rotateY(-10deg)}
  100%{transform-origin:0 0;transform:perspective(800px) rotateY(0)}
}
@-webkit-keyframes shake_right{
  0%{transform-origin:100% 0;-webkit-transform:perspective(800px) rotateY(0)}
  50%{transform-origin:100% 0;-webkit-transform:perspective(800px) rotateY(10deg)}
  100%{transform-origin:100% 0;-webkit-transform:perspective(800px) rotateY(0)}
}
@keyframes shake_right{
  0%{transform-origin:100% 0;transform:perspective(800px) rotateY(0)}
  50%{transform-origin:100% 0;transform:perspective(800px) rotateY(10deg)}
  100%{transform-origin:100% 0;transform:perspective(800px) rotateY(0)}
}


@keyframes coin_front{
  0%{transform:scale(1,1)}
  2%{transform:scale(0,1)}
  4%{transform:scale(0,1)}
  6%{transform:scale(0,1)}
  8%{transform:scale(1,1)}
}
@-webkit-keyframes coin_front{
  0%{-webkit-transform:scale(1,1)}
  2%{-webkit-transform:scale(0,1)}
  4%{-webkit-transform:scale(0,1)}
  6%{-webkit-transform:scale(0,1)}
  8%{-webkit-transform:scale(1,1)}
}
@keyframes coin_back{
  0%{transform:scale(0,1)}
  2%{transform:scale(0,1)}
  4%{transform:scale(1,1)}
  6%{transform:scale(0,1)}
  8%{transform:scale(0,1)}
}
@-webkit-keyframes coin_back{
  0%{-webkit-transform:scale(0,1)}
  2%{-webkit-transform:scale(0,1)}
  4%{-webkit-transform:scale(1,1)}
  6%{-webkit-transform:scale(0,1)}
  8%{-webkit-transform:scale(0,1)}
}


@keyframes buruburu {
  0% {transform: rotate(0deg);}
  20% {transform: rotate(6deg);}
  40% {transform: rotate(-6deg);}
  60% {transform: rotate(3deg);}
  80% {transform: rotate(-3deg);}
  100% {transform: rotate(0deg);}
}
@-webkit-keyframes buruburu {
  0% {-webkit-transform: rotate(0deg);}
  20% {-webkit-transform: rotate(6deg);}
  40% {-webkit-transform: rotate(-6deg);}
  60% {-webkit-transform: rotate(3deg);}
  80% {-webkit-transform: rotate(-3deg);}
  100% {-webkit-transform: rotate(0deg);}
}
@-webkit-keyframes buruburu2 {
  0% {-webkit-transform: rotate(0deg);}
  20% {-webkit-transform: rotate(3deg);}
  40% {-webkit-transform: rotate(-3deg);}
  60% {-webkit-transform: rotate(1deg);}
  80% {-webkit-transform: rotate(-1deg);}
  100% {-webkit-transform: rotate(0deg);}
}


@keyframes flash{
  50%{opacity: 0;}
}
@-webkit-keyframes flash{
  50%{opacity: 0;}
}
@keyframes flash2{
  50%{opacity: 0;}
}
@-webkit-keyframes flash2{
  50%{opacity: 0;}
}

/* =============================================
 animation
============================================= */

.anime{
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    top: 0;
    width: 100%;
    height: 100%;
    background:#020266;
    z-index: 10000;
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}
.anime_bg {
  display: none;
    max-width: 500px;
    position: fixed;
    left: 0;
    right: 0;
    margin: auto;
    top: 0;
    width: 100%;
    height: 100%;
    background: #000062 url(../img/vote_firstanim_bg.jpg) top center no-repeat;
    z-index: 1;
    -webkit-background-size: 100% auto;
    background-size: 100% auto;

  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}
.anime_img{
  display: none;
    max-width: 400px;
    position: fixed;
    left: 0;
    right: 0;
    margin: auto;
    top: 0;
    width: 81.467%;
    height: 100%;
    background: transparent url(../img/vote_firstanime.png) center center no-repeat;
    z-index: 2;
    -webkit-background-size: contain;
    background-size: contain;
}
.anime_arrow {
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    top: 21%;
    z-index: 9;
    transform-style:preserve-3d;
    perspective:500px;
    display: block;
    animation: uefadeIn 3s ease-in-out 0s infinite; 
    -webkit-animation: uefadeIn 3s ease-in-out 0s infinite; 

    height: 318px;
    width: 100px;
  z-index: 100001;
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}
.anime_arrow:before {
  content:"";
  width: 0;
  height: 0;
  border-left: 50px solid transparent;
  border-right: 50px solid transparent;
  border-bottom: 73px solid white;
  top:0;
  left:0;
  right:0;
  margin:auto;
  z-index: 100002;
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}

.anime_arrow:after {
  content:"";
  width: 41px;
  height: 200px;
  top: 71px;
  left:0;
  right:0;
  margin:auto;
  transition-duration: 1s;
  background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 68%, rgba(255,255,255,0) 100%);
  background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(255,255,255,1) 68%,rgba(255,255,255,0) 100%);
  background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(255,255,255,1) 68%,rgba(255,255,255,0) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=0 );
  display:block;
  position: relative;
  z-index: 100003;
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}
.anime_txt {
  position: absolute;
  left: 0;
  right: 0;
  top: 51%;
  margin: auto;
  z-index: 10;
  font-size: 1.5rem;
  color: #fff;
  text-align: center;
  animation: zoom_inout 2s ease-in-out 0s infinite;
  -webkit-animation: zoom_inout 2s ease-in-out 0s infinite;
  animation-fill-mode:forwards;
  z-index: 100004;
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}

#ema{
  display: block;
  z-index: 100005;

  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}
#ema .voteChose_list{
  cursor: pointer;
}




/* =============================================
 err
============================================= */
.err_box{
  background: #000064;
  font-size: 16px;
  margin: 50px 10px;
}
.err_box dt {
  font-weight: bold;
  padding-top: 10px;
}

.err_box dd {
  padding-bottom: 20px;
}
.btn_back,.btn_howto {
  display: inline-block;
  padding: 10px;
  border: 2px solid #ffd200;
  background: #000;
  width:100%;
  box-sizing:border-box;
  display:block;
}
.btn-2col{
  text-align:center;
}
.btn-2col p{
  width:45%;
  display:inline-block;
  margin:0 auto;
  text-align:center;
  box-sizing: border-box;
  margin: 0 5px;
}
.btn-2col a:hover{
  background: #272727;
  text-decoration: none;
}



  .voteCounter-error{
    padding-left: 0;
    width: 80%;
  }






.vote_win {
    margin: 30px auto;
    width: 90%;
    max-width: 800px;
}

.vote_results_no{
  border: 1px dotted #ffd200;
  max-width: 880px;
  width: 90%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0 auto 50px;
}
.vote_results_no_title{
  text-align: center;
  margin: 0 auto;
  padding: 0;
  width: 95%;
  max-width: 305px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 1.3rem;
  font-weight: bold;
  color: #ffd200;
  padding-bottom:2%;
}
.vote_results_no_con{
  margin: 0 auto;
  display: block;
  clear: both;
  width: 95%;
  padding: 0 2% 4%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.vote_results_no_con dl{
  width: 100%;
  border-top: 1px solid #fff;
}
.vote_results_no_con dl:first-child{
  border-top: none;
}
.vote_results_no_con dl:first-child dt,
.vote_results_no_con dl:first-child dd{
  color: #ffd200;
}
.vote_results_no_con dt,
.vote_results_no_con dd{
  color: #fff;
  font-weight: bold;
  display: inline-block;
  font-size: 1.2rem;
  padding: 8px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.vote_results_no_con dt{
  width: 22%;
}
.vote_results_no_con dd{
  width: 75%;
}
.vote_results_no_con dd span{
  font-size: 0.9rem;
  padding-left: 10px;
}

@media only screen and (max-width: 640px) {
  .vote_results_no_con dt{
    text-align: center;
    font-size: 1.2rem;
    font-size: 1.1rem;
    text-align: center;
  }

  .vote_results_no_con dd{
    text-align: left;
  }
  .vote_results_no_con dd span{
    display: block;
    font-size: 0.8rem;
    padding-left: 0;
    font-weight: normal;
  }
}




/* =============================================
 howto
============================================= */
.howto_all .vote_all{
    background: #000064 url(../img/howto/kv_bg_smp.jpg) 0 0 no-repeat;
    -webkit-background-size: 100% auto;
    background-size: 100% auto;
}
.howto_con{
  display: block;
  clear: both;
  max-width: 760px;
  width: 90%;
  margin: 0 auto;
  font-size: 1rem;
}
.howto_con strong{
  font-weight: bold;
  color: #fc0;
}
.howto_con .btn{
  width: 47.368%;
  display: block;
  margin: 0 auto;
  padding: 20px 0;
}
.howto_con .btn a{
  display: block;
}
.howto_con .btn a:hover{
  opacity: 0.4;
}
.howto_con{
  display: block;
  clear: both;
}
.howto_con a{
  color: #438bc5;
  text-decoration: underline;
}
.howto_con a:hover{
  text-decoration: none;
}
.howto_t{
  padding-top: 5px;
}
.howto_all .howto_title,
.howto_all .privacy_title {
  margin: 0 0 30px;
  padding: 20px 0 8px;
  border-bottom: 2px solid #f59900;
}
.privacy_title{
  margin-top: 60px;
}
.howto_phone_title {
    margin-top: 30px;
}
.howto_phone_title,
.howto_broadcast_title,
.privacy_terms_title,
.privacy_policy_title {
  margin-bottom: 20px;
}
.howto_time{
  border: 2px solid #f2c655;
  background: #1a2c88;
  font-weight: bold;
  text-align: center;
  width: 100%;
  display: block;
  clear: both;
  padding: 8px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  margin-bottom: 30px;
}
.howto_twoBox_l img{
  border: 1px solid #666;
}
.howto_time span{
  color: #f59900;
}
.howto_twoBox{
  display: block;
  clear: both;
  margin-bottom: 15px;
}
.howto_twoBox:after{
  content: "";
  display: block;
  clear: both;
}
.howto_con .tit{
  color: #f59900;
  font-weight: bold;
}
.howto_phone .howto_next{
  margin-bottom: 15px;
}
.howto_twoBox_r{
  padding-top: 10px;
}
.atn {
  font-size: 0.9rem;
  color: #cccccc;
  border: 1px solid #666;
  padding: 3% 5%;
  line-height: 2;
}

.atn p+p {
  padding-top: 3%;
}

.privacy_terms_detail{
  border: 1px solid #666;
  padding: 3% 5%;
  margin: 3% 0;
}
.privacy_terms_detail dt{
  color: #f59900;
  font-weight: bold;
  display: block;
}
.privacy_terms_detail dd{
  display: block;
}
.privacy_terms_detail dd+ dt{
  padding-top: 1.2rem;
}
.howto_broadcast {
  padding-top: 50px;
}

.voteTicket p strong{
     color:#f59900;  
}
.voteTicket {
    margin-top: 80px;
    border-top: 1px solid #fff;
    padding-top: 80px;
}
.btn_index{
  display: block;
  text-align: center;
  margin: 50px auto;
}
.btn_index a:hover{
  opacity: 0.6;
}
.privacy_policy {
    padding-top: 20px;
}
.howto_con .btn{
  width: 100%;
}

.howto_time span {
  display: block;
}

.howto_title span,
.privacy_title span {
  font-size: 2rem;
  font-weight: bold;
  color: #f59900;
}
.privacy_title span {
  font-size: 1.4rem;
}
.howto_twoBox_l,
.howto_next{
  text-align: center;
}
.howto_broadcast .howto_twoBox {
  padding-top: 20px;
}
.howto_phone_title span,
.howto_broadcast_title span,
.privacy_terms_title span,
.privacy_policy_title span {
  color: #f9c52d;
  font-weight: bold;
  font-size: 1.3rem;
  border-left: 6px solid #f9c52d;
  padding: 8px 0 8px 10px;
  display: block;
  line-height: 1.3rem;
}
.voteTicket_title span {
  font-size: 1.4rem;
  font-weight: bold;
  padding-bottom: 30px;
  display: block;
}

.vote_title2{
  width: 70%;
  margin: 20px auto;
}
.howoto_btn{
  width: 70%;
  margin: 0 auto;
  text-align: center;
}
.privacy {
    margin: 0 auto;
    width: 90%;
}
.btn_index{
  width: 90%;
}

@media only screen and (max-width: 640px) {
  .howoto_btn{
    width: 80%;
  }
  .btn_index{
    width: 80%;
  }

}










#voteList label {
    pointer-events: none;
}