/* ====== 공통 색상 변수 덮어쓰기 ====== */
:root {
  --bs-primary: #3688FC;
  --bs-primary-rgb: 54, 136, 252;

  --bs-info: #44BADC;
  --bs-info-rgb: 68, 186, 220;

  --bs-secondary: #CED4DA;
  --bs-secondary-rgb: 206, 212, 218;

  --bs-light: #303D4E;
  --bs-light-rgb: 48, 61, 78;

  --bs-success: #1CEAAC;
  --bs-success-rgb: 28, 234, 172;

  --bs-dark: #EEEEEE;
  --bs-dark-rgb: 238, 238, 238;

  --bs-danger: #FA6767;
  --bs-danger-rgb: 250, 103, 103;

  --bs-warning: #FFBC00;
  --bs-warning-rgb: 255, 188, 0;

  --bs-cprimary: #3688FC;
  --bs-cprimary-rgb: 54, 136, 252;

  --bs-cinfo: #44BADC;
  --bs-cinfo-rgb: 68, 186, 220;

  --bs-csecondary: #CED4DA;
  --bs-csecondary-rgb: 206, 212, 218;

  --bs-clight: #303D4E;
  --bs-clight-rgb: 48, 61, 78;

  --bs-csuccess: #1CEAAC;
  --bs-csuccess-rgb: 28, 234, 172;

  --bs-cdark: #EEEEEE;
  --bs-cdark-rgb: 238, 238, 238;

  --bs-cdanger: #FA6767;
  --bs-cdanger-rgb: 250, 103, 103;

  --bs-cwarning: #FFBC00;
  --bs-cwarning-rgb: 255, 188, 0;

  /* custom */
  --bs-content: #A655B2;
  --bs-content-rgb: 166, 85, 178;
  
  --bs-deepdark: #212529;
}

/* ====== 버튼 색상 재정의 ====== */
.btn-primary {
  --bs-btn-bg: var(--bs-primary);
  --bs-btn-border-color: var(--bs-primary);
  --bs-btn-hover-bg: rgba(var(--bs-primary-rgb), 0.85);
  --bs-btn-hover-border-color: rgba(var(--bs-primary-rgb), 0.85);
  --bs-btn-active-bg: rgba(var(--bs-primary-rgb), 0.75);
  --bs-btn-active-border-color: rgba(var(--bs-primary-rgb), 0.75);
}

.btn-info {
  --bs-btn-bg: var(--bs-info);
  --bs-btn-border-color: var(--bs-info);
  --bs-btn-hover-bg: rgba(var(--bs-info-rgb), 0.85);
  --bs-btn-hover-border-color: rgba(var(--bs-info-rgb), 0.85);
  --bs-btn-active-bg: rgba(var(--bs-info-rgb), 0.75);
  --bs-btn-active-border-color: rgba(var(--bs-info-rgb), 0.75);
}

.btn-secondary {
  --bs-btn-bg: var(--bs-secondary);
  --bs-btn-border-color: var(--bs-secondary);
  --bs-btn-hover-bg: rgba(var(--bs-secondary-rgb), 0.85);
  --bs-btn-hover-border-color: rgba(var(--bs-secondary-rgb), 0.85);
  --bs-btn-active-bg: rgba(var(--bs-secondary-rgb), 0.75);
  --bs-btn-active-border-color: rgba(var(--bs-secondary-rgb), 0.75);
}

.btn-light {
  --bs-btn-bg: var(--bs-light);
  --bs-btn-border-color: var(--bs-light);
  --bs-btn-hover-bg: rgba(var(--bs-light-rgb), 0.85);
  --bs-btn-hover-border-color: rgba(var(--bs-light-rgb), 0.85);
  --bs-btn-active-bg: rgba(var(--bs-light-rgb), 0.75);
  --bs-btn-active-border-color: rgba(var(--bs-light-rgb), 0.75);
}

