@charset "utf-8";
/* CSS Document */
/**
 * custom css 입니다. 추가적인 css 는 여기에 작성을 해주세요.
 */

.top-logo{-webkit-user-select:none; /* Chrome, Safari, Opera */  -moz-user-select: none; /* Firefox */  -ms-user-select: none; /* Internet Explorer/Edge */  user-select: none; /* Standard */}

/*830px 이하
.mobile-menu-btn {display:none; flex-direction:column; justify-content:space-between; width:25px; height:20px; cursor:pointer; position:relative; margin-bottom: -5px; padding-bottom: 5px;}
.mobile-dropdown {display: block !important; opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(15px); transition: all 0.3s ease-out;
z-index: 1000; position:absolute; top:80%; right:0; width:180px; background:#fff; border:1px solid #ddd; border-radius:8px; z-index:200; margin-top: -5px; padding-top: 5px;}
.mobile-dropdown ul { list-style:none; margin:0; padding:10px 0; }
.mobile-dropdown.is-open {display:block;}

.mobile-dropdown li a {display:block; padding:10px 15px; color:#333; font-size:14px;}
.mobile-dropdown li a:hover { background:#f5f5f5; }

@media screen and (max-width: 830px) {
.header-top,.header-inner{height:80px;}
.header-right {}
.mobile-menu-btn {display:block; background: url(/data/skin/front/asakjangt_copy/_dbook/img/top_my_btn.png) no-repeat 50% 0; width: 32px; height:32px;}
.mobile-menu-btn:hover + .mobile-dropdown, .mobile-dropdown:hover{opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(0);}

@media screen and (max-width:670px) {
	#header .top-search{margin-left:1% !important;}
	#header .top-search {min-width:350px !important;}
}

@media screen and (max-width:480px) {
	#header .header-inner{padding:0 !important;}
	#header .top-search {margin-right:10px;}
}*/

/*
.mainSlogan{overflow: visible;width:100%; background:var(--point-color);}
.mainSlogan .cont_wrap{width:100%; min-height:500px;}
.mainSlogan .cont_wrap ul{position:relative;display:flex;justify-content:center;align-items:center;width:100%; }
.mainSlogan .cont_wrap.on ul:after{animation:bar_left_ani 0.9s ease-in forwards}
.mainSlogan .cont_wrap.on ul:before{animation:bar_right_ani 0.9s ease-in forwards;animation-delay:1.2s}
.mainSlogan .cont_wrap ul li{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center;width:350px;height:350px;padding:0 50px;border-radius:50%;}
.mainSlogan .cont_wrap ul li:first-child{z-index:1;right:-50px}
.mainSlogan .cont_wrap ul li:nth-child(2){z-index:2}
.mainSlogan .cont_wrap ul li:last-child{z-index:3;left:-50px}
.mainSlogan .cont_wrap ul li h3{font-size:30px;font-weight:700;font-family:var(--e-font);text-align:center;color:#fff}
.mainSlogan .cont_wrap ul li p{margin-top:40px;font-size:20px;font-weight:700;text-align:center;color:rgb(255, 255, 255, 0.6)}
.mainSlogan .cont_wrap ul li svg{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:350px;height:350px}
.mainSlogan .cont_wrap ul li svg path {stroke-width:1.2;fill:none;stroke-dasharray:610px;stroke-dashoffset:610px;stroke:#fff}
.mainSlogan .cont_wrap.on ul li svg path {animation:stroke_ani 0.9s ease-in forwards}
.mainSlogan .cont_wrap ul li:nth-child(1) svg path{animation-delay:0.5s}
.mainSlogan .cont_wrap ul li:nth-child(2) svg path{animation-delay:0.75s}
.mainSlogan .cont_wrap ul li:nth-child(3) svg path{animation-delay:1s}

.cont_wrap .title h3{color:#fff; font-size:38px;}

@keyframes stroke_ani {0% {stroke-dashoffset:610px}100% {stroke-dashoffset:0}}
@keyframes bar_left_ani{0%{left:-40%} 100%{left:-10%}}
@keyframes bar_right_ani{0%{right:25%;opacity:0;} 100%{right:-10%;opacity:1}}

@media(max-width:1080px){
.mainSlogan .cont_wrap ul li{width:300px;height:300px}
.mainSlogan .cont_wrap ul li svg{width:100%;height:100%}
.mainSlogan .cont_wrap ul li h3{margin-bottom:10px;font-size:20px}  
.mainSlogan .cont_wrap ul li p{margin:0;font-size:14px;font-weight:600}
}
@media(max-width:768px){
}*/

