@charset "utf-8";

/*/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
 공통 - UI 
/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
body {background-color:#fefaf6;}
#wrapper {margin:0 auto; width:640px; min-height:calc(100% - 190px); box-sizing: border-box;}

.header_pos {background-color:#f8a93d;}
.header_pos .header {margin:0 10px; text-align: center; position:relative;}
.header_pos .header h1 {height:50px; line-height:50px;}
.header_pos .header h1 img {height:26px;}
.header_pos .header a.btn_sidemenu {position:absolute; top:calc(50% - 16px); right:10px;}
.header_pos .header a.btn_sidemenu i {color:#fff; font-size:20px; font-weight:normal;}

/* 모바일 */
@media all and (max-width:640px){
      #wrapper {width:initial;}
}


/*////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
 main_cont
 /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
 .page_title {margin-bottom:10px; padding:10px 10px 5px; font-size:20px; color:#333; border-bottom:solid 1px #ccc;}

 .pagebottom_func_box {padding:20px 0; text-align:center; border-top:solid 1px #ccc;}
 /* .pagebottom_func_box button {padding:0 15px; height:36px; border:solid 1px #1c2868;} */

 .btn {padding:0 15px; height:36px; background-color:#fff; border:solid 1px #1c2868; border-radius:0 10px 0 0;}
 .btn_sm {padding:0 15px; height:30px;}
 .btn_md {padding:0 15px; height:36px;}

 .btn_bg_white {color:#333; background-color:#fff; border:solid 1px #1c2868;}
 .btn_bg_primary {color:#fff; background-color:#f8a93d; border:solid 1px #f8a93d;}
 .btn_bg_primary_light {color:#f8a93d; background-color:#fdead1; border:solid 1px #fdead1;}

/* 모바일*/
@media all and (max-width:640px){
    .page_title {font-size:18px;}
}

/*////////////////////////////////////////////////////////////////////////////////////////
 주간 월간 선수
 ////////////////////////////////////////////////////////////////////////////////////////*/
.pick_player {}
.pick_player .cont_header {padding:10px; text-align:right;}
.pick_player .cont_header span {display:inline-block; margin-bottom:10px; padding:10px; font-size:22px; color:#fff; background-color:#f8a93d; border-radius:7px; line-height:1; font-family:gumi,serif; font-weight:600; word-break:break-all;}
.pick_player .cont_header h3 {font-size:26px; color:#3a3a3a; line-height:1; font-family:gumi,serif; font-weight:600;}
.pick_player .player_box {display:flex; justify-content:space-between; gap:10px; align-items:center; border-radius:10px; background-color:#f8a93d; font-family:gumi,serif; font-weight:600; word-break:break-all;
box-shadow: inset 0 0 10px #e96717;}
.pick_player .player_box .thum {flex-shrink:0; flex-basis:150px; padding-top:10px; text-align:center;}
.pick_player .player_box .name {color:#fff; text-align:left;}
.pick_player .player_box .name span.grade {font-size:25px; font-family:gumi,serif; font-weight:600;}
.pick_player .player_box .name strong.player {display:block; font-size:32px; line-height:1; font-family:gumi,serif; font-weight:600;}
.pick_player .player_box .vote {flex-shrink:0; padding-right:10px; text-align: right;}
.pick_player .player_box .vote strong.num {display:block; font-size:22px; color:#fff; font-family:gumi,serif; font-weight:600;}
.pick_player .player_box .vote strong.num span {font-size:15px;}
.pick_player .player_box .vote button {padding:10px; font-size:20px; color:#f8a93d; background-color:#fff; border-radius:7px; font-family:gumi,serif; font-weight:600;}

.myfavorite_player {padding-bottom:25px;}

/* 모바일*/
@media all and (max-width:640px){
    .pick_player .cont_header h3 {font-size:16px;}
    .pick_player .player_box .thum {flex-shrink:0; flex-basis:110px;}
    .pick_player .player_box .name span.grade {font-size:16px;}
    .pick_player .player_box .name strong.player {font-size:25px;}
    .pick_player .player_box .vote button {padding:10px; font-size:18px;}
}

@media all and (max-width:480px){
    .pick_player .cont_header span {padding:6px; font-size:14px;}
    .pick_player .player_box .thum {flex-shrink:0; flex-basis:90px;}
    .pick_player .player_box .name span.grade {font-size:13px;}
    .pick_player .player_box .name strong.player {font-size:18px;}
    .pick_player .player_box .vote strong.num {font-size:16px;}
    .pick_player .player_box .vote strong.num span {font-size:10px;}
    .pick_player .player_box .vote button {padding:7px; font-size:13px;}
}



/*////////////////////////////////////////////////////////////////////////////////////////
 나의 최애 야구선수는
 ////////////////////////////////////////////////////////////////////////////////////////*/
.myfavorite_box {}

.myfavorite_box .outline {}
.myfavorite_box .outline a {}
.myfavorite_box .outline .cont_header {padding:10px 0; text-align:right;}
.myfavorite_box .outline .cont_header h3 {font-size:26px; color:#f8a93d; line-height:1; font-family:gumi,serif; font-weight:600; word-break:break-all;}
.myfavorite_box .outline .player_box {display:flex; justify-content:space-between; gap:10px; align-items:center; border-radius:10px; background-color:#f8a93d; font-family:gumi,serif; font-weight:600; word-break:break-all;
box-shadow: inset 0 0 10px #e96717;}
.myfavorite_box .outline .player_box .thum {flex-shrink:0; flex-basis:150px; padding-top:10px; text-align:center;}
/* .myfavorite_box .outline .player_box .thum img {height:140px;} */
.myfavorite_box .outline .player_box .name {color:#fff; text-align:left;}
.myfavorite_box .outline .player_box .name span.grade {display:block; margin-bottom:10px; font-size:23px; line-height:1;}
.myfavorite_box .outline .player_box .name strong.team {display:block; margin-bottom:5px; font-size:25px; line-height:1;}
.myfavorite_box .outline .player_box .name strong.player {display:block; font-size:45px; line-height:1;}
.myfavorite_box .outline .player_box .vote {flex-shrink:0; padding-right:10px; text-align: right;}
.myfavorite_box .outline .player_box .vote strong.num {display:block; font-size:24px; color:#fff;}
.myfavorite_box .outline .player_box .vote strong.num span {font-size:15px;}
.myfavorite_box .outline .player_box .vote button {padding:10px; font-size:20px; color:#f8a93d; background-color:#fff; border-radius:7px;}

.myfavorite_player {padding-bottom:25px;}

/* 모바일*/
@media all and (max-width:640px){
    .myfavorite_box .outline .cont_header h3 {font-size:16px;}
    .myfavorite_box .outline .player_box .thum {flex-shrink:0; flex-basis:110px;}
    .myfavorite_box .outline .player_box .name span.grade {font-size:15px;}
    .myfavorite_box .outline .player_box .name strong.team {font-size:15px;}
    .myfavorite_box .outline .player_box .name strong.player {font-size:35px;}
    .myfavorite_box .outline .player_box .vote button {padding:10px; font-size:18px;}
}

@media all and (max-width:480px){
    .myfavorite_box .outline .player_box .thum {flex-shrink:0; flex-basis:90px;}
    .myfavorite_box .outline .player_box .name {font-size:14px;}
    .myfavorite_box .outline .player_box .name span.grade {font-size:13px;}
    .myfavorite_box .outline .player_box .name strong.team {font-size:13px;}
    .myfavorite_box .outline .player_box .name strong.player {font-size:25px;}
    .myfavorite_box .outline .player_box .vote strong.num {font-size:16px;}
    .myfavorite_box .outline .player_box .vote strong.num span {font-size:10px;}
    .myfavorite_box .outline .player_box .vote button {padding:7px; font-size:14px;}
}


.myfavorite_box .slick-prev, .myfavorite_box .slick-next {
      font-size:0;
      line-height: 0;
      position: absolute;
      top: 50%;
      display: block;
      width: 70px !important;
      height: 70px !important;
      padding: 0;
      -webkit-transform: translate(0, -50%);
      -ms-transform: translate(0, -50%);
      transform: translate(0, -50%);
      cursor: pointer;
      color: transparent;
      border: none;
      outline: none;  
      overflow:hidden;
      transition: all 0.3s;
      border-radius:100px;
      /* box-shadow: 0 2px 10px 0 rgb(0 0 0 / 30%); */
      background-color:#999;
      background-size:50% !important;
      /*background:url('../images/common/icon_mainvisualslide_prev.png') no-repeat center center;*/
  }
 
  .myfavorite_box .slick-prev:before {content: '';}
  [dir='rtl'] .myfavorite_box .slick-prev:before {content: '';}
  
  .myfavorite_box .slick-next:before {content: '';}
  [dir='rtl'] .myfavorite_box .slick-next:before {content: '';}
  
  .myfavorite_box .slick-prev {
      left:0;
      background:url('../images/icon_arrow_gray_prev.png') no-repeat center center; opacity: 1; z-index:10;
  }
  .myfavorite_box .slick-prev:hover, .myfavorite_box .slick-prev:focus {
      background:url('../images/icon_arrow_gray_prev.png') no-repeat center center; opacity: 1;
  }
  .myfavorite_box .slick-next {
      right:0;
      background:url('../images/icon_arrow_gray_next.png') no-repeat center center; opacity: 1;
  }
  .myfavorite_box .slick-next:hover, .myfavorite_box .slick-next:focus {
      background:url('../images/icon_arrow_gray_next.png') no-repeat center center; opacity: 1;
  } 
    
  .myfavorite_box .slick-dots {bottom:0;}
  .myfavorite_box .slick-dots li button:before {opacity:1; font-size:0; width:5px; height:5px; border-radius:10px; border:solid 1px #c16712;}
  .myfavorite_box .slick-dots li.slick-active button:before {opacity:1; transform:scale(1.5); background:#c16712; border:solid 1px #c16712;}
  
  /* 모바일*/
  @media all and (max-width:640px){
    .myfavorite_box .slick-prev, .myfavorite_box .slick-next {
        width: 30px !important;
        height: 30px !important;
    }
    .myfavorite_box .slick-prev {
        left:5px;
    }
    .myfavorite_box .slick-next {
        right:5px;
    }
  }

/*////////////////////////////////////////////////////////////////////////////////////////
 메인 : 월간/주간 투표
 ////////////////////////////////////////////////////////////////////////////////////////*/
.vote_rolling_box {padding:15px 0;}

.vote_rolling .slick-list {}

.vote_rolling {}
.vote_rolling .outline {padding:5px 0 0; background:url('../images/vote_bg.png') #1c2868 no-repeat center; background-size:cover; position:relative;}
.vote_rolling a {}
.vote_rolling .listbox {padding:15px 10px 0; color:#fff; position:relative; box-sizing:border-box;}
.vote_rolling .listbox strong.title {display:block; margin:0 15% 15px; padding:5px 10px; text-align:center; font-size:18px; font-weight:800; color:#fff; line-height:20px; border-radius:5px;
        background: #FF814C;
        background: linear-gradient(90deg,rgba(255, 129, 76, 1) 1%, rgba(255, 85, 28, 1) 100%);
        box-shadow: 0 2px 10px 0 rgb(0 0 0 / 30%);
        word-break:keep-all;
        white-space:-moz-pre-wrap;
        white-space:-pre-wrap;
        white-space:-o-pre-wrap;
        word-wrap:break-word;
    }

.vote_rolling .listbox .player_row {display:flex; justify-content:space-between;}
.vote_rolling .listbox .player_row .player_col {flex-basis:35%; text-align:center;}
.vote_rolling .listbox .player_row .player_col strong.player_name {display:block; font-size:20px; font-weight:800;}
.vote_rolling .listbox .player_row .player_col span.photo {display:inline-block;}
.vote_rolling .listbox .player_row .player_col span.photo img {}

.vote_rolling .listbox .center_txt {width:100%; text-align:center; line-height:1.2; position:absolute; top:calc(50% - 40px); left:0;}
.vote_rolling .listbox .center_txt strong.tx1 {display:block; color:#ff641c; font-weight:800; font-size:40px; letter-spacing:-1px;}
.vote_rolling .listbox .center_txt strong.tx2 {display:block; font-size:40px; font-weight:800;}

.vote_rolling .dday_check {width:100%; text-align:center; position:absolute; bottom:0; left:0;}
.vote_rolling .dday_check .time_count {display:inline-block; padding:3px 10px; color:#fff; font-size:16px; border-radius:0 7px 0 0; 
      background: #FF814C;
      background: linear-gradient(90deg,rgba(255, 129, 76, 1) 1%, rgba(255, 85, 28, 1) 100%)}
.vote_rolling .dday_check .bar_track {height:7px; line-height:0; text-align:left; background-color:#999;}
.vote_rolling .dday_check .bar_track span.bar_current {display:inline-block; height:7px; line-height:0; border-radius:0 7px 0 0; background-color:#ff641c;}

/* 모바일*/
@media all and (max-width:640px){      
      .vote_rolling .listbox {margin:0 5%;}
      .vote_rolling .listbox .player_row .player_col strong.player_name {font-size:16px;}
      .vote_rolling .listbox .center_txt {position:absolute; top:calc(50% + 15px); left:0;}
      .vote_rolling .listbox .center_txt strong.tx1 {font-size:20px;}
      .vote_rolling .listbox .center_txt strong.tx2 {font-size:20px;}
}

.vote_rolling .slick-dots {bottom:25px;}
.vote_rolling .slick-dots li {margin:0;}
.vote_rolling .slick-dots li button:before {opacity:1; color:#cccccc; content:''; width:10px; height:6px; background-color:#fff; border-radius:6px; transition: all 0.5s;}
.vote_rolling .slick-dots li.slick-active button:before {width:10px;}

.vote_rolling .slick-prev, 
.vote_rolling .slick-next {
      font-size: 0;
      line-height: 0;
      position: absolute;
      top: 50%;
      display: block;
      width: 70px;
      height: 70px;
      border-radius:70px;
      cursor: pointer;
      border: none;
      outline: none;
      transition: all 0.3s;
      background-size:50% !important;
      /* background: #ffcc99 !important; */
      z-index:10;
  }

  .vote_rolling .slick-prev:before {content: '';}
  [dir='rtl'] .vote_rolling .slick-prev:before {content: '';}
  
  .vote_rolling .slick-next:before {content: '';}
  [dir='rtl'] .vote_rolling .slick-next:before {content: '';}
  
  .vote_rolling .slick-prev {
      left:-10px;
      background:url('../images/icon_arrow_prev.png') no-repeat center center; opacity: 1; z-index:10;
  }
  .vote_rolling .slick-prev:hover, .vote_rolling .slick-prev:focus {
      background:url('../images/icon_arrow_prev.png') no-repeat center center; opacity: 1;
  }
  .vote_rolling .slick-next {
        right:-10px;
      background:url('../images/icon_arrow_next.png') no-repeat center center; opacity: 1;
  }
  .vote_rolling .slick-next:hover, .vote_rolling .slick-next:focus {
      background:url('../images/icon_arrow_next.png') no-repeat center center; opacity: 1;
  } 
  
  /* 모바일*/
  @media all and (max-width:640px){
    .vote_rolling .slick-prev, 
    .vote_rolling .slick-next {
          width: 30px;
          height: 30px;}   
    .vote_rolling .slick-prev {
        left:5px;
    }
    .vote_rolling .slick-next {
        right:5px;
    }
  }

/*////////////////////////////////////////////////////////////////////////////////////////
 메인 : 나의 최애 야구선수는?
 ////////////////////////////////////////////////////////////////////////////////////////*/
.myfavorite_box {margin-top:30px; margin-bottom:30px; overflow:hidden;}
.myfavorite_box .cont_header {margin:0 10px 5px; text-align:right;}
.myfavorite_box .cont_header h3 {font-size:26px; color:#f8a93d; font-weight:800;}
/* 모바일*/
@media all and (max-width:640px){
      .myfavorite_box .cont_header h3 {font-size:20px;}
}


/*////////////////////////////////////////////////////////////////////////////////////////
 메인 : 오늘의 선수
 ////////////////////////////////////////////////////////////////////////////////////////*/
.today_player_box {margin-top:30px; margin-bottom:30px; overflow:hidden;}
.today_player_box .cont_header {display:flex; margin:0 10px 15px; justify-content:space-between; align-items:center;}
.today_player_box .cont_header h3 {font-size:26px; color:#f8a93d; font-family:gumi,serif; font-weight:600; word-break:break-all;}
.today_player_box .cont_header a {color:#f8a93d;}

.today_player .slick-list {}

.today_player {margin-right:-100px; padding-bottom:0;}
.today_player .outline {margin:0 10px; text-align:center; border-radius:15px; overflow:hidden; position:relative; top:0; transition: all 0.5s;}
.today_player a {display:block; text-align:center;}
.today_player .outline .thum {display:inline-block; margin-top:5px; width:130px; height:130px; border-radius:130px; overflow:hidden; background:#fcecd9 no-repeat center center; background-size:cover;
box-shadow: 0 3px 7px 0 #f8a93d;}
.today_player strong.player_name {display:block; color:#333; font-size:18px; font-weight:800;}

/* 모바일*/
@media all and (max-width:640px){
      .today_player_box .cont_header h3 {font-size:20px;}

      .today_player {margin-right:0; margin:0 10px;}
      .today_player .outline {margin:0;}
      .today_player .outline .thum {width:90px; height:90px;}

      .today_player strong.player_name {display:block; color:#333; font-size:16px;}
}

.today_player .slick-dots {bottom:0;}
.today_player .slick-dots li {margin:0;}
.today_player .slick-dots li button:before {opacity:1; color:#cccccc; content:''; width:10px; height:6px; background-color:#ff9d2f; border-radius:6px; transition: all 0.5s;}
.today_player .slick-dots li.slick-active button:before {width:30px;}

.today_player .slick-prev, 
.today_player .slick-next {
      font-size: 0;
      line-height: 0;
      position: absolute;
      top: -15px;
      display: block;
      width: 36px;
      height: 36px;
      border-radius:36px;
      cursor: pointer;
      border: none;
      outline: none;
      transition: all 0.3s;
      background-size:50% !important;
      /* background: #ffcc99 !important; */
      z-index:10;
  }

  .today_player .slick-prev:before {content: '';}
  [dir='rtl'] .today_player .slick-prev:before {content: '';}
  
  .today_player .slick-next:before {content: '';}
  [dir='rtl'] .today_player .slick-next:before {content: '';}
  
  .today_player .slick-prev {
      left:initial; right:60px;
      background:url('../images/ctl/main/icon_arrow_prev.png') #ff9933 no-repeat center center; opacity: 0.7; z-index:10;
  }
  .today_player .slick-prev:hover, .today_player .slick-prev:focus {
      background:url('../images/ctl/main/icon_arrow_prev.png') #ff9933 no-repeat center center; opacity: 1;
  }
  .today_player .slick-next {
        right:20px;
      background:url('../images/ctl/main/icon_arrow_next.png') #ff9933 no-repeat center center; opacity: 0.7;
  }
  .today_player .slick-next:hover, .today_player .slick-next:focus {
      background:url('../images/ctl/main/icon_arrow_next.png') #ff9933 no-repeat center center; opacity: 1;
  } 

/* 모바일*/
@media all and (max-width:640px){
      
}


/*////////////////////////////////////////////////////////////////////////////////////////
 광고 구좌
 ////////////////////////////////////////////////////////////////////////////////////////*/
.ad_box {margin-bottom:20px; text-align:center; /*border:solid 5px #f59d36; border-radius:15px; background-color: #fcecd9;*/}


/*////////////////////////////////////////////////////////////////////////////////////////
 바로가기 영역
 ////////////////////////////////////////////////////////////////////////////////////////*/
.quick_banner {margin:0 30px 30px;}
.quick_banner ul {overflow:hidden;}
.quick_banner ul li {float:left; padding:10px; width:33.33%; text-align:center; vertical-align:middle; box-sizing:border-box;}
.quick_banner ul li a {}

/* 모바일*/
@media all and (max-width:640px){
      .quick_banner {margin:0 10px 30px;}
}


/*////////////////////////////////////////////////////////////////////////////////////////
 하단 고정 메뉴
 ////////////////////////////////////////////////////////////////////////////////////////*/
.fix_menu {width:630px; background-color:#ff8f00; border-radius:10px; position:fixed; bottom:65px; left:calc(50% - 315px);
box-shadow: 0 3px 7px 0 rgb(248, 169, 61, 0.7);}

.fix_menu ul {display:table; width:100%; height:50px;}
.fix_menu ul li {display:table-cell; width:25%; text-align:center; vertical-align:middle;}
.fix_menu ul li a {display:block;}
.fix_menu ul li a:hover {background-color:#c16712;}
.fix_menu ul li a img {transform:scale(0.6);}

/* 모바일 */
@media all and (max-width:640px){
    .fix_menu {width:96%; left:2%;}
}

/*/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
 Footer
 /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
#footer {margin:0 auto; width:640px; padding:30px 0 70px; text-align:center; color:#fff; border-top:solid 2px #d68f2c; background-color:#f8a93d; box-sizing:border-box;}
.footer_copy {}
ul.footer_menu {padding:10px;}
ul.footer_menu li {display:inline-block; padding:0 10px; position:relative;}
ul.footer_menu li::after {display:block; content:''; width:1px; height:10px; background-color:#fff; position:absolute; left:0; top:calc(50% - 5px);}
ul.footer_menu li:first-child::after {display:none;}
ul.footer_menu li a {color:#fff;}
ul.footer_menu li a:hover {color:#ff641c;}

/* 모바일*/
@media all and (max-width:640px){
    #footer {width:100%; font-size:12px;}
}


/*////////////////////////////////////////////////////////////////////////////////////////
 주간 플레이어 투표 
 ////////////////////////////////////////////////////////////////////////////////////////*/
.week_box {position: relative;}
.week_box .dday_check {width:100%; text-align:center;}
.week_box .dday_check .time_count {display:inline-block; padding:2px 10px; color:#fff; font-size:13px; border-radius:0 10px 0 0; 
    background: #f8a93d;}
.week_box .dday_check .bar_track {height:7px; line-height:0; text-align:left; background-color:#ddd;}
.week_box .dday_check .bar_track span.bar_current {display:inline-block; height:7px; line-height:0; border-radius:0 7px 0 0;
    background: #f8a93d;
    background: linear-gradient(90deg,#ffca7f 1%, #f8a93d 100%)}

/* 투표 제목 */
.vote_subject {padding:15px 10px; text-align:center; background-color:#1c2868; background: linear-gradient(0deg,#d7802d 1%, #ff932d 100%);}
.vote_subject span {display:inline-block; width:30px; height:30px; line-height:30px; color:#fff; font-size:20px; background-color:#a55d22; border-radius:50%; margin-right:5px;}
.vote_subject h3 {display:inline-block; color:#fff; line-height:1.4;}


/* 우승 혜택 보기 */
.benefit_view {border-bottom:solid 1px #ccc;}
.benefit_view .benefit_top {padding:3px 0; font-size:16px; text-align:center;}
.benefit_view .benefit_top a.btn_benefit_detail {color:#333;}
.benefit_view .benefit_detail {padding:10px; color:#333;}

/* 선수 검색 */
.player_search_box {padding:15px; text-align:center; border-bottom:solid 1px #ddd;}
.player_search_box input {padding:0 5px; width:250px; height:36px; border-radius:0 10px 0 0; box-sizing:border-box;}
.player_search_box button {}

/* 선수목록 */
.player_list {}
.player_list ul {}
.player_list ul li {padding:10px 15px 3px 5px; border-top:solid 1px #ccc;}
.player_list ul li:first-child {border-top:none;}
.player_list ul li .outline {display:flex; justify-content:space-between;}
.player_list ul li .outline .photo {flex-shrink:0; width:100px;}
.player_list ul li .outline .photo .dis_box {display:flex; justify-content:space-between; align-items:center;}
.player_list ul li .outline .photo .dis_box .num {flex-shrink:0; width:30px; text-align:center;}
.player_list ul li .outline .photo .dis_box .num strong {color:#333;}
.player_list ul li .outline .photo .dis_box .thum {flex-grow: 1;}
.player_list ul li .outline .photo .dis_box .thum span {display:inline-block; width:60px; height:70px; border-radius:10px;
    background:no-repeat bottom center; background-size:cover;}
.player_list ul li .outline .info {flex-grow: 1;}
.player_list ul li .outline .info .name {}
.player_list ul li .outline .info .name strong {color:#333; font-size:16px;}
.player_list ul li .outline .info .vote_info {margin-bottom:2px; text-align:right;}
.player_list ul li .outline .info .vote_info strong {font-size:16px; color:#333;}
.player_list ul li .outline .info .vote_info span {font-size:12px; color:#666;}
.player_list ul li .outline .info .vote_info button.btn_like {vertical-align:bottom; width:30px; height:30px; font-size:0; text-indent:-10000px; background:url('../images/icon_like.png') no-repeat center; background-size:cover;}
.player_list ul li .outline .info .vote_info button.btn_like.active {background:url('../images/icon_like_active.png') no-repeat center; background-size:cover;}
.player_list ul li .outline .info .vote_track {height:7px; line-height:0; text-align:left; background-color:#dddddd; border-radius:0 7px 0 0;}
.player_list ul li .outline .info .vote_track .bar_current {display:inline-block; height:7px; line-height:0; border-radius:0 7px 0 0;
    background: #f8a93d;
    background: linear-gradient(90deg,#f8a93d 1%, #f8a93d 100%)}

/* 투표하기 팝업 */
.modal_vote {width:320px; margin-left:-160px; border:solid 3px #333; background-color:#fff; position:fixed; top:calc(50% - 200px); left:50%;
    box-shadow: 0 2px 10px 0 rgb(0 0 0 / 30%);}
.modal_vote .modal_title {display:flex; padding:0 15px; color:#fff; height:50px; align-items:center; justify-content:space-between; background-color:#1c2868;}
.modal_vote .modal_title a.btn_modal_close {font-size:20px;}
.modal_vote .modal_body {padding:20px;}
.modal_vote .modal_footer {padding:10px; text-align:center; border-top:solid 1px #ccc;}
.modal_vote .modal_footer button {margin:0 5px;}

.vote_select_player {margin-bottom:10px; padding-bottom:10px; border-bottom:solid 1px #ccc; text-align:center;}
.vote_select_player strong.ti {margin-bottom:15px; font-size:20px; color:#333;}
.vote_select_player .thum {margin:0 auto 5px; width:70px; height:80px; background:no-repeat center bottom; background-size:cover; border-radius:10px;}
.vote_select_player strong.player_name {font-size:18px; font-weight:normal;}

.my_ticket {font-size:16px; color:#666;}
.my_ticket strong {font-size:20px; color:#1c2868;}

.ticket_select_count {display:flex; padding:15px; margin:0 auto; justify-content:space-between; align-items:center; width:180px; background-color:#ecf0ff; border-radius:15px;}
.ticket_select_count a {display:inline-block; width:36px; height:36px; line-height:36px; color:#fff; font-size:20px; background-color:#5b5b8f; border-radius:40px;}
.ticket_select_count a:hover {background-color:#1c2868;}
.ticket_select_count input {padding:0; width:60px; height:40px; font-size:18px; text-align:center; text-indent:0; border:solid 2px #999ebf; border-radius:10px;}




/*////////////////////////////////////////////////////////////////////////////////////////
사이드 메뉴
 ////////////////////////////////////////////////////////////////////////////////////////*/
.sidemenu {width:600px; height:100%; overflow-y:auto; background-color:#fff; position:fixed; top:0; right:-650px; z-index:100; box-sizing:border-box;
    box-shadow: 0 2px 20px 0 rgb(0 0 0 / 20%); transition: all 0.3s ease-out;}
.sidemenu.active {right:0;}

.modal_screen {position:fixed; top:0; left:0; width:100%; height:100%; background-color:#000; opacity:0.5; z-index:99;}

.sidemenu_header {padding:50px 25px 15px; position:relative;}
.sidemenu_header a.btn_sidemenu_close {position:absolute; top:5px; right:15px;}
.sidemenu_header a.btn_sidemenu_close i {font-size:26px; font-weight:normal;}
.sidemenu_header .outline {display:flex; justify-content:space-between; align-items:top;}
.sidemenu_header .outline .user_face {flex-shrink:0; width:100px;}
.sidemenu_header .outline .user_face span {display:inline-block; width:80px; height:80px; background:#fff no-repeat center; background-size:55px; border:solid 1px #d3a46a; border-radius:10px 25px 10px 10px;} 

.sidemenu_header .outline .info {flex-grow: 1;}
.sidemenu_header .outline .info .top_row {display:flex; justify-content:space-between; align-items:center;}
.sidemenu_header .outline .info .top_row .top_info {line-height:1;}
.sidemenu_header .outline .info .top_row .top_info strong.nickname {font-size:20px;}
.sidemenu_header .outline .info .top_row .top_info span.id {display:inline-block; margin-left:5px; padding-left:10px; font-size:14px; color:#333; line-height:0; position:relative;}
.sidemenu_header .outline .info .top_row .top_info span.id::after {display:block; content:''; width:1px; height:8px; background-color:#333; position:absolute; top:calc(50% - 4px); left:0;}
.sidemenu_header .outline .info .top_row .top_func {}
.sidemenu_header .outline .info .top_row .top_func a {display:inline-block; width:32px; height:32px; text-align:center; background-color:#fff; border:solid 1px #d3a46a; border-radius:5px 15px 5px 5px;}
.sidemenu_header .outline .info .top_row .top_func a:hover {border:solid 1px #1c2868;}
.sidemenu_header .outline .info .top_row .top_func a img {}

.sidemenu_header .outline .info .bottom_row {}
.sidemenu_header .outline .info .bottom_row .ment {font-size:12px;}
.sidemenu_header .outline .info .bottom_row ul {display:flex; justify-content: space-between;}
.sidemenu_header .outline .info .bottom_row ul li {width:30%;}
.sidemenu_header .outline .info .bottom_row ul li .info_box {padding:0 5px; height:24px; line-height:24px; color:#666; font-size:14px; text-align:center; border:solid 1px #ccc; border-radius:0 10px 0 0;}
.sidemenu_header .outline .info .bottom_row ul li .info_box span.team_logo {display:inline-block; width:20px; height:18px; background:no-repeat center; background-size:100%; overflow:hidden; vertical-align:middle;}
.sidemenu_header .outline .info .bottom_row ul li .info_box span.player_name {color:#ff9800;}

.sidemenu_header .outline .info .bottom_row ul li strong.amount {color:#ff9800; font-size:20px;}
.sidemenu_header .outline .info .bottom_row ul li span.amount_txt {color:#666;}

button.btn_login {padding:0 15px; height:30px; background-color:#fff; border:solid 1px #1c2868; border-radius:0 10px 0 0;}

.sidemenu_row {}
.sidemenu_row .pg_title {}
.sidemenu_row .pg_title h3 {padding:3px 25px; color:#333; font-size:16px; background-color:#f2f2f2;}
.sidemenu_row .pg_content {padding-bottom:10px; background:#fff;}
.sidemenu_row .pg_content ul {padding:5px; padding-left:25px;}
.sidemenu_row .pg_content ul li {padding:3px 0;}
.sidemenu_row .pg_content ul li a {color:#666;}
.sidemenu_row .pg_content ul li a:hover {color:#333;}


/* 모바일*/
@media all and (max-width:640px){
    .sidemenu {width:95%;}

    .sidemenu_header .outline .user_face {flex-shrink:0; width:80px;}
    .sidemenu_header .outline .user_face span {display:inline-block; width:60px; height:60px; background-size:35px;}  

    .sidemenu_header .outline .info .bottom_row ul {display:flex; justify-content: space-between; flex-wrap: wrap;}
    .sidemenu_header .outline .info .bottom_row ul li {flex: 1 1 100%; padding:3px 0;}
}


/*////////////////////////////////////////////////////////////////////////////////////////
마이페이지
 ////////////////////////////////////////////////////////////////////////////////////////*/
.mypage_box {}

.mypage_header {padding:15px 25px; position:relative;}
.mypage_header .outline {display:flex; justify-content:space-between; align-items:top;}
.mypage_header .outline .user_face {flex-shrink:0; width:100px;}
.mypage_header .outline .user_face span {display:inline-block; width:80px; height:80px; background:#fff no-repeat center; background-size:55px; border:solid 1px #f8a93d; border-radius:10px 25px 10px 10px;} 

.mypage_header .outline .info {flex-grow: 1;}
.mypage_header .outline .info .top_row {display:flex; justify-content:space-between; align-items:center;}
.mypage_header .outline .info .top_row .top_info {line-height:1;}
.mypage_header .outline .info .top_row .top_info strong.nickname {font-size:20px;}
.mypage_header .outline .info .top_row .top_info span.id {display:inline-block; margin-left:5px; padding-left:10px; font-size:14px; color:#333; line-height:0; position:relative;}
.mypage_header .outline .info .top_row .top_info span.id::after {display:block; content:''; width:1px; height:8px; background-color:#333; position:absolute; top:calc(50% - 4px); left:0;}
.mypage_header .outline .info .top_row .top_func {}
.mypage_header .outline .info .top_row .top_func a {display:inline-block; width:32px; height:32px; text-align:center; background-color:#fff; border:solid 1px #f8a93d; border-radius:5px 15px 5px 5px;}
.mypage_header .outline .info .top_row .top_func a:hover {border:solid 1px #f8a93d;}
.mypage_header .outline .info .top_row .top_func a img {}

.mypage_header .outline .info .bottom_row {}
.mypage_header .outline .info .bottom_row .ment {font-size:12px;}
.mypage_header .outline .info .bottom_row ul {display:flex; justify-content: space-between;}
.mypage_header .outline .info .bottom_row ul li {width:30%;}
.mypage_header .outline .info .bottom_row ul li .info_box {padding:0 5px; height:24px; line-height:24px; color:#666; font-size:14px; text-align:center; border:solid 1px #ccc; border-radius:0 10px 0 0;}
.mypage_header .outline .info .bottom_row ul li .info_box span.team_logo {display:inline-block; width:20px; height:18px; background:no-repeat center; background-size:100%; overflow:hidden; vertical-align:middle;}
.mypage_header .outline .info .bottom_row ul li .info_box span.player_name {color:#f8ad4e;}

.mypage_header .outline .info .bottom_row ul li strong.amount {color:#333; font-size:20px;}
.mypage_header .outline .info .bottom_row ul li span.amount_txt {color:#666;}

/* 모바일*/
@media all and (max-width:640px){
    .mypage_header .outline .user_face {flex-shrink:0; width:80px;}
    .mypage_header .outline .user_face span {display:inline-block; width:60px; height:60px; background-size:35px;}  

    .mypage_header .outline .info .bottom_row ul {display:flex; justify-content: space-between; flex-wrap: wrap;}
    .mypage_header .outline .info .bottom_row ul li {flex: 1 1 100%; padding:3px 0;}
}


/* 마이페이지 탭 UI */
.tabmenu {}
.tabmenu ul {overflow:hidden;}
.tabmenu ul li {float:left; width:25%; text-align:center;}
.tabmenu ul li a {display:block; height:30px; line-height:30px; color:#333; border:solid 1px #aaa; background-color:#fff; border-radius:0 10px 0 0;}
.tabmenu ul li a.active {color:#fff; background-color:#f8a93d; border:solid 1px #f8a93d;}
.tabmenu.ea2 ul li {width:50%;}


/*  주간 투표결과 */
.vote_result_row:last-child {margin-bottom:50px;}
.vote_result_row .pg_title {}
.vote_result_row .pg_title h3 {padding:7px 15px; color:#333; font-size:14px; line-height:1.2; background-color:#f2f2f2;}
.vote_result_row .pg_content {background:#fff;}


/* 투표 결과 선수목록 */
.result_player_list {padding:10px 15px 0;}
.result_player_list .outline {display:flex; justify-content:space-between;}
.result_player_list .outline .photo {flex-shrink:0; width:75px;}
.result_player_list .outline .photo .thum {}
.result_player_list .outline .photo .thum span.img {display:inline-block; width:65px; height:80px; border-radius:10px; overflow:hidden;
    background:no-repeat bottom center; background-size:cover; position:relative;
    box-shadow: 0 2px 5px 0 rgb(0 0 0 / 50%);}
.result_player_list .outline .photo .thum span.img span.ranking {display:block; width:100%; font-size:10px; text-align:center; color:#fff; background-color:#f8a93d; position:absolute; bottom:0; left:0;}

.result_player_list .outline .info {flex-grow: 1;}
.result_player_list .outline .info .name {}
.result_player_list .outline .info .name strong {color:#1c2868; font-size:16px;}

.result_player_list .outline .info .vote_info {display:flex; justify-content:space-between; align-items:baseline; margin-bottom:5px;}
.result_player_list .outline .info .vote_info .left {font-size:10px;}
.result_player_list .outline .info .vote_info .left strong {font-size:12px;}
.result_player_list .outline .info .vote_info .right {}
.result_player_list .outline .info .vote_info .right strong {font-size:16px; color:#1c2868;}
.result_player_list .outline .info .vote_info .right span {font-size:12px; color:#666;}
.result_player_list .outline .info .vote_info .right button.btn_like {vertical-align:bottom; width:30px; height:30px; font-size:0; text-indent:-10000px; background:url('../images/icon_like.png') no-repeat center; background-size:cover;}
.result_player_list .outline .info .vote_info .right button.btn_like.active {background:url('../images/icon_like_active.png') no-repeat center; background-size:cover;}
.result_player_list .outline .info .vote_track {height:8px; line-height:0; text-align:left; background-color:#ddd; border-radius:0 7px 0 0; position:relative;}
.result_player_list .outline .info .vote_track .bar_current {display:inline-block; height:8px; line-height:0; border-radius:0 7px 0 0;
    background: #f8a93d;
    background: linear-gradient(90deg,#ffc470 1%, #f8a93d 100%)}
.result_player_list .outline .info .vote_track .ball_mark {width:16px; height:16px; position:absolute;top:calc(50% - 8px); left:80%; margin-left:-15px;}
.result_player_list .outline .info .total {padding-top:5px; font-size:10px; text-align:right; color:#999;}
.result_player_list .outline .info .total strong {font-size:12px; letter-spacing:-1px; color:#333;}

.vote_track_amount {height:12px; line-height:0; text-align:left; background-color:#c5cadf; border-radius:7px 10px 0 7px; position:relative;}
.vote_track_amount .bar_current {display:inline-block; padding-right:20px; height:12px; line-height:12px; color:#fff; font-size:10px; text-align:right; box-sizing:border-box; border-radius:0 7px 0 0;
    background: #1c2868;
    background: linear-gradient(90deg,#ff814c 1%, #ff561d 100%)}
.vote_track_amount .ball_mark {width:20px; height:20px; position:absolute;top:calc(50% - 10px); left:80%; margin-left:-15px;}

/* 소식 */
.news {}
.news ul {padding:10px 0;}
.news ul li {padding:5px 10px;}
.news ul li .outline {display:flex; justify-content:space-between;}
.news ul li .outline .thum {flex-shrink:0; width:140px;}
.news ul li .outline .thum span {display:inline-block; width:130px; height:90px; border-radius:15px;
    background:no-repeat bottom center; background-size:cover;}
.news ul li .outline .info {flex-grow: 1; padding:5px 0;}

.news ul li .outline .info a {}
.news ul li .outline .info strong.title {display:block; margin-bottom:30px; color:#333; font-size:14px; line-height:16px; height:34px; 
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
    text-overflow:ellipsis}
.news ul li .outline .info .extro_info {color:#666; font-size:12px;}
.news ul li .outline .info .extro_info strong {color:#ff0000;}


/* 메시지 */
.msg_box {padding:10px;}

.msg_form {margin-bottom:30px;}
.msg_form textarea {height:120px; border:solid 1px #ccc; border-radius:10px;}
.msg_form .func {display:flex; justify-content:space-between;}
.msg_form .func .left {}
.msg_form .func .left button {color:#333; background-color:#fff;}
.msg_form .func .left button i {color:#999;}
.msg_form .func .right {}
.msg_form .func .right span {margin-right:5px; font-size:10px; color:#999;}
.msg_form .func .right button {color:#333; background-color:#fff;}

.msg_list {}
.msg_list .msg_summary {display:flex; padding:5px; color:#333; background-color:#f2f2f2; justify-content:space-between; border-radius:5px;}
.msg_list .msg_summary .left {}
.msg_list .msg_summary .left span {color:#ff0000;}
.msg_list .msg_summary .right {}
.msg_list .msg_summary .right a.btn_align {display:inline-block; margin:0 5px; color:#999;}
.msg_list .msg_summary .right a.btn_align.active {color:#333;}

.msg_list {}
.msg_list ul {margin-bottom:30px;}
.msg_list ul li {padding:15px 0; border-bottom:solid 1px #ddd;}
.msg_list ul li:last-child {border-bottom:none;}
.msg_list ul li .outline {display:flex; justify-content:space-between;}
.msg_list ul li .outline .thum {flex-shrink:0; width:50px;}
.msg_list ul li .outline .thum span {display:inline-block; width:30px; height:30px; border:solid 1px #ccc; border-radius:10px;
    background:no-repeat center; background-size:60%;}
.msg_list ul li .outline .info {flex-grow: 1;}
.msg_list ul li .outline .info .into_top {}
.msg_list ul li .outline .info .into_top strong {display:block; line-height:1;}
.msg_list ul li .outline .info .into_top span {font-size:12px; color:#999;}
.msg_list ul li .outline .info .info_cont {padding:10px 0 0; color:#333;}


/* 결제 페이지 */
.pay_complete_msg {padding:100px 0 200px; text-align:center;}
.pay_complete_msg span.icon {display:inline-block; margin-bottom:7px; width:80px; height:80px; line-height:90px; text-align:center; background-color:#ffdcaf; border-radius:80px;}
.pay_complete_msg span.icon i {color:#5d380a; font-size:30px; font-weight:normal;}
.pay_complete_msg strong.pay_txt {display:block; font-size:20px; color:#e18d23;}

/*////////////////////////////////////////////////////////////////////////////////////////
충전 페이지지
 ////////////////////////////////////////////////////////////////////////////////////////*/
.charge_row {}
.charge_row .pg_title {}
.charge_row .pg_title h3 {padding:7px 15px; color:#333; font-size:14px; line-height:1.2; background-color:#fdf2e3;}
.charge_row .pg_content {padding-bottom:10px;}

.charge_list {}
.charge_list ul {}
.charge_list ul li {border-bottom:solid 1px #ddd;}
.charge_list ul li a {display:block; padding:15px;}
.charge_list ul li:last-child {border-bottom:none;}
.charge_list ul li .outline {display:flex; justify-content:space-between; align-items:center;}
.charge_list ul li .outline .icon {flex-shrink:0; width:50px; text-align:center;}
.charge_list ul li .outline .txt {flex-grow: 1;}
.charge_list ul li .outline .txt .dis_row {display:flex; justify-content:space-between; align-items:center;}
.charge_list ul li .outline .txt .dis_row title {}
.charge_list ul li .outline .txt .dis_row .won {}
.charge_list ul li .outline .txt .dis_row .won .won_box {display:inline-block; padding:0 10px; color:#333; border:solid 1px #333; border-radius:0 7px 0 0;}
.charge_list ul li .outline .txt .dis_row .won .won_box span {margin-left:3px; font-size:12px;}


/*////////////////////////////////////////////////////////////////////////////////////////
멤버십
 ////////////////////////////////////////////////////////////////////////////////////////*/
.membership_box {padding:20px;}

.form_row {padding:10px 0;}
.form_row strong.title {font-size:16px; color:#333;}
.form_row strong.title span {font-size:12px; color:#666;}
.form_row .form_cont {}
.form_row .form_cont input[type="text"],
.form_row .form_cont input[type="password"],
.form_row .form_cont input[type="number"] {padding:0 5px; height:30px; border-radius:0 10px 0 0; box-sizing:border-box;}

.sexy_group {}
.sexy_group button {width:100px; height:30px; color:#333; background-color:#fff; border:solid 1px #ccc; border-radius:0 10px 0 0;}
.sexy_group button.active {color:#fff; background-color:#aaa; border:solid 1px #999;}

.search_form_innerbutton {padding-right:95px; position:relative;}
.search_form_innerbutton input {width:100%;}
.search_form_innerbutton button {width:90px; height:32px; color:#fff; background-color:#aaa; border:solid 1px #999; border-radius:0 10px 0 0; position:absolute; top:0; right:0;}

.search_form {position:relative;}
.search_form input[type="text"] {padding-left:25px !important; width:100%;}
.search_form button {width:30px; height:30px; color:#f8a93d; background-color:transparent; border:none; position:absolute; top:0; left:0;}

/* 약관 등 동의 */
.agreebox {padding:5px 0;}
a.btn_agree_title {}
a.btn_agree_title i {transform:rotate(0); transition:all 0.5s ease-out;}
a.btn_agree_title.active i {transform:rotate(180deg);}

.agreebox .iframe_box {margin-top:5px; padding:0; border:solid 1px #ccc;}
.agreebox .iframe_box iframe {width:100%;}

.policy_page {padding:10px; color:#666;}
.policy_page .policy_title_l {margin-bottom:15px; padding-bottom:5px; font-size:18px; color:#333; border-bottom:solid 1px #ccc;}
.policy_page .policy_title {font-size:16px; color:#333;}
.policy_page .policy_title_s {}

.policy_page table {width:100%; border-collapse:collapse;}
.policy_page table th {padding:5px; border:solid 1px #ccc; background-color:#f2f2f2;}
.policy_page table td {padding:5px; border:solid 1px #ccc; background-color:#fff;}

/* 모바일*/
@media all and (max-width:640px){
    .policy_page .policy_title_l {font-size:16px;}
    .policy_page .policy_title {font-size:14px;}    
}


/*////////////////////////////////////////////////////////////////////////////////////////
로그인
 ////////////////////////////////////////////////////////////////////////////////////////*/
.login_box {padding:20px 20%;}
.login_box h3 {padding:10px 0; margin-bottom:10px; color:#333; font-size:20px; text-align:center; border-bottom:solid 1px #ccc;}
.login_form_box {padding:5px 0}

.login_guide {padding:20px 20%;}
.login_guide_txt {margin-bottom:50px; font-size:18px;}
.login_exter {text-align:center;}
.login_exter button {width:200px;}

/*////////////////////////////////////////////////////////////////////////////////////////
팝업
 ////////////////////////////////////////////////////////////////////////////////////////*/
 /* 투료완료 */
.vot_modal {width:300px; background-color:#fefaf6; border-radius:30px; overflow:hidden; position:fixed; top:calc(50% - 200px); left:calc(50% - 150px); box-shadow: 0 2px 10px 0 rgb(0 0 0 / 30%);}
.vot_modal .modal_head {padding:0 10px; line-height:50px; text-align:center; background-color:#f8a93d; position: relative;}
.vot_modal .modal_head h1 {}
.vot_modal .modal_head h1 img {height:20px;}
.vot_modal a.btn_molal_close {color:#fff; position:absolute; top:0; right:20px;}

.vot_modal .modal_body {padding:15px 15px 30px; text-align:center;}

.vot_complet_msg {margin:0 auto; width:250px; position:relative;}
.vot_complet_msg .ment {text-align:left; font-size:18px;}
.vot_complet_msg .duck {position:absolute; top:-27px; right:0;}
.vot_complet_msg .duck img {height:100px;}
.vot_result_msg {margin-top:100px; padding-bottom:15px; font-size:16px; color:#666;}


 /* 덕표권 사용하기 */
.ticket_modal {width:300px; background-color:#fefaf6; border-radius:30px; overflow:hidden; position:fixed; top:calc(50% - 200px); left:calc(50% - 150px); box-shadow: 0 2px 10px 0 rgb(0 0 0 / 30%);}
.ticket_modal .modal_head {padding:0 10px; line-height:50px; text-align:center; border-bottom:solid 1px #ccc; position:relative;}
.ticket_modal .modal_head h1 {color:#f8a93d; font-size:22px;}
.ticket_modal .modal_head h1 img {height:20px;}
.ticket_modal a.btn_molal_close {color:#333; position:absolute; top:0; right:20px;}

.ticket_modal .modal_body {padding:15px 15px 30px; text-align:center;}

.ticket_input_view {color:#f8a93d; font-size:18px;}
.ticket_input_view .num {font-size:24px; vertical-align: middle;}
.ticket_input_view .num strong {display:inline-block; color:#333; vertical-align: middle;}
.ticket_input_view .txt {}

.ticket_count_func {padding:5px 0 15px;}
.ticket_count_func button {}
.ticket_count_func input {width:150px; height:34px; text-align: center; border-radius:0 5px 0 0; }

.my_current_ticket {padding:10px 0;}
.my_current_ticket span {display:block;}
.my_current_ticket strong {display:block; font-size:28px;}

.ticket_button_func {}
.ticket_button_func button {margin:3px; width:200px;}

/* 일반 알림 */
.alert_msg {padding:20px 0; font-size:18px;}
