@charset "utf-8";

:root{
    /*font*/
    --font-50: 3.13rem;
    --font-40: 2.5rem;
    --font-30: 1.88rem;
    --font-25: 1.56rem;
    --font-24: 1.5rem;
    --font-20: 1.25rem;
    --font-18: 1.13rem;
    --font-16: 1rem;
    --font-15: 0.94rem;
    --font-14: 0.88rem;
    --font-12: 0.75rem;
    --font-14to16: clamp(0.875rem, 0.1477rem + 3.6364vw, 1rem);
    
    --font-en:'Lora', serif;
}

/*-------------------------- common css --------------------------*/
.hr{height:1px;border-bottom:1px solid #e8e8e8; width: 100%;}
.hr2{height:1px;border-bottom:1px dotted #c1c1c1; width: 100%;}
.border{ border:1px solid #ddd;}
.displayB{ display: block;}
.displayIB{ display: inline-block;}
.line-dashed{ border-bottom: 1px dashed #dbdbdb; height: 1px; width: 100%;}

/* font color, style */
.Montserrat{font-family: 'Montserrat', serif;}
.orange{color:#ff970f;}
.blue{color:#3e8ddc;}
.red {color:#e90505 !important;}
.yellow{color:#e2af00;}
.darkGray{ color: #58585a;}
.pink{ color: #d91b5c;}
.white{ color: #fff !important;}

.center{ text-align: center !important;}
.left{ text-align: left !important;}
.right{ text-align: right !important;}
.margin-a{ margin: auto !important;}
.cl-b{ clear: both;}
.fl-l{ float: left;}
.fl-r{ float: right;}

.line15{ line-height: 1.5em;}
.pre-line{ white-space: pre-line;}
.font14{ font-size: var(--font-14)}
.font16{ font-size: var(--font-16)}
.font18{ font-size: var(--font-18)}

.strong{ font-weight: 500; }
.bold{ font-weight: 700 !important; }
.through{ text-decoration: line-through;}

.wp10{ width: 10% !important;}
.wp15{ width: 15% !important;}
.wp20{ width: 20% !important;}
.wp25{ width: 25%;}
.wp27{ width: 27%;}
.wp28{ width: 28%;}
.wp30{ width: 30% !important;}
.wp32{ width: 32% !important;}
.wp33{ width: 33% !important;}
.wp35{ width: 35% !important;}
.wp40{ width: 40% !important;}
.wp45{ width: 45% !important;}
.wp50{ width: 50% !important;}
.wp60{ width: 60% !important;}
.wp70{ width: 70% !important;}
.wp80{ width: 80%;}
.wp90{ width: 90%;}
.wp94{ width: 94%;}
.wp97{ width: 97%;}
.wp100{ width: 100% !important;}
.padding0{padding:0 !important;}
.padding5{padding:5px 0 !important;}
.padding10{padding:10px 0 !important;}
.padding20{padding:20px 0;}
.padding30{padding:30px 0;}
.padding50{padding:50px 0;}
.padding70{padding:70px 0;}
.margin0{ margin:0 !important;}
.margin5{ margin: 5px auto;}
.margin10{ margin: 10px auto !important;}
.margin15{ margin: 15px auto !important;}
.margin20{ margin: 20px auto !important;}
.margin30{ margin: 30px auto;}
.margin40{ margin: 40px auto;}
.mt2{ margin-top:-2px !important;}
.mt10{ margin-top:10px !important;}
.mt15{ margin-top:15px;}
.mt20{ margin-top:20px;}
.mt25{ margin-top:25px;}
.mt30{ margin-top:30px !important;}
.mt40{ margin-top:40px !important;}
.mt60{ margin-top:60px !important;}
.mt130{ margin-top:130px !important;}
.mb10{ margin-bottom:10px !important;}
.mb20{ margin-bottom:20px !important;}
.mb30{ margin-bottom:30px !important;}
.mb40{ margin-bottom:40px !important;}
.mb50{ margin-bottom:50px !important;}
.pb5{ padding-bottom: 5px !important;}
.pb10{ padding-bottom: 10px !important;}
.pbw15{ padding-bottom: 1.5%;}
.pb20{ padding-bottom: 20px !important;}
.pb30{ padding-bottom: 30px !important;}
.pt0{ padding-top:0px !important;}
.pt5{ padding-top:5px !important;}
.pt10{ padding-top:10px !important;}
.pt20{ padding-top:20px !important;}
.pt30{ padding-top:30px;}
.pt50{ padding-top:50px;}
.img100 img{ width: 100%;}

.text-indent{padding: 0 10px;}

/*common*/
.common-tab{ width: 100%; border-bottom: 1px solid #b8988a; display: flex; justify-content: space-between; position: relative;}
.common-tab a{ color: #acacac; display: block; width: 33.33%; text-align: center; line-height: 50px; font-size: clamp(0.75rem, 0.0227rem + 3.6364vw, 0.875rem); font-weight: 300; position: relative; background-color: #fff;  flex-grow:6}
.common-tab a.on{ color: #b8988a; font-weight: 400;}
.common-tab a.on::after{ content: ''; width: 100%; height: 48px; display: block; border:1px solid #b8988a;border-bottom: 1px solid #fff; position: absolute; top:1px; left: 0; z-index: 1;}

/*page-common*/
.common-con{ position: relative; width: 100%; height: 100%; margin: 0 auto; padding:90px 0 20px; min-height: 800px;}
.con-box{ position: relative; width: 94%; margin: 130px auto 30px;}
.sub-title{ font-size: 1.25em; font-weight: 300; position: relative; text-align: center; color: #535b5d; font-weight: 500; padding-top:25px;}

.bar-title{ padding-top: 7px; position: relative; font-size: var(--font-20); letter-spacing: -0.36px; color: #3d3d3d; text-align: center; padding-bottom: 15px; line-height: 1.25em;}
.bar-title::after{ content: ''; height: 2px; width: 20px; display: inline-block; position: absolute; left: 50%;  top:0; transform: translateX(-50%); background-color: #007862;}

/*sub-nav*/
/*.sub-nav{ position: relative; margin-top:50px; background-color: #333; color: #fff; display: flex; align-items: center; justify-content: space-between; height: 50px; z-index: 10;}*/
.sub-nav{ position: absolute; margin-top:50px; background-color: #333; color: #fff; display: flex; align-items: center; justify-content: space-between; height: 50px; z-index: 10; width: 100%;}
.sub-nav.positionFix{ position: fixed; margin-top:0; top:0; width: 100%;}
.sub-nav h1{ width: 10%; text-align: center;}

/*sub-vis*/
/*.bg-reser{ width: 100%; height: 180px; background: url(/Mobile/Images/img_reservation.jpg) center center no-repeat; position: absolute; top:0; z-index: -1; background-size: cover;}
.bg-group{ width: 100%; height: 180px; background: url(/Mobile/Images/img_organization.jpg) center center no-repeat; position: absolute; top:0; z-index: -1; background-size: cover;}
.bg-membership{ width: 100%; height: 180px; background: url(/Mobile/Images/img_membership.jpg) center center no-repeat; position: absolute; top:0; z-index: -1; background-size: cover;}
.bg-news{ width: 100%; height: 180px; background: url(/Mobile/Images/img_news.jpg) center center no-repeat; position: absolute; top:0; z-index: -1; background-size: cover;}
.bg-club{ width: 100%; height: 180px; background: url(/Mobile/Images/img_information.jpg) center center no-repeat; position: absolute; top:0; z-index: -1; background-size: cover;}
.bg-course{ width: 100%; height: 180px; background: url(/Mobile/Images/img_course.jpg) center center no-repeat; position: absolute; top:0; z-index: -1; background-size: cover;}
.bg-policy{ width: 100%; height: 180px; background: url(/Mobile/Images/img_policy.jpg) center center no-repeat; position: absolute; top:0; z-index: -1; background-size: cover;}
.bg-mypage{ width: 100%; height: 180px; background: url(/Mobile/Images/img_mypage.jpg) center center no-repeat; position: absolute; top:0; z-index: -1; background-size: cover;}*/

.bg-reser{ width: 100%; height: 180px; background-color:#034C53; position: absolute; top:0; z-index: -1;}
.bg-group{ width: 100%; height: 180px; background-color:#034C53; position: absolute; top:0; z-index: -1;}
.bg-membership{ width: 100%; height: 180px; background-color:#034C53; position: absolute; top:0; z-index: -1;}
.bg-news{ width: 100%; height: 180px; background-color:#034C53; position: absolute; top:0; z-index: -1;}
.bg-club{ width: 100%; height: 180px; background-color:#034C53; position: absolute; top:0; z-index: -1;}
.bg-course{ width: 100%; height: 180px; background-color:#034C53; position: absolute; top:0; z-index: -1;}
.bg-policy{ width: 100%; height: 180px; background-color:#034C53; position: absolute; top:0; z-index: -1;}
.bg-mypage{ width: 100%; height: 180px; background-color:#034C53; position: absolute; top:0; z-index: -1;}

/*sub-select*/
.sub-select {
	background: #313131;
	text-align: left;
	cursor: pointer;
	position: relative;
	text-indent: 0.5em;
	line-height: 50px;
    font-size: 0.94em;
    width: 45%;
}
.sub-select span{color: #fff; height: 50px; display: block; width: 100%; text-transform: uppercase;}
.sub-select li .options {
	display: block;
	margin: 0;
	background:#313131;
	position: absolute;
	width: calc( 100% + 1px);
	overflow: hidden;
	max-height: 0;
	border-top:0;
	top:50px;
	left:0;
	opacity: 0;
	transition:0.5s ease all;
	z-index: 1;
    color: #535b5d;	
    border-right: 1px solid #e9e9e9;
}
.sub-select li .options li {transition: 0.5s ease all; border-bottom: 1px solid #505050;}
.sub-select li .options li a{ display: block; color: #fff;}
.sub-select li .options li:last-child {border-bottom:0;}
.sub-select li .options li:nth-child(2n-1) {
  	/*background: #505050;*/
}
.sub-select li .options.open {
	background: #3c3c3c;
	border-bottom: 1px solid #e9e9e9;
	border-left: 1px solid #e9e9e9;
	border-top:0;
	opacity: 1;
	max-height: 1000%;
	overflow-y: auto;
}
.sub-select.sub-select.second li .options { left: -1px;}
.sub-select:before {
    content: '';
    width: 17px;
    height: 9px;
    background: url(/Mobile/Images/ic_drop_down2.svg) center right no-repeat;
    background-size: 17px 9px;
    position: absolute;
    top: 20px;
    right: 8px;
    transition: all ease 0.25s;
}

/*common*/
.common-tit{ width: 100%; text-align: center; color: #fff;}
.common-tit.join{ width: 100%; text-align: center; color: #292929;}
.common-tit h4{ font-family: var(--font-en); font-size: var(--font-15); /*padding-bottom: 10px;*/ text-transform: uppercase; font-weight: 500; display: none;}
.common-tit h2{ font-size: var(--font-30); letter-spacing: -0.9px; font-weight: 400;}

.btn-common{ width: 100%; text-align: center; display: flex; justify-content: center;}
.btn-common a{ display: inline-block; width: 197px; margin: 0 6px; border:1px solid #fff; color: #fff; font-weight: 400; line-height: 48px; font-size: var(--font-18); background-color: #c2c2c2; box-shadow:0 3px 6px 0 rgba(0, 0, 0, 0.16); border-radius: 30px;}
.btn-common a.on{ background-color: #007862;} 
.btn-common a.delete{ background-color: #fff; color: #292929; border: solid 1px #cbcbcb;}

/*login*/
.contents-login{ position: relative; width: 100%; height: 100%; margin: 0 auto; padding:90px 0 60px;}
.contents-join-box{ width: 90%; margin: auto; padding: 38px 14px 25px; border: solid 1px #e2e2e2; background-color: #fff; margin-top:30px; border-radius: 15px;}
.contents-join-box.join{ padding: 38px 14px;}

.login-wrap{ width: 100%; margin: auto; padding-bottom: 15px;}
.login-wrap ul{ margin-bottom:15px;}
.login-wrap ul li{  position: relative; margin-bottom: 15px;}
.login-wrap ul li input{ width: 100%; text-align: left; font-size: 1em;}

.btn-login{ display: block; width: 100%; border:1px solid #fff; color: #fff; font-weight: 500; line-height: 48px; font-size: var(--font-18); background-color: #007862; box-shadow:0 3px 6px 0 rgba(0, 0, 0, 0.16); border-radius: 30px; text-align: center;}
.btn-login.join{ background-color: #fff; color: #292929; border: solid 1px #cbcbcb; font-weight: 600;}

.save-id{ position: relative; width: 100%; margin: 20px 0;}
.save-id span{ width: 100%;}
.save-id input[type=checkbox] {
    display:none;
}
.save-id input[type=checkbox] + label { 
    cursor: pointer; 
    background-repeat: no-repeat;
    background-image: url('/mobile/images/join/img_check_off.svg');
	background-size: 20px 20px;
	text-indent: 30px;
    font-size: 1em;
    padding-bottom: 5px;
    transition: 0.3s all;
    display: inline-block;
}
.save-id input[type=checkbox]:checked + label {
    background-image: url('/mobile/images/join/img_check_on.svg');
	background-size: 20px 20px;
}

.btn-idpw{ width: 90%; text-align: center; margin: 30px auto; overflow: hidden;}
.btn-idpw a{ color: #535b5d; position: relative;  text-align: center; width: 50%; float: left; font-size: var(--font-15);}
.btn-idpw a:first-child::after{ content: ''; width: 1px; height: 29px; background-color: #b4bbbc; position: absolute; right: 0; top:4px;}

.btn-certified{ width: 100%; text-align: center; border:1px solid #fff; color: #fff; font-weight: 400; background-color: #049f83; font-size: var(--font-18); line-height: 48px; border-radius: 30px; box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16); display: inline-block;}

.phone-certified{ width:100%; overflow: hidden; margin-top: 20px;}
.phone-certified li{ width: 25%; float:left;}
.phone-certified li:first-child{ width: 75%;}
.phone-certified input[type="number"]{ width: 100%; background-color: #fff; border:1px solid #dedede; border-right: 0; height: 60px; font-size: 0.94em; text-align: left; text-indent: 10px;}
.phone-certified input[type="number"]::-webkit-input-placeholder{ color: #acacac; }
.phone-certified input[type="number"]::-moz-placeholder{ color: #acacac;}
.phone-certified input[type="number"]::-ms-input-placeholder{ color: #acacac;}

.phone-certified .certified-time{ color: #acacac; line-height: 58px; background-color: #fff; text-align: center; font-weight: 300; font-size: 0.94em; border:1px solid #dedede; border-left: 0;}

.btn-sns{ width: 100%; margin-bottom: 15px;}
.btn-sns a{ display: block; background-color: #F4F4F4; text-align: center; line-height: 40px; font-size: 0.88em; color: #5F6668; margin-bottom: 6px;}
.btn-sns a img{ width: 25px; display: inline-block; vertical-align: middle; margin-right: 14px; margin-top:-4px; }

.text-login01{ text-align: center; line-height: 1.25em; color: #535b5d; word-break: keep-all; font-size: var(--font-15);}
.btn-join-text{ font-size: 0.88em; font-weight: 700; color: #272727; text-align: center; margin: 16px 0 0;}

.id-check-box{ width: 100%; padding: 0 0 33px; font-weight: 400; text-align: center; margin-bottom: 15px; letter-spacing: -0.63px; line-height: 2.4em; color: #292929; border-bottom: 1px dashed #dbdbdb; margin:0 0 30px;}
.id-check-box span{ font-size: var(--font-30); letter-spacing: -0.6px; font-weight: 500; color: #007862; }

/*join*/
.join-wrap{ width: 100%; margin:auto;}

.check-all{ text-align: center; width: 100%; margin-bottom: 15px;}
.check-all span{ width: 34px; height: 34px; display: inline-block;}
.check-all p{ font-size: var(--font-20); color: #292929; padding:5px 0; font-weight: 500;}
.check-all input[type=checkbox] {
    display:none;
}
.check-all input[type=checkbox] + label { 
    cursor: pointer; 
    background: url('/mobile/images/join/img_check_style01.svg') center center no-repeat;
	background-size: 30px 30px;
	padding: 15px;
    font-size: 0;
    width: 30px;
    height: 30px;
    transition: 0.3s all;
    display: inline-block;
}
.check-all input[type=checkbox]:checked + label {
    background-image: url('/mobile/images/join/img_check_style01_on.svg');
	background-size: 30px 30px;
}

.join-box{ width: 100%;}
.join-box ul li{ width: 100%; border-bottom:1px solid #dbdbdb; display: table;}
.join-box ul li h2.title{ font-size: clamp(0.875rem, 0.1477rem + 3.6364vw, 1rem); text-align: left; color: #535b5d; letter-spacing: -1px; font-weight: 400; position: relative; height: 66px; width: 100%; display: table-cell; vertical-align: middle;}
.join-box ul li h2.title b{ color: #e42f2f; padding-left: 2px; display: inline-block;}
.join-box ul li h2.title a{ margin-left: 10px;}
.join-box ul li h2.title a img{ display: inline-block; vertical-align: middle;}

.check-select{ position: absolute; right: 0px; top:20px; width: 25px; height: 25px; }
.check-select input[type=checkbox] {
    display:none;
}
.check-select input[type=checkbox] + label { 
    cursor: pointer; 
    background-repeat: no-repeat;
    background-image: url('/mobile/images/join/img_check_style02.svg');
	background-size: 25px 25px;
	font-size: 0;
	padding: 13px;
    width: 25px;
    height: 25px;
    transition: 0.3s all;
    display: inline-block;
}
.check-select input[type=checkbox]:checked + label {
    background-image: url('/mobile/images/join/img_check_style02_on.svg');
	background-size: 25px 25px;
}

.join-tbl-nature{ width: 100%; border-top:1px solid #acacac;}

.join-tbl{ width: 100%; font-size: 0.94em; word-break: keep-all; line-height: 1.25em; color: #363636; padding-bottom: 10px; }
.join-tbl th{ border:1px solid #e9e9e9; padding: 6px 2px; text-align: center; background-color: #f5f5f5; vertical-align: middle;}
.join-tbl td{ border:1px solid #e9e9e9; padding: 6px 2px; text-align: center; vertical-align: middle;}
.join-tbl .radio-sty01{ line-height: 1.8em;}
.join-tbl .radio-sty01 input[type=radio] + label{ padding-right: 0; background-position: left top 0px;}

.pop-join{ position: fixed; top:50%; left:50%; transform: translate(-50%, -50%); display: none;}
.pop-join{ width: 95%; margin: auto; padding: 33px 15px; border: solid 1px #e2e2e2; background-color: #fff;  height: 80%; min-height: 300px; z-index: 1200; border-radius: 15px; }
.pop-join h2.title{ font-size: var(--font-20); color: #535b5d; letter-spacing: -1px; text-align: center; position: relative;}
.pop-join h2.title::before{ content: '';  height: 3px; width: 20px; background-color: #007862; display: inline-block; position: absolute; top:-10px; left: 50%; transform: translateX(-50%);}
.pop-close{ position: absolute; right:10px; top:10px; width: 30px; height: 30px; cursor: pointer;}
.pop-close img{ width: 30px;}

.pop-wrap{ height: calc(100% - 120px); overflow: hidden;}
.pop-terms{ line-height: 1.5em; font-size: var(--font-14); padding-right: 20px; width: 100%; color: #707070; font-weight: 300; letter-spacing: -1px; height: 100%; overflow-y: auto;}
.pop-terms p{ text-align:left; color:#333; font-size: 1.12em; font-weight:700; margin: 0px 0 10px;}
.pop-terms b{display: block; color:#525252; margin: 15px 0 10px; font-weight: 500;}

.pop-terms2{ height: 75%; overflow-y: auto; width: 100%; color: #505050; font-weight: 300; letter-spacing: -1px;}
.pop-join-text{ font-size: 0.88em; line-height: 1.5em; word-break: keep-all; color: #505050; font-weight: 300;}

.overlay{ position: fixed; top:0; left: 0; right:0; bottom:0; background-color: rgba(0,0,0,0.8); z-index: 1100; display: none;}

.join-agree-box{ width: 100%; height: 100px; border:1px solid #e8e8e8; background-color: #f4f4f4; font-size: 12px; font-weight: 300; padding : 12px; margin-bottom:10px; overflow: hidden; overflow-y: scroll; white-space: pre-line; line-height: 1.4em;}
.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: 15px; word-break: keep-all; width: 96%; margin: auto; letter-spacing: -1px; line-height: 1.5em;}
.text-join02 span.text-big{ color: #3d3d3d; font-size: 15px; font-weight: 400; letter-spacing: -0.38px; }
.text-join02 span.text-big02{ font-size: 0.94em; font-weight: 300; letter-spacing: -0.1px; line-height: 1.5em; }
.text-join02 span.text-small{ font-size: 13px; letter-spacing: -0.65px;}
.text-join03{ text-align: center; line-height: 1.5em; font-weight: 300; color: #707070; word-break: keep-all; font-size: var(--font-15); letter-spacing: -0.3px; }
.text-join04{ text-align: center; line-height: 1.5em; font-weight: 400; color: #292929; word-break: keep-all; font-size: var(--font-15); letter-spacing: -0.3px; padding-bottom: 20px; }

.join-tit{ font-size:  var(--font-20); color: #292929; letter-spacing: -0.48px; text-align: center; position: relative; font-weight: 500;}
.join-tit::before{ content: '';  height: 3px; width: 20px; background-color: #007862; display: inline-block; position: absolute; top:-10px; left: 50%; transform: translateX(-50%);}

.certified-box{ width: 100%; overflow: hidden; margin:30px 0 20px; padding: 27px 0 30px; border-top: 1px dashed #dbdbdb; border-bottom:1px solid #dbdbdb;}
.certified-box ul{ display: flex; justify-content: space-evenly; width: 100%;}
.certified-box li{ text-align: center; width: 33.33%;}
.certified-box li h2.title{ color: #535b5d;  font-weight: 500;}
.certified-box li p{ margin: 26px auto; display: flex; justify-content: center; justify-items: center;}
.certified-box li p img{ height: 57px;}

.member-info-box{ width: 100%;}
.member-info-box dl{ width: 100%; margin-bottom: 20px;}
.member-info-box dl::after{ clear: both; content: ''; display: block;}
.member-info-box dt{ display: block; margin-bottom: 15px; color: #505050; font-weight: 500; font-size: 0.94em;}
.member-info-box dt span{ vertical-align: baseline; color: #c80341; font-weight: 500; padding-left: 5px;}
.member-info-box dd{ width: 100%; margin-bottom: 8px;}
.member-info-box p{ line-height: 1.5em; word-break: keep-all; color: #4e4e4e; font-size: 0.88em; font-weight: 300;}
.member-info-box p.text-warning{ color: #e90505; font-weight: 500;}
.member-info-box p.text-check{ color: #1075ce; font-weight: 500;}
.member-info-box textarea{ width: 100%; resize: none; padding: 1em; background-color: #f5f5f5; text-align: left; border:0; height: 100px;}

.enter-name{ width: 100%; overflow: hidden;}
.enter-name .input-disable{ width: 70% !important; float: left;}
.enter-name .input-disable.wp100{ width: 100% !important;}
.input-disable{ background-color: #fafafa; text-indent: 10px; line-height: 60px;}
.select-gender{ width: 28% !important; margin-left: 2%; float: left; font-size: 0.94em;}

.enter-sex{ width: 100%;}
.enter-sex span{ width: 77px; line-height: 50px; display: inline-block; box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.16); color: #fff; text-align: center;}
.enter-sex span.man{ background-color: #2bafe6;}
.enter-sex span.women{ background-color: #db5c97;}

.enter-id{ width: 70% !important; float: left;}
.enter-id2{ width: 100% !important; float: left;}
.btn-overlap{ width: 28% !important; margin-left: 2%; float: left; background-color: #211b34; color: #fff; font-weight: 400; text-align: center; line-height: 48px; box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.16); font-size: clamp(0.75rem, -0.7045rem + 7.2727vw, 1rem);}

.area{ display: flex; justify-content: space-between;}
.area .zone{ width: 100%;}

.select-sty01{ background:#fafafa url(/images/ic_down.svg) no-repeat; width: 100%; height: 60px; color: #292929; text-align: left; padding: 17px 20px; font-size: 1em; text-indent: 0; background-position:center right 8px; background-size: 17px 9px; border: 0;}
.select-sty01 option[value=""][disabled] {display: none;}

.birth{ width: 100%; display: flex; justify-content: space-between; align-items: center;}
.birth .select-sty01{ width: 32.5%;}
.enter-date{ font-size: 24px;}
.email{ display: flex; justify-content: space-between; justify-items: center; line-height: 48px;}
.email input[type="text"]{ width: 45%;}
.address{ width: 100%; display: flex; justify-content: space-between; align-items: center;}
.address input{ width: 49%;}
.address .btn-certified{ width: 49%;}

.member-info-box .phone{ width: 100%; display: flex; justify-content: space-between;}
.member-info-box .phone input{ font-size: 0.94em; width: 32%;}

.radio-sty01{ font-size: 1em; line-height: 1.5em;}
.radio-sty01 input[type=radio] {
    display:none;
}
.radio-sty01 input[type=radio] + label { 
    background-repeat: no-repeat;
    background-image: url('/mobile/images/join/radio.svg');
	background-size: 19px 19px;
	padding-left: 23px;
	padding-right: 10px;
	background-position: left top 2px;
    transition: 0.3s all;
}
.radio-sty01 input[type=radio]:checked + label {
    background-image: url('/mobile/images/join/radio_on.svg');
	background-size: 19px 19px;
}

.join-finish{ width:100%; margin:52px 0 0;}
.join-finish a{width: 100%; display: block; background-color: #fff; color: #ea5815; font-weight: 600; line-height: 56px; font-size: 20px; border: 1px solid #ea5815; text-align: center;}

/*reservation*/
.reser-box{ padding: 16px; margin-top: 100px;}
.reser-tab{ width: 94%; margin: auto; display: flex; justify-content: space-between; position: relative;}
.reser-tab a{ color: #cbcbcb; background-color: #efefef; display: block; text-align: center; line-height: 40px; font-size: 1em; font-weight: 300; position: relative; flex-grow: 8; border-radius: 15px 15px 0 0; margin: 0 1px;}
.reser-tab a.on{ color: #fff; background-color: #007862;}

.calendar-box{ width: 100%;position: relative; padding-bottom: 10px;}

.calendar-top{ width: 100%; position: relative;}
.calendar-top a{ position: absolute; top: 8px;}
.calendar-top a.left{ left: 16px;}
.calendar-top a.right{ right: 16px;}
.calendar-tit{ font-size: var(--font-30); font-weight: 500; color: #303030; text-align: center; margin: 20px 0 36px;}

.calendar-tip{ position: relative; width: 100%; text-align: right; padding-right: 12px; font-size: var(--font-14); padding-top:15px;}
.calendar-tip span{ display: inline-block; border-radius: 50%; width: 10px; height: 10px; margin-left: 15px;}
.calendar-tip span.choice{ background-color: #007862;}
.calendar-tip span.reser{ background-color: #292929;}

.calendar-box table{ width: 100%; font-size: 1em; margin: 18px 0 0; table-layout: fixed;}
.calendar-box table thead th{ font-weight: 400; color: #303030; padding: 10px 0; }
.calendar-box table thead th:first-child{ color: #d20d0d;}
.calendar-box table thead th:last-child{ color: #1075ce;}
.calendar-box table tbody td{ color: #cbcbcb;  text-align: center; font-weight: 300; font-size:var(--font-18); padding: 4px 0; position: relative; height: 50px;}
.calendar-box table tbody td.today{ color:inherit; background-color: #007862; color: #fff;}
.calendar-box table tbody td.today span{ display: block; position: absolute; font-size: 0.83em; background-color: #292929; color: #fff; border-radius: 20px; line-height: 21px; width: 33px; left: 50%; bottom:3px; transform: translateX(-50%); font-weight: 100; }
.calendar-box table tbody td.possible{ color: #303030;}
.calendar-box table tbody td.possible:first-child{ color: #d20d0d;}
.calendar-box table tbody td.possible:last-child{ color: #1075ce;}
.calendar-box table tbody td.possible span{ display: block; position: absolute; font-size: 0.83em; background-color: #292929; color: #fff; border-radius: 20px; line-height: 21px; width: 33px; left: 50%; bottom:3px; transform: translateX(-50%); font-weight: 100; }
.calendar-box table tbody td.choice{ background-color: #007862; color: #fff !important;}
.calendar-box table tbody td.impossible{ background-color: #efefef;}

.calendar-info{ margin: 0; word-break: keep-all; color: #707070; font-size: var(--font-14); font-weight: 300; line-height: 1.3em; background-color: #fafafa; padding: 16px;}
.calendar-info p{ padding-left: 10px; position: relative; margin-bottom: 10px;}
.calendar-info p::before{ content: ''; width: 5px; height: 5px; border-radius: 50%; background-color: #007862; position: absolute; left: 0px; top:6px;}
.calendar-info p.dot-point::before{ background-color: #ffaa00;}

/*reser-list*/
.reser-list{ width: 100%; margin:12px auto;}

.tbl-overflow{ max-height: 300px; overflow-y: auto; border-bottom: 1px solid #cbcbcb;}
.tbl-overflow::-webkit-scrollbar {
    width: 2px;
}
.tbl-overflow::-webkit-scrollbar-thumb {
    height: 5%;
    background: #ddd; 
    border-radius: 10px;
}
.tbl-overflow::-webkit-scrollbar-track {
    background: transparent;
}
.tbl-sty01{ width: 100%; border-top:2px solid #007862; font-weight: 400; color: #363636; font-size: var(--font-15); table-layout: fixed;}
.tbl-sty01 thead th{ text-align: center; vertical-align: middle; background-color: #fafafa; border-bottom:1px solid #cbcbcb; padding: 10px 0; font-weight: 500; position: relative; z-index: 0; height: 50px;}
.tbl-sty01 thead th::after{ content: ''; width: 1px; height: 25px; background-color: #cbcbcb; display: inline-block; position: absolute; right:0; top:50%; transform: translateY(-50%);}
.tbl-sty01 thead th:last-child::after{ display: none;}
.tbl-sty01 tbody th{ background-color: #f8f8f8; border-bottom:1px solid #cbcbcb; vertical-align: middle;}
.tbl-sty01 tbody td{ line-height: 1.33em; text-align: center; vertical-align: middle; border-bottom:1px solid #cbcbcb; padding:10px 0; height: 50px; font-weight: 300;}
.tbl-sty01 .radio-sty01 input[type=radio] + label{ padding-right: 10px; background-position: left top 2px; line-height: 1.8em; padding-top: 3px;}
.tbl-sty01 thead th.left{ text-align: left; padding: 13px;}
.tbl-sty01 thead th.left img{ vertical-align: text-bottom;}

.tbl-reser{ width: 100%; table-layout: fixed;}
.tbl-reser tr{ border-bottom:1px solid #cbcbcb; }
.tbl-reser th{ text-align: center; vertical-align: middle; background-color: #fafafa;  padding: 13px 0; font-weight: 400; position: relative;}
.tbl-reser thead th::after{ content: ''; width: 1px; height: 25px; background-color: #cbcbcb; display: inline-block; position: absolute; right:0; top:50%; transform: translateY(-50%);}
.tbl-reser thead th:last-child::after{ display: none;}
.tbl-reser .list{ display: flex; padding:6px 0px; justify-content: flex-start; align-items: center; flex-direction: row; flex-wrap: wrap; width: 90%; margin: auto; }
.tbl-reser .list a{ display: block; position: relative; width:46%; line-height: 25px; margin: 6px 2%; border:1px solid #cbcbcb; text-align: center; border-radius: 5px; font-size: clamp(0.875rem, 0.1477rem + 3.6364vw, 1rem); }
.tbl-reser td a:focus{ background-color: #049f83; color: #fff;}

.tbl-sty03{ width: 100%; border-top:2px solid #007862; font-weight: 400; color: #363636; font-size: var(--font-15);}
.tbl-sty03 th{ text-align: center; vertical-align: middle; background-color: #fafafa; border-bottom:1px solid #cbcbcb; padding: 10px 0; font-weight: 500; height: 50px; position: relative;}
.tbl-sty03 th::after{ content: ''; width: 1px; height: 25px; background-color: #cbcbcb; display: inline-block; position: absolute; right:0; top:50%; transform: translateY(-50%);}
.tbl-sty03 th:last-child::after{ display: none;}
.tbl-sty03 td{ line-height: 1.33em; text-align: center; vertical-align: middle; border-bottom:1px solid #cbcbcb; padding:10px 0; position: relative; font-weight: 300; height: 50px; font-size: 0.81rem;}
.tbl-sty03 td::after{ content: ''; width: 1px; height: 25px; background-color: #cbcbcb; display: inline-block; position: absolute; right:0; top:50%; transform: translateY(-50%);}
.tbl-sty03 td:last-child::after{ display: none;}

/*reser-pop*/
.pop-reser{ position: fixed; top:50%; left:50%; transform: translate(-50%, -50%);}
.pop-reser{ width: 95%; margin: auto; padding: 33px 15px; border: solid 1px #e2e2e2; background-color: #fff;  height: 80%; min-height: 300px; z-index: 1200; border-radius: 15px; }
.pop-reser h2.title{ font-size: var(--font-20); color: #535b5d; letter-spacing: -1px; text-align: center; position: relative;}
.pop-reser h2.title::before{ content: '';  height: 3px; width: 20px; background-color: #007862; display: inline-block; position: absolute; top:-10px; left: 50%; transform: translateX(-50%);}
.pop-reser img{ width: 30px;}

.pop-wrap{ height: calc(100% - 120px); overflow: hidden;}
.pop-scroll{height: 100%; overflow-y: auto;}
.pop-scroll::-webkit-scrollbar {
    width: 2px;
}
.pop-scroll::-webkit-scrollbar-thumb {
    height: 5%;
    background: #ddd; 
    border-radius: 10px;
}
.pop-scroll::-webkit-scrollbar-track {
    background: #f8f8f8;
}
.pop-reser-text{ color: #3d3d3d; font-weight: 300; line-height: 1.5em; font-size: 0.88em; letter-spacing: -0.7px;}
.pop-reser-text span{ color: #d52727; font-weight: 400;}
.pop-reser .tbl-sty03 th{ background-clip: padding-box; z-index: -1;}

/*reser-check*/
.tbl-sty02{ width: 100%; border-top:2px solid #007862; border-bottom:1px solid #cbcbcb; font-weight: 300; color: #363636; font-size: var(--font-15);}
.tbl-sty02 th{ text-align: center; vertical-align: middle; background-color: #fafafa; font-weight: 500; position: relative; height: 50px; border-bottom:1px solid #cbcbcb;}
.tbl-sty02 th::after{ content: ''; width: 1px; height: 25px; background-color: #cbcbcb; display: inline-block; position: absolute; right:0; top:50%; transform: translateY(-50%);}
.tbl-sty02 th:last-child::after{ display: none;}
.tbl-sty02 td{ line-height: 1.33em; text-align: center; vertical-align: middle; padding:10px 0; position: relative; height: 50px; border-bottom:1px solid #cbcbcb;}

.btn-table{ display: block; width: clamp(2.8125rem, -0.8239rem + 18.1818vw, 3.4375rem); margin: auto; line-height: 28px; border:1px solid #fff; font-weight: 300;  border-radius: 14px; box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.16); }
.btn-table.on{ background-color: #049f83; color: #fff; }
.btn-table.on.wide{ width: 80px;}
.btn-table.off{ border:1px solid #cbcbcb; color: #292929; background-color: #fff;}
.btn-table.check{ background-color: #292929; color: #fff; }

#contents2,#contents3,#contents4,#contents5{ display: none;}

.select-sty02{ background:#fafafa url(/images/ic_down.svg) no-repeat; width: 100%; height: 30px; color: #292929; text-align: left; padding: 2px 20px; font-size: 1em; text-indent: 0; background-position:center right 8px; background-size: 17px 9px; border: 0;}
.select-sty02 option[value=""][disabled] {display: none;}
.wait-td .select-sty02{ width: 100px;}

/*join-list*/
.board-header{ text-align: right; padding-bottom: 15px; display: flex; justify-content: flex-end; align-items: center; font-size: 0.94em; position: relative;}
.board-header select{ width: 80px; height: 40px; font-size: var(--font-15); background-position: center right 8px border:1px solid #cbcbcb;}
.board-header input[type="checkbox"] + label { position: relative; padding-right: 15px;}
.board-header input[type="checkbox"] + label::before {
    content: '';
    background: url('/mobile/images/check.svg') no-repeat center center;
    background-size: 20px 20px;
    display: inline-block;
    width: 20px;
    height: 20px;
    position: absolute;
    top: -1px;
    left: -25px;
}
.board-header input[type="checkbox"]:checked + label::before {
    content: '';
    background: url('/mobile/images/check_on.svg') no-repeat center center;
}
.board-header input[type="checkbox"]{ display: none;}

.search-box{ display: flex; width: calc(100% - 90px); border:1px solid #e9e9e9; height: 40px;  margin-left: 10px; justify-content:space-between; align-items: center;}
.search-box input[type="text"]{ background-color: #fff; height: 38px; width: calc(100% - 38px); font-size: 16px; text-indent: 0; padding: 0 8px;}
.search-box input[type="text"]::placeholder{ font-size: 0.88em;}
.search-box button{ background-color: #007862; width: 38px; height: 38px; text-align: center;}
.search-box button img{ margin: auto;}

.tbl-sty01 .title{ overflow: hidden; white-space: nowrap; text-overflow: ellipsis; padding:0 10px; text-align: left;}
.progress{ display: inline-block; width: 55px; text-align: center; line-height: 28px; border-radius: 17px; box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.16); border: solid 1px #fff; background-color: #049f83; color: #fff;}
.deadline{ display: inline-block; width: 55px; text-align: center; line-height: 28px; border-radius: 17px; box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.16); border: solid 1px #fff; background-color: #ababab; color: #fff;}
.delete{ display: inline-block; width: 55px; text-align: center; line-height: 28px; border-radius: 17px; box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.16); border: solid 1px #fff; background-color: #707070; color: #fff;}

.click-date{ border:0; background-color: #fafafa; width: 100%; line-height: 30px; text-align: left; padding-left: 5px; position: relative;}

.open-date{ position: absolute; top: 40px; left: 0; background-color: #fff; border:1px solid #ddd; z-index: 5; padding: 15px 8px 0; width: 100%; display: none;}
.open-date .calendar-top h2{ font-size: var(--font-18); margin: 0;}
.open-date .calendar-top a{ top:0;}
.s-calendar{ width: 96%; margin: 10px auto; position: relative; table-layout: fixed;}
.s-calendar thead th{ font-weight: 400; color: #707070; padding: 5px 0; height: 30px !important; background-color: #fafafa; border:1px solid #cbcbcb; text-align: center;}
.s-calendar thead th::after{ display: none;}
.s-calendar thead th:first-child{ color: #e90505;}
.s-calendar thead th:last-child{ color: #1075ce;}
.s-calendar tbody td{ color: #292929; text-align: center !important; font-weight: 300; position: relative; height: 30px !important; font-weight: 300; border:1px solid #cbcbcb; padding: 0;}
.s-calendar tbody td::after{ display: none;}
.s-calendar tbody td.choice{ font-weight: 400; color: #fff !important; background-color: #007862; cursor: pointer;}

.btn-write{ width: 100%; margin: 20px 0; display: flex; justify-content: center; align-items: center;}
.btn-write a{ display: block; width: 70px; line-height: 32px; background-color: #fff; color: #363636; text-align: center; letter-spacing: -0.32px; margin: 0 5px;}
.btn-write a.list, .btn-write a.cancel{ background-color: #afafaf; color: #fff;}
.btn-write a.write{ background-color: #363636; color: #fff;}
.btn-write a.delete, .btn-write a.check{ background-color: #363636; color: #fff;}
.btn-write a.modify{ border:1px solid #363636; line-height: 30px;}

.btn-write.small{ justify-content: flex-end; margin: 10px 0 20px;}
.btn-write.small a{ width: 60px; line-height: 30px; background-color: #211b34; color: #fff; font-size: 0.88em; margin: 0;}

.page-num-wrap{ margin: 40px 0; display: flex; align-items: center; justify-content: center;}
.page-num-wrap a{ margin: 0px; }
.page-num-wrap a img{ width: 42px;}
.page-num-wrap.view a{ margin:0;}
.page-num{ display: flex; margin: 0;} 
.page-num a{ margin: 0; font-weight: 300; width: 43px; line-height: 43px; text-align: center; color: #cbcbcb; font-size: var(--font-15);}
.page-num a.on{ color: #292929;}

/*join-reser-view*/
.board-join-view{ width: 100%; font-weight: 400;}
.board-join-top{ width: 100%; border-top:2px solid #007862; font-weight: 300; table-layout: fixed;}
.board-join-top th{ vertical-align: middle; padding: 3px 0; background-color: #fafafa; height: 50px; border-bottom: 1px solid #cbcbcb; position: relative;}
.board-join-top th.title{ width: 100%; text-align: left; font-size: 1em; color: #363636; font-weight: 500; line-height: 1.5em;}
.board-join-top th::after{ content: ''; width: 1px; height: 25px; background-color: #cbcbcb; display: inline-block; position: absolute; right:0; top:50%; transform: translateY(-50%);}
.board-join-top th:last-child::after{ display: none;}
.board-join-top th.none::after{ display: none;}
.board-join-top td{ width: 100%; text-align: left; font-size: var(--font-15); color: #363636; line-height: 1.5em; vertical-align: middle; padding: 3px 10px; border-bottom: 1px solid #cbcbcb; position: relative;}
.board-join-top td .date2{ border:0; background-color: #fafafa; width: 100%; line-height: 30px; text-align: left; padding-left: 5px; position: relative;}

.board-join-con{ min-height: 100px; border-bottom: solid 1px #cbcbcb; padding: 20px 15px; line-height: 1.25em;}

.reply-view{ margin-top: 20px; font-size: var(--font-14to16);}
.reply-box{ margin-bottom: 10px;border-top:2px solid #007862;}
.reply-box ul{ border-bottom: 1px solid #cbcbcb; display: table; width: 100%;}
.reply-box ul li{ display: table-cell; height: 50px; vertical-align: middle; padding: 5px 5px; text-align: center;  background-color: #fff; font-weight: 400;}
.reply-box ul li.reply-info { background-color: #fafafa; text-align: left;}
.reply-box ul li.reply-info img{ vertical-align: text-bottom; margin-right: 3px;}
.reply-box ul li.reply-info em{ display: inline-block; width: 1px; border-right: 1px solid #ccc; height: 20px; vertical-align: middle; margin:0 3px;}
.reply-box ul li .reply-con{ padding-bottom: 10px; line-height: 1.4em; font-size: var(--font-15);}
.reply-box ul li .reply-con ul{ border-bottom: 0;}
.reply-box ul li .reply-con ul li{ text-align: left; padding: 0; font-weight: 300;}
.reply-box ul li p{ font-size: var(--font-15); padding-bottom: 10px;}

.reply-write{ margin-top:20px; background-color: #fff;}
.reply-write-con{ border-bottom: 1px solid #cbcbcb;}
.reply-write-con.none{ border-bottom: 0;}
.reply-write-con textarea{ width: 100%; min-height: 100px; border:0; line-height: 1.3em; font-size: var(--font-15); resize: none; padding: 18px 10px;}
.reply-write-con textarea::placeholder{ font-size: var(--font-15); color: #ababab; font-weight: 300;}
.reply-write .board-join-top td{ width: auto; height: 50px;}
.board-join-top td em{ float: right; width: 58px; padding-left: 5px;}
.board-join-top td em.none{ width: 20px;}
.board-join-top input[type="checkbox"] + label { position: relative; padding-right: 0px; margin-left:-5px;}
.board-join-top input[type="checkbox"] + label.none{ font-size: 0; height: 0px; width: 0px; display: block;}
.board-join-top input[type="checkbox"] + label::before {
    content: '';
    background: url('/mobile/images/join/img_check_off.svg') no-repeat center center;
    background-size: 20px 20px;
    display: inline-block;
    width: 20px;
    height: 20px;
    position: absolute;
    top: 3px;
    left: 35px;
}
.board-join-top input[type="checkbox"]:checked + label::before {
    content: '';
    background: url('/mobile/images/join/img_check_on.svg') no-repeat center center;
}
.board-join-top input[type="checkbox"]{ display: none;}
.board-join-top input[type="checkbox"] + label.none::before{ left: 0;}

.board-join-top input[type="text"]{ height: 30px; font-size: 1em; padding: 0;}
.board-join-top input[type="text"]::placeholder{ font-size: 1em;}

.radio-sty02{ font-size: var(--font-15); font-weight: 400;}
.radio-sty02 input[type=radio] {
    display:none;
}
.radio-sty02 input[type=radio] + label { 
    background-repeat: no-repeat;
    background-image: url('/mobile/images/ic_radio.svg');
	background-size: 19px 19px;
	padding-left: 24px;
	padding-right: 5px;
    padding-bottom: 1px;
	background-position: left top 2px;
    transition: 0.3s all;
}
.radio-sty02 input[type=radio]:checked + label {
    background-image: url('/mobile/images/ic_radio_on.svg');
	background-size: 19px 19px;
}
.register{ width: 120px;  border-radius: 25px; box-shadow: 2px 2px 6px 0 rgba(0, 0, 0, 0.16); border: solid 1px #fff; background-color: #292929; color: #fff; font-size: var(--font-18); display: inline-block; text-align: center; line-height: 50px;}

.bar-tit{ position: relative; padding-left: 20px; font-size: var(--font-18); font-weight: 500; color: #292929; margin-top:50px;}
.bar-tit::before{ content: ''; width: 10px; height: 3px; background-color: #049f83; display: block; position: absolute; left: 0; top: 50%; transform: translateY(-50%);}

.common-text-box2{ padding: 10px; word-break: keep-all; color: #707070; font-size: var(--font-14); font-weight: 300; line-height: 1.4em; letter-spacing: -0.28px; background-color: #fafafa; margin:10px 0;}
.common-text-box2 h2{ font-size: 1.14em; color: #292929; font-weight: 500; padding-bottom: 12px;}
.common-text-box2 h2.bar{ position: relative; padding-left: 20px;}
.common-text-box2 h2.bar::before{ content: ''; width: 10px; height: 3px; background-color: #049f83; display: block; position: absolute; left: 0; top: 11px;}
.common-text-box2 h2.bar span{ font-weight: 600; margin-left: 7px;}

.time select{ width: 40%; height: 30px; text-indent: 0;}

.agree-join{ margin: 20px 0 50px; text-align: center; font-size: var(--font-14to16);}
.agree-join input[type="checkbox"] + label { position: relative; padding-right: 0px; margin-left: 30px;}
.agree-join input[type="checkbox"] + label::before {
    content: '';
    background: url('/images/join/img_check_off.svg') no-repeat center center;
    background-size: 20px 20px;
    display: inline-block;
    width: 20px;
    height: 20px;
    position: absolute;
    top: 3px;
    left: -25px;
}
.agree-join input[type="checkbox"]:checked + label::before {
    content: '';
    background: url('/images/join/img_check_on.svg') no-repeat center center;
}
.agree-join input[type="checkbox"]{ display: none;}

/*group*/
.use-box{padding: 35px 0; color: #707070;}
.use-box h2{ color: #292929; font-weight: 500; padding-bottom: 10px;}
.use-box h2.bar{ position: relative; padding-left: 18px; letter-spacing: -0.8px; line-height: 1.5em;}
.use-box h2.bar::before{ content: ''; width: 10px; height: 3px; background-color: #049f83; display: block; position: absolute; left: 0; top: 10px;}
.use-box h2 span{ font-weight: 400; margin-left: 7px;}
.use-box em{
    padding-bottom: 20px;
    line-height: 1.5em;
    word-break: keep-all;
    display: block;
}

.tbl-sty05{ width: 100%; border-top:2px solid #292929; font-weight: 400; color: #292929; background-color: #fff; table-layout: fixed;}
.tbl-sty05 thead th{ text-align: center; vertical-align: middle; border:1px solid #cbcbcb; padding: 4px 0; font-weight: 500; position: relative; z-index: 0; height: 50px; line-height: 1.25em;}
.tbl-sty05 thead th span{ font-size: 14px;}
.tbl-sty05 tbody td{ line-height: 1.33em; text-align: center; vertical-align: middle; border:1px solid #cbcbcb; padding:4px 0; height: 50px; font-weight: 300;}

.over-table{ width:100%; overflow-x: auto; padding-bottom: 10px;}
.over-table table{ min-width: 700px;}

.use-box p{ position: relative; margin:0 0 10px 18px; font-size: var(--font-14); line-height:  1.5em; word-break: keep-all;}
.use-box p img{ vertical-align: sub;}
.use-box p::before{ content: ''; width: 5px; height: 5px; border-radius: 50%; background-color: #007862; position: absolute; left: -10px; top:8px;}
.use-box p.red::before{ background-color: #e90505;}
.use-box p.none::before{  display: none;}

.btn-group{ width: 100%; text-align: center; margin: 40px 0;}
.btn-group a{ width: 100%; display: flex; align-items: center; justify-content: center; background-color: #007862; font-size: clamp(0.8125rem, 0.0852rem + 3.6364vw, 0.9375rem); color: #fff; line-height: 50px; border-radius: 30px; border:1px solid #fff; box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16); margin-bottom: 10px;}
.btn-group a::before{ content: ''; background: url(/mobile/Images/ic_download.svg) center center no-repeat; display: inline-block; width: 24px; height: 24px; margin-right: 3px;}

.group-info{ display: flex; align-items: center; justify-content:space-between; }
.group-info ul{ width: 83%;}
.group-info p{ width: 15%;}
.group-info .name{ display: flex; align-items: center; justify-content:space-between; margin-top: 8px; }
.group-info input{ height: 30px; padding:3px 0 0 0; line-height: 30px; font-size: 16px;}
.group-info input::placeholder{ font-size: var(--font-15);}

.tbl-sty04{ width: 100%; border-top:2px solid #007862; border-bottom:1px solid #cbcbcb; font-weight: 300; color: #363636; font-size: var(--font-15);}
.tbl-sty04 th{ text-align: center; vertical-align: middle; border-bottom:1px solid #cbcbcb;}
.tbl-sty04 th textarea{ border: 0; width: 100%; height: 115px; resize: none; padding: 1em;}
.tbl-sty04 th textarea::placeholder{ line-height: 1.33; letter-spacing: -0.3px; color: #ababab;}

.common-text-box{ padding: 10px; word-break: keep-all; color: #707070; font-size: 1em; line-height: 1.4em; letter-spacing: -0.28px; background-color: #fafafa; margin:10px 0;}

.tab-fee-img{ width: 100%; text-align: center; margin:0 auto 20px;}
.tab-fee-img ul{ width: 100%; display: flex; justify-content:space-between; align-items: center; margin-bottom: 24px;}
.tab-fee-img li{ text-align: center; background-color: #efefef; line-height: 40px; color: #cbcbcb; border-radius: 8px 8px 0 0; transition: 0.3s all ease-in-out; cursor: pointer; flex-grow: 3;}
.tab-fee-img li.on{ background-color: #049f83; color: #fff; }

.fee-img img{ width: 100%;}

/*gallery*/
.event-wrap{ width: 100%;}
.event-wrap ul{ display: flex; flex-wrap: wrap; justify-content: space-between;}
.event-wrap ul .event-box{ width: 100%; margin-bottom: 20px; position: relative; border-bottom: 1px solid #cbcbcb; overflow: hidden;}
.event-wrap ul .event-box a{ display: block;}
.event-wrap ul .event-box h1{ width: 100%; overflow: hidden; position: relative;}
.event-wrap ul .event-box h1 img{ width: 100%;}

.event-wrap ul .event-box .event-info{ padding:10px; font-weight: 400;}
.event-wrap ul .event-box .event-info ul{ display: flex; justify-content: space-between; align-items: center;}
.event-wrap ul .event-box .event-info ul li{ width: calc(100% - 94px);}
.event-wrap ul .event-box .event-info ul li h3{ width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 1em; color: #363636; font-weight: 500;}
.event-wrap ul .event-box .event-info ul li p{ color: #292929; padding-top: 10px; font-size: var(--font-15);}
.event-wrap ul .event-box .event-info ul span{ width: 43px; height: 43px; line-height: 43px; text-align: center; margin: 0; background-color: #049f83; border-radius: 50%; box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16); border: solid 1px #fff; color: #fff; font-size: var(--font-15);}

.event-box.finish a{ cursor: default;}
.event-box.finish a h1::after{ content: ''; width: 100%; height: 100%; position: absolute;  top:0; left: 0; background-color: rgba(0,0,0,0.5); display: block; z-index: 1;}
.event-box.finish a .event-info ul span{ background-color: #707070; border:1px solid #fff;}

/*view*/
.board-view{ width: 100%; font-weight: 400;}
.board-view-top{ width: 100%; background-color: #fafafa; border-top:2px solid #007862;}
.board-view-top ul{ border-bottom: 1px solid #cbcbcb; display: table; width: 100%;}
.board-view-top ul li{ display: table-cell; height: 50px; vertical-align: middle; padding: 5px 15px; text-align: center; width: 100px;}
.board-view-top ul li.title{ width: calc(100% - 120px); text-align: left; font-size: 1em; color: #363636; font-weight: 500; line-height: 1.5em;}
.board-view-top ul li span{ margin-right: 15px; font-weight: 300; font-size: 1em;}
.board-view-top ul li em{ display: inline-block; width: 1px; border-right: 1px solid #ccc; height: 20px; vertical-align: middle; margin:0 15px;}
.board-view-top ul li a:hover{ text-decoration: underline;}

.board-view-con{ min-height: 300px; border-bottom: solid 1px #cbcbcb; padding: 40px 30px; margin-bottom: 70px; line-height: 1.5em; text-align: center;}
.board-view-con img{ max-width: 100%; display: block; margin: auto;}

/*club*/
.club-con{ margin: 130px 0 -90px; position: relative; width: 100%;}
.club-visual{ width: 100%;}
.club-visual img{ width: 100%;}

.greeting-title{ color: #292929;}
.greeting-title h4{ font-family: var(--font-en); text-transform: uppercase; font-weight: 400; font-size: var(--font-15);}
.greeting-title h1{ margin-top: 10px; font-size: var(--font-30); line-height: 1.3em; letter-spacing: -1.25px;  font-weight: 300;}
.greeting-title h1 span{ font-weight: 600; color: #007862; }
.greeting-ceo{ position: absolute; right:0; top:0; opacity: 0;}

.greeting-box{ width: 100%; margin-top: 25px;}
.greeting-box ul{ width: 100%;}
.greeting-box ul li{ font-size: var(--font-14); line-height: 1.43em; letter-spacing: -0.36px; white-space: pre-line; color: #707070; font-weight: 400;}
.greeting-box p{ text-align: right; margin-top:25px; }
.greeting-box p span{ font-family: 'InkLipquid'; font-size: var(--font-50); padding-left: 10px;}

.club-top{ 
    position: relative;
    padding-top: 115px;
}
.club-en{ 
    font-family: var(--font-en);
    font-size: var(--font-24);
    color: #cbcbcb;
    font-weight: 300;
    text-transform: uppercase;
    opacity: 0;
}
.club-top-box{ width: 100%;}
.club-img {
    width: 320px;
    height: 448px;
    opacity: 0;
}
.club-img img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.club-img2 {
    position: absolute;
    right: 0;
    top: 0;
    z-index: -1;
    opacity: 0;
    width: 230px;
    height: 230px;
}
.club-img2 img{
    width: 100%;    
    height: 100%;
    object-fit: cover;
}

.club-title{ color: #292929; padding-top: 40px; opacity: 0;}
.club-title h4{ font-family: var(--font-en); text-transform: uppercase; font-weight: 400; font-size: var(--font-15);}
.club-title h1{ margin-top: 10px; font-size: var(--font-30); line-height: 1.3em; letter-spacing: -0.6px;  font-weight: 300;}
.club-title h1 span{ font-weight: 600; color: #007862; }
.club-title p{ font-size: var(--font-14); line-height: 1.43em; letter-spacing: -0.28px; color: #707070; margin-top: 40px;}

.club-wrap2{ position: relative; margin-top: 87px;}
/*.club-bg{ position: absolute; left: 0; top:0;}*/

/*.club-visual{ position: relative; width: 100%; margin: auto;}
.club-visual .club-en{ text-align: right;}*/

.club-visual2{ width: 94%; margin: auto}

.club-title2{ color: #292929; width: 1155px; margin:50px auto;}
.club-title2 h4{ font-family: var(--font-en); text-transform: uppercase; font-weight: 400; font-size: 20px;}
.club-title2 h1{ margin-top: 10px; font-size: 50px; line-height: 1.3em; letter-spacing: -1.25px;  font-weight: 300;}
.club-title2 h1 span{ font-weight: 600; color: #007862; }
.club-title2 p{ font-size: 18px; line-height: 1.67em; letter-spacing: -0.36px; color: #707070; margin-top:35px;}

.btn-link{
    display: flex;
    align-items: center;
    width: 323px ;
    height: 60px;
    justify-content: center;
    gap: 0 10px;
    font-size: var(--font-15);
    color: #fff;
    letter-spacing: -0.6px;
    border-radius: 30px;
    box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
    border: solid 1px #fff;
    background-color: #007862;
    margin: 50px auto 30px;
}
.btn-link img{
    width: 24px;
}

.club-img3{
    width: 100%;
    height: 86px;
}
.club-img3 img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}


/*facil*/
.facil-wrap{ width: 100%; margin: 130px auto 30px; position: relative;}
.facil-img{ width: 100%; position: relative;}
.facil-img ul{ width: 100%; display: flex; justify-content: space-between; align-items: center;}
.facil-img ul li{ width: 33.33%}
.facil-img ul li img{ opacity: 0; width: 100%;}

.facil-title{ color: #292929; transform: translateY(100px); opacity: 0; text-align: center; margin-top:30px;}
.facil-title h4{ font-family: var(--font-en); text-transform: uppercase; font-weight: 400; font-size: var(--font-15);}
.facil-title h1{ margin-top: 6px; font-size: var(--font-30); line-height: 1.3em; letter-spacing: -1.25px;  font-weight: 300;}
.facil-title h1 span{ font-weight: 600; color: #007862; }
.facil-title p{ font-size: var(--font-14); line-height: 1.67em; letter-spacing: -0.36px; color: #707070; width: 90%; margin: 30px auto;}

.menu-img-box{ width: 100%; margin-top: 30px; margin-bottom: -90px;}
.menu-img-box .menu{ opacity: 0; position: relative;}
.menu-img-box ul{ display: flex; flex-wrap: wrap; position: relative;}
.menu-img-box ul li{ flex-basis:50%; position: relative;}
.menu-img-box ul li img{ width: 100%;}
.menu-img-box ul .facil-en{ position: absolute; top:-30px; left:0; font-size: var(--font-25); font-family: var(--font-en); color: #cbcbcb; text-transform: uppercase; width: 100%; z-index: 5;}

.tbl-sty03.facil th::after{ display: none;}
.tbl-sty03.facil td{ text-align: left; padding: 0 10px;}
.tbl-sty03.facil td:last-child{ text-align: center; text-indent: 0; padding:0;}

/*map*/
.use-box.map h2 span{ margin-left: 0;}
#daumRoughmapContainer1686731427909{ width: 100%;}

/*course*/
.tbl-sty06{ width: 100%; border-top:2px solid #007862; border-bottom:1px solid #cbcbcb; font-weight: 300; color: #363636; font-size: var(--font-15);}
.tbl-sty06 th{ text-align: center; vertical-align: middle; background-color: #fafafa; font-weight: 500; position: relative; height: 50px; border-bottom:1px solid #cbcbcb;}
.tbl-sty06 th::after{ content: ''; width: 1px; height: 25px; background-color: #cbcbcb; display: inline-block; position: absolute; right:0; top:50%; transform: translateY(-50%);}
.tbl-sty06 th:last-child::after{ display: none;}
.tbl-sty06 th.last::after{ content: ''; width: 1px; height: 25px; background-color: #cbcbcb; display: inline-block; position: absolute; right:0; top:50%; transform: translateY(-50%);}
.tbl-sty06 td{ line-height: 1.33em; text-align: center; vertical-align: middle; padding:10px 0; position: relative; height: 50px; border-bottom:1px solid #cbcbcb;}

/*course-select*/
.course-select {
	background: #ffff;
	text-align: left;
	cursor: pointer;
	position: relative;
	text-indent: 1em;
	line-height: 50px;
    font-size: 0.94em;
    border:1px solid #cbcbcb;
}
.course-select.open{
	border: 1px solid #007862;
}
.course-select span{color: #535b5d;}
.course-select li .options {
	display: block;
	margin: 0;
	background:#fff;
	position: absolute;
	width: calc(100% + 2px);
	overflow: hidden;
	max-height: 0;
	border: 1px solid #e8e8e8;
	border-top:0;
	top:51px;
	left:-1px;
	opacity: 0;
	transition:0.5s ease all;
	z-index: 1;
    color: #535b5d;	
}
.course-select li .options li {transition: 0.5s ease all; border-bottom: 1px solid #cbcbcb;}
.course-select li .options li:last-child {border-bottom:0;}
.course-select li .options li:nth-child(2n-1) {
  	background: #f5f5f5;
}
.course-select li .options.open {
	background: #fff;
	border: 1px solid #cbcbcb;
	border-top:0;
	opacity: 1;
	max-height: 1000%;
	overflow-y: auto;
}
.course-select:before {
    content: '';
    width: 17px;
    height: 9px;
    background: url(/Mobile/Images/ic_drop_down.svg) center right no-repeat;
    background-size: 17px 9px;
    position: absolute;
    top: 20px;
    right: 1em;
    transition: all ease 0.25s
}
.course-select.open:before {
    transform: rotateX(180deg);
}

.course-tab{ display: flex; width: 100%; align-items: center; justify-content: center; margin-bottom: 10px;}
.course-tab a{ width: 50%; line-height: 40px; text-align: center; letter-spacing: -0.4px; color: #cbcbcb; background-color: #efefef; border-radius: 10px 10px 0 0; }
.course-tab a.on{ background-color: #007862; color: #fff; font-weight: 500;}

.hole-con{ padding: 10px;}
.hole-info-box{ width: 100%}
.hole-num{ width: 100%; display: flex; align-items: flex-end;}
.hole-num h2 b{ font-size: var(--font-40); font-weight: 400;}
.hole-num h2 span{ font-family: var(--font-en); padding-left: 7px;}
.hole-num h3{ padding-left: 30px; text-transform: uppercase; font-size:var(--font-18); font-weight: 400;}
.hole-num h3 span{ font-size: var(--font-14); color: #cbcbcb; font-family: var(--font-en); padding-right: 5px;}
.hole-num h3 em{ width: 32px; position: relative; display: inline-block; height: 20px;}
.hole-num h3 em::before{ content: ''; position: absolute; bottom:-4px; left: 50%; width: 1px; height: 20px; background-color: #cbcbcb;}
.hole-info{ padding:10px 0; display: flex; align-items: center; justify-content: space-evenly;}
.hole-info em{ padding-right: 2px; line-height: 50px; font-size: var(--font-14to16) }
.hole-info em span{ border: 2px solid #363636; width: 15px; height: 15px; border-radius: 50%; display: inline-block; vertical-align: middle; margin-top:-4px; margin-right: 2px;}
.hole-info em span.h-black{ background-color: #363636;}
.hole-info em span.h-blue{ background-color: #0080ff;}
.hole-info em span.h-white{ background-color: #fff;}
.hole-info em span.h-yellow{ background-color: #ffcc00;}
.hole-info em span.h-red{ background-color: #d90000;}
.hole-text{ font-size: var(--font-14); color: #707070; line-height: 1.5em; font-weight: 400; letter-spacing: -0.36px; padding: 15px 0 30px;}
.course-movie{ width: 100%;}
.course-movie video{ width: 100%;}

.hole-img{ padding-top:5px;}
.hole-img img{ max-width: 223px; display: block; margin: auto;}

/*partner*/
.check-in-wrap{ position: relative; width: 94%; height: 100%; margin: 0 auto; padding:90px 0 80px;}
.header-check-in{ font-size: 1.5em; text-align: center; color: #333; font-weight: 500;}
.inner_tit{color: #333; padding-bottom: 10px; font-size: 1.3em; font-weight: 500;}

.check_input[type="radio"]{-webkit-appearance: none;appearance: none;display: inline-block;width: 14px;height: 14px;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;vertical-align: bottom;margin-right: 8px;background-repeat: no-repeat;outline:0;border: 0;vertical-align: middle;background-size: contain;background-image: url('/images/radio_ico.png');cursor:pointer;}
.check_input[type="radio"]:checked{background-image:url('/images/radio_ico_on.png');}

.cancel_btn{min-width: 80px; height: 30px; line-height: 30px; padding: 0;}

.basic_input{background: #fff !important; border: 1px solid #dbdbdb !important; width: 175px !important; color: #6d6d6d; height: 40px !important;}
.basic_input::placeholder{color: #7d7d7d;}

/* partner list */
.check-in-tit{border-radius: 20px; text-align: center; color: #fff; font-weight: 400; width: 70%; margin: 30px auto; padding: 0.7em; background: #007862; font-size: clamp(1rem, 0.2727rem + 3.6364vw, 1.125rem); max-width: 280px;}
.resv_search{width: 100%; text-align: center; font-size: clamp(0.75rem, 0.0227rem + 3.6364vw, 0.875rem); border-top: 2px solid #007862;}
.resv_search tbody th{border:1px solid #ddd; background: #f7f7f7; padding: 1em 0.5em; font-weight: 500; vertical-align: middle;}
.resv_search tbody td{border:1px solid #ddd; padding: 1.3em 0.5em; vertical-align: middle;}
.resv_search tbody th:first-child{border-left: 0;}
.resv_search tbody th:last-child{border-right: 0;}
.resv_search tbody td:first-child{border-left: 0;}
.resv_search tbody td:last-child{border-right: 0;}

.partner-tit{text-align: center; margin: 40px auto 20px; font-weight: 400; font-size: 1em;}

.withMemWrap{width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between;}
.boxSty2{padding: 1em; color: #0D0D0D; font-weight: 300; word-break: keep-all; border: 1px solid #b8b8b8; width: 48%; margin-bottom: 10px; text-align: center;}
.boxSty2 h3{height: 40px; font-size: 0.8em; margin: 0 0 1.25em 0; display: flex; justify-content: center; align-items: center; line-height: 1.5em;}
.boxSty2 h3 i{ color: #bebebe; font-size: 40px;}
.common_btn{padding:0.5em; width: 80%; color: #fff; border-radius: 20px; font-size: 0.875em; background: #B5B5B5; display: block; margin: 0 auto; font-weight: 400;}
.common_btn.on{ background-color: #606060;}

.btn-checkin{text-align: center; margin: 10px auto;}
.btn-checkin a{background: #999; color: #fff; width: 100%; padding: 1em; font-size: 1em; display: block; font-weight: 500;}
.btn-checkin a.on{background: #007862;}

.check-tit{font-size: 1em; font-weight: 500; color: #333; margin: 30px 0 10px;}
.check-table{width: 100%; border: 1px solid #dbdbdb; background: #f9f9f9; text-align: left; font-size: clamp(0.875rem, 0.1477rem + 3.6364vw, 1rem);}
.check-table tbody th{padding: 0.7em 1.3em; vertical-align: middle; position: relative;}
.check-table tbody td{position: relative; vertical-align: middle;}
.check-table tbody th::after{content: '•'; display: inline-block; color: #007862; position: absolute; left: 10px; top: 10px;}
.check-table tbody td::before{content: ':'; position: absolute; top: 30%; left: -9%; color: #000;}

.qr-btn{width: 96%; margin: 10px auto ; display: flex; align-items: center; justify-content: space-between}
.qr-btn a{width: 49%; background:#999; color: #fff; font-weight: 500; font-size: 1em; text-align: center; padding: 0.5em 0;}
.qr-btn a.on{background: #007862;}

.common_btn4{padding: 1em; width: 48%; color: #0d0d0d; border-radius: 10px; background: #fff; border: 1px solid #dbdbdb; font-size: 0.88em; font-weight: 600;}
.common_btn4.on {background-color:#999;color:#fff;}

.withInfo{width: 100%; margin-bottom: 20px;}
.withInfo input{ background: #fff; border: 1px solid #dbdbdb; color: #6d6d6d; outline: 0; text-align: center; height: 50px; width: 100%;}
.withInfo input::placeholder{color:#6d6d6d; }

/* qr-popup */
.qr-pop{width: 80%; padding: 1em; transform: translate(-50%, -50%); margin: 0 auto; text-align: center; background-color: #fff;position: fixed;z-index: 10000;left: 50%;top:50%;word-break: keep-all; }
.qr-pop i{ font-size: 60px; color: #333; text-shadow: 2px 2px 0 rgba(0,0,0,0.5); padding-bottom: 10px;}
.qr-close{background: #007862; color: #fff; display: block; padding: 0.5em; width: 60%; margin: 30px auto 10px; text-align: center; font-weight: 500; font-size: 1.1em;}

/*reser-renew*/
.reser-area{
    width: 100%;
    display: flex;
    align-items: center;
    height: 60px;
}
.calendar-month{
    width: 70px;
    border-right: 1px solid #cbcbcb;
    padding-right: 5px;
}
.calendar-month select{
    width: 100%;
    height: 30px;
    font-weight: 700;
    font-size: 1rem;
    border: 0;
}
.calendar-days{ 
    width: 100%;
    width: calc(100% - 70px);
}
.calendar-days ul{
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 5px 0;
}
.calendar-days ul li{
    width: 45px;
    flex: 0 0 auto;
    text-align: center;
    padding: 6px 0;
    line-height: 1.4em;
    color: #363636;
    font-weight: 600;
}
.calendar-days ul li p{
    font-weight: 400;
}
.calendar-days ul li.sat{
    color: #1075ce;
}
.calendar-days ul li.sun{
    color: #e90505;
}
.calendar-days ul li.deadline{
    background-color: #efefef;
    color: #cbcbcb !important;
    border-radius: 0;
    box-shadow: none;
    display: block;
    border: none;
}
.calendar-days ul li.choice{
    position: relative;
    color: #fff;
}
.calendar-days ul li.choice::before{
    content: '';
    border-radius: 18px;
    box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.16);
    border: solid 1px #fff;
    background-color: #007862;
    display: block;
    position: absolute;
    left: 50%;
    top:0;
    transform: translateX(-50%);
    width: 36px;
    height: 100%;
    z-index: -1;
}

.reser-time-area{
    width: 100%;
    display: flex;
    align-items: center;
    height: 60px;
}
.time-select{
    width: 70px;
    border-right: 1px solid #cbcbcb;
    padding-right: 5px;
}
.time-select select{
    width: 100%;
    height: 30px;
    font-weight: 700;
    font-size: 1rem;
    border: 0;
}
.time-choice{ 
    width: 100%;
    width: calc(100% - 70px);
    padding-left: 5px;
}
.time-choice ul{
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    overflow-x: auto;
    overflow-y: hidden;
    gap: 10px;
    padding: 5px 0;
}
.time-choice ul li{
    width: 80px;
    flex: 0 0 auto;
    text-align: center;
    padding: 6px 0;
    line-height: 1.4em;
    color: #363636;
    font-size: 0.94rem;
    border-radius: 20px;
    border: solid 1px #cbcbcb;
}
.time-choice ul li.on{
    color: #fff;
    box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.16);
    border: solid 1px #fff;
    background-color: #049f83
}

.reser-list-box{
    width: 100%;
    border-radius: 5px;
    border: solid 1px #cbcbcb;
    background-color: #fafafa;
    height: 80px;
    padding: 16px 16px 14px;
    margin-bottom: 15px;
}
.reser-list-box ul{
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
}
.reser-list-box ul li{
    font-weight: 700;
}
.reser-list-box ul li.price{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    font-size: 1.13rem;
}
.reser-list-box ul li.price span{
    display: inline-block;
    font-size: 0.88rem;
    font-weight: 400;
    color: #fff;
    background-color: #ffaa00;
    border-radius: 5px;
    width: 40px;
    text-align: center;
    line-height: 18px;
    margin-left: 5px;
}
.reser-list-box p{
    font-size: 0.88rem;
    color: #707070;
    line-height: 1.4em;
    letter-spacing: -0.28px;
}
.reser-list-box p em{
    display: inline-block;
    margin: 0 7.5px;
}

/*wait - add*/
.time-choice2{ 
    width: 100%;
}
.time-choice2 ul{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.time-choice2 ul li{
    max-width: 100px;
    width: 30%;
    text-align: center;
    padding: 6px 0;
    line-height: 1.4em;
    color: #363636;
    font-size: 0.94rem;
    border-radius: 20px;
    border: solid 1px #cbcbcb;
}
.time-choice2 ul li.on{
    color: #fff;
    box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.16);
    border: solid 1px #fff;
    background-color: #049f83
}
.reser-list-box.wait{
    height: 60px;
    padding: 14px 16px;
}
.reser-list-box.wait ul{
    margin-bottom: 0;
}
.btn-wait{
    font-size: 0.88rem;
    font-weight: 500;
    text-align: center;
    color: #363636;
    background-color: #fff;
    width: 84px;
    line-height: 28px;
    display: block;
    border-radius: 30px;
    box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
    border: solid 1px #cbcbcb;
}

/*231218*/
.search-box{width: 100%; padding:10px 0;}
.choice-day-box{ display: flex; width: 100%; color: #5f6668; justify-content: center; align-items: center; align-items: stretch;}
.choice-day-list{ width: 100%;}
.choice-day-list li{ display: flex; width: 100%; color: #5f6668; justify-content: space-around; align-items: center; justify-content: space-between; }
.choice-day-list li span{text-align: center;}
.choice-day-list li .choice-day{ 
    width: 45%; 
    height: 38px; 
    padding:8px 0; 
    background-color: #fff;
    border: 1px solid #ddd;
    font-size: .9375em;
    display: flex;
    align-items: center;
    justify-content: center;
}
.choice-day-list li .choice-day input{
    height: auto;
    background-color: #fff;
    text-indent: 0;
    padding: 0;
    text-align: center;
    font-size: 0.9375rem;
}
.choice-day-box button{ background-color: #007862; font-size: 0; width: 40px;}
.choice-day-box button img{ display: inline-block; width: 18px;}

.tbl-sty02 th.alram div{ 
    display: flex;
    width: 100%;
    justify-content: flex-start;
    align-items: center;
}
.tbl-sty02 th.alram div img{
    width: 20px;
    margin: 0 5px;
}
.tbl-sty03.coupon th::after{ display: none;}
.tbl-sty03.coupon td{ text-align: left; padding: 10px;}


/*250404*/
.guide-box{ width: 100%; line-height: 1.43em; font-weight: 400;}
.guide-box h2{ 
    font-size: var(--font-18);
    font-weight: 500;
    padding-bottom: 24px;
    line-height: 1.7em;
    letter-spacing: -1.8px;
}
.con-tit-sub{ 
    position: relative;
    font-weight: 500;
    color: #292929;
    padding-bottom: 10px;
    padding-left: 20px;
}
.con-tit-sub::before{ 
    content: '';
    width: 10px;
    height: 3px;
    background-color: #007862;
    display: block;
    position: absolute;
    left: 0px;
    top: 8px;
}

.sat{
    color: #1075ce;
}
.sun{
    color: #e90505;
}

.membership-title{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 14px 0;
    margin-bottom: 40px;
}
.membership-title span{
    color: #007862;
    font-weight: 700;
    letter-spacing: -0.5px;
    font-size: var(--font-25);
}

.tbl-sty03.left td{
    text-align: left;
    padding: 10px 15px;
}

.tbl-sty03 .enter-request{
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.tbl-sty03 .enter-request input{
    width: 100%;
}

.tbl-sty03.left input{
    font-size: var(--font-15);
    height: 30px;
    padding: 8px 0 6px;
}

.tbl-sty03.left input::placeholder{
    font-size: var(--font-15);
}

.tbl-sty03.left .radio-sty01{
    font-size: var(--font-15);
}

.tbl-sty03 th.no-line::after{
    display: none;
}

.tbl-sty03.service td{
    background-color: #fff;
}
.tbl-sty03.service b{
    font-weight: 600;
}

.common-text-box3{
    padding: 12px 28px;
    word-break: keep-all;
    color: #707070;
    font-size: var(--font-14);
    font-weight: 300;
    line-height: 1.4em;
    letter-spacing: -0.28px;
    background-color: #fafafa;
    margin: 10px 0;
}
.common-text-box3 p{ position: relative; font-size: var(--font-14); line-height:  1.5em; word-break: keep-all;}

.common-text-box3 li{ position: relative; margin:0 0 10px 0; font-size: var(--font-14); line-height:  1.5em; word-break: keep-all;}
.common-text-box3 li img{ vertical-align: sub;}
.common-text-box3 li::before{ content: ''; width: 5px; height: 5px; border-radius: 50%; background-color: #007862; position: absolute; left: -10px; top:8px;}

.tbl-sty04{ width: 100%; border-bottom:1px solid #cbcbcb; font-weight: 400; color: #363636;}
.tbl-sty04 th{ text-align: center; vertical-align: middle; background-color: #fafafa; font-weight: 500; position: relative; height: 50px; border-bottom:1px solid #cbcbcb;  border-top:2px solid #007862; letter-spacing: -0.8px;}
.tbl-sty04 th::after{ content: ''; width: 1px; height: 25px; background-color: #cbcbcb; display: inline-block; position: absolute; right:0; top:50%; transform: translateY(-50%);}
.tbl-sty04 th:last-child::after{ display: none;}
.tbl-sty04 td{ line-height: 1.33em; text-align: center; vertical-align: middle; padding:10px 0; position: relative; height: 50px; border-bottom:1px solid #cbcbcb;}


/*250729 추가*/
.custom-dropdown {
    padding: 6px;
    font-size: 14px;
    color: #333;
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 6px;
    appearance: none;
    min-width: 55px;
    cursor: pointer;
    background-image: url('data:image/svg+xml;utf8,<svg fill="%23333" height="20" viewBox="0 0 24 24" width="20" xmlns="http://www.w3.org/2000/svg"><path d="M7 10l5 5 5-5z"/></svg>');
    background-repeat: no-repeat;
    background-position: right center;
    background-size: 16px;
}

.select-list{
    position: absolute;
    right: 0;
    bottom: 0;
}