

.section{
            width:100%; margin-bottom:4.0rem; display: block;
            &:last-child{margin-bottom:0;}
        }

/*-- 세로로 나누기(S) --*/
.devide{width:100%; /*margin-bottom:2.0rem;*/ &:last-child{margin-bottom:0;} > div{box-shadow:none; border:0;}}
/*-- 세로로 나누기(E) --*/

/*-------------------------------------------------------------------
	타이틀
-------------------------------------------------------------------*/
/*--- 타이틀사이즈 ---*/
.title-00{font-size:2.4rem; font-weight:bold;}
.title-01{font-size:2.2rem; font-weight:bold;}
.title-02{font-size:1.8rem; font-weight:bold;}
.title-03{font-size:1.6rem; font-weight:bold;}
.title-04{font-size:1.4rem; font-weight:bold;}

.title-01{
    &.style-01{
        display: inline-flex; gap:0.9rem; align-items: center; justify-content: start;
        &::before{
            content:''; display: inline-block; width:0.6rem;  height:1.8rem; background:var(--red-color); border-radius:0.2rem;
        }
    }
    
}

.title-02{
    &.style-01{
        display: inline-flex; gap:0.5rem; align-items: center; justify-content: start;
        &::before{
            content:''; display: inline-block; width:0.7rem;  height:0.7rem; border:3px solid var(--red-color); border-radius:0.8rem;
        }
    }        
}

.title-03{
    &.style-01{
        display: inline-flex; gap:0.5rem; align-items: center; justify-content: start;
        &::before{
            content:''; display: inline-block; width:0.8rem;  height:0.3rem; background:var(--red-bg-opa-50); border-radius:0.8rem;
        }
    }        
}

/*--- 서브타이틀사이즈 ---*/
.sub-title-01{
    font-size:1.6rem; color:var(--gray-dark-color);
    /* &::before{content:'*'; color:red;} */
}

.sub-title-02{
    font-size:1.4rem; color:var(--gray-dark-color);
}

/*--- 타이틀폼 ---*/
.tit-form{
    display: flex; align-items: center; gap:0.5rem;

    input,
    select{
        border-radius:0.5rem; border:1px solid var(--gray300-color); color:var(--gray600-color)!important; font-weight:bold; width:15.0rem;
    }

    input{font-weight:normal;}

    p{font-size:1.4rem; line-height:3.0rem;}

    &.search{
        select{
            width:10.0rem;
        }
        .btn-tit{
            position: relative; background: var(--red-color); border: 1px solid var(--red-color); color: #ffffff; display: inline-flex; align-items: center; justify-content: center; padding: 0 1.0rem; min-height: 4.0rem; border-radius: 0.5rem; font-size: 1.4rem; overflow: hidden; word-break: keep-all; font-weight:bold; 
            /* span{opacity: 1;} */
            /* &:hover{opacity: 1; } */
        }
    }
}

.title-box{
    width:100%; margin-bottom:1.0rem; overflow:hidden; line-height:1.5; 
    
    /*--- 좌우영역 ---*/
    .tb-left{float:left; display: flex; align-items: baseline; justify-content: start ; gap:1.0rem; line-height:4.0rem;}
    .tb-right{float:right; display: flex; align-items: baseline; justify-content: end ; gap:0.5rem; }

    
}



