PADDashFormation/style.css

@charset "utf-8";
@font-face {
	font-family: 'FOT-KurokaneStd-EB';
	font-style: normal;
	/*font-weight: 400;*/
	src: url("fonts/FOT-KurokaneStd-EB.woff2") format('woff2'),
		 url("fonts/FOT-KurokaneStd-EB.woff") format('woff'),
		 url("fonts/FOT-KurokaneStd-EB.ttf") format('truetype'),
		 url("fonts/FOT-KurokaneStd-EB.eot") format('embedded-opentype'),
		 url("fonts/FOT-KurokaneStd-EB.svg") format('svg');
}
@keyframes loading-animate{
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(3600deg);
    }
}
body{
	--head-block-width: 108px;
	--head-block-height: 108px;
	--search-icon-unchecked: 0.4;
	--team-1-bgcolor : pink;
	--team-2-bgcolor : lightblue;
	--team-3-bgcolor : lightgreen;
	--team-1-color : red;
	--team-2-color : blue;
	--team-3-color : green;
	--font-family : "Microsoft Yahei","Source Han Sans",Arial, Helvetica, sans-serif, "Malgun Gothic", "맑은 고딕", "Gulim", AppleGothic;
	--game-font-family : 'FOT-KurokaneStd-EB',"Microsoft Yahei","Source Han Sans",Arial, Helvetica, sans-serif, "Malgun Gothic", "맑은 고딕", "Gulim", AppleGothic;
	--border-width: 2px;

	font-family: var(--font-family);
}
.display-none{
	display:none !important;
}
.disabled{
	cursor: not-allowed;
	pointer-events: none;
	opacity: 0.5;
}
.help-link::before{
	content: "Help & Tips";
}
.title,
.title-display
{
	font-size: 2em;
	font-weight: bold;
}
.detail,
.detail-display
{
	min-height: 1.5em;
	font-size: 1.5em;
}
.title,
.detail,
.title-display,
.detail-display
{
	font-family: var(--font-family);
	width:100%;
	border: none;
	background: none;
	box-sizing: border-box;
	padding: 1px;
	margin: 0;
}
.guide-mod .formation-box,
.guide-mod .control-box>div
{
	display: none;
}
.guide-mod .control-box>div.status
{
	display: block;
}
.formation-box .title:focus,
.formation-box .detail:focus
{
	border: black solid 1px;;
	background-color: #eee;
	padding: 0;
}
.formation-box .title,
.formation-box .detail
{
	display: none;
}
.formation-box .edit .title,
.formation-box .edit .detail
{
	display: block;
}
.formation-box .edit .title-display,
.formation-box .edit .detail-display
{
	display: none;
}

.config-checkbox-ipt{
	display:none;
}
.config-checkbox-lbl .config-checkbox-lbl-cicle{
	width: 28px;
	height: 12px;
	display: inline-block;
	position: relative;
	background-color: #8884;
	border-radius: 16px;
	margin-right: 5px;
}
.config-checkbox-lbl .config-checkbox-lbl-cicle::before{
	content:"";
	width: 20px;
	height: 20px;
	position: absolute;
	transition: .3s ease-out;
	background-color: #c6c6c6;
	box-shadow: 0 2px 4px 0 #0003;
	border-radius: 50%;
	left: -4px;
	top: -4px;
}
.config-checkbox-ipt:checked+.config-checkbox-lbl .config-checkbox-lbl-cicle {
    background: rgba(0,160,216,0.8);
}
.config-checkbox-ipt:checked+.config-checkbox-lbl .config-checkbox-lbl-cicle::before {
    background: #00A0D8;
    box-shadow: 0 2px 4px 0 rgba(0,160,216,0.4);
    left: calc(100% - 16px);
}
.config-checkbox-lbl{
	cursor: pointer;
	line-height: 25px;
	margin-right: 20px;
	display: inline-block;
}
.config-checkbox-lbl[for$=and-or]::after{
	content: "OR";
}
input:checked+ .config-checkbox-lbl[for$=and-or]::after{
	content: "AND";
}

.status{
	line-height: 16px;
}
/*.status.loading-mon-info .text::before{
	content: "正在加载怪物数据";
}*/
.status.loading-check-version .icon,
.status.loading-mon-info .icon,
.status.loading-skill-info .icon,
.status.prepare-cauture .icon
{
	display: inline-block;
	width: 16px;
	height: 16px;
	border: 4px SteelBlue dotted;
	border-radius: 50%;
	animation: loading-animate 50s infinite linear;
	vertical-align: middle;
}
ul{
	margin: 0;
	padding: 0;
	list-style: none;
}
/*队伍的整个盒子*/
.formation-box{
	width: 648px;
	min-width: 648px;
}

