body { background-color:var(--line); }

/* 상단 배너 */
.main_section { padding:20px 20px 0; border-radius: 10px;  }
.num_tq_box { border-radius: 10px; overflow: hidden;}

/* 공지사항 슬라이드 */
.marquee_box {margin:6px auto 8px; padding: 0; width: calc(100% - 40px); height: 36px; color: #fff; background-color: #000; border-radius: 8px;
  position: relative; cursor:pointer;}
.marguee_noticeb {position: absolute; left:10px; top:50%; transform: translateY(-50%); padding:4px 12px; border-radius: 10px; background-image: -webkit-linear-gradient(top,#FF8300,#FD3A1D); font-size:12px; font-weight: 700; z-index:88;}
.marquee_inner {margin:0 20px; padding: 0 20px; height: 36px; background-color: #000; color: #fff; overflow: hidden; }
ul.marquee { display: flex; justify-content: flex-start; align-items: center; margin: 0; padding: 0; }
ul.marquee > li {margin: 0 10px; padding: 0; }
ul.marquee > li > a {line-height: 40px; color: #fff; white-space: nowrap; font-size:15px; }

@keyframes marquee { /*marquee index = 9 ; 23.04.12 NJH*/
  0% { transform: translate(100%, 0); }
  100% { transform: translate(-100%, 0); }
}

/* ------------------------------------------------------------------------------------------------------------------------------------------ */


.banner_swiperwrapp {padding-bottom:30px;}
.card_name {margin:20px 20px 8px 20px; }
.card_name img { width:30px; height:30px; }
.card_name p { font-size:20px; font-weight: 700; color:var(--white); height:30px; width:100%; display: flex; align-items: center;}
.esc_list_box { position: relative; padding:10px 20px; height:60px;  }
.esc_bg { position: absolute; left: 0; top: 0; width:100%; height:100%; background: rgba(17,98,248,0.3); mix-blend-mode: multiply; z-index: 20;}
.esc_list_box > div:last-child > div { z-index: 30; }

/* //상단 배너 */




/*중간 바로가기 영역 아이콘*/
.menu_container { position:relative; width: calc(100% - 40px); padding:16px 10px; margin:0 auto; background: white; border-radius: 8px; overflow: hidden; border:1px solid #ededed; }
.store_wrap {   height: auto; }
.store_wrap > div { width: 100%;font-size: 18px; font-weight: 700; }
.store_wrap .swiper-pagination { bottom: 10px; }

.planet_iconbox {display: grid; grid-template-columns: repeat(4,1fr); grid-row-gap:10px; grid-column-gap: 10px; justify-content: center;  }
.planet_iconbox > li > a > p { font-size:15px; font-weight: 500; margin-top:4px; word-break: break-all; text-align: center; height:34px; width:66px; word-break: break-all; margin:4px auto 0;}
.planet_iconbox > li > a {  display:block; }
.user_menu_icon { width: 60px; height: 60px; outline: 1px solid var(--line); border-radius:13px; margin:0 auto; overflow: hidden;}
.user_menu_icon img { width:100%; height:100%; object-fit: contain;}
.store_wrap > div > img { transition: all 500ms; }
.store_wrap > div.active > img { transform:rotate(-180deg); }
.store_wrap .scroll_box { overflow-y:auto; height: 200px; margin:15px 0 }
.store_wrap .scroll_box li { position:relative; width:100%; height:45px; line-height:45px; font-size: 14px; }
.store_wrap .scroll_box li:first-child { font-size: 14px; font-weight:700; }
.store_wrap .scroll_box li a { position:absolute; top:0; left:0; width:100%; padding:0 20px;}
.store_wrap .scroll_box li:hover { background-color: var(--line);}

/* 배너 이미지 슬라이드*/
.img_slider {width:calc(100% - 40px); margin:0 auto; border-radius: 10px; padding:10px 0 16px; overflow: hidden; }
.img_slider .swiper-pagination-fraction { height:100%; left:unset; position: static; width:max-content; margin-right:6px; font-weight: 700; display: flex;}
.img_slider .swiper-pagination-fraction span:nth-child(1) {margin-right:4px;}
.img_slider .swiper-pagination-fraction span:nth-child(2) {margin-left:4px;}
.img_slider .banner_img { border-radius: 10px;}
.img_slider .swiper-pagination { bottom: 0px !important; }
.banner_img img {width:100%; object-fit: contain; border-radius: 10px;}
.level01_cardbg { display: flex; flex-direction: column; justify-content: center; height:100%;}

/*230411 배너 수정작업 신정운 */
.level00bg, .level01bg, .level02bg, .level03bg, .level04bg, .level05bg, .levelbonusbg, .levelbonus01bg, .levelbonus02bg,
.levelbonus03bg, .levelbonus04bg, .levelbonus05bg, .leveltarabg, .levelrecommderbg, .levelsponsorbg  {
  margin:14px auto 16px; width:calc(100% - 40px) ; height:150px;}

/* 카드 하단 user 정보 및 비로그인시 로그인 메세지 보여주는 공간 */
.level01_cardsbg { position: relative; height:36px;}
.level01_cardsbg::before { position: absolute; background: rgba(0,0,0,0.3); display: block; content: ""; width:100%; height:100%; mix-blend-mode: soft-light;}
/* //카드 하단 user 정보 및 비로그인시 로그인 메세지 보여주는 공간 */
.level01_cardsbg_txt {position: absolute; left:0; top:50%; transform:translateY(-50%);  width:100%; height:100%; padding-left:20px;  }
/* //카드 하단 Text 가운데 정렬 */

.level00gr, .level01gr, .level02gr, .level03gr, .level04gr, .level05gr, .levelbounusgr, .levelbounus01gr,
.levelbounus02gr, .levelbounus03gr, .levelbounus04gr, .levelbounus05gr, .leveltaragr, .levelrusdtgr, .levelrecommdergr, .levelsponsorgr {
 width:100%; height:100%; border-radius:10px; overflow:hidden;}


/* 0레벨 cardbg */
.level00gr {background: url("../img/card/img_card_level_00.jpg");  background-position:center; background-size:cover; background-repeat:no-repeat; }
/* 1레벨 cardbg */
.level01gr {background: url("../img/card/img_card_level_01.jpg");  background-position:center; background-size:cover; background-repeat:no-repeat; }
/* 2레벨 cardbg */
.level02gr {background: url("../img/card/img_card_level_02.jpg");  background-position:center; background-size:cover; background-repeat:no-repeat; }
/* 3레벨 cardbg */
.level03gr {background: url("../img/card/img_card_level_03.jpg");  background-position:center; background-size:cover; background-repeat:no-repeat; }
/* 4레벨 cardbg */
.level04gr {background: url("../img/card/img_card_level_04.jpg");  background-position:center; background-size:cover; background-repeat:no-repeat; }
/* 5레벨 cardbg */
.level05gr {background: url("../img/card/img_card_level_05.jpg");  background-position:center; background-size:cover; background-repeat:no-repeat; }
/* Revenue cardbg */
.levelbounusgr {background: url("../img/card/img_card_revenue.jpg");  background-position:center; background-size:cover; background-repeat:no-repeat; }
/* 보너스1 cardbg */
.levelbounus01gr {background: url("../img/card/img_card_bonus_01.jpg");  background-position:center; background-size:cover; background-repeat:no-repeat; }
/* 보너스2 cardbg */
.levelbounus02gr {background: url("../img/card/img_card_bonus_02.jpg");  background-position:center; background-size:cover; background-repeat:no-repeat; }
/* 보너스3 cardbg */
.levelbounus03gr {background: url("../img/card/img_card_bonus_03.jpg");  background-position:center; background-size:cover; background-repeat:no-repeat; }
/* 보너스4 cardbg */
.levelbounus04gr {background: url("../img/card/img_card_bonus_04.jpg");  background-position:center; background-size:cover; background-repeat:no-repeat; }
/* 보너스5 cardbg */
.levelbounus05gr {background: url("../img/card/img_card_bonus_05.jpg");  background-position:center; background-size:cover; background-repeat:no-repeat; }
/* 타라 cardbg */
.leveltaragr {background: url("../img/card/img_card_tara.jpg");  background-position:center; background-size:cover; background-repeat:no-repeat; }
/* rusdt cardbg */
.levelrusdtgr { background: url("../img/card/img_card_rusdt.jpg");  background-position:center; background-size:cover; background-repeat:no-repeat; }
/* 추천인 cardbg */
.levelrecommdergr {background: url("../img/card/img_card_sponsor.jpg");  background-position:center; background-size:cover; background-repeat:no-repeat;  }
/* 후원인 cardbg */
.levelsponsorgr {background: url("../img/card/img_card_sponsor.jpg");  background-position:center; background-size:cover; background-repeat:no-repeat; }

/* //배너 이미지 슬라이드 */
.banner_swiper .swiper-pagination-bullet { background: #BEC8CF; opacity: 1; }
.banner_swiper .swiper-pagination-bullets {bottom:0;}
/* .banner_swiper {padding-bottom:6px;} */


/* 코인(wallet) 카드 */
.change_w {font-size:18px; font-weight: 600; }
/* //코인(wallet) */


/*스와이퍼 CSS */
.swiper-pagination-bullet-active { background: var(--main) !important;}
.swiper-pagination-bullet { width: 6px !important; height: 6px !important; }
/* //스와이퍼 CSS */

/* 팝업 */
.mainpopup_bg, .taraapp_bg { display: none; position: fixed; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.8); z-index: 9999;}
.mainpopup_bg {z-index:10000;}
.mainpopup_box, .taraapp_box { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: calc(100% - 40px); max-width:400px; border-radius: 6px; background-color: var(--white);}
.mainppopup_title { font-size: 22px; font-weight: 700; text-align: center; border-bottom:1px solid #ededed; word-break: break-all; padding:12px;}
.popup_button_box { padding:0 20px 20px;}
.popup_button_box button { width:49%; height:42px; padding:0 20px; }
.mainppopup_content {font-size: 16px; font-weight: 400; max-height: 300px; overflow-y: auto; margin-bottom: 20px; overscroll-behavior: none; word-break: break-all;  border-bottom:2px solid #ededed;}
/* //팝업 */

.coin_linkbox { display:flex; justify-content: space-between; align-items: center; width:100%; background: #E9531C; border-top:1px solid rgba(255,255,255,0.3); height:36px;}
.coin_linkbox.rusdt { background: #DB3831; }
.coin_linkbox p {width:100%; height:100%; text-align: center; border-right:1px solid rgba(255,255,255,0.3); display: flex; justify-content: center; align-items: center; font-size:14px; cursor:pointer;  padding:10px 0;}
.coin_linkbox p:last-child {border-right:none; }
.tara_cardtxt {display: inline-block; margin-left:10px;}
.num_tq { margin:0 20px 8px; font-weight: 600; word-break: break-all; display:flex; justify-content: space-between; align-items: center; height:48px;}
.num_tq_bonus .change_w {font-size:18px;}


/*230414 추천인카드 신규 작업*/
.recom_txt {color:#BA00FF;}
.sponsor_tree { text-align: center;position: relative; color:#000; width:100%;}
.spon_height {height:10px;}
.sponsor_tree ul { position: relative; display: flex; justify-content: space-between; width:100%;}
.sponsor_tree li { text-align: center; position: relative; padding: 10px 0 0; width:100%; border-radius: 5px;}

.left_txt{ background:#BA00FF; width:40px; margin:0 auto; padding:4px 0; font-size:14px; border-radius: 5px; font-weight: 700;}
.right_txt { background:#BA00FF; width:52px; margin:0 auto; padding:4px 0; font-size:14px; border-radius: 5px; font-weight: 700;}
.sponsor_tree li:first-child::before, .sponsor_tree li:last-child::after {border: none;}
.sponsor_tree li::before, .sponsor_tree li::after { content: ''; position: absolute; top: 0; right: 50%; border-top: 1px solid #BA00FF; width: 50%;
height: 13px;}
.sponsor_tree li::after { right: auto; left: 50%; border-left: 1px solid #BA00FF;}
.left_datelist { font-size:16px; font-weight: 600; }
.sponsor_tree li:last-child::before { border-right: 1px solid #BA00FF;}
.ko .spon_height {height:26px;}
.total_box_recom { margin-bottom:0; margin-top:12px;}

/* -------------------------------------------------------------------------------------------------------------------------------------------------- */
/*미디어 쿼리 */

@media screen and (min-width:768px){
  .menu_container { padding:20px 0; }
  .marquee_box { margin:8px auto 16px;}
  .img_slider {padding:14px 0 22px}
  .planet_iconbox {grid-row-gap:12px;}
  .planet_iconbox > li > a > p {height:42px;}
}


@media screen and (max-width:767px){
  .planet_iconbox > li > a > p { font-size:12px;}
  .menu_container {padding:16px 10px;}
}

@media screen and (max-width:450px){
  .planet_iconbox > li > a { padding: 0; display:block; }
  .user_menu_icon img { width:100%; height:100%; object-fit: cover;}
}

@media screen and (max-width:375px) {
  .coin_linkbox p {font-size:12px;}
  .planet_iconbox {grid-row-gap:6px;}
  .popup_button_box button { padding:0 10px;}
  }
