@charset "utf-8";

@import url(animate.css);

/* common */
body.scroll-y {
    overflow-y: hidden;
}

.red {
    color: #E32D2E !important;
} 

.blue {
    color: #2A7EE1 !important;
}

.fr {
    float: right !important;
}

.right {
    text-align: right;
}

.center {
    text-align: center;
}

.left {
    text-align: left;
}

.margin10 {
    margin: 10px 0;
}

.mt10 {
    margin-top: 10px;
  }

.mb10 {
    margin-bottom: 10px;
}

.mb48 {
    margin-bottom: 48px;
}

.mt15 {
    margin-top: 15px;
}

.mt50 {
    margin-top: 50px !important;
}

.mt100 {
    margin-top: 100px;
}

.mt30 {
    margin-top: 30px !important;
}

.wp30 {
    width: 30% !important;
}

.wp50 {
    width: 50% !important;
}

.wp100 {
    width: 100% !important;
}

.margin30 {
    margin: 30px 0;
}

.margin100 {
    margin: 100px auto !important;
}

.z99 {
    z-index: 99 !important;
}

.pt10 {
    padding-top: 10px;
}

.pt20 {
    padding-top: 20px;
}

.pb30 {
    padding-bottom: 30px;
}

.hr {
    width: 100%;
    background: #e8e8e8;
    height: 1px;
}


.content-wrap {
    width: 1200px;
    margin: 0 auto;
    padding: 90px 0 200px 0;
}

/* common- popup */
.common-popup {
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 440px;
    /* min-height: 235px; */
    max-height: 695px;
    padding: 40px 36px;
    border-radius: 16px;
    border: 3px solid var(--main-color);
    z-index: 102;
    visibility: hidden;
    background: #fff;
}

.overlay-bg {
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.8);
    z-index: 101;
    visibility: hidden;
}

.common-popup .popup-header h2 {
    text-align: center;
    font-size: 26px;
    font-weight: 700;
    margin-bottom: 5px;
}

.common-popup .popup-header p {
    text-align: center;
    color: #666;
    font-size: 16px;
    font-weight: 500;
}

/* .common-popup .popup-body {
    margin-top: 25px;
} */

.common-popup .popup-footer {
    margin-top: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0 16px;
}

.common-popup .popup-footer a {
    width: 45%;
    padding: 12px 0;
    text-align: center;
    background: #fff;
    border: 1px solid var(--main-color);
    color: var(--main-color);
    font-size: 16px;
    border-radius: 4px;
    display: block;
}

.common-popup .popup-footer a.on {
    background: var(--main-color);
    color: #fff;
}

.common-popup .popup-footer a.close {
    background: #fff;
    border: 1px solid var(--main-color);
    color: var(--main-color);
}

.popup-close {
    position: absolute;
    bottom: -80px;
    left: 50%;
    transform: translateX(-50%);
    background: url('/images/icon_popup_close.svg') no-repeat;
    width: 56px;
    height: 56px;
    cursor: pointer;
}

/* tab-common */
.tab-common-wrap {
    width: 100%;
    margin-top: 85px;
}

.tab-common-wrap h2 {
    font-size: 26px;
    font-weight: 600;
}

.tab-common-container {
    width: 100%;
    display: flex;
    margin-top: 25px;
}

.tab-common {
    width: 20%;
}

.tab-common ul {
    display: flex;
    flex-direction: column;
}

.tab-common ul li {
    padding: 12px 0;
    color: #666;
    font-size: 18px;
    text-align: left;
    border-bottom: 1px solid #D6D6D6;
    cursor: pointer;
    font-weight: 600;
    position: relative;
}

.tab-common ul li::after {
    content: ">";
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    color: #666;
    font-size: 20px;
    font-weight: 500;
}

.tab-common ul li.on {
    color: var(--main-color);
    border-bottom: 1px solid var(--main-color);
}

.tab-common ul li.on::after {
    color: var(--main-color);
}

.tab-common-content {
    display: none;
}

.tab-common-content img:not(:first-child) {
    margin-top: 20px;
}

/* // tab-common */


/* search-common */
.search-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 25px 0 65px 0;
}

.search-wrap .search-date {
    position: relative;
    border-bottom: 1px solid #D6D6D6;
    padding: 8px 0;
    width: 184px;
    cursor: pointer;
}

.search-wrap .search-date::after {
    content: "";
    background: url('/images/icon_search_calendar.svg')no-repeat;
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    width: 22px;
    height: 22px;
}

.search-wrap .search-date span {
    font-size: 20px;
    font-weight: 500;
    margin-left: 20px;
    display: block;
}

.search-wrap b {
    font-weight: 500;
    font-size: 16px;
    margin: 0 15px;
}

.search-wrap button {
    background: var(--main-color);
    color: #fff;
    font-size: 18px;
    font-weight: 600;
    position: relative;
    border-radius: 4px;
    padding: 15px 13px;
    text-indent: 32px;
    margin-left: 16px;
}

.search-wrap button::after {
    content: "";
    background: url('/images/icon_search.svg')no-repeat;
    position: absolute;
    left: 15px;
    top: 50%;
    transform: translateY(-50%);
    width: 24px;
    height: 24px;
}

/* // search-common */

/* // search-common */


/* selectBox-common */

/* // selectBox-common */


/* // common */




/* 예약페이지 자물쇠 아이콘 이미지(/images/lock_off.svg 등) 조절하기 위해 주석처리
.content-wrap img {
    width: 100%;
    height: 100%;
}
*/


/* member */

/* login */
.bg-login {
    background-color: #fff;
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    z-index: 1000
}

.contents-login {
    position: relative;
    z-index: 1100;
    width: 440px;
    margin: 0 auto;
}

.logo-login {
    width: 100%;
    margin: 108px 0 66px 0;
}

.logo-login img {
    display: block;
    width: 135px;
    margin: auto;
}

.btn-back {
    width: 100%;
    position: relative;
    height: 68px;
    margin: auto;
}

.btn-back h1 {
    position: absolute;
    left: -15px;
    bottom: 0;
}

.btn-back h1 a {
    display: inline-block;
}

.login-wrap {
    width: 100%;
    margin: auto;
}

.login-wrap ul {
    margin-bottom: 15px;
}

.login-wrap ul h3 {
    font-weight: 500;
    color: #535B5D;
    padding-bottom: 10px;
}

.login-wrap h1.title {
    text-align: center;
    font-size: 28px;
    padding: 30px 0 20px;
    color: #2F3334;
    font-weight: 500;
}

.login-wrap ul li input[type="text"].borderB {
    border-bottom: 2px solid #b4bbbc;
    padding-top: 2px;
}

.login-wrap ul li input[type="password"].borderB {
    border-bottom: 2px solid #b4bbbc;
    padding-top: 2px;
}

.login-wrap ul li input[type="text"]:focus,
.login-wrap ul li input[type="password"]:focus {
    border-bottom: 2px solid#E34346;
}

.login-wrap ul li input[type="text"]::placeholder {
    font-size: 15px;
}

.choice-day-box input[type="text"]::placeholder {
    font-size: 18px;
    color: #5f6668;
} 

.login-wrap ul li input[type="password"]::placeholder {
    font-size: 15px;
}

.login-wrap ul li.phone {
    width: 100%;
    overflow: hidden;
    padding-top: 10px;
    display: flex;
    justify-content: space-between;
}

.login-wrap ul li.phone input {
    margin-left: 1.5%;
    font-size: 0.94em;
    float: left;
    width: 32%;
}

.login-wrap ul li.phone input:first-child {
    margin-left: 0;
}

.login-wrap ul li.phone select {
    float: left;
    width: 33%;
}

.auto-login {
    margin: 20px auto;
    position: relative;
}

.check-select2 {
    display: inline-block;
    float: right;
}

.check-select2 span {
    position: absolute;
    right: 0;
    top: -8px;
    vertical-align: middle;
}

.check-select2 input[type=checkbox] {
    display: none;
}

.check-select2 input[type=checkbox]+label {
    cursor: pointer;
    background-repeat: no-repeat;
    background-image: url('/mobile/images/img_check_style02.svg');
    background-size: 24px 24px;
    font-size: 0;
    padding: 12px;
}

.check-select2 input[type=checkbox]:checked+label {
    background-image: url('/mobile/images/img_check_style02_on.svg');
    background-size: 24px 24px;
}

.member-modify-box .phone input {
    margin-left: 1.5%;
    float: left;
    width: 32%;
}

.member-modify-box .phone input:first-child {
    margin-left: 0;
}

/* modify */
.del-box h2 {
    color: #2f3334;
    font-size: 20px;
    border-bottom: 1px solid #e8e8e8;
    padding: 10px 0;
    margin: 20px 0;
}

.del-box dl {
    width: 100%;
    margin-bottom: 26px;
}

.del-box dt {
    display: block;
    margin-bottom: 15px;
    color: #000;
    font-weight: 500;
}

.del-box dt span {
    vertical-align: text-top;
    color: #b49759;
    font-weight: 500;
    padding-left: 5px;
}

.del-box dd {
    width: 100%;
}

.del-box dd::after {
    width: 100%;
    margin-bottom: 8px;
    content: "";
    display: block;
    clear: both;
}

.del-btn {
    text-align: right;
    width: 100%;
    display: block;
    text-decoration: underline;
    color: #c8a445;
    font-weight: 500;
    margin-top: 25px;
}

.del-text {
    padding: 30px 0;
}

.del-text h3 {
    font-weight: 500;
    color: #E34346;
}

.del-text p {
    font-size: 15px;
    font-weight: 400;
    line-height: 25px;
    white-space: pre-line;
    margin: 5px 0;
}

.btn-del a {
    color: #fff;
    font-weight: 500;
    background: #c8a445;
    padding: 10px 20px;
    display: block;
    text-align: center;
}

.btn-certified {
    width: 100%;
    padding: 10px 0;
    text-align: center;
    border: 1px solid #E34346;
    color: #E34346;
    font-weight: 500;
    background-color: #fff;
    cursor: pointer;
}

.btn-certified.off {
    border: 1px solid #b4bbbc;
    color: #b4bbbc;
}

.phone-certified {
    width: 100%;
    overflow: hidden;
}

.phone-certified li {
    width: 25%;
    float: left;
}

.phone-certified li:first-child {
    width: 75%;
}

.phone-certified input[type="number"] {
    width: 100%;
}

.phone-certified .certified-time {
    color: #E34346;
    line-height: 45px;
    background-color: #F4F4F4;
    text-align: center;
    font-weight: 300;
}

.btn-idpw {
    width: 90%;
    text-align: center;
    margin: 0 auto 40px;
    overflow: hidden;
}

.btn-idpw a {
    color: #535B5D;
    position: relative;
    text-align: center;
    width: 50%;
    float: left;
    font-size: 0.94em;
    margin-top: 24px;
}

.btn-idpw a:first-child::after {
    content: '';
    width: 1px;
    height: 16px;
    background-color: #B4BBBC;
    position: absolute;
    right: 0;
    top: 4px;
}
  
/*login-btn*/
.btn-login {
    width: 100%;
    text-align: center;
    overflow: hidden;
    margin-top: 20px;
}

.btn-login a {
    /* float: left; */
    width: 100%;
    font-weight: 500;
    display: block;
    line-height: 50px;
    font-size: 1.06em;
    margin-right: 10px;
    background: #fff;
    border: 1px solid #c8a445;
}

.btn-login a:last-child {
    margin-right: 0;
}

.btn-login a.enter {
    line-height: 48px;
}

.btn-login a.on {
    background-color: #c8a445;
    color: #fff;
}

.btn-login a:last-child {
    float: right;
}

.btn-login02 {
    width: 100%;
    text-align: center;
    overflow: hidden;
    margin: 0 auto;
}

.btn-login02 a {
    float: left;
    width: 48%;
    border: 1px solid #c8a445;
    color: #c8a445;
    font-weight: 500;
    display: inline-block;
    line-height: 50px;
    font-size: 1.06em;
    margin-right: 10px;
    background: #fff;
}

.btn-login02 a:last-child {
    margin-right: 0;
}

.btn-login02 a.enter {
    line-height: 48px;
}

.btn-login02 a.on {
    background-color: #c8a445;
    color: #fff;
}

.btn-login02 a:last-child {
    float: right;
}

.id-check-box {
    padding: 50px 0;
    background: #F4F4F4;
    text-align: center;
    width: 100%;
    font-weight: 500;
    font-size: 18px;
    line-height: 50px;
}

.text-login01 {
    font-size: 15px;
    text-align: center;
    line-height: 23px;
    color: #535B5D;
    word-break: keep-all;
    letter-spacing: -1px;
    padding-bottom: 20px;
}

.btn-join-text {
    font-size: 1em;
    font-weight: 500;
    color: #E34346;
    text-decoration: underline;
    text-align: center;
}

/* join01 */
.join-wrap {
    width: 96%;
    margin: auto;
    padding-bottom: 80px;
}