/*单个怪物*/
.monster{
	font-family: var(--game-font-family);
	width: 100px;
	height: 100px;
	margin: 0;
	display: block;
	background-repeat: no-repeat;
	position: relative;
	cursor: pointer;
	border-radius: 5px;
}
.null .monster,.delay .monster,
.null .property,.delay .property,
.null .subproperty,.delay .subproperty
{
	box-sizing: border-box;
	background-image: none !important;
}
.null .monster{
	background-color: rgba(230,230,230,0.5);
	border: 3px grey dashed;
}
.edit-box .null .monster{
	background-color: #653;
	border: none;
	box-shadow: inset black 0 0 7px;
}
.member{
	vertical-align: top;
}
.delay .monster{
	background-color: yellow;
	box-shadow: inset orange 0 0 7px;
	border: 3px black solid;
}
.delay .monster::before{
	width: 94px;
	height: 94px;
	color: black;
	font-size: 30px;
	line-height: 47px;
	text-align: center;
	font-weight: bold;
	/*content: "应 对\A威 吓";*/
	font-family: var(--font-family);
	white-space: pre-wrap;
	display: inline-block;
}
/*怪物属性*/
.property,.subproperty{
	position:absolute;
	left:0;top:0;
	width: 100px;
	height: 100px;
	background-repeat: no-repeat;
	background-image: url(images/CARDFRAME2.PNG);
	background-position: 100px 100px; /*默认都不显示*/
}
.property[data-property='6']{
	background-image: url(images/CARDFRAMEW.PNG);
	background-position: 0 0;
}
/*怪物-加值*/
.monster .plus{
	color: yellow;
	font-size: 17px;
	line-height: 17px;
	text-shadow: black 0 0 1px,black 0 0 2px, black 2px 2px 0;
	position: absolute;
	left:10px;
}
.null .monster>div,.delay .monster>div{
	display:none !important;
}
.monster .plus .hp::before,
.monster .plus .atk::before,
.monster .plus .rcv::before,
.monster .plus.has297::before
{
	content: "+";
}
.monster .plus.has297::after{
	content: "297";
}
.monster .plus.has297 .hp,
.monster .plus.has297 .atk,
.monster .plus.has297 .rcv
{ /*当是297时隐藏3维*/
	display:none;
}
/*怪物-觉醒*/
.monster .awoken-count,
.row-mon-awoken .awoken-count
{
	color: yellow;
	text-shadow: black 0 0 4px;
	text-align: center;
	background-image: url(images/awoken-count-bg.png);
	background-repeat: no-repeat;
	width: 34px;
	height: 38px;
}
.monster .awoken-count{
	position: absolute;
	top: -4px;
	right: 0;
	transform: scale(0.75) translateX(4px);
}
.monster .awoken-count,
.monster .awoken-count.full-awoken::before,
.row-mon-awoken .awoken-count,
.row-mon-awoken .awoken-count.full-awoken::before
{
	font-size: 20px;
	line-height: 28px;
}
.awoken-count.full-awoken{
	font-size: 0;
}
.awoken-count.full-awoken::before{
	content: "★";
}
.allowable-assist .awoken-count.full-awoken{
	font-size: 0;
	text-shadow: none;
	background-position-y: -38px;
}
.allowable-assist .awoken-count.full-awoken::before{
	content: none;
}
/*武器*/
.monster.wepon .awoken-count.full-awoken{
	transform: scale(0.79) translateY(4px);
	width:32px;height:32px;
    background-image: url(images/awoken.png);
	background-position-x: 0;
	background-position-y: -1568px;
}
/*怪物-超觉醒*/
.monster .super-awoken{
	position: absolute;
	right:0;
	top: 25px;
	transform: scale(0.75) translateX(4px);
}
/*怪物-等级*/
.monster .level{
	color: white;
	height: 17px;
	text-shadow: black 0 0 2px, black 2px 2px 0;
	position: absolute;
	left: 5px;
	bottom: 0;
	vertical-align: top;
}
.monster .level,.monster .level.max::before{
	font-size: 15px;
	line-height: 17px;
}
.monster .level.max{
	font-size: 0;
}
.monster .level._110{
	color: lightskyblue;
}
/*.monster .level::before{
	content: "Lv.";
}.monster .level.max::before{
	content: "Lv.最大";
}*/
.monster .id{
	display: block;
	color: white;
	font-family: var(--font-family);
	font-size: 15px;
	font-weight: 500;
	line-height: 17px;
	height: 17px;
	text-shadow: black 0px 0px 2px,black -1px -1px 1px,black 1px 1px 1px;
	position: absolute;
	left: 5px;
	bottom: 15px;
}
.not-show-mon-id .monster .id{
	display: none;
}
.monster .id::before{
	font-size: 12px;
}
/*.monster .id::before{
	content: "No.";
}*/
.monster .skill::before{
	content:"CD";
	font-size: 10px;
}
.monster .skill{
	font-size: 13px;
	line-height: 13px;
	color:white;
	text-shadow: black 0 0 1px,black 0 0 2px, black 2px 2px 0;
	position: absolute;
	right:0;
	bottom:0;
}
.monster .skill.max-skill{
	display: none;
}
.show-mon-skill-cd .monster .skill.max-skill{
	display: block;
}
.not-show-awoken-count .formation-box .team-total-info, /*单个队伍血量统计*/
.not-show-awoken-count .formation-box .team-ability, /*单个队伍三维*/
.not-show-awoken-count .formation-box .team-awoken, /*单个队伍觉醒统计*/
.not-show-awoken-count .formation-box .team-total-info /*单个队伍血量统计*/
{
	display: none !important;
}
.not-show-awoken-count .formation-box .team-bigbox
{
	margin-bottom: 5px;
}
.not-show-awoken-count .formation-box .team-badge
{
	position: absolute;
	z-index: 10;
}
/*辅助和队伍的每一只框架*/
.member, .acquisitus-awoken-icon{
	display: inline-block;
	position: relative;
	width: var(--head-block-width);
}
.formation-box .monster{
	margin: 4px; /*留给队长边框的*/
}
.team-assist, .team-members,.team-badge{
	display: inline-block;
}
/* 徽章，平时都隐藏 */
.team-badge li{
	display: inline-block;
}
.badge-radio{
	display: none;
}
.badge{
	display: none;
	cursor: pointer;
}
/* 显示所有徽章时则打开 */
.show-all-badges .badge{
	display: inline-block;
}
/* 选中的徽章平时也打开 */
.team-badge .badge-radio:checked+.badge{
	display: inline-block;
}
/*队伍的背景色*/
.team-1 .team-members,
.team-1 .team-latents,
.team-1 .team-box-name::before,
.team-1 .team-box-name::after
{
	background-color: var(--team-1-bgcolor);
}
.team-2 .team-members,
.team-2 .team-latents,
.team-2 .team-box-name::before,
.team-2 .team-box-name::after
{
	background-color: var(--team-2-bgcolor);
}
.team-3 .team-members,
.team-3 .team-latents,
.team-3 .team-box-name::before,
.team-3 .team-box-name::after
{
	background-color: var(--team-3-bgcolor);
}
.team-bigbox{
	position: relative;
	font-size:0;
	margin-bottom:10px;
}
.team-bigbox:last-of-type{
	margin-bottom:0;
}
/*队伍A、B的文字*/
.team-box-name::after,
.team-box-name::before
{
	font-size: 30px;
	font-weight: bold;
	text-align: center;
	line-height: 54px;
	white-space: pre-wrap;
	display: none;
	width: var(--head-block-width);
	height: var(--head-block-height);
}
.show-team-name-left .team-box-name::before{
	display: inline-block;
}
.show-team-name-right .team-box-name::after{
	display: inline-block;
}
.reverse-member-assist .team-box-name::after,
.reverse-member-assist .team-box-name::before
{
	vertical-align:top;
}
.team-1 .team-box-name::after,
.team-1 .team-box-name::before,
.team-1 .team-assist .member::after,
.team-1 .team-assist .member::before
{
	color: var(--team-1-color);
}
.team-2 .team-box-name::after,
.team-2 .team-box-name::before,
.team-2 .team-assist .member::after,
.team-2 .team-assist .member::before
{
	color: var(--team-2-color);
	/*vertical-align:top;*/
}
.team-3 .team-box-name::after,
.team-3 .team-box-name::before,
.team-3 .team-assist .member::after,
.team-3 .team-assist .member::before
{
	color: var(--team-3-color);
}
.team-box{
	display: inline-block;
	vertical-align:bottom;
}

