/*--Srarch Content--*/
.searchCondition { display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; justify-content: space-between; align-items:flex-start; padding: 10px;}
.searchCondition form { width: 100%;}
.searchCondition p, .searchResult p { margin-bottom: 0px;}
.searchCondition p { }
.searchCondition select { border-radius: 0px; border: 1px solid #818181; color: #818181; padding: 4px 15px; margin: 0 2px;}
.chooseA, .chooseB { display:box; display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; justify-content: space-between; align-items: center; margin: 4px 0;}
.chooseA > select { width: 100%;}
.chooseB > select { width: 50%;}
.searchResult { margin: 0px 12px 0 0; width: 35%;}
.searchFont label { font-size: 0.8rem; color: #818181; line-height: 25px;}
.form-check-input:checked { background-color: #DB2019; border-color: #DB2019 }
.form-check-input:focus { border-color: #ffb9c0; outline: 0; box-shadow: 0 0 0 .1rem #ffb9c0;}

/*--Search Button--*/
.searchBu { border-radius: 6px; margin: 0 2px;}
.searchBu input { display: block; border: 0px; background: #595959; color:#818181; padding: 20px 10px; border: 2px solid #818181; border-radius: 6px;}
.searchBu input:hover { border: 2px solid #FFF; color: #FFF;}
.searchAddBu { background: #818181; text-align: center; color: #FFF; border: 0px; padding: 0px; border-right: 1px solid #FFF;  width: 50px;}
.searchAddBu i { display: block; padding: 10px;}
.searchAddBu:hover { background: #DB2019;}
.searchDelete { border: 0px; background: #818181; color: #FFF; padding: 0px 18px; border-left: 1px solid #FFF;}
.searchDelete:hover { background: #484752;}
.accordion h6 { position: relative; display: block;}
.accordion h6 > a { display: flex; justify-content: space-between; align-items: center; padding-right: 10px; color: #000;}

/*--searchBox--*/
.searchBox { flex: 0 0 calc(25% - 8px); display: flex; flex-direction: column; justify-content: space-between; padding: 0.25rem; box-sizing: border-box;}
.searchBox a:hover h5 { color: #DB2019; }
.searchBox img { width: 100%; border: 1px solid #C4C4C4;}
.searchBox h5 { font-size: 0.875rem; color: #818181;}
.searchAdd, .searchRed { color: #FFF; text-align: center;}
.searchAdd { background: #484752; width: 30%; cursor: pointer;}
.searchAdd > div { width: 100%; padding: 8px 20px;}
.searchAdd_2 { background-color: #801c28;}
.searchRed { background: #818181; width: 100%;}
.searchRed a { color:#FFF; display: block; padding: 8px 0;}
.searchRed a:hover { background: #DB2019;}
.searchItem > .boxRight { justify-content: flex-end;}
.searchItem { width: 100%;}


/*--------------------search collapse + ----------------------*/
.accordion h6 > a::after { content: "▲";
  font-size: 0.8em;
  transition: transform 0.3s ease;}
.accordion h6 > a.collapsed::after { transform: rotate(0deg);}
.accordion h6 > a:not(.collapsed)::after { transform: rotate(-180deg);}


/*-----------------------------------------------------search All----------------------------------------------------------*/
.searchAll { padding: 0 0 40px 0;}
.searchList { border: 1px solid #e5e5e5; display:box; display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; align-items: center; margin: 10px 0; padding: 10px;}
.listContent img { width: 120px; border: 1px solid #e5e5e5;}
.listText { padding: 0 20px; width: 100%;}
.listText h6, .listText h4 { padding: 4px 0;}
.listText h4 { color: #DB2019;}
.listText h6 { color: #7c7c7c;}
.listText p { white-space: nowrap; width: 80%; overflow: hidden; text-overflow: ellipsis; line-height: 25px;}
.listText a { color: #484752;}
.breadCrumbs { padding: 0 0 0 20px;}
.breadCrumbs p > a { font-size: 0.85rem; color: #AFAFAF;}
.breadCrumbs p > a:hover { color: #DB2019;}
.pageNumber { color: #818181; font-size: 0.9rem; text-align: center; padding: 20px;}
.pageNumber span { margin: 0 2px; padding: 4px 8px; border: 1px solid #818181; border-radius: 2px;}
.pageNumber span:hover { background: #c7c7c7;}
.pageControl { background: #818181; color: #FFF;}

.inquiryBu { bottom: 120px; right: 10px; position: fixed; border-radius: 50px; background: rgb(255 255 255 / 48%); width: 40px; height: 40px; line-height: 36px; text-align: center; display: block; border: 1px solid #C4C4C4;}
.inquiryBu img { width: 40%;}
.badge { position: absolute; top: -10px; right: 20px; padding: 3px 5px; border-radius: 50%; background-color: red; color: white; border: 3px solid #e8e8e8;}
.addButton { margin: 10px 0px; width: 160px; background: #818181; text-align: center; color: #FFF; border: 0px; padding: 0px;}
.addButton:hover { background: #DB2019;}
.deleteButton:hover { background: #484752;}
.deleteButton { border: 0px; background: #818181; color: #FFF; padding: 0px 8px;}






@media (max-width: 768px) {
    .searchProducts { width: 100%;}
}

@media (max-width: 576px) {
    .searchCondition, .chooseA, .chooseB { display: block; margin: 0 20px;}
    .searchCondition select { width: 100%; margin: 2px 0;}
    .searchBu { margin: auto; width: 50%;}
    .searchBu input { padding: 6px 20px; width: 100%; margin: 10px 0;}
    .searchBox { margin: 10px 0;}
    .searchList { display: block; text-align: center;}
    .listContent img { width: 200px;}
    .accordion-item, .searchResult, .searchBox, .searchItem { width: 100%;}
    .searchItem .row, .searchItem, .searchCondition .row { display: block; }
    .searchFont > div { display: flex;}
    .searchBox { flex: 0; display: block; padding: 0rem;}
    .breadCrumbs { padding: 0px;}

}