@charset "utf-8";

/*sub layout*/
#header {border-bottom:1px solid #e1e1e1;}
#container > .wrap { position:relative; /*max-width:1800rem;*/ margin:0 auto; padding:0 60rem; overflow:hidden; margin:90rem 0 0;}
#container > .wrap::before {content:''; position:absolute; left:340rem; height:100%; width:1px; background:#e1e1e1; }
@media all and (max-width:1400px){
  #container > .wrap {padding:0 3%;}
  #container > .wrap::before {left:calc(3% + 280rem);}
}
@media all and (max-width:1023px){
  #container > .wrap::before {display:none;}
}

#snb {float:left; width:280rem; margin:90rem 0 0;}
#snb.fixed {position:fixed; top:0; margin:30rem 0 0; }
#snb h2 { font-family:'Gowun Batang', serif; font-size:25rem; margin:0 0 20rem 15rem; }
#snb .depth1 > li { position:relative; padding:5rem 0; }
#snb .depth1 > li > a { display:inline-block; color:#666; padding:2rem 15rem;}
#snb .depth1 > li > a.on { background:#71302e; color:#fff; border-radius:20rem; }
#snb .depth1 > li > a::before {content:''; position:absolute; left:5%; top:20rem; width:0; height:1px; border-top:1px dashed #71302e; opacity:0.3; z-index:-1; transition:0.5s; }
#snb .depth1 > li > a::after {content:''; position:absolute; right:-5rem; top:15rem; width:10rem; height:10rem; border-radius:50%; background:#71302e; outline:5rem solid rgba(113, 48, 46, 0.3); opacity:0; transition:0.5s; }
#snb .depth1 > li > a.on::before { width:95%;  }
#snb .depth1 > li > a.on::after { opacity:1; }
#snb .depth2 { position:relative; display:none; padding:10rem 0 15rem; }
#snb .depth2::before {content:''; position:absolute; left:0; bottom:0; width:calc(100% - 20rem); height:1px; background:#ddd; }
#snb .depth2 > li > a { position:relative; display:inline-block; padding:3rem 0 3rem 27rem; font-size:16rem; color:#666; }
#snb .depth2 > li > a.on {font-weight:600;}
#snb .depth2 > li > a::before {content:''; position:absolute; left:12rem; top:15rem; width:4rem; height:4rem; background:#71302e; border-radius:50%; }
@media all and (max-width:1023px){
  #snb {display:none;}
}

