/* :::::::::::::::::: FRONT :::::::::::::::::: */

/* :::::::::::::::::: projects :::::::::::::::::: */

#projects {
	margin-top: 50px;
	margin-bottom: 30px;

}
#projects .bgleft{
	position: fixed;
	background: #fff;
	width: 399px;
	height: 1000px;
	z-index: 11;
	top: 128px;
	left: 0;
	max-width: calc(100% - 18px);
}
#projects.viewleft .bgleft{
	width: 109px;
}
#projects.typeuser .bgleft{
	width: 149px;
}
#projects.typeuser.viewleft .bgleft{
	width: 49px;
}

#projects .scroll {
	overflow: scroll;
	position: relative;
	margin-top: 30px;
	z-index: 3;
}
#projects .btn {
	font-size: 0.75rem;
	display: inline-block;
}
#projects .btn a {
	line-height: 1.75;
	padding: 1px 8px;
	min-width: 50px;
	border-radius: 3px;
	color: #e62c2a;
	background: #fff;
	border: solid 1px #e62c2a;
}
#projects .btn a:hover {
	color: #fff;
	background: #e62c2a;
}
#projects .custom-date{
	vertical-align: middle;
	display: inline-block;
	position: relative;
}
#projects .custom-date > a svg{
	fill: #DDBEA9;
	margin: 1px 3px 0;
}
#projects .custom-date a:hover svg{
	fill: #e62c2a;
}
#projects .custom-date-modal{
	position: absolute;
	background: #fff;
	border: solid 2px #CB997E;
	padding: 8px 15px 10px;
	min-width: 310px;
	box-shadow: 0 1px 10px rgba(0, 0, 0, 0.4);
	transition: all .5s;
	opacity: 0;
	z-index: -1;
	top: -200px;
	left: 28px;
}
#projects .custom-date-modal.on{
	opacity: 1;
	z-index: 2;
	top: 15px;
}
#projects .custom-date-modal .close-button{
	position: absolute;
	top: -18px;
	right: -18px;
}
#projects .custom-date-modal .close-button a svg{
	fill: #CB997E;
	transform: scale(0.75);
}
#projects .custom-date-modal .close-button a:hover svg{
	fill: #DDBEA9;
}

#projects .custom-date-modal .tr{
	display: inline-block;
}
#projects .custom-date-modal .label{
	font-size: 0.75rem;
	display: inline-block;
	width: 50px;
}
#projects .custom-date-modal .td{
	display: inline-block;
	width: 150px;
}
#projects .custom-date-modal .period a{
	font-size: 1rem;
	font-weight: 500;
	line-height: 1.5;
	text-align: center;
	color: #bbb;
	border: solid 1px #ccc;
	border-radius: 3px;
	display: inline-block;
	margin: 0 3px;
	padding-bottom: 2px;
	min-width: 26px;
}
#projects .custom-date-modal .period a.on{
	color: #fff;
	border: solid 1px #e62c2a;
	background: #e62c2a;
}
#projects .custom-date-modal .period .unit{
	font-size: 0.875rem;
	color: #666;
}
#projects .custom-date-modal .submit{
	display: inline-block;
}
#projects .custom-date-modal .submit a{
	font-size: 0.875rem;
	line-height: 1.5;
	background: #CB997E;
	padding: 3px 20px 4px;
	min-width: auto;
}
#projects .custom-date-modal .loading{
	position: absolute;
	bottom: 13px;
	right: 95px;
	z-index: 1;
}
#projects .custom-date-modal .loading img{
	width: 24px;
}


#projects .useronly{
	display: none;
}
#projects.typeuser .useronly{
	display: inline-block;
}

#projects .mode {
	background: #fff;
	margin: 0;
	padding: 1px 0 0 5px;
	z-index: 6;
	position: fixed;
	display: flex;
	column-gap: 4px;
}

#projects .type {
	background: #fff;
	margin: 1px 0 0 200px;
	padding: 0 0 0 5px;
	z-index: 5;
	position: fixed;
	display: flex;
	column-gap: 4px;
}

#projects .move {
	background: #fff;
	margin: 1px 0 0 400px;
	padding: 0 0 0 5px;
	z-index: 5;
	position: fixed;
	display: flex;
	column-gap: 4px;
}

#projects .move svg {
	fill: #e62c2a;
}

#projects .move .move-left svg,
#projects .move .move-left7 svg {
	transform: scale(-1, 1);
}

#projects .move .moveday {
	display: inline-block;
	padding: 0 3px;
}

#projects .move .btn a:hover svg {
	fill: #fff;
}

#projects .function {
	text-align: right;
	background: #fff;
	width: 100%;
	margin: 1px 0 0 0;
	padding: 0 5px 0 0;
	height: 68px;
	z-index: 3;
	position: fixed;
	display: flex;
	column-gap: 4px;
	justify-content: flex-end;
}

#projects .mode .btn.on a,
#projects .type .btn.on a,
#projects .function .btn.on a {
	color: #fff;
	background: #e62c2a;
}
#projects .head {
	font-size: 0.75rem;
	position: sticky;
	background: #fff;
	width: 100%;
	z-index: 10;
	top: 0;
}

#projects .view {
	padding: 0 0 0 5px;
	width: 70px;
	display: flex;
	column-gap: 4px;
}