.join-top-box {
    width: 100%;
    background-color: #c8a445;
    color: #fff;
    font-weight: 300;
    text-align: center;
    line-height: 48px;
    text-transform: uppercase;
    font-size: 1.13em;
}

.join-top-box span {
    color: #f3f3d4;
}

.join-wrap h1.title {
    text-align: center;
    font-size: 1.38em;
    padding: 30px 0 20px;
    color: #535b5d;
    font-weight: 500;
}

.check-all {
    text-align: center;
    width: 100%;
}

.check-all span {
    width: 34px;
    height: 34px;
    display: inline-block;
    margin: 25px 0 14px;
}

.check-all input[type=checkbox] {
    display: none;
}

.check-all input[type=checkbox]+label {
    cursor: pointer;
    background-repeat: no-repeat;
    background-image: url('/images/agree_all_before.svg');
    background-size: 34px 34px;
    font-size: 0;
    padding: 20px;
    width: 34px;
    height: 34px;
}

.check-all input[type=checkbox]:checked+label {
    background-image: url('/images/agree_all_after.svg');
    background-size: 34px 34px;
}

.join-box {
    width: 100%;
}

.join-box ul li h2.title {
    font-size: 1.13em;
    text-align: left;
    color: #535b5d;
    letter-spacing: -1px;
    font-weight: 400;
    padding: 6px 0 10px 10px;
    position: relative;
}

.join-box ul li h2.title b {
color: #c5a658;
padding-left: 5px;
display: inline-block;
}

.join-table {
width: 100%;
color: #222;
border-top: 3px solid #c8a445;
}

.join-table thead th {
background: #f5f6f7;
padding: 5px;
text-align: center;
vertical-align: middle;
border: 1px solid #ccc;
}

.join-table tbody td {
border: 1px solid #e8e8e8;
text-align: center;
padding: 3px;
vertical-align: middle;
background: #fff
}


.check-select {
position: absolute;
right: 8px;
top: 0;
}

.check-select input[type=checkbox] {
display: none;
}

.check-select input[type=checkbox]+label {
cursor: pointer;
background-repeat: no-repeat;
background-image: url('/images/agree_all_before.svg');
background-size: 24px 24px;
font-size: 0;
padding: 12px;
}

.check-select input[type=checkbox]:checked+label {
background-image: url('/images/agree_all_after.svg');
background-size: 24px 24px;
}

.join-agree-box {
/* width: 100%; */
height: 100px;
border: 1px solid #e8e8e8;
background-color: #f4f4f4;
font-size: 0.875em;
font-weight: 300;
padding: 12px;
margin-bottom: 10px;
overflow: hidden;
overflow-y: scroll;
white-space: pre-line;
}

.text-join01 {
font-size: 0.875em;
line-height: 1.25em;
color: #535b5d;
word-break: keep-all;
text-align: left;
letter-spacing: -1px;
}

.text-join02 {
color: #2f3334;
font-weight: 300;
font-size: 0.88em;
word-break: keep-all;
width: 96%;
margin: auto;
letter-spacing: -0.38px;
padding: 30px 0;
}

.text-join02 span.text-big {
color: #2c5352;
font-size: 1.125em;
font-weight: 500;
}

.text-join02 span.text-small {
font-size: 0.925em;
}

.join03-box {
width: 27% !important;
margin-left: 10px;
}

.join03-box2 {
display: inline-block;
width: 31.7% !important;
margin-left: 10px;
}

.join03-box2:first-child {
margin-left: 0;
}

.join04-text {
font-size: 16px;
font-weight: 400;
color: #E34346;
}

.certified-box {
width: 100%;
overflow: hidden;
margin: 0 auto 30px;
}

.certified-box li {
width: 40%;
float: left;
text-align: center;
margin: 0 5%;
}

.certified-box li h2 {
color: #535b5d;
font-weight: 500;
}

.certified-box li p {
border-radius: 50%;
width: 104px;
height: 104px;
background-color: #e8e8e8;
margin: 20px auto;
display: flex;
justify-content: center;
justify-items: center;
padding: 1em;
}

.member-info-box {
width: 100%;
}

.member-info-box dl {
width: 100%;
margin-bottom: 26px;
}

.member-info-box dt {
display: block;
margin-bottom: 15px;
color: #000;
font-weight: 500;
}

.member-info-box dt span {
vertical-align: text-top;
color: #b49759;
font-weight: 500;
padding-left: 5px;
}

.member-info-box dd {
width: 100%;
}

.member-info-box dd::after {
width: 100%;
margin-bottom: 8px;
content: "";
display: block;
clear: both;
}

.enter-name {
width: 70% !important;
float: left;
}

.enter-sex {
width: 28% !important;
margin-left: 2%;
float: left;
}

.enter-sex select {
width: 100%;
}

.enter-id {
width: 70% !important;
float: left;
}

input[id=join03-font]::placeholder {
font-size: 16px;
color: #000;
}

.btn-overlap {
width: 28% !important;
margin-left: 2%;
float: left;
background-color: #fff;
font-weight: 500;
text-align: center;
line-height: 43px;
border: 1px solid #E34346;
color: #E34346;
font-size: 16px;
}

.birthday {
width: 100%;
overflow: hidden;
}

.birthday select {
width: 32%;
margin-left: 1%;
float: left;
}

.birthday select:first-child {
width: 34%;
margin-left: 0;
}

.email {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
justify-items: center;
line-height: 48px;
}

.email input[type="text"] {
width: 45%;
}

.member-info-box .phone {
width: 100%;
}

.member-info-box .phone input {
margin-left: 1.5%;
font-size: 0.94em;
float: left;
width: 32%;
}

.member-info-box .phone input:first-child {
margin-left: 0;
}

.member-info-box .phone select {
float: left;
width: 33%;
}

.radio-sty01 {
font-size: 0.88em;
}

.radio-sty01 input[type=radio] {
display: none;
}

.radio-sty01 input[type=radio]+label {
background-repeat: no-repeat;
background-image: url('/images/agree_all_before.svg');
background-size: 16px 15px;
padding-left: 21px;
padding-right: 20px;
background-position: left top 3px
}

.radio-sty01 input[type=radio]:checked+label {
background-image: url('/images/agree_all_after.svg');
background-size: 16px 15px;
}

.join-finish {
width: 100%;
padding-top: 20px;
}

.phone-box {
background: #f4f4f4;
text-align: center;
height: 48px;
float: left;
width: 33%;
position: relative;
}

.celphone-box {
background: #f4f4f4;
text-align: center;
height: 48px;
float: left;
width: 33%;
position: relative;
}

.sex-box {
background: #f4f4f4;
text-align: center;
height: 45px;
float: left;
width: 100%;
position: relative;
}

.sex-box2 {
background: #f4f4f4;
text-align: center;
height: 45px;
width: 20%;
position: relative;
border-radius: 4px;
display: inline-block;
vertical-align: top;
margin-left: -3px;
}

.sex-box2 .option-sex {
color: #999 !important;
}

.sel-list-box {
background: #f4f4f4;
text-align: center;
height: 45px;
width: 100%;
position: relative;
}

.address-box {
background: #f4f4f4;
text-align: center;
height: 48px;
float: left;
width: 100%;
margin-right: 7px;
position: relative;
}

.year-box,
.month-box,
.day-box {
background: #f4f4f4;
text-align: center;
height: 48px;
float: left;
width: calc((100% - 18px)/3);
margin-right: 9px;
position: relative;
}

.day-box {
margin-right: 0;
position: relative;
}

.address-box.disabled,
.sex-box.disabled,
.sel-list-box.disabled,
.email-box.disabled,
.address-box.disabled,
.celphone-box.disabled,
.birthday-box.disabled {
background: #fff url(/images/select_gray.svg) no-repeat;
border: 1px solid #ddd;
background-position: center right 10px;
background-size: 9px 6px;
color: #5f6668;
font-weight: 300;
}

.address-box.disabled .input-phone-field .option-selected,
.sex-box.disabled .sel-list-box.disabled,
.input-phone-field .option-selected,
.email-box.disabled .input-phone-field .option-selected,
.celphone-box.disabled .input-phone-field .option-selected,
.birthday-box.disabled .input-phone-field .option-selected {
background: none;
}

.email-box {
background: #f4f4f4;
text-align: center;
height: 48px;
float: left;
width: 100%;
/* margin-bottom: 10px; */
position: relative;
}

.phone-box input[type=text] {
float: left;
border: none;
font-size: inherit;
font-weight: inherit;
}


/* select box */
.address-box {
position: relative;
background: #f4f4f4;
text-align: center;
height: 48px;
float: left;
width: 226px;
margin-right: 3px;
}

.address-box.disabled-02,
.sex-box.disabled-02,
.email-box.disabled-02,
.celphone-box.disabled-02 {
background: #fff url(../images/join/join03_select_none.svg) no-repeat;
border: 1px solid #ddd;
background-position: center right 10px;
background-size: 9px 6px;
color: #5f6668;
font-weight: 300;
/* height: 46px; */
height: 44px;
}

.address-box.disabled .input-phone-field .option-selected,
.sex-box.disabled .input-phone-field .option-selected,
.email-box.disabled .input-phone-field .option-selected,
.celphone-box.disabled .input-phone-field .option-selected,
.phone-box.disabled .input-phone-field .option-selected {
background: none;
}

.address-box.disabled-02 .input-phone-field .option-selected-02,
.sex-box.disabled-02 .input-phone-field .option-selected-02,
.email-box.disabled-02 .input-phone-field .option-selected-02,
.celphone-box.disabled-02 .input-phone-field .option-selected-02 {
color: #999;
}

.input-phone-field .option-selected {
display: inline-block;
padding: 20px 30px;
font-size: 20px;
width: 100%;
background: url('/images/inputSelect.svg')no-repeat;
background-size: 10px;
background-position: 124px 26px;
display: flex;
justify-content: flex-start;
align-items: center;
cursor: pointer;
font-weight: 200;
letter-spacing: -0.8px;
}

.input-phone-field .option-selected-02 {
display: inline-block;
padding: 12px 15px;
font-size: 16px;
/* width: 100%; */
background: #F4F4F4 url('/images/inputSelect.svg')no-repeat;
background-size: 20px;
background-position: 205px 22px;
display: flex;
justify-content: flex-start;
align-items: center;
cursor: pointer;
font-weight: 300;
letter-spacing: -0.8px;
color: #000;
}

.input-phone-field .option-email {
background-position: 435px 20px;
color: #222;
}

.input-phone-field .option-sex {
background-position: 95%;
color: #222;
}

.input-phone-field .option-phone {
background-position: 125px 20px;
color: #222;
}

.input-phone-field .option-number {
background-position: 123px 20px;
color: #222;
}

.find-box .showme::after {
width: 100%;
content: "";
display: block;
clear: both;
}

.member-info-box .showme::after {
width: 100%;
content: "";
display: block;
clear: both;
}

.input-phone-field .select-options {
display: none;
position: absolute;
background-color: #fff;
width: 152px;
top: 60px;
margin: 0;
box-sizing: border-box;
z-index: 10;
}

.input-phone-field .select-options-02 {
display: none;
position: absolute;
background-color: #fff;
width: 152px;
top: 392px;
margin: 0;
box-sizing: border-box;
z-index: 10;
}

.input-phone-field .select-options li {
font-size: 20px;
padding: 20px 27px;
transition: all .4s;
cursor: pointer;
color: #2f3334;
width: 100%;
display: block;
border: 1px solid #e8e8e8;
text-align: left;
border-bottom: 0;
font-weight: 200;
}

.input-phone-field .select-options-02 li {
font-size: 16px;
/* padding: 10px 20px; */
padding: 0 20px;
cursor: pointer;
color: #222;
/* width: 100%; */
/* display: block; */
display: flex;
align-items: center;
text-align: left;
border-bottom: 0;
font-weight: 200;
background-color: #f5f6f7;
}

.input-phone-field .select-options li:last-child {
border-bottom: 1px solid #e8e8e8;
}

.input-phone-field .select-options-02 li:last-child {
border-bottom: 1px solid #e8e8e8 !important;
}

.input-phone-field .select-number {
display: none;
position: absolute;
background-color: #fff;
width: 145px;
top: 1303px;
left: 9px;
margin: 0;
box-sizing: border-box;
z-index: 10;
}

.input-phone-field .select-options li:hover {
background: #f3f3d4;
color: #378468;
font-weight: 400;
}

/* .input-phone-field .select-options-02 li:hover{background: #f3f3d4;color:#c8a445;font-weight: 400;} */
.input-phone-field .select-options-02 li:hover {
font-weight: 500;
}

.input-phone-field .optionjs {
    display: none;
    position: absolute;
    background-color: #fff;
    width: 152px;
    top: 60px;
    margin: 0;
    box-sizing: border-box;
    z-index: 10;
}

.input-phone-field .gender,
.input-phone-field .email,
.input-phone-field .number,
.input-phone-field .address,
.input-phone-field .birthday {
    margin-bottom: 0;
}

.input-phone-field .select-address {
    display: none;
    position: absolute;
    background-color: #fff;
    width: 100%;
    top: 48px;
    left: 0;
    margin: 0;
    box-sizing: border-box;
    z-index: 10;
}

