#divMainMobileStartButton {
    display: none;
    position: fixed;
    bottom: 1.4rem;
    right: 1.4rem;
    padding: 0.6rem 1.2rem 0.6rem 2.8rem;
    font-size: 1.2rem;
    font-weight: 500;
    color: var(--color-white);
    background: var(--color-other-highlight) url("/img/button_start_white.svg") no-repeat left 1rem center;
    background-size: auto 50%;
    border-radius: 3rem;
    box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1);
}

.divMainWrap {
    position: relative;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 1rem;

    width: 100%;
    max-width: 1600px;
    margin: 0 auto;
    padding: 1rem;
    /* background: #fff; */
    /* box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.06); */
}

.divMainWrap>.divMainCenterWrap {
    position: relative;
    flex: 1 1 auto;
}

.divMainWrap>.divMainRightWrap {
    flex-shrink: 0;
    width: 280px;
    position: sticky;
    top: 4.4rem;

    max-height: calc(100vh - 4.4rem - 1rem);
    border-radius: 0.6rem;
    overflow-y: auto;
}

.divMainWrap>.divMainCenterWrap>.divSearchBox {
    position: relative;

    position: sticky;
    top: 4.4rem;
    z-index: 1;
}

.divMainWrap>.divMainCenterWrap>.divSearchBox>input#inputDiagnosisSearchTextbox {
    width: 100%;
    padding: 0.8rem 1.6rem 0.8rem 4rem;
    color: var(--color-default-highlight);
    font-size: 1.2rem;
    border: 1px solid var(--color-default-highlight);
    border-radius: 0.6rem;
    background: var(--color-white) url('/img/search.png') no-repeat 1rem center;
    background-size: auto 60%;
    cursor: text;

    box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.03), 0px 3px 6px rgba(0, 0, 0, 0.02);
}

