@charset "utf-8";
/*=================
모바일 및 기본 세팅
===================*/
body{ overflow-x:hidden;}

#intro{ position:fixed; left:0; top:0; width:100%; height:100%; text-align:center;  }
#intro .logo{ position:absolute; width:100%; top:50%; transform:translateY(-50%)}
#intro img{ width:80%; max-width:250px; margin:0 auto}
#intro p{ font-size:0.6em; color:#6f6f6f; margin-top:40px;  }

#header_area{ position:relative; background:#3a9ca7; padding:25px 0;}
#header_area h1{ color:#fff; text-align: center; font-size:1.3em }
#header_area > a{ position:absolute; top:23px; display:block; width:25px; height:25px; text-indent: -9999px; background-size:contain; background-repeat:no-repeat; background-position:center;}
#header_area .btn_back{ left:15px; background-image:url(../img/common/icon_back.png)}
#header_area .btn_alarm{ right:60px; background-image:url(../img/common/icon_alarm.png)}
#header_area .btn_menu{ right:15px; }
#header_area .btn_menu span{ display:block; height:3px; border-radius: 10px; background:#fff; margin-bottom:3px;}
#header_area .btn_menu span:last-child{ margin-bottom:0; }

.m_gnb{  position:fixed; right:-200%; top:0; width:280px; height:100%; background:#fff url(../img/common/logo.jpg) center 95% no-repeat; background-size:150px; padding:20px; z-index:1000;}
.m_gnb.open{ right:0%; transition:0.3s}
.m_gnb > a{  position:absolute; top:30px;  width:25px; height:25px;  background-size:cover;  text-indent:-9999px; }
.m_gnb .btn_close{ position:absolute; top:30px; left:-45px; display:block; width:25px; height:25px; text-indent:-9999px; }
.m_gnb .btn_close:before,.m_gnb .btn_close:after{ position:absolute; top:10px; left:0; display:block; content:""; width:25px; height:3px; border-radius:5px; background:#fff;  }
.m_gnb .btn_close:before{ transform:rotate(45deg)}
.m_gnb .btn_close:after{ transform:rotate(-45deg)}
.m_gnb .profile_photo{ position:relative; padding:0 0 15px 0;  border-bottom:#464646 solid 1px;  margin-bottom:15px; }
.m_gnb .profile_photo .photo{ display:inline-block; width:40px; height:40px; background-size:cover; border-radius:10px; vertical-align:middle; margin-right:10px;}
.m_gnb .profile_photo .name{ font-weight:bold }

.m_gnb .btn_func{  right:15px; display:block; background-image:url(../img/common/icon_set.png) ;}
.m_gnb .btn_logout{  right:15px; display:block; background-image:url(../img/common/icon_logout.png) ;}
.m_gnb .btn_home{  right:50px; display:block; background-image:url(../img/common/home.png) ;}

.m_gnb ul li{ padding:0 15px;}
.m_gnb ul li a{ display:block; padding:15px 0 13px;  color:#464646; border-bottom:#bababa solid 1px;  }
.m_gnb ul li:last-child a{ border:0; }
.m_gnb .company_info{ border-top:#464646 solid 1px; padding:20px 15px; margin-top:30px;  }
.m_gnb .company_info span{ display:block; font-weight:bold; line-height:1.3 } 
.m_gnb .company_info .phone{ padding-left:45px; background:url(../img/common/icon_phone_grey.png) left center no-repeat; background-size:auto 100%; margin-left:10px;  font-weight: bold; height:35px; line-height:35px; margin:15px 0;  font-size:1.3em }
.m_gnb .company_info p{ line-height:1.3; font-size:0.85em }

.drawer{ position:fixed; left:0; top:0; width:100%; height:100%; background:#000; visibility:hidden; z-index:500;}
.drawer.open{ visibility:visible; transition:0.3s }

#content_area{ padding:20px; }
 .my_info_wrap{ border:#c4c4c4 solid 1px; padding:15px; background:#fffef8; margin:15px 0; border-radius: 15px; }
.no_info_msg {padding:100px 0;line-height:1.5}
.my_info{ padding-bottom:20px; border-bottom:#c4c4c4 solid 1px; margin-bottom:20px; }
.my_info span{ display:block; }
.my_info .gubun {font-size:1.2em; font-weight: bold;float: left; }
.my_info .date{ clear:both;font-size:1.2em; font-weight: bold; margin:5px 0 }
.my_info .state{ float:right; padding:5px 10px; border:#3a9ca7 solid 1px; border-radius: 30px; font-size:0.75em; color:#3a9ca7; font-weight: bold}
.my_info .end_date{ clear: both; }
.btn_set{ padding:20px 0; text-align: center; }
.btn_set a{ display:inline-block; padding:15px 0; color:#fff; border-radius: 15px; width:49%;}
.btn_reserv{ background:#3a9ca7}
.btn_check{ background:#2d7613}

.latest_box{ padding:10px 0; position:relative; }
.latest_box h2{ font-size:1.3em; font-weight:bold }
.latest_box ul{ margin-top:20px; }
.latest_box ul li{ margin-bottom:10px; }
.latest_box ul li a{ display:block; width:100%; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; lin-height:1.3; margin-bottom:10px; }
.latest_box .view_more{ position:absolute; right:0; top:10px; }

#ticket_info{ position:relative; background:#f9f9f9; padding:25px 20px;  }
#ticket_info .info_list li{ line-height:1.5}
#ticket_info .info_list li:first-child{ margin-bottom:10px;}
#ticket_info .info_list li span{ display:inline-block; font-weight:bold; color:#007b89;  min-width:80px; }
#ticket_info .info_btn_set{ position:absolute; right:15px; bottom:20px; }
#ticket_info .info_btn_set a{ display:inline-block; padding:8px 10px 5px;  background:#fff; border:#007784 solid 1px; border-radius:15px; font-size:0.75em; font-weight:bold; color:#008796 }

.info_title_box{ background:#fffef8; border:#ff7e00 solid 2px; border-radius:10px;  padding:20px; text-align:center  }
.info_title_box .bold{ font-weight:bold; font-size:1.2em; margin-bottom:8px; }

.my_info_list{ padding:20px 0;}
.my_info_list li{ position:relative; border-bottom:#ccc solid 1px; padding:10px;}
.my_info_list li p{ margin:5px 0; }
.my_info_list li .time span{ display:inline-block; /*margin-right:10px; */color:#008d9d; font-weight:bold }
.my_info_list li a{ position:absolute; right:0; top:15px; font-size:0.75em; font-weight:bold }

.ticket_con { padding:0 10px; }
.ticket_con p{ line-height:1.8}

#join_wrap{ padding:25px 15px; }
#join_wrap h3{ margin-bottom:10px; font-size:1.3em }
#join_wrap .exp{ color:#616161; line-height:1.3; font-size:0.85em}
.exp1{ color:#616161; line-height:1.5; font-size:0.85em; margin:10px 0}
.agree_box{ text-align:center; } 
.agree_box .btn_view{ display:inline-block; padding:15px 0; width:80%; margin:0 auto; border:#007784 solid 1px; border-radius:15px; color:#008796; font-size:0.85em; font-weight:bold; margin:15px 0; }
.agree_box label{ font-size:0.85em !important}

.write_form{ padding:25px 0 15px 0; }
.write_form input,.write_form select{ margin-bottom:15px; }
.write_form .btn_check{ width:28.5%;  height:40px;  border:0; border-radius:10px;  font-size:0.85em; background:#17646d; color:#fff;  vertical-align:top}
.write_form .exp{ margin-top:-10px;  margin-bottom:15px; margin-left:5px; } 
.write_form .w10{ width:20%; }
.write_form .w30{ width:30%; }
.write_form .w70{ width:68.5%; }
.btn_join{display:inline-block; width:100%; height:40px; background:#3a9ca7; color:#fff; font-size:1em; font-weight:bold; border-radius:10px; border:0; -webkit-appearance:none;  }

.popup{ display:none; position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.7); padding:10%; }
.popup .private{ position:relative; overflow-y:auto; height:80%; margin:10% 0; min-height:300px; background:#fff; padding:30px  20px 20px 20px;  }
.popup .private h3{ font-size:1.2em; text-align:center; padding:20px 0; color:#3a9ca7;  }
.popup .private p{ font-size:0.85em }

.popup .pop_close{ position:absolute; top:15px; right:15px; display:block; width:25px; height:25px; text-indent:-9999px; }
.popup .pop_close:before,.popup .pop_close:after{ position:absolute; top:10px; left:0; display:block; content:""; width:25px; height:3px; border-radius:5px; background:#424242;  }
.popup .pop_close:before{ transform:rotate(45deg)}
.popup .pop_close:after{ transform:rotate(-45deg)}

#footer_area{ background:#484848; text-align: center; padding:15px 0; }
#footer_area h2{ display:inline-block; vertical-align: middle; color:#fff; text-align:right; font-size:1.2em; line-height: 1.2}
#footer_area .phone_num{ padding-left:35px; background:url(../img/common/icon_phone.png) left center no-repeat; background-size:auto 100%; margin-left:10px; color:#fff; font-weight: bold }


.btn {
display: inline-block;
padding:10px 0;
font-weight: bold;
text-align: center;
width: 100%;
height: 40px;
background: #3a9ca7;
color: #fff;
font-size: 1em;
font-weight: bold;
border-radius: 10px;
border: 0;
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-o-transition: all 0.5s;
transition: all 0.5s;
cursor: pointer;
margin: 5px;
}
#reg_result h2{line-height:1.5;margin-top:50px;}

/*==================
사이즈별 추가코드
==================*/

/*smartphones ( portrait )*/
@media all and (max-width:375px) {
}

/*smartphones ( landscape )*/
@media all and (min-width:321px) and (max-width:360px) {

}

/*smartphones ( landscape )*/
@media all and (min-width:361px) and (max-width:375px) {

}

/*smartphones ( landscape )*/
@media all and (min-width:376px) and (max-width:414px) {

}

/*smartphones ( landscape )*/
@media all and (min-width:415px) and (max-width:480px) {

}

/*tablet( portrait )*/
@media all and (min-width:640px) {

}
@media all and (min-width:641px) and (max-width:767px) {

}


.board_type_b {clear:both; overflow: hidden; }
.board_type_b > li {border-bottom:1px solid #bbb; clear:both; padding:20px 10px; overflow:hidden;}
.board_type_b .img_box {background-size: cover; background-repeat: no-repeat; background-position: center;width:300px; height:200px;margin:0 auto}
.board_type_b > li > dl {color:#3e3d3d; margin:20px 30px; line-height: 160%;}
.board_type_b > li > dl > dt {font-size:21px;}
.board_type_b > li > dl > dd {font-size:18px; margin:10px 0 30px;
.board_type_b > li > dl > dd span {display: inline-block; margin-top: 0; margin-right: 15px;  padding-right: 15px; border-right: #e1e1e1 solid 2px;}
.board_type_b > li > dl > dd span:last-child {border-right:0}
.gray{color:#efefef}

.info_title_box .info_btn_r{ position:absolute; right:15px; bottom:20px; }
.info_title_box .info_btn_r a{ display:inline-block; padding:8px 10px 5px;  background:#fff; border:#007784 solid 1px; border-radius:15px; font-size:0.75em; font-weight:bold; color:#008796 }
.win_btn {margin-top:30px}
.btn-outline-dark {
    color: #343a40;
    border-color: #343a40;border:1px solid;
	padding-top:2px;padding-bottom:2px;}s