@charset "utf-8";

/*********************************************************************
*
*  For ALL
*
*********************************************************************/

/* ---------------------------------------------------- */
/* cf */
/* ---------------------------------------------------- */
.cf:after {
    content: ".";
    display: block;
    height: 0;
    font-size: 0;
    clear: both;
    visibility: hidden;
}

.cf {
    display: block;
}


/* ---------------------------------------------------- */
/* web font */
/* ---------------------------------------------------- */
/* Google font */
@import url("https://fonts.googleapis.com/css?family=Noto+Sans+JP:400,700&display=swap&subset=japanese");
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap');

/* Adobe font
headタグ内にscript記載
*/

/* ---------------------------------------------------- */
/* cs_ff */
/* ---------------------------------------------------- */
.cs_ff_go {
    font-family: 'Noto Sans JP', "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", sans-serif;
}

.cs_ff_en1 {
    font-family: 'Roboto', 'Noto Sans JP', "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", sans-serif;
}

/* ---------------------------------------------------- */
/* cs_e_op */
/* ---------------------------------------------------- */
@media (min-width: 1040px) {
    .cs_e_op {
        transition: opacity 0.3s ease-in-out;
    }

    .cs_e_op:hover {
        opacity: 0.6;
    }
}

/* ---------------------------------------------------- */
/* pc/sp */
/* ---------------------------------------------------- */
@media (min-width: 1040px) {
    .cs_none_pc {
        display: none !important;
    }
}

@media (max-width: 1039px) {
    .cs_none_sp {
        display: none !important;
    }
}

@media screen and (max-width: 374px) {
    .cs_none_sp_old {
        display: none !important;
    }
}

/* ---------------------------------------------------- */
/* cs_sec */
/* ---------------------------------------------------- */
.cs_sec_wrap {
    position: relative;
}

.cs_sec_inner {
    position: relative;
    margin-left: auto;
    margin-right: auto;
}

@media (min-width: 1040px) {
    .cs_sec_wrap {
        padding-top: 60px;
        padding-bottom: 60px;
    }

    .cs_sec_inner {
        width: 1000px;
    }

    .cs_sec_inner_wide {
        width: calc(100% - 60px);
    }
}

@media (max-width: 1039px) {
    .cs_sec_wrap {
        padding-top: 40px;
        padding-bottom: 40px;
    }

    .cs_sec_inner {
        width: calc(100% - 30px);
    }
}

/* ---------------------------------------------------- */
/* cs_sec_mondaiprint */
/* ---------------------------------------------------- */
.cs_sec_wrap_Q {
    position: relative;
}

.cs_sec_wrap_A {
    position: relative;
    margin-left: 260px;
}

.cs_sec_inner_wide_Q {
    width: 80%
}

.cs_sec_inner_wide_A {
    width: 95%
}

@media (min-width: 1040px) {
    .cs_sec_wrap_Q {
        padding-top: 0px;
        padding-bottom: 25px;
    }

    .cs_sec_wrap_A {
        padding-top: 25px;
        padding-bottom: 25px;
    }

    .cs_sec_inner_wide_Q {
        width: 80%
    }

    .cs_sec_inner_wide_A {
        width: 95%
    }
}

