/* golf */
.box_golf_simple{position: relative; height: 200px}
.box_golf_simple ul {margin: 80px 0}

.box_golf_simple li {
  float: left;
  width: 17%;
  padding: 0 25px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  border-right: 1px solid rgba(0, 0, 0, 0.2);
  font-family: 'Cormorant Garamond', serif;
}
.box_golf_simple li:last-child {width: 15%; border-right: 0;}

.box_golf_simple li span {
  display: block;
  width: 100px;
  height: 40px;
  font-size: 16px;
}

.box_golf_simple li strong {
  display: block;
  margin-top: 37px;
  text-align: right;
  font-size: 45px; font-weight: 400;
}

.box_golf_course {margin-top: 50px;}
.box_golf_course ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.box_golf_course li {position: relative; overflow: hidden; width: calc(50% - 40px);}

.box_golf_course .course_item {
  display: block;
  overflow: hidden;
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 100%;
}

.box_golf_course .course_item:before {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.4);
  z-index: 1;
}

.box_golf_course .course_item img {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 100%;
  height: auto;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.box_golf_course .course_item .tit {
  position: absolute;
  left: 50%;
  top: 50%;
  font-family: 'Cormorant Garamond', serif;
  font-size: 30px;
  line-height: 1.33;
  color: #fff;
  text-align: center;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  z-index: 2;
}

.box_golf_course .course_item:hover .tit {
  display: none;
}

.box_golf_course .course_item:hover .course_info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  z-index: 3;
}

.box_golf_course .course_item:hover .btn_text02 span:after {
  -webkit-animation: btnTxt02 2s;
          animation: btnTxt02 2s;
}

.box_golf_course .course_info {
  display: none;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  padding: 0 10px;
  background-color: rgba(255, 255, 255, 0.9);
  text-align: center;
}

.box_golf_course .course_info strong {
  font-family: 'nanum';
  font-size: 30px;
  line-height: 1.4;
}

