@charset "UTF-8";

.menu-toggle {display: inline-block;position: relative;}
.hid_menu {position: absolute;top: 100%;       /* a 태그 바로 아래 */left: 0;width: 100%;    /* 메뉴 폭 */background: #fff;border: 1px solid #ddd;display: none;   /* 처음에는 숨김 */z-index: 999;padding: 20px; }
.hid_wrap{display: flex; gap: 0px 1%;}
.hid_menu.active {display: block;  /* 활성화 시 표시 */}
.hid_menu button.menu-close {display: block;margin-left: auto;font-size: 2.0rem;background: none;border: none;cursor: pointer;position: absolute;right: 20px; top: 0px;}
.hid_menu .cate_wrap{width:80%; display: flex; gap: 40px 1%; flex-wrap: wrap;}
.hid_menu .cate_wrap .cate_menu{width: 24%;}
.hid_menu .cate_wrap .cate_menu h3{padding: 8px 10px; border-radius: 5px; background: #f8f8f8; font-size: 1.5rem; font-weight: 500;}
.hid_menu .cate_wrap .cate_menu ul{padding: 6px 10px 10px 10px;}
.hid_menu .cate_wrap .cate_menu ul li{margin-top: 4px;}
.hid_menu .cate_wrap .cate_menu ul li a{font-size: 1.4rem; color: #444;}
.hid_menu .community{width: 20%; background: #f6f6f6; border-radius: 5px; padding: 10px;}
.hid_menu .community h3{background: #fff; border-radius: 5px; padding: 8px 10px; font-size: 1.5rem; font-weight: 500;}
.hid_menu .community ul{padding: 10px 0;}
.hid_menu .community ul li{margin-top: 4px;}
.hid_menu .community ul li a{font-size: 1.4rem; color: #444;}

#popup1{ display:none; position:fixed; inset:0; z-index:99999; background:rgba(0,0,0,.55); padding:24px; }
#popup1.is-open{ display:flex; align-items:center; justify-content:center; }
#popup1 .pop-inner{ position:relative; max-width:980px; width:100%; max-height:90vh; overflow:auto; background:#fff; border-radius:12px; }


.hdtopSwiper{height: 40px; width: 100%; position: fixed; top: 0; z-index: 9;}
.hdtopSwiper .top1{background: #f7c913; color: #fff; text-align: center; font-weight: 500; font-size: 1.5rem; display: flex; align-items: center; justify-content: center;}
.hdtopSwiper .top2{background: #f48479; color: #fff; text-align: center; font-weight: 500; font-size: 1.5rem; display: flex; align-items: center; justify-content: center;}
.top_menu .main_menu{gap: 0px 18px;  padding-bottom: 5px;}
.top_menu .top_icon{display: flex; align-items: center; gap: 0px 22px; width: 187px; justify-content: flex-end}
.top_menu .top_icon .hdcart{position: relative;}
.top_menu .top_icon .hdcart span{position: absolute; color: #fff; font-size: 1.0rem; font-weight: bold; width: 15px; height: 15px; background:#3d3d3f; border-radius: 50%; display: flex; align-items: center; justify-content: center; top: -3px; right: -9px;}
.top_menu .top_icon button{border: none; background: none;}

/*---------- Search Full ----------*/
.search-full {position:fixed;top:206px;bottom:0;left:0;right:0;background:rgba(0, 0, 0, 0.4);display:none;z-index:1010}
.search-full .search-field {position:absolute;;left:0;right:0; margin: 0 auto; background: #fff; padding: 48px 0 32px 0; border-bottom: 1px solid #cacaca;}
.search-field h2 {position:absolute;font-size:0;text-indent:-9999em;line-height:0;overflow:hidden}
.search-field form {position:relative;width:30%;margin:0 auto; display: flex; align-items: center;}
.search-field #search_input {font-size:2.0rem;padding:15px 30px 15px 20px;-webkit-appearance:none;display:block;background:transparent;color:#333;width:100%;border:none;border-bottom:2px solid #333;margin:0 auto}
.search-field .search-btn {position:absolute;top:0;right:45px;width:45px;height:45px;border:0;cursor:pointer;color:#0078ff;background:transparent;font-size:2.25rem}
.search-full .search-close-btn {position: absolute; top: 6px; right: 20px; font-size: 2.5rem; font-weight: 500; cursor: pointer;}

.mainSwiper{margin-top: 206px;  position: relative;}
/*.mainSwiper .slide1{background: url("../img/visual01.png") no-repeat; background-size: cover; background-position: center;}*/
/*.mainSwiper .slide2{background: url("../img/visual01.png") no-repeat; background-size: cover; background-position: center;}*/
/*.mainSwiper .slide3{background: url("../img/visual01.png") no-repeat; background-size: cover; background-position: center;}*/
.mainSwiper .main_text{display: flex; flex-direction: column; justify-content: center; height: 100%; max-width: 1180px; width: 84%; margin: 0 auto; position: absolute; top: 0; left: 0; right: 0; margin: 0 auto;}
.mainSwiper .bn-caption{position: absolute;left: 0; right: 0; top: 0%;color: #111;display: flex;flex-direction: column;justify-content: center;height: 100%;max-width: 1180px;width: 100%;margin: 0 auto;}
.mainSwiper .bn-sub {font-size: 2.0rem; font-weight: 600; color: #333; margin-bottom: 25px; text-transform: uppercase;}
.mainSwiper .bn-title {font-size: 4.2rem; font-weight: bold; color: #121212; line-height: 130%;}
.mainSwiper .bn-desc {font-size: 1.8rem; font-weight: 500; color: #666; line-height: 145%; margin-top: 20px;}
.mainSwiper .bn-btn {width: 155px;height: 57px;border-radius: 30px;background: #111;display: flex;align-items: center;justify-content: center;color: #fff;font-size: 1.8rem;font-weight: 500;margin-top: 40px;}
.mainSwiper .main_text h3{font-size: 2.0rem; font-weight: 600; color: #333; margin-bottom: 25px; text-transform: uppercase;}
.mainSwiper .main_text h2{font-size: 4.2rem; font-weight: bold; color: #121212; line-height: 130%;}
.mainSwiper .main_text p{font-size: 1.8rem; font-weight: 500; color: #666; line-height: 145%; margin-top: 20px;}
.mainSwiper .main_text a{width: 155px; height: 57px; border-radius: 30px; background: #111; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 1.8rem; font-weight: 500;margin-top: 40px;}
.mainSwiper .main_btn_wrap{position: absolute; height: 100%; width: 100%; top: 0; left: 0; right: 0;}
.mainSwiper .main_btn_wrap .main_btn{width: 43px; height: 54px; background: rgba(0,0,0,0.3); border-radius: 8px; display: flex; align-items: center; justify-content: center; color: #fff; font-family: 'SUIT-SemiBold'; font-size: 2.4rem; z-index: 10; position: absolute; top: 45%; cursor: pointer;}
.mainSwiper .main_btn_wrap .main-next{right: 0;}
.mainSwiper .main_btn_wrap .main-pagination{position: absolute; bottom: 35px; z-index: 10; text-align: center;}
.mainSwiper .main_btn_wrap .main-pagination .swiper-pagination-bullet{background: #fff; opacity: 1; width: 8px; height: 8px;}
.mainSwiper .main_btn_wrap .main-pagination .swiper-pagination-bullet-active{background: #333; width: 24px; height: 8px; border-radius: 4px;}
.mainSwiper .swiper-slide img{width: 100%; height: 100%; object-fit: cover;}
.mainSwiper .main_img{width: 100%; height: 100%;}

  /* --- PC (2 : 1 : 2) 레이아웃 --- */
.m1 .grid{
  display:grid;
  grid-template-columns: 2fr 1fr 2fr; /* 2 : 1 : 2 */
  grid-auto-rows: 260px;              /* 카드 기본 높이 (원하면 조절) */
  gap:24px;
}

/* 공통 카드 스타일 */
.m1 .banner20{ background:#fff; overflow:hidden; box-sizing:border-box; }
.m1 .banner20 picture,
.m1 .banner20 img{ width:100%; height:100%; object-fit:cover; display:block; }

/* 배치: 1,2는 좌측 두 줄 / 3은 가운데 2행 크기 / 4,5는 우측 두 줄 */
.m1 .banner20:nth-child(1){ grid-column:1; grid-row:1; }
.m1 .banner20:nth-child(2){ grid-column:1; grid-row:2; }
.m1 .banner20:nth-child(3){ grid-column:2; grid-row:1 / span 2; } /* 가운데 큰 타일 */
.m1 .banner20:nth-child(4){ grid-column:3; grid-row:1; }
.m1 .banner20:nth-child(5){ grid-column:3; grid-row:2; }

/* 6개 이상이면 다음 줄부터 자동으로 채워짐 */

/* --- 모바일: 2열, 3번째는 맨 위 전체폭 --- */
@media (max-width: 768px){
  .m1 .width{ width:100%;  box-sizing:border-box; }
  .m1 .grid{
    grid-template-columns: repeat(2,1fr);
    grid-auto-rows:auto;
    gap:20px;
  }
  .m1 .banner20:nth-child(3){
    grid-column:1 / -1;  /* 두 칼럼 모두 */
    grid-row:auto;
    order:-1;            /* 맨 위로 */
  }
  .m1 .banner20 img{ height:auto; }
}





.owl-carousel .owl-dots.disabled{display: block;}
.owl-carousel button.owl-dot span{width: 7px; height: 7px; background:#c7c7ca; border-radius: 50%; display: inline-block;}
.owl-dots{text-align: center; margin-top: 52px;}
.owl-dots button{margin: 0px 4px;}
.owl-dots button.active span{border-radius: 3px; width: 24px; background: #1d1d1f;}
.owl-carousel.owl-loaded{ border: none; padding: 0px;}
.sct_wrap{padding-top: 130px;}
.sct_wrap header{text-align: center; margin-bottom: 50px; padding: 0px;}
.sct_wrap header h2{display: block; float: initial;}
.sct_wrap header h2 a{ font-size: 3.2rem; font-weight: bold; color: #121212;}
.sct_wrap header p{font-size: 1.8rem; font-weight: 500; color: #999;}
.pro_wrap .sct_img{position: relative; text-align: left;}
.pro_wrap .sct_img img{width: 100%;}
.pro_wrap .sct_img button{background: none; border: none;}
.pro_wrap .sct_img .sct_btn{position: absolute; right: 13px;bottom: 30%; opacity: 0; display: flex; flex-direction: column; gap: 3px 0;}
#idx_hit {position: relative; overflow: initial;}
#idx_hit .owl_prev{position: absolute; left: -6%; top: 55%; z-index: 4; cursor: pointer;}
#idx_hit .owl_next{position: absolute; right: -6%; top: 55%; z-index: 4; cursor: pointer;}
.pro_wrap .sct_txt{margin-top:15px; margin-bottom: 8px;}
.pro_wrap .sct_txt a{font-size: 1.7rem; font-weight: 600; color: #121212;}
.pro_wrap .sct_basic{font-size: 1.4rem; font-weight: 500; color: #999; line-height: 130%; margin-bottom: 10px;}
.pro_wrap .sct_dict2{font-size: 1.4rem; font-weight: 500; color: #999;text-decoration: line-through; margin-bottom: 4px;}
.pro_wrap .sct_disc{font-size: 1.7rem; font-weight: bold; color: #ff1113;}
.pro_wrap .percent{font-size: 1.0rem;}
.pro_wrap .sct_img:hover .sct_btn{opacity: 1}
.pro_wrap .sct_img:hover .sct_op_btn{opacity: 1}
.smt_40 .sct_li{ margin: 0px;}
.smt_40 .sct_img a img{border-radius: 10px; overflow: hidden;}
.smt_40 {border:0;}
.smt_10 .sct_li{float: initial; width: 23.5%; margin: 0px; position: relative;}
.smt_10{display: flex; flex-wrap: wrap; gap: 75px 2%;}
.smt_10 .sct_txt{border-bottom: 0px; padding-bottom: 0px;}
.smt_10 .sit_icon_li{display: none;}
.smt_10 .sct_img{position: relative; border-radius: 10px; overflow: hidden;}
.smt_10 .sct_img .sct_btn{bottom: 4%; top: initial;}
.pro_wrap .sct_img img{height: auto;}
.sct_wrap .more_btn{width: 300px; height: 50px; border-radius: 5px; border: 1px solid #d7d7d7; display: flex; align-items: center; justify-content: center; gap: 0px 8px; margin: 85px auto 0 auto; font-weight: 600; color: #333;}

.banner30{position: relative;}
.banner30  .bn-bg{background-size: cover; background-attachment: fixed; background-position: center; margin-top: 130px;  text-align: center; color: #fff; }
.banner30 .bn-caption{position: absolute;left: 0;bottom: 21%;color: #111;display: flex;flex-direction: column;justify-content: center;text-align: center; height: 100%;max-width: 1180px;width: 100%;margin: 0 auto; top: 0; right: 0; margin: 0 auto;}
.m2 .bn-sub {font-size: 4.8rem; font-weight: bold; margin-bottom: 22px;     color: #fff;}
.m2 .bn-title {font-size: 2.0rem; font-weight: 500; line-height: 145%; margin-bottom: 50px;     color: #fff;}
.m2 .bn-btn {font-size: 2.0rem; font-weight: 500; width: 165px; height: 60px; display: flex; align-items: center; justify-content: center; border: 1px solid #fff; margin: 0 auto;     padding: 20px; color: #fff; transition: 0.3s all;}
.m2 .bn-btn:hover{background: #f48479;}

.m3{padding: 170px 0;}
.m3 h2{text-align: center; margin-bottom: 55px; font-size: 3.2rem; font-weight: bold; color: #121212;}
.m3 .box_wrap{ display: flex; gap: 8px 0.5%; flex-wrap: wrap;}
.m3 .box_wrap a{width: 16.2%;}
.m3 .box_wrap a img{width: 100%;}





/* 레거시 배너 경로로 올라온 이미지를 임시로 숨김 */
.mainSwiper .swiper-slide img[src*="/data/banner/"]{ display:none !important; }

/* ===== 공통 ===== */
.m1{padding-top:130px;}
.m1 .width{margin:0 auto;box-sizing:border-box;}
.m1 .grid{
gap: 14px;
    grid-template-columns: 1fr 2fr 1fr;
    grid-auto-rows: 330px;
    grid-template-areas:
        "item1 item3 item4"
        "item2 item3 item5";
}
.m1 .card{
  position:relative;
  border-radius:16px;
  overflow:hidden;
  background:#fff;
  box-shadow:0 2px 8px rgba(0,0,0,.04);
}

/* 썸네일 래퍼에 비율 부여(필수) */
.m1 .thumb{width:100%;aspect-ratio:1/1;}          /* 기본: 정사각 */
.m1 .thumb.wide{aspect-ratio:16/9;}                /* 가로형 배너용 */
.m1 .thumb.tall{aspect-ratio:4/5;}                 /* 세로형이 필요할 때 */

.m1 .thumb > img{
  width:100%;height:100%;display:block;object-fit:cover;
}

/* 데스크탑: large 카드 2x2 영역 */
.m1 .card.small{grid-column:span 1;}
.m1 .card.large{grid-column:span 2;grid-row:span 2;}
/* large 카드 안 배너는 가로형 권장 */
.m1 .card.large .thumb{aspect-ratio:16/9;}

/* ===== 태블릿 (≤1024px) ===== */
@media (max-width:1024px){
  .m1 .grid{grid-template-columns:repeat(3,1fr);gap:20px;}
  .m1 .card.large{grid-column:1/-1;grid-row:auto;}
}

@media (max-width:768px){
	.m1 {    padding-top: 30px;}
	
  .m1 .grid{
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
    gap:16px;
    grid-template-areas:none !important;
    grid-auto-rows:auto; /* 기본 행 높이는 자동 */
  }

  .m1 .grid > *{
    grid-area:auto !important;
    grid-column:span 1 !important;
    float:none !important;
    width:auto !important;
    display:block !important;
    box-sizing:border-box;
  }

  /* large 기본 풀폭 해제 */
  .m1 .card.large{
    grid-column:span 1 !important;
    order:0 !important;
  }

  /* ✅ 3번째 카드: 풀폭 + 맨 위 + 높이 고정 */
  .m1 .grid > *:nth-child(3){
    grid-column:1 / -1 !important;
    order:-1 !important;
    height:456px !important;   /* 원하는 높이 */
  }

  .m1 .grid > *:nth-child(3) img{
    width:100%; height:100% !important;
    object-fit:cover; display:block;
  }
  
  .main-banner-grid .item img {    width: 100%;height: 100%;object-fit: contain;display: block;
}


.banner30 {margin-top:0; padding:0;}
.banner30 img {width:100%;}
.banner30 .bn-caption {left:0%; bottom:17%;}

.m2 .bn-sub {font-size: 2.8rem; margin-bottom:10px;}
.m2 .bn-btn {height:45px;}
.m2 .bn-title {margin-bottom:20px;         font-size: 1.6rem;}

.mainSwiper .bn-title {font-size: 2.2rem;}
.mainSwiper .bn-desc {font-size: 1.2rem;}
.mainSwiper .bn-sub {    margin-bottom: 10px;}
.mainSwiper .bn-btn { width: 100px; height: 35px; margin-top: 10px;     font-size: 12px;}
.m2 .bn-btn {font-size: 1.4rem;}
}


#ft{background: #fff; border-top: 1px solid #ddd !important; padding: 0px;}
#ft .footer{padding: 50px 0 40px; display: flex; justify-content: space-between;}
#ft .ft_info_wrap{text-align: left;}
#ft .ft_info_wrap .foot_logo{display: inline-block; margin-bottom: 27px;}
#ft .ft_info_wrap ul{display: flex; align-items: center; gap: 0px 7px;}
#ft .ft_info_wrap ul li{line-height: 165%; font-size: 1.4rem; color: #9c9c9c;}
#ft .ft_info_wrap ul a{line-height: 165%; font-size: 1.4rem; color: #9c9c9c;}
#ft .ft_info_wrap ul li b{color: #333;}
#ft .ft_info_wrap ul span{line-height: 165%; font-size: 1.4rem; color: #9c9c9c;}
#ft .ft_center{text-align: left;}
#ft .ft_center h3{font-weight: 600; color: #333; margin-bottom: 16px;}
#ft .ft_center h2{font-size: 3.0rem; font-weight: bold; color: #121212; margin-bottom: 18px;}
#ft .ft_center dl dt{font-size: 1.4rem; color: #9c9c9c; margin-bottom: 4px;}
#ft .ft_center dl dd{font-size: 1.4rem; color: #9c9c9c;}
#ft .ft_center .ft_sns{margin-top: 45px; display: flex; align-items: center; gap: 0px 15px;}
#ft .copyright{padding: 30px 0; border-top: 1px solid #ddd; text-align: left;}
#ft .copyright span{font-size: 1.4rem; color: #9c9c9c;}
#ft .copyright span b{color: #333; font-weight: 400;}

#sct_location{position: relative; float: initial; display: flex; align-items: center; justify-content: flex-end; padding: 0px;}
#sct_location .go_home{font-size: 1.3rem; font-weight: 500; color: #999; padding: 0px;}
.shop_select_to_html .category_title{padding: 10px 0;font-size: 1.3rem; color: #333; font-weight: 500;}
#sct_location .slash{font-size: 1.3rem; font-weight: 500; color: #999; padding: 0px 4px;}
.shop_select_to_html .category_title i{display: none;}
.shop_select_to_html:hover .category_title, .shop_select_to_html:hover .category_title i{color: #f48479}
.shop_select_to_html .option a{font-size: 1.3rem; padding: 0px 50px 0 20px;}
.shop_select_to_html .option.selected, .shop_select_to_html .option.selected a{color: #f48479}
#sct_sortlst{/*display: none;*/}
.shop_ca_name{text-align: center; margin-top: 50px; margin-bottom: 80px; font-size: 3.5rem; font-weight: bold; color: #333;}

.shop_list_nav{display: flex; gap: 9px 0.8%; flex-wrap: wrap; margin-bottom: 40px;}
.shop_list_nav li{width: 16%; }
.shop_list_nav li a{font-size: 1.4rem; padding: 0 0 0 18px; color: #888; border: 1px solid #e1e1e1; border-radius: 5px; height: 44px; width: 100%; display: flex; align-items: center;}
.shop_list_nav li.on a{border: 1px solid #666;}
.shop_item{margin-bottom: 40px; display: flex; justify-content: space-between; align-items: center;}
.shop_item h6{font-size: 1.3rem; color: #999; font-weight: 500; }
.shop_item h6 b{color: #333; font-weight: 500; }
.select_wrap{position: relative;}
.select_wrap select{border:none;  color: #333; background: #fff; width: 90px;  appearance: none; -webkit-appearance: none;-moz-appearance: none; position: relative; font-size: 1.3rem; font-weight: 500; }
.select_wrap::after { content:''; position: absolute;top:55%;right: 0px;transform: translateY(-50%);pointer-events: none; background-image: url("../img/arrow_down.png"); width: 16px; height: 16px; background-repeat: no-repeat;}

#sct .select_wrap {position: relative;width: 90px;}
#sct .select_wrap button {width: 100%;padding: 10px;text-align: left;background: #fff;cursor: pointer;font-size: 14px; border: none;}
#sct .select_wrap ul {position: absolute;top: 100%;left: 0;right: 0;border: 1px solid #ccc;background: #fff;display: none;z-index: 100;}
#sct .select_wrap ul li {padding: 10px;cursor: pointer;}
#sct .select_wrap ul li:hover {background: #f2f2f2;}
#sct .select_wrap ul li a{font-size: 1.4rem; color: #444;}
#sct .select_wrap ul.show {display: block;}

.sct_10 .sct_txt{margin-top:15px; margin-bottom: 8px; border-bottom: 0px; padding-bottom: 0px;}
.sct_10 .sct_txt a{font-size: 1.7rem; font-weight: 600; color: #121212;}
.sct_10 .sct_basic{color: #999; font-size: 1.4rem; font-weight: 500;}
.sct_10 .sct_disc{font-size: 1.7rem; color: #ff1113; font-weight: bold;}
.sct_10 .sct_disc .percent{font-size: 1.0rem;}
.sct_10 .sct_cost{font-size: 1.7rem; font-weight: bold;}
.sct_10 .sct_dict{margin-top: 10px; font-size: 1.4rem; font-weight: 500; color: #999;}
.sit_icon_li{display: none;}
.list-10-btn{position: absolute; display: flex; flex-direction: column; gap: 4px 0;  right: 13px; bottom: 4%; opacity: 0;}
.list-10-btn img{width: initial;}
.list-10-btn button{background: none; border: none;}
.sct_10 .sct_img:hover .list-10-btn{opacity: 1;}
.sct_10 .sct_op_btn{display: none;}

.common_nav{text-align: right; font-size: 1.3rem; font-weight: 500; color: #333; margin-bottom: 40px;}
.common_nav b{font-weight: 500; color: #999;}

.item_wrap{padding: 40px 0 110px 0;}
.item_wrap .item_top{display: flex; gap: 30px 4%; justify-content: space-between; margin-bottom: 120px;}
.item_wrap .item_slide{width: 50%;}
.item_wrap .item_slide .swiper-slide img{width: 100%;height:auto;}
.item_wrap .itemSwiper .swiper-slide{border-radius: 10px; overflow: hidden;}
.item_wrap .itemSwiper .swiper-slide-thumb-active{border: 1px solid #696969;}
.item_wrap .itemSwiper2{position: relative; margin-bottom: 10px;}
.item_wrap .itemSwiper2 .item-pagination{position: absolute; bottom: 17px; left: 0; right: 0; margin: 0 auto; z-index: 9; width: 55px; background: rgba(0,0,0,0.3); border-radius: 30px; padding: 3px 0; text-align: center;  color: #fff; font-size: 1.4rem;}
.item_wrap .itemSwiper2 .item-pagination span{ font-size: 1.4rem; font-weight: 300;}
.item_wrap .item_info{width: 42%;}
.item_wrap .item_title{position: relative; padding-bottom: 30px; border-bottom: 1px solid #e8e8e8; margin-bottom: 40px;}
.item_wrap .item_title h2{font-size: 3.0rem; font-weight: bold; color: #333; margin-bottom: 17px;}
.item_wrap .item_title h3{font-size: 1.6rem; color: #666; font-weight: 500; line-height: 140%;}
.item_wrap .item_title .item_icon{position: absolute; right: 0; top: 0; display: flex; align-items: center; gap: 0px 15px;}
.item_wrap .item_title .item_icon button{background: none; border: none;}
.item_wrap .item_info dl{display: flex; margin-bottom: 20px;}
.item_wrap .item_info dl.item_center{align-items: center;}
.item_wrap .item_info dl dt{color: #888; font-weight: 500; min-width: 120px;}
.item_wrap .item_info dl.item_first dd{display: flex; align-items: center;}
.item_wrap .item_info dl.item_first dd .t1{font-size: 2.0rem; font-weight: 500; color: #999; text-decoration: line-through; margin-right: 14px;}
.item_wrap .item_info dl.item_first dd .t2{font-size: 2.4rem; font-weight: bold; color: #ff1113; margin-right: 8px;}
.item_wrap .item_info dl.item_first dd .t2 span{font-size: 1.5rem;}
.item_wrap .item_info dl.item_first dd .t3{font-size: 3.0rem; font-weight: bold; color: #333;}
.item_wrap .item_info dl dd{font-size: 1.5rem; color: #333; font-weight: 500; width: 100%;}
.item_wrap .item_info dl dd select{width: 100%; padding: 8px; border-radius: 5px; border: 1px solid #e8e8e8;}
.item_wrap .count_wrap{padding: 28px 10px 28px 20px; background: #fafafa; border-top: 1px solid #e8e8e8; border-bottom: 1px solid #e8e8e8; display: flex; align-items: center; justify-content: space-between;}
.item_wrap .count_wrap h4{font-size: 1.5rem; font-weight: 500; color: #333;}
.item_wrap .count_wrap .count_box{display: flex; align-items: center;}
.item_wrap .count_wrap .opt_count{display: flex; border: 1px solid #e8e8e8; background: #fff; margin-right: 30px;}
.item_wrap .count_wrap .opt_count button{width: 27px; height: 27px; color: #333; background: none; border: none; font-size: 2.0rem;}
.item_wrap .count_wrap .opt_count input{width: 27px; border: none; border-left: 1px solid #e8e8e8; border-right: 1px solid #e8e8e8; text-align: center; font-size: 1.5rem; color: #333;}
.item_wrap .count_box h6{font-size: 2.0rem; font-weight: bold; color: #333; margin-right: 10px;}
.item_wrap .count_box .opt_cancel{border: none; background: none; font-weight: 600; font-size: 2.0rem; margin-bottom: 3px; color: #333;}
.item_wrap .opt_result{margin-top: 50px; display: flex; justify-content: space-between; align-items: center; margin-bottom: 22px;}
.item_wrap .opt_result h4{font-size: 2.0rem; font-weight: 500; color: #333;}
.item_wrap .opt_result h5{font-size: 3.0rem; font-weight: bold; color: #333;}
.item_wrap .opt_result h5 b{font-weight: bold; color: #f7c913;}
.item_wrap .item_btn{display: flex; align-items: center; gap: 0px 1%;}
.item_wrap .item_btn button{height: 65px; border: none; background: none;}
.item_wrap .item_btn .item_cart{min-width: 65px; border: 1px solid #e2e2e2;}
.item_wrap .item_btn .item_buy{width: 100%; background: #1d1d1f; font-size: 1.8rem; font-weight: 500; color: #fff;}

.pro_menu.fixed {
    position: fixed;
    top: 206px;
    left: 0;
    right: 0;
    background: #fff; /* 필요 시 배경 추가 */
    z-index: 99;
}


.pro_menu{display: flex; max-width: 1360px; margin: 0 auto; }
.pro_menu li{width: 25%;}
.pro_menu li a{font-size: 1.8rem; font-weight: 600; color: #888; display: flex; align-items: center; justify-content: center; height: 60px; border-bottom: 1px solid #d8d8d8;}
.pro_menu li.on a {border-bottom: 1px solid #121212;}
.pro_wrap .pro_box1{max-width: 980px; margin: 115px auto 80px auto;}
.pro_wrap .pro_box1 img{width: 100%;}
.pro_wrap .pro_box2{padding: 80px 0;}
.pro_wrap .pro_box2 h2{text-align: center; font-size: 2.8rem; margin-bottom: 42px; color: #121212; font-weight: bold;}

.acco{border-top: 1px solid #d5d5d5;}
.acco .collapsible { cursor: pointer; padding: 25px 10px; width: 100%; border: none; text-align: left; outline: none; font-size: 1.8rem; background: none; font-weight: 500; color: #333; position: relative;}
/*.acco .collapsible span{font-weight: 800; display: inline-block; min-width: 45px;}*/
.acco .active,
.acco .collapsible:hover {  }
.acco .content { padding: 0 15px; max-height: 0; overflow: hidden; transition: max-height 0.2s ease-out; border-bottom: 1px solid #d5d5d5; background: rgba(255,255,255,0.15);}
.acco .collapsible:after { content:''; position: absolute;top:55%;right: 0px;transform: translateY(-50%);pointer-events: none; background-image: url("../img/arrow_down.png"); width: 16px; height: 16px; background-repeat: no-repeat;}
.acco .active:after { content:''; position: absolute;top:55%;right: 0px;transform: translateY(-50%);pointer-events: none; background-image: url("../img/arrow_up.png"); width: 16px; height: 16px; background-repeat: no-repeat; }
.acco .content .tbox{padding: 10px 0px 30px 0px;}
.acco .content .tbox p{ font-size: 1.7rem; line-height: 145%; color: #666;}

.re_all{padding-top: 70px;}
.re_all .txt{text-align: center; margin-bottom: 60px;}
.re_all .txt h2{font-size: 2.8rem; font-weight: bold; color: #121212; margin-bottom: 15px;}
.re_all .txt p{font-weight: 500; font-size: 1.6rem; color: #999;}
.re_all .re_top{position:relative;display: flex; align-items: center; justify-content: space-between;}
.re_all .re_top .re_all_num{font-size: 2.0rem; font-weight: 600; color: #666;}
.re_all .re_top ul{display: flex; gap: 0px 20px; align-items: center; margin-bottom: 20px;}
.re_all .re_top ul li{white-space: nowrap; }
.re_all .re_top ul li a{font-size: 1.5rem; color: #c8c8c8; font-weight: 600;}
.re_all .re_top ul li a.on{color: #333;}
.re_all .re_select{border: 1px solid #cbcdd2; border-radius: 5px; width: 180px; overflow: hidden; margin-bottom: 17px;}
.re_all .re_select select{width: 100%; height: 35px; padding-left: 10px; font-size: 1.3rem;}
.re_all .select_wrap::after{top: 58%;}
.re_all .treview_wrap{display: flex; justify-content: space-between; padding: 35px 0; border-top: 1px solid #e9e9e9;}
.re_all .treview_wrap .name{min-width: 125px;}
.re_all .treview_wrap .name .star{display: flex; gap: 0px 1px; color: #f7c913; margin-bottom: 12px;}
.re_all .treview_wrap .name .star i{font-size: 2.0rem;}
.re_all .treview_wrap .name h2{font-size: 1.4rem; color:#91949c; }
.re_all .treview_wrap .tre_text{width: 100%;}
.re_all .treview_wrap .tre_text .text_content {line-height: 155%; font-size: 1.5rem; color: #333;}
.re_all .treview_wrap .tre_text .text_box {position: relative;height:42px;overflow:hidden;}
.re_all .treview_wrap .tre_text.on .text_box{height:auto;}
.re_all .treview_wrap .tre_text.on .toggle_btn img{transform: rotate(180deg);}
.re_all .treview_wrap .text_content {height: 80px;overflow: hidden;transition: height 0.3s ease;}
.re_all .treview_wrap .text_content.open {height: auto;}
.re_all .treview_wrap .toggle_btn {display: flex; align-items: center; font-size: 1.6rem; font-weight: 500; color: #999; border: none; background: none; margin-top: 10px;}
.re_all .treview_wrap .toggle_btn img {margin-left: 5px;transition: transform 0.2s; filter: invert(60%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(95%) contrast(90%);}
.re_all .treview_wrap .tre_photo{margin-top: 25px; display: flex; gap: 0px 1%;}
.re_all .treview_wrap .tre_photo button{border: none; background: none; max-width: 65px;}
.re_all .treview_wrap .tre_photo button img{width: 100%;}
.re_all .treview_wrap .tre_date{font-size: 1.4rem; color: #c8c8c8; display: block; margin-top: 30px; margin-bottom: 20px;}
.admin_re{width: fit-content;position: relative; border-radius: 0 15px 15px 15px; padding: 25px 55px 25px 25px; background: #f6f7f8;}
.admin_re::before {content: "";position: absolute;top: 0;left: -12px;width: 0;height: 0;border-top: 12px solid #f6f7f8;;  /* 빨간색 */border-left: 12px solid transparent; }
.admin_re p{font-size: 1.4rem; line-height: 150%; margin-bottom: 15px;}
.admin_re h6{font-size: 1.4rem; font-weight: 500; color: #999;}
.re_search{padding-top: 70px; border-top: 1px solid #e9e9e9; display: flex; align-items: center; justify-content: center; gap: 0px 8px;}
.re_search .re_input{display: flex; align-items: center; gap: 0px 8px;}
.re_search select{width: 100px; height: 40px; border: 1px solid #dfdfe2; padding-left: 8px;}
.re_search input{border: 1px solid #dfdfe2; padding-left: 8px; width: 175px; height: 40px;}
.re_search button{width: 100px; height: 40px; color: #fff; font-size: 1.4rem; background: #121212; border: none;}
.pro_box4{padding-top: 120px;}
.pro_box4 .txt{text-align: center; margin-bottom: 40px;}
.pro_box4 .txt h2{font-size: 2.8rem; font-weight: bold; color: #121212; margin-bottom: 15px;}
.pro_box4 .txt p{font-weight: 500; font-size: 1.6rem; color: #999;}
.pro_box4 .no_txt{padding: 80px 0; text-align: center; font-size: 1.4rem; font-weight: 500; color: #999; border: 1px solid #d5d5d5;}
.pro_box4 .apply{width: 150px; height: 65px; margin: 35px 0 0 auto; background: #121212; color: #fff;  text-align:center; font-size: 1.8rem; font-weight: 500; border: none; display: flex; align-items: center; justify-content: center;}
#qna_box{color: #999;border: 1px solid #d5d5d5;}

.pop_wrap {display: none;position: fixed;top: 0;left: 0;background: rgb(0, 0, 0, 0.3);width: 100%;  height: 100%;  z-index: 9999;}
.pop_wrap .pop-inner {position: absolute;  top: 50%;  left: 50%;  transform: translate(-50%, -50%);  width: 90%;  max-width: 1090px;   background: #fff;  }
.pop-close {  position: absolute;  top: 0;  right: 0;  width: 50px;  height: 50px;  cursor: pointer; background: #f2f2f2; display: flex; align-items: center; justify-content: center;}
.pop-close i{font-size: 28px;}
#popup1 .pc_box{display: flex; align-items: center; background: #121212;}
#popup1 .pc_box .popSwiper{ width: 100%; position: relative;}
#popup1 .popSwiper .swiper-slide img{width: 100%;}
#popup1 .popSwiper .pop-pagination{text-align: center;display: block; padding: 5px 0px; background: rgba(0,0,0,0.3); border-radius: 30px; color: #fff; width: 55px; margin: 0 auto; position: absolute; bottom: 20px; left: 0; right: 0; z-index: 9;}
#popup1 .pc_box .pop_text{width: 100%; padding: 16px 16px 35px 16px; background: #fff;}
#popup1 .pc_box .pop_top{display: flex; align-items: center; gap: 0px 25px; padding-bottom: 20px; border-bottom: 1px solid #dcdcdc;}
#popup1 .pc_box .pop_top h2{font-size: 1.8rem; font-weight: bold; color: #333; margin-bottom: 7px;}
#popup1 .pc_box .pop_top h3{font-size: 1.5rem; color: #333;}
#popup1 .pc_box .pop_top img{width: 100px;}
#popup1 .pc_box .pop_mid{display: flex; align-items: center; justify-content: space-between; padding: 20px 0; border-bottom: 1px solid #dcdcdc;}
#popup1 .pc_box .pop_mid .star{display: flex; gap: 0px 2px;}
#popup1 .pc_box .pop_mid .star i{color: #e8c505;}
#popup1 .pc_box .pop_mid dl{display: flex; gap: 0px 15px;}
#popup1 .pc_box .pop_mid dd{font-size: 1.3rem; color: #666;}
#popup1 .pc_box .pop_mid dt{font-size: 1.3rem; color: #666;}
#popup1 .pc_box .pop_bot1{padding: 22px 0 30px 0; border-bottom: 1px solid #dcdcdc;}
#popup1 .pc_box .pop_bot1 h2{font-weight: 600; color: #121212; margin-bottom: 20px;}
#popup1 .pc_box .pop_bot1 p{font-size: 1.4rem; color: #333; line-height: 145%;}
#popup1 .pc_box .pop_bot2{padding-top: 25px; display: flex; gap: 0px 5px;}
#popup1 .pc_box .pop_bot2 h6{font-weight: 600; color: #121212;}
#popup1 .pc_box .pop_bot2 .bot_text h2{color: #121212; font-weight: 600; display: flex; align-items: center; gap: 0px 8px; margin-bottom: 20px;}
#popup1 .pc_box .pop_bot2 .bot_text h2 span{font-size: 1.3rem; color: #666;}
#popup1 .pc_box .pop_bot2 .bot_text div{font-size: 1.4rem; line-height: 145%; color: #333;}
#popup1 .mob_box{height: 60vh; overflow-y: scroll;}
#popup1 .mob_box .mo_top{padding: 35px 25px 15px 25px;}
#popup1 .mob_box .mo_top .re_more{display: flex; align-items: center; gap: 0px 15px; font-size: 3.2rem; font-weight: bold; margin-bottom: 25px;}
#popup1 .mob_box .mo_top .re_more span{color: #636365; font-family: 'SUIT-Bold';}
#popup1 .mob_box .mo_pro_title{display: flex; align-items: center;}
#popup1 .mob_box .mo_pro_title span{border-radius: 50%; overflow: hidden; width: 42px;}
#popup1 .mob_box .mo_pro_title span img{width: 100%;}
#popup1 .mob_box .mo_pro_title h2{font-size: 2.6rem; font-weight: bold; color: #121212;}
#popup1 .mob_box .mo_pro_title a{font-family: 'SUIT-Bold'; color: #a9aaae; font-size: 3.2rem; margin-left: 7%;}
#popup1 .mob_box .mo_text1{margin: 40px 25px 0 25px; border-bottom: 1px solid #dcdcdc; padding-bottom: 30px;}
#popup1 .mob_box dl{display: flex; align-items: center; justify-content: space-between; margin-bottom: 15px;}
#popup1 .mob_box dl dt{font-size: 2.2rem; color: #91949c;}
#popup1 .mob_box dl dd{font-size: 2.2rem; color: #91949c;}
#popup1 .mob_box .star{display: flex; gap: 0px 2px; margin-bottom: 25px;}
#popup1 .mob_box .star i{font-size: 3.2rem; color: #f7c913;}
#popup1 .mob_box .mo_text1 p{font-size: 2.2rem; font-weight: 500; color: #121212; line-height: 155%;}
#popup1 .mob_box .mo_text2{ padding: 40px 25px;}
#popup1 .mob_box .mo_text2 h2{font-size: 2.4rem; font-weight: 500; color: #999; margin-bottom: 15px;}
#popup1 .mob_box .mo_text2 p{font-size: 2.1rem; font-weight: 500; color: #999; line-height: 155%;}


/* 슬라이더 위계 확실히 */
.popSwiper{ position:relative; z-index:2; }
.popSwiper .swiper-slide{ position:relative; }

/* fraction */
.pop-pagination{
  position:absolute; right:12px; bottom:12px;
  padding:4px 8px; font-size:13px; line-height:1;
  background:rgba(0,0,0,.55); color:#fff; border-radius:8px;
  z-index:5; pointer-events:none;
}

/* Swiper 기본 네비 버튼을 맨 위로 */
.popSwiper .swiper-button-prev,
.popSwiper .swiper-button-next{
  position:absolute; top:50%; transform:translateY(-50%);
  width:36px; height:36px; border-radius:50%;
  background:rgba(0,0,0,.45); color:#fff;
  z-index:9999; pointer-events:auto;  /* ← 클릭 허용 */
}
.popSwiper .swiper-button-prev{ left:8px; }
.popSwiper .swiper-button-next{ right:8px; }
.popSwiper .swiper-button-prev:hover,
.popSwiper .swiper-button-next:hover{ background:rgba(0,0,0,.65); }
.popSwiper .swiper-button-prev::after,
.popSwiper .swiper-button-next::after{ font-size:18px; }

/* 혹시 전체를 덮는 닫기/오버레이 같은 게 있다면 클릭 막힘 방지 */
.pop-close{ pointer-events:none; }         /* 아이콘만 클릭되게 */
.pop-close i{ pointer-events:auto; }

@media (max-width:768px){
  .popSwiper .swiper-button-prev,
  .popSwiper .swiper-button-next{ width:40px; height:40px; }
  .pop-pagination{ right:10px; bottom:10px; font-size:12px; }
}



.best_photo_wrap, .order, #bo_list, #bo_gall, #bo_w, .mypage, #bo_v , #sod_ws{padding: 240px 0 110px 0;}
.best_photo_wrap .txt{text-align: center; margin-bottom: 40px; margin-top: 75px;}
.best_photo_wrap .txt h2{font-size: 2.8rem; font-weight: bold; color: #121212; margin-bottom: 15px;}
.best_photo_wrap .txt p{font-weight: 500; font-size: 1.6rem; color: #999;}
.board_title h2{font-size: 2.8rem; font-weight: bold; color: #121212; margin-bottom: 15px;}
.board_title p{font-weight: 500; font-size: 1.6rem; color: #999;}

.photoSwiper .swiper-slide{border: 1px solid #c8c8c8;}
.photoSwiper .swiper-slide a{cursor: pointer;}
.photoSwiper .gall_img{position: relative; display: block;}
.photoSwiper .gall_img .gall_big{width: 100%;}
.photoSwiper .gall_img .gall_mini{position: absolute; left: 8px; bottom: 8px; z-index: 3; display: flex; gap: 0px 5px;}
.photoSwiper .gall_img .gall_mini span{border: 1px solid #ddd; border-radius: 4px; overflow: hidden; width: 30%;}
.photoSwiper .gall_img .gall_mini span img{width: 100%; height: 100%; object-fit: cover;}
.photoSwiper .gall_img .best{position: absolute; top: 3px;left: 8px; background: #333; border-radius: 5px; padding: 6px 13px; color: #fff; font-size: 1.4rem; font-weight: 600;}
.photoSwiper .text{border-bottom: 1px solid #c8c8c8; padding: 20px;}
.photoSwiper .text h2{margin-bottom: 15px;}
.photoSwiper .text h2 a{font-size: 1.6rem; font-weight: 600; color: #121212; }
.photoSwiper .text h3{overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2; /* 라인수 */-webkit-box-orient: vertical; font-size: 1.4rem; line-height: 135%; color: #666; margin-bottom: 15px;}
.photoSwiper .text .star{display: flex; gap: 0px 2px; margin-bottom: 15px;}
.photoSwiper .text .star i{color: #e8c505;}
.photoSwiper .text dl{display: flex; align-items: center; justify-content: space-between;}
.photoSwiper .text dl dt{font-size: 1.2rem; color: #666;}
.photoSwiper .text dl dd{font-size: 1.2rem; color: #666; display: flex; align-items: center; gap: 0px 5px;}
.photoSwiper .photo_pro{padding: 10px 20px; display: flex; align-items: center; gap: 0px 7px;}
.photoSwiper .photo_pro img{width: 45px;}
.photoSwiper .photo_pro h6{font-size: 1.4rem; color: #666;}
.photoSwiper .photo-pagination{margin-top: 55px; text-align: center;}
.photoSwiper .photo-pagination .swiper-pagination-bullet{width: 7px; height: 7px;}
.photoSwiper .photo-pagination .swiper-pagination-bullet-active{width: 24px; border-radius: 3px; background: #1d1d1f;}

.order .txt{text-align: center; margin-bottom: 40px;}
.order .txt h2{font-size: 3.2rem; font-weight: bold; color: #121212;}
.reg_ul{display: flex; align-items: center; justify-content: center; gap: 0px 3%; margin-bottom: 90px;}
.reg_ul li{color: #999; font-weight: 500; font-size: 1.6rem;}
.reg_ul li b{color: #121212; font-weight: 600;}
.reg_ul span{color: #999; font-size: 1.6rem; font-family: 'SUIT-Regular';}
.or1_wrap h2{display: flex; align-items: center; justify-content: space-between; font-size: 2.0rem; font-weight: 600; color: #121212; margin-bottom: 20px;}
.or1_wrap h2 button{border: none; background: none;}
.or_table{margin-bottom: 55px;}
.or_table table{width: 100%; border-top: 1px solid #c6c6c6;}
.or_table table th{background: #f8f8f8; padding: 20px 0; font-weight: 500; color: #121212;}
.or_table table td{text-align: center; color: #121212; padding: 20px 10px; border-bottom: 1px solid #c6c6c6; font-weight: 500;}
.or_table table .ta_photo{display: flex; align-items: center; text-align: left; gap: 0px 15px;}
.or_table table .ta_photo h3{font-size: 1.8rem; font-weight: 600; color: #121212; margin-bottom: 5px;}
.or_table table .ta_photo h4{font-size: 1.4rem; color: #333; margin-bottom: 9px;}
.or_table table .ta_photo h5{font-size: 1.3rem; color: #999; margin-bottom: 10px;}
.or_table table .ta_photo h6{font-size: 1.5rem; color: #999;}
.or1_wrap2{display: flex; gap: 35px 4%; }
.or1_wrap2 h2{display: flex; align-items: center; justify-content: space-between; font-size: 2.0rem; font-weight: 600; color: #121212; margin-bottom: 20px;}
.or1_wrap2 .left{width: 73%;}
.or1_wrap2 .left dl:last-child{border-bottom: 1px solid #e8e8e8;}
.or1_wrap2 .left dl{display: flex; border-top: 1px solid #e8e8e8;}
.or1_wrap2 .left dt{background: #f9f9f9; font-size: 1.7rem; font-weight: 500; color: #666; min-width: 190px; padding: 22px;}
.or1_wrap2 .left dt span{color: #931215;}
.or1_wrap2 .left dd{padding: 15px; width: 100%;}
.or1_wrap2 .left dd > div{width: 80%;}
.or1_wrap2 .left dd input[type=text]{border: 1px solid #e8e8e8; width: 100%; height:40px; padding-left: 10px; font-size: 1.5rem; color: #666;}
.or1_wrap2 .left dd .in_type2{display: flex; align-items: center; gap: 0px 2%;}
.or1_wrap2 .left dd .in_type2 select{width: 100%; height: 40px; border: 1px solid #e8e8e8;}
.or1_wrap2 .left dd .in_type2 span{color: #8b8b8b; font-size: 2.0rem;}
.or1_wrap2 .left dd .in_type3 .address{ display: flex; gap: 0px 2%; margin-bottom: 14px;}
.or1_wrap2 .left dd .in_type3 .address button{white-space: nowrap; height: 40px; background: #333; color: #fff; font-size: 1.3rem; width: 80px; border: none;}
.or1_wrap2 .or_input_wrap2{margin-top: 65px;}
.or1_wrap2 .or_input_wrap2 label{color: #666; font-weight: 500; padding: 20px; display: block;}
.or1_wrap2 .or_input_wrap2 label input{margin-right: 7px;}
.or1_wrap2 .or_input_wrap3{margin-top: 80px;}
.or1_wrap2 .in_type4{display: flex; flex-wrap: wrap; gap: 10px 2%;}
.or1_wrap2 .in_type4 input{display: none}
.or1_wrap2 .in_type4 label{width: 49%; border: 1px solid #c6c6c6; height: 64px; display: flex; align-items: center; justify-content: center; font-size: 1.5rem; color: #666; cursor: pointer;}
.or1_wrap2 .in_type4 input:checked + label{background: #121212; color: #fff;}
.or1_wrap2 .or_input_wrap4{margin-top: 80px;}
.or1_wrap2 .left .submit{width: 360px; height: 65px; background: #1d1d1f; font-size: 1.8rem; font-weight: 500; color: #fff; border: none; margin: 70px auto 0 auto; display: block;}
.or1_wrap2 .right{width: 27%;}
.or1_wrap2 .right .price_wrap{border: 1px solid #e8e8e8; padding: 30px 20px; margin-bottom: 20px;}
.or1_wrap2 .right .price_wrap dl:first-child{margin-bottom: 15px;}
.or1_wrap2 .right .price_wrap dl{display: flex; justify-content: space-between; align-items: center;}
.or1_wrap2 .right .price_wrap dt{font-weight: 500; color: #121212;}
.or1_wrap2 .right .price_wrap dd{font-weight: 500; color: #121212;}
.or1_wrap2 .right .price_wrap dd span{font-size: 1.4rem; font-weight: 500; color: #121212;}
.or1_wrap2 .right .price_wrap .result{padding-top: 30px; border-top: 1px solid #e8e8e8; margin-top: 30px;}
.or1_wrap2 .right button{display: block; width: 100%; margin-top: 10px; height: 55px; font-weight: 500;}
.or1_wrap2 .right .choose{border: 1px solid #e8e8e8; background: none;}
.or1_wrap2 .right .all{background: #1d1d1f; color: #fff; border: none;}

.or2_wrap{text-align: center;}
.or2_wrap h2{font-size: 2.8rem; font-weight: bold; color: #121212; margin: 25px 0 15px 0;}
.or2_wrap p{font-size: 1.8rem; color: #666;}

a.btn_admin, .btn_admin{padding: 0px 10px 6px 10px !important;}

#bo_cate #bo_cate_on{background: #fff; border: 1px solid #666; color: #888; font-weight: 500;}
#bo_cate a{border: 1px solid #e1e1e1; color: #888; font-size: 1.4rem; font-weight: 400; border-radius: 5px;}
#bo_cate li{width: 18%;}

.or1_wrap2 .or_input_wrap5 .or_top{display: flex; justify-content: space-between; align-items: center; background: #f8f8f8; padding: 20px 15px;}
.or1_wrap2 .or_input_wrap5 .or_top h2{margin-bottom: 0px; color: #333; font-weight: 600; font-size: 1.6rem;}
.or1_wrap2 .or_input_wrap5 .or_top button{border: none; background: none;}
.or1_wrap2 .or_input_wrap5 .or_pro{padding: 30px 0 0 0; gap: 0px 10px; display: flex; align-items: flex-start;}
.or1_wrap2 .or_input_wrap5 .or_pro label{width: 100%; padding-bottom: 30px; border-bottom: 1px solid #e8e8e8; }
.or1_wrap2 .or_input_wrap5 .or_pro .opro_info .img{width: 120px;}
.or1_wrap2 .or_input_wrap5 .or_pro .opro_info .img img{width: 100%;}
.or1_wrap2 .or_input_wrap5 .or_pro .opro_info{display: flex; align-items: flex-start; gap: 0px 2%; margin-bottom: 25px;}
.or1_wrap2 .or_input_wrap5 .or_pro .opro_info .text h2{font-size: 1.8rem; margin-bottom: 5px;}
.or1_wrap2 .or_input_wrap5 .or_pro .opro_info .text h3{font-size: 1.4rem; color: #333; margin-bottom: 8px;}
.or1_wrap2 .or_input_wrap5 .or_pro .opro_info .text h4{font-size: 1.3rem; color: #999;}
.or1_wrap2 .or_input_wrap5 .or_pro .or_option{border-radius: 9px; border: 1px solid #e8e8e8; padding: 20px; margin-bottom: 25px;}
.or1_wrap2 .or_input_wrap5 .or_pro .or_option span{font-size: 1.5rem; color: #999;}
.or1_wrap2 .or_input_wrap5 .or_num_wrap{display: flex; justify-content: space-between; align-items: center;}
.or1_wrap2 .or_input_wrap5 .or_num_wrap h6{font-size: 1.3rem; color: #999;}
.or1_wrap2 .or_input_wrap5 .or_num{display: flex; gap: 0px 8px;}
.or1_wrap2 .or_input_wrap5 .or_num .number{display: flex; width: 120px; border: 1px solid #e8e8e8; border-right: 0px;}
.or1_wrap2 .or_input_wrap5 .or_num .number button{width: 40px; height: 40px; border: none; border-right: 1px solid #e8e8e8; background: none;}
.or1_wrap2 .or_input_wrap5 .or_num .number input{width: 40px; height: 40px; text-align: center; border: none; border-right: 1px solid #e8e8e8; padding-left: 10px;}
.or1_wrap2 .or_input_wrap5 .or_num .change{width: 65px; height: 40px; border: 1px solid #e8e8e8; background: none; font-size: 1.4rem; font-weight: 500; color: #121212;}
.or1_wrap2 .or_input_wrap5 .or_price{display: flex; justify-content: space-between; align-items: center; padding: 22px 0 25px 22px;}
.or1_wrap2 .or_input_wrap5 .or_price h6{font-size: 1.4rem; color: #333;}
.or1_wrap2 .or_input_wrap5 .or_price h5{font-size: 2.0rem; color: #121212; font-weight: bold;}
.or1_wrap2 .or_input_wrap5 .or_price h5 span{font-size: 1.5rem; font-weight: 500;}
.or1_wrap2 .or_input_wrap5 .or_btn{display: flex; align-items: center; gap: 0px 1%; padding-left: 22px;}
.or1_wrap2 .or_input_wrap5 .or_btn button{width: 50%; height: 54px; font-size: 1.8rem; font-weight: 500; border: none; background: none;}
.or1_wrap2 .or_input_wrap5 .or_btn button:first-child{border: 1px solid #e2e2e2; color: #333;}
.or1_wrap2 .or_input_wrap5 .or_btn button:last-child{ color: #fff; background: #1d1d1f; }
.or1_wrap2 .or_input_wrap5 .or_choose{display: flex; margin-top: 45px; gap: 0px 10px;}
.or1_wrap2 .or_input_wrap5 .or_choose button{width: 88px; height: 40px; font-size: 1.4rem; font-weight: 500; color: #121212; border: 1px solid #dfdfe2; background: none;}

.mypage .my_top{background: #f9f9f9; border-radius: 6px; border: 1px solid #e5e5e5; padding: 35px 0; display: flex; justify-content: center; margin-bottom: 38px;}
.mypage .my_top dl{display: flex; gap: 20px; padding-left: 5%; align-items: center; padding-right: 5%;}
.mypage .my_top dl dt{position: relative;}
.mypage .my_top dl dt .img-circle{width: 90px; border: 1px solid #e8e8e8; border-radius: 50%; overflow: hidden;}
.mypage .my_top dl dt a{position: absolute; bottom: -3px; right: 0;}
.mypage .my_top dl dd h2{font-size: 2.2rem; font-weight: bold; color: #333; margin-bottom: 10px;}
.mypage .my_top dl dd p{font-size: 1.8rem; color: #666; font-weight: 500;}
.mypage .my_top dl dd p b{font-weight: 600; color: #333;}
.mypage .my_top .box_wrap{width: 60%; display: flex;}
.mypage .my_top .box_wrap .box{width: 33.3333%; text-align: center; position: relative;}
.mypage .my_top .box_wrap .box:before{content: ''; width: 1px; height: 60px; background:#eee; position: absolute; left: 0; top: 24%;}
.mypage .my_top .box_wrap .box h3{margin-top: 15px; font-size: 2.0rem; font-weight: bold; color: #333;}
.mypage .my_top .box_wrap .box h4{margin-top: 5px; font-size: 1.5rem; color: #999;}
.mypage .my_wrap{display: flex; gap: 25px 4%;}
.mypage .my_wrap .left{width: 30%; max-width: 250px;}
.mypage .my_wrap .left ul{border: 1px solid #e8e8e8; padding: 0px 25px;}
.mypage .my_wrap .left ul li a{ border-bottom: 1px solid #e8e8e8; padding: 22px 0; color: #333; font-weight: 600; display: block;}
.mypage .my_wrap .left ul li:last-child a{border-bottom: 0px;}
.mypage .right{width: 100%;}
.mypage .box_area{width: 100%;}
.mypage .right .box_area h2{font-size: 1.8rem; font-weight: bold; color: #333; margin-bottom: 15px;}
.mypage .right .box_area h2 span{font-size: 1.4rem; font-weight: 500; color: #999;}
.mypage .box_area1 .box_wrap{display: flex; gap: 20px 2%; width: 100%;}
.mypage .box_area1{margin-bottom: 45px;}
.mypage .box_area .box_wrap{ width: 100%;}
.mypage .box_area1 .delivery{display: flex; gap: 20px 2%; width: 67%; border-radius: 6px; border: 1px solid #e5e5e5; padding: 60px 0; justify-content: center; align-items: center;}
.mypage .box_area1 .delivery .box{text-align: center; width: 20%;}
.mypage .box_area1 .delivery span{color: #e7e7e7; font-size: 2.4rem; font-family: 'SUIT-Medium';}
.mypage .box_area1 .delivery .box h4{font-size: 2.2rem; font-weight: bold; color: #333; margin-bottom: 6px;}
.mypage .box_area1 .delivery .box h3{font-size: 1.5rem; color: #999;}
.mypage .box_area1 .return{width: 33%; display: flex; flex-direction: column; gap: 13px 0;}
.mypage .box_area1 .return li{width: 100%; height: 50px; border-radius: 6px; border: 1px solid #e5e5e5;background: #f9f9f9; display: flex; align-items: center; justify-content: center; gap: 0px 5px; font-size: 1.5rem; color: #666;}
.mypage .box_area1 .return li b{font-weight: 600; color: #333;}
.mypage .box_area2{margin-bottom: 85px;}
.mypage .box_area2 .history_area{border-top: 2px solid #333; border-bottom: 2px solid #333;}
.mypage .box_area2 .delivery_txt{padding-top: 20px; padding-bottom: 2px;}
.mypage .box_area2 .delivery_txt h3{font-size: 2.0rem; font-weight: 600; color: #333; margin-bottom: 6px;}
.mypage .box_area2 .delivery_txt h4{font-size: 1.4rem; font-weight: 500; color: #989898;}
.mypage .box_area2 .box_wrap{display: flex; padding: 18px 0; border-bottom: 1px solid #efefef; justify-content: space-between; align-items: center;}
.mypage .box_area2 .box_wrap .info{display: flex; align-items: center; gap: 0px 3%; width: 70%;}
.mypage .box_area2 .box_wrap .info .img{width: 90px; border-radius: 7px; overflow: hidden;}
.mypage .box_area2 .box_wrap .info .img img{width: 100%;}
.mypage .box_area2 .box_wrap .info h3{font-size: 1.8rem; color: #333; font-weight: 500; margin-bottom: 5px;}
.mypage .box_area2 .box_wrap .info h4{font-size: 1.6rem; color: #989898; font-weight: 500; }
.mypage .box_area3 h2{display: flex; align-items: center; justify-content: space-between;}
.mypage .box_area3 h2 a{font-size: 1.5rem; color: #333; }
.mypage .box_area3 h2 a span{margin-left: 8px; font-family: 'SUIT-SemiBold'; color: #333;}
.mypage .box_area3 .box_wrap{border-top: 2px solid #333; display: flex; gap: 45px 3%; padding-top: 35px;}
.mypage .box_area3 .box_wrap .box{width: 25%;}
.mypage .box_area3 .box_wrap .box .pro_img{width: 100%; border-radius: 10px; overflow: hidden; display: block;}
.mypage .box_area3 .box_wrap .box a img{width: 100%; height: initial !important;}
.mypage .box_area3 .box_wrap .box h3{margin: 12px 0px 7px 0;}
.mypage .box_area3 .box_wrap .box h3 a{font-size: 1.7rem; font-weight: 600; color: #121212;}
.mypage .box_area3 .box_wrap .box h4{font-size: 1.4rem; color: #999; margin-bottom: 10px;}
.mypage .box_area3 .box_wrap .box h5{font-size: 1.4rem; font-weight: 500; color: #999; text-decoration: line-through; margin-bottom: 3px;}
.mypage .box_area3 .box_wrap .box dl{display: flex; gap: 0px 6px;}
.mypage .box_area3 .box_wrap .box dt{font-size: 1.7rem; font-weight: bold; color: #ff1113;}
.mypage .box_area3 .box_wrap .box dt span{font-size: 1.0rem;}
.mypage .box_area3 .box_wrap .box dd{font-size: 1.7rem; font-weight: bold; color: #121212;}

#sod_ws .box_area3 h2 {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

#sod_ws .box_area3 h2 a {
  font-size: 1.5rem;
  color: #333;
}

#sod_ws .box_area3 h2 a span {
  margin-left: 8px;
  font-family: 'SUIT-SemiBold';
  color: #333;
}

#sod_ws .box_area3 .box_wrap {
  display: flex;
  flex-wrap: wrap;       /* ✅ 줄바꿈 허용 */
  gap: 45px 2%;
  padding-top: 35px;
}

#sod_ws .box_area3 .box_wrap .box {
  position: relative;
  box-sizing: border-box;
  width: 23%;
}

#sod_ws .box_area3 .box_wrap .box .pro_img {
  width: 100%;
  border-radius: 10px;
  overflow: hidden;
  display: block;
}

#sod_ws .box_area3 .box_wrap .box .pro_img img {
  width: 100%;
  display: block;
  text-align: center;
    margin: 0 auto;
    justify-content: center;
  height: initial;
}

#sod_ws .box_area3 .box_wrap .box h3 {
  position: relative;
  margin: 12px 0px 7px 0;
}

#sod_ws .box_area3 .box_wrap .box h3 a {
  font-size: 1.7rem;
  font-weight: 600;
  color: #121212;
}

#sod_ws .box_area3 .box_wrap .box h4 {
  font-size: 1.4rem;
  color: #999;
  margin-bottom: 10px;
}

#sod_ws .box_area3 .box_wrap .box h5 {
  font-size: 1.4rem;
  font-weight: 500;
  color: #999;
  text-decoration: line-through;
  margin-bottom: 3px;
}

#sod_ws .box_area3 .box_wrap .box dl {
  display: flex;
  gap: 0px 6px;
}

#sod_ws .box_area3 .box_wrap .box dt {
  font-size: 1.7rem;
  font-weight: bold;
  color: #ff1113;
}

#sod_ws .box_area3 .box_wrap .box dt span {
  font-size: 1.0rem;
}

#sod_ws .box_area3 .box_wrap .box dd {
  font-size: 1.7rem;
  font-weight: bold;
  color: #121212;
}

#sod_ws_act .btn02{border: 1px solid #121212; background: #121212;}

/* ✅ 반응형 처리 */
@media (max-width: 640px) {
  #sod_ws .box_area3 .box_wrap .box {
    width: 49%;   /* 모바일 1열 */
  }
}

@media (min-width: 641px) and (max-width: 1024px) {
  #sod_ws .box_area3 .box_wrap .box {
    width: 48%;    /* 태블릿 2열 */
  }
}

@media (min-width: 1025px) and (max-width: 1280px) {
  #sod_ws .box_area3 .box_wrap .box {
    width: 31%;    /* 노트북 3열 */
  }
}



.bo_vc_w .btn_submit{color: #fff;}
#ssch_cate{display: none;}
#ssch_frm .ssch_option{display: none;}
#ssch_sort_all{display: none}
#ssch h2{font-size: 2.2rem; padding: 0px 2%;}
#sod_fin{max-width: 1220px; margin: 0 auto; padding-top: 220px;}
.sod_left, .sod_right{float: initial; width: 100% !important;}

@media all and (max-width: 1400px){}
@media all and (max-width: 1200px){}
@media all and (max-width: 1024px){
    .mainSwiper{margin-top: 60px;}
    .mainSwiper .main_text{width: 80%;}
    .mainSwiper .main_btn_wrap .main_btn{width: 32px; height: 46px;}
    .mainSwiper .main_text h3{font-size: 1.7rem; margin-bottom: 10px;}
    .mainSwiper .main_text h2{font-size: 3.4rem;}
    .mainSwiper .main_text p{font-size: 1.6rem;}
    .mainSwiper .main_text a{width: 125px; height: 45px; font-size: 1.6rem; margin-top: 25px;}
    .sct_wrap header h2 a{font-size: 2.5rem;}
    .owl-dots{margin-top: 25px;}
    .m2{margin-top: 80px;  background-attachment: initial;}
    .m2 h2{font-size: 3.4rem; margin-bottom: 12px;}
    .m2 p{font-size: 1.6rem; margin-bottom: 30px;}
    .m2 a{font-size: 1.6rem; width: 120px; height: 45px;}
    .m3{padding: 120px 0;}
    .mbskin{margin-top: 100px;}
    .register{margin-top: 100px;}
    .half_input h3{padding: 20px 0 20px 18px; min-width: 120px;}
    .half_input .h3{min-width: 120px; padding-left: 18px;}
    #sct{padding: 100px 0 80px 0;}
    .shop_ca_name{margin-bottom: 50px;}
    .best_photo_wrap, .order, #bo_list, #bo_gall, #bo_w, .mypage, #bo_v, .item_wrap{padding: 100px 0 80px 0;}
    .item_wrap .item_title h2{font-size: 2.5rem; margin-bottom: 10px;}
    .item_wrap .item_title{padding-bottom: 20px; margin-bottom: 25px;}
    .pro_menu li a{height: 45px; font-size: 1.6rem;}
    .pro_menu_fixed{top: 60px;}
    .pro_box4 .apply{width: 120px; height: 45px;}
    .or1_wrap2 .left dt{min-width: 120px; padding: 22px 0 22px 16px;}
  .mypage .my_top{flex-direction: column; gap: 35px 0; padding: 20px 0;}
  .mypage .my_top .box_wrap{width: 100%;}
  .pro_menu.fixed{top: 60px;}
  #ssch{padding-top: 80px;}
  .best_photo_wrap, .order, #bo_list, #bo_gall, #bo_w, .mypage, #bo_v, #sod_ws, #sod_v, #sod_fin{padding-top: 80px;}
  .search-full{top: 60px;}
  .search-field form{width: 92%;}
}
@media all and (max-width: 900px){
    .mainSwiper{height: 355px;}
    .item_wrap .item_top{flex-direction: column;}
    .item_wrap .item_slide{width: 100%;}
    .item_wrap .item_info{width: 100%;}
  .mypage .my_wrap{flex-direction: column;}
  .mypage .my_wrap .left{width: 100%; max-width: initial;}
  .mypage .my_wrap .left ul li a{padding: 15px 0;}
}
@media all and (max-width: 850px){
    .or1_wrap2{flex-direction: column;}
    .or1_wrap2 .left{width: 100%;}
    .or1_wrap2 .right{width: 100%;}
    .acco .collapsible{font-size: 1.6rem;}
  .banner30 .bn-bg{background-attachment: initial !important;}
}
@media all and (max-width: 800px){
    .shop_list_nav li{width: 24%;}
}
@media all and (max-width: 768px){
    .mainSwiper .main_text{width: 90%;}
    .mainSwiper .main_btn_wrap .main_btn{display: none;}
    .sct_wrap .more_btn{width: 200px; height: 42px; margin: 45px auto 0 auto}
    .m3 .box_wrap a{width: 32%;}
    .m2{padding: 0px 0;}
    .m2 h2{font-size: 2.6rem;}
    #ft .footer{flex-direction: column; gap: 40px 0;}
    #ft .ft_info_wrap ul{flex-direction: column; align-items: flex-start;}
    #ft .ft_info_wrap ul span{display: none;}
    #ft .ft_center h2{font-size: 2.4rem; margin-bottom: 10px;}
    #ft .ft_center h3{margin-bottom: 7px;}
    .re_all .treview_wrap{flex-direction: column; gap: 25px 0;}
    .re_all .treview_wrap .tre_photo button{max-width: 50px;}
    .re_search select{width: 65px;}
    .re_search button{width: 65px;}
    .re_search input{width: 100px;}
    .pro_menu li a{font-size: 1.4rem;}
    .or1_wrap .scroll{overflow-x: scroll;}
    .or1_wrap .scroll table{width: 690px;}
    .or1_wrap2 .left dd > div{width: 100%;}
    #popup1 .mob_box .mo_top .re_more{font-size: 2.4rem; margin-bottom: 18px;}
    #popup1 .mob_box .mo_pro_title span{width: 35px;}
    #popup1 .mob_box .mo_pro_title h2{font-size: 1.8rem;}
    #popup1 .mob_box .mo_pro_title a{font-size: 2.6rem;}
    #popup1 .mob_box dl dt{font-size: 1.8rem;}
    #popup1 .mob_box dl dd{font-size: 1.8rem;}
    #popup1 .mob_box .star i{font-size: 2.6rem;}
    #popup1 .mob_box .mo_text1 p{font-size: 1.6rem;}
    #popup1 .mob_box .mo_text2 h2{font-size: 1.8rem;}
    #popup1 .mob_box .mo_text2 p{font-size: 1.6rem;}
  .mypage .box_area1 .box_wrap{flex-direction: column;}
  .mypage .box_area1 .delivery{width: 100%;}
  .mypage .box_area1 .return{width: 100%;}
  .mypage .box_area3 .box_wrap{flex-wrap: wrap;}
  .mypage .box_area3 .box_wrap .box{width: 48%;}
  #sod_ws_act button{width: 40%;}
  .section-head{flex-direction: column; gap: 6px 0; align-items: flex-start !important;}
  #sit_opt_added .num_input{width: 40px;}
}
@media all and (max-width: 650px){
  .mypage .my_top dl dt .img-circle{width: 70px;}
  .mypage .my_top dl dd h2{font-size: 1.8rem;}
  .mypage .my_top dl dd p{font-size: 1.5rem;}
  .mypage .my_top .box_wrap .box img{width: 35px;}
  .mypage .my_top .box_wrap .box h3{font-size: 1.8rem;}
  .item_wrap .item_title .item_icon{        position: initial;         margin-top: 10px; top: initial; bottom: 5px; gap: 0px 0px;}
}



/* 오버레이 캡션 최소 스타일 (사이트 스타일 있으면 생략 가능) */
#main_bn .main_banner_owl .item{ position:relative; }
#main_bn .main_banner_owl .main_text{
position: absolute;
    left: 20%;
    top: 0%;
    color: #111;
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    max-width: 1180px;
    width: 100%;
    margin: 0 auto;
}
#main_bn .main_banner_owl .main_text h3{
    margin: 0 0 10px;
    font-size: 2.0rem;
    font-weight: 600;
    color: #333;
}
#main_bn .main_banner_owl .main_text h2{
  font-size:44px; line-height:1.2; margin:.2em 0 .6em; font-weight:700;
}
#main_bn .main_banner_owl .main_text p{
  color:#555; line-height:1.7; margin:0 0 18px;
}
#main_bn .main_banner_owl .main_text .bn-btn{
    width: 155px;
    height: 57px;
    border-radius: 30px;
    background: #111;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 1.8rem;
    font-weight: 500;
    margin-top: 40px;
}

/* 반응형 보정 */
@media (max-width:1024px){
  .mainSwiper .bn-caption{ left:5%; top:12%; max-width:60%; }
  .mainSwiper .st-title{ font-size:34px; }
  .shop_ca_name{display: none;}
  #sct_location.view_location{display: none;}
}
@media (max-width:640px){
	
  .mainSwiper .bn-caption{ left:4%; bottom:0%; top:auto; max-width:86%; }
  .mainSwiper .st-title{ font-size:24px; }
  .mainSwiper .st-desc{ font-size:14px; }
  .mainSwiper .st-subtitle {}
  .mainSwiper .swiper-slide picture img {    width: 100%;}
}

/* ===== Top Banner (Final) ===== */
.hd-top-banner { border-bottom: 1px solid rgba(255,255,255,.08); }
/* 배너 기본값: 투명 */
.hd-top-banner { --tb-bg-color: transparent; --tb-bg-image: none; }

.hd-top-banner .hdtopSwiper { width: 100%; }

.hd-top-banner .swiper-slide{
  background-color: var(--tb-bg-color, transparent);
  background-image: var(--tb-bg-image, none);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  color: var(--tb-fg-color, #ffffff);


  min-height: 38px;
  display:flex;align-items:center;justify-content:center;
  padding:6px 12px;font-size:14px;line-height:1.4;letter-spacing:.01em;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}


.hd-top-banner__link,
.hd-top-banner__text{
  display: block;
  width: 100%;
  text-align: center;
  color: inherit;
  text-decoration: none;
}

.hd-top-banner__link:hover,
.hd-top-banner__link:focus{
  text-decoration: underline;
}

@media (max-width: 768px){
  .hd-top-banner .swiper-slide{ min-height: 36px; font-size: 13px; padding: 6px 10px; }
}

/* 다크 전역이 덮어쓸 때 방어 */
html.dark .hd-top-banner .swiper-slide{ background-color: var(--tb-bg-color, transparent) !important; }


/* =============================================================
   주문서(/shop/orderform.php) 보강 — CSS 전용
   ─ HTML 구조상 .or1_wrap2 가 중첩되고 .right/.sod_frm_point 가
     외부 or1_wrap2 스코프를 벗어나서 기존 셀렉터가 적용되지 않는
     케이스가 있어, .order 스코프로 동일 스타일을 재선언해 보강.
   ─ 반응형 브레이크포인트는 기존 style.css(1024/850/768/640) 기준.
   ============================================================= */

/* ── 결제수단 블록 (.or_input_wrap3 scope) ── */
.order .or_input_wrap3 { margin-top: 80px; }
.order .or_input_wrap3 .or_top h2 { display: flex; align-items: center; justify-content: space-between; font-size: 2.0rem; font-weight: 600; color: #121212; margin-bottom: 20px; }
.order .or_input_wrap3 > dl { border-top: 1px solid #e8e8e8; border-bottom: 1px solid #e8e8e8; display: flex; }
.order .or_input_wrap3 > dl > dt { background: #f9f9f9; font-size: 1.7rem; font-weight: 500; color: #666; min-width: 190px; padding: 22px; }
.order .or_input_wrap3 > dl > dt span { color: #931215; }
.order .or_input_wrap3 > dl > dd { padding: 15px; width: 100%; }

/* 결제수단 라디오 (중첩된 .or1_wrap2 .in_type4) — scope 완화 */
.order .or_input_wrap3 .in_type4 { display: flex; flex-wrap: wrap; gap: 10px 2%; width: 100%; }
.order .or_input_wrap3 .in_type4 input[type="radio"] { position: absolute; left: -9999px; opacity: 0; }
.order .or_input_wrap3 .in_type4 label { width: 49%; border: 1px solid #c6c6c6; height: 64px; display: flex; align-items: center; justify-content: center; font-size: 1.5rem; color: #666; cursor: pointer; box-sizing: border-box; background: #fff; }
.order .or_input_wrap3 .in_type4 input[type="radio"]:checked + label { background: #121212; color: #fff; border-color: #121212; }
.order .or_input_wrap3 .in_type4 legend { display: none; }

/* 포인트 사용 영역 */
.order .or_input_wrap3 .sod_frm_point { width: 100%; margin-top: 25px; padding-top: 25px; border-top: 1px dashed #e8e8e8; display: flex; flex-wrap: wrap; gap: 15px 30px; align-items: center; }
.order .or_input_wrap3 .sod_frm_point > div:first-child { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.order .or_input_wrap3 .sod_frm_point label { color: #666; font-size: 1.4rem; font-weight: 500; }
.order .or_input_wrap3 .sod_frm_point input[type="text"] { width: 120px; height: 40px; border: 1px solid #e8e8e8; padding: 0 10px; font-size: 1.5rem; color: #333; }
.order .or_input_wrap3 .sod_frm_point #sod_frm_pt { display: flex; flex-wrap: wrap; gap: 8px 25px; font-size: 1.4rem; color: #666; }
/* default_shop.css 의 #forderform #sod_frm_pt border-top 제거 */
#forderform #sod_frm_pt { border-top: 0; }
/* 주문취소 버튼 하단 여백 */
#sod_fin_cancel { margin-bottom: 70px; }
/* 주문하기 / 취소 버튼 폰트크기 통일 */
#display_pay_button .btn_submit,
#display_pay_button .btn01 { font-size: 1.25em; }
.order .or_input_wrap3 .sod_frm_point #sod_frm_pt strong { font-weight: 600; color: #333; margin-right: 6px; }
.order .or_input_wrap3 .sod_frm_point #sod_frm_pt em { font-style: normal; font-weight: 600; color: #931215; }

/* 무통장 계좌선택/입금자명 — 테마 톤에 맞춘 카드 */
.order #settle_bank {
  width: 100% !important;
  margin: 20px 0 0 0 !important;
  padding: 24px !important;
  background: #fafafa !important;
  border: 1px solid #e8e8e8 !important;
  border-top: 1px solid #e8e8e8 !important;
  border-radius: 4px;
  /* display 는 !important 없이 → inline style="display:none" 이 초기 숨김을 담당,
     JS .show() 로 inline 이 제거되면 이 display:flex 가 적용됨 */
  display: flex;
  flex-direction: column;
  gap: 14px;
  line-height: 1.5 !important;
  clear: both;
  box-sizing: border-box;
}
.order #settle_bank::after { content: none !important; display: none !important; }
.order #settle_bank br { display: none; }
.order #settle_bank label:not(.sound_only) {
  float: none !important;
  width: auto !important;
  line-height: 1.4 !important;
  margin: 0 0 6px 0;
  font-size: 1.4rem;
  font-weight: 500;
  color: #555;
  display: block;
}
/* 스크린리더 전용 label 은 건드리지 않음 */
.order #settle_bank label.sound_only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0,0,0,0) !important;
  border: 0 !important;
}
.order #settle_bank select,
.order #settle_bank input[type="text"],
.order #settle_bank #od_deposit_name {
  width: 100% !important;
  height: 46px !important;
  margin: 0 !important;
  padding: 0 14px !important;
  border: 1px solid #dcdcdc !important;
  border-radius: 3px !important;
  background: #fff;
  font-size: 1.4rem;
  color: #333;
  text-align: left !important;
  box-sizing: border-box;
  transition: border-color .15s;
}
.order #settle_bank select:focus,
.order #settle_bank input[type="text"]:focus {
  border-color: #121212 !important;
  outline: none;
}
.order #settle_bank select { appearance: none; -webkit-appearance: none; background: #fff url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'><path fill='none' stroke='%23666' stroke-width='1.5' d='M1 1l4 4 4-4'/></svg>") no-repeat right 14px center; padding-right: 36px !important; }
/* 각 행(label + 입력)을 한 그룹으로 묶기 위해 간격 */
.order #settle_bank > * + * { margin-top: 0; }

/* ── .or1_wrap2 세로 flex + .left/.right 는 display:contents 로 자식 승격 ──
      → .right 의 .price_wrap 을 .left 의 결제하기 버튼 바로 위에 끼워넣기 위함 */
.order .or1_wrap2 { display: flex; flex-direction: column; gap: 0; }
.order .or1_wrap2 > .left,
.order .or1_wrap2 > .right { display: contents; }

/* 표시 순서: 결제수단 → 주문자정보 → 배송정보 → 아코디언(약관) → 총합계 → PG주문버튼 → 결제하기 버튼
   지정 안 된 자식이 order:0 으로 맨 앞으로 튀는 걸 막기 위해 기본값 부여 */
.order .or1_wrap2 > *,
.order .or1_wrap2 > .left > *,
.order .or1_wrap2 > .right > * { order: 99; }

/* descendant 셀렉터로 구조 관계없이 매칭 */
.order .or1_wrap2 #sod_frm_orderer,
.order .or1_wrap2 .or_input_wrap  { order: 1 !important; }   /* 주문자정보 (section 까지 포함) */
.order .or1_wrap2 .or_input_wrap2 { order: 2 !important; }   /* 배송정보 */
.order .or1_wrap2 .or_input_wrap3,
.order .or1_wrap2 #settle_bank { order: 3 !important; }      /* 결제수단 + 무통장 계좌선택 */
.order .or1_wrap2 .or_input_wrap4 { order: 4 !important; }   /* 아코디언 */
.order .or1_wrap2 .price_wrap     { order: 5 !important; margin-top: 40px; }   /* 총합계 */
.order .or1_wrap2 > .right > *:not(.price_wrap) { order: 6 !important; }       /* PG 주문버튼 */
.order .or1_wrap2 button.submit,
.order .or1_wrap2 #order,
.order .or1_wrap2 .submit { order: 999 !important; }          /* 결제하기 버튼 */

/* 결제수단 내부의 중첩 .or1_wrap2 도 세로 */
.order .or_input_wrap3 .or1_wrap2 { flex-direction: column; }

/* ── 약관 동의 아코디언 (.or1_wrap2 .left .or_input_wrap4 .acco) ── */
.or1_wrap2 .left .or_input_wrap4 { margin-top: 60px; }
.or1_wrap2 .left .or_input_wrap4 .acco { border-top: 1px solid #e8e8e8; }
.or1_wrap2 .left .or_input_wrap4 .acco .collapsible { width: 100%; display: flex; align-items: center; gap: 10px; padding: 18px 15px; background: none; border: none; border-bottom: 1px solid #e8e8e8; text-align: left; font-size: 1.5rem; font-weight: 500; color: #333; cursor: pointer; position: relative; }
.or1_wrap2 .left .or_input_wrap4 .acco .collapsible::after { content: '\25BE'; margin-left: auto; font-size: 1.3rem; color: #888; transition: transform .2s; }
.or1_wrap2 .left .or_input_wrap4 .acco .collapsible.active::after { transform: rotate(180deg); }
.or1_wrap2 .left .or_input_wrap4 .acco .collapsible span { display: inline-flex; align-items: center; }
.or1_wrap2 .left .or_input_wrap4 .acco .collapsible input[type="checkbox"] { width: 18px; height: 18px; margin: 0; accent-color: #121212; }
.or1_wrap2 .left .or_input_wrap4 .acco .content { max-height: 0; overflow: hidden; transition: max-height .25s ease-out; border-bottom: 1px solid #e8e8e8; }
.or1_wrap2 .left .or_input_wrap4 .acco .content .tbox { padding: 18px 20px; background: #fafafa; font-size: 1.3rem; line-height: 1.7; color: #666; }

/* ── 주문하기(결제하기) 버튼 (.or1_wrap2 .left scope) ── */
.or1_wrap2 .left button.submit,
.or1_wrap2 .left .submit#order,
.or1_wrap2 .left .submit { display: block; width: 360px; max-width: 100%; height: 65px; margin: 70px auto 0 auto; background: #1d1d1f; color: #fff; font-size: 1.8rem; font-weight: 500; border: none; cursor: pointer; letter-spacing: .02em; }
.or1_wrap2 .left button.submit:hover,
.or1_wrap2 .left .submit#order:hover { background: #121212; }

/* ── 가격 요약 (.right > .price_wrap) — .or1_wrap2 scope 밖 대응 ── */
.order .right { width: 27%; }
.order .right .price_wrap { border: 1px solid #e8e8e8; padding: 30px 20px; margin-bottom: 20px; }
.order .right .price_wrap dl { display: flex; justify-content: space-between; align-items: center; margin: 0 0 15px 0; }
.order .right .price_wrap dl:last-child { margin-bottom: 0; }
.order .right .price_wrap dt { font-weight: 500; color: #121212; font-size: 1.5rem; }
.order .right .price_wrap dd { font-weight: 500; color: #121212; font-size: 1.5rem; }
.order .right .price_wrap dd span { font-size: 1.4rem; font-weight: 500; color: #121212; margin-left: 2px; }
.order .right .price_wrap .result { padding-top: 25px; border-top: 1px solid #e8e8e8; margin-top: 25px; }
.order .right .price_wrap .result dt,
.order .right .price_wrap .result dd { font-size: 1.8rem; font-weight: 700; }
.order .right button,
.order .right input[type="submit"],
.order .right input[type="button"],
.order .right a.btn { display: block; width: 100%; margin-top: 10px; height: 55px; line-height: 55px; font-weight: 500; font-size: 1.5rem; text-align: center; cursor: pointer; box-sizing: border-box; }
.order .right .choose { border: 1px solid #e8e8e8; background: #fff; color: #121212; }
.order .right .all,
.order .right button[type="submit"] { background: #1d1d1f; color: #fff; border: none; }

/* ── 받는분 정보 숨김용 보정 ── */
.order #sod_frm_taker { margin: 0; }

/* =============================================================
   반응형 — 주문서 보강
   ============================================================= */

/* 태블릿 이하: .or1_wrap2 세로 전환은 850px 기존 규칙이 처리.
   결제수단/가격요약 자체의 내부 조정 */
@media all and (max-width: 1024px) {
  .order .or_input_wrap3 { margin-top: 60px; }
  .order .or_input_wrap3 > dl > dt { min-width: 140px; padding: 18px 16px; font-size: 1.5rem; }
  .order .or_input_wrap3 .in_type4 label { height: 58px; font-size: 1.4rem; }
  .order .right { width: 100%; }
  .order .or1_wrap2 .left button.submit,
  .or1_wrap2 .left .submit#order,
  .or1_wrap2 .left .submit { width: 100%; max-width: 480px; }
}

/* 중간 모바일: 결제수단 2열 유지하되 높이/폰트 축소 */
@media all and (max-width: 850px) {
  .order .or_input_wrap3 > dl { flex-direction: column; }
  .order .or_input_wrap3 > dl > dt { min-width: 100%; padding: 14px 16px; border-bottom: 1px solid #e8e8e8; }
  .order .or_input_wrap3 > dl > dd { padding: 15px 0 5px 0; }
  .order .or_input_wrap3 .sod_frm_point { gap: 12px 20px; }
}

/* 모바일: 결제수단 1열, 포인트 세로, 버튼 100% */
@media all and (max-width: 768px) {
  .order .or_input_wrap3 { margin-top: 50px; }
  .order .or_input_wrap3 .or_top h2 { font-size: 1.8rem; margin-bottom: 15px; }
  .order .or_input_wrap3 .in_type4 { gap: 8px 2%; }
  .order .or_input_wrap3 .in_type4 label { width: 100%; height: 54px; font-size: 1.4rem; }
  .order .or_input_wrap3 .sod_frm_point { flex-direction: column; align-items: flex-start; gap: 12px; margin-top: 20px; padding-top: 20px; }
  .order .or_input_wrap3 .sod_frm_point > div:first-child { width: 100%; }
  .order .or_input_wrap3 .sod_frm_point input[type="text"] { flex: 1; min-width: 100px; }
  .order .or_input_wrap3 .sod_frm_point #sod_frm_pt { flex-direction: column; gap: 6px 0; width: 100%; }
  .order .or_input_wrap3 #settle_bank { flex-direction: column; align-items: stretch; }
  .order .or_input_wrap3 #settle_bank select,
  .order .or_input_wrap3 #settle_bank input[type="text"] { width: 100%; }

  .or1_wrap2 .left .or_input_wrap4 { margin-top: 45px; }
  .or1_wrap2 .left .or_input_wrap4 .acco .collapsible { font-size: 1.4rem; padding: 15px 12px; gap: 8px; }
  .or1_wrap2 .left .or_input_wrap4 .acco .content .tbox { padding: 15px; font-size: 1.25rem; }

  .or1_wrap2 .left button.submit,
  .or1_wrap2 .left .submit#order,
  .or1_wrap2 .left .submit { height: 58px; font-size: 1.6rem; margin-top: 50px; }

  .order .right .price_wrap { padding: 22px 16px; }
  .order .right .price_wrap dt,
  .order .right .price_wrap dd { font-size: 1.4rem; }
  .order .right .price_wrap .result dt,
  .order .right .price_wrap .result dd { font-size: 1.6rem; }
  .order .right button,
  .order .right input[type="submit"],
  .order .right input[type="button"] { height: 52px; font-size: 1.4rem; line-height: 52px; }
}

/* 소형 모바일 */
@media all and (max-width: 480px) {
  .order .or_input_wrap3 .in_type4 label { height: 50px; font-size: 1.3rem; }
  .order .or_input_wrap3 > dl > dt { font-size: 1.4rem; padding: 12px 14px; }
  .order .or_input_wrap3 > dl > dd { padding-left: 2px; padding-right: 2px; }
  .order .right .price_wrap { padding: 18px 14px; }
}
