:root {
	/* breakpoints */
	--bpSmall: 376px;
	--bpMedium: 768px;
	--bpLarge: 992px;
	--bpHuge: 1200px;

	/* font weights */
	--regular: 400;
	--thin: calc(var(--regular) - 200);
	--light: calc(var(--regular) - 100);
	--medium: calc(var(--regular) + 100);
	--bold: calc(var(--regular) + 200);
	--fblack: calc(var(--regular) + 400);
	--extra: calc(var(--regular) + 500);

	/* header, footer height */
	--headerPc: 8rem;
	--headerMobile: 5.6rem;
	--footerPc: 8rem;
	--footerMobile: 6.4rem;

	/* color code */
	--primary00: #ffdbec;
	--primary01: #ffb8da;
	--primary02: #ff94c7;
	--primary03: #ff6bb2;
	--primary04: #ff47a0;
	--primary05: #ff248d;
	--primary06: #ff007a;
	--primary07: #e0006c;
	--primary08: #c2005d;
	--black: #000000;
	--white: #ffffff;
	--navActive: #ff007a;
	--selectActive: #ff007a;
	--primaryBtn: #ff007a;
	--primaryBtnHover: #e0006c;
	--primaryBtnDisable: #f577b6;
	--Long: #00c2ff;
	--Short: #ff007a;
	--TooltipBg: #006ff2;
	--TooltipBorder: #1f86ff;

	/* Light */
	--lgtBg: #eaeef1;
	--lgtPopupBg: #000000;
	--lgtHeaderBg: #f2f5f7;
	--lgtSectionBg: #f2f5f7;
	--lgtSectionBorder: #e8ebed;
	--lgtSectionDivider: #e6e9eb;
	--lgtFooterbg: #f2f5f7;
	--lgtPlus: #ff271a;
	--lgtMinus: #00b2eb;
	--lgtSectionBgHover: #edf0f2;

	--lgtTabBasic: #8b9297;
	--lgtTabActive: #ff007a;

	--lgtInputBg: #f2f5f7;
	--lgtInputBgActive: #f7fafc;
	--lgtInputBorder: #e3e3e3;
	--lgtInputBorderActive: #ff007a;
	--lgtInputTxtPrimary: #757d81;
	--lgtInputTxtSecondary: #3b474d;

	--lgtSwitchOn: #ff007a;
	--lgtSwitchOff: #a1a8ac;

	--lgt00: #273035;
	--lgt01: #3b474d;
	--lgt02: #485157;
	--lgt03: #757d81;
	--lgt04: #8b9297;
	--lgt05: #a1a8ac;
	--lgt06: #b8bec1;
	--lgt07: #ced3d7;
	--lgt08: #dce1e4;

	--lgtWhaleTime: #00a77f;
	--lgtWhaleCoin: #e65402;
	--lgtWhaleBasic: #ab8500;
	--lgtWhaleEx: #00b3b3;
	--lgtWhaleAmount: #3b474d;
	--lgtWhaleDollar: #838687;

	--lgtBuyStrong: #07b294;
	--lgtSellStrong: #fe617e;
	--lgtNeutral: #dea616;
	--lgtLike: #ff2c52;
	--lgtHate: #4242ff;

	/* Dark */
	--drkBg: #1f2128;
	--drkPopupBg: #000000;
	--drkheaderBg: #191b1f;
	--drkSectionBg: #191b1f;
	--drkSectionBorder: #1d1f24;
	--drkSectionDivider: #292c33;
	--drkFooterBg: #191b1f;
	--drkPlus: #ff1d1d;
	--drkMinus: #00c2ff;
	--drkSectionBgHover: #15161a;

	--drkTabBasic: #838687;
	--drkTabActive: #ff007a;

	--drkInputBg: #191b1f;
	--drkInputBgActive: #0c0d0f;
	--drkInputBorder: #25282e;
	--drkInputBorderActive: #ff007a;
	--drkInputTxtPrimary: #9c9e9f;
	--drkInputTxtSecondary: #e6e7e7;

	--drkSwitchOn: #ff007a;
	--drkSwitchOff: #6a6e6e;

	--drk00: #f4f4f4;
	--drk01: #e6e7e7;
	--drk02: #cdcfcf;
	--drk03: #9c9e9f;
	--drk04: #838687;
	--drk05: #6a6e6e;
	--drk06: #525656;
	--drk07: #393d3e;
	--drk08: #292e2f;

	--drkWhaleTime: #00ffc3;
	--drkWhaleCoin: #e65402;
	--drkWhaleBasic: #e6cf00;
	--drkWhaleEx: #00ffff;
	--drkWhaleAmount: #e6e7e7;
	--drkWhaleDollar: #838687;
	--drkGraphAxis: #393d3e;

	--drkBuyStrong: #33ea87;
	--drkSellStrong: #ff2f4a;
	--drkNeutral: #deca16;
	--drkLike: #fb2727;
	--drkHate: #3838fd;
}

