@charset "utf-8";


/*누리웹 모든*/

* {
    margin: 0;
    padding: 0;
    
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
}

/*풀페이지 민하이 제안*/
html, body {
  width: 100%;
  height: 100%;
}

body {
  font-family: "Pretendard", "맑은 고딕", "Malgun Gothic", 돋움, Dotum, Arial, "Apple Gothic", sans-serif;
  background: #fafbfc;
}

a {
    text-decoration: none;
}

img {
    border: 0;
}

li {
    list-style: none;
}


/**********************************
*
* 스토어 프로필
*
**********************************/

.store_top_bg {
  margin-top: -65px;
  min-width: 320px;
  box-shadow: 0px 0px 40px rgba(0, 0, 0, 0.16);
  position: relative;
  border-radius: 0px 0px 20px 20px;
  background:
    radial-gradient(1200px 700px at 50% 78%, rgb(255 255 255 / 13%), rgba(0, 0, 0, 0) 58%),
    radial-gradient(900px 600px at 50% 88%, rgb(255 255 255 / 7%), rgba(0, 0, 0, 0) 62%),
    linear-gradient(180deg, #202b68 0%, #283477 48%, #334080 100%);
}

.store_top_wrap {
  margin: 0 auto;
  width: 100%;
  max-width: 1300px;
  height: 350px;
  padding: 0 20px 0 20px;
  display: flex;
  flex-direction: column;
}

.gra_box {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 0px 0px 20px 20px;
}

.gra {
  position: absolute;
  width: 200%;
  height: 100%;
  z-index: 0;
  top: 0;
  left: 0;
}


/*개인정보처리 위 이미지*/

.store_bg {
  min-width: 320px;
  margin-top: -50px;
}

.store_wrap {
  margin: 0 auto;
  width: auto;
  height: 100%;
  max-width: 1300px;
  padding: 0 20px 0 20px;
 
  margin-bottom: 50px;
}

.store_box {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.store_top_box {
  margin: 0 auto;
  max-width: 800px;
  width: 100%;
  padding: 130px 0px 60px 0px;

  display: flex;
  flex-direction: column;
  align-items: center;
  height: 100%;
}

.store_text {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  z-index: 5;
}

.store_text_tit {

}

.store_text_tit > h2 {
  text-align: center;
  display: block;
  font-size: 40px;
  font-weight: 900;
  line-height: 55px;
  color: #ffffff;
  margin-bottom: 10px;
}

.store_text_tit > h3 {
  text-align: center;
  display: block;
  font-size: 24px;
  font-weight: 700;
  line-height: 26px;
  color: #d4dbff;
}

@media only screen and (min-width: 0px) and (max-width: 580px) {
  .store_text_tit > h2 {
    font-size: 30px;
    word-break: keep-all;
    line-height: 35px;
    margin-bottom: 10px;
  }

  .store_text_tit > h3 {
    font-size: 18px;
    word-break: keep-all;
  }

}


.store_function_box {
  display: flex;
  flex-direction: row;
}

.store_container {
  width: 100%;
  display: flex;
  flex-direction: column;
  z-index: 5;
}


.input_group {
  width: 100%;
  height: auto;
  position: relative;

}


.store_bar_group {
  width: 100%;
  height: auto;

  display: flex;
  flex-direction: row;
  align-items: center;
}


/*검색바*/

.store_input_box {
  width: 100%;
  border: none;
  font-size: 17px;
  background: none;
  color: #102458;
}


.store_btn {
  padding: 18px 22px 18px 22px;
  border: none;
  background: url(../../../img/support_img/icon_search.svg) no-repeat #e4e8ef center center;
  background-size: 20px 20px;
  color: #ffffff;
  font-size: 17px;
  flex-shrink: 0;
  cursor: pointer;
}


.suggestion_group {
  position: absolute;
  width: 100%;
  margin-top: 10px;
  background: #ffffff;
  box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.1);
  border-radius: 15px;
  overflow-y: auto;
  z-index: 9;
}


/**************************
*
*
* 검색 제안하기
*
*
***************************/

.suggestion {
  border-bottom: 1px solid #d8dce2;
  cursor: pointer;
}

.suggestion:last-child {
  border-bottom: none;
}

.suggestion:hover, .suggestion.active {
  background-color: #e3e5e9;
}

.highlight {
  background-color: yellow;
}


.suggestion_meta {
  display: flex;
  flex-direction: column;

  font-size: 13px;
  color: #999999;
  font-weight: normal;
}

.suggestion_category {
  margin-bottom: 8px;
}

.suggestion_title {
  width: 100%;
  font-size: 18px;
  font-weight: 900;
  color: #1571da;
  display: block;
  position: relative;
  border-bottom: 1px solid #eeeeee;
  padding: 15px 20px 15px 20px;
  background: #eef0f7;
}

.suggestion_title_item {
  display: flex;
  flex-direction: column;
}

.suggestion_title_item:hover {
  text-decoration: underline;
}

.suggestion_title_breadcrumb {
  font-size: 15px;
  color: #12c3a6;
  display: block;
  margin-bottom: 5px;
}

.suggestion_title_text {
  font-size: 18px;
  font-weight: 900;
  color: #1571da;
  display: block;
}


.suggestion_detail {
  display: flex;
  flex-direction: column;
  padding: 7.5px 20px 15px 20px;
}

.suggestion_description {
  margin-top: 4px;
  margin-bottom: 8px;
  color: #68717d;
  font-size: 13px;
  line-height: 20px;
  font-weight: 500;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}


.suggestion_sep {
  margin-right: 7px;
  margin-left: 7px;
}


.store_all {
  height: 100%;
  display: flex;
  flex-direction: column;
}

/**********************************
*
* 스토어 탑 최상단
*
**********************************/

.store_nav_bg {
  min-width: 320px;
  margin-top: -50px;
}

.store_nav_wrap {
  margin: 0 auto;
  width: auto;
  height: 100%;
  max-width: 1300px;
  padding: 0 20px 0 20px;
}


/**********************************
*
* 탐색 최상단
*
**********************************/

.explore_bg {
  min-width: 320px;
  flex: 1 0 auto;
  margin-bottom: 50px;
}

/**********************************
*
* 탐색 유저 관련
*
**********************************/

.store_user_bar {
  width: 100%;
  padding: 15px 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-radius: 20px 20px 0px 0px;
  background: #f7f8fa;
  position: relative;
  z-index: 20;
  gap: 10px;
}

.store_user_logo {
    width: 130px;
    height: 18px;
    background: url(../../../img/store_img/nurilab_store_logo.svg) no-repeat center center;
    background-size: contain;
}


/* 드롭다운 */

.store_user_menu_wrap {
    position: relative;
}

.store_user_button {
  display: flex;
  flex-direction: row;
  align-items: center;
  border-radius: 7px;
  padding: 6.5px 5px 6.5px 5px;
  cursor: pointer;
  background: #e4e8ef;
}

.store_user_menu_wrap.store_menu_open > .store_user_button {
  background: #cdcdcd;
}

.store_user_dropdown {
    position: absolute;
    right: 0;
    top: 45px;
    display: none;
    flex-direction: column;
    z-index: 99999;
    border-radius: 10px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.3);
}

.store_user_menu_wrap.store_menu_open .store_user_dropdown {
    display: flex;
}

.store_user_dropdown::before {
    position: absolute;
    top: -16px;
    right: 15px;
    content: "";
    display: block;
    width: 20px;
    height: 20px;
    background: url(../../../img/main_img/arrow_icon.svg) no-repeat center center;
    background-size: 20px 20px;
}

.store_user_dropdown > a {
    font-size: 13px;
    font-weight: 600;
    color: #434343;
    display: flex;
    flex-direction: row;
    align-items: center;
    background: #ffffff;
    border-bottom: 1px solid #eeeeee;
    padding: 11px 13px 11px 13px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    white-space: nowrap;
}


.store_user_dropdown_icon svg {
  width: 23px;
  height: 23px;
  display: block;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.75;
  stroke-linecap: round;
  stroke-linejoin: round;
  margin-right: 8px;
}


.store_dropdown_text {
  display: flex;
  flex-direction: column;
}

.store_dropdown_text > strong {
    font-size: 13px;
    font-weight: 900;
    color: #434343;
    display: block;
    margin-bottom: 5px;
}

.store_dropdown_text > span {
    font-size: 11px;
    font-weight: 600;
    color: #434343;
    display: block;
}


.store_user_dropdown > a:hover {
  background: #f1f1f1;
}

.store_list_hover::before {
  background: url(../../../img/store_img/arrow_hover_icon.svg) no-repeat center center;
  background-size: 20px 20px;
}

.store_user_dropdown > a {
  border-radius: 10px;
}

.store_user_icon {
  width: 23px;
  height: 23px;
  align-items: center;
  justify-content: center;
}

.store_user_icon svg {
    width: 23px;
    height: 23px;
    display: block;
    color: #707070;
}

.store_menu_open > .store_user_button > .store_user_icon svg {
    color: #2a51b4;
}

.store_item_icon_arrow {
    width: 15px;
    height: 15px;
    background: url(../../../img/store_img/sort_new_white_close_black.svg) center center no-repeat;
    background-size: 15px 15px;
    border-radius: 5px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.store_user_menu_wrap.store_menu_open > .store_user_button > .store_item_icon_arrow {
    background: url(../../../img/store_img/sort_new_white_open_color.svg) center center no-repeat;
    background-size: 15px 15px;
}

@media only screen and (min-width: 0px) and (max-width: 800px) {
  .store_user_icon {
    width: 20px;
    height: 20px;
  }

  .store_user_icon svg {
      width: 20px;
      height: 20px;
      display: block;
      fill: none;
      stroke: currentColor;
      stroke-width: 1.75;
      stroke-linecap: round;
      stroke-linejoin: round;
  }
}


/**********************************
*
* 탐색 시스템
*
**********************************/

.explore_wrap {
  margin: 0 auto;
  width: auto;
  height: 100%;
  max-width: 1300px;
  padding: 0 20px 0 20px; 
}

.explore_box {
  max-width: 1300px;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  border-radius: 20px;
  background: #f7f8fa;
  position: relative;
}

.explore_item {
  display: flex;
  flex-direction: row;
  height: 100%;
  border-radius: 0px 0px 20px 20px;
  box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.1);
}


/*개별메뉴 시작*/

.explore_left {
  width: 230px;
  background: #eceff3;
  overflow-y: auto;
  flex-shrink: 0;
  z-index: 8;
  border-radius: 20px 0px 0px 0px;
}

.explore_left_menu {
  height: 100%;
  display: flex;
  flex-direction: column;
}


/***********
* 
* tag 일 경우
*
*************/

.explore_tag_box {
  
}

.explore_tag_tit {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.explore_tag_tit > h3 {
  display: block;
  border-bottom: 1px solid #eeeeee;
  padding: 15px 20px 15px 20px;
  font-size: 18px;
  font-weight: 900;
  line-height: 30px;
  color: #434343;

  height: 61px;
}


.explore_tag_list {
  border-bottom: 1px solid #eeeeee;
}

.explore_tag_list > ul {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  padding: 15px;
}

.explore_tag_list > ul > li > a {
  display: block;
  border: 1px solid #eeeeee;
  padding: 8px 15px 8px 15px;
  margin: 5px;
  border-radius: 5px;

  font-size: 14px;
  color: #434343;
}


.explore_tag_list > ul > li > a:hover {
  background: #eaeaea;
  color: #434343;
}


/***********
*
* 체크박스 일 경우
*
*************/


.explore_menu_box{
  z-index: 4;
  border-bottom: 1px solid #e3e3e3;
  padding: 20px;
}

.explore_menu_box:last-child {
  border-bottom: none;
}

.explore_menu_tit {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.explore_menu_tit > h3 {
  display: block;
  margin-bottom: 20px;
  font-size: 14px;
  font-weight: 900;
  color: #434343;
}


.explore_select {
  display: flex;
  flex-direction: column;
}


.explore_select_list > ul {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  padding: 15px;
}

.explore_select_list > ul > li > a {
  display: block;
  border: 1px solid #eeeeee;
  padding: 8px 15px 8px 15px;
  margin: 5px;
  border-radius: 5px;

  font-size: 14px;
  color: #434343;
}


.explore_select_list > ul > li > a:hover {
  background: #eaeaea;
  color: #434343;
}


.explore_selected > a {
  background: #eaeaea;
}


.checkbox_power {
  position: relative;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;

display: flex;
flex-direction: row;
align-items: center;

margin-bottom: 15px;
}

.checkbox_power:last-child {
  margin-bottom: 0;
}

.checkbox_power > h3 {
  font-size: 14px;
  font-weight: 500;
  color: #434343;
  display: block;
  margin-left: 10px;
}

.checkbox_power input {
display: none;
  cursor: pointer;
}

.checkmark {
position: relative;
  height: 20px;
  width: 20px;
  background-color: #ffffff;
border-radius: 3px;
box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1);
}

.checkbox_power:hover input + .checkmark {
  background-color: #ccc;
}

.checkbox_power input:checked + .checkmark {
  background-color: #2083c8;
}

.checkbox_power .checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

.checkbox_power input:checked + .checkmark:after {
  display: block;
}

.checkmark:after {
  left: 6.3px;
  top: 2.6px;
  width: 4px;
  height: 9px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}


.explore_right {
  flex: 1 1 0%;
  width: auto;
  overflow: hidden;
  z-index: 4;
  border-radius: 0px 0px 20px 0px;
}


/*컨텐츠 시작*/

.explore_box_all {
  height: 100%;
}

.content_box {
  height: 100%;
}

.content_item {
  height: 100%;
}

.store_content_all {
  background: #ffffff;
  position: relative;
  overflow: hidden;
  height: calc(100%);
}

@media only screen and (min-width: 0px) and (max-width: 800px) {
  .store_content_all {
    border-radius: 0px 0px 0px 0px;
  }
}

.store_content_all > ul {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 20px;
}

.store_content_all > ul > li {
  width: calc(1/3*100% - (1 - 1/3)*20px);
  background: #fff;
  border: 1px solid #eeeeee;
  border-radius: 10px;
  box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.05);
  overflow: hidden;

}