.team-box .team-assist .member::after,
.team-box .team-assist .member::before
{
	width: var(--head-block-width);
	text-align: center;
	font-size: 18px;
	font-weight: bold;
	position: relative;
}
/*平时的显示*/
.team-box .team-assist .member::after
{
	display: inline-block;
}
.team-box .team-assist .member::before
{
	display: none;
}
/*反向时的显示*/
.reverse-member-assist .team-assist .member::after
{
	display: none;
}
.reverse-member-assist .team-assist .member::before
{
	display: inline-block;
}

.formation-box .formation-total-info,
.formation-box .team-total-info
{
	font-size: 15px;
	vertical-align: bottom;
}
.formation-box .team-badge .team-total-info
{
	display: inline-block;
}
/*
.team-info .tIf-total-hp,.team-info .tIf-total-rcv{
	display:inline-block;
}
*/
/*队伍的潜觉*/
.team-latents .latents{
	width: var(--head-block-width);
	display: inline-block;
	vertical-align: top;
}
.team-latents .latent-ul{
	font-size: 0;
	width: 152px;
	transform: scale(0.65);
	transform-origin: left top;
	margin-left: 5px;
	margin-bottom: calc(-64px * (1 - 0.65) + 1px);
	/*margin: calc(-64px * (1 - 0.63) / 2 + 3px) calc((108px - 152px) / 2);*/
	/*-152 * (1 - 0.63) + 108 - 152 * 0.63，化简为108 - 152*/
	min-height: 47px; /* 为了防止只有一层6格大潜觉的时候，被缩减太多的问题*/
}