.input-phone-field .select-email {
    display: none;
    position: absolute;
    background-color: #fff;
    width: 100%;
    top: 48px;
    left: 0;
    margin: 0;
    box-sizing: border-box;
    z-index: 10;
}

.input-phone-field .select-sex {
    display: none;
    position: absolute;
    background-color: #fff;
    width: 100%;
    top: 48px;
    left: 0;
    margin: 0;
    box-sizing: border-box;
    z-index: 10;
    border-radius: 4px;
}

.input-phone-field .select-options .email {
    height: 48px;
    padding: 0 22px;
}

.input-phone-field .select-options-02 .sex {
    height: 48px;
}

.input-phone-field .select-sex {
    display: none;
    position: absolute;
    background-color: #fff;
    width: 100%;
    top: 48px;
    left: 0;
    margin: 0;
    box-sizing: border-box;
    z-index: 10;
    border-radius: 4px;

    overflow-x: hidden;
}

.input-phone-field .select-sex02 {
    display: none;
    position: absolute;
    background-color: #fff;
    width: 128px;
    top: 46px;
    right: -1px;
    margin: 0;
    box-sizing: border-box;
    z-index: 10;
}

.join03-text {
    font-size: 14px;
    margin: 10px 0;
}

.input-phone-field .option-add02 dd {
    padding: 12px 22px;
    /* transition: all .4s; */
    cursor: pointer;
    color: #2f3334;
    width: 100%;
    display: block;
    border: 1px solid #e8e8e8;
    text-align: left;
}
  
.input-phone-field .option-add02 dd:first-child {
border-bottom: 0;
}

.input-phone-field .option-add02 dd:nth-of-type(2) {
border-bottom: 0;
}

.input-phone-field .option-add02 dd:hover {
background: #f3f3d4;
color: #a14d37;
font-weight: bold;
}

.sub-con-title {
text-align: center;
color: #222;
}

.sub-con-title h2 {
font-size: 36px;
margin-bottom: 10px;
font-weight: 500;
}

.sub-con-title p {
font-size: 18px;
font-weight: 400;
}

/* //member */


/* 예약 */

/* 코스/시간선택 tab */
.content-box {
position: relative;
overflow: hidden;
}

.reser-tab-title {
font-size: 22px;
color: #2F3334;
position: absolute;
width: 15%;
float: left;
display: inline-block;
top: 20px;
}

.faciltyBtn {
width: 100%;
overflow: hidden;
margin-top: 20px;
}

.faciltyBtn li {
padding: 0.8em 0;
width: 100%;
float: left;
color: #535B5D;
text-align: left;
cursor: pointer;
border-bottom: 1px solid #B4BBBC;
font-size: 18px;
margin-right: 5px;
font-weight: 500;
position: relative;
}

.faciltyBtn li:last-child {
margin-right: 0;
} 

.faciltyBtn li::after {
content: '▶';
position: absolute;
right: 20px;
bottom: 20px;
font-size: 10px;
}

.faciltyBtn li.on::after {
content: '▶';
position: absolute;
right: 20px;
bottom: 20px;
font-size: 10px;
}

.golf-fa li {
display: block;
width: 190px;
text-align: left;
background: url(/images/reservation/reser_course_tab_off.svg)no-repeat;
background-position: 180px 23px;
}

.golf-fa li.on {
background: url(/images/reservation/reser_course_tab_on.svg)no-repeat;
background-position: 180px 23px;
}

.faciltyBtn:nth-child(2) {
width: 100%;
overflow: hidden;
margin: 25px 0 30px;
}

.tab-img img,
.tab-img2 img,
.tab-img3 img {
width: 100%;
}

/* 예약자 안내box */
.info-check {
clear: both;
margin: 40px 0 50px;
border: 1px solid #c8a445;
border-radius: 4px;
text-align: center;
padding: 30px;
}

.info-check ul {
display: inline-block;
position: relative;
}

.info-check ul::after {
content: '';
position: absolute;
bottom: 4px;
right: -3px;
width: 1px;
height: 14px;
background: #999;
}

.info-check ul:last-child::after {
display: none;
}

.info-check ul li {
margin: 0 30px;
color: #999;
font-size: 20px;
}

.info-check ul li span {
margin: 0 10px;
color: #222;
font-weight: 400;
}

.tab-box-top {
    overflow: hidden;
    padding-top: 20px;
}

.reser-calendar {
overflow: hidden;
position: relative;
margin-bottom: 80px;
    display: flex;
}

.reser-calendar h3 {
display: inline-block;
}

.reser-list-box {
position: absolute;
top: 483px;
left: 253px;
}

.reser-calendar .list {
display: inline-block;
position: relative;
float: left;
left: -250px;
padding-top: 30px;
}

.reser-calendar .list h4 {
display: inline-block;
font-size: 14px;
margin: 0 15px;
}

.list h4:last-child {
padding-right: 0 !important;
}

.square_orange01 {
position: absolute;
top: 38px;
height: 12px;
border: 1px solid #f6743b;
width: 12px;
right: 159px;
}

.square_yellow01 {
position: absolute;
top: 38px;
height: 12px;
background: #F3F3D4;
width: 12px;
right: 42px;
}

.square_gray01 {
position: absolute;
top: 38px;
height: 12px;
background: #B4BBBC;
width: 12px;
right: 100px;
}


/* tab list */
.reser-guide {
width: 100%;
height: auto;
margin: 20px 0;
border: 1px solid #c8a445;
padding: 15px;
}

.reser-guide li {  
font-size: 16px;
color: #000;
font-weight: 400;
word-break: keep-all;
line-height: 26px;
padding-bottom: 5px;
padding: 0 0 4px 20px;
}

.reser-guide li.tit {
font-weight: 600;    
padding: 0 0 4px 0;
}

.reser-guide li.red {
color: #d40000d5;
font-weight: 600;
}

.team-table2 {
width: 100%;
border-top: 2px solid #c8a445;
border-bottom: 1px double #222;
text-align: center;
margin-top: 60px !important;
}

.team-table2 tbody tr:hover {
background: #f9f9f9;
}

.team-table2 thead th {
background: #f5f6f7;
padding: 15px;
color: #666;
vertical-align: middle;
border-bottom: 1px solid #ccc;
}

.team-table2 thead th:last-child {
border-right: 0;
}

.team-table2 tbody td {
padding: 15px;
color: #222;
border-bottom: 1px solid #ccc;
vertical-align: middle;
}

.team-table2 tbody td span {
display: block;
margin: 3px 0;
}

.team-btn {
background: #c8a445;
border-radius: 4px;
padding: 7px 30px;
color: #fff;
font-size: 14px;
}

.reser-list {
width: 946px;
margin-bottom: 20px;
float: right;
}

.reser-list ul.reser-con {
display: none;
clear: both;
}

.reser-list h1 {
padding: 0.5em 1em;
border: 1px solid #A14D37;
color: #A14D37;
height: 48px;
font-size: 18px;
}

.reser-list h1.on {
color: #fff;
background-color: #A14D37;
}

.reser-list h1.borderB {
border: 1px solid #9e896e;
}

.reser-list h1 span {
float: right;
margin-right: 5px;
}

.reser-list .feeWrap p {
    margin-bottom: 5px;
}

.ico_ar {
margin-top: 10px;
}

.ico_ar img.on {
background: url('/mobile/images/arrow_down.png')center center no-repeat;
}

.reser-con.borderB {
border: 1px solid #9e896e;
}

.reser-btn-wrap {
    display: flex;
    align-items: center;
    gap: 0 10px;
}

.reser-btn-wrap li.title {
    font-size: 16px;
}

.reser-btn-wrap li button {
    font-size: 16px;
    border: 1px solid var(--main-color);
    border-radius: 4px;
    text-align: center;
    padding: 5px 0;
    background: #fff;
    width: 70px;
}

.reser-btn-wrap li button.on {
    font-size: 16px;
    border: 1px solid var(--main-color);
    border-radius: 4px;
    text-align: center;
    padding: 5px 0;
    background-color: #c8a445;
	color:#FFF;
    width: 70px;    
}

.feeWrap {
width: 100%;
overflow: hidden;
padding-bottom: 10px;
}

.feeWrap .sec {
float: left;
width: 48%;
margin-right: 2%;
}

.feeWrap .sec:last-child {
margin-right: 0%;
}

.feeBox2 {
width: 96%;
overflow: hidden;
margin: 0 auto;
}

.feeBox2 dl {
width: 100%;
margin: 5px 0;
clear: both;
}

.feeBox2 dl dt {
text-align: left;
font-size: 0.875em;
float: left;
width: 48%;
letter-spacing: -1px;
margin-right: 2%;
padding: 2px 0;
}

.feeBox2 dl dd {
text-align: left;
font-size: 0.875em;
float: left;
width: 50%;
letter-spacing: -1px;
padding: 2px 0;
}

.feeBoxV2 {
width: 96%;
overflow: hidden;
margin: 0 auto;
}

.feeBoxV2 dl {
width: 100%;
margin: 5px 0;
clear: both;
}

.feeBoxV2 dl dt {
text-align: left;
font-size: 0.875em;
float: left;
width: 28%;
letter-spacing: -1px;
margin-right: 2%;
padding: 2px 0;
color: #fff;
}

.feeBoxV2 dl dd {
text-align: left;
font-size: 0.875em;
float: left;
width: 70%;
letter-spacing: -1px;
padding: 2px 0;
color: #fff;
color: #fff;
}

.feeBox3 {
width: 100%;
overflow: hidden;
}

.feeBox3 dl {
width: 33.3%;
border-right: 1px solid #c5baad;
float: left;
margin: 5px 0;
}

.feeBox3 dl:last-child {
width: 33.3%;
border-right: 0
}

.feeBox3 dl dt {
text-align: center;
padding-bottom: 5px;
font-size: 0.875em;
}

.feeBox3 dl dd {
text-align: center;
font-size: 0.875em;
}

.feeBoxWrap {
width: 100%;
overflow: hidden;
margin-top: 5px;
}

.feeBoxWrap .box1 {
float: left;
width: 48%;
margin-right: 2%;
}

.feeBoxWrap .box2 {
float: left;
margin-left: 2%;
width: 47%;
padding-left: 5px;
}

.feeBoxWrap h2 {
padding: 3px 0 6px;
text-align: center;
border-bottom: 1px solid #cfc4b7;
color: #fff;
font-size: 0.875em;
}

.feeBoxWrap dl {
clear: both;
width: 100%;
}

.feeBoxWrap dt {
width: 55%;
letter-spacing: -1px;
font-size: 0.875em;
color: #fff;
float: left;
padding: 3px 0 3px 5px;
text-align: left;
}

.feeBoxWrap dd {
width: 45%;
font-family: "Eina03";
font-size: 0.875em;
color: #fff;
float: left;
text-align: right;
padding: 3px 5px 3px 0;
}

.feeBoxWrap2 {
width: 100%;
overflow: hidden;
background-color: #ece7e2;
margin-bottom: 15px;
}

.feeBoxWrap2 .box1 {
float: left;
width: 48%;
margin-right: 2%;
}

.feeBoxWrap2 .box2 {
float: left;
margin-left: 2%;
width: 47%;
padding-left: 5px;
}

.feeBoxWrap2 h2 {
padding: 3px 0 6px;
text-align: center;
border-bottom: 1px solid #cfc4b7;
color: #fff;
font-size: 0.875em;
}

.feeBoxWrap2 dl {
clear: both;
width: 100%;
}

.feeBoxWrap2 dt {
width: 100%;
letter-spacing: -1px;
font-size: 0.875em;
float: left;
padding: 3px 0 3px 5px;
text-align: center;
}

.feeBoxWrap2 dd {
width: 100%;
font-family: "Eina03";
font-size: 0.875em;
float: left;
text-align: left;
padding: 3px 5px 3px 0;
}

.feeBoxWrap2 .box3 {
width: 100%;
}

.feeBoxWrap2 .box3 dl {
clear: both;
width: 100%;
border-bottom: 1px solid #cfc4b7;
overflow: hidden;
}

.feeBoxWrap2 .box3 dt {
width: 49%;
letter-spacing: -1px;
font-size: 0.875em;
float: left;
padding: 3px 0 3px 5px;
text-align: center;
}

.feeBoxWrap2 .box3 dd {
width: 50%;
font-family: "Eina03";
font-size: 0.875em;
float: left;
text-align: left;
padding: 3px 5px 3px 15px;
}

.feeText {
width: 96%;
margin: 0 auto;
padding: 10px 5px;
border-bottom: 1px solid #cfc4b7;
}

.feeText h3 {
font-weight: 500;
padding: 0 !important;
}

.feeText h4 {
padding-left: 5px;
line-height: 1.25em;
padding: 3px 5px;
font-size: 0.875em;
margin: 0;
}

.table-sub-text {
position: relative;
color: #222;
font-size: 20px;
margin: 10px 15px;
font-weight: 400;
}