.btn-success {
  --bs-btn-bg: var(--bs-success);
  --bs-btn-border-color: var(--bs-success);
  --bs-btn-hover-bg: rgba(var(--bs-success-rgb), 0.85);
  --bs-btn-hover-border-color: rgba(var(--bs-success-rgb), 0.85);
  --bs-btn-active-bg: rgba(var(--bs-success-rgb), 0.75);
  --bs-btn-active-border-color: rgba(var(--bs-success-rgb), 0.75);
}

.btn-dark {
  --bs-btn-bg: var(--bs-dark);
  --bs-btn-border-color: var(--bs-dark);
  --bs-btn-hover-bg: rgba(var(--bs-dark-rgb), 0.85);
  --bs-btn-hover-border-color: rgba(var(--bs-dark-rgb), 0.85);
  --bs-btn-active-bg: rgba(var(--bs-dark-rgb), 0.75);
  --bs-btn-active-border-color: rgba(var(--bs-dark-rgb), 0.75);
}

.btn-danger {
  --bs-btn-bg: var(--bs-danger);
  --bs-btn-border-color: var(--bs-danger);
  --bs-btn-hover-bg: rgba(var(--bs-danger-rgb), 0.85);
  --bs-btn-hover-border-color: rgba(var(--bs-danger-rgb), 0.85);
  --bs-btn-active-bg: rgba(var(--bs-danger-rgb), 0.75);
  --bs-btn-active-border-color: rgba(var(--bs-danger-rgb), 0.75);
}

.btn-warning {
  --bs-btn-bg: var(--bs-warning);
  --bs-btn-border-color: var(--bs-warning);
  --bs-btn-hover-bg: rgba(var(--bs-warning-rgb), 0.85);
  --bs-btn-hover-border-color: rgba(var(--bs-warning-rgb), 0.85);
  --bs-btn-active-bg: rgba(var(--bs-warning-rgb), 0.75);
  --bs-btn-active-border-color: rgba(var(--bs-warning-rgb), 0.75);
}




.btn-cprimary {
  --bs-btn-bg: var(--bs-cprimary);
  --bs-btn-border-color: var(--bs-cprimary);
  --bs-btn-hover-bg: rgba(var(--bs-cprimary-rgb), 0.85);
  --bs-btn-hover-border-color: rgba(var(--bs-cprimary-rgb), 0.85);
  --bs-btn-active-bg: rgba(var(--bs-cprimary-rgb), 0.75);
  --bs-btn-active-border-color: rgba(var(--bs-cprimary-rgb), 0.75);
}

.btn-cinfo {
  --bs-btn-bg: var(--bs-cinfo);
  --bs-btn-border-color: var(--bs-cinfo);
  --bs-btn-hover-bg: rgba(var(--bs-cinfo-rgb), 0.85);
  --bs-btn-hover-border-color: rgba(var(--bs-cinfo-rgb), 0.85);
  --bs-btn-active-bg: rgba(var(--bs-cinfo-rgb), 0.75);
  --bs-btn-active-border-color: rgba(var(--bs-cinfo-rgb), 0.75);
}

.btn-csecondary {
  --bs-btn-bg: var(--bs-csecondary);
  --bs-btn-border-color: var(--bs-csecondary);
  --bs-btn-hover-bg: rgba(var(--bs-csecondary-rgb), 0.85);
  --bs-btn-hover-border-color: rgba(var(--bs-csecondary-rgb), 0.85);
  --bs-btn-active-bg: rgba(var(--bs-csecondary-rgb), 0.75);
  --bs-btn-active-border-color: rgba(var(--bs-csecondary-rgb), 0.75);
}

.btn-clight {
  --bs-btn-bg: var(--bs-clight);
  --bs-btn-border-color: var(--bs-clight);
  --bs-btn-hover-bg: rgba(var(--bs-clight-rgb), 0.85);
  --bs-btn-hover-border-color: rgba(var(--bs-clight-rgb), 0.85);
  --bs-btn-active-bg: rgba(var(--bs-clight-rgb), 0.75);
  --bs-btn-active-border-color: rgba(var(--bs-clight-rgb), 0.75);
}