.contentWrap {float:right; width:calc(100% - 350rem); }
.contentWrap .loca {margin:30rem 0 20rem ; overflow:hidden;}
.contentWrap .loca a { position:relative; display:block; float:left; color:#666; margin:0 40rem 0 0; line-height:30rem;}
.contentWrap .loca a:first-of-type {width:22rem; height:30rem; background:url('/design/hwarang2022/img/sub/home.png') no-repeat center; text-indent:-99999rem; }
.contentWrap .loca a::before {content:''; position:absolute; left:-25rem; top:10rem; width:8rem; height:8rem; border-top:1px solid #999; border-right:1px solid #999; transform:rotate(45deg); }
.contentWrap .loca a:first-of-type::before {display:none;}
.contentWrap h3 { font-family:'Gowun Batang', serif; font-size:40rem; font-weight:800; }
@media all and (max-width:1023px){
  .contentWrap {float:none; width:96%; margin:0 auto;}
}

#contents {padding:60rem 0; min-height:500rem;}
table {border-collapse:separate;}

/*알림창*/
.popupWrap {overflow:hidden;}
.popupWrap li {float:left; width:23.5%; margin:0 0 20rem 2%;}
.popupWrap li:nth-of-type(4n+1) {clear:both; margin:0 0 20rem;}
.popupWrap li a {display:block;}
.popupWrap li img {width:100%;}
@media all and (max-width:1400px){
  .popupWrap li { width:32%; }
  .popupWrap li:nth-of-type(4n+1) {clear:none; margin:0 0 20rem 2%;}
  .popupWrap li:nth-of-type(3n+1) {clear:both; margin:0 0 20rem;}
}
@media all and (max-width:768px){
  .popupWrap li { width:49%; margin:0 0 10rem 2%; }
  .popupWrap li:nth-of-type(3n+1) {clear:none; margin:0 0 10rem 2%;}
  .popupWrap li:nth-of-type(2n+1) {clear:both; margin:0 0 10rem;}
}

.daummap, .daummap .wrap_map { width:100% !important; height:500rem !important; }
.daummap .hide,
.daummap .map_border {display:none !important; }
@media all and (max-width:768px){
  .daummap, .daummap .wrap_map { height:300rem !important; }
}

/*기존sub.css 시작*/
.sub {background: url('/design/hwarang_180820/img/sub/sub_bg.jpg') no-repeat center top;}
@media all and (min-width:768px){
  .win768 {display: none; text-align:center;}

}
@media all and (max-width:768px){
	.win768 {margin-top:0 !important;}
	.win768 a {display:inline-block; padding:5rem 20rem; text-align:center;}
}
/* 기본뎁스*/
#contents { line-height:1.7; letter-spacing:-0.02em; color:#333;}
#contents h4,.h4 {margin:30rem 0 12rem; background:url('/design/hwarang_180820/img/sub/li_h4_bg.gif') no-repeat 0 7rem; font-weight:bold; font-size:25rem; padding-left:20rem;}
h4.first {margin-top:0 !important}
#contents h4:first-child {margin-top:0;}
#contents h5 {font-weight:bold; font-size:20rem; color:#8e6b43; margin-top:30rem; margin-bottom:10rem; }
#contents h6 {font-weight:bold; font-size:18rem; margin:10rem 0; /* display:inline; */}
#contents .li_dep01 {/*수정*/margin-left:9rem; line-height: 2.2}
#contents .li_dep01 > li {padding-left:12rem; background:url('/design/hwarang_180820/img/sub/li_dep01_bg.gif') no-repeat 0 17rem;}
#contents .li_dep02 > li {padding-left:13rem; background:url('/design/hwarang_180820/img/sub/li_dep02_bg.gif') no-repeat 0 17rem;}
#contents .li_dep03 > li {padding-left:9rem; background:url('/design/hwarang_180820/img/sub/li_dep03_bg.gif') no-repeat 0 13rem;}
#contents .li_dep04 > li {padding-left:9rem; background:url('/design/hwarang_180820/img/sub/li_dep04_bg.gif') no-repeat 0 11rem;}
@media all and (max-width:480px){
  #contents h4 {margin-top:25rem; font-size:19rem; /*background-size:20rem 20rem;*/ background-position:0 7rem;}
  #contents h5 {padding-left:17rem; font-size:16rem; background-position:0 8rem;}
}

/* box */
.txt_box {overflow:hidden; padding:14rem 20rem; font-weight:600; border:1px solid #d7d7d7; border-top:2rem solid #bb9850; background:#fafafa;}
.roundBox {width:100%; letter-spacing:-0.08em; text-align:center; vertical-align:top; background:#f4f4f4; border:1px solid #ccc; border-radius:10rem 10rem; box-sizing:border-box; overflow:hidden;}

/* table overflow scroll */
.tbl_wrap {overflow-x: auto; margin-top:10rem;}
.tbl_wrap table { font-size:18rem;}

/* table common */
.thL tbody th,
.tdL td {padding-left:10rem; text-align:left;}
.tdR td {padding-right:10rem; text-align:right;}
.tbl_wrap .tbl_guide { display: none; }

/* table style1 */
.tbl_st1 {margin-left:-1px; min-width:100%; margin-top:7rem; border-top:2rem solid #5b5852;}
.tbl_st1 th,
.tbl_st1 td { padding:5rem 1.5%;  line-height:1.8; border-left:1px solid #ccc; border-bottom:1px solid #ccc; border-top:0; text-align:center; border-spacing:0;}
.tbl_st1 td.taL {text-align: left !important; padding-left:1.5%;}
.tbl_st1 thead th {font-weight:600;  background:#fafafb;}
.tbl_st1 tbody th,
.tbl_st1 tfoot th {font-weight:600; background:#ededed;}
.tbl_st1 tbody td.txtL {text-align:left; padding-left:10rem;}


/* table style2 : 오른쪽 정렬*/
.tbl_st2 {min-width:100%; margin-top:9rem; border-left:1px solid #ccc; border-top:2rem solid #0080c7;}
.tbl_st2 th,
.tbl_st2 td {padding-top:6rem; padding-bottom:6rem; font-weight:600;  line-height:1.8; color:#5f5f5f; border-right:1px solid #ccc; border-bottom:1px solid #ccc; border-top:0; text-align:center; border-spacing:0;}
.tbl_st2 thead th {font-weight:600;  background:#f0f8fc;}
.tbl_st2 tbody th {background:#f5f5f5;}
.tbl_st2 tbody td {text-align:right; padding-right:10rem;}
.tbl_st2 tbody td.txtC {text-align:center; }

/* table style3 : 왼쪽 정렬*/
.tbl_st3 {margin-left:-1px; min-width:100%; margin-top:7rem; border-top:2rem solid #5b5852;}
.tbl_st3 th,
.tbl_st3 td {padding-top:15rem; padding-bottom:15rem; line-height:1.8; border-right:1px solid #ccc; border-bottom:1px solid #ccc; border-top:0; text-align:center; border-spacing:0;}
.tbl_st3 thead th {font-weight:600; background:#f0f8fc;}
.tbl_st3 tbody th {background:#f5f5f5; font-weight:600;}
.tbl_st3 tbody td {text-align:left; padding-left:2%;}
.tbl_st3 tbody td.txtC {text-align:center; padding-left:0rem; }
@media (max-width: 550px) {
    .tbl_st3 .exp {display:block;}
}

/* table common */
.thL tbody th,
.tdL td {padding-left:10rem; text-align:left;}
.tdR td {padding-right:10rem; text-align:right;}
table tr th:last-child, table tr td:last-child {border-right:#fff !important;}

/* etc */
.unit {text-align:right; font-size:13rem; color:#5f5f5f;}
.unit::after {content:""; display:block; width:100%; clear:both;}
.character {background:url('/design/hwarang_180820/img/sub/hwarang_img.jpg') no-repeat center center;}

/* iframe target*/
#hidden_frame {
	width: 0rem;
	height: 0rem;
	border-width: 0rem;
	border: 0rem;
	margin: 0rem;
	overflow: hidden;
}

iframe {width:100%; min-width:100%; border:none; margin:0; overflow:hidden; overflow-y:auto;}




/*버튼*/
.buttonWrap p {margin:10rem 0;}

.bt_top { display: inline-block; padding:7rem; border-radius:3rem; border:1px solid #c8d1db; }
.bt_top span { padding:0 12rem 0 2rem;  font-weight:600;  background:#ffffff url('/design/hwarang_180820/img/button/i_top.png') no-repeat right; color:#333; letter-spacing:-0.05em;}

.btL {display:inline-block; height:31rem; padding:0 24rem 0; border:2px solid #00a3a8; border-radius:8rem 8rem; font-weight:600; font-size:18rem; line-height:27rem; color:#117b7e; background:#ebf8f8;}
.btM {display:inline-block; height:26rem; padding:0 24rem 0; border:2px solid #00a3a8; border-radius:6rem 6rem; font-weight:600; font-size:15rem; line-height:25rem; color:#117b7e; background:#ebf8f8;}
.btS {display:inline-block; height:17rem; padding:0 22rem 0; border:1px solid #00a3a8; border-radius:4rem 4rem; font-weight:600; font-size:13rem; line-height:14rem; color:#117b7e; background:#ebf8f8;}
.btS_w50 {display:inline-block; height:17rem; padding:0 22rem 0; width:30rem; border:1px solid #00a3a8; border-radius:4rem 4rem; font-weight:600; font-size:13rem; line-height:14rem; color:#00a3a8; background:#ebf8f8;}

.bt_white { line-height:1.4em; display: inline-block; padding:5rem 12rem 5rem 7rem; border-radius:3rem; border:1px solid #c8d1db; background:#fff; font-weight:600;  color:#333; letter-spacing:-0.05em;}
.bt_white span.down { font-size:14rem; padding:3rem 12rem 3rem 7rem; background:url('/design/hwarang_180820/img/button/i_down.png') no-repeat right; }
.bt_white span.site { font-size:14rem; padding:0 20rem 0 3rem; background:url('/design/hwarang_180820/img/button/i_site.png') no-repeat right; }
.bt_white span.blank { font-size:14rem; padding:0 18rem 0 2rem; background:url('/design/hwarang_180820/img/button/i_blank.png') no-repeat right; }

.bt_white_s { display: inline-block; padding:0 7rem 0 5rem; border-radius:3rem; border:1px solid #c8d1db; background:#fff; font-size:13rem; color:#333; }
.bt_white_s span.down { padding:0 20rem 0 2rem; background:url('/design/hwarang_180820/img/button/i_down.png') no-repeat right; }
.bt_white_s span.blank { padding:0 18rem 0 2rem; background:url('/design/hwarang_180820/img/button/i_blank.png') no-repeat right; }


.bt_blue { line-height:1.4em; display: inline-block; padding:5rem 12rem 5rem 7rem; border-radius:3rem; border:1px solid #1160a4; background:#1160a4; font-weight:600;  color:#fff; letter-spacing:-0.05em;}
.bt_blueL {padding:13rem 30rem;}
.bt_blueL > span { font-size:16rem !important;}
.bt_blue span.down { font-size:14rem; padding:0 20rem 0 2rem; color:#fff !important; background:url('/design/hwarang_180820/img/button/i_down_w.png') no-repeat right; }
.bt_blue span.site { font-size:14rem; padding:0 20rem 0 3rem; color:#fff !important; background:url('/design/hwarang_180820/img/button/i_site_w.png') no-repeat right }
.bt_blue span.blank { font-size:14rem; padding:0 18rem 0 2rem; color:#fff !important; background:url('/design/hwarang_180820/img/button/i_blank_w.png') no-repeat right; }
.bt_blue span.glasses { font-size:14rem; padding:0 18rem 0 2rem; color:#fff !important; background:url('/design/hwarang_180820/img/button/i_glasses.png') no-repeat right; display:block; }


.bt_blue_s { display: inline-block; padding:0 7rem 0 5rem; border-radius:3rem; border:1px solid #1160a4; background:#1160a4; font-size:13rem; color:#fff; }
.bt_blue_s span.down { padding:0 20rem 0 2rem; color:#fff !important; background:url('/design/hwarang_180820/img/button/i_down_w.png') no-repeat right; }
.bt_blue_s span.blank { padding:0 18rem 0 2rem; color:#fff !important; background:url('/design/hwarang_180820/img/button/i_blank_w.png') no-repeat right; }
.bt_blue_s span.glasses { padding:0 18rem 0 2rem; color:#fff !important; background:url('/design/hwarang_180820/img/button/i_glasses.png') no-repeat right; }

.bt_red_s{display: inline-block; padding:0 7rem 0 5rem; border-radius:3rem; border:1px solid #c52f1b; background:#c52f1b; font-size:13rem; color:#fff; }

.bt_R_blank{color:#1160a4; padding:0 18rem 0 2rem; background:url('/design/hwarang_180820/img/i_blank_blue.png') no-repeat right center; }

/* 이미지*/
.photo1 {/*max-width:100%;*/ width:100%; margin-bottom:10rem;}

.photo2 {overflow:hidden; margin-bottom:20rem;}
.photo2 li { position:relative; float:left; width:49%; margin-right:2%; text-align:center; box-sizing:border-box; }
.photo2 li.last {float:right; margin-right:0;}
.photo2 li img {width:100%; box-sizing:border-box;}
.photo2 li span {position: absolute; left:0; top:0; background:#8e6b43; color:#fff; padding:0 30rem; }
.photo2 p {margin-bottom:10rem; font-weight:bold; padding:5rem 10%; background:#0064ab; color:#fff; display:inline;}
@media all and (max-width:480px){
.photo2 li { width:100%; margin-bottom:10rem;}
}

.photo3 { overflow:hidden; }
.photo3 li { float:left; width:32%; margin-right:2%; text-align:center;}
.photo3 li.last {margin-right:0;}
.photo3 li img {width:100%;}
.photo3 li span { display:block;  }
@media all and (max-width:768px){
.photo3 li {width:49%; margin-right:1%; margin-bottom:10rem;}
}
@media all and (max-width:480px){
.photo3 li { width:100%; }
}

.photo4 { overflow:hidden; }
.photo4 li {position:relative; width:24.25%; margin-right:1%; float:left; margin-bottom:20rem; }
.photo4 li.last {margin-right:0;}
.photo4 li span {position: absolute; left:0; top:0; background:#8e6b43; color:#fff; padding:0 30rem; }
.photo4 img { width:100%; height:auto;}
@media all and (max-width:768px){
.photo4 li { width:49%; margin-right:1%; margin-bottom:10rem;}
}
@media all and (max-width:480px){
.photo4 li { width:100%; }
}

.img_brd,
.list_brd li {border:1px solid #ddd; box-sizing:border-box; padding-bottom:10rem; /* line-height:0 !important;*/}
.img_pBrd,
.list_pBrd li {border:1px solid #ddd; box-sizing:border-box; padding:1%; line-height:0 !important;}



.btnWrap {clear:both; width:100%; text-align:center; margin-top:30rem;}
/*.btnWrap button {border:0; display:inline-block; margin:0 auto; width:50%; background-image:url('/design/hwarang_180820/img/sub/btn_bg.png'); background-repeat:repeat-x; background-position:left bottom; padding:10rem 0;}*/
.btnWrap button { display:inline-block; width:23%; padding:7rem 20rem; margin:3rem 0; background:#396699; border:1px solid #335c89; color:#fff; font-weight:600;}
.btnHalf a {width:20% !important;}
.btn_ok { display:inline-block; background-color:#396699; padding:0 5rem; color:#fff;}
.btn_no,
.btn_back {background-color:#b9b9b9; color:#333;}
@media all and (max-width:768px){
.btnWrap button { width:50%; }
}

/*집회시설*/
/*.placeTbl table img {display:none;} 240724 시설안내>대관시설 : 표 안 이미지보기 때문에 주석처리*/
.placeTbl td > a,
.placeTbl th > a {display:inline-block; border:1px solid #ccc; background:#fff url('/design/hwarang_180820/img/sub/fing.gif') no-repeat 10rem center; padding:3rem 10rem 3rem 30rem; font-size:13rem; margin-top:5rem; }


/*예약관련*/
/*예약현황 및 예약하기 [목록]*/
.calender_wrap {width:100%; overflow:hidden; margin-top:20rem; margin-bottom:40rem;}
.calender_wrap > .calender_box {float:left; width:45%; border:1px solid #ccc; border-radius:10rem;}
.calender_box .booking_day {width:100%; text-align:center; font-size:24rem; margin-top:10rem;}
.calender_box .booking_day img {padding:0 10rem;}
.calender_box .insel {margin-top:15rem; width:100%;}
.calender_box .insel select {width:100%; height:30rem; border:1px solid #ccc;}
.calender_wrap > .calender_txt {float:right; width:50%;}
.calender_txt div {/*background:#f6f6f6 url('/dokyong/ko/img/bg_calender_txt_div.png') no-repeat center 30rem;*/ padding:30% 8% 10%; margin-top:10rem; text-align:center;}
.calender_txt div .tit {font-size:16rem; font-weight:600; height:30rem;}
/* calender table */
.tbl_calender {min-width:100%; overflow:hidden;  border-collapse:separate; border-spacing:0; box-sizing:border-box; padding:0 2%;}
.tbl_calender th,
.tbl_calender td {box-sizing:border-box; line-height:1.8; color:#333; text-align:center; border-right:1px solid #fff; border-bottom:1px solid #fff;}
.tbl_calender td a {display:block;  background:#eee url('/design/hwarang_180820/img/sub/book_pattern1.gif'); padding:3rem;}
.tbl_calender thead th {font-weight:400;  background:none;}
.tbl_calender th.sun {}
.tbl_calender .sun {color:#e91b1b;}
.tbl_calender th.sat {}
.tbl_calender .sat {color:#007fae;}
.tbl_calender td.on { font-weight:600; box-sizing:border-box; color:#007fae;}
.tbl_calender td a.on {background:#007fae url('/design/hwarang_180820/img/sub/book_pattern3.gif'); color:#fff;}
.tbl_calender td.bookNo {background:#5b5852 url('/design/hwarang_180820/img/sub/book_pattern2.gif');}

.bookingNotice {overflow:hidden; clear:both; margin:30rem 4%;}

.book_exp {padding:2%; float:right;}
.book_exp p {float:left; margin-left:20rem;}
.book_exp p.bookNo {}


.calender_txt p.selWrap {font-size:16rem; background:#f7f8f8 url('/design/hwarang_180820/img/sub/calender_txt_p_bg.gif') no-repeat 15rem center; padding:10rem 0 10rem 60rem; margin-bottom:30rem;}
.calender_txt p.selWrap span.sel { color:#444; font-weight:600; padding-right:10rem;}
.calender_txt p.selWrap span.empha {color:#007fae; font-weight:600;}
.calender_txt dl.peak {overflow:hidden; clear:both; margin-bottom:20rem;}
.calender_txt dl.peak dt {width:30%; display:block; float:left; font-weight:bold; padding-left:30rem; box-sizing:border-box;}
.calender_txt dl.peak dd {width:68%; display:block; float:right;}
.calender_txt dl.peak01 dt {background:url('/design/hwarang_180820/img/sub/peak01_bg.gif') no-repeat left 4rem;}
.calender_txt dl.peak02 dt {background:url('/design/hwarang_180820/img/sub/peak02_bg.gif') no-repeat left 4rem;}
.calender_txt .btn_search {line-height:40rem; height:40rem; padding:0; border:1px solid #999; }
.bigBtn {display:block; padding:10rem 0; background-color:#007fae; color:#fff; text-align:center; vertical-align:top; }
.bigBtn:nth-of-type(2) { margin:5rem 0 0; background-color:#12517a;}
.glass { background-image:url('/design/hwarang_180820/img/sub/glass_bg.png'); background-repeat:no-repeat; background-position:70% center;}
#r_period { width:70%; line-height:40rem; height:40rem; vertical-align:top; }
.listGender {width:10%; padding:3rem; margin-right:10rem; border:1px solid #ccc;}
.r_period {width:13%; padding:5rem; border:1px solid #ccc; margin:0 2% 0 1%;}
.btn_search {padding:4rem; width:20%;}
#container input {border:1px solid #ccc; margin:0 5rem; padding:7rem;}
dl.error {border:5px solid #d82a2a; padding:20rem; background:#fffcec; text-align:center;}
dl.error dt { margin-bottom:10rem; font-size:28rem; color:#d82a2a; font-weight:600; line-height:1.5;}
dl.error dt span { background:url('/design/hwarang_180820/img/sub/error.png') no-repeat left center/contain; padding:3rem 0 3rem 55rem;}
dl.error dd {font-size:17rem; font-weight:600;}
dl.error dd span {display:block;}
.myPage {margin:30rem 0 0;}

.reserveInfo { position:relative; border:1px solid #bc2626; border-radius:10rem; background:#ffecec; padding:20rem 30rem 20rem 100rem; font-weight:600; font-size:25rem; color:#bc2626; }
.reserveInfo::before {content:'!'; position:absolute; left:30rem; top:25rem; width:50rem; height:50rem; line-height:50rem; background:#bc2626; color:#fff; border-radius:50%; text-align:center; }
.reserveInfo dd {font-size:18rem; font-weight:600; color:#222; margin:5rem 0 0; }
.memberInfo {background:#e6f1f9; border-radius:5rem; font-size:16rem; padding:20rem 25rem; margin:0 0 20rem; line-height:1.5; font-weight:600; }
.memberInfo span {display:block; color:#bc2626;}

@media all and (max-width: 830px){
	.calender_txt div {padding:6%; background-image:none;}
}
@media all and (max-width: 760px){
	.calender_txt div {padding:5%; margin-top:10rem;}
}
@media all and (max-width: 650px){
	.calender_wrap {background:none;}
	.calender_wrap > .calender_box {width:100%; padding:3% 4%; box-sizing:border-box;}
	.calender_wrap > .calender_txt {width:100%; padding:0; box-sizing:border-box;}
	.calender_txt p.selWrap {background:#f7f8f8; padding:10rem; box-sizing:border-box; margin:10rem 0;}
	.calender_txt p.selWrap span.sel {display:none;}
	.glass {background-position:75% center;}
}
@media all and (max-width: 550px){
	dl.error dt span {background:none; padding-left:0;}
  dl.error dd span {display:inline;}
  .reserveInfo {font-size:20rem; padding:70rem 20rem 20rem;}
  .reserveInfo::before { top:15rem; left:50%; margin-left:-25rem;}
  .reserveInfo dt {text-align:center;}
  .reserveInfo dd {font-size:16rem; line-height:1.5;}
  .memberInfo {padding:10rem 15rem; font-size:15rem; }
}

.reservecheck {margin-top:30px; border-radius:10rem; background:#ffecec; padding:25rem; font-weight:600; text-align:center;}
.reservecheck .inp_s {float:none; margin-top:15px;}
.reservecheck label {color:#cc3333;}
#popup_Auth .reserveagree dd {padding:0 25rem; border:none; background:none;}
#popup_Auth .reserveagree dd p {position:relative; padding:3rem 0 3rem 17rem; letter-spacing:-0.5rem; font-size:17rem;}
#popup_Auth .reserveagree dd p::before {content:''; position:absolute; left:0; top:12rem; width:4rem; height:4rem; border:2rem solid #2c2a50; border-radius:50rem;}
#popup_Auth .reserveagree dd p.caution {padding-left:25rem !important;}
#popup_Auth .reserveagree dd p.caution::before {display:none;}
#popup_Auth .reserveagree .tbl_wrap table {font-size:16rem;}

/*예약관련 버튼*/
.btn.book {display:inline-block; padding:3rem 10rem; margin:3rem 0; font-size:16rem; background:#396699; border:1px solid #335c89; color:#fff; font-weight:600;}
.bt_booking_complete { display:inline-block; padding:3rem 10rem; margin:3rem 0; font-size:16rem; background:#eee; border:1px solid #ccc; color:#333; font-weight:600; box-sizing:border-box; }
.bt_booking_ing {display:inline-block; padding:3rem 20rem; margin:3rem 0; font-size:16rem; background:#eee; border:1px solid #ccc; color:#c13a2e; font-weight:600;}
.bt_booking_impossible {width:50%; display:inline-block; padding:3rem 10rem; margin:3rem 0; font-size:16rem; background:#fff; border:1px solid #ddd; color:#767676;}
.myPage .bt_booking_complete, .myPage  .btn.book{ min-width:90rem; }
@media all and (max-width: 650px){
.tbl_st1 .btn.book,
.tbl_st1 .bt_booking_complete,
.tbl_st1 .bt_booking_ing,
.bt_booking_impossible {width:60rem; padding:3rem 5rem;}
}
/*
@media all and (max-width: 480px){
.tbl_st1 .btn.book,
.tbl_st1 .bt_booking_complete,
.tbl_st1 .bt_booking_ing,
.bt_booking_impossible {font-size:12rem;}
}
*/


/* 계약현황 */
.rental_form {border-top:2rem solid #333; overflow:hidden; margin-bottom:10rem;}
.rental_form dl {background:#eef6fa; border-bottom:1px solid #ccc; overflow:hidden;}
.rental_form dl > * {padding:8rem 0 8rem 12rem; box-sizing:border-box;}
.rental_form dl {width:100%; float:left; box-sizing:border-box; }
.rental_form dl.half {width:100%;}
.rental_form dt {float:left; width:20%; height:auto; font-weight:400;}
.rental_form dd {float:left; width:80%; background:#fff; line-height:30rem; min-height:38rem;}
.rental_form dl.half dt { width:20% !important;}
.rental_form dl.half dd { width:30% !important;}
.rental_form dl.third dt { width:8.333% !important;}
.rental_form dl.third dd { width:25% !important;}
.rental_form dd > * {/*vertical-align:middle;*/ box-sizing:border-box;}

.contract_search_box {width:65%; float:left;}
.contract_search_box select {padding:4rem 10rem; vertical-align:top;}
.contract_search_box input.search_box {padding:4rem 10rem; vertical-align:top;}
.contract_bod_btn {width:25%; float:right; }
.contract_bod_btn > * {box-sizing:border-box; vertical-align:middle;}
.contract_bod_btn a {display:inline-block; padding:3rem 20rem; text-align:center; border:1px solid #ccc; border-radius:3rem 3rem;}
.contract_bod_btn a.btn_write {background:#fff; border-color:#ccc; color:#333;}
.contract_bod_btn a.btn_blue {background:#0080c7; border-color:#0080c7; color:#fff;}
.contract_bod_btn input[type='submit'] {height:32rem; padding:0 20rem; line-height:32rem; text-align:center; border:1px solid #ccc; border-radius:3rem 3rem; background:#0080c7; border-color:#0080c7; color:#fff;}
button.btn_gray {display:inline-block; padding:3rem 20rem; text-align:center; border:1px solid #ccc; border-radius:3rem 3rem;}
@media all and (max-width:680px){
.rental_form dl dt { width:30% !important;}
.rental_form dl dd { width:70% !important;}
.rental_form dl.half dt { width:30% !important;}
.rental_form dl.half dd { width:70% !important; background:#fff url('/portal/images/common/dot_ddd.png') repeat-x left bottom;}
.rental_form dl.third dt { width:30% !important;}
.rental_form dl.third dd { width:70% !important;}


.contract_search_box { width:100% !important; text-align:center; margin-bottom:20rem;}
.contract_bod_btn { width:100% !important; float:none !important; text-align:center; }
}
@media all and (max-width:480px){
/*.rental_form  { font-size:12rem !important;}
.tbl_st1 th, .tbl_st1 td { font-size:12rem !important;}
.tbl_st2 th, .tbl_st2 td { font-size:12rem !important;}
.tbl_st3 th, .tbl_st3 td { font-size:12rem !important;}*/
.rental_form dl dt { width:100% !important;}
.rental_form dl dd { width:100% !important;}
.rental_form dl.half dt { width:100% !important;}
.rental_form dl.half dd { width:100% !important;}
}



legend {position:absolute; left:-99999rem;}
.inp_p {float:left; width:100%;}
.inp_p input {padding:7rem 7rem 7rem;}
.inp_p select {padding:4rem 10rem 4rem 10rem; vertical-align:top; font-family:"notosans",sans-serif !important; font-weight:300;}
.inp_p_btn {display:inline-block; padding:2rem 7rem; background:#131313; color:#fff; vertical-align:top;}
.inp_p input[type="text"] {border:1px solid #ccc;}
.inp_p input[type="text"]:focus {border:1px solid #131313;}
.inp_p.phone input[type="text"] {width:20%}
.vital {background:url('/jobcodi/img/sub/bg_vital.gif') no-repeat left center; padding-left:25rem;}
.inp_p input[type="file"] {background:none;}
.rental_item li{float:left; width:33.333%; text-align:center; box-sizing:border-box;}
.inp_p textarea {height:15rem; border:1px solid #ccc; padding:10rem; box-sizing:border-box;}



/*이용수칙동의*/
.box_agree { width:900rem; }
.box_agree { margin-top:15rem; width:100%; border-top:2rem solid #ddd; border-bottom:2rem solid #ddd; padding:20rem 0; }
.box_agree textarea {width:100%; height:250rem;}
.ctn_agreement { /*height:400rem; overflow-y:scroll; */}
.ctn_agreement p { color:#4a4a4a; line-height:22rem; padding:0 10rem; }
.ctn_agreement ul { padding:0 10rem; }
.box_agree h5 { margin:15rem 0; font-weight:600; }
.box_agree li { }
.box_agree .dep01 li { margin-bottom:20rem; }
.box_agree .dep00 li { padding:5rem 0 0 10rem; margin-bottom:0; color:#4a4a4a; }
.box_agree .dep02 li { padding:5rem 0 0 10rem; margin-bottom:0; color:#4a4a4a;  }
.box_agree .dep03 li { padding:5rem 0 0 10rem; margin-bottom:0; color:#4a4a4a; }
/*.box_red { background:#c41709; padding:10rem 20rem; border:1px solid #c41709; border-radius:3rem; }*/
.box_red { background:url('/images/sub/bg_nomemberBtn.gif') repeat; padding:10rem 0; border:1px solid #98afde; border-radius:3rem; }

.ctn_agreement {clear:both; /*height:220rem;*/ overflow-y:auto;}
.ctn_agreement img {width:100%;}
.ctn_agreement  .txt_box01 {margin-bottom:25rem; text-align:justify;}
.ctn_agreement  .tab_menu {overflow:hidden;}
.ctn_agreement  .tab_menu li {float:left; width:30%; border:1px solid #d63056; border-left:0;}
.ctn_agreement  .tab_menu li:first-child {border-left:1px solid #d63056;}
.ctn_agreement  .tab_menu li a {display:block; height:33rem; line-height:33rem; text-align:center;}
.ctn_agreement  .tab_menu li.active a,
.ctn_agreement  .tab_menu li a:hover {font-weight:600; color:#d63056}
.ctn_agreement  .pri_con {clear:both; display:block; margin-top:20rem;}
.ctn_agreement  h6 {margin-left:0;}
.ctn_agreement  p.txt {padding:0 0 0 20rem;}
.ctn_agreement  li {text-align:justify !important;}
.ctn_agreement  dl {margin-top:3rem;}
.ctn_agreement  dt {font-weight:600;}
.ctn_agreement  dd {padding:4rem 0 8rem 15rem;}
.ctn_agreement  th, .ctn_agreement  td {font-size:1em;}
.lastC td:last-of-type {text-align:center !important; padding-left:0 !important; padding-right:0 !important;}

.ctn_agreement  .tblWrap {width:100%; overflow:hidden;}
.ctn_agreement  .tblWrap table {float:left; width:49%; margin-left:2%;}
.ctn_agreement  .tblWrap table:first-child {margin-left:0;}

.box_red p { color:#fff; }
.sign {background:#ededed; padding:20rem 10%;}






.btnSearch {padding:10rem 40rem;}
@media all and (max-width:1023px){
	.vital {display:block;}
}

.btn_bg {}
#btn1 {border:1px solid #333; padding:5rem 15rem; font-size:15rem;}
#addWrap {}
#addWrap ul {}
#addWrap ul li {margin-top:10rem;}
#addWrap ul li input {margin-right:10rem; padding:3rem; border:1px solid #ccc;}
#addWrap button {background:#333; color:#fff; border:none; padding:3rem 10rem;}

.inp_p input,
.inp_s input {margin:0 5rem;}
.inp_s {float:left; display:inline-block;}
.cB {clear:both;}
.mar_l0 {margin-left:0 !important;}


.fileUpload .file_name {display:block; float:left; width:45%; height:30rem; padding-left:5rem; background-color:#fff; border:1px solid #d2d2d2;}
.fileUpload .fileUpload_button {overflow:hidden; position:relative; float:left; width:121rem;  height:32rem; margin-left:5rem; background:#555;}
.fileUpload .fileUpload_button span {display:block; color:#fff; line-height:32rem; text-align:center; font-size:13rem;}
.fileUpload .fileUpload_button .file_input {position:absolute; right:0; top:0; margin:0; padding:0; font-size:20rem; opacity:0; cursor:pointer;}


/*예약버튼*/
.book_btn {display:inline-block; padding:3rem 20rem; margin:3rem 0; font-size:14rem; background-image: url('/design/hwarang_180820/img/sub/btn_bg.png'); background-repeat:repeat-x; background-position:left bottom;}
.book_ok {background:#396699 url('/design/hwarang_180820/img/sub/pay_icon.png') no-repeat 10rem center; color:#fff; padding:3rem 10rem 3rem 32rem;}
.book_cancle {background:#eee; border:1px solid #ccc; color:#c13a2e; font-weight:600;}
.book_back {background-color:#b9b9b9; color:#333;}




/* 상태 - 01완료(초록색), 02대기(노란색), 03취소(빨간색)*/
.state01, .state02, .state03 {display:inline-block; font-weight:600;}
.state01 {color:#107c1b;}
.state02 {color:#9a6a24;}
.state03 {color:#c13a2e;}

/* .state01,
.state02,
.state03 {display:inline-block; clear:both; padding:2rem 30rem 2rem 10rem; margin:3rem 0; font-size:14rem;}
.state01 {background:#45964d url('/design/hwarang_180820/img/sub/state01_bg.png') no-repeat right center; color:#fff; }
.state02 {background:#f0ad4e url('/design/hwarang_180820/img/sub/state02_bg.png') no-repeat right center; color:#333;}
.state03 {background:#c13a2e url('/design/hwarang_180820/img/sub/state03_bg.png') no-repeat right center; color:#fff;}*/


/*예약확인취소*/
dl.mypage {background:url('/design/hwarang_180820/img/contents/character.png') no-repeat 40rem top; background-size:130rem auto; padding:22rem 40rem 40rem 200rem; margin-bottom:20rem; border-bottom:1px dashed #ddd;}
dl.mypage dt {font-size:25rem; font-weight:600; margin-bottom:20rem;}
dl.mypage dt span {color:#396699; font-weight:600;}
dl.mypage dt a.logout {display:inline-block; font-size:15rem; background:#71302e; color:#fff; padding:5rem 15rem; border-radius:20rem; vertical-align:top; margin:5rem 0 0 10rem; }
dl.mypage dd {font-size:16rem;}
dl.mypage dd span {display:inline-block; color:#fff; background:#cd2626; border-radius:20rem; padding:0 15rem; margin-right:7rem;}
@media all and (max-width:768px){
  dl.mypage {background-position:10rem top; padding:15rem 10rem 30rem 160rem; }
  dl.mypage dt {font-size:22rem; letter-spacing:-1rem;}
}
@media all and (max-width:480px){
  dl.mypage {background:none; padding:0 10rem 20rem; }
}



.caution {background:url('/design/hwarang_180820/img/sub/caution_bg.jpg') no-repeat left 6rem; padding-left:25rem; margin:10rem 0;}
.btn {display:inline-block; padding:0 10rem; margin:0 10rem;}
.btn_s {display:inline-block; border:1px solid #333; padding:0 10rem; margin:0 10rem;}
.view {background:url('/design/hwarang_180820/img/sub/ico_blank.png') no-repeat right center; padding:0 25rem 0 10rem !important;}

.unit {/*float:right;*/ font-weight:normal;}

/*예약완료*/
.booking_complete_page {border:1px solid #ccc; border-radius:20rem; text-align:center; padding:40rem; background:#f7f7f7;}
.booking_complete_page .p1 {font-size:30rem; font-weight:600; margin-top:10rem;}
.booking_complete_page .p2 {font-size:16rem;}

/*텝메뉴*/
#contents .tab,
#contents .tab_li02,
#contents .tab_li03,
#contents .tab_li04,
#contents .tab_li05,
#contents .tab_li06,
.box5_nomal {overflow:hidden;width: 100%;}
#contents .tab ul,
#contents .tab_li02 ul,
#contents .tab_li03 ul,
#contents .tab_li04 ul,
#contents .tab_li05 ul,
#contents .tab_li06 ul,
#contents .tab_depth04 ul,
#contents .box5_nomal ul{overflow:hidden; border-left:1px solid #ddd; border-top:1px solid #ddd; margin-bottom:30rem;display:flex; flex-wrap:wrap; width: 100%;}

#contents .tab ul li,
#contents .tab_li02 ul li,
#contents .tab_li03 ul li,
#contents .tab_li04 ul li,
#contents .tab_li05 ul li,
#contents .tab_li06 ul li,
#contents .tab_depth04 ul li,
#contents .box5_nomal ul li{ flex-grow:1; border-bottom:1px solid #ddd; border-right:1px solid #ddd;}

#contents .tab ul li,
#contents .tab_depth04 li{float:left; text-align:center; }
#contents .box5_nomal ul li {float:left; text-align: center;}
#contents .tab_li02 ul li {width:50%; }
#contents .tab_li03 ul li {width:33.333%;}
#contents .tab_li04 ul li,
#contents .tab_depth04 li,
#contents .box5_nomal ul li {width:25%;}
#contents .tab_li05 ul li {width:20%;}
#contents .tab_li06 ul li {width:16.6666%;}
#contents .tab ul li a,
#contents .tab_depth04 li a,
#contents .box5_nomal ul li a { position:relative; display:block; box-sizing:border-box; padding:10rem; letter-spacing:-0.1em; font-size:16rem;}
#contents .tab ul li a.on,
#contents .tab_depth04 li.active a,
#contents .box5_nomal ul li.active a,
#contents .box5_nomal ul li.selected a{background:#8e6b43; color:#fff; font-weight:600; }
@media all and (max-width:768px){
    #contents .tab_li04 ul li,
	#contents .tab_li05 ul li,
	#contents .tab_li06 ul li,
  #contents .tab_depth04 li,
  #contents .box5_nomal ul li{width:33.333%; float: left;}
}
@media all and (max-width:480px){
    #contents .tab ul li,
    #contents .tab_depth04 li,
	#contents .box5_nomal ul li{width:50%; }
}

/*탭css 김현수 추가 시작*/
#contents .box5_nomal ul li a::before {content:''; position:absolute; left:-1px; top:0; width:1px; height:100%; background:#ddd; }
@media all and (max-width:1500px){
  #contents .box5_nomal.tabStyle ul li{ width:33.33%;}
  #contents .box5_nomal ul li a {font-size:16rem;}
}
@media all and (max-width:1200px){
  #contents .box5_nomal.tabStyle ul li{ width:50%;}
}
@media all and (max-width:1023px){
  #contents .box5_nomal.tabStyle ul li{ width:33.33%;}
}
@media all and (max-width:800px){
  #contents .box5_nomal.tabStyle ul li{ width:50%;}
}
/*탭css 김현수 추가 끝*/

#miniCalendar {left:0 !important; top:0 !important;}

#csr_address_0,
#csr_address_1,
#csr_address {width:70%;}
#csr_address_0 {margin-bottom:5rem !important;}

.add_search {overflow:hidden; display:block; margin-bottom:5rem; text-align:center; width:121rem;  height:32rem; margin-left:5rem; background:#555; color:#fff;}
.csr_name, .csr_phone {width:200rem;}

/*기타*/
.btn_ok_online {display:inline-block; margin-top:30rem; color:#fff; font-weight:600; background:#396699 ; padding:7rem 40rem; }

@media all and (max-width:640px){
	.myPage.tbl_wrap th.area,
	.myPage.tbl_wrap td.area {display:none;}
}

/*육부촌예약안내 레이어*/
.yukbu_layer {width:40%; min-width:320rem; border:7px solid #d0d0d0; box-sizing:border-box; background:#fff url('/design/hwarang_180820/img/contents/bg_yukbu_layer.png') no-repeat center 20rem; padding:10% 3% 2%; margin:300rem auto; }
.yukbu_layer p {font-size:18rem; line-height:28rem; margin:10rem 0 20rem;}
.yukbu_layer a.confirm {padding:10rem 30rem; width:30%; margin:0 auto; display:block; font-size:18rem; color:#fff; background:#936f25; border-radius:30rem; text-align:center;}

/*운영위원회*/
.law_ref {display:inline-block; margin:10rem 0; font-weight:500}
.photo_list {overflow:hidden; width:100%;}
.photo_list li {float:left; width:48%; margin-bottom:25rem; margin-right:3%}
.photo_list li:nth-child(2n) {margin-right:0;}
.photo_list li span {display:block; width:60%; margin:5rem auto 0 auto; padding:5rem 15rem; background:#8e6b43; border:1px solid #b9966e; color:#fff; text-align:center; border-radius:20rem; box-sizing:border-box}
.photo_list li img {width:100%; border:5px solid #fff; box-shadow:5rem 5rem 5rem #ddd; box-sizing:border-box;}
@media all and (max-width:768px){
	.photo_list li span {width:100%}
}
@media all and (max-width:480px){
	.photo_list li {float:none; width:98%; margin-right:0;}
}

.myPage_etc {overflow:hidden; margin-top:20rem;}
.myPage_etc li {float:left; width:46%; margin:0 2%;}
.myPage_etc li span {/*width:25% !important; */margin-right:2% !important; text-align:center;}

.page_tel {text-align:right; overflow:hidden; margin-top:-50rem; }
.page_tel p {float:right; display:block; border:2px solid #ddd; padding:5rem 25rem; border-radius:100rem;}
.page_tel p span {font-weight:bold;}
@media all and (max-width:1200px){
  .page_tel {margin-top:10rem;}
}


/* 마이페이지 표 수정 */
@media all and (max-width: 690px){
	.tbl_st1_2{width: 650rem;}
	.book_ok{background: #396699; color: #fff; padding: 3rem 5rem;}
	.book_btn{padding: 3rem 8rem; font-size: 12rem;}
}

@media all and (max-width: 480px){
	.tbl_st1_2{width: 600rem;}
	.book_ok{background: #396699; color: #fff; padding: 3rem 5rem;}
	.book_ok{font-size: 12rem;}
}

/* 직원안내 */
.org_wrap{
	position: relative;
	margin-top: 50rem;
	height: 300rem;
	text-align: center;
}
.org_wrap ul li span{display: inline-block; width: 220rem; height: 54rem; margin-bottom: 30rem; text-align: center; background-color: #548235; color: #fff; font-size: 19rem; font-weight: 500; box-sizing: border-box; line-height: 54rem; border-radius: 10rem;}
.org_wrap .jang span{background-color: #0070C0;}
.org_wrap .team { position:relative; display:flex; justify-content:space-between; margin-top: 30rem;}
.org_wrap .team li { position:relative;font-size: 19rem; width: 220rem; height: 54rem; line-height: 54rem; text-align: center; background: #002060; color: #fff; border-radius: 10rem;}
/*.org_wrap .team li:nth-child(1){left: 0;}
.org_wrap .team li:nth-child(2){left: 50%; transform: translate(-50%);}
.org_wrap .team li:nth-child(3){right: 0%;}*/

.org_wrap::before {content:''; position:absolute; left:50%; top:0; width:1px; height:168rem; background:#ccc; z-index:-1; }
.org_wrap .team li::before {content:''; position:absolute; left:50%; top:-30rem; width:1px; height:30rem; background:#ccc; z-index:-1;}
.org_wrap .team li::after {content:''; position:absolute; left:50%; top:-30rem; width:200%; height:1px; background:#ccc; transform:translateX(-50%); z-index:-1;}
.org_wrap .team li:first-of-type::after { left:50%; transform:none; }
.org_wrap .team li:last-of-type::after { left:auto;right:50%; transform:none; }
@media all and (max-width: 1023px){
	.org_wrap ul li span{width: 160rem; font-size: 18rem; height: 48rem; line-height: 48rem;}
	.org_wrap .team li{width: 160rem; font-size: 18rem; height: 48rem; line-height: 48rem;}
	
	.org_wrap::before {height:157rem;}
	.org_wrap .team::before {left:80rem; width:calc(100% - 160rem); }
}
@media all and (max-width: 480px){
  .org_wrap {height:auto; margin:0 0 40rem;}
  .org_wrap .team { flex-wrap:wrap; margin-top:0; }
  .org_wrap .team li { width:100%; margin:0 0 10rem; }
  .org_wrap .team li::before,
	.org_wrap .team li::after {display:none;}
}
/*
@media all and (max-width: 570px){
	.org_wrap{margin-top: 10rem; padding: 20rem;}
	.org_wrap ul li span{width: 100%; margin-bottom: 20rem; font-size: 18rem;}
	.org_wrap .team{margin-top: 0;}
	.org_wrap .team li{width: 100%; display: block; position: static; margin-bottom: 10rem; font-size: 18rem;}
	.org_wrap .team li:nth-child(2){transform: translate(0);}
}
*/

/*기존 sub.css 끝*/


/* 방탈출 */
.escape_step {margin-top:10rem;}
.escape_step ul {display:flex; flex-flow:row wrap; margin:0 -40rem;}
.escape_step ul li {display:flex;flex-flow:column wrap; align-items:center; justify-content:flex-start; position:relative; margin:10rem 40rem; padding:20rem; background:#fff9ed; text-align:center; border-radius:10rem;    flex: 0 0 14%;}
.escape_step ul li:before {content:''; position:absolute; top:50%; right:-50rem; width:10rem; height:10rem; border-top:2rem solid #ddd; border-right:2rem solid #ddd; transform:translateY(-50%) rotate(45deg);}
.escape_step ul li:last-child:before {display:none;}
.escape_step.img span > img {display:block; width:150rem; border-radius:13rem; margin-bottom:20rem;height: 150px;}
.escape_step.img li:nth-child(1) span > img {height: auto;}
@media all and (max-width:1440px){
    .escape_step ul {margin:0 -20rem;}
    .escape_step ul li { font-size:16rem;margin: 10rem 58rem;}
}
@media all and (max-width:768px){
    .escape_step {margin:0;}
    .escape_step ul {margin:0;}
    .escape_step ul li {flex:1 1 100%; margin:20rem 0;}
    .escape_step ul li:last-child {margin-bottom:0;}
    .escape_step ul li br{display: none;}
}
/*예약_write*/
.tbl_wrap input[type="text"] {margin-top:3rem !important; margin-bottom:3rem !important;}
@media all and (max-width:1440px){
	.captcha img {display:block;}
	.captcha input[type="text"] {display:block; width:70% !important}
	.captcha span {display:block; margin-left:5rem;}
}
