@charset "UTF-8";

/*----------------------------------------
	Material Colors
----------------------------------------*/

@import url(https://fonts.googleapis.com/earlyaccess/notosansjp.css);

@import url(https://fonts.googleapis.com/css?family=Noto+Serif);

@import url(https://use.fontawesome.com/releases/v6.4.2/css/all.css);

.color-red-50 {
  color: #ffebee;
}

.bgColor-red-50 {
  background-color: #ffebee;
}

.color-red-100 {
  color: #ffcdd2;
}

.bgColor-red-100 {
  background-color: #ffcdd2;
}

.color-red-200 {
  color: #ef9a9a;
}

.bgColor-red-200 {
  background-color: #ef9a9a;
}

.color-red-300 {
  color: #e57373;
}

.bgColor-red-300 {
  background-color: #e57373;
}

.color-red-400 {
  color: #ef5350;
}

.bgColor-red-400 {
  background-color: #ef5350;
}

.color-red-500 {
  color: #f44336;
}

.bgColor-red-500 {
  background-color: #f44336;
}

.color-red-600 {
  color: #e53935;
}

.bgColor-red-600 {
  background-color: #e53935;
}

.color-red-700 {
  color: #d32f2f;
}

.bgColor-red-700 {
  background-color: #d32f2f;
}

.color-red-800 {
  color: #c62828;
}

.bgColor-red-800 {
  background-color: #c62828;
}

.color-red-900 {
  color: #b71c1c;
}

.bgColor-red-900 {
  background-color: #b71c1c;
}

.color-red-a100 {
  color: #ff8a80;
}

.bgColor-red-a100 {
  background-color: #ff8a80;
}

.color-red-a200 {
  color: #ff5252;
}

.bgColor-red-a200 {
  background-color: #ff5252;
}

.color-red-a400 {
  color: #ff1744;
}

.bgColor-red-a400 {
  background-color: #ff1744;
}

.color-red-a700 {
  color: #d50000;
}

.bgColor-red-a700 {
  background-color: #d50000;
}

.color-pink-50 {
  color: #fce4ec;
}

.bgColor-pink-50 {
  background-color: #fce4ec;
}

.color-pink-100 {
  color: #f8bbd0;
}

.bgColor-pink-100 {
  background-color: #f8bbd0;
}

.color-pink-200 {
  color: #f48fb1;
}

.bgColor-pink-200 {
  background-color: #f48fb1;
}

.color-pink-300 {
  color: #f06292;
}

.bgColor-pink-300 {
  background-color: #f06292;
}

.color-pink-400 {
  color: #ec407a;
}

.bgColor-pink-400 {
  background-color: #ec407a;
}

.color-pink-500 {
  color: #e91e63;
}

.bgColor-pink-500 {
  background-color: #e91e63;
}

.color-pink-600 {
  color: #d81b60;
}

.bgColor-pink-600 {
  background-color: #d81b60;
}

.color-pink-700 {
  color: #c2185b;
}

.bgColor-pink-700 {
  background-color: #c2185b;
}

.color-pink-800 {
  color: #ad1457;
}

.bgColor-pink-800 {
  background-color: #ad1457;
}

.color-pink-900 {
  color: #880e4f;
}

.bgColor-pink-900 {
  background-color: #880e4f;
}

.color-pink-a100 {
  color: #ff80ab;
}

.bgColor-pink-a100 {
  background-color: #ff80ab;
}

.color-pink-a200 {
  color: #ff4081;
}

.bgColor-pink-a200 {
  background-color: #ff4081;
}

.color-pink-a400 {
  color: #f50057;
}

.bgColor-pink-a400 {
  background-color: #f50057;
}

.color-pink-a700 {
  color: #c51162;
}

.bgColor-pink-a700 {
  background-color: #c51162;
}

.color-purple-50 {
  color: #f3e5f5;
}

.bgColor-purple-50 {
  background-color: #f3e5f5;
}

.color-purple-100 {
  color: #e1bee7;
}

.bgColor-purple-100 {
  background-color: #e1bee7;
}

.color-purple-200 {
  color: #ce93d8;
}

.bgColor-purple-200 {
  background-color: #ce93d8;
}

.color-purple-300 {
  color: #ba68c8;
}

.bgColor-purple-300 {
  background-color: #ba68c8;
}

.color-purple-400 {
  color: #ab47bc;
}

.bgColor-purple-400 {
  background-color: #ab47bc;
}

.color-purple-500 {
  color: #9c27b0;
}

.bgColor-purple-500 {
  background-color: #9c27b0;
}

.color-purple-600 {
  color: #8e24aa;
}

.bgColor-purple-600 {
  background-color: #8e24aa;
}

.color-purple-700 {
  color: #7b1fa2;
}

.bgColor-purple-700 {
  background-color: #7b1fa2;
}

.color-purple-800 {
  color: #6a1b9a;
}

.bgColor-purple-800 {
  background-color: #6a1b9a;
}

.color-purple-900 {
  color: #4a148c;
}

.bgColor-purple-900 {
  background-color: #4a148c;
}

.color-purple-a100 {
  color: #ea80fc;
}

.bgColor-purple-a100 {
  background-color: #ea80fc;
}

.color-purple-a200 {
  color: #e040fb;
}

.bgColor-purple-a200 {
  background-color: #e040fb;
}

.color-purple-a400 {
  color: #d500f9;
}

.bgColor-purple-a400 {
  background-color: #d500f9;
}

.color-purple-a700 {
  color: #aa00ff;
}

.bgColor-purple-a700 {
  background-color: #aa00ff;
}

.color-deep-purple-50 {
  color: #ede7f6;
}

.bgColor-deep-purple-50 {
  background-color: #ede7f6;
}

.color-deep-purple-100 {
  color: #d1c4e9;
}

.bgColor-deep-purple-100 {
  background-color: #d1c4e9;
}

.color-deep-purple-200 {
  color: #b39ddb;
}

.bgColor-deep-purple-200 {
  background-color: #b39ddb;
}

.color-deep-purple-300 {
  color: #9575cd;
}

.bgColor-deep-purple-300 {
  background-color: #9575cd;
}

.color-deep-purple-400 {
  color: #7e57c2;
}

.bgColor-deep-purple-400 {
  background-color: #7e57c2;
}

.color-deep-purple-500 {
  color: #673ab7;
}

.bgColor-deep-purple-500 {
  background-color: #673ab7;
}

.color-deep-purple-600 {
  color: #5e35b1;
}

.bgColor-deep-purple-600 {
  background-color: #5e35b1;
}

.color-deep-purple-700 {
  color: #512da8;
}

.bgColor-deep-purple-700 {
  background-color: #512da8;
}

.color-deep-purple-800 {
  color: #4527a0;
}

.bgColor-deep-purple-800 {
  background-color: #4527a0;
}

.color-deep-purple-900 {
  color: #311b92;
}

.bgColor-deep-purple-900 {
  background-color: #311b92;
}

.color-deep-purple-a100 {
  color: #b388ff;
}

.bgColor-deep-purple-a100 {
  background-color: #b388ff;
}

.color-deep-purple-a200 {
  color: #7c4dff;
}

.bgColor-deep-purple-a200 {
  background-color: #7c4dff;
}

.color-deep-purple-a400 {
  color: #651fff;
}

.bgColor-deep-purple-a400 {
  background-color: #651fff;
}

.color-deep-purple-a700 {
  color: #6200ea;
}

.bgColor-deep-purple-a700 {
  background-color: #6200ea;
}

.color-indigo-50 {
  color: #e8eaf6;
}

.bgColor-indigo-50 {
  background-color: #e8eaf6;
}

.color-indigo-100 {
  color: #c5cae9;
}

.bgColor-indigo-100 {
  background-color: #c5cae9;
}

.color-indigo-200 {
  color: #9fa8da;
}

.bgColor-indigo-200 {
  background-color: #9fa8da;
}

.color-indigo-300 {
  color: #7986cb;
}

.bgColor-indigo-300 {
  background-color: #7986cb;
}

.color-indigo-400 {
  color: #5c6bc0;
}

.bgColor-indigo-400 {
  background-color: #5c6bc0;
}

.color-indigo-500 {
  color: #3f51b5;
}

.bgColor-indigo-500 {
  background-color: #3f51b5;
}

.color-indigo-600 {
  color: #3949ab;
}

.bgColor-indigo-600 {
  background-color: #3949ab;
}

.color-indigo-700 {
  color: #303f9f;
}

.bgColor-indigo-700 {
  background-color: #303f9f;
}

.color-indigo-800 {
  color: #283593;
}

.bgColor-indigo-800 {
  background-color: #283593;
}

.color-indigo-900 {
  color: #1a237e;
}

.bgColor-indigo-900 {
  background-color: #1a237e;
}

.color-indigo-a100 {
  color: #8c9eff;
}

.bgColor-indigo-a100 {
  background-color: #8c9eff;
}

.color-indigo-a200 {
  color: #536dfe;
}

.bgColor-indigo-a200 {
  background-color: #536dfe;
}

.color-indigo-a400 {
  color: #3d5afe;
}

.bgColor-indigo-a400 {
  background-color: #3d5afe;
}

.color-indigo-a700 {
  color: #304ffe;
}

.bgColor-indigo-a700 {
  background-color: #304ffe;
}

.color-blue-50 {
  color: #e3f2fd;
}

.bgColor-blue-50 {
  background-color: #e3f2fd;
}

.color-blue-100 {
  color: #bbdefb;
}

.bgColor-blue-100 {
  background-color: #bbdefb;
}

.color-blue-200 {
  color: #90caf9;
}

.bgColor-blue-200 {
  background-color: #90caf9;
}

.color-blue-300 {
  color: #64b5f6;
}

.bgColor-blue-300 {
  background-color: #64b5f6;
}

.color-blue-400 {
  color: #42a5f5;
}

.bgColor-blue-400 {
  background-color: #42a5f5;
}

.color-blue-500 {
  color: #2196f3;
}

.bgColor-blue-500 {
  background-color: #2196f3;
}

.color-blue-600 {
  color: #1e88e5;
}

.bgColor-blue-600 {
  background-color: #1e88e5;
}

.color-blue-700 {
  color: #1976d2;
}

.bgColor-blue-700 {
  background-color: #1976d2;
}

.color-blue-800 {
  color: #1565c0;
}

.bgColor-blue-800 {
  background-color: #1565c0;
}

.color-blue-900 {
  color: #0d47a1;
}

.bgColor-blue-900 {
  background-color: #0d47a1;
}

.color-blue-a100 {
  color: #82b1ff;
}

.bgColor-blue-a100 {
  background-color: #82b1ff;
}

.color-blue-a200 {
  color: #448aff;
}

.bgColor-blue-a200 {
  background-color: #448aff;
}

.color-blue-a400 {
  color: #2979ff;
}

.bgColor-blue-a400 {
  background-color: #2979ff;
}

.color-blue-a700 {
  color: #2962ff;
}

.bgColor-blue-a700 {
  background-color: #2962ff;
}

.color-light-blue-50 {
  color: #e1f5fe;
}

.bgColor-light-blue-50 {
  background-color: #e1f5fe;
}

.color-light-blue-100 {
  color: #b3e5fc;
}

.bgColor-light-blue-100 {
  background-color: #b3e5fc;
}

.color-light-blue-200 {
  color: #81d4fa;
}

.bgColor-light-blue-200 {
  background-color: #81d4fa;
}

.color-light-blue-300 {
  color: #4fc3f7;
}

.bgColor-light-blue-300 {
  background-color: #4fc3f7;
}

.color-light-blue-400 {
  color: #29b6f6;
}

.bgColor-light-blue-400 {
  background-color: #29b6f6;
}

.color-light-blue-500 {
  color: #03a9f4;
}

.bgColor-light-blue-500 {
  background-color: #03a9f4;
}

.color-light-blue-600 {
  color: #039be5;
}

.bgColor-light-blue-600 {
  background-color: #039be5;
}

.color-light-blue-700 {
  color: #0288d1;
}

.bgColor-light-blue-700 {
  background-color: #0288d1;
}

.color-light-blue-800 {
  color: #0277bd;
}

.bgColor-light-blue-800 {
  background-color: #0277bd;
}

.color-light-blue-900 {
  color: #01579b;
}

.bgColor-light-blue-900 {
  background-color: #01579b;
}

.color-light-blue-a100 {
  color: #80d8ff;
}

.bgColor-light-blue-a100 {
  background-color: #80d8ff;
}

.color-light-blue-a200 {
  color: #40c4ff;
}

.bgColor-light-blue-a200 {
  background-color: #40c4ff;
}

.color-light-blue-a400 {
  color: #00b0ff;
}

.bgColor-light-blue-a400 {
  background-color: #00b0ff;
}

.color-light-blue-a700 {
  color: #0091ea;
}

.bgColor-light-blue-a700 {
  background-color: #0091ea;
}

.color-cyan-50 {
  color: #e0f7fa;
}

.bgColor-cyan-50 {
  background-color: #e0f7fa;
}

.color-cyan-100 {
  color: #b2ebf2;
}

.bgColor-cyan-100 {
  background-color: #b2ebf2;
}

.color-cyan-200 {
  color: #80deea;
}

.bgColor-cyan-200 {
  background-color: #80deea;
}

.color-cyan-300 {
  color: #4dd0e1;
}

.bgColor-cyan-300 {
  background-color: #4dd0e1;
}

.color-cyan-400 {
  color: #26c6da;
}

.bgColor-cyan-400 {
  background-color: #26c6da;
}

.color-cyan-500 {
  color: #00bcd4;
}

.bgColor-cyan-500 {
  background-color: #00bcd4;
}

.color-cyan-600 {
  color: #00acc1;
}

.bgColor-cyan-600 {
  background-color: #00acc1;
}

.color-cyan-700 {
  color: #0097a7;
}

.bgColor-cyan-700 {
  background-color: #0097a7;
}

.color-cyan-800 {
  color: #00838f;
}

.bgColor-cyan-800 {
  background-color: #00838f;
}

.color-cyan-900 {
  color: #006064;
}

.bgColor-cyan-900 {
  background-color: #006064;
}

.color-cyan-a100 {
  color: #84ffff;
}

.bgColor-cyan-a100 {
  background-color: #84ffff;
}

.color-cyan-a200 {
  color: #18ffff;
}

.bgColor-cyan-a200 {
  background-color: #18ffff;
}

.color-cyan-a400 {
  color: #00e5ff;
}

.bgColor-cyan-a400 {
  background-color: #00e5ff;
}

.color-cyan-a700 {
  color: #00b8d4;
}

.bgColor-cyan-a700 {
  background-color: #00b8d4;
}

.color-teal-50 {
  color: #e0f2f1;
}

.bgColor-teal-50 {
  background-color: #e0f2f1;
}

.color-teal-100 {
  color: #b2dfdb;
}

.bgColor-teal-100 {
  background-color: #b2dfdb;
}

.color-teal-200 {
  color: #80cbc4;
}

.bgColor-teal-200 {
  background-color: #80cbc4;
}

.color-teal-300 {
  color: #4db6ac;
}

.bgColor-teal-300 {
  background-color: #4db6ac;
}

.color-teal-400 {
  color: #26a69a;
}

.bgColor-teal-400 {
  background-color: #26a69a;
}

.color-teal-500 {
  color: #009688;
}

.bgColor-teal-500 {
  background-color: #009688;
}

.color-teal-600 {
  color: #00897b;
}

.bgColor-teal-600 {
  background-color: #00897b;
}

.color-teal-700 {
  color: #00796b;
}

.bgColor-teal-700 {
  background-color: #00796b;
}

.color-teal-800 {
  color: #00695c;
}

.bgColor-teal-800 {
  background-color: #00695c;
}

.color-teal-900 {
  color: #004d40;
}

.bgColor-teal-900 {
  background-color: #004d40;
}

.color-teal-a100 {
  color: #a7ffeb;
}

.bgColor-teal-a100 {
  background-color: #a7ffeb;
}

.color-teal-a200 {
  color: #64ffda;
}

.bgColor-teal-a200 {
  background-color: #64ffda;
}

.color-teal-a400 {
  color: #1de9b6;
}

.bgColor-teal-a400 {
  background-color: #1de9b6;
}

.color-teal-a700 {
  color: #00bfa5;
}

.bgColor-teal-a700 {
  background-color: #00bfa5;
}

.color-green-50 {
  color: #e8f5e9;
}

.bgColor-green-50 {
  background-color: #e8f5e9;
}

.color-green-100 {
  color: #c8e6c9;
}

.bgColor-green-100 {
  background-color: #c8e6c9;
}

.color-green-200 {
  color: #a5d6a7;
}

.bgColor-green-200 {
  background-color: #a5d6a7;
}

.color-green-300 {
  color: #81c784;
}

.bgColor-green-300 {
  background-color: #81c784;
}

.color-green-400 {
  color: #66bb6a;
}

.bgColor-green-400 {
  background-color: #66bb6a;
}

.color-green-500 {
  color: #4caf50;
}

.bgColor-green-500 {
  background-color: #4caf50;
}

.color-green-600 {
  color: #43a047;
}

.bgColor-green-600 {
  background-color: #43a047;
}

.color-green-700 {
  color: #388e3c;
}

.bgColor-green-700 {
  background-color: #388e3c;
}

.color-green-800 {
  color: #2e7d32;
}

.bgColor-green-800 {
  background-color: #2e7d32;
}

.color-green-900 {
  color: #1b5e20;
}

.bgColor-green-900 {
  background-color: #1b5e20;
}

.color-green-a100 {
  color: #b9f6ca;
}

.bgColor-green-a100 {
  background-color: #b9f6ca;
}

.color-green-a200 {
  color: #69f0ae;
}

.bgColor-green-a200 {
  background-color: #69f0ae;
}

.color-green-a400 {
  color: #00e676;
}

.bgColor-green-a400 {
  background-color: #00e676;
}

.color-green-a700 {
  color: #00c853;
}

.bgColor-green-a700 {
  background-color: #00c853;
}

.color-light-green-50 {
  color: #f1f8e9;
}

.bgColor-light-green-50 {
  background-color: #f1f8e9;
}

.color-light-green-100 {
  color: #dcedc8;
}

.bgColor-light-green-100 {
  background-color: #dcedc8;
}

.color-light-green-200 {
  color: #c5e1a5;
}

.bgColor-light-green-200 {
  background-color: #c5e1a5;
}

.color-light-green-300 {
  color: #aed581;
}

.bgColor-light-green-300 {
  background-color: #aed581;
}

.color-light-green-400 {
  color: #9ccc65;
}

.bgColor-light-green-400 {
  background-color: #9ccc65;
}

.color-light-green-500 {
  color: #8bc34a;
}

.bgColor-light-green-500 {
  background-color: #8bc34a;
}

.color-light-green-600 {
  color: #7cb342;
}

.bgColor-light-green-600 {
  background-color: #7cb342;
}

.color-light-green-700 {
  color: #689f38;
}

.bgColor-light-green-700 {
  background-color: #689f38;
}

.color-light-green-800 {
  color: #558b2f;
}

.bgColor-light-green-800 {
  background-color: #558b2f;
}

.color-light-green-900 {
  color: #33691e;
}

.bgColor-light-green-900 {
  background-color: #33691e;
}

.color-light-green-a100 {
  color: #ccff90;
}

.bgColor-light-green-a100 {
  background-color: #ccff90;
}

.color-light-green-a200 {
  color: #b2ff59;
}

.bgColor-light-green-a200 {
  background-color: #b2ff59;
}

.color-light-green-a400 {
  color: #76ff03;
}

.bgColor-light-green-a400 {
  background-color: #76ff03;
}

.color-light-green-a700 {
  color: #64dd17;
}

.bgColor-light-green-a700 {
  background-color: #64dd17;
}

.color-lime-50 {
  color: #f9fbe7;
}

.bgColor-lime-50 {
  background-color: #f9fbe7;
}

.color-lime-100 {
  color: #f0f4c3;
}

.bgColor-lime-100 {
  background-color: #f0f4c3;
}

.color-lime-200 {
  color: #e6ee9c;
}

.bgColor-lime-200 {
  background-color: #e6ee9c;
}

.color-lime-300 {
  color: #dce775;
}

.bgColor-lime-300 {
  background-color: #dce775;
}

.color-lime-400 {
  color: #d4e157;
}

.bgColor-lime-400 {
  background-color: #d4e157;
}

.color-lime-500 {
  color: #cddc39;
}

.bgColor-lime-500 {
  background-color: #cddc39;
}

.color-lime-600 {
  color: #c0ca33;
}

.bgColor-lime-600 {
  background-color: #c0ca33;
}

.color-lime-700 {
  color: #afb42b;
}

.bgColor-lime-700 {
  background-color: #afb42b;
}

.color-lime-800 {
  color: #9e9d24;
}

.bgColor-lime-800 {
  background-color: #9e9d24;
}

.color-lime-900 {
  color: #827717;
}

.bgColor-lime-900 {
  background-color: #827717;
}

.color-lime-a100 {
  color: #f4ff81;
}

.bgColor-lime-a100 {
  background-color: #f4ff81;
}

.color-lime-a200 {
  color: #eeff41;
}

.bgColor-lime-a200 {
  background-color: #eeff41;
}

.color-lime-a400 {
  color: #c6ff00;
}

.bgColor-lime-a400 {
  background-color: #c6ff00;
}

.color-lime-a700 {
  color: #aeea00;
}

.bgColor-lime-a700 {
  background-color: #aeea00;
}

.color-yellow-50 {
  color: #fffde7;
}

.bgColor-yellow-50 {
  background-color: #fffde7;
}

.color-yellow-100 {
  color: #fff9c4;
}

.bgColor-yellow-100 {
  background-color: #fff9c4;
}

.color-yellow-200 {
  color: #fff59d;
}

.bgColor-yellow-200 {
  background-color: #fff59d;
}

.color-yellow-300 {
  color: #fff176;
}

.bgColor-yellow-300 {
  background-color: #fff176;
}

.color-yellow-400 {
  color: #ffee58;
}

.bgColor-yellow-400 {
  background-color: #ffee58;
}

.color-yellow-500 {
  color: #ffeb3b;
}

.bgColor-yellow-500 {
  background-color: #ffeb3b;
}

.color-yellow-600 {
  color: #fdd835;
}

.bgColor-yellow-600 {
  background-color: #fdd835;
}

.color-yellow-700 {
  color: #fbc02d;
}

.bgColor-yellow-700 {
  background-color: #fbc02d;
}

.color-yellow-800 {
  color: #f9a825;
}

.bgColor-yellow-800 {
  background-color: #f9a825;
}

.color-yellow-900 {
  color: #f57f17;
}

.bgColor-yellow-900 {
  background-color: #f57f17;
}

.color-yellow-a100 {
  color: #ffff8d;
}

.bgColor-yellow-a100 {
  background-color: #ffff8d;
}

.color-yellow-a200 {
  color: #ffff00;
}

.bgColor-yellow-a200 {
  background-color: #ffff00;
}

.color-yellow-a400 {
  color: #ffea00;
}

.bgColor-yellow-a400 {
  background-color: #ffea00;
}

.color-yellow-a700 {
  color: #ffd600;
}

.bgColor-yellow-a700 {
  background-color: #ffd600;
}

.color-amber-50 {
  color: #fff8e1;
}

.bgColor-amber-50 {
  background-color: #fff8e1;
}

.color-amber-100 {
  color: #ffecb3;
}

.bgColor-amber-100 {
  background-color: #ffecb3;
}

.color-amber-200 {
  color: #ffe082;
}

.bgColor-amber-200 {
  background-color: #ffe082;
}

.color-amber-300 {
  color: #ffd54f;
}

.bgColor-amber-300 {
  background-color: #ffd54f;
}

.color-amber-400 {
  color: #ffca28;
}

.bgColor-amber-400 {
  background-color: #ffca28;
}

.color-amber-500 {
  color: #ffc107;
}

.bgColor-amber-500 {
  background-color: #ffc107;
}

.color-amber-600 {
  color: #ffb300;
}

.bgColor-amber-600 {
  background-color: #ffb300;
}

.color-amber-700 {
  color: #ffa000;
}

.bgColor-amber-700 {
  background-color: #ffa000;
}

.color-amber-800 {
  color: #ff8f00;
}

.bgColor-amber-800 {
  background-color: #ff8f00;
}

.color-amber-900 {
  color: #ff6f00;
}

.bgColor-amber-900 {
  background-color: #ff6f00;
}

.color-amber-a100 {
  color: #ffe57f;
}

.bgColor-amber-a100 {
  background-color: #ffe57f;
}

.color-amber-a200 {
  color: #ffd740;
}

.bgColor-amber-a200 {
  background-color: #ffd740;
}

.color-amber-a400 {
  color: #ffc400;
}

.bgColor-amber-a400 {
  background-color: #ffc400;
}

.color-amber-a700 {
  color: #ffab00;
}

.bgColor-amber-a700 {
  background-color: #ffab00;
}

.color-orange-50 {
  color: #fff3e0;
}

.bgColor-orange-50 {
  background-color: #fff3e0;
}

.color-orange-100 {
  color: #ffe0b2;
}

.bgColor-orange-100 {
  background-color: #ffe0b2;
}

.color-orange-200 {
  color: #ffcc80;
}

.bgColor-orange-200 {
  background-color: #ffcc80;
}

.color-orange-300 {
  color: #ffb74d;
}

.bgColor-orange-300 {
  background-color: #ffb74d;
}

.color-orange-400 {
  color: #ffa726;
}

.bgColor-orange-400 {
  background-color: #ffa726;
}

.color-orange-500 {
  color: #ff9800;
}

.bgColor-orange-500 {
  background-color: #ff9800;
}

.color-orange-600 {
  color: #fb8c00;
}

.bgColor-orange-600 {
  background-color: #fb8c00;
}

.color-orange-700 {
  color: #f57c00;
}

.bgColor-orange-700 {
  background-color: #f57c00;
}

.color-orange-800 {
  color: #ef6c00;
}

.bgColor-orange-800 {
  background-color: #ef6c00;
}

.color-orange-900 {
  color: #e65100;
}

.bgColor-orange-900 {
  background-color: #e65100;
}

.color-orange-a100 {
  color: #ffd180;
}

.bgColor-orange-a100 {
  background-color: #ffd180;
}

.color-orange-a200 {
  color: #ffab40;
}

.bgColor-orange-a200 {
  background-color: #ffab40;
}

.color-orange-a400 {
  color: #ff9100;
}

.bgColor-orange-a400 {
  background-color: #ff9100;
}

.color-orange-a700 {
  color: #ff6d00;
}

.bgColor-orange-a700 {
  background-color: #ff6d00;
}

.color-deep-orange-50 {
  color: #fbe9e7;
}

.bgColor-deep-orange-50 {
  background-color: #fbe9e7;
}

.color-deep-orange-100 {
  color: #ffccbc;
}

.bgColor-deep-orange-100 {
  background-color: #ffccbc;
}

.color-deep-orange-200 {
  color: #ffab91;
}

.bgColor-deep-orange-200 {
  background-color: #ffab91;
}

.color-deep-orange-300 {
  color: #ff8a65;
}

.bgColor-deep-orange-300 {
  background-color: #ff8a65;
}

.color-deep-orange-400 {
  color: #ff7043;
}

.bgColor-deep-orange-400 {
  background-color: #ff7043;
}

.color-deep-orange-500 {
  color: #ff5722;
}

.bgColor-deep-orange-500 {
  background-color: #ff5722;
}

.color-deep-orange-600 {
  color: #f4511e;
}

.bgColor-deep-orange-600 {
  background-color: #f4511e;
}

.color-deep-orange-700 {
  color: #e64a19;
}

.bgColor-deep-orange-700 {
  background-color: #e64a19;
}

.color-deep-orange-800 {
  color: #d84315;
}

.bgColor-deep-orange-800 {
  background-color: #d84315;
}

.color-deep-orange-900 {
  color: #bf360c;
}

.bgColor-deep-orange-900 {
  background-color: #bf360c;
}

.color-deep-orange-a100 {
  color: #ff9e80;
}

.bgColor-deep-orange-a100 {
  background-color: #ff9e80;
}

.color-deep-orange-a200 {
  color: #ff6e40;
}

.bgColor-deep-orange-a200 {
  background-color: #ff6e40;
}

.color-deep-orange-a400 {
  color: #ff3d00;
}

.bgColor-deep-orange-a400 {
  background-color: #ff3d00;
}

.color-deep-orange-a700 {
  color: #dd2c00;
}

.bgColor-deep-orange-a700 {
  background-color: #dd2c00;
}

.color-brown-50 {
  color: #efebe9;
}

.bgColor-brown-50 {
  background-color: #efebe9;
}

.color-brown-100 {
  color: #d7ccc8;
}

.bgColor-brown-100 {
  background-color: #d7ccc8;
}

.color-brown-200 {
  color: #bcaaa4;
}

.bgColor-brown-200 {
  background-color: #bcaaa4;
}

.color-brown-300 {
  color: #a1887f;
}

.bgColor-brown-300 {
  background-color: #a1887f;
}

.color-brown-400 {
  color: #8d6e63;
}

.bgColor-brown-400 {
  background-color: #8d6e63;
}

.color-brown-500 {
  color: #795548;
}

.bgColor-brown-500 {
  background-color: #795548;
}

.color-brown-600 {
  color: #6d4c41;
}

.bgColor-brown-600 {
  background-color: #6d4c41;
}

.color-brown-700 {
  color: #5d4037;
}

.bgColor-brown-700 {
  background-color: #5d4037;
}

.color-brown-800 {
  color: #4e342e;
}

.bgColor-brown-800 {
  background-color: #4e342e;
}

.color-brown-900 {
  color: #3e2723;
}

.bgColor-brown-900 {
  background-color: #3e2723;
}

.color-grey-50 {
  color: #fafafa;
}

.bgColor-grey-50 {
  background-color: #fafafa;
}

.color-grey-100 {
  color: #f5f5f5;
}

.bgColor-grey-100 {
  background-color: #f5f5f5;
}

.color-grey-200 {
  color: #eeeeee;
}

.bgColor-grey-200 {
  background-color: #eeeeee;
}

.color-grey-300 {
  color: #e0e0e0;
}

.bgColor-grey-300 {
  background-color: #e0e0e0;
}

.color-grey-400 {
  color: #bdbdbd;
}

.bgColor-grey-400 {
  background-color: #bdbdbd;
}

.color-grey-500 {
  color: #9e9e9e;
}

.bgColor-grey-500 {
  background-color: #9e9e9e;
}

.color-grey-600 {
  color: #757575;
}

.bgColor-grey-600 {
  background-color: #757575;
}

.color-grey-700 {
  color: #616161;
}

.bgColor-grey-700 {
  background-color: #616161;
}

.color-grey-800 {
  color: #424242;
}

.bgColor-grey-800 {
  background-color: #424242;
}

.color-grey-900 {
  color: #212121;
}

.bgColor-grey-900 {
  background-color: #212121;
}

.color-blue-grey-50 {
  color: #eceff1;
}

.bgColor-blue-grey-50 {
  background-color: #eceff1;
}

.color-blue-grey-100 {
  color: #cfd8dc;
}

.bgColor-blue-grey-100 {
  background-color: #cfd8dc;
}

.color-blue-grey-200 {
  color: #b0bec5;
}

.bgColor-blue-grey-200 {
  background-color: #b0bec5;
}

.color-blue-grey-300 {
  color: #90a4ae;
}

.bgColor-blue-grey-300 {
  background-color: #90a4ae;
}

.color-blue-grey-400 {
  color: #78909c;
}

.bgColor-blue-grey-400 {
  background-color: #78909c;
}

.color-blue-grey-500 {
  color: #607d8b;
}

.bgColor-blue-grey-500 {
  background-color: #607d8b;
}

.color-blue-grey-600 {
  color: #546e7a;
}

.bgColor-blue-grey-600 {
  background-color: #546e7a;
}

.color-blue-grey-700 {
  color: #455a64;
}

.bgColor-blue-grey-700 {
  background-color: #455a64;
}

.color-blue-grey-800 {
  color: #37474f;
}

.bgColor-blue-grey-800 {
  background-color: #37474f;
}

.color-blue-grey-900 {
  color: #263238;
}

.bgColor-blue-grey-900 {
  background-color: #263238;
}

/*----------------------------------------
	color
----------------------------------------*/

/*----------------------------------------
	clearfix
----------------------------------------*/

.container:after {
  content: "";
  clear: both;
  height: 0;
  display: block;
  visibility: hidden;
}

/*----------------------------------------
	reset
----------------------------------------*/

html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
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,
article,
aside,
dialog,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  color: #212121;
  vertical-align: baseline;
}

header,
footer,
article,
section,
aside,
hgroup,
nav,
menu,
figure,
figcaption,
time {
  display: block;
}

li {
  list-style: none;
}

ol li {
  list-style: decimal;
}

img {
  border: 0;
  vertical-align: top;
  font-size: 0;
  line-height: 0;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

caption,
th {
  text-align: left;
}

hr {
  margin: 1em 0;
  padding: 0;
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #cccccc;
}

input,
select {
  vertical-align: middle;
}

input,
textarea {
  margin: 0;
  padding: 0;
}

.clearfix {
  min-height: 1px;
  _height: 1%;
}

.clearfix:after {
  content: "";
  clear: both;
  height: 0;
  display: block;
  visibility: hidden;
}

/* width */

.w1 {
  width: 1%;
}

.w2 {
  width: 2%;
}

.w3 {
  width: 3%;
}

.w4 {
  width: 4%;
}

.w5 {
  width: 5%;
}

.w6 {
  width: 6%;
}

.w7 {
  width: 7%;
}

.w8 {
  width: 8%;
}

.w9 {
  width: 9%;
}

.w10 {
  width: 10%;
}

.w11 {
  width: 11%;
}

.w12 {
  width: 12%;
}

.w13 {
  width: 13%;
}

.w14 {
  width: 14%;
}

.w15 {
  width: 15%;
}

.w16 {
  width: 16%;
}

.w17 {
  width: 17%;
}

.w18 {
  width: 18%;
}

.w19 {
  width: 19%;
}

.w20 {
  width: 20%;
}

.w21 {
  width: 21%;
}

.w22 {
  width: 22%;
}

.w23 {
  width: 23%;
}

.w24 {
  width: 24%;
}

.w25 {
  width: 25%;
}

.w26 {
  width: 26%;
}

.w27 {
  width: 27%;
}

.w28 {
  width: 28%;
}

.w29 {
  width: 29%;
}

.w30 {
  width: 30%;
}

.w31 {
  width: 31%;
}

.w32 {
  width: 32%;
}

.w33 {
  width: 33%;
}

.w34 {
  width: 34%;
}

.w35 {
  width: 35%;
}

.w36 {
  width: 36%;
}

.w37 {
  width: 37%;
}

.w38 {
  width: 38%;
}

.w39 {
  width: 39%;
}

.w40 {
  width: 40%;
}

.w41 {
  width: 41%;
}

.w42 {
  width: 42%;
}

.w43 {
  width: 43%;
}

.w44 {
  width: 44%;
}

.w45 {
  width: 45%;
}

.w46 {
  width: 46%;
}

.w47 {
  width: 47%;
}

.w48 {
  width: 48%;
}

.w49 {
  width: 49%;
}

.w50 {
  width: 50%;
}

.w55 {
  width: 55%;
}

.w60 {
  width: 60%;
}

.w65 {
  width: 65%;
}

.w70 {
  width: 70%;
}

.w75 {
  width: 75%;
}

.w80 {
  width: 80%;
}

.w85 {
  width: 85%;
}

.w90 {
  width: 90%;
}

.w95 {
  width: 95%;
}

.w100 {
  width: 100%;
}

/* height */

.h10 {
  height: 10px;
}

.h20 {
  height: 20px;
}

.h30 {
  height: 30px;
}

.h40 {
  height: 40px;
}

.h50 {
  height: 50px;
}

.h60 {
  height: 60px;
}

.h70 {
  height: 70px;
}

.h80 {
  height: 80px;
}

.h90 {
  height: 90px;
}

.h100 {
  height: 100px;
}

.h110 {
  height: 110px;
}

.h120 {
  height: 120px;
}

.h130 {
  height: 130px;
}

.h140 {
  height: 140px;
}

.h150 {
  height: 150px;
}

.h160 {
  height: 160px;
}

.h170 {
  height: 170px;
}

.h180 {
  height: 180px;
}

.h190 {
  height: 190px;
}

.h200 {
  height: 200px;
}

.h210 {
  height: 210px;
}

.h220 {
  height: 220px;
}

.h230 {
  height: 230px;
}

.h240 {
  height: 240px;
}

.h250 {
  height: 250px;
}

.h260 {
  height: 260px;
}

.h270 {
  height: 270px;
}

.h280 {
  height: 280px;
}

.h290 {
  height: 290px;
}

.h300 {
  height: 300px;
}

.h310 {
  height: 310px;
}

.h320 {
  height: 320px;
}

.h330 {
  height: 330px;
}

.h340 {
  height: 340px;
}

.h350 {
  height: 350px;
}

.h360 {
  height: 360px;
}

.h370 {
  height: 370px;
}

.h380 {
  height: 380px;
}

.h390 {
  height: 390px;
}

.h400 {
  height: 400px;
}

/* align */

.aLeft {
  text-align: left !important;
}

.aRight {
  text-align: right !important;
}

.aCenter {
  text-align: center !important;
}

.aCenter * {
  margin: 0 auto !important;
}

.vTop {
  vertical-align: top !important;
}

.vMiddle {
  vertical-align: middle !important;
}

.vBottom {
  vertical-align: bottom !important;
}

/* float */

.fl {
  float: left;
}

.fr {
  float: right;
}

/* visivle style */

.fs10 {
  font-size: 10px;
  font-size: 0.625rem;
}

.fs10-400 {
  font-size: 10px;
  font-size: 0.625rem;
  font-weight: 400;
}

.fs10-500 {
  font-size: 10px;
  font-size: 0.625rem;
  font-weight: 500;
}

.fs10-700 {
  font-size: 10px;
  font-size: 0.625rem;
  font-weight: 700;
}

.fs10-900 {
  font-size: 10px;
  font-size: 0.625rem;
  font-weight: 900;
}

.fs11 {
  font-size: 11px;
  font-size: 0.6875rem;
}

.fs11-400 {
  font-size: 11px;
  font-size: 0.6875rem;
  font-weight: 400;
}

.fs11-500 {
  font-size: 11px;
  font-size: 0.6875rem;
  font-weight: 500;
}

.fs11-700 {
  font-size: 11px;
  font-size: 0.6875rem;
  font-weight: 700;
}

.fs11-900 {
  font-size: 11px;
  font-size: 0.6875rem;
  font-weight: 900;
}

.fs12 {
  font-size: 12px;
  font-size: 0.75rem;
}

.fs12-400 {
  font-size: 12px;
  font-size: 0.75rem;
  font-weight: 400;
}

.fs12-500 {
  font-size: 12px;
  font-size: 0.75rem;
  font-weight: 500;
}

.fs12-700 {
  font-size: 12px;
  font-size: 0.75rem;
  font-weight: 700;
}

.fs12-900 {
  font-size: 12px;
  font-size: 0.75rem;
  font-weight: 900;
}

.fs13 {
  font-size: 13px;
  font-size: 0.8125rem;
}

.fs13-400 {
  font-size: 13px;
  font-size: 0.8125rem;
  font-weight: 400;
}

.fs13-500 {
  font-size: 13px;
  font-size: 0.8125rem;
  font-weight: 500;
}

.fs13-700 {
  font-size: 13px;
  font-size: 0.8125rem;
  font-weight: 700;
}

.fs13-900 {
  font-size: 13px;
  font-size: 0.8125rem;
  font-weight: 900;
}

.fs14 {
  font-size: 14px;
  font-size: 0.875rem;
}

.fs14-400 {
  font-size: 14px;
  font-size: 0.875rem;
  font-weight: 400;
}

.fs14-500 {
  font-size: 14px;
  font-size: 0.875rem;
  font-weight: 500;
}

.fs14-700 {
  font-size: 14px;
  font-size: 0.875rem;
  font-weight: 700;
}

.fs14-900 {
  font-size: 14px;
  font-size: 0.875rem;
  font-weight: 900;
}

.fs15 {
  font-size: 15px;
  font-size: 0.9375rem;
}

.fs15-400 {
  font-size: 15px;
  font-size: 0.9375rem;
  font-weight: 400;
}

.fs15-500 {
  font-size: 15px;
  font-size: 0.9375rem;
  font-weight: 500;
}

.fs15-700 {
  font-size: 15px;
  font-size: 0.9375rem;
  font-weight: 700;
}

.fs15-900 {
  font-size: 15px;
  font-size: 0.9375rem;
  font-weight: 900;
}

.fs16 {
  font-size: 16px;
  font-size: 1rem;
}

.fs16-400 {
  font-size: 16px;
  font-size: 1rem;
  font-weight: 400;
}

.fs16-500 {
  font-size: 16px;
  font-size: 1rem;
  font-weight: 500;
}

.fs16-700 {
  font-size: 16px;
  font-size: 1rem;
  font-weight: 700;
}

.fs16-900 {
  font-size: 16px;
  font-size: 1rem;
  font-weight: 900;
}

.fs17 {
  font-size: 17px;
  font-size: 1.0625rem;
}

.fs17-400 {
  font-size: 17px;
  font-size: 1.0625rem;
  font-weight: 400;
}

.fs17-500 {
  font-size: 17px;
  font-size: 1.0625rem;
  font-weight: 500;
}

.fs17-700 {
  font-size: 17px;
  font-size: 1.0625rem;
  font-weight: 700;
}

.fs17-900 {
  font-size: 17px;
  font-size: 1.0625rem;
  font-weight: 900;
}

.fs18 {
  font-size: 18px;
  font-size: 1.125rem;
}

.fs18-400 {
  font-size: 18px;
  font-size: 1.125rem;
  font-weight: 400;
}

.fs18-500 {
  font-size: 18px;
  font-size: 1.125rem;
  font-weight: 500;
}

.fs18-700 {
  font-size: 18px;
  font-size: 1.125rem;
  font-weight: 700;
}

.fs18-900 {
  font-size: 18px;
  font-size: 1.125rem;
  font-weight: 900;
}

.fs19 {
  font-size: 19px;
  font-size: 1.1875rem;
}

.fs19-400 {
  font-size: 19px;
  font-size: 1.1875rem;
  font-weight: 400;
}

.fs19-500 {
  font-size: 19px;
  font-size: 1.1875rem;
  font-weight: 500;
}

.fs19-700 {
  font-size: 19px;
  font-size: 1.1875rem;
  font-weight: 700;
}

.fs19-900 {
  font-size: 19px;
  font-size: 1.1875rem;
  font-weight: 900;
}

.fs20 {
  font-size: 20px;
  font-size: 1.25rem;
}

.fs20-400 {
  font-size: 20px;
  font-size: 1.25rem;
  font-weight: 400;
}

.fs20-500 {
  font-size: 20px;
  font-size: 1.25rem;
  font-weight: 500;
}

.fs20-700 {
  font-size: 20px;
  font-size: 1.25rem;
  font-weight: 700;
}

.fs20-900 {
  font-size: 20px;
  font-size: 1.25rem;
  font-weight: 900;
}

.fs21 {
  font-size: 21px;
  font-size: 1.3125rem;
}

.fs21-400 {
  font-size: 21px;
  font-size: 1.3125rem;
  font-weight: 400;
}

.fs21-500 {
  font-size: 21px;
  font-size: 1.3125rem;
  font-weight: 500;
}

.fs21-700 {
  font-size: 21px;
  font-size: 1.3125rem;
  font-weight: 700;
}

.fs21-900 {
  font-size: 21px;
  font-size: 1.3125rem;
  font-weight: 900;
}

.fs22 {
  font-size: 22px;
  font-size: 1.375rem;
}

.fs22-400 {
  font-size: 22px;
  font-size: 1.375rem;
  font-weight: 400;
}

.fs22-500 {
  font-size: 22px;
  font-size: 1.375rem;
  font-weight: 500;
}

.fs22-700 {
  font-size: 22px;
  font-size: 1.375rem;
  font-weight: 700;
}

.fs22-900 {
  font-size: 22px;
  font-size: 1.375rem;
  font-weight: 900;
}

.fs23 {
  font-size: 23px;
  font-size: 1.4375rem;
}

.fs23-400 {
  font-size: 23px;
  font-size: 1.4375rem;
  font-weight: 400;
}

.fs23-500 {
  font-size: 23px;
  font-size: 1.4375rem;
  font-weight: 500;
}

.fs23-700 {
  font-size: 23px;
  font-size: 1.4375rem;
  font-weight: 700;
}

.fs23-900 {
  font-size: 23px;
  font-size: 1.4375rem;
  font-weight: 900;
}

.fs24 {
  font-size: 24px;
  font-size: 1.5rem;
}

.fs24-400 {
  font-size: 24px;
  font-size: 1.5rem;
  font-weight: 400;
}

.fs24-500 {
  font-size: 24px;
  font-size: 1.5rem;
  font-weight: 500;
}

.fs24-700 {
  font-size: 24px;
  font-size: 1.5rem;
  font-weight: 700;
}

.fs24-900 {
  font-size: 24px;
  font-size: 1.5rem;
  font-weight: 900;
}

.fs25 {
  font-size: 25px;
  font-size: 1.5625rem;
}

.fs25-400 {
  font-size: 25px;
  font-size: 1.5625rem;
  font-weight: 400;
}

.fs25-500 {
  font-size: 25px;
  font-size: 1.5625rem;
  font-weight: 500;
}

.fs25-700 {
  font-size: 25px;
  font-size: 1.5625rem;
  font-weight: 700;
}

.fs25-900 {
  font-size: 25px;
  font-size: 1.5625rem;
  font-weight: 900;
}

.fs26 {
  font-size: 26px;
  font-size: 1.625rem;
}

.fs26-400 {
  font-size: 26px;
  font-size: 1.625rem;
  font-weight: 400;
}

.fs26-500 {
  font-size: 26px;
  font-size: 1.625rem;
  font-weight: 500;
}

.fs26-700 {
  font-size: 26px;
  font-size: 1.625rem;
  font-weight: 700;
}

.fs26-900 {
  font-size: 26px;
  font-size: 1.625rem;
  font-weight: 900;
}

.fs27 {
  font-size: 27px;
  font-size: 1.6875rem;
}

.fs27-400 {
  font-size: 27px;
  font-size: 1.6875rem;
  font-weight: 400;
}

.fs27-500 {
  font-size: 27px;
  font-size: 1.6875rem;
  font-weight: 500;
}

.fs27-700 {
  font-size: 27px;
  font-size: 1.6875rem;
  font-weight: 700;
}

.fs27-900 {
  font-size: 27px;
  font-size: 1.6875rem;
  font-weight: 900;
}

.fs28 {
  font-size: 28px;
  font-size: 1.75rem;
}

.fs28-400 {
  font-size: 28px;
  font-size: 1.75rem;
  font-weight: 400;
}

.fs28-500 {
  font-size: 28px;
  font-size: 1.75rem;
  font-weight: 500;
}

.fs28-700 {
  font-size: 28px;
  font-size: 1.75rem;
  font-weight: 700;
}

.fs28-900 {
  font-size: 28px;
  font-size: 1.75rem;
  font-weight: 900;
}

.fs29 {
  font-size: 29px;
  font-size: 1.8125rem;
}

.fs29-400 {
  font-size: 29px;
  font-size: 1.8125rem;
  font-weight: 400;
}

.fs29-500 {
  font-size: 29px;
  font-size: 1.8125rem;
  font-weight: 500;
}

.fs29-700 {
  font-size: 29px;
  font-size: 1.8125rem;
  font-weight: 700;
}

.fs29-900 {
  font-size: 29px;
  font-size: 1.8125rem;
  font-weight: 900;
}

.fs30 {
  font-size: 30px;
  font-size: 1.875rem;
}

.fs30-400 {
  font-size: 30px;
  font-size: 1.875rem;
  font-weight: 400;
}

.fs30-500 {
  font-size: 30px;
  font-size: 1.875rem;
  font-weight: 500;
}

.fs30-700 {
  font-size: 30px;
  font-size: 1.875rem;
  font-weight: 700;
}

.fs30-900 {
  font-size: 30px;
  font-size: 1.875rem;
  font-weight: 900;
}

.fs31 {
  font-size: 31px;
  font-size: 1.9375rem;
}

.fs31-400 {
  font-size: 31px;
  font-size: 1.9375rem;
  font-weight: 400;
}

.fs31-500 {
  font-size: 31px;
  font-size: 1.9375rem;
  font-weight: 500;
}

.fs31-700 {
  font-size: 31px;
  font-size: 1.9375rem;
  font-weight: 700;
}

.fs31-900 {
  font-size: 31px;
  font-size: 1.9375rem;
  font-weight: 900;
}

.fs32 {
  font-size: 32px;
  font-size: 2rem;
}

.fs32-400 {
  font-size: 32px;
  font-size: 2rem;
  font-weight: 400;
}

.fs32-500 {
  font-size: 32px;
  font-size: 2rem;
  font-weight: 500;
}

.fs32-700 {
  font-size: 32px;
  font-size: 2rem;
  font-weight: 700;
}

.fs32-900 {
  font-size: 32px;
  font-size: 2rem;
  font-weight: 900;
}

/*----------------------------------------
	Magnific Popup CSS
----------------------------------------*/

.mfp-bg {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1042;
  overflow: hidden;
  position: fixed;
  background: #0b0b0b;
  opacity: 0.8;
}

.mfp-wrap {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1043;
  position: fixed;
  outline: none !important;
  -webkit-backface-visibility: hidden;
}

.mfp-container {
  text-align: center;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  padding: 0 8px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.mfp-container:before {
  content: "";
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}

.mfp-align-top .mfp-container:before {
  display: none;
}

.mfp-content {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  margin: 0 auto;
  text-align: left;
  z-index: 1045;
}

.mfp-inline-holder .mfp-content,
.mfp-ajax-holder .mfp-content {
  width: 100%;
  cursor: auto;
}

.mfp-ajax-cur {
  cursor: progress;
}

.mfp-zoom-out-cur {
  cursor: -webkit-zoom-out;
  cursor: zoom-out;
}

.mfp-zoom-out-cur .mfp-image-holder .mfp-close {
  cursor: -webkit-zoom-out;
  cursor: zoom-out;
}

.mfp-zoom {
  cursor: pointer;
  cursor: -webkit-zoom-in;
  cursor: zoom-in;
}

.mfp-auto-cursor .mfp-content {
  cursor: auto;
}

.mfp-close,
.mfp-arrow,
.mfp-preloader,
.mfp-counter {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.mfp-loading.mfp-figure {
  display: none;
}

.mfp-hide {
  display: none !important;
}

.mfp-preloader {
  color: #CCC;
  position: absolute;
  top: 50%;
  width: auto;
  text-align: center;
  margin-top: -0.8em;
  left: 8px;
  right: 8px;
  z-index: 1044;
}

.mfp-preloader a {
  color: #CCC;
}

.mfp-preloader a:hover {
  color: #FFF;
}

.mfp-s-ready .mfp-preloader,
.mfp-s-error .mfp-content {
  display: none;
}

button.mfp-close,
button.mfp-arrow {
  overflow: visible;
  cursor: pointer;
  background: transparent;
  border: 0;
  -webkit-appearance: none;
  display: block;
  outline: none;
  padding: 0;
  z-index: 1046;
  -webkit-box-shadow: none;
  box-shadow: none;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
}

button::-moz-focus-inner {
  padding: 0;
  border: 0;
}

.mfp-close {
  width: 44px;
  height: 44px;
  line-height: 44px;
  position: absolute;
  right: 0;
  top: 0;
  text-decoration: none;
  text-align: center;
  opacity: 0.65;
  padding: 0 0 18px 10px;
  color: #FFF;
  font-style: normal;
  font-size: 28px;
  font-family: Arial, Baskerville, monospace;
}

.mfp-close:hover,
.mfp-close:focus {
  opacity: 1;
}

.mfp-close:active {
  top: 1px;
}

.mfp-close-btn-in .mfp-close {
  color: #333;
}

.mfp-image-holder .mfp-close,
.mfp-iframe-holder .mfp-close {
  color: #FFF;
  right: -6px;
  text-align: right;
  padding-right: 6px;
  width: 100%;
}

.mfp-counter {
  position: absolute;
  top: 0;
  right: 0;
  color: #CCC;
  font-size: 12px;
  line-height: 18px;
  white-space: nowrap;
}

.mfp-arrow {
  position: absolute;
  opacity: 0.65;
  margin: 0;
  top: 53%;
  margin-top: -55px;
  padding: 0;
  width: 90px;
  height: 110px;
  -webkit-tap-highlight-color: transparent;
}

.mfp-arrow:active {
  margin-top: -54px;
}

.mfp-arrow:hover,
.mfp-arrow:focus {
  opacity: 1;
}

.mfp-arrow:before {
  content: "";
  display: block;
  width: 0;
  height: 0;
  position: absolute;
  left: 0;
  top: 0;
  margin-top: 35px;
  margin-left: 35px;
  border: medium inset transparent;
}

.mfp-arrow:after {
  content: "";
  display: block;
  width: 0;
  height: 0;
  position: absolute;
  left: 0;
  top: 0;
  margin-top: 35px;
  margin-left: 35px;
  border: medium inset transparent;
  border-top-width: 13px;
  border-bottom-width: 13px;
  top: 8px;
}

.mfp-arrow:before {
  border-top-width: 21px;
  border-bottom-width: 21px;
  opacity: 0.7;
}

.mfp-arrow-left {
  left: 0;
}

.mfp-arrow-left:after {
  border-right: 17px solid #FFF;
  margin-left: 31px;
}

.mfp-arrow-left:before {
  margin-left: 25px;
  border-right: 27px solid #3F3F3F;
}

.mfp-arrow-right {
  right: 0;
}

.mfp-arrow-right:after {
  border-left: 17px solid #FFF;
  margin-left: 39px;
}

.mfp-arrow-right:before {
  border-left: 27px solid #3F3F3F;
}

.mfp-iframe-holder {
  padding-top: 40px;
  padding-bottom: 40px;
}

.mfp-iframe-holder .mfp-content {
  line-height: 0;
  width: 100%;
  max-width: 900px;
}

.mfp-iframe-holder .mfp-close {
  top: -40px;
}

.mfp-iframe-scaler {
  width: 100%;
  height: 0;
  overflow: hidden;
  padding-top: 56.25%;
}

.mfp-iframe-scaler iframe {
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
  background: #000;
}

/* Main image in popup */

img.mfp-img {
  width: auto;
  max-width: 100%;
  height: auto;
  display: block;
  line-height: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 100px 0 40px;
  margin: -100px auto 0;
}

/* The shadow behind the image */

.mfp-figure {
  line-height: 0;
}

.mfp-figure:after {
  content: "";
  position: absolute;
  left: 0;
  top: 100px;
  bottom: 40px;
  display: block;
  right: 0;
  width: auto;
  height: auto;
  z-index: -1;
  -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
  background: #444;
}

.mfp-figure small {
  color: #BDBDBD;
  display: block;
  font-size: 12px;
  line-height: 14px;
}

.mfp-figure figure {
  margin: 0;
}

.mfp-bottom-bar {
  margin-top: -36px;
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  cursor: auto;
}

.mfp-title {
  text-align: left;
  line-height: 18px;
  color: #F3F3F3;
  word-wrap: break-word;
  padding-right: 36px;
}

.mfp-image-holder .mfp-content {
  max-width: 100%;
}

.mfp-gallery .mfp-image-holder .mfp-figure {
  cursor: pointer;
}

/* overlay at start */

.mfp-fade.mfp-bg {
  opacity: 0;
  -webkit-transition: all 0.15s ease-out;
  transition: all 0.15s ease-out;
}

/* overlay animate in */

.mfp-fade.mfp-bg.mfp-ready {
  opacity: 0.8;
}

/* overlay animate out */

.mfp-fade.mfp-bg.mfp-removing {
  opacity: 0;
}

/* content at start */

.mfp-fade.mfp-wrap .mfp-content {
  opacity: 0;
  -webkit-transition: all 0.15s ease-out;
  transition: all 0.15s ease-out;
}

/* content animate it */

.mfp-fade.mfp-wrap.mfp-ready .mfp-content {
  opacity: 1;
  margin-top: 60px;
  padding-top: 40px;
}

/* content animate out */

.mfp-fade.mfp-wrap.mfp-removing .mfp-content {
  opacity: 0;
}

/*----------------------------------------
	tooltip
----------------------------------------*/

body {
  /*.ui-tooltip:after {
  	margin: 0 0 0 -5px;
  	content: "";
  	position: absolute;
  	top: -20px;
  	left: 18px;
  	width: 0;
  	height: 0;
  	border-top: 10px solid transparent;
  	border-right: 5px solid  transparent;
  	border-left: 5px solid transparent;
  	border-bottom: 10px solid $md-grey-800;
  	border-bottom-color: rgba($md-black, .8);

  	@include tablet-s {
  		display: none;
  	}

  	@include sp {
  		display: none;
  	}
  }*/
}

body .ui-tooltip {
  padding: 12px;
  line-height: 140%;
  display: none;
  background: rgba(0, 0, 0, 0.9);
  border-radius: 4px;
  border: none;
  font-size: 14px;
  font-size: 0.875rem;
  font-weight: 500;
  color: #ffffff;
  z-index: 1;
  text-align: left;
  position: absolute;
}

body .ui-tooltip-content {
  color: #ffffff;
  font-size: 14px;
  font-size: 0.875rem;
  font-weight: 400;
}

/*----------------------------------------
	tablesorter
----------------------------------------*/

/* overall */

.tablesorter-blue {
  /* tbody > tr {
  	&.hover > td {
  		background-color: #d9d9d9;
  	}
  	&:hover {
  		> td {
  			background-color: #d9d9d9;
  		}
  		+ tr.tablesorter-childRow {
  			> td, + tr.tablesorter-childRow > td {
  				background-color: #d9d9d9;
  			}
  		}
  	}
  	&.even {
  		&.hover > td {
  			background-color: #d9d9d9;
  		}
  		&:hover {
  			> td {
  				background-color: #d9d9d9;
  			}
  			+ tr.tablesorter-childRow {
  				> td, + tr.tablesorter-childRow > td {
  					background-color: #d9d9d9;
  				}
  			}
  		}
  	}
  	&.odd {
  		&.hover > td {
  			background-color: #bfbfbf;
  		}
  		&:hover {
  			> td {
  				background-color: #bfbfbf;
  			}
  			+ tr.tablesorter-childRow {
  				> td, + tr.tablesorter-childRow > td {
  					background-color: #bfbfbf;
  				}
  			}
  		}
  	}
  } */
  /* tbody tr {
  	&.odd > td {
  		background-color: #ebf2fa;
  	}
  	&.even > td {
  		background-color: #fff;
  	}
  }

  td.primary {
  	background-color: #99b3e6;
  }

  tr {
  	&.odd td.primary {
  		background-color: #99b3e6;
  	}
  	&.even td.primary {
  		background-color: #c2d1f0;
  	}
  }

  td.secondary {
  	background-color: #c2d1f0;
  }

  tr {
  	&.odd td.secondary {
  		background-color: #c2d1f0;
  	}
  	&.even td.secondary {
  		background-color: #d6e0f5;
  	}
  }

  td.tertiary {
  	background-color: #d6e0f5;
  }
  tr {
  	&.odd td.tertiary {
  		background-color: #d6e0f5;
  	}
  	&.even td.tertiary {
  		background-color: #ebf0fa;
  	}
  } */
}

.tablesorter-blue .header,
.tablesorter-blue .tablesorter-header {
  /* black (unsorted) double arrow */
  background-image: url(data:image/gif;base64,R0lGODlhFQAJAIAAACMtMP///yH5BAEAAAEALAAAAAAVAAkAAAIXjI+AywnaYnhUMoqt3gZXPmVg94yJVQAAOw==);
  /* white (unsorted) double arrow */
  /* background-image: url(data:image/gif;base64,R0lGODlhFQAJAIAAAP///////yH5BAEAAAEALAAAAAAVAAkAAAIXjI+AywnaYnhUMoqt3gZXPmVg94yJVQAAOw==); */
  /* image */
  /* background-image: url(images/black-unsorted.gif); */
  background-repeat: no-repeat;
  background-position: center right;
  padding-right: 18px;
  cursor: pointer;
}

.tablesorter-blue .headerSortUp,
.tablesorter-blue .tablesorter-headerSortUp,
.tablesorter-blue .tablesorter-headerAsc {
  background-color: rgba(224, 247, 250, 0.5);
  /* black asc arrow */
  background-image: url(data:image/gif;base64,R0lGODlhFQAEAIAAACMtMP///yH5BAEAAAEALAAAAAAVAAQAAAINjI8Bya2wnINUMopZAQA7);
  /* white asc arrow */
  /* background-image: url(data:image/gif;base64,R0lGODlhFQAEAIAAAP///////yH5BAEAAAEALAAAAAAVAAQAAAINjI8Bya2wnINUMopZAQA7); */
  /* image */
  /* background-image: url(images/black-asc.gif); */
}

.tablesorter-blue .headerSortDown,
.tablesorter-blue .tablesorter-headerSortDown,
.tablesorter-blue .tablesorter-headerDesc {
  background-color: rgba(224, 247, 250, 0.5);
  /* black desc arrow */
  background-image: url(data:image/gif;base64,R0lGODlhFQAEAIAAACMtMP///yH5BAEAAAEALAAAAAAVAAQAAAINjB+gC+jP2ptn0WskLQA7);
  /* white desc arrow */
  /* background-image: url(data:image/gif;base64,R0lGODlhFQAEAIAAAP///////yH5BAEAAAEALAAAAAAVAAQAAAINjB+gC+jP2ptn0WskLQA7); */
  /* image */
  /* background-image: url(images/black-desc.gif); */
}

.tablesorter-blue thead .sorter-false {
  padding: 3px 5px;
  background-image: none;
  cursor: default;
}

.tablesorter-blue tfoot .tablesorter-headerSortUp,
.tablesorter-blue tfoot .tablesorter-headerSortDown,
.tablesorter-blue tfoot .tablesorter-headerAsc,
.tablesorter-blue tfoot .tablesorter-headerDesc {
  /* remove sort arrows from footer */
  background-image: none;
}

.tablesorter-blue .tablesorter-processing {
  background-position: center center !important;
  background-repeat: no-repeat !important;
  /* background-image: url(images/loading.gif) !important; */
  background-image: url("data:image/gif;base64,R0lGODlhFAAUAKEAAO7u7lpaWgAAAAAAACH/C05FVFNDQVBFMi4wAwEAAAAh+QQBCgACACwAAAAAFAAUAAACQZRvoIDtu1wLQUAlqKTVxqwhXIiBnDg6Y4eyx4lKW5XK7wrLeK3vbq8J2W4T4e1nMhpWrZCTt3xKZ8kgsggdJmUFACH5BAEKAAIALAcAAAALAAcAAAIUVB6ii7jajgCAuUmtovxtXnmdUAAAIfkEAQoAAgAsDQACAAcACwAAAhRUIpmHy/3gUVQAQO9NetuugCFWAAAh+QQBCgACACwNAAcABwALAAACE5QVcZjKbVo6ck2AF95m5/6BSwEAIfkEAQoAAgAsBwANAAsABwAAAhOUH3kr6QaAcSrGWe1VQl+mMUIBACH5BAEKAAIALAIADQALAAcAAAIUlICmh7ncTAgqijkruDiv7n2YUAAAIfkEAQoAAgAsAAAHAAcACwAAAhQUIGmHyedehIoqFXLKfPOAaZdWAAAh+QQFCgACACwAAAIABwALAAACFJQFcJiXb15zLYRl7cla8OtlGGgUADs=") !important;
}

/* header */

/* tfoot */

/* tbody */

/* hovered row colors
you'll need to add additional lines for
rows with more than 2 child rows
*/

/* table processing indicator */

/* Zebra Widget - row alternating colors */

/* Column Widget - column sort colors */

/* caption */

caption {
  background-color: #ffffff;
}

/* filter widget */

.tablesorter-blue .tablesorter-filter-row {
  background-color: #f5f5f5;
}

.tablesorter-blue .tablesorter-filter-row td {
  background-color: #f5f5f5;
  line-height: normal;
  text-align: center;
  /* center the input */
  -webkit-transition: line-height 0.1s ease;
  transition: line-height 0.1s ease;
}

.tablesorter-blue .tablesorter-filter-row .disabled {
  opacity: 0.5;
  filter: alpha(opacity=50);
  cursor: not-allowed;
}

.tablesorter-blue .tablesorter-filter-row.hideme td {
  /*** *********************************************** ***/
  /*** change this padding to modify the thickness     ***/
  /*** of the closed filter row (height = padding x 2) ***/
  padding: 2px;
  /*** *********************************************** ***/
  margin: 0;
  line-height: 0;
  cursor: pointer;
}

.tablesorter-blue .tablesorter-filter-row.hideme * {
  height: 1px;
  min-height: 0;
  border: 0;
  padding: 0;
  margin: 0;
  /* don't use visibility: hidden because it disables tabbing */
  opacity: 0;
  filter: alpha(opacity=0);
}

.tablesorter-blue input.tablesorter-filter,
.tablesorter-blue select.tablesorter-filter {
  width: 98%;
  height: auto;
  margin: 0;
  padding: 4px;
  background-color: #ffffff;
  color: #212121;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: height 0.1s ease;
  transition: height 0.1s ease;
}

/* optional disabled input styling */

/* hidden filter row */

/* filters */

/* rows hidden by filtering (needed for child rows) */

.tablesorter .filtered {
  display: none;
}

.tablesorter .tablesorter-errorRow td {
  text-align: center;
  cursor: pointer;
  background-color: #ffe0b2;
}

/* ajax error row */

.blockUI.blockMsg.blockPage {
  padding: 0 !important;
  width: 120px !important;
  height: auto !important;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
  -webkit-box-orient: vertical !important;
  -webkit-box-direction: normal !important;
  -ms-flex-direction: column !important;
  flex-direction: column !important;
  -webkit-box-pack: center !important;
  -ms-flex-pack: center !important;
  justify-content: center !important;
  -webkit-box-align: center !important;
  -ms-flex-align: center !important;
  align-items: center !important;
  aspect-ratio: 1/1;
  background: #ffffff !important;
  border: none !important;
  border-radius: 12px;
  text-align: center;
  top: 50% !important;
  left: 50% !important;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.blockUI.blockMsg.blockPage #loading-msg {
  margin-top: -1px;
  color: #00ACC1 !important;
  font-weight: 700;
}

.btn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border-radius: 4px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background: #f5f5f5;
  border: 1px solid #e0e0e0;
  font-size: 12px;
  font-size: 0.75rem;
  color: #212121;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  white-space: nowrap;
  position: relative;
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
  font-weight: 400;
  /* btn color */
}

.btn.btnColor-red {
  background: #e53935;
  border: 1px solid #d32f2f;
}

.btn.btnColor-pink {
  background: #d81b60;
  border: 1px solid #c2185b;
}

.btn.btnColor-purple {
  background: #8e24aa;
  border: 1px solid #7b1fa2;
}

.btn.btnColor-deep-purple {
  background: #5e35b1;
  border: 1px solid #512da8;
}

.btn.btnColor-indigo {
  background: #3949ab;
  border: 1px solid #303f9f;
}

.btn.btnColor-blue {
  background: #1e88e5;
  border: 1px solid #1976d2;
}

.btn.btnColor-light-blue {
  background: #039be5;
  border: 1px solid #0288d1;
}

.btn.btnColor-teal {
  background: #00897b;
  border: 1px solid #00796b;
}

.btn.btnColor-green {
  background: #43a047;
  border: 1px solid #388e3c;
}

.btn.btnColor-light-green {
  background: #7cb342;
  border: 1px solid #689f38;
}

.btn.btnColor-lime {
  background: #c0ca33;
  border: 1px solid #afb42b;
}

.btn.btnColor-yellow {
  background: #fdd835;
  border: 1px solid #fbc02d;
}

.btn.btnColor-amber {
  background: #ffb300;
  border: 1px solid #ffa000;
}

.btn.btnColor-orange {
  background: #fb8c00;
  border: 1px solid #f57c00;
}

.btn.btnColor-deep-orange {
  background: #f4511e;
  border: 1px solid #e64a19;
}

.btn.btnColor-brown {
  background: #6d4c41;
  border: 1px solid #5d4037;
}

.btn.btnColor-grey {
  background: #757575;
  border: 1px solid #616161;
}

.btn.btnColor-blue-grey {
  background: #546e7a;
  border: 1px solid #455a64;
}

.btn.btnColor-black {
  background: #212121;
  border: 1px solid #424242;
}

.btn.btnColor-white {
  background: #fafafa;
  border: 1px solid #eeeeee;
  color: #212121;
}

.btn.btnFont-color-white {
  color: #ffffff;
}

.btn.btnFont-color-white * {
  color: #ffffff;
}

.btn.btnFont-color-black {
  color: #212121;
}

.btn.btnFont-color-black * {
  color: #212121;
}

/* .icon {
	&:before {
		margin: 0 auto;
		content: '';
		display: inline-block;
		transition: all 0.5s ease;
		position: relative;
	}

	&-plus {
		&:before {
			width: 18px;
			height: 18px;
			background: url(../images/common/icon_plus.png) no-repeat;
		}
	}
} */

.iconCircle {
  width: 20px;
  height: 20px;
  line-height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border-radius: 50%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 12px;
  font-size: 0.75rem;
  font-weight: 500;
}

.iconCircle-inline {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
}

.iconCircle-cyan {
  background: #00acc1;
  color: #ffffff;
}

.iconCircle-white-cyan {
  background: #ffffff;
  border: 1px solid #00acc1;
  color: #00acc1;
}

.iconCircle-grey {
  background: #757575;
  color: #ffffff;
}

.iconCircle-white-grey {
  background: #ffffff;
  border: 1px solid #757575;
  color: #757575;
}

.iconCircle-red {
  background: #e57373;
  color: #ffffff;
}

.iconCircle-white-red {
  background: #ffffff;
  border: 1px solid #e57373;
  color: #e57373;
}

.iconCircle-yellow {
  background: #fbc02d;
  color: #ffffff;
}

.iconCircle-white-yellow {
  background: #ffffff;
  border: 1px solid #fbc02d;
  color: #fbc02d;
}

.iconCircle-green {
  background: #43a047;
  color: #ffffff;
}

.iconCircle-white-green {
  background: #ffffff;
  border: 1px solid #43a047;
  color: #43a047;
}

.iconCircle-purple {
  background: #8e24aa;
  color: #ffffff;
}

.iconCircle-white-purple {
  background: #ffffff;
  border: 1px solid #8e24aa;
  color: #8e24aa;
}

.iconCircle-blue {
  background: #1e88e5;
  color: #ffffff;
}

.iconCircle-white-blue {
  background: #ffffff;
  border: 1px solid #1e88e5;
  color: #1e88e5;
}

.iconCircle-orange {
  background: #fb8c00;
  color: #ffffff;
}

.iconCircle-white-orange {
  background: #ffffff;
  border: 1px solid #fb8c00;
  color: #fb8c00;
}

.fa-question-circle {
  margin: 0 5px;
  font-size: 18px;
  font-size: 1.125rem;
  position: relative;
  top: 2px;
}

.baseTable {
  width: 100%;
  background: #ffffff;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.baseTable th,
.baseTable td {
  padding: 10px;
  line-height: 120%;
  border: 1px solid #e0e0e0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  vertical-align: top;
}

.baseTable td {
  vertical-align: middle;
}

.baseTable th {
  background: #fafafa;
  font-weight: 500;
  text-align: center;
}

.baseTable-sp tr {
  display: block;
  width: 100%;
}

.baseTable-sp th,
.baseTable-sp td {
  margin-top: -1px;
  display: block;
  width: 100%;
}

.baseTable-hover tbody tr {
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
  cursor: pointer;
}

.baseTable-hover tbody tr:hover {
  background: rgba(224, 247, 250, 0.5) !important;
}

input,
select {
  padding: 2px 4px;
  height: 24px;
  font-size: 12px;
  font-size: 0.75rem;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 4px;
  background: #ffffff;
  border: 1px solid #e0e0e0;
  vertical-align: top;
  font-family: "Noto Sans JP", "Noto Sans", sans-serif;
}

input:-moz-placeholder, select:-moz-placeholder {
  color: #bdbdbd;
  font-size: 12px;
  font-size: 0.75rem;
}

input:-ms-input-placeholder, select:-ms-input-placeholder {
  color: #bdbdbd;
  font-size: 12px;
  font-size: 0.75rem;
}

input:placeholder-shown,
select:placeholder-shown {
  color: #bdbdbd;
  font-size: 12px;
  font-size: 0.75rem;
}

input:-moz-placeholder:empty, select:-moz-placeholder:empty {
  color: #212121;
}

input:-ms-input-placeholder:empty, select:-ms-input-placeholder:empty {
  color: #212121;
}

input:placeholder-shown:empty,
select:placeholder-shown:empty {
  color: #212121;
}

input::-webkit-input-placeholder,
select::-webkit-input-placeholder {
  color: #bdbdbd;
  font-size: 12px;
  font-size: 0.75rem;
}

input::-webkit-input-placeholder:empty,
select::-webkit-input-placeholder:empty {
  color: #212121;
}

input:-moz-placeholder,
select:-moz-placeholder {
  opacity: 1;
  color: #bdbdbd;
  font-size: 12px;
  font-size: 0.75rem;
}

input:-moz-placeholder:empty,
select:-moz-placeholder:empty {
  color: #212121;
}

input::-moz-placeholder,
select::-moz-placeholder {
  opacity: 1;
  color: #bdbdbd;
  font-size: 12px;
  font-size: 0.75rem;
}

input::-moz-placeholder:empty,
select::-moz-placeholder:empty {
  color: #212121;
}

input:-ms-input-placeholder,
select:-ms-input-placeholder {
  color: #bdbdbd;
  font-size: 12px;
  font-size: 0.75rem;
}

input:-ms-input-placeholder:empty,
select:-ms-input-placeholder:empty {
  color: #212121;
}

input:focus,
select:focus {
  outline: 0;
  background: rgba(224, 247, 250, 0.3);
}

input:disabled,
select:disabled {
  background: #f5f5f5;
  color: #bdbdbd;
  cursor: default;
}

input[type=search] {
  -webkit-appearance: none;
}

input[type=time] {
  font-family: "Noto Sans JP", "Noto Sans", sans-serif;
}

label {
  cursor: pointer;
}

button {
  font-family: "Noto Sans JP", "Noto Sans", sans-serif;
}

button:focus {
  outline: 0;
}

button:disabled {
  background: #f5f5f5;
  border: 1px solid #f5f5f5;
  color: #bdbdbd !important;
  cursor: default;
  pointer-events: none;
}

button:disabled * {
  color: #bdbdbd !important;
}

button i {
  position: relative;
  top: 1px;
}

textarea {
  padding: 4px 6px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 4px;
  background: #ffffff;
  border: 1px solid #e0e0e0;
  font-family: "Noto Sans JP", "Noto Sans", sans-serif;
}

textarea:-moz-placeholder {
  color: #bdbdbd;
  font-size: 12px;
  font-size: 0.75rem;
}

textarea:-ms-input-placeholder {
  color: #bdbdbd;
  font-size: 12px;
  font-size: 0.75rem;
}

textarea:placeholder-shown {
  color: #bdbdbd;
  font-size: 12px;
  font-size: 0.75rem;
}

textarea::-webkit-input-placeholder {
  color: #bdbdbd;
  font-size: 12px;
  font-size: 0.75rem;
}

textarea:-moz-placeholder {
  opacity: 1;
  color: #bdbdbd;
  font-size: 12px;
  font-size: 0.75rem;
}

textarea::-moz-placeholder {
  opacity: 1;
  color: #bdbdbd;
  font-size: 12px;
  font-size: 0.75rem;
}

textarea:-ms-input-placeholder {
  color: #bdbdbd;
  font-size: 12px;
  font-size: 0.75rem;
}

textarea:focus {
  outline: 0;
  background: rgba(224, 247, 250, 0.3);
}

textarea:disabled {
  background: #f5f5f5;
  cursor: default;
  color: #bdbdbd;
}

.checkboxInput {
  display: none;
}

.checkboxInput:checked + .checkboxInput-style {
  color: #00acc1;
}

.checkboxInput:checked + .checkboxInput-style:after {
  content: "";
  width: 6px;
  height: 12px;
  display: block;
  border-bottom: 4px solid #00acc1;
  border-right: 4px solid #00acc1;
  -webkit-transform: rotate(40deg);
  transform: rotate(40deg);
  position: absolute;
  top: -3px;
  left: 5px;
  cursor: pointer;
}

.checkboxInput:disabled {
  cursor: default;
}

.checkboxInput:disabled + .checkboxInput-style {
  color: #bdbdbd;
}

.checkboxInput:disabled + .checkboxInput-style:before {
  background: #e0e0e0;
  border: 1px solid #e0e0e0;
  -webkit-box-shadow: 0 0 0 2px #e0e0e0 inset;
  box-shadow: 0 0 0 2px #e0e0e0 inset;
}

.checkboxInput-style {
  padding-left: 22px;
  position: relative;
  white-space: nowrap;
  top: -1px;
}

.checkboxInput-style:before {
  content: "";
  display: block;
  width: 16px;
  height: 16px;
  background: #eceff1;
  -webkit-box-shadow: 0 0 0 2px white inset;
  box-shadow: 0 0 0 2px white inset;
  border: 1px solid #b0bec5;
  border-radius: 2px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: absolute;
  top: 2px;
  left: 0;
  cursor: pointer;
}

.checkboxInput-style-noText {
  padding-left: 15px;
}

.radioInput {
  display: none;
}

.radioInput:checked + .radioInput-style {
  color: #00acc1;
}

.radioInput:checked + .radioInput-style:after {
  content: "";
  width: 10px;
  height: 10px;
  display: block;
  background: #00acc1;
  border-radius: 50%;
  position: absolute;
  top: 5px;
  left: 3px;
  cursor: pointer;
}

.radioInput:checked + .radioInput-style-reverse:after {
  content: "";
  width: 10px;
  height: 10px;
  display: block;
  background: #00acc1;
  border-radius: 50%;
  position: absolute;
  top: 5px;
  right: 3px;
  cursor: pointer;
}

.radioInput:disabled {
  cursor: default;
}

.radioInput:disabled + .radioInput-style {
  color: #bdbdbd;
}

.radioInput:disabled + .radioInput-style:before {
  background: #e0e0e0;
  border: 1px solid #e0e0e0;
}

.radioInput-style {
  margin-right: 20px;
  padding-left: 22px;
  position: relative;
  white-space: nowrap;
}

.radioInput-style:before {
  content: "";
  display: block;
  width: 16px;
  height: 16px;
  background: #eceff1;
  -webkit-box-shadow: 0 0 0 2px white inset;
  box-shadow: 0 0 0 2px white inset;
  border: 1px solid #b0bec5;
  border-radius: 50%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: absolute;
  top: 2px;
  left: 0;
  cursor: pointer;
}

.radioInput-style-reverse {
  margin-right: 20px;
  padding-right: 22px;
  display: inline-block;
  position: relative;
  white-space: nowrap;
}

.radioInput-style-reverse:before {
  content: "";
  display: block;
  width: 16px;
  height: 16px;
  background: #eceff1;
  -webkit-box-shadow: 0 0 0 2px white inset;
  box-shadow: 0 0 0 2px white inset;
  border: 1px solid #b0bec5;
  border-radius: 50%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: absolute;
  top: 2px;
  right: 0;
  cursor: pointer;
}

.btnContainer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.btnContainer .btn:first-child {
  margin-left: 0;
}

.btnContainer-top {
  margin: 20px;
}

.btnContainer-start {
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
}

.btnContainer-end {
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

.ui-autocomplete .ui-menu-item {
  text-align: left;
}

.ui-autocomplete .ui-menu-item a {
  text-align: left;
}

.pagetop {
  position: fixed;
  bottom: 80px;
  right: 20px;
}

.pagetop a {
  width: 60px;
  height: 60px;
  display: block;
  border-radius: 4px;
  background: #263238;
  text-align: center;
  text-decoration: none;
  position: relative;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}

.pagetop a:hover {
  opacity: 0.5;
  filter: alpha(opacity=50);
}

.pagetop a:before {
  content: "";
  width: 60px;
  height: 60px;
  display: block;
  background: url(../images/common/arrow_btn.png) no-repeat center;
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
  position: absolute;
  top: 0;
}

.pagenation {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  flex-direction: row;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.pagenation-total {
  margin-left: 20px;
  font-size: 14px;
  font-size: 0.875rem;
}

.pagenationBtn {
  width: 150px;
  height: 42px;
  font-size: 16px;
  font-size: 1rem;
}

.pagenationBtn i {
  margin-right: 5px;
}

.tag {
  margin: 0 10px;
  padding: 0 5px;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border-radius: 4px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  height: 18px;
  text-align: center;
  font-size: 12px;
  font-size: 0.75rem;
  font-weight: 500;
  color: #ffffff;
}

.tag-new {
  background: #e53935;
}

.tag-paid {
  background: #00897b;
}

.tag-required {
  background: #00acc1;
}

.tag-visit {
  background: #039be5;
  border: 1px solid #0288d1;
}

.tag-plan-free {
  height: 22px;
  background: #00acc1;
  border: 1px solid #0097a7;
}

.tag-plan-paid {
  height: 22px;
  background: #00897b;
  border: 1px solid #00796b;
}

.tag-prospects {
  padding: 0 3px;
  height: 16px;
  background: #ffffff;
  border: 1px solid #1976d2;
  color: #1976d2;
  font-size: 10px;
  font-size: 0.625rem;
}

.tag-orders {
  padding: 0 3px;
  height: 16px;
  background: #ffffff;
  border: 1px solid #689f38;
  color: #689f38;
  font-size: 10px;
  font-size: 0.625rem;
}

/*----------------------------------------
	body
----------------------------------------*/

html,
body {
  width: 100%;
  height: 100%;
}

body {
  font-family: "Noto Sans JP", "Noto Sans", sans-serif;
  font-size: 12px;
  font-size: 0.75rem;
  color: #212121;
  text-align: center;
  line-height: 160%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-weight: 400;
}

body.fixed {
  position: fixed;
  width: 100%;
  height: 100vh;
  z-index: 0;
}

a {
  color: #00acc1;
  outline: none;
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

a * {
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

a:hover {
  color: #006064;
}

a:active {
  color: #00acc1;
}

.clearfix {
  min-height: 1px;
  _height: 1%;
}

.clearfix:after {
  content: "";
  clear: both;
  height: 0;
  display: block;
  visibility: hidden;
}

.wrapper {
  width: 100%;
  height: auto !important;
  height: 100%;
  min-height: 100%;
  position: relative;
}

/*----------------------------------------
	container
----------------------------------------*/

.container {
  margin: 0 auto;
  width: 100%;
  text-align: left;
  position: relative;
}

#contents {
  padding: 53px 0 30px;
  min-height: 100%;
  text-align: left;
}

.contentsHeader {
  width: 100%;
  background: #ffffff;
  position: fixed;
  top: 53px;
  left: 0;
  right: 0;
  z-index: 9;
}

.contentsHeader.headerLine {
  -webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.15);
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.15);
}

.contentsHeaderContainer {
  padding: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.contentsHeaderHead {
  margin-right: 20px;
  font-size: 18px;
  font-size: 1.125rem;
  font-weight: 700;
  position: relative;
  top: -2px;
  white-space: nowrap;
}

.contentsHeaderHead i {
  margin-left: 5px;
}

.contentsHeaderHeadSub {
  margin-right: auto;
}

.contentsContainer {
  padding: 0 10px 20px;
  position: relative;
}

.contentsHeaderBox {
  width: 100%;
  position: relative;
}

.contentsHeaderBoxInner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

.contentsHeaderBtn {
  margin-left: 10px;
  padding: 0 5px;
  width: 140px;
  min-width: 32px;
  height: 32px;
  background: #f5f5f5;
  border: 1px solid #e0e0e0;
  font-size: 13px;
  font-size: 0.8125rem;
  color: #212121;
}

.contentsHeaderBtn:hover {
  color: #212121;
}

.contentsHeaderBtn i {
  margin-right: 5px;
}

.contentsHeaderBtn-small {
  width: 110px;
}

.contentsHeaderBtn-action {
  background: #00acc1;
  border: 1px solid #0097a7;
  color: #ffffff;
}

.contentsHeaderBtn-action:hover {
  color: #ffffff;
}

.contentsHeaderBtn-action span,
.contentsHeaderBtn-action i {
  color: #ffffff;
}

.contentsHeaderBtn-change {
  background: #00acc1;
  border: 1px solid #0097a7;
  color: #ffffff;
}

.contentsHeaderBtn-change:hover {
  color: #ffffff;
}

.contentsHeaderBtn-change * {
  color: #ffffff;
}

.contentsHeaderBtn-total {
  padding: 0 6px;
  width: auto;
  line-height: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background: #263238;
  border: 1px solid #212121;
  color: #ffffff;
  font-weight: 400;
  cursor: default;
}

.contentsHeaderBtn-total:hover {
  color: #ffffff;
}

.contentsHeaderBtn-easy {
  background: #00acc1;
  border: 1px solid #0097a7;
  color: #ffffff;
}

.contentsHeaderBtn-easy:hover {
  color: #ffffff;
}

.contentsHeaderBtn-easy * {
  color: #ffffff;
}

.contentsHeaderBtn-order {
  background: #fb8c00;
  border: 1px solid #f57c00;
  color: #ffffff;
}

.contentsHeaderBtn-order:hover {
  color: #ffffff;
}

.contentsHeaderBtn-order * {
  color: #ffffff;
}

.contentsHeaderBtn-close {
  background: #424242;
  border: 1px solid #212121;
}

.contentsHeaderBtn-close * {
  color: #ffffff;
}

.contentsHeaderBtn-close i {
  margin-right: 5px;
  color: #ffffff;
  position: relative;
  top: 1px;
}

.contentsHeaderBtn-other {
  width: 120px;
  position: relative;
}

.contentsHeaderBtn-other.selected i {
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
  position: relative;
  top: -1px;
}

.contentsHeaderBtnList {
  padding-bottom: 4px;
  width: calc(100% + 2px);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: none;
  position: absolute;
  top: 32px;
  left: -1px;
  background: #f5f5f5;
  border: 1px solid #e0e0e0;
  border-radius: 4px;
  text-align: left;
  z-index: 1;
}

.contentsHeaderBtnList .btnChildren {
  padding-left: 34px;
  height: 32px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border: none;
  background: none;
  cursor: pointer;
  position: relative;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

.contentsHeaderBtnList .btnChildren i {
  position: absolute;
  top: 50%;
  left: 17px;
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

.contentsHeaderBtnList .btnChildren .fa-home {
  left: 15px;
}

.contentsHeaderBtnList .btnChildren:hover {
  color: #0097a7;
}

.contentsHeaderBtnList .btnChildren:hover i {
  color: #0097a7;
}

.contentsHeaderBtnList .btnChildren.btnDelete {
  color: #c62828;
}

.contentsHeaderBtnList .btnChildren.btnDelete i {
  color: #c62828;
}

.contentsHeaderBtnList .btnChildren.btnDelete:hover {
  color: #ef5350;
}

.contentsHeaderBtnList .btnChildren.btnDelete:hover i {
  color: #ef5350;
}

.contentsSubHeader {
  padding: 0 10px 10px;
  width: 100%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.contentsSubHeaderContainer {
  padding: 0 0 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border-bottom: 1px dashed #e0e0e0;
}

.contentsSubHeaderHead {
  font-size: 16px;
  font-size: 1rem;
  position: relative;
}

.contentsSubHeaderHead i {
  margin-right: 5px;
}

/*----------------------------------------
	base cards
----------------------------------------*/

.baseCardsContainer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.baseCardsBox {
  width: 33.333%;
}

.baseCardsBox-30 {
  width: 30%;
}

.baseCardsBox-40 {
  width: 40%;
}

.baseCardsBox-50 {
  width: 50%;
}

.baseCardsBox-60 {
  width: 60%;
}

.baseCardsBox-70 {
  width: 70%;
}

.baseCardsBox-100 {
  width: 100%;
}

.baseCardsBoxInnner {
  margin: 0 10px 10px;
  min-height: 30px;
  background: #ffffff;
  position: relative;
}

.baseCardsContents {
  margin-bottom: 20px;
}

.baseCardsContents.ui-sortable-placeholder {
  border: 1px dashed #e0e0e0;
  background: #f5f5f5;
  visibility: visible !important;
}

.baseCardsContentsHead {
  padding: 0 40px 0 15px;
  width: 100%;
  height: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background: #eceff1;
  font-size: 16px;
  font-size: 1rem;
  position: relative;
  cursor: move;
}

.baseCardsContentsHead:before {
  content: "";
  width: 8px;
  height: 40px;
  display: block;
  background: #263238;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}

.baseCardsContentsHead:after {
  content: "";
  width: 100%;
  display: block;
  border: 1px solid #e0e0e0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  z-index: 0;
}

.baseCardsContentsHead-normal {
  cursor: inherit;
}

.baseCardsContentsHead-plan {
  padding: 0 0 0 15px;
}

.baseCardsContentsHeadText {
  margin-right: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  white-space: nowrap;
}

.baseCardsContentsHeadText i {
  margin-right: 4px;
}

.baseCardsContentsHeadText-small {
  margin-left: 8px;
  line-height: 120%;
  font-size: 12px;
  font-size: 0.75rem;
  word-break: break-all;
}

.baseCardsContentsHeadAttention {
  margin-right: -30px;
  padding: 0 10px;
  height: 28px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border-radius: 4px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background: #f5f5f5;
  border: 1px solid #e0e0e0;
  font-size: 12px;
  font-size: 0.75rem;
  color: #212121;
  text-align: center;
  font-weight: 400;
  z-index: 1;
  white-space: nowrap;
}

.baseCardsContentsHeadBtn {
  width: 40px;
  height: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
  cursor: pointer;
}

.baseCardsContentsHeadBtn-memo {
  margin: 0 0 0 auto;
  padding: 0 10px;
  width: auto;
  height: 28px;
  background: #212121;
  border: 1px solid #616161;
  color: #ffffff;
  font-size: 12px;
  font-size: 0.75rem;
  position: relative;
  z-index: 1;
}

.baseCardsContentsHeadBtn-copy {
  margin: 0 -30px 0 auto;
  padding: 0 10px;
  width: auto;
  height: 28px;
  background: #fb8c00;
  border: 1px solid #f57c00;
  color: #ffffff;
  font-size: 12px;
  font-size: 0.75rem;
  position: relative;
  z-index: 1;
}

.baseCardsContentsHeadBtn-copy .btnName {
  color: #ffffff;
}

.baseCardsContentsHeadBtn-copy i {
  margin-right: 5px;
  color: #ffffff;
}

.baseCardsContentsContainer {
  border: 1px solid #e0e0e0;
  border-top: none;
}

.baseCardsContentsContainer-h270 {
  max-height: 270px;
  -webkit-overflow-scrolling: touch;
  overflow-y: auto;
  /*@include sp {
  	max-height: inherit;
  	overflow: hidden;
  }*/
}

.baseCardsContentsContainer-h360 {
  max-height: 360px;
  -webkit-overflow-scrolling: touch;
  overflow-y: auto;
  /*@include sp {
  	max-height: inherit;
  	overflow: hidden;
  }*/
}

.baseCardsContentsContainer-h600 {
  max-height: 600px;
  -webkit-overflow-scrolling: touch;
  overflow-y: auto;
  /*@include sp {
  	max-height: inherit;
  	overflow: hidden;
  }*/
}

.baseCardsContentsInner {
  margin: 0 10px;
  padding: 10px 0;
}

.baseCardsContentsInner-xScroll {
  overflow-x: auto;
}

.baseCardsContentsInner-xScroll .baseTable th {
  white-space: nowrap;
}

.ui-widget-overlay {
  background: #000000;
  opacity: 0.7;
}

.ui-dialog .ui-dialog-title {
  width: 100%;
  font-size: 16px;
  font-size: 1rem;
}

/*----------------------------------------
	header
----------------------------------------*/

#header {
  width: 100%;
  height: 50px;
  background: #eceff1;
  border-bottom: 3px solid #263238;
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 9999;
}

#header .header {
  padding: 5px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  position: relative;
}

.headerCompany {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.headerCompany .headerCompanyName {
  margin: 0 10px;
  line-height: 100%;
  font-size: 16px;
  font-size: 1rem;
  font-weight: 700;
  text-align: left;
  word-break: break-all;
}

.headerCompany .headerCompanyLogo {
  width: auto;
  height: 40px;
  overflow: hidden;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.headerCompany .headerCompanyLogo img {
  max-width: 100%;
  height: auto;
}

.headerCompany .headerCompanyLogo img {
  height: 100%;
}

.headerCompany .headerCompanyLogo a {
  height: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.headerCompany .headerCompanyLogo-orderForm {
  width: auto;
  overflow: inherit;
}

.headerCompany .headerCompanyLogo-orderForm img {
  max-height: 40px;
}

.headerCompany .headerGemCaseLogo {
  width: 112px;
  height: 40px;
  overflow: hidden;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.headerCompany .headerGemCaseLogo img {
  max-width: 100%;
  height: auto;
}

.headerCompany a {
  color: #212121;
  text-decoration: none;
}

.headerCompany a:hover {
  opacity: 0.6;
}

.gNavNonMembers {
  margin-left: auto;
}

.gNavNonMembers .btnHTopNonMembersList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.gNavNonMembers .nonMembersBtn-signup {
  width: 120px;
  height: 32px;
  background: #8bc34a;
  border: 1px solid #7cb342;
  color: #ffffff;
}

.gNavNonMembers .nonMembersBtn-signup i {
  margin-right: 5px;
  position: relative;
  top: 1px;
  color: #ffffff;
}

.gNavNonMembers .nonMembersBtn-login {
  margin-left: 8px;
  width: 100px;
  height: 32px;
  background: #00bcd4;
  border: 1px solid #00acc1;
  color: #ffffff;
}

.gNavNonMembers .nonMembersBtn-login i {
  margin-right: 5px;
  position: relative;
  top: 1px;
  color: #ffffff;
}

.gNavNonMembers .nonMembersBtn-login-ec {
  margin-left: 8px;
  padding: 0 12px;
  min-width: 120px;
  height: 32px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background: #0d5d83;
  border: 1px solid #0d5d83;
  color: #ffffff;
}

.gNavNonMembers .nonMembersBtn-login-ec i {
  margin-right: 5px;
  position: relative;
  top: 1px;
  color: #ffffff;
}

.headerUser {
  height: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.headerUser .headerUserName {
  margin: 0 10px;
  font-size: 16px;
  font-size: 1rem;
  font-weight: 500;
  white-space: nowrap;
}

.headerUser .headerUserSite {
  margin: 0 5px;
  white-space: nowrap;
}

.headerUser .headerUserName-comment {
  font-size: 12px;
  font-size: 0.75rem;
}

.headerUser .headerUserAdmin {
  margin-left: 10px;
  position: relative;
}

.headerUser .headerUserAdminBtn {
  padding: 0 8px;
  height: 26px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background: #212121;
  border-radius: 4px;
  font-size: 13px;
  font-size: 0.8125rem;
  color: #ffffff;
  cursor: pointer;
}

.headerUser .headerUserAdminBtn i {
  margin-right: 4px;
  font-size: 11px;
  font-size: 0.6875rem;
  color: #ffffff;
}

.headerUser .headerUserAdminBtn span {
  color: #ffffff;
}

.headerUser .adminMenu {
  display: none;
  background: #212121;
  border-radius: 4px;
  position: absolute;
  top: 27px;
  left: 0;
  text-align: left;
}

.headerUser .adminMenu li a {
  padding: 0 10px;
  height: 32px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background: #212121;
  color: #ffffff;
  text-decoration: none;
  white-space: nowrap;
}

.headerUser .adminMenu li a:hover {
  background: #00acc1;
}

.headerUser .adminMenu li a i {
  margin-right: 5px;
  color: #ffffff;
}

.headerUser .adminMenu li:first-child a {
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}

.headerUser .adminMenu li:last-child a {
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
}

.gNav {
  margin-left: auto;
  height: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.gNavSearch {
  margin-right: 5px;
  position: relative;
  text-align: left;
}

.gNavSearch i {
  width: 30px;
  height: 30px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background: #b0bec5;
  border-radius: 50%;
  position: absolute;
  left: 0;
  font-size: 15px;
  font-size: 0.9375rem;
  color: #ffffff;
  z-index: -1;
}

.gNavSearch i:before {
  margin-left: -1px;
}

.gNavSearch-sp {
  padding: 5px 5px 5px 0;
  width: 100%;
  display: none;
  height: 40px;
  background: #b0bec5;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
  text-align: left;
  -webkit-box-ordinal-group: 2;
  -ms-flex-order: 1;
  order: 1;
}

.gNavSearch-sp i {
  width: 30px;
  height: 30px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background: #b0bec5;
  border-radius: 50%;
  position: absolute;
  left: 0;
  font-size: 15px;
  font-size: 0.9375rem;
  color: #ffffff;
  z-index: -1;
}

.gNavSearch-sp i:before {
  margin-left: -1px;
}

.gNavSearchBox {
  padding: 7px 0;
  width: 30px;
  height: 30px;
  line-height: 1;
  background: none;
  border: none;
  border-radius: 50%;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  cursor: pointer;
  color: #263238;
  font-size: 12px;
  font-size: 0.75rem;
  font-weight: 700;
}

.gNavSearchBox:-moz-placeholder {
  line-height: 130%;
  color: transparent;
}

.gNavSearchBox:-ms-input-placeholder {
  line-height: 130%;
  color: transparent;
}

.gNavSearchBox:placeholder-shown {
  line-height: 130%;
  color: transparent;
}

.gNavSearchBox::-webkit-input-placeholder {
  line-height: 130%;
  color: transparent;
}

.gNavSearchBox:-moz-placeholder {
  opacity: 1;
  line-height: 130%;
  color: transparent;
}

.gNavSearchBox::-moz-placeholder {
  opacity: 1;
  line-height: 130%;
  color: transparent;
}

.gNavSearchBox:-ms-input-placeholder {
  line-height: 130%;
  color: transparent;
}

.gNavSearchBox:focus {
  padding-left: 30px;
  width: 200px;
  background: #b0bec5;
  border-radius: 5px;
  outline: 0;
  cursor: default;
}

.gNavSearchBox:focus:-moz-placeholder {
  color: #607d8b;
  font-size: 12px;
  font-size: 0.75rem;
}

.gNavSearchBox:focus:-ms-input-placeholder {
  color: #607d8b;
  font-size: 12px;
  font-size: 0.75rem;
}

.gNavSearchBox:focus:placeholder-shown {
  color: #607d8b;
  font-size: 12px;
  font-size: 0.75rem;
}

.gNavSearchBox:focus::-webkit-input-placeholder {
  color: #607d8b;
  font-size: 12px;
  font-size: 0.75rem;
}

.gNavSearchBox:focus:-moz-placeholder {
  opacity: 1;
  color: #607d8b;
  font-size: 12px;
  font-size: 0.75rem;
}

.gNavSearchBox:focus::-moz-placeholder {
  opacity: 1;
  color: #607d8b;
  font-size: 12px;
  font-size: 0.75rem;
}

.gNavSearchBox:focus:-ms-input-placeholder {
  color: #607d8b;
  font-size: 12px;
  font-size: 0.75rem;
}

.gNavSearchBox.searchVal {
  padding-left: 30px;
  width: 200px;
  background: #b0bec5;
  border-radius: 5px;
  outline: 0;
  cursor: default;
  color: #263238;
}

.gNavSearchBox.searchVal:-moz-placeholder {
  font-size: 12px;
  font-size: 0.75rem;
}

.gNavSearchBox.searchVal:-ms-input-placeholder {
  font-size: 12px;
  font-size: 0.75rem;
}

.gNavSearchBox.searchVal:placeholder-shown {
  font-size: 12px;
  font-size: 0.75rem;
}

.gNavSearchBox.searchVal::-webkit-input-placeholder {
  font-size: 12px;
  font-size: 0.75rem;
}

.gNavSearchBox.searchVal:-moz-placeholder {
  opacity: 1;
  font-size: 12px;
  font-size: 0.75rem;
}

.gNavSearchBox.searchVal::-moz-placeholder {
  opacity: 1;
  font-size: 12px;
  font-size: 0.75rem;
}

.gNavSearchBox.searchVal:-ms-input-placeholder {
  font-size: 12px;
  font-size: 0.75rem;
}

.gNavSection-staff * a,
.gNavSection-menu * a {
  text-decoration: none;
}

.gNavList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.gNavBtn {
  margin-left: 5px;
  width: 100px;
  height: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background: #212121;
  font-size: 14px;
  font-size: 0.875rem;
  color: #ffffff;
  font-weight: 350;
  cursor: pointer;
  position: relative;
  text-decoration: none;
}

.gNavBtn i {
  margin-right: 3px;
  color: #ffffff;
}

.gNavBtn span {
  color: #ffffff;
}

.gNavBtn.selected {
  background: #263238;
}

.gNavBtn.selected:after {
  content: "";
  display: block;
  width: 100%;
  height: 5px;
  background: #263238;
  position: absolute;
  bottom: -5px;
  right: 0;
  left: 0;
}

.gNavBtn-notice:before {
  content: "";
  width: 6px;
  height: 6px;
  display: block;
  background: #e53935;
  border-radius: 50%;
  position: absolute;
  top: 4px;
  right: 4px;
}

.gNavBtn-forum {
  width: 110px;
  background: #689f38;
}

.gNavBtn-forum .fa-question-circle {
  margin: 0 3px 0 0;
  font-size: 14px;
  font-size: 0.875rem;
  top: 1px;
}

.gNavBtn-sp {
  width: 40px;
}

.gNavBtn-sp i {
  margin-right: 0 !important;
}

.gNavBtn-sp span {
  display: none !important;
}

.gNavOpen {
  width: 100%;
  display: none;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background: #263238;
  position: absolute;
  top: 53px;
  right: 0;
  left: 0;
  text-align: left;
}

.gNavOpenInner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.gNavOpenContents {
  padding: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.gNavOpenContents-paidPlan {
  padding: 0 10px 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

.gNavOpenContents-dashboard {
  padding: 0 10px 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

.gNavOpenContents-dashboard .dashboardBtnBox {
  width: 75%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

.gNavOpenContents-dashboard .dashboardBtn {
  margin: 0 10px;
  width: calc(33.333% - 20px);
  height: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background: #00acc1;
  border: 1px solid #00acc1;
  color: #ffffff;
  font-size: 16px;
  font-size: 1rem;
  font-weight: 500;
  position: relative;
}

.gNavOpenContents-dashboard .dashboardBtn:hover {
  background: #0097a7;
}

.gNavOpenContents-dashboard .dashboardBtn:before {
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 0 10px 10px;
  border-color: transparent transparent #b2ebf2 transparent;
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: 1;
}

.gNavOpenContents-dashboard .dashboardBtn i {
  margin-right: 4px;
  color: #ffffff;
  position: relative;
  top: 1px;
}

.gNavOpenContents-dashboard .linkLogoff {
  margin: 0 20px;
  height: 40px;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  color: #ffffff;
  font-size: 14px;
  font-size: 0.875rem;
}

.gNavOpenContents-dashboard .linkLogoff:hover {
  opacity: 0.6;
}

.gNavOpenContents-dashboard .linkLogoff i {
  margin-right: 4px;
  color: #ffffff;
  position: relative;
  top: 1px;
}

.gNavOpenContents-dashboard .linkContact {
  margin: 0 20px;
  height: 40px;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  color: #ffffff;
  font-size: 14px;
  font-size: 0.875rem;
}

.gNavOpenContents-dashboard .linkContact:hover {
  opacity: 0.6;
}

.gNavOpenContents-dashboard .linkContact i {
  margin-right: 4px;
  color: #ffffff;
  position: relative;
  top: 1px;
}

.paidPlan {
  width: 75%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

.paidPlanBtn {
  margin: 0 10px;
  width: calc(33.333% - 20px);
  height: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background: #e0f2f1;
  border: 3px solid #00897b;
  color: #00897b;
  font-size: 15px;
  font-size: 0.9375rem;
  font-weight: 500;
  text-decoration: none;
}

.paidPlanBtn:hover {
  background: #00897b;
  color: #e0f2f1;
}

.paidPlanBtn:hover i {
  color: #e0f2f1;
}

.paidPlanBtn i {
  margin-right: 5px;
  color: #00897b;
}

.infoList {
  padding: 20px;
  width: 100%;
  background: #ffffff;
  background-size: cover;
}

.infoList li {
  margin-bottom: 15px;
  padding-bottom: 15px;
  border-bottom: 1px solid #546e7a;
}

.infoList li:last-child {
  margin: 0;
  padding: 0;
  border-bottom: none;
}

.infoList .informationTime {
  display: inline-block;
  font-size: 13px;
  font-size: 0.8125rem;
  color: #78909c;
  font-weight: 500;
}

.infoList .informationRead {
  font-size: 13px;
  font-size: 0.8125rem;
  color: #263238;
}

.gNavOpenContents-staff {
  margin-bottom: 20px;
  padding: 20px 10px 0;
  max-height: calc(100vh - 153px);
  overflow-y: auto;
}

.paid .gNavOpenContents-staff {
  max-height: calc(100vh - 93px);
}

.gNavStaff {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.gNavStaff-manager {
  width: 25%;
}

.gNavStaff-staff {
  width: 75%;
}

.gNavStaffHead {
  margin: 0 0 10px 25px;
  font-size: 16px;
  font-size: 1rem;
  color: #ffffff;
  font-weight: 500;
}

.gNavStaffHead i {
  margin-right: 4px;
  font-size: 14px;
  font-size: 0.875rem;
  color: #ffffff;
}

.gNavStaffHead .fa-user {
  font-size: 12px;
  font-size: 0.75rem;
}

.staffList > li {
  margin: 0 10px 5px;
}

.staffList > li > a {
  padding: 0 10px 0 15px;
  height: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background: #78909c;
  border: 1px solid #78909c;
  color: #ffffff;
}

.staffList > li > a:hover {
  background: #455a64;
}

.staffList > li > a i {
  margin-left: auto;
  color: #ffffff;
  position: relative;
  top: 1px;
}

.staffList-manager > li {
  background: #78909c;
}

.staffList-staff {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.staffList-staff > li {
  width: calc(33.333% - 20px);
}

.staffList .addStaff a {
  background: #263238;
}

.staffList .loggedIn {
  background: #00acc1;
  padding-bottom: 10px;
}

.staffList .loggedInName {
  padding: 0 10px 0 15px;
  height: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.staffList .loggedInName a {
  margin-left: auto;
  width: 90px;
  height: 26px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background: #f5f5f5;
  border: 1px solid #e0e0e0;
  border-radius: 4px;
  font-size: 12px;
  font-size: 0.75rem;
  color: #212121;
}

.staffList .loggedInName a:hover {
  background: #eeeeee;
}

.staffList .loggedInName a i {
  margin-right: 3px;
  color: #212121;
}

.staffName {
  font-size: 14px;
  font-size: 0.875rem;
  font-weight: 500;
  color: #ffffff;
  position: relative;
  top: -1px;
}

.staffManager {
  margin: 0 10px;
  background: #ffffff;
  border-radius: 4px;
}

.staffManager-control {
  margin-top: 10px;
}

.staffManagerHead {
  padding: 8px;
  font-size: 12px;
  font-size: 0.75rem;
  font-weight: 500;
  color: #212121;
  position: relative;
  cursor: pointer;
}

.staffManagerHead i {
  position: absolute;
  top: 50%;
  right: 10px;
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
  color: #00acc1;
  font-size: 14px;
  font-size: 0.875rem;
}

.staffManagerMenuList {
  padding: 0 10px 10px;
  display: none;
}

.staffManagerMenuList li {
  padding-bottom: 5px;
}

.staffManagerMenuList li:last-child {
  padding-bottom: 0;
}

.staffManagerMenuList li a {
  display: block;
  font-size: 12px;
  font-size: 0.75rem;
  color: #00acc1;
}

.staffManagerMenuList li a:hover {
  color: #006064;
}

.staffManagerMenuList li a:hover i {
  color: #006064;
}

.staffManagerMenuList li a i {
  margin-right: 5px;
  color: #00acc1;
}

.staffManagerMenuList-disable li a {
  pointer-events: none;
  color: #9e9e9e;
}

.staffManagerMenuList-disable li a i {
  color: #9e9e9e;
}

.gNavOpenContents-menu {
  padding: 20px 10px 0;
}

.gNavMenuHead {
  margin: 0 0 10px 15px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: 16px;
  font-size: 1rem;
  color: #ffffff;
  font-weight: 500;
  position: relative;
}

.gNavMenuHead i {
  margin-right: 4px;
  font-size: 14px;
  font-size: 0.875rem;
  color: #ffffff;
  position: relative;
  top: 1px;
}

.gNavMenuHead .tag {
  margin: 0 0 0 auto;
}

.gNavMenu {
  margin: 0 10px 10px;
  width: calc(25% - 20px);
}

.paidPlanBox {
  margin: 0 10px;
  width: calc(25% - 20px);
}

.paidPlanBox .gNavMenu {
  margin: 0 0 10px;
  width: 100%;
}

.menuList > li {
  margin: 0 0 5px;
}

.menuList > li > a {
  padding: 0 10px 0 15px;
  height: 40px;
  line-height: 120%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background: #00acc1;
  border: 1px solid #00acc1;
  color: #ffffff;
  font-size: 14px;
  font-size: 0.875rem;
  font-weight: 500;
  position: relative;
}

.menuList > li > a:hover {
  background: #0097a7;
}

.menuList > li > a:before {
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 0 10px 10px;
  border-color: transparent transparent #b2ebf2 transparent;
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: 1;
}

.menuList > li > a i {
  margin-left: 5px;
  color: #ffffff;
  position: relative;
  top: 1px;
}

.menuList-paid > li > a {
  background: #00897b;
  border: 1px solid #00897b;
}

.menuList-paid > li > a:hover {
  background: #00796b;
}

.menuList-paid > li > a:before {
  border-color: transparent transparent #b2dfdb transparent;
}

.menuCount {
  margin-left: auto;
  width: 48px;
  height: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border-radius: 4px;
  background: #e0f7fa;
  color: #00838f;
  font-size: 12px;
  font-size: 0.75rem;
  font-weight: 500;
}

.btnCopy {
  margin-left: auto;
  padding: 0 5px;
  height: 20px;
  line-height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border-radius: 4px;
  background: #e0f7fa;
  color: #00838f;
  font-size: 12px;
  font-size: 0.75rem;
  font-weight: 500;
  position: relative;
  white-space: nowrap;
}

.btnCopy:hover {
  background: #26c6da;
  color: #e0f7fa;
}

.btnCopy-paid {
  background: #e0f2f1;
  color: #00695c;
}

.btnCopy-paid:hover {
  background: #26a69a;
  color: #e0f2f1;
}

.btnWebsite {
  padding: 0 6px 2px;
  height: 22px;
  background: #212121;
  border: 1px solid #212121;
  color: #ffffff !important;
  font-size: 11px;
  font-size: 0.6875rem;
}

.btnWebsite * {
  color: #ffffff !important;
}

.btnWebsite i {
  margin-right: 5px;
}

.copiedText {
  padding: 0 5px;
  height: 24px;
  line-height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background: #212121;
  color: #ffffff;
  border-radius: 4px;
  font-size: 11px;
  font-size: 0.6875rem;
  white-space: nowrap;
  position: absolute;
  top: -28px;
  left: 50%;
  -webkit-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
  z-index: 1;
}

.gNavOpenContents-check {
  padding: 20px 10px;
  border-top: 1px solid #455a64;
}

.gNavCheck {
  width: 100%;
}

.gNavCheckHead {
  margin: 0 0 10px 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: 16px;
  font-size: 1rem;
  color: #ffffff;
  font-weight: 500;
  position: relative;
}

.gNavCheckHead i {
  margin-right: 4px;
  font-size: 14px;
  font-size: 0.875rem;
  color: #ffffff;
}

.checkContentsBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.checkContents {
  margin: 0 10px;
  padding: 15px;
  width: calc(50% - 20px);
  background: #eceff1;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.checkContentsHead {
  margin-bottom: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid #455a64;
  font-size: 14px;
  font-size: 0.875rem;
  font-weight: 500;
}

.checkContentsHead i {
  margin-right: 4px;
}

.checkContentsRead p {
  margin: 6px 0;
  color: #263238;
}

.checkContentsRead-incomplete p a {
  text-decoration: underline;
  color: #e53935;
}

.checkContentsRead-past p a {
  text-decoration: underline;
  color: #00acc1;
}

.gNavOpenBg {
  width: 100%;
  background: rgba(0, 0, 0, 0.7);
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  z-index: 10;
}

/*----------------------------------------
	footer
----------------------------------------*/

#footer {
  margin-top: -30px;
  width: 100%;
  height: 30px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background: #263238;
}

#footer .copy small {
  color: #ffffff;
  font-weight: 500;
}

.m0 {
  margin: 0px;
}

.mt0 {
  margin-top: 0px;
}

.mb0 {
  margin-bottom: 0px;
}

.ml0 {
  margin-left: 0px;
}

.mr0 {
  margin-right: 0px;
}

.m5 {
  margin: 5px;
}

.mt5 {
  margin-top: 5px;
}

.mb5 {
  margin-bottom: 5px;
}

.ml5 {
  margin-left: 5px;
}

.mr5 {
  margin-right: 5px;
}

.m10 {
  margin: 10px;
}

.mt10 {
  margin-top: 10px;
}

.mb10 {
  margin-bottom: 10px;
}

.ml10 {
  margin-left: 10px;
}

.mr10 {
  margin-right: 10px;
}

.m15 {
  margin: 15px;
}

.mt15 {
  margin-top: 15px;
}

.mb15 {
  margin-bottom: 15px;
}

.ml15 {
  margin-left: 15px;
}

.mr15 {
  margin-right: 15px;
}

.m20 {
  margin: 20px;
}

.mt20 {
  margin-top: 20px;
}

.mb20 {
  margin-bottom: 20px;
}

.ml20 {
  margin-left: 20px;
}

.mr20 {
  margin-right: 20px;
}

.m25 {
  margin: 25px;
}

.mt25 {
  margin-top: 25px;
}

.mb25 {
  margin-bottom: 25px;
}

.ml25 {
  margin-left: 25px;
}

.mr25 {
  margin-right: 25px;
}

.m30 {
  margin: 30px;
}

.mt30 {
  margin-top: 30px;
}

.mb30 {
  margin-bottom: 30px;
}

.ml30 {
  margin-left: 30px;
}

.mr30 {
  margin-right: 30px;
}

.m35 {
  margin: 35px;
}

.mt35 {
  margin-top: 35px;
}

.mb35 {
  margin-bottom: 35px;
}

.ml35 {
  margin-left: 35px;
}

.mr35 {
  margin-right: 35px;
}

.m40 {
  margin: 40px;
}

.mt40 {
  margin-top: 40px;
}

.mb40 {
  margin-bottom: 40px;
}

.ml40 {
  margin-left: 40px;
}

.mr40 {
  margin-right: 40px;
}

.m45 {
  margin: 45px;
}

.mt45 {
  margin-top: 45px;
}

.mb45 {
  margin-bottom: 45px;
}

.ml45 {
  margin-left: 45px;
}

.mr45 {
  margin-right: 45px;
}

.m50 {
  margin: 50px;
}

.mt50 {
  margin-top: 50px;
}

.mb50 {
  margin-bottom: 50px;
}

.ml50 {
  margin-left: 50px;
}

.mr50 {
  margin-right: 50px;
}

.m55 {
  margin: 55px;
}

.mt55 {
  margin-top: 55px;
}

.mb55 {
  margin-bottom: 55px;
}

.ml55 {
  margin-left: 55px;
}

.mr55 {
  margin-right: 55px;
}

.m60 {
  margin: 60px;
}

.mt60 {
  margin-top: 60px;
}

.mb60 {
  margin-bottom: 60px;
}

.ml60 {
  margin-left: 60px;
}

.mr60 {
  margin-right: 60px;
}

.m65 {
  margin: 65px;
}

.mt65 {
  margin-top: 65px;
}

.mb65 {
  margin-bottom: 65px;
}

.ml65 {
  margin-left: 65px;
}

.mr65 {
  margin-right: 65px;
}

.m70 {
  margin: 70px;
}

.mt70 {
  margin-top: 70px;
}

.mb70 {
  margin-bottom: 70px;
}

.ml70 {
  margin-left: 70px;
}

.mr70 {
  margin-right: 70px;
}

.m75 {
  margin: 75px;
}

.mt75 {
  margin-top: 75px;
}

.mb75 {
  margin-bottom: 75px;
}

.ml75 {
  margin-left: 75px;
}

.mr75 {
  margin-right: 75px;
}

.m80 {
  margin: 80px;
}

.mt80 {
  margin-top: 80px;
}

.mb80 {
  margin-bottom: 80px;
}

.ml80 {
  margin-left: 80px;
}

.mr80 {
  margin-right: 80px;
}

.m85 {
  margin: 85px;
}

.mt85 {
  margin-top: 85px;
}

.mb85 {
  margin-bottom: 85px;
}

.ml85 {
  margin-left: 85px;
}

.mr85 {
  margin-right: 85px;
}

.m90 {
  margin: 90px;
}

.mt90 {
  margin-top: 90px;
}

.mb90 {
  margin-bottom: 90px;
}

.ml90 {
  margin-left: 90px;
}

.mr90 {
  margin-right: 90px;
}

.m95 {
  margin: 95px;
}

.mt95 {
  margin-top: 95px;
}

.mb95 {
  margin-bottom: 95px;
}

.ml95 {
  margin-left: 95px;
}

.mr95 {
  margin-right: 95px;
}

.m100 {
  margin: 100px;
}

.mt100 {
  margin-top: 100px;
}

.mb100 {
  margin-bottom: 100px;
}

.ml100 {
  margin-left: 100px;
}

.mr100 {
  margin-right: 100px;
}

/*----------------------------------------
	index
----------------------------------------*/

/*----------------------------------------
	dashboard
----------------------------------------*/

#dashboard.contentsContainer {
  padding: 10px;
}

.dashboardRead {
  margin: 6px 0 10px;
  padding: 0 8px;
  font-size: 12px;
  font-size: 0.75rem;
}

.dashboardRead b {
  font-size: 18px;
  font-size: 1.125rem;
  font-weight: 500;
}

.dashboardRead a:hover i {
  color: #006064;
}

.dashboardRead a i {
  margin-right: 3px;
  color: #00acc1;
}

.dashboardOrderList > li {
  padding: 10px;
  background: #ffffff;
  border-top: 1px solid #e0e0e0;
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

.dashboardOrderList > li.unconfirmed {
  background: rgba(241, 248, 233, 0.6);
}

.dashboardOrderList > li.confirmed {
  background: rgba(241, 248, 233, 0.6);
}

.dashboardOrderList > li.prospective {
  background: rgba(225, 245, 254, 0.4);
}

.dashboardOrderList-today > li {
  cursor: pointer;
}

.dashboardOrderList-today > li:hover {
  background: rgba(224, 247, 250, 0.6);
}

.dashboardOrderList-purchase > li {
  cursor: pointer;
}

.dashboardOrderList-purchase > li:hover {
  background: rgba(224, 247, 250, 0.6);
}

.dashboardOrderList-purchase .dashboardOrderDetailTable {
  margin-left: 25px;
  width: calc(100% - 25px);
}

.dashboardOrderList-purchase .checkReceived {
  background: rgba(224, 247, 250, 0.6);
}

.dashboardOrderList-recovery > li {
  cursor: pointer;
}

.dashboardOrderList-recovery > li:hover {
  background: rgba(224, 247, 250, 0.6);
}

.dashboardOrderDate {
  margin-bottom: 3px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
}

.dashboardOrderDate-check {
  margin-right: 6px;
}

.dashboardOrderDate-check i {
  font-size: 16px;
  font-size: 1rem;
  position: relative;
  top: 2px;
}

.dashboardOrderDate-head {
  margin-right: 4px;
}

.dashboardOrderDate-date {
  margin-right: auto;
}

.dashboardOrderDate-nameBox {
  position: absolute;
  top: 0;
  right: 0;
  text-align: right;
}

.dashboardOrderDate-name {
  display: block;
}

.dashboardOrderDate-ago {
  line-height: 120%;
  display: block;
  font-size: 10px;
  font-size: 0.625rem;
  color: #9e9e9e;
}

.dashboardOrderStatus {
  margin-bottom: 3px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
}

.dashboardOrderStatus i {
  margin: 0 8px 0 4px;
}

.dashboardOrderDetailTable {
  width: 100%;
}

.dashboardOrderDetailTable th,
.dashboardOrderDetailTable td {
  padding: 2px 0;
  vertical-align: top;
}

.dashboardOrderDetailTable th {
  width: 25px;
}

.dashboardOrderCommodity {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
}

.dashboardOrderCommodityList {
  margin-right: 10px;
}

.dashboardOrderCommodityList li {
  margin: 2px 0 5px;
  line-height: 130%;
}

.dashboardOrderCommodityTotal {
  margin: 0 0 3px auto;
  white-space: nowrap;
}

.dashboardOrderCommodityTotal-tax {
  font-size: 10px;
  font-size: 0.625rem;
}

.dashboardMemoList > li {
  padding: 10px;
  border-top: 1px solid #e0e0e0;
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
  cursor: pointer;
}

.dashboardMemoList > li:hover {
  background: rgba(224, 247, 250, 0.6);
}

.dashboardMemoHead {
  margin-bottom: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.dashboardMemoHead-date {
  margin-right: 20px;
}

.dashboardMemoHead-name {
  margin-right: auto;
}

.dashboardMemoHead-delete {
  margin-left: auto;
}

.memoDialogTable {
  width: 100%;
}

.memoDialogTable th {
  width: 130px;
}

.memoDialogTable th,
.memoDialogTable td {
  text-align: left;
}

.scheRemarksEdit {
  width: 320px;
  height: 40px;
}

.refUrl {
  width: 100%;
}

/*----------------------------------------
	easyorder
----------------------------------------*/

.easyOrder {
  margin: 0 auto 80px;
  max-width: 1100px;
  width: auto;
}

.easyOrderHeader {
  margin: 40px 0 30px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.easyOrderHeaderHead {
  margin-left: 20px;
  line-height: 100%;
  font-size: 28px;
  font-size: 1.75rem;
  font-weight: 700;
}

.easyOrderHeaderStep {
  margin: 0 40px 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.easyOrderHeaderStep-box {
  padding: 0 15px 0 20px;
  width: 220px;
  height: 50px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background: #ffffff;
  border: 1px solid #00acc1;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.easyOrderHeaderStep-box i {
  margin-left: auto;
  font-size: 20px;
  font-size: 1.25rem;
  color: #00acc1;
}

.easyOrderHeaderStep-active {
  background: #00acc1;
}

.easyOrderHeaderStep-active .easyOrderHeaderStep-title {
  color: #ffffff;
}

.easyOrderHeaderStep-active i {
  color: #ffffff;
}

.easyOrderHeaderStep-num {
  font-size: 15px;
  font-size: 0.9375rem;
  font-weight: 500;
  color: #80deea;
}

.easyOrderHeaderStep-title {
  margin-left: 5px;
  font-size: 18px;
  font-size: 1.125rem;
  font-weight: 500;
  color: #00acc1;
  position: relative;
  top: -1px;
}

.easyOrderHeaderStep-arrow {
  width: 50px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.easyOrderHeaderStep-arrow i {
  font-size: 24px;
  font-size: 1.5rem;
  color: #00acc1;
}

.easyOrderContents {
  padding: 30px 40px;
  width: 100%;
  background: #fafafa;
  border: 1px solid #e0e0e0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.easyOrderContentsHead {
  margin-bottom: 25px;
  padding: 0 15px;
  height: 44px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background: #212121;
  border-radius: 4px;
}

.easyOrderContentsHead-num {
  line-height: 100%;
  font-size: 20px;
  font-size: 1.25rem;
  color: #757575;
  font-weight: 400;
}

.easyOrderContentsHead-title {
  margin-left: 10px;
  line-height: 100%;
  font-size: 20px;
  font-size: 1.25rem;
  color: #ffffff;
  font-weight: 400;
}

.easyOrderContentsHead i {
  margin-left: auto;
  font-size: 20px;
  font-size: 1.25rem;
  color: #ffffff;
}

.easyOrderTable {
  width: 100%;
}

.easyOrderTable tr {
  width: 100%;
  display: block;
  border-top: 1px solid #e0e0e0;
}

.easyOrderTable tr:first-child {
  border-top: none;
}

.easyOrderTable th,
.easyOrderTable td {
  width: 100%;
  display: block;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.easyOrderTable th {
  padding: 30px 10px 10px;
  font-size: 18px;
  font-size: 1.125rem;
}

.easyOrderTable td {
  padding: 10px 10px 30px;
}

.easyOrderTable input[type=text],
.easyOrderTable input[type=email],
.easyOrderTable input[type=tel],
.easyOrderTable input[type=number],
.easyOrderTable input[type=time],
.easyOrderTable select {
  padding: 7px 8px;
  height: 36px;
  font-size: 14px;
  font-size: 0.875rem;
}

.easyOrderTable input[type=text]:-moz-placeholder, .easyOrderTable input[type=email]:-moz-placeholder, .easyOrderTable input[type=tel]:-moz-placeholder, .easyOrderTable input[type=number]:-moz-placeholder, .easyOrderTable input[type=time]:-moz-placeholder, .easyOrderTable select:-moz-placeholder {
  font-size: 14px;
  font-size: 0.875rem;
}

.easyOrderTable input[type=text]:-ms-input-placeholder, .easyOrderTable input[type=email]:-ms-input-placeholder, .easyOrderTable input[type=tel]:-ms-input-placeholder, .easyOrderTable input[type=number]:-ms-input-placeholder, .easyOrderTable input[type=time]:-ms-input-placeholder, .easyOrderTable select:-ms-input-placeholder {
  font-size: 14px;
  font-size: 0.875rem;
}

.easyOrderTable input[type=text]:placeholder-shown,
.easyOrderTable input[type=email]:placeholder-shown,
.easyOrderTable input[type=tel]:placeholder-shown,
.easyOrderTable input[type=number]:placeholder-shown,
.easyOrderTable input[type=time]:placeholder-shown,
.easyOrderTable select:placeholder-shown {
  font-size: 14px;
  font-size: 0.875rem;
}

.easyOrderTable input[type=text]::-webkit-input-placeholder,
.easyOrderTable input[type=email]::-webkit-input-placeholder,
.easyOrderTable input[type=tel]::-webkit-input-placeholder,
.easyOrderTable input[type=number]::-webkit-input-placeholder,
.easyOrderTable input[type=time]::-webkit-input-placeholder,
.easyOrderTable select::-webkit-input-placeholder {
  font-size: 14px;
  font-size: 0.875rem;
}

.easyOrderTable input[type=text]:-moz-placeholder,
.easyOrderTable input[type=email]:-moz-placeholder,
.easyOrderTable input[type=tel]:-moz-placeholder,
.easyOrderTable input[type=number]:-moz-placeholder,
.easyOrderTable input[type=time]:-moz-placeholder,
.easyOrderTable select:-moz-placeholder {
  opacity: 1;
  font-size: 14px;
  font-size: 0.875rem;
}

.easyOrderTable input[type=text]::-moz-placeholder,
.easyOrderTable input[type=email]::-moz-placeholder,
.easyOrderTable input[type=tel]::-moz-placeholder,
.easyOrderTable input[type=number]::-moz-placeholder,
.easyOrderTable input[type=time]::-moz-placeholder,
.easyOrderTable select::-moz-placeholder {
  opacity: 1;
  font-size: 14px;
  font-size: 0.875rem;
}

.easyOrderTable input[type=text]:-ms-input-placeholder,
.easyOrderTable input[type=email]:-ms-input-placeholder,
.easyOrderTable input[type=tel]:-ms-input-placeholder,
.easyOrderTable input[type=number]:-ms-input-placeholder,
.easyOrderTable input[type=time]:-ms-input-placeholder,
.easyOrderTable select:-ms-input-placeholder {
  font-size: 14px;
  font-size: 0.875rem;
}

.easyOrderTable textarea {
  padding: 8px;
  font-size: 14px;
  font-size: 0.875rem;
}

.easyOrderTable textarea:-moz-placeholder {
  font-size: 14px;
  font-size: 0.875rem;
}

.easyOrderTable textarea:-ms-input-placeholder {
  font-size: 14px;
  font-size: 0.875rem;
}

.easyOrderTable textarea:placeholder-shown {
  font-size: 14px;
  font-size: 0.875rem;
}

.easyOrderTable textarea::-webkit-input-placeholder {
  font-size: 14px;
  font-size: 0.875rem;
}

.easyOrderTable textarea:-moz-placeholder {
  opacity: 1;
  font-size: 14px;
  font-size: 0.875rem;
}

.easyOrderTable textarea::-moz-placeholder {
  opacity: 1;
  font-size: 14px;
  font-size: 0.875rem;
}

.easyOrderTable textarea:-ms-input-placeholder {
  font-size: 14px;
  font-size: 0.875rem;
}

.easyOrderTable .datepicker {
  margin-right: 20px;
  width: 260px;
}

.easyOrderTable .timepicker {
  width: 260px;
}

.easyOrderTable .deliZipBox .zipMark,
.easyOrderTable .custZipBox .zipMark {
  width: 36px;
  height: 36px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  background: #263238;
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
  color: #ffffff;
  font-size: 18px;
  font-size: 1.125rem;
}

.easyOrderTable .deliAddressArea,
.easyOrderTable .custAddressArea {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.easyOrderTable .deliAddress,
.easyOrderTable .custAddress {
  width: 100%;
}

.easyOrderTable .deliName,
.easyOrderTable .custName {
  margin-bottom: 10px;
  width: 100%;
}

.easyOrderTable .deliNameKana,
.easyOrderTable .custNameKana {
  width: 100%;
}

.easyOrderTable .deliTel,
.easyOrderTable .custTel {
  width: 260px;
}

.easyOrderTable .custMail {
  width: 100%;
}

.easyOrderTable .ordersNameList {
  width: 260px;
}

.easyOrderTable .orderRadioBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.easyOrderTable .orderRadioBox label {
  margin-bottom: 5px;
  width: 140px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.easyOrderTable .orderRadioBox + .orderRadioBox {
  margin-top: 10px;
}

.easyOrderTable .orderRadioBox .otherLabel {
  width: 280px;
}

.easyOrderTable .budgetCd {
  margin-right: 30px;
  width: 260px;
}

.easyOrderTable .budgetCdLabelBox label {
  width: 80px;
}

.easyOrderTable .useCdOther {
  margin-top: 4px;
  width: 100%;
}

.easyOrderTable .paymentHeadBox {
  margin-right: 10px;
}

.easyOrderTable .paymentHead {
  padding: 0 10px;
  height: 19px;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background: #455a64;
  border: 1px solid #37474f;
  border-radius: 4px;
  color: #ffffff;
  font-weight: 500;
}

.easyOrderTable .orderMessage {
  width: 100%;
  height: 72px;
}

.easyOrderTable .orderRemarks {
  width: 100%;
  height: 72px;
}

.easyOrderTable .orderNum {
  width: 260px;
}

.easyOrderTable-head {
  position: relative;
}

.easyOrderTable-head .tag {
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
  position: absolute;
  top: 50%;
  left: 160px;
}

.deliZipBox,
.custZipBox {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
}

.deliZipBox .zipMark,
.custZipBox .zipMark {
  width: 23px;
  height: 24px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  background: #263238;
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
  color: #ffffff;
  font-size: 12px;
  font-size: 0.75rem;
}

.deliZipBox .deliZip,
.deliZipBox .custZip,
.custZipBox .deliZip,
.custZipBox .custZip {
  margin-right: 20px;
  width: 124px;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.easyOrderBtn {
  margin: 0 20px;
  width: 170px;
  height: 45px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 4px;
  font-size: 18px;
  font-size: 1.125rem;
  text-decoration: none;
}

.easyOrderBtn i {
  margin-left: 5px;
}

.easyOrderBtn.easyOrderBtnDisabled {
  background: #ffffff;
  border: 1px solid #e0e0e0;
  color: #bdbdbd;
  pointer-events: none;
}

.easyOrderBtn.easyOrderBtnDisabled i {
  color: #bdbdbd;
}

.easyOrderBtn .fa-edit {
  font-size: 15px;
  font-size: 0.9375rem;
}

.easyOrderBtnNext {
  background: #00acc1;
  border: 1px solid #0097a7;
  color: #ffffff;
}

.easyOrderBtnNext:hover {
  background: #ffffff;
  color: #00acc1;
}

.easyOrderBtnNext:hover i {
  color: #00acc1;
}

.easyOrderBtnNext i {
  color: #ffffff;
}

.easyOrderBtnBack {
  background: #424242;
  border: 1px solid #212121;
  color: #ffffff;
}

.easyOrderBtnBack:hover {
  background: #ffffff;
  color: #212121;
}

.easyOrderBtnBack:hover i {
  color: #212121;
}

.easyOrderBtnBack i {
  margin: 0 5px 0 0;
  color: #ffffff;
}

/*----------------------------------------
	orders
----------------------------------------*/

#orders {
  margin: 0 20px 40px;
}

#orders .baseCardsContentsHead {
  cursor: default;
}

#editOrderForm .timepicker {
  width: 100%;
  max-width: 80px;
}

.ordersSearchNum {
  font-size: 14px;
  font-size: 0.875rem;
}

.ordersSearchNum-total {
  font-size: 20px;
  font-size: 1.25rem;
  font-weight: 700;
  color: #546e7a;
}

.contentsHeaderBtn-change {
  margin-left: 10px;
  display: none;
}

.contentsSearchHeader {
  padding: 10px 20px 13px;
  width: 100%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background: #fafafa;
  border: none;
}

.contentsSearchHeaderBox {
  margin-bottom: 7px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.contentsSearchHeaderBox:last-child {
  margin-bottom: 0;
}

.contentsSearchHeaderBoxInner {
  margin-right: 20px;
}

.contentsSearchHeaderBoxInner .contentsSearchHead {
  margin-bottom: 1px;
  width: 100%;
  font-size: 12px;
  font-size: 0.75rem;
  font-weight: 600;
  text-align: left;
}

.contentsSearchHeaderBoxInner:last-child {
  margin-right: 0;
}

.contentsSearchForm {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.contentsSearchForm-datebox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.contentsSearchForm .waveDash {
  margin: 0 5px;
}

.contentsSearchForm input,
.contentsSearchForm select,
.contentsSearchForm button {
  height: 32px;
}

.contentsSearchForm .btn {
  margin-left: 10px;
  width: 60px;
}

.contentsSearchForm .datepicker2m,
.contentsSearchForm .moneyKey,
.contentsSearchForm .prefectures,
.contentsSearchForm .plan,
.contentsSearchForm .isDMSend {
  width: 90px;
}

.contentsSearchForm .kojinHojinKey,
.contentsSearchForm .excellentKey,
.contentsSearchForm .mikomiKey {
  width: 100px;
}

.contentsSearchForm .emailKey {
  width: 110px;
}

.contentsSearchForm .paymentCd,
.contentsSearchForm .orderStaff,
.contentsSearchForm .useCd {
  width: 140px;
}

.contentsSearchForm .checkEmail,
.contentsSearchForm .checkKaishu,
.contentsSearchForm .checkNyukin,
.contentsSearchForm .mikomiKey,
.contentsSearchForm .checkDeli {
  width: 60px;
}

.contentsSearchForm .searchKey {
  width: 250px;
}

.contentsSearchCurrent {
  padding: 10px 20px 13px;
  width: 100%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background: #fafafa;
  display: none;
}

.contentsSearchCurrent .contentsSearchCurrentHead {
  margin-bottom: 1px;
  width: 100%;
  font-size: 12px;
  font-size: 0.75rem;
  font-weight: 600;
  text-align: left;
}

.contentsSearchCurrentList {
  line-height: 100%;
}

.contentsSearchCurrentList li {
  line-height: 120%;
  display: inline-block;
}

.contentsSearchCurrentList li:after {
  content: "／";
}

.contentsSearchCurrentList li:last-child:after {
  content: "";
}

.ordersList {
  padding: 20px 0 0;
}

.ordersList + .pagenation {
  margin-top: 20px;
}

.orderListTable {
  table-layout: fixed;
}

.orderListTable th,
.orderListTable td {
  vertical-align: middle;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  outline: inherit;
}

.orderListTable thead {
  width: 100%;
}

.orderListTable thead:before {
  content: "";
  width: calc(100% + 2px);
  height: 20px;
  display: none;
  background: #ffffff;
  position: absolute;
  top: -20px;
  left: 0;
}

.orderListTable thead th {
  padding: 3px 5px;
  white-space: nowrap;
  font-weight: 400;
}

.orderListTable thead th.sorting-asc {
  background: #e0f7fa;
}

.orderListTable thead th.sorting-desc {
  background: #e0f7fa;
}

.orderListTable tbody {
  width: 100%;
}

.orderListTable tbody tr {
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

.orderListTable tbody tr:hover {
  background: rgba(224, 247, 250, 0.3);
  border: 1px solid #e0f7fa;
}

.orderListTable tbody td {
  padding: 5px 8px;
  cursor: pointer;
  word-break: break-word;
  word-wrap: break-word;
}

.orderListTable tbody td p {
  margin-bottom: 2px;
}

.orderListTable tbody td.sortPrice {
  text-align: right;
  word-break: normal;
}

.orderListTable tbody td.sortPrice .customerStatusContainer {
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

.orderListTable tbody td .fa {
  margin-right: 3px;
}

.orderListTable tbody td.sortCheckEmail {
  position: relative;
}

.orderListTable tbody td.sortCheckDeli {
  position: relative;
}

.orderListTable tbody td.sortCheckKaishu {
  position: relative;
}

.orderListTable tbody td.sortCheckNyukin {
  position: relative;
}

.orderListTable .ordersList-photo img {
  width: 100%;
  max-width: 80px;
  height: auto;
}

.orderListTable .sortNum {
  width: 3%;
  text-align: center;
  white-space: nowrap;
}

.orderListTable .sortCheckEmail,
.orderListTable .sortCheckDeli,
.orderListTable .sortCheckKaishu,
.orderListTable .sortCheckNyukin {
  width: 4%;
  text-align: center;
}

.orderListTable .sortPaymentCd,
.orderListTable .sortUseCd {
  width: 6%;
  text-align: center;
}

.orderListTable .sortDeliDate,
.orderListTable .sortPhoto {
  width: 7%;
  text-align: center;
}

.orderListTable .sortRemarks {
  width: 14%;
}

.orderListTable .sortDeliName,
.orderListTable .sortCsName {
  width: 14%;
}

.orderListTable .sortPrice {
  width: 15%;
}

.orderDataCancel {
  background: #eeeeee;
}

.orderDataCancel:hover {
  background: rgba(224, 224, 224, 0.3);
  border: 1px solid #e0e0e0;
}

.orderDataMikomi {
  background: #e1f5fe;
}

.orderDataMikomi:hover {
  background: rgba(225, 245, 254, 0.6);
  border: 1px solid #e1f5fe;
}

/*----------------------------------------
	orders-create
----------------------------------------*/

#orders-create .baseCardsContentsHead {
  cursor: default;
}

.contentsHeaderBoxOrders {
  margin-right: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.contentsHeaderBoxOrders .ordersMikomi {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.contentsHeaderBoxOrders .ordersMikomi label {
  padding: 3px 0;
}

.contentsHeaderBoxOrders .ordersStaff {
  min-width: 110px;
  height: 32px;
}

.checkDeliBtn {
  margin-right: -30px;
  padding: 0 10px;
  height: 28px;
  z-index: 1;
  cursor: default;
}

.checkDeliBtn span {
  font-size: 12px;
  font-size: 0.75rem;
}

.orders2ColTable tr th {
  padding-top: 13px;
  width: 30%;
}

.orders2ColTable tr th .fa-question-circle {
  float: right;
  top: -2px;
}

.orders2ColTable tr th a i {
  margin-left: 5px;
  color: #00acc1;
}

.orders2ColTable th,
.orders2ColTable td {
  text-align: left;
}

.orders2ColTable .tag-required {
  margin: 0;
  float: right;
  position: relative;
  top: -1px;
}

.orders2ColTable .deliName,
.orders2ColTable .custName {
  margin-bottom: 5px;
  width: 100%;
}

.orders2ColTable .deliNameKana,
.orders2ColTable .custNameKana {
  width: 100%;
}

.orders2ColTable .deliUnit,
.orders2ColTable .custUnit {
  width: 100%;
}

.orders2ColTable .deliZipBox,
.orders2ColTable .custZipBox {
  margin-bottom: 5px;
}

.orders2ColTable .deliZip,
.orders2ColTable .custZip {
  margin-right: 10px;
  width: 97px;
}

.orders2ColTable .deliAddress,
.orders2ColTable .custAddress {
  width: 100%;
}

.orders2ColTable .linkZip i {
  margin-left: 2px;
  color: #00acc1;
}

.orders2ColTable .deliTel,
.orders2ColTable .custTel {
  width: 100%;
}

.orders2ColTable .hosokuJoho {
  width: 100%;
  min-height: 72px;
}

.orders2ColTable .custDeliName {
  width: 100%;
}

.orders2ColTable .custMail {
  width: 100%;
}

.orders2ColTable .gtmContainerID {
  width: 120px;
  margin-bottom: 5px;
}

.baseCardsBox-100 .orders2ColTable th {
  width: 20%;
}

.ordersDeliDateTime {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.ordersDeliDateTime .datepicker {
  margin-right: 10px;
  width: calc(50% - 10px);
}

.ordersDeliDateTime .timepicker {
  min-width: 50px;
}

.ordersDeliTimeBox {
  width: 50%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.ordersDeliTimeBox .waveDash {
  margin: 0 5px;
}

.ordersDeliStaff {
  margin-top: 5px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.ordersDeliStaff .deliStaff {
  margin-right: 10px;
  width: 140px;
}

.labelBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.labelBox-inline {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.labelBox-row {
  margin-bottom: 7px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.labelBox-row > label {
  padding: 3px 0;
}

.labelBox-vertical {
  margin-bottom: 7px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.labelBox-vertical > label {
  padding: 5px 0;
}

.labelBox-vertical-item {
  padding: 5px 0;
}

.labelBox-otherText {
  margin: 8px 0 0 24px;
  padding: 8px;
  background: #fafafa;
  border: 1px solid #e0e0e0;
  border-radius: 4px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.labelBox-otherText-term {
  margin-bottom: 8px;
}

.custHead {
  margin-bottom: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.custPrintCheck {
  margin-right: auto;
}

.custPrintCheck i {
  margin-left: 5px;
}

.custHeadBox {
  margin-left: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.custNumderBtn {
  padding: 0 8px;
  height: 24px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background: #455a64;
  border: 1px solid #37474f;
  color: #ffffff;
  text-decoration: underline;
  font-weight: 350;
}

.custNumderBtn:hover {
  color: #ffffff;
  text-decoration: none;
}

.custNumderBtn i {
  margin-right: 5px;
  color: #ffffff;
  position: relative;
  top: 1px;
}

.custmUnpaidBtn {
  margin-left: 10px;
  padding: 0 8px;
  height: 24px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background: #e53935;
  border: 1px solid #d32f2f;
  color: #ffffff;
  font-weight: 350;
  cursor: default;
}

.ordersDateTime {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.ordersDateTime .datepicker {
  margin-right: 10px;
  width: calc(50% - 10px);
}

.ordersDateTime .timepicker {
  min-width: 50px;
}

.ordersTable tbody th,
.ordersTable tbody td {
  padding: 8px;
  vertical-align: middle;
}

.ordersTable tfoot th,
.ordersTable tfoot td {
  padding: 10px 8px;
  background: #e0f7fa;
}

.ordersTable td {
  text-align: right;
}

.ordersTable-commodity {
  width: calc(65% - 510px);
}

.ordersTable-num {
  width: 80px !important;
}

.ordersTable-unit {
  width: 100px !important;
}

.ordersTable-tax {
  width: 80px !important;
}

.ordersTable-excluded {
  width: 80px !important;
}

.ordersTable-included {
  width: 100px !important;
}

.ordersTable-recycle {
  width: 70px !important;
}

.ordersTable-remarks {
  width: 35%;
}

.ordersTable-no {
  width: 35px !important;
  vertical-align: middle !important;
  font-size: 18px;
  font-size: 1.125rem;
  font-weight: 500;
  color: #757575;
}

.ordersTable-name {
  min-width: 200px;
}

.ordersTable-nameBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.ordersTable .ordersNameList,
.ordersTable .ordersNameWrite {
  width: calc(100% - 34px);
}

.ordersTable .ordersNum {
  width: 40px;
  text-align: right;
}

.ordersTable .ordersPrice {
  width: 60px;
  text-align: right;
}

.ordersTable .ordersPriceTax {
  width: 60px;
  text-align: right;
}

.ordersTable .ordersDeliPrice {
  width: 60px;
  text-align: right;
}

.ordersTable .ordersDeliPriceTax {
  width: 60px;
  text-align: right;
}

.ordersTable .ordersRemarks {
  width: 100%;
}

.unitText {
  margin-left: 5px;
}

.cellCenterBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.cellCenterBox-left {
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
}

.cellCenterBox-right {
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

.cellCenterBox .waveDash {
  margin: 0 5px;
}

.ordersAddBtn,
.ordersRemoveBtn {
  margin-right: 10px;
  padding: 0;
  width: 24px;
  height: 24px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  background: #00acc1;
  border: 1px solid #0097a7;
}

.ordersAddBtn i,
.ordersRemoveBtn i {
  color: #ffffff;
  font-size: 16px;
  font-size: 1rem;
}

.ordersRemoveBtn {
  background: #bdbdbd;
  border: 1px solid #e0e0e0;
}

.ordersOutlineTable .ordersMessage {
  width: 100%;
  min-height: 82px;
}

.ordersOutlineTable .ordersMemo {
  width: 100%;
  min-height: 82px;
}

.ordersOutlineTable .ordersRemarks {
  width: 100%;
  min-width: 230px;
  min-height: 82px;
}

.ordersOutlineTable .seikyuRemarks {
  margin-top: 5px;
  width: 100%;
  min-height: 82px;
}

.ordersOutlineTable .useCdOther {
  margin-top: 4px;
  width: 100%;
}

.ordersOutlineRadioBox {
  margin-bottom: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.ordersOutlineRadioBox .paymentHeadBox {
  margin-bottom: 10px;
  padding: 0 10px;
  width: 100%;
  height: 22px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border-radius: 4px;
  background: #455a64;
  border: 1px solid #37474f;
}

.ordersOutlineRadioBox .paymentHeadBox .paymentHead {
  color: #ffffff;
}

.ordersOutlineRadioBox .paymentHeadBox i {
  position: relative;
  top: -1px;
  font-size: 16px;
  font-size: 1rem;
  color: #ffffff;
}

.ordersOutlineRadioBox label {
  margin-bottom: 5px;
  line-height: 150%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  white-space: nowrap;
}

.ordersOutlineRadioBox + .ordersPaymentRadioBox {
  margin-bottom: 0;
}

.ordersOutlineRadioBox .otherLabel {
  width: 280px;
}

.ordersOutlineRadioBox .otherLabel .radioInput-style {
  margin-right: 10px;
}

.ordersOutlineRadioBox-use {
  margin-bottom: 0;
}

.seikyuRemarksBox {
  width: 100%;
}

.ordersRowBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.ordersRowBox label {
  margin-right: 20px;
}

.ordersDetailTable .ordersCancel {
  padding-top: 10px;
  background: #212121;
  color: #ffffff;
}

.ordersDetailTable .ordersStaff {
  width: 200px;
}

.ordersDetailTable .ordersHistoryOrderBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.ordersDetailTable .ordersHistoryOrderBox label {
  margin-bottom: 5px;
  line-height: 150%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.ordersDetailTable .ordersHistoryOrderBox .otherLabel {
  width: 280px;
}

.ordersDetailTable .ordersHistoryOrderBox .otherLabel .radioInput-style {
  margin-right: 10px;
}

.ordersDetailTable .ordersHistoryOrderBox .otherLabel .historyOrderOther {
  margin-top: 4px;
}

.ordersDeliColle {
  margin-bottom: 10px;
}

.ordersDeliColle:last-child {
  margin-bottom: 0;
}

.ordersDeliColleHead {
  margin: 0 0 10px 4px;
  font-size: 16px;
  font-size: 1rem;
  font-weight: 500;
}

.ordersDeliColleHead i {
  margin-right: 5px;
}

.ordersPaymentTable .nyukinStaff {
  width: 200px;
}

.ordersPaymentTable .registerMoney {
  width: 180px;
  text-align: right;
}

.ordersGyoshaTable .deliGyoshaName {
  width: 100%;
}

.ordersGyoshaTable .deliDenpyoNo {
  width: 100%;
}

.ordersGyoshaTable .yamatoBox {
  margin-bottom: 8px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.ordersGyoshaTable .yamatoBox span {
  margin: 0 3px;
}

.ordersGyoshaTable .yamatoBox i {
  margin: 0 5px;
  color: #00acc1;
}

.ordersGyoshaTable .yamatoId {
  width: 98px;
}

.ordersGyoshaTable .yamatoId2 {
  width: 88px;
}

.ordersShippingTime {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.ordersShippingTime input {
  width: 100%;
  min-width: 50px;
  max-width: 88px;
}

.ordersShippingTime .waveDash {
  margin: 0 5px;
}

.b2WebBtn {
  width: 140px;
  height: 26px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background: #00acc1;
  border: 1px solid #0097a7;
  color: #ffffff;
  font-size: 12px;
  font-size: 0.75rem;
}

.b2WebBtn i {
  margin-right: 5px;
  color: #ffffff;
}

.ordersPhotoList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.ordersPhotoList li {
  margin: 10px;
  width: calc(25% - 20px);
}

.ordersPhotoList li a img {
  max-width: 100%;
  height: auto;
}

.ordersPhotoList-text {
  font-weight: 500;
}

.ordersPhotoList-other {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  aspect-ratio: 4/3;
  background: #f5f5f5;
  border: 1px solid #e0e0e0;
  text-decoration: none;
}

.ordersPhotoList-other i {
  font-size: 48px;
  font-size: 3rem;
}

.ordersPhotoList-name {
  text-align: center;
}

.ordersPhotoListBtn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.ordersPhotoListBtn a {
  margin: 2px 0;
}

.photoDrag {
  margin-top: 20px;
  padding: 20px;
  width: 100%;
  height: 170px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 4px;
  background: #f1f8e9;
  border: 3px dotted #c5e1a5;
  text-align: center;
}

.photoDrag span {
  color: #7cb342;
  font-weight: 500;
}

.photoDrag i {
  margin: 0 0 10px;
  display: block;
  font-size: 48px;
  font-size: 3rem;
  color: #7cb342;
}

.photoDrag--blue {
  background: #e1f5fe;
  border: 3px dotted #81d4fa;
}

.photoDrag--blue span {
  color: #039be5;
}

.photoDrag--blue i {
  color: #039be5;
}

.ordersHistory {
  padding: 20px 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.ordersHistory-total {
  margin-bottom: 10px;
  font-size: 14px;
  font-size: 0.875rem;
}

.ordersHistoryBtn {
  width: 240px;
  height: 42px;
  font-size: 16px;
  font-size: 1rem;
}

.ordersHistoryBtn i {
  margin-right: 5px;
}

/*----------------------------------------
	customers
----------------------------------------*/

#customers {
  margin: 0 10px 40px;
}

#customers .baseCardsContentsHead {
  cursor: default;
}

#customers-edit .baseCardsContentsHead {
  cursor: default;
}

.customersSearchCurrent {
  padding: 10px 20px 13px;
  width: 100%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background: #fafafa;
  display: none;
}

.customersSearchCurrent .customersSearchCurrentHead {
  margin-bottom: 1px;
  width: 100%;
  font-size: 12px;
  font-size: 0.75rem;
  font-weight: 600;
  text-align: left;
}

.customersSearchCurrentList {
  line-height: 100%;
}

.customersSearchCurrentList li {
  line-height: 120%;
  display: inline-block;
}

.customersSearchCurrentList li:after {
  content: "／";
}

.customersSearchCurrentList li:last-child:after {
  content: "";
}

.customersList {
  padding: 20px 0 0;
  margin-bottom: 20px;
}

.customersListTable th,
.customersListTable td {
  vertical-align: middle;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  outline: inherit;
}

.customersListTable thead {
  width: 100%;
}

.customersListTable thead:before {
  content: "";
  width: calc(100% + 2px);
  height: 20px;
  display: none;
  background: #ffffff;
  position: absolute;
  top: -20px;
  left: 0;
}

.customersListTable thead th {
  padding: 3px 5px;
  white-space: nowrap;
  font-weight: 400;
}

.customersListTable thead th .fa,
.customersListTable thead th .far {
  margin-right: 3px;
}

.customersListTable thead th.sorting-asc {
  background: #e0f7fa;
}

.customersListTable thead th.sorting-desc {
  background: #e0f7fa;
}

.customersListTable tbody {
  width: 100%;
}

.customersListTable tbody tr {
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

.customersListTable tbody tr:hover {
  background: rgba(224, 247, 250, 0.3);
  border: 1px solid #e0f7fa;
}

.customersListTable tbody td {
  padding: 5px 8px;
  cursor: pointer;
  word-break: break-all;
}

.customersListTable tbody td p {
  margin-bottom: 2px;
}

.customersListTable tbody td.sortPreviousOrder,
.customersListTable tbody td.sortOrderNumTotal {
  text-align: center;
}

.customersListTable tbody td .fa,
.customersListTable tbody td .far {
  margin-right: 3px;
}

.customersListTable tbody td.sortCheckEmail {
  position: relative;
}

.customersListTable .sortNum {
  width: 3%;
  text-align: center;
  white-space: nowrap;
}

.customersListTable .sortSendMailCheck {
  width: 4%;
  text-align: center;
  white-space: nowrap;
}

.customersListTable .sortOrderNumTotal {
  width: 5%;
  text-align: center;
}

.customersListTable .sortPreviousMail,
.customersListTable .sortPaymentMethod {
  width: 6%;
  text-align: center;
}

.customersListTable .sortMail,
.customersListTable .sortPreviousOrder {
  width: 12%;
  text-align: center;
}

.customersListTable .sortCsNumName,
.customersListTable .sortTelAdd,
.customersListTable .sortSupplement {
  width: 13%;
}

.customersListTable .sortOrderPriceTotal {
  width: 13%;
}

.orderPriceList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.orderPriceList dt {
  margin: 1px 0;
  width: 50px;
  position: relative;
}

.orderPriceList dt:after {
  content: "：";
  display: block;
  position: absolute;
  top: 0;
  right: -12px;
}

.orderPriceList dd {
  margin: 1px 0;
  padding-left: 12px;
  width: calc(100% - 50px);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  text-align: right;
}

.orderPriceList .color-light-green-600 * {
  color: #7cb342;
}

.orderPriceList .color-red-600 * {
  color: #e53935;
}

.orderPriceList .color-purple-600 * {
  color: #8e24aa;
}

.orderPriceHeadBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.customers2ColTable th {
  width: 30%;
}

.customers2ColTable th .fa-question-circle {
  float: right;
  top: -2px;
}

.customers2ColTable th a i {
  margin-left: 5px;
  color: #00acc1;
}

.customers2ColTable th + th {
  width: 70%;
}

.customers2ColTable th,
.customers2ColTable td {
  text-align: left;
}

.customers2ColTable .customerName {
  margin-bottom: 5px;
  width: 100%;
}

.customers2ColTable .csNameFurigana,
.customers2ColTable .csBusho,
.customers2ColTable .csNameDisplay,
.customers2ColTable .csAddress,
.customers2ColTable .csEmail,
.customers2ColTable .csEmail2 {
  width: 100%;
}

.customers2ColTable .custShimeDate {
  margin: 0 16px 0 -16px;
}

.customers2ColTable .csInvoiceAddress {
  width: 100%;
  height: 50px;
}

.customers2ColTable .hosokuJoho {
  width: 100%;
  height: 80px;
}

.customers2ColTable .mainStaffCd {
  width: 160px;
}

.customers2ColTable .csZipCode {
  margin: 0 10px 5px 0;
  width: 100px;
}

.customers2ColTable .fa-external-link-alt {
  margin-left: 5px;
  color: #00acc1;
}

.customers2ColTable .csTelNo,
.customers2ColTable .csTelNo2,
.customers2ColTable .csFaxNo,
.customers2ColTable .csFaxNo2 {
  width: 140px;
}

.customersRowBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.customersRowBox-100 {
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.customersRowBox-100 .customersRowBox-item {
  width: calc(50% - 5px);
}

.customersRowBox-item {
  margin: 0 10px 0 0;
}

.customersRowBox-item:last-child {
  margin: 0;
}

.customersOutlineRadioBox {
  margin-bottom: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.customersOutlineRadioBox .paymentHeadBox {
  margin-bottom: 10px;
  padding: 0 10px;
  width: 100%;
  height: 22px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border-radius: 4px;
  background: #455a64;
  border: 1px solid #37474f;
}

.customersOutlineRadioBox .paymentHeadBox .paymentHead {
  color: #ffffff;
}

.customersOutlineRadioBox .paymentHeadBox i {
  position: relative;
  top: -1px;
  font-size: 16px;
  font-size: 1rem;
  color: #ffffff;
}

.customersOutlineRadioBox label {
  margin-bottom: 5px;
  line-height: 150%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.orderHistoryList + .pagenation {
  margin-top: 20px;
}

.orderHistoryListTable {
  table-layout: fixed;
}

.orderHistoryListTable th,
.orderHistoryListTable td {
  vertical-align: middle;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  outline: inherit;
}

.orderHistoryListTable thead {
  width: 100%;
}

.orderHistoryListTable thead th {
  padding: 3px 5px;
  white-space: nowrap;
  font-weight: 400;
  vertical-align: middle;
}

.orderHistoryListTable thead th .fa,
.orderHistoryListTable thead th .far {
  margin-right: 3px;
}

.orderHistoryListTable thead th.sorting-asc {
  background: #e0f7fa;
}

.orderHistoryListTable thead th.sorting-desc {
  background: #e0f7fa;
}

.orderHistoryListTable tbody {
  width: 100%;
}

.orderHistoryListTable tbody tr {
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
  position: relative;
  z-index: 0;
}

.orderHistoryListTable tbody tr:hover {
  background: rgba(224, 247, 250, 0.3);
  border: 1px solid #e0f7fa;
}

.orderHistoryListTable tbody td {
  padding: 5px 8px;
  cursor: pointer;
  word-break: break-word;
  word-wrap: break-word;
  text-align: center;
}

.orderHistoryListTable tbody td p {
  margin-bottom: 2px;
}

.orderHistoryListTable tbody td.sortAddressHistory,
.orderHistoryListTable tbody td.sortRemarksHistory {
  text-align: left;
}

.orderHistoryListTable .ordersList-photo {
  display: inline-block;
  position: relative;
  z-index: 1;
}

.orderHistoryListTable .ordersList-photo img {
  width: 100%;
  max-width: 80px;
  height: auto;
}

.orderHistoryListTable .sortNum {
  width: 3%;
  text-align: center;
}

.orderHistoryListTable .sortDeliDateHistory,
.orderHistoryListTable .sortPhotoHistory,
.orderHistoryListTable .sortUseHistory,
.orderHistoryListTable .sortPaymentHistory,
.orderHistoryListTable .sortStaffHistory {
  width: 8%;
  text-align: center;
}

.orderHistoryListTable .sortPaymentTotalHistory {
  width: 9%;
  text-align: center;
}

.orderHistoryListTable .sortAddressHistory,
.orderHistoryListTable .sortOrderPriceTotalHistory,
.orderHistoryListTable .sortRemarksHistory {
  width: 16%;
  text-align: center;
}

/*----------------------------------------
	articles
----------------------------------------*/

#articles {
  margin: 0 10px 20px;
}

.articlesList + .pagenation {
  margin-top: 20px;
}

.articlesListTable th,
.articlesListTable td {
  vertical-align: middle;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  outline: inherit;
}

.articlesListTable thead {
  width: 100%;
}

.articlesListTable thead th {
  white-space: nowrap;
  font-weight: 400;
  vertical-align: middle;
}

.articlesListTable thead th .fa,
.articlesListTable thead th .far {
  margin-right: 3px;
}

.articlesListTable thead th.sorting-asc {
  background: #e0f7fa;
}

.articlesListTable thead th.sorting-desc {
  background: #e0f7fa;
}

.articlesListTable tbody {
  width: 100%;
}

.articlesListTable tbody tr {
  -webkit-transition: background-color 0.5s ease;
  transition: background-color 0.5s ease;
  position: relative;
  z-index: 0;
}

.articlesListTable tbody tr:hover {
  background: rgba(224, 247, 250, 0.3);
  border: 1px solid #e0f7fa;
}

.articlesListTable tbody td {
  cursor: pointer;
  word-break: break-all;
  text-align: center;
}

.articlesListTable tbody td p {
  margin-bottom: 2px;
}

.articlesListTable tbody td.sortCommodityName,
.articlesListTable tbody td.sortCommodityRemarks {
  text-align: left;
}

.articlesListTable tbody td.sortBasePrice,
.articlesListTable tbody td .sortConsumptionTax,
.articlesListTable tbody td .sortTaxIncluded,
.articlesListTable tbody td .sortTotalOrder,
.articlesListTable tbody td .sortGrossSales {
  text-align: right;
}

.articlesListTable tbody td.sortNum:hover {
  cursor: move;
}

.articlesListTable .sortNum {
  width: 3%;
  text-align: center;
}

.articlesListTable .sortNum .fa-sort {
  padding: 0 5px;
  display: none;
  color: #00acc1;
  font-size: 14px;
  font-size: 0.875rem;
}

.articlesListTable .sortRecovery,
.articlesListTable .sortCatalog,
.articlesListTable .sortCommodityDisabled {
  width: 7%;
  text-align: center;
}

.articlesListTable .sortBasePrice,
.articlesListTable .sortConsumptionTax,
.articlesListTable .sortTaxIncluded,
.articlesListTable .sortTotalOrder,
.articlesListTable .sortGrossSales {
  width: 8%;
}

.articlesListTable .sortCommodityName,
.articlesListTable .sortCommodityRemarks {
  width: 18%;
  text-align: center;
}

.articlesListTable .articleDataDisabled {
  background: #eeeeee;
}

.articlesListTable .articleDataDisabled:hover {
  background: rgba(224, 224, 224, 0.3);
  border: 1px solid #e0e0e0;
}

.commodity2ColTable th {
  padding-top: 13px;
  padding-bottom: 13px;
  width: 30%;
}

.commodity2ColTable th .fa-question-circle {
  float: right;
  top: -2px;
}

.commodity2ColTable th,
.commodity2ColTable td {
  text-align: left;
}

.commodity2ColTable .narabijun {
  width: 40px;
}

.commodity2ColTable .oteireMemo {
  width: 100%;
  height: 80px;
}

.commodity2ColTable .catalogDesc {
  width: 100%;
  height: 50px;
}

.commodity2ColTable .articleName,
.commodity2ColTable .commodityRemarks {
  width: 100%;
}

.commodity2ColTable .price,
.commodity2ColTable .total {
  width: 140px;
}

/*----------------------------------------
	eRecord
----------------------------------------*/

#eRecord {
  margin: 0 10px 20px;
  padding: 20px 0 0;
}

.eRecordTable th,
.eRecordTable td {
  vertical-align: middle;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  outline: inherit;
}

.eRecordTable thead {
  width: 100%;
}

.eRecordTable thead th {
  white-space: nowrap;
  font-weight: 400;
  vertical-align: middle;
  text-align: center !important;
}

.eRecordTable thead th .fa,
.eRecordTable thead th .far {
  margin-right: 3px;
}

.eRecordTable thead th.sorting-asc {
  background: #e0f7fa;
}

.eRecordTable thead th.sorting-desc {
  background: #e0f7fa;
}

.eRecordTable tbody {
  width: 100%;
}

.eRecordTable tbody tr {
  -webkit-transition: background-color 0.5s ease;
  transition: background-color 0.5s ease;
  position: relative;
  z-index: 0;
}

.eRecordTable tbody tr:hover {
  background: rgba(224, 247, 250, 0.3);
  border: 1px solid #e0f7fa;
}

.eRecordTable tbody td {
  cursor: pointer;
  word-break: break-all;
  text-align: center;
}

.eRecordTable tbody td p {
  margin-bottom: 2px;
}

.eRecordTable .sortCheck {
  width: 40px;
}

.eRecordTable .sortBillingDate {
  width: 100px;
  text-align: right;
}

.eRecordTable .sortSuppliers {
  width: 25%;
  text-align: left;
}

.eRecordTable .sortCategory {
  width: 12%;
  text-align: left;
}

.eRecordTable .sortBillingAmount {
  width: 140px;
  text-align: right;
}

.eRecordTable .sortData {
  width: 140px;
}

.eRecordTable .sortRemarks {
  text-align: left;
}

.btnRegistNextMonth {
  width: 240px;
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

.btnRegistNextMonth * {
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

.btnDownload {
  margin: 0 auto;
  width: 120px;
  height: 26px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background: #00acc1;
  border: 1px solid #0097a7;
  color: #ffffff !important;
  font-size: 12px;
  font-size: 0.75rem;
}

.btnDownload i {
  margin-right: 5px;
  color: #ffffff;
}

.btnNone {
  margin: 0 auto;
  width: 120px;
  height: 26px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: 12px;
  font-size: 0.75rem;
}

.eRecord2ColTable th {
  width: 30%;
}

.eRecord2ColTable th,
.eRecord2ColTable td {
  text-align: left;
}

.eRecord2ColTable .datepicker,
.eRecord2ColTable .eRecordAmount {
  width: 140px;
}

.eRecord2ColTable .eRecordSuppliers,
.eRecord2ColTable .eRecordCategory,
.eRecord2ColTable .eRecordRemarks {
  width: 100%;
}

.eRecord2ColTable .eRecordRemarks {
  min-height: 82px;
}

.baseCardsContentsInner:not(:has(.ordersPhotoList)) .photoDrag {
  margin-top: 0;
}

/*----------------------------------------
	staffs
----------------------------------------*/

#staffs {
  margin: 0 10px 20px;
}

.staffsList + .pagenation {
  margin-top: 20px;
}

.staffsListTable th,
.staffsListTable td {
  vertical-align: middle;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  outline: inherit;
}

.staffsListTable thead {
  width: 100%;
}

.staffsListTable thead th {
  white-space: nowrap;
  font-weight: 400;
  vertical-align: middle;
}

.staffsListTable thead th .fa,
.staffsListTable thead th .far {
  margin-right: 3px;
}

.staffsListTable thead th.sorting-asc {
  background: #e0f7fa;
}

.staffsListTable thead th.sorting-desc {
  background: #e0f7fa;
}

.staffsListTable tbody {
  width: 100%;
}

.staffsListTable tbody tr {
  -webkit-transition: background-color 0.5s ease;
  transition: background-color 0.5s ease;
  position: relative;
  z-index: 0;
}

.staffsListTable tbody tr:hover {
  background: rgba(224, 247, 250, 0.3);
  border: 1px solid #e0f7fa;
}

.staffsListTable tbody td {
  cursor: pointer;
  word-break: break-all;
  text-align: center;
}

.staffsListTable tbody td p {
  margin-bottom: 2px;
}

.staffsListTable .sortNum {
  width: 3%;
  text-align: center;
}

.staffsListTable .sortStaffDisabled {
  width: 6%;
}

.staffsListTable .sortAuthority,
.staffsListTable .sortJoinDate,
.staffsListTable .sortOrdersNum,
.staffsListTable .sortDeliveryNum,
.staffsListTable .sortRecoveryNum,
.staffsListTable .sortProductionNum {
  width: 7%;
}

.staffsListTable .sortFamilyName,
.staffsListTable .sortFirstName {
  width: 8%;
}

.staffsListTable .sortStaffCode {
  width: 9%;
}

.staffsListTable .sortFurigana,
.staffsListTable .sortStaffTel {
  width: 12%;
}

.staffsListTable .staffsDataDisabled {
  background: #eeeeee;
}

.staffsListTable .staffsDataDisabled:hover {
  background: rgba(224, 224, 224, 0.3);
  border: 1px solid #e0e0e0;
}

.staffs2ColTable th {
  width: 30%;
}

.staffs2ColTable th,
.staffs2ColTable td {
  text-align: left;
}

.staffs2ColTable .authority {
  width: 100px;
}

.staffs2ColTable .familyName,
.staffs2ColTable .firstName {
  width: 140px;
}

.staffs2ColTable .datepicker {
  width: 140px;
}

.staffs2ColTable .furigana,
.staffs2ColTable .email,
.staffs2ColTable .contact1,
.staffs2ColTable .contact2 {
  width: 100%;
}

.staffs2ColTable .nowPass,
.staffs2ColTable .newPass {
  margin-bottom: 3px;
  width: 100%;
}

/*----------------------------------------
	sales
----------------------------------------*/

.analysisContainer .baseCardsContentsHead {
  cursor: default;
}

.analysisPaidPlan {
  width: 100%;
  height: calc(100% - 1px);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.8);
  border-right: 0;
  border-left: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  z-index: 2;
  text-align: center;
}

.analysisPaidPlanBtn {
  margin: 20px auto 0;
  width: 100%;
  max-width: 300px;
  display: inline-block;
  font-size: 14px;
  font-size: 0.875rem;
  color: #ffffff !important;
  text-decoration: none;
  font-weight: 500;
}

.analysisPaidPlanBtn i {
  margin-right: 5px;
  color: #ffffff;
}

.analysisPaidPlanText {
  font-size: 24px;
  font-size: 1.5rem;
  color: #ffffff;
}

.salesTable th {
  width: 58px;
}

.salesTable td {
  padding: 10px 4px;
  width: calc((99.9% - 58px) / 12);
  white-space: nowrap;
  text-align: right;
}

.salesTableTotal {
  background: #fafafa;
  font-weight: 700;
}

/*----------------------------------------
	ec
----------------------------------------*/

.contentsHeaderContainer-ec {
  background: #eceff1;
}

.ecSearchNonMembersText {
  margin-left: 10px;
  min-height: 32px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  white-space: nowrap;
}

/*.ecSortContainer {
	display: flex;
	align-items: center;
	position: absolute;
	top: 0;
	right: 0;

	@include tablet {
		margin-bottom: 10px;
		justify-content: flex-end;
		position: static;
	}

	@include sp {
		margin-bottom: 10px;
		justify-content: flex-end;
		position: static;
	}

	.ecSortLabel {
		margin-right: 2px;
	}

	#ecSort {
		height: 32px;
	}
}*/

.ecTabsCartNum {
  margin-left: 4px;
  padding: 0 4px;
  height: 16px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border-radius: 3px;
  background: #424242;
  color: #ffffff;
  font-size: 11px;
  font-size: 0.6875rem;
  position: relative;
  top: 1px;
}

.ecHeader {
  padding: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  background: #fafafa;
}

.ecCategoryBox {
  margin-right: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.ecCategoryLabel {
  width: 60px;
  height: 32px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  background: #263238;
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
  color: #ffffff;
}

#ecCategory {
  width: 160px;
  height: 32px;
  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
  font-weight: 700;
}

.ecSearchBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.ecSearch {
  margin-right: auto;
  width: 300px;
  height: 32px;
  border-bottom-right-radius: 0;
  border-top-right-radius: 0;
  border-right: none;
}

.btnKeywordSearch {
  margin-left: 0 !important;
  width: 80px;
  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
}

.ecHeaderResult {
  margin-left: auto;
  text-align: right;
}

/*.contentsHeaderBoxEcSearch {
	min-height: 32px;
	display: flex;

	@include tablet {
		margin-top: 10px;
		width: 100%;
	}

	@include sp {
		margin-top: 10px;
		width: 100%;
		flex-direction: column;
	}
}*/

.checkboxList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.checkboxList li {
  margin: 5px 20px 5px 0;
}

.priceBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.priceBox .priceUnit {
  margin-left: 5px;
}

.priceBox .waveDash {
  margin: 0 8px;
}

.ecContactContainer {
  margin: 10px auto;
  padding: 10px 15px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  background: #fafafa;
}

.ecContactHead {
  margin-right: 20px;
  font-size: 14px;
  font-size: 0.875rem;
  font-weight: 700;
}

.ecContactTel {
  margin-right: 20px;
}

.ecContactTel a {
  font-size: 20px;
  font-size: 1.25rem;
  font-weight: 700;
  color: #546e7a;
  text-decoration: none;
}

.ecContactTel i {
  margin-right: 2px;
  font-size: 17px;
  font-size: 1.0625rem;
  color: #546e7a;
  position: relative;
  top: -1px;
}

.ecContactRead {
  line-height: 120%;
  font-size: 12px;
  font-size: 0.75rem;
}

.ecInfoContainer {
  margin: 15px auto;
  padding: 10px 15px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  border: 1px solid #e0e0e0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
}

.ecInfoHead {
  padding: 0 8px;
  font-size: 12px;
  font-size: 0.75rem;
  color: #00acc1;
  background: #ffffff;
  position: absolute;
  top: -12px;
  left: 7px;
}

.btnSelected {
  margin: 0 8px 0 0;
  padding: 3px 6px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background: #eceff1;
  border-radius: 4px;
  text-decoration: none;
  color: #212121;
  font-size: 12px;
  font-size: 0.75rem;
}

.btnSelected:hover {
  background: #cfd8dc;
  color: #212121;
}

.ecListContainer {
  margin-top: 10px;
}

.ecList {
  padding-left: 1px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.ecList > li {
  margin-top: -1px;
  margin-left: -1px;
  width: calc(20% - 1px);
  border: 1px solid #e0e0e0;
  position: relative;
}

.ecList .disable {
  display: none;
}

.ecListOutline {
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.ecListOutline-summary {
  padding: 20px 20px 5px;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.ecListOutline-price {
  padding: 0 15px 0 20px;
  width: 100%;
  height: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background: #fafafa;
}

.ecPhotos {
  margin-bottom: 10px;
}

.ecPhotosMain img {
  max-width: 100%;
  height: auto;
}

.ecPhotosList {
  margin-top: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.ecPhotosList li {
  margin: 0 10px;
}

.ecPhotosList li img {
  width: auto;
  max-height: 32px;
}

.ecPrice {
  margin-right: auto;
  font-weight: 700;
}

.ecDetailBtn {
  margin-left: auto;
}

.ecDetailBtn a {
  padding: 5px;
  display: inline-block;
  text-decoration: none;
  color: #00acc1 !important;
}

.ecDetailBtn a i {
  margin-right: 5px;
  color: #00acc1;
}

.ecNamePriceTable {
  width: 100%;
}

.ecNamePriceTable th,
.ecNamePriceTable td {
  padding: 4px;
  line-height: 130%;
  vertical-align: top;
}

.ecNamePriceTable th {
  width: 36px;
}

.ecNamePriceTable td {
  padding-left: 10px;
  position: relative;
  word-break: break-all;
}

.ecNamePriceTable td:before {
  content: ":";
  position: absolute;
  top: 3px;
  left: 2px;
}

.ecNamePriceTable .basket {
  width: 110px;
}

.ecHeadBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.ecDesc {
  margin-top: 5px;
  padding: 0 4px;
  line-height: 130%;
}

.ecOrderBtn {
  margin: auto auto 15px;
  padding-top: 20px;
  width: 100%;
  text-align: center;
}

.ecOrderBtn .btnCatalogOrder {
  margin: 0 auto;
}

.ecListDetail {
  padding: 10px 15px 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.9);
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: none;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.ecListDetailBox {
  height: calc(100% - 52px);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.ecDetailTable {
  width: 100%;
}

.ecDetailTable th,
.ecDetailTable td {
  padding: 4px;
  line-height: 130%;
  vertical-align: top;
  color: #ffffff;
}

.ecDetailTable th {
  width: 36px;
}

.ecDetailTable th span {
  color: #ffffff;
}

.ecDetailTable td {
  padding-left: 10px;
  position: relative;
  word-break: break-all;
}

.ecDetailTable td:before {
  content: ":";
  position: absolute;
  top: 3px;
  left: 2px;
}

.ecDetailTable a {
  color: #00acc1 !important;
}

.ecMessage {
  margin-top: 10px;
}

.ecMessage dt {
  margin-bottom: 3px;
  padding-bottom: 3px;
  border-bottom: 1px solid #ffffff;
}

.ecMessage * {
  color: #ffffff;
}

.ecListDetailClose {
  padding: 10px 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

.ecListDetailCloseBtn {
  width: 74px;
  height: 32px;
}

.ecListDetailCloseBtn i {
  margin-right: 5px;
  position: relative;
  top: 2px;
}

.ecBasket {
  margin: 0 auto 80px;
  max-width: 1100px;
  width: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.ecBasketOrder {
  margin-right: auto;
  width: 66.363%;
}

.ecBasketPriceDeli {
  margin-left: auto;
  width: 31.818%;
}

.ecBasketCards {
  margin-bottom: 20px;
  border: 1px solid #e0e0e0;
}

.ecBasketCardsHead {
  height: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background: #263238;
  border-bottom: 1px solid #e0e0e0;
  font-size: 16px;
  font-size: 1rem;
  font-weight: 500;
  color: #ffffff;
}

.ecBasketCardsContainer {
  padding: 20px;
}

.ecBasketCardsContainer .baseTable th {
  width: 100px;
  text-align: left;
  vertical-align: middle;
}

.ecBasketCardsContainer .baseTable th .fa-question-circle {
  margin: 0;
  float: right;
  top: -2px;
}

.ecBasketCardsContainer .baseTable .ecBasketPrice-totalBox {
  padding: 18px 10px;
  font-size: 18px;
  font-size: 1.125rem;
  font-weight: 700;
}

.ecBasketCardsContainer .baseTable #payjp_checkout_box input[type=button] {
  padding: 0;
  width: 100%;
  height: 28px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border-radius: 4px;
  background: #00acc1;
  border: 1px solid #0097a7;
  color: #ffffff;
}

.ecBasketCardsContainer .baseTable .datepicker2m {
  width: 100%;
}

.ecBasketCardsContainer .baseTable .hosokuJoho {
  width: 100%;
  min-height: 140px;
}

.ecBasketPriceTable td {
  text-align: right;
}

.ConfirmOrderBtn {
  margin-top: 10px;
  width: 100%;
  height: 50px;
  background: #7cb342;
  border: 1px solid #689f38;
  font-size: 18px;
  font-size: 1.125rem;
  color: #ffffff;
  font-weight: 500;
}

.ConfirmOrderBtn i {
  margin-right: 5px;
  color: #ffffff;
  position: relative;
  top: 1px;
}

.cancelOrderBtn {
  margin-top: 10px;
  width: 100%;
  height: 36px;
  background: #d81b60;
  border: 1px solid #c2185b;
  font-size: 14px;
  font-size: 0.875rem;
  color: #ffffff;
  font-weight: 500;
}

.cancelOrderBtn i {
  margin-right: 5px;
  color: #ffffff;
  position: relative;
  top: 1px;
}

.ecBasketOrderList {
  padding: 10px;
}

.ecBasketOrderList li {
  margin-bottom: 20px;
  padding: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  border: 1px solid #e0e0e0;
  position: relative;
}

.ecBasketOrderList li:last-child {
  margin-bottom: 0;
}

.ecBasketOrderPhoto {
  width: 30%;
  text-align: center;
}

.ecBasketOrderPhoto img {
  max-width: 100%;
  max-height: 146px;
}

.ecBasketOrderOutline {
  padding: 5px 5px 0;
  width: 40%;
}

.ecBasketOrderSub {
  width: 30%;
}

.ecBasketOrderTable {
  font-size: 14px;
  font-size: 0.875rem;
  width: 100%;
}

.ecBasketOrderTable th,
.ecBasketOrderTable td {
  padding: 4px;
  line-height: 130%;
  vertical-align: top;
}

.ecBasketOrderTable th {
  width: 44px;
  font-weight: 500;
}

.ecBasketOrderTable td {
  padding-left: 10px;
  position: relative;
  word-break: break-all;
}

.ecBasketOrderTable td:before {
  content: ":";
  position: absolute;
  top: 3px;
  left: 2px;
}

.ecBasketOrderTable td a i {
  color: #00acc1;
}

.ecBasketOrderDetailBtn {
  margin: 8px 0 8px 5px;
  color: #00acc1;
  font-size: 14px;
  font-size: 0.875rem;
  cursor: pointer;
}

.ecBasketOrderDetailBtn i {
  margin-right: 5px;
  color: #00acc1;
}

.ecBasketOrderDetailBtn .fa-times {
  margin-right: 8px;
}

.ecBasketOrderDetail {
  display: none;
}

.ecBasketMessage {
  margin: 10px 0;
  padding: 0 5px;
}

.ecBasketMessage * {
  font-size: 14px;
  font-size: 0.875rem;
}

.ecBasketMessage dt {
  margin-bottom: 5px;
  padding-bottom: 5px;
  border-bottom: 1px solid #212121;
}

.ecBasketMessage dd {
  line-height: 160%;
}

.ecBasketOrderSubtotal {
  padding: 10px;
  background: #fafafa;
}

.ecBasketOrderSubtotal * {
  font-size: 14px;
  font-size: 0.875rem;
}

.ecBasketOrderSubtotal dt {
  padding-left: 5px;
  letter-spacing: 0.1em;
}

.ecBasketOrderDeleteBtn {
  width: 24px;
  height: 24px;
  position: absolute;
  right: 10px;
  bottom: 10px;
  background: #bdbdbd;
  border: 1px solid #e0e0e0;
}

.ecBasketOrderDeleteBtn i {
  color: #ffffff;
  font-size: 17px;
  font-size: 1.0625rem;
}

.ecOrderHistoryHeader {
  padding: 0 20px;
  width: 100%;
  height: 60px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background: #fafafa;
}

.ecOrderHistoryHeader .datepicker2m {
  width: 90px;
  height: 32px;
}

.ecOrderHistoryHeader .waveDash {
  margin: 0 8px;
}

.ecOrderHistoryHeader .searchKey {
  margin-left: 20px;
  width: 340px;
  height: 32px;
}

.ecOrderHistoryHeaderBtn {
  margin-left: 10px;
  width: 60px;
  height: 32px;
}

.ecOrderHistory {
  padding: 0 20px 40px;
}

.ecOrderHistoryList li {
  padding: 15px;
  margin-bottom: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border: 1px solid #e0e0e0;
  border-radius: 4px;
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
  cursor: pointer;
}

.ecOrderHistoryList li:hover {
  background: rgba(224, 247, 250, 0.3);
  border: 1px solid #b2ebf2;
}

.ecOrderHistory-date {
  padding-right: 20px;
  width: 200px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.ecOrderHistory-commodity {
  padding: 0 20px;
  width: calc(100% - 390px);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-left: 1px solid #e0e0e0;
  border-right: 1px solid #e0e0e0;
}

.ecOrderHistory-price {
  padding-left: 20px;
  width: 190px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.orderedDate {
  margin-bottom: 8px;
  font-size: 18px;
  font-size: 1.125rem;
  font-weight: 500;
}

.orderedNum {
  margin: 4px 0;
}

.orderedDeli {
  margin: 4px 0;
}

.orderedCheck {
  margin: 4px 0;
}

.orderedSchedule {
  margin: 4px 0;
}

.orderedReceipt {
  margin: 4px 0;
}

.orderedStatus {
  margin: 8px 0;
  width: 100%;
  height: 32px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border: 1px solid #e0e0e0;
  border-radius: 4px;
  font-size: 13px;
  font-size: 0.8125rem;
}

.orderedPriceTable {
  width: 100%;
}

.orderedPriceTable tr {
  margin-right: 20px;
}

.orderedPriceTable th,
.orderedPriceTable td {
  padding: 2px;
  line-height: 130%;
}

.orderedPriceTable th {
  width: 44px;
  font-weight: 400;
}

.orderedPriceTable td {
  position: relative;
  word-break: break-all;
  text-align: right;
}

.orderedPriceTable td:before {
  content: ":";
  position: absolute;
  top: 0;
  left: 2px;
  font-size: 12px;
  font-size: 0.75rem;
  font-weight: 400 !important;
}

.orderedPriceTotal {
  font-size: 14px;
  font-size: 0.875rem;
  font-weight: 700;
}

.orderedPriceTotal:before {
  top: -1px;
  font-weight: 400;
}

.orderedCommodityTable {
  width: 100%;
}

.orderedCommodityTable thead {
  border-bottom: 1px solid #e0e0e0;
}

.orderedCommodityTable thead th {
  padding: 0 4px 4px;
  text-align: left;
  color: #bdbdbd;
  font-weight: 400;
  white-space: nowrap;
}

.orderedCommodityTable tbody tr:first-child td {
  padding: 6px 4px 2px;
}

.orderedCommodityTable tbody td {
  padding: 2px 4px;
}

.orderedCommodityNum {
  width: 18%;
}

.priceNum {
  width: 80px;
  text-align: right;
  white-space: nowrap;
}

.orderHistoryBtnBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.ConfirmReorderBtn {
  margin-top: 10px;
  width: 100%;
  height: 32px;
  background: #00acc1;
  border: 1px solid #0097a7;
  color: #ffffff;
  font-weight: 500;
}

.ConfirmReorderBtn i {
  margin-right: 5px;
  position: relative;
  top: 1px;
  color: #ffffff;
}

.cancelOrderHistoryBtn {
  margin-top: 6px;
  width: 100%;
  height: 32px;
  font-size: 12px;
  font-size: 0.75rem;
  color: #212121;
  font-weight: 500;
  letter-spacing: -0.05em;
}

.cancelOrderHistoryBtn:hover {
  color: #212121;
}

.cancelOrderHistoryBtn i {
  margin-right: 5px;
  color: #212121;
  position: relative;
  top: 1px;
}

/*----------------------------------------
	schedules
----------------------------------------*/

.contentsHeaderBoxInner-ehiden,
.contentsHeaderBoxInner-b2web {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.btnB2WebLink:hover i,
.btnEhidenLink:hover i {
  color: #006064;
}

.btnB2WebLink i,
.btnEhidenLink i {
  margin-right: 5px;
  color: #00acc1;
}

.schedulesHeader {
  padding: 0 20px;
  width: 100%;
  height: 60px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background: #fafafa;
}

.schedulesHeader .datepicker2m {
  width: 120px;
  height: 32px;
}

.schedulesSortContainer {
  margin-left: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

#schedulesSort {
  width: 80px;
  height: 32px;
}

.schedulesHeaderBtn {
  margin-right: 10px;
  width: 60px;
  height: 32px;
}

.schedulesSortBtn {
  margin-left: 10px;
  width: 32px;
  height: 32px;
}

.btnAddSchedule {
  background: #ffebee;
  border: 1px solid #ffcdd2;
}

.schedules {
  padding: 20px 20px 40px;
}

.schedulesList li {
  padding: 15px;
  margin-bottom: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  border: 1px solid #e0e0e0;
  border-radius: 4px;
  cursor: pointer;
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

.schedulesList li:hover {
  background: rgba(224, 247, 250, 0.3);
  border: 1px solid #e0f7fa;
}

.schedulesList .schedulesList-memo .schedules-remarks {
  width: calc(100% - 406px);
}

.schedulesList .schedulesList-memo .schedulesStatus {
  background: #ffebee;
  border: 1px solid #ffcdd2;
}

.schedulesList .schedulesList-already {
  background: #eeeeee;
}

.schedulesList .schedulesList-already:hover {
  background: rgba(245, 245, 245, 0.6);
  border: 1px solid #e0e0e0;
}

.schedulesList .schedulesList-already .schedulesStatus {
  background: #e0e0e0;
  border: 1px solid #e0e0e0;
}

.schedulesList .schedulesList-recovery .schedulesStatus {
  background: #fff8e1;
  border: 1px solid #ffecb3;
}

.schedulesList .schedulesList-prospect {
  background: #e1f5fe;
}

.schedulesList .schedulesList-prospect:hover {
  background: rgba(225, 245, 254, 0.6);
  border: 1px solid #e1f5fe;
}

.schedules-time {
  padding-right: 15px;
  width: 266px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-right: 1px solid #e0e0e0;
}

.schedules-deli {
  padding: 0 15px;
  width: calc((100% - 406px) / 4);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-right: 1px solid #e0e0e0;
}

.schedules-order {
  padding: 0 15px;
  width: calc((100% - 406px) / 4);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-right: 1px solid #e0e0e0;
}

.schedules-message {
  padding: 0 15px;
  width: calc((100% - 406px) / 4);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-right: 1px solid #e0e0e0;
}

.schedules-remarks {
  padding: 0 15px;
  width: calc((100% - 406px) / 4);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-right: 1px solid #e0e0e0;
}

.schedules-contractor {
  padding-left: 15px;
  width: 140px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.schedules-timeBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.schedules-flagBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.schedulesNum {
  margin-right: 5px;
  width: 32px;
  height: 32px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 4px;
  background: #263238;
  border: 1px solid #e0e0e0;
  color: #ffffff;
}

.schedulesTime {
  margin-right: auto;
  font-size: 20px;
  font-size: 1.25rem;
  font-weight: 500;
  position: relative;
  top: -1px;
}

.schedulesBtnBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.schedulesBtn {
  margin-left: 5px;
  width: 32px;
  height: 32px;
}

.schedulesBtn:first-child {
  margin-left: 0;
}

.schedulesBtn-orders {
  line-height: 100%;
  font-size: 10px;
  font-size: 0.625rem;
}

.schedulesIconBox {
  margin: 6px 0 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.schedulesIconBox i {
  margin-left: 8px;
  font-size: 14px;
  font-size: 0.875rem;
}

.schedulesIconBox i:last-child {
  margin-right: 8px;
}

.schedulesIconBox .fa-yen-sign {
  width: 18px;
  height: 18px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border-radius: 50%;
  background: #263238;
  color: #ffffff;
  text-align: center;
  font-size: 11px;
  font-size: 0.6875rem;
}

.schedulesIconBox .fa-yen-sign:before {
  margin: 0 auto;
}

.schedulesReceptionist {
  margin-top: 5px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: 13px;
  font-size: 0.8125rem;
}

.schedulesReceptionist i {
  margin: 0 13px 0 7px;
  font-size: 18px;
  font-size: 1.125rem;
}

.schedulesStatus {
  margin-top: 8px;
  width: 100%;
  height: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 4px;
  background: #fafafa;
  border: 1px solid #e0e0e0;
  font-size: 14px;
  font-size: 0.875rem;
  font-weight: 500;
}

.schedulesDetail dt {
  margin-bottom: 4px;
  padding-bottom: 4px;
  border-bottom: 1px solid #e0e0e0;
  color: #bdbdbd;
}

.schedulesDetail dd {
  line-height: 150%;
}

.schedulesDetail dd p {
  margin-bottom: 2px;
}

.schedulesDetail dd i {
  margin-right: 5px;
}

.schedulesDetail + .schedulesDetail {
  margin-top: 10px;
}

.schedulesDetailCommodity {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid #e0e0e0;
}

.notProduction {
  margin-top: 5px;
  width: 100%;
  height: 26px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 4px;
  background: #fafafa;
  border: 1px solid #e0e0e0;
  color: #bdbdbd;
}

.customerStatusContainer {
  margin-top: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.customerStatus {
  margin-right: 5px;
  padding: 0 3px;
  height: 20px;
  line-height: 120%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 4px;
  color: #ffffff;
}

.customerStatus-new {
  background: #7cb342;
  border: 1px solid #689f38;
}

.customerStatus-prospect {
  background: #039be5;
  border: 1px solid #0288d1;
}

.customerStatus-white-prospect {
  background: #ffffff;
  border: 1px solid #0288d1;
  color: #039be5;
}

.customerStatus-recovery {
  background: #ffb300;
  border: 1px solid #ffa000;
}

.customerStatus-paid {
  background: #00897b;
  border: 1px solid #00796b;
}

.defaultDialog {
  display: none;
}

.defaultDialog-open {
  margin: 0 10px;
}

.schedulesDialogInner {
  margin-top: 5px;
}

.schedulesDialogTable th {
  width: 130px;
}

.schedulesDialogTable th,
.schedulesDialogTable td {
  text-align: left;
}

.schedulesDialogTable .datepicker2m {
  width: 140px;
}

.schedulesDialogTable .timepicker {
  width: 80px;
}

.schedulesDialogTable .dialogContent {
  width: 100%;
}

.schedulesDialogTable .scheStaff {
  width: 140px;
}

.schedulesDialogTable .scheRemarksEdit {
  width: 100%;
  height: 100px;
}

.schedulesDialogTable .seisakuStaff {
  margin-right: 10px;
  width: 140px;
}

.dialogFlagBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.dialogFlagBox span {
  margin: 5px 20px 5px 0;
}

.dialogTimeBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.dialogTimeBox .waveDash {
  margin: 0 5px;
}

.seisakuStaffBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.dialogStatusBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.dialogStatusBox span {
  margin-right: 20px;
}

.ui-widget-content .defaultDialogBtn-clear {
  margin-right: auto !important;
}

.ui-widget-content .defaultDialogBtn-open {
  margin-right: auto !important;
  background: #212121;
  border: 1px solid #616161;
}

.ui-widget-content .defaultDialogBtn-open.ui-state-active {
  background: #212121 !important;
  border: 1px solid #616161 !important;
}

.ui-widget-content .defaultDialogBtn-open:hover {
  background: #212121 !important;
  border: 1px solid #616161 !important;
}

.ui-widget-content .defaultDialogBtn-open .ui-button-text {
  color: #ffffff;
}

.ui-widget-content .defaultDialogBtn-open .ui-icon {
  background-image: url(../images/ui-icons_ffffff_256x240.png);
}

.ui-widget-content .defaultDialogBtn-save {
  background: #00acc1;
  border: 1px solid #0097a7;
}

.ui-widget-content .defaultDialogBtn-save.ui-state-active {
  background: #00acc1 !important;
  border: 1px solid #0097a7 !important;
}

.ui-widget-content .defaultDialogBtn-save:hover {
  background: #00acc1 !important;
  border: 1px solid #0097a7 !important;
}

.ui-widget-content .defaultDialogBtn-save .ui-button-text {
  color: #ffffff;
}

.ui-widget-content .defaultDialogBtn-search {
  background: #00acc1;
  border: 1px solid #0097a7;
}

.ui-widget-content .defaultDialogBtn-search.ui-state-active {
  background: #00acc1 !important;
  border: 1px solid #0097a7 !important;
}

.ui-widget-content .defaultDialogBtn-search:hover {
  background: #00acc1 !important;
  border: 1px solid #0097a7 !important;
}

.ui-widget-content .defaultDialogBtn-search .ui-button-text {
  color: #ffffff;
}

.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  float: none;
}

.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset .ui-state-default:hover {
  background: #fafafa;
  border: 1px solid #e0e0e0;
}

.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset .ui-state-active {
  background: #eeeeee;
  border: 1px solid #e0e0e0;
}

/*----------------------------------------
	seikyu
----------------------------------------*/

.csName-seikyu {
  width: 250px;
}

.seikyu {
  padding: 20px 20px 40px;
}

.totalNumBox {
  margin-bottom: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.allCheckBtn {
  margin-right: auto;
  width: 140px;
  height: 32px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border-radius: 4px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border: 1px solid #e0e0e0;
}

.allCheckBtn .checkboxInput-style {
  font-size: 14px;
  font-size: 0.875rem;
}

.totalNumList {
  margin-left: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.totalNumList li {
  margin-left: 15px;
  font-size: 14px;
  font-size: 0.875rem;
}

.totalNumListEmphasis {
  margin: 0 5px;
  font-size: 20px;
  font-size: 1.25rem;
  color: #546e7a;
  font-weight: 700;
}

.totalNumListEmphasis-payment {
  margin: 0 5px;
  font-size: 20px;
  font-size: 1.25rem;
  color: #00acc1;
  font-weight: 700;
}

.seikyuList-item {
  padding: 15px;
  margin-bottom: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  border: 1px solid #e0e0e0;
  border-radius: 4px;
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
  cursor: pointer;
}

.seikyuList-item:hover {
  background: rgba(224, 247, 250, 0.3);
  border: 1px solid #e0f7fa;
}

.seikyuList-item-already {
  background: #eeeeee;
}

.seikyuList-numName {
  padding: 0 15px 0 0;
  width: 48%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-right: 1px solid #e0e0e0;
}

.seikyuList-orderAmount {
  padding: 0 15px;
  width: 12%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-right: 1px solid #e0e0e0;
}

.seikyuList-CarryoverAmount {
  padding: 0 15px;
  width: 12%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-right: 1px solid #e0e0e0;
}

.seikyuList-billingAmount {
  padding: 0 15px;
  width: 12%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-right: 1px solid #e0e0e0;
}

.seikyuList-billingDate {
  padding: 0 0 0 15px;
  width: 16%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.seikyu-numBox {
  margin-bottom: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.seikyu-name {
  font-size: 15px;
  font-size: 0.9375rem;
  font-weight: 500;
}

.seikyuCheckBtn {
  padding: 0 8px;
  width: 60px;
  height: 32px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border-radius: 4px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background: #263238;
  border: 1px solid #e0e0e0;
}

.seikyuCheckBtn .checkboxInput-style {
  width: 100%;
  text-align: center;
  color: #ffffff;
}

.seikyuPayment {
  margin: 0 auto 0 10px;
  padding: 0 10px;
  display: inline-block;
  height: 32px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border-radius: 4px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border: 1px solid #e0e0e0;
}

.seikyuStatus {
  margin-left: 10px;
  padding: 0 3px;
  height: 24px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 4px;
  color: #ffffff;
  font-size: 12px;
  font-size: 0.75rem;
}

.seikyuStatus-already-icon {
  padding: 0 1px 1px 0;
  width: 24px;
  height: 24px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border-radius: 50%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background: #bdbdbd;
  color: #ffffff;
  font-size: 11px;
  font-size: 0.6875rem;
}

.seikyuStatus-already {
  background: #039be5;
  border: 1px solid #0288d1;
}

.seikyuStatus-closingDate {
  background: #263238;
  border: 1px solid #263238;
}

.seikyuDetail {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.seikyuDetail dt {
  margin-bottom: 4px;
  padding-bottom: 4px;
  line-height: 130%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border-bottom: 1px solid #e0e0e0;
  color: #bdbdbd;
}

.seikyuDetail dt .diffPrice-minus {
  margin-left: auto;
  color: #e53935;
}

.seikyuDetail dt .diffPrice-plus {
  margin-left: auto;
  color: #1e88e5;
}

.seikyuDetail dt .fa-comment-dots {
  margin-left: auto;
}

.seikyuDetail dd {
  line-height: 150%;
}

.seikyuDetail dd p {
  margin-bottom: 2px;
}

.seikyuDetail + .seikyuDetail {
  margin-top: 10px;
}

.iconDiff {
  margin: 0 3px 0 auto;
  width: 16px;
  height: 16px;
  line-height: 1;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 4px;
  color: #ffffff;
  font-size: 11px;
  font-size: 0.6875rem;
  font-style: normal;
}

.iconDiff-plus {
  background: #1e88e5;
  border-bottom: 1px solid #1976d2;
}

.iconDiff-minus {
  background: #e53935;
  border-bottom: 1px solid #d32f2f;
}

.btnMinus {
  background: #ffebee;
  border: 1px solid #ef9a9a;
}

.btnMinus * {
  color: #d32f2f;
}

.seikyuInputBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.seikyuDate {
  width: 140px;
}

.seikyuPrice,
.seikyuCarryover {
  width: 122px;
}

.seikyuYen {
  margin-left: 6px;
}

.diffPrice {
  margin-left: 10px;
  display: inline-block;
}

.diffPrice-minus {
  color: #e53935;
  font-weight: 500;
}

.diffPrice-plus {
  color: #1e88e5;
  font-weight: 500;
}

.csNameInvoice {
  margin-bottom: 10px;
  width: 100%;
  height: 58px;
}

.seikyuDetailList {
  -webkit-overflow-scrolling: touch;
  overflow-x: auto;
}

.seikyuDetailsTable thead th {
  white-space: nowrap;
}

.seikyuDetailsTable tbody tr {
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
  cursor: pointer;
}

.seikyuDetailsTable tbody tr:hover {
  background: rgba(224, 247, 250, 0.3);
  border: 1px solid #e0f7fa;
}

.seikyuDetailsTable td {
  text-align: center;
}

.seikyuDetailsTable tfoot td {
  background: #e0f7fa;
  font-weight: 700;
  text-align: right;
  white-space: nowrap;
  font-size: 14px;
  font-size: 0.875rem;
}

.seikyuCsName,
.seikyuOrderName {
  width: 100%;
  min-width: 150px;
}

.seikyuBiko {
  width: 100%;
  min-width: 150px;
  height: 50px;
}

.nyukinSeikyuList-item {
  padding: 15px;
  margin-bottom: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  border: 1px solid #e0e0e0;
  border-radius: 4px;
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
  cursor: pointer;
}

.nyukinSeikyuList-item:hover {
  background: rgba(224, 247, 250, 0.3);
  border: 1px solid #e0f7fa;
}

.nyukinSeikyuList-item-already {
  background: #eeeeee;
}

.nyukinSeikyuList-item-already:hover {
  background: rgba(238, 238, 238, 0.6);
  border: 1px solid #eeeeee;
}

.nyukinSeikyuList-item-diff {
  background: #ffebee;
}

.nyukinSeikyuList-item-diff:hover {
  background: rgba(255, 235, 238, 0.6);
  border: 1px solid #ffebee;
}

.nyukinSeikyuList-numName {
  padding: 0 15px 0 0;
  width: 23%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-right: 1px solid #e0e0e0;
}

.nyukinSeikyuList-orderAmount {
  padding: 0 15px;
  width: 11%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-right: 1px solid #e0e0e0;
}

.nyukinSeikyuList-CarryoverAmount {
  padding: 0 15px;
  width: 11%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-right: 1px solid #e0e0e0;
}

.nyukinSeikyuList-billingAmount {
  padding: 0 15px;
  width: 11%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-right: 1px solid #e0e0e0;
}

.nyukinSeikyuList-paymentAmount {
  padding: 0 15px;
  width: 11%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-right: 1px solid #e0e0e0;
}

.nyukinSeikyuList-adjustmentAmount {
  padding: 0 15px;
  width: 11%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-right: 1px solid #e0e0e0;
}

.nyukinSeikyuList-adjustmentAmount dd {
  display: inline-block;
}

.nyukinSeikyuList-adjustmentAmount .fa-comment-dots {
  margin-left: 6px;
  padding: 0 4px;
  font-size: 15px;
  font-size: 0.9375rem;
  position: relative;
  top: 1px;
}

.nyukinSeikyuList-paymentDay {
  padding: 0 15px;
  width: 11%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-right: 1px solid #e0e0e0;
}

.nyukinSeikyuList-billingDate {
  padding: 0 0 0 15px;
  width: 11%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.nyukinPrice,
.nyukinDate {
  width: 100%;
  min-width: 76px;
}

.adjustmentAmountBtn {
  padding: 0 5px;
  min-width: 70px;
  height: 24px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background: #00acc1;
  border: 1px solid #0097a7;
  border-radius: 4px;
  text-decoration: none;
}

.adjustmentAmountBtn .fa-calculator {
  margin: 0;
  padding: 0;
  font-size: 14px;
  font-size: 0.875rem;
  color: #ffffff;
}

.adjustmentAmountPrice {
  color: #ffffff;
  font-size: 12px;
  font-size: 0.75rem;
}

.adjustmentAmountTable th,
.adjustmentAmountTable td {
  text-align: left;
  vertical-align: middle;
  font-weight: 500;
}

.adjustmentAmountBreakdown {
  margin: 10px auto 0;
  padding: 10px 5px;
  width: 400px;
  background: #fafafa;
  border: 1px solid #e0e0e0;
  border-radius: 4px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.adjustmentAmountBreakdownHead {
  margin-bottom: 8px;
  padding: 5px 10px 10px;
  font-size: 14px;
  font-size: 0.875rem;
  font-weight: 700;
  border-bottom: 1px solid #e0e0e0;
}

.adjustmentAmountBreakdownTable {
  width: 100%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.adjustmentAmountBreakdownTable th,
.adjustmentAmountBreakdownTable td {
  padding: 3px 10px;
  font-weight: 500;
}

.adjustmentAmountBreakdownTable td {
  text-align: right;
}

.adjustmentAmountBreakdownTable input {
  width: 140px;
  text-align: right;
}

.adjustmentAmountDiff {
  margin-top: 10px;
  padding: 0 15px;
  height: 46px;
  border: 1px solid #e0e0e0;
  border-radius: 4px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.adjustmentAmountDiff-minus {
  background: #ffebee;
}

.adjustmentAmountDiff-plus {
  background: #e1f5fe;
}

.adjustmentAmountDiff dt {
  font-size: 16px;
  font-size: 1rem;
  font-weight: 700;
}

.adjustmentAmountDiff .adjustmentAmountDiffPrice {
  margin-right: 10px;
  font-size: 20px;
  font-size: 1.25rem;
  font-weight: 700;
}

.nyukinMemo {
  margin-top: 10px;
  width: 100%;
}

.nyukinOtherList-item {
  padding: 15px;
  margin-bottom: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  border: 1px solid #e0e0e0;
  border-radius: 4px;
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
  cursor: pointer;
}

.nyukinOtherList-item:hover {
  background: rgba(224, 247, 250, 0.3);
  border: 1px solid #e0f7fa;
}

.nyukinOtherList-item-already {
  background: #eeeeee;
}

.nyukinOtherList-item-already:hover {
  background: rgba(238, 238, 238, 0.6);
  border: 1px solid #eeeeee;
}

.nyukinOtherList-item-diff {
  background: #ffebee;
}

.nyukinOtherList-item-diff:hover {
  background: rgba(255, 235, 238, 0.6);
  border: 1px solid #ffebee;
}

.nyukinOtherList-numName {
  padding: 0 15px 0 0;
  width: 35%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-right: 1px solid #e0e0e0;
}

.nyukinOtherList-deliDate {
  padding: 0 15px;
  width: 13%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-right: 1px solid #e0e0e0;
}

.nyukinOtherList-orderAmount {
  padding: 0 15px;
  width: 13%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-right: 1px solid #e0e0e0;
}

.nyukinOtherList-paymentAmount {
  padding: 0 15px;
  width: 13%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-right: 1px solid #e0e0e0;
}

.nyukinOtherList-adjustmentAmount {
  padding: 0 15px;
  width: 13%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-right: 1px solid #e0e0e0;
}

.nyukinOtherList-adjustmentAmount dd {
  display: inline-block;
}

.nyukinOtherList-adjustmentAmount .fa-comment-dots {
  margin-left: 6px;
  padding: 0 4px;
  font-size: 15px;
  font-size: 0.9375rem;
  position: relative;
  top: 1px;
}

.nyukinOtherList-paymentDay {
  padding: 0 0 0 15px;
  width: 13%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.minusPaymentRadioBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.minusPaymentRadioBox label {
  line-height: 150%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  white-space: nowrap;
}

.baseCardsContentsInner-minus {
  padding: 8px;
  border-left: 1px solid #e0e0e0;
  border-right: 1px solid #e0e0e0;
}

.minusColTable__inner th {
  padding-top: 13px;
}

.minusColTable__inner th .fa-question-circle {
  float: right;
  top: -2px;
}

.minusColTable__inner th a i {
  margin-left: 5px;
  color: #00acc1;
}

.minusColTable__inner th,
.minusColTable__inner td {
  text-align: left;
}

.minusTable tbody th,
.minusTable tbody td {
  padding: 8px;
  vertical-align: middle;
}

.minusTable tbody th {
  text-align: center;
}

.minusTable tfoot th,
.minusTable tfoot td {
  padding: 10px 8px;
  background: #e0f7fa;
}

.minusTable td {
  text-align: right;
}

.minusTable-commodity {
  width: auto !important;
}

.minusTable-num {
  width: 80px !important;
}

.minusTable-unit {
  width: 100px !important;
}

.minusTable-tax {
  width: 80px !important;
}

.minusTable-excluded {
  width: 80px !important;
}

.minusTable-included {
  width: 100px !important;
}

.minusTable-no {
  width: 35px !important;
  vertical-align: middle !important;
  font-size: 18px;
  font-size: 1.125rem;
  font-weight: 500;
  color: #757575;
  text-align: center !important;
}

.minusTable-name {
  min-width: 200px;
}

.minusTable-nameBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.minusTable .ordersNameWrite {
  width: calc(100% - 34px);
}

.minusTable .ordersNum {
  width: 40px;
  text-align: right;
}

.minusTable .ordersPrice {
  width: 60px;
  text-align: right;
}

.minusTable .ordersPriceTax {
  width: 60px;
  text-align: right;
}

/*----------------------------------------
	admin
----------------------------------------*/

#spaces {
  margin: 0 10px 40px;
}

.csCreditCard,
.orderInfo {
  margin-top: 5px;
  padding-top: 5px;
  border-top: 1px solid #e0e0e0;
}

.orderInfoBtn {
  margin-bottom: 3px;
  height: 26px;
}

.orderInfoBtn:hover {
  color: #00acc1;
}

.orderInfoBtn:hover i {
  color: #00acc1;
}

.customersListTable .customerStatus {
  margin: 0;
  height: 16px;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  font-size: 10px;
  font-size: 0.625rem;
  white-space: nowrap;
}

.customersListTable .customerStatus-paid {
  margin: 3px 0 0 -1px;
}

.customersListTable .customerStatus-usually {
  margin: 4px 0 0;
  border: 1px solid #757575;
  color: #424242;
}

.customersListTable .customerStatus-qfla {
  margin: 4px 0 0;
  border: 1px solid #757575;
  color: #424242;
}

.customersListTable .sortCsLogo,
.customersListTable .sortSendMailCheck {
  width: 4%;
  text-align: center;
  white-space: nowrap;
}

.customersListTable .sortCsLogo img,
.customersListTable .sortSendMailCheck img {
  max-width: 100%;
  height: auto;
}

.customersListTable .sortCsNum {
  width: 5%;
  text-align: center;
}

.customersListTable .sortCsRegiDate,
.customersListTable .sortLastLogin {
  width: 6%;
  text-align: center;
  white-space: nowrap;
}

.customersListTable .sortYamato {
  width: 7%;
  text-align: center;
}

.customersListTable .sortEcHistory,
.customersListTable .sortOrderInfo {
  width: 12%;
}

.customersListTable .sortCsAddress {
  width: 17%;
}

.customerBasic-logo img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 60px;
}

.customerRemarks {
  width: 100%;
  height: 200px;
  font-size: 12px;
  font-size: 0.75rem;
}

.ecOrderHistoryAdmin {
  padding: 20px 20px 40px;
}

.ecOrderHistoryAdmin-numBox {
  margin-bottom: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.ecOrderHistoryAdmin-name {
  font-size: 15px;
  font-size: 0.9375rem;
  font-weight: 500;
}

.ecOrderHistoryAdminList-item {
  padding: 15px;
  margin-bottom: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  border: 1px solid #e0e0e0;
  border-radius: 4px;
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
  cursor: pointer;
}

.ecOrderHistoryAdminList-item:hover {
  background: rgba(224, 247, 250, 0.3);
  border: 1px solid #e0f7fa;
}

.ecOrderHistoryAdminList-numName {
  padding: 0 15px 0 0;
  width: 40%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-right: 1px solid #e0e0e0;
}

.ecOrderHistoryAdminList-price {
  padding: 0 15px;
  width: 10%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-right: 1px solid #e0e0e0;
}

.ecOrderHistoryAdminList-price:last-child {
  padding: 0 0 0 15px;
  width: calc(10% - 15px);
  border-right: none;
}

.ecOrderHistoryAdminNum {
  margin-right: 10px;
  width: 32px;
  height: 32px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 4px;
  background: #263238;
  border: 1px solid #e0e0e0;
  color: #ffffff;
}

.ecOrderHistoryAdminDate {
  margin-right: auto;
  font-size: 18px;
  font-size: 1.125rem;
  font-weight: 500;
}

.ecOrderHistoryAdminStatus {
  width: 90px;
  height: 32px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border: 1px solid #e0e0e0;
  border-radius: 4px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.ecOrderHistoryAdminStatus-inPreparation {
  color: #f57c00;
}

.ecOrderHistoryAdminStatus-shipped {
  color: #7cb342;
}

.ecOrderHistoryAdminStatus-received {
  color: #00acc1;
}

.ecOrderHistoryAdminStatus-canceled {
  color: #e53935;
}

.ecOrderHistoryAdminDetail {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.ecOrderHistoryAdminDetail dt {
  margin-bottom: 4px;
  padding-bottom: 4px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border-bottom: 1px solid #e0e0e0;
  color: #bdbdbd;
  white-space: nowrap;
}

.ecOrderHistoryAdminDetail dd {
  line-height: 150%;
}

.ecOrderHistoryAdminDetail dd p {
  margin-bottom: 2px;
}

.ecOrderHistoryAdminDetail + .ecOrderHistoryAdmin {
  margin-top: 10px;
}

.ecBasketAdmin {
  margin: 0 10px 80px;
  width: calc(100% - 20px);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: baseline;
  -ms-flex-align: baseline;
  align-items: baseline;
}

.ecBasketAdminOrder {
  margin: 0 auto;
  width: calc(50% - 20px);
}

.ecBasketAdminPriceDeli {
  margin: 0 auto;
  width: calc(50% - 20px);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.ecBasketAdminCards {
  margin-bottom: 20px;
  width: calc(50% - 10px);
  border: 1px solid #e0e0e0;
}

.ecBasketAdminCardsContainer {
  padding: 20px;
}

.ecBasketAdminCardsContainer .baseTable th {
  width: 110px;
  text-align: left;
  vertical-align: middle;
}

.ecBasketAdminCardsContainer .baseTable th .fa-question-circle {
  margin: 0;
  float: right;
  top: -2px;
}

.ecBasketAdminCardsContainer .baseTable .ecBasketPrice-totalBox {
  padding: 18px 10px;
  font-size: 18px;
  font-size: 1.125rem;
  font-weight: 700;
}

.ecBasketAdminCardsContainer .baseTable #payjp_checkout_box input[type=button] {
  padding: 0;
  width: 100%;
  height: 28px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border-radius: 4px;
  background: #00acc1;
  border: 1px solid #0097a7;
  color: #ffffff;
}

.ecBasketAdminCardsContainer .baseTable .datepicker2m {
  width: 100%;
}

.ecBasketAdminCardsContainer .baseTable .hosokuJoho {
  width: 100%;
  min-height: 140px;
}

.ecBasketCheckDate {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.ecBasketCheckDate span {
  margin-right: 10px;
}

.ecBasketCheckDate span:last-child {
  margin-right: 0;
}

/*----------------------------------------
	orderForm
----------------------------------------*/

.gNav .headerGemCaseLogo {
  margin-right: 15px;
}

.gNav .headerGemCaseLogo img {
  max-width: 100%;
  height: auto;
}

.gNav .headerGemCaseLogo img {
  width: 112px;
  height: 40px;
}

.orderFormBtn i {
  margin-right: 5px !important;
}

#orderForm.contentsContainer {
  padding: 10px;
}

#orderForm .baseCardsContentsHead {
  cursor: inherit;
}

#orderForm .baseTable .tag-required {
  margin: 0;
  float: right;
  position: relative;
  top: -1px;
}

#orderForm #deliDate {
  margin-right: 5px;
  width: calc(60% - 8px);
}

#orderForm #deliTimeZoneText {
  width: 40%;
}

#orderForm #deliZipCode,
#orderForm #csZipCode {
  margin-bottom: 5px;
  width: 100px;
}

#orderForm #deliAddress,
#orderForm #deliNameFurigana,
#orderForm #csNameFurigana,
#orderForm #csAddress,
#orderForm #csEmail,
#orderForm #articleName,
#orderForm .useCdOther {
  width: 100%;
}

#orderForm #deliName,
#orderForm #csName,
#orderForm #orderPrice {
  margin-bottom: 5px;
  width: 100%;
}

#orderForm #deliTelNo,
#orderForm #csTelNo {
  width: 180px;
}

#orderForm #message,
#orderForm #biko {
  width: 100%;
  height: 80px;
}

#orderForm .ordersOutlineRadioBox-use label {
  width: 50%;
}

#orderForm .ordersOutlineRadioBox-use .otherLabel {
  width: 100%;
}

#orderForm .ordersOutlineRadioBox-payment {
  margin: 0;
}

#orderForm .paymentCdOther {
  width: 100%;
}

/*----------------------------------------
	mail
----------------------------------------*/

#mail {
  margin: 0 auto 80px;
  padding: 0 30px;
  max-width: 1000px;
}

.mailHeader {
  margin: 0 auto;
  padding: 30px 0;
  width: 100%;
  background: #ffffff;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1;
}

.mailHeader.headerLine {
  -webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.15);
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.15);
}

.mailHeader .container {
  max-width: 1000px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.mailHead {
  font-size: 22px;
  font-size: 1.375rem;
}

.mailHeaderBtnList {
  margin-left: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

.btnOrderMail {
  margin-left: 10px;
  width: 140px;
  height: 36px;
}

.btnOrderMail-close {
  background: #424242;
  border: 1px solid #212121;
  color: #ffffff;
  font-size: 16px;
  font-size: 1rem;
}

.btnOrderMail-close i {
  margin-right: 5px;
  color: #ffffff;
  position: relative;
  top: 1px;
}

.btnOrderMail-send {
  background: #00acc1;
  border: 1px solid #0097a7;
  color: #ffffff;
  font-size: 16px;
  font-size: 1rem;
}

.btnOrderMail-send i {
  margin-right: 5px;
  color: #ffffff;
  position: relative;
  top: 1px;
}

.mailBox {
  padding: 20px;
  background: #fafafa;
  border: 1px solid #e0e0e0;
  border-radius: 4px;
}

.mailTable {
  width: 100%;
  text-align: left;
}

.mailTable > tbody > tr > th {
  padding: 10px 0;
  width: 120px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 16px;
  font-size: 1rem;
  font-weight: 500;
  vertical-align: top;
}

.mailTable > tbody > tr > th[colspan] {
  width: auto;
}

.mailTable > tbody > tr > td {
  padding: 10px 0;
  width: calc(100% - 120px);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  vertical-align: top;
}

.mailTable > tbody > tr > td img {
  max-width: 100%;
  height: auto;
}

.mailTable > tbody > tr > td[colspan] {
  width: auto;
}

.mailTable > tbody > tr > td input[type=text],
.mailTable > tbody > tr > td input[type=email] {
  width: 100%;
  height: 36px;
}

.mailTable .thAdjustment {
  padding-top: 18px;
}

.mailTable .tag-required {
  float: right;
  position: relative;
  top: 1px;
}

.mailTable .mailName {
  margin-right: 20px;
}

.mailTable #btnReturn,
.mailTable #btnPreLoad {
  width: 180px;
  height: 32px;
}

.mailTable #mailHonbun {
  width: 100%;
  height: 350px;
}

.mailTable .mailAttachedImage {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
}

.mailTable .mailAttachedImage li {
  margin: 0 20px;
  width: calc(33.333% - 40px);
  text-align: center;
}

.mailTable .mailAttachedImage img {
  max-width: 300px;
  width: 100%;
  height: auto;
}

.mailTable .mailAttachedImage-photo {
  margin-bottom: 10px;
  display: inline-block;
}

.mailContentHead {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.mailContentHead-text {
  margin-right: auto;
  padding-top: 5px;
  display: block;
}

.mailContentHead #btnReturn {
  margin-left: 10px;
}

.mailContentHead .btn i {
  margin-right: 5px;
  position: relative;
  top: 1px;
}

.addressListBox {
  padding: 10px;
  width: 100%;
  max-height: 200px;
  -webkit-overflow-scrolling: touch;
  overflow-y: auto;
  background: #ffffff;
  border: 1px solid #e0e0e0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 4px;
}

.addressListTable {
  width: 100%;
  table-layout: fixed;
}

.addressListTable thead {
  border-bottom: 1px solid #e0e0e0;
}

.addressListTable thead th {
  padding: 6px 4px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  text-align: left;
  font-size: 12px;
  font-size: 0.75rem;
  color: #bdbdbd;
  font-weight: 400;
  white-space: nowrap;
}

.addressListTable tbody tr:first-child td {
  padding: 6px 4px 2px;
}

.addressListTable tbody td {
  padding: 2px 4px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 12px;
  font-size: 0.75rem;
}

.addressListTable .addressListNum {
  width: 8%;
}

.addressListTable .addressListName {
  width: 42%;
}

.addressListTable .addressListMail {
  width: 50%;
}

/*----------------------------------------
	ec dealer
----------------------------------------*/

#ecDashboard.contentsContainer {
  padding: 10px;
}

.lastMonthResults {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.lastMonthResults-item {
  margin-bottom: 10px;
  padding: 10px;
  width: calc(50% - 5px);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background: #fafafa;
  border: 1px solid #eeeeee;
  border-radius: 4px;
}

.lastMonthResultsTable {
  width: 100%;
}

.lastMonthResultsTable caption {
  margin-bottom: 8px;
  font-size: 14px;
  font-size: 0.875rem;
  font-weight: 700;
  background: none;
}

.lastMonthResultsTable tr {
  border-top: 1px solid #e0e0e0;
}

.lastMonthResultsTable tr:last-child th,
.lastMonthResultsTable tr:last-child td {
  padding-bottom: 0;
}

.lastMonthResultsTable th {
  padding: 8px 0 8px 5px;
  white-space: nowrap;
  font-weight: 400;
}

.lastMonthResultsTable td {
  padding: 8px 5px 8px 0;
  text-align: right;
}

.lastMonthResultsTable td b {
  display: inline-block;
  margin-right: 2px;
  font-size: 16px;
  font-size: 1rem;
}

.ecDealerOrderHistory {
  padding: 20px 20px 40px;
}

.ecDealerOrderHistoryList li a {
  padding: 15px;
  margin-bottom: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border: 1px solid #e0e0e0;
  border-radius: 4px;
  text-decoration: none;
}

.ecDealerOrderHistoryList li a:hover {
  background: rgba(224, 247, 250, 0.3);
  border: 1px solid #e0f7fa;
}

.ecDealerOrderHistory-date {
  padding-right: 15px;
  width: 200px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.ecDealerOrderHistory-buyer {
  padding: 0 15px;
  width: 22%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-left: 1px solid #e0e0e0;
  border-right: 1px solid #e0e0e0;
}

.ecDealerOrderHistory-commodity {
  padding: 0 15px;
  width: calc(78% - 360px);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-right: 1px solid #e0e0e0;
}

.ecDealerOrderHistory-price {
  padding-left: 15px;
  width: 160px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.ecDealerOrderHistoryDetail {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.ecDealerOrderHistoryDetail dt {
  margin-bottom: 4px;
  padding-bottom: 4px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border-bottom: 1px solid #e0e0e0;
  color: #bdbdbd;
  white-space: nowrap;
}

.ecDealerOrderHistoryDetail dd {
  line-height: 150%;
}

.ecDealerOrderHistoryDetail dd p {
  margin-bottom: 2px;
}

.ecDealerOrderHistoryDetail dd i {
  margin-right: 2px;
}

.searchKey-ecdealer {
  margin-right: auto;
  width: 360px;
  height: 32px;
  position: absolute;
  left: 0;
}

.ecDetailEditBtn {
  margin-right: auto;
}

.ecDetailEditBtn a {
  padding: 5px;
  display: inline-block;
  text-decoration: none;
  color: #00acc1 !important;
}

.ecDetailEditBtn a i {
  margin-right: 5px;
  color: #00acc1;
}

.dataRowBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.dataRowBox-100 {
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.dataRowBox-100 .dataRowBox-item100 {
  width: 100px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.dataRowBox-100 .dataRowBox-item {
  width: calc(100% - 5px);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.dataRowBox-item {
  margin: 0 10px 0 0;
}

.dataRowBox-item:last-child {
  margin: 0;
}

.labelHead {
  padding: 0 6px;
  height: 24px;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  background: #263238;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
  color: #ffffff;
  font-size: 12px;
  font-size: 0.75rem;
  white-space: nowrap;
}

.labelHead-140 {
  width: 140px;
}

.labelHead-target {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.labelHead i {
  margin-right: 0;
  color: #ffffff;
  font-size: 15px;
  font-size: 0.9375rem;
  position: relative;
  top: 0;
}

#detailEcArticle #articleNoDisp,
#detailEcArticle #articleName,
#detailEcArticle #bunrui,
#detailEcArticle #bunrui2,
#detailEcArticle #sizeText,
#detailEcArticle #lotNum,
#detailEcArticle #maxBascketCnt,
#detailEcArticle #lotHosoku,
#detailEcArticle #url {
  width: 100%;
}

#detailEcArticle #narabijun {
  width: 50px;
}

#detailEcArticle #jodaiPrice,
#detailEcArticle #price {
  width: 80px;
  text-align: right;
}

#detailEcArticle #startDate,
#detailEcArticle #endDate {
  width: 110px;
}

#detailEcArticle #dealerMessage {
  width: 100%;
  height: 160px;
}

.radioBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.radioBox label {
  margin-bottom: 5px;
  line-height: 150%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.ecPhotoList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.ecPhotoItem {
  padding: 10px;
  width: calc(33.333% - 6px);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border: 1px solid #e0e0e0;
}

.ecPhotoItem .photoDrag {
  margin: 0;
  width: 100%;
  height: 100%;
}

.ecPhoto img {
  max-width: 100%;
  height: auto;
}

.ecPhotoItemBtn {
  margin-top: 5px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

/*----------------------------------------
	other
----------------------------------------*/

@media only screen and (min-width: 1280px) {
  .pcNone {
    display: none !important;
  }

  .spVisible {
    display: none;
  }

  .tabVisible {
    display: none;
  }

  .tabSpVisible {
    display: none;
  }

  .ecContactTel a {
    pointer-events: none;
  }

  .ecList > li {
    width: calc(16.666% - 1px);
  }
}

@media all and (max-width: 900px) {
  .mfp-arrow {
    -webkit-transform: scale(0.75);
    transform: scale(0.75);
  }

  .mfp-arrow-left {
    -webkit-transform-origin: 0;
    transform-origin: 0;
  }

  .mfp-arrow-right {
    -webkit-transform-origin: 100%;
    transform-origin: 100%;
  }

  .mfp-container {
    padding-left: 6px;
    padding-right: 6px;
  }
}

@media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) {
  /**
  * Remove all paddings around the image on small screen
  */

  .mfp-img-mobile .mfp-image-holder {
    padding-left: 0;
    padding-right: 0;
  }

  .mfp-img-mobile img.mfp-img {
    padding: 0;
  }

  .mfp-img-mobile .mfp-figure:after {
    top: 0;
    bottom: 0;
  }

  .mfp-img-mobile .mfp-figure small {
    display: inline;
    margin-left: 5px;
  }

  .mfp-img-mobile .mfp-bottom-bar {
    background: rgba(0, 0, 0, 0.6);
    bottom: 0;
    margin: 0;
    top: auto;
    padding: 3px 5px;
    position: fixed;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  .mfp-img-mobile .mfp-bottom-bar:empty {
    padding: 0;
  }

  .mfp-img-mobile .mfp-counter {
    right: 5px;
    top: 3px;
  }

  .mfp-img-mobile .mfp-close {
    top: 0;
    right: 0;
    width: 35px;
    height: 35px;
    line-height: 35px;
    background: rgba(0, 0, 0, 0.6);
    position: fixed;
    text-align: center;
    padding: 0;
  }
}

@media only screen and (max-width: 767px) {
  .fl {
    float: none;
  }

  .fr {
    float: none;
  }

  .spNone {
    display: none !important;
  }

  .tabSpNone {
    display: none !important;
  }

  .tabVisible {
    display: none;
  }

  .pcVisible {
    display: none;
  }

  body .ui-tooltip {
    padding: 8px;
  }

  .baseTable th,
  .baseTable td {
    padding: 6px 8px;
  }

  input,
  select {
    -webkit-appearance: none;
  }

  textarea {
    -webkit-appearance: none;
  }

  .btnContainer-top {
    margin: 20px 10px;
  }

  .pagenation-total {
    margin-left: 10px;
    font-size: 12px;
    font-size: 0.75rem;
  }

  .pagenationBtn {
    width: 100px;
    height: 36px;
    font-size: 13px;
    font-size: 0.8125rem;
  }

  a:hover {
    opacity: 1  !important;
    filter: alpha(opacity=100);
  }

  a:hover img {
    opacity: 1  !important;
    filter: alpha(opacity=100);
  }

  .contentsHeaderContainer {
    padding: 10px;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }

  .contentsHeaderHead {
    margin-right: 0;
    font-size: 16px;
    font-size: 1rem;
  }

  .contentsHeaderHeadSub {
    margin: 0 0 0 auto;
  }

  .contentsContainer {
    padding: 0 0 10px;
  }

  .contentsHeaderBox {
    margin-left: auto;
    width: auto;
  }

  .contentsHeaderBtn {
    margin-left: 6px;
    width: auto;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
  }

  .contentsHeaderBtn i {
    margin-right: 0;
  }

  .contentsHeaderBtn-small {
    width: auto;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
  }

  .contentsHeaderBtn-total {
    margin-left: 6px;
  }

  .contentsHeaderBtn-other i {
    margin-right: 3px;
  }

  .contentsHeaderBtn .btnName {
    display: none;
  }

  .contentsHeaderBtnList {
    width: 130px;
  }

  .baseCardsBox {
    width: 100%;
  }

  .baseCardsBox-30 {
    width: 100%;
  }

  .baseCardsBox-40 {
    width: 100%;
  }

  .baseCardsBox-50 {
    width: 100%;
  }

  .baseCardsBox-60 {
    width: 100%;
  }

  .baseCardsBox-70 {
    width: 100%;
  }

  .baseCardsContentsHeadText-small {
    font-size: 10px;
    font-size: 0.625rem;
  }

  .baseCardsContentsHeadAttention {
    padding: 0 7px;
    font-size: 10px;
    font-size: 0.625rem;
  }

  .baseCardsContentsHeadBtn-copy .btnName {
    display: none;
  }

  .baseCardsContentsHeadBtn-copy i {
    margin-right: 0;
  }

  .headerCompany .headerCompanyLogo {
    width: 40px;
  }

  .headerCompany .headerCompanyLogo img {
    height: auto;
  }

  .headerCompany .headerCompanyLogo-orderForm {
    display: none;
  }

  .gNavNonMembers .nonMembersBtn-signup {
    padding: 0 8px;
    width: auto;
  }

  .gNavNonMembers .nonMembersBtn-login {
    width: 75px;
  }

  .gNavNonMembers .nonMembersBtn-login-ec {
    min-width: auto;
  }

  .headerUser .headerUserName {
    display: none;
  }

  .headerUser .headerUserSite {
    margin: 0 10px 0 0;
  }

  .headerUser .headerUserAdmin {
    margin-left: 5px;
  }

  .headerUser .headerUserAdminBtn {
    font-size: 11px;
    font-size: 0.6875rem;
  }

  .headerUser .headerUserAdminBtn i {
    margin-right: 0;
  }

  .headerUser .headerUserAdminBtn span {
    display: none;
  }

  .gNavSearch {
    margin-right: 0;
    padding: 5px 5px 5px 0;
    width: 100%;
    display: none;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background: #b0bec5;
  }

  .gNavSearch i {
    z-index: 1 !important;
    border-radius: 0;
    position: static;
  }

  .gNavSearch-sp {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }

  .gNavSearch-sp i {
    z-index: 1 !important;
    border-radius: 0;
    position: static;
  }

  .gNavSearchBox {
    padding-left: 8px;
    width: 100%;
    background: #ffffff;
    border-radius: 5px;
  }

  .gNavSearchBox:-moz-placeholder {
    color: #78909c;
  }

  .gNavSearchBox:-ms-input-placeholder {
    color: #78909c;
  }

  .gNavSearchBox:placeholder-shown {
    color: #78909c;
  }

  .gNavSearchBox::-webkit-input-placeholder {
    color: #78909c;
  }

  .gNavSearchBox:-moz-placeholder {
    opacity: 1;
    color: #78909c;
  }

  .gNavSearchBox::-moz-placeholder {
    opacity: 1;
    color: #78909c;
  }

  .gNavSearchBox:-ms-input-placeholder {
    color: #78909c;
  }

  .gNavSearchBox:focus {
    padding-left: 8px;
    width: 100%;
    background: #ffffff;
  }

  .gNavSearchBox.searchVal {
    width: 100%;
  }

  .gNavOpenContents-paidPlan {
    -webkit-box-ordinal-group: 5;
    -ms-flex-order: 4;
    order: 4;
  }

  .gNavOpenContents-dashboard {
    padding: 10px 10px 0;
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
  }

  .gNavOpenContents-dashboard .dashboardBtnBox {
    width: 100%;
  }

  .gNavOpenContents-dashboard .dashboardBtn {
    width: calc(40% - 20px);
    font-size: 14px;
    font-size: 0.875rem;
  }

  .gNavOpenContents-dashboard .linkLogoff {
    margin: 0 5px 0 20px;
    width: calc(30% - 10px);
  }

  .gNavOpenContents-dashboard .linkContact {
    margin: 0 5px 0 0;
    width: calc(30% - 10px);
  }

  .paidPlan {
    width: 100%;
  }

  .paidPlanBtn {
    width: calc(100% - 20px);
  }

  .staffList-staff > li {
    width: calc(100% - 20px);
  }

  .gNavOpenContents-menu {
    -webkit-box-ordinal-group: 4;
    -ms-flex-order: 3;
    order: 3;
  }

  .gNavMenu {
    width: calc(100% - 20px);
  }

  .paidPlanBox {
    width: calc(100% - 20px);
  }

  .btnWebsite {
    font-size: 10px;
    font-size: 0.625rem;
  }

  .gNavOpenContents-check {
    padding-bottom: 120px;
    -webkit-box-ordinal-group: 6;
    -ms-flex-order: 5;
    order: 5;
  }

  .checkContentsBox {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }

  .checkContents {
    margin: 0 10px 10px;
    width: calc(100% - 20px);
  }

  .checkContents:last-child {
    margin-bottom: 0;
  }

  .memoDialogTable tr {
    width: 100%;
    display: block;
  }

  .memoDialogTable th,
  .memoDialogTable td {
    margin-top: -1px;
    width: 100%;
    display: block;
  }

  .scheRemarksEdit {
    width: 220px;
  }

  .easyOrder {
    margin: 0 10px 40px;
  }

  .easyOrderHeader {
    margin: 20px 0 10px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
  }

  .easyOrderHeaderHead {
    margin-left: 10px;
    font-size: 20px;
    font-size: 1.25rem;
  }

  .easyOrderHeaderStep {
    margin: 15px 10px 5px;
    width: calc(100% - 20px);
  }

  .easyOrderHeaderStep-box {
    padding: 0 5px;
    width: 100%;
    height: 40px;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    border-left: 1px solid #ffffff;
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
  }

  .easyOrderHeaderStep-box:first-child {
    border-left: none;
  }

  .easyOrderHeaderStep-box i {
    font-size: 15px;
    font-size: 0.9375rem;
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%);
    position: absolute;
    top: 50%;
    right: 5px;
  }

  .easyOrderHeaderStep-num {
    margin-bottom: -10px;
    width: 100%;
    font-size: 11px;
    font-size: 0.6875rem;
  }

  .easyOrderHeaderStep-title {
    margin: 0;
    font-size: 12px;
    font-size: 0.75rem;
    letter-spacing: -0.05em;
  }

  .easyOrderHeaderStep-arrow {
    padding: 0 5px;
    width: auto;
    display: none;
  }

  .easyOrderHeaderStep-arrow i {
    font-size: 16px;
    font-size: 1rem;
  }

  .easyOrderContents {
    padding: 10px 10px 20px;
  }

  .easyOrderContentsHead {
    margin-bottom: 0;
    padding: 10px;
    height: auto;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    position: relative;
  }

  .easyOrderContentsHead-num {
    margin-bottom: 3px;
    width: 100%;
    font-size: 14px;
    font-size: 0.875rem;
  }

  .easyOrderContentsHead-title {
    margin: 0;
    font-size: 14px;
    font-size: 0.875rem;
  }

  .easyOrderContentsHead i {
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%);
    position: absolute;
    top: 50%;
    right: 10px;
    font-size: 18px;
    font-size: 1.125rem;
  }

  .easyOrderTable th {
    font-size: 16px;
    font-size: 1rem;
  }

  .easyOrderTable .datepicker {
    margin: 0 0 10px;
    width: 100%;
  }

  .easyOrderTable .timepicker {
    width: 100%;
  }

  .easyOrderTable .deliAddressArea,
  .easyOrderTable .custAddressArea {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }

  .easyOrderTable .deliTel,
  .easyOrderTable .custTel {
    width: 100%;
  }

  .easyOrderTable .ordersNameList {
    width: 100%;
  }

  .easyOrderTable .orderRadioBox label {
    width: 120px;
  }

  .easyOrderTable .orderRadioBox .otherLabel {
    width: 260px;
  }

  .easyOrderTable .budgetCd {
    margin-right: 0;
    width: 100%;
  }

  .easyOrderTable .budgetCdLabelBox {
    margin-top: 10px;
    width: 100%;
  }

  .easyOrderTable .paymentHeadBox {
    margin: 0 0 10px;
    width: 100%;
  }

  .easyOrderTable .orderMessage {
    height: 120px;
  }

  .easyOrderTable .orderRemarks {
    height: 120px;
  }

  .easyOrderTable .orderNum {
    width: 100%;
  }

  .easyOrderTable-head .tag {
    left: inherit;
    right: 0;
  }

  .deliZipBox,
  .custZipBox {
    margin-bottom: 10px;
  }

  .easyOrderBtn {
    margin: 0 10px;
    font-size: 16px;
    font-size: 1rem;
  }

  #orders {
    margin: 0 10px 40px;
  }

  #editOrderForm input[name=seikyuDate] {
    width: 100%;
  }

  #editOrderForm .paymentCdOther {
    width: 100%;
  }

  .contentsHeaderBtn-change {
    margin-left: 6px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }

  .contentsSearchHeader {
    padding: 10px;
    display: none;
  }

  .contentsSearchHeaderBox {
    margin-bottom: 0;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }

  .contentsSearchHeaderBoxInner {
    margin: 0 20px 10px 0;
  }

  .contentsSearchHeaderBoxInner-100 {
    margin: 0 0 10px;
    width: 100%;
  }

  .contentsSearchHeaderBoxInner-50 {
    margin: 0 10px 10px 0;
    width: calc(50% - 10px);
  }

  .contentsSearchForm {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }

  .contentsSearchForm-datebox {
    margin-bottom: 5px;
    width: 100%;
  }

  .contentsSearchForm .btn {
    width: 58px;
  }

  .contentsSearchForm #btnLastMonth {
    margin-left: 0;
  }

  .contentsSearchForm .paymentCd,
  .contentsSearchForm .orderStaff,
  .contentsSearchForm .useCd {
    width: 120px;
  }

  .contentsSearchForm .searchKey {
    width: 100%;
  }

  .contentsSearchCurrent {
    padding: 10px 10px 13px;
    display: block;
  }

  .ordersList {
    padding: 10px 0 0;
    -webkit-overflow-scrolling: touch;
    overflow-x: auto;
  }

  .ordersList + .pagenation {
    margin-top: 10px;
  }

  .orderListTable {
    table-layout: fixed;
  }

  .orderListTable thead {
    display: table-row-group;
    position: inherit;
  }

  .orderListTable thead:before {
    display: none;
  }

  .orderListTable tbody {
    display: table-row-group;
  }

  .orderListTable tbody td:active:before {
    padding-top: 3px;
    width: 100%;
    line-height: 110%;
    display: inline-block;
    -webkit-transform: scale(0.9, 0.9);
    transform: scale(0.9, 0.9);
    white-space: pre;
    position: absolute;
    top: 0;
    left: 0;
    text-align: center;
    font-size: 10px;
    font-size: 0.625rem;
    color: #bdbdbd;
  }

  .orderListTable tbody td.sortCheckEmail:active:before {
    content: "画像\a送付済";
  }

  .orderListTable tbody td.sortCheckDeli:active:before {
    content: "配送済\a送付済";
  }

  .orderListTable tbody td.sortCheckKaishu:active:before {
    content: "回収済";
  }

  .orderListTable tbody td.sortCheckNyukin:active:before {
    content: "入金済";
  }

  .orderListTable .sortNum {
    width: 40px;
  }

  .orderListTable .sortCheckEmail,
  .orderListTable .sortCheckDeli,
  .orderListTable .sortCheckKaishu,
  .orderListTable .sortCheckNyukin {
    width: 60px;
  }

  .orderListTable .sortPaymentCd,
  .orderListTable .sortUseCd {
    width: 110px;
  }

  .orderListTable .sortDeliDate,
  .orderListTable .sortPhoto {
    width: 110px;
  }

  .orderListTable .sortRemarks {
    width: 200px;
  }

  .orderListTable .sortDeliName,
  .orderListTable .sortCsName {
    width: 240px;
  }

  .orderListTable .sortPrice {
    width: 240px;
  }

  .contentsHeaderBoxOrders {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid #e0e0e0;
    width: 100%;
  }

  .contentsHeaderBoxOrders .ordersMikomi .radioInput-style {
    margin-right: 10px;
  }

  .contentsHeaderBoxOrders .ordersStaff {
    margin-right: auto;
    min-width: 90px;
  }

  .orders2ColTable tr {
    width: 100%;
    display: block;
  }

  .orders2ColTable tr th {
    padding: 6px 8px;
    width: 100%;
  }

  .orders2ColTable th,
  .orders2ColTable td {
    margin-top: -1px;
    width: 100%;
    display: block;
  }

  .baseCardsBox-100 .orders2ColTable th {
    width: 100%;
  }

  .ordersDeliDateTime .datepicker {
    margin: 0 0 5px;
    width: 100%;
  }

  .ordersDeliDateTime .timepicker {
    width: 100%;
  }

  .custPrintCheck {
    margin-bottom: 5px;
  }

  .baseCardsContentsInner-orders {
    overflow-x: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
  }

  .ordersOutlineRadioBox .otherLabel {
    width: 100%;
  }

  .ordersDetailTable .ordersStaff {
    width: 100%;
  }

  .ordersDetailTable .ordersHistoryOrderBox .otherLabel {
    width: 100%;
  }

  .ordersPaymentTable .nyukinStaff {
    width: 100%;
  }

  .customersSearchCurrent {
    padding: 10px 10px 13px;
    display: block;
  }

  .customersList {
    padding: 10px 0 0;
    margin-bottom: 10px;
    -webkit-overflow-scrolling: touch;
    overflow-x: auto;
  }

  .customersListTable {
    table-layout: fixed;
  }

  .customersListTable thead {
    display: table-row-group;
    position: inherit;
  }

  .customersListTable thead:before {
    display: none;
  }

  .customersListTable tbody {
    display: table-row-group;
  }

  .customersListTable tbody td:active:before {
    padding-top: 3px;
    width: 100%;
    line-height: 110%;
    display: inline-block;
    -webkit-transform: scale(0.9, 0.9);
    transform: scale(0.9, 0.9);
    white-space: pre;
    position: absolute;
    top: 0;
    left: 0;
    text-align: center;
    font-size: 10px;
    font-size: 0.625rem;
    color: #bdbdbd;
  }

  .customersListTable tbody td.sortCheckEmail:active:before {
    content: "画像\a送付済";
  }

  .customersListTable .sortNum {
    width: 40px;
  }

  .customersListTable .sortSendMailCheck {
    width: 50px;
  }

  .customersListTable .sortOrderNumTotal {
    width: 80px;
  }

  .customersListTable .sortPreviousMail,
  .customersListTable .sortPaymentMethod {
    width: 90px;
  }

  .customersListTable .sortMail,
  .customersListTable .sortPreviousOrder {
    width: 180px;
  }

  .customersListTable .sortCsNumName,
  .customersListTable .sortTelAdd,
  .customersListTable .sortSupplement {
    width: 200px;
  }

  .customersListTable .sortOrderPriceTotal {
    width: 160px;
  }

  .customers2ColTable tr {
    width: 100%;
    display: block;
  }

  .customers2ColTable th {
    padding: 6px 8px;
    width: 100%;
  }

  .customers2ColTable th,
  .customers2ColTable td {
    margin-top: -1px;
    width: 100%;
    display: block;
  }

  .customers2ColTable .mainStaffCd {
    width: 100%;
  }

  .customers2ColTable .csZipCode {
    margin: 0 10px 0 0;
  }

  .customers2ColTable .csTelNo,
  .customers2ColTable .csTelNo2,
  .customers2ColTable .csFaxNo,
  .customers2ColTable .csFaxNo2 {
    width: 100%;
  }

  .customersRowBox-100 {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }

  .customersRowBox-100 .customersRowBox-item {
    margin: 0 0 5px;
    width: 100%;
  }

  .customersRowBox-100 .customersRowBox-item:last-child {
    margin: 0;
  }

  .orderHistoryList {
    -webkit-overflow-scrolling: touch;
    overflow-x: auto;
  }

  .orderHistoryList + .pagenation {
    margin-top: 10px;
  }

  .orderHistoryListTable {
    table-layout: fixed;
  }

  .orderHistoryListTable .sortNum {
    width: 40px;
  }

  .orderHistoryListTable .sortDeliDateHistory,
  .orderHistoryListTable .sortPhotoHistory,
  .orderHistoryListTable .sortUseHistory,
  .orderHistoryListTable .sortPaymentHistory,
  .orderHistoryListTable .sortStaffHistory {
    width: 100px;
  }

  .orderHistoryListTable .sortPaymentTotalHistory {
    width: 120px;
  }

  .orderHistoryListTable .sortAddressHistory,
  .orderHistoryListTable .sortOrderPriceTotalHistory,
  .orderHistoryListTable .sortRemarksHistory {
    width: 200px;
  }

  .orderHistoryListTable .w2 {
    width: 40px;
  }

  .orderHistoryListTable .w6,
  .orderHistoryListTable .w7 {
    width: 100px;
  }

  .orderHistoryListTable .w10 {
    width: 160px;
  }

  .orderHistoryListTable .w15 {
    width: 180px;
  }

  .orderHistoryListTable .w20 {
    width: 260px;
  }

  .articlesList {
    -webkit-overflow-scrolling: touch;
    overflow-x: auto;
  }

  .articlesList + .pagenation {
    margin-top: 10px;
  }

  .articlesListTable {
    table-layout: fixed;
  }

  .articlesListTable .sortNum {
    width: 40px;
  }

  .articlesListTable .sortRecovery,
  .articlesListTable .sortCatalog,
  .articlesListTable .sortCommodityDisabled {
    width: 80px;
  }

  .articlesListTable .sortBasePrice,
  .articlesListTable .sortConsumptionTax,
  .articlesListTable .sortTaxIncluded,
  .articlesListTable .sortTotalOrder,
  .articlesListTable .sortGrossSales {
    width: 100px;
  }

  .articlesListTable .sortCommodityName,
  .articlesListTable .sortCommodityRemarks {
    width: 280px;
  }

  .commodity2ColTable tr {
    width: 100%;
    display: block;
  }

  .commodity2ColTable th {
    padding: 6px 8px;
    width: 100%;
  }

  .commodity2ColTable th,
  .commodity2ColTable td {
    margin-top: -1px;
    width: 100%;
    display: block;
  }

  .commodity2ColTable .price,
  .commodity2ColTable .total {
    width: 100%;
  }

  .eRecordList {
    padding: 10px 0 0;
    -webkit-overflow-scrolling: touch;
    overflow-x: auto;
  }

  .eRecordTable {
    table-layout: fixed;
  }

  .eRecordTable .sortBillingDate {
    width: 82px;
  }

  .eRecordTable .sortSuppliers {
    width: 168px;
  }

  .eRecordTable .sortCategory {
    width: 148px;
  }

  .eRecordTable .sortBillingAmount {
    width: 100px;
  }

  .eRecordTable .sortRemarks {
    width: 168px;
  }

  .eRecord2ColTable tr {
    width: 100%;
    display: block;
  }

  .eRecord2ColTable th {
    padding: 6px 8px;
    width: 100%;
  }

  .eRecord2ColTable th,
  .eRecord2ColTable td {
    margin-top: -1px;
    width: 100%;
    display: block;
  }

  .staffsList {
    -webkit-overflow-scrolling: touch;
    overflow-x: auto;
  }

  .staffsList + .pagenation {
    margin-top: 10px;
  }

  .staffsListTable {
    table-layout: fixed;
  }

  .staffsListTable .sortNum {
    width: 40px;
  }

  .staffsListTable .sortStaffDisabled {
    width: 70px;
  }

  .staffsListTable .sortAuthority,
  .staffsListTable .sortJoinDate,
  .staffsListTable .sortOrdersNum,
  .staffsListTable .sortDeliveryNum,
  .staffsListTable .sortRecoveryNum,
  .staffsListTable .sortProductionNum {
    width: 80px;
  }

  .staffsListTable .sortFamilyName,
  .staffsListTable .sortFirstName {
    width: 100px;
  }

  .staffsListTable .sortStaffCode {
    width: 110px;
  }

  .staffsListTable .sortFurigana,
  .staffsListTable .sortStaffTel {
    width: 170px;
  }

  .staffs2ColTable tr {
    width: 100%;
    display: block;
  }

  .staffs2ColTable th {
    padding: 6px 8px;
    width: 100%;
  }

  .staffs2ColTable th,
  .staffs2ColTable td {
    margin-top: -1px;
    width: 100%;
    display: block;
  }

  .staffs2ColTable .familyName,
  .staffs2ColTable .firstName {
    width: 100%;
  }

  .analysisPaidPlanText {
    font-size: 20px;
    font-size: 1.25rem;
  }

  #ec.contentsContainer {
    padding: 0 10px 10px;
  }

  .contentsHeaderBox-ec {
    margin-top: 6px;
  }

  .contentsHeaderBox-ecHistory {
    margin-left: 0;
  }

  .ecSearchNonMembersText {
    margin-left: 0;
    min-height: 22px;
  }

  .ecHeader {
    padding: 10px;
  }

  .ecCategoryBox {
    margin: 0;
    width: calc(100% - 128px);
    -webkit-box-ordinal-group: 4;
    -ms-flex-order: 3;
    order: 3;
  }

  #ecCategory {
    width: calc(100% - 60px);
  }

  .ecSearchBox {
    margin-bottom: 6px;
    width: calc(100% - 128px);
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
  }

  .ecSearch {
    width: 100%;
  }

  .ecCustomSearchBox {
    margin-bottom: 6px;
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
  }

  .btnCustomSearch {
    width: 120px;
  }

  .btnCustomSearch i {
    margin-right: 3px;
  }

  .ecHeaderResult {
    margin-left: 6px;
    width: 120px;
    -webkit-box-ordinal-group: 5;
    -ms-flex-order: 4;
    order: 4;
    text-align: center;
  }

  .priceBox .waveDash {
    margin: 0 4px;
  }

  .ecContactRead {
    margin-top: 5px;
  }

  .ecListOutline-summary {
    padding: 8px 8px 5px;
  }

  .ecListOutline-price {
    padding: 0 4px 0 8px;
  }

  .ecDetailBtn a i {
    margin-right: 2px;
  }

  .ecNamePriceTable .basket {
    width: auto;
  }

  .ecOrderBtn .btnCatalogOrder {
    width: 80%;
  }

  .ecListDetail {
    padding: 8px 8px 0;
  }

  .ecBasket {
    margin: 0 10px 40px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }

  .ecBasketOrder {
    width: 100%;
  }

  .ecBasketPriceDeli {
    width: 100%;
  }

  .ecBasketCards {
    width: 100%;
  }

  .ecBasketCardsContainer {
    padding: 10px;
  }

  .ecBasketOrderList {
    padding: 0;
  }

  .ecOrderHistoryHeader {
    padding: 10px;
    height: auto;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }

  .ecOrderHistoryHeader .datepicker2m {
    width: 74px;
  }

  .ecOrderHistoryHeader .waveDash {
    margin: 0 4px;
  }

  .ecOrderHistoryHeader .searchKey {
    margin: 6px 0 0;
    width: 100%;
  }

  .ecOrderHistoryHeaderBtn {
    margin-left: 6px;
    width: 37px;
  }

  .ecOrderHistory {
    padding: 0 10px 40px;
  }

  .ecOrderHistoryList li {
    margin-bottom: 15px;
    padding: 10px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }

  .ecOrderHistory-date {
    padding: 0;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }

  .ecOrderHistory-commodity {
    margin: 10px 0;
    padding: 5px 0;
    width: 100%;
    border: none;
    border-top: 1px dotted #e0e0e0;
    border-bottom: 1px solid #e0e0e0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .ecOrderHistory-price {
    padding: 0;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }

  .orderedDate {
    margin: 0;
    width: calc(100% - 120px);
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    font-size: 17px;
    font-size: 1.0625rem;
    letter-spacing: -0.05em;
  }

  .orderedNum {
    margin: 1px 0;
    -webkit-box-ordinal-group: 4;
    -ms-flex-order: 3;
    order: 3;
  }

  .orderedDeli {
    margin: 1px 0;
    width: 100%;
    -webkit-box-ordinal-group: 5;
    -ms-flex-order: 4;
    order: 4;
  }

  .orderedCheck {
    margin: 1px 0;
    width: 100%;
    -webkit-box-ordinal-group: 6;
    -ms-flex-order: 5;
    order: 5;
  }

  .orderedSchedule {
    margin: 1px 0;
    width: 100%;
    -webkit-box-ordinal-group: 6;
    -ms-flex-order: 5;
    order: 5;
  }

  .orderedReceipt {
    margin: 1px 0;
    width: 100%;
    -webkit-box-ordinal-group: 6;
    -ms-flex-order: 5;
    order: 5;
  }

  .orderedStatus {
    margin: 0;
    width: 120px;
    height: 28px;
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
  }

  .orderedPriceTable {
    width: calc(50% - 5px);
  }

  .orderedCommodityTable thead th {
    padding: 0 8px 4px 0;
  }

  .orderedCommodityTable tbody tr:first-child td {
    padding: 6px 8px 2px 0;
  }

  .orderedCommodityTable tbody td {
    padding: 0 8px 4px 0;
    white-space: nowrap;
  }

  .orderHistoryBtnBox {
    width: calc(50% - 5px);
  }

  .ConfirmReorderBtn {
    margin-top: 0;
  }

  .btnB2WebLink,
  .btnEhidenLink {
    width: 100%;
  }

  .schedulesHeader {
    padding: 10px;
    height: auto;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }

  .schedulesHeader .datepicker2m {
    width: 74px;
  }

  #schedulesSort {
    width: 50px;
  }

  .schedulesHeaderBtn {
    margin-right: 6px;
    width: 36px;
  }

  .schedulesSortBtn {
    margin-left: 6px;
  }

  .schedules {
    padding: 10px 10px 40px;
  }

  .schedulesList li {
    margin-bottom: 15px;
    padding: 10px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }

  .schedulesList .schedulesList-memo .schedules-remarks {
    width: 100%;
  }

  .schedules-time {
    padding: 0;
    margin-bottom: 0;
    width: 100%;
    border: none;
  }

  .schedules-deli {
    padding: 0;
    margin: 15px 0 0;
    width: 100%;
    border-right: none;
  }

  .schedules-order {
    padding: 0;
    margin: 15px 0 0;
    width: 100%;
    border-right: none;
  }

  .schedules-message {
    padding: 0;
    margin: 15px 0 0;
    width: 100%;
    border-right: none;
  }

  .schedules-remarks {
    padding: 0;
    margin: 15px 0 0;
    width: 100%;
    border-right: none;
  }

  .schedules-contractor {
    padding: 0;
    margin: 15px 0 0;
    width: 100%;
  }

  .schedulesDialogTable tr {
    width: 100%;
    display: block;
  }

  .schedulesDialogTable th,
  .schedulesDialogTable td {
    margin-top: -1px;
    width: 100%;
    display: block;
  }

  .csName-seikyu {
    width: 100%;
  }

  .seikyu {
    padding: 10px 10px 40px;
  }

  .totalNumBox {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }

  .allCheckBtn {
    width: 130px;
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
  }

  .totalNumList {
    /*margin-bottom: 10px;
    width: 100%;
    flex-direction: column;
    order: 1;*/
    margin: 0 0 10px;
    width: 100%;
    display: -ms-grid;
    display: grid;
    -ms-grid-rows: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    -ms-grid-columns: auto 1fr;
    grid-template-columns: auto 1fr;
  }

  .totalNumList-2 {
    -ms-grid-rows: 1fr;
    grid-template-rows: 1fr;
  }

  .totalNumList li {
    margin: 2px 0 0;
    text-align: right;
    font-size: 13px;
    font-size: 0.8125rem;
  }

  .totalNumList li:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-row-span: 5;
    grid-row: 1/6;
    -ms-grid-column: 1;
    -ms-grid-column-span: 1;
    grid-column: 1/2;
    text-align: left;
  }

  .totalNumListEmphasis {
    font-size: 19px;
    font-size: 1.1875rem;
    position: relative;
    top: 1px;
  }

  .totalNumListEmphasis-paymentRate {
    margin: 0 21px 0 5px;
    font-size: 19px;
    font-size: 1.1875rem;
  }

  .totalNumListEmphasis-payment {
    font-size: 19px;
    font-size: 1.1875rem;
  }

  .seikyuList-item {
    margin-bottom: 15px;
    padding: 10px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }

  .seikyuList-numName {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .seikyuList-orderAmount {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .seikyuList-CarryoverAmount {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .seikyuList-billingAmount {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .seikyuList-billingDate {
    padding: 0;
    width: 100%;
  }

  .nyukinSeikyuList-item {
    margin-bottom: 15px;
    padding: 10px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }

  .nyukinSeikyuList-numName {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .nyukinSeikyuList-orderAmount {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .nyukinSeikyuList-CarryoverAmount {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .nyukinSeikyuList-billingAmount {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .nyukinSeikyuList-paymentAmount {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .nyukinSeikyuList-adjustmentAmount {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .nyukinSeikyuList-paymentDay {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .nyukinSeikyuList-billingDate {
    padding: 0;
    width: 100%;
  }

  .nyukinPrice,
  .nyukinDate {
    width: 140px;
  }

  .adjustmentAmountBtn {
    max-width: 140px;
  }

  .adjustmentAmountBreakdown {
    width: auto;
  }

  .nyukinOtherList-item {
    margin-bottom: 15px;
    padding: 10px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }

  .nyukinOtherList-numName {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .nyukinOtherList-deliDate {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .nyukinOtherList-orderAmount {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .nyukinOtherList-paymentAmount {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .nyukinOtherList-adjustmentAmount {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .nyukinOtherList-paymentDay {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
  }

  .minusPaymentRadioBox label:first-child {
    margin-bottom: 5px;
  }

  .baseCardsContentsInner-minus {
    overflow-x: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
  }

  .minusColTable__inner {
    width: 100%;
    display: block;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  .minusColTable__inner th {
    padding: 6px 8px;
    width: 100%;
  }

  .minusColTable__inner th,
  .minusColTable__inner td {
    margin-top: -1px;
    width: 100%;
    display: block;
  }

  .customersListTable .sortCsLogo,
  .customersListTable .sortSendMailCheck {
    width: 50px;
  }

  .customersListTable .sortCsNum {
    width: 80px;
  }

  .customersListTable .sortCsRegiDate,
  .customersListTable .sortLastLogin {
    width: 90px;
  }

  .customersListTable .sortYamato {
    width: 90px;
  }

  .customersListTable .sortEcHistory,
  .customersListTable .sortOrderInfo {
    width: 210px;
  }

  .customersListTable .sortCsAddress {
    width: 280px;
  }

  .ecOrderHistoryAdmin {
    padding: 10px 10px 40px;
  }

  .ecOrderHistoryAdminList-item {
    margin-bottom: 15px;
    padding: 10px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }

  .ecOrderHistoryAdminList-numName {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .ecOrderHistoryAdminList-price {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .ecOrderHistoryAdminList-price:last-child {
    padding: 0;
    width: 100%;
  }

  .ecOrderHistoryAdminDate {
    font-size: 16px;
    font-size: 1rem;
  }

  .ecOrderHistoryAdminStatus {
    width: 74px;
    font-size: 11px;
    font-size: 0.6875rem;
  }

  .ecBasketAdmin {
    margin: 0 10px 40px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: auto;
  }

  .ecBasketAdminOrder {
    width: 100%;
  }

  .ecBasketAdminPriceDeli {
    width: 100%;
  }

  .ecBasketAdminCards {
    width: 100%;
  }

  .ecBasketAdminCardsContainer {
    padding: 10px;
  }

  .gNav .headerGemCaseLogo {
    margin-right: 5px;
  }

  .orderFormBtn .btnName {
    display: block;
  }

  #orderForm #deliDate {
    margin-bottom: 5px;
    width: 100%;
  }

  #mail {
    padding: 0 15px;
  }

  .mailHeader {
    padding: 15px 0;
  }

  .mailHeader .container {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }

  .mailHead {
    font-size: 18px;
    font-size: 1.125rem;
  }

  .mailHeaderBtnList {
    margin: 15px auto 0;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
  }

  .mailBox {
    padding: 15px;
  }

  .mailTable > tbody > tr {
    width: 100%;
    display: block;
  }

  .mailTable > tbody > tr > th {
    padding: 0 0 10px;
    width: 100%;
    display: block;
    font-size: 15px;
    font-size: 0.9375rem;
  }

  .mailTable > tbody > tr > td {
    padding: 0 0 30px;
    width: 100%;
    display: block;
  }

  .mailTable .thAdjustment {
    padding-top: 0;
  }

  .mailTable .mailName {
    margin: 0;
    display: block;
  }

  .mailTable .mailAddress {
    display: block;
  }

  .mailTable #btnReturn,
  .mailTable #btnPreLoad {
    padding: 0 5px;
    width: auto;
  }

  .mailTable .mailAttachedImage {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }

  .mailTable .mailAttachedImage li {
    margin: 0 10px 20px;
    width: calc(50% - 20px);
  }

  .mailContentHead {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }

  .mailContentHead-text {
    margin-bottom: 8px;
    width: 100%;
  }

  .addressListBox {
    overflow-x: auto;
  }

  .addressListTable tbody td {
    white-space: nowrap;
  }

  .lastMonthResults {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }

  .lastMonthResults-item {
    width: 100%;
  }

  .ecDealerOrderHistory {
    padding: 10px 10px 40px;
  }

  .ecDealerOrderHistoryList li a {
    margin-bottom: 15px;
    padding: 10px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }

  .ecDealerOrderHistory-date {
    padding: 0;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }

  .ecDealerOrderHistory-buyer {
    margin: 10px 0 0;
    padding: 5px 0 0;
    width: 100%;
    border: none;
    border-top: 1px dotted #e0e0e0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .ecDealerOrderHistory-commodity {
    margin: 10px 0;
    padding: 5px 0;
    width: 100%;
    border: none;
    border-top: 1px dotted #e0e0e0;
    border-bottom: 1px solid #e0e0e0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .ecDealerOrderHistory-price {
    padding: 0;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }

  .ecDealerOrderHistoryDetail .orderedPriceTable {
    width: 100%;
  }

  .searchKey-ecdealer {
    margin-bottom: 10px;
    width: 100%;
    position: static;
  }

  .ecDetailEditBtn a i {
    margin-right: 2px;
  }

  .dataRowBox-100 {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }

  .dataRowBox-100 .dataRowBox-item {
    margin: 0 0 5px;
    width: 100%;
  }

  .dataRowBox-100 .dataRowBox-item:last-child {
    margin: 0;
  }

  .ecPhotoList {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
}

@media only screen and (max-width: 639px) {
  .gNavOpen {
    padding-bottom: 120px;
    height: calc(100vh - 53px);
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    z-index: 1;
  }

  .gNavOpenContents {
    padding: 10px;
  }

  .gNavOpenContents-paidPlan {
    padding: 5px 0 20px;
  }

  .gNavOpenContents-dashboard {
    padding: 10px 0 0;
  }

  .gNavOpenContents-staff {
    padding: 10px 0 0;
    max-height: none;
    overflow: visible;
  }

  .gNavStaff {
    margin: 0 0 10px;
  }

  .gNavStaff-manager {
    width: 100%;
  }

  .gNavStaff-staff {
    width: 100%;
  }

  .gNavOpenContents-menu {
    padding: 10px 0 0;
    -webkit-box-ordinal-group: 4;
    -ms-flex-order: 3;
    order: 3;
  }

  .gNavOpenContents-check {
    padding: 20px 0 120px;
  }

  .ordersPhotoList li {
    width: calc(50% - 20px);
  }

  .ecList > li {
    margin: -1px -1px 0 0;
    width: calc(50% - 2px);
  }

  .ecBasketOrderList li {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }

  .ecBasketOrderPhoto {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    width: calc(50% - 5px);
  }

  .ecBasketOrderOutline {
    width: 100%;
    -webkit-box-ordinal-group: 4;
    -ms-flex-order: 3;
    order: 3;
  }

  .ecBasketOrderSub {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    width: calc(50% - 5px);
  }

  .ecPhotoItem {
    margin-bottom: 10px;
    width: calc(50% - 6px);
  }

  .ecPhotoItem .dz-clickable span {
    font-size: 11px;
    font-size: 0.6875rem;
  }
}

@media only screen and (min-width: 640px) and (max-width: 767px) {
  .fl {
    float: none;
  }

  .fr {
    float: none;
  }

  .gNavStaff-manager {
    width: 50%;
  }

  .gNavStaff-staff {
    width: 50%;
  }

  .gNavSection-staff .gNavOpenContents-paidPlan .paidPlan a {
    width: calc(50% - 20px);
  }

  .orders2ColTable tr th {
    width: 100%;
  }

  .baseCardsBox-100 .orders2ColTable th {
    width: 100%;
  }

  .ordersPhotoList li {
    width: calc(25% - 20px);
  }

  .customers2ColTable th {
    width: 100%;
  }

  .commodity2ColTable th {
    width: 100%;
  }

  .eRecord2ColTable th {
    width: 100%;
  }

  .staffs2ColTable th {
    width: 100%;
  }

  .btnKeywordSearch {
    width: auto !important;
  }

  .ecList > li {
    width: calc(33.333% - 1px);
  }

  .ecBasketPriceDeli {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }

  .ecBasketCards {
    width: calc(50% - 10px);
  }

  .ecBasketMessage {
    padding: 0 25px 0 5px;
  }

  .ecBasketOrderSubtotal {
    padding: 6px;
  }

  .ecBasketOrderSubtotal * {
    font-size: 13px;
    font-size: 0.8125rem;
  }

  .ecBasketOrderSubtotal .ecBasketOrderTable th {
    width: 30px;
  }

  .orderedPriceTable th,
  .orderedPriceTable td {
    height: 20px;
  }

  .schedules-time {
    padding: 0 0 10px 0;
    margin-bottom: 10px;
    width: 100%;
    border: none;
    border-bottom: 1px solid #e0e0e0;
  }

  .allCheckBtn {
    width: 130px;
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
  }

  .totalNumList {
    margin-bottom: 10px;
    width: 100%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
  }

  .totalNumList li {
    margin: 0;
  }

  .seikyuList-numName {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .seikyuList-orderAmount {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .seikyuList-CarryoverAmount {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .seikyuList-billingAmount {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .seikyuList-billingDate {
    padding: 0;
    width: 100%;
  }

  .nyukinSeikyuList-numName {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .nyukinSeikyuList-orderAmount {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .nyukinSeikyuList-CarryoverAmount {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .nyukinSeikyuList-billingAmount {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .nyukinSeikyuList-paymentAmount {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .nyukinSeikyuList-adjustmentAmount {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .nyukinSeikyuList-paymentDay {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .nyukinSeikyuList-billingDate {
    padding: 0;
    width: 100%;
  }

  .nyukinPrice,
  .nyukinDate {
    width: 140px;
  }

  .adjustmentAmountBtn {
    max-width: 140px;
  }

  .adjustmentAmountBreakdown {
    width: auto;
  }

  .nyukinOtherList-numName {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .nyukinOtherList-deliDate {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .nyukinOtherList-orderAmount {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .nyukinOtherList-paymentAmount {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .nyukinOtherList-adjustmentAmount {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .nyukinOtherList-paymentDay {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
  }

  .ecOrderHistoryAdminList-numName {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .ecOrderHistoryAdminList-price {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .ecBasketAdminPriceDeli {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }

  .ecBasketAdminCards {
    width: calc(50% - 10px);
  }
}

@media only screen and (min-width: 640px) and (max-width: 1023px) {
  .tabNone {
    display: none !important;
  }

  .tabSpNone {
    display: none !important;
  }

  .spVisible {
    display: none;
  }

  .pcVisible {
    display: none;
  }

  input,
  select {
    -webkit-appearance: none;
  }

  textarea {
    -webkit-appearance: none;
  }

  a:hover {
    opacity: 1  !important;
    filter: alpha(opacity=100);
  }

  a:hover img {
    opacity: 1  !important;
    filter: alpha(opacity=100);
  }

  .contentsHeaderContainer {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }

  .contentsHeaderBox {
    width: auto;
  }

  .contentsHeaderBtn {
    min-width: 120px;
  }

  .contentsHeaderBtn-total {
    width: auto;
  }

  .baseCardsBox {
    width: 50%;
  }

  .baseCardsBox-30 {
    width: 100%;
  }

  .baseCardsBox-40 {
    width: 100%;
  }

  .baseCardsBox-60 {
    width: 100%;
  }

  .baseCardsBox-70 {
    width: 100%;
  }

  .baseCardsContentsHeadText-small {
    font-size: 11px;
    font-size: 0.6875rem;
  }

  .gNavSearch {
    margin-right: 0;
    padding: 5px 5px 5px 0;
    display: none;
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background: #b0bec5;
  }

  .gNavSearch i {
    z-index: 1 !important;
    border-radius: 0;
    position: static;
  }

  .gNavSearch-sp {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }

  .gNavSearch-sp i {
    z-index: 1 !important;
    border-radius: 0;
    position: static;
  }

  .gNavSearchBox {
    padding-left: 8px;
    width: 100%;
    background: #ffffff;
    border-radius: 5px;
  }

  .gNavSearchBox:-moz-placeholder {
    color: #78909c;
  }

  .gNavSearchBox:-ms-input-placeholder {
    color: #78909c;
  }

  .gNavSearchBox:placeholder-shown {
    color: #78909c;
  }

  .gNavSearchBox::-webkit-input-placeholder {
    color: #78909c;
  }

  .gNavSearchBox:-moz-placeholder {
    opacity: 1;
    color: #78909c;
  }

  .gNavSearchBox::-moz-placeholder {
    opacity: 1;
    color: #78909c;
  }

  .gNavSearchBox:-ms-input-placeholder {
    color: #78909c;
  }

  .gNavSearchBox:focus {
    padding-left: 8px;
    width: 100%;
    background: #ffffff;
  }

  .gNavSearchBox.searchVal {
    width: 100%;
  }

  .gNavOpenContents-paidPlan {
    -webkit-box-ordinal-group: 5;
    -ms-flex-order: 4;
    order: 4;
  }

  .gNavOpenContents-dashboard {
    padding: 15px 10px 0;
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
  }

  .gNavOpenContents-dashboard .dashboardBtnBox {
    width: 100%;
  }

  .gNavOpenContents-dashboard .dashboardBtn {
    width: calc(40% - 20px);
  }

  .gNavOpenContents-dashboard .linkLogoff {
    margin: 0 10px;
  }

  .gNavOpenContents-dashboard .linkContact {
    margin: 0 10px;
  }

  .paidPlan {
    width: 100%;
  }

  .paidPlanBtn {
    width: calc(50% - 20px);
  }

  .gNavStaff-manager {
    width: 33.333%;
  }

  .gNavStaff-staff {
    width: 66.666%;
  }

  .staffList-staff > li {
    width: calc(50% - 20px);
  }

  .gNavSection-staff .gNavOpenContents-paidPlan .paidPlan a {
    width: calc(66.666% - 20px);
  }

  .gNavOpenContents-menu {
    -webkit-box-ordinal-group: 4;
    -ms-flex-order: 3;
    order: 3;
  }

  .gNavMenu {
    width: calc(50% - 20px);
  }

  .paidPlanBox {
    width: calc(50% - 20px);
  }

  .gNavOpenContents-check {
    padding-bottom: 120px;
    -webkit-box-ordinal-group: 6;
    -ms-flex-order: 5;
    order: 5;
  }

  .easyOrder {
    margin: 0 20px 60px;
  }

  .easyOrderHeader {
    margin: 30px 0 20px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
  }

  .easyOrderHeaderStep {
    margin: 20px 20px 5px;
    width: calc(100% - 40px);
  }

  .easyOrderHeaderStep-box {
    width: 100%;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
  }

  .easyOrderHeaderStep-title {
    font-size: 16px;
    font-size: 1rem;
  }

  .easyOrderContents {
    padding: 15px 20px;
  }

  #editOrderForm input[name=seikyuDate] {
    width: 100%;
  }

  #editOrderForm .paymentCdOther {
    width: 100%;
  }

  .contentsHeaderBtn-change {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }

  .contentsSearchHeader {
    display: none;
  }

  .contentsSearchHeaderBox {
    margin-bottom: 0;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }

  .contentsSearchHeaderBoxInner {
    margin: 0 20px 10px 0;
  }

  .contentsSearchHeaderBoxInner-100 {
    margin: 0 0 10px;
    width: 100%;
  }

  .contentsSearchForm {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
  }

  .contentsSearchForm .searchKey {
    width: 100%;
  }

  .contentsSearchCurrent {
    display: block;
  }

  .ordersList {
    padding: 10px 0 0;
    -webkit-overflow-scrolling: touch;
    overflow-x: auto;
  }

  .ordersList + .pagenation {
    margin-top: 10px;
  }

  .orderListTable {
    table-layout: fixed;
  }

  .orderListTable thead {
    display: table-row-group;
    position: inherit;
  }

  .orderListTable thead:before {
    display: none;
  }

  .orderListTable tbody {
    display: table-row-group;
  }

  .orderListTable .sortNum {
    width: 40px;
  }

  .orderListTable .sortCheckEmail,
  .orderListTable .sortCheckDeli,
  .orderListTable .sortCheckKaishu,
  .orderListTable .sortCheckNyukin {
    width: 60px;
  }

  .orderListTable .sortPaymentCd,
  .orderListTable .sortUseCd {
    width: 110px;
  }

  .orderListTable .sortDeliDate,
  .orderListTable .sortPhoto {
    width: 110px;
  }

  .orderListTable .sortRemarks {
    width: 200px;
  }

  .orderListTable .sortDeliName,
  .orderListTable .sortCsName {
    width: 240px;
  }

  .orderListTable .sortPrice {
    width: 240px;
  }

  .contentsHeaderBoxOrders {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid #e0e0e0;
    width: 100%;
  }

  .contentsHeaderBoxOrders .ordersMikomi {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }

  .ordersDeliDateTime .datepicker {
    margin: 0 0 5px;
    width: 100%;
  }

  .ordersDeliDateTime .timepicker {
    width: 100%;
  }

  .ordersDeliTimeBox {
    width: 100%;
  }

  .ordersDateTime .datepicker {
    margin-right: 5px;
    width: 100%;
  }

  .ordersDateTime .timepicker {
    width: 100%;
  }

  .baseCardsContentsInner-orders {
    overflow-x: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
  }

  .ordersOutlineRadioBox .otherLabel {
    width: 100%;
  }

  .ordersDetailTable .ordersStaff {
    width: 100%;
  }

  .ordersDetailTable .ordersHistoryOrderBox .otherLabel {
    width: 100%;
  }

  .ordersPaymentTable .nyukinStaff {
    width: 100%;
  }

  .customersSearchCurrent {
    display: block;
  }

  .customersList {
    padding: 10px 0 0;
    margin-bottom: 10px;
    -webkit-overflow-scrolling: touch;
    overflow-x: auto;
  }

  .customersListTable {
    table-layout: fixed;
  }

  .customersListTable thead {
    display: table-row-group;
    position: inherit;
  }

  .customersListTable thead:before {
    display: none;
  }

  .customersListTable tbody {
    display: table-row-group;
  }

  .customersListTable .sortNum {
    width: 40px;
  }

  .customersListTable .sortSendMailCheck {
    width: 50px;
  }

  .customersListTable .sortOrderNumTotal {
    width: 80px;
  }

  .customersListTable .sortPreviousMail,
  .customersListTable .sortPaymentMethod {
    width: 90px;
  }

  .customersListTable .sortMail,
  .customersListTable .sortPreviousOrder {
    width: 180px;
  }

  .customersListTable .sortCsNumName,
  .customersListTable .sortTelAdd,
  .customersListTable .sortSupplement {
    width: 200px;
  }

  .customersListTable .sortOrderPriceTotal {
    width: 160px;
  }

  .orderHistoryList {
    -webkit-overflow-scrolling: touch;
    overflow-x: auto;
  }

  .orderHistoryList + .pagenation {
    margin-top: 10px;
  }

  .orderHistoryListTable {
    table-layout: fixed;
  }

  .orderHistoryListTable .sortNum {
    width: 40px;
  }

  .orderHistoryListTable .sortDeliDateHistory,
  .orderHistoryListTable .sortPhotoHistory,
  .orderHistoryListTable .sortUseHistory,
  .orderHistoryListTable .sortPaymentHistory,
  .orderHistoryListTable .sortStaffHistory {
    width: 100px;
  }

  .orderHistoryListTable .sortPaymentTotalHistory {
    width: 120px;
  }

  .orderHistoryListTable .sortAddressHistory,
  .orderHistoryListTable .sortOrderPriceTotalHistory,
  .orderHistoryListTable .sortRemarksHistory {
    width: 200px;
  }

  .orderHistoryListTable .w2 {
    width: 40px;
  }

  .orderHistoryListTable .w6,
  .orderHistoryListTable .w7 {
    width: 100px;
  }

  .orderHistoryListTable .w10 {
    width: 160px;
  }

  .orderHistoryListTable .w15 {
    width: 180px;
  }

  .orderHistoryListTable .w20 {
    width: 260px;
  }

  .articlesList {
    -webkit-overflow-scrolling: touch;
    overflow-x: auto;
  }

  .articlesList + .pagenation {
    margin-top: 10px;
  }

  .articlesListTable {
    table-layout: fixed;
  }

  .articlesListTable .sortNum {
    width: 40px;
  }

  .articlesListTable .sortRecovery,
  .articlesListTable .sortCatalog,
  .articlesListTable .sortCommodityDisabled {
    width: 80px;
  }

  .articlesListTable .sortBasePrice,
  .articlesListTable .sortConsumptionTax,
  .articlesListTable .sortTaxIncluded,
  .articlesListTable .sortTotalOrder,
  .articlesListTable .sortGrossSales {
    width: 100px;
  }

  .articlesListTable .sortCommodityName,
  .articlesListTable .sortCommodityRemarks {
    width: 280px;
  }

  .eRecordList {
    padding: 10px 0 0;
    -webkit-overflow-scrolling: touch;
    overflow-x: auto;
  }

  .eRecordTable {
    table-layout: fixed;
  }

  .staffsList {
    -webkit-overflow-scrolling: touch;
    overflow-x: auto;
  }

  .staffsList + .pagenation {
    margin-top: 10px;
  }

  .staffsListTable {
    table-layout: fixed;
  }

  .staffsListTable .sortNum {
    width: 40px;
  }

  .staffsListTable .sortStaffDisabled {
    width: 70px;
  }

  .staffsListTable .sortAuthority,
  .staffsListTable .sortJoinDate,
  .staffsListTable .sortOrdersNum,
  .staffsListTable .sortDeliveryNum,
  .staffsListTable .sortRecoveryNum,
  .staffsListTable .sortProductionNum {
    width: 80px;
  }

  .staffsListTable .sortFamilyName,
  .staffsListTable .sortFirstName {
    width: 100px;
  }

  .staffsListTable .sortStaffCode {
    width: 110px;
  }

  .staffsListTable .sortFurigana,
  .staffsListTable .sortStaffTel {
    width: 170px;
  }

  .staffs2ColTable .familyName,
  .staffs2ColTable .firstName {
    width: 100%;
  }

  .ecList > li {
    width: calc(33.333% - 1px);
  }

  .ecBasket {
    margin: 0 20px 60px;
  }

  .ecBasketOrder {
    width: calc(100% - 320px);
  }

  .ecBasketPriceDeli {
    width: 300px;
  }

  .ecBasketCardsContainer {
    padding: 10px;
  }

  .ecBasketCardsContainer .baseTable th {
    width: 90px;
  }

  .ecOrderHistoryList li {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }

  .ecOrderHistory-date {
    padding: 0;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }

  .ecOrderHistory-commodity {
    margin: 10px 0;
    padding: 10px 0;
    width: 100%;
    border: none;
    border-top: 1px dotted #e0e0e0;
    border-bottom: 1px solid #e0e0e0;
  }

  .ecOrderHistory-price {
    padding: 0;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }

  .orderedDate {
    margin: 0;
    width: calc(100% - 120px);
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
  }

  .orderedNum {
    margin: 0 10px 0 0;
    -webkit-box-ordinal-group: 4;
    -ms-flex-order: 3;
    order: 3;
  }

  .orderedDeli {
    margin: 0 10px;
    -webkit-box-ordinal-group: 5;
    -ms-flex-order: 4;
    order: 4;
  }

  .orderedCheck {
    margin: 0 10px;
    -webkit-box-ordinal-group: 6;
    -ms-flex-order: 5;
    order: 5;
  }

  .orderedSchedule {
    margin: 0 10px;
    -webkit-box-ordinal-group: 6;
    -ms-flex-order: 5;
    order: 5;
  }

  .orderedReceipt {
    margin: 0 10px;
    -webkit-box-ordinal-group: 6;
    -ms-flex-order: 5;
    order: 5;
  }

  .orderedStatus {
    margin: 0;
    width: 120px;
    height: 28px;
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
  }

  .orderedPriceTable {
    width: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }

  .orderedPriceTable tbody {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }

  .orderedPriceTable th,
  .orderedPriceTable td {
    height: 32px;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }

  .orderedPriceTable th {
    padding: 0;
    width: auto;
  }

  .orderedPriceTable th:after {
    margin: 0 5px;
    content: ":";
    font-weight: 400 !important;
  }

  .orderedPriceTable td {
    padding: 0;
  }

  .orderedPriceTable td:before {
    display: none;
  }

  .orderedPriceTable .ecHeadBox {
    display: inline-block;
  }

  .orderedCommodityTable thead th {
    padding: 0 8px 4px 0;
  }

  .orderedCommodityTable tbody tr:first-child td {
    padding: 6px 8px 2px 0;
  }

  .orderedCommodityTable tbody td {
    padding: 0 8px 4px 0;
  }

  .orderHistoryBtnBox {
    margin-left: auto;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
  }

  .ConfirmReorderBtn {
    margin-top: 0;
    width: 160px;
  }

  .cancelOrderHistoryBtn {
    width: 160px;
  }

  .schedulesList .schedulesList-memo .schedules-remarks {
    padding: 0 20px 0 0;
    width: calc(100% - 140px);
  }

  .schedules-time {
    padding: 0 0 10px 0;
    margin-bottom: 10px;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-right: none;
    border-bottom: 1px solid #e0e0e0;
  }

  .schedules-deli {
    width: calc((100% - 140px) / 4);
  }

  .schedules-order {
    width: calc((100% - 140px) / 4);
  }

  .schedules-message {
    width: calc((100% - 140px) / 4);
  }

  .schedules-remarks {
    width: calc((100% - 140px) / 4);
  }

  .schedules-timeBox {
    width: 240px;
  }

  .schedulesIconBox i:last-child {
    margin-right: 0;
  }

  .schedulesReceptionist {
    margin: 0 0 0 20px;
  }

  .schedulesStatus {
    margin: 0 0 0 auto;
    width: 170px;
    height: 32px;
  }

  .csName-seikyu {
    width: 100%;
  }

  .baseCardsContentsInner-minus {
    overflow-x: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
  }

  .customersListTable .sortCsLogo,
  .customersListTable .sortSendMailCheck {
    width: 50px;
  }

  .customersListTable .sortCsNum {
    width: 80px;
  }

  .customersListTable .sortCsRegiDate,
  .customersListTable .sortLastLogin {
    width: 90px;
  }

  .customersListTable .sortYamato {
    width: 90px;
  }

  .customersListTable .sortEcHistory,
  .customersListTable .sortOrderInfo {
    width: 210px;
  }

  .customersListTable .sortCsAddress {
    width: 280px;
  }

  .ecBasketAdmin {
    margin: 0 20px 60px;
    width: auto;
  }

  .ecBasketAdminOrder {
    width: calc(100% - 320px);
  }

  .ecBasketAdminPriceDeli {
    width: 300px;
  }

  .ecBasketAdminCardsContainer {
    padding: 10px;
  }

  .ecDealerOrderHistoryList li a {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }

  .ecDealerOrderHistory-date {
    padding: 0;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }

  .ecDealerOrderHistory-buyer {
    margin: 10px 0 0;
    padding: 10px 0 0;
    width: 100%;
    border: none;
    border-top: 1px dotted #e0e0e0;
  }

  .ecDealerOrderHistory-commodity {
    margin: 10px 0;
    padding: 10px 0;
    width: 100%;
    border: none;
    border-top: 1px dotted #e0e0e0;
    border-bottom: 1px solid #e0e0e0;
  }

  .ecDealerOrderHistory-price {
    padding: 0;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }

  .searchKey-ecdealer {
    width: calc(100% - 210px);
    position: static;
  }
}

@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .orders2ColTable tr th {
    width: 30%;
  }

  .baseCardsBox-100 .orders2ColTable th {
    width: 30%;
  }

  .ordersPhotoList li {
    width: calc(50% - 20px);
  }

  .customers2ColTable th {
    width: 30%;
  }

  .commodity2ColTable th {
    width: 30%;
  }

  .eRecord2ColTable th {
    width: 30%;
  }

  .staffs2ColTable th {
    width: 30%;
  }

  .contentsHeaderBox-ec {
    margin-top: 6px;
    width: 100%;
  }

  .contentsHeaderBox-ecHistory {
    margin-left: 0;
  }

  .ecSearch {
    width: 200px;
  }

  .btnKeywordSearch {
    width: 80px;
  }

  .ecBasket {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }

  .ecBasketOrder {
    width: 100%;
  }

  .ecBasketPriceDeli {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }

  .ecBasketCards {
    width: calc(50% - 10px);
  }

  .seikyuList-numName {
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .seikyuList-orderAmount {
    padding: 0 15px 0 0;
    width: 25%;
  }

  .seikyuList-CarryoverAmount {
    width: 25%;
  }

  .seikyuList-billingAmount {
    width: 25%;
  }

  .seikyuList-billingDate {
    width: 25%;
  }

  .nyukinSeikyuList-numName {
    padding: 0;
    margin-bottom: 10px;
    width: 100%;
    border-right: 0;
  }

  .nyukinSeikyuList-orderAmount {
    padding: 0 15px 0 0;
    width: 14.2857142857%;
  }

  .nyukinSeikyuList-CarryoverAmount {
    width: 14.2857142857%;
  }

  .nyukinSeikyuList-billingAmount {
    width: 14.2857142857%;
  }

  .nyukinSeikyuList-paymentAmount {
    width: 14.2857142857%;
  }

  .nyukinSeikyuList-adjustmentAmount {
    width: 14.2857142857%;
  }

  .nyukinSeikyuList-paymentDay {
    width: 14.2857142857%;
  }

  .nyukinSeikyuList-billingDate {
    width: 14.2857142857%;
  }

  .nyukinOtherList-numName {
    padding: 0;
    margin-bottom: 10px;
    width: 100%;
    border-right: 0;
  }

  .nyukinOtherList-deliDate {
    padding: 0 15px 0 0;
    width: 20%;
  }

  .nyukinOtherList-orderAmount {
    width: 20%;
  }

  .nyukinOtherList-paymentAmount {
    width: 20%;
  }

  .nyukinOtherList-adjustmentAmount {
    width: 20%;
  }

  .nyukinOtherList-paymentDay {
    width: 20%;
  }

  .ecOrderHistoryAdminList-numName {
    padding: 0;
    margin-bottom: 15px;
    width: 100%;
    border-right: 0;
  }

  .ecOrderHistoryAdminList-price {
    padding: 0 10px;
    width: 16.666%;
  }

  .ecOrderHistoryAdminList-price:nth-child(2) {
    padding: 0 10px 0 0;
  }

  .ecOrderHistoryAdminList-price:last-child {
    padding: 0 0 0 10px;
    width: calc(16.666% - 10px);
  }

  .ecBasketAdmin {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }

  .ecBasketAdminOrder {
    width: 100%;
  }

  .ecBasketAdminPriceDeli {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }

  .ecBasketAdminCards {
    width: calc(50% - 10px);
  }

  .dataRowBox-100 {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }

  .dataRowBox-100 .dataRowBox-item {
    margin: 0 0 5px;
    width: 100%;
  }

  .dataRowBox-100 .dataRowBox-item:last-child {
    margin: 0;
  }

  .ecPhotoList {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }

  .ecPhotoItem {
    margin-bottom: 10px;
    width: calc(50% - 6px);
  }
}
/*# sourceMappingURL=contents.css.map */