.store_content_all > ul > li:nth-child(4n) {
  margin-right: 0;
}

@media only screen and (min-width: 801px) and (max-width: 1100px) {
  .store_content_all > ul > li {
    width: calc(1/2*100% - (1 - 1/2)*20px);
  }
}

@media only screen and (min-width: 0px) and (max-width: 800px) {
  .store_content_all > ul > li {
    width: calc(1/1*100% - (1 - 1/1)*20px);
  }
}


.store_content_all > ul > li > a {
  display: flex;
  flex-direction: column;
}


.content_photo {
  position: relative;
  padding-bottom: 100%;
  overflow: hidden;
}

@media only screen and (min-width: 0px) and (max-width: 639px) {
  .content_photo {
    padding-bottom: 100%;
  }
}

@media only screen and (min-width: 640px) and (max-width: 800px) {
  .content_photo {
    padding-bottom: 70%;
  }
}

.content_photo > img {
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 60px 0px 20px 0px;
  left: 0;
  right: 0;
  margin: auto;
}

.content_text {
  width: 100%;
  height: 100%;
  background: #fff;
}

.content_text_top {
  background: #f9f9f9;
  border-top: 1px solid #f0f1f3;
}


.content_text_box {
  width: 100%;
  display: flex;
  flex-direction: row;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

  .content_text_left {
    margin-right: auto;
    display: flex;
  }

  .content_text_left > ul  {
    flex-direction: column;
    flex-shrink: 0;
  }

  .content_text_left > ul > li {
    font-size: 13px;
    font-weight: normal;
    color: #434343;
    line-height: 24px;
  }

  .content_text_left > ul > li:last-child {
    font-weight: 900;
  }

  .content_text_right {
    margin-left: auto;
    display: flex;

    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .content_text_right > ul {
    flex-direction: column;

    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;

  }

  .content_text_right > ul > li {
    font-size: 13px;
    font-weight: normal;
    color: #434343;
    line-height: 24px;
    text-align: right;

    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  

  .content_text_right > ul > li:last-child {
    font-weight: 900;
  }


/*************************************
*
* 디테일 detail 시작
*
*************************************/


.detail_bg {
  margin-top: 40px;
  min-width: 320px;
}

.detail_wrap {
  margin: 0 auto;
  max-width: 1150px;
  height: auto;
  padding: 0 20px 0 20px;
}


.detail_box {
  width: 100%;
  height: auto;
  display: flex;
}


.detail_item_box {
  display: flex;
  flex-direction: row;
  width: 100%;
  height: auto;
}

.detail_item {
  width: calc(1/2*100% - (1/2)*30px);
  height: auto;
  margin-right: 30px;
  position: relative;
}


@media only screen and (min-width: 0px) and (max-width: 1000px) {
  
.detail_item_box {
  flex-direction: column;
}

.detail_item {
  width: calc(1/1*100% - (1/1)*0px);
  height: auto;
  margin-right: 0px;
  position: relative;
}
}

.detail_item:last-child {
    margin-right: 0px;
}

.detail_photo {
  height: 500px;

  display: flex;
  flex-shrink: 0;
  background: url(../../img/main_img/img20.png) no-repeat center center;
  background-size: cover;
  border-radius: 10px;

  box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);

  margin-bottom: 20px;
}


/*디테일 텍스트*/

.detail_section_box {
  margin-bottom: 20px;
}

.detail_section_box:last-child {
  border-top: 1px solid #eaeaea;
}

.detail_section_tit > h4 {
  display: block;
  font-size: 14px;
  font-weight: 900;
  color: #434343;
  line-height: 25px;
}


.detail_section_tit > h2 {
  display: block;
  font-size: 30px;
  font-weight: 900;
  color: #5D5D5D;
  line-height: 45px;
  word-break: keep-all;
}


.detail_section_big {
  display: flex;
  flex-direction: row;
  margin-top: 20px;
  margin-bottom: 5px;
  align-items: center;
}


.detail_section_icon {
  width: 25px;
  height: 25px;
  background: #eaeaea;
  border-radius: 5px;
}

#detail_section_icon1 {
  background: url(../../img/main_img/detail_icon1.svg) no-repeat center center;
}

#detail_section_icon2 {
  background: url(../../img/main_img/detail_icon2.svg) no-repeat center center;
}

#detail_section_icon3 {
  background: url(../../img/main_img/detail_icon3.svg) no-repeat center center;
}

#detail_section_icon4 {
  background: url(../../img/main_img/detail_icon4.svg) no-repeat center center;
}

#detail_section_icon5 {
  background: url(../../img/main_img/detail_icon5.svg) no-repeat center center;
}

#detail_section_icon6 {
  background: url(../../img/main_img/detail_icon6.svg) no-repeat center center;
}


.detail_section_tit > h3 {
  display: block;
  margin-left: 8px;
  font-size: 16px;
  font-weight: bold;
  color: #2083c8;
  line-height: 30px;
}


.detail_section_small {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.detail_section_info {

}

.detail_section_info > ul {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-bottom: 5px;
}


.detail_section_info > ul > li {
  font-size: 15px;
  line-height: 26px;
  color: #434343;
}


.detail_section_info > ul > li:first-child {
  font-weight: bold;
  margin-right: 5px;
}

.detail_section_info > ul > li:last-child {
  font-weight: normal;
}


.detail_section_description_box {
  overflow: hidden;
  border-radius: 10px;
  border: 1px solid #eeeeee;
}


.detail_section_description {
  width: 100%;
  overflow-y: auto;
  position: relative;
}

.detail_section_description > p {
  font-size: 13px;
  font-weight: normal;
  line-height: 26px;
  padding: 15px;
}


.detail_section_description_overflow {
  width: 100%;
  height: 100px;
  border-radius: 0 0 10px 10px;

  background: rgb(255,255,255);
  background: -moz-linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
  background: -webkit-linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
  background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#ffffff",GradientType=1);

  position: absolute;
  bottom: 30px;
}


.detail_section_description_btn {
  width: 100%;
  height: 30px;
  background: #ddd;
  border-radius: 0 0 10px 10px;
}


/*구매정보*/

.detail_section_buy_info {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-top: 20px;
}


.detail_buy_text {
  margin-right: auto;
}

.detail_buy_text > h3 {
  display: block;
  font-size: 18px;
  font-weight: bold;
  color: #434343;
  line-height: 30px;
}

.detail_buy_value {
  display: flex;
  flex-direction: row;
  margin-left: auto;
}

.buy_value_icon {
  width: 30px;
  height: 30px;
  background: #ddd;
  border-radius: 5px;
  margin-right: 10px;
}

.buy_value {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.buy_value > ul {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.buy_value > ul > li {
  display: block;
  font-size: 18px;
  font-weight: 900;
  color: #434343;
  line-height: 30px;
}


/*구매버튼*/

.detail_section_buy {
  margin-top: 20px;
}

.detail_buy {
  width: 100%;
  height: auto;
  background: #2083c8;
  border-radius: 5px;
  border: none;
  color: #fff;
  font-size: 15px;
  font-weight: 900;
  cursor: pointer;


  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;


  padding: 15px;
  box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
}


.detail_buy:hover {
  background: #2695e1;
}

.detail_buy_btn {
  font-size: 15px;
  line-height: 26px;
}


/*********************************
*
* 커뮤니케이션 communication
*
**********************************/


.communication_bg {
  min-width: 320px;
  padding-bottom: 20px;
}

.communication_wrap {
  margin: 0 auto;
  max-width: 1150px;
  height: auto;
  padding: 0 20px 0 20px;
}

.common_text_box {
  display: flex;
  flex-direction: row;
  align-items: center;

  width: 100%;

  border-bottom: none;

  padding: 15px 0 15px 0;
  border-radius: 10px 10px 0 0;
}

.common_text_icon {
  width: 25px;
  height: 25px;
  background: #ddd;
  border-radius: 5px;
}


.common_text_tit > h3 {
  display: block;
  margin-left: 8px;
  font-size: 16px;
  font-weight: bold;
  color: #2083c8;
  line-height: 25px;
}


.communication_box {
  width: 100%;
  height: auto;
  border: 1px solid #eeeeee;
  border-radius: 5px;
  overflow: hidden;
}

.product_table_wrap_box {
  width: 100%;
  height: auto;
}

.product_table_wrap > table {
  border-collapse: collapse;
  width: 100%;
  height: auto;
  margin-top: 15px;
  margin-bottom: 30px;
  display: table;
}


.product_table_wrap > table > thead > tr > th {
  background: #dceaff;
  border-top: 1px solid #eaeaea;
  border-bottom: 1px solid #eeeeee;
  border-left: 1px solid #eaeaea;
  border-right: 1px solid #eaeaea;
  padding: 10px;
  font-weight: 700;
  font-size: 15px;
  text-align: left;
  word-break: break-all;
}


.product_table_wrap > table > tbody > tr > td {
  background: #ffffff;
  border-top: 1px solid #eaeaea;
  border-bottom: 1px solid #eeeeee;
  border-right: 1px solid #eaeaea;
  border-left: 1px solid #eaeaea;
  padding: 10px;
  font-weight: 300;
  font-size: 15px; 
  word-break: break-all;
  line-height: 26px;
}


@media only screen and (min-width: 0px) and (max-width: 750px) {
  .product_table_wrap > table > thead > tr > th {
    background: #dceaff;
    border-top: 1px solid #eaeaea;
    border-bottom: 1px solid #eeeeee;
    padding: 10px;
    font-weight: 700;
    font-size: 14px;
    text-align: left;
    word-break: break-all;
  }
  
  
  .product_table_wrap > table > tbody > tr > td {
    background: #ffffff;
    border-top: 1px solid #eaeaea;
    border-bottom: 1px solid #eeeeee;
    border-right: 1px solid #eaeaea;
    padding: 10px;
    font-weight: 300;
    font-size: 14px; 
    word-break: break-all;
    line-height: 24px;
  }
  
}


.product_table_wrap > table > tbody > tr > td > img {
  display: block;
  max-width: 100%;
}


.product_table_wrap > table > tbody > tr > th {
  background: #dde4f0;
  border: 1px solid #fafafa;
  padding: 10px;
  font-weight: 700;
  font-size: 15px;
  line-height: 26px;
  text-align: left;
  word-break: break-all;
}


/*파랑*/


/*퍼플*/


/*레드*/


/*그린*/


/*************************************
*
* explore function box 기능 박스
*
*************************************/


.explore_function_box {
  background: #fff;
  height: 61px;
  border-bottom: 1px solid #eeeeee;
  display: flex;
  flex-direction: row;
  align-items: center;

  padding: 0 20px 0 20px;
}


.function_search {
  width: 250px;
  height: 40px;
  background: url(../../img/main_img/filter_icon.png) no-repeat center right 13px;
  border: none !important;
  border-radius: 5px;
  display: flex;
  flex-shrink: 1;
  padding: 0 45px 0 15px !important;

  border: 1px solid #ddd !important;
}


@media only screen and (min-width: 0px) and (max-width: 430px) {
  .function_search {
    width: 150px;
    padding: 0 45px 0 15px !important;
  }
}


.function_sort_box {
  margin-left: auto;
  display: flex;
  flex-direction: row;
}

.function_sort {
  width: 40px;
  height: 40px;
  border: 1px solid #ddd !important;
  border-radius: 5px;
  display: block;
  margin-right: 5px;
}

.function_sort:last-child {
  margin-right: 0;
}

#function_sort1 {
  background: url(../../img/main_img/sort_icon1.svg) no-repeat center center;
}

#function_sort1:hover {
  background: url(../../img/main_img/sort_icon1.svg) no-repeat #eaeaea center center;
}

#function_sort2 {
  background: url(../../img/main_img/sort_icon2.svg) no-repeat center center;
}

#function_sort2:hover {
  background: url(../../img/main_img/sort_icon2.svg) no-repeat #eaeaea center center;
}


/*공통 input 스타일*/

/* Firefox */
input[type=number] {
  -moz-appearance: textfield !important;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    /* display: none; <- Crashes Chrome on hover */
    
    -webkit-appearance: none;
    margin: 0;
}
/*input=text number의 사파리, 크롬, 파이어폭스 보더를 제거합니다.*/

input:focus {
  outline: none;
}

:invalid {
  box-shadow: none;
}

:-moz-submit-invalid {
  box-shadow: none;
}

:-moz-ui-invalid {
  box-shadow:none;
}

.input_tit {
	margin-right:5px;
}

label {
    cursor: pointer;
}

input[type=button] {
    font-family: "Pretendard", "맑은 고딕", "Malgun Gothic", 돋움, Dotum, Arial, "Apple Gothic", sans-serif;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    cursor: pointer;
}

input[type=radio] {
    vertical-align: middle;
    font-family: "Pretendard", "맑은 고딕", "Malgun Gothic", 돋움, Dotum, Arial, "Apple Gothic", sans-serif;
}

	.radio_label {
		display:inline-block;
		line-height:25px;
		margin-right:10px;
    font-size: 14px;
	}

	
input[type=submit] {
    font-family: "Pretendard", "맑은 고딕", "Malgun Gothic", 돋움, Dotum, Arial, "Apple Gothic", sans-serif;
    -webkit-appearance: none;
    /* 네이티브 외형 감추기 */
    -moz-appearance: none;
}
input[type=text] {
    font-family: "Pretendard", "맑은 고딕", "Malgun Gothic", 돋움, Dotum, Arial, "Apple Gothic", sans-serif;
    -webkit-appearance: none;
    /* 네이티브 외형 감추기 */
    -moz-appearance: none;
}


input[type=text]:disabled {
  background: #e7e7e7 !important;
  cursor: no-drop;
  color: #bdbdbd;
  box-shadow: none !important;
}

