@charset "utf-8";

/* 2022.03.08 정지훈 main css 전체 수정 */

/* wrap */
.wrap{width:100%; max-width:768px; margin:0 auto;}

/* main_visual */
.main_visual_slide{position:relative; width:100%; padding-top:56.25%; background-color:#eee;}
.main_visual_slide img{position:absolute; left:0; top:0; width:100%; height:100%; object-fit:contain; object-position:center;}
.main_visual .swiper-pagination-bullet-active{background-color:var(--sub_color);}

/* marquee */
.marquee{position:relative; bottom:20px; width:calc(100% - 40px); height:40px; margin:0 auto; background-color:#fff; border-radius:20px; box-shadow:1px 1px 2px rgba(226, 226, 226,0.3); z-index:1; overflow:hidden;}
.marquee_inner, .marquee_inner_clone{position:absolute; left:100%; display:flex; align-items:center; width:100%; height:100%;}
.marquee a{flex:none; font-size:1.6rem; font-family:var(--font_B); color:var(--black);}

/* member */
.member{width:100%; padding:0 20px 20px; background-color:var(--white);}
.member_list{width:100%; padding:16px; border-radius:6px; background-color:var(--sub_color);}
.member_id{font-size:1.6rem; font-family:var(--font_M); color:var(--white);}
.member_cash{font-size:2.2rem; font-family:var(--font_B); color:var(--white); padding-bottom:16px; border-bottom:1px solid rgba(242, 242, 242,0.3); word-break:break-all;}
.copy_btn{width:112px; height:40px; margin-top:10px; border-radius:4px; background-color:var(--main_color); font-size:1.6rem; font-family:var(--font_B); color:var(--white);}

/* section_title */
.section_title{width:100%; height:30px;}
.section_title a{display:flex; justify-content:space-between; align-items:center; font-size:2.2rem; font-family:var(--font_B); color:var(--black);}
.section_title a:after{content:""; display:block; width:17px; height:17px; background-image:url("../img/svg/icon_forward.svg"); cursor:pointer;}

/* wallet */
.wallet{width:100%; padding:20px 20px 30px; background-color:var(--white);}

/* btn_list */
.btn_list{position:absolute; right:0; top:50%; transform:translateY(-50%); display:flex; width:fit-content;}
.btn_item{width:70px; height:60px; margin-left:10px; border-radius:10px; background-color:var(--main_color); font-size:1.2rem; font-family:var(--font_B); color:var(--white); text-align:center; cursor:pointer;}
.btn_item a{display:flex; justify-content:center; align-items:center; width:100%; height:100%; color:var(--white);}

/* coin_list */
.coin_list{width:100%; margin-top:20px; overflow:hidden;}
.coin_item{position:relative; display:flex; justify-content:flex-end; align-items:center; width:100%; margin-top:14px; box-shadow:1px 1px 2px rgba(226,226,226,0.3); border-radius:6px;}
.coin_item:first-of-type{margin-top:0;}
.item_info{position:relative; display:flex; justify-content:space-between; align-items:center; width:100%; height:100%; padding:10px 16px; border:1px solid var(--border_sub); border-radius:6px; background-color:var(--white); transition:left .3s; cursor:pointer;}
.coin_img{display:flex; justify-content:center; align-items:center; flex:none; width:46px; height:46px;  margin-right:10px;}
.coin_img img{width:100%; height:100%; object-fit:contain; object-position:center; border: 1px solid var(--border_sub); border-radius: 50%;}
.coin_text{display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; width:100%; height:100%; word-break:break-all;}
.coin_name{font-size:1.6rem; font-family:var(--font_B); color:var(--black);}
.coin_amount{text-align:right;}
.coin_unit{font-size:1.6rem; font-family:var(--font_M); color:var(--black);}
.coin_cash{font-size:1.4rem; font-family:var(--font_R); color:var(--gray);}
@media all and (min-width:320px) and (max-width:480px){
  .coin_text{flex-direction:column; justify-content:flex-start; align-items:flex-start;}
  .coin_amount{text-align:left;}
}

@media all  and (max-width:550px){
  .coin_name{width:100%;}
  .coin_cash{text-align:left;}
}


/* news */
.news{width:100%; padding:20px 20px 10px; background-color:var(--white);}
.news_list{width:100%;}
.news_item{width:100%; padding:20px 0; border-bottom:1px solid var(--light_gray);}
.news_item a{display:flex; justify-content:space-between; align-items:flex-start;}
.news_item:last-of-type{border-bottom:none;}
.news_text{display:flex; flex-direction:column; justify-content:space-between; width:100%; height:100%; min-height:94px; margin-right:50px;}
.news_title{width:100%; font-size:1.6rem; font-family:var(--font_B); color:var(--black);}
.news_subtitle{min-height:11px; line-height:16px; margin-top:10px; font-size:1.4rem; font-family:var(--font_M); color:var(--dark_gray); overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;}
.news_date{margin-top:10px; font-size:1.4rem; font-family:var(--font_R); color:var(--gray);}
.news_img{display:flex; flex:none; justify-content:center; align-items:center; flex:none; width:94px; height:94px; border-radius:6px; overflow:hidden;}
.news_img img{width:100%; height:100%; object-fit:cover;}

/* notice */
.notice{width:100%; padding:20px 20px 10px; background-color:var(--white);}
.notice_list{width:100%;}
.notice_item{width:100%; border-bottom:1px solid var(--light_gray); font-size:1.6rem; font-family:var(--font_B); color:var(--black); cursor:pointer;}
.notice_item a{padding:20px 0; display:flex; justify-content:space-between; align-items:center;}
.notice_item:last-of-type{border-bottom:none;}
.notice_item:first-of-type{border-bottom:1px solid var(--light_gray);}
.notice_date{margin-left:50px; font-size:1.4rem; font-family:var(--font_R); color:var(--gray);}

/* shopping */
.shopping{width:100%; padding:20px 20px 10px; background-color:var(--white);}
.shopping_swiper .shopping_item{width:100%;}
.shopping_item a{display:flex; flex-direction:column;}
.shopping_img{display:block; position:relative; width:100%; height:0px; padding-top:100%; border-radius:6px; background-color:#eee; overflow:hidden;}
.shopping_img img{position:absolute; left:0; top:0; width:100%; height:100%; object-fit:contain; object-position:center;}
.shopping_title{margin-top:10px; font-size:1.6rem; font-family:var(--font_B); color:var(--black);}
.shopping_price{margin-top:20px; font-size:1.8rem; font-family:var(--font_B);}

.shopping .swiper-pagination-bullet{background-color:#eee;}
.shopping .swiper-pagination-bullet-active{background-color:var(--sub_color);}
.shopping .swiper-pagination-bullets{position:static; margin:20px 0;}
/* popup */
.popup_bg{position:fixed; left:50%; top:0; transform:translateX(-50%); display:flex; justify-content:center; align-items:center; width:100%; max-width:768px; height:100%; backdrop-filter:blur(5px) brightness(0.7); text-align:center; z-index:9999;}
.popup_box{display:flex; flex-direction:column; justify-content:center; align-items:center; width:334px; padding:20px; border-radius:6px; background-color:var(--white);}
.popup_title{margin-bottom:20px; font-size:2.2rem; font-family:var(--font_B); color:var(--black);}
.popup_desc{max-height:338px; overflow:auto; margin-bottom:30px; font-size:1.4rem; font-family:var(--font_M); text-align:left; overscroll-behavior:none; }
.popup_desc img{width:100%; margin:10px 0;}
.popup_btn{display:flex; width:100%;}
.popup_btn button{margin-right:10px;}
/* // popup */

/* // 2022.03.08 정지훈 main css 전체 수정 */
.no_data h3 {font-size:1.8rem; text-align: center; padding:30px 0; font-family: var(--font_M);}
