/******************************************************/
/****************Component - Link-box******************/
/******************************************************/
:root{
    --linkbox-gap: 20px;
    --linkbox-width: 436px;
    --linkbox-height: 290px;
}
.nhn-dev-portal-link-box-list {
    list-style: none;
    padding: 0;
}
.nhn-dev-portal-link-box-list-headline {
    margin-top: 0;
}
html.day-mode .nhn-dev-portal-link-box-list-headline{
    color: var(--color-gray-dark);
}
html.night-mode .nhn-dev-portal-link-box-list-headline{
    color: var(--color-gray-white);
}
.nhn-dev-portal-link-box-list-row {
    position: relative;
    float: left;
    width: 100%;
    gap: var(--linkbox-gap);
}
.nhn-dev-portal-link-box {
    position: relative;
    float: left;
    box-sizing: border-box;
    margin-right: var(--size-12);
    margin-bottom: var(--size-12);
    display: flex;
    width: var(--linkbox-width);
    border-radius: 25px;
    min-height: 80px;
    cursor: pointer;
}
.nhn-dev-portal-link-box-inner-wrap{
    padding: 20px;
    text-decoration: none;
    width: 100%;
}
html.day-mode .nhn-dev-portal-link-box{
    background-color: var(--color-green-secondary);
}
html.night-mode .nhn-dev-portal-link-box{
    background-color: var(--color-green-primary);
}
html.night-mode .nhn-dev-portal-link-box .nhn-dev-portal-link-box-headline,
html.night-mode .nhn-dev-portal-link-box .nhn-dev-portal-link-box-description{
    color: var(--color-gray-white);
}
html.day-mode .nhn-dev-portal-link-box:hover{
    background-color: var(--color-green-primary);
}
html.day-mode .nhn-dev-portal-link-box:hover .nhn-dev-portal-link-box-headline,
html.day-mode .nhn-dev-portal-link-box:hover .nhn-dev-portal-link-box-description{
    color: var(--color-gray-white);
}
html.night-mode .nhn-dev-portal-link-box:hover{
    background-color: var(--color-green-secondary);
}
html.night-mode .nhn-dev-portal-link-box:hover .nhn-dev-portal-link-box-headline,
html.night-mode .nhn-dev-portal-link-box:hover .nhn-dev-portal-link-box-description{
    color: var(--color-gray-black);
}
.nhn-dev-portal-link-box-headline, .nhn-dev-portal-link-box-description {
    color: var(--color-gray-dark);
}