input[type=number] {
  font-family: "Pretendard", "맑은 고딕", "Malgun Gothic", 돋움, Dotum, Arial, "Apple Gothic", sans-serif;
  -webkit-appearance: none;
  -moz-appearance: none;
  border: none;
  font-size: 14px;
  font-weight: 500;
  color: #434343;
  padding: 11px 15px 11px 15px;
  border-radius: 8px 0px 0px 8px;
  max-width: 130px !important;
  background: #edeff3;
}

input[type=number]:disabled {
  background: #e7e7e7 !important;
  cursor: no-drop;
  color: #bdbdbd;
}

input[type=search] {
  font-family: "Pretendard", "맑은 고딕", "Malgun Gothic", 돋움, Dotum, Arial, "Apple Gothic", sans-serif;
  -webkit-appearance: none;
  /* 네이티브 외형 감추기 */
  -moz-appearance: none;
}

input[type=email] {
    font-family: "Pretendard", "맑은 고딕", "Malgun Gothic", 돋움, Dotum, Arial, "Apple Gothic", sans-serif;
    -webkit-appearance: none;
    /* 네이티브 외형 감추기 */
    -moz-appearance: none;
}
textarea {
    font-family: "Pretendard", "맑은 고딕", "Malgun Gothic", 돋움, Dotum, Arial, "Apple Gothic", sans-serif;
    -webkit-appearance: none;
    /* 네이티브 외형 감추기 */
    -moz-appearance: none;
}
input[type=password] {
    font-family: "Pretendard", "맑은 고딕", "Malgun Gothic", 돋움, Dotum, Arial, "Apple Gothic", sans-serif;
    -webkit-appearance: none;
    /* 네이티브 외형 감추기 */
    -moz-appearance: none;
}
input[type=checkbox] {
    font-family: "Pretendard", "맑은 고딕", "Malgun Gothic", 돋움, Dotum, Arial, "Apple Gothic", sans-serif;
}
select {
  font-family: "Pretendard", "맑은 고딕", "Malgun Gothic", 돋움, Dotum, Arial, "Apple Gothic", sans-serif;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: none;
  cursor: pointer;
  font-size: 14px;
  font-weight: 800;
  color: #434343;
  padding: 11px 35px 11px 15px;
  background: url(../../../img/resources_img/detail_icon_arrow.svg) no-repeat #e5ebf7 center right 15px;
  border-radius: 8px;
}
select::-ms-expand {
    display: none;
}

select:disabled {
  cursor: no-drop;
  color: #bdbdbd;
  box-shadow: none !important;
}


/**********************************
*
* 스토어 기능 보완 - Step 1
*
**********************************/

/* 정렬 라디오 */
.radio_power {
  position: relative;
  cursor: pointer;
  user-select: none;
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-bottom: 15px;
}

.radio_power:last-child {
  margin-bottom: 0;
}

.radio_power > h3 {
  font-size: 14px;
  font-weight: 500;
  color: #434343;
  display: block;
  margin-left: 10px;
}

.radio_power input {
  display: none;
}

.radiomark {
  position: relative;
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  background: #ffffff;
  border-radius: 50%;
  box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1);
}

.radio_power:hover input + .radiomark {
  background: #ccc;
}

.radio_power input:checked + .radiomark {
  background: #2083c8;
}

.radio_power input:checked + .radiomark::after {
  content: "";
  position: absolute;
  width: 8px;
  height: 8px;
  top: 6px;
  left: 6px;
  border-radius: 50%;
  background: #fff;
}

/* 검색 오류 */
.error_message_box {
  position: relative;
  width: 100%;
}

.error_message {
  position: absolute;
  font-size: 13px;
  font-weight: 700;
  color: #ffb2b2;

  width: 100%;

  background: #eef0f7;
  box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.1);
  border-radius: 12px;
  padding: 20px;
}

/* 검색 제안은 비어 있을 때 공간을 차지하지 않음 */
.suggestion_group:empty {
  display: none;
}

/* 상품명/설명 가독성 */
.content_text_left > ul > li:first-child {
  font-size: 15px;
  font-weight: 900;
  color: #343434;
}

.content_text_left > ul > li:last-child {
  font-size: 13px;
  font-weight: 400;
  color: #747474;
}

/* 검색/필터 결과 없음 */
.store_empty {
  padding: 60px 20px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  
}

.store_empty > strong {
  display: block;
  margin-bottom: 8px;
  font-size: 18px;
  font-weight: 900;
  color: #434343;
}

.store_empty > span {
  display: block;
  font-size: 14px;
  color: #8a8a8a;
}

/**********************************
*
* 스토어 상품 카드 - Step 2
*
**********************************/

/* 상품 개수 */
.store_result_head {
  position: relative;
  padding: 15px 20px 15px 20px;
  display: flex;
  align-items: center;
  gap: 15px;
  z-index: 8;
}

.store_result_count {
  font-size: 14px;
  font-weight: 500;
  color: #777;
}

.store_result_count > strong {
  color: #2083c8;
  font-weight: 900;
}

/* 상품 영역 상단 검색 */
.store_result_search {
  max-width: 300px;
  width: 100%;
  margin-left: auto;
  z-index: 20;
}

.store_result_search .input_group {
  width: 100%;
}

.store_result_search .store_bar_group {
  border-radius: 8px;
  box-shadow: none;
  transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.store_result_search .store_input_box {
    font-family: "Pretendard", "맑은 고딕", "Malgun Gothic", 돋움, Dotum, Arial, "Apple Gothic", sans-serif;
    -webkit-appearance: none;
    -moz-appearance: none;
    border: none;
    font-size: 13px;
    font-weight: 500;
    color: #434343;
    padding: 10px 15px 10px 15px;
    border-radius: 8px 0px 0px 8px;
    background: #ffffff;
}

.store_result_search .store_input_box::placeholder {
  color: #9aa1ab;
}

.store_result_search .store_btn {
  border: none;
  font-family: "Pretendard", "맑은 고딕", "Malgun Gothic", 돋움, Dotum, Arial, "Apple Gothic", sans-serif;
  -webkit-appearance: none;
  -moz-appearance: none;
  border: none;
  font-size: 13px;
  font-weight: 800;
  color: #434343;
  border-radius: 0px 8px 8px 0px;
  cursor: pointer;
}


.store_result_search .suggestion_group {
  margin-top: 7px;
  max-height: 360px;
  border: 1px solid #e4e7ec;
  border-radius: 12px;
  box-shadow: 0 14px 35px rgba(25, 39, 62, .16);
  z-index: 50;
}

.store_result_search .error_message {
  top: 8px;
  left: 0px;
  color: #d64b4b;
}

/* 상품 카드 */
.store_product_list {
  padding: 20px;
}
.store_product {
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.store_product:hover {
  transform: translateY(-3px);
  border-color: #eaeaea;
  box-shadow: 0 10px 24px rgba(8, 31, 68, 0.1);
}

.store_product > a {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.store_product .content_photo {
  background: #f5f5f5;
}

/* 상태 뱃지 */
.store_badges {
  position: absolute;
  top: 14px;
  left: 14px;
  right: 14px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  pointer-events: none;
}

.store_badge {
  padding: 5px 9px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 7px;
  font-size: 12px;
  font-weight: 600;
}

.store_badge_sale {
  color: #164ca0;
  background: rgba(231, 239, 255, 1);
}

.store_badge_upcoming {
  color: #8a6500;
  background: #fff2c9;
}

.store_badge_promotion {
  color: #3f16a0;
  background: rgba(244, 231, 255, 1);
}

.store_badge_discount {
  color: #c63f3f;
  background: rgba(255, 235, 235, 1);
}

/* 품절 상품 배지 */
.store_badge_soldout {
  color: #555d68;
  background: #e7e9ec;
}

.store_badge_ended {
  color: #6f6f6f;
  background: #e7e7e7;
}

.store_product.is-soldout .content_photo > img {
  filter: grayscale(1);
  opacity: 0.62;
}

.store_product.is-soldout .store_sale_price {
  color: #777f89;
}

.store_product.is-ended .content_photo > img {
  filter: grayscale(1);
  opacity: 0.68;
}

.store_product.is-ended .store_sale_price {
  color: #777f89;
}

/* 기존 카드 텍스트 레이아웃을 스토어용으로 정리 */
.store_product .content_text {
  display: flex;
  flex-direction: column;
}

.store_product .content_text_left {
  width: 100%;
}

.store_product .content_text_left > ul {
  width: 100%;
  padding: 15px;

  display: flex;
  flex-direction: column;
}

.store_product_description {
  overflow: hidden;
  word-break: keep-all;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.store_product_name {
  font-size: 15px !important;
  font-weight: 900 !important;
  color: #343434 !important;
}

.store_product_description {
  margin-top: 1px;
  font-size: 13px !important;
  font-weight: 400 !important;
  color: #7b7b7b !important;
}

/* 가격 */
.store_price_box {
  padding: 15px;
  display: flex;
  align-items: flex-end;
  border-top: 1px solid #f0f1f3;
  height: 100%;
}

.store_price_values {
  margin-left: auto;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 5px;
  text-align: right;
}

.store_original_price {
  display: none;
  font-size: 12px;
  font-weight: 500;
  color: #aaa;
  text-decoration: line-through;
}

.store_discount_rate {
  display: none;
  font-size: 13px;
  font-weight: 900;
  color: #e14a4a;
}

.store_sale_price {
  font-size: 17px;
  line-height: 22px;
  font-weight: 900;
  color: #303030;
  white-space: nowrap;
}

.store_product.has-discount .store_original_price,
.store_product.has-discount .store_discount_rate {
  display: inline-block;
}

.store_product.has-discount .store_sale_price {
  color: #164ca0;
}

@media only screen and (min-width: 0px) and (max-width: 580px) {
  .store_badges {
    top: 10px;
    left: 10px;
    right: 10px;
  }
}


/**********************************
*
* 스토어 광고 배너
*
**********************************/
.store_banner_list {
  display: flex;
  flex-direction: column;
}

.store_common_list_tit > h3 {
  font-size: 25px;
  font-weight: 900;
  color: #434343;
  padding: 20px 20px 0px 20px;
  display: block;
}

.store_banner_gallery_item {
  padding: 20px 0px 40px 0px;
  position: relative;
}

.store_banner_gallery_link {
  display: block;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.1);
}

.store_banner_gallery_link > img {
  display: block;
  width: 100%;
  height: 100%;
}


/*swiper*/

.store_banner_prev,
.store_banner_next {
  font-family: "Pretendard", "맑은 고딕", "Malgun Gothic", 돋움, Dotum, Arial, "Apple Gothic", sans-serif;
  position: absolute;
  top: 50%;
  z-index: 10;

  width: 46px;
  height: 46px;

  padding: 0;
  border: 0;
  border-radius: 50%;

  display: flex;
  align-items: center;
  justify-content: center;

  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.16);

  cursor: pointer;

  transform: translateY(-50%);

  transition:
    transform 0.2s ease,
    background 0.2s ease,
    box-shadow 0.2s ease;
}

.store_banner_prev {
  left: 20px;
}

.store_banner_next {
  right: 20px;
}

.store_banner_prev > span,
.store_banner_next > span {
  display: block;
  font-size: 20px;
  font-weight: 900;
  color: #222;
}

.store_banner_prev:hover,
.store_banner_next:hover {
  background: #fff;

  box-shadow:
    0 10px 30px rgba(0, 0, 0, 0.22);

  transform:
    translateY(-50%)
    scale(1.07);
}


@media (max-width: 580px) {

  .store_banner_prev,
  .store_banner_next {
    width: 38px;
    height: 38px;
  }

  .store_banner_prev {
    left: 10px;
  }

  .store_banner_next {
    right: 10px;
  }

  .store_banner_prev > span,
  .store_banner_next > span {
    font-size: 18px;
  }

}




/* =========================================================
   Swiper flex 폭 보정
   - primary_nav + 필터 패널 추가 후 오른쪽 영역이 좁아져도
     Swiper가 예전 폭을 유지하며 잘리지 않도록 실제 가용폭에 맞춥니다.
========================================================= */
.store_banner_list,
.store_banner_gallery_item,
.store_banner_gallery_swiper {
  width: 100%;
  max-width: 100%;
}

/**********************************
*
* 스토어 모바일 필터 + JSON 상품 - Step 3
*
**********************************/

.store_filter_mobile_head,
.store_filter_open,
.store_filter_overlay {
  display: none;
}

.store_loading {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px 20px;
  
  font-size: 14px;
  font-weight: 600;
  color: #9298a2;
}

.store_product_no_image {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #eaeaea;
}

.store_product_no_image > span {
  font-size: 13px;
  font-weight: 800;
  color: #a1abba;
  letter-spacing: .2px;
}

@media only screen and (min-width: 0px) and (max-width: 800px) {
  body.store_filter_opened {
    touch-action: none;
  }

  .explore_box {
    position: relative;
    border-radius: 20px;
  }

  .explore_right {
    width: 100%;
    border-radius: 0px 0px 20px 20px;
  }

  .explore_left {
    position: fixed;
    top: 0;
    left: 72px;
    z-index: 10002 !important;
    width: min(300px, calc(100vw - 72px));
    height: 100%;
    border-right: none;
    border-radius: 0;
    background: rgba(247, 248, 250, .98);
    box-shadow: 14px 0 40px rgba(0, 0, 0, .18);
    backdrop-filter: blur(22px);
    -webkit-backdrop-filter: blur(22px);
    transform: translate3d(calc(-100% - 72px), 0, 0);
    visibility: hidden;
    transition: transform .28s cubic-bezier(.22,.61,.36,1), visibility 0s linear .28s;
    overflow-y: auto;
    overscroll-behavior: contain;

  }

  .explore_left.is-open {
    transform: translate3d(0, 0, 0);
    visibility: visible;
    transition: transform .28s cubic-bezier(.22,.61,.36,1), visibility 0s;
  }

  .explore_left_menu {
    height: calc(100% - 61px);
  }

  .store_filter_mobile_head {
    position: sticky;
    top: 0;
    padding: 10px 20px 10px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: rgba(247, 248, 250, .96);
    border-bottom: 1px solid #e4e7eb;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    z-index: 10;
    box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.1);
  }

  .store_filter_mobile_head > strong {
    font-size: 18px;
    font-weight: 900;
    color: #30343a;
  }

  .store_filter_close {
    position: relative;
    width: 40px;
    height: 40px;
    padding: 0;
    border: 0;
    border-radius: 10px;
    background: transparent;
    cursor: pointer;
  }

  .store_filter_close:hover {
    background: #e9edf2;
  }

  .store_filter_close > span {
    position: absolute;
    top: 19px;
    left: 10px;
    width: 20px;
    height: 2px;
    border-radius: 2px;
    background: #464b52;
  }

  .store_filter_close > span:first-child { transform: rotate(45deg); }
  .store_filter_close > span:last-child { transform: rotate(-45deg); }

  .store_filter_overlay {
    position: fixed;
    inset: 0;
    z-index: 10001;
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    display: block;
    background: rgba(9, 16, 29, .48);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .24s ease, visibility 0s linear .24s;
    cursor: default;
  }

  .store_filter_overlay.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition: opacity .24s ease, visibility 0s;
  }

  .store_function_box {
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 10px;
  }

  .store_result_head {
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 10px;
  }

  .store_result_search {
    max-width: 100%;
    width: 100%;
  }

  .store_filter_open {
    padding: 6.5px 5px 6.5px 5px;
    cursor: pointer;
    background: #e4e8ef;
    display: inline-flex;
    align-items: center;
    border-radius: 8px;
    color: #4a4f57;
    font-family: inherit;
    font-size: 13px;
    font-weight: 800;
    cursor: pointer;
  }

  .store_filter_open.is-active {
    background: #e4e8ef;
    color: #164ca0;
  }

  .store_filter_open_icon {
    position: relative;
    width: 20px;
    height: 20px;
    display: inline-block;
  }

  .store_filter_open > .store_filter_active_count {
    padding: 3px 3px;
    border-radius: 50px;
    align-items: center;
    justify-content: center;
    
    background: #2083c8;
    color: #fff;
    font-size: 10px;
    font-weight: normal;
    display: block;
    margin-left: 4px;
    margin-right: 4px;
  }

  .store_filter_open > .store_filter_active_count:not([style*="display:none"]):not([style*="display: none"]) {
    display: inline-flex !important;
  }
}

