@charset "utf-8";
/* CSS Document */

/*================================================
 *  CSSリセット
 ================================================*/
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,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;vertical-align:baseline;background:transparent;font-weight:500;}body{line-height:1}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}table{border-collapse:collapse;border-spacing:0}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}input,select{vertical-align:middle}

*, *:before, *:after {
box-sizing: border-box;
 }

/*================================================
 *  一般・共通設定
 ================================================*/
html {
    height: 100%;
    margin: 0;

}

body {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	font-family: 'メイリオ', 'Meiryo', '游ゴシック体', 'Yu Gothic', '游ゴシック', 'YuGothic', 'ヒラギノ角ゴ Pro', 'Hiragino Kaku Gothic Pro',  sans-serif;
	font-size: 12pt;
	font-weight: 500;
	line-height: 1.5;
	color: #666666;

}
input[readonly]   {
  cursor: not-allowed;
  background-color: #E6E6E6;
  opacity: 1;
}
body.no__scroll {
    overflow: hidden;
}

br {
	line-height: 15px;
}

a {
    color: #195CE3;
	text-decoration: none;
	cursor: pointer;
}

a:hover {
	color: #195CE3;
	opacity: 0.7;
}

.f__bold {
	font-weight: bold;
}

.c__black {
	color: #3d3d3d;
}

.c__gray {
	color: #758B94;
}

.c__red {
	color: #CF0505;
}

/*================================================
 *  form
 ================================================*/
input[type="button"],input[type="text"],input[type="submit"],input[type="images"],input[type="search"],textarea {
	-webkit-appearance: none;
	border-radius: 0;
    font-size:14px;
}

input::placeholder {
	font-size: 12px;
	line-height: 1;
	color: #cccccc;
}

textarea::-webkit-input-placeholder {
	font-size: 12px;
	line-height: 1;
	color: #cccccc;
}

textarea::-moz-placeholder {
	font-size: 12px;
	line-height: 1;
	color: #cccccc;
}
input[type=checkbox]{
    width:18px;
    height:18px;
  -webkit-transform: scale( 1.2 , 1.2 );
}
textarea::placeholder {
	font-size: 12px;
	line-height: 1;
	color: #cccccc;
}

input[type="text"] {
	width: 100%;
    font-size:14px;
	height: 25px;
	padding: 0px 5px;
	border: 1px solid #D8D8D8;
}

textarea {
	width: 100%;
	height: 63px;
	padding: 10px 10px;
	border: 1px solid #D8D8D8;
}

select {
	width: 100%;
	height: 25px;
	padding: 0px 10px;
	border: 1px solid #D8D8D8;
    font-size:14px;
}

/*================================================
 *  login
 ================================================*/
.login__wrapper {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	width: 350px;
}

.login__title {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	width: 100%;
	font-size: 24px;
	color: #666666;
}

.login__id {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	width: 100%;
	padding: 30px 0px 0px 0px;
	font-size: 24px;
	line-height: 1;
	color: #999999;
}

.login__id::before {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 25px;
	margin: 0px 5px 0px 0px;
	content: url("../images/icon_id.png");
}

.login__ps {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	width: 100%;
	padding: 30px 0px 0px 0px;
	font-size: 24px;
	line-height: 1;
	color: #999999;
}

.login__ps::before {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 25px;
	margin: 0px 5px 0px 0px;
	content: url("../images/icon_ps.png");
}

.login__box {
	width: 100%;
}

.login__wrapper > .btn-list-area {
	padding: 30px 30px!important;
}

/*================================================
 * menu
 ================================================*/
.menu__wrapper {
  display: none;
}

/*================================================
 *  btn
 ================================================*/
.btn-list-area {
	display: flex;
    flex-wrap: wrap;
    justify-content: center;
    width: 100%;
    padding: 15px 15px;
}

.btn-list {
	display: flex;
    flex-wrap: wrap;
}

.btn-list > li {
	padding: 0px 0px 0px 45px;
}

.btn-list > li:first-child {
	padding: 0px 0px 0px 0px;
}

.btn__basic {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	width: 120px;
	height: 25px;
	border-radius: 3px;
	border: none;
	background-color: #FF7070;
	font-size: 14px;
	color: #ffffff;
	cursor: pointer;
}

.btn__decision {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	width: 115px;
	height: 25px;
	border-radius: 3px;
	border: none;
	background-color: #FF8000;
	font-size: 14px;
	color: #ffffff;
	cursor: pointer;
}
.btn__processed:read-only {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	width: 90px;
	height: 25px;
	border-radius: 3px;
	border: none;
	background-color: #58B957; 
	font-size: 14px;
	color: #ffffff;
	cursor: pointer;
}
.btn__processed {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	width: 90px;
	height: 25px;
	border-radius: 3px;
	border: none;
	background-color: #58B957; 
	font-size: 14px;
	color: #ffffff;
	cursor: pointer;
}

.btn__processed_other {
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	width: 90px;
	height: 25px;
	border-radius: 3px;
	border: none;
	background-color: #58B957; 
	font-size: 14px;
	color: #ffffff;
	cursor: pointer;
}
.btn__cancel {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	width: 120px;
	height: 25px;
	border-radius: 3px;
	border: none;
	background-color: #808080;
	font-size: 14px;
	color: #ffffff;
	cursor: pointer;
}

