/*----------------------------------------
      서브타이틀                        
------------------------------------------

.subtitle {position: relative;display: block;width: 100%;background-color: #f3f3f3;}
.subtitle h1 {font-size: 20px;color: #ffffff;text-shadow: 0 0 rgba(0,0,0,0.4);vertical-align: middle;position: absolute;top: 50%;transform: translateY(-50%);left: 20px;background: rgba(0,0,0,0.4);display: inline-block;padding: 7px 10px;}
.subtitle h1 span {display: inline-block;font-size: 17px;padding: 0 5px;vertical-align: bottom;}
.subtitle .bg_img {position: relative;display: block;width: 100%;}
.subtitle .bg_img img {position: relative; display: block; width: 100%; }

.subtitle.no-bg {height:100px;}*/

/*------------------------------------------------------------
                            ORDER                           
------------------------------------------------------------*/

/*레이아웃*/
.podGoods {position:relative; width:100%;}
.podGoods .pod_detail {position:relative; left:0; top:0; width:100%; margin:0; box-shadow:3px 1px 2px rgba(0,0,0,0.1); z-index:2; background:#fff;}


/*pod_item*/
.pod_item {position:relative;width:100%;overflow:hidden;border-bottom:1px solid #ddd;padding:10px;float:left;}
/*.pod_item_exp {margin-bottom:70px;}*/
.pod_item.pod_item_line, 
.pod_item_exp {padding-top:10px;}


.pod_item .pod_title {font-size: 1.2em;line-height:35px;color: #231f20;font-weight:500;margin:0;text-align: left;letter-spacing: -0.5px;}
.pod_item .pod_title .code {font-size: 70%;display: inline-block;color: #8c8a8b;font-weight:400;vertical-align: middle;}
.pod_item .pod_title .code:before {content:"(";}
.pod_item .pod_title .code:after {content:")";}
.pod_item .pod_title .btn_my {display:inline-block;font-size:13px;line-height: 33px;padding: 0px 7px;color: #e8340c;border-radius:3px;font-weight:normal;vertical-align:middle;float:right;letter-spacing: 0.02em;border: 1px solid #f8c2b6;background: #fff;}
.pod_item .pod_title .btn_my i {font-size:16px;color: #e8340c;margin-right: 4px;margin-top:-2px;}

.pod_item .pod_img {width:70%; margin:0 auto; margin-bottom:20px;}

.pod_item .area_title {display: block; font-size:15px; color:#333; line-height: 30px; margin:0; font-weight: 300; padding:5px 0;}
.pod_item .area_title.big_title {font-size:17px; margin:0; padding:0; line-height: 1; margin-bottom:20px;}


.pgs-table span {display: inline-block;color: #ff4f60;}

#coverTemplateSpan {display: inline-block; height: 22px;line-height: 1; width: calc(100% - 112px);}
#coverTemplateStr {overflow: hidden;white-space: nowrap;text-overflow: ellipsis;width: calc(100% - 35px);font-size: 11px;padding: 0;padding-left: 2px;line-height: 22px;vertical-align: middle;}

/* tip */
.tip {display: inline-block;width:auto;height:auto;line-height:16px;font-size: 12px;font-weight: 100;color:#8c82d8 !important;padding: 3px 5px;background-color:#f2f5fd;margin:3px;border-radius: 5px;-webkit-touch-callout: none;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;vertical-align: middle;}
.tip:before {content:"\f05a"; display: inline-block; font: normal normal normal 14px/1 FontAwesome; font-size: inherit; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; margin-right: 3px; vertical-align: middle; margin-top: -2px;} 

.pgs-table tr:first-child td .tip {float: none;}

.pod_item img {max-width:100%}

.priceInput {border:0px; font-size:11px; color:#000; text-align:right; float:right }
.priceInput span {color:#F60;}


/*----------------------------------------
               table                           
------------------------------------------*/
.price-wr {display: block;padding: px;background: #eee;border-radius: 3px;overflow: hidden;margin-top: -3px;}
.price-wr .priceInput {position: relative;display:block;width:100%;height:auto;font-size: 11px;line-height:15px;letter-spacing: -0.3px;color: #777;float:left;font-weight: 100;padding: 0 5px; padding-top:3px;}
.price-wr .priceInput + .priceInput {padding-top:0;}
.price-wr .priceInput:last-child {padding-bottom:3px;}
.price-wr .priceInput span {color:#F60; vertical-align: top;} 

/*
.priceInput {position: relative; display: inline-block; width:100%; height:auto; font-size:10px; line-height: 15px; color:#999; float:left;font-weight:300; }
.priceInput span {color:#F60;} */


.pod_item .pod_ttl {display: block;color:#333;position: relative;width: 100%;padding: 0;}
.pod_item .pod_ttl:before {content:"";display: inline-block;width: 7px;height: 7px;background: #e8340c;border-radius: 50%;margin-right: 7px;vertical-align: top;margin-top:8px;}
.pod_ttl .price-wr {width: 100%;margin: 5px 0;}
.pod_ttl .price-wr  .priceInput {display: inline-block;width: auto;}


/*pgs-table*/
.pgs-table {margin:0; width:100%;}
/*.pgs-table caption {display: inline-block;font-size:15px;color:#333;line-height: 25px;width: 100%;position: relative;padding: 0;}*/

.pgs-table tbody tr th,
.pgs-table tbody tr td  {padding:8px 10px; color:#333; vertical-align:middle;text-align:left;line-height:30px;font-weight:normal;}
.pgs-table tbody tr th {width:30%; max-width:100px; font-size:13px; color:#777; vertical-align:top; padding-left:0; padding-right:0;}
.pgs-table tbody tr td  { font-size:12px;color:#333;}

.pgs-table input[type="text"], 
.pgs-table select {width: auto; height:30px; font-size:13px; line-height:28px; margin-bottom: 5px; text-align: center; vertical-align:middle; border-radius:2px;}

.pgs-table textarea {display:block; width:100%; background-color:#ffffff; background-image:none; border:1px solid #dcdcdc; vertical-align:middle; min-height:70px; padding:5px; font-size:12px; line-height:18px; border-radius:0px;color:#333;}

/*.pgs-table input[type="text"], 
.pgs-table select {display:inline-block; width:auto; background-color:#ffffff; background-image:none; border:1px solid #dcdcdc; vertical-align:middle; height:30px; padding:0 5px; font-size:12px; line-height:28px; border-radius:0px;color:#333;}
.pgs-table input[type="text"] {min-width:50px;}
.pgs-table select {min-width:120px;}
.pgs-table input.required {background:#FFC;}
.pgs-table textarea {display:block; width:100%; background-color:#ffffff; background-image:none; border:1px solid #dcdcdc; vertical-align:middle; min-height:70px; padding:5px; font-size:12px; line-height:18px; border-radius:0px;color:#333;}*/

/*pgs-in-table*/
.pgs-in-table {margin:0; width:100%;}
.pgs-in-table tbody tr th,
.pgs-in-table tbody tr td  {padding:7px 10px; padding-top:0; vertical-align:middle; text-align:left;  font-size:12px; line-height:22px; background:#f3f3f3; color:#aaa; background:#f3f3f3; font-weight:normal;}
.pgs-in-table tbody tr th {min-width:80px; color:#888;}
.pgs-in-table tbody tr td {}

.pgs-in-table tbody tr:first-child th,
.pgs-in-table tbody tr:first-child td {padding-top:7px;}

.pgs-in-table input[type="text"], 
.pgs-in-table select {display:inline-block; width:auto; background-color:#ffffff; background-image:none; border:1px solid #dcdcdc; vertical-align:middle; height:22px; padding:0 5px; font-size:12px; line-height:20px; border-radius:0px;color:#aaa;}

/*pgs-table기타*/
.pgs-table .btn-sm {border-radius:0; height:30px; line-height:22px;  padding:3px 10px;}

.uploadTable {position:relative; padding:10px;}


/* 이미지옵션*/
.opt_set {float:left; padding:10px; border:1px solid #dddddd; margin-right:10px;}
.opt_set {position:relative; cursor:pointer; overflow:hidden; display:inline-block; vertical-align:middle;}
.opt_set .chkbox {float:left; cursor:pointer; display:block; margin-right:10px;}
.opt_set .chkbox:last-child {margin-right:0;}

.chkbox input {position:absolute; top:0; left:0; opacity:0; cursor:pointer; z-index:5;}
.chkbox img {border:1px solid #eee; background:#f5f5f5; padding:0px;}
.chkbox input:checked+img {border:1px solid #8edfeb;background:#bdf5fd;}
.chkbox span {display:block; text-align:center; width:100%; font-weight:normal;} 

/*------------------------------------------
                  규격선택
------------------------------------------*/
#size_select input[type="radio"] {display: none;}
#size_select label {display: inline-block; width:100px; float:left; margin:5px; cursor: pointer;}
#size_select label .label-img {display: inline-block; width:100px; height:100px; border-radius: 5px; text-align: center; line-height: 100px; background-position: center; background-repeat: no-repeat; }
#size_select label .label-title {display: inline-block; width:100%; font-size:13px; line-height: 1; margin-top:8px; color:#777; font-weight: normal; text-align: center;}
#size_select input[type="radio"]:checked + label .label-title {color: #e8340c;}

/*----------------------------------------
               견적보기                       
------------------------------------------*/
/*.podGoods aside {position:fixed; left:50%; top:232px; width:300px; margin-left:350px;}*/
#sticky {position:fixed;bottom:0px;left:0;margin:0;z-index:99999;border-top:1px solid #333;background: #f3f3f3;width:100%;box-shadow: 0 0 6px 0 rgba(0,0,0,0.2);}
#sticky > div {width:100%; padding:10px 0; overflow: auto;}

/* 펼치고 접기 */
#sticky > div {display: none; height:auto; max-height:300px;}
#sticky.open > div {display: inline-block;}
#sticky > div#openSticky {display: inline-block; width:100%; padding:10px; background:#fff;}
#sticky.open > div#openSticky {width:60px;position: absolute;top:-21px;left:50%;margin-left:-30px;border:1px solid #333;border-bottom:none;background: #f3f3f3;padding:0;border-top-left-radius: 2px;border-top-right-radius: 2px;}
#openEsti {display: inline-block; width:100%; height:40px; background:#00a1e4; color:#fff; font-size:15px; line-height: 40px; padding:0; text-align: center; cursor: pointer; border-radius: 2px; float:left;}
.open #openEsti {background:transparent; color:#333; height:20px; line-height: 20px;}
#openEsti:before {content: '주문하기'}
.open #openEsti:before {content: '\f078'; font: normal normal normal 14px/1 FontAwesome}


/*견적서*/
.esti_wrap {position:relative; width:100%; padding:0 10px; overflow:hidden;}
.esti_wrap h1 {font-size: 15px;color:#777777;border-bottom:1px solid #eae5e9;margin:0 -20px;padding:0 20px;line-height: 25px;padding-bottom:10px;margin-bottom:10px;}
.esti_wrap dl {padding:10px 0;border:1px solid #e3e3e3;border-bottom:0;display: inline-block;width:100%;background: #ffffff;box-sizing: border-box;float:left;}
.esti_wrap dl > span {display: inline-block; width:25%; float:left;}
.esti_wrap dl dt,
.esti_wrap dl dd {display:inline-block; font-size:13px; line-height:25px; color:#999999; font-weight:normal; vertical-align:middle; text-align: center;}
.esti_wrap dl dt {position:relative; width:100%; float:left;}
.esti_wrap dl dd {width:100%; float:right; color:#333;}

.esti_wrap dl.esti_vat {border-top:1px dashed #e3e3e3; border-bottom:1px solid #e3e3e3;}
.esti_wrap dl.esti_vat dt, .esti_wrap dl.esti_sum dt {width:40%; text-align: left; padding-left:10px;}
.esti_wrap dl.esti_vat dd, .esti_wrap dl.esti_sum dd {width:60%; text-align: right; padding-right:10px;}

.esti_wrap dl.esti_sum {border-color:transparent; background:transparent;}

.esti_wrap dl.esti_sum dt,
.esti_wrap dl.esti_sum dd {font-weight: bold; font-size:16px; color:#333;}
.esti_wrap dl.esti_sum dt {}
.esti_wrap dl.esti_sum dd {}

.esti_wrap .bt_fx {position:relative; padding:0; display: inline-block; width:100%;}
.esti_wrap .bt_fx .btn {display: inline-block; width:49%; font-size:15px;  height:40px; line-height:38px; border:1px solid #333; padding:0;}
.esti_wrap .btn-make {color:#fff; display:block; background:#333; vertical-align:middle; width:100%;}
.esti_wrap .btn-make:before {content:""; display:inline-block; width:20px; height:20px; background:url(../ORDER_POD/img/icon_make.png) no-repeat; margin-right:7px; margin-top:-6px; vertical-align:middle;}
.esti_wrap .btn-order {float:left; background:#fff; color:#333;}
.esti_wrap .btn-order.pull-right {background:#555; color:#fff;}
.esti_wrap .btn-make:hover {background:#555;}
.esti_wrap .btn-order:hover {background:#eee;}
.esti_wrap .btn-order.pull-right:hover {background:#777;}

/*견적서하단버튼*/
.esti_btn {position:relative; width:100%; padding:0 20px 10px; background:#fff; overflow:hidden;}
.esti_btn li {margin-top:1px;}
.esti_btn li span {display: inline-block; width:100%; text-align: center; cursor: pointer; font-size:14px; padding:10px 0; color:#00a1e4}
.esti_btn li span.btn {display: inline-block; width:100%; height:40px; background:#00a1e4; color:#fff; font-size:15px; line-height: 40px; padding:0;}
.esti_btn li span:hover, .esti_btn li:hover span {opacity: 0.8;}

/*견적서-게스트*/
.esti_guest {padding:30px 0;font-size:13px; line-height:1;text-align:center; color:#999;}
.esti_guest a {color:#ff1a56;}

.info-modal .file-body {background:#fff;}

.info-modal .file-body iframe {width:100%; height:400px; border:0;}
.info-modal h2 {font-size:15px; background:url(/html/img/sub/bullet.png) left center no-repeat; font-weight:bold; line-height:30px; margin:0; text-indent:25px;  margin-bottom:10px; color:#555;} 
.button.b-close, .button.bClose {box-shadow: none;  font: bold 131% sans-serif; padding: 0 6px 2px; position: absolute; right: 10px;  top: 10px; cursor:pointer;}
	
.modal-footer {position:relative; display:block; padding:10px; background:#fff;}
.modal-footer span {display: block; width: 100%; height: 35px; line-height: 35px; text-align: center; color: #fff; background:#125fa3; -ms-filter:'progid:DXImageTransform.Microsoft.Alpha(Opacity=80)'; filter:alpha(opacity=80); opacity:.8; cursor:pointer;}
.modal-footer span:hover {-ms-filter:'progid:DXImageTransform.Microsoft.Alpha(Opacity=100)'; filter:alpha(opacity=100); opacity:1.0;}


/* 옵션아이콘 */
.opt-icon {width:60px; height: auto; overflow: hidden; float: left; margin: 5px; position: relative;}
.opt-icon .opt-icon-img {width:60px; height:60px; display: block; background-color:#fafafa; background-repeat: no-repeat; margin:0 auto; background-position: center center; cursor: pointer; border-radius: 5px;}
.opt-icon .opt-icon-name {display:block; font-size: 13px; line-height: 19px; color: #777; margin:0; padding:0; margin-top: 5px; text-align: center; font-weight: normal; width: 100%; overflow: hidden; height:19px; text-overflow: ellipsis; white-space: nowrap;}
.opt-icon:hover {overflow: visible; z-index: 9;}
.opt-icon:hover .opt-icon-name, .opt-icon .opt-icon-name:hover {overflow:
visible; white-space: inherit;}
.opt-icon.checked .opt-icon-img,
input[type="radio"]:checked + label.opt-icon .opt-icon-img, label.opt-icon input[type="radio"]:checked ~ .opt-icon-img {background-color: #fff4f1;}
.opt-icon.checked .opt-icon-name,
input[type="radio"]:checked + label.opt-icon .opt-icon-name, label.opt-icon input[type="radio"]:checked ~ .opt-icon-name, input[type="radio"]:checked + label.opt-icon .label-title, label.opt-icon input[type="radio"]:checked ~ .label-title {color:#e8340c;}

/* 제본 */
.pod_jb .opt-icon {width:100px;}
.pod_jb .opt-icon .opt-icon-img {width:100px; height:100px;}
.pod_jb .opt-icon .opt-icon-name {padding:0; margin-top:8px;}

/* 사용유무 옵션 */
.opt-check {position: absolute; top:6px; right:10px; z-index: 1;}
.opt-check input {display: none;}

.opt-check label {font-size:13px; line-height: 30px; color:#aaa; font-weight: normal; margin:0; cursor: pointer;}
.opt-check label span {display: inline-block; width:18px; height:18px; border:1px solid #ddd; background:#fafafa url(/ORDER_POD/img/icon-check-gray.png) center no-repeat; float:left; margin-top:6px; margin-right:5px;}
.opt-check input:checked + label {color:#00a1e4;}
.opt-check input:checked + label span {border-color:#00a1e4; background-color:#00a1e4; background-image:url(/ORDER_POD/img/icon-check.png)}
.opt-select {position: absolute; top:25px; right:0; z-index: 1;}

/* 사용유무옵션-반전 */
.opt-check-reverse label {color:#00a1e4;}
.opt-check-reverse label span {border-color:#00a1e4; background-color:#00a1e4; background-image:url(/ORDER_POD/img/icon-check.png);}
.opt-check-reverse input:checked + label {color:#aaa;}
.opt-check-reverse input:checked + label span {border-color:#ddd; background-color:#fafafa; background-image:url(/ORDER_POD/img/icon-check-gray.png);}

/* 두번째 옵션 */
#cover_printer_span, #in_printer_span, #in2_printer_span {display: inline-block; width:100%;}

 

/*----------------------------------------
      상품상세설명                    
------------------------------------------*/
.explain img {width:auto; height:auto; max-width:100%;}

.explain h2 {position: relative;display:block;text-align: center;font-size: 24px;line-height: 34px;color: #000;margin-bottom: 40px;}
.explain h2 span {position: relative; display:inline-block; text-align: center; font-size: 24px; line-height: 34px; color: #000; }
.explain h2 span:after {content:"";display: block;border-bottom: 1px solid #333;width: 100%;padding-top: 5px;} 
.explain h2 span strong {font-weight: 700;}
.explain h2 small {display: block;font-size: 13px;line-height: 23px;font-weight: 100;color: #888888;}


/*상세내용샘플*/
.book_exp {font-size: 14px; line-height: 1.8;}
.exp_cate {display: block;margin-bottom:40px;padding: 0 10px;}
.exp_cate span {display: inline-block; font-size:1.2em; line-height: 32px;letter-spacing:0.5px; color:#555; word-break: keep-all;}
.exp_cate span:after {content: "/";display: inline-block;font-size: 13px;color: #aaa; margin: 0 5px 0 7px; margin-top: -4px;vertical-align: middle;}
.exp_cate span:last-child:after {display: none;}

.exp_table {width: 100%; margin: 0 auto; border-top: 1px solid #e9e9e9; border-left: 1px solid #e9e9e9;}
.exp_table tr th,
.exp_table tr td {padding:10px 10px; line-height: 30px; vertical-align: middle; background: #fff; border-bottom: 1px solid #e9e9e9;  border-right: 1px solid #e9e9e9; font-size:14px; color: #555; }
.exp_table tr th {color: #777; background: #f3f3f3; font-weight: 400; white-space: nowrap;}
.exp_table .small {display: inline-block; font-size: 0.8em; line-height: 22px; color: #888;}


/* 선택 팝업 관련 */
.tip_btn, a.tip_btn {display: inline-block;width: 18px;height: 18px;border-radius: 50%;background:#d6d6d6;line-height: 18px;color: #fff;position: relative;z-index: 9;font-size:13px;margin-left:-40px;text-align: center;}
.tip_btn:hover, a.tip_btn:hover, 
.tip_btn:active, a.tip_btn:active {color:#fff; background-color:#ccc; text-decoration: none;}

/*a.tip_btn {font-size:0; background-image:url(/_img/goods/opt-preview.png); background-size:80%; background-position: center; background-repeat: no-repeat;}*/
a.tip_btn {font-family: FontAwesome; font-size: 14px;text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; vertical-align: middle; overflow: hidden;  color: #d6d6d6;}
a.tip_btn:before {content: "\f002";color: #fff;margin-left: 1px;display: inline-block;}


.priceInput ~ .tip_btn, .priceInput ~ a.tip_btn {margin-left:0;}

.modal-wrap {-webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px;overflow: hidden;width: 100%;margin-top: 20px;position: relative;}
.modal-wrap .modal-head {padding: 0 20px; margin: 0; background: #1864a2; color: #fff; font-size: 20px; font-weight: normal; line-height: 50px;}
.modal-wrap .modal-head .button.b-close {padding:0; overflow: hidden; right:20px; top:10px; display: inline-block; width:30px; height:30px; font-size:0;}
.modal-wrap .modal-head .button.b-close:before, .modal-wrap .modal-head .button.b-close:after {content: ''; display: inline-block; position: absolute; background:#fff; transform: rotate(45deg);}
.modal-wrap .modal-head .button.b-close:before {width:100%; height:2px; left:0; top:50%; margin-top:-1px;}
.modal-wrap .modal-head .button.b-close:after {width:2px; height:100%; left:50%; top:0; margin-left:-1px;}
.modal-wrap .modal-body { width:100%; box-sizing:border-box; padding: 0px; height: 600px; }
.modal-wrap .modal-body iframe { width:100%; height:600px; box-sizing:border-box; background:#fff; margin:0; /*padding: 15px 13px;*/ }
.modal-wrap .modal-body iframe body { overflow-y: scroll; }
#mp .modal-wrap .modal-body .b-iframe body {margin: 0;}
.modal-footer { width: 100%; background: #eee; position: relative; padding: 10px 0; }
.modal-footer .button_wrap { position: absolute; left: 50%; margin-left: -178px; }
.modal-footer .button_wrap span { display: inline-block; width: 220px; height: 50px; font-size: 18px; font-weight: bold; color: #fff; background: #eb3737; text-align: center; line-height: 50px; }
.modal-footer .button_wrap span:first-child { margin-right: 6px; }
.modal-footer .button_wrap .close { width: 130px; color: #808080; border: 1px solid #808080; background: transparent; }

.modal-wrap .modal-body-set { width:100%; box-sizing:border-box; padding: 0px; height: 670px; }
.modal-wrap .modal-body-set iframe {width:100%;height: 100%;box-sizing:border-box;background:#fff;margin:0;/*padding: 15px 13px;*/}
.modal-wrap .modal-body-set iframe body { overflow-y: scroll; }
#mp-set .modal-wrap .modal-body-set .b-iframe body {margin: 0;}



/*----------------------- HALF_goods ------------------------*/
/*
.podGoods .pod_detail.podmall {}

.podmall .pod_item {border: 0;}
.podmall .pgs-table {margin-left:0px; width: 100%;}
.podmall .pgs-table tbody {padding:0px;display: table-row-group;}
.podmall .pgs-table caption {display: none;}

.podmall .pgs-table tbody tr th {width: 100px; padding: 7px 15px;}
.podmall .pgs-table tbody tr td {width:calc(100% - 100px);padding: 7px 15px;}
.podmall .esti_wrap {border-top: 1px solid #ddd;}
.podmall .esti_wrap dl.esti_sum dt {font-size: 18px;}
.podmall .esti_wrap dl.esti_sum dd {font-size: 18px;color: #e8340c;}
*/