/* =========================================================
   제품 상세 스타일
========================================================= */


/* =========================================================
   스토어 1차 아이콘 메뉴
========================================================= */
.store_primary_nav {
  width: 75px;
  height: 100%;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 8px;
  background: #f7f8fa;
  border-radius: 0 0 0 20px;
  position: relative;
  z-index: 6;
}

.store_primary_nav_top,
.store_primary_nav_bottom {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.store_primary_item {
  width: 100%;
  min-height: 58px;
  padding: 5px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: #676d75;
  font-family: inherit;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  text-align: center;
  text-decoration: none;
  transition: background .18s ease, color .18s ease, transform .18s ease;
}

.store_primary_item:hover {
  background: #e9edf2;
  color: #30343a;
}

.store_primary_item:active {
  transform: translateY(1px);
}

.store_primary_item.is-active {
  background: #ffffff;
  color: #164ca0;
  box-shadow: 0 2px 10px rgba(25, 45, 75, .08);
}

.store_primary_icon {
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

.store_primary_icon svg {
  width: 23px;
  height: 23px;
  display: block;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.75;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.store_primary_label {
  max-width: 60px;
  font-size: 10px;
  line-height: 1.2;
  font-weight: 700;
}


/* =========================================================
   누리랩 스토어 상세 - store.html?view=상품코드
   store_top_bg / 메뉴 / 푸터는 store.html 공통 구조를 그대로 사용
========================================================= */
.product_detail_bg {
  display: none;
  min-width: 320px;
  position: relative;
  padding: 0 0 80px 0;
  flex: 1 0 auto;
}

.store_detail_mode .explore_bg {
  display: block !important;
}

/* 상세에서는 오른쪽의 상품 목록만 숨기고 왼쪽 1차 메뉴/필터는 유지 */
.store_detail_mode .explore_right > .content_box_all {
  display: none !important;
}

.store_detail_mode .product_detail_bg {
  display: block;
  width: 100%;
  padding-bottom: 0;
  flex: none;
}

.store_detail_mode .product_detail_wrap {
  width: 100%;
  max-width: none;
  padding: 0;
}

.store_detail_mode .product_detail_box {
  margin-bottom: 0;
  min-height: 100%;
  border-radius: 0 0 20px 0;
  box-shadow: none;
}

.store_detail_mode .explore_right {
  border-radius: 20px 0px 20px 0px;
  background: #ffffff;
}

.store_detail_mode .store_primary_home {
  background: #ffffff;
  color: #164ca0;
  box-shadow: 0 2px 10px rgba(25, 45, 75, .08);
}

.product_detail_wrap {
  margin: 0 auto;
  width: auto;
  height: 100%;
  max-width: 1300px;
  padding: 0 20px 0 20px;
}

.product_detail_box {
  background: #ffffff;
  box-shadow: 0px 5px 30px rgba(0, 0, 0, 0.1);
  border-radius: 0px 0px 20px 20px;
  margin-bottom: 20px;
}

.product_detail_toolbar {
  padding: 10px 10px 0px 10px;
}

.product_detail_back {
  cursor: pointer;
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 15px;
  background: #f9f9f9;
  border-radius: 10px;
  border: 1px solid #eeeeee;
}

.product_detail_back > a {
  font-size: 20px;
  font-weight: 700;
  color: #434343;
}

.product_detail_back > a::before {
  content: "";
  display: block;
  width: 35px;
  height: 35px;
  background: url(../../../img/resources_img/arrow_back.svg) no-repeat center center;
  background-size: 25px 25px;
  margin-right: 10px;
}

.product_detail_back a {
    font-size: 20px;
    font-weight: 700;
    color: #434343;
    cursor: pointer;
    display: flex;
    flex-direction: row;
    align-items: center;
}
.product_detail_back a:hover {
  text-decoration: underline;
}

.product_loading,
.product_error {
  padding: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;

  border-radius: 20px;
  background: #fff;
  color: #8c949f;
  font-size: 14px;
  font-weight: 700;
  margin: 10px;
}
.product_error {
  color: #a44343;
  background: #fff8f8;
}

.product_detail {
  flex-direction: column;
}

.product_hero {
  display: flex;
  flex-direction: row;
  gap: 10px;
  position: relative;
  padding: 10px;
}
.product_hero_image {
  position: relative;
  overflow: hidden;
  width: calc(3 / 5 * 100% - (1 - 3 / 5) * 10px);
  padding-bottom: 33.3%;
  border-radius: 10px;
  background: #f9f9f9;
  border: 1px solid #eeeeee;
}
.product_hero_image img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 20px;
}
.product_no_image {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #a0aaba;
  font-size: 18px;
  font-weight: 900;
  letter-spacing: 0.2px;
}
.product_hero_info {
  display: flex;
  flex-direction: column;
  width: calc(2 / 5 * 100% - (1 - 2 / 5) * 10px);
  background: #f9f9f9;
  border-radius: 10px;
  padding: 20px;
  border: 1px solid #eeeeee;
}
.product_badges {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-bottom: 18px;
}
.product_badge {
  display: inline-flex;
  align-items: center;
  padding: 5px 10px;
  border-radius: 7px;
  font-size: 12px;
  font-weight: 600;
}

.product_badge.sale {
  color: #164ca0;
  background: rgba(231, 239, 255, 1);
}
.product_badge.upcoming {
  color: #8a6500;
  background: #fff2c9;
}
.product_badge.promotion {
  color: #3f16a0;
  background: rgba(244, 231, 255, 1);
}
.product_badge.discount {
  color: #c63f3f;
  background: rgba(255, 235, 235, 1);
}

.product_badge.soldout {
  color: #555d68;
  background: #e7e9ec;
}

.product_badge.ended {
  color: #6f6f6f;
  background: #e7e7e7;
}

.product_hero_detail_info {
  display: flex;
  flex-direction: column;
  margin-bottom: 15px;
}

.product_hero_detail_info h1 {
  color: #232a35;
  font-size: 25px;
  font-weight: 900;
  line-height: 32px;
  word-break: keep-all;
}
.product_subtitle {
  margin-top: 8px;
  color: #747d89;
  font-size: 16px;
  line-height: 27px;
  word-break: keep-all;
}
.product_price_area {
  margin-top: auto;
  padding: 15px;
  display: flex;
  align-items: flex-end;
  background: #eff0f1;
  border-radius: 10px;
}
.product_price_value {
  margin-left: auto;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
  text-align: right;
}
.product_original_price {
  color: #a7adb5;
  font-size: 14px;
  text-decoration: line-through;
}
.product_discount_rate {
  color: #e14a4a;
  font-size: 18px;
  font-weight: 900;
  display: block;
}
.product_price_value strong {
  color: #164ca0;
  font-size: 29px;
  font-weight: 900;
  white-space: nowrap;
  display: block;
}
.product_buy_area {
  margin-top: 15px;
}
.product_buy {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 11px;
  background: #164ca0;
  color: #fff;
  font-size: 15px;
  font-weight: 900;
  padding: 15px 30px 15px 30px;
  box-shadow: 0 7px 16px rgba(22, 76, 160, 0.18);
}
.product_buy:hover {
  background: #1d5cbf;
}
.product_buy.is-disabled {
  pointer-events: none;
  background: #c5cbd3;
  box-shadow: none;
}

.product_buy.is-soldout {
  background: #aeb4bc;
  color: #ffffff;
}

.product_buy.is-upcoming {
  background: #aeb4bc;
  color: #ffffff;
}

.product_buy.is-ended {
  background: #9da3ab;
  color: #ffffff;
}

.product_content_section {
  padding: 0px 10px 10px 10px;
}

.product_editor_content {
  padding: 30px;
  margin: 0 auto;
  color: #3e4650;
}

.product_content_title h2 {
  font-size: 20px;
  font-weight: 700;
  color: #434343;
  display: block;
  padding: 20px;
  background: #f9f9f9;
  border-radius: 10px;
  border: 1px solid #eeeeee;
}


/******************************************
*
*
* 블로그 컨텐츠 꾸미기 시작
*
*
*******************************************/

.product_editor_content  > h1 {
  font-size: 30px;
  line-height: 43px;
  font-weight: 900;
  color: #434343;
  display: block;
  padding-bottom: 15px;
  margin-bottom: 15px;
  border-bottom: 1px solid #eeeeee;
}


.product_editor_block > h2 {
  font-size: 24px;
  font-weight: 700;
  color: #434343;
  display: block;
  flex-direction: row;
  align-items: center;
  line-height: 35px;
  margin-top: 30px;
  margin-bottom: 30px;
  position: relative;
  word-break: break-all;
  padding-left: 18px;
}

.product_editor_block > h2::before {
  content: "";
  display: block;
  width: 5px;
  height: 100%;
  background: #434343;

  flex-shrink: 0;

  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
}


.product_editor_block > h3 {
  font-size: 20px;
  font-weight: 700;
  color: #434343;
  display: block;
  flex-direction: row;
  align-items: center;
  line-height: 35px;
  margin-top: 30px;
  margin-bottom: 30px;
}


.product_editor_block > h4 {
  font-size: 18px;
  font-weight: 700;
  color: #434343;
  display: block;
  flex-direction: row;
  align-items: center;
  line-height: 35px;
  margin-top: 30px;
  margin-bottom: 15px;
}


.product_editor_block > h5 {
  font-size: 15px;
  font-weight: 700;
  color: #434343;
  display: block;
  line-height: 27px;
  margin-top: 15px;
  margin-bottom: 15px;
  word-break: break-all;
}


.product_editor_block > h6 {
  width: 100%;
  border-top: 1px solid #eaeaea;
  padding-top: 15px;
  font-size: 14px;
  font-weight: 700;
  color: #434343;
  display: block;
  line-height: 26px;
  word-break: break-all;
}


.product_editor_block > p {
  font-size: 15px;
  font-weight: normal;
  color: #434343;
  line-height: 28px;
  display: block;
  margin-bottom: 10px;
  word-break: break-all;
}

.word_break_now {
  word-break: break-all !important;
}

.product_editor_image img {
  margin: 0 auto;
  display: block;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100% !important;
  object-fit: contain;
  margin-top: 30px;
  margin-bottom: 30px;
}


.product_editor_delimiter_middle {
  margin: 0 auto;
  max-width: 400px;
  border: 1px solid #eeeeee;
  margin-top: 50px;
  margin-bottom: 50px;
}

.product_editor_delimiter_full {
  margin: 0 auto;
  max-width: 100%;
  border: 1px solid #eeeeee;
  margin-top: 70px;
  margin-bottom: 70px;
}


.product_editor_block > ul > li > h3 {
  font-size: 20px;
  font-weight: 500;
  color: #434343;
  display: flex;
  flex-direction: row;
  align-items: center;
  line-height: 35px;
  color: #434343;
}

.product_editor_block > ul > li {
  margin-left: 40px;
  list-style: disc !important;
  margin-bottom: 5px;
  color: #434343;
  word-break: break-all;
  font-size: 15px;
  font-weight: normal;
  line-height: 26px;
}

.product_editor_block > ul > li > p > a {
  color: #1341be;
  display: flex;
  flex-direction: row;
  align-items: center;
  flex-wrap: wrap;
}

.product_editor_block > ul > li > p > a:hover {
  text-decoration: underline;
}

.product_editor_block > ul > li > p > a::after {
  content: "";
  display: flex;
  width: 15px;
  height: 15px;
  background: url(../../../img/resources_img/icon_popup.svg) no-repeat center center;
  background-size: 15px 15px;
  margin-left: 3px;
}

.product_editor_block > ul > li > ul {
  margin-top: 8px;
}

.product_editor_block > ul > li > ul > li {
  margin-left: 20px;
  list-style: square !important;
  margin-bottom: 15px;
}

.product_editor_block > ul > li:last-child {
  margin-bottom: 15px;
}

.product_editor_block > ul > li > p {
  font-size: 15px;
  font-weight: normal;
  color: #434343;
  line-height: 28px;
  display: block;
  margin-bottom: 10px;
}


.product_editor_block > ul > li > ul {
  margin-top: 8px;
}

.product_editor_block > ul > li > ul > li {
  margin-left: 20px;
  list-style: square !important;
  margin-bottom: 15px;
}

.product_editor_block > ul > li:last-child {
  margin-bottom: 15px;
}

.product_editor_block > ul > li > p {
  font-size: 15px;
  font-weight: normal;
  color: #434343;
  line-height: 28px;
  display: block;
  margin-bottom: 10px;
}


/*ol 목록*/

.product_editor_block > ol > li {
  margin-left: 40px;
  margin-bottom: 5px;
  color: #434343;
  word-break: break-all;
  font-size: 15px;
  font-weight: normal;
  line-height: 26px;
  list-style: inherit;
}


.product_editor_block > .plays {
  width: 100%;
  height: 100%;
}

.product_editor_block > .plays > iframe {
  width: 100%;

}

.description_box {
  width: 100%;
  background: #f5f5f5;
  padding: 15px;
  border-radius: 18px;
}

.description_box > p {
  font-size: 15px;
  font-weight: normal;
  color: #434343;
  line-height: 28px;
  display: block;
  margin-bottom: 10px;
  word-break: break-all;
}

.description_box > p:last-child {
  margin-bottom: 0px;
}


/*체크박스 리스트*/

.product_editor_block > ul > li.check-item {
  list-style: none !important;
}

.check-item > label {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.check-item > label > input[type=checkbox] {
  margin-right: 5px;
}

.check-item > label > span {
  font-size: 15px;
  font-weight: normal;
  color: #434343;
  line-height: 28px;
  display: block;
  word-break: break-all;
}

@media only screen and (min-width: 0px) and (max-width: 750px) {

  .product_editor_block > h1 {
    font-size: 20px;
    line-height: 30px;
    font-weight: 900;
    color: #434343;
    padding-bottom: 15px;
    margin-bottom: 15px;
    border-bottom: 1px solid #eeeeee;
  }


  .product_editor_block > h2 {
    font-size: 16px;
    font-weight: 700;
    align-items: center;
    line-height: 35px;
    margin-top: 20px;
    margin-bottom: 20px;
  }


  .product_editor_block > h3 {
    font-size: 15px;
    font-weight: 700;
    color: #434343;
    align-items: center;
    line-height: 30px;
    margin-top: 20px;
    margin-bottom: 20px;
  }


  .product_editor_block > h4 {
    font-size: 14px;
    font-weight: 700;
    color: #434343;
    align-items: center;
    line-height: 30px;
    margin-top: 20px;
    margin-bottom: 15px;
  }
  

  .product_editor_block > h5 {
    font-size: 14px;
    font-weight: 700;
    color: #434343;
    line-height: 27px;
    margin-top: 15px;
    margin-bottom: 15px;
  }
  
  
  .product_editor_block > h6 {
    width: 100%;
    border-top: 1px solid #eaeaea;
    padding-top: 15px;
    font-size: 14px;
    font-weight: 700;
    color: #434343;
    line-height: 27px;
  }
  

  .product_editor_block > p {
    font-size: 14px;
    font-weight: normal;
    color: #434343;
    line-height: 27px;
    margin-bottom: 10px;
  }

  .product_editor_block > ul > li {
    font-size: 14px;
    font-weight: 700;
    color: #434343;
    align-items: center;
    line-height: 27px;
    margin-bottom: 8px;
  }

  .product_editor_block > ul > li > h3 {
    font-size: 14px;
    font-weight: 700;
    color: #434343;
    align-items: center;
    line-height: 26px;
  }

  .product_editor_block > ul > li > p {
    font-size: 14px;
    font-weight: 700;
    color: #434343;
    align-items: center;
    line-height: 26px;
  }
  
  .description_box > p {
    font-size: 14px;
    font-weight: normal;
    color: #434343;
    line-height: 27px;
    display: block;
    margin-bottom: 10px;
  }
  
  }


.content_table {
  border-collapse: collapse;
  width: 100%;
  height: auto;
  margin-top: 15px;
  margin-bottom: 30px;
}


.content_table > thead > tr > th {
  background: #dceaff;
  border-top: 1px solid #eaeaea;
  border-bottom: 1px solid #eeeeee;
  border-left: 1px solid #eaeaea;
  border-right: 1px solid #eaeaea;
  padding: 10px;
  font-weight: 700;
  font-size: 15px;
  text-align: left;
  word-break: break-all;
}


.content_table > tbody > tr > td {
  background: #ffffff;
  border-top: 1px solid #eaeaea;
  border-bottom: 1px solid #eeeeee;
  border-right: 1px solid #eaeaea;
  border-left: 1px solid #eaeaea;
  padding: 10px;
  font-weight: 300;
  font-size: 15px; 
  word-break: break-all;
  line-height: 26px;
}


@media only screen and (min-width: 0px) and (max-width: 750px) {
  .content_table > thead > tr > th {
    background: #dceaff;
    border-top: 1px solid #eaeaea;
    border-bottom: 1px solid #eeeeee;
    padding: 10px;
    font-weight: 700;
    font-size: 14px;
    text-align: left;
    word-break: break-all;
  }
  
  
  .content_table > tbody > tr > td {
    background: #ffffff;
    border-top: 1px solid #eaeaea;
    border-bottom: 1px solid #eeeeee;
    border-right: 1px solid #eaeaea;
    padding: 10px;
    font-weight: 300;
    font-size: 14px; 
    word-break: break-all;
    line-height: 24px;
  }
  
}


.content_table > tbody > tr > td > img {
  display: block;
  max-width: 100%;
}


.content_table > tbody > tr > th {
  background: #dde4f0;
  border: 1px solid #fafafa;
  padding: 10px;
  font-weight: 700;
  font-size: 15px;
  line-height: 26px;
  word-break: break-all;
}


/*파랑*/


/*퍼플*/


/*레드*/


/*그린*/


.content_sign {
  display: flex;
  flex-direction: column;
  margin-left: auto;
  margin-bottom: 30px;
}

.content_date {
  font-size: 15px;
  font-weight: 300;
  margin-left: auto;
  color: #434343;
  display: block;
  margin-bottom: 5px;
  background: #eaeaea;
  padding: 5px 10px 5px 10px;
  border-radius: 5px;
  word-break: keep-all;
}

.content_author {
  font-size: 15px;
  font-weight: 300;
  margin-left: auto;
  color: #434343;
  display: block;
  margin-bottom: 5px;
  background: #f1f1f1;
  padding: 5px 10px 5px 10px;
  border-radius: 5px;
  word-break: keep-all;
}

.content_author:last-child {
  margin-bottom: 0px;
}


@media only screen and (min-width: 0px) and (max-width: 750px) {
  .content_date {
    font-size: 14px;
    font-weight: 300;
    margin-left: auto;
    color: #434343;
    display: block;
    margin-bottom: 5px;
    background: #eaeaea;
    padding: 5px 10px 5px 10px;
    border-radius: 5px;
    word-break: keep-all;
  }
  
  .content_author {
    font-size: 14px;
    font-weight: 300;
    margin-left: auto;
    color: #434343;
    display: block;
    margin-bottom: 5px;
    background: #f1f1f1;
    padding: 5px 10px 5px 10px;
    border-radius: 5px;
    word-break: keep-all;
  }
}


/**************
*
*
* 컨텐츠 경고 박스
*
*
*****************/


/**************
*
*
* 컨텐츠 raw 로우 박스
*
*
*****************/


@media only screen and (min-width: 0px) and (max-width: 750px) {
  .content_raw_box > p {
    font-size: 14px;
      font-weight: normal;
      color: #434343;
      line-height: 27px;
      display: block;
      word-break: break-all;
  }
}


/**********************
*
*
* 인용문
*
*
************************/


/******************************
*
*
* 링크 툴
*
*
*******************************/

.product_linktool {
  display: flex;
  flex-direction: row-reverse;
  width: 100%;

  background: #fff;
  border: 1px solid rgba(201, 201, 204, .48);
  box-shadow: 0 1px 3px #0000001a;
  border-radius: 6px;

  text-decoration: none;
}

.product_linktool_thumb {
  margin-left: 30px;
  padding: 25px 25px 25px 0px;
}

.product_linktool_thumb img {
  width: 80px !important;
  height: 80px !important;
  border-radius: 3px !important;
  border: none !important;
  flex-shrink: 0;
  object-fit: cover !important;
  display: flex;
  margin: 0 !important;
}

@media only screen and (min-width: 0px) and (max-width: 650px) {

  .product_linktool {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
  }

  .product_linktool_thumb {
    margin-left: 0px;
    border-bottom: 1px solid rgba(201, 201, 204, .48);
    padding: 0px;
    overflow: hidden;
  }

  .product_linktool_thumb img {
    width: 100% !important;
    height: 100% !important;
    max-height: 280px !important;
    border-radius: 3px !important;
    border: none !important;
    flex-shrink: 0;
    object-fit: contain !important;
    display: flex;
    margin: 0 !important;
  }


}


.product_linktool_body {
  display: flex;
  flex-direction: column;
  padding: 25px;
  margin-right: auto;
}

.product_linktool_body_title {
  font-size: 17px;
  font-weight: 600;
  margin: 0 0 10px;
  color: #434343;
}

.product_linktool_body_desc {
  margin: 0 0 20px;
  font-size: 15px;
  line-height: 1.55em;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  color: #434343;
}

.product_linktool_body_site {
  display: block;
  font-size: 15px;
  line-height: 1em;
  color: #888 !important;
  border: 0 !important;
  padding: 0 !important;
}


@media (max-width: 900px) {
  .product_hero {
    gap: 10px;
    flex-direction: column;
  }

  .product_hero_image {
    width: calc(100%);
    padding-bottom: 56.25%;
  }

  .product_hero_info {
    width: 100%;
  }
}
@media (max-width: 580px) {
  .product_price_area {
    align-items: flex-start;
    flex-direction: column;
  }
  .product_price_value {
    width: 100%;
  }
}

/* =========================================================
   PC ↔ 모바일 전환 시 필터 사이드바 깜빡임 방지
========================================================= */
html.store_filter_breakpoint .explore_left,
html.store_filter_breakpoint .store_primary_nav,
html.store_filter_breakpoint .store_mobile_search_panel,
html.store_filter_breakpoint .store_filter_overlay {
  transition: none !important;
}

@supports not selector(:has(*)) {
  .store_primary_nav + .explore_left {
    border-radius: 0;
  }
}


/* =========================================================
   상품 상세 모드 - 필터 패널 숨김
   ---------------------------------------------------------
   상세 화면에서는 Microsoft Store처럼
   1차 아이콘 메뉴만 유지하고 카테고리/정렬/상태 패널은 숨깁니다.
========================================================= */
.store_detail_mode .explore_left {
  display: none !important;
}

@media only screen and (max-width: 800px) {
  .store_detail_mode .store_filter_open {
    display: none !important;
  }
}

.store_detail_mode .store_primary_nav {
  border-radius: 0 0 0 20px;
}

.store_detail_mode .explore_right {
  flex: 1 1 auto;
  width: calc(100% - 72px);
}

@media only screen and (min-width: 801px) and (max-width: 1100px) {
  .store_detail_mode .explore_right {
    width: calc(100% - 64px);
  }
}

@media only screen and (min-width: 0px) and (max-width: 800px) {
  .store_detail_mode .explore_right {
    width: 100%;
    border-radius: 0 0 20px 20px;
  }
}


/* =========================================================
   스토어 상단 전역 검색
   - PC: 로고 / 검색 / 사용자
   - 모바일: 1행 로고+사용자, 2행 검색
========================================================= */

.store_user_bar {
  flex-wrap: nowrap;
}

.store_global_search {
  width: 100%;
  max-width: 360px;
  margin-left: auto;
  z-index: 30;
}

.store_global_search .input_group {
  width: 100%;
}

/* 기존 검색 컴포넌트 스타일 재사용 */
.store_global_search .store_bar_group {
  width: 100%;
}

.store_global_search .suggestion_group {
  width: 100%;
}

/* 카테고리 제목 + 상품 개수 */
.store_category_title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  overflow: visible;
  white-space: normal;
}

.store_category_title > h3 {
  margin-bottom: 20px;
}

.store_category_count {
  margin-bottom: 20px;
  flex-shrink: 0;
  font-size: 12px;
  font-weight: 500;
  color: #777;
}

.store_category_count > strong {
  color: #2083c8;
  font-weight: 900;
}

/* PC에서는 기존 result head가 더 이상 필요 없음 */
@media only screen and (min-width: 801px) {
  .store_result_head {
    display: none;
  }
}

@media only screen and (min-width: 0px) and (max-width: 800px) {

  .store_user_bar {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 7px;
  }

  .store_user_logo {
    width: 100px;
    flex: 0 0 auto;
  }

  .store_user_menu_wrap {
    position: relative;
    z-index: 100;
  }

  /* 모바일에서는 검색 UI를 상단에서 제거하고 검색 패널 안으로 이동 */
  .store_global_search {
    width: 100%;
    max-width: none;
    margin: 0;
  }

}

/* 상세에서도 전역 검색은 유지 */
.store_detail_mode .store_global_search {
  display: flex;
}




/* =========================================================
   모바일 검색 메뉴 / 검색 패널
========================================================= */

.store_mobile_search_panel {
  display: none;
}

@media only screen and (min-width: 0px) and (max-width: 800px) {

  body.store_search_opened {
    touch-action: none;
  }

  .store_mobile_search_panel {
    position: fixed;
    top: 0;
    left: 72px;
    z-index: 10002;
    width: min(360px, calc(100vw - 72px));
    height: 100%;
    display: flex;
    flex-direction: column;
    background: rgba(247, 248, 250, .98);
    box-shadow: 14px 0 40px rgba(0, 0, 0, .18);
    backdrop-filter: blur(22px);
    -webkit-backdrop-filter: blur(22px);

    transform: translate3d(calc(-100% - 72px), 0, 0);
    visibility: hidden;
    transition:
      transform .28s cubic-bezier(.22,.61,.36,1),
      visibility 0s linear .28s;
  }

  .store_mobile_search_panel.is-open {
    transform: translate3d(0, 0, 0);
    visibility: visible;
    transition:
      transform .28s cubic-bezier(.22,.61,.36,1),
      visibility 0s;
  }

  .store_mobile_search_head {
    min-height: 61px;
    padding: 10px 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: rgba(247, 248, 250, .96);
    border-bottom: 1px solid #e4e7eb;
    box-shadow: 0 10px 20px rgba(0, 0, 0, .08);
  }

  .store_mobile_search_head > strong {
    font-size: 18px;
    font-weight: 900;
    color: #30343a;
  }

  .store_mobile_search_close {
    position: relative;
    width: 40px;
    height: 40px;
    padding: 0;
    border: 0;
    border-radius: 10px;
    background: transparent;
    cursor: pointer;
  }

  .store_mobile_search_close:hover {
    background: #e9edf2;
  }

  .store_mobile_search_close > span {
    position: absolute;
    top: 19px;
    left: 10px;
    width: 20px;
    height: 2px;
    border-radius: 2px;
    background: #464b52;
  }

  .store_mobile_search_close > span:first-child {
    transform: rotate(45deg);
  }

  .store_mobile_search_close > span:last-child {
    transform: rotate(-45deg);
  }

  .store_mobile_search_body {
    padding: 18px;
    overflow-y: auto;
  }

  .store_mobile_search_mount {
    width: 100%;
  }

  .store_mobile_search_panel .store_global_search {
    display: flex;
    width: 100%;
    max-width: none;
    margin: 0;
  }

  .store_mobile_search_panel .suggestion_group {
    position: relative;
    margin-top: 10px;
    max-height: none;
  }

  .store_mobile_search_panel .error_message {
    position: relative;
    top: auto;
    left: auto;
    margin-top: 10px;
  }

  /*
   * 검색 패널이 열릴 때도 primary nav는 필터와 동일하게 같이 노출합니다.
   */
  body.store_search_opened .store_primary_nav {
    transform: translate3d(0, 0, 0);
    visibility: visible;
    transition:
      transform .28s cubic-bezier(.22,.61,.36,1),
      visibility 0s;
  }

  /*
   * 검색 패널이 열려 있을 때 primary nav의 검색 메뉴만 활성화.
   */
  body.store_search_opened .store_primary_search {
    background: #ffffff;
    color: #164ca0;
    box-shadow: 0 2px 10px rgba(25, 45, 75, .08);
  }
}

@media only screen and (min-width: 801px) {
  .store_primary_search {
    display: none;
  }
}


@media only screen and (min-width: 0px) and (max-width: 800px) {
  .store_user_bar > .store_global_search {
    display: none !important;
  }

  .store_mobile_search_mount > .store_global_search {
    display: flex !important;
  }
}

/* =========================================================
   검색 결과 2단 구성
   - 현재 범위 검색 결과
   - 전체 상품 검색 결과(중복 제외)
========================================================= */

.store_global_result_section {
  border-top: 1px solid #eceff3;
  margin-top: 15px;
  padding-top: 5px;
}

.store_global_result_title > h3 {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 8px;
}

.store_global_result_count {
  font-size: 25px;
  font-weight: 900;
  color: #434343;
  display: block;
}

.store_global_empty {
  padding-top: 35px;
  padding-bottom: 55px;
}

@media only screen and (min-width: 0px) and (max-width: 800px) {
  .store_global_result_section {
    margin-top: 5px;
  }

  .store_global_result_title > h3 {
    font-size: 21px;
  }
}


/* =========================================================
   상품 목록 공통 그리드
   - 기본 상품 목록 / 전체 상품 검색 결과 목록 동일 적용
========================================================= */

.store_product_list {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 20px;
}

.store_product_list > li {
  width: calc(1/3*100% - (1 - 1/3)*20px);
  background: #fff;
  border: 1px solid #eeeeee;
  border-radius: 10px;
  box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.05);
  overflow: hidden;
}

@media only screen and (min-width: 801px) and (max-width: 1100px) {
  .store_product_list > li {
    width: calc(1/2*100% - (1 - 1/2)*20px);
  }
}

@media only screen and (min-width: 0px) and (max-width: 800px) {
  .store_product_list > li {
    width: 100%;
  }
}


/* =========================================================
   검색어 지우기
========================================================= */
.store_search_input_wrap {
  position: relative;
  width: 100%;
  display: flex;
}

.store_search_input_wrap .store_input_box {
  padding-right: 42px;
}

.store_search_clear {
  position: absolute;
  top: 50%;
  right: 10px;
  width: 24px;
  height: 24px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #dfe3e8;
  opacity: 0;
  visibility: hidden;
  cursor: pointer;
  transform: translateY(-50%);
  transition: opacity .15s ease, background .15s ease, visibility 0s linear .15s;
}

.store_search_clear.is-visible {
  opacity: 1;
  visibility: visible;
  transition: opacity .15s ease, background .15s ease, visibility 0s;
}

.store_search_clear:hover {
  background: #cfd5dc;
}

.store_search_clear::before,
.store_search_clear::after {
  content: "";
  position: absolute;
  top: 11px;
  left: 6px;
  width: 12px;
  height: 2px;
  border-radius: 2px;
  background: #555d68;
}

.store_search_clear::before {
  transform: rotate(45deg);
}

.store_search_clear::after {
  transform: rotate(-45deg);
}

/* =========================================================
   필터 초기화
========================================================= */
.store_filter_reset_wrap {
  padding: 20px 20px 0;
}

.store_filter_reset {
  width: 100%;
  padding: 9px 12px;
  border: 1px solid #d7dce3;
  border-radius: 8px;
  background: #ffffff;
  color: #555d68;
  font-family: inherit;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
  transition: background .15s ease, border-color .15s ease, color .15s ease;
}

.store_filter_reset:hover {
  background: #f5f7f9;
  border-color: #c7cdd5;
  color: #164ca0;
}

@media only screen and (min-width: 0px) and (max-width: 800px) {
  .store_filter_reset_wrap {
    padding-top: 12px;
    background: rgba(247, 248, 250, .98);
  }
}


/* =========================================================
   상품 라이선스 정보
   - 상품명과 "1년 / 1PC / 개인용" 정보를 분리 표시
========================================================= */
.store_product_license {
  margin-top: 4px;
  margin-bottom: 4px;
  font-size: 12px !important;
  line-height: 20px !important;
  font-weight: 700 !important;
  color: #58708d !important;

  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 5px;
}

.store_product_license_item {
  display: block;
  padding: 2px 5px;
  background: rgba(231, 239, 255, 1);
  border-radius: 5px;
}

.product_license_meta {
  margin-top: 15px;
  margin-bottom: 4px;
  font-size: 12px !important;
  line-height: 20px !important;
  font-weight: 700 !important;
  color: #58708d !important;

  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 5px;
}

.product_license_meta_item {
  display: block;
  padding: 2px 5px;
  background: rgba(231, 239, 255, 1);
  border-radius: 5px;
}


.suggestion_license {
  margin-bottom: 6px;
  color: #58708d;
  font-size: 13px;
  line-height: 20px;
  font-weight: 700;
}


/* =========================================================
   모바일 1차 메뉴 - 다운로드 페이지와 동일한 가로형 메뉴
   ---------------------------------------------------------
   - 기존 72px 세로 메뉴를 모바일에서 가로 메뉴로 전환
   - 필터/검색 패널은 메뉴와 분리된 독립 드로어로 유지
========================================================= */
@media only screen and (min-width: 0px) and (max-width: 800px) {

  /* 메뉴 → 콘텐츠 순서로 위에서 아래 배치 */
  .explore_item {
    flex-direction: column;
  }

  /* 1차 메뉴는 항상 보이는 가로형 */
  .store_primary_nav {
    position: relative;
    z-index: 8;
    width: 100%;
    height: auto;
    padding: 8px 10px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    border-radius: 0;
  }

  /* 필터/검색을 열어도 메뉴 위치는 변하지 않음 */
  body.store_filter_opened .store_primary_nav,
  body.store_search_opened .store_primary_nav {
    position: relative;
    transform: none !important;
    visibility: visible !important;
  }

  .store_primary_nav_top,
  .store_primary_nav_bottom {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    gap: 4px;
  }

  .store_primary_item {
    width: auto;
    min-width: 52px;
    min-height: 54px;
    padding: 5px 7px;
    gap: 4px;
    border-radius: 10px;
  }

  .store_primary_icon {
    width: 23px;
    height: 23px;
  }

  .store_primary_icon svg {
    width: 22px;
    height: 22px;
  }

  .store_primary_label {
    max-width: none;
    font-size: 9px;
    line-height: 1.15;
    white-space: nowrap;
  }

  /*
   * 기존 세로 메뉴 공간(left:72px)을 사용하던 필터 패널을
   * 화면 왼쪽에서 바로 열리도록 변경합니다.
   */
  .explore_left {
    left: 0;
    width: min(320px, 100vw);
    transform: translate3d(-105%, 0, 0);
  }

  .explore_left.is-open {
    transform: translate3d(0, 0, 0);
  }

  /*
   * 모바일 검색 패널 역시 세로 메뉴 옆이 아니라
   * 화면 왼쪽에서 독립적으로 열립니다.
   */
  .store_mobile_search_panel {
    left: 0;
    width: min(380px, 100vw);
    transform: translate3d(-105%, 0, 0);
  }

  .store_mobile_search_panel.is-open {
    transform: translate3d(0, 0, 0);
  }

  /*
   * 메뉴가 상단으로 이동했으므로 상품 영역은 항상 전체 폭 사용
   */
  .explore_right {
    width: 100%;
    flex: 1 1 auto;
  }

  /* 상세 화면도 동일한 가로 메뉴 구조 유지 */
  .store_detail_mode .store_primary_nav {
    border-radius: 0;
  }

  .store_detail_mode .explore_right {
    width: 100%;
  }
}

/* 아주 작은 화면에서는 메뉴 간격만 조금 더 압축 */
@media only screen and (min-width: 0px) and (max-width: 380px) {
  .store_primary_nav_top,
  .store_primary_nav_bottom {
    gap: 1px;
  }

  .store_primary_item {
    min-width: 47px;
    padding-left: 4px;
    padding-right: 4px;
  }

  .store_primary_label {
    font-size: 8.5px;
  }
}


/* =========================================================
   모바일 상단 검색 - 2026-09-08
========================================================= */
.store_top_search_button,
.store_mobile_search_dropdown {
  display: none;
}

@media only screen and (min-width: 0px) and (max-width: 800px) {
  .store_nav_item {
    position: relative;
  }

  .store_user_logo {
    margin-right: auto;
  }

  .store_top_search_button {
    align-items: center;
    justify-content: center;
    padding: 6.5px 5px 6.5px 5px;
    cursor: pointer;
    background: #e4e8ef;
    display: inline-flex;
    align-items: center;
    border-radius: 8px;
    color: #4a4f57;
    font-family: inherit;
    font-size: 13px;
    font-weight: 800;
    transition: background .18s ease, color .18s ease, box-shadow .18s ease, transform .18s ease;
  }

  .store_top_search_button:hover {
    background: #dce1e8;
  }

  .store_top_search_button:active {
    transform: translateY(1px);
  }

  .store_top_search_button.is-active {
    background: #ffffff;
    color: #164ca0;
    box-shadow: 0 2px 10px rgba(25, 45, 75, .10);
  }

  .store_top_search_icon {
    position: relative;
    width: 20px;
    height: 20px;
    display: inline-block;
  }

  .store_top_search_icon svg {
    width: 20px;
    height: 20px;
    display: block;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.75;
    stroke-linecap: round;
    stroke-linejoin: round;
  }

  /*
   * 모바일 검색
   * - 일반 레이아웃 높이에 영향을 주지 않는 absolute overlay
   * - 사용자 메뉴 dropdown처럼 상단 바 아래에 떠서 표시
   */
  .store_nav_item {
    position: relative;
  }

  .store_mobile_search_dropdown {
    position: absolute;
    top: 60px;

    right: 20px;
    z-index: 9998;
    width: auto;
    padding: 0;
    display: block;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(-6px);
    transition:
      opacity .18s ease,
      transform .22s cubic-bezier(.22,.61,.36,1),
      visibility 0s linear .22s;
  }

  .store_mobile_search_dropdown.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
    transition:
      opacity .18s ease,
      transform .22s cubic-bezier(.22,.61,.36,1),
      visibility 0s;
  }

  .store_mobile_search_mount {
    width: 100%;
  }

  .store_mobile_search_dropdown .store_global_search {
    width: 100%;
    max-width: none;
    margin: 0;
    display: flex;
  }

  .store_mobile_search_dropdown .input_group {
    width: 100%;
    position: relative;
  }

  .store_mobile_search_dropdown .store_bar_group {
    width: 100%;
    overflow: hidden;
    border: 1px solid #e1e6ed;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 10px 28px rgba(25, 45, 75, 0.5);
  }

  .store_mobile_search_dropdown .store_search_input_wrap {
    flex: 1 1 auto;
  }

  .store_mobile_search_dropdown .store_input_box {
    width: 100%;
  }

  /*
   * 자동완성도 검색창 아래에 absolute로 표시하여
   * 스토어 메뉴/상품 영역을 아래로 밀지 않습니다.
   */
  .store_mobile_search_dropdown .suggestion_group {
    position: absolute;
    top: calc(100% + 7px);
    left: 0;
    right: 0;
    width: 100%;
    margin: 0;
    max-height: min(360px, 55vh);
    z-index: 120;
  }

  .store_mobile_search_dropdown .error_message {
    top: 8px;
    left: 0;
    z-index: 121;
  }

  .store_mobile_search_panel,
  .store_primary_search {
    display: none !important;
  }

  body.store_search_opened {
    touch-action: auto;
  }

  .store_primary_item {
    flex: 1 1 0;
    max-width: 92px;
  }
}