/* reset */
.dark-theme {
	background: var(--drkBg);
	color: var(--drk00);
}
.dark-theme .g-common-box {
	background: var(--drkSectionBg);
}
.dark-theme h3 {
	color: var(--drk00);
}
.dark-theme .g-buy {
	color: var(--drkBuyStrong);
}
.dark-theme .g-sell {
	color: var(--drkSellStrong);
}
.dark-theme .g-maintain {
	color: var(--drkNeutral);
}
.dark-theme .g-btn.style-line.dark,
.dark-theme .g-btn.style-line.dark:hover,
.dark-theme .g-btn.style-line.dark.disabled,
.dark-theme .g-btn.style-line.dark:disabled,
.dark-theme .g-btn.style-line.dark[disabled] {
	color: var(--drk01);
	border-color: var(--drk04);
}
@media screen and (min-width: 992px) {
	.dark-theme .g-btn.style-line.dark:hover {
		color: var(--primaryBtn);
		border-color: var(--primaryBtn);
	}
}
.dark-theme .g-btn.style-line.dark.disabled:hover,
.dark-theme .g-btn.style-line.dark:disabled:hover,
.dark-theme .g-btn.style-line.dark[disabled]:hover,
.dark-theme #warning .centerContainer p,
.dark-theme #GettingReady .center-p .info {
	color: var(--drk01);
}

/* header */
.dark-theme .headerWrap,
.dark-theme .headerWrap .g-mobile-only .slide-meunWrap {
	background: var(--drkheaderBg);
}
.dark-theme .headerWrap .g-pc-only .meunWrap .container ul li,
.dark-theme .headerWrap .g-pc-only .meunWrap .container .choice-wrap .choice-modal,
.dark-theme .headerWrap .g-mobile-only .slide-meunWrap .list .user-selection span,
.dark-theme .headerWrap .g-mobile-only .slide-meunWrap .list.theme span {
	color: var(--drk01);
}
.dark-theme .headerWrap .g-pc-only .meunWrap .container .choice-wrap .choice-theme span {
	color: var(--drk02);
}
.dark-theme .headerWrap .g-mobile-only .slide-meunWrap .list .user-selection span.selected {
	color: var(--drk04);
}
.dark-theme .headerWrap .g-pc-only .meunWrap .container .choice-wrap .choice-modal span {
	color: var(--drkSectionDivider);
}
.dark-theme .headerWrap .g-mobile-only .slide-meunWrap .list,
.dark-theme .headerWrap .g-mobile-only .slide-meunWrap .list:first-of-type {
	border-color: var(--drkSectionDivider);
}

/* footer */
.dark-theme footer {
	background: var(--drkFooterBg);
}
.dark-theme footer .g-pc-only p,
.dark-theme footer .g-mobile-only .row .col a span {
	color: var(--drk04);
}