.table-sub-text::after {
content: '';
position: absolute;
bottom: 10px;
left: -15px;
background: #c8a445;
width: 8px;
height: 8px;
}

/* reservation calendar */
.main-calendar {
position: relative;
width: 100%;
height: 100%;
color: #e8e8e8;
}

.header-calendar {
text-align: center;
font-size: 24px;
width: 100%;
margin-bottom: 50px;
display: flex;
align-items: center;
justify-content: center;
}

.header-calendar a {
display: inline-block;
}

.header-calendar p {
font-weight: 700;
font-size: 30px;
width: 100%;
text-align: center;
}

.calendar {
width: 100%;
font-size: 17px;
border-collapse: separate;
border-spacing: 2px;
}

.calendar th {
padding: 5px 0;
font-size: 16px;
font-weight: 500;
}

.calendar th:first-child {
color: #e34346;
}

.calendar th:last-child {
color: #008ec4;
}

.calendar td {
color: #ccc;
padding: 25px;
text-align: center;
position: relative;
border: 1px solid #e8e8e8;
font-size: 24px;
}

.calendar tr td.possible:first-child {
color: #e34346;
}

.calendar tr td.possible:last-child {
color: #008ec4;
}

.calendar td span {
position: absolute;
font-size: 14px;
right: 3px;
bottom: 3px;
color: #222;
}

.calendar td.today {
/* background-color: #c8a445; */
background-color: #fff;
color: #e34346;
}

.calendar td.today span {
display: block;
position: absolute;
bottom: 3px;
right: 3px;
text-align: right;
width: 100%;
font-size: 14px;
color: #e34346;
}

.calendar td.possible {
border: 1px solid #ccc;
color: #222;
cursor: pointer;
}

.calendar td.possible span {
display: block;
position: absolute;
bottom: 3px;
right: 3px;
text-align: right;
width: 100%;
font-size: 14px;
color: #222;
}

.calendar td.choice {
background-color: var(--main-color);
/* background-color: #e34346; */
color: #fff;
}

.calendar td.choice span {
/*background-color: #e34346;*/
/* color: #fff; */
color: inherit;
}

.calendar td.no span {
color: #ccc;
}

.calendar td.deadline {
background-color: rgba(255, 255, 255, 0.1);
color: #666;
}

.calendar td.deadline span {
display: block;
position: absolute;
bottom: 10px;
left: 0;
text-align: center;
width: 100%;
font-size: 14px;
color: #666;
}

.calendar td.open {
background-color: rgba(255, 255, 255, 0.1);
color: #666;
}

.calendar td.open span {
display: block;
position: absolute;
bottom: 10px;
left: 0;
text-align: center;
width: 100%;
font-size: 14px;
color: #666;
}

.half-calendar {
width: 47%;
display: inline-block;
margin-left: 68px;
}

.half-calendar:first-child {
margin-left: 0;
}

/*자물쇠이미지추가*/
.calendar td img {
position: absolute;
left: 5px;
bottom: 5px;
}

/* calendar title, arrow */
.arrow_prev01,
.arrow_next01 {
position: relative;
}

.arrow_prev01::before {
content: "◀";
color: #E8E8E8;
position: absolute;
top: 10px;
left: 4px;
cursor: pointer;
font-size: 19px;
}

.arrow_next01::before {
content: "▶";
color: #535B5D;
position: absolute;
top: 10px;
right: 4px;
cursor: pointer;
font-size: 19px;
}

/* calendar table */
.calendar-wrap01,
.calendar-wrap02 {
  text-align: center;
  width: 47%;
  float: left;
}

.calendar-wrap01 {
  margin-right: 50px;
}

.month_choice01 {
  padding-bottom: 20px;
}

.month_choice01 h2 {
  text-align: center;
  font-size: 24px;
}

.m_calendar {
  width: 100%;
  font-family: 'Montserrat', serif;
  text-align: center;
  margin: 0 auto;
  border-bottom: 1px solid #E8E8E8;
}

.m_calendar thead tr th {
  border-bottom: 1px solid #E8E8E8;
  padding: 15px 0;
  text-transform: uppercase;
  font-size: 11px;
  font-family: 'Montserrat', sans-serif;
}

.m_calendar tbody tr td {
  border-bottom: 1px solid #E8E8E8;
  padding: 15px 0;
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
  cursor: pointer;
}

.m_calendar tbody tr td.today {
  border: 1px double #f6743b;
}

.m_calendar tbody tr:last-child {
  border-bottom: none !important;
}

.m_calendar tbody tr td span {
  display: block;
  font-size: 13px;
  color: #f6743b;
  font-family: 'Noto Sans KR';
  letter-spacing: 0.5px;
}

.m_calendar tbody tr td.choice {
  background: #F3F3D4;
}

.m_calendar tbody tr td.end {
  background: #F4F4F4;
  color: #B4BBBC !important;
  cursor: default;
}

.m_calendar tbody tr td.end span {
  color: #B4BBBC !important;
}

.m_calendar tbody tr td.today span {
  color: #f6743b;
}

.m_calendar thead tr th:first-child {
  color: #D57878;
}

.m_calendar thead tr th:last-child {
  color: #4E85AA;
}

.m_calendar tbody tr td:first-child {
  color: #D57878;
}

.m_calendar tbody tr td:last-child {
  color: #4E85AA;
}

.m_calendar tbody tr:last-child td:last-child {
  color: #000 !important;
}

/* reser-table */
.reser-select {
border: 1px solid #b4bbbc;
color: #384043;
padding: 5px 30px;
font-size: 14px;
font-weight: 500;
}

.reser-select:hover {
background: #c8a445;
color: #fff;
border: 0;
}

.reser-tab-scroll-sale {
color: #000 !important;
}

.reser-tab table {
width: 100%;
text-align: center;
height: 60px;
font-size: 16px;
}

.reser-tab table th {
vertical-align: middle;
border-bottom: 1px solid #000;
font-weight: 500;
}

.reser-tab table tbody tr {
height: 60px;
border-bottom: 1px solid #e8e8e8;
}

.reser-tab table tbody td {
vertical-align: middle;
font-size: 17px;
}

.reser-tab table tbody tr:hover {
background: #f9f9f9;
cursor: pointer;
}

.reser-tab table tbody tr:hover td {
font-weight: 400;
}

.reser-tab table tbody tr:hover .reser-select {
background: #c8a445;
color: #fff;
border: 1px solid #c8a445;
}

.reser-tab-scroll {
display: block;
overflow: auto;
height: 500px;
}

.scroll-2 {
height: 731px;
}

.reser-tab-scroll::-webkit-scrollbar {
width: 8px;
}

.reser-tab-scroll::-webkit-scrollbar-thumb {
height: 20%;
background: #c8a445;
}

.reser-tab-scroll::-webkit-scrollbar-track {
background: #e8e8e8;
}

.reser-table {
width: 100%;
text-align: center;
height: 60px;
font-size: 16px;
}

.reser-table th {
vertical-align: middle;
border-top: 1px solid #000;
font-weight: 500;
padding: 15px 0;
border-bottom: 1px solid #b4bbbc;
}

.reser-table tbody tr {
height: 60px;
border-bottom: 1px solid #e8e8e8;
}

.reser-table tbody td {
vertical-align: middle;
font-size: 17px;
}

.reser-table tbody tr:hover {
background: #f9f9f9;
cursor: pointer;
}

.reser-table tbody tr:hover .fw-bold {
font-weight: 400;
}


/* reserCheck */
.reserChk-box {
margin: 0 auto;
width: 60%;
padding: 0 0 60px 0;
display: flex;
justify-content: space-around;
align-items: center;
}

.search-box {
display: inline-block;
}

.choice-day-box {
display: flex;
width: 100%;
color: #5f6668;
justify-content: center;
align-items: center;
}

.choice-day-box span {
line-height: 48px;
width: 5%;
text-align: center;
font-size: 18px;
}

.choice-day-box .daypick {
vertical-align: middle;
position: relative;
top: -8px;
}

.choice-day-box .choice-day {
width: 234px;
/* height: 48px; */
padding: 10px;
background-color: #f4f4f4;
cursor: pointer;
font-size: 18px;
}

.choice-day-box .choice-day img {
width: 26px;
height: 24px;
display: inline-block;
vertical-align: middle;
margin-right: 10px;
}

.choice-day-box .choice-day2 {
width: 340px;
height: 45px;
padding: 10px;
background-color: #f4f4f4;
cursor: pointer;
font-size: 18px;
}

/* .choice-day-box button{ background-color: transparent; margin-top: -12px;margin-left: 30px;}
.choice-day-box button img{ display: inline-block; max-width:70px;width: 70px;height: 70px;} */
.date-serch {
width: 20%;
background: #c5a658;
height: 45px;
color: #fff;
margin-top: 1px;
margin-left: 20px;
font-size: 16px;
font-weight: 300;
}
  
/*reserCheck list*/
.reser-check-wrap {
width: 1020px;
margin: 0 auto;
}

.reser-check-list {
padding: 20px 0 18px;
width: 100%;
}

.reser-check-wrap table {
width: 100%;
}

.reser-check-wrap table thead {
width: 100%;
border-top: 2px solid #c5a658;
}

.reser-check-wrap table thead th {
text-align: center;
height: 47px;
vertical-align: middle;
}

.reser-check-wrap table tbody tr {
border-top: 1px solid #ddd;
}

.reser-check-wrap table tbody td {
text-align: center;
height: 70px;
vertical-align: middle;
}

.reser-check-wrap table tbody tr:hover {
cursor: pointer;
background: #f9f9f9;
}

.last-tr {
border-bottom: 1px solid #ddd;
}

.reser-check-wrap02 {
width: 1020px;
margin: 0 auto;
}

.reser-check-wrap02 table {
width: 100%;
}

.reser-check-wrap02 table thead {
width: 100%;
border-top: 2px solid #c5a658;
}

.reser-check-wrap02 table thead th {
text-align: center;
height: 47px;
vertical-align: middle;
}

.reser-check-wrap02 table tbody tr {
border-top: 1px solid #ddd;
}

.reser-check-wrap02 table tbody td {
text-align: center;
height: 70px;
vertical-align: middle;
}

.reser-check-wrap02 table tbody tr:hover {
cursor: pointer;
background: #f9f9f9;
}

.last-tr {
border-bottom: 1px solid #ddd;
}

/*reser_layerPopup*/
.commonPop {
background-color: #fff;
position: fixed;
z-index: 10000;
left: 50%;
top: 50%;
word-break: keep-all;
height: 90%;
width: 800px;
overflow-y: auto;
transform: translate(-50%, -50%);
padding: 1em;
}

.commonPop2 {
position: fixed;
z-index: 10000;
left: 50%;
top: 50%;
word-break: keep-all;
transform: translate(-50%, -50%);
padding: 10px;
width: 100%;
margin: 0 auto;
}

.commonPop.layer1 {
width: 462px;
padding: 30px;
max-height: 550px;
overflow-y: auto;
border: 4px solid #c8a445;
}

.commonPop.layer2 {
width: 830px;
height: 555px;
}

.guideTable {
width: 100%;
margin-bottom: 10px;
border-bottom: 1px solid #ddd;
}

.guideTable caption {
display: none;
}

.guideTable tr:last-child th {
border: 0;
}

.guideTable th {
font-size: 15px;
color: #2f3334;
font-weight: 300;
text-align: left;
}

.guideTable td {
font-size: 15px;
padding: 10px 0;
text-align: right;
color: #535252;
}

.guide_title {
font-size: 20px;
font-weight: 700;
}

.commonPop h2.mainTit {
font-size: 22px;
padding-bottom: 15px;
font-weight: 600;
}

.commonPop h2.mainTit img {
vertical-align: middle;
}

.commonPop h3 {
margin: 7px 0;
font-weight: 300;
font-size: 16px;
}

.commonPop .commonTxt {
line-height: 1.5em;
letter-spacing: -0.5px;
}

.commonPop p {
line-height: 25px;
margin: 10px 0;
font-size: 15px;
font-weight: 300;
}

.infoBtn {
margin: 30px 0;
}

.infoBtn a {
padding: 10px;
background: #81ba32;
color: #fff;
}

.reserChk {
color: red;
font-size: 18px;
display: block;
text-align: center;
}

.overlay2 {
display: none;
position: fixed;
top: 0%;
left: 0%;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.8);
z-index: 200;
}

.chkLayer{
border:4px solid #c8a445; 
background-color: #fff; 
position:fixed; 
z-index:1010; 
width: 530px; 
height: auto; 
max-height: 80%; 
padding: 35px 0; 
top:50%; 
left:50%; 
transform: translate(-50%,-50%);
}

.check-popup {
text-align: center;
}

.check-popup h3 {
font-size: 18px;
line-height: 27px;
font-weight: 500;
}

.check-popup h4 {
margin: 15px 0;
color: #999;
}

.check-popup h4 span {
font-size: 20px;
font-weight: 600;
color: #222;
margin-right: 8px;
}

.check-popup p {
color: #e34346;
line-height: 24px;
}

