@charset "utf-8";

/*
 * File Name : Layout.css
 */


/********************************************************
 
 *  Common
 
 ********************************************************/

body {width:100%;height: 100%; color:#000;font-size:14px;line-height:1.4;font-family:'Roboto','Noto Sans Korean','맑은 고딕', 'Dotum', '돋움', verdana, sans-serif;letter-spacing:-0.02em;word-break: keep-all;overflow:hidden;overflow-y:scroll;}
#wrap {min-width:350px;width:100%;height: 100%;}

.pdd {padding:0 5px 0 50px;box-sizing:border-box;}
.max_w {position:relative;max-width:1400px;margin:0 auto;}
.imgBox img {display: block;width:100%;}

@media screen and (max-width:1240px){
  .pdd {padding: 0 50px;}
}
@media screen and (max-width:960px){
  .pdd {padding: 0 40px;}
}
@media screen and (max-width:640px){
  .pdd {padding: 0 30px;}
}
@media screen and (max-width:480px){
  .pdd {padding: 0 25px;}
}


/*-----------------------------------------------------------------------------
 *  Mobile Menu
 *----------------------------------------------------------------------------*/

.menuMo {display:block;position:fixed;width:320px;height:100% !important;right:-320px;top:0;background:#fff;z-index:9;overflow-x:hidden;overflow-y:auto;transition:right 0.3s;}
.menuMo_head {padding:100px 0 0;background:#ea721a;}
.menuMo_head .menuMo_topMenu {padding:20px 30px;background:rgba(0,0,0,0.15)}
.menuMo_head .menuMo_topMenu ul li {display: inline-block;vertical-align: middle;margin-right:20px;}
.menuMo_head .menuMo_topMenu ul li a {color: #f6dcc9; font-size:15px;}
.menuMo_head .menuMo_topMenu ul li a:hover {color: #fff;}

.menuMo > ul.menuMoCont {}
.menuMo > ul.menuMoCont > li {}
.menuMo > ul.menuMoCont > li .mSubMenu {display: none;border-bottom: 1px solid #e5e5e5;}
.menuMo > ul.menuMoCont > li div.mSubMenu2 {display:none;background:#f6f6f6;}
.menuMo > ul.menuMoCont > li div.mSubMenu li.subMore {position:relative;}
.menuMo > ul.menuMoCont > li div.mSubMenu li.subMore > a {background:url(/resources/user/hyoryeong/images/common/moMenu_sub_more.png) no-repeat right 25px center;}
.menuMo > ul.menuMoCont > li div.mSubMenu li.subMore > a.active {background: url(/resources/user/hyoryeong/images/common/moMenu_sub_more_on2.png) no-repeat right 25px center;}
.menuMo > ul.menuMoCont > li > a {display:block;padding:20px 30px;font-size:18px;color:#000;font-weight:500;background:url(/resources/user/hyoryeong/images/common/moMenu_sub_more.png) no-repeat right 25px center;background-size:12px;border-bottom: 1px solid #ddd;}

.menuMo > ul.menuMoCont > li > a.active {background:#2c3e68 url(/resources/user/hyoryeong/images/common/moMenu_sub_more_on.png) no-repeat right 25px center;color:#fff;background-size:12px;}
.menuMo ul li > ul {}
.menuMo ul > li > div > ul > li {}
.menuMo ul li ul li a {display:block;padding:15px 30px;font-size:16px;color:#444;font-weight:400;border-top: 1px solid #e5e5e5;}
.menuMo ul li ul li ul li a {font-size:15px;padding: 15px 35px;}

.menuBackBg {display:none;width:100%;height:100%;position:fixed;background:rgba(0,0,0,0.5);left:0;top:0;z-index:8;}

@media screen and (max-width:768px){
  .menuMo_head {padding:80px 0 0;}
}
@media screen and (max-width:640px){
  .menuMo_head .menuMo_topMenu {padding: 15px 30px;}
  
  .menuMo > ul.menuMoCont > li > a {padding: 15px 30px;}
  .menuMo ul li ul li a {padding: 12px 30px;}
  .menuMo ul li ul li ul li a {padding: 12px 35px;}
}


/*-----------------------------------------------------------------------------
 *  Header
 *----------------------------------------------------------------------------*/

#header {position: fixed;top:0;left: 0;width: 100%; background:#fff;border-bottom: 1px solid #ddd; z-index: 5}
.hdr_top {border-bottom:1px solid #e5e5e5;}
.hdr_top .max_w {padding:20px 0;overflow:hidden; max-width: unset;}
.logo_top {position: absolute; top: 7px; left: 0;}
/* .util * {display: inline-block;vertical-align: middle;} */
.util {float:right;}
.topMenu,.zoomCtrl {margin-top: 13px; display: inline-block;vertical-align: middle;}
.topMenu *, .zoomCtrl * {display: inline-block;vertical-align: middle;} 
.topMenu li + li:before {content:'';display:inline-block;width:1px;height:12px;background:#ddd;margin:0 15px;vertical-align: middle;}
.zoomCtrl {border-radius:50px;background:#f6f6f6;padding:2px 10px;margin-left:30px;}
.zoomCtrl .default a {font-size:13px;color:#555;margin:0 3px;}
.z_in a,
.z_out a {font-size:0;width:20px;height:20px;background:url("/resources/user/hyoryeong/images/common/z_in.png") no-repeat center;}
.z_out a {background-image:url("/resources/user/hyoryeong/images/common/z_out.png");}

.hdr_bott {position: relative;}
.hdr_bott .max_w {height: 100%; box-sizing:border-box; max-width: unset; display: flex; justify-content: flex-end; align-items: center;}
.hdr_bott .srch_box {display: inline-flex; height: 50px; border: 1px solid #ccc; margin-right: 5px;}
.hdr_bott .srch_box .txt {padding: 0 15px; color: #333; background-color: #F5F5F5; display: flex; align-items: center; justify-content: center; border-right: 1px solid #ccc;}
.hdr_bott .srch_box input {border: none; padding: 8px 12px;}
.logo {position:absolute;width:240px;top:3%;left:0; display: none;}
.hdr_srch {margin-right: 5px;}
.hdr_srch a {display:block;width:60px;height:60px;border-radius:50%;background:#ee3f22 url("/resources/user/hyoryeong/images/common/srch.png") no-repeat center;font-size:0;}
.hdr_srch a:hover {background-color:#000;}
.hdr_srch.show_srch_modal{display:none;}
.hdr_site {}
.hdr_site a {display:block;width:60px;height:60px;border-radius:50%;background:#ee3f22 url("/resources/user/hyoryeong/images/common/siteMap.png") no-repeat center;font-size:0;}
.hdr_site a:hover {background-color:#000;}

/* 2021-12-02 추가 시작 */
#header .topMenu .lil_site {display: inline-flex; height: 25px; align-items: center;}
#header .topMenu .lil_site a {font-size: 16px; padding: 5px 10px; margin-right: 10px; background-color: #EF6C00; color: #fff; border-radius: 20px;}
#header .topMenu .lil_site a:hover {background-color: #cd5d01;}
/* 2021-12-02 추가 끝 */

/* 2022-03-10 추가 시작 */
#header dl{display: inline-flex; vertical-align: top;  align-items: center; text-align: right;}
#header dl dt{margin: 0 5px; font-size: 12px;}
#header dl dt b{display: block; line-height: 1.2; font-size: 20px; font-weight: 500; margin-bottom: 2px;}
#header dl dt b em{font-size: 13px;}
#header dl dd{margin: 0 5px;}
#header dl dd .icon{width: 50px; height: 50px; display: flex; justify-content: center; align-items: center; border-radius: 50%; padding: 5px;}
#header dl dd .icon img{max-width: 100%; max-height: 100%;}
#header dl dd .icon.navy{background-color: #2B283D;}
#header dl dd .icon.orange{background-color: #EF6C00;}
#header dl dd .icon.black{background-color: #444446;}
#header dl dd .icon.green{background-color: #57C0A9;}
#header dl dd .icon.blue{background-color: #0B9DD8;}
#header dl.rb dd{order: 1;}
#header dl.rb dt{order: 2; text-align: left;}
#header dl.minsun_logo {width: 250px; height: 42px;}
/* 2022-03-10 추가 끝 */

/* Gnb */
#gnb {width: 65%;}
.gnb_menu {display:flex;padding:28px 0;}
.gnb_menu > li {position:relative;width:25%;padding:0px 20px;text-align:center;box-sizing:border-box;}
.dep_1 a {font-size:20px;color:#333;}
.subMenu {position:absolute;height:auto;top:-25px;left:-16px;right: -16px;border-radius:10px;padding:20px;box-sizing:border-box;z-index:100;visibility: hidden;opacity: 0;box-shadow: 3px 6px 15px 0 rgba(0,0,0,0.15); transition:all 0.1s ease;}
.gnb_menu > li:nth-child(1) .subMenu {background:#FFAF38;}
.gnb_menu > li:nth-child(2) .subMenu {background:#DF7F23;}
.gnb_menu > li:nth-child(3) .subMenu {background:#81A320;}
.gnb_menu > li:nth-child(4) .subMenu {background:#71B4B5;}
.gnb_menu > li:nth-child(5) .subMenu {background:#306494;}
.gnb_menu > li:nth-child(6) .subMenu {background:#357584;}
.subMenu strong {display:block;text-align:center;font-size:22px;color:#fff;font-weight:500;padding:5px 0 25px;}
.subMenu li {text-align:left;margin:10px 0;}
.subMenu a {position: relative;display: block; font-size:16px;color:#fff;line-height:1.3;font-weight:300;word-break: break-all;}
.subMenu .dep_2 > a:after {content: "";position: absolute;right: 0;top:0;width: 20px; height: 20px;border-radius: 50%;background:#fff url("/resources/user/hyoryeong/images/common/z_in.png") no-repeat center center;}
.subMenu .dep_2 > a.active:after {background-image: url("/resources/user/hyoryeong/images/common/z_out.png");}
.subMenu ul li a:hover {text-decoration: underline;}
.gnb_menu > li:hover .subMenu {display:block;opacity: 1;visibility: visible;}
.subMenu ul li ul {padding:10px 15px;background:rgba(0,0,0,0.1);margin-top: 10px;border-radius: 5px;}
.subMenu ul li ul li {margin:5px 0;}
.subMenu ul li ul li a {display: block; font-size: 14px;}
.sub3dep {display: none;}

/* Mobile Menu Btn */

.nav-icon {display: none; position: fixed;top:22px;right:30px; width:60px;height:60px;padding:15px 17px;border-radius: 50%;border:1px solid #ee3f22; cursor: pointer;text-indent: -9999px; z-index: 10;}
.nav-icon:after, 
.nav-icon:before, 
.nav-icon div {background-color: #ee3f22;content: '';display: block;height:3px;margin:5px 0;-moz-transition: all .2s ease-in-out .3s;-webkit-transition: all .2s ease-in-out .3s;transition: all .2s ease-in-out .3s;}
.nav-icon div {width:70%;margin-left:30%;}
.nav-icon.on {background-color: #fff;border: none;}
.nav-icon.on:before {-moz-transform: translateY(8px) rotate(135deg);-webkit-transform: translateY(8px) rotate(135deg);transform: translateY(8px) rotate(135deg);}
.nav-icon.on:after {-moz-transform: translateY(-8px) rotate(-135deg);-webkit-transform: translateY(-8px) rotate(-135deg);transform: translateY(-8px) rotate(-135deg);}
.nav-icon.on div {-moz-transform: scale(0);-webkit-transform: scale(0);transform: scale(0);}

@media screen and (max-width:1430px){
  .gnb_menu > li {padding: 0px 15px;}
  .dep_1 a {font-size: 18px;}
  .subMenu {top: -20px;padding: 15px;}
  .subMenu strong {font-size: 18px;}
  .subMenu a {font-size: 14px;}
  .hdr_site {display: none;}
}
@media screen and (max-width:1240px){
  .hdr_bott .max_w {height: 103px; padding-right: 40px;}
  .hdr_top {display: none;}
  nav#gnb {display: none;}
  .hdr_bott .srch_box {top: 30px; right: 130px;}
  .logo {top: 50%; transform:translateY(-50%); display: block;}
  .logo a {display: flex; justify-content: center; align-items: center;}
  .nav-icon {display: block;}
}
@media screen and (max-width:960px){
  .hdr_srch {right:65px;}
  .hdr_bott .max_w {padding-right: 49px;}
  
}
@media screen and (max-width:768px){
    .hdr_bott .max_w {height: 79px; padding-right: 30px;}
    .hdr_bott .srch_box {height: 35px;}
    .hdr_bott .srch_box .txt {padding: 0 10px; font-size: 13px;}
    .hdr_bott .srch_box input {font-size: 13px;}
  .hdr_bott {height:100%;}
  .hdr_bott .srch_box {top: 15px; right: 105px;}
  .logo {width:200px;}
  .hdr_srch {right:45px;}
  .hdr_srch a {display: block;width: 46px;height: 46px;background-size: 18px auto;}
  
  .nav-icon {top:18px;right: 25px;width: 46px;height: 46px;padding:10px 12px;}
  .nav-icon:after, 
  .nav-icon:before, 
  .nav-icon div {margin: 4px 0;}
  .nav-icon div {width:70%;margin-left:30%;}
  .nav-icon.on:before {-moz-transform: translateY(7px) rotate(135deg);-webkit-transform: translateY(7px) rotate(135deg);transform: translateY(7px) rotate(135deg);}
  .nav-icon.on:after {-moz-transform: translateY(-7px) rotate(-135deg);-webkit-transform: translateY(-7px) rotate(-135deg);transform: translateY(-7px) rotate(-135deg);}
}
@media screen and (max-width:640px){
  .logo {width:180px;}
  .hdr_bott .srch_box {display:none;}
  .hdr_srch.show_srch_input {display:none;}
  .hdr_srch.show_srch_modal{display:block;}
  .hdr_srch {right:45px;}
  .hdr_srch a {width: 40px;height: 40px;background-size: 16px auto;}
  .hdr_site {display: none;}
  
  .nav-icon {top: 19px;right: 20px;width: 40px;height: 40px;padding: 9px 10px;}
  .nav-icon:after, 
  .nav-icon:before, 
  .nav-icon div {margin: 3px 0;}
  .nav-icon div {width:70%;margin-left:30%;}
  .nav-icon.on:before {-moz-transform: translateY(6px) rotate(135deg);-webkit-transform: translateY(6px) rotate(135deg);transform: translateY(6px) rotate(135deg);}
  .nav-icon.on:after {-moz-transform: translateY(-6px) rotate(-135deg);-webkit-transform: translateY(-6px) rotate(-135deg);transform: translateY(-6px) rotate(-135deg);}
}
@media screen and (max-width:480px){
  .hdr_bott .max_w {height: 69px; padding-right: 33px;}
  .hdr_bott .srch_box {top: 16px; right: 95px; height: 35px;}
  .logo {width:160px;}
  .hdr_site {display: none;}
  
  .nav-icon {top:15px;}
}


/*-----------------------------------------------------------------------------
 *  Search
 *----------------------------------------------------------------------------*/

.srchWrap {display:none;position:fixed;top:0;left:0;width:100%;height:100%;z-index:1000;}
.srchWrap.on {display:block;}
.srchWrap .inner {position:absolute;width:100%;max-width:1000px;top:50%;left:50%;transform:translate(-50%,-50%);padding:0 50px;}
.srchWrap .title {position: relative;margin-bottom:15px;}
.srchWrap h2 {font-size:34px;color:#fff;font-weight:500;}
.srchWrap .close {position: absolute;right: 0;top:6px; display: block;width: 30px;height: 30px;text-indent: -9999px;background:url("/resources/user/hyoryeong/images/common/modal_close.png") no-repeat center center;background-size: 26px auto;cursor: pointer;}
.srch {position:relative;height:100px;border:1px solid #ccc;padding-right:115px;box-sizing:border-box;}
.srch * {height:100%;}
.srch input {display:block;width:100%;border:none;padding:0 30px;background:none;font-size:28px;color:#fff;}
.srch button {width:115px;height:100%;position:absolute;top:0;right:0;background:url("/resources/user/hyoryeong/images/common/srch_2.png") no-repeat center;}
.srch input::-webkit-input-placeholder {font-size:28px;color:#aaa;}
.srch input:-ms-input-placeholder {font-size:28px;color:#aaa;}
.srch input::-moz-placeholder {font-size:28px;color:#aaa;}
.srch input:-moz-placeholder {font-size:28px;color:#aaa;}
.bg_back {background:rgba(0, 0, 0, 0.8);height:100%;}

@media screen and (max-width:768px){
  .srchWrap h2 {font-size: 28px;}
  .srch {height: 80px;padding-right: 80px;}
  .srch button {width: 80px;background-size: 30px auto;}
  .srchWrap .close {top: 6px;width: 26px;height: 26px;background-size:22px auto;}
}
@media screen and (max-width:640px){
  .srch {height: 60px;padding-right: 50px;}
  .srch input {padding:0 20px;font-size:24px;}
  .srch button {width:60px;background-size: 26px auto;}
  .srch input::-webkit-input-placeholder {font-size:20px;}
  .srch input:-ms-input-placeholder {font-size:20px;}
  .srch input::-moz-placeholder {font-size:20px;}
  .srch input:-moz-placeholder {font-size:20px;}
}
@media screen and (max-width:480px){
  .srchWrap .inner {padding: 0 30px;}
  .srchWrap h2 {font-size: 26px;}
  .srch input {padding: 0 15px;font-size: 22px;}
  .srch input::-webkit-input-placeholder {font-size:18px;}
  .srch input:-ms-input-placeholder {font-size:18px;}
  .srch input::-moz-placeholder {font-size:18px;}
  .srch input:-moz-placeholder {font-size:18px;}
  .srch button {width: 50px;background-size: 20px auto;}
}


/*-----------------------------------------------------------------------------
 *  Footer
 *----------------------------------------------------------------------------*/

.ftr_top {background:#394659;}
.ftr_top .max_w {display:flex;justify-content: space-between;}

.ftr_top .drop_title a {min-width:200px;height:50px;line-height:48px;padding:0 40px 0 20px;border:none;color:#888;background:none;}
.ftr_top .drop_title:hover a {color: #fff;}
.ftr_top .drop_title a:after {right:20px;top:20px;border:none;border-top:10px solid #6c6e70;border-left:5px solid transparent;border-right:5px solid transparent;transform: none;}
.ftr_top .drop_title.active a {border:none;color: #fff;}
.ftr_top .drop_title.active a:after {top:auto;}
.ftr_top .drop_sub {top: auto; bottom:1px;transform:translateY(100%);width: 100%;border: none; background:#272e3a;z-index: 1; box-sizing: border-box;}
.ftr_top .drop_sub li a {padding: 6px 20px;color: #999}
.ftr_top .drop_sub li a:hover {color:#fff;}

.ftr_top .drop_title,
.ftr_top .drop_title a {display:flex;align-items:center;height:100%;background:#272e3a;outline: none;}
.ftr_top .drop_title a:after {background:url("/resources/user/hyoryeong/images/common/arr.png") no-repeat center;border:none;width:13px;height:8px;top:50%;transform:translateY(-50%);}
.ftr_top .drop_title.active a:after {background-image:url("/resources/user/hyoryeong/images/common/arr_2.png");}

.ftr_menu {overflow:hidden;}
.ftr_menu li {float:left;margin-right:35px;padding:20px 0;}
.ftr_menu a {font-size:17px;color:#ddd;font-weight:300;}
.ftr_menu a:hover {color: #fff;}
.ftr_menu .policy a {color:#ffae00;}
.ftr_bott {background:#f6f6f6;}
.ftr_bott .max_w {display:flex;padding:70px 0;}
/* 푸터 가운데 정렬 21-12-07 수정 시작*/
.ftr_logo {width:360px;margin-right:10%;}
#footer .max_w {justify-content: center;}
.ftr_cont address {font-size:18px; color:#444;line-height:1.8;font-family: 'Noto Sans Korean';}
.copyright {font-size:14px;color:#666;letter-spacing:0;margin-top:10px;}
/* 푸터 가운데 정렬 21-12-07 수정 끝*/

@media screen and (max-width:1024px){
  .ftr_menu li {margin-right:25px;}
}
@media screen and (max-width:960px){
  .ftr_top .drop_down {margin-right: -40px;}
  .ftr_top .drop_title a {min-width: auto;padding: 0 50px 0 20px;}
  .ftr_menu li {margin-right:15px;}
  .ftr_menu a {font-size: 15px;}
}
@media screen and (max-width:768px){
  .ftr_top .max_w {display: block;}
  .ftr_menu {display: flex;padding-top: 10px;}
  .ftr_menu li {float: none; padding: 15px 10px;margin:0;text-align: center;}
  .ftr_top .drop_down {display: block; margin-right: 0;}
  .ftr_top .drop_title a {min-width: 100%;}
}
@media screen and (max-width:640px){
  .ftr_menu {display: block;padding:20px 0;}
  .ftr_menu li {position: relative;text-align: left;padding:3px 0 3px 10px;}
  .ftr_menu li:before {content: "";display: inline-block;position: absolute; left: 0; top:10px;width: 3px; height: 3px;background:#aaa;}
  .ftr_menu li a {font-size: 14px;}
  
  .ftr_bott .max_w {display: block;padding: 50px 0;}
  .ftr_logo {width: 140px;margin-right: 0;margin-bottom: 20px;}
  .ftr_cont address {font-size: 13px;line-height: 1.4;}
  .copyright {font-size: 11px;}
}
@media screen and (max-width:640px){
  .ftr_top .drop_title a {line-height: 44px;}
  .ftr_top .drop_sub li a {font-size: 13px;padding: 5px 20px;}
}


/*-----------------------------------------------------------------------------
 *  Right Side Quick
 *----------------------------------------------------------------------------*/

.side.quick{position:fixed; top:168px; right:0; width: 121px;border-left: 1px solid #e5e5e5; z-index: 10; height: 768px;}
.side.quick .quick_b{width: 100%; height: calc(100% - 105px); background-color: #fff; padding: 5px; overflow-y: auto;}
.side.quick .quick_b ul{display: flex; height: 100%; min-height: 540px; flex-direction: column; justify-content: space-between;}
.side.quick .quick_b ul li{text-align: center; padding:8px 0;}
.side.quick .quick_b ul li > a{display: block;}
.side.quick .quick_b ul li > a > div{display: inline-flex; justify-content: center; align-items: center; padding: 10px; width: 65px; height: 65px; border-radius: 20px; background-color: #86A5DB; margin-bottom: 6px; position: relative; top: 0; transition: all .25s ease-in;}
.side.quick .quick_b ul li > a > div img{max-height: 100%; max-width: 100%;}
.side.quick .quick_b ul li > a > p{font-size: 15px; font-weight: 500; line-height: 1.2;}
.side.quick .quick_b ul li:nth-of-type(1) > a > div{background-color: #86A5DB;}
.side.quick .quick_b ul li:nth-of-type(2) > a > div{background-color: #95AF37;}
.side.quick .quick_b ul li:nth-of-type(3) > a > div{background-color: #3FB0D8;}
.side.quick .quick_b ul li:nth-of-type(4) > a > div{background-color: #D83D7A;}
.side.quick .quick_b ul li:nth-of-type(5) > a > div{background-color: #2B9383;}
.side.quick .quick_b ul li:nth-of-type(6) > a > div{background-color: #9265CA;}
/* hover */
.side.quick .quick_b ul li > a:hover > div{ top: -10px; box-shadow: 2px 2px 5px rgba(0, 0, 0, .1); transition: all .25s ease-out;}
/* sub */
.side.quick.sub_q{}
.side.quick.sub_q .quick_b{border-left: 1px solid #ccc; background-color: #fff;}


.side.quick .topBtn{width: 100%; height: 75px;}
.side.quick .topBtn > a{display: block; width: 100%; height: 100%; padding: 5px ; background-color: #42495C; background-image: url('https://www.hyotown.or.kr/resources/user/hyoryeong/images/common/ic_top_btn.png'); background-repeat: no-repeat; background-position: center top 15px; text-align: center; padding-top: 40px; color: #fff; font-size: 14px; font-weight: 500; letter-spacing: 0; transition: all .25s ease;}
.side.quick .topBtn > a:hover{background-color: #2e3444;}

@media screen and (max-width: 1640px) {
	.side.quick{display: none !important;}
}


/********************************************************
 
 *  Main
 
 ********************************************************/

/*-----------------------------------------------------------------------------
 *  Visual
 *----------------------------------------------------------------------------*/

#visual {padding-top:154px;height: 100vh;}
.slogan {position:absolute;top:25%;width:100%;padding: 0 30px; text-align:center;}
.slogan strong {display:block;font-size:70px;color:#222;line-height:1.2;}
.slogan strong span {color:#f15e37;display:block;}
.slogan p {max-width:510px;margin:0 auto;font-size:26px;line-height:36px;color:#000;margin-top:20px;}

.vs_slide1 {height: 100%;}
.vs_slide1 .swiper-slide .imgBox {height: 100%;background-position: center center;background-repeat: no-repeat;background-size: cover;}
.vs_slide1 .swiper-slide-prev .imgBox,
.vs_slide1 .swiper-slide-active .imgBox,
.vs_slide1 .swiper-slide-duplicate-active .imgBox {animation-name: zoom;animation-duration: 6s;animation-fill-mode: forwards;}
.vs_slide1 .slide_ctrl {position:absolute;top:70%;left:50%;transform:translateX(-50%);z-index:100;}
.vs_slide1 .slide_ctrl .inner {position: relative;padding-right:35px;}
.vs_slide1 .swiper-pagination {position:static;}
.vs_slide1 .swiper-pagination-bullet {width:12px;height:12px;background:#000;margin:0 10px !important;transition: width 0.3s ease;}
.vs_slide1 .swiper-pagination-bullet-active {width:40px;border-radius:30px;background:#e62525;}
.vs_slide1 .ctrl_btn {position:absolute;top:50%;right:0;width:24px;height:24px;border-radius:50%;transform:translateY(-50%);border:1px solid #000;background:url("/resources/user/hyoryeong/images/main/stop.png") no-repeat center;cursor:pointer;box-sizing:border-box;}
.vs_slide1 .ctrl_btn.start-autoplay {background-image: url("/resources/user/hyoryeong/images/main/play.png");}
.dpnone {display: none;}

@keyframes zoom {
    from {
        transform: scale(1.05);
    }
    to {
        transform: scale(1);
    }
}

@media screen and (max-width:1240px){
/* 	230628 */
  #visual {padding-top: 104px;}
/* 	// 230628 */
	
}
@media screen and (max-width:960px){
  .slogan strong {font-size:60px;}
  .slogan p {font-size: 22px;line-height: 1.5;}
  .vs_slide1 .slide_ctrl {top: 60%;}
}
@media screen and (max-width:768px){
  #visual {padding-top: 80px;height: 800px;}
}
@media screen and (max-width:640px){
  #visual {height: 700px;}
  .vs_slide1 .slide_ctrl {top: 65%;}
  .slogan strong {font-size:46px;}
  .slogan p {font-size: 20px;}
}
@media screen and (max-width:480px){
  #visual {padding-top: 70px;height: 550px;}
  .slogan strong {font-size:36px;}
  .slogan p {font-size:18px;}
  .vs_slide1 .slide_ctrl {top: 70%;}
  .vs_slide1 .swiper-pagination-bullet {width: 10px;height: 10px;margin:0 8px !important;}
  .vs_slide1 .swiper-pagination-bullet-active {width: 20px;}
}


/*-----------------------------------------------------------------------------
 *  Container
 *----------------------------------------------------------------------------*/

.mCont {background-position:center;background-repeat:no-repeat;background-size:cover;}
.mCont .max_w {padding:140px 0;display: flex;justify-content: space-between;flex-wrap:wrap;}
.mCont .max_w > div {position:relative;}
.mCont_tit {position:absolute;top:-5px;left:0;display: flex;width:100%;align-items:center;justify-content: space-between;}
.mCont_tit h2 {font-size:28px;color:#000;font-weight:500;}
.mCont_tit a {display:inline-block;font-size:16px;color:#444;padding-right:20px;background:url("/resources/user/hyoryeong/images/main/btn_more.png") no-repeat right center;text-align:center;}

@media screen and (max-width:960px){
.mCont .max_w {padding:100px 0;display: block;}
.mCont_tit {position:absolute;top:-5px;left:0;display: flex;width:100%;align-items:center;justify-content: space-between;}
.mCont_tit h2 {font-size:28px;color:#000;font-weight:500;}
}
@media screen and (max-width:640px){
  .mCont_tit h2 {font-size: 25px;}
  .mCont_tit a {font-size: 15px;line-height: 16px; padding-right: 15px; background-size:8px auto;}
}
@media screen and (max-width:640px){
.mCont .max_w {padding:60px 0;}
.mCont_tit h2 {font-size: 22px;}
}


/********************************************************
 
 *  Sub
 
 ********************************************************/

/*-----------------------------------------------------------------------------
 *  Sub Visual
 *----------------------------------------------------------------------------*/

#sub_visual {margin-top: 154px; background-position: center;background-repeat: no-repeat;background-size:cover;}
#sub_visual .max_w {padding:130px 0;}
#sub_visual h2 {font-size:56px;margin-bottom:10px;}
#sub_visual p {font-size:25px;}

/* Page Navigation */

#pgNav {position:absolute;top:-35px;left:0;width:100%;z-index:1;}
#pgNav .inner {position:relative;padding-left:75px;box-sizing:border-box;}
#pgNav .btn_home {position:absolute;top:0;left:0;box-shadow:5px 5px 20px rgba(0, 0, 0, 0.1);}
#pgNav .btn_home a {display:block;width:70px;height:70px;border-radius:6px;background:#f57f16 url("/resources/user/hyoryeong/images/sub/home.png") no-repeat center;font-size:0;}
#pgNav .btn_home a:hover {background-color:#ca5100;}
#pgNav .dep1 {display: none;}
#pgNav .pgNavTit {display: none;height: 70px;line-height: 70px;background:#fff;border-radius: 6px;box-shadow:5px 5px 20px rgba(0, 0, 0, 0.1);border:1px solid #ee3f22;}
#pgNav .pgNavTit a {position: relative;display: block;padding:0 20px;font-size: 18px;color: #222;}
#pgNav .pgNavTit a:after {content: '';display: block;position: absolute;right: 20px;top: 25px;width: 10px;height: 10px;border: 1px solid #222;border-width: 0 1px 1px 0;transform: rotate(45deg);transition: all 0.3s ease;}
#pgNav .pgNavTit.active a:after {transform: rotate(225deg);top: 30px;}
#pgNav ol {display: -ms-flexbox; display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;width:100%;background:#fff;border-radius:6px;box-shadow:5px 5px 20px rgba(0, 0, 0, 0.1);overflow:hidden;}
/* 20211121 수정 */
#pgNav ol li {flex:auto;height: 70px;text-align: center; }
/* 여기까지 20211121 수정 */
#pgNav li + li {border-left:1px solid #ddd;box-sizing:border-box;}
#pgNav li.current {background:#ee3f22;}
#pgNav li a {display: flex;justify-content: center; width: 100%; height: 100%;align-items: center; text-align:center;line-height:1.3;font-size:18px;color:#000;padding:0 10px;box-sizing:border-box;}
#pgNav li.current a {color:#fff;}

@media screen and (max-width:1400px){
  #pgNav li a {font-size: 16px;}
}
@media screen and (max-width:1240px){
  #sub_visual {margin-top: 110px;}
}
/* 20211121 수정 */
@media screen and (max-width:1280px){
  #pgNav .inner {padding-left: 70px;}
  #pgNav .pgNavUl {display:flex;}
  #pgNav .pgNavUl li {width: 49.5%;margin-left: 0.5%;}
  #pgNav .pgNavUl .dep1 {display: block;}
  #pgNav .pgNavTit {display: block;}
  #pgNav .pgNavTit a {text-align: left;line-height: 69px;}
  #pgNav ol {display: none;border-radius: 6px;border:1px solid #ddd;margin-top: -1px;}
  #pgNav ol li {border-left: none !important;width:100% !important;margin: 0 !important;height: auto;text-align: left;border-bottom: 1px solid #e5e5e5;}
  #pgNav ol li a {justify-content: flex-start;padding:15px 20px;text-align: left;}
}
@media screen and (min-width:1281px){
  #pgNav .pgNavUl .dep2 {display: flex !important;border-left: none;}
  #pgNav .pgNavUl .dep2 ol {display: flex !important;}
}
/* 여기까지 20211121 수정 */
@media screen and (max-width:960px){
  #sub_visual .max_w {padding: 120px 0;}
  #sub_visual h2 {font-size: 50px;}
  #sub_visual p {font-size: 22px;}
}
@media screen and (max-width:768px){
  #sub_visual {margin-top:80px;}
  #sub_visual .max_w {padding: 100px 0;}
  
  #pgNav {top: -27px;}
  #pgNav .inner {padding-left: 55px;}
  #pgNav .btn_home a {width: 54px; height: 54px;background-size: 20px auto;}
  #pgNav li {height: 54px;}
  #pgNav .pgNavTit {height: 54px;}
  #pgNav .pgNavTit a {line-height: 53px;}
  #pgNav .pgNavTit a:after {top: 18px;width:8px;height: 8px;}
  #pgNav .pgNavTit.active a:after {top: 24px;}
}
@media screen and (max-width:640px){
  #sub_visual h2 {font-size: 44px;margin-bottom: 5px;}
  
  #pgNav .inner {padding-left: 0;}
  #pgNav .btn_home {display: none;}
  #pgNav li {height: 50px;}
  #pgNav .pgNavTit {height: 50px;line-height: 49px;}
  #pgNav .pgNavUl li:first-child {margin-left: 0;}
  #pgNav .pgNavTit a {font-size: 16px;padding:0 15px;}
  #pgNav .pgNavTit a:after {right: 15px;}
  #pgNav ol li a {padding: 10px 15px; font-size: 15px;}
}
@media screen and (max-width:480px){
  #sub_visual {margin-top:70px;}
  #sub_visual .max_w {padding: 50px 0 60px;}
  #sub_visual h2 {font-size: 34px;}
  #sub_visual p {font-size: 17px;}
  
  #pgNav li {height: 46px;}
  #pgNav .pgNavTit {height: 46px;line-height: 45px;}
  #pgNav .pgNavTit a {font-size: 14px;padding: 0 10px;line-height: 45px;}
  #pgNav .pgNavTit a:after {right: 10px;width: 6px; height: 6px;}
  #pgNav .pgNavTit.active a:after {top: 20px;}
  #pgNav ol li a {font-size: 13px;padding: 10px;}
}


/*-----------------------------------------------------------------------------
 *  Sub Content
 *----------------------------------------------------------------------------*/

.content {padding:130px 0;}

/* Titles */

.page_tit {text-align:center;margin-bottom:50px;}
.page_tit span {position:relative;font-size:48px;color:#222;}
.page_tit span:after {position:absolute;content:'';display:block;width:10px;height:10px;border-radius:50%;background:#f6571f;bottom:8px;;right:-20px;}
/* 20211121 추가함. */
.icon_tit {font-size:30px;color:#222;background:url("/resources/user/hyoryeong/images/sub/icon_tit.png") no-repeat 0 center;padding-left:30px;margin:80px 0 50px;box-sizing:border-box;}

/* sub tab */
.tab_sub_in_wrap{width: 100%; margin-bottom: 63px;}
.tab_sub_in{width: 100%; border-bottom: 2px solid #EE3F22; display: flex; margin-bottom: -2px;}
.tab_sub_in > li{border: 1px solid #ddd; margin: 0px 0 -2px -1px; border-bottom: 2px solid #EE3F22; position: relative; z-index: 0;}
.tab_sub_in > li > a{font-size: 20px; color: #666; padding: 15px 20px; display: block; word-break: keep-all;}
.tab_sub_in > li.active{border: 2px solid #EE3F22; border-bottom-color: #fff; position: relative; z-index: 0;}
.tab_sub_in > li.active a{color: #EE3F22; font-weight: 500;}


.tab_sub_in2_wrap{width: 100%; margin-bottom: 30px;}
.tab_sub_in2{display: flex; flex-wrap: wrap;}
.tab_sub_in2 > li{flex: 1; border: 1px solid #ddd; margin: 0px 0 -1px -1px; min-width: 200px;border-radius: 6px;}
.tab_sub_in2 > li > a{font-size: 20px; color: #666; padding: 15px 40px; display: block; text-align: center;}
.tab_sub_in2 > li.active{background-color: #EE3F22;}
.tab_sub_in2 > li.active a{color: #fff; font-weight: 500;}


/* text */
.dot_bullet{font-size: 22px; font-weight: 500; color: #222; min-height: 25px; background: url('/resources/user/hyoryeong/images/common/ic_bullet_3.png') no-repeat left top 5px; padding-left: 32px; margin-bottom: 15px;}
.dot_bullet.mgB{margin-bottom: 30px;}
/* 230628 */
.squere_bullet{font-size: 20px; padding-left: 25px; color: #222; margin-bottom: 10px; background: url('/resources/user/hyoryeong/images/common/ic_bullet_squre.png') no-repeat left top 2px; font-weight: 500; margin-top: 30px;}
/* // 230628 */


.dot_txt{font-size: 18px; margin-bottom: 10px; color: #222; line-height: 1.7; padding-left: 15px; position: relative;}
.dot_txt::before{content: ""; width: 5px; height: 5px; border-radius: 50%; background-color: #222; position: absolute; left : 0; top : 12px;}
.txt_1{font-size: 18px; margin-bottom: 10px; color: #222; line-height: 1.7;}
.txt_2{font-size: 16px; color: #333; line-height: 1.7;}
.txt_line{padding-left: 20px; position: relative; font-size: 18px; line-height: 1.8; margin-bottom: 10px;}


.t_orange{color: #EE3F22 !important;}

.t_sm{font-size: 0.93em !important;}

.imgBgCenter {text-align: center;background:#f8f8f8;padding:80px 20px;margin-bottom: 50px;}

/* 여기까지 20211121 추가함. */

@media screen and (max-width:960px){
  .page_tit span {font-size:44px;}
  
  /* 20211121 추가함. */
  .icon_tit {font-size:30px;padding-left:25px;margin:50px 0 30px;}
  /* 여기까지 20211121 추가함. */
}
@media screen and (max-width:768px){
  .content {padding: 100px 0 120px}
  
  .page_tit span {font-size: 40px;}
  
  /* 20211121 추가함. */
  /* Sub Tab */
  .tab_sub_in_wrap{margin-bottom: 40px;border-radius: 6px;border-top:1px solid #ddd;border-bottom: none; border-left:1px solid #ddd;overflow: hidden;}
  .tab_sub_in{border-bottom: none; margin-bottom: 0px; flex-wrap: wrap;}
  .tab_sub_in > li{width: 50%; text-align: center;background:#f6f6f6;border:1px solid #ddd;margin:-1px 0 0 -1px;}
  .tab_sub_in > li > a{font-size:15px; padding:10px 5px;}
  .tab_sub_in > li.active{background: #EE3F22;border: none;}
  .tab_sub_in > li.active a {color: #fff;}

  .tab_sub_in2_wrap{margin-bottom: 30px;}
  .tab_sub_in2 > li{min-width: 33.33%;}
  .tab_sub_in2 > li > a{font-size: 15px; padding: 10px 10px;}
  
  .imgBgCenter {padding: 40px 20px;}
  /* 여기까지 20211121 추가함. */
}
@media screen and (max-width:640px){
  .content {padding: 80px 0 100px;}
  
  .page_tit {margin-bottom: 40px;}
  
  /* 20211121 추가함. */
  .icon_tit {font-size:26px;padding-left:20px;background-size: 14px auto;}
  /* 여기까지 20211121 추가함. */
}
@media screen and (max-width:480px){
  .content {padding: 60px 0 100px;}
  
  .page_tit {margin-bottom: 30px;}
  .page_tit span {font-size:30px;}
  .page_tit span:after {width:8px;height: 8px;bottom:6px;right: -15px;}
  
  /* 20211121 추가함. */
  .icon_tit {font-size:22px;margin:40px 0 20px;}
  /* 여기까지 20211121 추가함. */
}


/********************************************************
 
 *  Table
 
 ********************************************************/

/*-----------------------------------------------------------------------------
 *  Row Table
 *----------------------------------------------------------------------------*/



/*-----------------------------------------------------------------------------
 *  Column Table
 *----------------------------------------------------------------------------*/

/********************************************************
 
 *  Button Set
 
 ********************************************************/



/********************************************************
 
 *  Board
 
 ********************************************************/


/*-----------------------------------------------------------------------------
 *  Board List
 *----------------------------------------------------------------------------*/



/*-----------------------------------------------------------------------------
 *  Search Bar
 *----------------------------------------------------------------------------*/



/*-----------------------------------------------------------------------------
 *  Pagination
 *----------------------------------------------------------------------------*/


/*-----------------------------------------------------------------------------
 *  Board View
 *----------------------------------------------------------------------------*/

/* 20211121 추가 */

/*************************************************************************************************
 
 *  Form Layout
 
**************************************************************************************************/


.txt_nor{height: 50px; border: 1px solid #ddd; padding: 0 20px; font-size: 16px; vertical-align: middle; margin: 5px;}

.txt_nor.sm{height: 40px;}
.txt_nor.md{height: 50px;}
.txt_nor.lg{height: 83px;}


.select_nor{height: 50px; border: 1px solid #ddd; padding-left: 20px; font-size: 16px; vertical-align: middle; margin: 5px;}

.select_nor.sm{height: 40px;}
.select_nor.md{height: 50px;}
.select_nor.lg{height: 83px;}


.txtarea_nor{height: 200px; border: 1px solid #ddd; padding: 20px; font-size: 16px; vertical-align: middle; margin: 5px;}

.td_line{display: inline-block; vertical-align: middle; font-size: 15px; padding: 0 10px;}
.td_line b{color: #F79600;}

.w10{width: 10%;}
.w20{width: 20%;}
.w30{width: 30%;}
.w40{width: 40%;}
.w50{width: 50%;}
.w60{width: 60%;}
.w70{width: 70%;}
.w80{width: 80%;}
.w90{width: 90%;}
.w100{width: 100%;}

.wEmail{width: 300px;}
.wPhone{width: 150px;}



@media screen and (max-width: 900px) {
	.txt_nor{height: 40px; font-size: 14px;}

	.txt_nor.sm{height: 38px;}
	.txt_nor.md{ height: 40px;}
	.txt_nor.lg{height: 50px;}


	.select_nor{height: 40px; font-size: 14px;}

	.select_nor.sm{height: 38px;}
	.select_nor.md{height: 40px;}
	.select_nor.lg{height: 50px;}


	.txtarea_nor{height: 150px; font-size: 14px;}

	.td_line{font-size: 13px; padding: 0 5px;}


	.w10{width: 50%;}
	.w20{width: 50%;}
	.w30{width: 100%;}
	.w40{width: 100%;}
	.w50{width: 100%;}
	.w60{width: 100%;}
	.w70{width: 100%;}
	.w80{width: 100%;}
	.w90{width: 100%;}
	.w100{width: 100%;}

	.wEmail{width: 100%;}
	.wPhone{width: 76px;}
}


/* 자동등록방지 */
.autoNo_box{display: inline-flex; width: 290px; height: 83px; vertical-align: middle; border: 1px solid #ddd;}
.autoNo_box img{max-width: 100%; max-height: 100%;}
.autoNo_box .img_b{width: calc(100% - 40px); display: flex; align-items: center; justify-content: center;}
.autoNo_box .btn_b{width: 40px; border-left: 1px solid #ddd;}
.autoNo_box .btn_b button{width: 100%; height: 50%; background-color: #eee; padding: 10px; border-bottom: 1px solid #ddd;}
.autoNo_box .btn_b button:last-of-type{border-bottom: none;}

@media screen and (max-width: 900px) {
	.autoNo_box{width: 100%; height: 60px; margin: 5px;}
	.autoNo_box .img_b{width: calc(100% - 40px);}
	.autoNo_box .btn_b{width: 40px;}
	.autoNo_box .btn_b button{padding: 6px;}

}


/*************************************************************************************************

*  Button Layout

**************************************************************************************************/

.btn_nor{text-align: center; font-size: 16px; color: #111; background-color: #ddd; display: inline-block; vertical-align: middle; padding: 10px 20px; transition: all .25s ease;}

.btn_nor.md{min-width: 130px; height: 54px; font-size: 18px;}
.btn_nor.lg{min-width: 248px; height: 75px; font-size: 18px; font-weight: 500;}

.btn_nor.gray{background-color: #EDEDED; border-color: #EDEDED;}
.btn_nor.gray:hover{background-color: #ddd;}
.btn_nor.orange{background-color: #EE3F22;}
.btn_nor.o_line{border:2px solid #EE3F22; color: #EE3F22; background-color: #fff;}
.btn_nor.o_line:hover{background-color: #EE3F22; color: #fff;}
.btn_nor.g_line{border:1px solid #ccc; color: #333; background-color: #fff;}
.btn_nor.g_line:hover{background-color: #333; border-color: 333; color: #fff;}


@media screen and (max-width: 1000px) {
	.btn_nor{font-size: 14px;}
	
	.btn_nor.md{min-width: 80px; height: 38px;font-size: 14px;padding:5px 20px;}
	.btn_nor.lg{min-width: 100px; height: 55px; font-size: 16px;}
}

/* 여기까지 20211121 추가 */