@charset "UTF-8";
/* CSS Document */

/* content width 설정 */
.inner { width:1300px; margin:0 auto; box-sizing:border-box;transition:all 0.3s; }
.content { padding:0 0 5em; }
h3 { font-weight:500; }

/*title*/
.header { width:100%; background:#fff; /* backdrop-filter:blur(5px); -webkit-backdrop-filter:blur(5px); */ transition:all 0.3s; padding:20px 0; position:sticky; top:0; left:0; z-index:99; }
.header .header_top { position:relative; display:flex; justify-content:space-between; align-items:center; }
.header h1 a { width:180px; height:50px; display:inline-block; background:url(/images/user/logo.svg) 50% 50% no-repeat; background-size:contain; transition:all 0.3s;}

.header.active { padding:15px 0; border-bottom:1px solid #e9e9e9; background:rgba(255,255,255,0.9); backdrop-filter:blur(5px); -webkit-backdrop-filter:blur(5px); }
.header.active h1 a { width:160px; height:45px; }
.header.active .gnb_wrap > ul { margin-top:0; }
.header.active .gnb_wrap { display:flex; flex-direction:row; }
.header.active .menu_top { margin-right:10px; }
.header.active .search_inp .inputText { font-size:13px; width:calc(100% - 45px); height:45px; }
.header.active .search_inp .btn_search { width:45px; height:45px; }
.header.active .search_inp { background:#f4f4f4; border:1px solid #e3e3e3; }

.search_inp { width:500px; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); display:flex; align-items:center; background:#fff; border:2px solid #333; border-radius:50px; transition:border 0.2s, box-shadow 0.2s, background 0.2s; }
.search_inp:hover { border-color:#000; box-shadow: rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.15) 0px 25px 50px -10px, rgba(0, 0, 0, 0.2) 0px 15px 30px -15px; }
.search_inp .inputText { width:calc(100% - 50px); height:50px; border:none; background:none; padding-left:20px; font-size:1.1em; }
.search_inp .inputText:hover { box-shadow:none; }
.search_inp .btn_search { width:50px; height:50px; line-height:50px; border:none; background:none; font-size:1.3em; color:#666; }
.search_inp .btn_search:hover { color:#000; }

.gnb_wrap { transition:all 0.3s; }
.gnb_wrap > ul { display:flex; justify-content:flex-end; align-items:center; transition:all 0.3s; }

.menu_top {  }
.menu_top li a { font-size:11px; color:#999; transition:all 0.2s; }
.menu_top li a:hover { color:#000; }
.menu_top li p { font-size:11px; color:#000; font-weight:600; }
.menu_top li { display:flex; align-items:center;}
.menu_top li::before { width:1px; height:12px; background:; content:''; display:inline-block; margin:0 10px;}
.menu_top li:first-child::before { display:none; }

.gnb { gap:10px; margin-top:10px; }
.gnb li { position:relative; }
.gnb li a { font-size:1.2em; color:#000; position:relative; font-weight:500; width:40px; height:40px; line-height:40px; text-align:center; border-radius:50px; display:inline-block; transition:all 0.2s; }
.gnb li a:hover { background:#f4f4f4; color:#000; }
.gnb li a:hover .tooltip { opacity:1; transform:translate(-50%,0); }

.tooltip { background:#fff; color:#000; padding:8px 10px; line-height:1em; font-size:11px; font-weight:400; border-radius:10px; position:absolute; z-index:1; white-space:nowrap; transition:all 0.2s; opacity:0; pointer-events:none; bottom:-35px; left:50%; transform:translate(-50%,10px); border:1px solid #999999; }
.tooltip::after { width:11px; height:10px; background:url(/images/user/tooltip.svg) 50% 50% no-repeat; content:''; display:block; position:absolute; top:-9px; left:50%; transform: rotate(180deg) translateX(50%); }

.top_category { position:absolute; background:#fff; padding:5px; border-radius:10px; border:1px solid #ccc; right:50%; transform:translateX(50%); z-index:9; display:none; }
.top_category::after { width:11px; height:10px; background:url(/images/user/tooltip.svg) 50% 50% no-repeat; content:''; display:block; position:absolute; top:-9px; left:50%; transform: rotate(180deg) translateX(50%); }
.top_category li a { width:100%; height:auto; line-height:1em; padding:10px; font-size:12px; font-weight:400; color:#000; text-align:left; position:relative; border-radius:5px; white-space:nowrap; }
.gnb li.active .top_category { display:block; }
.gnb li.active a:hover .tooltip { opacity:0; }

.header.main_header { height:190px; background:#000; border-bottom:1px solid #e9e9e9; }
.header.main_header h1 a { background-image:url(/images/user/logo_white.svg); }
.header.main_header .menu_top li a { color:#ccc; }
.header.main_header .menu_top li a:hover, .header.main_header .gnb li a, .header.main_header .menu_top li p { color:#fff; }
.header.main_header .gnb li a:hover { color:#000; }
.header.main_header .top_category li a { color:#000; }
.header.main_header .search_inp { border:1px solid #ccc; }
.header.main_header .search_inp .inputText { color:#fff; }
.header.main_header .search_inp .btn_search { color:#fff; }
.header.main_header .search_inp:hover { border:1px solid #fff; background:#fff; }
.header.main_header .search_inp:hover .inputText, .header.main_header .search_inp:hover .btn_search { color:#000; }

/**************************************************************  footer  **************************************************************/

.footer { text-align:left; padding:5em 0; box-sizing:border-box; color:#000; position:relative; background:#fff; border-top:1px solid #f4f4f4; font-size:13px; }
.footer .inner {  }
.footer h2 { font-size:1.1em; }
.footer h2 img { height:40px; }
.footer ul { display:flex; gap:35px; padding-bottom:15px; margin:25px 0 20px; border-bottom:1px solid #e3e3e3; }
.footer ul li { display:flex; align-items:center;}
.footer ul li a { color:#aaa; display:inline-block; font-weight:400; line-height:1em; position:relative; overflow:hidden; padding:1px 0 2px; transition:all 0.2s; }
.footer ul li a:hover { color:#000; }
.footer .info_detail { color:#aaa; font-size:12px; line-height:2em; }
.footer .info_detail span { margin-right:15px; }
.footer .contact { display:flex; gap:5px; margin-top:10px; }
.footer .contact dl { display:flex; margin-bottom:10px; }
.footer .contact dl dd { display:flex; align-items:center; letter-spacing:1px; }
.footer .contact dl dd::after { width:1px; height:12px; background:#ccc; content:''; display:inline-block; margin:0 10px;}
.footer .contact dl dd:last-child::after { display:none; }
.footer .ltreset { color:#777; }
.footer .contact .text { display:flex; }
.footer .contact strong { font-size:1em; line-height:1.8em; font-weight:400; letter-spacing:0.2px; }

.mypage_body .footer { background:#fff; }

.skip_top { width:50px; height:50px; border-radius:100px; border:1px solid #ededed; box-shadow:rgb(255 255 255 / 10%) 0px 1px 1px 0px inset, rgb(50 50 93 / 25%) 0px 10px 20px -5px, rgb(0 0 0 / 30%) 0px 10px 20px -10px; opacity:0; position:fixed; bottom:30px; right:30px; overflow:hidden; z-index:1; transform: translateY(20px); transition:all 0.3s; }
.skip_top::before, .skip_top::after { content:''; width:14px; height:15px; background:url(/images/user/skip_top_bk.svg) 50% 50% no-repeat; background-size:contain;position:absolute; display:inline-block; left:50%; transform: translate(-50%, -50%); pointer-events: none; }
.skip_top::before { top:50%; }
.skip_top::after { top:150%; }
.skip_top:hover { box-shadow:rgb(255 255 255 / 10%) 0px 1px 1px 0px inset, rgb(50 50 93 / 40%) 0px 10px 20px -5px, rgb(0 0 0 / 50%) 0px 10px 20px -10px; border-color:#333; }
.skip_top:hover::before { top:-150%;transition:all 0.5s; }
.skip_top:hover::after { top:50%;transition:all 0.5s; }
.skip_top.active { position:fixed; transform: translateY(0%); opacity:1; }


/**************************************************************  login  **************************************************************/

/*login*/
.login_wrap { width:100%; height:100%; display:flex; justify-content:center; padding-top:5em; /*align-items:center;*/ }
.login { width:400px; text-align:center; }
.login h1 { animation:login 0.7s both; font-size:2.5em; font-weight:900; }
.login h1 img { width:180px; }

.login_box { margin:50px 0 0; /*padding:3em; background:rgba(255,255,255,0.5); border-radius:30px; box-shadow: rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px; */animation:login 0.7s both; animation-delay:0.2s; transition:all 0.2s; display:flex; flex-direction:column; gap:25px; }
.login_box:hover { border-color:#ccc; }
.login_form { width:100%; text-align:left; }
.login_form .checkbox label { color:#000; }
.login_input { width:100%; display:flex; align-items:center; justify-content:space-between; background:#f1f1f1; height:55px; border-radius:10px; }
.login_input span { width:55px; text-align:center; color:#333; opacity:0.5; transition:all 0.2s; }
.login_input:hover span { opacity:1; }
.login_form .inputText { border:none; background:none; outline:none; height:100%; border-radius:0 10px 10px 0; width:calc(100% - 55px); font-weight:400;}
.login_form .inputText:hover { box-shadow:none; }
.login_form .checkbox label { font-size:13px; }

.form_id label, .form_pw label { font-size:14px; margin-bottom:15px; line-height:1em; display:block; }
.form_id span { font-size:15px; }
.form_pw span { font-size:20px; }

.login_option { display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; }

.login_input:hover label {  }
.loginBtn { background:var(--mainblue); width:100%; border-radius:10px; height:55px; border:none; color:#fff; font-weight:600; font-size:1.2em; transition:all 0.2s; }
.loginBtn:hover { background:var(--mainbluedeep); }

@keyframes login {
	0% { transform:translateY(30px); opacity:0; }
	100% {transform:translateY(0); opacity:1; }
	}

/*회원가입*/
.join_wrap { width:700px; margin:0 auto;  }
.join_wrap .board_contr_wrap { border-bottom:2px solid #000; padding:0px 0 20px; }
.join_wrap .board_contr_wrap .must_text { margin-top:0; }
.join_box { display:flex; flex-wrap:nowrap; border-bottom:1px solid #ededed; padding:30px 0; }
.join_box h3 { width:180px; }
.join_box .table_write { width:calc(100% - 180px); border-top:none; }
.join_box .table_write th { padding-top:0; }
.join_box .table_write td { border-bottom:none; padding:5px 0 30px; }
.join_box .table_write tr:last-child td { padding-bottom:0; }
.join_box .table_write label { font-size:14px; margin-bottom:8px; line-height:1em; display:inline-block; font-weight:500; }
.join_box .table_write .inputText, .join_box .table_write .selectText { background-color:#f5f5f5; border:1px solid #f0f0f0; border-radius:7px;}
.join_box .table_write .inputText:hover, .join_box .table_write .selectText:hover { border:1px solid #666; }
.join_box .table_write .file_list.img_type { margin-top:10px; }

.agree_wrap { padding:40px 0; display:flex; align-items:center; justify-content:center; }
.agree_wrap input[type='checkbox']::before { color:#ccc;}
.agree_wrap input[type='checkbox']:checked::before { color:var(--mainblue);}
.join_btn_box { display:flex; align-items:center; justify-content:center; gap:5px; }
.join_btn_box button { width:200px; }


/**************************************************************  sub title  **************************************************************/

.sub_title { padding:13px 0 45px; }
.sub_title h2 { font-size:2.5em; font-weight:800; margin-top:20px; display:flex; align-items:center; justify-content:center; line-height:55px; }
.sub_title .title { position:relative; }
.sub_title .title a { position:absolute; background:#fff; top:50%; transition:all 0.3s; border:1px solid #ddd; transform:translateY(-50%); left:0; display:inline-flex; align-items:center; gap:6px; font-weight:600; line-height:1em; font-size:15px; letter-spacing:0; padding:10px 13px; border-radius:50px; }
.sub_title .title a::before { font-size:13px; transition:all 0s; }
.sub_title .title a:hover { background:#eee; border:1px solid #eee; }
.sub_title .company_logo { width:55px; height:55px; border-radius:20px; border:1px solid #ededed; margin-right:20px; display:inline-flex; align-items:center; justify-content:center; box-shadow:none; }
.sub_title .company_logo img { width:80%; }

.breadcrumb ul { display:flex; font-size:12px; }
.breadcrumb li a { color:#666; }
.breadcrumb li::after { margin:0 10px; content:''; display:inline-block; width:10px; height:10px; background:url(/images/user/arrow_right.svg) 50% 50% no-repeat; background-size:contain;}
.breadcrumb li:last-child::after { display:none; }
.breadcrumb .next { margin:0 6px; font-size:10px; color:#ccc; }

/**************************************************************************************************************************************/
/****************************************************  content  ***********************************************************************/


.contnet { padding:100px 0; }


/*에러페이지*/
.error { width:100%; height:100vh; display:flex; justify-content:center; align-items:center;}
.error_box { display:flex; align-items:center; flex-direction:column; text-align:center; }
.error_box img { width:20%; }
.error_box .title { width:100%; font-weight:900; padding-top:2em;  }
.error_box .title strong { font-size:5em; line-height:1em; font-weight:900; }
.error_box .title p { font-size:1.5em; margin:20px 0; font-weight:600; letter-spacing:-1px; }
.error_box .text { width:100%; margin-top:20px; }
.error_box .text button { padding:10px 30px; font-weight:600; font-size:1em; border-radius:50px; border:2px solid #000;  transition:all 0.3s; margin-top:30px; font-family:'S-CoreDream', sans-serif; }
.error_box .text button:hover { background:var(--red); border-color:var(--red); color:#fff; }
.error_box .text button span { font-size:0.8em; margin-right:10px; }
.error_box .title strong.small { font-size:3.5em; line-height:1em; }


 @keyframes smileqna {
	0% { transform:scale(1); }
	50% { transform:scale(1.1); }
 100% { transform:scale(1); }
	}

 @keyframes fadeDown {
	0% { transform:translateY(-10%); opacity:0; }
 100% { transform:translateY(0); opacity:1; }
	}

 @keyframes fadeUp {
	0% { transform:translateY(10%); opacity:0; }
 100% { transform:translateY(0); opacity:1; }
	}



/**************************************************************************************************************************************/
/****************************************************  메인  ***********************************************************************/

.main_container { padding:0 0 5em; transition:all 0.3s; }
.main_container.active { background:#f6f7f8; }
/* .main_container .category {  padding:2em 0; margin-top:-100px; }
.main_container .category ul { display:flex; justify-content: center; gap:50px; background:#fff; box-shadow:0 -12px 15px 0 rgba(0,0,0,0.1); padding:40px 0 10px; border-radius:30px 30px 0 0;} */
.main_container .category { position:relative; padding-top:3em; }
.main_container .category h2 { position:absolute; bottom:25px; left:30px; opacity:0.1; font-size:2em; font-style:italic; text-transform:capitalize; display:none; }
.main_container .category ul { display:flex; justify-content:center; gap:50px; }
.main_container .category ul li a { display:flex; align-items:center; flex-direction:column; font-size:0.9em; font-weight:600; }
.main_container .category .category_item { transition:all 0.2s; width:80px; height:80px; border-radius:25px; border:1px solid #ededed; background:#f4f4f4; display:flex; align-items:center; justify-content:center; margin-bottom:10px; }
.main_container .category .category_item img { transition:all 0.2s; transform:scale(0.3); filter: drop-shadow(3px 3px 7px rgba(0,0,0,0.3)); }
.main_container .category ul li:hover .category_item img { transform:scale(0.45); }
.main_container .category ul li:hover .category_item { transform:rotateY(180deg); }
.main_container .tab_wrap { padding-top:0; position:relative; }
.main_container .tab_wrap .tab_container { position:relative; z-index:1; }
.main_container .category ul li.active .category_item { border:1px solid #333; background:#fff; box-shadow:rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.1) 0px 25px 50px -10px, rgba(0, 0, 0, 0.27) 0px 10px 20px -10px; }
.main_container.active .category .category_item { background:#fff; border:1px solid #ededed; }
.main_container.active .category ul li.active .category_item { border:2px solid #333; }
.main_container .category ul li.active:hover .category_item,
.main_container.active .category ul li.active:hover .category_item { transform:rotateY(0); }

.bg_main { width:100%; position:relative; }
.bg_main .text { width:15%; fill:#fff; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); }
.bg_main .text svg { overflow:visible; }
.bg_main .text .titletext { animation:textshow 2s ease-in-out infinite both; }
.bg_main .text .titletext.text1 { animation-delay:0; }
.bg_main .text .titletext.text2 { animation-delay:.1s; }
.bg_main .text .titletext.text3 { animation-delay:.2s; }
.bg_main .text .titletext.text4 { animation-delay:.3s; }
.bg_main .text .titletext.text5 { animation-delay:.4s; }
.bg_main .text .titletext.text6 { animation-delay:.5s; }
.bg_main .text .titletext.text7 { animation-delay:.6s; }
.bg_main .text .titletext.text8 { animation-delay:.7s; }
.bg_main img { width:100%; height:100%; object-fit:cover; }

.bg_main .swiper-slide { border-radius:20px; overflow:hidden; width:1300px; padding-bottom:22.4%; opacity:0.7; transition:all 0.5s; }
.bg_main .swiper-slide img { display:none;; }
.bg_main .swiper-slide-active { opacity:1; }
.bg_main .swiper-pagination { margin-top:20px; position:static; text-align:center; width:auto;  }
.bg_main .swiper-pagination .swiper-pagination-current { font-weight:400; font-size:1.1em; margin-right:5px; }
.bg_main .swiper-button-prev, .bg_main .swiper-button-next { width:40px; height:40px; border-radius:40px; background:#fff; box-shadow:2px 2px 10px 0 rgba(0,0,0,0.3); }
.bg_main .swiper-button-prev:after, .bg_main .swiper-button-next:after { color:#000; font-size:15px; }

 @keyframes textshow {
	0% { transform:translateY(0%); }
	20% { transform:translateY(-10%); }
	50% { transform:translateY(0); }

	}

.item_list_view .item_list_header { margin:5em 0 2em; display:block; text-align:center; position:relative; }
.item_list_view .item_list_header h3 { font-size:2.4em; font-weight:700; display:inline-flex; align-items:center; background:#fff; padding:0 20px; position:relative; z-index:1; }
.item_list_view .item_list_header::before { content:''; width:100%; height:1px; background:#ccc; display:block; position:absolute; top:11px; left:0; z-index:0; }
.item_list_view .item_list_header .view_option { margin-top:2em; align-items:center; justify-content:flex-end; display:flex; gap:5px; }
.item_list_view .item_list_header .view_option a { border:1px solid #fff; padding:10px 20px; font-weight:600; display:inline-block; border-radius:50px; transition:all 0.3s; }
.item_list_view .item_list_header .view_option a.active, .item_list_view .item_list_header .view_option a.active:hover { border-color:var(--lb); background:var(--lb); color:var(--blue); }
.item_list_view .item_list_header .view_option a:hover { background:#f4f4f4; border-color:#ededed; }
.item_list_view .item_list_header .view_option a span { margin-right:10px; }

.item_list_view .item_list_wrap { transition:all 0.5s; margin-bottom:5em; }
.item_list_view .item_list_wrap:last-child { margin-bottom:0; }
.item_list_view .item_list_wrap .company_info { position:relative; background:url(/images/user/noimg.png) 50% 50% no-repeat #ddd; overflow:hidden; border-radius:20px; }
.item_list_view .item_list_wrap .title { display:flex; align-items:center; justify-content: center; padding:10px 20px; border-radius:20px 0 0 0; font-weight:800; font-size:1em; position:absolute; bottom:0; right:0; z-index:9; background:#fff; }
.item_list_view .item_list_wrap .title a { display:flex; align-items:center; color:#000; }
.item_list_view .item_list_wrap .title .company_logo { width:40px; height:40px; border-radius:50px; border:1px solid #ededed; background:#fff; margin-right:15px; display:inline-flex; align-items:center; justify-content:center; box-shadow:none; }
.item_list_view .item_list_wrap .title .company_logo img { width:1px; height:1px; }
.item_list_view .item_list_wrap .title strong { font-size:1.2em; display:flex; align-items:center; font-weight:600; }
.item_list_view .item_list_wrap .title span { font-size:13px; margin-left:15px; transition:all 0.3s; }
.item_list_view .item_list_wrap .title a:hover span { transform:translateX(5px); }
.item_list_view .item_list_wrap .company_visual { overflow:hidden; width:100%; height:100%; padding-bottom:30.77%; position:absolute; top:0; left:0; display:block; background-size:cover !important; text-align:center; position:relative; }
/* .item_list_view .item_list_wrap .company_visual::after { content:''; display:block; width:100%; height:100%; position:absolute; top:0; left:0; background:rgba(0,0,0,0.4); } */
.item_list_view .item_list_wrap .item_list_box { padding-top:3em; }

.item_list_more { display:flex; justify-content:center; position:relative; margin-top:3.5em; }
.item_list_more .btn_more { z-index:1; position:relative; }

.main_container.active .item_list_view .item_list_wrap {   }
.main_container.active .item_list_view .item_list_wrap .title {  }

.item_list { display:flex; flex-wrap:wrap; gap:40px; }
.item_list li { width:calc(25% - 30px); }
.item_list li .img_box { margin-bottom:30px; background:url(/images/user/noimg.png) 50% 50% no-repeat #f4f4f4; }
.item_list li .btn_cart { width:40px; height:40px; z-index:9; font-size:15px; border-radius:10px; color:#000; padding:0; position:absolute; bottom:5%; right:5%; border:1px solid #ccc; box-shadow:3px 3px 10px rgba(0,0,0,0.1); transition:0.2s; }
.item_list li .img_box .btn_cart:hover { background-color:var(--main); border-color:var(--maindeep); color:#fff; box-shadow:3px 3px 15px rgba(0,0,0,0.6); }
.item_list li.nothing { width:100%; }

.nothing { padding:3em; /* background:#f4f4f4; */ border-radius:20px; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.nothing img { width:200px; margin-bottom:1em; }

.img_box { width:100%; height:0; padding-bottom:100%; position:relative; overflow:hidden; background:url(/images/user/noimg.png) 50% 50% no-repeat #f4f4f4; background-size:70%; border-radius:10px; transition:all 0.3s; }
.img_box .img { width:100%; height:100%; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%) scale(1); transition:all 0.3s; background-size:cover !important; background-position:50% 50% !important; }
.img_box:hover { box-shadow: rgba(50, 50, 93, 0.25) 0px 30px 60px -12px, rgba(0, 0, 0, 0.3) 0px 18px 36px -18px; }
.img_box:hover .img { transform:translate(-50%,-50%) scale(1.05); }
.company_logo { position:relative; overflow:hidden; background:#fff; background-size:70%; box-shadow:2px 2px 7px 0 rgba(0,0,0,0.2); }
.company_logo .img { width:100%; height:100%; position:absolute; top:50%; left:50%; background-repeat:no-repeat; background-size:contain; background-position:50% 50%; transform:translate(-50%,-50%) scale(1);}
.img_box img, .company_logo img { width:1px; height:1px; opacity:0; pointer-events:none; }
.company_logo_wrap { padding:5px 15px 5px 5px; line-height:1em; border-radius:50px; border:1px solid #ededed; display:flex; align-items:center; gap:10px; background:#fff; }

.main_container .detail { margin:10px 0 17px; }
.item_name { font-weight:500; font-size:16px; line-height:1.5em; cursor: pointer;}
.item_name a { transition:all 0.3s; }
.item_name a:hover { color:var(--blue); }
.item_count { font-weight:400; font-size:13px; }
.item_note { margin:6px 0; font-size:12px;line-height:1.5em; }
.item_expdate { font-weight:400; color:#666; font-size:0.8em; line-height:1em; }
.item_expdate strong { font-weight:500; display:inline-block; margin-right:5px; }
.item_price { font-weight:700; font-size:1.3em; line-height:1em; white-space:nowrap; }
.item_price span { font-weight:400; font-size:12px; margin-left:2px; color:#666; }
.item_stock { font-weight:400; color:#666; font-size:0.8em; line-height:1em; }
.item_stock::before { content:''; display:inline-block; width:1px; height:11px; background:#ccc; margin:0 8px; }
.detail { display:flex; align-items:center; margin:5px 0 17px; flex-wrap:wrap; }
.detail.col { flex-direction:column; align-items:flex-start; }
.detail.col .item_stock { margin:6px 0 0; }
.detail.col .item_stock::before { display:none; }
.item_count { white-space:nowrap; }

#item_view .nothing { padding:6em 0; color:#666; font-size:1em; font-weight:400;}
#item_view .nothing svg { fill:#ccc; width:90px; margin-bottom:1.5em; }

/*지도로보기*/
.map_header { position:absolute; z-index:9; background:none; border:none; padding:0; width:350px; top:0px; left:0px; transition:left 0.3s; }
.map_header.active { padding:15px; border-bottom:none; }
.map_header .inner { width:auto; padding:0; }
.map_header h1 a { position:absolute; left:-9999em; width:1px;height:1px;margin:0;padding:0;background:none;font-size:0;line-height:0;text-indent:-9999em }
.map_header .gnb_wrap { display:none !important; }
.map_header.active .search_inp { width:100%; transform:none; position:static; background:#fff; border-radius:7px; border:1px solid #000; transition:box-shadow 0.2s; }
.map_header .search_inp .inputText { width:calc(100% - 45px); height:45px; font-size:1em; transition:all 0s; }
.map_header .search_inp .btn_search { width:45px; height:45px; color:#333; transition:all 0s; }

.map_container { width:100%; height:100%; position:fixed; top:0; left:0; }
.map_container .category {position:absolute; top:15px; left:365px; border-radius:50px; border:1px solid #000; box-shadow:1px 1px 5px rgba(0, 0, 0, 0.1); overflow:hidden; background:#fff; z-index:2; display:flex; transition:all 0.3s;}
.map_container .category ul { display:flex; padding:5px; gap:5px; }
/* .map_container .category ul::after { content:'···'; width:50px; height:50px; display:inline-block; line-height:50px; text-align:center; } */
.map_container .category li { cursor:pointer; text-align:center; position:relative; border-radius:50px; transition:0.2s;}
.map_container .category li a { display:flex; justify-content:center; align-items:center; padding:10px 15px; color:#000; transition:0.2s;}
.map_container .category li img { height:18px; }
.map_container .category li .category_item { display:flex; align-items:center; }
.map_container .category li span { font-size:13px; font-weight:600; line-height:1em; margin-left:6px; }
.map_container .category li:hover { background:#efefef; }
.map_container .category li a:hover { color:var(--blue); }
.map_container .category li.active { background:var(--blue);}
.map_container .category li.active a, .map_container .category li.active a:hover { color:#fff; }
.map_container .category li:nth-child(n+6) { display:none; }
.map_container .category:hover li { display:block; }
.map_container .category:hover ul::after { display:none; }

.item_header { position:fixed; top:15px; right:15px; z-index:9; }
.item_header .golist { background:#fff; border:1px solid #000; box-shadow:5px 5px 10px 0 rgba(0,0,0,0.1); color:#000; position:relative; display:inline-block; line-height:50px; text-align:center; width:50px; height:50px; border-radius:50px; font-size:20px; transition:all 0.3s; }
.item_header .golist:hover { border:1px solid #000; background:#000; color:#fff; box-shadow:5px 5px 10px 0 rgba(0,0,0,0.3); }
.item_header .golist:hover .tooltip { opacity:1; transform:translate(-50%,0); }
/* .item_header .golist span,
.item_header .golist em { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); transition:all 0.2s; }
.item_header .golist span { transform:translate(-50%,-50%); }
.item_header .golist em { transform:translate(-50%,100%); }
.item_header .golist:hover span { transform:translate(-50%,50px); }
.item_header .golist:hover em { transform:translate(-50%,-50%); } */

.item_map_view { width:100%; height:100%; position:relative; z-index:1; }
.item_map_view .map_list_wrap { position:absolute; top:0; left:0; z-index:9; width:350px; padding-top:80px; height:100%; background:#fff; border-right:1px solid #bfbfbf; box-shadow:4px 5px 10px 0 rgba(0,0,0,0.1); transition:all 0.3s;  }
.item_map_view .map_list_wrap .nothing { color:#666; font-size:14px; font-weight:400;}
.item_map_view .map_list_wrap .nothing svg { fill:#ccc; width:50px; margin-bottom:1em; }
.item_map_view .map_list_wrap .map_list { width:100%; height:100%; overflow-y:auto; position:relative; padding:0 15px 15px; border-top:1px solid #fff; }
.item_map_view .map_list_wrap .map_list.scroll { border-top-color:#e1e1e1; }
.item_map_view .map_list_wrap .map_list .btn_fold { position:absolute; right:1px; }
.item_map_view .map_list_wrap .company_box { background:#fff; border:1px solid #ebebeb; padding:10px; border-radius:20px; margin-bottom:10px; transition:all 0.3s; }
.item_map_view .map_list_wrap .company_box:hover { box-shadow:rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.15) 0px 20px 40px -10px, rgba(0, 0, 0, 0.2) 0px 20px 40px -20px; border:1px solid #333; }
.item_map_view .map_list_wrap .company_box:last-child { margin-bottom:0; }
.item_map_view .map_list_wrap .company_box .company_info a { display:flex; width:100%; padding:15px 15px 13px; background:#f4f4f4; border-radius:10px; }
.item_map_view .map_list_wrap .company_box .company_info .company_logo { width:30px; height:30px; border-radius:10px; margin-right:12px; }
.item_map_view .map_list_wrap .company_box .company_info p { font-size:11px; color:#666; font-weight:400; margin-top:6px; line-height:1.5em; }
.item_map_view .map_list_wrap .company_box .title { line-height:1.5em; width:calc(100% - 42px); }
.item_map_view .map_list_wrap .company_box .title strong { font-size:16px; font-weight:600; display:flex; align-items:center; }
.item_map_view .map_list_wrap .company_box .title strong:hover { color:var(--blue); }
.item_map_view .map_list_wrap .company_box .title strong span { font-size:12px; margin-left:5px; transition:0.2s; }
.item_map_view .map_list_wrap .company_box .title strong:hover span { transform:translateX(5px);}
.item_map_view .map_list_wrap .company_box ul { padding:10px 10px 0px; background:#fff; }
.item_map_view .map_list_wrap .company_box ul li { display:flex; justify-content:space-between; align-items:center; }
.item_map_view .map_list_wrap .company_box .img_box { width:40px; height:40px; border-radius:5px; padding-bottom:0; margin-right:10px; }
.item_map_view .map_list_wrap .company_box .text { width:calc(100% - 55px); border-bottom:1px solid #eee; padding:18px 0; }
.item_map_view .map_list_wrap .company_box .item_name { font-weight:500; font-size:13px; width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.item_map_view .map_list_wrap .company_box .item_expdate { font-size:12px; font-weight:400; margin:8px 0 0; }
.item_map_view .map_list_wrap .company_box ul li:last-child .text { border-bottom:none; }
.item_map_view .map_list_wrap .detail { margin:0; }


.item_map_view .btn_fold { position:absolute; right:-20px; top:50%; transform:translateY(-50%); width:20px; height:50px; border-radius:0 5px 5px 0; background:url(/images/user/arrow_left.svg) 50% 50% no-repeat #fff; background-size:8px 13px; border:1px solid #bfbfbf; border-left:1px solid #fff; }
.item_map_view .btn_fold:hover { background-color:#f4f4f4; }
.map_container.wide .map_list_wrap { left:-350px; box-shadow:none; }
.map_container.wide .btn_fold { background:url(/images/user/arrow_right.svg) 50% 50% no-repeat #fff; background-size:8px 13px; box-shadow:0 5px 5px 0 rgba(0,0,0,0.1); }
.map_container.wide #category, .map_container.wide .category{ left:10px; }
.map_header.wide { left:-350px; }
.item_map_view .map_list_wrap .company_box.active { border-color:#000; }
.item_map_view .map_list_wrap .company_box.active .company_info {  }
.item_map_view .map_list_wrap .company_box.active .company_info a { background:#000; color:#fff; }
.item_map_view .map_list_wrap .company_box.active .company_info .company_logo { border:none; }
.item_map_view .map_list_wrap .company_box.active .title strong { color:#fff; }
.item_map_view .map_list_wrap .company_box.active .company_info p { color:#999; }

/*sample*/
.label.sample { position:absolute !important; top:50%; right:20%; z-index:9;}

/*지도설정*/
#map { width:100%; height:100%; position:relative; background-color:#fff; overflow:hidden; transition:all 0.3s; }
#map .label { margin-top:-60px; background:#fff; font-size:13px; color:#000; font-weight:600; border-radius:30px; border:1px solid #999; line-height:1em; position:relative; transition:all 0.2s; }
#map .label a { border-radius:30px; padding:10px 20px 10px 10px; display:flex; transition:all 0.2s; align-items:center; }
#map .label a p { margin-bottom:4px; font-size:13px; }
#map .label .company_logo { width:30px; height:30px; border-radius:30px; margin-right:10px; box-shadow:3px 3px 5px 0 rgba(0,0,0,0.1); }
#map .label .company_logo .img { background-size:70% !important; }
#map .label .text span { font-size:10px; font-weight:400; }
#map .label:hover { background:var(--blue); border-color:var(--blue); }
#map .label:hover a { color:#fff; }
#map .label.active { background:#000; border-color:#000; }
#map .label.active a { color:#fff; }
#map .label::after { content:''; width:14px; height:14px; display:inline-block; background:url(/images/user/tooltip.svg) 50% 0% no-repeat; position:absolute; bottom:-14px; left:50%; transform:translateX(-50%); transition:all 0.2s; }
#map .label:hover::after { background:url(/images/user/tooltip_blue.svg) 50% 0% no-repeat; }
#map .label.active::after, #map .label.active:hover::after { background:url(/images/user/tooltip_bk.svg) 50% 0% no-repeat; border-color:#000; }
#map .label.active:hover { border-color:#000; }

#category {position:absolute; top:10px; left:360px; border-radius:7px; border:1px solid #ddd; box-shadow:1px 1px 5px rgba(0, 0, 0, 0.1); overflow:hidden; background:#fff; z-index:2; display:flex; transition:all 0.3s;}
#category li { display:flex; flex-direction:column; align-items:center; cursor:pointer; text-align:center; padding:10px 12px; position:relative; }
#category li img { height:24px; }
#category li .category_item { display:flex; align-items:center; }
#category li p { font-size:9px; line-height:1em; margin-top:8px; }
#category li.on {background: #eee;}
#category li:hover {background:#ffe6e6; font-weight:600; }
#category li:hover .tooltip { opacity:1; transform:translate(-50%,0); }

.placeinfo_wrap {position:absolute;bottom:28px;left:-150px;width:300px;}
.placeinfo {position:relative;width:100%;border-radius:6px;border: 1px solid #ccc;border-bottom:2px solid #ddd;padding-bottom: 10px;background: #fff;}
.placeinfo:nth-of-type(n) {border:0; box-shadow:0px 1px 2px #888;}
.placeinfo_wrap .after {content:'';position:relative;margin-left:-12px;left:50%;width:22px;height:12px;background:url('https://t1.daumcdn.net/localimg/localimages/07/mapapidoc/vertex_white.png')}
.placeinfo a, .placeinfo a:hover, .placeinfo a:active{color:#fff;text-decoration: none;}
.placeinfo a, .placeinfo span {display: block;text-overflow: ellipsis;overflow: hidden;white-space: nowrap;}
.placeinfo span {margin:5px 5px 0 5px;cursor: default;font-size:13px;}
.placeinfo .title {font-weight: bold; font-size:14px;border-radius: 6px 6px 0 0;margin: -1px -1px 0 -1px;padding:10px; color: #fff;background: #d95050;background: #d95050 url(https://t1.daumcdn.net/localimg/localimages/07/mapapidoc/arrow_white.png) no-repeat right 14px center;}
.placeinfo .tel {color:#0f7833;}
.placeinfo .jibun {color:#999;font-size:11px;margin-top:0;}

.shop_wrap {  }
.shop_wrap .shop_header { width:100%; position:relative; }
.shop_wrap .shop_header img { width:100%; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); z-index:0; }

.shop_wrap .shop_header .shop_slide_wrap { width:100%; }
.shop_wrap .shop_header .shop_slide_wrap .shop_header_slide { width:100%; height:100%; overflow:hidden; border-radius:20px; background-size:cover; background:url(/images/user/noimg.png) 50% 50% no-repeat #f4f4f4;}
.shop_wrap .shop_header .shop_slide_wrap .shop_header_slide .swiper-slide { width:100%; height:100%; padding-bottom:30.77%; }
.shop_wrap .shop_header .shop_slide_wrap .swiper-wrapper {  }
.shop_wrap .shop_contr { display:flex; align-items:center; justify-content:center; gap:5px; margin-top:20px; }
.shop_wrap .shop_contr .swiper-pagination { position:static; display:flex; align-items:center; gap:10px; }
.shop_wrap .shop_contr .swiper-pagination-bullet { background:#000; }
.shop_wrap .swiper-button-prev, .shop_wrap .swiper-button-next { width:40px; height:40px; position:static; border-radius:5px; margin:0; transform:none; }
.shop_wrap .swiper-button-prev:after, .shop_wrap .swiper-button-next:after { color:#000; font-size:15px; }

.shop_wrap .shop_header .shop_info_wrap { width:100%; display:flex; align-items:center; justify-content:center; transition:all .3s; margin:-10px 0 30px 0; color:#000; z-index:2; }
/* .shop_wrap .shop_header .shop_info_wrap:hover { background:rgba(0,0,0,1); } */
.shop_wrap .shop_header .shop_info { display:flex; flex-wrap:wrap; }
.shop_wrap .shop_header .shop_info_wrap dl { display:flex; align-items:center; flex-wrap:wrap; }
.shop_wrap .shop_header .shop_info_wrap dl dt { margin-right:10px; opacity:0.5; }
.shop_wrap .shop_header .shop_info_wrap dl dd { display:flex; align-items:center; }
.shop_wrap .shop_header .shop_info_wrap dl::after { width:1px; height:13px; content:''; display:inline-block; background:#fff; opacity:0.3; margin:0 15px; }
.shop_wrap .shop_header .shop_info_wrap dl:last-child::after { display:none; }
.shop_wrap .item_list { padding-bottom:2em; }
.shop_wrap .item_name { transition:all 0.3s; }
.shop_wrap .item_name:hover { color:var(--blue); }
.shop_wrap .board_contr_wrap { padding:4em 0 2em; }
.shop_wrap .img_box .img { cursor:pointer; }
.board_contr_wrap { display:flex; justify-content:space-between; align-items:flex-end; padding:30px 0 20px; }
.board_contr_wrap .btn_wrap { display:flex; }
.board_contr_wrap .btn_wrap button { margin-left:2px; }
.board_contr_wrap .btn_wrap button:first-child { margin-left:0; }
.total { font-weight:300; font-size:0.9em; line-height:1em; color:#777; }
.total .count { color:#000; font-weight:500; }

.order_wrap { position:sticky; bottom:0; left:0; width:100%; z-index:9999; box-shadow: 0 0 10px 0 rgba(0,0,0,0.05); }
.order_wrap .inner { position:relative; }
.order_total { padding:1em 0; background:rgba(0,0,0,0.8); backdrop-filter:blur(5px); -webkit-backdrop-filter:blur(5px); color:#fff; }
.order_total .inner { display:flex; justify-content:space-between; align-items:center; }
.order_total .item_price span { color:#ccc; }
.order_total_info { display:flex; align-items:flex-end; }
.order_total_info .item_price { font-size:2em; font-weight:700; margin:0 20px; }
.order_total_info  .item_count { margin-bottom:3px; }
.order_wrap .btn_fold { background:#333; color:#fff; position:absolute; top:-25px; left:50%; transform:translateX(-50%); border:1px solid #333; border-bottom:none; width:60px; height:25px; border-radius:5px 5px 0 0; transition:none; }
.order_wrap.active { border-top:1px solid #e7e7e7; background:rgba(255,255,255,0.8); backdrop-filter:blur(5px); -webkit-backdrop-filter:blur(5px); }
.order_wrap.active .order_total { background:#222; }
.order_wrap.active .btn_fold { background:#fff; color:#000; border:1px solid #e7e7e7; border-top:none; transform:translateX(-50%) rotate(180deg); border-radius:0 0 5px 5px; }
.order_wrap.active .table_order_wrap { display:block; }
.table_order_wrap { padding:30px 0; display:none; overflow-y:auto; max-height:350px;}
.table_order { width:100%; border-top:2px solid #333; color:#000; }
.table_order td { padding:20px 15px; vertical-align:middle; text-align:center; border-bottom:1px solid #ededed; }
.table_order tr:first-child td {  }
.table_order tr:last-child td {  }
.table_order tr td:first-child { padding-left:0; }
.table_order td .inputText { height:32px; text-align:center; padding:0 10px; background:#fff; }
.table_order .img_box { width:50px; height:50px; padding-bottom:0; border-radius:10px; }
.table_order .item_expdate {  font-size:12px; font-weight:400; }
.table_order .detail { margin-bottom:0; }
.table_order .item_info_wrap { display:flex; justify-content:space-between; }
.table_order .item_info_wrap .name_wrap { max-width:calc(100% - 140px); }
.table_order .item_info_wrap .detail { gap:15px; flex-wrap:nowrap; white-space:nowrap; }

.board_order { width:100%; border-top:2px solid #333; color:#000; }
.board_order li { padding:20px 0px; gap:15px; border-bottom:1px solid #ededed; display:flex; align-items:center; justify-content:space-between; }
.board_order .img_box { width:50px; height:50px; padding-bottom:0; border-radius:10px; }
.board_order .ord_item_info { display:flex; align-items:center; gap:20px; }
.board_order .ord_item_text { width:calc(100% - 70px); }
.board_order .ord_item_control { display:flex; align-items:center; gap:10px; }
.board_order .inputText { height:32px; text-align:center; padding:0 10px; background:#fff; }
.board_order .item_expdate {  font-size:12px; font-weight:400; }
.board_order .item_price { margin-right:10px; }
.board_order .detail { margin-bottom:0; }
.board_order li#emptyRow { justify-content:center; }
/*
.shop_wrap .item_list { width:100%; }
.shop_wrap .item_list ul { border-top:2px solid #000; }
.shop_wrap .item_list ul li { border-bottom:1px solid #ededed; transition:all 0.3s; }
.shop_wrap .item_list ul li a { padding:30px 20px; display:flex; align-items:center; justify-content:space-between; transition:all 0.3s;}
.shop_wrap .item_list ul li:hover a { background:#f4f4f4; }
.shop_wrap .item_list ul li.active:hover a { background:#fff; }
.shop_wrap .item_list ul li .img_box { width:100px; height:100px; padding:0; border-radius:15px; }
.shop_wrap .item_list ul li .item_text { display:flex; align-items:center; gap:30px; position:relative; }
.shop_wrap .item_list ul li .btn_plus { border-radius:50px; transition:all 0.3s; }
.shop_wrap .item_list ul li .btn_plus:hover, .shop_wrap .item_list ul li.active .btn_plus{ border-color:#000; box-shadow:3px 3px 10px 0 rgba(0,0,0,0.2); }
.shop_wrap .item_list ul li .text .item_name { font-weight:700; font-size:1.2em; margin-bottom:10px; display:block; }
*/

/*마이페이지*/
.mypage_container { /* background:#f9f9f9;*/ border-top:1px solid #f4f4f4;}
.mypage_container .sub_title { }
.mypage_wrap { display:flex; justify-content:space-between; align-items:flex-start; }
.left_menu { width:250px; padding:3em 2.2em; border-radius:20px;position:sticky; top:105px; border:1px solid #efefef; background:#fff;  box-shadow:5px 5px 10px 0 rgba(0,0,0,0.05); }

.left_menu h2 { font-size:1.8em; margin-bottom:35px;}
.left_menu ul li h3 { font-size:20px; margin-bottom:13px; font-weight:600; }
.left_menu .mypgnb > li::after { content:''; width:100%; height:1px; background:#ededed; display:block; margin:20px 0; }
.left_menu .mypgnb > li:last-child::after { display:none; }
.left_menu ul li a { color:#888; font-size:14px; transition:all 0.3s; font-weight:400; }
.left_menu ul li.active a { color:#000; font-weight:500; position:relative; }
.left_menu ul li.active a::after { content:''; width:100%; height:1px; background:#000; position:absolute; bottom:0; left:50%; transform:translateX(-50%); }
.left_menu ul li a:hover { color:#000; }
.left_menu .btn_mygnb { width:35px; height:35px; display:none; }
.mypage_content { width:calc(100% - 300px); }
.mypage_content .mypage_box { /*padding:0 40px; border-radius:20px; border:1px solid #ecf0f7; background:#fff;*/ margin-bottom:10px; }
.mypage_content .mypage_box:last-child { margin-bottom:0; }
.mypage_content .mypage_box.tight { padding:20px; }
.mypage_content .mypage_box .must_text { margin-top:0; }
.mypage_content h3 { font-size:2em; margin-bottom:1.5em; position:relative; padding-left:18px; font-weight:600; }
.mypage_content h3::before { content:''; width:4px; height:110%; background:#000; position:absolute; top:50%; left:0; transform:translateY(-50%); }
.mypage_content .item_list { padding:40px 0; border-top:2px solid #333; border-bottom:1px solid #ededed; }
.mypage_content .item_list li .img_box { border-radius:10px; }
.mypage_content .item_list li .img_box:hover .btn_wrap { }
.mypage_content .item_list li .img_box .btn_wrap { position:absolute; bottom:0; right:0; width:100%; padding:10px 0; border-radius:5px; display:flex; justify-content:center; align-items:center; gap:5px; background:rgba(0,0,0,0); border:1px solid none; backdrop-filter:blur(5px); -webkit-backdrop-filter:blur(5px); z-index:9; transition:all 0.2s; }
.mypage_content .item_list li .img_box:hover .btn_wrap { box-shadow:3px 3px 10px 0 rgba(0,0,0,0.2); }
.mypage_content .item_list li .img_box .btn_wrap .btn_sq { width:auto; height:30px; padding:0 10px; border:1px solid #ccc; background:#fff; color:#000; }
.mypage_content .item_list li .img_box .btn_wrap .btn_sq i { margin-right:5px; }
.mypage_content .item_list li .img_box .btn_wrap .btn_sq:hover { background:#fff; border-color:none; color:#000; }
.mycont_wrap .table_write { border-top:none; }
.mycont_wrap .table_write tr:last-child td { border-bottom:none; padding-bottom:0; }
.mypage_content .board_contr_wrap { padding:0px 20px 0px 30px; align-items:center; background:#fafafa; margin-bottom:3em; border-radius:8px; border:1px solid #f5f5f5; min-height:89px; }
.mypage_content .board_contr_wrap .total { color:#333; font-weight:500; font-size:1em; }
.mypage_content .board_contr_wrap .search_box { display:flex; align-items:center; gap:5px; border:1px solid #fafafa; }
.mypage_content .board_contr_wrap .search_box .input_wrap { width:350px; background:none; display:flex; align-items:center; border:1px solid #fafafa; border-radius:10px; transition:all 0.2s;}
.mypage_content .board_contr_wrap .search_box .input_wrap:hover { border:1px solid #fafafa; box-shadow:none; background:#ededed; }
.mypage_content .board_contr_wrap .search_box .inputText { width:calc(100% - 50px); height:50px; border:none; background:none; padding-left:15px; font-size:1.1em; border-radius:9px; font-weight:400; }
.mypage_content .board_contr_wrap .search_box .inputText:hover { box-shadow:none; }
.mypage_content .board_contr_wrap .search_box .btn_search { width:50px; height:50px; border:none; background:none; font-size:1.3em; color:#ccc; transition:all .2s; }
.mypage_content .board_contr_wrap .search_box .btn_search:hover { color:#000; }
.mypage_content .mypage_box .item_text .detail { flex-direction:column; align-items:flex-start; }
.mypage_content .mypage_box .item_text .detail .item_stock { margin:10px 0 0; }
.mypage_content .mypage_box .item_text .detail .item_stock::before { display:none; }

/*회원가입*/
.mycont_container { border-top:2px solid #333; }
.mycont_container .board_contr_wrap { border-bottom:1px solid #000; padding:0px 0 20px; }
.mycont_container .board_contr_wrap .must_text { margin-top:0; }
.mycont_wrap { display:flex; flex-wrap:nowrap; border-bottom:1px solid #ededed; padding:30px 0; }
.mycont_wrap h4 { width:180px; }
.mycont_wrap .table_write { width:calc(100% - 180px); border-top:none; }
.mycont_wrap .table_write th { padding-top:20px; }
.mycont_wrap .table_write td { border-bottom:1px solid #ededed; padding:5px 0 20px; }
.mycont_wrap .table_write tr:first-child th { padding-top:0; }
.mycont_wrap .table_write tr:last-child td { padding-bottom:0; }
.mycont_wrap .table_write label { font-size:14px; margin-bottom:8px; line-height:1em; display:inline-block; font-weight:500; }
.mycont_wrap .table_write .inputText, .join_box .table_write .selectText { background-color:#f5f5f5; border:1px solid #f0f0f0; border-radius:7px;}
.mycont_wrap .table_write .inputText:hover, .join_box .table_write .selectText:hover { border:1px solid #666; }
.mycont_wrap .table_write .file_list.img_type { margin-top:10px; }

/*주문내역*/
.orddetails { width:100%; }
.orddetails > ul > li { margin-bottom:2.5em;  }
.orddetails > ul > li:last-child { margin-bottom:0; }
.orddetails > ul > li.nothing { background:#f9f9f9; border:1px solid #ededed;}
.orddetails > ul > li .ord_info_wrap { border:1px solid #ddd; border-radius:20px; }
.orddetails > ul > li .ordDate { font-size:1.3em; font-weight:500; margin-bottom:15px; }
.orddetails > ul > li.active .ord_info_wrap { border:1px solid #333; }
.orddetails > ul > li.active .orddetails_head { border-bottom:1px dashed #333; }
.orddetails > ul > li.active .orddetails_head::after, .orddetails > ul > li.active .orddetails_head::before { border: 1px solid #333; border-bottom:1px solid #fff; }

.orddetails_head {  }
.orddetails_head { border-bottom:1px dashed #ccc; background:#fafafa; position:relative; border-radius:20px 20px 0 0; display:flex; align-items:center; justify-content:space-between; }
.orddetails_head::after, .orddetails_head::before { border:1px solid #ddd; border-bottom:1px solid #fff; width:20px; height:10px; border-radius:40px 40px 0 0; background:#fff; content:''; display:inline-block; position:absolute; bottom:-7px; }
.orddetails_head::before { left:-7px; transform:rotate(-270deg); }
.orddetails_head::after { right:-7px; transform:rotate(270deg); }
.orddetails_head .text_wrap { padding:2em; }
.orddetails_head .btn_odrdeliv { position:absolute; top:15px; right:15px; width:35px; height:35px; border-color:#e3e3e3; box-shadow:3px 3px 10px 0 rgba(0,0,0,0.2); }
.orddetails_head .btn_odrdeliv:hover { border-color:#666; box-shadow:3px 3px 15px 0 rgba(0,0,0,0.3); }
.orddetails > ul > li.active .orddetails_head .btn_odrdeliv { transform:rotate(45deg); background:var(--main); color:#fff; border-color:var(--maindeep); }
.orddetails_head .orddetails_head_top { display:flex; align-items:center; margin:0 0 13px; }
.orddetails_head .orddetails_head_top .state { font-weight:600; font-size:1.3em; }
.orddetails_head .orddetails_head_top .stateDate { display:flex; align-items:center; color:var(--blue); font-size:1.2em; font-weight:500; }
.orddetails_head .orddetails_head_top .stateDate::before { margin:0 10px; width:4px; height:4px; border-radius:4px; background:#ccc; content:''; display:inline-block; }

.orddetails_head .btn_wrap { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; padding:0 25px; }
.orddetails_head .btn_wrap .btn_s { padding:0 40px; }

.orddetails_head .orddetails_head_bottom { display:flex; justify-content:space-between; align-items:center; font-size:12px; color:#333; }
.orddetails_head .orddetails_head_bottom .company_info { display:flex; align-items:center; }
.orddetails_head .orddetails_head_bottom .company_info strong { font-size:14px; font-weight:600; color:000; }
.orddetails_head .orddetails_head_bottom .company_info strong span { font-weight:400; font-size:13px;}

.orddetails_head .company_logo_wrap { /* border:1px solid #d7d7d7; padding:2px 10px 2px 2px; gap:5px; */ background:none; border:none; padding:0; }
.orddetails_head .company_logo { display:none; width:25px; height:25px; border-radius:30px; box-shadow:none; }
.orddetails_head dl { margin-left:15px; display:flex; align-items:center; line-height:1em; }
.orddetails_head dl dt { margin-right:5px; color:#9f9f9f; }
.orddetails_head dl dd { margin-right:15px; }
.orddetails_head dl dd:last-child { margin-right:0; }

.odrdeliv_cont { padding:2em 2em 2.5em; border-top:none; border-radius:0 0 20px 20px; }
.odrdeliv_cont h4 { margin:2.5em 0 .8em; font-size:1.2em; font-weight:500; }
.odrdeliv_cont .img_box:hover { box-shadow:none; }
.odrdeliv_cont_btm { text-align:center; margin-top:30px; }
.odrdeliv_cont_btm button { color:#000; border-color:#ddd; }
.odrdeliv_cont_btm button:hover { background:var(--main); border-color:var(--main); color:#fff; box-shadow:none; }
.odrdeliv_cont_btm .btn_odrdeliv_close { display:none; }

.thumb_cont_wrap { display:flex; justify-content:space-between; align-items:flex-start; padding:1.5em; border:1px solid #e0e3e7; border-radius:10px; box-shadow:3px 3px 3px 0 rgba(0,0,0,0.05); }
.thumb_cont_wrap .thumb_cont { width:100%; display:flex; align-items:center; }
.thumb_cont_wrap .thumb_text .state { border:1px solid #ededed; padding:8px 10px; font-size:12px; border-radius:50px; line-height:1em; display:inline-block; }
.thumb_cont_wrap .img_box { width:70px; height:70px; border-radius:5px; padding-bottom:0; margin-right:25px; }

.thumb_cont_wrap .thumb_text { width:calc(100% - 105px); }
.thumb_cont_wrap .thumb_text .item_name { display:flex; margin:0 0 15px 0; align-items:center; font-weight:500; font-size:16px; width:100%; }
.thumb_cont_wrap .thumb_text .item_price { margin:10px 0 0px; font-size:1.2em;}

.odrdeliv_dtail_wrap { display:none; }
.orddetails > ul > li.active .odrdeliv_cont .thumb_cont_wrap { display:none; }
.orddetails > ul > li.active .odrdeliv_cont .odrdeliv_dtail_wrap { display:block; }
.orddetails > ul > li.active .btn_odrdeliv_close { display:inline-block; }
.orddetails > ul > li.active .btn_odrdeliv { display:none; }
.orddetails > ul > li.active .odrdeliv_cont_btm { padding-top:0; border-top:none; }

.odrdeliv_wrap { border:1px solid #222; border-radius:15px; overflow:hidden; }
.odrdeliv_head { padding:1em 1.5em; background:#222; color:#fff; display:flex; }
.odrdeliv_head > strong { width:80px; }
.odrdeliv_head .text { display:flex; gap:20px; flex-wrap:wrap; }
.odrdeliv_head dl { display:flex; align-items:center; font-size:14px; line-height:1em; flex-wrap:wrap; }
.odrdeliv_head dl dt { margin-right:10px; border:1px solid #fff; border-radius:50px; padding:5px 10px; font-size:12px; }
.odrdeliv_head dl dd { display:flex; align-items:center; color:#fff; }
.odrdeliv_head dl dd a { color:#fff; }
.odrdeliv_head dl dd strong { margin-right:7px; }
.odrdeliv_head .btn_icon { color:#999; margin-left:7px; }
.odrdeliv_head .btn_icon:hover { color:#fff; }

.type_sold .odrdeliv_wrap { border:1px solid #ededed; }
.type_sold .odrdeliv_wrap .delivery_state ul li::after { }

.delivery_state { padding:2em; }
.delivery_state .odrCancel { padding:2em; text-align:center; color:#999; }
.delivery_state ul { display:flex; position:relative; }
.delivery_state ul li { position:relative; display:inline-flex; flex-direction:column; align-items:center; width:33.333%; }
.delivery_state ul li .dot { content:''; display:inline-block; width:14px; height:14px; background:#aaa; position:absolute; top:77px; left:50%; transform:translateX(-50%); border-radius:40px; z-index:1; }
.delivery_state ul li .dot::before { content:''; display:inline-block; width:19px; height:19px; border:1px solid #aaa; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); border-radius:40px; }
.delivery_state ul li .dot::after { animation:dot 1s infinite; content:''; display:none; width:20px; height:20px; border-radius:50px; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); border:3px solid #ccc; }
.delivery_state ul li .condition { display:flex; width:60px; height:80px; align-items:center; justify-content:center; margin-bottom:20px; }
.delivery_state ul li .condition img { animation:deliveryImg 2s infinite; height:40px; display:none; }
.delivery_state ul li:nth-child(2) .condition img { height:35px; }
.delivery_state ul li .text { text-align:center; }
.delivery_state ul li .text .state { font-weight:500; }
.delivery_state ul li .text .date { font-size:12px; color:#666; }
.delivery_state ul li::after { width:100%; height:10px; background:#eee; content:''; display:block; position:absolute; top:80px; left:0%; z-index:0; }
.delivery_state ul li:first-child::after { width:50%; right:0; left:auto; }
.delivery_state ul li:last-child::after { width:50%; left:0; }

/*완료*/
.delivery_state ul li.done .dot { background:#333; }
.delivery_state ul li.done .dot::before { border-color:#333; }
/*진행중*/
.delivery_state ul li.active .dot { background:var(--main); }
.delivery_state ul li.active .dot::before { border-color:var(--main); }
.delivery_state ul li.active .dot::after,
.delivery_state ul li.active img { display:inline-block; }

@keyframes deliveryImg {
	0% { transform:translateY(0); }
	50% {transform:translateY(5px); }
	100% {transform:translateY(0px); }
	}

@keyframes dot {
	0% { transform:translate(-50%,-50%) scale(1); opacity:1; }
	80% {transform:translate(-50%,-50%) scale(1.8); }
	100% {transform:translate(-50%,-50%) scale(1.8); opacity:0; }
	}

.odr_items .board_order { padding:0; border-radius:0; border-left:none; border-right:none; }
.odr_items .board_order .img_box {  }
.odr_items .board_order .item_expdate { margin:10px 0 0; }
.odr_items .board_order .item_expdate strong { font-weight:500; }
.odr_items .board_order .ord_item_text { width:auto; max-width: calc(100% - 200px); display:flex; }
.odr_items .board_order .text { max-width: calc(100% - 70px); margin-left:20px; }
.odr_items .board_order li.bg_gray { background:#f4f4f4; vertical-align:bottom; text-align:right; padding:20px; }
.odr_items .board_order li.bg_gray p { font-size:0.9em; }
.odr_items .board_order li.bg_gray .item_price { margin-top:10px; }


.odr_client_info { border-top:2px solid #000; border-bottom:1px solid #ededed; width:100%; padding:30px; }
.odr_client_info th { text-align:center; vertical-align:middle; background:#f4f4f4; font-size:1.1em; font-weight:500; }
.odr_client_info td { padding:30px; }
.odr_client_info dl { display:flex; text-align:left; margin-bottom:10px; font-size:0.9em; }
.odr_client_info dl:last-child { margin-bottom:0px; }
.odr_client_info dl dt { width:100px; font-weight:500; }

.dlvy_wrap { width:700px; margin:0 auto; position:relative; }
.dlvy_insert_wrap { width:100%; margin-bottom:5em; }
.dlvy_insert_wrap h3 { font-size:1.6em; margin-bottom:20px; font-weight:500; }
.dlvy_insert_wrap .orddetails_head { height:auto; background:#fff; flex-direction:column; text-align:left; align-items:flex-start; }
.dlvy_insert_wrap .orddetails_head::before { background:#fff; }
.dlvy_insert_wrap .orddetails_head::after { background:#f1f1f1; }
.dlvy_insert_wrap .orddetails_head, .dlvy_insert_wrap .odrdeliv_cont { padding:50px 50px 50px; }
.dlvy_insert_wrap .orddetails > ul > li .ord_info_wrap { border:1px solid #e1e1e1; }
/* .dlvy_insert_wrap .orddetails_head, .dlvy_insert_wrap .odrdeliv_cont, .dlvy_insert_wrap .orddetails_head::after, .dlvy_insert_wrap .orddetails_head::before { border-color:#ddd; } */
.dlvy_insert_wrap .table_write { padding:15px 0 0; }
.dlvy_insert_wrap .table_write tr { display:table-row; }
.dlvy_insert_wrap .table_write th, .dlvy_insert_wrap .table_write td { padding:15px 0; border-bottom:1px solid #f1f1f1; }
.dlvy_insert_wrap .table_order { border:none; border-top:2px solid #333; border-radius:0; padding:0; }
.dlvy_insert_wrap .table_order .bg_gray th { font-size:17px; padding:25px; }
.dlvy_insert_wrap .table_order tr td:first-child { padding:15px 0; }
.dlvy_insert_wrap .board_order .ord_item_control { gap:25px; }
.dlvy_insert_wrap .board_order .bg_gray { justify-content:flex-end; padding:20px; }
.dlvy_items { width:100%;  }
.dlvy_items .total_price { display:flex; justify-content:space-between; align-items:center; margin:30px 0; }
.dlvy_items .total_price .item_price { font-weight:600; font-size:2em; letter-spacing:-2px; }
.dlvy_items .total_price .item_price span { color:#000; }

.dlvyCmptn_wrap { width:100%; height:100%; background:#f1f4f6; padding-top:3em; }
.dlvyCmptn { width:700px; background:#fff; padding:3em; margin:0 auto; font-size:13px; }
.dlvyCmptn h1 { text-align:center; margin-bottom:20px; }
.dlvyCmptn img { width:80px; }
.dlvy_head { padding:2em; background:#f4f4f4; }
.dlvy_cont { padding:2em 0 2.5em; }
.dlvy_head .company_logo { width:40px; height:40px; border-radius:15px; margin-right:15px; box-shadow:none; }
.dlvy_head .title { display:flex; align-items:center; font-size:1.5em; }
.dlvy_head .text_wrap { display:flex; align-items:center; flex-wrap:wrap; padding-left:55px; margin-top:5px; font-size:0.9em; }
.dlvy_head .text_wrap dl { display:flex; align-items:center; }
.dlvy_head .text_wrap dl dt { margin-right:5px; display:inline-block; }
.dlvy_head .text_wrap dl::after { content:''; display:inline-block; margin:0 13px; background:#ccc; width:1px; height:14px; }
.dlvy_head .text_wrap dl:last-child::after { display:none; }
.dlvy_cont h2 { font-size:1.2em; margin-bottom:12px; }
.dlvyCmptn .board_bottom { margin-top:0; }
.dlvyCmptn_box:nth-child(1) { margin-bottom:30px; }
.dlvyCmptn_box .img_box { width:40px; height:40px; padding-bottom:0; border-radius:10px; }
.dlvyCmptn_box .table_view th { background:#f7f7f7; font-weight:400; }
.dlvyCmptn_box .table_view th, .dlvyCmptn_box .table_view td { font-size:1em; padding:10px; text-align:center; border-bottom:1px solid #e5e5e5; }
.colimg { width:70px; }
.coldate { width:100px; }
.colcont { width:80px; }
.rowhead { width:130px; }

.location_share_wrap { width:100%; height:100%; display:flex; text-align:center; align-items:center; justify-content:center; }
.location_share { display:flex; text-align:center; align-items:center; justify-content:center; flex-direction:column;}
.location_share strong { font-size:1.8em; font-weight:700; line-height:1.8em; margin:40px 0 10px; }
.location_share .ls_img { width:250px; height:200px; position:relative; }
.location_share .ls_img::after { width:200px; height:200px; border-radius:100px; background:#fdfde2; content:''; display:inline-block; animation:ls_img 3s infinite both; position:absolute; left:50%; transform:translateX(-50%) scale(0); z-index:0; }
.location_share .ls_img img { width:40px; position:absolute; z-index:1; }
.location_share .ls_img .car { width:130px; animation:share 3s infinite both; top:-20%; left:-30%; z-index:2; transform:rotate3d(1, 1, 1, 5deg); }
.location_share .ls_img .box1 { top:10%; left:10%; animation:delivery1 3s infinite both; opacity:0;}
.location_share .ls_img .box2 { top:30%; left:30%; animation:delivery2 3s infinite both; opacity:0;}
.location_share .ls_img .box3 { top:50%; left:50%; animation:delivery3 3s infinite both; opacity:0;}
@keyframes ls_img { 0% { opacity:0; transform:translateX(-50%) scale(0); } 20% { opacity:1; transform:translateX(-50%) scale(1); }100% { opacity:1; transform:translateX(-50%) scale(1); } }
@keyframes delivery1 { 0% { opacity:0; }30% { opacity:0; }100% { opacity:1; } }
@keyframes delivery2 { 0% { opacity:0; } 60% { opacity:0; }100% { opacity:1; } }
@keyframes delivery3 { 0% { opacity:0; } 90% { opacity:0; }100% { opacity:1; } }
 @keyframes share {
	0% { top:-20%; left:-20%; }
	20% { top:10%; left:10%; }
	30% { top:10%; left:10%; }
	50% { top:30%; left:30%; }
	60% { top:30%; left:30%; }
	80% { top:50%; left:50%; }
	90% { top:50%; left:50%; }
	100% { top:65%; left:70%; }
}

.moving-circle {
  stroke-dasharray: 500;
  stroke-dashoffset: 500;
  transform: rotate(-90deg);
  animation: ani 5s linear infinite;
}

@keyframes ani {
  0% {
    stroke-dashoffset: 500;  /*500지점부터 svg가 나타남*/
  }
  50% {
    stroke-dashoffset: 0;   /*0지점부터 svg가 나타남*/
  }
  100% {
    stroke-dashoffset: -500; /*-500지점부터 svg가 나타남*/
  }
}

.loshare_tab { background:#f4f4f4; width:600px; margin:40px auto; }
.loshare_tab h2 { margin-bottom:8px; }
.loshare_tab > p { margin-bottom:20px; }
.loshare_tab .tab_wrap { border:1px solid #ebebeb; background:#fff; border-radius:30px; overflow:hidden; }
.loshare_tab .tabs { display:flex; }
.loshare_tab .tabs li { width:50%; }
.loshare_tab .tabs li a { width:100%; padding:20px 0; font-size:1.3em; font-weight:500; display:block; text-align:center; background:#e3e3e3; color:#666; }
.loshare_tab .tabs li a i { margin-right:5px; }
.loshare_tab .tabs li.active {  }
.loshare_tab .tabs li.active a { border-radius:30px 30px 0 0; background:#fff; color:#000; }
.loshare_tab .content { padding:30px; }
.loshare_tab .content ol li { text-align:center; position:relative; padding-left:20px; }
.loshare_tab .content ol li > img { margin:20px 0 20px -10px; }
.loshare_tab .content ol li em { position:absolute; top:0; left:0; }
.loshare_tab .content ol li p { text-align:left; margin-bottom:10px; }
.loshare_tab .content ol li p i { margin:0 4px; }
.loshare_tab .content ol li span { display:flex; }
.loshare_tab .content ol li p img { width:24px; margin:0 0 -5px 3px; }
.loshare_tab .content .note { text-align:center; padding-top:20px; margin-top:20px; border-top:1px solid #ededed; }
.loshare_tab .content .note a { border:1px solid #000; border-radius:5px; display:inline-block; margin-top:15px; text-transform:uppercase; }
.loshare_tab .content img { max-width:489px; width:100%; }

.mapshare_wrap { width:100%; height:100%; }
.mapshare_wrap .title { width:100%; height:50px; padding:0 1em; display:flex; align-items:center; position:relative; z-index:999; box-shadow:0 0 10px 0 rgba(0,0,0,0.2); }
.mapshare_wrap .title h2 { font-size:15px; }
.mapshare_wrap #map { width:100%; height:calc(100% - 50px); }