PADDashFormation/style.css

@charset "utf-8";
.display-none{
	display:none;
}
.title{
	border: none;
	background: none;
	font-size: 2em;
	font-weight: bold;
}
ul{
	margin: 0;
	padding: 0;
	list-style: none;
}
/*队伍的整个盒子*/
.formation-box{
	width: 648px;
	background: rgb(119, 167, 255);
}
/*辅助行*/
.formation-assist{
}
/*队伍行*/
.formation-team{
}
/*单个怪物*/
.monster{
	width: 100px;
	height: 100px;
	margin: 0;
	display: block;
	float: left;
	background-image: url(images/001.png);
	background-repeat: no-repeat;
	position: relative;
}
/*怪物属性*/
.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; /*默认都不显示*/
}
/*怪物-加值*/
.monster .addition{
	color: yellow;
	font-size: 20px;
	line-height: 20px;
	font-weight: bold;
	text-shadow: black 0 0 1px, black 2px 2px 0;
	position: absolute;
	left:0;
}
.monster .addition .hp::before,
.monster .addition .atk::before,
.monster .addition .rcv::before,
.monster .addition ._297::before{
	content: "+";
}
.monster .addition ._297{ /*297默认不显示*/
	display:none;
}
.monster .addition.has297 .hp,
.monster .addition.has297 .atk,
.monster .addition.has297 .rcv{ /*当是297时隐藏3维*/
	display:none;
}
.monster .addition.has297 ._297{ /*当是297时显示297*/
	display:block;
}
/*怪物-觉醒*/
.monster .awoken-count{
	color: yellow;
	font-size: 18px;
	line-height: 24px;
	font-weight: bold;
	text-shadow: black 0 0 4px;
	text-align: center;
	background-image: url(images/awoken-bg.png);
	background-size: 27px 30px;
	width: 27px;
	height: 30px;
	position: absolute;
	right: 0;
}
/*怪物-等级*/
.monster .level{
	color: white;
	font-size: 18px;
	text-shadow: black 2px 2px 0;
	position: absolute;
	left: 5px;
	bottom: 0;
}
.monster .level::before{
	content: "Lv";
}
/*辅助和队伍的每一只框架*/
.assist, .team, .acquisitus-awoken-icon {
	display: block;
	float: left;
	position: relative;
	width: 108px;
}
.formation-box .monster{
	margin: 4px; /*留给队长边框的*/
}
/*
.assist:first-of-type, .team:first-of-type {
	margin-left: 0px;
}
*/
/*队伍的背景色*/
.formation-assist, .formation-team{
	display: inline-block;
}
.formation-A-box .formation-team{
	background-color:pink;
}
.formation-B-box .formation-team{
	background-color:lightblue;
}
.formation-A-bigbox, .formation-B-bigbox{
	position: relative;
	font-size:0;
}
.formation-B-bigbox{
	margin-top:15px;
}
/*队伍A、B的文字*/
.formation-A-bigbox::after, .formation-B-bigbox::before{
	font-size: 30px;
	font-weight: bold;
	text-align: center;
	line-height: 50px;
	white-space: pre-wrap;
	display: inline-block;
	width: 108px;
	height: 108px;
}
.formation-A-bigbox::after{
	color:red;
	background-color:pink;
	content: "队伍\A A";
}
.formation-B-bigbox::before{
	color:blue;
	background-color:lightblue;
	content: "队伍\A B";
	vertical-align:top;
}
.formation-A-box, .formation-B-box{
	display: inline-block;
	vertical-align:bottom;
}

.formation-A-box .assist::after, .formation-B-box .assist::before{
	text-align: center;
	font-size: 18px;
	font-weight: bold;
	display: block;
	position: relative;
}
.formation-A-box .assist::after{
	color:red;
	content: "▼辅助";
}
.formation-B-box .assist::before{
	color:blue;
	content: "▲辅助";
}

