/* 難民船イベント CSS */
.btn, .blue_btn {
    display: inline-block;
    border-style: solid;
    color: white;
    text-decoration: none;
    border-width: 1px;
    border-radius: 10px;
    padding: 3px 12px;
    text-shadow: 1px 1px 3px #000000;
}
@media screen and (width: 480px) {
    .btn, .blue_btn {
        border-width: 2px;
        border-radius: 15px;
        padding: 5px 20px;
        text-shadow: 1px 1px 4px #000000;
    }
}

.blue_btn {
    border-color: #65daf8;
    background: -webkit-linear-gradient(270deg, #015678, #41c2ce);
    background: linear-gradient(to bottom, #015678, #41c2ce);
}
.orange_btn {
    border-color: #ea5506;
    background: -webkit-linear-gradient(270deg, #ffbb5c, #ff7c36);
    background: linear-gradient(to bottom, #ffbb5c, #ff7c36);
}
.gray_btn {
    border-color: #aaaaaa;
    background: -webkit-linear-gradient(270deg, #ffffff, #b4b4b4);
    background: linear-gradient(to bottom, #ffffff, #b4b4b4);
}
.btn.btn-warning {
    border-color: #f7f845;
    background: -webkit-linear-gradient(270deg, #787714, #cecb20);
    background: linear-gradient(to bottom, #787714, #cecb20);
}
.btn.btn-danger {
    border-color: #f86565;
    background: -webkit-linear-gradient(270deg, #780101, #ce4141);
    background: linear-gradient(to bottom, #780101, #ce4141);
}
.btn.disabled, .blue_btn.disabled {
    border: 2px solid #f8e9ea;
    background: -webkit-linear-gradient(270deg, #787674, #cecacb);
    background: linear-gradient(to bottom, #787674, #cecacb);
}
.btn *, .blue_btn * {
    display: inherit;
}

* {
    box-sizing: border-box;
    font-family: sans-serif;
}
#dmkt_header_02, #dmkt_header_02 *  { /* dゲームヘッダー */
    box-sizing: content-box;
}
td span, a {
    vertical-align: initial;
}

a.info-button {
    width: 33%;
    display: inline-block;
}
a.info-button > img {
    width: 100%;
}

.card_info div.links form, .card_info .links form input[type=image]{
    display: inline-block;
}
.card_info div.links > form:not(:last-child) {
    padding-right: 7%;
}

.txtLink04Block {
    width: 100%;
    display: block;
    text-align: center;
    padding: 0.75em 0;
    background: -webkit-linear-gradient(#0d306f,#151b68);
    background: linear-gradient(#0d306f,#151b68);
    border-bottom: 1px solid #444444;
}

.deck_tabs > div.deck_tab {
    width: 100%;
}
.deck_tabs > div.deck_tab > div {
    width: 45%;
}

.event_header {
    width: 100%;
    text-align: center;
    padding-top: 3%;
}
.event_header img {
    max-width: 100%;
}

.detail-desc {
    margin-bottom: 5%;
}
.reward-link {
    display: inline-block;
    width: 45%;
    padding: 2% 1%;
    border: solid 1px #777777;
    border-radius: 5px;
    margin: 0.25em 0;
    text-decoration: none;
    background-color: #1a1a1a;
}
.reward-link.active {
    background-color: inherit;
    border-color: transparent;
}

.stat_killer {
    color: #ff7474;
}
.stat_passive {
    color:#2fc7ff;
}

/* マップのヘックス */
#map {
    width: 100%;
    text-align: center;
    overflow: hidden;
    padding: 2.5% 0;
    position: relative;
}
#map.rush {
    background: -webkit-radial-gradient(#572e3d, #250a1a);
    background: radial-gradient(#572e3d, #250a1a);
}
.hex, .hex > * {
    box-sizing: border-box;
}
.hex-wrap {
    position:relative;
    display: inline-block;
    margin: 0 -2.75%;
    pointer-events: none; /* ヘックスコンテナのクリック判定を透過させる */
    z-index: 10;
}
.hex-wrap.hex-wrap-invalid {
    z-index: 8;
}

.hex {
    display: block;
    text-decoration: none;
    color: #FFF;
    vertical-align: baseline;
}
.hex:focus {
    background-color: transparent;
}
.hex * { /* ヘックスの要素をクリック可能にする */
    pointer-events: auto;
    text-decoration: none;
}
.hex.hex-current > div { /* 現在のヘックス点滅 */
    -webkit-animation: overrided 1000ms infinite 300ms ease alternate;
    animation: overrided 1000ms infinite 300ms ease alternate;
}
.hex > div {
    border-style: solid;
    border-width: 0 2px;
    position:absolute;
    /*width: 100%;
    height: 57.7%;*/
    width: 86.6%;
    height: 50%;
    top: 25%;
    left: 7.2%;
}
.hex > div:nth-child(1) {
    -webkit-transform: rotate(60deg);
    transform: rotate(60deg);
}
.hex > div:nth-child(2) {
    -webkit-transform: rotate(-60deg);
    transform: rotate(-60deg);
}
.hex .cost_increased {
    color: #ff5252;
}
.hex .cost_reduced {
    color: #00ff00;
}

/* ヘックス 通常地点の色 */
.hex.hex-normal > div {
    border-color: #b5b5b5;
    background-color: #3a3a3a;
}
.hex.hex-normal.hex-active:not(.hex-current) > div {
    background-color: #747474;
}
.hex.hex-normal.hex-current > div {
    -webkit-animation-name: currentNormal;
    animation-name: currentNormal;
}
@keyframes currentNormal {
    100% { background-color: #747474; }
}
@-webkit-keyframes currentNormal {
    100% { background-color: #747474; }
}

/* ヘックス 地球軍拠点の色 */
.hex.hex-home-earth > div {
    border-color:#5CF1FE;
    background-color:#000c22;
}
.hex.hex-home-earth.hex-active:not(.hex-current) > div {
    background-color: #001e6f;
}
.hex.hex-home-earth.hex-current > div {
    -webkit-animation-name: currentHomeEarth;
    animation-name: currentHomeEarth;
}
@keyframes currentHomeEarth {
    100% { background-color: #001e6f; }
}
@-webkit-keyframes currentHomeEarth {
    100% { background-color: #001e6f; }
}

/* ヘックス ガミラス軍拠点の色 */
.hex.hex-home-gamilas > div {
    border-color: #e7403d;
    background-color: #221010;
}
.hex.hex-home-gamilas.hex-active:not(.hex-current) > div {
    background-color: #6f1312;
}
.hex.hex-home-gamilas.hex-current > div {
    -webkit-animation-name: currentHomeGamilas;
    animation-name: currentHomeGamilas;
}
@keyframes currentHomeGamilas {
    100% { background-color: #6f1312; }
}
@-webkit-keyframes currentHomeGamilas {
    100% { background-color: #6f1312; }
}

/* ヘックス 探索地点の色 */
.hex.hex-explore > div {
    border-color: #fef90a;
    background-color: #21220c;
}
.hex.hex-explore.hex-active:not(.hex-current) > div {
    background-color: #6d6f1e;
}
.hex.hex-explore.hex-current > div, .hex.hex-explore.rush > div {
    -webkit-animation-name: currentExplore;
    animation-name: currentExplore;
}
@keyframes currentExplore {
    100% { background-color: #6d6f1e; }
}
@-webkit-keyframes currentExplore {
    100% { background-color: #6d6f1e; }
}

.hex.hex-explore.rush > div {
    border-color: #fea907;
    background-color: #221709;
}
.hex.hex-explore.rush.hex-active:not(.hex-current) > div {
    background-color: #6f4d1b;
}
.hex.hex-explore.rush.hex-current > div, .hex.hex-explore.rush > div {
    -webkit-animation-name: currentExploreRush;
    animation-name: currentExploreRush;
}
@keyframes currentExploreRush {
    100% { background-color: #6f4d1b; }
}
@-webkit-keyframes currentExploreRush {
    100% { background-color: #6f4d1b; }
}


/* ヘックス 存在しない */
.hex.hex-invalid > div {
    border-color: #333333;
    background-color: #080808;
}
/* ヘックスの行 */
#hex-container > .hex-row:not(:first-child) {
    margin-top: -10%;
}

.move-form {
    display: none;
}
/* ヘックスの文言 */
.hex-text {
    font-size: 0.7em;
}

/* マップでの行動選択エリア */
.map-action-area {
    text-align: center;
    background-color: #091525;
    padding: 2em 0;
    border-bottom: 1px solid #4dcad5;
}
.map-action-area-e2 {
    text-align: center;
    background-color: #091525;
    padding: 1em 0;
    border-bottom: 1px solid #4dcad5;
}
@media screen and (width: 480px) {
    .map-action-area {
        border-bottom-width: 2px;
    }
}

.get-flag-info {
    border-style: solid;
    border-color: #FFFFFF;
    width: 95%;
    border-radius: 15px;
    margin: 2% auto;
    box-sizing: border-box;
    padding: 2.5%;
}

.card_info.is_lock .card_info_frame_image img, #card_thumbnails img.is_lock {
    -webkit-filter: grayscale(1);
    filter: grayscale(1);
}

.backpack-list-item {
    margin: 4% 0;
}
.backpack-actions {
    text-align: right;
    margin: 1em 1em 0.5em 0;
}
.backpack-actions form, .inline-form-block form {
    display: inline-block;
    vertical-align: top;
}
.inline-form-block form > .blue_btn, .inline-form-block form > .btn {
    vertical-align: middle;
}

#mvp-date-list {
    width: 100%;
    margin: 0.5em 0;
}
#mvp-date-list > .mvp-date-item {
    margin:0 auto 0.3em;
    position: relative;
}
.mvp-date-item > img {
    width: 100%;
    position: absolute;
    top: 0;
}
.mvp-date-item > a {
    width: 100%;
    height: 100%;
    position: relative;
    display: block;
    text-align: center;
    text-decoration: none;
    color:#FFFFFF;
}

/* battle_deckの上書き */
.card_info_frame_image {
    position: static;
    float: left;
}
.card_info > .card_info_frame > div.card_info_text {
    position: static;
    float: right;
}
.card_info_frame > .set_subcards {
    position: static;
    float: right;
}
.card_info div.links {
    clear: both;
}
.card_info .card_info_frame_image {
    border: 2px solid #6efed7;
}
.card_info .card_info_frame_image img {
    vertical-align: top;
}
.card_info_frame > .set_subcards {
    margin-right: 4px;
}
@media screen and (width: 480px) {
    .card_info_frame > .set_subcards {
        margin-right: 6px;
    }
}
.card_info_frame .sub_frame_img {
    margin-bottom: -13.5%;
    padding-top: 12px;
    width: 170px;
    display: block;
    float: right;
}
@media screen and (width: 480px) {
    .card_info_frame .sub_frame_img {
        padding-top: 18px;
        width: 256px;
    }
}
.card_info .links {
    padding: 0.5em;
}
.card_info .links > * {
    vertical-align: top;
}

/* トラップ報酬 */
.trap_reward {
    box-sizing: border-box;
    text-align: left;
    border: 0.05em solid #65daf8;
    border-radius: 0.75em;
    padding: 0.5em;
    margin: 0.5em auto;
    background-color: #000c22;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

/* バックパックとか */
.move_menu {
    position: absolute;
    bottom: 0;
    width: 100%;
}