/* =========================================================
   스토어 상품 페이지네이션 - 피싱주의보 공통 방식
   - 페이지당 6개
   - 처음 / 이전 / 현재부터 3개 / 다음 / 마지막
   - 긴 구간은 ellipsis(…) 처리
========================================================= */
.store_pagination {
  width: 100%;
  padding: 5px 20px 30px;
}

.store_pagination_list {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 6px;
}

.store_pagination_list > li {
  display: flex;
  align-items: center;
  justify-content: center;
}

.store_pagination .page_number,
.store_pagination .page_current,
.store_pagination .page_first,
.store_pagination .page_prev,
.store_pagination .page_next,
.store_pagination .page_last {
  min-width: 38px;
  height: 38px;
  padding: 0 11px;
  border: 1px solid #dfe4ea;
  border-radius: 8px;
  background: #ffffff;
  color: #555d68;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: inherit;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  box-sizing: border-box;
  transition: background .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
}

.store_pagination a.page_number {
  cursor: pointer;
}

.store_pagination a.page_number:hover {
  border-color: #c4d4e8;
  background: #f4f8fd;
  color: #164ca0;
}

.store_pagination .page_current {
  border-color: #164ca0;
  background: #164ca0;
  color: #ffffff;
  box-shadow: 0 4px 12px rgba(22, 76, 160, .16);
}

