/* Swiper CSS */ .swiper-pagination > .swiper-pagination-bullet-active2 { color: #fff !important; text-decoration:underline; text-underline-position:under;} .swiper-pagination > .swiper-pagination-bullet-active4 { color: #fff !important; text-decoration:underline; text-underline-position:under;} .swiper-pagination { display:flex; align-items: center; justify-content: center; color:#fff; bottom:30px !important; } .swiper-container-horizontal>.swiper-scrollbar { bottom:0 !important; height:3px !important; width:100% !important; left:0 !important; } .swiper-scrollbar-drag { background:#333 !important; border-radius:0 !important; } .swiper-pagination-bullet-active3 { background:#67a785 !important; opacity:1 !important; } .swiper-pagination_gallery { margin-top:15px; } .swiper-pagination > .swiper-pagination-bullet { width: 20px !important; height: 20px !important; text-align: center; line-height: 20px; font-size: 12px; color: #bbb ; opacity: 1 !important; background: none !important; font-size:13px; font-weight:600;} .swiper-container-autoheight { overflow:hidden; position:relative; } .swiper-slide > img { width:auto; max-width:100%; } .swiper-pagination-custom { font-size:14px; background:rgba(0,0,0, 0.4); display:flex; width:120px !important; left:calc(50% - 60px) !important; border-radius:30px; padding:4px; font-weight:500; } .swiper-button-next { right:30px !important; background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23fff'%2F%3E%3C%2Fsvg%3E") !important; } .swiper-button-prev { left:30px !important; background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23fff'%2F%3E%3C%2Fsvg%3E") !important; } .slides { width:auto !important; } /* 메인 */ #idx_banner {position:relative;background:#eee;width:100%; overflow:hidden;} #idx_banner:after {display:block;visibility:hidden;clear:both;content:""} #idx_banner_m {position:relative;background:#eee;width:100%; overflow:hidden;} #idx_banner_m:after {display:block;visibility:hidden;clear:both;content:""} .sit_admin_top {display:inline-block;} /* 서브페이지 */ .mobile_sub_title { width:100%;background:#f1c800; color:#fff; white-space:nowrap; letter-spacing:-1px; font-size:12px; } #sub_menu {list-style:none; } #sub_menu .wrap ul { width:100%; display:flex; overflow-x:scroll; } #sub_menu .wrap ul li { color:#fff; padding:10px; } #sub_menu .wrap ul::-webkit-scrollbar{ display: none; } /**/ #sod_v {margin:30px 0 50px 0} #sod_v .td_stat {width:100px} #sod_v_info {margin: 0 0 10px;padding: 15px;background: #f4f4f4;text-align: center;border-bottom: 1px solid #dfdfdf;font-size: 14px;border-radius: 5px;} .search-wr {display: flex;flex-direction: column;padding: 15px;background: #fff;margin: 15px 0 30px 0;gap: 25px;background-color: #f4f4f4;border-radius: 7px;} .search-wr h3{display:block;font-size:15px; font-weight:600;margin-bottom: 10px;} .skey-box{width: 100%;position: relative;} .skey-box input{width: 100%;box-sizing: border-box;height: auto;padding: 1em 3em 1em 1em;font-weight: 500;border: 1px solid transparent;background: #fff;border-radius:7px;font-size: 14px;} .skey-box .skey-button {height: 46px;background: none;border: 0;width: 46px;font-size: 18px;color: #37beff;top: 50%;position: absolute;right: 0px;transform: translate(0%, -50%);} .skey-chk {display: flex;gap: 15px;margin-bottom: 15px;padding: 0px 0px 0px 5px;} .skey-chk label {font-size:14px;} .skey-range {margin: 20px 0px;} .check-list {display: flex;flex-direction: column;gap: 10px;margin-top: 15px;} .check-list li {margin-left: 0.65em;padding-left: 0.6em;line-height: 1.4em;text-align: left;text-indent: -0.65em;font-size:14px;} .check_list li i.xi-check {font-size: 1.2em;color: #007aff;transform: translateY(0.1em);} .period-wr h3{display:block;font-size:15px; font-weight:600;margin-bottom: 10px;} .period-wr .period-box{display:flex;gap: 20px; width:100%;} .period-wr .period-box .period-button {display:flex;} .period-wr .period-box .period-button button{height: 38px;padding: 0 20px;border: 0;background: #fff;color: #000;border-width: 1px 1px 1px 0px;border-color:#ebebeb;border-style: solid;font-size: 14px;} .period-wr .period-box .period-button button:first-child{border-top-left-radius: 5px;border-bottom-left-radius: 5px;} .period-wr .period-box .period-button button:last-child{border-top-right-radius: 5px;border-bottom-right-radius: 5px;} .period-wr .period-box .period-button button.active {background-color:#37beff; color:#fff} .period-wr .period-box .period-date input {height: 38px;border-width: 1px 1px 1px 1px;border-color:transparent;border-style: solid;padding-left: 15px; font-size: 14px;} .period-wr .period-box .period-date button {background-color: #fff;height: 38px;border-width: 1px 1px 1px 0px;border-color:transparent;border-style: solid;color:#37beff;font-size: 16px;padding: 0px 10px;} /* 주문내역 */ #sod_v {margin:30px 0 50px 0} #sod_v .td_stat {width:100px} #sod_v_info {margin: 0 0 10px;padding: 15px;background: #f4f4f4;text-align: center;border-bottom: 1px solid #dfdfdf;font-size: 14px;border-radius: 5px;} .search-wr {display: flex;flex-direction: column;padding: 15px;background: #fff;margin: 15px 0 30px 0;gap: 25px;background-color: #f4f4f4;border-radius: 7px;} .search-wr h3{display:block;font-size:15px; font-weight:600;margin-bottom: 10px;} .skey-box{width: 100%;position: relative;} .skey-box input{width: 100%;box-sizing: border-box;height: auto;padding: 1em 3em 1em 1em;font-weight: 500;border: 1px solid transparent;background: #fff;border-radius:7px;font-size: 14px;} .skey-box .skey-button {height: 46px;background: none;border: 0;width: 46px;font-size: 18px;color: #37beff;top: 50%;position: absolute;right: 0px;transform: translate(0%, -50%);} .skey-chk {display: flex;gap: 15px;margin-bottom: 15px;padding: 0px 0px 0px 5px;} .skey-chk label {font-size:14px;} .skey-range {margin: 20px 0px;} .check-list {display: flex;flex-direction: column;gap: 10px;margin-top: 15px;} .check-list li {margin-left: 0.65em;padding-left: 0.6em;line-height: 1.4em;text-align: left;text-indent: -0.65em;font-size:14px;} .check_list li i.xi-check {font-size: 1.2em;color: #007aff;transform: translateY(0.1em);} .period-wr h3{display:block;font-size:15px; font-weight:600;margin-bottom: 10px;} .period-wr .period-box{display:flex;gap: 20px; width:100%;} .period-wr .period-box .period-button {display:flex;} .period-wr .period-box .period-button button{height: 38px;padding: 0 20px;border: 0;background: #fff;color: #000;border-width: 1px 1px 1px 0px;border-color:#ebebeb;border-style: solid;font-size: 14px;} .period-wr .period-box .period-button button:first-child{border-top-left-radius: 5px;border-bottom-left-radius: 5px;} .period-wr .period-box .period-button button:last-child{border-top-right-radius: 5px;border-bottom-right-radius: 5px;} .period-wr .period-box .period-button button.active {background-color:#37beff; color:#fff} .period-wr .period-box .period-date input {height: 38px;border-width: 1px 1px 1px 1px;border-color:transparent;border-style: solid;padding-left: 15px; font-size: 14px;} .period-wr .period-box .period-date button {background-color: #fff;height: 38px;border-width: 1px 1px 1px 0px;border-color:transparent;border-style: solid;color:#37beff;font-size: 16px;padding: 0px 10px;} /*------------------------------------------------- 주문리스트 관리 ----------------------------------------------------*/ #purchase-list > ul > li {align-items: center;padding: 10px 0 10px 0; border-bottom:1px solid #ddd} #purchase-list > ul > li.title {line-height:32px} #purchase-list > ul > li:not(:first-child) > div {line-height:32px} #purchase-list > ul > li > div > span {font-size:13px;} #purchase-list > ul > li > div:nth-child(1) {width:40%;display:flex;flex-direction:column;gap:10px;} #purchase-list > ul > li > div:nth-child(1) a {font-size:14px;} #purchase-list > ul > li > div:nth-child(1) a.order-id strong{background-color: rgb(255 255 0 / 41%);} #purchase-list > ul > li > div:nth-child(2) {width:13%;} #purchase-list > ul > li > div:nth-child(3) {width:7%;} #purchase-list > ul > li > div:nth-child(4) {width:10%;} #purchase-list > ul > li > div:nth-child(5) {width:10%;} #purchase-list > ul > li > div:nth-child(6) {width:10%;} #purchase-list > ul > li > div:nth-child(7) {width: 10%;display: flex;justify-content: center;} .status_01{background:#fe528f;color:#fff;font-size: 13px;font-weight: 500; border-radius: 15px;padding: 0px 10px;line-height: 28px;} .status_02{background:#68d0a7;color:#fff;font-size: 13px;font-weight: 500; border-radius: 15px;padding: 0px 10px;line-height: 28px;} .status_03{background:#b668d0;color:#fff;font-size: 13px;font-weight: 500; border-radius: 15px;padding: 0px 10px;line-height: 28px;} .status_04{background:#ffa700;color:#fff;font-size: 13px;font-weight: 500; border-radius: 15px;padding: 0px 10px;line-height: 28px;} .status_05{background:#688fef;color:#fff;font-size: 13px;font-weight: 500; border-radius: 15px;padding: 0px 10px;line-height: 28px;} .status_06{background:#ff7878;color:#fff;font-size: 13px;font-weight: 500; border-radius: 15px;padding: 0px 10px;line-height: 28px;} #sod_fin_list .prqty_stat{background:#fe528f;color: #fff;font-weight: 400;font-size: 13px;border-radius: 15px;padding: 5px 13px;line-height: 28px;text-align: center;line-height: initial;} #sod_fin_list .prqty_stat.입금{background:#68d0a7;} #sod_fin_list .prqty_stat.준비{background:#b668d0;} #sod_fin_list .prqty_stat.배송{background:#ffa700;} #sod_fin_list .prqty_stat.완료{background:#688fef;} #sod_fin_list .prqty_stat.취소{background:#9eacc6;} #sod_fin_list .prqty_stat.반품{background:#9eacc6;} #sod_fin_list .prqty_stat.품절{background:#9eacc6;} /* 주문상세내역 */ /*#sod_fin {margin: 20px 0px 40px 0;}*/ #sod_fin_no{margin: 20px 0 30px 0;background: #f5f7f9;color: #444;text-align: center;padding: 20px 10px;border-radius: 10px;font-size: 16px;} #sod_fin_list h3 {margin-bottom: 1.5ex;font-size: 18px;font-weight:600} #sod_fin_list h3 b{color: rgb(85 189 239)} #sod_fin_list h3 b i {font-size: 1.2em;transform: translateY(0.1em);} .order-info-wr {margin-bottom:30px} .order-info-wr h3 {margin-bottom: 1.5ex;font-size: 18px;font-weight:600;text-align:left} .order-info-wr h3 b{color: rgb(85 189 239)} .order-info-wr h3 b i {font-size: 1.2em;transform: translateY(0.1em);} .form-box-wr{width: 100%;padding:15px 15px 15px 25px;margin-bottom: 1.5rem;font-size: 1.6rem;background-color: rgba(245,247,249,1);border-radius: 0.5rem;border: 1px solid transparent;display: flex;flex-direction: column;gap: 10px;} .form-box-wr .line-wr{display: -ms-flexbox;display: -webkit-flexbox;display: flex;justify-content: space-between;align-items: baseline;} .form-box-wr .line-wr dl {margin-bottom: 1.5rem;} .form-box-wr .line-wr dt {width: 8em;font-size: 14px;font-weight: 600;} .form-box-wr .line-wr dd {width: calc(100% - 8em);font-size: 14px;line-height:18px;background-color: #fff;padding: 10px;border-radius: 7px;} #order-list > ul > li {align-items: center;padding: 10px 0 10px 0; border-bottom: 1px solid rgba(239,240,242,1);} #order-list > ul > li > div {font-size:14px} #order-list > ul > li.title > div:nth-child(1) {width:10%;} #order-list > ul > li.title > div:nth-child(2) {width:40%;} #order-list > ul > li.title > div:nth-child(3) {width:8%;text-align:center;} #order-list > ul > li.title > div:nth-child(4) {width:12%;text-align:center;} #order-list > ul > li.title > div:nth-child(5) {width:12%;text-align:center;} #order-list > ul > li.title > div:nth-child(6) {width:10%;text-align:center;} #order-list > ul > li.title > div:nth-child(7) {width:8%;text-align:center;} #order-list > ul > li:not(:first-child) > div:nth-child(1) {width:100%;display: flex;gap:0px} #order-list > ul > li:not(:first-child) > div:nth-child(1) > div.sod_img {width: 10%; text-align: center;} #order-list > ul > li:not(:first-child) > div:nth-child(1) > div.sod_info {width: 90%;flex-direction: column;gap: 10px;display: flex;} #order-list > ul > li:not(:first-child) > div:nth-child(1) > div.sod_info > div.sod_head > a {font-size:15px; font-weight:600} #order-list > ul > li:not(:first-child) > div:nth-child(1) > div.sod_info > div.sod_opt > ul {display:flex;flex-direction: column;gap:7px;} #order-list > ul > li:not(:first-child) > div:nth-child(1) > div.sod_info > div.sod_opt > ul > li {margin: 0px;} #order-list > ul > li:not(:first-child) > div:nth-child(1) > div.sod_info > div.sod_opt > ul > li > div:nth-child(1) {width:44%;} #order-list > ul > li:not(:first-child) > div:nth-child(1) > div.sod_info > div.sod_opt > ul > li > div:nth-child(2) {width:8%;text-align: center;font-size: 14px;} #order-list > ul > li:not(:first-child) > div:nth-child(1) > div.sod_info > div.sod_opt > ul > li > div:nth-child(3) {width:12%;text-align: center;font-size: 14px;font-weight: 600;letter-spacing: -0.05rem;} #order-list > ul > li:not(:first-child) > div:nth-child(1) > div.sod_info > div.sod_opt > ul > li > div:nth-child(4) {width:12%;text-align: center;font-size: 14px;font-weight: 600;letter-spacing: -0.05rem;} #order-list > ul > li:not(:first-child) > div:nth-child(1) > div.sod_info > div.sod_opt > ul > li > div:nth-child(5) {width:10%;text-align: center;font-size: 14px;font-weight: 600;letter-spacing: -0.05rem;} #order-list > ul > li:not(:first-child) > div:nth-child(1) > div.sod_info > div.sod_opt > ul > li > div:nth-child(6) {width:8%;text-align: center;font-size: 14px;} #order-list > ul > li > div.pd_info {display:flex; gap:10px} #order-list > ul > li > div.pd_info .sod_name{width:100%; padding:0px 20px 0px 10px;} #order-list > ul > li > div.pd_info .sod_name a {font-size: 15px;font-weight: 700;padding: 0px 0px 10px 0px;display: block;width: 100%;} #order-list > ul > li.empty_bsk {min-height: 350px;justify-content: center;} #pin-list > ul > li {align-items: center;padding: 10px 0 10px 0; border-bottom: 1px solid rgba(239,240,242,1);} #pin-list > ul > li > div {font-size:14px} #pin-list > ul > li > div:nth-child(1) {width:8%;text-align: center;} #pin-list > ul > li > div:nth-child(2) {width:54%;} #pin-list > ul > li > div:nth-child(3) {width:10%;text-align:center;} #pin-list > ul > li > div:nth-child(4) {width:10%;text-align:center;} #pin-list > ul > li > div:nth-child(5) {width:18%;text-align:center;} #pin-list > ul > li > div.pin-inifo-wr {display: grid;gap: 10px;grid-template-columns: 80px auto;grid-template-gap: 1rem;} #pin-list > ul > li > div.pin-inifo-wr > div.pd-photo {text-align:center;} #pin-list > ul > li > div.pin-inifo-wr > div.pd-photo img {width:100%;display:block;height:auto} #pin-list > ul > li > div.pin-inifo-wr > div.pin-inifo > ul {display:flex; flex-direction:column; gap:10px} #pin-list > ul > li > div.pin-inifo-wr > div.pin-inifo > ul * {font-size:14px;} #pin-list > ul > li.empty_li > div {width: 100%;padding: 50px 0;display:block} #sod_fin_cancel .btn01 {height: 50px;line-height: 50px;padding: 0 10px;width: 170px;font-weight: bold;font-size: 1.25em;border-radius: 5px;} #sod_sts_wrap {margin:0 0 10px;text-align:right} #sod_sts_explan {display:none} #sod_fin_legend {padding:10px;background:#f3f3f3;margin:10px 0;border:1px solid #e9e9e9;text-align:left;zoom:1} #sod_fin_legend:after {display:block;visibility:hidden;clear:both;content:''} #sod_fin_legend dt {clear:both;float:left;margin:0 0 5px;width:50px;font-weight:bold} #sod_fin_legend dd {float:left;margin:0} #sod_fin #sod_bsk_tot li{radial-gradient(120% 100% at 100% 0%, rgb(4 4 10 / 13%), #0604211a 45%), linear-gradient(#09080c, #08080f)border-bottom:1px solid #e7ebf1;height: 40px;;padding:0 15px;line-height:40px;text-align:right} #sod_fin #sod_bsk_tot li span{float:left;clear:both;color: #777;} #sod_fin #sod_bsk_tot li strong{} #sod_fin #sod_bsk_tot .sod_bsk_cnt strong{color:#f1c800;font-size:1.25em} #request_form {position:relative} #request_form div {display:none;z-index:10000;position:absolute;top:23px;left:0;padding:20px 0;width:520px;border:1px solid #000;background:#f2f5f9;text-align:center} #request_form .frm_input {width:300px;background:#fff !important} #request_form .btn_frmline, #request_form .btn_cancel {vertical-align:middle !important} #request_form .btn_frmline {padding:0 10px;line-height:1.6em} #sod_req_btn {margin:0 0 10px} #sod_req_btn button {background:#626870} #sod_req_log {margin:0 0 20px} #sod_req_log ul {margin:0;padding:0;border-top:1px solid #e9e9e9;background:#f2f5f9;list-style:none} #sod_req_log li {padding:10px 10px 20px;border:1px solid #e9e9e9;border-top:0} #sod_req_log h3 {margin:20px 0 10px} .sod_req_log_view table {margin:0} .sod_req_log_view caption {padding:10px 0;font-size:1em;font-weight:bold;text-align:left;line-height:1em} .sod_req_log_view caption span {color:#ff3061} .sod_req_log_view th {border-top:1px solid #e9e9e9;background:#f7f7f7 !important;color:#000 !important;text-align:center} .sod_req_log_view td {radial-gradient(120% 100% at 100% 0%, rgb(4 4 10 / 13%), #0604211a 45%), linear-gradient(#09080c, #08080f)color:#000} .sod_req_log_view p {padding:10px 15px;border-bottom:1px solid #e9e9e9;background:radial-gradient(120% 100% at 100% 0%, rgb(4 4 10 / 13%), #0604211a 45%), linear-gradient(#09080c, #08080f);color:#000} .sod_req_log_view .sod_req_it {width:270px} .sod_req_log_view button {margin:0;padding:0;border:0;background:transparent;color:#ff3061;text-decoration:underline;vertical-align:middle;cursor:pointer} .sod_ta_wr {margin: 20px 0;} .sod_fin_list .sod_ta_wr{padding:15px 0;background:#fff} .sod_fin_list h2 {position:absolute;border:0;font-size:0;line-height:0;content:""} .sod_fin_list .prqty_stat{position:absolute;top:0;right:0;padding:3px 5px;background:#6583c5;color:#fff} .sod_fin_list .li_opt{color: #777;margin: 3px 0;line-height: 1.3em;padding-right:50px} #sod_fin_list .prqty_stat{background:#fe528f;color: #fff;font-weight: 400;font-size: 13px;border-radius: 15px;padding: 5px 13px;line-height: 28px;text-align: center;line-height: initial;} #sod_fin_list .prqty_stat.입금{background:#68d0a7;} #sod_fin_list .prqty_stat.준비{background:#b668d0;} #sod_fin_list .prqty_stat.배송{background:#ffa700;} #sod_fin_list .prqty_stat.완료{background:#688fef;} #sod_fin_list .prqty_stat.취소{background:#9eacc6;} #sod_fin_list .prqty_stat.반품{background:#9eacc6;} #sod_fin_list .prqty_stat.품절{background:#9eacc6;} #sod_sts_wrap .btn_wr{border-top:1px solid #e9e9e9;text-align:center} #sod_sts_explan_open{padding: 0 10px;height: 30px;border: 1px solid #e1e1e1;border-top: none;margin-top: 0px;color: #fff;background: none;border-bottom-left-radius: 5px;border-bottom-right-radius: 5px;} #sod_sts_explan{display:none} #sod_fin_legend{background:radial-gradient(120% 100% at 100% 0%, rgb(4 4 10 / 13%), #0604211a 45%), linear-gradient(#09080c, #08080f);margin:0 0 10px;padding:10px;line-height:20px} #sod_fin_legend:after {display:block;visibility:hidden;clear:both;content:""} #sod_fin_legend dt{float:left;width:20%} #sod_fin_legend dd{float:left;width:80%} #sod_fin_view{margin:10px 0;} #sod_fin_view h2 {position:absolute;border:0;font-size:0;line-height:0;content:""} #sod_fin_view h3{font-size:1.167em;margin:20px 0 10px} #sod_fin_list .td_bdno{border-left:0} #sod_fin_list .td_bdno a{font-weight:bold} .odf_tbl{position:relative} .odf_tbl table{radial-gradient(120% 100% at 100% 0%, rgb(4 4 10 / 13%), #0604211a 45%), linear-gradient(#09080c, #08080f)width:100%;border-collapse:collapse;} .odf_tbl table th{border:1px solid #ddd; background: #f4f4f4; ;padding: 10px;text-align:left;width:120px;font-weight:normal;font-size:13px;} .odf_tbl table td{border:1px solid #ddd;padding:7px 10px;text-align:right;font-size:13px;} #sod_fin_pay {margin:0 0 30px} #sod_fin_orderer {margin:0 0 30px} #sod_fin_receiver {margin:0 0 30px;} #sod_fin_dvr {display:none} #sod_fin .sod_left h2{position:absolute;font-size:0;line-height:0;overflow:hidden} #sod_fin .sod_left h3{font-size:1.167em ;margin:0 0 10px} #sod_fin .sod_left .tbl_head01 {} #sod_fin_dvr .dvr_link {color:#ff3061;text-decoration:underline} #sod_fin_tot {background: #f4f4f4;margin: 20px 0;zoom: 1;border-radius: 5px;overflow: hidden;} #sod_fin_tot ul {display: grid;grid-template-columns: 1fr 0.8fr 1fr;width: 100%;} #sod_fin_tot ul:after {display:block;visibility:hidden;clear:both;content:""} #sod_fin_tot li{border-left: 1px solid #e6e2e2;text-align: center;width: 100%;display: flex;justify-content: space-between;padding: 25px 15px 25px 20px;align-items: center;} #sod_fin_tot li:first-child{border:0} #sod_fin_tot li div{display:flex; align-items: center;color: #f1c800;font-size: 1.167em;} #sod_fin_tot li div.tit{font-weight:600;color: #000;} #sod_fin_tot li span em {font-style: normal; color:#ff0000; font-weight:600} #sod_fin_tot li span.sbj {display: grid;grid-template-rows: 1fr 1fr;text-align: left;grid-row-gap: 5px;} #sod_fin_tot li strong{font-size:1.25em} #sod_fin_tot .sod_bsk_cnt strong{color: #f1c800;} #sod_fin_cancel {text-align:center} #sod_fin_cancel h2 {position:absolute;font-size:0;line-height:0;overflow:hidden} #sod_fin_cancelfrm {display:none;margin:10px 0 0;text-align:center;background:radial-gradient(120% 100% at 100% 0%, rgb(4 4 10 / 13%), #0604211a 45%), linear-gradient(#09080c, #08080f);padding:15px} #sod_fin_cancelfrm .frm_input {background: #fff;width: 100%;border: none;border-radius: 6px;padding: 15px;font-size: 14px;} #sod_fin_cancelfrm .btn_frmline{background:#5e6b6f;color:#fff;border:0;padding:10px;width:100%;cursor:pointer} #sod_fin_cancelfrm dd {padding: 0px;} #sod_fin_cancelfrm button {margin:0px auto} #sod_fin_tab {margin:0px 0px 30px 0px} #sod_fin_tab .tab-menu {display: flex;justify-content: center;align-items: center;} #sod_fin_tab .tab-menu button {position: relative;line-height: 48px;height: 48px;font-size: 16px;font-weight: 600;display: flex;align-items: center;gap: 10px;} #sod_fin_tab .tab-menu button .icon{line-height: 33px;height: 30px;width: 30px;background-color: #fff;border-radius: 50%;display: block;} #sod_fin_tab .tab-menu button:first-child {border-top-left-radius: 25px;border-bottom-left-radius: 25px;padding: 0px 30px 0px 10px;} #sod_fin_tab .tab-menu button:last-child {border-top-right-radius: 25px;border-bottom-right-radius: 25px;border-left: 1px solid #ddd;padding: 0px 10px 0px 30px;} #sod_fin_tab .tab-menu button.active {background-color:#000;color:#fff;} #sod_fin_tab .tab-menu button.active .icon {background-color:#ff0000;color:#fff;} #sod_fin_tab .tab-menu button .pin-count {position: absolute;top: -10px;right: -10px;font-size: 10px;background: rgb(85 189 239);width: 2.5rem;height: 2.5rem;border-radius: 50em;display: -ms-flexbox;display: -webkit-flexbox;display: flex;justify-content: center;color: #fff;align-items: center;} #sod_fin_test {padding:10px} /* 마이페이지 */ #smb_my {position:relative;max-width:1200px;margin:0 auto;margin-top:20px;} #smb_my_ov{display: grid;grid-template-columns: 0.3fr 1fr;background: #fff;margin: 10px 0 40px;border: 1px solid #ececec;border-radius: 7px;overflow: hidden;} #smb_my_ov .hello_name{background:rgb(243 243 243);text-align:center;padding-bottom:20px;} #smb_my_ov .my_info dl {display: -ms-flexbox;display: -webkit-flexbox;display: flex;justify-content: space-between;align-items: baseline;border-bottom: 1px solid #eaeaea;} #smb_my_ov .my_info dl:last-child {border-bottom:none;} #smb_my_ov .my_info dt {width: 10em;font-size: 14px;font-weight: 700;padding-left: 20px;} #smb_my_ov .my_info dd {width: calc(100% - 10em);font-size: 14px;line-height: 18px;background-color: #fff;padding: 10px;border-radius: 7px; color:#000;} #smb_my_ov .my_img{display:inline-block;border-radius:50%;overflow:hidden;position:relative;margin:35px 0 0;-webkit-box-shadow:0 6px 10px rgba(0,0,0,0.1);-moz-box-shadow:0 6px 10px rgba(0,0,0,0.1);box-shadow:0 6px 10px rgba(0,0,0,0.1);} #smb_my_ov .btn_edit{font-size: 12px;position: absolute;bottom: 0;left: 0;width: 100%;background: #3d3d3d;line-height: 23px;color: #fff;} #smb_my_ov .btn_edit:hover{background:#d25959;color:#fff} #smb_my_ov .my_name{margin: 10px 0;font-size: 14px;color: #000;} #smb_my_ov .btn_out{position:absolute;top:0;right:0;background:radial-gradient(120% 100% at 100% 0%, rgb(4 4 10 / 13%), #0604211a 45%), linear-gradient(#09080c, #08080f);border-bottom:1px solid #e6e6e6;border-left:1px solid #e6e6e6;border-radius:0 0 0 5px;padding:0 5px;line-height:22px;font-size:11px;color:#777} #smb_my_wr {min-height:560px} #smb_my_act {display: flex;justify-content: end; position: relative; top:0px; right:0px;} #smb_my_act ul {display:flex; gap:7px;} #smb_my_act li a{line-height: 34px;padding: 0 10px;border-radius: 5px;} #smb_my_act li .btn_admin{line-height: 34px;padding: 0 10px;border-radius: 5px;color: #fff; height:auto !important;} #smb_my_ov .cou_pt{position:absolute;top:0 ;right:0;} #smb_my_ov .cou_pt dt{float:left;width:90px;line-height:45px;} #smb_my_ov .cou_pt dd{float:left;width:110px;text-align:right;padding:0 20px 0 0 ;line-height:45px;} #smb_my_ov .cou_pt dd a{color:#ff2b64;font-weight:bold;font-size:1.167em} #smb_my_ov .op_area{background:#f8f8f8;border:1px solid #ccc;border-top:0;padding:10px 15px;line-height:18px;color:#555} #smb_my_ov .op_area:after {display:block;visibility:hidden;clear:both;content:""} #smb_my_ov .op_area dt{float:left;width:10%;margin:3px 0;font-weight:bold} #smb_my_ov .op_area dd{float:left;width:40%;;margin:3px 0} @media (min-width:240px) and (max-width:768px) { #smb_my_ov { display: grid; grid-template-columns: 1fr !important; background: #08070e !important; margin: 10px 0 40px; border-radius: 7px; padding: 0 20px; } #smb_my_ov .my_info dd {color: #ffffff !important;background: #08070e !important;} .my_info dt {color: #ffffff !important;} } /* 타이틀 */ /*========= sub ===========*/ #sub_menu {padding:15px 0; border-bottom:1px solid #eee; background-color: #fff;} #sub_menu ul {text-align: center;} #sub_menu ul li {display: inline-block; margin:0 10px;} #sub_menu ul li a {font-size: 15px;} #sub_menu ul li.on a {font-weight: 700; color: #222;} #page_title {padding: 100px 0 10px 0;} #page_title > div {width: 1080px;margin: 0 auto;position: relative;} #page_title h2 {font-size: 2.3rem;font-weight: 700;text-align: center;display: flex;justify-content: center;align-items: center;flex-direction: column;gap: 10px;color:rgb(0 147 255)} #page_title h2 .dot{display:flex; gap:5px} #page_title h2 .dot span {width: 4px;height: 4px;border-radius: 50%;background-color: rgb(52, 52, 52);margin-top: 8px;} #page_title .location { position: absolute; right: 0; top: 20px; opacity: 0.5; text-align: right; display:none;} #page_title .location > * { display: inline-block; } #page_title .location li { font-size: 14px; color: #fff; } #page_title .location li::after { content: "-"; display: inline-block; margin: 0 4px; font-size: 11px; color: #fff; } #page_title .location li:last-child::after { display: none; } #sub_contents { position: relative; z-index: 100; /*padding:50px 0px;*/ min-height:var(--cont_vh); } .list #sub_contents { padding: 50px 0} /* 마이페이지 */ #smb_my_ov{display: grid; grid-template-columns: 0.3fr 1fr; background: #fff; margin: 10px 0 40px; border: 1px solid #ececec; border-radius: 7px; overflow: hidden;} #smb_my_ov .hello_name{background:#f8f8f8;text-align:center;padding-bottom:20px;border-bottom:1px solid #e6e6e6;position:relative;} #smb_my_ov h2 {position:absolute;font-size:0;text-indent:-9999em;line-height:0;overflow:hidden} #smb_my_ov .my_img{display:inline-block;border-radius:50%;overflow:hidden;position:relative;margin:35px 0 0; -webkit-box-shadow:0 6px 10px rgba(0,0,0,0.1); -moz-box-shadow:0 6px 10px rgba(0,0,0,0.1); box-shadow:0 6px 10px rgba(0,0,0,0.1);} #smb_my_ov .btn_edit{position:Absolute;bottom:0;left:0;width:100%;background:#959595;line-height:23px;color: #fff;} #smb_my_ov .btn_edit:hover{background:#d25959;color:#fff} #smb_my_ov .my_name{margin:10px 0} #smb_my_ov .btn_out{position:absolute;top:0;right:0;background:radial-gradient(120% 100% at 100% 0%, rgb(4 4 10 / 13%), #0604211a 45%), linear-gradient(#09080c, #08080f);border-bottom:1px solid #e6e6e6;border-left:1px solid #e6e6e6;border-radius:0 0 0 5px;padding:0 5px;line-height:22px;font-size:11px;color:#777} #smb_my_wr {min-height:560px} #smb_my_wr .contents {margin:30px 0;} .my_cou_wr{border-bottom:1px solid #e6e6e6;font-weight:bold;} .my_cou_wr:after {display:block;visibility:hidden;clear:both;content:""} .my_cou_wr .my_cou{float:left;width:50%;border-right:1px solid #e6e6e6;text-align:center;padding:10px 0} .my_cou_wr .my_po{float:left;width:50%;text-align:center;padding:10px 0} .my_cou_wr img{padding:5px 0 0;width:23px;height:auto;} .my_cou_wr a{color:#000} .my_cou_wr span{display:block;line-height:20px;color:#000} .my_info{padding:0 10px;line-height:18px} .my_info dt{border-top:1px solid #e6e6e6;color:#000;padding:10px 0 0;font-size:0.92em} .my_info dd{padding:0 0 10px;} .my_info dt:first-child{border:0} .btn_my_if{width:100%;border:0;background:radial-gradient(120% 100% at 100% 0%, rgb(4 4 10 / 13%), #0604211a 45%), linear-gradient(#09080c, #08080f);padding:10px;background:#f3f3f3} .smb_title { display: flex; align-items: center; justify-content: space-between; } .wish_border { border-bottom:2px solid #000; } #smb_my_dev h2{margin:0 0 10px;} #smb_my_dev .delivery { display:flex; border:1px solid #dcdcdc; border-top:3px solid #000; width:100%; padding:30px; background:#f8f8f8; margin-bottom:50px; } #smb_my_dev .delivery li { position:relative; width:20%;} #smb_my_dev .delivery li p { margin-top:10px; } #smb_my_dev .delivery li .icon_l { position: absolute; right: 0; top: calc(50% - 12px); line-height: 24px; font-size: 24px; font-weight: 100; color:#ccc;} #smb_my_od{margin:0 0 30px;padding: 0} #smb_my_od h2{margin:0 0 10px;} #smb_my_wish{margin:0 0 35px} #smb_my_wish h2{margin:0 0 10px;} #smb_my_wish ul:after {display:block;visibility:hidden;clear:both;content:""} #smb_my_wish li{float:left;width:25%;padding:5px} #smb_my_wish li img{width:100%;height:auto;} #smb_my_wish li a{display:block;margin:5px 0;font-weight:bold} #smb_my_wish .empty_list{width:100%;padding:100px 0} /* 주문내역 include */ .inq_wr { width:100%; display:flex; justify-content: space-between; align-items: center; margin:10px 0;} #sod_inquiry li:after {display:block;visibility:hidden;clear:both;content:''} #sod_inquiry li {radial-gradient(120% 100% at 100% 0%, rgb(4 4 10 / 13%), #0604211a 45%), linear-gradient(#09080c, #08080f)border:1px solid #dcdcdc;padding:15px;margin-bottom:10px;position:relative;} #sod_inquiry li .idtime_link{font-weight:500} #sod_inquiry li .idtime_time{position:absolute;top:15px;right:15px;color:#999} #sod_inquiry li .inquiry_name{margin:10px 0;color:#666;font-weight:300} #sod_inquiry li .inquiry_price{font-weight: bold;margin: 0px 0 0;color:#f1c800;display:inline-block;bottom:16px;left:16px} #sod_inquiry li .inv_status{font-size:12px;} #sod_inquiry li .inv_inv{margin:10px 0 0;display:block;border:1px solid #c4c5cc;color:#666} #sod_inquiry li .inv_inv i{width:30px;height:30px;line-height:30px;background:#f3f3f3;text-align:center;color:#555;font-size:15px;margin-right:5px} /* 주문상세내역 중 현금영수증 발급 */ #scash {} #scash section {padding:10px 0} #scash .tbl_head01 th {padding:0 10px;border-top:1px solid #eee;border-bottom:1px solid #eee;background:#f2f5f9;text-align:left;} #scash_apply {padding:10px 0 15px;text-align:center} #scash_apply button {padding:10px;border:0;background:#565e60;color:#fff} #scash_copy {text-align:center} /***더블유 수정 ***/ @media (min-width: 970px){ /*#smb_my_ov{position:absolute;top:0;left:0;width:280px} #smb_my {padding:0 10px;padding-left:300px} .btn_my_if{display:none;}*/ } @media (max-width: 640px){ #smb_my_wish li {width:50%} } /* 띠배너 */ #line-banner { display:none; width:100%; height:60px; color:#fff; background:url('../img/line-bg.png') 5% 50%; background-size:cover; font-size:16px; background-repeat:no-repeat;} #line-banner .wrap { width:100%; max-width:1200px; margin:0 auto; display:flex; text-align:center; position:relative; line-height:60px; align-items: center; justify-content: center; } #line-banner img { vertical-align:middle; } #line-banner p { margin-left:7px; margin-top:-1px; } #line-banner .wrap .bt_x { max-height:40px; position:absolute; right:0px; top:10px; cursor:pointer;} #line-banner.on { display:block; } /* top line */ #top-line { width:100%; radial-gradient(120% 100% at 100% 0%, rgb(4 4 10 / 13%), #0604211a 45%), linear-gradient(#09080c, #08080f) height:30px; line-height:30px; border-bottom:1px solid #e1e1e1;} #top-line .wrap { width:100%; max-width:1200px; margin:0 auto; } #top-line .wrap .lt-area { display:flex; float:left; } #top-line .wrap .rt-area { display:flex; float:right; } #top-line .wrap .lt-area a { position:relative; letter-spacing:-1px; padding:0 20px; } #top-line .wrap .lt-area a::before { content:''; position:absolute; right:0; top:8px; background:#e1e1e1; width:1px; height:14px; transition:0.1s ease all;} #top-line .wrap .lt-area a:hover { transition:0.1s ease all; color:#0f3f82; font-weight:600; } #top-line .wrap .lt-area a:nth-last-child(1)::before { display:none; } #top-line .wrap .lt-area a:nth-last-child(1) { margin-right:0; } #top-line .wrap .rt-area > a { margin-right:30px; position:relative; } #top-line .wrap .rt-area > a:nth-last-child(1) { margin-right:0; } .mobile_menu { display:none; } /* top-line 우측 */ #hd_qnb li a { width:90px; border:none; radial-gradient(120% 100% at 100% 0%, rgb(4 4 10 / 13%), #0604211a 45%), linear-gradient(#09080c, #08080f) color:#666; border-right:1px solid #dcdcdc; padding:0 15px;} #hd_qnb li a button { border:none; radial-gradient(120% 100% at 100% 0%, rgb(4 4 10 / 13%), #0604211a 45%), linear-gradient(#09080c, #08080f) transition:0.3s ease all;} #hd_qnb li a button:hover i{ color:#33333 } #hd_qnb li a button:hover h1 { font-weight:600; color:#33333 } #hd_qnb li a:nth-last-child(1) { padding-right:0; border-right:0; } #hd_qnb li a:nth-child(1) { padding-left:0; } #hd_qnb> li button { position:relative; } .ht_num { position:absolute; right:0px; top:-6px; background:#333333; color:#fff; width:16px; height:16px; border-radius:50%; font-weight:500; letter-spacing:0; line-height:14px;font-size:10px; text-align:center;} /* 상단 키워드 */ #ppl_word {position:relative;display:inline-block;float:left;margin-left:40px;width:150px;margin-top:15px;height:25px;overflow:hidden} #ppl_word h4 {position:absolute;font-size:0;line-height:0;overflow:hidden} #ppl_word li {width:70%;line-height:25px;font-size:1em;padding-right:15px;white-space:nowrap} #ppl_word li .word-rank {display:inline-block;font-size:24px; text-align:center; font-style:italic; color:#000;margin-right:5px; font-family:'YeolrinGothic-Bold'; font-weight:900;} #ppl_word li a { font-size:16px; color:#222; margin-left:10px; } .verical-btn a{background:url(../img/pv_btn_2.gif) no-repeat;text-indent:-999px;overflow:hidden;width:17px;height:12px;display:inline-block;z-index:99} .verical-btn .flex-prev{background-position:0 0;position:absolute;top:0;right:0;} .verical-btn .flex-next{background-position:0 -12px;position:absolute;top:12px;right:0;height:13px} /* 슬라이드 */ .main_banners { width:100% !important; min-height:495px;} /* 메인 섹션 01 */ .main_bg_01 { width:100%; max-width:1200px; margin:0 auto; margin-bottom:100px; } .main_bg_01 .mbg_wrap { width:100%; background-image: url('../img/main_bg_01_1.png'), url('../img/main_bg_01.png'); background-size:auto, 100% 100%; background-position:50% -40%, 0px 0px; background-repeat:no-repeat; height:100vh; max-height:200px; display: flex; border-radius: 5px; align-items: center; transition:0.3s ease all;} .main_bg_01 .mbg_wrap > p { padding-left:200px } .main_bg_01 .mbg_wrap > p > img { margin-left:5px; vertical-align:bottom; } .main_bg_01 .mbg_wrap:hover { transform:scale(1.02); cursor:pointer; transition:0.3s ease all; } /* 메인 섹션 02 */ .main_bg_02 { width:100%; max-width:1200px; margin:0 auto; margin-bottom:30px; } .main_bg_02 ul { width:100%; display:flex; flex-direction:row; flex-wrap:wrap; } .main_bg_02 ul li.service_box_01 { width:calc(50% - 20px); background:url('../img/main_bg_02.png') no-repeat center center; height:100vh; max-height:300px; margin-right:40px; padding:60px; transition:0.3s ease all; background-size:cover; } .main_bg_02 ul li.service_box_02 { width:calc(50% - 20px); background:#373737; height:100vh; max-height:300px; margin-right:0px; padding:60px; transition:0.3s ease all; background-size:cover;} .main_bg_02 ul li.service_box_01:hover, .main_bg_02 ul li.service_box_02:hover { transform:scale(1.02); cursor:pointer; transition:0.3s ease all; } /* 메인 섹션 03 */ .main_bg_03 { width:100%; max-width:1200px; margin:0 auto; margin-bottom:100px; } /* 메인 섹션 04 */ .main_bg_04 { width:100%; max-width:1200px; margin:0 auto; margin-bottom:100px; } .main_bg_04 ul { width:100%; display:flex; flex-direction:row; flex-wrap:wrap; } .main_bg_04 ul li.service_box_01 { width:calc(50% - 20px); background:url('../img/main_bg_03.png') no-repeat center center; height:100vh; max-height:200px; margin-right:40px; padding:30px; } .main_bg_04 ul { width:100%; display:flex; flex-direction:row; flex-wrap:wrap; } .main_bg_04 ul li.service_box_02 { width:calc(50% - 20px); background:url('../img/main_bg_04.png') no-repeat center center; height:100vh; max-height:200px; margin-right:0px; display: flex; padding: 30px; align-items: flex-end; transition:0.3s ease all;} .main_bg_04 ul li.service_box_01 .mbg_bg_text_color { display:inline-block; border-radius:3px; padding:3px 10px; color:#f4f1ea; background:#8e601e; } .main_bg_04 ul li.service_box_01 .mbg_text_color {color:#8e601e; } .main_bg_04 ul li.service_box_01:hover, .main_bg_04 ul li.service_box_02:hover { transform:scale(1.02); cursor:pointer; transition:0.3s ease all; } /* 메인 섹션 05 */ .main_bg_05 { width:100%; margin-bottom:100px; background: url('../img/main_bg_05.png') no-repeat center center; background-size:cover;} .main_bg_05 .mbg_wrap { width:100%; max-width:1200px; margin:0 auto; background: url('../img/main_bg_05_1.png') no-repeat center left; height:100vh; max-height:200px; display: flex; border-radius: 5px; align-items: center; } .main_bg_05 .mbg_wrap span.text_position { padding-left:240px; } /* 장바구니 */ #cart_info { width:100%; padding:10px 20px; background:#f2f3f8; } #cart_info i { margin-right:7px; } #cart_info b { color:#ff003b; } .select_category { display:inline-flex; flex-direction: column; position:relative; width:120px; height:30px; border-top:1px solid #dcdcdc; white-space:nowrap; box-shadow: 0px 0px 3px 1px rgba(0, 0, 0, 0.05); z-index:999; } .option { padding:0 30px 0 10px; min-height:30px; display:flex; align-items:center; radial-gradient(120% 100% at 100% 0%, rgb(4 4 10 / 13%), #0604211a 45%), linear-gradient(#09080c, #08080f) position:absolute; top:0; width: 100%; pointer-events:none; order:2; z-index:1; transition:.2s ease-in-out; box-sizing:border-box; border-right:1px solid #dcdcdc; border-left:1px solid #dcdcdc; border-bottom:1px solid #dcdcdc; overflow:hidden; white-space:nowrap; } .option:hover { background:#f1c800; color:#fff; cursor:pointer; transition:.2s ease-in-out; } .select_category:focus .option { position:relative; pointer-events:all; } input.selectopt { opacity:0; position:absolute; left:-99999px; white-space:nowrap; } input.selectopt:checked + label { order: 1; z-index:2; radial-gradient(120% 100% at 100% 0%, rgb(4 4 10 / 13%), #0604211a 45%), linear-gradient(#09080c, #08080f) border-top:none; position:relative; } input.selectopt:checked + label:after { content:''; width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 5px solid #222; position:absolute; right:10px; top:calc(50% - 2.5px); pointer-events:none; z-index:3; } input.selectopt:checked + label:before { position:absolute; right:0; height: 30px; width: 30px; content: ''; radial-gradient(120% 100% at 100% 0%, rgb(4 4 10 / 13%), #0604211a 45%), linear-gradient(#09080c, #08080f) } .active_opt:hover { color:#f1c800; } .active_opt {color:#f1c800;} /* footer */ footer#pd_footer { width:100%; display:inline-block; background:#333333; border-top:1px solid #dcdcdc; position:relative; bottom:0; font-family:'Noto Sans KR'; color:#fff !important} footer#pd_footer .wrapper { width:100%; max-width:1200px; border-bottom:1px solid #dcdcdc; margin:40px auto; font-size:0; padding-bottom:10px; color:#fff !important} footer#pd_footer .wrapper a, footer#pd_footer .wrapper span, footer#pd_footer .wrapper h2 {color:#fff !important} footer#pd_footer .wrapper .ft_left { width:50%; font-size:14px; color:#fff; display:inline-block; } footer#pd_footer .wrapper .ft_left p { display:block; font-weight:400; color:#fff; letter-spacing:0px; line-height:24px; margin-bottom:10px; } footer#pd_footer .wrapper .ft_left p b { margin:0px 10px; font-size:1px; border-right:1px solid #777;} footer#pd_footer .wrapper .ft_right { width:50%; display:inline-block; text-align:right;vertical-align:top;} footer#pd_footer .wrapper .ft_right .ft_box { display:inline-block; text-align:left; position:relative; background:#333; color:#fff; font-weight:600; letter-spacing:-1px; font-size:15px; padding:12px 20px; min-width:205px; border:1px solid #dcdcdc; } footer#pd_footer .wrapper .ft_right .ft_box img { vertical-align:middle; position:absolute; right:20px; top:20px; } footer#pd_footer .wrapper .ft_right .ft_tbox { display:inline-block; text-align:left; position:relative; color:#303030; background:#e9e9e9; font-weight:600; letter-spacing:-1px; margin-top:10px; min-width:205px; font-size:15px; padding:12px 20px; border:1px solid #dcdcdc; } footer#pd_footer .wrapper .ft_right .ft_tbox img { vertical-align: middle; position: absolute; right: 12px; width: 24px; top: 12px; } footer#pd_footer .ft_copyright {width:100%; max-width:1200px; margin:40px auto; font-weight:600; color:#6b6b6b; padding:0px} footer#pd_footer .ft_copyright .left_copy {display:inline-block; text-align:left; letter-spacing:0px; font-size:12px;} footer#pd_footer .ft_copyright .right_copy {float:right; font-size:11px; font-weight:500; letter-spacing:-0.5px;} footer#pd_footer .wrapper .ft_left .ft_top { font-size:16px; font-weight:400; letter-spacing:-1px;} footer#pd_footer .wrapper .ft_left .ft_top strong { margin:0px 12px; font-size:1px;} footer#pd_footer .wrapper .ft_right p { display:block; font-weight:350; color:#fff; letter-spacing:0px; line-height:24px; margin-bottom:30px; } footer#pd_footer .wrapper .ft_right p b { margin:0px 10px; font-size:1px; border-right:1px solid #777;} footer#pd_footer .wrapper .ft_right .ft_top { font-size:16px; font-weight:400; letter-spacing:-1px;} footer#pd_footer .wrapper .ft_right .ft_top strong { margin:0px 12px; font-size:1px;} footer#pd_footer .wrapper .ft_left p a strong { font-size:0.8em; vertical-align:middle; } /* 쿠폰함 */ #coupon #win_title { width:100%; background:#f1c800; color:#fff; } #coupon > ul { display:flex; flex-wrap: wrap; flex-direction: row; } #coupon > ul > li { width:100%;padding: 10px; border-bottom: 1px solid #dcdcdc; background: #f9f9f9; } /* modal */ .modal {display: none; position: fixed; z-index: 1000; left: 0;top: 0;width: 100%; height: 100%; overflow: auto; background-color: rgb(0,0,0); background-color: rgba(0,0,0,0.4); } .modal-content {background-color: #fefefe;z-index:99;margin: 8% auto; padding: 40px;max-width:700px;border: 1px solid #888;position:relative;width: 50%;-webkit-box-shadow: 0px 3px 8px 0px rgba(0,0,0,0.4);-moz-box-shadow: 0px 3px 8px 0px rgba(0,0,0,0.4);box-shadow: 0px 3px 8px 0px rgba(0,0,0,0.4);-webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out;} .modal-content .subject { width:100%; text-align:left; border-bottom:2px solid #000; font-size:24px; letter-spacing:-1px; color:#222; font-weight:600; padding:15px 0px; padding-top:0; } .modal-content .content { position:relative; width:100%; font-size:14px; letter-spacing:-0.5px;} .modal-content .content .service_content { border:none; resize:none; overflow-y:scroll; overflow-x:hidden; width:100%; height:auto; padding:15px; background:#f9f9f9; height:400px; clear:both; } .modal-content .content .privacy_content { border:none; resize:none; overflow-y:scroll; overflow-x:hidden; width:100%; height:auto; padding:15px; background:#f9f9f9; height:400px; clear:both; } .modal-content .pop_bt { position:absolute; top:35px; right:40px; font-weight:100; font-size:24px; } .modal-content .pop_bt i:hover { cursor:pointer;} .provision, .privacy { cursor:pointer; } /* 퀵메뉴 */ #quick_menu .qm_wrap { width:100px; text-align:center; border:1px solid #dcdcdc; } #quick_menu .qm_wrap h1 { width:100%; padding:5px 10px; background:#333333; color:#fff; } #quick_menu .qm_wrap .qm_box { width:100%; border-top:1px solid #dcdcdc; padding:15px 0; background:#f9f9f9; display:flex; flex-direction:row; flex-wrap:wrap; align-items: center; justify-content: center;} #quick_menu .qm_wrap .qm_box p { width:100%; text-align:center; } #quick_menu .qm_wrap .top_btn { radial-gradient(120% 100% at 100% 0%, rgb(4 4 10 / 13%), #0604211a 45%), linear-gradient(#09080c, #08080f) display:block; padding:3px 2px; border-top:1px solid #dcdcdc;} #quick_menu .qm_wrap .top_btn:hover { cursor:pointer; background:#f1c800; color:#fff; transition:0.3s ease all; } /* main new border gradient */ /*.gradient-border { --borderWidth: 1px; background: #1D1F20; position: relative; border-radius: var(--borderWidth); } .gradient-border:after { content: ''; position: absolute; top: calc(-1 * var(--borderWidth)); left: calc(-1 * var(--borderWidth)); height: calc(100% + var(--borderWidth) * 2); width: calc(100% + var(--borderWidth) * 2); background: linear-gradient(60deg, red, blue, orange, purple, white, lightpink, green, yellow); border-radius: 6px; z-index: -1; animation: animatedgradient 3s ease alternate infinite; background-size: 300% 300%; } @keyframes animatedgradient { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } }*/ /* 모바일 메뉴시작 */ .menu-button { } .menu-button:hover { cursor: pointer; } .menu-wrap { background-color: #fafafa; padding: 0px 0; overflow: scroll; transition: all 0.3s; position: fixed; width: 100%; top: 0; left: -100%; bottom: 0; z-index: 999999; text-align:left; } .menu-wrap ul.cate { radial-gradient(120% 100% at 100% 0%, rgb(4 4 10 / 13%), #0604211a 45%), linear-gradient(#09080c, #08080f) margin-top:7px; box-shadow: 0 0 6px rgba(0, 0, 0, 0.1); } .menu-overlay { background: rgba(0, 0, 0, 0.4); display: none; position: fixed; left: 0; right: 0; top: 0; bottom: 0; z-index: 900000; } .menu-close { background: url(https://ohpin.co.kr/img/m_close.png) no-repeat scroll center center transparent; opacity: 1; background-color:black; position: absolute; width: 50px; height: 50px; right: 0; top: 0; margin-bottom:0; text-indent: -9999px; transition: all 0.3s; } .menu-toggle { display: none; } .menu-toggle:checked+.menu-wrap { left: 0; } .menu-toggle:checked ~ .menu-overlay { display: block; } .menu-title { color: #222; radial-gradient(120% 100% at 100% 0%, rgb(4 4 10 / 13%), #0604211a 45%), linear-gradient(#09080c, #08080f) font-weight: 500; letter-spacing:-1px; margin:0; line-height:0; padding:10px; display:inline-block; text-align:left; } .menu_top_title { display:flex; radial-gradient(120% 100% at 100% 0%, rgb(4 4 10 / 13%), #0604211a 45%), linear-gradient(#09080c, #08080f) align-items: center; justify-content: space-between;} .menu_top_title > .mtt_right h2 { padding:5px 10px; background:#f1c800; border:1px solid #f1c800; color:#fff; border-radius:3px; display:inline-block; } .menu_top_title > .mtt_right h3 { padding:5px 10px; radial-gradient(120% 100% at 100% 0%, rgb(4 4 10 / 13%), #0604211a 45%), linear-gradient(#09080c, #08080f) color:#f1c800; border:1px solid #f1c800; border-radius:3px; display:inline-block; margin-left:5px; } .menu_top_title > .mtt_right { display:flex; margin-right:60px; line-height:1em;} .menu-title > img { max-height:30px; } .menu_top_box { width:100%; display:flex; flex-direction:row; flex-wrap:wrap; background:#426eb9; box-shadow: 0 0 6px rgba(0, 0, 0, 0.1);} .menu_top_box > a { width:25%; text-align:center; line-height:1em; color:#fff; } .menu_top_box > a ion-icon { font-size:24px; } .menu_top_box > a > p { font-size:13px; letter-spacing:-1px; font-weight:500; } .menu-list { position: relative; top: 0px; left: 0; bottom: 0px; width: 100%; height: inherit; padding:0px 0px; display: block; overflow: scroll; } .four_box { width:50%; float:left; padding:10px; background:#04aa9d; text-align:center; color:#fff; margin:0; border-bottom:1px solid #fff;} .four_box:nth-child(2n) { border-left:1px solid white} .four_box a { color:#fff; } .four_boxs { width:100%; float:left; padding:10px; background:#04aa9d; text-align:center; color:#fff; margin:0; border-bottom:1px solid #fff;} .four_boxs a { color:#fff; } .menu-wrap:hover .menu-list { overflow-y: auto; } .scrollLock { overflow: hidden; } .menu-list ul { list-style-type: none; } .menu-list ul > li > ul{ list-style-type: none; padding:10px 0; background:#f9f9f9; border-top:1px solid #dcdcdc; } .menu-list ul > li:nth-last-child(2) > ul { border-bottom:1px solid #dcdcdc; } .menu-list li { display: block; } .menu-list li:first-child { border-top: medium none; } .menu-list li a { display: block; padding: 10px 15px; font-size: 16px; letter-spacing:-1px; color: #444; text-decoration: none; border-top:1px solid #dcdcdc; position:relative; } .menu-list ul li .mb_arrow { vertical-align:baseline; top:18px; right:15px; position:absolute; } .menu-list li:nth-last-child(1) a { padding:10px; width:100%; position:relative; bottom:0; left:0; color:#fff; font-weight:600; font-size:14px; text-align:center; background: #3d8861; background: -webkit-linear-gradient(to right, #3d8861, #2dc97a); background: linear-gradient(to right, #3d8861, #2dc97a); } .menu-list li:nth-last-child(1) a i { margin-right:5px; } .menu-list li a.sub { display: block; padding: 5px 20px; font-size: 14px; letter-spacing:-1px; color: #777; text-decoration: none; border-top:0; border-bottom:0; position:relative; } .menu-list li a.adver { display: block; padding: 7px 0px; font-size: 16px; background: #fbe058; background: -webkit-linear-gradient(to right, #fbe058, #fae986); background: linear-gradient(to right, #fbe058, #fae986); margin:20px 0px; text-align:center; letter-spacing:-1px; font-weight:600; border:1px solid #ffda00; color: #222; border-radius:5px; text-decoration: none; border-bottom:0; position:relative; } phone { display:none; position:absolute; right:20px; top:27px; color:#fff; font-size:24px; } label.phantom_burger_menu{ position:absolute; flex-direction:column; width:20px; cursor:pointer; } label.phantom_burger_menu span{ transition: .4s cubic-bezier(0.68, -0.6, 0.32, 1.6); } .phantom_burger_menu span:nth-of-type(1){ width:50%; } .phantom_burger_menu span:nth-of-type(2){ width:100%; } .phantom_burger_menu span:nth-of-type(3){ width:75%; } .phantom_burger_menu input[type="checkbox"]{ display:none; } .phantom_burger_menu input[type="checkbox"]:checked ~ span:nth-of-type(1){ transform-origin:bottom; transform:rotatez(45deg) translate(2px,1px) } .phantom_burger_menu input[type="checkbox"]:checked ~ span:nth-of-type(2){ transform-origin:top; transform:rotatez(-45deg) } .phantom_burger_menu input[type="checkbox"]:checked ~ span:nth-of-type(3){ transform-origin:bottom; width:50%; transform: translate(9px,-4px) rotatez(45deg); } .todayview { box-shadow: 0 0 6px rgba(0, 0, 0, 0.1); margin-top:7px; }