@import url(https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500;700&family=Noto+Serif+JP:wght@300;400;500;600;700&display=swap);

:root {
  --title-color: #000;
  --message-color: #000;
  --overlay-background-color: #0000007a;
  --container-box-shadow: #0000004a 0px 3px 8px 0px;
  --base-background-color: #fff;
  --button-color: #4083ff;
  --button-background-color: #fff;
  --button-border-color: #e0e0e0;
  --button-background-color-disabled: #f5f5f5;
  --button-background-color-hover: #f5f5f5;
  --button-box-shadow-active: inset 0 2px 0px 0px #00000014;
  --input-background-color: #ebebeb;
  --input-background-color-hover: #dfdfdf;
  --font-size-m: 28px;
  --font-size-s: 20px;
  --font-weight-black: 900;
  --font-weight-bold: 700;
  --font-weight-medium: 500;
  --font-weight-normal: 400;
  --font-weight-light: 300;
}
.vc-overlay *,
.vc-overlay *:before,
.vc-overlay *:after {
  box-sizing: border-box;
  text-decoration: none;
  -webkit-touch-callout: none;
  -moz-osx-font-smoothing: grayscale;
  margin: 0;
  padding: 0;
}
.vc-title {
  color: var(--title-color);
  padding: 0 1rem;
  width: 100%;
  font-weight: var(--font-weight-black);
  text-align: center;
  font-size: var(--font-size-m);
  line-height: initial;
  margin-bottom: 5px;
}
.vc-text {
  color: var(--message-color);
  padding: 0 1rem;
  width: 100%;
  font-weight: var(--font-weight-medium);
  text-align: center;
  font-size: var(--font-size-s);
  line-height: initial;
}
.vc-overlay {
  background-color: var(--overlay-background-color);
  width: 100%;
  height: 100%;
  transition: all 0.1s ease-in;
  left: 0;
  top: 0;
  z-index: 999999999999;
  position: fixed;
  display: flex;
  justify-content: center;
  align-items: center;
  align-content: baseline;
}
.vc-container {
  padding: 80px;
  background-color: var(--base-background-color);
  border-radius: 20px;
  gap: 40px;
  min-width: 1200px;
  height: auto;
  display: grid;
  grid-template-rows: 1fr max-content;
  box-shadow: var(--container-box-shadow);
}
.vc-btn-grid.isMono {
  grid-template-columns: 1fr;
}
.vc-btn {
  border-radius: 0 0 20px 0;
  color: var(--button-color);
  background-color: var(--button-background-color);
  border: 0;
  font-size: 1rem;
  border-top: 1px solid var(--button-border-color);
  cursor: pointer;
  font-weight: var(--font-weight-bold);
  outline: none;
  min-height: 50px;
}
.vc-btn:hover {
  background-color: var(--button-background-color-hover);
}
.vc-btn:disabled {
  background-color: var(--button-background-color-disabled);
}
.vc-btn:active {
  box-shadow: var(--button-box-shadow-active);
}
.vc-btn.left {
  border-radius: 0;
  border-right: 1px solid var(--button-border-color);
}
.vc-input[type='password'] {
  width: 100%;
  outline: none;
  border-radius: 8px;
  height: 35px;
  border: 0;
  margin: 5px 0;
  background-color: var(--input-background-color);
  padding: 0 0.5rem;
  font-size: var(--font-size-m);
  transition: 0.21s ease;
}
.vc-input[type='password']:hover,
.vc-input[type='password']:focus {
  background-color: var(--input-background-color-hover);
}

/**
* Transition
*/
.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.21s;
}
.fade-enter,
.fade-leave-to {
  opacity: 0;
}
.zoom-enter-active,
.zoom-leave-active {
  animation-duration: 0.21s;
  animation-fill-mode: both;
  animation-name: zoom;
}
.zoom-leave-active {
  animation-direction: reverse;
}
@keyframes zoom {
from {
    opacity: 0;
    transform: scale3d(1.1, 1.1, 1.1);
}
100% {
    opacity: 1;
    transform: scale3d(1, 1, 1);
}
}

