/* プロフィール */
#profile {
    /* background: hsla(180, 40%, 70%, 80%); */
    border: solid rgba(186, 255, 252, 0.65);
    /* border: none; */
    border-radius: 50px;
    /* height: 100%; */
    margin: 3% 10% 3% 10%;
    padding: 30px;
}

/* 下線部 */
.dynamicline {
    width: 100%;
    height: 100%;
    font-size: 1rem;
    border: none;
    outline: none;
    border-bottom: 1px solid #d1d5db !important;
}

/* 下線部アニメーション */
.underline {
    width: 100%;
    height: 2px;
    background: #fff;
    transform-origin: center;
    transform: scaleX(0);
    position: relative;
    top: -2px;
}

/* 下線部アニメーション */
.dynamicline:focus+.underline {
    transform: scaleX(1);
    transition: transform 0.25s ease-out;
    -webkit-transform: scaleX(1);
    -webkit-transition: transform 0.5s ease-out;
}

/* プロフィールのform位置調整 */
#profile label {
    margin-top: 0.5rem;
    color: #fff;
}

/* プロフィールのselect表示位置調整 */
#profile select {
    /* padding-left: 0.6rem; */
    background-color: #1F3635;
    border: none;
    outline: none;
    border-bottom: 2px solid #999;
    color: #fff;
}

/* プロフィールのselectフォーカス */
#profile select:focus {
    border-bottom-color: #fff;
}

/* プロフィールのinput表示位置調整 */
#profile input {
    background-color: #1F3635;
    border: none;
    outline: none;
    border-bottom: 2px solid #999;
    color: #fff;
}

/* プロフィールのinputフォーカス */
#profile input:focus {
    border-bottom-color: #fff;
}

/* プロフィールのform-control表示位置調整 */
#profile .form-control {
    background-color: #1F3635;
    border: none;
    outline: none;
    border-bottom: 2px solid #999;
    color: #fff;
}

/* プロフィールのform-controlフォーカス */
#profile .form-control:focus {
    border-bottom-color: #fff;
}

/* 画像選択 */
#viewImage {
    width: 80%;
}

/* 画像選択ホバー */
#viewImage:hover {
    animation: bound 2s ease-out infinite;
    opacity: 1;
}