@import url("/common/font/Pretendard.css"); /* Pretendard 공통 폰트 설정 */ 
@import url("/common/css/component.css");
@import url("/common/css/variable_group.css");

:root {
	/* font */
	color:var(--main-font-color);
	font-weight:300 !important;
	font-family: 'Pretendard', 'sans-serif' !important;
}

[data-bs-theme=light] > body .container-fluid .header-wrap #logo { background:url('/common/img/logo.png')no-repeat; background-size:contain; width:120px; } 
[data-bs-theme=dark] > body .container-fluid .header-wrap #logo { background:url('/common/img/logo-white.png')no-repeat; background-size:contain; width:120px;  }  


/* 인플루언서 회원가입 top link box */
.signup-link-box { border:1px solid var(--base-stroke-color); border-radius:5px; background:#FDFDFD; padding:5px; }
.signup-link-box a { font-size:14px; color:var(--main-font-color); line-height:var(--common-line-height); letter-spacing:var(--common-letter-spacing); text-decoration:none; font-weight:500; width:100%; display:flex; align-items:center; justify-content:center; padding:10px; border-radius:5px; }
.signup-link-box a.active { background:#EEEEEE; }
.pre { white-space: pre-wrap; }

/* btn bg color */
.btn-bg-orange { background:#F28729 !important; border:1px solid #F28729 !important;  color:#fff !important; }
.btn-bg-blue { background:#3868A6 !important; border:1px solid #3868A6 !important; color:#fff !important; }
.btn-bg-naver { background:#06C85D !important; border:1px solid #06C85D !important; color:#fff !important; }
.btn-bg-kakao { background:#FEE500 !important; border:1px solid #FEE500 !important; color:var(--main-font-color) !important; }
.btn-line-blue { border:1px solid #3868A6 !important; color:#3868A6; background:rgba(255,255,255,0) !important; }
.btn-bg-gray { background:#EDEDED !important; border:1px solid #EDEDED !important; color:var(--main-font-color) !important; }
.btn-bg-dark { background:#616161 !important; border:1px solid #616161 !important; color:#fff !important; }
.btn-bg-bluegray { background:#4F6273 !important; border:1px solid #4F6273 !important; color:#fff !important; }

/* font-size */
.font-14 { font-size:14px !important; }
.font-12 { font-size:12px !important; }

/* font-color */
.font-blue { color:#3868A6 !important; }
.font-gray { color:#666666 !important; }
.font-orange { color:#954A08 !important; }
.font-red { color:#FF3535 !important; }

/* icon-size */
.icon-size-20 { width:20px !important; height:20px !important; }

.max-width { max-width: 400px !important; }
.max-width-100 { max-width:100px !important; }
.max-width-150 { max-width:150px !important; }
.max-width-1000 { max-width: 1000px !important; }


.bd-placeholder-img
{
	font-size: 1.125rem;
	text-anchor: middle;
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
}

a { text-decoration:none; color:var(--main-font-color); }
#sort { min-width:150px !important;} 


@media (min-width: 768px)
{
	.bd-placeholder-img-lg { 
		font-size: 3.5rem;
	}
}

.b-example-divider
{
	width: 100%;
	height: 3rem;
	background-color: rgba(0, 0, 0, .1);
	border: solid rgba(0, 0, 0, .15);
	border-width: 1px 0;
	box-shadow: inset 0 .5em 1.5em rgba(0, 0, 0, .1), inset 0 .125em .5em rgba(0, 0, 0, .15);
}

.b-example-vr
{
	flex-shrink: 0;
	width: 1.5rem;
	height: 100vh;
}

.bi
{
	vertical-align: -.125em;
	fill: currentColor;
}

.nav-scroller
{
	position: relative;
	z-index: 2;
	height: 2.75rem;
	overflow-y: hidden;
}

.nav-scroller .nav
{
	display: flex;
	flex-wrap: nowrap;
	padding-bottom: 1rem;
	margin-top: -1px;
	overflow-x: auto;
	text-align: center;
	white-space: nowrap;
	-webkit-overflow-scrolling: touch;
}

.btn-bd-primary
{
	--bd-violet-bg: #712cf9;
	--bd-violet-rgb: 112.520718, 44.062154, 249.437846;

	--bs-btn-font-weight: 600;
	--bs-btn-color: var(--bs-white);
	--bs-btn-bg: var(--bd-violet-bg);
	--bs-btn-border-color: var(--bd-violet-bg);
	--bs-btn-hover-color: var(--bs-white);
	--bs-btn-hover-bg: #6528e0;
	--bs-btn-hover-border-color: #6528e0;
	--bs-btn-focus-shadow-rgb: var(--bd-violet-rgb);
	--bs-btn-active-color: var(--bs-btn-hover-color);
	--bs-btn-active-bg: #5a23c8;
	--bs-btn-active-border-color: #5a23c8;
}

.bd-mode-toggle
{
	z-index: 1500;
}

.bd-mode-toggle .dropdown-menu .active .bi
{
	display: block !important;
}




/*---------------------------- Custom CSS dy---------------------------*/

.header-wrap { border-bottom: 1px solid #ededed; padding: 15px 0 !important; }
.custom-bi { display: inline-block; width: 30px !important; height: 30px !important; font-size: 26px; }
.custom-bi::before {  vertical-align: 0 !important;}

.custom-sidebar { height: calc(100vh - 62px); max-height: calc(100vh - 62px); overflow-y: auto; background: rgba(0,0,0,.02); }
.custom-sidebar .custom-list { width: 100%; }
.custom-sidebar .custom-list > .mb-1 { border-radius: 5px; }
.custom-sidebar .custom-list > .mb-1 button { width: 100%; }
.custom-sidebar .custom-list > .mb-1 button:hover { background:#ededed !important; }
.custom-sidebar .custom-list > .mb-1 .btn-toggle[aria-expanded="true"] { background: rgba(0,0,0,.05) !important; border-radius: 5px 5px 0 0 !important;}
.custom-sidebar .custom-list > .mb-1 .btn-toggle[aria-expanded="true"] + div > ul { background: rgba(0,0,0,.05) !important; border-radius: 0 0 5px 5px !important;}
.custom-sidebar .custom-list > .mb-1 .btn-toggle[aria-expanded="true"] + div > ul > li > a { display: inline-block; width: 85%; border-radius: 5px; }
.custom-sidebar .custom-list > .mb-1 button + div > ul > li > a.on { background:rgba(255,255,255,.6) }

main { overflow-y: auto; height: calc(100vh - 62px) !important; max-height: calc(100vh - 48px) !important; padding: 20px !important; } 





/* Front Page Common CSS dy 250726 */
body { background:#F9F9F9; }
	/* Hamberger menu css */
	@media all and (min-width:360px) and (max-width:767px) {
		.offcanvas { width:90vw !important; }
	}
	.nav-item { padding:0; }
	.nav-item .nav-link { display:inline-block; font-size:18px; font-weight:600; color:var(--nav-off-color); width:100%; padding:18px 15px;}
	.nav-item .nav-link:hover { color:var(--nav-on-color); }
	.nav-item .nav-link.active { font-size:18px; font-weight:600; color:var(--nav-on-color); }