.btn__delete {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	width: 90px;
	height: 25px;
	border-radius: 3px;
	border: none;
	background-color: #FF7070;
	font-size: 14px;
	color: #ffffff;
	cursor: pointer;
}

.btn__other {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	width: 60px;
	height: 28px;
	border-radius: 3px!important;
	border: solid 1px #FF7070;
	background-color: #ffffff;
	font-size: 12px;
	line-height: 1;
	color: #FF7070;
	cursor: pointer;
}

.btn__basic:hover,
.btn__decision:hover,
.btn__cancel:hover,
.btn__delete:hover,
.btn__other:hover {
	opacity: 0.7;
}

.btn__icon-change::before {
	margin: 0px 5px 0px 0px;
	content: "\f0e2";
	font-family: FontAwesome;
	color: #ffffff;
}

.btn__icon-pencil::before {
	margin: 0px 5px 0px 0px;
	content: "\f040";
	font-family: FontAwesome;
	color: #ffffff;
}

.btn__icon-save::before {
	margin: 0px 5px 0px 0px;
	content: "\f0c7";
	font-family: FontAwesome;
	color: #ffffff;
}
/*================================================
 *  wrapper
 ================================================*/
.wrapper {
	display: flex;
	flex-direction: column;
	width: 100%;
	min-height: 100vh;
}

.main {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	min-height: calc(100vh - 105px);
	padding: 60px 45px 0px 0px;
	background-image: url("../images/nav_bg.png");
	background-repeat: repeat-y;
}

.login {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	background-image: none;
    margin-top:200px;
}

.nav__wrapper {
	width: 210px;
}

.nav__list {
	position: fixed;
	width: 210px;
	padding: 10px 0px 0px 0px;
}

.nav__list > li {
	width: 200px;
	height: 60px;
	border-top: solid 1px #D3D3D3;
	font-size: 18px;
	line-height: 1;
}

.nav__list > li:last-child {
	border-bottom: solid 1px #D3D3D3;
}

.nav__list > li > a {
	width: 100%;
	height: 100%;
}


.nav__list > li.nav__top,
.nav__list > li.nav__items,
.nav__list > li.nav__order,
.nav__list > li.nav__master {
	position: relative;
}

.nav__list-box {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	width: 200px;
	height: 60px;
	padding: 0px 0px 0px 30px;
	font-size: 16px;
	line-height: 1;
	color: #666666;

}

.nav__list-box.nav__top:hover,
.nav__list-box.nav__items:hover,
.nav__list-box.nav__order:hover,
.nav__list-box.nav__master:hover,
.nav__list-box.nav__top.active,
.nav__list-box.nav__items.active,
.nav__list-box.nav__order.active,
.nav__list-box.nav__master.active {
	position: absolute;
	top: 0;
	left: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	width: 210px;
	height: 58px;
	padding: 0px 0px 0px 0px;
	box-shadow:2px 2px 1px 0px rgba(0,0,0,0.1);
	background-color: #ffffff;
	font-size: 20px;
	line-height: 1;
}
.UpdatePanel2 {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	min-height: calc(100vh - 105px);
	padding: 60px 45px 0px 0px;
	background-image: url("../images/nav_bg.png");
	background-repeat: repeat-y;
}
.contents__wrapper {
	display: flex;
	flex-wrap: wrap;
	width: calc(100% - 210px);
	padding: 30px 0px 0px 20px;
}

.contents__wrapper_full {
	flex-wrap: wrap;
	width: calc(100% - 210px);
	padding: 30px 0px 0px 20px;
}

.contents__inner {
	width: 100%;
}
 
/*================================================
 * contents
 ================================================*/

.contents__head {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	width: 100%;
}

.contents__headline {
  padding: 0.4em 0.5em;/*文字の上下 左右の余白*/
  color: #494949;/*文字色*/
  background: #f4f4f4;/*背景色*/
  border-left: solid 5px #555;/*左線*/
  border-bottom: solid 3px #d7d7d7;/*下線*/
  width: 300px;
}

.contents__headline > span {
	font-size: 15px;
	line-height: 1;
}

.contents__btn-area {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;	
}
.contents_details__btn-area {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;	
    position: relative;
    left: -50%;
}

.contents__btn-list {
	display: flex;
	flex-wrap: wrap;
}

.contents__btn-list > li {
	padding: 0px 0px 0px 5px;
}

.contents__btn-list > li:first-child {
	padding: 0px 0px 0px 0px;
}

.contents__btn-list > li > a {
	color: #ffffff;
}

.category__box {
	width: 100%;
	padding: 30px 0px 0px 0px;
}

.category__head {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	min-height: 25px;
	padding: 15px 0px 0px 0px;
}

.category__head:first-child {
	padding: 0px 0px 0px 0px;
}

.split__wrapper .category__head {
	padding: 15px 0px 0px 0px;
}

.category__head-sortarea {
	display: flex;
	flex-wrap: wrap;
	width: calc(100% - 140px);
	min-height: 25px;
}

