@charset "utf-8";
/*/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
 공통 - UI 
/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
body {background-color:#fff; min-height:100vh; padding-bottom:150px;}
#wrapper {margin:0 auto; width:640px; min-height:calc(100% - 190px); box-sizing: border-box; position:relative;}

.header_pos {background-color:#fff;}
.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:30px;}
.header_pos .header a.btn_sidemenu {position:absolute; top:calc(50% - 16px); right:10px;}
.header_pos .header a.btn_sidemenu i {color:#333; 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 {margin-top:40px;}
.pick_player .cont_header {display:flex; justify-content:space-between; align-items:center; padding:0; border-radius:10px; border:solid 1px #ddd; box-shadow: 3px 3px 10px #aaaaaa;}
.pick_player .cont_header .ti {display:flex; gap:5px;}
.pick_player .cont_header .ti span {display:inline-block; margin-bottom:10px; padding:7px 10px; font-size:17.84px; color:#fff; background-color:#f88431; border-radius:5px; line-height:1.21; font-family:'Inter', sans-serif; font-weight:700; word-break:break-all;}
.pick_player .cont_header .ti img {height:15px;}
.pick_player .cont_header h3 {margin-right:5px; font-size:22px !important; color:#3d3d3d; line-height:1.193; font-family:'Pretendard', sans-serif; font-weight:800; letter-spacing:-0.01em;}
.pick_player .player_box {display:flex; justify-content:flex-start; gap:10px; align-items:center; border-radius:10px; background-color:var(--primary-color); font-family:gumi,serif; font-weight:600; word-break:break-all;
box-shadow:0 0 10px #aaa;}
.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; flex-grow:1;}
.pick_player .player_box .name span.grade {font-size:30px; font-family:'Gumi Romance', gumi, serif; font-weight:400; line-height:52px;}
.pick_player .player_box .name strong.player {display:block; font-size:43px; line-height:52px; font-family:'Gumi Romance', gumi, serif; font-weight:400;}
.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:25px; color:#fff; font-family:'Inter', sans-serif; font-weight:700; line-height:1.21;}
.pick_player .player_box .vote strong.num span {font-size:15px; font-family:'Inter', sans-serif; font-weight:700;}
.pick_player .player_box .vote button {padding:10px; font-size:20px; color:#f8a93d; background-color:#fff; border-radius:7px; font-family:'Gumi Romance', gumi, serif; font-weight:400; line-height:1.13;}

.myfavorite_player {padding-bottom:25px;}

/* 모바일*/
@media all and (max-width:640px){
    .pick_player .cont_header h3 {font-size:14px !important; margin-right:3px;}
    .pick_player .cont_header .ti {gap:3px;}
    .pick_player .cont_header .ti img {height:12px;}
    .pick_player .cont_header .ti span {font-size:12px; padding:5px 8px;}
    .pick_player .cont_header {padding:5px;}
    .pick_player .player_box .thum {flex-shrink:0; flex-basis:110px;}
    .pick_player .player_box .name span.grade {
        font-size: clamp(15px, calc(15px + (30 - 15) * ((100vw - 340px) / (640 - 340))), 30px);
        line-height: clamp(25px, calc(25px + (52 - 25) * ((100vw - 340px) / (640 - 340))), 52px);
    }
    .pick_player .player_box .name strong.player {
        font-size: clamp(21px, calc(21px + (43 - 21) * ((100vw - 340px) / (640 - 340))), 43px);
        line-height: clamp(25px, calc(25px + (52 - 25) * ((100vw - 340px) / (640 - 340))), 52px);
    }
    .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:15px !important; line-height:25px !important;}
    .pick_player .player_box .name strong.player {font-size:21px !important; line-height:25px !important;}
    .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:18px; 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;}
}


/*////////////////////////////////////////////////////////////////////////////////////////
 메인 : 실시간 응원톡
 ////////////////////////////////////////////////////////////////////////////////////////*/
