@charset "utf-8";

/***************************************************************************/
/*					                 고객센터/이벤트/고객후기                                      /
/***************************************************************************/

/* ----------------------  고객센터 메인  ---------------------- */
.help-wrap {width: 100%;margin:43px auto 0;display: flex;justify-content: space-between;border-top: 2px solid #333;border-bottom: 1px solid #e1e1e1;}
.help-iconbox {width: 25%;border-right: 1px solid #e4e4e4;background-color:#f7f7f7;}
.help-iconbox:last-child {border-right: none;}
.help-iconbox a {display: flex;flex-direction: column;align-items: center;justify-content: center;text-align: center;cursor: pointer;padding:60px 0;width: 100%;height: 100%;}
.help-iconbox a:hover {background-color: #fff;}
.help-iconbox a .iconbox {display: flex;flex-direction: column;align-items: center;justify-content: center;}
.help-iconbox a .iconbox img {width:75px;height:75px;}
.help-iconbox a .tit {padding-top:20px;font-size: 1.2rem;font-weight:500;}
.help-iconbox a .stxt {padding:5px 50px 0 50px;font-size: 0.8rem;color: #666;line-height: 1.5;font-family: "Nanum Gothic", sans-serif;}

/* ----------------------  게시판 공통  ---------------------- */
/* 목록 */
.toggle-wrap {100%;}
.toggle-search-area {display: flex;justify-content: flex-end;padding-bottom: 10px;}
.toggle-search-box {display: flex;overflow: hidden;}
.toggle-search-box input {border: 1px solid #ccc;padding:6px 12px;outline: none;font-size:0.9rem;font-weight:300;border-radius:2px 0 0 2px;border-right:none !important;}
.toggle-search-box input::placeholder {color: #8e8f93;font-weight:300;font-size:0.86rem;letter-spacing:-0.5px;}
.toggle-search-box button {background-color: #4d4d4d;border-right:none;color:#fff;border:none;padding:6px 12px;cursor: pointer;font-size:0.8rem;border-radius:0 2px 2px 0;}
.toggle-board-header {border-top: 2px solid #333;border-bottom: 1px solid #e1e1e1;background:#f7f7f7;padding:10px 0;font-weight:400;display: flex;justify-content: space-between;}
.toggle-board-header span {text-align: center;font-size:0.8rem;}
.toggle-board-header-none {margin-top:0;border-top: 2px solid #333;}
.toggle-board-header-view {margin-top:43px;border-top: 2px solid #333;}
.toggle-board-header-mtop {margin-top:43px;border-top: 2px solid #333;border-bottom: 1px solid #e1e1e1;background:#f7f7f7;padding:10px 0;font-weight:400;display: flex;justify-content: space-between;}
.toggle-board-header-mtop span {text-align: center;font-size:0.8rem;}
.header-number {flex: 0 0 50px; /* 컬럼 너비 */text-align: center;}
.header-title {flex-grow: 1;padding-left: 10px;text-align:center;}
.header-views {flex: 0 0 50px; /* 컬럼 너비 */margin-right:5px;text-align: right;}
.header-date {flex: 0 0 50px; /* 컬럼 너비 */margin-right:22px;text-align: center;}
.toggle-board-list {margin-bottom: 20px;}
.toggle-board-item {border-bottom: 1px solid #e1e1e1;cursor: pointer;}
.item-summary {display: flex;justify-content: space-between;align-items:center;padding:13px 0;}
.item-number {flex: 0 0 50px; /* 컬럼 너비 */text-align: center;font-size:0.8rem;font-family: "Roboto", sans-serif;}
.item-title {flex-grow: 1;padding-left: 10px;font-size:0.94rem;}
.item-title-view {flex-grow: 1;padding-left: 10px;font-size:0.94rem;}
.item-page {flex: 0 0 60px; /* 컬럼 너비 */margin-right:15px;text-align: right;color: #777;font-size:0.8rem;font-family: "Roboto", sans-serif;}
.item-date {flex: 0 0 150px; /* 컬럼 너비 */margin-right:15px;text-align: right;color: #777;font-size:0.8rem;font-family: "Roboto", sans-serif;}
.item-date-time {flex: 0 0 150px; /* 컬럼 너비 */margin-right:15px;text-align: right;color: #777;font-size:0.8rem;font-family: "Roboto", sans-serif;}
.item-detail-myq {padding: 20px 20px 50px 20px;background-color:#fff;border-top: 1px solid #e1e1e1;line-height: 1.6;font-size:0.92rem;}
.item-detail {padding: 20px 0;background-color:#f7f7f7;border-top: 1px solid #e1e1e1;}
.detail-content {padding:20px 60px;line-height: 1.5;font-size:0.92rem;min-height: 100px;display: flex;flex-direction: column;}
.detail-content .bottom-date {margin-top: auto;text-align:right;padding-top:30px;color: #777;font-size:0.8rem;font-family: "Roboto", sans-serif;}
.board-pagination {display: flex;justify-content: space-between;align-items: center;}
.board-pagination button {padding:8px 25px;background:#413e3e;color:#fff;font-size:0.9rem;font-weight:400;cursor: pointer;}
.board-pagination-center {display: flex;justify-content: center;align-items: center;}
.board-pagination-center button {padding:8px 25px;margin:0 5px;background:#413e3e;color:#fff;font-size:0.9rem;font-weight:400;cursor: pointer;}
.btn-board-write {display: flex;justify-content: flex-end;}
.btn-board-write button {padding:8px 25px;background:#413e3e;color:#fff;font-size:0.9rem;font-weight:400;cursor: pointer;}
.item-wait-icon {margin-left:10px;display:inline-block;padding:2px 7px;background:#fff;border:1px solid #ccc;font-size:0.76rem;color:#666;border-radius:2px;}
.item-reply-icon {margin-left:10px;display:inline-block;padding:2px 7px;background:#fff;border:1px solid #e30303;color:#e30303;font-size:0.76rem;font-weight:400;border-radius:2px;}
.qna-bottom-txt {text-align:center;padding-top:20px;font-size:0.86rem;color:#666;}

/* 글쓰기 */
.item-write {margin-top:43px;margin-bottom:20px;border-top: 2px solid #333;border-bottom: 1px solid #e1e1e1;}
.item-write-row {display: flex;flex-direction: row;align-items:center;padding:15px 0;border-bottom: 1px solid #e1e1e1;}
.item-write-row:last-child {border-bottom:none;}
.item-write-row label {width:15%;font-size: 0.9rem;display: flex;align-items: center;}
.item-write-row input {width:50%;height: 36px;line-height: 36px;padding: 8px;border: 1px solid #ccc;font-size: 1rem;font-weight:300;}
.item-write-row textarea {width:85%;height:200px;border: 1px solid #ccc;padding:8px;font-size:1rem;font-weight:300;border-radius:2px;}
.item-name {padding:15px 0;border-bottom: 1px solid #e1e1e1;font-weight:500;}
.item-product-pic {display: flex;flex-direction: row;align-items:center;padding:15px 0;border-bottom: 1px solid #e1e1e1;}
.item-product-pic label {width:15%;font-size: 0.9rem;display: flex;align-items: center;}
.item-product-pic .image-selector {width:85%;display: flex;align-items: center;}
.navigation-arrow {font-size: 2em;color: #333;cursor: pointer;user-select: none;}
.product-images {display: flex;gap: 15px;justify-content: flex-start;flex-grow: 1;align-items: flex-end;padding: 0 30px;}
.product-item {display: flex;flex-direction: column;align-items: center;}
.product-item img {width:100px;height: 100px;}
.radio-button-container {margin-top: 10px;}
.radio-button-container input[type="radio"] {-webkit-appearance: none;-moz-appearance: none;appearance: none;width: 20px;height: 20px;border: 1px solid #666;border-radius: 50%;outline: none;cursor: pointer;
background-color: #fff; display: inline-block; /* ::before 가상 요소를 위한 display 설정 */position: relative; /* ::before 가상 요소를 중앙에 배치하기 위함 */transition: border-color 0.2s ease-in-out; /* 테두리 색상 전환 효과 */}
.radio-button-container input[type="radio"]:checked {border-color: #666; /* 선택 시 외부 테두리 색상 */}
.radio-button-container input[type="radio"]:checked::before {content: ''; /* 가상 요소에 필수 */display: block;width: 12px;height: 12px;background-color: #666;border-radius: 50%;position: absolute;
top: 50%;left: 50%;transform: translate(-50%, -50%); /* 내부 원을 정확히 중앙에 배치 */transition: background-color 0.2s ease-in-out; /* 내부 원 색상 전환 효과 */}
.item-pic-row {display: flex;flex-direction: row;align-items:center;padding:12px 0;border-bottom: 1px solid #e1e1e1;}
.item-pic-row label {width:15%;font-size: 0.9rem;display: flex;align-items: center;}
.item-pic-row .pic-upload {width:85%;}
.item-pic-row .pic-upload .pic-row {width:100%;display: flex;flex-direction: row;padding:3px 0;}
.item-pic-row .pic-upload .pic-row input {width:35%;height: 36px;line-height: 36px;padding: 8px;border: 1px solid #ccc;border-right:none;border-radius:2px 0 0 2px;font-size: 1rem;font-weight:300;}
.item-pic-row .pic-upload .pic-row button {height:36px;line-height:36px;font-size:0.86rem;padding:0 15px;letter-spacing:-0.5px;text-align:center;background-color:#f0f0f0;border-radius:0 2px 2px 0;border: 1px solid #ccc;cursor: pointer;}

/* ----------------------  이벤트  ---------------------- */
/* 이벤트 목록 */
.tab-container {width:100%;margin-top:40px;}
.tabs {display: flex;justify-content: center;}
.tab-button {padding:12px 60px;border:1px solid #e1e1e1;border-bottom:1px solid #444;background:#fff;cursor:pointer;font-size:0.96rem;font-weight:400;color:#888;}
.tab-button.active {background:#444;border:1px solid #444;border-bottom:1px solid #222;color:#fff;}
.tab-button:first-child {border-radius:2px 0 0 2px;}
.tab-button:last-child {border-radius:0 2px 2px 0;}
.tab-content-wrapper {width:100%;margin-top:20px;padding-bottom:30px;}
.tab-content {display: none;}
.tab-content.active {display: block;}
.event-row {display: flex;justify-content: space-between;flex-wrap: wrap;}
.event-row .event-thum {position: relative;width:32%;margin:20px 0;transition: transform 0.3s ease-in-out;}
.event-row .event-thum:hover {transform: translateY(-6px); /* Y축으로 -6px 이동 (위로) */}
.event-row .event-thum .event-icon {position:absolute;left:0;top:0;z-index:2;}
.event-row .event-thum .event-icon img {width:70px;height:70px;}
.event-row .event-thum .eimgbox {position: relative;}
.event-row .event-thum .eimgbox a img {width:100%;object-fit:cover;}
.event-row .event-thum .eimgbox img {width:100%;object-fit:cover;}
.event-row .event-thum .eimgbox .event-ended {position: absolute;top: 0;left: 0;width:100%;height:100%;background-color: rgba(0, 0, 0, 0.6);z-index: 1;display: flex;flex-direction: column;align-items:center;justify-content: center;}
.event-row .event-thum .eimgbox .event-ended .end-txt {color:#fff;font-size:1rem;font-weight:400;padding:10px 40px;border:2px solid #fff;border-radius:999px;text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);}
.event-row .event-thum .event-tit {padding:15px 0 2px 0;font-weight:500;font-size:1.1rem;}
.event-row .event-thum .event-date {font-size:0.86rem;}

/* 이벤트 상세 */
.event-detail-wrap {width:100%;margin-top:40px;}
.event-detail-top {display: flex;justify-content: space-between;align-items:center;padding:0 0 20px 0;}
.event-detail-top .back-list {width:20%;}
.event-detail-top .back-list button {height:36px;line-height:34px;background:#fff url('/design/img/arrow_left.png') no-repeat 5px 11px;background-size:13px 13px;border: 1px solid #ccc;padding:0 20px 0 30px;cursor: pointer;font-size:0.8rem;font-weight:400;}
.event-detail-top .event-dtit {font-size:1.4rem;font-weight:500;padding:0 100px;line-height:1.5;}
.event-detail-top .sharebox {position: relative;width:20%;top:-14px;}
.event-detail-img {width:100%;}
.event-detail-img img {width:100%;}
.event-bottom-list {margin-top:40px;}
.btn-event-all {display: block;margin:60px auto;width:40%;height:70px;background:#f7f7f7;border:1px solid #e1e1e1;text-align:center;font-size:1rem;line-height:70px;font-weight:400;}


/* ----------------------  구매후기  ---------------------- */
/* 상단배너 */
.review-top-ban {width:100%;margin:40px 0 0 0;width:1300px;height:130px;display:block;background: url("../img/ban_review.jpg") no-repeat left top;background-size:1300px 130px;cursor: pointer;color: transparent;text-indent: -9999px;}

/* 베스트 후기 */
.review-best-wrap {margin-top:50px;padding-bottom:20px;}
.review-best-wrap > .tit {font-size:1.2rem; font-weight:600;padding-bottom:10px;}
.review-best-row {width:100%;display: flex;justify-content:space-between;flex-wrap: wrap; border-top: 2px solid #333;border-bottom: 1px solid #e1e1e1;padding: 30px 0;}
.review-best-row .review-best {position: relative;width:32%;flex-direction: column; align-items: center;}
.image-placeholder {position:relative;}
.image-placeholder .rank {position:absolute;left:10px;top:0;z-index:6;}
.image-placeholder .rank img {width:80px;height:90px;filter: brightness(1) contrast(1);}
.image-placeholder img {width: 100%;height: auto;aspect-ratio: 1 / 1;object-fit: cover;filter: brightness(1.1) contrast(1.05);z-index:5;}
.review-text {padding-bottom:10px;}
.text-description {padding:20px 40px 0 0;font-size: 0.86rem;font-family: 'Nanum Gothic', sans-serif;}
.text-date {padding:20px 0 0 0;font-size: 0.76rem; color: #888; margin-top: auto; font-family: "Nanum Gothic", sans-serif;}
.text-date > span {color:#ccc;padding:0 8px;}

/* 포토리뷰 */
.photo-review-wrap {position: relative;margin-top: 30px;padding-bottom: 20px;}
.photo-review-wrap > .tit {font-size: 1.2rem;font-weight: 600;padding-bottom: 10px;}
.photo-review-wrap > button {position: absolute;right: 0;top: -8px;height: 38px;line-height: 36px;background:#f7f7f7;border: 1px solid #ccc;padding: 0 15px;cursor: pointer;font-size: 0.8rem;font-weight: 400;}
.photo-container {position: relative; width: 100%;display: flex;align-items: center;border-top: 2px solid #333;border-bottom: 1px solid #e1e1e1;padding:30px 0; overflow: hidden;}
.photo-wrapper {overflow: hidden;flex-grow: 1;}
.photo-track {display: flex;justify-content:space-between;transition: transform 0.5s ease-in-out;}
.photo-item {min-width: calc(100% / 4);width:25%;display: flex;justify-content: center;align-items: center;}
.photo-item img {width: 100%;height: auto;aspect-ratio: 1 / 1;object-fit: cover;filter: brightness(1.1) contrast(1.05);}
.nav-button {position: absolute;top: 50%;transform: translateY(-50%);background-color: rgba(0, 0, 0, 0.5);color: white;border: none;padding: 15px;
cursor: pointer;font-size:3rem;z-index: 10;width: 60px;height: 60px;display: flex;justify-content: center;align-items: center;transition: background-color 0.3s ease;flex-shrink: 0;}
.nav-button:hover {background-color: rgba(0, 0, 0, 0.8);}
.prev-button {left:0;}
.next-button {right:0;}

/* 2열 후기*/
.review-wrap {width:100%;margin:10px auto 0;padding-bottom:40px;}
.review-row {width:100%;display: flex; justify-content: space-between;flex-wrap: wrap;}
.review-txtbox {width: 49.2%;display: flex; justify-content: space-between;margin-top:15px;border:1px solid #e1e1e1;padding:20px;cursor:pointer;}
.review-imgbox {width: 49.2%;display: flex; justify-content: space-between;margin-top:15px;border:1px solid #e1e1e1;padding:20px;cursor:pointer;}
.review-content-txt1 {width:100%; display: flex;flex-direction: column;}
.review-content-txt1 p {margin-bottom:15px;padding:0 30px 0 0;font-size: 0.86rem;font-family: 'Nanum Gothic', sans-serif;}
.review-image-box {width: 20%;}
.review-image-box  img {width: 100%; object-fit:cover;}
.review-content-txt2 {width: 76%; display: flex;flex-direction: column;}
.review-content-txt2  p {width: 90%; margin-bottom:15px; font-size: 0.86rem;font-family: 'Nanum Gothic', sans-serif;}
.review-author-column {font-size: 0.76rem; color: #888;font-family: "Nanum Gothic", sans-serif;}
.review-author-column span {color:#ccc;padding:0 8px;}

/* 리뷰상세보기(모달창) */
.modal-mask {position: fixed;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0, 0, 0, 0.8);display: none;z-index: 999;}
.modal-review {position: fixed;top: 50%;left: 50%;transform: translate(-50%, -50%);width:40%;background:#fff;box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);display: none;z-index: 1000;}
.modal-open .modal-mask, .modal-open .modal-review {display: block;}
.btn-close-review {position: absolute;top:-10px;right:15px;color: #222;font-size:2.6rem;font-weight:300;cursor: pointer;z-index: 1001;}
.modal-review-inner {padding:20px;}
.modal-top-tit {font-size:1.2rem; font-weight:600;margin-top:10px; margin-bottom: 10px;}
.modal-product { width: 100%; display: flex; flex-direction: row; border-top: 2px solid #333; border-bottom: 1px solid #e1e1e1; padding: 20px 0; }
.modal-product .product-pic { width: 70px; }
.modal-product .product-pic img { width: 70px; height: 70px; }
.modal-product .product-info { padding-left: 15px; display: flex; flex-direction: column; justify-content: space-between; height: 70px; /* 실제 레이아웃에 맞춰 조절 필요 */ }
.modal-product .product-info .product-tit { margin-bottom: 8px; font-size: 1rem; font-weight:400; }
.modal-product .product-info .review-info { font-size: 0.76rem; color: #888; font-family: "Nanum Gothic", sans-serif; }
.modal-product .product-info .review-info span { color: #ccc; padding: 0 8px; }
.modal-reivew-txt {padding:20px 0;overflow-x: hidden;overflow-y: auto;max-height:400px;}
.modal-reivew-txt .imgbox {width:40%;margin:0 auto;}
.modal-reivew-txt .imgbox img {width: 100%;height: auto;aspect-ratio: 1 / 1;object-fit: cover;}
.modal-reivew-txt .txtbox {padding-top:20px;font-size: 0.86rem;font-family: 'Nanum Gothic', sans-serif;}
.btn-close-bottom {width:100%;height:54px;line-height:53px;background:#f7f7f7;border:1px solid #e1e1e1;text-align:center;font-size:1rem;font-weight:400;}


/***************************************************************************/
/*					                      모바일 (최대 479px)			                             /
/***************************************************************************/
@media (max-width: 479px) {

/* 아이폰 둥근모서리 제거 */
input[type="text"] {-webkit-appearance: none; /* iOS Safari 기본 스타일 제거 */border-radius: 2px; box-shadow: none;}

/* ----------------------  고객센터 메인  ---------------------- */
.help-wrap {margin:10px auto 0;flex-wrap: wrap;border-bottom: none;}
.help-iconbox {width: 50%; flex-basis: 50%;border-right: 1px solid #e4e4e4;border-bottom: 1px solid #e1e1e1;background-color: #f7f7f7;}
.help-iconbox:nth-child(2n) {border-right: none;}
.help-iconbox:nth-last-child(-n + 2) {border-bottom: none;}
.help-iconbox a {padding:20px 0;}
.help-iconbox a:hover {background-color: #f7f7f7;}
.help-iconbox a .iconbox img {width:40px;height:40px;}
.help-iconbox a .tit {padding-top: 15px;font-size: 1rem;}
.help-iconbox a .stxt {padding:5px 20px 0 20px;font-size: 0.7rem;line-height:1.4;}

/* ----------------------  게시판 공통  ---------------------- */
/* 목록 */
.toggle-search-area {display: flex;justify-content: flex-end;padding-bottom:10px;}
.toggle-search-box {display: flex;overflow: hidden;}
.toggle-search-box input {width:150px;border:1px solid #ccc;padding:8px 12px;outline: none;font-size:0.9rem;font-weight:300;border-right:none !important;border-radius:2px 0 0 2px;}
.toggle-search-box input::placeholder {color: #8e8f93;font-weight:300;font-size:0.86rem;letter-spacing:-0.5px;}
.toggle-search-box button {background-color: #4d4d4d;border-right:none;color:#fff;border:none;padding:8px 12px;cursor: pointer;font-size:0.8rem;border-radius:0 2px 2px 0;}
.toggle-board-header {border-top: 2px solid #333;border-bottom: 1px solid #e1e1e1;background:#f7f7f7;padding:8px 0;font-weight:400;display: flex;justify-content: space-between;}
.toggle-board-header-none {margin-top:0;border-top: 2px solid #333;}
.toggle-board-header-mtop {margin-top:10px;border-top: 2px solid #333;border-bottom: 1px solid #e1e1e1;background:#f7f7f7;padding:8px 0;font-weight:400;display: flex;justify-content: space-between;}
.toggle-board-header-view {margin-top:10px;border-top: 2px solid #333;}
.header-number {flex: 0 0 36px; /* No 컬럼 너비 */text-align: center;}
.header-title {flex-grow: 1;padding-left: 10px;text-align:center;}
.header-views {flex: 0 0 36px; /* 컬럼 너비 */margin-right:15px;text-align: right;}
.header-date {flex: 0 0 50px; /* 컬럼 너비 */margin-right:15px;text-align: center;}
.toggle-board-list {margin-bottom:0;outline:none;-webkit-tap-highlight-color: rgba(0,0,0,0);}
.item-summary {display: flex;justify-content: space-between;align-items:center;padding:8px 0;}
.item-number {flex: 0 0 36px; /* 컬럼 너비 */text-align:center;font-size:0.8rem;font-family: "Roboto", sans-serif;}
.item-title {flex-grow: 1;padding:0 10px;font-size:0.9rem;}
.item-title-view {flex-grow: 1;padding:0 10px;font-size:0.9rem;line-height:1.2;}
.item-page {flex: 0 0 36px; /* 컬럼 너비 */margin-right:15px;text-align: right;color: #777;font-size:0.8rem;font-family: "Roboto", sans-serif;}
.item-detail {padding:10px 0;background-color:#f7f7f7;border-top: 1px solid #e1e1e1;color: #555;}
.item-date {flex: 0 0 80px; /* 컬럼 너비 */margin-right:15px;text-align: right;color: #777;font-size:0.8rem;font-family: "Roboto", sans-serif;}
.item-date-time {flex: 0 0 120px; /* 컬럼 너비 */margin-right:5px;text-align: right;color: #777;font-size:0.8rem;font-family: "Roboto", sans-serif;}
.detail-content {padding:20px 30px;line-height: 1.4;font-size:0.9rem;min-height:40px;}
.item-detail-myq {padding: 20px 0 30px 0;background-color:#fff;border-top: 1px solid #e1e1e1;line-height: 1.5;font-size:0.92rem;}
.item-name {padding:10px 0;border-bottom: 1px solid #e1e1e1;font-weight:500;font-size:0.96rem;}
.item-product-pic {display: flex;flex-direction: row;align-items:center;padding:8px 0;border-bottom: 1px solid #e1e1e1;}
.item-product-pic label {width:30%;font-size: 0.9rem;display: flex;align-items: center;}
.item-product-pic .image-selector {width:70%;display: flex;align-items: center;}
.navigation-arrow {font-size: 1.5em;color: #333;cursor: pointer;user-select: none;}
.product-images {display: flex;gap: 10px;justify-content:center;flex-grow: 1;align-items: flex-end;padding: 0 10px;}
.product-item {display: flex;flex-direction: column;align-items: center;}
.product-item img {width:60px;height: 60px;}
.radio-button-container {margin-top:5px;}
.radio-button-container input {-webkit-appearance: none;-moz-appearance: none;appearance: none;width: 20px;height: 20px;border: 1px solid #666;border-radius: 50%;outline: none;cursor: pointer;
background-color: #fff; display: inline-block;position: relative;transition: border-color 0.2s ease-in-out;outline:none;-webkit-tap-highlight-color: rgba(0,0,0,0);}
.item-pic-row {display: flex;flex-direction: row;align-items:center;padding:6px 0;border-bottom: 1px solid #e1e1e1;}
.item-pic-row label {width:30%;font-size: 0.9rem;display: flex;align-items: center;}
.item-pic-row .pic-upload {width:70%;}
.item-pic-row .pic-upload .pic-row {width:100%;display: flex;flex-direction: row;padding:3px 0;}
.item-pic-row .pic-upload .pic-row input {width:70%;height: 36px;line-height: 36px;padding: 8px;border: 1px solid #ccc;border-right:none;border-radius:2px 0 0 2px;font-size: 1rem;font-weight:300;}
.item-pic-row .pic-upload .pic-row button {width:30%;height:36px;line-height:36px;font-size:0.86rem;padding:0;letter-spacing:-0.5px;text-align:center;background-color:#f7f7f7;border-radius:0 2px 2px 0;border: 1px solid #ccc;cursor: pointer;}
.item-wait-icon {margin-left:5px;display:inline-block;padding:2px 4px;background:#fff;border:1px solid #ccc;font-size:0.66rem;color:#666;font-weight:400;border-radius:2px;}
.item-reply-icon {margin-left:5px;display:inline-block;padding:2px 4px;background:#fff;border:1px solid #e30303;color:#e30303;font-size:0.66rem;font-weight:400;border-radius:2px;}

/* 글쓰기 */
.item-write {margin-top:10px;margin-bottom:0;border-top: 2px solid #333;border-bottom: 1px solid #e1e1e1;}
.item-write-row {display: flex;flex-direction: row;align-items:center;padding:6px 0;border-bottom: 1px solid #e1e1e1;}
.item-write-row:last-child {border-bottom:none;}
.item-write-row label {width: 30%;font-size: 0.86rem;font-weight:300;display: flex;align-items: center;}
.item-write-row input {height: 36px;padding: 8px;border: 1px solid #ccc;font-size: 1rem;font-weight: 400;line-height: 36px;}
.item-write-row textarea {width:70%;height:140px;border: 1px solid #ccc;padding:8px;font-size:1rem;font-weight:300;border-radius:2px;}

/* 하단버튼 */
.board-pagination {display: flex;justify-content: space-between;align-items: center;margin-top:10px;}
.board-pagination button {padding:6px 22px;background:#413e3e;color:#fff;font-size:0.86rem;font-weight:400;cursor: pointer;}
.board-pagination-center {display: flex;justify-content: center;align-items: center;margin-top:10px;}
.board-pagination-center button {padding:6px 22px;margin:0 5px;background:#413e3e;color:#fff;font-size:0.86rem;font-weight:400;cursor: pointer;}
.btn-board-write {display: flex;justify-content: flex-end;margin-top:10px;}
.btn-board-write button {padding:6px 22px;background:#413e3e;color:#fff;font-size:0.86rem;font-weight:400;cursor: pointer;}

/* ----------------------  이벤트  ---------------------- */
/* 이벤트 목록 */
.tab-container {width:100%;margin-top:15px;}
.tabs {display: flex;justify-content: center;}
.tab-button {width:50%;padding:10px 0;border:1px solid #e1e1e1;border-bottom:1px solid #444;background:#fff;cursor:pointer;font-size:0.9rem;font-weight:400;color:#888;outline:none;-webkit-tap-highlight-color: rgba(0,0,0,0);}
.tab-button.active {background:#444;border:1px solid #444;border-bottom:1px solid #222;color:#fff;}
.tab-button:first-child {border-radius:2px 0 0 2px;}
.tab-button:last-child {border-radius:0 2px 2px 0;}
.tab-content-wrapper {width:100%;margin-top:0;padding-bottom:10px;}
.event-row .event-thum {position: relative;width:100%;margin:20px 0 10px 0;transition: transform 0.3s ease-in-out;cursor:pointer;}
.event-row .event-thum:hover {transform: translateY(0);}
.event-row .event-thum .event-icon {position:absolute;left:0;top:0;z-index:2;}
.event-row .event-thum .event-icon img {width:60px;height:60px;}
.event-row .event-thum .eimgbox {position: relative;}
.event-row .event-thum .eimgbox img {width:100%;object-fit:cover;}
.event-row .event-thum .eimgbox .event-ended {position: absolute;top: 0;left: 0;width:100%;height:100%;background-color: rgba(0, 0, 0, 0.6);z-index: 1;display: flex;flex-direction: column;align-items:center;justify-content: center;}
.event-row .event-thum .eimgbox .event-ended .end-txt {color:#fff;font-size:1rem;font-weight:400;padding:10px 40px;border:2px solid #fff;border-radius:999px;text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);}
.event-row .event-thum .event-tit {padding:10px 0 0 0;font-weight:500;font-size:1.1rem;line-height:1.3;}
.event-row .event-thum .event-date {font-size:0.86rem;}

/* 이벤트 상세 */
.event-detail-wrap {width:100%;margin-top:15px;}
.event-detail-top {display: flex;justify-content: space-between;align-items:center;padding:0 0 15px 0;}
.event-detail-top .back-list {width:15%;}
.event-detail-top .back-list button {height:26px;line-height:24px;background:#fff url('/design/img/arrow_left.png') no-repeat center 6px;background-size:13px 13px;border: 1px solid #ccc;padding:0 13px;cursor: pointer;font-size:0.8rem;font-weight:400;text-indent: -9999px;}
.event-detail-top .event-dtit {font-size:1.05rem;font-weight:500;padding:0 10px;line-height:1.5;}
.event-detail-top .sharebox {position: relative;width:15%;top:-33px;}
.event-bottom-list {display:none;}
.btn-event-all {display: block;margin:20px auto;width:100%;height:46px;line-height:46px;line-height:46px;background:#f7f7f7;border:1px solid #e1e1e1;text-align:center;font-size:0.96rem;font-weight:500;}

/* ----------------------  구매후기  ---------------------- */
/* 상단배너 */
.review-top-ban {width:100%;margin:5px 0 0 0;width:100%;height:150px;display:block;background: url("../img/ban_review_m.jpg") no-repeat center center;background-size:contain;;cursor: pointer;color: transparent;text-indent: -9999px;}

/* 베스트 후기 */
.review-best-wrap {margin-top:10px;padding-bottom:20px;}
.review-best-wrap > .tit {font-size:1.1rem; font-weight:600;padding-bottom:5px;}
.review-best-row {width:100%;display: flex;justify-content:center;flex-wrap: wrap;border-top: 2px solid #333;border-bottom:1px solid #e1e1e1;padding:0;}
.review-best-row .review-best { position: relative; width: 100%;margin:0; padding:15px 0;display: flex; flex-direction: row; align-items: flex-start; border-bottom:1px solid #e1e1e1;}
.review-best:last-child { border-bottom: none; }
.image-placeholder { position: relative; width: 30%; display: flex; justify-content: center; align-items: flex-start; /* 여기도 flex-start로 변경하여 이미지 컨테이너 내부의 내용이 위로 붙게 함 */ flex-shrink: 0; }
.image-placeholder .rank { position: absolute; left: 5px; top: 0; z-index: 6; }
.image-placeholder .rank img { width:36px; height: 41px; filter: brightness(1) contrast(1); }
.image-placeholder img { width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: cover; filter: brightness(1.1) contrast(1.05); z-index: 5; }
.review-text { width: 70%; padding-left: 15px; display: flex; flex-direction: column;height: 100%; }
.text-description { padding: 0; font-size: 0.8rem; margin: 0; font-family: 'Nanum Gothic', sans-serif; line-height:1.4;}
.text-date { padding:10px 0 0 0; font-size: 0.76rem; color: #888; font-family: "Nanum Gothic", sans-serif;margin-top:0; }
.text-date > span { color: #ccc; padding: 0 8px; }

/* 포토리뷰 */
.photo-review-wrap {position: relative;margin-top:10px;padding-bottom:0;}
.photo-review-wrap > .tit {font-size:1.1rem; font-weight:600;padding-bottom:5px;}
.photo-review-wrap > button {position:absolute;right:0;top:-9px;height:32px;line-height:30px;background:#f7f7f7;border: 1px solid #ccc;padding:0 10px;cursor: pointer;font-size:0.8rem;font-weight:400;}
.photo-container {position: relative;width:100%;display: flex;align-items: center;border-top: 2px solid #333;border-bottom:1px solid #e1e1e1;padding:15px 0;overflow: hidden;}
.photo-wrapper {overflow: hidden;flex-grow: 1;}
.photo-track {display: flex;justify-content:space-between;transition: transform 0.5s ease-in-out;}
.photo-item {min-width: calc(100% / 4);width:25%;display: flex;justify-content: center;align-items: center;}
.photo-item img {width: 100%;height: auto;aspect-ratio: 1 / 1;object-fit: cover;filter: brightness(1.1) contrast(1.05);}
.nav-button {position: absolute;top: 50%;transform: translateY(-50%);background-color: rgba(0, 0, 0, 0.5);color: white;border: none;padding:10px;
cursor: pointer;font-size:1.8rem;z-index: 10;width:32px;height:32px;display: flex;justify-content: center;align-items: center;transition: background-color 0.3s ease;flex-shrink: 0;}
.nav-button:hover {background-color: rgba(0, 0, 0, 0.8);}
.prev-button {left:0;}
.next-button {right:0;}

/* 2열 후기*/
.review-wrap {width:100%;margin:10px auto 0;padding-bottom:0;}
.review-row {width:100%;display: flex; justify-content: space-between;flex-wrap: wrap;}
.review-txtbox {width: 100%;display: flex; justify-content: space-between;margin-top:10px;border:1px solid #e1e1e1;padding:15px;outline:none;-webkit-tap-highlight-color: rgba(0,0,0,0);}
.review-imgbox {width: 100%;display: flex; justify-content: space-between;margin-top:10px;border:1px solid #e1e1e1;padding:15px;outline:none;-webkit-tap-highlight-color: rgba(0,0,0,0);}
.review-content-txt1 {width:100%; display: flex;flex-direction: column;}
.review-content-txt1 p {margin-bottom: 10px; font-size: 0.8rem;line-height:1.4;font-family: 'Nanum Gothic', sans-serif;}
.review-image-box {width: 30%;}
.review-image-box  img {width: 100%; object-fit:cover;}
.review-content-txt2 {width: 70%; display: flex;flex-direction: column;padding-left:15px;}
.review-content-txt2 p {width: 100%; margin-bottom: 10px; font-size: 0.8rem;line-height:1.4;font-family: 'Nanum Gothic', sans-serif;}

/* 리뷰상세보기(모달창) */
.modal-mask {position: fixed;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0, 0, 0, 0.8);display: none;z-index: 999;}
.modal-review {position: fixed;top: 50%;left: 50%;transform: translate(-50%, -50%);width:90%;background:#fff;box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);display: none;z-index: 1000;}
.modal-open .modal-mask, .modal-open .modal-review {display: block;}
.btn-close-review {position: absolute;top:-10px;right:10px;color: #222;font-size:2.6rem;font-weight:300;cursor: pointer;z-index: 1001;}
.modal-review-inner {padding:20px;}
.modal-top-tit {font-size:1.2rem; font-weight:600;margin-top:5px; margin-bottom:5px;}
.modal-product { width: 100%; display: flex; flex-direction: row; border-top: 2px solid #333; border-bottom: 1px solid #e1e1e1; padding:10px 0; }
.modal-product .product-pic { width: 70px; }
.modal-product .product-pic img { width: 70px; height: 70px; }
.modal-product .product-info { padding-left: 15px; display: flex; flex-direction: column; justify-content: space-between; height: 70px;}
.modal-product .product-info .product-tit { margin-bottom: 8px;font-size:0.9rem; font-weight: 500;line-height:1.3;}
.modal-product .product-info .review-info { font-size: 0.76rem; color: #888; font-family: "Nanum Gothic", sans-serif; }
.modal-product .product-info .review-info span { color: #ccc; padding: 0 8px; }
.modal-reivew-txt {padding:20px 0;overflow-x: hidden;overflow-y: auto;max-height:210px;}
.modal-reivew-txt .imgbox {width:50%;margin:0 auto;}
.modal-reivew-txt .imgbox > img {width: 100%;height: auto;aspect-ratio: 1 / 1;object-fit: cover;}
.modal-reivew-txt .txtbox {padding-top:20px;font-size: 0.8rem;line-height:1.4;font-family: 'Nanum Gothic', sans-serif;}
.btn-close-bottom {width:100%;height:46px;line-height:44px;background:#f7f7f7;border:1px solid #e1e1e1;text-align:center;font-size:1rem;font-weight:500;}


}


/***************************************************************************/
/*					             기준 -일반 모바일 (480px ~ 767px)		   	             /
/***************************************************************************/
@media (min-width: 480px) and (max-width: 767px) {

/* ----------------------  고객센터 메인  ---------------------- */
.help-wrap {width: 100%;margin:20px auto 0;display: flex;justify-content: space-between;border-top: 2px solid #333;border-bottom: 1px solid #e1e1e1;}
.help-iconbox a .iconbox img {width:55px;height:55px;}
.help-iconbox a .stxt {padding:5px 10px 0 10px;font-size: 0.8rem;color: #666;line-height: 1.5;font-family: "Nanum Gothic", sans-serif;}

/* ----------------------  게시판 공통  ---------------------- */
/* 목록 */
.toggle-board-header-mtop {margin-top:20px;border-top: 2px solid #333;border-bottom: 1px solid #e1e1e1;background:#f7f7f7;padding:10px 0;font-weight:400;display: flex;justify-content: space-between;}

/* 글쓰기 */
.item-write {margin-top:20px;margin-bottom:20px;border-top: 2px solid #333;border-bottom: 1px solid #e1e1e1;}

/* ----------------------  이벤트  ---------------------- */
/* 이벤트 목록 */
.tab-container {width:100%;margin-top:20px;}
.tab-content-wrapper {width:100%;margin-top:0;padding-bottom:0;}
.event-row .event-thum .eimgbox .event-ended {position: absolute;top: 0;left: 0;width:100%;height:100%;background-color: rgba(0, 0, 0, 0.6);z-index: 1;display: flex;flex-direction: column;align-items:center;justify-content: center;}
.event-row .event-thum .eimgbox .event-ended .end-txt {color:#fff;font-size:0.86rem;font-weight:400;padding:10px 20px;border:2px solid #fff;border-radius:999px;text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);}

/* 이벤트 상세 */
.event-detail-wrap {width:100%;margin-top:20px;}
.event-detail-top .back-list {width:15%;}
.event-detail-top .event-dtit {font-size:1.4rem;font-weight:500;padding:0 30px;line-height:1.5;}
.event-detail-top .sharebox {position: relative;width:15%;top:-14px;}
.event-bottom-list {margin-top:20px;}
.btn-event-all {display: block;margin:40px auto;width:40%;height:70px;background:#f7f7f7;border:1px solid #e1e1e1;text-align:center;font-size:1rem;line-height:70px;font-weight:400;}

/* ----------------------  구매후기  ---------------------- */
/* 상단배너 */
.review-top-ban {width:100%;margin:20px 0 0 0;width:100%;height:90px;display:block;background: url("../img/ban_review.jpg") no-repeat center center;background-size:cover !important;cursor: pointer;color: transparent;text-indent: -9999px;}

/* 베스트 후기 */
.review-best-wrap {margin-top:30px;padding-bottom:10px;}
.image-placeholder .rank img {width:60px;height:70px;filter: brightness(1) contrast(1);}
.text-description {padding:20px 20px 0 0;font-size: 0.86rem;line-height:1.4;font-family: 'Nanum Gothic', sans-serif;}
.text-date {padding:10px 0 0 0;font-size: 0.76rem; color: #888; margin-top: auto; font-family: "Nanum Gothic", sans-serif;}
.text-date > span {color:#ccc;padding:0 8px;}

/* 포토리뷰 */
.photo-review-wrap {position: relative;margin-top: 30px;padding-bottom: 10px;}

/* 2열 후기*/
.review-wrap {width:100%;margin:10px auto 0;padding-bottom:20px;}
.review-content-txt1 p {margin-bottom:15px;padding:0 30px 0 0;font-size: 0.86rem;line-height:1.4;font-family: 'Nanum Gothic', sans-serif;}
.review-content-txt2  p {width: 90%; margin-bottom:15px; font-size: 0.86rem;line-height:1.4;font-family: 'Nanum Gothic', sans-serif;}

/* 리뷰상세보기(모달창) */
.modal-review {position: fixed;top: 50%;left: 50%;transform: translate(-50%, -50%);width:60%;background:#fff;box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);display: none;z-index: 1000;}
.modal-reivew-txt {padding:20px 0;overflow-x: hidden;overflow-y: auto;max-height:400px;line-height:1.4;}

}


/***************************************************************************/
/*					             기준-태블릿 (768px ~ 1023px)		   	                     /
/***************************************************************************/
@media (min-width: 768px) and (max-width: 1023px) {

/* ----------------------  고객센터 메인  ---------------------- */
.help-wrap {width: 100%;margin:20px auto 0;display: flex;justify-content: space-between;border-top: 2px solid #333;border-bottom: 1px solid #e1e1e1;}
.help-iconbox a .iconbox img {width:55px;height:55px;}
.help-iconbox a .stxt {padding:5px 10px 0 10px;font-size: 0.8rem;color: #666;line-height: 1.5;font-family: "Nanum Gothic", sans-serif;}

/* ----------------------  게시판 공통  ---------------------- */
/* 목록 */
.toggle-board-header-mtop {margin-top:20px;border-top: 2px solid #333;border-bottom: 1px solid #e1e1e1;background:#f7f7f7;padding:10px 0;font-weight:400;display: flex;justify-content: space-between;}

/* 글쓰기 */
.item-write {margin-top:20px;margin-bottom:20px;border-top: 2px solid #333;border-bottom: 1px solid #e1e1e1;}

/* ----------------------  이벤트  ---------------------- */
/* 이벤트 목록 */
.tab-container {width:100%;margin-top:20px;}
.tab-content-wrapper {width:100%;margin-top:0;padding-bottom:0;}
.event-row .event-thum .eimgbox .event-ended {position: absolute;top: 0;left: 0;width:100%;height:100%;background-color: rgba(0, 0, 0, 0.6);z-index: 1;display: flex;flex-direction: column;align-items:center;justify-content: center;}
.event-row .event-thum .eimgbox .event-ended .end-txt {color:#fff;font-size:0.86rem;font-weight:400;padding:10px 20px;border:2px solid #fff;border-radius:999px;text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);}

/* 이벤트 상세 */
.event-detail-wrap {width:100%;margin-top:20px;}
.event-detail-top .back-list {width:15%;}
.event-detail-top .event-dtit {font-size:1.4rem;font-weight:500;padding:0 30px;line-height:1.5;}
.event-detail-top .sharebox {position: relative;width:15%;top:-14px;}
.event-bottom-list {margin-top:20px;}
.btn-event-all {display: block;margin:40px auto;width:40%;height:70px;background:#f7f7f7;border:1px solid #e1e1e1;text-align:center;font-size:1rem;line-height:70px;font-weight:400;}

/* ----------------------  구매후기  ---------------------- */
/* 상단배너 */
.review-top-ban {width:100%;margin:20px 0 0 0;width:100%;height:90px;display:block;background: url("../img/ban_review.jpg") no-repeat center center;background-size:cover !important;cursor: pointer;color: transparent;text-indent: -9999px;}

/* 베스트 후기 */
.review-best-wrap {margin-top:30px;padding-bottom:10px;}
.image-placeholder .rank img {width:60px;height:70px;filter: brightness(1) contrast(1);}
.text-description {padding:20px 20px 0 0;font-size: 0.86rem;line-height:1.4;font-family: 'Nanum Gothic', sans-serif;}
.text-date {padding:10px 0 0 0;font-size: 0.76rem; color: #888; margin-top: auto; font-family: "Nanum Gothic", sans-serif;}
.text-date > span {color:#ccc;padding:0 8px;}

/* 포토리뷰 */
.photo-review-wrap {position: relative;margin-top: 30px;padding-bottom: 10px;}

/* 2열 후기*/
.review-wrap {width:100%;margin:10px auto 0;padding-bottom:20px;}
.review-content-txt1 p {margin-bottom:15px;padding:0 30px 0 0;font-size: 0.86rem;line-height:1.4;font-family: 'Nanum Gothic', sans-serif;}
.review-content-txt2  p {width: 90%; margin-bottom:15px; font-size: 0.86rem;line-height:1.4;font-family: 'Nanum Gothic', sans-serif;}

/* 리뷰상세보기(모달창) */
.modal-review {position: fixed;top: 50%;left: 50%;transform: translate(-50%, -50%);width:60%;background:#fff;box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);display: none;z-index: 1000;}
.modal-reivew-txt {padding:20px 0;overflow-x: hidden;overflow-y: auto;max-height:400px;line-height:1.4;}

}


/***************************************************************************/
/*					            노트북 (1024px ~ 1199px)		   	                             /
/***************************************************************************/
@media (min-width: 1024px) and (max-width: 1199px) {

/* ----------------------  고객센터 메인  ---------------------- */
.help-wrap {width: 100%;margin:20px auto 0;display: flex;justify-content: space-between;border-top: 2px solid #333;border-bottom: 1px solid #e1e1e1;}
.help-iconbox a .iconbox img {width:55px;height:55px;}
.help-iconbox a .stxt {padding:5px 10px 0 10px;font-size: 0.8rem;color: #666;line-height: 1.5;font-family: "Nanum Gothic", sans-serif;}

/* ----------------------  구매후기  ---------------------- */
/* 상단배너 */
.review-top-ban {width:100%;margin:40px 0 0 0;width:900px;height:90px;display:block;background: url("../img/ban_review.jpg") no-repeat left top;background-size:900px 90px;cursor: pointer;color: transparent;text-indent: -9999px;}

}