.divMainWrap>.divMainCenterWrap>.divSearchBox>input#inputDiagnosisSearchTextbox:focus {
    border: 1px solid var(--color-default-highlight);
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox {
    margin-top: 1.2rem;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryListNoData {
    position: relative;
    text-align: center;
    color: var(--color-dark-gray);
    font-size: 1.5rem;

    padding: 4rem 0;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryListNoData>img {
    display: block;
    margin: 0 auto;
    width: 640px;
    max-width: 100%;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryListNoData>p {
    line-height: 150%;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryListHeader {
    margin-top: 2.4rem;
    padding: 0.6rem 1.2rem;
    font-size: 0.875rem;
    font-weight: 700;
    background: var(--color-light-gray);
    border-radius: 0.6rem;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryListHeader.today {
    font-size: 1.1rem;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryTotalCount {
    margin: 1.6rem 0 -0.8rem 0;
    padding: 0 0.8rem;
    font-size: 1.125rem;
    font-weight: 400;
    color: var(--color-darker-gray);
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryTotalCount>.spanHighlight {
    font-weight: 600;
    color: var(--color-default-highlight);
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem {
    position: relative;
    padding: 1.8rem 1rem 1.8rem 5.4rem;
    background-color: var(--color-white);
    background-image: url('/img/icon_dog_gray.png');
    background-repeat: no-repeat;
    background-position: 1rem center;
    background-size: 3.4rem auto;
    border: 1px solid var(--color-light-gray);
    border-radius: 0.6rem;

    cursor: pointer;
    transition: all .2s linear;

    margin-top: 0.8rem;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem.dog {
    background-image: url('/img/icon_dog_gray.png');
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem.cat {
    background-image: url('/img/icon_cat_gray.png');
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem.new {
    transform: translate(-100%, 0);
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem:hover {
    border-color: var(--color-other-highlight);
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divBasicInfo {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 1rem;

    margin: 0 0 0.4rem 0;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divBasicInfo>.divPetName {
    font-size: 1.25rem;
    font-weight: 500;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divBasicInfo>.divChartID {
    font-size: 1rem;
    font-weight: 400;
    color: var(--color-other-highlight);
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divAdditionalInfo {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 0.4rem;

    font-size: 0.875rem;
    color: var(--color-dark-gray);
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divAdditionalInfo>.spanSplit {
    font-size: 0.725rem;
    color: var(--color-light-gray);
}

/* 
.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divPetInfo {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 0.4rem;
    color: var(--color-dark-gray);
    margin-top: 0.6rem;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divPetInfo>.spanOptionalInfo {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 0.4rem;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divPetInfo .spanSplit {
    font-size: 0.725rem;
    color: var(--color-default-gray);
} */


.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult {
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    /* padding: 0.6rem 0; */
    padding: 0;

    display: flex;
    justify-content: flex-end;
    align-items: stretch;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divResult {
    position: relative;
    width: 5.1rem;
    height: 100%;
    border-left: 1px solid var(--color-light-gray);

    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divResult>.spanKit {
    /* position: absolute;
    bottom: 0; */
    width: 100%;
    font-size: 0.725rem;
    font-weight: 500;
    text-align: center;
    margin: 0.2rem 0 0 0;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divResult>.divInProgress {
    /* position: absolute;
    bottom: 50%;
    right: 50%;
    transform: translate(50%, 50%); */
    flex-shrink: 0;
    position: relative;
    width: 3rem;
    height: 3rem;
    background: url('/img/circle_small.png') no-repeat center center;
    background-size: 100% auto;
    animation: progressCircleAnimation 1s ease-in-out infinite;
}

@keyframes progressCircleAnimation {
    0% {
        transform: translate(50%, 50%) rotate(0);
    }

    100% {
        transform: translate(50%, 50%) rotate(360deg);
    }
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divResult>.divKit {
    /* position: absolute;
    bottom: 50%;
    right: 50%;
    transform: translate(50%, 50%); */
    flex-shrink: 0;
    position: relative;
    width: 3rem;
    height: 3rem;
    background: var(--color-bright-other-highlight);
    border-radius: 50%;
    font-family: var(--source-code-font-family);
    font-size: 1.75rem;
    font-weight: 500;
    color: var(--color-other-highlight);
    text-align: center;
    overflow: hidden;
    animation: none;

    display: flex;
    justify-content: center;
    align-items: center;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divResult>.divKit>.spanPercent {
    font-size: 0.875rem;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divResult>.divRecheck {
    /* position: absolute;
    bottom: 50%;
    right: 50%;
    transform: translate(50%, 50%); */
    flex-shrink: 0;
    position: relative;
    width: 3rem;
    height: 3rem;
    background: var(--color-bright-other-highlight);
    border-radius: 50%;
    font-size: 1.75rem;
    color: var(--color-other-highlight);
    text-align: center;
    animation: none;

    display: flex;
    justify-content: center;
    align-items: center;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divResult>.divFail {
    /* position: absolute;
    bottom: 50%;
    right: 50%;
    transform: translate(50%, 50%); */
    flex-shrink: 0;
    position: relative;
    width: 3rem;
    height: 3rem;
    background: var(--color-almost-white) url('/img/fail.png') no-repeat center center;
    background-size: 60% auto;
    border-radius: 50%;
    text-align: center;
    animation: none;
}

/* 상태 아이콘 추가 */
.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divResult>.divFailReversed {
    /* position: absolute;
    bottom: 50%;
    right: 50%;
    transform: translate(50%, 50%); */
    flex-shrink: 0;
    position: relative;
    width: 3rem;
    height: 3rem;
    background: var(--color-almost-white) url('/img/fail_reversed.png') no-repeat center center;
    background-size: 60% auto;
    border-radius: 50%;
    text-align: center;
    animation: none;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divResult>.divFailEmpty {
    /* position: absolute;
    bottom: 50%;
    right: 50%;
    transform: translate(50%, 50%); */
    flex-shrink: 0;
    position: relative;
    width: 3rem;
    height: 3rem;
    background: var(--color-almost-white) url('/img/fail_empty.png') no-repeat center center;
    background-size: 60% auto;
    border-radius: 50%;
    text-align: center;
    animation: none;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divResult>.divFailAbnormal {
    /* position: absolute;
    bottom: 50%;
    right: 50%;
    transform: translate(50%, 50%); */
    flex-shrink: 0;
    position: relative;
    width: 3rem;
    height: 3rem;
    background: var(--color-almost-white) url('/img/fail_abnormal.png') no-repeat center center;
    background-size: 60% auto;
    border-radius: 50%;
    text-align: center;
    animation: none;
}

/* 사이톨로지 시작 */
.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divCytology {
    position: relative;
    width: 5.1rem;
    height: 100%;
    border-left: 1px solid var(--color-light-gray);

    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divCytology>.spanBottom {
    /* position: absolute;
    bottom: 0; */
    width: 100%;
    font-size: 0.725rem;
    font-weight: 500;
    text-align: center;
    margin: 0.2rem 0 0 0;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divCytology>.divBox {
    /* position: absolute;
    bottom: 50%;
    right: 50%;
    transform: translate(50%, 50%); */
    flex-shrink: 0;
    position: relative;
    width: 3rem;
    height: 3rem;
    background: var(--color-bright-cytology-highlight);
    border-radius: 50%;
    font-family: var(--source-code-font-family);
    font-size: 1.75rem;
    font-weight: 500;
    color: var(--color-cytology-highlight);
    text-align: center;
    overflow: hidden;
    animation: none;
    transition: all .2s linear;

    display: flex;
    justify-content: center;
    align-items: center;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divCytology>.divBox:hover {
    background-color: var(--color-cytology-highlight);
    color: var(--color-white);
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divCytology>.divBox.divInProgress {
    background: url('/img/cytology_circle.png') no-repeat center center;
    background-color: transparent;
    background-size: 100% auto;
    animation: progressCircleAnimation 1s ease-in-out infinite;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divCytology>.divBox.divInProgress:hover {
    background-color: transparent;
    color: var(--color-white);
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divCytology>.divBox.divAdditional {
    animation: cytologyAdditionalRequest 1.5s ease-in-out infinite;
}

@keyframes cytologyAdditionalRequest {
    0% {
        background: #EFE6FC;
        color: var(--color-cytology-highlight);
    }

    50% {
        background-color: var(--color-cytology-highlight);
        color: var(--color-white);
    }

    100% {
        background: #EFE6FC;
        color: var(--color-cytology-highlight);
    }
}

/* 사이톨로지 끝 */

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore {
    width: 5.1rem;
    height: 100%;
    padding: 0 0.6rem;
    border-left: 1px solid var(--color-light-gray);
    transition: all .2s linear;
    position: relative;

    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 0.6rem;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore>.divButton {
    width: 100%;
    border: 1px solid var(--color-light-gray);
    border-radius: 0.6rem;
    background: url(/img/button_go_green.png) no-repeat 0.4rem center;
    background-size: auto 60%;
    padding: 0.4rem 0.4rem 0.4rem 1.6rem;
    font-size: 0.875rem;
    text-align: left;
    transition: all .2s linear;
    cursor: pointer;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore>.divButton:hover {
    border-color: var(--color-other-highlight);
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore>.divStart {
    background-image: url(/img/button_start_green.svg);
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore>.divStop {
    display: none;
    background-image: url(/img/button_stop_red.svg);
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore>.divDelete {
    background-image: url(/img/button_remove_red.svg);
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore>.divStop:hover,
.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore>.divDelete:hover {
    border-color: var(--color-danger);
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore[status="REQ"]>.divStart,
.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore[status="REQ"]>.divDelete {
    display: none;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore[status="REQ"]>.divStop {
    display: block;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore[status="TAKING"]>.divStart,
.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore[status="TAKING"]>.divStop,
.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore[status="TAKING"]>.divDelete {
    display: none;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore[status="UPLOAD_OK"]>.divStart,
.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore[status="UPLOAD_OK"]>.divStop,
.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore[status="UPLOAD_OK"]>.divDelete {
    display: none;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore[status="PENDING"]>.divStart,
.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore[status="PENDING"]>.divStop,
.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore[status="PENDING"]>.divDelete {
    display: none;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore>i.dots {
    display: none;
    position: absolute;
    bottom: 50%;
    right: 50%;
    transform: translate(50%, 50%);
    font-size: 1.2rem;
    color: var(--color-light-gray);
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore[status="TAKING"]>i.dots,
.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore[status="UPLOAD_OK"]>i.dots,
.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore[status="PENDING"]>i.dots {
    display: block;
}


/* .divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore>i {
    display: block;
    position: absolute;
    bottom: 50%;
    right: 50%;
    transform: translate(50%, 50%);
    font-size: 1.2rem;
    color: #bbb;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore>i.delete {
    color: var(--color-default-highlight);
    display: none;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore:hover>i.delete {
    display: block;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore:hover>i.dots {
    display: none;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore>i.stop {
    color: var(--color-default-highlight);
    display: none;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore:hover>i.stop {
    display: none;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore[status="REQ"]>i.delete {
    display: none;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore[status="REQ"]:hover>i.delete {
    display: none;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore[status="REQ"]:hover>i.stop {
    display: block;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore[status="TAKING"]>i.delete {
    display: none;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore[status="TAKING"]:hover>i.delete {
    display: none;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore[status="TAKING"]:hover>i.stop {
    display: block;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore[status="UPLOAD_OK"]>i.delete {
    display: none;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore[status="UPLOAD_OK"]:hover>i.delete {
    display: none;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore[status="UPLOAD_OK"]:hover>i.stop {
    display: block;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore[status="PENDING"]>i.delete {
    display: none;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore[status="PENDING"]:hover>i.delete {
    display: none;
}

.divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore[status="PENDING"]:hover>i.stop {
    display: block;
} */


.divMainWrap>.divMainRightWrap>.divButtonWrap {
    width: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: stretch;
    flex-direction: column;
    gap: 0.6rem;
}


.divMainWrap>.divMainRightWrap>.divButtonWrap>.buttonStartDiagnosis {
    display: block;
    width: 100%;
    padding: 1rem 0;
    padding: 1rem 1rem 1rem 4rem;
    padding: 1rem 0;
    margin: 0;
    font-size: 1.4rem;
    font-weight: 600;
    color: var(--color-white);
    background: var(--color-default-highlight) url("/img/button_start_white.svg") no-repeat 1.2rem center;
    background-size: auto 50%;

    border: none;
    border-radius: 0.6rem;
    text-align: center;
    cursor: pointer;
    transition: all .2s linear;
}

.divMainWrap>.divMainRightWrap>.divButtonWrap>.buttonStartDiagnosis:hover {
    background-color: var(--color-other-highlight);
}

.divMainWrap>.divMainRightWrap>.divButtonWrap>.buttonService {
    position: relative;
    display: block;
    width: 100%;
    padding: 0.8rem 0;
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    text-align: center;
    cursor: pointer;

    background: var(--color-white) url("/img/renew/button_help.svg") no-repeat 1.4rem center;
    background-size: auto 50%;

    border: 1px solid var(--color-light-gray);
    border-radius: 0.6rem;
}

.divMainWrap>.divMainRightWrap>.divButtonWrap>.buttonService:hover {
    border-color: var(--color-default-highlight);
}

.divMainWrap>.divMainRightWrap>.divButtonWrap>.buttonService.buttonHelp {
    background-image: url("/img/renew/button_help.svg");
}

.divMainWrap>.divMainRightWrap>.divButtonWrap>.buttonService.buttonCytology {
    background-image: url("/img/renew/button_cytology.svg");
}

.divMainWrap>.divMainRightWrap>.divButtonWrap>.buttonService.buttonShop {
    background-image: url("/img/renew/button_shop.svg");
}

.divMainWrap>.divMainRightWrap>.divBanner {
    display: flex;
    justify-content: flex-start;
    align-items: stretch;
    flex-direction: column;
    gap: 1rem;
}

.divMainWrap>.divMainRightWrap>.divButtonWrap>.buttonLink {
    position: relative;
    display: block;
    width: 100%;
    font-size: 1rem;
    color: var(--color-black);
    background-size: auto 100%;
    border: none;
    outline: none;
    cursor: pointer;
    border-radius: 0.6rem;
    padding: 0.8rem 0;
    text-align: center;
    font-weight: 600;
    margin: 0;
}

.divMainWrap>.divMainRightWrap>.divButtonWrap>.buttonLink>.divPlay {
    position: absolute;
    left: 1.8rem;
    bottom: 50%;
    transform: translateY(50%);

    width: 1.2rem;
    height: 1.2rem;
    background: url("/img/renew/icon_play_white.svg") no-repeat center center;
    background-size: contain;

    opacity: 0.7;
}

.divMainWrap>.divMainRightWrap>.divButtonWrap>#buttonKakaoChat {
    color: var(--color-black);
    background: #FDDC3F url("/img/banner/img_kakao.png") no-repeat left 1.4rem center;
    background-size: auto 1.8rem;
}

.divMainWrap>.divMainRightWrap>.divButtonWrap>#buttonKakaoChat:hover {
    background-color: #ffcc33;
}

.divMainWrap>.divMainRightWrap>.divButtonWrap>#buttonInterviewVideo {
    color: var(--color-white);
    background: #4223A4 url("/img/renew/button_dvm_jang.png") no-repeat left 1rem center;
    background-size: auto 100%;
}

.divMainWrap>.divMainRightWrap>.divButtonWrap>#buttonInterviewVideo:hover {
    background-color: #321b7c;
}

.divMainWrap>.divMainRightWrap>.divButtonWrap>#buttonHbA1cVideo {
    color: var(--color-white);
    background: #2F3A4E url("/img/renew/button_dr_choi.png") no-repeat left 1rem center;
    background-size: auto 100%;
}

.divMainWrap>.divMainRightWrap>.divButtonWrap>#buttonHbA1cVideo:hover {
    background-color: #222b3b;
}


@media (max-width: 960px) {
    .divMainWrap>.divMainCenterWrap {
        width: 100%;
    }

    .divMainWrap>.divMainRightWrap {
        display: none;
    }

    #divMainMobileStartButton {
        display: block;
    }
}

@media (max-width: 800px) {
    .divMainWrap>.divMainCenterWrap {
        width: 100%;
    }
}

@media (max-width: 600px) {
    .divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryListNoData {
        font-size: 20px;
    }

    .divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem {
        padding: 1rem;
    }

    .divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem.dog,
    .divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem.cat {
        background-image: none;
    }

    .divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divResult>.spanKit {
        font-size: 0.625rem;
    }

    .divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divMore {
        display: none;
    }

    .divMainWrap>.divMainCenterWrap>.divHistoryListBox>.divHistoryItem>.divDiagnosisResult>.divCytology>.spanBottom {
        font-size: 0.625rem;
    }
}