@charset "utf-8";

@import url('searchResult.css');


/************************** 이브릭몰 프로토콜 **************************/



/* 서치박스 백그라운드  */
#ebric_pc_wrap.protocol #main-content-wrap .sub-view-wrap .product-list-wrap .searching-result-wrap .research-layer .search-box .search-btn {background: #ff9134;}

/* 프로토콜 체크박스 */
#ebric_pc_wrap.protocol .custom-check-label:before {width: 15px; height: 15px; position: absolute; content: ''; left: 0; top: 50%; margin-top: -7.5px; background: url(../../img/common/check_bg_orange.png); background-size: 15px 45px;}
#ebric_pc_wrap.protocol .custom-check:checked + .custom-check-label:before { background-position: 0 -15px; }
#ebric_pc_wrap.protocol .custom-check:disabled + .custom-check-label:before { background-position: 0 -30px; }
#ebric_pc_wrap.protocol .custom-check:checked + .custom-check-label {color: #ff9134}

/* 왼쪽 메뉴  */
#ebric_pc_wrap.protocol #main-content-wrap .sub-view-wrap .search-result-wrap>.search-filter .search-modify-wrap {padding: 0 10px 10px;}
#ebric_pc_wrap.protocol #main-content-wrap .sub-view-wrap .search-result-wrap>.search-filter .search-modify-wrap span {text-align: center; font-size: 1.5rem; border: 1px solid #ff9134; padding: 10px; border-radius: 7px; color: #ff9134; cursor: pointer; transition: opacity .3s ease; display: block; font-weight: 600; background-color: #fff;}
#ebric_pc_wrap.protocol #main-content-wrap .sub-view-wrap .search-result-wrap>.search-filter .search-modify-wrap span:hover {opacity: 0.8}

#ebric_pc_wrap.protocol #main-content-wrap .sub-view-wrap .search-result-wrap>.search-filter .filter-wrap { max-height: 510px; overflow-y: auto; -ms-overflow-style: none; /* IE and Edge */ scrollbar-width: none; /* Firefox */; padding: 10px;}
#ebric_pc_wrap.protocol #main-content-wrap .sub-view-wrap .search-result-wrap>.search-filter .filter-wrap::-webkit-scrollbar {display: none}
#ebric_pc_wrap.protocol #main-content-wrap .sub-view-wrap .search-result-wrap>.search-filter .filter-category {padding: 0}
#ebric_pc_wrap.protocol #main-content-wrap .sub-view-wrap .search-result-wrap>.search-filter .filter-category:hover .category-name {color: #ff9134;} 
#ebric_pc_wrap.protocol #main-content-wrap .sub-view-wrap .search-result-wrap>.search-filter .filter-category.select .category-name {color: #fff;} 
/*#ebric_pc_wrap.protocol #main-content-wrap .sub-view-wrap .search-result-wrap>.search-filter .filter-category.select::after {content: '';  position: absolute; bottom: 26px; left: 5px; width: 0; height: 0; border-top: 5px solid transparent; border-left: 8px solid #ff9134; border-bottom: 5px solid transparent}*/

#ebric_pc_wrap.protocol #main-content-wrap .sub-view-wrap .search-result-wrap>.search-filter .filter-category.select .category-title .product-number {color: #fff;}
#ebric_pc_wrap.protocol #main-content-wrap .sub-view-wrap .search-result-wrap>.search-filter .filter-category .category-title {cursor: pointer; padding: 7px 15px 1px; font-weight: 500; margin-bottom: 7px;}
#ebric_pc_wrap.protocol #main-content-wrap .sub-view-wrap .search-result-wrap>.search-filter .filter-category.select .category-title {font-size: 1.6rem; font-weight: 700; background-color: #ff9134; border-radius: 33px}
#ebric_pc_wrap.protocol #main-content-wrap .sub-view-wrap .search-result-wrap>.search-filter .filter-category .category-title .category-name {display: inline-block; width: calc(100% - 71px); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
/*#ebric_pc_wrap.protocol #main-content-wrap .sub-view-wrap .search-result-wrap>.search-filter .filter-category.select .category-title .category-name {padding-left: 10px;}*/
#ebric_pc_wrap.protocol #main-content-wrap .sub-view-wrap .search-result-wrap>.search-filter .filter-category .category-title .product-number {float: right; color: #999; font-size: 1.3rem; font-weight: 500; line-height: 23px;}