#projects .view .view-left a,
#projects .view .view-right a,
#projects .view .view-all a {
	min-width: 20px;
}
#projects .view .view-all a{
	padding: 1px 6px;
}

#projects .view svg {
	fill: #444;
}

#projects .view .view-left svg {
	transform: scale(-1, 1);
}
#projects .view .view-left.on svg {
	transform: scale(1, 1);
}

#projects .view .btn a {
	color: #444;
	border: solid 1px #444;
}

#projects .view .btn a:hover {
	color: #fff;
	background: #444;
}

#projects .view a:hover svg {
	fill: #fff;
}

#projects .view .view-all svg {
	margin-bottom: 3px;
}


#projects .view .view-all.on svg {
	transform: scale(1, -1);
}

#projects .view .view-all.on a:hover {
	background: #888;
}

#projects .headLeft .label {
	font-size: 0.75rem;
	line-height: 38px;
	height: 47px;
	position: fixed;
	background: #fff;
	border-bottom: solid 1px #ddd;
	width: 400px;
	overflow: hidden;
	top: 80px;
	z-index: 30;
	transition: all 0.1s ease-out;
}

#projects.viewleft .headLeft .label {
	width: 110px;
}

#projects .head .dayArea {
	display: none;
	font-size: 0.875rem;
	font-weight: 200;
	width: calc(100% - 400px);
	margin-left: 400px;
	height: 47px;
	position: relative;
	background: #fff;
}
#projects.viewleft .head .dayArea {
	width: calc(100% - 110px);
	margin-left: 110px;
}

#projects .head .dayArea .days {
	text-align: center;
}

#projects .head .dayArea .month {
	font-size: 0.75rem;
	vertical-align: top;
	margin: 0 2px;
	display: inline-block;
}

#projects .head .dayArea .day {
	font-size: 1rem;
	font-weight: bold;
	line-height: 1.25;
	display: inline-block;
}

#projects .head .dayArea .week {
	font-size: 0.875rem;
	margin: 0 0 0 5px;
	display: inline-block;
}
#projects .head .dayArea .time{
	border-bottom: solid 1px #ddd;
	margin-top: -3px;
	white-space: nowrap;
}
#projects .head .dayArea .time .h {
	font-size: 0.75rem;
	text-align: center;
	color: #aaa;
	display: inline-block;
	width: 100px;
	position: relative;
}
#projects .head .dayArea .time .h .hl {
	position: absolute;
	content: '';
	border-left: solid 1px rgba(220, 220, 220, 0.3);
	height: 1000px;
	top: 29px;
	left: 50px;
	z-index: 1;
}
#projects .head .dayArea .time .h::after {
	content: '|';
	line-height: 0;
	color: #ddd;
	display: block;
}

#projects .headLeft .project-name {
	width: 130px;
	overflow: hidden;
}


#projects .headLeft .project-other {
	font-size: 1.5rem;
	letter-spacing: -0.3rem;
	position: absolute;
	top: 0;
	right: 10px;
}
#projects.typeuser .headLeft .project-other {
	display: none;
}
#projects.viewleft .headLeft .project-other {
	display: none;
}
#projects .headLeft .project-other > a {
	color: #6B705C;
}

#projects .project-other-menu{
	position: fixed;
	background: #fff;
	border: solid 1px #999;
	padding: 0;
	margin: 32px 0 0;
	height: 88px;
	top: 85px;
	left: 370px;
	transition: all 0.25s ease-out;
	z-index: 25;
	overflow: hidden;
	box-shadow: 0 1px 10px rgba(0, 0, 0, 0.4);
}
#projects.viewleft .project-other-menu {
	display: none;
}

#projects .project-other-menu.close{
	height: 0;
	box-shadow: 0 0 0 rgba(0, 0, 0, 0);
	opacity: 0;
}
#projects .project-other-menu ul{
	list-style: none;
	margin: 0;
	padding: 0;
}
#projects .project-other-menu li{
	font-size: 0.75rem;
	border-top: dotted 1px #999;
}
#projects .project-other-menu li:first-child{
	border-top:none;
}
#projects .project-other-menu li a{
	padding: 4px 8px;
	display: inline-block;
}
#projects .project-other-menu li a:hover{
	color: #fff;
	background: #6B705C;
}

#projects .headLeft .project-users, #projects .project .users,
#projects .headLeft .project-place, #projects .project .place {
	width: 100px;
}

#projects.viewleft .headLeft .project-name,
#projects.viewleft .headLeft .project-users, #projects.viewleft .project .users,
#projects.viewleft .headLeft .project-place, #projects.viewleft .project .place {
	width: 0;
	opacity: 0;
}

#projects .head .date, #projects .project .date, #projects .project .dateday {
	font-size: 0.875rem;
	font-weight: 200;
	white-space: nowrap;
	width: calc(100% - 400px);
	margin-left: 400px;
	background: #fff;
	transition: all 0.15s ease-out;
}

#projects.viewleft .head .date, #projects.viewleft .project .date {
	margin-left: 110px;
}

#projects.viewleft .project .dateday {
	width: calc(100% - 110px);
	margin-left: 110px;
}