/*푸터 부분*/
.footer-logo, .foot_certify, .copyright{-webkit-user-select:none; /* Chrome, Safari, Opera */  -moz-user-select: none; /* Firefox */  -ms-user-select: none; /* Internet Explorer/Edge */  user-select: none; /* Standard */}

/*카테고리 상품 진열 부분*/
.item_gallery_type .item_cont{display:flex; flex-direction:column; height:100%;}
.item_gallery_type .item_photo_box{width:100%; aspect-ratio:1 / 1; position:relative; overflow:hidden;}
.item_gallery_type .item_photo_box img{width:100%; height:100%; object-fit:cover;}
.item_gallery_type .item_tit_box .item_name{display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden; line-height:1.4;}

/* 소형 모바일 */
@media (max-width:480px){
    .goods_list_cont ul li{width:100% !important;}
}

/*회원가입*/
.body-join #container{background:#f1f1f1;}
.body-member .location_wrap .location_cont{display:none;}
.body-join .content_box{max-width:800px; background:#fff; margin:30px auto 0; float:none; padding:40px; border-radius:5px;}

.join_agreement_wrap, .base_info_box{font-size:18px;}
.shop_mall_join {border:1px solid var(--point-color); color:var(--point-color); font-size:18px; border-radius:50px; font-weight:bold;}
.shop_mall_join:hover{background:var(--point-color); color:#fff; transition:all 0.3s ease; border:1px solid var(--point-color);}

.sub_content{margin-top:70px;}

.form_element label.check_s{font-size:16px;}

#btnNextStep, .js_btn_join{background:var(--point-color)!important; border-radius:5px;}
#btnPrevStep, .btn_member_cancel{border-radius:5px;}

/*정보 입력*/
.body-join-method #container{background:#f7f7f7;}

/*회원가입 완료*/
.body-join-ok #container{background:#f7f7f7;}

/*로그인*/
.body-login .location_wrap .location_cont{display:none;}
.body-login #container{background:#f7f7f7;}
.member_login_order_btn{-webkit-user-select:none; /* Chrome, Safari, Opera */  -moz-user-select: none; /* Firefox */  -ms-user-select: none; /* Internet Explorer/Edge */  user-select: none; /* Standard */}
.member_cont .member_login_box .login_input_sec button, .member_login_order_btn{background-color:var(--point-color) !important; border-radius:10px;}
.member_sns_login{text-align:center;}
.member_sns_login img{width:100%; height: auto; margin:0 auto; object-position: center; object-fit: cover;}
.member_cont .btn_login_box li{}
.btn_member_join, .btn_member_white{width:auto; padding:0 20px;}
#loginId, #loginPwd{border-radius:50px;}

#btnJoinMember, #btnFindId{border-right:1px solid #dcdcdc;}

/*마이페이지*/
.body-mypage #container {max-width:1280px;}
.body-mypage .location_wrap .location_cont{display:none;}
.sub_content .content{text-align:center;}
.sub_content .content h2{font-weight:bold; font-size:24px; margin-bottom:20px;}
.mypage_table_type .pick_add_cont .pick_add_info em{word-break: keep-all;}
.mypage_table_type{word-break: keep-all;}

.pick_add_info .caution_msg1{background-position:left center; background-size:13px;}

/*주문서*/
.body-order #container {background:#f7f7f7; padding-top:80px;}
.body-order #contents {max-width:1280px; border-radius:10px;}
.body-order .location_wrap .location_cont{display:none;}

.mypage_main .item_photo_box a > img{width: 100%; aspect-ratio: 1 / 1;}

/*장바구니*/
.body-cart #container {background:#f7f7f7; padding-top:0px;}

/*board*/
.body-board #container{max-width:1280px; margin-top:30px;}
.body-board .location_wrap .location_cont{display:none;}
.body-goods-list #container{max-width:1280px;}
.body-write .content{max-width:800px; margin:0 auto;}

/*쿠폰존*/
.body-event .location_wrap .location_cont{display:none;}
.body-couponzone #container{max-width:1280px;}

/*상세페이지*/
.item_goods_sec center img{width:100%; max-width:860px; object-position: center; object-fit: cover;}

/*구매 페이지*/
.body-goods .option_total_display_area{margin-top:15px;}
.body-goods-view .option_total_display_area{margin-top:0px;}
.order_cont .btn_left_box .shop_go_link{border:none !important; margin-top:15px;}

/*이벤트*/

/*고객 센터*/
.body-service #container{max-width:1280px;}
.body-service .location_wrap .location_cont{display:none;}
.body-service .side_cont .info_box dt{background:none;}
.body-service .side_cont .sub_menu_box .sub_menu a{padding-left:0;}
.body-service .side_cont .info_box{padding-left:0; width:180px;}
.body-service .side_cont .sub_menu_box h2{border:none;}

/*chosen*/
.chosen-container .chosen-results {width:100%; padding:0 4px;}

/*달력*/
.bootstrap-datetimepicker-widget {
    z-index: 99999 !important;
}

.bootstrap-datetimepicker-widget.dropdown-menu {
    width: 280px;
}

/*브랜드*/
.body-brand .location_wrap .location_cont{display:none;}

/*리뉴얼 알림*/
.body-NDJoinBene #contents{max-width:880px; padding:0 0 70px 0; background:#f7f7f7; margin-top:50px;}

.JB_wrap{text-align:center;}

.JB_box1{background:url(/data/skin/front/verde/img/custom/bene_BG.png) no-repeat top; padding:70px 5px 85%; background-size:100%;}
.JB_box1 p{font-size:42px; font-weight:600;}
.JB_box1 p span{font-weight:800; }
.JB_box1 h2{font-size:108px; font-weight: 800; color: var(--point-color); margin: 5px 0 10px;}
.JB_box1 h2 span{display:block; margin-top:-25px;}
.JB_box1 img{display:block; margin:0 auto;}

.JB_beneBox .round_title{padding:2px 60px; background:#1b1b1b; display:inline-block; font-size:24px;  color:#fff; border-radius:50px; font-weight:600; margin-bottom:30px;}
.JB_beneBox .green_title{font-size:68px; color:var(--point-color); font-weight:800;}
.JB_beneBox p{font-size:38px; font-weight:500; margin-bottom:40px;}
.JB_beneBox p span{font-weight:700;}
.JB_beneBox img{width:50%;}

.JB_box2 .threePoint ul{display:inline-block; margin:30px auto; background:#fff; border-radius:10px; padding:30px 70px;
	box-shadow:rgb(14 126 90 / 5%) 0px 0px 0px 1px, rgb(42 69 62 / 5%) 0px 1px 1px -0.5px, rgb(42 70 60 / 5%) 0px 8px 3px -1.5px, rgb(42 70 61 / 5%) 8px 7px 6px -3px, rgb(14 126 95 / 5%) 0px 12px 12px -6px, rgb(14 126 90 / 5%) 0px 24px 24px -12px;}
.JB_box2 .threePoint ul li{font-size:30px; font-weight:500;}
.JB_box2 .threePoint ul li span{font-weight:700;}
.JB_box2 .threePoint ul li::after{content:''; display:block; background:url(/data/skin/front/verde/img/custom/bene_plus.svg) center no-repeat;
    width:32px; height:32px; margin:0 auto; background-size:20px;}
.JB_box2 .threePoint ul li.point_e::after{display:none;}

.JB_box3{margin:50px 0;}
.JB_box3::before{display:block; content:''; border:1px solid #ccc; width:80%; margin:0 auto 70px}
.JB_box3::after{display:block; content:''; border:1px solid #ccc; width:80%; margin:70px auto;}
.JB_box3 .recomPoint{display:inline-block; margin:30px auto; background:#fff; border-radius:10px; padding:50px 30px; max-width:480px;
	box-shadow:rgb(14 126 90 / 5%) 0px 0px 0px 1px, rgb(42 69 62 / 5%) 0px 1px 1px -0.5px, rgb(42 70 60 / 5%) 0px 8px 3px -1.5px, rgb(42 70 61 / 5%) 8px 7px 6px -3px, rgb(14 126 95 / 5%) 0px 12px 12px -6px, rgb(14 126 90 / 5%) 0px 24px 24px -12px;}
.JB_box3 p span{display:block;}
.JB_box3 .recomPoint h3{font-size:32px; font-weight:700; color:var(--point-color); margin-bottom:15px; display:flex; justify-content:center; align-items:center; gap:7px;}
.JB_box3 .recomPoint h3::before{content:''; display:inline-block; background:url(/data/skin/front/verde/img/custom/bene_notice_ico.svg) no-repeat center; width:28px; height:28px; background:size:100%;}
.JB_box3 .recomPoint img{width:100%;}
.JB_box3 ul{text-align:left; margin:0 auto; display:inline-block;}
.JB_box3 ul li{font-weight:600; font-size:18px;}
.JB_box3 ul li span{display:block; margin-left:15px;}

.JB_box4 .coupon_two{display: flex; gap: 15px; justify-content: center; align-items: center; width: 60%; margin: 0 auto;}
.JB_box4 .threePoint{display:inline-block; margin:50px auto 20px; background:#fff; border-radius:10px; padding:40px 100px; max-width:480px; 
	box-shadow:rgb(14 126 90 / 5%) 0px 0px 0px 1px, rgb(42 69 62 / 5%) 0px 1px 1px -0.5px, rgb(42 70 60 / 5%) 0px 8px 3px -1.5px, rgb(42 70 61 / 5%) 8px 7px 6px -3px, rgb(14 126 95 / 5%) 0px 12px 12px -6px, rgb(14 126 90 / 5%) 0px 24px 24px -12px;}
.JB_box4 .threePoint p{margin-bottom:0;}
.JB_box4 .threePoint p span{display:block;}
.JB_box4 .threePoint+p{font-weight:600; font-size:18px; margin:0;}

.JB_wrap .new_join_btn{margin:50px 50px 0;}
.JB_wrap .new_join_btn a{display: block; background: var(--point-color); border-radius: 20px; color: #fff; padding: 30px; font-weight: 700; font-size: 32px;}
.JB_wrap .new_join_btn a:hover{transition: all 0.3s ease;
	box-shadow:rgb(14 126 90 / 5%) 0px 0px 0px 1px, rgb(42 69 62 / 5%) 0px 1px 1px -0.5px, rgb(42 70 60 / 5%) 0px 8px 3px -1.5px, rgb(42 70 61 / 5%) 8px 7px 6px -3px, rgb(14 126 95 / 5%) 0px 12px 12px -6px, rgb(14 126 90 / 5%) 0px 24px 24px -12px;}

@media(max-width:880px){
	.JB_box1{padding:70px 5px 95%;}
	.JB_box1 h2{font-size:78px;}
	.JB_box4 .coupon_two{width:80%;}
}
@media(max-width:650px){
	.JB_box1 h2{font-size:68px;}
	.JB_box1 p{font-size:38px;}
	.JB_box1{padding:70px 5px 85%;}
}
@media(max-width:575px){
	.JB_box1 h2{font-size:58px;}
	.JB_box1 h2 span{margin-top:-15px;}
	.JB_box1 p{font-size:30px;}
	.JB_box1{padding:70px 5px 80%;}

	.JB_beneBox .green_title{font-size:48px;}
	.JB_beneBox p{font-size:28px;}

	.JB_box2 .threePoint ul{padding:30px; margin:30px; display:block;}
	.JB_box2 .threePoint ul li{font-size:28px;}

	.JB_box3{margin:70px 0 50px;}
	.JB_box3 .recomPoint{margin:30px; display:block; max-width:none;}
	.JB_box3 ul{margin:0 30px;}
	.JB_box3 ul li{font-size:16px;}

	.JB_box4 .threePoint{max-width:none; margin:30px; display:block;}

	.JB_wrap .new_join_btn{margin:50px 30px 0;}
}