html,body{-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}body{margin:0;font-family:"Noto Sans JP",Hiragino Kaku Gothic W6 JIS2004,"ヒラギノ角ゴ ProN W6";color:#000;background:#F8F8F8;line-height:1.5;font-size:14px}#content_inner{margin:0 auto;width:960px}@media screen and (max-width: 768px){#content_inner{width:100%}}#content_inner .zoom a{text-decoration:underline}#content_inner .zoom a:hover{text-decoration:none}h1,h2,h3,h4,h5,h6,p{font-weight:normal}a{transition-property:background-color, opacity;transition-duration:0.2s;transition-timing-function:ease}a,a:visited,a:hover{color:inherit;text-decoration:none}a:hover,button:hover{transition:all 0.2s ease 0s;font-family:"Noto Sans JP",Hiragino Kaku Gothic W6 JIS2004,"ヒラギノ角ゴ ProN W6"}a img{border:0}.clearfix:after{height:0;display:block;clear:both;content:" "}.pc{display:block}.sp{display:none}@media print, screen and (min-width: 769px){br.pc,img.pc{display:inline-block}br.sp,img.sp{display:none}.pc{display:block}.sp{display:none !important}}@media screen and (max-width: 1300px){br.pc,img.pc{display:inline-block}.pc{display:block}}@media screen and (max-width: 768px){br.sp,img.sp{display:inline-block}br.pc,img.pc{display:none}.sp{display:block}.pc{display:none !important}}.m_5{margin:5px !important}.m_10{margin:10px !important}.m_15{margin:15px !important}.m_20{margin:20px !important}.m_25{margin:25px !important}.m_30{margin:30px !important}.m_35{margin:35px !important}.m_40{margin:40px !important}.m_45{margin:45px !important}.m_50{margin:50px !important}.m_55{margin:55px !important}.m_t5{margin-top:5px !important}.m_t10{margin-top:10px !important}.m_t15{margin-top:15px !important}.m_t20{margin-top:20px !important}.m_t25{margin-top:25px !important}.m_t30{margin-top:30px !important}.m_t35{margin-top:35px !important}.m_t40{margin-top:40px !important}.m_t45{margin-top:45px !important}.m_t50{margin-top:50px !important}.m_t55{margin-top:55px !important}.m_b5{margin-bottom:5px !important}.m_b10{margin-bottom:10px !important}.m_b15{margin-bottom:15px !important}.m_b20{margin-bottom:20px !important}.m_b25{margin-bottom:25px !important}.m_b30{margin-bottom:30px !important}.m_b35{margin-bottom:35px !important}.m_b40{margin-bottom:40px !important}.m_b45{margin-bottom:45px !important}.m_b50{margin-bottom:50px !important}.m_b55{margin-bottom:55px !important}.m_l5{margin-left:5px !important}.m_l10{margin-left:10px !important}.m_l15{margin-left:15px !important}.m_l20{margin-left:20px !important}.m_l25{margin-left:25px !important}.m_l30{margin-left:30px !important}.m_l35{margin-left:35px !important}.m_l40{margin-left:40px !important}.m_l45{margin-left:45px !important}.m_l50{margin-left:50px !important}.m_l55{margin-left:55px !important}.m_r5{margin-right:5px !important}.m_r10{margin-right:10px !important}.m_r15{margin-right:15px !important}.m_r20{margin-right:20px !important}.m_r25{margin-right:25px !important}.m_r30{margin-right:30px !important}.m_r35{margin-right:35px !important}.m_r40{margin-right:40px !important}.m_r45{margin-right:45px !important}.m_r50{margin-right:50px !important}.m_r55{margin-right:55px !important}.p_5{padding:5px !important}.p_10{padding:10px !important}.p_15{padding:15px !important}.p_20{padding:20px !important}.p_25{padding:25px !important}.p_30{padding:30px !important}.p_35{padding:35px !important}.p_40{padding:40px !important}.p_45{padding:45px !important}.p_50{padding:50px !important}.p_55{padding:55px !important}.p_t0{padding-top:0 !important}.p_t5{padding-top:5px !important}.p_t10{padding-top:10px !important}.p_t15{padding-top:15px !important}.p_t20{padding-top:20px !important}.p_t25{padding-top:25px !important}.p_t30{padding-top:30px !important}.p_t35{padding-top:35px !important}.p_t40{padding-top:40px !important}.p_t45{padding-top:45px !important}.p_t50{padding-top:50px !important}.p_t55{padding-top:55px !important}.p_b0{padding-bottom:0 !important}.p_b5{padding-bottom:5px !important}.p_b10{padding-bottom:10px !important}.p_b15{padding-bottom:15px !important}.p_b20{padding-bottom:20px !important}.p_b25{padding-bottom:25px !important}.p_b30{padding-bottom:30px !important}.p_b35{padding-bottom:35px !important}.p_b40{padding-bottom:40px !important}.p_b45{padding-bottom:45px !important}.p_b50{padding-bottom:50px !important}.p_b55{padding-bottom:55px !important}.p_l0{padding-left:0 !important}.p_l5{padding-left:5px !important}.p_l10{padding-left:10px !important}.p_l15{padding-left:15px !important}.p_l20{padding-left:20px !important}.p_l25{padding-left:25px !important}.p_l30{padding-left:30px !important}.p_l35{padding-left:35px !important}.p_l40{padding-left:40px !important}.p_l45{padding-left:45px !important}.p_l50{padding-left:50px !important}.p_l55{padding-left:55px !important}.p_r0{padding-right:0 !important}.p_r5{padding-right:5px !important}.p_r10{padding-right:10px !important}.p_r15{padding-right:15px !important}.p_r20{padding-right:20px !important}.p_r25{padding-right:25px !important}.p_r30{padding-right:30px !important}.p_r35{padding-right:35px !important}.p_r40{padding-right:40px !important}.p_r45{padding-right:45px !important}.p_r50{padding-right:50px !important}.p_r55{padding-right:55px !important}.p_0{padding:0 !important}.m_0{margin:0 !important}.m_0_auto{margin:0 auto !important}html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,a,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video,input,button,textarea,select{margin:0;padding:0;border:0;outline:0;font-size:14px;background:transparent;box-sizing:border-box;font-family:"Noto Sans JP",Hiragino Kaku Gothic W6 JIS2004,"ヒラギノ角ゴ ProN W6"}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}ul,ol{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:"";content:none}a{vertical-align:baseline;background:transparent}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}table{border-collapse:collapse;border-spacing:0}hr{display:block;height:1px;border:0;margin:1em 0;padding:0}input,select{vertical-align:middle}img{vertical-align:top}@media screen and (max-width: 768px){img{max-width:100%;height:auto}}main{display:block}[v-cloak]{display:none}.btn-spmenu{z-index:4}.header{z-index:3}.sp-menu{z-index:2}main{z-index:1}main{position:relative;z-index:1}main #sidebar .menu{z-index:1}main #content{z-index:2}@keyframes start-border01{0%{height:0}50%{height:100vh}100%{height:100vh}}@keyframes start-border02{0%{width:0}50%{width:0}100%{width:100vw}}@keyframes floor_btn{0%{transform:scale(0.95);opacity:1}90%{opacity:.1}to{transform:scale(1.35);opacity:0}}#app{height:100vh;height:100dvh;display:flex;position:relative}#app #sidebar{width:210px}#app #sidebar .menu{width:210px;position:fixed;height:100%}#app #main{width:calc(100% - 210px);display:flex;justify-content:center}#app #content{width:870px;padding:0 40px}#app #content>*:last-child{padding-bottom:50px}#app #login{background:#fff;width:100vw;display:grid;place-content:center}#app #login .formwrapper{padding-right:170px;display:grid;grid-auto-columns:1fr;grid-template-columns:30fr 53fr;grid-template-rows:88px auto auto auto auto auto;gap:0px 17px;grid-template-areas:". logo" ". title" "id_title id_input" ". id_error" "pw_title pw_input" ". pw_error" ". submit"}#app #login .formwrapper .logo{grid-area:logo;justify-self:center;align-self:center;height:44px}#app #login .formwrapper .logo img{height:100%}#app #login .formwrapper .title{grid-area:title;justify-self:center;align-self:center;font-weight:bold;font-size:17.5px;padding-bottom:20px}#app #login .formwrapper .submit{grid-area:submit;margin-top:20px}#app #login .formwrapper .submit button{width:100%;display:block}#app #login .formwrapper .id._title{grid-area:id_title}#app #login .formwrapper .id._input{grid-area:id_input}#app #login .formwrapper .id._error{grid-area:id_error}#app #login .formwrapper .pw._title{grid-area:pw_title}#app #login .formwrapper .pw._input{grid-area:pw_input}#app #login .formwrapper .pw._error{grid-area:pw_error}#app #login .formwrapper ._title{grid-area:id_title;align-self:center;justify-self:end;margin-top:20px}#app #login .formwrapper ._input{grid-area:id_input;align-self:center;margin-top:20px}#app #login .formwrapper input{width:100%}#app #login .formwrapper input[type="text"]::-moz-placeholder, #app #login .formwrapper input[type="password"]::-moz-placeholder{color:#CCCCCC !important}#app #login .formwrapper input[type="text"]::placeholder,#app #login .formwrapper input[type="password"]::placeholder{color:#CCCCCC !important}#sidebar{height:100%;position:relative}#sidebar .menu{background:#07C455}#sidebar .menu .logo{margin:25px 0 60px;padding-left:20px;height:27px}#sidebar .menu .logo img{height:100%}#sidebar .menu .user div{padding:20px 13px;color:#fff;font-weight:bold;font-size:16px;display:flex;gap:10px}#sidebar .menu .user div img{width:31px;height:31px;background-color:#fff;border-radius:15px;padding:8px 9px 9px}#sidebar .menu ul{width:100%;display:flex;flex-direction:column}#sidebar .menu ul li a{color:#fff;font-size:16px;padding:14px 20px 13px;display:flex;align-items:center;gap:5px}#sidebar .menu ul li a:hover,#sidebar .menu ul li a.active{color:#07C455;background-color:#fff;transition:all 0.3s ease 0s}#sidebar .menu ul li a:hover .active,#sidebar .menu ul li a.active .active{display:block}#sidebar .menu ul li a:hover .passive,#sidebar .menu ul li a.active .passive{display:none}#sidebar .menu ul li a .active{display:none}#sidebar .menu ul li a .passive{display:block}#sidebar .menu ul li a img{width:14px;margin-top:4px}a.btn01,a.btn02,a.btn03,a.btn04,a.btn05,a.btn06,.btn01,.btn02,.btn03,.btn04,.btn05,.btn06{font-size:16px;font-weight:bold;border-radius:25px}a.btn01,a.btn03,a.btn05,.btn01,.btn03,.btn05{padding:7px 25px 9.5px}a.btn02,a.btn04,a.btn06,.btn02,.btn04,.btn06{padding:7.5px 48px 9px 25px;position:relative}a.btn02::before,a.btn04::before,a.btn06::before,.btn02::before,.btn04::before,.btn06::before{content:"";position:absolute;width:14px;height:14px;top:50%;right:10px;transform:translate(-50%, -50%)}a.btn02._ico-01::before,.btn02._ico-01::before{background:url(../img/icon_search.svg) no-repeat center center/contain}a.btn02._ico-01:hover::before,.btn02._ico-01:hover::before{background:url(../img/icon_search_ol.svg) no-repeat center center/contain}a.btn02._ico-02::before,.btn02._ico-02::before{background:url(../img/icon_check.svg) no-repeat center center/contain}a.btn02._ico-02:hover::before,.btn02._ico-02:hover::before{background:url(../img/icon_check_ol.svg) no-repeat center center/contain}a.btn02._ico-03::before,.btn02._ico-03::before{background:url(../img/icon_plus.svg) no-repeat center center/contain}a.btn02._ico-03:hover::before,.btn02._ico-03:hover::before{background:url(../img/icon_plus_ol.svg) no-repeat center center/contain}a.btn02._ico-04::before,.btn02._ico-04::before{background:url(../img/icon_input.svg) no-repeat center center/contain}a.btn02._ico-04:hover::before,.btn02._ico-04:hover::before{background:url(../img/icon_input_ol.svg) no-repeat center center/contain}a.btn04._ico-01::before,.btn04._ico-01::before{background:url(../img/icon_search_ol.svg) no-repeat center center/contain}a.btn04._ico-01:hover::before,.btn04._ico-01:hover::before{background:url(../img/icon_search.svg) no-repeat center center/contain}a.btn04._ico-02::before,.btn04._ico-02::before{background:url(../img/icon_check_ol.svg) no-repeat center center/contain}a.btn04._ico-02:hover::before,.btn04._ico-02:hover::before{background:url(../img/icon_check.svg) no-repeat center center/contain}a.btn04._ico-03::before,.btn04._ico-03::before{background:url(../img/icon_plus_ol.svg) no-repeat center center/contain}a.btn04._ico-03:hover::before,.btn04._ico-03:hover::before{background:url(../img/icon_plus.svg) no-repeat center center/contain}a.btn04._ico-04::before,.btn04._ico-04::before{background:url(../img/icon_input_ol.svg) no-repeat center center/contain}a.btn04._ico-04:hover::before,.btn04._ico-04:hover::before{background:url(../img/icon_input.svg) no-repeat center center/contain}a.btn06._ico-01::before,.btn06._ico-01::before{background:url(../img/icon_remove.svg) no-repeat center center/contain}a.btn06._ico-01:hover::before,.btn06._ico-01:hover::before{background:url(../img/icon_remove.svg) no-repeat center center/contain}a.btn01,a.btn02,.btn01,.btn02{color:#fff;background-color:#07C455;border:1px solid rgba(0,0,0,0)}a.btn01:hover,a.btn02:hover,.btn01:hover,.btn02:hover{color:#07C455;background-color:rgba(0,0,0,0);border:1px solid #07C455}a.btn03,a.btn04,.btn03,.btn04{color:#07C455;background-color:rgba(0,0,0,0);border:1px solid #07C455}a.btn03:hover,a.btn04:hover,.btn03:hover,.btn04:hover{color:#fff;background-color:#07C455;border:1px solid rgba(0,0,0,0)}a.btn05,a.btn06,.btn05,.btn06{color:#ed3434;background-color:#FFE6E6;border:1px solid rgba(0,0,0,0)}a.btn05:hover,a.btn06:hover,.btn05:hover,.btn06:hover{color:#ed3434;background-color:#FFE6E6;border:1px solid rgba(0,0,0,0)}.back{display:flex;justify-content:center;align-items:center;height:40px;width:40px;border-radius:20px;border:1px solid #07C455}.btnbox{display:flex;justify-content:center;gap:20px}.titlebar{display:flex;align-items:center;margin:32.5px 0 32.5px}.titlebar .title{text-align:center;flex:1;font-size:30px;font-weight:bold}.card{background:#fff;border-radius:20px;width:100%;min-height:30px;margin-bottom:25px;box-shadow:0px 3px 5.5px rgba(0,0,0,0.1);padding:40px}.card .ttl01{color:#07C455;font-size:20px;font-weight:bold;margin-bottom:20px}.card .ttl01._ico-01,.card .ttl01._ico-02,.card .ttl01._ico-03,.card .ttl01._ico-04{position:relative;padding-left:35px}.card .ttl01._ico-01::after,.card .ttl01._ico-01::before,.card .ttl01._ico-02::after,.card .ttl01._ico-02::before,.card .ttl01._ico-03::after,.card .ttl01._ico-03::before,.card .ttl01._ico-04::after,.card .ttl01._ico-04::before{content:"";position:absolute;top:50%;transform:translate(0, -50%)}.card .ttl01._ico-01::after,.card .ttl01._ico-02::after,.card .ttl01._ico-03::after,.card .ttl01._ico-04::after{background-color:#07C455;border-radius:15px;z-index:1;left:0;height:29px;width:29px}.card .ttl01._ico-01::before,.card .ttl01._ico-02::before,.card .ttl01._ico-03::before,.card .ttl01._ico-04::before{z-index:2;left:7px;height:15px;width:15px}.card .ttl01._ico-01::before{background:url(../img/icon_edit.svg) no-repeat center center/contain}.card .ttl01._ico-02::before{background:url(../img/icon_search.svg) no-repeat center center/contain}.card .ttl02{font-size:14px;font-weight:bold;margin-bottom:14px}.card .ttl02._ico-01,.card .ttl02._ico-02,.card .ttl02._ico-03,.card .ttl02._ico-04,.card .ttl02._ico-05{position:relative;padding-left:20px}.card .ttl02._ico-01::after,.card .ttl02._ico-02::after,.card .ttl02._ico-03::after,.card .ttl02._ico-04::after,.card .ttl02._ico-05::after{content:"";position:absolute;top:50%;transform:translate(0, -50%);z-index:1;left:0;height:13px;width:13px}.card .ttl02._ico-01::after{background-color:#ec655b}.card .ttl02._ico-02::after{background-color:#d0ec5b}.card .ttl02._ico-03::after{background-color:#2097cc}.card .ttl02._ico-04::after{background-color:#ddd}.card .ttl02._ico-05::after{background-color:#ddd}.card .ttl03{font-size:32px;font-weight:bold;margin-bottom:36px}.card .status{display:flex;justify-content:space-between}.card .status>*{display:flex;gap:10px}.card .status dl{width:165px}.card .status dl dd span{font-weight:bold;padding-right:5px}.card .status .day{width:300px;justify-content:flex-end;align-items:center}.card .formwrapper{margin-bottom:30px}.card .formwrapper .formtable{display:grid;grid-auto-columns:1fr;grid-template-columns:125px 1fr;grid-template-rows:1fr 1fr;gap:15px 5px}.card .formwrapper .formtable>div{font-size:14px;display:flex;align-items:center;flex-wrap:wrap;gap:5px}.card .formwrapper .formtable>div:nth-child(2n-1){padding-top:2.5px}.card .formwrapper .formtable>div ._error{width:100%}.card .formwrapper .submit{margin-top:30px;text-align:center}.card .formwrapper .discount_text{margin-left:5px;font-size:14px;color:#EE3535}.card .searchwrapper .searchtitle{font-weight:bold;color:#848484;font-size:16px;gap:20px;padding-bottom:16.5px;margin:32px 0 20px;border-bottom:1px solid #ccc}.card .searchwrapper .seachhead{display:grid;justify-items:center;grid-template-columns:auto;background-color:#E8F8EF;padding:7px 5px;font-size:14px;margin-bottom:5px}.card .searchwrapper .seachhead._01{grid-template-columns:4fr 3fr 7fr;grid-template-areas:"client_name phone_number corporation"}.card .searchwrapper .seachhead._02{grid-template-columns:17fr 43fr 28fr 54fr;grid-template-areas:"number client_name total_amount memo"}.card .searchwrapper .seachhead._03{grid-template-columns:8fr 12fr 47fr 12fr 12fr 20fr 18fr 22fr 23fr;grid-template-areas:"checkbox . product_name amount unit normal_price discount desc control_panel"}.card .searchwrapper .seachhead._04{grid-template-columns:23fr 22fr 68fr 29fr;grid-template-areas:"estimated_date total_amount memo control_panel"}.card .searchwrapper .seachhead._05{grid-template-columns:8fr 8fr 25fr;grid-template-areas:"category maker serial"}.card .searchwrapper .seachhead .checkbox{grid-area:checkbox;width:100%}.card .searchwrapper .seachhead .client_name{grid-area:client_name}.card .searchwrapper .seachhead .phone_number{grid-area:phone_number}.card .searchwrapper .seachhead .corporation{grid-area:corporation}.card .searchwrapper .seachhead .number{grid-area:number}.card .searchwrapper .seachhead .desc{grid-area:desc}.card .searchwrapper .seachhead .estimated_date{grid-area:estimated_date}.card .searchwrapper .seachhead .total_amount{grid-area:total_amount}.card .searchwrapper .seachhead .product_name{grid-area:product_name}.card .searchwrapper .seachhead .memo{grid-area:memo}.card .searchwrapper .seachhead .checkbox{grid-area:checkbox}.card .searchwrapper .seachhead .amount{grid-area:amount}.card .searchwrapper .seachhead .unit{grid-area:unit}.card .searchwrapper .seachhead .normal_price{grid-area:normal_price}.card .searchwrapper .seachhead .discount{grid-area:discount}.card .searchwrapper .seachhead .control_panel{grid-area:control_panel}.card .searchwrapper .seachhead .serial{grid-area:serial}.card .searchwrapper .seachhead .category{grid-area:category}.card .searchwrapper .seachhead .maker{grid-area:maker}.card .searchwrapper .seachhead .catalog{grid-area:catalog}.card .searchwrapper .seachlist{display:grid;flex-direction:column;gap:5px;position:relative}.card .searchwrapper .seachlist .sortable-drag .checkbox_wrapper,.card .searchwrapper .seachlist .sortable-ghost .checkbox_wrapper{opacity:0}.card .searchwrapper .seachlist._01 li div{grid-template-columns:4fr 3fr 7fr;grid-template-areas:"client_name phone_number corporation"}.card .searchwrapper .seachlist._02 li div{grid-template-columns:17fr 43fr 28fr 54fr;grid-template-areas:"number client_name total_amount memo"}.card .searchwrapper .seachlist._03 li div{grid-template-columns:5fr 39fr 8fr 12fr 16fr 17fr 17fr 8fr;grid-template-areas:"blank product_name amount unit normal_price discount desc control_panel"}.card .searchwrapper .seachlist._04 li div{grid-template-columns:23fr 22fr 68fr 29fr;grid-template-areas:"estimated_date total_amount memo control_panel"}.card .searchwrapper .seachlist._05 li div{grid-template-columns:8fr 8fr 25fr;grid-template-areas:"category maker serial"}.card .searchwrapper .seachlist li{display:flex;width:100%}.card .searchwrapper .seachlist li>a{flex:1}.card .searchwrapper .seachlist li div{flex:1;display:grid;justify-items:center;grid-template-columns:auto;border-radius:10px;padding:0 10px;background:#fff;box-shadow:0px 3px 6px rgba(7,7,7,0.1);font-size:14px}.card .searchwrapper .seachlist li div>p{padding:16.5px 0}.card .searchwrapper .seachlist li div .blank{grid-area:blank}.card .searchwrapper .seachlist li div .client_name{grid-area:client_name}.card .searchwrapper .seachlist li div .phone_number{grid-area:phone_number}.card .searchwrapper .seachlist li div .corporation{grid-area:corporation}.card .searchwrapper .seachlist li div .desc{grid-area:desc;width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.card .searchwrapper .seachlist li div .number{grid-area:number}.card .searchwrapper .seachlist li div .estimated_date{grid-area:estimated_date}.card .searchwrapper .seachlist li div .total_amount{grid-area:total_amount}.card .searchwrapper .seachlist li div .product_name{grid-area:product_name}.card .searchwrapper .seachlist li div .memo{grid-area:memo}.card .searchwrapper .seachlist li div .checkbox{grid-area:checkbox}.card .searchwrapper .seachlist li div .amount{grid-area:amount}.card .searchwrapper .seachlist li div .unit{grid-area:unit}.card .searchwrapper .seachlist li div .normal_price{grid-area:normal_price}.card .searchwrapper .seachlist li div .discount{grid-area:discount}.card .searchwrapper .seachlist li div .control_panel{grid-area:control_panel;justify-self:end;display:flex;gap:10px}.card .searchwrapper .seachlist li div .control_panel .restore,.card .searchwrapper .seachlist li div .control_panel .print,.card .searchwrapper .seachlist li div .control_panel .copy,.card .searchwrapper .seachlist li div .control_panel .remove{width:30px;height:30px;border-radius:15px;display:flex;align-items:center;justify-content:center}.card .searchwrapper .seachlist li div .control_panel .restore img,.card .searchwrapper .seachlist li div .control_panel .print img,.card .searchwrapper .seachlist li div .control_panel .copy img,.card .searchwrapper .seachlist li div .control_panel .remove img{width:15px;height:15px}.card .searchwrapper .seachlist li div .control_panel .restore{background-color:#E8F8EF}.card .searchwrapper .seachlist li div .control_panel .print{background-color:#DAEFF6}.card .searchwrapper .seachlist li div .control_panel .copy{background-color:#E8F8EF}.card .searchwrapper .seachlist li div .control_panel .remove{background-color:#FFE6E6}.card .searchwrapper .seachlist li div .serial{grid-area:serial}.card .searchwrapper .seachlist li div .category{grid-area:category;justify-self:start;align-self:center;font-weight:bold;padding-left:20px}.card .searchwrapper .seachlist li div .category._ico-01,.card .searchwrapper .seachlist li div .category._ico-02,.card .searchwrapper .seachlist li div .category._ico-03,.card .searchwrapper .seachlist li div .category._ico-04,.card .searchwrapper .seachlist li div .category._ico-05{position:relative;padding-left:40px}.card .searchwrapper .seachlist li div .category._ico-01::after,.card .searchwrapper .seachlist li div .category._ico-02::after,.card .searchwrapper .seachlist li div .category._ico-03::after,.card .searchwrapper .seachlist li div .category._ico-04::after,.card .searchwrapper .seachlist li div .category._ico-05::after{content:"";position:absolute;top:50%;transform:translate(0, -50%);z-index:1;left:20px;height:13px;width:13px}.card .searchwrapper .seachlist li div .category._ico-01::after{background-color:#ec655b}.card .searchwrapper .seachlist li div .category._ico-02::after{background-color:#d0ec5b}.card .searchwrapper .seachlist li div .category._ico-03::after{background-color:#2097cc}.card .searchwrapper .seachlist li div .category._ico-04::after{background-color:#ddd}.card .searchwrapper .seachlist li div .category._ico-05::after{background-color:#ddd}.card .searchwrapper .seachlist li div .maker{grid-area:maker}.card .searchwrapper .seachlist li div .catalog{grid-area:catalog}.card .searchwrapper .seachlist li .bold{font-weight:bold}.card .searchwrapper .seachlist li .red{color:#EE3535}.card .searchwrapper .seachlist li .checkbox_wrapper{width:40px}.card .searchwrapper .noindex{color:#848484;font-size:14px}.card .searchwrapper .noindex+div>.container{display:flex;justify-content:center;margin:50px 0}.card .pricewrapper .pricetable{display:grid;grid-auto-columns:1fr;grid-template-columns:125px 1fr;grid-template-rows:auto 1fr;gap:5px 5px;grid-template-areas:". price"  ". discount_price"  "title detail";color:#333333;font-weight:bold}.card .pricewrapper .pricetable .price{grid-area:price;display:flex;justify-content:flex-end;align-items:flex-end;padding:0 30px}.card .pricewrapper .pricetable .discount_price{grid-area:discount_price;display:flex;justify-content:flex-end;align-items:flex-end;padding:0 30px;color:#EE3535}.card .pricewrapper .pricetable .title{grid-area:title;align-self:center}.card .pricewrapper .pricetable .detail{grid-area:detail;padding:15x 30px;margin-top:10px;background:#E8F8EF;border-radius:5px;display:flex;flex-direction:column}.card .pricewrapper .pricetable .detail>li{display:flex;justify-content:end;align-items:flex-end}.card .pricewrapper .pricetable .value{padding:0 5px 0 10px;font-size:18px}.card .pricewrapper .pricetable .total{color:#000000}.card .pricewrapper .pricetable .total .value{font-size:32px}.card>.memo{display:flex;align-items:center;margin:25px 0 30px;gap:30px}.card>.memo dt{font-size:14px}.card>.memo dd{flex:1}.card>.memo dd input{width:100%}span.optional,span.require{font-size:10px;padding:3px 7px;margin-left:5px}span.require{color:#ed3434;background-color:#FFE6E6}span.optional{color:#333;background-color:#eee}.place_box{display:flex}.w_xxs{width:116px}.w_xs{width:92px}.w_sm{width:118px}.w_md{width:200px}.w_ml{width:284px}.w_lg{width:311px}.w_xl{width:350px}.w_xxl{width:450px}._error{padding-top:5px;grid-area:id_error;align-self:center;color:#EE3535;display:flex;align-items:center}._error>img{margin-right:5px;width:19px;height:19px}input[type="text"],input[type="password"],input[type="tel"],input[type="date"]{border:1px solid #ccc;border-radius:5px;padding:6px 15px;font-size:16px;display:block}.password_wrapper{position:relative}.eyes{position:absolute;top:50%;right:5px;transform:translate(0, -50%);width:34px;height:30px}.eyes img{width:100%;height:100%;padding:10px}.eyes .active{display:none}.eyes .passive{display:block}.eyes._active .active{display:block}.eyes._active .passive{display:none}.input_select{display:inline-block;position:relative}.input_select input{min-width:120px !important}.input_select input[type="date"],.input_select input[type="time"],.input_select input[type="datetime-local"]{-webkit-appearance:none;height:40px !important}.input_select input[type="date"]::-webkit-date-and-time-value,.input_select input[type="time"]::-webkit-date-and-time-value{text-align:left}.input_select select{padding:6px 20px 6px 12.5px;font-size:16px;border-radius:5px;border:1px solid #ccc;-webkit-appearance:none;-moz-appearance:none;appearance:none}.input_select select::-ms-expand{display:none}.input_select::before{content:"";background:url(../img/chevon-arrow-bk.svg) no-repeat center center/contain;position:absolute;right:5px;top:50%;width:10px;height:5px;transform:translate(0, -50%)}.input_check{display:flex;gap:12px 15px}.checkbox_wrapper{position:relative}.checkbox_wrapper input[type="checkbox"]{opacity:0 !important}.checkbox_wrapper._01{padding:10px 15px;border-radius:5px;border:1px solid #ccc}.checkbox_wrapper._01>.name{padding-left:10px}.checkbox_wrapper._01 input+.dummycheckbox{left:7.5px}.checkbox_wrapper._01._checked{background:#07C455}.checkbox_wrapper input[type="checkbox"]+.dummycheckbox{position:absolute;border-radius:5px;top:50%;left:7.5px;width:22px;height:22px;border:solid 1px #ccc;background:#FFFFFF;transform:translate(0, -50%)}.checkbox_wrapper input[type="checkbox"]+.dummycheckbox+.dummycheckbox_check{pointer-events:none;content:"";position:absolute;padding-left:3px;top:55%;left:10px;transform:translate(0, -50%);width:14px;height:14px;opacity:0}.checkbox_wrapper input[type="checkbox"]+.dummycheckbox+.dummycheckbox_check img{width:100%}.checkbox_wrapper input[type="checkbox"]:checked+.dummycheckbox+.dummycheckbox_check{opacity:1}body{background:#F8F8F8}@media print{#sidebar{display:none}body{background-color:#fff}body #print{padding:0 0 !important;width:973px !important}}body{display:block}body #print{font-size:14px;padding:60px 100px;width:1173px;position:absolute;top:0;left:0;background:#fff}body #print h1{font-size:30px;border-bottom:1px solid #000;padding-bottom:16px;margin-bottom:10px}body #print .column{margin:10px 0 20px;display:flex;justify-content:space-between}body #print .column .note{width:619px;display:grid;grid-auto-columns:1fr;grid-template-columns:1fr 1fr;grid-template-rows:50px 21px 21px;gap:17px 26px;grid-template-areas:"name name" "creation_date delivery_date" "place quotation_date"  "total_price total_price";margin-top:26px}body #print .column .note .name{grid-area:name;font-size:20px;padding-bottom:11px;border-bottom:2px solid #000}body #print .column .note .creation_date{grid-area:creation_date;display:flex}body #print .column .note .creation_date>span{border-bottom:1px solid #000;flex:1}body #print .column .note .delivery_date{grid-area:delivery_date;display:flex}body #print .column .note .delivery_date>span{border-bottom:1px solid #000;flex:1}body #print .column .note .place{grid-area:place;display:flex}body #print .column .note .place>span{border-bottom:1px solid #000;flex:1}body #print .column .note .quotation_date{grid-area:quotation_date;display:flex}body #print .column .note .quotation_date>span{border-bottom:1px solid #000;flex:1}body #print .column .note .total_price{grid-area:total_price}body #print .column .note .total_price .display{padding:10px 15px;display:grid;grid-auto-columns:1fr;grid-template-columns:88px 1fr 57px;gap:0 10px;border:1px solid #000}body #print .column .note .total_price .display dt{align-self:center;font-size:22px}body #print .column .note .total_price .display dd{font-size:12px;align-self:end}body #print .column .note .total_price .display dd.num{font-size:28px;text-align:right}body #print .column .description{width:287px}body #print .column .description .imgbox{width:100%}body #print .column .description .imgbox img{width:100%}body #print .column .description dl{font-size:12px}body #print .table{padding-bottom:30px}body #print .table ul.head,body #print .table ul.body li{display:grid;grid-auto-columns:1fr;grid-template-columns:72px 216px 228px 42px 42px 85px 85px 85px 100px;overflow:hidden;min-height:27px;max-height:45px;gap:2px 2px;grid-template-areas:"keys name model amount unit price discounted_price normal_price desc"}body #print .table ul.head>*,body #print .table ul.body li>*{width:100%;max-height:45px;overflow:hidden}body #print .table ul.head .keys,body #print .table ul.body li .keys{grid-area:keys}body #print .table ul.head .name,body #print .table ul.body li .name{grid-area:name}body #print .table ul.head .model,body #print .table ul.body li .model{grid-area:model}body #print .table ul.head .amount,body #print .table ul.body li .amount{grid-area:amount}body #print .table ul.head .unit,body #print .table ul.body li .unit{grid-area:unit}body #print .table ul.head .price,body #print .table ul.body li .price{grid-area:price}body #print .table ul.head .discounted_price,body #print .table ul.body li .discounted_price{grid-area:discounted_price}body #print .table ul.head .normal_price,body #print .table ul.body li .normal_price{grid-area:normal_price}body #print .table ul.head .desc,body #print .table ul.body li .desc{grid-area:desc}body #print .table ul.head{text-align:center;color:#ffffff;font-size:13px}body #print .table ul.head li{background:#333333;height:27px;line-height:27px}body #print .table ul.body li:nth-child(even)>*{color:#000000;font-size:14px;background:#F1F1F1}body #print .table ul.body li li{background:#F1F1F1}body #print .table ul.body li .keys{text-align:center;display:grid;align-items:center}body #print .table ul.body li .name{text-align:left;padding-left:3px;display:grid;align-items:center}body #print .table ul.body li .model{text-align:left;padding-left:3px;display:grid;align-items:center}body #print .table ul.body li .amount{text-align:center;display:grid;align-items:center}body #print .table ul.body li .unit{text-align:center;display:grid;align-items:center}body #print .table ul.body li .price{text-align:right;padding-right:3px;display:grid;align-items:center}body #print .table ul.body li .discounted_price{text-align:right;padding-right:3px;display:grid;align-items:center}body #print .table ul.body li .normal_price{text-align:right;padding-right:3px;display:grid;align-items:center}body #print .table ul.body li .desc{text-align:left;padding-left:3px;display:grid;align-items:center}body #print .infomation_area{display:flex;justify-content:space-between}body #print .infomation_area .stamp{width:65px}body #print .infomation_area .stamp>p{background:#F1F1F1;margin-bottom:2px}body #print .infomation_area .stamp>div{border:1px solid #000;width:65px;height:65px}body #print .infomation_area .price{width:620px;display:flex;flex-direction:column;gap:2px}body #print .infomation_area .price li dl{display:flex;align-items:center;justify-content:flex-end;gap:20px}body #print .infomation_area .price li dt{font-size:14px}body #print .infomation_area .price li dd{padding:4px 20px;font-size:15px;width:505px;background:#F1F1F1;text-align:right}body #print .infomation_area .price li.total dt{font-size:18px}body #print .infomation_area .price li.total dd{padding:10px 20px;font-size:18px;background:#fff;border:1px solid #000}