/* BASIC css start */
/*
    Å׸¶
*/
h1 {
  font-size: var(--hc_logo); 
}

h2 {
  font-size: var(--hc_tit_page); 
}

h3 {
  font-size: var(--hc_bd_xlarge);
}

h4 {
  font-size: var(--hc_bd_large);  
}

h5 {
  font-size: var(--hc_bd_medium);
}

h6 {
  font-size: var(--hc_tit_caption);
}

.hc_bd_xxlarge {
  font-size: var(--hc_bd_xxlarge);
}

/* ·¹À̾ƿô */
.hc_layout_c,
.hc_topfull {
  text-align: center;
}
.hc_layout_l {
  text-align: left;
}
.hc_layout_r {
  text-align: right;
}
.hc_column2 {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
}
.hc_oneThird {
    display: grid;
    grid-template-columns: 3fr 1fr;
    align-items: center;
}
.hc_column3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 4px;
}
.hc_oneThird .hc_btn_long_fill {
    height: 40px;
    line-height: normal;
    box-sizing: border-box;
}
.hc_inline {
  display: inline-flex;
  align-items: center;
}
.hcHiddenPart {
    display : none;
}

/* 
  °£°Ý 
*/
.hc_interval1 {
  margin-bottom: 48px;
}
.hc_interval2 {
  margin-bottom: 28px;
}
.hc_interval3 {
  padding: 1em 0;
}
.hc_normal_line_contents th, .hc_normal_line_contents td {
  padding: 5px 0;
  height: 40px;
  line-height: 40px;
}
.hc_mypage_wrap,
.hc_board_wrap,
.hc_page_contents {
  margin: 10px;
}
.hc_page_contents2 {
  margin: 20px;
}

