diff --git a/src/entities/common/ui/tax-invoice-sample.tsx b/src/entities/common/ui/tax-invoice-sample.tsx index cd681b4..f446cef 100644 --- a/src/entities/common/ui/tax-invoice-sample.tsx +++ b/src/entities/common/ui/tax-invoice-sample.tsx @@ -12,32 +12,40 @@ import { MAIN_ADDRESS, POSTAL_CODE } from '../model/constant'; -import { RecipientInfo, SupplierInfo, TransactionDetails } from '@/entities/vat-return/model/types'; +import { PaymentInfo, RecipientInfo, SupplierInfo, TransactionDetails } from '@/entities/vat-return/model/types'; import '@/shared/ui/assets/css/style-tax-invoice.css'; import { useAppBridge } from '@/hooks/useAppBridge'; export interface TaxInvoiceSampleProps { taxInvoiceSampleOn: boolean; setTaxInvoiceSampleOn: (taxInvoiceSampleOn: boolean) => void; + managementNumber?: string | number | null; + approvalNumber?: string | number | null; supplierInfo?: SupplierInfo; recipientInfo?: RecipientInfo; issueDate?: string; supplyAmount?: number; taxAmount?: number totalAmount?: number; + remark?: string | null; transactionDetails?: TransactionDetails; + paymentInfo?: PaymentInfo; }; export const TaxInvoiceSample = ({ taxInvoiceSampleOn, setTaxInvoiceSampleOn, + managementNumber, + approvalNumber, supplierInfo, recipientInfo, issueDate, supplyAmount, taxAmount, totalAmount, - transactionDetails + remark, + transactionDetails, + paymentInfo }: TaxInvoiceSampleProps) => { const { t } = useTranslation(); const { isIOS, saveImage } = useAppBridge(); @@ -105,7 +113,7 @@ export const TaxInvoiceSample = ({ rs.push(   ); } @@ -114,7 +122,7 @@ export const TaxInvoiceSample = ({ rs.push( { str } ); } @@ -127,7 +135,7 @@ export const TaxInvoiceSample = ({ rs.push(   ); } @@ -136,7 +144,7 @@ export const TaxInvoiceSample = ({ rs.push( { str } ); } @@ -185,21 +193,28 @@ export const TaxInvoiceSample = ({
- -
+
+ - -
+ - +
세금계산서세금계산서
+ - - + -
세금계산서 + 세금계산서 - - + + - - + +
승인번호 승인번호{ approvalNumber || returnNbsp() }
관리번호 관리번호{ managementNumber || returnNbsp() }
@@ -261,54 +286,60 @@ export const TaxInvoiceSample = ({
+ - -
+ - -
+

+ - + - - - - + + + + - + - - - - + + + +
등록번호등록번호 { supplierInfo?.businessRegistrationNumber }
상호(법인명){ supplierInfo?.companyName }성명{ supplierInfo?.ceoName }상호(법인명){ supplierInfo?.companyName }성명{ supplierInfo?.ceoName }
사업장 주소사업장 주소 { supplierInfo?.address }
업태{ supplierInfo?.businessType }종목{ supplierInfo?.businessItem }업태{ supplierInfo?.businessType }종목{ supplierInfo?.businessItem }
@@ -317,46 +348,51 @@ export const TaxInvoiceSample = ({
+ - - -
+



+ - - + + - - - - + + + + - + - - - - + + + +
등록번호{ recipientInfo?.businessRegistrationNumber }등록번호 
상호(법인명){ recipientInfo?.companyName }성명{ recipientInfo?.ceoName }상호(법인명){ recipientInfo?.companyName } 주식회사성명{ recipientInfo?.ceoName }
사업장 주소사업장 주소 { recipientInfo?.address }
업태{ recipientInfo?.businessType }종목{ recipientInfo?.businessItem }업태{ recipientInfo?.businessType }종목{ recipientInfo?.businessItem }
@@ -371,38 +407,44 @@ export const TaxInvoiceSample = ({
+ - -
+ - + -
작성작성
+ - - - + + + - - - + + +
{ (!!issueDate)? moment(issueDate).format('YYYY'): returnNbsp() }{ (!!issueDate)? moment(issueDate).format('MM'): returnNbsp() }{ (!!issueDate)? moment(issueDate).format('DD'): returnNbsp() }{ (!!issueDate)? moment(issueDate).format('YYYY'): returnNbsp() }{ (!!issueDate)? moment(issueDate).format('MM'): returnNbsp() }{ (!!issueDate)? moment(issueDate).format('DD'): returnNbsp() }
@@ -411,34 +453,38 @@ export const TaxInvoiceSample = ({
+ - + - - - -
공급가액공급가액
+ - - - - - - - - - - - + + + + + + + + + + + { showNewSupplyAmount() } @@ -450,37 +496,41 @@ export const TaxInvoiceSample = ({
+ - + - @@ -488,17 +538,25 @@ export const TaxInvoiceSample = ({
세액세액
- +
- - - - - - - - - - - - - - { showNewTaxAmount() } - + + + + + + + + + + + + + + { showNewTaxAmount() } +
+ - + - +
수정사유수정사유
  
@@ -509,105 +567,114 @@ export const TaxInvoiceSample = ({
+ -
- + -
+ - + - + - + - + - +
비고비고
월/일월/일
{ (!!transactionDetails?.transactionPeriod)? moment(transactionDetails.transactionPeriod).format('MM/DD'): returnNbsp() }{ (!!transactionDetails?.transactionPeriod)? moment(transactionDetails.transactionPeriod).format('MM/DD'): returnNbsp() }
  
  
+ + className="p-cell-5 border-bottom-1 font-base text-xs-gray text-center" + colSpan={7} + >{ remark || returnNbsp() } - - - - - - - + + + + + + + - - - + + - - - - + - - - - - - - + + + + + + + - - - - - - - + + + + + + +
비고(프로퍼티 없음)
품목규격수량단가공급가액세액비고품목규격수량단가공급가액세액비고
{ transactionDetails?.itemName || returnNbsp() }{ transactionDetails?.specification || returnNbsp() } + { transactionDetails?.itemName || returnNbsp() }{ transactionDetails?.specification || returnNbsp() } + + + { transactionDetails?.remarks || returnNbsp() }{ transactionDetails?.remarks || returnNbsp() }
              
              
@@ -620,71 +687,100 @@ export const TaxInvoiceSample = ({
-
+ - - @@ -700,15 +796,17 @@ export const TaxInvoiceSample = ({ -
+ - - - - - + + + + + - - - - + -
합계금액현금수표어음외상미수금합계금액현금수표어음외상미수금
- + + { totalAmount ? + + : returnNbsp() + } - + + { paymentInfo?.cash ? + + : returnNbsp() + } - + + { paymentInfo?.check ? + + : returnNbsp() + } - + + { paymentInfo?.promissoryNote ? + + : returnNbsp() + } + + { paymentInfo?.accountsReceivable ? + + : returnNbsp() + }
- 이금액을 청구함 + + 이금액을 청구함
+
(false); + const [managementNumber, setManagementNumber] = useState(); + const [approvalNumber, setApprovalNumber] = useState(); const [supplierInfo, setSupplierInfo] = useState(); const [recipientInfo, setRecipientInfo] = useState(); const [issueDate, setIssueDate] = useState(); const [supplyAmount, setSupplyAmount] = useState(); const [taxAmount, setTaxAmount] = useState(); const [totalAmount, setTotalAmount] = useState(); + const [remark, setRemark] = useState(); const [transactionDetails, setTransactionDetails] = useState(); + const [paymentInfo, setPaymentInfo] = useState(); const { mutateAsync: vatReturnTaxInvoice } = useVatReturnTaxInvoiceMutation(); const { mutateAsync: vatReturnTaxInvoiceSendEmail } = useVatReturnTaxInvoiceSendEmailMutation(); @@ -72,13 +76,17 @@ export const AmountSection = ({ }; vatReturnTaxInvoice(params).then((rs: VatReturnTaxInvoiceResponse) => { + setManagementNumber(rs?.managementNumber); + setApprovalNumber(rs?.approvalNumber); setSupplierInfo(rs?.supplierInfo); setRecipientInfo(rs?.recipientInfo); setIssueDate(rs?.issueDate); setSupplyAmount(rs?.supplyAmount); setTaxAmount(rs?.taxAmount); setTotalAmount(rs?.totalAmount); + setRemark(rs?.remark); setTransactionDetails(rs?.transactionDetails); + setPaymentInfo(rs?.paymentInfo); setTaxInvoiceSampleOn(true); }); @@ -155,13 +163,17 @@ export const AmountSection = ({ } diff --git a/src/shared/ui/assets/css/style-tax-invoice.css b/src/shared/ui/assets/css/style-tax-invoice.css index 5eaecc3..e1c85a6 100644 --- a/src/shared/ui/assets/css/style-tax-invoice.css +++ b/src/shared/ui/assets/css/style-tax-invoice.css @@ -14,6 +14,7 @@ .mail-page .btn { display: inline-flex; min-width: 46px; align-items: center; justify-content: center; border-radius: 6px; height: 30px; padding: 0 10px; font-family: Pretendard, Arial, Helvetica, sans-serif; font-size: 15px; font-weight: 700; text-decoration: none; box-sizing: border-box; } .mail-page .btn-dark { background: #043465; color: #F4F8FF; } .mail-page .btn-primary { background: #3E6AFC; color: #F4F8FF; } +.mail-page .btn-primary { background: #3E6AFC; color: #F4F8FF; } .mail-page .divider { height: 0; border-top: 1px solid #D6D6D6; margin: 16px 0; } /* title + cancel */ .mail-page .title-row { display: flex; align-items: center; justify-content: space-between; padding: 0 0 5px 0; } @@ -73,611 +74,286 @@ padding-bottom: 0; transform: translateX(100%); } - .tax-invoice .wrap-center { width: 100%; background: #FAFAFA; margin: 0; padding: 0; } -.tax-invoice .outer-table { - margin: 0; padding: 0; background: #FAFAFA; - border: 0; width: 100%; border-spacing: 0; -} -.tax-invoice .outer-table .outer-table-td { - margin: 0; padding: 0; -} -.tax-invoice .outer-table .outer-table-td .inner-table{ - width: 660px; max-width: 660px; margin:0 auto; border-spacing: 0; - overflow-x: visible; -} -.inner-table .inner-table-td1{ - padding: 20px 0 20px 0; -} -.inner-table .inner-table-td1 .nicepay-logo{ - display: block; border: 0; outline: none; text-decoration: none; -} -.inner-table .inner-table-td2{ - padding: 0 0 40px 0; -} -.inner-table2{ - width: 100%; border-spacing: 0; padding: 0; border: 0; -} -.inner-table2 .title-image { - display: block; margin: 0 auto; border: 0; - outline: none; text-decoration: none; - width: 48px; height: 48px; -} -.inner-table2-td { - font-family: 'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 24px; - font-weight: 700; - color: #111111; - line-height: 1.25; - padding: 10px 0 25px 0; -} -.inner-table2-td2 { - font-family: 'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-weight: 400; - font-size: 14px; - line-height: 1.4; - color: #666666; - text-align: left; - padding-top: 0; +.tax-invoice table { + border-collapse: collapse; + border: 0; } -.inner-table3 { +.tax-invoice .font-base { + font-family: 'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; + line-height: 1.4; +} + +.tax-invoice .main-container { + width: 660px; + max-width: 660px; + margin: 0 auto; +} + +.tax-invoice .main-table { background: #FFFFFF; - box-shadow: 1px 2px 10px 0 rgba(0,0,0,0.10); - width: 100%; - border: 0; - border-spacing: 0; +} + +.tax-invoice .p-0 { padding: 0; } -.inner-table3-td1 { +.tax-invoice .p-header { padding: 20px 20px 10px 20px; } -.inner-table4 { - width: 100%; - border: 0; - border-spacing: 0; - padding: 0; -} -.inner-table4-td1 { - font-family: 'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 16px; - line-height: 1.4; - color: #1C1C1C; - font-weight: 700; - padding:0 0 10px 0; -} -.inner-table4-td2 { +.tax-invoice .p-content { padding: 0 20px 0 20px; } -.inner-table4-td3 { - padding: 30px 20px 0 20px; + +.tax-invoice .p-cell-5 { + padding: 2px 5px; } -.inner-table4-td4{ - padding: 20px 0 20px 0; + +.tax-invoice .title { + font-size: 16px; + color: #1C1C1C; + font-weight: 700; + padding: 0 0 10px 0; } -.inner-table4-td5{ - padding: 0 70px 0 0; + +.tax-invoice .border-top-2 { + border-top: 2px solid #000; } -.inner-table5 { + +.tax-invoice .border-bottom-2 { + border-bottom: 2px solid #000; +} + +.tax-invoice .border-left-2 { + border-left: 2px solid #000; +} + +.tax-invoice .border-right-2 { + border-right: 2px solid #000; +} + +.tax-invoice .border-top-1 { + border-top: 1px solid #000; +} + +.tax-invoice .border-bottom-1 { + border-bottom: 1px solid #000; +} + +.tax-invoice .border-left-1 { + border-left: 1px solid #000; +} + +.tax-invoice .border-right-1 { + border-right: 1px solid #000; +} + +.tax-invoice .border-top-05 { + border-top: 0.5px solid #000; +} + +.tax-invoice .border-left-05 { + border-left: 0.5px solid #000; +} + +.tax-invoice .border-right-05 { + border-right: 0.5px solid #000; +} + +.tax-invoice .bg-gray { + background-color: #f9f9f9; +} + +.tax-invoice .text-center { + text-align: center; +} + +.tax-invoice .text-left { + text-align: left; +} + +.tax-invoice .text-right { + text-align: right; +} + +.tax-invoice .v-top { + vertical-align: top; +} + +.tax-invoice .v-middle { + vertical-align: middle; +} + +.tax-invoice .text-xs-gray { + font-size: 10px; + color: #666666; +} + +.tax-invoice .text-xs-dark { + font-size: 10px; + color: #222222; +} + +.tax-invoice .text-sm-gray { + font-size: 11px; + color: #666666; +} + +.tax-invoice .text-sm-dark { + font-size: 12px; + color: #222222; +} + +.tax-invoice .w-full { + width: 100%; +} + +.tax-invoice .w-310 { + width: 310px; +} + +.tax-invoice .w-280 { + width: 280px; +} + +.tax-invoice .w-214 { + width: 214px; +} + +.tax-invoice .w-157 { + width: 157px; +} + +.tax-invoice .w-102 { + width: 102px; +} + +.tax-invoice .w-90 { + width: 90px; +} + +.tax-invoice .w-56 { + width: 56px; +} + +.tax-invoice .w-40 { + width: 40px; +} + +.tax-invoice .w-38 { + width: 38px; +} + +.tax-invoice .w-37 { + width: 37px; +} + +.tax-invoice .w-30 { + width: 30px; +} + +.tax-invoice .w-20 { + width: 20px; +} + +.tax-invoice .w-19 { + width: 19px; +} + +.tax-invoice .header-cell { + background-color: #f9f9f9; + font-size: 10px; + color: #666666; + text-align: center; + padding: 2px 5px; +} + +.tax-invoice .header-cell-bordered { + background-color: #f9f9f9; + font-size: 10px; + color: #666666; + text-align: center; + padding: 2px 5px; + border-bottom: 1px solid #000; + border-right: 1px solid #000; +} + +.tax-invoice .data-cell { + font-size: 10px; + color: #222222; + padding: 2px 5px; +} + +.tax-invoice .invoice-title { + font-size: 11px; + color: #666666; + text-align: center; +} + +.tax-invoice .supplier-label { + background-color: #f9f9f9; + font-size: 10px; + line-height: 1.4; + color: #666666; + text-align: center; + vertical-align: middle; + padding: 0; + border-left: 1px solid #000; + border-right: 1px solid #000; +} + +.tax-invoice .line-height-13 { + line-height: 1.3; +} + +.tax-invoice .text-block { + display: block; + font-size: 10px; + color: #666666; + line-height: 1.4; +} + +.tax-invoice .main-border { border-top: 2px solid #000; border-left: 2px solid #000; border-right: 2px solid #000; - border-bottom: 1px solid #000000; - border-collapse: collapse; - padding: 0; - border-spacing: 0; - width: 100%; -} -.inner-table5-td1 { - width: 310px; - border-right: 1px solid #000000; - font-family: 'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 11px; - line-height: 1.4; - color: #666666; - text-align: center; - vertical-align: middle; -} -.inner-table5-td2 { - width:310px; - padding:0; -} -.inner-table6 { - border-collapse: collapse; - border: 0; - width: 100%; - padding: 0; - border-spacing: 0; -} -.inner-table6-td1 { - background-color: #f9f9f9; - width: 37px; - padding: 2px 5px; - border-bottom: 1px solid #000000; - border-right: 1px solid #000000; - font-family: 'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 10px; - line-height: 1.4; - color:#666666; - text-align:center; -} -.inner-table6-td2 { - padding: 2px 5px; - border-bottom: 1px solid #000000; - font-family: 'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 12px; - line-height: 1.4; - color: #222222; - text-align: left; -} -.inner-table6-td3 { - background-color: #f9f9f9; - width: 37px; - padding: 2px 5px; - border-right: 1px solid #000000; - font-family: 'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 10px; - line-height: 1.4; - color: #666666; - text-align: center; -} -.inner-table6-td4 { - padding: 2px 5px; - font-family: 'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 12px; - line-height: 1.4; - color: #222222; - text-align: left; -} -.inner-table6-td5 { - border-left: 1px solid #000; - background-color: #f9f9f9; - width: 20px; - padding: 0; - border-right: 1px solid #000; - font-family: 'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 10px; - line-height: 1.4; - color: #666666; - text-align: center; - vertical-align: middle; -} -.inner-table6-td6 { - width: 280px; - padding: 0; - vertical-align: top; -} -.inner-table6-td7 { - background-color: #f9f9f9; - width: 56px; - padding: 2px 5px; border-bottom: 1px solid #000; - border-right: 1px solid #000; - font-family:'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 10px; - color:#666666; - text-align: center; } -.inner-table6-td7-1 { - background-color: #f9f9f9; - width: 56px; - padding: 2px 5px; - border-right: 1px solid #000; - font-family:'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 10px; - color:#666666; - text-align: center; -} -.inner-table6-td8 { - padding: 2px 5px; - border-bottom: 1px solid #000; - font-family: 'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 10px; - color: #222222; - text-align: left; -} -.inner-table6-td8-1 { - padding: 2px 5px; - font-family: 'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 10px; - color: #222222; - text-align: left; -} -.inner-table6-td9 { - padding: 2px 5px; - border-bottom: 1px solid #000; - border-right: 1px solid #000; - font-family: 'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 10px; - color: #222222; - text-align: left; -} -.inner-table6-td9-1 { - padding: 2px 5px; - border-right: 1px solid #000; - font-family: 'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 10px; - color: #222222; - text-align: left; -} -.inner-table6-td10 { - background-color: #f9f9f9; - width:38px; - padding:2px 5px; - border-right:1px solid #000; - border-bottom:1px solid #000; - font-family:'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 10px; - color: #666666; - text-align: center; -} -.inner-table6-td10-1 { - background-color: #f9f9f9; - width:38px; - padding:2px 5px; - border-right:1px solid #000; - font-family:'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 10px; - color: #666666; - text-align: center; -} -.inner-table6-td11 { - width: 20px; - background-color: #f9f9f9; - padding:0; - border-left: 1px solid #000; - border-right: 1px solid #000; - font-family: 'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 10px; - line-height: 1.3; - color: #666666; - text-align: center; - vertical-align:middle; -} -.inner-table6-td12 { - width: 280px; - padding: 0; - vertical-align: top; - border-right: 1px solid #000; -} -.inner-table6-td13 { - padding: 2px 5px; - border-bottom: 1px solid #000; - border-right: 1px solid #000; - font-family: 'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 10px; - color: #222222; - text-align: center; -} -.inner-table6-td13-1 { - padding: 2px 5px; - border-right: 1px solid #000; - font-family: 'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 10px; - color: #222222; - text-align: center; -} -.inner-table6-td14 { - padding: 2px 5px; - border-bottom: 1px solid #000; - border-right: 1px solid #000; - font-family: 'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 10px; - color: #222222; - text-align: right; -} -.inner-table6-td14-1 { - padding: 2px 5px; - border-right: 1px solid #000; - font-family: 'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 10px; - color: #222222; - text-align: right; -} -.inner-table6-td15 { - padding: 2px 5px; - border-bottom: 1px solid #000; - font-family:' Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 10px; - color: #222222; - text-align: left; -} -.inner-table6-td15-1 { - padding: 2px 5px; - font-family:' Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 10px; - color: #222222; - text-align: left; -} -.inner-table7 { + +.tax-invoice .section-border { border-collapse: collapse; border-top: 0.5px solid #000; border-bottom: 2px solid #000; - width: 100%; - padding: 0; - border-spacing: 0; } -.inner-table7-td1 { - width: 310px; - padding: 0; - vertical-align: top; - border-left: 0.5px solid #000; - border-right: 0.5px solid #000; -} -.inner-table7-td2 { - width: 310px; - padding: 0; - vertical-align: top; - border-right: 0.5px solid #000; -} -.inner-table8 { - border-collapse: collapse; - border-bottom: 2px solid #000; - border-left: 2px solid #000; - border-right: 2px solid #000; - padding: 0; - width: 100%; - border-spacing: 0; -} -.inner-table8-td1 { - width: 90px; - vertical-align: top; - padding: 0; -} -.inner-table9 { - border-collapse: collapse; - padding: 0; - border: 0; - border-spacing: 0; - width: 90px; -} -.inner-table9-td1 { - padding: 2px 5px; - background-color: #f9f9f9; - border-right: 1px solid #000; - border-bottom: 1px solid #000; - font-family: 'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 10px; - color:#666666; - text-align:center; -} -.inner-table9-td2 { - width: 30px; - padding: 2px 5px; - border-right: 1px solid #000; - border-bottom: 1px solid #000; - font-family: 'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 10px; - color: #666666; - text-align: center; -} -.inner-table9-td2-1 { - width: 30px; - padding: 2px 5px; - border-right: 1px solid #000; - font-family: 'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 10px; - color: #666666; - text-align: center; -} -.inner-table9-td3 { - width: 214px; - vertical-align: top; - padding: 0 0 0 0; -} -.inner-table9-td4 { - width: 102px; - vertical-align: top; - padding: 0 0 0 0; - border-left: 0; -} -.inner-table10 { - border-collapse: collapse; - padding: 0; - border: 0; - border-spacing: 0; - width: 214px; -} -.inner-table10-td1 { - width: 19px; - padding: 2px 5px; - border-right: 1px solid #000; - border-bottom: 1px solid #000; - font-family: 'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 10px; - color: #666666; - text-align: center; -} -.inner-table10-td2 { - width: 19px; - padding: 2px 5px; - border-right: 1px solid #000; - font-family: 'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 10px; - color: #222222; - text-align: center; -} -.inner-table11 { - border-collapse: collapse; - padding: 0; - border: 0; - border-spacing: 0; - width: 102px; -} -.inner-table11-td1 { - padding: 2px 5px; - background-color: #f9f9f9; - border-bottom: 1px solid #000; - font-family: 'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 10px; - color: #666666; - text-align: center; -} -.inner-table11-td2 { - padding: 2px 5px; - border-right: 0; - border-bottom: 0; - border-left: 0; - font-family:'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 10px; - color: #222222; - text-align: left; -} -.inner-table12 { + +.tax-invoice .bottom-section-border { border-collapse: collapse; border-left: 2px solid #000; border-right: 2px solid #000; border-bottom: 1px solid #000; - padding: 0; - border-spacing: 0; - width: 100%; } -.inner-table12-td1 { - width: 40px; - padding: 0; - vertical-align: top; - border-right:1px solid #000; -} -.inner-table12-td2 { - width: 100%; - padding: 0; - vertical-align: top; -} -.inner-table13 { - border-collapse: collapse; - padding: 0; - border: 0; - border-spacing: 0; - width: 40px; -} -.inner-table13-td1 { - background-color: #f9f9f9; - padding: 2px 5px; - border-bottom: 1px solid #000; - font-family: 'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 10px; - color: #666666; - text-align: center; -} -.inner-table13-td2 { - padding: 2px 5px; - border-bottom: 1px solid #000; - font-family: 'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 10px; - color: #222222; - text-align: center; -} -.inner-table13-td3 { - padding: 2px 5px; - font-family: 'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 10px; - color: #222222; - text-align:center; -} -.inner-table14 { - padding: 0; - border: 0; - border-spacing: 0; - width: 100%; -} -.inner-table14-td1{ - font-family: 'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size:16px; - line-height: 1.4; - color: #1C1C1C; - font-weight: 700; - padding: 0; -} -.inner-table14-td2 { - font-family: 'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 14px; - line-height: 1.4; - color: #666666; - font-weight: 500; - padding: 4px 0; -} -.inner-table14-td3 { - font-family: 'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 14px; - line-height: 1.4; - color: #666666; - font-weight: 500; - padding: 4px 0 20px 0; -} -.inner-table15 { + +.tax-invoice .final-section-border { border-collapse: collapse; border-left: 2px solid #000; border-right: 2px solid #000; border-bottom: 2px solid #000; border-top: 0.5px solid #000; - padding: 0; - border-spacing: 0; - width: 100%; } -.inner-table15-td1 { - width: 463px; - padding: 0; - vertical-align: top; - border-right: 1px solid #000; +.tax-invoice .nicepay-logo{ + display: block; border: 0; outline: none; text-decoration: none; } -.inner-table15-td2{ - padding: 2px 5px; - border-bottom: 1px solid #000; - border-right: 1px solid #000; - background: #F9F9F9; - font-family: 'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 10px; - color: #666666; - text-align: center; -} -.inner-table15-td3 { - padding: 2px 5px; - border-right: 1px solid #000; - font-family: 'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 10px; - color: #222222; - text-align: right; -} -.inner-table15-td4{ - padding: 2px 5px; - border-bottom: 1px solid #000; - background: #F9F9F9; - font-family: 'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 10px; - color: #666666; - text-align: center; -} -.inner-table15-td5 { - padding: 2px 5px; - font-family: 'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 10px; - color: #222222; - text-align: right; -} -.inner-table15-td6 { - width: 157px; - padding: 2px 0; - vertical-align: middle; - text-align: center; -} -.inner-table15-td7 { - display: block; - font-family: 'Spoqa Han Sans Neo', Pretendard, Arial, Helvetica, sans-serif; - font-size: 10px; - color: #666666; - line-height: 1.4; -} -.nicepay-gray-logo { +.tax-invoice .nicepay-gray-logo { display: block; border: 0; outline: none; text-decoration: none; } -.tax-invoice-footer { +.tax-invoice .tax-invoice-footer { padding: 0px 30px 10px 10px; font-family: Pretendard, Arial, Helvetica, sans-serif; font-size: 12px;