#projects .head .date {
	font-size: 0;
	padding-top: 12px;
	padding-bottom: 11px;
	background: #fff;
	border-bottom: solid 1px #ddd;
	position: relative;
	width: fit-content;
	height: 47px;
	transition: all 0s;
}
#projects .head .date .month {
	color: #444;
	position: absolute;
	font-size: 0.75rem;
	margin: -14px 0 0 -6px;
}

#projects .head .date .today .month {
	margin-top: -18px;
}

#projects .head .date .holiday .month,
#projects .head .date .w6 .month,
#projects .head .date .w0 .month {
	margin-top: -17px;
}

#projects .head .date .day {
	font-size: 0.875rem;
	text-align: center;
	display: inline-block;
	width: 30px;
	border-left: solid 1px #eee;
	position: relative;
}

#projects .head .date .day .hl {
	position: absolute;
	content: '';
	border-left: solid 1px rgba(220, 220, 220, 0.3);
	height: 1000px;
	top: 35px;
	left: -2px;
	z-index: 5;
	pointer-events: none;
}
#projects .head .date .day .hlc {
	position: absolute;
	content: '';
	border-left: dotted 1px rgba(220, 220, 220, 0.3);
	height: 1000px;
	top: 35px;
	left: 50%;
	z-index: 5;
	pointer-events: none;
}
#projects .head.month4 .date .day .hlc {
	display: none;
}

#projects .head .date .day.w6 {
	color: #fff;
	background: #c1c8ea;
}

#projects .head .date .day.w0, #projects .head .date .day.holiday {
	color: #fff;
	background: #e69066;
}

#projects .head .date .day.today {
	border: solid 1px #ff5900
}

#projects .head .date .week {
	font-size: 0.75rem;
	margin-left: 5px;
	opacity: 0.8;
	display: none;
}

#projects .lists {
	width: fit-content;
}

#projects .lists.day,
#projects .lists.listday {
	width: 100%;
}

#projects .lists .title span{
	display: inline-block;
	vertical-align: top;
	opacity: 0.7;
}

#projects .lists.week .title .starttime,
#projects .lists.month .title .starttime,
#projects .lists.month4 .title .starttime,
#projects .lists .title .endtime{
	margin-right: 5px;
}
#projects .lists.day .title .starttime,
#projects .lists.day .title .minus,
#projects .lists.day .title .endtime,
#projects .lists.week .title .minus,
#projects .lists.week .title .endtime,
#projects .lists.month .title .minus,
#projects .lists.month .title .endtime,
#projects .lists.month4 .title .minus,
#projects .lists.month4 .title .endtime{
	display: none;
}
#projects .lists .title.multi .starttime,
#projects .lists .title.multi .endtime{
	display: none;
}

#projects .project{
	position: relative;
}
#projects .project .title {
	width: 200px;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
}
#projects .project .title a{
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
}
#projects.edit .project .title{
	width: 180px;
}
#projects.edit .project .title a {
	text-decoration: underline;
	color: #e62c2a;
}
#projects .lists .drag{
	display: none;
}
#projects.edit .lists .drag{
	width: 20px;
	display: block;
	position: relative;
}
#projects.edit .lists .drag::before{
	content: url('/images/icon-drag.svg');
	line-height: 1;
	position: absolute;
	top: 2px;
	left: 6px;
}
#projects.viewleft .lists .drag{
	display: none;
}
#projects .lists .dragging{
	z-index: 100;
	opacity: 0.7;
}
#projects .project.bd1::before,
#projects .user.bd1::before{
	content: '';
	display: block;
	border-top: 3px solid #e62c2a;
	position: absolute;
	width: 100%;
	z-index: 22;
}
#projects .project.bd2::after,
#projects .user.bd2::after{
	content: '';
	display: block;
	border-bottom: 3px solid #e62c2a;
	position: absolute;
	width: 100%;
	z-index: 22;
}

#projects .project .label {
	font-weight: 300;
	position: absolute;
	background: #fff;
	border-bottom: solid 1px #ddd;
	border-right: solid 1px #ddd;
	padding: 4px 0 3px;
	z-index: 20;
	left: 0;
	width: 400px;
	min-height: 30px;
	overflow: hidden;
	transition: all 0s;
}

#projects.viewleft .project .label {
	width: 110px;
	white-space: nowrap;
}

#projects .project .users {
	font-size: 0.75rem;
	font-weight: 300;
}

#projects .project .users>span {
	display: inline-block;
	border-radius: 3px;
	padding: 1px 2px;
	margin: 1px;
}

#projects .project .users>span .first {
	display: none;
}
#projects .project .users>span .first.same {
	font-size: 0.5rem;
	line-height: 1;
	white-space: nowrap;
	display: inline-block;
	overflow: hidden;
	width: 9px;
}

#projects .project .users .leader {
	color: #fff;
	background: #6b705c;
}

#projects .project .users .user {
	color: #fff;
	background: #A5A58D;
}

#projects .project .users .level {
	color: #fff;
	background: #CB997E;
}

#projects .project .place {
	font-size: 0.875rem;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
}

#projects .project .dateday,
#projects .project .date {
	border-bottom: solid 1px #ddd;
	overflow: hidden;
	position: relative;
}
#projects .close .project .dateday,
#projects .close .project .date,
#projects .child.close .project .label{
	height: 0 !important;
	padding: 0;
	margin: 0;
	border: none;
}