/* 컨텐츠 */
#ebric_pc_wrap.protocol #main-content-wrap .sub-view-wrap .product-list-wrap { width: calc(100% - 280px); float: right; background: #f6f7fb; padding-top: 0;border-left: 1px solid #ddd;}
#ebric_pc_wrap.protocol #main-content-wrap .sub-view-wrap .product-list-wrap .box-wrap .product-box .top-area .product-info-wrap .product-info .product-property .product-name {color: #ff9134}
#ebric_pc_wrap.protocol #main-content-wrap .sub-view-wrap .product-list-wrap .box-wrap .product-box .bottom-area .txt-area .product-classify-wrap table tbody tr td .sale-price {color: #ff9134}
#ebric_pc_wrap.protocol.patent-scroll .patent-content-wrap {width: calc(100% - 280px);border-left: 1px solid #ddd;}
#ebric_pc_wrap.protocol #main-content-wrap .sub-view-wrap .product-list-wrap .box-wrap .product-box .bottom-area .txt-area .user-tool-btn a:hover {border-color: #ff9134; background: #ff9134}
#ebric_pc_wrap.protocol #main-content-wrap .sub-view-wrap  .product-list-wrap .box-wrap .product-box .bottom-area .txt-area .product-classify-wrap .more-btn:hover { color: #ff9134 } 
#ebric_pc_wrap.protocol #main-content-wrap .sub-view-wrap .product-list-wrap .box-wrap .product-box .bottom-area .txt-area .product-classify-wrap {margin-bottom: 10px;}
#ebric_pc_wrap.protocol #main-content-wrap .sub-view-wrap .product-list-wrap .box-wrap .product-box .bottom-area .txt-area .hash-wrap { width:  calc(100% - 125px); padding-right: 25px; overflow: hidden; height: 38px; position: relative; text-overflow: ellipsis; display: -webkit-box; white-space: normal; word-wrap: break-word;  -webkit-line-clamp: 2; -webkit-box-orient: vertical}
#ebric_pc_wrap.protocol #main-content-wrap .sub-view-wrap .product-list-wrap .box-wrap .product-box .bottom-area .txt-area .hash-wrap.on {height: auto; overflow: initial; word-break: break-all; white-space: normal; -webkit-line-clamp: initial;  text-overflow: initial;}
#ebric_pc_wrap.protocol #main-content-wrap .sub-view-wrap .product-list-wrap .box-wrap .product-box .bottom-area .txt-area .hash-wrap .more-btn {position: absolute;top: 1px;right: 7px;}
#ebric_pc_wrap.protocol #main-content-wrap .sub-view-wrap .product-list-wrap .box-wrap .product-box .bottom-area .txt-area .hash-wrap .more-btn i {font-size: 1.5rem; color: #aaa; transition: opacity .3s ease;}
#ebric_pc_wrap.protocol #main-content-wrap .sub-view-wrap .product-list-wrap .box-wrap .product-box .bottom-area .txt-area .hash-wrap .more-btn i:hover {opacity: 0.7}
#ebric_pc_wrap.protocol #main-content-wrap .sub-view-wrap .product-list-wrap .box-wrap .product-box .bottom-area .txt-area .hash-wrap.on .more-btn i {transform: rotate(180deg)}

/* 검색어 영역 */
#ebric_pc_wrap.protocol .product-notice-wrap {font-size: 1.2rem; padding: 8px 10px; border: 1px solid #e5e5e5; background: #fff; color:#969696;margin-bottom: 10px;}
#ebric_pc_wrap.protocol .keyword-wrap { background: #fff; padding: 8px 10px; border: 1px solid #e5e5e5;}
#ebric_pc_wrap.protocol .keyword-wrap .left-area {float: left; width: 100px; font-size: 1.4rem; color: #444; font-weight: 600; padding-left: 20px; }
#ebric_pc_wrap.protocol .keyword-wrap .right-area {float: right; width: calc(100% - 100px)}
#ebric_pc_wrap.protocol .keyword-wrap .right-area ul {height: 55px; overflow: hidden; }
#ebric_pc_wrap.protocol .keyword-wrap .right-area ul li {display: inline-block; margin-right: 10px; margin-bottom: 10px;}
#ebric_pc_wrap.protocol .search-bottom-area {text-align: center; padding: 5px 0; margin-bottom: 10px; background-color: #fff; border: 1px solid #e5e5e5; border-top: 0; padding: 5px 0 6px}
#ebric_pc_wrap.protocol .search-bottom-area i {margin-right: 3px}
#ebric_pc_wrap.protocol .search-bottom-area span a {font-size:1.2rem; color:#888;  }
#ebric_pc_wrap.protocol .search-bottom-area:hover a { color: #FF702B}

/* 팝업 */