/* popup 2*/
.check-popup2 {
text-align: center;
}

.check-popup2 h3 {
color: #e34346;
font-size: 20px;
font-weight: 600;
}

.check-popup2 p {
margin: 12px 0 18px;
}

.check-popup2 h4 {
font-size: 20px;
font-weight: 600;
}

.chk-btn {
margin-top: 35px;
text-align: center;
}

.chk-btn a {
display: inline-block;
border: 1px solid #c8a445;
color: #c8a445;
font-weight: 400;
width: 35%;
padding: 8px;
margin-right: 15px;
}

.chk-btn a:last-child {
margin-right: 0;
}

.chk-btn a.on {
background: #c8a445;
color: #fff;
font-weight: 400;
}

/*reservation-btn*/
.btn-reser {
width: 80%;
text-align: center;
overflow: hidden;
margin: 0 auto;
}

.btn-reser a {
float: left;
width: 48%;
border: 1px solid #c8a445;
color: #c8a445;
font-weight: 500;
display: inline-block;
line-height: 40px;
font-size: 1.06em;
margin-right: 10px;
background: #fff;
}

.btn-reser a:last-child {
margin-right: 0;
}

.btn-reser a.enter {
line-height: 48px;
}

.btn-reser a.on {
background-color: #c8a445;
color: #fff;
}

.btn-reser a:last-child {
float: right;
}

/* reser-btn */
.reser-btn {
padding-bottom: 2em;
}

.reser-btn a {
width: 48%;
border: 1px solid #A14D37;
text-align: center;
padding: 0.5em 1em;
color: #A14D37;
display: inline-block;
font-weight: 500;
}

.reser-btn a.red {
color: #fff !important;
background: #A14D37 !important;
float: right;
}

.reser-btn02 {
border: 1px solid #ccc;
border-radius: 5px;
background: #fff;
color: #333;
padding: 3px 15px;
}

.reser-btn02:hover {
background: #c8a445;
color: #fff;
border: 0;
}

/*reser-check-layer-pop*/
.overlay {
display: none;
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(0,0,0,0.8);
z-index: 1004;
}

.basic-pop {
background-color: #fff;
border-radius: 4px;
position: absolute;
z-index: 1010;
width: 435px;
padding: 20px 28px;
top: 370px;
/* left: 736px; */
left: 50%;
transform: translateX(-50%);
border: 1px solid #ccc;
box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
}

.basic-pop2 {
background-color: #fff;
border-radius: 4px;
position: absolute;
z-index: 1010;
width: 435px;
padding: 20px 28px;
top: 370px;
/* left: 975px; */
left: 50%;
transform: translateX(-50%);
border: 1px solid #ccc;
box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
}

.basic-pop4 {
background-color: #fff;
border-radius: 4px;
position: absolute;
z-index: 1010;
width: 435px;
padding: 20px 28px;
top: 1100px;
left: 650px;
border: 1px solid #ccc;
box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
}

.basic-pop5 {
background-color: #fff;
border-radius: 4px;
position: absolute;
z-index: 1010;
width: 320px;
padding: 20px;
top: 366px;
left: 57%;
border: 1px solid #ccc;
box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
transform: translate(3%, 0);
}

.basic-pop6 {
background-color: #fff;
border-radius: 4px;
position: absolute;
z-index: 1010;
width: 320px;
padding: 20px;
top: 366px;
left: 64%;
border: 1px solid #ccc;
box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
transform: translate(3%, 0);
}

.basic-pop .calendar-area {
padding-bottom: 0;
font-size: 11px;
}

.month-title {
font-size: 20px;
text-align: center;
padding: 10px 0;
font-weight: 600;
}

/* calendar title, arrow */
.arrow_prev,
.arrow_next {
  position: relative;
}

.arrow_prev::before {
  content: url(/images/icon_row_left.svg);
  position: absolute;
  top: 10px;
  left: 4px;
  cursor: pointer;
  font-size: 10px;
  background: #f5f6f7;
}

.arrow_next::before {
  content: url(/images/icon_row_right.svg);
  position: absolute;
  top: 10px;
  right: 4px;
  cursor: pointer;
  font-size: 10px;
  background: #f5f6f7;
}

/*********** reser- check ***********/
.p_calendar {
width: 100%;
font-size: 17px;
border-collapse: separate;
border-spacing: 2px;
}

.p_calendar th {
padding: 5px 0;
font-size: 12px;
}

.p_calendar th:first-child {
color: #e34346;
}

.p_calendar th:last-child {
color: #008ec4;
}

.p_calendar td {
color: #222;
padding: 16px;
text-align: center;
position: relative;
border: 1px solid #e8e8e8;
font-size: 17px;
}

.p_calendar td.today {
border: 1px solid #c8a445;
}

/*2*/
.p_calendar2 {
width: 100%;
font-size: 17px;
border-collapse: separate;
border-spacing: 2px;
}

.p_calendar2 th {
padding: 5px 0;
font-size: 12px;
}

.p_calendar2 th:first-child {
color: #e34346;
}

.p_calendar2 th:last-child {
color: #008ec4;
}

.p_calendar2 td {
color: #222;
padding: 5px;
text-align: center;
position: relative;
border: 1px solid #e8e8e8;
font-size: 17px;
}

.p_calendar2 td.today {
border: 1px solid #c8a445;
}


/* 단체예약접수 */
.reser-team-cont {
    margin-top: 56px;
}

.reser-team-cont .title {
    color: #000;
    font-weight: 700;
    margin-bottom: 15px;
    position: relative;
    margin-left: 45px;
    font-size: 26px;
}

.reser-team-cont .title::after {
    content: "";
    position: absolute;
    left: -45px;
    top: 50%;
    transform: translateY(-50%);
    background: url('/images/content/icon_title.svg') no-repeat;
    width: 35px;
    height: 19px;
}

.reser-team-icon {
    margin: 64px 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0 40px;
}

.reser-team-icon .icon-list {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.reser-team-icon .img {
    background: #C8C5BB;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
     width: 178px;
    height: 178px;
}

.reser-team-icon .text {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 20px;
}

.reser-team-icon .text span {
    font-size: 18px;
    display: block;
    margin-bottom: 5px;
    font-weight: 600;
}

.reser-team-icon .text b {
    font-size: 18px;
    font-weight: 400;
}

.reser-team-apply {
    background: #F5F5F5;
    padding: 40px;
}

.reser-team-apply .apply-text li {
    line-height: 36px;
    font-size: 18px;
    display: flex;
    align-items: center;
    gap: 0 10px;
}

.reser-team-apply .apply-text li strong {
    font-weight: 700;
}

.reser-team-apply .apply-info {
    background: #FFF;
    border-top: 1px solid #D6D6D6;
    border-bottom: 1px solid #d6d6d6;
    padding: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0 89px;
    margin-top: 32px;
}

.reser-team-apply .apply-info li {
    font-size: 18px;
    position: relative;
}

.reser-team-apply .apply-info li:not(:last-child)::after {
    content: "";
    position: absolute;
    right: -40px;
    top: 50%;
    transform: translateY(-50%);
    background: #D6D6D6;
    width: 1px;
    height: 12px;
}

.reser-team-apply .apply-info li span {
    color: #666;
    margin-right: 16px;
}

.reser-team-apply .apply-info li b {
    margin-right: 10px;
}

.reser-team-apply .btn-file {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0 16px;
    margin-top: 40px;
}

.reser-team-apply .btn-file a {
    border-radius: 4px;
    width: 248px;
    padding: 13px 0;
    color: var(--main-color);
    border: 1px solid var(--main-color);
    font-weight: 600;
    position: relative;
    display: flex;
    align-items: center;
    gap: 0 10px;
    justify-content: center;
}

.reser-team-apply .btn-file a.on {
    color: #FFF;
    background: var(--main-color);
}

.reser-team-apply .btn-file a.form {
    color: #fff;
    background: #2FB14A;
    border: 1px solid #2FB14A;
}

.reser-team-table table {
    font-size: 16px;
    text-align: center;
}

.reser-team-table table thead tr th {
    background: #F5F5F5;
    padding: 20px 0;
    color: #666;
    border-top: 2px solid var(--main-color);
    border-bottom: 1px solid #D6D6D6;
}

.reser-team-table table tbody tr td {
    padding: 20px 0;
    border-right: 1px solid #D6D6D6;
    border-bottom: 1px solid #D6D6D6;
}

.reser-team-table table tbody tr td:last-child {
    border-right: 0;
}

.reser-team-table table tbody tr td.red {
    color: #E32D2E;
}

.reser-team-step {
    background: #f9f9f9;
    padding: 32px 40px;
}

.reser-team-step ul {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0 72px;
}

.reser-team-step ul li {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 160px;
    height: 160px;
    border: 1px solid #D6D6D6;
    border-radius: 4px;
    gap: 16px 0;
    position: relative;
    background: #fff;
    text-align: center;
}

.reser-team-step ul li:not(:last-child)::after {
    content: "";
    position: absolute;
    right: -50px;
    top: 50%;
    transform: translateY(-50%);
    width: 24px;
    height: 24px;
    background: url('/images/content/icon_reserTeam_arrow.svg')no-repeat center center / cover;
}

.reser-team-step ul li span {
    display: block;
    color: #A67624;
    font-weight: 700;
}

/* // 단체예약접수 */


/* 대기예약 */
.reserWait-guide {
    padding: 16px;
    background: #F5F5F5;
    margin: 50px 0 60px 0;
}

.reserWait-guide ul {
    display: flex;
    flex-direction: column;
    margin-left: 10px;
}

.reserWait-guide ul li {
    font-size: 18px;
    line-height: 33px;
    display: flex;
    align-items: center;
    gap: 0 10px;
}

.waitInfo-check {
    border: 2px solid var(--main-color);
    padding: 32px 0; 
}

.waitInfo-check ul {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0 80px;
}

.waitInfo-check ul li {
    font-size: 20px;
    color: #999;
    position: relative;
    display: flex;
    align-items: center;
    gap: 0 10px;
}

.waitInfo-check ul li:not(:last-child)::after {
    content: "";
    position: absolute;
    right: -45px;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 14px;
    background: #999;
} 

.waitInfo-check ul li span {
    font-weight: 500;
}

.waitInfo-check ul li span.name {
    color: #212429;
}

.waitInfo-check ul li span.date {
    color: #E32D2E;
    display: flex;
    align-items: center;
    gap: 0 5px;
}

.waitInfo-apply {
    margin-top: 56px;
}

.waitInfo-apply .title {
    font-size: 26px;
    font-weight: 600;
}

.waitInfo-apply-table {
    margin-top: 24px;
    border-top: 2px solid var(--main-color);
    padding: 36px 0;
}

.waitInfo-apply-table tbody tr th {
    font-size: 22px;
    font-weight: 500;
    padding-left: 16px;
    text-align: left;
    padding: 15px 0 15px 16px;
    width: 25%;
}

.waitInfo-apply-table tbody tr td {
    font-size: 18px;
    font-weight: 500;
    text-align: left;
    padding: 15px 0;
}

.waitInfo-apply-table tbody tr td span.text {
    color: #999;
    font-size: 18px;
    margin-left: 5px;
    font-weight: 400;
}

.waitInfo-apply-table tbody tr td b:not(:first-child) {
    margin-left: 5px;
}

.waitInfo-apply-table tbody tr td textarea {
    width: 100%;
    height: 160px;
    overflow: auto;
    border: 1px solid #D6D6D6;
    padding: 10px 20px;
    outline: none;
    resize: none;
    font-size: 18px;
    color: #999;
    font-weight: 400;
}

.waitInfo-apply-table tbody tr td textarea::placeholder {
    font-size: 18px;
    color: #999;
    font-weight: 400;
}

.select-box-wait {
    border: 1px solid #d6d6d6;
    width: 200px;
    font-weight: 400;
    padding: 10px 16px;
    background: url('/images/inputSelect.svg')no-repeat right 20px center;
    height: auto;
    border-radius: 0;
    text-indent: 0;
    font-size: 18px;
    color: #454545;
}

.waitInfo-apply .btn-apply {
    display: flex;
    justify-content: center;
    margin-top: 40px;
}

.waitInfo-apply .btn-apply a {
    background: var(--main-color);
    color: #fff;
    font-size: 16px;
    text-align: center;
    width: 343px;
    padding: 14px 0;
    display: block;
    border-radius: 4px;
    font-weight: 600;
}

/* // 대기예약 */



/* // 예약 */


/* board */

/* list */
.visit-date {
display: inline-block;
}

.visit-date li {
display: inline-block;
border: 1px solid #e8e8e8;
border-radius: 4px;
color: #999;
padding: 7px 20px;
margin-right: 8px;
width: 80px;
text-align: center;
cursor: pointer;
}

.visit-date li.on {
border: 1px solid #c8a445;
color: #c8a445;
}

.page-number {
width: 100%;
text-align: center;
}

.page-number li {
display: inline-block;
background: #f5f6f7;
color: #999;
width: 34px;
height: 34px;
vertical-align: middle;
cursor: pointer;
margin: 0 3px;
line-height: 34px;
}

.page-number li:first-child {
padding: 0;
}

.page-number li:last-child {
padding: 0;
}

.page-number li img {
vertical-align: middle;
}

.page-number li.on {
background: #444a5c;
color: #fff;
}

.choice-day-box3 {
display: flex;
width: 100%;
color: #5f6668;
justify-content: flex-end;
align-items: center;
}

.choice-day-box3 span {
margin: 0 10px;
}

.choice-day-box3 .choice-day3 {
width: 25%;
height: 36px;
line-height: 36px;
padding: 5px 10px;
background-color: rgba(68, 74, 92, 0.05);
cursor: pointer;
font-size: 16px;
color: #222;
border-radius: 4px;
background-image: url('/images/icon_calendar.svg');
background-repeat: no-repeat;
background-position: right;
}

.choice-day-box3 .choice-day3 img {
width: 26px;
height: 24px;
display: inline-block;
vertical-align: middle;
margin-right: 10px;
}

.date-serch3 {
width: 12%;
background: rgba(68, 74, 92, 0.15);
height: 36px;
color: #222;
margin-top: 1px;
margin-left: 10px;
font-size: 16px;
font-weight: 300;
border-radius: 4px;
}

.notice-sel {
position: relative;
}

.n-sel {
background: #f5f6f7;
position: relative;
height: 50px !important;
}

.n-sel::placeholder {
color: #999;
}

.n-serch {
background: rgba(68, 74, 92, 0.15);
color: #222;
border-radius: 4px;
padding: 6px 23px;
position: absolute;
left: 280px;
bottom: 7px;
font-size: 16px;
}

.board-table {
width: 100%;
border-top: 2px solid #c8a445;
border-bottom: 1px double #222;
text-align: center;
}

.board-table thead th {
background: #f5f6f7;
padding: 15px;
color: #666;
vertical-align: middle;
border-bottom: 1px solid #ccc;
}

.board-table thead th:last-child {
border-right: 0;
}

.board-table tbody td {
padding: 15px 0;
color: #222;
border-bottom: 1px solid #ccc;
vertical-align: middle;
}

.board-table tbody td span {
display: block;
margin: 3px 0;
}

.board-table tbody td a {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
width: 100%;
display: block;
text-align: left;
}

.board-table tbody tr:hover a {
color: #222;
font-weight: 500;
}

.board-table2 {
width: 100%;
border-top: 2px solid #c8a445;
border-bottom: 1px double #222;
text-align: center;
}

.board-table2 thead th {
background: #f5f6f7;
padding: 15px;
color: #666;
vertical-align: middle;
border-bottom: 1px solid #ccc;
}

.board-table2 thead th:last-child {
border-right: 0;
}
  
.board-table2 tbody td {
color: #222;
border-bottom: 1px solid #ccc;
vertical-align: middle;
height: 54px;
}

.board-table2 tbody td img {
vertical-align: middle;
margin: 0 auto;
}

.board-table2 tbody td span {
display: block;
margin: 3px 0;
}

.board-table2 tbody td a {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
width: 100%;
display: block;
text-align: left;
}

.board-table2 tbody tr:hover a {
color: #222;
font-weight: 500;
}

.file-area {
text-align: right;
width: 100%;
display: block;
position: absolute;
top: 5px;
right: 15px;
}

.file-area .file {
display: inline-block;
width: auto;
vertical-align: bottom;
text-decoration: underline;
font-weight: 500;
color: #e34346;
}

.board-table tbody tr:hover .file {
color: #e34346;
}

.galleryBox {
    width: 260px;
    height: 290px;
    display: inline-block;
    margin: 15px 18px;
}

.galleryBox .gallBoxCont a {
    display: block;
    overflow: hidden;
    font-size: 0;
}

.galleryBox .gallBoxCont .galImg {
    width: 100%;
    height: 160px;
}

.galleryBox .gallBoxCont .galImg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 4px;
}

