.front_join {
    width: 100%;
    background: #fff;
}

.front_join+section,
.front_join+section.rsv_view {
    margin-top: -40px;
}

/* .front_join>form, */
.front_join>div,
.front_join .wrap {
    max-width: 1100px;
    margin: auto;
    background: #fff;
    padding: 10px 0 20px;
}


/* .front_join article {
    padding: 20px;
    border-top: 2px solid #830020;
    border-left: 1px solid #dbdbdb;
    border-right: 1px solid #dbdbdb;
    border-bottom: 2px solid #635848;
    background:
    url(../../../../images/iosf/ko/content/event/bg_texture_1100x247.png),
    url(../../../../images/iosf/ko/content/event/image_tiger_340x340.png)no-repeat right top/340px 340px,
    #8f816a;
    background-size: 1100px 247px;
} */

/* .front_join article:first-of-type {
    background:
        url(../../../../images/iosf/ko/content/event/bg_texture_1100x247.png),
        url(../../../../images/iosf/ko/content/event/image_tiger_340x340.png)no-repeat right top/233px 233px,
        #8f816a;
} */

.front_join section .infobox {
    width: 100%;
    padding: 30px 18px;
    border: 2px solid #d8cebd;
    margin-bottom: 40px;
}

.front_join section .infobox p {
    font: bold 17px/1.3em "맑은 고딕";
    color: #000;
}

.front_join section .infobox p:after {
    content: "";
    display: block;
    width: 56px;
    height: 1px;
    background: #830020;
    margin: 10px 0 20px;
}

.front_join section .infobox dl dt {
    display: flex;
    align-items: flex-start;
    font: 15px/1.5em "맑은 고딕";
    color: #535353;
}

.front_join section .infobox dl dt~dt {
    margin-top: 4px;
}

.front_join section .infobox dl dt:before {
    content: "";
    display: inline-block;
    min-width: 8px;
    height: 8px;
    background: url(../../../../images/iosf/ko/content/join/img_arrowright_8x8.png) no-repeat center;
    background-size: 8px 8px;
    margin-right: 6px;
    margin-top: 6px;
}



.front_join section .infotext {
    border-top: 2px solid #830020;
    border-bottom: 1px solid #1b1b1b;
}

.front_join section .infotext p {
    width: 100%;
    text-align: center;
    padding: 12px;
    font: bold 15px/1.3em "맑은 고딕";
    color: #f1e8da;
    text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.5);
    background: #434343;
}

.front_join section>div~div {
    margin-top: 20px;
}

.front_join section .part {
    border: 1px solid #e8e8e8;
    margin-bottom: 40px;
}

.front_join section .part .subtext {
    font: 22px/1.3em "나눔바른고딕";
    color: #000;
    text-align: center;
}

.front_join section .part .subtext:after {
    content: "";
    display: block;
    width: 58px;
    height: 1px;
    background: #8f816a;
    margin: 10px auto 0;
}

.front_join section .part .subtext~div:not(.btn),
.front_join section .part .termsbox {
    margin-top: 30px;
    /* border: 1px solid #e6e6e6; */
    border-top: 2px solid #830020;
    border-bottom: 1px solid #414141;
}

.front_join section .part .termsbox {
    margin-top: 0;
    border-top: 0;
}


/* 인증창 */

.front_join section .cite {
    width: 380px;
    margin: auto;
}

.front_join section .cite dt {
    display: flex;
    height: 44px;
    border-bottom: 1px solid #4d4538;
}

.front_join section .cite dt .name,
.front_join section .cite dt .id {
    font: 15px/1.3em "맑은 고딕";
    color: #fff3df;
    display: flex;
    min-width: 100px;
    align-items: center;
    padding: 0 13px;
    text-shadow: 1px 1px 0px #594522;
    background: #837761;
}

.front_join section .cite dt .name:before {
    content: "";
    display: inline-block;
    width: 18px;
    height: 18px;
    background: url(../../../../images/iosf/ko/content/myinfo/icon_name_grey_18x18.png) no-repeat center;
    background-size: 18px 18px;
    margin-right: 9px;
}

.front_join section .cite dt .id {
    width: 100%;
    color: #fff;
    font-weight: bold;
    background: #8f816a;
}

.front_join section .cite dd {
    padding: 20px 20px;
}

.front_join section .cite dd p {
    font: 15px/1.3em "맑은 고딕";
    color: #535353;
    text-align: center;

}

.front_join section .cite dd input {
    width: 100%;
    height: 44px;
    border: 1px solid #d3d3d3;
    margin-top: 20px;
}

.front_join section .cite dd input::placeholder {
    font: 15px/1.3em "맑은 고딕";
    color: #b5b5b5;
    padding: 0 20px;
}








/* 테이블 기본정보 */

.front_join table {
    width: 100%;
    border-collapse: collapse;
}

.front_join table.terms {
    border-collapse: separate;
}


