﻿@charset "UTF-8";
/**************************************
#pageAdvancedSearch
**************************************/

/*-----------------------------------*/
.brand_0201_content,
.brand_0202_content {
  display: none;
  clear: both;
  overflow: hidden;
}

[id$="brand_0201"]:checked ~ .brand_0201_content,
[id$="brand_0202"]:checked ~ .brand_0202_content {
  display: block;
/*  margin-top: -2px;*/
}
.modal .modal-inner .dvProductAdvancedSearch {
  height: 100%;
}
.modal .modal-inner .dvProductAdvancedSearch .toogle {
  height: calc(100% - 2rem);
}

.searchbox-inner {
  position: relative;
  width: calc(100% - 4.5rem);
}
.sortbox input[type="text"] {
  width: 100%;
}
#dvSuggest {
  position: absolute;
  top: 5rem;
  left: 0;
  width: 100%;
  background: #fff;
  border: 1px solid #ededed;
  box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
  z-index: 2;
}
#dvSuggest .suggest-item {
  padding: 1.5rem 2rem;
}
#dvSuggest .suggest-item:not(:first-child) {
  border-top: 1px solid #ededed;
}
#dvSuggest .suggest-item:has(:not(a[href])) {
  padding-block: 0.8rem;
  background: #F5F5F5;
}
#dvSuggest .suggest-item:hover {
  background: #eff6fc;
}
.hot-Keyword-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}
.hot-Keyword-list a {
  display: flex;
  align-items: center;
  height: 3rem;
  border: 1px solid #022363;
  border-radius: 1.5rem;
  background: #fff;
  padding: 0.7rem 2rem;
  color: #022363;
}
.hot-Keyword-list a:hover {
  background: #022363;
  color: #fff;
}
.range-wrapper {
  width: 49.5rem;
  padding-inline: 6rem;
  padding-block: 2.5rem;
}
.noUi-horizontal {
  height: 0.5rem;
}
.noUi-connect {
  background: #6585B2;
}
.noUi-horizontal .noUi-handle {
  box-shadow: unset;
  border: 0;
/*  height: 3.6rem;
  width: 12rem;
  top: -1.55rem;
  right: -6rem;*/
  border-radius: 1.8rem;
  background: #fff;
  border: 2px solid #6585b2;
  width: 7.2rem;
  height: 2.4rem;
  top: -0.95rem;
  right: -3.6rem;
}
.noUi-handle::after, .noUi-handle::before {
  content: unset;
}
.noUi-touch-area {
  display: grid;
  align-items: center;
  text-align: center;
}