.btn-csuccess {
  --bs-btn-bg: var(--bs-csuccess);
  --bs-btn-border-color: var(--bs-csuccess);
  --bs-btn-hover-bg: rgba(var(--bs-csuccess-rgb), 0.85);
  --bs-btn-hover-border-color: rgba(var(--bs-csuccess-rgb), 0.85);
  --bs-btn-active-bg: rgba(var(--bs-csuccess-rgb), 0.75);
  --bs-btn-active-border-color: rgba(var(--bs-csuccess-rgb), 0.75);
}

.btn-cdark {
  --bs-btn-bg: var(--bs-cdark);
  --bs-btn-border-color: var(--bs-cdark);
  --bs-btn-hover-bg: rgba(var(--bs-cdark-rgb), 0.85);
  --bs-btn-hover-border-color: rgba(var(--bs-cdark-rgb), 0.85);
  --bs-btn-active-bg: rgba(var(--bs-cdark-rgb), 0.75);
  --bs-btn-active-border-color: rgba(var(--bs-cdark-rgb), 0.75);
}

.btn-cdanger {
  --bs-btn-bg: var(--bs-cdanger);
  --bs-btn-border-color: var(--bs-cdanger);
  --bs-btn-hover-bg: rgba(var(--bs-cdanger-rgb), 0.85);
  --bs-btn-hover-border-color: rgba(var(--bs-cdanger-rgb), 0.85);
  --bs-btn-active-bg: rgba(var(--bs-cdanger-rgb), 0.75);
  --bs-btn-active-border-color: rgba(var(--bs-cdanger-rgb), 0.75);
}

.btn-cwarning {
  --bs-btn-bg: var(--bs-cwarning);
  --bs-btn-border-color: var(--bs-cwarning);
  --bs-btn-hover-bg: rgba(var(--bs-cwarning-rgb), 0.85);
  --bs-btn-hover-border-color: rgba(var(--bs-cwarning-rgb), 0.85);
  --bs-btn-active-bg: rgba(var(--bs-cwarning-rgb), 0.75);
  --bs-btn-active-border-color: rgba(var(--bs-cwarning-rgb), 0.75);
}

.btn-outline-danger {
	--bs-btn-color: var(--bs-danger);
	--bs-btn-border-color: var(--bs-danger);
	--bs-btn-hover-color: #fff;
	--bs-btn-hover-bg: rgba(var(--bs-danger-rgb), 0.5);
	--bs-btn-hover-border-color: var(--bs-danger);
	--bs-btn-focus-shadow-rgb: 220, 53, 69;
	--bs-btn-active-color: #fff;
	--bs-btn-active-bg: var(--bs-danger);
	--bs-btn-active-border-color: var(--bs-danger);
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: var(--bs-danger);
	--bs-btn-disabled-bg: transparent;
	--bs-btn-disabled-border-color: var(--bs-danger);
	--bs-gradient: none;
}

.btn-outline-cdanger {
	--bs-btn-color: var(--bs-cdanger);
	--bs-btn-border-color: var(--bs-cdanger);
	--bs-btn-hover-color: var(--bs-cdanger);
	--bs-btn-hover-bg: rgba(var(--bs-cdanger-rgb), 0.5);
	--bs-btn-hover-border-color: var(--bs-cdanger);
	--bs-btn-focus-shadow-rgb: 220, 53, 69;
	--bs-btn-active-color: #fff;
	--bs-btn-active-bg: var(--bs-cdanger);
	--bs-btn-active-border-color: var(--bs-cdanger);
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: var(--bs-cdanger);
	--bs-btn-disabled-bg: transparent;
	--bs-btn-disabled-border-color: var(--bs-cdanger);
	--bs-gradient: none;
}

.btn-outline-primary {
	--bs-btn-color: var(--bs-primary);
	--bs-btn-border-color: var(--bs-primary);
	--bs-btn-hover-color: #fff;
	--bs-btn-hover-bg: rgba(var(--bs-primary-rgb), 0.5);
	--bs-btn-hover-border-color: var(--bs-primary);
	--bs-btn-focus-shadow-rgb: 220, 53, 69;
	--bs-btn-active-color: #fff;
	--bs-btn-active-bg: var(--bs-primary);
	--bs-btn-active-border-color: var(--bs-primary);
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: var(--bs-primary);
	--bs-btn-disabled-bg: transparent;
	--bs-btn-disabled-border-color: var(--bs-primary);
	--bs-gradient: none;
}

