/* 戦闘技能アイコン */
#bat_icon {
    /* width: 4rem;
    height: 4rem; */
    background: url(../img/battle.png) no-repeat;
    background-size: 100% 100%;
    cursor: pointer;
    position: relative;
    left: 15px;
}

.form-check>.bat_icon,
.form-check>.on_bat_icon {
    width: 4rem;
    height: 4rem;
}

#bat_icon.on_bat_icon {
    background: url(../img/battle3.png) no-repeat;
    background-size: 100% 100%;
}

/* PC限定 */
@media all and (min-width: 1024px) {
    #bat_icon:hover {
        background: url(../img/battle2.png) no-repeat;
        background-size: 100% 100%;
    }
}

/* 探索技能アイコン */
#dis_icon {
    /* width: 4rem;
    height: 4rem; */
    background: url(../img/discovery.png) no-repeat;
    background-size: 100% 100%;
    cursor: pointer;
    position: relative;
    left: 15px;
}

.form-check>.dis_icon,
.form-check>.on_dis_icon {
    width: 4rem;
    height: 4rem;
}

#dis_icon.on_dis_icon {
    background: url(../img/discovery3.png) no-repeat;
    background-size: 100% 100%;
}

/* PC限定 */
@media all and (min-width: 1024px) {
    #dis_icon:hover {
        background: url(../img/discovery2.png) no-repeat;
        background-size:
            100% 100%;
    }
}

/* 行動技能アイコン */
#act_icon {
    /* width: 4rem;
    height: 4rem; */
    background: url(../img/action.png) no-repeat;
    background-size: 100% 100%;
    cursor: pointer;
    position: relative;
    left: 15px;
}

.form-check>.act_icon,
.form-check>.on_act_icon {
    width: 4rem;
    height: 4rem;
}

#act_icon.on_act_icon {
    background: url(../img/action3.png) no-repeat;
    background-size: 100% 100%;
}

/* PC限定 */
@media all and (min-width: 1024px) {
    #act_icon:hover {
        background: url(../img/action2.png) no-repeat;
        background-size: 100% 100%;
    }
}

/* 交渉技能アイコン */
#neg_icon {
    /* width: 4rem;
    height: 4rem; */
    background: url(../img/negotiate.png) no-repeat;
    background-size: 100% 100%;
    cursor: pointer;
    position: relative;
    left: 15px;
}

.form-check>.neg_icon,
.form-check>.on_neg_icon {
    width: 4rem;
    height: 4rem;
}

#neg_icon.on_neg_icon {
    background: url(../img/negotiate3.png) no-repeat;
    background-size: 100% 100%;
}

/* PC限定 */
@media all and (min-width: 1024px) {
    #neg_icon:hover {
        background: url(../img/negotiate2.png) no-repeat;
        background-size: 100% 100%;
    }
}

/* 知識技能アイコン */
#kno_icon {
    /* width: 4rem;
    height: 4rem; */
    background: url(../img/knowledge.png) no-repeat;
    background-size: 100% 100%;
    cursor: pointer;
    position: relative;
    left: 15px;
}

.form-check>.kno_icon,
.form-check>.on_kno_icon {
    width: 4rem;
    height: 4rem;
}

#kno_icon.on_kno_icon {
    background: url(../img/knowledge3.png) no-repeat;
    background-size: 100% 100%;
}

/* PC限定 */
@media all and (min-width: 1024px) {
    #kno_icon:hover {
        background: url(../img/knowledge2.png) no-repeat;
        background-size: 100% 100%;
    }
}

.deletebox {
    width: 20%;
    height: auto;
}

/* .Round_button {
    display: inline-block;
    text-decoration: none;
    background: #fc3131;
    color: #FFF;
    width: 40px;
    height: 90%;
    line-height: 40px;
    border-radius: 50%;
    text-align: center;
    font-weight: bold;
    overflow: hidden;
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.29);
    border-bottom: solid 3px #bd6565;
    transition: .4s;
  } */

.Round_button {
    display: inline-block;
    text-decoration: none;
    background: #fc3131;
    color: #FFF;
    width: 2.3rem;
    height: 2.3rem;
    line-height: 2.3rem;
    border-radius: 50%;
    text-align: center;
    font-weight: bold;
    overflow: hidden;
    box-shadow: 0px .1rem .1rem rgba(0, 0, 0, 0.29);
    border-bottom: solid .15rem #bd6565;
    transition: .4s;
}

.Round_button:active {
    -webkit-transform: translateY(2px);
    transform: translateY(2px);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0.15);
    border-bottom: none;
}

.imgDelBox {
    width: 1.5rem;
    height: 1.5rem;
    background-image: url(../img/deletebox.png);
    background-size: cover;
    text-align: center;
    top: 0.35rem;
    margin: auto;
    position: relative;
    animation: fadeIn 0.2s ease 0.3s 1 normal;
}


/* 戦闘技能アイコン */
.bat_icon {
    /* width: 4rem;
    height: 4rem; */
    background: url(../img/battle.png) no-repeat;
    background-size: 100% 100%;
    cursor: pointer;
    position: relative;
    left: 15px;
}

.on_bat_icon {
    /* width: 4rem;
    height: 4rem; */
    background: url(../img/battle3.png) no-repeat;
    background-size: 100% 100%;
    cursor: pointer;
    position: relative;
    left: 15px;
}

/* 探索技能アイコン */
.dis_icon {
    /* width: 4rem;
    height: 4rem; */
    background: url(../img/discovery.png) no-repeat;
    background-size: 100% 100%;
    cursor: pointer;
    position: relative;
    left: 15px;
}

.on_dis_icon {
    /* width: 4rem;
    height: 4rem; */
    background: url(../img/discovery3.png) no-repeat;
    background-size: 100% 100%;
    cursor: pointer;
    position: relative;
    left: 15px;
}

/* 行動技能アイコン */
.act_icon {
    /* width: 4rem;
    height: 4rem; */
    background: url(../img/action.png) no-repeat;
    background-size: 100% 100%;
    cursor: pointer;
    position: relative;
    left: 15px;
}

.on_act_icon {
    /* width: 4rem;
    height: 4rem; */
    background: url(../img/action3.png) no-repeat;
    background-size: 100% 100%;
    cursor: pointer;
    position: relative;
    left: 15px;
}

/* 交渉技能アイコン */
.neg_icon {
    /* width: 4rem;
    height: 4rem; */
    background: url(../img/negotiate.png) no-repeat;
    background-size: 100% 100%;
    cursor: pointer;
    position: relative;
    left: 15px;
}

.on_neg_icon {
    /* width: 4rem;
    height: 4rem; */
    background: url(../img/negotiate3.png) no-repeat;
    background-size: 100% 100%;
    cursor: pointer;
    position: relative;
    left: 15px;
}

/* 知識技能アイコン */
.kno_icon {
    /* width: 4rem;
    height: 4rem; */
    background: url(../img/knowledge.png) no-repeat;
    background-size: 100% 100%;
    cursor: pointer;
    position: relative;
    left: 15px;
}

.on_kno_icon {
    /* width: 4rem;
    height: 4rem; */
    background: url(../img/knowledge3.png) no-repeat;
    background-size: 100% 100%;
    cursor: pointer;
    position: relative;
    left: 15px;
}