.mainwrap { background-color: var(--bg); width: 100%; max-width: 768px; margin:0 auto; padding:70px 0; height: auto;
  min-height: 100%; }
.main_visual { text-align: center; margin:20px 20px 0 !important;  }
.main_visual img { width:100%; }
.main_visual_slide {box-shadow: 0 1px 4px rgb(21 34 50 / 8%); border-radius: 8px;}
/*  */

.main_visual .swiper-wrapper { padding-bottom:30px; }
.mylist .swiper-wrapper { padding-bottom:16px; }
.lvboximg img { max-width:100%; border-bottom: 4px dotted #dbe6e6;}
.lvboxp {  width:100%; border-radius: 8px; overflow: hidden; margin:0 auto;  background: #fff;}
.level_infotxt { background-color: #fff; padding:20px; text-align: left; }
.level_infotxt p:nth-child(1) { font-size:1.6rem; font-weight: 700; color:var(--main_sub); }
.level_infotxt p:nth-child(2) { font-size:2.6rem; font-weight: 700; color:#171725; }
.level_infotxt span { font-family: "montserrat"; font-weight: 600; }
.level_infotxt button { background:linear-gradient(165deg, var(--main) 0%, var(--dark) 100%); border-radius: 8px; margin-top:20px; }
/* .buy_agreereadybox { margin-top:4px; } */

.lv_agreebuy { border:1px solid #c3c3c3; width:max-content; font-size:1.6rem; font-weight: 500; margin:10px auto 0; padding:10px; }
.button_container { cursor: pointer; z-index: 100; transition: opacity 0.25s ease; }
.button_container span { display: block; background: #fff; border: none; height: 2px; width: 24px; transition: all 0.35s ease; cursor: pointer; border-radius: 2px; }
.button_container span:nth-of-type(2), .button_container span:nth-of-type(3) { margin-top: 5px; }
.level_wrap { display: flex; justify-content: space-between; align-items: center; font-size:1.6rem; text-align: center; border: 1px solid #ededed; }
.level_wrap li { width:24%; border-right: 1px solid #ededed; font-weight: 500; }
.level_wrap li:last-child { border-right: none; }
.main_content { margin:20px 0; padding:0 20px;}
.buy_service { font-size:2.0rem; font-weight: 600; color:#01DDAC; font-family: "montserrat"; }
.buy_service span { font-family:noto_sans; font-weight: 700; }
.buy_amount { font-size:1.8rem; display: inline-block; font-weight: 700; }
.main_visual .swiper-pagination-bullets { bottom:0 !important; }
.mylist .swiper-pagination-bullets { bottom:0 !important; }
.main_visual .swiper-pagination-bullet { background:#BEC8CF !important; }

.main_visual .swiper-pagination-bullet-active  { background:var(--main) !important; }
.mylist .swiper-pagination-bullet { background:#BEC8CF !important; }
.mylist .swiper-pagination-bullet-active { background:#01DDAC !important; }


.listbox { background-color: #eef3ff; padding:10px; max-width:164px; height:60px; border-radius: 12px; display: flex; justify-content: center; align-items: center; }
.mylist { text-align: center; box-shadow: 0 1px 4px rgb(21 34 50 / 8%); border-radius: 8px; padding:20px 30px 0 !important; }
.mylist p { font-size:1.6rem; font-weight: 500; text-align: center; padding-top:6px; }



/* .mylist img { width: 34px; height:34px; }
.matching_list { margin-top:20px; padding-bottom:20px; }
.matching_wrap, .matching_tab { display: flex; justify-content: space-between; align-items: center; font-size:1.6rem; font-weight: 500; }
.matching_tab li { background-color: #eef3ff; border-radius: 12px; padding:8px; margin-left:12px; font-size:1.4rem; cursor:pointer; }
.matching_tab .matching_active { background-color: #121330; color:#fff; } */
/* .caln_wrap img { width:60px; }
.caln_wrap { width:100%; background-color: #fff; border-radius: 10px; padding:10px; box-shadow: 0 3px 15px rgb(0 0 0 / 12%); margin-top:12px; }
.view_list { display: flex; align-items: center; }
.caln_wrap ul { margin-left:20px; font-size:1.4rem; font-weight: 500; }
.caln_wrap ul a { display: inline-block; background-color: #121330; color:#fff; padding:8px 14px; border-radius: 10px; margin-top:6px; } */



.popup_wrap { display:none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 10000; background-color: rgba(0,0,0,0.5); }
.pop_bg { position: fixed; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); z-index: 8000; transition: all 300ms ease-in; }
.pop_cont { position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 100%; max-width:700px; max-height: 582px; background-color: #fff; z-index: 9920; }
.pop_title { background: var(--moz_btn); font-weight: 700; text-align: center; padding: 15px 20px; color: #fff; font-size: 2.0rem; font-family: "Noto Sans KR", sans-serif; line-height: normal; }
.popup_txt {  color: #000; word-break: break-all; font-family: "Noto Sans KR", sans-serif; padding: 20px; line-height: normal; font-size: 1.8em; font-weight: 700; max-height:300px; overflow: auto;}
.pop_btn { padding: 20px; display: flex; justify-content: space-between; align-items: center; padding-top: 20px; }
.pop_btn p { border-radius: 5px; display: block; width: 48%; padding: 10px; text-align: center; color: #fff; font-size: 1.6rem; background-color: var(--main); cursor: pointer; font-weight: 700; }
/* .pop_btn p:nth-child(2) { background:#121330; } */

.buy_agreeready { background: #20505E; color:#fff; border-radius: 12px; padding:10px; }
.buy_complet { font-size:2.0rem; font-weight: 700; }
.buy_agreetxt { font-size:1.6rem; font-weight: 500; margin:20px 0 2px; }
.new_buy { font-size:1.5rem; font-weight: 400; padding-top:4px; }
.chase_point { display:flex; align-items: center; background-color:#fff; padding:0 20px;}
/*220916 SJW*/
.chase_point button { min-width:110px; height:30px; background: #0E6F9C;}
.chase_point p { font-size:1.4rem; font-weight: 500; margin-left:26px; }
.chase_point p span { font-size:1.4rem; font-weight: 600; font-family: "montserrat"; }


/*220919 SJW */
/* .ddr_direct {background-color: #fff; box-shadow: 0 1px 4px rgb(21 34 50 / 8%); padding:20px; margin:30px 20px 0; border-radius: 8px;} */
/* .direct_historybox {width:56px; height:56px; border-radius: 50px; background-color: #FBFBFB; border:1px solid #F1F1F1; position: relative; margin:0 auto;}
.direct_historybox img {position: absolute; top:50%; left:50%; transform: translate(-50%, -50%); width:34px;} */
.ddr_direct {display:flex; justify-content: space-around; align-items: center;}
.ddr_direct li {font-size:1.4rem; text-align: center;}
.ddr_direct li:nth-child(1) {margin-left:0;}
.ddr_direct li p {margin-top:8px;}
.matching_list { background-color:#EFF7FF; margin-top:30px; padding:20px;}
.matching_title { font-size:2.0rem; font-weight: 700;}
.matching_box {background-color: #fff; box-shadow: 0 1px 4px rgb(21 34 50 / 8%);  display:flex; align-items: center; padding:20px; border-radius: 8px;}
.matching_box button {background-color: #121330; border-radius: 8px; width:max-content; height:auto;  padding:6px 10px; }
.matching_leveltxt p:nth-child(1) {font-size:1.4rem; font-family: "montserrat"; font-weight: 700;}
.matching_leveltxt p:nth-child(2) { font-size:1.6rem; margin-top:6px;}
.matching_leveltxt span{font-family: "montserrat";}
.level1txt {color:#FCBD2C;}
.level2txt {color:#003FFF;}
.level3txt {color:#01DDAC;}
.level4txt {color:#FC454F;}

.new_agreeinfo {background-color: #fff; padding:20px; margin-top:30px;}
.new_agreeinfo li:last-child {margin-bottom:0;}
.new_agrbox { display:flex; align-items: center; border-radius: 8px;}

/*구매승인 */
.agree_active {border:1px solid #01DDAC;  padding:20px;}
.agree_compltebtn {background-color:#01DDAC; display: flex; align-items: center; height:32px;  color:#fff; padding:6px 10px; border-radius: 8px;}
.agree_compltebtn p {margin-left:2px; font-size:1.4rem; font-weight: 700;}
.new_leveltxt {display: flex; justify-content: space-between; align-items: center; width:100%;}
.new_agrboxwrap {background-color: #fff; box-shadow: 0 1px 4px rgb(21 34 50 / 8%);  padding:20px;}
.new_leveltxt p:nth-child(1) {font-size:1.4rem; font-family: "montserrat"; font-weight: 700;}
.new_leveltxt p:nth-child(2) {font-size:1.6rem;}
.new_img {margin-right:10px;}
.new_img img {width:56px;height:56px;}
.new_userinfo {background-color: #FBFBFB; border-radius: 8px; font-size:1.4rem; padding:20px; margin-top:10px;}
.new_userinfo li {margin-bottom:10px;}
.new_userinfo li:last-child {margin-bottom:0;}
.agree_readybtn {background-color:#5A607F; display: flex; align-items: center; height:32px;  color:#fff; padding:6px 10px; border-radius: 8px;}
.agree_readybtn p {margin-left:2px; font-size:1.4rem; font-weight: 700;}
.new_agrboxwrap {border-radius: 8px;}
.macting_wrap {display:flex; justify-content: space-between; align-items: center; width:100%;}

.main_icon_box { margin:20px; padding:20px; background-color: #fff; display: grid; grid-template-columns: repeat(3, 1fr); column-gap: 10px; box-shadow: 0 1px 4px rgb(21 34 50 / 8%); border-radius: 8px;}
.main_icon_box li { width: 100%; height:120px; display: flex; flex-direction: column; justify-content: center; align-items: center;}
.main_icon_box li div { aspect-ratio: auto 1 / 1; }
.main_icon_box > li > p { font-size: 14px; margin-top: 10px; font-weight: 700; }
.direct_historybox {width:56px; height:56px; border-radius: 50px; background-color: #FBFBFB; border:1px solid #F1F1F1; position: relative; margin:0 auto;}
.direct_historybox img {position: absolute; top:50%; left:50%; transform: translate(-50%, -50%); width:34px;}

/* tq이미지 전용 */
.direct_tqbox {width:56px; height:56px; border-radius: 50px; background-color: #FBFBFB; border:1px solid #F1F1F1; position: relative; margin:0 auto;}
.direct_tqbox img {position: absolute; top:50%; left:50%; transform: translate(-50%, -50%); width:56px;}

/* 23.04.06 메인페이지 리뉴얼 */
.main_my_beans { margin: 20px 20px 0; border-radius: 10px; background: #fff; overflow: hidden;}
.main_my_beans > p:first-child { width:100%; height:100%;  padding:10px 20px; background:linear-gradient(165deg, var(--main) 0%, var(--dark) 100%); color:var(--white);}
.main_my_beans > p:last-child { width:100%; height:100%;  padding:10px 20px; background: var(--white); border:1px solid var(--main); color:var(--ma); border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; }

.main_visual0 { text-align: center; padding:0 20px 0 !important;  }
.main_visual0 img { width:100%; }
.main_visual0 .swiper-wrapper { padding: 20px 0 20px;  }
.main_visual_slide0 { box-shadow: 0 1px 4px rgb(21 34 50 / 8%); border-radius: 8px; }
.level_infotxt_b { padding: 20px ; }

.main_visual_slide0 .level_infotxt p:nth-child(1) { color:var(--main_sub);}

.main_icon_box0 { margin: 0 20px 20px; padding:10px 20px; background-color: #fff; display: grid; grid-template-columns: repeat(3, 1fr); column-gap: 10px; box-shadow: 0 1px 4px rgb(21 34 50 / 8%); border-radius: 8px;}
.main_icon_box0 li { width: 100%; height:110px; display: flex; flex-direction: column; justify-content: center; align-items: center;}
.main_icon_box0 li div { aspect-ratio: auto 1 / 1; }
.main_icon_box0 > li > p { font-size: 14px; margin-top: 10px; font-weight: 700; }

.main_section { padding:20px 20px 0; }
.num_tq_box { background: linear-gradient(to right, #0dccfc, #0c09c7); border-radius: 10px; overflow: hidden;}
.num_tq { padding: 0 20px 15px; font-size:2.4rem; font-family: "montserrat"; font-weight: 600; text-align: center; word-break: break-all;}
.esc_list_box { position: relative; padding:10px 20px; }
.esc_bg { position: absolute; left: 0; top: 0; width:100%; height:100%; background: #ffffff30; z-index: 20;}
.esc_list_box > div:last-child > div { z-index: 30; }
.card_name { padding: 20px 20px 10px;}
.card_name img { width: 25px; height:25px;  }
.card_name p { font-size: 1.6rem; font-weight: 600; color: var(--white);}
.main_usage_history { display: block; background: #212121; border-radius: 16px; color: var(--white); padding: 6px 16px; font-size: 1.4rem; font-weight: 700; }



/* 230414 MOZ COIN 메인페이지 디자인 수정 KMS */

/* 팝업 */
.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;}
/* //팝업 */



.tqlistbtn button:nth-child(1) { margin-right:6px;}




@media screen and (max-width:767px){
 .pop_cont { width:90%; }
 .mylist p { font-size:1.4rem; word-break: keep-all; }
 .ddr_direct {display:flex; justify-content: space-between; align-items: center; flex-wrap:wrap;}
 .ddr_direct li { width:28%;}
 }
@media screen and (max-width:520px){
.main_icon_box {padding: 10px; display: grid; grid-template-columns: repeat(3, 1fr); column-gap: 5px;}
}
/* @media screen and (max-width:400px){
.main_icon_box {display: grid; grid-template-columns: repeat(3, 1fr); column-gap: 10px;}
} */
@media screen and (max-width:375px){
 .mainheader_title { font-size:1.4rem; }
 .main_icon_box {padding: 10px; display: grid; grid-template-columns: repeat(3, 1fr); column-gap: 0px;}
 }
 @media screen and (max-width:295px){
  .mainheader_title { font-size:1.4rem; }
  .main_icon_box {padding: 10px; display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 0px;}
  }