@media (max-width: 1039px) {
    .cs_sec_wrap_Q {
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .cs_sec_wrap_A {
        padding-top: 20px;
        padding-bottom: 20px;
        margin-left: 0px;
    }

    .cs_sec_inner_wide_Q {
        width: 95%
    }
}

/* ---------------------------------------------------- */
/* article */
/* ---------------------------------------------------- */
.cs_sec_inner>article+article {
    margin-top: 50px;
}

@media (max-width: 1039px) {
    .cs_sec_inner>article+article {
        margin-top: 40px;
    }
}

@media (max-width: 767px) {
    .cs_sec_inner>article+article {
        margin-top: 25px;
    }
}

/* ---------------------------------------------------- */
/* cs_desc */
/* ---------------------------------------------------- */
.cs_desc_1 {
    line-height: 1.7;
}

.cs_desc_1 p {
    text-align: justify;
}

.cs_desc_1>*+* {
    margin-top: 1.5em;
}

@media (max-width: 1039px) {
    .cs_desc_1>*+* {
        margin-top: 1.5em;
    }
}

/* ---------------------------------------------------- */
/* cs_ul_1 */
/* ---------------------------------------------------- */
.cs_ul_1 {
    margin-left: 1.5em;
    list-style: disc;
    line-height: 2.0;
}

/* ---------------------------------------------------- */
/* cs_breadcrumb_1 */
/* ---------------------------------------------------- */
.cs_breadcrumb_1 {
    padding: 0 10px;
}

*+.cs_breadcrumb_1 {
    margin-top: 15px;
}

.cs_breadcrumb_1 ul {
    display: flex;
    width: 100%;
    font-size: 1.34rem;
}

.cs_breadcrumb_1 li {
    position: relative;
}

.cs_breadcrumb_1 li:last-child {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cs_breadcrumb_1 li+li {
    padding-left: 17px;
}

.cs_breadcrumb_1 li+li::before {
    content: ">";
    position: absolute;
    font-size: 1.3rem;
    left: 5px;
    top: 0;
    display: block;
}

.cs_breadcrumb_1 span {
    /* color: #697d8f; */
    white-space: nowrap;
}

.cs_breadcrumb_1 a {
    color: blue;
    text-decoration: underline;
}

@media (max-width: 767px) {
    .cs_breadcrumb_1 {
        padding: 0;
        overflow: auto;
        overflow-y: hidden;
        word-break: keep-all;
        -webkit-overflow-scrolling: touch;
    }
    
    .cs_breadcrumb_1::-webkit-scrollbar{
        height: 8px;
        width: 10px;
    }
    .cs_breadcrumb_1::-webkit-scrollbar-track{
        background: #fff;
        border-left: solid 1px #ececec;
        border-radius: 8px;
    }
    .cs_breadcrumb_1::-webkit-scrollbar-thumb{
        background: #ccc;
        border-radius: 8px;
        box-shadow: inset 0 0 0 2px #fff;
    }

    .cs_breadcrumb_1 li:last-child {
        overflow: scroll;
        text-overflow: clip;
    }

    .cs_breadcrumb_1 ul {
        font-size: 1.15rem;
    }

    .cs_breadcrumb_1 li:last-child {
        overflow: visible;
        text-overflow: clip;
    }

    .cs_breadcrumb_1 li+li {
        padding-left: 15px;
    }

    .cs_breadcrumb_1 li+li::before {
        left: 5px;
        font-size: 1.15rem;
    }

}

/* ---------------------------------------------------- */
/* cs_sort_1 */
/* ---------------------------------------------------- */
.cs_sort_1+* {
    margin-top: 30px;
}

.cs_sort_1 ul {
    display: flex;
    flex-wrap: wrap;
    margin-right: -10px;
    margin-bottom: -10px;
}

.cs_sort_1 li {
    margin-right: 10px;
    margin-bottom: 10px;
}

.cs_sort_1 label {
    display: flex;
    align-items: center;
    padding: 8px 10px;
    color: #FFF;
    line-height: 1;
    background-color: #1c4aa4;
    border-radius: 2px;
}

.cs_sort_1 label span {
    margin-left: 5px;
}

.cs_sort_1 label.color_0 {
    color: #335371;
    background-color: transparent;
}

.cs_sort_1 label.color_1 {
    background-color: #1c4aa4;
}

.cs_sort_1 label.color_2 {
    background-color: #d53d44;
}

.cs_sort_1 label.color_3 {
    background-color: #dd8a51;
}

.cs_sort_1 label.color_4 {
    background-color: #643bb9;
}

.cs_sort_1 label.color_5 {
    background-color: #399039;
}

.cs_sort_1 label.color_6 {
    background-color: #c0bb25;
}

.cs_sort_1 label.color_7 {
    background-color: #888888;
}

@media (max-width: 1039px) {
    .cs_sort_1+* {
        margin-top: 20px;
    }

    .cs_sort_1 label {
        font-size: 1.3rem;
    }

}

/* ---------------------------------------------------- */
/* cs_ttl_1 */
/* ---------------------------------------------------- */
.cs_ttl_1 {
    display: flex;
    font-size: 2.4rem;
    letter-spacing: 0.05em;
}

.cs_ttl_1+* {
    margin-top: 20px;
}

.cs_ttl_1 i {
    flex: none;
    display: block;
    margin: 0 10px;
    width: 24px;
    height: 24px;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    transform: translateY(7px);
}

.cs_ttl_1 span {
    flex: auto;
    width: auto;
}

@media (max-width: 1039px) {
    .cs_ttl_1 {
        font-size: 1.8rem;
    }

    .cs_ttl_1+* {
        margin-top: 15px;
    }

    .cs_ttl_1 i {
        margin: 0 5px;
        width: 20px;
        height: 20px;
        transform: translateY(5px);
    }
}

/* ---------------------------------------------------- */
/* cs_ttl_2 */
/* ---------------------------------------------------- */
.cs_ttl_2 {
    position: relative;
    display: flex;
    font-size: 1.8rem;
    border-top: 1px solid #d7dfe4;
    border-bottom: 1px solid #d7dfe4;
    background-color: #FFF;
    z-index: 2;
}

.cs_ttl_2 span {
    display: block;
    padding: 20px;
    border-left: 10px solid #335371;
}

.cs_ttl_2.color_1 span {
    border-color: #1c4aa4;
}

.cs_ttl_2.color_2 span {
    border-color: #d53d44;
}

.cs_ttl_2.color_3 span {
    border-color: #dd8a51;
}

.cs_ttl_2.color_4 span {
    border-color: #643bb9;
}

.cs_ttl_2.color_5 span {
    border-color: #399039;
}

.cs_ttl_2.color_6 span {
    border-color: #c0bb25;
}

.cs_ttl_2.color_7 span {
    border-color: #888888;
}

@media (max-width: 1039px) {
    .cs_ttl_2 span {
        font-size: 1.55rem;
        padding: 20px 10px;
        border-width: 5px;
    }
}

@media (max-width: 767px) {
    .cs_ttl_2 span {
        font-size: 1.45rem;
    }
}

/* ---------------------------------------------------- */
/* cs_ttl_3 */
/* ---------------------------------------------------- */
.cs_ttl_3 {
    padding: 20px;
    color: #FFF;
    font-size: 1.8rem;
    font-weight: 700;
    background-color: #335371;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

.cs_ttl_3.color_1 {
    background-color: #1c4aa4;
}

.cs_ttl_3.color_2 {
    background-color: #d53d44;
}

.cs_ttl_3.color_3 {
    background-color: #dd8a51;
}

.cs_ttl_3.color_4 {
    background-color: #643bb9;
}

.cs_ttl_3.color_5 {
    background-color: #399039;
}

.cs_ttl_3.color_6 {
    background-color: #c0bb25;
}

.cs_ttl_3.color_7 {
    background-color: #888888;
}

@media (max-width: 1039px) {
    .cs_ttl_3 {
        padding: 20px 10px;
    }
}

@media (max-width: 767px) {
    .cs_ttl_3 {
        padding: 12px 10px;
        font-size: 1.65rem;
    }
}

/* ---------------------------------------------------- */
/* cs_ttl_4 */
/* ---------------------------------------------------- */
.cs_ttl_4 {
    position: relative;
    display: table;
    margin-bottom: -10px;
    padding: 25px 80px;
    font-size: 2.0rem;
    font-weight: 700;
    background-color: #FFF;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    z-index: 2;
}

.cs_ttl_4::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -10px;
    display: block;
    width: calc(100% + 10px);
    height: 20px;
    background-color: #FFF;
    z-index: 2;
}

@media (max-width: 1039px) {
    .cs_ttl_4 {
        padding: 20px 20px;
        font-size: 1.8rem;
    }

}

@media (max-width: 767px) {
    .cs_ttl_4 {
        padding: 15px 15px;
        font-size: 1.7rem;
    }

}

/* ---------------------------------------------------- */
/* cs_ttl_5 */
/* ---------------------------------------------------- */
.cs_ttl_5 {
    display: flex;
    font-size: 2.2rem;
    letter-spacing: 0.05em;
}

.cs_ttl_5+* {
    margin-top: 15px;
}

.cs_ttl_5 i {
    flex: none;
    display: block;
    margin: 0 10px;
    width: 22px;
    height: 22px;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    transform: translateY(7px);
}

.cs_ttl_5 span {
    flex: auto;
    width: auto;
}

@media (max-width: 1039px) {
    .cs_ttl_5 {
        font-size: 1.9rem;
    }

    .cs_ttl_5+* {
        margin-top: 10px;
    }

    .cs_ttl_5 i {
        margin: 0 5px;
        width: 18px;
        height: 18px;
        transform: translateY(5px);
    }
}


@media (max-width: 767px) {
    .cs_ttl_5 {
        font-size: 1.75rem;
    }
}


/* ---------------------------------------------------- */
/* cs_flex_wrap_1 */
/* ---------------------------------------------------- */
.cs_flex_wrap_1 {
    display: flex;
    justify-content: space-between;
}

.cs_flex_wrap_1>.cs_col_1 {
    width: 78%;
}

.cs_flex_wrap_1>.cs_col_2 {
    width: 20%;
}

@media (max-width: 1039px) {
    .cs_flex_wrap_1 {
        display: block;
    }

    .cs_flex_wrap_1>.cs_col_1 {
        width: auto;
    }

    .cs_flex_wrap_1>.cs_col_2 {
        margin-top: 20px;
        width: auto;
    }
}

/* ---------------------------------------------------- */
/* cs_deco */
/* ---------------------------------------------------- */
.cs_deco_border_1 {
    border: 1px solid #8dc8ec;
}

.cs_deco_bg_1 {
    background-color: #FFF;
}

.cs_deco_shadow_1 {
    box-shadow: 0px 0px 10px 0px rgba(51, 118, 170, 0.2);
}

.cs_deco_radius_1 {
    border-radius: 10px;
    overflow: hidden;
}

/* ---------------------------------------------------- */
/* cs_ico_ */
/* ---------------------------------------------------- */
.cs_ico_calendar_2 {
    background-image: url(../img/ico/calendar_2.svg);
}

.cs_ico_doc_1 {
    background-image: url(../img/ico/doc_1.svg);
}

.cs_ico_doc_2 {
    background-image: url(../img/ico/doc_2.svg);
}

.cs_ico_note_1 {
    background-image: url(../img/ico/note_1.svg);
    transform: translateX(10%);
}

.cs_ico_book_1 {
    background-image: url(../img/ico/book_1.svg);
}

.cs_ico_book_2 {
    background-image: url(../img/ico/book_2.svg);
}

.cs_ico_pen_1 {
    background-image: url(../img/ico/pen_1.svg);
}

.cs_ico_school_1 {
    background-image: url(../img/ico/school_1.svg);
}

.cs_ico_cap_1 {
    background-image: url(../img/ico/cap_1.svg);
}

.cs_ico_cap_2 {
    background-image: url(../img/ico/cap_2.svg);
}

.cs_ico_cap_3 {
    background-image: url(../img/ico/cap_3.svg);
}

.cs_ico_paper_1 {
    background-image: url(../img/ico/paper_1.svg);
    transform: translateX(10%);
}

.cs_ico_stand_1 {
    background-image: url(../img/ico/stand_1.svg);
}

.cs_ico_cover_1 {
    background-image: url(../img/ico/cover_1.svg);
}

.cs_ico_cover_2 {
    background-image: url(../img/ico/cover_2.svg);
}

.cs_ico_cover_3 {
    background-image: url(../img/ico/cover_3.svg);
}

.cs_ico_cover_4 {
    background-image: url(../img/ico/cover_4.svg);
}

.cs_ico_cover_5 {
    background-image: url(../img/ico/cover_5.svg);
}

.cs_ico_cover_6 {
    background-image: url(../img/ico/cover_6.svg);
}

.cs_ico_movie_1 {
    background-image: url(../img/ico/movie_1.svg);
}

.cs_ico_close_2 {
    background-image: url(../img/ico/close_2.svg);
}

.cs_ico_correct_1 {
    background-image: url(../img/ico/correct_1.svg);
}

.cs_ico_incorrect_1 {
    background-image: url(../img/ico/incorrect_1.svg);
}


/* ---------------------------------------------------- */
/* cs_rate_1 */
/* ---------------------------------------------------- */
.cs_rate_1 {
    display: flex;
    justify-content: center;
}

.cs_rate_1::before,
.cs_rate_1::after,
.cs_rate_1>span {
    content: "";
    display: block;
    width: 18px;
    height: 18px;
    background-image: url(../img/ico/star_1.svg);
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.cs_rate_1>span {
    margin: 0 5px;
}

.cs_rate_1.is_2::after {
    opacity: 0.3;
}

.cs_rate_1.is_1::after,
.cs_rate_1.is_1>span {
    opacity: 0.3;
}

/* ---------------------------------------------------- */
/* cs_rate_2 */
/* ---------------------------------------------------- */
.cs_rate_2 {
    display: flex;
    justify-content: center;
}

.cs_rate_2::before,
.cs_rate_2::after,
.cs_rate_2>span {
    content: "";
    display: block;
    width: 24px;
    height: 24px;
    background-image: url(../img/ico/check_1.svg);
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.cs_rate_2>span {
    margin: 0 5px;
}

.cs_rate_2.is_2::after {
    display: none;
}

.cs_rate_2.is_1::after,
.cs_rate_2.is_1>span {
    display: none;
}

/* ---------------------------------------------------- */
/* cs_list_item_1 */
/* ---------------------------------------------------- */
.cs_list_item_1 {
    display: flex;
}

.cs_list_item_1 {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.cs_list_item_1>.col {
    padding: 0 1px;
    flex: none;

}

.cs_list_item_1>.col:nth-of-type(1) {
    width: 22%;
}

.cs_list_item_1>.col:nth-of-type(2) {
    width: 50%;
}

.cs_list_item_1>.col:nth-of-type(3) {
    width: 15%;
}

.cs_list_item_1>.col:nth-of-type(4) {
    width: 60px;
    text-align: center;
}

.cs_list_item_1 .th {
    color: #798693;
    font-size: 1.3rem;
}

.cs_list_item_1 .btn_wrap {
    display: flex;
}

.cs_list_item_1 .btn_wrap .btn+.btn {
    margin-left: 10px;
}

.cs_list_item_1 .btn_wrap .btn2+.btn2 {
    margin-left: 10px;
}

.cs_list_item_1 .btn_bookmark {
    display: block;
    margin: 0 auto;
    width: 30px;
    height: 30px;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    background-image: url(../img/ico/bookmark_1.svg);
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    opacity: 0.5;
    cursor: pointer;
}

.cs_list_item_1 .cur {
    display: block;
    margin: 0 auto;
    width: 20px;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    background-position: center;
    background-size: contain;
    background-image: url(../img/ico/cur.png);
}

.movie {
    float: right;
    position: relative;
    top: -52px;
    margin: 0 auto;
    margin-right: 30px;
    width: 20px;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    background-position: center;
    background-size: contain;
    background-image: url(../img/ico/cinema_li.png);
}

.educated {
    float: right;
    position: relative;
    top: -50px;
    margin: 0 auto;
    margin-right: 10px;
    width: 20px;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    background-position: center;
    background-size: contain;
    background-image: url(../img/ico/edit-document_li.png);
}

.cs_list_item_1 .btn_bookmark.is_check {
    opacity: 1;
}

.bookmark .btn_bookmark {
    display: block;
    margin: 0 auto;
    width: 30px;
    height: 30px;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    background-image: url(../img/ico/bookmark_1.svg);
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    opacity: 0.5;
    cursor: pointer;
}

.bookmark .btn_bookmark.is_check {
    opacity: 1;
}

.cs_list_item_1 .ico_stats {
    display: block;
    margin: 0 auto;
    width: 30px;
    height: 30px;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    background-image: url(../img/ico/stats_1.png);
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    opacity: 0.5;
}

.cs_list_item_1 .ico_stats.is_check {
    opacity: 1;
}

.btn_review {
    display: block;
    margin: 0 auto;
    width: 30px;
    height: 30px;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    background-image: url(../img/ico/hukuro.png);
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    opacity: 1;
}

@media (max-width: 1039px) {
    .cs_list_item_1>.col:nth-of-type(1) {
        width: 37%;
    }

    .cs_list_item_1>.col:nth-of-type(2) {
        width: 31%;
    }

    .cs_list_item_1>.col:nth-of-type(3) {
        width: 17%;
    }

    .cs_list_item_1>.col:nth-of-type(4) {
        width: 15%;
    }

    .cs_list_item_1 .th {
        font-size: 1.1rem;
    }

    .cs_list_item_1 .btn_wrap .btn+.btn {
        margin-left: 5px;
    }

    .movie {
        top: -52px;
        width: 30px;
    }
    .educated {
        top: -50px;
        width: 30px;
    }
}
@media (max-width: 767px) {
    .cs_list_item_1 {
        justify-content: flex-start;
    }

    .cs_list_item_1 .btn_wrap .btn+.btn {
        margin-left: 3px;
    }
    
    .movie {
        top: -42px;
        width: 25px;
    }
    .educated {
        top: -40px;
        width: 25px;
    }
}

/* ---------------------------------------------------- */
/* cs_list_1 */
/* ---------------------------------------------------- */
.cs_list_1>ul>li {
    padding: 10px 30px;
    background-color: #FFF;
}

.cs_list_1>ul>li+li {
    border-top: 1px solid #d7dfe4;
}

@media (max-width: 1039px) {
    .cs_list_1 {
        overflow-x: auto;
        font-size: 1.5rem;
    }

    .cs_list_1>ul {
        min-width: 700px;
    }

    .cs_list_1>ul>li {
        padding: 10px 10px;
    }
}

@media (max-width: 767px) {
    .cs_list_1 {
        font-size: 1.4rem;
    }

    .cs_list_1>ul {
        min-width: 350px;
    }

    .cs_list_1>ul>li {
        padding: 5px 5px;
    }
}

/* ---------------------------------------------------- */
/* cs_list_3 */
/* ---------------------------------------------------- */
.cs_list_3>ul>li {
    background-color: #FFF;
}

.cs_list_3>ul>li+li {
    border-top: 1px solid #d7dfe4;
}

.cs_list_3 .btn_toggle {
    position: relative;
    display: block;
    padding: 20px 45px 20px 20px;
}

.cs_list_3 .btn_toggle::after {
    content: "";
    position: absolute;
    right: 20px;
    top: 50%;
    display: block;
    width: 8px;
    height: 8px;
    border-top: 2px solid #335371;
    border-right: 2px solid #335371;
    transform: translateY(-80%) rotate(135deg);
    transition: 0.3s ease-in-out;
}

.cs_list_3 .btn_toggle.is_show::after {
    transform: translateY(-40%) rotate(-45deg);
}

.cs_list_3 .toggle_wrap {
    display: none;
}

.cs_list_3 .toggle_wrap>ul {
    padding: 0 30px 10px;
}

.cs_list_3 .toggle_wrap>ul>li {
    padding: 10px 20px;
}

.cs_list_3 .toggle_wrap>ul>li+li {
    border-top: 1px dotted #d7dfe4;
}

@media (max-width: 1039px) {
    .cs_list_3 .btn_toggle {
        padding: 20px 40px 20px 10px;
    }

    .cs_list_3 .toggle_wrap {
        overflow-x: auto;
    }

    .cs_list_3 .toggle_wrap>ul {
        padding: 0 10px 10px;
        min-width: 700px;
    }

    .cs_list_3 .toggle_wrap>ul>li {
        padding: 10px 10px;
    }
}

@media (max-width: 767px) {
    .cs_list_3 .btn_toggle {
        padding: 15px 40px 15px 10px;
    }

    .cs_list_3 .toggle_wrap>ul {
        padding: 0 7px 7px;
        min-width: 350px;
    }

    .cs_list_3 .toggle_wrap>ul>li {
        padding: 6px 3px;
    }
}

/* ---------------------------------------------------- */
/* cs_list_4 */
/* ---------------------------------------------------- */
.cs_list_4>ul>li {
    background-color: #FFF;
}

.cs_list_4>ul>li+li {
    border-top: 1px solid #d7dfe4;
}

.cs_list_4 a {
    display: block;
    padding: 20px;
}

@media (max-width: 1039px) {
    .cs_list_4 a {
        padding: 20px 8px;
    }
}

/* ---------------------------------------------------- */
/* cs_list_5 */
/* ---------------------------------------------------- */
.cs_list_5>ul>li {
    background-color: #FFF;
}

.cs_list_5>ul>li+li {
    border-top: 1px dotted #d7dfe4;
}

.cs_list_5 a {
    display: block;
    padding: 20px;
}

.cs_list_5 .ttl {
    position: relative;
    padding-left: 20px;
}

.cs_list_5 .ttl::before {
    content: "";
    position: absolute;
    left: 0;
    top: 7px;
    display: block;
    width: 10px;
    height: 10px;
    background-color: #1c4aa4;
    border-radius: 50%;
}

.cs_list_5.color_1 .ttl::before {
    background-color: #1c4aa4;
}

.cs_list_5.color_2 .ttl::before {
    background-color: #d53d44;
}

.cs_list_5.color_3 .ttl::before {
    background-color: #dd8a51;
}

.cs_list_5.color_4 .ttl::before {
    background-color: #643bb9;
}

.cs_list_5.color_5 .ttl::before {
    background-color: #399039;
}

.cs_list_5.color_6 .ttl::before {
    background-color: #c0bb25;
}

.cs_list_5.color_7 .ttl::before {
    background-color: #888888;
}

@media (max-width: 1039px) {
    .cs_list_5 a {
        padding: 20px 8px;
        background-repeat: no-repeat;
    }

    .cs_list_5 .ttl {
        font-size: 1.5rem;
    }
}

@media (max-width: 767px) {
    .cs_list_5 a {
        padding: 15px 8px;
        background-repeat: no-repeat;
    }

    .cs_list_5 .ttl {
        font-size: 1.4rem;
    }

    .cs_list_5 .ttl::before {
        top: 6px;
        width: 8px;
        height: 8px;
    }
}

/* ---------------------------------------------------- */
/* cs_list_6 */
/* ---------------------------------------------------- */
.cs_list_6>ul {
    border-top: 1px solid #d7dfe4;
}

.cs_list_6>ul>li {
    border-bottom: 1px solid #d7dfe4;
    background-color: #FFF;
}

.cs_list_6 a {
    display: block;
    padding: 20px;
    border-left: 10px solid #1c4aa4;
}

.cs_list_6.color_1 a {
    border-color: #1c4aa4;
}

.cs_list_6.color_2 a {
    border-color: #d53d44;
}

.cs_list_6.color_3 a {
    border-color: #dd8a51;
}

.cs_list_6.color_4 a {
    border-color: #643bb9;
}

.cs_list_6.color_5 a {
    border-color: #399039;
}

.cs_list_6.color_6 a {
    border-color: #c0bb25;
}

.cs_list_6.color_7 a {
    border-color: #888888;
}

.cs_list_6 .ttl {
    font-size: 2.0rem;
}

@media (max-width: 1039px) {
    .cs_list_6 a {
        padding: 20px 8px;
        border-width: 5px;
        background-repeat: no-repeat;
    }

    .cs_list_6 .ttl {
        font-size: 1.6rem;
    }
}

@media (max-width: 767px) {
    .cs_list_6 a {
        padding: 15px 8px;
        background-repeat: no-repeat;
    }

    .cs_list_6 .ttl {
        font-size: 1.4rem;
    }

    .cs_list_6 .ttl::before {
        top: 6px;
        width: 8px;
        height: 8px;
    }
}

/* ---------------------------------------------------- */
/* cs_list_7 */
/* ---------------------------------------------------- */
.cs_list_7>ul {
    display: flex;
    flex-wrap: wrap;
    margin-right: -20px;
    margin-bottom: -20px;
}

.cs_list_7>ul>li {
    margin-bottom: 20px;
    margin-right: 20px;
    width: calc(25% - 20px);
}

.cs_list_7 a {
    display: flex;
    justify-content: center;
    align-content: center;
    flex-wrap: wrap;
    height: 235px;
}

.cs_list_7 .ttl {
    margin-bottom: 10px;
    width: 100%;
    color: #007bc9;
    font-weight: 700;
    text-align: center;
}

.cs_list_7 i {
    display: block;
    width: 95px;
    height: 95px;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

@media (max-width: 1039px) {
    .cs_list_7>ul {
        display: flex;
        flex-wrap: wrap;
        margin-right: -10px;
        margin-bottom: -10px;
    }

    .cs_list_7>ul>li {
        margin-bottom: 10px;
        margin-right: 10px;
        width: calc(50% - 10px);
    }

    .cs_list_7 a {
        padding: 20px 5px;
        height: auto;
    }

    .cs_list_7 .ttl {
        margin-bottom: 5px;
    }

    .cs_list_7 i {
        display: block;
        width: 70px;
        height: 70px;
    }
}

/* ---------------------------------------------------- */
/* cs_list_8 */
/* ---------------------------------------------------- */
.cs_list_8>ul {
    border-top: 1px solid #d7dfe4;
}

.cs_list_8>ul>li {
    border-bottom: 1px solid #d7dfe4;
    background-color: #FFF;
}

.cs_list_8 a {
    display: block;
    padding: 13px;
    border-left: 10px solid #1c4aa4;
}

.cs_list_8.color_1 a {
    border-color: #1c4aa4;
}

.cs_list_8.color_2 a {
    border-color: #d53d44;
}

.cs_list_8.color_3 a {
    border-color: #dd8a51;
}

.cs_list_8.color_4 a {
    border-color: #643bb9;
}

.cs_list_8.color_5 a {
    border-color: #399039;
}

.cs_list_8.color_6 a {
    border-color: #c0bb25;
}

.cs_list_8.color_7 a {
    border-color: #888888;
}

.cs_list_8 .ttl {
    font-size: 1.7rem;
}

@media (max-width: 1039px) {
    .cs_list_8 a {
        padding: 8px 8px;
        border-width: 5px;
        background-repeat: no-repeat;
    }

    .cs_list_8 .ttl {
        font-size: 1.5rem;
    }
}

@media (max-width: 767px) {
    .cs_list_8 .ttl {
        font-size: 1.4rem;
    }
}

/* ---------------------------------------------------- */
/* cs_btn_wrap_1 */
/* ---------------------------------------------------- */
.cs_btn_wrap_1 {
    text-align: center;
    padding: 0;
    position:absolute, fixed;
}

*+.cs_btn_wrap_1 {
    margin-top: 50px;
}

.cs_btn_wrap_1>*+* {
    margin-left: 10px;
}

@media (max-width: 1039px) {
    *+.cs_btn_wrap_1 {
        margin-top: 40px;
    }

    .cs_btn_wrap_1>*+* {
        margin-left: 0;
        margin-top: 10px;
    }
}

@media (max-width: 767px) {
    *+.cs_btn_wrap_1 {
        margin-top: 30px;
    }
}

/* ---------------------------------------------------- */
/* cs_btn_wrap_2 */
/* ---------------------------------------------------- */
.cs_btn_wrap_2 {
    text-align: right;
}

*+.cs_btn_wrap_2 {
    margin-top: 25px;
}

.cs_btn_wrap_2>*+* {
    margin-left: 10px;
}

#cbw2-m.cs_btn_wrap_2 {
    margin-top: 3px;
    display: flex;
    justify-content: center;
    position: relative;
    align-items: center;
}

@media (max-width: 1039px) {
    *+.cs_btn_wrap_2 {
        margin-top: 20px;
        text-align: center;
    }

    .cs_btn_wrap_2>*+* {
        margin-left: 0;
        margin-top: 10px;
    }
}

/* ---------------------------------------------------- */
/* cs_btn_1 */
/* ---------------------------------------------------- */
.cs_btn_1 {
    display: inline-block;
    padding: 5px 25px;
    color: #007bc9;
    font-size: 1.4rem;
    background-color: #FFF;
    border: 1px solid #8dc8ec;
    border-radius: 20px;
    transition: 0.3s ease-in-out;
}

.cs_btn_1:hover {
    background-color: #b9e4ff !important;
}

.cs_btn_1 span {
    display: flex;
    align-items: center;
}

.cs_btn_1 i {
    display: block;
    margin-right: 10px;
    width: 16px;
    height: 16px;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.cs_btn_1.si_s {
    padding: 5px 25px;
    border-radius: 20px;
}

.cs_btn_1.si_m {
    padding: 15px 40px;
    border-radius: 40px;
}

.cs_btn_1.si_l {
    padding: 15px 60px;
    border-radius: 40px;
}

.cs_btn_1.co_1 {
    background: #e0f3ff;
}

.cs_btn_1.co_2 {
    background: transparent;
}

.cs_btn_1.co_3 {
    color: #FFF;
    background: #007bc9;
    border-color: #FFF;
}

@media (max-width: 1039px) {
    .close_btn>.cs_btn_1.si_m {
        font-size: 1.2rem;
        padding: 10px 30px;
    }
    
    .close_btn>.cs_btn_1 i {
        margin-right: 5px;
        width: 11px;
        height: 11px;
    }

    .cs_btn_1.si_s {
        padding: 5px 20px;
    }

    .cs_btn_1.si_m {
        font-size: 1.25rem;
        padding: 10px 30px;
        border-radius: 30px;
    }

    .cs_btn_1.si_l {
        font-size: 1.3rem;
        padding: 10px 50px;
        border-radius: 35px;
    }
}

@media (max-width: 767px) {
    .cs_btn_1 {
        font-size: 1.3rem;
    }
    .cs_btn_1.si_s {
        padding: 3px 10px;
        border-radius: 15px;
    }
    
    .cs_btn_1.si_m {
        font-size: 1.15rem;
        padding: 6px 20px;
        border-radius: 30px;
    }
}

/* ---------------------------------------------------- */
/* cs_btn_2 */
/* ---------------------------------------------------- */
.cs_btn_2 {
    display: inline-block;
    padding: 5px 25px;
    color: #F97B19;
    font-size: 1.4rem;
    background-color: #FFF;
    border: 1px solid #8dc8ec;
    border-radius: 20px;
    transition: 0.3s ease-in-out;
}

.cs_btn_2:hover {
    background-color: #b9e4ff !important;
}

.cs_btn_2 span {
    display: flex;
    align-items: center;
}

.cs_btn_2 i {
    display: block;
    margin-right: 10px;
    width: 16px;
    height: 16px;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.cs_btn_2.si_s {
    padding: 5px 25px;
    border-radius: 20px;
}

.cs_btn_2.si_m {
    padding: 15px 40px;
    border-radius: 40px;
}

.cs_btn_2.si_l {
    padding: 15px 60px;
    border-radius: 40px;
}

.cs_btn_2.co_1 {
    background: #e0f3ff;
}

.cs_btn_2.co_2 {
    background: transparent;
}

.cs_btn_2.co_3 {
    color: #FFF;
    background-color: transparent;
    border-color: #FFF;
    font-weight: 599;
}

@media (max-width: 1039px) {
    .close_btn>.cs_btn_2.si_m {
        font-size: 1.2rem;
        padding: 10px 30px;
    }
    
    .close_btn>.cs_btn_2 i {
        margin-right: 5px;
        width: 11px;
        height: 11px;
    }

    .cs_btn_2.si_s {
        padding: 5px 20px;
    }

    .cs_btn_2.si_m {
        font-size: 1.25rem;
        padding: 10px 30px;
        border-radius: 30px;
    }

    .cs_btn_2.si_l {
        font-size: 1.3rem;
        padding: 10px 50px;
        border-radius: 35px;
    }
}

@media (max-width: 767px) {
    .cs_btn_2 {
        font-size: 1.3rem;
    }
    .cs_btn_2.si_s {
        padding: 3px 10px;
        border-radius: 15px;
    }
}

/* ---------------------------------------------------- */
/* cs_btn_4 */
/* ---------------------------------------------------- */
.cs_btn_4>* {
    display: flex;
    height: 100%;
    min-height: 180px;
}

.cs_btn_4>*>.col {
    position: relative;
    display: flex;
    align-items: center;
    flex: auto;
    width: auto;
}

.cs_btn_4>*>.col:nth-of-type(1) {
    justify-content: center;
    flex: none;
    width: 180px;
    background: linear-gradient(270deg, rgba(88, 196, 220, 1) 0%, rgba(96, 143, 242, 1) 100%);
}

.cs_btn_4>*>.col:nth-of-type(2) {
    padding: 30px 40px;
    height: 205px;
}

.cs_btn_4 i {
    display: block;
    width: 90px;
    height: 90px;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.cs_btn_4 .meta_wrap .msg {
    margin-bottom: 10px;
    color: #798693;
}

.cs_btn_4 .meta_wrap .msg::after {
    content: "";
    display: block;
    margin-left: 70px;
    margin-top: 10px;
    width: 1px;
    height: 10px;
    /*background-color: #798693;*/
}

.cs_btn_4 .meta_wrap .cat_1 {
    display: table;
    margin-bottom: 10px;
    padding: 8px 15px;
    color: #FFF;
    font-size: 1.4rem;
    line-height: 1;
    background: #335371;
    border-radius: 20px;
}

.cs_btn_4 .meta_wrap .cat_1.color_1 {
    background-color: #1c4aa4;
}

.cs_btn_4 .meta_wrap .cat_1.color_2 {
    background-color: #d53d44;
}

.cs_btn_4 .meta_wrap .cat_1.color_3 {
    background-color: #dd8a51;
}

.cs_btn_4 .meta_wrap .cat_1.color_4 {
    background-color: #643bb9;
}

.cs_btn_4 .meta_wrap .cat_1.color_5 {
    background-color: #399039;
}

.cs_btn_4 .meta_wrap .cat_1.color_6 {
    background-color: #c0bb25;
}

.cs_btn_4 .meta_wrap .cat_1.color_7 {
    background-color: #888888;
}

.cs_btn_4 .meta_wrap .cat_2 {
    letter-spacing: 0.05em;
}

.cs_btn_4 .meta_wrap .ttl {
    font-size: 2.4rem;
    letter-spacing: 0.05em;
}

@media (max-width: 1039px) {
    .cs_btn_4>* {
        height: auto;
        min-height: auto;
    }

    .cs_btn_4>*>.col:nth-of-type(1) {
        width: 50px;
    }

    .cs_btn_4>*>.col:nth-of-type(2) {
        padding: 30px 10px;
        height: 180px;
    }

    .cs_btn_4 i {
        width: 30px;
        height: 30px;
    }

    .cs_btn_4 .meta_wrap .cat_1 {
        font-size: 1.4rem;
    }

    .cs_btn_4 .meta_wrap .cat_2 {
        font-size: 1.4rem;
    }

    .cs_btn_4 .meta_wrap .ttl {
        font-size: 1.8rem;
    }
}

/* ---------------------------------------------------- */
/* cs_btn_5 */
/* ---------------------------------------------------- */
.cs_btn_5>* {
    display: block;
    padding: 30px 10px;
    height: 100%;
    min-height: 180px;
}

.cs_btn_5 .ttl {
    margin-bottom: 30px;
    color: #007bc9;
    font-size: 1.8rem;
    text-align: center;
}

.cs_btn_5 i {
    display: block;
    margin: 0 auto;
    width: 90px;
    height: 90px;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

@media (max-width: 1039px) {
    .cs_btn_5>* {
        height: auto;
        min-height: auto;
    }

    .cs_btn_5 .ttl {
        margin-bottom: 15px;
        font-size: 1.6rem;
    }

    .cs_btn_5 i {
        width: 70px;
        height: 70px;
    }
}

/* ---------------------------------------------------- */
/* cs_btn_6 */
/* ---------------------------------------------------- */
.cs_btn_6>* {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px 10px;
    min-height: 180px;
}

.cs_btn_6 .ttl {
    font-size: 3.5rem;
    font-weight: 700;
    line-height: 1;
}

.cs_btn_6 i {
    display: block;
    margin-right: 20px;
    width: 90px;
    height: 90px;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

@media (max-width: 1039px) {
    .cs_btn_6>* {
        padding: 30px 10px;
        min-height: auto;
    }

    .cs_btn_6 .ttl {
        font-size: 2.4rem;
    }

    .cs_btn_6 i {
        display: block;
        margin-right: 10px;
        width: 70px;
        height: 70px;
    }
}

/* ---------------------------------------------------- */
/* cs_btn_7 */
/* ---------------------------------------------------- */
.cs_btn_7>* {
    display: flex;
    height: 100%;
    min-height: 180px;
}

.cs_btn_7>*>.col {
    position: relative;
    display: flex;
    align-items: center;
    flex: auto;
    width: auto;
}

.cs_btn_7>*>.col:nth-of-type(2) {
    justify-content: center;
    flex: none;
    width: 180px;
    background: linear-gradient(270deg, rgba(88, 196, 220, 1) 0%, rgba(96, 143, 242, 1) 100%);
}

.cs_btn_7>*>.col:nth-of-type(1) {
    padding: 30px 40px 30px 180px;
}

.cs_btn_7 i {
    display: block;
    width: 90px;
    height: 90px;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.cs_btn_7 .ttl {
    width: 100%;
    font-size: 3.5rem;
    font-weight: 700;
    line-height: 1;
    text-align: center;
}

@media (max-width: 1039px) {
    .cs_btn_7>* {
        height: auto;
        min-height: 130px;
    }

    .cs_btn_7>*>.col:nth-of-type(2) {
        width: 50px;
    }

    .cs_btn_7>*>.col:nth-of-type(1) {
        padding: 30px 10px;
    }

    .cs_btn_7 i {
        width: 30px;
        height: 30px;
    }

    .cs_btn_7 .ttl {
        font-size: 2.4rem;
    }
}

@media (max-width: 767px) {
    .cs_btn_7 .ttl {
        font-size: 1.9rem;
    }
}

/* ---------------------------------------------------- */
/* next_btn_1 */
/* ---------------------------------------------------- */
.next_btn_1 {
    display: inline-block;
    text-align: left;
    padding: 5px 35px;
    color: #1c4aa4;
    font-size: 1.4rem;
    background-color: #FFF;
    border: 2px solid #1c4aa4;
    border-radius: 30px;
    transition: 0.3s ease-in-out;
    font-weight: 600;
}

.next_btn_1:hover,.next_btn_2:active {
    background-color: #cedbf7;
}

.next-icon {
    display: inline-block;
    border-style: solid;
    border-width: 8px 0 8px 8px;
    border-color: transparent transparent transparent #1c4aa4;
    width: 0;
    height: 0;
    right: 10px;
    position: absolute;
    transform: translateY(-50%);
    background-repeat: repeat-x;
}

.next-icon-left {
    padding-left: 10px;
}

@media (max-width: 1039px) {
    .next_btn_1 {
        padding: 4px 30px;
        font-size: 1.3rem;
        transition: 0.3s ease-in-out;
    }

    .next-icon {
        border-width: 7px 0 7px 7px;
        right: 8px;
    }
    
    .next-icon-left {
        padding-left: 9px;
    }
}

@media (max-width: 767px) {
    .next_btn_1 {
        padding: 2px 24px;
        font-size: 1.2rem;
        border-radius: 25px;
        border: 1px solid #1c4aa4;
        transition: 0.3s ease-in-out;
        font-weight: 599;
    }

    .next-icon {
        border-width: 6px 0 6px 6px;
        right: 6px;
    }
    
    .next-icon-left {
        padding-left: 8px;
    }
}

/* ---------------------------------------------------- */
/* next_btn_2 */
/* ---------------------------------------------------- */
.next_btn_2 {
    display: inline-block;
    color: #FFF;
    font-size: 1.4rem;
    background-color: transparent;
    border: 2px solid #FFF;
    border-radius: 20px;
    transition: 0.3s ease-in-out;
    border-color: #FFF;
    font-weight: 599;
    padding: 10px 40px;
    border-radius: 40px;
}

.next_btn_2_back {
    padding: 15px 25px !important;
}

.next_btn_2_back::before {
    content: "";
    display: inline-block;
    width: 17px;
    height: 17px;
    margin: -3px 5px 0 0;
    background: url("../img/ico/back.svg") no-repeat;
    background-size: contain;
    vertical-align: middle;
}

.next_btn_2:hover,.next_btn_2:active {
    background-color: #b9e4ff
}


.back-icon-white {
    display: inline-block !important;
    border-style: solid;
    border-width: 8px 8px 8px 0;
    border-color: transparent #FFF transparent transparent;
    width: 0 !important;
    height: 0 !important;
    position: absolute;
}

.next-icon-white {
    display: inline-block !important;
    border-style: solid;
    border-width: 8px 0 8px 8px;
    border-color: transparent transparent transparent #FFF;
    width: 0 !important;
    height: 0 !important;
    right: 10px;
    position: absolute;
    transform: translateY(-50%);
}

.answer-next-icon-left {
    right: auto;
    margin: 0 0 0 10px !important;
}
.answer-next-icon-right {
    right: auto;
    margin: 0 0 0 20px !important;
}

@media (max-width: 1039px) {
    .next_btn_2 {
        padding: 8px 35px;
        font-size: 1.3rem;
    }
    
    .next_btn_2_back {
        padding: 14px 22px !important;
    }

    .next_btn_2_back::before {
        width: 15px;
        height: 15px;
    }

    .back-icon-white {
        border-width: 7px 7px 7px 0;
    }

    .next-icon-white {
        border-width: 7px 0 7px 7px;
    }

    .answer-next-icon-left {
        margin: 0 0 0 9px !important;
    }
    .answer-next-icon-right {
        margin: 0 0 0 18px !important;
    }
}

@media (max-width: 767px) {
    .next_btn_2 {
        padding: 7px 32px;
        font-size: 1.2rem;
        border-radius: 25px;
        border: 1px solid #FFF;
        font-weight: 599;
    }
    
    .next_btn_2_back {
        padding: 12px 20px !important;
    }
    
    .next_btn_2_back::before {
        width: 14px;
        height: 14px;
    }

    .back-icon-white {
        border-width: 6px 6px 6px 0;
    }

    .next-icon-white {
        border-width: 6px 0 6px 6px;
    }

    .answer-next-icon-right {
        margin: 0 0 0 17px !important;
    }
}

/* ---------------------------------------------------- */
/* cs_btn disable */
/* ---------------------------------------------------- */
a.is_disable {
    pointer-events: none;
    filter: grayscale(100%) brightness(90%);
}

/* ---------------------------------------------------- */
/* cs_profile_1 */
/* ---------------------------------------------------- */
.cs_profile_1 {
    display: flex;
}

.cs_profile_1>.col {
    position: relative;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    flex: auto;
    padding: 40px;
    width: auto;
    word-break: break-word;
}

.cs_profile_1>.col:nth-of-type(2),
.cs_profile_1>.col:nth-of-type(3) {
    justify-content: center;
    flex: none;
    width: 30%;
}

.cs_profile_1>.col:nth-of-type(2)::before,
.cs_profile_1>.col:nth-of-type(3)::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    display: block;
    width: 1px;
    height: calc(100% - 80px);
    min-height: 50%;
    background-color: #dddddd;
}

.cs_profile_1 .col_ttl {
    position: absolute;
    left: 20px;
    top: 15px;
}

.cs_profile_1 .account {
    display: flex;
    align-items: center;
}

.cs_profile_1 .account i {
    margin-right: 15px;
    width: 80px;
    min-width: 80px;
    height: 80px;
    background-image: url(../img/ico/user_1.svg);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-color: #FFF;
    border: 1px solid #a9c6d4;
    border-radius: 50%;
}

.cs_profile_1 .account .num {
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 1;
}

.cs_profile_1 .count {
    width: 100%;
    color: #007bc9;
    font-size: 5.0rem;
    font-weight: 500;
    line-height: 1;
    text-align: center;
}

.cs_profile_1 .graph {
    width: 100%;
    height: 10px;
    background-color: #b3d4ed;
    border-radius: 5px;
    overflow: hidden;
}

.cs_profile_1 .graph>span {
    display: block;
    height: 100%;
    background-color: #007bc9;
}



.cs_profile_1 .list_rate li {
    display: flex;
    align-items: center;
}

.cs_profile_1 .list_rate li+li {
    margin-top: 10px;
}

.cs_profile_1 .list_rate .num {
    padding-top: 2px;
    margin-left: 15px;
    color: #007bc9;
    font-size: 1.8rem;
    font-weight: 500;
    line-height: 1;
    border-bottom: 1px #007bc9 dashed;
}

@media (max-width: 1039px) {
    .cs_profile_1 {
        flex-wrap: wrap;
    }

    .cs_profile_1>.col {
        justify-content: center;
        padding: 25px 10px;
        width: 100%;
    }

    .cs_profile_1>.col:nth-of-type(2),
    .cs_profile_1>.col:nth-of-type(3) {
        width: 50%;
    }

    .cs_profile_1>.col:nth-of-type(2)::before {
        display: none;
    }

    .cs_profile_1 .col_ttl {
        left: 50%;
        top: -5px;
        transform: translateX(-50%);
    }

    .cs_profile_1 .count {
        font-size: 3.4rem;
    }

    .cs_profile_1 .list_rate li {
        display: flex;
        align-items: center;
    }

    .cs_profile_1 .list_rate li+li {
        margin-top: 5px;
    }
}

@media (max-width: 767px) {
    .cs_profile_1 .account i {
        width: 60px;
        min-width: 60px;
        height: 60px;

    }

    .cs_profile_1 .account .num {
        font-size: 1.7rem;
    }

    .cs_profile_1 .list_rate .num {
        font-size: 1.65rem;
    }

    .cs_profile_1>.col {
        justify-content: center;
        padding: 15px 8px;
        width: 100%;
    }

    .cs_profile_1 .col_ttl {
        left: 50%;
        top: -5px;
        transform: translateX(-50%);
    }

    .cs_profile_1 .count {
        font-size: 2.4rem;
    }

    .cs_profile_1 .list_rate li {
        display: flex;
        align-items: center;
    }

    .cs_profile_1 .list_rate li+li {
        margin-top: 5px;
    }
}

/* ---------------------------------------------------- */
/* cs_mv_1 */
/* ---------------------------------------------------- */
.cs_mv_1 {
    padding: 40px 30px;
}

.cs_mv_1 .copy {
    margin-bottom: 5px;
    font-size: 1.8rem;
}

.cs_mv_1 .ttl {
    font-size: 3.0rem;
    font-weight: 700;
}

.cs_mv_1 .desc {
    margin-top: 10px;
    color: #697d8f;
}

@media (max-width: 1039px) {
    .cs_mv_1 {
        padding: 30px 10px;
    }

    .cs_mv_1 .copy {
        font-size: 1.6rem;
    }

    .cs_mv_1 .ttl {
        font-size: 1.9rem;
    }

    .cs_mv_1 .desc {
        font-size: 1.4rem;
    }
}

@media (max-width: 767px) {
    .cs_mv_1 .ttl {
        font-size: 1.7rem;
    }

    .cs_mv_1 {
        padding: 20px 10px;
    }
}

/* ---------------------------------------------------- */
/* cs_msg_1 */
/* ---------------------------------------------------- */
.cs_msg_1 {
    padding: 150px 0;
}

.cs_msg_1 .ttl {
    font-size: 2.5rem;
    text-align: center;
}

.cs_msg_1 .desc {
    margin-top: 20px;
}

.cs_msg_1 .desc p {
    text-align: center;
}

@media (max-width: 1039px) {
    .cs_msg_1 {
        padding: 50px 0;
    }

    .cs_msg_1 .ttl {
        font-size: 2.0rem;
    }
}

/* ---------------------------------------------------- */
/* cs_data_1 */
/* ---------------------------------------------------- */
.cs_data_1 {
    position: relative;
    padding: 30px;
    overflow: visible;
}

.cs_data_1 .form_wrap {
    position: absolute;
    left: 290px;
    top: -65px;
}

.cs_data_1 .form_wrap .datepicker {
    position: relative;
}

.cs_data_1 .form_wrap .datepicker::before {
    content: "";
    position: absolute;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
    display: block;
    width: 20px;
    height: 20px;
    /*background-image: url(../img/ico/calendar_1.svg);*/
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.cs_data_1 .form_wrap .datepicker input {
    justify-content: center;
    padding: 8px 8px 8px 0px;
    margin: 0;
    width: 150px;
    color: #007bc9;
    background-color: #FFF;
    border: 1px solid #8dc8ec;
    -webkit-appearance: none;
    border-radius: 5px;
    text-align: center;
}

#dateFrom::-webkit-calendar-picker-indicator {
    position: absolute;
    width: 50%;
    height: 100%;
    opacity: 0;
}
#dateTo::-webkit-calendar-picker-indicator {
    position: absolute;
    width: 50%;
    height: 100%;
    opacity: 0;
}

.cs_data_1 .sort_wrap {
    display: flex;
    justify-content: space-between;
    margin-bottom: 25px;
}

.cs_data_1 .sort_wrap>* {
    margin-top: 0;
}

@media (max-width: 1039px) {
    .cs_data_1 .form_wrap {
        position: absolute;
        text-align: center;
        left: 140px;
        top: -53px;
    }

    .cs_data_1 .form_wrap .datepicker input {
        padding: 5px 5px 5px 0px;
    }

    .cs_data_1 .sort_wrap {
        display: block;
        margin-bottom: 20px;
    }

    .cs_data_1 .sort_wrap>* {
        margin-top: 10px;
    }
}

@media (max-width: 767px) {
    .cs_data_1 {
        padding: 30px 10px;
    }

    .cs_data_1 .form_wrap {
        position: static;
        margin-bottom: 20px;
    }
    
    .cs_data_1 .form_wrap .datepicker input {
        width: 100%;
    }
}

/* ---------------------------------------------------- */
/* cs_table_1 */
/* ---------------------------------------------------- */
.cs_table_1 table {
    width: 100%;
}

.cs_table_1 th {
    padding: 10px 5px;
    color: #FFF;
    font-size: 1.4rem;
    text-align: center;
    background-color: #5f758b;
    border: 1px solid #FFF
}

.cs_table_1 td {
    padding: 20px 5px;
    font-size: 1.2rem;
    text-align: center;
    background-color: #e6ecf3;
    border: 1px solid #FFF
}

.cs_table_1 tr:nth-child(odd) td {
    background-color: #d3dce5;
}

@media (max-width: 1039px) {
    .cs_table_1 {
        overflow-x: auto;
        white-space: nowrap;
    }

    .cs_table_1 th {
        padding: 5px 5px;
        font-size: 1.2rem;
    }

    .cs_table_1 td {
        padding: 10px 5px;
        font-size: 1.1rem;
    }
}

/* ---------------------------------------------------- */
/* cs_doc_1 */
/* ---------------------------------------------------- */
.cs_doc_1 .doc {
    width: 100%;
}

.cs_doc_1 .doc img {
    -webkit-touch-callout:none;
    -webkit-user-select:none;
    -moz-touch-callout:none;
    -moz-user-select:none;
    touch-callout:none;
    user-select:none;
    margin: 0 auto;
    /* height: auto;*/
    /* width: auto;*/
    /* transform: translate(10%, 0%); */
    /* max-width: calc(80%); */
    text-align: center;
}

.cs_doc_1 .count {
    margin-top: 25px;
    font-size: 1.4rem;
    text-align: center;
    letter-spacing: 0.05em;
}

@media (max-width: 1039px) {
    .cs_doc_1 .doc img {
        -webkit-touch-callout:none;
        -webkit-user-select:none;
        -moz-touch-callout:none;
        -moz-user-select:none;
        touch-callout:none;
        user-select:none;
        max-width: none;
        /* transform: translate(0%, 0%); */
        /* margin-left: 0px; */
    }

    .cs_doc_1 .count {
        margin-top: 20px;
    }
    
    #img-view img {
        width: 95% !important;
    }
}

/* ---------------------------------------------------- */
/* cs_modal_1 */
/* ---------------------------------------------------- */
.cs_modal_1 {
    display: none;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.8);
    z-index: 100;
}

.cs_modal_1 .modal {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    padding: 50px;
    width: 700px;
    background-color: #FFF;
    border-radius: 10px;
}

.cs_modal_1 .modal .ttl {
    margin-bottom: 30px;
    font-size: 3.0rem;
    text-align: center;
}

.cs_modal_1 .modal .desc p {
    text-align: center;
}

.cs_modal_1 .modal .btn_close {
    position: absolute;
    right: 0;
    top: -45px;
    display: block;
    width: 30px;
    height: 30px;
    background-image: url(../img/ico/close_1.svg);
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.cs_modal_1 .modal .calendar table {
    width: 100%;
}

.cs_modal_1 .modal .calendar caption {
    margin-bottom: 10px;
    text-align: center;
    font-weight: 700;
}

.cs_modal_1 .modal .calendar th,
.cs_modal_1 .modal .calendar td {
    width: 14.2%;
    border: 1px solid #d7dfe4;
    text-align: center;
}

.cs_modal_1 .modal .calendar th {
    font-weight: 700;
    background-color: #f0f5fa;
}

.cs_modal_1 .modal .calendar th:nth-of-type(1) {
    color: #d53d44;
}

.cs_modal_1 .modal .calendar th:nth-of-type(7) {
    color: #1c4aa4;
}

.cs_modal_1 .modal .calendar th>*,
.cs_modal_1 .modal .calendar td>* {
    display: block;
    padding: 10px 0;
}

.cs_modal_1 .modal .calendar a {
    display: block;
    background: #e0f3ff;
}

.cs_modal_1 .modal .calendar a:hover {
    background-color: #b9e4ff;
}

.cs_modal_1 .modal .calendar .is_disable {
    opacity: 0.5;
}

.modal-view {
    width: 100%;
    height: 100%;
    z-index: 100;
    display: none;
    overflow-y: scroll;
    -ms-overflow-style:none;
    text-align: center;
}

.modalWrapper {
    position: absolute;
    top: 50%;
    left: 50%;
    transform:translate(-50%,-50%);
    width: 70%;
    max-width: 500px;
    padding: 10px 30px;
    background-color: #fff;
}

.modal-view::-webkit-scrollbar {
    display:none;
}
.modal-view{
    -ms-overflow-style: none;
    scrollbar-width: none;
}

#cbw2-m>.ttl {
    justify-items: center;
    align-items: center;
    font-size: 2.4rem;
    color:white;
}

.close_btn {
    position: relative;
    margin: 0 20px 0 0;
}

.close_btn span {
    color: black !important;
}

.close_btn img {
    position: absolute;
    right: 0;
    bottom: 0;
}

.file-label {
    padding: 10px 40px;
    color: #ffffff;
    background-color: #384878;
    cursor: pointer;
}

input[type="file"] {
    display: none;
}

.file-text {
    margin: 10px 0 0 0;
}

@media (max-width: 1039px) {
    .cs_modal_1 .modal {
        padding: 30px 10px;
        width: 90%;
    }

    .cs_modal_1 .modal .ttl {
        margin-bottom: 20px;
        font-size: 2.4rem;
    }
    
    #cbw2-m>.ttl {
        font-size: 1.9rem;
    }

    .cs_modal_1 .modal .calendar th,
    .cs_modal_1 .modal .calendar td {
        font-size: 1.2rem;
    }
}

/* ---------------------------------------------------- */
/* cs_btn_03 */
/* ---------------------------------------------------- */
.cs_btn_03 {
    display: inline-block;
    padding: 6px 20px;
    color: #00b8c1;
    font-size: 1.4rem;
    background-color: #ffffff;
    border-radius: 20px;
    transition: 0.3s ease-in-out;
    border: 1px solid #00b8c1;
    margin-top: 20px;
    cursor: pointer;
    font-weight: bold;
}

.cs_btn_03:hover {
    background-color: #f0fcfd !important;
}

.cs_btn_03 span {
    display: flex;
    align-items: center;
}

.cs_btn_03 i {
    display: block;
    margin-right: 10px;
    width: 16px;
    height: 16px;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.cs_btn_03.si_s {
    padding: 5px 25px;
    border-radius: 20px;
}

.cs_btn_03.si_m {
    padding: 15px 40px;
    border-radius: 40px;
}

.cs_btn_03.co_1 {
    background: #ffffff;
}

.cs_btn_03.co_2 {
    background: transparent;
}

.cs_btn_03.co_3 {
    color: #FFF;
    background: #007bc9;
    border-color: #FFF;
}

/* ---------------------------------------------------- */
/* cs_modal_2 */
/* ---------------------------------------------------- */
.cs_modal_2 {
    display: none;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0);
    z-index: 100;
}

.cs_modal_2 .modal {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    padding: 50px;
    width: 700px;
    background: linear-gradient(0deg, rgba(88, 196, 220, 1) 0%, rgba(96, 143, 242, 1) 100%);
    border-radius: 10px;
}

.cs_modal_2 .modal i {
    display: block;
    margin: 0 auto 20px;
    width: 120px;
    height: 120px;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.cs_modal_2 .modal .ttl {
    color: #FFF;
    font-size: 5.0rem;
    font-weight: 700;
    text-align: center;
}

.cs_modal_2 .modal .btn_close {
    position: absolute;
    right: 10px;
    top: 10px;
    display: block;
    width: 40px;
    height: 40px;
    background-image: url(../img/ico/close_2.svg);
    background-position: center;
    background-size: 16px auto;
    background-repeat: no-repeat;
    background-color: #FFF;
    border-radius: 50%;
}

@media (max-width: 1039px) {
    .cs_modal_2 .modal {
        padding: 30px 10px;
        width: 90%;
    }

    .cs_modal_2 .modal .btn_close {
        right: 5px;
        top: 5px;
        width: 23px;
        height: 23px;
        background-size: 11px auto;
    }

    .cs_modal_2 .modal i {
        margin: 0 auto 15px;
        width: 70px;
        height: 70px;
    }

    .cs_modal_2 .modal .ttl {
        font-size: 3.0rem;
    }
}


/* ---------------------------------------------------- */
/* cs_widget_menu_1 */
/* ---------------------------------------------------- */
.cs_widget_menu_1 {
    position: fixed;
    left: 0;
    top: 70px;
    width: 70px;
    height: calc(100% - 70px);
    background-color: #161d23;
    z-index: 10;
}

.cs_widget_menu_1>ul>li+li {
    margin-top: 1px;
}

.cs_widget_menu_1 .btn_toggle {
    display: flex;
    justify-content: center;
    align-content: center;
    flex-wrap: wrap;
    height: 80px;
    background-color: #393f44;
}

.cs_widget_menu_1 .is_show .btn_toggle {
    background-color: #454a4f;
}

.cs_widget_menu_1 .btn_toggle i {
    display: block;
    margin-bottom: 5px;
    width: 26px;
    height: 26px;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.cs_widget_menu_1 .btn_toggle span {
    display: block;
    width: 100%;
    color: #FFF;
    font-size: 1.3rem;
    text-align: center;
}

.cs_widget_menu_1 .toggle_wrap {
    display: none;
    position: absolute;
    left: 70px;
    top: 0;
    height: 100%;
    background-color: #454a4f;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.cs_widget_menu_1 .toggle_wrap>ul {
    padding: 20px 10px;
}

.cs_widget_menu_1 .toggle_wrap>ul>li+li {
    border-top: 1px dotted #bec1c3;
}

.cs_widget_menu_1 .toggle_wrap a {
    display: flex;
    align-items: center;
    padding: 15px;
    min-width: 180px;
    color: #bec1c3;
    font-size: 1.4rem;
    white-space: nowrap;
}

.cs_widget_menu_1 .toggle_wrap a::before {
    content: "";
    display: block;
    margin-right: 5px;
    width: 18px;
    height: 18px;
    background-image: url(../img/ico/play_1.svg);
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

@media (max-width: 1039px) {
    .cs_widget_menu_1 {
        position: relative;
        left: 0;
        top: 0;
        width: 100%;
        height: auto;
    }

    .cs_widget_menu_1>ul {
        display: flex;
        justify-content: center;
    }

    .cs_widget_menu_1>ul>li {
        margin-top: 0;
        margin-left: 1px;
        width: 80px;
    }

    .cs_widget_menu_1>ul>li+li {
        margin-top: 0;
        margin-left: 1px;
    }

    .cs_widget_menu_1 .btn_toggle {
        height: 60px;
    }

    .cs_widget_menu_1 .btn_toggle i {
        width: 20px;
        height: 20px;
    }

    .cs_widget_menu_1 .btn_toggle span {
        font-size: 1.2rem;
    }

    .cs_widget_menu_1 .toggle_wrap {
        display: none;
        position: absolute;
        left: 0;
        top: 60px;
        width: 100%;
        height: auto;
    }

    .cs_widget_menu_1 .toggle_wrap>ul {
        padding: 10px;
    }

    .cs_widget_menu_1 .toggle_wrap a {
        padding: 15px 0;
        font-size: 1.4rem;
        white-space: normal;
    }
}

/* ---------------------------------------------------- */
/* cs_widget_score_1 */
/* ---------------------------------------------------- */
.cs_widget_score_1 {
    position: fixed;
    left: 0;
    top: 70px;
    padding: 50px 25px;
    width: 260px;
    height: calc(100% - 70px);
    background-color: #454a4f;
    z-index: 10;
}

.cs_widget_score_1 .ttl {
    margin-bottom: 15px;
    color: #FFF;
    font-size: 2.4rem;
    text-align: center;
}

.cs_widget_score_1 .score input {
    padding: 15px;
    margin: 0;
    width: 100%;
    color: #007bc9;
    font-size: 4.0rem;
    background-color: #FFF;
    border: 1px solid #FFF;
    -webkit-appearance: none;
    border-radius: 5px;
}

.cs_widget_score_1 .btn_wrap {
    margin-top: 20px;
    text-align: center;
}

@media (max-width: 1039px) {
    .cs_widget_score_1 {
        position: static;
        padding: 20px 10px;
        width: auto;
        height: auto;
    }

    .cs_widget_score_1 .ttl {
        font-size: 1.8rem;
    }

    .cs_widget_score_1 .score {
        margin: 0 auto;
        width: 50%;
    }

    .cs_widget_score_1 .score input {
        padding: 8px;
        font-size: 3.0rem;
    }

    .cs_widget_score_1 .btn_wrap {
        margin-top: 20px;
    }

}

@media (max-width: 767px) {
    .cs_widget_score_1 {
        padding: 20px 10px;
    }

    .cs_widget_score_1 .ttl {
        font-size: 1.7rem;
    }

    .cs_widget_score_1 .score input {
        padding: 5px;
        font-size: 2.5rem;
    }

    .cs_widget_score_1 .btn_wrap {
        margin-top: 15px;
    }

}

/* ---------------------------------------------------- */
/* cs_list_toggle_wrap_1 */
/* ---------------------------------------------------- */
.cs_list_toggle_wrap_1.hide_row_11>table>tbody>tr:nth-of-type(n+11),
.cs_list_toggle_wrap_1.hide_row_11>ul>li:nth-child(n+11) {
    /*display: none;*/
}

.cs_list_toggle_wrap_1.hide_row_10>table>tbody>tr:nth-of-type(n+10),
.cs_list_toggle_wrap_1.hide_row_10>ul>li:nth-child(n+10) {
    display: none;
}

/*
.cs_list_toggle_wrap_1.hide_row_9>table>tbody>tr:nth-of-type(n+9),
.cs_list_toggle_wrap_1.hide_row_9>ul>li:nth-child(n+9) {
    display: none;
}

.cs_list_toggle_wrap_1.hide_row_8>table>tbody>tr:nth-of-type(n+8),
.cs_list_toggle_wrap_1.hide_row_8>ul>li:nth-child(n+8) {
    display: none;
}

.cs_list_toggle_wrap_1.hide_row_7>table>tbody>tr:nth-of-type(n+7),
.cs_list_toggle_wrap_1.hide_row_7>ul>li:nth-child(n+7) {
    display: none;
}

.cs_list_toggle_wrap_1.hide_row_6>table>tbody>tr:nth-of-type(n+6),
.cs_list_toggle_wrap_1.hide_row_6>ul>li:nth-child(n+6) {
    display: none;
}

.cs_list_toggle_wrap_1.hide_row_5>table>tbody>tr:nth-of-type(n+5),
.cs_list_toggle_wrap_1.hide_row_5>ul>li:nth-child(n+5) {
    display: none;
}

.cs_list_toggle_wrap_1.hide_row_4>table>tbody>tr:nth-of-type(n+4),
.cs_list_toggle_wrap_1.hide_row_4>ul>li:nth-child(n+4) {
    display: none;
}

.cs_list_toggle_wrap_1.hide_row_3>table>tbody>tr:nth-of-type(n+3),
.cs_list_toggle_wrap_1.hide_row_3>ul>li:nth-child(n+3) {
    display: none;
}

.cs_list_toggle_wrap_1.hide_row_2>table>tbody>tr:nth-of-type(n+2),
.cs_list_toggle_wrap_1.hide_row_2>ul>li:nth-child(n+2) {
    display: none;
}

.cs_list_toggle_wrap_1.hide_row_1>table>tbody>tr:nth-of-type(n+1),
.cs_list_toggle_wrap_1.hide_row_1>ul>li:nth-child(n+1) {
    display: none;
}
*/

.cs_list_toggle_wrap_1.is_show>table>tbody>tr {
    display: table-row !important;
}

/* ---------------------------------------------------- */
/* cs_login_1 */
/* ---------------------------------------------------- */

.cs_login_1 .ttl {
    margin-bottom: 30px;
    font-size: 3.0rem;
    font-weight: 700;
    text-align: center;
}

.cs_login_1 .error {
    margin-bottom: 30px;
    color: #d53d44;
    text-align: center;
}

.cs_login_1 .input_wrap {
    margin-bottom: 30px;
}

.cs_login_1 .input_txt {
    display: block;
    padding: 15px;
    margin: 0 auto;
    width: 500px;
    color: #007bc9;
    background-color: #FFF;
    border: 1px solid #8dc8ec;
    -webkit-appearance: none;
    border-radius: 5px;
}

.cs_login_1 .input_txt::placeholder {
    color: #bbc7d2;
}

.cs_login_1 .input_txt+.input_txt {
    margin-top: 15px;
}

.cs_login_1 .btn_wrap {
    margin-bottom: 30px;
    text-align: center;
}

.cs_login_1 .btn_submit {
    display: inline-block;
    padding: 15px;
    width: 200px;
    color: #007bc9;
    font-size: 1.4rem;
    text-align: center;
    background-color: #FFF;
    border: 1px solid #8dc8ec;
    border-radius: 40px;
    cursor: pointer;
    outline: none;
    -webkit-appearance: none;
    transition: 0.3s ease-in-out;
}

.cs_login_1 .btn_submit:hover {
    background-color: #b9e4ff !important;
}

.cs_login_1 .check_wrap {
    margin-bottom: 30px;
    display: flex;
    justify-content: center;
}

.cs_login_1 .desc_wrap {
    margin-bottom: 60px;
    color: #697d8f;
    font-size: 1.4rem;
    line-height: 1.7;
    text-align: center;
}

.cs_login_1 .logo {
    margin: 0 auto;
    width: 300px;
    height: 70px;
    background-image: url(../img/logo/icon.png);
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    image-rendering: -webkit-optimize-contrast;
}

@media (max-width: 1039px) {
    .cs_login_1 .ttl {
        margin-bottom: 20px;
        font-size: 2.4rem;
    }

    .cs_login_1 .error {
        margin-bottom: 20px;
    }

    .cs_login_1 .input_wrap {
        margin-bottom: 20px;
    }

    .cs_login_1 .input_txt {
        width: 100%;
    }

    .cs_login_1 .input_txt+.input_txt {
        margin-top: 10px;
    }

    .cs_login_1 .btn_wrap {
        margin-bottom: 20px;
    }

    .cs_login_1 .btn_submit {
        width: 90%;
    }

    .cs_login_1 .check_wrap {
        margin-bottom: 20px;
    }

    .cs_login_1 .desc_wrap {
        margin-bottom: 40px;
    }

}

/* ---------------------------------------------------- */
/* cs_editprofile_1 */
/* ---------------------------------------------------- */
.cs_editprofile_1 {
    margin-left: auto;
    margin-right: auto;
    max-width: 540px;
}

.cs_editprofile_1 .icon_wrap i {
    display: block;
    width: 100%;
    height: 100%;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-color: #FFF;
    border: 1px solid #a9c6d4;
    border-radius: 50%;
}

.cs_editprofile_1 .icon_wrap .current {
    margin: 0 auto 20px;
    width: 130px;
    height: 130px;
}

.cs_editprofile_1 .icon_wrap .list {
    position: relative;
    margin-bottom: 45px;
    padding: 30px 35px;
    background-color: #FFF;
    border: 1px solid #d7dfe4;
    border-radius: 5px;
}

.cs_editprofile_1 .icon_wrap .list:before {
    content: "";
    position: absolute;
    top: -24px;
    left: 50%;
    margin-left: -15px;
    border: 12px solid transparent;
    border-bottom: 12px solid #FFF;
    z-index: 2;
}

.cs_editprofile_1 .icon_wrap .list:after {
    content: "";
    position: absolute;
    top: -28px;
    left: 50%;
    margin-left: -17px;
    border: 14px solid transparent;
    border-bottom: 14px solid #d7dfe4;
    z-index: 1;
}

.cs_editprofile_1 .icon_wrap .list>ul {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.cs_editprofile_1 .icon_wrap .list>ul a {
    display: block;
    width: 80px;
}

.cs_editprofile_1 .icon_wrap .list>ul a {
    position: relative;
    display: block;
    width: 80px;
    height: 80px;
}

.cs_editprofile_1 .icon_wrap .list>ul a.is_check {
    pointer-events: none;
}

.cs_editprofile_1 .icon_wrap .list>ul a.is_check::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    display: block;
    width: 100%;
    height: 100%;
    border: 4px solid #007bc9;
    border-radius: 50%;
}

.cs_editprofile_1 .icon_wrap .list a.is_check::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
    width: 30px;
    height: 20px;
    border-left: 6px solid #007bc9;
    border-bottom: 6px solid #007bc9;
    transform: translate(-50%, -60%) rotate(-45deg);
}

.cs_editprofile_1 .icon_wrap .list .btn_wrap {
    text-align: center;
}

.cs_editprofile_1 .input_wrap .ttl {
    margin-bottom: 15px;
    font-size: 1.8rem;
    text-align: center;
}

.cs_editprofile_1 .input_txt {
    display: block;
    padding: 15px;
    margin: 0 auto;
    width: 100%;
    color: #335371;
    font-size: 2.0rem;
    background-color: #FFF;
    border: 1px solid #8dc8ec;
    -webkit-appearance: none;
    border-radius: 5px;
}


/***** simpleselect */
.simpleselect {
	font-size: 16px;
	margin: 5px 5px;
	padding: 5px;
	width: 130px;
	border: 1px solid #007bc9;
	border-radius: 20px;
	cursor: pointer;
}


@media (max-width: 1039px) {
    .cs_editprofile_1 .icon_wrap .current {
        width: 100px;
        height: 100px;
    }

    .cs_editprofile_1 .icon_wrap .list {
        margin-bottom: 30px;
        padding: 20px 25px;
    }

    .cs_editprofile_1 .input_wrap .ttl {
        margin-bottom: 15px;
        font-size: 1.7rem;
        text-align: center;
    }

    .cs_editprofile_1 .input_txt {
        padding: 10px;
        font-size: 1.8rem;
    }
}

@media (max-width: 767px) {
    .cs_editprofile_1 .icon_wrap .list>ul a {
        width: 70px;
        height: 70px;
    }

    .cs_editprofile_1 .input_wrap .ttl {
        margin-bottom: 15px;
        font-size: 1.6rem;
        text-align: center;
    }

    .cs_editprofile_1 .input_txt {
        font-size: 1.7rem;
    }
}