@charset "UTF-8";

h4 {font-weight:700;}
.bod_list tr th,
.bod_list tr td  {font-size:16rem;}
.bod_view h4 {font-size:18rem !important;}
.bod_view h4:before {display:none !important; }

.reserv_step {display:flex; justify-content:center; margin:60rem 0;}
.reserv_step > div {padding:0 100rem; position:relative;}
.reserv_step > div:before,
.reserv_step > div:after {content:''; position:absolute; top:20px; width:50%; height:2px; background:#d5d5d5; z-index:-1;}
.reserv_step > div:before {left:0; }
.reserv_step > div:after {right:0;}
.reserv_step > div:first-child:before {display:none;}
.reserv_step > div:last-child:after {display:none;}
.reserv_step > div > span {display:flex; flex-direction:column; align-items:center; color:#9b9b9b; font-weight:600;}
.reserv_step > div > span:before {content:'1'; display:block; margin-bottom:15rem; width:36rem; height:36rem; border:2px solid #d5d5d5; color:#9b9b9b; border-radius:50%; font-weight:700; text-align:center; line-height:36rem; font-size:16rem; background:#fff;}
.reserv_step > div > span.on {font-weight:700; color:#6c4d1d}
.reserv_step > div > span.on:before {background:#6c4d1d; color:#fff; border-color:#6c4d1d;}
.reserv_step > div:nth-child(2) > span:before {content:'2'}
.reserv_step > div:nth-child(3) > span:before {content:'3'}
.reserv_cont .step01_top {display:flex; justify-content:space-between; margin-bottom:50rem; padding-bottom:60rem; border-bottom:1px dotted #ddd;}
.reserv_cont #calendar {width:60%; padding:var(--padding-40rem); border-radius:var(--border-radius-10rem); box-shadow:0 10rem 20rem rgba(0,0,0,0.1); border:1px solid #eee;}
.reserv_cont #calendar .cal .tit {opacity:0;}
.reserv_cont .notice {width:calc(40% - 30rem); margin-top:10rem}
.reserv_cont .notice li {margin:7rem 0; position:relative; padding-left:27rem;}
.reserv_cont .notice li:last-child {margin-bottom:0;}
.reserv_cont .notice li:before {content:''; position:absolute; top:10rem; left:10rem; width:4px; height:4px; background:#323232; border-radius:50%;}
.reserv_cont .notice li strong {font-weight:600;}
.reserv_cont .notice li:nth-child(2) strong {color:#8f1616;}
.reserv_cont .step01_bottom > div {display:flex; margin-bottom:40rem;}
.reserv_cont .step01_bottom > div > p {width:250rem; font-size:23rem; font-weight:700; color:var(--p_color); margin:10rem 0 0 0;}
.reserv_cont .step01_bottom > div ul {display:flex; margin:-7rem; width:calc(100% - 250rem + 14rem);}
.reserv_cont .step01_bottom > div ul li {margin:7rem; width:33.333%;}
.reserv_cont .step01_bottom > div ul li a {display:flex; justify-content:space-between; border-radius:var(--border-radius-6rem); border:1px dashed #cfcfcf; padding:25rem;}
.reserv_cont .step01_bottom > div ul li a p:first-child {font-weight:700;}
.reserv_cont .step01_bottom > div ul li a.on,
.reserv_cont .step01_bottom > div ul li a:hover {color:#fff; background:#a46305; border:1px solid #a46305; box-shadow:0 10rem 20rem rgba(92,69,10,0.2)}
@media all and (max-width:1240px){
  .reserv_cont .step01_top {flex-wrap:wrap; margin-bottom:40rem; padding-bottom:40rem;}
  .reserv_cont #calendar {width:100%;}
  .reserv_cont .notice {width:100%; margin-top:40rem}
  .reserv_cont .step01_bottom > div ul li {width:50%;}
}
@media all and (max-width:1023px){
  .reserv_cont .step01_bottom > div {flex-wrap:wrap;}
  .reserv_cont .step01_bottom > div > p {width:100%; margin:0 0 20rem 0;}
  .reserv_cont .step01_bottom > div ul {width:calc(100% + 14rem);}
}
@media all and (max-width:768px){
  .reserv_step > div {padding:0; width:33.333%;}
}
@media all and (max-width:599px){
  .reserv_cont #calendar { padding:0; box-shadow:none; position:relative; padding-bottom:50rem; overflow:hidden; border:0; border-radius:0;}
  .reserv_cont #calendar .cal {background:#f8f4ea; border:1px solid #ece4cf;}
  .reserv_cont #calendar .cal .tit {display:none;}
  .reserv_cont #calendar .cal .legend  {right:10rem;}
  .reserv_cont #calendar .cal .select .month {padding:20rem 0 0 0;}
  .reserv_cont .step01_bottom > div ul {flex-wrap:wrap; margin:-7rem 0; width:100%;}
  .reserv_cont .step01_bottom > div ul li {width:100%; margin:7rem 0;}
}
@media all and (max-width:480px){
  .reserv_cont .step01_bottom > div ul li a {display:block;}
  .reserv_cont .step01_bottom > div ul li a p:first-child {margin-bottom:7rem;}
}

/*신청폼*/
.reserv_info {display:flex; background:#fff7ea; padding:30rem 35rem; border-radius:10rem; border:1px solid #ffcb7a;}
.reserv_info li {display:flex; flex-direction:column; width:33.333%; border-left:1px dashed #ffcb7a; padding:0 30rem;}
.reserv_info li strong {margin-bottom:5rem; font-weight:600; color:#6c4d1d;}
.reserv_info li span {font-size:20rem; font-weight:700;}

.reserv_cont {margin-bottom:80rem;}
.reserv_cont .reserv_userInfo input[type="text"],
.reserv_cont .reserv_userInfo input[type="password"],
.reserv_cont .reserv_userInfo input[type="tel"],
.reserv_cont .reserv_userInfo input[type="button"],
.reserv_cont .reserv_userInfo select,
.reserv_cont .reserv_userInfo button {border:1px solid #a0a0a0; height:48rem; border-radius:3px; margin:3rem; padding:0 10rem; width:100%; line-height:48rem;}
.reserv_cont .reserv_userInfo button {border-color:var(--p_color); background:var(--p_color); color:#fff;}
.reserv_cont .reserv_userInfo select {width:auto;}
.reserv_cont .fieldset {display:flex; justify-content:space-between; border-bottom:1px solid #ddd; padding-bottom:40rem; margin-top:60rem;}
.reserv_cont .fieldset h4 {flex-shrink:0; flex-grow:0; width:200rem; font-weight:700  !important; font-size:23rem !important; margin:0 !important;}
.reserv_cont .fieldset h4:before {display:none !important;}
.reserv_cont .fieldset h4 span {display:block; font-size:16rem; font-weight:500; margin:10rem 0 0 0; line-height:1.5; color:#632424;}

.reserv_cont .reserv_userInfo {width:calc(100% - 240rem);}
.reserv_cont .reserv_userInfo {display:flex; flex-wrap:wrap; justify-content:space-between;}
.reserv_cont .reserv_userInfo li {display:flex; flex-wrap:wrap; align-items:flex-start; width:calc(50% - 10rem); margin-bottom:20rem;}
.reserv_cont .reserv_userInfo li label {display:block; width:100%; font-weight:600; margin:1rem 3rem 10rem 5rem;}
.reserv_cont .reserv_userInfo li input[type="text"],
.reserv_cont .reserv_userInfo li input[type="password"],
.reserv_cont .reserv_userInfo li button {width:auto;flex:1 1 auto;}
.reserv_cont .reserv_userInfo li button {width:100rem; flex-shrink:0; flex-grow:0;}
.reserv_cont .reserv_userInfo li.row {width:100%;}
.reserv_cont .reserv_userInfo li.auto {width:auto;}
.reserv_cont .reserv_userInfo div.auto {display:flex; align-items:center;}

@media all and (max-width:1240px){
  .reserv_cont .fieldset {flex-wrap:wrap; padding-bottom:20rem; margin-top:40rem;}
  .reserv_cont .fieldset h4 {width:100%;}
  .reserv_cont .reserv_userInfo {width:100%; margin-top:20rem;}
  .reserv_cont .reserv_userInfo li label {margin:1rem 3rem 10rem 2rem;}
}

@media all and (max-width:1023px){
  .reserv_cont .reserv_userInfo li {width:100%;}
  .reserv_cont .reserv_userInfo li.auto {width:100%;}
  .reserv_cont .reserv_userInfo li.row input[type="text"]:nth-of-type(2),
  .reserv_cont .reserv_userInfo li.row input[type="text"]:nth-of-type(3) {width:100% !important;}
  .reserv_cont .reserv_userInfo select {width:100%;}
}
@media all and (max-width:768px){
  .reserv_info {flex-wrap:wrap; padding:30rem;}
  .reserv_info li {flex-direction:row; align-items:center; width:100%; margin:10rem 0; padding:0 0 0 30rem;}
  .reserv_info li:first-child {margin-top:0;}
  .reserv_info li:last-child {margin-bottom:0;}
  .reserv_info li strong {font-size:17rem; margin-bottom:0; margin-right:15rem;}
  .reserv_info li span {font-size:17rem;}
  .reserv_cont .reserv_userInfo div.auto{flex-wrap:wrap; width:100%;}
}
@media all and (max-width:480px){
  .reserv_info {flex-wrap:wrap;}
  .reserv_info li {flex-wrap:wrap; padding:0 0 0 25rem;}
  .reserv_info li strong {width:100%; margin-right:0; margin-bottom:5rem;}
}

/*약관*/
.agree_info {margin-bottom:0 !important; padding:0 !important;}
.agree_info p {height:250rem; overflow-y:auto; padding:30rem;}
.agree_check {display:flex; align-items:center; justify-content:right; border-bottom:1px solid #ddd; padding:18rem 25rem;}
.agree_check label {margin-left:10rem; font-weight:500;}

/*버튼*/
.btn_list {display:flex; justify-content:center; margin:60rem 0;}
.btn_style {display:inline-block; border:1px solid var(--p_color); background:var(--p_color); color:#fff;  height:48rem; border-radius:3px; margin:3rem; padding:0 20rem !important;  width:auto !important; line-height:48rem; font-weight:500;}
.btn_style.cancle {background:#535353; border-color:#535353; color:#535353; background:#fff;}
.sbtn_style {display:inline-block; border:1px solid #2f50af; background:#2f50af;; color:#fff; border-radius:3px; margin:2rem; padding:5rem 12rem !important; font-size:15rem; font-weight:500;}
.sbtn_style.cancle {border-color:#671818; background:#fff; color:#671818;}

/*완료*/
.reserv_step+h3 {display:none;}

/*확인*/
@media all and (max-width:1240px) {
  .reserv_tbl {border-top:0 !important;}
  .reserv_tbl thead {display:none;}
  .reserv_tbl tbody {display:flex; flex-wrap:wrap;}
  .reserv_tbl tbody tr {display:block; flex:1 1 50%; border-top:2px solid var(--p_color); margin-bottom:40rem;}
  .reserv_tbl tbody td {display:flex; align-items:center; justify-content:space-;}
  .reserv_tbl tbody td::before {content:attr(data-label); font-weight:700; width:100rem; text-align:left;}
  .reserv_tbl .sbtn_style {margin:0 5rem 0 0;}
}
@media all and (max-width:599px) {
  .reserv_tbl tbody tr {flex:1 1 100%;}
}



/*콘텐츠*/
/*시설정보*/
.info_top {display:flex; justify-content:space-between}
.info_top > * {width:calc(50% - 20rem);}
.info_slide {position:relative;}
.info_slide .slick-list {border-radius:var(--border-radius-10rem);}
.info_slide .slick-dots {margin-top:20rem;}
.info_slide .infoslide_arrow > a {cursor:pointer; display:block; position:absolute; top:50%; left:20rem; width:36rem; height:36rem; margin-top:-18rem; background:url('/design/sjparkgolf/img/sub/infoslide_arrow.png') 0 0/contain; opacity:1; text-indent:-9999rem; z-index:100;}
.info_slide .infoslide_arrow > a.next {transform:rotate(180deg); right:20rem; left:inherit;}
@media all and (max-width:1240px){
  .info_top {flex-wrap:wrap;}
  .info_top > * {width:100%;}
  .info_slide {margin-top:10rem;}
}
@media all and (max-width:599px){
  .info_slide .slick-list img {width:100%; height:250rem; object-fit:cover;}
  .info_slide .infoslide_arrow > a {width:20rem; height:20rem;}
}
/*사이트맵*/
.sitemap li::before {display:none;}
.sitemap li { padding:0 !important;}
.sitemap .dot {display:flex; flex-wrap:wrap; margin:-10rem;}
.sitemap .dot > li { width:calc(25% - 20rem); margin:10rem; }
.sitemap .dot > li > a { position:relative; display:flex; align-items:center; justify-content:space-between; border:1px solid #a6afbd; height:50rem; padding:0 20rem; border-radius:5rem; font-weight:600; font-size:1em; }
.sitemap .dot > li > a::after { content:''; display:block; flex-shrink:0; width:8rem; height:8rem; border-right:2px solid #a6afbd; border-bottom:2px solid #a6afbd; transform:rotate(45deg); }
.sitemap a[target="_blank"] span { display:flex; }
.sitemap a[target="_blank"] span::after { content:''; width:13px; height:13px; background:var(--sprite_template) 0 0; margin:2rem 0 0 5rem; }
@media all and (max-width:1023px){
  .sitemap .dot {margin:-10rem;}
  .sitemap .dot > li { width:calc(33.333% - 20rem);}
}
@media all and (max-width:768px){
  .sitemap .dot {margin:-7rem;}
  .sitemap .dot > li { width:calc(50% - 20rem); margin:7rem;}
}
@media all and (max-width:321px){
  .sitemap .dot {margin:-7rem 0;}
  .sitemap .dot > li {width:100%; margin:7rem 0;}
}

/* 기존 css */

.complete_img {width:138rem; height:119rem; margin:0 auto 60rem; background: url('/design/sjparkgolf/img/sub/complete.png') no-repeat center; background-size: contain;}
.complete_txt {text-align: center;font-size: 20rem; font-weight: 500;}


/*시설소개*/
.intro p.head, .intro p.foot {text-align: center;font-size: 24rem !important;font-weight: 500;padding: 50rem 0;line-height: 1.5;}
.intro p.head {border-bottom: 1px solid #ddd;margin-bottom: 50rem;}
.intro p.foot {border-top: 1px solid #ddd;margin-top: 50rem;}
.intro p.head strong, .intro p.foot strong {color:#008023}
.intro img {border-radius: 0 20rem 0 20rem;}
.intro .img_box {display: flex;flex-wrap: nowrap;gap: 20rem 0;align-items: center;margin: 50rem 0;}
.intro .img_box img {box-shadow: -25rem 25rem #E6F2CC;margin: 0 0 25rem 25rem;}
.intro .img_box p {text-align: center;width: calc(100% - 525rem);padding: 30rem;font-weight: 500;font-size: 20rem !important;margin-bottom: 0 !important;}
@media all and (max-width:1200px) {
  .intro .img_box img {width: 40%;height: auto;}
  .intro .img_box p {width: 60%;}
}
@media all and (max-width:1000px) {
  .intro p.head, .intro p.foot {font-size: 20rem !important;}
  .intro .img_box p {font-size: 18rem !important;}
}
@media all and (max-width:720px) {
  .intro .img_box {flex-wrap: wrap;margin: 0;}
  .intro .img_box img {width: calc(100% - 15rem);height: auto;box-shadow: -15rem 15rem #E6F2CC;margin: 0 0 15rem 15rem;}
  .intro .img_box p {width: 100%;padding: 8rem;}
}

/*오시는 길*/
.location {font-size: 20rem;font-weight: 500; line-height: 20rem;padding-left: 20rem; background: url('/design/sjparkgolf/img/sub/location_icon.png') no-repeat top left;}

/*예약안내*/
.resguide .guidebox {padding: 30rem 28% 30rem 33rem;border:8px solid #EFF5E1;border-radius: 20rem;background: url('/design/sjparkgolf/img/sub/resguide.png') no-repeat bottom 30rem right 33rem/25%;}
.resguide ul > li strong {color: #BF0000;}
@media all and (max-width:1260px) {
  .resguide .guidebox {padding: 30rem 33rem 300rem 33rem;background-size: 400rem;background-position: bottom 30rem center;}
}
@media all and (max-width:550px) {
  .resguide .guidebox {padding: 30rem 33rem 300rem 33rem;background-size: 80%;background-position: bottom 30rem center;}
}
@media all and (max-width:460px) {
  .resguide .guidebox {padding: 30rem 23rem 250rem 23rem;}
}
