@charset "utf-8";
/* CSS Document */

/* version 20220302 */

body { background-color:#ffffff; font-family:'Nanum Gothic'}

@media only screen and (max-width:1300px) and (min-width:681px) { 
/*본문 스타일 시작 */

.blind_tab { display: none;}

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

/* header layout */
#header { width:100%; height:80px; position:fixed; top:0; z-index:20; }
#header .top_line { display: none;}
#header .gnb { width:100%; height:80px; margin:0 auto; position:relative; background-color:#2a3865;}
#header .gnb .top_logo { width:300px; height:50px; top:50%; margin-top:-25px; left:15px; position:absolute; }
#header .gnb .top_logo a { width:300px; height:50px; background:url(../../resources/images/logo_mo.png); background-size:cover; display:block;}

#header .gnb .left_link {top:0; left:0; position:absolute;}
#header .gnb .left_link li { height:50px;}
#header .gnb .left_link li a { height:50px; display:block; padding:0 20px; font-size:15px; text-align:center; color:#ffffff !important; line-height:50px; background-color:#243c70;}
#header .gnb .sitemap_btn {display:none;}
#header .gnb .spot { display: none;}

#smaplayer { display:none;}
#smaplayer .sitemap_area{ display:none;}

/* admin login */
.admin_btn { width:20px; height:20px; z-index:999; display:block; position:fixed; top:0; left:0; cursor:default;}

#admin_login  { width:100%; position: relative;}
#admin_login .login_box { width:500px; border:1px solid #c5c5c5; box-sizing: border-box; padding:30px; position: absolute; top:50%; margin-top:-200px; left:50%; margin-left:-250px;}
#admin_login .login_box .input_wrap {width:100%;}
#admin_login .login_box .input_wrap li { width:100%; height:50px; margin:20px 0;}
#admin_login .login_box .input_wrap li input { width:100%; height:50px; border-top:none; border-left:none ; border-right:none; background-color:#ffffff !important; border-bottom: 1px solid #535353 !important; font-size:20px ; text-indent:15px; border-radius:0 !important;}
#admin_login .login_box .input_wrap .btn_ok { width:100%; height:70px;}
#admin_login .login_box .input_wrap .btn_ok .btn_login:link,
#admin_login .login_box .input_wrap .btn_ok .btn_login:active,
#admin_login .login_box .input_wrap .btn_ok .btn_login:visited { width:100%; height:60px; text-align:center; line-height:60px; color:#ffffff; background-color:#ef5660; display:block; font-size:25px; font-weight:800;}
#admin_login .login_box .input_wrap .btn_ok .btn_login:hover { color:#ffffff; background-color:#182c54;}
#admin_login .login_box .input_wrap .btn_reset { width:100%; text-align:right; font-size: 15px; line-height:25px;}

#admin_login .login_box .input_wrap .admin_ck { width:100%; height:50px; position: relative; line-height:50px; background-color:#f3f3ed; text-indent:10px;}
#admin_login .login_box .input_wrap .admin_ck .ip_ck { width:25px !important; height:25px !important; position: absolute; top:12px; right:10px;}


/* passward change */

#pwchange  { width:100%; height:100%; position: relative;}
#pwchange .change_box { width:500px; border:1px solid #c5c5c5; box-sizing: border-box; padding:30px; position: absolute; top:50%; margin-top:-200px; left:50%; margin-left:-250px;}
#pwchange .change_box .login_logo { width:300px; height:50px; background:url(../../resources/images/logo_admin.png); background-size:cover; display:block; margin:0 auto; margin-bottom:20px !important;}
#pwchange .change_box .input_wrap {width:100%;}
#pwchange .change_box .input_wrap li { width:100%; height:50px; margin:20px 0;}
#pwchange .change_box .input_wrap li input { width:100%; height:50px; border-top:none; border-left:none ; border-right:none; background-color:#ffffff !important; border-bottom: 1px solid #535353 !important; font-size:20px ; text-indent:15px; border-radius:0 !important;}
#pwchange .change_box .input_wrap .btn_ok { width:100%; height:70px;}
#pwchange .change_box .input_wrap .btn_ok .btn_check:link,
#pwchange .change_box .input_wrap .btn_ok .btn_check:active,
#pwchange .change_box .input_wrap .btn_ok .btn_check:visited { width:100%; height:60px; text-align:center; line-height:60px; color:#ffffff; background-color:#2e8be2; display:block; font-size:25px; font-weight:800;}
#pwchange .change_box .input_wrap .btn_ok .btn_check:hover { color:#ffffff; background-color:#182c54;}
#pwchange .change_box .input_wrap .btn_ok .btn_next:link,
#pwchange .change_box .input_wrap .btn_ok .btn_next:active,
#pwchange .change_box .input_wrap .btn_ok .btn_next:visited { width:100%; height:60px; text-align:center; line-height:60px; color:#ffffff; background-color:#ef5660; display:block; font-size:25px; font-weight:800;}
#pwchange .change_box .input_wrap .btn_ok .btn_next:hover { color:#ffffff; background-color:#811c23;}


/* menu navi */
#navi { display: none;}

#header .gnb .navMobile{display:block;}
#header .gnb .navMobile button.navOpen{position:absolute; width:50px; height:50px; top:15px; right:15px; margin:0; padding:0; background:transparent; cursor:pointer;}
/*#header .gnb .navMobile button.navOpen span{display:block; width:100%; height:100%; background:url('../images/ico_nav_open.png') no-repeat center center; background-size:100%; font-size:0; opacity:1;}*/
#header .gnb .navMobile button.navOpen span{display:block; position:relative; width:20px; height:2px; margin:0 auto; background:#fff; font-size:0;}
#header .gnb .navMobile button.navOpen span:before, #header .gnb .navMobile button.navOpen span:after{content:''; display:block; position:absolute; width:20px; height:2px; background:#fff;}
#header .gnb .navMobile button.navOpen span:before{top:-6px;}
#header .gnb .navMobile button.navOpen span:after{bottom:-6px;}
#header .gnb .navMobile button.navOpen:focus span, #header .gnb .navMobile button.navOpen:hover span{}
#header .gnb .navMobile .navPanel button.navClose{position:absolute; width:50px; height:50px; top:15px; right:15px; margin:0; padding:0; background:#961420; cursor:pointer;}
/*#header .gnb .navMobile .navPanel button.navClose span{display:block; width:100%; height:100%; background:url('../images/ico_nav_close.png') no-repeat center center; background-size:100%; font-size:0; opacity:1;}*/
#header .gnb .navMobile .navPanel button.navClose span{display:block; position:relative; width:20px; height:2px; margin:0 auto; background:transparent; font-size:0;}
#header .gnb .navMobile .navPanel button.navClose span:before, #header .gnb .navMobile .navPanel button.navClose span:after{content:''; display:block; position:absolute; width:20px; height:2px; background:#fff;}
#header .gnb .navMobile .navPanel button.navClose span:before{top:-6px; transform:translate3d(0,6px,0) rotate(45deg);}
#header .gnb .navMobile .navPanel button.navClose span:after{bottom:-6px; transform:translate3d(0,-6px,0) rotate(-45deg);}
#header .gnb .navMobile .navPanel button.navClose:focus span, #header .gnb .navMobile .navPanel button.navClose:hover span{}
#header .gnb .navMobile .navPanel button.navClose:after{content:''; clear:both; display:block;}
#header .gnb .navMobile .navPanel{display:block; position:fixed; width:100%; height:100%; top:0; right:-100%; background:transparent; overflow-y:auto; overflow:hidden; opacity:0; transition:opacity .3s ease-in-out; z-index:-1;}
#header .gnb .navMobile .navPanel.open{right:0; opacity:1; z-index:0;}
#header .gnb .navMobile .navPanel .menuArea{position:fixed; width:48%; height:100%; right:-100%; box-shadow:-4px 0 20px rgba(0,0,0,.1); overflow:hidden; transition:right .3s, opacity .2s ease-in-out;}
#header .gnb .navMobile .navPanel.open .menuArea{right:0;}
#header .gnb .navMobile .navPanel .menuArea .menuList { height: 100%;}
#header .gnb .navMobile .navPanel .menuArea .menuList, 
#header .gnb .navMobile .menuArea .menuList ul, 
#header .gnb .navMobile .menuArea .menuList ul li, 
#header .gnb .navMobile .menuArea .menuList ul li a{display:block; position:relative; line-height:1; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}
#header .gnb .navMobile .navPanel .menuArea .menuList{height:calc(100%); background:#961420; color:#fff; z-index:0; overflow-y:auto; padding-top:80px;}
#header .gnb .navMobile .navPanel .menuArea .menuList ul ul{display:none;}
#header .gnb .navMobile .navPanel .menuArea .menuList > ul > li.active > ul{display:block;}
#header .gnb .navMobile .navPanel .menuArea .menuList > ul > li > a{padding:20px 42px 20px 20px; background:#ce1c2e; border-bottom:1px solid #d35662; color:#ffffff; font-size:1.2rem; cursor:pointer; z-index:2;}
#header .gnb .navMobile .navPanel .menuArea .menuList > ul > li > a:focus, #header .gnb .navMobile .menuArea .menuList > ul > li > a:hover{color:#ffffff;}
#header .gnb .navMobile .navPanel .menuArea .menuList > ul > li.hasSub > a:after{content:''; display:block; position:absolute; top:50%; right:18px; width:17px; height:9px; margin-top:-4.5px; background:url('../../resources/images/ico_plus_01.png') no-repeat center center; background-size:100%; z-index:5;}
#header .gnb .navMobile .navPanel .menuArea .menuList > ul > li.hasSub.open > a{color:#961420; font-weight:500; background-color:#ffffff;}
#header .gnb .navMobile .navPanel .menuArea .menuList > ul > li.hasSub.open > a:after{background:url('../../resources/images/ico_minus_01.png') no-repeat center center; background-size:100%;}
#header .gnb .navMobile .navPanel .menuArea .menuList ul ul li a{padding:15px 42px 15px 22px; background:#f3f3f3; border-bottom:1px solid #eee; color:#333; font-size:1rem; cursor:pointer; z-index:2;}
#header .gnb .navMobile .navPanel .menuArea .menuList ul ul ul li a{position:relative; padding-left:32px; background:#c8cacb; border-bottom:1px solid #bbbebf; color:#555; font-size:1rem;}
#header .gnb .navMobile .navPanel .menuArea .menuList ul ul ul li a:before{content:''; display:block; position:absolute; top:50%; left:24px; width:2px; height:2px; background:#4e3d32; border-radius:2px;}
#header .gnb .navMobile .navPanel .menuArea .menuList ul ul li a:focus, #header .gnb .navMobile .navPanel .menuArea .menuList ul ul li a:hover{color:#000;}
#header .gnb .navMobile .navPanel .menuArea .menuList ul ul > li.hasSub > a:after{content:''; display:block; position:absolute; top:50%; right:21px; width:11px; height:11px; margin-top:-5.5px; background:url('../../resources/images/ico_plus_02.png') no-repeat center center; background-size:100%; z-index:5;}
#header .gnb .navMobile .navPanel .menuArea .menuList ul ul > li.hasSub.open > a{font-weight:500;}
#header .gnb .navMobile .navPanel .menuArea .menuList ul ul > li.hasSub.open > a:after{background:url('../../resources/images/ico_minus_02.png') no-repeat center center; background-size:100%;}
#header .gnb .navMobile .navPanel .menuArea .menuList ul ul ul ul li a{position:relative; padding-left:34px; background:#c8cacb; border-bottom:none; color:#676767; font-size:0.75rem;}
#header .gnb .navMobile .navPanel .menuArea .menuList ul ul ul ul li a:before{content:''; display:block; position:absolute; top:50%; left:28px; width:2px; height:2px; background:#777;}
#header .gnb .navMobile .navPanel .menuArea .menuList ul ul ul ul li a:focus, #header .gnb .navMobile .navPanel .menuArea .menuList ul ul ul li a:hover{color:#222;}
#header .gnb .navMobile .navPanel .menuArea .menuList ul ul ul ul li.active a{color:#222;}
#header .gnb .navMobile .navPanel .menuArea .menuList ul ul ul > li.hasSub > a:after{right:19.5px; width:7px; height:7px; margin-top:-3.5px; opacity:0.8;}
#header .gnb .navMobile .navPanel .menuArea .menuList ul ul ul > li.hasSub.open > a:after{opacity:0.4;}
#header .gnb .navMobile .navPanel .menuArea .menuList ul li.new a:after{content:''; display:inline-block; width:13px; height:13px; margin-left:8px; background:url('../../resources/images/ico_link.png') no-repeat center; vertical-align:bottom;}
#header .gnb .navMobile .navPanel .menuArea .menuList ul ul li.new a:after{margin-left:4px;}
#header .gnb .navPanel .menuBg{position:absolute; width:100%; height:100%; right:-100%; background:#000; opacity:0; z-index:-1; transition:opacity .3s ease-in-out;}
#header .gnb .navPanel.open .menuBg{right:0; opacity:0.5;}

#mo_spot { width:100%; height:30px; position: absolute; top:20px; left:10px;}
#mo_spot ul { width:100%; height:20px; position: relative;} 
#mo_spot ul li  { height:30px; line-height:30px; padding:0 10px; float:left;}
#mo_spot ul li a:link,
#mo_spot ul li a:active,
#mo_spot ul li a:visited { height:30px; line-height:30px; color:#ffffff; font-size:15px; display: block;}



#top_linker { position: absolute; top:0;}

/* wrap container ------------------------------------------------------------------------------------------------------------------------------------- */

/* container start */
#wrap_con { width:100%; margin-top:80px;}

/* page container */
#wrap_con .main_visual { width:100%; height:45vw; margin:0 auto; position:relative;}
#wrap_con .container { width:100%; }

/* index ------------------------------------------------------------------------------------------------------------------------------------- */
    
/* main image slied  */

.slider { max-width: 100%; position: relative; }
.slide-viewer { position: relative; overflow: hidden; height:35vw;}
.slide-group { width: 100%; height: 100%; position: relative;}
.slide { width: 100%; height: 100%; display: none; position: absolute; }
.slide:first-child { display: block; }
.slide img { width: 100%; }

/* slide-nav */
.slide-nav { width: 100%; position: absolute; top: 50%; margin-top:-1vw; }
.slide-nav .prev, .slide-nav .next {display:none;}

/* button */
.slide-buttons { width:18vw; height:6vw; position: absolute; bottom:1.5vw; left:50%; margin-left:-9vw; z-index:3; text-align: center;}
.slide-btn { width:6vw; border:none; background:none; font-size:10vw; color:#9f9f9f; line-height:6vw; text-shadow: -1px 0 white, 0 1px white, 1px 0 white, 0 -1px white; }
.slide-btn.active, .slide-btn:hover { color:#FFFFFF; cursor: pointer;}


.slider .mslogan { position: absolute; width:100%; top:9vw; padding-left:12vw; z-index:10; box-sizing: border-box;}
.slider .mslogan .slogan_kor01 { letter-spacing:-1px; line-height:4.5vw; font-size:3.5vw; color:#ffffff; font-weight:bold; text-shadow:3px 2px #000000;}
.slider .mslogan .slogan_kor02 { letter-spacing:-1px; line-height:9vw; font-size:6vw; color:#ffffff; font-weight:bold; text-shadow:3px 2px #000000;}

.slider .slide-1 { background:url(../../resources/images/main_img01.jpg) no-repeat center; background-size:cover;}
.slider .slide-2 { background:url(../../resources/images/main_img02.jpg) no-repeat center; background-size: cover;}
.slider .slide-3 { background:url(../../resources/images/main_img03.jpg) no-repeat center; background-size: cover;}    

/* main box container */

/* main benner2 area */

/* #wrap_con .container .ben_area { width:100%; height:80px; position: relative;}
#wrap_con .container .ben_area .ben_ul { width:100%; height:80px; position: relative; margin:0 auto;}
#wrap_con .container .ben_area .ben_ul li { height:80px; width:25%; position: absolute; z-index:10; }
#wrap_con .container .ben_area .ben_ul li.ben01 { left:0; }
#wrap_con .container .ben_area .ben_ul li.ben02 { left:25%;}
#wrap_con .container .ben_area .ben_ul li.ben03 { right:25%;}
#wrap_con .container .ben_area .ben_ul li.ben04 { right:0;}
#wrap_con .container .ben_area .ben_ul li.ben01 a { border:8px solid #5873b8;background-color:#ffffff; color:#2968b1;}
#wrap_con .container .ben_area .ben_ul li.ben02 a { border:8px solid #fee17a;background-color:#ffffff; color:#ad582d;}
#wrap_con .container .ben_area .ben_ul li.ben03 a { border:8px solid #40b872; background-color:#ffffff; color:#117c31;}
#wrap_con .container .ben_area .ben_ul li.ben04 a { border:8px solid #dd1c34; background-color:#ffffff; color:#dd1c34;}

#wrap_con .container .ben_area .ben_ul li a { width:100%; height:80px; line-height:68px; font-size:2.5vw; color:#474747; text-align: center; font-weight:800; display: block; background:url(../../resources/images/board_arr2.png) no-repeat; background-position:98% 90%; box-sizing: border-box;}
#wrap_con .container .ben_area .ben_ul li a:hover { color:#ffffff !important; background-position:98% !important;}
#wrap_con .container .ben_area .ben_ul li.ben01 a:hover { background:#5873b8 url(../../resources/images/board_arr.png) no-repeat; border:8px solid #859acf; }
#wrap_con .container .ben_area .ben_ul li.ben02 a:hover { background:#fee17a url(../../resources/images/board_arr.png) no-repeat; border:8px solid #ffd951; }
#wrap_con .container .ben_area .ben_ul li.ben03 a:hover { background:#40b872 url(../../resources/images/board_arr.png) no-repeat; border:8px solid #81b892; }
#wrap_con .container .ben_area .ben_ul li.ben04 a:hover { background:#dd1c34 url(../../resources/images/board_arr.png) no-repeat; border:8px solid #f87484; } */

#wrap_con .container .ben_area { width:100%; padding:20px 0; }
#wrap_con .container .ben_area .ben_ul { width:100%; height:7vw; margin:0 auto; position: relative;}
#wrap_con .container .ben_area .ben_ul li { width:calc(25% - 10px); margin:0 5px; height:70px; float:left; position: relative;}
#wrap_con .container .ben_area .ben_ul .quick_li .q_btn { width:100%; height:7vw; display: block; border:1px dashed #c9c9c9;  border-radius:8px; box-sizing: border-box;}
#wrap_con .container .ben_area .ben_ul .quick_li .q_btn:hover { border:1px solid #c9c9c9; background-color:#0e8ee4;}
#wrap_con .container .ben_area .ben_ul .quick_li .q_btn:hover span { color:#ffffff !important;}
#wrap_con .container .ben_area .ben_ul .quick_li .q_btn span { height:7vw; display:block; font-size:1.8vw; line-height:7vw; color:#4b4b4b; position: absolute; right:5px; top:0; text-align:right;}
#wrap_con .container .ben_area .ben_ul .quick_li .q_btn .ico_btn {display:inline-block; position:relative; width:5vw; height:5vw; border-radius:50%; background:#2a3865; margin-top:1vw; margin-left:1vw; border:1px solid #ffffff; box-sizing: border-box; }
#wrap_con .container .ben_area .ben_ul .quick_li .q_btn .ico_btn:after {content:''; position:absolute; top:0; left:0; width:100%; height:100%; border-radius:50%; background:#9c1c1f; opacity:0; transform:scale(1.4); z-index:1; transition:transform 0.4s, opacity 0.5s;}
#wrap_con .container .ben_area .ben_ul .quick_li .q_btn:hover .ico_btn:after {transform:scale(1.1); opacity:1;}
#wrap_con .container .ben_area .ben_ul .quick_li .q_btn .ico_btn img {position:relative; width:100%; z-index:2;}

#wrap_con .container .ben_area div {display:none;}


/* main board area */
#wrap_con .container .board_area { width:100%; padding:5px 0; box-sizing: border-box;}
#wrap_con .container .board_area .area_title { width:100%; font-size:38px; font-weight:bold; color:#3f3f3f; text-align: center; line-height:60PX; margin-bottom:30px;  }
#wrap_con .container .board_area .noti_ul {width:100%; position: relative; }
#wrap_con .container .board_area .noti_ul li.noti_li { width:100%; margin:0 auto; cursor: pointer;  }
#wrap_con .container .board_area .noti_ul li.noti_li .noti_box { height:60px; border-bottom:1px dotted #c7c7c7; box-sizing:border-box; position: relative; box-sizing: border-box; }
#wrap_con .container .board_area .noti_ul li.noti_li .noti_box .noti_tit { height:60px; font-size:20px; line-height:60px; color:#000000; margin-bottom:10px; overflow: hidden; margin-left:10px;}
#wrap_con .container .board_area .noti_ul li.noti_li .noti_box .noti_date { height:60px;  font-size:20px; line-height:60px; color:#868686; text-align:right; position: absolute; right:10px; top:0;}
#wrap_con .container .board_area .noti_ul li.noti_li .noti_box .noti_con { display: none;}

#wrap_con .container .board_area .noti_ul li.noti_li:hover { background-color:#cd1a31 ;}
#wrap_con .container .board_area .noti_ul li.noti_li:hover h3,
#wrap_con .container .board_area .noti_ul li.noti_li:hover div {  color:#ffffff !important; }

#wrap_con .container .board_area .noti_ul li.noti_li .noti_box .mcate {width:70px; height:30px; line-height:30px; font-size:16px !important; text-align:center !important; text-indent:0 !important; box-sizing:border-box; display:inline-block; border-radius:15px;}
#wrap_con .container .board_area .noti_ul li.noti_li .noti_box .cate01 { background-color:#2fa5de; color:#ffffff; }
#wrap_con .container .board_area .noti_ul li.noti_li .noti_box .cate02 { background-color:#5c8398; color:#ffffff; }
#wrap_con .container .board_area .noti_ul li.noti_li .noti_box .cate03 { background-color:#999240; color:#ffffff; }
#wrap_con .container .board_area .noti_ul li.noti_li .noti_box .cate04 { background-color:#4f835a; color:#ffffff; }
#wrap_con .container .board_area .noti_ul li.noti_li .noti_box .cate05 { background-color:#4849b1; color:#ffffff; }
#wrap_con .container .board_area .noti_ul li.noti_li .noti_box .cate06 { background-color:#ac477f; color:#ffffff; }


/* food menu */
#wrap_con .container .food_area { width:100%; padding:20px 0;}
#wrap_con .container .food_area .food_ul { width:100%; position:relative; background-color:#ffffff; border:1px solid #c9c9c9; box-sizing:border-box; padding:10px; margin:0 auto;}
#wrap_con .container .food_area .food_ul .con_title03 { width:100%; height:45px; line-height:44px; font-size:20px; text-indent:15px; font-weight:800; color:#e01825; border-bottom:1px solid #eaeaea; box-sizing:border-box; position: relative;}
#wrap_con .container .food_area .food_ul .con_title03 .food_date { width:200px; height:20px; line-height:20px; text-align:right; position:absolute; top:50%; margin-top:-10px; right:20px; font-size:18px; font-weight:normal; display:block; color: #000000 !important; position: absolute; right:0; display: block; }
#wrap_con .container .food_area .food_ul .food_table { width:100%; background:#fff; border:1px solid #ddd; border-top:1px solid #665041; border-radius:4px; text-align:center; }
#wrap_con .container .food_area .food_ul .food_table th { height:40px; background:#f3f3f3; border-right:1px solid #ddd; border-bottom:1px solid #ddd; color:#333; font-size:20px; font-weight:500; vertical-align:middle; word-break:keep-all; }
#wrap_con .container .food_area .food_ul .food_table td { padding:12px 14px; border-right:1px solid #ddd; border-bottom:1px solid #ddd; word-break:keep-all; vertical-align:middle; line-height:30px; font-size:15px; }



/* main Quick service area */
#wrap_con .container .qservice_area { width:100%; height:38vw; padding:5vw 0; background-color:#5873b8; box-sizing: border-box; }
#wrap_con .container .qservice_area .area_title { width:100%; font-size:38px; font-weight:bold; color:#ffffff; text-align: center; line-height:60PX; margin-bottom:30px;  }
#wrap_con .container .qservice_area .m_qs_ul { width:100%; padding:0 2vw; box-sizing: border-box; margin:0 auto;}
#wrap_con .container .qservice_area .m_qs_ul .icon_ul { width:100%; position:relative; color:#ffffff;}
#wrap_con .container .qservice_area .m_qs_ul .icon_ul li { width:15.5vw; height:18vw; float:left; text-align:center;}

#wrap_con .container .qservice_area .m_qs_ul .icon_ul li span {display:block; padding-top:1.2vw; font-size:2vw; line-height:3vw; color:#ffffff;}
#wrap_con .container .qservice_area .m_qs_ul .icon_ul .ico_btn {display:inline-block; position:relative; width:12vw; height:12vw; border-radius:50%; background:#ede0d3; margin-top:2vw; border:1px solid #ffffff; box-sizing: border-box; }
#wrap_con .container .qservice_area .m_qs_ul .icon_ul .ico_btn:after {content:''; position:absolute; top:0; left:0; width:100%; height:100%; border-radius:50%; background:#ffe23e; opacity:0; transform:scale(1.4); z-index:1; transition:transform 0.4s, opacity 0.5s;}
#wrap_con .container .qservice_area .m_qs_ul .icon_ul a:hover .ico_btn:after {transform:scale(1.1); opacity:1;}
#wrap_con .container .qservice_area .m_qs_ul .icon_ul .ico_btn img {position:relative; width:100%; z-index:2;}


/* sub page ------------------------------------------------------------------------------------------------------------------------------------- */

/* sub page container */
#wrap_con .container .sub_head { width:100%; height:50px; background-color:#f3f3f3; position: relative;}
#wrap_con .container .sub_head .root_box { width:100%; height:50px;}

/* sub Navigation */
#wrap_con .container .sub_head .root_box .root_menu { width:100%; height:50px; position: relative;}
#wrap_con .container .sub_head .root_box .root_menu .home_li,
#wrap_con .container .sub_head .root_box .root_menu .menu_li { float: left;}
#wrap_con .container .sub_head .root_box .root_menu .home_li .menu_home { width:50px; height:50px; display:block; background:url(../../resources/images/icon_home_btn.png); }
#wrap_con .container .sub_head .root_box .root_menu .menu_li { width:200px; height:50px; }
#wrap_con .container .sub_head .root_box .root_menu .menu_li .smenu_btn { width:200px; height:50px; display:block; line-height:50px; font-size:15px; color:#101010; text-indent:15px; position: relative;}
#wrap_con .container .sub_head .root_box .root_menu .menu_li .smenu_btn .root_arrow { width:30px; height:30px; display:block; position: absolute; top:50%; margin-top: -15px; right:0; background:url(../../resources/images/root_arrow.png); background-position:top; transition: transform 1s ease-in-out; transition-duration:0.2s;}
#wrap_con .container .sub_head .root_box .root_menu .menu_li .smenu_btn .l_line{ width:1px; height:20px; display:block; position: absolute; top:50%; margin-top:-10px; left:0; background-color:#9e9e9e;  }

#wrap_con .container .sub_head .root_box .root_menu .menu_li .smenu_btn:hover { background-color:#0d346d; color:#ffffff; border-bottom:1px solid #ffffff; box-sizing: border-box;}
/*#wrap_con .container .sub_head .root_box .root_menu .menu_li .smenu_btn:hover .root_arrow {  transform: rotate(90deg); transition-duration:0.2s; }*/

#wrap_con .container .sub_head .root_box .root_menu .menu_li .selected { background-color:#0d346d; color:#ffffff; border-bottom:1px solid #ffffff; box-sizing: border-box;}
#wrap_con .container .sub_head .root_box .root_menu .menu_li .selected .root_arrow {  transform: rotate(90deg); transition-duration:0.2s;  background-position:bottom;}

#wrap_con .container .sub_head .root_box .root_menu .menu_li .smenu_box { position:absolute; top:50px; display:none; z-index:100; }
#wrap_con .container .sub_head .root_box .root_menu .menu_li .smenu_box .depth01 { width:200px; padding:5px; box-sizing: border-box; background-color:#0d346d; color:#ffffff; text-align:left; list-style:none; z-index:999;}
#wrap_con .container .sub_head .root_box .root_menu .menu_li .smenu_box .depth01 a:link, 
#wrap_con .container .sub_head .root_box .root_menu .menu_li .smenu_box .depth01 a:active, 
#wrap_con .container .sub_head .root_box .root_menu .menu_li .smenu_box .depth01 a:visited { width:100%; height:40px; font-size:15px; color:#ffffff; text-decoration:none; line-height:40px; display:block; text-indent:5px;}
#wrap_con .container .sub_head .root_box .root_menu .menu_li .smenu_box .depth01 a:hover { background-color:#ffffff; color:#000000;}

#wrap_con .container .contents { width:100%; min-height:500px; margin:0 auto; padding:0 15px 50px 15px; font-size:15px; box-sizing: border-box;}
#wrap_con .container .contents .sub_title { width:100%; height:8vw; margin-top:5vw; font-size:4.5vw; font-weight:bold; color:#333333; text-align: center; line-height:8vw; border-bottom:1px solid #cfcfcf; box-sizing:border-box;}

#wrap_con .container .contents .wait { width:100%; height:500px; margin:0 auto; text-align:center;}
#wrap_con .container .contents .wait img{ width:500px; height:500px; margin:0 auto; }

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

/* go to Top */
.quick { width:25px; right:10px; bottom:10px; position:fixed;}
.quick .top {width:30px; height:35px; background-color:#990e17; display:block; padding-top:5px; border-radius:3px; opacity:0.5;} 
.quick .top div { color:#ffffff; line-height:13px; font-size:13px; text-align:center;}

/* go to back */
.back { width:40px; left:10px; bottom:10px; position:fixed;}
.back .btn_back {width:40px; height:40px; background-color:#2a3865; display:block;  border-radius:3px; opacity:0.8;} 
.back .btn_back img {width:100; height:100;} 

/* footer layout  */
#footer { width:100%; height: 25vw; border-top:1px solid #e7e7e7; }
#footer .address_area { width:100%; height:25vw; position: relative;}
#footer .address_area .bot_logo { width:16vw; height:16vw; position: absolute; top:1.5vw; left: 0;}
#footer .address_area .bot_logo img { width: 100%; height: 100%;}
#footer .address_area .address_box { height:16vw; padding:0 2vw; box-sizing: border-box; margin-left:16vw; }
#footer .address_area .address_box li {height:8vw; padding-top:2vw; box-sizing: border-box;}
#footer .address_area .address_box li h1 { font-size:2vw; font-weight: bold; color:#000000; height:4vw; line-height:4vw; }
#footer .address_area .address_box li div { font-size:1.8vw; color:#4e4e4e; height:4vw; line-height:4vw; }

#footer .address_area .Fsite { width:100%; height:5vw; bottom:0; left:0; position:absolute;}
#footer .address_area .Fsite .fam_btn { width:100%; height:5vw; display:block; line-height:5vw; border:1px solid #b2b2b2; box-sizing: border-box; font-size:2.5vw; color:#a8a8a8; text-indent:30px; position: relative; background-color:#ffffff; text-align: center; }
#footer .address_area .Fsite .fam_btn .plus { width:50px; height:50px; display:block; line-height:50px; font-size:20px; color:#a8a8a8; text-align: center; position: absolute; top:50%; margin-top:-25px; right:20px; transition: transform 1s ease-in-out; transition-duration:0.2s; text-indent:0 !important; }
#footer .address_area .Fsite .fam_btn:hover .plus {transform:scale(1.5) rotate(360deg); transition-duration:0.2s; }


/* Site Link*/
#siteLink01 { position:absolute; bottom:5vw; display:none;  }
#siteLink01 .fam { width:100vw; padding:5px; border:1px solid #545358; box-sizing:border-box; background-color:#ffffff; color:#000000; text-align:center; list-style:none; z-index:999;}
#siteLink01 .fam a:link, #siteLink01.fam a:active, #siteLink01 .fam a:visited { width:100%; height:4vw; font-size:2.2vw; color:##c0926a; text-decoration:none; line-height:4vw; display:block; text-indent:5px;}
#siteLink01 .fam a:hover { background-color:#6d6d6d; color:#ffffff;}

#footer .copyright_area {width:100%; height:15vw; background-color:#707070;}
#footer .copyright_area .copyright_box { width:100%; height:15vw; margin:0 auto; position:relative;}
#footer .copyright_area .copyright_box .btn_box { width:100%; height:8vw; position:absolute; top:1.5vw; left:0;}
#footer .copyright_area .copyright_box .btn_box .bot_button { width:100%; height:4vw; position:relative;}
#footer .copyright_area .copyright_box .btn_box .bot_button li { width:20%; height:4vw; float:left;}
#footer .copyright_area .copyright_box .btn_box .bot_button li .b_btn:link,
#footer .copyright_area .copyright_box .btn_box .bot_button li .b_btn:active,
#footer .copyright_area .copyright_box .btn_box .bot_button li .b_btn:visited { width:100%; height:4vw; display:block; text-align:center; font-size:1.8vw; line-height:4vw; color:#ffffff;}
#footer .copyright_area .copyright_box .btn_box .bot_button li .b_btn:hover { background-color:#dadada; color:#2e2d34;}
#footer .copyright_area .copyright_box .btn_box .bot_button div { width:1px; height:16px; position:absolute; top:50%; margin-top:-8px; background-color:#ffffff; opacity:0.8; }
#footer .copyright_area .copyright_box .btn_box .bot_button .line01 { left:33%; }
#footer .copyright_area .copyright_box .btn_box .bot_button .line02 { left:66%; }
#footer .copyright_area .copyright_box .copyright { width:100%; height:8vw; font-size:1.2vw; color:#ffffff; line-height:8vw; position: absolute; bottom:0; text-align: center;}
#footer .copyright_area .copyright_box .copyright a { display: none;}

}


@media only screen and (max-width:1300px) and (min-width:1000px) {

    #wrap_con .main_visual { width:100%; height:35vw; margin:0 auto; position:relative;}

    .slider .event_pop { width:44vw; height:28vw; background-color:#ffffff; position: absolute; top:1vw; left:1vw; z-index:10; border:1px solid #bdbdbd; box-sizing: border-box; }
    .slider .event_pop .pop_box { height:26vw; padding:1vw; position: relative; }
    .slider .event_pop .pop_box .ev_tit { width:100%; background-color:#f2021b; color:#ffffff; font-size:2.4vw; text-align:center; line-height:5vw; display:block; }
    .slider .event_pop .pop_box .ev_txt { width:100%;  font-size:1.2vw; line-height:2.5vw; margin-top:1.5vw; }
    .slider .event_pop .pop_box .ev_btn { width:24vw; height:3.4vw; line-height:3.4vw; font-size:1.6vw; font-weight:bold; background-color:#3767e3; color:#ffffff; text-align: center; display:block; position: absolute; bottom:1vw; left:50%; margin-left:-12vw; border-radius:1.7vw; }
    .slider .event_pop .pop_box .ev_btn:hover { background-color:#2a3865; }
    
    #wrap_con .container .ben_area { width:100%; height:80px; position: relative;}

    /* main benner area*/
    .main_visual .main_ben { width:490px; height:90px; position:absolute; top:30px; right:50px; z-index:10;}
    .main_visual .main_ben .ben_ul{ width:490px; height:90px; position:relative;}
    .main_visual .main_ben .ben_ul li { width:240px; height:90px; top:4px; position:absolute; background-color:#ffffff;}
    .main_visual .main_ben .ben_ul li.ben_left { left:0;}
    .main_visual .main_ben .ben_ul li.ben_right { right:0;}
    .main_visual .main_ben .ben_ul li .ben_box { width:240px; height:90px; position:relative; box-sizing: border-box;}
    .main_visual .main_ben .ben_ul li.ben_left .ben_box { border:4px solid #a11721;}
    .main_visual .main_ben .ben_ul li.ben_right .ben_box { border:4px solid #2c476b;}
    .main_visual .main_ben .ben_ul li .ben_box:hover {width:240px !important; height:90px !important; border:none;}


    .main_visual .main_ben .ben_ul li .ben_box a { width:232px; height:82px; display:block; }
    .main_visual .main_ben .ben_ul li .ben_box a:hover { width:240px !important; height:90px !important; display:block;}

    .main_visual .main_ben .ben_ul li .ben_box a span { width:200px; display:block; text-align:left; z-index:2; position:absolute; top:50%; }
    .main_visual .main_ben .ben_ul li .ben_box a .kor { height:35px; line-height:30px; font-size:24px; margin-top:-25px; left:15px; font-weight:800;}
    .main_visual .main_ben .ben_ul li .ben_box a .eng { height:25px; line-height:20px; font-size:13px; margin-top:5px; left:15px;}


    .main_visual .main_ben .ben_ul li .ben_box .ben_btn01 { color:#a11721; background:url(../../resources/images/main_ben01.png) right top no-repeat;}
    .main_visual .main_ben .ben_ul li .ben_box .ben_btn02 { color:#2c476b; background:url(../../resources/images/main_ben02.png) right top no-repeat;}

    .main_visual .main_ben .ben_ul li .ben_box .ben_btn01:hover { background:#a11721; color:#ffffff;}
    .main_visual .main_ben .ben_ul li .ben_box .ben_btn02:hover { background:#2c476b; color:#ffffff;}

    .main_visual .main_ben .ben_ul li .ben_box .ben_btn01::after {content:''; position:absolute; top:0; left:0; width:100%; height:100%; background-color:#a11721; opacity:0; transform:scale(1.4);  transition:transform 0.4s, opacity 0.5s; z-index: 1;}
    .main_visual .main_ben .ben_ul li:hover .ben_btn01::after {transform:scale(1); opacity:0.5; color:#ffffff; background:url(../../resources/images/main_ben01.png) right bottom no-repeat;}

    .main_visual .main_ben .ben_ul li .ben_box .ben_btn02::after {content:''; position:absolute; top:0; left:0; width:100%; height:100%; background-color:#2c476b; opacity:0; transform:scale(1.4);  transition:transform 0.4s, opacity 0.5s; z-index: 1;}
    .main_visual .main_ben .ben_ul li:hover .ben_btn02::after {transform:scale(1); opacity:0.5; color:#ffffff; background:url(../../resources/images/main_ben02.png) right bottom no-repeat;}
    
    /* #wrap_con .container .board_area .noti_ul li.noti_li { width:24%; height:200px; float:left; margin:0 0.5% 15px 0.5%; cursor: pointer;  } */




    /* main board area */
#wrap_con .container .board_area { width:100%; padding:50px 0; box-sizing: border-box;}
#wrap_con .container .board_area .area_title { width:100%; font-size:38px; font-weight:bold; color:#3f3f3f; text-align: center; line-height:60PX; margin-bottom:30px;  }
#wrap_con .container .board_area .card_ul { width:100%; height:300px;  margin:0 auto; position: relative; overflow:hidden; }
#wrap_con .container .board_area .card_ul li.card_li { width:calc( 25% - 25px); height:300px; float:left; margin:0 12.5px 12.5px 12.5px; cursor: pointer;  }
#wrap_con .container .board_area .card_ul li.card_li .noti_box { width:100%; height:300px; border:1px solid #c7c7c7; box-sizing:border-box; position: relative; padding:15px; box-sizing: border-box;  overflow: hidden; }
#wrap_con .container .board_area .card_ul li.card_li .noti_box .noti_tit { height:70px; font-size:20px; line-height:35px; color:#000000; margin-bottom:10px; overflow: hidden;}
#wrap_con .container .board_area .card_ul li.card_li .noti_box .noti_date { font-size:13px; line-height:20px; color:#868686; text-align:right; margin-bottom:10px;}
#wrap_con .container .board_area .card_ul li.card_li .noti_box .noti_con2 { height:160px; font-size:15px; line-height:28px; color:#868686; overflow: hidden;}
#wrap_con .container .board_area .card_ul li.card_li .noti_box .noti_con2 .add_img { width:100%; height:400%;}
#wrap_con .container .board_area .card_ul li.card_li .noti_box .noti_con2 .add_img img { width:100%; height:100%;}

#wrap_con .container .board_area .card_ul li.card_li:hover { background-color:#cd1a31 ;}
#wrap_con .container .board_area .card_ul li.card_li:hover h3,
#wrap_con .container .board_area .card_ul li.card_li:hover div {  color:#ffffff !important; }
#wrap_con .container .board_area .card_ul li.card_li:hover .noti_con2 a:link,
#wrap_con .container .board_area .card_ul li.card_li:hover .noti_con2 a:visited,
#wrap_con .container .board_area .card_ul li.card_li:hover .noti_con2 a:active,
#wrap_con .container .board_area .card_ul li.card_li .noti_con2 a:hover {  color:#ffffff !important; }

#wrap_con .container .board_area .card_ul li.card_li .noti_box .mcate {  width:70px; height:30px; line-height:30px; font-size:16px !important; text-align:center !important; text-indent:0 !important; box-sizing:border-box; display:inline-block; border-radius:15px;}

   
    }

@media only screen and (max-width:1000px) and (min-width:681px) {

    #wrap_con .main_visual { width:100%; height:45vw; margin:0 auto; position:relative;}

    .slider .event_pop { width:94vw; height:25vw; background-color:#ffffff; position: absolute; top:3vw; left:50%; margin-left:-47vw; z-index:10; border:1px solid #bdbdbd; box-sizing: border-box; }
    .slider .event_pop .pop_box { height:23vw; padding:1vw; position: relative; }
    .slider .event_pop .pop_box .ev_tit { width:100%; background-color:#f2021b; color:#ffffff; font-size:2.4vw; text-align:center; line-height:5vw; display:block; }
    .slider .event_pop .pop_box .ev_txt { width:100%;  font-size:1.6vw; line-height:2.5vw; margin-top:1.5vw; }
    .slider .event_pop .pop_box .ev_btn { width:40vw; height:3.4vw; line-height:3.4vw; font-size:1.6vw; font-weight:bold; background-color:#3767e3; color:#ffffff; text-align: center; display:block; position: absolute; bottom:1vw; left:50%; margin-left:-20vw; border-radius:1.7vw; }
    .slider .event_pop .pop_box .ev_btn:hover { background-color:#2a3865; }    

    #wrap_con .container .ben_area { width:100%; height:80px; position: relative; margin-top:20px;}
    
    /* main benner area*/
    .main_visual .main_ben { width:100%; height:10vw; position: absolute; top:34vw; left:0; }
    .main_visual .main_ben .ben_ul{ width:100%; height:10vw; position:relative;}
    .main_visual .main_ben .ben_ul li { width:50%; height:10vw; top:1vw; position:absolute; background-color:#ffffff;}
    .main_visual .main_ben .ben_ul li.ben_left { left:0;}
    .main_visual .main_ben .ben_ul li.ben_right { right:0;}
    .main_visual .main_ben .ben_ul li .ben_box { width:100%; height:10vw; position:relative; box-sizing: border-box;}
    .main_visual .main_ben .ben_ul li.ben_left .ben_box { border:4px solid #a11721;}
    .main_visual .main_ben .ben_ul li.ben_right .ben_box { border:4px solid #2c476b;}
    .main_visual .main_ben .ben_ul li .ben_box:hover {width:100% !important; height:10vw !important; border:none;}
    
    
    .main_visual .main_ben .ben_ul li .ben_box a { width:calc(100% - 2vw); height:8vw; display:block; }
    .main_visual .main_ben .ben_ul li .ben_box a:hover { width:100% !important; height:10vw !important; display:block;}
    
    .main_visual .main_ben .ben_ul li .ben_box a span { width:200px; display:block; text-align:left; z-index:2; position:absolute; top:50%; }
    .main_visual .main_ben .ben_ul li .ben_box a .kor { height:35px; line-height:30px; font-size:24px; margin-top:-25px; left:15px; font-weight:800;}
    .main_visual .main_ben .ben_ul li .ben_box a .eng { height:25px; line-height:20px; font-size:13px; margin-top:5px; left:15px;}
    
    
    .main_visual .main_ben .ben_ul li .ben_box .ben_btn01 { color:#a11721; background:url(../../resources/images/main_ben01.png) right no-repeat;}
    .main_visual .main_ben .ben_ul li .ben_box .ben_btn02 { color:#2c476b; background:url(../../resources/images/main_ben02.png) right no-repeat;}
    
    .main_visual .main_ben .ben_ul li .ben_box .ben_btn01:hover { background:#a11721; color:#ffffff;}
    .main_visual .main_ben .ben_ul li .ben_box .ben_btn02:hover { background:#2c476b; color:#ffffff;}
    
    .main_visual .main_ben .ben_ul li .ben_box .ben_btn01::after {content:''; position:absolute; top:0; left:0; width:100%; height:100%; background-color:#a11721; opacity:0; transform:scale(1.4);  transition:transform 0.4s, opacity 0.5s; z-index: 1;}
    .main_visual .main_ben .ben_ul li:hover .ben_btn01::after {transform:scale(1); opacity:0.5; color:#ffffff; background:url(../../resources/images/main_ben01_ov.png) right no-repeat;}
    
    .main_visual .main_ben .ben_ul li .ben_box .ben_btn02::after {content:''; position:absolute; top:0; left:0; width:100%; height:100%; background-color:#2c476b; opacity:0; transform:scale(1.4);  transition:transform 0.4s, opacity 0.5s; z-index: 1;}
    .main_visual .main_ben .ben_ul li:hover .ben_btn02::after {transform:scale(1); opacity:0.5; color:#ffffff; background:url(../../resources/images/main_ben02_ov.png) right no-repeat;}
    
    /* #wrap_con .container .board_area .noti_ul li.noti_li { width:32.2%; height:200px; float:left; margin:0 0.5% 15px 0.5%; cursor: pointer;  }
    .list_delete { display:none;} */


    /* main board area */
    #wrap_con .container .board_area { width:100%; padding:50px 0; box-sizing: border-box;}
    #wrap_con .container .board_area .area_title { width:100%; font-size:38px; font-weight:bold; color:#3f3f3f; text-align: center; line-height:60PX; margin-bottom:30px;  }
    #wrap_con .container .board_area .card_ul { width:100%; height:650px;  margin:0 auto; position: relative; overflow:hidden; }
    #wrap_con .container .board_area .card_ul li.card_li { width:calc( 50% - 25px); height:300px; float:left; margin:0 12.5px 12.5px 12.5px; cursor: pointer;  }
    #wrap_con .container .board_area .card_ul li.card_li .noti_box { width:100%; height:300px; border:1px solid #c7c7c7; box-sizing:border-box; position: relative; padding:15px; box-sizing: border-box;  overflow: hidden; }
    #wrap_con .container .board_area .card_ul li.card_li .noti_box .noti_tit { height:70px; font-size:20px; line-height:35px; color:#000000; margin-bottom:10px; overflow: hidden;}
    #wrap_con .container .board_area .card_ul li.card_li .noti_box .noti_date { font-size:13px; line-height:20px; color:#868686; text-align:right; margin-bottom:10px;}
    #wrap_con .container .board_area .card_ul li.card_li .noti_box .noti_con2 { height:160px; font-size:15px; line-height:28px; color:#868686; overflow: hidden;}
    #wrap_con .container .board_area .card_ul li.card_li .noti_box .noti_con2 .add_img { width:100%; height:400%;}
    #wrap_con .container .board_area .card_ul li.card_li .noti_box .noti_con2 .add_img img { width:100%; height:100%;}
    
    #wrap_con .container .board_area .card_ul li.card_li:hover { background-color:#cd1a31 ;}
    #wrap_con .container .board_area .card_ul li.card_li:hover h3,
    #wrap_con .container .board_area .card_ul li.card_li:hover div {  color:#ffffff !important; }
    #wrap_con .container .board_area .card_ul li.card_li:hover .noti_con2 a:link,
    #wrap_con .container .board_area .card_ul li.card_li:hover .noti_con2 a:visited,
    #wrap_con .container .board_area .card_ul li.card_li:hover .noti_con2 a:active,
    #wrap_con .container .board_area .card_ul li.card_li .noti_con2 a:hover {  color:#ffffff !important; }
    
    #wrap_con .container .board_area .card_ul li.card_li .noti_box .mcate {  width:70px; height:30px; line-height:30px; font-size:16px !important; text-align:center !important; text-indent:0 !important; box-sizing:border-box; display:inline-block; border-radius:15px;}
    
    }