.galleryBox .gallBoxCont .galleryB {
    height: 130px;
}

.galleryBox .gallBoxCont .galleryB .gallTitle {
    width: 240px;
    height: 37px;
    line-height: 37px;
    font-size: 18px;
    font-weight: 400;
    padding: 10px 0;
    text-overflow: ellipsis;
    display: block;
    white-space: nowrap;
    overflow: hidden;
}

.galleryBox .gallBoxCont .galleryB .gallDate {
    font-size: 16px;
    color: #999;
}

/* view */
.notice-title {
font-size: 20px;
color: #222;
font-weight: 400;
}

.notice-info {
display: block;
}

.notice-info span {
position: relative;
margin: 0 10px;
}

.notice-info span::after {
content: '';
position: absolute;
bottom: 10px;
right: -15px;
width: 4px;
height: 4px;
border-radius: 50%;
background: #666;
}

.notice-info span:last-child:after {
display: none;
}

.notice-con {
padding: 50px 0;
margin: 0 auto;
text-align: center;
position: relative;
}

#imageContainer1 img {
width: auto;
max-width: 1200px;
margin: 0 auto;
}

.notice-btn a {
background: #999;
display: block;
color: #fff;
text-align: center;
width: 17%;
padding: 12px;
margin: 100px auto 0;
font-size: 18px;
}

.notice-text {
display: block;
}

.lost-wrap {
    display: flex;
    flex-direction: column;
    gap: 56px 0;
}

.lost-wrap h2.title {
    color: #000;
    font-weight: 700;
    margin-bottom: 15px;
    position: relative;
    font-size: 26px;
}

.lost-info ul {
    background: #f5f5f5;
    padding: 20px;
    border-radius: 16px;
}

.lost-info ul li {
    line-height: 24px;
    display: flex;
    align-items: center;
    gap: 0 5px;
}

.lost-info ul li b {
    font-size: 30px;
}

.lost-wrap .lost-table table {
    width: 100%;
    table-layout: fixed;
    text-align: center;
    font-size: 16px;
}

.lost-wrap .lost-table table thead tr th {
    color: #666;
    font-weight: 600;
    padding: 18px 0;
    background: #F5F5F5;
    line-height: 130%;
    border-right: 1px solid #D6D6D6;
}

.lost-wrap .lost-table table thead tr th:last-child {
    border-right: 0;
}

.lost-wrap .lost-table table thead tr:first-child th {
    border-top: 2px solid var(--main-color);
    border-bottom: 1px solid #D6D6D6;
}

.lost-wrap .lost-table table thead tr:last-child th {
    border-bottom: 1px solid #D6D6D6;
}

.lost-wrap .lost-table table thead tr:first-child th.br1 {
    border-bottom: 1px solid #D6D6D6;
}

.lost-wrap .lost-table table tbody tr td {
    background: #fff;
    padding: 18px 0;
    border-bottom: 1px solid #D6D6D6;
    border-right: 1px solid #D6D6D6;
    line-height: 130%;
}

.lost-wrap .lost-table table tbody tr td:last-child {
    border-right: 0;
}

.lost-wrap .lost-table table tbody tr td.bdr1 {
    border-right: 1px solid #D6D6D6;
}

.lost-wrap .lost-table.rowspan table tbody tr td:not([rowspan]) {
    border-right: 1px solid #D6D6D6;
}

.lost-wrap .lost-table tbody tr th {
    background: #F5F5F5;
    padding: 18px 0;
    border-bottom: 1px solid #D6D6D6;
    border-right: 1px solid #D6D6D6;
    font-weight: 600;
    color: #666;
}

.lost-wrap .lost-table table tbody tr td span.red {
    color: #E32D2E;
}

.lost-wrap .table-text02 {
    margin-top: 15px;
    display: flex;
    flex-direction: column;
}

.lost-wrap .table-text02 li {
    font-size: 16px;
    line-height: 27px;
}

.lost-wrap .table-text02 li b {
    margin-right: 5px;
    display: inline-block;
    font-weight: 400;
}


/* // board */



/* clubinfo */
.clubinfo-wrap {
    padding-top: 90px;
    overflow-x: hidden;
}

.clubinfo-wrap img {
    width: 100%;
    height: 100%;
}

.clubinfo-wrap .section01 {
    position: relative;
}