.btn-outline-info {
	--bs-btn-color: var(--bs-info);
	--bs-btn-border-color: var(--bs-info);
	--bs-btn-hover-color: #fff;
	--bs-btn-hover-bg: rgba(var(--bs-info-rgb), 0.5);
	--bs-btn-hover-border-color: var(--bs-info);
	--bs-btn-focus-shadow-rgb: 220, 53, 69;
	--bs-btn-active-color: #fff;
	--bs-btn-active-bg: var(--bs-info);
	--bs-btn-active-border-color: var(--bs-info);
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: var(--bs-info);
	--bs-btn-disabled-bg: transparent;
	--bs-btn-disabled-border-color: var(--bs-info);
	--bs-gradient: none;
}



.btn-outline-login{
	--bs-btn-color: var(--bs-secondary);
	--bs-btn-border-color: var(--bs-secondary);
	--bs-btn-hover-color: #fff;
	--bs-btn-hover-bg: rgba(var(--bs-secondary-rgb), 0.5);
	--bs-btn-hover-border-color: var(--bs-secondary);
	--bs-btn-focus-shadow-rgb: 220, 53, 69;
	--bs-btn-active-color: #fff;
	--bs-btn-active-bg: var(--bs-secondary);
	--bs-btn-active-border-color: var(--bs-secondary);
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: var(--bs-secondary);
	--bs-btn-disabled-bg: transparent;
	--bs-btn-disabled-border-color: var(--bs-secondary);
	--bs-gradient: none;
}

/* ====== 배경색 / 텍스트색 재정의 ====== */
/* 텍스트 #FFFFFF */
.bg-primary, .bg-info, .bg-light, .bg-danger, .bg-content, 
.bg-cprimary, .bg-cinfo, .bg-clight, .bg-cdanger, .bg-ccontent, 
.btn-primary, .btn-info, .btn-light, .btn-danger,
.btn-cprimary, .btn-cinfo, .btn-clight, .btn-cdanger {
  color: #FFFFFF !important;
}

/* 텍스트 #071125 */
.bg-secondary, .bg-success, .bg-dark, .bg-warning, 
.bg-csecondary, .bg-csuccess, .bg-cdark, .bg-cwarning, 
.btn-secondary, .btn-success, .btn-dark, .btn-warning,
.btn-csecondary, .btn-csuccess, .btn-cdark, .btn-cwarning {
  color: #071125 !important;
}