/* input */
.dark-theme .g-input-box label,
.dark-theme .g-input-box .clearBtn i {
	color: var(--drk01);
}
.dark-theme .g-input-box input {
	background: var(--drkInputBg);
	border-color: var(--drkInputBorder);
	color: var(--drkInputTxtPrimary);
}
.dark-theme .g-input-box input:hover {
	border-color: var(--drkInputBorderActive);
}
.dark-theme .g-input-box input:focus {
	color: var(--drkInputTxtSecondary);
	border-color: var(--drkInputBorderActive);
}
.dark-theme .g-input-box input.active {
	color: var(--drkInputTxtSecondary);
	border-color: var(--drkInputBorder);
}

/* select */
.dark-theme .g-select-box input {
	background: var(--drkInputBg);
	border-color: var(--drkInputBorder);
	color: var(--drkInputTxtSecondary);
}
.dark-theme .g-select-box input:hover {
	border-color: var(--drkInputBorderActive);
}
.dark-theme .g-select-box input.active {
	color: var(--drkInputTxtSecondary);
	border-color: var(--drkInputBorderActive);
}

/* table */
.dark-theme .g-table thead,
.dark-theme .g-table tbody tr {
	border-color: var(--drkSectionBorder);
}
.dark-theme .g-table thead tr th,
.dark-theme .g-table tbody tr td {
	color: var(--drk01);
}
.dark-theme .g-table tbody tr td .g-underText span {
	color: var(--drk04);
}
.dark-theme .g-table tbody tr td.g-buy {
	color: var(--drkBuyStrong);
}
.dark-theme .g-table tbody tr td.g-sell {
	color: var(--drkSellStrong);
}

/* modal */
.dark-theme .modal .modal-content {
	background: var(--drkBg);
}
.dark-theme .modal .modal-content .col {
	background: var(--drkInputBg);
	color: var(--drkInputTxtSecondary);
}
.dark-theme .modal .modal-content .col.active,
.dark-theme .modal .modal-content.maxWidthCol .modal-body .col:hover {
	background: var(--drkInputBgActive);
	border-color: var(--drkInputBorderActive);
}
@media screen and (min-width: 992px) {
	.dark-theme .modal .modal-content .col:hover {
		background: var(--drkInputBgActive);
		border-color: var(--drkInputBorderActive);
	}
}
.dark-theme .modal .modal-content .col.empty:hover,
.dark-theme .modal .modal-content .col.empty.disable,
.dark-theme .modal .modal-content .col.disable:hover {
	background: var(--drkInputBg);
}
.dark-theme .modal .modal-content .g-mCancel-btn,
.dark-theme .modal .modal-content.setting .modal-header h4,
.dark-theme .modal .modal-content.setting .btn-box .cancel {
	color: var(--drk01);
}
.dark-theme .modal .modal-content.setting .tabBtn-cover .tabBtn {
	color: var(--drkTabBasic);
	border-color: var(--drkTabBasic);
}
.dark-theme .modal .modal-content.select .modal-footer,
.dark-theme .modal .modal-content.select-coin .modal-footer {
	border-color: var(--drkSectionDivider);
}
.dark-theme .modal .modal-content.setting.edit .modal-body textarea {
	background: var(--drkInputBg);
	border-color: var(--drkInputBorder);
	color: var(--drkInputTxtPrimary);
}
.dark-theme .modal .modal-content.setting.edit .modal-body .textCnt {
	color: var(--drk04);
}

