/* MAIN PAGE */
.profile-info {
	position: relative;
}

.profile-info::before {
	content: '';
	position: absolute;
	top: 32px;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: var(--gray-50);
	z-index: 0;
	border-radius: 8px;
}

.profile-divider {
	height: 36px;
	border-left: 1px solid rgba(255, 255, 255, 0.3);
	padding-left: 0;
	flex-grow: 1;
}

.main-page-adv {
	background-image: url(/img/corp/home-recommended.png);
	background-size: contain;
	width: 185px;
	height: 185px;
	background-repeat: no-repeat;
}

.main-account-avatar {
	background-image: url(/img/corp/logo-shinhan.png);
    background-size: 32px;
    background-repeat: no-repeat;
    background-position: center;
    width: 32px;
    height: 32px;
}

/* Bank List  */
.bank-list, .bank-list * {
	box-sizing: border-box;	
}
.bank-list {
	width: 100%;
}

.bank-list-grid {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: var(--spacing-md);
}

.bank-list-grid .bank {
	width: 114px;
	height: 114px;
	border: 1px solid var(--gray-200);
	padding: var(--spacing-xl) var(--spacing-lg);
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: var(--spacing-md);
	font-weight: var(--font-weight-medium);
	font-size: var(--font-detaill-s);
    line-height: var(--font-line-height-150);
    letter-spacing: var(--font-letter-spacing-2);
    color: var(--gray-700);
    text-align: center;
}

.bank-list-grid .bank:hover,
.bank-list-grid .bank:focus,
.bank-list-grid .bank:active {
	border-color: var(--brand-500);
}

/* FAVORITE MENU*/
.favorite-menu-wrapper .checkbox-sm .w2checkbox_td_label .w2checkbox_label {
	font-size: var(--font-body-s) !important;
	line-height: var(--font-line-height-150) !important;
	letter-spacing: var(--font-letter-spacing-2) !important;
	color: var(--gray-900) !important;
}

.favorite-menu-wrapper .w2checkbox_main tbody {
	display: flex;
    flex-direction: column;
    gap: 14px;
}

/* ------------------------------------------------------------ RESPONSIVE STYLES ------------------------------------------------------------ */
/* MAIN PAGE */
@media screen and (max-width: 768px) {	
	.profile-divider {
		height: unset;
		border-left: none;
		border-top: 1px solid rgba(255, 255, 255, 0.3);
		padding-top: 0;
		width: 100%;
		margin: 4px 0;
	}
}