/*-------------------------------------------------------------------
	탭버튼 모음
-------------------------------------------------------------------*/
/*-- 최상단 --*/
.tab-a-wrap{
    width:100%; 
    .tab-button-wrap{
        ul{
            width:100%; display: flex; align-items: center; justify-content: center; overflow:hidden; gap:1.0rem; 
            li.btn-tab{ 
                flex:1;  height:5.0rem; 
                a{ display: flex; align-items: center; justify-content: center; width:100%; height:100%; font-size:1.8rem; font-weight:bold; background:#dddddd; color:var(--red-color);  border-radius:1.0rem;}

                &:hover,
                &.on{
                    a {background:var(--red-color); color:#ffffff;}
                }
            }
        }
    }

    .tab-content-wrap{
        width:100%; margin-top:2.0rem;
        ul{
            li.tab-content{
                border:2px solid #dddddd; border-radius:1.0rem; overflow:hidden; padding:2.0rem; display: none;
                &.on{display: block;}
            }
        }
    }
    
    
}

@media screen and (max-width: 780px){
    .tab-a-wrap {
        ul {
            gap:0.5rem;
        }
    }
}

/*-- 두번째 --*/
.tab-b-wrap{
    width:100%; 
    ul{
        width:100%; display: flex; align-items: center; justify-content: center; border-radius:0.5rem; overflow:hidden; 
        li.btn-tab-b{ 
             flex:1;  height:4.0rem; 
            a{ display: flex; align-items: center; justify-content: center; width:100%; height:100%; font-size:1.8rem; font-weight:bold; border-top-left-radius: 1.0rem; border-top-right-radius: 1.0rem; color:var(--gray600-color); border-bottom:2px solid var(--gray300-color);}

            &:hover,
            &.on{
                a {color:var(--primary-blue-bright-color); border-bottom:2px solid var(--primary-blue-bright-color) }
            }
        }
    }
}

@media screen and (max-width: 780px){
    .tab-b-wrap {
        & ul {
            & li.btn-tab-b {
                a {
                    font-size:1.6rem;
                }
            }
        }
    }
}

/*-- 박스안 --*/
.cont-tab-box{
    display: flex; align-items: center; justify-content: end; gap:0.5rem;
    .btn-cont-tab{ display: inline-flex; align-items: center; justify-content: center;
        padding: 0 1.0rem; height: 3.0rem; border-radius: 0.5rem;
        border: 1px solid #F5F5F5; color: #393939; background: #d9d9d9;
        font-size: 1.4rem;

        &:hover,
        &.on{
            text-align: center;
            border: 1px solid #005DAA;
            color: #ffffff;
            background: #005DAA;
            font-weight: bold;
        }
    }


}

/*-------------------------------------------------------------------
	이미지 구분
-------------------------------------------------------------------*/
.img-total{
    width:100%; height:auto; overflow:hidden;
    .it-in{font-size:0;
        img{width:100%;}
    }
}


/*-------------------------------------------------------------------
	검색창
-------------------------------------------------------------------*/
 /*** 버튼 ***/
 .btn-sb{
    /* position: relative; */
    background: #E7EDF5;
    border: 1px solid #E7EDF5;
    color: #49525E;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 1.0rem;
    height: 4.0rem;
    border-radius: 0.5rem;
    font-size: 1.4rem;
    overflow: hidden;
    word-break: keep-all;
    width:100%;
    /* max-width:20.0rem; */
    font-weight:bold;
    width:auto;
    min-width:7.0rem;
    /* margin-right:0.5rem; */

    &.search{background: var(--red-color);; border: 1px solid var(--red-color);; color: #ffffff;}
    &.au-time{background: #E7EDF5; border: 1px solid #E7EDF5; color: #49525E;}
    &.au-public{background: #E7EDF5; border: 1px solid #E7EDF5; color: #49525E;}
    &.api{background: #ffffff; border: 1px solid #49525E; color: #49525E;}
    &.go{background: var(--gray600-color); border: 1px solid var(--gray600-color); color: #ffffff;}
    &.excel{background: #1d7145; border: 1px solid #1d7145; color: #ffffff;}
}


.search-box{width:100%; overflow:hidden; border:2px solid #C6C8CA; padding: 1.0rem 1.0rem; border-radius:1.0rem; /*box-shadow: var(--gray300-color) 0 0.4rem 0.4rem 0;*/  background:#ffffff; margin-bottom:3.0rem;

    /*** etc ***/
    .btn-text{font-size:1.6rem;  display: block; 
        display: flex; align-items: center; justify-content: space-between;
        gap: 0.5rem;
        /* background: var(--primary-blue-bright-bg-opa-20); */
        /* height: 3.2rem; padding: 0.4rem 1.6rem 0.4rem 0.4rem; border-radius: 1.6rem; */
        .btn-time{
            display: inline-flex; align-items: center; justify-content: center; width:2.4rem; height:2.4rem; background:var(--gray600-color); border-radius:1.2rem; 
          }
        
    }

    .sb-in{width:100%; overflow:hidden; display: flex; align-items: center; justify-content: space-between; position:relative;

        .row{width:100%;}

        .sb-item{min-height:4.0rem; display: flex; align-items: center; justify-content: space-between; padding:0.5rem; gap:0.5rem; height:100%;

                    /* flex-direction: column;  */
                    /* align-items: baseline; */

            .sb-tit{
                width:11.0rem; 
                padding:0.25rem; text-align:center; line-height:3.0rem; 
                font-size:1.6rem; font-weight:bold; line-height:1.5; word-break: keep-all;
                h4{word-break: keep-all; display: flex; color:#131313; justify-content: center; width:11.0rem; 
                    &.point::before{content:'*'; color:#e2372d;}
                }
            }
    
            .sb-data{width:calc(100% - 14.0rem); padding:0.25rem;
                        
                        width:100%;
    
                .row{
                    
                    li{padding:0 0.25rem;
    
                        .sb-form{width:100%; display:flex; gap:0.5rem;
                            input,
                            select{width:100%; border-radius:0.5rem;}
                            .date-box{width:100%;}
                            .sb-form-btn{
                                position: relative;
                                background: #E7EDF5;
                                border: 1px solid #E7EDF5;
                                color: #49525E;
                                display: inline-flex;
                                align-items: center;
                                justify-content: center;
                                padding: 0 1.0rem;
                                height: 3.5rem;
                                border-radius: 0.5rem;
                                font-size: 1.4rem;
                                overflow: hidden;
                                word-break: keep-all;
                            }

                            .check,
                            .radio{margin-right:1.0rem;}

                            .sb-text{font-size:1.6rem;}
                        }

                        ul.sb-form{
                            > li{
                                padding:0;
                                display: inline-flex; 
                                align-items: center; 
                                justify-content: center;
                                margin-bottom:0;
                                input,
                                select,
                                .date-box{width:100%; max-width:15.0rem; color: #000000!important;}
                            }
                        }

                        @media screen and (max-width: 780px){
                            ul.sb-form{
                                flex-direction: column;
                                > li{
                                    input,
                                    select,
                                    .date-box{max-width:100%;}
                                    .btn-icon-type-01.print{display: none;}
                                }
                            }
                        }


                    
                    }
                }
            
            }
            
        }

       

        .col-btn-box{
            display: flex; align-items: center; width:auto; justify-content: end!important; gap:0.5rem; position:absolute; right:0;
        }
 
    }

    .sb-btn-box{width:100%; margin:1.0rem 0; display: flex; align-items: center; justify-content: center; gap:0.5rem; 
        .btn-sb{
            /* max-width:6.2rem; */
        }
    }

    /*-- 구분(S) --*/
    &.bottom-stripe{
        .sb-in {
            > ul {
                > li{border-bottom:1px solid var(--gray200-color); }
            }
        }
    }

    /*-- 멘트(S) --*/
    .ment-box{
        width:100%;    border-radius:1.0rem;
            ul.indent-text{display: flex; flex-direction: column;  gap:0.5rem;
            li{ font-size:1.4rem;
                
            }
        }

    }

}

@media screen and (max-width: 780px){
    & .sb-in { flex-direction: column;
        .row {
            flex-direction: column;
            > li{width:100%; 
                .sb-form {

                }
            }

           
        }

        .col-btn-box {
            position: relative!important; right:unset!important;  width:100%!important;
        }
    }

    & .sb-item {
        & .sb-data {
            & .row {
                li {
                    padding: 0 0.25rem; width:100%; margin-bottom:1.0rem; &:last-child{margin-bottom:0;}
                }
            }
        }
    }


}


/*-------------------------------------------------------------------
	SNS 영역
-------------------------------------------------------------------*/
.sns-box{width:100%; margin-top:1.0rem;

    button{
        width: 3.0rem;
        height: 3.0rem;
        border-radius:0.8rem; 
    }

    .facebook {
        margin-right: 0.3rem;
        background: url("../../img/sns_share.png");
        background-size: 15.0rem;
        background-repeat: no-repeat;
        background-position:0 -0.2rem;
    }
    
    .twitter {
        background: url("../../img/sns_share.png");
        background-size: 15.0rem;
        background-repeat: no-repeat;
        background-position: -4.0rem -0.2rem;
    }
    
    .kakao {
        margin-right: 0.3rem;
        background: url("../../img/sns_share.png");
        background-size: 15.0rem;
        background-repeat: no-repeat;
        background-position: -8.0rem -0.2rem;
    }
    
    .naver {
        margin-right: 0.3rem;
        background: url("../../img/sns_share.png");
        background-size: 15.0rem;
        background-repeat: no-repeat;
        background-position: -11.8rem -0.2rem;
    }
}


/*-------------------------------------------------------------------
	테이블
-------------------------------------------------------------------*/

/* .table-basic *{box-sizing:content-box!important;} */
/* .tbs-wrap, */
.table-basic{
    width:100%; overflow:hidden; background:#ffffff; border-top:2px solid #B2B0B0;
    .t-link{
        -webkit-box-orient: vertical; display: -webkit-box !important; display: block; -webkit-line-clamp: 1; overflow: hidden; text-overflow: ellipsis; white-space: normal; word-wrap: break-word;

        .reply{
            font-weight:bold; font-size:1.6rem; display: inline-flex; align-items: center; margin-right:0.5rem; color:#5CB3B9; align-items: center;
            &::before{
                display: inline-block; content:''; background:url("../img/icon-re.svg") center no-repeat; width:1.6rem; height:1.6rem; background-size:contain; font-weight:bold;
            }
        }

        .answer{
            font-weight:bold; font-size:1.6rem; display: inline-flex; align-items: center; margin-right:0.5rem; color:#015CA9; align-items: center;
            &::before{
                display: inline-block; content:''; background:url("../img/icon-answer.svg") center no-repeat; width:1.6rem; height:1.6rem; background-size:contain; font-weight:bold;
            }
        }

        &:hover{text-decoration: underline;}
    }
    table{
        width:100%; border-collapse: collapse; table-layout: fixed;

        th,td{
            font-size:1.6rem; padding:0.5rem; height:4rem; border-bottom:1px solid #B2B0B0; text-align:center; 
        }

        th{font-weight:bold; background:var(--red-bg-opa-10);
            a{color:#000; }
        }
        
	    .tc-right {
	        text-align: right;
	    }

        td{
            textarea,
            input,
            select{width:100%; flex:1; border-radius: 0.5rem; height:3.0rem;}
            textarea{height:auto; padding:0.5rem!important;}

            label,
            span{font-size:1.4rem;}

            a{color:#000;}
            
            .wid-small,
            .btn-tb{
                position: relative; background: #E7EDF5; border: 1px solid #E7EDF5; color: #49525E; display: inline-flex; align-items: center; justify-content: center; padding: 0 1.0rem; height: 3.0rem; border-radius: 0.5rem; font-size: 1.4rem; overflow: hidden; word-break: keep-all;

                
                &.search{background: var(--primary-blue-bright-color); border: 1px solid var(--primary-blue-bright-color); color: #ffffff;}
                &.au-time{background: #E7EDF5; border: 1px solid #E7EDF5; color: #49525E;}
                &.au-public{background: #E7EDF5; border: 1px solid #E7EDF5; color: #49525E;}
                &.api{background: #ffffff; border: 1px solid #49525E; color: #49525E;}
                &.go{background: var(--gray600-color); border: 1px solid var(--gray600-color); color: #ffffff;}
                &.excel{background: #1d7145; border: 1px solid #1d7145; color: #ffffff;}
            }

            .dtc-flex > li{border:none; box-shadow:none; border-radius:0;}
            
        }

        .txt-tb{font-size:1.4rem;}

        .form-tb{
            display: flex; align-items: center; justify-content: center; gap:0.5rem;

        }
        
        
    }

    &.type-01{
        table{
            th{background:var(--primary-blue-bright-bg-opa-10);}
            th,
            td{border:1px solid #B2B0B0;}
        }
    }

    &.type-02{
        /* border:0.18rem solid var(--primary-blue-bright-color); */
        /* border-radius:1.0rem; */
        table{
            th, td{border:0; background:unset; font-size:1.6rem;}

            /* th{border-right:1px solid #045ebc;} */
            tr{border-bottom:0.18rem dashed var(--primary-blue-bright-color);
                /* &:last-child{border-bottom:0;} */
            }
        }
    }

    &.type-03{
        /* border:0.18rem solid var(--primary-blue-bright-color); */
        /* border-radius:1.0rem; */
        table{
            /* th, td{border:0; background:unset; font-size:1.6rem;} */

            /* th{border-right:1px solid #045ebc;} */
            tr{
                th,
                td{ border:0; border-bottom:0.18rem dashed var(--primary-blue-bright-color); font-size:1.5rem; }
                th{background:none; position:relative; margin-right:1.5rem;
                    /* &::after{content:':'; position:absolute;  right:0; } */
                }
                
                td{text-align:left;}
            }
        }
    }

    &.type-board{ border-top:2px solid var(--primary-blue-bright-bg-opa-80); border-bottom:1px solid var(--gray500-color);
        & table {
            tr:hover{background:var(--primary-blue-bright-bg-opa-10);}
            th, td {
                border:none;
                border-bottom:1px solid var(--gray300-color);
            }
        }
    }

    &.type-user{
        table{border-top:1px solid var(--gray300-color);
            tr{border-bottom:1px solid var(--gray300-color);}
            th,
            td{border:0;}
            th{background:none; position: relative;}
            th::after{content:':'; position:absolute; top:47%; right:0; transform:translateY(-50%);}
            td{
                text-align:left!important;
            }
        }
    }

    .compare-down{background:url("../../img/icon-down02.png") no-repeat 0 50%;color:#1a60da;padding:0 0 0 14px;}
    .compare-down-text {height: 9px;}
    .compare-up{background:url("../../img/icon-up02.png") no-repeat 0 50%;color:#e2372d;padding:0 0 0 14px;}
    .compare-up-text {height: 9px;}
    .scompare-down{background:url("../../img/icon-down02.png") no-repeat 0 50%;color:#1a60da;padding:0 0 0 14px;}
    .scompare-up{background:url("../../img/icon-up02.png") no-repeat 0 50%;color:#e2372d;padding:0 0 0 14px;}
    .icon-low-price{color:#045ebc;border:1px solid #045ebc;display:inline-block;padding:2px 4px;font-size:12px;margin:0 10px 0 0;}

    &.sm{
        th,td{font-size:1.2rem!important;}
    }
    &.lg{
        th,td{font-size:1.6rem!important;}
    }

    /* 가로 스크롤 */
    &.ofx{ 
        width:100%; overflow-x:auto!important;
    }
}


/*-------------------------------------------------------------------
	텍스트 사이즈
-------------------------------------------------------------------*/
.text-00{font-size:1.8rem;}
.text-01{font-size:1.6rem;}
.text-02{font-size:1.4rem;}
.text-03{font-size:1.2rem;}

.text-01.spe{
    position:relative; padding-left:1.7rem;
    > span{position:absolute; left:0;}
}

/*-------------------------------------------------------------------
    페이지버튼
-------------------------------------------------------------------*/
.paging-wrap {display: block; height: 3.0rem; margin-top: 1.0rem; text-align: center;}
.paging {
    display: inline-block;

    .paging-group {display: table; margin: 0 -0.4rem; table-layout: fixed;

        > li {display: table-cell; margin-bottom: 1.0rem; padding: 0 0.4rem; vertical-align: middle;
            
            &:last-child {padding-right: 0;}

            .btn-page {display: flex; align-items: center; justify-content: center; position: relative; min-width: 3.0rem; height: 3.0rem; padding: 0 0.5rem; border: 1px solid #dfdfdf; border-radius:0.5rem; color:#333333; background-color: #ffffff; font-size: 1.6rem; transition: border 0.3s, color 0.3s; cursor: pointer; 
                
                &.first,
                &.prev,
                &.next,
                &.last{
                    span {position: absolute; overflow: hidden; width: 1px; height: 1px; margin: -1px; clip: rect(0 0 0 0);}  
                } 

                &.first,
                &.prev{
                    &::before{
                        content:""; position: absolute; top: 0.7rem; left: 1.0rem; border-top: 0.7rem solid transparent; border-bottom: 0.7rem solid transparent; border-right: 0.8rem solid #333333;
                    }

                    &:focus,
                    &:hover,
                    &.current{
                        &::before{
                            content:""; position: absolute; top: 0.7rem; left: 1.0rem; border-top: 0.7rem solid transparent; border-bottom: 0.7rem solid transparent; border-right: 0.8rem solid #ffffff;
                        }
                    }

                }

                &.first{
                    &::after {
                        content:""; position: absolute; top: 0.8rem; left: 0.8rem; height: 1.2rem; border-left: 2px solid #333333;
                    }

                    &:focus,
                    &:hover,
                    &.current{
                        &::after {
                            content:""; position: absolute; top: 0.8rem; left: 0.8rem; height: 1.2rem; border-left: 2px solid #ffffff;
                        }
                    }
                }

                &.last,
                &.next{
                    &::before {content:""; position: absolute; top: 0.7rem; right: 1.0rem; border-top: 0.7rem solid transparent; border-bottom: 0.7rem solid transparent; border-left: 0.8rem solid #333333;}

                    &:focus,
                    &:hover,
                    &.current{
                        &::before {content:""; position: absolute; top: 0.7rem; right: 1.0rem; border-top: 0.7rem solid transparent; border-bottom: 0.7rem solid transparent; border-left: 0.8rem solid #ffffff;}
                    }
                }

                &.last{
                    &::after{content:""; position: absolute; top: 0.8rem; right: 0.8rem; height: 1.2rem; border-right: 2px solid #333333;}

                    &:focus,
                    &:hover,
                    &.current{
                        &::after{content:""; position: absolute; top: 0.8rem; right: 0.8rem; height: 1.2rem; border-right: 2px solid #ffffff;}
                    }
                }

                &:focus,
                &:hover,
                &.current{border-color: #333333; background:#333333; color: #ffffff; font-weight:Bold;}

            }

        }
        
    }

}


/*-------------------------------------------------------------------
    테이블 하단 설명 ( ex : 주의 등 )
-------------------------------------------------------------------*/
.data-explain{
    width:100%; margin-bottom:1.0rem; padding:1.5rem; border:2px solid #C6C8CA; border-radius:1.0rem;

        ul.indent-text{display: flex; flex-direction: column;  gap:0.5rem;
        li{ font-size:1.6rem;
            
        }
    }

}

/*-------------------------------------------------------------------
    기타 하단 설명( ex : 출처, 정보등 )
-------------------------------------------------------------------*/
.notice-wrap{
    width:100%; margin-top:0.5rem;  border-radius:1.0rem;
        > ul{
            display: flex; flex-direction: column;  

            > li{ 
                font-size:1.3rem; text-align:right; color:var(--gray600-color);
            }
    }

}



/*-------------------------------------------------------------------
	버튼
-------------------------------------------------------------------*/
.btn-box{width:100%; overflow:hidden; margin-top:2.0rem;
    
    display: flex;
    gap:0.5rem;
    justify-content: center;

    .fl{
        display: flex; align-items: center; justify-content: start; gap:0.5rem;
    }

    .fr{
        display: flex; align-items: center; justify-content: end; gap:0.5rem;
    }
}

/*-------------------------------------------------------------------
	버튼 스타일
-------------------------------------------------------------------*/
.btn-type-01{
    position: relative; background: #49525E; border: 1px solid #49525E; color: #ffffff!important; display: inline-flex; align-items: center; justify-content: center; padding: 0 1.5rem; height: 4.0rem; border-radius: 0.5rem; font-size: 1.6rem; overflow: hidden; word-break: keep-all;
    &.long{width:100%;}
}

/*-- 버튼 컬러 --*/
.list{ background: #49525E; border: 1px solid #49525E; color: #ffffff!important;}/* 목록 */
.write{ background: var(--primary-blue-bright-color); border: 1px solid var(--primary-blue-bright-color); color: #ffffff!important;}/* 글쓰기 */
.re{ background: var(--green-color); border: 1px solid var(--green-color); color: #ffffff!important;}/* 답글쓰기 */
.mod{ background: var(--yellow-color); border: 1px solid var(--yellow-color); color: #ffffff!important;}/* 수정 */
.del{ background: var(--black-color); border: 1px solid var(--black-color); color: #ffffff!important;}/* 삭제 */
.cancel{ background: var(--black-color); border: 1px solid var(--black-color); color: #ffffff!important;}/* 취소 */
.confirm{ background: var(--primary-blue-bright-color); border: 1px solid var(--primary-blue-bright-color); color: #ffffff!important;}/* 확인 */

.btn-type-large{
    position: relative; background: #E7EDF5; border: 1px solid #E7EDF5; color: #49525E; display: inline-flex; align-items: center; justify-content: center; padding: 0 1.5rem; height: 4.0rem; border-radius: 0.5rem; font-size: 1.6rem; font-weight:bold; overflow: hidden; word-break: keep-all;
}

.btn-type-tit{
    position: relative;
    background: #E7EDF5;
    border: 1px solid #E7EDF5;
    color: #49525E;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 1.0rem;
    height: 2.5rem;
    border-radius: 0.5rem;
    font-size: 1.4rem;
    overflow: hidden;
    word-break: keep-all;
    margin-left:0.5rem;
}

.icon{gap:0.5rem; }
.icon::before{content:''; width:1.5rem; height:1.5rem; font-size:0; }
.round{border-radius:1.0rem;}
.b-red-white{background:red; color:#ffffff;}
.button-empty-blue,
.b-blue-white{background:var(--primary-blue-bright-color)!important; color:#ffffff!important; border:1px solid var(--primary-blue-bright-color)!important;}
 
.b-green-white{background:green; color:#ffffff;}
.b-brown-white{background:brown; color:#ffffff;}
.b-purple-white{background:purple; color:#ffffff;}
.b-gray-white{background:gray; color:#ffffff;}
.b-black-white{background:black; color:#ffffff;}
.b-white-red{color:red; background:#ffffff;}
.b-white-blue{color:blue; background:#ffffff;}
.b-white-green{color:green; background:#ffffff;}
.b-white-brown{color:brown; background:#ffffff;}
.b-white-purple{color:purple; background:#ffffff;}
.b-white-gray{color:gray; background:#ffffff;}
.b-white-black{color:black; background:#ffffff;}
.btn-blue-white{background:var(--primary-blue-bright-color)!important; color:#ffffff!important; border:1px solid var(--primary-blue-bright-color)!important;}
.btn-sky-white{background:#E6EFF5!important;  border:1px solid #E6EFF5!important; color:#131313!important;}

.btn-icon-type-01{display:inline-block; font-size:0;
    img{width:4.0rem; height:4.0rem;}
}

/*-------------------------------------------------------------------
	기타 버튼
-------------------------------------------------------------------*/
.down{
        font-size:1.6rem;  padding:1.0rem 1.0rem; text-decoration: underline; position:relative; display: flex; align-items: center; gap:1.0rem; background:#ffffff; width: calc(100% - 15.0rem);
        &:before{content:''; display: inline-block; background:var(--gray500-color) url("../img/icon-btn-down-01.svg") no-repeat center; width:3.0rem; height:3.0rem; border-radius:0.5rem;}
    }


/*-------------------------------------------------------------------
	게시판 상세
-------------------------------------------------------------------*/
/*-------------------------------------------------------------------
	상세 입력창
-------------------------------------------------------------------*/
.data-info-table{
    width:100%; border-top:2px solid var(--primary-blue-bright-bg-opa-80); border-bottom: 1px solid var(--gray500-color);
    .data-info-item{
        /* border:2px solid blue; */
        ul{border-top:1px solid #EAEFF4; 
            li{
                border-bottom:1px solid var(--gray300-color); display: flex; min-height:4.0rem;

                .di-tit{width:16.0rem; height:100%; display: flex; align-items: center; justify-content: center; padding:0.5rem; font-size:1.4rem;  font-weight:bold; background:#efefef;}
                .di-form{
                    width:calc(100% - 16.0rem); height:100%; display: flex; align-items: center; justify-content: center; gap:0.8rem; padding:0.5rem;
                    .di-text-01{font-size:1.4rem;}
                    .di-text-02{font-size:1.4rem; width:100%; text-align:left;}

                    input{width:100%; height:3.7rem; border-radius:0.5rem; border:1px solid #EAEFF4;}

                    .di-text-area{height:100%; width:100%; border-radius:1.0rem; border:1px solid #EAEFF4; padding:1.0rem;
                        textarea{width:100%; height:100%;  font-size:1.6rem;}
                    }

                    .btn-down{
                        display: inline-flex; align-items: center; justify-content: start; font-size:1.4rem; color:var(--primary-blue-bright-color); gap:0.8rem; 
                        &::before{content:''; display:inline-block; min-width:2.4rem; height:2.4rem; font-size:0; background:url("../../img/icon-btn-down.png") center no-repeat; background-size:contain;}
                        &:hover{text-decoration: underline; font-weight:bold;}
                    }

                    .btn-move-list{
                        display: inline-flex; align-items: center; justify-content: start; font-size:1.4rem; color:var(--gray700-color); gap:0.8rem; 
                        /* &::before{content:''; display:inline-block; min-width:2.4rem; height:2.4rem; font-size:0; background:url("../../img/icon-btn-down.png") center no-repeat; background-size:contain;} */
                        &:hover{text-decoration: underline; font-weight:bold;}
                    }

                    .txt-ml-date{font-size:1.4rem; color:var(--gray600-color);}


                    .filebox{
                        display: flex;
                        align-items: center;
                        justify-content: center;
                        gap:0.5rem;
                        /* height: 3.7rem!important; border:2px solid red!important; */
                        width:100%!important;
                    }
                    
                    .filebox .upload-name {
                        display: inline-block;
                        
                        height: 3.7rem!important;
                        padding: 0 1.0rem!important;
                        vertical-align: middle;
                        border: 1px solid #dddddd;
                        color: #999999;
                        font-size:1.4rem;
                    }
                    
                    .filebox label {
                        display: inline-flex;
                        align-items: center;
                        justify-content: center;
                        /* padding: 1.0rem 2.0px; */
                        color: #fff;
                        /* vertical-align: middle; */
                        background-color: #999999;
                        cursor: pointer;
                        height: 3.7rem!important;
                        /* padding:0. 1.0rem; */
                        min-width:10.0rem; 
                        text-align:center;
                        font-size:1.6rem;
                        border-radius:0.5rem;
                    }
                    .filebox input[type="file"] {
                        position: absolute;
                        width: 0;
                        height: 0;
                        padding: 0;
                        overflow: hidden;
                        border: 0;
                    }
                }

                /*-- 이전글, 다음글 --*/
                &.move-list{
                    .di-tit{
                        background:#ffffff;
                        &::before{content:''; width:2.4rem; height:2.4rem; }
                        &.prev::before{background:url("../../img/btn-move-list-prev.png") center no-repeat; background-size:contain;}
                        &.next::before{background:url("../../img/btn-move-list-next.png") center no-repeat; background-size:contain;}
                    }


                }

            }
        }
    }
}

@media screen and (max-width: 800px) {

    .data-info-table {
        & .data-info-item {
            & ul {
                li {width:100%; 
                    .di-tit{width:10.0rem;}
                    .di-form{width:calc(100% - 10.0rem); justify-content: start;}
                }
            }
        }
    }
}





/*-------------------------------------------------------------------
	회원정보
-------------------------------------------------------------------*/
.user-wrap{
        width:100%; border:1px solid var(--primary-blue-bright-bg-opa-60); border-radius:1.0rem; box-shadow: var(--gray300-color) 0 0.4rem 0.4rem 0; background:#ffffff; overflow:hidden;   padding:2.0rem;
}

.uw-split{
    border-bottom:2px dotted var(--gray400-color); padding-bottom:2.0rem; margin-top:2.0rem;
    &:first-child{margin-top:0;}
    &:last-child{padding-bottom:0; border-bottom:0;}
}

.btn-user-page{
    font-size:1.6rem; font-weight:Bold; color:var(--gray700-color); opacity: 0.6;
    &:hover,
    &.on{opacity: 1;}
}
.dot{position:relative; display: flex; align-items: center;}
.dot::before{content:''; display: inline-block; width:0.5rem; height:0.5rem; border-radius:50%; background:var(--gray700-color); opacity: 0.6; margin-right:0.5rem;}

.btn-info{
    display: inline-flex; gap:0.5rem; position: relative; color: #ffffff; display: inline-flex; align-items: center; justify-content: center; padding: 0 1.0rem; min-height: 3.2rem; border-radius: 0.5rem; font-size: 1.4rem; overflow: hidden; word-break: keep-all; 
    &.chg-pw{ background: var(--primary-blue-bright-bg-opa-100); border: none;}
    &.chg-pw::before{content:''; background:url("../../img/icon-btn-info-chg-pw.png") center no-repeat; width:2.0rem;  height:2.0rem; background-size:contain;}
}




.file_upload{overflow:hidden; height:40px; display: flex;}


input.upload_text {/*읽기전용 인풋텍스트*/
	/* float:left; */
	width:calc(100% - 9.0rem);/* 버튼 포함 전체 가로 길이*/
	height:4.0rem;
	line-height:1.9rem;
	padding:0 0.3rem;
	background:#ffffff;
	border:1px solid #dcdcdc!important;
	/* margin-left:5px; */
	padding:0 10px;
	vertical-align:top;
}

div.upload-btn_wrap input.input_file {/*파일찾기 폼 투명하게*/
	position:absolute;
	top:0;
	left:0px;
	cursor:pointer;
	opacity:0;
	filter:alpha(opacity=0);
	-ms-filter:"alpha(opacity=0)";
	-moz-opacity:0;
	box-sizing:border-box;
	width:100%;
	height:100%;
}
/* input.upload_text:read-only{background: red; border:0!important;} */

div.upload-btn_wrap {/*버튼테두리 감싼 div*/
	overflow:hidden;
	position:relative;
	float:left;
    width:9.0rem;
	/* width:100px;/*width, height 값은 button(찾아보기)값과 같아야함 */
	/* height:40px;
	padding-left:3px; */

}
div.upload-btn_wrap button {/*버튼 div*/
	/* width:10.0rem; */
    word-break: keep-all;
	height:4.0rem;
	font-weight:bold;
	background: #303030;;
	border:1px solid #303030;
	color:#fff;
	font-size:1.4rem;
    /* padding:0 1.0rem; */
    border-radius:0.5rem;
    min-width:7.0rem;
}
/* .btn_file_plus{display:inline-block; font-size:15px; color:#303030; font-weight:900; width: 50px;
    height:4.0rem;
    font-weight: bold;
    background: #888888;
    border: 1px solid #888888;
    color: #fff;
    font-size: 1.4rem;
	display:inline-block;
	line-height:4.0rem;
	text-align:center;
	box-sizing:border-box;
	margin-left:1.0rem;
} */


.file_upload{overflow:hidden; height:auto; display:inline-block; vertical-align:bottom; display:inline-flex!important;}
.file-btn{ display:inline-block; width: 10.0rem; text-align:center; line-height:3.8rem; height: 4.0rem; font-weight: bold; background: #303030; border: 1px solid #303030; color: #fff; font-size: 1.4rem; margin-right:0.5rem;}
.file-name{ position:relative; display:inline-block; line-height:4.0rem;}
/* .file-name .file-text{display:inline-block;  font-size:1.4rem; vertical-align:middle; position:relative; padding-left:2.5rem; } */
/* .file-name .file-text.ico::before{content:''; display:inline-block!important; width:20px; height:24px; background:url(/static/img/ico-file.png) center no-repeat; background-size:cover; position:absolute; left:0; top: 50%; transform:translateY(-50%);} */
/* .file-name .ico-file-close{display:inline-block; vertical-align:bottom; width:18px; height:18px; background:url(/static/img/cancle-btn.png) center no-repeat; display:inline-block; vertical-align:middle; margin:2px; } */
/* .btn-upload{display: inline-block;  width: 100px; text-align: center; line-height: 38px; height: 40px; background: #e7e7e7;   color: #8f8f8f; font-size: 15px; cursor:auto; margin-left:5px;} */
/* .btn-upload.on{background: #ff9e9e;  color:#303030; cursor:pointer;} */

.file_upload{ width:100%; max-width:50.0rem; display:block;}
.file_upload .upload_text{width:calc(100% - 210px);}
.file_upload .btn-upload{vertical-align:top;}


.btn_file_plus{display:inline-block; font-size:15px; color:#303030; font-weight:900; width: 50px;
    height: 40px;
    font-weight: bold;
    background: #888888;
    border: 1px solid #888888;
    color: #fff;
    font-size: 15px;
	display:inline-block;
	line-height:40px;
	text-align:center;
	box-sizing:border-box;
	margin-left:10px;
}