#projects .linesub{
	background: #fff;
	position: absolute;
	height: 30px;
	opacity: 0.95;
	z-index: 1;
	pointer-events: none;
}
#projects .project:first-child .linesub{
	height: 29px;
}
#projects .listday .linesub{
	display: none;
}

#projects .project .dateday .line,
#projects .project .date .line {
	font-size: 0.75rem;
	color: #fff;
	background: #B7B7A4;
	height: 30px;
	margin: 0 0 1px;
	padding: 0;
	position: relative;
}

#projects .project .date .line .start,
#projects .project .dateday .line .start {
	display: inline-block;
	position: absolute;
	top: 3px;
	left: 4px;
	z-index: 8;
}
#projects .project .date .line1 .start,
#projects .project .dateday .line1 .start{
	display: inline-block;
	position: absolute;
	top: 1px;
	z-index: 8;
}

#projects .project .date .line .end,
#projects .project .dateday .line .end {
	display: inline-block;
	position: absolute;
	top: 3px;
	right: 4px;
	z-index: 8;
}
#projects .project .date .line1 .end,
#projects .project .dateday .line1 .end{
	display: inline-block;
	position: absolute;
	top: 1px;
	right: 4px;
	z-index: 8;
}

#projects .project .date .line .startend,
#projects .project .date .line1 .startend {
	color: #444;
	display: inline-block;
	position: absolute;
	top: 1px;
	z-index: 8;
}

#projects .project .dateday .line .startend {
	display: block;
	float: left;
}
#projects .project .dateday .line.thin .start{
	color: #444;
	display: inline-block;
	position: absolute;
	top: 1px;
	left: -32px;
}
#projects .project .dateday .line.thin .end{
	color: #444;
	display: inline-block;
	position: absolute;
	top: 1px;
	right: -32px;
}
#projects .project .dateday .line1,
#projects .project .date .line1 {
	font-size: 0.75rem;
	color: #fff;
	background: #B7B7A4;
	height: 20px;
	margin: -10px 0 1px;
	padding: 0 5px;
	position: relative;
	
}
#projects .project .date .line1 {
	display: inline-block;
}

#projects .project .dateday .line1.noline{
	margin-top: 20px;
}

#projects .project .date .line1 .status {
	display: inline-block;
	position: absolute;
	background: #ff5900;
	border-radius: 2px;
	padding: 0 2px;
	right: 0;
}

#projects .project .dateday {
	display: none;
}

#projects .project .title .arrow {
	cursor: pointer;
	display: inline-block;
	padding: 0 2px;
	margin: 0 0 0 -12px;
}

#projects .project .title .arrow svg {
	transform: rotate(90deg);
	transition: all 0.1s ease-out;
}

#projects .project .title .arrow.close svg {
	transform: rotate(0);
}

#projects .project.depth0 {
	border-top: solid 1px #ddd;
}

#projects .project.depth0 .title {
	font-weight: normal;
	padding-left: 15px;
	line-height: 1;
}

#projects .project.depth1 .title {
	padding-left: 30px;
	line-height: 1;
}

#projects .project.depth2 .title {
	padding-left: 45px;
	line-height: 1;
}

#projects .project.depth3 .title {
	padding-left: 60px;
	line-height: 1;
}

#projects .project.depth4 .title {
	padding-left: 75px;
	line-height: 1;
}

#projects .child {
	position: relative;
	transition: all 0.1s ease-out;
}

#projects .child.close {
	height: 0 !important;
}


#projects .child .project .title a {
	display: inline-block;
	max-width: 150px;
	overflow: hidden;
}

#projects .child.close .project {
	height: 0 !important;
	overflow: hidden;
}

/* 担当者 */

#projects.typeuser .headLeft .label {
	width: 150px;
}

#projects.typeuser .head .date,
#projects.typeuser .user .date{
	width: fit-content;
	margin-left: 150px;
}
#projects.typeuser .user .dateday,
#projects.typeuser .head .dayArea,
#projects.typeuser .user .messageArea {
	width: calc(100% - 150px);
	margin-left: 150px;
}

#projects .user {
	position: relative;
}

#projects .user .label .title {
	width: 200px;
	overflow: hidden;
	white-space: nowrap;
	margin-left: 15px;
}

#projects .user .label {
	font-weight: 300;
	position: absolute;
	background: #fff;
	border-top: solid 1px #ddd;
	border-right: solid 1px #ddd;
	padding: 4px 0 3px;
	margin-top: -1px;
	z-index: 20;
	left: 0;
	top: -1px;
	width: 150px;
	min-height: 40px;
	overflow: hidden;
	transition: all 0s;
}

#projects .user:last-child .label {
	border-bottom: solid 1px #ddd;
}

#projects.typeuser.viewleft .headLeft .label,
#projects.viewleft .user .label {
	width: 50px;
}

#projects.typeuser.viewleft .head .date{
	margin-left: 50px;
}
#projects.typeuser.viewleft .user .date,
#projects.typeuser.viewleft .user .dateday,
#projects.typeuser.viewleft .head .dayArea,
#projects.typeuser.viewleft .user .messageArea {
	width: calc(100% - 50px);
	margin-left: 50px;
}

#projects.viewleft .btn.view-all {
	display: none;
}


#projects .user:first-child {
	border-top: solid 1px #ddd;
}