/* dashboard.scss */
.dark-theme #dashboard .custom-row .custom-moblie-row .g-common-box .title,
.dark-theme #dashboard .custom-row .custom-moblie-row .g-common-box .text-contents,
.dark-theme #dashboard .custom-row .custom-moblie-row .g-common-box .barChart .state span,
.dark-theme #dashboard .custom-row .g-common-box .trend-contents .trend_text .row .col span,
.dark-theme #dashboard .custom-row .g-common-box .price-state ol li,
.dark-theme #dashboard .custom-row .g-common-box .realTime-contents .part-chart .row .title,
.dark-theme #dashboard .custom-row .g-common-box .realTime-contents .part-trend .line .state span,
.dark-theme #dashboard .custom-row .g-common-box .realTime-contents .part-trend .line .price span {
	color: var(--drk01);
}
.dark-theme #dashboard .custom-row .g-common-box .realTime-contents .part-chart .row .chart-cover .state,
.dark-theme #dashboard .custom-row .g-common-box .realTime-contents .part-chart .row .chart-cover .price span,
.dark-theme #dashboard .custom-row .g-common-box .realTime-contents .part-trend .line .price span.krw {
	color: var(--drk03);
}
.dark-theme #dashboard .custom-row .g-common-box .realTime-contents .part-trend .line .state span.Unknow,
.dark-theme #dashboard .custom-row .g-common-box .realTime-contents .part-chart .row .list-btn.inactive i {
	color: var(--drk04);
}
.dark-theme #dashboard .custom-row .g-common-box .situation-imgBox .countBox div {
	color: var(--drk00);
}
.dark-theme #dashboard .custom-row .g-common-box .realTime-contents .part-chart .row .list-btn.inactive i {
	border-color: var(--drk04);
}
.dark-theme #dashboard .custom-row .g-common-box .trend-contents .center-line {
	background: var(--drkSectionDivider);
}
.dark-theme #dashboard .custom-row .g-common-box .trend-contents .trend_text,
.dark-theme #dashboard .custom-row .g-common-box .realTime-contents .part-trend .line {
	border-color: var(--drkSectionDivider);
}
.dark-theme #dashboard .custom-row .g-common-box .trend-contents .trend_text .row .col span.strong.g-buy,
.dark-theme #dashboard .custom-row .g-common-box .realTime-contents .part-chart .row .chart-cover .state .main-state.g-buy,
.dark-theme #dashboard .custom-row .g-common-box .realTime-contents .part-trend .line .state span.g-buy {
	color: var(--drkBuyStrong);
}
.dark-theme #dashboard .custom-row .g-common-box .trend-contents .trend_text .row .col span.strong.g-sell,
.dark-theme #dashboard .custom-row .g-common-box .realTime-contents .part-chart .row .chart-cover .state .main-state.g-sell,
.dark-theme #dashboard .custom-row .g-common-box .realTime-contents .part-trend .line .state span.g-sell {
	color: var(--drkSellStrong);
}
.dark-theme #dashboard .custom-row .g-common-box .realTime-contents .part-chart .row .chart-cover .barChart span.buyStrong {
	background: var(--drkBuyStrong);
}
.dark-theme #dashboard .custom-row .g-common-box .realTime-contents .part-chart .row .chart-cover .barChart span.sellStrong {
	background: var(--drkSellStrong);
}
.dark-theme #dashboard .custom-row .g-common-box .trend-contents .trend_text .row .col span.strong.g-maintain {
	color: var(--drkNeutral);
}
.dark-theme #dashboard .custom-row .needle,
.dark-theme #dashboard .custom-row .needle-center {
	fill: #e6e7e7;
}

/* kimp.scss */
.dark-theme #kimp .g-common-box.main .exchange .col .priceBox div,
.dark-theme #kimp .g-common-box.table .title span {
	color: var(--drk01);
}
.dark-theme #kimp .g-common-box.main .exchange .col .priceBox span {
	color: var(--drk04);
}

