@charset "UTF-8";

/* 스타워즈 메인 아이프레임 (퓨쳐위즈 데이터)  */

/* reset */
html, body {height:100%; -webkit-text-size-adjust:none}
body, div, span, em, strong, select, section, article, nav, footer, header, address, caption, figure, figcaption, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, form, fieldset, p, textarea, input, button, tr, th, td, table {margin:0; padding:0}
body, button, input, select, textarea, table, th, td {color:#222; font-size:12px; font-family:'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', '돋움', Dotum, '굴림', Gulim,  Verdana, Arial, sans-serif; letter-spacing:-0.075em}
h1, h2, h3, h4, h5, h6 {font-size:100%}
ol, ul, li {list-style-type:none}
img, fieldset {border:none}
img, iframe {vertical-align:top}
input, button, select, textarea, label {vertical-align:middle; resize:none}
input, textarea {-webkit-appearance:none; -moz-appearance:none; appearance:none; -webkit-border-radius:0; border-radius:0}
input[type='text']::-ms-clear{display:none}
input[type="checkbox"] {-webkit-appearance:checkbox}
input[type="radio"] {-webkit-appearance:radio}
button, input[type="button"], input[type="submit"], input[type="reset"] {border:none; background-color:transparent; cursor:pointer}
i, em, address, optgroup {font-style:normal}
hr {display:none}
table {width:100%; border-collapse:collapse; border-spacing:0; table-layout:fixed}
header, footer, section, article, aside, nav, hgroup, details, menu, figure, figcaption {display:block}
legend, .hide {position:absolute; width:1px; height:1px; margin:-1px; padding:0; border:none; overflow:hidden; clip:rect(0 0 0 0); color:transparent}
caption {width:0; height:0; font-size:0; line-height:0; text-indent:-99999px; overflow:hidden}
a {color:#222; text-decoration:none}
a:active, a:hover {text-decoration:underline}

.num {letter-spacing:0}

.ellipsis {text-overflow:ellipsis; white-space:nowrap; overflow:hidden}

.up {color:#e63a3a !important}
.down {color:#5e90ff !important}
.hold {color:#777}
.icon {display:inline-block; *display:inline; *zoom:1}

.align_lt {text-align:left !important}
.align_ct {text-align:center !important}
.align_rt {text-align:right !important}

.tblOnly, iframe .area_tblOnly table {width:100%}

.main_section {position:relative; border-top:2px solid #999}
.main_section h2 {padding:14px 0 19px; font-size:18px; letter-spacing:-0.08em}
.main_section .period, .main_section .info {position:absolute; top:18px; right:0}
.main_section .period .date, .main_section .info > span {color:#999; font-size:15px; letter-spacing:0}
.main_section .period .time, .main_section .info > span {margin-left:10px}

.section_starwars_ranking h2 {padding:21px 0 14px; font-size:20px}
.section_starwars_ranking h2 span {font-weight:500}
.section_starwars_ranking .period {top:24px}
.section_starwars_ranking .period .date {color:#f03631; font-size:16px}
.section_starwars_ranking .icon_state {height:19px; margin-left:4px; padding:0 5px; border:1px solid #f03631; color:#f03631; font-size:13px; line-height:19px}
.section_starwars_ranking .icon_state:after {content:''; display:inline-block; width:4px; height:4px; margin-left:3px;border-radius:50%; background-color:#ff5752; vertical-align:3px}
.section_starwars_ranking .period.end .date {color:#999}
.section_starwars_ranking .period.end .icon_state {border-color:#999; color:#999}
.section_starwars_ranking .period.end .icon_state:after {background-color:#999}
.section_starwars_ranking ol:after {content:''; display:block; clear:both}
.section_starwars_ranking li {position:relative; float:right; width:510px; min-height:289px; background-color:#f4f4f6; box-sizing:border-box;} /* 2020.10.06 width 수정 */
.section_starwars_ranking li:first-child {float:left}
.section_starwars_ranking li .profile {margin-top:-4px}
.section_starwars_ranking li .profile .rank {display:inline-block; height:26px; margin-right:5px; padding:0 6px; background-color:#f03631; color:#fff; font-size:13px; line-height:26px; vertical-align:middle}
.section_starwars_ranking li .profile .rank_change {display:inline-block; margin-top:3px; font-size:15px; color:#555; vertical-align: middle;}
.section_starwars_ranking li .profile .rank_change > span {display:inline-block; padding-left:15px; }
.section_starwars_ranking li .profile .rank_change .rank_down {background:url('http://starwars.hankyung.com/resource/images/w/spr_icon_rank.png') no-repeat 0 5px}
.section_starwars_ranking li .profile .rank_change .rank_up {background:url('http://starwars.hankyung.com/resource/images/w/spr_icon_rank.png') no-repeat 0 -26px}
.section_starwars_ranking li .profile .rank_change .hold {padding-left:0}
.section_starwars_ranking li .profile .rank_person {display:inline-block; width:200px; font-weight:bold; font-size:28px; letter-spacing:-2px; vertical-align:middle}
.section_starwars_ranking li .profile .department {display:inline-block; margin:3px 0 0 10px; color:#222; font-size:15px; vertical-align:middle}
.section_starwars_ranking li .yield {margin:16px 0 23px; border-top:1px solid #e3e3e3}
.section_starwars_ranking li .yield:after {content:""; display:block; clear:both}
.section_starwars_ranking li .yield > div {float:left; width:50%}
.section_starwars_ranking li .yield em {display:block; padding-top:17px; font-size:15px}
.section_starwars_ranking li .yield span {font-size:38px; line-height:1.1; letter-spacing:-2px}
.section_starwars_ranking li .thumb {position:absolute; top:36px; right:29px; width:150px; height:140px; border:1px solid #e3e3e3; border-radius:2px; overflow:hidden}
.section_starwars_ranking li .thumb img {width:100%}
.section_starwars_ranking li .btn_go_account {display:inline-block; height:33px; padding:0 17px; border-radius:16px; background-color:#ff6863; color:#fff; font-size:15px; line-height:33px; text-decoration:none; transition:all ease .3s}
.section_starwars_ranking li .btn_go_account:hover {background-color:#f2504b}
.section_starwars_ranking li .thumb_txt_area { padding:35px 200px 0 30px;}
.section_starwars_ranking li .price_condition {padding-left:30px; padding-right:10px; padding-bottom:25px}
.section_starwars_ranking li .price_condition > div {display:inline-block; color:#555; font-size:15px}
.section_starwars_ranking li .price_condition > div + div {position:relative; margin-left:10px; padding-left:18px;}
.section_starwars_ranking li .price_condition > div + div:before {content:""; display:block; position:absolute; top:4px; left:0; width:1px; height:14px; background-color:#999}
.section_starwars_ranking li .price_condition > div strong {margin-left:5px; color:#222}
.section_starwars_ranking li .price_condition > div strong.up {color:#e63a3a}
.section_starwars_ranking li .price_condition > div strong.down {color:#5e90ff}
.section_starwars_ranking li .price_condition .only {margin-top:15px; margin-left:0; padding-left:0}
.section_starwars_ranking li .price_condition .only:before {display:none}
.section_starwars_ranking li .price_condition .only strong {margin-left:20px}

.main_section .transaction_status th {padding:3px 10px 6px; background-color:#f4f4f6; font-weight:normal; font-size:16px; text-align:left}
.main_section .transaction_status td {padding:7px 10px; font-size:15px; word-break:break-all}

.main_section .list_ranking li {margin-top:15px; line-height:31px}
.main_section .list_ranking li .rank {float:left; width:72px; height:31px; margin-right:7px; border-radius:15px; background-color:#b9b9b9; color:#fff; font-weight:bold; font-size:16px; line-height:30px; text-align:center}
.main_section .list_ranking li strong {float:left; margin-right:8px; font-size:20px}
.main_section .list_ranking li .department {float:left; color:#777; font-size:14px}
.main_section .list_ranking li .yield {float:right; font-size:24px}
.main_section .list_ranking li:after {content:''; display:block; clear:both}
.main_section .list_ranking li:first-child {margin-top:0}
.main_section .list_ranking li:first-child .rank {background-color:#ff5752}
.main_section .list_ranking li:first-child .yield {color:#ff5752; font-size:30px}
/* .main_section.section_trade .list_ranking li .rank {border:1px solid #999; background:#fff; color:#999; box-sizing:border-box}
.main_section.section_trade .list_ranking li .yield {float:left; color:#222; font-size:30px}
.main_section.section_trade .list_ranking li .department,
.main_section.section_trade .list_ranking li strong {float:right}
.main_section.section_trade .list_ranking li:first-child .rank {border-color:#ff5752; color:#ff5752} */

/* 누적수익률 */
.main_section.section_starwars_income {border-width:0px}
.main_section.section_starwars_income h2 {padding-bottom:9px}
.section_starwars_income .board_list {z-index:100; border-bottom:1px solid #ccc}
.section_starwars_income .board_list th {padding:7px 8px 4px; border-top:1px solid #ccc; border-bottom:1px solid #efefef; background:#f7f7f7; color:#888; font-weight:normal; line-height:1.6}
.section_starwars_income .board_list td {padding:6px 7px; color:#555; font-size:11px; line-height:1.6; text-align:center}
.section_starwars_income .board_list .sbj {font-size:12px; text-align:left}
.section_starwars_income .board_list .sbj img {margin-right:4px; padding-left:5px; vertical-align:baseline}
.section_starwars_income .board_list a:hover,
.section_starwars_income .board_list .on a {color:#245389; text-decoration:underline}
.section_starwars_income .board_list .writer {font-size:12px; font-family:dotum}
.section_starwars_income .board_list .lft {text-align:left}
.section_starwars_income .board_list .rgt {text-align:right}
.section_starwars_income .board_list .pdf {display:block; overflow:hidden; width:16px; height:16px; margin:0 auto; text-align:left; text-indent:-2000px; background-position:-20px 0; font-size:0}
.section_starwars_income .pdf2 {display:inline-block; overflow:hidden; width:16px; height:16px; margin:0 auto; background-position:-20px 0; font-size:0}
.section_starwars_income .pdf2 span {visibility:hidden}
.section_starwars_income .board_list .fst td {padding-top:20px}
.section_starwars_income .board_list .last td {padding-bottom:20px; margin-bottom:20px; border-bottom:1px dotted #e5e5e5}
.section_starwars_income .board_list td .comment_num {display:inline-block; margin-left:3px; font:11px/16px Dotum; color:#249ac8}
.section_starwars_income .board_list .win { text-align:left; font-size:12px; color:#555}
.section_starwars_income .board_list .txt_overflow {display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis}

/* 누적수익률 */
.section_starwars_income.earningrate_wrap {margin-top:25px}
.section_starwars_income .board_list {border-bottom:1px solid #ccc}
.section_starwars_income .board_list th {color:#777; font-size:14px}
.section_starwars_income .board_list td {color:#222; font-size:14px; letter-spacing:normal;}
.section_starwars_income .board_list .con_name {font-weight:bold; text-align:left}
.section_starwars_income .board_list .down > span {padding-left:13px; background:url('http://starwars.hankyung.com/resource/images/w/arrow_group.png') no-repeat -277px -15px;}
.section_starwars_income .board_list .up > span {padding-left:13px; background:url('http://starwars.hankyung.com/resource/images/w/arrow_group.png') no-repeat -277px 4px;}
.section_starwars_income .board_list .rank_name {font-weight:bold; color:#222;}

/* 탈락자 발생시 */
.section_starwars_income .board_list tr.rank_out {border-top:1px solid #d3d3d3}
.section_starwars_income .board_list tr.rank_out .out {display:inline-block; width:28px; margin-left:5px;color:#fff; font-size:12px; background-color:#f03631; text-align:center}