#projects .user .dateday {
	display: none;
}

#projects .user .dateday,
#projects .user .date,
#projects .user .messageArea {
	border-bottom: solid 1px #ddd;
	overflow: hidden;
}
#projects .user .date{
	position: relative;
	background: #fff;
}

#projects .user .dateday .line,
#projects .user .date .line {
	font-size: 0.75rem;
	color: #fff;
	background: #B7B7A4;
	height: 30px;
	margin: 0 0 1px;
	padding: 0;
	position: absolute;
	top: 0;
}

#projects .user .dateday .line1,
#projects .user .date .line1 {
	display: block;
	font-size: 0.75rem;
	color: #fff;
	background: #B7B7A4;
	height: 20px;
	margin: 24px 0 1px;
	padding: 0 5px;
	position: absolute;
	z-index: 1;
}

#projects .user .dateday .line1.noline{
	margin-top: 0;
	position: relative;
}
#projects .user .date .line .title,
#projects .user .dateday .line .title {
	position: absolute;
	white-space: nowrap;
	margin: 4px 5px 0;
	z-index: 3;
}

#projects .user .date .line .title.black {
	color: #000;
	/* background: #fff; */
	margin-left: 5px;
	padding-left: 3px;
}
#projects .user .date .line .title.black a{
	color: #000 !important;
}
#projects .lists.day .user .dateday .line{
	overflow: hidden;
}
#projects .user .line .title a{
	white-space: nowrap;
}

#projects.edit .user .date .line .title a {
	text-decoration: underline;
}

#projects .user .date .line .start,
#projects .user .dateday .line .start,
#projects .user .date .line1 .start,
#projects .user .dateday .line1 .start {
	display: inline-block;
}

#projects .user .date .line .end,
#projects .user .dateday .line .end,
#projects .user .date .line1 .end,
#projects .user .dateday .line1 .end {
	display: block;
	float: right;
}

#projects .user .date .line .startend,
#projects .user .date .line1 .startend {
	color: #444;
	display: block;
	float: left;
}

#projects .user .dateday .line .startend {
	display: block;
	float: left;
}
#projects .user .date .line1 .startend{
	white-space: nowrap;
}

#projects .user .messageArea {
	min-height: 24px;
	position: relative;
}

#projects .user .message {
	position: absolute;
}

#projects .user .message a {
	color: #6B705C;
}

#projects .user .message .flg {
	font-size: 0.75rem;
	line-height: 1;
	text-align: center;
	vertical-align: top;
	color: #fff;
	background: #6B705C;
	padding: 2px 3px 4px;
	margin: 2px 2px 0px 1px;
	display: inline-block;
	min-width: 14px;
	border-radius: 8px;
}

#projects .user .message .title {
	font-size: 0.875rem;
	vertical-align: top;
	display: inline-block;
}



/* 担当者 list */

/* #projects.typeuser .lists.listday .user .dateday{
	height: auto !important;
} */

#projects .lists.listday .line{
	position: relative;
	color: #333 !important;
	background: inherit !important;
	margin-top: 0 !important;
	margin-left: 0 !important;
	width: inherit !important;
}
#projects .lists.listday .line .title{
	position: relative;
	white-space: nowrap;
}
#projects .lists.listday .line .title a{
	font-size: 0.875rem;
	color: #333 !important;
}
#projects .lists.listday .line1{
	position: relative;
	color: #ff5900 !important;
	background: inherit !important;
	margin-top: -10px !important;
	margin-left: 0 !important;
	width: inherit !important;
}

#projects .lists.listday .dateday{
	min-height: 39px;
	position: relative;
}
#projects .lists.listday .line1{
	height: 8px;
}

#projects .lists.listday .dateday .line1 .end{
	float: inherit;
}
#projects .lists.listday .dateday .line1 .end::before{
	content: ' - ';
}


/* :::::::::::::::::: project-edit :::::::::::::::::: */

.project-edit-move {
	position: fixed;
	background: rgba(0, 0, 0, 0.2);
	z-index: 921;
}

.project-edit {
	position: fixed;
	background: #fff;
	top: 140px;
	left: calc(50% - 150px);
	border: solid 2px #000;
	z-index: 920;
	box-shadow: 0 1px 10px rgba(0, 0, 0, 0.4);
	transition: all 0.25s ease-out;
}

.project-edit .movebar {
	height: 30px;
	background: #ccc;
	cursor: move;
}

.project-edit .inner {
	padding: 15px 30px;
	overflow-y: auto;
}

.project-edit .iconMan {
	display: none;
}

.project-edit.close {
	top: -800px;
}

.project-edit.move {
	display: none;
}

.project-edit-move.close {
	display: none;
}

.project-edit .close-button {
	position: absolute;
	top: -18px;
	right: -18px;
}

.project-edit .close-button a {
	display: inline-block;
}

.project-edit .label .head {
	font-size: 0.875rem;
	vertical-align: top;
	display: inline-block;
	margin-top: 3px;
	width: 110px;
	-ms-user-select: none; /* IE 10+ */
	-moz-user-select: -moz-none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	user-select: none;
}

.project-edit .label .body {
	max-width: 280px;
	display: inline-block;
}

.project-edit .label .body.other label {
	display: inline-block;
	margin-right: 10px;
	user-select: none;
}