.team-latents .latent-icon
{
	margin-top: 3px;
	margin-left: 3px;
	margin-right: 3px;
}
.team-latents .latent-icon[data-latent-icon='12'],
.team-latents .latent-icon[data-latent-icon='13'],
.team-latents .latent-icon[data-latent-icon='14'],
.team-latents .latent-icon[data-latent-icon='15'],
.team-latents .latent-icon[data-latent-icon='16'],
.team-latents .latent-icon[data-latent-icon='17'],
.team-latents .latent-icon[data-latent-icon='18'],
.team-latents .latent-icon[data-latent-icon='19'],
.team-latents .latent-icon[data-latent-icon='20'],
.team-latents .latent-icon[data-latent-icon='21'],
.team-latents .latent-icon[data-latent-icon='22'],
.team-latents .latent-icon[data-latent-icon='23'],
.team-latents .latent-icon[data-latent-icon='24'],
.team-latents .latent-icon[data-latent-icon='25'],
.team-latents .latent-icon[data-latent-icon='26'],
.team-latents .latent-icon[data-latent-icon='27'],
.team-latents .latent-icon[data-latent-icon='28'],
.team-latents .latent-icon[data-latent-icon='29'],
.team-latents .latent-icon[data-latent-icon='30'],
.team-latents .latent-icon[data-latent-icon='31'],
.team-latents .latent-icon[data-latent-icon='32'],
.team-latents .latent-icon[data-latent-icon='33'],
.team-latents .latent-icon[data-latent-icon='34'],
.team-latents .latent-icon[data-latent-icon='35'],
.team-latents .latent-icon[data-latent-icon='36'],
.team-latents .latent-icon[data-latent-icon='37'],
.team-latents .latent-icon[data-latent-icon='38'],
.team-latents .latent-icon[data-latent-icon='39']
{
	margin-left: 0;
	margin-right: 0;
}
.team-latents .latent-ul .latent-icon[data-latent-icon='13']::before,
.team-latents .latent-ul .latent-icon[data-latent-icon='14']::before,
.team-latents .latent-ul .latent-icon[data-latent-icon='15']::before,
.team-latents .latent-ul .latent-icon[data-latent-icon='37']::before,
.team-latents .latent-ul .latent-icon[data-latent-icon='38']::before
{ /*6格的潜觉*/
	width: 152px;
	margin-left: -50px;
	margin-right: 47px;
}
.team-latents .latent-ul .latent-icon[data-latent-icon='13'],
.team-latents .latent-ul .latent-icon[data-latent-icon='14'],
.team-latents .latent-ul .latent-icon[data-latent-icon='15'],
.team-latents .latent-ul .latent-icon[data-latent-icon='37'],
.team-latents .latent-ul .latent-icon[data-latent-icon='38']
{
	border-radius: 5px 5px 5px 0;
	box-shadow: black 1px 1px 1px;
}
.team-latents .latent-icon[data-latent-icon='13']+.latent-icon,
.team-latents .latent-icon[data-latent-icon='14']+.latent-icon,
.team-latents .latent-icon[data-latent-icon='15']+.latent-icon,
.team-latents .latent-icon[data-latent-icon='37']+.latent-icon,
.team-latents .latent-icon[data-latent-icon='38']+.latent-icon
{
	width: 76px;
	margin-left: 0;
	margin-right: 0;
	display: inline-block !important;
	background: linear-gradient(#2277EE , #1155AA  80%);
	border-color: #CCEEFF;
	box-shadow: black 1px 1px 1px;
	border-radius: 0 0 5px 5px;
    border-top: none;
    margin-top: 4px;;
    transform: translatey(-4px) scaley(1.2);
}
.team-latents .latent-icon[data-latent-icon='13']+.latent-icon::before,
.team-latents .latent-icon[data-latent-icon='14']+.latent-icon::before,
.team-latents .latent-icon[data-latent-icon='15']+.latent-icon::before,
.team-latents .latent-icon[data-latent-icon='37']+.latent-icon::before,
.team-latents .latent-icon[data-latent-icon='38']+.latent-icon::before
{
	background: none;
}
/*队长的边框*/
.team-box .team-members .team-leader .monster{
	border-radius: 10px;
	border-width:4px;
	border-style:solid;
	box-sizing: initial;
	margin: 0;
}
.team-1 .team-members .team-leader .monster{
	border-color: var(--team-1-color);
}
.team-2 .team-members .team-leader .monster{
	border-color: var(--team-2-color);
}
.team-3 .team-members .team-leader .monster{
	border-color: var(--team-3-color);
}

/*三维计算值*/
.team-ability::after,
.team-ability::before,
.team-ability .abilitys
{
	padding-left: 5px;
	box-sizing: border-box;
	font-size: 15px;
	width: var(--head-block-width);
}
.team-ability .abilitys
{
	display: inline-block;
}
.team-ability::after,
.team-ability::before
{
	display: none;
	content: "";
}
.show-team-name-left .team-ability::before{
	display: inline-block;
}
.show-team-name-right .team-ability::after{
	display: inline-block;
}
.abilitys .hp::before,
.abilitys .atk::before,
.abilitys .rcv::before
{
	width: 45px;
	display: inline-block;
}
/*.abilitys .hp::before{
	content: "HP：";
}
.abilitys .atk::before{
	content: "攻击：";
}
.abilitys .rcv::before{
	content: "回复：";
}*/


/*编辑窗口*/
.blur-bg{
	filter:blur(5px);
	pointer-events: none;
}
.guide-mod .blur-bg{
	filter: unset;
}

.edit-box{
	background-color: rgba(82, 53, 30, 0.8);
	color: white;
	position: absolute;
	left:0;
	top:0;
	width:100%;
	box-sizing: border-box;
	min-width:664px;
}
.guide-mod .edit-box{
	background-color: rgb(102, 73, 50);
	padding-bottom: 10px;
}
.edit-box-title{
	text-align: center;
	font-size: 2em;
	font-weight: bold;
}
.guide-mod .edit-box-title,
.guide-mod .button-box
{
	display: none;
}

/*.edit-box .edit-box-title::before{
	content: "修改队员";
}
.edit-box .edit-box-title.edit-box-title-assist::before{
	content: "修改辅助";
}*/
.edit-box .monsterinfo-box{
	font-family: var(--game-font-family);
	color: white;
	text-shadow: black 2px 2px 0;
	min-height: 100px;
	margin: 5px 0;
	background-image: linear-gradient(#798421,#394914);
	border-top: #B1BB39 solid 4px;
	border-bottom: #72941D ridge 7px;
	box-shadow: black 0 3px 3px;
	padding: 5px 10px;
}
.edit-box .search-box,
.edit-box .setting-box{
	padding: 0 10px;
}
/*.edit-box .setting-box .row-mon-id::before{
	content: "▼怪物ID";
}*/
.edit-box .setting-box .row-mon-id .m-id{
	box-sizing: border-box;
	font-size: 25px;
	height: 40px;
	width: 100%;
}
.edit-box .setting-box .row-mon-id .unable-monster{
	pointer-events: none;
	opacity: 0.5;
}
.edit-box .setting-box .row-mon-id .unable-monster .monster{
	box-sizing: border-box;
	border: 5px solid red;
	border-radius: 10px;
	overflow: hidden;
}
.edit-box .setting-box .row-mon-id .unable-monster .id{
	display: none;
}
.edit-box .setting-box .row-mon-id .search-button{
	width: 100%;
	height: 40px;
	font-size: 25px;
}
.edit-box .setting-box .row-mon-id .evo-card-list li,
.edit-box .search-box .search-mon-list li
{
	display: inline-block;
	vertical-align: top;
	margin: 2px;
}
.detail-mon{
	display: inline-block;
	vertical-align: bottom;
}
.edit-box .setting-box .row-mon-id .evo-card-list .monster,
.edit-box .search-box .search-mon-list .monster,
.detail-mon .monster
{
	float: none;
	transform: scale(0.75);
	margin: calc(-100px * (1 - 0.75) / 2);
}
.edit-box .setting-box .row-mon-id .evo-card-list .monster .id,
.edit-box .search-box .search-mon-list .monster .id,
.detail-mon .monster .id{
	bottom: 5px;
	font-size: 20px;
}

.detail-box .detail-mon{
	width: 50px;
	height: 50px;
}
.detail-box .detail-mon .monster{
	transform: scale(0.5);
	margin: calc(-100px * (1 - 0.5) / 2);
}
.detail-box .detail-mon .monster .id{
	font-weight: bold;
	font-size: 23px;
}
.detail-box .detail-mon .monster .id::before {
    font-size: 15px;
}

/*搜索结果显示觉醒列表的相关css*/
.awoken-preview .awoken-ul{
	width: 75px;
}
.awoken-preview .awoken-preview-superAwakenings{
	margin-top:3px;
	background-color: #432;
}
.awoken-preview .awoken-preview-superAwakenings .awoken-icon{
	opacity: 0.6;
}
.awoken-preview .awoken-ul li{
	margin: 0.5px !important;
}
.awoken-preview .awoken-icon{
    filter: unset;
		transform: scale(0.75);
		margin: calc(-32px * (1 - 0.75) / 2);
}

/*.setting-box .row-mon-id .open-search::before{
	content: "搜索怪物";
}
.search-box::before{
	content: "▼简易搜索";
}
.attrs .attr-all::before{
	content: "不限";
}
.attrs .attr-none::before{
	content: "无";
}*/
.search-box::before{
	font-weight: bold;
	font-size: 1.2em;
}
.search-box>div{
	margin-bottom: 5px;
}
.search-box>div ul{
	display: inline-block;
}
.search-box .attrs ul{
	display: block;
}
.search-box>div ul>li{
	display: inline-block;
	vertical-align: top;
	font-size:16px;
	overflow: hidden;
}
.search-box>div ul>li>label{
	cursor: pointer;
	display: block;
	text-align: center;
}

.attrs .attr-list-1::before,
.attrs .attr-list-2::before,
.types-div::before,
.awoken-div::before,
.sawoken-div::before{
	/*float: left;*/
	font-size: 16px;
	/*width: 55px;*/
	margin-right: 3px;
	display: inline-block;
}
/*.search-box .attrs .attr-list-1::before{
	content: "属性1";
}
.search-box .attrs .attr-list-2::before{
	content: "属性2";
}
.search-box .attrs .fix-main-color-label::after{
	content: "限制属性1为主属性，属性2为副属性";
}*/
.attr-radio,.type-check,.sawoken-check{
	display: none;
}
.attrs .attr-list{
	font-size:0;
}
.attrs .attr-list li{
	border: 1px solid white;
	border-left: none;
	background: #947244;
}
.attrs .attr-list li:hover{
	background: #E9CB9E;
}
.attrs .attr-list li:first-of-type{
	border-radius: 8px 0 0 8px;
	border-left: 1px solid white;
}
.attrs .attr-list li:last-of-type{
	border-radius: 0 8px 8px 0;
}
.attrs .attr-list li label{
	line-height: 30px;
	width: 55px;
	height: 30px;
}
.attrs .attr-list input:checked+label{
	background-color:#8C4242;
	box-shadow: inset black 0 0 5px;
	cursor: auto;
}
.attr-list-1{
	margin-bottom: 5px;
}
/*.search-box .types-div::before{
	content: "类型";
}*/
.types-div .type-list li label{
	opacity: var(--search-icon-unchecked);
}
.types-div .type-list input:checked~label{
	opacity: 1;
}
.types-div .type-and-or-label{
	margin-left: 10px;
	margin-right: 0;
}
.types-div .type-list li
{
	position: relative;
}
.types-div .type-list li:after
{
	content: "⚔️";
	font-size: 10px;
	position: absolute;
	right: 0;
	bottom: 0;
	display: none;
	pointer-events:none;
}
.types-div .type-list.type-killer-5 li[data-type-icon="7"]:after,
.types-div .type-list.type-killer-4 li[data-type-icon="8"]:after,
.types-div .type-list.type-killer-4 li[data-type-icon="3"]:after,
.types-div .type-list.type-killer-7 li[data-type-icon="5"]:after,
.types-div .type-list.type-killer-8 li[data-type-icon="5"]:after,
.types-div .type-list.type-killer-8 li[data-type-icon="1"]:after,
.types-div .type-list.type-killer-1 li[data-type-icon="5"]:after,
.types-div .type-list.type-killer-1 li[data-type-icon="4"]:after,
.types-div .type-list.type-killer-1 li[data-type-icon="7"]:after,
.types-div .type-list.type-killer-1 li[data-type-icon="8"]:after,
.types-div .type-list.type-killer-1 li[data-type-icon="1"]:after,
.types-div .type-list.type-killer-1 li[data-type-icon="6"]:after,
.types-div .type-list.type-killer-1 li[data-type-icon="2"]:after,
.types-div .type-list.type-killer-1 li[data-type-icon="3"]:after,
.types-div .type-list.type-killer-6 li[data-type-icon="7"]:after,
.types-div .type-list.type-killer-6 li[data-type-icon="2"]:after,
.types-div .type-list.type-killer-2 li[data-type-icon="8"]:after,
.types-div .type-list.type-killer-2 li[data-type-icon="3"]:after,
.types-div .type-list.type-killer-3 li[data-type-icon="4"]:after,
.types-div .type-list.type-killer-3 li[data-type-icon="6"]:after
{
	display: block;
}
.types-div .latent-list .latent-icon
{
    cursor: pointer;
    box-shadow: none;
}
.types-div .latent-list .latent-icon:before
{
    margin-left: -23px;
    margin-right: -25px;
    margin-top: -3px;
    margin-bottom: -5px;
}
/*.search-box .awoken-div::before{
	content: "觉醒";
}*/
.search-box .awoken-div .awoken-clear::before,
.search-box .sawoken-div .sawoken-clear::before
{
	content: "❌";
}
.search-box .awoken-div .awoken-clear,
.search-box .sawoken-div .sawoken-clear
{
	padding: 0;
	float: right;
}
.awoken-ul .awoken-count
{
	font-size: 16px;
	line-height: 32px;
	font-family: var(--game-font-family);

	display: inline-block;
	margin-right: 3px;
}
.awoken-ul .count
{
	height: 32px;
	width: 37px;
	display: inline-block;
	vertical-align: middle;
}
.awoken-ul .count::before,
.search-box .awoken-div .count-symbol::before
{
	content: "×";
}
.search-box .awoken-ul button,
.search-box .awoken-ul input[type='button']
{
	border: none;
	background-color: unset;
	font-family: var(--game-font-family);
	color: white;
	line-height: 32px;
	font-size: 16px;
	padding: 0;
	text-align: left;
}
.search-box .awoken-ul .awoken-count.zero{
	opacity: var(--search-icon-unchecked);
}
.search-box .awoken-ul .count{
	width: 1em;
	height: auto;
}
.search-box .awoken-ul .awoken-count .awoken-icon,
.search-box .awoken-ul .awoken-count .count-symbol,
.search-box .awoken-ul .awoken-count .count-symbol .count
{
	cursor: pointer;
	display: inline-block;
	vertical-align: bottom;
}
.search-box .awoken-ul .awoken-count.zero .count-symbol,
.search-box .awoken-ul .awoken-count.zero .count-symbol .count
{
	cursor: auto;
}
/*.search-box .sawoken-div::before{
	content: "超觉醒";
}*/
.sawoken-div .sawoken-ul li label{
	opacity: var(--search-icon-unchecked);
}
.sawoken-div .sawoken-ul input:checked+label{
	opacity: 1;
}

.control-div button{
	font-size: 20px;
}
.control-div .search-start{
	float: right;
	margin-left: 5px;
}
/*.control-div .search-start::before{
	content: "开始搜索";
}
.control-div .search-clear::before{
	content: "清空搜索条件";
}
.control-div .search-close::before{
	content: "关闭搜索";
}*/

.search-box .search-mon-list{
	border: 1px solid white;
	border-radius: 5px;
	background: grey;
}
.guide-mod .search-box .search-mon-list{
	max-height: 790px;
	overflow: auto;
}
.search-mon-list.only-display-can-assist .monster,
.search-mon-list.only-display-can-assist .awoken-preview
{
	opacity: 0.25;
}
.search-mon-list.only-display-can-assist .monster.allowable-assist,
.search-mon-list.only-display-can-assist .allowable-assist+.awoken-preview
{
	opacity: 1;
}
.setting-box .row-mon-id .open-search{
	float: right;
}
.can-assist-label,
.sort-reverse-label
{
	margin-left: 5px;
}

.edit-box .setting-row{
	width: 100%;
}
.monsterinfo-box .monster-head{
	float: left;
	margin-right:5px;
}
.monsterinfo-box .monsterinfo-line>div
{
	display:inline-block;
	vertical-align: top;
	font-size: 22px;
	line-height: 22px;
}
.monsterinfo-box .monster-id{
	width:120px;
}
.monsterinfo-box .monster-seriesId,
.monsterinfo-box .monster-collabId,
.monsterinfo-box .monster-altName
{
	cursor: pointer;
	font-size: 14px;
	line-height: 16px;
	vertical-align: bottom;
	max-width: 270px;
	white-space:nowrap;
	text-overflow:ellipsis;
	overflow:hidden;
}
.monsterinfo-box .monster-seriesId:hover::after,
.monsterinfo-box .monster-collabId:hover::after,
.monsterinfo-box .monster-altName:hover::after
{
	content: "🔍";
}
/*.monsterinfo-box .monster-id::before{
	content: "No.";
}*/

.monsterinfo-box .monster-rare{
	width: 260px;
}
.monsterinfo-box .monster-rare::before,
.monsterinfo-box .monster-rare::after
{
	color:gold;
	text-shadow: black 0 0 3px,black 0 2px 3px;
}
.monsterinfo-box .monster-rare::before
{
	display: inline-block;
	width: 30px;
	text-align: right;
}
.monster-rare[data-rarity='1']::after{content: "★";}
.monster-rare[data-rarity='2']::after{content: "★★";}
.monster-rare[data-rarity='3']::after{content: "★★★";}
.monster-rare[data-rarity='4']::after{content: "★★★★";}
.monster-rare[data-rarity='5']::after{content: "★★★★★";}
.monster-rare[data-rarity='6']::after{content: "★★★★★★";}
.monster-rare[data-rarity='7']::after{content: "★★★★★★★";}
.monster-rare[data-rarity='8']::after{content: "★★★★★★★★";}
.monster-rare[data-rarity='9']::after{content: "★★★★★★★★★";}
.monster-rare[data-rarity='10']::after{content: "★★★★★★★★★★";}
.monster-rare[data-rarity='1']::before{content: "1";}
.monster-rare[data-rarity='2']::before{content: "2";}
.monster-rare[data-rarity='3']::before{content: "3";}
.monster-rare[data-rarity='4']::before{content: "4";}
.monster-rare[data-rarity='5']::before{content: "5";}
.monster-rare[data-rarity='6']::before{content: "6";}
.monster-rare[data-rarity='7']::before{content: "7";}
.monster-rare[data-rarity='8']::before{content: "8";}
.monster-rare[data-rarity='9']::before{content: "9";}
.monster-rare[data-rarity='10']::before{content: "10";}

.monsterinfo-box .monster-mp::before
{
	content: " ";
	background-image: url(images/icon-MP.png);
	background-size: cover;
	display: inline-block;
	width: 24px;
	height: 24px;
	vertical-align: top;
}

.monsterinfo-box .monster-type {
	display: inline;
}
.monsterinfo-box .monster-type .type-name{
	display:inline-block;
	margin-right: 10px;
}
.monsterinfo-box .monster-type .type-icon{
	margin-right:3px;
}
.monsterinfo-box .monster-type .type-name::after{
	vertical-align: middle;
	font-size: 22px;
	line-height: 22px;
}

/*
.edit-box .setting-box .row-mon-awoken::before{
	content: "▼怪物觉醒";
}
*/
.row-mon-awoken{
	margin-right: 20px;
}
.row-mon-awoken .awoken-ul, .row-mon-super-awoken .awoken-ul{
	font-size: 0;
	height: 32px;
}
.edit-box .awoken-ul .awoken-icon,
.edit-box .awoken-count
{
	cursor: pointer;
}
.row-mon-awoken .awoken-count.full-awoken{
	font-size: 0;
}
.row-mon-awoken .awoken-count,
.row-mon-awoken .awoken-count.full-awoken::before
{
	font-size: 22px;
	line-height: 28px;
}
.row-mon-awoken .awoken-count{
	transform: scale(0.84) translateY(-2px);
}
.row-mon-awoken .awoken-count,
.row-mon-awoken .awoken-icon
{
	vertical-align: top;
}


/*选中的觉醒后面部分半透明，前面的不透明*/
.row-mon-awoken .awoken-number{display:none;}
.row-mon-awoken .awoken-number:checked~label
{
	opacity: var(--search-icon-unchecked);
}

/*.edit-box .setting-box .row-mon-super-awoken::before{
	content: "▼超觉醒";
}*/

.row-mon-awoken,
.row-mon-super-awoken
{
	display: inline-block;
	box-sizing: border-box;
	vertical-align: top;
}
.row-mon-awoken .awoken-icon,
.row-mon-super-awoken .awoken-icon
{
	margin-right: 5px;
}
.row-mon-awoken .awoken-icon:last-of-type,
.row-mon-super-awoken .awoken-icon:last-of-type
{
	margin-left: unset;
}
/*未选中的超觉醒半透明，选中的不透明*/
.row-mon-super-awoken .sawoken-choice{display:none;}
.row-mon-super-awoken .sawoken-choice+label
{
	opacity: var(--search-icon-unchecked);
}
.row-mon-super-awoken .sawoken-choice:checked+label
{
	opacity: unset;
}
/*怪物能力横条*/
/*.row-ability{
	border-color: #D5AF5B;
	border-style: solid;
	border-width: var(--border-width);
	border-radius: 8px;
	background-color: #B68E4A;
	background-image: radial-gradient(ellipse at top,#B68E4A, #60492C);
}*/

/*.edit-box .setting-box .row-mon-ability::before{
	content: "▼怪物能力";
}*/
.row-mon-ability ul{
	margin-top: var(--border-width);
}
.row-mon-ability ul li::before{
	width: 55px;
	display: inline-block;
}
.row-mon-ability .ability-value{
	width: 85px;
	display: inline-block;
	text-align: right;
}

.edit-box .setting-box .row-mon-plus::before{
	/*content: "▼怪物加值";*/
	display:block;
}

.row-mon-ability ul,
.row-mon-plus ul,
.row-mon-level .level-value,
.row-mon-level .monster-cost
{
	font-family: var(--game-font-family );
	font-size: 22px;
	line-height: 35px;
	text-shadow: black 2px 2px 0;
}
.row-mon-level .monster-cost
{
	background-color: #2F2B28;
	border: solid 3px #563E22;
	border-radius: 12px;
	padding: 0 5px;
	font-size: 0.8em;
	box-shadow: inset 0 3px 3px black;
}
.row-mon-plus .plus-box{
	border-color: #A07740;
	border-style: solid;
	border-width: var(--border-width);
	border-radius: 8px;
	background-color: #44392C;
	box-shadow: inset black 0 3px 5px;
	white-space: nowrap; /*避免纵向297跑到下一行*/
}
.row-mon-plus li{
	height: 35px;
	padding: 0 5px;
}
/*.m-plus-hp-li::before{content: "HP";}
.m-plus-atk-li::before{content: "攻击";}
.m-plus-rcv-li::before{content: "回复";}*/
.row-mon-plus .plus-value{
	color: yellow;
}
.row-mon-plus .plus-value::before{content: "(+";}
.row-mon-plus .plus-value::after{content: ")";}

.row-mon-plus .plus-value input
{
	color: inherit;
	font-family: inherit;
	font-size: inherit;
	text-shadow: inherit;
	box-sizing: border-box;
	width: 2em;
	line-height: 30px;
	height: 30px;
	padding: 0;
	-moz-appearance: textfield; /*火狐去掉数字加减*/
}
 /*webkit去掉数字加减*/
.row-mon-plus .plus-value input::-webkit-outer-spin-button,
.row-mon-plus .plus-value input::-webkit-inner-spin-button{
    -webkit-appearance: none !important;
    margin: 0;
}
.row-mon-plus .m-plus-btn::before,
.row-mon-plus .m-plus-btn-297 span::before
{
	content: "+";
}
.row-mon-plus .m-plus-btn
{
	padding: 0 3px;
	box-sizing: border-box;
	font-size: inherit;
	line-height: 20px;;
	height: 30px;
}
.m-plus-btn-297{
	padding: 0;
	box-sizing: border-box;
	height: 105px;
	font-size: 22px;
	writing-mode: vertical-lr;
	min-width: 32px; /*先给297一个默认宽度*/
}
.m-plus-btn-297 span{
	/*Chrome浏览器不支持按钮本身的纵向，只能加一层*/
	-webkit-writing-mode: vertical-lr;
}
.row-mon-plus .plus-box ul,
.m-plus-btn-297
{
	display: inline-block;
	vertical-align: top;
}
/*.edit-box .setting-box .row-mon-level::before{
	content: "▼怪物等级";
}*/
.row-mon-level
{
	margin-left: 10px;
}

.row-mon-level .subrow
{
	font-family: var(--game-font-family );
	font-size: 22px;
	line-height: 35px;
}
/*.row-mon-level .level-value::before{
	content: "Lv.";
}*/
.edit-box .setting-box .m-level
{
	color: inherit;
	font-family: inherit;
	font-size: inherit;
	text-shadow: inherit;
	box-sizing: border-box;
	line-height: inherit;
	width: 100px;
	height: 40px;
}
.m-level-btn-min,
.m-level-btn-max,
.m-level-btn-110
{
	box-sizing: border-box;
	font-size: 18px;
	padding: 0 3px;
}
.m-level-btn-110
{
	color: blue;
}
/*
.m-level-exp::before{
	content: "需要经验：";
}
.m-level-btn-max::before{
	content: "最高Lv";
}
*/

.row-mon-ability,
.row-mon-plus,
.row-mon-level
{
	display: inline-block;
	box-sizing: border-box;
	vertical-align: top;
}
.m-level,
.m-plus-hp,.m-plus-atk,.m-plus-rcv,
.m-skill-level
{
	border: 1px solid grey;
	background: none;
}
/*.edit-box .setting-box .row-mon-latent::before{
	content: "▼潜在觉醒";
}*/
.m-latent-ul-div{
	text-align: center;
}
.m-latent-ul{
	font-size: 0;
	display: inline-block;
	background: rgba(88,75,56,154);
	border: 2px ridge #94733f;
	border-radius: 7px;
	padding: 2px;
}
.guide-mod .m-latent-ul-div,
.guide-mod .m-latent-allowable-ul
{
	display: inline-block;
}
.m-latent-ul .latent-icon{
	margin-left: 12px;
}
.m-latent-ul .latent-icon:first-of-type{
	margin-left: 0;
}
.m-latent-allowable-ul{
	margin-top: 5px;
	font-size: 0;
}
.m-latent-allowable-ul .latent-icon{
	margin-right: 4px;
	margin-bottom: 4px;
}
.m-latent-allowable-ul .latent-icon:last-of-type{
	margin-right: unset;
}
.m-latent-allowable-ul.hide-less-use-latent .latent-icon{
	display: none;
}
.m-latent-allowable-ul.hide-less-use-latent .latent-icon[data-latent-icon="11"],
.m-latent-allowable-ul.hide-less-use-latent .latent-icon[data-latent-icon="20"],
.m-latent-allowable-ul.hide-less-use-latent .latent-icon[data-latent-icon="21"],
.m-latent-allowable-ul.hide-less-use-latent .latent-icon[data-latent-icon="22"],
.m-latent-allowable-ul.hide-less-use-latent .latent-icon[data-latent-icon="23"],
.m-latent-allowable-ul.hide-less-use-latent .latent-icon[data-latent-icon="24"],
.m-latent-allowable-ul.hide-less-use-latent .latent-icon[data-latent-icon="25"],
.m-latent-allowable-ul.hide-less-use-latent .latent-icon[data-latent-icon="26"],
.m-latent-allowable-ul.hide-less-use-latent .latent-icon[data-latent-icon="27"]
{
	display: inline-block;
}
.guide-mod .m-latent-allowable-ul.hide-less-use-latent .latent-icon[data-latent-icon="11"]{
	display: none;
}
.hide-less-use-latent-label{
	margin-left: 5px;
}
/*没有打觉醒的空格，没有手指*/
.m-latent-ul .latent-icon{
	cursor: default;
}
.m-latent-allowable-ul .latent-icon,
.m-latent-ul .latent-icon[data-latent-icon]{
	cursor: pointer;
}
/*不允许使用的潜觉，不是手指，半透明，灰度*/
.m-latent-allowable-ul .latent-icon.unallowable-latent{
	cursor: default;
	opacity: var(--search-icon-unchecked);
	filter: grayscale(100%);
}

.edit-box .setting-box .row-mon-skill
{
	margin-bottom:5px;
}
/*.edit-box .setting-box .row-mon-skill,
.edit-box .setting-box .row-mon-leader-skill
{
	margin-top:5px;
}*/
/*.skill-box .skill-cd::before{
	content: "冷却回合：";
}
.skill-box .skill-level-label::before{
	content: "Lv";
}
.skill-box .m-skill-lv-1::before{
	content: "Lv";
}
.skill-box .m-skill-lv-max::before{
	content: "最高Lv";
}*/
.skill-box{
	font-family: var(--game-font-family);
	font-size: 16px;
	border: #9C743E solid 2px;
	border-radius: 10px;
	background-color: #B1AAA0;
	overflow: hidden;
	box-shadow: inset black 0 0 5px;
}
.row-mon-leader-skill .skill-box{
	background-color: #D0CD81;
}
.skill-box .m-skill-level {
	height: 30px;
	width: 3em;
	line-height: 25px;
	box-sizing: border-box;
	font-size: inherit;
	font-family: inherit;
	color: inherit;
	text-shadow: inherit;
}
.skill-box .m-skill-lv-1,
.skill-box .m-skill-lv-max{
	padding: 0 3px;
	/*height: 30px;*/
	box-sizing: border-box;
	font-size: 18px;
}
.skill-box .skill-title{
	background-color: #39180F;
	box-shadow: inset black 0 5px 5px;
	padding: 0 10px 0 2px;
	text-shadow:black 3px 3px 0;
}

.skill-title .type-title{
	background-color: #774433;
	border: #BBAA55 solid 2px;
	border-radius: 8px;
	margin-right: 5px;
	padding: 0 5px;
	line-height: 24px;
	display: inline-block;
	position: relative;
}

.skill-title .type-title::after{
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	text-shadow: none;
	position: absolute;
	left: 5px;
}

.skill-title .type-title::before{
	text-shadow: none;
	-webkit-text-stroke: 3px black;
	text-stroke: 3px black;
}
/*.row-mon-skill .type-title::before,
.row-mon-skill .type-title::after
{
	content: "主動技能";
}*/
.row-mon-skill .type-title::after
{
	background-image: linear-gradient(white 25%, #3377AA 80%);
}

/*.row-mon-leader-skill .type-title::before,
.row-mon-leader-skill .type-title::after
{
	content: "隊長技能";
}*/
.row-mon-leader-skill .type-title::after
{
	background-image: linear-gradient(#FFFF99 25%, #EE7744 80%);
}


.row-mon-skill .skill-title .skill-name{
	color: #84BAFC;
	cursor: pointer;
}
.row-mon-skill .skill-title .skill-name:hover::after{
	content: "🔍";
}
.row-mon-leader-skill .skill-title .skill-name{
	color: #85FD80;
}
.skill-box .skill-cd-control{
	float: right;
}
.skill-box .skill-cd{
	margin-left: 10px;
}
.skill-datail{
	color: black;
	padding: 0 8px 6px 8px;
	line-height: 25px;
}
.skill-datail .spColor{
	color: #ff3600;
}
.skill-datail .detail-search{
	cursor: pointer;
	color: blue;
}
.skill-datail .detail-search::before{
	content: "🔍";
}
.skill-datail .random-active-skill{
	padding-left: 1em;
}
.skill-datail .random-active-skill>.active-skill-li{
	list-style: decimal;
}

.edit-box .button-box{
	border-top: black solid 3px;
	background-color: rgba(0,0,0,0.5);
	margin-top: 10px;
	padding: 5px;
	height: 50px;
}
.edit-box .button-box .button-null,
.edit-box .button-box .button-delay,
.edit-box .button-box .button-cancel,
.edit-box .button-box .button-done{
	height: 50px;
	box-sizing: border-box;
	font-size: 25px;
	font-weight: bold;
}
.edit-box .button-box .button-null,
.edit-box .button-box .button-delay{
	float: left;
	margin-right:5px;
}
.edit-box .button-box .button-cancel,
.edit-box .button-box .button-done{
	float: right;
	margin-left:5px;
}
/*.edit-box .button-box .button-null::after{
	content: "留空格子";
}
.edit-box .button-box .button-delay::after{
	content: "应对威吓";
}
.edit-box .button-box .button-cancel::after{
	content: "取消修改";
}
.edit-box .button-box .button-done::after{
	content: "确认修改";
}
.edit-box .button-box .button-done.cant-assist::after{
	content: "不能辅助";
}*/
.formation-awoken::before,
.team-awoken::before
{
	font-size: 20px;
	margin-top:5px;
	/*content: "觉醒总计：";*/
}
.detail-box{
	margin-top:5px;
}
/*控制框*/
.control-box{
	margin-bottom: 10px;
}
.control-box .languages-label::before{
	content: "Lanuage:";
}

.control-box .solo-link::before{
	content: "Jump To Solo Version";
}
.control-box .multi-link::before{
	content: "Jump To 2-Player Version";
}
/*.control-box .btn-show-mon-id::before{
	content: "隐藏怪物ID";
}
.not-show-mon-id .control-box .btn-show-mon-skill-cd::before{
	content: "显示怪物ID";
}
.show-mon-skill-cd .control-box .btn-show-mon-skill-cd::before{
	content: "⬜隐藏已满技能CD";
}
.control-box .btn-show-mon-skill-cd::before{
	content: "❄️显示已满技能CD";
}
*/
#interchange-line{
	pointer-events: none;
	position: absolute;
	left: 0;
	top: 0;
}
#interchange-line g line {
	fill: none;
	stroke: blue;
	stroke-linecap: round;
	stroke-width: 5;
	stroke-dasharray: 10;
}