@charset "UTF-8";

html,
body,
h1,
h2,
h3,
h4,
h5,
dl,
dt,
dd,
ul,
ol,
li,
p,
pre,
form,
button,
input,
textarea,
th,
td {
    margin: 0;
    padding: 0;
}

html,
body,
button,
input,
select,
textarea {
    font: 12px/1.5 "阿里方圆体", "阿里方园体", "Alibaba PuHuiTi", "Microsoft Yahei", Tahoma, Simsun, sans-serif;
}

h1,
h2,
h3,
h4,
h5,
button,
input,
select,
textarea {
    font-size: 100%;
}

em,
i {
    font-style: normal;
}

form {
    display: inline;
}

ul,
ol {
    list-style: none;
}

img {
    border: 0 none;
    vertical-align: top;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

a {
    color: #000;
    text-decoration: none;
    outline: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

a:hover {
    text-decoration: none;
}

a:focus,
*:focus {
    outline: none;
}

html {
    scrollbar-color: #34b982 #d9f5ed;
    scrollbar-width: thin;
}

::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-track {
    background: linear-gradient(180deg, #d9f5ed 0%, #9fe6dc 100%);
    border-radius: 10px;
}

::-webkit-scrollbar-thumb {
    border: 2px solid #d9f5ed;
    border-radius: 10px;
    background: linear-gradient(180deg, #6bdd9d 0%, #24a979 100%);
}

::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, #79e9aa 0%, #168d66 100%);
}

.june-play-log,
.june-record-list,
.june-reward-list {
    scrollbar-color: #45c98a #eef8e5;
    scrollbar-width: thin;
}

.june-play-log::-webkit-scrollbar,
.june-record-list::-webkit-scrollbar,
.june-reward-list::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

.june-play-log::-webkit-scrollbar-track,
.june-record-list::-webkit-scrollbar-track,
.june-reward-list::-webkit-scrollbar-track {
    background: rgba(226, 241, 214, 0.9);
    border-radius: 6px;
}

.june-play-log::-webkit-scrollbar-thumb,
.june-record-list::-webkit-scrollbar-thumb,
.june-reward-list::-webkit-scrollbar-thumb {
    border: 1px solid rgba(226, 241, 214, 0.9);
    border-radius: 6px;
    background: linear-gradient(180deg, #83e09f 0%, #38b77d 100%);
}

.june2026-page {
    min-width: 1200px;
    overflow: hidden;
    background: #85e5ee;
    color: #2d5b42;
    font-family: "阿里方圆体", "阿里方园体", "Alibaba PuHuiTi", "Microsoft Yahei", Tahoma, Simsun, sans-serif;
}

.june-aside {
    position: fixed;
    top: 50%;
    right: 0;
    z-index: 90;
    width: 134px;
    height: 391px;
    padding-top: 112px;
    box-sizing: border-box;
    background: url(../img/aside/aside-bg.png) no-repeat center top;
    transform: translateY(-50%);
}

.june-aside-item {
    display: block;
    margin: 0 auto 2px;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
}

.june-aside-item:hover {
    filter: brightness(1.08);
}

.june-aside-item-battle {
    width: 109px;
    height: 40px;
    background-image: url(../img/aside/zhtwz.png);
}

.june-aside-item-progress {
    width: 93px;
    height: 40px;
    background-image: url(../img/aside/tmjd.png);
}

.june-aside-item-shop {
    width: 109px;
    height: 40px;
    background-image: url(../img/aside/zzbjz.png);
}

.june-aside-item-rank {
    width: 110px;
    height: 40px;
    background-image: url(../img/aside/zlfyb.png);
}

.june-aside-item-rule {
    width: 91px;
    height: 40px;
    background-image: url(../img/aside/hdgz.png);
}

.june-aside-item-top {
    width: 92px;
    height: 57px;
    margin-top: 4px;
    background-image: url(../img/aside/hddb.png);
}

.june-bg {
    padding-top: 615px;
    padding-bottom: 80px;
    background: #39aaba url(../img/bg.jpg) no-repeat top center;
    background-size: 1920px auto;
    box-sizing: border-box;
}

.june-wrap {
    width: 1496px;
    margin: 0 auto;
}

.june-time {
    height: 34px;
    padding-left: 200px;
    color: #0c421b;
    font-size: 18px;
    line-height: 34px;
    font-weight: 700;
    -webkit-text-stroke: 1px #fcfff9;
    text-shadow: 0 1px 0 #fcfff9, 0 2px 4px rgba(59, 91, 37, 0.28);
}

.june-user-card {
    position: relative;
    width: 1493px;
    height: 273px;
    margin: 145px auto 0;
    background: url(../img/bg01.png) no-repeat center top;
    box-sizing: border-box;
}

.june-user-main {
    position: absolute;
    left: 42px;
    top: 18px;
    height: 66px;
    display: flex;
    align-items: center;
}

.june-avatar {
    width: 74px;
    height: 66px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.june-avatar img {
    display: block;
    width: 56px;
    height: 56px;
    border-radius: 50%;
}

.june-user-name {
    min-width: 150px;
    margin-left: 14px;
    color: #8b5a2a;
    font-size: 20px;
    line-height: 36px;
    font-weight: bold;
}

.june-user-link {
    display: inline-block;
    width: 98px;
    min-width: 98px;
    height: 44px;
    margin-left: 12px;
    color: #564e49;
    font-size: 16px;
    line-height: 44px;
    text-align: center;
    background: url(../img/btn01.png) no-repeat center top;
}

.june-user-link:hover,
.june-login-btn:hover {
    color: #564e49;
    background-image: url(../img/btn01_h.png);
}

.june-record-btn {
    width: 213px;
    min-width: 213px;
    height: 57px;
    color: #7d5a33;
    font-size: 18px;
    line-height: 57px;
    background-image: url(../img/btn02.png);
}

.june-record-btn:hover {
    color: #9a3b1f;
    background-image: url(../img/btn02_h.png);
}

.june-sign-btn {
    position: absolute;
    right: 72px;
    top: 24px;
    width: 194px;
    height: 57px;
    color: #fff;
    font-size: 18px;
    line-height: 57px;
    font-weight: bold;
    text-align: center;
    background: url(../img/btn03.png) no-repeat center top;
}

.june-sign-btn:hover {
    color: #fff;
    background-image: url(../img/btn03_h.png);
}

.june-sign-btn.signed,
.june-sign-btn.signed:hover {
    color: #fff;
    cursor: default;
    background-image: url(../img/btn03_n.png);
}

.june-stats {
    position: absolute;
    left: 31px;
    top: 98px;
    width: 1432px;
    height: 102px;
    display: flex;
}

.june-stat {
    position: relative;
    flex: 1;
    text-align: center;
}

.june-stat span,
.june-user-tip {
    display: none;
}

.june-stat strong {
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: 47px;
    color: #8f3f1d;
    font-size: 0;
    line-height: 30px;
}

.june-stat em {
    font-size: 29px;
    font-weight: bold;
}

.june-token-icon {
    display: inline-block;
    width: 24px;
    height: 24px;
    margin: 0 2px;
    vertical-align: -2px;
    background: url(../img/icon06.png) no-repeat center / contain;
}

.june-zongzi-icon {
    display: inline-block;
    width: 24px;
    height: 24px;
    margin: 0 2px;
    vertical-align: -1px;
    background: url(../img/icon07.png) no-repeat center / contain;
}

.june-section-title {
    width: 580px;
    height: 99px;
    margin: 0 auto;
    overflow: hidden;
    line-height: 999px;
    text-align: center;
    background: url(../img/icon08.png) no-repeat center top;
}

.june-section-title-battle {
    width: 1149px;
    height: 160px;
    margin-top: 35px;
    background-image: url(../img/icon01.png);
}

.june-section-title-progress {
    margin-top: 140px;
}

.june-section-title-shop,
.june-section-title-rank,
.june-battle-desc {
    display: none;
}

.june-btn {
    display: inline-block;
    min-width: 138px;
    height: 42px;
    padding: 0 18px;
    color: #fff;
    font-size: 18px;
    line-height: 42px;
    text-align: center;
    border-radius: 21px;
    box-sizing: border-box;
    cursor: pointer;
}

.june-btn-green {
    background: url(../img/btn04.png) no-repeat center top;
}

.june-btn-green:hover {
    background-image: url(../img/btn04_h.png);
}

.june-btn-green.disabled,
.june-btn-green.disabled:hover {
    background-image: url(../img/btn04_n.png);
}

.june-btn-blue {
    background: url(../img/btn05.png) no-repeat center top;
}

.june-btn-blue:hover {
    background-image: url(../img/btn05_h.png);
}

.june-btn-red {
    background: url(../img/btn06.png) no-repeat center top;
}

.june-btn-red:hover {
    background-image: url(../img/btn06_h.png);
}

.june-btn-gold {
    background: linear-gradient(#efc470, #bc7a2e);
    box-shadow: inset 0 2px 0 rgba(255, 255, 255, 0.35), 0 4px 0 rgba(145, 92, 33, 0.32);
}

.june-btn-gray {
    color: #806a4c;
    background: linear-gradient(#f2ead9, #d7c3a2);
}


.june-battle-panel {
    position: relative;
    width: 1370px;
    height: 215px;
    margin: 12px auto 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    background: url(../img/bg02.png) no-repeat center top;
}

.june-charge-summary {
    padding-top: 16px;
    color: #2e7a54;
    font-size: 24px;
    line-height: 44px;
    font-weight: bold;
    text-align: center;
}

.june-charge-summary strong {
    padding: 0 4px;
    /* color: #118d70;
    font-size: 38px; */
}

.june-charge-track {
    position: relative;
    width: 1306px;
    height: 109px;
    margin-top: 4px;
}

.june-charge-track:after {
    content: "";
    position: absolute;
    left: 41px;
    top: 0;
    z-index: 2;
    width: 1232px;
    height: 109px;
    background: url(../img/icon02.png) no-repeat center top;
    pointer-events: none;
}

.june-charge-line {
    display: block;
    position: absolute;
    left: 0;
    top: 34px;
    z-index: 1;
    width: 100%;
    height: 5px;
    background: #009a70;
}

.june-charge-line i {
    display: block;
    width: 0;
    height: 100%;
    background: #fff665;
}

.june-arena-grid {
    width: 1327px;
    margin: 44px auto 0;
    display: flex;
    justify-content: space-between;
}

.june-arena-card {
    position: relative;
    width: 425px;
    height: 490px;
    padding-top: 103px;
    text-align: center;
    background: url(../img/icon03.png) no-repeat center top;
    box-sizing: border-box;
}

.june-arena-card.elite {
    background-image: url(../img/icon04.png);
}

.june-arena-card.king {
    background-image: url(../img/icon05.png);
}

.june-arena-card.is-experience-locked .june-arena-sub,
.june-arena-card.is-experience-locked .june-arena-visual {
    visibility: hidden;
}

.june-arena-lock-mask {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 4;
    width: 100%;
    height: 100%;
    background: url(../img/icon18.png) no-repeat center top;
    pointer-events: auto;
}

.june-arena-card.rookie .june-arena-title {
    color: #328b67;
}

.june-arena-card.elite .june-arena-title {
    color: #216da4;
}

.june-arena-card.king .june-arena-title {
    color: #bd4224;
}

.june-arena-title {
    min-height: 52px;
    font-size: 20px;
    line-height: 33px;
}

.june-arena-card.is-first-experience .june-arena-title {
    min-height: 52px;
    padding: 0 42px;
    font-size: 17px;
    line-height: 26px;
}

.june-arena-card.is-first-experience .june-arena-title span {
    display: block;
    white-space: nowrap;
}

.june-arena-card.elite.is-multiplier-unlocked .june-arena-title,
.june-arena-card.king.is-multiplier-unlocked .june-arena-title,
.june-arena-sub,
.june-arena-visual {
    display: none;
}

.june-arena-multiplier {
    height: 52px;
    margin-top: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: #6f7351;
    font-size: 20px;
}

.june-multiplier-btn {
    width: 46px;
    height: 33px;
    border: 0;
    border-radius: 0;
    color: transparent;
    font-size: 0;
    cursor: pointer;
    background: url(../img/btn10.png) no-repeat center top;
}

.june-multiplier-btn[data-step="-1"] {
    background-image: url(../img/btn09.png);
}

.june-multiplier-btn:hover {
    background-image: url(../img/btn10_h.png);
}

.june-multiplier-btn[data-step="-1"]:hover {
    background-image: url(../img/btn09_h.png);
}

.june-multiplier-btn:disabled {
    cursor: default;
    opacity: 0.65;
}

.june-multiplier-value {
    min-width: 48px;
    height: 29px;
    color: #2a835f;
    font-size: 18px;
    line-height: 29px;
    border: 1px solid #574d4b;
    border-radius: 5px;
}

.june-arena-cost.june-btn {
    display: block;
    width: 387px;
    height: 60px;
    margin: 242px auto 0;
    padding: 0;
    color: #fff6ce;
    font-size: 18px;
    line-height: 60px;
    font-weight: bold;
    text-align: center;
    text-shadow: 0 2px 2px rgba(111, 54, 8, 0.45);
    border-radius: 0;
    box-sizing: border-box;
}

.june-arena-cost.june-btn strong {
    color: #fff665;
    font-size: 18px;
}

.june-arena-cost-icon {
    display: inline-block;
    width: 30px;
    height: 30px;
    margin: -3px 2px 0;
    background: url(../img/icon06.png) no-repeat center;
    vertical-align: middle;
}

.june-view-reward.june-btn {
    display: block;
    width: 213px;
    min-width: 213px;
    height: 57px;
    margin: 42px auto 0;
    padding: 0;
    color: #8b5921;
    font-size: 18px;
    line-height: 57px;
    border-radius: 0;
    background: url(../img/btn02.png) no-repeat center top;
    box-shadow: none;
}

.june-view-reward.june-btn:hover {
    background-image: url(../img/btn02_h.png);
}

.june-progress-panel {
    position: relative;
    width: 1620px;
    min-height: 497px;
    margin: 16px 0 0 50%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    transform: translateX(-50%);
    background: url(../img/icon09.png) no-repeat center top;
}

.june-progress-head {
    flex: 0 0 100%;
    padding-top: 18px;
    color: #508866;
    font-size: 20px;
    text-align: center;
}

.june-progress-head strong {
    color: #2c7558;
    font-size: 32px;
    padding: 0 5px;
}
.june-progress-head span {
    font-size: 32px;
}
.june-progress-track {
    position: relative;
    width: 1120px;
    height: 300px;
    margin: 44px 0 0 132px;
}

.june-progress-nodes {
    position: relative;
    width: 100%;
    height: 100%;
}

.june-progress-node {
    position: absolute;
    top: 222px;
    display: block;
    width: 181px;
    height: 44px;
    margin-left: -90px;
    color: #fff7c8;
    font-size: 16px;
    line-height: 44px;
    font-weight: bold;
    text-align: center;
    text-shadow: 0 2px 2px rgba(101, 45, 20, 0.45);
    border-radius: 0;
    background: url(../img/btn07_n.png) no-repeat center top;
}

.june-progress-node.reached {
    background-image: url(../img/btn07.png);
}

.june-progress-node.reached:hover {
    background-image: url(../img/btn07_h.png);
}

.june-progress-node.claimed {
    cursor: default;
    background-image: url(../img/btn07_n.png);
}

.june-progress-node.claimed:hover{
  background: url(../img/btn07_n.png) no-repeat center top;
}
.june-progress-node.is-first {
    top: 250px;
}

.june-progress-cost-icon {
    display: inline-block;
    width: 30px;
    height: 30px;
    margin: -3px 0 0 2px;
    background: url(../img/icon06.png) no-repeat center;
    vertical-align: middle;
}

.june-coupon-card {
    position: absolute;
    right: 98px;
    top: 116px;
    width: 300px;
    height: 330px;
}

.june-coupon-card .june-btn {
    position: absolute;
    left: 18px;
    bottom: -46px;
    width: 345px;
    min-width: 345px;
    height: 53px;
    padding: 0;
    color: #7d3f1e;
    font-size: 18px;
    line-height: 53px;
    font-weight: bold;
    background: url(../img/btn11.png) no-repeat center top;
    box-shadow: none;
}

.june-coupon-zongzi-icon {
    display: inline-block;
    width: 30px;
    height: 30px;
    margin: -3px 2px 0;
    background: url(../img/icon07.png) no-repeat center;
    vertical-align: middle;
}

.june-shop-panel {
    width: 1346px;
    min-height: 984px;
    margin: 34px auto 0;
    padding: 178px 89px 94px;
    background: url(../img/bg03.png) no-repeat center top;
    box-sizing: border-box;
}

.june-shop-grid {
    display: grid;
    grid-template-columns: repeat(5, 202px);
    justify-content: center;
    gap: 30px 35px;
}

.june-shop-card {
    position: relative;
    width: 202px;
    height: 312px;
    text-align: center;
}

.june-shop-card:nth-child(n+6) {
    transform: translateX(118px);
}

.june-shop-card-inner {
    position: relative;
    width: 202px;
    height: 245px;
    padding-top: 0;
    background: url(../img/icon16.png) no-repeat center top;
}

.june-shop-label {
    display: none;
}

.june-shop-money {
    position: absolute;
    left: 0;
    top: 78px;
    width: 89%;
    color: #c92d21;
    font-size: 20px;
    line-height: 70px;
}

.june-shop-money strong {
    font-size: 48px;
    line-height: 70px;
}

.june-shop-cost {
    position: absolute;
    left: 0;
    bottom: 20px;
    width: 89%;
    color: #fff3d0;
    font-size: 16px;
    line-height: 24px;
}

.june-shop-actions {
    position: relative;
    left: -12px;
    width: 214px;
    height: 49px;
    margin: 24px auto 0;
}

.june-shop-actions .june-btn {
    width: 214px;
    min-width: 214px;
    height: 41px;
    padding: 0;
    color: #fff8d7;
    font-size: 20px;
    line-height: 41px;
    text-align: center;
    text-shadow: 0 2px 2px rgba(47, 76, 62, 0.65);
    border-radius: 0;
    background: url(../img/btn08.png) no-repeat center top;
    box-shadow: none;
}

.june-shop-actions .june-btn:hover {
    background-image: url(../img/btn08_h.png);
}

.june-first-tag {
    position: absolute;
    left: -28px;
    top: -18px;
    z-index: 2;
    width: 66px;
    height: 38px;
    overflow: hidden;
    line-height: 999px;
    background: url(../img/icon10.png) no-repeat center top;
}

.june-shop-zongzi-icon {
    display: inline-block;
    width: 30px;
    height: 30px;
    margin: -3px 5px 0;
    background: url(../img/icon07.png) no-repeat center;
    vertical-align: middle;
}

.june-rank-panel {
    position: relative;
    width: 1346px;
    min-height: 1691px;
    margin: 74px auto 0;
    padding: 157px 0 80px;
    background: url(../img/bg04.png) no-repeat center top;
    box-sizing: border-box;
}

.june-rank-top {
    position: relative;
    width: 1140px;
    height: 330px;
    margin: 0 auto;
}

.june-rank-podium {
    position: absolute;
    width: 408px;
    height: 170px;
    text-align: left;
    background: url(../img/icon11.png) no-repeat center top;
    box-sizing: border-box;
}

.june-rank-podium.rank1 {
    left: 355px;
    top: 0;
}

.june-rank-podium.rank2 {
    left: 0;
    top: 160px;
    background-image: url(../img/icon12.png);
}

.june-rank-podium.rank3 {
    right: 0;
    top: 160px;
    background-image: url(../img/icon13.png);
}

.june-rank-medal {
    display: block;
    position: absolute;
    left: 105px;
    top: 26px;
    z-index: 2;
    width: 114px;
    height: 114px;
    border-radius: 50%;
    object-fit: cover;
}

.june-rank-user {
    position: absolute;
    left: 243px;
    top: 58px;
    width: 150px;
}

.june-rank-name {
    color: #8b4d22;
    font-size: 20px;
    font-weight: bold;
}

.june-rank-game {
    position: absolute;
    left: 82px;
    top: 143px;
    width: 150px;
    color: #6e8268;
    font-size: 15px;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.june-rank-score {
    margin-top: 6px;
    padding-left: 48px;
    color: #2b8a64;
    font-size: 24px;
    font-weight: bold;
}

.june-rank-list {
    width: 658px;
    margin: 0 auto;
}

.june-rank-row {
    position: relative;
    display: block;
    width: 658px;
    height: 139px;
    background: url(../img/icon14.png) no-repeat center top;
    box-sizing: border-box;
}

.june-rank-row-no {
    position: absolute;
    left: 44px;
    top: 20px;
    width: 58px;
    height: 48px;
    color: #fdffa3;
    font-size: 31px;
    line-height: 48px;
    font-weight: bold;
    text-align: center;
    -webkit-text-stroke: 1px #7e020c;
    text-shadow: 0 1px 0 #7e020c, 0 2px 4px rgba(59, 91, 37, 0.28);
}

.june-rank-row .june-rank-info {
    position: absolute;
    left: 152px;
    top: 50px;
    width: 267px;
    min-height: 70px;
    padding: 10px 0 0 80px;
    box-sizing: border-box;
}

.june-rank-avatar {
    position: absolute;
    left: 0;
    top: 0;
    width: 70px;
    height: 70px;
    border-radius: 70px;
    object-fit: cover;
}

.june-rank-row .june-rank-name {
    width: 220px;
    overflow: hidden;
    color: #8b4d22;
    font-size: 20px;
    line-height: 30px;
    font-weight: bold;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.june-rank-row .june-rank-game {
    position: static;
    width: 220px;
    overflow: hidden;
    color: #9d7a47;
    font-size: 16px;
    line-height: 22px;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: left;
}

.june-rank-row .june-rank-score {
    position: absolute;
    right: 52px;
    top: 66px;
    width: 118px;
    height: 40px;
    margin-top: 0;
    padding-left: 45px;
    color: #2a8b66;
    font-size: 25px;
    line-height: 40px;
    font-weight: bold;
    text-align: left;
    box-sizing: border-box;
}

.june-rank-row .june-rank-score:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 40px;
    height: 40px;
    background: url(../img/icon07.png) no-repeat center;
    background-size: 40px 40px;
}

.june-rule-panel {
    width: 1300px;
    margin: 64px auto 10px;
    color: #fff;
    font-size: 16px;
    line-height: 28px;
    box-sizing: border-box;
    /* text-align: center; */
}

.june-rule-title {
    width: 580px;
    height: 99px;
    margin: 0 auto;
    background: url(../img/icon15.png) no-repeat center;
}


.june-modal {
    display: none;
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1000;
    background: rgba(0, 0, 0, 0.55);
}

.june-modal.open {
    display: block;
}

#juneWithdrawModal {
    z-index: 1400;
}

.june-modal-card {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 750px;
    min-height: 497px;
    padding: 100px 60px 58px;
    transform: translate(-50%, -50%);
    text-align: center;
    background: url(../img/bg06.png) no-repeat center top;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    box-sizing: border-box;
}

.june-modal-card h3 {
    position: absolute;
    left: 50%;
    top: 12px;
    width: 390px;
    height: 58px;
    transform: translateX(-50%);
    color: #fff7d8;
    font-size: 26px;
    line-height: 58px;
    font-weight: bold;
    text-align: center;
    text-shadow: 0 2px 3px rgba(33, 83, 66, 0.72);
}

.june-modal-card p {
    min-height: 150px;
    margin-top: 95px;
    color: #5f644e;
    font-size: 18px;
    line-height: 34px;
    text-align: center;
}

.june-modal-card p span {
    display: block;
}

.june-battle-result-card {
    height: 497px;
    min-height: 497px;
}

.june-result-content {
    min-height: 190px;
    margin-top: 28px;
    color: #5f644e;
    font-size: 18px;
    line-height: 32px;
    text-align: center;
}

.june-result-desc {
    min-height: auto !important;
    margin: 0 auto 20px !important;
    color: #5f644e !important;
    font-size: 18px !important;
    line-height: 32px !important;
}

.june-result-desc strong {
    color: #bb3f27;
    font-weight: bold;
}

.june-result-detail {
    width: 350px;
    margin: 0 auto;
}

.june-result-detail div {
    height: 44px;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #8a7652;
    font-size: 17px;
    line-height: 44px;
    background: rgba(255, 252, 242, 0.72);
    border: 2px solid #e6d2a2;
    border-radius: 5px;
    box-sizing: border-box;
}

.june-result-detail span {
    width: 120px;
    text-align: right;
}

.june-result-detail strong {
    width: 155px;
    color: #b94b38;
    text-align: left;
    font-weight: bold;
}

.june-withdraw-card p {
    min-height: auto;
    margin-top: 16px;
    padding: 0 12px;
    color: #5f644e;
    font-size: 17px;
    line-height: 32px;
}

.june-withdraw-card p strong {
    color: #bb3f27;
}

.june-withdraw-card .june-result-detail {
    margin-top: 18px;
}

.june-withdraw-card .june-modal-actions {
    margin-top: 30px;
}

.june-battle-result-card.is-battle-lost .june-modal-actions {
    margin-top: 30px;
}

.june-battle-result-card.is-simple-result {
    padding-top: 100px;
}

.june-battle-result-card.is-simple-result .june-result-content {
    min-height: 234px;
    margin-top: 0;
    color: #5f644e;
    font-size: 22px;
    line-height: 34px;
    font-weight: normal;
}

.june-battle-result-card.is-simple-result .june-result-content span {
    display: block;
    margin-top: 2px;
}

.june-battle-result-card.is-simple-result .june-modal-actions {
    margin-top: 0;
}

.june-battle-result-card:not(.is-battle-lost) #juneResultCancelBtn {
    display: none;
}

.june-popup-icon {
    display: block;
    margin: 0 auto 20px;
}

.june-popup-icon-sign {
    width: 129px;
    height: 148px;
    background: url(../img/icon19.png) no-repeat center top;
}

.june-battle-result-card.is-simple-result .june-popup-icon-sign {
    margin-bottom: 18px;
}

.june-modal-close {
    position: absolute;
    right: -38px;
    top: 4px;
    z-index: 2;
    width: 44px;
    height: 67px;
    border: 0;
    overflow: hidden;
    color: transparent;
    font-size: 0;
    line-height: 999px;
    background: url(../img/close.png) no-repeat center top;
    cursor: pointer;
}

.june-modal-actions {
    margin-top: 12px;
    display: flex;
    justify-content: center;
    gap: 58px;
}

.june-popup-btn {
    display: inline-block;
    width: 194px;
    height: 57px;
    color: #fff6d4;
    font-size: 18px;
    line-height: 57px;
    font-weight: bold;
    text-align: center;
    text-shadow: 0 2px 2px rgba(102, 34, 22, 0.45);
    background: url(../img/btn03.png) no-repeat center top;
}

.june-popup-btn:hover {
    color: #fff6d4;
    background-image: url(../img/btn03_h.png);
}

.june-popup-btn-cancel {
    color: #8d6837;
    text-shadow: none;
    background-image: url(../img/btn14.png);
}

.june-popup-btn-cancel:hover {
    color: #8d6837;
    background-image: url(../img/btn14_h.png);
}

.june-front-modal {
    z-index: 1300;
    background: #0e4a3e url(../img/bg05.png) no-repeat center center;
    background-size: cover;
}

.june-front-shell {
    /* position: absolute;
    left: 50%;
    top: 50%;
    width: 100vw;
    height: 56.25vw;
    min-height: 100vh;
    min-width: 177.78vh;
    transform: translate(-50%, -50%); */
    overflow: hidden;
}

.june-front-guide-btn {
    position: absolute;
    right: 55px;
    top: 42px;
    z-index: 6;
    width: 132px;
    height: 45px;
    overflow: hidden;
    color: transparent;
    font-size: 0;
    line-height: 999px;
    background: url(../img/btn13.png) no-repeat center top;
    border: 0;
    border-radius: 0;
    box-sizing: border-box;
}

.june-front-status {
    position: absolute;
    left: 50%;
    top: 58px;
    z-index: 5;
    width: 1339px;
    height: 112px;
    transform: translateX(-50%);
    display: flex;
    align-items: flex-start;
    padding: 28px 50px 0;
    background: url(../img/icon17.png) no-repeat center top;
    box-sizing: border-box;
}

.june-front-value {
    width: 249px;
    height: 30px;
    margin-top: 28px;
    color: #135633;
    font-size: 20px;
    line-height: 30px;
    font-weight: bold;
    text-align: center;
}

#juneTempZongzi::after,
#juneProtectedZongzi::after {
    content: "";
    display: inline-block;
    width: 30px;
    height: 30px;
    margin: -4px 0 0 8px;
    background: url(../img/icon07.png) no-repeat center;
    vertical-align: middle;
}

.june-front-withdraw {
    flex: 0 0 194px;
    width: 194px;
    height: 57px;
    margin-left: 35px;
    overflow: hidden;
    color: transparent;
    font-size: 0;
    line-height: 999px;
    background: url(../img/btn12.png) no-repeat center top;
    border: 0;
    border-radius: 0;
    box-sizing: border-box;
}

.june-front-modal .june-play-stage {
    position: absolute;
    left: 50%;
    top: 215px;
    width: 1160px;
    margin: 0;
    transform: translateX(-50%);
    display: flex;
    justify-content: space-around;
    /* gap: 112px; */
}

.june-front-modal .june-play-card-item {
    position: relative;
    width: 265px;
    height: 437px;
    padding-top: 60px;
    color: #18452c;
    text-align: center;
    background: url(../img/xing1.png) no-repeat center top;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    box-sizing: border-box;
}

.june-front-modal .june-play-card-star2 {
    background-image: url(../img/xing2.png);
}

.june-front-modal .june-play-card-star3 {
    width: 262px;
    height: 438px;
    background-image: url(../img/xing3.png);
}

.june-front-modal .june-play-card-star4 {
    width: 277px;
    height: 439px;
    background-image: url(../img/xing4.png);
}

.june-front-modal .june-play-card-star5 {
    width: 277px;
    height: 439px;
    background-image: url(../img/xing5.png);
}

.june-front-modal .june-play-card-tip {
    color: #244b32;
    font-size: 24px;
    line-height: 30px;
    text-align: center;
}

.june-front-modal .june-play-card-reward {
    color: #123f28;
    font-size: 19px;
    line-height: 60px;
    text-align: center;
}

.june-front-modal .june-play-card-reward strong {
    display: inline-block;
    margin-top: 0;
    color: #0a5132;
    font-size: 52px;
    font-weight: bold;
    vertical-align: baseline;
}

.june-front-modal .june-play-card-reward span {
    display: inline;
    margin-top: 0;
    color: #0a5132;
    font-size: 19px;
}

.june-front-modal .june-play-card-reward:after {
    content: "";
    display: inline-block;
    width: 30px;
    height: 30px;
    margin: -4px 0 0 6px;
    background: url(../img/icon07.png) no-repeat center;
    vertical-align: middle;
}

.june-front-modal .june-play-card-action {
    position: absolute;
    left: 50%;
    bottom: 18px;
    width: 203px;
    height: 59px;
    transform: translateX(-50%);
    overflow: hidden;
    color: transparent;
    font-size: 0;
    line-height: 999px;
    background: url(../img/btn15.png) no-repeat center top;
}

.june-front-modal .june-play-card-star3 .june-play-card-action {
    background-image: url(../img/btn16.png);
}

.june-front-modal .june-play-card-star4 .june-play-card-action,
.june-front-modal .june-play-card-star5 .june-play-card-action {
    background-image: url(../img/btn17.png);
}

.june-front-record-title {
    position: absolute;
    left: 50%;
    top: 675px;
    width: 360px;
    transform: translateX(-50%);
    color: #f9f4d8;
    font-size: 25px;
    line-height: 42px;
    text-align: center;
    text-shadow: 0 2px 4px rgba(18, 65, 49, 0.8);
}

.june-front-modal .june-play-log {
    position: absolute;
    left: 50%;
    top: 720px;
    width: 760px;
    height: 195px;
    margin: 0;
    padding: 10px 20px;
    transform: translateX(-50%);
    color: #f9f4d8;
    font-size: 16px;
    line-height: 28px;
    background: rgba(38, 87, 66, 0.46);
    border-radius: 0;
}

.june-front-modal .june-play-log div {
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid rgba(232, 247, 215, 0.12);
}

.june-front-modal .june-play-log em {
    color: rgba(255, 255, 255, 0.66);
    font-size: 13px;
}

.june-play-log-icon {
    display: inline-block;
    width: 18px;
    height: 18px;
    margin: 0 3px;
    vertical-align: -4px;
    background: no-repeat center / contain;
}

.june-play-log-token {
    background-image: url(../img/icon06.png);
}

.june-play-log-zongzi {
    background-image: url(../img/icon07.png);
}

.june-guide-overlay {
    display: none;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 20;
    width: 100%;
    height: 100%;
    cursor: pointer;
    background: rgba(0, 0, 0, 0.16);
}

.june-guide-overlay.open {
    display: block;
}

.june-guide-overlay img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.june-battle-modal-card {
    width: 750px;
}

.june-battle-modal-text {
    min-height: 235px;
    padding: 0 18px;
    color: #5f644e;
    font-size: 16px;
    line-height: 30px;
    text-align: left;
}

.june-battle-confirm-intro {
    margin: 5px 0 30px;
    text-align: center;
    font-size: 18px;
}

.june-battle-confirm-intro strong,
.june-battle-confirm-rules strong {
    color: #bb3f27;
    font-weight: bold;
}

.june-battle-confirm-rules p {
    min-height: 0;
    margin: 0;
    padding: 0;
    font-size: 16px;
    line-height: 30px;
    text-align: left;
}

.june-battle-modal-card .june-modal-actions {
    margin-top: 0;
}

.june-play-card {
    width: 900px;
    min-height: 560px;
    text-align: left;
}

.june-play-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.june-play-head h3 {
    text-align: left;
}

.june-play-head p {
    margin-top: 4px;
}

.june-play-stage {
    margin-top: 28px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}

.june-play-card-item {
    height: 160px;
    padding: 18px 10px;
    text-align: center;
    border: 3px solid #e3c785;
    border-radius: 16px;
    background: linear-gradient(#fffdf5, #f3e6c4);
    box-sizing: border-box;
    cursor: pointer;
}

.june-play-card-item:hover {
    border-color: #42a777;
}

.june-play-card-item strong {
    display: block;
    margin-top: 20px;
    color: #c94423;
    font-size: 32px;
}

.june-play-card-item span {
    display: block;
    margin-top: 10px;
    color: #7d6b4c;
    font-size: 16px;
}

.june-play-pack {
    margin-top: 24px;
    display: flex;
    gap: 20px;
    color: #4e7a61;
    font-size: 18px;
}

.june-play-pack strong {
    color: #c74623;
    font-size: 24px;
}

.june-play-log {
    height: 118px;
    margin-top: 18px;
    padding: 14px 18px;
    overflow: auto;
    color: #62725c;
    font-size: 15px;
    line-height: 26px;
    background: rgba(239, 248, 229, 0.85);
    border-radius: 12px;
    box-sizing: border-box;
}

.june-record-card {
    width: 750px;
    min-height: 497px;
    text-align: left;
}

.june-record-card h3 {
    text-align: center;
}

.june-reward-card {
    width: 750px;
    height: 497px;
    min-height: 497px;
    padding: 94px 60px 56px;
    text-align: center;
}

.june-reward-card .june-modal-actions {
    margin-top: 18px;
}

.june-reward-desc {
    min-height: auto !important;
    margin: 0 0 18px !important;
    color: #4f735d !important;
    font-size: 18px !important;
    line-height: 30px !important;
    font-weight: bold;
    text-align: left !important;
}

.june-record-list,
.june-reward-list {
    max-height: 310px;
    margin-top: 8px;
    overflow: auto;
}

.june-reward-list {
    max-height: none;
    height: 235px;
    margin-top: 0;
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    justify-content: center;
    gap: 16px 28px;
    overflow: hidden;
}

.june-record-row,
.june-reward-row {
    min-height: 36px;
    margin-bottom: 8px;
    padding: 6px 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #705f43;
    font-size: 15px;
    background: rgba(255, 249, 232, 0.75);
    border: 1px solid #ead8ae;
    border-radius: 4px;
}

.june-reward-item {
    width: 134px;
    height: 105px;
    padding-top: 10px;
    color: #b75540;
    font-size: 18px;
    line-height: 24px;
    text-align: center;
    background: rgba(255, 251, 237, 0.72);
    border: 2px solid #e6c98f;
    border-radius: 6px;
    box-sizing: border-box;
}

.june-reward-value {
    height: 26px;
    font-weight: bold;
}

.june-reward-icon {
    width: 59px;
    height: 58px;
    margin: 0 auto;
    background: url(../img/icon22.png) no-repeat center;
}

.june-exchange-card p {
    min-height: auto;
    margin-top: 4px;
    color: #6f6a54;
    font-size: 16px;
    line-height: 26px;
}

#juneExchangeText {
    white-space: nowrap;
}

#juneExchangeText span {
    display: inline;
    margin: 0 5px;
}

.june-exchange-type-list {
    margin-top: 10px;
    display: flex;
    justify-content: center;
    gap: 44px;
}

.june-exchange-type {
    position: relative;
    display: block;
    width: 202px;
    height: 312px;
    color: #b82f23;
    text-align: center;
    background: url(../img/icon21.png) no-repeat center top;
}

.june-exchange-type-h5 {
    background-image: url(../img/icon20.png);
}

.june-exchange-type em {
    position: absolute;
    left: 45%;
    bottom: 2px;
    width: 194px;
    height: 57px;
    transform: translateX(-50%);
    color: #fff6d4;
    font-size: 18px;
    line-height: 57px;
    font-weight: bold;
    text-align: center;
    text-shadow: 0 2px 2px rgba(102, 34, 22, 0.45);
    background: url(../img/btn03.png) no-repeat center top;
}

.june-exchange-type:hover em {
    background-image: url(../img/btn03_h.png);
}

.june-toast {
    display: none;
    position: fixed;
    left: 50%;
    top: 50%;
    z-index: 1200;
    min-width: 220px;
    max-width: 460px;
    padding: 16px 28px;
    transform: translate(-50%, -50%);
    color: #fff;
    font-size: 18px;
    line-height: 28px;
    text-align: center;
    background: rgba(21, 78, 62, 0.9);
    border-radius: 10px;
}

.mask {
    display: none;
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 999;
    background: #000;
    opacity: 0.55;
    filter: alpha(opacity=55);
}

.pop-act-box {
    position: fixed;
    left: 50%;
    top: 50%;
    z-index: 1001;
    width: 636px;
    height: 383px;
    margin: -191px 0 0 -318px;
    background: #fffdf5;
    border: 4px solid #e4c98d;
    border-radius: 16px;
    box-shadow: 0 18px 50px rgba(31, 69, 60, 0.35);
}

.pop-act-box .btn-close {
    position: absolute;
    right: 18px;
    top: 14px;
    width: 32px;
    height: 32px;
    color: #8a9c91;
    font-size: 34px;
    line-height: 32px;
    cursor: pointer;
}

.pop-act-box .btn-close:before {
    content: "×";
}

.pop-act-box .lblist-tile {
    padding-top: 38px;
    color: #2e7656;
    font-size: 30px;
    font-weight: bold;
    text-align: center;
}

.hongbao_list {
    margin-top: 36px;
    text-align: center;
}

.webgame,
.h5game {
    display: inline-block;
    width: 190px;
    margin: 0 26px;
    text-align: center;
}

.webgame .img,
.h5game .img {
    width: 160px;
    height: 128px;
    margin: 0 auto 18px;
    border: 3px solid #e6c982;
    border-radius: 16px;
    background: linear-gradient(#fff8df, #f0d495);
}

.webgame .img:after,
.h5game .img:after {
    display: block;
    color: #9f5d24;
    font-size: 20px;
    line-height: 128px;
    font-weight: bold;
}

.webgame .img:after {
    content: "页游红包";
}

.h5game .img:after {
    content: "H5代金券";
}

.pop-act-box .btn-style {
    display: inline-block;
    width: 138px;
    height: 42px;
    line-height: 42px;
    border-radius: 21px;
    background: linear-gradient(#57c98b, #21815e);
}

.june-common-prize-pop {
    width: 750px !important;
    height: 497px !important;
    margin: -248px 0 0 -375px !important;
    background: url(../img/bg06.png) no-repeat center top !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.june-common-tip-pop {
    width: 750px !important;
    height: 497px !important;
    margin: -248px 0 0 -375px !important;
    background: url(../img/bg06.png) no-repeat center top !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.june-common-tip-pop .btn-close {
    right: -38px !important;
    top: 4px !important;
    width: 44px !important;
    height: 67px !important;
    overflow: hidden;
    color: transparent !important;
    font-size: 0 !important;
    line-height: 999px !important;
    background: url(../img/close.png) no-repeat center top !important;
}

.june-common-tip-pop .btn-close:before {
    content: "" !important;
}

.june-common-tip-pop .pop-bd {
    position: relative;
    height: 100%;
    padding: 94px 108px 58px;
    box-sizing: border-box;
}

.june-common-tip-pop .pop-bd:before {
    content: "提示";
    position: absolute;
    left: 50%;
    top: 12px;
    width: 390px;
    height: 58px;
    transform: translateX(-50%);
    color: #fff7d8;
    font-size: 26px;
    line-height: 58px;
    font-weight: bold;
    text-align: center;
    text-shadow: 0 2px 3px rgba(33, 83, 66, 0.72);
}

.june-common-tip-pop.is-pass-tip .pop-bd:before {
    content: "通关成功";
}

.june-common-tip-pop .pop-text-cont {
    height: 100%;
    padding: 0 !important;
    text-align: center;
}

.june-common-tip-pop .one-line-title {
    min-height: 160px;
    margin: 58px 0 0 !important;
    color: #5f644e !important;
    font-size: 22px !important;
    line-height: 36px !important;
    font-weight: normal !important;
    text-align: center !important;
    padding-top: 50px !important;
}

.june-common-tip-pop .btns-mod {
    margin-top: 12px !important;
    text-align: center !important;
}

.june-common-tip-pop .btn-style,
.june-common-tip-pop .close_window {
    display: inline-block !important;
    width: 194px !important;
    height: 57px !important;
    padding: 0 !important;
    color: #fff6d4 !important;
    font-size: 18px !important;
    line-height: 57px !important;
    font-weight: bold !important;
    text-align: center !important;
    text-indent: 0 !important;
    text-shadow: 0 2px 2px rgba(102, 34, 22, 0.45) !important;
    background: url(../img/btn03.png) no-repeat center top !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.june-common-tip-pop .btn-style:hover,
.june-common-tip-pop .close_window:hover {
    color: #fff6d4 !important;
    background-image: url(../img/btn03_h.png) !important;
}

.june-common-prize-pop .btn-close {
    right: -38px !important;
    top: 4px !important;
    width: 44px !important;
    height: 67px !important;
    overflow: hidden;
    color: transparent !important;
    font-size: 0 !important;
    line-height: 999px !important;
    background: url(../img/close.png) no-repeat center top !important;
}

.june-common-prize-pop .btn-close:before {
    content: "" !important;
}

.june-common-prize-pop .pop-bd {
    position: relative;
    height: 100%;
    padding: 86px 100px 58px;
    box-sizing: border-box;
}

.june-common-prize-pop .lblist-bd {
    position: absolute;
    left: 50%;
    top: 12px;
    width: 390px;
    height: 58px;
    margin: 0;
    transform: translateX(-50%);
    overflow: visible;
}

.june-common-prize-pop .lblist-bd ul {
    margin: 0;
    padding: 0;
}

.june-common-prize-pop .lblist-bd li,
.june-common-prize-pop .lblist-bd li.active {
    width: 390px;
    height: 58px;
    padding: 0;
    color: #fff7d8;
    font-size: 26px;
    line-height: 58px;
    font-weight: bold;
    text-align: center;
    text-shadow: 0 2px 3px rgba(33, 83, 66, 0.72);
    background: none;
}

.june-common-prize-pop .pop-lblist {
    width: 100%;
    height: 274px;
    margin: 0;
    padding: 0;
}

.june-common-prize-pop .lblist-table {
    width: 100%;
    height: 344px;
    margin: 0;
    overflow: auto;
}

.june-common-prize-pop .lblist-table .bg {
    display: none;
}

.june-common-prize-pop .pop-lblist table {
    width: 100%;
    color: #705f43;
    font-size: 15px;
    border-collapse: collapse;
}

.june-common-prize-pop .pop-lblist td {
    height: 36px;
    padding: 6px 12px;
    color: #705f43;
    text-align: center;
    border: 1px solid #ead8ae;
    background: rgba(255, 249, 232, 0.75);
}

.june-common-prize-pop .pop-lblist td a {
    color: #b53a25 !important;
}

.june-common-prize-pop .pages {
    height: 34px;
    margin-top: 4px;
    text-align: center;
}

.june-common-prize-pop .pagination_con {
    display: inline-block;
}
.pop-lblist .w1 {
    width: 10% !important;
}
.pop-lblist .w2 {
    width: 30% !important;
}
.pop-lblist .w3 {
    width: 30% !important;
}
.pop-lblist .w4 {
    width: 30% !important;
}

.ie11 .june-arena-multiplier > * {
    margin: 0 4px;
}

.ie11 .june-shop-grid {
    display: block;
    width: 1150px;
    margin: 0 auto;
}

.ie11 .june-shop-grid:after {
    content: "";
    display: block;
    clear: both;
}

.ie11 .june-shop-card {
    float: left;
    margin: 0 35px 30px 0;
}

.ie11 .june-shop-card:nth-child(5n) {
    margin-right: 0;
}

.ie11 .june-shop-card:nth-child(n+6) {
    transform: none;
}

.ie11 .june-shop-card:nth-child(6) {
    margin-left: 118px;
}

.ie11 .june-guide-overlay img {
    width: 100%;
    height: 100%;
}

.ie11 .june-modal-actions {
    font-size: 0;
    text-align: center;
}

.ie11 .june-modal-actions .june-popup-btn {
    margin: 0 29px;
}

.ie11 .june-front-modal {
    overflow: auto;
}

.ie11 .june-front-shell {
    width: 1366px;
    height: 768px;
    min-width: 0;
    min-height: 0;
    margin-left: -683px;
    margin-top: -384px;
    transform: none;
}

.ie11 .june-front-modal .june-play-stage {
    display: block;
    font-size: 0;
    text-align: center;
}

.ie11 .june-front-modal .june-play-card-item {
    display: inline-block;
    vertical-align: top;
    margin: 0 56px;
}

.ie11 .june-play-stage {
    display: block;
    margin-left: -9px;
    margin-right: -9px;
    font-size: 0;
    text-align: center;
}

.ie11 .june-play-card-item {
    display: inline-block;
    width: 274px;
    margin: 0 9px 18px;
    vertical-align: top;
}

.ie11 .june-play-pack > * {
    margin-right: 20px;
}

.ie11 .june-play-pack > *:last-child {
    margin-right: 0;
}

.ie11 .june-reward-list {
    display: block;
    overflow: hidden;
    font-size: 0;
    text-align: center;
}

.ie11 .june-reward-item {
    display: inline-block;
    margin: 0 14px 16px;
    vertical-align: top;
}

.ie11 .june-exchange-type-list {
    font-size: 0;
    text-align: center;
}

.ie11 .june-exchange-type {
    display: inline-block;
    margin: 0 22px;
    vertical-align: top;
}