.front_join table tr th,
.front_join table tr td {
    /* width: 100%; */
    background: #f6f6f6;
    padding: 8px 12px;
    height: 44px;
}

.front_join table tr th~th,
.front_join table tr td~td {
    border-left: 1px solid #e6e6e6;
}

.front_join table tr td {
    /* background: #fff; */
    /* border-top: 1px solid #e6e6e6; */
}

.front_join table tr td input,
.front_join table tr td select {
    width: 100%;
    min-height: 28px;
    border: 1px solid #cbc9c9;
}

.front_join table tr td input {
    font: 13px/1.3em "맑은 고딕";
    color: #313131;
    padding: 5px;
}

.front_join table tr td input::placeholder {
    font: 13px/1.3em "맑은 고딕";
    color: #313131;
}

.front_join table tr td select {
    font: 13px/1.3em "맑은 고딕";
    color: #000;
}

.front_join table tr th p {
    font: 15px/1.3em "맑은 고딕";
    color: #735231;
}

.front_join table tr td p {
    font: 15px/1.3em "맑은 고딕";
    text-align: center;
    color: #535353;
}




/* 개인정보수집 이용동의         항목 */

.front_join table.terms tr td {
    display: block;
    width: 100%;
    padding: 18px;
    height: 400px;
    background: #fbfbfb;
    overflow-y: auto;
}

.front_join .terms td p {
    font: bold 15px "맑은 고딕";
    text-transform: none;
    text-align: left;
    margin-bottom: 9px;
    color: #000;
}
.front_join .terms td p:not(:first-of-type) {
    margin-top: 14px;
}


.front_join .terms td p+p {
    margin-top: 20px;
}

.front_join .terms td small,
.front_join .terms td span {
    display: block;
    font: normal 15px/1.4em "맑은 고딕";
    margin-bottom: 24px;
    color: #626262;
}

.front_join .terms td span {
    margin-top: -5px;
    margin-bottom: 12px;
}

.front_join .terms td span~span {
    margin-bottom: 7px;
}



.front_join table.terms tr:first-of-type {
    border: 1px solid #535353;
}



/* 신청하기 버튼 */

/* 동의하기 라디오버튼 */

.front_join section {
    width: 100%;
}


.front_join section .agreement {
    width: 100%;
    height: 44px;
    /* margin: 20px 0 0px 0; */
    /* background: #3f3f3f; */
    border-top: 1px solid #e6e6e6;
    /* text-align: center; */
    display: flex;
    align-items: center;
    justify-content: left;
    padding: 18px;
}

.front_join section .agreement input {
    margin-right: 8px;
}

.front_join section .agreement label {
    font: 15px/1.3em "맑은 고딕";
    color: #535353;
}

.front_join section .btn {
    display: flex;
    justify-content: center;
    position: relative;
    padding: 40px 0 ;
    /* border-top: 1px solid #ebebeb; */
    /* background: #000; */
}

.front_join section .btn:only-child {
    padding: 0;
}


.front_join section .btn button.left {
    margin-right: auto;
}

.front_join section .btn button.right {
    margin-left: auto;
}

.front_join section .btn button.center {
    position: absolute;
    margin: auto;
    /* top: 40px; */
}

.front_join section .btn button~button {
    margin-left: 10px;
}

/* .front_join section .btn button:last-of-type {
    margin-right: 0;
} */

.front_join section .btn button {
    position: relative;
    display: inline-block;
    font: bold 15px "맑은 고딕";
    color: #fff;
    text-shadow: 1px 1px 0 #000;
    border-radius: 30px;
    min-width: 100px;
    min-height: 40px;
    padding: 0 15px 0 15px;
    background: #8f816a;
    transition: all 0.2s;
}

.front_join section .btn button.apply {
    background: #f67400;
    text-shadow: 1px 1px 0 #9f2901;
}

.front_join section .btn button.apply.check:before {
    content: '';
    display: inline-block;
    width: 16px;
    height: 16px;
    background: url(../../../../images/iosf/ko/content/board/icon_check_14x14.png) no-repeat center;
    background-size: 16px 16px;
    margin-bottom: -2px;
    margin-right: 6px;
}

.front_join section .btn button.cancel {
    background: #8f816a;
    text-shadow: 1px 1px 0 #504432;
}

.front_join section .btn button.cancel.close:before {
    content: '';
    display: inline-block;
    width: 16px;
    height: 16px;
    background: url(../../../../images/iosf/ko/content/view/icon_close_16x16.png) no-repeat center;
    background-size: 16px 16px;
    margin-bottom: -2px;
    margin-right: 6px;
}

.front_join section .btn button.list {
    background: #940034;
    text-shadow: 1px 1px 0 #69011a;
}

.front_join section .btn button.white {
    background: #FFFFFF;
    color: #313131;
    text-shadow: none;
    border: 1px solid #BDBDBD;
}

