@charset "UTF-8";


.loading { background:url('/common/img/ajax-loader.gif') no-repeat; background-position:center }

.main_tab_content { display:none }
.main_tab_content.on { display:block }

/* 내정보 탭 컨텐츠 */
.myinfo_tab_content      { display:none;  }
.myinfo_tab_content.show { display:block; }

/* 하단버튼 */
.bottom_btn { position:fixed; z-index:99; width:100%; min-width:320px; max-width:640px; bottom:76px; padding:12px 12px 12px 12px; text-align:right; }
.bottom_btn button { padding:12px 16px; background-color:var(--color-G8); border-radius:30px; border:0px; }
.bottom_btn button .text { display:inline-block; color:#fff; }
.bottom_btn.FAB button { padding:0px; width:49px; height:49px; }
.bottom_btn.FAB button .text { display:none }
.bottom_btn.ios,
.bottom_btn.android { bottom:0px }

/* hmreport_banner */
div.hmreport_banner { display:flex; align-items: center; justify-content: center; background-color:#F7FAFF; }
div.hmreport_banner > div:nth-child(1) { width:30%; text-align:right; }
div.hmreport_banner > div:nth-child(1) img { width:70%; }
div.hmreport_banner > div:nth-child(2) { width:70%; padding:18px 0px 18px 13px }
div.hmreport_banner > div:nth-child(2) b { color:var(--color-B5) }
div.hmreport_banner > div:nth-child(2) span { display:block; padding-top:4px; color:var(--color-G6); font-size:11px; line-height:16px }

/* hmreport_generate_ing */
ul.hmreport_generate_ing { padding:0px 16px; }
ul.hmreport_generate_ing li { margin-top:12px; width:100%; background-color:#fff; box-shadow: 0px 2px 8px 0px #00000040; border-radius:8px; padding:16px; }
ul.hmreport_generate_ing li h4 { font-weight:600; padding-bottom:8px }
ul.hmreport_generate_ing li .rp-bar { position: relative; width: 100%; height: 8px; border-radius: 999px; background: #e5e7eb; overflow: hidden; }
ul.hmreport_generate_ing li .rp-bar-fill { position: absolute; inset: 0; border-radius: inherit; background: linear-gradient(90deg, #2165cc 0%, #6520c5 50%, #c52d8d 100%); transition: width 0.3s ease; animation: rp-pulse 1.4s ease-in-out infinite; }
ul.hmreport_generate_ing li .fail { background:#CC5421 !important; animation:none }

@keyframes rp-pulse {
  0%, 100% { filter: brightness(1); }
  50% { filter: brightness(1.35); }
}

/* ####### 배너 ####################### */
div.banner { width:100%; height:auto; white-space:nowrap; overflow:hidden; }
div.banner::-webkit-scrollbar { display: none; }
/*div.banner ul li img { width:79px; position: absolute; right:1%; top:9% }*/
.page_wrap { position:absolute; padding:0px 20px; margin-top:-35px; width:100%; min-width:320px; max-width:640px; z-index:999; text-align:right; }
.page_wrap #banner_page  { padding:3px 5px; font-size:10px; color:rgba(255,255,255,0.8); background-color:rgba(59,59,59,0.5); border-radius:73px }

.banner_hana{ position: relative; display: flex; flex-direction: row; justify-content: space-around; align-items: center; background-color: #D9FFF8; height: 120px; padding: 16px 0 16px 8px }
.banner_hana .banner_hana_img { height:75px  }
.banner_hana_colBox { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 4px }
.banner_hana_colBox__span { font-weight: 700; font-size: 10px; line-height: 160%; color:#009178;  }
.banner_hana_rowBox { display: flex; flex-direction: row; justify-content: flex-start; align-items: center;}
.banner_hana_rowBox__span { font-weight: 800; font-size: 16px; line-height: 160%; color:#212121;  }

.banner_juju{ position: relative; display: flex; flex-direction: row; justify-content: space-around; align-items: center; background-color: var(--color-A1); height: 120px; padding: 16px 0 16px 39px }
.banner_juju .banner_juju_img {   }
.banner_juju_colBox { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 4px }
.banner_juju_colBox__span { font-weight: 700; font-size: 10px; line-height: 160%; color:var(--color-A5);  }
.banner_juju_rowBox { display: flex; flex-direction: row; justify-content: flex-start; align-items: center;}
.banner_juju_rowBox__span { font-weight: 800; font-size: 16px; line-height: 160%; color:var(--color-BL);  }
.banner_arrow {  }


.banner_yangdo{ position: relative; display: flex; flex-direction: row; justify-content: space-around; align-items: center; background-color: var(--color-B1); height: 120px; padding: 16px 0 0 39px }
.banner_yangdo .banner_yangdo_img {  }
.banner_yangdo_colBox { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 4px }
.banner_yangdo_colBox__span { font-weight: 700; font-size: 12px; line-height: 160%; color:var(--color-B5);  }
.banner_yangdo_rowBox { display: flex; flex-direction: row; justify-content: flex-start; align-items: center;}
.banner_yangdo_rowBox__span { font-weight: 800; font-size: 16px; line-height: 160%; color:var(--color-BL);  }


.banner_tasa{ position: relative; display: flex; flex-direction: row; justify-content: space-around; align-items: center; background-color: var(--color-G2); height: 120px; padding: 16px 0 16px 39px }
.banner_tasa .banner_tasa_img {  }
.banner_tasa_colBox { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 4px }
.banner_tasa_colBox__span { font-weight: 700; font-size: 12px; line-height: 160%; color:var(--color-G6);  }
.banner_tasa_rowBox { display: flex; flex-direction: row; justify-content: flex-start; align-items: center;}
.banner_tasa_rowBox__span { font-weight: 800; font-size: 16px; line-height: 160%; color:var(--color-BL);  }

.banner_satisfaction{ position: relative; display: flex; flex-direction: row; justify-content: space-around; align-items: center;  background-color: #D6FFF0; height: 120px; padding: 16px 0 16px 39px }
.banner_satisfaction .banner_satisfaction_img { width:80px; position: absolute; right:4%; top:24%  }
.banner_satisfaction_colBox { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 4px }
.banner_satisfaction_colBox__span { font-weight: 700; font-size: 12px; line-height: 160%; color:var(--color-G6);  }
.banner_satisfaction_rowBox { display: flex; flex-direction: row; justify-content: flex-start; align-items: center;}
.banner_satisfaction_rowBox__span { font-weight: 800; font-size: 16px; line-height: 160%; color:var(--color-BL);  }

/* ##################### 랭킹 (실시간 TOP5) #############################*/

#ranking { min-height:330px; }
#realtime_title { margin:0 6px; color:var(--color-BL); padding:7px 15px; font-weight:800; height:34px; background-color:var(--color-G2); border-radius:40px; }
#realtime_page  { padding:0px 12px }
div.ranking_top5 { width:100%; height:auto; white-space:nowrap; overflow:auto; margin-top:24px }
div.ranking_top5::-webkit-scrollbar { display: none; }
div.ranking_top5 > ul      { }
div.ranking_top5 > ul > li { display:inline-block; height:auto; padding:20px 18px 20px 16px; background-color:var(--color-WH); border:1px solid var(--color-G3); border-radius:16px; box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.1); margin-bottom:5px }
ul.top5_list       { width:100%; }
ul.top5_list li    { display:block; width:100%; margin-top:20px; font-size:0px; }
ul.top5_list li:first-child { margin-top:0px }
ul.top5_list li b  { color:var(--color-G4); font-size:16px; font-weight:800 }
ul.top5_list li h4 { display:inline-block; margin-left:16px; color:var(--color-BL); font-weight:800; vertical-align:top; height:22px; width:auto; max-width:calc(100% - 130px); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;  }
ul.top5_list li h5 { display:inline-block; margin-left:16px; color:var(--color-G5); }
ul.top5_list li i  { float:right; }


/* ##################### 비상장 뉴스 #############################*/

#news_list { width:100%; }
#news_list > li { display:flex; padding:0px 20px; height:53px; margin-top:16px }
#news_list > li.page_1 { display:flex }
#news_list > li.page_2 { display:none }
#news_list > li > img { width:53px; height:53px; background-color:var(--color-G2); border-radius:8px; border:1px solid var(--color-G2)}
#news_list > li > div { width:calc(100% - 53px); padding-left:8px; }
#news_list > li > div h4    { height:26px; width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:400 }
#news_list > li > div h6    { height:25px; padding-top:2px; font-weight:800; float:right }
#news_list > li > div small { color:#B3B3B3; }
#news_list > li.more { display:block; border-top:1px solid #F5F5F5; height:48px; line-height:48px; text-align:center; cursor:pointer; }

/* ##################### VC Section #############################*/
.vc_home{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  width: 100%;
  box-sizing: border-box;
  padding: 32px 0 0 0px;
}

.vc_home_info{
  width: 100%;
}



.vc_home__top{
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  font-weight: 800;
  font-size: 18px;
  line-height: 160%;
  letter-spacing: -0.02em;
  color: var(--color-BL);
}

.vc_home_top__div{
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
  margin-left: 16px;
  margin-right: 16px;
}

.vc_home__banner{
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  font-weight: 800;
  font-size: 18px;
  line-height: 160%;
  letter-spacing: -0.02em;
  color: var(--color-BL);
  background-color: var(--color-G2);
  border-radius: 12px;
  padding: 12px;
  gap: 6px;
  margin: 0 16px;
}

.vc_home__bannerName{
  font-weight: 800;
  font-size: 18px;
  line-height: 160%;
  letter-spacing: -0.02em;
  color: #3CC8C4;
  margin-left: 6px;
}

.vc_home__bannerTxt{
  font-weight: 700;
  font-size: 14px;
  line-height: 160%;
  letter-spacing: -0.02em;
  color: var(--color-G7);
}


.vc_home__swiper{
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  margin: 16px 0 32px 0;
  box-sizing: border-box;
  overflow: hidden;
  width: 100%;
}

.vc_home__swiper_item{
  width: 20px;
}

.size16{
  width: 16px;
  height: 16px;
}

.vc_home__list{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 32px;
  width: 100%;
  overflow: hidden;
}

.vc_home__ul{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 32px;
  width: 100%;

}

.vc_home__listItem{
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  width: 92%;
}

.vs_home__listItem--left {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: flex-start;
  gap: 12px;
}

.vc_home__itemName{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
}


.vc_home__corpDetail{
  font-weight: 400;
  font-size: 12px;
  line-height: 140%;
  color: var(--color-G6);
}

.vc_home__button{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
}

.vc_home_moveVcList{
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 12px 0;
  background: transparent;
  border-radius: 8px;
  box-sizing: border-box;
  border: none;
  font-weight: 700;
  font-size: 12px;
  line-height: 160%;
  color: var(--color-G7);
  gap: 4px;
}

@media screen and (max-width: 358px) {
  .vc_home__bannerName{
    font-size: 16px;
    white-space: nowrap;
    overflow: hidden;
  }
}





/* ##################### 테마 ##################### */
#theme { min-height:400px; }

#theme_tab { }
#theme_tab li:first-child { margin-left:16px !important;  }
#theme_tab li:last-child  { margin-right:16px !important; }

#theme_tab2 { }
#theme_tab2 li:first-child { margin-left:16px !important;  }
#theme_tab2 li:last-child  { margin-right:16px !important; }

.theme_img { padding:0 16px; }
.theme_img img { width:100%; border-radius:12px; }

div.theme { width:100%; white-space:nowrap; overflow:hidden; padding-bottom:20px; }
div.theme::-webkit-scrollbar { display: none; }
div.theme > ul      { }
div.theme > ul > li { min-height:100px; display:inline-block; padding:0px 18px 0px 16px; }

ul.theme_stock_list        { }
ul.theme_stock_list li     { display: flex; align-items: center; width:100%; margin-top:20px; font-size:0px; }
ul.theme_stock_list li > div.bezier_frame {  }
ul.theme_stock_list li > div.stock_info { display:inline-block; width:calc(100% - 80px); padding-left:12px; }
ul.theme_stock_list li > div.stock_info h4 { width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
ul.theme_stock_list li > div.stock_info h4 small { font-size:14px; font-weight:800 }
ul.theme_stock_list li > i   { display:inline-block; }
ul.theme_stock_list li.more {  }

/* ####### 배너 ####################### */
.banner2     { width:100%; height:96px; background-color:var(--color-A1); }
.banner2 span { position:absolute; width:100%; min-width:320px; max-width:640px; text-align:right; margin-top:-14px }
.banner2 h4   { width:100%; padding-top:24px; padding-left:16px;  }
.banner2 h6   { width:100%; padding-left:16px;  }


/* ####### IPO 일정 ####################### */
span.ipo { width:57px; display:inline-block; font-size:12px; color:var(--color-G6); margin-right:16px; font-weight:bold; }
span.ipo:before { display:inline-block; content:''; width:6px; height:6px; border-radius:6px; margin-right:4px; }
span.ipo.demand:before    { background-color:var(--color-B6) }
span.ipo.subscript:before { background-color:#16D993 }
span.ipo.ipo_date:before  { background-color:var(--color-A6) }

#ipo_tab_wrap.fixed_wrap { height:72px }
#ipo_tab_wrap.fixed_wrap .fixed_target{ width:100%; max-width:640px; position: fixed; top:62px; z-index: 1000; background-color:#fff;  }
#ipo_tab li { margin: 0px 8px; }
ul.ipo_list      { margin:0px 16px 33px 16px; min-height:400px; }
ul.ipo_list li   { display:none; border:1px solid #EEEEEE; border-radius:8px; padding:16px 14px; margin-bottom:14px; }
ul.ipo_list li.blank { display:none !important; border:0px; text-align:center; padding:80px 0px; color:var(--color-G5); }
ul.ipo_list li.more  { display:none; background-color:var(--color-G2); text-align:center; font-size:12px; font-weight:800; border-radius:8px; padding:12px 0px; margin-bottom:14px; cursor:pointer }
ul.ipo_list.manager   li.manager   { display:block }
ul.ipo_list.claim     li.claim     { display:block }
ul.ipo_list.approval  li.approval  { display:block }
ul.ipo_list.demand    li.demand    { display:block }
ul.ipo_list.subscript li.subscript { display:block }
ul.ipo_list.ipo_date  li.ipo_date  { display:block }
ul.ipo_list.manager.blank   li.manager.blank   { display:block !important }
ul.ipo_list.claim.blank     li.claim.blank     { display:block !important }
ul.ipo_list.approval.blank  li.approval.blank  { display:block !important }
ul.ipo_list.demand.blank    li.demand.blank    { display:block !important }
ul.ipo_list.subscript.blank li.subscript.blank { display:block !important }
ul.ipo_list.ipo_date.blank  li.ipo_date.blank  { display:block !important }
ul.ipo_list li .corp_name { font-size:16px; font-weight:800; }
ul.ipo_list li .corp_name label.marketable  { height:20px; line-height:19px; padding:2px 4px; border-radius:4px; background-color:var(--color-B1); color:var(--color-B5); font-size:10px; font-weight:800 }
ul.ipo_list li .corp_name label.kosdaq      { height:20px; line-height:19px; padding:2px 4px; border-radius:4px; background-color:var(--color-B1); color:var(--color-B5); font-size:10px; font-weight:800 }
ul.ipo_list li .corp_name label.trade       { height:20px; line-height:19px; padding:2px 4px; border-radius:4px; background-color:var(--color-A1); color:var(--color-A5); font-size:10px; font-weight:800 }
ul.ipo_list li .corp_name span { float:right; height:20px; line-height:16px; border:1px solid var(--color-A5); border-radius:4px; color:var(--color-A5);  padding:2px 4px; font-size:10px }
ul.ipo_list li .sec { font-size:12px }
ul.ipo_list li .sec small { color:#8C8C8C; padding-right:5px; font-size: 12px; }


/* ########## 유의사항 ################## */
div.home_info { padding:30px 20px 40px 20px; background-color:#F6F8F9; color:#999999; font-size:12px; line-height:140%; word-break:break-all }
div.home_info b { display:block; font-weight:700; margin-bottom:16px; color:#888888 }


/* ########## 종목검색 ################## */
#recommend_list { padding:25px 0px 16px 0px }

.search_history .tab li { padding:0 14px; }

.realtime_rank_list { height:calc(100vh - 288px); overflow-y:scroll }

#stock_search { display:none; position:fixed; width:100%; min-width:320px; max-width:640px; top:var(--top-height); height:calc(100vh - var(--top-height)); background-color:#fff; z-index:999 }
#stock_search div.search_area span.input input { padding:0px; width:calc(100% - 40px); height:56px; line-height:56px; font-size:16px; font-weight:bold; border:0px; background-color:transparent; }
#stock_search div.search_area span.input input::placeholder{ color: var(--color-G6); }
#stock_search div.search_area span.input i     { float:right; }
#stock_search div.search_area i { margin-top:12px }

ul.all_list { padding:25px 16px 16px 16px; width:100%; height:calc(100vh - var(--top-height) - 56px); overflow-y: scroll; }
ul.all_list li { display:block; min-height:35px; padding: 0px 0px 0px 5px; font-size:16px; color:#111; line-height:17px; vertical-align: middle }
ul.all_list li.mystock { padding-left:35px }
ul.all_list li.mystock:before { display:inline-block; position:relative; margin-left:-35px; margin-right:5px; padding:2px 4px; margin-top:3px; content:'보유'; background-color:#fff8ee; color:#ff9929; font-size:12px; border-radius:8px }
ul.all_list li span  { display:inline-block; padding:5px 0px; width:calc(100% - 55px); word-break: break-all; vertical-align: middle }
ul.all_list li i     { vertical-align: middle; }
ul.all_list li small { display:inline-block; width:55px; text-align:right; font-size:13px; color:#999 }


/* ###### 허밍리포트 ########## */
#hmreport div.search_box { padding:0px 16px; }
#hmreport div.search_box input  { background-color:var(--color-G2); height:44px; line-height:44px; border-radius:6px; width:100%; padding:0px 40px 0px 16px; border:0px; font-size:14px }
#hmreport div.search_box input::placeholder { color:var(--color-G4); }
#hmreport div.search_box i { position: absolute; background-image:url(/common/css/import/icons/close_round.svg); margin-left: -40px; margin-top:10px; cursor:pointer }
#hmreport div.search_box input:placeholder-shown + i { background-image:url(/common/css/import/icons/search.svg) !important; }

#hmreport div.hmreport_title   { padding:0px 16px; font-weight:800; font-size:16px; color:var(--color-BL);  }
#hmreport div.hmreport_title b { color:var(--color-A5); }
#hmreport div.hmreport_title i { font-style: normal }
#hmreport div.hmreport_title div { display:inline; float:right; font-size:12px; font-weight:400; color:var(--color-G7); cursor:pointer }

#hmreport_list    { padding:0px 16px; padding-bottom:50px }
#hmreport_list li { display:flex; margin-top:16px; cursor:pointer }
#hmreport_list li > div:nth-child(1){ width:111px; height:71px; background-color:var(--color-G2); border-radius:5px; overflow:hidden; }
#hmreport_list li > div:nth-child(2){ width:calc(100% - 111px); padding-left:16px; }
#hmreport_list li h4   { font-size:16px; font-weight:800; overflow:hidden; text-overflow:ellipsis; word-wrap:break-word; display:-webkit-box !important; -webkit-line-clamp:2; -webkit-box-orient: vertical; word-break:break-word; }
#hmreport_list li span { color:var(--color-G5); font-size:12px; font-weight:normal }

#hmreport_list li.btn { display:block; padding: 0px; }
#hmreport_list li.btn div.btn_generate { width:100%; height:79px; display:flex; justify-content: space-between; align-items: center; box-shadow: 0px 2px 8px 0px #00000040; border-radius:8px; background: linear-gradient(90deg, #EBF3FF 0%, #F4ECFF 25%, #FFEEF9 50%, #FFFFFF 99.71%); }
#hmreport_list li.btn div.btn_generate > div:nth-child(1) { width:60px; text-align:center; }
#hmreport_list li.btn div.btn_generate > div:nth-child(1) img { width:32px; }
#hmreport_list li.btn div.btn_generate > div:nth-child(2) { width:calc(100% - 60px - 34px); text-align:left; font-size:13px; color:var(--color-G6) }
#hmreport_list li.btn div.btn_generate > div:nth-child(2) h4 { color:var(--color-BL) }
#hmreport_list li.btn div.btn_generate > div:nth-child(3) { width:34px; text-align:left; }

ul.sort_list { width:100%; }
ul.sort_list li { padding:16px 0px; font-size:16px; font-weight:700; color:#595959; border-bottom:1px solid #E6E6E6; cursor:pointer }
ul.sort_list li:last-child { border:0px }
ul.sort_list li.on { font-weight:800; color:#FF6929; background-image:url(/common/css/import/icons/check_on.svg); background-repeat:no-repeat; background-position:center right; background-size:24px }
ul.sort_list li.empty { padding:92px 0px; text-align:center; color:var(--color-G5); font-size:14px; font-weight:700 }

/* 작성하기 버튼 */
.request_bottom_btn { position:fixed; z-index:99; width:100%; height:1px; min-width:320px; max-width:640px; bottom:76px; margin-bottom:66px; padding:0px; text-align:right; }
body.ios     .request_bottom_btn,
body.android .request_bottom_btn,
.request_bottom_btn.sub_page { bottom:0px }
.request_bottom_btn button.hmreport_add {
	width:56px; height:56px; background:var(--color-A5) url('/common/icon/hmreport_add.svg') no-repeat 50%; border-radius:100%; 	box-shadow: 0px 4px 6px 0px #00000040;
	float:right; margin-right:15px; border:0px;
}