.document_area {
    width: 900px;
    margin: 0 auto;
    padding: 10px 20px;
    background-color: white;

    .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
        padding: {
            left: 5px;
            right: 5px;
        }
    }

    .row {
        margin: {
            left: -5px;
            right: -5px;
        }
    }


    input, textarea {
        border: 0;
        border-bottom: 1px dashed #AAA;
        width: 100%;
        margin: 0 auto;
        outline: none;

        padding: {
            left: 5px;
            right: 5px;
        }

        &[readonly] {
            border-bottom: none;
            margin-bottom: 0;
        }
    }

    textarea {
        border: 1px dashed #BBB;
    }

    [number_format] {
        text-align: right;
    }

    .form-group {
        overflow: hidden;
        margin-bottom: 12px;
    }

    .control-label {
        font-weight: bold;
        text-align: right;
    }

    h2.header_title {
        width: 100%;
        text-align: center;
        border: 3px solid #000;
        padding: 0.5rem 0;
        margin-bottom: 20px;

        input {
            width: 100%;
            text-align: center;
        }
    }

    .header_company_price {
        margin-bottom: 40px;

        .header_company {
            font-size: 24px;

            input.to_company_name {
                border-bottom: 2px solid #000;
            }
        }

        .header_total_price {
            margin-top: 20px;
            font-size: 2rem;

            .control-label {
                text-align: left;
            }
        }
    }

    .header_comment {
        margin-top: 40px;
        margin-bottom: 10px;
    }
    /* 表 レイアウト不具合調整も行う */
    table {
        border-collapse: collapse;
        margin: 0 0 40px;

        & > thead, & > tbody, & > tfoot {
            & > tr > th, & > tr > td {
                border: 1px solid #AAA;
                font-size: 0.8em;

                padding: {
                    left: 2px;
                    right: 2px;
                }

                input[readonly] {
                    background-color: #eee;
                }
            }

            & .bordernone {
                border: none;
            }
        }

        & > thead > tr > th {
            background-color: #DDD;
            text-align: center;
        }

        tr {
            .button_column {
                position: relative;
                width: 0.1px;
                border: none;
                // remove, move buton
                .button_area {
                    transition: all 0.2s ease-out;
                    opacity: 0;
                    position: absolute;
                    width: 30px;
                    left: -30px;
                    top: 0;

                    .btn {
                        padding: 3px 8px;
                    }
                }
            }

            &:hover .button_area{
                opacity:1;
            }
        }
    }

    .table > thead:first-child > tr:first-child > th {
        border-top: 1px solid #AAA;
    }


    .header_total_price {
        border-bottom: 1px solid #000;

        input {
            font-weight: bold;
        }
    }
}
