@charset "utf-8";
/* doc.css는 디자인페이지 스타일을 정의합니다. */
.only-desktop {display:block;}
.only-mobile {display:none;}

.sub-01 .box {padding:45px 0 50px; border:1px solid #ddd; text-align:center;}
.sub-01 .box p {font-size:20px; margin-top:50px; font-weight:500; color:#000; letter-spacing:-.025em; line-height:1.3em;}

.sub-01 .char-img {margin-bottom:40px; text-align:center;}

.sub-01 .char {display:flex; margin:0 -58px;}
.sub-01 .char .group {margin:0 58px; padding:45px 40px 20px; width:50%; border:1px solid #ddd; position:relative;}
.sub-01 .char .group .tit {height:48px; padding:0 41px; position:absolute; top:-24px; left:30px; color:#fff; background-color:#253363; border-radius:30px; display:inline-flex; align-items:center; justify-content:center;}
.sub-01 .char .group .tit span {font-size:20px; padding-right:10px; font-weight:300;}
.sub-01 .char .group .inner .etc {line-height:1.5em; font-weight:500; letter-spacing:-.025em; color:#000;}
.sub-01 .char .group .inner .etc.indent {padding-left:15px;}
.sub-01 .char .group.g1 .img {margin-bottom:30px;}

.sub-01 .char .group .inner .title {font-size:24px; margin-bottom:12px; line-height:1.2em; font-weight:700; color:#253363; letter-spacing:-.025em;}
.sub-01 .char .group .inner .in-list1 {margin-bottom:12px;}
.sub-01 .char .group .inner .in-list1 li {font-size:18px; font-weight:500; letter-spacing:-.025em; color:#000; line-height:1.333em;}
.sub-01 .char .group .tit-wrap {display:flex; flex-direction:column;}
.sub-01 .char .group .tit-wrap .tit {margin-top:50px !important;}
.sub-01 .char .group .tit-wrap2 .tit {margin-top:30px !important;}

.sub-01 .char.last {margin:85px 0 0;}
.sub-01 .char.last .group {width:100%; margin:0; display:flex; padding:35px 30px;}
.sub-01 .char.last .group .tit {margin-right:45px; margin-top:25px; position:relative; top:auto; left:auto;}
.sub-01 .char.last .group .img {flex:1;}

.sub-table {margin-bottom:30px;}
.sub-table table {font-size:18px; font-weight:500; color:#555; letter-spacing:-.025em; border-collapse:collapse; width:100%; border-top:2px solid #000; text-align:center;}
.sub-table table th {padding:16px 10px; background-color:#f4f4f4; font-weight:500; border-right:1px solid #ddd; border-bottom:1px solid #ddd;}
.sub-table table td {padding:60px 15px; border-right:1px solid #ddd; border-bottom:1px solid #ddd;}
.sub-table table th:last-child,
.sub-table table td:last-child {border-right:0;}
.sub-table table td .img {text-align:center;}
.sub-talbe table td.pad-1 {padding:35px 15px;}

.doc-tit {font-size:26px; padding-bottom:12px; padding-left:22px; border-bottom:2px solid #253363; font-weight:700; color:#000; letter-spacing:-.025em; line-height:1.3em;}
.doc-tit2 {font-size:24px; padding-left:0; border-bottom:0; font-weight:500;}

.color-list {margin-top:45px; display:flex; flex-wrap:wrap; padding:0 18px; text-align:center;}
.color-list li {font-size:20px; font-weight:700; color:#010101; letter-spacing:-.025em; line-height:1.3em; width:25%; margin-bottom:30px; padding:0 12px;}
.color-list li .img {margin-bottom:12px;}

.fax {display:flex; margin:105px auto 82px; width:100%; max-width:1065px;}
.fax li {padding:0 42px; width:33.3333%; position:relative;}
.fax li:after {position:absolute; content:''; width:30px; height:46px; right:-20px; top:50%; margin-top:-23px; background-image:url('../images/sub/fax_arrow.png'); background-size:contain; background-repeat:no-repeat;}
.fax li:last-child:after {display:none;}
.fax li .box {padding:30px 25px; position:relative; box-shadow:1px 3px 10px rgba(0,0,0,.2); border-radius:20px; border:1px solid #ddd;}
.fax li .box .num {font-size:36px; margin-bottom:75px; font-weight:700; letter-spacing:-.025em; line-height:1.2em; color:#ff5c01; font-family:'GmarketSansBold';}
.fax li .box .txt {font-size:20px; color:#000; line-height:1.5em; letter-spacing:-.025em;}
.fax li .box .icon {position:absolute; top:35px; right:40px;}

.fax-download {font-size:18px; width:305px; height:52px; background-color:#df6a1a; color:#fff; text-align:center; letter-spacing:-.025em; font-weight:500; border-radius:10px; margin:0 auto; display:flex; align-items:center; justify-content:center;}
.fax-download img {margin:-5px 15px 0 0; vertical-align:middle;}

.vat {vertical-align:top;}

.br10 {border-radius:5px;}

.greeting {display:flex;}
.greeting .txt {margin:25px 0 0 50px; flex:1;}
.greeting .txt .tit {font-size:36px; font-weight:700; color:#000;}
.greeting .txt .tit span {color:#3d60a8;}
.greeting .txt p {font-size:18px; margin-top:35px; line-height:1.667em;}
.greeting .txt .last {margin-top:45px; font-weight:700; color:#000; text-align:right;}

.print-zone {width:100%; max-width:1300px;}
.print-zone .input {font-size:18px; padding:6px 10px; text-align:center; flex:1;}

/* 수량 */
.qty-wrap {display:flex; overflow:hidden; justify-content: center;}
.qty-wrap input {width:60px; height:44px; line-height:23px; padding:0; text-align:center;}
.qty-wrap .qty a {display:block; height:22px; border:1px solid #ddd; border-left:0;}
.qty-wrap .qty a:first-child {border-bottom:0;}

.pad0 {padding:0 !important;}

.delete-btn {padding:25px 15px; border-bottom:1px solid #000;}
.delete-btn a {font-size:18px; width:90px; height:36px; line-height:35px; display:block; text-align:center; font-weight:500; letter-spacing:-.025em; border-radius:5px; border:1px solid #ddd;}

/* 팝업 */
.pop-wrap {padding:40px 30px;}
.pop-wrap .table-group .total {justify-content:flex-start;}
.pop-wrap .table-group .total .item {margin-right:45px;}
.pop-wrap .table-group .buttons {margin:20px 0 0;}
.pop-wrap .table-group .buttons img {vertical-align:middle; margin:-2px 10px 0 0;}

.fancybox-popview .fancybox-skin {background-color:#fff;}

.pop-wrap .pop-top {margin-bottom:25px; display:flex; align-items:flex-end;}
.pop-wrap .pop-top h3 {font-size:28px; color:#000; letter-spacing:-.025em; line-height:1.3em;}
.pop-wrap .pop-top a {font-size:18px; width:95px; height:37px; line-height:36px; margin:0 15px; text-align:center; font-weight:500; color:#555; border:1px solid #ddd; border-radius:5px; display:inline-block;}
.pop-wrap .pop-top span {font-size:13px; letter-spacing:-.025em; color:#000;}

.type-select {margin-bottom:25px;}
.type-select .item {padding-right:20px;}

.type-select2 {margin-bottom:20px; display:flex;}
.type-select2 .select-item {padding:0 5px;}
.type-select2 .select-item select {width:223px;}
.type-select2 .select-item.last {flex:1;}
.type-select2 .select-item.last .input {width:100%;}

.pop-wrap .table-group {margin-bottom:0;}
.pop-wrap .board-table {margin-bottom:50px; max-height: 310px; overflow-y: scroll;}

.bot-wrap {display:flex; border-top:2px solid #000; justify-content:space-between;}
.bot-wrap .buttons {display:flex;}
.bot-wrap .in-icon {margin-right:10px;}

.bot-wrap .icon-wrap {position:relative;}
.bot-wrap .icon-wrap img {position:absolute; top:50%; transform:translateY(-50%); left:18px; z-index:1;}
.bot-wrap .in-icon img {vertical-align:middle; margin:-4px 10px 0 0;}
.bot-wrap .icon-wrap .btn-pack {padding:0 0 0 30px;}

.box-3ea .input {width:115px;}

.how-use li {font-size:18px; margin-bottom:50px; line-height:1.667em; display:flex;}
.how-use li:last-child {margin-bottom:0;}
.how-use li .icon {margin-right:30px;}
.how-use li .cont {padding-top:10px;}
.how-use li .cont strong {font-size:24px; line-height:1.3em; margin-bottom:5px; color:#000; letter-spacing:-.025em; display:block;}
.how-use li .cont span {color:#000; font-weight:500;}

/* 사이트맵 */
.sitemap {*zoom:1; overflow:hidden; display:flex; flex-wrap:no-wrap; margin:0 -10px;}
.sitemap dl {width:25%; padding:0 10px; margin-bottom:50px; vertical-align:top; box-sizing:border-box;}
.sitemap dl:nth-child(3n+1) {clear:left;}
.sitemap dl dt {margin-bottom:5px; text-align:center; color:#fff; font-size:18px; font-weight:400; line-height:50px; letter-spacing:0; background:#de611b;}
.sitemap dl dd {border-bottom:1px solid #ddd;}
.sitemap dl dd > a {display:block; line-height:22px; color:#555; font-size:16px; font-weight:400; background:url("../images/sub/dot.gif") 5px 16px no-repeat; padding:8px 0 8px 30px; text-decoration:none;}
.sitemap dl dd a:hover, .sitemap dl dd a:focus {text-decoration:underline;}

/* print-zone */
.print-zone {}
.print-zone .pop-tit {font-size:40px; margin:25px 0 35px; line-height:1em; color:#000; letter-spacing:0; text-align:center;}
.print-zone .pop-tit span {font-size:17px; letter-spacing:0 ; line-height:2em; display:block; font-weight:400;}
.print-zone .content-1 {}
.print-zone .content-1 .wrap {margin-bottom:25px; display:flex;}
.print-zone .content-1 .wrap .col {width:50%; padding:0 15px;}
.print-zone .content-1 .wrap .col .box {height:180px; border:2px solid #000;}
.print-zone .content-1 .wrap .col-l {}
.print-zone .content-1 .wrap .col-l .box {padding:22px 35px;}
.print-zone .content-1 .wrap .col-l .box .date {font-size:20px; font-weight:700; color:#000; letter-spacing:0; line-height:1.5em;}
.print-zone .content-1 .wrap .col-l .box .name {font-size:20px; font-weight:700; color:#000; letter-spacing:0; line-height:1.5em;}
.print-zone .content-1 .wrap .col-l .box ul li {font-weight:500; line-height:1.5em; color:#000; letter-spacing:0 ; display:flex;}
.print-zone .content-1 .wrap .col-l .box ul li .tit {width:75px;}
.print-zone .content-1 .wrap .col-r {position:relative;}
.print-zone .content-1 .wrap .col-r .num {font-weight:500; color:#000; position:absolute; top:-30px; right:15px;}
.print-zone .content-1 .wrap .col-r .stamp {position:absolute; top:55px; right:35px;}
.print-zone .content-1 .wrap .col-r .table {text-align:center;}
.print-zone .content-1 .wrap .col-r .table table {border-collapse:collapse; width:100%;}
.print-zone .content-1 .wrap .col-r .table table th {height:35px; border-bottom:1px solid #000; border-right:1px solid #000; font-weight:500; color:#000;}
.print-zone .content-1 .wrap .col-r .table table th:last-child,
.print-zone .content-1 .wrap .col-r .table table td:last-child {border-right:0;}
.print-zone .content-1 .wrap .col-r .table table td {height:35px; border-bottom:1px solid #000; border-right:1px solid #000; color:#000;}
.print-zone .content-1 .wrap .col-r .table table td.fz18 {font-size:18px; font-weight:700;}
.print-zone .border-none {border-bottom:0 !important;}

.print-zone .content-2 {padding:0 15px;}
.print-zone .content-2 .price {margin-bottom:15px; font-weight:500; color:#333; text-align:center;}
.print-zone .content-2 .price strong {font-size:24px; padding-right:10px; color:#000; font-weight:700;}
.print-zone .content-2 .table {border:2px solid #000;}
.print-zone .content-2 .table table {border-collapse:collapse; width:100%;}
.print-zone .content-2 .table table th {height:40px; border-bottom:2px solid #000; border-right:1px solid #000; background-color:#f1f1f1; text-align:center; font-weight:500; color:#333;}
.print-zone .content-2 .table table td {padding-top:3px; padding-bottom:3px; border-bottom:1px solid #000; border-right:1px solid #000; text-align:center; color:#000;}
.print-zone .content-2 .table table td.left {text-align:left; padding-left:15px;}
.print-zone .content-2 .table table td.right {text-align:right; padding-right:12px;}
.print-zone .content-2 .table table td.bold {font-weight:700; background-color:#f1f1f1;}
.print-zone .content-2 .table table th:last-child,
.print-zone .content-2 .table table td:last-child {border-right:0;}

.print-zone .content-2 .table.last {margin-top:30px;}
.print-zone .content-2 .table.last td {border-bottom:0;}

.print_pop {padding:0 !important;}

.share-img {vertical-align:middle; margin:-4px 10px 0 0;}

.share-btn {position:relative;}
.share-btn .close-bt {position:absolute; top:10px; right:10px;}
.share-btn .close-bt2 {position:absolute; top:10px; right:10px;}

.pop-share {border:1px solid #000; display:none; width:316px; height:120px; align-items:center; justify-content:center; background-color:#fff; position:absolute; bottom:40px; right:20%;}
.pop-share.active {display:flex;}
.pop-share ul {display:flex;}
.pop-share ul li {padding:0 6px;}

.pop-mail-send {padding:40px 30px 25px; border:1px solid #000; display:none; width:486px; height:260px; align-items:center; justify-content:center; background-color:#fff; position:absolute; bottom:175px; right:300px;}
.pop-mail-send.active {display:flex; flex-direction:column;}
.pop-mail-send form {width:100%;}
.pop-mail-send form .buttons {margin-bottom:0;}
.pop-mail-send form .input {height:50px;}
.pop-mail-send form .buttons .btn-pack {min-width:155px; height:50px; line-height:50px; border-radius:5px;}
.pop-mail-send ul {margin-bottom:20px;}
.pop-mail-send ul li {margin-bottom:10px; line-height:1.3em; display:flex; color:#000;}
.pop-mail-send ul li:last-child {margin-bottom:0;}
.pop-mail-send ul li span {display:block; width:65px; text-align:left;} 

@media print {
	.print-zone .pop-tit {font-size:22px; margin:20px 0 30px; line-height:1em; letter-spacing:0; text-align:center;}
	.print-zone .pop-tit span {font-size:13px; letter-spacing:0 ; line-height:2em; display:block; font-weight:400;}

	.print-zone .content-1 .wrap {margin-bottom:30px; display:flex;}
	.print-zone .content-1 .wrap .col {width:50%; padding:0 10px;}
	.print-zone .content-1 .wrap .col .box {height:180px; border:2px solid #000;}

	.print-zone .content-1 .wrap .col-l .box {padding:15px 20px;}
	.print-zone .content-1 .wrap .col-l .box .date {font-size:14px; font-weight:700; letter-spacing:0; line-height:1.5em;}
	.print-zone .content-1 .wrap .col-l .box .name {font-size:14px; font-weight:700; letter-spacing:0; line-height:1.5em;}
	.print-zone .content-1 .wrap .col-l .box ul {margin-top:15px;}
	.print-zone .content-1 .wrap .col-l .box ul li {font-size:13px; font-weight:500; line-height:1.5em; letter-spacing:0; display:flex;}
	.print-zone .content-1 .wrap .col-l .box ul li .tit {width:75px;}

	.print-zone .content-1 .wrap .col-r .table {font-size:11px !important; text-align:center;}
	.print-zone .content-1 .wrap .col-r .table table {border-collapse:collapse; width:100%; font-size:13px;}
	.print-zone .content-1 .wrap .col-r .table table th {font-size:11px; height:35px; border-bottom:1px solid #000; border-right:1px solid #000; font-weight:500; color:#000;}
	.print-zone .content-1 .wrap .col-r .table table th:last-child,
	.print-zone .content-1 .wrap .col-r .table table td:last-child {border-right:0;}
	.print-zone .content-1 .wrap .col-r .table table td {font-size:12px; height:35px; border-bottom:1px solid #000; border-right:1px solid #000; color:#000;}
	.print-zone .content-1 .wrap .col-r .table table td.fz18 {font-size:12px; font-weight:700;}

	.print-zone .content-2 {padding:0 15px;}
	.print-zone .content-2 .price {margin-bottom:10px; font-weight:500; color:#333; text-align:center;}
	.print-zone .content-2 .price strong {font-size:16px; padding-right:10px; color:#000; font-weight:700;}
	.print-zone .content-2 .table {border:2px solid #000; font-size:13px;}
	.print-zone .content-2 .table table {border-collapse:collapse; width:100%; font-size:10px;}
	.print-zone .content-2 .table table th {height:40px; border-bottom:2px solid #000; border-right:1px solid #000; background-color:#f1f1f1; text-align:center; font-weight:500; color:#333;}
	.print-zone .content-2 .table table td {padding-top:3px; padding-bottom:3px; border-bottom:1px solid #000; border-right:1px solid #000; text-align:center; color:#000;}
	.print-zone .content-2 .table table td.left {text-align:left; padding-left:15px;}
	.print-zone .content-2 .table table td.right {text-align:right; padding-right:12px;}
	.print-zone .content-2 .table table td.bold {font-weight:700; background-color:#f1f1f1;}
	.print-zone .content-2 .table table th:last-child,
	.print-zone .content-2 .table table td:last-child {border-right:0;}

	.print-zone .content-2 .table.last {margin-top:30px;}
	.print-zone .content-2 .table.last td {border-bottom:0;}
	
	.print-zone .content-1 .wrap .col-r .stamp {top:65px; right:15px;}
	.print-zone .content-1 .wrap .col-r .stamp img {height:36px; width:36px;}

	.print-zone .content-1 .wrap .col-r .num {font-size:12px; top:-25px;}
}

@page {
 size:210mm 297mm; /*A4*/
 margin:30px;
}