@charset "utf-8";

@media(max-width:1400px){
#product .content{margin:50px 20px}
#product .pop_box{height:400px}
#product .pop_box .btm{height:120px}
#product_info{margin:40px 20px}
#product_info .menu_wrap.fixed .menu{margin:0 20px}
#mypage .content{margin:50px 20px}
#mypage .lft_content{width:37%}
#mypage .content_box{grid-template-columns:repeat(3,1fr)}
#mypage .rgt_content .top_tit{flex-flow:column;gap:30px}
#mypage .date_calendar .date-picker input{width:142px}
#search_result .pro_wrap{margin:70px 20px}
#search_result .pro_wrap .pro_list{grid-template-columns:repeat(4,1fr)}
.order_info .top .txt_wrap{width:65%}
.my_info ul li .lft_txt{width:20%}
.ali_box a{flex-flow:column;align-items:flex-start;gap:20px}
.ali_box a .num{width:100%}
.ali_box a .mid{width:100%}
.ali_box a .end{width:100%;justify-self:end}
.ali_box a .txt_box{line-height:25px}
.guest_order .ali_box a{flex-flow:initial;align-items:center}
.guest_order .g_content{margin:70px 20px 120px}
.g_content{margin:70px 20px 120px}
.g_content .order_info .top{padding:0}
}
@media(max-width:1024px){
.sub_banner{margin-top:85px}
.sub_banner p{font-size:30px}
.sub_banner .sub_t{font-size:16px}
.g_content h2{font-size:22px}
#product .pop_box{height:400px}
#product .pop_box .btm{height:120px}
#product_info{margin:40px 20px 130px}
#product_info .content{margin-top:130px}
#product_info .main_content{justify-content:space-between}
#product_info .main_content .swiper{width:47%}
#product_info .main_content .price_box{width:49%}
#mypage{margin:0 auto}
#mypage .content{margin:0;flex-flow:column}
#mypage .lft_content{width:100%;padding:0;border-radius:0;background-color:#f0f8ff;border:none}
#mypage .rgt_content{padding:0 15px;margin:0 0 80px;width:100%}
#mypage .lft_content .pro_t{display:none}
#mypage .lft_content .menu{display:flex;padding-top:0;margin-top:0;border-top:none}
#mypage .lft_content .menu a{padding:30px 10px;width:calc(100% / 4);justify-content:center;gap:10px;color:#aaa}
#mypage .lft_content .menu a i{color:#aaa}
#mypage .lft_content .menu a.on{color:#178576;background-color:initial}
#mypage .lft_content .menu a.on i{color:#178576}
#mypage .lft_content .menu a i{width:20px}
#mypage .rgt_content .top_tit{padding-bottom:0;border-bottom:none;justify-content:center}
#mypage .content_box{grid-template-columns:repeat(4, 1fr)}
#mypage .rgt_content h2{font-size:22px}
#product_order{margin:140px auto 120px;padding:0 15px}
#product_order.wish .title .tit01{display:none}
#product_order.wish .title .tit02{display:none}
#product_order.wish .title .tit03{display:none}
#product_order.wish .title{padding:13px 10px}
#product_order.wish .item_info li{display:block;padding:13px 10px}
#product_order.wish .total_price p{padding-right:18px}
#product_order.wish .item_info li .detail{width:calc(100% - 30px);border-right:none;margin:-20px 0 0 40px;height:auto}
#product_order.wish .item_info li .price{padding-right:6px;margin-top:-15px;width:100%;line-height:initial;border-left:none;text-align:right}
#product_order.wish .item_info li .num_box{margin:20px 0 0 175px;padding:0;width:15%}
#product_order.wish .item_info li .num_box div{height:32px}
#product_order.wish .item_info li .num_box div span{line-height:32px}
#product_order.wish .item_info li .detail .cancel{top:0;right:16px}
#product_order h3{padding-top:40px}
#board{margin-top:80px}
#board .top_title{font-size:30px}
#board section{padding:50px 15px 100px}
#board .tit_wrap h3{font-size:22px}
#board .tit_wrap p{font-size:15px;margin-top:20px}
#board .search_area{margin-top:40px}
#board .nav_area{font-size:16px}
#board .nav_area a{padding:20px 0}
#term{margin:40px 20px 70px;padding:0;font-size:15px}
#term h2{margin-bottom:20px;font-size:26px}
#search_result .pro_wrap{margin:50px 15px}
#search_result .pro_wrap .pro_list{grid-template-columns:repeat(3,1fr)}
#search_result .pro_list .btm{height:120px}
.ali_box a{flex-flow:initial;align-items:center}
.ali_box a .num{width:22%;font-size:14px}
.ali_box a .end{width:40%;font-size:14px}
.guest_order .ali_box a .num{width:40%;font-size:14px}
.guest_order .ali_box a .end{width:40%;font-size:14px}
.order_info .top .txt_wrap{width:67%}
.inquriy_list .rgt_content table{margin-top:30px;border-top:1px solid #888}
.inquriy_list .rgt_content .top_tit, .inquriy_read .rgt_content .top_tit{border-bottom:none !important}
.buyer_info{padding:0}
.sms_info{padding:0}
.guest_order_info .order_info .top .txt_wrap{width:66%}

}
@media(max-width:768px){
.sub_banner p{font-size:26px}
.sub_banner .sub_t{font-size:15px}
.popup-content{width:calc(100% - 40px)}
.phone .jo_btn, .phone_check .jo_btn{width:100%;margin-top:10px}
.jo_btn{margin-top:4px;width:100%}
.ali_box a{flex-flow:column}
.ali_box a .num{width:100%}
.ali_box a .end{width:100%}
#product .pop_box{height:382px}
#product .pro_ali p{font-size:14px}
#product .pro_ali div a{font-size:14px}
#product .pop_box .btm{gap:20px;padding:15px 10px}
#product_info .top_pag{font-size:14px}
#product_info{margin:40px 20px 120px}
#product_info .main_content{flex-flow:column}
#product_info .main_content{gap:30px}
#product_info .main_content .swiper{width:100%}
#product_info .main_content .price_box{width:100%}
#product_info .main_content .price_box .tit{font-size:20px;margin:10px 0 15px}
#product_info .main_content .aft_sale .sale{font-size:22px}
#product_info .main_content .aft_sale .sale_p{margin-left:10px;font-size:24px}
#product_info .main_content .price_box{min-height:auto}
#product_info .total_p span{font-size:22px}
#product_info .main_content .aft_sale .sale_p{font-size:22px}
#product_info .menu_wrap.fixed{background-color:rgba(225, 225, 225, .8);-webkit-backdrop-filter:blur(10px)}
#join{padding:0 20px;margin:80px auto 120px}
#join h1{font-size:26px}
#join .phone_check input{width:100%}
#join select{width:95px}
#join input, #join select{width:calc(100% / 4)}
#join .address .code_wrap input{width:100%}
#join .join_wrap .email input{width:100%}
#join .phone input{width:calc(100% / 4)}
#find_mem{margin:140px auto 120px;padding:0 20px}
#find_mem .choose_find a{padding:0;width:calc(100% / 2 - 12px)}
#find_mem .top_area h2{font-size:26px}
#find_mem .p_num{align-items:baseline}
#find_mem .p_num div{width:100%}
#find_mem .id_content .rgt_cont{flex-flow:column}
#find_mem .id_content .p_num .rgt_cont a{width:100%;margin-top:10px}
#mypage .content_box{grid-template-columns:repeat(3,1fr);gap:20px}
#mypage .content_box a .img_box{height:230px}
#mypage .rgt_content .top_tit .search_form{flex-flow:column}
#mypage .date_calendar .date-picker input{width:100%}
#mypage .rgt_content .top_tit .search_form .order_num{width:100%;justify-content:center}
#mypage .back_btn a, #mypage .ex_btn a{height:47px;line-height:47px;font-size:14px}
#product_order.wish h2{font-size:26px}
#order_step ul li .num{font-size:16px}
#order_step{margin-bottom:50px}
#order_step ul li + li{margin-left:50px;padding-left:50px}
#order_step ul li + li::before{width:122px;right:45%;top:17%}
#product_order.wish .none{font-size:16px}
#product_order.wish .item_info li .detail .pic{width:80px;height:80px}
#product_order.wish .item_info li .detail .txt{gap:10px;width:57%;word-break:keep-all}
#product_order.wish .item_info li .detail .txt .tit{line-height:1.6}
#product_order.wish .item_info li .num_box{margin:20px 0 0 158px;width:22%}
#product_order.buy .all_item .item_info li{padding:20px}
#product_order h2{font-size:26px}
#product_order.buy .item_info li .detail{width:100%;height:auto}
#product_order.buy .all_item .item_info li{flex-flow:column}
#product_order.buy .item_info li .price{margin-top:10px;width:100%;line-height:initial}
#product_order .item_info li .num_box{width:100%;padding:0;text-align:right;color:#888}
#product_order .item_info li .detail .txt{gap:10px}
#product_order .item_info li .detail .txt .tit{line-height:25px;word-break:keep-all}
#product_order.buy .total_price p{padding-right:20px}
#product_order h3{margin-bottom:25px;font-size:20px}
#product_order.buy .payment{margin-top:50px;height:60px;line-height:60px}
#product_order.buy .payment span{font-size:20px}
#product_order .buy_btn a{margin:0 auto}
#product_order.wish .buy_btn a{margin:40px auto 0}
#product_order.finish .order_sum{padding:30px 20px}
#product_order.finish .order_sum ul{padding:30px 20px}
#product_order.finish .btn_wrap{margin-top:40px}
#product_order.finish .order_sum ul li p span{width:100%;margin-bottom:15px}
#board section .tit_wrap{text-align:center}
#board .search_area input{width:100%}
#board .top_title{font-size:26px;height:170px}
#board.faq .mid_part{flex-flow:column;gap:20px}
#board.faq .mid_part form{width:100%}
#term{margin:40px 20px 70px}
#term h2{margin-bottom:15px;font-size:23px}
#term h3{font-size:20px}
#search_result .pro_wrap .pro_list{grid-template-columns:repeat(2,1fr);gap:10px}
#search_result .pro_list .btm .txt_wrap{padding:15px 10px;gap:10px}
#search_result .pro_wrap .pro_top ul li a{font-size:14px}
#search_result .pro_wrap .pro_top .total_pro{font-size:14px}
#search_result .search_word{font-size:16px;margin-bottom:20px;text-align:center}
#search_result .pro_wrap .pro_top{flex-flow:column;gap:7px}
.order_info .top{flex-flow:column;gap:20px;align-items:flex-start}
.order_info .top .txt_wrap{width:100%;text-align:right;margin-top:-85px}
.order_info .top .price{margin-top:15px;width:100%;text-align:right}
.order_info .total_price{margin-top:20px}
.order_info .table_wrap{grid-template-columns:repeat(1,1fr)}
.sms_info{margin-top:40px}
.buyer_info div p{width:16%}
.buyer_info.no div p{width:100%;display:flex}
.sms_info div p{width:16%}
.buyer_info input, .sms_info input{width:100px}
.buyer_info div select{padding:0 22px 0 15px}
.buyer_info.no .info_wrap div{flex-flow:column;align-items:flex-start;gap:10px}
.buyer_info.no .info_wrap div div{display:flex;flex-flow:initial;align-items:center}
.buyer_info.no input, .sms_info.no input{width:100%}
.sms_info div select{padding:0 22px 0 15px}
.sms_info .txt{font-size:15px}
.inquriy_read .read_box{margin-top:30px}
.inquriy_read .txt{line-height:25px}
.inquriy_read .txt iframe{width:100%}
.inquriy_read .ans_box{padding:20px}
.inquriy_read .write_box{margin-top:30px;padding:0}
.my_info ul li .lft_txt{width:28%}
.my_info ul li input{width:auto}
.guest_order .search_form{flex-flow:column}
.guest_order .g_content{margin:40px 20px 120px}
.guest_order .ali_box a{flex-flow:column}
.guest_order .ali_box a .num{width:100%}
.guest_order .ali_box a .end{width:100%}
.guest_order_info .order_info .top .txt_wrap{width:100%}
}
@media(max-width:480px){
.A0004_body #product_order.wish{margin:220px auto 80px}
.top_pag{display:none}
.sub_banner p{font-size:23px}
.submit_btm{font-size:15px}
.popup-content .mem_text{font-size:15px}
.agree_checkbox a{font-size:14px}
#product_info{margin:40px 20px 60px}
#product .pop_box{height:auto}
#product .content{margin:40px 15px}
#product .pop_box .btm{height:auto;gap:10px}
#product .pro_ali{align-items:center;flex-flow:column;gap:20px}
#product_info .menu{justify-content:center}
#product_info .menu_wrap.fixed .menu{justify-content:center}
#product_info .main_content .price_box .tit{font-size:18px}
#product_info .main_content .aft_sale .sale{font-size:20px}
#product_info .total_p span{color:#07d3b9}
#product_info .btn_ali a{font-size:15px;height:46px}
#product_info .btn_ali a.soldout{position:relative}
#product_info .detail_info{margin-top:40px}
#product_info .main_content{gap:20px}
#join h1{font-size:23px}
#join .form li p{font-size:14px;margin-bottom:6px}
#join .join_wrap{padding:0;border:none}
#mem_popup .popup-content div h2{font-size:17px}
#mem_popup .popup-content div h3{font-size:16px}
#find_mem .top_area h2{font-size:23px}
#find_mem .top_area p{font-size:14px;line-height:24px;word-break:keep-all}
#find_mem .choose_find{height:55px}
#find_mem .choose_find{font-size:14px}
#find_mem .id_content p{font-size:14px}
#find_mem .id_content .rgt_cont a{font-size:14px}
#mypage .content_box{grid-template-columns:repeat(2,1fr)}
#mypage .content_box a .img_box{height:200px}
#mypage .lft_content .menu{flex-flow:wrap}
#mypage .lft_content .menu a{padding:20px 10px;width:calc(100% / 2);border-radius:0}
#mypage .lft_content .menu a:nth-child(3){border-top:1px solid #eee}
#mypage .lft_content .menu a:nth-child(4){border-top:1px solid #eee}
#mypage .lft_content .menu a:nth-child(2n){border-left:1px solid #eee}
#mypage .rgt_content h2{font-size:22px}
#mypage .rgt_content .top_tit .search_form .order_num{font-size:14px;justify-content:center}
#order_step{margin-bottom:60px}
#order_step ul li + li{margin-left:30px;padding-left:30px}
#order_step ul li + li::before{width:87px;right:53%}
#order_step ul li img{height:27%}
#product_order h2{font-size:23px;margin-bottom:40px}
#product_order.wish{margin:80px auto 80px}
#product_order.wish .none{font-size:15px}
#product_order.wish .none a{height:42px;line-height:42px}
#product_order.wish .item_info li{padding:22px 10px}
#product_order.wish .item_info li .detail{display:block}
#product_order.wish .item_info li .detail .txt{width:83%;margin-top:20px;font-size:14px}
#product_order.wish .item_info li .num_box{margin:20px 0 0 38px;width:33%}
#product_order.wish .item_info li .price{margin-top:-25px}
#product_order.wish .item_info li .detail .cancel{right:12px}
#product_order.wish .item_info li .detail .txt .op{font-size:14px}
#product_order.wish .total_price p{font-size:14px}
#product_order.wish .total_price p span{font-size:17px}
#product_order.wish .buy_btn a{width:100%;height:48px;line-height:48px;margin:28px auto}
#product_order.buy .item_info li .detail{flex-flow:column;gap:10px;align-items:flex-start}
#product_order.buy .payment span{font-size:18px}
#product_order h3{font-size:18px}
#product_order.finish .order_sum .tit{font-size:18px}
#product_order.finish .btn_wrap{flex-flow:column;gap:5px}
#product_order.finish .buy_btn{width:100%;flex-flow:column;gap:5px}
#product_order.finish .buy_btn a{width:100%;font-size:15px}
#product_order .buy_btn{width:100%}
#product_order .buy_btn a{width:100%;font-size:15px}
#product_order.wish .buy_btn a{font-size:15px}
#product_order.finish .order_sum ul li p span{font-size:14px}
#board .top_title{font-size:23px}
#board .nav_area{font-size:15px}
#board .not_list table th{padding:15px 10px;font-size:14px}
#board .not_list table td{font-size:14px}
#board.faq .mid_part .nav_part a{padding:12px 0;width:107px}
#board.faq .not_list li{padding:20px}
#board.faq .not_list .top div .sub{font-size:14px}
#board.faq .not_list .top div p{font-size:16px}
#board.faq .not_list .btm div p{font-size:14px}
#board.notice_view .tit{font-size:16px}
#board.notice_view .txt{font-size:15px;line-height:25px}
#term{margin:40px 20px 70px}
#term h2{font-size:20px}
#term h3{font-size:18px}
#product_info .btn_ali{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:100%;padding:10px 20px;border-top:1px solid #e1e1e1;background-color:#f5f5f5;z-index:99}
#order_step ul li .num{font-size:15px}
#search_result .search_word{font-size:15px}
.ali_box a .num{gap:7px;font-size:14px}
.order_info .table_wrap{margin-top:30px;font-size:14px}
.order_info .table_wrap div .th{width:30%}
.order_info .table_wrap div .td{width:70%}
.inquriy_list .rgt_content table tr th{padding:15px 10px;font-size:14px}
.inquriy_list .rgt_content table tr{font-size:14px}
.inquriy_read .tit{font-size:16px}
.inquriy_read .write_box div{flex-flow:column;gap:10px}
.inquriy_read .back_btn{margin-top:30px !important}
.inquriy_list .rgt_content table tr .date{font-size:13px}
.my_info ul li{flex-flow:column;gap:10px}
.my_info ul{padding:30px 20px}
.my_info ul li .lft_txt{width:100%}
.my_info ul li div{width:100%}
.my_info ul li div p{font-size:14px;line-height:24px;word-break:keep-all}
.my_info ul li input{width:100%}
.buyer_info .info_wrap div{display:block}
.buyer_info div p{margin-bottom:15px}
.sms_info div{margin-top:30px;display:block}
.sms_info div p{margin-bottom:15px}
.sms_info .txt{line-height:25px}
.buyer_info input, .sms_info input{width:100%}
.buyer_info .info_wrap div div{display:flex}
.sms_info div div{margin-top:15px;display:flex}
.agree_checkbox{display:block;word-break:keep-all}
.guest_order .search_form .order_num{font-size:14px}
}
@media(max-width:380px){
    .header_notice{padding:10px}
.sub_banner p{font-size:21px}
.sub_banner .sub_t{font-size:14px}
.pop_box .btm .tit{word-break:initial}
.pop_box .top{height:185px}
.popup-content .mem_text{font-size:14px}
#product_order.wish h2{font-size:21px;margin-bottom:30px}
#join{margin:80px auto 80px}
#join h1{font-size:21px}
#find_mem{margin:140px auto 80px}
#find_mem .top_area h2{font-size:21px}
#product_info .main_content .price_box .tit{padding:0 0 20px;font-size:17px}
#product_info .main_content .aft_sale .sale{font-size:18px}
#product_info .main_content .aft_sale .sale_p{font-size:21px}
#product_info .btn_ali a{font-size:14px;height:44px}
#product_info .menu li{font-size:14px}
#product_info .anchor_div h3{font-size:18px}
#product_info .anchor_div{font-size:14px}
#mem_popup .popup-content div h2{font-size:16px}
#mem_popup .popup-content div h3{font-size:15px}
#find_mem .id{display:block}
#find_mem .id_content .rgt_cont{width:100%}
#find_mem .p_num{flex-flow:column;gap:10px}
#find_mem .p_num_ok{ flex-flow:column;gap:10px}
#find_mem .p_num_ok p{margin-top:0}
#find_mem .id input{width:100%}
#find_mem.id .p_num div{width:100%}
#mypage .content_box a .img_box{height:160px}
#mypage .date_calendar .date-picker i{left:10px}
#mypage .date_calendar .date-picker input{padding-left:37px;font-size:14px}
#mypage .rgt_content .top_tit .search_form .order_num{gap:8px}
#mypage .back_btn a, #mypage .ex_btn a{width:100%}
#mypage .back_btn{width:100%;height:46px;margin-top:0;font-size:14px}
#mypage .lft_content .menu a{font-size:14px}
#product_order.wish .none{font-size:14px}
#product_order.wish .none a{font-size:14px}
#product_order .buy_btn a{font-size:15px;width:100%}
#board.faq .not_list li{padding:20px 10px}
#order_step ul li img{height:23%}
#order_step ul li + li{margin-left:20px;padding-left:30px}
#order_step ul li + li::before{width:68px;right:63%}
#board.faq .mid_part .nav_part{display:grid;gap:0;grid-template-columns:repeat(2,1fr);gap:0;width:100%}
#board.faq .mid_part .nav_part a{width:100%;border-radius:0;font-size:14px}
#board.faq .not_list .top{flex-flow:column;gap:10px}
#board.faq .not_list .btm div{gap:10px}
#board.faq .mid_part .nav_part a:nth-child(2),#board.faq .mid_part .nav_part a:nth-child(4){border-left:1px solid #eee}
#board.faq .mid_part .nav_part a:nth-child(2n){border-bottom:1px solid #eee}
#term{font-size:14px}
.ali_box a .txt_box{width:62%;font-size:14px}
.order_info .total_price{height:50px;font-size:15px}
.order_info .top .txt_wrap .sub p span{font-size:14px}
.order_info .btn_wrap{flex-flow:column;margin-top:30px;gap:9px}
.order_info .top .txt_wrap .tit{font-size:14px}
.my_info .back_btn{margin-top:20px !important} 
.sms_info div p, .buyer_info div p{width:100%}
.guest_order .search_form .order_num, .order .search_form .order_num{word-break:keep-all}
}