.bg-primary   { background-color: var(--bs-primary) !important; }
.bg-info      { background-color: var(--bs-info) !important; }
.bg-secondary { background-color: var(--bs-secondary) !important; }
.bg-light     { background-color: var(--bs-light) !important; }
.bg-success   { background-color: var(--bs-success) !important; }
.bg-dark      { background-color: var(--bs-dark) !important; }
.bg-danger    { background-color: var(--bs-danger) !important; }
.bg-warning   { background-color: var(--bs-warning) !important; }
.bg-content   { background-color: var(--bs-content) !important; }
.bg-deepdark  { background-color: var(--bs-deepdark) !important; }
.bg-none      { background-color: #071125; }

.bg-cprimary   { background-color: var(--bs-primary) !important; }
.bg-cinfo      { background-color: var(--bs-info) !important; }
.bg-csecondary { background-color: var(--bs-secondary) !important; }
.bg-clight     { background-color: var(--bs-light) !important; }
.bg-csuccess   { background-color: var(--bs-success) !important; }
.bg-cdark      { background-color: var(--bs-dark) !important; }
.bg-cdanger    { background-color: var(--bs-danger) !important; }
.bg-cwarning   { background-color: var(--bs-warning) !important; }
.bg-ccontent   { background-color: var(--bs-content) !important; }
.bg-cdeepdark  { background-color: var(--bs-deepdark) !important; }
.bg-cnone      { background-color: #071125; }


/* ====== 텍스트 색상 클래스 ====== */
.text-primary   { color: var(--bs-primary) !important; } 
.text-info      { color: var(--bs-info) !important; }
.text-secondary { color: var(--bs-secondary) !important; }
.text-light     { color: var(--bs-light) !important; }
.text-success   { color: var(--bs-success) !important; }
.text-dark      { color: var(--bs-dark) !important; }
.text-danger    { color: var(--bs-danger) !important; }
.text-warning   { color: var(--bs-warning) !important; }
.text-content   { color: var(--bs-content) !important; }

.text-red       { color: #FF0000 !important; }

/* ====== Alert 색상 재정의 ====== */
.alert-primary   { --bs-alert-bg: var(--bs-primary); --bs-alert-border-color: var(--bs-primary); color: #fff; }
.alert-info      { --bs-alert-bg: var(--bs-info); --bs-alert-border-color: var(--bs-info); color: #fff; }
.alert-secondary { --bs-alert-bg: var(--bs-secondary); --bs-alert-border-color: var(--bs-secondary); color: #071125; }
.alert-light     { --bs-alert-bg: var(--bs-light); --bs-alert-border-color: var(--bs-light); background-color: var(--bs-light); color: #fff; }
.alert-success   { --bs-alert-bg: var(--bs-success); --bs-alert-border-color: var(--bs-success); color: #071125; }
.alert-dark      { --bs-alert-bg: var(--bs-dark); --bs-alert-border-color: var(--bs-dark); color: #071125; }
.alert-danger    { --bs-alert-bg: var(--bs-danger); --bs-alert-border-color: var(--bs-danger); color: #fff; }
.alert-warning   { --bs-alert-bg: var(--bs-warning); --bs-alert-border-color: var(--bs-warning); color: #071125; }


.border-primary   { --bs-border-opacity: 1; border-color:rgba(var(--bs-primary-rgb), var(--bs-border-opacity)) !important}
.border-info      { --bs-border-opacity: 1; border-color:rgba(var(--bs-info-rgb), var(--bs-border-opacity)) !important; }
.border-secondary { --bs-border-opacity: 1; border-color:rgba(var(--bs-secondary-rgb), var(--bs-border-opacity)) !important; }
.border-light     { --bs-border-opacity: 1; border-color:rgba(var(--bs-light-rgb), var(--bs-border-opacity)) !important; }
.border-success   { --bs-border-opacity: 1; border-color:rgba(var(--bs-success-rgb), var(--bs-border-opacity)) !important; }
.border-dark      { --bs-border-opacity: 1; border-color:rgba(var(--bs-dark-rgb), var(--bs-border-opacity)) !important; }
.border-danger    { --bs-border-opacity: 1; border-color:rgba(var(--bs-danger-rgb), var(--bs-border-opacity)) !important; }
.border-warning   { --bs-border-opacity: 1; border-color:rgba(var(--bs-warning-rgb), var(--bs-border-opacity)) !important; }
.border-content   { --bs-border-opacity: 1; border-color:rgba(var(--bs-content-rgb), var(--bs-border-opacity)) !important; }
/*.border-menu      { --bs-border-opacity: 1; border-color: rgba((45,53,72,1), var(--bs-border-opacity)) !important; }*/

.badge-outline-content {
	color: #A655B2 ;
	border: 1px solid #A655B2 ;
	background-color: transparent;
}

.badge-outline-danger {
	color: #FA6767 ;
	border: 1px solid #FA6767 ;
	background-color: transparent;
}

.badge-outline-info {
	color: #44BADC ;
	border: 1px solid #44BADC ;
	background-color: transparent;
}

.badge-outline-warning {
	color: #FFBC00 ;
	border: 1px solid #FFBC00 ;
	background-color: transparent;
}

.badge-outline-secondary {
	color: #CED4DA ;
	border: 1px solid #CED4DA ;
	background-color: transparent;
}

.badge-outline-light {
	color: #303D4E ;
	border: 1px solid #303D4E ;
	background-color: transparent;
}

.badge-outline-success {
	color: #1CEAAC ;
	border: 1px solid #1CEAAC ;
	background-color: transparent;
}

.badge-outline-dark {
	color: #EEEEEE ;
	border: 1px solid #EEEEEE ;
	background-color: transparent;
}

.badge-outline-post {
	color: #C97B2A ;
	border: 1px solid #C97B2A ;
	background-color: transparent;
}

.badge-outline-code-post {
	color: #D8A657 ;
	border: 1px solid #D8A657 ;
	background-color: transparent;
}

.bg-table-dark {
	background-color: #191919;
}

.table-dark {
	--bs-table-color: #fff;
	--bs-table-bg: #191919;
	--bs-table-border-color: #45494D;
	--bs-table-striped-bg: rgb(44.1, 47.9, 51.7);
	--bs-table-striped-color: #fff;
	--bs-table-active-bg: rgb(55.2, 58.8, 62.4);
	--bs-table-active-color: #fff;
	--bs-table-hover-bg: rgb(49.65, 53.35, 57.05);
	--bs-table-hover-color: #fff;
	color: var(--bs-table-color);
	border-color: var(--bs-table-border-color);
	background-color: var(--bs-table-bg);
}

.table-light {
	--bs-table-color: #fff;
	--bs-table-bg: var(--bs-light);
	--bs-table-border-color: #45494D;
	color: var(--bs-table-color);
	border-color: var(--bs-table-border-color);
	background-color: var(--bs-table-bg);
}

.pagination-lg{
	--bs-pagination-border-radius: 0;
}

.bg-label{
	background-color: #313E4F;
	color: #FFFFFF;
}

.bg-wait{
	background-color: #464F5B;
	color: #FFFFFF;
}

.border-solid{
	border: solid;
}

.table > :not(caption) > * > *{
	background:#191919;
}

.table th{
	background:#303D4E;
}

.row-card > *{
/*	background: #191919 !important;*/
}

.py-1{
	padding: 8px 0px;
}

.won:before{
	content: "\20a9";
}

.m-won:before{
	content: "- \20a9";
}


.percent{
	font-family: "Noto Sans KR", sans-serif;
	letter-spacing:-0.02em;
	font-size:0.875rem;
	font-weight:600;
}

.price{
	font-family: "Noto Sans KR", sans-serif;
	letter-spacing:-0.02em;
}

.num{
	font-family: "Noto Sans KR", sans-serif;
}

.old-price {
	font-family: "Noto Sans KR", sans-serif;
	font-size: 0.625rem;
	color: #CED4DA;
}

.current-price{
	font-family: "Noto Sans KR", sans-serif;
	font-size:0.875rem;
	font-weight:600;
}

.card-price{
	font-family: "Noto Sans KR", sans-serif;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	line-height: 0.75rem;
}


.btn-allview{
	font-size: 0.57875rem;
	font-weight: bold;
	height: 1.5rem;
	padding: 0px 8px;
}

.product-card{
	background: #191919 !important;
}

.product-card.card{
	margin: 0.25rem;
}

.product-card .card-badge{
	padding: 0.25rem;
	height: 2.5rem;
}

.product-card .card-badge .badge{
	font-size: 0.625rem;
	height: 1.5rem;
	margin-right: 0.25rem;
}

.product-card .card-header{
	background: #303D4E;
	font-size: 0.75rem;
	padding: 0.25rem;
}

.card.product-card .card-body{
	padding: 0.25rem;
}


.num {
	font-family: "Noto Sans KR", sans-serif;
}

#appCapsule{
	padding-top: 56px;
}

#main_banner .badge{
	height: 2rem;
	margin-right: 0.25rem;
	margin-top: 0.25rem;
	font-size: 0.75rem;
}

#main_banner .status_badge{
	display: flex;
	flex-wrap: wrap-reverse;
	flex-direction: row;
}

#main_banner .status_price{
	display: flex;
	justify-content: flex-end;
}

#main_banner s{
	color: #CCCCCC;
	font-size: 0.625rem;
	line-height: 1rem;
}

#main_banner .status_price span{
	font-size: 0.875rem;
	line-height: 1rem;
}

#notice_section{
	margin: 1rem 0;
}

#notice_section .notice_subject, #notice_section .notice_date{
	color: #FFFFFF;
	font-size: 0.75rem;
	vertical-align: text-top;
}

#notice_section .notice_icon{
	padding: 0.25rem 0.5rem 0.25rem 0;
}
#notice_section #notice{
	display: flex;
	align-items: center;
}

#notice_section .notice_div{
	height:2.5rem;
}

