body.on {overflow:hidden;}

/* header */
header {width:100%;}
header .head_inn {z-index:111; position:fixed; width:100%; height:50px; background:rgba(255,255,255,.9); box-shadow:0 2px 5px rgba(0,0,0,.2);}
header .head_inn:after {content:""; display:block; clear:both;}
header .head_inn h1 {text-align:center;}
header .head_inn h1 a {display:block; height:40px; margin-top:5px;}
header .head_inn h1 a img {height:100%;}
header .head_inn .whole {z-index:112; position:absolute; left:15px; top:16px; width:30px; height:20px; cursor:pointer;}
header .head_inn .whole p {position:absolute; right:0; width:30px; height:2px; background:#016db8;}
header .head_inn .whole .p01 {top:0;}
header .head_inn .whole .p02 {top:8px;}
header .head_inn .whole .p03 {top:16px;}
header .head_inn .whole.on .p01 {transform:skewY(28deg); transform-origin:0 0;}
header .head_inn .whole.on .p02 {display:none;}
header .head_inn .whole.on .p03 {transform:skewY(-28deg); transform-origin:0 0;}

header .gnb {z-index:-1; position:fixed; width:100%; height:100%;}
header .gnb.on {z-index:99;}
header .gnb ul {position:absolute; left:-100%; top:0; width:100%; height:100%; padding-top:50px; background:#dfdfdf; transition:all 0.2s;}
header .gnb ul.on {left:0;}
header .gnb ul li a {display:block; width:100%; padding:10px 15px; font-size:16px; line-height:1.2; text-align:left; box-sizing:border-box;}
header .gnb ul li a i {font-size:18px; line-height:48px;}

/* 예약확인팝업 */
.re_check {display:none; z-index:111; position:fixed; left:0; top:0; width:100%; height:100%; padding:0 15px; background:rgba(0,0,0,0.5); box-sizing:border-box;}
.re_check.on {display:block;}
.re_check .re_check_inn {position:relative; width:100%; margin:100px auto 0; padding:50px 40px; background:#fff; box-shadow:3px 3px 10px rgba(0,0,0,0.2); box-sizing:border-box;}
.re_check .re_check_inn .box:first-child {margin-bottom:20px;}
.re_check .re_check_inn .box .txt {line-height:22px; text-align:center;}
.re_check .re_check_inn .box .inp input {width:100%; height:35px; margin-top:5px; text-align:center; border:1px solid #ccc;}
.re_check .re_check_inn .close {position:absolute; right:5px; top:5px;}
.re_check .re_check_inn .close i {font-size:18px; color:#999; cursor:pointer;}

/* footer */
.footer {position:relative; width:100%; padding:30px 15px 20px; background:#434343; box-sizing:border-box;}
.footer .footer_inn {width:100%; font-size:12px; line-height:18px; color:#aeaeae;}
.footer .footer_inn ul li {display:inline-block;}
.footer .footer_inn ul li a {font-size:12px; line-height:18px; color:#dfdfdf;}
.footer .footer_inn ul .bar {margin:0 3px; font-size:10px; line-height:18px;}
.footer .footer_inn .copy {margin:20px 0px 0px 0px; bottom:-30px; width:100%; line-height:1.5; text-align:center; color:#a2a2a2; background:#313131; padding:10px 0px}

/* index */
/* 예약 */
.reserve {width:100%; height:400px; padding:100px 15px 0; background:url(/m/images/bg_reserve_img_m.jpg) no-repeat 50% 0; box-sizing:border-box;}
.reserve h3 {margin-bottom:15px; font-size:17px; font-weight:600; text-align:center; color:#fff;}
.reserve .reserve_inn {width:100%; padding:15px; background:rgba(0,107,181,.8); box-sizing:border-box;}
.reserve .reserve_inn ul {width:100%; text-align:center;}
.reserve .reserve_inn ul:after {content:""; display:block; clear:both;}
.reserve .reserve_inn ul li {position:relative; float:left; width:100%; height:40px; margin:1%; padding-left:40px; border:1px solid #fff; border-radius:5px; box-sizing:border-box;}
.reserve .reserve_inn ul li p {position:absolute; left:0; top:0;}
.reserve .reserve_inn ul li .icon {width:40px; border-right:1px dashed #fff;}
.reserve .reserve_inn ul li .icon i {line-height:40px; color:#fff;}
.reserve .reserve_inn ul li .icon .fa-calendar-alt {font-size:19px;}
.reserve .reserve_inn ul li .icon .fa-male {font-size:23px;}
.reserve .reserve_inn ul li .icon .fa-child {font-size:18px;}
.reserve .reserve_inn ul li .icon .fa-car-alt {font-size:20px;}
.reserve .reserve_inn ul li input {width:100%; height:30px; margin-top:5px; color:#fff; border:none; background:none;}
.reserve .reserve_inn ul li select {width:100%; height:30px; margin-top:5px; color:#fff; border:none; background-color:none; background:url(../images/ic_select_reserve.png) no-repeat 100% 50%;}
.reserve .reserve_inn ul li option {background:#fff;}
.reserve .reserve_inn .btn {width:50%; margin:1% auto;}
.reserve .reserve_inn .btn button {width:100%; height:40px; border:1px solid #fcba30; border-radius:3px; background:#fcba30;}

/* 시설안내 */
.main_facility {width:100%; padding:50px 15px; background:#fff; box-sizing:border-box;}
.main_facility h3 {margin-bottom:15px; font-size:17px; font-weight:600; text-align:center; color:#006bb5;}
.main_facility ul {width:100%;}
.main_facility ul li {height:100px; margin-bottom:10px;}
.main_facility ul li:last-child {margin-bottom:0;}
.main_facility ul .faci_01 {background:url(/m/images/mai_faci_m_01.png) no-repeat 50% 0;}
.main_facility ul .faci_02 {background:url(/m/images/mai_faci_m_02.png) no-repeat 50% 0;}
.main_facility ul .faci_03 {background:url(/m/images/mai_faci_m_03.png) no-repeat 50% 0;}
.main_facility ul .faci_04 {background:url(/m/images/mai_faci_m_04.png) no-repeat 50% 0;}
.main_facility ul li a {display:block; width:100%; height:100%; padding:15px; box-sizing:border-box;}
.main_facility ul li a .tit {font-size:19px; font-weight:600; color:#fff;}
.main_facility ul li a .more {color:#fcba30;}

/* 홍보영상 */
.main_video {width:100%; padding:30px 15px; background:#fcba30; box-sizing:border-box;}
.main_video h3 {margin-bottom:15px; font-size:17px; font-weight:600; text-align:center; color:#006bb5;}
.main_video .main_video_inn ul li {margin-bottom:10px;}
.main_video .main_video_inn ul li a {position:relative; overflow:hidden; display:block; width:100%; height:200px; *width:539px; *height:340px; margin-right:22px;}
.main_video .main_video_inn ul li:last-child a {margin-right:0;}
.main_video .main_video_inn ul li a img {position:absolute; left:0; top:50%; transform:translateY(-50%); width:100%;}
.main_video .main_video_inn ul li a .black {position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.3); transition:all 0.2s;}
.main_video .main_video_inn ul li a .xi-youtube-play {position:absolute; left:50%; top:50%; transform:translateX(-50%) translateY(-50%); font-size:60px; color:#fff; transition:all 0.2s;}

/* 유튜브 */
#playerview {z-index:10000; position:fixed; display:none; top:0; left:0; width:100%; height:100%; background:url(/m/images/youtube_bg.png) repeat;}
#playerview #playerWrap {position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:100%;}
#playerview #playerWrap #player {width:100%;}
#playerview .btn_close {position:absolute; top:15px; right:15px;}
#playerview .btn_close i {font-size:20px; color:#fff;}

/* 부대시설 */
.main_add {width:100%; padding:50px 15px; background:#fff; box-sizing:border-box;}
.main_add .main_add_inn {width:100%;}
.main_add .main_add_inn h3 {margin-bottom:15px; font-size:17px; font-weight:600; text-align:center; color:#006bb5;}
.main_add .main_add_inn .item {display:block; width:100%; border:1px solid #ddd; background:#fff; box-sizing:border-box;}
.main_add .main_add_inn .item .img {overflow:hidden; width:100%;}
.main_add .main_add_inn .item .img img {width:100%;}
.main_add .main_add_inn .item .txt {height:140px; padding:20px; box-sizing:border-box;text-align:right}
.main_add .main_add_inn .item .txt .ttit {margin-bottom:7px; font-size:15px;}
.main_add .main_add_inn .item .txt .ttxt {line-height:1.5;}

/* 공지사항 */
.main_board {width:100%; padding:35px 15px; background:#eef0f4; box-sizing:border-box;}
.main_board .noti_r {margin-top:25px;}
.main_board .noti {position:relative; width:100%;}
.main_board .noti h3 {margin-bottom:25px; font-size:17px; font-weight:600; text-align:center; color:#006bb5;}
.main_board .noti ul {border-top:1px solid #ccc;}
.main_board .noti ul li {height:35px; border-bottom:1px solid #ccc;}
.main_board .noti ul li:after {content:""; display:block; clear:both;}
.main_board .noti ul li a {overflow:hidden; display:inline-block; width:70%; line-height:35px; text-overflow:ellipsis; white-space:nowrap;}
.main_board .noti ul li .reply {display:inline-block; width:25px; height:16px; margin:9px 3px 0 0; background:url(/m/images/ic_reply.png) no-repeat 0 0;}
.main_board .noti ul li .day {float:right; line-height:35px;}
.main_board .noti .more {position:absolute; right:0; top:15px;}
.main_board .noti .more a i {font-size:24px; color:#bbb;}

/* 지도 */
.main_map {width:100%; padding:50px 0 0; box-sizing:border-box;}
.main_map h3 {margin-bottom:15px; font-size:17px; font-weight:600; text-align:center; color:#006bb5;}
.main_map .txt {width:100%; padding:15px; background:#f2f2f2; box-sizing:border-box;}
.main_map #map-canvas {width:100%; height:300px;}