@import url('https://fonts.googleapis.com/css?family=Poiret+One|Raleway|Rajdhani|Roboto+Mono');


/**/
.self_design { padding:0px; }
.self_design_m_area { margin-top: 0px; }
.self_design_m_area h3.custom_prd_name {text-align:center;  margin-bottom:0px; padding:12px 0 12px 10px; font-weight:bold; color:#000; font-size:15px; font-family:'Nanum Gothic', sans-serif; border-bottom:1px solid #ccc; }
.self_design_m_area h3.custom_prd_name span { display:block; font-weight:bold; }
.content_wrap { background:#fff; min-height:auto;  height:auto;}

.custom_area { position:relative; text-align:center; padding:10px 0 20px; width:100%; background:#fff;  }
.custom_area ul.custom_fix_btn {}
.fix_btn_color {  z-index: 2; font-size: 0px; position:absolute; left: 15px; bottom:0;  }
.fix_btn_color a { text-align:center; display:inline-block; width:60px; height:60px; border:2px solid #eee; border-radius:50%; }
.fix_btn_color a span { margin:6px 0 2px; width:24px; height:24px; border-radius:50%; border:1px solid #ddd; display:inline-block; }
.fix_btn_color a b { display:block; font-size:11px; }
.fix_btn_color a:focus { color:#000; }
.fix_btn_custom { z-index:12; font-size:0; position:absolute; right:15px; bottom:75px; }
.fix_btn_custom a { }
.fix_btn_custom a:focus { color:#000; }
.fix_btn_custom a.toggle-menu { display:block !important; }
.fix_btn_custom b { font-weight:500; margin:3px 0 0; display:block; font-size:12px; }
.fix_btn_custom ul { }
.fix_btn_custom ul li { margin:7px 0; width:60px; height:60px;   border-radius:15px; box-shadow:0px 0px 5px 0px rgba(0, 0, 0, 0.2); background: #fff; }
.fix_btn_custom ul li a { display:block; padding:7px 0; padding-top:9px; }
.fix_btn_custom ul li span { border:1px solid #eee; vertical-align:middle; display:inline-block; width:25px; height:25px; border-radius:50%;  }
.fix_btn_custom ul li span.icon_chg_prd {background: url('/img/icon_custom_quick03.png') 50%  no-repeat; border:none; vertical-align:middle; display:inline-block; width:25px; height:25px; border-radius:0;  -webkit-background-size: 100%;
background-size:100% ; }
.fix_btn_custom ul li:first-child span.icon_chg_prd {background: url('/img/icon_custom_quick08.png') 50%  no-repeat; border:none; vertical-align:middle; display:inline-block; width:25px; height:25px; border-radius:0;  -webkit-background-size: 100%;
background-size:100% ; }

.custom_area .view_wrap_m { height:350px; position:relative; }
.custom_area .view_wrap_m .li_thumb_canvas {/* width:350px; height:350px;*/ position:absolute; top:-155px; left:50%;/* margin-left:-175px;*/ }
.custom_area .view_wrap_m .li_thumb_canvas div.thumb_canvas { position:absolute;/* width:350px; top:0px; left:50%; margin-left:-175px;*/ }
.custom_area .view_wrap_m .li_thumb_canvas div.thumb_canvas_base { position:absolute; /* width:350px;  top:0px;   margin-left:-175px; left:50%;*/}


.custom_area img { width:80%; }

.modal_custom_area { position:unset; padding:0; }

.custom_fix_open { position:absolute; top:50%; left:0; margin:-50px 0 0 0; background:#333 url('/img/icon_close_arrow_left.png') 50% 50% no-repeat; background-size:10px; overflow:hidden; width:26px; height:100px; border-radius:0 25px 25px 0; display:block; }

.modal-content .modal-header h4 { padding-right:60px; font-size:15px; }
.modal-content .modal-header h4 img { margin-right:5px; vertical-align: middle; margin-top: -3px; }

.custom_face {  text-align:center; width:100%; padding:5px; }
.custom_face li { position:relative; margin:0 5px; display:inline-block;  }
.custom_face li:before { left:-6px; top:50%; margin-top:-5px; position:absolute; display:inline-block;  content:''; width:1px; height:10px; background:#ddd; vertical-align:middle; }
.custom_face li:first-child:before { content:none; }
.custom_face li a { padding:5px; position:relative; display:block;text-align:center; }
.custom_face li a span { padding:0 1px 0; border-bottom:1px solid #fff; font-weight:400; font-size:15px; color:#000; }
.custom_face li a.active span { border-bottom:1px solid #7942a1; color:#7942a1; font-weight:500; }

.btn_custom_start { text-align:center; margin-top:10px; }
.btn_custom_start a { font-size:16px; display:inline-block; text-align:center; color:#fff; width:80%; padding:11px 0 11px 40px; background:#000 url('/img/icon_custom_start.png') 29% 50% no-repeat; background-size:26px; }

.btn_buy_area { width:100%; font-size:0; position:fixed; bottom:0; z-index:1000; }
.btn_buy_area a { font-weight:500; padding:0; height:50px; line-height:50px; display:inline-block; font-size:16px; color:#fff; text-align:center; width:50%; background:#252525; }
.btn_buy_area a.btn_opt { background:#f9f9f9; color:#000; }
.btn_buy_area a.cart { background:#333; }
.btn_buy_area a.btn_fix_custom {background:#7942a1;  }

.custom_icon_w {  vertical-align:middle; margin-right:8px; margin-top:-3px; width:17px; height:17px; background:url('/img/custom_icon_w.png') 50% no-repeat; background-size:100%; display:inline-block;  }

nav #send_buy_info {     margin-top: 180px; position:relative; z-index:2; background:#fff; height:calc(100% - 100px); box-shadow:2px 1px 10px rgb(0 0 0 / 30%); }
nav #send_buy_info:after { bottom:100%; margin-bottom:-40px; position:absolute; width:80px; height:80px; border-radius:50%; background:#fff; content:''; display:block; left:50%; 
margin-left:-40px;  box-shadow:2px 1px 10px rgb(0 0 0 / 30%);  }
nav #send_buy_info:before { content:''; position:absolute; width:100%; height:100%; background:#fff; z-index:3; }
.price_area { padding:0 10px 10px; }
.price_area div { border-top:1px solid #ddd; padding:10px 0 0; }
.price_area p { font-size:14px; line-height:1.8; color:#333; }
.price_area p:after { content:''; clear:both; display:block; }
.price_area p span { text-align:right;width:200px; float:right; margin-left:10px; }
.price_area p span b { font-family: 'Poiret One', cursive;}
.price_area p span.order_quantity, .price_area p span.order_dc { font-size:14px; color:#333; }
.price_area p span.order_quantity:after { margin-left:3px; font-size: 15px; display:inline-block;  }/* content:'개'; */
.price_area p span.order_price { font-size:20px; color:#333;}
.price_area p span.order_price:before { content:'₩'; font-size: 15px; display:inline-block; }
nav a.btn_buy_colse { bottom:100%; margin-bottom:-40px; position:absolute; z-index:2; background:#fff; left:50%; margin-left:-40px; border-radius:50%; overflow:hidden; width:80px; height:80px; display:block; }
nav a.btn_buy_colse:after { position:absolute; content:"\e946"; font-family:xeicon;  color: #000; font-size: 30px; left: 50%; margin-left: -15px;}

nav #send_buy_info .size_select {height:calc(100% - 212px); padding:20px 15px; }
nav #send_buy_info .size_select h3 { color:#000; font-weight:500; padding:0; font-size:15px; margin:0px 0 10px; }
nav #send_buy_info .size_select div.at_tbl { border:1px solid #ccc; background:#fff; padding:10px; }
nav #send_buy_info .size_select div.at_tbl .at_tbl_tr .size { min-width:150px !important; }
nav #send_buy_info .size_select div.at_tbl .at_tbl_tr .price { width:100px; min-width:100px !important; }
nav #send_buy_info .size_select div.at_tbl .at_tbl_tr .quantity { width:120px; min-width:120px !important; }
.send_btn_area,
nav #send_buy_info .size_select,
.price_area {  position:relative; z-index:4;  }

.m_opt_half { height:50%; }

.send_btn_area { width:100%; font-size:0;  }
.send_btn_area a {  font-weight:500; padding:0; height:50px; line-height:50px; display:inline-block; font-size:16px; color:#fff; text-align:center; width:50%; background:#7942a0; }
.send_btn_area a.cart { background:#252525; }
/*
.send_btn_area a:last-child { background:#e6e6e6; width:16%; }
.send_btn_area a:last-child img { width:25px; }
*/

.select_modal { background:rgba(171, 171, 171, 0.1); }
.select_modal .modal-dialog { margin-top:15%; }
.select_modal .modal-body { padding:0px;  border-radius:5px; }
.select_modal h3 { height:50px; line-height:50px;  font-size:15px !important; margin:0px; background:#777; color:#fff; border-radius:5px 5px 0 0; }
ul.select_color { font-size:0; padding:20px 15px; }
ul.select_color li { padding:11px 10px; border-bottom:1px dashed #ddd; margin:0; text-align:left; }
ul.select_color li.on { background-color:#fbfbfb; }
ul.select_color li a { display:block;  }
ul.select_color li a span {  vertical-align:middle; border:1px solid #ddd;  display:inline-block; width:26px; height:26px; border-radius:50%; }
ul.select_color li a b { color:#000; margin-left:10px; vertical-align:middle; display:inline-block; font-size:13px; }
ul.select_color li.active a span { background-image:url('/img/icon_select_color.png'); background-position:50% 50%; background-size:80%; background-repeat:no-repeat; }
ul.select_color li:last-child { border-bottom:0; }
ul.select_color li a:focus { color:#000; }


.select_option { padding:0 20px; }
.select_option .at_tbl_tr.first .at_tbl_th, .select_option .at_tbl_tr.first .at_tbl_td { background:none; border:0px; font-size:15px; color:#333; font-weight:bold !important; }
.select_option .at_tbl_tr.first { border-bottom:1px dashed #000 !important; margin-bottom:10px; }
.select_option .at_tbl_tr { border:0px !important; }
.select_option .at_tbl_tr.first .at_tbl_td { padding-right:56px; }

.size_select div.at_tbl .at_tbl_tr .at_tbl_th { background:none; min-width:150px; }

.select_option .at_tbl_th, .select_option .at_tbl_td {  border:0px !important; height:32px; padding:1px 10px; }
.select_option .at_tbl_th {  font-weight:normal !important; }

.select_option .at_tbl_td { text-align:right; }
.select_option .at_tbl_td input { vertical-align:middle; text-align:center; line-height:12px; width:30px; margin:0 1px; height:25px !important; padding:2px; border-radius:2px; border:1px solid #ccc; color:#000; }
.select_option .at_tbl_td button { width:25px; text-align:center; font-size:12px; line-height:12px; font-family:Arial; border-radius:3px; height:25px; color:#000; border:1px solid #5D5E60; background:#E9E9E9; }

.selec_opt_result {  }
.selec_opt_result ul { min-height:50px; margin:0 0 5px; display:table; width:100%; background:#f9f9f9; padding:10px 15px; }
.selec_opt_result ul li {  display:table-cell; vertical-align:middle; }
.selec_opt_result ul li:first-child { padding-right:5px; color:#222; font-size:14px; }
.selec_opt_result ul li.opt_cnt {  font-size:0; width:120px; }
.selec_opt_result ul li.opt_cnt div {  }
.selec_opt_result ul li.opt_cnt a { color:#fff; vertical-align:middle; border-radius:50%; display:inline-block; line-height:26px; background:#000; width:26px; }
.selec_opt_result ul li.opt_cnt input { background:none; box-shadow:none; vertical-align:middle; font-size:15px; display:inline-block; height:30px; width:58px; border:0; padding:0; }
.selec_opt_result ul li.opt_cnt span { display:inline-block; }
.selec_opt_result ul li.opt_cancel { width:40px; text-align:right; }
.selec_opt_result ul li.opt_cancel a { vertical-align:middle; text-align:center; border:1px solid #222; background:#fff; width:32px; display:inline-block; height:32px; }
.icon_minus {  }
.icon_plus {  }
.icon_cancel {  }
.icon_cnt { display:inline-block; width:26px; height:26px; position:relative;  }
.icon_cnt:before,
.icon_cnt:after { background:#ccc; content:''; display:inline-block; position:absolute; width:14px; height:1px; }
.icon_minus:before { left:50%; margin-left:-7px; top:50%; }
.icon_minus:after { content:none; }
.icon_plus:before { left:50%; margin-left:-7px; top:50%; }
.icon_plus:after { height:14px; width:1px; left:50%; top:50%; margin-top:-7px; }
.icon_cancel:before {top:50%; left:50%; margin-left:-7px;  background:#222; transform:rotate(45deg); }
.icon_cancel:after {top:50%; left:50%; margin-left:-7px; background:#222; transform:rotate(-45deg); }

/*==== 커스텀화면 ====*/
#startCustom { padding-right:0px !important; }
#startCustom .modal-sampleRequest { width:100%; margin:0 0 0 -50%; left:50%; position:fixed; height:100%; top:0; }
#startCustom .modal-content { position:fixed; height:100%; width:100%; }
#startCustom .modal-header { padding:0px 0; background:#333; position:absolute; width:100%; z-index:101; }
#startCustom .modal-header .modal_close {z-index:5; border:1px solid #fff; border-radius:3px; font-weight:bold; color:#fff; font-size:13px; top:11px; position:absolute; right:15px; padding:4px 8px; margin:0px;  }
#startCustom .modal-body { height:100%; width:100%; padding:0px; }
#startCustom .modal-body .row { height:100%; position:relative; margin:0px; }
#startCustom .modal-sampleRequest .custom_top { width:100%; height:663px; overflow-y:auto; position:relative; z-index:1; }
#startCustom .modal-sampleRequest .custom_top .custom_img { width:auto; position:relative; height:410px; margin:0 auto; }
#startCustom .modal-sampleRequest .custom_top .custom_img img { position:absolute; top:0; left:0; bottom:0; right:0; margin:auto;  }
#startCustom .custom_btn {/* box-shadow:0px -3px 20px #e2e2e2;*/ background:#fff; position:fixed; z-index:1; bottom:0px; width:100%; height:73px; padding:0px !important;  }
.custom_btn ul { height:65%; }
#startCustom .sampleContents { position:relative; height:78%; padding:0 15px; }
.custom_btn .custom_btn_area { box-shadow:0px 7px 15px rgba(0, 0, 0, 0.5); position:absolute; z-index:100; text-align:center; background:#fff; padding:0px; bottom:0px;width:100%; font-size:0; line-height:0; }
.custom_btn .custom_btn_area ul { width:100%; font-size:0; }
.custom_btn .custom_btn_area ul li { padding:10px 0; position:relative;  width:20%; text-align:center; display:inline-block; }
.custom_btn .custom_btn_area a { transition:inherit; -webkit-transition:inherit; font-size:11px; display:inline-block;  line-height:1; color:#000; }
.custom_btn .custom_btn_area li.active a { color:#5ac5cb; background-position:50% -60px; }
.custom_btn .custom_btn_area li span { background:#fff; display:inline-block; width:40px; height:40px; border-radius:50%; line-height:40px; }
.custom_btn .custom_btn_area li b { margin:6px 0 0; display:block; font-weight:400; }
.custom_btn .custom_btn_area li i { vertical-align:middle; display:inline-block; width:30px; height:30px; }
.custom_btn .custom_btn_area li:before { content:''; display:block; position:absolute; width:1px; height:100%; background:#eee; left:0; top:0; }
.custom_btn .custom_btn_area li:after { content:''; display:block; position:absolute; width:1px; height:100%; background:#fff; left:1px; top:0; }
/*.custom_btn .custom_btn_area li:nth-child(1) span i { background:url('/img/custom_detail_btn01.png') 0 50% no-repeat; background-size:30px; }*/
.custom_btn .custom_btn_area li:nth-child(1) span i { background:url('/img/custom_detail_btn02.png') 0 50% no-repeat; background-size:30px;  }
.custom_btn .custom_btn_area li:nth-child(2) span i { background:url('/img/custom_detail_btn03.png') 0 50% no-repeat; background-size:30px;  }
.custom_btn .custom_btn_area li:nth-child(3) span i { background:url('/img/custom_detail_btn04.png') 0 50% no-repeat; background-size:30px;  }
.custom_btn .custom_btn_area li:nth-child(4) span i { background:url('/img/icon_custom_quick07.png') 0 50% no-repeat; background-size:30px;  }
.custom_btn .custom_btn_area li:nth-child(1):before,
.custom_btn .custom_btn_area li:nth-child(1):after { content:none; }

#startCustom .modal-sampleRequest .custom_top .custom_img .main_canvas_wrap { }
#startCustom .modal-sampleRequest .custom_top .custom_img .main_canvas_wrap > div {/* top:30px; margin-left:-175px; width:350px; height:350px;*/ position:absolute;  top:-120px; left:50%;  margin-left:-330px;  }

#startCustom .listing-item { margin-bottom:0px; }
#startCustom .listing-item .body { padding:10px 0; height:56px; }
#startCustom .sampleContents .prd_name { font-size:12px; margin:0px; }
#startCustom .sampleContents .desc { display:none; }

#startCustom .modal-sampleRequest .custom_top .custom_face { border:0; margin:52px auto 0; padding:10px 0; }

.cbp-spmenu { visibility:hidden; z-index:1001; background:none; }
.cbp-spmenu.cbp-spmenu-open {visibility:visible; height:100%; }
.cbp-spmenu-bottom { bottom:-120%; }
.cbp-spmenu-left { background:#f30; }

/* 커스텀화면 탭 컨텐츠 */
/*.tab-content { position:absolute; z-index:3; background:#fff; bottom:73px; width:100%; }*/
.tab-content { position:absolute; top:0; width:100%; height:100%; }
.tab-content .tab-pane { height:100%; position:relative; z-index:102; background:#fff; }
.tab-content .tab-pane .tab_header { text-align:left; padding-left:15px; width:100%; background:#fff; font-size:16px; font-weight:bold; color:#000; height:45px; line-height:45px; }
.tab-content .tab-pane .tab_header a { color:#000; padding:0 15px; right:0; top:0; position:absolute;}
.tab-content .tab-pane .tab_header a i {     vertical-align: middle; margin-top: -5px; color:#000; font-size:30px; }

.icon_deco_cate { position:absolute; font-size:0; top:44px; bottom:0; right:0; left:0; padding:20px 15px 20px;  overflow-y:auto; }
.icon_deco_cate ul { text-align:left; height:auto; position:relative; }
.icon_deco_cate li { vertical-align:top; text-align:center; width:31%; margin:0 1% 2%; display:inline-block; font-size:13px; }
.icon_deco_cate li a { font-weight:400; font-weight:bold; padding:10px 5px; border-radius:5px; border: 1px solid #ddd; color:#333; display:block; font-size:14px;}
.icon_deco_cate li a p { margin-top:10px; }
.icon_deco_cate li a span { vertical-align: middle; text-align: center; display: inline-block; width: 64px; height: 64px; line-height: 64px; }
.icon_deco_cate li a img { width:100%; }

.icon_deco_contents { height:calc(100% - 45px); width:100%; }
.icon_deco_contents ul { font-size:0; height:100%; overflow-y:scroll; padding:16px 0px; }
.icon_deco_contents ul li { height:120px; margin:0 0 2%; text-align:center; display:inline-block; width:33.3%; padding:1%; position:relative; }
.icon_deco_contents ul li a { width:100%; height:120px; background:#eee; display:block; padding:5px; }
.icon_deco_contents ul li a img { position:absolute; margin:auto; top:0; bottom:0; left:0; right:0; max-width:80%; max-height:80%; }

/*removed by Van 2022.10.14*/
/*.icon_deco_cate_back {  margin:0; left: 0; position: absolute; top: 0; z-index: 2; width: 85%; background: #fff;}
.icon_deco_cate_back a { color:#000; font-size:16px; display:block; font-weight:bold; line-height:45px; padding:0; padding-left:15px; }
.icon_deco_cate_back a:before { content:none; }
.icon_deco_cate_back a i { font-size:20px; margin-right:5px; }*/
.my_img_upload { height:calc(100% - 45px); padding:0 15px; }

.sampleList { position:absolute; margin:0 15px 15px; padding:0px; overflow-y:auto; top:110px; left:0; bottom:0; right:0;  font-size:0; }
.sampleList ul { text-align:left; height:auto;  position:relative;  }
.sampleList li {  width:30%; padding:1%; margin:1%; display:inline-block; position:relative; }
.sampleList li a {  border-radius:4px; padding:5px 0; display:block; }
.sampleList li a.delete { border:0; border-radius:50%; position:absolute; top:-8px; right:-10px; background:#000; display:inline-block; width:20px; line-height:20px; height:20px; text-align:center; }
.sampleList li a.delete i { margin-top:-10px; vertical-align:middle; color:#fff; font-size:11px; }

.my_img_upload > div > a { width:100%; display:block; border-radius:4px; color:#fff; font-size:14px; font-weight:bold; text-align:center; background:#373737; padding:12px 0; }
.my_img_upload_wrap { padding:0 0 10px; }


/**/
.custom_add_txt { box-shadow:0px 7px 15px rgba(0, 0, 0, 0.5); z-index:101; display:none; position:absolute; width:100%; bottom:0px; background:#fff; }
.custom_add_txt.active { display:block; }

.custom_select_color { overflow:hidden; border-radius:5px; box-shadow:3px 3px 12px rgb(0 0 0 / 20%); z-index:101; display:none; position:absolute; width:calc(100% - 30px); left:15px; bottom:20px; background:#fff;}
.custom_select_color.active { display:block; }

/*added by Van 2022.07.18*/
.custom_finish { overflow:hidden; border-radius:5px; box-shadow:3px 3px 12px rgb(0 0 0 / 20%); z-index:101; display:none; position:absolute; width:calc(100% - 30px); height:390px; left:15px; bottom:20px; background:rgba(0,0,0,0.4);}
.custom_finish.active { display:block; }

/* 텍스트넣기 */
.add_text_area { padding:15px 15px; }
.add_text_area .text_area { padding:0; margin-bottom:10px; font-size:0; }
#div_text_area { text-align:left; }
.text_area { position:relative; }
.text_area textarea { font-size:15px; min-height:70px; border:1px solid #eee; padding:10px; width:80%; }
.text_area textarea:focus { outline:#000 solid 2px; }
.text_area textarea::-webkit-input-placeholder { color:#999; font-family:'Nanum Gothic', sans-serif; }
.text_area textarea:-moz-placeholder  { color:#999;  font-family:'Nanum Gothic', sans-serif; }
.text_area textarea::-moz-placeholder  { color:#999; font-family:'Nanum Gothic', sans-serif; }
.text_area textarea:-ms-input-placeholder  { color:#999;   font-family:'Nanum Gothic', sans-serif; }
.add_text_area .at_tbl { padding:5px 0; border:0; border-top:1px solid #eee; }
.add_text_area .at_tbl .at_tbl_th { width:93px; padding:0; font-size:14px; font-family:'Nanum Gothic', sans-serif; }
.add_text_area .at_tbl .at_tbl_td { position:relative; padding:0px; text-align:right; }

.div_text_edit_tools.text_align  { border-bottom:1px solid #eee; }

#div_done_edit_text { border-radius:5px; position: absolute; right: 0px; top: 0; font-size:13px; height:70px; padding: 6px 10px; text-align:center; font-weight:500; background: #444; width:18.5%; color:#fff; }
#div_done_edit_text a { position: absolute;transform: translate(-50%, -50%); left:50%; top:50%; }

.sel_font_family_select img { top: 13px; margin-left:15px; position:absolute; right:10px;}
.color_select, .text_align { padding:5px 0; }
.sel_font_color_select, .sel_font_family_select { margin-right:7px; text-align:center; line-height:35px; position:relative; border:1px solid #ddd; height:35px; display:block; cursor:pointer; } /* width:42px; */
.sel_font_color_select span {  margin-left:3px; vertical-align:middle; font-size:13px; font-family:'Nanum Gothic', sans-serif;  }
.sel_font_color_select img { top: 13px; margin-left:15px; position:absolute; right:10px; }
.color_picker { display:inline-block; width:20px; height:20px; background:#000; border-radius:50%; border:1px solid #ddd; }
.sel_font_color_select i, .sel_font_family_select i { margin-top:-5px; font-size:23px; vertical-align: middle; }
.sel_font_family_select i { color:#000; }
.sel_font_color_select i { color:#f30; }

.txt_align a {text-align:center; display:inline-block;  margin-left:7px; width:42px; height:35px; border:1px solid #ddd; line-height:35px; transition:none; }
.txt_align a span { vertical-align: top; display:inline-block; width:22px; height:23px; margin-top:5px; }
a#a_text_align_left span { background:url('/img/align_left.png') 0 -23px no-repeat; background-size:22px; }
a#a_text_align_center span { background:url('/img/align_center.png') 0 -23px no-repeat; background-size:22px; }
a#a_text_align_right span { background:url('/img/align_right.png') 0 -23px no-repeat; background-size:22px; }
.txt_align a.active { border:1px solid #ff505d;  }
.txt_align a.active span { background-position:0 0 !important; }

.add_text_btn {  text-align:center; }
.add_text_btn button { padding:14px 0; border-radius:0px; width:100%; line-height:1; font-weight:bold; margin:15px auto 0; background:#ff505f; color:#fff; }

.color_select { position:relative; }
.sel_font_color_list.ul_select {  position:absolute; right:0; bottom:100px;width:100%; z-index:2; box-shadow:0px 0px 9px rgba(0, 0, 0, 0.4); }
.sel_font_color_list.ul_select ul { z-index:10; background:#fff; height:194px; overflow-y:auto; overflow-x:hidden; border:1px solid #ccc; }
.sel_font_color_list.ul_select span { margin-left:3px; vertical-align:middle; font-size:13px; font-family:'Nanum Gothic', sans-serif; }
.sel_font_color_list.ul_select li {  }
.sel_font_color_list.ul_select li a { padding-left:10px; display:block; line-height:47px; text-align:left; }
.sel_font_color_list.ul_select li a:hover { background:#f5f5f5; }

.text_select { position:relative; }
.sel_font_family_list.ul_select { height:194px;  position:absolute; right:0; bottom:100px; width:100%; z-index:2; box-shadow:0px 0px 9px rgba(0, 0, 0, 0.4); }
.sel_font_family_list.ul_select ul { background:#fff; height:194px;  overflow-y:auto; overflow-x:hidden; border:1px solid #ccc; }
.sel_font_family_list.ul_select span {   }
.sel_font_family_list.ul_select li a {  padding-left:10px; display:block; line-height:47px; text-align:left; }
.sel_font_family_list.ul_select li a:hover { background:#f5f5f5; }

#print_side .custom_face { margin-top:10px; }
#print_side .custom_face li a span.img { width:70px; height:70px; }

#prd_color ul.select_color { height:190px; overflow-y:scroll; padding:0; }

/**/
.close_select_box { top: auto; margin-left:0; right:0; left:auto; position:absolute; bottom:100%; }
.close_select_box i { font-size:30px; text-shadow: 0px 2px 3px #848484; }



/* 다른상품선택 모달 */
.prd_modal {  }
.prd_modal .modal-dialog { width:100%; height:100%; margin:0; }
.prd_modal .modal-content { height:100%; width:100%; position:fixed; }
.prd_modal .modal-header { border:0; text-align:center; height:45px; line-height:45px; padding:0px; background:#fff; position:absolute; width:100%; z-index:100; }
.prd_modal .modal-header h4 { color:#000; padding-right:0; text-align:center; height:45px; line-height:45px; }
.prd_modal .modal-header .modal_close {  position: absolute; left:0; top:0;   padding: 0 15px; }
.prd_modal .modal-header .modal_close i { color:#000; font-size: 30px; margin-top:-5px;  vertical-align: middle; }
.prd_modal .modal-body { height:100%; width:100%; padding:0px; padding-top:45px; }
.prd_modal .modal-body .prd_cate { background:#fff; position:relative; padding-top:50px; }
.prd_modal .modal-body .prd_cate > a { position:relative; height:40px; line-height:40px; text-align:left; padding-left:20px; width:calc(100% - 30px); margin:auto; display:block; border:1px solid #7842a0; border-radius:5px; }
.prd_modal .modal-body .prd_cate > a:active,
.prd_modal .modal-body .prd_cate > a:focus { color:#7842a0; }
.prd_modal .modal-body .prd_cate > a span {  font-size:14px; }
.prd_modal .modal-body .prd_cate > a > i { color:#7842a0; font-size:22px; position:absolute; right:10px; top:12px;  }
.prd_modal .modal-body .prd_cate ul { max-height:300px; overflow-y:auto; box-shadow:-1px 3px 9px 0px rgba(0, 0, 0, 0.5); border-bottom:1px solid #ccc; position:absolute; top:50px; background:#fff; width:calc(100% - 30px); left:15px; z-index:2; padding:0; border-radius: 10px; }
.prd_modal .modal-body .prd_cate ul li {text-align:left;   }
.prd_modal .modal-body .prd_cate ul li a { border-bottom:1px solid #eee; display:block; padding:10px; font-size:15px; }
.prd_modal .modal-body .prd_cate ul li a.active { color:#7842a0; }
.prd_modal .modal-body .prd_cate ul li:last-child a { border-bottom:0px; }

.prd_modal .modal-body .prd_cate select { border: 1px solid #7842a0; border-radius: 5px; width: calc(100% - 30px); margin: auto; margin-bottom:5px; }

.prd_modal .modal-body .designLayerContents { position:relative;  }
.prd_modal .modal-body .sampleContents { padding:0 3%; font-size:0; height:93%; margin-top:10px; }
.prd_modal .modal-body .sampleContents li { padding:2%; vertical-align:top; top:0;position:relative; border:1px solid #ddd; margin-right:4%; margin-bottom:4%; width:48%; display:inline-block;  background:#f3f5f7;  }
.prd_modal .modal-body .sampleContents li:nth-child(2n) { margin-right:0px; }
.prd_modal .modal-body .sampleContents li .body { padding:0 10px; }
.prd_modal .modal-body .sampleContents li .body h3 { min-height:30px; margin:7px 0 0; font-size:13px; }
.prd_modal .modal-body .sampleContents li .body .desc { font-family:'Rajdhani', sans-serif; width:80%; font-weight:bold; padding:3px 0; margin:5px auto; text-align:center; font-size:14px; display:block; background:#3c3c3c; color:#fff; border-radius:3px; }
.prd_modal .modal-body .sampleContents li .body .desc b {  font-family:'Poiret One', cursive;  }

.prd_modal .design_sample_list { margin:0; }

.prd_modal .category_goods { margin:0; margin-top:15px; height:calc(100% - 70px); overflow-y:auto; }
.prd_modal .category_goods li { vertical-align:top; top:0;position:relative; display:inline-block;  background:#fff;  }
.prd_modal .category_goods li:nth-child(2n) { margin-right:0px; }
.prd_modal .category_goods li p.prd_name { margin:7px 0 0; font-size:13px; font-weight:bold; color:#555; text-align:left; overflow: hidden; text-overflow: ellipsis; display: -webkit-box;-webkit-line-clamp: 2; /* 라인수 */ -webkit-box-orient: vertical; word-wrap:break-word; line-height: 1.4em; height: 2.8em; }
.prd_modal .category_goods li p.prd_price {   font-weight:bold;  text-align:left; font-size:14px; display:block; }

.prd_modal .sample_design_list { overflow-y:scroll; padding:0 3%; font-size:0; height:93%; margin-top:10px; }
.prd_modal .sample_design_list li { margin:0; padding:2%; vertical-align:top; top:0; border-radius:4px; position:relative; border:1px solid #ddd; margin-right:2%; margin-bottom:2%; width:49%; display:inline-block;  background:#fff;  }
.prd_modal .sample_design_list li:nth-child(2n) { margin-right:0px; }
.prd_modal .sample_design_list li p.prd_name { min-height:38px; margin:7px 0 0; font-size:13px; font-weight:bold; color:#555; text-align:center; }
.prd_modal .sample_design_list li p.prd_sample {  width:80%; font-weight:bold; padding:3px 0; margin:5px auto; text-align:center; font-size:14px; display:block; background:#3c3c3c; color:#fff; border-radius:3px; }

/* 이미지사이즈표기 */
#div_mm_size { color:#000; text-align:center; font-weight:bold; margin:0; font-size:12px; }
#div_mm_size p { margin-top:10px; }


/* 편집툴 */
.div_edit_tool { padding:0 1%;  width:100%; font-size:0; text-align:center; margin:20px 0; position:relative; z-index:102; }
/*.div_edit_tool li { display:inline-block;  width:20%; padding:0 1%;  }*/
.div_edit_tool li { display:inline-block;  width:25%; padding:0 1%;  }
.div_edit_tool a { border-radius:5px; border:1px solid #ddd;  text-align:center; font-size:11px; display:block; font-weight:bold; padding:0; height:37px; line-height:37px;background:#fafafa; color:#222; }
.div_edit_tool a.text { background:#3cbfcd; }
.div_edit_tool a.delete { background:#eb516b; border-color:#eb516b;}

.div_edit_align { padding:0 1%; width:100%; font-size:0; text-align:center; margin:10px 0 2%; position:relative; z-index:102; }
.div_edit_align li { display:inline-block; width:20%; padding:0 1%; }
.div_edit_align a { border-radius:5px; border:1px solid #ddd; text-align:center; font-size:11px; display:block; font-weight:bold; padding:0; height:37px; line-height:37px; background:#fafafa; color:#222; }
.div_edit_align a.delete { background:#ff505f; color:#fff; border-color:#ff505f; }
.icon_move {vertical-align: middle; margin-top:-3px; display:inline-block; width:17px; height:17px; }
.icon_move.icon_m_left { background:url('/img/custom_move_btn.png') 0 -51px no-repeat; background-size:17px; }
.icon_move.icon_m_top { background:url('/img/custom_move_btn.png') 0 -17px no-repeat;  background-size:17px; }
.icon_move.icon_m_bottom { background:url('/img/custom_move_btn.png') 0 -34px no-repeat; background-size:17px; }
.icon_move.icon_m_right { background:url('/img/custom_move_btn.png') 0 0 no-repeat; background-size:17px; }
.icon_move.icon_m_expand { background:url('/img/custom_move_btn.png') 0 -68px no-repeat; background-size:17px; }
.icon_move.icon_m_compress { background:url('/img/custom_move_btn.png') 0 -85px no-repeat; background-size:17px; }

/* 텍스트 */
.div_edit_text { width:100%; padding:20px;  position:relative; z-index:102; }
.div_edit_text a { border-radius:20px; text-align:center; font-size:13px; width:66%; margin:0 auto; display:block; padding:10px; background:#999; color:#fff; }

/* 내 이미지 업로드 버튼 */
div#div_upload_my_img div.dz-default span { cursor:pointer; padding:10px 20px; background:#f0525f; color:#fff; font-size:14px;  }

.edit_fix { max-height:100%; position:fixed; z-index:101; bottom:10px; background:rgba(255, 255, 255, 0.9); border-radius:10px; box-shadow:1px 1px 8px rgb(0 0 0 / 20%); width:96%; margin:0 0 0 2%; }
.edit_txt_area { position:relative;    padding: 15px 0 40px; }
.btn_edit_text { position:absolute; right:2%; top:14px;  }
#li_edit_text { border:1px solid #000; line-height:36px;  font-size:12px; padding:0 7px; border-radius:5px; background:#fff; }
#li_edit_text a { color:#000; }

#li_edit_close {  position:absolute; right:0; margin-bottom:5px; bottom:100%; font-size:34px;  line-height:1; }
#li_edit_close_img_group { text-shadow: 0px 2px 3px #848484; position:absolute; right:0; margin-bottom:5px; bottom:100%; font-size:34px;  line-height:1; }

/* ========= Menu Icon Base ======== */

.menu6 {
  cursor: pointer;
  display: inline-block;
  font-size: 10px;
  width: 20px;
  height: 36px;
  margin: 2%;
  position: relative;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  -webkit-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out;
  -webkit-tap-highlight-color: transparent;
}


/* ============ Menu6 ============ */

.menu6 span {
  left: 0;
  background: #fff;
  border-radius: 5px;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  height: 2px;
  position: absolute;
  -webkit-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out;
  width: 100%;
  -webkit-tap-highlight-color: transparent;
}

.menu6 span:nth-child(1) {
  top: 17px;
}
.menu6 span:nth-child(2) {
  -webkit-transform: rotate(90deg);
          transform: rotate(90deg);
  top: 17px;
}
.open.menu6 {
  -webkit-transform: rotate(135deg) translatey(0.3em);
          transform: rotate(135deg) translatey(0.3em);
}

.open.menu6 span { top:0; margin-top:14px; }

@media (min-width:375px) {

    .prd_modal .category_goods_wrap, .prd_modal .sample_design_list { height:92%; }
    .custom_face { padding:0px 10px; }

    .div_edit_text  { padding:10px; bottom:135px; }

    nav #send_buy_info .size_select div.at_tbl .at_tbl_tr .size { min-width:120px !important; }
    nav #send_buy_info .size_select div.at_tbl .at_tbl_tr .price { width:80px; min-width:80px !important; }
    nav #send_buy_info .size_select div.at_tbl .at_tbl_tr .quantity { width:120px; min-width:120px !important; }
}

@media (max-width:360px) {

    .prd_modal .category_goods_wrap, .prd_modal .sample_design_list { height:91%; }


    .div_edit_text  { padding:5px; bottom:135px; }




    nav #send_buy_info .size_select div.at_tbl { padding:5px; }
    nav #send_buy_info .size_select div.at_tbl .at_tbl_tr .size { min-width:120px !important; }
    nav #send_buy_info .size_select div.at_tbl .at_tbl_tr .price { width:80px; min-width:80px !important; }
    nav #send_buy_info .size_select div.at_tbl .at_tbl_tr .quantity { width:120px; min-width:120px !important; }

}

.at_modal_style .modal-header h4 { position:relative; padding:0;  
    line-height: 54px;text-align:center; }
.at_modal_style .modal-header h4 i { position:absolute; left:15px; font-size:22px; top:19px; }
.at_modal_style .modal-header h4 i,
.at_modal_style .modal-header h4 span { color:#fff; }

@media (max-width:320px) {

    .main-container.self_design { min-width:350px; }
    #startCustom .modal-header { padding:0 0 0 10px; }
    .at_modal_style .modal-header h4 { padding:10px 0; }
    #startCustom .modal-header .modal_close { line-height:39px; font-size:13px; }

    .header-container { position:relative; }
    .custom_btn .custom_btn_area a { font-size:10px;   }
    .at_modal_style .modal-header h4 { font-size:13px; }
    #startCustom .custom_btn { height:70px; }

}


/**/
.edit_add_txt { border-bottom:1px dashed #ddd; padding:10px; }
.edit_tool_wrap { display:table; width:100%; }
.edit_tool_wrap > div { display:table-cell; vertical-align:middle; }
.change_f_c { text-align:left; }
.change_f_c > div { display:inline-block; }
.txt_align { text-align:right; }



.custom_prd_desc { padding:15px; margin:0 0 15px; border-top:10px solid #f5f5f5; }
.custom_prd_desc h3 { color:#000; font-size:19px; }
.custom_prd_desc p {  }
.custom_prd_price { margin:10px 0 0; border-bottom:1px solid #ccc; padding:0 0 15px; }
.custom_prd_price > * { display:inline-block; vertical-align:middle; margin:0; margin-right:10px; }
.custom_prd_price h5 { font-size:16px; }
.custom_prd_price span { color:#000; font-size:22px; font-weight:600; }
.custom_prd_price em { font-size:20px; color:#7942a1;  }

.tab_wrap { padding:0; }


.m_color_box { margin:0 0 20px; position:relative; }
.selected_color {  }
.selected_color a  { line-height:40px; padding:0 10px; color:#000;  border-radius:5px; font-size:15px;  display:block; border:1px solid #7942a0;  }
.selected_color span { vertical-align: middle;
    border: 1px solid #ddd;
    display: inline-block; margin-right:10px;
    width: 26px;
    height: 26px;
    border-radius: 50%; }
.m_select_color { box-shadow:2px 1px 8px rgb(0 0 0 / 20%); z-index: 2; border-radius:5px; width:100%; position:absolute; top:70px; left:0; background:#fff; overflow:hidden;  overflow-y: auto; max-height: 170px;}
.m_select_color ul.select_color {  padding:0; }

.m_size_box { height:calc(100% - 80px); }