.store_pagination .disabled {
  border-color: #eceff3;
  background: #f7f8fa;
  color: #b2b8c0;
  cursor: default;
  pointer-events: none;
}

.store_pagination .page_ellipsis {
  min-width: 28px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #8b929b;
  font-size: 15px;
  font-weight: 700;
  line-height: 1;
  user-select: none;
}

/* 처음 / 이전 / 다음 / 마지막 화살표 */
.store_pagination .first_go,
.store_pagination .prev_go,
.store_pagination .next_go,
.store_pagination .last_go {
  position: relative;
  width: 14px;
  height: 14px;
  display: block;
}

.store_pagination .prev_go::before,
.store_pagination .next_go::before,
.store_pagination .first_go::before,
.store_pagination .first_go::after,
.store_pagination .last_go::before,
.store_pagination .last_go::after {
  content: "";
  position: absolute;
  top: 50%;
  width: 7px;
  height: 7px;
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor;
}

.store_pagination .prev_go::before {
  left: 5px;
  transform: translateY(-50%) rotate(-135deg);
}

.store_pagination .next_go::before {
  right: 5px;
  transform: translateY(-50%) rotate(45deg);
}

.store_pagination .first_go::before {
  left: 2px;
  transform: translateY(-50%) rotate(-135deg);
}