.project-edit .label .body.other label:last-child {
	margin-right: 0;
}

.project-edit input[name='title'] {
	display: inline-block;
	width: 200px;
}
.project-edit .userlabel{
	position: relative;
}
.project-edit .switchBtn {
	display: block;
	position: relative;
	top: 5px;
	left: 5px;
}
.project-edit .switchBtn .linkButton{
	display: inline-block;
	margin: 0 1px 1px 0;
}

.project-edit .switchBtn a{
	font-size: 0.75rem;
	font-weight: normal;
}
.project-edit .switchBtn a.on{
	color: #fff;
	background: #6B705C;
}

.project-edit .button {
	text-align: center;
	margin: 15px 0 0;
	cursor: inherit;
}

.project-edit .button input[type='button'] {
	font-size: 0.875rem;
	font-weight: 500;
	line-height: 1.75;
	text-align: center;
	vertical-align: top;
	padding: 1px 8px;
	margin: 5px 2px 0;
	display: inline-block;
	border-radius: 3px;
	position: relative;
	transition: all 0.25s ease-out;
	min-width: 80px;
	cursor: pointer;
}

.project-edit input[name='del'] {
	color: #666;
	background: #ddd;
	border: solid 2px #666;
}

.project-edit input[name='del']:hover {
	color: #fff;
	background: #666;
}

.project-edit input[name='add'] {
	color: #6B705C;
	background: #fff;
	border: solid 2px #6B705C;
}

.project-edit input[name='add']:hover {
	color: #fff;
	background: #6B705C;
}

.project-edit input[name='update'] {
	color: #fff;
	background: #ff8025;
	border: solid 2px #e62c2a;
}

.project-edit input[name='update']:hover {
	background: #e62c2a;
}

.project-edit .users,
.project-edit .levels{
	width: 280px;
	max-height: 100px;
	min-height: 33px;
	overflow-y: auto;
}
.project-edit .levels.hide {
	display: none;
}

.project-edit .man{
	display: inline-block;
	vertical-align: bottom;
	background: #A5A58D;
	height: 30px;
	margin: 0 2px 2px 0;
	padding: 2px 5px;
	border-radius: 3px;
	cursor: pointer;
}
.project-edit .lvl{
	display: inline-block;
	vertical-align: bottom;
	background: #4A4B6F;
	height: 25px;
	margin: 0 1px 2px 0;
	padding: 2px 5px;
	cursor: pointer;
}

.project-edit .man.off,
.project-edit .lvl.off {
	background: #f1f1f1;
}

.project-edit .man.leader {
	background: #6B705C;
}

.project-edit .man svg {
	fill: #fff;
}

.project-edit .man .name {
	font-size: 0.75rem;
	color: #fff;
	display: inline-block;
	vertical-align: top;
	margin: 2px 0 0 4px;
	user-select: none;
}
.project-edit .lvl .name {
	font-size: 0.75rem;
	color: #fff;
	display: inline-block;
	vertical-align: top;
	margin: 1px 0 0;
	user-select: none;
}

.project-edit .man.off .name{
	color: #999;
}
.project-edit .lvl.off .name{
	color: #4A4B6F;
}
.project-edit .man.state0{
	display: none;
}

.project-edit .datebody,
.project-edit .place {
	font-size: 0.875rem;
	display: inline-block;
	max-width: 270px;
}

.project-edit .place select {
	font-size: 0.875rem;
	width: auto;
	margin-bottom: 3px;
}

.project-edit .place input[name='placeother'] {
	font-size: 0.875rem;
	width: 270px;
	margin-bottom: 3px;
}

.project-edit .body input[name='status'] {
	font-size: 0.875rem;
	width: 270px;
	margin-top: 3px;
}

.project-edit .datebody input {
	font-size: 0.875rem;
	display: inline-block;
	width: auto;
	margin-bottom: 3px;
}
.project-edit input.dtpdate{
	max-width: 120px;
}
.project-edit input.dtptime{
	max-width: 80px;
}

.project-edit .parent select {
	font-size: 0.875rem;
	display: inline-block;
	width: auto;
	max-width: 270px;
}

.project-edit .plus a {
	font-size: 1.25rem;
	font-weight: 900;
	line-height: 1;
	color: #6B705C;
}

.verr.user {
	left: 142px;
}
.project-edit .updateMessageArea {
	position: relative;
}

.project-edit .updateMessage {
	font-size: 0.875rem;
	font-weight: bold;
	color: #e62c2a;
}

.project-edit .updateMessage .error {
	color: #e62c2a;
}

.project-edit .updateMessage .error .detail {
	font-size: 0.75rem;
	display: inline-block;
	max-width: 390px;
}

.project-edit .loading{
	float: left;
	position: relative;
}


.project-edit .color {
	font-size: 0.75rem;
	display: inline-block;
	padding: 2px 30px 2px 5px;
}

.colorPalettes {
	position: fixed;
	z-index: 922;
	padding: 5px;
	margin-right: 22px;
	background: #fff;
	border: solid 1px #ccc;
}

.colorPalettes.close {
	display: none;
}

.colorPalettes .close-button {
	position: absolute;
	top: -25px;
	right: -25px;
}

.colorPalettes .close-button a {
	display: inline-block;
}