/* 
  ±âŸ 
*/
.hc_color_point {
  color: var(--hc_color_point);
}
.hc_bold {
  font-weight: var(--hc_mediums);
}
.hc_no_date {
  padding: 4%;
  text-align:center;
}
.hc_no_date_big {
  padding: 5em 0;
  text-align: center;
  border-top: 3px solid var(--hc_dark_color);
  border-bottom: 1px solid var(--hc_color_level2);
}
.hc_icon_new {
  padding: 0 8px;
  color:var(--hc_color_point); 
  /* border:1px solid var(--hc_color_level2); */
}
.hc_headline_checking {
  margin: 0 10px 20px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.hc_check_all {
  font-size: var(--hc_bd_medium);
  text-align: right;
}
.hc_clarification {
  margin: 10px 0 34px;
}
.hc_clarification li {
  list-style-position: inside;
  list-style-type: disc;
}
.hc_login_check {
  font-size: var(--hc_bd_small);
}
.hc_line_start {
  border-top:3px solid var(--hc_dark_color);
}

.hc_md_more_description {
  display: flex;
  justify-content: space-between;
  box-sizing: border-box;
  transition: all 0.6s ease 0s;
  cursor: pointer;
}
.hc_tinny::before {
  content: "¨Õ";
  margin-right: 8px;
}
.hc_full_img img {
  width:100%;
}

/* 
  ŸÀÌƲ 
*/
h2.hc_page_title {
  margin: 20px 0;
  text-align: center;
}
.hc_title_barrel {
  padding: 0 10px 10px;
  word-break: keep-all;
  word-wrap: break-word;
}
.hc_title_barrel h2 {
  text-align: left;
}
.hc_title_barrel p::after {
  content: "";
  display: block;
  margin: 20px 0;
  width: 30px;
  height: 1px;
  background: #000;
}
.hc_title_solid {
  display: inline-block;
  margin-top: 38px;
  padding: 14px 0 15px;
  font-size: var(--hc_bd_large);
  font-weight: var(--hc_regular);
  border-top: 1px solid var(--hc_dark_color);
}
.hc_title_dashed {
  display: inline-block;
  margin-top: 38px;
  padding: 14px 0;
  font-size: var(--hc_bd_large);
  font-weight: var(--hc_regular);
  border-top: 1px dashed var(--hc_dark_color);
}

/* 
  ÀÎDz¹Ú½º
*/
.hc_inputbox_middle {
  width: 274px;
  height: 58px;
}
.hc_inputbox_middle_btn {
  margin-left: 4px;
  width: 118px;
  height: 40px;
  line-height: 40px;
  color: var(--hc_bright_color);
  font-size: var(--hc_bd_large);
  background: var(--hc_dark_color);
  border: 0;
  outline: 0;
  cursor: pointer;
}
.hc_sub_wrap .hc_checking {	
  position: absolute;	
  top: 5px;	
  right: 7px;	
}
.hc_sub_wrap .hc_closing {
  position: absolute;	
  top: 28px;	
  right: 7px;	
}

/* 
  ¹öÆ° 
*/
.hc_btn_wrap {
  margin: 30px auto 0;
  text-align: center;
}
.hc_btn_column_layout {
  margin: 30px 10px 0;
  display: grid;
  gap: 5px;
}
.hc_btn_long_fill,
.hc_btn_long {
  display: block;
  margin: 5px 0;
  padding: 10px;
  text-align: center;
  border: 1px solid var(--hc_dark_color);
}
.hc_btn_medium_fill,
.hc_btn_medium,
.hc_btn_Regular {
  display: inline-block;
  padding: 0 4px;
  border: 1px solid var(--hc_dark_color);
}
.hc_btn_mini_fill,
.hc_btn_mini {
  padding: 0 5px 2px 4px;
  border: 1px solid var(--hc_dark_color);
}
.hc_btn_mini_fill,
.hc_btn_medium_fill,
.hc_btn_long_fill {
  color:var(--hc_bright_color);
  background: var(--hc_dark_color);
}
.hc_btn_small {
  padding: 0 4px;
  border: 1px solid var(--hc_dark_color);
}

.hc_btn_more {
  display: block;
  font-size: var(--hc_bd_large);
  font-weight: var(--hc_mediums);
  text-decoration: underline !important;
  text-underline-offset: 6px;
}

.hc_btn_wrap .hc_column2 {
  gap: 4px;
}
.hc_topfull img,
.hc_thumbnail img {
  width: 100%;
}

.hc_discount_rate {
  margin-left: 14px;
  color: var(--hc_color_point);
}

.hc_md_arrow {
  position: relative;
  right: 2rem;
  display: inline-block;
  width: 1.25rem;
  height: 1.25rem;
}
.hc_md_arrow span {
  top: 0.85rem;
  position: absolute;
  width: 0.75rem;
  height: 0.1rem;
  background-color: #000;
  display: inline-block;
  transition: all 0.2s ease;
}
.hc_md_arrow span:first-of-type {
  left: 0;
  transform: rotate(45deg);
}
.hc_md_arrow span:last-of-type {
  right: 0;
  transform: rotate(-45deg);
}
.hc_md_arrow.active span:first-of-type {
  transform: rotate(-45deg);
}
.hc_md_arrow.active span:last-of-type {
  transform: rotate(45deg);
}


/* °Ô½ÃÆÇ °Ë»ö */
.hc_board_search {
  margin: 20px 0 54px;
  text-align: center;
}
.hc_board_search fieldset {
  display: grid;
  grid-template-columns: 100px auto 70px;
}
.hc_board_search select,
.hc_board_search input {
  height: 40px;
}
.hc_board_search select[name="search_type"] {
  margin-right: 4px;
}
.hc_board_search fieldset a {
  line-height: 40px;
  vertical-align: top;
  color: var(--hc_bright_color);
  border: 0;
  background: var(--hc_dark_color);
}

/* °Ô½ÃÆÇ ¸®½ºÆ® */
.hc_border_notice_list li {
  display: grid;
  grid-template-columns: 54px auto;
  padding: 15px 0;
  border-bottom: 1px solid var(--hc_color_level2);
}
.hc_border_notice_list mark {
  display: inline-block;
  margin-right: 10px;
  padding: 0 4px;
  width: 30px;
  height: 24px;
  line-height: 24px;
  color: var(--hc_bright_color);
  font-size: 12px;
  text-align: center;
  background: var(--hc_dark_color);
}
.hc_border_normal_list nobr,
.hc_border_notice_list nobr {
  margin-left: 51px;
}
.hc_border_normal_list li {
  padding: 15px 0;
  border-bottom: 1px solid var(--hc_color_level2);
}
.hc_page_board_qna .hc_border_normal_list nobr {
  display: grid;
  grid-template-columns: 30px auto;
  align-content: center;
  align-items: center;
}
.hc_ellipsis {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.hc_boardlist_icon {
  vertical-align: baseline;
  margin-right: 10px;
}

/* °Ô½ÃÆÇ º¸±â > Çصå¶óÀÎ */
.hc_board_headline {
  text-align: center;
}
.hc_board_headline h3 {
  margin-bottom: 30px;
  word-break: keep-all;
  word-wrap: break-word;
}
.hc_board_date {
  color: var(--hc_color_level2);
}
.hc_reply_write {
  padding: 20px 0;
  border-top: 1px solid var(--hc_dark_color);
  border-bottom: 1px solid var(--hc_dark_color);
}
.hc_board_list_icon {
  display: inline-block;
  margin-top: 6px;
  width: 38px;
  text-align: center;
}

/* Å×À̺í Çü½Ä */
.hc_table_list {
  border-top: 3px solid var(--hc_dark_color);
  margin-bottom:54px;
}
.hc_table_list th, .hc_table_list td {
  padding: 5px 0;
  height: 40px;
  font-weight: normal;
  text-align: left;
  vertical-align: middle;
  border-bottom: 1px solid var(--hc_color_level2);
}

#mainLogo a {
    font-family: var(--fontfamily1);
    font-weight: var(--hc_heavy);
}

.hcFontBold {
    font-weight: bold;
}



/* ***********************************

    »ó´Ü 
    
 * ***********************************/
 
.hc_notice_top {
      display: none;
}
.hc_entire {
    margin-top : 0px !important;
}



 
/* »ó´Ü ÅؽºÆ® ¹è³Ê ³ëÃâÇÏ°í ½ÍÀ»¶§ ÁÖ¼® ÇØÁ¦ start */


/*
    
.hc_notice_top {
       display: block;
}
.hc_entire {
    margin-top : 91px;
}
   
*/


/* »ó´Ü ÅؽºÆ® ¹è³Ê ³ëÃâÇÏ°í ½ÍÀ»¶§ ÁÖ¼® ÇØÁ¦ end */
 
 

 
#hc-header-wrap {
    position: fixed;
    top: 0;
    z-index: 9999;
    width: 100%;    
}