.store_pagination .first_go::after {
  left: 7px;
  transform: translateY(-50%) rotate(-135deg);
}

.store_pagination .last_go::before {
  right: 7px;
  transform: translateY(-50%) rotate(45deg);
}

.store_pagination .last_go::after {
  right: 2px;
  transform: translateY(-50%) rotate(45deg);
}

.store_global_pagination {
  padding-bottom: 35px;
}

@media only screen and (min-width: 0px) and (max-width: 580px) {
  .store_pagination {
    padding: 5px 10px 25px;
  }

  .store_pagination_list {
    gap: 4px;
  }

  .store_pagination .page_number,
  .store_pagination .page_current,
  .store_pagination .page_first,
  .store_pagination .page_prev,
  .store_pagination .page_next,
  .store_pagination .page_last {
    min-width: 34px;
    height: 34px;
    padding: 0 8px;
    border-radius: 7px;
    font-size: 12px;
  }

  .store_pagination .page_ellipsis {
    min-width: 18px;
    height: 34px;
    font-size: 14px;
  }
}



/* =========================================================
   상품 상세 - 제품 정보 / 시스템 요구 사항
   Editor.js 제품 소개와 정형 메타데이터를 분리합니다.
========================================================= */

.product_meta_group {
  display: flex;
  flex-direction: column;
  padding: 10px;
}