.colorPalettes .close-button svg {
	transform: scale(0.8);
}
.colorPalettes>div{
	display: flex;
}
.colorPalettes>div>.colors>.color {
	display: inline-block;
	width: 30px;
	height: 30px;
	margin: 0 0 1px 1px;
	border: solid 1px #ddd;
}

.colorPalettes>div>.colors>.color.select {
	border: solid 2px #000;
}

.colorPalettes>div>span.label {
	font-size: 0.75rem;
	line-height: 1.125;
	width: 40px;
	height: 40px;
	margin: 0;
	border: none;
}
/* .colorPalettes .bgcolor{
	clear: both;
} */

#projects .project .label{
	position: -webkit-sticky; /* Safari */ 
	position: sticky;
	top: 0;
	left: 0;
}
#projects .user .label{
	position: -webkit-sticky; /* Safari */ 
	position: sticky;
	top: 0;
	left: 0;
}

/* :::::::::::::::::: first step :::::::::::::::::: */

.firstArea{
	position: fixed;
	z-index: 105;
	bottom: 50%;
	left: calc(50% - 200px);
	width: 400px;
}
.firstArea ul{
	list-style: none;
	margin: 0;
}
.firstArea li{
	font-size: 0.875rem;
	line-height: 2;
	display: block;
	position: relative;
	border: solid 1px #ff0000;
	border-radius: 5px;
	color: #fff;
	background: #ff5900;
	margin: 0 0 2px;
	padding: 2px 20px 2px 10px;
	width: 100%;
	height: 34px;
	overflow: hidden;
	right: 0;
	transition: all 0.3s ease;
}
.firstArea li a{
	color: #fff;
}
.firstArea li a.help{
	font-family: 'Century Gothic', 'Meiryo', 'メイリオ', 'Hiragino Kaku Gothic Pro', sans-serif;
	font-size: 1rem;
	font-weight: bold;
	text-align: center;
	line-height: 20px;
	width: 20px;
	height: 20px;
	position: absolute;
	top: 5px;
	right: 10px;
	color: #ff5900;
	background: #fff;
	border-radius: 3px;
}


/* :::::::::::::::::: XXX :::::::::::::::::: */

/* 640px smartphone*/

@media only screen and (max-width: 640px) {
	#header .logoArea {
		display: none;
	}
	#projects.viewleft .bgleft{
		width: 80px;
	}
	#projects.viewleft .headLeft .label,
	#projects.viewleft .project .label{
		width: 80px;
	}
	#projects.viewleft .head .date, #projects.viewleft .project .date{
		margin-left: 80px;
	}
	#projects .headLeft .label{
		width: calc(100% - 20px);
	}
	#projects .headLeft .project-name{
		width: 110px;
	}
	#projects .project .title{
		width: 180px;
	}
	#projects .headLeft .project-place{
		width: auto;
	}
	#projects .project-other-menu{
		left: inherit;
		right: 5px;
		margin-top: 40px;
	}
	#projects.viewleft .head .dayArea,
	#projects.viewleft .project .dateday {
		width: calc(100% - 80px);
		margin-left: 80px;
	}
	/* #projects.viewleft .project .dateday {
		overflow: inherit;
	} */
	#projects.viewleft .head .dayArea{
		width: fit-content;
	}
	#projects .head .dayArea{
		display: none;
	}
	.firstArea{
		width: 100%;
	}
	#projects .custom-date-modal{
		left: auto;
		right: 8px;
	}
	#projects .custom-date-modal.on{
		top: 40px;
	}

	.project-edit {
		width: calc(100% - 10px);
		top: 54px;
		left: 5px;
	}
	.project-edit.close {
		top: -850px;
	}
	.project-edit .movebar{
		display: none;
	}
	.project-edit .close-button{
		position: fixed;
		top: 60px;
		right: 10px;
	}
	.project-edit.close .close-button{
		position: absolute;
		top: 5px;
		right: 5px;
	}
	.project-edit .inner{
		overflow-y: auto;
		padding: 15px 10px;
	}
	.project-edit .label.datelabel .head,
	.project-edit .label.placelabel .head,
	.project-edit .label.parentlabel .head,
	.project-edit .label.colorlabel .head{
		width: 40px;
	}
	.project-edit .label.userlabel .head{
		margin-bottom: 10px;
	}
	.project-edit .switchBtn{
		display: inline-block;
		top: 0;
	}
	.project-edit .label .body{
		width: 100%;
		max-width: none;
	}
	.project-edit input[name='title']{
		width: calc(100% - 32px);
	}
	.project-edit .users{
		width: 100%;
	}
	.project-edit .place{
		width: calc(100% - 50px);
	}
	.project-edit .place input[name='placeother'],
	.project-edit .body input[name='status']{
		width: 100%;
	}
	.colorPalettes>div>span.label{
		height: 80px;
	}
	.project-edit .label .body.other{
		width: calc(100% - 32px);
		max-width: inherit;
	}
	.project-edit .userlabel,
	.project-edit .datelabel,
	.project-edit .placelabel,
	.project-edit .parentlabel,
	.project-edit .colorlabel{
		margin-bottom: 10px;
	}
	.project-edit input.dtptime{
		max-width: 90px;
	}
}



