@charset "utf-8";

/*sub layout*/
#header .go_link > a::before, #header .search_btn, #header .nav_open::before { background-position:0 100%; }
#header h1 a, #header #nav .depth1 > li > a, #header .go_link > a { color:#222; text-shadow:none; }

#go_top { display:none; position:fixed; right:20rem; bottom:20rem; width:50rem; height:50rem; background:rgba(0,0,0,0.7); color:#fff; text-align:center; font-size:12rem; padding:22rem 0 0; letter-spacing:1rem; border-radius:5rem; z-index:50; }
#go_top::before {content:''; position:absolute; left:50%; top:17rem; width:6rem; height:6rem; border-top:2px solid #fff; border-left:2px solid #fff; transform:rotate(45deg) translate(-50%, 0); }

#snb { margin:90rem 0 0; height:52rem; border-top:1px solid #d9d9d9; border-bottom:1px solid #d9d9d9; }
h3 {clear:both; text-align:center; font-size:40rem; font-family:'GmarketSans', 'Pretendard', sans-serif; padding:40rem 0 0; }
.location { float:left; border-left:1px solid #d9d9d9; }
.location li { position:relative; float:left; width:250rem; border-right:1px solid #d9d9d9; border-bottom:1px solid #d9d9d9; }
.location li > a {display:block; padding:10rem 30rem 0 20rem; height:50rem; color:#4d4d4d; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; }
.location li > a::before { content:''; position:absolute; right:20rem; top:18rem; width:8rem; height:8rem; background:linear-gradient(45deg, #8f8f8f 50%, transparent 50%); transform:rotate(-45deg); }
.location li:last-of-type > a {color:#222; font-weight:600; }
.location li:last-of-type > a::before {background:linear-gradient(45deg, #222 50%, transparent 50%);}
.location div { display:none; position:absolute; left:-1px; top:50rem; width:100%;  border:1px solid #d9d9d9; box-sizing:content-box; padding:10rem 0; background:#fff; z-index:100; }
.location div a { display:block; font-size:16rem; padding:5rem 20rem;}
.location div a span { position:relative; display:inline-block; }
.location div a.on {font-weight:600;}
.location div a.on span::before { content:''; position:absolute; left:0; bottom:0; width:100%; height:3rem; background:#ffba01; }
.util { position:relative; float:right;}
.util > a { position:relative; display:block; float:left; width:45rem; height:50rem; text-indent:-999999px; }
.util > a::before { content:''; position:absolute; left:50%; top:50%; width:30rem; height:30rem; background:url('/design/tour/img/layout/util.png') no-repeat 0 0/300% auto; transform:translate(-50%, -50%); }
.util > a.copy_link::before {background-position:50% 0;}
.util > a.print::before {background-position:100% 0;}
.util div { display:none; position:absolute; left:0; top:50rem;}
.util div a {display:block; width:40rem; height:40rem; background:#455E99 url('/design/tour/img/sub/sns.png') no-repeat 100% 0/200% auto; border-radius:50%; text-indent:-99999px; margin:5rem; }
.util div a.twitter {background-color:#2BA9E0; background-position:0 0;}
@media all and (max-width:1023px){
  .location {width:100%;}
  .location li { width:25%; }
}
@media all and (max-width:768px){
  #snb.num3, #snb.num4 {height:104rem;}
  .location li { width:50%; }
}

/*sub_common*/
#contents {padding:40rem 0; overflow:hidden;}
h4 { font-size:28rem; font-family:'GmarketSans', 'Pretendard', sans-serif; margin:40rem 0 20rem; }
h4.first {margin:0 0 20rem;}
h5 { font-size: 23rem; font-weight: 700; color: #0c8360; margin:30rem 0 10rem;}
.section {overflow:hidden; border-top:1px solid #eee; margin:40rem 0 0; padding:40rem 0 0;}
.section h4 {float:left; width:300rem; margin:0 0 20rem; }
.section > div {float:right; width:calc(100% - 360rem); }
.dep_1 > li { position:relative; padding:5rem 0 5rem 13rem; }
.dep_1 > li::before {content:''; position:absolute; left:0; top:17rem; width:5rem; height:5rem; background:#333; border-radius:2rem; }
.dep_2 > li { position:relative; padding:3rem 0 3rem 13rem; font-size:16rem; }
.dep_2 > li::before {content:''; position:absolute; left:0; top:15rem; width:5rem; height:1px; background:#333; }
.tblWrap {margin:15rem 0; overflow-x:auto;}
.tblWrap table {border-collapse: separate; width:100%; margin-left:-1px; border-top:2px solid #434343; text-align:center;}
.tblWrap table thead th {padding:20rem; font-weight:500; border-bottom:1px solid #434343; background:#f8f8f8; border-left:1px solid #ddd;}
.tblWrap table tbody th,
.tblWrap table tbody td {padding:15rem; border-bottom:1px solid #ddd; background:#fff; border-left:1px solid #ddd;}
.tblWrap table tbody th {background:#f8f8f8; font-weight:500;}
.tblWrap.pad10 table tbody td {padding:10rem;}
.tblWrap.pad10 table tbody td a.whiteBtn {padding:5rem 40rem 5rem 20rem;}
@media all and (max-width:1023px){
  .section h4 {width:100%; margin:0 0 20rem; }
  .section > div {width:100%;}
}
@media all and (max-width:768px){
	.tblWrap.scroll table {width:768px;}
}
@media all and (max-width:480px){
	.tblWrap.pad10 table tbody td a.whiteBtn {padding:5rem 35rem 5rem 15rem;}
}

/*여행코스추천*/
.recom_course { position:relative; background:url('/design/tour/img/sub/course_bg2.jpg') center;}
.recom_course::before {content:''; position:absolute; left:0; top:0; width:100%; height:450rem; background:#fff url('/design/tour/img/sub/course_bg.png') no-repeat center top; }
.recom_course .wrap { position:relative; z-index:10; padding:190rem 0 0; }
.recom_course .top {overflow:hidden;}
.recom_course .top li { position:relative; float:left; text-align:center; margin:10rem 0;}
.recom_course .top .img { position:relative; width:220rem; height:220rem; background-repeat:no-repeat; background-size:cover; background-position:center; border-radius:50%; border:7rem solid #fff; box-shadow:0 0 7rem rgba(0,0,0,0.3); margin:0 auto; }
.recom_course .top .txt { position:relative; font-size:18rem; padding:0 10rem; line-height:1.4; }
.recom_course .top .txt::before,
.recom_course .top .txt::after {content:''; position:absolute; left:0; width:100%; }
.recom_course .top .txt::before { top:18rem; border-top:1px dashed rgba(0,0,0,0.2); z-index:-1; }
.recom_course .top .txt::after { top:12rem; height:12rem; background:rgba(0,0,0,0.1); z-index:-1; }
.recom_course .top li:first-of-type .txt::before, .recom_course .top li:first-of-type .txt::after {width:50%; left:50%;}
.recom_course .top li:last-of-type .txt::before, .recom_course .top li:last-of-type .txt::after {width:50%; }
/*
.recom_course .top .txt strong { display:block; width:35rem; height:35rem; line-height:27rem; font-size:19rem; color:#fff; border-radius:50%; border:4rem solid #fff; box-shadow:0 0 7rem rgba(0,0,0,0.3); margin:10rem auto; background:#f26100; }
*/
.recom_course .top .txt strong { display:block; width:40rem; height:50rem; line-height:45rem; font-size:19rem; color:#fff; margin:10rem auto; background:url('/design/tour/img/sub/course_pin2.png') no-repeat center/cover; }
.recom_course .top li.type2 .img::before { content:'숙소'; position:absolute; right:-30rem; top:0; width:72rem; height:75rem; background:url('/design/tour/img/sub/type2_icon.png') no-repeat center/100% auto; font-family:'GmarketSans', 'Pretendard', sans-serif; font-size:15rem; color:#fff; padding:38rem 0 0; box-sizing:border-box; z-index:1; }
.recom_course .top li.type2 .txt strong { background-image:url('/design/tour/img/sub/course_pin3.png'); }
.recom_course .top .distance {position:absolute; right:0; top:180rem; background:#fff; border:1px solid #c4c4c4; padding:2rem 15rem; border-radius:20rem; font-weight:700; transform:translate(50% ,0); z-index:10; }
.recom_course .top_type2 .title {text-align:center; margin:30rem 0 15rem;}
 .recom_course .top_type2 .title > * {display:inline-block; /*vertical-align:top;*/}
.recom_course .top_type2 .title p { font-size:30rem; font-weight:800; text-align:center; margin:0 10rem 0 0; }
.recom_course .top_type2 .title span {display:inline-block; font-size:20rem; font-weight:600; color:#fff; background:#03a273; border-radius:30rem; padding:3rem 20rem; margin:5rem 0 0 7rem; }

.recom_course .top_type2 .title a{margin-left: 10rem; color: #1f4167; border: 2px solid #1f4167; border-radius: 30px; padding: 2rem 15rem; font-weight: bold; transition: 0.2s;}
.recom_course .top_type2 .title a:hover{color: #fff; background: #1f4167;}

.recom_course .top_type2 .title span:first-of-type { background:#067454; }
.recom_course .top_type2 li {margin:0;}
.recom_course .top_type2 .txt {font-weight:600;}
.recom_course .top_type2 .top:first-of-type .txt strong { background-image:url('/design/tour/img/sub/course_pin1.png'); }
.recom_course .top_type2 .txt span{color: #e30505; margin-right: 6rem;}

.recom_course .top_type2 > .img {max-width: 960rem;margin: 40rem auto 0;border-radius: 20rem;overflow: hidden;width: 100%;box-shadow: 1rem 1rem 7rem rgba(0, 0, 0, 0.15);}

.recom_course .bottom { padding:50rem 0; height:630rem; }
.recom_course .bottom > .map {float:left; width:calc(100% - 540rem); border-radius:20rem; box-shadow:1rem 1rem 7rem rgba(0,0,0,0.15); overflow:hidden; }
.recom_course .bottom #map {width:100%; height:530rem; }
.recom_course .bottom .list {float:right; width:500rem; height:530rem; border-radius:20rem; border:2px solid #ddd; background:#fff; padding:10rem 30rem; overflow:hidden; }
.recom_course .bottom .list div {overflow:hidden; margin:20rem 0; }
.recom_course .bottom .list a { position:relative; display:block; float:left; width:190rem; border:1px solid #d9d9d9; background:#000; overflow:hidden; }
.recom_course .bottom .list a::before {content:''; position:absolute; left:0; bottom:-100%; width:100%; height:100%; background:url('/design/tour/img/sub/course_on.png') no-repeat center; transition:0.3s; z-index:10; }
.recom_course .bottom .list a img { width:100%; opacity:1; transition:0.3s; }
.recom_course .bottom .list a:hover::before {bottom:0; }
.recom_course .bottom .list a:hover img { opacity:0.5; }
.recom_course .bottom .list dl {float:right; width:calc(100% - 210rem); }
.recom_course .bottom .list dt { position:relative; font-size:20rem; font-weight:700; margin:0 0 10rem; padding:0 0 0 38px;}
.recom_course .bottom .list dt strong { position:absolute; left:0; top:0; display:block; width:30rem; height:38rem; text-align:center; color:#fff; font-size:17rem; background:url('/design/tour/img/sub/course_pin.png') no-repeat center/cover; padding:3rem 0 0;}
.recom_course .bottom .list dd {position:relative; padding:0 0 0 40rem; }
.recom_course .bottom .list dd strong {position:absolute; left:0; top:0; }
.nicescroll-cursors {width:9rem !important; background-color:rgba(0,0,0,0.4) !important; margin:0 10rem 0 0; }
@media all and (max-width:1023px){
  .recom_course::before {background-size:auto 100%; height:400rem;}
  .recom_course .top .img {width:180rem; height:180rem;}
  .recom_course .top .distance {top:150rem;}
}
@media (max-width:1023px) and (min-width:769px){
  .recom_course .bottom > .map {width:calc(100% - 330rem);}
  .recom_course .bottom .list {width:300rem;}
  .recom_course .bottom .list a {width:100%; margin:0 0 15rem;}
  .recom_course .bottom .list dl {width:100%;}
}
@media all and (max-width:768px){
  .recom_course::before { height:250rem;}
  .recom_course .wrap {padding:130rem 0 0;}
  .recom_course .top li {width:33.33% !important;}
  .recom_course .top li:nth-of-type(3n+1) {clear:both;}
  .recom_course .top li.type2 .img::before {width:55rem; height:57rem; padding:26rem 0 0;}
  .recom_course .top .img {width:130rem; height:130rem;}
  .recom_course .top .distance {top:115rem; transform:none;}
  .recom_course .bottom {height:720rem;}
  .recom_course .bottom > .map { width:100%; height:300rem; }
  .recom_course .bottom .list { width:100%; height:300rem; margin:20rem 0 0;}
  .recom_course .bottom .list div { width:48%; float:right; }
  .recom_course .bottom .list div:nth-of-type(2n+1) {clear:both; float:left;}
  .recom_course .bottom .list a {width:130rem;}
  .recom_course .bottom .list dl {width:calc(100% - 150rem);}
}
@media all and (max-width:600px){
  .recom_course .bottom .list a {width:100%; margin:0 0 15rem;}
  .recom_course .bottom .list dl {width:100%;}
}
@media all and (max-width:480px){
  .recom_course .top li {width:50% !important;}
  .recom_course .top li:nth-of-type(3n+1) {clear:none;}
  .recom_course .top li:nth-of-type(2n+1) {clear:both;}
  .recom_course .top_type2 .title p { display:block; margin:0 0 10rem;}
}


/*코스 갯수별 css
.recom_course .top.num2 li { width:50%; }
.recom_course .top.num3 li { width:33.33%; }
.recom_course .top.num4 li { width:25%; }
.recom_course .top.num5 li { width:20%; }
.recom_course .top.num6 li { width:16.66%; }*/


/*페스티벌*/
.festival .subTitlte { text-align:center; font-size:25rem; margin:20rem auto 50rem; }
.festival .go_link_btn { position:relative; display:inline-block; font-size:19rem; font-weight:600; color:#fff; border-radius:30rem; padding:10rem 60rem 10rem 25rem; margin:20rem 0 0; background:#03A273; transition:0.3s; }
.festival .go_link_btn:hover {background:#0c8360;}
.festival .go_link_btn::before {content:''; position:absolute; right:15rem; top:50%; width:30rem; height:30rem; background:#fff; border-radius:50%; transform:translate(0,-50%); }
.festival .go_link_btn::after {content:''; position:absolute; right:31rem; top:50%; width:8rem; height:8rem; border-top:3px solid #444; border-right:3px solid #444; transform:rotate(45deg) translate(0, -70%); }
.festival .top { background:linear-gradient(90deg, #ebf5f2 50%, #fff 50%); }
.festival .top .wrap {position:relative;}
.festival .top .character { position:absolute; right:0; bottom:20rem; }
.festival .top .wrap > div { width:90%; background:#ebf5f2; border-radius:0 20rem 20rem 0; padding:50rem 250rem 50rem 0; }
.festival .top dt { font-size:25rem; font-weight:600; color:#213642; margin:0 0 20rem; }
.festival .top dd { margin:0 0 30rem; }
.festival .top ul { border-top:1px dashed #aaa; border-bottom:1px dashed #aaa; padding:10rem 20rem; }
.festival .top li { position:relative; padding:8rem 0 8rem 150rem; }
.festival .top li::before {content:''; position:absolute; left:0; top:8rem; width:30rem; height:30rem; background:#333 url('/design/tour/img/sub/festival_icon.png') no-repeat 0 0/200% auto; border-radius:50%; }
.festival .top li.place::before {background-position:100% 0;}
.festival .top li::after { content:''; position:absolute; left:120rem; top:13rem; height:20rem; width:1px; background:#bbb; }
.festival .top li strong { position:absolute; left:40rem; top:8rem; }
.festival .img {position:relative; height:900rem; margin:40rem auto; }
.festival .img a {display:block; position:absolute; border:3px solid #fff; overflow:hidden; }
.festival .img a span { display:block; position:absolute; left:0; top:0; width:100%; height:100%; text-indent:-99999px; background-size:cover; background-position:center; transition:0.5s; }
.festival .img a:hover span { transform:scale(1.1);}
.festival .img a:nth-of-type(1) { left:0; top:0; width:50%; height:50%; }
.festival .img a:nth-of-type(2) { right:0; top:0; width:50%; height:50%; }
.festival .img a:nth-of-type(3) { left:0; bottom:0; width:50%; height:50%; }
.festival .img a:nth-of-type(4) { right:0; bottom:0; width:50%; height:50%; }
.festival .map .root_daum_roughmap, .festival .map .wrap_map { width:100% !important; height:400rem !important; }
.festival .map .hide, .festival .map .map_border {display:none !important; }
.festival .section {position:relative; }
.festival .section h4 { float:none; width:100%; }
.festival .section > div {float:none; width:100%;}
.festival .public {position:absolute; left:0; top:120rem; width:300rem; }
.festival .public dt {font-size:23rem; font-weight:700; color:#0c8360; margin:0 0 10rem; }
.festival .public dd {position:relative; padding:3rem 0 3rem 13rem; }
.festival .public dd::before {content:''; position:absolute; left:0; top:15rem; width:5rem; height:5rem; background:#333; border-radius:2rem; }
@media all and (max-width:1023px){
  .festival .top .character {display:none;}
  .festival .top .wrap > div {width:100%; padding:50rem 3% 50rem 0;}
  .festival .img {height:500rem;}
  .festival .public {position:relative; left:auto; top:auto; width:100%; margin:30rem 0 0; }
}
@media all and (max-width:480px){
  .festival .img {height:300rem;}
  .festival .map .root_daum_roughmap, .festival .map .wrap_map { height:300rem !important; }
}

/*여행후기*/
.agreeWrap {overflow:hidden; margin:30rem 0 10rem; }
.agreeWrap .box {border:1px solid #cacaca; padding:30rem; }
.agreeWrap .box.scroll {height:300rem; overflow-y:auto;}
.agreeWrap .box dl {margin:30rem 0 0;}
.agreeWrap .box dl dt { font-weight:600; font-size:18rem; margin:0 0 10rem; }
.agreeWrap .box dl dd { background:#f8f8f8; padding:20rem; border:1px solid #ccc; }
.agreeWrap table { border-collapse:collapse; border-spacing:0; text-align:center; border-top:3px solid #222; width:100%; font-size:16rem; }
.agreeWrap table caption {position:absolute; top:-99999px; left:-99999px; line-height:0;}
.agreeWrap table thead th, .agreeWrap table tbody th {border-bottom:1px solid #222; padding:5rem 10rem; }
.agreeWrap table tbody th {border-bottom:1px solid #999; }
.agreeWrap table tbody td { text-align:left; padding:5rem 10rem; border-bottom:1px solid #ccc;}
.agree {overflow:hidden; margin:20rem 0 0; }
.agree .checkBtn {float:right; font-size:20rem;}
.agree .checkBtn input {margin:0 0 0 10rem;}
.agree .checkBtn label {margin:0 0 0 5rem;}
.redMent {position:relative; float:right; margin:0 0 20rem; padding:0 0 0 15rem; }
.redMent .redPoint, .form .redPoint { display:block; position:absolute; left:0; top:0; width:12px; height:12px; background:linear-gradient(135deg, #d51130 50%, transparent 50%); text-align:left; text-indent:-99999px; }
.form .row:first-of-type {border-top:1px solid #222; }
.form .row {display:table; width:100%;}
.form .col { position:relative; display:table-cell; width:80%; vertical-align: middle; padding:10rem 15rem; border-bottom:1px solid #cacaca}
.form .col:nth-of-type(2n-1){ width:20%; background:#f6f6f6; text-align:center; }
.form input, .form select, .form textarea { margin:0; padding:0 10rem; line-height:40rem; height:40rem; border:1px solid #aaa; width:100%; }
.form input[type="radio"] {width:auto; height:auto; line-height:normal; }
.form textarea {height:300rem;}
.form .address a {display:inline-block; background:#ef3e5a; color:#fff; line-height:40rem; height:40rem; padding:0 10rem; font-size:16rem; margin:0 5rem 0 0; box-sizing:content-box; vertical-align:top; }
.form .address input { margin:5rem 0 0; }
.form .address > div:first-of-type input {max-width:120rem; margin:0;}
.form #wrap { display:none; position:relative; max-width:500rem; }
.form #__daum__layer_1 { margin:20rem 0 0 !important; }
.form #btnFoldWrap {position:absolute; right:0; top:-20rem; z-index:10; }
.form .small { position:relative; font-size:16rem; margin:5rem 0 0; padding:0 0 0 17rem; }
.form .small::before {content:'※'; position:absolute; left:0; top:0; }
.form a.link {color:#0066b3 ; text-decoration:underline; }
.tour_review .bod_head .bod_search input[type='text'] { width:calc(100% - 220rem); }
@media all and (max-width:480px){
  .form .col {width:65%;}
  .form .col:nth-of-type(2n-1) {width:35%;}
}

/*성주관광지도*/
.tour_map { border:1px solid #ccc; border-radius:10rem; height:500rem; }
@media all and (max-width:480px){
  .tour_map { height:300rem; }
}

/*관광책자 신청*/
.request_no { width:12%; }
.request_writer { width:15%; }
.request_count { width:12%; }
.request_date2 {  width:25%; }
.request_state { width:15%; }
.type2 .request_no { width:8%; }
.type2 .request_writer { width:10%; }
.type2 .request_count { width:8%; }
.type2 .request_date {  width:28%; }
.type2 .request_date2 {  width:20%; }
.type2 .request_state { width:11%; }
@media all and (max-width:768px){
  .request_no, .request_date2 { display:none;}
  .request_writer { width:24%; }
  .request_count { width:21%; }
  .request_state { width:24%; }
  .type2 .request_writer { width:15%; }
  .type2 .request_count { width:13%; }
  .type2 .request_date {  width:35%; }
  .type2 .request_state { width:15%; }
}
@media all and (max-width:480px){
  .type2 .request_date { display:none;}
  .type2 .request_writer { width:24%; }
  .type2 .request_count { width:21%; }
  .type2 .request_state { width:24%; }
}

/* board 관련 수정 */
.bod_guide .cont {font-size:16rem;}
.bod_page .next, .bod_page .prev {position:relative; display:inline-block; top:auto; right:auto; width:30px; height:30px; line-height:30xp; }
.srch_wrap input, .srch_wrap a, #req_password {border:1px solid #ccc; padding:0 10rem !important; line-height:40rem; height:40rem; }
.srch_wrap a { display:inline-block; border:1px solid #ccc;}
.bod_btn a, .bod_head .bod_search > * {line-height:40rem !important; height:40rem !important; }
.password_wrap .title {font-size:18rem;}
.password_wrap div p {font-size:16rem; }
.bod_list th, .bod_list td {font-size:17rem;}
.bod_list .list_tit a {padding:0; vertical-align:top; }
.bod_list td { color:#666; }
.bod_list .list_tit a:hover {color:#0066b3; text-decoration:underline; }
.bod_head .bod_search input[type='text'] {width:calc(100% - 180rem);}