#notice_section .splide{
}


#recommand_list {
	padding: 0 0.5rem;
}

#recommand_list ul{
	padding: 0 0.5rem;
}


#main_best {
	padding: 0 0.75rem;
}


#main_new {
	padding: 0 0.75rem;
}

#main_preorder {
	padding: 0 0.75rem;
}

.event_banner{
	padding: 0 0.75rem;
}



#publisher_list {
	padding: 0 0.5rem;
}

#publisher_list .card{
	margin: 0.25rem;
	background: #303D4E;
}

#publisher_list .card .card-header{
	min-height: 2.5rem;
	align-content: center;
	padding: 0px 1rem;
}

#publisher_list .card .card-header span{
	color: #CED4DA;
	font-size: 0.75rem;
}

#spoken_korean{
	padding: 0 0.5rem;
}

#spoken_korean .card{
	margin-bottom: 0.5rem;
}

#spoken_korean .card-body .product-info{
	padding: 0.25rem !important;
}

#spoken_korean > *{
	overflow: hidden;
}

.grey-footer{
	background: #303D4E !important;
	color: #CED4DA;
}

.grey-footer .sns{
	border-color: rgba(206, 212, 218, 0.5) !important;
	color: #FFFFFF;
}

.grey-footer .nav{
	font-size: 0.875rem;
	justify-content: space-between;
	padding: 0;
}

