@charset "utf-8";
/* CSS Document */
/* ------------------------------------------------------------
 * Name      :web_layout.css
 * Desc      :page layout
 * Created   :
 * Updated   :
 ------------------------------------------------------------ */
body.fixe {overflow:hidden; }
.m_gnb .sub_menu {display:none !important;}
.web_dis {display:block;}
.m {display:none;}
.search_btn {display:none; position:absolute; right:65px; top:26px;}


.top_banner {position: relative;}
.top_banner img {position: relative; left: 50%; top: 0px; transform:translateX(-50%)}
.h_position {display: none;}
/* down */
/* #header.down {position:fixed; left:0px; top:0px;}

#wrap.down .h_position {display: block; height: 155px;}
 */

/* header */
#header {width:100%; z-index:9999; box-sizing:border-box; transition:all 0.2s 0s ease-in-out; background:#fff;  position: relative}
#header:after {display: block; content:""; width: 100%; height: 1px; background:#e8e8e8; position: absolute; left: 0px; bottom: 0px;}

.in_header {max-width:1200px; margin:0 auto; width:100%; height:80px; box-sizing:border-box; margin:0 auto; position:relative; z-index:9; color:#000;}
#header span.logo {display:inline-block; width:auto; position:absolute; left:0%; transform: translateY(-50%); top:50%; overflow:hidden; z-index:10; padding-bottom:1px;}
#header span.logo a {display:block; overflow:hidden; height:100%; outline:none;}


.search_wrap {max-width:233px; box-sizing: border-box; padding-right: 40px; box-sizing: border-box; border:1px solid #ebebeb; border-radius:4px; width: 100%; overflow: hidden; background: #f4f4f4; position: relative;}
.search_wrap .input {flex: 1; width: 100%; outline: none; background: none; font-size: 14px; border: none; height:30px; line-height: 30px;}
/* .search_wrap button {outline: none; border: none; width:26px; height: 26px; display: flex; justify-content: center; align-items: center; text-align: center; background:#525252; border-radius:100%; font-size:36px; color: #fff; cursor: pointer; position: absolute; right:5px; top: 50%; transform: translateY(-50%)}
 */
.search_wrap button {outline: none; border: none; width:35px; height: 100%; display: flex; justify-content: center; align-items: center; text-align: center; background:url(../img/common/search.gif) no-repeat center center #fff; cursor: pointer; position: absolute; right:0px; top:0%;}
.top_menu_wrap {border-bottom: 1px solid #ccc; background: #fff;}
.top_menu_wrap .inner {display: flex; justify-content: flex-end; align-items: center; padding:8px 0px;}
.top_menu_wrap .inner .txt {margin-right: auto; font-size:18px; line-height: 1.3em; color: #000;}

.top_menu {display: flex; flex-wrap: wrap; align-items: center; padding-right: 20px;}
.top_menu > li {margin-left:10px; padding-left:10px; position:relative; line-height:24px; font-size:14px; }
.top_menu > li:before {display:block; content:""; width:1px; height:12px; background:#e8e8e8; position:absolute; left:0px; top:50%; margin-top:-6px;}
.top_menu > li a {color:#222; font-weight:300; font-size:13px; }

.top_menu > li:first-child:before {display:none;}



/* wrap */
#contents_area img {max-width:100%}
#wrap {width:100%; overflow:hidden; margin:0 auto;}
#inner_wrap {max-width:100%; margin:0 auto; position:relative; }


.inner {max-width:1200px; margin:0 auto;}


.bg_wrap {background:#f2f2f2}



.w_gnb {padding:0px 0px 0px 250px;}
.w_gnb .gnb {max-width:1200px; margin: 0 auto; box-sizing: border-box; position: relative; justify-content:space-between; display: flex; flex-wrap: wrap; align-items: center}
.w_gnb .gnb .event_btn {}
.w_gnb .gnb .event_btn > a {display: flex; flex-wrap: wrap; justify-content: center; align-items: center; height: 46px; line-height: 1.3em; background: #5ddfde; border-radius:60px; padding: 0px 20px; color: #fff; font-size: 17px; box-sizing: border-box;}



.w_gnb .gnb > ul {margin:0 auto; flex: 1; justify-content:space-between; display: flex; flex-wrap: wrap; padding-right:10px;}
.w_gnb .gnb > ul > li {width:auto !important;text-align:center; padding: 0px 0px; position:relative; transition:all 0.2s 0s ease-in-out; }
.w_gnb .gnb > ul > li > a {display:block; color:#333333;}
.w_gnb .gnb > ul > li > a > span {display:inline-block; font-size:20px; line-height:80px; height:80px; color:#222222; font-weight:600; transition:all 0.2s 0s ease-in-out; box-sizing: border-box; }


.w_gnb .sub_menu  {position:absolute; left:50%; transform:translateX(-50%); -webkit-transform:translateX(-50%); width:190px; box-sizing:border-box; overflow:hidden; top:100%; display:none; padding:0px 0px; border:1px solid #000; background:#fff; padding:10px 0px; display:none; z-index: 99 }
.w_gnb .sub_menu > li {padding:3px 3px 3px 3px; letter-spacing:-0.5px;}
.w_gnb .sub_menu > li > a {display:block; font-size:14px; text-align:center; font-weight:400; color:#333333; padding:3px 0px; line-height:20px; transition:all 0.2s 0s ease-in-out;}
.w_gnb .sub_menu > li > a:hover {color:#000; background: #ffefda}
.w_gnb .three_depth { display:none;}
.w_gnb .three_depth { display:none;}





/* visual */
#section1 { padding:0px;  border-top: 1px solid #000000}

.main_visual {width: 100%; margin:0 auto; overflow: hidden; position: relative; z-index: 2}
.main_visual .bxslider > li {background-size:cover !important; }
.main_visual .v_frame {max-width:1200px; margin: 0 auto; position: relative;}
.main_visual .v_frame .vf {display: block; padding-bottom: 50%; position: relative;}

.main_visual .bxslider > li a {display:block;}
.main_visual .bxslider > li img {max-width:100%;position: relative; margin:0px !important;  left: 50%; top: 0px; transform:translateX(-50%)}
.main_visual .bxslider > li .mobile {display:none}


.main_visual .v_bt {display:block; position:absolute; top:50%; transform:translateY(-50%); z-index:99;}
.main_visual .v_bt > a {display:block; padding:9px 10px 10px 10px;}
.main_visual #visual_r1 {right: 50%; margin-right: -850px;}
.main_visual #visual_l1 {left: 50%; margin-left: -850px;}




.main_visual .bx-controls {text-align:center; position:absolute; left:50%; transform:translateX(-50%); bottom:30px; width:100%; max-width:1200px; box-sizing:border-box; z-index:99;}
.main_visual .bx-wrapper .bx-pager {position:relative; width:auto !important; left:auto; bottom:auto; display:inline-block; vertical-align:top; padding: 0px; z-index:99;}
.main_visual .bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto {position:relative; bottom:auto; display:inline-block; right:auto; width:24px; height:18px; text-align:center; padding-top:10px;}
.main_visual .bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto {right:0; z-index:99;}
.main_visual .bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto > div > a {text-indent:1000000%;}
.main_visual .bx-wrapper .bx-pager.bx-default-pager .bx-pager-item {vertical-align:top;}
.main_visual .bx-wrapper .bx-pager.bx-default-pager a {width:200px; height:10px; margin:0; background:#666666; border:none; -moz-border-radius:0px;  -webkit-border-radius:0px; border-radius:0px; box-sizing:border-box; position:relative; opacity:1;}

.main_visual .bx-wrapper .bx-pager.bx-default-pager a:hover {opacity:1; background:#f40405;}
.main_visual .bx-wrapper .bx-pager.bx-default-pager a.active {opacity:1;  background:#f40405;}
.main_visual .bx-wrapper .bx-controls-auto .active {display:none;}

.quick_wrap {transition:all 0.3s 0s ease-in-out; z-index:9; position:absolute; margin-left: -220px; top: 0px;}
.quick_wrap > ul {transition:all 0.3s 0s ease-in-out;}
.quick_wrap > ul > li {margin-top:10px;}
.quick_wrap > ul > li:first-child {margin-top:0px;}
.quick_wrap.fix {top:133px; position: fixed;}

#section2 .inner {position: relative;}
/*

@media screen and (min-width:1200px) {
	.quick_wrap {transform:translate(0px, -50%);}
}


@media screen and (max-width:1200px) {
	.quick_wrap {transform:translate(-165px, -50%);}

}
*/




/* section */
.section {padding:70px 0px; font-size:18px; line-height:140%; word-break:keep-all; color:#333333; font-weight:400; }
.inner {max-width: 1200px; margin: 0 auto;}




.m_tit_wrap {position: relative; margin-bottom:10px; text-align: center}
.m_tit_wrap:after {display: block; content: ""; width: 100%; height:2px; background:#282828; position: absolute; left: 0px; top: 50%; margin-top: -1px;}
.m_tit_wrap .m_tit {background: #fff; position: relative; padding: 0px 20px; display: inline-block;}

.m_tit {padding:0px 0px 0px 0px; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; color:#282828; text-align:center; font-size:33px; line-height:130%; font-weight:800; z-index:2; position:relative}
.m_tit {padding:0px 0px 0px 0px; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; color:#282828; text-align:center; font-size:33px; line-height:130%; font-weight:800; z-index:2; position:relative}

.m_tit_txt {margin:0px 0px 30px 0px; word-break:keep-all; color:#333; font-weight:300; font-size:20px; text-align:center; line-height:150%; display:block;}



.product_list > ul.three {margin: -20px;}
.product_list > ul.three > li {width: 24.99%; padding: 20px;}

.product_list > ul {display: flex; flex-wrap: wrap; margin: -7px;}
.product_list > ul > li {width: 25%; box-sizing: border-box; padding:7px;}
.product_list .box {overflow: hidden; transition:all 0.3s 0s ease-in-out; display: block; height: 100%; box-sizing: border-box; transition:all 0.3s 0s ease-in-out;}
.product_list .box:hover {border: 1px solid #FF0000;}
.product_list .box .pic {display: block; padding-bottom: 100%; overflow: hidden; position: relative; border:2px solid #f8f8f8; border-radius:30px; background: #fff; transition:all 0.3s 0s ease-in-out;}
.product_list .box .pic > img {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); max-width: 100%; max-height: 100%; }
.product_list .box:hover .pic {border-color:#ff4660; }
.product_list .box .info {position: relative; margin-top:10px; padding:20px 0px 0px 0px;}
.product_list .box .info .flag_wrap {display: flex; flex-wrap: wrap; position: relative; margin: 0px -20px 30px -20px; padding-left:5px;}
.product_list .box .info .flag_wrap:before {display: block; content: ""; opacity: 0.6; width: 100%; height: 1px; background: #ccc; position: absolute; left: 0px; top: 50%;}
.product_list .box .info .flag_wrap .flag {display:block; color: #fff; min-width: 63px; line-height:32px; height:29px; color: #fff; font-size:16px; border-radius:5px; padding: 0px 5px; box-sizing: border-box; text-align: center; position: relative; margin-left:8px;}
.product_list .box .info .flag_wrap .flag:first-child {margin-left: 0px;}
.product_list .box .info .prd_tit {margin-bottom:5px;}
.product_list .box .info .prd_tit .model {display:block; color: #666666; font-size: 14px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}
.product_list .box .info .name {font-size:20px; text-align: center; overflow: hidden; /*text-overflow: ellipsis; overflow: hidden;*/ white-space: nowrap; color: #000; text-align: center; line-height: 1.3em; font-weight:600; margin-bottom:5px;}
.product_list .box .info .sale_wrap {display: flex; flex-wrap: wrap; justify-content:center; align-items: center; font-size: 16px;  padding: 10px 0px 5px 0px;}
.product_list .box .info .sale_wrap .arrow {padding: 0px 5px;}
.product_list .box .info .sale_wrap .line {text-decoration: line-through}
.product_list .box .info .sale_wrap .won > strong { font-size: 1.15em;}
.product_list .box .info .place {font-size:20px; text-align: center; color: #000;  font-size:20px; color: #000; padding: 3px 0px; font-weight: 300;}
.product_list .box .info .place > strong {font-weight:600; font-size: 1.3em; color: #ff4660; }
.product_list .box .info .bt {display: flex; width: 150px; height: 53px; border:1px solid #ccc; border-radius:10px; justify-content: center; align-items: center; font-size: 17px; margin: 10px auto; box-sizing: border-box;transition:all 0.3s 0s ease-in-out; }
.product_list .box:hover .info .bt {border-color:#ff4660; background: #ff4660; color: #fff;}

.product_list.st2 > ul > li > a {border:1px solid #eee; border-radius:10px;}
.product_list.st2 .box .pic_w {max-width:230px; padding-top:30px;margin:0 auto;}
.product_list.st2 .box .pic {border:none;}
.product_list.st2 .box .info {padding:0px;}
.product_list.st2 .box .dc {text-align:center; margin-bottom:10px; padding-top:2em; color:#000; font-weight:300;}
.product_list.st2 .box .info .place .sale {text-decoration: line-through; font-size:0.95em;}
.product_list.st2 .box .info .bt {width: fit-content; height:auto; border:none; border-radius:0px; font-size: 17px; margin:20px auto; border-bottom:1px solid #000; color:#000; font-size:15px; font-weight:700;}
.product_list.st2 .box:hover .info .bt {background:none; border-color:#000; color:#000}



.prd_tab_area img {max-width:100%}

#section4 {position: relative; padding-top:30px;}
#section4:before {display: block; content: ""; width: 100%; height:280px; background:#7592ff; position: absolute; left: 0px; top:0%;}
#section4 .inner {display: flex; flex-wrap: wrap; position: relative; align-items: flex-start}
#section4 .inner .tit_area {width: 220px; color: #fff; font-size:26px; font-weight:100; line-height: 1.3em; padding-bottom: 40px; background: url(../img/main/arrow.gif) no-repeat left bottom}
#section4 .inner .tit_area > h3 {width: 220px; color: #fff; font-size: 1.3em; font-weight: 800; line-height: 1.3em; }
.main_banner {display: flex; flex-wrap: wrap; justify-content:space-between; margin: -10px; padding-top:30px; flex: 1;}
.main_banner > li {width:33.333333%; box-sizing: border-box; padding: 10px;}
.main_banner > li > a {display: block; overflow: hidden; border-radius:30px; box-shadow: 0px 0px 10px rgba(0, 0, 0, 20%)}
.main_banner > li > a img {max-width: 100%;}




.main_customer {display: flex; flex-wrap: wrap; justify-content: space-between}
.main_customer .box { width: 230px;}
.main_customer .box > h3 {color: #222222; font-size: 26px; line-height: 140%; font-weight: 600; padding-bottom:15px;}
.main_customer .box > h3 .eng {font-size: 16px; display: block; color: #999999; line-height: 140%; font-weight: 400;}
.main_customer .center .tel {letter-spacing: -1px; font-size:42px; color: #f34747; line-height:120%; font-weight:700;}
.main_customer .center .time {font-size: 15px; color: #333333; line-height:140%; font-weight:300;}
.main_customer .center .time > li {padding-top: 5px;}
.main_customer .bank dt {padding-top: 10px;}
.main_customer .bank .number {font-size:16px; color: #999999; line-height:140%; padding-top: 5px;}
.main_customer .bank .number > strong {font-size:22px; color: #000000; line-height:140%; font-weight:700; display: block;}

.customer_board {position: relative; display: flex; flex-wrap: wrap; justify-content:space-between}
.customer_board .bx-viewport {height:100% !important}

.customer_board .box {width:50%; box-sizing: border-box; padding:20px 10px; background: #fff;}
.customer_board .box > h3 {color: #222222; font-size:26px; display: flex; align-items: center; font-weight: 600; padding-bottom: 5px;}
.customer_board .box > h3 .ico {padding-left:8px;}
.customer_board .box > h3 .ico img{width:30px;}

.customer_board .box .board {padding: 10px; border: 1px solid #ccc; border-radius:10px; height:300px; overflow: hidden; box-sizing: border-box}
.customer_board .box .board ul > li {padding-bottom: 20px; margin-bottom: 20px; border-bottom:1px solid #ccc; }
.customer_board .box .board ul > li:last-child {margin-bottom:0px; border: none;}
.customer_board .box .board ul > li > a {color: #333333;}
.customer_board .box .board ul > li .subject {display: flex; flex-wrap: nowrap; align-items: center;}
.customer_board .box .board ul > li .txt_t {font-size:18px; color: #000; font-weight: 600; line-height: 1.3em;}
.customer_board .box .board ul > li .star {color: #ea0000; padding-left: 20px; font-size: 14px;}
.customer_board .box .board ul > li .txt_s {font-size: 14px; color: #333; line-height: 1.3em; margin-top: 10px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-word; height:2.6em; font-weight: 100;}
.customer_board .box .board .flex {display: flex; align-items: center;}
.customer_board .box .board .flex > li {box-sizing: border-box; border: none; padding: 0px 3px; margin: 0px; font-size: 13px;}
.customer_board .box .board .flex > li:nth-child(1) {width: 20%;}
.customer_board .box .board .flex > li:nth-child(2) {width: 15%;}
.customer_board .box .board .flex > li:nth-child(3) {width: 25%;}
.customer_board .box .board .flex > li:nth-child(3) {width: 25%;}
.customer_board .box .board .flex > li:nth-child(4) {flex: 1}
.customer_board .box .board .flex > li .type1 {display: inline-flex; justify-content: center; align-items: center; padding: 0px 10px; border-radius:60px; height:36px; background: #000000; color: #fff;}
.customer_board .box .board .flex > li .type2 {display: inline-flex; justify-content: center; align-items: center; padding: 0px 10px; border-radius:60px; height:36px; background: #f64c70; color: #fff;}

#section5 .banner {display: flex; flex-wrap: wrap; margin: -10px; justify-content: space-between}
#section5 .banner > li {padding: 10px; width:50%; box-sizing:border-box;}


.main_customer .quick {flex: 1; max-width: 700px; margin: 0 auto; border: 1px solid #e0e0e0; min-height: 178px; display: flex; flex-wrap: wrap; align-items: center; justify-self: center;}
.main_customer .quick > ul {width: 100%; display: flex; flex-wrap: wrap; justify-content: space-around; align-items: center;}
.main_customer .quick > ul > li {padding: 5px;}
.main_customer .quick > ul > li > a {display: block; text-align: center}
.main_customer .quick > ul > li > a > span {display: block; color: #222222; font-size: 15.5px; line-height: 130%; padding-top: 10px; }

#section5 {padding-top: 20px;}

#section6 {padding: 0px; border-top:1px solid #e4e4e4; }

.main_customer {display: flex; flex-wrap: wrap; margin: 0px -10px; padding: 15px 0px;}
.main_customer > dl {width: 50%; box-sizing: border-box; padding: 10px; height: 66px; padding-right: 80px; position: relative;}
.main_customer > dl:nth-child(2) {border-left:1px solid #e4e4e4;}
.main_customer > dl {display: flex; align-items: flex-start}
.main_customer > dl > dt {position: relative; color: #333; font-size:17px; width: 125px; position: relative; text-align: center; align-self: center;}
.main_customer > dl > dt:After {display: block; content: ""; width: 1px; height: 20px; background: #e4e4e4; position: absolute; right: 0px; top: 50%; transform: translateY(-50%)}
.main_customer > dl > dd {flex: 1; overflow: hidden}
.main_customer > dl > dd > ul {padding-left:20px;}
.main_customer > dl > dd > ul > li {padding-top: 3px; line-height: 1.3em;}
.main_customer > dl > dd > ul > li a {color:#000; font-size: 13px; font-weight: 100; display: block; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}
.main_customer > dl > dd.more {position: absolute; right:20px; top: 50%; transform: translateY(-50%);}
.main_customer > dl > dd.more > a {display: inline-block; border: 1px solid #e4e4e4; font-size: 12px; border-radius:4px; background: #fff; padding: 0px 5px; }

.footer_logos {display: flex; flex-wrap: wrap; justify-content: space-between; padding:15px 0px;}
.footer_logos > ul {display: flex; flex-wrap: wrap; margin: 0px -8px;}
.footer_logos > ul > li {padding: 0px 8px; font-family:dotum; font-size: 12px;}
.footer_logos > ul.logos > li {display:flex; align-items: center;}
.footer_logos > ul.logos > li .ico {padding-right: 10px;}



/* footer */
#footerW {clear:both; padding:0px 0px 70px 0px; background:#f8f8f8; box-sizing:border-box; margin:0 auto; position:relative;  }

#footerW.z_over {z-index:101; position:relative;}

#footer { position:relative; max-width:1200px; display: flex; flex-wrap: wrap; margin:0 auto; z-index: 2; color: #b9b8bd; }
#footer a {color: #b9b8bd; }
#footer .go_top {position:absolute; right:0px; top:-67px}
#footer .sns {position:absolute; right:180px; top:-67px}
#footer .box_wrap {box-sizing: border-box; display: flex; flex-wrap: wrap; width: 100%;}
#footer .box_wrap .box {width:32%; font-family: 'Noto Sans'; font-size: 13px; color: #797979; box-sizing: border-box; padding:20px 10px; border-left:1px solid #ccc; }
#footer .box_wrap .info {width:36%; font-family: 'Noto Sans'; font-size: 13px; color: #797979; box-sizing: border-box; padding:20px 10px; border-left:1px solid #ccc; }
#footer .box_wrap .info .navi {display: flex; flex-wrap: wrap; margin: 0px -10px; padding-bottom: 30px;}
#footer .box_wrap .info .navi > li {padding: 0px 10px;}
#footer .box_wrap .info .navi > li > a {color: #000; font-weight: 400;}
#footer .box_wrap .info > dl > dt {color: #000; font-weight: 300; padding-bottom: 25px;}
#footer .box_wrap .info > dl > dd {line-height: 1.4em; padding-top:5px;}
#footer .box_wrap .box > h3 {color: #000; font-size: 17px;}
#footer .box_wrap .box > h3:after {display: block; content: ""; width: 30px; height: 1px; background: #000; margin:20px 0px 30px 0px;}
#footer .box_wrap .box > h3:after {display: block; content: ""; width: 30px; height: 1px; background: #000; margin:20px 0px 30px 0px;}
#footer .box_wrap .box .tel {font-weight: 600; color: #999; line-height: 1.3em; padding-bottom: 30px; font-size: 25px;}
#footer .box_wrap .box .txt_a {font-size: 14px; line-height: 1.5em;}
#footer .box_wrap .box .txt_b {font-size: 15px; line-height: 1.5em; color: #000;}
#footer .box_wrap .center {padding-left: 30px;}




#footer .addressW {width: 50%; box-sizing: border-box; padding-left:65px; border-left:1px solid #757575; color: #a6a5a5; font-size: 15px; line-height: 1.5em; font-weight:200; letter-spacing: -0.3px; }
#footer .addressW a {color: #a6a5a5}
#footer .addressW .tag {font-size:12px; color: #7f7f7e;}


#footer .footer_txt_product{margin-top:20px; margin-bottom:20px;padding:10px;font-size:12px;}



#content {width:100%; max-width:1200px; margin:0 auto; padding:30px 0px;}
#content:after {clear:both; content:""; display:block;}


/*atab*/
.atab { margin-bottom:40px; padding-top:10px; display: flex; flex-wrap: wrap;}
.atab:after {clear:both; display:block; content:"";}
.atab li {flex: 1;}
.atab li a {display: flex; flex-wrap: wrap; align-items: center; justify-content: center; width:100%; height:68px; background:#fff; line-height:130%; padding:0px 0px; text-align:center; color:#999999; box-sizing:border-box; border:1px solid #cccccc; font-size:1.15em; font-weight:400; background:#fff}
.atab li.on a {font-weight:500; border:1px solid #fa6f8c !important; background:#fa6f8c; color:#fff;}


.btab {display:flex; flex-wrap:wrap; margin:+5px -10px;}
.btab > li {padding:5px 10px;}
.btab > li > a {display:block; color:#666666; font-size:1.2em; line-height:140%; padding-top:10px; position:relative;}
.btab > li > a:before {display:block; content:""; width:0px; height:0px; background:#966a52; border-radius:100%; position:absolute; left:50%; top:0px; margin-left:-3px;transition:all 0.4s 0s ease-in-out;}
.btab > li.on > a {color:#966a52; font-weight:600;}
.btab > li.on > a:before {width:6px; height:6px; }



.of_hi .fl50 {float:left; width:49%;}
.of_hi .fr50 {float:right; width:49%;}
.graybox { background:#cccccc; padding:10px;}
.no_flash { display:none;}

/* 레이어팝 */
#black {display:none; background-color:#000; display:none; height:100%; left:0; opacity:0.6; filter:alpha(opacity=60); position:fixed; top:0; width:100%; z-index:9999;}
.layerPop {-webkit-overflow-scrolling:touch; overflow-y:auto; width:100%; position:fixed; left:0; right:0; top:0; bottom:0; z-index:99999; background:url(../img/common/png_70.png) repeat left top;/*background:#d7d7d7;*/ zoom:1;}

.layerPop_inner {width:100%; height:100%; padding:15px; display:table; table-layout: fixed; position:relative; margin:0 auto; box-sizing:border-box;}
.pop_wrap {display:table-cell; vertical-align:middle; position:relative;}
.pop_wrap .pop_body {padding:15px 20px; font-size:15px; background:#fff; word-break:keep-all;}
.pop_wrap .pop_body .btns {padding-top:20px;}
.pop_wrap .popup_scroll {max-height:700px; overflow-y:auto;}
.pop_wrap .pop_wrap_in {width:100%; margin:0 auto; border-radius:20px; overflow:hidden;}
.pop_wrap .x_btn { font-size: 0px; width:30px; height:30px; position:absolute; right:20px; top:50%; transform:translateY(-50%); -webkit-transform:translateY(-50%); display:inline-block; cursor:pointer; background:none}
.pop_wrap .x_btn:after {display: block; content: ""; width: 100%; height:3px; background: #fff; transform-origin:center; transform: translateY(-50%) rotate(45deg); position: absolute; top: 50%;}
.pop_wrap .x_btn:before {display: block; content: ""; width: 100%; height:3px; background: #fff; transform-origin:center; transform: translateY(-50%) rotate(135deg); position: absolute; top: 50%;}

.pop_wrap .pop_head {background:#000; position:relative;}
.pop_wrap .pop_head .title {font-size:26px; line-height:150%;  color:#fff; padding:20px 50px 20px 25px; text-align:left; font-weight:600;}
.pop_wrap .pop_head .title.tc {padding-left:50px;}
.pop_wrap .pop_head .s_txt {font-size:14px; line-height:14px;  color:#646464; text-align:center; padding:0px 0px 30px 0px;}
.pop_wrap .x_btn2 {position:absolute; right:0px; bottom:0px; }
.pop_wrap .x_btn3 {position:absolute; right:0px; bottom:-42px; }
.pop_body .btn-tc {padding:30px 0px 0px 0px; margin-top:25px;}
.pop_body .btn-tc > a {margin:0px 10px;}
.pol_sc {width:100%; height:310px; overflow-x:hidden; overflow-y:auto;}
.pol_sc_in {height: 100%;}
.pop_wrap .pop_bottom .close {background: #000000; display: block; color: #fff; line-height:50px; font-size: 16px; text-align: center}




/* 팝업 */

.layers_wrap {background:#FFF; position:relative; min-width:300px;  font-weight:300;}
.layers_wrap .layers_tit {width:100%; padding:15px 0px; line-height:150%; background:#333;  text-align:center; font-size:1.8em; color:#fff; position:relative;}
.layers_wrap .layers_tit .logo {padding-left:25px; padding-top:20px;}
.layers_wrap  .close_pop { position:absolute; right:25px; top:17px;}
.layers_wrap .layers {padding:20px; font-size:14px; position:relative; /*min-height:100px; max-height:760px; overflow-x:hidden; overflow-y:auto; -webkit-print-color-adjust:exact;*/}

.layers_wrap .close {height:30px; border-top:none; text-align:right; background:#e2e2e2; line-height:30px;}
.layers_wrap .close a { display:inline-block; zoom:1; *display:inline; font-family:Noto Sans; color:#2d2d2d; padding-right:20px; background:url(http://pic.neungyule.com/newnetimes/img/btn/pop_close_s.gif) no-repeat right center; margin-right:10px;}
.layers_wrap .pop_tit {padding-left:5px; border-bottom:1px solid #afafaf; min-height:41px; padding-bottom:3px; font-family:Noto Sans; color:#444444; font-size:22px; line-height:41px;}
.layers_wrap .pop_tit.ico_check2 { font-size:13px; min-height:20px; padding:10px 10px 10px 50px; background:url(../img/common/ico_check2.gif) no-repeat 10px 10px #f9f9f9; line-height:150%; border-bottom:none;}
.layers_wrap .pop_tit_no {min-height:38px; font-family:Noto Sans; color:#444444; font-size:22px; line-height:38px;}

/* 팝업 */

.main_layer_pop {position:absolute; left:5%;  top:100px; z-index:9999}
.main_pop_bottom {background:#fff; font-weight:300; color:#000; padding:10px; position:relative; font-size:14px; box-sizing:border-box; border:1px solid #ccc;}
.main_pop_bottom .close {position:absolute; right:10px; top:10px; padding-right:30px; background:url(../popup/images/pop_close.gif) no-repeat right center; }
.main_layer_pop_inner {width:100%; height:100%; display:table; position:relative; margin:0 auto; box-sizing:border-box;}
.main_layer_pop_inner .cell {display:table-cell; vertical-align:middle; position:relative;}
.main_layer_pop .bx-wrapper .bx-controls-direction a {margin-top:-22px; width:44px; height:44px;}
.main_layer_pop .bx-wrapper .bx-prev {left:0px; background:url(../img/main/pop_l.png) no-repeat 0 0;}
.main_layer_pop .bx-wrapper .bx-next {right:0px; background:url(../img/main/pop_r.png) no-repeat 0 0;}
.main_layer_pop .pop_wrap_in {margin:0 auto;}
.main_layer_pop .pop_wrap_in{max-height:500px; overflow-y:auto;}
.main_pop_content > img{max-width:100%;}
.pop_bottom_bt {display: flex; flex-wrap: wrap; width: 100%; background: #333; border-top:2px solid #fff; }
.pop_bottom_bt > a {display: block; width: 50%; box-sizing: border-box; color: #fff; text-align: center; height:50px; line-height:48px; font-size:16px; font-weight: 400; border-left: 1px solid #fff;}
.pop_bottom_bt > a:first-child {border: none;}


.sub_wrap {background: #fff}
.sub_con {max-width: 1200px; padding-top:10px; padding-bottom:80px; margin: 0 auto; font-size: 14px; }
.s_tit {font-size: 24px; padding:30px 0px 10px 0px;}
.s_tit > span {display: inline-block; border-bottom:2px solid #5ddfde}
.title_bar {max-width:1400px; margin:0px auto; margin-bottom:30px; padding-top:80px; position:relative;}
.title_bar h2 {font-size:30px; text-align:center; font-weight:400; color:#000000; line-height:120%; transition:all 0.2s 0s ease-in-out;}
.sub_cate {margin-bottom: 30px;}
.sub_cate > ul {display: flex; flex-wrap: wrap; border-top:1px solid #eeeeee; border-bottom: 1px solid #eeeeee; background: #fff;}
.sub_cate > ul > li {flex-basis:100px; background: #fff;}
.sub_cate > ul > li > a {width: 100%; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; color: #1b1b1b; font-size: 14px; line-height: 130%; height:52px; text-align: center; transition:all 0.2s 0s ease-in-out;}
.sub_cate > ul > li > a:hover {background: #ffedf3}
.sub_cate > ul > li > a.on {background: #e6004f; color: #fff;}
.sub_cate > ul > li.all { flex-basis:140px; padding-right:40px;}
.sub_cate > ul > li.all > a > span {display:inline-block; padding-left:40px; position: relative; min-height: 17px; font-size: 1.2em;}
.sub_cate > ul > li.all > a > span > span {position: absolute; left: 0px; top:1px; display: block; width: 22px; height: 2px; background: #fff;}
.sub_cate > ul > li.all > a > span > span:after {background: #fff; display: block; content: ""; width: 100%; height: 2px; position: absolute; left: 0px; top: 8px;}
.sub_cate > ul > li.all > a > span > span:before {background: #fff;display: block; content: ""; width: 100%; height: 2px; position: absolute; left: 0px; top:15px;}

.detail_search {border-radius:20px; background: #fff; box-shadow: 1px 2px 3px rgba(0, 0, 0, 10%); padding: 20px; padding-bottom:10px;}
.detail_search .head {display: flex; flex-wrap: nowrap; justify-content: space-between; padding: 10px 0px 20px 0px;}
.detail_search .head > h3 {font-size: 12px; color: #fe8d5b; font-weight: 600;}
.detail_search .head > h3 > span {display: block; padding-right: 40px; line-height: 27px; background: url(../img/common/search.gif) no-repeat right center;}
.detail_search .head .btn_reset {display: block; padding-left:30px; line-height: 27px; background: url(../img/common/reset.gif) no-repeat left center; font-size: 12px; color: #959595; outline: none; border: none;}

.filter_area .row {display: flex; flex-wrap: wrap; border-top:1px solid #eeeeee; }

.filter_area .row > h3 {width: 195px; box-sizing: border-box; font-size: 16px; padding-left: 10px; padding-top:6px; line-height:40px;}
.filter_area .row > ul {flex:1; display: flex; padding:6px 0px; flex-wrap: wrap;}
.filter_area .row > ul > li {padding:5px;}
.filter_area .row > ul > li > a {display: block; line-height:30px; font-size: 15px; padding: 0px 10px; border-radius:6px; transition:all 0.2s 0s ease-in-out; color: #666; letter-spacing: -0.5px; font-weight: 300; position: relative}
.filter_area .row > ul > li > a:hover {color: #000;}
.filter_area .row > ul > li > a.on {background: #ff4660; color:#fff;}
.filter_area .row > ul > li > a.on:hover:before{content:'x';width:16px;height:16px; font-size:13px; line-height:11px; text-align: center; border-radius:100%; display:inline-block; background: #fff; position:absolute;top:-4px;right:-4px; border: 1px solid #ccc; color: #999; box-sizing: border-box;}
.filter_area .ft_row ul li.active a{background:#fa6c39;color:#fff}

.product_sort {display: flex; flex-wrap: wrap; border-bottom: 1px solid #eeeeee; padding: 30px 3% 10px 3%; margin-bottom: 10px; justify-content: space-between; }
.product_sort .total {font-size:12px; color: #959595; font-weight: 300;}
.product_sort > ul {display: flex; flex-wrap: wrap;}
.product_sort > ul > li {padding-left: 10px}
.product_sort > ul > li > a {display: block; color: #959595; font-size: 12px;}
.product_sort > ul > li > a.on {font-weight:600; color: #000;}

.paging {overflow:hidden; text-align:center; margin:45px 0px 25px 0px; width:100%; font-weight:300; display: flex; flex-wrap: wrap; justify-content: center; align-items: center;}
.paging img {vertical-align:middle; max-width:70%;}
.paging a {color:#333333; width:30px; height: 30px; box-sizing: border-box; line-height:140%; overflow: hidden; font-size:13px; border:1px solid #e0e0e0; border-left: none; display:inline-flex; justify-content: center; align-items: center; font-weight:300; background: #fff;}
.paging a:first-child {border-left:1px solid #e0e0e0;}
.paging a.on {color:#f7120a; border:1px solid #f7120a;}

.product_view {display: flex; flex-wrap: wrap; justify-content: space-between}
.product_img_wrap {width:73%; display: flex; flex-wrap: wrap; box-sizing: border-box; justify-content: space-between}
.product_img_wrap .product_img {width:330px; box-sizing: border-box; padding:0px 10px;}
.product_img_wrap .product_img .big {display: flex; height: 340px; justify-content: center; align-items: center; padding: 10px; box-sizing: border-box;}
.product_img_wrap .product_img .big img {width: 300px;; border-radius:10px;}
.product_img_wrap .prd_name {text-align: center; margin-top:5px;font-family:'BMJUA', 'GmarketSans' !important;}
.product_img_wrap .prd_name h1 { line-height: 1.5;   /* 줄간격 */ font-weight:700;}
.product_img_wrap .prd_name > h2 {font-size:26px; color: #000000; line-height: 140%; font-weight: 600; }
.product_img_wrap .prd_name .date {font-size:15px; padding-top: 10px; color: #666; line-height: 140%;}
.product_img_wrap .prd_name > p {padding-top:5px; line-height:1.4em; color:#666;text-align:center;}
.product_img_wrap .color_txt { padding-top:20px;text-align: center; font-size:16px; line-height: 1.3em; font-weight: 400;font-family:'BMJUA', 'GmarketSans' !important;}
.product_img_wrap .color_txt span{ margin-top:-15px;padding-left:10px;text-align:center;}
.product_img_wrap .small {display: flex; flex-wrap: wrap; justify-content: center; padding:25px 0px 0px 0px;}
.product_img_wrap .small > li {padding: 2px;}
.product_img_wrap .small > li > a {display: flex; width:50px; height: 50px; border: 1px solid #eee; position: relative;}
.product_img_wrap .small > li > a:hover:after {display: block; content: ""; width: 100%; height: 100%; border: 2px solid #000; box-sizing: border-box; position: absolute; left: 0px; top: 0px;}

.product_view2 {flex-wrap: nowrap;}
.product_view2 .product_img_wrap {width:66%; flex-wrap: nowrap;}
.product_view2 .product_img_wrap .product_img {width:50%}
.product_view2 .product_img_wrap .product_info h3{font-weight:bold;font-size:18px; font-family:'BMJUA', 'GmarketSans' !important;}
.product_view2 .product_img_wrap .product_info {width:100%; box-sizing:border-box}
.product_view2 #order_list_frm {width:50%}
.product_view2 .product_img_wrap .btn_group2 {justify-content: flex-start;}
.product_view2 .product_img_wrap .btn_group2 > li {flex:none}

/* 크로스페이드 컨테이너 */
#color_txt.xfade {
  position: relative;
  display: inline-block;
  min-width: 3em;           /* 폭 점프 방지 (필요시 조정) */
  line-height: 1.2;
  padding-left:0px;
}

/* 텍스트 레이어(겹침) */
#color_txt .xf-layer {
  position: absolute;
  left:50%; top: 0;
      transform: translate(-50%, 6px) !important;
  white-space: nowrap;
padding-left:0px;
}

/* 접근성: 라이브영역(선택사항) */
#color_txt[aria-live="polite"] { }


.product_img_wrap .color_select {display: flex; flex-wrap: wrap; justify-content: center; padding:15px 0px 10px 0px;}
.product_img_wrap .color_select > li {padding: 2px;}
.product_img_wrap .color_select > li > button {display: flex; width:30px; height: 30px; border-radius:4px; position: relative; border-radius:100%; border:2px solid #999;  cursor: pointer;}
.product_img_wrap .color_select > li > button.on:after {display: block; content: ""; width: 100%; height: 100%; border:3px solid #fff; box-sizing: border-box; position: absolute; left: 0px; top: 0px; border-radius:100%;}


.product_img_wrap .product_info {width:490px; padding-left: 10px; font-size: 17px;}
.product_img_wrap .product_info > h3 {font-size:21px; font-weight:500; padding: 30px 0px 10px 0px; line-height: 1.3em;}
.product_img_wrap .product_info > h3:first-child {padding-top:20px;}
.product_img_wrap .btn_group {display: flex; flex-wrap: wrap; margin: -3px; justify-content: space-between; margin-top:10px;}
.product_img_wrap .btn_group > li {padding: 3px; flex: 1}
.product_img_wrap .btn_group > li > button {
  flex-wrap: wrap;
  border-radius: 6px;
  font-weight: 400;
  outline: none;
  background: #fff;
  display: flex;
  border: 1px solid #ccc;
  min-height: 40px;
  box-sizing: border-box;
  justify-content: center;
  align-items: center;
  font-size: 15px;
  padding: 0px 3px;
  width: 100%;
  cursor: pointer;
  color: #666;
}

/* 일반 hover */
.product_img_wrap .btn_group > li > button:hover {
  background: #E6E6E6;
  border: 0;
}

/* ✅ 클릭(on) 상태 */
.product_img_wrap .btn_group > li > .on {
  border-color: #333333;
  font-weight: 600;
  background: #333333;
  color: #fff;
  transition: all 1.5s ease;
}

/* ✅ on 상태일 때 hover해도 그대로 유지 */
.product_img_wrap .btn_group > li > .on:hover {
  background: #000000 !important;
  color: #fff !important;
  border-color: #000000 !important;
}
.product_img_wrap #join_type_txt {padding-top: 5px; font-size: 100; line-height: 1.5em;}
.product_img_wrap .note {color: #666; font-size: 14px;font-family:'BMJUA', 'GmarketSans' !important;}
.product_img_wrap select{border-radius: 5px;border: 1px solid #333;padding:0px 40px 0px 20px !important;font-size: 17px;width: 100%;color: #ff4660; background: url(../img/common/arrow.png) no-repeat 98% center #fff; cursor: pointer;box-sizing: border-box; height:42px; position: relative; -webkit-appearance: none; -moz-appearance: none; appearance: none; outline: none;}
.product_img_wrap .radio_group {display: flex; flex-wrap: wrap; margin: -10px;}
.product_img_wrap .radio_group > li {padding:10px;}
.product_img_wrap .tip {padding-top: 10px; font-size:16px;  color: #ff4660}
.product_img_wrap .all_view {text-align: right; height: 30px; margin-top: -30px;}
.product_img_wrap .all_view > a {font-size: 14px; color: #000;}
.product_img_wrap .price_select {border: 1px solid #ccc; border-top:none; background: #fbfbfb; padding: 20px; margin-top: -2px; font-family: 'Noto Sans';
 font-size: 14px; line-height: 1.4em;}

.product_info_wrap .item_price > h2 {padding: 15px 0px ;text-align: center; color: #000; font-size:18px;}
.product_info_wrap .item_price > h3 {padding:10px; line-height:1.5em; background: #333333; color: #fff; font-size:18px; font-weight: 400; padding-left:25px;font-family:'BMJUA', 'GmarketSans' !important;}
.product_info_wrap .item_price { border: 1px solid #ccc; border-radius:6px; overflow: hidden}
.product_info_wrap .item_price > h2 .type {display: flex; font-size: 17px; width: 26px; height: 26px; border-radius:100%; margin-right: 5px; background-color: #fa7647; color: #fff; justify-content: center; box-sizing: border-box;  align-items: center; margin-top: -3px;}
.product_info_wrap .item_price > h2 .small_txt {font-size: 13px; color: #666; line-height: 1.3em;}


/* 2026.05.01 디자인변경  - 레브영역 */
.product_info_wrap .item_price2 > h2 {padding: 15px 0px ;text-align: center; color: #000; font-size:18px;}
.product_info_wrap .item_price2 > h3 {padding:10px; line-height:1.5em; background: #ff3131; color: #fff; font-size:18px; font-weight: 400; padding-left:25px;font-family:'BMJUA', 'GmarketSans' !important;}
.product_info_wrap .item_price2 { border: 1px solid #ccc; border-radius:6px; overflow: hidden; font-family:'BMJUA', 'GmarketSans' !important;}
.product_info_wrap .item_price2 > h2 .type {display: flex; font-size: 17px; width: 26px; height: 26px; border-radius:100%; margin-right: 5px; background-color: #fa7647; color: #fff; justify-content: center; box-sizing: border-box;  align-items: center; margin-top: -3px;}
.product_info_wrap .item_price2 > h2 .small_txt {font-size: 13px; color: #666; line-height: 1.3em;}

/* 2026.05.01 디자인변경  - 블루영역 */
.product_info_wrap .item_price3{margin-top:20px;}
.product_info_wrap .item_price3 > h2 {padding: 15px 0px ;text-align: center; color: #000; font-size:18px;}
.product_info_wrap .item_price3 > h3 {padding:10px; line-height:1.5em; background: #3172ff; color: #fff; font-size:18px; font-weight: 400; padding-left:25px;font-family:'BMJUA', 'GmarketSans' !important;}
.product_info_wrap .item_price3 { border: 1px solid #ccc; border-radius:6px; overflow: hidden; font-family:'BMJUA', 'GmarketSans' !important;}
.product_info_wrap .item_price3 > h2 .type {display: flex; font-size: 17px; width: 26px; height: 26px; border-radius:100%; margin-right: 5px; background-color: #fa7647; color: #fff; justify-content: center; box-sizing: border-box;  align-items: center; margin-top: -3px;}
.product_info_wrap .item_price3 > h2 .small_txt {font-size: 13px; color: #666; line-height: 1.3em;}


.product_info_wrap {margin-left:25px; flex:1; box-sizing: border-box;}
.product_info_wrap .price_list > li.tit {justify-content:flex-start; font-size:18px; align-items: center; font-weight:700; margin-bottom:10px;font-family:'BMJUA', 'GmarketSans' !important;}
.product_info_wrap .price_list > li.tit .txt_a {display:inline-flex; font-size:14px; width:24px; height:24px; justify-content: center; color:#fff; text-align:center; align-items:center; line-height:1.1em; font-weight:700; border-radius:100%; margin-right:5px;}
.product_info_wrap .price_list > li {display: flex; flex-wrap: wrap; justify-content: space-between; font-size:17px; line-height: 1.4em; padding:5px 10px;font-family:'BMJUA', 'GmarketSans' !important;}
.product_info_wrap .price_list > li.fb {font-weight: 700 !important; font-size:18px;}
.product_info_wrap .price_list > li.fb .con {font-weight: 700 !important}
.product_info_wrap .price_list > li.fb .con > strong {font-weight: 700 !important}
.product_info_wrap .price_list {padding: 10px 15px; }
.product_info_wrap .price_list > li .con {font-weight:300;}

.product_info_wrap .price_list > li .con .gm {color: #ff4660;}
.product_info_wrap .price_list2 > li {display: flex; flex-wrap: wrap; justify-content: space-between; font-size:16px; line-height: 1.4em}
.product_info_wrap .price_list2 > li .con.blue {color: #3462e7}
.product_info_wrap .price_list2 > li .con.line {text-decoration: line-through}
.product_info_wrap .price_list2 > li .subject {position: relative;}
.product_info_wrap .price_list2 > li .subject .tip {position: absolute; top: 0px; left: 110%; border: 1px solid #000; font-size: 13px; background: #fff; padding:10px 20px; font-family: 'Noto Sans'; width:240px; display: none;}

.product_info_wrap .dot_line {margin: 20px 0px; border-top:1px dashed #ccc; display:block}
.product_info_wrap .month_price {text-align: right; font-size:25px; color: #ff4660 ;line-height: 1.4em;}
.product_info_wrap .month_price .gmB {font-size: 1.4em; line-height: 1.4em;}
.product_view .end_btn {padding-top:20px; justify-content: center; display: flex; flex-wrap: wrap; margin: 0px -10px;}
.product_view .end_btn > li {box-sizing: border-box; padding: 10px;font-family:'BMJUA', 'GmarketSans' !important;}
.product_view .end_btn > li > a {display: flex; align-items: center; font-size:16px; font-weight:400; color:#000; line-height: 1.3em; box-sizing: border-box;}
.product_view .end_btn > li > a .ico {padding-right: 10px;}
.product_view .end_btn > li > a.order_bt  {font-size:20px; min-height:60px; background: #e60012;  color:#fff;}
.product_view .end_btn > li.one {width: 100%; max-width: 270px; margin: 0 auto;}
.product_view .end_btn > li.one a {height: 70px; border:1px solid #000; border-radius:4px; justify-content: center; font-size: 20px; font-weight: 600; color: #000; background: #fff;}
.product_view .order_btn {padding-top: 20px;}
.product_view .order_btn > li button {display: flex; text-align:center; flex-direction: column; align-items: center; height:50px; border:1px solid #ff3737; border-radius:5px; justify-content: center; font-size:18px; line-height:1.3em; font-weight: 600; color: #fff; background: #e60012; box-shadow: 0 4px 6px rgba(0,0,0,0.1);
            transition: background-color 0.3s;border: none; width:100%}
.product_view .order_btn > li button:hover{ background-color: #c4000f; /* 마우스 올렸을 때 조금 더 진하게 */}
.product_view .order_btn > li button .small {font-size:0.6em; letter-spacing: -1px; font-weight:400; line-height:1.3em;}


/*2026.05.01 수정본*/
.product_view .order_btn2 {padding-top: 0px;}
.product_view .order_btn2 > li button {display: flex; text-align:center; flex-direction: column; align-items: center; height:50px; border:1px solid #ff3737; border-radius:5px; justify-content: center; font-size:18px; line-height:1.3em; font-weight: 600; color: #fff; background: #e60012; box-shadow: 0 4px 6px rgba(0,0,0,0.1);
            transition: background-color 0.3s;border: none; width:100%;}
.product_view .order_btn2 > li button:hover{ background-color: #c4000f; /* 마우스 올렸을 때 조금 더 진하게 */}
.product_view .order_btn2 > li button .small {font-size:0.6em; letter-spacing: -1px; font-weight:400;margin-top:-30px;}

.product_view .order_btn2.two {display:flex; margin:-5px}
.product_view .order_btn2.two > li {width:50%; box-sizing:border-box; padding:5px;}


/* 제휴카드선택 셀렉트 */
.custom-select-wrap {
  position: relative;

}

.custom-select-wrap select {
  display: none;
}

.custom-select {
  border: 1px solid #333;
  border-radius: 6px;
  padding: 12px 45px 10px 18px;
  background: #fff;
  cursor: pointer;
  position: relative;
}

.card-title {
  font-size: 18px;
  color: #ff3b4f;
  margin-bottom: 4px;
}

.card-desc {
  font-size: 14px;
}

.card-desc strong {
  color: red;
}

.card-arrow {
  position: absolute;
  right: 15px;
  top: 22px;
  width: 12px;
  height: 12px;
  border-right: 2px solid #ff6b35;
  border-bottom: 2px solid #ff6b35;
  transform: rotate(45deg);
}

/* 드롭다운 */
.option-list {
  display: none;
  position: absolute;
  width: 100%;
  border: 1px solid #ccc;
  background: #fff;
  margin-top: 5px;
  border-radius: 6px;
  overflow: hidden;
  z-index: 10;
}

.option-list li {
  padding: 10px;
  cursor: pointer;
}

.option-list li:hover {
  background: #f5f5f5;
}
/* 제휴카드선택 셀렉트 */


/* 버튼 디자인 (원하는 대로 수정 가능) */
        .share-btn {
			width:100%;
			margin-top:10px;
            background-color: #e60012; /* KT 로고색(빨강) 느낌 */
            color: white;
            padding: 12px 24px;
            border: none;
            border-radius: 5px;
            cursor: pointer;
            font-size: 18px;
            font-weight: bold;
            box-shadow: 0 4px 6px rgba(0,0,0,0.1);
            transition: background-color 0.3s;
        }
        .share-btn:hover {
            background-color: #c4000f; /* 마우스 올렸을 때 조금 더 진하게 */
        }



.product_view .order_btn.two {display:flex; margin:-5px}
.product_view .order_btn.two > li {width:50%; box-sizing:border-box; padding:5px;}




.total_price {font-size: 13px; line-height: 1.4em; padding:0px 15px 20px 15px; letter-spacing: -0.5px; text-align: right;}
.total_price:before {display:block; content: ""; width:96%; height: 1px; background: #ccc; margin: 0 auto; margin-bottom: 20px;}


.prd_info_wrap .price .box .bt {padding-top: 20px; text-align: right;}
.prd_info_wrap .price .box .bt > button {width: 200px; height: 55px; line-height: 120%; display: inline-flex; justify-content: center; align-items: center; color: #fff; font-size:20px; font-weight: 400; border-radius: 10px; background: #000000; outline:none; border: none; cursor: pointer}
.prd_info_wrap .box .select {border: none; line-height: 38px; width: 100%; padding: 10px; box-sizing: border-box;background-color: #f7f7f7; border-radius: 10px;}

.prd_tab {display: flex; flex-wrap: wrap; justify-content: space-between;}
.prd_tab > li {flex: 1;}
.prd_tab > li > a {display: flex; min-height: 50px; justify-content: center; align-items: center; line-height: 1.3em; background: #f7f7f7; padding-top: 3px; font-size: 20px; color: #000; border:1px solid #dddddd; border-bottom: none; border-left-width:0px; font-family:'BMJUA', 'GmarketSans' !important;}
.prd_tab > li > a .count {font-size: 12px; color:#fb6d3a; padding-left:7px;}
.prd_tab > li > a.on {background: #fff; border-top:2px solid #4a4a4a }
.prd_tab > li:first-child > a {border-left-width:1px;}

.b_quick_wrap {position: fixed; left: 0px; bottom: 0px; background:#333333; width: 100%; z-index: 88}
.b_quick_wrap .inner {display: flex; flex-wrap: wrap; justify-content: space-between; padding: 15px 0px; }
.b_quick_wrap .inner > ul {display: flex; flex-wrap: wrap; font-size: 15px; justify-content: space-between; flex: 1; align-items: center;}
.b_quick_wrap .inner > ul > li { color: #fff; padding-right: 10px; display: flex; align-items: center; justify-content: center;  flex-wrap: wrap;}


.b_quick_wrap .inner .bt {width: 340px; display: flex}
.b_quick_wrap .inner .bt > a {display: flex; width: calc((100% / 2) - 5px); margin: 0px 5px; height: 42px; border-radius:4px; font-size: 16px; color: #000; justify-content: center; align-items: center; font-weight: 600;}




/* btn */
.btnType1, a.btnType1 {display: inline-flex; height: 31px; box-sizing: border-box; border: 1px solid #ccc; padding: 0px 5px; font-size: 13px; color: #333; background: #fff; justify-content: center; align-items: center; font-weight: 300;}
.btnType2, a.btnType2 {display: inline-flex; height:29px; box-sizing: border-box; border: 1px solid #e74c3c; padding: 0px 10px; font-size: 13px; color: #fff; background: #e74c3c; justify-content: center; align-items: center; font-weight: 300; border-radius:4px; }

.btn_ico_arrow {display: block; position: relative; padding-right:10px;}
.btn_ico_arrow:after {content: ''; width:7px; height: 7px; border-top:2px solid #fff; border-right:2px solid #fff; border-radius:2px; display: inline-block; transform: rotate(45deg) translateY(-50%); position: absolute; right: 0px; top: 50%; margin-top: -1px;}

.sns_share {display:flex; flex-wrap:wrap;}
.sns_share > li { width:33.3333%; box-sizing:border-box; padding:10px 5px; text-align:center;}
.sns_share > li > a {display:inline-block; color:#000; font-size:16px; line-height:1.4em;}
.sns_share > li > a img {width:125px;}
.sns_share > li > a .txt {display:block; padding-top:10px;}

.sns_url_area {border:1px solid #ccc; position:relative; margin:20px 30px; display:flex;}
.sns_url_area input {padding:5px; box-sizing:border-box; border:none; height:50px; font-size:18px; line-height:1.4em; flex:1}
.sns_url_area button {background: #fff; border: none; border-left:1px solid #ccc; font-size: 18px; display: flex; justify-content: center; width: 70px; align-items: center; cursor: pointer;}

.copy_complete {background:rgba(0, 0, 0, 100%); padding:20px; color:#fff; font-size:15px; text-align:center;  border-radius:50px; margin-top:30px;}

.card_list > ul {display:flex; flex-wrap:wrap; margin:0px -20px;}
.card_list > ul > li {width:50%; box-sizing:border-box; padding:20px;}
.card_list .box {border:1px solid #ccc; box-sizing:border-box; height:100%; padding:40px 50px; text-align:center; display: flex; flex-wrap: wrap; flex-direction: column;}
.card_list .box .cate {display:flex; flex-wrap:wrap; justify-content: center;}
.card_list .box .cate > span {display:inline-block; color:#fff; font-size:14px; line-height:1.3em; margin:5px; padding:5px 10px; border-radius:4px; background:#7362c2}
.card_list .box .name {color:#333; font-size:26px; font-weight:700;line-height:1.4em; padding:10px 0px 20px 0px;}
.card_list .box .info {text-align:left; font-size:14px; line-height:1.4em;}
.card_list .box .info > dt {padding:20px 0px; font-size:26px; text-align:center; line-height:1.5em; font-weight:700; color:#cd1e25}
.card_list .box .btn {margin-top:auto; padding-top:20px;}
.card_list .box .btn a {display:inline-flex; flex-wrap:wrap; justify-content: center; align-items:center; height:48px; min-width:158px; border-radius:60px; background:#da1727; color:#fff;}


.used_phone_search {margin:30px 0px 20px 0px; border:1px solid #ccc; display:flex; align-items: center; }
.used_phone_search .ico {padding:0px 20px;}
.used_phone_search input {padding:5px; box-sizing:border-box; outline:none; border:none; height:50px; font-size:18px; line-height:1.4em; flex:1}



.table_style1 {clear:both; width:100%; table-layout:fixed; font-size:16px; border-top:2px solid #000;}
.table_style1 thead tr th {background-color:#f5f5f5; color:#333333; padding:10px 2px; border:1px solid #d9d9d9; font-weight:500; word-break:break-all; text-align:center;}
.table_style1 thead tr:first-child th {border-top:none;}
.table_style1 tbody tr th {background-color:#eff1f6; border-bottom:1px solid #d9d9d9; padding:10px 0 9px;font-weight:700; }


.table_style1 tbody tr td {border:1px solid #d9d9d9; line-height:130%; height:28px; padding:10px 5px; text-align:center; font-weight:300;  word-wrap:break-word; color:#333333}
.table_style1 tbody tr th {border:1px solid #d9d9d9;}
.table_style1 tbody tr th.tl {padding-left:18px; padding-right:10px; text-align:left; word-break:break-all;}
.table_style1 tbody tr td.subject {padding-left:18px; padding-right:10px; text-align:left; word-break:break-all;}
.table_style1 tbody tr .left_line {border-left:1px solid #d5d5d5 !important;}
.table_style1 .input {min-height:40px; line-height:40px; width:100%;}
.table_style1 .on td {background:#f5f5f5;}

.used_phone_scroll {overflow-y:auto;}


.menu_btn {position:absolute; right:0px; top:50%; transform:translateY(-50%); -webkit-transform:translateY(-50%); box-sizing:border-box; display:none; }
.menu_btn.active  {position:fixed; top:2px; right:0; z-index:999; border:none; transform:none;}
.menu_btn a{position:relative;display:block;width:50px; height:50px; transition:.25s; cursor:pointer}
.menu_btn a span{position:absolute;right:50%;top:50%;display:block;width:16px;height:3px;background-color:#333;margin:-1.5px -13px 0 0 ;text-indent:-9999px;}
.menu_btn span,
.menu_btn span:before,
.menu_btn span:after{content:"";right:0;position:absolute;display:block;width:26px;height:100%;background-color:#333;transition:.25s;-webkit-transition:.25s;}
.menu_btn span:before{top:-7px;}
.menu_btn span:after{bottom:-7px;}

.menu_btn .active span{background-color:transparent;}
.menu_btn .active span:before{top:0;transform:rotate(-45deg);-moz-transform:rotate(-45deg);-webkit-transform:rotate(-45deg);-o-transform:rotate(-45deg);}
.menu_btn .active span:after{bottom:0;transform:rotate(45deg);-moz-transform:rotate(45deg);-webkit-transform:rotate(45deg);-o-transform:rotate(45deg);}


.slide_menu_wrap {width:310px; background:#fff;  box-sizing:border-box; height:100%;  z-index:998; position:fixed; right:-400px; top:0px; bottom:0px; box-shadow:-1px 0px 5px rgb(0, 0, 0, 0.25); }
.slide_menu_inner {height:100%; box-sizing:border-box; overflow-y:auto; overflow-x:inherit; -webkit-overflow-scrolling:touch;}
.slide_menu_inner .top_btns {transform:none;}
.slide_menu_inner .in_header {border-bottom:1px solid #ccc;}
.slide_menu_wrap .m_gnb_on {display:none !important}
.slide_menu_wrap .top_menu_wrap {text-align:center;}
.slide_menu_wrap .top_menu_wrap > .top_menu > li svg .white {fill:#333}

.slide_menu_wrap .gnb > ul {overflow:hidden; }
.slide_menu_wrap .gnb > ul > li {border-bottom:1px solid #e2e2e2; transform:translateX(30%); -webkit-transform:translateX(30%); transition:all 0.8s 0s ease-in-out; -webkit-transition:all 0.8s 0s ease-in-out;}
.slide_menu_wrap .gnb > ul > li > a {display:block; line-height:60px; font-size:18px; font-weight:500; color:#333; padding-left:50px; background:#fff;}
.slide_menu_wrap .gnb > ul > li:hover > a {background:#ff7141; color:#fff;}
.slide_menu_wrap .gnb > ul > li > a.on {background:#ff7141; color:#fff; }
.slide_menu_wrap .gnb .sub_menu {background:#fff; display:none; padding:10px 0px;}
.slide_menu_wrap .gnb .sub_menu > li > a {display:block; line-height:23px; padding:10px 0px 10px 50px; font-size:15px; color:#0d437b; transition:all 0.3s 0s ease-in-out; -webkit-transition:all 0.3s 0s ease-in-out;}
.slide_menu_wrap .gnb .sub_menu > li > a:hover {padding-left:55px; }


.slide_menu_wrap.on .gnb > ul > li {transform:translateX(0%); -webkit-transform:translateX(0%); transition:all 0.8s 0s ease-in-out; -webkit-transition:all 0.8s 0s ease-in-out;}
.w_gnb .toggleBt {display:none;}


.top_menuW:after {display:block; content:"";width:100vw; height:1px; background:#e8e8e8; position:absolute; left:50%; bottom:0px; transform:translateX(-50%)}


.board_gallery {display:flex; flex-wrap:wrap; margin:-15px; margin-top:15px;}
.board_gallery > li {width: 50% !important; float:none !important; margin:0px 0px 10px 0px !important; padding:15px !important; box-sizing:border-box;}
.area_search {text-align:center;}
.list_bottom_page  {text-align:center;}

.button_white60x30{width:80px; height:30px; background:#383838; border:0px; color:#fff; margin-top:10px; margin-bottom:20px;}
.button_small{width:80px; height:30px; background:#EF162C; border:0px; color:#fff; margin-top:10px; margin-bottom:20px;}
.button_small_white30{width:80px; height:30px; background:#383838; border:0px; color:#fff; margin-top:10px; margin-bottom:20px;}


#content_area_gallery_event {width:100% !important; max-width:1200px; margin:0 auto;}
.geBoard_box {width:100% !important;}
.geBoard_box a {width:100% !important; box-sizing:border-box; display: block; text-decoration: none; text-align: center;cursor: default; border:1px solid #C0C0C0;}
.geBoard_box .board_img{overflow:hidden; position:relative;display: block; width:auto !important; height:auto !important; padding-bottom:calc(220/515*100%);}
.geBoard_box .board_img > img {position:absolute; left:0px; top:0px; width:100% !important; height:100% !important; }
.geBoard_box .geBoard_info  {min-width:auto !important; padding:10px; width: 100%; box-sizing:border-box;}
.geBoard_box .geBoard_info img{width:100%;height:100%;}
.geBoard_box .geBoard_info .subject {width:100% !important;display: block; font-size:26px; font-weight: 800; color:#000;padding:20px 0;line-height:150%; margin-top:10px; text-align:center; margin-bottom:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.geBoard_box .geBoard_info p {font-size: 18px; color: #666; margin-bottom:20px; padding:0;}
.geBoard_box .geBoard_info .resperiod strong {font-size: 18px;color: #000;}
.geBoard_box .geBoard_info .resperiod span {display: inline-block; margin-left: 20px; font-size: 18px; color: #666;}
.geBoard_box .geBoard_info .more_btn {display: block; width:100% !important; max-width: 300px !important; height: 50px; margin: 30px auto; text-align: 18px; line-height: 50px; color: #fff; border-radius: 30px; background: #ccc; font-size: 16px;}
.geBoard_box a.on:hover {cursor: pointer;}
.geBoard_box a.on:hover .geBoard_info .subject {color: #7592ff; }
.geBoard_box a.on:hover .geBoard_info .more_btn {background: #7592ff;}
/*.geBoard_box a:hover .geBoard_info .subject {color: #7592ff;}
.geBoard_box a:hover .geBoard_info .more_btn {background: #7592ff;}*/
.geBoard_box .geBoard_info.geing .more_btn {background: #333; }
.geBoard_box .geBoard_info.geing .resperiod span {color: #7592ff;}



.geBoard_box .geBoard_info .lsB{width:95%;padding:6px 2.5%;background:#efefef;text-align:right;font-size:11px;}




@media screen and (max-width:1100px) {
	#inner_wrap {padding-left:10px; padding-right:10px;}
	.product_img_wrap {width:100%;}
	.product_info_wrap {margin:10px 0px 0px 0px; flex:none; width:100%; max-width:100%;}
	.product_img_wrap .product_info {box-sizing:border-box; width:100%; flex:1; padding-right:20px;}
	.product_img_wrap #order_list_frm {width:100%; flex:1; }

	.product_view2 {flex-wrap:wrap;}
	.product_view2 .product_img_wrap {width:100%}

}
/* 980px 이하 */
@media screen and (max-width:979px) {
	#header span.logo {left:10px; top:-50px; transform:none}
	#header span.logo img {height:48px; width:auto !important}
	#header .tel {display:none;}
	#header .search_wrapW {display: block; padding: 0px 60px 0px 180px; box-sizing: border-box; width: 100%}
	#header .search_wrap {margin:0px; max-width:100%; width:100%; left:0px; position:relative; transform: none; top:auto;}
	.top_menu_wrap .top_menu {display: none;}
	.top_menu_wrap .inner .txt {display: none;}
	.w_gnb {padding-left:0px;}
	.w_gnb .gnb {flex-wrap: nowrap;}
	.w_gnb .gnb > ul {padding-right:0px; flex-wrap: nowrap;}
	.w_gnb .gnb > ul > li {padding:0px 10px;}
	.w_gnb .gnb > ul > li > a > span {height:55px; line-height:55px; font-size:17px}

	.w_gnb {position:relative; height:56px; padding-right:0px; white-space: nowrap;}
	.w_gnb .sub_menu {display:none !important }
	.w_gnb .toggleBt {justify-content:center; align-items:center; cursor: pointer; background:#fff; border:none; outline:none; display:none; width:50px; height:100%; position:absolute; right:0px; top:0px;;}
	.w_gnb .toggleBt:after {display: block; content: ""; width: 12px; height: 12px; box-sizing: border-box; border: 3px solid #333; border-top: none; border-right: none; transform: rotate(-45deg); margin-top:-6px; margin-left: -6px;}
	.w_gnb .toggleBt.on:after { transform: rotate(-225deg); margin-top:0px;}

	.w_gnb .gnb .event_btn {padding-left:10px}
	.w_gnb .gnb .event_btn > a {height: 35px; line-height: 35px; padding:0px 10px}
	.w_gnb.on {white-space: initial; height: auto;}

	.in_header {height:auto;}
	.slide_menu_wrap .top_menu_wrap {display:block; right:84px;}
	.slide_menu_wrap .top_menu {padding-right:0px;display:flex; position:relative; right:auto; top:auto; background:#333;}
	.slide_menu_wrap .top_menu > li {margin:0px; padding:0px; flex:1; display:flex; height:50px; color:#fff; justify-content:center;align-items:center; }
	.slide_menu_wrap .top_menu > li a {color:#fff}
	.slide_menu_wrap .event_btn > a {background: linear-gradient( to right, #e21c38, #f47a20); position: relative; line-height: 1.3em; display:flex; justify-content:center; align-items:center; height: 55px; text-align:center; box-sizing: border-box; color: #fff; font-size: 18px; z-index: 9; font-weight: 400;}
	.slide_menu_wrap .event_btn > a > span {position: absolute; left: 50%; top: 100%; width: 100%; transform: translateX(-50%); font-size: 18px; color: #fff; box-sizing: border-box; justify-content: center; align-items: center; display: flex; height: 32px; border-radius: 4px; background: linear-gradient( to right, #e21c38, #f47a20); padding-top: 2px; font-weight: 400; display:none; }

	.slide_menu_inner .in_header {padding-top:50px; height:auto;}
	.menu_btn {display:block; top: -50px; transform:none;-webkit-transform:none;}

	.main_visual .bxslider > li {height:auto !important}
/* 	.main_visual .bxslider > li .pc {display:none;}
	.main_visual .bxslider > li .mobile {display:block} */
	.main_visual .bxslider > li .mobile img {width:100%;}
	.main_visual .bx-wrapper .bx-pager {display:flex; padding:0px 10px;}
	.main_visual .bx-wrapper .bx-pager.bx-default-pager .bx-pager-item {flex:1}
	.main_visual .bx-wrapper .bx-pager.bx-default-pager a {height:5px; width:auto;}

	.product_list > ul.three {margin:-5px;}
	.product_list > ul.three > li {padding:5px;}

	.product_list > ul > li {width:50% !important;}
	#footerW .pre_logo {right:10px;}
	#footer {padding:0px 20px;}

}

/* 768 이하 */
@media screen and (max-width:767px) {
	.customer_board .box {width:100%}
	#section4 {padding-left:10px; padding-right:10px;}
	#section4 .inner .tit_area {width:100%}
	.main_banner {flex:auto; }
	.main_customer > dl {width:100%}
	#section5 .banner > li {width:100%}
	.footer_logos > ul {justify-content: center;}
	.footer_logos > ul {width:100%}
	#footer {text-align:center;}
	#footer .box_wrap .info .navi {justify-content: center;}
	#footer .box_wrap .box > h3:after {margin:20px auto;}
	#footer .box_wrap .box {width:100% !important; padding:10px 0px !important; border:none !important}

	.product_img_wrap .product_img {width:100%}
	.product_img_wrap .product_info {flex: initial; padding:10px;}
	.product_img_wrap .card_sale {width:100%; float:none;}

	.sub_con {padding-top:30px;}
	.product_view .pc_bt {display:none;}
	.product_view .mb_bt {width:100%; display:block;}


	.price_tab > li {width:33.3333% }
	.prd_tab > li > a {flex-direction: column; text-align:center;}
	.b_quick_wrap .inner .bt {padding-top:10px; width: 100%; max-width: 100%;}

	.product_view2 .product_img_wrap {flex-wrap:wrap;}
	.product_view2 .product_img_wrap .product_img {width:100%}
	.product_view2 .product_img_wrap .product_img .big {height:auto}

}



.btn-share {
  /* 1. 브라우저 기본 버튼 스타일 제거 */
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  font: inherit;
  color: inherit;
  cursor: pointer;

  /* 2. 기존 <a> 태그와 유사하게 수직 정렬 맞추기 */
  display: inline-flex;
  align-items: center;
  gap: 4px; /* 아이콘과 텍스트 사이 간격 (필요시 조절) */
  vertical-align: middle;
}

/* 필요에 따라 <li> 안에서 블록 형태로 쓰인 경우 */
li .btn-share {
  width: 100%; /* 부모 요소를 채워야 할 때 사용 */
  text-align: left;
}



.btn-counsel {
  /* 1. 기본 버튼 초기화 */
  background: #fff; /* 배경색 하얀색 */
  border: 1px solid #333; /* 검은색 얇은 테두리 */
  border-radius: 6px; /* 모서리 둥글게 (이미지 형태) */
  padding: 12px 20px; /* 위아래, 좌우 여백 */
  cursor: pointer;
  
  /* 2. 크기 설정 */
  width: 100%; /* 너비 (필요에 따라 auto나 px로 변경) */
  box-sizing: border-box;

  /* 3. 아이콘과 텍스트 중앙 정렬 */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px; /* 아이콘과 텍스트 사이 간격 */

  /* 4. 폰트 스타일 */
  font-size: 14px;
  font-weight: bold;
  color: #000;
}

/* 이미지(아이콘) 수직 위치 조정 */
.btn-counsel .ico img {
  display: block;
  max-width: 24px; /* 이미지 크기에 맞춰 조절 (필요시 수정) */
  height: auto;
}



/* 탭 버튼 기본 스타일 (클릭 안 됐을 때) */
button[role="tab"] {
  /* 1. 기본 버튼 초기화 */
  border: none;
  margin: 0;
  padding: 12px 16px; /* 탭 상하좌우 여백 */
  cursor: pointer;

  /* 2. 비활성 상태 스타일 (이미지의 연한 회색 배경) */
  background-color: #f5f5f5;
  color: #333;
  font-size: 18px;
  font-weight: normal;

  /* 3. 크기 및 정렬 */
  width: 100%;
  display: block;
  text-align: center;
  box-sizing: border-box;

  /* 4. 상단 테두리 미리 확보 (선택 시 위치 흔들림 방지) */
  border-top: 3px solid transparent;
}

/* 탭 버튼 활성화 스타일 (클릭되었을 때: .on) */
button[role="tab"].on {
  background-color: #fff; /* 선택 시 흰색 배경 */
  color: #000;
  font-weight: bold; /* 글자 두껍게 */
  border-top: 3px solid #000; /* 상단 검은색 테두리 */
}

/* 탭 버튼 스타일 */
button[role="tab"] {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px; /* '상품후기' 텍스트와 '숫자' 사이의 간격 */
  width: 100%;
  height: 48px;
  background-color: #f5f5f5;
  border: none;
  border-top: 3px solid transparent;
  font-size: 14px;
  color: #000;
  cursor: pointer;
}

/* 개수 숫자 스타일 (이미지 속 주황/붉은색 적용) */
button[role="tab"] .count {
  color: #ff6b35; /* 이미지와 동일한 붉은/주황색 계열 색상 */
  font-size: 12px;
  font-weight: normal;
  margin-left: 2px;
}

/* 탭 전체 영역 (ul/ol 기준) */
.tab-list {
  display: flex;
  list-style: none;
  padding: 0;
  margin: 0;
  width: 100%;
}

/* 각 탭 리스트 아이템 (li) */
.tab-list > li {
  flex: 1; /* 모든 탭의 너비를 동일하게 균등 분할 */
  position: relative;
  text-align: center;
  border-top: 1px solid #d0d0d0;
}

/* 탭 버튼 기본 스타일 */
.tab-list button[role="tab"] {
  width: 100%;
  height: 48px; /* 탭 높이 조절 */
  padding: 0 8px;
  background-color: #f5f5f5; /* 비활성화 회색 배경 */
  color: #333;
  font-size: 18px;
  font-weight: normal;
  border: none;
  border-top: 3px solid transparent; /* 위치 흔들림 방지 */
  cursor: pointer;
  
  /* 내부 텍스트 및 숫자를 가로 정렬 */
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  box-sizing: border-box;
}

/* 선택된 탭 스타일 (.on) */
.tab-list button[role="tab"].on {
  background-color: #fff; /* 활성화 흰색 배경 */
  color: #000;
  font-weight: bold;
  border-top: 3px solid #000; /* 상단 검은색 테두리 */
}

/* 카운트 숫자 영역 (상품후기, 상품문의) */
.tab-list .count {
  font-size: 12px;
  color: #666;
  font-weight: normal;
  display: inline-block;
}

/* 선택된 탭 내의 카운트 글자색 (필요 시 조절) */
.tab-list button[role="tab"].on + .count,
.tab-list button[role="tab"].on .count {
  color: #000;
  font-weight: bold;
}

/* 기본 상태 (비활성화) */
.tab-list li button {
  background-color: #f5f5f5 !important;
  color: #333 !important;
  font-weight: normal !important;
  border: none !important;
  border-top: 3px solid transparent !important;
  width: 100%;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  cursor: pointer;
  box-sizing: border-box;
}

/* 활성화 상태 (.on이 li에 붙든 button에 붙든 작동 처리) */
.tab-list li.on button,
.tab-list li button.on {
  background-color: #fff !important;
  color: #000 !important;
  font-weight: bold !important;
  border-top: 3px solid #000 !important;
}

/* 카운트 숫자 색상 유지 */
.tab-list button .count {
  color: #ff6b35;
  font-size: 12px;
  font-weight: normal;
}



@media (max-width: 767px) {
  .tab-list {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0;
    width: 100%;
  }

  .tab-list button[role="tab"] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    min-height: 58px;
    height: auto;
    padding: 8px 2px;
    font-size: 10px;
    line-height: 1.4;
    white-space: nowrap;
  }

  /* 상품후기·상품문의 수량: 이름 아래 줄 */
  .tab-list button[role="tab"] .count {
    display: block;
    flex: none;
    margin: 3px 0 0;
    font-size: 12px;
    line-height: 1.2;
    color: #666;
    font-weight: normal;
    white-space: nowrap;
	color: #ff6b35; /
  }
}


/* 480px 이하 */
@media screen and (max-width:479px) {
	#header span.logo img {max-height:40px;}
	#header span.logo { top: -45px;}
	#header .search_wrapW {padding-left:140px;}


	.menu_btn .active span {background-color:transparent !important;}
	.w_gnb.on .gnb > ul {justify-content: flex-start; flex-wrap: wrap;}
	.w_gnb .gnb > ul > li > a > span {font-size:14px;}
	.w_gnb .gnb > ul > li {padding:0px 5px}
	.w_gnb .gnb .event_btn {padding:0px 2% 0px 2%;}
	.w_gnb .gnb .event_btn > a  {font-size:14px;}
	.w_gnb .gnb .event_btn > a > span {font-size:11px; height:27px;}
	.w_gnb .gnb > ul > li.gnb4 {display:none;}
	.w_gnb .gnb > ul > li.gnb5 {display:none;}

	.slide_menu_wrap .gnb > ul > li > a {padding-left:30px;}
	.slide_menu_wrap .gnb .sub_menu > li > a {padding-left:30px;}
	.section {font-size:13px; padding:30px 10px;}
	.m_tit {font-size:26px;}
	.m_tit_wrap .dec {font-size:15px; line-height:1.4em;}
	.main_visual .bx-controls {bottom:10px;}
	/* .main_visual .bx-wrapper .bx-pager.bx-default-pager a {width:40px; height:5px;} */
	.customer_board .box {padding:20px 0px}

    .product_img_wrap .prd_name .txt_s {margin-top:50px;}

	.product_list .box {padding:10px;}
	.product_list .box .info .name {font-size:13px;}
	.product_list .box .info .place {font-size:14px;}
	.product_list > ul.three > li {width:50%}

	.product_list .box .info .bt {height:43px; font-size:14px;}
	.product_list .box .info .flag_wrap .flag {min-width: 43px; line-height: 24px; height: 22px; font-size: 12px; padding: 0px 5px; margin-left: 4px;}
	.product_list .box .info .flag_wrap {margin: 0px -10px 20px -10px; }
	.product_list .box .info .sale_wrap {font-size:12px;}

	.product_img_wrap .product_info > h3 {font-size:18px;}
	.product_img_wrap .btn_group > li > button {font-size:14px;margin-top:10px;}
	.product_img_wrap select {font-size:14px;}
	.product_img_wrap .tip {font-size:12px;}
	.product_info_wrap {padding:10px 10px;}
	.product_info_wrap .item_price > h2 {font-size:18px;}
	.product_info_wrap .price_list > li {font-size:15px;}
	.product_info_wrap .price_list2 > li {font-size:14px;}
	.product_info_wrap .end_btn > li > a {font-size:26px;}
	.product_img_wrap .select_price {font-size:14px;}

    .product_view .order_btn2 > li button {margin-top:10px;}
	.product_view .order_btn2 > li button .small {margin-top:-5px;}


	.customer_board .box > h3 {font-size:20px;}
	.customer_board .box .board ul > li .txt_s {font-size:12px;}
	.customer_board .box .board ul > li .txt_t {font-size:15px;}
	.customer_board .box .board ul > li {padding-bottom: 10px; margin-bottom: 10px;}
	#footer .navi {font-size: 13px; justify-content: center;}
	#footer .customer .box img {max-width:70%}
	#footer .customer {text-align:center;}
	#footer .customer .f_sns {justify-content: center;}
	#footer .customer .f_logo {justify-content: center;}
	#footer .customer .center .f_navi {justify-content: center;}
	#footer .customer .box {width:100%; padding:0px;}
	#footer .customer .center {font-size:13px; padding:10px 0px;}
	#footer .addressW {font-size:12px; text-align:center;}
	#footer .ico {justify-content: center;}
	#footer .f_sns > li {width:100%}
	#footer .sns {padding:10px 0px 0px 0px; justify-content: center;}
	#footer .sns > li img {max-width:50px;}

    .prd_tab > li {width:33.33333%;}
	.prd_tab > li > a {font-size:10px; text-align:center;}
	.prd_tab > li > a .count {display:block; width:100%; font-size: 10px;}
	.price_tab > li > a {height:35px; font-size:12px;}
	.product_img_wrap .radio_group > li > input[type="radio"] + label {font-size:14px;}
	.price_tab > li {width:50%;}
	/* .card_list > ul > li {width:100% !important}
	.card_list .box {padding:10px !important} */

	#lsTB .fr ul {display:flex; }
	#lsTB .fr ul li {padding:0px 7px !important}

	.b_quick_wrap .inner {padding:10px 0px;}
	.b_quick_wrap .inner > ul {font-size:12px;}
	.b_quick_wrap .inner .bt > a {height:32px;}

	.card_list > ul > li {width:100%; padding:10px;}
	.card_list .box {padding:10px;}

	.geBoard_box .geBoard_info .subject {font-size:16px !important; padding:10px 0px !important;}
	.geBoard_box .geBoard_info p {font-size:13px !important;}
	.geBoard_box .geBoard_info .resperiod span {font-size:13px !important;}

	.person-tb th {padding-left:10px !important}
	#content_area, #content_area_gallery_event, .review_window {box-sizing:border-box; padding-left:10px !important; padding-right:10px !important}

	.pop_wrap .pop_head .title {font-size:16px;}
	.table_style1 {font-size:12px;}
	.used_phone .f17 {font-size:14px !important}
	.pop_wrap .pop_body {padding:10px !important}
	.bul01 > li {padding-left:10px;}
	.bul01 > li:after {  width: 3px; height: 3px; top: 6px;}

	.board_gallery > li {width:100% !important}


.tab-list button[role="tab"] {
  font-size: 10px;
}

}