.clubinfo-wrap .section01 .text {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.clubinfo-wrap .section01 .text h2 {
    text-align: center;
    color: #fff;
    font-size: 40px;
    line-height: 60px;
    font-weight: 300;
    text-shadow: 0px 0px 8px rgba(0, 0, 0, 0.25);
}

.clubinfo-wrap .section02 {
    margin-top: 132px;
    position: relative;
}

.section02 .sec02-content {
    display: flex;
    width: 100%;
    align-items: center;
}

.clubinfo-wrap .section02 .img {
    width: 50%;
    overflow: hidden;
}

.clubinfo-wrap .section02 .img.left {
    border-radius: 0 10px 10px 0;
}

.clubinfo-wrap .section02 .img.right {
    border-radius: 10px 0 0 10px;
}

.clubinfo-wrap .section02 .text {
    width: 50%;
    display: flex;
    flex-direction: column;
    gap: 24px 0;
    position: relative;
}

.clubinfo-wrap .section02 .text h2 {
    color: var(--main-color);
    font-size: 32px;
    font-weight: 600;
}

.clubinfo-wrap .section02 .text p {
    font-size: 18px;
    line-height: 27px;
}

.clubinfo-wrap .section02 .text.first {
    left: 110px;
}

.clubinfo-wrap .section02 .text.second {
    left: 160px;
}

.clubinfo-wrap .section03 {
    display: flex;
    flex-direction: column;
    gap: 32px 0;
    padding: 160px 0 192px 0;
}

.clubinfo-wrap .section03 p {
    font-size: 18px;
    text-align: center;
    line-height: 32px;
}

.clubinfo-wrap .section03 h4 {
    font-size: 32px;
    font-weight: 600;
    text-align: center;
    line-height: 48px;
}

.clubinfo-wrap .section04 {
    width: 100%;
    height: auto;
}

.clubinfo-wrap .section04 .wide-section {
    position: relative;
    height: 0;
    overflow: hidden;
    width: 100%;
    height: 238px;
    transition: 1s height;
    -webkit-transition: 1s height;
    -moz-transition: 1s height;
    -o-transition: 1s height;
    -ms-transition: 1s height;
}

.clubinfo-wrap .section04 .wide-section.on {
    width: 100%;
    height: 540px;
    transition: 0.8s height;
    -webkit-transition: 0.8s height;
    -moz-transition: 0.8s height;
    -o-transition: 0.8s height;
    -ms-transition: 0.8s height;
}

.clubinfo-wrap .section04 .wide-section .img {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 100%;
    transition: 0.8s height;
    -webkit-transition: 0.8s height;
    -moz-transition: 0.8s height;
    -o-transition: 0.8s height;
    -ms-transition: 0.8s height;
    background-size: 100% 100%;
}

.clubinfo-wrap .section04 .wide-section.ocean .img {
    background: url('/images/content/clubinfo_img05.jpg') no-repeat center center;
}

.clubinfo-wrap .section04 .wide-section.lake .img {
    background: url('/images/content/clubinfo_img06.jpg') no-repeat center center;
}

.clubinfo-wrap .section04 .wide-section.sky .img {
    background: url('/images/content/clubinfo_img07.jpg') no-repeat center center;
}

.clubinfo-wrap .section04 .wide-section.verthill .img {
    background: url('/images/content/clubinfo_img08.jpg') no-repeat center center;
}

.clubinfo-wrap .section04 .wide-section.inrange .img {
    background: url('/images/content/clubinfo_img09.jpg') no-repeat center center;
}

.clubinfo-wrap .section04 .wide-section .text {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    color: #fff;
    text-align: center;
}

.clubinfo-wrap .section04 .wide-section .text h2 {
    text-transform: uppercase;
    font-size: 30px;
    text-shadow: 0px 0px 8px rgba(0, 0, 0, 0.25);
    font-weight: 400;
    transition: 1s all;
}

.clubinfo-wrap .section04 .wide-section.on .text h2 {
    font-size: 43px;
}

.clubinfo-wrap .section04 .wide-section .text p {
    font-size: 14px;
    text-shadow: 0px 0px 8px rgba(0, 0, 0, 0.25);
    transition: 1s all;
    margin-top: 16px;
}

.clubinfo-wrap .section04 .wide-section.on .text p {
    font-size: 17px;
}

.clubinfo-wrap .section04 .wide-section .btn-more {
    display: inline-block;
    width: 175px;
    height: 0;
    margin: 0 auto 0;
    transition: 0.5s all;
    opacity: 0;
    position: absolute;
    left: 50%;
    top: 71%;
    transform: translate(-50%, -50%);
    box-sizing: border-box;
}

.clubinfo-wrap .section04 .wide-section.on .btn-more {
    height: 48px;
    opacity: 1;
    transition: 0.5s all;
}

.clubinfo-wrap .section04 .wide-section .btn-more a {
    width: 100%;
    height: 100%;
    display: block;
    font-size: 16px;
    color: #fff;
    text-align: center;
    line-height: 48px;
    border: 1px solid rgba(255,255,255,0.35);
    transition: color 0.25s;
    text-transform: uppercase;
    position: relative;
    box-sizing: border-box;
}

.clubinfo-wrap .section04 .wide-section .btn-more a span {
    text-transform: uppercase;
    font-size: 16px;
    color: #fff;
}

.clubinfo-wrap .section04 .wide-section .btn-more a::after, .clubinfo-wrap .section04 .wide-section .btn-more a::before {
    box-sizing: inherit;
    content: '';
    position: absolute;
    border: 1px solid transparent;
    width: 0;
    height: 0;
}

.clubinfo-wrap .section04 .wide-section .btn-more a::after {
    bottom: 0;
    right: 0;
}

.clubinfo-wrap .section04 .wide-section .btn-more a::before {
    top: 0;
    left: 0;
}

.clubinfo-wrap .section04 .wide-section .btn-more a:hover {
    color: #fff;
}

.clubinfo-wrap .section04 .wide-section .btn-more a:hover::before, .clubinfo-wrap .section04 .wide-section .btn-more a:hover::after {
    width: 100%;
    height: 100%;
}

.clubinfo-wrap .section04 .wide-section .btn-more a:hover::before {
    border-top-color: #FFFFFF;
    border-right-color: #FFFFFF;
    transition: width 0.25s ease-out, height 0.25s ease-out 0.25s;
}

.clubinfo-wrap .section04 .wide-section .btn-more a:hover::after {
    border-bottom-color: #FFFFFF;
    border-left-color: #FFFFFF;
    transition: border-color 0s ease-out 0.5s, width 0.25s ease-out 0.5s, height 0.25s ease-out 0.75s;
}

/* // clubinfo */

/* facility common */
.facility-slide-wrap {
    position: relative;
    margin: 0 0 40px 0;
}

.facility-slide-wrap .facility-slide .swiper-slide {
    border-radius: 15px;
    overflow: hidden;
    height: 540px;
    width: 100%;
}

.facility-slide-wrap .facility-slide .swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.facility-slide-wrap .facility-pagination {
    position: absolute;
    left: 50%;
    bottom: 15px;
    transform: translate(-50%, -50%);
    z-index: 5;
    width: auto;
}

.facility-slide-wrap .facility-pagination .swiper-pagination-bullet {
    background: rgba(255, 255, 255, 1);
    margin: 0 10px 0 0;
}

.facility-slide-wrap .facility-pagination .swiper-pagination-bullet:last-child {
    margin: 0;
}

.facility-slide-wrap .facility-pagination .swiper-pagination-bullet-active {
    background: #fff;
}

.facility-button-next {
    position: absolute;
    bottom: -53px;
    right: 0;
    width: 40px;
    height: 20px;
    background: url('/images/content/facility_arrow_next.svg') no-repeat;
    background-size: 100% 100%;
    cursor: pointer;
}

.facility-button-prev {
    position: absolute;
    bottom: -53px;
    right: 80px;
    width: 40px;
    height: 20px;
    background: url('/images/content/facility_arrow_prev.svg') no-repeat;
    background-size: 100% 100%;
    cursor: pointer;
}

.facility-info {
    width: 100%;
}

.facility-info .title {
    color: #666;
    font-size: 20px;
    margin-bottom: 10px;
    text-transform: uppercase;
    font-weight: 400;
}

.facility-info .sub-title {
    color: #000;
    font-size: 40px;
    margin-bottom: 25px;
    font-weight: 400;
}

.facility-info p.text {
    font-size: 18px;
    line-height: 27px;
}

.facility-info .info-box {
    width: 100%;
    margin-top: 40px;
}

.facility-info .info-box ul {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0 80px;
    border-top: 1px solid #D6D6D6;
    border-bottom: 1px solid #D6D6D6;
    padding: 16px 0;
}

.facility-info .info-box ul li {
    font-size: 18px;
    color: #000;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.facility-info .info-box ul li:not(:last-child):after {
    content: "";
    position: absolute;
    right: -30px;
    top: 50%;
    transform: translateY(-50%);
    background: #D6D6D6;
    width: 1px;
    height: 12px;
}

.facility-info .info-box ul li span {
    color: #666;
    margin-right: 16px;
    position: relative;
}

.facility-info .info-box ul li span::after {
    content: "·";
    font-weight: 400;
    color: #666;
    position: absolute;
    left: -18px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 35px;
}

.facility-info .info-content {
    margin-top: 40px;
    background: #F9F9F9;
    padding: 32px 24px ;
    display: flex;
    flex-direction: column;
    gap: 20px 0;
}

.facility-info .info-content h4 {
    font-size: 18px;
    font-weight: 700;
}

.facility-info .info-content ul {
    display: flex;
    flex-direction: column;
    gap: 5px 0;
}

.facility-info .info-content ul li {
    font-size: 16px;
}

.facility-info .info-content ul li.title {
    color: var(--main-color);
    font-weight: 700;
    margin-bottom: 5px;
}

.facility-info .info-content ul li:not(.title) {
    margin-left: 10px;
}

.facility-info .info-content ul li b {
    display: inline-block;
    margin-right: 10px;
}

/* // facility common */


/* restaurant */
.tab-common-wrap.restaurant .tab-common-container {
    gap: 0 190px;
}

.tab-common-wrap.restaurant .tab-common-content-wrap {
    width: calc(75% - 190px);
}

.tab-common-wrap.restaurant .tab-common-content img {
    width: 100%;
    max-width: 780px;
}

/* // restaurant */


/* location */
.map-img {
    margin-bottom: 40px;
    border-radius: 16px;
    overflow: hidden;
}

.location-info .title {
    color: #666;
    font-size: 20px;
    margin-bottom: 10px;
    text-transform: uppercase;
    font-weight: 400;
}

.location-info .sub-title {
    color: #000;
    font-size: 40px;
    margin-bottom: 25px;
    font-weight: 400;
}
~
.location-info .info-box {
    width: 100%;
    margin-top: 40px;
}

.location-info .info-box ul {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0 80px;
    border-top: 1px solid #D6D6D6;
    border-bottom: 1px solid #D6D6D6;
    padding: 16px 0 16px 16px;
}

.location-info .info-box ul li {
    font-size: 18px;
    color: #000;
    display: flex;
    align-items: center;
    justify-content: center;
}

.location-info .info-box ul li span {
    color: #666;
    margin-right: 16px;
    position: relative;
}

.location-info .info-box ul li span::after {
    content: "·";
    font-weight: 400;
    color: #666;
    position: absolute;
    left: -18px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 35px;
}

.direction-wrap {
    margin-top: 56px;
    display: flex;
    flex-direction: column;
    gap: 8px 0;
}

.direction-wrap .direction {
    background: #F9F9F9;
    padding: 32px 24px;
    display: flex;
    flex-direction: column;
    gap: 10px 0;
}

.direction-wrap .direction .direction-box {
    display: flex;
    flex-direction: column;
    gap: 5px 0;
}

.direction-wrap .direction h4 {
    font-weight: 700;
    font-size: 24px;
    margin-bottom: 5px;
}

.direction-wrap .direction h4 b {
    display: inline-block;
    margin: 0 10px;
}

.direction-wrap .direction h5 {
    font-size: 20px;
    font-weight: 700;
}

.direction-wrap .direction h5 b {
    color: var(--main-color);
    font-weight: 700;
    display: inline-block;
    margin-right: 5px;
}

.direction-wrap .direction p {
    font-size: 20px;
    margin-left: 20px;
}

.root_daum_roughmap {
    width: 100% !important;
  }
  
  .root_daum_roughmap .cont {
    display: none;
  }
  
  .root_daum_roughmap .wrap_controllers {
    display: none;
  }
  
/* // location */

/* course */
.courseInfo-title {
    color: var(--main-color);
    font-size: 32px;
    text-align: center;
    margin: 40px 0;
    font-weight: 400;
}

.courseInfo-img {
    width: 100%;
    border-radius: 16px;
    overflow: hidden;
    position: relative;
}

.courseInfo-img .img-text {
    background: rgba(102, 102, 102, 0.8);
    border-radius: 100px;
    position: absolute;
    display: flex;
    flex-direction: column;
    justify-content: center;
    z-index: 1;
}

.courseInfo-img .img-text a {
    display: block;
}

.courseInfo-img .img-text:hover {
    background: rgba(200, 164, 69, 0.8);
}

.courseInfo-img .img-text.ocean { 
    left: 48px;
    top: 130px;
}

.courseInfo-img .img-text.lake {
    right: 106px;
    bottom: 56px;
}

.courseInfo-img .img-text.sky {
    left: 240px;
    bottom: 64px;
}

.courseInfo-img .img-text.verthill {
     right: 366px;
    top: 38px;
}

.courseInfo-img .img-text ul {
    padding: 8px 24px;
}

.courseInfo-img .img-text ul li {
    color: #fff;
    line-height: 28px;
    text-align: left;
}

.courseInfo-img .img-text ul li:first-child {
    font-size: 20px;
}

.courseInfo-img .img-text ul li:first-child b {
    display: inline-block;
    margin-left: 10px;
}

.courseInfo-img .img-text ul li:last-child {
    font-size: 14px;
    display: block;
}

.courseInfo-text {
    margin-top: 56px;
}

.courseInfo-text p {
    font-size: 18px;
    line-height: 27px;
    color: #000;
}

.course-title {
    color: var(--main-color);
    font-size: 26px;
    font-weight: 600;
    text-align: center;
    background: #F9F9F9;
    padding: 10px 0;
    margin: 65px 0;
}

.courseInfo-table-wrap {
    display: flex;
    flex-direction: column;
}

.courseInfo-table {
    width: 100%;
}

.courseInfo-table.verthill h2 {
    color: #ffc000;
}

.courseInfo-table.verthill table thead tr th  {
    border-top: 2px solid #ffc000;
}

.courseInfo-table.sky h2 {
    color: #0070C0;
}

.courseInfo-table.sky table thead tr th  {
    border-top: 2px solid #0070C0;
}

.courseInfo-table.ocean h2 {
    color: #A9DCF0;
}

.courseInfo-table.ocean table thead tr th  {
    border-top: 2px solid #A9DCF0;
}

.courseInfo-table.lake h2 {
    color: #92D050;
}

.courseInfo-table.lake table thead tr th  {
    border-top: 2px solid #92D050;
}

.courseInfo-table h2 {
    font-size: 26px;
    font-weight: 600;
    margin-bottom: 14px;
}

.courseInfo-table h2 small {
    font-size: 16px;
    margin-left: 5px;
}

.courseInfo-table table {
    width: 100%;
    table-layout: fixed;
    text-align: center;
    font-size: 16px;
}

.courseInfo-table table thead tr th {
    padding: 18px 0;
    border-bottom: 1px solid #D6D6D6;
    text-transform: uppercase;
    border-top: 2px solid var(--main-color);
    background: #F5F5F5;
    color: #666;
    font-weight: 600;
}

.courseInfo-table table tbody tr td, .courseInfo-table table tbody tr th {
    background: #fff;
    padding: 18px 3px;
    border-bottom: 1px solid #D6D6D6;
    font-weight: 400;
    text-transform: uppercase;
    border-right: 1px solid #d6d6d6;
}

.courseInfo-table table tbody tr td:last-child {
    border-right: 0;
}

.course-tab {
    margin-bottom: 94px;
}

.course-tab ul {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0 5px;
}

.course-tab ul li {
    font-size: 18px;
    cursor: pointer;
    border-radius: 60px;
    width: 116px;
    background: #F9F9F9;
    color: #666;
    text-align: center;
    padding: 12px 0;
}

.course-tab ul li.on {
    color: #fff;
    background: var(--main-color);
    font-weight: 700;
}

.course-slide-wrap {
    position: relative;
    border-top: 2px solid var(--main-color);
    padding: 25px 40px 35px 40px;
}

.course-tab-content {
    display: none;
}

.course-slide .swiper-slide {
    display: flex;
}

.course-slide .swiper-slide {
    display: flex;
}

.course-slide-left {
    width: 50%;
}

.course-slide-left img {
    width: 400px;
    height: 620px;
    object-fit: contain;
}

.course-slide-right {
    width: 50%;
}

.course-slide-right .right-top {
    width: 580px;
}

.course-slide-right .right-top .hole-info {
    display: flex;
    flex-direction: column;
    gap: 10px 0;
}

.course-slide-right .right-top .hole-info .hole-num {
    display: flex;
    align-items: center;
    gap: 0 10px;
}

.course-slide-right .right-top .hole-info .hole-num span {
    border-radius: 4px;
    padding: 8px;
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    text-align: center;
    text-transform: uppercase;
}

.course-slide-right .right-top .hole-info .hole-num span.verthill {
    background: #FFC000;
}

.course-slide-right .right-top .hole-info .hole-num span.sky {
    background: #0070C0;
}

.course-slide-right .right-top .hole-info .hole-num span.ocean {
    background: #A9DCF0;
}

.course-slide-right .right-top .hole-info .hole-num span.lake {
    background: #92D050;
}

.course-slide-right .right-top .hole-info .hole-num h2 {
    font-size: 40px;
    font-weight: 400;
}

.course-slide-right .right-top .hole-info .hole-num h2 b {
    color: var(--main-color);
    display: inline-block;
    margin-left: 5px;
}

.course-slide-right .right-top .hole-info ul {
    display: flex;
    align-items: center;
    gap: 0 15px;
}

.course-slide-right .right-top .hole-info ul li {
    color: #666;
    font-size: 24px;
    font-weight: 600;
    text-transform: capitalize;
}

.course-slide-right .right-top .hole-info ul li b {
    color: var(--main-color);
    display: inline-block;
    margin-left: 10px;
}

.course-slide-right .right-btm {
    background: #F9F9F9;
    padding: 32px 16px;
    margin-top: 25px;
    border-radius: 16px;
}

.course-slide-right .right-btm .text-tip h3 {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 15px;
    position: relative;
    margin-left: 45px;
}

.course-slide-right .right-btm .text-tip h3::after {
    content: "";
    position: absolute;
    left: -45px;
    top: 50%;
    transform: translateY(-50%);
    background: url(/images/content/icon_title.svg) no-repeat;
    width: 35px;
    height: 19px;
}

.course-slide-right .right-btm .text-tip p {
    font-size: 16px;
    line-height: 180%;
    word-break: keep-all;
}

.course-slide-right .right-btm .green-info {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px 0;
    padding: 16px 0;
    border-top: 1px solid #d6d6d6;
    border-bottom: 1px solid #d6d6d6;
    margin-top: 16px;
}

.course-slide-right .right-btm .green-info ul {
    display: flex;
    align-items: center;
    gap: 0 25px;
}

.course-slide-right .right-btm .green-info ul li {
    font-size: 16px;
    position: relative;
    margin-left: 20px;
}

.course-slide-right .right-btm .green-info ul li:nth-of-type(1)::after {
    content: "";
    position: absolute;
    left: -15px;
    top: 50%;
    transform: translateY(-50%);
    background: #212429;
    border-radius: 50%;
    width: 4px;
    height: 4px;
}

.course-slide-right .right-btm .green-info ul li:nth-of-type(2)::after {
    content: "";
    position: absolute;
    left: -20px;
    top: 50%;
    transform: translateY(-50%);
    background: #212429;
    border: 1px solid #212429;
    border-radius: 50%;
    width: 12px;
    height: 12px;
}

.course-slide-right .right-btm .green-info ul li:nth-of-type(3)::after {
    content: "";
    position: absolute;
    left: -20px;
    top: 50%;
    transform: translateY(-50%);
    background: #2A7EE1;
    border: 1px solid #2A7EE1;
    border-radius: 50%;
    width: 12px;
    height: 12px;
}

.course-slide-right .right-btm .green-info ul li:nth-of-type(4)::after {
    content: "";
    position: absolute;
    left: -20px;
    top: 50%;
    transform: translateY(-50%);
    background: #fff;
    border: 1px solid #999;
    border-radius: 50%;
    width: 12px;
    height: 12px;
}

.course-slide-right .right-btm .green-info ul li:nth-of-type(5)::after {
    content: "";
    position: absolute;
    left: -20px;
    top: 50%;
    transform: translateY(-50%);
    background: #E32D2E;
    border: 1px solid #E32D2E;
    border-radius: 50%;
    width: 12px;
    height: 12px;
}

.course-slide-right .right-btm .green-info ul li:first-child {
    font-weight: 700;
}

.course-pagination {
    position: relative;
    top: -55px !important;
    justify-content: center;
    display: flex;
    gap: 0 16px;
}

.course-pagination span {
    width: 48px;
    height: 48px;
    border-radius: 100%;
    border: 1px solid #d6d6d6;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 !important;
    background: #fff;
    opacity: 10;
}

.course-pagination span.on {
    border: 2px solid var(--main-color);
}

.course-pagination span b {
    font-size: 18px;
    font-weight: 700;
    color: #999;
}

.course-pagination span.on b {
    color: var(--main-color);
}

.course-button {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 64px;
    height: 64px;
    z-index: 1;
    cursor: pointer;
}

.course-button.prev {
    left: -35px;
    background: url('/images/course/icon_course_arrow_prev.svg') no-repeat;
}

.course-button.next {
    right: -35px;
    background: url('/images/course/icon_course_arrow_next.svg') no-repeat;
}

.courseInfo-table.guide {
    margin-top: 68px;
}

.courseInfo-table.guide table tbody tr th {
    text-transform: uppercase;
}

.rules-text {
    margin-top: 56px;
}

.rules-text ul {
    background: #F9F9F9;
    padding: 32px 24px;
}

.rules-text ul li {
    font-size: 16px;
    line-height: 27px;
    display: flex;
    gap: 0 10px;
}

.rules-text ul li b {
    display: inline-block;
}

/* // course */

/* guide */

/* guide */
.guide-wrap {
    display: flex;
    flex-direction: column;
    gap: 56px 0;
}

.guide-wrap .title {
    color: #000;
    font-weight: 700;
    margin-bottom: 15px;
    position: relative;
    margin-left: 45px;
    font-size: 26px;
}

.guide-wrap .title::after {
    content: "";
    position: absolute;
    left: -45px;
    top: 50%;
    transform: translateY(-50%);
    background: url('/images/content/icon_title.svg') no-repeat;
    width: 35px;
    height: 19px;
}

.guide-wrap .title small {
    font-size: 16px;
    font-weight: 600;
}

.guide-wrap .guide-list .img {
    width: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    gap: 0 17px;
}

.guide-wrap .guide-list .img li {
    width: calc((100% - 75px)/5);
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 160px;
    justify-content: center;
    border: 1px solid #D6D6D6;
    gap: 16px 0;
}

.guide-wrap .guide-list .img li img {
    width: 40px;
    height: 40px;
}

.guide-wrap .guide-list .img li span {
    font-size: 16px;
    display: block;
    text-align: center;
}

.guide-wrap .guide-list .img02 {
    width: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 40px 0;
    gap: 0 56px;
    border-top: 1px solid #D6D6D6;
    border-bottom: 1px solid #D6D6D6;
}

.guide-wrap .guide-list .img02 li {
    width: calc((100% - (56px*7))/8);
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 100px;
    justify-content: flex-start;
    gap: 16px 0;
    position: relative;
}

.guide-wrap .guide-list .img02 li:not(:last-child):after {
    content: "";
    position: absolute;
    right: -35px;
    top: 50%;
    transform: translateY(-50%);
    background: url('/images/content/icon_guide_arrow.svg')no-repeat;
    width: 24px;
    height: 24px;
}

.guide-wrap .guide-list .img02 li img {
    width: 32px;
    height: 32px;
}

.guide-wrap .guide-list .img02 li span {
    font-size: 14px;
    display: block;
    text-align: center;
}

.guide-wrap .guide-list.info {
    display: flex;
    flex-direction: column;
    gap: 8px 0;
}

.guide-wrap .guide-list .info-list {
    background: #F9F9F9;
    padding: 32px 0 32px 40px;
    display: flex;
    align-items: center;
    gap: 0 56px;
}

.guide-wrap .guide-list .info-list img {
    width: 120px;
}

.guide-wrap .guide-list .info-list .text {
    display: flex;
    flex-direction: column;
}

.guide-wrap .guide-list .info-list .text li {
    font-size: 16px;
    line-height: 27px;
}

.guide-wrap .guide-list .info-list .text li.color {
    color: var(--main-color);
    font-weight: 700;
}

.guide-wrap .guide-list .info-list .text li b {
    display: inline-block;
    margin-right: 10px;
}

.guide-wrap .guide-list .info-list .text li.title {
    color: var(--main-color);
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 16px;
}

.guide-wrap .guide-list .info-list .text li.title b {
    margin: 0 10px;
}

.guide-wrap .guide-list .sub-text {
    display: block;
    color: var(--main-color);
    font-weight: 700;
    margin-top: 15px;
}

.guide-wrap .guide-list .sub-text b {
    display: inline-block;
    text-decoration: underline;
    font-weight: 700;
}

/* fee */
.fee-date {
    font-size: 16px;
    margin-left: 10px;
    font-weight: 400;
}

.guide-wrap .fee-info ul {
    background: #F9F9F9;
    padding: 32px 40px;
}

.guide-wrap .fee-info ul li {
    line-height: 24px;
    display: flex;
    align-items: center;
    gap: 0 5px;
}

.guide-wrap .fee-info ul li b {
    font-size: 30px;
}

.guide-wrap .guide-table table {
    width: 100%;
    table-layout: fixed;
    text-align: center;
    font-size: 16px;
}

.guide-wrap .guide-table table thead tr th {
    color: #666;
    font-weight: 600;
    padding: 18px 0;
    background: #F5F5F5;
    line-height: 130%;
    border-right: 1px solid #D6D6D6;
}

.guide-wrap .guide-table table thead tr th:last-child {
    border-right: 0;
}

.guide-wrap .guide-table table thead tr:first-child th {
    border-top: 2px solid var(--main-color);
    border-bottom: 1px solid #D6D6D6;
}

.guide-wrap .guide-table table thead tr:last-child th {
    border-bottom: 1px solid #D6D6D6;
}

.guide-wrap .guide-table table thead tr:first-child th.br1 {
    border-bottom: 1px solid #D6D6D6;
}

.guide-wrap .guide-table table tbody tr td {
    background: #fff;
    padding: 18px 0;
    border-bottom: 1px solid #D6D6D6;
    border-right: 1px solid #D6D6D6;
    line-height: 130%;
}

.guide-wrap .guide-table table tbody tr td:last-child {
    border-right: 0;
}

.guide-wrap .guide-table table tbody tr td.bdr1 {
    border-right: 1px solid #D6D6D6;
}

.guide-wrap .guide-table.rowspan table tbody tr td:not([rowspan]) {
    border-right: 1px solid #D6D6D6;
}

.guide-wrap .guide-table tbody tr th {
    background: #F5F5F5;
    padding: 18px 0;
    border-bottom: 1px solid #D6D6D6;
    border-right: 1px solid #D6D6D6;
    font-weight: 600;
    color: #666;
}

.guide-wrap .guide-table table tbody tr td span.red {
    color: #E32D2E;
}

.guide-wrap .guide-table .table-text {
    font-size: 16px;
    margin-top: 10px;
}

.guide-wrap .table-text02 {
    margin-top: 15px;
    display: flex;
    flex-direction: column;
}

.guide-wrap .table-text02 li {
    font-size: 16px;
    line-height: 27px;
}

.guide-wrap .table-text02 li.red {
    color: #E32D2E;
}

.guide-wrap .table-text02 li.red b {
    color: #212429;
}

.guide-wrap .table-text02 li b {
    margin-right: 5px;
    display: inline-block;
    font-weight: 400;
}

.guide-wrap .guide-table .guide-btn {
    margin-top: 24px;
    display: flex;
    justify-content: center;
}

.guide-wrap .guide-table .guide-btn a {
    color: var(--main-color);
    border: 1px solid var(--main-color);
    border-radius: 4px;
    font-size: 16px;
    font-weight: 600;
    padding: 12px 0;
    width: 345px;
    display: block;
    text-align: center;
}

.contact-img {
    border-radius: 16px;
    overflow: hidden;
    margin-bottom: 41px;
}

.contact-wrap {
    margin-top: 40px;
}

.contact-wrap table {
    border-top: 2px solid var(--main-color);
}

.contact-wrap table thead tr th {
    font-size: 16px;
    background: #F5F5F5;
    color: #666666;
    border-bottom: 1px solid #D6D6D6;
    font-weight: 600;
    padding: 17px 0;
}

.contact-wrap table tbody tr th {
    font-size: 18px;
    background: #F5F5F5;
    text-align: center;
    border-bottom: 1px solid #D6D6D6;
    border-right: 1px solid #D6D6D6;
    font-weight: 400;
}

.contact-wrap table tbody tr td {
    font-size: 18px;
    background: #fff;
    text-align: center;
    border-bottom: 1px solid #D6D6D6;
    border-right: 1px solid #D6D6D6;
    padding: 17px 0;
}

.contact-wrap table tbody tr td:last-child {
    border-right: 0;
}

.contact-wrap table tbody tr td.bold {
    font-weight: 700;
    text-align: center;
}

.join-agree-box .terms-table {
    border-top: 2px solid var(--main-color);
    text-align: center;
}

.join-agree-box .terms-table thead tr th {
    background: #F5F5F5;
    font-size: 14px;
    font-weight: 600;
    padding: 10px 5px;
    border-bottom: 1px solid #D6D6D6;
}

.join-agree-box .terms-table tbody tr td {
    background: #fff;
    font-size: 14px;
    padding: 10px 5px;
    border-right: 1px solid #D6D6D6;
    border-bottom: 1px solid #D6D6D6;
    line-height: 100%;
}

.join-agree-box .terms-table tbody tr td:last-child {
    border-right: 0;
}