@charset "utf-8";

/*-------------------------- common css --------------------------*/
.hr{height:1px;border-bottom:1px solid #e8e8e8; width: 100%;}
.hr2{height:1px;border-bottom:1px dotted #c1c1c1; width: 100%;}
.line-dashed{ border-bottom: 1px dashed #cbcbcb; height: 1px; width: 100%;}
.border{ border:1px solid #ddd;}
.bt1{border-top: 1px solid #ddd;}
.positionFix{ position: fixed !important;}
.displayB{ display: block !important;}
.displayIB{ display: inline-block;}
.displayN{display: none;}
.overflow-y{ overflow-y: hidden;}
.overflow-h{ overflow: hidden;}

/* font color, style */
.orange{color:#ff970f;}
.blue{color:#1075ce;}
.red {color:#e90505 !important;}
.yellow{color:#e2af00;}
.darkGray{ color: #58585a !important;}
.pink{ color: #d91b5c;}
.white{ color: #fff !important;}
.gray{ color: #3d3d3d !important;}
.green{ color: #006737}

.font14{ font-size: 14px;}
.font16{ font-size: 16px;}
.font18{ font-size: 18px;}
.font20{ font-size: 20px;}
.font24{ font-size: 24px;}

.center{ text-align: center !important;}
.left{ text-align: left !important;}
.right{ text-align: right !important;}
.marginA{ 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;}

.light{ font-weight: 300 !important;}
.normal{ font-weight: 400 !important; }
.strong{ font-weight: 500 !important; }
.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;}
.wp34{ width: 34% !important;}
.wp35{ width: 35% !important;}
.wp40{ width: 40% !important;}
.wp45{ width: 45%;}
.wp50{ width: 50% !important;}
.wp55{ width: 55% !important;}
.wp60{ width: 60% !important;}
.wp70{ width: 70% !important;}
.wp80{ width: 80% !important;}
.wp90{ width: 90%;}
.wp97{ width: 97%;}
.wp100{ width: 100% !important; max-width: 100% !important;}
.padding5{padding:5px 0;}
.padding10{padding:10px 0;}
.padding20{padding:20px 0;}
.padding30{padding:30px 0;}
.padding50{padding:50px 0;}
.padding70{padding:70px 0;}
.margin5{ margin: 5px auto;}
.margin10{ margin: 10px auto;}
.margin15{ margin: 15px auto;}
.margin20{ margin: 20px auto;}
.margin25{ margin: 25px auto;}
.margin30{ margin: 30px auto;}
.margin40{ margin: 40px auto;}
.margin50{ margin: 50px auto;}
.margin60{ margin: 60px auto;}
.margin90{ margin:90px auto;}
.mt0{ margin-top:0px !important;}
.mt10{ margin-top:10px !important;}
.mt20{ margin-top:20px;}
.mt25{ margin-top:25px;}
.mt30{ margin-top:30px !important;}
.mt40{ margin-top:40px !important;}
.mt50{ margin-top:50px !important;}
.mt60{ margin-top:60px;}
.mt80{ margin-top:80px;}
.mt100{ margin-top:100px;}
.mb10{ margin-bottom:10px !important;}
.mb20{ margin-bottom:20px !important;}
.mb25{ margin-bottom:25px;}
.mb30{ margin-bottom:30px;}
.mb40{ margin-bottom:40px !important;}
.mb50{ margin-bottom:50px !important;}
.mb60{ margin-bottom:60px !important;}
.mb70{ margin-bottom:70px !important;}
.mb100{ margin-bottom:100px !important;}
.pb5{ padding-bottom: 5px !important;}
.pb10{ padding-bottom: 10px !important;}
.pb20{ padding-bottom: 20px;}
.pb30{ padding-bottom: 30px;}
.pb40{ padding-bottom: 40px;}
.pb50{ padding-bottom: 50px;}
.pt5{ padding-top:5px;}
.pt10{ padding-top:10px;}
.pt15{ padding-top:15px;}
.pt20{ padding-top:20px;}
.pt30{ padding-top:30px;}
.pt45{padding-top: 45px;}
.pt50{padding-top: 50px;}
.pt60{padding-top: 60px;}
.pt70{padding-top: 70px;}
.img100 img{ width: 100%;}

.b-radius{ border-radius: 15px; overflow: hidden;}
.text-indent{padding: 0 10px;}

:root{
    --font-en:'Lora', serif;
    --color-gray: #444;
    --color-main: #1b6d2f;
}

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

.common-tab{ width: 100%; border-bottom: 1px solid #cbcbcb; display: flex; justify-content: space-between; position: relative;}
.common-tab a{ color: #707070; display: block; text-align: center; line-height: 80px; font-size: 20px; font-weight: 400; position: relative; background-color: #fff; flex-grow:6}
.common-tab a.on{ color: #006737; font-weight: 400;}
.common-tab a.on::after{ content: ''; width: 100%; height: 80px; display: block; border-bottom: 2px solid #006737; position: absolute; top:1px; left: 0;}
.common-tab a::after{ content: ''; width: 0; height: 80px; display: block; border-bottom: 2px solid #006737; position: absolute; top:1px; left: 0; transition: 0.3s all ease-in-out; }
.common-tab a:hover::after{ width: 100%;}
.common-tab a:hover{ color: #006737;}

.btn-common{ width: 100%; text-align: center; font-size: 0; 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: 54px; font-size: 20px; background-color: #c2c2c2; box-shadow:0 3px 6px 0 rgba(0, 0, 0, 0.16); border-radius: 30px;}
.btn-common a.on{ background-color: #006737;} 
.btn-common a.delete{ background-color: #fff; color: #292929; border: solid 1px #cbcbcb;}

/*page-common*/
.sub-header{ position: relative; height: 450px; width: 100%;}
.sub-bg-wrap{ width: 100%; height: 450px; position: relative; overflow: hidden}
.sub-bg{ width: 100%; height: 100%; position: relative; z-index: -1; overflow: hidden; animation: scale-down-center 3s cubic-bezier(0.190, 1.000, 0.220, 1.000) both;}
.bg-reser{ background: url(/Images/img_guide.jpg) center center no-repeat;  background-size: cover; }
.bg-mypage{ background: url(/Images/img_mypage.jpg) center center no-repeat;  background-size: cover; }
.bg-board{ background: url(/Images/img_news.jpg) center center no-repeat;  background-size: cover; }
.bg-group{ background: url(/Images/img_organization.jpg) center center no-repeat;  background-size: cover; }
.bg-membership{ background: url(/Images/img_membership.jpg) center center no-repeat;  background-size: cover; }
.bg-club{ background: url(/Images/img_information.jpg) center center no-repeat;  background-size: cover; }
.bg-course{ background: url(/Images/img_course.jpg) center center no-repeat;  background-size: cover; }
.bg-policy{ background: url(/Images/img_policy.jpg) center center no-repeat;  background-size: cover; }

.sub-header-con{ width: 1155px; position: absolute; top:163px; left: 50%; margin-left: -577px; /*animation: fade-in 2s cubic-bezier(0.190, 1.000, 0.220, 1.000) 0.5s both;*/}
.header-title{ font-size: 45px; letter-spacing: -0.9px; color: #fff; font-weight: 400; text-transform: capitalize; text-shadow: 0 3px 6px rgba(0, 0, 0, 0.3); margin-top:12px; }
.lead{font-size: 20px; text-transform: uppercase; color: #fff; font-family: var(--font-en); text-shadow: 0 3px 6px rgba(0, 0, 0, 0.3);}
.bg-bar{ background: linear-gradient(90deg, rgba(0,103,55,0.004639355742296902) 0%, rgba(0,103,55,0) 50%, rgba(0,103,55,1) 50%, rgba(0,103,55,1) 100%); height: 74px; width: 100%; position: absolute; bottom: -27px; left: 0; z-index: 5;}

.page-num-wrap{ margin: 40px 0; display: flex; align-items: center; justify-content: center;}
.page-num-wrap a{ margin: 0px; }
.page-num-wrap.view a{ margin:0;}
.page-num{ display: flex; margin: 0;} 
.page-num a{ margin: 0; font-weight: 300; width: 48px; line-height: 48px; text-align: center; color: #cbcbcb;}
.page-num a:hover{ background-color: #f5f5f5;}
.page-num a.on{ color: #292929;}
.page-num a.on:hover{ background-color: transparent;}

@keyframes scale-down-center {
  0% {
    transform: scale(1.1);
  }
  100% {
    transform: scale(1.01);
  }
}

@keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

.sub-tab{ width: 100%; margin-top:48px; overflow: hidden;}
.sub-tab a{ color: #fff; margin-right: 25px; float: left; position: relative; font-size:18px; padding-bottom: 10px;}
.sub-tab a::after{ content: ''; position: absolute; width: 0; height:1px; background-color: #fff; display: block; transition: 0.3s all ease-in-out; bottom:0; left: 0;}
.sub-tab a:hover::after{ content: ''; width: 100%;}

.common-wrap{ position: relative; width: 100%; padding-bottom:100px; margin: auto; height: 100%; background-color: #fff; min-height: 65vh;}
.common-con{ width: 1155px; margin: auto; position: relative;}
.common-con.short{}
.contents-wrap{ width: 100%; height: 100%; position: relative; padding-top:90px;}

.common-memu{ width: 100%; position: absolute; background-color: #006737; height: 74px; top:-47px; left: 0; z-index: 10; border-radius: 10px 0 0 10px;}
.common-memu h2{ color: #fff; line-height: 74px; margin-left: 50px; font-size: 25px; position: relative;}
.common-memu h2::before{ content: ''; position: absolute; left: -22px; top:50%; width: 8px; height: 8px; border-radius: 50%; background-color: #fff; transform: translateY(-50%);}
.common-nav{ position: absolute; right:0; top:0; width: 340px; display: flex; justify-content:center; align-items: center;}
.common-nav .sub-select{ width: 150px;}
.common-nav h1{ padding: 10px;}

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

.etc{ padding: 80px 0; text-align: center; font-size: 30px; position: relative;}
.etc::after{ content: ''; position: absolute; width: 100%; border-top:3px #ccc double; border-bottom: 3px double #ccc; left: 0; bottom: 70px; height: 45px;}

/*sub-select*/
.sub-select {
	background: #006737;
	text-align: left;
	cursor: pointer;
	position: relative;
	text-indent: 10px;
	line-height: 50px;
    font-size: 15px;
}

.sub-select span{color: #fff; line-height: 73px;}
.sub-select li .options {
	display: block;
	margin: 0;
	background:#006737;
    color: #fff;
	position: absolute;
	width: 100%;
	overflow: hidden;
	max-height: 0;
	border-top:0;
	top:74px;
	left:0;
	opacity: 0;
	transition:0.5s ease all;
	z-index: 1;	
}
.sub-select li .options li { transition: 0.5s ease all;}
.sub-select li .options li:last-child { border-bottom:0;}
.sub-select li .options li:hover {
  	background: #098048;
}
.sub-select li .options.open {
	background: #006737;
	border-top:0;
	opacity: 1;
	max-height: 1000%;
}
.sub-select:before {
    content: '';
    width: 17px;
    height: 9px;
    position: absolute;
    top: 32px;
    right: 10px;
    background: url(/Images/ic_down_02.svg) center center no-repeat;
    background-size: 17px 9px;
    transition: all ease 0.25s;
}
.sub-select.open:before {
    transform: rotateZ(180deg);
}
.sub-select li .options.open a{ display: block;}

/*login*/
.contents-login{ position: relative; width: 660px; height: 100%; padding:104px 0 170px 0; margin: auto;}
.contents-border{ position: relative; width: 100%; border: solid 1px #cbcbcb; margin-top:60px; border-radius: 20px;}
.contents-join-box{ width: 400px; margin: 70px auto;}
.contents-join-box.join{ width: 450px; margin: 70px auto;}

.login-wrap{ width: 100%; margin:auto;}
.login-wrap ul{ margin-bottom:25px;}

.login-wrap ul li{  position: relative; margin-bottom: 30px;}
.login-wrap ul li input{ background-color: #fafafa; height: 60px;}
.login-wrap ul li input::-webkit-input-placeholder{ font-size: 18px; font-weight: 300; }
.login-wrap ul li input::-moz-placeholder{ font-size: 18px; font-weight: 300;}
.login-wrap ul li input:-ms-input-placeholder{ font-size: 18px; font-weight: 300;}

.btn-login{ display: block; width: 100%; border:1px solid #fff; color: #fff; font-weight: 400; line-height: 54px; font-size: 20px; background-color: #006737; 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;}

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

.save-id{ position: relative; width: 100%; margin: 30px 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('/images/join/img_check_off.svg');
	background-size: 20px 20px;
	text-indent: 30px;
    font-size: 18px;
    padding-bottom: 5px;
    transition: 0.3s all;
    display: inline-block;
}
.save-id input[type=checkbox]:checked + label {
    background-image: url('/images/join/img_check_on.svg');
	background-size: 20px 20px;
}

.login-wrap ul li.phone{ width: 100%; overflow: hidden; margin:20px 0;}

.btn-certified{ width: 100%; text-align: center; border:1px solid #fff; color: #fff; font-weight: 500; background-color: #79bc3b; font-size: 20px; line-height: 54px; border-radius: 30px; box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);}

.phone-certified{ width:100%; overflow: hidden; margin: 30px 0;}
.phone-certified li{ width: 25%; float:left; margin-bottom: 0 !important;}
.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: 18px;}
.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: 18px; border:1px solid #dedede; border-left: 0;}

.text-login01{ text-align: center; line-height: 1.25em; color: #535b5d; word-break: keep-all; margin-bottom: 20px;}

.id-check-box{ width: 100%; padding: 0 0 33px; font-weight: 400; text-align: center; margin-bottom: 15px; font-size: 20px; 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: 35px; letter-spacing: -2px; font-weight: 500; color: #006737; }

/*join*/
.join-wrap{ width: 100%; margin:auto;}
.join-top-box{ width: 100%; background-color: #ea5815; color: #fff; font-weight: 300; text-align: center; line-height: 48px; text-transform: uppercase; font-size: 1.13em;}
.join-top-box span{ color: #ffaf8a;}
.join-wrap h1.title{ text-align: center; font-size: 24px; padding:0 0 20px; color: #535b5d; font-weight: 500;}

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

.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:20px; text-align: left; color: #535b5d; letter-spacing: -1px; font-weight: 400; /*padding:26px 0; */position: relative; height: 88px; 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{ position: absolute; right:50px; bottom:25px; width: 104px; padding: 8px 0; color: #505050; letter-spacing: -0.8px; border:1px solid #c7c7c7; box-shadow: 2px 2px 3px 0 rgba(0,0,0,0.16); text-align: center; font-size: 16px; margin-left: 16px; border-radius: 17px;}

.check-select{ position: absolute; right: 0px; top:26px; width: 34px; height: 34px; }
.check-select input[type=checkbox] {
    display:none;
}
.check-select input[type=checkbox] + label { 
    cursor: pointer; 
    background-repeat: no-repeat;
    background-image: url('/images/join/img_check_style02.svg');
	background-size: 34px 34px;
	font-size: 0;
	padding: 17px;
    width: 35px;
    height: 35px;
    transition: 0.3s all;
}
.check-select input[type=checkbox]:checked + label {
    background-image: url('/images/join/img_check_style02_on.svg');
	background-size: 34px 34px;
}
.pop-join{ position: fixed;/* top:50%; left:50%; transform: translate(-50%, -50%);*/}
.pop-join.join{  top:50%; left:50%; transform: translate(-50%, -50%);}
.pop-join{ width: 660px; margin: auto; padding: 47px 40px 85px; border: solid 1px #e2e2e2; background-color: #fff; height: 30%; max-height: 860px; min-height: 550px; z-index: 1200; border-radius: 20px;}

.pop-reser{ position: fixed; /*top:50%; left:50%; transform: translate(-50%, -50%);*/}
.pop-reser{ width: 660px; margin: auto; padding: 30px; border: solid 1px #e2e2e2; background-color: #fff; max-height: 700px; z-index: 1200; border-radius: 20px;}


.pop-join h2.title{ font-size: 24px; color: #535b5d; letter-spacing: -1px; text-align: center; position: relative;}
.pop-join h2.title::before{ content: '';  height: 3px; width: 20px; background-color: #006737; display: inline-block; position: absolute; top:-10px; left: 50%; transform: translateX(-50%);}
.pop-close{ position: absolute; right:10px; top:10px; width: 36px; height: 36px; cursor: pointer;}

.pop-terms{ line-height: 1.5em; font-size: 14px; height: calc(100% - 100px); overflow-y: auto; width: 100%; color: #707070; font-weight: 300; letter-spacing: -1px; margin-bottom: 30px;}
.pop-terms p{ text-align:left; color:#333; font-size:18px; font-weight:700; margin: 0px 0 10px;}
.pop-terms b{display: block; color:#525252; font-size:16px; margin: 15px 0 10px; font-weight: 500;}
.pop-terms2{ height: 80%; overflow-y: auto; width: 100%; color: #505050; font-weight: 300; letter-spacing: -1px;}
.pop-join-text{ font-size: 14px; line-height: 1.5em; word-break: keep-all; color: #535b5d;}

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

.overlay2{
    position: fixed;
    z-index: 50;
    width: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba( 0,0,0, 0.7);
    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{ text-align: center; line-height: 2em; font-weight: 300; color: #707070; word-break: keep-all; font-size:18px;}
.text-join03{ text-align: center; line-height: 1.25em; font-weight: 300; color: #292929; word-break: keep-all; font-size:20px; padding-bottom: 20px; font-weight: 400;}

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

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

.member-info-box{ width: 100%; margin-top: 30px;}
.member-info-box dl{ width: 100%; margin-bottom: 36px;}
.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: 20px;}
.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: #707070; font-size: 15px; padding-top:5px; 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%; background-color: #f5f5f5; border: 0; resize: none;  height: 180px; padding: 20px;}

.enter-name{ width: 100% !important; float: left;}
.input-disable2{ width: 100% !important; float: left; background-color: #fafafa; text-indent: 20px; line-height: 60px; font-size: 18px; font-weight: 300; color: #292929;}
.select-gender{ width: 20% !important; margin-left: 2%; float: left; }
.input-disable{ background-color: #f4f4f4; text-indent: 20px; line-height: 60px; font-size: 18px;}

.enter-sex{ width: 100%;}
.enter-sex span{ width: 77px; line-height: 60px; display: inline-block; border-radius: 10px; 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: 78% !important; float: left;}
.enter-id2{ width: 100% !important; float: left;}
.btn-overlap{ width: 20% !important; margin-left: 2%; float: left; background-color: #211b34; color: #fff; font-weight: 300; text-align: center; line-height: 60px; box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.16);}

.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: #363636; text-align: left; padding: 17px 20px; font-size: 18px; text-indent: 0; background-position:center right 20px; background-size: 17px 9px;}
.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%;}
.birthday{ width: 100%;}
.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{ display: flex; justify-content: space-between; justify-items: center; line-height: 48px;}
.address input[type="text"]{ width: 49%;}
.address .btn-certified{ width: 49%; line-height: 60px;}

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

.radio-sty01{ font-size: 18px; font-weight: 400;}
.radio-sty01 input[type=radio] {
    display:none;
}
.radio-sty01 input[type=radio] + label { 
    background-repeat: no-repeat;
    background-image: url('/images/join/radio.svg');
	background-size: 20px 20px;
	padding-left: 24px;
	padding-right: 20px;
    padding-bottom: 1px;
	background-position: left top 4px;
    transition: 0.3s all;
}
.radio-sty01 input[type=radio]:checked + label {
    background-image: url('/images/join/radio_on.svg');
	background-size: 20px 20px;
}

.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;}

.tbl-sty01{ width: 100%; border-top:2px solid #006737; font-weight: 400; color: #363636; font-size: 16px;}
.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 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;}
.tbl-sty01 thead th.left{ text-align: left; padding: 13px;}
.tbl-sty01 thead th.left img{ vertical-align: text-bottom;}

/*reservation*/
.contents-reser{ position: relative; width: 1155px; height: 100%; padding:104px 0 170px 0; margin: auto;}
.calendar-wrap{ width: 100%; margin-top:50px; display: flex; justify-content: space-between;}

.left-section{ width: 430px; background-color: #fafafa; min-height: 1030px;}
.calendar-box{ width: 100%; padding: 40px 18px 10px; position: relative;}

.calendar-top{ width: 100%; position: relative;}
.calendar-top a{ position: absolute; bottom:5px;}
.calendar-top a.left{ left: 57px;}
.calendar-top a.right{ right: 57px;}
.calendar-tit{ font-size: 30px; line-height: 35px; font-weight: 400; color: #303030;  text-align: center; /*position: relative;*/}

.calendar-box table{ width: 100%; min-height: 330px; font-size: 16px; margin-top: 30px; position: relative; z-index: 0; table-layout: fixed;}
.calendar-box table thead th{ font-weight: 400; color: #707070; padding: 15px 0; }
.calendar-box table thead th:first-child{ color: #e90505;}
.calendar-box table thead th:last-child{ color: #1075ce;}
.calendar-box table tbody td{ color: #cbcbcb; padding: 15px 0; text-align: center; font-weight: 300; font-size:16px; line-height: 1.5em; position: relative;}
.calendar-box table tbody td a{ display: block;}
.calendar-box table tbody td.possible{ color: #292929; cursor: pointer;}
.calendar-box table tbody td.possible:first-child{ color: #e90505;}
.calendar-box table tbody td.possible:last-child{ color: #1075ce;}
.calendar-box table tbody td.choice, .calendar-box table tbody td.today{ font-weight: 400; color: #fff !important; cursor: pointer;}
.calendar-box table tbody td.today::after, .calendar-box table tbody td.choice::after{ content: ''; position: absolute; top:0; right:0; bottom:0; left:0; width: 100%; text-align: center; background-color: #006737; z-index: -1;}
.calendar-box table tbody td.possible .hover, .calendar-box table tbody td.today .hover, .calendar-box table tbody td.choice .hover{ position: absolute; font-size: 13px; background-color: #79bc3b; color: #fff; border-radius: 5px; line-height: 20px; width: 55px; left: 50%; bottom: -10px; transform: translateX(-50%); letter-spacing: -0.26px; z-index: 10; font-weight: 300; display: none;}

.calendar-box table tbody td.impossible::after{ content: ''; position: absolute; top:0; right:0; bottom:0; left:0; width: 100%; text-align: center; background-color: #efefef; z-index: -1;}

.calendar-box table tbody td.possible.holiday{color: #e90505 !important;}

.calendar-info{ margin: 32px; word-break: keep-all; color: #707070; font-size: 14px; font-weight: 300; line-height: 1.3em;}
.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: #006737; position: absolute; left: 0px; top:6px;}
.calendar-info p.dot-point::before{ background-color: #ffaa00;}

.right-section{ width: calc(100% - 455px); height: 100%;}

.tbl-sty02{ width: 100%; border-top:2px solid #006737; border-bottom:1px solid #cbcbcb; font-weight: 400; color: #363636;}
.tbl-sty02 th{ text-align: center; vertical-align: middle; background-color: #fafafa;  padding: 10px 0; font-weight: 500; position: relative; z-index: 0; background-clip: padding-box; height: 50px;}
.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 th:first-child::before{ display: none;}
.tbl-sty02 td{ line-height: 1.33em; text-align: center; vertical-align: middle; padding:10px 0; position: relative; height: 50px; font-weight: 300;}
.tbl-sty02 td::after{ content: ''; width: 1px; height: 25px; background-color: #cbcbcb; display: inline-block; position: absolute; right:0; top:50%; transform: translateY(-50%);}
.tbl-sty02 td:last-child::after{ display: none;}

.tab-reser-time{ width: 100%;}
.tab-reser-time ul{ width: 100%; display: flex; justify-content:space-between; align-items: center;}
.tab-reser-time li{ text-align: center; width: 24.7%; background-color: #efefef; line-height: 40px; color: #cbcbcb; border-radius: 8px 8px 0 0; transition: 0.3s all ease-in-out; cursor: pointer;}
.tab-reser-time li.on{ background-color: #006737; color: #fff;}

.tbl-overflow{ height: 770px; overflow-y: auto; border-bottom: 1px solid #cbcbcb;}
.tbl-overflow::-webkit-scrollbar {
    width: 2px;
}
.tbl-overflow::-webkit-scrollbar-thumb {
    height: 2%;
    background: #006737; 
    border-radius: 10px;
}
.tbl-overflow::-webkit-scrollbar-track {
    background: #ddd;
}

.tbl-reser{ width: 100%; font-size: 16px; font-weight: 400; color: #363636;}
.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: 500; position: relative;}
.tbl-reser td{ text-align: left; vertical-align: middle; padding:6px 15px; vertical-align: middle;}
.tbl-reser td a{ display: inline-block; position: relative; width: 100px; line-height: 25px; margin: 6px 10px; border:1px solid #cbcbcb; text-align: center; border-radius: 5px; transition: 0.2s all ease-in-out;}
.tbl-reser td a:hover{ background-color: #79bc3b; color: #fff;}
.tbl-reser td a .tag{ position: absolute; left: 50%; top:30px; background-color: #292929; color: #fff; font-size: 13px; padding: 0; letter-spacing: -0.26px; z-index: 5; border-radius: 5px; width: 120px; text-align: left; padding:3px  5px; height: 40px;  line-height: 1.3em; transform: translateX(-50%);}
.tbl-reser td a .tag::after{ 
    content: '';
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    z-index: -1;
    border-bottom: 12px solid;
    border-left: 8px solid rgba(0, 0, 0, 0);
    border-right: 8px solid rgba(0, 0, 0, 0);
    color: #292929;
    top:-10px;
}
.tbl-reser td a .tag.under{ top:auto; bottom: 30px;}
.tbl-reser td a .tag.under::after{ transform: rotate(-180deg); top:38px;}

/*reser-pop*/
.pop-reser{ position: fixed; /*top:50%; left:50%; transform: translate(-50%, -50%);*/}
.pop-reser{ width: 660px; margin: auto; padding: 30px; border: solid 1px #e2e2e2; background-color: #fff; max-height: 700px; z-index: 1200; border-radius: 20px; overflow-y: auto;}
.pop-reser .tbl-sty02 th{ z-index: -1;}
.pop-reser .tbl-sty01 thead th{ z-index: -1;}

.pop-wrap{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100vh;
    z-index: 100000;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pop-reser-text{ padding: 20px; word-break: keep-all; color: #707070; font-size: 14px; font-weight: 300; line-height: 1.3em; background-color: #fafafa; margin:20px 0;}
.pop-reser-text li{ padding-left: 10px; position: relative; margin-bottom: 10px;}
.pop-reser-text li::before{ content: ''; width: 5px; height: 5px; border-radius: 50%; background-color: #006737; position: absolute; left: 0px; top:6px;}

/*wait-reser*/
.tbl-reser.center td{ text-align: center;}
.tbl-reser.center a.btn-table-on{ display: block; width: 120px; margin: auto; line-height: 34px; border:1px solid #fff; color: #fff; font-weight: 300; background-color: #79bc3b; border-radius: 17px; box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.16);}

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

/*fee*/
.common-text-box{ padding: 30px 40px 20px 65px; word-break: keep-all; color: #707070; font-weight: 300; line-height: 1.3em; background-color: #fafafa; margin:20px 0;}
.common-text-box li{  position: relative; margin-bottom: 10px;}
.common-text-box li::before{ content: ''; width: 5px; height: 5px; border-radius: 50%; background-color: #006737; position: absolute; left: -15px; top:7px;}
.common-text-box li.pt-yellow::before{ background-color: #ffaa00;}
.common-text-box li.pt-red::before{ background-color: #e90505;}
.common-text-box li.pt-green::before{ background-color: #79bc3b;}
.common-text-box h2{ margin-left: -20px; font-size: 18px; color: #292929; font-weight: 500; padding-bottom: 14px;}

.btn-table-on{ display: block; width: 120px; margin: auto; line-height: 34px; border:1px solid #fff; color: #fff; font-weight: 300; background-color: #79bc3b; border-radius: 17px; box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.16); }
.btn-table-off{ display: block; width: 120px; margin: auto; line-height: 34px; border:1px solid #cbcbcb; color: #292929; font-weight: 300; background-color: #fff; border-radius: 17px; box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.16); }
.btn-table-check{ display: block; width: 120px; margin: auto; line-height: 34px; border:1px solid #cbcbcb; color: #fff; font-weight: 300; background-color: #292929; border-radius: 17px; box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.16); }

.tab-fee{ width: 100%; display: flex; justify-content:space-between; align-items: center;}
.tab-fee a{ text-align: center; width: 33.33%; background-color: #fff; line-height: 50px; color: #cbcbcb; border-radius: 8px 8px 0 0; transition: 0.3s all ease-in-out; cursor: pointer; font-size: 20px; border-bottom: 1px solid #cbcbcb;}
.tab-fee a.on{ background-color: #292929; color: #fff;  border-bottom: 1px solid #292929; letter-spacing: -0.36px;}

.con-reser{ margin-top: 65px; width: 100%;}
.common-text-box2{ padding: 30px 46px; word-break: keep-all; color: #707070; font-size: 16px; font-weight: 300; line-height: 1.5em; letter-spacing: -0.28px; background-color: #fafafa; margin:20px 0;}
.common-text-box2 h2{ font-size: 18px; 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: #79bc3b; display: block; position: absolute; left: 0; top: 11px;}
.common-text-box2 h2.bar span{ font-weight: 400; margin-left: 7px;}

.tab-fee-img{ width: 750px; text-align: center; margin:0 auto 50px;}
.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; flex:1; background-color: #efefef; line-height: 40px; color: #cbcbcb; border-radius: 8px 8px 0 0; transition: 0.3s all ease-in-out; cursor: pointer;}
.tab-fee-img li.on{ background-color: #79bc3b; color: #fff; }

#tabCon2,#tabCon3,#tabCon4,#tabCon5{ display: none;}

.tbl-sty03{ width: 100%; border-top:2px solid #006737; font-weight: 400; color: #363636;}
.tbl-sty03 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-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;}
.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;}

.guide-box{ width: 100%; line-height: 1.43em; letter-spacing: -0.28px; font-weight: 400; margin-bottom: 70px;}
.guide-box h2{ font-size: 24px; font-weight: 500; padding-bottom: 24px; }
.guide-box p{ color: #707070;}
.guide-box a{ display: inline-block; border-radius: 17px; box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.16);  border: solid 1px #fff; background-color: #79bc3b; text-align: center; width: 160px; line-height: 34px; color: #fff; letter-spacing: -0.8px; margin-top:20px;}
.guide-box a img{ vertical-align:baseline;}

.guide-division{ width: 100%; margin-top:40px;}
.guide-division ul{ display: flex; width: 100%; justify-content: space-between;}
.guide-division ul li{ width: 49.5%;}

/*use-guide*/
.use-box{ background-color: #fafafa; padding: 35px 60px; color: #707070;}
.use-box h2{ font-size: 18px; color: #292929; font-weight: 500; padding-bottom: 10px;}
.use-box h2.bar{ position: relative;}
.use-box h2.bar::before{ content: ''; width: 10px; height: 3px; background-color: #79bc3b; display: block; position: absolute; left: -20px; top: 8px;}
.use-box p{ padding-bottom: 30px; line-height:  1.5em; word-break: keep-all;}
.use-box em{ padding-bottom: 30px; line-height:  1.5em; word-break: keep-all; display: block}

/*join-board*/
.board-header{ display: flex; justify-content: flex-end; margin-bottom: 30px;}
.board-header .select-sty01{ height: 50px; border: solid 1px #cbcbcb; width: 120px; padding: 5px 20px;}
.board-header .search-box{ margin: 0 10px;}
.board-header .search-box input{ height: 50px; border: solid 1px #cbcbcb; width: 300px;}
.board-header button{ 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: 18px; height: 50px;}
.board-header button img{ vertical-align: top;}

.tbl-sty01.join{ table-layout: fixed;}
.progress{ display: inline-block; width: 70px; text-align: center; line-height: 34px; border-radius: 17px; box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.16); border: solid 1px #fff; background-color: #79bc3b; color: #fff;}
.deadline{ display: inline-block; width: 70px; text-align: center; line-height: 34px; 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: 60px; text-align: center; line-height: 34px; border-radius: 17px; box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.16); border: solid 1px #fff; background-color: #707070; color: #fff;}
.tbl-sty01.join a:hover{ text-decoration: underline;}
.tbl-sty01.join .title{ overflow: hidden; white-space: nowrap; text-overflow: ellipsis; padding: 10px;}

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

.board-join-con{ min-height: 160px; border-bottom: solid 1px #cbcbcb; padding: 40px 30px; line-height: 1.5em;}

.board-join-reply{ background-color: #fafafa; padding: 30px 46px; margin-bottom: 50px; position: relative;}
.reply-view{ margin-top: 20px; }
.reply-box{ margin-bottom: 10px;border-top:2px solid #006737;}
.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 15px; 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: 5px;}
.reply-box ul li.reply-info em{ display: inline-block; width: 1px; border-right: 1px solid #ccc; height: 20px; vertical-align: middle; margin:0 10px;}
.reply-box ul li .reply-con{ padding-bottom: 10px; line-height: 1.4em;}
.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: 15px; padding-bottom: 10px;}

.reply-write{ margin-top:20px; background-color: #fff; border: 1px solid #cbcbcb;}
.reply-write-con{ border-bottom: 1px solid #cbcbcb;}
.reply-write-con.none{ border-bottom: 0;}
.reply-write-con textarea{ width: 100%; min-height: 60px; border:0; line-height: 1.3em; font-size: 15px; resize: none; padding: 28px 20px;}
.reply-write-con textarea::placeholder{ font-size: 15px; color: #ababab; font-weight: 300;}
.register-info{ padding: 20px;}
.register-info em{ display: inline-block; width: 1px; border-right: 1px solid #ccc; height: 20px; vertical-align: middle; margin:0 10px;}

.register-info input[type=checkbox] {
    display:none;
}
.register-info input[type=checkbox] + label { 
    cursor: pointer; 
    background-repeat: no-repeat;
    background-image: url('/images/join/img_check_off.svg');
	background-size: 20px 20px;
    background-position: top 3px left;
	text-indent: 25px;
    padding: 5px 0;
    transition: 0.3s all;
    display: inline-block;
    margin-left: 5px;
}
.register-info input[type=checkbox]:checked + label {
    background-image: url('/images/join/img_check_on.svg');
	background-size: 20px 20px;
}

.radio-sty02{ font-size: 15px; font-weight: 400;}
.radio-sty02 input[type=radio] {
    display:none;
}
.radio-sty02 input[type=radio] + label { 
    background-repeat: no-repeat;
    background-image: url('/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('/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: 18px; display: inline-block; text-align: center; line-height: 50px;}

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

/*join-write*/
.tbl-sty02.join{ margin-bottom: 100px;}
.tbl-sty02.join tr{ border-bottom: 1px solid #cbcbcb;}
.tbl-sty02.join th{ height: 60px;}
.tbl-sty02.join th::after{ content: ''; height: 28px;}
.tbl-sty02.join td{ text-align: left; padding:10px 15px; height: 60px; }
.tbl-sty02.join td input{ height: 40px;}
.tbl-sty02.join td input::placeholder{ font-size: 16px; color: #ababab;}

.join-info input[type=checkbox] {
    display:none;
}
.join-info input[type=checkbox] + label { 
    cursor: pointer; 
    background-repeat: no-repeat;
    background-image: url('/images/join/img_check_off.svg');
	background-size: 20px 20px;
    background-position: top 6px left;
	text-indent: 25px;
    padding: 5px 0;
    transition: 0.3s all;
    display: inline-block;
    margin-left: 20px;
}
.join-info input[type=checkbox]:checked + label {
    background-image: url('/images/join/img_check_on.svg');
	background-size: 20px 20px;
}

.tbl-sty02.join .radio-sty02{ font-size: 16px;}
.tbl-sty02.join .radio-sty02 input[type=radio] + label { background-position: left top 4px;}
.tbl-sty02.join td .date{ padding: 8px 20px; position: relative; background-color: #fafafa; height: 40px;}
.tbl-sty02.join td .open-date{ position: absolute; top: 50px; left: 0; background-color: #fff; border:1px solid #ddd; z-index: 5; padding: 15px 8px 0; width: 350px;}

.tbl-sty02.join td .time{ display: flex; justify-content: space-between; align-items: center;}
.tbl-sty02.join td .time .select-sty02{ width: 49%; height: 40px; font-weight: 300;}

.open-date .calendar-top h2{ font-size: 20px;}
.s-calendar{ padding: 15px 8px;}
.s-calendar .calendar-top h2{ font-size: 20px;}
.s-calendar{ width: 96%; margin: 10px auto; position: relative; z-index: 0;}
.s-calendar thead th{ font-weight: 400; color: #707070; padding: 10px 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; padding: 8px !important; font-weight: 300; border:1px solid #cbcbcb;}
.s-calendar tbody td::after{ display: none;}
.s-calendar tbody td.choice{ font-weight: 400; color: #fff !important; background-color: #006737; cursor: pointer;}

.tbl-sty02.join textarea{ min-height: 200px; border:0; width: 100%; padding: 20px 0;}
.tbl-sty02.join textarea::placeholder{ color: #ababab;}

.agree-join{ margin: 20px 0 70px; text-align: center}
.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;}

/*mypage*/
.visit-header{ display: flex; justify-content: flex-end; margin-bottom: 30px;}
.visit-header button{ 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: 18px; height: 50px;}
.visit-header button img{ vertical-align: top;}

.select-day{ width: 430px; border:1px solid #cbcbcb; background-color: #fafafa; position: relative; margin-right: 12px;}
.select-day ul{display: flex; justify-content: space-between; align-items: center; height: 50px; font-size: 18px; font-weight: 400;}
.select-day ul li.click-day{ position: relative; width: 200px; text-align: center;}
.select-day ul li.click-day span{ cursor: pointer;}
.select-day ul li .open-day{ position: absolute; background-color: #fff; border:1px solid #ddd; z-index: 5; padding: 15px 8px 0; width: 350px; font-size: 16px;}
.select-day ul li .open-day.spot1{ top: 36px; left: -1px;}
.select-day ul li .open-day.spot2{ top: 36px; right: -2px;}
.select-day ul li .open-day .calendar-top h2{ font-size: 20px; line-height: 1.33em;}

/*board*/
.tbl-sty01.join .left img{ margin-right: 15px;}
.tbl-sty01.join .title img{ vertical-align: sub;}

.board-view{ width: 100%; font-weight: 400;}
.board-view-top{ width: 100%; background-color: #fafafa; border-top:2px solid #006737;}
.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;}
.board-view-top ul li.title{ width: 1040px; text-align: left; font-size: 16px; color: #363636; font-weight: 500; line-height: 1.5em;}
.board-view-top ul li.title span{ margin-right: 15px; font-weight: 300; font-size: 16px;}
.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;}

.select-file{ background-color: #fafafa; line-height: 40px;}

input[type=file]{ width: 100%;}
input[type=file]::file-selector-button{
    width: 120px;
    height: 34px;
    background: #fff;
    border: 1px solid #cbcbcb;
    border-radius: 17px;
    box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.16);
    cursor: pointer;
    margin-top:3px;
    margin-right: 10px;
}

/*gallery*/
.event-wrap{ width: 100%;}
.event-wrap ul{ display: flex; flex-wrap: wrap; justify-content: space-between;}
.event-wrap ul .event-box{ width: 570px; 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: 570px; height: 250px; overflow: hidden; position: relative;}
.event-wrap ul .event-box h1 img{ object-fit: cover; transition: 0.3s all ease-in-out;}
.event-wrap ul .event-box a:hover h1 img{ transform: scale(1.05);}

.event-wrap ul .event-box .event-info{ padding:10px 10px 20px 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: 18px; color: #363636; font-weight: 500;}
.event-wrap ul .event-box .event-info ul li p{ color: #292929; padding-top: 20px;}
.event-wrap ul .event-box .event-info ul span{ width: 54px; height: 54px; line-height: 54px; text-align: center; margin: 0 20px; background-color: #79bc3b; border-radius: 50%; box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16); border: solid 1px #fff; color: #fff;}

.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:hover h1 img{ transform:scale(1) !important;}
.event-box.finish a .event-info ul span{ background-color: #707070; border:1px solid #fff;}

/*group*/
.con-group{ margin-top: 0; width: 100%;}

.use-box h2 span{ font-weight: 400; margin-left: 7px;}

.tbl-sty05{ width: 100%; border-top:2px solid #292929; font-weight: 400; color: #292929; font-size: 16px; background-color: #fff; table-layout: fixed;}
.tbl-sty05 thead th{ text-align: center; vertical-align: middle; border:1px solid #cbcbcb; padding: 10px 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:10px 0; height: 50px; font-weight: 300;}

.con-group p{ position: relative; margin:0px 0 7px 25px;}
.con-group p::before{ content: ''; width: 5px; height: 5px; border-radius: 50%; background-color: #006737; position: absolute; left: -15px; top:11px;}

.btn-group{ width: 100%; text-align: center; margin: 50px 0; display: flex; justify-content: center;}
.btn-group a{ width: 480px; margin: 0 7px; display: flex; align-items: center; justify-content: center; background-color: #006737; font-size: 18px; color: #fff; line-height: 60px; border-radius: 30px; border:1px solid #fff; box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16); transition: 0.3s all ease-in-out}
.btn-group a::before{ content: ''; background: url(/Images/ic_download.svg) center center no-repeat; display: inline-block; width: 24px; height: 24px; margin-right: 8px; transition: 0.3s all ease-in-out}
.btn-group a:hover{ color: #ffaa00;}
.btn-group a:hover::before{ content: ''; background: url(/Images/ic_download_on.svg) center center no-repeat;}

.tbl-sty02.join td .time2 .select-sty02{ width: 25%; max-width: 120px; height: 40px; font-weight: 300;}
.tbl-sty02.join td.radio-sty02 span{ margin-right: 20px;}
.tbl-sty02.join td.left::before{ content: ''; width: 1px; height: 28px; background-color: #cbcbcb; display: inline-block; position: absolute; left:0; top:50%; transform: translateY(-50%);}
.con-group .tbl-sty02.join{ margin-bottom: 0px;}

.common-text-box2 li{  position: relative; margin-bottom: 10px;}
.common-text-box2 li::before{ content: ''; width: 5px; height: 5px; border-radius: 50%; background-color: #006737; position: absolute; left: -15px; top:9px;}
.common-text-box2 li.pt-yellow::before{ background-color: #ffaa00;}
.common-text-box2 li.pt-red::before{ background-color: #e90505;}
.common-text-box2 li.pt-green::before{ background-color: #79bc3b;}
.common-text-box2 textarea{ width: 100%; display: block; resize: none; border:1px solid #cbcbcb; height: 115px; padding: 28px 20px 0;}
.common-text-box2 textarea::placeholder{ font-size: 15px; color: #ababab;}

.group ul{ display: flex; justify-content: space-around; height: 183px; align-items: center; flex-direction: column; }
.group li:last-child{ margin-bottom: 0px;}
.group input{ height: 40px; text-indent: 10px; width: 88%; font-size: 16px;}
.group input::placeholder{ font-size: 16px;}
.group .radio-sty01{ font-size: 16px;}
.group .radio-sty01 input[type=radio] + label{ background-position: left center;}

/*members*/
.con-member{ margin-top: 0; width: 100%;}

.common-text-box3{ padding: 30px 40px 20px 65px; word-break: keep-all; color: #707070; font-weight: 300; line-height: 1.3em; background-color: #fafafa; margin:20px 0;}
.common-text-box3 h2{ font-size: 18px; color: #292929; font-weight: 500; padding-bottom: 12px;}
.common-text-box3 h2.bar{ position: relative;}
.common-text-box3 h2.bar::before{ content: ''; width: 10px; height: 3px; background-color: #79bc3b; display: block; position: absolute; left: -20px; top: 11px;}
.common-text-box3 li{  position: relative; margin-bottom: 10px; padding-left: 15px; line-height: 1.5em;}
.common-text-box3 li::before{ content: ''; width: 5px; height: 5px; border-radius: 50%; background-color: #006737; position: absolute; left: 0px; top:10px;}
.common-text-box3 li.pt-yellow::before{ background-color: #ffaa00;}
.common-text-box3 li.pt-red::before{ background-color: #e90505;}
.common-text-box3 li.pt-green::before{ background-color: #79bc3b;}
.common-text-box3 p{ line-height: 1.5em;}

.btn-cancel{ border-radius: 17px; box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.16); border: solid 1px #cbcbcb; background-color: #fff; width: 100px; line-height: 34px; display: inline-block; margin: 0 5px;}

.links{ display: inline-block; margin-left: 5px;}
.links a{ display:flex; overflow: hidden; align-items: center;}
.links a span.text{ opacity: 0;  width: 0; transition: 0.3s all ease-in-out; display: inline-block; text-indent: -80px; vertical-align: middle; text-transform: uppercase; font-size: 14px; color: #292929; font-weight: 300;}
.links:hover a span.text{ transform: translateX(0%); opacity: 1;  width: 80px;  text-indent: 0px;}
.links a .m-plus{width: 23px; height: 23px; background: url(/Images/ic_plus.svg) center center no-repeat; background-size: 23px 23px; transition: 1s all cubic-bezier(0.17, 0.97, 0.38, 1);}
.links:hover a .m-plus{ background: url(/Images/ic_plus_on.svg) center center no-repeat; background-size: 23px 23px; }

/*club*/
.greeting-wrap{ position: relative; width: 1155px; margin: auto; min-height: 700px; margin-top:45px}
.greeting-bg{ background-color: #ececec; position: absolute; top:134px; left: 0; width: 100%; height: 448px; transform: translateX(-100%);}
.greeting-top{ width: 100%; position: relative; height: 448px;}
.greeting-title{ color: #292929; position: absolute; top:138px; left: 0; opacity: 0; transform: translateY(100px);}
.greeting-title h4{ font-family: var(--font-en); text-transform: uppercase; font-weight: 400; font-size: 20px;}
.greeting-title h1{ margin-top: 10px; font-size: 50px; line-height: 1.3em; letter-spacing: -1.25px;  font-weight: 300;}
.greeting-title h1 span{ font-weight: 600; color: #006737; }
.greeting-ceo{ position: absolute; right:0; top:0; opacity: 0;}

.greeting-box{ width: 100%; margin-top: 50px;}
.greeting-box ul{ width: 100%; display: flex; justify-content: space-between; align-items: flex-start;}
.greeting-box ul li{ width: 560px; font-size: 18px; line-height: 1.67em; letter-spacing: -0.36px; white-space: pre-line; color: #707070; font-weight: 400; word-break: keep-all; }
.greeting-box p{ text-align: right; font-size: 18px; margin-top:56px; }
.greeting-box p span{ font-family: 'InkLipquid'; font-size: 56px; padding-left: 10px;}


.club-wrap{ position: relative; width: 1155px; margin: auto; min-height: 700px;}
.club-top{ position: relative; padding-top:120px;}
.club-en{ font-size: 60px; color: #cbcbcb; font-family: var(--font-en); font-weight: 300; text-transform: uppercase; opacity: 0;}
.club-top-box{ max-width: 408px;}
.club-img {
    background-image: url(/Images/img_club_01.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50% 0%;
    min-width: 408px;
    opacity: 0;
}
.club-img > .inner-img{
    padding-top: 285px;
    padding-bottom: 285px;
}
.club-img2 {
    position: absolute;
    right:0;
    top:0;
    background-image: url(/Images/img_club_02.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50% 0%;
    min-width: 362px;
    opacity: 0;
}
.club-img2 > .inner-img{
    padding-top: 182px;
    padding-bottom: 182px;
}
.club-title{ color: #292929; position: absolute; top:278px; left: 428px; transform: translateY(100px); opacity: 0;}
.club-title h4{ font-family: var(--font-en); text-transform: uppercase; font-weight: 400; font-size: 20px;}
.club-title h1{ margin-top: 10px; font-size: 50px; line-height: 1.3em; letter-spacing: -1.25px;  font-weight: 300;}
.club-title h1 span{ font-weight: 600; color: #006737; }
.club-title p{ font-size: 18px; line-height: 1.67em; letter-spacing: -0.36px; color: #707070; margin-top:35px;}

.club-wrap2{ position: relative; margin-top:192px; min-height: 700px;}
.club-bg{ position: absolute; left: 0; top:0;}

.club-visual{ position: relative; width: 1155px; margin: auto;}
.club-visual .club-en{ text-align: right;}

.club-position{ width: 100%; height: 350px; }
.club-img3 {
    background-image: url(/Images/img_club_03.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50% 0%;
    position: absolute; left:50%; top:66px; transform: translateX(-70%); width: 100%; min-width: 1920px;
}
.club-img3 > .inner-img{
    padding-top: 175px;
    padding-bottom: 175px;
}

.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: #006737; }
.club-title2 p{ font-size: 18px; line-height: 1.67em; letter-spacing: -0.36px; color: #707070; margin-top:35px;}

.facil-wrap{ width: 1155px; margin: auto; position: relative;}
.facil-img{ width: 100%; position: relative;}
.facil-img ul{ width: 100%; display: flex; justify-content: space-between; align-items: center;}
.facil-img img{ opacity: 0;}
.facil-img .bg{ width: 900px; height: 30px; background-color: #fff; border-radius: 8px 8px 0 0; position: absolute; bottom:0; left: 50%; transform: translateX(-50%);}

.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: 20px;}
.facil-title h1{ margin-top: 10px; font-size: 50px; line-height: 1.3em; letter-spacing: -1.25px;  font-weight: 300;}
.facil-title h1 span{ font-weight: 600; color: #006737; }
.facil-title p{ font-size: 18px; line-height: 1.67em; letter-spacing: -0.36px; color: #707070; margin-top:35px;}

.menu-img-box{ width: 100%; margin-top: 118px; margin-bottom: 140px;}
.menu-img-box .menu{ opacity: 0; position: relative;}
.menu-img-box .menu .inner-menu{ position: absolute; display: flex; justify-content: center; align-items: center; top:0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.6); color: #fff; text-align: center; letter-spacing: -0.32px; line-height: 1.5em; transition: 0.3s all ease; opacity: 0;}
.menu-img-box .menu .inner-menu.show{  opacity: 1;}
.menu-img-box ul{ display: flex; flex-wrap: nowrap;}
.menu-img-box li{ flex-basis:240px; flex-shrink: 0; display: flex; align-items:flex-end; justify-content: flex-end;}
.menu-img-box ul:first-child li:first-child{ flex-basis:195px; flex: 1; }
.menu-img-box li img{ object-fit: cover; width: 100%;}
.menu-img-box li.facil-en{ flex:2; text-align: right; font-size: 60px; font-family: var(--font-en); color: #cbcbcb; text-transform: uppercase; padding-right: 3px;}

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

/*photo*/
.photo-con{ width:938px; height: 625px; overflow: hidden; margin: auto;}
.photo img{ width: 100%;  transform: scale(1.1); object-fit: cover; transition: 3s all ease-in-out;}
.photo .swiper-slide-active img{ transform: scale(1);}
.photo .photo-next, .photo .photo-prev{ position: absolute; top:50%; z-index: 10; transform: translateY(-50%); cursor: pointer;}
.photo .photo-next img, .photo .photo-prev img{ width: 20px;}
.photo .photo-next{ right: 10px;}
.photo .photo-prev{ left: 10px;}

.thum-photo{ width: 550px; margin: auto; position: absolute; top:-90px;}
.thum-photo img{width: 101px; object-fit: cover; height: 67px;}
.thum-photo .swiper-slide-thumb-active img{ outline: 2px solid #fff; outline-offset: -2px; }

/*course*/
.tbl-sty04{ width: 100%; border-top:2px solid #006737; border-bottom:1px solid #cbcbcb; font-weight: 400; color: #363636;}
.tbl-sty04 th{ text-align: center; vertical-align: middle; background-color: #fafafa;  padding: 10px 0; font-weight: 500; position: relative; z-index: 0; background-clip: padding-box; height: 50px; border-bottom:1px solid #cbcbcb;}
.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 th:first-child::before{ display: none;}
.tbl-sty04 th.last::after{ content: ''; width: 1px; height: 25px; background-color: #cbcbcb; display: inline-block; position: absolute; right:0; top:50%; transform: translateY(-50%);}
.tbl-sty04 td{line-height: 1.33em; text-align: center; vertical-align: middle; padding:10px 0; position: relative; font-weight: 300; border-bottom:1px solid #cbcbcb;}
.tbl-sty04 td:last-child::after{ display: none;}

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

.hole-tab{ width: 100%; margin-top:20px; margin-bottom: 63px;}
.hole-tab ul{ display: flex; justify-content: center; align-items: center; }
.hole-tab ul li{ flex-grow: 9; text-align: center; color: #cbcbcb; cursor: pointer; font-weight: 500; height: 70px; transition: 0.3s all ease-in-out; padding-top:5px; border-bottom: 2px solid #fff;}
.hole-tab ul li:hover{ background-color: #f5f5f5; color: #292929;}
.hole-tab ul li span{ font-size: 14px; font-family: var(--font-en);}
.hole-tab ul li p{ font-size: 25px; padding-top: 5px; font-weight: 400;}
.hole-tab ul li.on{ color: #292929; border-bottom: 2px solid #006737;}
.hole-tab ul li.on:hover{ background-color: transparent; }

.hole-con{ padding: 10px 42px 100px; min-height: 700px;  display: flex; align-items: flex-start; justify-content: space-between; opacity: 0; transition: 0.3s all ease-in-out;}
.hole-info-box{ width: 658px;}
.hole-num{ width: 100%; display: flex; align-items: flex-end;}
.hole-num h2 b{ font-size: 50px; font-weight: 400;}
.hole-num h2 span{ font-family: var(--font-en); font-size: 20px; padding-left: 7px;}
.hole-num h3{ padding-left: 30px; text-transform: uppercase; font-size: 20px; font-weight: 400;}
.hole-num h3 span{ font-size: 14px; 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;}
.hole-info em{ padding-right: 20px; font-size: 18px; line-height: 50px; }
.hole-info em span{ border: 2px solid #363636; width: 18px; height: 18px; border-radius: 50%; display: inline-block; vertical-align: middle; margin-top:-4px; margin-right: 5px;}
.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: 18px; color: #707070; line-height: 1.5em; font-weight: 400; letter-spacing: -0.36px; height: 200px;}
.course-movie{ width: 100%;}
.course-movie video{ width: 100%;}

.hole-img{ padding-top:25px;}

.opacity{ animation:opacity 1s cubic-bezier(.25,.46,.45,.94) both;}
@keyframes opacity {
  0% {
    opacity: 0;
    /*transform: translateY(100px);*/
  }
  100% {
    opacity: 1;
    /*transform: translateY(0px);*/
  }
}

/*231206-add*/
.group-box{ 
    border: 1px solid #79bc3b;
    padding: 30px 46px;
    margin-bottom: 30px;
    line-height: 1.5em;
    word-break: keep-all;
}

/*231215-add*/
.caption{
    line-height: 1.8em;
    padding: 0 20px;
    text-align: left;
    word-break: keep-all;
    letter-spacing: -0.5px;
    font-weight: 500;
}

/*240105-add*/
.reser-step-wrap{
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-top: 25px;
}
.reser-step-wrap dl dt{
    position: relative;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: -0.3px;
    vertical-align: bottom;
    margin-bottom: 10px;
    color: #292929;
}
.reser-step-wrap dl dt span{
    display: inline-block;
    width: 30px;
    line-height: 30px;
    background-color: #006737;
    color: #fff;
    text-align: center;
    font-size: 18px;
    border-radius: 50%;
    margin-right: 10px;
    vertical-align: bottom;
}

/*240116-add*/
.s-voucher{
    /*width: 100%;*/
    border: 1px solid #79bc3b;
    display: inline-block;
    padding: 15px;    
    margin-bottom: 30px;
}
.s-voucher h2{ 
    text-align: center;
    display: inline-block;
    min-width: 380px;
    line-height: 45px;
    text-align: center;
    background-color: #292929;
    color: #fff;
    font-size: 18px;
    letter-spacing: -0.36px;
    border-radius: 25px;
    padding-bottom: 0;
}
.s-voucher ul{
    margin: 15px 0 0 0;
    display: flex;
    justify-content: flex-start;
}
.s-voucher ul li{
    width: 450px;
    margin-bottom: 0;
}
.s-voucher ul li::before{
    content: none;
}
.s-voucher ul li p{
    line-height: 2.5em;
    color: #707070;
    font-weight: 500;
}
.s-voucher ul li p span{
    color: #79bc3b;
    font-weight: 700;
    margin-right: 10px;
}
.pointer{
    cursor:pointer;
}
.s-text{
    font-weight: 600;
    line-height: 2em;
    font-size: 17px;
    padding: 10px 0;
    color: #333;
}



/* 조인예약 추가 250904 */ 
/* 조인게시판 캘린더 */
.JoinCalendar-subText {
  width: 100%;
  padding: 12px 0;
  margin-top: 10px;
}

.JoinCalendar-subText p {
  font-size: 18px;
  font-weight: 400;
  text-align: center;
  color: #666;
}

.calendar-wrap.join-calendar {
    display: block;
}

.calendar-wrap.join-calendar .calendar-box {
    background: #fafafa;
}

.calendar-wrap.join-calendar .calendar-top {
    position: relative;
}

.calendar-wrap.join-calendar .calendar-top span {
    position: absolute;
    top: 90%;
    transform: translateY(-50%);
    font-size: 20px;
    font-weight: 700;
    cursor: pointer;
}

.calendar-wrap.join-calendar .calendar-top span.prev {
    left: 420px;
}

.calendar-wrap.join-calendar .calendar-top span.next {
    right: 420px;
}

.calendar-wrap.join-calendar .calendar-box table {
    min-height: unset;
}

.calendar-wrap.join-calendar .calendar-box table tbody tr td {
    color: #292929;
    padding: 0;
    font-weight: 400;
    height: 95px;
}

.calendar-wrap.join-calendar .calendar-box table tbody tr td:first-child {
    color: #e90505;
}

.calendar-wrap.join-calendar .calendar-box table tbody tr td:last-child {
    color: #1075ce;
}

.calendar-wrap.join-calendar .calendar-box table tbody tr td a {
    padding: 5px 0;
    display: block;
}

.calendar-wrap.join-calendar .calendar-box table tbody tr td.close {
    color: #cbcbcb;
}

.calendar-wrap.join-calendar .calendar-box table tbody tr td .join-status {
    display: flex;
    flex-direction: column;
    margin-top: 5px;
}

.calendar-wrap.join-calendar .calendar-box table tbody tr td .join-status span {
    font-size: 13px;
    color: #b1b0af;
    font-weight: 500;
    display: block;
    line-height: 18px;
}

.calendar-wrap.join-calendar .calendar-box table tbody tr td .joinlink li {
  font-size: 14px;
}

.calendar-wrap.join-calendar .calendar-box table tbody td.today::after, .calendar-wrap.join-calendar .calendar-box table tbody td.choice::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 80px;
    margin: 0 auto;
    text-align: center;
    background-color: #006737;
    z-index: -1;
}

/* // join-calendar */

/* join popup */
.pop-reser-join {
    width: 660px;
    margin: auto;
    padding: 47px 40px 30px;
    border: solid 1px #e2e2e2;
    background-color: #fff;
    z-index: 1200;
    border-radius: 20px;
    max-height: 860px;
    min-height: 550px;
}

.pop-reser-join .join-sub-tit {
    color: #666;
    font-size: 14px;
    display: block;
    margin-top: 15px;
    text-align: center;
    font-weight: 500;
}

.pop-reser-join .join-list-wrap {
    display: flex;
    flex-direction: column;
    gap: 8px 0;
    height: 500px;
    margin: 40px 0;
    overflow: auto;
}

.pop-reser-join .join-list-wrap .join-list {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 22px 27px;
    background: #F9F9F9;
    border-radius: 0px 16px;
}

.pop-reser-join .join-list-wrap .join-list .list01 {
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  align-items: flex-start;
  gap: 8px 0;
  min-height: 84px;
  width: 60%;
}

.pop-reser-join .join-list-wrap .join-list .list01 li.time span {
  border-radius: 4px;
  padding: 5px;
  color: #FFF;
  font-size: 12px;
  font-weight: 500;
  display: inline-block;
}

.pop-reser-join .join-list-wrap .join-list .list01 li.time span.complete {
  background: #ccc;
}

.pop-reser-join .join-list-wrap .join-list .list01 li.time span.join {
  background: #007167;
}

.pop-reser-join .join-list-wrap .join-list .list01 li.time b {
  font-size: 16px;
  font-weight: 700;
  margin-left: 8px;
}

.pop-reser-join .join-list-wrap .join-list .list01 li.state {
  font-size: 16px;
  font-weight: 700;
}

.pop-reser-join .join-list-wrap .join-list .list01 li.state span {
  position: relative;
  margin-right: 20px;
  display: inline-block;
}

.pop-reser-join .join-list-wrap .join-list .list01 li.state span:not(:last-child)::after {
  content: "";
  position: absolute;
  right: -10px;
  top: 50%;
  transform: translateY(-50%);
  background: #aaa;
  width: 1px;
  height: 9px;
}

.pop-reser-join .join-list-wrap .join-list .list01 li.state span b {
  color: #F89D33;
  display: inline-block;
  margin-left: 5px;
  font-weight: 400;
}

.pop-reser-join .join-list-wrap .join-list .list01 li.price {
    color: #007167;
    font-weight: 700;
    font-size: 16px;
}

.pop-reser-join .join-list-wrap .join-list .list02 {
  width: 40%;
  min-height: 84px;
}

.pop-reser-join .join-list-wrap .join-list .list02 a {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 100%;
  height: 100%;
  min-height: 84px;
}

.pop-reser-join .join-list-wrap .join-list .list02 ul {
  display: flex;
  position: relative;
  justify-content: center;
}

.pop-reser-join .join-list-wrap .join-list .list02 ul li.icon {
  width: 32px;
  height: 32px;
  margin-top: 10px;
  border-radius: 100%;
  border: 1px solid #fff;
  overflow: hidden;
  background-size: 100%;
}

.pop-reser-join .join-list-wrap .join-list .list02 ul li.icon.women {
  background: url('/images/user_women.svg') no-repeat center center / cover;
}

.pop-reser-join .join-list-wrap .join-list .list02 ul li.icon.men {
  background: url('/images/user_men.svg') no-repeat center center / cover;
}

.pop-reser-join .join-list-wrap .join-list .list02 ul li.icon.add {
  background: url('/images/user_add.svg') no-repeat center center / cover;
}


.pop-reser-join .join-list-wrap .join-list .list02 ul li.icon.user1_men {
  background: url('/images/user1_men.svg') no-repeat center center / cover;
}
.pop-reser-join .join-list-wrap .join-list .list02 ul li.icon.user1_women {
  background: url('/images/user1_women.svg') no-repeat center center / cover;
}
.pop-reser-join .join-list-wrap .join-list .list02 ul li.icon.user2_men {
  background: url('/images/user2_men.svg') no-repeat center center / cover;
}
.pop-reser-join .join-list-wrap .join-list .list02 ul li.icon.user2_women {
  background: url('/images/user2_women.svg') no-repeat center center / cover;
}
.pop-reser-join .join-list-wrap .join-list .list02 ul li.icon.user3_men {
  background: url('/images/user3_men.svg') no-repeat center center / cover;
}
.pop-reser-join .join-list-wrap .join-list .list02 ul li.icon.user3_women {
  background: url('/images/user3_women.svg') no-repeat center center / cover;
}
.pop-reser-join .join-list-wrap .join-list .list02 ul li.icon.user4_men {
  background: url('/images/user4_men.svg') no-repeat center center / cover;
}
.pop-reser-join .join-list-wrap .join-list .list02 ul li.icon.user4_women {
  background: url('/images/user4_women.svg') no-repeat center center / cover;
}

.pop-reser-join .join-list-wrap .join-list .list02 ul li.icon:nth-of-type(2) {
  z-index: 1;
  margin-left: -7px;
}

.pop-reser-join .join-list-wrap .join-list .list02 ul li.icon:nth-of-type(3) {
  z-index: 1;
  margin-left: -7px;
}

.pop-reser-join .join-list-wrap .join-list .list02 ul li.icon:nth-of-type(4) {
  z-index: 1;
  margin-left: -6px;
}

.pop-reser-join .join-list-wrap .join-list .list02 .btn-join-reser {
  font-size: 14px;
  color: #FFF;
  text-align: center;
  display: block;
  padding: 5px 0;
  width: 100%;
  max-width: 120px;
  margin: 0 auto;
  background: #ccc;
}

.pop-reser-join .join-list-wrap .join-list .list02 .btn-join-reser.on {
  background: #F89D33;
}

/* // join-popup */

/* join-form */
.join-reser-form {
  margin-top: 50px;
}

.join-reser-form table {
    width: 100%;
    table-layout: fixed;
    border-top: 1px solid #006737;
}

.join-reser-form table tbody tr th {
  padding: 24px;
  text-align: center;
  background: #FAFAFA;
  font-size: 18px;
  font-weight: 500;
    vertical-align: middle;
    border-bottom: 1px solid #cbcbcb;
}

.join-reser-form table tbody tr td {
  padding: 24px;
  text-align: left;
  font-size: 16px;
  vertical-align: middle;
  border-bottom: 1px solid #cbcbcb;
}

.join-reser-form table tbody tr td select {
    width: 100%;
    height: 40px;
    font-size: 16px;
    background-position: top 15px right 10px;
    text-indent: 15px;
}

.join-reser-form table tbody tr td input::placeholder {
    font-size: 16px;
    font-weight: 400;
}

.join-reser-form table tbody tr th.bdr1 {
  border-right: 1px solid #ccc;
}

.join-reser-form table tbody tr td div.col {
  display: flex;
  flex-direction: column;
  gap: 10px 0;
}

.join-reser-form table tbody tr td div.col span {
  font-weight: 400;
  font-size: 14px;
}

.join-reser-form table tbody tr td textarea {
  background: #fafafa;
  font-size: 14px;
  padding: 14px;
  text-align: left;
  width: 100%;
  height: 100px;
  border: 0;
}

.join-reser-form table tbody tr td textarea::placeholder {
    font-size: 16px;
    font-weight: 400;
    color: #ABABAB;
}

.join-reser-form table tbody tr td div.time-select {
  display: flex;
  gap: 0 10px;
  align-items: center;
}

.join-reser-form table tbody tr td div.time-select span {
  font-weight: 400;
  display: inline-block;
}

.join-reser-form table tbody tr td div.time-select select {
  width: calc((100% - 10px)/2);
}

.join-reser-form table tbody tr td a.joinApply-btn {
  color: #fff;
  font-size: 14px;
  display: block;
  background: #F89D33;
  width: 100%;
  padding: 8px 0;
  text-align: center;
  width: 100%;
  margin-top: 10px;
}

.join-reser-form table tbody tr td a.joinApply-btn:hover {
  border-bottom: 1px solid #F89D33;
}

.join-reser-form .btn-apply {
  margin-top: 50px;
  display: flex;
  justify-content: center;
}

.join-reser-form .btn-apply a {
  text-align: center;
  border: 1px solid #fff;
  padding: 18px 0;
  width: 197px;
  display: block;
  font-size: 20px;
  color: #fff;
  background: #006737;
  border-radius: 30px;
  box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
}

/* // join-form */

/* 조인예약 확인 */
.joinListChk-wrap {
  margin-top: 30px;
}

.joinListChk-wrap .joinListChk-top {
  padding: 15px 0;
  width: 100%;
  border: 1px solid #CCC;
  background: #F4F4F4;
  margin-bottom: 15px;
}

.joinListChk-wrap .joinListChk-top p {
  font-size: 16px;
  text-align: center;
  font-weight: 400;
}

.joinListChk-wrap .joinListChk-top p b {
  font-weight: 500;
  color: #5670C0;
  display: inline-block;
  margin-right: 5px;
}

.joinListChk-wrap .joinListChk-content .joinListChk-content-box {
  border-top: 1px solid #ccc;
  padding: 10px 0;
}

.joinListChk-wrap .joinListChk-content .joinListChk-content-box ul {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.joinListChk-wrap .joinListChk-content .joinListChk-content-box ul li {
  font-size: 16px;
  line-height: 35px;
  font-weight: 400;
}

.joinListChk-wrap .joinListChk-content .joinListChk-content-box ul li.red {
  color: #F00;
}

.joinListChk-wrap .joinListChk-content .joinListChk-team {
  display: flex;
  gap: 0 3px;
}

.joinListChk-wrap .joinListChk-content .joinListChk-team .joinListChk-team-list {
  width: 200px;
}

.joinListChk-wrap .joinListChk-content .joinListChk-team .joinListChk-team-list a {
  background: #F4F4F4;
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  gap: 10px 0;
  padding: 16px 18px 10px 18px;
  width: 100%;
  height: 100%;
}

.joinListChk-wrap .joinListChk-content .joinListChk-team .joinListChk-team-list h3 {
  font-size: 14px;
  font-weight: 700;
  margin-top: 0;
}

.joinListChk-wrap .joinListChk-content .joinListChk-team .joinListChk-team-list ul {
  display: flex;
  align-items: center;
  gap: 0 3px;
  justify-content: center;
}

.joinListChk-wrap .joinListChk-content .joinListChk-team .joinListChk-team-list ul li.icon {
  width: 32px;
  height: 32px;
  border-radius: 100%;
  overflow: hidden;
  background-size: 100%;
}

.joinListChk-wrap .joinListChk-content .joinListChk-team .joinListChk-team-list ul li.icon.women {
  background: url('/images/user_women.svg') no-repeat center center / cover;
}

.joinListChk-wrap .joinListChk-content .joinListChk-team .joinListChk-team-list ul li.icon.men {
  background: url('/images/user_men.svg') no-repeat center center / cover;
}

.joinListChk-wrap .joinListChk-content .joinListChk-team .joinListChk-team-list ul li.icon.add {
  background: url('/images/user_add.svg') no-repeat center center / cover;
}

.joinListChk-wrap .joinListChk-content .joinListChk-team .joinListChk-team-list ul li.icon.user1_men {
  background: url('/images/user1_men.svg') no-repeat center center / cover;
}
.joinListChk-wrap .joinListChk-content .joinListChk-team .joinListChk-team-list ul li.icon.user1_women {
  background: url('/images/user1_women.svg') no-repeat center center / cover;
}
.joinListChk-wrap .joinListChk-content .joinListChk-team .joinListChk-team-list ul li.icon.user2_men {
  background: url('/images/user2_men.svg') no-repeat center center / cover;
}
.joinListChk-wrap .joinListChk-content .joinListChk-team .joinListChk-team-list ul li.icon.user2_women {
  background: url('/images/user2_women.svg') no-repeat center center / cover;
}
.joinListChk-wrap .joinListChk-content .joinListChk-team .joinListChk-team-list ul li.icon.user3_men {
  background: url('/images/user3_men.svg') no-repeat center center / cover;
}
.joinListChk-wrap .joinListChk-content .joinListChk-team .joinListChk-team-list ul li.icon.user3_women {
  background: url('/images/user3_women.svg') no-repeat center center / cover;
}
.joinListChk-wrap .joinListChk-content .joinListChk-team .joinListChk-team-list ul li.icon.user4_men {
  background: url('/images/user4_men.svg') no-repeat center center / cover;
}
.joinListChk-wrap .joinListChk-content .joinListChk-team .joinListChk-team-list ul li.icon.user4_women {
  background: url('/images/user4_women.svg') no-repeat center center / cover;
}

.joinListChk-wrap .joinListChk-content .joinListChk-team .joinListChk-team-list span {
  font-size: 14px;
  font-weight: 700;
}

.joinListChk-wrap .joinListChk-content .joinListChk-team .joinListChk-team-list span.join {
  color: #fff;
  border-radius: 4px;
background: #0042EA;
display: block;
padding: 5px;
text-align: center;
}

.joinListChk-wrap .joinListChk-content .joinListChk-team .joinListChk-team-list span.join b {
  color: #fff;
}

.joinListChk-wrap .joinListChk-content .joinListChk-team .joinListChk-team-list span.complete {
  color: #000;
}

.joinListChk-wrap .joinListChk-content .joinListChk-team .joinListChk-team-list span.complete b {
  color: #f00;
}

.joinListChk-wrap .joinListChk-content .joinListChk-team .joinListChk-team-list span b {
  color: #333;
  font-size: 12px;
  font-weight: 400;
}

.joinListChk-wrap .joinListChk-content .joinListChk-team .joinListChk-team-info {
  background: #F4F4F4;
  padding: 16px 20px 10px 20px;
  width: calc(100% - 203px);
}

.joinListChk-wrap .joinListChk-content .joinListChk-team .joinListChk-team-info h3 {
  color: #f00;
  font-size: 14px;
  font-weight: 700;
  text-align: left;
  margin-top: 0;
}

.joinListChk-wrap .joinListChk-content .joinListChk-team .joinListChk-team-info ul {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.joinListChk-wrap .joinListChk-content .joinListChk-team .joinListChk-team-info ul li {
  color: #000;
  font-size: 14px;
  line-height: 21px;
  text-align: left;
}

.joinListChk-wrap .joinListChk-content .joinListChk-team .joinListChk-team-info ul li span.red {
  color: #f00;
}

.joinListChk-wrap .joinListChk-content .joinListChk-content-box .joinListChk-info-box ul {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.joinListChk-wrap .joinListChk-content .joinListChk-content-box .joinListChk-info-box ul li {
  font-size: 14px;
  line-height: 21px;
  text-align: left;
}

.joinListChk-wrap .joinListChk-content .joinListChk-content-box .joinListChk-info-box ul li span.red {
  color: #f00;
}

.joinListChk-wrap .joinListChk-content .joinListChk-content-box-btm {
  margin-top: 35px;
}

.joinListChk-wrap .joinListChk-content .joinListChk-content-box-btm h3 {
  font-size: 18px;
  font-weight: 700;
  text-align: center;
}

.joinListChk-wrap .joinListChk-content .joinListChk-content-box-button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0 10px;
  margin: 35px 0;
}

.joinListChk-wrap .joinListChk-content .joinListChk-content-box-button a {
  color: #fff;
  background: #C2C2C2;
    box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
  font-size: 18px;
  font-weight: 700;
  width: 197px;
  display: block;
  padding: 18px 0;
  border-radius: 30px;
  text-align: center;
}

.joinListChk-wrap .joinListChk-content .joinListChk-content-box-button a.on {
  background: #006737;
}

/* 조인예약 확인 팝업 */
.joinListChk-popup {
    width: 660px; 
    margin: auto;
    padding: 35px 15px;
    border: solid 1px #e2e2e2;
    background-color: #fff;
    z-index: 1200;
    border-radius: 20px;
    max-height: 860px;
    min-height: 550px;
}

.joinListChk-popup .popup-body {
  overflow: auto;
  overflow-x: hidden;
  height: 390px;
  padding-top: 20px;
  width: 90%;
  margin: 0 auto;
}

.joinListChk-popup .popup-body .input-table01 {
  border-top: 1px solid #ccc;
  margin-bottom: 20px;
}

.joinListChk-popup .popup-body table {
    width: 100%;
    table-layout: fixed;
}

.joinListChk-popup .popup-body table tbody tr th {
  padding: 15px;
  font-size: 14px;
  text-align: left;
  background: #FAFAFA;
  font-weight: 500;
    vertical-align: middle;
border-bottom: 1px solid #cbcbcb;
}

.joinListChk-popup .popup-body table tbody tr td {
  padding: 10px 15px;
  text-align: left;
  font-size: 14px;
  vertical-align: middle;
  border-bottom: 1px solid #cbcbcb;
}

.joinListChk-popup .popup-body table tbody tr td input::placeholder {
    font-size: 14px;
    font-weight: 400;
}

.joinListChk-popup .popup-body table tbody tr td input {
background: #fafafa;
  width: 100%;
  height: 40px;
  text-align: left;
  font-size: 14px;
}

.joinListChk-popup .popup-body table tbody tr td input.wp58 {
  width: 58%;
}

.joinListChk-popup .popup-body table tbody tr td select {
    width: 100%;
    height: 40px;
    font-size: 14px;
    background-position: top 15px right 10px;
    text-indent: 15px;
    border: 0;
}

.joinListChk-popup .popup-body table tbody tr td select.wp40 {
  width: 40%;
}

.joinListChk-popup .popup-body table tbody tr td span {
  color: #FF0000;
  font-size: 13px;
  display: inline-block;
  margin-left: 10px;
}

.joinListChk-popup .popup-body .input-table02 {
  border-top: 1.5px solid #006737;
  border-bottom: 1px solid #ccc;
  display: flex;
  flex-direction: column;
  gap: 10px 0;
  padding: 10px 0;
}

.joinListChk-popup .popup-body .input-table02 ul {
  display: flex;
  align-items: center;
  gap: 0 5px;
}

.joinListChk-popup .popup-body .input-table02 ul li {
  width: calc((100% - 15px)/5);
}

.joinListChk-popup .popup-body .input-table02 ul li input {
background: #fafafa;
  height: 40px;
  text-align: left;
  font-size: 14px;
  width: 100%;
}

.joinListChk-popup .popup-body .input-table02 ul li select {
  height: 40px;
  text-align: left;
  font-size: 14px;
  width: 100%;
  background-position: top 15px right 8px;
  text-indent: 10px;
}

.joinListChk-popup .popup-body .input-table02 ul li input::placeholder, .joinListChk-popup .popup-body .input-table02 ul li select::placeholder {
    font-size: 14px;
    font-weight: 400;
}

.joinListChk-popup .joinListChk-popup-close {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0 13px;
  padding-top: 30px;
}

.joinListChk-popup .joinListChk-popup-close a {
  color: #fff;
  background: #C2C2C2;
    box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
  font-size: 18px;
  font-weight: 700;
  width: 197px;
  display: block;
  padding: 18px 0;
  border-radius: 30px;
  text-align: center;
}

.joinListChk-popup .joinListChk-popup-close input[type="submit"] {
  color: #fff;
  background: #C2C2C2;
    box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
  font-size: 18px;
  font-weight: 700;
  width: 197px;
  display: block;
  padding: 14px 0;
  border-radius: 30px;
  text-align: center;
}

.joinListChk-popup .joinListChk-popup-close a.on {
  background: #006737;
}

.joinListChk-popup .joinListChk-popup-close input[type="submit"].on {
  background: #006737;
  border: 0;
}

.join-btn-area {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0 5px;
}

.join-btn-area a {
  display: block;
  font-size: 14px;
  border: 1px solid #CBCBCB;
  text-align: center;
  padding: 5px 25px;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16);
  border-radius: 17px;
}

.join-btn-area a.on {
  background: #79BC3B;
  border: 1px solid #79BC3B;
  color: #fff;
}

.join-ing {
  color: #006737;
  text-decoration: underline;
}

/* 조인 예약 취소 팝업 */
.joinListChk-popup.cancel {
  min-height: 624px;
  height: auto;
}

.joinListChk-popup.cancel .popup-header {
  margin-bottom: 30px;
  text-align: center;
}

.joinListChk-popup.cancel .popup-header span {
  color: #666;
  font-size: 14px;
  display: block;
  margin: 20px 0 3px 0;
}

.joinListChk-popup.cancel .popup-header b {
  color: #F00;
  font-size: 14px;
  font-weight: 400;
}

.joinListChk-popup.cancel .popup-body {
  height: 360px;
}

.joinListChk-popup.cancel .popup-body .popup-radio {
  display: flex;
  flex-direction: column;
  gap: 8px 0;
}

.joinListChk-popup.cancel .popup-body .popup-radio li {
  border: 1px solid #333;
  border-radius: 4px;
  width: 100%;
  height: 40px;
  display: flex;
  align-items: center;
  gap: 0 10px;
  padding: 0 16px;
}

.joinListChk-popup.cancel .popup-body .popup-radio li label {
  font-size: 14px;
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
}

/* 조인 예약 진행상태 팝업 */
.joinListChk-popup.state {
  height: 360px;
  min-height: 400px;
}

.joinListChk-popup.state .popup-header span {
  color: #666;
  font-size: 14px;
  display: block;
  margin: 20px 0 3px 0;
  text-align: center;
}

.joinListChk-popup.state .popup-body {
  height: 170px;
  padding-top: 30px;
}

.joinListChk-popup.state .popup-body .popup-state {
  display: flex;
  justify-content: center;
  gap: 0 25px;
}

.joinListChk-popup.state .popup-body .popup-state li a {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px 0;
  width: 100%;
  height: 100%;
  position: relative;
}

.joinListChk-popup.state .popup-body .popup-state li img {
  width: 50px;
}

.joinListChk-popup.state .popup-body .popup-state li span.name {
  font-size: 14px;
  text-align: center;
}

.joinListChk-popup.state .popup-body .popup-state li span.name.noneTeam {
  color: #666;
}

.joinListChk-popup.state .popup-body .popup-state li b {
  font-size: 14px;
  color: #007167;
  text-align: center;
  font-weight: 400;
  margin-top: 5px;
  display: block;
}

.popup-select {
  position: absolute;
  top: 35px;
  left: 50%;
  transform: translateX(-50%);
  width: 61px;
  height: 17px;
  border-radius: 20px;
  background: url('/images/ic_pop-down.svg')no-repeat center right 5px #3B579D;
  box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
  border: 1px solid #fff;
  font-size: 12px;
  text-align: center;
  text-indent: 0;
  color: #fff;
}

.joinListChk-popup.icon .popup-body .popup-state.icon-select {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 10px 25px;
}

.joinListChk-popup.icon .popup-body .popup-state.icon-select li {
  border-radius: 50%;
  cursor: pointer;
}

.joinListChk-popup.icon .popup-body .popup-state.icon-select li.on {
  border: 1px solid #006737;
}

.joinListChk-popup.icon .popup-body {
  height: 250px;
  width: 100%;
}

.joinListChk-popup.icon {
  height: auto;
  width: 450px;
  border: 1px solid #CBCBCB;
  background: #F5F5F5;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.10);
  max-height: 450px;
  min-height: auto;
}

.joinListChk-popup.icon .join-tit {
  text-align: left;
  border-bottom: 1px dashed #cbcbcb;
  padding-bottom: 20px;
}

/*partner*/
.con-width-646{
  width: 646px;
  margin: 0 auto;
}
.tbl-sty{
    width: 100%; 
    table-layout: fixed;
    text-align: left;
    border-top:1px solid #cbcbcb;
    border-bottom: 1px solid #cbcbcb;
    min-height: auto;
}
.tbl-sty th{
    vertical-align: middle;
    font-weight: 400;
    padding-left: 4px;
    font-size: 12px;
    color: #000;
}
.tbl-sty td{
    vertical-align: middle;
    padding: 4px;
    line-height: 33px;
    text-align: right;
    font-size: 14px;
    color: #000;
    font-weight: 400;
}
.tbl-sty td span.address{
    font-size: 0.75rem;
    letter-spacing: -0.3px;
}
.tbl-sty td input{
    background: #f5f5f5;
    height: 36px;
    width: 80%;
    border: none;
    outline: none;
    font-size: 0.88rem;
    padding: 10px;
    font-family: 'Noto Sans KR';
}
.tbl-sty td input::placeholder{color: #999;}

.partner-box{
    border:1px solid #cbcbcb;
    padding: 34px 0;
}
.partner-box ul{
    display: flex;
    justify-content: center;
}
.partner-box ul li{
    flex-grow: 5;
    text-align: center;
    position: relative;
}
.partner-box ul li::after{
    content: '';
    position: absolute;
    top: 4px;
    right: 0;
    width: 1px;
    height: 59px;
    background-color: #ccc;
}
.partner-box ul li:last-child::after{
    display: none;
}
.partner-box ul li h2{
    height: 44px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: #333;
    font-weight: 400;
}
.partner-box ul li h2 span{ 
    display: block;
    color: #707070;
    margin-top: 8px;
}
.partner-box ul li h2 img{
  width: 54px;
}
.partner-box ul li p{
    font-weight: 500;
    line-height: 1.4em;
}
.partner-box ul li p span{
    display: block;
    text-align: center;
    width: 100%;
    max-width: 90px;
    margin: auto;
    background-color: var(--color-main);
    line-height: 24px;
    color: #fff;
    font-weight: 400;
    margin-top: 8px;
    padding: 3px 0;
    cursor: pointer;
}
.partner-box ul li p span.qr{background: var(--color-gray);}
.partner-box ul li p span.modify{background: #999; margin-bottom: 8px;}

.guide-text{
    padding: 20px 0 30px;
    text-align: center;
    line-height: 1.5em;
    word-break: keep-all;
    font-size: 18px;
    color: #333;
    font-weight: 400;
}

.common-btn{ width: 100%; text-align: center; font-size: 0; display: flex; justify-content: center;}
.common-btn span{ display: inline-block; width: 197px; margin: 0 6px; border:1px solid #fff; color: #fff; font-weight: 400; line-height: 54px; font-size: 20px; background-color: #c2c2c2; box-shadow:0 3px 6px 0 rgba(0, 0, 0, 0.16); border-radius: 30px; cursor: pointer;}
.common-btn span.on{ background-color: #006737;} 

/*popup*/
.basic-pop2{
  display: block;
  z-index: 1111;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: #fff;
  width: 660px;
  border-radius: 20px;
  padding: 46px 30px;
}

/*pop-table*/
.tbl-sty06{ width: 100%; border-top:2px solid #006737; font-weight: 400; color: #363636;}
.tbl-sty06 th{ text-align: center; vertical-align: middle; background-color: #fafafa; border-bottom:1px solid #cbcbcb; padding: 10px 0; font-weight: 500; z-index: 0; height: 50px;}
.tbl-sty06 td{ line-height: 1.33em; text-align: left; vertical-align: middle; border-bottom:1px solid #cbcbcb; padding:10px 24px; font-weight: 300; height: 50px;}
.tbl-sty06 td input{height: 30px; width: 75%; background-color: #fafafa; border: 0; text-indent: 8px; font-size: 16px !important;}

/*pop-radio input*/
input[type=radio]{display:none;}
input[type=radio] + label { 
  background-repeat: no-repeat;
  background-image: url('/Mobile/partner/Images/icon_radio_off.svg');
	background-size: 16px 16px;
	padding-left: 22px;
	padding-right: 20px;
	background-position: left center;
  transition: 0.3s all;
  font-weight: 400;
}
input[type=radio]:checked + label {
  background-image: url('/Mobile/partner/Images/icon_radio_on.svg');
	background-size: 16px 16px;
}

.dash-line{ 
  border: none;
  background-image: linear-gradient(to right, #ccc 50%, transparent 0%);
  background-size: 8px 1px;
  background-repeat: repeat-x;
  height: 1px;
  margin: 25px 0 50px;
}