/* -------- 헤더 -------- */
header {width: 100%; position: fixed; top: 0; left: 0; z-index: 100;}
.header_wrap {width: calc(100% - 64px); margin: 60px auto 0; padding: 12px 72px; background-color: #fff; transition: all .2s;}
header.scroll {width: 100%; padding: 18px 64px;}

.hd_util {display: flex; justify-content: flex-end; align-items: center; transition: all .2s; position: absolute; top: 12px; right: 32px;}
.hd_util .util_menu {display: flex; align-items: center; gap: 20px; margin: 4px 0;}
.hd_util .util_menu a {display: block; width: 22px; height: 22px; position: relative;}
.hd_util .util_menu .square {width: max-content; height: auto; background-color: #3c2b1b50; padding: 4px 10px; backdrop-filter: blur(4px); border-radius: 3px;}
.hd_util .util_menu .square span {display: flex; align-items: center; gap: 8px; font-size: 15px; color: #fff;}
.hd_util .util_menu .square span i {display: block; width: 16px; height: 16px;}
.hd_util .util_menu .square.util_join {margin-right: -10px;}
.hd_util .util_menu .square.util_join span i {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/NEUTINAMU/publishing/168175098879518.png) no-repeat center/contain;}
.hd_util .util_menu .square.util_login span i {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/NEUTINAMU/publishing/168122592798100.png) no-repeat center/contain;}
.hd_util .util_menu .square.util_logout span i {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/NEUTINAMU/publishing/168175225866130.png) no-repeat center/contain;}
.hd_util .util_menu .square.util_mypage {margin-left: -10px;}
.hd_util .util_menu .square.util_mypage span i {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/NEUTINAMU/publishing/168122566336970.png) no-repeat center/contain;}
.hd_util .util_menu a img {display: block; width: 100%; height: 100%; object-fit: contain;}
.hd_util .util_menu .util_cart {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/NEUTINAMU/publishing/16812473531432.png) no-repeat center/contain;}
.hd_util .util_menu .util_cart .cart_count {position: absolute; display: flex; align-items: center; justify-content: center; padding: 6px; border-radius: 50%; background-color: #C9535A; top: -30%; right: -30%; width: 20px; height: 20px; text-align: center;}
.hd_util .util_menu .util_cart .cart_count span {font-weight: 700; color: #fff; font-size: 14px;}
.hd_util .util_menu .search_con {position: relative;}
.hd_util .util_menu .search_con input[type="text"] {border: none; outline: none; width: 150px; border-bottom: 1px solid #fff; font-size: 14px; padding: 4px; background: transparent; transition: all .2s;}
.hd_util .util_menu .search_con input[type="text"]:focus {background: rgba(255, 255, 255, .5);}
.hd_util .util_menu .search_con input[type="button"] {width: 22px; height: 22px; font-size: 0; outline: none; border: none; background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/NEUTINAMU/publishing/168122594013770.png) no-repeat center/contain; cursor: pointer; padding: 0;}


/* 모바일 - 바텀메뉴 */
.hd_util.mo {display: none; bottom: 0; top: initial; right: initial; left: 50%; transform: translateX(-50%); position: fixed; z-index: 400; width: 100%; background-color: #fff; padding: 15px 0; box-shadow: 0px -5px 10px rgba(0, 0, 0, .08);}
.hd_util.mo .util_menu {justify-content: center; gap: 0; align-items: stretch;}
.hd_util.mo .util_menu a {width: 25%;}
.hd_util.mo .util_menu .util_cart .cart_count {right: initial; left: 50%; transform: translateX(calc(-50% + 10px));}
.hd_util.mo .util_menu .search_con {width: 25%; text-align: center; background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/NEUTINAMU/publishing/168122594534834.png) no-repeat center/contain;}

.hd_util.mo .util_menu .util_home {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/NEUTINAMU/publishing/168348376033057.png) no-repeat center/contain;}
.hd_util.mo .util_menu .util_mypage {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/NEUTINAMU/publishing/168122591789732.png) no-repeat center/contain;}
.hd_util.mo .util_menu .util_cart {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/NEUTINAMU/publishing/16812260659211.png) no-repeat center/contain;}

