/******************************************************/
/************Component - Content Window****************/
/******************************************************/
.content-window{
    text-align: center;
}
/*Content*/
.content-window-folder-data {
    text-align: left;
    margin-top: 40px;
    overflow: hidden;
    box-sizing: border-box;
    padding: var(--size-16);
}
.content-window-folder-data-table {
    width: 100%;
    border-collapse: collapse;
    display: table !important;
}
.content-window-folder-data-table p,
.content-window-folder-data-table a {
    margin: 7px 0;
}
.content-window-folder-data-table a {
    text-decoration: none;
}
.content-window-folder-data-table tr {
    height: 40px;
    border-bottom: solid 1px;
    border-left: solid 1px;
    border-right: solid 1px;
}
.content-window-folder-data-table tr:first-child{
    border-top: solid 1px;
}
.content-window-folder-data-table tr:first-child .nhn-dev-portal-content-window-row-name {
    left: -56px;
    position: relative;
}
.nhn-dev-portal-content-window-row-icon {
    position: relative;
    width: 50px;
}
.nhn-dev-portal-content-window-row-icon div {
    position: relative;
}
    .nhn-dev-portal-content-window-row-icon div.return {
        -webkit-mask: url(/icons/arrow-turn-down-left.svg);
        mask: url(/icons/arrow-turn-down-left.svg);
        mask-repeat: no-repeat;
        -webkit-mask-repeat: no-repeat;
        width: 20px;
        height: 27px;
        top: 6px;
        left: 12px;
    }
    .nhn-dev-portal-content-window-row-icon div.markdown {
        -webkit-mask: url(/icons/file-lines.svg);
        mask: url(/icons/file-lines.svg);
        mask-repeat: no-repeat;
        -webkit-mask-repeat: no-repeat;
        width: 20px;
        height: 27px;
        top: 0;
        left: 12px;
    }
    .nhn-dev-portal-content-window-row-icon div.image {
        -webkit-mask: url(/icons/image.svg);
        mask: url(/icons/image.svg);
        mask-repeat: no-repeat;
        -webkit-mask-repeat: no-repeat;
        width: 20px;
        height: 27px;
        top: 4px;
        left: 12px;
    }
    .nhn-dev-portal-content-window-row-icon .swagger {
        position: relative;
        width: 32px;
        height: 32px;
        left: 7px;
        background: url(/icons/swagger.svg) no-repeat;
        background-size: cover;
    }
    .nhn-dev-portal-content-window-row-icon div.folder {
        -webkit-mask: url(/icons/folder.svg);
        mask: url(/icons/folder.svg);
        mask-repeat: no-repeat;
        -webkit-mask-repeat: no-repeat;
        width: 20px;
        height: 27px;
        top: 4px;
        left: 12px;
    }
.nhn-dev-portal-content-window-row:hover {
    cursor: pointer;
}
/*Readme*/
.content-window-readme-data-header {
    position: relative;
    float: left;
    width: 100%;
    box-sizing: border-box;
    padding: 12px 0 0 15px;
    font-weight: 600;
}
.content-window-readme-data {
    position: relative;
    float: left;
    width: 100%;
    text-align: left;
    margin-top: 40px;
    box-sizing: border-box;
    border: solid 1px;
    border-left: none;
    border-right: none;
}
.content-window-readme-data .markdown-component-content-width{
    max-width: 100%;
    box-sizing: border-box;
    padding: var(--size-16);
}
.service-navigation-active .content-window-readme-data .nhn-dev-portal-component-inner-wrap{
    padding-left: 0;
    padding-right: 0;
}
.content-window-readme-data-content {
    width: 100%;
    position: relative;
    float: left;
}
.content-window-mobile-back-button-container {
    display: none;
}
#api-content-window::-webkit-scrollbar {
    width: 10px;
}
#api-content-window::-webkit-scrollbar-track {
    background: rgba(0,0,0,0);
}

/*Day/night mode*/
html.day-mode .content-window-folder-data,
html.day-mode .content-window-readme-data,
html.day-mode .content-window-folder-data-table tr{
    border-color: var(--color-frame-day);
}
html.day-mode .content-window-folder-data-table p,
html.day-mode .content-window-folder-data-table span,
html.day-mode .content-window-folder-data-table li,
html.day-mode .content-window-folder-data-table a,
html.day-mode .content-window-readme-data-header,
html.day-mode .content-window-readme-data-content h1,
html.day-mode .content-window-readme-data-content h2,
html.day-mode .content-window-readme-data-content h3,
html.day-mode .content-window-readme-data-content h4,
html.day-mode .content-window-readme-data-content p,
html.day-mode .content-window-readme-data-content span,
html.day-mode .content-window-readme-data-content li{
    color: var(--color-gray-black);
}
html.day-mode .nhn-dev-portal-content-window-row-icon div.return,
html.day-mode .nhn-dev-portal-content-window-row-icon div.markdown,
html.day-mode .nhn-dev-portal-content-window-row-icon div.image,
html.day-mode .nhn-dev-portal-content-window-row-icon div.folder{
    background: var(--color-gray-black);
}
html.day-mode .nhn-dev-portal-content-window-row:hover{
    background-color: var(--color-green-light);
}
/*-----------------*/
html.night-mode .content-window-folder-data,
html.night-mode .content-window-readme-data,
html.night-mode .content-window-folder-data-table tr{
    border-color: var(--color-gray-middle);
}
html.night-mode .content-window-folder-data-table p,
html.night-mode .content-window-folder-data-table span,
html.night-mode .content-window-folder-data-table li,
html.night-mode .content-window-folder-data-table a,
html.night-mode .content-window-readme-data-header,
html.night-mode .content-window-readme-data-content h1,
html.night-mode .content-window-readme-data-content h2,
html.night-mode .content-window-readme-data-content h3,
html.night-mode .content-window-readme-data-content h4,
html.night-mode .content-window-readme-data-content p,
html.night-mode .content-window-readme-data-content span,
html.night-mode .content-window-readme-data-content li
{
    color: var(--color-gray-white);
}
html.night-mode .nhn-dev-portal-content-window-row-icon div.return,
html.night-mode .nhn-dev-portal-content-window-row-icon div.markdown,
html.night-mode .nhn-dev-portal-content-window-row-icon div.image,
html.night-mode .nhn-dev-portal-content-window-row-icon div.folder{
    background: var(--color-green-middle);
}
html.night-mode .nhn-dev-portal-content-window-row:hover{
    background-color: var(--color-green-primary);
}
html.night-mode .nhn-dev-portal-content-window-row:hover .nhn-dev-portal-content-window-row-icon div{
    background-color: var(--color-gray-white);
}
html.night-mode .nhn-dev-portal-content-window-row:hover .nhn-dev-portal-content-window-row-name a{
    color: var(--color-gray-white);
}

/*Responsive*/
.service-navigation-active .content-window-folder-data,
.service-navigation-active .content-window-readme-data{
    position: relative;
    width: 100%;
    display: block;
    box-sizing: border-box;
}
/*Mobile Viewport Content Variables (<- 1079px)*/
@media only screen and (min-width: 1023px){

}