.front_join section .btn button.list:before {
    content: '';
    display: inline-block;
    width: 14px;
    height: 14px;
    background: url(../../../../images/iosf/ko/content/view/icon_list_red_14x14.png) no-repeat center;
    background-size: 14px 14px;
    margin-bottom: -1px;
    margin-right: 6px;
}

.front_join section .btn button.refresh:before {
    content: '';
    display: inline-block;
    width: 16px;
    height: 16px;
    background: url(../../../../images/iosf/ko/content/view/icon_refresh_16x16.png) no-repeat center;
    background-size: 16px 16px;
    margin-bottom: -1px;
    margin-right: 6px;
}

/* .front_join section .btn button:after{
    content: "";
    position: absolute;
    display: inline-block;
    width: 22px;
    height: 22px;
    top: 50%;
    transform: translateY(-50%);
    right: 26px;
    background: url(../../../../images/iosf/ko/content/event/icon_check_22x22.png);
    background-size: 22px 22px;
} */
.front_join section .btn .detail:after {
    background: url(../../../../images/iosf/ko/content/event/icon_detailinfo_22x22.png);
    background-size: 22px 22px;
}


.front_join section .btn button:hover {
    /* background: #940034; */
    transition: all 0.2s;
}




/* 신청하기 버튼 비활성*/

.front_join section.inactive div a {
    cursor: default;
    pointer-events: none;
}

.front_join section .btn button.off {
    background: #dfdfdf;
    text-shadow: 1px 1px 0px #c8c8c8;
    cursor: default;
    pointer-events: none;
}



.front_join section .btn button:disabled {
    background: #dfdfdf !important;
    border: 1px solid #d8d8d8 !important;
    text-shadow: 1px 1px 0px #bfbfbf !important;
    color: #fff !important;
    cursor: default;
}




/* --------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* -----   -------------   ----                 ----            ----------   --------------------------------------------------------------------------------------------------------------------- */
/* -----    -----------    ----   ------------------   -------     -------   --------------------------------------------------------------------------------------------------------- */
/* -----     ---------     ----   ------------------   ----------   ------   ----------------------------------------------------------------------------------------------------- */
/* -----      -------      ----   ------------------   ------------   ----   ------------------------------------------------------------------------------------------------------ */
/* -----   -   -----   -   ----                 ----   ------------   ----   --------------------------------------------------------------------------------------------------------------------- */
/* -----   --   ---   --   ----   ------------------   ------------   ----   ------------------------------------------------------------------------------------------------------ */
/* -----   ---   -   ---   ----   ------------------   ----------   ------   ------------------------------------------------------------------------------------------------------- */
/* -----   ----     ----   ----   ------------------   --------     ------   --------------------------------------------------------------------------------------------------------- */
/* -----   -----   -----   ----                 ----            ----------   ------------------------------------------------------------------------------------------------------------------------ */
/* --------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------------------------------------------------------------------------------- */






/* 추가 */

/* 페이징 버튼 */
section .paging {
    margin: 20px 40px auto;
}


section .paging dl,
section .paging dt,
section .paging dd {
    display: flex;
    align-items: center;
}

section .paging dt {
    margin: 0 10px;
}

section .paging dt button,
section .paging dd button {
    font: 15px "맑은 고딕";
    color: #313131;
    width: 38px;
    height: 38px;
    border: 1px solid #e3e3e3;
    border-left: 0;
    background: #fff;
    transition: all 0.2s;
}

section .paging dt button:first-of-type,
section .paging dd button:first-of-type {
    border-left: 1px solid #e3e3e3;
}

section .paging dd button.on {
    background: #64001a;
    color: #fff;
    border: 1px solid #64001a;
    transition: all 0.1s;
}

section .paging dl {
    justify-content: center;
    width: 100%;
}

section .paging dt:first-of-type button {
    background:
        url(../../../../images/iosf/ko/content/event/icon_paging_prev_7x12.png)no-repeat center;
    background-size: 7px 12px;
}

section .paging dt:first-of-type button:first-of-type {
    background:
        url(../../../../images/iosf/ko/content/event/icon_paging_first_10x12.png)no-repeat center;
    background-size: 10px 12px;
}

section .paging dt:last-of-type button {
    background:
        url(../../../../images/iosf/ko/content/event/icon_paging_next_7x12.png)no-repeat center;
    background-size: 7px 12px;
}

section .paging dt:last-of-type button:last-of-type {
    background:
        url(../../../../images/iosf/ko/content/event/icon_paging_last_10x12.png)no-repeat center;
    background-size: 10px 12px;
}

/* 페이징 버튼 end*/

/* 페이징 버튼 모바일 비활성 */
section .paging .mobile {
    display: none;
    margin: 0 13px;
}

section .paging .mobile p {
    font: bold 17px "맑은 고딕";
    color: #991233;
}

section .paging .mobile p:last-of-type {
    font-weight: normal;
    color: #313131;
}

section .paging .mobile small {
    font-size: 18px;
    margin: 0 2px;
    color: #a0a0a0;
}