/* 
    2018-10-30 CSS통합 버튼 
    1. 모양 구분 ( 원형, 둥근사각, 사각형 )
    2. 색상 구분 ( 활성화,비활성화,디폴트,클릭시 기타등등 )
    
    * 사용시 폰트스타일 및 사이즈는 지정해서 사용해야함.
    * 예시 보고싶을 경우 : StockPoin.Web > Design > TotalCss.html 에서 확인 가능
*/

/* Html Elements
----------------------------------------------------------*/
* {  }
html { overflow-y:scroll; box-sizing:border-box; margin: 0px; padding: 0px; letter-spacing:-0.5px; color: #222; margin:0; padding:0;}
img { border-style: none; }
table, th, td { border: 0px; border-collapse: collapse; }
ul, ul li { list-style-type: none;  }
input, button { outline:0; }

a:link { text-decoration: none; color:inherit; }
a:visited { text-decoration: none; color:inherit; }
a:active { text-decoration: none; outline: none; color:inherit; }
a:hover { text-decoration: none; color:inherit; }
a:focus{ outline: none; }
a {
	outline: 0;
    color:inherit;
 }
hr.solid_dd { border:0.5px solid #ddd; }



.width100 { width:calc(100% + 30px)!important; margin:0 -15px;}

/* 버튼 모양-둥근박스*/
.btn_rbox3 { border-radius:3px; }
.btn_rbox8 { border-radius:8px; }
.btn_rbox12 { border-radius:12px; }
.btn_rbox100 { border-radius:100px; }

/* 버튼 모양-원형*/
.btn_r20 { display:inline-block; width:20px; height:20px; line-height:15px; border-radius:30px; text-align:center; box-sizing:border-box; vertical-align:middle; padding:0!important; font-weight:bold; }
.btn_r22 { display:inline-block; width:22px; height:22px; line-height:17px; border-radius:22px; text-align:center; box-sizing:border-box; vertical-align:middle; padding:0!important; font-weight:bold; }
.btn_r30 { display:inline-block; width:30px; height:30px; line-height:28px; border-radius:30px; text-align:center; box-sizing:border-box; vertical-align:middle; padding:0!important; font-weight:bold; }

/* 버튼    
    btn_컬러 : 배경색이 있는 버튼
    btn_색상_on : 클릭시 변경될 색상 (사용미정)
    btn_line_색상 : 흰색 배경의 테두리와 폰트색상이 같은 버튼
*/
    /* 선만있는 버튼*/
.btn_wh { border:1px solid #efeeee; background-color:#fff; color:#7d7d7d; }
.btn_line_or { border:1px solid #ff5700; background-color:#fff; color:#ff5700; }
.btn_line_bgr { border:1px solid #969fb0; background-color:#fff; color:#969fb0;}
.btn_line_skb { border:1px solid #8096b9; background-color:#fff; color:#8096b9;}
.btn_line_sky { border:1px solid #01addf; background-color:#fff; color:#01addf;}
.btn_line_pbl { border:1px solid #353d62; background-color:#fff; color:#353d62;}
.btn_line_bk { border:1px solid #0f0f0f; background-color:#fff; color:#0f0f0f;}

    /*채워진 버튼 색상*/
.btn_whgrey { background-color:#e9e9e9; color:#fff; }
.btn_ligrey { background-color:#f5f4f4; color:#000; }
.btn_ligrey_on { background-color:#e9e9e9; color:#000; }
.btn_or { border:1px solid #ff3100; background-color:#ff5700; color:#fff;         
background-image: -webkit-linear-gradient(top bottom, #ff7100 0%, #ff5700 100%); 
background-image: -o-linear-gradient(top bottom, #ff7100 0%, #ff5700 100%); 
background-image: -webkit-gradient(linear, left top, left bottom, from(#ff7100), to(#ff5700)); 
background-image: linear-gradient(to bottom,#ff7100,#ff5700);
}
.btn_or_on { border:1px solid #ff3100; background-color:#e35004; color:#fff; }
.btn_bgr { border:1px solid #8d94a7; background-color:#969fb0; color:#fff;         
background-image: -webkit-linear-gradient(top bottom, #a5aebf 0%, #969fb0 100%); 
background-image: -o-linear-gradient(top bottom, #a5aebf 0%, #969fb0 100%); 
background-image: -webkit-gradient(linear, left top, left bottom, from(#a5aebf), to(#969fb0)); 
background-image: linear-gradient(to bottom,#a5aebf,#969fb0);
}
.btn_bgr_on { border:1px solid #7c8293; background-color:#8d94a7; color:#fff;}
.btn_skb { border:1px solid #768bac; background-color:#8096b9; color:#fff;         
background-image: -webkit-linear-gradient(top bottom, #9eb3cf 0%, #8096b9 100%); 
background-image: -o-linear-gradient(top bottom, #9eb3cf 0%, #8096b9 100%); 
background-image: -webkit-gradient(linear, left top, left bottom, from(#9eb3cf), to(#8096b9)); 
background-image: linear-gradient(to bottom,#9eb3cf,#8096b9);
}
.btn_skb_on { border:1px solid #768bac; background-color:#647ca4; color:#fff;}
.btn_sky { border:1px solid #019cc9; background-color:#01addf; color:#fff;         
background-image: -webkit-linear-gradient(top bottom, #1fb7e3 0%, #01addf 100%); 
background-image: -o-linear-gradient(top bottom, #1fb7e3 0%, #01addf 100%); 
background-image: -webkit-gradient(linear, left top, left bottom, from(#1fb7e3), to(#01addf)); 
background-image: linear-gradient(to bottom,#1fb7e3,#01addf);
}
.btn_sky_on { border:1px solid #048fb7; background-color:#019cc9; color:#fff;}
.btn_pbl { border:1px solid #333a5f; background-color:#353d62; color:#fff;         
background-image: -webkit-linear-gradient(top bottom, #545f95 0%, #353d62 100%); 
background-image: -o-linear-gradient(top bottom, #545f95 0%, #353d62 100%); 
background-image: -webkit-gradient(linear, left top, left bottom, from(#545f95), to(#353d62)); 
background-image: linear-gradient(to bottom,#545f95,#353d62);
}
.btn_pbl_on { border:1px solid #252a48; background-color:#333a5f; color:#fff;}
.btn_bk { border:1px solid #000; background-color:#0f0f0f; color:#fff;         
background-image: -webkit-linear-gradient(top bottom, #3f3f3f 0%, #0f0f0f 100%); 
background-image: -o-linear-gradient(top bottom, #3f3f3f 0%, #0f0f0f 100%); 
background-image: -webkit-gradient(linear, left top, left bottom, from(#3f3f3f), to(#0f0f0f)); 
background-image: linear-gradient(to bottom,#3f3f3f,#0f0f0f);
}
.btn_bk_on { border:1px solid #363636; background-color:#0f0f0f; color:#fff;}



/* 라벨 사이즈 */
.label_size_s { display:inline-block; height:20px; box-sizing:border-box; font-size:12px; font-family:Dotum; line-height:20px; vertical-align:middle; }
.label_size_m { display:inline-block; height:28px; box-sizing:border-box; font-size:12px; font-family:Dotum; line-height:28px; vertical-align:middle; }
.label_size_l { display:inline-block; height:34px; box-sizing:border-box; font-size:12px; font-family:Dotum; line-height:34px; vertical-align:middle; }
.label_size_xl { display:inline-block; height:42px; box-sizing:border-box; font-size:12px; font-family:Dotum; line-height:42px; vertical-align:middle; }
/* 라벨 모양 */
.label_r_s { display:inline-block; width:22px; height:22px; line-height:23px; border-radius:20px; text-align:center; box-sizing:border-box; vertical-align:middle; padding:0!important; font-weight:bold; font-size:11px }
.label_r_m { display:inline-block; width:28px; height:28px; line-height:28px; border-radius:30px; text-align:center; box-sizing:border-box; vertical-align:middle; padding:0!important; font-weight:bold; }
.label_rbox_s { display:inline-block; border-radius:3px; overflow:hidden; }
.label_rbox_m { display:inline-block; border-radius:6px; overflow:hidden; }
.label_rbox_l { display:inline-block; border-radius:100px; overflow:hidden; }

/* 라벨 색상 지정 */
.label_ye { color:#fff; background-color:#ffbd28; }
.label_gn { color:#fff; background-color:#2fa448; }
.label_wpu { color:#fff; background-color:#777fb2; }
.label_pu { color:#fff; background-color:#503767; }
.label_red { color:#fff; background-color:#e00000; }
.label_or { color:#fff; background-color:#ff4e00; }
.label_wgr { color:#fff; background-color:#e4e4e4; }
.label_gr { color:#fff; background-color:#bbbbbb; }
.label_dgr { color:#fff; background-color:#626c75; }
.label_pk { color:#fff; background-color:#f8d3ce; }
.label_nb { color:#fff; background-color:#313753; }
.label_bl { color:#fff; background-color:#006786; }
.label_skb { color:#fff; background-color:#01addf; }
.label_ror { color:#fff; background-color:#f34834; }
.label_ygn { color:#fff; background-color:#6abc50;  }
.label_aqu { color:#fff; background-color:#11c9d3; }

/* 테두리만 있는 라벨 */
.label_line_ye { background-color:#fff; color:#ffbd28; border:1px solid #ffbd28; box-sizing:border-box; }
.label_line_gn { background:#fff; color:#2fa448; border:1px solid #2fa448; box-sizing:border-box; }
.label_line_wpu { background:#fff; color:#777fb2; border:1px solid #777fb2; box-sizing:border-box; }
.label_line_pu { background:#fff; color:#503767; border:1px solid #503767; box-sizing:border-box; }
.label_line_red { background:#fff; color:#e00000; border:1px solid #e00000; box-sizing:border-box; }
.label_line_or { background:#fff; color:#ff4e00; border:1px solid #ff4e00; box-sizing:border-box; }
.label_line_wgr { background:#fff; color:#bababa; border:1px solid #e4e4e4; box-sizing:border-box; }
.label_line_gr { background:#fff; color:#bbbbbb; border:1px solid #bbbbbb; box-sizing:border-box; }
.label_line_dgr { background:#fff; color:#626c75; border:1px solid #626c75; box-sizing:border-box; }
.label_line_pk { background:#fff; color:#f8d3ce; border:1px solid #f8d3ce; box-sizing:border-box; }
.label_line_nb { background:#fff; color:#313753; border:1px solid #313753; box-sizing:border-box; }
.label_line_bl { background:#fff; color:#006786; border:1px solid #006786; box-sizing:border-box; }
.label_line_skb { background:#fff; color:#01addf; border:1px solid #01addf; box-sizing:border-box; }
.label_line_ror { background:#fff; color:#f34834; border:1px solid #f34834; box-sizing:border-box; }
.label_line_ygn { background:#fff; color:#6abc50; border:1px solid #6abc50; box-sizing:border-box; }
.label_line_aqu { background:#fff; color:#11c9d3; border:1px solid #11c9d3; box-sizing:border-box; }


/* 탭 컬러 
    사용시 ul 사이즈 지정 및 폰트스타일 지정해야함.
    ul = ctrl_tab
    li = tab_column
*/
.ctrl_tab .tab_column { position:relative; float:left; width:25%; height:50px; line-height:50px; text-align:center; border:1px solid #ddd; border-right:0; color:#333; background-color:#fff; box-sizing:border-box; }
.ctrl_tab .tab_column:last-of-type { border-right:1px solid #ddd;}

    /*탭-클릭시 변경*/
.ctrl_tab .tab_column.on_or { border:0; color:#fff; background-color:#ff4e00; }
.ctrl_tab .tab_column.on_or:after { top: 100%; left: 50%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-top-color: #ff4e00; border-width: 5px; margin-left: -5px; }
.ctrl_tab .tab_column.on_wpu { border:0; color:#fff; background-color:#777fb2; }
.ctrl_tab .tab_column.on_wpu:after { top: 100%; left: 50%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-top-color: #777fb2; border-width: 5px; margin-left: -5px; }
.ctrl_tab .tab_column.on_pb { border:0; color:#fff; background-color:#333a5f; }
.ctrl_tab .tab_column.on_pb:after { top: 100%; left: 50%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-top-color: #333a5f; border-width: 5px; margin-left: -5px; }
.ctrl_tab .tab_column.on_bk { border:0; color:#fff; background-color:#272c2f; }
.ctrl_tab .tab_column.on_bk:after { top: 100%; left: 50%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-top-color: #272c2f; border-width: 5px; margin-left: -5px; }


/*공통 디자인 레이아웃*/
.common { /*width:1920px;*/ letter-spacing:-0.5px; font-family:'Noto Sans KR','Noto Sans CJK KR'; }
.common { /*padding: 0 30px;*/ }
.tit_1 { margin-top:50px; color:#222; font-size:30px; font-weight:bold; }
.tit_2 { margin-top:30px; color:#222; font-size:25px; }
.sub { margin-top:10px; color:#666; font-size:16px; line-height:22px; }
.center { text-align:center; border-top:1px solid #ddd; }
.navigation { margin:25px 0; padding-bottom:7px; font-size: 32px; font-weight:normal; line-height:30px; } 


.common .list { display:inline-block; width:390px; text-align:left; box-sizing:border-box; margin:0 15px 0 0; border:1px solid #ddd; background:#fff; }
.common .list_wrap { display:inline-block; width:1920px; box-sizing:border-box; padding:40px; margin:40px auto; background:#f8f8f8; text-align:center; }
.common .list:last-child { margin-right:0px; }
.common .list.radius_5 { border-radius:5px; }
.common .list.radius_10 { border-radius:10px; }
.common .list_tag { margin:0; }
.common .list .con_img { display:block; position:relative; height:220px; box-sizing:border-box; margin-bottom:5px; border-bottom:1px solid #ddd; background:#666; vertical-align:middle; text-align:center; }
.common .list .con_img .left_top { position:absolute; top:-10px; left:0px; border-top-right-radius:0; border-bottom-left-radius:0; }
.common .list .con_img .right_bottom { position:absolute; bottom:8px; right:4px; }
.common .list .con_img .right_bottom2 { position:absolute; bottom:8px; right:70px; }
.common .list .con_txt { padding:5px 15px; }
.common .list .sea_tit { display:inline-block; color:#2a2a65; font-size:20px; font-weight:bold; }

.common .list .list_tit { margin-top:5px; color:#222; font-size:19px; line-height:25px; }
.common .list .list_con { margin:5px 0 20px 0; color:#666; font-size:14px; line-height:18px; }
.common .list .list_subcon { margin:5px 0 20px 0; color:#999; font-size:13px }
.common .list .list_subtit { margin:10px 0 0 0; color:#222; font-size:19px; line-height:20px; font-weight:normal; }
.common .list .list_subtit i { margin:0 5px 0 0; color:#222; font-size:15px; }
.common .list .list_subtit.mento { color:#2a2a65; }
.common .list .list_subtit.mento i { position:relative; top:2px; color:#2a2a65; }

.common .list .tend { border:1px solid #ddd; }
.common .list .tend.no-border { border:none; }
.common .list .tend .tag.short { color:#1e489f; }
.common .list .tend .tag.swing { color:#ff6023; }
.common .list .tend .tag.chart { color:#2a2a65; }
.common .list .tend .tag.theme { color:#ee3128; }
.common .list .tend .tag.trend { color:#950082; }
.common .list .tend .tag.party { color:#f47425; }
.common .list .tend .tag.cost { color:#2e2e72; }
.common .list .tend .tag.supply { color:#1e489f; }
.common .list .tend .tag.end { color:#ee3128; }

.common .list .tag { display:inline-block; padding:2px 5px; margin:10px 3px 0 0; border:1px solid #ccc; border-radius:2px; color:#666; font-size:12px; }
.common .list .tag i { margin-right:5px; font-size:11px; }
.common .list .tag.info { box-sizing:border-box; padding:2px 10px; }
.common .list .tag.fill_gray { border:1px solid #f4f4f4; background:#f4f4f4; color:#777; }
.common .list .tag.fill_red { border:1px solid #ee3128; background:#ee3128; color:#fff; }
.common .list .tag.fill_darkblue { margin-right:5px; border:1px solid #2a2a65; background:#2a2a65; color:#fff; }
.common .list .tag.fill_playtime { border:none; background:rgba( 0, 0, 0, 0.6 ); color:#fff; }
.common .list .tag.fill_good { border:none; background:rgba( 0, 0, 0, 0.6 ); color:#ff7d0a; }
.common .list .tag.start { border:1px solid #fba62d; color:#fba62d; }
.common .list .tag.begin { border:1px solid #f47425; color:#f47425; }
.common .list .tag.middle { border:1px solid #950082; color:#950082; }
.common .list .tag.high { border:1px solid #2e2e72; color:#2e2e72; }
.common .list .tag.red { border:1px solid #ee3128; background:#ee3128; color:#fff; }

.common .tag_wrap { background:#fff; text-align:left; }
.common .tag_wrap .tag_type { width:auto; padding:0; border:none; }
.common .tag_wrap .tag_type .btn .radius_50 { display:inline-block; box-sizing:border-box; border-radius:50px; padding:10px 30px; margin:10px 5px 0 0; line-height:25px; vertical-align:middle;
    background-color:#ddd; background:linear-gradient(to bottom,#ddd,#ddd); font-size:18px; }
.common .tag_wrap .tag_type .btn .radius_50 a { color:#fff; }
.common .tag_wrap .tag_type .btn .radius_50 a i { margin-right:5px; font-size:16px; }
.common .tag_wrap .tag_type .btn .radius_50.subscribe { background-color:#1f1f43; background:linear-gradient(to bottom,#2e2e72,#1f1f43); }
.common .tag_wrap .tag_type .btn .radius_50.ing { background-color:#3b3b7b; background:linear-gradient(to bottom,#4a4a92,#3b3b7b); }
.common .tag_wrap .tag_type .btn .radius_50.forbidden { background-color:#3b3b7b; background:linear-gradient(to bottom,#ddd,#ccc); }
.common .tag_wrap .tag_type .btn .radius_50.apply { background-color:#ee3128; background:linear-gradient(to bottom,#ee3128,#b9160f); }
.common .tag_wrap .tag_type .btn .radius_50.reservation { background-color:#1e489f; background:linear-gradient(to bottom,#1e489f,#143881); }
.common .tag_wrap .tag_type .btn .radius_50.white { border:1px solid #e3e3e3; background-color:#f8f8f8; background:linear-gradient(to bottom,#fff,#f8f8f8); }
.common .tag_wrap .tag_type .btn .radius_50.white a { color:#666; }
.common .tag_wrap .tag_type .btn .radius_50.black { background-color:#222; background:linear-gradient(to bottom,#444,#222); }

/* 만족도평가 */
.satisfaction { height:40px; line-height:40px; color:#222; font-weight:500; vertical-align:middle;  font-family: 'Noto Sans','Noto Sans KR','Noto Sans Korean','NanumGothic';}
.satisfaction .satisfaction_view { position:relative; top:6px; width:100%; color:#222; font-size:75%;  }
.satisfaction .satisfaction_view .tit { display:inline-block; width:98px; color:#222; font-size:75%; }
.satisfaction .satisfaction_view .bar { display:inline-block; width:100%; height:5px; margin:5px 0; background:#eee; text-align:left; vertical-align:middle; line-height:20px;}
.satisfaction .satisfaction_view .bar .gauge { display:inline-block; height:5px; text-align:left; vertical-align:text-top; background:#222222; }
.satisfaction .gauge_percent { display:inline-block; width:30px!important; text-align:center!important; font-size:95%; font-weight:500; vertical-align:middle; margin-top:2px; }
.satisfaction .gauge_percent b { font-size:22px;  }
.satisfaction .gauge_percent.up { color:#ee3128; }

/* 마이페이지_만족도 평가 버튼*/
.satisfaction.my_position { padding:9px 10px; box-sizing:border-box; text-align:right;}
.my_satisfaction_btn { display:inline-block; padding:0 8px; height:22px; line-height:22px; text-align:center; border: 1px solid #ccc; box-sizing:border-box; border-radius: 5px; font-size:12px; font-weight:bold; font-family:Dotum;
    background-image: -webkit-linear-gradient(top bottom, #fff 0%, #f6f6f6 100%);
    background-image: -o-linear-gradient(top bottom, #fff7 0%, #f6f6f6 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f6f6f6));
    background-image: linear-gradient(to bottom,#fff,#f6f6f6);}
.my_satisfaction_btn.bg_bk {border: 1px solid #1c1b1b;
    background-color: #474747;
    background-image: -webkit-linear-gradient(top bottom, #474747 0%, #1c1b1b 100%);
    background-image: -o-linear-gradient(top bottom, #474747 0%, #1c1b1b 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#474747), to(#1c1b1b));
    background-image: linear-gradient(to bottom,#474747,#1c1b1b);
    background-repeat: repeat-x;
    color: #fff;
}
.my_satisfaction_btn.bg_gry { background-color:#d0d4db;  background-image:none;  }


/* 페이징 < 1/2 > 형태 - 클래스명 중복으로 일단 주석처리, 나중 필요시 클래스명 수정해서 사용할 것*/
/*.paging { width:100%; font-size:15px; color:#999; }
.paging input { background:none; margin:0 10px; border:0; font-size:15px; color:#999; cursor:pointer; }
/* Page Number 
.page_num { text-align: center; }
.page_num img { vertical-align: middle; }
.page_num ul { }
.page_num ul li { display: inline-block; zoom: 1; *display: inline; width: 22px; height: 22px; font-size: 12px; line-height: 22px; vertical-align: middle; }
.page_num ul li a { color: #808080; }
.page_num ul li.select { background: #1e489f; font-weight: bold; color: #fff; vertical-align:middle; }
.page_num ul li.select a { color: #fff; }
.page_num ul li.prev { margin: 0px 10px 0px 1px; *margin: 0px 12px 0px 4px; }
.page_num ul li.next { margin: 0px 1px 0px 10px; *margin: 0px 4px 0px 12px; }*/


/* 투명도 공통*/
.opa_05 { opacity:0.5; }

/* display 상태 */
.dp_show { display:inherit!important; }
.dp_hide { display:none!important; }

/* 폰트 컬러 
    장기 : colr_sbl 
    단기 : colr_pp 
    중기, 손실 : colr_bl 
    단타, 수익 : colr_grn
    단기, 퍼센테이지, 성공, 디데이 : colr_or
    실패 : colr_gr9
*/
.colr_or { color:#f25c37!important; } 
.colr_rd { color:#ee3128; } 
.colr_gr { color:#cccccc; } 
.colr_gr7 { color:#777; } 
.colr_gr9 { color:#999999; }
.colr_sbl { color:#189dba;}
.colr_pp { color:#950082; }
.colr_bl { color:#1e489f; }
.colr_grn { color:#0d9f5c; }
.colr_edu { color:#ffb606;}

/* 바디 사이즈 */
.body1200 { width:1200px; margin:0 auto; }
.body940 { width:940px!important; margin:0 auto; }
.mt170 { margin-top:170px!important; }
.pd0 { padding:0!important; }
/* 플롯 해제*/
.clb { content:""; display:block; clear:both; }

.txt_left { text-align:left; } 
.txt_center { text-align:center; } 
.bold { font-weight:500; }
/* 버튼 */
.btn_grey { background-color:#ddd; color:#fff; }
.btn_or { background-color:#f26530; color:#fff; }
.btn_pp { background-color:#181847; color:#fff; }
.gr_ror { color:#fff; cursor:pointer;
    background-image: -webkit-linear-gradient(top bottom, #ff7a00 0%, #ff6000 100%); 
    background-image: -webkit-linear-gradient(top bottom, #ff7a00 0%, #ff6000 100%); 
    background-image: -o-linear-gradient(top bottom, #ff7a00 0%, #ff6000 100%); 
    background-image: -webkit-gradient(linear, left top, left bottom, from(#ff7a00), to(#ff6000)); 
    background-image: linear-gradient(to bottom,#ff7a00,#ff6000);}
.gr_rpp { color:#fff; cursor:pointer;
    background-image: -webkit-linear-gradient(top bottom, #888ca0 0%, #4b4f63 100%); 
    background-image: -webkit-linear-gradient(top bottom, #888ca0ca0 0%, #4b4f63 100%); 
    background-image: -o-linear-gradient(top bottom, #888ca0ca0 0%, #4b4f63 100%); 
    background-image: -webkit-gradient(linear, left top, left bottom, from(#888ca0), to(#4b4f63)); 
    background-image: linear-gradient(to bottom,#888ca0,#4b4f63);}

.gra_dgrey { border:1px solid #1d1b1c; color:#fff; cursor:pointer; 
    background-image: -webkit-linear-gradient(top bottom, #444444 0%, #212021 100%); 
    background-image: -webkit-linear-gradient(top bottom, #444444 0%, #212021 100%); 
    background-image: -o-linear-gradient(top bottom, #444444 0%, #212021 100%); 
    background-image: -webkit-gradient(linear, left top, left bottom, from(#444444), to(#212021)); 
    background-image: linear-gradient(to bottom,#444444,#212021);}
.gra_grey { border:1px solid #e4e4e4; cursor:pointer; 
    background-image: -webkit-linear-gradient(top bottom, #ffffff 0%, #f8f8f8 100%); 
    background-image: -webkit-linear-gradient(top bottom, #ffffff 0%, #f8f8f8 100%); 
    background-image: -o-linear-gradient(top bottom, #ffffff 0%, #f8f8f8 100%); 
    background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#f8f8f8)); 
    background-image: linear-gradient(to bottom,#ffffff,#f8f8f8);}

.gra_lightgrey { border:1px solid #f6f6f6; cursor:pointer; color:#ccc;
    background-image: -webkit-linear-gradient(top bottom, #f6f6f6 0%, #e7e7e7 100%); 
    background-image: -webkit-linear-gradient(top bottom, #f6f6f6 0%, #e7e7e7 100%); 
    background-image: -o-linear-gradient(top bottom, #f6f6f6 0%, #e7e7e7 100%); 
    background-image: -webkit-gradient(linear, left top, left bottom, from(#f6f6f6), to(#e7e7e7)); 

    background-image: linear-gradient(to bottom,#ffffff,#f8f8f8);}
.gra_egrey { cursor:pointer; 
    background-image: -webkit-linear-gradient(top bottom, #efeff7 0%, #e1e1ec 100%); 
    background-image: -webkit-linear-gradient(top bottom, #efeff7 0%, #e1e1ec 100%); 
    background-image: -o-linear-gradient(top bottom, #efeff7 0%, #e1e1ec 100%); 
    background-image: -webkit-gradient(linear, left top, left bottom, from(#efeff7), to(#e1e1ec)); 
    background-image: linear-gradient(to bottom,#efeff7,#e1e1ec);}
.gra_ppb { border:1px solid #2e2e71; cursor:pointer; color:#fff;
    background-image: -webkit-linear-gradient(top bottom, #2e2e71 0%, #1f1f44 100%); 
    background-image: -webkit-linear-gradient(top bottom, #2e2e71 0%, #1f1f44 100%); 
    background-image: -o-linear-gradient(top bottom, #2e2e71 0%, #1f1f44 100%); 
    background-image: -webkit-gradient(linear, left top, left bottom, from(#2e2e71), to(#1f1f44)); 
    background-image: linear-gradient(to bottom,#2e2e71,#1f1f44);}
.gra_red { border:1px solid #ee3128; cursor:pointer; color:#fff;
    background-image: -webkit-linear-gradient(top bottom, #ee3128 0%, #be1911 100%); 
    background-image: -webkit-linear-gradient(top bottom, #ee3128 0%, #be1911 100%); 
    background-image: -o-linear-gradient(top bottom, #ee3128 0%, #be1911 100%); 
    background-image: -webkit-gradient(linear, left top, left bottom, from(#ee3128), to(#be1911)); 
    background-image: linear-gradient(to bottom,#ee3128,#be1911);}
.gra_lightpb { border:1px solid #9191bb; cursor:pointer; color:#fff;
    background-image: -webkit-linear-gradient(top bottom, #a6a6cc 0%, #9191bb 100%); 
    background-image: -webkit-linear-gradient(top bottom, #a6a6cc 0%, #9191bb 100%); 
    background-image: -o-linear-gradient(top bottom, #a6a6cc 0%, #9191bb 100%); 
    background-image: -webkit-gradient(linear, left top, left bottom, from(#a6a6cc), to(#9191bb)); 
    background-image: linear-gradient(to bottom,#a6a6cc,#9191bb);}

.search_reset { border:0; cursor:pointer; 
    background-image: -webkit-linear-gradient(top bottom, #dcdcdc 0%, #cdcdcd 100%); 
    background-image: -webkit-linear-gradient(top bottom, #dcdcdc 0%, #cdcdcd 100%); 
    background-image: -o-linear-gradient(top bottom, #dcdcdc 0%, #cdcdcd 100%); 
    background-image: -webkit-gradient(linear, left top, left bottom, from(#dcdcdc), to(#cdcdcd)); 
    background-image: linear-gradient(to bottom,#dcdcdc,#cdcdcd);}
.search_submit { color:#fff; cursor:pointer; 
    background-image: -webkit-linear-gradient(top bottom, #f25b36 0%, #e74a23 100%); 
    background-image: -webkit-linear-gradient(top bottom, #f25b36 0%, #e74a23 100%); 
    background-image: -o-linear-gradient(top bottom, #f25b36 0%, #e74a23 100%); 
    background-image: -webkit-gradient(linear, left top, left bottom, from(#f25b36), to(#e74a23)); 
    background-image: linear-gradient(to bottom,#f25b36,#e74a23);}

.click { color:#fff; border:0; cursor:pointer;
    background-image: -webkit-linear-gradient(to right, #f47326 0%, #ef4348 100%); 
    background-image: -webkit-linear-gradient(to right, #f47326 0%, #ef4348 100%); 
    background-image: -o-linear-gradient(to right, #f47326 0%, #ef4348 100%); 
    background-image: -webkit-gradient(linear, left left, left right, from(#f47326), to(#ef4348)); 
    background-image:linear-gradient(to right, #f47326 0%, #ef4348 100%);}
.actv { border:0; background-color:#f25c37; color:#fff; font-weight:500; cursor:pointer; }
.actv_navy { background-color:#454962; }


/* 마이페이지_검색박스 */
.search_box { padding:0 20px; background-color:#f8f8f8; }
.search_box li { padding:15px 0; }
.search_box .fixing_area { /*height:15px;*/ font-size:14px; }
.search_box .fixing_area .btn_search_spread { float:right; }
.search_box .fixing_area .btn_search_spread .icon_box { display:inline-block; width:20px; height:20px; margin-left:44px; text-align:center; line-height:20px; background-color:#dddddd; }
.search_box .fixing_area .btn_search_spread .icon_box .im { font-size:12px; }
.search_box .flexible_area { display:none; position:relative; padding:25px 0; }
.inputbtn_style { width:172px; height:35px; line-height:35px; margin-bottom:25px; margin-right:5px; text-align:center; background-color:#fff; border:1px solid #ddd; border-radius:3px; font-size:14px; cursor:pointer; }
.inputbtn_style3 { width:292px; } 
.inputbtn_style.active { border:0; background-color:#f25c37; color:#fff; height:34px; }
.inputbtn_style.search_day { position:relative; margin-right:0; border-right:0; width:140px; border-top-right-radius:0px; border-bottom-right-radius:0px; padding-left:15px; }
.search_calendar { margin-top:1px; width:35px; height:35px;  vertical-align:top; margin-left:-6px; border:1px solid #ddd; border-top-right-radius:3px; border-bottom-right-radius:3px; border-left:0; background-color:#fff;background-image: url('/images/common/calendar.png'); background-repeat:no-repeat; background-position:center center; }
.inputbtn_style.select_box { padding-left:15px; margin-bottom:10px; }
.inputbtn_style.select_box option { padding:0 15px; }
.inputbtn_style.search_title { width:893px; text-align:left; padding:0 15px; margin-bottom:0; cursor:text; }
.inputbtn_style.buttonbtn_style { vertical-align:top; margin-bottom:0; } 
.inputbtn_style.buttonbtn_style .im { margin-bottom:2px; margin-right:3px; padding-bottom:2px; color:inherit; font-size:13px; vertical-align:middle;}
.search_box .flexible_area .btn_center { margin-top:15px; text-align:center; }
.search_box .flexible_area .inputbtn_style.search_reset { border:0; 
    background-image: -webkit-linear-gradient(top bottom, #dcdcdc 0%, #cdcdcd 100%); 
    background-image: -webkit-linear-gradient(top bottom, #dcdcdc 0%, #cdcdcd 100%); 
    background-image: -o-linear-gradient(top bottom, #dcdcdc 0%, #cdcdcd 100%); 
    background-image: -webkit-gradient(linear, left top, left bottom, from(#dcdcdc), to(#cdcdcd)); 
    background-image: linear-gradient(to bottom,#dcdcdc,#cdcdcd);}
.search_box .flexible_area .inputbtn_style.search_submit { color:#fff; 
    background-image: -webkit-linear-gradient(top bottom, #f25b36 0%, #e74a23 100%); 
    background-image: -webkit-linear-gradient(top bottom, #f25b36 0%, #e74a23 100%); 
    background-image: -o-linear-gradient(top bottom, #f25b36 0%, #e74a23 100%); 
    background-image: -webkit-gradient(linear, left top, left bottom, from(#f25b36), to(#e74a23)); 
    background-image: linear-gradient(to bottom,#f25b36,#e74a23);}

/* 테이블 리스트 */

/* 테이블리스트 분류 옵션*/
.body_search { width:100%; padding:10px 0 0 0; margin-bottom:-10px;  overflow:hidden;}
.body_search .select_box { float:left; width:calc(50% - 5px); margin-right:10px; border-radius:5px; color:#777; line-height: 30px; background: url(/images/sub/select_bg2.png) right 0 #fff no-repeat; -webkit-appearance: none;}
.body_search .select_box::-ms-expand{display:none;}
.body_search .select_box:last-child { margin-right:0; }
.body_search .select_box option { color:#777; }
.table_list { width:100%; table-layout:fixed; }
/* 마진 추가 (2019.01.14 17:21 */
.table_list.table_margin { margin:15px 0 0 0; }
.table_list { background-color:#fff; table-layout:fixed; border-top:1px solid #ddd;  }
.table_list tr.br_bottom { border-bottom:1px solid #ddd; }
.table_list tr td { padding-top:15px; }
.table_list tr td:first-child { padding-left:15px; padding-right:5px; }
.table_list tr td:last-child { padding-right:15px; width:108px;} 
.table_list tr td.mentor_emblem_box { padding-right:15px; width:72px;} 
.table_list tr.br_bottom td { padding-bottom:15px; padding-top:10px; font-weight:500; }
.table_list tr td .list_tit { overflow: hidden; text-overflow: ellipsis; display:inline-block; display:inline-flex; line-height:25px; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; word-wrap:break-word; overflow:hidden; font-size:75%; }
.table_list tr td .title_box { text-align:left; height:23px; margin-bottom:5px; }
.table_list.searchlist_table tr td .title_box .label_common { position:relative; bottom:5px; }
.table_list tr td.condition_box { width:97px; text-align:right; }
.table_list tr td.link_box .list_link_btn { float:left; margin-top:0; display:inline-block; height:35px; line-height:35px; font-size:65%; border:1px solid #eaeaea; text-align:center;
    background-image: -webkit-linear-gradient(top bottom, #ffffff 0%, #f8f8f8 100%); 
    background-image: -webkit-linear-gradient(top bottom, #ffffff 0%, #f8f8f8 100%); 
    background-image: -o-linear-gradient(top bottom, #ffffff 0%, #f8f8f8 100%); 
    background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#f8f8f8)); 
    background-image: linear-gradient(to bottom,#ffffff,#f8f8f8);} 
.table_list tr td.link_box .list_link_btn.size1 { width:100%; }
.table_list tr td.link_box .list_link_btn.size2 { width:50%; }
.table_list tr td.link_box .list_link_btn.size3 { width:33.333333333333337%; }
.table_list tr td.link_box .list_link_btn:first-child { border-right:0; }
.table_list tr td.link_box .list_link_btn.disabled { background:#f4f4f4; color:#ccc; }
/*.table_list tr td.link_box .katalk { border:0; background:#2a190c; color:#fff; } 
.table_list tr td.link_box .katalk .im { color:#f7dd2e; font-size:15px; margin-right:4px; margin-top:-2px; vertical-align:middle; }*/
.table_list tr td.link_box .favorite .im { color:#f25c37; font-size:15px; margin-right:4px; padding-bottom:3px; vertical-align:middle; }

.table_list .txt_condition { display:inline-block; font-size:70%; font-weight:600; }
.table_list .txt_condition b { color:#f25c37; }
.table_list .txt_term { display:inline-block; color:#999; font-size:11px; line-height:15px; }
.table_list .txt_dday { margin-bottom:10px; font-size:13px; }
.table_list .txt_payment { margin-top:0; font-size:13px; color:#f25c37; }
.table_list .txt_price { display:inline-block; font-size:12px; line-height:18px; }
.table_list .txt_price small { font-size:12px; font-weight:normal; color:#999; }
.table_list .list_mentor { margin-top:5px; font-size:65%; color:#999; text-align:center; }
.table_list .list_mentor .im { padding-bottom:2px; font-size:13px; color:inherit; vertical-align:middle; } 
.table_list .division_item_name { margin-right:3px; }
.table_list .division_item_name b { overflow:hidden; height:13px; line-height:13px; max-width:70px; margin-bottom:2px; font-weight:600; font-size:13px; vertical-align:middle; text-overflow: ellipsis; display:inline-flex; display: -webkit-inline-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; word-wrap:break-word;}
.table_list .division_item_price { font-size:13px; color:#999; }

/*검색결과 페이지*/
/* 테이블리스트 - 관심등록정보_관심멘토 */
.interest_mentor .list_mentor_big { font-size:75%; font-weight:500; line-height:0px; }
.interest_mentor .list_mentor_big .im { padding-bottom:3px; font-size:100%; color:inherit; vertical-align:middle; } 
.interest_mentor .mentor_emblem_box { width:87px; }
.interest_mentor .title_box .list_txt_box { overflow: hidden; margin-top:5px; font-size:70%; color:#999; text-overflow: ellipsis; display:inline-block; display: -webkit-box; -webkit-line-clamp:2; -webkit-box-orient: vertical; word-wrap:break-word; }
.interest_mentor .title_box .list_txt_box .more_btn { margin-left:3px; text-decoration:underline; }
/* 테이블리스트 - 관심등록정보_관심챌린저 */

/* 
    라벨
    .label_service : 강연VOD몰, 매매기법, 추천종목, VIP종목알리미 등 서비스명
    .label_division34 : 노하우, 마인드, 실전매매 등 3-4글자 기준
    .label_division_item : 보유종목, 관심종목
*/
.label_common { display:inline-block; height:20px; line-height:19px; margin-right:3px; border-radius:3px; text-align:center; font-size:12px;  background-color:#fff; border: 1px solid #ddd; }
.label_icon .im { vertical-align:middle; font-size:23px;}
.label_service { width:auto; min-width:80px; padding:0 2px; background-color:#2a2a65; color:#fff; border:1px solid #2a2a65;}
.label_service_theme { width:120px; background-color:#b71e4e; color:#fff; border:0;}
.label_division67 { width:75px; }
.label_division34 { width:54px; }
.label_division2 { width:40px; }
.label_division_item { display:inline-block; width:60px; height:20px; line-height:18px; font-weight:600; font-size:12px; margin-right:3px; border-radius:3px; text-align:center; }
.label_division_item.interest_item { color:#df0000; background-color:#f8d3ce; }
.label_division_item.stock_item { color:#ff6023; background-color:#ffe8d3; }
.label_new { display:inline-block; width:40px; height:22px; margin-right:3px; line-height:22px; text-align:center; background-color:#f25c37; border-radius:3px; font-size:13px; color:#fff; font-weight:normal;  }

/*play 버튼*/
.play { z-index:2; position:absolute; bottom:10px; right:10px; width:21px; height:21px; line-height:14px; border:2px solid #fff; border-radius:15px; text-align:center; }
.play .im { color:#fff; font-size:13px; padding:0 0 0 3px; }
/* 하이라이트 */
.highlight { z-index:2; position:absolute; bottom:0; right:0; height:28px!important; line-height:28px; margin:10px; width:100px!important; color:#fff!important; background:rgba( 34, 34, 34, 0.6 ); text-align:center; font-size:65%; }
.highlight .im { padding-right:4px; font-size:72%;}
/*멘토엠블럼*/
.mentor_emblem { float:right; }
.mentor_emblem li { position:relative; float:left; width:51px; height:54px; margin-left:3px; }
.mentor_emblem dl { float:right; width:51px; height:51px; margin-top:3px; font-family:BMJUA; color:#fff; font-size:62%; text-align:center; }
.mentor_emblem dl dt { margin-top:10px; line-height:18px; vertical-align:middle; }
.mentor_emblem dl dt b { font-size:120%; font-weight:500; }
.mentor_emblem dd { line-height:18px; text-align:center; vertical-align:middle; opacity:0.8; font-size:83%; font-family:NanumSquareRoundR; color:#fff; }
.mentor_emblem .ranking {  background:linear-gradient(to bottom,#ff3c00,#e00800); }
.mentor_emblem .continuity {  background:linear-gradient(to bottom,#3a2eaf,#0e0879); }
.mentor_emblem .superstock {  background:linear-gradient(to bottom,#620895,#2d0161); }
.mentor_emblem .vertify {  background:linear-gradient(to bottom,#ff7d0a,#ff5a05); }
.mentor_emblem .property {  background:linear-gradient(to bottom,#394a62,#1d293b); }
.mentor_emblem .promote {  background:linear-gradient(to bottom,#1160d7,#073ac1); }
.mentor_emblem .cellebrity {  background:linear-gradient(to bottom,#e14d7d,#c91d44); }
.mentor_emblem .career {  background:linear-gradient(to bottom,#7c394a,#541d29); }
.mentor_emblem .icon { display:block; position:absolute; left:-3px; top:-3px; width:19px; height:19px; border-radius:2px; background-repeat:no-repeat; }
.mentor_emblem .icon.ranking { background-image:url(/images/sub/ic_emblem_ranking.png); }
.mentor_emblem .icon.continuity { background-image:url(/images/sub/ic_emblem_continuity.png); }
.mentor_emblem .icon.superstock { background-image:url(/images/sub/ic_emblem_superstock.png) ; }
.mentor_emblem .icon.vertify { background-image:url(/images/sub/ic_emblem_vertify.png); }
.mentor_emblem .icon.property { background-image:url(/images/sub/ic_emblem_property.png); }
.mentor_emblem .icon.promote { background-image:url(/images/sub/ic_emblem_promote.png); }
.mentor_emblem .icon.cellebrity { background-image:url(/images/sub/ic_emblem_cellebrity.png); }
.mentor_emblem .icon.career { background-image:url(/images/sub/ic_emblem_career.png); }

/*메인_멘토엠블럼(간략)*/
.main_mentor_emblem span { position:relative; padding:5px; font-size:12px; }
.main_mentor_emblem .ranking { color:#e00800; }
.main_mentor_emblem .continuity { color:#0e0879; }
.main_mentor_emblem .superstock { color:#2d0161; }
.main_mentor_emblem .vertify { color:#ff5a05; }
.main_mentor_emblem .property { color:#1d293b; }
.main_mentor_emblem .promote { color:#073ac1; }
.main_mentor_emblem .cellebrity { color:#c91d44;}
.main_mentor_emblem .career { color:#541d29;  }
.main_mentor_emblem .im { padding-bottom:2px; vertical-align:middle; font-size:13px; color:inherit; }

/* 리뉴얼 메인_1200사이즈 탭 */
.tab_1200 { clear:both; width:100%; height:50px; }
.tab_1200.tab_margin { margin:20px 0 50px 0; }
.tab_1200.search_tap li { float:left; width:25%; height:100%; line-height:45px; border:1px solid #ddd; border-right:0; text-align:center; font-size:18px; cursor:pointer; }
.tab_1200 li:last-child { border-right:1px solid #ddd; }
.tab_1200::after { content:""; display:block; clear:both; }

/* 홈_gnb */

.main_gnb { position:relative; margin:0 -15px; height:50px; background-color:#fff; box-shadow:1px 1px 2px #d2d2d2; }
.main_gnb::after { content:""; display:block; clear:both; }
.main_gnb li { float:left; width:25%; height:100%; line-height:50px; }
.main_gnb li:nth-child(2) { margin-left:-8px; }
.main_gnb li.on { border-bottom:2px solid #414082; color:#414082; font-weight:500; box-sizing:border-box; }
.main_gnb li a { display:inline-block; width:100%; height:100%; line-height:50px; text-align:center; color:inherit; font-size:80%;  }
.gnb3 li { width:33.333%!important; }
.gnb2 li { width:50%!important; }

/* 홈_서브 gnb */
.main_sub_gnb { position:relative; width:100%; display:block; padding:10px; background-color:#fff; border-top:1px solid #eaeaea; border-bottom:1px solid #eaeaea; }
.main_sub_gnb button { display:none!important;}
.main_sub_gnb li { float:left; display:inline-block; margin:0 6.5px 0 0; height:30px; color:#999; text-align:left; }
.main_sub_gnb li.on { border:1px solid #414082; color:#414082; font-weight:600; border-radius:15px; text-align:center }
.main_sub_gnb li a { display:inline-block; padding:0 10px; height:100%; line-height:30px; text-align:center; color:inherit; font-size:80%; }
.main_sub_gnb li { font-size:85%; }
.main_sub_gnb li:nth-child(4) { margin-right:0; }
.main_sub_gnb::after { content:""; display:block; clear:both; }

/* 초보투자가이드 gnb */
.step_gnb { position:relative; width:100%; display:block; padding:10px; background-color:#fff; border-top:1px solid #eaeaea; border-bottom:1px solid #eaeaea; }
.step_gnb li { float:left; display:inline-block; width:calc(20% - 4px); margin-right:5px; height:30px; line-height:30px; color:#999; text-align:center; font-size:70%; }
.step_gnb li:last-child { margin-right:0;}
.step_gnb li.on { height:100%; border:1px solid #ee3128; color:#ee3128; font-weight:600; border-radius:15px; text-align:center; }
.step_gnb::after { content:""; display:block; clear:both; }


.edu_value_warp span { display:inline-block; height:25px; line-height:25px; text-align:center; font-size:65%; box-sizing:border-box;}
.edu_value_warp .level_0 { width:40px; border:1px solid #fba62d; color:#fba62d; }
.edu_value_warp .level_1 { width:40px; border:1px solid #f47425; color:#f47425; }
.edu_value_warp .level_2 { width:40px; border:1px solid #950082; color:#950082;}
.edu_value_warp .level_3 { width:40px; border:1px solid #2e2e72; color:#2e2e72; }

.edu_value_warp .value_tit { width:100px; border:1px solid #2a2a65; background-color:#2a2a65; color:#fff; }


/*교육 탭*/
.education.list_tab { width:100%; height:40px; line-height:40px; font-size:70%; background:0; }
.education.list_tab li:first-child { border-left:1px solid #ddd; }
.education.list_tab li { float:left; border:1px solid #ddd; border-left:0px; box-sizing:border-box; background:#fff; text-align:center; }
.education.list_tab li a { display:inline-block; width:100%; height:100%; color:inherit; }
.education.list_tab li.on { background:#ffb606; border:1px solid #ffb606; }
.education.list_tab::after { content:""; display:block; clear:both; }
.education.list_tab2 li { width:50%; }
.education.list_tab3 li { width:33.333%; }
.education.list_tab4 li { width:25%; }