@charset 'utf-8';

/* reset */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big,
cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, u, center, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption,
footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video
{margin:0; padding:0; border:0; font-size:100%; font:inherit; vertical-align:top;}
/* HTML5 display-role reset for older browsers */
body {width:100%; height:auto; background:#ebebf1;  font-family: "Malgun Gothic" !important;}
ol, ul li {list-style:none;}
table {border-collapse:collapse; border-spacing:0;}
a {text-decoration:none; color: #37383d;}
a:hover {text-decoration:none; color:#37383d;}
img {max-width:100%; height:auto; overflow:hidden;}
button {margin:0; padding:0; border:0; background:none;}
input[type=text]::-ms-clear {display:none;}
textarea {vertical-align:top;}
/* 아이폰 가로모드 텍스트 크기 조정 */
* {-webkit-text-size-adjust:none}
/* 아이폰 라운드, 안쪽 그림자 제거 */

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block;}


.title_notice {font-weight: bold;}
a.title_notice {font-weight: bold;}


/* 가상화폐 거래소 */
.wrap_exchange_group {width: 100%; height: 425px; /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#3a3e6e+1,2f3258+50,161630+100 */ background: #3a3e6e; /* Old browsers */ background: -moz-linear-gradient(top,  #3a3e6e 1%, #2f3258 50%, #161630 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top,  #3a3e6e 1%,#2f3258 50%,#161630 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #3a3e6e 1%,#2f3258 50%,#161630 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3a3e6e', endColorstr='#161630',GradientType=0 ); /* IE6-9 */ overflow: hidden;}
.exchange_group {width: 1090px; height: auto; margin:0 auto; padding-top: 10px;}
.exchange_group::after {content: ''; display: block; clear: both;}
.exchange_group ul.group_list {padding-top: 10px;}
.exchange_group ul.group_list li {width: 350px; height:365px; display: block; float: left;will-change:transform;}
.exchange_group ul.group_list li::after {content: ''; display: block; clear: both;}
.exchange_group ul.group_list li.last {margin: 0;}
.exchange_group ul.group_list li article{ width:350px; height:160px; background: #fff; border-radius: 8px; margin-top:20px; overflow: hidden;}
.exchange_group ul.group_list li .new_icon {width: 15px; height: 15px; border-radius: 3px; display: inline-block; background: #fecf3e; line-height: 15px; text-align: center; font-size: 11px; color: #fff; vertical-align:middle;}

 /* IE10+ */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
 /* Enter your style code */
.exchange_group ul.group_list li article{ width:350px; height:157px; background: #fff; border-radius: 8px; margin-top:20px; overflow: hidden;}
}


/* IE9,10 */
@media screen and (min-width:0\0){
 /* Enter your style code */
.exchange_group ul.group_list li article{ width:350px; height:157px; background: #fff; border-radius: 8px; margin-top:20px; overflow: hidden;}
}

.exchange_group ul.group_list li article:first-child{ margin-top:0; }
.exchange_group ul.group_list li img{ height:50px; }
.exchange_group ul.group_list li .title {width: 100%; padding: 10px 0 0 10px; position: relative;}
.exchange_group ul.group_list li .title i {display: inline-block; vertical-align: middle;}
.exchange_group ul.group_list li .title h2 {display: inline-block; vertical-align: middle; font-weight: bold;}
.exchange_group ul.group_list li ul.text {padding: 10px;}
.exchange_group ul.group_list li ul.text li {height: 19px; margin: 0 0 10px 0; float: none; overflow: hidden; background:none;}
.exchange_group ul.group_list li ul.text li h3 {width: 320px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;font-size: 13px; }
.exchange_group ul.group_list li ul.text li h3:hover {text-decoration: underline;}
.pagination {position: relative;}
.pagination .btn_left_rolling {position: absolute; top: 150px; left: -24px;}
.pagination .btn_right_rolling {position: absolute; top: 150px; right: -24px;}

/* 시간 조절 */
.auto_roll_set {position: relative; float: right;  margin: 5px 16px 0 0;}
.auto_roll_set::after {content: ''; display: block; clear: both;}
.auto_roll_set h4 { margin: 5px; display:block; float: left; font-size: 13px; color: #fff;}
.roll_control_btn {display: block; float: left;}
#control_list { width: 117px; height: 27px; margin: 0; padding: 3px 0 3px 10px; background-color: white;  border: 1px solid #e4e1dc; border-radius: 8px;  display: inline-block;  line-height: 1.5em;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;-webkit-appearance: none;
-moz-appearance: none; background-image:url(/images/icon_open_arrow.png);
background-position:calc(100% - 9px) calc(8px + 2px),calc(100% - 15px) calc(1em + 2px),calc(100% - .5em) .5em;background-repeat: no-repeat;}

/* 커뮤니티 */
.notice_board {width: 800px; height: 280px; display: block; float: left; background: #fff; border-radius: 8px; border: 1px #ededed solid; box-sizing: border-box;}
.notice_board .tab_menu{  width:800px; margin: 0 auto;  position:relative; }
.notice_board .tab_menu ul li{margin-bottom: 10px; float:left;  text-align:left; line-height:1.5;}
.notice_board .tab_menu ul li::after {content: ''; display: block; clear: both;}
.notice_board .tab_menu ul li h3 {width: 540px; display: inline-block; overflow: hidden; text-overflow: ellipsis;  white-space: nowrap; font-size: 14px;}
.notice_board .tab_menu ul li h3:hover {text-decoration: underline;}
.notice_board .tab_menu ul li .writer {width:220px; position: relative; display: block; float: right; text-align: right;}
.notice_board .tab_menu ul li .writer b.name {width:120px; padding-right: 10px; display: inline-block; font-size: 13px; font-style: normal; vertical-align: middle; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;color: #818184; cursor: pointer;}
.notice_board .tab_menu ul li .writer time {display: inline-block;  vertical-align: middle; font-size: 13px; color: #818184;}
.notice_board .writer_info { display: none; position: absolute; top: 22px; left:61px; border: 1px solid rgb(237, 237, 247);  background-color: rgb(255, 255, 255); box-shadow: rgba(142, 134, 134, 0.2) 2px 2px 5px 0px; line-height: 28px; font-weight: 400; font-size: 13px; color: rgb(37, 34, 34);  z-index: 6; }
.notice_board .writer_info a:hover {font-weight: bold;}
.notice_board .tab_menu label{width:100px; height:40px; padding-left: 15px; display:block; line-height:40px; color: #a9a9aa; cursor: pointer;}
.notice_board .tab_menu label:hover {font-weight: bold;}
.notice_board .tab_menu input{display:none;}
.notice_board .tabCon{width: 100%; padding: 15px 20px;display:none;  text-align:left;   border-top: 1px #e0e0e0 solid; box-sizing: border-box;position:absolute; top:40px;  left:0; }
.notice_board .tab_menu input:checked ~ label{font-weight: bold; color: #37383d;}
.notice_board .tab_menu input:checked ~ .tabCon{ display:block;}

/* 블록체인 스케줄 */
.blockchain_schedule {width: 275px; height: 280px; margin-left: 15px; display: block; float: left; background: #fff; border-radius: 8px; border: 1px #ededed solid; box-sizing: border-box;}
.blockchain_schedule .title {height: 40px; border-bottom: 1px #e0e0e0 solid; box-sizing: border-box;}
.blockchain_schedule .title h2 {padding-left: 15px;}
.blockchain_schedule .title h2 a {line-height: 40px; font-weight: bold; color: #37383d;}
.blockchain_schedule h3 {padding: 10px 0 0 15px;; font-weight: bold; color: #37383d;}
.blockchain_schedule ul {padding: 10px 0 5px 10px;}
.blockchain_schedule ul li {margin-bottom: 10px; display: block;}
.blockchain_schedule ul li::after {content: ''; display: block; clear: both;}
.blockchain_schedule ul li span.left {padding: 2px 5px; display: block; float: left; border-radius: 8px; border: 1px #d3d3d3 solid; box-sizing: border-box; font-size: 12px; font-weight: bold; color: #98989d;}
.blockchain_schedule ul li span.right {width: 180px; margin-left: 5px; display: block; float: left; overflow: hidden; text-overflow: ellipsis;  white-space: nowrap;  font-size: 13px;}
.blockchain_schedule ul li span.right:hover {text-decoration: underline;}

/* 코인영상 */
.con_left {width: 800px; height: 285px; display: block; float: left;}
.video_box {width: 800px; height: 250px; margin-top: 15px; background: #fff; border-radius: 8px; border: 1px #ededed solid; box-sizing: border-box; float: left;}
.video_box .title {height: 40px; border-bottom: 1px #e0e0e0 solid; box-sizing: border-box;}
.video_box .title h2 {padding-left: 15px;}
.video_box .title h2 a {line-height: 40px; font-weight: bold; color: #37383d;}
.video_box ul.video_list {margin-left: 20px; padding: 20px; position: relative;}
.video_box ul.video_list li {width: 238px; height: 175px; margin-right: 15px !important; position: relative; will-change:transform;}
.video_box ul.video_list li span.thum {width: 238px; height: 135px; display: block;position: relative; border: 1px #e0e0e0 solid; box-sizing: border-box; overflow: hidden;}
.video_box ul.video_list li span.thum i.play_icon {position: absolute; bottom:10px; left: 10px;}
.video_box ul.video_list li img {width: 100%; height: 100%; -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); -webkit-transition: .8s; -moz-transition: .8s;  -ms-transition: .8s; -o-transition: .8s; transition: .8s;  overflow: hidden;}
.video_box ul.video_list li img:hover { -webkit-transform: scale(1.2); -moz-transform: scale(1.2);
  -ms-transform: scale(1.2); -o-transform: scale(1.2); transform: scale(1.2);}
.video_box ul.video_list li span.text {width: 230px; height: 35px; display: inline-block; font-size: 14px; font-weight: 300; overflow: hidden;}

/* 롤링배너 */
.ad_banner {width: 800px; height: 80px;  background: #fff; border-radius: 8px; border: 1px #ededed solid; box-sizing: border-box; overflow: hidden; margin-bottom: 15px}
.ad_banner li a img {max-width: 100%;}

/* 코인니스  */
.con_right {width: 275px; height: 285px; margin-left: 15px; display: block; float: right; background: #fff; border-radius: 8px; border: 1px #ededed solid; box-sizing: border-box; overflow: hidden;}
.con_right .title {height: 40px; border-bottom: 1px #e0e0e0 solid; box-sizing: border-box;}
.con_right .title h2 {padding: 10px 0 0 15px; }
.con_right .title h2 a {}
ul.coinness_list {position: relative; top: 15px; left: 13px; border-left: 1px #e6e6e7 solid; box-sizing: border-box;}
ul.coinness_list li {padding-bottom: 10px; position: relative; right: 5px;}
ul.coinness_list li article {position: relative;}
ul.coinness_list li article::after {content: ''; display: block; clear: both;}
ul.coinness_list li .time_list {width: 50px; height: 20px; display: block; float: left; border-radius: 8px; border: 1px #98989d solid; box-sizing: border-box; background: #fff; text-align: center; font-size: 10px; font-weight: bold; letter-spacing: -1px; color: #98989d; line-height: 15px;}
ul.coinness_list li h3 {width: 195px; height: 35px;  padding-left: 5px;display: block; float: left; overflow: hidden; font-size: 12px; color: #6f6f72; cursor: pointer;}
ul.coinness_list li h3:hover {text-decoration: underline;}

 /* IE10+ */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
 /* Enter your style code */
    ul.coinness_list li .time_list {width: 50px; height: 20px; display: block; float: left; border-radius: 8px; border: 1px #98989d solid; box-sizing: border-box; background: #fff; text-align: center; line-height: 20px; font-size: 10px; font-weight: bold;     letter-spacing: -1px; color: #98989d;}
}


/* IE9,10 */
@media screen and (min-width:0\0){
 /* Enter your style code */
    ul.coinness_list li .time_list {width: 50px; height: 20px; display: block; float: left; border-radius: 8px; border: 1px #98989d solid; box-sizing: border-box; background: #fff; text-align: center; line-height: 20px; font-size: 12px; font-weight: bold;     letter-spacing: -1px; color: #98989d;}
}


/* 블록스트리트 뉴스 */
.block_street_news {width: 800px; height: 190px; display: block; background: #fff; border-radius: 8px; border: 1px #ededed solid; box-sizing: border-box;}
.block_street_news .title {height: 40px; border-bottom: 1px #e0e0e0 solid; box-sizing: border-box;}
.block_street_news .title h2 {padding: 10px 0 0 15px; }
.block_street_news .title h2 a {}
.block_street_news ul {padding: 20px;}
.block_street_news ul li.news_list_ty01 {height: 110px; margin-right: 10px; display: block; float: left; background: #fcf5ea; border-radius: 8px;}
.block_street_news ul li.news_list_ty01::after {content: ''; display: block; clear: both;}
.block_street_news ul li.news_list_ty01 span.thum {width: 136px; height: 78px; display: block; overflow: hidden;}
.block_street_news ul li.news_list_ty01 span.text {width: 136px; height: 105px; display: block; overflow: hidden; font-size: 14px; font-weight: bold; color: #37383d;}
.block_street_news ul li.news_list_ty01 span.text h3 {margin: 12px; vertical-align: middle;}
.block_street_news ul li.news_list_ty01 a:hover {text-decoration: underline;}
.block_street_news ul li.news_list_ty02 {width: 305px; margin-top: 15px; display: block; float: left;}
.block_street_news ul li.news_list_ty02 article {margin-bottom: 10px;}
.block_street_news ul li.news_list_ty02 article a:hover {text-decoration: underline;}
.block_street_news ul li.news_list_ty02 span.text h3{width: 305px;height: 20px; display: block; font-size:  14px; overflow: hidden; text-overflow: ellipsis;white-space: nowrap;}

/* 코인가맹점 */
.franchisee_list {width: 275px; height: 190px; margin-left: 15px; display: block; float: left; background: #fff; border-radius: 8px; border: 1px #ededed solid; box-sizing: border-box;}
.franchisee_list .title {height: 40px; border-bottom: 1px #e0e0e0 solid; box-sizing: border-box;}
.franchisee_list .title h2 {padding-left: 15px;}
.franchisee_list .title h2 a {line-height: 40px; font-weight: bold; color: #37383d;}
ul.franchisee {padding: 15px 10px;}
ul.franchisee::after {content: ''; display: block; clear: both;}
ul.franchisee li {width: 119px ; height: 119px; margin-right: 10px; display: block; float: left; background: #f6f6f7; border-radius: 8px;}
ul.franchisee li:hover {background-color: #fcf5ea;}
ul.franchisee li:last-child {margin: 0;}
ul.franchisee li i {margin-top: 15px; display: block; text-align: center;}
ul.franchisee li span.text {margin-top: 5px; display: block; text-align: center; font-size: 14px;}

/* 코인시세표 */
.quotation_list {width: 100%; height: 278px; background: #fff; border-radius: 8px; border: 1px #ededed solid; box-sizing: border-box;}
.quotation_list .tab_menu01{  width:100%; margin: 0 auto;  position:relative; }
.quotation_list .tab_menu01 ul li{margin-bottom: 10px; float:left;  text-align:left; line-height:1.5;}
.quotation_list .tab_menu01 ul li::after {content: ''; display: block; clear: both;}
.quotation_list .tab_menu01 ul li h3 {width: 540px; display: inline-block; overflow: hidden; text-overflow: ellipsis;  white-space: nowrap; font-size: 14px;}

.quotation_list .tab_menu01 label{width:56px; height:40px; padding-left: 15px; display:block; line-height:40px; text-align: center; color: #a9a9aa; cursor: pointer;}
.quotation_list .tab_menu01 label:hover {font-weight: bold;}
.quotation_list .tab_menu01 input{display:none;}
.quotation_list .tab_menu01 input:checked ~ label{font-weight: bold; color: #37383d;}
.quotation_list .tab_menu01 input:checked ~ .tabCon01{ display:block;}
.quotation_list .tab_menu01 .tabCon01 {width: 100%; display:none;  text-align:left;   border-top: 1px #e0e0e0 solid; box-sizing: border-box;position:absolute; top:40px;  left:0; }
.quotation_list .tab_menu01 .tabCon01 table {width: 100%;}
.quotation_list .tab_menu01 .tabCon01 table thead th {height: 25px; background: #f9f9f9; text-align: center; vertical-align: middle; font-size: 12px; color: #97989b;}
.quotation_list .tab_menu01 .tabCon01 table tbody td {height: 42px; border-bottom: 1px #f0f0f0 solid; box-sizing: border-box; text-align: center; vertical-align: middle; font-size: 12px; color: #37383d;}
.quotation_list .tab_menu01 .tabCon01 table tbody td span.gly {color: #a9a9aa;}
.quotation_list .tab_menu01 .tabCon01 table tbody td span.red, .quotation_list .tab_menu01 .tabCon01 table tbody td span.red_none{color: #db1717;}
.quotation_list .tab_menu01 .tabCon01 table tbody td span.blu, .quotation_list .tab_menu01 .tabCon01 table tbody td span.blu_none{color: #1534d4;}
.quotation_list .tab_menu01 .kr_won{ display:none; }


.go_all_list{ position:absolute; right:20px; top:12px; }
.go_all_list a{ font-size:12px; }
.go_all_list a:hover{ font-weight:bold; }


/* 채팅 */
.main-chat-wrap{ width:275px; float:right; }
.chat-wrap{ width:100%; background-color:#FFF; border-radius:10px; overflow:hidden; border:1px #ededed solid; }
.main-chat-wrap .chat-wrap{ position:relative; }
.chat-box{ width: 100%; position:relative; z-index:1; }
.chat-header{ width: 100%; height: 40px; line-height: 40px; padding:0 10px; border-bottom:1px solid #e0e0e0; box-sizing:border-box; }
.chat-logo{ float: left; cursor:pointer; box-sizing:border-box; }
.chat-logo .logo-img{ width:80px; vertical-align:middle; }
.chat-logo .btn-minimiz{ background:none; border:none; vertical-align:middle; margin-left:5px; }
.chat-logo .btn-minimiz img{ vertical-align:middle; }
.chat-user{ float: right; }
.chat-user{ max-width:140px; white-space: nowrap; text-overflow:ellipsis; overflow:hidden; }
.chat-user span{ font-size:14px; font-weight:700; color:#000; cursor:pointer; border-bottom:1px solid #000; padding-bottom:5px; }
.chat-body{ width:100%; height:462px; box-sizing:border-box; }
#message-list{ width: 100%; height: 100%; -ms-overflow-style: none; overflow-y:auto; overscroll-behavior-y: contain; box-sizing:border-box; padding:0 10px 10px 10px; }
#message-list::-webkit-scrollbar { width: 7px; overscroll-behavior-y: contain; }
#message-list::-webkit-scrollbar-thumb { height: 30%; background: #d9b070; }
#message-list::-webkit-scrollbar-track { background: rgba(0, 0, 0, .1); }
/*#message-list::-webkit-scrollbar { display: none; width: 0 !important; overscroll-behavior-y: contain; }*/
#message-list li{ font-size:13px; font-weight:500; margin-top:5px; position:relative; }
.message-form{ border-top:1px solid #eee; position:relative; }
.message-form #message{ width:100%; height:40px; padding:0 45px 0 15px; outline:none; border:none; box-sizing:border-box; }
.message-form .btn-submit{ position:absolute; right:15px; top:50%; margin-top: -10px; background-image:url("/images/icon_send.png"); text-indent: -9999px !important; border:none; background-color:transparent; width:20px; height:20px; background-position:center center; background-size:cover; cursor:pointer; }
.send-user{ width:100%; font-size:13px; font-weight:700; color:#000; margin:10px 0 0 0; }
.send-message{ max-width:210px; padding:5px; background-color:#F4F4F4; font-size:12px; color:#000; display:inline-block; margin:5px 0 0 0; border-radius:5px; box-sizing:border-box; position:relative; word-break:break-all; }
.send-time{ width:30px; font-size:12px; margin-left:5px; vertical-align:bottom; display:inline-block; }
.scroll-bottom{ width: 30px; height: 30px; border-radius:50%; position:absolute; bottom:50px; right:10px; overflow:hidden; z-index:12; background-color:#F69745; text-align:center; display:none; }
.scroll-bottom button{ width: 100%; height: 100%; background:none; border:none; cursor:pointer; }
.scroll-bottom button img{ vertical-align:middle; }
.chat-delete{ position:absolute; right:-23px; bottom:15px; background-color:#FFF; border-radius:50%; border: 1px solid #DEDEDE;width: 20px;height: 20px;font-size: 11px;font-weight: bold;cursor: pointer;color: #a9a9aa;vertical-align: middle;text-align: center;}