.box_golf_course .course_info p {width: 100%; max-width: 500px; margin: 20px auto 20px; font-family: 'spoqaL'; font-size: 16px; line-height: 1.5; text-align: center; color: #444; word-break: keep-all;}

.btn_text {
  display: inline-block;
  position: relative;
  padding: 0 0 5px;
  color: #738390;
  font-size: 14px;
  line-height: 1.2;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  font-family: 'spoqa';
}

.btn_text:before {
  content: '';
  display: inline-block;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;
  background: #738390;
}

.btn_text.arrow {
  padding-right: 10px;
  line-height: 1;
}

.btn_text.arrow:before {
  width: calc(100% - 10px);
}

.btn_text.arrow:after {
  content: '';
  display: inline-block;
  position: absolute;
  right: 0;
  top: 50%;
  margin-top: -3px;
  padding: 3px;
  border: solid #666;
  border-width: 0 1px 1px 0;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}

.btn_text02 {
  display: inline-block;
  position: relative;
  padding: 5px 60px 5px 0;
  color: #738390;
  font-size: 14px;
  line-height: 2.43;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.btn_text03 {
  display: inline-block;
  position: relative;
  padding: 0 0 5px;
  color: #738390;
  font-size: 16px;
  line-height: 2.13;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.btn_text03:before {
  content: '';
  display: inline-block;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;
  background: #738390;
}

.btn_text04:before {
  background: #fff;
}



.btn_text05 {
  display: inline-block;
  position: relative;
  padding: 0 0 5px;
  color: #738390;
  font-size: 14px;
  line-height: 1.2;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  font-family: 'spoqa';
}

.btn_text05:before {
  content: '';
  display: inline-block;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;
  background: #738390;
}

.btn_text05.arrow {
  padding-right: 10px;
  line-height: 1;
}

.btn_text05.arrow:before {
  width: calc(100% - 10px);
}

.btn_text05.arrow:after {
  content: '';
  display: inline-block;
  position: absolute;
  right: 0;
  top: 50%;
  margin-top: -3px;
  padding: 3px;
  border: solid #666;
  border-width: 0 1px 1px 0;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}


/*btn action*/
.btn_ac_ltr span {
  display: inline-block;
  position: relative;
}

.btn_ac_ltr span:after {
  content: '';
  display: block;
  position: absolute;
  left: 100%;
  top: 50%;
  width: 100%;
  max-width: 50px;
  height: 1px;
  margin-left: 7px;
  background: #738390;
}

.btn_ac_ltr:hover span:after {
  -webkit-animation: btnTxt02 2s;
          animation: btnTxt02 2s;
}

.btn_ac_ltr.btn_bookstay span:after {
  max-width: 60px;
  margin-left: 20px;
}

.btn_ac_center:hover:before {
  -webkit-animation: btnTxt01 1.2s;
          animation: btnTxt01 1.2s;
}

@-webkit-keyframes btnTxt01 {
  from {
    left: 50%;
    width: 0;
  }
  to {
    left: 0;
    width: 100%;
  }
}

@keyframes btnTxt01 {
  from {
    left: 50%;
    width: 0;
  }
  to {
    left: 0;
    width: 100%;
  }
}

@-webkit-keyframes btnTxt02 {
  from {
    width: 0;
  }
  to {
    width: 100%;
  }
}

@keyframes btnTxt02 {
  from {
    width: 0;
  }
  to {
    width: 100%;
  }
}



div.courseInfo {float:left; padding:50px 0; width:570px; height:570px; background:url('../img/course/courseBg.png') no-repeat;}
div.courseInfo h2.infoTit {margin-left:50px; margin-bottom:30px; font-size:30px; color:#fff; letter-spacing: 1px}
div.courseInfo h2.infoTit::after {margin-top:15px; display:block; content:''; width:40px; height:1px; background-color:#fff;}
div.courseInfo dl.infoTxt {display:inline-block;}
div.courseInfo dl.infoTxt:first-child {margin-right:15px; padding-left:50px; border-right:1px solid #687d96;}
div.courseInfo dl.infoTxt dt {display:inline-block; font-size:14px; color:#fff;}
div.courseInfo dl.infoTxt dd {display:inline-block; padding:0 15px; font-size:22px; color:#fff;}
div.courseInfo div.mapImg {margin-top:40px;}
div.courseList {float:right; width:630px;}
div.courseList a {position:relative; float:left; display:block; width:210px; height:190px; background-color:#000; overflow:hidden;}
div.courseList a:nth-child(3n) {margin-right:0;}
div.courseList a p.cosTit {position:absolute; top:50%; left:50%; margin-top:-15px; margin-left:-40px; padding:2px 0; width:80px;  font-size:14px; text-align:center; color:#fff; z-index:1;}
div.courseList a p.cosTit span {margin-right:3px; font-size:24px;}
div.courseList a img.cosImg {opacity:0.5; transition:0.3s;}
div.courseList a:hover img.cosImg {opacity:1;}

div.cosPopup {display:none; position:fixed; top:0; height:0; width:100%; height:100%; background:rgba(0,0,0,0.8); z-index:9999;}
div.popInner {position:relative; top:50%; left:50%; margin-top:-320px; margin-left:-600px; width:1200px; height:700px; background:#fff; overflow:hidden;}
div.closedBtn {position:absolute; top:0; right:0; width:70px; height:70px; background:#029B49; cursor:pointer; z-index:999;}
div.closedBtn span {display:block; width:70px; height:70px; background:url('../img/cosPop_Closed.png') no-repeat center;}

.course_w {position: relative; width: 100%; background: #fff;}
.course_w ul.holeTab {position:relative; margin: 95px auto 0; padding-bottom: 160px; text-align:center; display: flex; justify-content: center; align-items: center;}
.holeTab .tit{margin-right: 130px;font-size: 32px;font-weight: 600;}
.course_w ul.holeTab li {height:80px; line-height:1.4; font-size:12px; color:#bbb; cursor:pointer; flex: 1; border-bottom: 3px solid #ddd;}
.course_w ul.holeTab li p{font-size: 35px}
.course_w ul.holeTab li.active {border-bottom: 3px solid #333; color:#000;}
.course_w span.holeMap {position:absolute; top:10px; left:0;}
/* .course_w ul.holeTab li:hover {border-bottom: 3px solid #ddd; color:#999;} */

.course_w .tabContent{position: relative; width: 100%;}

.hole_w {margin: 80px 0}

div.holeCnt {float: left; width: 580px;  z-index: 10;}
.holeCnt ul li:before {display:none;}
div.cosInfo {width: 1628px; margin: 0 auto; display: flex; align-items: center; justify-content: center; gap: 126px;}
.c-title{
  margin-bottom: 20px;
}
.c-title .cosTit {font-size: 28px; font-weight: 600;}
.c-title .cosTit span {font-size:60px; margin-right:15px;}
.c-title p.par {font-size:20px; color:#95B821; padding-top: 16px; font-weight: 600;}
.c-title p.par span {font-size:40px; margin-right: 10px}
div.cosInfo ul{width: 528px;}
div.cosInfo ul li{margin-bottom: 20px; line-height: 1.5; position:relative; padding-left:15px;}
div.cosInfo ul li:before{
  content:'';
  position:absolute;
  top:10px;
  left:0;
  width:4px;
  height:4px;
  background:#000;
  border-radius:50%;
}

div.cosImg {float: left;}
div.cosImg img{width: 300px;}
div.cosImgR {float: left;}
div.cosImgR img{width: 300px; margin-left: 50px}

/* 코스 테이블 */
.c-info{
    width:400px;
    text-align:center;
    border-top:2px solid #bbb;
    table-layout:fixed;
    margin-top: 32px;
    margin-left: 15px;
}
.c-info th{
    background: #F8F8F8;
    padding:11px 0;
    border-bottom:1px solid #bbb;
    text-transform:uppercase;
    font-size:13px;  
    font-weight:600;
}
.c-info th.blue{
    color:#0072BB;
}
.c-info th.white{
    color:#bbb;
}
.c-info th.yellow{
    color:#CFAD66;
}
.c-info th.green{
    color:#4bb747;
}
.c-info th.red{
    color:#D01B26;
}
.c-info th.pink{
    color:#ed008e;
}
.c-info td{
    padding:11px 0;
    font-size:14px;
    border-bottom:1px solid #bbb;
}


dl.infoInner {margin:30px 0; width:100%;}
dl.infoInner dt {font-size:20px;}
dl.infoInner dd { margin-top:10px; font-size:16px; line-height:26px; color:#333;}
dl.infoInner dd ol.attack li {position: relative; margin-bottom:5px; padding-left:15px; }
dl.infoInner dd ol.attack li:after {position: absolute; left: 0; top:12px; display: block; content: ''; width: 4px; height: 4px; border-radius: 50%; background: #029B49}

div.slideFacility {position:relative; width:800px; height:500px; overflow:hidden; z-index:666; background: #ddd; margin: auto}


div.slideVisual {position:relative; width:580px; overflow:hidden; z-index:666; background: #fff;}
div.slideVisual span{text-align: center;}
div.slideVisual span img{width: 580px;}
div.mpVisual{position:relative; width:530px; height:300px; overflow:hidden; z-index:666; background: #fff; margin-top: 10px}
.slick-arrow {position:absolute; top:50%; margin-top:-25px; z-index:666; width:50px; height:50px; cursor:pointer; color:transparent; border:0; outline:none; background:transparent; z-index:666;}
.slick-prev {left:0; background:url('../img/cos_prev.png') center;}
.slick-next {right:-1px; background:url('../img/cos_next.png') center;}

/* Dots */
.slick-dots {position:absolute; bottom:20px; display:block; width: 100% !important; text-align:center;}
.slick-dots li {position: relative; display: inline-block; width: 10px; height: 10px; margin: 0 6px; cursor: pointer;}
.slick-dots li button {display:block; width:12px; height:12px; cursor:pointer; color:transparent; border:0; outline:none; background:transparent;}
.slick-dots li button:before {position:absolute; top:0; left:0; content:''; display:block; width:10px; height:10px; border-radius:30px; border:2px solid #fff;}
.slick-dots li button:hover:before, .slick-dots li button:focus:before, .slick-dots li.slick-active button:before {background:#fff;}