@charset "utf-8";

/*sub*/
#contents { padding: 3.75rem 0 10rem; background: #fff; min-height: 50vh; }
#contents .inner{margin-top: 3.75rem;}
a {color: #333;}

ul.ul_disc > li { position: relative; padding: 0 1rem; }
ul.ul_disc > li::before { content:""; position: absolute; top: .625rem; left: 0; width: 4px; height: 4px; background: #5b5d64; border-radius: 10px; }
ul.white > li::before { background: #fff; }

ul.ul_disc2 > li { position: relative; padding: 0 1rem; }
ul.ul_disc2 > li::before { content:""; position: absolute; top: .625rem; left: 0; width: 4px; height: 4px; background: #2c83d4; border-radius: 10px; }
ul.white > li::before { background: #fff; }

.div_tab{display:flex;flex-wrap: wrap;justify-content: center;gap: 1.25rem;}
.div_tab a {display: flex;justify-content: center;align-items: center;min-width: 10rem;height: 3.125rem;padding: 0rem 1.875rem;font-size: 1.125rem;color: #8e8e8e; background: #f7f7f7;border-radius: 5rem;}
.div_tab a.on{color: #fff;background: #000;font-weight: 600;}
.div_tab.schedule a{ flex:1; padding:0; }


/* 예비 양부모 신청 / 마이페이지 사각 탭 */
.div_tab.fouth_depth{justify-content: start; gap:0; border-bottom:1px #ddd solid;}
.div_tab.fouth_depth a {font-size: 1rem;color: #8e8e8e; background: #fff;border-radius: 0rem;border:1px #ddd solid; border-bottom:0;}
.div_tab.fouth_depth a + a {border-left:0px #ddd solid;}
.div_tab.fouth_depth a.on { color: #fff; background: #000; font-weight: 600; border: 1px #000 solid;}


.resident_number .select_ds{width:calc((100% - 1rem - 1.25rem)/2); min-width: auto !important;}
.tel_wrap .select_ds{width:calc((100% - 2.5rem - 1.125rem)/3); min-width: auto !important;}
.email_wrap .select_ds{width:calc((100% - 1.875rem - 1rem)/3); min-width: auto !important;}

.img_box.profile_box img{max-width:100%; max-height:31.25rem; width:auto; height:auto;}


/* sub_visual */
#sub_visual { margin: 0 auto; margin-top: calc(7.5rem + 1.875rem); width: calc(100% - 3.75rem); position: relative; background: #fff; border-radius:1.875rem; overflow:hidden;}
#sub_visual .sub_title {height: 20rem; width: 100%; background-image: url('../images/sub_visual.png');background-position: bottom right;}
#sub_visual .sub_title .inner { height: 100%; color: #000; width: 100%; padding-left: 12.5rem; }
#sub_visual .sub_title h2 {font-weight: 500; font-size: 3.125rem; line-height: 1; }
#sub_visual .sub_title h2 br {display:none;}

#sub_visual .lnb_dep2 { position: absolute; bottom: 0; width:100%; height: 3.75rem; }
#sub_visual .lnb_dep2:after{content: ""; position: absolute; left: calc((1920px - 100%) / -2); top: 1px; width: 1920px; height: 1px; background: #fff; opacity: .3;}
#sub_visual .lnb_dep2 li { display: flex; justify-content: center; align-items: center;  flex: 1;  height: 100%;}
#sub_visual .lnb_dep2 li a{color:#fff;}
#sub_visual .lnb_dep2 li.on{border-top:2px #fff solid;}
#sub_visual .lnb_dep2 li.on a{font-weight:500;}

#sub_visual .sub_title .article{ color:#1664ab; font-weight: 300; line-height: 1; opacity:.7;}


/* 각메뉴별 이미지 */
.menu01 #sub_visual .sub_title {background-image: url('../images/sub_visual_01.png'); background-position: bottom right;}
.menu02 #sub_visual .sub_title {background-image: url('../images/sub_visual_02.png'); background-position: bottom right;}
.menu03 #sub_visual .sub_title {background-image: url('../images/sub_visual_03.png'); background-position: bottom right;}
.menu04 #sub_visual .sub_title {background-image: url('../images/sub_visual_04.png'); background-position: bottom right;}
.menu05 #sub_visual .sub_title {background-image: url('../images/sub_visual_05.png'); background-position: bottom right;}
.menu06 #sub_visual .sub_title {background-image: url('../images/sub_visual_06.png'); background-position: bottom right;}




.location {height: 5rem;}
.location .home { width: 2.5rem; height: 2.5rem; background:#0BBEF6; border-radius:50%;}
.location .home img { width: 1rem; object-fit: cover; }
.location div { position: relative; width: 18.75rem; height: 100%;}
.location div > a { padding: 0 1.875rem; width: 100%; height: 100%; box-sizing: border-box;}
.location div > a p{width:calc(100% - 1.875rem);}
.location div > a br{display:none;}
.location .bt {position: relative;background: #fff; width: 1.875rem;height: 1.875rem;transition: all 0.2s ease-in-out;}
.location .bt::after {content: "";position: absolute;left: 50%;top: 25%;transform: translateX(-50%) rotate(135deg);width: .625rem;height: .625rem;border-top: 2px solid #999;border-right: 2px solid #999;}
.location .bt.active{transform:rotate(180deg);}
.location .dep2::after,
.location .dep3::after{content: "";position: absolute;left: 0;top: 50%;transform: translateY(-50%);width: 1px;height: 20px;background: #ccc;}
.location .dep3.hidden,
.location3.hidden { display: none !important; }
.location .location_sub {position: absolute;top: 60px;left: 0;width: 100%;background: #fff;border: 1px solid #e6e6e6;border-radius: 12px;display: none;z-index:1;overflow: hidden;padding: .625rem 1.25rem;}
.location .location_sub li a {width:100%;padding: .625rem 1.25rem;display:flex;align-items:center;color: #000;opacity: .5;word-break:keep-all;}
.location .location_sub li a:hover { opacity: 1;  background-color:#f0f7ff; border-radius:50px;color: #0066ef; font-weight:500;}
.fixed .location { position: fixed; top: calc(7.5rem - 1px); z-index: 9; background: #fff; border-top: 1px #f0f0f0 solid; border-bottom: 1px #f0f0f0 solid; width: 100%; padding-left: 3.125rem; height: 3.75rem;}
.fixed .location .location_sub { border-radius: 0 0 .625rem .625rem; top: calc(3.75rem - 2px); border: 1px solid #f0f0f0; box-shadow: rgb(0 0 0 / 10%) 0 2px 3px 0;}
.location .dep2 .location_sub .depth3{display:none;}

/*서비스 안내 내 그래프 이미지*/
.cc.as .img_box{max-width:760px; width: 100%; padding-top:1rem;}


/* search_box */
.search_box fieldset { gap: 0.625rem; }
.search_box select, 
.search_box input[type=number],
.search_box input[type=email],
.search_box input[type=text],
.search_box input[type=password],
.search_box button { height: 2.3rem; border-radius: 5px; }
.search_box select { width: 8.125rem; }
.search_box input[type=number],
.search_box input[type=email],
.search_box input[type=text],
.search_box input[type=password] { width: 18.75rem; }
.search_box button { width: 5rem; background: url('../images/s_search_icon.png') no-repeat 25% 50%; color:#fff; font-weight: 500; background-color:#2d2d2d; background-size: 0.8125rem; font-size: 0.9375rem; padding-left: 1rem; }

/* 서비스 검색창 */
.adoption_info .search_box select,
.additional_service .search_box select,
.adoptive_parents .search_box select,
.mypage .search_box select{ width: 10rem; }


/* step_box */
.step_box ul{position: relative; z-index: 0;}
.step_box li{position: relative; z-index: 0; display: flex; flex-direction: column; align-items: center; gap: .75rem; width:6.25rem; text-align:center; font-size:.875rem; color:#8e8e8e; line-height: 1.3;}
.step_box li i{position: relative; width:1.25rem; height:1.25rem; background:#fff; border:1px #ccc solid; border-radius:50%;}

.step_box li.ing{ color:#000;}
.step_box li.ing i,
.step_box li.on i{background:#0BBEF6; border:1px #0BBEF6 solid;}
.step_box li.on i:after{ content:""; position: absolute; left: 50%; top: 25%; transform: translateX(-50%) rotate(135deg); width: .625rem; height: .375rem; border-top: 2px solid #fff; border-right: 2px solid #fff;}

.step_box li.return i{background:#DB0000; border:1px #DB0000 solid;}
.step_box li.return p{color:#DB0000; font-weight:500;}
.step_box li.modify i{background:#ffb900; border:1px #ffb900 solid;}
.step_box li.modify p{color:#a26300; font-weight:500;}

.step_box li.line { width: 1px; flex: 1; position: relative; z-index: 0; }
.step_box li.line:after { content: ''; display: block; position: absolute; top: calc(.625rem - 1px); left: 50%; width: calc(100% + 6.25rem - 1.25rem); height: 2px; background: #ccc; z-index: -2; transform: translate(-50%, 0); }
.step_box li.on + li.line:after{background:#0BBEF6;}

.step_box .end li.ing i,
.step_box .end li.on i{background:#999; border:1px #999 solid;}
.step_box .end li.on + li.line:after { background: #999; }


/* hover_box */
table .hover_box{position: relative;width: fit-content;margin: 0 auto;}
table .hover_box i {width: 1.5rem;height: 1.5rem;background: #999;border-radius: 50%;position: absolute;left: -1.875rem;top: 0rem;}
table .hover_box i img{width:.875rem; height:.875rem; filter: brightness(0) invert(1);}
table .hover_box .hover_txt {opacity:0; position: absolute; left: 50%; transform: translate(-50%, 0px); width: max-content; background: rgb(0 0 0 / 40%); padding: .5rem 1.25rem; border-radius: 5rem; transition: all 0.2s ease-in-out; z-index:1}
table .hover_box:hover .hover_txt{opacity:1;}




/* 통합검색 */
.total_search .search_box{ background: #f5f5f5; padding: 1.875rem 0; border-radius: 1.875rem; }
.total_search .search_box select{width:12.5rem; border-radius:5rem;}
.total_search .search_box input{width:31.25rem; border-radius:5rem;}
.total_search .search_box button{width:2.8125rem; height:2.8125rem; border-radius:50%; background:#000; padding: 0;}
.total_search .search_box button img{width:1.5rem; height:1.5rem; filter: brightness(0) invert(1);}

.total_search .search_list { border-top: 2px #000 solid; }
.total_search .search_list li { border-bottom: 1px #ccc solid; padding: 1.875rem 0; }

.total_search .more_add_btn{display: flex; justify-content: center; align-items: center; gap:1.25rem; margin-top:2.5rem;}
.total_search .more_add_btn i{position: relative; display:block; width:1.875rem; height:1.875rem; border-radius:50%; background:#000;}
.total_search .more_add_btn i:before{display: block; content: ""; width: .875rem; height: 2px; background:#fff; position: absolute; top: 50%; left:50%; transform: translate(-50%, -50%);}
.total_search .more_add_btn i:after{ display: block; content: ""; width: 2px; height: .875rem; background:#fff; position: absolute; top: 50%; left:50%; transform: translate(-50%, -50%);}


/* Q&A */
.qna .tag {max-width: 8.125rem; width: 100%; border:#ccc 1px solid; color: #999; padding: .625rem 1rem; border-radius: 5rem;}
.qna .view_title h4 { width: calc(100% - 8.75rem); text-align:left;}


/* 오시는 길 */
.map_info .left { width: 43.75rem; border-radius:.625rem 6.25rem; border: 1px #e0e0e0 solid; overflow: hidden;z-index: 0;}
.map_info .left .root_daum_roughmap .cont,
.map_info .left .map_border{display:none;}
.map_info .right { width: calc(100% - 43.75rem - 6.25rem); }
.map_info .right > p{ display:block; position: relative;}
.map_info .right > p:after{content: "";position: absolute; bottom:0rem; left: 0; width: 6.25rem; height: 3px; background: #0168b7;}
.map_info .right ul li{ display: flex; color:#777;}
.map_info .right ul li b {display:inline-block; width:6.25rem; color:#000;}
.map_info .right ul li span{display:block; width:calc(100% - 6.25rem);}
.map_info .right ul li + li {margin-top:1.25rem;}

.bus_table > div{ display: flex; flex-direction: column; gap:.625rem}
.bus_table p,
.bus_table ul { display: flex; justify-content: center; align-items: center; background: #fff; border-radius: .625rem; font-size: 1.125rem;}
.bus_table ul { align-items: start; justify-content: start; flex-direction: column; font-size: 1rem; font-weight:300;}
.bus_table .top { color: #fff; background: #333; font-weight: 600; height: 5rem;}
.bus_table .bottom { height: calc(100% - 5rem); padding: 1.875rem;}
.bus_table .center,
.bus_table .right{width: calc((100% - 1.25rem)/2)}
.bus_table .center p.top{background: #0066EF; text-align: center;}
.bus_table .center .bottom{background: #EFF5FD;}
.bus_table .right p.top{background: #69BF00; text-align: center;}
.bus_table .right .bottom{background: #edf7f2;}


/* 방문예약 */
.reservation .join_accordion { border: 1px solid #EFF5FD;}
.reservation .join_accordion dt{background:#EFF5FD;}
.reservation .join_accordion .scrollbox{height: auto; background:#EFF5FD; border: 0; padding-top: .625rem;}

.reservation .calendar {display:block; width:43.75rem; height:31.25rem; border-bottom: 1px #ccc solid;}
.reservation .calendar .top{gap:3.75rem;}
.reservation .calendar .top a{ position: relative; display: flex; justify-content: center; align-items: center; width: 1rem; height: 1rem;}
.reservation .calendar .top a.prev{transform: rotate(230deg);}
.reservation .calendar .top a.next{transform: rotate(45deg);}
.reservation .calendar .top a:after{display: block; content: "";width: 100%;height: 100%;border-top:3px #000 solid;border-right:3px #000 solid;}
.reservation .calendar .list { width: 100%; border-top: 2px #000 solid;}
.reservation .calendar .list ul { display: flex; justify-content: space-between; align-items: center;  padding: 0rem 1.25rem;}
.reservation .calendar .list ul li {position: relative; z-index: 0;}
.reservation .calendar .list ul.th{background:#f5f5f5; padding: 1rem 1.25rem;}
.reservation .calendar .list ul.th li,
.reservation .calendar .list ul li p {display: flex; justify-content: center; align-items: center; width: 2.8125rem;}
.reservation .calendar .list ul.num + ul.num{margin-top:.875rem;}
.reservation .calendar .list ul.num li p { width: 2.8125rem; height:2.8125rem;  border-radius:.625rem; cursor: pointer; transition: all 0.2s ease-in-out;}
.reservation .calendar .list ul.num li.today p{background:#0066ef !important; color:#fff; border-radius:.625rem;}
.reservation .calendar .list ul.num li.on{ background:#EFF5FD;}
.reservation .calendar .list ul.num li.on.start{ border-radius:.625rem 0 0 .625rem;}
.reservation .calendar .list ul.num li.on.end{ border-radius:0 .625rem .625rem 0;}
.reservation .calendar .list ul.num li.on:after { display: block; content: ""; width: calc(100% + .875rem); height: 100%; background: #EFF5FD; position: absolute; top: 0; left: 100%; z-index: -1; cursor: auto; }
.reservation .calendar .list ul.num li.on.end:after{ display: none;}
.reservation .calendar .list ul.num li.selected p { border: 1px #0066ef solid; color: #0066ef; }

.reservation .date_list{display:block; width:calc(100% - 43.75rem - 3.75rem); height:31.25rem;}
.reservation .date_list .top{height: 2.8125rem;}
.reservation .schedule_list { height: calc(100% - 4.6875rem); overflow-y: scroll; padding-right: 1.25rem;}
.reservation .schedule_list::-webkit-scrollbar{ width: .3125rem; }
.reservation .schedule_list::-webkit-scrollbar-thumb{ background-color: #333;border-radius:.625rem;}
.reservation .schedule_list::-webkit-scrollbar-track{ background-color:#eee; border-radius:.625rem;}
.reservation .schedule_list li > div:first-child{width:100%; height:3.125rem; background:#F5F5F5; color:#666; border-radius:.625rem;}
.reservation .schedule_list li:first-child > div:first-child{background:#0066ef; color:#fff;}

.reservation .schedule_list .time_list{position: relative; padding:1.5rem 1.875rem; z-index: 0;}
.reservation .schedule_list .time_list:after { display: block; content: ""; width: 1rem; height: calc(100% - 5rem); border-left: 1px #ccc dashed; position: absolute; top: 2.5rem; left: 2.875rem; z-index: -1; }
.reservation .schedule_list .time_list a{position: relative; width:100%; height:2rem; color:#000; font-weight:500; padding-left:3.75rem;}
.reservation .schedule_list .time_list a .check_cir{position: absolute; top: calc(50% - 1.25rem); left: 0; width:2rem; height:2rem; border-radius:50%; background:#69BF00;}
.reservation .schedule_list .time_list a .check_cir:after { display: block; content: ""; width: .875rem; height: .5rem; border-top: 3px #fff solid; border-right: 3px #fff solid; transform: rotate(135deg) translate(0%, -180%); }
.reservation .schedule_list .time_list a .reserv{color:#69BF00;}
.reservation .schedule_list .time_list a.off{color:#aaa;}
.reservation .schedule_list .time_list a.off .check_cir{background:#999;}
.reservation .schedule_list .time_list a.off .reserv{color:#aaa;}

.reservation .possible i{ width: 1.875rem; height:1.875rem; background:#EFF5FD; border-radius:.3125rem;}


/* 사람찾기 게시판 */

.people_search .people_list{ display: grid; grid-template-columns: repeat(4,1fr); gap: 1.25rem;}
.people_search .people_list .people_box{width:100%;}
.people_search .people_list .list_wrap {position: relative;height: 33.75rem;padding: 1.25rem;background: #fff;border: 1px #ddd solid;border-radius: 1.25rem;}
.people_search .people_list .profile { width: 100%; height: 11.25rem; background: #ccc; border-radius: 1.25rem; overflow: hidden;}
.people_search .people_list .profile img{ width: 100%; height: 100%; object-fit: cover;}
.people_search .people_list .name_box{border-bottom:1px #ddd solid;}
.people_search .people_list .name_box .lang_tab li { width: 3.125rem; height: 1.875rem; background: #ccc; font-size: .75rem; font-weight: 500; color: #fff; border-radius: 5rem;  cursor: pointer;}
.people_search .people_list .name_box .lang_tab li.on{background:#0BBEF6;}

.people_search .people_list .info_list{ gap: .5rem; font-size: .875rem;}
.people_search .people_list .info_list b{width:7.5rem; line-height: 1;}

.people_search .people_list .list_wrap .link_share{position: absolute;bottom: 1.25rem;right: 1.875rem; display: flex; justify-content: center; align-items: center; width: 2.5rem; height: 2.5rem; background: #f2f2f2; border-radius: 50%; }
#share_popup .icon_wrap a img{max-width: 2.5rem; width:100%;}


.people_search .search_more{height:0px; opacity:0; transition: all 0.2s ease-in-out;}
.people_search .search_more i{height:1px; border-top: #ddd solid;}
.people_search .search_more > *{display:none;}
.people_search .search_more b{display: inline-block; width: 8.75rem; text-align:right; font-weight:500; color:#666;}

.people_search .search_more.on { height: auto; opacity: 1; margin-top: 1.875rem; padding-top: 1.875rem; border-top: #ddd solid; }
.people_search .search_more.on > *{display:flex;}
.people_search .search_more.on > ul{display: grid; grid-template-columns: repeat(2, 1fr); width: 100%; gap: .625rem 3.75rem;}
.people_search .search_more.on > ul li{display: flex; gap:1rem; align-items: center;}
.people_search .search_more.on > ul li input[type=text]{width:calc(100% - 8.75rem);}


.tags-display { display: flex; gap: 8px; flex-wrap: wrap; margin-top:.625rem;}
.tag-item { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; background-color: #e3f2fd; border-radius: 20px; font-size: 14px; color: #1976d2; }
.tag-item button { background: none; border: none; color: #1976d2; cursor: pointer; font-size: 16px; padding: 0; width: 20px; height: 20px; display: flex; align-items: center; justify-content: center; }
.tag-item button:hover { color: #d32f2f; }



/* 예비 양부모 신청 */
.adoptive_parents .step_box{border-radius:0 10px 10px;}
.adoptive_parents .step_box li{width:4.375rem;}
.adoptive_parents .step_box li p { font-size: 0.8125rem; line-height: 1.2; }
.adoptive_parents .step_box li.line:after {width: calc(100% + 4.375rem - 1.25rem);}
.adoptive_parents .pc_no { display: none; }

.adoptive_parents td .flex_box input[type=text]{max-width: 100%;}
.adoptive_parents #familyTableBody td:nth-child(2) input[type=text],
.adoptive_parents #childTableBody td:nth-child(3) input[type=text] { width: calc(100% - 5rem); }


/* 로그인 */
#contents.login { display: flex; justify-content: center;}
.login_box { width: 37.5rem; height: auto; box-shadow: 3px 0px 20px rgba(51,51,51,0.15 ); border-radius: 2.5rem; overflow: hidden; padding: 3.125rem 5rem;}
.login_box form{width:100%;}
.login_box ul li input[type="text"],
.login_box ul li input[type="password"]{ width: 100%; padding: 1.25rem; height: 3.25rem; background: #f2f2f2; border: 0; border-radius: 50px; font-size: .94rem; }
.login_box ul li input[type="email"],
.login_box ul li select{ padding: 0 1.25rem; height: 3.25rem; background: #f2f2f2; border: 0; border-radius: 50px; font-size: .94rem; }
.login_box ul li select{background: #f2f2f2 url(../images/arrow_down.png) no-repeat 85% 50%;}
.login_box .btn_css { width: 100%; height: 3.25rem; font-size: 1rem;}
.login_box .btm {margin-top:1.25rem; padding-top: 1.25rem; border-top: 1px solid #e4e4e4; }
.login_box .btm a{position: relative; color:#777;}
.login_box .btm a + a:after{content: "";position: absolute; top:calc((100% - .875rem)/2); left: calc(-1.875rem / 2); width: 1px; height: .875rem; background: #ccc;}


/* 회원가입 */
.join_step {position: relative;margin-bottom:3.125rem;z-index: 0;}
.join_step > ol {display: flex;max-width:800px;width: 100%;position: relative;z-index: 9;margin: 0 auto;justify-content: space-between;}
.join_step > ol > li {position: relative;border: 1px solid #ddd;color: #999;font-weight: 300;text-align: left;width: calc((100% - 6.25rem)/3);box-sizing: border-box;padding: .875rem;margin-left: -1px;border-radius: 3.125rem;}
.join_step > ol > li + li:after {content: "";width:.875rem;height: .875rem;border-top: #999 2px solid;border-left: #999 2px solid;transform: rotate(133deg);margin-top: -.625rem;position: absolute;top: 50%;left: -2.125rem;}
.join_step > ol > li i { display: flex ; justify-content: center; align-items: center; width: 3.75rem; height: 3.75rem; background: #f0f0f0; border-radius: 50%; }
.join_step > ol > li i img {opacity:.4; width: 50%;}
.join_step > ol > li.on { background: linear-gradient(45deg, #0066ef, #0BBEF6); border: none; color: #ffffff; z-index: 99; position: relative; }
.join_step > ol > li.on i {background: #fff;}
.join_step > ol > li.oni img {opacity:1;}

.join_accordion{border:1px solid #dedede; border-radius:.625rem;overflow: hidden;}
.join_accordion .header{position: relative; }
.join_accordion .header a { height: 4.375rem; padding: 0 2.5rem; border-top: 1px #e7e7e7 solid;}
.join_accordion .header:first-child a {border-top: 0;}
.join_accordion .header i{width: 4.375rem;height: 4.375rem;position: absolute;top: 0;right: 1.25rem;}
.join_accordion .header i:after{content: "";width:.875rem;height: .875rem;border-top: #999 2px solid;border-left: #999 2px solid;transform: rotate(-135deg);margin-top: -.625rem;position: absolute;top: 50%;right: 1.5rem;}
.join_accordion .header.active i:after{transform: rotate(45deg); margin-top: -.375rem;}
.join_accordion .scrollbox{margin-top:0; border:0; padding:1.5rem 2.5rem; border-top: 1px #e7e7e7 solid;}

.join_01 .certification{gap:3.125rem;}
.join_01 .certification div.flex_box{width:31.25rem;background: #f7f7f7;padding: 1.5rem 0;border-radius: 10px;}
.join_01 .certification a{position: relative; width:50%; height:6.25rem;}
.join_01 .certification a i{width:3.125rem;}
.join_01 .certification a + a:after{content: "";position: absolute; top:15%; left: 0; width: 1px; height: 70%; background: #ccc;}

.join_02 .info_table {border-top:2px #000 solid;}
.join_02 .info_table li {width:100%; padding:1.25rem 0; border-bottom:1px #ccc solid;}
.join_02 .info_table li b { width: 12.5rem; }
.join_02 .info_table li div.cc { width: calc(100% - 12.5rem); }
.join_02 .info_table li div.cc p{ width: 100% }
.join_02 .info_table li div.cc p span { display: block; width: calc(100% - 3.75rem - 16.25rem); }
.join_02 .info_table li div.cc p .btn_style4 {width: 16.25rem; padding:0;}



.join_03 .board-write td{text-align: left; padding:15px 20px;}
.join_03 .bt_include{position: relative;}
.join_03 .bt_include a{min-height: 37px;}


.find_tab {width : 100%; max-width : 640px; margin: 0 auto;}
		
ul.tabnav {display: flex; align-items: center; justify-content: center; border-bottom: 1px solid #0168B7; /* margin-bottom: 2.5rem; */}
ul.tabnav > li {width: 100%; text-align: center; height: 3.125rem;}
ul.tabnav > li > a {/* padding: 13px 0; */ line-height: 3.125rem; width: 100%; display: block; font-size : 1.125rem; font-weight : 300;}
ul.tabnav > li > a.active{ background:#fff;  color:#0168B7; font-weight: 500; border: 1px solid #0168B7; border-bottom : 0px;  border-radius : 6px  6px  0px 0px; }	

.find_box {background: #f8f8f8;  padding: 24px; border-radius: 6px;}
.find_box input ,
.find_box .bt_include input {width: 100%; padding : 1.25rem; height: 2.8125rem; background : #fff; border: 1px solid #ededed; /* border-radius : 50px; */ font-size: .94rem;}
/*  .find_box .bt_include  .btn_style4 {height: 3.25rem;} */
/* {margin-bottom: 0.375rem; height : 2.8125rem;} */
.certifi_issue_re{display:none;}
.certifi_issue_re.active{display:block;}
.certifi_issue.retry{display:none;}

.certifi_timer{display:none;}
.certifi_timer.active{display:block;}

		

/*마이페이지*/
/* .info_tab { margin: 40px 0 20px; }
.info_tab .btn_wrap { display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 0;}
.info_tab .btn_wrap li { width: auto; padding: 13px 3.875rem; text-align: center; background: #eee; font-size: 1.0625rem; font-weight: 700; color: #999; border-bottom: 1px solid #5b5d64; border-radius: 10px 10px 0 0; }
.info_tab .btn_wrap li+li {border-left: 1px solid #e0e0e0; }
.info_tab .btn_wrap li.active { background: #fff; color: #000; border: 3px solid #5b5d64; border-left: 1px solid #5b5d64 !important; border-right: 1px solid #5b5d64 !important; border-bottom : 0; margin-top: -3px; color: #5b5d64; }

.info_tab > .tab_wrap > li { width: 100%; padding: 2.5rem 0px 0px; border-top: 0; display: none; }
.info_tab > .tab_wrap > li.on { display: block; }

.tab_wrap { display: flex; font-family: 'S-CoreDream'; border-top: 1px solid #5b5d64; margin-top: -1px;}
.tab_wrap > a { display: block; flex: 1; height: 75px; line-height: 75px; background: #f9f9f9; border: 1px solid #ccc; border-bottom: 1px solid #e4251e; font-size: 1.25rem; font-weight: 500; color: #858585; text-align: center; }
.tab_wrap > a.on { border-color: #e4251e; color: #e4251e; border-top: 3px solid #e4251e; border-bottom: 0; background: #fff; }
.tab_wrap.no_flex {display: block; padding-top: 40px;}

.acc_password .imgBox{ max-width: 160px;margin: 0 auto}
.acc_password .password_ok{font-size: 1.687rem;font-family: 'GmarketSans';}
.acc_password input {width: 15.625rem; padding: 1.25rem; height: 3.25rem; background: #f2f2f2; border: 0; border-radius: 50px; font-size: .94rem;}
.acc_password .btn_css {padding: 0.875rem 1.75rem; height: 3.25rem;}

.acc_cancel ul li{width:100%;}
.acc_cancel .acc_add{padding:1.25rem; border-top: 2px solid #000;border-bottom: 1px solid #ccc} */

#contents.mypage > .wrap { width: 100%; max-width: 1600px; margin: 0 auto;}
.mypage .left-menu {width: 18.125rem;}
.mypage .left-menu h4 {border-bottom: 1px solid #000; padding: 0 0 1.25rem 0;}
.mypage .left-menu .myDepth1 {margin-top: 16px;}
.mypage .left-menu .myDepth1 > li {width: 100%; margin-bottom: 6px; position: relative;}
.mypage .left-menu .myDepth1 > li:last-child {margin-bottom:0;}
.mypage .left-menu .myDepth1 > li > a {width: 100%; padding: 14px 20px; background: #f3f3f3; display: block; border-radius: 8px; font-size: 17px; font-weight: 400; position: relative; }
.mypage .left-menu .myDepth1 > li.on > a,
.mypage .left-menu .myDepth1 > li:hover > a{background: #2d2d2d; color: #fff; }
.mypage .left-menu .myDepth1 > li > a:after {display: inline-block; content:""; background: url(/asset/images/gnb_minus.png) no-repeat; width: 13px; height: 13px; position: absolute; right: 20px; top: 50%; transition: all 0.3s; transform: translate(0, -50%); filter: brightness(0.6);}
.mypage .left-menu .myDepth1 > li.on > a:after,
.mypage .left-menu .myDepth1 > li:hover > a:after {background: url(/asset/images/gnb_plus.png) no-repeat; filter: brightness(100); }

.mypage .left-menu .myDepth1 > li.on > .myDepth2 {display: block;}
.mypage .left-menu .myDepth2 {display: none; width: 100%; padding-left: 30px;}
.mypage .left-menu .myDepth2 > li > a {display: block; position: relative; padding: 10px 6px; color: #707070;}
.mypage .left-menu .myDepth2 > li > a:before {display: inline-block; content: ""; width: 5px; height: 5px; background: #a6a6a6; border-radius: 10px; position: absolute; top: 45%; left: -10px;}
.mypage .left-menu .myDepth2 > li.on > a,
.mypage .left-menu .myDepth2 > li:hover > a {color: #000; font-weight: 500;}
.mypage .left-menu .myDepth2 > li.on > a:before,
.mypage .left-menu .myDepth2 > li:hover > a:before {background: #0066EF;}

.mypage .right {width: calc((100% - 18.125rem) - 42px)}
.mypage .right .inner {width: 100%; margin-top: 0 !important;}

.mypage .div_tab.fouth_depth{border-bottom:0;}


/* 마이페이지 메인 */

.mypage.main .inner{width:1600px;}
.mypage.main .top .mem_info{padding: 3.125rem 3.125rem 2.5rem; width: 28.125rem; background: linear-gradient(94.23deg, #0066EF 1.79%, #0BBEF6 98.21%); border-radius: 1.25rem;}
.mypage.main .top .mem_info .btn_style2.white_fill{border:1px #fff solid;}

.mypage.main .top .alarm{width: calc(100% - 28.125rem - 2.5rem);}
.mypage.main .top .alarm > div{padding: 3.75rem 3.125rem; width: calc((100% - 3.75rem)/4); background:#fff; border-radius: 1.25rem; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1); transition: all 0.2s 
ease-in-out;}
.mypage.main .top .alarm > div a{width:100%; height:100%;}
.mypage.main .top .alarm > div:hover{background:#EFF5FD; }
.mypage.main .top .alarm > div:hover a{color:#0066EF;}

.mypage.main .service{margin:7.5rem 0;}
.mypage.main .service > ul > li{ width: 100%; height:13.75em;}
.mypage.main .service li .left{width: 28.125rem; height:100%; background:#fff; border-radius: 1.25rem; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1); padding:3.125rem;}
.mypage.main .service li .left .tag{padding:.875rem 1.875rem; border-radius:5rem; background:#ccc; color:#fff; line-height:1;}
.mypage.main .service li .left .tag.on{ background:#0066EF;}
.mypage.main .service li .left .arrow{ width: 1.5rem;}
.mypage.main .service li .left .arrow.on a{opacity:1;}
.mypage.main .service li .left .arrow a{position: relative; width: 1.5rem; height: 1.5rem; opacity:.2;}
.mypage.main .service li .left .arrow a:after{content: ""; position: absolute; left: 50%; top: 25%; transform: translateX(-50%) rotate(135deg); width: 1rem; height: 1rem; border-top: 2px solid #333; border-right: 2px solid #333;}
.mypage.main .service li .left .arrow a.prev:after{transform: translateX(-50%) rotate(315deg);}
.mypage.main .service li .left .arrow a.swiper-button-disabled{ opacity:.2;}

.mypage.main .service li .right{width: calc(100% - 28.125rem - 2.5rem); height:100%; padding:2.5rem; overflow: hidden;}
.mypage.main .service li .right .swiper-wrapper,
.mypage.main .service li .right .swiper-slide{height:100%;}


.mypage.notice .div_tab.fouth_depth a i{display: flex; justify-content: center; align-items: center; width:1.875rem; height:1.875rem; border-radius:50%; font-size:.875rem; font-weight:500; line-height:1; background:#f5f5f5; }
.mypage.notice .div_tab.fouth_depth a.on i{background:#DB0000;}


.toggle-button { position: relative; width: 5rem; height: 1.875rem; border-radius: 5rem; overflow: hidden; transition: background-color 0.5s ease-in-out; }
.toggle-button.on { background-color: #60A5FA; }
.toggle-button.off { background-color: #9CA3AF; }
.toggle-text {position: absolute;top: 0;left: 0;width: 100%;height: 100%;display: flex;align-items: center;justify-content: center;color: white;font-weight: bold;font-size: .875rem;transition: padding 0.5s ease-in-out;}
.toggle-button.on .toggle-text {padding-right: 1.875rem;}
.toggle-button.off .toggle-text { padding-left: 32px; }
.toggle-circle {position: absolute;top: 5px;width: 1.25rem;height: 1.25rem;background-color: white;border-radius: 50%;box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);}
.toggle-button.on .toggle-circle {transform: translateX(3.4375rem);}
.toggle-button.off .toggle-circle { transform: translateX(8px); }


#feedback .date{
	text-align: center;
}
#feedback .talk_wrap{
	height: 27.5rem;
	overflow-y: scroll; 
	border-top: 1px solid #000;
	border-bottom:1px solid #ccc;
	padding: 20px 0
}
#feedback .talk{
	padding: 20px; 
	width: 100%;
	border-radius: 20px 0 20px 20px;
	background: #ddf0fd;
}

#feedback .question .talk{
	border-radius:0 20px 20px 20px;
	background: #f5f5f5;
}

#feedback .question li.feedback{
	display: grid;
	align-items: center;
	justify-content: start;
	position: relative;
}
#feedback .answer{
	display: grid;
	align-items: center;
	justify-content: end;
}
#feedback .answer li.feedback{
	display: grid;
	align-items: center;
	justify-content: end;
	position: relative;
}
#feedback .answer .btn_wrap{
	display:none;
}
#feedback .answer:hover .btn_wrap{
	display:block;
	width: fit-content;
	position: absolute;
	left: -70px;
	bottom: 5px;
	
}
#feedback .answer .btn_wrap li.active{
	display:flex;
	width: fit-content;
	background: #666;
	border-radius: 4px;
}
#feedback .answer .btn_wrap li{
	display:none;
}
#feedback .answer .btn_wrap a{
    width: 30px;
    height: 30px;
    color: #fff;
    text-align: center;
    line-height: 30px;
}
#feedback .answer .file a, 
#feedback .question .file a{
	display: flex;
	padding: 6px 10px;
	background: #fff;
	border-radius: 6px;
	align-items: center;
	font-size: 14px;
	gap: 5px;
	color: #666
}
#feedback .answer .fileName,
#feedback .question .fileName{
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	width: 12.5rem;
}

#feedback .answer_wrap{
	width: 100%; 
	padding: 20px 0
}
#feedback .answer_wrap textarea{
	background: #f5f5f5;
	width: 100%; 
	border: 0; 
	border-radius: 10px;
	height: 6.25rem;
}
#feedback .answer_wrap i{
	padding: 10px ; 
	display: flex; 
	align-items: center;
	justify-content: center;
	background: #fff;
	border-radius: 10px;
	border: 1px solid #ddd;
}
#feedback .send_wrap{
	position: relative;
}
#feedback .send_wrap .send_btn{
	position:absolute; 
	right: 1% ;
	bottom:8%;
}


/*
#feedback .top { background: #ffffff; padding: 1.875rem 2rem 0; color: #333; }
#feedback .close::before,
#feedback .close::after{background-color: #333;}
#feedback .date{text-align: center;}
#feedback .date span{width: fit-content;padding: 6px 30px;border-radius: 30px;border: 1px solid #ccc}
#feedback .talk_wrap{height: 27.5rem;overflow-y: scroll; overflow-x: hidden; border-top: 1px solid #000;border-bottom:1px solid #ccc;padding: 20px 0}
#feedback .talt{padding: 20px; width: fit-content;margin:5px 0;border-radius: 20px 0 20px 20px;position: relative;}
#feedback .question .talt{border-radius:0 20px 20px 20px;}
#feedback .question:hover .btn_wrap, #feedback .answer:hover .btn_wrap{display:block;}
#feedback .btn_wrap{display:none;}
#feedback .question{display:flex;flex-wrap: wrap;justify-content: start;margin-top: 20px;}
#feedback .question .talt{background: #f5f5f5;}
#feedback .question .talt .btn_wrap{position:absolute;right:-50px ;bottom:0;}
#feedback .answer{display:flex;flex-wrap: wrap;justify-content: end;margin-top: 20px;}
#feedback .answer .talt{background: #ddf0fd; max-width: calc(100% - 50px);}
#feedback .answer .talt .btn_wrap{position:absolute;left:-50px ;bottom:0;}

#feedback .use_name {width:100%;}
#feedback .check{width:100%;}
#feedback .time{margin-top: 10px;}

#feedback .answer_wrap{width: 100%; padding: 20px 0}
#feedback .answer_wrap textarea{background: #f5f5f5;width: 100%; border: 0; border-radius: 10px;height: 6.25rem;}
#feedback .answer_wrap i{padding: 10px ; display: flex; align-items: center;justify-content: center;background: #fff; border-radius: 10px; border: 1px solid #ddd;}
#feedback .send_wrap{ position: relative;}
#feedback .send_wrap .send_btn{position:absolute; right: 1% ;bottom:8%;}
*/


/* 마이페이지-진행상황
.mypage .step_box ul{position: relative; z-index: 0;}
.mypage .step_box ul:after{content: "";position: absolute; top:calc(.625rem - 1px ); left: 4rem; width: calc(100% - 8rem); height: 2px; background: #ccc; z-index: -2;}
.mypage .step_box li{position: relative; z-index: 0; display: flex; flex-direction: column; align-items: center; gap: .75rem; width:8rem; text-align:center; font-size:.875rem; color:#8e8e8e;}
.mypage .step_box li i{position: relative; width:1.25rem; height:1.25rem; background:#fff; border:1px #ccc solid; border-radius:50%;}

.mypage.service-progress02 .step_box ul {width: calc(100% - 7.5rem);}
.mypage.service-progress02 .step_box ul:after {left: 6rem; width: calc(100% - 13rem);}
.mypage.service-progress02 .step_box li { width: 13rem;}
.mypage.service-progress02 .step_box li.on:after {right: 6rem; width: calc(100% + 0.75rem);}
.mypage.service-progress03 .step_box li.on:after,
.mypage.service-progress04 .step_box li.on:after{width: calc(100% + 9.45rem)}
.mypage.service-progress03 .gray_box > a,
.mypage.service-progress04 .gray_box > a{margin-left: auto;}


.mypage .step_box li.on{ color:#000;}
.mypage .step_box li.on:after { content: ""; position: absolute; top: calc(.625rem - 1px); right: 4rem; width: calc(100% + 0.45rem); height: 2px; background: #0BBEF6; z-index: -1; }
.mypage .step_box li.on i{background:#0BBEF6; border:1px #0BBEF6 solid;}
.mypage .step_box li.on i:after{ content:""; position: absolute; left: 50%; top: 25%; transform: translateX(-50%) rotate(135deg); width: .625rem; height: .375rem; border-top: 2px solid #fff; border-right: 2px solid #fff;}
.mypage .step_box li.on:first-child::after{display:none;}
.mypage .step_box li:first-child i,
.mypage .step_box li:first-child i:after{z-index: 3}
.mypage .step_box li .modify { cursor: pointer;}
.mypage .step_box li .modify:after {display: inline-block; content: ""; width: 18px; height: 18px; background: url('/asset/images/modify_ico.png') no-repeat; vertical-align: top; margin-left: 6px;}
 */
 

/*terms*/
.terms h3{margin-top:1.875rem;font-weight:bold; color:#ff7200;}
.terms .depth1{margin-top:.625rem; text-indent: -1.25rem; padding-left: 1.25rem;}
.terms .depth2{padding-left:1.5rem;}
.terms .depth3{padding-left:1.5rem;}

.terms .privacy .privacy_tb{max-width:1200px;margin:1.875rem auto; border-top: 2px solid #1f70c1;}
.terms .privacy .privacy_tb table th,
.terms .privacy .privacy_tb table td{border:1px solid #ccc;padding:10px;vertical-align:top;}
.terms .privacy .privacy_tb table th{font-size:1.5rem;}
.terms .privacy .privacy_tb table td strong{display:block;text-align:center;margin-top:10px;}
.terms .privacy .privacy_tb table td p{text-indent: 0rem; padding-left: 0rem; font-size:.875rem; text-align:center;}
.terms .privacy .privacy_tb .td_img{display:block;text-align:center;}

.terms .privacy img { max-width: 100%; max-height: 140px; }
.terms .privacy p{ text-indent: -1.25rem; padding-left: 1.25rem; margin-top:.625em; color:#666;}
.terms .privacy h4.sub_title { font-size: 1.4em; font-weight: 700; padding-top: 30px; margin-bottom: 15px; line-height: 1; text-align: center; }
.terms .privacy a{color:#3691d6; font-weight:500;}
.terms .privacy .depth1{margin-left: 1.25rem;}



/* ===============반응형======================================== */


@media screen and (max-width: 1600px) {
	/* 마이페이지 */
	#contents.mypage > .wrap { width: calc(100% - 2.5rem); padding-top:0;}
	.mypage .step_box ul {margin:0 -1.25rem; width: calc(100% + 2.5rem);}
}


@media screen and (max-width: 1300px) {
	.inner { width: calc(100% - 2.5rem); }
	
	#sub_visual {width: calc(100% - 2.5rem);}
	#sub_visual .sub_title {height: 13.75rem;}
	#sub_visual .sub_title h2{font-size: 2.5rem;}
	#sub_visual .sub_title .inner{padding-left: 7.5rem; }
	
	.flex_box input[type="checkbox"] + p { width: calc(100% - 1.625rem); }
	
	
	/* 1-5 오시는길 */
	.location{ width: calc(100% - 2.5rem); }
	.fixed .location { padding-left: 1.25rem;}


	/* 마이페이지 */
	.mypage.main .top .mem_info {width: calc(40% - 2.5rem);}
	.mypage.main .top .alarm {display: grid; grid-template-columns: repeat(2, 1fr); width: 60%;}
	.mypage.main .top .alarm > div{width:100%; padding: 2.5rem 3.125rem;}
	.mypage.main .top .alarm > div a{flex-direction: row; align-items: center;}
	.mypage.main .top .alarm > div a .long{width:auto;}
	
	.mypage.main .service li .left { width: 25rem;}
	.mypage.main .service li .right { width: calc(100% - 25rem - 2.5rem);}
	
	.mypage .step_box ul {justify-content: flex-start; gap: .625rem 0rem;margin:0 auto;width: 100%;}
	.mypage .step_box ul li {width: calc(100% /6); flex-direction: row; text-align: left;}
	.mypage .step_box li.line{display:none;}
	.mypage .step_box li p{width:calc(100% - 1.875rem)}
	.mypage .step_box ul li .modify { position: absolute; right: 10%; }
	
	.mypage .step_box ul + .btn_style4 {margin-top:1.5rem;}
}


@media screen and (max-width: 1200px) {
	/* 마이페이지 */
	#contents.mypage.main .inner { margin-top:0;}
	.mypage .step_box ul li {width: calc(100% /4); }

	.mypage.main .service li .right .swiper-slide{gap:1.25rem;}
	
	.mypage .left-menu { width: 100%; }
	.mypage .left-menu .myDepth1 { display:none; }
	.mypage .left-menu h4 { border-bottom: 0px solid #000; padding: 0 0 2rem 0; }
	.mypage .right { width: 100%; }
	.mypage .right .con1 > h4:first-child{ display:none; }

}


@media screen and (max-width: 900px) {
	/* 1-5 오시는길 */
	.map_info { flex-direction: column; align-items: flex-start; gap:1.875rem;}
	.map_info .left,.map_info .right{width:100%; border-radius:.625rem 3.75rem; }
	.map_info .left .root_daum_roughmap .wrap_map{height: 350px !important;}
	
	/* 4 방문예약 */
	.reservation .calendar,
	.reservation .date_list{width: 48.5%;}
	#kadoption.f_popup .flex_box .period_s,
	#archives.f_popup .flex_box .period_s{min-width:auto;}
	
	
	/* 5 가족찾기 게시판 */
	.people_search .people_list {grid-template-columns: repeat(3, 1fr);}
	
	.people_search .col-sm-3 .select_ds {width: calc(100% - 1.25rem);}
	.people_search select,
	.people_search td > .col-sm-3 select.select_ds {min-width: 12.5rem; width: 12.5rem;}
	.people_search input[type=text].hasDatepicker {min-width: auto; max-width:12.5rem !important}
		
	
	/* 마이페이지 */
	.mypage.main .service > ul > li { flex-direction: column; gap: 1.25rem; height: auto; }
	.mypage.main .service li .left,
	.mypage.main .service li .right { width: 100%; height: 12.5em; }
	
	.myqna colgroup col.gubun { width: 10rem !important; }
	.myqna colgroup col.answer{width:6.25rem !important;}
}
	
@media screen and (min-width:767px) and (max-width: 900px) {
	/* 마이페이지 */
	.mypage .step_box ul { margin: 0 -1.25rem; width: calc(100% + 2.5rem); }
	.mypage .step_box ul li { width: 6.25rem; flex-direction: column; text-align: center; }
	.mypage .step_box li.line{display:block}
	.mypage .step_box li p { width: calc(100% + 2rem); }
	.mypage .step_box ul li .modify { position: relative; right: 0; }
	.mypage .adoptive_parents .step_box li { width: 4.375rem; }
	
	
}

@media screen and (max-width: 880px) {
	.people_search .siblings_y{display:none !important;}
	.people_search .siblings_y.active{display:flex !important;}
	
	/* 6 예비양부모 */
	.adoptive_parents .pc_no { display: block; }
	.adoptive_parents .mob_no { display: none; }
	.adoptive_parents #familyTableBody tr,
	.adoptive_parents #childTableBody tr{ flex-direction: row; flex-wrap: wrap; gap: 1rem; border-bottom: #ccc 1px solid; padding: 1.25rem; }
	.adoptive_parents #familyTableBody td,
	.adoptive_parents #childTableBody td{text-align:left !important;border: 0;padding: 0;width: calc((100% - 2rem)/3);}
	.adoptive_parents #familyTableBody td input[type=text],
	.adoptive_parents #childTableBody td input[type=text]{max-width:100% !important; width:100%;}
	.adoptive_parents #familyTableBody td > .flex_box,
	.adoptive_parents #childTableBody td > .flex_box{justify-content: start;}
}


@media screen and (max-width: 767px) {
	/* 공통 */
	#sub_visual { margin: 7.5rem 0 0; width: 100%; border-radius: 0;}
	#sub_visual .sub_title { height: 11.25rem;}
	#sub_visual .sub_title h2{ font-size: 1.875rem; line-height: 1.2;}
	#sub_visual .sub_title .inner { padding-left: 3.125rem; }
	
	.location {width: 100%; height: 3.125rem; }
	.location .home { width: 3.75rem; height: calc(3.75rem - 2px); border-radius: 0; }
	.location .home img{ width: 35%; }
	.location div { width: calc((100% - 4rem) / 2); }
	.location div > a { padding: 0 1.25rem ;}
	.location .location_sub { top: calc(3.125rem - 1px); border-radius: 0; }
	.location.progress div { width: calc((100% - 4rem) / 3); }
	.fixed .location { padding-left: 0rem; }	

	
	/* 로그인 / 회원가입 */	
	.join_02 table.data tbody td > div.flex_box{flex-direction: column; align-items:flex-start; gap:.625rem;}
	.join_02 table.data .file_input input{max-width:calc(100% - 6.25rem); width:100%;}
	.join_02 table.data .file_input label{margin:0;}
	.join_02 table.data .col-sm-3{max-width:100% !important;}
	.join_02 .tel_wrap .select_ds{min-width:auto;}
	
	
	/* 2 입양정보공개청구 */
	.adoption_info .cc.as .img_box ,
	.additional_service .cc.as .img_box{max-width: 100%;}
	
	/* 4 방문예약*/
	.reservation .calendar .list ul.num li.on:after {width: 80%;}
	
	/* 5 가족찾기 게시판 */
	.people_search.list .search_box select {max-width: 120px !important;}
	.people_search.list .search_box input[type=text] {max-width: calc(500px - 5rem - 6.25rem) !important;}
	.people_search .search_more.on > ul li > .flex_box,
	.people_search .search_more.on > ul li input[type=text] { width: 100%; max-width: calc(100% - 1rem - 8.75rem) !important; }
	.people_search .search_more.on > ul li input.period_s {max-width: 12.5rem !important;}
	.people_search .search_more.on > ul {grid-template-columns: repeat(1, 1fr);}
	
	.people_search .sibling-item .gray_box > .flex_box:first-child{ flex-direction: column; width: 100%;}
	.people_search .sibling-item .gray_box > .flex_box > div{width:100%}
	
	
	
	/* 마이페이지 */
	.mypage.main .inner > .top { flex-direction: column; }
	.mypage.main .inner > .top > div {width:100%;} 
	.mypage.main .service li .right {height: 13em; }
	.mypage.main .service li.adoptive_parents .right{height: 15em;}
	
	/* 마이페이지 서브 */
	.mypage .step_box ul li { width: calc(100% / 3);}
}


@media screen and (max-width: 640px) {
	.pc_no { display: block; }
	.mob_no { display: none; }
	
    .location.progress { height: 3.75rem; }
	.location.progress div.dep1,
	.location.progress div.dep2:after{display:none;}
	.location.progress div.dep2,
	.location.progress div.dep3{ width: calc((100% - 3.75rem) / 2);border-bottom: 1px #ddd solid;}
	.fixed .location div.dep2,
	.fixed .location div.dep3{border-bottom: 0px #ddd solid;}
	

	table .hover_box .hover_txt {max-width: 250px; left: auto;}
	table .flex_box.gap40{gap:1.25rem;}
	
	.file_list td input[type=text] { max-width: calc(100% - 7.5rem) !important;}
	

	/* 로그인 / 회원가입 */
	.login_box {flex-direction: column; flex-wrap: nowrap; padding: 2rem 2rem 3.125rem;}
	.login_box .fs30 { font-size: 1.5rem; }
	.login_box .left {width: 100%; height: 7rem;}
	.login_box .left p { display:none;}
	.login_box .left .tit {width: 40%; display:block;}
	.login_box .right { width: 100%; padding: 3rem; }
	
	.join_step > ol > li { flex-direction: column; }
	.join_step > ol > li div {align-items: center;}
	
	.join_01 .certification { gap: 1.25rem; }
	.join_01 .certification .txt{text-align:center;}
	
	.join_02 .gray_box2 + .flex_box {justify-content: flex-end;}
	.join_02 .gray_box2 + .flex_box h4.h4_tit{width:100%; margin-bottom:.625rem;}
	.join_02 .info_table li,
	.join_02 .info_table li div.cc p{flex-direction: column; align-items: flex-start; gap:1.25rem;}
	.join_02 .info_table li div.cc,
	.join_02 .info_table li div.cc p span{ width:100%; }
	
	
	/* 통합검색 */
	.total_search .search_box fieldset { flex-direction: column; max-width: 400px; margin: 0 auto; padding:0 2.5rem;}
	.total_search .search_box fieldset > * {width:100%; border-radius: 5px;}
	
	
	
	/* 1-5 오시는길 */
	.map_info .left .root_daum_roughmap .wrap_map{height: 300px !important;}
	.bus_table{flex-direction: column;}
	.bus_table > div {flex-direction: row;}
	.bus_table .left, .bus_table .center, .bus_table .right{width:100%;}
	.bus_table .top {width: 10rem;  height:auto;}
	.bus_table .bottom{width:calc(100% - .625rem - 10rem)}
	
	/* 4 방문예약 */
	.reservation .calendar,
 	.reservation .date_list {width: 100%;}
	.reservation .calendar .list ul.num li.on:after{width: calc(100% + 1.875rem);}
	
	/* 5 가족찾기 게시판 */
	.people_search .people_list {grid-template-columns: repeat(2, 1fr);}
	.people_search.list .flex_box.mb60 { flex-direction: column; gap: 30px; align-items: end; }
	.people_search.list .flex_box .div_tab{width:100%;}
	.people_search.list .flex_box .div_tab a{width: calc((100% / 2) - .625rem); text-align:center;}
	.people_search.list .search_box input[type=text] {max-width: calc(400px - 5rem - 6.25rem) !important;}
	
	
	/* 마이페이지 */
	.mypage.main .file_list table.list tbody tr .down_date {position:relative; font-weight: 500; color:#DB0000;}
	.mypage.main .file_list table.list tbody tr .write_date + .down_date:after {content:'~'; display:block; position: absolute; top: calc(50% - 0.8rem); left: -1.25rem; font-weight: 400;  color:#000;}
	
	.mypage.notice .page_num + .flex_box { flex-direction: column-reverse; gap: 1.25rem; align-items: end;}
	.mypage.notice .div_tab.fouth_depth {width:100%;}
	.mypage.notice .div_tab.fouth_depth a { width: calc(100% / 2); }
	.mypage.notice table.list tbody td:last-child { width: auto; }
	
	.myqna table.list tbody td .tag{width:auto; text-align:center;}

}

@media screen and (max-width: 480px) {
	/* 공통 */
    #sub_visual .sub_title { height: 8.75rem;}
	
	.location .home,
	.location div.dep1,
	.location .dep2::after{display:none;}
	.location div.dep2{width:100%; border-bottom: 1px #ddd solid;}
	.fixed .location div.dep2{border-bottom: 0px #ddd solid;}
	
	.location.progress div.dep2,
	.location.progress div.dep3{ width: calc(100% / 2);border-bottom: 1px #ddd solid;}
	
	.fixed .location.progress div.dep2,
	.fixed .location.progress div.dep3{ border-bottom: 0px #ddd solid;}

	
	.search_box{margin-bottom:1.25rem !important;}
	.search_box fieldset { display: flex; flex-direction: column; width: 100%; }
	.search_box select, .search_box input[type=text], .search_box button{width:100% !important; max-width: 100% !important;}
	.search_box button {background: url(../images/s_search_icon.png) no-repeat 45% 50%; background-color: #2d2d2d;}
	.search_box .date-range input[type=text] { max-width: 47% !important; }
	
	.div_tab {gap: .625rem; }
	.div_tab a { min-width: auto; width: calc((100% / 3) - .625rem); padding: 0rem 1.5rem; font-size: 1rem;}
	.div_tab.fouth_depth a{width: calc(100% / 3);}
	
	.applicant { flex-direction: column-reverse; gap: .625rem; }
	.captcha { flex-direction: column; }
	.captcha .gray_box {width: auto !important;}
	.captcha > div.cc{ width:100% !important;}
	.captcha > div.cc input[type=text]{ max-width:100% !important;}
	
	/* 로그인 / 회원가입 */
	.join_02 table.data tbody td > div.bt_include{flex-direction: row; align-items: center;}
	.join_02 .email_wrap .select_ds { width: 100%; }
	.join_02 .email_wrap .select_ds:first-child{width:calc(100% - 2.5rem);}
	
	.join_03 .email_wrap{max-width:100% !important;}
	.join_03 .email_wrap span{display:none;}
	.join_03 .email_wrap .select_ds { width: 100%; min-width: auto !important; }
	
	
	/* 통합검색 */
	.total_search .search_box{margin-bottom: 2.5rem !important;}
	.total_search .fs24{font-size:1.25rem; text-align: center;}

	
	/* 1-5 오시는길 */
	.bus_table > div{ flex-direction: column;}
	.bus_table .top { width: 100%; height: 5rem; }
	.bus_table .bottom{width:100%;}
	.bus_table .left, .bus_table .center, .bus_table .right{width:100%;}
	
	
	/* 2 추가지원서비스 */
	.additional_service .dna {gap: 1rem;}
	.additional_service .gray_box {width: 100%;}
	
	/* 4 방문예약 */
	.reservation .calendar .list ul.num li.on:after{width: 100%;}

	/* 5 가족찾기 게시판 */
	.people_search .div_tab + .btn_style4 {margin-top: 1rem;}
	.people_search .people_list {grid-template-columns: repeat(1, 1fr);}
	.people_search.list .search_box select,
	.people_search.list .search_box input[type=text]{max-width: 100% !important;}
	.people_search.list .search_box > .flex_box .blue_fill {min-width: 100%;}
	
	/* 6 예비양부모 신청 */
	.adoption_info .step_box{ padding: 1.25rem;}
	.adoption_info .step_box ul { flex-direction: column; gap:1rem;}
	.adoption_info .step_box ul li {width: 100%; flex-direction: row; text-align: left; align-items: flex-start;}
	.adoption_info .step_box ul li.line{ width: 1.25rem; flex: auto;}
	.adoption_info .step_box li.line:after { top: -1rem; left: 50%; width: 2px; height: 2rem; background: #ccc;}
	
	.adoptive_parents #familyTableBody td,
	.adoptive_parents #childTableBody td{width: calc((100% - 1rem)/2);}
	
	
	/* 마이페이지 */
	.mypage.main .top .alarm > div { padding: 2em 2.5rem; }
	.mypage.main .top .alarm > div a { flex-direction: column; align-items: flex-start; }
	.mypage.main .top .alarm > div a .fs24{ font-size: 1.25rem; }
	.mypage.main .top .alarm > div a .fs40 { font-size: 2rem; }

	.mypage.main .service li .right{padding: 1.875rem 2.5rem;}
	.mypage.main .service li.adoptive_parents .right { height: 18em; }
	
	.mypage .step_box ul li { width: calc(100% / 2); }
	
	.mypage .adoptive_parents #familyTableBody td,
	.mypage .adoptive_parents #childTableBody td { width: auto; }
	
	#feedback .answer .talt { max-width: 100%; margin-bottom: 20px;}
	#feedback .answer .talt .btn_wrap { position: absolute; left: calc(100% - 50px); bottom: -25px; display:block;}
}


@media screen and (max-width: 400px) {
	.qna table.list tbody td.answer { position: relative; }
	.qna table.list tbody td.answer span { background: none; border: 0; color: #2d65b5 !important; font-size: 1rem; font-weight: 400; padding: 0; }
	.qna table.list tbody td.answer span.gray2 { color: #8e8e8e !important;}
	
	
	/* 로그인 / 회원가입 */
	.join_step > ol > li { width: calc((100% - 2rem) / 3); border-radius: 1.25rem;}
	.join_step > ol > li + li:after{display:none;}
	.login_box .btm .flex_box .btn_style6 {width: 100% !important; margin-top: 1rem;}
	
	
	/* 5 방문예약 */
	.reservation .calendar .list ul.num li.on:after {right: calc(-100% - 1.5rem);}
	
	
	/* 6 예비양부모 신청 */
	.adoptive_parents #familyTableBody td,
	.adoptive_parents #childTableBody td{width:100%;}

	/*마이페이지*/
}