/* notice.scss */
.dark-theme #notice .g-common-box h3,
.dark-theme #notice .g-common-box .notice-list {
	border-color: var(--drkSectionDivider);
}
.dark-theme #notice .g-common-box .notice-list:hover {
	background: var(--drkSectionBgHover);
}
.dark-theme #notice .g-common-box .no-notice,
.dark-theme #notice .g-common-box .notice-list .row .enrollment .title {
	color: var(--drk00);
}
.dark-theme #notice .g-common-box .notice-list .common-fontStyle,
.dark-theme #notice .g-common-box .notice-list .row .enrollment .user-response div,
.dark-theme #notice .g-common-box .notice-list .row .enrollment .lookup {
	color: var(--drk04);
}
.dark-theme #notice .g-common-box .pagination .page-item.Previous .page-link,
.dark-theme #notice .g-common-box .pagination .page-item.Previous .page-link:hover,
.dark-theme #notice .g-common-box .pagination .page-item.Next .page-link,
.dark-theme #notice .g-common-box .pagination .page-item.Next .page-link:hover {
	color: var(--drk02);
	border-color: var(--drk04);
}
.dark-theme #notice .g-common-box .pagination .page-item .page-link {
	color: var(--drk03);
}

/* noticeContents.scss */
.dark-theme #noticeContents .g-common-box h3,
.dark-theme #noticeContents .g-common-box .title .user-response,
.dark-theme #noticeContents .g-common-box .delete-content,
.dark-theme #noticeContents .g-common-box .another-post,
.dark-theme #noticeContents .g-common-box.comment h2,
.dark-theme #noticeContents .g-common-box.comment .comment-input,
.dark-theme #noticeContents .g-common-box.comment .more-comment {
	border-color: var(--drkSectionDivider);
}
.dark-theme #noticeContents .g-common-box .title p,
.dark-theme #noticeContents .g-common-box.comment h2,
.dark-theme #noticeContents .g-common-box.comment .opinion,
.dark-theme #noticeContents .g-common-box.comment .no-comment,
.dark-theme #noticeContents .g-common-box.comment-impossible {
	color: var(--drk00);
}
.dark-theme #noticeContents .g-common-box .title .user-response .d-flex div.writer,
.dark-theme #noticeContents .g-common-box .another-post p,
.dark-theme #noticeContents .g-common-box.comment .writer-info .row i,
.dark-theme #noticeContents .g-common-box.comment .writer-info .row span {
	color: var(--drk02);
}
.dark-theme #noticeContents .g-common-box .title .user-response .d-flex div,
.dark-theme #noticeContents .g-common-box .title .user-response .date,
.dark-theme #noticeContents .g-common-box.comment .comment-input .registration-box .textCnt,
.dark-theme #noticeContents .g-common-box.comment .another-user .user-clickEffect div,
.dark-theme #noticeContents .g-common-box.comment .another-user .date {
	color: var(--drk04);
}
.dark-theme #noticeContents .g-common-box.comment .writer-info .manage span {
	color: var(--drk03);
}
.dark-theme #noticeContents .g-common-box .main-content,
.dark-theme #noticeContents .g-common-box.comment .comment-input.userClick .d-flex .arrow,
.dark-theme #noticeContents .g-common-box.comment .comment-input .registration-box .edit .close-btn {
	color: var(--drk01);
}
.dark-theme #noticeContents .g-common-box .main-content .agree-btn,
.dark-theme #noticeContents .g-common-box .main-content .user-opinion div {
	background: var(--drk04);
}
.dark-theme #noticeContents .g-common-box.comment .comment-input textarea {
	background: var(--drkInputBg);
	border-color: var(--drkInputBorder);
	color: var(--drkInputTxtPrimary);
}
.dark-theme #noticeContents .g-common-box .main-content .user-opinion div.like.active {
	background: var(--drkLike);
}
.dark-theme #noticeContents .g-common-box .main-content .user-opinion div.hate.active {
	background: var(--drkHate);
}
.dark-theme #noticeContents .g-common-box.comment .another-user .user-clickEffect div.click-agree.like.active i {
	color: var(--drkLike);
}
.dark-theme #noticeContents .g-common-box.comment .another-user .user-clickEffect div.click-agree.hate.active i {
	color: var(--drkHate);
}