.popup-wrap {position: fixed; background: rgba(0,0,0,.2); width: 100% ;height: 100%; z-index: 5;}
.popup-wrap .popup {position: absolute;top: 50%;left: 50%; transform: translate(-50%,-50%); background: #fff; width: 800px; height: calc(100% - 200px); border-radius: 10px;box-shadow: 0 0 12px rgba(0,0,0,0.2)}
.popup-title-area {margin-bottom: 20px; padding: 10px 20px;font-size: 2rem; font-weight: 700; position: relative; border-bottom: 1px solid #e5e5e5;}
.popup-wrap .popup .popup-title-area .close-btn { position: absolute; right: 20px; top: 17px; cursor: pointer;}
.popup-wrap .popup .contents-area {padding: 0px 20px; line-height: 20px;overflow-y: auto; height: calc(100% - 145px);}
.popup-wrap .popup .txt-area {width: 100%; border: 1px solid #e5e5e5; padding: 10px; height: 250px; overflow-y: auto; background-color: #f7f7f7;font-size: 1.3rem; margin-bottom: 20px;}

.popup-wrap .popup .txt-area .keyword {color: #ff9134; font-weight: 600}
.popup-wrap .popup textarea {width: 100%; border: 1px solid #e5e5e5; height: 100%; padding: 10px 15px 60px 15px; font-size: 1.3rem; line-height: 24px;-ms-overflow-style: none; /* IE and Edge */ scrollbar-width: none; /* Firefox */ border-radius: 0}
.popup-wrap .popup .top-search textarea {background:#f1f1f1;transition: background .3s ease}
.popup-wrap .popup .top-search textarea:focus, .popup-wrap .popup .top-search textarea:active {background: #fff;}
.popup-wrap .popup textarea::-webkit-scrollbar {display: none}
.popup-wrap .popup .extract-tit {font-size: 1.5rem; font-weight: 600; padding-bottom: 10px;}
.popup-wrap .popup .re-txt-area {height: 100%}
.popup-wrap .popup .re-txt-area textarea {width: 100%; height: 100%}
.popup-wrap .popup textarea:focus, .popup-wrap .popup textarea:active{ border-color: #ff9134 !important; }
.popup-wrap .popup .popup-foot-area {padding: 20px; border-top: 1px solid #dee3eb; background-color: #fff; border-radius: 0 0 10px 10px;}
.popup-wrap .popup .popup-foot-area .btn-wrap {float: right}
.popup-wrap .popup .popup-foot-area .btn-wrap a {border: 1px solid #ddd; display: inline-block; height: 37px; margin-bottom: 5px; border-radius: 4px; line-height: 34px;font-size: 1.3rem; font-weight: 400;    text-align: center; padding: 0px 10px; background: #F5F7F9; letter-spacing: -0.5px; transition: opacity .2s ease;}
.popup-wrap .popup .popup-foot-area .btn-wrap a.search-button, 
.popup-wrap .popup .popup-foot-area .btn-wrap a.enter-button {background: #ff9114; border-color: #ff9134; color: #fff;}
.popup-wrap .popup .popup-foot-area .btn-wrap a.enter-button {min-width: 100px}
.popup-wrap .popup .popup-foot-area .btn-wrap a:hover {opacity: 0.8;}
.popup-wrap .popup .popup-foot-area .btn-wrap a:first-child {margin-right: 5px}

.popup-wrap .popup .contents-area .top-search,.popup-wrap .popup .contents-area .bottom-search {position: relative; height: 260px}

.popup-wrap .popup .contents-area .top-search-wrap {margin-bottom: 20px}
.popup-wrap .popup .contents-area .top-info-wrap, 
.popup-wrap .popup .contents-area .bottom-info-wrap {background: #f9f6f2; position: absolute; width: calc(100% - 2px); bottom: 0px; left: 1px}
.contents-area .top-search .top-info-wrap .top-info, 
.contents-area .bottom-search .bottom-info-wrap .bottom-info {padding: 15px; display: inline-block; font-weight: 500; color: #999; font-size: 1.3rem; height: 48px}
.contents-area .top-search .top-info-wrap .top-info img,
.contents-area .bottom-search .bottom-info-wrap .bottom-info img {width:16px; height: 16px; opacity: 0.5; position: relative; top: 1px}
.contents-area .top-search .top-info-wrap .word-counting,
.contents-area .bottom-search .bottom-info-wrap .word-counting {display: inline-block; font-size: 1.4rem; color: #ff9134; font-weight: 600}
.contents-area .bottom-search .bottom-info-wrap {bottom: 1px}
.contents-area .bottom-search .loading-wrap {width: 100%; height: calc(100% - 50px); z-index: 1; background: #fff; position: absolute; border: 1px solid #dcdcdc; border-bottom: 0}
.contents-area .bottom-search .loader.loader--style8 {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);}
.contents-area .bottom-search .bottom-info-wrap .bottom-info span {color: #ff9a1d}
.contents-area .bottom-search .bottom-info-wrap .word-counting {float: right; padding: 15px;}
.contents-area .top-search .top-info-wrap .extract-btn {float: right;background: #ff9134; cursor: pointer; transition: opacity .2s ease}
.contents-area .top-search .top-info-wrap .extract-btn .btn {padding: 14px 37px; font-size: 1.5rem; color: #fff; font-weight: 400}
.contents-area .top-search .top-info-wrap .extract-btn:hover {opacity: 0.9}
.contents-area .btn-wrap {margin: 20px 0 30px}
.contents-area .btn-wrap a {display: inline-block;color: #fff; background: #ff9134; height: 45px; border-radius: 4px; line-height: 45px;font-size: 1.6rem; font-weight: 400;    text-align: center; padding: 0px 50px; letter-spacing: -0.5px; float: right; transition: background .3s ease}
.contents-area.btn-wrap a:hover {background: #ff832c}