@charset "utf-8"; /* 메인 슬라이드 */ .dafl_main_top_banner_wrap {width: 1250px; padding: 2.5rem 1rem; margin: 0 auto; border-radius: 1.25rem; overflow: hidden;} .dafl_main_top_banner_wrap > div {box-shadow: 3px 3px 4px rgba(0,0,0,0.3); border-radius: 1rem; overflow: hidden;} .dafl_main_top_banner_wrap ul > li > .layout_dafl_main_banner_img_wrap {width: 100%; height: 0; padding-bottom: 23%; position: relative; display: block;} .dafl_main_top_banner_wrap ul > li > .layout_dafl_main_banner_img_wrap:hover {opacity: 1; filter: brightness(1.05);} .dafl_main_top_banner_wrap ul > li > .layout_dafl_main_banner_img_wrap > img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; object-fit: cover; border-radius: 1.25rem;} .dafl_main_top_banner_wrap ul > li.zoom_in.swiper-slide-active > div > img {transform: translate(-50%, -50%) scale(1.25); transition: all 10s ease-out;} .dafl_main_top_banner_wrap ul {display: flex;} .dafl_main_top_banner_wrap ul > li:not(.zoom_in) img {display: none;} .dafl_main_top_banner_wrap .swiper-container-initialized ul > li img {display: block; -webkit-user-drag: none; -khtml-user-drag: none; -moz-user-drag: none; -o-user-drag: none; } .dafl_main_top_banner_wrap .swiper-container-initialized ul > li > a {touch-action: none; -webkit-user-drag: none; -khtml-user-drag: none; -moz-user-drag: none; -o-user-drag: none; } .layout_dafl_main_banner_text {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: transparent; font-size: 3rem; width: 100%; text-align: center; line-height: 5rem; font-weight: 500; text-shadow: -1px 0px #fff, 0px 1px #fff, 1px 0px #fff, 0px -1px #fff;} /* 메인페이지 상단 버튼 */ .main-section-body {padding: 2rem 1rem;} #layout_top_banner_wrap > ul > li:first-child {position: relative;} #layout_top_banner_wrap > ul > li:first-child > div {width: 90%; position: absolute; bottom: 0;} #layout_top_banner_wrap > ul > li:first-child > div span {display: flex; justify-content: space-between; align-items: center;} #layout_top_banner_wrap > ul > li:first-child > div span > i {margin-right: 0 !important;; font-size: 1.75rem !important; color: #000 !important;} #layout_top_banner_wrap > ul > li:first-child .card.h-100 dl > dd {padding: 0.5rem 1.5rem 1rem;} #layout_top_banner_wrap > ul > li:first-child .card.h-100 dl > dd > .row:first-child {border-bottom: 1px solid #d9d9d9;} #layout_top_banner_wrap > ul > li:first-child .card.h-100 dl > dd > .row:last-child {margin-top: -1px;} #layout_top_banner_wrap > ul > li:first-child .card.h-100 dl > dd > .row > .col-6 {padding: 0;} #layout_top_banner_wrap > ul > li:first-child .card.h-100 dl > dd > .row > .col-6:first-child {border-right: 1px solid #d9d9d9;} #layout_top_banner_wrap > ul > li:first-child .card.h-100 dl > dd > .row > .col-6:last-child {margin-left: -1px;} #layout_top_banner_wrap > ul > li:first-child .card.h-100 dl > dd > .row > .col-6 > a {padding: 1rem; font-size: 1.25rem; font-weight: 700;} #layout_top_banner_wrap > ul > li:first-child .card.h-100 dl > dd > .row > .col-6 > a:hover, #layout_top_banner_wrap > ul > li:first-child .card.h-100 dl > dd > .row > .col-6 > a:focus {color: #3366b9; background-color: #3366b91a;} #layout_top_banner_wrap .card {border-radius: 1rem; overflow: hidden; box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2); background-color: transparent; text-align: left;} #layout_top_banner_wrap .card:hover:not(.h-100) {transform: translateY(-5px); transition: all 0.25s; box-shadow: 0px 2px 3px 2px rgba(0,0,0,0.2);} #layout_top_banner_wrap .card:hover:not(.h-100) .card-body {filter: brightness(1.15); background-color: #3366b91a;} #layout_top_banner_wrap .card-body {background-color: #ffffff80; padding: 1rem 1.5rem;} #layout_top_banner_wrap a:hover, #layout_top_banner_wrap a:focus {opacity: 1;} #layout_top_banner_wrap .row {margin-left: -0.5rem; margin-right: -0.5rem;} #layout_top_banner_wrap .row > * {padding-left: 0.5rem; padding-right: 0.5rem;} #layout_top_banner_wrap a >.card > .card-body {padding: 0.75rem 2rem;} #layout_top_banner_wrap a > .card > .card-body > span {font-size: 1.375rem;} #layout_top_banner_wrap a > .card > .card-body > span > i {color: #3366b9; margin-right: 1.25rem; font-size: 1.75rem;} #layout_top_banner_wrap a > .card > .card-body > span > em {font-weight: 700;} #layout_top_banner_wrap a:hover > .card > .card-body > span > em {color: #3366b9;} #layout_top_banner_wrap dl {margin-bottom: 0;} #layout_top_banner_wrap dl > dt {font-size: 1.25rem;} #layout_top_banner_wrap dl > dt > span {font-size: 0.9rem; color: #3366B9;} #layout_top_banner_wrap dl > dd {font-size: 0.9rem;} #layout_top_banner_wrap > dl > dt {font-size: 2rem;} #layout_top_banner_wrap > dl > dd {margin-top: 1.5rem;} .layout_top_banner_btn_lst {display: flex; justify-content: space-between; gap: 1.5rem;} .layout_top_banner_btn_lst > li {flex: 1;} .layout_top_banner_btn_lst > li > a {display: block;} .layout_top_banner_btn_lst > li > a > div {display: block; width: 150px; height: 150px; position: relative; background-color: #fff; border-radius: 50%; overflow: hidden; box-shadow: 2px 2px 3px rgba(0,0,0,0.15);} .layout_top_banner_btn_lst > li > a > div > img {display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 80%; height: 80%; object-fit: contain;} .layout_top_banner_btn_lst > li > a > p {font-size: 1.25rem; text-align: center; font-weight: 500; margin-top: 0.5rem; width: 150px;} .layout_top_banner_btn_lst > li > a:hover > div > img {transform: translate(-50%, -50%) scale(1.5); transition: all 0.3s ease-in-out;} .layout_top_banner_btn_lst > li > a:hover > p {font-weight: bold;} /* 메인 고객 만족 평가 */ .main_cus_satft_eval_form_wrap {margin-top: 2rem; margin-bottom: 1.5rem;} .main_cus_satft_eval_form {background-image: url("/common/css/images/cus_satft_eval_img.png"); width: 100%; height: 175px; position: relative; box-shadow: 3px 3px 3px rgba(0,0,0,0.2); background-repeat: no-repeat; background-position-x: -5rem; background-position-y: center; background-color: #f2f2f2;} .main_cus_satft_eval_form > .main_cus_satft_eval_cont {width: 65%; position: absolute; top: 50%; left: 54%; transform: translate(-50%, -50%);} .main_cus_satft_eval_form > .main_cus_satft_eval_cont > p {font-size: 1.5rem; font-weight: 300;} .main_cus_satft_eval_star_point {color: #ddd;} .main_cus_satft_eval_star_point_checked {position: absolute; top: 0; left: 0; color: #ffbc00; width: 100%; overflow: hidden; white-space: nowrap;} .main_cus_satft_eval_btn {border-radius: 2rem; padding: 0.375rem 1.25rem; background-color: #8a8a8a; color: #fff;} .main_cus_satft_eval_btn_wrap {position: absolute; top: 50%; right: 0; transform: translate(50%, -50%);} .keep_mngt_apl_fn {margin: 2rem auto 0; width: 65%;} .make_qust_apl_fn {margin: 2rem auto 0; width: 45%;} .keep_mngt_apl_fn .card > .card-body, .make_qust_apl_fn .card > .card-body {background-color: #fff;} .keep_mngt_apl_fn .card > .card-body > h4 + p, .make_qust_apl_fn .card > .card-body > h4 + div {margin-top: 2rem;} .COMMON_MAIN_LEFT_BANNER_WRAP {width: 1250px; margin: 0 auto;} .COMMON_MAIN_LEFT_BANNER {position: absolute; z-index: 10; top: 890px; margin-left: -270px; box-shadow: 0 0 3px rgba(0,0,0,20%);} .COMMON_MAIN_LEFT_BANNER_IMG {width: 160px; height: 600px; background-size: contain; background-repeat: no-repeat;} @media (max-width: 1800px) { .COMMON_MAIN_LEFT_BANNER_WRAP {display: none;} } .login_type > div {width: 100px; margin: 0 auto; text-align: left;} .login_type > div > span {vertical-align: sub; margin-left: 0.25rem;} /* 메인페이지 공통 타이틀 */ .main-section-body > dl {margin-bottom: 0;} .main-section-body > dl > dt {font-size: 1.75rem;} .main-section-body > dl > dd {margin-top: 0.5rem;} /* 메인 - 상품 구매 */ .main_prd_lst {display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.75rem; grid-auto-rows: 1fr;} .main_prd_lst .card {height: 100%;} .main_prd_lst .card > .card-body {padding: 1.25rem 1.25rem 3rem; height: 100%;} .main_prd_lst .card > .card-body a.btn {position: absolute; bottom: 1.25rem; left: 1.25rem;} .main_body .dnt_prd_lst_img_wrap {background-color: #fff; border-radius: 50%; width: 40%; padding-bottom: 40%; height: 0; overflow: hidden; box-shadow: 2px 2px 3px rgba(0,0,0,0.15);} .main_body .dnt_prd_lst_img_wrap > img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 85%; height: 85%; object-fit: contain;} .main_body .dnt_prd_lst_img_wrap:before, .main_body .dnt_prd_lst_img_wrap:after {z-index: 1;} .main_body .dnt_prd_lst_cont > dl {margin-top: 0.5rem;} .main_body .dnt_prd_lst_cont > dl > dt {font-size: 1.25rem;} .main_body .dnt_prd_lst_cont > dl > dd {margin-top: 0.25rem;} .dafl_badge + .dafl_badge {margin-left: 0.25rem;} .dafl_badge {padding: 0.25rem 0.35rem; font-size: 0.75rem; font-weight: bold; position: relative; z-index: 1;} .dafl_badge.dafl_sharp_prd {border: 1px solid #162b7d; color: #162b7d; background-color: #f3f6ff;} .dafl_badge.dafl_prd {border: 1px solid #09c7c7; background-color: #ecffff; color: #09c7c7;} .dafl_badge.eco_prd {border: 1px solid #2cb12c; color: #2cb12c; background-color: #f2fff2;} /* 최근 설치 내역 */ .layout_dafl_board_title > h5 {font-weight: bold;} /* 메인 - 고객 리뷰 */ .usr_rvw_point_wrap dl {margin-bottom: 0;} .main_body .usr_rvw_form_top_left_form {width: 250px; text-align: center;} /* 메인 - 하단배너 */ #layout_dafl_bottom_banner_wrap a {box-shadow: 0px 0px 4px rgba(0,0,0,0.35);} /* 배송지 검색 팝업 */ .divy_plac_srch_popup {position: fixed !important; top: 20% !important;} .cmn_srch_addr_item_wrap .cmn_srch_addr_item {border-top: 1px solid #dbdbdb;} .cmn_srch_addr_item_wrap .cmn_srch_addr_item:hover > div > .text-secondary {background-color: #318989; color: white !important; cursor: pointer;} .cmn_srch_addr_item_wrap .cmn_srch_addr_item:hover > div > span span.text-primary {color: #ff885f !important;} .cmn_srch_addr_item_wrap .cmn_srch_lst_wrap {overflow-y: scroll; height: 250px;} .cmn_srch_addr_item_wrap .cmn_srch_addr_item:hover {background-color: #318989;color: white !important;cursor: pointer;} /* 22.11.29 다플 요청사항 */ .divy_tm_det_guid_btn_wrap {position: relative;} .divy_tm_det_guid_btn_wrap ul > li, .divy_tm_det_guid_btn_wrap ul > li span {font-size: 1rem;} .divy_tm_det_guid_btn_wrap li > strong {vertical-align: 2px;} .divy_tm_det_guid_btn_wrap .divy_tm_det_guid_btn {font-size: 0.8rem; padding: 0.125rem 0.625rem; margin-top: -0.125rem; margin-left: 0.5rem;} .divy_tm_det_guid_btn_wrap .card {position: absolute; top: 30px; box-shadow: 4px 5px 20px 2px rgb(0 0 0 / 12%); z-index: 1;} .divy_tm_det_guid_btn_wrap .divy_tm_det_guid_close_btn {position: absolute; top: 0; right: 9px; font-size: 1.25rem; color: #999; padding: 0.25rem;} .divy_tm_det_guid_btn_wrap .card > .card-body {position: relative;} .cmn_srch_addr_item_wrap .cmn_srch_lst_wrap {overflow-y: scroll; height: 250px;} .cmn_srch_addr_item_wrap .cmn_srch_addr_item:hover {background-color: #318989;color: white !important;cursor: pointer;} /* 23.02.21 [개인 정보 수집 동의 폼] */ #pinfoAgrFormWrap .pinfo_agr_form dl, #pinfoAgrFormWrap .pinfo_agr_form ul {margin-bottom: 0; padding-left: 0;} #pinfoAgrFormWrap .pinfo_agr_form ul > li {list-style: none;} #pinfoAgrFormWrap .pinfo_agr_form > dl {margin-bottom: 2rem;} #pinfoAgrFormWrap .pinfo_agr_form > dl > dt {font-size: 1.125rem;} #pinfoAgrFormWrap .pinfo_agr_form > dl > dd {margin-top: 0.5rem;} #pinfoAgrFormWrap .pinfo_agr_text_form {padding: 1rem 2rem; max-height: 200px; overflow-y: auto; border: 1px solid #dcdcdc; color: #404044;} #pinfoAgrFormWrap .pinfo_agr_text_form > p, #pinfoAgrFormWrap .pinfo_agr_text_form > ul > li {margin-bottom: 0.25rem;} #pinfoAgrFormWrap .pinfo_agr_text_form > ul > li > dl > dt {font-weight: 500;} #pinfoAgrFormWrap .pinfo_agr_btn_wrap {margin-top: 1.5rem;} #pinfoAgrFormWrap .pinfo_agr_btn_wrap > ul {text-align: center;} #pinfoAgrFormWrap .pinfo_agr_btn_wrap > ul > li {display: inline-block; padding: 0rem 0.5rem;} #pinfoAgrFormWrap .pinfo_agr_btn_wrap > ul > li > label {cursor: pointer;} #pinfoAgrFormWrap .pinfo_agr_btn_wrap > ul > li > label > input {display: inline-block; width: 20px; height: 20px; margin-right: 0.25rem; cursor: pointer; vertical-align: middle;} #pinfoAgrFormWrap .pinfo_agr_btn_wrap > ul > li > label > span {font-size: 1.125rem; display: inline-block; vertical-align: middle;} /* 고객 리뷰 */ .usr_rvw_form_top_wrap .card-body {padding: 1.25rem; border-radius: 0;} .usr_rvw_form_top_wrap .card-body dl {margin-bottom: 0;} .usr_rvw_form_top_wrap .card-body > ul > li:last-child {padding-left: 2rem;} .usr_rvw_form_top_wrap .card-body > ul > li > dl {text-align: center; border-right: 2px solid #ddd;} .usr_rvw_form_top_wrap .card-body > ul > li > dl > dd {margin-top: 0.5rem;} .usr_rvw_form_top_wrap .card-body > ul > li > dl > dd i {font-size: 1.75rem;} .usr_rvw_point_wrap > li {padding: 0 0.5rem;} .usr_rvw_point_wrap > li > dl > dt {position: relative; height: 80px;} .usr_rvw_point_wrap > li > dl > dt > div:not(.usr_rvw_cnt) {width: 6px; border-radius: 2rem; margin: 0 auto; left: 50%; transform: translateX(-50%);} .usr_rvw_point_wrap > li > dl > dd {font-size: 0.8rem; color: #8C8C8C;} .usr_rvw_bst_point {position: absolute; background-color: #e6e6e6; height: 80px;} .usr_rvw_point {position: absolute; background-color: #e6e6e6; height: 80px;} .usr_rvw_point_checked {position: absolute; background-color: #3366b9; height: 0px; bottom: 0;} .usr_rvw_bst_point_checked {position: absolute; background-color: #3366b9; height: 0px; bottom: 0;} .usr_rvw_form_main_menu {margin-top: 3rem;} .usr_rvw_form_main_menu > li > a {font-size: 1.125rem; font-weight: 300; color: #000;} .usr_rvw_form_main_menu > li.active > a {font-weight: 500; color: #162b7d;} .usr_rvw_form_main_menu > li:not(:first-child):before {content: "·"; display: inline-block; margin-right: 0.5rem;} .usr_rvw_form_main_card_wrap {border-top: 1px solid #000; margin-top: 0.5rem; padding-top: 1rem;} .usr_rvw_form_main_card_wrap > ul {margin-left: -0.5rem; margin-right: -0.5rem;} .usr_rvw_form_main_card_wrap > ul > li {padding: 0.5rem;} .usr_rvw_form_main_card_wrap > ul > li > .card:hover {transform: translateY(-5px); transition: all .3s ease; box-shadow: 1px 2px 5px rgba(0,0,0,0.35);} .usr_rvw_form_main_card_wrap > ul > li a:hover {opacity: 1;} .usr_rvw_form_main_card_wrap .card {border-radius: 1.25rem; box-shadow: 0px 0px 5px rgba(86, 86, 86, 0.35);} .usr_rvw_form_main_card_wrap .card-body {background-color: transparent; padding: 0.75rem 0.75rem 1.25rem 1.25rem;} .usr_rvw_form_main_card_star {color: #ffbc00; font-size: 0.9rem;} .main_body .usr_rvw_form_main_card_star {font-size: 1.25rem;} .usr_rvw_form_main_card_cus_info > li:first-child {padding-right: 0.5rem;} .usr_rvw_form_main_card_cus_info > li:first-child:after {content: ""; display: inline-block; width: 1px; height: 12px; background-color: #ddd; margin-left: 1rem;} .usr_rvw_form_main_card_cus_info > li:last-child {font-weight: 300; padding-left: 0.5rem;} .usr_rvw_form_top_left_form {width: 200px;} .usr_rvw_form_main_card_img {width: 70px; height: 70px; border: 1px solid #dee2e6; border-radius: 0.5rem; background-position: center; background-size: 100% 100%; transition: all 0.2s ease-in-out;} .usr_rvw_form_main_card_img:hover {background-size: 150% 150%;} .usr_rvw_form_main_top_wrap > ul {display: inline-block;} .usr_rvw_form_main_top_wrap > p {display: inline-block; margin-left: 0.5rem; vertical-align: sub; line-height: 26px; font-size: 0.9rem; color: #6c757d;} .usr_rvw_cnt {position: absolute; white-space: nowrap; background-color: #fff; padding: 0rem 0.25rem; box-shadow: 0px 0px 3px rgba(0,0,0,0.35); display: none; left: 1.125rem; z-index: 10;} .usr_rvw_point, .usr_rvw_point_checked {cursor: pointer;} .usr_rvw_point:hover ~ .usr_rvw_cnt, .usr_rvw_point_checked:hover + .usr_rvw_cnt {display: block;} .dafl_usr_rvw_rply_form {margin: 1rem 0.5rem 0rem 0rem; background-color: #ededed; padding: 0.75rem; border-radius: 0.25rem; color: #333;} .dafl_usr_rvw_rply_form > ul > li:first-child {width: 1.5rem;} .dafl_usr_rvw_rply_form > ul > li > dl {margin-bottom: 0;} .dafl_usr_rvw_rply_form > ul > li > dl > dd.main {text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;line-clamp: 2;-webkit-box-orient: vertical; overflow: hidden;} /* 표준 보상안 */ .std_cpst_lst dl {margin-bottom: 0;} .std_cpst_lst > ul > li > dl {padding: 1rem;} .std_cpst_lst > ul > li > dl > dd {background-color: #fff; padding: 1rem; border-radius: 0.5rem; margin-top: 1rem;} .curr_login{top: 60px; position: absolute; left: 50%; transform: translateX(-50%);} /* 배송 신청 다이얼로그 */ .divy_recv_optn_info_popup {position: fixed !important; top: 6.5rem !important; z-index: 10002;} .divy_recv_optn_info {padding: 2rem 1rem !important; font-family: "Noto Sans KR", sans-serif;} .divy_recv_optn_info a {display: block;} .divy_recv_optn_info a:hover, .divy_recv_optn_info a:focus {opacity: 1;} .divy_recv_optn_info .card {border-radius: 1rem; overflow: hidden; box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);} .divy_recv_optn_info .card:hover {box-shadow: 0px 2px 3px 2px rgba(0,0,0,0.2); transform: translateY(-5px); transition: all 0.25s;} .divy_recv_optn_info .card > .card-body {padding: 1rem 2.5rem;} .divy_recv_optn_info ul > li:not(:first-child) {margin-top: 1rem;} .divy_recv_optn_info .divy_recv_optn_item {display: flex; justify-content: flex-start; align-items: center;} .divy_recv_optn_info .divy_recv_optn_item > i {font-size: 2.5rem; color: #39bfbf; width: 50px; font-weight: 500; margin-right: 1rem;} .divy_recv_optn_info .divy_recv_optn_item > dl {margin-bottom: 0;} .divy_recv_optn_info .divy_recv_optn_item > dl > dt {font-size: 1.375rem;} .divy_recv_optn_info .divy_recv_optn_item > dl > dd {font-size: 1.125rem; font-weight: 300; margin-top: 0.25rem;} .login_guid_popup + .ui-dialog-buttonpane .btn {font-weight: 600; line-height: 2;} .login_guid_popup + .ui-dialog-buttonpane .btn {margin: 0.5rem;} /* 메인페이지 최근설치내역 수정 */ .main_instl_photo_lst {display: grid; grid-template-columns: repeat(10, 1fr); gap: 1.5rem 1rem; margin-left: 0 !important; margin-right: 0 !important;} .main_instl_photo_lst > li {position: relative; padding-right: 0rem !important; padding-left: 0rem !important; display: block; padding-top: 0.5rem; overflow-x: hidden;} .main_instl_photo_lst > li > a {padding-bottom: calc(100% - 2px); position: relative; background-size: cover; background-repeat: no-repeat;} .main_instl_photo_lst > li > a:after {content: ""; width: 100%; height: 100%; position: absolute; backdrop-filter: blur(1px); border-radius: 1rem;} .main_instl_photo_lst > li > a + span.badge {font-size: 0.85rem; padding: 0.375rem 0.5rem; font-weight: 500; top: 0 !important;} /* 고객소통함 */ .form_surv_wrap ul {margin-top: 0.5rem;} .form_surv_wrap ul > li {display: inline-block;} .form_surv_wrap ul > li:last-child {margin-left: -1px;} .form_surv_wrap ul > li > label {cursor: pointer; display: inline-block; padding: 0.5rem 4rem; border: 1px solid #dedede; background-color: #fff; position: relative;} .form_surv_wrap ul > li > label:hover {border-color: #3366B9; color: #3366B9; z-index: 2;} .form_surv_wrap ul > li:first-child > label {border-top-left-radius: 0.25rem; border-bottom-left-radius: 0.25rem;} .form_surv_wrap ul > li:last-child > label {border-top-right-radius: 0.25rem; border-bottom-right-radius: 0.25rem;} .form_surv_wrap ul > li > label > i {position: absolute; font-size: 1.25rem; top: 50%; left: 2.5rem; transform: translate(-50%, -50%); display: none;} .form_surv_wrap ul > li > input:checked + label > i {display: block;} .form_surv_wrap ul > li > input {display: none;} .form_surv_wrap ul > li > input:checked + label {border-color: #3366b9; background-color: #3366b926; color: #3366B9; z-index: 1; font-weight: 600;} .form_surv_wrap .surv_item {margin-top: 0.5rem;} /* 고객소통함 다이얼로그 */ .divy_relat_popup {padding: 1.25rem !important; font-family: "Noto Sans KR", sans-serif;} .divy_relat_popup + .ui-dialog-buttonpane button {min-width: 120px;} /* 배송 조회 */ .dafl_divy_inq_info dl {margin-bottom: 0;} .dafl_divy_sta_words > dl > dt {font-size: 2rem;} .dafl_divy_sta_words > dl > dd {margin-top: 0.5rem; font-size: 1.25rem; font-weight: 500;} .dafl_divy_sta_info {margin-top: 3rem;} .dafl_divy_sta_info > li > span {display: inline-block; width: 150px; background-color: #f2f2f2; text-align: center; padding: 0.75rem 0; border-radius: 0.5rem; font-size: 1.25rem; font-weight: 500; letter-spacing: 0.5px;} .dafl_divy_sta_info > li.active > span {background-color: #162b7d; color: #fff; font-weight: 700;} .dafl_divy_sta_det_info > .card {background-color: transparent; border: none; box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.35); border-radius: 0.75rem;} .dafl_divy_sta_det_info > .card > .card-body {background-color: transparent;} .dafl_divy_sta_det_info > .card > .card-body h4 {margin-bottom: 0;} .dafl_divy_sta_det_info > .card > .card-body > ul {margin-top: 1.5rem;} .dafl_divy_sta_det_info > .card > .card-body > ul > li:not(:first-child) {margin-top: 1rem;} .dafl_divy_sta_det_info > .card > .card-body > ul > li > dl {font-size: 1.125rem;} .dafl_divy_sta_det_info > .card > .card-body > ul > li > dl > dt {font-weight: 500; white-space: nowrap; } .dafl_divy_sta_det_info > .card > .card-body > ul:not(.dafl_divy_sta_det_info_top_lst) > li > dl > dt {width: 120px;} .dafl_divy_sta_det_info > .card > .card-body > ul > li > dl > dd > ul > li:not(:first-child) {margin-top: 0.5rem;} .dafl_divy_sta_det_info > .card > .card-body > ul > li > dl > dd span {font-weight: 500;} .dafl_divy_sta_det_info > .card > .card-body > ul > li > dl > dd span > em {margin-left: 0.25rem; color: #333; font-weight: 400;} .dafl_divy_sta_det_info > .card > .card-body > ul > li > dl > dd > ul > li > span > em {color: #959ecb;} .dafl_divy_sta_det_info > .card > .card-body > ul > li > dl > dd > ul.d-table > li:last-child {width: 120px; text-align: right;} .dafl_divy_sta_det_info > .card > .card-body > ul > li > dl > dd > ul.d-table > li:last-child > a {color: #3366b9; font-weight: 500; border-bottom: 1px solid #3366b9;} .dafl_instl_photo_wrap {border-radius: 0.75rem; overflow: hidden;} .dafl_instl_photo_wrap ul > li > a.btn {border-radius: 0;} .dafl_divy_sta_det_info > .card > .card-body > ul.dafl_divy_sta_det_info_top_lst > li > dl > dd span > em {margin-left: 0.75rem; font-size: 1rem;} /* 배송신청하기 */ .dafl_mngt_divy_form span.text-danger {display: none;} .dafl_mngt_divy_form_btn_group > li {display: inline-block;} .dafl_mngt_divy_form_btn_group > li:not(:first-child) {margin-left: -1px;} .dafl_mngt_divy_form_btn_group > li:first-child > a {border-top-left-radius: 0.25rem; border-bottom-left-radius: 0.25rem;} .dafl_mngt_divy_form_btn_group > li:last-child > a {border-top-right-radius: 0.25rem; border-bottom-right-radius: 0.25rem;} .dafl_mngt_divy_form_btn_group > li > a {padding: 0.5rem 2rem; display: block; background-color: #e9ecef; font-weight: 300; border: 1px solid #ced4da; position: relative; overflow: hidden; text-align: center;} .dafl_mngt_divy_form_btn_group > li > a:hover {border-color: #000; z-index: 1;} .dafl_mngt_divy_form_btn_group > li > a:hover, .dafl_mngt_divy_form_btn_group > li > a:focus {opacity: 1;} .dafl_mngt_divy_form_btn_group > li > a.active {font-weight: 500; border-color: #000; z-index: 1;} .dafl_mngt_prd_optn > ul > li {padding: 0; display: inline-block; position: relative;} .dafl_mngt_prd_optn > ul > li > label {cursor: pointer; padding: 1rem; width: 250px; display: block; border: 1.5px solid #ced4da; text-align: center; background-color: #fff; font-weight: 300; font-size: 1.25rem; position: relative;} .dafl_mngt_prd_optn > ul > li > label:hover {border-color: #3366B9; color: #3366B9; z-index: 0;} .dafl_mngt_prd_optn > ul > li > div {display: none; width: 0; height: 0; position: absolute; top: 0; right: 0; z-index: 1; border-right: 1.5rem solid #3366B9; border-bottom: 1.5rem solid transparent; border-left: 1.5rem solid transparent; border-top: 1.5rem solid #3366B9;} .dafl_mngt_prd_optn > ul > li > div > i {color: #fff; position: absolute; top: -17px; right: -17px;} /* .dafl_mngt_prd_optn > ul > li:first-child > label {border-top-left-radius: 0.25rem; border-bottom-left-radius: 0.25rem;} .dafl_mngt_prd_optn > ul > li:last-child > label {border-top-right-radius: 0.25rem; border-bottom-right-radius: 0.25rem;} */ .dafl_mngt_prd_optn > ul > li:not(:first-child) {margin-left: 0.75rem;} .dafl_mngt_prd_optn > ul > li > input[type="checkbox"] {display: none;} .dafl_mngt_prd_optn > ul > li > input[type="checkbox"]:checked + label {background-color: #fff; font-weight: 500; color: #000; border-color: #3366b9; z-index: 1; box-shadow: 0px 0px 7px rgba(30, 152, 215, 0.35);} .dafl_mngt_prd_optn > ul > li > input[type="checkbox"]:checked ~ div {display: block;} .dafl_mngt_prd_optn_det_form {padding-top: 0.5rem;} .dafl_mngt_prd_optn_det_form > div {margin-top: 1rem;} .dafl_mngt_prd_optn_det_form .card {border: 0;} .dafl_mngt_prd_optn_det_form .card > .card-body {background-color: #f2f2f27f; position: relative;} .dafl_mngt_prd_optn_det_form .card > .card-body > ul > li:first-child {vertical-align: top; width: 100px; text-align: center; padding-right: 1.25rem;} .dafl_mngt_prd_optn_det_form .card > .card-body > ul > li:first-child > a {display: inline-block; padding: 0.5rem;} .dafl_mngt_prd_optn_det_form .card > .card-body > ul > li:first-child i {color: #ff9797; font-size: 2rem; display: inline-block;} .dafl_mngt_prd_optn_det_form .card > .card-body > ul > li > dl > dt {font-size: 1.25rem;} .dafl_mngt_prd_optn_det_form .card > .card-body > ul > li > dl > dd dl > dt {font-weight: 500;} .articl_divy_qt_lst > li {display: inline-block; width: 50%; vertical-align: top;} .articl_divy_qt button {width: 30px; height: 30px; border-radius: 50%; text-align: center; border-width: 1px; background-color: #fff;} .articl_divy_qt button[disabled] {color: #ddd;} .articl_divy_qt input {width: 50px; height: 30px; text-align: right;} .cupn_bas_btn strong {text-decoration: underline;} /* 고객 신청 공통 폼 */ .dafl_mngt_cus_apl_form {padding: 0.5rem;} .dafl_mngt_cus_apl_form > dt {font-size: 1.75rem; font-weight: 500;} .dafl_mngt_cus_apl_form > dd {margin-top: 1rem;} .dafl_mngt_cus_apl_form > dd > table {border-top-color: #000; border-bottom-color: #c4c4c4;} .dafl_mngt_cus_apl_form > dd > table > tbody > tr > th {font-size: 1.25rem; font-weight: 300;} .dafl_mngt_cus_apl_form > dd > table > tbody > tr > td {text-align: left; padding: 0.5rem 1.5rem;} .dafl_mngt_cus_apl_form > dd > table > tbody > tr > td > div {width: 450px;} .dafl_mngt_cus_apl_form > dd > table > tbody > tr > td > div.input-group {width: 100%;} /* 최근 이용 문구 다이얼로그 */ .dalf_mngt_ltst_use_words_lst {margin-top: 1.5rem;} .dalf_mngt_ltst_use_words_lst > li:not(:first-child) {margin-top: 0.75rem;} .dalf_mngt_ltst_use_words_lst > li {padding: 1.25rem 1rem; border-radius: 0.75rem; border: 1px solid #c7c7c7; cursor: pointer;} .dalf_mngt_ltst_use_words_lst > li:hover {box-shadow: 0px 0px 5px rgba(0,0,0,0.35);} .dalf_mngt_ltst_use_words_lst dl {margin-bottom: 0;} .fl_ribbon_sample_dialog {padding: 1.5rem !important;} /* 깃발 상세 */ ul > li.dafl_mngt_flag_det_lst:nth-child(2n - 1) {padding-right: 0.5rem;} ul > li.dafl_mngt_flag_det_lst:nth-child(2n) {padding-left: 0.5rem;} .dafl_mngt_flag_det_lst {display: inline-block; width: 50%;} .dafl_mngt_flag_det_lst label {display: block; width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; cursor: pointer;} /* 화환 상세 */ .img_layout_wrap {max-height: 80vh !important;} .dafl_mngt_wrth_det_form {background-color: #fff;} .cdlcSrvSttlAmtLstWrap {border: 1px solid #ced4da; padding: 0.75rem;} .cdlcSrvSttlAmtLstWrap .ui-checkboxradio-label {display: inline-block; width: calc(20% + 0.8px - 0.6rem); border: 1px solid #d6d6d6; border-radius: 0; padding: 0.5rem; margin: 0 0 0.75rem; text-align: left; font-weight: 500 !important; font-family: "Noto Sans KR", sans-serif; position: relative; background-color: #fff;} .cdlcSrvSttlAmtLstWrap > .ui-checkboxradio-label:not(:nth-child(5n)) {margin-right: 0.75rem;} .cdlcSrvSttlAmtLstWrap > .ui-checkboxradio-label:nth-child(n+16) {margin-bottom: 0;} .cdlcSrvSttlAmtLstWrap > .ui-checkboxradio-label:nth-child(5n) {margin-right: -1px;} .cdlcSrvSttlAmtLstWrap > .ui-checkboxradio-label:not(:nth-child(5n+1)) {margin-left: -1px;} .cdlcSrvSttlAmtLstWrap .ui-checkboxradio-label:hover {border: 1px solid #3366b9; z-index: 2; opacity: 1;} .cdlcSrvSttlAmtLstWrap .ui-checkboxradio-label .orig_pr {font-size: 0.9rem; font-weight: 300;} .cdlcSrvSttlAmtLstWrap .ui-checkboxradio-label .img_resize_btn {position: absolute; top: 0.5rem; right: 0.5rem; color: #454545 !important; padding: 0.375rem 0.5rem; margin-right: 0; border-top-right-radius: 0.25rem; border: 0; background-color: #f6f6f6; box-shadow: -1px 1px 3px rgba(0,0,0,0.35);} .cdlcSrvSttlAmtLstWrap .ui-checkboxradio-label .img_resize_btn:hover {color: #000 !important; opacity: 1; background-color: #f6f6f6;} .cdlcSrvSttlAmtLstWrap .ui-icon-background {background-image: none; display: block; border: 0; border-radius: 0.5rem; background-color: #FFF; background-repeat: no-repeat; width: 100%; padding-bottom: 100%; background-size: 100% 100%; background-position: center center; margin: 0px; box-shadow: inherit; transition: all 0.2s ease-in-out; margin-bottom: 0.5rem;} .cdlcSrvSttlAmtLstWrap .ui-checkboxradio-label:hover .ui-icon-background {background-size: 150% 150%; filter: brightness(1.05);} .cdlcSrvSttlAmtLstWrap .ui-checkboxradio-radio-label.ui-checkboxradio-checked {background-color: #3366b919; border-color: #3366b9; z-index: 2; box-shadow: inherit; color: #000; border-width: 3px;} .cdlcSrvSttlAmtLstWrap .ui-checkboxradio-radio-label.ui-checkboxradio-checked > dl > dt {padding-top: 0;} .cdlcSrvSttlAmtLstWrap .ui-checkboxradio-radio-label.ui-checkboxradio-checked .ui-icon-background {border: 0 !important; filter: brightness(1.1);} .cdlcSrvSttlAmtLstWrap .ui-checkboxradio-radio-label.ui-checkboxradio-checked .ui-icon-background, .cdlcSrvSttlAmtLstWrap .ui-checkboxradio-radio-label.ui-checkboxradio-checked:hover .ui-icon-background {width: 100%; padding-bottom: 100%; border: 1px solid #DDD;} .cdlcSrvSttlAmtLstWrap .ui-checkboxradio-radio-label.ui-checkboxradio-checked dl > dt {font-weight: 700 !important;} .cdlcSrvSttlAmtLstWrap .ui-checkboxradio-radio-label.ui-checkboxradio-checked .orig_pr {color: #000;} .cdlcSrvSttlAmtLstWrap .orig_pr {text-decoration:line-through;} /* 배송설치요청 깃발검색 */ .divy_instl_req_step1_list .bst_logo {padding: 0.5rem 1.25rem; font-size: 1.25rem;} .divy_instl_req_step1_list .dafl-flag-item .dafl-flag-item-image {padding-bottom: 133.33%; height: 0;} .divy_instl_req_step1_list .dafl-flag-item:hover, .divy_instl_req_step1_list .dafl-flag-item:focus {border: 1px solid #DDD; opacity: 1;} .divy_instl_req_step1_list .dafl-flag-item:hover::after {content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 3px solid #3366b9; z-index: 10;} .divy_instl_req_step1_list .dafl-flag-item h4 {overflow: hidden; text-overflow: ellipsis; max-width: 100%; white-space: nowrap;} /* 액자화환 소개 */ .dafl_cont_intro_top_badge {background-color: #ffa555; padding: 0.5rem 1rem; display: inline-block;} .dafl_cont_intro_top_badge > em {border-left: 5px solid #fff; padding-left: 0.625rem; color: #fff;} .frame_wrth_info dl {margin-bottom: 0;} .frame_wrth_info table {border-top-color: #000;} .frame_wrth_intro_top_bg {background-image: url("/common/css/images/frame_wrth/dafl_frame_wrth_intro_top_bg.jpg"); width: 100%; height: 0; padding-bottom: 37.5%; background-size: cover; position: relative;} .frame_wrth_intro_top_bg > img {position: absolute; top: 50%; right: 3rem; transform: translateY(-50%); width: 320px;} .frame_wrth_intro_top_cont {position: absolute; top: 50%; left: 3rem; transform: translateY(-50%); width: 60%;} .frame_wrth_intro_top_cont dl > dt {font-size: 1.875rem;} .frame_wrth_intro_top_cont dl > dd {margin-top: 1.75rem;} .frame_wrth_intro_top_cont dl > dd > ul > li:first-child {font-size: 1.25rem; font-weight: bold;} .frame_wrth_intro_top_cont dl > dd > ul > li:not(:first-child) {margin-top: 1.75rem;} .frame_wrth_title {font-size: 1.5rem; font-weight: bold; margin-top: 5rem;} .frame_wrth_intro_main_img {margin-top: 1.25rem;} .frame_wrth_intro_main_img .col-4 dl {width: 90%;} .frame_wrth_intro_main_img img {width: 100%; margin-top: 1rem;} .frame_wrth_intro_main_info {margin-top: 3rem;} .frame_wrth_intro_main_info_lst > li:not(:first-child) {margin-top: 1rem;} .frame_wrth_intro_main_info_lst > li > dl > dt {font-weight: 400} .frame_wrth_intro_main_info_lst > li > dl > dd {margin-top: 0.25rem; color: #6c757d; font-size: 0.9rem;} .frame_wrth_use_ex_form_wrap {margin-top: 1rem;} .frame_wrth_use_ex_form_wrap > ul > li > dl > dt {font-weight: 500; font-size: 1.25rem;} .frame_wrth_use_ex_form_wrap > ul > li > dl > dd {margin-top: 0.75rem;} .frame_wrth_use_ex_form_wrap img {object-fit: contain;} .frame_wrth_use_eplg .row {margin-top: 1.25rem;} .frame_wrth_recv_guid_lst > li:not(:first-child) {margin-top: 3rem;} /* 작품 사진 목록 */ /* .prdt_photo_det_lst {display: grid; grid-template-columns: repeat(3, 1fr);} */ .prdt_photo_det_lst > li {display: inline-block; width: calc(100% / 3); padding: 0.625rem; vertical-align: top;} .prdt_photo_det_lst > li:nth-child(n+4) {margin-top: 1.25rem;} .prdt_photo_det_lst > li > a:focus {opacity: 1;} .prdt_photo_det_lst > li > a:hover {filter: brightness(1.1);} .prdt_photo_det_lst > li > div {margin-top: 0.25rem;} /* .prdt_photo_list .img_wrap {width: 100%; height: 0; padding-bottom: 56.25%; position: relative;} .prdt_photo_list .img_lg .img_wrap {padding-bottom: 134%;} */ /* .prdt_photo_det_lst > li > p {margin-top: 0.625rem; font-weight: 500; height: 3rem; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; width: 100%;} */ /* 앱 다운로드 안내 */ .dafl_app_dl_guid_form_wrap {padding-top: 4.5rem; padding-bottom: 4.5rem; color: #000;} .dafl_app_dl_guid_form_logo > img {width: 200px;} .dafl_app_dl_guid_form_title {margin-top: 1.25rem;} .dafl_app_dl_guid_form_title p {font-size: 1.5rem;} .dafl_app_dl_guid_form_title strong {font-size: 2rem;} .dafl_app_dl_guid_form_title p + p {margin-top: 0.25rem;} .dafl_app_dl_guid_form_cont {margin-top: 3.5rem;} .dafl_app_dl_guid_form_cont dl {margin-bottom: 0;} .dafl_app_dl_guid_form_cont dl > dd {font-size: 1.25rem; margin-top: 0.75rem;} .dafl_app_dl_guid_form_wrap .container {position: relative;} .dafl_app_dl_guid_form_wrap .container > img {position: absolute; top: 50%; right: 0; transform: translateY(-50%); width: 400px;} .dafl_app_dl_guid_form_btn_lst {margin-top: 1rem;} .dafl_app_dl_guid_form_wrap .dafl_app_dl_guid_form_btn_lst > ul {margin-left: -0.625rem;} .dafl_app_dl_guid_form_wrap .dafl_app_dl_guid_form_btn_lst > ul > li {padding-left: 0.625rem; padding-right: 0.625rem;} .dafl_app_intro_page_mv_btn {background-color: #fff; display: flex; justify-content: center; align-items: center; width: 200px; color: #000; text-align: center; padding-top: 0.375rem; padding-bottom: 0.375rem; border: 1px solid #A6A6A6; border-radius: 0.5rem; box-shadow: 0px 0px 4px rgba(0,0,0,0.35); transition: background-color 0.15s ease-in-out, color 0.15s ease-in-out;} .dafl_app_intro_page_mv_btn:hover {background-color: #000; color: #fff;} .dafl_app_intro_page_mv_btn > i {font-size: 2.5rem;} .dafl_app_intro_page_mv_btn > span {font-weight: bold; margin-left: 0.5rem;} .dafl_app_dl_btn {display: block;} .dafl_app_dl_btn > img {height: 62px; margin: 0 auto;} .dafl_app_dl_guid_qr_code_form {margin-top: 1rem;} .dafl_app_dl_guid_qr_code_form dl {text-align: center;} .dafl_app_dl_guid_qr_code_form dl > dt {margin-top: 0.5rem; text-align: center; font-size: 1.125rem;} .dafl_app_dl_guid_qr_code_form img {width: 10rem;} /* 다퀵 버튼 추가 */ .dafl_top_header .daquick_hp_mv_btn {padding-top: 0.125rem; padding-bottom: 0.125rem; width: 110px; border-radius: 0.25rem; background-color: #EB5F3B; display: flex; justify-content: center; align-items: center; color: #fff; text-align: center; border: 1px solid #EB5F3B; border-radius: 0.25rem; box-shadow: 0px 0px 4px rgba(0,0,0,0.35); transition: background-color 0.15s ease-in-out, color 0.15s ease-in-out;} .dafl_top_header .daquick_hp_mv_btn:hover {opacity: 1; filter: brightness(1.25);} .dafl_top_header .daquick_hp_mv_btn > i {font-size: 1rem;} .dafl_top_header .daquick_hp_mv_btn > p {margin-left: 0.375rem; line-height: 1.2; font-weight: 400; font-size: 11px; margin-right: 0.5rem;} .dafl_top_header .dafl_app_dl_guid_form_btn_lst {margin-top: 0;} .dafl_top_header .dafl_app_dl_btn > img {height: 31.6px;} .dafl_top_header .dafl_app_intro_page_mv_btn {font-size: 10px; font-weight: 500; padding-top: 0.125rem; padding-bottom: 0.125rem; width: 100px; border-radius: 0.25rem;} .dafl_top_header .dafl_app_intro_page_mv_btn:hover {background-color: #000; color: #fff;} .dafl_top_header .dafl_app_intro_page_mv_btn > i {font-size: 1.25rem;} .dafl_top_header .dafl_app_intro_page_mv_btn > span {line-height: 1.3; margin-left: 0.375rem;} .app_dl_guid_info .dafl_app_dl_guid_form_wrap {position: relative; padding-left: 2.5rem; padding-right: 2.5rem;} .app_dl_guid_info .dafl_app_dl_guid_form_wrap > img {position: absolute; top: 40%; right: 1.5rem; transform: translateY(-50%); width: 250px;} .app_dl_guid_info .dafl_app_dl_guid_form_title p {font-size: 1.25rem;} .app_dl_guid_info .dafl_app_dl_guid_form_title strong {font-size: 1.5rem;} .app_dl_guid_info .dafl_app_dl_guid_form_cont dl > dt {font-size: 1.25rem !important} .app_dl_guid_info .dafl_app_dl_guid_form_cont dl > dd {font-size: 1rem; margin-top: 0.5rem;} .dafl_app_dl_guid_det_info_wrap {margin-top: 5rem} .dafl_app_dl_guid_det_info_wrap > dl > dt {font-size: 2rem; text-align: center;} .dafl_app_dl_guid_det_info_wrap > dl > dd {margin-top: 4rem;} .dafl_app_dl_guid_det_info > li {width: 50%; position: relative; vertical-align: top} .dafl_app_dl_guid_det_info > li > img {width: 45%; position: relative; z-index: 1; display: inline-block;} .dafl_app_dl_guid_det_info > li > .card {display: inline-block; position: absolute;} .dafl_app_dl_guid_det_info > li > .card > .card-body {font-weight: bold; font-size: 1.125rem; line-height: 2.25rem; white-space: nowrap;} .dafl_app_dl_guid_det_info > li:first-child > .card {top: 10%; left: 35%;} .dafl_app_dl_guid_det_info > li:first-child > .card > .card-body {background-color: #E3F7FF; border: 2px solid #BDECFF; border-radius: 0.75rem; padding: 1.25rem 2.5rem 1.25rem 5rem;} .dafl_app_dl_guid_det_info > li:last-child {margin-top: 6rem; text-align: right;} .dafl_app_dl_guid_det_info > li:last-child > .card {bottom: 10%; right: 35%;} .dafl_app_dl_guid_det_info > li:last-child > .card > .card-body {background-color: #3366B9; border: 2px solid #2B5290; border-radius: 0.75rem; color: #fff; padding: 1.25rem 5rem 1.25rem 2.5rem;} .dafl_app_dl_guid_det_info + .dafl_app_dl_guid_det_info {margin-top: 6rem;} @media (min-width: 1425px) { .app_dl_guid_info .dafl_app_dl_guid_form_wrap > img {width: 300px; right: 2.5rem; top: 50%;} } /** 액자화환 */ .divyFrameWrthLst > li > dl >dt, .divyFrameWrthLst > li > dl >dd{display: block;line-height: inherit;} .divyFrameWrthLst > li > dl >dd {margin-top: 1rem;} .divyFrameWrthLst > li > dl >dt>em{border:3px solid #004596;padding: 1px 10px; color: #004596; margin-right: 0.5rem;vertical-align: middle;} .divyFrameWrthLst > li > dl >dt>span{font-size: 1.25rem;vertical-align: middle;} .divyFrameWrthLst .divyFrameWrthImgWrap{background: #EEE;padding: 1rem;border:1px solid #EEE; border-radius: 0.25rem;} .divyFrameWrthLst .divyFrameWrthImgWrap > img{border-radius: 0.25rem;width: 100%;} .divyFrameWrthLst .divyFrameWrthImgWrap > p{margin-top: 0.5rem;font-weight: bold; font-size: 0.9rem; word-break: keep-all;} .divyFrameWrthLst .divyFrameWrthImgList img{border-radius: 0.25rem;width: 100%;} .frame_wrth_lst_wrap > ul {margin-top: 1.5rem;} .frame_wrth_lst_wrap > ul > li:not(:first-child) {margin-top: 3rem;} .frame_wrth_lst_wrap > ul > li > dl > dt {display: flex; justify-content: flex-start; align-items: flex-start; gap: 0.5rem;} .frame_wrth_lst_wrap > ul > li > dl > dt > em {margin-top: 0.25rem;} .frame_wrth_lst_wrap > ul > li > dl > dt span {font-size: 1.25rem; margin-bottom: 0.25rem; display: inline-block;} .frame_wrth_lst_wrap > ul > li > dl > dt p {font-weight: 400;} .divy_frame_wrth_lst_item_wrap {display: flex; justify-content: flex-start; align-items: center; gap: 2rem;} .divy_frame_wrth_lst_item_wrap > div:first-of-type {flex: 1;} .divy_frame_wrth_lst_item_wrap > div:last-of-type {flex: 3;} /** 친환경상품 */ .dntPrdLst > li{width: 50%; float: left;padding: 0.5rem;} .dntPrdLst > li:after{content: "";clear: both;display: block} .dntPrdLst > li > dl >dt, .dntPrdLst > li > dl >dd{display: block;line-height: inherit; padding: 0.5rem;} .dntPrdLst > li > dl >dt h5 em{border:3px solid #0dc7c7;padding: 1px 10px; color: #0dc7c7; margin-right: 0.5rem;vertical-align: middle;} .dntPrdLst > li > dl >dt h5 span{font-size: 1.8rem;vertical-align: middle;} .dntPrdLst > li .no-image{background-color: #EEE;height: 220px;display: block;padding: calc( 50% - 48px ) 0;text-align: center;border:1px solid #DDD;} /* 배송상태 - 액자화환 */ .frame_wrth_top_img {width: 55%; margin: 0 auto; border-radius: 0.5rem; box-shadow: 0px 0px 5px 3px rgba(0,0,0,9%); overflow: hidden;} .frame_wrth_body_img_wrap {width: 50%; margin: 0 auto; position: relative;} .frame_wrth_body_img_wrap .frame_wrth_frame_img {width: 100%; position: relative;} .frame_wrth_body_img_wrap .frame_wrth_det_img {width: 70%; position: absolute; top: 2rem; left: 50%; transform: translateX(-50%);} .divy_sta_img_lst_wrap .frame_wrth_frame_body_img {display: block; width: 60%; margin: 0 auto;} /* 배송설치요청 - 신청방법 선택 */ .divy_frame_wrth_optn_form_wrap {width: 80%; margin: 0 auto;} .divy_frame_wrth_optn_form_wrap .card {width: 80%; margin: 0 auto; position: relative; box-shadow: 3px 3px 4px rgba(0,0,0,0.35);} .divy_frame_wrth_optn_form_wrap .card > img {width: 60px; position: absolute; top: 0; left: 0; transform: translate(-50%, -30%);} .divy_frame_wrth_optn_form_wrap .card > .card-body {display: table; table-layout: fixed; width: 100%; padding: 1.5rem 2rem;} .divy_frame_wrth_optn_form_wrap .card > .card-body > * {display: table-cell; vertical-align: top;} .divy_frame_wrth_optn_form_wrap .card > .card-body .divyFrameWrthImgWrap {border: 5px solid #fff; padding: 0.75rem;} .divy_frame_wrth_optn_form_wrap .card > .card-body .divyFrameWrthImgWrap p {word-break: keep-all; font-size: 0.8rem;} .divy_frame_wrth_optn_form_wrap .card > .card-body > div:first-child {width: 151px;} .divy_frame_wrth_optn_form_wrap .card > .card-body > div:last-child {padding-left: 2rem;} .divy_frame_wrth_optn_form_wrap .card > .card-body > div:last-child p {font-size: 1.25rem; margin-top: 1.5rem; font-weight: 500;} .divy_frame_wrth_optn_form_wrap .card > .card-body > div:last-child dl {margin-top: 0.5rem; margin-bottom: 0;} .divy_frame_wrth_optn_form_wrap .card > .card-body > div:last-child dl > dt {font-size: 1.375rem;} .divy_frame_wrth_optn_form_wrap .card > .card-body > div:last-child dl > dd {font-size: 1.25rem; margin-top: 0.5rem;} .divy_frame_wrth_optn_form_wrap > p {font-size: 2rem; text-align: center; font-weight: bold; margin-top: 4rem; margin-bottom: 5rem;} /* 개인정보처리방침 */ .pinfo_clct_util_agr_info_lst, .pinfo_clct_util_agr_info_lst ul, .pinfo_clct_util_agr_info_lst dl {margin-bottom: 0; padding-left: 0;} .pinfo_clct_util_agr_info_lst > *, .pinfo_clct_util_agr_info_lst ul > * {list-style: none;} .pinfo_clct_util_agr_info_lst > li {margin-top: 3rem;} .pinfo_clct_util_agr_info_lst > li > dl > dt {font-size: 1.375rem;} .pinfo_clct_util_agr_info_lst > li > dl > dd {margin-top: 1.5rem;} .pinfo_clct_util_agr_info_lst > li > ul > li {margin-top: 1.25rem;} .pinfo_clct_util_agr_info_lst > li > ul > li > dl > dt {font-size: 1.125rem; font-weight: 500;} .pinfo_clct_util_agr_info_lst > li > ul > li dl > dt {font-weight: 500;} .pinfo_clct_util_agr_info_lst > li > ul > li > dl > dd {margin-top: 0.75rem;} .pinfo_clct_util_agr_info_lst table {table-layout: fixed;} .pinfo_clct_util_agr_info_lst table > tbody > tr > th, .pinfo_clct_util_agr_info_lst table > tbody > tr > td {border-color: #ced4da; text-align: center; vertical-align: middle; font-size: 1rem; padding: 0.5rem; word-break: break-all;} .pinfo_clct_util_agr_info_lst table > tbody > tr > td ul > li:not(:first-child) {margin-top: 0.5rem;} .pinfo_agr_text_form .pinfo_clct_util_agr_info_lst > li {margin-top: 1.5rem;} .pinfo_agr_text_form .pinfo_clct_util_agr_info_lst > li > dl > dt {font-size: 1.125rem;} .pinfo_agr_text_form .pinfo_clct_util_agr_info_lst table {border-top-color: #000;} #JS-okflagDeliveryUsrReqBasAgreeForm .pinfo_agr_text_form {max-height: 500px; overflow-y: scroll;} /* 개인정보처리방침 개정 내용 팝업 */ .pinfo_proc_meth_info_fixed_form {position: fixed !important; top: 50% !important; left: 50% !important; transform: translate(-50%, -50%) !important; width: calc(100% - 2rem) !important; max-width: 800px !important;} .pinfo_proc_meth_info_fixed_form .ui-dialog-content {max-height: 80vh !important; overflow-y: scroll;} .pinfo_proc_meth_info_fixed_form table {width: 100%; table-layout: fixed;} .pinfo_proc_meth_info_fixed_form table > thead > tr > th {border-bottom-width: 1px;} .pinfo_proc_meth_info_fixed_form table > tbody > tr > td {font-size: 0.9rem; word-break: break-all; text-align: left; vertical-align: top;} .pinfo_proc_meth_info_fixed_form table table > tbody > tr > td {vertical-align: middle;} .pinfo_proc_meth_info_fixed_form dl > dd dl > dt {font-weight: 400;} /* 친환경 기부상품 상품소개 */ .dnt_prd_info > ul {display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem;} .dnt_prd_info > ul > li {width: 100%; padding: 0;} .dnt_prd_info > ul > li:after {display: none; } .dnt_prd_info .card {border: 1px solid #ccc !important; width: 100%; height: 100%; border-radius: 0.5rem; box-shadow: 1px 1px 3px rgba(0,0,0,0.15);} .dnt_prd_info .card > .card-body {position: relative; background-color: transparent; padding: 1.5rem 2rem; display: flex; align-items: center; height: 100%;} .dnt_prd_info .card > .card-body dl {margin-bottom: 0;} .dnt_prd_info .dnt_prd_lst_num {position: absolute; top: -1px; left: -1px; display: inline-block; width: 4rem; height: 4rem; border: 2px solid #3366b9; color: #3366b9; background-color: #fff; font-size: 1.5rem; border-bottom-right-radius: 100px;} .dnt_prd_info .dnt_prd_lst_num > span {position: absolute; top: 40%; left: 40%; transform: translate(-50%, -50%);} .dnt_prd_info .dnt_prd_lst_info {width: 60%;} .dnt_prd_info .dnt_prd_lst_cont {margin-top: 2.5rem;} .dnt_prd_info .dnt_prd_lst_cont > dl > dt {font-size: 1.75rem;} .dnt_prd_info .dnt_prd_lst_cont > dl > dd {margin-top: 0.5rem; font-size: 1rem; color: #6c757d; line-height: 1.5rem; word-break: keep-all;} .dnt_prd_info .dnt_prd_lst_cont a.btn {width: 80%;} .dnt_prd_info .dnt_prd_lst_cont a.btn:hover {opacity: 1; filter: brightness(1.25); background-color: #3366b9 !important; border-color: #3366b9 !important;} .dnt_prd_info .dnt_prd_lst_info_pric {margin-bottom: 0.5rem;} .dnt_prd_lst_info_pric + .dnt_prd_lst_info_pric {margin-top: 0.5rem;} .dnt_prd_info .dnt_prd_lst_info_pric > span {font-weight: bold; font-size: 1.125rem; color: #000;} .dnt_prd_info .dnt_prd_lst_info_pric > span:nth-child(1) {text-decoration: line-through;} .dnt_prd_info .dnt_prd_lst_info_pric > span:nth-child(2) {margin-left: 0.375rem; margin-right: 0.375rem;} .dnt_prd_info .dnt_prd_lst_info_pric > span:nth-child(3) {color: #dc3545; font-size: 1.25rem;} .dnt_prd_info .dnt_prd_lst_info_pric > span:nth-child(3) > em {font-size: 1rem; margin-left: 0.25rem; display: inline-block; vertical-align: top;} .dnt_prd_info .dnt_prd_lst_info_pric > span:last-of-type {text-decoration: none; font-size: 1.125rem;} .dnt_prd_info .dnt_prd_lst_info_pric > a {display: inline-block; vertical-align: top;} .dnt_prd_lst_img_wrap {position: absolute; top: 50%; right: 1rem; transform: translateY(-50%); width: 35%; display: block; text-align: center;} .dnt_prd_lst_img_wrap:hover, .dnt_prd_lst_img_wrap:focus {opacity: 1;} .dnt_prd_lst_img_wrap:hover:before {content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; background-color: #00000099;} .dnt_prd_lst_img_wrap:hover:after {content: "클릭 시 확대보기"; color: #fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; text-align: center;} .dnt_prd_lst_img_wrap img {max-height: 250px; object-fit: contain;} .dnt_prd_info .card:hover {border-color: #3366b9 !important; background-color: #3366b91a; transition: all 0.15s ease-in-out; box-shadow: 3px 3px 4px rgba(0,0,0,0.35);} .dnt_prd_info .card:hover .dnt_prd_lst_num {background-color: #3366b9; color: #fff; transition: all 0.15s ease-in-out;} /* 가격안내 수정사항 */ .divy_fee_chart_title {font-size: 1.25rem; font-weight: bold; margin-top: 1rem; margin-bottom: 0.5rem;} /* 배송설치요청 */ .addn_ty_lst_preview {display: flex; justify-content: flex-start; align-items: center; flex-wrap: nowrap; gap: 1rem;} .addn_ty_lst_preview > li {position: relative; text-align: center; min-width: 5rem;} .addn_ty_lst_preview > li > i {display: block; width: 3rem; height: 3rem; overflow: hidden; background-size: cover; background-repeat: no-repeat; border-radius: 50%; margin: 0 auto;} .addn_ty_lst_preview > li > span {color: #000; font-weight: 500; font-size: 0.85rem;} .addn_ty_lst_preview > li > em {position: absolute; top: 0; right: 0.25rem; font-weight: bold; color: #000; background-color: #ffffffcc; width: 1.25rem; height: 1.25rem; text-align: center; border-radius: 50%; cursor: pointer;} .addn_ty_lst_preview > li > em > i {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);} /* 경조 깃발 소개 */ .cdlc_flg_intro_info_img_wrap {width: 100%; max-width: 860px; margin: 0 auto; position: relative;} .cdlc_flg_intro_info_img_wrap > a.btn {position: absolute; bottom: 4rem; left: 50%; transform: translateX(-50%); border-radius: 3rem !important; width: 300px; max-width: 100%;} .JS-addnTyLstButtonSetWrap > ul{display: grid; grid-template-columns: repeat(5, 1fr); gap: 0.75rem; grid-auto-rows: 1fr;} .JS-addnTyLstButtonSetWrap > ul > li > label{background: none;border:1px solid #DDD;position: relative;display: block; font-weight: 500; font-family: "Noto Sans KR", sans-serif; height: 100%;} .JS-addnTyLstButtonSetWrap > ul > li > label > .ui-icon-background{display: block;width: 100%;height: 150px;background-size: 100% 100%;background-position: center center;background-size: 100% auto;box-shadow:none;background-repeat: no-repeat;} .JS-addnTyLstButtonSetWrap > ul > li > label:hover, .JS-addnTyLstButtonSetWrap > ul > li > label.ui-state-active {border:1px solid #6288d6;color:#000;} .JS-addnTyLstButtonSetWrap > ul > li > label.ui-state-active {border:1px solid #3366b9 !important; background-color: #3366b91a !important; color: #000 !important;} .JS-addnTyLstButtonSetWrap > ul > li > label > .ui-checkboxradio-icon-space{position: absolute;right:2px;top:-5px; z-index: 2;} .JS-addnTyLstButtonSetWrap > ul > li > label > .ui-checkboxradio-icon-space:after{content: "\f058";font-family: "Font Awesome 5 Pro";font-weight: 300;color: #ddd;font-size: 2em;} .JS-addnTyLstButtonSetWrap > ul > li > label.ui-state-active > .ui-checkboxradio-icon-space:after{content: "\f058";font-family: "Font Awesome 5 Pro";font-weight: 900;color: #2cb12c;font-size: 2em;} .dnt_prd_divy_instl_req_form label {cursor: pointer;} .dnt_prd_divy_instl_req_form .JS-addnTyLstButtonSetWrap {display: block; width: 100%;} .dnt_prd_divy_instl_req_form .JS-addnTyLstButtonSetWrap > ul > li > label {font-size: 1.125rem;} .dnt_prd_divy_instl_req_form .JS-addnTyLstButtonSetWrap > ul > li > label:hover {opacity: 1; background-color: transparent; color: #000; position: relative;} .dnt_prd_divy_instl_req_form .JS-addnTyLstButtonSetWrap > ul > li > label, .dnt_prd_divy_instl_req_form .JS-addnTyLstButtonSetWrap > ul > li > label:focus {box-shadow: none;} .dnt_prd_divy_instl_req_form .JS-addnTyLstButtonSetWrap .ui-checkboxradio-det-view-btn {display: none;} .dnt_prd_divy_instl_req_form .JS-addnTyLstButtonSetWrap > ul > li > label > .ui-icon-background {width: 100%; height: 0; padding-bottom: 125%; background-size: contain; margin-bottom: 0.5rem; background-color: transparent;} .dnt_prd_divy_instl_req_form .JS-addnTyLstButtonSetWrap > ul > li > label:not(.ui-state-disabled):hover:before {content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; background-color: #000000b3; z-index: 1;} .dnt_prd_divy_instl_req_form .JS-addnTyLstButtonSetWrap > ul > li > label:not(.ui-state-disabled):hover:after {content: ""; color: #fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 95%; text-align: center; z-index: 11; white-space: normal; font-weight: 500; font-size: 1.125rem; line-height: 1.75rem; word-break: keep-all;} /* 근조 문구 */ .dnt_prd_divy_instl_req_form .JS-addnTyLstButtonSetWrap > ul > li > label[data-product-code="2001"]:not(.ui-state-disabled):hover:after {content: "벨벳 재질에 이름을 새겨 당사에 보관된 근조깃발입니다.";} .dnt_prd_divy_instl_req_form .JS-addnTyLstButtonSetWrap > ul > li > label[data-product-code="2005"]:not(.ui-state-disabled):hover:after {content: "리본이 있어 근조기를 제작할 필요 없이 누구나 배송신청 가능합니다.";} .dnt_prd_divy_instl_req_form .JS-addnTyLstButtonSetWrap > ul > li > label[data-product-code="2105"]:not(.ui-state-disabled):hover:after {content: "근조기와 함께 홍삼과 위로 편지를 보내 유족에게 기운을 전해줄 수 있습니다.";} .dnt_prd_divy_instl_req_form .JS-addnTyLstButtonSetWrap > ul > li > label[data-product-code="2205"]:not(.ui-state-disabled):hover:after {content: "근조기로 고인을 추모하고 고인이나 유족 이름으로 어려운 이웃에게 쌀을 기부하실 수 있습니다.";} .dnt_prd_divy_instl_req_form .JS-addnTyLstButtonSetWrap > ul > li > label[data-product-code="2004"]:not(.ui-state-disabled):hover:after {content: "고인의 평소사진이나 작품사진으로 고인을 추모하는 액자화환 입니다.";} /* 축하 문구 */ .dnt_prd_divy_instl_req_form .JS-addnTyLstButtonSetWrap > ul > li > label[data-product-code="1001"]:not(.ui-state-disabled):hover:after {content: "벨벳 재질에 이름을 새겨 당사에 보관된 축하깃발입니다.";} .dnt_prd_divy_instl_req_form .JS-addnTyLstButtonSetWrap > ul > li > label[data-product-code="1005"]:not(.ui-state-disabled):hover:after {content: "리본이 있어 축하기를 제작할 필요 없이 누구나 배송신청 가능합니다.";} .dnt_prd_divy_instl_req_form .JS-addnTyLstButtonSetWrap > ul > li > label[data-product-code="1205"]:not(.ui-state-disabled):hover:after {content: "축하기로 결혼을 축하하고 신랑신부 이름으로 어려운 이웃에게 쌀을 기부하실 수 있습니다.";} .dnt_prd_divy_instl_req_form .JS-addnTyLstButtonSetWrap > ul > li > label[data-product-code="1004"]:not(.ui-state-disabled):hover:after {content: "결혼식 청첩장의 신랑 신부 사진이나 정기총회 등에서 지난 행사 사진 등으로 액자를 만들어 갤러리 같은 분위기 연출로 행사 분위기를 올려줍니다.";} /* 문구 없어서 예외 처리 */ .dnt_prd_divy_instl_req_form .JS-addnTyLstButtonSetWrap > ul > li > label[data-product-code="1002"]:hover:before, .dnt_prd_divy_instl_req_form .JS-addnTyLstButtonSetWrap > ul > li > label[data-product-code="1002"]:hover:after, .dnt_prd_divy_instl_req_form .JS-addnTyLstButtonSetWrap > ul > li > label[data-product-code="2002"]:hover:before, .dnt_prd_divy_instl_req_form .JS-addnTyLstButtonSetWrap > ul > li > label[data-product-code="2002"]:hover:after, .dnt_prd_divy_instl_req_form .JS-addnTyLstButtonSetWrap > ul > li > label[data-product-code="2003"]:hover:before, .dnt_prd_divy_instl_req_form .JS-addnTyLstButtonSetWrap > ul > li > label[data-product-code="2003"]:hover:after {display: none;} /* 친환경 뱃지*/ .ui-checkboxradio-create-icon-best-badge {position: absolute; top: 5px; left: 5px; z-index: 3; border: 1px solid #ff4947; color: #ff4947; background-color: #ffe8e8; padding: 0.25rem 0.4rem; font-size: 0.85rem; font-weight: bold;} .ui-checkboxradio-create-icon-best-badge + .ui-checkboxradio-icon-badge {left: 4.625rem;} .ui-checkboxradio-icon-badge {position: absolute; top: 5px; left: 5px; z-index: 2; border: 1px solid #2cb12c; color: #2cb12c; background-color: #f2fff2; padding: 0.25rem 0.4rem; font-size: 0.85rem; font-weight: bold;} .ui-checkboxradio-icon-badge:after {content: "친환경"; display: inline-block;} .ui-checkboxradio-icon-badge.dafl{border: 1px solid #09c7c7;background-color: #ecffff; color: #09c7c7;} .ui-checkboxradio-icon-badge.dafl:after {content: "다아몬드플래그"; display: inline-block;} .ui-checkboxradio-create-icon-badge {position: absolute; top: 5px; left: 5px; z-index: 2; border: 1px solid #007bff; color: #007bff; background-color: #cbe4ffe0; padding: 0.25rem 0.4rem; font-size: 0.85rem; font-weight: bold;} .ui-checkboxradio-create-icon-badge:after {content: "다이아몬드플래그"; display: inline-block;} .dnt_prd_lst_cont .ui-checkboxradio-icon-badge {position: static; transform: none; display: inline-block;} /* 친환경 뱃지 예외 처리 */ .dnt_prd_divy_instl_req_form .JS-addnTyLstButtonSetWrap > ul > li > label[data-product-code="2002"] .ui-checkboxradio-icon-badge, .dnt_prd_divy_instl_req_form .JS-addnTyLstButtonSetWrap > ul > li > label[data-product-code="2016"] .ui-checkboxradio-icon-badge, .dnt_prd_divy_instl_req_form .JS-addnTyLstButtonSetWrap > ul > li > label[data-product-code="2026"] .ui-checkboxradio-icon-badge, .dnt_prd_divy_instl_req_form .JS-addnTyLstButtonSetWrap > ul > li > label[data-product-code="2036"] .ui-checkboxradio-icon-badge, .dnt_prd_divy_instl_req_form .JS-addnTyLstButtonSetWrap > ul > li > label[data-product-code="2046"] .ui-checkboxradio-icon-badge, .dnt_prd_divy_instl_req_form .JS-addnTyLstButtonSetWrap > ul > li > label[data-product-code="1016"] .ui-checkboxradio-icon-badge, .dnt_prd_divy_instl_req_form .JS-addnTyLstButtonSetWrap > ul > li > label[data-product-code="1026"] .ui-checkboxradio-icon-badge, .dnt_prd_divy_instl_req_form .JS-addnTyLstButtonSetWrap > ul > li > label[data-product-code="2003"] .ui-checkboxradio-icon-badge, .dnt_prd_divy_instl_req_form .JS-addnTyLstButtonSetWrap > ul > li > label[data-product-code="1002"] .ui-checkboxradio-icon-badge {display: none;} /* 친환경 상품 소개 - 요금조회 다이얼로그 */ .dnt_prd_amt_info {font-family: "Noto Sans KR", sans-serif; padding: 1.25rem !important;} /* 가격안내 - 화환 */ .divy_flwr_pr_lst {display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; max-height: 80vh; overflow-y: auto;} .divy_flwr_pr_lst.type_02 {grid-template-columns: repeat(3, 1fr);} .divy_flwr_pr_lst > li .card {box-shadow: 1px 1px 3px rgba(0,0,0,0.15); border: 1px solid #ccc !important;} .divy_flwr_pr_lst > li .card > .card-body {background-color: transparent; padding: 0.75rem;} .divy_flwr_pr_lst.type_02 > li .card > .card-body {padding: 0.5rem;} .divy_flwr_pr_lst > li .divy_flwr_pr_lst_img_wrap {width: 60%; height: 0; padding-bottom: 75%; position: relative; overflow: hidden; margin: 0 auto;} .divy_flwr_pr_lst > li.type_02 .divy_flwr_pr_lst_img_wrap {width: 100%; height: 0; padding-bottom: 125%;} .divy_flwr_pr_lst > li .divy_flwr_pr_lst_img_wrap > img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); object-fit: contain; width: 100%; height: 100%;} .divy_flwr_pr_lst > li dl {margin-top: 0.75rem; margin-bottom: 0; text-align: center;} .divy_flwr_pr_lst > li dl > dt {font-size: 1.25rem;} .divy_flwr_pr_lst.type_02 > li dl > dt {font-size: 1.125rem;} .divy_flwr_pr_lst > li dl > dd {margin-top: 0.25rem; font-weight: bold; font-size: 1.125rem;} .divy_flwr_pr_lst.type_02 > li dl > dd {font-size: 0.9rem;} .divy_flwr_pr_lst > li dl > dd > span:nth-child(1) {text-decoration: line-through; color: #6c757d; font-weight: 500;} .divy_flwr_pr_lst > li dl > dd > span:nth-child(2) {margin-left: 0.375rem; margin-right: 0.375rem;} .divy_flwr_pr_lst.type_02 > li dl > dd > span:nth-child(2) {margin-left: 0.25rem; margin-right: 0.25rem;} .divy_flwr_pr_lst > li dl > dd > span:nth-child(3) {color: #dc3545; font-size: 1.25rem;} .divy_flwr_pr_lst.type_02 > li dl > dd > span:nth-child(3) {font-size: 1rem;} /* 배송설치요청 - 상품소개 */ .dnt_prd_divy_instl_req_form .label-amt, .dnt_prd_divy_instl_req_form .label-text {display: block; text-align: center;} .dnt_prd_divy_instl_req_form .label-amt > em {font-weight: 500; font-size: 1rem;} .dnt_prd_divy_instl_req_form .label-text {font-weight: bold;} .dnt_prd_divy_instl_req_form .label-amt-fixed > em {font-size: 0.9rem;} .dnt_prd_divy_instl_req_form .label-amt-fixed > em:nth-child(1) {text-decoration: line-through; color: #6c757d; font-weight: 500;} .dnt_prd_divy_instl_req_form .label-amt-fixed > em:nth-child(2) {margin-left: 0.25rem; margin-right: 0.25rem;} .dnt_prd_divy_instl_req_form .label-amt-fixed > em:nth-child(3) {font-size: 1rem; color: #dc3545;} /* 청구관리 */ .calc_dsc_main_top_tabs {margin-top: 3rem;} .calc_dsc_main_top_tabs .row {margin-left: -0.5rem; margin-right: -0.5rem;} .calc_dsc_main_top_tabs .row > .col-6 {padding: 0 0.5rem;} .calc_dsc_main_top_tabs a {display: block; text-align: center; border: 1px solid #c2c2c2; font-weight: 400; font-size: 1.125rem; padding: 0.5rem 3rem; border-radius: 2rem;} .calc_dsc_main_top_tabs a.active {border-color: #3366b9; color: #3366b9; font-weight: 500; background-color: #e1e8f5;} .daflsharp_evt_info_popup {min-height: 600px !important; top: 0 !important;} /* 마이페이지 */ .dafl-mngt-main-wrap {margin-top: 1.5rem;} .dafl-mngt-main-wrap .card {border-radius: 0.5rem; overflow: hidden; box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);} .dafl-mngt-main-wrap .card-body {padding: 2rem;} .dafl-mngt-main-wrap .dafl_mngt_main_top_title {font-size: 1.75rem; font-weight: 700;} .dafl-mngt-main-top-left .dafl_mngt_main_top_info {margin-top: 1.25rem; padding: 0.5rem 1rem; background-color: #fff; border-radius: 0.5rem;} .dafl-mngt-main-top-left .dafl_mngt_main_top_info a {display: block;} .dafl-mngt-main-top-left .dafl_mngt_main_top_info span {background-color: #162b7d; border-radius: 3rem; display: inline-block; text-align: center; padding: 0rem 0.5rem; color: #fff; font-weight: 500;} .dafl-mngt-main-top-left .dafl_mngt_main_top_info > ul > li:not(:first-child) {margin-left: 1rem;} .dafl-mngt-main-top-left .dafl_mngt_main_top_btn_wrap .card {overflow: visible;} .dafl-mngt-main-top-left .dafl_mngt_main_top_btn_wrap {margin-top: 1.25rem;} .dafl-mngt-main-top-left .dafl_mngt_main_top_btn_wrap ul > li {width: 50%;} .dafl-mngt-main-top-left .dafl_mngt_main_top_btn_wrap ul > li:first-child {padding-right: 0.5rem;} .dafl-mngt-main-top-left .dafl_mngt_main_top_btn_wrap ul > li:nth-child(2) {padding-left: 0.5rem;} .dafl-mngt-main-top-left .dafl_mngt_main_top_btn_wrap ul > li .card:hover {transform: translateY(-5px); transition: all 0.25s; box-shadow: 0px 2px 3px 2px rgba(0,0,0,0.2);} .dafl-mngt-main-top-left .dafl_mngt_main_top_btn_wrap ul > li .card:hover > .card-body {filter: brightness(1.15); background-color: #3366b91a;} .dafl-mngt-main-top-left .dafl_mngt_main_top_btn_wrap ul > li .card-body {padding: 0;} .dafl-mngt-main-top-left .dafl_mngt_main_top_btn_wrap ul > li a {display: block; text-align: center; padding: 1.25rem; position: relative;} .dafl-mngt-main-top-left .dafl_mngt_main_top_btn_wrap ul > li a:hover {opacity: 1;} .dafl-mngt-main-top-left .dafl_mngt_main_top_btn_wrap ul > li a > i {display: block; font-size: 2.5rem; color: #3366b9;} .dafl-mngt-main-top-left .dafl_mngt_main_top_btn_wrap ul > li a > span {display: inline-block; margin-top: 0.75rem; font-size: 1.125rem; font-weight: 500;} .dafl-mngt-main-top-left .dafl_mngt_main_top_btn_wrap ul > li a > dl {text-align: left;} .dafl-mngt-main-top-left .dafl_mngt_main_top_btn_wrap ul > li a > dl > dt {font-weight: 500; font-size: 1.25rem; position: relative;} .dafl-mngt-main-top-left .dafl_mngt_main_top_btn_wrap ul > li a > dl > dt > i {position: absolute; top: 50%; right: 0; transform: translate(-50%, -50%); font-size: 1.5rem;} .dafl-mngt-main-top-left .dafl_mngt_main_top_btn_wrap ul > li a > dl > dd {color: #797979; font-weight: 400; margin-top: calc(0.5rem + 1.29px); font-size: 0.9rem; letter-spacing: -0.4px;} .dafl-mngt-main-top-left .dafl_mngt_main_top_btn_wrap ul > li a .dafl_speech_bubble_wrap {right: 0.25rem;} .dafl-mngt-main-top-right {padding-left: 1.25rem; vertical-align: top;} .dafl-mngt-main-top-right .dafl_mngt_main_top_title + div {margin-top: 1rem;} .dafl-mngt-main-top-right .dafl_mngt_main_top_bil_info {border-top: 1px solid #cfcfcf; margin-top: 1.5rem; padding-top: 1.625rem;} .dafl-mngt-main-top-right .dafl_mngt_main_top_bil_btn_group {margin-top: 1.5rem;} .dafl-mngt-main-top-right .dafl_mngt_main_top_bil_btn_group a.btn {display: block; border-radius: 0.5rem;} .dafl-mngt-main-top-right .dafl_mngt_main_top_bil_btn_group a.btn:not(:hover) {background-color: #fff;} .dafl-mngt-main-bottom-body {margin-top: 3rem;} /* 마이페이지 배송 예정 내역 카드폼 */ .dafl_mngt_divy_dsc_card_form {margin-left: -0.5rem; margin-right: -0.5rem;} .dafl_mngt_divy_dsc_card_form > li {padding: 0.5rem; width: 50%; display: inline-block; vertical-align: top;} .dafl_mngt_divy_dsc_card_form > li a {display: block; padding: 1.25rem;} .dafl_mngt_divy_dsc_card_form > li > .card:hover {transform: translateY(-5px); transition: all 0.25s ease-out; box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.35);} .dafl_mngt_divy_dsc_card_form > li a:focus, .dafl_mngt_divy_dsc_card_form > li a:hover {opacity: 1;} .dafl_mngt_divy_dsc_card_form .badge-lg {font-size: 0.9rem !important; padding: 0.125rem 1rem; vertical-align: text-top;} .dafl_mngt_divy_dsc_card_form_img_wrap {width: 100%; height: 0; padding-bottom: 133%; position: relative; border-radius: 0.5rem; overflow: hidden;} .dafl_mngt_divy_dsc_card_form_img_wrap > img {display: block; width: 100%; height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); object-fit: cover;} /* 다플샵 리뉴얼 */ /* 메인페이지 - 상단 버튼 리스트 */ .main_menu_btn_lst_wrap > dt > dl {text-align: center;} .main_menu_btn_lst_wrap > dt > dl > dt {font-size: 2rem; color: #162b7d;} .main_menu_btn_lst_wrap > dt > dl > dd {font-size: 1.5rem; color: #a9abae; font-weight: 500; margin-top: 0.625rem;} .main_menu_btn_lst {display: grid; grid-template-columns: repeat(6, 1fr); grid-template-rows: repeat(2, auto); gap: 1.25rem;} .main_menu_btn_lst > li:nth-child(1), .main_menu_btn_lst > li:nth-child(2) {grid-column: span 3; grid-row: 1;} .main_menu_btn_lst > li:nth-child(3), .main_menu_btn_lst > li:nth-child(4), .main_menu_btn_lst > li:nth-child(5) {grid-column: span 2; grid-row: 2;} .main_menu_btn {display: block; padding: 2.5rem 1rem 2rem; box-shadow: 0px 0px 13px 0px rgba(0,0,0,0.35); border-radius: 1.25rem; position: relative; min-height: 205px;} .main_menu_btn:after {content: ""; display: block; width: 90px; height: 0.5rem; background-color: #dfe4ef; top: 0; left: 50%; position: absolute; transform: translateX(-50%);} .main_menu_btn:hover, .main_menu_btn:focus {opacity: 1;} .main_menu_btn > * {text-align: center;} .main_menu_btn span {font-size: 2rem; font-weight: 700; color: #162b7d; letter-spacing: 1px;} .main_menu_btn_img_wrap {margin-top: 0.5rem;} .main_menu_btn_img_wrap > img {width: 90%; max-width: 160px; display: block; object-fit: contain; margin: 0 auto; max-height: 120px;} .main_menu_btn_lst > li:nth-child(1) .main_menu_btn_img_wrap > img, .main_menu_btn_lst > li:nth-child(2) .main_menu_btn_img_wrap > img {max-height: 180px;} .main_menu_btn:hover:after {background-color: #162b7d; transition: 0.25s all ease-in-out;} .main_menu_btn_lst > li:nth-child(1) .main_menu_btn, .main_menu_btn_lst > li:nth-child(2) .main_menu_btn {display: flex; justify-content: center; align-items: center; gap: 5rem;} .main_menu_btn_lst > li:nth-child(1) .main_menu_btn:after, .main_menu_btn_lst > li:nth-child(2) .main_menu_btn:after {width: 150px;} /* 상품목록 */ .divy_prd_list {padding-bottom: 5rem;} .divy_prd_list_det_wrap {margin-top: 1.25rem;} .divy_prd_list_det_form {margin-top: 1.25rem; border-top: 1px solid #c0c0c0; position: relative; padding-bottom: 2rem;} .divy_prd_list_item_lst {display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.75rem; grid-auto-rows: 1fr; padding-top: 3rem; padding-bottom: 2rem; gap: 3rem 2rem;} .divy_prd_list_item_wrap input[type="checkbox"] {display: none;} .divy_prd_list_item_optn_btn {display: block; padding: 0.375rem 0; display: block; border: 1px solid #3072dd; width: 80%; margin: 0 auto; text-align: center; color: #3366b9; border-radius: 0.5rem; cursor: pointer;} .divy_prd_list_item_wrap:not(.disabled) .divy_prd_list_item_optn_btn:hover {background-color: #3366b9eb; color: #fff; transition: all 0.15s ease-in-out; opacity: 0.8;} .divy_prd_list_item_wrap input[type="checkbox"]:checked ~ .divy_prd_list_item_info .divy_prd_list_item_optn_btn {background-color: #3366b9eb; color: #fff; opacity: 1;} .divy_prd_list_item_img_wrap {width: 90%; margin: 0 auto; padding-bottom: 90%; height: 0; position: relative; display: block;} .divy_prd_list_item_img_wrap > img {height: 90%;position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); object-fit: contain;} .divy_prd_list_item_info {margin-top: 0.5rem; text-align: center;} .divy_prd_list_item_info .badge {padding: 0.375rem 0.5rem; font-size: 0.85rem;} .divy_prd_list_item_info > dl {text-align: center; margin-top: 0.5rem;} .divy_prd_list_item_info label {margin-top: 1rem; display: block;} .dnt_prd_lst_info_pric {text-align: left;} .dnt_prd_lst_info_pric > span:nth-of-type(1) {font-weight: 500; color: #8c8c8a;} .dnt_prd_lst_info_pric > span:nth-of-type(2) {margin-right: 0.25rem; margin-left: 0.25rem; font-weight: 500;} .dnt_prd_lst_info_pric > span:nth-of-type(3) {color: #dc3545 !important;} .dnt_prd_lst_info_pric > span:last-of-type {font-size: 1.125rem; font-weight: bold; text-decoration: none; color: #333;} .dnt_prd_lst_info_pric_wrap { height: 78px; display: flex; align-items: center; width: 100%; margin-top: 0.25rem;} .dnt_prd_lst_info_pric_wrap .dnt_prd_lst_info_pric {text-align: right; display: block; flex: 1; max-width: 80%; margin: 0 auto;} .dnt_prd_lst_info_pric_wrap .dnt_prd_lst_info_pric > span:not(:nth-of-type(1)) {display: block;} .dnt_prd_lst_info_pric_wrap .dnt_prd_lst_info_pric > em {color: #dc3545; margin-right: 0.25rem; font-weight: bold; font-size: 0.9rem;} .dnt_prd_lst_info_pric_wrap .dnt_prd_lst_info_pric > span:nth-of-type(1) {margin: 0; font-weight: bold; font-size: 1.125rem; display: flex; justify-content: space-between; align-items: center; margin-top: 0.25rem;} .dnt_prd_lst_info_pric_wrap .dnt_prd_lst_info_pric > span:nth-of-type(2), .dnt_prd_lst_info_pric_wrap .dnt_prd_lst_info_pric > span:nth-of-type(3) {margin: 0; font-weight: bold; font-size: 1.125rem; display: flex; justify-content: space-between; align-items: center; margin-top: 0.25rem;} .dnt_prd_lst_info_pric_wrap .dnt_prd_lst_info_pric > span:nth-of-type(2) > em:first-of-type, .dnt_prd_lst_info_pric_wrap .dnt_prd_lst_info_pric > span:nth-of-type(3) > em:first-of-type {font-weight: 400; font-size: 0.75rem;} .dnt_prd_lst_info_pric_wrap .dnt_prd_lst_info_pric > span:nth-of-type(2) > em:last-of-type {text-decoration: line-through; font-size: 1.0625rem;} /* .dnt_prd_lst_info_pric_wrap .dnt_prd_lst_info_pric > span:nth-of-type(1) > em:last-of-type {text-decoration: line-through; font-size: 1.0625rem;} */ .dnt_prd_lst_info_pric_wrap .dnt_prd_lst_info_pric > span:last-of-type > em:last-of-type {text-decoration: none; font-size: 1.125rem;} .divy_prd_list_item_wrap.active .divy_prd_list_item_img_wrap {position: relative;} .divy_prd_list_item_wrap.active .divy_prd_list_item_img_wrap:before {content: ""; width: 100%; height: 100%; border: 2px solid #3366b9c2; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); border-radius: 0.5rem; background-color: #eef4ffc2;} .divy_prd_list_purch_btn_wrap {position: fixed; width: 100%; max-width: 1250px; bottom: 5rem; left: 50%; transform: translateX(-50%); padding-left: 250px;} .divy_prd_list_purch_btn {text-align: center; display: block; padding: 0.5rem 0; color: #44588d; font-size: 1.25rem; font-weight: 500; border: 1px solid #44588d; border-radius: 0.5rem; background-color: #c8d7ffbf; box-shadow: 0px 0px 3px rgba(0,0,0,0.35);} .divy_prd_list_purch_btn:hover {opacity: 1; color: #44588d;} .divy_prd_list_purch_btn_wrap.static {position: static; transform: none; padding-left: 0;} .divy_prd_list_purch_btn.active {background-color: #1a458ae0; border-color: #1a458ae0; color: #fff;} .divy_prd_list_purch_btn.active:hover {filter: brightness(1.25); transition: all 0.15s ease-in-out;} /* disabled */ .divy_prd_list_item_wrap.disabled a:hover {opacity: 1;} .divy_prd_list_item_wrap.disabled .divy_prd_list_item_info > span, .divy_prd_list_item_wrap.disabled .divy_prd_list_item_info > dl {opacity: 0.5;} .divy_prd_list_item_wrap.disabled .divy_prd_list_cat_badge {opacity: 0.7;} .divy_prd_list_item_wrap.disabled .divy_prd_list_item_img_wrap > img {opacity: 0.3;} .divy_prd_list_item_wrap.disabled .divy_prd_list_item_img_wrap:after {content: "해당 상품은 중복 선택이 불가능 합니다."; display: inline-block; white-space: nowrap; padding: 0.5rem 1rem; background-color: rgba(0, 0, 0, 0.6); color: #fff; font-size: 0.9rem; font-weight: bold; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);} .divy_prd_list_item_wrap.disabled .divy_prd_list_item_info > label > span {cursor: not-allowed;} .divy_prd_list_item_wrap.disabled .divy_prd_list_item_optn_btn {border-color: #bbb; background-color: #bbb; color: #fff;} /* 상품상세 */ .divy_prd_info .card > .card-body {padding: 1.25rem;} .divy_prd_info_top {display: table; table-layout: fixed; width: 100%; margin-top: 2rem;} .divy_prd_info_top > * {display: table-cell; vertical-align: top;} .divy_prd_info_top_img_wrap {width: 40%; height: 0; position: relative;} .divy_prd_info_top_img_wrap > img {position: absolute; top: 50%; left: 50%; height: 100%; transform: translate(-50%, -50%); object-fit: contain;} .divy_prd_info .dnt_prd_lst_info_pric {text-align: right; font-size: 1.125rem;} .divy_prd_info .dnt_prd_lst_info_pric > span:nth-of-type(2) {margin-left: 0.5rem; margin-right: 0.5rem;} .divy_prd_info .dnt_prd_lst_info_pric > span:last-of-type {font-size: 1.25rem;} .divy_prd_info_top_det_info .badge {padding: 0.5rem 0; font-size: 0.9rem; border-radius: 0.25rem; min-width: 100px;} .divy_prd_info_top_det_info {padding-left: 2rem;} .divy_prd_info_top_det_info > dl:first-of-type {margin-top: 1.25rem;} .divy_prd_info_top_det_info > dl:first-of-type > dt {padding-bottom: 1.25rem; border-bottom: 1px solid #ddd;} .divy_prd_info_top_det_info > dl:first-of-type > dt > span {font-size: 1.5rem;} .divy_prd_info_top_det_info > dl:first-of-type > dd {margin-top: 1.25rem; padding-bottom: 1.25rem; border-bottom: 1px solid #ddd;} .divy_prd_info_top_det_info > dl:last-of-type {display: flex; justify-content: space-between; align-items: center;} .divy_prd_info_top_det_info > dl:last-of-type > dt {font-size: 1.25rem; font-weight: 500;} .divy_prd_info_top_det_info > dl:last-of-type > dd {font-size: 1.5rem; font-weight: bold; color: #dc3545;} .divy_prd_info_top_det_info > dl:last-of-type > dd em {font-size: 1.25rem; font-weight: 500; color: #333;} .divy_prd_info_top_det_info > a {display: block; padding: 0.75rem 0; font-size: 1.125rem;} .divy_prd_info .dnt_prd_lst_info_pric_wrap {margin-top: -22px;} .divy_prd_info .dnt_prd_lst_info_pric_wrap .dnt_prd_lst_info_pric {text-align: right; max-width: 100%;} .divy_prd_info .dnt_prd_lst_info_pric_wrap .dnt_prd_lst_info_pric > span:nth-of-type(1) {font-size: 1.125rem;} .divy_prd_info .dnt_prd_lst_info_pric_wrap .dnt_prd_lst_info_pric > span:nth-of-type(2) {margin: 0; margin-top: 0.5rem;} .divy_prd_info .dnt_prd_lst_info_pric_wrap .dnt_prd_lst_info_pric > span:nth-of-type(2), .divy_prd_info .dnt_prd_lst_info_pric_wrap .dnt_prd_lst_info_pric > span:nth-of-type(3) {justify-content: flex-end; gap: 1rem;} .divy_prd_info .dnt_prd_lst_info_pric_wrap .dnt_prd_lst_info_pric > span:nth-of-type(2) > em:last-of-type, .divy_prd_info .dnt_prd_lst_info_pric_wrap .dnt_prd_lst_info_pric > span:nth-of-type(3) > em:last-of-type {min-width: 120px;} .divy_prd_info .dnt_prd_lst_info_pric_wrap .dnt_prd_lst_info_pric > span:nth-of-type(2) > em:last-of-type {font-size: 1.125rem;} .divy_prd_info .dnt_prd_lst_info_pric_wrap .dnt_prd_lst_info_pric > span:last-of-type > em:last-of-type {font-size: 1.25rem;} .divy_prd_info_bottom {margin-top: 5rem; position: relative; padding-bottom: 6rem;} .divy_prd_info_bottom .COMMON_TABS > .ui-widget-header {border-bottom-color: #ddd; margin-bottom: 1rem;} .divy_prd_info_bottom .COMMON_TABS.ui-tabs .ui-tabs-nav > li {margin-bottom: 0; margin-right: 1rem; border: none; background-color: transparent;} .divy_prd_info_bottom .COMMON_TABS.ui-tabs .ui-tabs-nav > li > a {font-weight: bold; padding: 0.5rem 1.25rem; font-size: 1.125rem; opacity: 1 !important;} .divy_prd_info_bottom .COMMON_TABS.ui-tabs .ui-tabs-nav > .ui-tabs-active {background-color: transparent; border: none; border-bottom: 4px solid #ad8b48;} .divy_prd_info_bottom .COMMON_TABS.ui-tabs .ui-tabs-nav > .ui-tabs-active > a {color: #ad8b48;} .divy_prd_info_bottom_cont_wrap {padding-left: 0.75rem; padding-right: 0.75rem;} .divy_prd_info_bottom_cont_wrap .card > .card-body {padding: 1.25rem 2.5rem;} .divy_prd_info_bottom_cont_wrap .card-body dl + dl {margin-top: 3rem;} .divy_prd_info_bottom_cont_wrap .card-body dl > dd {margin-top: 0.5rem; font-size: 0.95rem;} .divy_prd_info_bottom_cont_wrap .card-body dl > dd ul > li:not(:first-child) {margin-top: 0.25rem;} /* 상품주문,신청 */ .divy_prd_form_dl + .divy_prd_form_dl {margin-top: 3rem;} .divy_prd_form_dl {padding-left: 0.75rem; padding-right: 0.75rem;} .divy_prd_form_dl > dt {font-size: 1.375rem !important; padding: 0 0.5rem 0.75rem; border-bottom: 2px solid #333; font-weight: 500; position: relative;} .divy_prd_form_dl > dt > label {position: absolute; top: calc(50% - 0.375rem); right: 0.5rem; transform: translateY(-50%); font-size: 1rem;} .divy_prd_form_dl > dt > label input[type="checkbox"] {width: 1.125rem; height: 1.125rem; vertical-align: -0.1875rem; margin-right: 0.375rem;} .divy_prd_form_dl > dd {margin-top: 1rem !important;} .divy_prd_form_dl > dd > ul > li > ul > li:not(:first-child) {margin-top: 0.75rem;} .divy_prd_form_dl > dd > .table {margin-top: -1rem; border-top: none;} .ord_prd_lst {padding: 0 1rem 0.5rem; border-bottom: 2px solid #bfbfbf;} .ord_prd_lst > li:not(:first-child) {border-top: 1px solid #eaeaea;} .ord_prd_lst + div {margin-top: 2rem; padding-right: 1rem;} .ord_prd_lst + div > dl {display: flex; justify-content: flex-end; gap: 1.5rem; align-items: center;} .ord_prd_lst + div > dl > dt {font-size: 1.25rem; font-weight: 500;} .ord_prd_lst + div > dl > dd {font-size: 1.375rem; font-weight: bold; color: #dc3545;} .ord_prd_lst + div > dl > dd > span {margin-left: 0.25rem; font-size: 1.5rem;} .ord_prd_form {padding: 1rem 1rem 1rem 5rem; position: relative;} .ord_prd_form > a {position: absolute; top: 50%; left: 1rem; transform: translateY(-50%); font-size: 2rem; padding: 0.5rem; line-height: 1; color: #929292;} .ord_prd_form > ul {display: table; table-layout: fixed; width: 100%;} .ord_prd_form > ul> li {display: table-cell; vertical-align: middle;} .ord_prd_form > ul> li:last-child, .ord_prd_form > ul> li:last-child .dnt_prd_lst_info_pric {text-align: right;} .ord_prd_form_img_wrap {width: 150px; height: 150px; position: relative; display: block;} .ord_prd_form_img_wrap > img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; object-fit: contain;} .ord_prd_form > ul > li .badge {padding: 0.375rem 0.5rem; font-size: 0.85rem;} .ord_prd_form > ul > li dl {margin-top: 0.25rem;} .ord_prd_form > ul > li dl > dt {font-size: 1.125rem;} .ord_prd_form > ul > li dl > dd {margin-top: 0.25rem;} .divy_prd_form_dl > dd > ul > li > ul > li .input-group-text {min-width: 100px; justify-content: center;} .rpst_apl_checkbox {width: 1.25rem; height: 1.25rem;} .rpst_apl_checkbox + span {display: inline-block; vertical-align: 0.25rem;} .prd_divy_prd_form_scroll_btn_wrap {position: fixed; width: 1000px; bottom: 2.5rem; z-index: 50; display: none;} .prd_divy_prd_form_scroll_btn_wrap.static {position: absolute; bottom: 2rem;} .prd_divy_prd_form_scroll_btn_wrap > a {display: block; padding: 0.75rem 0; font-size: 1.125rem;} .img_exist {width: 200px; height: 200px;} .invt_card_file_path_lst_wrap {display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem 0.75rem;} .invt_card_file_path_lst_wrap > li > div {width: 100%; height: 0; padding-bottom: 100%; overflow: hidden;} .invt_card_file_path_lst_wrap > li > div img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; object-fit: contain;} .rcv_sms_form {display: none;} /* 레이아웃 개선 */ .dafl_v3_body:not(.main_body) #layout_content_body_wrap {display: flex; justify-content: center; align-items: flex-start; gap: 1rem; max-width: 1000px;} #layout_content_body_wrap:after {display: none;} #layout_content_body_wrap > * {float: none;} #layout_content_body_left {padding-right: 0;} #layout_content_body_right {max-width: 1000px; width: 100%; padding-bottom: 3rem;} /* 레이아웃 - 상단메뉴 */ .dafl_top_header {display: none;} #layout_top_wrap {top: 0 !important;} .top_menu_fixed {max-width: 1000px;} #layout_top_wrap {top: 0 !important;} .layout_top_logo_wrap {padding-top: 1rem; padding-bottom: 1rem;} .scrol-down .top_menu_fixed .layout_top_logo_wrap {padding-top: 0; padding-bottom: 0;} #layout_top_wrap #layout_top_menu_wrap {height: auto;} .top_menu_fixed {display: flex; justify-content: space-between; align-items: center; position: relative; gap: 2rem;} .layout_top_menu_nm {font-weight: bold; letter-spacing: 1px; transition: font-size 0.1s ease-in-out; position: absolute; top: 50%; left: 50%; white-space: nowrap; transform: translate(-50%, -50%);} .top_menu_fixed:after {display: none;} .scrol-down .layout_top_menu_nm {font-size: 1.5rem; transition: font-size 0.2s ease-in-out;} /* 상단 헤더 리뉴얼 */ .layout_top_menu_nm_lst {display: flex; flex: 1; justify-content: space-between; gap: 1.5rem; align-items: center;} .layout_top_menu_nm_lst > li > a {font-size: 1.125rem; font-weight: 500; transition: font-size 0.1s ease-in-out; white-space: nowrap;} .layout_top_menu_nm_lst > li > a > div {display: block; line-height: 1;} .layout_top_menu_nm_lst > li.active > a {color: #3366B9; font-weight: bold;} .layout_top_menu_nm_lst > li.active {position: relative;} .layout_top_menu_nm_lst > li.active:after {content: ""; position: absolute; bottom: calc(-1.5rem + 5px); left: 50%; transform: translatex(-50%); width: calc(100% + 1rem); height: 4px; background-color: #3366B9;} .scrol-down .layout_top_menu_nm_lst > li.active:after {bottom: calc(-0.5rem + 1px);} .layout_top_func_menu {margin-right: -1.25rem;} .layout_top_func_menu > ul {white-space: nowrap;} .layout_top_func_menu > ul > li {display: inline-block; padding: 0 0.625rem; position: relative;} .layout_top_func_menu > ul > li:not(:first-child):before {content: ""; width: 2px; height: 50%; background-color: #e0e0e0; position: absolute; top: 50%; left: 0; transform: translateY(-50%);} .layout_top_func_menu > ul > li > a {display: block; padding: 0.25rem; color: #696969; font-weight: 500; font-size: 0.9rem; transition: font-size 0.1s ease-in-out;} .scrol-down .layout_top_menu_nm_lst > li > a {font-size: 1rem; transition: font-size 0.2s ease-in-out;} .scrol-down .layout_top_func_menu > ul > li > a {font-size: 0.85rem; transition: font-size 0.2s ease-in-out;} .main_body #layout_content_body_wrap {padding-top: 110px;} .main_body .main-section-wrap > * {max-width: calc(1000px + 2rem);} .form_surv_wrap .container {max-width: calc(1000px + 2rem);} .footer_wrap {max-width: calc(1000px + 2rem);} /* 메인페이지 */ .dafl_main_top_banner_wrap {width: 1000px; max-width: none !important; padding: 0;} .dafl_main_top_banner_wrap > div {box-shadow: none; border-radius: 0;} .dafl_main_top_banner_wrap > div > ul > li:not(.swiper-slide-active) img {filter: blur(1px);} .dafl_main_top_banner_wrap > div > ul > li img {box-shadow: 4px 4px 3px 0px rgba(0,0,0,0.25);} .dafl_main_top_banner_wrap .swiper-button-prev, .dafl_main_top_banner_wrap .swiper-button-next {background-image: none; font-family: "Font Awesome 5 Pro"; top: auto; top: 50%; transform: translateY(-50%); width: auto; height: auto; margin-top: 0;} .dafl_main_top_banner_wrap .swiper-button-prev {left: 20px;} .dafl_main_top_banner_wrap .swiper-button-next {right: 20px;} .dafl_main_top_banner_wrap .swiper-button-prev:after {content: "\f053"; color: #fff; font-size: 1.125rem; font-weight: 300;} .dafl_main_top_banner_wrap .swiper-button-next:after {content: "\f054"; color: #fff; font-size: 1.125rem; font-weight: 300;} .dafl_main_top_banner_wrap .swiper_func_wrap {position: absolute; display: inline-block; width: auto; left: 79.5%; bottom: 0; transform: translate3d(-50%, 0, 0); color: #fff; padding: 0.375rem 3rem; background-color: #0009; z-index: 10; font-size: 0.9rem;} .dafl_main_top_banner_wrap .swiper-pagination {position: static;} .main_menu_btn_lst {gap: 1.25rem;} .main_menu_btn {padding: 1.75rem 1rem 1.25rem;} .main_menu_btn span {font-size: 1.75rem; white-space: nowrap; color: #333;} .main_menu_btn:hover {box-shadow: 0px 0px 13px 0px #162b7d; transition: 0.25s all ease-in-out;} .main_menu_btn:hover span {color: #162b7d; transition: 0.25s all ease-in-out;} /* 서브페이지 */ .sub_body #layout_content_body_wrap {padding-top: 100px;} #layout_content_body_nav {display: none;} .divy_prd_list_purch_btn_wrap {max-width: 1000px; padding-left: 0; display: none;} /* 액자화환 */ .frame_wrth_intro_top_cont {left: 2rem;} .frame_wrth_intro_top_cont dl > dd > ul > li:first-child {word-break: keep-all;} .frame_wrth_intro_top_bg {padding-bottom: 47.5%;} .frame_wrth_intro_top_bg > img {width: 250px; right: 2rem;} /* 앱 다운로드 안내 */ .app_dl_guid_info .dafl_app_dl_guid_form_wrap {padding-top: 2rem; padding-left: 0; padding-right: 0;} /* 배송상세 페이지 수정 작업 */ .dafl_divy_sta_words > .alert {margin-top: 1rem; text-align: center;} .dafl_divy_sta_words > .alert > dl {color: #333; display: inline-block; text-align: left; letter-spacing: 0.5px;} .dafl_divy_sta_words > .alert > dl > dt {font-size: 1.75rem;} .dafl_divy_sta_words > .alert > dl > dd {margin-top: 0.75rem;} .dafl_divy_sta_words > .alert > dl > dd > dl > dt {font-weight: 500; font-size: 1.125rem;} .dafl_divy_sta_words > .alert > dl > dd > dl > dd {display: flex; justify-content: space-between; align-items: center;} .dafl_divy_sta_words > .alert > dl > dd > dl > dd:first-of-type {margin-top: 0.5rem;} .dafl_divy_sta_words > .alert > dl > dd > dl > dd:last-of-type {margin-top: 0.25rem;} .dafl_divy_sta_words > .alert > dl > dd > dl > dd > span:first-of-type {font-size: 1rem;} .dafl_divy_sta_words > .alert > dl > dd > dl > dd > span:last-of-type {font-size: 1.25rem; font-weight: bold; color: #162b7d;} .dafl_divy_sta_det_info_top_lst > li > dl {display: flex; justify-content: flex-start; align-items: center; gap: 1.25rem;} .dafl_divy_sta_det_info_top_lst > li:not(:first-child) {margin-top: 0.5rem !important;} .divy_sta_img_lst_form {margin-top: 2rem;} .divy_sta_img_lst_wrap > dt {font-size: 1.125rem;} .divy_sta_img_lst_wrap > dd {margin-top: 0.75rem;} li:not(.addn_cfg_item) .divy_sta_img_lst_wrap > dd > ul > li:not(:first-child) {margin-top: 1rem;} .wrth_img_wrap, .frame_wrth_img_wrap {padding: 2%;} .wrth_info_img_wrap, .frame_wrth_info_img_wrap {padding: 0.25rem; position: relative; width: 100%; padding-bottom: 100%; height: 0;} .wrth_info_img_wrap img, .frame_wrth_info_img_wrap img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: calc(100% - 0.5rem); height: calc(100% - 0.5rem); object-fit: contain;} .divy_sta_img_lst_wrap .dafl_instl_photo_wrap {border: 1px solid #dee2e6;} .divy_sta_img_lst_container {display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem 1rem; grid-auto-rows: 1fr;} .divy_sta_img_lst_container .addn_cfg_item {grid-column: span 2;} .divy_sta_img_lst_container .addn_cfg_item .divy_sta_img_lst_wrap > dd > ul {display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; grid-auto-rows: 1fr;} .JS-addTypeForm + .JS-addTypeForm {margin-top: 1rem;} /* 액자화환 작품선택 다이얼로그 */ .img_prdu_list_wrap {display: grid; grid-template-columns : repeat(4, 1fr); gap: 1.5rem 0.75rem;} .img_prdu_list_wrap > li {position: relative; overflow: hidden;} .img_prdu_list_wrap > li > h6 {white-space: nowrap; text-overflow: ellipsis; overflow: hidden;} .img_resize_btn {position: absolute;right:0;top:0;background-color: #FFF;border:1px solid #DDD;padding: 5px 10px;border-radius: 0.25rem;} .okflag_frame_wrth_prd_btn {position: relative; width: 100%; padding-bottom: 66%; height: 0;} .okflag_frame_wrth_prd_btn > p {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background-repeat: no-repeat; width: 100%; height: 100%; background-size: contain; background-position: center center;} /* 리본 문구 */ .wrth_img_wrap {position: relative;} .wrth_img_wrap > img {width: 100%;} .wrth_cont {font-weight: bolder; font-size: 1.25rem; position: absolute; background-color: transparent; padding: 0.75rem 0 2rem; white-space: nowrap; line-height: 1;} .wrth_cont > div {color: #241917; letter-spacing: 3px; word-spacing: -10px; text-shadow: 0px 0px 1px rgba(0,0,0,0.5); writing-mode: vertical-rl; text-orientation: upright;} .wrth_cont > div > span {display: inline-block; width: 100%;} .wrth_cont > div > span > font {display: flex; justify-content: space-around; width: 100%; align-items: center;} .wrth_cont > div > span > font em {min-width: 0.25rem; min-height: 0.25rem;} .wrth_left_cont {transform-origin: top left; height: 0;} .wrth_right_cont {transform-origin: top right; height: 0;} .wrth_left_cont > div, .wrth_right_cont > div {position: absolute; height: 100%; top: 0; width: 100%;} /* 홍삼근조기 리본문구 */ .wrth_img_wrap[data-number="2105"] .wrth_left_cont {top: 20%; left: 10.9%; transform: rotate(0deg); padding-bottom: 126%; width: 10%;} .wrth_img_wrap[data-number="2105"] .wrth_right_cont {top: 20%;right: 11%; transform: rotate(0deg); padding-bottom: 126%; width: 11%;} /* 리본근조기 리본문구 */ .wrth_img_wrap[data-number="2005"] .wrth_left_cont {top: 19%; left: 10%; transform: rotate(0deg); padding-bottom: 128%; width: 10%;} .wrth_img_wrap[data-number="2005"] .wrth_right_cont {top: 19%;right: 13.1%; transform: rotate(0deg); padding-bottom: 128%; width: 10%;} /* 리본축하기 리본문구 */ .wrth_img_wrap[data-number="1005"] .wrth_left_cont {top: 19%; left: 10.9%; transform: rotate(0deg); padding-bottom: 121%; width: 10%;} .wrth_img_wrap[data-number="1005"] .wrth_right_cont {top: 19%;right: 12.5%; transform: rotate(0deg); padding-bottom: 121%; width: 10%;} /* 근조화환(3단) 리본문구 */ .wrth_img_wrap[data-number="2016"] .wrth_left_cont {top: 18%; left: 31.9%; transform: rotate(6.7deg); padding-bottom: 115%; width: 8%;} .wrth_img_wrap[data-number="2016"] .wrth_right_cont {top: 18%;right: 30.9%; transform: rotate(-7.5deg); padding-bottom: 115%; width: 8%;} /* 근조화환(4단) 리본문구 */ .wrth_img_wrap[data-number="2026"] .wrth_left_cont {top: 18%; left: 31.9%; transform: rotate(10.6deg); padding-bottom: 115%; width: 7%;} .wrth_img_wrap[data-number="2026"] .wrth_right_cont {top: 18%;right: 35.9%; transform: rotate(-8.3deg); padding-bottom: 115%; width: 7%;} /* 축하화환(3단) 리본문구 */ .wrth_img_wrap[data-number="1016"] .wrth_left_cont {top: 18%; left: 30.4%; transform: rotate(10.9deg); padding-bottom: 115%; width: 8%;} .wrth_img_wrap[data-number="1016"] .wrth_right_cont {top: 18%;right: 32.5%; transform: rotate(-11.5deg); padding-bottom: 115%; width: 8%;} /* 축하화환(3단) 리본문구 */ .wrth_img_wrap[data-number="1026"] .wrth_left_cont {top: 18%; left: 32.8%; transform: rotate(12.9deg); padding-bottom: 115%; width: 8%;} .wrth_img_wrap[data-number="1026"] .wrth_right_cont {top: 18%;right: 32.1%; transform: rotate(-12.5deg); padding-bottom: 115%; width: 8%;} /* 액자화환 문구 */ .frame_wrth_img_wrap {position: relative;} .frame_wrth_cont_wrap {position: absolute; top: 35.25%; left: 48%; transform: translateX(-50%); width: 32.5%; height: 28.75%;} .frame_wrth_cont {display: flex; flex-direction: column; justify-content: space-between; height: 100%;} .frame_wrth_cont_top {font-weight: bold; text-align: center; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 2;line-clamp: 2; word-break: keep-all;} .frame_wrth_cont_middle {display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 4; line-clamp: 4; text-align: center;} .frame_wrth_cont_bottom {font-weight: bold; text-align: center; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 2;line-clamp: 2; word-break: keep-all;} #okflagGroupIndvdlMemAftCalcAplInfo ul > li:first-child .form-control {padding: 0.1875rem 0.75rem;} #okflagGroupIndvdlMemAftCalcAplInfo .input-group-prepend > span {width: 200px; justify-content: center;} #okflagGroupIndvdlMemAftCalcAplInfo .input-group-append > a.btn {width: 120px; text-align: center;} /* 추천인 + 포인트적립내역 */ .dafl_rcmdr_info_form > ul {display: flex; justify-content: flex-start; align-items: center; gap: 1rem;} .dafl_rcmdr_info_form > ul > li:first-child {font-size: 1.25rem;} .dafl_rcmdr_info_form > ul > li > dl {display: flex; justify-content: flex-start; align-items: center; gap: 0.5rem; color: #6c757d;} .dafl_rcmdr_info_form > ul > li:last-child > dl > dt {font-weight: 500;} .dafl_rcmdr_sys_guid > div:first-of-type {padding-bottom: 0.5rem; border-bottom: 1px solid #6C757D;} .dafl_rcmdr_sys_guid > div:first-of-type span {font-weight: bold;} .dafl_rcmdr_sys_guid > div:first-of-type em {text-decoration: underline;} .dafl_rcmdr_sys_guid > div:last-of-type {margin-top: 0.5rem; text-align: right;} .dafl_rcmdr_sys_guid > div:last-of-type > dl {display: flex; justify-content: flex-end; align-items: center; gap: 0.75rem; font-size: 1.5rem;} .dafl_rcmdr_sys_guid > div:last-of-type > dl > dt {font-weight: 400;} .dafl_rcmdr_sys_guid > div:last-of-type > dl > dd {font-weight: bold;} .dafl_rcmdr_info_table thead > tr > th {font-size: 0.9rem;} .dafl_rcmdr_info_table tbody > tr > td {font-size: 0.9rem;} .dafl_rcmdr_info_table tbody > tr > td a.btn {font-size: 0.75rem;} .dafl_poss_cupn_lst {display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; grid-auto-rows: 1fr;} .dafl_poss_cupn_lst .card {border-radius: 0.75rem; box-shadow: 0px 0px 4px rgba(0,0,0,0.25); height: 100%;} .dafl_poss_cupn_lst .card > .card-body {background-color: transparent; padding: 1rem;} .dafl_poss_cupn_top {display: flex; justify-content: flex-start; align-items: center; gap: 1rem;} .dafl_poss_cupn_top ul > li:not(:first-child) {margin-top: 0.375rem;} .dafl_poss_cupn_top dl {font-size: 0.85rem;} .dafl_poss_cupn_top dl > dt {color: #6c757d;} .dafl_poss_cupn_top dl > dd {margin-top: 0.25rem; font-weight: bold;} .dafl_poss_cupn_bottom {margin-top: 0.5rem; font-weight: bold; font-size: 0.95rem; color: #6c757d; word-break: keep-all;} /* 상품 주문, 신청 페이지 레이아웃 및 폼 수정 */ .dnt_prd_divy_instl_req_form { justify-content: space-between; align-items: flex-start; gap: 1rem; padding-bottom: 10rem !important;} .dnt_prd_divy_instl_req_left_form {flex: 1;} .dnt_prd_divy_instl_req_right_form {width: 280px; position: relative;} .dnt_prd_divy_instl_req_sttl_info_wrap {position: fixed; top: 100px; left: 50%; transform: translateX(-50%); width: 1000px; transition: top 0.1s ease-in-out;} .scrol-down .dnt_prd_divy_instl_req_sttl_info_wrap {top: 70px; transition: top 0.1s ease-in-out;} .dnt_prd_divy_instl_req_sttl_info {position: absolute; width: 280px; top: 0; right: 0; background-color: #EDEDED; padding: 0.625rem; border-radius: 0.75rem; overflow: hidden; box-shadow: 2px 2px 4px rgba(0,0,0,0.15);} .dnt_prd_divy_instl_req_sttl_info_top {padding: 0.5rem 0.75rem; background-color: #D8DDE2;} .dnt_prd_divy_instl_req_sttl_info_top > dl > dt {font-size: 1.125rem;} .dnt_prd_divy_instl_req_sttl_info_top > dl > dd {margin-top: 0.25rem;} .dnt_prd_divy_instl_req_sttl_info_top > dl > dd > dl > dt {font-weight: 500;} .dnt_prd_divy_instl_req_sttl_info_top > dl > dd > dl > dd {margin-top: 0.125rem; color: #6C757D; font-size: 0.85rem;} .dnt_prd_divy_instl_req_sttl_info_middle > ul > li {margin-top: 0.5rem;} .dnt_prd_divy_instl_req_sttl_info_middle > ul > li > dl {display: flex; justify-content: space-between; align-items: center; font-size: 1.125rem;} .dnt_prd_divy_instl_req_sttl_info_middle > ul > li > dl > dt {font-weight: 500;} .dnt_prd_divy_instl_req_sttl_info_middle > ul > li > dl > dd {font-weight: 500;} .dnt_prd_divy_instl_req_sttl_info_middle > ul > li:nth-child(2) > dl > dd {color: #FF0000;} .dnt_prd_divy_instl_req_sttl_info_middle > ul > li > ul > li {margin-top: 0.5rem;} .dnt_prd_divy_instl_req_sttl_info_middle > ul > li > ul > li > dl {display: flex; justify-content: space-between; align-items: center; font-size: 1rem; color: #6C757D;} .dnt_prd_divy_instl_req_sttl_info_middle > ul > li > ul > li > dl > dt {font-weight: 400;} .dnt_prd_divy_instl_req_sttl_info_middle > ul > li > ul > li > dl > dt > span {font-weight: 300;} .dnt_prd_divy_instl_req_sttl_info_middle > ul > li > ul > li > dl > dd {font-size: 0.9rem; letter-spacing: 0.25px;} .dnt_prd_divy_instl_req_sttl_info_bottom {padding-top: 0.75rem; margin-top: 0.5rem; border-top: 1px dashed #8C9399; padding-bottom: 0.25rem;} .dnt_prd_divy_instl_req_sttl_info_bottom > dl {display: flex; justify-content: space-between; align-items: center; color: #004596;} .dnt_prd_divy_instl_req_sttl_info_bottom > dl > dt {font-size: 1.25rem; font-weight: 500;} .dnt_prd_divy_instl_req_sttl_info_bottom > dl > dd {font-weight: bold; font-size: 1.5rem; letter-spacing: 0.25px;} .dnt_prd_divy_apl_meth_lst {display: flex; justify-content: flex-start; align-items: center; gap: 1.25rem;} .dnt_prd_divy_apl_meth_lst input[type="radio"] {width: 1.125rem; height: 1.125rem; vertical-align: -0.1875rem;} .rcmdr_guid_cont {font-size: 0.85rem; color: #6C757D;} .rcmdr_guid_cont span {font-weight: bold;} .rcmdr_guid_cont em {text-decoration: underline;} .rcmdr_guid_cont + a {font-weight: 500; color: #6C757D; font-size: 0.9rem;} .pint_use_set_form {display: flex; justify-content: flex-start; align-items: flex-end; gap: 0.5rem;} .pint_use_set_form > * {width: auto;} .pint_use_set_form > div:last-of-type {font-size: 0.9rem; color: #6C757D; font-weight: 500; letter-spacing: 0.15px;} .dnt_prd_divy_instl_req_bottom_form {position: fixed; bottom: 0; left: 50%; transform: translateX(-50%); width: 100%; border-top: 2px solid #D4D4D4; box-shadow: 0px -2px 3px rgba(0,0,0,0.15); background-color: #fff; z-index: 100;} .dnt_prd_divy_instl_req_bottom_form_body {max-width: 1000px; margin: 0 auto; padding: 0.75rem; display: flex; justify-content: space-between; align-items: center;} .dnt_prd_divy_instl_req_bottom_form_body > ul {display: flex; justify-content: flex-end; align-items: stretch; gap: 0.5rem;} .dnt_prd_divy_instl_req_bottom_form_body > ul > li > a {padding: 0.5rem 1rem; border-radius: 0.25rem; min-width: 15rem; height: 100%;} .dnt_prd_divy_instl_req_bottom_form_body > ul > li:first-child > a {background-color: #004596; border: 2px solid #004596; color: #fff;} .dnt_prd_divy_instl_req_bottom_form_body > ul > li:last-child > a {border: 2px solid #004596; color: #004596; display: flex; align-items: center; justify-content: center;} .dnt_prd_divy_instl_req_bottom_form_body > ul > li:first-child > a:hover {opacity: 1; filter: brightness(1.25); transition: all 0.15s ease-in-out;} .dnt_prd_divy_instl_req_bottom_form_body > ul > li:last-child > a:hover {opacity: 1; background-color: #004596; color: #fff; transition: all 0.15s ease-in-out;} .dnt_prd_divy_instl_req_bottom_form_body > ul > li > a > dl {text-align: center;} .dnt_prd_divy_instl_req_bottom_form_body > ul > li > a > dl > dt {font-size: 1.125rem;} .dnt_prd_divy_instl_req_bottom_form_body > ul > li > a > dl > dd {color: #FFC107; font-size: 0.9rem;} /* 상품 주문/신청 쿠폰 선택 폼 추가 */ .cupn_cupn_prd_selt_form {padding: 0.5rem; margin-top: 0.5rem;} .cupn_cupn_prd_selt_form > dl > dt {font-size: 1.125rem; font-weight: 500;} .cupn_cupn_prd_selt_form > dl > dd {margin-top: 1rem;} .cupn_cupn_prd_selt_form > dl > dd > ul > li {position: relative; padding: 0.5rem;} .cupn_cupn_prd_selt_form > dl > dd > ul > li:not(:first-child) {border-top: 1px dashed #ddd;} .cupn_cupn_prd_selt_lst_wrap {display: flex; justify-content: flex-start; align-items: center; gap: 0.5rem;} .cupn_cupn_prd_selt_lst_wrap > label {display: block; flex: 1;} .cupn_cupn_prd_selt_lst_wrap > label > ul {display: flex; justify-content: space-between; align-items: center; gap: 2rem;} .cupn_cupn_prd_selt_lst_wrap > label > ul > li:nth-child(2) {width: 100px;} .cupn_cupn_prd_selt_lst_wrap > label > ul > li:nth-child(3) {text-align: center;} .cupn_cupn_prd_selt_lst_wrap > label > ul > li:nth-child(3), .cupn_cupn_prd_selt_lst_wrap > label > ul > li:nth-child(4) {flex: 1;} .cupn_cupn_prd_selt_lst_wrap > label > ul > li:nth-child(4) {display: flex; justify-content: center; align-items: center; gap: 1rem;} .cupn_cupn_prd_selt_lst_wrap > label > ul > li:nth-child(4) > span:nth-of-type(1) {color: #6c757d; text-decoration: line-through;} .cupn_cupn_prd_selt_lst_wrap > label > ul > li:nth-child(4) > dl {display: flex; justify-content: center; align-items: center; gap: 0.5rem; color: #dc3545;} .cupn_cupn_prd_selt_lst_wrap > label > ul > li:nth-child(4) > dl > dt {font-weight: 400;} .cupn_cupn_prd_selt_lst_wrap > label > ul > li:nth-child(4) > dl > dd {font-weight: bold; font-size: 1.125rem;} .cupn_cupn_prd_selt_lst_wrap > input[type="radio"]:checked + label:before {content: ""; position: absolute; width: 100%; height: 100%; top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: #162b7d1a;} .cupn_cupn_prd_selt_lst_wrap .ord_prd_form_img_wrap {width: 5rem; height: 5rem;} .cupn_cupn_prd_selt_info_form {padding: 3rem 0.75rem 0; border-top: 0.75rem solid #f2f2f2; margin-top: 5rem !important;} .cupn_cupn_prd_selt_info_form > ul > li:not(:first-child) {margin-top: 1rem;} .cupn_cupn_prd_selt_info_form > ul > li > dl {display: flex; justify-content: space-between; align-items: center;} .cupn_cupn_prd_selt_info_form > ul > li > dl > dt {font-size: 1.375rem; font-weight: 500;} .cupn_cupn_prd_selt_info_form > ul > li > dl > dd {font-size: 1.5rem; font-weight: bold;} /* * 멤버십 */ .memshp-info .premium-container { max-width: 1200px; margin: 0 auto; padding: 40px 20px; } .memshp-info .promotion-banner { background: linear-gradient(135deg, #1a237e, #000051); color: white; padding: 25px; border-radius: 10px; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1); border-bottom-left-radius: 0; border-bottom-right-radius: 0;} .memshp-info .membership-card { background: white; border: none; border-radius: 15px; box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12);} .memshp-info .membership-card.card > .card-body {padding: 1.25rem;} .memshp-info .card-header {padding: 0;} .memshp-info .product-card { border: none; border-radius: 15px; margin-bottom: 30px; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08); transition: all 0.3s ease; overflow: hidden; } .memshp-info .product-card:hover { transform: translateY(-5px); box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15); } .memshp-info .product-card img { width: 100%; height: 250px; object-fit: contain; transition: transform 0.3s ease; } .memshp-info .product-card:hover img { transform: scale(1.05); } .memshp-info .discount-badge { position: absolute; top: 15px; right: 15px; background: linear-gradient(135deg, #d32f2f, #b71c1c); color: white; padding: 8px 15px; border-radius: 25px; font-weight: 600; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2); } .memshp-info .product-card .card-body { padding: 20px; background: white; } .memshp-info .original-price { text-decoration: line-through; color: #9e9e9e; font-size: 0.95em; margin-bottom: 5px; } .memshp-info .discount-price { color: #d32f2f; font-weight: bold; font-size: 1.3em; margin-bottom: 0; } .memshp-info .btn-premium { background: linear-gradient(135deg, #24292e, #000000); border: none; padding: 12px 30px; border-radius: 30px; font-weight: 600; letter-spacing: 0.5px; transition: all 0.3s ease; } .memshp-info .btn-premium:hover { transform: translateY(-2px); box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2); } .memshp-info .custom-control-label::before { background-color: #f8f9fa; border: 2px solid #24292e; } .memshp-info .custom-checkbox .custom-control-input:checked ~ .custom-control-label::before { background-color: #24292e; border-color: #24292e; } .memshp-info .section-title { font-size: 2em; font-weight: 700; margin-bottom: 30px; color: #24292e; text-align: center; position: relative; padding-bottom: 15px; } .memshp-info .section-title::after { content: ''; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 60px; height: 3px; background: linear-gradient(135deg, #24292e, #000000); } .memshp-info .membership-price { text-align: center; padding: 30px 20px; background: linear-gradient(135deg, #f8f9fa, #ffffff); border-radius: 10px; margin: 0 0 20px; word-break: keep-all;} .memshp-info .premium-sub-container { margin: 0 auto; } .memshp-info .cancel-card { background: white; border: none; border-radius: 15px; box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12); margin-bottom: 40px; } .memshp-info .warning-header { background: linear-gradient(135deg, #d32f2f, #b71c1c); color: white; padding: 25px; border-radius: 15px 15px 0 0; text-align: center; } .memshp-info .benefits-section { background: linear-gradient(135deg, #1a237e, #000051); color: white; padding: 30px 0; border-radius: 15px; margin-bottom: 40px; } .memshp-info .section-title { font-size: 2em; font-weight: 700; margin-bottom: 30px; text-align: center; position: relative; padding-bottom: 15px; } .memshp-info .section-title::after { content: ''; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 60px; height: 3px; background: white; } .memshp-info .btn-cancel { background: #d32f2f; border: none; padding: 12px 30px; border-radius: 30px; font-weight: 600; letter-spacing: 0.5px; transition: all 0.3s ease; } .memshp-info .btn-cancel:hover { background: #b71c1c; transform: translateY(-2px); box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2); } .memshp-info .btn-keep { background: #24292e; border: none; padding: 12px 30px; border-radius: 30px; font-weight: 600; letter-spacing: 0.5px; transition: all 0.3s ease; } .memshp-info .btn-keep:hover { background: #000000; transform: translateY(-2px); box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2); } .memshp-info .product-slide { background: white; border-radius: 15px; padding: 20px; margin: 10px; text-align: center; } .memshp-info .product-slide img { width: 100%; height: 200px; object-fit: cover; border-radius: 10px; margin-bottom: 15px; } .memshp-info .carousel-control-prev, #memshp-info .carousel-control-next { width: 40px; height: 40px; background: rgba(0, 0, 0, 0.8); border-radius: 50%; top: 50%; transform: translateY(-50%); } .memshp-info .original-price { text-decoration: line-through; color: #9e9e9e; font-size: 0.95em; } .memshp-info .discount-price { color: #d32f2f; font-weight: bold; font-size: 1.3em; } .memshp-info .discount-badge { background: linear-gradient(135deg, #d32f2f, #b71c1c); color: white; padding: 5px 10px; border-radius: 15px; font-size: 0.9em; margin-bottom: 10px; display: inline-block; } .memshp-info .benefits-list { background: rgba(255, 255, 255, 0.1); border-radius: 15px; padding: 30px; margin-bottom: 30px; } .memshp-info .benefit-item { margin-bottom: 15px; font-size: 1.1em; } .memshp-info .benefit-item i { margin-right: 10px; color: #ffd700; } /* 최상위 컨테이너 */ #memshp-kispg-info .kispg-page { max-width: 500px; border: 1px solid #ccc; padding: 3px; position: relative; font-family: sans-serif;} /* 테이블 스타일 */ #memshp-kispg-info .kispg-page table { width: 100%; border-collapse: collapse; } #memshp-kispg-info .kispg-page th, #memshp-kispg-info .kispg-page td { border: 1px solid #ccc; padding: 8px; vertical-align: middle; } #memshp-kispg-info .kispg-page th { width: 120px; background: #f8f8f8; text-align: left; } /* 입력 요소 기본 스타일 조금 부여 (선택사항) */ #memshp-kispg-info .kispg-page input[type="text"], #memshp-kispg-info .kispg-page input[type="password"], #memshp-kispg-info .kispg-page select { width: 150px; padding: 5px; margin-right: 4px; box-sizing: border-box; border: 1px solid #ccc; outline: none; } /* 버튼 스타일 (확인 버튼 / 키패드 버튼) */ #memshp-kispg-info .kispg-page .btn { cursor: pointer; padding: 5px 10px; border: 1px solid #aaa; background: #e9e9e9; margin: 2px; box-sizing: border-box; } #memshp-kispg-info .kispg-page .btn:hover { background: #ddd; } /* 메인 확인 버튼 전체 폭 사용 */ #memshp-kispg-info .kispg-page .btn-block { width: 100%; text-align: center; } /* 보안키패드: absolute, 정사각형 크기 */ #securityKeypad { position: absolute; width: 218px; display: none; border: 1px solid #ccc; background: #f9f9f9; padding: 5px; z-index: 999999; } /* 키패드 내부 버튼 컨테이너 */ #securityKeypad .keypad-body { display: flex; flex-wrap: wrap; justify-content: center; align-content: center; width: 100%; height: calc(100% - 60px); box-sizing: border-box; margin-bottom: 5px; } /* 숫자 버튼: 정사각형 */ #securityKeypad .keypad-digit { width: 35px; height: 30px; margin: 3px; border: 1px solid #aaa; background: #fff; cursor: pointer; text-align: center; } #securityKeypad .keypad-digit:hover { background: #eee; } /* 키패드 기능 버튼들 */ #securityKeypad .keypad-func { margin: 0 2px; } /* 멤버십 이용약관 */ .memshp-agr-info-body { font-family: 'Noto Sans KR', sans-serif; line-height: 1.6; color: #333; max-width: 800px; margin: 0 auto; padding: 20px; background-color: #f9f9f9; height: 600px; overflow-y: auto } .memshp-agr-info-h1 { text-align: center; color: #2c3e50; margin-bottom: 30px; padding-bottom: 15px; border-bottom: 2px solid #3498db; } .memshp-agr-info-article { background-color: white; padding: 20px; margin-bottom: 20px; border-radius: 8px; box-shadow: 0 2px 5px rgba(0,0,0,0.1); } .memshp-agr-info-article-title { font-weight: bold; margin-bottom: 15px; color: #2c3e50; font-size: 18px; } .memshp-agr-info-clause { margin-bottom: 10px; } .memshp-agr-info-sub-clause { padding-left: 20px; } .memshp-agr-info-item { padding-left: 40px; } .memshp-agr-info-footer { text-align: center; margin-top: 30px; font-size: 14px; color: #7f8c8d; } .memshp-agr-info-ul { list-style-type: none; padding-left: 0; } .memshp-agr-info-li { margin-bottom: 5px; } /* 멤버십 인트로 페이지 */ .membership_intro_info {margin-bottom: 5rem;} .membership_intro_info_btn_wrap .btn {background-color: #5D5FCB; color: #fff; font-size: 1.375rem; padding: 1.25rem; display: block; font-weight: bold; border-radius: 0;} .membership_intro_info_btn_wrap .btn > i {margin-left: 1rem;} /* 소개하신분 등록 폼 */ .okflag_rcmdr_form_wrap {padding: 0 0.75rem; margin-top: 3rem;} .okflag_rcmdr_form_wrap .card > * {padding: 1rem;} .okflag_rcmdr_form_wrap .card > .card-header {border-bottom: none;} .okflag_rcmdr_form_wrap .card > .card-header .okflag_rcmdr_form_title {display: flex; justify-content: flex-start; align-items: center; gap: 0.75rem;} .okflag_rcmdr_form_wrap .card > .card-body {border-top: 1px solid rgba(0, 0, 0, 0.125);} .okflag_rcmdr_form_wrap .okflag_rcmdr_intro_event_info_btn {display: flex; justify-content: flex-start; align-items: center; gap: 0.25rem; color: #0182b8; font-size: 0.9rem;} .okflag_rcmdr_form_wrap .okflag_rcmdr_intro_event_info_btn > span {text-decoration: underline;} .okflag_rcmdr_form_wrap .okflag_rcmdr_lst_input_wrap {display: flex; justify-content: space-between; align-items: center; gap: 0.5rem;} .okflag_rcmdr_form_wrap .okflag_rcmdr_lst_input_wrap > input {flex: 1;} .okflag_rcmdr_form_wrap .okflag_rcmdr_lst_input_wrap > a.btn {width: 10rem;} .okflag_rcmdr_intro_event_info_popup {position: fixed !important; top: 50% !important; left: 50% !important; transform: translate(-50%, -50%);} .okflag_rcmdr_intro_event_info {max-height: 80dvh !important; overflow-y: scroll;} /* 고객 리뷰 정보 */ .cus_satft_inv_info .usr_rvw_form_main_card_wrap {margin-top: 0; padding-top: 0; border-top: none;} .cus_satft_inv_info .usr_rvw_form_main_card_wrap .card {border-radius: 0; box-shadow: none;} .cus_satft_inv_info .dafl_usr_rvw_rply_form > ul > li > dl > dd.main {text-overflow: inherit; display: block; overflow: visible;} /** 주문 CSS */ .JS-stepProgressWrap { display: flex; align-items: center; justify-content: space-between; max-width: 800px; margin: 40px auto; } .step-circle { display: flex; flex-direction: column; align-items: center; position: relative; flex: 1; } .step-circle .circle { width: 60px; height: 60px; border-radius: 50%; background-color: #ddd; color: #555; display: flex; justify-content: center; align-items: center; font-weight: bold; } .step-circle.active .circle { background-color: #1a237e; color: #fff; } .step-circle .label { margin-top: 10px; font-size: 14px; text-align: center; color: #222; } .step-line { flex: 1; height: 3px; background-color: #ccc; margin: 0 10px; position: relative; top: -12px; } .divyPrdOrdStepWrap { display: none; } .divyPrdOrdStepWrap.active { display: block; } .JS-recvTypeWrap { display: none; } .JS-recvTypeWrap.active { display: block; } /* ------입력 정보 요약 CSS ------ */ .order-summary-box { background-color: #eee; border-radius: 8px; padding: 20px; margin-top: 20px; margin-bottom: 30px; font-size: 14px; } .order-summary-title { display: flex; align-items: center; justify-content: space-between; /* 또는 margin-left: auto를 활용해도 됨 */ font-weight: bold; font-size: 16px; margin-bottom: 10px; } .order-summary-title .toggle-summary { margin-left: auto; text-decoration: none; font-size: 14px; color: #666; } .order-summary-row { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; /* 요소 간 여백 */ background-color: #fff; padding: 10px; border-radius: 4px; } .order-summary-item { font-size: 16px; flex: 0 0 48%; /* 각 항목이 48% 너비 = 한 줄에 2개 */ min-width: 200px; word-break: keep-all; } .order-summary-row:last-child { margin-bottom: 0; } .order-summary-divider { border-top: 1px dashed #ccc; } .order-summary-message-group { background-color: #fff; padding: 10px; border-radius: 4px; } .order-summary-message { font-size: 16px; margin-bottom: 10px; line-height: 1.6; } .order-summary-product-name { font-weight: bold; font-size: 15px; margin-bottom: 6px; color: #333; } /**상품구매 스탭 로그인*/ #JS-okflagDeliveryUsrReqBasStep0Wrap{width: 600px; margin: 0 auto} #JS-okflagDeliveryUsrReqBasStep0Wrap .login-container { margin: 20px auto; border: 1px solid #ddd; padding: 30px; border-radius: 10px; background-color: #fff; } #JS-okflagDeliveryUsrReqBasStep0Wrap .btn-blue { background-color: #007bff; color: #fff; } #JS-okflagDeliveryUsrReqBasStep0Wrap .btn-blue:hover { background-color: #0056b3; } #JS-okflagDeliveryUsrReqBasStep0Wrap .separator { text-align: center; margin: 20px 0; } #JS-okflagDeliveryUsrReqBasStep0Wrap .separator::before, #JS-okflagDeliveryUsrReqBasStep0Wrap .separator::after { content: ""; display: inline-block; width: 40%; height: 1px; background-color: #ccc; vertical-align: middle; } #JS-okflagDeliveryUsrReqBasStep0Wrap .separator span { padding: 0 10px; color: #888; } #JS-okflagDeliveryUsrReqBasStep0Wrap .gray-box { background-color: #f8f9fa; padding: 15px; text-align: center; border-radius: 5px; font-size: 14px; color: #333; } /* 이벤트 랜딩 페이지 */ .evt_info_gud_lst {margin-top: 1.5rem;} .evt_info_gud_lst > li:not(:first-child) {margin-top: 1.25rem;} .evt_info_gud_lst > li > dl > dt {font-size: 1.25rem; font-weight: bold;} .evt_info_gud_lst > li > dl > dd {font-size: 1.125rem; margin-top: 0.5rem; padding-left: 0.5rem;} .evt_info_gud_lst > li > dl > dd > p {font-size: 1.125rem; margin-top: 0.5rem; font-weight: 500;} .evt_info_gud_lst > li > dl > dd > p + ul {margin-top: 0.25rem;} .evt_info_gud_lst > li > dl > dd > ul > li {font-size: 1rem; font-weight: 400; display: flex; align-items: flex-start; gap: 0.25rem; justify-items: flex-start; line-height: 0;} .evt_info_gud_lst > li > dl > dd > ul > li > em {font-weight: bold; font-size: 2rem; line-height: 1.5rem;} .evt_info_gud_lst > li > dl > dd > ul > li > span {line-height: 1.5; word-break: keep-all;} .dafl_prd_intro_form .divy_prd_list_item_lst {grid-template-columns: repeat(4, 1fr); gap: 2rem;} .dafl_prd_intro_form .dnt_prd_lst_info_pric {max-width: 100%; margin-top: 0.5rem;} .dafl_prd_intro_form .divy_prd_list_cat_badge_wrap {top: 0; right: 0;} .evt_info_gud_bottom_lst .main_instl_photo_lst {grid-template-columns: repeat(8, 1fr);} .rcmdr_intro_info .dafl_title_form {margin-top: 5rem;} /* 메인페이지 리뉴얼 */ .main_top_menu_btn_lst {display: flex; justify-content: flex-start; align-items: center; gap: 1.5rem;} .main_top_menu_btn_lst > li {flex: 1;} .main_top_menu_btn_lst > li > a {display: block;} .main_top_menu_btn_img_wrap {width: 100%; height: 0; padding-bottom: 100%; position: relative; border-radius: 50%; overflow: hidden;} .main_top_menu_btn_img_wrap > img {width: 75%; height: 75%; object-fit: contain; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);} .main_top_menu_btn_lst > li:nth-child(1) .main_top_menu_btn_img_wrap {background-color: #FFF7F3;} .main_top_menu_btn_lst > li:nth-child(2) .main_top_menu_btn_img_wrap {background-color: #f3f3f3;} .main_top_menu_btn_lst > li:nth-child(3) .main_top_menu_btn_img_wrap {background-color: #faf8f6;} .main_top_menu_btn_lst > li:nth-child(4) .main_top_menu_btn_img_wrap {background-color: #f9f5e8;} .main_top_menu_btn_lst > li:nth-child(5) .main_top_menu_btn_img_wrap {background-color: #eef2f4;} .main_top_menu_btn_img_wrap + div {margin-top: 1rem; font-size: 1.25rem; font-weight: 500; text-align: center;}