/* »ó´Ü ÅؽºÆ® ¹è³Ê */
.hc_notice_top {  
    padding: 1rem;
    text-align: center;
    color: var(--hc_bright_color);
    background: var(--hc_dark_color);
    
}

.hc_notice_top a {
    color: var(--hc_bright_color);
}

header {  
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 1rem; /* paddingÀ» Á¶Á¤ÇÏ¿© °£°Ý Á¶Àý */
    /* width: 100%; 100% ³Êºñ·Î ¼³Á¤ */
    height: 5rem;
    background: transparent;
    box-sizing: border-box;
}

.hc_entire {
    position: relative;
    /*margin-top: 8rem; /* header ³ôÀ̸¸Å­ ¸¶ÁøÀ» ÁÝ´Ï´Ù */
}

#hc-header-wrap .hc-right-wrap {
    display: flex;
    align-items: center;
    padding-top: 0.5rem;
}

#hc-header-wrap .hc-center-wrap {
    text-align: center;
    flex-grow: 1;
}

header h1 {
    font-size: var(--hc_bd_xxlarge);
}

header #hc_hamburger {
    /*
    left: 10px;
    */
}

header .hc_head_search {
    position: absolute;
    right: 68px;
}

header .hc_head_mypage {
    position: absolute;
    right: 40px;
}

header .hc_head_cart {
    position: absolute;
    right: 10px;
}

header .hc_incart {
    position: absolute;
    top: 1px;
    right: -6px;
    z-index:100;
    width: 16px;
    height: 16px;
    line-height: 16px;
    font-size: var(--hc_bd_small);
    text-align: center;
    background: var(--hc_color_point);
    border-radius: 16px;
}

/*Çܹö°Å ¸Þ´º*/
.hamburger_item {
  display: block;
  float: left;
  width: 50%;
  height: 36px;
  line-height: 36px;
  text-align: center;
  border: 1px solid var(--hc_dark_color);
  box-sizing: border-box;
  cursor: pointer;
  transition: all 0.2s ease;
}
input[name=hamburger_item] {
  display: none;
}
.hamburger_content {
  display: none;
  padding-top: 40px;
  clear: both;
  overflow: hidden;
}
#member:checked ~ #member_content,
#category:checked ~ #category_content {
  display: block;
  overflow:auto;
  height: calc(100vh - 160px);
}
.hc_hamburger_tabs input:checked + .hamburger_item {
  /*color: var(--hc_dark_color);*/
  color: var(--hc_bright_color);
  background: var(--hc_dark_color);
}
#hc_hamburger .line{
  width: 20px;
  height: 2px;
  background-color: var(--hc_dark_color);
  display: block;
  margin: 4px auto;
  -webkit-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
