@charset "utf-8";
/*

[ 기준 색상 코드 ]
주조색(보라)
	배경 : #4b3863
	텍스트 : #765d95
보조색(민트)
	배경 : #00becc
	텍스트 : #00becc
hover 연한 배경색 : #f6f6f6, #f1f1f1
line : #ddd, #ccc

*/

/* ----- S : layout ----- */
.wrap_pop.clean_word { min-width: 1200px; }
/*.wrap_pop2 { min-width: 1200px; }*/
.pop_body { position: absolute; top: 50px; bottom: 0; left: 0; right: 0; padding: 30px; box-sizing: border-box; }
.pop_body.keyword { min-width: 1200px; }
.scrollarea { position: relative; height: 100%; }
.scrollarea.ttab { height: calc(100% - 260px); }
.scrollarea.edit { height: calc(100% - 176px); }
.scrollarea.cont_tab1 { height: calc(100% - 74px); }
.scrollarea.sentiment2 { height: calc(100% - 92px); }
.scrollarea.sentiment3 { height: calc(100% - 126px); }
.scrollarea.sentiment4 { height: calc(100% - 198px); }
.scrollarea.sentiment_ttab { height: calc(100% - 240px); }
.wrap_scroll { position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin-top: 10px; overflow: hidden; overflow-y: auto; }
/* ----- E : layout ----- */


.table_scroll::-webkit-scrollbar { width: 8px; }
.table_scroll::-webkit-scrollbar-thumb { background: rgba(0,0,0,.2); }





