/* form_box */
.form_box { padding: 2em; display: grid; grid-template-columns: repeat(1, 1fr); grid-gap: 1.5em 2em; align-items: center; }
.form_box.large_item { padding: 0; }
.form_box .form_item label { margin-bottom: .2em; display: flex; align-items: center; gap: .3em; color: #54463b; }
.form_box .form_item label b { line-height: 1; color: #c00; }
.form_box .form_item .input { min-height: 34px; display: flex; align-items: center; }
.form_box .flex_style { display: flex; flex-wrap: wrap; align-items: stretch; }
.form_box .flex_style label.large { margin-right: 1em; width: 7em; }
.form_box .flex_style >input , .form_box .flex_style >font { width: 100%; }
.form_box .flex_style >font .bind { margin-left: 1em; }
.form_box .flex_style >font .bind svg { margin: 0 .6em; width: 30px; height: 30px; fill: #fff; }
.form_box .flex_style >font .btn { padding: 0; border-radius: .37em; display: inline-flex; justify-content: space-between; align-items: center; }
.form_box .flex_style >font .btn font { padding: .2em 0; width: 150px; border-left: 1px rgb(0 0 0 / 10%) solid; display: flex; justify-content: center; align-items: center; flex: 1 1 auto; color: #fff; }
.form_box .flex_style >font .btn.line { background: #06C755; }
.form_box .flex_style >font .bind .isbind svg { fill: #06C755; }
.form_box .flex_style .groud { overflow: hidden; display: flex; align-items: center; background-color: white; background-clip: padding-box; border: 1px solid var(--g_200); border-radius: .2em; }
.form_box .flex_style .groud >input { width: 1%; flex: 1 1 auto; border: 0; }
.form_box .flex_style .groud >button { padding: .5em; width: 10em; background: var(--red); text-align: center; color: white; }
.form_box .flex_style .remarks span.words { width: 100%; display: flex; justify-content: flex-end; align-items: center; font-size: .9em; color: #54463b; }
.form_box .flex_style .remarks span.words b { margin: 0 .2em; font-size: 1em; }

.form_box .radio_box { padding: .3em 0; width: 100%; display: flex; align-items: center; gap: 1em; }
.form_box .radio_box >span { display: flex; align-items: center; gap: .2em; }
.form_box .radio_box >span input { margin-right: .2em; }
.form_box .name_box { display: grid; grid-template-columns: repeat(2, 1fr); gap: 2em; }
.form_box .name_box >span { display: flex; align-items: center; gap: 1em; }
.form_box .name_box >span input { width: 1%; flex: 1 1 auto; }
.form_box .address_box { width: 100%; display: grid; grid-template-columns: 8em 8em 1fr; grid-gap: .6em 1em; align-items: center; }
.form_box .calendar { position: absolute; width: 1em; height: 1em; top: 51%; right: 1em; fill: #724f37; -webkit-transform: translateY(-50%); transform: translateY(-50%); }
.form_box .note_txt span { font-size: .9em; color: #54463b; }
.form_box .upfile_box >div { display: flex; align-items: center; gap: 1em; }
.form_box .upfile_box >div font { display: flex; flex-direction: column; gap: .3em; }
.form_box .upfile_box >div font span { font-size: .8em; }
.form_box .upfile_box .img_box { width: 80px; aspect-ratio: 1/1; }
.form_box .upfile_box .img_box img { width: 100%; height: 100%; object-fit: contain; }
.form_box .upfile_box .send_btn {position: relative;padding: 10px 0;width: 250px;}
.form_box .upfile_box .send_btn input {position: absolute;top: 0;right: 0;bottom: 0;left: 0;z-index: 5;opacity: 0;cursor: pointer;}
.form_box .check_box font { display: flex; align-items: center; }
.form_box .check_box font input { width: 1%; flex: 1 1 auto; }
.form_box .check_box font img { margin-left: .5em; cursor: pointer; }
.form_box .send_box { display: flex; justify-content: end; }
.form_box .large_item.send_box { justify-content: center; }
.form_box .send_btn { overflow: hidden; position: relative; padding: 12px 20px; width: 170px; background-color: #fff; border: 3px solid var(--primary); border-radius: 40px; display: inline-block; text-align: center; line-height: 1.4; font-weight: 600; font-size: 18px; color: var(--primary); z-index: 1; cursor: pointer; }
.form_box .send_btn:after { position: absolute; width: 0; height: 100%; background-color: #fff; border-radius: 40px; display: block; right: 0; top: 0; z-index: -1; content: ""; }
.form_box .send_btn:hover::after { width: 100%; background-color: var(--primary); top: 0; left: 0; -webkit-transition: all .5s; transition: all .5s; }
.form_box .send_btn:hover { color: #fff; }
.form_box .send_btn.large_btn { width: 100%; }
.form_box .agree_box { margin-bottom: .2em; display: flex; align-items: center; }
.form_box .agree_box label[for="IsAgree"] { margin-left: .3em; width: 1%; flex: 1 1 auto; line-height: 1; }
.form_box .quit_login { display: flex; flex-direction: column; justify-content: center; align-items: center; }
.form_box .quit_login .line_link { padding: 0; width: min(100%, 350px); border-radius: .37em; background: #06C755; display: inline-flex; justify-content: space-between; align-items: stretch; }
.form_box .quit_login .line_link svg { margin: .2em .6em; width: 40px; height: 40px; fill: #fff; }
.form_box .quit_login .line_link font { width: 1%; border-left: 1px rgb(0 0 0 / 10%) solid; display: flex; justify-content: center; align-items: center; flex: 1 1 auto; font-size: 1.2em; color: #fff; }

/* member_page */
#member_page { margin: 0 auto; width: min(980px, 95vw); }
#member_page #form1 , #member_center #form1 { width: 94%; }
#member_page .other_btns .join { margin: 1em 0 .5em; display: flex; justify-content: center; align-items: baseline; }
#member_page .other_btns .join * {font-weight: 300;font-size: 1.1em;color: var(--black);}
#member_page .other_btns .join a {margin-left: .4em;padding: .2em;display: block;border-bottom: 1px var(--black) solid;line-height: 1;color: var(--black);}
#member_page .other_btns .askpass { text-align: center; }
#member_page .other_btns .askpass a {font-weight: 400;color: var(--g_500);}

/* notice_box */
.notice_box h3 { margin-bottom: .5em; display: flex; align-items: baseline; font-weight: 500; font-size: 1.2em; color: #724f37; }
.notice_box h3 i { margin-right: .2em; color: currentColor; }
.notice_box ol { margin-left: 1.5em; list-style: decimal; }
.notice_box ol li { list-style: decimal; color: #54463b; }

/* member_rule */
#member_rule { overflow: hidden; width: 0; max-height: 0; display: none; opacity: 0; }
#member_rule::-webkit-scrollbar { width: 13px; }
#member_rule::-webkit-scrollbar-track { background: none; }
#member_rule::-webkit-scrollbar-thumb { border-radius: 8px; border: 4px solid transparent; background-clip: content-box; background-color: var(--g_200); }
#member_rule::-webkit-scrollbar-thumb:hover { background-color: var(--g_300); }
#member_rule * { font-size: inherit; }
#member_rule ol.rulelist { padding-left: 20px; list-style: decimal; }
#member_rule ol.rulelist li { padding: 0 0 10px 10px; }
.fancybox-slide--current #member_rule { overflow-y: scroll; width: min(95vw, 800px); max-height: 55vh; opacity: 1; }

/* reserve_calendar */
#reserve_calendar { position: relative; }
#reserve_calendar:before { position: absolute; width: 1px; height: calc(100% - 13px); background: #dbdbdb; display: block; top: 0; left: 0; z-index: 5; content: ""; }

/* calendar_box */
#calendar_box { position: relative; overflow-x: overlay; overflow-y: hidden; }
#calendar_box::-webkit-scrollbar { height: 13px; }
#calendar_box::-webkit-scrollbar-thumb { border-radius: 8px; border: 4px solid transparent; background-clip: content-box; background-color: rgb(132 132 132 / 50%); }
#calendar_box table { min-width: 100%; background: #dbdbdb; border-spacing: 1px; border-collapse: separate; }
#calendar_box table tr >* { position: relative; min-width: 3em; background: #fff; text-align: center; font-weight: 400; }
#calendar_box table tr >.first { position: sticky; border-right: 1px #c9c9c9 solid; box-shadow: 5px 0 5px rgb(93 93 93 / 10%); left: 0; z-index: 2; }
#calendar_box table tr font { line-height: 1; font-size: .9em; }
#calendar_box table th p { margin-bottom: .5em; line-height: 1; text-align: center; }
#calendar_box table th.red *:not(.badge) { color: #d9534f; }
#calendar_box table th.blue *:not(.badge) { color: #3B82EC; }
#calendar_box table th .badge { position: absolute; padding: .2rem .2rem; font-size: .8em; top: .2em; right: .2em; }
#calendar_box table td.red { background: #ffeeee; }
#calendar_box table td.blue { background: #f4f8ff; }
#calendar_box table td font { min-height: 3em; display: flex; justify-content: center; align-items: center; }
#calendar_box table td span { width: 15px; height: 15px; display: inline-flex ; justify-content: center; align-items: center; line-height: 1; vertical-align: baseline; }
#calendar_box table td b { position: absolute; display: flex; align-items: center; gap: .2em; line-height: 1; font-size: .8em; right: .3em; bottom: .2em; }
#calendar_box table td b em { font-size: .6em; }
#calendar_box table td[data-action="reserve"] { cursor: pointer; }
#calendar_box table td[data-action="reserve"]:hover { background: #e9e9e9; }
#calendar_box table td[data-action="notallowed"] { cursor: not-allowed; }
#calendar_box table td[data-action="notallowed"]  >* { opacity: .5; }
#calendar_box table td svg { width: 100%; height: 100%; fill: none; stroke: #3B82EC; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
#calendar_box table td svg.reserve_close { stroke: #d9534f; }
#calendar_box table td.chk , #calendar_box table td.chk:hover { background: var(--primary); }
#calendar_box table td.chk svg { stroke: #fff; }

@media screen and (min-width: 981px){
	.form_box { grid-template-columns: repeat(2, 1fr); }
	.form_box .large_item { grid-column: 1/3; }
}
@media screen and (max-width: 640px){
	.form_box { padding: 2em 3%; }
	.form_box .address_box { grid-template-columns: repeat(2, 1fr); grid-template-areas: "city area" "inp inp"; }
	.form_box .address_box .address_inp { grid-area: inp; }
}
@media screen and (min-width: 551px){
	.form_box .flex_style label { margin-right: 3em; padding: .5em 0; width: 5em; text-align: justify; text-justify: distribute-all-lines; text-align-last: justify; }
	.form_box .flex_style >input , .form_box .flex_style >font { width: 1%; flex: 1 1 auto; }
}