.a-awoken-icon-1 li{
	background-image: url(images/sha.png);
	background-size: 50px 21px;
	width: 50px;
	height: 21px;
	margin-right: 4px;
}
.a-awoken-icon-2 li{
	background-image: url(images/fangzuo.png);
	background-size: 21px 21px;
	width: 21px;
	height: 21px;
	margin-left: 6px;
}
.a-awoken-icon-ul li{
	float:left;
}
/*队长的边框*/
.formation-A-box .formation-team .team-leader .monster, .formation-B-box .formation-team .team-leader .monster{
	border-radius: 10px;
	border-width:4px;
	border-style:solid;
	margin: 0;
}
.formation-A-box .formation-team .team-leader .monster{
	border-color: red;
}
.formation-B-box .formation-team .team-leader .monster{
	border-color: blue;
}
/*编辑窗口*/
.blur-bg{
	filter:blur(5px);
}
.edit-box{
	background-color: rgba(200,255,200,0.8);
	text-shadow: white 0 0 2px;
	position: absolute;
	left:0;
	top:0;
	width:100%;
	padding: 10px;
	box-sizing: border-box;
	width:664px; /*测试时手机上的最大宽度*/
}
.edit-box-title{
	text-align: center;
	font-size: 2em;
	font-weight: bold;
}
.edit-box .edit-box-title::before{
	content: "修改怪物";
}
.setting-row{
	width: 100%;
}
.edit-box .search-box::before{
	content: "怪物ID";
}
.edit-box .search-box .m-id{
	box-sizing: border-box;
	font-size: 25px;
	height: 40px;
	width: 100%;
}
.edit-box .search-box .search-button{
	width: 100%;
	height: 40px;
	font-size: 25px;
}
.edit-box .monsterinfo-box{
	height: 100px;
	margin: 5px 0;
}
.monsterinfo-box .monster{
	margin-right:5px;
}
.monsterinfo-box .monster-id{
	display:inline-block;
	width:150px;
}
.monsterinfo-box .monster-id::before{
	content: "No.";
}
.monsterinfo-box .monster-rare{
	display:inline-block;
}
.monsterinfo-box .monster-rare::before{
	color:gold;
	text-shadow: black 0 0 3px;
}
.rare-1::before{content: "★";}
.rare-2::before{content: "★★";}
.rare-3::before{content: "★★★";}
.rare-4::before{content: "★★★★";}
.rare-5::before{content: "★★★★★";}
.rare-6::before{content: "★★★★★★";}
.rare-7::before{content: "★★★★★★★";}
.rare-8::before{content: "★★★★★★★★";}
.rare-9::before{content: "★★★★★★★★★";}
.rare-10::before{content: "★★★★★★★★★★";}
.monsterinfo-box .monster-id,.monsterinfo-box .monster-rare,.monsterinfo-box .monster-name{
	vertical-align: top;
	margin:0;
	height: 34px;
	font-size: 22px;
}
.monsterinfo-box .monster-type .type-name{
	display:inline-block;
}
.monsterinfo-box .monster-type .type-icon{
	margin-right:3px;
}
.monsterinfo-box .monster-type .type-name::after{
	vertical-align: middle;
	font-size: 22px;
}

.edit-box .setting-box .row-mon-level::before{
	content: "怪物等级";
	display: block;
}
.edit-box .setting-box .m-level{
	font-size: 25px;
	height: 40px;
	width: calc(100% - 150px);
	box-sizing: border-box;
}
.m-level-btn-max{
	height: 40px;
	width: 145px;
	box-sizing: border-box;
	font-size: 25px;
}
.m-level-btn-max::before{
	content: "最高Lv";
}
.edit-box .setting-box .row-mon-awoken::before{
	content: "怪物觉醒";
}
.row-mon-awoken .m-awoken-ul{
	height: 32px;
}
.m-awoken-ul .awoken-icon{
	cursor: pointer;
}
.m-awoken-ul .awoken-icon.unselected-awoken{
	opacity: 0.3;
}
.awoken-icon.awoken-count{
	color: yellow;
	font-size: 22px;
	line-height: 28px;
	font-weight: bold;
	text-shadow: black 0 0 4px;
	text-align: center;
}
.edit-box .setting-box .row-mon-addition::before{
	content: "怪物加值";
	display: block;
}
.setting-box .m-add-hp,.setting-box .m-add-atk,.setting-box .m-add-rcv{
	font-size: 25px;
	height: 40px;
	width: calc(100% - 212px);
	box-sizing: border-box;
}
.m-add-hp-li::before,.m-add-atk-li::before,.m-add-rcv-li::before{
	font-size: 25px;
	width: 55px;
	display: inline-block;
}
.m-add-hp-li::before{content: "HP";}
.m-add-atk-li::before{content: "攻击";}
.m-add-rcv-li::before{content: "回复";}
.m-add-hp-btn-99,.m-add-atk-btn-99,.m-add-rcv-btn-99{
	height: 40px;
	width: 70px;
	box-sizing: border-box;
	font-size: 25px;
}
.m-add-hp-btn-99::before,.m-add-atk-btn-99::before,.m-add-rcv-btn-99::before,.m-add-btn-297::before{
	content: "+";
}
.m-add-btn-297{
	float:right;
	width: 85px;
	height: 120px;
	box-sizing: border-box;
	font-size: 25px;
}
.edit-box .setting-box .row-mon-latent::before{
	content: "潜在觉醒";
}
.m-latent-ul{
	text-align: center;
	font-size: 0;
}
.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;
}
.m-latent-allowable-ul .latent-icon{
	cursor: pointer;
}
.m-latent-allowable-ul .latent-icon.unselected-latent{
	cursor: default;
	opacity: 0.3;
}
.latent-icon-11,
.latent-icon-13,
.latent-icon-14,
.latent-icon-15,
.latent-icon-16,
.latent-icon-17,
.latent-icon-18,
.latent-icon-19,
.latent-icon-20,
.latent-icon-21,
.latent-icon-22,
.latent-icon-23,
.latent-icon-24{
	cursor: pointer;
}

.edit-box .button-box .button-done::after{
	content: "确认修改";
}