.btn_text.dropdown-toggle::after{

    display: none;

}



.btn_text{

    padding: 3px 16px;

    border-radius: 2rem;

    font-size: .95rem;

    letter-spacing: .25rem;

    font-weight: 500;

    white-space: nowrap;

}

.btn_text_sm{

    font-size: 0.8rem;

    padding: 6px 20px;

}

.btn_text_lg{

    font-size: 1rem;

    padding: 5px 20px;

}

.btn_text_xl{

    font-size: 1.125rem;

    padding: 6px 32px;

}

@media(min-width: 576px){

    .btn_text{

        padding: 5px 22px;

        font-size: .95rem;

    }

    .btn_text_sm{

        font-size: 0.8rem;

        padding: 3px 16px;

    }

    .btn_text_lg{

        font-size: 1.05rem;

        padding: 8px 32px;

    }

    .btn_text_xl{

        font-size: 1.25rem;

        padding: 12px 40px;

    }

}



.btn_text:hover{

    transition: .5s;

}

/* .funcbtn{

    font-size: 1.25rem;

    padding: 3px 16px;

    border: 0px;

} */

.funcbtn{

    font-size: 1.25rem;

    padding: 0px;

    border: 0px;

    width: 35px;

    height: 35

    px;

    text-align: center;

}

#btn_history_back{

    background-color: transparent;

    border-radius: 50%;

    width: 2.5rem;

    height: 2.5rem;

    display: flex;

    align-items: center;

    justify-content: center;

    border: none;

    color: rgb(0, 0, 0);

    font-size: 1.25rem;

}

#btn_history_back:hover{

    background-color: rgb(255,255,255);

}

/**/

.breadcrumb_block{

    display: flex;

    align-items: center;

    padding: .625rem 0px;

}

.breadcrumb_block .breadcrumb{

    margin-bottom: 0px;

}

.breadcrumb_block a{

    color: rgb(78,78,78);

    text-decoration: none;

}

.breadcrumb_block .breadcrumb-item+.breadcrumb-item::before {

    float: left;

    padding-right: 0.625rem;

    color: #4e4e4e;

    content: var(--bs-breadcrumb-divider, ">");

}

.breadcrumb_block .breadcrumb-item+.breadcrumb-item {

    padding-left: 0.625rem;

}

.title_block{

    padding-bottom: 1.25rem;

    border-bottom: 1px solid #d3d3d3;

    margin-bottom: 2.5rem;

}

/* .title_block .main_title{

    font-weight: 500;

    font-size: 1.5rem;

    transform: translateY(3px);

    display: block;

}

.title_block .sub_title{

    font-weight: 300;

    font-size: 1.5rem;

} */

.heading{

    font-weight: 00;

    font-size: 1.25rem;

}

/*tag*/

.tag_frame{

    white-space: nowrap;

    font-size: .9rem;

    font-weight: 500;

}

.tag_frame::before{

    content:"\A";

    width: 7px;

    height: 7px;

    border-radius:50%;

    background: #7c7c7c;

    display:inline-block;

    margin:0 10px;

}

.tag_danger::before{

    background-color: #D76E60;

}

.tag_warn::before{

    background-color: #FFB45C;

}

.tag_primary::before{

    background-color: #487DCE;

}

.tag_secondary::before{

    background-color: #707070;

}

/*inputbox*/

.inputbox{

    border-radius: 30px;

    border: 1px solid rgb(185,185,185);

}

/*scrollbar*/

.scrollbar_x{

    overflow-x: auto;

    scrollbar-width: thin;

}

.scrollbar_x::-webkit-scrollbar-track {

    border-radius: 10px;

    background-color: transparent;

}



.scrollbar_x::-webkit-scrollbar {

    background-color: transparent;

    height: 8px;

}



.scrollbar_x::-webkit-scrollbar-thumb {

    border-radius: 10px;

    background-color: rgb(190, 190, 190);

}

.scrollbar_y{

    overflow-y: auto;

    scrollbar-width: thin;

}

.scrollbar_y::-webkit-scrollbar-track {

    border-radius: 10px;

    background-color: transparent;

}



.scrollbar_y::-webkit-scrollbar {

    background-color: transparent;

    width: 6px;

}



.scrollbar_y::-webkit-scrollbar-thumb {

    border-radius: 10px;

    background-color: rgb(190, 190, 190);

}

/*message*/

#user_photo {

    width: 50px;

    height: 50px;

    border-radius: 50%;

    border: 1px solid rgb(177, 177, 177);

}



#user_photo img {

    border-radius: 50%;

}



#message_textarea {

    max-height: 100px;

    overflow: auto;

}



.textarea {

    display: block;

    width: 100%;

    overflow: hidden;

    resize: vertical;

    min-height: 40px;

    line-height: 20px;

}



.textarea[contenteditable]:empty::before {

    content: "發送訊息";

    color: gray;

}



.time_block {

    color: #6A7074;

}



.content_block .text {

    background-color: #487DCE;

    color: #fff;

    padding: 12px 20px;

    border-radius: 20px;

    word-break: break-all;

}



.content_block .time {

    font-size: .8rem;

}



.content_block .name {

    color: #343E42;

    font-size: .9rem;

}



.content_block .text_block,

.content_block .time,

.content_block .name {

    margin-right: .5rem;

    margin-left: .5rem;

}





/**/

.box_16to9 {

    width: 100%;

    position: relative;

}

.box_16to9:after {

    content: "";

    display: block;

    padding-bottom: calc(100%*9/16);

}



/*progress*/

.progressbox{

    height: 0.5rem;

}