.hd_util.mo .search_area {position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); background-color: #918983; width: 100%; display: flex; align-items: center; padding: 12px 15px 15px; flex-wrap: wrap; flex-direction: column; gap: 10px; box-shadow: 0px -5px 10px rgba(0, 0, 0, .08); display: none;}
.hd_util.mo .search_area .search_cont {display: flex; gap: 10px; width: 100%;}
.hd_util.mo .search_area input[type="text"] {padding: 8px;}
.hd_util.mo .search_area input[type="button"] {font-size: 14px; border-radius: 0; background-color: #423b34; color: #fff; text-align: center; padding: 0 20px;}
.hd_util.mo .search_area .close {display: block; width: 30px; height: 30px; border-radius: 100%; padding: 7px; background-color: #6e655b;}
.hd_util.mo .search_area .close img {width: 100%; height: 100%; display: block; object-fit: contain;}
 

/* 헤더 메인메뉴 */
.hd_main {display: flex; align-items: center; justify-content: space-between;}
.hd_main h1 {max-width: 140px;}
.hd_main h1 img {display: block; width: 100%; height: 100%; object-fit: contain;}
.hd_main nav ul {display: flex; align-items: center; gap: 30px; font-size: 18px; padding-top: 3px;}
.hd_main nav .depth1 {display: block; position: relative;}
.hd_main nav .depth1::after {content: ""; display: none; width: 100%; height: 4px; position: absolute; bottom: -15px; left: 50%; transform: translateX(-50%); background-color: #978677; transition: all .2s;}
.hd_main nav .depth1:hover::after {display: block;}

.hd_main .hd_side .side_box {background-color: #fcf6f0; padding: 6px; border-radius: 6px; font-size: 16px; display: flex; align-items: center; }
.hd_main .hd_side span {padding: 0 10px; color: #726C67; position: relative; cursor: pointer;}
.hd_main .hd_side span::after {content: ""; display: block; width: 1px; height: 60%; background-color: #C2B9B1; position: absolute; top: 50%; right: 0; transform: translateY(-50%);}
.hd_main .hd_side span:last-child:after {display: none;}
.hd_main .hd_side .burger_open {width: 26px; height: 26px; background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/NEUTINAMU/publishing/168347486421368.png) no-repeat center/contain; cursor: pointer; display: none;}


.hd_main .depth2 {position: absolute; display: flex; top: 100%; left: 50%; transform: translateX(-50%); background-color: #fbfbfb; padding: 12px 32px; justify-content: center; margin: 0 auto; width: calc(100% - 64px); display: none;}
.hd_main .depth2 a {color: #888; display: block; position: relative; transition: all .2s; font-weight: 500;}
.hd_main .depth2 a::after {content: ""; display: none; width: 100%; height: 1px; background-color: #333; left: 50%; bottom: 0px; transform: translateX(-50%); position: absolute; transition: all .2s;}
.hd_main .depth2 a:hover {color: #333;}
.hd_main .depth2 a:hover::after {display: block;}

/* 헤더 class="on" 추가되고 변경되는 css */
header.on .header_wrap {width: 100%; padding: 60px 64px 12px; box-shadow: 0 8px 20px rgba(0, 0, 0, .05); margin-top: 0;}
header.on .hd_main .depth2 {width: 100%;}
header.on .hd_util {right: 64px; top: 14px;}
header.on .hd_util .util_menu .square {padding: 0; background-color: transparent;}
header.on .hd_util .util_menu .square span {color: #555;}
header.on .hd_util .util_menu .square.util_join {margin-right: 0px;}
header.on .hd_util .util_menu .square.util_join span i {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/NEUTINAMU/publishing/168175099328942.png) no-repeat center/contain;}
header.on .hd_util .util_menu .square.util_login span i {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/NEUTINAMU/publishing/168122593277195.png) no-repeat center/contain;}
header.on .hd_util .util_menu .square.util_logout span i {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/NEUTINAMU/publishing/168175225298414.png) no-repeat center/contain;}
header.on .hd_util .util_menu .square.util_mypage {margin-left: 5px;}
header.on .hd_util .util_menu .square.util_mypage span i {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/NEUTINAMU/publishing/168122591789732.png) no-repeat center/contain;}
header.on .hd_util .util_menu .util_cart {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/NEUTINAMU/publishing/16812260659211.png) no-repeat center/contain;}
header.on .hd_util .util_menu .search_con input[type="text"] {border-color: #333;}
header.on .hd_util .util_menu .search_con input[type="button"] {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/NEUTINAMU/publishing/168122594534834.png) no-repeat center/contain;}


/* 인덱스페이지 제외한 페이지에서 나오는 헤더 */
.wrap.sub .header_wrap, header.on .wrap.sub .header_wrap {width: 100%; padding: 60px 64px 16px; border-bottom: 1px solid #eee; margin-top: 0; box-shadow: none;}
.wrap.sub .hd_main nav .depth1::after {bottom: -20px;}
.wrap.sub .hd_main .depth2 {width: 100%;}
.wrap.sub .hd_util {right: 64px; top: 14px;}
.wrap.sub .hd_util .util_menu .square {padding: 0; background-color: transparent;}
.wrap.sub .hd_util .util_menu .square span {color: #555;}
.wrap.sub .hd_util .util_menu .square.util_join {margin-right: 0px;}
.wrap.sub .hd_util .util_menu .square.util_join span i {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/NEUTINAMU/publishing/168175099328942.png) no-repeat center/contain;}
.wrap.sub .hd_util .util_menu .square.util_login span i {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/NEUTINAMU/publishing/168122593277195.png) no-repeat center/contain;}
.wrap.sub .hd_util .util_menu .square.util_logout span i {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/NEUTINAMU/publishing/168175225298414.png) no-repeat center/contain;}
.wrap.sub .hd_util .util_menu .square.util_mypage {margin-left: 5px;}
.wrap.sub .hd_util .util_menu .square.util_mypage span i {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/NEUTINAMU/publishing/168122591789732.png) no-repeat center/contain;}
.wrap.sub .hd_util .util_menu .util_cart {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/NEUTINAMU/publishing/16812260659211.png) no-repeat center/contain;}
.wrap.sub .hd_util .util_menu .search_con input[type="text"] {border-color: #333;}
.wrap.sub .hd_util .util_menu .search_con input[type="button"] {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/NEUTINAMU/publishing/168122594534834.png) no-repeat center/contain;}
.wrap.sub .hd_main .depth2 {border-bottom: 1px solid #eee;}

/* -------- 푸터 -------- */
footer {background-color: #555; padding: 60px 0;}
footer > ul {display: flex; align-items: stretch;}
footer > ul > li:first-child {margin-right: 80px; border-right: 1px solid #888;}
.ft_left {display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; width: calc(100% - 200px); height: 100%;}
.ft_left .ft_menu {display: flex; align-items: center; gap: 30px; flex-wrap: wrap;}
.ft_left .ft_menu span {color: #fff; cursor: pointer;}
.ft_left .ft_info {margin-top: -100px;}
.ft_left .ft_info ul {display: flex; flex-wrap: wrap; gap: 20px; align-items: center; row-gap: 0;}
.ft_left .ft_info li {font-size: 14px; color: #aaa; position: relative;}
.ft_left .ft_info li::after {content: ""; display: block; width: 1px; height: 10px; background-color: #999; top: 50%; right: -10px; transform: translateY(-50%); position: absolute;}
.ft_left .ft_info li:nth-of-type(6)::after, .ft_left .ft_info li:last-child::after {display: none;}
footer .ft_copy {font-size: 12px; color: #aaa;}

.ft_right {display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; width: 200px;}
.ft_right .ft_cs {display: flex; flex-direction: column; align-items: flex-start; padding-bottom: 40px;}
.ft_right .ft_cs .cs_tit .sub {font-size: 16px; color: #aaa; display: flex; flex-direction: column; align-items: flex-start; gap: 30px;}
.ft_right .ft_cs .cs_tit .main {font-size: 30px; font-weight: 800; color: #fff;}
.ft_right .ft_cs .cs_time dl {display: flex; align-items: center; font-size: 14px;}
.ft_right .ft_cs .cs_time dt {width: 80px; color: #aaa;}
.ft_right .ft_cs .cs_time dd {width: calc(100% - 80px); font-weight: 800; color: #aaa;}
.ft_right .ft_cs .cs_time p {color: #aaa; font-size: 14px; padding-top: 10px;}

.ft_right .ft_sitemap {width: 200px; position: relative; cursor: pointer;}
.ft_right .site_map {width: 100%; border-radius: 5px; border: 1px solid #ccc; display: flex; align-items: center; justify-content: space-between; padding: 4px 12px;}
.ft_right .site_map span {color: #ccc; font-size: 14px;}
.ft_right .site_map .arrow {display: block; width: 15px; height: 15px; background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/NEUTINAMU/publishing/168108163764895.png) no-repeat center/contain; transition: all .2s;}
.ft_right .ft_sitemap.on .site_map .arrow {transform: rotate(180deg);}
.ft_right .site_list {position: absolute; bottom: calc(100% + 4px); width: 100%; border-radius: 5px; overflow: hidden; display: none;}
.ft_right .site_list ul {display: flex; flex-direction: column; width: 100%; background-color: #fff; padding: 4px 0;}
.ft_right .site_list ul li {padding: 8px 14px; font-size: 14px; border-bottom: 1px solid #ccc; color: #666;}
.ft_right .site_list ul li:hover a {color: #333; font-weight: 700;}
.ft_right .site_list ul li:last-child {border-bottom: none;}
.ft_right .ft_sitemap.on .site_list {display: block;}
footer .ft_copy.mo {display: none;}



/* -------- 사이드바 -------- */
.side_bar {position: fixed; bottom: 5%; right: 1%; z-index: 50;}
.side_bar ul {display: flex; flex-direction: column; gap: 15px;}
.side_bar div[class*="side_"] {width: 65px; height: 65px; display: flex; align-items: center; justify-content: center; box-shadow: 2px 2px 6px rgba(0, 0, 0, .15); cursor: pointer; transition: all .1s;}
.side_bar .icon {width: 30px; height: 30px;}
.side_bar .side_view .icon {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/NEUTINAMU/publishing/168108227039513.png) no-repeat center/contain;}
.side_bar .side_view {background-color: #978677;}
.side_bar .side_kakao .icon {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/NEUTINAMU/publishing/168124183973403.png) no-repeat center/contain;}
.side_bar .side_kakao {background-color: #FAE300;}
.side_bar .side_plus .icon {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/NEUTINAMU/publishing/168124166792248.png) no-repeat center/contain; transition: all .1s;}
.side_bar .side_plus {background-color: #fff;}
.side_bar .side_top .icon {background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/NEUTINAMU/publishing/168124173873809.png) no-repeat center/contain;}
.side_bar .side_top {background-color: #423427;}

/* .side_bar .side_plus.on .icon {transform: rotate(180deg);} */

.side_bar .count {position: absolute; top: 2%; right: 10%; background-color: #C9535A; padding: 12px; color: #fff; border-radius: 50%;}
.side_bar .count span {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: #fff; font-weight: 800; font-size: 12px;}



/* -------- 최근본상품 -------- */
.view_wrap {position: fixed; width: 100vw; height: 100vh; top: 0; left: 0; background: rgba(0, 0, 0, .2); z-index: 450; display: none;}
.view_wrap.on {display: block;}
.view_wrap .view_box {position: absolute; top: 0; right: -100%; width: 30vw; height: 100vh; background-color: #fff; padding: 60px 40px;}
.view_wrap.on .view_box {right: 0;}
.view_box .view_title {display: flex; align-items: flex-end; justify-content: space-between; padding-bottom: 20px; border-bottom: 1px solid #ccc;}
.view_box .view_title span {font-size: 20px; font-weight: 800; display: flex; align-items: flex-end; gap: 10px; width: 100%; flex-wrap: wrap; row-gap: 6px;}
.view_box .view_title span em {font-weight: 700; font-size: 16px;}
.view_box .view_title .close {display: block; width: 25px; height: 25px; background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/NEUTINAMU/publishing/168168314821887.png) no-repeat center/contain; cursor: pointer;}


.view_box .view_list {display: flex; flex-direction: column; gap: 25px; margin: 20px 0; overflow-y: auto; height: calc(100% - 100px);}
.view_box .view_list::-webkit-scrollbar {width: 6px;}
.view_box .view_list::-webkit-scrollbar-track {background-color: #f9f9f9;}
.view_box .view_list::-webkit-scrollbar-thumb {height: 20%; border-radius: 10px; background-color: #e3dfdb;}
.view_box .prd_con {display: flex; align-items: stretch; gap: 15px;}
.view_box .prd_con .prd_thumb {width: 40%;}
.view_box .prd_info {padding-top: 0; justify-content: space-between; width: 60%;}
.view_box .prd_info dl {padding: 0 0 10px;}
.view_box .prd_info .prd_name {font-size: 20px; word-break: keep-all; line-height: 1.4;}
.view_box .prd_info .prd_price {font-size: 20px;}
.view_box .prd_info .prd_sale {font-size: 18px;}
.view_box .prd_info .prd_tag span {font-size: 12px;}

.view_box .view_bottom {position: absolute; bottom: 0; left: 0; padding: 20px 0; margin: 0 40px; border-top: 1px solid #ccc; width: calc(100% - 80px);}
.view_box .view_bottom button {font-size: 16px; color: #666; padding: 0;}




/* -------- 모바일버거메뉴 -------- */
.burger_menu {width: 100%; height: 100vh; position: fixed; top: 0; z-index: 500; background-color: #fff; right: -100%; transition: all .2s;}
.burger_menu.on {right: 0;}
.burger_menu .wrap_burger {display: flex; flex-direction: column; height: 100%; overflow-y: auto;}
.burger_menu .burger_top {display: flex; align-items: center; justify-content: space-between; padding: 20px 1.2rem;}
.burger_menu .burger_top .logo {width: 120px;}
.burger_menu .burger_top .close {display: block; width: 26px; height: 26px; background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/NEUTINAMU/publishing/168349369134306.png) no-repeat center/contain;}

.burger_info {padding: 0 1.2rem; margin-bottom: 20px;}
.burger_info > div {display: flex; flex-direction: column; align-items: flex-start;}
.burger_info .info_box.default span {font-size: 22px; font-weight: 600;}
.burger_info .info_box.default .burger_util {display: flex; align-items: center; gap: 10px; padding-top: 10px;}
.burger_info .info_box.default .burger_util a {padding: 4px 15px 3px; border-radius: 50px; font-size: 14px; color: #6e655b; border: 1px solid #6e655b; font-weight: 600;}
.burger_info .info_box .burger_my {display: flex; align-items: center; width: 100%; justify-content: space-between; margin: 15px auto 10px;}
.burger_info .info_box .burger_my span {font-size: 24px; font-weight: 600;}
.burger_info .info_box .burger_my button {font-size: 14px; padding: 4px 10px 3px; border: 1px solid #726C67; color: #726C67;}
.burger_info .burger_order {display: flex; background-color: #fcfaf8; width: 100%; padding: 10px 0;}
.burger_info .burger_order dl {width: 33.3333%; display: flex; flex-direction: column; align-items: center; justify-content: space-between;}
.burger_info .burger_order dt {font-size: 20px; color: #725a45; font-weight: 600;}
.burger_info .burger_order dt .icon {width: 22px; height: 22px; display: block; background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/NEUTINAMU/publishing/168400405630823.png) no-repeat center/contain; margin-top: 4px;}
.burger_info .burger_order dd {font-size: 14px; color: #725a45; font-weight: 500;}

.burger_list {display: flex; border-top: 1px solid #eee; height: 100vh;}
.burger_list .burger_depth1 {width: 150px; display: flex; flex-direction: column; background-color: #d7cfc8; overflow-y: auto;}
.burger_list .burger_depth1 a {font-size: 15px; padding: 10px 1.2rem; color: #483b30;}
.burger_list .burger_depth1 a.on {background-color: #fff; font-weight: 600;}

.burger_list .burger_depth2 {width: calc(100% - 150px); overflow-y: auto;}
.burger_list .burger_depth2 ul {display: flex; flex-direction: column;}
.burger_list .burger_depth2 ul li {width: 100%; padding: 10px 12px; border-bottom: 1px solid #eee;}
.burger_list .burger_depth2 ul li:last-child {border-bottom: none;}
.burger_list .burger_depth2 a {font-size: 15px; width: 100%; display: block; font-weight: 500;}


.burger_menu .mo_sidemenu {display: flex; align-items: center; padding: 14px 4px; background-color: #eee; justify-content: space-between;}
.burger_menu .mo_sidemenu span {display: inline-block; width: 33.3333%; text-align: center; font-size: 14px; position: relative; padding: 0 8px; word-break: keep-all; line-height: 1.2;}
.burger_menu .mo_sidemenu span::after {content: ""; display: block; width: 1px; height: 12px; background-color: #aaa; position: absolute; top: 50%; right: 0; transform: translateY(-50%);}
.burger_menu .mo_sidemenu span:last-child::after {display: none;}

.burger_menu .logout {width: 100%; text-align: center; background-color: #666; padding: 12px;}
.burger_menu .logout span {font-size: 14px; color: #eee;}



/* -------- 1600px -------- */
@media screen and (max-width: 1650px) {
    .header_wrap {padding: 12px 42px;}
    header.on .header_wrap {padding: 60px 42px 12px;}
    header.on .hd_util {right: 30px;}
    .hd_main .hd_side .side_box {font-size: 14px;}
    .hd_main nav ul {gap: 25px;}

    .wrap.sub .header_wrap, header.on .wrap.sub .header_wrap {padding: 60px 42px 16px;}
    .wrap.sub .hd_util {right: 42px;}
}


/* -------- 1440px -------- */ 
@media screen and (max-width: 1440px) {
    .header_wrap {padding: 12px 26px; width: calc(100% - 32px);}
    .hd_main nav ul {font-size: 16px;}
    .hd_main .depth2 {width: calc(100% - 32px);}
    .hd_main h1 {max-width: 120px;}
    header.on .header_wrap {padding: 60px 26px 12px;}
    .hd_util .util_menu {gap: 15px;}
    .hd_main .hd_side span {padding: 0 5px;}

    .wrap.sub .header_wrap, header.on .wrap.sub .header_wrap {padding: 60px 26px 16px;}
    .wrap.sub .hd_util {right: 26px;}

    .view_wrap .view_box {width: 50vw;}


    footer > ul > li:first-child {margin-right: 50px;}
    .ft_left {width: calc(100% - 30px);}
    .ft_left .ft_info {margin-top: -80px;}
    .ft_left .ft_info li:nth-of-type(6)::after {display: block;}
}



/* -------- 1280px -------- */ 
@media screen and (max-width: 1280px) {
    .hd_main .hd_side .side_box {display: none;}
    .hd_main .hd_side .burger_open {display: block;}


    footer > ul > li:first-child {margin-right: 40px;}
}



/* -------- 1080px -------- */ 
@media screen and (max-width: 1080px) {
    header nav {display: none;}
    .header_wrap {margin: 0; width: 100%; padding: 20px;}
    header.on .header_wrap, .wrap.sub .header_wrap {padding: 20px;}

    .hd_util {display: none;}
    .hd_util.mo {display: block;}
    .wrap.sub .hd_util {right: initial; top: initial;}

    .side_bar {bottom: 75px; right: 2%;}
    .side_bar div[class*="side_"] {width: 55px; height: 55px;}
    .side_bar ul {gap: 10px;}

    .view_wrap .view_box {width: 90vw; padding: 40px 30px;}
    .view_box .view_title span {font-size: 18px;}
    .view_box .view_title .close {width: 20px; height: 20px;}
    .view_box .view_title {padding-bottom: 15px;}
    .view_box .view_list {margin: 15px 0;}
    .view_box .view_bottom {padding: 15px 0; margin: 0 20px; width: calc(100% - 40px);}
    .view_box .prd_info .prd_name {font-size: 18px;}
    .view_box .prd_info .prd_price {font-size: 18px;}
    .view_box .prd_con .prd_thumb {width: 25%; min-width: 80px;}
    .view_box .prd_info {width: 70%; max-width: calc(100% - 80px);}


    footer {padding: 40px 0 100px;}
    footer .ft_copy {display: none;}
    .ft_left {width: 100%;}
    .ft_left .ft_menu span {font-size: 14px;}
    .ft_left .ft_menu span.admin {display: none;}
    footer > ul {flex-direction: column;}
    .ft_left .ft_info {margin-top: 0;}
    footer > ul > li:first-child {margin-right: 0; border-right: none; width: 100%;}
    .ft_left .ft_menu {padding-bottom: 20px;}
    .ft_right {width: 100%; flex-direction: row; align-items: stretch; padding-top: 30px;}
    .ft_right .ft_cs {padding-bottom: 0; flex-direction: row; gap: 20px;}
    /* .ft_right .cs_tit {display: flex; gap: 20px;} */
    .ft_right .ft_cs .cs_tit .main {margin-top: -6px;}
    footer .ft_copy.mo {display: block;}
    .ft_right .ft_sitemap {width: max-content; display: flex; flex-direction: column; justify-content: space-between;}

}



/* -------- 850px -------- */ 
@media screen and (max-width: 850px) {
    .side_bar div[class*="side_"] {width: 40px; height: 40px;}
    .side_bar .icon {width: 22px; height: 22px;}
    .side_bar .count {padding: 9px;}

    .burger_list .burger_depth1 {width: 140px;}
    .burger_list .burger_depth2 {width: calc(100% - 140px);}


    .ft_right {flex-direction: column; gap: 30px;}
    .ft_right .ft_sitemap {gap: 20px;}
    .ft_left .ft_menu {gap: 15px; row-gap: 2px;}
    .ft_right .ft_cs {flex-direction: column; gap: 0;}
    .ft_right .ft_cs .cs_time p {padding-top: 4px;}
    .ft_left .ft_info ul {flex-direction: column; align-items: flex-start;}
    .ft_left .ft_info li::after, .ft_left .ft_info li:nth-of-type(6)::after {display: none;}
    

    .view_wrap .view_box {width: 100%;}
    .view_box .view_title {align-items: flex-start;}
    .view_box .view_title span {font-size: 16px; gap: 6px; row-gap: 0;}
    .view_box .view_title span em {font-size: 14px;}
    .view_box .view_bottom button {font-size: 15px;}
    .view_box .view_bottom {padding-bottom: 30px;}

    .view_box .prd_info .prd_name {font-size: 16px;}
    .view_box .prd_info .prd_price {font-size: 16px;}
    .view_box .prd_info .prd_tag span {font-size: 11px;}
    .view_box .prd_info dl {padding-bottom: 4px;}
    .view_box .prd_con {align-items: flex-start;}
}