[v-cloak] {
	display: none;
}

* {
	margin: 0;
	padding: 0;
}

a {
	text-decoration: none;
    color: #FFF
}

ul {
    list-style: none;
}

b {
    color: #cc3;
    font: 21px/32px Microsoft YaHei;
}

figcaption {
    font: 16px/24px Microsoft YaHei;
    color: #963;
    text-align: center;
}

body {
	font: 18px/30px Microsoft YaHei;
	color: white;
	background: #000 url(../images/end_bg.jpg) no-repeat center 120px;
}

body>header{
	min-width: 980px;
	height: 120px;
    margin-bottom: 24px;
	background-image: linear-gradient(to right, #392916, #624A2D, #392916);
	color: #DED169;
	border-bottom: 3px solid #B1A56A;
	display:flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
}

body>header p {
	width: 980px;
	text-align: center;
	font: 38px/56px Microsoft YaHei;
}

body>header :last-child {
	font: 18px/24px Microsoft YaHei;
}

main {
	width: 980px;
	margin: auto;
}

main>header {
    font: 56px/72px Microsoft YaHei;
}

main > header > select {
	font: 24px/48px Microsoft Yahei;
}

.odds {
    background: #1e1e19e0;
    border: 3px solid #CABA71;
    border-radius: 8px;
    padding: 16px;
    display: flex;
    margin: 24px 0 0;
    align-items: self-start;
}

.odds img {
    width: 256px;
    margin: 10px;
    border: 2px solid #CABA71;
    border-radius: 8px;
}

.odds p {
    margin: 10px;
    white-space: pre-line;
}

.odds div div {
    margin: 10px;
    border: 2px solid #ba6;
    border-radius: 5px;
    padding: 4px 24px;
    text-align: center;
    background: #642;
}

.units {
    background: #101010AA;
    border: 3px solid #CABA71;
    border-radius: 8px;
    display: flex;
    margin: 24px 0 0;
}

.units header {
    padding: 8px 24px;
    margin: 42px 24px auto 34px;
    font-weight: 800;
    border: 2px solid #CABA71;
    border-radius: 12px 0;
}

.units ul {
    display: flex;
    flex-wrap: wrap;
    margin: 12px 0;
}

.units li {
    width: 132px;
    padding: 10px;
}

.units img {
    width: 128px;
    border: 2px solid #CABA71;
    border-radius: 8px;
}

.units p,.all p{
    text-align: center;
}

.all {
	background: #101010AA;
	border: 3px solid #CABA71;
	border-radius: 8px;
    margin: 24px 0 0;
}

.all header {
	padding: 8px 24px;
    display: inline-block;
    font-weight: 800;
    border: 2px solid #CABA71;
    border-radius: 12px 0;
    margin: 20px 0 20px 42px;
}

.all ul {
    display: flex;
    flex-wrap: wrap;
    margin: 12px 31px;
}

.all li {
    width: 132px;
    min-height: 167px;
    padding: 10px;
}

.all img {
    width: 128px;
    border: 2px solid #CABA71;
    border-radius: 8px;
}

.introduce {
    margin: 24px 0 0;
    display: flex;
}

.introduce>div {
    background: #1e1e19e0;
    border: 3px solid #CABA71;
    border-radius: 8px;
    padding: 16px;
}

.introduce p {
    display: -webkit-box;
    text-indent: 2em;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    overflow: hidden;
    margin: 10px;
}

.flag {
    width: 450px;
    margin: 0 18px 0 0;
}

.flag img {
    width: 450px;
}

.flag p {
    -webkit-line-clamp: 9;
}

.leader header {
    font: 32px/48px Microsoft YaHei;
    text-align: center;
    color: #fa0;
}

.leader div{
    display: flex;
    align-items: flex-start;
}

.leader img {
    width: 180px;
}

.leader p {
    -webkit-line-clamp: 16;
}

footer {
	margin: 24px 0 0 0;
	min-width: 980px;
    height: 80px;
    background-image: linear-gradient(to right, #392916, #624A2D, #392916);
    color: #DED169;
    border-top: 3px solid #B1A56A;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}