@media screen and (min-width: 768px) {
  .brand {
    margin-bottom: 0;
  }
  .ly-flex:first-child {
    border-top: 1px solid #EDEDED;
    padding-top: 2rem;
  }
  .brand_0201_content, .brand_0202_content {
    border-top: 0;
  }
  .modal .modal-inner .toogle .button-wrap {
    z-index: 1;
  }

  .searchbox-inner {
    position: relative;
    width: calc(100% - 4rem);
  }
  .setCat_wrap {
    position: relative;
  }
  .ly-flex select.setCat_01.selectForm-Base.selectForm-Base-long {
    padding-left: 5rem;
    background-color:transparent;
    z-index: 1;
    position: relative;
  }
  .setCat_wrap::before {
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background-image: url("../Contents/ImagesPkg/search/category/100.png");
    background-position-x: left 0;
    background-size: contain;
    width: 4.2rem;
    height: 4.2rem;
    left: 0.5rem;
    z-index: 0;
  }
  .setCatC_wrap {
    margin-left: 1rem;
  }
}
@media screen and (max-width: 767px) {
  .brand_0201_content, .brand_0202_content {
    border-top: 0;
  }
  .tabs .ly-flex:not(.btn-ringDesign) [data-slide="0201_category"] details {
    width: 100%;
  }
  .tabs .ly-flex:not(.btn-ringDesign) [data-slide="0201_category"] details summary {
    cursor: pointer;
    display: inline-block;
    position: relative;
    line-height: 1.2;
    font-size: 1.3rem;
    width: 100%;
    border-bottom: 1px solid #ccc;
    padding-top: 1.5rem;
    padding-bottom: 1.7rem;
    padding-left: 4rem;
    padding-right: 4.2rem;
    list-style: none;
  }
  .tabs .ly-flex:not(.btn-ringDesign) [data-slide="0201_category"] details summary::-webkit-details-marker {
    display: none;
  }
  .tabs .ly-flex:not(.btn-ringDesign) [data-slide="0201_category"] details summary:after {
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 1rem;
    pointer-events: none;
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMSIgaGVpZ2h0PSIxMSIgdmlld0JveD0iMCAwIDExIDExIj4gPGcgaWQ9IuOCsOODq+ODvOODl18yMzkzOSIgZGF0YS1uYW1lPSLjgrDjg6vjg7zjg5cgMjM5MzkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC02NiAtNjkpIj4gPGxpbmUgaWQ9Iue3ml8zNzkiIGRhdGEtbmFtZT0i57eaIDM3OSIgeDI9IjEwIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg2Ni41IDc0LjUpIiBmaWxsPSJub25lIiBzdHJva2U9IiM1NzU3NTciIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxIi8+IDxsaW5lIGlkPSLnt5pfMzgwIiBkYXRhLW5hbWU9Iue3miAzODAiIHgyPSIxMCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNzEuNSA2OS41KSByb3RhdGUoOTApIiBmaWxsPSJub25lIiBzdHJva2U9IiM1NzU3NTciIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxIi8+IDwvZz48L3N2Zz4=");
    background-repeat: no-repeat;
    background-size: 1.6rem;
    width: 1.6rem;
    height: 1.6rem;
  }
  .tabs .ly-flex:not(.btn-ringDesign) [data-slide="0201_category"] details[open] summary:after {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMSIgaGVpZ2h0PSIxIiB2aWV3Qm94PSIwIDAgMTEgMSI+IDxnIGlkPSLjgrDjg6vjg7zjg5dfMjM5MzkiIGRhdGEtbmFtZT0i44Kw44Or44O844OXIDIzOTM5IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtNjYgLTc0KSI+IDxsaW5lIGlkPSLnt5pfMzc5IiBkYXRhLW5hbWU9Iue3miAzNzkiIHgyPSIxMCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNjYuNSA3NC41KSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjNTc1NzU3IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS13aWR0aD0iMSIvPiA8L2c+PC9zdmc+");
    height: 1px;
  }
  .tabs .ly-flex:not(.btn-ringDesign) [data-slide="0201_category"] label {
    padding-left: 4rem;
    padding-right: 4.2rem;
  }
  .tabs .ly-flex:not(.btn-ringDesign) [data-slide="0201_category"] details div {
    border-bottom: 1px solid #ccc;
    margin-top: 1rem;
    padding-bottom: 1rem;
  }
  .tabs .ly-flex:not(.btn-ringDesign) [data-slide="0201_category"] details div label {
    padding-left: 5rem;
    border-bottom: 0;
    padding-bottom: 1rem;
    margin-top: 1rem;
  }
  .tabs .ly-flex:not(.btn-ringDesign) label::before,
  .tabs .ly-flex:not(.btn-ringDesign) label::after {
    left: unset;
    right: 1rem;
  }
  [data-slide="0201_category"] img {
    height: 2rem;
    width: auto;
    position: absolute;
    left: 1rem;
  }

  .searchbox-inner {
    position: relative;
    width: calc(100% - 4.5rem);
  }
  .hot-Keyword {
    padding: 2rem 1rem;
    border-bottom: 1px solid #EDEDED;
  }
  .hot-Keyword-list {
    margin-top: 1.9rem;
  }
  .range-wrapper {
    width: 23.5rem;
    padding-inline: 3.6rem;
  }
  .noUi-horizontal .noUi-handle {
    width: 7.2rem;
    height: 2.4rem;
    top: -0.95rem;
    right: -3.6rem;
  }
}


#pageAdvancedSearch .search-common .searchUdns {
  flex-wrap: wrap;
  gap: 1rem;
}
#pageAdvancedSearch .search-common .searchUdns li + li {
  margin-left: 0;
}

@media screen and (max-width: 767px) {
  #pageAdvancedSearch .search-common .searchUdns {
    flex-wrap: wrap;
    gap: 0.7rem;
  }
  #pageAdvancedSearch .search-common .searchUdns li input[type=radio] + label{
    height: 4.2rem;
    line-height: 1.5;
    display: grid;
    align-items: center;
    padding-inline: 0.5rem;
    width: 23.5rem; /*------*/
  }
  #pageAdvancedSearch .search-common .searchUdns li:last-child input[type=radio] + label{
    width: 23.5rem;
  }
}