/* heading */
h1 { line-height: 50px; color: #01ccdb; background: #3d2d51; text-align: center; font-size: 18px; font-family: 'NanumSquareRound'; font-weight: 700; }
h1 em { color: #ddd; font-size: 16px; font-weight: 400; }
h1 a { float: right; width: 50px; height: 50px; color: #ddd; border-left: 1px solid #765b93; }
h1 a:hover { color: #fff; background-color: rgba(255,255,255,0.1); }
h1 a > i.fa-times { line-height: 50px; font-size: 20px; }
h2 { padding-bottom: 10px; font-size: 15px; font-weight: 700; }
h3 { }
h4 { }
h5 { float: left; width: 110px; font-size: 14px; font-weight: 700; }
h5 span { display: inline-block; line-height: 20px; }
h6 { float: left; color: #333; margin-right: 10px; line-height: 20px; text-align: left; vertical-align: middle; font-size: 14px; font-weight: 700; font-family: 'Nanum Gothic'; }



/* color */
.t_pink { color: #c937e4; } /* d669ea */
.t_ppurple { color: #ab69ea; } /* ab69ea */
.t_purple { color: #8569de; } /* 8569de */
.t_blue { color: #407ee2; } /* 407ee2 */
.t_mint { color: #65cfec; } /* 57c5e3 */
.t_dmint { color: #29b9c6; }


/* common */
.boxcont { position: relative; float: left; width: 100%; line-height: 34px; padding: 30px 0; border-top: 1px solid #aaa; }
.boxcont.tline { border-top: 2px solid #765d95; }
.boxcont.noline { padding: 0; }
.boxcont.mb0 { margin-bottom: 0; }
.wrap_boxcont { float: left; width: calc(100% - 110px); vertical-align: top; }
.wrap_boxcont .rtop { position: absolute; top: 30px; right: 0; }
.wrap_boxcont ul li { float: left; margin-right: 30px; line-height: 24px; }
.wrap_boxcont ul li:last-of-type { margin-right: 0; }
.wrap_boxcont ul li.line { line-height: 36px; }
.wrap_boxcont .detail { display: inline-block; width: 100%; }
.wrap_boxcont .detail ul { float: left; width: calc(50% - 30px); margin-top: 12px; padding-top: 12px; border-top: 1px dashed #eee; }
.wrap_boxcont .detail ul:first-of-type { margin-top: 0; padding-top: 0; border-top: 0; }
.wrap_boxcont .detail ul:nth-of-type(even) { clear: both; }
.wrap_boxcont .detail ul:nth-of-type(2n+3) { padding-left: 60px; }
.wrap_boxcont .detail ul.w100p { float: none; width: 100%; }
.wrap_boxcont .detail ul li:first-child { width: 100%; }
.wrap_boxcont .detail ul li:first-child h6 { width: 100%; margin-left: 0; padding: 0 0 0 12px; box-sizing: border-box; }
.wrap_boxcont .detail ul li:first-child h6::before { top: 5px; }
.wrap_boxcont .detail ul li label { padding-left: 22px; text-indent: -22px; line-height: 20px; }
.wrap_boxcont .keyword_input input[type="text"] { display: block; width: 100%; margin-bottom: 4px; vertical-align: top; }
.wrap_boxcont .keyword_input input[type="text"]:first-of-type { display: inline-block; }
.wrap_boxcont .keyword_input input[type="text"].keyw_input_confirm { width: calc(100% - 72px); }

.nodata_dpreview { clear: both; height: calc(100% - 190px); color: #765d95; background: #f4f4f4; text-align: center; letter-spacing: 0; border-top: 2px solid #765d95; box-sizing: border-box; }
.nodata_dpreview > div { position: relative; top: 50%; transform: translateY(-60%) }
.nodata_dpreview .loader { right: 0; }



/* sub */
.guide { display: block; clear: both; color: #00a1ad; line-height: 20px; font-size: 13px; letter-spacing: 0; }
.guide em { color: #777; }
.guide b { text-decoration: underline; font-weight: 400; font-style: normal; }

/* area */
.changearea {  padding: 16px 12px;  border: 1px solid #ccc;  border-top: 2px solid #3d2d5f;clear: both; }
.wrap_change { width: 100%; margin: 0 auto; text-align: left; }

.search_input { display: inline-block; width: 100%; }
.search_input select { float: left; margin-right: 4px; }
.changearea .search_input  input[type="text"] { width: 45%; }
.wrap_change .left { display: inline-block; width: 50%; }

.wrap_change .left > i { line-height: 34px; }
.wrap_change .right { float: right; width: 50%; }
.changearea input[type="text"] { width: 70%; vertical-align: top; }
.changearea .fa-long-arrow-alt-right { width: calc(30% - 42px); color: #765d95; text-align: center; vertical-align: middle; font-size: 22px; }
.changearea a.add { display: inline-block; line-height: 32px; color: #aaa; background: #f1f1f1; margin-left: 4px; padding: 0px 10px; vertical-align: top; border: 1px solid #ddd; border-radius: 3px; }
.changearea .violet { width: calc(30% - 6px); margin-left: 4px; box-sizing: border-box; }
.addarea span { display: block; margin-top: 4px; }
.changearea.dict { margin-top: 20px; }
.changearea.dict .fa-long-arrow-alt-right { width: calc(30% - 6px); }

.btnarea_nav { text-align: right; }
.btnarea_nav a i { margin: 0; padding: 0 5px; vertical-align: middle; font-size: 14px; }
.btnarea_nav a em { font-size: 0; text-indent: -9999px; }
.btnarea_sample { display: block; }
.btnarea_sample a { color: #777; font-size: 13px; }
.btnarea_sample a:hover { color: #765d95; text-decoration: underline; }
.btnarea_sample a:before { content: ','; padding-right: 10px; }
.btnarea_sample a:first-of-type:before { display: none; }
.btnarea_sample i.fas { margin-right: 4px; }

.search_input { display: inline-block; width: 500px; }
.search_input input[type="text"] { float: left; width: 200px; border-right: 0; border-top-right-radius: 0; border-bottom-right-radius: 0; }
.search_input a { float: left; line-height: 32px; color: #ccc; padding: 0 10px; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; border-right: 1px solid #ddd; border-top-right-radius: 3px; border-bottom-right-radius: 3px; }
.search_input span { float: left; line-height: 34px; color: #333; margin-left: 10px; font-weight: 700; }
.search_input span b { color: #00becc; margin-left: 8px; font-weight: 800; }
.search_input span b::after { content: '/'; display: inline-block; color: #ccc; padding: 0 3px 0 6px; font-weight: 400; } 
.list_view { float: right; }
.list_view .fa-bars { float: left; line-height: 34px; margin-right: 6px; vertical-align: middle; }
.list_view select { float: left; }

.btnarea_visual { width: 923px; margin: 10px auto; }
.btnarea_visual .guide { line-height: 17px; }


/* box */
.box_basic { width: 100%; background: #f6f6f6; padding: 20px; line-height: 26px; border: 1px solid #ddd; border-radius: 3px; box-sizing: border-box; }
.box_basic .alink { color: #777; padding: 3px 7px; font-weight: 700; }
.box_basic .alink:hover { text-decoration: underline; }
.box_basic h2.ctop { margin: -10px 0 16px 0; text-align: center; border-bottom: 1px solid #ddd; }
.box_basic .detail { display: inline-block; width: 100%; }
.box_basic .detail ul { float: left; width: calc(50% - 30px); margin-top: 16px; }
.box_basic .detail ul:first-of-type { margin-top: 0; padding-top: 0; border-top: 0; }
.box_basic .detail ul:nth-of-type(even) { clear: both; }
.box_basic .detail ul:nth-of-type(2n+3) { padding-left: 60px; }
.box_basic .detail ul.w100p { float: none; width: 100%; }
.box_basic .detail ul li { float: left; margin-right: 30px; line-height: 24px; }
.box_basic .detail ul li:first-child { width: 100%; }
.box_basic .detail ul li:last-of-type { margin-right: 0; }
/* .box_basic .detail ul li:first-child h6 { position: relative; width: 100%; margin-left: 0; padding: 0 0 0 12px; box-sizing: border-box; } */
/* .box_basic .detail ul li:first-child h6::before { content: ''; position: absolute; left: 0; top: 5px; width: 4px; height: 7px; background: url('/html_analysis/images/common.png') -82px top no-repeat; } */
.box_basic .detail ul li label { /* padding-left: 22px; text-indent: -22px; */ line-height: 20px; }
.box_basic .detail ul li input[type="checkbox"]:checked + label { color: #ab69ea; font-weight: 700; }
.boxcont_data { line-height: 20px; padding: 30px 0; border-bottom: 1px solid #ddd; }
.boxcont_data:first-of-type { padding-top: 0; }
.boxcont_data a,
.boxcont_data span { display: block; word-break: break-all; }
.boxcont_data .tit { color: #765d95; font-size: 14px; font-weight: 700; }
.boxcont_data .cont { color: #777; }
.boxcont_data .url { color: #00a1ad; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; }


/* tab */
.tab01 { width: 100%; line-height: 50px; background: #f6f6f6; margin-left: -30px; padding: 0 30px; border-top: 1px solid #ddd; border-bottom: 1px solid #ccc; }
.tab01 a { display: inline-block; position: relative; color: #777; margin-right: 30px; padding: 0 1px; font-size: 15px; font-family: 'NanumSquareRound'; }
.tab01 a:last-of-type { margin-right: 0; }
.tab01 a:hover { color: #00a1ad; }
.tab01 a.on { color: #333; font-weight: 700; border-bottom:2px solid #00becc; }
.tab01 a.accent::after { content: ''; display: inline-block; position: absolute; top: 10px; right: -10px; width: 6px; height: 6px; background: #00becc; border-radius: 6px; }
.tab02 { float: left; width: 100%; }
.tab02 a { float: left; color: #777; background: #f6f6f6; padding: 16px 30px; text-align: center; font-size: 15px; font-family: 'NanumSquareRound'; border: 1px solid #ccc; border-bottom: 1px solid #765d95; box-sizing: border-box; }
.tab02 a:first-of-type { border-top-left-radius: 3px; }
.tab02 a:last-of-type { border-top-right-radius: 3px; }
.tab02 a.on { position: relative; color: #765d95; background: #fff; font-weight: 700; border: 1px solid #765d95; border-bottom: 1px solid #fff; }
.tab02 a:hover { color: #765d95; background: #f1f1f1; }
.tab02 a.on:hover { background: #fff; }
.tab02 a em { color: #777; font-size: 13px; font-weight: 400; }
.tab02.count2 a { width: 50%; }
.tab02.count5 a { width: 20%; height: 48px; overflow: hidden; }
.tab03 { line-height: 40px; }
.tab03 a { display: inline-block; position: relative; color: #777; margin-right: 40px; }
.tab03 a:last-of-type { margin-right: 0; }
.tab03 a:hover { color: #00a1ad; }
.tab03 a.on { color: #00a1ad; font-weight: 700; }
.tab03 a::after { content: ''; display: inline-block; position: absolute; top: 15px; right: -21px; width: 1px; height: 10px; background: #ddd; }
.tab03 a:last-of-type::after { content: none; }

.tab01_cont,
.tab02_cont { display: none; width: 100%; background: #fff; padding-top: 10px; }
.tab01_cont.on,
.tab02_cont.on { display: inline-block; }
.tab01_cont.ttab,
.tab02_cont.ttab { height: calc(100% - 170px); }
.tab01_cont.edit { height: calc(100% - 207px); }
.tab01_cont.ttab form,
.tab02_cont.ttab form,
.tab01_cont.edit form,
.tab02_cont.edit form { height: 100%; }


/* table */
.tbl01 { width: 100%; border-top: 2px solid #765d95; }
.tbl01 input[type="checkbox"] + label span { margin: 0; }
.tbl01 th { line-height: 14px; background: #fff; padding: 10px; text-align: center; font-weight: 700; border-bottom: 1px solid #aaa; }
.tbl01 th em { font-size: 11px; font-weight: 400; }
.tbl01 td { line-height: 14px; background: #fff; padding: 10px; border-bottom: 1px solid #ddd; border-right: 1px solid #ddd; line-height: 18px; }
.tbl01 td:last-of-type { border-right: 0; }
.tbl01 tr:last-of-type td { border-bottom: 0; }
.tbl01 tr:hover td { background: #f6f6f6; }
.tbl01 tr.checked td { background: #f6f6f6; }
.tbl01 tr.checked:hover td { background: #f1f1f1; }
.tbl01 td.no_list { width: 100%; background: #f6f6f6; padding: 40px 10px; text-align: center; }



.table_scroll .tbl01 { border-top: 0; }

/* frequency */
.tbl01.frequency th:nth-child(1),
.tbl01.frequency td:nth-child(1) { width: 6%; text-align: center; } /* checkbox */
.tbl01.frequency th:nth-child(2),
.tbl01.frequency td:nth-child(2) { width: 40%; color: #765d95; font-weight: 700; } /* keyword */
.tbl01.frequency th:nth-child(3),
.tbl01.frequency td:nth-child(3) { width: 18%; text-align: center; } /* frequency */
.tbl01.frequency th:nth-child(4),
.tbl01.frequency td:nth-child(4) { width: 18%; text-align: right; } /* percent */
.tbl01.frequency th:nth-child(5),
.tbl01.frequency td:nth-child(5) { width: 18%; text-align: right; } /* cumulative */
/* TF-IDF */
.tbl01.tfidf td:nth-child(1) { width: 6%; text-align: center; } /* checkbox */
.tbl01.tfidf td:nth-child(2) { width: 54%; color: #765d95; font-weight: 700; } /* keyword */
.tbl01.tfidf td:nth-child(3) { width: 40%; text-align: right; } /* TF-IDF */
/* dictionary list */
.tbl01.dict td { color: #aaa; }
.tbl01.dict th:nth-child(1),
.tbl01.dict td:nth-child(1) { width: 6%; text-align: center; } /* checkbox */
.tbl01.dict th:nth-child(2),
.tbl01.dict td:nth-child(2) { width: 32%; } /* change word */
.tbl01.dict th:nth-child(3),
.tbl01.dict td:nth-child(3) { width: 32%; } /* word */
.tbl01.dict th:nth-child(4),
.tbl01.dict td:nth-child(4) { width: 20%; text-align: center; } /* date */
.tbl01.dict th:nth-child(5),
.tbl01.dict td:nth-child(5) { width: 10%; text-align: center; padding: 13px 0 10px 0; } /* used */
.tbl01.dict td i { color: #ccc; font-size: 24px; cursor: pointer; }
.tbl01.dict tr.used td { color: #333; }
.tbl01.dict tr.used td i { color: #00becc; }
.tbl01.dict tr.checked td { background: #f6f6f6; border-top: 0; border-bottom: 1px solid #ddd; }
.tbl01.dict tr.checked td:first-child { border-left: 0; }
.tbl01.dict tr.checked td:last-child { border-right: 0; }
.tbl01.dict tr.checked:hover td { background: #f1f1f1; }
/* dictionary group list */
.tbl01.dict_group td { line-height: 34px; padding: 5px 10px; border-right: 0; }
.tbl01.dict_group td:nth-child(1) { width: 6%; text-align: center; } /* checkbox */
.tbl01.dict_group td:nth-child(2) { width: 94%; } /* group name */
.tbl01.dict_group td input[type="text"] { width: 100%; }
.tbl01.dict_group tr.checked td { background: #f6f6f6; border-top: 0; border-bottom: 1px solid #ddd; }
.tbl01.dict_group tr.checked td input[type="text"] { background: #f6f6f6; }
.tbl01.dict_group tr.checked td:first-child { border-left: 0; }
.tbl01.dict_group tr.checked td:last-child { border-right: 0; }
.tbl01.dict_group tr.checked:hover td { background: #f1f1f1; }

.wrap_pop2 .tbl02 { width: 923px; margin: 0 auto; }
.tbl02 { width: 100%; text-align: center; border-top: 1px solid #aaa; font-size: 14px; }
.tbl02 th { line-height: 14px; background: #f6f6f6; padding: 10px; font-weight: 700; border-bottom: 1px solid #aaa; }
.tbl02 th:first-child { border-left: 1px solid #aaa; }
.tbl02 th:last-child { border-right: 1px solid #aaa; }
.tbl02 th em { font-size: 11px; font-weight: 400; }
.tbl02 td { line-height: 14px; background: #fff; padding: 10px; border-bottom: 1px solid #ddd; border-right: 1px solid #ddd; }
.tbl02 td:first-child { border-left: 1px solid #ddd; }
.tbl02 td strong { color: #00becc; font-weight: 800; }
.tbl02 td strong.red { color: #e74a2b; font-weight: 700; }
.tbl02 td strong.blue { color: #0a75de; font-weight: 700; }
.tbl02 tr.bgcolor td { background: #f6f6f6; }

/* selected list */
.tbl02.selectlist td:nth-child(1) { width: 50%; color: #765d95; font-weight: 700; } /* keyword */
.tbl02.selectlist td:nth-child(2) { width: 15%; } /* date */
.tbl02.selectlist td:nth-child(3) { width: 15%; } /* volume */
.tbl02.selectlist td:nth-child(4) { width: 20%; } /* file */
/* collect channel info */
.tbl02.chinfo td:nth-child(1) { width: 25%; } /* channel */
.tbl02.chinfo td:nth-child(2) { width: 40%; } /* section */
.tbl02.chinfo td:nth-child(3) { width: 35%; } /* info */
.tbl02.chinfo td:first-child { border-left: 0; }
.tbl02.chinfo td:nth-child(1)[rowspan],
.tbl02.chinfo td.linel { border-left: 1px solid #ddd; }
/* sentiment */
.tbl02.sentiment td:nth-child(1) { width: 20%; background: #f6f6f6; font-weight: 700; } /* sentiment */
.tbl02.sentiment td:nth-child(2) { width: 40%; text-align: right; } /* frequency */
.tbl02.sentiment td:nth-child(3) { width: 40%; text-align: right; } /* percent */
/* mecabko */
.tbl02.mecabko th,
.tbl02.mecabko td { line-height: 18px; }
.tbl02.mecabko th.linel { border-left: 1px solid #aaa; }
.tbl02.mecabko thead th,
.tbl02.mecabko tbody th { border-left: 0; border-right: 1px solid #aaa; }
.tbl02.mecabko td:first-of-type { border-left: 0; }
.tbl02.mecabko thead tr:first-child th:nth-child(1),
.tbl02.mecabko tbody tr:first-child td:nth-child(1) { width: 13%; }
.tbl02.mecabko thead tr:first-child th:nth-child(2),
.tbl02.mecabko tbody tr:first-child td:nth-child(2) { width: 15%; }
.tbl02.mecabko tbody tr:first-child td:nth-child(3) { width: 11%; }
.tbl02.mecabko tbody tr:first-child td:nth-child(4) { width: 25%; }
.tbl02.mecabko tbody tr:first-child td:nth-child(5) { width: 11%; }
.tbl02.mecabko tbody tr:first-child td:nth-child(6) { width: 25%; }

.tbl03 { width: 100%; }
.tbl03 td { line-height: 18px; background: #fff; padding: 8px 10px; text-align: left; border-bottom: 1px dashed #ddd; }
.tbl03 tr:first-of-type td { border-top: 0; }
.tbl03 tr:hover td { background: #f6f6f6; }
.tbl03.tblword { /* white-space: pre-wrap;  */word-break: break-word; }

.tbl04 { width: 100%; text-align: center; border-top: 1px solid #aaa; }
.tbl04 th { line-height: 14px; background: #f9f9f9; padding: 10px; font-weight: 700; border-bottom: 1px solid #aaa; }
.tbl04 th em { font-size: 11px; font-weight: 400; }
.tbl04 td { line-height: 18px; background: #fff; padding: 10px; border-bottom: 1px solid #ddd; border-right: 1px solid #ddd; }
.tbl04 td:last-child { border-right: 0; }
.tbl04 tr:hover td { background: #f6f6f6; }
.tbl04 td a { color: #765d95; font-weight: 700; text-decoration: underline; }
/* term frequency */
.tbl04.termf td:nth-child(1) { width: 25%; } /* word */
.tbl04.termf td:nth-child(2) { width: 25%; text-align: right; } /* term frequency */
.tbl04.termf td:nth-child(3) { width: 25%; text-align: right; } /* percentage */
.tbl04.termf td:nth-child(4) { width: 25%; text-align: right; } /* acumulation rate */
/* n-gram */
.tbl04.ngram td:nth-child(1) { width: 35%; } /* word1 */
.tbl04.ngram td:nth-child(2) { width: 35%;} /* word2 */
.tbl04.ngram td:nth-child(3) { width: 30%; text-align: right; } /* Frequency */
/* tfidf */
.tbl04.tfidf td:nth-child(1) { width: 60%; } /* word */
.tbl04.tfidf td:nth-child(2) { width: 40%; text-align: right; } /* tfidf */
/* sentiment */
.tbl04.sentiment td:nth-child(1) { width: 80%; text-align: left; } /* sentence */
.tbl04.sentiment td:nth-child(2) { width: 20%; } /* result */
.tbl04.sentiment_word td:nth-child(1) { width: 40%; text-align: left; } /* word */
.tbl04.sentiment_word td:nth-child(2) { width: 30%; text-align: right; } /* frequency */
.tbl04.sentiment_word td:nth-child(3) { width: 30%; text-align: right; } /* percent */
/* word class */
.tbl04.wordc td { width: 50%; text-align: left; }
.tbl04.wordc tr:hover td { background: none; }
.tbl04.wordc td strong { color: #00becc; font-weight: 800; }

.tbl04.topic td:nth-child(1) { width: 15%; } /* word1 */
.tbl04.topic td:nth-child(2) { width: 20%;} /* word2 */
.tbl04.topic td:nth-child(3) { width: 65%; } /* Frequency */

.tbl05 { width: 100%; text-align: center; border-top: 1px solid #aaa; }
.tbl05 th { line-height: 14px; background: #f9f9f9; padding: 10px; font-weight: 700; border-bottom: 1px solid #ddd; border-right: 1px solid #ddd; }
.tbl05 th:last-child { border-right: 0; }
.tbl05 th em { font-size: 11px; font-weight: 400; }
.tbl05 td { line-height: 16px; background: #fff; padding: 10px; border-bottom: 1px solid #ddd; border-right: 1px solid #ddd; }
.tbl05 td:last-child { border-right: 0; }
.tbl05 tr:last-of-type th,
.tbl05 tr:last-of-type td { border-bottom: 1px solid #aaa; }
.tbl05 td a { color: #765d95; font-weight: 700; text-decoration: underline; }
/* Topic Modeling edit */
.tbl05.topic_edit td:nth-child(1) { width: 35%; } /* word */
.tbl05.topic_edit td:nth-child(2) { width: 65%; } /* term frequency */
.tbl05.topic_edit tr:hover td { background: #fff; }
/* nodata */
.tbl01 td:nth-child(1).nodata,
.tbl02 td:nth-child(1).nodata,
.tbl03 td:nth-child(1).nodata,
.tbl04 td:nth-child(1).nodata,
.tbl05 td:nth-child(1).nodata { background: #f6f6f6; padding: 30px 10px; text-align: center !important; border: 0; }




/* data preview */
.relation_area span { display: inline-block; color: #333; background: #f1f1f1; margin-right: 2px; padding: 0 12px; line-height: 26px; border: 1px solid #ddd; border-radius: 26px; }
.box_vmonth { float: left; position: relative; width: calc(50% - 10px); background: #f6f6f6; padding: 20px; border: 1px solid #ddd; border-radius: 3px; box-sizing: border-box; }
.box_vmonth i { color: #333; margin-right: 10px; vertical-align: middle; font-size: 26px; }
.box_vmonth i.fs32 { font-size: 32px; }
.box_vmonth span { float: right; }
.box_vmonth span > strong { color: #00becc; font-size: 20px; font-weight: 800; }
.box_vmonth h1 em { display: block; color: #777; margin-top: 14px; font-size: 13px; font-family: 'Nanum Gothic'; font-weight: 400; }
.box_vmonth h1 b { display: block; color: #777; margin-bottom: 14px; font-size: 13px; font-family: 'Nanum Gothic'; font-weight: 400; }
.box_vmonth .price { display: block; float: right; margin-right: 100px; text-align: right; }
.box_vmonth .price em { display: block; margin-bottom: 6px; font-size: 18px; text-decoration: line-through; }
.box_vmonth .price i { color: #fff; background: #aaa; margin-right: 6px; padding: 5px 8px 5px 12px; font-size: 15px; font-style: normal; border-radius: 30px; }
.box_vmonth .price i.fa-long-arrow-alt-down { font-size: 13px; padding: 0 0 0 2px; }
.box_vmonth .price strong { font-size: 24px; font-weight: 800; }
.box_vmonth .price strong.notsale { display: block; line-height: 52px; }



/* matrix */
.pop_selectarea {  }
.pop_selectarea dl { overflow: hidden; }
.pop_selectarea dl dt,
.pop_selectarea dl dd { float: left; line-height: 34px; }
.pop_selectarea dl dt { position: relative; line-height: 20px; margin-right: 10px; padding: 7px 0 0 8px; }
.pop_selectarea dl dt::before { content: ""; position: absolute; left: 0; top: 13px; width: 4px; height: 7px; background: url('/html_analysis/images/common.png') -82px top no-repeat; }
.pop_selectarea dl dd { margin-right: 30px; }
.pop_selectarea dl dd:nth-of-type(1) { width: 18%; }
.pop_selectarea dl dd:nth-of-type(1) > input[type="number"] { width: calc(100% - 73px); }
.pop_selectarea dl dd:nth-of-type(2) { width: 20%; }
.pop_selectarea dl dd:nth-of-type(2) > input[type="number"] { width: calc(100% - 20px); }
.pop_selectarea dl dd input,
.pop_selectarea span a { vertical-align: top; }




/* change */
.boxcont_input { display: inline-block; float: left; }
.boxcont_input input[type="radio"] + label { float: left; width: 100px; line-height: 32px; background: #f6f6f6; text-align: center; border: 1px solid #ddd; }
.boxcont_input input[type="radio"] + label:hover { color: #765d95; background: #f1f1f1; }
.boxcont_input input[type="radio"]:checked + label,
.boxcont_input input[type="radio"]:checked + label:hover { color: #fff; background: #765d95; border-color: #4b3863; }
.boxcont_input input[type="radio"] + label span { display: none; }
.boxcont_input input[type="radio"] + label .fa-circle,
.boxcont_input input[type="radio"] + label .fa-adjust { font-size: 13px; }
.boxcont_input input.first + label { border-top-left-radius: 3px; border-bottom-left-radius: 3px; }
.boxcont_input input.last + label { border-top-right-radius: 3px; border-bottom-right-radius: 3px; }
.boxcont_input input.alone + label { margin-right: 10px; border-radius: 3px; }
/*.boxcont_input input.last + label:hover { color: #00a1ad; }*/
.boxcont_input input.last:checked + label,
.boxcont_input input.last:checked + label:hover { background: #00becc; border-color: #00b4c1; }

.boxcont_radio li { float: left; margin-right: 20px; }

.nonedata { color: #a9a6be; background: #f4f4f4; padding: 80px 30px; line-height: 22px; text-align: center; letter-spacing: 0; box-sizing: border-box; }
.nonedata i.bg { color: #e7e6f1; }
.nonedata i.sm { font-size: 42px; margin: 14px 0 20px; }
.nonedata strong { display: block; color: #765d95; font-size: 15px; font-weight: 700; }


/* dictionary */
.wrap_dict { background: #f1f1f1; margin:-30px -30px 0; padding: 30px; border-bottom: 1px solid #ddd; }
.wrap_dict .scrollarea { max-height: 650px; overflow-y: auto; }
.wrap_dict .btn_basic { background: #fff; }
.wrap_dict .btn_basic:hover { background: #f9f9f9; }



/* pay */
.pay_request { display: inline-block; border-top: 1px solid #765d95; }
.pay_request dt { float: left; width: 20%; background: #f6f6f6; padding: 16px 10px; text-align: center; border-bottom: 1px solid #ddd; box-sizing: border-box; }
.pay_request dd { float: left; width: 80%; padding: 7px 10px; border-bottom: 1px solid #ddd; box-sizing: border-box; }
.pay_request dd input { width: 100%; border: 0; }
.pay_request dt:last-of-type,
.pay_request dd:last-of-type { border-color: #765d95; }

.pay_result { display: inline-block; border-top: 1px solid #765d95; }
.pay_result dt { float: left; width: 30%; background: #f6f6f6; padding: 16px 10px; text-align: center; border-bottom: 1px solid #ddd; box-sizing: border-box; }
.pay_result dd { float: left; width: 70%; padding: 16px 10px; border-bottom: 1px solid #ddd; box-sizing: border-box; }
.pay_result dt:last-of-type,
.pay_result dd:last-of-type { border-color: #765d95; }



/* paging */
.paging { height: 31px; line-height: 31px; margin: 30px 0; text-align: center; }
.wrap_page { display: inline-block; background: #f6f6f6; }
.paging a,
.paging strong { float: left; display: inline-block; width: 35px; height: 31px; color: #777; background: url('/html_analysis/images/common.png') no-repeat; vertical-align: middle; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; border-right: 1px solid #ddd; }
.paging a.first { background-position: -81px -22px; border-left: 1px solid #ddd; border-right: 0; }
.paging a.last { background-position: -46px -22px; }
.paging a.pre { width: 100px; background: none; border-left: 1px solid #ddd; border-right: 0; }
.paging a.next { width: 100px; background: none; }
.paging a.pre .arrowl_grey { display: inline-block; width: 12px; height: 9px; margin-right: 8px; background: url('/html_analysis/images/common.png') -58px -12px no-repeat; }
.paging a.next .arrowr_grey { display: inline-block; width: 12px; height: 9px; margin-left: 8px; background: url('/html_analysis/images/common.png') -46px -12px no-repeat; }
.paging span.num { float: left; border-left: 1px solid #ddd; }
.paging span.num > a,
.paging span.num > strong { background: none; }
.paging span.num > strong { height: 29px; color: #333; background-color: #fff; font-weight: 700; border-bottom: 2px solid #00becc; }
.paging a:hover,
.paging strong:hover,
.paging span.num > a:hover,
.paging span.num > strong:hover { background-color: #fff; }



/* btn */
.btn_basic { display: inline-block; line-height: 32px; color: #777; background: #f6f6f6; padding: 0px 12px; text-align: center; border: 1px solid #ddd; border-radius: 3px; }
#aside .btn_basic { background: #fff; }
.btn_basic:hover { color: #765d95; background: #f1f1f1; }
#aside .btn_basic:hover { background: #f9f9f9; }
.btn_basic i,
.btn i { font-size: 12px; }
.btn_basic i.mr0,
.btn i.mr0 { margin-right: 0; }
.btn { display: inline-block; line-height: 32px; padding: 0px 30px; text-align: center; border-radius: 3px; }
.btn.violet { color: #efe8f7; background: #765d95; padding: 0 16px; border: 1px solid #4b3863; }
.btn.violet:hover { color: #fff; background: #684e89; }
.btn.lavender { color: #8569de; background: #f2efff; padding: 0 12px; border: 1px solid #dad7e3; }
.btn.lavender:hover { color: #4523b2; background: #e0d9ff; }
.btn.grey { color: #fff; background: #aaa; padding: 0 20px; border: 1px solid #999; }
.btn.grey:hover { background: #999; }

.btn.mint { color: #fff; background: #03ccdc; }
.btn.mint:hover { background: #00b4c2; }

/* small */
.btn.sm { line-height: 22px; padding: 0 10px; }
.btn.sm i { font-size: 10px; }

.btn.mid { padding: 0 12px; font-size: 14px;  line-height: 32px; }

.btn.round { border-radius: 60px; }

/* btn custom */
.btn_violet_round { display: block; color: #efe8f7; background: #3d2d51; padding: 10px 0; text-align: center; font-size: 16px; font-family: 'NanumSquareRound'; font-weight: 700; border-radius: 38px; }
.btn_violet_round i { font-size: 14px; }
.btn_violet_round:hover { color: #fff; background: #302144; }
.btn_violet_round.collect i { margin-right: 8px; }

/* btn blet */
a i.arrowr_white { display: inline-block; width: 17px; height: 11px; background: url('/html_analysis/images/common.png') -64px top no-repeat; margin-left: 8px; vertical-align: middle; }
a:hover i.arrowr_white,
a:focus i.arrowr_white { background-position: -46px top; transition: 0.4s; }

.btn_disable { opacity: 0.7; pointer-events: none; }



/* tooltip */
/*.tooltip { position: relative; }*/
/*.tooltip span { display: none; position: absolute; top: 33px; left: 0; line-height: 20px; color: #777; background: #f6f6f6; padding: 20px; text-align: left; border: 1px solid #ddd; box-shadow: 1px 1px 3px 0px #ddd; cursor: text; white-space: nowrap; z-index: 30; }*/
/*.tooltip span strong { display: block; }*/
/*.tooltip span em { display: block; color: #00a1ad; padding-top: 10px; }*/
/*.tooltip span em b { font-weight: 700; text-decoration: underline; }*/

.tooltip_info { display: inline-block; position: relative; color: #aaa; line-height: 22px; font-size: 22px; cursor: pointer; }
.tooltip_info:hover span { display: block; }
.tooltip_info span { display: none; position: absolute; top: 28px; line-height: 20px; color: #777; background: #f6f6f6; padding: 20px; text-align: left; font-size: 13px; border: 1px solid #ddd; box-shadow: 1px 1px 3px 0px #ddd; cursor: text; white-space: nowrap; z-index: 30; }
.tooltip_info span::after { content: ''; position: absolute; top: -12px; margin-left: -6px; border-width: 6px; border-style: solid; border-color: transparent transparent #ddd transparent ; }
.tooltip_info span.left { left: 0; }
.tooltip_info span.left::after { left: 9px; }
.tooltip_info span.right { right: 0; }
.tooltip_info span.right::after { right: 3px; }
.tooltip_info span strong { font-weight: 700; }
.tooltip_info span strong.tit { color: #765d95; margin-bottom: 5px; }
.tooltip_info span em { color: #00becc; font-weight: 700; text-decoration: underline; }
.tooltip_info span i { color: #777; font-size: 13px; }
.tooltip_info.sm i.fas { font-size: 16px; }



/* input file */
input[type="file"] { display: none; }
.file_input { display: inline-block; }
.file_input label { display: inline-block; width: 100%; line-height: 32px; color: #777; background: #f6f6f6; padding: 0px 12px; text-align: center; vertical-align: middle; border: 1px solid #ddd; border-radius: 3px; box-sizing: border-box; cursor: pointer; }
.file_input label:hover { color: #765d95; background: #f1f1f1; }

.file_input_route { display: inline-block; }
.file_input_route.disblock { display: block; }
.file_input_route label { float:left; position: relative; display: inline-block; height: 34px; line-height: 34px; color: #fff; background: #765d95; padding: 0 20px; text-align: center; vertical-align: middle; border-top-right-radius: 3px; border-bottom-right-radius: 3px; overflow: hidden; cursor: pointer; }
.file_input_route label input { position: absolute; width: 0; height: 0; overflow: hidden; opacity: 0; }
.file_input_route input[type="text"] { float:left; display: inline-block; height: 34px; line-height: 34px; vertical-align: middle; font-size: 11px; letter-spacing: 0.5px; border-top-right-radius: 0; border-bottom-right-radius: 0; }



/*  popup - 시각화 (sm): S  */

h4 { padding-bottom: 10px; font-size: 15px; font-weight: 700; }

.pop_body.vltotal { top: 103px; }

.visual_tab { position: relative; line-height: 50px; background: #f6f6f6; padding: 0 30px; border-top: 1px solid #ddd; border-bottom: 1px solid #ccc; z-index: 10; }
.visual_tab a { display: inline-block; color: #777; margin-right: 30px; padding: 0 1px; font-size: 15px; font-family: 'NanumSquareRound'; }

.wrap_scroll_l { overflow: hidden; width: 100%; box-sizing: border-box; }
.wrap_scroll_r { overflow: hidden; width: 100%; margin: 20px 0; background: #f1f1f1; border: 1px solid #dddddd; box-sizing: border-box; }
.wrap_aside { padding: 30px; }
.wrap_aside h4 { margin-top: 20px; }

/* Main Body 그래프부분  */
.wrap_pop2 .tbl03 { width: 923px; margin: 0 auto; }
.tbl03 { width: 100%; text-align: center; border-top: 1px solid #aaa; font-size: 14px; }
.tbl03 th { line-height: 14px; background: #f6f6f6; padding: 10px; font-weight: 700; border-bottom: 1px solid #aaa; }

.tbl03 th:first-child { border-left: 1px solid #aaa; }
.tbl03 th:last-child { border-right: 1px solid #aaa; }
.tbl03 th em { font-size: 11px; font-weight: 400; }
.tbl03 td { line-height: 18px; background: #fff; padding: 10px; border-bottom: 1px solid #ddd; border-right: 1px solid #ddd; text-align: center; word-break: break-all; overflow-wrap: break-word;}
.tbl03 td:first-child { border-left: 1px solid #ddd; color: #765d95; font-weight:700; }
.tbl03 td strong { color: #00becc; font-weight: 800; }
.tbl03 td strong.red { color: #e74a2b; font-weight: 700; }
.tbl03 td strong.blue { color: #0a75de; font-weight: 700; }
.tbl03 tr.bgcolor td { background: #f6f6f6; }
.pop_body .wrap_scroll_l .tbl03 tr:hover td { background: none; }

/* Main Body 오른쪽 aside 부분  */
aside, #aside.visual { box-shadow:none; z-index:9; overflow: visible; }

.btnarea_float { overflow:hidden; width: 100%; }
.btnarea_float.count2 a {width: 50%; }
.btnarea_float a { float: left; line-height: 32px; color: #777; background: #fff; text-align: center; border: 1px solid #ddd; box-sizing: border-box; }
.btnarea_float a:hover { color: #765d95; background: #f9f9f9; }
.btnarea_float a.first { border-top-left-radius: 3px; border-bottom-left-radius: 3px; border-top-right-radius: 0; border-bottom-right-radius: 0; }
.btnarea_float a.violet { color: #efe8f7; background: #765d95; border: 1px solid #4b3863; }

.colorchoicearea { overflow:hidden; width: 100%; }
.color_left { float: left; margin-bottom: 4px; }
.color_right { float: left; }
.choicebox {  float: left; margin-right: 10px; }
.choicebox a {  float: left; width: 20px; height: 20px; margin-right: 1px; border-radius:20px; background: #fff; }
.choicebox a:nth-of-type(1) { background: #411676; }
.choicebox a:nth-of-type(2) { background: #17c8d5; }
.choicebox a:nth-of-type(3) { background: #a1a1a1; }

.choicebox:nth-of-type(2) a:nth-of-type(1) { background: #64100e; }
.choicebox:nth-of-type(2) a:nth-of-type(2) { background: #e15a00; }
.choicebox:nth-of-type(2) a:nth-of-type(3) { background: #f5b733; }

.choicebox:nth-of-type(3) a:nth-of-type(1) { background: #005952; }
.choicebox:nth-of-type(3) a:nth-of-type(2) { background: #28ae68; }
.choicebox:nth-of-type(3) a:nth-of-type(3) { background: #97c855; }

.choicebox:nth-of-type(4) a:nth-of-type(1) { background: #000000; }
.choicebox:nth-of-type(4) a:nth-of-type(2) { background: #666666; }
.choicebox:nth-of-type(4) a:nth-of-type(3) { background: #959595; }

.choicebox span {float: left; margin-right: 6px; }
.choicebox button {float: left; width: 20px; height: 20px; margin-right: 1px; border-radius:20px; background: #fff;  font-size: 11px; }
.choicebox button:nth-of-type(1) { background: #411676; color: #fff; }
.choicebox button:nth-of-type(2) { background: #17c8d5; }
.choicebox button:nth-of-type(3) { background: #a1a1a1; }

 /* 키워드선정 버튼 */
.visualcon_input { overflow: hidden; }
.visualcon_input > div:first-child { margin-right: 4px; }
.visualcon_input > div { float: left; width: calc(50% - 3px); margin-bottom: 4px; overflow: hidden; }

.visualcon_input input[type="radio"] + label { float: left; width: 50%; border:1px solid #ddd; font-size: 12px; line-height: 22px; background: #fff; text-align: center; box-sizing: border-box; }
.visualcon_input input[type="radio"] + label span { display: none; }
.visualcon_input input[type="radio"]:checked + label, .visualcon_input input[type="radio"]:checked + label:hover { color: #fff; background: #765d95; border-color:#4b3863; }

.visualcon_input input.first + label { border-top-left-radius:3px; border-bottom-left-radius:3px; border-top-right-radius:0; border-bottom-right-radius:0; }
.visualcon_input input.last + label { border-top-left-radius:0; border-bottom-left-radius:0; border-top-right-radius:3px; border-bottom-right-radius:3px; }

.visualcon_btn { overflow: hidden; }
.visualcon_btn a { float: left; width: calc(25% - 3.43px); background: #fff; margin-left: 4px; padding: 0; line-height: 22px; font-size: 12px; box-sizing: border-box; }
.visualcon_btn a:first-child { margin-left: 0; }
.visualcon_btn a:hover { background: #f6f6f6; }

.visualcon_btn02 { overflow: hidden; }
.visualcon_btn02 a { float: left; width: calc(50% - 3px); background: #fff; margin-left: 4px; padding: 0; line-height: 22px; font-size: 12px; box-sizing: border-box; }
.visualcon_btn02 a:first-child { margin-left: 0; }
.visualcon_btn02 a:hover { background: #f6f6f6; }


/* 키워드 리스트 */
.keywordlist {overflow:hidden; width: 100%; margin-top: 10px; }
.keywordlist > h4 { display: inline-block; width: 48%; text-align: center; }

.keywordlist_box_scroll { overflow-y:scroll;     width: calc(100% - 3px); height: 362px; }
.keywordlist_tbl { float: left; width: calc(50% - 10px); margin-right: 14px; }
.keywordlist_tbl:last-child { margin-right: 4px; }
.keywordlist_tbl th { line-height: 40px; font-size: 15px; font-weight: 700; border-bottom:1px dashed #ddd; }
.keywordlist_tbl td { padding: 5px 0; font-size: 12px; word-break: break-all; border-bottom:1px dashed #ddd; }
.keywordlist_tbl td:first-child { width: 24px; }
.keywordlist_tbl td:nth-child(2) { width: calc(76% - 24px); text-align: left; }
.keywordlist_tbl td:nth-child(3) { width: 24%; text-align: right; }
.keywordlist_tbl td input[type="checkbox"] + label span { margin-right: 0; }

.keywordlist_box { float: left; width: calc(50% - 9px); padding: 5px 0; font-size: 12px; border-top:1px dashed #ddd; border-bottom:1px dashed #ddd; }
.keywordlist_box:nth-of-type(2n-1) { margin-right: 18px; }
.keywordlist_box p { display: inline-block; margin: 0; padding: 2px 0 1px 0px; vertical-align: middle; }
.keywordlist_box p:nth-of-type(2) { width: 65%; text-align: left; }
.keywordlist_box p:nth-of-type(3) { width: 20%; text-align: right; }

/* css_design_sh */
.choicebox.bar > div{ float: left; margin-right: 10px; }

.choicebox.bar p { display: inline-block; margin: 0 2px 0 5px; }
.choicebox.bar > div span:nth-of-type(1) { background: #411676;display:inline-block; width:40px; height: 8px; margin-top: 4px; border-radius: 10px; }
.choicebox.bar.mat { margin-right: 0; width: 50%; }

.visualcon_button { overflow:hidden; }
.visualcon_button button { float: left; width: calc((100% - 4px) / 3); margin-right: 2px; padding: 5px 7px; border: 1px solid #C7C3C8; font-size: 11px; font-weight: bold; }
.visualcon_button button:nth-of-type(1){ background: #B4AFB4; color: #F5F2F3; }
.visualcon_button button:nth-of-type(2){ background: #B4AFB4; color: #F5F2F3; }
.visualcon_button button:nth-of-type(3){ margin-right: 0; background: #FFFFFF; color: #A494AC; }

.choicebox3 { display:block; width: 100%; margin-bottom: 4px; }
.choicebox3 button { width: calc((100% - 54px) / 5); font-size: 14px; line-height: 26px; text-align: center; margin-right: 2px; background: #f6f6f6; border-radius: 3px; border: 1px solid #ccc; cursor: pointer; background-color: rgb(246, 246, 246); color: rgb(0, 0, 0); } 
.choicebox3 span { width: 12%; margin-right: 6px;}

.choicebox3.count3 div {float: left; width: 58%; margin-right: 12px; }
.choicebox3.count3 div:last-of-type { float: right; width: calc(42% - 12px); margin-right: 0; }
.choicebox3.count3 button { float: left; width: calc(33.33% - 2px); }
.fzselect { height: 28px; line-height: 27px; }

.choicebox4 button:last-of-type{ padding: 1px 12px; height: 20px; background: rgb(106, 219, 227); border:1px solid #ccc ; color: #000; border-radius: 3px; font-size: 12px; background: rgb(106, 219, 227); color: #000; }
.choicebox4 { display:inline-block; margin: 0 4px;  }
.choicebox4 > input[type="radio"] { margin-top: 8px; }
.choicebox4 > label > span > img { vertical-align: middle; margin-bottom: 4px; }
.color_left button { float: left; font-size: 13px; line-height: 24px; text-align: center; padding: 0 15px; cursor: pointer;  }
.arrowarea { float: left; width: calc(50% - 4px);  margin-left: 4px; }

.choicebox_wordt.color_right button { display: inline-block; padding: 5px 6px; border-radius: 2px; font-size: 11px; width: inherit; height: inherit; }

.btnarea_float.count1 a { width: 100%; }
.visualcon_btn02.count3 a{ width: calc(33.33% - 2.66px); }

/* sentiment */
.tbl02.sentiment td:nth-child(1) { width: 16%; background: #f6f6f6; font-weight: 700; } /* sentiment */
.tbl02.sentiment td:nth-child(2) { width: 28%; text-align: right; } /* frequency */
.tbl02.sentiment td:nth-child(3) { width: 28%; text-align: right; } /* percent */
.tbl02.sentiment td:nth-child(4) { width: 28%; text-align: right; } /* frequency percent */

.tbl04.sentiment_word td:nth-child(1) { width: 30%; text-align: left; } /* word */
.tbl04.sentiment_word td:nth-child(2) { width: 14%; text-align: right; } /* frequency */
.tbl04.sentiment_word td:nth-child(3) { width: 14%; text-align: right; } /* percent */
.tbl04.sentiment_word td:nth-child(4) { width: 14%; text-align: right; } /* percent */
.tbl04.sentiment_word td:nth-child(5) { width: 14%; text-align: right; } /* percent */
.tbl04.sentiment_word td:nth-child(6) { width: 14%; text-align: right; } /* percent */
/*  popup - 시각화 (sm):E  */




/* loading */
.loader { display: inline-block; position: relative; top: 0; right: 30px; width: 5px; height: 5px; border-radius: 50%; animation: loader 1s linear alternate infinite; }
.state.preview .loader { right: auto; width: 8px; height: 8px; margin-bottom: 16px; animation: loader02 1s linear alternate infinite; }

@keyframes loader {
  0% {
    box-shadow: -20px 0 0 2px #01d6e6, -10px 0 0 0 rgba(0, 194, 236, 0.2), 0 0 0 0 rgba(0, 194, 236, 0.2), 10px 0 0 0 rgba(0, 194, 236, 0.2), 20px 0 0 0 rgba(0, 194, 236, 0.2); }
  25% {
    box-shadow: -20px 0 0 0 rgba(0, 194, 236, 0.2), -10px 0 0 2px #01d6e6, 0 0 0 0 rgba(0, 194, 236, 0.2), 10px 0 0 0 rgba(0, 194, 236, 0.2), 20px 0 0 0 rgba(0, 194, 236, 0.2); }
  50% {
    box-shadow: -20px 0 0 0 rgba(0, 194, 236, 0.2), -10px 0 0 0 rgba(0, 194, 236, 0.2), 0 0 0 2px #01d6e6, 10px 0 0 0 rgba(0, 194, 236, 0.2), 20px 0 0 0 rgba(0, 194, 236, 0.2); }
  75% {
    box-shadow: -20px 0 0 0 rgba(0, 194, 236, 0.2), -10px 0 0 0 rgba(0, 194, 236, 0.2), 0 0 0 0 rgba(0, 194, 236, 0.2), 10px 0 0 2px #01d6e6, 20px 0 0 0 rgba(0, 194, 236, 0.2); }
  100% {
    box-shadow: -20px 0 0 0 rgba(0, 194, 236, 0.2), -10px 0 0 0 rgba(0, 194, 236, 0.2), 0 0 0 0 rgba(0, 194, 236, 0.2), 10px 0 0 0 rgba(0, 194, 236, 0.2), 20px 0 0 2px #01d6e6; }
}

@keyframes loader02 {
  0% {
    box-shadow: -32px 0 0 2px #01d6e6, -16px 0 0 0 rgba(0, 194, 236, 0.2), 0 0 0 0 rgba(0, 194, 236, 0.2), 16px 0 0 0 rgba(0, 194, 236, 0.2), 32px 0 0 0 rgba(0, 194, 236, 0.2); }
  25% {
    box-shadow: -32px 0 0 0 rgba(0, 194, 236, 0.2), -16px 0 0 2px #01d6e6, 0 0 0 0 rgba(0, 194, 236, 0.2), 16px 0 0 0 rgba(0, 194, 236, 0.2), 32px 0 0 0 rgba(0, 194, 236, 0.2); }
  50% {
    box-shadow: -32px 0 0 0 rgba(0, 194, 236, 0.2), -16px 0 0 0 rgba(0, 194, 236, 0.2), 0 0 0 2px #01d6e6, 16px 0 0 0 rgba(0, 194, 236, 0.2), 32px 0 0 0 rgba(0, 194, 236, 0.2); }
  75% {
    box-shadow: -32px 0 0 0 rgba(0, 194, 236, 0.2), -16px 0 0 0 rgba(0, 194, 236, 0.2), 0 0 0 0 rgba(0, 194, 236, 0.2), 16px 0 0 2px #01d6e6, 32px 0 0 0 rgba(0, 194, 236, 0.2); }
  100% {
    box-shadow: -32px 0 0 0 rgba(0, 194, 236, 0.2), -16px 0 0 0 rgba(0, 194, 236, 0.2), 0 0 0 0 rgba(0, 194, 236, 0.2), 16px 0 0 0 rgba(0, 194, 236, 0.2), 32px 0 0 2px #01d6e6; }
}








/* MATRIX */
.chart_matrix span.label_txt { float:left; margin:6px 10px 0 10px; font-size:13px; font-family:Dotum, '돋움'; }
.chart_matrix select#seledtBox { float:left;  vertical-align:top; border:1px solid #e1e1e1; }   /* background:#fff; margin-top:2px; padding:4px 4px 3px 4px; */
.chart_matrix #chart-top-label-box { display:inline-block; width: calc( 100% - 34px ) !important; height:auto; margin-top:20px; padding:15px; text-align:center; border:2px solid #E3E4E4; }
.chart_matrix #chart-top-label-box > div { display:inline-block; }
.chart_matrix .color_left { float:left; margin-right:100px; }
.chart_matrix .color_left .jscolor { display:inline-block; float:left; font-size:13px; height:24px; line-height:24px; text-align:center; margin-top:3px; padding:0 15px; background: #f6f6f6; border-radius:2px; border:1px solid #ccc; cursor:pointer; }
.chart_matrix span.label_txt { float:left; margin:6px 10px 0 10px; font-size:13px; font-family:Dotum, '돋움'; }
.chart_matrix .color_right { float:right; }
.chart_matrix .color_right a:link,
.chart_matrix .color_right a:visited { display:inline-block; float:left; font-size:13px; height:22px; line-height:22px; text-align:center; margin:3px 0 0 2px; padding:0 15px; color:#888; background: #f6f6f6; border-radius:2px; border:1px solid #ccc; cursor:pointer; }
/* 2way word tree */
/* .icon_wt_home { position: absolute; top: 10px; left: 10px; color: #efe8f7; border-radius: 40px; box-shadow: 0 1px 3px rgba(0,0,0,.2); z-index: 20; cursor: pointer; }
.icon_wt_home .fa-home { color: #4b3863; }
.icon_wt_home:hover { color: #fff; }
.icon_wt_home:hover .fa-home { color: #4b3863; } */
.icon_wt_home { position: absolute; top: 0; left: 0; width: 50px; height: 50px; color: #ddd; text-align: center; border-right: 1px solid #765b93; }
.icon_wt_home:hover { color: #fff; background-color: rgba(255,255,255,0.1); }
.icon_wt_home i.fa-home { line-height: 50px; font-size: 20px; }


/* 키워드정제  : S */
.popw_tab { display: inline-block; width: 100%; }
.popw_tab > li { position: relative; background: #f6f6f6; padding: 15px 0; font-size: 14px; border-bottom: 1px solid #ddd; border-left: 1px solid #ddd; box-sizing: border-box; }
.popw_tab > li:first-child { padding: 8px 0; border-left: 0; }
.popw_tab > li.on { background: #fff; font-weight: 700; border-bottom: 0; }
.popw_tab > li .accent { position: relative; }
.popw_tab > li .accent:after { content: ''; display: inline-block; position: absolute; top: -2px; right: -10px; width: 6px; height: 6px; background: #00becc; border-radius: 6px; }
.popw_tab .tooltip_info { position: absolute; top: 4px; right: 12px; }
.popw_list { overflow-y: auto; min-height: 234px; max-height: 234px; }
.popw_list ul { display: inline-block; width: 100%; }
.popw_list li { position: relative; padding: 15px 0; border-top: 1px dashed #e1e1e1; }
.popw_list li:first-child { border-top: 0; }
.popw_list li:nth-child(even) { background: #f6f6f6; }
.popw_list li span { color: #fff; background-color: #999; padding: 3px 7px 3px 6px; border-radius: 22px; font-size: 13px; }
.popw_list em,
.popw_list i.fa-caret-down { display: block; margin: 0 10px; }
.popw_list i.fas.fa-undo-alt { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); color: #aaa; background: #f6f6f6; padding: 6px; font-size: 11px; border: 1px solid #ddd; border-radius: 100%; }




/*.pop_keysearch_area { float: left; width: calc(50% - 12px); }*/
/*.pop_keychange_area { display: inline-block; width: calc(50% - 6px); }*/
/*.pop_keysearch_area.row02 {  }*/
/*.pop_keysearch_area.row02 > div { }*/
.pop_body.keyword h3 { font-size: 17px; margin-bottom: 16px; }

.pop_tarea { margin-bottom: 12px; }
.pop_tarea h3 { margin-bottom: 12px; }
.pop_tarea span { color: #777; font-size: 14px; font-weight: 400; }
.pop_tarea span em:first-of-type { margin-right: 4px; }

.pop_change .tooltip_info { margin: 5px 0 0 10px; }
.pop_change .dict { float: right; margin-bottom: 4px; }
.pop_change .dict dt, .pop_change .dict dd { float: left; line-height: 32px; }
.pop_change .dict dt { padding-right: 10px; font-weight: 700; }
.pop_change .dict dd select { max-width: 260px; }

/* .pop_cont_change { display: inline-block; position: relative; left: 0; width: 100%; height:100% ; margin: 20px 0 30px 0; clear: both; } */
.keyword_refine { display: grid; grid-template-columns: 4fr 6fr; gap: 24px; }
.refine_box_wrap { display: flex; gap: 8px; align-items: center; }
.refine_box_wrap > div { width: 50%; }
.keyword_refine .refine_box { height: 335px; border-top: 2px solid #03ccdc; }
.refine_box_wrap button { padding: 0 12px; }

.clean_data .table_box { height: 630px;}
/*.clean_result .table_box { max-height: 228px;}*/

.refine_box { padding: 20px; border: 1px solid #ddd; }
.refine_tit { display: flex; flex-wrap: wrap; justify-content: space-between; margin-bottom: 5px; }
/*.refine_tit a { color: #03ccdc; font-size: 17px; }*/
/*.refine_tit a:hover { color: #00b4c2; }*/
.refine_box .table_scroll { border-bottom: 1px solid #ddd; }
.refine_box .table_scroll { max-height: 223px; }
.refine_box .table_scroll.h180 { max-height: 180px; }
.refine_box .table_scroll.h268 { max-height: 268px; }
.refine_box .tbl01 tr th { text-align: left; }
.refine_box .tbl01 tr th:first-of-type,
.refine_box .tbl01 tr td:first-of-type { width: 2%; max-width: 50px; }
.refine_box .tbl01 tr th:nth-of-type(2),
.refine_box .tbl01 tr td:nth-of-type(2) { max-width: 185px; }
.refine_box .tbl01 tr th:nth-of-type(3),
.refine_box .tbl01 tr td:nth-of-type(3) { max-width: 185px; }
.refine_box .tbl01 tr th:nth-of-type(4),
.refine_box .tbl01 tr td:nth-of-type(4) { width: 10%; max-width: 50px; }

.refine_box .boxcont_input { width: 100%; }
.refine_box .boxcont_input input[type="radio"] + label { width: calc(50% - 2px); }


.tooltip { position: relative; color: #03ccdc; z-index: 9; font-size: 17px; cursor: pointer; }
.tooltip:hover { color: #00b4c2; }
.tooltip span { position: absolute; display: none; top: 24px; right: 0; width: 360px; line-height: 22px; color: #777; background: #f6f6f6; padding: 20px; font-size: 15px; text-align: left; border: 1px solid #ddd; border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; box-shadow: 1px 1px 3px 0px #ddd; cursor: text; z-index: 30; }
.tooltip:hover span { display: block; }
.tooltip span strong { display: block; margin-bottom: 10px; }
.tooltip span em { display: block; color: #00a1ad; padding-top: 10px; }
.tooltip span em b { font-weight: 700; text-decoration: underline; }



.keyw_area input[type="text"] { float: left; width: calc(100% - 41px); margin-right: 5px; }

.box_txt { height: 100%; padding: 20px; text-align: center; line-height: 20px; background: #f1f1f1; vertical-align: top; border: 1px solid #ddd; box-sizing: border-box; overflow: hidden; overflow-y: auto; }
.box_txt > pre { width: 100%; text-align: left; white-space: pre-wrap; letter-spacing: 0; }
.box_txt span.nodata { line-height: 200px; }
.pop_cont_change > textarea { width: calc(70% - 4px); height: 100%; line-height: 20px; background: #f1f1f1; padding: 20px; text-align: center; vertical-align: top; border: 1px solid #ddd; box-sizing: border-box; overflow: hidden; overflow-y: auto; resize: none; }


.pop_keych_cont { display: flex; width: 100%; }
.pop_ngram {float: left; width: calc(55% - 2px); margin-right: 4px; height: 100%; background: #fff;  border-top:none; box-sizing: border-box; }
.pop_ngram > .box { min-height: 505px; max-height: 505px;  overflow-y: auto; border: 1px solid #ddd; }
.pop_ngram > .box table { width: 100%; padding: 20px; }
.pop_ngram .tab02 a { width: 50%; padding: 8px 30px; }

 /* 추천단어 수정내역 영역 */
.pop_ew_area {  width: calc(45% - 2px); height: 100%; text-align: center; }
.pop_word { width: 100%; height: 50%; vertical-align: top;  box-sizing: border-box; }
.pop_word .recommend { border: 1px solid #ddd; }

.pop_history { min-height: 266px; max-height: 266px; margin-top: 4px; text-align: center; border: 1px solid #ddd; }
.pop_history .popw_list { min-height: 178px; max-height: 234px; }
.pop_history .popw_list em,
.pop_history .popw_list i.fa-caret-down { margin: 0 40px 0 30px; }
.histpop_historyory .popw_list i.fa-circle,
.pop_history .popw_list i.fa-adjust { position: absolute; top: 30px; left: 10px; font-size: 13px; }
.pop_history .popw_list i.fa-circle { color: #765d95;   position: absolute; left: 16px; top: 50%; transform: translateY(-50%); }
.pop_history .popw_list i.fa-adjust { color: #00becc; }

.pop_history button.btn.round { border-radius: 60px;  }
.pop_history button.btn.mint { color: #fff; background: #03ccdc; }
.pop_history button.btn.mint:hover { background: #00b4c2; } 











.pop_tab { display: flex; }
.pop_tab button { width: 100%; padding: 10px; border: 1px solid #ddd; background: #f6f6f6; color: #999; font-size: 15px; }
.pop_tab button:hover { background: #f1f1f1; color: #765d95; }
.pop_tab button.on { background: #fff; color: #333; border-top: 2px solid #765d95; border-bottom: #fff; font-weight: 700; }
.pop_tab button:first-of-type { border-right: 0; }



.pop_cont_top { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px; width: 100%; margin-bottom: 6px; }
.pop_cont_top span b { color: #8030cd; }
.pop_cont_top .search_input { width: auto; }

.table_box { padding: 20px; height: 228px; border: 1px solid #ddd; border-top: 0; }
/*.table_box { height: 600px; padding: 20px; border: 1px solid #ddd; border-top: 0; }*/

.clean_table { position: relative; width: 100%; }
.table_scroll.clean { border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; }
.clean_table thead { position: sticky; top: 0; left: 0; z-index: 8; }
.clean_table thead th { line-height: 32px; }
.clean_table tr {}
.clean_table th { background: #f3f5f7; margin: 0 30px; border-bottom: 1px solid #ddd; }
.clean_table td { padding: 8px 20px; line-height: 20px; border-bottom: 1px solid #ddd; }
.clean_table td b { color: #00a1ad; }
.clean_table tr:last-of-type th,
.clean_table tr:last-of-type td { border-bottom: 0; }

.clean_result .table_scroll { max-height: 184px; }
.clean_result .table_scroll .clean_table td:first-of-type { width: 30%; }
.clean_result .clean_table td { text-align: center; }

.table_scroll { overflow: auto; max-height: 588px; }
.table_scroll.border_none { padding-right: 10px; border: 0; }

.check_wrap { display: flex; ailgn-items: center; }
.check_wrap a { margin-left: 3px; color: #777; }
.check_wrap a:hover { color: #333; }

.keyw_area { overflow: hidden; }
.ai_clean_word { margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px solid #ccc; }
.ai_clean_word:last-of-type { margin-bottom: 0; padding-bottom: 0; border-bottom: 0; }
/* 키워드정제  : E */

/* layout */
/* .wrap_pop { min-width: 248px; height: 100%; opacity: 0; overflow: hidden; }
.wrap_pop.fadein { opacity: 1; transition: ease-in-out 0.5s; } */
.wrap_lpop .pop_body { position: initial; min-width: 248px; height: calc(100% - 52px); background: #f5f6f9; padding: 24px; overflow: hidden; overflow-y: auto; }
.wrap_lpop .pop_body.bg_white { background: #fff; }


/* layer popup */
.lpopup { position: fixed; top: 0; bottom: 0; left: 0; right: 0; background: rgba(0,0,0,.6); z-index: 9999; }
.wrap_lpop { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 400px; border-radius: 4px; box-shadow: 0 0 10px 0 rgba(0,0,0,.3) }
.wrap_lpop .pop_body { border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; }
.wrap_lpop .tit_pop { border-top-left-radius: 4px; border-top-right-radius: 4px; }
.wrap_lpop .pop_body .tab02 { float: none; overflow: hidden; }
.wrap_lpop .pop_body .tab02 a { width: 50%; }
.pop_body .selc_area { padding: 20px 0 ; text-align: center; }
.pop_body .selc_area span { display: block; }
.pop_body .selc_area select,
.pop_body .selc_area input[type="text"] { width: 300px; }
.selc_area button.btn { vertical-align: baseline; } 
.selc_area button.btn i { margin-right: 0; } 
.wrap_lpop .btnarea { text-align: center; }

/* title */
.tit_pop { position: relative; background: #8569de; line-height: 52px; text-align: center; }
.tit_pop h6 { float: none; display: block; padding: 0 62px;  text-align: center; color: #fff;  line-height: 50px; }
.tit_pop span { }
.btn_pop_close { position: absolute; top: 0; right: 0; color: #fff; padding: 0 24px; opacity: .6; cursor: pointer; }
.btn_pop_close:hover { opacity: 1; }
.btn_pop_close i.fa-times { font-size: 20px; }


/* 분석설정 팝업 테이블 위 가이드영역 */
.pop_option_top { overflow: hidden; width: 100%; }
.pop_option_top .guide { display: inline-block;	line-height: 34px; }
.pop_option_top a { float: right; }



	/* 반응형 사이즈별 */
	/* wide */
@media all and (min-width: 1600px) {

}
	/* Desktop */
@media all and (min-width: 1280px) and (max-width: 1399px) {
.file_input_route.inapply.popup input[type="text"] { width: calc(100% - 129px);}
}

	/* pc + Tablet */
@media screen and (max-width: 1279px) {
.keyword_refine .refine_box { height: 311px; }

}

@media screen and (min-width: 992px) and (max-width: 1100px) {

}

	/* Tablet */
@media screen and (max-width: 991px) {

}

@media screen and (max-width: 942px) {
.pop_body.vltotal { top: 153px; }
}


