@charset "UTF-8";



.contentWrap02 .content02 {float:left;margin:30px 25px;width:96%;min-height:500px;}
.contentWrap02 .satisBox {width:94.5%;}



/*스타일가이드*/
div.tapMenu {float:left;width:100%;height:34px;margin:30px 0 15px;border-bottom:1px solid #a8b1bf;}
div.tapMenu ul {float:left;width:100%;}
div.tapMenu ul li {float:left;font-size:1.2em;border:1px solid #a8b1bf}
div.tapMenu ul li a {float:left;color:#746e6e;padding:10px 24px 6px 24px;}
div.tapMenu ul li.on { border:1px solid #5a687e; background:#5a687e;}
div.tapMenu ul li.on a {color:#fff;padding:10px 34px 6px 33px;}
div.tapMenu ul li:last-child { border-right:1px solid #a8b1bf;}
div.tapMenu_bottom {float:left; }


h3.cStyle {clear:both;float:left;display:inline;color:#333;font-size:1.7em;line-height:22px;padding:10px 0 0 0; border-top:1px solid #698194;/*background:url(/images/suncheon/yeyak/sub/h3_cStyle.gif) left top no-repeat;*/}
h4.cStyle {float:left;display:inline;width:90%;color:#242629;font-size:1.3em;margin:10px 0 0 5px;padding:0 0 0 20px;background:url(/images/suncheon/yeyak/sub/h4_cStyle.gif) left top no-repeat;}
h5.cStyle {float:left;display:inline;width:90%;font-size:16px;font-weight:normal;color:#5b5f65;margin:8px 0 0 18px;padding:0 0 0 20px;background:url(/images/suncheon/yeyak/sub/h5_cStyle.gif) left center no-repeat;}
h6.cStyle {float:left;display:inline;width:90%;font-size:1.0em;color:#5b5f65;margin:10px 0 0 18px;padding:0 0 0 19px;background:url(/images/suncheon/yeyak/sub/h6_cStyle.gif) left 5px no-repeat;}
h6.ch_h6{clear:both;width:96.5%;margin-left:20px;padding:10px 0;color:#fff;font-size:16px;background:#333;text-align:center}
h4.cStyle span {font-size:14px; font-weight:normal; color:#666666;}

dl.cStyle {float:left;display:inline;width:90%;margin:5px 0 0 27px;font-size:14px;line-height:20px;}
dl.cStyle dt {float:left;width:90%;font-size:1.0em;color:#4b5156;padding:0 0 0 8px;background:url(/images/suncheon/yeyak/sub/dt_cStyle.gif) left 7px no-repeat;}
dl.cStyle dd {float:left;width:90%;font-size:1.0em;color:#656c72;margin:5px 0 0 12px;padding:0 0 0 6px;background:url(/images/suncheon/yeyak/sub/dd_cStyle.gif) left 7px no-repeat;}

table.cStyle {float:left;border-top:1px solid #4ea47a;border-bottom:1px solid #d3d5d7;border-left:1px solid #d3d5d7;margin:5px 0 0 0; font-size:14px; font-family:나눔고딕,"돋움","굴림",  Seoul, "한강체";}
table.cStyle th {color:#615959;padding:8px 0 5px 0;background:#f6f6f6;border-right:1px solid #d3d5d7;border-bottom:1px solid #d3d5d7;}
table.cStyle td {color:#656b70;padding:8px 5px 5px 7px;border-right:1px solid #d3d5d7;border-bottom:1px solid #d3d5d7;}
table.cStyle td span.red {color:#fa0e0e;}
table.cStyle td span.blue {color:#0957c2;}
table.cStyle-a {float:left;border-top:1px solid #4ea47a;border-bottom:1px solid #d3d5d7;border-left:1px solid #d3d5d7;margin:5px 0 0 0; font-size:14px; font-family:나눔고딕,"돋움","굴림",  Seoul, "한강체";}
table.cStyle-a th {color:#615959;padding:8px 0 5px 0;background:#f6f6f6;border-right:1px solid #d3d5d7;border-bottom:1px solid #d3d5d7;}
table.cStyle-a td {color:#656b70;padding:8px 5px 5px 7px;border-right:1px solid #d3d5d7;border-bottom:1px solid #d3d5d7;text-align:center}
table.cStyle-a td span.red {color:#fa0e0e;}
table.cStyle-a td span.blue {color:#0957c2;}

p.cStyle {float:left;display:inline;width:95%;font-size:14px;color:#44474c;margin:5px 0 0 0;padding:0 0 0 8px;line-height:22px;}

ul.cStyle {float:left;display:inline;width:90%;margin:5px 0 0 27px;font-size:14px;line-height:20px;}
ul.cStyle li {float:left;width:90%;font-size:1.0em;color:#4b5156;padding:3px 0 3px 8px;background:url(/images/suncheon/yeyak/sub/dt_cStyle.gif) left 13px no-repeat;line-height:24px;}


/*이전화면버튼*/
.beforePage {float:right; padding-right:20px;}
.beforePage a {display:inline-block; padding:10px; width:65px; text-align:center; background:#6e7e97 url(/images/suncheon/yeyak/sub/arrow.gif) 8px center no-repeat; color:#fff;border-radius:3px; -moz-border-radius: 3px;   -webkit-border-radius: 3px;   -o-border-radius: 3px; }

/*오늘날짜표기*/
.patternLine { float:left; width:98%; margin:10px 0; background:url(/images/suncheon/yeyak/sub/pattern.gif) repeat;}
.whitebox { position:relative;float:left; margin:5px; background:#fff; width:99%;min-height:80px;  }
.whitebox ul {float:left; margin:20px;}
.whitebox ul li {float:left; }
.whitebox ul li span {float:left;color:#6b7a8d; padding:0 20px 0 0;}
.whitebox ul li span.big {font-size:24px;}
.whitebox ul li:first-child strong {float:left;font-size:36px;margin-top:-30px;padding:5px; color:#ee7421;}

.whitebox ul li label {font-size:16px;color:#6b7a8d;}
.whitebox ul li h4 {font-size:24px;}
p.calmonth {position:absolute; right:15px; top:22px; width:200px;}

.whitebox p.calmonth span {float:left;}
.whitebox p.calmonth span,
.whitebox p.calmonth a{line-height:1; display:block; margin:0; width:44px;}
.whitebox p.calmonth .prev,
.whitebox p.calmonth .next{border:1px solid #dcdcdc;}
.whitebox p.calmonth .next {float:right;}
.whitebox p.calmonth .prev a,
.whitebox p.calmonth .next a{padding:11px 11px 10px;}
.whitebox p.calmonth .prev a img,
.whitebox p.calmonth .next a img{vertical-align:middle;}

.whitebox p.calmonth .txtMonth {padding:10px; font-size:24px; color:#2b2f36;}
.whitebox p.calmonth .txtMonth strong { color:#4e76db;}

.grayBox{clear: both; padding: 10px 0 4px 20px; font-size: 14px; font-family: 나눔고딕,"돋움","굴림", Seoul, "한강체"; line-height: 24px;}

/*step01.jsp에 예약신청일 부분*/
.whitebox p.calmonth span.txtRsvYmd {font-size: 16px; width: 75px; padding: 0 0 2px 100px; font-weight: bold;}
.whitebox p.calmonth span.txtRsvYmd2 {font-size: 24px; width: 161px; padding: 5px 10px 10px 10px; font-weight: bold; text-align: right; color: #7a9ee8;}


.calenWrap .date p span strong{font-size:40px;}
.calenWrap .date p span strong b{color:#237AB2}


/*예약리스트*/
.yeyakbox {clear:both; width:99%;}
table.yeyakList  {float:left; width:98%;border-top:2px solid #50585e;border-bottom:1px solid #d3d5d7;margin:5px 0 0 0; font-size:14px; font-family:나눔고딕,"돋움","굴림",  Seoul, "한강체";}
table.yeyakList th {color:#615959;padding:15px 0 10px 0;background:#f6f6f6;border-right:1px solid #d3d5d7;border-bottom:1px solid #d3d5d7; line-height: 20px;}
table.yeyakList td {color:#656b70;padding:8px 5px 5px 7px;border-right:1px solid #d3d5d7;border-bottom:1px solid #d3d5d7; line-height: 20px;}
table.yeyakList td select {border:1px solid #9a9fa6; height:22px; color:#615959;}
table.yeyakList td select:hover { background: #eee;}

table.yeyakList td input {border:1px solid #b2b2b2; height:22px; color:#615959; padding-left:3px;}
table.yeyakList td input.zipcode {border-radius: 3px!important;    padding: 0 5px;    font-size: 12px;    background: #888;    border: none;    color: #fff;}
table.yeyakList td input.adrBox {width:98%;}
table.yeyakList td textarea { width:98%;}

table.yeyakList td input#rsvRequstAmt {width:80px;}

table.yeyakList td a {display:inline-block;padding:5px; text-align:center; color:#fff;border-radius:3px; -moz-border-radius: 3px;   -webkit-border-radius: 3px;   -o-border-radius: 3px;}

table.yeyakList td a.btn_view {background:#00ada4; width: 45%;}
table.yeyakList td a.btn_yeyak {background:#e26f50; width: 45%;}

.red {color:#CC0000; font-weight:bold;}

/*예약입력*/
.personal {float:left; width:93.5%; border: 1px solid #C9C9C9;margin: 0px 0 20px;padding:20px; height: 200px; overflow-y: scroll;font-size:14px!important;line-height: 22px;}
.personal h3{display:inline;color:#242629;margin:10px 0 0;line-height:24px;font-size:14px!important}
.personal h4{display:inline;color:#242629;margin:10px 0 0;line-height:24px;font-size:14px!important}
.personal p.p_h4 { clear:both;line-height:20px;color:#5e646e;padding:0 0 15px}
.chkperson {float:left; width:98%; text-align:center;line-height:20px;padding-bottom:20px;color:#5e646e;border-bottom:1px dashed #6e7e97;}
.personal .c_blud,
.personal .c_blue{color:#3C71DC;font-weight:bold}
.personal table{width:98%;border-top:2px solid #50585e;border-bottom:1px solid #d3d5d7;border-left:1px solid #d3d5d7;margin:5px 0 10px 0; font-size:14px;border-spacing:0;empty-cells: show;border-collapse:collapse}
.personal table th{color:#615959;padding:15px 0 10px 0;background:#f6f6f6;border-right:1px solid #d3d5d7;border-bottom:1px solid #d3d5d7; line-height: 20px;text-align:center}
.personal table td{color:#656b70;padding:8px 5px 5px 7px;border-right:1px solid #d3d5d7;border-bottom:1px solid #d3d5d7; line-height: 20px;;text-align:center}

/*신청완료div*/
div.btnBox {clear:both; width:250px; margin:0 auto; padding:10px 0;}
div.btnBox02 {clear:both; width:50%; margin:0 auto; padding:10px 0;}

/*체육시설소개*/
.tapMenu02 { float:left; width:99%; margin:10px 0 10px 2px; background:url(/images/suncheon/yeyak/sub/pattern.gif) repeat;}
.tapMenu02 ul {float:left;margin-top:25px; width:96%; }
.tapMenu02 ul li {float:left; font-size:16px;line-height:30px;}
.tapMenu02 ul li a {  background:url(/images/suncheon/yeyak/contents/teb_off.gif) left center no-repeat;padding:10px 30px;color: #5e646d;   }
.tapMenu02 ul li.on a {  background:url(/images/suncheon/yeyak/contents/teb_on.gif) left center no-repeat;padding:10px 30px;color: #434c5a; font-weight:bold;}

.athletic {float:left; width:98%;margin:10px 0 0 10px;}
.athletic p.img {float:left;  border-radius:5px;}
.athletic dl {float:left; margin-left:20px;width:57%;}
.athletic dl dt {font-size:14px;display:block;color:#4b5156;line-height:20px;padding:5px 0 3px 8px;background:url(/images/suncheon/yeyak/sub/dt_cStyle.gif) left 13px no-repeat; /*font-weight:bold;*/}
.athletic dl dd {color:#656c72;margin:5px 0 0 12px;padding:0 0 0 8px;background:url(/images/suncheon/yeyak/sub/dd_cStyle.gif) left 8px no-repeat; line-height:18px;}

.athletic p.btn_reserve {float:right; width:100px;margin:10px 0 0 0;}
.athletic p.btn_reserve a {padding:10px 0; font-size:16px;display:block; text-align:center; color:#fff; background: #FF6600;border-radius:3px; -moz-border-radius: 3px;   -webkit-border-radius: 3px;   -o-border-radius: 3px;}


div.btn_reserve {float:left; width:98%;margin:20px 0;}
div.btn_reserve a {margin:0 auto; width:200px;padding:10px 0; font-size:16px;display:block; text-align:center; color:#fff; background: #FF6600;border-radius:3px; -moz-border-radius: 3px;   -webkit-border-radius: 3px;   -o-border-radius: 3px;}

div.btn_reserveR {float: right; margin:-48px 10px 15px;; text-align: right;}
div.btn_reserveR a {width:200px;padding:10px 0; font-size:16px;display:block; text-align:center; color:#fff; background: #FF6600;border-radius:3px; -moz-border-radius: 3px;   -webkit-border-radius: 3px;   -o-border-radius: 3px;}

a.btn_return,
a.btn_complete,
a.btn_cancle,
a.btn_cardpay {display:block; text-align:center; color:#fff;border-radius:3px; -moz-border-radius: 3px;   -webkit-border-radius: 3px;   -o-border-radius: 3px;}

a.btn_return {padding:8px; background:#00ada4 url(/images/suncheon/yeyak/sub/reset.png) 10px center no-repeat; width:70px;}

a.btn_complete {padding:10px; width:100px; background:#e26f50; font-size:16px;}
a.btn_cancle {padding:10px; width:100px; background:#888d96;font-size:16px;}
a.btn_cancle02 {padding:10px; width:50px; background:#888d96;font-size:14px;}
a.btn_cardpay {padding:10px; width:140px; background:#59b6d7; font-size:16px;}

/*관심상품*/
.likeList {float:left; margin-left:5px;}
.likeList ul li {width:24%; margin-right:5px;}
.likeList ul li a.on {display:block; padding:2px 0;}


/* table */
table.table-a{width: 97%; border-top:2px solid #50585e; border-right: 1px solid #ddd; border-collapse:collapse; border-spacing:0;}
table.table-a th, table.table-a td{border-left: 1px solid #ddd; border-bottom: 1px solid #ddd; text-align: center; padding: 7px 2px; line-height: 17px;}
table.table-a th{font-weight: normal; background: #f5f5f5;}
table.table-a td{font-size: 12px;}

/****태블릿****/
@media all and (max-width:1098px){
.likeList ul li {width:23%; margin:0 1% 1% 0;}


}


/*** 태블릿  ***/
@media all and (max-width:768px){
div.btnBox02 {width:60%;}
div.tapMenu {height:auto!important; border-bottom:none;}
.whitebox {width:98.5%;}
.tapMenu ul li{ width:32%;}
    div.tapMenu ul li.on a{padding:10px 0 6px}
    div.tapMenu ul li a{display:block;width:100%;padding:10px 0 6px;text-align:center}
.tapMenu02 ul li { width:30%;}
.likeList ul li {width:32%; margin:0 1% 1% 0;}

.athletic p.img {width:35%;}
.athletic p.img img {width:100%;}
.athletic dl {width:60%;}

/* step01 버튼 크기 */
table.yeyakList td a { display: block; }
table.yeyakList td a.btn_yeyak { width: 95%; }
table.yeyakList td a.btn_view { width: 95%; }
}

/*** Mobile  ***/
@media all and (max-width:690px){




}

/*** Mobile  ***/
@media all and (max-width:480px){

.content02 table.cStyle {width:91% !important;}
.content02 p.cstyle img {width:95%;}


div.tapMenu {height:auto;padding-bottom:0  !important;}

.beforePage { padding-right:10px;}

.whitebox {width:97.3%;}
.whitebox p.calmonth {position: relative; clear:both; top:0; right:0; margin:0 auto;min-height:60px;}

/*step01.jsp에 예약신청일 부분*/
.whitebox p.calmonth span.txtRsvYmd { width: 99%; padding: 0; text-align: center; }
.whitebox p.calmonth span.txtRsvYmd2 { width: 99%; padding: 5px 0 0 0; text-align: center; }

.yeyakbox {overflow-x:scroll;clear:both; width:98%;}

.personal {width:90.5%;padding:20px 15px;}

div.btnBox02 {width:100%; }
div.btnBox02 a {padding:10px 5px; width:auto; font-size:14px;}

.tapMenu02 { width:97.5%;}
.tapMenu02 ul { width:90%;}
.tapMenu02 ul li { width:49%; font-size:14px; letter-spacing:-1px;}
.tapMenu02 ul li a,
.tapMenu02 ul li.on a {padding:10px 0 10px 25px;}

.athletic {border-bottom:1px solid #ccc; width:93%;margin-bottom:20px;}
.athletic p.img {width:95%;}
.athletic dl {float:left; width:95%;margin:20px 0 15px 0;}
.athletic p.btn_reserve {margin:0 0 10px;}

.scroll {float:left;overflow:auto; width:94%;}

.likeList ul li {width:96%; margin:0 0 1% 0;}

table.yeyakList td a.btn_yeyak { width: 90%; }
table.yeyakList td a.btn_view { width: 90%; }
}

/*꽃가람 야영장*/
.AlignCenter img {width: 100%;}
.camp_st {margin-left: 18px !important;}

.campbtn {float:left;width: 100%;background: #fff;text-align: center;margin-top: 20px;padding: 20px 0;background: #eee;}
.campbtn li {display: inline-block;margin: 35px 12px;}
.campbtn li a {background: #fff;border: 1px solid #a8b1bf;color: #000;padding: 15px 60px;font-size: 18px;}

.camp_ba {background: #f0e400 !important;border: none !important;}
.camp_bb {background: #f39700 !important;border: none !important;}
.camp_bc {background: #7ec2e8 !important;border: none !important;}
.camp_bd {background: #e080b1 !important;border: none !important;}


.amenities {border: 1px solid #cecece;display: inline-block;width: 48%;margin-left: 1%;text-align: center;margin-top: 20px;}
.amenities_t {padding: 20px 0;font-size: 18px;font-weight: 500;border-top: 1px solid #cecece;background: #fff;}
.amenities div .img100 {width: 100%;}

.camp_b li {margin: 10px;width: 20%;}
.camp_b li a {padding: 10px 0;line-height: 30px;width: 100%;display: inline-block;font-weight: 600;color: #fff;font-size: 16px;line-height: 25px;}
/*.campbtn.camp_b li a span {font-weight: 600;}*/


@media all and (max-width:990px){
.campbtn li {margin: 35px 5px;}
.campbtn li a {padding: 15px 50px;}

.camp_b li a {padding: 0;}
}

@media all and (max-width:840px){
.campbtn li a {padding: 15px 30px;}
.camp_b li a {padding: 0;}
}

@media all and (max-width:665px){
.campbtn li {margin: 35px 1px;}
.campbtn li a {padding: 15px 20px;}
.camp_b li {margin: 10px 5px;width: 45%;}
.camp_b li a {padding: 0;}
}

@media all and (max-width:550px){
.amenities_t {padding: 15px 0;font-size: 15px;}
}
@media all and (max-width:542px){
.campbtn li a {width: 75%;display: block;}
.campbtn li {margin: 5px 2px;width: 45%;}
.camp_b li a {width: 100%;}
}
@media all and (max-width:370px){
.amenities_t {padding: 12px 0;font-size: 12px;}
}

/*관광약자이동차량 - 관광택시*/
.yeyak_taxi{clear:both;text-align:center;font-size:14px;line-height:30px;width:100%;background-size:contain}
.yeyak_taxi .yeyak_img{margin-top:20px;width:100%}
.yeyak_taxi .yeyak_img img{width:99%}
.yeyak_box{float:left;width: 99%;margin: 10px 0 10px 2px;background: url(/images/suncheon/yeyak/sub/pattern.gif) repeat;}
.yeyak_box .whitebox{width:calc(99% - 3px);padding:20px 0}
.float_none{float:none!important}
.taxi_point{background:#fff660;font-weight:600;color:#000}

.mo_500{display:none}
@media all and (max-width:500px){
    .pc_768{display:none}
    .mo_500{display:block}
}

.ch_img{clear:both;width:96.5%;margin-left:20px}