:root {
    --s-sm: .8rem;
    --s-rg: 1rem;
    --s-lg: 1.125em;
    --s-xl: 1.25em;
    --brd-5: 5px;
    --brd-10: 10px;
    --brd-15: 15px;
    --brd-20: 20px;
    --brd-25: 25px;
    --brd-30: 30px;
    --brd-50: 50%;
    --border-op01: 1px solid rgba(255,255,255,0.1);
    --border-op02: 2px solid rgba(255,255,255,0.1);
    --borderb-op01: 1px solid rgba(0,0,0,0.1);
    --ratio1: 1 / 1!important;
}
/*페이누리 PG 에서 호출하는 Class*/
.ui-dialog-titlebar-close {
    visibility: hidden;
}

/*모든버튼*/
* .mud-button-root.mud-button.mud-button-filled, 
* .mud-button-root.mud-button.mud-button-text {
    border: var(--borderb-op01);
}
.mud-main-content {
    height: 100vh;
}
.MyFooter {
    border-top: solid 1px var(--darker);
    background-color: var(--mud-palette-dark-darken);
    /*background-color: var(--mud-palette-dark);*/
    /*background-image: linear-gradient(var(--grd-direction-lt), var(--grd-dark));*/
    
}
    .MyFooter .mud-paper a, .MyFooter .mud-paper p {
       letter-spacing:normal!important;
       line-height:1!important
    }
.mud-list-item-icon {
    min-width: 30px!important;
}
.ratio1 {
    aspect-ratio: var(--ratio1);
}
/*보더*/
.Bdr-5 {
    border-radius: var(--brd-5);
}
.Bdr-10 {
    border-radius: var(--brd-10);
}
.Bdr-15 {
    border-radius: var(--brd-15);
}
.Bdr-20 {
    border-radius: var(--brd-20);
}
.Bdr-25 {
    border-radius: var(--brd-25);
}
.Bdr-30 {
    border-radius: var(--brd-30);
}
.Bdr-50 {
    border-radius: var(--brd-50);
}
/*박스투명보더*/
.border-op01 {
    border: var(--border-op01);
}
.border-op02 {
    border: var(--border-op02);
}
.borderb-op01 {
    border: var(--borderb-op01);
}
.border-selected {
    padding:0.12rem;
    border-radius:0.5rem;
    border: 2px solid var(--mud-palette-dark);
}
/*투명도*/
.opc-01 {
    opacity: 0.1
}
.opc-02{
    opacity:0.2
}
.opc-03{
    opacity:0.3
}
.opc-04{
    opacity:0.4
}
.opc-05{
    opacity:0.5
}
.opc-06{
    opacity:0.6
}
.opc-07{
    opacity:0.7
}
.opc-08{
    opacity:0.8
}
.opc-09{
    opacity:0.9
}
.My_Icon_Hue {
    filter: hue-rotate(71deg) saturate(12);
}
/*폰트사이즈,두께*/
.fs-sm {
    font-size: var(--s-sm) !important;
    line-height: 1.4;
}
.fs-rg {
    font-size: var(--s-rg) !important;
}

.fs-lg {
    font-size: var(--s-lg) !important;
}

