@charset "Shift_JIS";

@page {
  size: A4;
  /* margin: 10mm; */
  margin: 0;
}
html, body, div, h1, h2, h3, h4, h5, h6, p, address, ul, ol, li, dl, dt, dd, table, th, td, form, fieldset {
    margin: 0;
    padding: 0;
    border: none;
    font-style: normal;
    font-weight: normal;
    font-size: 100%;
    text-align: left;
    list-style-type: none;
}
textarea {
    font-size: 100%;
    overflow: auto;
}
img {
    vertical-align:bottom;
    border:0;
}
table { border-spacing: 0; }

body,
input,
select,
textarea {
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro W3", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS P Gothic", sans-serif;
    font-size:12px;
    color:#333;
    line-height:1.4;
}
body{
    background: white;
}
@media print {
    body {
    width: 190mm; /* needed for Chrome */
    }
}
@media screen {
  body {
    background: #eee;
  }
  .wrap{
    width: 100%;
  }
}
#sheet{
    width: 210mm;
    height: 296mm; /* 1mm余裕をもたせる */
    page-break-after: always;
    background: white;
    margin: 0 auto;
    padding: 45px 65px;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}
@media screen {
  #sheet {
    background: white; /* 背景を白く */
    box-shadow: 0 .5mm 2mm rgba(0,0,0,.3); /* ドロップシャドウ */
    margin: 7mm auto 5mm;
    border:solid 1px #CCC;
    position: relative;
    }
}
h1{
    text-align: center;
    margin-bottom: 30px;
    font-size: 17px;
    line-height: 1.5;
}
#sheet .lead{
    /* border-top:double 3px #CCC;
    border-bottom:double 3px #CCC;
    padding: 10px 15px; */
    margin-bottom: 20px;
}
#sheet .lead .text{
    margin: 0 2px 5px;
    font-size: 12px;
    line-height: 1.5;
    color: #333;
}
#sheet .address{
    background: #EFEFEF;
    padding: 11px 5px;
}
#sheet .address ul{
    text-align: center;
    margin-bottom: 4px;
}
#sheet .address li{
    display: inline-block;
    margin: 0 7px;
    font-size: 12px;
    line-height: 1.3;
    color: #333;
}
#sheet .address .location{
    text-align: center;
    font-size: 12px;
    line-height: 1.3;
}
#sheet table{
    border-top:solid 1px #ACACAC;
    border-right:solid 1px #ACACAC;
    width: 100%;
    margin-bottom: 20px;
}
#sheet th,
#sheet td{
    border-left:solid 1px #ACACAC;
    border-bottom:solid 1px #ACACAC;
    padding: 5px 11px;
    font-size: 12px;
    white-space: nowrap;
}
#sheet th{
    background:#EFEFEF;
}
.personalinformation th{
    text-align: right;
    width: 20%;
}
#sheet .serialcode td span{
    float: right;
}
h2{
    margin-bottom: 5px;
    font-size: 13px;
    line-height: 1.5;
}
#sheet td.netPrice{
    width: 10px;
}
/* #sheet td.inTax{
    border-left: none;
} */
#sheet td .value{
    margin: 0 3px;
}
#sheet td.netPrice .value{
    text-decoration: line-through;
}
#sheet .product,
#sheet .payment {
    margin-bottom: 7px;
}
#sheet .payment .card td:last-child{
    line-height: 1.6;
}
#sheet .note1{
    margin-bottom: 20px;
}
#sheet .note1,
#sheet .note2{
    font-size: 12px;
    line-height: 1.5;
    color: #333;
    padding-left: 1em;
    text-indent: -1em;
}
#sheet .note span{
    text-decoration: underline;
    margin: 0 2px;
}
@media print {
    .print_btn {
        display: none;
    }
}
@media screen {
    .print_btn{
        position: absolute;
        right: 15px;
        top: 15px;
    }
    input[type="button"]{
        padding: 5px 30px;
        font-size: 15px;
        cursor: pointer;
    }
}