@charset "utf-8";

/*
	[디자인팀 맞춤제작 및 수정 CSS]

	copyright(c) 상상너머·원데이넷 all rights reserved.
	허용된 라이센스이외 무단도용재배포를 금합니다.
	본 소스는 모두 (주)상상너머의 지적 재산이며, 이에 대해 무단도용 및 수정 재배포/재편집등을 절대 금하며 적발 시 법적 대응을 할 것임을 경고합니다.

	※ css 추가 시, 반드시 날짜와 작업자 이니셜을 기재바랍니다.

	===============================================================================
	반응형으로 제작되어 임의적인 CSS추가는 문제가 될 수 있으니 디자인팀과 반드시 상의바랍니다.
	===============================================================================
*/

/* 달력옵션 품절추가 */
.p_Vcalendar .calendar li {position:relative;}
.p_Vcalendar .day {padding:8px;}
.p_Vcalendar .no .soldout {position:absolute; left:50%; bottom:-5px; font-size:11px; color:#999; transform:translateX(-50%);}


/* 선물하기 전달 ========================================= */
.Gift_Order {display:flex; justify-content:flex-start; align-items:stretch; flex-direction:column; box-sizing:border-box; padding:12px; overflow-y:auto; background:#e0e0ec; height:100%;}
.Gift_Order .wrapping {background:#fff; border-radius:20px; margin:0 auto; width:100%; box-sizing:border-box; flex:1; display:flex; justify-content:flex-start; align-items:stretch; flex-direction:column;}
.Gift_Order .wrapping {overflow:hidden; max-width:420px;}
.Gift_Order .content {flex:1; display:flex; justify-content:flex-start; align-items:stretch; flex-direction:column; overflow-y:auto; padding:15px;}
.Gift_Order .content::-webkit-scrollbar {display:none;}
.Gift_Order .bottom_ctrl {flex:none;}
.Gift_Order .bottom_ctrl .btn_view {background:#0065e3; color:#fff; display:flex; justify-content:center; align-items:center; flex-direction:column; height:60px; font-size:17px; font-weight:600; text-align:center;}
.Gift_Order .bottom_ctrl .btn_view {flex:1; box-sizing:border-box; position:relative;}
.Gift_Order .bottom_ctrl .btn_view.type_none {background:#0065e34d; cursor:default;}

.Gift_Order .user_info {border-bottom:2px dashed #e0e0ec; position:relative; padding:15px;}
.Gift_Order .user_info .btn_back {position:absolute; right:10px; top:10px; z-index:2; width:40px; height:40px; background:transparent url('../images/c_img/ic_close_sm.svg') center center / 13px no-repeat;}
.Gift_Order .user_info .greeting {font-size:19px; font-weight:600; color:#000; font-weight:600; color:#000;}
.Gift_Order .user_info .comment {font-size:13px; font-weight:500; color:#999; margin-top:4px;}
.Gift_Order .user_info .letter {margin-top:10px; padding:12px 15px; background:#e0e0ec66; border-radius:15px; font-size:13px; color:#999;}
.Gift_Order .user_info .message {color:#000; font-weight:500; line-height:1.35; font-size:14px; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:2; -webkit-box-orient:vertical; display:-webkit-box;}
.Gift_Order .user_info .message {position:relative; max-height:110px; padding-right:15px;}
.Gift_Order .user_info .message::-webkit-scrollbar-thumb {background-color:#ccc !important; border-radius:100px;}
.Gift_Order .user_info .message:after {content:""; width:10px; height:10px; position:absolute; right:0; top:24px; z-index:1; background:transparent url('../images/c_img/arrow_down.svg') center center / 10px 7px no-repeat;}
.Gift_Order .user_info .letter.if_view .message {-webkit-line-clamp:initial; overflow-y:auto;}
.Gift_Order .user_info .letter.if_view .message:after {display:none;}
.Gift_Order .user_info .from {margin-top:8px; line-height:1; font-size:13px; font-weight:500; color:#888;}
.Gift_Order .user_info:before {content:""; width:20px; height:20px; background:#e0e0ec; border-radius:100px; position:absolute; left:-10px; bottom:-11px;}
.Gift_Order .user_info:after {content:""; width:20px; height:20px; background:#e0e0ec; border-radius:100px; position:absolute; right:-10px; bottom:-11px;}

.Gift_Order .gift_deny {margin-top:30px;}
.Gift_Order .gift_deny ul {display:flex; justify-content:center; align-items:center; flex-direction:row; gap:8px; }
.Gift_Order .gift_deny li {flex:1;}
.Gift_Order .gift_deny .comment {font-size:15px; font-weight:500; color:#000; margin-bottom:8px;}
.Gift_Order .gift_deny .btn_action {background:#fff; color:#333; display:flex; justify-content:center; align-items:center; flex-direction:row; height:40px; font-size:12px; font-weight:500; border-radius:8px; padding:0 15px; }
.Gift_Order .gift_deny .btn_action {border:1px solid #5d5d5f; gap:4px; line-height:1;}
.Gift_Order .gift_deny .btn_action img {height:13px; display:block;}

.Gift_Order .about_item {display:flex; justify-content:center; align-items:center; flex-direction:column; position:relative; text-align:center; padding:15px;}
.Gift_Order .about_item .thumb {overflow:hidden; width:170px; border-radius:25px; flex:none; aspect-ratio:1/1;}
.Gift_Order .about_item .thumb img {width:100%; height:100%; object-fit:cover;}
.Gift_Order .about_item .info {margin-top:10px; font-size:13px; font-weight:500; max-width:280px;}
.Gift_Order .about_item .item_name {color:#000; font-weight:500; font-size:15px; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:2; -webkit-box-orient:vertical; display:-webkit-box; line-height:1.3;}
.Gift_Order .about_item .additional {color:#aaa; margin-top:4px; display:flex; justify-content:center; align-items:center; flex-direction:row; gap:5px; font-size:14px;}
.Gift_Order .about_item .option {color:#bbb; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:1; -webkit-box-orient:vertical; display:-webkit-box;}
.Gift_Order .about_item .volumn {color:#59a3ff; flex:none}
.Gift_Order .about_item .option+ .volumn:before {content:"x ";}

.Gift_Order .form_list {}
.Gift_Order .form_list ul {border-top:1px dashed #e0e0ec; padding-top:15px;}
.Gift_Order .form_list li {position:relative; display:flex; justify-content:flex-start; align-items:center; flex-direction:row; flex-wrap:wrap; gap:5px}
.Gift_Order .form_list li+ li {margin-top:10px;}
.Gift_Order .form_list ul.after_save {border:1px dashed #e0e0ec; padding:15px;}
.Gift_Order .form_list input,
.Gift_Order .form_list select,
.Gift_Order .form_list textarea {border-radius:10px !important; font-size:14px; font-weight:500; flex:1; height:50px; resize:none;}
.Gift_Order .form_list input.input_design {padding-left:65px;}
.Gift_Order .form_list .c_select {flex:1;}
.Gift_Order .form_list input.input_design:focus {z-index:1}
.Gift_Order .form_list input.input_design:not(:placeholder-shown) {background:#0065e312; border-color:#0065e366; z-index:2}
.Gift_Order .form_list input.input_design:not(:placeholder-shown)+ .labeling {opacity:0.3;}
.Gift_Order .form_list textarea.text_design:not(:placeholder-shown) {background:#0065e312; border-color:#0065e366; z-index:2}
.Gift_Order .form_list textarea.text_design {width:100%; flex:none; height:auto;}
.Gift_Order .form_list .btn_upper {position:absolute; right:10px; background:#0065e366; color:#fff; border-radius:100px; line-height:1; font-size:12px; font-weight:600; height:30px; padding:0 10px;}
.Gift_Order .form_list .labeling {position:absolute; pointer-events:none; left:12px; font-weight:500; z-index:2; color:#333;}
.Gift_Order .form_list .btn_upper {position:absolute; right:10px; background:#0065e366; color:#fff; border-radius:100px; line-height:1; font-size:12px; font-weight:600; height:30px; padding:0 10px;}
.Gift_Order .form_list .btn_upper {display:flex; justify-content:center; align-items:center; flex-direction:column; z-index:2}
.Gift_Order .form_list .set_address {margin-top:-1px;}
.Gift_Order .form_list .address_code input.input_design {border-bottom-left-radius:0px !important; border-bottom-right-radius:0px !important;}
.Gift_Order .form_list .address_default input.input_design {border-radius:0px !important;}
.Gift_Order .form_list .address_detail input.input_design {border-top-left-radius:0px !important; border-top-right-radius:0px !important;}

.Gift_Order .guide_tip {margin-top:10px; padding:15px; background:#e0e0ec66; border-radius:10px; display:flex; justify-content:center; align-items:flex-start; flex-direction:column; gap:3px;}
.Gift_Order .guide_tip .bullet {position:relative; padding-left:8px; font-size:11px; color:#888; }
.Gift_Order .guide_tip .bullet:before {content:""; position:absolute; left:0; top:5px; width:3px; height:3px; background:#ccc; border-radius:100px;}

.Gift_Order .error_page {padding:30px 20px; display:flex; justify-content:center; align-items:center; flex-direction:column; text-align:center;}
.Gift_Order .error_page .title {font-size:20px; font-weight:600; color:#000; font-weight:600; color:#000;}
.Gift_Order .error_page .highlight {color:#0065e3; font-size:14px; font-weight:500; margin-top:10px;}
.Gift_Order .error_page .comment {font-size:13px; font-weight:500; color:#999; margin-top:20px; line-height:1.4;}

.Gift_Order.if_error {justify-content:center; align-items:center; padding:30px;}
.Gift_Order.if_error .wrapping {flex:none; background:rgba(255,255,255,0.5);;}


/* 모달 레이어 ========================================= */
.LayerModal {position:fixed; left:0; top:0; width:100%; height:100%; z-index:103; box-sizing:border-box; padding:30px; display:flex; justify-content:center; align-items:stretch; flex-direction:column; visibility:hidden}
.LayerModal .wrapping {position:relative; z-index:2; background:#fff; border-radius:30px; text-align:center; box-sizing:border-box; opacity:0; width:100%; max-width:400px; margin:0 auto;}
.LayerModal .bg_close {position:absolute; left:0; top:0; z-index:1; width:100%; height:100%; background:rgba(0,0,0,0.7); transition:all 0.3s ease-out; -webkit-transition:all 0.3s ease-out; opacity:0; pointer-events:none;}
.LayerModal .inner_content {padding:25px 15px}
.LayerModal .ctrl_button {display:flex; justify-content:center; align-items:center; flex-direction:row; gap:10px; padding:15px; padding-top:0px;}
.LayerModal .ctrl_button .btn_ctrl {background:#0065e3; color:#fff; display:flex; justify-content:center; align-items:center; flex-direction:column; height:50px; font-size:16px; font-weight:600; text-align:center; flex:1}
.LayerModal .ctrl_button .btn_ctrl {border:1px solid #0065e3; border-radius:16px;}
.LayerModal .ctrl_button .btn_ctrl.line {background:#fff; color:#0065e3; flex:none; padding:0 15px;}
.LayerModal .ctrl_button .btn_ctrl.only {flex:1}
.LayerModal .alert_comment {}
.LayerModal .alert_comment dt {color:#000; font-weight:700; font-size:19px;}
.LayerModal .alert_comment dd {font-size:14px; font-weight:500; line-height:1.45; color:#666; margin-top:15px;}
.LayerModal .alert_comment .highlight {color:#0065e3; margin-bottom:10px; font-size:15px; font-weight:500; margin-top:5px;}
.LayerModal.if_open {visibility:visible}
.LayerModal.if_open .bg_close {opacity:1; pointer-events:initial}
.LayerModal.if_open .wrapping {opacity:1; animation:mv_modal_show 0.3s ease; -webkit-animation:mv_modal_show 0.3s ease; animation-fill-mode:forwards; -webkit-animation-fill-mode:forwards}

@keyframes mv_modal_show {
    0% {opacity:0; transform:scale(0.7); -webkit-transform:scale(0.7);}
    50% {opacity:1; transform:scale(1.1); -webkit-transform:scale(1.1);}
    100% {opacity:1; transform:scale(1.0); -webkit-transform:scale(1.0);}
}



/* 간편가입 추가 ========================================= */
.NewJoin .layout_fix {max-width:500px;}
.NewJoin .c_form .form_ul+ .form_ul {border-top:0; padding-top:0; margin-top:0px;}
.NewJoin .c_form .form_ul.this_all {border-bottom:1px solid #eee; padding-bottom:10px; margin-bottom:10px;}
.NewJoin .c_form .form_dt {display:none;}
.NewJoin .c_form .form_dl {border-bottom:0; padding:0px; margin-bottom:15px; position:relative;}
.NewJoin .form_section.step_auth {margin-top:20px;}
.NewJoin .upper_stuff {position:absolute; right:10px; height:100%; display:flex; justify-content:center; align-items:center; flex-direction:row; gap:5px}
.NewJoin .upper_stuff .c_btn {border-radius:100px;}
.NewJoin .input_design {border-radius:10px; height:50px;}
.NewJoin .btn_fake_select {border-radius:10px; height:50px; display:flex; justify-content:flex-start; align-items:center; flex-direction:row; box-sizing:border-box; padding:0 15px; border:1px solid #e5e5e5; font-weight:500;}
.NewJoin .btn_fake_select:after {content:""; width:15px; height:15px; position:absolute; right:15px; background:transparent url('../images/c_img/arrow_down.svg') center center / 11px no-repeat;}