.category__headline {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	min-height: 25px;
	padding: 0px 45px 0px 0px;
	font-size: 16px;
	line-height: 1;
	font-weight: bold;
}

.category__info {
	width: 100%;
	padding: 10px 0px 0px 0px;
}

.category__head-sortarea > .category__info {
	width: 100%;
	padding: 10px 45px 0px 0px;
}

.category__sort-area {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;	
	width: 140px;
}

.category__sort-info {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	padding: 0px 15px 0px 0px;
	font-size: 12px;
	line-height: 1;
}

.category__sort-box {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	width: 30px;
	height: 25px;
	margin: 0px 15px 0px 0px;
	cursor: pointer;
}

.category__sort-box:last-child {
	margin: 0px 0px 0px 0px;
}

.category__sort-box:hover {
	opacity: 0.7;
}

.category__btn-area {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;	
}

.category__btn-list {
	display: flex;
	flex-wrap: wrap;
}
.category__btn-list > li {
	padding: 0px 0px 0px 45px;
}

.category__btn-list > li:first-child {
	padding: 0px 0px 0px 0px;
}

.category__body {
	width: 100%;
	padding: 15px 0px 0px 0px;
}

.split__wrapper {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
}

.split__box {
	width: 100%;
	padding: 30px 0px 0px 0px;
}

.split__box:first-child {
	padding: 0px 0px 0px 0px;
}

.split__box-half {
	width: calc((100% - 45px) / 2);
	margin: 0px 45px 0px 0px;
}

.split__box-half:nth-child(2n) {
	margin: 0px 0px 0px 0px;
}

.headline {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	width: 100%;
	height: 55px;
	padding: 0px 0px 0px 15px;
	font-size: 16px;
	color: #ffffff;
	background-color: #808080;
}

/*================================================
 *  overlay&popup
 ================================================*/
.overlay__wrapper {
	position: fixed;
	z-index: 9999;
	top: 0;
	left: 0;
	display: none;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.4);
}

.popup__window {
	display: none;
	width: 1000px;
	height: 380px;
    padding: 15px 15px;
	border-radius: 5px;
	border: solid 1px #D8D8D8;
    background-color: #F5F5F5;
}
.popup__window.active {
	display: block;
}

.overlay__wrapper.active,
.popup__confirmation-decision.active,
.popup__confirmation-delete.active {
	display: flex;
}

.popup__headline {
	width: 100%;
	margin: 0px 0px 5px 0px;
    border-bottom: solid 1px #D8D8D8;
}

.popup__box {
	width: 100%;
	height: calc(100% - 23px - 60px);
	padding: 15px 0px 0px 0px;
	overflow-y: scroll;
}

.popup__confirmation-decision {
	display: none;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	width: 500px;
    padding: 15px 15px;
	border-radius: 5px;
	border: solid 1px #D8D8D8;
    background-color: #F5F5F5;
}

.popup__confirmation-delete {
	display: none;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	width: 500px;
    padding: 15px 15px;
	border-radius: 5px;
	border: solid 1px #D8D8D8;
    background-color: #F5F5F5;
}

.popup__confirmation-info {
	width: 100%;
	padding: 15px 0px 0px 0px;
	text-align: center;
}

/*================================================
 *  graph
 ================================================*/
.graph__box {
	width: 100%;
	padding: 15px 15px;
	border: solid 1px #D8D8D8;
}

.graph__box:nth-child(n+2) {
	margin: 15px 0px 0px 0px;
}

/*================================================
 *  printing
 ================================================*/
.printing__wrapper {
	width: 100%;
	padding: 15px 15px;
	border: solid 1px #D8D8D8;
}

.printing__headline {
	width: 100%;
	font-size: 16px;
	font-weight: bold;
}

.printing__info {
	width: 100%;
	padding: 15px 0px 0px 0px;
}

.printing__voucher {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	width: 100%;
	padding: 15px 0px 0px 0px;
}

.printing__pager {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	width: 100%;
	padding: 15px 0px 0px 0px;
}

.printing__pager-prev {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
}

.printing__pager-number {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	height: 25px;
	padding: 0px 15px;
	line-height: 1;
}

.printing__pager-next {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
}

.printing__pager-prev:hover,
.printing__pager-next:hover {
	opacity: 0.7;
}

/*================================================
 * order
 ================================================*/

/* order detail内用 */
.order__btn--area {
	display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    width: 100%;
}