.fs-xl {
    font-size: var(--s-xl) !important;
}
.flh-fix{
    line-height:1 !important;
}
.grayscale {
    filter: grayscale(80%)!important;
}
.OutStock {
    background-color: #ededed80!important;
    border-width:2px;
}
.OutStock_txt {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
/*텍스트오버시쩜쩜쩜*/
.txt-over {
    white-space: nowrap;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
}
.txt-over-line {
    /*word-break: break-word;*/
    text-overflow: ellipsis;
    overflow: hidden;
    word-break: keep-all;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
/*센터*/
.Sample_Center .mud-grid-item .mud-paper, .Sample_Center, .CenCen {
    display: flex;
    justify-content: center;
    align-items: center
}
/*플립*/
.flipH {
    transform: scaleX(-1)
}
/*백드롭블러*/
.bg_blur {
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
}
/*배경투명*/
.bg-trans {
    background-color: transparent !important;
    background-image: none !important;
    border: none !important;
}
/*리스트 섬네일 이미지*/
.MyList_ThumbnailImg {
    max-width: 50% !important;
}
/*이미지를 포함한 a*/
a:has(.ThumbnailImg) {
    display: flex;
    align-items: center;
}

/*앱바 메뉴,아이콘 색*/
.MyAppMenu .mud-button-label,
.MyAppMenu .mud-icon-button {
    color: var(--dark-hl) !important;
}
.MyAppMenu a:hover .mud-button-label,
.MyAppMenu button:hover .mud-button-label,
.MyAppMenu .mud-icon-button:hover span {
    color: var(--orange) !important;
}
    .MyAppMenu .mud-icon-button:hover span {
        font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 48
    }
    .Common_Title_box {
        display: flex;
        align-items: center;
        align-content: center;
        font-size: 20px !important;
        margin-bottom: 1rem;
        color: var(--mud-palette-white) !important;
        transition: .3s cubic-bezier(0.25, 0.8, 0.5, 1);
        gap: 4px;
    }
        .Common_Title_box .mud-typography{
            line-height:1!important;
        }
            .Common_Title_box p.mud-typography{
                margin-top:0.25rem;
            }
    /* 테이블 */
    * .mud-table-root {
    font-size: 14px;
    overflow: hidden !important;
}
* .mud-table-row .mud-table-cell {
    white-space: nowrap;
    /*text-wrap: nowrap;*/
    padding: 12px 16px !important;
    padding-inline-start: 16px !important;
    padding-inline-end: 16px !important;
    text-align: center;
    min-width: max-content;
    font-size: var(--s-sm) !important;    
    border-bottom: none;
}
.mud-table-body .mud-table-row:not(:last-of-type) .mud-table-cell {
    border-bottom: 1px solid var(--mud-palette-table-lines) !important;
}
/*테이블 헤더*/
* .mud-table-head .mud-table-row .mud-table-cell {
    background-color: var(--mud-palette-dark) !important;
    color: var(--mud-palette-white) !important;
   /* border-color: var(--mud-palette-dark-lighten) !important;*/
    border-color: #474b59 !important;
}
.mud-table-head .mud-table-row .mud-table-cell:first-child {
    border-top-left-radius: var(--mud-default-borderradius)
}
.mud-table-head .mud-table-row .mud-table-cell:last-child {
    border-top-right-radius: var(--mud-default-borderradius)
}
    * .mud-table-head .mud-table-row .mud-table-cell:not(:last-child) {
        border-right: 1px solid var(--mud-palette-table-lines);
    }

/*셀정렬 셀옵션*/
.mud-table-head .mud-table-cell .column-header {
    width: max-content;
    margin: auto;
    word-break: keep-all !important;
    font-weight: 700;
}
.mud-table-head .mud-table-cell:has(.column-header) .sortable-column-header {
    width: fit-content;
}

.mud-table-head .mud-table-cell .sortable-column-header + .column-options {
    min-width: 17px;
    margin-left: 3px;
}

.mud-data-grid .mud-table-cell .column-header .sort-direction-icon {
    opacity: 0.8;
}

    .mud-data-grid .mud-table-cell .column-header .sort-direction-icon.mud-direction-desc,
    .mud-data-grid .mud-table-cell .column-header .sort-direction-icon.mud-direction-asc {
        opacity: 1;
        color: #594ae2;
        background-color: #594ae221;
    }

.mud-table-head .mud-table-cell .sortable-column-header + .column-options .mud-button-root .mud-icon-button-label svg {
    font-size: 11px;
}

.mud-table-head .mud-table-cell .sortable-column-header + .column-options .mud-menu,
.mud-data-grid .mud-table-cell .column-header .mud-sort-index {
    display: none;
    visibility: hidden;
}
.mud-table-row .BoardArticleTitleTd {
    width:auto;
    max-width:700px;
}
.BoardArticleTitleTd.mud-table-cell .mud-typography.mud-typography-body1.d-flex.justify-start a {
    width:fit-content !important;
    white-space: nowrap;
    overflow-x: hidden;
    overflow-y:visible;
    text-overflow: ellipsis;
    text-align: left;
}
.BoardArticleTitleTd.mud-table-cell .mud-typography.mud-typography-body1.d-flex.justify-start img.NewIcon, .NewIcon {
    display: inline-block;
    width: 15px !important;
    max-width: 15px !important;
    height: 15px !important;
    margin-bottom: 7px;
}
.first_ul {
    margin-left: 2rem;
    margin-top: 1rem;
}
    .first_ul > li {
        list-style-position: inside;
        list-style: disc;
        margin-bottom: 0.5rem;
    }
        .first_ul > li > p {
            position: relative;
            left: -0.5rem
        }
    .second_ul {
        margin-left: 1rem;
        margin-top: 0.25rem;
        font-size: 0.8rem;
    }
        .second_ul > li {
            margin-bottom:0.25rem;
        }
        .second_ul > li .mud-typography.mud-typography-body1 {
            font-weight: bold
        }
/*말풍선*/
.speech-bubble {
    position: relative;
    background: #e3e3e3;
    border-radius: var(--brd-15);
    background-color: #fff;
    border: 1px solid #ccc;
}
    .speech-bubble:before, .speech-bubble:after {
        content: "";
        position: absolute;
        display: block;
        width: 0;
        height: 0;
        border-style: solid;
    }
    .speech-bubble:before, .speech-bubble:after {
        left: 16%;
        transform:translateX(-50%);
        border-width: 0 10px 10px 10px;
    }

        .speech-bubble:before {
            top: -10px;
            border-color: transparent transparent #ccc transparent;
        }

        .speech-bubble:after {
            top: -9px;
            border-color: transparent transparent #fff transparent;
        }

/*모바일★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★*/
@media (min-width:1280px) {
}

@media (min-width: 960px) and (max-width: 1280px) {
}

@media (min-width: 600px) and (max-width: 960px) {
    .mud-typography-body2.fs-xs-sm {
        font-size: 78% !important;
    }   
    /*리스트 섬네일 이미지*/
    .MyList_ThumbnailImg {
        max-width: 90% !important;
    }
}

@media (max-width: 600px) {
    .mud-typography-body2.fs-xs-sm {
        font-size: 75% !important;
    }   
    :root {
        --brd-30: 15px;
    }

    /* .mud-xs-table 모바일 CSS 덮어쓰기 */
    .mud-xs-table .mud-table-root .mud-table-head,
    .mud-xs-table .mud-table-root .mud-table-foot {
        display: table-header-group !important;
    }

    .mud-xs-table .mud-table-root .mud-table-row {
        display: table-row;
    }

        .mud-xs-table .mud-table-root .mud-table-row .mud-table-cell {
            display: table-cell;
            text-align: center !important;
        }
    * .mud-table-row .mud-table-cell {
        white-space: nowrap;
        /*text-wrap: nowrap;*/
        padding: 12px 10px !important;
        padding-inline-start: 10px !important;
        padding-inline-end: 10px !important;
        text-align: center;
    }
    .mud-xs-table.mud-table-bordered .mud-table-container .mud-table-root .mud-table-body .mud-table-row .mud-table-cell:not(:last-child) {
        border-right: 1px solid var(--mud-palette-table-lines) !important;
    }
    .mud-xs-table .mud-table-body .mud-table-row:last-of-type .mud-table-cell {
        border-bottom: none !important;
    }

    .mud-xs-table .mud-table-cell:before {
        display: none !important;
        content: "";
        font-weight: unset;
        padding-right: unset;
        padding-inline-end: unset;
        padding-inline-start: unset;
    }

    .mud-xs-table .mud-table-row .BoardArticleTitleTd {
        max-width: 250px !important;
    }
    /*리스트 섬네일 이미지*/
    .MyList_ThumbnailImg {
        max-width: 100% !important;
    }
    .MyFooter .mud-paper a {
        font-size: 12px !important;
    }
    .MyFooter .mud-paper p{
        font-size: 10px !important;
    }
}

@media (max-width: 400px) {

    .mud-xs-table .mud-table-row .BoardArticleTitleTd {
        max-width: 150px !important;
    }
    .mud-main-content {
      max-width: 400px;
    }
   
}

/*효과●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●*/