@charset "utf-8";
.compare-checkbox{padding: .75rem .5rem 1rem .5rem; border-top: 1px solid rgb(0 0 0 / 50%); margin-top: 1rem;}
.compare-list-btn{cursor:pointer;}
.custom-control-label {padding-left: .25rem;font-size: 1rem;}
.custom-control-label::before {top: .1rem; width: 1.25rem; height: 1.25rem;}
.custom-control-label::after {top: .1rem; width: 1.25rem; height: 1.25rem;}
.compare-checkbox .custom-control-input:focus~.custom-control-label::before{box-shadow: none;}
.compare-checkbox .custom-control-input:focus~.custom-control-label::before {border-color: #606060;}
.compare-checkbox .custom-control-input:checked~.custom-control-label::before{border-color: #628fa2;background-color: #628fa2;}

.compare-list-page{margin-bottom: 60px;}
.compare-product-item-box{display: grid;grid-gap: 1rem;grid-template-columns: repeat(4, 1fr);}
.compare-product-item-box .image-box{margin-bottom: .75rem;}
.compare-product-item-box .image-box {aspect-ratio: auto!important;}

.desktop-item2 .compare-product-item-box{grid-template-columns: repeat(2, 1fr);grid-gap: 3rem;}
.desktop-item2 .not-compare{display: none!important;}
.desktop-item2 .compare-product-item-box .image-box img{ max-width: 250px;}
.desktop-item3 .compare-product-item-box{grid-template-columns: repeat(3, 1fr);grid-gap: 2rem;}
.desktop-item3 .not-compare{display: none!important;}
.desktop-item3 .compare-product-item-box .image-box img{ max-width: 250px;}
.desktop-item4 .compare-product-item-box{grid-template-columns: repeat(4, 1fr);}
.desktop-item4 .compare-product-item-box .image-box img{ max-width: 250px;}

.compare-product-item{border: 2px solid #ccc; border-radius: 16px; padding: 26px 12px 24px;position: relative;}
.compare-product-item.not-compare{border: 2px dashed #ccc;display: flex ; flex-direction: column; justify-content: center; align-items: center; }
.compare-product-item .compare-close{cursor: pointer; background: url(../../images/compare/16_cross_normal.svg);position: absolute; width: 23px; height: 23px; top: 3px; right: 3px;   color: #181818;z-index: 1;}
.compare-list-page .product-number{overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;}
.compare-list-page .product-name{background: none!important;margin-bottom: 0rem;}
.compare-list-page .product-name a{font-size: 1.125rem;overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.compare-list-page .product-more{display: flex;justify-content: center;}
.compare-list-page .not-selected-txt{padding: 1rem; margin-bottom: 0;}
.compare-list-page .select-group{display: flex; width: 100%; flex-direction: column; grid-gap: .5rem;}

.compare-specifications-body{margin-top: 30px;}
.compare-specifications-page:nth-child(even){background-color: #f2f2f2;}
.compare-specifications-page:last-child{border-bottom: 1px solid #ccc;}
.compare-specifications-page{border-top: 1px solid #ccc;padding: 5px 5px 5px 5px;}
.compare-specifications-title{font-weight: bold;padding: .5rem;font-size: 1.25rem;position: relative;}
.compare-specifications-box{display: grid;grid-template-columns: repeat(4, 1fr);grid-gap: 1rem;}
.desktop-item2 .compare-specifications-box{grid-template-columns: repeat(2, 1fr);grid-gap: 3rem;}
.desktop-item3 .compare-specifications-box{grid-template-columns: repeat(3, 1fr);grid-gap: 2rem;}
.desktop-item4 .compare-specifications-box{grid-template-columns: repeat(4, 1fr);}

.compare-specifications-item{padding: .5rem .5rem 1.5rem .5rem;}
.compare-specifications-title .collapse-icon{cursor: pointer; background: url(../../images/compare/12-minus-normal.svg);position: absolute; width: 24px; height: 24px; top: 8px; right: 8px; color: #181818;z-index: 1; background-size: contain;}
.compare-specifications-title .collapse-icon.collapsed{background: url(../../images/compare/12-plus-normal.svg); background-size: contain;}

.compare-product-more-box{display: grid;grid-template-columns: repeat(4, 1fr);grid-gap: 1rem;}
.desktop-item2 .compare-product-more-box{grid-template-columns: repeat(2, 1fr);grid-gap: 3rem;}
.desktop-item3 .compare-product-more-box{grid-template-columns: repeat(3, 1fr);grid-gap: 2rem;}
.desktop-item4 .compare-product-more-box{grid-template-columns: repeat(4, 1fr);}
.compare-product-more-item{padding:2rem 1rem;}
.mobile-2 {display: none}

.compare-pagination-box{}
.compare-pagination-box .pagination{margin-top: 2rem;}
.compare-pagination-box .page-link{padding: .5rem 1.25rem; color: #004986;}
.page-item.active .page-link {background-color: #004986; border-color: #004986;}

.product-detailed-btn-group{display: grid;grid-template-columns: repeat(2, 1fr);grid-gap: 10px;}
.add-compare-btn-group{display: flex;column-gap: 10px;}
.wb-inquiry-btn-group{width: 100%!important;}
.add-compare { color: #FFF; border: 1px solid rgba(0, 0, 0, 0.15); background-color: rgb(98, 143, 162); border-radius: 4px;   text-align: center;margin-bottom: 10px;}
.add-compare:hover {color: #FFF; background-color: rgb(54, 108, 130);}
.add-compare.disabled{background-color:rgb(96 96 96); }
.add-compare.disabled:hover {color: #FFF; background-color: rgb(96 96 96);}

.offcanvas-bottom-page{position: fixed; bottom: 0; z-index: 1100; background-color: #fff; width: 100%; padding: 20px 10px;border-top: 1px solid #ccc;}
.offcanvas-bottom-box{display: grid;grid-template-columns:70% auto;grid-gap: 1rem;}
.offcanvas-bottom-title{color: #004986;}
.offcanvas-bottom-title span{ font-size: 1rem; color: #333}
.offcanvas-bottom-title strong{font-size: 1.125rem; margin: 0 .5rem; color: #ff6600;}
.offcanvas-btn-box{}
.offcanvas-bottom-txt{ color: #666}
.offcanvas-btn-group{display: grid;grid-template-columns: repeat(2, 1fr);grid-gap: 1rem;}
.offcanvas-bottom-page .compare-product-item {padding: 12px 12px;}
.offcanvas-bottom-page .compare-product-item .compare-close{top: 2px; right:2px;}
.offcanvas-bottom-page .product-name{text-align: center;padding: 0px; background: none!important;margin-bottom: 0rem;}
.offcanvas-bottom-page .product-name a{font-size: 0.9375rem; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.offcanvas-bottom-page .image-box {padding: .5rem; margin-bottom: 0;}
.offcanvas-bottom-page .image-box img{max-width: 100px;}
.offcanvas-bottom-close{cursor: pointer; background: url(../../images/compare/16_cross_normal.svg);position: absolute; width: 30px; height: 30px; top: 6px; right: 6px;   color: #181818;z-index: 1;}
.offcanvas-bottom-show{cursor: pointer; background: url(../../images/compare/16_up_normal.svg); position: absolute; width: 42px; height: 36px; top: -35px; right: 60px; color: #181818; z-index: 2;
 border: 1px solid #ccc; background-color: #fff; border-bottom: 0px solid #ccc; background-position: center; border-radius: 4px; background-size: 100%;}

@media (max-width: 1199.98px) {
.desktop-4{display: none}
.mobile-2 {display: block}
.mobile-2 .compare-product-item-box{grid-template-columns: repeat(2, 1fr);grid-gap: 1rem;}
.mobile-2 .compare-specifications-box{grid-template-columns: repeat(2, 1fr);grid-gap: 1rem;}
.mobile-2 .compare-product-more-box{grid-template-columns: repeat(2, 1fr);grid-gap: 1rem;}
.mobile-2 .compare-product-item-box .image-box img{    max-width:250px;}
}

@media (max-width: 991.98px) {
.mobile-2 .compare-product-item-box .image-box img{  max-width:250px;}
.offcanvas-open{height: 100VH;overflow-y: auto;padding: 20px 0px!important;}
.offcanvas-open .offcanvas-bottom-box{grid-template-columns:1fr;}
.offcanvas-open .compare-product-item-box{grid-template-columns: repeat(1, 1fr);order: 2;}
.offcanvas-open .wb-compare-box{}
.offcanvas-open .compare-product-item{display: flex;grid-gap: 1rem; padding: 10px 20px ;}
.offcanvas-open .image-box img {max-width: 120px;}
.offcanvas-open .product-name { text-align: left;}
.offcanvas-open .compare-product-item .compare-close { top: 4px;right: 4px;}
}
@media (max-width: 575.98px) {
.mobile-2 .compare-product-item-box .image-box img{    max-width: 100%;}
}