#hc_hamburger:hover{
  cursor: pointer;
}
#hc_hamburger.is-active .line:nth-child(2){
  opacity: 0;
}
#hc_hamburger.is-active .line:nth-child(1){
  -webkit-transform: translateY(7px) rotate(45deg);
  -ms-transform: translateY(7px) rotate(45deg);
  -o-transform: translateY(7px) rotate(45deg);
  transform: translateY(7px) rotate(45deg);
}
#hc_hamburger.is-active .line:nth-child(3){
  -webkit-transform: translateY(-6px) rotate(-45deg);
  -ms-transform: translateY(-6px) rotate(-45deg);
  -o-transform: translateY(-6px) rotate(-45deg);
  transform: translateY(-6px) rotate(-45deg);
}

/* Çܹö°Å & ¸¶ÀÌÆäÀÌÁö ¸Þ´º */
.hc_hamburger_menu.open {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
}
.hc_hamburger_menu {
    position: fixed;
    top:0;
    left: 0;
    z-index: 999;
    padding: 20px;
    width: 100%;
    height: 100vh;
    line-height: 2;
    background-color: var(--hc_bright_color);
    box-sizing: border-box;
    visibility: hidden;
    transition: all 0.5s;
    opacity: 0;
    pointer-events: none;    
    padding-top : 50px;
}

.hc_mypage_menu li,
.hc_hamburger_menu li {
    cursor: pointer;
}

.hc_mypage_menu nav,
.hc_hamburger_menu nav {
    position: relative;
}
.hc_hamburger_menu_login,
.hc_hamburger_menu_category {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100vh;
    background: var(--hc_bright_color);
}
.hc_mypage_menu ul,
.hc_hamburger_menu ul {
    margin-bottom: 40px;
}
.hc_mypage_menu ul a p,
.hc_hamburger_menu ul a p {
    margin-left: 14px;
}
.hc_mypage_menu .hc_submenu,
.hc_hamburger_menu .hc_submenu {
    margin-bottom: 40px;
}
.hc_hamburger_menu .hc_submenu a {
    margin-left: 14px;
    display: block;
}
.hc_main_menu {
    cursor: pointer;
}
.hc_main_menu:hover {
    opacity: 0.7;
}
.hc_menu_content {
    overflow: hidden;
    max-height: 0;
    transition: all 0.3s ease-in-out;
    overflow: hidden;
}
.hc_menu_state:checked ~ .hc_menu_content {
    max-height: 500px;
}
.hc_mypage_menu h4 {
    margin-bottom: 48px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 0;
    color: var(--hc_color_point);
    font-size: var(--hc_bd_medium);
    font-weight: var(--hc_regular);
    line-height: 1.7;
    border-bottom: 1px solid var(--hc_dark_color);
}
.hc_mypage_menu h4 span a {
    display: inline-block;
    width: 90px;
    padding: 7px 0;
    color: var(--hc_bright_color);
    text-align: center;
    background: var(--hc_dark_color);
}
.hc_mypage_menu input {
    position: absolute;
    opacity: 0;
    z-index: -1;
}
.hc_mypage_menu .tabs {
    overflow: hidden;
}
.hc_mypage_menu .tab {
    width: 100%;
    color: var(--hc_dark_color);
    overflow: hidden;
}
.hc_mypage_menu .tab-label {
    display: flex;
    justify-content: space-between;
    line-height: 3;
    cursor: pointer;
}
.hc_mypage_menu .tab-label:hover {
    background: var(--hc_bright_color);
}
.hc_mypage_menu .tab-label::after {
    content: ">";
    width: 1em;
    height: 1em;
    text-align: center;
    transition: all 0.3s ease-in-out;  
}
.hc_mypage_menu .tab-content {
    max-height: 0;
    margin-left:14px;
    color: var(--hc_dark_color);
    line-height: 2.5;
    background: var(--hc_bright_color);
    transition: all 0.3s ease-in-out;  
}
.hc_mypage_menu .tab-close {
    display: flex;
    justify-content: flex-end;
    background: var(--hc_bright_color);
    cursor: pointer;
}
.hc_mypage_menu .tab-close:hover {
    background: var(--hc_bright_color);
}
.hc_mypage_menu input:checked + .tab-label {
    background: var(--hc_bright_color);
}
.hc_mypage_menu input:checked + .tab-label::after {
    transform: rotate(90deg);
}
.hc_mypage_menu input:checked ~ .tab-content {
    max-height: 100vh;
}

.hncok-main-wrap {
    margin-top:0rem;
}


/* BASIC css end */