/* 980px smartphone*/
@media only screen and (max-width: 980px) {
	#projects .type {
		margin: 1px 0 0 0;
		left: 112px;
	}
	#projects .move{
		margin: 1px 0 0 0;
		left: 250px;
	}
}
/* 830px smartphone*/
@media only screen and (max-width: 830px) {
	#projects .move .move-left7,
	#projects .move .move-right7{
		display: none;
	}
	.project-edit {
		left: 5px;
	}
}
/* 700px smartphone*/
@media only screen and (max-width: 700px) {
	#projects{
		margin-bottom: 0;
	}
	#projects .function{
		top: 78px;
	}
	#projects .scroll{
		margin-top: 60px;
	}
	#projects .headLeft .label{
		top: 110px;
	}
	#projects .project-other-menu{
		top: 115px;
	}
	
}

@media only screen and (max-height : 479px) {
	
	#header,
	.menuButton,
	.menuArea,
	.iconArea,
	.loginedArea .logged{
		display: none;
	}
	#projects .function{
		top: auto;
	}
	#projects{
		margin: 0;
	}
	/* #projects{
		margin: 30px;
	} */
	#projects .scroll{
		margin-top: 30px;
	}
	#projects .bgleft,
	#projects .headLeft .label{
		top: 30px;
	}
	#projects .project-other-menu{
		top: 40px;
	}
	#projects .view .btn a{
		width: 50px;
	}
	#projects .headLeft .project-name{
		text-align: right;
		padding-right: 20px;
	}
	#projects .custom-date-modal{
		left: 0;
	}
	#projects .custom-date-modal.on{
		top: 40px;
	}

	.project-edit{
		top: 30px;
		left: 5px;
		width: calc(100% - 10px);
	}
	.project-edit .movebar{
		display: none;
	}
	.project-edit .close-button{
		position: fixed;
		top: 40px;
		right: 15px;
	}
	.project-edit.close .close-button{
		position: absolute;
		top: 5px;
		right: 5px;
	}
	.project-edit .inner{
		overflow-y: auto;
		padding: 15px 10px;
	}
	.project-edit .label .head{
		width: 90px;
	}
	.project-edit .label .body{
		width: calc(100% - 100px);
		max-width: none;
	}
	.project-edit input[name='title']{
		width: calc(100% - 150px);
	}
	.project-edit .users,
	.project-edit .levels{
		width: calc(100% - 50px);
	}
	.project-edit .datebody, .project-edit .place{
		width: calc(100% - 150px);
		max-width: none;
	}
	.project-edit .place select{
		margin-right: 5px;
	}
	.project-edit .place input[name='placeother']{
		display: inline-block;
	}
	.project-edit input.dtptime{
		max-width: 90px;
	}

}
@media only screen and (max-width: 700px) and (max-height : 479px) {
	#projects .custom-date{
		display: none;
	}
}
@media only screen and (max-width: 650px) and (max-height : 479px) {
	#projects .move .btn.today{
		display: none;
	}
}
@media only screen and (max-width: 600px) and (max-height : 479px) {
	#projects .move{
		display: none;
	}
}

/* 640px PC*/

@media only screen and (min-width: 640px) {
	.project-edit .loading{
		top: 15px;
		left: 15px;
	}
}

/* 480px smartphone*/
@media only screen and (max-width: 480px) {
	#projects .view .btn a{
		width: 50px;
	}
	#projects .headLeft .project-name{
		text-align: right;
		padding-right: 20px;
	}
}
/* w480px or h600px smartphone*/
@media only screen and (max-width: 480px) and (max-height: 600px) {
	
}

/* 430px smartphone*/
@media only screen and (max-width: 430px) {
	#projects .function .btn a{
		min-width: inherit;
	}
	#projects .type {
		margin: 1px 0 0 0;
		top: 78px;
		left: 0;
	}
	#projects .move{
		margin: 1px 0 0 0;
		left: inherit;
		right: 5px;
	}
}
@media only screen and (max-width: 400px) {
	#projects .function .btn.month4 a {
		font-size: 0;
	}
	#projects .function .btn.month4 a::before{
		content: '4m';
		font-size: 0.75rem;
	}
}
/* 375px smartphone*/
@media only screen and (max-width: 374px) {
	#projects .function .btn.week a,
	#projects .function .btn.month a {
		font-size: 0;
	}
	#projects .function .btn.week a::before{
		content: 'w';
		font-size: 0.75rem;
	}
	#projects .function .btn.month a::before{
		content: 'm';
		font-size: 0.75rem;
	}
}
/* 320px smartphone*/
@media only screen and (max-width: 320px) {
	#projects .headLeft .project-users{
		width: 50px;
	}
	#projects .headLeft .project-place{
		display: none !important;
	}
	#projects .custom-date-modal{
		min-width: 300px;
	}
	#projects .custom-date-modal .td{
		width: 140px;
	}
}


/* 730px */

@media only screen and (max-width: 45.625em) {}

@media only screen and (min-width: 45.625em) {}

/* 640-1000px */

@media only screen and (max-width: 62.5em) and (min-width: 40em) {}

/* 1000-1070px */

@media only screen and (max-width: 1070px) and (min-width: 62.5em) {}

/* 1000-1200px */

@media only screen and (max-width: 75em) and (min-width: 62.5em) {}

/* 1200px over */

@media only screen and (min-width: 75em) {}