/* テーブル内の幅指定用 */
.order__buyer {
	max-width: 120px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.order__remarks {
	max-width: 300px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/*================================================
 * master
 ================================================*/
.master__area {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
}

.master__box {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
}

.master__list {
	width: 100%;
	height: calc(100vh - 385px);
	border: solid 1px #D8D8D8;
	overflow-y: scroll;
}

.master__list > li,
.master__list2 > li {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	height: 30px;
	padding: 0px 15px;
	border-top: solid 1px #D8D8D8;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.master__list > li:first-child,
.master__list2 > li:first-child {
	border-top: none;
}

.master__list > li:hover,
.master__list2 > li:hover {
	background-color:antiquewhite; 
}

.master__list2 {
	width: 100%;
	height: calc(100vh - 507px);
	border: solid 1px #D8D8D8;
	overflow-y: scroll;
}

.master__list2 > li > input[type="checkbox"] {
	margin: 0px 10px 0px 0px;
}

.master__list-name {
	width: calc(100% - 60px);
	padding: 0px 15px 0px 0px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.master__list-btn {

}

.master__add-area {
	width: 100%;
	height: calc(100vh - 507px);
	padding: 15px 15px;
	border: solid 1px #D8D8D8;
	overflow-y: scroll;
}

.master__add-list {
	width: 100%;
}

.master__add-list > li {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	width: 100%;
	padding: 15px 0px 0px 0px;
}

.master__add-number {
	width: 60px;
	padding: 0px 15px 0px 0px;
	font-size: 12px;
}

.master__add-box {
	width: calc(100% - 60px);
	padding: 0px 15px 0px 0px;
}

/*================================================
 * items
 ================================================*/
.items__wrapper {
	width: 100%;
	margin: 30px 0px 0px 0px;
	border: solid 1px #D8D8D8;
	background-color: #F5F5F5;
}

.items__wrapper:first-child {
	margin: 0px 0px 0px 0px;
}

.items__search-area {
	display: flex;
	flex-wrap: wrap;
	padding: 15px 15px;
	width: 100%;
}

.items__search-box {
	width: 33.3%;
	padding: 0px 45px 0px 0px;
}

.items__search-box:nth-child(3n) {
	padding: 0px 0px 0px 0px;
}

.search__btn-area {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	width: 100%;
	padding: 15px 15px;
	border-top: solid 1px #D8D8D8;
	background-color: #ffffff;
}

.detai__btn-area {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end ;
	width: 100%;
	padding: 15px 15px;
	border-top: solid 1px #D8D8D8;
	background-color: #ffffff;
}

.search__btn-list {
	display: flex;
	flex-wrap: wrap;
}

.search__btn-list > li {
	padding: 0px 0px 0px 5px;
}

.search__btn-list > li:first-child {
	padding: 0px 0px 0px 0px;
}

.items__category {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
}

.items__category-brand {
	width: 50%;
	padding: 0px 15px 0px 0px;
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.items__category-line {
	width: 30%;
	padding: 0px 15px 0px 0px;
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.items__category-shape {
	width: 20%;
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.items__category-brand2 {
	width: 50%;
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.items__category-line2 {
	width: 50%;
	padding: 0px 0px 0px 15px;
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.items__category-shape2 {
	width: 100%;
	margin: 15px 0px 0px 0px;
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.items__name {
	width: 100%;
	padding: 10px 0px 0px 0px;
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.items__name2 {
	width: 100%;
	min-width: 190px;
}

.items__photo-normal {
    margin: 15px 0px 0px 0px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	width: 100%;
}

.items__photo-normal img {
	width: 100%;
	height: 100%;
}

.items__photo-small {
	/*display: flex;*/
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	/*width: 100%;*/
	padding: 1px !important;
}

.items__photo-small img {
	width: 75px;
	height: 75px;
}

.items__number {
	width: 100%;
}

.items__soldout {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	width: 60px;
	height: 25px;
	margin: 5px 0px 0px 0px;
	border-radius: 5px;
	background-color: #58B957;
	font-size: 10px;
	line-height: 1;
	color: #ffffff;
}

/*================================================
 *  status
 ================================================*/
.status__wrapper {
	width: 100%;
	margin: 30px 0px 0px 0px;
	border: solid 1px #D8D8D8;
	background-color: #F5F5F5;
}

.status__wrapper:first-child {
	margin: 0px 0px 0px 0px;
}

.status__area {
	display: flex;
	flex-wrap: wrap;
	padding: 15px 15px;
	width: 100%;
}

.status__area__care {
	display: flex;
	flex-wrap: wrap;
	padding: 0px 0px;
	width: 100%;
}

.status__headline {
	width: 100%;
	padding: 0px 0px 5px 0px;
	border-bottom: solid 1px #D8D8D8;
}

.status__box-area {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
}

.status__box {
	width: 100%;
}

.status__box-half {
	width: 50%;
    padding: 0px 45px 0px 0px;
}

.status__box-half:nth-child(2n) {
	width: 50%;
    padding: 0px 0px 0px 0px;
}

.status__box-split {
	width: 33.3%;
    padding: 0px 45px 0px 0px;
}

.status__headline + .status__box-area > .status__box,
.status__headline + .status__box-area > .status__box-half,
.status__headline + .status__box-area > .status__box-split {
	padding-top: 15px;
}

.status__box .status__box,
.status__box .status__box-half,
.status__box .status__box-split,
.status__box-half .status__box,
.status__box-half .status__box-half,
.status__box-half .status__box-split,
.status__box-split .status__box,
.status__box-split .status__box-hal,
.status__box-split .status__box-split {
	padding-top: 0px;
}

.total__list {
	width: 100%;
	padding: 15px 15px;
	border: solid 1px #D8D8D8;
	background-color: #ffffff;
}

.total__list > li {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	padding: 5px 0px;
}

.total__list-name {
	display: flex;
	flex-wrap: wrap;
	width: 50%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.total__list-money {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	width: 50%;
}

.total__list-totalname {
	display: flex;
	flex-wrap: wrap;
	width: 50%;
	padding: 10px 0px 0px 0px;
    font-weight: bold;
	border-top: solid 1px #D8D8D8;
}

.total__list-total {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	width: 50%;
	padding: 10px 0px 0px 0px;
    font-weight: bold;
	border-top: solid 1px #D8D8D8;
}

.checkbox__list {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
}

.checkbox__list > li {
	width: 20%;
	padding: 10px 15px 0px 0px;
}

.checkbox__list > li > input[type="checkbox"] {
	margin: 0px 10px 0px 0px;
}

/*================================================
 *  selectlabel
 ================================================*/
.selectlabel__wrapper {
	display: flex;
	/*flex-wrap: wrap;*/
	align-items: center;
	width: 100%;
}

.selectlabel__check {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 25px;
}

.selectlabel__label {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	width: 70px;
	height: 25px;
	font-size: 14px;
	line-height: 1;
	color: #ffffff;
}

.selectlabel__list {
	width: 100%;
}

.selectlabel__list > li {
	width: 100%;
	padding: 10px 0px 0px 0px;
}

.selectlabel__list > li:first-child {
	padding: 0px 0px 0px 0px;
}

.label__green {
	background-color: #58B957;
}

.label__blue {
	background-color: #6666FF;
}

.label__pink {
	background-color: #FF6666;
}

.label__lightblue {
	background-color: #7EA6E0;
}

.label__gray {
	background-color: #999999;
}

/*================================================
 *  table__simple > box
 ================================================*/
.box__wrapper {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	width: 100%;
}

.box__half {
	width: 50%;
	padding: 0px 30px 0px 0px;
}

.box__half:nth-child(2n) {
	padding: 0px 0px 0px 0px;
}

.box__form-headline {
	width: 60px;
	padding: 0px 15px 0px 0px;
	text-align: right;
}

.box__form-box {
	width: calc(100% - 60px);
}

.box__split {
	width: calc((100% - 30px) / 2);
}

.box__split-center {
	width: 30px;
	text-align: center;
}

.calendar__wrapper {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
}

.calendar__form-box {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	width: 100%;
}

.calendar__form-input {
	width: calc(100% - 30px)!important;
}
.ui-datepicker-trigger {
	position: absolute;
	top: 0;
	right: 0;
	width: 30px;
    height: 25px;
    display: flex;
}
.calendar__icon {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 25px;
	background-color: #E6E6E6;
	cursor: pointer;
}

.calendar__icon::before {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	content: "\f274";
	font-family: FontAwesome;
	font-size: 18px;
}

/*================================================
 *  table
 ================================================*/

/* 基本:テキスト左揃え */
.table__basic {
	width:100%;
	border-collapse: separate;
	border-spacing: 0;
	border: none;
	font-size: 12px;
}

.table__basic tr {
	width: 100%;
}

.table__basic th,
.table__basic td {
	border-top: solid 1px #D8D8D8;
	border-left: solid 1px #D8D8D8;
	text-align: left;
	vertical-align: top;
}

.table__basic th {
	padding: 10px 10px;
	background-color: #808080;
	text-align: center;
	color: #ffffff;
	vertical-align: middle;
}

.table__basic td {
	padding: 10px 10px;
	vertical-align: middle;
}

.table__basic th:last-child,
.table__basic td:last-child {
	border-right: solid 1px #D8D8D8;
}

.table__basic tr:last-child td {
	border-bottom: solid 1px #D8D8D8;
}

.table__basic tr:nth-child(2n+1) {
	background-color: #F5F5F5;
}

.table__basic tr:hover {
	background-color:antiquewhite; 
}

/* 基本:テキスト右揃え */
.table__basic-right {
	width:100%;
	border-collapse: separate;
	border-spacing: 0;
	border: none;
	font-size: 12px;
}

.table__basic-right tr {
	width: 100%;
}

.table__basic-right th,
.table__basic-right td {
	border-top: solid 1px #D8D8D8;
	border-left: solid 1px #D8D8D8;
	text-align: right;
	vertical-align: top;
}

.table__basic-right th {
	padding: 10px 10px;
	background-color: #808080;
	text-align: center;
	color: #ffffff;
	vertical-align: middle;
}

.table__basic-right td {
	padding: 10px 10px;
	vertical-align: middle;
}

.table__basic-right th:last-child,
.table__basic-right td:last-child {
	border-right: solid 1px #D8D8D8;
}

.table__basic-right tr:last-child td {
	border-bottom: solid 1px #D8D8D8;
}

.table__basic-right tr:nth-child(2n+1) {
	background-color: #F5F5F5;
}

.table__basic-right tr:hover {
	background-color:antiquewhite; 
}

/* 基本:テキスト中央揃え */
.table__basic-center {
	width:100%;
	border-collapse: separate;
	border-spacing: 0;
	border: none;
	font-size: 12px;
    line-height:1;
}

.table__basic-center tr {
	width: 100%;
}

.table__basic-center th,
.table__basic-center td {
	border-top: solid 1px #D8D8D8;
	border-left: solid 1px #D8D8D8;
	text-align: center;
	vertical-align: top;
}

.table__basic-center th {
	padding: 5px 5px;
	background-color: #808080;
	text-align: center;
	color: #ffffff;
	vertical-align: middle;
}

.table__basic-center td {
	padding: 10px 10px;
	vertical-align: middle;
}

.table__basic-center th:last-child,
.table__basic-center td:last-child {
	border-right: solid 1px #D8D8D8;
}

.table__basic-center tr:last-child td {
	border-bottom: solid 1px #D8D8D8;
}

.table__basic-center tr:nth-child(2n+1) {
	background-color: #F5F5F5;
}

.table__basic-center tr:hover {
	background-color:antiquewhite; 
}
.table__basic-center th a { background:url(../../images/arrow-updown.png) right center no-repeat;
                            background-repeat: no-repeat;
			background-position: right;
			padding-right:18px;}
        
		 tr.no__sort th a {
            background:none;
		}

		 tr.sortasc th a {
			background:url(../../images/arrow-down.png);
            background-repeat: no-repeat;
			background-position: right;
			padding-right:18px;
            
		}

		tr.sortdesc th a {
			background:url(../../images/arrow-up.png);
            background-repeat: no-repeat;
			background-position: right;
			padding-right:18px;
		}
/* 検索系テーブル */
.table__search-center {
	width:100%;
	border-collapse: separate;
	border-spacing: 0;
	border: none;
	font-size: 12px;
    line-height:1;
}

.table__search-center tr {
	width: 100%;
}

.table__search-center th,
.table__search-center td {
	border-top: solid 1px #D8D8D8;
	border-left: solid 1px #D8D8D8;
	text-align: center;
	vertical-align: top;
}

.table__search-center th {
	padding: 10px 10px;
	background-color: #808080;
	text-align: center;
	color: #ffffff;
	vertical-align: middle;
}

.table__search-center td {
	padding: 5px 3px;
	vertical-align: middle;
}

.table__search-center th:last-child,
.table__search-center td:last-child {
	border-right: solid 1px #D8D8D8;
}

.table__search-center tr:last-child td {
	border-bottom: solid 1px #D8D8D8;
}

.table__search-center tr:nth-child(2n+1) {
	background-color: #F5F5F5;
}

.table__search-center tr:hover {
	background-color:antiquewhite; 
}

/* 消し込み */
.table__none {
	width:100%;
	border-collapse: separate;
	border-spacing: 0;
	border: none;
	font-size: 12px;
    line-height:1;
}

.table__none tr {
	width: 100%;
}

.table__none th,
.table__none td {
	border-top: none;
	border-left: none;
	text-align: left;
	vertical-align: top;
}

.table__none th {
	padding: 10px 10px;
	background-color: none;
	text-align: left;
	color: #ffffff;
	vertical-align: middle;
}

.table__none td {
	padding: 10px 10px;
	vertical-align: middle;
}

.table__none th:last-child,
.table__none td:last-child {
	border-right: none;
}

.table__none tr:last-child td {
	border-bottom: none;
}

.table__none tr:nth-child(2n+1) {
	background-color: transparent;
}

.table__none tr:hover {
	background-color:transparent; 
}
/* シンプル:左th */
.table__simple {
	width:100%;
	border-collapse: separate;
	border-spacing: 0;
	border: none;
	font-size: 14px;
}

.table__simple tr {
	width: 100%;
}

.table__simple th,
.table__simple td {
	text-align: left;
	vertical-align: top;
}

.table__simple th {
	width: 120px;
	padding: 5px 10px 5px 0px;
	color: #999999;
	vertical-align: middle;
}

.table__simple td {
	width: calc(100% - 120px);
	padding: 5px 10px 5px 0px;
}

/* シンプル:左th width 60 */
.table__simple2 {
	width:100%;
	border-collapse: separate;
	border-spacing: 0;
	border: none;
	font-size: 14px;
}

.table__simple2 tr {
	width: 100%;
}

.table__simple2 th,
.table__simple2 td {
	text-align: left;
	vertical-align: top;
}

.table__simple2 th {
	width: 80px;
	padding: 5px 10px 5px 0px;
	color: #999999;
	vertical-align: middle;
}

.table__simple2 td {
	width: calc(100% - 60px);
	padding: 5px 10px 5px 0px;
}

/* シンプル:上th */
.table__simple3 {
	width:100%;
	border-collapse: separate;
	border-spacing: 0;
	border: none;
	font-size: 12px;
}

.table__simple3 tr {
	width: 100%;
}

.table__simple3 th,
.table__simple3 td {
	text-align: left;
	vertical-align: top;
}

.table__simple3 th {
	padding: 5px 45px 5px 0px;
	color: #999999;
	vertical-align: middle;
}

.table__simple3 td {
	padding: 5px 45px 5px 0px;
}

.table__simple3 tr > th:last-child,
.table__simple3 tr > td:last-child {
	/*padding: 5px 0px 5px 0px;*/
}

/* option */
.nowrap {
	white-space: nowrap;
}

.vertical__top {
	vertical-align: top!important;
}

.align__left {
	text-align: left!important;
}

.align__center {
	text-align: center!important;
}

.align__right {
	text-align: right!important;
}

.bg__headline,
.bg__headline > td {
	background-color: #808080;
	text-align: center!important ;
	color: #ffffff;
}

.bg__total,
.bg__total > td {
	background-color: #E6E6E6;
	font-weight: bold;
}

.action__btn-list {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	width: 100%;
}

.action__btn-list li {
	padding: 0px 0px 0px 0px;
}

.action__btn-list li:nth-child( +2) {
	padding: 0px 0px 0px 15px;
}

.action__detail {
	padding: 0px 15px;
}

.action__edit {
	padding: 0px 15px;
}

.action__delete {
	padding: 0px 15px;
}

.action__detail a,
.action__edit a,
.action__delete a {
	color: #FF7070;
}

/*================================================
 *  header
 ================================================*/
header {
	position: fixed;
	z-index: 1000;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	width: 100%;
	height: 60px;
	padding: 0px 45px 0px 15px;
	background-color: #222222;
}

.header__logo {
	width: 102px;
	height: 43px;
	background-image: url("../images/logo.png");
	background-repeat: no-repeat;
}

.header__nav {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	width: calc(100% - 102px);
	padding: 0px 0px 0px 45px;
}

.header__nav-list {
	display: flex;
	flex-wrap: wrap;
}

.header__nav-list > li {
	padding: 0px 45px 0px 0px;
	line-height: 1;
	color: #999999;
}

.header__nav-list > li:last-child {
	padding: 0px 0px 0px 0px;
}

.header__nav-list > li > a {
	color: #999999;
}

/*================================================
 *  footer
 ================================================*/
footer {
	width: 100%;
    margin-top: auto;
	padding: 45px 0px 0px 0px;
	background-image: url("../images/nav_bg.png");
	background-repeat: repeat-y;
}

.footer__version {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-end;
	width: 100%;
	height: 20px;
	padding: 0px 45px 0px 15px;
	background-color: #222222;
	font-size: 12px;
	color: #999999;
}
.login__text{
    width: 100%;
	height: 40px !important;
    font-size:24px !important;
	padding: 0px 5px;
	border: 1px solid #D8D8D8;
}

.PagerStyle tr
{
    background-color: #808080;
    font-size:20px !important;
}
/* ページ番号毎の間隔　*/
.PagerStyle td
{
    background-color: #808080;
    border-color : #808080;
    border :none !important;
}

.PagerStyle span
{
text-decoration: none;
color: #f9fa59; /*background-color:Black;*/
}

/* 選択中のページ */

.PagerStyle a
{
    color:white;
    text-decoration: none;
}

/* マウスオーバーした文字(背景色が水色に反転) */
.PagerStyle a:hover
{
color: White;
background-color: #808080;
}
.total__warper {
	display: flex;
	justify-content: flex-end;
	padding: 0px 0px 0px 0px;
}

.total__box {
	padding: 15px 15px;
	font-size: 16px;
	font-weight: bold;
	border-radius: 5px;
	background-color: #F2F2F2;
}

.total__box2 {
	display: flex;
	flex-wrap: wrap;
}
.subtotal__box2 {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.subtotal__box2-subtotal {
	padding: 0px 10px 0px 0px;
}

.subtotal__box2-subtotal-price {
    border-bottom: dashed 2px #6594e0;
}

.subtotal__box2-tax {
	padding: 0px 10px 0px 40px;
}

.subtotal__box2-tax-price {
    border-bottom: double 5px #FFC778;
}

.subtotal__box2-cost {
	padding: 0px 30px 0px 0px;
}

.subtotal__box2-cost-price {

}

.subtotal__box-price {
	font-size: 16px;
	font-weight: bold;
	color: #A91111;
}
.total__box2 {
	display: flex;
	flex-wrap: wrap;
}
.subtotal__box {
	display: flex;
	flex-wrap: wrap;
	padding: 15px 15px;
	font-size: 16px;
	font-weight: bold;
	border-radius: 5px;
	background-color: #F2F2F2;
}

.subtotal__box-total {
	padding: 0px 30px 0px 0px;
	font-size: 16px;
	font-weight: bold;
}

.subtotal__box-price {
	font-size: 16px;
	font-weight: bold;
	color: #A91111;
}

.subtotal__box-area {

}

.subtotal__box3 {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
    border-bottom: 2px solid;
}

.subtotal__box3-subtotal {
	padding: 0px 30px 0px 0px;
}

.subtotal__box3-subtotal-price {

}

.subtotal__box3-tax {
	padding: 0px 30px 0px 0px;
}

.subtotal__box3-tax-price {
}

.subtotal__box3-cost {
	padding: 0px 30px 0px 0px;
}

.subtotal__box3-cost-price {

}

.total__warper {
	display: flex;
	justify-content: flex-end;
	padding: 0px 0px 0px 0px;
}

.total__box {
	padding: 15px 15px;
	font-size: 16px;
	font-weight: bold;
	border-radius: 5px;
	background-color: #F2F2F2;
    margin: -60px 10px 10px 0px;
}

.total__box2 {
	display: flex;
	flex-wrap: wrap;
}

.total__box3 {
    padding: 15px 15px;
    font-size: 16px;
    font-weight: bold;
    border-radius: 5px;
    background-color: #F2F2F2;
    margin: -20px 0px -30px 0px;
}

.pnel_top {
    margin-top:30px;
}

.radio_list1 {
    width:1400px;
}

.radio_list1 td {
    padding:initial;
    width:90px;
}

.radio_list1 label {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    width: 70px;
    height: 25px;
    font-size: 14px;
    line-height: 1;
    background-color: #b0f1af;
}

.radio_list2 {
    width:1400px;
}

.radio_list2 td {
    padding:initial;
    width:90px;
}

.radio_list2 label {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    width: 70px;
    height: 25px;
    font-size: 14px;
    line-height: 1;
    background-color: #7EA6E0;
}

.nav__list-box img {
margin-right: 10px;
}

/*アニメーションボタン*/
.btn-animation-02 {
  display: inline-block;
  width: 200px;
  text-align: center;
  background-color: #9ec34b;
  border: 2px solid #9ec34b;
  font-size: 16px;
  color: #9ec34b;
  text-decoration: none;
  font-weight: bold;
  padding: 10px 24px;
  border-radius: 4px;
  position: relative;
}

.btn-animation-02 span {
  position: relative;
  z-index: 1;
}

.btn-animation-02::before,
.btn-animation-02::after {
  content: "";
  display: block;
  background-color: #FFF;
  width: 50%;
  height: 100%;
  position: absolute;
  top: 0;
  transition: .2s;
}
.btn-animation-02::before {
  left: 0;
}
.btn-animation-02::after {
  right: 0;
}

.btn-animation-02:hover:before,
.btn-animation-02:hover:after {
  width: 0;
  background-color: #FFF;
}

.btn-animation-02:hover {
  color: #FFF;
}

/*アニメーションボタン*/
.btn-shine {
  color: #FFF;
  display: inline-block;
  font-size: 16px;
  font-weight: bold;
  line-height: 45px;
  width: 200px;
  position: relative;
  text-decoration: none;
  text-transform: uppercase;
  border: 1px solid transparent;
  outline: 1px solid;
  outline-color: rgba(255, 255, 255, 0.5);
  outline-offset: 0px;
  text-shadow: none;
  transition: all 1.2s cubic-bezier(0.2, 1, 0.2, 1);
}

.btn-shine:hover {
  border-color: #FFF;
  box-shadow: inset 0 0 20px rgba(255, 255, 255, 0.5), 0 0 20px rgba(255, 255, 255, 0.2);
  outline-color: transparent;
  outline-offset: 12px;
  text-shadow: 2px 2px 3px #000;
}

/*アニメーションボタン*/
.btn-push-yellow {
  display: inline-block;
  max-width: 180px;
  text-align: left;
  background-color: #ffa300;
  color: #FFF;
  text-decoration: none;
  padding: 10px 24px;
  border-radius: 4px;
  border-bottom: 4px solid #d37800;
}

.btn-push-yellow:active {
    transform: translateY(4px);
    border-bottom: none;
}

.btn-push-pink {
  display: inline-block;
  max-width: 180px;
  text-align: left;
  background-color: #ff7070;
  color: #FFF;
  text-decoration: none;
  padding: 10px 24px;
  border-radius: 4px;
  border-bottom: 4px solid #c32020;
}

.btn-push-pink:active {
    transform: translateY(4px);
    border-bottom: none;
}

.btn-push-gray {
  display: inline-block;
  max-width: 180px;
  text-align: left;
  background-color: #808080;
  color: #FFF;
  text-decoration: none;
  padding: 10px 24px;
  border-radius: 4px;
  border-bottom: 4px solid #a9a9a9;
}

.btn-push-gray:active {
    transform: translateY(4px);
    border-bottom: none;
}

.btn-push-blue {
  display: inline-block;
  max-width: 180px;
  text-align: left;
  background-color: #428bca;
  color: #FFF;
  text-decoration: none;
  padding: 10px 24px;
  border-radius: 4px;
  border-bottom: 4px solid #557db9;
}

.btn-push-blue:active {
    transform: translateY(4px);
    border-bottom: none;
}

/*Pointコメントボックス*/
.box27 {
    position: relative;
    margin: 2em 0;
    padding: 0.5em 1em;
    border: solid 3px #62c1ce;
}
.box27 .box-title {
    position: absolute;
    display: inline-block;
    top: -27px;
    left: -3px;
    padding: 0 9px;
    height: 25px;
    line-height: 25px;
    font-size: 17px;
    background: #62c1ce;
    color: #ffffff;
    font-weight: bold;
    border-radius: 5px 5px 0 0;
}
.box27 p {
    margin: 0; 
    padding: 0;
}
.sonota{
    width:calc(100% - 70px)!important;
}

.padding__none {
    padding:0px 0px 0px 0px;
}

.padding__none th{
    padding:0px 0px 0px 0px;
}
.padding__none td{
    padding:0px 9px 0px 0px;
}