.__nuxt-error-page {
padding: 1rem;
background: #F7F8FB;
color: #47494E;
text-align: center;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
font-family: sans-serif;
font-weight: 100 !important;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
-webkit-font-smoothing: antialiased;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
.__nuxt-error-page .error {
max-width: 450px;
}
.__nuxt-error-page .title {
font-size: 1.5rem;
margin-top: 15px;
color: #47494E;
margin-bottom: 8px;
}
.__nuxt-error-page .description {
color: #7F828B;
line-height: 21px;
margin-bottom: 10px;
}
.__nuxt-error-page a {
color: #7F828B !important;
text-decoration: none;
}
.__nuxt-error-page .logo {
position: fixed;
left: 12px;
bottom: 12px;
}
*::-webkit-scrollbar,
div::-webkit-scrollbar,div::-webkit-scrollbar {display: none;-webkit-appearance: none;scrollbar-width: none;}
input::-webkit-input-placeholder{color:#ccc;}
root,*{
font-size:16px;
--main-color:#231815;
--light-color:#bababa;
--line-orange-300: #FFCFBF;
--line-orange-400: #FFA182;
--line-orange-500: #FF875C;
--line-orange-600: #FF6F36;
--line-orange-700: #FF5E1F;
--line-orange-800: #F24500;
--line-orange-900: #C43100;
--line-orange-600p: #E35F42;
--line-orange-500p: #F5765D;
--line-orange-400p: #FA9E7F;
--line-orange-300p: #FAD3C5;
--line-color : #06C755;
--line-delete : #FF334B;
--line-delete-dark : #C9162B;
--text-color : #666;
--main-color : rgba(40,159,148,1);
--main-color-light: rgba(40,159,148,0.1);
--main-color-light-16: #e7f5f4;
--main-color-dark : rgba(35,141,131,1);
-webkit-tap-highlight-color: rgba(40,159,148,0.2);
}
/* reset */
*{font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;}
abbr,address,article,aside,audio,b,blockquote,body,canvas,caption,cite,code,dd,del,details,dfn,div,dl,dt,em,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,p,pre,q,samp,section,small,span,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,ul,var,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:0 0}
body{line-height:1}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
nav ul{list-style:none}
blockquote,q{quotes:none}
blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}
a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:0 0}
ins{background-color:#ff9;color:#000;text-decoration:none}
mark{background-color:#ff9;color:#000;font-style:italic;font-weight:700}
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;border-top:1px solid #ccc;margin:1em 0;padding:0}
button,input,select,textarea{margin:0;padding:0;background:0 0;border:none;border-radius:0;outline:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;vertical-align:middle}
select::-ms-expand{display:none}
*,::after,::before{box-sizing:border-box;margin:0}
div,h1,h2,h3,h4,h5,h6,p,dl,dt,dd{color:var(--text-color);}
a,a:hover,a:focus{text-decoration: none;}
*,*::before,*::after {box-sizing: border-box;margin: 0;}
[main-color]{color:var(--main-color);}
/* helper */
[mt-05]{margin-top:.5em}
[mt-1]{margin-top:1em}
[mt-2]{margin-top:2em}
[mt-3]{margin-top:3em}
[mt-4]{margin-top:4em}
[mt-5]{margin-top:5em}
[ml-05]{margin-left:.5em}
[ml-1]{margin-left:1em}
[ml-2]{margin-left:2em}
[ml-3]{margin-left:3em}
[ml-4]{margin-left:4em}
[ml-5]{margin-left:5em}
[mb-05]{margin-bottom:.5em}
[mb-1]{margin-bottom:1em}
[mb-2]{margin-bottom:2em}
[mb-3]{margin-bottom:3em}
[mb-4]{margin-bottom:4em}
[mb-5]{margin-bottom:5em}
[mr-05]{margin-right:.5em}
[mr-1]{margin-right:1em}
[mr-2]{margin-right:2em}
[mr-3]{margin-right:3em}
[mr-4]{margin-right:4em}
[mr-5]{margin-right:5em}
[mt-05i]{margin-top:.5em!important}
[mt-1i]{margin-top:1em!important}
[mt-2i]{margin-top:2em!important}
[mt-3i]{margin-top:3em!important}
[mt-4i]{margin-top:4em!important}
[mt-5i]{margin-top:5em!important}
[ml-05i]{margin-left:.5em!important}
[ml-1i]{margin-left:1em!important}
[ml-2i]{margin-left:2em!important}
[ml-3i]{margin-left:3em!important}
[ml-4i]{margin-left:4em!important}
[ml-5i]{margin-left:5em!important}
[mb-05i]{margin-bottom:.5em!important}
[mb-1i]{margin-bottom:1em!important}
[mb-2i]{margin-bottom:2em!important}
[mb-3i]{margin-bottom:3em!important}
[mb-4i]{margin-bottom:4em!important}
[mb-5i]{margin-bottom:5em!important}
[mr-05i]{margin-right:.5em!important}
[mr-1i]{margin-right:1em!important}
[mr-2i]{margin-right:2em!important}
[mr-3i]{margin-right:3em!important}
[mr-4i]{margin-right:4em!important}
[mr-5i]{margin-right:5em!important}
[pt-05]{padding-top:.5em}
[pt-1]{padding-top:1em}
[pt-2]{padding-top:2em}
[pt-3]{padding-top:3em}
[pt-4]{padding-top:4em}
[pt-5]{padding-top:5em}
[pl-05]{padding-left:.5em}
[pl-1]{padding-left:1em}
[pl-2]{padding-left:2em}
[pl-3]{padding-left:3em}
[pl-4]{padding-left:4em}
[pl-5]{padding-left:5em}
[pb-05]{padding-bottom:.5em}
[pb-1]{padding-bottom:1em}
[pb-2]{padding-bottom:2em}
[pb-3]{padding-bottom:3em}
[pb-4]{padding-bottom:4em}
[pb-5]{padding-bottom:5em}
[pr-05]{padding-right:.5em}
[pr-1]{padding-right:1em}
[pr-2]{padding-right:2em}
[pr-3]{padding-right:3em}
[pr-4]{padding-right:4em}
[pr-5]{padding-right:5em}
[pt-05i]{padding-top:.5em!important}
[pt-1i]{padding-top:1em!important}
[pt-2i]{padding-top:2em!important}
[pt-3i]{padding-top:3em!important}
[pt-4i]{padding-top:4em!important}
[pt-5i]{padding-top:5em!important}
[pl-05i]{padding-left:.5em!important}
[pl-1i]{padding-left:1em!important}
[pl-2i]{padding-left:2em!important}
[pl-3i]{padding-left:3em!important}
[pl-4i]{padding-left:4em!important}
[pl-5i]{padding-left:5em!important}
[pb-05i]{padding-bottom:.5em!important}
[pb-1i]{padding-bottom:1em!important}
[pb-2i]{padding-bottom:2em!important}
[pb-3i]{padding-bottom:3em!important}
[pb-4i]{padding-bottom:4em!important}
[pb-5i]{padding-bottom:5em!important}
[pr-05i]{padding-right:.5em!important}
[pr-1i]{padding-right:1em!important}
[pr-2i]{padding-right:2em!important}
[pr-3i]{padding-right:3em!important}
[pr-4i]{padding-right:4em!important}
[pr-5i]{padding-right:5em!important}
/****************************************************************************************
*
* LINE BUTTONS
*
*
*
*
*
*
*
****************************************************************************************/
root,*{
--line : #06C755;
--linehover : rgba(0,0,0,0.1);
--lineclick : rgba(0,0,0,0.3);
--line-invalid : rgba(30,30,30,0.2);
}
[linebtn]{ background:var(--line);border-radius:0.3em;}
[linebtn][btn-invalid]{background:var(--line-invalid);}
[linebtn] [linebtn-overlay]{
font-size:min(3.6vmin , 15px);
color:#FFF;padding:0.8em 1em;border-radius:0.3em;letter-spacing:0.05em;
display: flex;justify-content: center;align-items: center;
}
[linebtn] [linebtn-overlay]::before{content:"";width:1em;height:1em;display:inline-block;margin-right:0.4em;
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDEuMTMgOTYuMzYiPjxkZWZzPjxzdHlsZT4uY2xzLTF7ZmlsbDojZmZmO308L3N0eWxlPjwvZGVmcz48ZyBpZD0i44Os44Kk44Ok44O8XzIiIGRhdGEtbmFtZT0i44Os44Kk44Ok44O8IDIiPjxnIGlkPSLjg6zjgqTjg6Tjg7xfMS0yIiBkYXRhLW5hbWU9IuODrOOCpOODpOODvCAxIj48cGF0aCBjbGFzcz0iY2xzLTEiIGQ9Ik01MC41NiwwQzIyLjY4LDAsMCwxOC40MSwwLDQxLDAsNjEuMzMsMTgsNzguMzEsNDIuMjgsODEuNTJjMS42NS4zNiwzLjg5LDEuMDksNC40NiwyLjVhMTAuMjIsMTAuMjIsMCwwLDEsLjE2LDQuNTdzLS41OSwzLjU2LS43Miw0LjMyYy0uMjEsMS4yOC0xLDUsNC4zOCwyLjczUzc5LjY4LDc4LjQ5LDkwLjI5LDY2LjI4YzcuMzMtOCwxMC44NC0xNi4xOCwxMC44NC0yNS4yNEMxMDEuMTMsMTguNDEsNzguNDUsMCw1MC41NiwwWk0zMi43Myw1My4xMmExLDEsMCwwLDEtMSwxSDE3LjU2YTEsMSwwLDAsMS0uNjctLjI3aDBzMCwwLDAsMGExLDEsMCwwLDEtLjI4LS42OHYtMjJhMSwxLDAsMCwxLDEtMWgzLjU1YTEsMSwwLDAsMSwxLDF2MTcuNWg5LjY0YTEsMSwwLDAsMSwxLDFabTguNTQsMGExLDEsMCwwLDEtMSwxSDM2Ljc0YTEsMSwwLDAsMS0xLTF2LTIyYTEsMSwwLDAsMSwxLTFoMy41NWExLDEsMCwwLDEsMSwxWm0yNC40MiwwYTEsMSwwLDAsMS0xLDFINjEuMTVhMS4wOSwxLjA5LDAsMCwxLS4yNSwwaDBsLS4wNywwaDBsMCwwLS4wNSwwLDAsMC0uMDcsMGgwYTEuMTgsMS4xOCwwLDAsMS0uMjYtLjI0TDUwLjI0LDQwVjUzLjEyYTEsMSwwLDAsMS0xLDFINDUuN2ExLDEsMCwwLDEtMS0xdi0yMmExLDEsMCwwLDEsMS0xaDMuODNsMCwwaDBsLjA2LDBoMGwwLDAsMCwwLDAsMGgwbDAsLjA1czAsMCwwLDBsLjA2LjA2aDBsLjA5LjFMNjAuMTcsNDQuMThWMzEuMDlhMSwxLDAsMCwxLDEtMUg2NC43YTEsMSwwLDAsMSwxLDFaTTg1LjI3LDM0LjY0YTEsMSwwLDAsMS0xLDFINzQuNjV2My43Mmg5LjY0YTEsMSwwLDAsMSwxLDF2My41NGExLDEsMCwwLDEtMSwxSDc0LjY1djMuNzJoOS42NGExLDEsMCwwLDEsMSwxdjMuNTVhMSwxLDAsMCwxLTEsMUg3MC4xMWExLDEsMCwwLDEtLjY3LS4yN2gwdjBhMSwxLDAsMCwxLS4yOC0uNjh2LTIyYS45NC45NCwwLDAsMSwuMjgtLjY4czAsMCwwLDAsMCwwLDAsMGExLDEsMCwwLDEsLjY4LS4yN0g4NC4yOWExLDEsMCwwLDEsMSwxWiIvPjwvZz48L2c+PC9zdmc+");background-repeat:no-repeat;background-position:50% 50%;}
[linebtn]:hover,[linebtn]:active{cursor:pointer;}
[linebtn]:hover [linebtn-overlay]{ background: var(--linehover); color:#FFF;}
[linebtn]:active [linebtn-overlay]{ background: var(--lineclick); color:#FFF;}
[linebtn][btn-invalid]:hover,
[linebtn][btn-invalid]:active{cursor:not-allowed;}
[linebtn][no-icon] [linebtn-overlay]::before{
content: none;
}
.el-button--danger span,[product-detail] [detail-header] > div:nth-of-type(1) > div.el-button--danger span{
color: #FFF !important;
}
/* Page Layout
****************************************************************************************/
[col-center],[center]{
display: flex;flex-flow:column nowrap;justify-content: center;align-items: center;
}
[row-center]{
display: flex;flex-flow:row nowrap;justify-content: center;align-items: center;
}
[fullheight]{
height: 100vh;
}
[bold]{font-weight:bold;}
[black]{color:#111;}
[split]{display: flex;flex-flow:row nowrap;justify-content: space-between;align-items: center;}
[right-fit]{
position: absolute;
right: 0;
}
[right-fit-1]{
position: absolute;
right: 1em;
}
[content-right]{
display: flex;
flex-flow:row nowrap;
justify-content: flex-end !important;
align-items: center;
}
.v-modal{
background: rgba(0,0,0,0.5) !important;
opacity : 0.9 !important;
}
[font-12]{
font-size: 12px;
}
[no-border]{
border: none !important;
}
[flex-column]{
display: flex;flex-flow:column nowrap !important;
}
/* MENU
****************************************************************************************/
.el-menu.el-menu--horizontal{
border:none;
background:var(--main-color);
padding:0.5em 0;
position: fixed;
top: 0;
width: 100%;
height: 50px !important;
z-index: 999;
}
.el-menu.el-menu--horizontal + *{
margin-top: 50px;
}
.el-menu--horizontal.el-menu > *{
margin-right:0.5em;
}
.el-menu--horizontal > .el-menu-item{
background:transparent;
max-height:32px;
line-height:22px;
color:#FFF;
display: flex;flex-flow:column nowrap;justify-content: center;align-items: center;
border-radius:0.5em;
border:none;
}
.el-menu--horizontal > .el-menu-item.is-active,
.el-menu--horizontal > .el-menu-item:hover,
.el-menu--horizontal > .el-menu-item:focus,
.el-menu--horizontal > .el-menu-item:active,
.el-menu--horizontal>.el-menu-item:not(.is-disabled):focus,
.el-menu--horizontal>.el-menu-item:not(.is-disabled):hover{
background:rgba(0,0,0,0.15);
color:#FFF;
border:none !important;
}
.el-menu-item[home-link]{
width:110px;
height:33px;
line-height:33px;
margin-right:0;
}
.el-menu--horizontal > .el-menu-item.is-active[home-link],
.el-menu--horizontal>.el-menu-item[home-link]:hover,
.el-menu--horizontal>.el-menu-item[home-link]:active,
.el-menu--horizontal>.el-menu-item[home-link]:focus{
background:transparent !important;
}
.el-menu--horizontal>.el-submenu .el-submenu__title{
height:auto;
line-height:22px;
color:#FFF !important;
padding:0.4em 1em;
border-radius:0.5em;
border:none;
}
.el-menu--horizontal>.el-submenu .el-submenu__title:hover,
.el-menu--horizontal>.el-submenu .el-submenu__title:focus,
.el-menu--horizontal>.el-submenu .el-submenu__title:active{
background:rgba(0,0,0,0.15);
color:#FFF;
border:none !important;
}
.el-menu--horizontal>.el-submenu.is-active .el-submenu__title{
border:none !important;
background:rgba(0,0,0,0.15);
color:#FFF;
}
.el-menu--horizontal>.el-submenu .el-submenu__title:hover *,
.el-menu--horizontal>.el-submenu .el-submenu__title:focus *,
.el-menu--horizontal>.el-submenu .el-submenu__title:active *{
color:#FFF;
}
.el-menu--horizontal>.el-submenu .el-submenu__title i.el-submenu__icon-arrow{
display:none;
}
[fixed-right]{
position:absolute;
right:1em;
top:7px;
}
[circle-menu]{
border:1px solid #FFF;
border-radius:16px;
display:flex;
min-height:25px;
min-width:22px;
display: flex;flex-flow:column nowrap;justify-content: center;align-items: center;
}
.el-submenu [class^=el-icon-]{
margin:0;
}
/* pop up menu */
.el-menu.el-menu--popup{
background:var(--main-color);
padding:5px;
top:7px;
border-radius:0.5em;
}
.el-menu.el-menu--popup .el-menu-item{
background:var(--main-color);
color:#FFF;
border-radius:0.5em;
}
.el-menu.el-menu--popup .el-menu-item:not(:last-child){
margin-bottom:3px;
}
.el-menu.el-menu--popup .el-menu-item.is-active{
color:#FFF;
background:var(--main-color-dark);
}
.el-menu.el-menu--popup .el-menu-item:hover,
.el-menu.el-menu--popup .el-menu-item:focus,
.el-menu.el-menu--popup .el-menu-item:active{
color:#FFF;
background:var(--main-color-dark);
}
/* /account/
****************************************************************************************/
[admin-list]{
display: flex;flex-flow:column nowrap;
}
[admin-listheader]{
display: flex;flex-flow:row nowrap;justify-content: flex-start; align-items:stretch;
border-bottom: 1px solid #CCC;
width: 100%;
padding: 1em;
}
[admin-listheader] [header-name],[admin-detail] [detail-name]{
font-weight: 600;
font-size: 13px;
width: 12em;
display: flex;flex-flow:column nowrap;justify-content: center;
}
[admin-listheader] [header-level],[admin-detail] [detail-level]{
font-weight: 600;
font-size: 13px;
width: 14em;
display: flex;flex-flow:column nowrap;justify-content: center;
}
[admin-listheader] [header-switch],[admin-detail] [detail-switch]{
font-weight: 600;
font-size: 13px;
width: 10em;
display: flex;flex-flow:column nowrap;justify-content: center;
}
[admin-listheader] [header-notice],[admin-detail] [detail-notice]{
font-weight: 600;
font-size: 13px;
width: 10em;
display: flex;flex-flow:column nowrap;justify-content: center;
}
[admin-list] [admin-detail]{
display: flex;flex-flow:row nowrap;justify-content: flex-start; align-items:stretch;
border-bottom: 1px dashed var(--main-color);
width: 100%;
padding: 1em;
}
[admin-list] [admin-detail] > *{
padding-left: 1em;
padding-right: 1em;
}
[admin-list] [admin-detail] [detail-level] span{
font-size: 13px;
color: #FFF;
padding: 0.4em 1em;
border-radius: 0.4em;
}
[admin-list] [admin-detail] [detail-level] span.operator{
background: #40B6FF;
}
[admin-list] [admin-detail] [detail-level] span.manager{
background: #0093C4;
}
[admin-list] [admin-detail] [detail-level] span.admin{
background: #084F6B;
}
[admin-list] [admin-detail] [detail-level] span.developer{
background: #F24500;
}
[select-level]{
border-bottom: 1px solid #CCC;
padding: 0.5em;
max-width: 8em;
}
/* /order/
****************************************************************************************/
[order-header]{
font-size: 14px;
font-weight: bold;
background: var(--main-color-light);
margin-bottom: 1em;
}
[list-header]{
display: flex;flex-flow:row nowrap;justify-content: flex-start; align-items:stretch;
}
[order-list]{
padding-left: 1em;
padding-right: 1em;
padding-bottom: 5em;
}
[order-list] dl{
display: flex;flex-flow:row nowrap;justify-content: flex-start; align-items:stretch;
padding-top: 0.7em;
padding-bottom: 0.7em;
border-bottom: 1px dashed var(--main-color);
}
[order-list] div.nextday{
background: rgba(255,94,31,0.05);
}
[order-list] div.today{
background: rgba(40,159,148,0.05);
}
[order-prices]{
padding: 1em 0.5em 0.5em 0.5em;
border-top: 1px dashed var(--main-color);
display: flex;flex-flow:row nowrap;justify-content: flex-end; align-items:stretch;
}
[order-list] dl dd [order-prices] span{
font-size: 12px;
letter-spacing: 0.1em;
color: #999;
}
[list-header] dt,[order-list] dl dd{
font-size: 15px;
padding: 0.5em;
font-weight: bold;
}
[list-header] dt:nth-of-type(2),[order-list] dl dd:nth-of-type(2){
width: 6em;
min-width: 6em;
}
[list-header] dt:nth-of-type(3),[order-list] dl dd:nth-of-type(3){
width: 8em;
min-width: 8em;
}
[list-header] dt:nth-of-type(4),[order-list] dl dd:nth-of-type(4){
width: 8em;
min-width: 8em;
}
[list-header] dt:nth-of-type(5),[order-list] dl dd:nth-of-type(5){
width: 13em;
min-width: 13em;
}
[order-list] dl dd:nth-of-type(5) span{
display: block;
line-height: 1.4em;
}
[order-list] dl dd:nth-of-type(5) span:nth-of-type(1){
font-size: 14px;
font-weight: 600;
margin-bottom: 0.3em;
}
[list-header] dt:nth-of-type(6),[order-list] dl dd:nth-of-type(6){
width: 100%;
}
[list-header] dt:nth-of-type(7),[order-list] dl dd:nth-of-type(7){
width: 8em;
min-width: 8em;
display: flex;flex-flow:row nowrap;justify-content: center; align-items:center;
}
[order-list] dl dd:nth-of-type(7) [linebtn] [linebtn-overlay]{
font-size: 11px;
}
[order-list] dl dd span{
font-size: 12px;
}
[order-list] dl dd span.reserve{
font-weight: bold;
color: #F22;
margin-top: 0.3em;
line-height: 1.3em;
text-align: center;
}
[deliv-type] span{
padding: 0.3em 1em;
font-size: 12px;
border-radius: 0.4em;
display: flex;flex-flow:row nowrap;justify-content: center; align-items:center;
}
[deliv-type] span.today{
background: var(--main-color);
color: #FFF;
}
[deliv-type] span.nextday{
background: var(--line-orange-700);
color: #FFF;
}
[item-detail]{
display: flex;flex-flow:row nowrap;justify-content: flex-start; align-items:center;
padding: 0.6em 0;
border-bottom: 1px solid #efefef;
width: 100%;
position: relative;
}
[item-detail] > *:nth-of-type(1){
width: 4em;
}
[tag-text]{
background: var(--main-color);
font-size: 10px;
color: #FFF;
padding: 0.3em 0.4em;
border-radius: 0.4em;
display: flex;flex-flow:row nowrap;justify-content: center; align-items:center;
width: 4em;
}
[tag-cold]{
background: #409EFF;
font-size: 10px;
color: #FFF;
padding: 0.3em 0.4em;
border-radius: 0.4em;
display: inline-flex;flex-flow:column nowrap;justify-content: center; align-items:center;
width: 3em;
margin-right: 0.4em;
}
[tag-normal]{
background: #d89e2b;
font-size: 10px;
color: #FFF;
padding: 0.3em 0.4em;
border-radius: 0.4em;
display: inline-flex;flex-flow:column nowrap;justify-content: center; align-items:center;
width: 3em;
margin-right: 0.4em;
}
[item-detail] > *:nth-of-type(2){
padding-right: 3.5em;
}
[item-detail] > *:nth-of-type(3){
width: 3em;
position: absolute;
right: 0;
}
[order-status]{
font-size: 12px;
font-weight: bold;
letter-spacing: 0.05em;
}
[order-status].create {color: #E5172F;}
[order-status].wait {color: #AF36C7;
}
[order-status].complete{color: #15BD66;
}
[order-status].cancel {color: #C1D8DE;}
/* ステータス変更ボックス */
[status-change],[status-changebox]{
display: flex;flex-flow:row nowrap;justify-content: flex-start; align-items:center;
}
[status-changebox]{padding-left: 2em;}
[status-changebox] span{font-size: 13px;display: inline-block;padding:0 0.4em;}
[select-box]{display: block;position: relative;}
[select-box] select{position: relative;}
[status-changebox] select{padding: 0.2em 3em 0.2em 0.5em;
border-bottom: 1px solid var(--main-color);font-size: 13px;color: var(--main-color);font-weight: bold;letter-spacing: 0.01em;}
[status-changebox] select[disabled]{color: #CCC;}
[select-box]::after{
content: "";
display:block;
width:7px;
height:7px;
position:absolute;
right:10%;
top:35%;
border-bottom:var(--main-color) 2px solid;
border-right:var(--main-color) 2px solid;
transform:rotate(45deg)translateY(-30%);
}
/* print
****************************************************************************************/
[page-break] {
page-break-after: always;
-moz-column-break-after: page;
break-after: page;
}
/* setting form common
****************************************************************************************/
[app-content]{
position: relative;
}
[form-header]{
font-size: 14px;
font-weight: bold;
background: var(--main-color-light-16);
margin-bottom: 1em;
position: sticky;
top: 50px;
z-index: 5;
}
[form-header] input,[form-header] select{
border: 1px solid #ccc;
padding: 0.3em 0.5em;
font-size: 14px;
border-radius: 0.3em;
background: #FFF;
min-width: 18em;
margin-left: 0.5em;
margin-right: 0.5em;
}
[headerform-component]{
display: flex;flex-flow:row nowrap;justify-content: flex-start; align-items:center;
padding-left: 2em;
}
[headerform-component] label{
color: var(--main-color);
font-size: 12px;
}
[form-header] dl{
width: calc(100% - 8em);
display: flex;flex-flow:row nowrap;justify-content: flex-start; align-items:center;
}
[form-header] dl dt{
width: 100%;
color: var(--main-color);
}
/* area setting form
****************************************************************************************/
[area-list]{
width: 100%;
display: flex;flex-flow:column nowrap;justify-content: flex-start; align-items:center;
}
[area-list] > div{
width: 100%;
display: flex;flex-flow:row nowrap;justify-content: flex-start; align-items:stretch;
}
[area-list] dl{
width: 100%;
display: flex;flex-flow:row nowrap;justify-content: center; align-items:stretch;
padding: 0.5em;
border-right: 1px dashed var(--main-color);
}
[area-list] dl dd{
width: 100%;
font-size: 14px;
font-weight: 600;
}
[area-list] dl dd[position-center] > *{
display: flex;flex-flow:column nowrap;justify-content: center; align-items:center;
width: 100%;
}
[area-list] dl dd[area-data]{
display: flex;flex-flow:column nowrap;justify-content: center; align-items: flex-start;
}
[area-list] dl dd[area-data] > div{
color: var(--main-color);
line-height: 1.8em;
}
[area-editor]{
padding: 1em 0;
border-bottom: 1px solid var(--main-color);
}
[form-set] input,[form-set] select,[form-set] textarea{
border: 1px solid #ccc;
padding: 0.3em 0.6em;
font-size: 16px;
border-radius: 0.4em;
background: #FFF;
}
[form-set] label:not(.el-checkbox-button){
font-size: 12px;
font-weight: bold;
padding: 0 0 0.3em 0.2em;
color: var(--main-color);
display: flex;
flex-flow: row wrap;
justify-content: flex-start;
align-items: center;
width: 100%;
line-height: 1.4em;
}
.el-select-dropdown__empty{
display:none;
}
.el-select-dropdown.el-popper.is-multiple{
display:none;
}
/* product setting form
****************************************************************************************/
[product-list]{
width: 100%;
}
[product-detail]{
width: 100%;
display: flex;flex-flow:column nowrap;justify-content: flex-start; align-items:center;
padding: 1em;
border: 1px solid var(--main-color);
border-radius: 0.5em;
margin-bottom: 1em;
padding: 1em;
}
[product-detail]:hover{
background: var(--main-color-light);
}
[product-detail] > *{
width: 100%;
display: flex;flex-flow:row nowrap;justify-content: space-between; align-items:center;
}
[product-thumblist] > *{
display: flex;flex-flow:row wrap;justify-content: flex-start; align-items:stretch;
width:100%;
}
[product-thumbnail]{
width: 13.6%;
padding: 1em;
border: 1px solid var(--main-color);
border-radius: 0.5em;
margin-bottom: 1em;
margin-left:0.2em;
margin-right:0.2em;
padding: 1em;
}
[product-thumbnail]:hover{
background: var(--main-color-light);
cursor: grab;
}
[product-thumbnail] > *{
width:100%;
}
[product-thumbnail] img[product-thumb]{
width:100%;
margin-bottom:0.7em;
}
[form-set] [product-thumbnail] label{
padding:0;
}
[form-set] [product-thumbnail] label[order-num]{
background:var(--main-color);
color:#FFF;
padding:0.2em;
display:inline;
}
[form-set] [product-thumbnail] label + span{
font-weight:600;
font-size:13px;
display: block;
padding-top:0.3em;
}
[product-detail] [detail-header]{
border-bottom: 1px dashed var(--main-color);
padding: 0 0 1em 0;
}
[product-detail] [new-category]{
border-bottom: 1px dashed var(--main-color);
padding: 1em;
display: flex;flex-flow:row nowrap;justify-content: flex-start; align-items:center;
}
[product-detail] [detail-header] > div:nth-of-type(1){
display: flex;flex-flow:row nowrap;justify-content: flex-start; align-items:center;
}
[product-detail] [detail-header] > div:nth-of-type(1) > div{
padding: 0 1em;
}
[product-detail] [detail-header] > div:nth-of-type(1) > div label{
font-size: 12px;
font-weight: bold;
padding: 0 0 0.3em 0.2em;
color: var(--main-color);
display: flex;flex-flow:row wrap;justify-content: flex-start; align-items:center;
width: 100%;
line-height: 1.4em;
}
[product-detail] [detail-header] > div:nth-of-type(1) > div span{
color: #000;
font-weight: bold;
}
[product-detail] [detail-switch]{
padding: 1em 0 1em 0;
width: 100%;
border-bottom : 1px dashed var(--main-color);
}
[product-detail] [detail-switch][detail-flg]{
border: none;
padding-bottom: 0;
}
[product-detail] [detail-switch] > div:nth-of-type(1){
width: 100%;
}
[product-detail] [detail-switch] > div:nth-of-type(2){
display: flex;flex-flow:row wrap;justify-content: center; align-items:center;
min-width: 6em;
}
[product-detail] dl{
display: flex;flex-flow:row nowrap;justify-content: flex-start; align-items:center;
width: 100%;
}
[product-detail] dl dd{
display: flex;flex-flow:column nowrap;justify-content: flex-start; align-items:flex-start;
}
[product-detail] [detail-switch] dl dd{
width: 20%;
border-right: 1px solid var(--main-color);
}
[product-detail] dl dd label{
font-size: 12px;
font-weight: bold;
padding: 0 0 0.3em 0.2em;
color: var(--main-color);
display: flex;flex-flow:row wrap;justify-content: center; align-items:center;
width: 100%;
line-height: 1.4em;
}
[product-detail] dl dd span{
font-size: 15px;
font-weight: 600;
}
[product-detail] dl dd .el-switch__label.el-switch__label--left span,
[product-detail] dl dd .el-switch__label.el-switch__label--right span{
font-size: 13px;
}
[product-detail] [cool-switch],
[product-detail] [bool-switch],
[product-detail] [flg-switch],
[product-detail] [flg-limit]{
width: 100%;
display: flex;flex-flow:row wrap;justify-content: center; align-items:center;
}
[cool-switch] .el-switch__label.el-switch__label--left,
[cool-switch] .el-switch__label.el-switch__label--right,
[bool-switch] .el-switch__label.el-switch__label--left,
[bool-switch] .el-switch__label.el-switch__label--right,
[flg-switch] .el-switch__label.el-switch__label--left,
[flg-switch] .el-switch__label.el-switch__label--right{
color: #999;
}
[cool-switch] .el-switch__label.el-switch__label--left.is-active{
color : #ffcf39;
}
[cool-switch] .el-switch__label.el-switch__label--right.is-active{
color : #409eff;
}
[bool-switch] .el-switch__label.el-switch__label--left.is-active{
color : #ff4949;
}
[bool-switch] .el-switch__label.el-switch__label--right.is-active{
color : #13ce66;
}
[flg-switch] .el-switch__label.el-switch__label--left.is-active{
color : #999;
}
[flg-switch] .el-switch__label.el-switch__label--right.is-active{
color : #13ce66;
}
[product-detail] [flg-limit] span{
font-size: 12px;
display: inline-block;
padding: 0 0.5em;
}
/* product edit */
[product-detail] dl[productedit-form]{
display: flex;flex-flow:row wrap;justify-content: flex-start; align-items:center;
padding: 1em 0.5em;
border-bottom: 1px solid var(--main-color-light);
}
[product-detail] dl[productedit-form] dd{
padding: 1em 0;
}
[product-detail] dl[productedit-form] dd label{
font-size: 12px;
font-weight: bold;
padding: 0 0 0.3em 0.2em;
color: var(--main-color);
display: flex;flex-flow:row wrap;justify-content: flex-start; align-items:center;
width: 100%;
line-height: 1.4em;
}
[product-detail] dl[productedit-form] dd span{
font-size: 15px;
font-weight: 600;
}
/* スピンビックスを非表示に */
input[type="number"][no-spin]::-webkit-inner-spin-button,
input[type="number"][no-spin]::-webkit-outer-spin-button {
-webkit-appearance: none;
margin: 0;
-moz-appearance:textfield;
}
.el-message-box__message p{
margin: 0;
line-height: 1.3em;
font-size: 14px;
font-weight: bold;
padding: 0.3em 0;
text-align: justify;
}
.el-message-box{
width: 80%;
max-width: 600px;
}
[product-detail] dl[productedit-form] dd label[error-text]{
color: var(--line-orange-800);
font-size: 10px;
margin-top: 0.3em;
}
/* product-thumbnail */
[product-thumb]:hover{
cursor: pointer;
}
/* suppliers
****************************************************************************************/
[supplier-dialog] .el-dialog__body{
padding-top: 0;
}
[supplier-qr]{
display: flex;flex-flow:column nowrap;justify-content: center; align-items:center;
padding-bottom: 2em;
border-bottom: 1px dashed var(--main-color);
}
[supplier-qr] span{
font-weight: 600;
}
[supplier-qr] img{
width: 200px;
height: 200px;
transition: all 0.2s ease-out;
}
[supplier-qr] img:hover{
cursor: pointer;
transform: scale(1.05);
transition: all 0.2s ease-out;
}
/* supplier-user */
[supplier-user]{
width: 100%;
padding: 1em;
border-bottom: 1px dashed var(--main-color);
}
[supplier-user] dl{
display: flex;flex-flow:row nowrap;justify-content: space-between; align-items:center;
}
[supplier-user] dl dd{
width: 100%;
}
[supplier-user] dl dd [supplieruser-name]{
width: 100%;
display: flex;flex-flow:column nowrap;justify-content: center; align-items:center;
font-weight: 600;
}
/* user ( customers )
****************************************************************************************/
[customers-list]{
padding-bottom:5em;
}
[customers-list] [customers-header]{
display: flex; flex-flow:row nowrap; justify-content: space-between; align-items: center;
border-bottom:1px solid var(--main-color);
position:sticky;
padding-top:1em;
top:100px;
background:#FFF;
z-index: 1;
}
[customers-list] [customers-header] > *{
color:var(--main-color);
font-size:14px;
font-weight:600;
padding:0.5em;
}
[customers-list] [customers-detail]{
display: flex; flex-flow:row nowrap; justify-content: space-between; align-items: center;
border-bottom:1px solid #ccc;
}
[customers-list] [customers-detail]:nth-of-type(odd){
background:#f5f5f5;
}
[customers-list] [customers-detail] > *{
font-size:14px;
font-weight:500;
padding:1.5em 0.5em;
}
[customers-list] [customers-header] > div:nth-of-type(1),
[customers-list] [customers-detail] > div:nth-of-type(1){
width:30%;
display: flex; flex-flow:row nowrap; justify-content: flex-start; align-items:center;
}
[customers-list] [customers-header] > div:nth-of-type(2),
[customers-list] [customers-detail] > div:nth-of-type(2){
width:10%;
display: flex; flex-flow:row nowrap; justify-content: center; align-items:center;
}
[customers-list] [customers-header] > div:nth-of-type(3),
[customers-list] [customers-detail] > div:nth-of-type(3){
width:15%;
display: flex; flex-flow:row nowrap; justify-content: center; align-items:center;
}
[customers-list] [customers-header] > div:nth-of-type(4),
[customers-list] [customers-detail] > div:nth-of-type(4){
width:10%;
display: flex; flex-flow:row nowrap; justify-content: flex-start; align-items:center;
}
[customers-list] [customers-header] > div:nth-of-type(5),
[customers-list] [customers-detail] > div:nth-of-type(5){
width:10%;
display: flex; flex-flow:row nowrap; justify-content: flex-start; align-items:center;
}
[customers-list] [customers-header] > div:nth-of-type(6),
[customers-list] [customers-detail] > div:nth-of-type(6){
width:15%;
display: flex; flex-flow:row nowrap; justify-content: center; align-items:center;
}
/* shop setting form
****************************************************************************************/
[delete-icon]{
color:#F00;
}
[delete-icon]:hover{
cursor: pointer;
}
.el-input.is-disabled .el-input__inner[disabled-caption]{
color:var(--main-color);
background-color:#FFF;
border-color : #FFF;
}
[fullscreenloading]{left:0;top: 0;position:fixed;width:100vw;max-width: 100vw;min-width: 100vw;height:100vh;background:rgba(255,255,255,.8);z-index:9999;display:flex;flex-flow:column nowrap;justify-content:center;align-items:center}[fullscreenloading] span{margin-bottom:1em}[fullscreenloading] i{font-size:2em}.pixel-spinner, .pixel-spinner * {
box-sizing: border-box;
}.pixel-spinner {
height: 40vmin;
width: 40vmin;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
}.pixel-spinner img{
animation: pixel-spinner-animation 1500ms linear infinite;
height: 40vmin;
width: 40vmin;
max-height: 300px;
max-width: 300px;
}@keyframes pixel-spinner-animation {
/*
0% {
transform: scale(1.2) rotate(0deg);
}
50% {
transform: scale(1.0) rotate(180deg);
}
*/
100% {
transform: rotate(360deg);
}
}[loading-text]{
font-size: 14px;
margin-top: 2em;
font-weight: 600;
}
[btn-box][data-v-c841ce06]{
max-width:400px;
width:400px;
margin-top:4em;
}
[send-message-content][data-v-d1bb8434]{width:100%}[content-area-header][data-v-d1bb8434]{position:sticky;top:0;background:#fff;padding:1em 2em;display:flex;flex-flow:row nowrap;justify-content:space-between;align-items:center;width:100%;z-index:8;border-bottom:1px solid #ccc}[content-area][data-v-d1bb8434]{padding:2em;display:flex;flex-flow:row nowrap;justify-content:flex-start;align-items:flex-start}[content-left][data-v-d1bb8434]{width:calc(100% - (370px + 2em));padding-bottom:10em}[content-right][data-v-d1bb8434]{width:calc(370px + 2em);display:flex;flex-flow:column nowrap;justify-content:flex-start;align-items:flex-end;position:fixed;bottom:0;right:1em}[setting-area][data-v-d1bb8434]{margin-bottom:3em}[send-setting][data-v-d1bb8434]{display:flex;flex-flow:row nowrap;justify-content:space-between;align-items:stretch}[destination-group][data-v-d1bb8434],[senddate-group][data-v-d1bb8434]{display:inline-flex;flex-flow:row nowrap;justify-content:flex-start;align-items:center}[destination-group] label[data-v-d1bb8434],[senddate-group] label[data-v-d1bb8434]{padding:0}[senddate-group] .el-radio-button__inner[data-v-d1bb8434]:hover{color:#60b337}[senddate-group] .el-radio-button__orig-radio:checked+.el-radio-button__inner[data-v-d1bb8434]{background-color:#60b337;border-color:#60b337;box-shadow:none}[senddate-group] .el-radio-button__orig-radio:checked+.el-radio-button__inner[data-v-d1bb8434]:hover{color:#fff}[senddate-group] *[data-v-d1bb8434],[senddate-group][data-v-d1bb8434] :focus{outline:0;box-shadow:none}[msg-reg-box][data-v-d1bb8434]{border:1px solid #ccc}[msg-reg-box][data-v-d1bb8434]:not(:nth-of-type(1)){margin-top:1em}[msg-reg-header][data-v-d1bb8434]{width:100%;padding:.8em 1em;background:rgba(0,0,0,.03);border-bottom:1px solid #ccc;display:flex;flex-flow:row nowrap;justify-content:space-between;align-items:center}[msg-reg-select][data-v-d1bb8434]{display:flex;flex-flow:row nowrap;justify-content:flex-start;align-items:center}[msg-reg-select]>span[data-v-d1bb8434]{padding:.5em 1em}[msg-reg-select]>span.selected[data-v-d1bb8434]{color:#212529;background-color:#dae0e5;border-color:#d3d9df}[msg-reg-select]>span[data-v-d1bb8434]:hover{background-color:#e7ebef}[msg-reg-select]>span i[data-v-d1bb8434]{transform:scale(1.3)}[msg-reg-select]>span[data-v-d1bb8434]:hover{cursor:pointer}[msg-reg-position][data-v-d1bb8434]{display:inline-flex}[msg-reg-position] i[data-v-d1bb8434]{transform:scale(1.5);margin-left:1.5em}[msg-reg-position] i[data-v-d1bb8434]:hover{cursor:pointer}[date-input][data-v-d1bb8434]{display:inline-flex;flex-flow:row nowrap;justify-content:flex-start;align-items:center;min-width:300px;padding-left:1em}[date-input] .el-date-editor.el-input[data-v-d1bb8434]{min-width:140px}[file-upload-box][data-v-d1bb8434]{border:1px solid #ccc}[small-text][data-v-d1bb8434]{font-size:.75em;margin-top:.5em}[file-upload] i[data-v-d1bb8434]{transform:scale(2);margin:1em}[file-upload][data-v-d1bb8434]{display:flex;flex-flow:column nowrap;justify-content:center;align-items:center}[file-upload] span[data-v-d1bb8434]{color:#00b900}[file-upload] span[data-v-d1bb8434]:hover{color:#009800;cursor:pointer}[file-confirm] img[data-v-d1bb8434]{width:300px}[msg-edit-box][data-v-d1bb8434]{padding:1em}[preview-area][data-v-d1bb8434]{width:370px;background:#666f86;height:calc(100vh - 120px);overflow-y:scroll;transform:scale(.9);transform-origin:bottom center}[preview-area] h1[data-v-d1bb8434]{padding:7px;background:#353a40;color:#fff;font-size:min(4vmin ,16px);font-weight:600}[preview-area] [preview-inner][data-v-d1bb8434]{padding:20px 20px 50px 20px}
[fullscreenloading]{
left:0;top: 0;position:fixed;width:100vw;max-width: 100vw;min-width: 100vw;height:100vh;
background:rgba(255,255,255,.8);
z-index:9999;
display:flex;flex-flow:column nowrap;justify-content:center;align-items:center;
}
[fullscreenloading] span{margin-bottom:1em}
[fullscreenloading] i{font-size:2em}
[loading-text]{
font-size: 14px;
margin-top: 2em;
font-weight: 600;
}
.half-circle-spinner, .half-circle-spinner * {
box-sizing: border-box;
}
.half-circle-spinner {
width: 60px;
height: 60px;
border-radius: 100%;
position: relative;
}
.half-circle-spinner .circle {
content: "";
position: absolute;
width: 100%;
height: 100%;
border-radius: 100%;
border: calc(60px / 10) solid transparent;
}
.half-circle-spinner .circle.circle-1 {
border-top-color: #ff1d5e;
animation: half-circle-spinner-animation 1s infinite;
}
.half-circle-spinner .circle.circle-2 {
border-bottom-color: #ff1d5e;
animation: half-circle-spinner-animation 1s infinite alternate;
}
@keyframes half-circle-spinner-animation {
0% {
transform: rotate(0deg);
}
100%{
transform: rotate(360deg);
}
}
[image-uploader][data-v-eaa8080a]{ display: flex; flex-flow:column nowrap;justify-content: center; align-items: center;
padding:0;border:1px dashed #ccc;width: auto !important;margin:0.5em;
}
[image-uploader][data-v-eaa8080a]:hover{background:#efefef;cursor:pointer;}
[image-uploader] i[data-v-eaa8080a]{font-size:20px;margin-right:0.4em;}
label[image-uploader] > span[data-v-eaa8080a]{font-size: min(3.2vmin , 12px);font-weight: bold;line-height:20px;display:inline-block;margin-right:1em;}
[file-confirm][data-v-eaa8080a]{width:100%;height:auto;max-width:150px; display: flex; flex-flow:column nowrap;justify-content: center; align-items: center;
border:1px dashed #efefef;
padding:5px;
}
[file-confirm] img[data-v-eaa8080a]{width:100%;max-width:100%;background-color: #d7d7d7;opacity: 1;-o-object-fit:cover;object-fit:cover;}
[minicaption][data-v-eaa8080a]{font-size:11px;color:#666;padding:0 0.4em 0.6em 0.4em;}