.story_member_page .member_image {
    position: relative;
}

.story_member_page .member_image > img {
    max-width: 100%;
    border-radius: 10px;
}

.story_member_page .self_introduction {
    padding-left: 3rem;
    padding-right: 3rem;
    max-width: 100%;
}

.self_introduction .member_name {
    display: flex;
    align-items: center;
}

.self_introduction .member_name  h2 {
    font-size: 25px;
    margin: 0;
    margin-right: 1rem;
    word-wrap: break-word;
    overflow-wrap: break-word;
    max-width: calc(100% - 55px);
}

.post_icon_image {
    width: 60px;
    height: 66px;
    position: absolute;
    top: 0;
    right: 2vw;
    background: url(/static/img/safety/ins_tag.png);
    background-size: cover;
    filter: drop-shadow(0px 0px 2px rgba(0, 0, 0, 0.7));
}

.post_icon_image > .text_wrap {
    width: 100%;
    height: 100%;
    text-align: center;
    padding-top: 1rem;
}

.post_icon_image > .text_wrap > p {
    font-size: 14px;
    font-weight: bold;
    font-family: 'Black Han Sans', sans-serif !important;
    text-shadow: 
    -1px -1px 0 #fcf5c1,
    1px -1px 0 #fcf5c1,
    -1px  1px 0 #fcf5c1,
    1px  1px 0 #fcf5c1;
}

.post_icon_image  p > span {
    font-size: 18px;
}

.self_introduction .member_tag {
    display: flex;
    align-items: center;
}

.self_introduction .member_tag p {
    font-size: 14px;
    color: #dd3838;
    margin-right: 0.75rem;
}

.self_introduction .member_tag p:last-child {
    margin-right: 0;
}

.self_introduction .mamber_function {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 1rem 0;
}

.self_introduction .mamber_function .website_link > a {
    font-size: 13px;
    font-weight: bold;
    color: #451b69;
}

.self_introduction .mamber_function .website_link .link_icon {
    font-size: 14px;
    color: #959595;
    margin-right: 0.25rem;
}

.self_introduction .mamber_function .edit_btn_wrap .edit_btn {
    border-radius: 10rem;
}

.self_introduction .texarea_content {
    display: inline;
}

.self_introduction .texarea_content span {
    font-size: 12px;
    line-height: 1.5;
    color: #4d4d4d;
}

.self_introduction .member_tool_box {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 1.5rem;
}

.self_introduction .member_tool_box .tool_btn {
    font-weight: bold;
    border-radius: 10rem;
}

.self_introduction .member_tool_box .btn_wrap{
    margin-right: 1.5rem;}

.self_introduction .member_tool_box .btn_wrap:last-child {
    margin-right: 0;
}

.story_member_block {
    padding: 0 18%;
    margin: 3rem 0 2rem 0;
}

.story_member_block .story_check {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    width: 79px;
    height: 79px;
}

.story_member_block .story_check img {
    max-width: 100%;
    height: 100%;
    border-radius: 50%;
}

.story_member_block .row {
    justify-content: center;
}

.story_member_block .row > * {
    --bs-gutter-x: 4rem;
    padding-right: calc(var(--bs-gutter-x)* 0.5);
    padding-left: calc(var(--bs-gutter-x)* 0.5);
}

.story_member_block .row .col_story {
    width: auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.story_member_block .row .col_story.hidden {
    display: none;
}

.story_member_block .story_text {
    height: 30px;
    max-width: 79px;
    text-align: center;
    margin-top: 0.65rem;
}

.story_member_block .story_check.add_item {
    padding: 2rem;
    font-size: 30px;
    color: #d2d2d2;
    border: var(--border);
    background: #fafafa;
    border-radius: 50%;
    cursor: pointer;
}

.member_story_modal .user_info .tool_box .tool_btn .icon_ellipsis {
    color: #ccc;
}

.member_story_modal .user_info {
    position: relative;
}

#memberStoryModal .tool_more,
#memberGroupModal .tool_more,
#storyModal .tool_more{
    position: absolute;
    width: 100px;
    bottom: -60px;
    right: 0;
    background: #fff;
    border: var(--moreUlBorder);
    z-index: 1000;
}