.live_talk {margin-top:30px; margin-bottom:30px; overflow:hidden;}
.live_talk .cont_header {display:flex; justify-content:space-between; align-items:center; padding:0 10px; border-radius:4.5px; background-color:var(--primary-color); box-shadow:3px 3px 10px #aaaaaa;}
.live_talk .cont_header h3 {font-size:18px; color:#fff; font-family:gumi,serif; font-weight:600; word-break:break-all;}
.live_talk .cont_header img {margin-bottom:18px;}

.live_talk .swipe_banner {padding:15px 0; margin-bottom:10px; border-radius:10px; background-color:#fff; box-shadow:3px 3px 10px #ddd;}

.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:#fff no-repeat center center; background-size:cover;
box-shadow: 0 3px 7px 0 #aaa;}
.today_player strong.player_name {display:block; color:#333; font-size:18px; font-weight:800;}

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

      .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;
  } 


/*////////////////////////////////////////////////////////////////////////////////////////
 메인 공지사항 
 ////////////////////////////////////////////////////////////////////////////////////////*/
.main_notice {display:flex; align-items:center; margin:40px 10px; padding:10px 20px; border-radius:10px; border:solid 2px #d4d4d4; background-color:#f7f7f7;}
.main_notice .bell {flex-shrink:0; width:60px;}
.main_notice .bell {}
.main_notice .content {width:calc(100% - 60px)}
.main_notice .content h3 {}
.main_notice .content ul.list {}
.main_notice .content ul.list li {}
.main_notice .content ul.list li a {color:#777;
    display:block;
      text-overflow:ellipsis;
      white-space:nowrap;
      word-wrap:normal;
      overflow:hidden;
}


/*////////////////////////////////////////////////////////////////////////////////////////
 광고 구좌
 ////////////////////////////////////////////////////////////////////////////////////////*/
.ad_box {
    margin-bottom:20px;
    text-align:center;
    /* 광고 영역은 배경없이 투명하게 처리 */
}


/*////////////////////////////////////////////////////////////////////////////////////////
 바로가기 영역
 ////////////////////////////////////////////////////////////////////////////////////////*/
.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;}
}

.quick_banner2 {margin:0 30px 30px;}
.quick_banner2 ul {overflow:hidden;}
.quick_banner2 ul li {float:left; padding:10px; width:33.33%; text-align:center; vertical-align:middle; box-sizing:border-box;}
.quick_banner2 ul li a {display:inline-block; height:150px; width:150px; background:url('../images/quick_banner_bg.png') #f8a93d no-repeat center center; background-size:cover; border-radius:40px 0 40px 40px; box-shadow: 0 3px 7px 0 rgb(248, 169, 61, 0.7); transition: all 0.3s ease;}
.quick_banner2 ul li a:hover {transform: scale(1.05); box-shadow: 0 5px 15px 0 rgb(248, 169, 61, 0.9); background-color: #ff9f1a;}
.quick_banner2 ul li a div.outline {display:flex; flex-direction:column; justify-content:center; align-items:center; height:100%; width:100%;}
.quick_banner2 ul li a div.outline img {width:60px; margin-bottom:10px;}
.quick_banner2 ul li a div.outline .title {color:#fff; font-size:18px; line-height:1.2;}

/* 모바일*/
@media all and (max-width:640px){
    .quick_banner2 {margin:0 10px 30px;}
    .quick_banner2 ul li a {height:120px; width:120px; border-radius:30px 0 30px 30px;}
    .quick_banner2 ul li a div.outline img {width:60px;}
    .quick_banner2 ul li a div.outline .title {font-size:15px;}
}
@media all and (max-width:480px){
    .quick_banner2 {margin:0 10px 30px;}
    .quick_banner2 ul li a {height:90px; width:90px; border-radius:20px 0 20px 20px;}
    .quick_banner2 ul li a div.outline img {width:35px; margin-bottom:5px;}
    .quick_banner2 ul li a div.outline .title {font-size:12px;}
}


/*////////////////////////////////////////////////////////////////////////////////////////
 하단 고정 메뉴
 ////////////////////////////////////////////////////////////////////////////////////////*/
.fix_menu {max-width:640px; width:100%; background-color:#fff; position:fixed; bottom:0; left:-15px !important; right:0; margin:0 auto; box-shadow: 0 -3px 7px 0 rgba(0,0,0,0.1); z-index:1000;}

.fix_menu ul {display:table; padding:7px 0; width:100%;}

/* 모바일에서 하단 내비게이션 바 하단 여백 추가 */
@media (max-width: 768px) {
    .fix_menu {
        padding-bottom: 15px;
    }
}
.fix_menu ul li {display:table-cell; width:25%; text-align:center;}
.fix_menu ul li a {display:flex; justify-content:center; align-items:center; flex-direction:column; text-decoration:none;}
.fix_menu ul li a:hover {background-color:transparent;}
.fix_menu ul li a img {transform:scale(0.6);}
.fix_menu ul li a span.icon {display:inline-block; width:40px; height:40px; background-color:transparent;}
.fix_menu ul li a span.menu_name {display:block; line-height:1; font-size:10px; color:#999; margin-top:3px;}

.fix_menu ul li.home a span.icon {background: url('/images/menu_icon_1.png') no-repeat center; background-size:38px;}
.fix_menu ul li.home.active a span.icon,
.fix_menu ul li.home:hover a span.icon {background-image: url('/images/menu_icon_1_active.png');}
.fix_menu ul li.home.active a span.menu_name,
.fix_menu ul li.home:hover a span.menu_name {color:#f8a93d;}

.fix_menu ul li.charge a span.icon {background: url('/images/menu_icon_2.png') no-repeat center; background-size:38px;}
.fix_menu ul li.charge.active a span.icon,
.fix_menu ul li.charge:hover a span.icon {background-image: url('/images/menu_icon_2_active.png');}
.fix_menu ul li.charge.active a span.menu_name,
.fix_menu ul li.charge:hover a span.menu_name {color:#f8a93d;}

.fix_menu ul li.votebox a span.icon {background: url('/images/menu_icon_3.png') no-repeat center; background-size:38px;}
.fix_menu ul li.votebox.active a span.icon,
.fix_menu ul li.votebox:hover a span.icon {background-image: url('/images/menu_icon_3_active.png');}
.fix_menu ul li.votebox.active a span.menu_name,
.fix_menu ul li.votebox:hover a span.menu_name {color:#f8a93d;}

.fix_menu ul li.setting a span.icon {background: url('/images/menu_icon_4.png') no-repeat center; background-size:38px;}
.fix_menu ul li.setting.active a span.icon,
.fix_menu ul li.setting:hover a span.icon {background-image: url('/images/menu_icon_4_active.png');}
.fix_menu ul li.setting.active a span.menu_name,
.fix_menu ul li.setting:hover a span.menu_name {color:#f8a93d;}

/* 모바일에서는 하단 메뉴 표시 */
 Footer
 /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
#footer {width:100%; margin:0 auto; padding:40px 0 150px; text-align:center; color:#666; background-color:#f2f2f2; box-sizing:border-box; font-size:12px; line-height:1.6;}
footer#footer .footer_copy {margin:0 auto !important; max-width:640px; width:95%; padding:40px 0 100px 0; margin-bottom:80px; box-sizing:border-box; display:block;  text-align:center !important;}
footer#footer .footer_copy * {text-align:center !important;}
.footer_logo {margin-bottom:15px !important; margin-top:20px;}

/* 모바일 - 푸터 로고 여백 반응형 */
@media all and (max-width:640px){
    .footer_logo {margin-bottom:15px !important;}
}
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:#999; position:absolute; left:0; top:calc(50% - 5px);}
ul.footer_menu li:first-child::after {display:none;}
ul.footer_menu li a {color:#666;}
ul.footer_menu li a:hover {color:#ff641c;}
/* 데스크톱 (641px 이상) */
@media all and (min-width:641px){
    .footer_logo {padding:0 0 15px 0; margin-top:20px; margin-bottom:15px !important;}
    
    
}


/* 모바일*/
@media all and (max-width:640px){
    footer#footer .footer_copy {padding-top:clamp(5px, 2vw, 10px) !important; padding-bottom:0px !important;}
    
    #footer {width:100%; font-size:12px; padding-bottom:20px !important;}
}


/*////////////////////////////////////////////////////////////////////////////////////////
 주간 플레이어 투표 
 ////////////////////////////////////////////////////////////////////////////////////////*/
.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: #FFD700;
    background: linear-gradient(90deg, #FFD700 0%, #FFA500 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 {}
.benefit_view .benefit_top {padding:3px 0; font-size:16px; text-align:center; background-color:var(--primary-color); box-shadow: 3px 3px 5px #ddd;}
.benefit_view .benefit_top a.btn_benefit_detail {color:#fff;}
.benefit_view .benefit_detail {padding:10px; color:#333; border-bottom:solid 1px #ccc;}

/* 선수 검색 */
.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 {}
.player_list ul li:first-child {border-top:none;}
.player_list ul li .outline {display:flex; padding:15px 10px; justify-content:space-between; border-radius:5px; box-shadow:0 5px 5px #eee;}
.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; box-shadow: 1px 3px 5px 0 rgb(248, 169, 61, 0.4);
    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; overflow:hidden; height:40px; display:flex; align-items:flex-end; box-sizing:border-box;}
.player_list ul li .outline .info .vote_info .talk_sum {align-self:flex-end; margin-bottom:10px !important; width:calc(100% - 160px); position:relative;}
.player_list ul li .outline .info .vote_info .talk_sum a {display:block; padding:3px; padding-right:15px !important; font-size:12px; color:#666; background-color:#eee; border-radius:5px; box-sizing:border-box;}
.player_list ul li .outline .info .vote_info .talk_sum .arrow {position:absolute; top:calc(50% - 11px); right:2px;}
.player_list ul li .outline .info .vote_info .vote_count {width:160px; text-align:right; height:40px; display:flex; align-items:center; justify-content:flex-end; gap:10px;}

.player_list ul li .outline .info .vote_info .vote_count strong {font-size:16px; color:#333;}
.player_list ul li .outline .info .vote_info .vote_count span {font-size:12px; color:#666;}
.player_list ul li .outline .info .vote_info .vote_count button.btn_like {vertical-align:bottom; width:40px; height:40px; 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 .vote_count button.btn_like.active {background:url('../images/icon_like_active.png') no-repeat center; background-size:cover;}

/* 투표 페이지 player_list 모바일 반응형 */
@media all and (max-width:640px){
    .player_list ul li .outline {padding:10px 5px;}
    .player_list ul li .outline .photo {width:80px;}
    .player_list ul li .outline .photo .dis_box .num {width:25px;}
    .player_list ul li .outline .photo .dis_box .thum span {width:50px; height:60px;}
    
    .player_list ul li .outline .info .vote_info .talk_sum {width:calc(100% - 120px); font-size:11px;}
    .player_list ul li .outline .info .vote_info .talk_sum a {padding:2px 5px; font-size:11px;}
    .player_list ul li .outline .info .vote_info .vote_count {width:120px; gap:5px;}
    .player_list ul li .outline .info .vote_info .vote_count strong {font-size:14px;}
    .player_list ul li .outline .info .vote_info .vote_count span {font-size:10px;}
    .player_list ul li .outline .info .vote_info .vote_count button.btn_like {width:35px; height:35px;}
}

@media all and (max-width:360px){
    .player_list ul li .outline .info .vote_info .talk_sum {width:calc(100% - 100px);}
    .player_list ul li .outline .info .vote_info .vote_count {width:100px;}
    .player_list ul li .outline .info .vote_info .vote_count strong {font-size:12px;}
    .player_list ul li .outline .info .vote_info .vote_count button.btn_like {width:30px; height:30px;}
}


.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: #FFD700;
    background: linear-gradient(90deg, #FFD700 0%, #FFA500 100%)}

/* 투표하기 팝업 */
/*////////////////////////////////////////////////////////////////////////////////////////
팝업
 ////////////////////////////////////////////////////////////////////////////////////////*/
.modal {
    width: 300px;
    background-color: #ffffff !important;  /* 순수 흰색 */
    border-radius: 10px 30px 10px 10px;
    overflow: hidden;
    position: fixed !important;
    top: 50% !important;
    left: calc(50% - 16px) !important;
    transform: translate(-50%, -50%) !important;
    box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.5) !important;  /* 더 진한 그림자 */
    z-index: 9999 !important;
    opacity: 1 !important;  /* 투명도 없음 */
}


.modal .modal_head {
    padding: 0 10px;
    line-height: 50px;
    text-align: center;
    background-color: #f8a93d;
    position: relative;
}

.modal .modal_head h1 {}
.modal .modal_head h1 img {height: 20px;}
.modal a.btn_molal_close {color: #fff; position: absolute; top: 0; right: 20px;}
.modal .modal_body {
    padding: 15px 15px 30px;
    text-align: center;
    background-color: #fff !important;  /* 흰색 배경 강제 */
}

/* 투표하기 팝업 */
.modal_vote {
    background: white !important;
    border-radius: 20px !important;
    padding: 30px !important;
    width: 350px !important;
    max-width: 90% !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4) !important;
    border: 1px solid rgba(0, 0, 0, 0.1) !important;
    background-color: #ffffff !important;
    opacity: 1 !important;
}
.modal_vote .modal_title {
    text-align: center !important;
    position: relative !important;
    padding-bottom: 20px !important;
    margin-bottom: 30px !important;
    border-bottom: 1px solid #eee !important;
    background: transparent !important;
    padding: 0 0 20px 0 !important;
}
.modal_vote .modal_title h3 {
    color: #333;
    font-size: 20px;
    margin: 0;
}

.modal_vote .modal_title h1 {
    text-align: center !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
}

.modal_vote .modal_title h1 img {
    display: block !important;
    margin: 0 auto !important;
    height: 30px !important;
}

.modal_vote .modal_body {
    padding: 0 !important;
}

.modal_vote .login_guide_txt {
    text-align: center !important;
    font-size: 20px !important;
    line-height: 1.6 !important;
    margin-bottom: 40px !important;
    color: #333 !important;
    font-weight: 500 !important;
}

.modal_vote .btn_kakao {
    width: 100% !important;
    padding: 16px !important;
    background: #FEE500 !important;
    border: none !important;
    border-radius: 12px !important;
    font-size: 17px !important;
    font-weight: bold !important;
    color: #000000 !important;
    cursor: pointer !important;
    transition: all 0.3s !important;
    display: block !important;
}
.modal_vote .modal_title a.btn_modal_close {
    position: absolute;
    top: 50%;
    right: 15px;
    transform: translateY(-50%);
    text-decoration: none;
    display: block;
    width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
}
.modal_vote .modal_title a.btn_modal_close i {
    font-size: 20px;
    color: #666;
    line-height: 30px;
}
.modal_vote .modal_title a.btn_modal_close:hover i {
    color: #333;
}

.vote_select_player {
    margin-bottom: 10px;
    text-align: center;
}
.vote_select_player strong.player_name {
    font-size: 20px;
    margin-bottom: 10px;
    display: block;
}
.vote_select_player .thum {
    margin: 0 auto 5px;
    width: 70px;
    height: 80px;
    background: no-repeat center bottom;
    background-size: cover;
    border-radius: 10px;  /* 템플릿과 동일한 둥근 사각형 */
}

.my_ticket {padding:15px 0; color:#666; line-height:1;}
.my_ticket strong {color:#000;}

.ticket_select_count {display:flex; justify-content:center; align-items:center; gap:5px}
.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:120px; height:34px; font-size:18px; text-align:center; text-indent:0; border:solid 2px #ccc; border-radius:5px;}

/* 모달 스크린 */
.modal_screen {position:fixed; top:0; left:0; width:100%; height:100%; background-color:#000; opacity:0.5; z-index:9998;}

/* 투표 팝업 전용 오버레이 - 배경만 어둡게 */
.vote_modal_overlay {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background-color: rgba(0, 0, 0, 0.5) !important;
    z-index: 9998 !important;
    display: none;
}

.my_ticket {padding:15px 0; color:#666; line-height:1;}
.my_ticket strong {color:#000;}

.ticket_select_count {display:flex; justify-content:center; align-items:center; gap:5px}
.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:120px; height:34px; font-size:18px; text-align:center; text-indent:0; border:solid 2px #ccc; border-radius:5px;}




/*////////////////////////////////////////////////////////////////////////////////////////
사이드 메뉴
 ////////////////////////////////////////////////////////////////////////////////////////*/
.sidemenu {width:600px; height:100%; overflow-y:auto; background-color:#fff; position:fixed; top:0; right:-650px; z-index:10000; 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;}

/* 중복 제거 - 위에 정의됨 */

.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 {display:flex; gap:10px;}
.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 {display:flex; align-items:center; gap:10px;}
.mypage_header .outline .info .top_row .top_func a {display:inline-block; width:32px; height:32px; font-weight:normal; 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:#f8ad4e; 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%;}

.tabmenu_sub {padding:30px 0 15px;}
.tabmenu_sub ul {display:flex; justify-content:center; gap:10px;}
.tabmenu_sub ul li {}
.tabmenu_sub ul li a {display:inline-block; padding-bottom:2px; color:#333; font-size:16px; font-weight:600;}
.tabmenu_sub ul li a.active { color:var(--primary-color); border-bottom:solid 3px var(--primary-color)}


/*  주간 투표결과 */
.vote_result_row:last-child {margin-bottom:50px;}
.vote_result_row .pg_title {padding:10px;}
.vote_result_row .pg_title h3 {display:inline-block; padding:0 10px; color:#fff; font-size:14px; border-radius:5px; background-color:var(--sub-color-red);}
.vote_result_row .pg_content {background:#fff;}


/* 투표 결과 선수목록 */
.result_player_list {margin:0 10px; border:solid 1px #ddd; border-radius:7px; overflow:hidden; box-shadow: 0 2px 5px 0 rgb(0 0 0 / 5%);}
.result_player_list .pick_header {display:flex; justify-content:space-between; align-items:baseline; padding:5px; color:#fff; background-color:var(--primary-color);}
.result_player_list .pick_header .title {}
.result_player_list .pick_header .date {font-size:11px;}
.result_player_list .outline {display:flex; justify-content:space-between; padding:15px 10px 5px;}
.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:90px; 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 {line-height:1.2; position:relative; top:5px;}
.result_player_list .outline .info .name strong {font-size:16px;}

.result_player_list .outline .info .vote_info {margin-bottom:2px; overflow:hidden;}
.result_player_list .outline .info .vote_info .talk_sum {float:left; margin-top:13px; width:calc(100% - 150px); position:relative;}
.result_player_list .outline .info .vote_info .talk_sum a {display:block; padding:3px; padding-right:15px !important; font-size:12px; color:#666; background-color:#eee; border-radius:5px; box-sizing:border-box;}
.result_player_list .outline .info .vote_info .talk_sum .arrow {position:absolute; top:calc(50% - 11px); right:2px;}
.result_player_list .outline .info .vote_info .vote_count {float:right; padding-top:5px; padding-right:40px; width:150px; box-sizing:border-box; position:relative;}
.result_player_list .outline .info .vote_info .vote_count .count {text-align:right; line-height:1.2;}
.result_player_list .outline .info .vote_info .vote_count .count strong {font-size:15px; color:#333;}
.result_player_list .outline .info .vote_info .vote_count .count span {font-size:11px; color:#666;}
.result_player_list .outline .info .vote_info .vote_count button.btn_like {vertical-align:bottom; width:36px; height:36px; font-size:0; text-indent:-10000px; background:url('../images/icon_like.png') no-repeat center; background-size:cover;
position:absolute; bottom:0; right:0;}
.result_player_list .outline .info .vote_info .vote_count 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: #FFD700;
    background: linear-gradient(90deg, #FFD700 0%, #FFA500 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; margin-bottom:10px;}
.news ul li .outline {position:relative;}
.news ul li .outline .cont {padding:15px; padding-right:50px; border:solid 0px #ccc; border-radius:10px; box-shadow:0px 1px 5px #ddd;}
.news ul li .outline .cont:hover {background-color:#f2f2f2;}
.news ul li .outline .cont .top {display:flex; justify-content:space-between;}
.news ul li .outline .cont .top .cata {color:var(--primary-color);}
.news ul li .outline .cont .top .date {font-size:12px; color:#999;}
.news ul li .outline .cont .title {display:block; color:#333; font-size:14px;
    display:block;
      text-overflow:ellipsis;
      white-space:nowrap;
      word-wrap:normal;
      overflow:hidden;}

.news ul li .outline .cert {font-size:20px; position:absolute; top:calc(50% - 15px); right:10px;}




/* 메시지 */
.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 {display:flex; justify-content:space-between; align-items:center; padding:0 10px; border-radius:4.5px; background-color:var(--primary-color); box-shadow:3px 3px 10px #aaaaaa;}
.charge_row .pg_title h3 {color:#fff; font-size:18px;}
.charge_row .pg_content {padding-bottom:10px;}

.charge_list {}
.charge_list ul {}
.charge_list ul li {margin:15px 0; border-radius:10px; background-color:#fff; border:1px solid #f0f0f0; box-shadow: 0px 0px 4px 0px rgba(124, 124, 124, 0.75);}
.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; 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;}

/* 팝업 - 위에 정의됨 */

/* 로그인 필요 모달 스타일 */
.modal_overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    z-index: 10000;
}

.modal_overlay .modal_container {
    position: fixed;
    top: 50%;
    left: calc(50% - 14px);
    transform: translate(-50%, -50%);
    background: white;
    border-radius: 20px;
    padding: 30px;
    width: 350px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
}

.modal_overlay .modal_head {
    text-align: center;
    position: relative;
    margin-bottom: 30px;
    padding-bottom: 20px;
    border-bottom: 1px solid #eee;
}

.modal_overlay .modal_head h1 {
    margin: 0;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
}

.modal_overlay .modal_head h1 img {
    height: 30px;
    display: block;
}

.modal_overlay .modal_head .btn_modal_close {
    position: absolute;
    right: 0px;
    top: 0px;
    background: none;
    border: none;
    font-size: 28px;
    color: #999;
    cursor: pointer;
    transition: color 0.3s;
}

.modal_overlay .modal_head .btn_modal_close:hover {
    color: #333;
}

.modal_overlay .login_guide_txt {
    text-align: center;
    font-size: 20px;
    line-height: 1.6;
    margin-bottom: 40px;
    color: #333;
    font-weight: 500;
}

.modal_overlay .login_exter {
    text-align: center;
}

.modal_overlay .btn_kakao {
    width: 100%;
    padding: 16px;
    background: #FEE500;
    border: none;
    border-radius: 12px;
    font-size: 17px;
    font-weight: bold;
    color: #000000;
    cursor: pointer;
    transition: all 0.3s;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.modal_overlay .btn_kakao:hover {
    background: #fdd400;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.modal_overlay .btn_kakao:active {
    transform: translateY(0);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* 모달 반응형 처리 */
@media screen and (max-width: 480px) {
    .modal_overlay .modal_container {
        width: 90%;
        max-width: 350px;
    }
}

.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:14px; 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;}


/*//////////////////////////////////////////////////////////////////////////////// 
메시지 모달 
//////////////////////////////////////////////////////////////////////////////// */
.modal_msg {width:300px; background-color:#fff; border-radius:10px; overflow:hidden; position:fixed; top:calc(50% - 200px); left:calc(50% - 150px); box-shadow: 0 2px 10px 0 rgb(0 0 0 / 30%); z-index:10;}
.modal_msg .modal_head h1 {}
.modal_msg .modal_head h1 img {height:20px;}
.modal_msg a.btn_molal_close {color:#fff; position:absolute; top:0; right:20px;}

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

/* 공유하기 */
ul.share_list {display:flex; justify-content:center; align-items:center; gap:20px;}
ul.share_list li {}
ul.share_list li a {}
ul.share_list li .icon {width:56px; height:56px; border-radius:100%; background-color:#ddd;}
ul.share_list li .icon.kakao {background-color:#fde339;}
ul.share_list li .text {display:block; margin-top:5px;}


/*//////////////////////////////////////////////////////////////////////////////// 
응원톡 목록
//////////////////////////////////////////////////////////////////////////////// */
.cheer_talk_list {margin:0 10px;}
.cheer_talk_list .talk_header {display:flex; justify-content:space-between; align-items:baseline; padding:5px; color:#fff; border-radius:7px; border:solid 1px #ddd; background-color:var(--primary-color);}
.cheer_talk_list .talk_header .title {}
.cheer_talk_list .talk_header .date {font-size:11px;}

.cheer_talk_list ul li {margin-bottom:1px;}
.cheer_talk_list ul li .outline {display:flex; justify-content:space-between; align-items:center; padding:15px 10px 5px; border-radius:7px; background-color:#f9f9f9; box-shadow: 1px 1px 1px 1px rgb(0 0 0 / 10%);}
.cheer_talk_list ul li .outline .photo {flex-shrink:0; width:55px;}
.cheer_talk_list ul li .outline .photo .thum {}
.cheer_talk_list ul li .outline .photo .thum span.img {display:inline-block; width:50px; height:60px; border-radius:10px; overflow:hidden;
    background:no-repeat bottom center; background-size:cover;}
.cheer_talk_list ul li .outline .photo .thum.teamlogo span.img {background:no-repeat center; background-size:contain;}
.cheer_talk_list ul li .outline .info {flex-grow: 1; width:calc(100% - 55px); position:relative;}


.cheer_talk_list ul li .outline .info .cont {padding-left:10px; padding-right:30px;}
.cheer_talk_list ul li .outline .info .cont:hover {background-color:#f2f2f2;}
.cheer_talk_list ul li .outline .info .cont .top {display:flex; justify-content:space-between; align-items:baseline; margin-bottom:5px;}
.cheer_talk_list ul li .outline .info .cont .top .cata {color:var(--primary-color); line-height:1.2;}
.cheer_talk_list ul li .outline .info .cont .top .date {flex-shrink:0; width:100px; font-size:12px; color:#999; letter-spacing:-1px; text-align:right;}
.cheer_talk_list ul li .outline .info .cont .title {display:block; color:#333; font-size:14px;
    display:block;
      text-overflow:ellipsis;
      white-space:nowrap;
      word-wrap:normal;
      overflow:hidden;}

.cheer_talk_list ul li .outline .cert {font-size:20px; position:absolute; top:calc(50% - 15px); right:0px;}

/*////////////////////////////////////////////////////////////////////////////////////////
 소식 : 
 ////////////////////////////////////////////////////////////////////////////////////////*/
 .news_detail {min-height:100%; min-height:100vh; position:relative;}

 .detail_header {height:50px; line-height:50px; text-align:center; position:relative;}
 .detail_header a {font-size:18px; position:absolute; top:0; left:20px;}
 .detail_header h3 {font-size:20px;}

 .detail_body {padding:20px 0;}
 .detail_body .subject_header {margin:0 20px; border-bottom:solid 1px #ddd;}
 .detail_body .subject_header .cata {padding:5px 10px; font-size:10px; color:#fff; background-color:var(--primary-color);}
 .detail_body .subject_header h4 {padding:10px 0; line-height:1.2;}

 .detail_body .text_cont {margin:0 20px; padding:15px 0 100px; color:#666;}

 .datail_footer {width:100%; height:40px; line-height:40px; color:#fff; text-align:center; background-color:var(--primary-color); position:absolute; bottom:0;}
 .datail_footer .outline {position:relative;}
 .datail_footer a {font-size:18px; position:absolute; top:0; left:20px;}
 .datail_footer span {font-size:16px;}


 /* 첨부이미지 스와이프 UI */
.news_img_box {}
.news_img_list {display:flex !important; align-items: center !important;}
.news_img_box .outline {}

.news_img_box .slick-prev, .news_img_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:20% !important;
      /*background:url('../images/common/icon_mainvisualslide_prev.png') no-repeat center center;*/
  }
 
  .news_img_box .slick-prev:before {content: '';}
  [dir='rtl'] .news_img_box .slick-prev:before {content: '';}
  
  .news_img_box .slick-next:before {content: '';}
  [dir='rtl'] .news_img_box .slick-next:before {content: '';}
  
  .news_img_box .slick-prev {
      left:0;
      background:url('../images/icon_arrow_prev.png') no-repeat center center; opacity: 1; z-index:10;
  }
  .news_img_box .slick-prev:hover, .news_img_box .slick-prev:focus {
      background:url('../images/icon_arrow_prev.png') no-repeat center center; opacity: 1;
  }
  .news_img_box .slick-next {
      right:0;
      background:url('../images/icon_arrow_next.png') no-repeat center center; opacity: 1;
  }
  .news_img_box .slick-next:hover, .news_img_box .slick-next:focus {
      background:url('../images/icon_arrow_next.png') no-repeat center center; opacity: 1;
  } 
    
  .news_img_box .slick-dots {bottom:0;}
  .news_img_box .slick-dots li button:before {opacity:1; font-size:0; width:5px; height:5px; border-radius:10px; border:solid 1px var(--primary-color);}
  .news_img_box .slick-dots li.slick-active button:before {opacity:1; transform:scale(1.5); background:var(--primary-color); border:solid 1px var(--primary-color);}
  

  /*////////////////////////////////////////////////////////////////////////////////////////
  응원톡 - 메시지창
 ////////////////////////////////////////////////////////////////////////////////////////*/
.cheektalk_bg {width:100%; height:100%; min-height:100vh;}
.cheertalk_header {display:flex; padding:10px; justify-content:space-between; align-items:center; width:100%; box-sizing:border-box; border-bottom:solid 1px #ddd; background-color:#fff; position:fixed; top:0; left:0; z-index:2;}
.cheertalk_header .thum {flex-shrink:0; width:70px; text-align:center;}
.cheertalk_header .thum span {display:inline-block; width:55px; height:70px; border-radius:7px; border:solid 1px #ccc; background:no-repeat center; background-size:cover;}
.cheertalk_header .info {flex-shrink:1; width:calc(100% - 120px); line-height:1.3; padding-left:10px; box-sizing:border-box;}
.cheertalk_header .info .player {display:flex; gap:5px;}
.cheertalk_header .info .player h3 {font-size:20px;}
.cheertalk_header .info .player .icon_like {position:relative;}
.cheertalk_header .info .player .icon_like .sign {display:inline-block; width:20px; height:16px; line-height:16px; text-align:center; color:#fff; font-size:10px; border-radius:5px; background-color:#a6a6a6; position:relative; z-index:0;}
.cheertalk_header .info .player .icon_like .sign::after {display:block; content:''; width:7px; height:7px; border-radius:1px; background-color:#a6a6a6; transform:rotate(45deg); position:absolute; bottom:-3px; left:calc(50% - 4px); z-index:0;}
.cheertalk_header .info .player .icon_like .sign i {position:relative; z-index:1;}
.cheertalk_header .info .player .icon_like .count {font-size:7px; color:#a6a6a6; position:relative; left:-2px;}

.cheertalk_header .info .player .icon_like.like .sign {background-color:#ff69b4 !important;}
.cheertalk_header .info .player .icon_like.like .sign::after {background-color:#ff69b4 !important;}
.cheertalk_header .info .player .icon_like.like .count {color:#ff69b4 !important;}

.cheertalk_header .info .team {font-size:16px; color:#666;}
.cheertalk_header .info .msg {font-size:12px; color:#999; line-height:1;}
.cheertalk_header .func {flex-shrink:0; display:flex; gap:10px; align-items:center;}
.cheertalk_header .func a.btn_back {display:flex; justify-content:center; align-items: center; width:40px !important; height:40px !important; box-sizing:border-box !important; padding:0 !important; font-size:20px; color:#666; border:solid 1px #666; border-radius:10px;}
.cheertalk_header .func a.btn_sidemenu {display:flex; justify-content:center; align-items: center; width:40px !important; height:40px !important; box-sizing:border-box !important; padding:0 !important; font-size:20px; color:#666; border:solid 1px #666; border-radius:10px;}

.cheertalk_view_box {padding:110px 10px 60px; overflow-y:auto;}

/* 날짜 분기선 */
.date_gap {margin:30px 0; text-align:center; position:relative;}
.date_gap::after {display:block; content:''; width:100%; height:3px; background-color:var(--sub-color-red); position:absolute; top:calc(50% - 2px); left:0; z-index:0;}
.date_gap strong {padding:0 10px; color:var(--sub-color-red); background:#fff;; position:relative; z-index:1;}

/* 개별 대화상자 */
.usermsg_row {margin:5px 0; padding-left:60px; display:inline-block;}
.usermsg_row .thum {float:left; width:60px; margin-left:-60px; text-align:center;}
.usermsg_row .thum span {display:inline-block; width:36px; height:40px; border-radius:5px; border:solid 1px var(--primary-color); background:no-repeat center; background-size:cover;}

.usermsg_row .word_cont {float:right; width:100%; padding-right:50px; box-sizing:border-box; position:relative;}
.usermsg_row .word_cont .userinfo {display:flex; justify-content:space-between; align-items:center; position:relative;}
.usermsg_row .word_cont .userinfo .nickname {}
.usermsg_row .word_cont .userinfo .nickname .mytalk_sign {display:inline-block; padding:0 3px; font-size:8px; color:#fff; background-color:#63b0ea;}
.usermsg_row .word_cont .userinfo .func {position: relative; z-index: 10;}
.usermsg_row .word_cont .userinfo .func a {cursor: pointer; position: relative; z-index: 11; display: inline-block; padding: 5px;}

.usermsg_row .word_cont .talk_msg_cont {}
.usermsg_row .word_cont .talk_msg_cont .talk_box {margin-bottom:20px; display:flex; justify-content:space-between; align-items:center; padding:15px; border-radius:10px; background-color:#ffeeda; box-sizing:border-box; position:relative;}
.usermsg_row .word_cont .talk_msg_cont .talk_box::after {display:block; content:''; width:20px; height:20px; background-color:#000; position:absolute; bottom:-20px; left:10px;
background:url('../images/talk_graph.png') no-repeat top center;}

.usermsg_row .word_cont .talk_msg_cont .talk_box .txt {flex-shrink:1; color:#666; line-height:1.2;}
.usermsg_row .word_cont .talk_msg_cont .talk_box.delete_msg .txt {color:#f7a74a;}
.usermsg_row .word_cont .talk_msg_cont .talk_box.my_msg {background-color: #f7a74a;}
.usermsg_row .word_cont .talk_msg_cont .talk_box.my_msg .txt {color:#fff;}
.usermsg_row .word_cont .talk_msg_cont .talk_box.my_msg .func a.like {color:#fff;}
.usermsg_row .word_cont .talk_msg_cont .talk_box.my_msg::after {background:url('../images/talk_graph_mytalk.png') no-repeat top center;}

.usermsg_row .word_cont .talk_msg_cont .talk_box.my_msg.delete_msg {background-color: #f7a74a;}
.usermsg_row .word_cont .talk_msg_cont .talk_box.my_msg.delete_msg .txt {color:#fff;}


.usermsg_row .word_cont .talk_msg_cont .talk_box .func {flex-shrink:0; width:20px; text-align:right;}
.usermsg_row .word_cont .talk_msg_cont .talk_box .func a {color:#a6a6a6;}
.usermsg_row .word_cont .talk_msg_cont .talk_box .func a.like {color:var(--sub-color-pink);}
.usermsg_row .word_cont .time {font-size:10px; color:#999; position:absolute; bottom:0; right:0;}


a.btn_refresh {display:inline-block; width:36px; height:36px; font-size:24px; color:var(--primary-color); position:fixed; bottom:60px; right:15px; z-index:100;}

.cheertalk_write {display:flex; justify-content:space-between; align-items:center; width:100%; box-sizing:border-box; border:solid 1px #999; border-bottom:none; border-radius:15px 15px 0 0; background-color:#fff; position:fixed; bottom:0; left:0;}
.cheertalk_write .func {flex-shrink:0; width:50px;}
.cheertalk_write .func a.btn_addfile {display:flex; margin:0 auto; justify-content:center; align-items: center; width:40px; height:40px; font-size:20px; color:#999;  border-radius:100%;}
.cheertalk_write .input {flex-shrink:1; width:calc(100% - 100px); }
.cheertalk_write .input input {width:100%; height:50px; border:none;}
.cheertalk_write .sendbox {flex-shrink:0; width:50px;}
.cheertalk_write .sendbox a.btn_send {display:flex; margin:0 auto; justify-content:center; align-items: center; width:36px; height:36px; font-size:16px; color:#fff;  border-radius:100%; background-color:var(--primary-color);}

/* 대화창 옵션메뉴: 수정, 삭제, 신고 */
.modal_talk_option {background-color:#fff; border-radius:10px; overflow:hidden; position:absolute; top:23px; right:0; box-shadow: 0 2px 10px 0 rgb(0 0 0 / 30%); z-index:1;}
.modal_talk_option .modal_talk_option_body {padding:10px;}
ul.option_menu {display:flex; flex-wrap:wrap;}
ul.option_menu li a {display:block; padding:5px 7px; color:#666;}

/* COMING SOON 메시지 */
.comming_soon {padding:50px 0 100px; text-align:center;}
.comming_soon_img {margin:0 auto 15px; width:150px; height:150px; border-radius:100%; overflow:hidden; box-shadow: 0 3px 10px 5px #ddd;}
.comming_soon .ment {color:#999;}

/* 로그인 모달창 */
.login-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 9999;
    display: flex;
    justify-content: center;
    align-items: center;
}

.login-modal {
    background: white;
    border-radius: 15px;
    max-width: 400px;
    width: 90%;
    margin: 20px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

.login-modal-content {
    padding: 30px 25px;
    text-align: center;
}

.login-modal-content h3 {
    font-size: 20px;
    font-weight: bold;
    color: #333;
    margin-bottom: 15px;
}

.login-modal-content p {
    font-size: 16px;
    color: #666;
    line-height: 1.5;
    margin-bottom: 25px;
}

.login-modal-buttons {
    display: flex;
    gap: 10px;
}

.login-modal-buttons button {
    flex: 1;
    padding: 12px 20px;
    border-radius: 8px;
    font-size: 16px;
    font-weight: bold;
    border: none;
    cursor: pointer;
    transition: all 0.3s;
}

.login-modal-buttons .btn-login {
    background: #ff4444;
    color: white;
}

.login-modal-buttons .btn-login:hover {
    background: #e63939;
}

.login-modal-buttons .btn-cancel {
    background: #f5f5f5;
    color: #666;
    border: 1px solid #ddd;
}

.login-modal-buttons .btn-cancel:hover {
    background: #e8e8e8;
}

/*////////////////////////////////////////////////////////////////////////////////////////
 하단 고정 메뉴
 ////////////////////////////////////////////////////////////////////////////////////////*/
/* 데스크톱용 fix_menu */
@media all and (min-width:641px) {
    .fix_menu {
        left: -15px !important;
    }
}

/* 모바일용 fix_menu */
@media all and (max-width:640px) {
    .fix_menu {
        left: 0 !important;
    }
}

.fix_menu {width:100%; background-color:#fff; position:fixed; bottom:0; box-shadow: 0 -3px 7px 0 rgba(0,0,0,0.1); z-index:1000;}

.fix_menu ul {display:table; padding:7px 0; width:100%;}

/* 모바일에서 하단 내비게이션 바 하단 여백 추가 */
@media (max-width: 768px) {
    .fix_menu {
        padding-bottom: 15px;
    }
}
.fix_menu ul li {display:table-cell; width:25%; text-align:center;}
.fix_menu ul li a {display:flex; justify-content:center; align-items:center; flex-direction:column; text-decoration:none;}
.fix_menu ul li a img {transform:scale(0.6);}
.fix_menu ul li a span.icon {display:inline-block; width:40px; height:40px;}
.fix_menu ul li a span.menu_name {display:block; line-height:1; font-size:10px; color:#999; margin-top:3px;}

.fix_menu ul li.home a span.icon {background: url('/images/menu_icon_1.png') no-repeat center; background-size:38px;}
.fix_menu ul li.home.active a span.icon,
.fix_menu ul li.home:hover a span.icon {background-image: url('/images/menu_icon_1_active.png');}
.fix_menu ul li.home.active a span.menu_name,
.fix_menu ul li.home:hover a span.menu_name {color:#f8a93d;}

.fix_menu ul li.charge a span.icon {background: url('/images/menu_icon_2.png') no-repeat center; background-size:38px;}
.fix_menu ul li.charge.active a span.icon,
.fix_menu ul li.charge:hover a span.icon {background-image: url('/images/menu_icon_2_active.png');}
.fix_menu ul li.charge.active a span.menu_name,
.fix_menu ul li.charge:hover a span.menu_name {color:#f8a93d;}

.fix_menu ul li.votebox a span.icon {background: url('/images/menu_icon_3.png') no-repeat center; background-size:38px;}
.fix_menu ul li.votebox.active a span.icon,
.fix_menu ul li.votebox:hover a span.icon {background-image: url('/images/menu_icon_3_active.png');}
.fix_menu ul li.votebox.active a span.menu_name,
.fix_menu ul li.votebox:hover a span.menu_name {color:#f8a93d;}

.fix_menu ul li.setting a span.icon {background: url('/images/menu_icon_4.png') no-repeat center; background-size:38px;}
.fix_menu ul li.setting.active a span.icon,
.fix_menu ul li.setting:hover a span.icon {background-image: url('/images/menu_icon_4_active.png');}
.fix_menu ul li.setting.active a span.menu_name,
.fix_menu ul li.setting:hover a span.menu_name {color:#f8a93d;}

}

/* 하단 메뉴가 있을 때 콘텐츠 영역 패딩 추가 */
@media all and (max-width:640px){
    body {padding-bottom:0px;}
    #wrapper {padding-bottom:0px;}
}


/* 무료 충전 박스 - pg_title과 광고 보기 버튼을 하나의 박스로 */
#div_ad .pg_title {
    border-radius: 4.5px 4.5px 0 0;
    box-shadow: none;
    margin-bottom: 0;
}

#div_ad .pg_content {
    padding-bottom: 0;
}

#div_ad .charge_list ul li#li_ad {
    margin-top: 0;
    margin-bottom: 15px;
    border-radius: 0 0 10px 10px;
    box-shadow: 0px 0px 4px 0px rgba(183, 183, 183, 0.75);
}

#div_ad .charge_list ul li#li_ad + li {
    margin-top: 15px;
}

/* Footer 반응형 - 340px ~ 640px 줄바꿈 방지 */
@media all and (max-width:640px) and (min-width:540px){
    #footer {font-size:11px; line-height:1.5; padding:25px 10px 150px;}
}
@media all and (max-width:539px) and (min-width:440px){
    #footer {font-size:10px; line-height:1.4; padding:20px 10px 150px;}
}
@media all and (max-width:439px) and (min-width:340px){
    #footer {font-size:9px; line-height:1.3; padding:15px 8px 150px;}
}
@media all and (max-width:339px){
    #footer {font-size:8px; line-height:1.2; padding:15px 5px 150px;}
}

/* 모든 화면 크기에서 하단 내비바 표시 보장 */
@media all and (max-width:640px){
    .fix_menu {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
}

@media all and (max-width:340px){
    .fix_menu {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    .fix_menu ul li a span.menu_name {
        font-size: 9px;
    }
    .fix_menu ul li a span.icon {
        width: 35px;
        height: 35px;
    }
}


/* 팝업 위치 강제 조정 */
.modal,
.modal_vote,
.modal_overlay .modal_container,
.ticket_modal,
.modal_msg {
    left: calc(50% - 16px) !important;
}



}


/* 모바일 중앙 정렬 (강제) */
@media all and (max-width:640px) {
    .fix_menu {
        left: 0 !important;
        right: 0 !important;
        margin: 0 auto !important;
    }
    
    .modal,
    .modal_vote,
    .modal_overlay .modal_container,
    .ticket_modal,
    .modal_msg {
        left: 50% !important;
        right: auto !important;
    }
}


/* general_modal 크기를 다른 모달과 동일하게 설정 */
.vot_modal {
    width: 350px !important;
}