.grey-footer ul a{
	padding: 0;
}

.row-card{
	margin: 0.5rem 0;
}

.row-card .card-body{
	background: #191919;
}

.row-card .badge{
	font-size: 0.8125rem;
	margin-right:0.25rem;
}

.row-card .card-tail .percent{
	margin-right:0.5rem;
	padding: 0.85rem 0.25rem;
}

.row-card .img{
/*	padding: 0.25rem 0;*/
	padding: 0;
}

.row-card .badge .card-title{
	font-size: 0.625rem;
}

.row-card .product_name{
	font-size: 0.875rem;
	color: #CED4DA;
}
.row-card .card-tail{
	background: #303D4E;
}

.row-card .card-badge, .row-card .card-price{
	height: 2.5rem;
	background: #303D4E;
}

.row-card .card-badge .badge{
	font-size: 0.625rem
}

.row-card .card-badge{
	border-top: 1px solid #464F5B;
}

.row-card .card-badge, .row-card .card-price{
	padding: 0.25rem;
}

.row-card .product-info{
	padding: 0.25rem;
}
.row-card .card-title .badge{
	font-size: 0.625rem;
}

#topBtn {
}
#topBtn.show {
	display: block;
}

.button.goTop{
	position: fixed;
	display: none;
	bottom: 70px;
	left: 50%;
	width: 50px;
	height: 50px;
	font-size: 14px;
	border: none;
	background: #1B1B1B;
	color: #CED4DA;
	cursor: pointer;
	transform: translate(-50%, 0);
	transition: opacity 0.3s ease;
	z-index: 99;
	border-radius: 0.25em;
	margin-bottom:env(safe-area-inset-bottom);
	flex-direction: column;
}

.button.goTop:hover,.button.goTop:active{
	background:#617085
}

.button.goTop.show{
	display:flex
	flex-direction: column;
}

.appFooter{
	margin-bottom: 5rem;
}

.card .card-img-overlay{
	background: rgba(0, 0, 0, 0.1);
}