#memberStoryModal .tool_more li,
#memberGroupModal .tool_more li,
#storyModal .tool_more li{
    border-bottom: var(--moreLiBorder);
    color: #6b757c;
    text-align: left;
}

#memberStoryModal .tool_more a,
#memberGroupModal .tool_more a,
#storyModal .tool_more a{
    display: block;
    padding: 10px 7px;
    width: 100%;
    border: 0;
    background: var(--contBg);
    color: #6b757c;
    font-size: 1.2rem;
    text-align: left;
    cursor: pointer;
}

#memberStoryModal a > .icon_float,
#memberGroupModal a > .icon_float {
    float: right;
}

.story_member_write .write_subject_wrap {
    display: flex;
    align-items: center;
}

.story_member_write .write_subject_text {
    flex: 1;
    display: flex;
    align-items: center;
    font-size: 14px;
}

.story_member_write .write_subject_text > p {
    font-weight: bold;
}

.story_member_write .write_subject {
    flex: 7;
}

.member_story_modal .tool_more > li > a > .icon_float {
    float: right;
}

/* member page - "more" */
.texarea_content > span.more_text {
    display: none;
}

.texarea_content > a.read_more,
.texarea_content > a.back_link {
    color: #5b5b5b;
    font-weight: bold;
}

.texarea_content > textarea {
    max-height: calc(1.5em* 5);
}



/* choice-js */
.write_select.safety .choices__inner {
    background: #fff;
}
.write_select.safety .choices__input {
    background: #fff;
    width: fit-content !important;
}
.write_select.safety .choices__list--multiple .choices__item {
    background-color: #999999;
    border: 1px solid #999999;
}

.write_select.safety .choices[data-type*=select-multiple] .choices__button,
.write_select.safety .choices[data-type*=text] .choices__button {
    border-left: none;
}


@media only screen and (max-width: 1200px) {
    .story_member_block {
        padding: 0 10%;
    }
}

@media only screen and (max-width: 768px) {
    .story_member_block {
        padding: 0 5%;
    }

    .story_member_block .row > * {
        --bs-gutter-x: 2.5rem;
    }

    .story_member_block {
        padding: 0 10px;
    }
}

@media only screen and (max-width: 767px) {
    .story_member_page .member_image {
        display: flex;
    }

    .post_icon_image {
        right: 13%;
    }

    .story_member_page .member_image > img {
        margin: 0 auto;
    }

    .story_member_page .self_introduction {
        display: flex;
        flex-direction: column;
        margin: 0 auto;
        margin-top: 2rem;
    }

    .story_member_block {
        margin: 3rem 0;
    }

    .self_introduction .texarea_content {
        word-break: break-all;
    }
}

@media only screen and (max-width: 600px) {
    .story_member_page .self_introduction {
        width: 100%;
        padding-right: calc(var(--bs-gutter-x)* 0.8);
        padding-left: calc(var(--bs-gutter-x)* 0.8);
    }

    .edit_btn_wrap .edit_btn > p,
    .member_tool_box .tool_btn > p {
        font-size: 12px;
    }

    .story_member_block .story_check {
        width: 60px;
        height: 60px;
    }

    .story_member_block .story_text > p {
        font-size: 10px;
    }

    .story_member_block .row > * {
        --bs-gutter-x: 1.35rem;
    }

    .story_member_block {
        overflow-x: auto;
        white-space: nowrap;
        width: 100%;
    }

    .story_member_block::-webkit-scrollbar {
        display: none;
    }

    .story_member_block .row {
        display: flex;
        flex-wrap: nowrap;
        justify-content: flex-start;
    }

    .post_icon_image {
        right: 7vw;
    }
}