@charset "utf-8";

@import url('reset.css'); /* 기본설정 */


/* common */
html, body{-webkit-text-size-adjust:none;}
input[type="text"],input[type="tel"],input[type="password"],input[type="email"],input[type="search"] { -webkit-appearance: none; }
input[type="button"] {appearance: none; -moz-appearance: none; -webkit-appearance: none; border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0;}
input[type="checkbox"] {-webkit-border-radius: 4px; width:20px; height:20px; line-height: 20px; border-radius: 4px;}
.checks {position: relative;}
.checks input[type="checkbox"] { /* 실제 체크박스는 화면에서 숨김 */ position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip:rect(0,0,0,0); border: 0 } 
.checks input[type="checkbox"] + label { display: inline-block; position: relative; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; } 
.checks input[type="checkbox"] + label:before { /* 가짜 체크박스 */ content: ' '; display: inline-block; width: 20px; /* 체크박스의 너비를 지정 */ height: 20px; /* 체크박스의 높이를 지정 */ line-height: 20px; /* 세로정렬을 위해 높이값과 일치 */ margin: -2px 8px 0 0; text-align: center; vertical-align: middle; background: #fff; border: 1px solid #d6d6d6; border-radius : 4px; } 
.checks input[type="checkbox"]:checked + label:before { /* 체크박스를 체크했을때 */ content: '';  color: #fff; background: #00bae2 url('../images/checkmark.png') no-repeat center center; border-color: #00bae2; } 
.shidden {height:100%; min-height:100%; overflow:hidden !important; touch-action: auto;}
a.com_btn { display: inline-block; padding:0 15px; height:30px; border-radius: 4px; line-height: 30px; font-size: 14px; background: #556fb5; color:#fff; text-align: center; margin:10px 0;}


input:checked[type="checkbox"] { background-color:#fff;}
div.border_top {border-top:1px solid #d3d3d3;}
a.btn_com_bule,
form input[type="submit"]{position:relative; margin:0px auto; margin-top:50px; display: block; width:300px; font-size:24px; color:#fff; border:0; background:#00bae2 linear-gradient(135deg, #00bae2 60%, #3fd1e6); color:#fff; box-shadow: 0px 10px 20px 0px rgba(0,14,66,0.1);  border-radius: 100px; text-align: center; height:50px; line-height: 50px; cursor: pointer;}
input[type="text"], input[type="password"] { height: 46px;  line-height: normal;   padding: .8em .8em;  box-sizing: border-box; border-radius: 4px;}
select {height: 46px;  line-height: normal; padding-left:.8em; padding-right:34px; box-sizing: border-box; border-radius: 4px; box-sizing: border-box; background:#fff url('../images/arr_select.png') no-repeat right center/35px auto;}
em.m_block {display:inline-block;}
em.tab_block {display:block;}
.right {position: absolute; right:0;}
input[type="checkbox"] { width:20px; height:20px; border:1px solid #d6d6d6; margin-left:0px; margin-top:0px;}
.border_bline {border-bottom:1px solid #d3d3d3; padding-bottom:15px;}
.red {color:#ed4747;}

/* layer pop */
.layer_pop_wrap { display:block; z-index:10; position:absolute; width:100%; height:100%; background-color: rgba(0,0,0,0.5);}
.layer_pop_wrap.hidden {display: none;}
.layer_pop_wrap.fix { position:fixed; width:100%; height:100vh;}
.layer_pop_wrap.fix2 { position:fixed; width:100%; height:100vh;}
.layer_pop { position:absolute; left:50%; top:50%; transform: translate(-50%, -50%); width:250px; margin:0 auto; padding:18px 27px; background:#fff; border-radius: 20px; box-sizing: border-box;}
.layer_pop div.icon {text-align: center; }
.layer_pop div.icon img { width:39px;}
.layer_pop div.text {min-height: 80px; height:100%; display: flex; align-items:center; justify-content: center; }
.layer_pop div.text p {font-size:14px; padding:15px 0px; text-align: center;}
.layer_pop .btn_area {position:relative; border-top:1px solid #d3d3d3; height:30px;}
.layer_pop .btn_area a {position:absolute; top:5px; font-size:16px;}
.layer_pop .btn_area a.left { left:10px;}
.layer_pop .btn_area a.right { right:10px;}
.gallery_view_wrap {position:absolute; left:50%; top:50%; transform: translate(-50%, -50%); width:780px; height:calc(100vh - 200px); margin:0 auto; background:#fff; box-sizing: border-box;}
.gallery_view_wrap .layer_title { position:relative; height:50px; background:#00bae2;}
.gallery_view_wrap .layer_title h3 { font-size:24px; line-height:50px; padding-left:20px; color:#fff; font-weight: normal; }
.gallery_view_wrap .layer_title a.btn_close { position:absolute; top:13px; right:20px;}
.gallery_view_wrap .gallery_view {padding:20px 40px; height:calc(100% - 100px); overflow-y: scroll;}
.gallery_view_wrap .gallery_view h4 {font-size:24px; color:#4b5265; line-height: 50px; font-weight: normal; border-bottom:1px solid #dadbdb; text-align: center;}
.gallery_view_wrap .gallery_view div.mg20 {margin:20px 0;}
.gallery_view_wrap .gallery_view div.mg20 img { width:700px; margin-bottom:20px;}

/*alert css  */
.layer_alert_wrap { display:block; z-index:10; position:absolute; width:100%; height:100%; background-color: rgba(0,0,0,0.5);}
.layer_alert_wrap.hidden {display: none;}
.layer_alert_wrap.fix { position:fixed; width:100%; height:100vh;}
.layer_alert_wrap.fix2 { position:fixed; width:100%; height:100vh;}
.layer_alert { position:absolute; left:50%; top:50%; transform: translate(-50%, -50%); width:250px; margin:0 auto; padding:18px 27px; background:#fff; border-radius: 20px; box-sizing: border-box;}
.layer_alert div.icon {text-align: center; }
.layer_alert div.icon img { width:39px;}
.layer_alert div.text {min-height: 80px; height:100%; display: flex; align-items:center; justify-content: center; }
.layer_alert div.text p {font-size:14px; padding:15px 0px; text-align: center;}
.layer_alert .btn_area {position:relative; border-top:1px solid #d3d3d3; height:30px;}
.layer_alert .btn_area a {position:absolute; top:5px; font-size:16px;}
.layer_alert .btn_area a.left { left:10px;}
.layer_alert .btn_area a.right { right:10px;}


/* nav */
.mobile_nav_wrap { display:block; z-index:10; position:fixed; top:100px; width:100%; height:100%; background-color: rgba(0,0,0,0.5);}
#mobile_nav { position:absolute; width:100%; background:#fff;}
#mobile_nav div.nav {width:760px; margin: 0 auto;  margin-top:30px;}
#mobile_nav div.nav ul.m_nav_1depth {display: flex;}
#mobile_nav div.nav ul.m_nav_1depth li {width:calc(100% / 4); }
#mobile_nav div.nav ul.m_nav_1depth li div {position:relative; border-bottom:1px solid #303646; height:90px; text-align: center; }
#mobile_nav div.nav ul.m_nav_1depth li div p { display: inline-block; font-size: 18px; margin:0 auto; line-height:90px; color:#4b5265; font-weight: bold;}
#mobile_nav div.nav ul.m_nav_1depth li div i { display:inline-block; vertical-align: top; margin-top:30px; margin-right:10px; width:36px; height:36px;}
#mobile_nav div.nav ul.m_nav_1depth li div i.nav_ico {background: url('../images/nav_icon.png') no-repeat 0 0/72px auto;}
#mobile_nav div.nav ul.m_nav_1depth li.nav_menu1 div i.nav_ico {background-position: 0 0;}
#mobile_nav div.nav ul.m_nav_1depth li.nav_menu2 div i.nav_ico {background-position: 0 -36px;}
#mobile_nav div.nav ul.m_nav_1depth li.nav_menu3 div i.nav_ico {background-position: 0 -72px;}
#mobile_nav div.nav ul.m_nav_1depth li.nav_menu4 div i.nav_ico {background-position: 0 -108px;}
#mobile_nav div.nav ul.m_nav_1depth ul {padding:30px 30px 60px 30px;}
#mobile_nav div.nav ul.m_nav_1depth ul li { width:100%; background: url('../images/dot_icon.png') no-repeat 0 center /4px; text-align: left; padding-left:20px; line-height:30px;}
#mobile_nav div.nav ul.m_nav_1depth ul li a:hover {text-decoration: underline; color:#00bae2;}
#mobile_nav div.nav div.menu_cont {display: none;}

.nav_header {position:absolute; width:100%; height:100px; top:-100px;}
.nav_header .tab_none {display:none;}
.nav_header .btn_right {display: none;}
.nav_header a.btn_nav_close { position: absolute; right:0; width:120px; height:100px; display: inline-block; text-indent: -9999px;}
.nav_header a.btn_nav_close {background:#00bae2 url('../images/btn_nav_close.png') no-repeat center center;}
/* 이용약관 개인정보 비대면 전자서명 */
.layer_pop_wrap .layer_pop_txt {width:100%; padding-bottom:50px; background:#fff;}
.layer_pop_txt .pop_head {height: 100px;}
.layer_pop_txt .pop_head a.btn_back {position:absolute; top:27px; left:40px; }
.layer_pop_txt .pop_head a.btn_close {position:absolute; top:27px; right:40px; }
.layer_pop_txt .pr_con { padding:0 40px 30px; box-sizing: border-box;}
.layer_pop_txt .pr_con h3 { text-align: center; font-size:36px; line-height:80px; font-weight: normal; color:#4b5265; border-bottom:2px solid #303646; }
.layer_pop_txt .pr_con h3.m_block { line-height:150%; padding:15px 0 15px;}
.layer_pop_txt .pr_con div {width:auto; margin:20px auto;}
.layer_pop_txt .pr_con div.pd500 { min-height:calc(100vh - 90px);}
.layer_pop_txt .pr_con h4 { font-size:24px; font-weight: normal; margin:20px 0; line-height: 50px;  }
.layer_pop_txt .pr_con h4.bullet { background: url('../images/bullet_icon.png') no-repeat 0 center /4px; padding-left:15px; line-height:30px; margin:30px 0 0; }
.layer_pop_txt .pr_con p {font-size:16px; margin:15px 0; text-align: justify; }
.layer_pop_txt .pr_con p span {padding-left: 40px; display: block; line-height: 1.8em;}
.layer_pop_txt .pr_con ul li {padding-left:60px;}
.layer_pop_txt .border_box_wrap { padding:0px 90px;}
.layer_pop_txt .border_box h4 {text-align: center; line-height: 30px; margin: 0;}
.bottom_bg {position:fixed; width:100%; left:0; bottom:0px; height:60px; background:#e4e4e4; }
.bottom_bg {bottom:-60px; background:#e4e4e4; transition:bottom .2s; }
.bottom_bg.show {bottom:0px; background:#e4e4e4;}
.bottom_bg div {width:220px; margin: 20px auto;}
.bottom_bg div label:first-of-type {margin-right:20px;}

.bottom_bg2 {position:fixed; width:100%; left:0; bottom:0px; height:60px; background:#e4e4e4; }
.bottom_bg2 {bottom:0px; background:#e4e4e4;  }
.bottom_bg2 div {width:220px; margin:20px auto;}
.bottom_bg2 div label:first-of-type {margin-right:20px;}

/* login layout */
.wrap { position:relative; width:100%; height:100%; min-width:1024px; margin:0 auto; }
.m_main_wrap { background:#303646 url('../images/tab_main_bg.png') no-repeat center 0 / 1024px auto;}
.login_bg { position:fixed; width:100%; height:100vh;  background:#f1f8ff url('../images/tab_login_bg.png') no-repeat 0 0 /cover; }
h1.login_logo { padding-top: 100px; width: 100%; text-align: center; }
.login_form { margin-top: 100px; width:300px; margin:0 auto;margin-top: 20px;text-align: center; padding-bottom:15px; }
.login_form form { margin-bottom:25px;}
.login_form input { width:100%; margin-top:11px; border:1px solid #d6d6d6; border-radius: 100px; height:50px; font-size:18px; box-sizing: border-box; text-align: center;}
.login_form input[type="checkbox"] { width:20px; height:20px; border:1px solid #d6d6d6; margin-left:0px; margin-top:0px;}
.login_form label { display:inline-block; color:#2d2a31; font-size:16px; margin-top:17px;}
.login_form p.login_option {padding:0 20px; display: flex; justify-content: space-between;}

.login_form a.btn_login {line-height:52px;}
.btn_center { margin-top:15px; font-size:16px; text-align: center;}
.btn_center a {position:relative; color:#2d2a31; margin-right:20px;}
.btn_center a::after {position:absolute; top:5px; margin-left:14px; display:inline-block; width:1px; height:15px; background:#ddd; content: "";}
.btn_center a:last-of-type {margin-right:0;}
.btn_center a:last-of-type::after {display: none; }
.btn_center.m_pd { width:255px; margin:0 auto;  margin-top:15px; display: flex; justify-content: space-around;}
.btn_center.m_pd a {position:relative; color:#2d2a31; text-align: center;}
.btn_center.m_pd a::after {display:inline-block; left:80px; width:1px; height:15px;background:#ddd;content: "";}
.btn_center.m_pd a:last-of-type {margin-right:0; margin-left: 0px;}
.btn_center.m_pd a:last-of-type::after {display: none; }



/* 메인 */
#main { height:calc(100vh - 230px); display: flex; align-items: center;}
#main .main_content {width:760px; margin:0 auto; }
.login_user {position:relative; }
.login_user p {font-size:16px; color:#fff;}
.login_user p span.user_name {font-size:24px; color:#00bae2;}
.login_user .btn_right {position:absolute; bottom:0; right:0;}
.login_user .btn_right a {display: inline-block; border-radius: 5px; width:75px; height:30px; line-height: 30px; font-size: 14px; color:#000; text-align: center;}
.login_user .btn_right a.btn_white {background:#fff;}
.login_user .btn_right a.btn_yellow {background:#ffd618; margin-left: 5px;}

.flex_menu {margin-top:80px; display: flex; justify-content: space-between;}
.flex_menu li a { display: inline-block; width:175px; height:215px; border-radius:9px; }
.flex_menu li a div { padding-top:48px; }
.flex_menu li a div i { display:block; width:110px; margin:0 auto; height:110px; }
.flex_menu li a div i.main_ico {background: url('../images/main_menu_icon.png') no-repeat 0 0;}
.flex_menu li a div p { margin-top:5px; font-size:24px; color:#fff; text-align: center;}
.flex_menu li a.main_menu1 i.main_ico {background-position:-110px 0;}
.flex_menu li a.main_menu2 i.main_ico {background-position:-110px -110px;}
.flex_menu li a.main_menu3 i.main_ico {background-position:-110px -220px;}
.flex_menu li a.main_menu4 i.main_ico {background-position:-110px -330px;}
.flex_menu li a.main_menu1 {background:#4db9de;}
.flex_menu li a.main_menu2 {background:#4ba56b;}
.flex_menu li a.main_menu3 {background:#617fbc;}
.flex_menu li a.main_menu4 {background:#d67456;}
.flex_menu li a:hover {background: #fff; }
.flex_menu li a:hover.main_menu1 i.main_ico {background-position:0 0;}
.flex_menu li a:hover.main_menu2 i.main_ico {background-position:0 -110px;}
.flex_menu li a:hover.main_menu3 i.main_ico {background-position:0 -220px;}
.flex_menu li a:hover.main_menu4 i.main_ico {background-position:0 -330px;}
.flex_menu li a:hover div p {color:#303646;}

/* 페이지 공통 */
#m_header { position:relative; width:100%; height:100px; overflow: hidden; background:url('../images/header_tab_bg.png') no-repeat center 0/cover;}
#m_header.no_bg {  background:none;}
#m_header h1.m_logo {text-align: center; width:180px; padding-top:20px; margin:0 auto;}
#m_header a.btn_back {position:absolute; top:27px; left:40px; }
#m_header a.btn_allmenu {position:absolute; top:32px; right:40px; }

.m_contents {position:relative; width:1024px; height:100%; padding:0 40px 40px 40px; margin:0 auto; background:#fff; box-sizing: border-box;}
.m_contents.bot_menu {padding-bottom:150px;}
.m_contents h3 { text-align: center; font-size:36px; line-height:80px; padding:20px 0 0; height:80px; font-weight: normal; color:#4b5265; border-bottom:2px solid #303646; }
.m_contents h3.title {border-bottom: none;  margin-top:50px;}
.m_contents h3.title p { display: inline-block;}
.m_contents h3.title .icon {display: inline-block; }
.m_contents h3.title .icon img { width:50px; vertical-align:top; padding-top:15px; margin-right:5px;}

.searchwrap {position: relative; height:46px;}
.searchwrap h4 {position:absolute; top:10px; left:0; font-size:20px; font-weight: bold; letter-spacing: 0.5px; }
.searchwrap h4 img {margin-right:10px; margin-top:-5px; }
.searchwrap .search {position:absolute; right:0; display: flex; justify-content: flex-end; padding-top: 10px;}
.searchwrap .search input[type="text"],
.searchwrap .search select  {width:120px; margin-left:10px; margin-right:0; padding-left:20px;}

.page_wrap {margin:20px 0; height:100%; }
.page_wrap.border_top { border-top:1px solid #d3d3d3;}
.search_result p,
.page_default p {font-size:18px; margin:30px 0 15px; text-align:left;}
.border_box {border:1px solid #d3d3d3; border-radius: 4px; min-height:500px; padding:30px 40px;}

.page_default {display: flex; height:calc(100vh - 580px); padding-top:130px; box-sizing: border-box; flex-flow: column; justify-content: center;}
.page_default p {text-align: center;}

.page_default .icon {width:65px; margin:0 auto;}
.page_default .icon img {width:100%;}

/* 퀵메뉴 */
.quick_menu {z-index:5;position: fixed;bottom:0;background: #fff; width:100%;height:130px;box-shadow: 0 -8px 20px 20px #f9f9f9;}
.quick_menu.m_shadow {box-shadow: 0 -8px 20px 20px #2f3544;}
.quick_menu ul {position:relative; display: flex; width:600px; height:100px; margin: 19px auto; }
/* .quick_menu li {width:calc(100% / 4); height:100px; text-align: center; } */
.quick_menu li {width:calc(100% / 3); height:100px; text-align: center; }
.quick_menu li a {color:#333;}
.quick_menu li div p {margin-top:5px;}
.quick_menu li div i {display: block; width:70px; height:70px; margin:0 auto;}
.quick_menu li div i.ico { background:url('../images/quick_menu_icon.png') no-repeat 0 0 ;}
.quick_menu li div.quick1 i.ico {background-position: 0 0;}
.quick_menu li div.quick2 i.ico {background-position: 0 -70px;}
.quick_menu li div.quick3 i.ico {background-position: 0 -140px;}
.quick_menu li div.quick4 i.ico {background-position: 0 -210px;}
.quick_menu li.on div.quick1 i.ico {background-position: -70px 0;}
.quick_menu li.on div.quick2 i.ico {background-position: -70px -70px;}
.quick_menu li.on div.quick3 i.ico {background-position: -70px -140px;}
.quick_menu li.on div.quick4 i.ico {background-position: -70px -210px;}

/* 로그인 인증 */
.pd_box { position:relative; padding:50px 90px 30px;}
.pd_box form p {display: flex; margin:20px 0; justify-content: space-between;}
.pd_box form.center p {display:table; margin:0 auto;}
.pd_box p label { display: inline-block; width:130px; line-height:46px; font-size:18px; color:#575757;}
.pd_box p label.line_h_normal { line-height: normal;}
.pd_box form p input[type="text"],
.pd_box form p input[type="password"],
.pd_box form p select.w100 { width:calc(100% - 140px);}
.pd_box form p input.w80 { width:460px;}
.pd_box form p span.flex_bw,
.pd_box form p span.flex_bw2 {display: flex; width:calc(100% - 140px); justify-content:space-between;}
.pd_box form p span.flex_bw select { width:calc(95% / 3);}
.pd_box form p span.flex_bw input[type="text"] {width:calc(95% / 3); }
.pd_box form p span.flex_bw2 select { width:calc(95% / 2);}
.pd_box form p span.flex_bw2 input[type="text"] {width:calc(100% / 2); }
.pd_box form p span.flex_bw input.wbtn { width:calc(100% - 70px);}
.pd_box form p span.flex_bw2 input.wbtn { width:calc(100% - 150px);}
.pd_box p input.btn_id_chack {margin-left:10px; width:140px; height:46px; font-size: 16px; box-sizing: border-box; border:1px solid #303646; display: inline-block; border-radius:4px; background: #303646; color: #fff; }
.pd_box p a.btn_under {width:160px; line-height: 46px; text-decoration: underline; margin-left:15px; }
.pd_box p a.btn_search {margin-left:10px; width:60px; height:46px; box-sizing: border-box; border:1px solid #303646; display: inline-block;  border-radius: 4px; text-indent: -9999px; color:#fff; line-height: 46px; text-align: center; background:#303646 url('../images/btn_m_search.png') no-repeat center center; background-size:24px;}
.pd_box p a.btn_search img {width:100%;}
.pd_box .flex_ic_tx {position:relative; width:600px; margin:0 auto; }
.pd_box .flex_ic_tx .icon { position:absolute; top:15px; left:40px; }
.pd_box .flex_ic_tx .txt { text-align: center; }
.pd_box .flex_ic_tx .txt p.step2_phone {  font-size:48px; color:#303646; font-weight: bold;  }
.pd_box .flex_ic_tx .txt p.step2_txt {font-size:24px; color: #303646; margin-bottom:40px; }
.pd_box div.pdleft {padding-left:140px;}
.pd_box2 { position:relative; padding:30px 0px 30px; border-top:2px solid #303646;}
.pd_box2 form p {margin:0;}
.pd_box2 p a.right {text-decoration: underline;  line-height: 25px; }
.pd_box2 p input[type="checkbox"] { vertical-align: top; margin-top:2px;}
.pd_box2 p label {color:#303646; width: auto; line-height: 25px; }

/* 마이페이지 */
.pd_box div.flex_bw {display: flex; margin-bottom:20px;}
.pd_box div.flex_bw p.con_title {margin:0; color:#00bae2; width:130px; font-size: 18px; font-weight: bold;}
.pd_box div.flex_bw .con_box { position:relative; width:calc(100% - 130px);}
.pd_box div.flex_bw form {width:100%; margin:0;}

ul.list_style_blue {width:calc(100% - 130px); border-top:2px solid #00bae2;}
ul.list_style_blue li { padding:15px 30px; background-color: #f8f9fb; border-bottom:1px solid #e4e4e4;}
.pd_box div.flex_bw table.tbl_blue {width:calc(100% - 130px);}
.pd_box div.flex_bw .con_box  table.tbl_blue {width:100%;}
.pd_box div.btn_right {position: relative; height:33px;}
.pd_box div.btn_right a.btn_plus {position:absolute; right:0; top:0px; display: block; width:80px; height:28px; line-height: 28px; font-size:14px; padding-left:25px; box-sizing: border-box; border-radius: 4px; border: 1px solid #d3d3d3; text-align: center; background:url('../images/btn_m_plus.png') no-repeat 17px center; }



/* 면회일정 */
div.calendar { width:100%;}
div.calendar div.date { position:relative; width:300px; margin:0 auto; font-size:18px; font-weight:bold; color:#303646; line-height:38px; text-align:center; }
div.calendar div.date a.left { position:absolute; top:0px; left:25px; line-height:0; }
div.calendar div.date a.right { position:absolute; top:0px; right:25px; line-height:0; }
div.info_right {position:relative; width:100%; height:50px;}
div.info_right p.info {position:absolute; right:0; }
div.info_right p.info span { margin-left:30px; font-size:12px;}
div.info_right p.info span i {margin-right:9px; display:inline-block; content: ""; width:15px; height:15px; border:1px solid #d7d7d7; background: #fff; box-sizing: border-box; vertical-align: bottom;}
div.info_right p.info span i.not_icon {background:#efefef;}
/* table type */
table.calendar { width:100%; border-top:1px solid #000; border-collapse: separate;}
table.calendar th { font-size:16px; color:#2b2f3e; font-weight: bold; line-height:50px; text-align:center; background-color:#f5f5f5;  border-right:1px solid #e4e4e4;  border-bottom:1px solid #e4e4e4;}
table.calendar td { font-size:16px;  line-height:30px; padding:25px 0; text-align:center;  border-right:1px solid #e4e4e4;  border-bottom:1px solid #e4e4e4; }
table.calendar td.bg {background:#efefef; color:#bbb;}
table.calendar td.pick_cel {position: relative; background:#e4f5fe;}
table.calendar td.pick_cel:after {position: absolute;content: "";display: block;top: -2px;left: -2px;width:100%;height:100%;border:2px solid #00bae2;}
table.calendar td.pick_cel span.pick {position: absolute; top:10px; right:10px; display:block; width:24px; margin:0 auto; color:#fff; line-height:24px; border-radius:100px; background-color:#00bae2; }
table.calendar th:last-of-type,
table.calendar td:last-of-type {border-right:none;}
/* 면회일정 - 시간 선택 */
span.pick { display:inline-block; width:24px;  margin:0 auto; margin-left:10px; color:#fff; text-align: center; line-height:24px; border-radius:100px; background-color:#00bae2; }
span.pick img {vertical-align:top; padding-top:8px;}
/* 면회 시간 선택완료 */
.box_blue {position:relative; width:calc(100% - 130px); height:80px; border:1px solid #11bee4; padding:25px; box-sizing: border-box; background: #f8f9fb;}
.box_blue p.tit24 {font-size:24px; margin: 0;}
.box_blue div.btn_right {position: absolute; right:20px; top:25px; }
.box_blue div.btn_right a {display: inline-block; font-size:14px; border:1px solid #d9d9d9; border-radius: 5px; background: #fff; width:100px; line-height:30px; text-align: center; }
.box_blue div.btn_right a.btn_blue {border:0; background:#00bae2; color:#fff; margin-right:5px;}
a.btn_cel_del,
input.btn_cel_del{display:inline-block; background:#6f7784; height:46px; line-height: 46px; color:#fff; font-size:16px; padding:0 15px; border-radius: 4px; border: 0;}

/* 비대면 전자서명 */
ul.list_style {display: flex; flex-wrap: wrap; justify-content: space-between;}
ul.list_style li {position:relative; width:calc(98% / 2); margin-bottom: 10px; }
ul.list_style li:nth-of-type(2n) {margin-left: 10px;}
ul.list_style li a {display:block;  border:1px solid #d6d6d6; padding:30px 26px; box-sizing: border-box;  font-size:20px; line-height: 30px; font-weight: bold; }
ul.list_style li a i.chackmark {position:relative; margin-right:40px; top:6px; display:inline-block; content:""; width:30px; height:30px; background: url('../images/chack_sprite.png') no-repeat 0 0/cover;}
ul.list_style li.on a i.chackmark {background-position: 0 -30px;}

/* 파일다운로드 리스트 */
ul.list_style2 li {position:relative; margin-bottom:10px;}
ul.list_style2 li a {display:block; padding:0 20px; line-height: 50px; height:50px; border:1px solid #e4e4e4; border-radius: 4px; color:#575757; box-sizing: border-box;}
ul.list_style2 li.on a {border-color:#666 ;}
ul.list_style2 li i {position: absolute; right:20px; top:10px; text-indent: -9999px; width:32px; height:28px; border-radius: 3px; border:1px solid #dadbdb; box-shadow: 4px 4px 8px rgba(0,14,66,0.1);}
ul.list_style2 li i.down_ico { background: #f8f9fb url('../images/btn_download.png') no-repeat center center/19px auto;}

/* 게시판 */
.search {display: flex; }
.search select {width:100px; margin-right:10px; }
.search input[type="text"] {width:calc(100% - 70px);}
.search a.btn_search {margin-left:10px; width:60px; height:46px; box-sizing: border-box; border:1px solid #303646; display: inline-block;  border-radius: 4px; text-indent: -9999px; color:#fff; line-height: 46px; text-align: center; background:#303646 url('../images/btn_m_search.png') no-repeat center center; background-size:24px;}
.search a.btn_search img {width:100%;}

div.board_view .top_title {position:relative; border-bottom:1px solid #000;}
div.board_view .top_title h4 {font-size:24px; font-weight: normal; color:#2b2f3e; line-height: 30px; padding-bottom:20px;  }
div.board_view .top_title p.m_block {display: none;}
div.board_view .top_title p.date {position:absolute; font-size:15px; right:0; top:10px;}
div.board_view .top_title p.date em.tab_block {display: inline-block; margin-right:10px;}
div.board_view .board_cont {margin-bottom:20px;}
div.board_view .board_text {padding:40px 0;}
div.board_view .file_down {border-top:1px solid #dedede; border-bottom:1px solid #dedede; background:#f8f8f8; padding:20px;}
div.board_view .file_down ul {display: flex; }
div.board_view .file_down li {font-size:12px; line-height: 24px; }
div.board_view .file_down li a {margin:0 20px 0 10px; display: inline-block; width:60px; height:24px; line-height: 24px; border:1px solid #a7a7a7; border-radius: 4px; color:#000; text-align: center; background: #fff; }
div.board_view .btn_right {text-align: right; height:46px;}
div.board_view a.btn_list { display: inline-block; width:78px; line-height:46px; height:46px; font-size:16px; color:#444; text-align: center; border-radius: 4px; border:1px solid #d9d9d9; background: #fff; }

div.board_view .board_prevnext {margin-top: 50px; border-top:1px solid #e4e4e4;}
div.board_view .board_prevnext li { border-bottom:1px solid #e4e4e4; line-height:75px;}
div.board_view .board_prevnext li span {margin:0 20px;}
div.board_view .board_prevnext li a {color:#575757; margin-left: 50px;}



/* page */
div.page { position:relative; width:100%; margin-top:20px; text-align:center;  }
div.page a { display:inline-block; font-size:14px; padding:0 10px; height:30px; line-height:30px; box-sizing: border-box; background-color:#fff; }
div.page a.page { color:#575757; }
div.page a.page.on, .page a.page:hover { color:#00bae2; border:1px solid #22c3e6; }
div.page a.prev {margin-right: 20px;}
div.page a.next {margin-left: 20px;}


/* table design */
ul.bohun-hos-list {margin-top:20px; border-top:2px solid #00bae2;}
ul.bohun-hos-list > li {padding:15px 0; font-size:16px; border-bottom:1px solid #e4e4e4; color:#575757;}
ul.bohun-hos-list li.m_hidden {font-size:16px; font-weight:bold; color:#2b2f3e; line-height:19px; padding:15px 0; background-color:#f8f9fb;}
ul.bohun-hos-list li ul.flex_bw {display:flex; justify-content: space-between; }
ul.bohun-hos-list li ul.flex_bw li {width:calc(100% / 4); text-align: center;}
ul.bohun-hos-list li ul.flex_bw li a { display:inline-block; color:#575757; font-size: 14px; width:52px; line-height:28px; border:1px solid #d9d9d9; text-align: center;}
ul.bohun-hos-list li ul.flex_bw li a.on { color:#00bae2; border:1px solid #22c3e6;}

table.tbl_con { width:100%; margin-top:20px; border-top:1px solid #000; }
table.tbl_con th { font-size:16px; font-weight:bold; color:#2b2f3e; padding:15px 0; text-align:center; border-bottom:1px solid #e4e4e4; background-color:#f8f9fb; }
table.tbl_con td { font-size:16px; color:#575757; line-height:19px; padding:15px 0; text-align:center; border-bottom:1px solid #e4e4e4; }
table.tbl_con th.left,
table.tbl_con td.left {text-align: left; padding-left:20px;}
table.tbl_con th.left {border-right:1px solid #e4e4e4;}


table.board-list { width:100%; margin-top:30px; border-collapse:separate; /*border-top:1px solid #000;*/ border-top:2px solid #00bae2;}
table.board-list th { font-size:16px; font-weight:bold; color:#2b2f3e; padding:15px 0; text-align:center; border-right:1px solid #e4e4e4; border-bottom:1px solid #e4e4e4; background-color:#f8f9fb; box-sizing: border-box; }
table.board-list td { font-size:15px; color:#575757; line-height:20px; padding:15px 0; text-align:center; border-right:1px solid #e4e4e4; border-bottom:1px solid #e4e4e4; box-sizing: border-box; }
table.board-list td.subject { position:relative; text-align: left; padding-left:20px; }
table.board-list td.subject img {vertical-align: top; margin-top: 3px; margin-right: 10px; }
table.board-list td.subject a { position:absolute; top:16px; display: inline-block; width:calc(80% - 46px); white-space: nowrap; overflow: hidden;  text-overflow: ellipsis;  }
table.board-list td.subject .ico_outer { display: inline-block; margin-right: 10px; }
table.board-list td.subject .ico_outer .ico { display: inline-block;  width: 36px;  height: 15px; line-height: 15px;  font-size: 11px; color: #ed4747; text-align: center; font-style: normal; border:1px solid #ef6060;  background: #fff;}
table.board-list th:last-of-type,
table.board-list td:last-of-type {border-right:none;}

table.tbl_blue { width:100%; margin-top:0px; border-top:2px solid #00bae2; border-collapse:separate; }
table.tbl_blue th { font-size:16px; padding:10px 0px; font-weight: normal; padding-left:20px; text-align: left; background:#f2f5fb; border-right:1px solid #d3d3d3; border-bottom:1px solid #d3d3d3;}
table.tbl_blue th.center { text-align: center; padding-left:0;}
table.tbl_blue td { font-size:16px; line-height:30px; padding:10px 10px; border-bottom:1px solid #d3d3d3;}
table.tbl_blue td input[type="text"],
table.tbl_blue td select {width:100%;}
table.tbl_blue td input.w100 { width:100px; text-align: center; padding:0; margin-left:10px;}
table.tbl_blue td input.on {border:2px solid #00bae2; background: #e4f5fe; }
table.tbl_blue td div.flex_bw,
table.tbl_blue td div.flex_bw2,
table.tbl_blue td div.flex_bw3 {display: flex; justify-content:space-between; margin: 0;}
table.tbl_blue td div.flex_bw input[type="text"],
table.tbl_blue td div.flex_bw select,
table.tbl_blue td div.flex_bw3 input[type="text"],
table.tbl_blue td div.flex_bw3 select {width:calc(100% / 3); flex-basis: 33%; margin-right:10px;}
table.tbl_blue td div.flex_bw input[type="text"]:last-of-type,
table.tbl_blue td div.flex_bw3 input[type="text"]:last-of-type {margin-right: 0;}
table.tbl_blue td div.flex_bw2 select { width:calc(98% / 2);}
table.tbl_blue td div.flex_bw2 input[type="text"] {width:calc(100% / 2); }

/* 일일식단표 */
table.meal-list { width:100%; margin-top:20px; border:1px solid #d7d7d8; }
table.meal-list th { font-size:16px; color:#303646; font-weight:normal; line-height:25px; padding:18px 0; text-align:center; border-bottom:1px solid #d7d7d8; border-right:1px solid #d7d7d8;  background-color:#e8f9e5; }
table.meal-list td { font-size:14px; color:#666; height:52px; line-height:19px; padding:10px 20px 10px 43px; text-align:left; border-bottom:1px solid #d7d7d8; box-sizing: border-box; }
table.meal-list td ul,
table.meal-list td div { padding:10px 0 0; height:85px; display: flex; flex-flow: column; flex-wrap: wrap;}
table.meal-list td ul.no_padding,
table.meal-list td div.no_padding {padding:0; height:auto;}
table.meal-list td li,
table.meal-list td div.p {line-height: 25px;}

/* 갤러리 */
ul.gallery_list { border-top:1px solid #000; border-bottom:1px solid #e4e4e4; display: flex; flex-wrap: wrap;  padding:10px 0 30px;}
ul.gallery_list li { width:calc(92%/4); margin-top:20px; margin-right:20px;}
ul.gallery_list li:nth-of-type(4n) {margin-right:0;}
ul.gallery_list li div.img {width:100%; height:175px; overflow: hidden; }
ul.gallery_list li div.img img { width: 350px; height: 200px;  object-fit: cover;  }
ul.gallery_list li p.gal_title { margin-top:10px; font-size:15px; font-weight: bold; }
ul.gallery_list li p.gal_txt { font-size:12px; width:160px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}


@media screen and (max-width:980px) {
    .wrap { width:100%; min-width:760px;}
    .m_contents {width:auto; }

    #main .main_content {width:650px; margin:0 auto; }
    .flex_menu li a { width:150px; height:215px; border-radius:9px; background: #fff; }

    .layer_pop_txt .pr_con div { margin:20px auto;}
    .layer_pop_txt .pr_con div.pd500 { min-height:calc(100vh - 90px);}
    
    .layer_pop_wrap.fix2 { position:absolute; width:100%; height:100%;}
    .gallery_view_wrap {position:absolute; left:0%; top:0%; transform: translate(-0%, -0%); width:100%; height:100%; overflow-y:hidden; margin:0 auto; background:#fff; box-sizing: border-box;}
    .gallery_view_wrap .layer_title { position:relative; height:50px; background:#00bae2;}
    .gallery_view_wrap .layer_title h3 { font-size:24px; line-height:50px; padding-left:20px; color:#fff; font-weight: normal; }
    .gallery_view_wrap .layer_title a.btn_close { position:absolute; top:13px; right:20px;}
    .gallery_view_wrap .gallery_view {padding:20px 40px; height:calc(100% - 100px); }
    .gallery_view_wrap .gallery_view h4 {font-size:24px; color:#4b5265; line-height: 50px; font-weight: normal; border-bottom:1px solid #dadbdb; text-align: center;}
    .gallery_view_wrap .gallery_view div.mg20 {margin:20px 0; }
    .gallery_view_wrap .gallery_view div.mg20 img { width:100%; margin-bottom:20px;}

    .searchwrap h4 {display:none; }
    .searchwrap .search {position:relative; margin:0 auto; display: flex;}
    .searchwrap .search input[type="text"],
    .searchwrap .search select {width:calc(100% / 4); margin-left:10px; padding-left:10px;}
    .searchwrap .search input[type="text"]:first-of-type {margin-left:0;}

    /* 면회 시간 선택완료 */    
    .box_blue {height:140px; width:calc(100% - 95px);}
    .box_blue p.tit24 { display: block; text-align:center;}
    .box_blue div.btn_right {position:inherit; width:215px; margin: 0 auto; right:0; margin-top:0px;  }
    
    /* 비대면 전자서명 */
    ul.list_style {display: block;}
    ul.list_style li {position:relative; width:100%;  }
    ul.list_style li:nth-of-type(2n) {margin-left:0;}    
    ul.list_style li a { padding:30px 20px;}
    ul.list_style li a i.chackmark { margin-right:20px;}

    /* 마이페이지 */
    .pd_box div.flex_bw p.con_title { width:95px; font-size: 17px; }
    .pd_box div.flex_bw .con_box {width:calc(100% - 95px);} 
    ul.list_style_blue {width:calc(100% - 95px); }

    .pd_box div.flex_bw table.tbl_blue {width:calc(100% - 95px);}
    .pd_box div.flex_bw .con_box table.tbl_blue {width:100%;}


    table.tbl_blue.mg_t0 {margin-top:0;}
    table.tbl_blue td div.flex_bw3 {flex-wrap: wrap;}
    table.tbl_blue td div.flex_bw3 input[type="text"] {width:46%; flex-basis: 46%; max-width:46%; /*margin-right:10px;*/}
    table.tbl_blue td div.flex_bw3 select {width:calc(100% / 2); flex-basis: 50%; max-width: 50%;  margin-right:0px;}
    table.tbl_blue td div.flex_bw3 input#eml2 {width:100%; max-width:100%; flex-basis: 100%; margin-right:0; margin-top:10px;}
    table.meal-list td ul,
    table.meal-list td div { padding:10px 0 0; height:130px; display: flex; flex-flow: column; flex-wrap: wrap;}

    /* 갤러리 */
    ul.gallery_list { display:block; }
    ul.gallery_list li {position:relative; width:100%; margin-top:20px; margin-right:20px;}
    ul.gallery_list li:nth-of-type(4n) {margin-right:20px;}
    ul.gallery_list li div.img {width:150px; height:150px; overflow: hidden; }
    ul.gallery_list li div.img img { width: 300px; height: 150px;  object-fit: cover;  }
    ul.gallery_list li div.tittxt { position:absolute; top:30px; left:170px; width:calc(100% - 150px);}
    ul.gallery_list li p.gal_title { margin-top:10px; font-size:15px; font-weight: bold; }
    ul.gallery_list li p.gal_txt {margin-top:10px; font-size:12px; width:90%; white-space: normal; height: 30px; text-align: left; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}


}
@media screen and (max-width:768px) {
    body { font-size: 15px;}

    a.btn_com_bule,
    form input[type="submit"]{ margin-top:40px; box-shadow: 0px 5px 10px 0px rgba(0,14,66,0.1); }
    input[type="text"], input[type="password"] { height: 40px;  font-size:15px;  padding: .8em .5em;  }
    select {height: 40px;  font-size:15px;  padding-right:34px;  background:url('../images/arr_select.png') no-repeat right center/35px auto;}
    em.m_block {display:block;}
    em.tab_block {display:inline;}

    .gallery_view_wrap .layer_title { position:relative; height:60px; background:#00bae2;}
    .gallery_view_wrap .layer_title h3 { font-size:20px; line-height:60px; padding-left:20px; color:#fff; font-weight: normal; }
    .gallery_view_wrap .layer_title a.btn_close { position:absolute; top:15px; right:20px;}
    .gallery_view_wrap .gallery_view {padding:20px 40px; height:calc(100% - 100px); }
    .gallery_view_wrap .gallery_view h4 {font-size:20px; color:#4b5265; line-height: 40px; font-weight: normal; border-bottom:1px solid #dadbdb; text-align: center;}
    
    .wrap { width:auto; min-width:auto; }
    .m_main_wrap {background:#303646 url('../images/m_main_bg.png') no-repeat center -20px /500px auto;}
    .login_bg { background:#f1f8ff url('../images/m_login_bg.png') no-repeat 0 0 /cover; }

    .login_form input[type="text"],
    .login_form input[type="password"] { margin-bottom:5px; box-shadow: 0px 5px 10px 0px rgba(0,14,66,0.1); }

    .btn_center.m_pd { width:190px; margin:0 auto;  margin-top:15px; display: flex; justify-content: space-around;}
    .btn_center.m_pd a {position:relative; color:#2d2a31; text-align: center;}
    .btn_center.m_pd a::after {display:inline-block; left:60px; width:1px; height:15px; background:#ddd;content: "";}
    .btn_center.m_pd a:last-of-type {margin-right:0; margin-left: 0px;}
    .btn_center.m_pd a:last-of-type::after {display: none; }

    
    /* nav */
    .mobile_nav_wrap { display: block; z-index:10; position:fixed; top:60px; width:100%; height:100%; background-color: rgba(0,0,0,0.5);}
    #mobile_nav { position:absolute; width:88%; height:100vh; background:#fff;}
    #mobile_nav div.nav {width:auto; margin: 0 auto;  margin-top:0px;}
    #mobile_nav div.nav ul.m_nav_1depth {display: flex; border-top:1px solid #fff; width:45%; height:100vh; flex-direction: column; background: #e8e8e8;}
    #mobile_nav div.nav ul.m_nav_1depth li {width:100%; cursor: pointer; }
    #mobile_nav div.nav ul.m_nav_1depth li div {position:relative; border-bottom:1px solid #fff; height:auto; padding:15px 0; box-sizing: border-box; text-align: center;}
    #mobile_nav div.nav ul.m_nav_1depth li:last-of-type div {border-bottom: none; }
    #mobile_nav div.nav ul.m_nav_1depth li div p {display:block; font-size: 18px; width:auto; margin:0 auto; margin-top:10px; text-align: center; line-height:20px; color:#4b5265; font-weight: bold;}


    #mobile_nav div.nav ul.m_nav_1depth li div i {position:relative; display:inline-block; margin: 0; }          
    #mobile_nav div.nav ul.m_nav_1depth li.nav_menu1:hover div i.nav_ico,
    #mobile_nav div.nav ul.m_nav_1depth li.nav_menu1.on div i.nav_ico {background-position: -36px 0;}
    #mobile_nav div.nav ul.m_nav_1depth li.nav_menu2:hover div i.nav_ico,
    #mobile_nav div.nav ul.m_nav_1depth li.nav_menu2.on div i.nav_ico {background-position: -36px -36px;}
    #mobile_nav div.nav ul.m_nav_1depth li.nav_menu3:hover div i.nav_ico,
    #mobile_nav div.nav ul.m_nav_1depth li.nav_menu3.on div i.nav_ico {background-position: -36px -72px;}
    #mobile_nav div.nav ul.m_nav_1depth li.nav_menu4:hover div i.nav_ico,
    #mobile_nav div.nav ul.m_nav_1depth li.nav_menu4.on div i.nav_ico {background-position: -36px -108px;}

    #mobile_nav div.nav ul.m_nav_1depth li:hover,
    #mobile_nav div.nav ul.m_nav_1depth li.on { background:#4b5265;}
    #mobile_nav div.nav ul.m_nav_1depth li:hover div::after,
    #mobile_nav div.nav ul.m_nav_1depth li.on div::after {position:absolute; display: inline-block; content: ""; width:14px; height:31px; top:35%; left:100%; background:url('../images/nav_1depth_on_arr.png') no-repeat 0 0;}
    #mobile_nav div.nav ul.m_nav_1depth li:hover div p,
    #mobile_nav div.nav ul.m_nav_1depth li.on div p  {color:#fff;}
    #mobile_nav div.nav ul.m_nav_1depth ul {display: none;}

    #mobile_nav div.nav div.menu_cont {display: none; position:absolute; top:0; right:0px; width:47%; padding:0; background:#fff;}    
    #mobile_nav div.nav div.menu_cont.on {display: block;}
    #mobile_nav div.nav div.menu_cont dl dt { display: block; padding-top:20px; font-size: 20px; font-weight: bold; line-height: 50px; border-bottom:2px solid #4b5265;}
    #mobile_nav div.nav div.menu_cont dl dt i.arr_ico {display: inline-block; vertical-align: top; margin-left:20px; margin-top:11px; width:24px; height:24px; background:url('../images/nav_1depth_arr.png') no-repeat 0 0/24px;}
    #mobile_nav div.nav div.menu_cont dl dd { background: url('../images/dot_icon.png') no-repeat 0 center /4px; padding-left:20px; line-height:40px; border-bottom:1px solid #d3d3d3;}
    #mobile_nav div.nav div.menu_cont dl dd a:hover {text-decoration:none; color:#575757;}

    .nav_header {position:absolute; width:100%; height:60px; top:-60px;}
    .nav_header .tab_none { position:absolute; display:block; width:100%; background: #00bae2; height:60px; padding:7px 20px; box-sizing: border-box;}
    .nav_header .tab_none i.u_icon {display: inline-block; vertical-align: top; margin-top:2px; width:40px; height:40px; background: url('../images/user_icon.png') no-repeat 0 0/40px;}
    .nav_header .tab_none p {margin-left:20px; margin-top:8px; display: inline-block; color:#fff; font-size:14px; }
    .nav_header .tab_none p em.u_name {display: block; font-size:17px; }    
    .nav_header .tab_none div.login,
    .nav_header .tab_none div.logout {position: absolute; width:calc(100% - 115px); height:100%; top:0px; left:50px;}
    .nav_header .btn_right {display: block; position: absolute; right:0px; top:16px;}
    .nav_header .btn_right a {display: inline-block; border-radius: 4px; width:70px; height:28px; line-height: 28px; font-size: 12px; color:#000; text-align: center;}
    .nav_header .btn_right a.btn_white {background:#fff; margin-right:5px;}
    .nav_header .btn_right a.btn_yellow {background:#ffd618;}
    .nav_header a.btn_nav_close { position: absolute; right:0; width:60px; height:60px; display: inline-block; text-indent: -9999px;}
    .nav_header a.btn_nav_close {background:#00bae2 url('../images/btn_nav_close.png') no-repeat center center/30px;}

    

    /* 이용약관 개인정보 비대면 전자서명 */
    .layer_pop_txt .pop_head {height: 55px;}
    .layer_pop_txt .pop_head a.btn_back {position:absolute; top:20px; left:15px; width:16px;}
    .layer_pop_txt .pop_head a.btn_close {position:absolute; top:20px; right:15px; width:21px;}
    .layer_pop_txt .pop_head a img {width:100%;}
    .layer_pop_txt .pr_con {padding:0 20px 30px;}
    .layer_pop_txt .pr_con h3 { text-align: center; font-size:20px; line-height:40px;  border-bottom:2px solid #303646;}
    .layer_pop_txt .pr_con h3.m_block { line-height:140%; padding:10px 0 10px;}
    .layer_pop_txt .pr_con h4 { font-size:18px; font-weight: normal; margin:20px 0; line-height: 30px; color:#4b5265;}
    .layer_pop_txt .pr_con h4.bullet {line-height:30px; margin:20px 0 0; }
    .layer_pop_txt .pr_con p {padding-right:15px; font-size:15px; margin:10px 0; text-align: justify; }
    .layer_pop_txt .pr_con p span {padding-left: 20px; display: block; font-size:14px; line-height: 1.5em;}
    .layer_pop_txt .pr_con ul li {padding-left:40px; font-size:14px;}
    .layer_pop_txt .border_box_wrap {padding:0px 0px;}
    .layer_pop_txt .border_box h4 {text-align: center; line-height: 30px; margin: 0;}
    
    
    
    /* 메인 */
    #main { height:calc(100vh - 160px); width:100%; display: flex; align-items:center; justify-content: center;}
    #main .main_content {width:calc(100% - 40px); margin:0 auto; margin-bottom:40px; padding:0 20px;}
    .login_user {position:relative;  width:100%; }
    .login_user p {font-size:16px; color:#fff;}
    .login_user p span.user_name {font-size:24px; color:#00bae2;}
    .login_user .btn_right {position:absolute; bottom:0; right:0px;}
    .login_user .btn_right a {display: block; border-radius: 5px; width:75px; height:30px; line-height: 30px; font-size: 14px; color:#000; text-align: center;}
    .login_user .btn_right a.btn_yellow {margin-left: 0px; margin-top: 10px;}

    .flex_menu {margin-top:30px; width:100%; display:flex; flex-wrap: wrap; justify-content:space-between; }
    .flex_menu li {width:calc(97% / 2);}
    .flex_menu li a { display:block; width:100%; height:140px; border-radius:9px;  }
    .flex_menu li a:first-of-type,
    .flex_menu li a:nth-of-type(3) {margin-right: 15px; margin-bottom:15px;}
    .flex_menu li a div { padding-top:20px; }
    .flex_menu li a div i { display:block; width:80px; margin:0 auto; height:80px; }
    .flex_menu li a div i.main_ico {background: url('../images/main_menu_icon.png') no-repeat 0 0; background-size: 160px auto;}
    .flex_menu li a div p { margin-top:0px; font-size:18px;  }
    .flex_menu li a.main_menu1 div i.main_ico  {background-position:-80px 0;}
    .flex_menu li a.main_menu2 div i.main_ico {background-position:-80px -80px;}
    .flex_menu li a.main_menu3 div i.main_ico {background-position:-80px -160px;}
    .flex_menu li a.main_menu4 div i.main_ico {background-position:-80px -240px;}
    .flex_menu li a.main_menu1:hover i.main_ico {background-position:0 0;}
    .flex_menu li a.main_menu2:hover i.main_ico {background-position:0 -80px;}
    .flex_menu li a.main_menu3:hover i.main_ico {background-position:0 -160px;}
    .flex_menu li a.main_menu4:hover i.main_ico {background-position:0 -240px;}


    /* 페이지 공동 */
    #m_header { position:relative; width:100%; height:60px; background:url('../images/header_bg.png') no-repeat center 0/cover; }
    #m_header h1.m_logo {text-align: center; padding-top:10px; width:115px; margin:0 auto;}
    #m_header h1.m_logo img {width:100%;}
    #m_header a.btn_back {position:absolute; top:15px; left:15px; width:20px;}    
    #m_header a.btn_allmenu {position:absolute; top:17px; right:15px; width:30px;}
    #m_header a img {width:100%;}

    .searchwrap {height:auto;}
    .searchwrap .search {position:relative; margin:0 auto; }

    .border_box {padding:20px 20px;}

    /* 퀵메뉴 */
    .quick_menu {box-shadow: 0 -8px 10px 10px #f9f9f9; height:100px;}
    .quick_menu ul {position:relative; display: flex; width:100%; height:80px; margin: 15px auto; }   
    .quick_menu li {font-size:14px; height:80px; }
    .quick_menu li div i {display: block; width:50px; height:50px; margin:0 auto;}
    .quick_menu li div i.ico { background:url('../images/quick_menu_icon.png') no-repeat 0 0/100px auto ;}
    .quick_menu li div.quick1 i.ico {background-position: 0 0;}
    .quick_menu li div.quick2 i.ico {background-position: 0 -50px;}
    .quick_menu li div.quick3 i.ico {background-position: 0 -100px;}
    .quick_menu li div.quick4 i.ico {background-position: 0 -150px;}
    .quick_menu li.on div.quick1 i.ico {background-position: -50px 0;}
    .quick_menu li.on div.quick2 i.ico {background-position: -50px -50px;}
    .quick_menu li.on div.quick3 i.ico {background-position: -50px -100px;}
    .quick_menu li.on div.quick4 i.ico {background-position: -50px -150px;} 

    .m_contents { margin:0; padding:0 15px 30px 15px;}
    .m_contents.bot_menu {padding-bottom:120px;}
    .m_contents h3 { text-align: center; font-size:20px; line-height:50px; height:50px; font-weight: normal; color:#4b5265; border-bottom:2px solid #303646; }
    .m_contents h3.title {position:relative;width:200px;margin: 0 auto;padding: 50px 0 20px;border-bottom: none;line-height:30px;text-align: left;}
    .m_contents h3.title p { padding-left:70px; }
    .m_contents h3.title .icon {display: inline-block;  position:absolute;}
    .m_contents h3.title .icon img { width:50px; vertical-align:top; padding-top:6px; margin-right:25px;}

    .pd_box { padding:5px 0px;  border-bottom:none;}
    .pd_box form p {display: block; width:100%; margin:10px 0;}
    .pd_box form p select,
    .pd_box form p input[type="text"],
    .pd_box form p input[type="password"],
    .pd_box form p select.w100 { height:40px; width:100%;}
    .pd_box form p input.w80 { width:100%;}
    .pd_box form p span.flex_bw,
    .pd_box form p span.flex_bw2 {width:100%;}
    .pd_box p label {display: block; font-size:16px; line-height:30px; font-weight: bold; margin-bottom:10px;}  
    .pd_box p label.line_h_normal { line-height: 30px;}
    .pd_box p input.btn_id_chack { height:40px; font-size:15px;}
    .pd_box p a.btn_under {display:block; width:100%; line-height: 46px; text-decoration: none; color:#303646; text-align: center; font-size:20px; margin-top:20px; margin-left:0;}  
    .pd_box p a.btn_search { width:60px; height:40px; background-size:20px; }
    .pd_box .flex_ic_tx {position:relative; width:100%; margin:0 auto; }
    .pd_box .flex_ic_tx .icon { position:relative; top:30px; left:0; text-align: center; width:100%; }
    .pd_box .flex_ic_tx .txt { text-align: center; }
    .pd_box .flex_ic_tx .txt p.step2_phone { font-size:40px; color:#303646; font-weight: bold; padding-left:0px; padding-top:50px; }
    .pd_box .flex_ic_tx .txt p.step2_txt { font-size:20px; color: #303646; margin-bottom:40px; padding-left:0px; padding-top:10px}
    .pd_box div.pdleft {padding-left:0px;}

    .pd_box2 { margin-top: 30px; padding:20px 0px 20px; border-top:2px solid #303646; /*border-bottom:1px solid #d3d3d3;*/}
    .pd_box2 p label {display: inline-block; font-weight:normal}
    .pd_box2 p input[type="checkbox"] { margin-top:4px;}
    

    /* 마이페이지 */
    .pd_box div.flex_bw {display:block; margin-bottom:20px;}
    .pd_box div.flex_bw p.con_title {color:#00bae2; width:100px; font-size: 17px; text-align: left; font-weight:normal; line-height:46px;}
    .pd_box div.flex_bw .con_box {width:100%;} 
    .pd_box div.flex_bw form {width:100%; margin:0;}
    ul.list_style_blue { width:100%; border-top:2px solid #00bae2;}
    ul.list_style_blue li { padding:15px 20px; background-color: #f8f9fb; border-bottom:1px solid #e4e4e4;}
    .pd_box div.flex_bw table.tbl_blue {width:100%;}
    .pd_box div.btn_right {position: relative; height:0px; top:8px;}
    .pd_box div.btn_right a.btn_plus {position:absolute; right:0; top:0px; display: block; width:80px; height:28px; line-height: 28px; font-size:14px; padding-left:25px; box-sizing: border-box; border-radius: 4px; border: 1px solid #d3d3d3; text-align: center; background:url('../images/btn_m_plus.png') no-repeat 17px center; background-size: 12px 12px;}
    
    /* 면회일정 */
    div.calendar { width:100%;}
    div.calendar div.date { position:relative; width:300px; margin:0 auto; font-size:18px; font-weight:bold; color:#303646; line-height:38px; text-align:center; }
    div.calendar div.date a.left { position:absolute; top:0px; left:25px; line-height:0; }
    div.calendar div.date a.right { position:absolute; top:0px; right:25px; line-height:0; }
    div.info_right {position:relative; width:100%; height:50px;}
    div.info_right p.info {position:absolute; width:auto; top:10px; right:0; }
    div.info_right p.info span { margin-left:30px; font-size:12px;}
    div.info_right p.info span i {margin-right:9px; display:inline-block; content: ""; width:15px; height:15px; border:1px solid #d7d7d7; background: #fff; box-sizing: border-box; vertical-align: bottom;}
    div.info_right p.info span i.not_icon {background:#efefef;}
     /* 면회 시간 선택완료 */
    .box_blue {width:100%; }
    .box_blue div.btn_right {margin-top:20px; }
    a.btn_cel_del,input.btn_cel_del { height:40px; line-height: 40px;  font-size:14px; }

    /* 비대면 전자서명 */
    ul.list_style {display: block; margin-top:10px;}
    ul.list_style li {position:relative; width:100%;}  
    ul.list_style li a {font-size:16px; line-height:45px; font-weight: bold;  padding:0px 20px; height:45px;}
    ul.list_style li a i.chackmark {position:relative; margin-right:10px; top:5px; display:inline-block; content:""; width:20px; height:20px; background: url('../images/chack_sprite.png') no-repeat 0 0/cover;}
    ul.list_style li.on a i.chackmark {background-position: 0 -20px;}

    /* 파일다운로드 리스트 */
    ul.list_style2 li a {padding:10px 20px; line-height: 25px; height:auto; }
    ul.list_style2 li i {top: 50%; transform: translateY(-50%);}/* {top:20px; } */

    /* table type */
    table.calendar { width:100%; border-top:1px solid #000;}
    table.calendar th { font-size:14px; color:#2b2f3e; font-weight: bold; line-height:50px; text-align:center; background-color:#f5f5f5;  border-right:1px solid #e4e4e4;  border-bottom:1px solid #e4e4e4;}
    table.calendar td { font-size:14px;  line-height:30px; padding:25px 0; text-align:center;  border-right:1px solid #e4e4e4;  border-bottom:1px solid #e4e4e4; }
    table.calendar td.bg {background:#efefef; color:#bbb;}
    table.calendar td.pick_cel {position: relative; background:#e4f5fe;}
    table.calendar td.pick_cel:after {position: absolute;content: "";display: block;top: -2px;left: -2px;width:100%;height:100%;border:2px solid #00bae2;}
    table.calendar td.pick_cel span.pick {position: absolute; top:0%; left:0; bottom:0; right:0%; height:24px; display:block; width:24px; margin:10% auto; color:#fff; line-height:24px; border-radius:100px; background-color:#00bae2; }
    table.calendar th:last-of-type,
    table.calendar td:last-of-type {border-right:none;}


    /* 게시판 */
    .search {display: flex; padding-top:15px;}
    .search input[type="text"] {height:40px;}
    .search a.btn_search {margin-left:10px; width:60px; height:40px; background-size:20px;}
    .search a.btn_search img {width:100%;}

    div.board_view .top_title {position:relative; padding-bottom:20px;}
    div.board_view .top_title h4 {font-size:20px; font-weight: normal; color:#2b2f3e; line-height: 35px; padding-bottom:10px;  }
    div.board_view .top_title p.m_block {display: block;}
    div.board_view .top_title p {line-height:150%;}
    div.board_view .top_title p.date {position:relative; font-size:14px; left:0; top:0px;}
    div.board_view .top_title p.date em.tab_block {display: none;}

    div.board_view .board_cont {margin-bottom:20px;}
    div.board_view .board_text {padding:30px 0;}
    div.board_view .file_down {border-top:1px solid #dedede; border-bottom:1px solid #dedede; background:#f8f8f8; padding:10px 10px 0 10px;}
    div.board_view .file_down ul {display: block; }
    div.board_view .file_down li {position:relative; font-size:12px; line-height: 24px;  height:40px;}
    div.board_view .file_down li a {position:absolute; right:0; margin:0; display: inline-block; width:60px; height:24px; line-height: 24px;  }
    div.board_view .btn_right {height:46px;}
    div.board_view a.btn_list { display: inline-block; width:78px; line-height:46px; height:46px; font-size:15px; color:#444; text-align: center; border-radius: 4px; border:1px solid #d9d9d9; background: #fff; }

    div.board_view .board_prevnext {margin-top: 30px; border-top:1px solid #e4e4e4;}
    div.board_view .board_prevnext li { border-bottom:1px solid #e4e4e4; line-height:50px;}
    div.board_view .board_prevnext li span {margin:0 10px;}
    div.board_view .board_prevnext li a {margin-left: 30px;}
    
    
    /* table design */
    ul.bohun-hos-list {margin-top:20px; border-top:2px solid #00bae2;}
    ul.bohun-hos-list > li {padding:15px 0; font-size:14px; border-bottom:1px solid #e4e4e4;}
    ul.bohun-hos-list li.m_hidden {position:absolute; width:0; height:0; font-size:0; line-height:0; text-indent:-10000px; overflow:hidden;}
    ul.bohun-hos-list li ul.flex_bw {display:flex; justify-content: space-between; }
    ul.bohun-hos-list li ul.flex_bw li {position:relative; width:calc(60% / 3); text-align: center; /*border:1px solid yellow;*/}
    ul.bohun-hos-list li ul.flex_bw li::after {position:absolute; display:inline-block; top:4px; left:0; width:1px; height:15px;background:#ddd;content: "";}
    ul.bohun-hos-list li ul.flex_bw li:nth-of-type(3) {width:40%; text-align: left; padding:0 10px;}
    ul.bohun-hos-list li ul.flex_bw li:last-of-type {text-align:right;}
    ul.bohun-hos-list li ul.flex_bw li:last-of-type::after,
    ul.bohun-hos-list li ul.flex_bw li:nth-of-type(1)::after {display: none;}
    ul.bohun-hos-list li ul.flex_bw li a { display:inline-block; color:#575757; font-size: 14px; width:52px; line-height:25px; border:1px solid #d9d9d9; text-align: center;}
    ul.bohun-hos-list li ul.flex_bw li a.on { color:#00bae2; border:1px solid #22c3e6;}    

    table.tbl_con { width:100%; margin-top:0px; border-top:1px solid #000;  }
    table.tbl_con thead {display:none;}
    table.tbl_con tr {display: block; padding:15px 0;  border-bottom:1px solid #d3d3d3;}
    table.tbl_con th { width:100%; font-size:14px; font-weight:bold; color:#2b2f3e; padding:18px 0; text-align:center; border-bottom:1px solid #e4e4e4; background-color:#f8f9fb; }
    table.tbl_con td { display:block; font-size:14px; color:#575757; line-height:20px; padding:0; text-align:left; border-bottom:none;}
    table.tbl_con td:first-of-type {font-weight: bold; margin-bottom:10px;}
    table.tbl_con th.left { padding:0; border-bottom:none; background-color: #fff; border:none; line-height:20px; padding-bottom:10px;}
    table.tbl_con td.left {font-weight: normal; padding:0; line-height:20px; margin-bottom:0;}

	/*20210625 테이블 줄 정상적으로 나오도록 추가  */
	table.board-list colgroup {display : none;}
    table.board-list { width:100%; margin-top:20px; border-top:2px solid #00bae2; }
    table.board-list thead { display: none;}
    table.board-list tr {display: block;  border-bottom:1px solid #d3d3d3;}
    table.board-list td { font-size:14px; color:#575757; line-height:15px; padding:10px 5px; text-align:left; border-right:none; border-bottom:none; }
    table.board-list td:first-of-type,
    table.board-list td.m_none {display: none;}
    table.board-list td.m_line {position:relative; padding-left: 20px; top:0; }
    table.board-list td.m_line::after {position:absolute; content: ""; top:12px; left:9px; display:inline-block; width:1px; height:13px; background: #a9a9a9; }
    table.board-list td.subject { position:relative; width:calc(100% - 100px); height:30px; display:block; text-align: left; padding-left:5px; font-size:16px; line-height: 20px;}
    table.board-list td.subject a { position:absolute; top:11px; display:inline-block; width:100%; white-space: nowrap; overflow: hidden;  text-overflow: ellipsis;  }
    table.board-list td.subject .ico_outer { margin-right: 10px; }
    table.board-list td.subject .ico_outer .ico { display: inline-block;  width: 36px;  height: 15px; line-height: 15px;  font-size: 11px; color: #ed4747; text-align: center; font-style: normal; border:1px solid #ef6060;  background: #fff;}
    table.board-list th:last-of-type,
    table.board-list td:last-of-type {border-right:none;}

    table.tbl_blue.mg_t0 {margin-top:0;} 
    table.tbl_blue th { font-size:14px; padding:10px 20px; }
    table.tbl_blue td { font-size:14px; }
    table.tbl_blue.mg_t0 {margin-top:0;}
    /* table.tbl_blue td div.flex_bw3 input[type="text"] {flex-basis: 53%; max-width:50%;} */
    /* table.tbl_blue td div.flex_bw3 select {width:calc(100% / 2);  margin-right:0px;}  */
    table.tbl_blue td div.flex_bw3 input#eml2 {width:100%; flex-basis: 100%; margin-right:0; margin-top:10px;}
    table.meal-list td ul,
    table.meal-list td div { padding:10px 0 0; height:130px; display: flex; flex-flow: column; flex-wrap: wrap;} 

    /* 일일식단표 */
    table.meal-list { width:100%; margin-top:20px; border:1px solid #d7d7d8; border-bottom: none;}
    table.meal-list th { display: block; font-size:14px; color:#303646; font-weight:normal; line-height:25px; padding:10px 0; text-align:center; border-bottom:1px solid #d7d7d8; border-right:none;  background-color:#e8f9e5; }
    table.meal-list td { display: block; font-size:14px; color:#666; height:auto; line-height:19px; padding:10px 20px 10px 43px; text-align:left; border-bottom:1px solid #d7d7d8; box-sizing: border-box; }
    table.meal-list td ul,
    table.meal-list td div { padding:10px 0 0; display: flex; flex-flow: column; flex-wrap: wrap;}
    table.meal-list td ul.no_padding,
    table.meal-list td div.no_padding {padding:0; height:auto; display: flex; flex-flow: row; flex-wrap: wrap;}
    table.meal-list td ul.no_padding li,
    table.meal-list td div.no_padding p {width:calc(100% / 2);}
    table.meal-list td li,
    table.meal-list td div.p {line-height: 25px;}

}
@media screen and (max-width:450px) { 

     /* common */
    a.btn_com_bule,
    form input[type="submit"]{margin:20px auto; display: block; width:75%; font-size:17px;  line-height: 45px;  height:45px;}


    h1.login_logo { padding-top: 100px; width: 100%; text-align: center; }
    h1.login_logo img { width:150px;}

    .layer_pop_txt .pop_head a img {width:100%;}
    .layer_pop_txt .pr_con {padding:0 20px 30px;}
    .layer_pop_txt .pr_con h3 { text-align: center; font-size:17px; line-height:40px;  border-bottom:2px solid #303646; }
    .layer_pop_txt .pr_con h4 { font-size:16px; font-weight: normal; margin:10px 0; line-height: 30px; color:#4b5265;}
    .layer_pop_txt .pr_con p {padding-right:15px; font-size:14px; margin:10px 0; text-align: justify; }
    .layer_pop_txt .pr_con p span {padding-left:10px; font-size:14px;}
    .layer_pop_txt .pr_con ul li {padding-left:10px; font-size:12px;}
    .layer_pop_txt .border_box_wrap {padding:0px 0px;}
    .layer_pop_txt .border_box h4 {text-align: center; line-height: 30px; margin: 0;}
    
    .gallery_view_wrap .gallery_view {padding:20px 20px; }

    /* 마이페이지 */
    .pd_box div.flex_bw {display:block; margin-bottom:10px;}
    .pd_box div.flex_bw p.con_title {font-size: 16px; text-align: left; font-weight:normal; line-height:36px;}
    ul.list_style_blue li { padding:15px 10px; background-color: #f8f9fb; border-bottom:1px solid #e4e4e4;}
    

    .pd_box form p span.flex_bw2 input.wbtn { width:calc(100% - 110px);} 
    .pd_box p input.btn_id_chack {  width:100px; font-size:14px;}
    .pd_box2 { position:relative; padding:20px 0px 20px; border-top:2px solid #303646;}
    .pd_box2 form p {margin:0;}
    .pd_box2 p a.right {text-decoration: underline; font-size:12px; }
    .pd_box2 p label {color:#303646; width: auto; display: inline-block; font-size:14px;  }

    .nav_header .tab_none p em.u_name {display: block; font-size:17px; margin-top:9px;}    
    .nav_header .tab_none p em.w_txt {display: none; }    
    .nav_header .tab_none div.login,
    .nav_header .tab_none div.logout {position: absolute; width:calc(100% - 115px); height:100%; top:0px; left:50px;}

    table.board-list td.subject { width:calc(100% - 50px);}

    table.tbl_blue { width:100%; margin-top:20px; border-top:2px solid #00bae2; }
    table.tbl_blue th { display:block;  padding:15px 10px; font-weight: normal; padding-left:10px; text-align: left; background:#f2f5fb; border-right:0; border-bottom:none;}
    table.tbl_blue td { display:block;  border-bottom:none;}
    /* table.tbl_blue td div.flex_bw3 input[type="text"] {flex-basis: 43%; max-width:40%;} */

    
    .page_wrap table.tbl_blue { width:100%; margin-top:0px;  }
    .page_wrap table.tbl_blue th { display:table-cell; font-size:14px; padding:10px 0px;  padding-left:10px; text-align: left; background:#f2f5fb; border-right:1px solid #d3d3d3; border-bottom:1px solid #d3d3d3;}
    .page_wrap table.tbl_blue th.center { text-align: center; padding-left:10px;}
    .page_wrap table.tbl_blue td { display:table-cell; font-size:14px; line-height:30px; padding:10px 10px; border-bottom:1px solid #d3d3d3;}
    

    /* 게시판 */
    div.board_view .top_title {position:relative; padding-bottom:10px;}
    div.board_view .top_title h4 {font-size:16px; font-weight: normal; color:#2b2f3e; line-height: 25px; padding-bottom:10px; }
    div.board_view .top_title p.date {font-size:13px; }
    div.board_view a.btn_list { width:72px; line-height:38px; height:38px; font-size:14px;  }

    div.board_view .board_cont {margin-bottom:20px;}
    div.board_view .board_text {padding:20px 0;}

    table.tbl_con { width:100%; margin-top:0px; border-top:1px solid #000;  }
    table.tbl_con thead {display:none;}
    table.tbl_con tr {display: block; padding:10px 0;  border-bottom:1px solid #d3d3d3;}
    table.tbl_con td { display:block; font-size:14px; color:#575757; line-height:20px; padding:0; text-align:left; border-bottom:none;}
    table.tbl_con td:first-of-type {font-weight: bold; margin-bottom:10px;}
    table.tbl_con { width:100%; margin-top:0px; border-top:1px solid #000;  }
    table.tbl_con th.left { padding:0; border-bottom:none; background-color: #fff; border:none; line-height:20px; padding-bottom:10px;}
    table.tbl_con td.left {font-weight: normal; padding:0; line-height:20px; margin-bottom:0;}
    

    /* 갤러리 */
    ul.gallery_list { display:block;  padding:0px 0 20px;}
    ul.gallery_list li {position:relative; width:100%; margin-top:20px; margin-right:20px;}
    ul.gallery_list li:nth-of-type(4n) {margin-right:20px;}
    ul.gallery_list li div.img {width:120px; height:120px; overflow: hidden; }
    ul.gallery_list li div.img img { width: 300px; height: 150px;  object-fit: cover;  }
    ul.gallery_list li div.tittxt { position:absolute; top:20px; left:140px; width:calc(100% - 150px);}
    ul.gallery_list li p.gal_title { margin-top:10px; font-size:15px; font-weight: bold; }
    ul.gallery_list li p.gal_txt {margin-top:10px; font-size:12px; width:90%; white-space: normal; height: 32px; text-align: left; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}

    
    /* 면회 시간 선택완료 */    
    .box_blue {height:120px; }
    .box_blue p.tit24 {font-size:18px; margin: 0;}
    .box_blue div.btn_right {position:inherit; width:195px; margin: 0 auto; top:15px; right:0; margin-top:0px;  }
    .box_blue div.btn_right a {font-size:13px;  width:90px; }
}
@media screen and (max-width:380px) {

    body { font-size: 14px;}

    /* common */
    a.btn_com_bule,
    form input[type="submit"]{margin:20px auto; display: block; width:85%; font-size:15px; color:#fff; background:#00bae2 linear-gradient(135deg, #00bae2 50%, #32cfe4); color:#fff; box-shadow: 0px 10px 20px 0px rgba(0,14,66,0.1);  border-radius: 100px; text-align: center; line-height: 35px;  height:35px;}
    input[type="text"], input[type="password"] { height: 30px; padding: .2em .2em; font-size:14px; }
    select {height:30px; font-size:14px; padding-left:.3em; padding-right:0px;  background:#fff url('../images/arr_select.png') no-repeat right center/25px auto;}
    .wrap { width:auto; min-width:auto; }
    .login_wrap { background:#f1f8ff url('../images/m_login_bg.png') no-repeat center center / cover; }
    div.border_top { border-top:none;}

    .m_block2 {display: block;}
    .gallery_view_wrap .layer_title {  height:55px; }
    .gallery_view_wrap .layer_title h3 { font-size:16px; line-height:55px; padding-left:20px; color:#fff; font-weight: normal; }
    .gallery_view_wrap .layer_title a.btn_close { position:absolute; display: inline-block; top:15px; right:20px; width:20px;}
    .gallery_view_wrap .layer_title a.btn_close img {width:100%;}
    
    .gallery_view_wrap .gallery_view h4 {font-size:16px;  line-height: 30px; font-weight: normal; border-bottom:1px solid #dadbdb; text-align: center;}
    


    /* 페이지 공동 */
    #m_header { position:relative; width:100%; height:55px; }
    #m_header h1.m_logo {text-align: center; padding-top:10px; width:100px; margin:0 auto;}
    #m_header h1.m_logo img {width:100%;}
    #m_header a.btn_back {position:absolute; top:15px; left:15px; width:15px;}    
    #m_header a.btn_allmenu {position:absolute; top:15px; right:15px; width:21px;}
    #m_header a img {width:100%;}

    .page_wrap {margin:10px 0; height:100%; }
    div.search_result p,
    div.page_default p {font-size:14px; line-height: 20px; margin:20px 0 10px;}

    /* nav */
    .mobile_nav_wrap {min-width:300px;}
    #mobile_nav div.nav ul.m_nav_1depth li div p {font-size: 16px; line-height:20px;}
    #mobile_nav div.nav ul.m_nav_1depth li div i {position:relative; display:inline-block; margin: 0; }          
    #mobile_nav div.nav ul.m_nav_1depth li.nav_menu1:hover div i.nav_ico,
    #mobile_nav div.nav ul.m_nav_1depth li.nav_menu1.on div i.nav_ico {background-position: -36px 0;}
    #mobile_nav div.nav ul.m_nav_1depth li.nav_menu2:hover div i.nav_ico,
    #mobile_nav div.nav ul.m_nav_1depth li.nav_menu2.on div i.nav_ico {background-position: -36px -36px;}
    #mobile_nav div.nav ul.m_nav_1depth li.nav_menu3:hover div i.nav_ico,
    #mobile_nav div.nav ul.m_nav_1depth li.nav_menu3.on div i.nav_ico {background-position: -36px -72px;}
    #mobile_nav div.nav ul.m_nav_1depth li.nav_menu4:hover div i.nav_ico,
    #mobile_nav div.nav ul.m_nav_1depth li.nav_menu4.on div i.nav_ico {background-position: -36px -108px;}

    #mobile_nav div.nav ul.m_nav_1depth li:hover,
    #mobile_nav div.nav ul.m_nav_1depth li.on { background:#4b5265;}
    #mobile_nav div.nav ul.m_nav_1depth li:hover div::after,
    #mobile_nav div.nav ul.m_nav_1depth li.on div::after {position:absolute; display: inline-block; content: ""; width:14px; height:31px; top:35%; left:100%; background:url('../images/nav_1depth_on_arr.png') no-repeat 0 0;}
    #mobile_nav div.nav ul.m_nav_1depth li:hover div p,
    #mobile_nav div.nav ul.m_nav_1depth li.on div p  {color:#fff;}
    #mobile_nav div.nav ul.m_nav_1depth ul {display: none;}

    #mobile_nav div.nav div.menu_cont {display: none; position:absolute; top:0; right:0px; width:47%; padding:0; background:#fff;}    
    #mobile_nav div.nav div.menu_cont.on {display: block;}
    #mobile_nav div.nav div.menu_cont dl dt { display: block; padding-top:20px; font-size: 16px; font-weight: bold; line-height: 50px; border-bottom:2px solid #4b5265;}
    #mobile_nav div.nav div.menu_cont dl dt i.arr_ico {display: inline-block; vertical-align: top; margin-left:10px; margin-top:15px; width:20px; height:20px; background-size:20px;}
    #mobile_nav div.nav div.menu_cont dl dd { font-size:13px;}
    #mobile_nav div.nav div.menu_cont dl dd a:hover {text-decoration:none; color:#575757;}
    
    .nav_header {position:absolute; width:100%; min-width:300px; height:60px; top:-60px;}
    .nav_header .tab_none { position:absolute; display:block; width:100%; background: #00bae2; height:60px; padding:7px 20px; box-sizing: border-box;}
    .nav_header .tab_none i.u_icon {display:none;}
    .nav_header .tab_none p {margin-left:0px; display: inline-block; color:#fff; font-size:14px; }
    .nav_header .tab_none p em.u_name {display: block; font-size:17px; }
    
    .nav_header .tab_none div.login,
    .nav_header .tab_none div.logout { width:calc(100% - 80px);  left:20px;}
    .nav_header a.btn_nav_close { position: absolute; right:0; width:60px; height:60px; display: inline-block; text-indent: -9999px;}
    .nav_header a.btn_nav_close {background:#00bae2 url('../images/btn_nav_close.png') no-repeat center center/30px;}

    /* 메인 */
    #main { height:calc(100vh - 145px); width:100%;}
    #main .main_content {width:calc(100% - 40px); margin:0 auto;  margin-top:15px;}
    .login_user {position:relative;  width:100%; }
    .login_user p {font-size:14px; color:#fff;}
    .login_user p span.user_name {font-size:19px; color:#00bae2;}
    .login_user .btn_right a {display: block; border-radius: 5px; width:70px; height:25px; line-height: 25px; font-size: 13px; }
    .login_user .btn_right a.btn_yellow {margin-left: 0px; margin-top: 6px;}



    .flex_menu {margin-top:30px; width:100%; display:flex; flex-wrap: wrap; justify-content:space-between; }
    .flex_menu li {width:calc(97% / 2);}
    .flex_menu li a { display:block; width:100%; height:100px; border-radius:9px;  }
    .flex_menu li a:first-of-type,
    .flex_menu li a:nth-of-type(3) {margin-right: 15px; margin-bottom:15px;}
    .flex_menu li a div { padding-top:15px; }
    .flex_menu li a div i { display:block; width:50px; margin:0 auto; height:50px; }
    .flex_menu li a div i.main_ico {background: url('../images/main_menu_icon.png') no-repeat 0 0; background-size: 100px auto;}
    .flex_menu li a div p { margin-top:5px; font-size:14px;  }
    .flex_menu li a.main_menu1 div i.main_ico  {background-position:-50px  0;}
    .flex_menu li a.main_menu2 div i.main_ico {background-position:-50px  -50px;}
    .flex_menu li a.main_menu3 div i.main_ico {background-position:-50px  -100px;}
    .flex_menu li a.main_menu4 div i.main_ico {background-position:-50px  -150px;}
    .flex_menu li a.main_menu1:hover i.main_ico {background-position:0 0;}
    .flex_menu li a.main_menu2:hover i.main_ico {background-position:0 -50px;}
    .flex_menu li a.main_menu3:hover i.main_ico {background-position:0 -100px;}
    .flex_menu li a.main_menu4:hover i.main_ico {background-position:0 -150px;}
    
    /* 퀵메뉴 */
    .quick_menu {box-shadow: 0 -5px 5px 10px #f9f9f9; height:80px;}
    .quick_menu ul { height:50px; margin: 10px auto; }   
    .quick_menu li {font-size:12px; height:80px; }
    .quick_menu li div i { width:40px; height:40px;}
    .quick_menu li div i.ico { background:url('../images/quick_menu_icon.png') no-repeat 0 0/80px auto ;}
    .quick_menu li div.quick1 i.ico {background-position: 0 0;}
    .quick_menu li div.quick2 i.ico {background-position: 0 -40px;}
    .quick_menu li div.quick3 i.ico {background-position: 0 -80px;}
    .quick_menu li div.quick4 i.ico {background-position: 0 -120px;}
    .quick_menu li.on div.quick1 i.ico {background-position: -40px 0;}
    .quick_menu li.on div.quick2 i.ico {background-position: -40px -40px;}
    .quick_menu li.on div.quick3 i.ico {background-position: -40px -80px;}
    .quick_menu li.on div.quick4 i.ico {background-position: -40px -120px;} 

    
    .m_contents.bot_menu {padding-bottom:100px;}
    .m_contents h3 { padding:10px 0 0; text-align: center; font-size:16px; line-height:30px; height:30px; font-weight: bold; color:#4b5265; border-bottom:2px solid #303646; }

    .pd_box { padding:5px 0px; border-bottom:none; margin-bottom:10px;}
    .pd_box p { margin:0;}   
    .pd_box form p {margin:6px 0;}  
    .pd_box form p select,
    .pd_box form p input[type="text"],
    .pd_box form p input[type="password"],
    .pd_box form p select.w100 { height:30px; width:100%;}
    .pd_box p label {display: block; font-size:14px; line-height: 36px; margin-bottom:0; }
    .pd_box p { display: block;}
    .pd_box form p span.flex_bw input.wbtn { width:calc(100% - 60px);}
    .pd_box p a.btn_search { width:50px; height:30px; background-size:16px; }    
    .pd_box p input.btn_id_chack {  height:30px; }

    .pd_box div.pdleft {font-size:13px; line-height: 16px;}
    .pd_box p a.btn_under {display:block; line-height: 23px; text-decoration: none; color:#303646; text-align: center; font-size:12px;}
    .pd_box .flex_ic_tx .icon { position:relative; top:30px; left:0; text-align: center; width:100%; }
    .pd_box .flex_ic_tx .icon img {width:55px;}
    .pd_box .flex_ic_tx .txt p.step2_phone { font-size:30px; color:#303646; font-weight: bold; padding-left:0px; padding-top:50px; }
    .pd_box .flex_ic_tx .txt p.step2_txt { font-size:16px; color: #303646; margin-bottom:40px; padding-left:0px; padding-top:10px}
    .pd_box div.pdleft {padding-left:0px;}

    div.pd_box2 { position:relative; padding:15px 0 15px;  border-top:2px solid #303646; border-bottom:0;}
    div.pd_box2 form p {margin:0;}
    div.pd_box2 p a.right { font-size: 12px; line-height: 26px; }
    div.pd_box2 p label {display: inline-block; font-size:13px;  line-height: 26px; }
    

    /* 면회일정 */
    div.calendar { width:100%;}
    div.calendar div.date { position:relative; width:250px; margin:0 auto; font-size:14px; font-weight:bold;  line-height:30px; text-align:center; }
    div.calendar div.date a.left { left:25px; line-height:0; width:25px;}
    div.calendar div.date a.right { right:25px; line-height:0; width:25px;}
    div.calendar div.date a img {width:100%;}
    div.info_right {position:relative; width:100%; height:40px;}
    div.info_right p.info {position:absolute; width:auto; top:0px; right:0px; }
    div.info_right p.info span { margin-left:30px; font-size:12px;}
    div.info_right p.info span i {margin-right:9px; display:inline-block; content: ""; width:15px; height:15px; border:1px solid #d7d7d7; background: #fff; box-sizing: border-box; vertical-align: bottom;}
    div.info_right p.info span i.not_icon {background:#efefef;}
    /* 면회 시간 선택완료 */
    .box_blue div.btn_right {margin-top:20px; }
    a.btn_cel_del,input.btn_cel_del { height:30px; line-height: 30px;font-size:12px; padding:0 10px; margin-top:2px;}
    /* 비대면 전자서명 */
    ul.list_style li a {font-size:14px; line-height: 35px; font-weight: bold;  padding:0px 20px; height:40px; }
    ul.list_style li a i.chackmark {position:relative; margin-right:10px; top:6px; display:inline-block; content:""; width:20px; height:20px; background: url('../images/chack_sprite.png') no-repeat 0 0/cover;}
    ul.list_style li.on a i.chackmark {background-position: 0 -20px;}
    /* 파일다운로드 리스트 */
    /* ul.list_style2 li a { line-height: 20px; } */
    ul.list_style2 li i {position: absolute; right: 10px; top:5px;}

    .page_default .icon {width:45px; margin:0 auto;}
    .page_default .icon img {width:100%;}
    
    .login_form { margin-top: 100px; width:250px; margin:0 auto; margin-top: 20px;text-align: center; padding-bottom:15px; }
    .login_form form { margin-bottom:10px;}
    .login_form input { width:90%; margin-top:11px;  height:35px; }
    .login_form input[type="checkbox"] { width:20px; height:20px; border:1px solid #d6d6d6; margin-left:0px; margin-top:0px;}
    .login_form label { display:inline-block; color:#2d2a31; font-size:14px; margin-top:17px;}
    .login_form p.login_option {padding:0 20px; display: flex; justify-content: space-between;}
    .login_form form input[type="submit"] { width:90%; margin-top:20px;}
    .btn_center { margin-top:0px; font-size:14px; text-align: center;}
    .btn_center a {position:relative; color:#2d2a31; margin-right:13px;}
    .btn_center a::after {position:absolute; top:3px; margin-left:9px; display:inline-block; width:1px; height:15px; background:#ddd; content: "";}
    .btn_center a:last-of-type {margin-right:0;}
    .btn_center a:last-of-type::after {display: none; }
    .btn_center.m_pd { width:255px; margin:0 auto;  margin-top:15px; display: flex; justify-content: space-around;}
    .btn_center.m_pd a {position:relative; color:#2d2a31; text-align: center;}
    .btn_center.m_pd a::after {display:inline-block; left:80px; width:1px; height:15px;background:#ddd;content: "";}
    .btn_center.m_pd a:last-of-type {margin-right:0; margin-left: 0px;}
    .btn_center.m_pd a:last-of-type::after {display: none; }

    /* table type */
    table.calendar { width:100%; border-top:1px solid #000;}
    table.calendar th { font-size:14px; color:#2b2f3e; font-weight: bold; line-height:50px; text-align:center; background-color:#f5f5f5;  border-right:1px solid #e4e4e4;  border-bottom:1px solid #e4e4e4;}
    table.calendar td { font-size:14px;  line-height:30px; padding:9px 0; text-align:center;  border-right:1px solid #e4e4e4;  border-bottom:1px solid #e4e4e4; }
    table.calendar td.bg {background:#efefef; color:#bbb;}
    table.calendar td.pick_cel {position: relative; background:#e4f5fe;}
    table.calendar td.pick_cel:after {position: absolute;content: "";display: block;top: -2px;left: -2px; width:100%;height:100%;border:2px solid #00bae2;}
    table.calendar td.pick_cel span.pick {margin:25% auto;  }
    table.calendar th:last-of-type,
    table.calendar td:last-of-type {border-right:none;}

    /* 게시판 */
    .search {display: flex; padding-top:10px;}
    .search input[type="text"] { height:30px; font-size:14px;}
    .search a.btn_search {margin-left:10px; width:40px; height:30px; background-size:15px;}
    .search a.btn_search img { width:100%;}

    /* table design */
    ul.bohun-hos-list {margin-top:20px; border-top:2px solid #00bae2;}
    ul.bohun-hos-list > li {padding:10px 0; font-size:14px; line-height: 30px; border-bottom:1px solid #e4e4e4; color:#575757;}
    ul.bohun-hos-list li.m_hidden {font-size:14px; font-weight:bold; color:#2b2f3e; line-height:19px; padding:5px 0; background-color:#f8f9fb;}
    ul.bohun-hos-list li ul.flex_bw {display:flex; justify-content: space-between; }
    ul.bohun-hos-list li ul.flex_bw li {width:calc(100% / 4); text-align: center;}
    ul.bohun-hos-list li ul.flex_bw li a { display:inline-block; color:#575757; font-size: 12px; width:52px; line-height:28px; border:1px solid #d9d9d9; text-align: center;}
    ul.bohun-hos-list li ul.flex_bw li a.on { color:#00bae2; border:1px solid #22c3e6;}
    ul.bohun-hos-list li ul.flex_bw li::after { top:10px; left:0; height:13px; }

    table.board-list { width:100%; margin-top:15px; border-top:2px solid #00bae2; }
    table.board-list td { font-size:13px; color:#575757; line-height:17px; padding:8px 10px; }
    table.board-list td.subject {  padding-left:10px; }
    table.board-list td.subject img {margin-top: 6px;  }
    table.board-list td.subject a { top:10px; font-size:15px;  }
    table.board-list td.m_line {padding-left: 15px; top:0; }
    table.board-list td.m_line::after {left:3px;height:11px;  }

    /* 일일식단표 */
    table.meal-list { margin-top:5px;}
    table.meal-list th {font-size:14px;  line-height:20px; padding:10px 0; }
    table.meal-list td {font-size:13px; line-height:16px; padding:10px 20px 10px 20px; }
    table.meal-list td ul,
    table.meal-list td div { padding:0;}
    table.meal-list td ul.no_padding,
    table.meal-list td div.no_padding {padding:0;}

    table.tbl_blue { width:100%; margin-top:10px; border-top:2px solid #00bae2; }
    table.tbl_blue th { font-size:14px; padding:10px 10px; font-weight: normal; padding-left:10px; text-align: left; background:#f2f5fb; border-right:0; border-bottom:none;}
    table.tbl_blue td { font-size:14px; border-bottom:none;}
    
    .page_wrap table.tbl_blue { width:100%; margin-top:0px; border-top:2px solid #00bae2; }
    .page_wrap table.tbl_blue th { display:table-cell; font-size:14px; padding:10px 0px;  padding-left:10px; text-align: left; background:#f2f5fb; border-right:1px solid #d3d3d3; border-bottom:1px solid #d3d3d3;}
    .page_wrap table.tbl_blue th.center { text-align: center; padding-left:0;}
    .page_wrap table.tbl_blue td { display:table-cell; font-size:14px; line-height:30px; padding:10px 10px; border-bottom:1px solid #d3d3d3;}
    .page_wrap table.tbl_blue td input.w100 { width:90px; text-align: center; padding:0; margin-left:0px;}

}
@media screen and (max-width:280px) {

    .wrap { width:auto; min-width:260px; }

    /* 퀵메뉴 */  
    .quick_menu { height:60px;}
    .quick_menu p {display: none; }

    /* 게시판 */
    .search select {width:60px; margin-right:10px; }


}

/* 2023.05.24 일상생활사진 댓글 기능 추가 :: s */
.comment-wrapper {
  font-family: inherit;
  font-size: 12px;
  color: #373737;
  line-height: 1;
}
.comment-wrapper form {
  margin: 0;
  padding: 0;
}
.comment-wrapper .write-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: stretch;
      -ms-flex-pack: stretch;
          justify-content: stretch;
  height: 80px;
  margin-bottom: 12px;
}
.comment-wrapper .write-wrap .wrtie-comment-box {
  font-family: inherit;
  font-size: 12px;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  border-radius: none;
  background-color: #F9F9F9;
  border: 1px solid #EDEEF3;
  border-right: none;
  resize: none;
  outline: none;
  padding: 12px;
}
.comment-wrapper .write-wrap .btn-write-submit {
  font-family: inherit;
  width: 80px;
  background-color: #00BAE2;
  color: #fff;
  font-weight: 700;
  border: 1px solid #008AC5;
  font-size: 12px;
}
.comment-wrapper .view-wrap .view-header {
  border-top: 1px solid #EDEEF3;
  border-bottom: 1px solid #EDEEF3;
  background-color: #F9F9F9;
  font-size: 13px;
  font-weight: 700;
  padding: 8px 12px;
}
.comment-wrapper .view-wrap .view-header > span {
  font-weight: 400;
}
.comment-wrapper .view-wrap .view-comment-box {
  border-bottom: 1px solid #EDEEF3;
  padding: 8px 12px;
}
.comment-wrapper .view-wrap .view-comment-box .info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  font-size: 12px;
  margin-bottom: 8px;
}
.comment-wrapper .view-wrap .view-comment-box .info p {
  margin: 0;
}
.comment-wrapper .view-wrap .view-comment-box .info .name {
  font-weight: 700;
}
.comment-wrapper .view-wrap .view-comment-box .comment {
  margin: 0;
  line-height: 1.3;
  font-weight: 13px;
}
.comment-wrapper .view-wrap .view-comment-box .toolbar {
  margin-top: 8px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-column-gap: 4px;
     -moz-column-gap: 4px;
          column-gap: 4px;
}
.comment-wrapper .view-wrap .view-comment-box .toolbar button {
  font-size: 11px;
  font-weight: 700;
  padding: 6px 10px;
  border: 1px solid #B7B7B7;
  background-color: #EEEEEE;
}
.comment-wrapper .view-wrap .view-comment-box .toolbar button.btn-confirm {
  background-color: #00BAE2;
  color: #fff;
  border: 1px solid #008AC5;
}
.comment-wrapper .view-wrap .view-comment-box .write-wrap {
  margin-top: 8px;
}
/* 2023.05.24 일상생활사진 댓글 기능 추가 :: e */

/* 2024.05.23 일상생활사진 등록 기능 추가 :: s */
.search-result-wrap {
  background-color: #f2f5fb;
  line-height: 1;
  max-height: 160px;
  overflow-y: auto;
}
.search-result-wrap .result-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 12px;
  border-bottom: 1px solid #dddddd;
  -webkit-column-gap: 6px;
     -moz-column-gap: 6px;
          column-gap: 6px;
}
.search-result-wrap .result-item:last-child {
  border-bottom: none;
}
.search-result-wrap .result-item input[type=checkbox] {
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  margin: 0;
}
.search-result-wrap .result-item .name {
  font-size: 16px;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.search-result-wrap .result-item .room {
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
}

.upload-file-wrap {
  overflow: hidden;
}
.upload-file-wrap form {
  overflow: hidden;
}
.upload-file-wrap .file-input {
  position: relative;
  margin-bottom: 6px;
}
.upload-file-wrap .file-input input[type=file] {
  display: none;
  visibility: hidden;
  position: absolute;
  top: 0;
  left: 0;
}
.upload-file-wrap .file-input .label {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 30px;
  padding: 0 12px;
  border-radius: 4px;
  background-color: #00bae2;
  color: #fff;
}
.upload-file-wrap .file-list {
  margin-top: 6px;
  background-color: #f2f5fb;
  line-height: 1;
  max-height: 160px;
  overflow-y: auto;
}
.upload-file-wrap .file-list .file {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 12px;
  border-bottom: 1px solid #dddddd;
  -webkit-column-gap: 6px;
     -moz-column-gap: 6px;
          column-gap: 6px;
}
.upload-file-wrap .file-list .file .name {
  font-size: 16px;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.upload-file-wrap .file-list .file .btn-del {
  margin-left: 4px;
  background-color: #f55077;
  color: #fff;
  outline: none;
  border: none;
  height: 32px;
  cursor: pointer;
}

.search-select {
    margin: 10px 0;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 5px;
    background-color: #f9f9f9;
    display: flex;
    align-items: center;
    max-width: auto;
    margin: 10px auto;
    overflow-x: auto;
    white-space: nowrap;
}
.search-select span {
    display: flex;
    align-items: center;
    font-size: 16px;
    color: #333;
    padding: 5px 10px;
    border: 1px solid #ccc;
    border-radius: 5px;
    background-color: #fff;
    margin-right: 5px;            
}
.search-select img {
    margin-left: 5px;
    width: 12px;
    cursor: pointer;
}

.spinner-wrap {
	position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,.6);
    z-index: 100;
	display: flex;
    justify-content: center;
    align-items: center;    
}

.spinner {
    text-align: center;
}

.spinner>p {
    font-size: 13px;
    color: #ffffff;
}

.spinner>div {
    width: 18px;
    height: 18px;
    background-color: #fff;
    border-radius: 100%;
    display: inline-block;
    -webkit-animation: bouncedelay 1s infinite ease-in-out both;
    animation: bouncedelay 1s infinite ease-in-out both;
}

.spinner .bounce1 {
    -webkit-animation-delay: -0.28s;
    animation-delay: -0.28s;
}

.spinner .bounce2 {
    -webkit-animation-delay: -0.14s;
    animation-delay: -0.14s;
}

@-webkit-keyframes bouncedelay {
    0%,
    80%,
    100% {
        -webkit-transform: scale(0)
    }
    40% {
        -webkit-transform: scale(1.0)
    }
}

@keyframes bouncedelay {
    0%,
    80%,
    100% {
        -webkit-transform: scale(0);
        transform: scale(0);
    }
    40% {
        -webkit-transform: scale(1.0);
        transform: scale(1.0);
    }
}
/* 2024.05.23 일상생활사진 등록 기능 추가 :: e */