.product_meta_box {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.product_requirements_section {
  margin-top: 15px;
}

.product_meta_section {
  display: flex;
  flex-direction: column;
  border-radius: 10px;
}

.product_meta_head {
  margin-bottom: 10px;
}

.product_meta_head h2 {
  font-size: 20px;
  font-weight: 700;
  color: #434343;
  display: block;
  padding: 20px;
  background: #f9f9f9;
  border-radius: 10px;
  border: 1px solid #eeeeee;
}
.product_info_list {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 15px;
  padding: 15px;
  background: #f9f9f9;
  border-radius: 10px;
  border: 1px solid #eeeeee;
}

.product_info_item_head {
  display: flex;
  flex-direction: row;
  align-items: center;
  width: 100%;
  border-bottom: 1px solid #eeeeee;
  padding: 10px;
  background: #ffffff;
  border-radius: 10px 10px 0px 0px;
}

.product_info_item {
  width: calc(1/3*100% - (1 - 1/3)*15px);
  display: flex;
  flex-direction: column;
  border: 1px solid #eeeeee;
  border-radius: 10px;
}
.product_info_item_label {
  color: #7b8490;
  font-size: 12px;
  font-weight: 650;
  line-height: 18px;
}
.product_info_item_value {
  color: #303740;
  font-size: 14px;
  font-weight: 700;
  line-height: 22px;
  word-break: break-word;
}
@media only screen and (min-width: 0px) and (max-width: 580px) {
  .product_info_item { 
    width: calc(100%);
  }
}

@media only screen and (min-width: 581px) and (max-width: 900px) {
  .product_info_item { 
    width: calc(1/2*100% - (1 - 1/2)*15px);
  }
}
/* =========================================================
   정형 상품 정보 아이콘
   - 의미가 정해진 기본 항목은 key별 line SVG
   - 직접 입력 항목은 공통 info SVG
========================================================= */

.product_info_item {
  display: flex;
  align-items: flex-start;
}

.product_info_item_icon {
  width: 22px;
  height: 22px;
  margin-right: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #657182;
}

.product_info_item_icon svg {
  width: 22px;
  height: 22px;
  display: block;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.65;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.product_info_item_text {
  display: flex;
  flex-direction: column;
  width: 100%;
  padding: 10px;
  background: #ffffff;
  border-radius: 0px 0px 10px 10px;
}

.product_info_item_label {
  display: block;
}

.product_info_item_value {
  display: block;
}

@media only screen and (max-width: 580px) {
  .product_info_item_icon {
    width: 20px;
    height: 20px;
    margin-right: 9px;
    flex-basis: 20px;
  }

  .product_info_item_icon svg {
    width: 20px;
    height: 20px;
  }
}

/* =========================================================
   상품 비교 - 선택 버튼 / 하단 비교 바
========================================================= */
.store_product {
  display: flex;
  flex-direction: column;
}

.store_product > a {
  flex: 1 1 auto;
}

.store_compare_card_action {
  padding: 0 15px 15px;
  background: #fff;
}

.store_compare_toggle_icon {
  width: 0;
  height: 18px;
  flex: 0 0 0;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  overflow: hidden;
  transform: scale(.72);
  transition:
    width .2s ease,
    flex-basis .2s ease,
    opacity .18s ease,
    transform .22s cubic-bezier(.2,.8,.2,1);
}

.store_compare_toggle.is-selected .store_compare_toggle_icon {
  width: 18px;
  flex-basis: 18px;
  opacity: 1;
  transform: scale(1);
}

.store_compare_check_svg {
  width: 100%;
  height: 100%;
  display: block;
}

.store_compare_toggle {
  width: 100%;
  padding: 10px 15px;
  border: 1px solid #d6dde7;
  border-radius: 8px;
  background: #fff;
  color: #596473;
  font-family: inherit;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  transition:
    background .18s ease,
    border-color .18s ease,
    color .18s ease;
}

.store_compare_toggle:hover {
  border-color: #aebdd1;
  background: #f6f8fb;
  color: #303a48;
}

.store_compare_toggle.is-selected {
  border-color: #164ca0;
  background: #eef4ff;
  color: #164ca0;
}

.store_compare_toggle:disabled:not(.is-selected) {
  opacity: .42;
  cursor: not-allowed;
}

.store_compare_bar {
  position: fixed;
  left: 50%;
  bottom: 18px;
  z-index: 10020;
  width: auto;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translate(-50%, 12px);
  transition:
    opacity .18s ease,
    transform .22s ease,
    visibility 0s linear .22s;
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 280px;
  justify-content: center;
}

.store_compare_bar.is-visible {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translate(-50%, 0);
  transition:
    opacity .18s ease,
    transform .22s ease,
    visibility 0s;
}



.store_compare_reset {
  padding: 15px 20px;
  border: none;
  border-radius: 100px;
  background: #c7c8c9;
  color: #3f4854;
  font-family: inherit;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  box-shadow: 0 10px 26px rgba(24, 42, 69, .14);
  transition: background .18s ease, border-color .18s ease, color .18s ease, transform .18s ease;
}

.store_compare_reset:hover {
  background: #d3d3d4;
  color: #3f4854;
}

.store_compare_reset:active {
  transform: translateY(1px);
}

.store_compare_reset_icon {
  width: 15px;
  height: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.store_compare_reset_icon svg {
  width: 15px;
  height: 15px;
  display: block;
}

.store_compare_go {
  padding: 15px 20px;
  border: 0;
  background: #1d5cbf;
  color: #fff;
  font-family: inherit;
  font-size: 13px;
  font-weight: 900;
  cursor: pointer;
  box-shadow: 0 12px 32px rgba(24, 42, 69, .28);
  border-radius: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}

.store_compare_go_icon {
  width: 0;
  opacity: 0;
  overflow: hidden;
  flex: 0 0 0;
  transition: width .2s ease, flex-basis .2s ease, opacity .18s ease;
}

.store_compare_go:not(:disabled) .store_compare_go_icon {
  width: 15px;
  flex-basis: 15px;
  opacity: 1;
}

.store_compare_go > strong {
  margin-left: 0;
  color: inherit;
  font-size: inherit;
  font-weight: 900;
}

.store_compare_go:hover {
  background: #2268da;
}

.store_compare_go:disabled {
  background: #d1d6dd;
  color: #8a929d;
  cursor: default;
}

/* =========================================================
   상품 비교 화면
   - 표(table) 없이 Flexbox만 사용
========================================================= */
.product_compare_bg {
  display: none;
  width: 100%;
  position: relative;
  flex: 1 0 auto;
}

.store_compare_mode .explore_bg {
  display: block !important;
}

.store_compare_mode .explore_right > .content_box_all,
.store_compare_mode .product_detail_bg,
.store_compare_mode .explore_left {
  display: none !important;
}

.store_compare_mode .product_compare_bg {
  display: block;
}

.store_compare_mode .store_primary_nav {
  border-radius: 0 0 0 20px;
}

.store_compare_mode .explore_right {
  flex: 1 1 auto;
  width: calc(100% - 75px);
  border-radius: 20px 0 20px 0;
  background: #fff;
}

.store_compare_mode .store_primary_home {
  background: #fff;
  color: #164ca0;
  box-shadow: 0 2px 10px rgba(25, 45, 75, .08);
}

.store_compare_mode .store_compare_bar {
  display: none !important;
}

.product_compare_wrap {
  width: 100%;
}

.product_compare_box {
  width: 100%;
  background: #fff;
  border-radius: 0 0 20px 0;
}

.product_compare {
  padding: 10px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.product_compare_intro {
  padding: 15px;
  border-radius: 10px;
  background: #f9f9f9;
  border: 1px solid #eeeeee;
}

.product_compare_intro h1 {
  font-size: 25px;
  font-weight: 900;
  color: #434343;
  display: block;
}

.product_compare_product {
  width: calc(1/2*100% - (1 - 1/2)*0px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid #eeeeee;
  border-right: none;
  background: #fff;
}

.product_compare_product:last-child {
  border-radius: 0px 10px 10px 0px;
  border-right: 1px solid #eeeeee;
}

.product_compare_product_image {
  position: relative;
  width: 100%;
  padding-bottom: 48%;
  overflow: hidden;
  background: #f6f7f8;
}

.product_compare_product_image img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  padding: 18px;
  object-fit: contain;
}

.product_compare_no_image {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #a1abba;
  font-size: 13px;
  font-weight: 800;
}

.product_compare_product_body {
  padding: 16px;
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
}

.product_compare_product_body h2 {
  color: #303740;
  font-size: 17px;
  font-weight: 900;
  line-height: 25px;
  word-break: keep-all;
}

.product_compare_product_body p {
  margin-top: 5px;
  color: #7b8490;
  font-size: 12px;
  line-height: 20px;

  overflow: hidden;
  word-break: keep-all;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.product_compare_product_price {
  margin-top: 16px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 6px;
  flex-grow: 1;
}

.product_compare_original_price {
  color: #a6adb6;
  font-size: 11px;
  font-weight: 500;
  text-decoration: line-through;
}

.product_compare_discount_rate {
  color: #db4b4b;
  font-size: 12px;
  font-weight: 900;
}

.product_compare_product_price strong,
.product_compare_price_value strong {
  color: #164ca0;
  font-size: 18px;
  font-weight: 900;
}

.product_compare_detail_link {
  margin-top: 12px;
  min-height: 38px;
  padding: 0 13px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #d5dce6;
  border-radius: 8px;
  background: #fff;
  color: #536174;
  font-size: 12px;
  font-weight: 800;
}

.product_compare_detail_link:hover {
  border-color: #b8c7db;
  background: #f6f8fb;
  color: #164ca0;
}

.product_compare_section {
  overflow: hidden;
  border: 1px solid #eeeeee;
  border-radius: 10px;
  background: #fff;
}

.product_compare_section_head {
  padding: 15px 18px;
  background: #f7f8fa;
  border-bottom: 1px solid #eeeeee;
}

.product_compare_section_head h2 {
  color: #303740;
  font-size: 15px;
  font-weight: 900;
}

.product_compare_rows {
  display: flex;
  flex-direction: column;
}

.product_compare_row {
  display: flex;
  border-bottom: 1px solid #eeeeee;
}

.product_compare_row:last-child {
  border-bottom: 0;
}

.product_compare_label {
  flex: 0 0 160px;
  padding: 15px;
  display: flex;
  align-items: center;
  background: #fbfbfc;
  color: #727c88;
  font-size: 13px;
  font-weight: 600;
  border-right: 1px solid #eeeeee;
}

.product_compare_values {
  flex: 1 1 auto;
  display: flex;
}

.product_compare_value {
  padding: 15px;
  color: #303740;
  font-size: 13px;
  font-weight: 700;
  line-height: 21px;
  word-break: break-word;
}

.product_compare_values {
  flex: 1 1 auto;
  display: flex;
}

.product_compare_value + .product_compare_value {
  border-left: 1px solid #eeeeee;
}

.product_compare_value.is-price {
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
}

.product_compare_price_value {
  display: flex;
  align-items: baseline;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 6px;
}

.product_compare_empty_value {
  color: #b1b7c0;
  font-weight: 500;
}

.product_compare_mobile_name {
  display: none;
}

@media only screen and (max-width: 800px) {
  .store_compare_mode .store_filter_open {
    display: none !important;
  }

  .store_compare_mode .explore_right {
    width: 100%;
    border-radius: 0 0 20px 20px;
  }

  .product_compare_box {
    border-radius: 0 0 20px 20px;
  }
}

@media only screen and (max-width: 700px) {
  .product_compare {
    gap: 8px;
  }

  .product_compare_intro {
    padding: 18px 15px;
  }

  .product_compare_products {
    flex-direction: column;
  }

  .product_compare_product {
    width: 100%;
  }

  .product_compare_product_image {
    padding-bottom: 50%;
  }

  .product_compare_row {
    flex-direction: column;
  }

  .product_compare_label {
    width: 100%;
    flex: auto;
    padding: 11px 13px;
    border-bottom: 1px solid #eeeeee;
    border-right: none;
    color: #5c6672;
  }

  .product_compare_values {
    flex-direction: column;
  }

  .product_compare_value {
    width: 100%;
    flex: none;
    padding: 12px 13px;
  }

  .product_compare_value + .product_compare_value {
    border-left: 0;
    border-top: 1px solid #eeeeee;
  }

  .product_compare_mobile_name {
    margin-bottom: 5px;
    display: block;
    overflow: hidden;
    color: #868e97;
    font-size: 12px;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .product_compare_value.is-price,
  .product_compare_price_value {
    align-items: flex-start;
    justify-content: flex-start;
    flex-direction: column;
  }

  .store_compare_bar {
    margin: auto;
    width: 100%;
    justify-content: center;
    flex-direction: column;
  }
}

/* =========================================================
   상품 비교 - 상단 제품 라벨 / 3열 Flex 정렬
   [제품 160px] [상품 A] [상품 B]
========================================================= */
.product_compare_products {
  display: flex;
}

.product_compare_products_label {
  flex: 0 0 160px;
  padding: 15px;
  display: flex;
  align-items: center;
  background: #fbfbfc;
  border: 1px solid #eeeeee;
  border-right: none;
  border-radius: 10px 0px 0px 10px;
  color: #727c88;
  font-size: 13px;
  font-weight: 600;
  word-break: break-all;
}

.product_compare_products_items {
  flex: 1 1 auto;
  display: flex;
}


/* 아래 비교행도 동일한 기준선 사용 */
@media only screen and (min-width: 701px) {
  .product_compare_row {
    position: static;
  }

  .product_compare_label {
    position: static;
    width: auto;
    flex: 0 0 160px;
  }

  .product_compare_values {
    width: auto;
    flex: 1 1 auto;
  }

  .product_compare_value {
    flex: 1 1 0;
  }

  .product_compare_value:first-child {
    padding-left: 15px;
  }
}

@media only screen and (max-width: 900px) {
  .product_compare_products {
    flex-direction: column;
  }

  .product_compare_products_label {
    display: none;
  }

  .product_compare_products_items {
    width: 100%;
    flex-direction: column;
    gap: 10px;
  }

  .product_compare_products_items .product_compare_product {
    border: 1px solid #eeeeee;
    border-radius: 10px;
    width: 100%;
  }
}



/* =========================================================
   상단 비교 상품 메뉴
========================================================= */
.store_compare_menu_button {
  position: relative;
  border: 0;
  font-family: inherit;
}
.store_compare_menu_icon { position: relative; }
.store_compare_menu_count {
  position: absolute;
  top: -10px;
  right: -25px;
  min-width: 17px;
  height: 17px;
  padding: 0 4px;
  border-radius: 20px;
  background: #164ca0;
  color: #fff;
  font-size: 10px;
  line-height: 17px;
  font-weight: 900;
  text-align: center;
}
.store_compare_dropdown {
  width: 280px;
  overflow: hidden;
  background: #fff;
}
.store_compare_dropdown_head {
  padding: 15px;
  border-bottom: 1px solid #edf0f4;
  background: #f7f8fa;
}
.store_compare_dropdown_head > div {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.store_compare_dropdown_head strong { 
  color: #303640; 
  font-size: 14px; 
  font-weight: 900; 
}
.store_compare_dropdown_head span { 
  color: #89929e; 
  font-size: 11px; 
  font-weight: 600; 
}
.store_compare_dropdown_empty,
.store_compare_dropdown_loading {
  padding: 30px 15px;
  color: #929ba7;
  font-size: 12px;
  line-height: 20px;
  font-weight: 600;
  text-align: center;
}
.store_compare_dropdown_list { 
  max-height: 285px; 
  overflow-y: auto; 
}
.store_compare_dropdown_item {
  position: relative;
  display: flex;
  align-items: center;
  border-bottom: 1px solid #edf0f4;
}
.store_compare_dropdown_product {
  position: relative;
  z-index: 1;
  min-width: 0;
  padding: 12px 45px 12px 12px;
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1 1 auto;
}
.store_compare_dropdown_product:hover { 
  background: #f7f9fc; 
}
.store_compare_dropdown_thumb {
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: 7px;
  color: #9aa3af;
  font-size: 9px;
  font-weight: 800;
}
.store_compare_dropdown_thumb img { 
  width: 100%; 
  height: 100%; 
  display: block; 
  object-fit: contain; 
}
.store_compare_dropdown_info {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.store_compare_dropdown_info strong,
.store_compare_dropdown_info span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.store_compare_dropdown_info strong { color: #343a43; font-size: 12px; line-height: 18px; font-weight: 900; }
.store_compare_dropdown_info span { color: #708099; font-size: 10px; line-height: 16px; font-weight: 700; }
.store_compare_menu_remove {
  position: absolute;
  top: 50%;
  right: 12px;
  z-index: 3;
  width: 26px;
  height: 26px;
  padding: 5px;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: #a0a8b3;
  cursor: pointer;
  pointer-events: auto;
  transform: translateY(-50%);
}
.store_compare_menu_remove:hover { background: #edf1f6; color: #4e5968; }
.store_compare_menu_remove svg {
  width: 100%;
  height: 100%;
  display: block;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
}
.store_compare_dropdown_action {
  padding: 12px;
  display: flex;
  gap: 8px;
  background: #fff;
}
.store_compare_dropdown_reset,
.store_compare_dropdown_go {
  min-height: 38px;
  border: 0;
  border-radius: 7px;
  font-family: inherit;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
}
.store_compare_dropdown_reset { width: 90px; background: #e8ebef; color: #56606d; }
.store_compare_dropdown_go { flex: 1 1 auto; background: #164ca0; color: #fff; }
.store_compare_dropdown_go:hover:not(:disabled) { background: #1d5fbe; }
.store_compare_dropdown_go:disabled { background: #d9dde3; color: #9299a3; cursor: default; }
@media only screen and (min-width: 0px) and (max-width: 520px) {
  .store_compare_dropdown { width: min(320px, calc(100vw - 40px)); }
}

/* =========================================================
   다운로드 및 업데이트 - store.html?download=1 통합 모드
========================================================= */
.store_download_content {
  display: none;
}

html.store_download_mode .store_download_content {
  display: block;
}

html.store_download_mode .explore_left,
html.store_download_mode .explore_right > .content_box_all,
html.store_download_mode .product_detail_bg,
html.store_download_mode .product_compare_bg,
html.store_download_mode .store_filter_open,
html.store_download_mode .store_top_search_button,
html.store_download_mode .store_global_search,
html.store_download_mode .store_mobile_search_dropdown {
  display: none !important;
}

html.store_download_mode .explore_right {
  flex: 1 1 auto;
  width: calc(100% - 75px);
  overflow: visible;
  border-radius: 20px 0 20px 0;
  background: #ffffff;
}

html.store_download_mode .store_primary_download_page {
  background: #ffffff;
  color: #164ca0;
  box-shadow: 0 2px 10px rgba(25, 45, 75, .08);
}

html.store_download_mode .store_compare_bar {
  display: none !important;
}

@media only screen and (min-width: 0px) and (max-width: 800px) {
  html.store_download_mode .explore_right {
    width: 100%;
    border-radius: 0 0 20px 20px;
  }

  html.store_download_mode .store_primary_nav {
    border-radius: 0;
  }
}


/* =========================================================
   Nurilab Store - 다운로드 및 업데이트
========================================================= */

.store_download_mode .explore_item {
  min-height: 520px;
}

.store_download_content {
  width: 100%;
  padding: 20px;
  background: #fff;
  border-radius: 20px 0 20px 0;
}

.store_download_head {
  padding: 4px 0 24px;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  border-bottom: 1px solid #e7eaf0;
}

.store_download_head h1 {
  margin: 0 0 8px;
  color: #30343a;
  font-size: 26px;
  line-height: 28px;
  font-weight: 900;
}

.store_download_head p {
  color: #7c8591;
  font-size: 13px;
  line-height: 25px;
}

.store_download_count {
  flex-shrink: 0;
  color: #7c8591;
  font-size: 13px;
  line-height: 25px;
}

.store_download_list {
  width: 100%;
}

.store_download_item {
  min-height: 92px;
  padding: 18px 4px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  border-bottom: 1px solid #e7eaf0;
}

.store_download_product {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.store_download_product_name {
  color: #30343a;
  font-size: 16px;
  line-height: 28px;
  font-weight: 850;
  word-break: keep-all;
}

.store_download_product_category {
  color: #818b98;
  font-size: 12px;
  line-height: 25px;
  font-weight: 600;
}

.store_download_action {
  flex-shrink: 0;
}

.store_download_button {
  padding: 10px 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border-radius: 7px;
  background: #1269c7;
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  box-shadow: 0 4px 12px rgba(18, 105, 199, .16);
  transition: background .16s ease, transform .16s ease, box-shadow .16s ease;
}

.store_download_button:hover {
  background: #0d58aa;
  box-shadow: 0 6px 16px rgba(18, 105, 199, .22);
}

.store_download_button:active {
  transform: translateY(1px);
}

.store_download_button svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.store_download_loading,
.store_download_empty {
  min-height: 250px;
  padding: 60px 20px;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  text-align: center;
}

.store_download_loading {
  display: flex;
  color: #8c95a1;
  font-size: 13px;
  font-weight: 600;
}

.store_download_empty {
  display: flex;
}

.store_download_empty strong {
  margin-bottom: 8px;
  color: #30343a;
  font-size: 16px;
  font-weight: 900;
}

.store_download_empty span {
  color: #8c95a1;
  font-size: 13px;
  line-height: 25px;
}



/* 모바일에서는 아이콘 메뉴를 상단 가로 메뉴로 바꿔 접근 가능하게 유지합니다. */
@media only screen and (min-width: 0px) and (max-width: 800px) {
  .store_download_mode .explore_item {
    flex-direction: column;
    min-height: 0;
  }

  .store_download_content {
    width: 100%;
    padding: 24px 20px 38px;
    border-radius: 0 0 20px 20px;
  }

  .store_download_head {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }

  .store_download_head h1 {
    font-size: 22px;
  }

  .store_download_item {
    min-height: 86px;
    gap: 14px;
  }

}

@media only screen and (min-width: 0px) and (max-width: 520px) {
  .store_download_item {
    align-items: stretch;
    flex-direction: column;
  }

  .store_download_action,
  .store_download_button {
    width: 100%;
  }
}


/* =========================================================
   다운로드 썸네일
========================================================= */
.store_download_product_group {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 16px;
  flex: 1 1 auto;
}

.store_download_thumb {
  width: 72px;
  height: 72px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.store_download_thumb img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
}

.store_download_thumb_placeholder {
  background: linear-gradient(180deg, #f6f8fb 0%, #eef2f7 100%);
}

.store_download_thumb_placeholder svg {
  width: 28px;
  height: 28px;
  fill: none;
  stroke: #98a3b3;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

@media only screen and (min-width: 0px) and (max-width: 800px) {
  .store_download_product_group {
    gap: 12px;
  }

  .store_download_thumb {
    width: 64px;
    height: 64px;
    border-radius: 12px;
  }
}

@media only screen and (min-width: 0px) and (max-width: 520px) {
  .store_download_product_group {
    width: 100%;
  }
}