/* Generated by CSS Usage.
   File: http://www.youj.com/statics/css/style-my.css.
   DON'T DELETE YOUR ORIGINAL CSS FILE. Keep it so you can fix the glitches later.
   Some rules have been deleted, some selectors are prefixed with "UNUSED".
   Look for the UNUSED items and see if you can remove them. */

@charset "utf-8";
[v-cloak] { display: none; }
body { position: relative; background-color: #F2F4F7; height: 100%; }
a { cursor: pointer; }
a:focus { outline: none; -moz-outline: none; }
.disabled {
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-o-user-select: none;
	user-select: none;
}
.ellip { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }

#layOut { position: relative; }
.nav-wrapper { display: flex; display: -webkit-flex; width: 82%; margin: 40px auto 0; }
.webnav-content { width: 87.666667%; min-height: 600px; padding-left: 18px; }
.webnav-content .page-container { margin-bottom: 80px; }
.webnav-content .container { margin: 0 auto 40px; transition: all 0.24s ease-out; width: 92%; }
.webnav-content .container .project-info { width: 100%; }
.webnav-content .container .project-detail { display: flex; padding: 15px 36px; margin-bottom: 20px; background: #fff; border-radius: 10px; }
.webnav-content .container .project-detail .project-img { width: 135px; margin-right: 30px; }
.webnav-content .container .project-detail .project-img .pimgcover { box-shadow: 4px 3px 3px #ccc; object-fit: cover; }
.webnav-content .container .project-detail .project-info .infoitem { border: 1px solid transparent;  padding-right: 150px;}
.webnav-content .container .project-detail .project-info .infoitem .ptitle { font-size: 24px; font-weight: 600; margin: 0 0 10px; }
.webnav-content .container .project-detail .project-info .desc { display: -webkit-box; overflow: hidden; text-align: justify; margin: 10px 0; -webkit-line-clamp: 2; -webkit-box-orient: vertical; white-space: pre-wrap; word-break: break-all; }
.webnav-content .container .project-detail .project-info .readbtn { display: flex; display: -webkit-flex; margin: 20px 0 0; }
.webnav-content .container .project-detail .project-info .readbtn .btn { display: flex; align-items: baseline; display: -webkit-flex; -webkit-align-items: baseline; }
.webnav-content .container .project-detail .project-info .readbtn .btn i { font-size: 14px; margin-right: 3px; }
.webnav-content .container .project-detail .project-info .readbtn a { border-radius: 4px; margin-right: 10px; padding: 5px 10px; color: #fff; transition: all 0.14s linear; }
.webnav-content .container .project-detail .project-info .readbtn .btn-warning { background: #f0ad4e; }
.webnav-content .container .project-detail .project-info .readbtn .btn-warning:hover { background: #ed9c28; }
.webnav-content .container .project-detail .project-info .readbtn .btn-success { background: #5cb85c; }
.webnav-content .container .project-detail .project-info .readbtn .btn-success:hover { background: #47a447; }
.webnav-content .container .project-detail .project-info .readbtn .btn-info { background: #007bff; }
.webnav-content .container .project-detail .project-info .readbtn .edit { background: #fa541c; }

.webnav-content .listboard-body #sortable_portlets { position: relative; }
.webnav-content .listboard-body #sortable_portlets .cardArea { border-radius: 10px; background: #fff; margin-bottom: 20px; }
.cardArea .cardArea-head { display: flex; align-items: center; justify-content: space-between; display: -webkit-flex; -webkit-justify-content: space-between; -webkit-align-items: center; border-bottom: 1px solid #f1f4f9; font-weight: 600; padding: 13px 36px; }
.cardArea .cardArea-head .cardArea-title { font-size: 18px; color: #101010; }
.cardArea .cardArea-head .cardArea-more { display: flex; align-items: baseline; display: -webkit-flex; -webkit-align-items: baseline; font-size: 14px; color: #597EF7; transition: all 0.14s linear; }
.cardArea .cardArea-head .cardArea-more:hover { color: #2455f4; }
.cardArea .cardArea-head .cardArea-more i { font-size: 12px; transition: all 0.24s ease-out; }
.cardArea .cardArea-head .cardArea-more .i-rotate { transform: rotate(90deg); }
.cardArea .cardArea-main-wrap { 
	border: 1px solid transparent; 
	box-sizing: border-box; 
	overflow: hidden; 
	padding: 22px 7px; 
	/* height: 380px; */
}

.cardArea .cardArea-main-wrap .cardArea-main-hidden { max-height: 183px; overflow: hidden; transition: all 0.24s ease-out; }
.cardArea .cardArea-main-wrap .cardArea-main { display: grid; grid-template-columns: repeat(5, 20%); display: -moz-grid; border: 1px solid transparent; }
.cardArea .cardArea-main-wrap .cardArea-main .cardArea-item-wrap { padding: 0 8px; }
.cardArea .cardArea-main-wrap .cardArea-main .cardArea-item { display: block; padding:10px; border-radius: 6px; transition: all 0.14s linear; }
.cardArea .cardArea-main-wrap .cardArea-main .cardArea-item:hover { background: #f2f8fd; }
.cardArea .cardArea-main-wrap .cardArea-main .cardArea-item .cardArea-item-head { display: flex; display: -webkit-flex; }
.cardArea .cardArea-main-wrap .cardArea-main .cardArea-item .cardArea-item-head .cardArea-item-img { flex-shrink: 0; -webkit-flex-shrink: 0; width: 32px; height: 32px; border-radius: 100%; margin-right: 10px; }
.cardArea .cardArea-main-wrap .cardArea-main .cardArea-item .cardArea-item-head .cardArea-item-img .webnavicon { display: inline-block; width: 100%; height: 100%; background-size: 26px, 26px; }
.favicon-webnav {background: url(/statics/images/icons/toolicon2.png) no-repeat 50% 0/cover !important; opacity: 0.8;}
.cardArea .cardArea-main-wrap .cardArea-main .cardArea-item .cardArea-item-head .cardArea-item-title { display: flex; align-items: center; white-space: nowrap; overflow: hidden; font-size: 14px; font-weight: 600; color: #101010; }
.cardArea .cardArea-main-wrap .cardArea-main .cardArea-item .cardArea-item-content { display: -webkit-box; color: #8f8f8f; word-break: break-all; font-size: 12px; overflow: hidden; height: 3em; line-height: 1.5em; text-align: justify; padding-left: 34px; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.stair-nav-wrap { width: 12.333333%; }
.stair-nav { margin-top: 18px; }
.stair-nav-fixed { position: fixed; top: 0; margin-top: 0; }
.stair-nav .stair-main { display: inline-block; width: 100%; }
.stair-nav .stair-step { color: #5e5e5e; font-size: 16px; margin-top: 18px; transition: all 0.14s linear; }
.stair-nav .stair-step span { cursor: pointer; white-space: nowrap; }
.stair-nav .stair-step-choose { position: relative; color: #fa541c; }
.stair-step-choose .stair-step-mask { position: absolute; top: 50%; left: -20px; transform: translateY(-50%); width: 16px; height: 16px; }
.stair-step-choose .stair-step-mask:before { position: absolute; top: 50%; transform: translateY(-50%); display: inline-block; background-color: #5e5e5e; content: ''; width: 12px; height: 2px; }

.show-more-tools {
	height:20px;
	text-align:center;
	cursor:pointer;
	padding:5px;
}

.show-more-tools:hover {
	color: #2455f4;
}

.height400 {
	height: 400px;
}

.height300 {
	height: 300px;
}



@media (max-width: 1600px) {
	.nav-wrapper { width: 92%; }
}

@media (max-width: 1300px) {
	.nav-wrapper { width: 95%; }
	.webnav-content .container { width: 100%; }
	.stair-nav .stair-step { font-size: 14px; }
	.stair-step-choose .stair-step-mask { display: none; }
}

@media (max-width: 1200px) {
	.nav-wrapper { width: 100%; margin: 10px auto 0; }
	.webnav-content { padding-left: 0; margin: auto; }
	.webnav-content .container { margin: 40px auto 0; }
	.stair-nav-wrap, .stair-nav { display: none; }
}

@media (max-width: 992px) {
	.webnav-content .container .project-detail .project-info .readbtn { display: flex; display: -webkit-flex; margin: 0; }
	.cardArea .cardArea-main-wrap .cardArea-main-hidden { max-height: 273px; }
	.cardArea .cardArea-main-wrap .cardArea-main { grid-template-columns: repeat(3, 33.333333%); }
}

@media (max-width: 768px) {
	.webnav-content { width: 100%; }
	.webnav-content .container { width: auto; margin: 20px 10px 0; }
	.webnav-content .container .project-detail, .cardArea .cardArea-head { padding: 15px 25px; }
	.cardArea .cardArea-main-wrap { padding: 22px 5px; }
	.cardArea .cardArea-main-wrap .cardArea-main-hidden { max-height: 453px; }
	.cardArea .cardArea-main-wrap .cardArea-main { grid-template-columns: repeat(2, 50%); }
	.cardArea .cardArea-main-wrap .cardArea-main .cardArea-item { padding: 14px 7px; }
}

@media (max-width: 767px) {
	.webnav-content .container .project-detail .project-img { display: none; }
	.cardArea .cardArea-main-wrap .cardArea-main { grid-template-columns: repeat(1, 100%); }
}