@charset "UTF-8";
/* CSS Document */
/* Main, sub, 모바일전용 메뉴 navi */
/* 레이아웃-공통 header, footer, sub공통레이아웃  */


/* PC-Wide Css */
body{position:relative;}
body.fixed{ position:fixed; top:0; left:0; width:100%; height:100%; }
/*body.screen:before{content: ""; position: absolute; z-index: 99; top: 0; left: 0;  width: 100%; height: 100%; background:rgba(0,0,0,0.5);}*/
.screen_mask{ display: none; position: absolute; z-index: 99; top: 0; left: 0;  width: 100%; height: 100%; background:rgba(0,0,0,0.5);}

/*
body.zindex_up:before{z-index: 1000;}
body.fixed{ position:fixed; top:0; left:0; width:100%; height:100%;}
*/
.wrapper{ position: relative; width: 100%; /*overflow-x: hidden;*/}

.wsize{position:relative; max-width:1276px; margin:0 auto; }

/*컨텐츠 좌우 들여쓰기 설정*/
/*폭이 작은 컨텐츠 사용에 적합*/
/*로그인, 본인인증, 아이디비밀번호찾기 등 컨텐츠 해당 .wsize 에 .sm_wsize 를 붙여 사용*/
.sm_wsize,
.wsize.sm_wsize{position:relative; max-width:900px; margin:0 auto; }

@media screen and ( max-width:1300px){
    .wsize{ max-width:94%; transition:max-width 0.3s; }
}
@media screen and ( max-width:920px){
    .sm_wsize,
    .wsize.sm_wsize{ max-width:94%; transition:max-width 0.3s; }
}



/*skip navigation*/
.skip_navi{ position:relative; z-index:10000; width:100%;  margin:0 auto; }
.skip_navi > ul {}
.skip_navi > ul li{}
.skip_navi > ul li a{ display:block; position:absolute; left:0px; width:100%;  height:46px; text-align:center;  line-height:46px;  color:#FFF; font-weight:700; background-color:#094fa3;  }
.skip_navi > ul li a:focus{  top:0px;  }
.skip_link {
    position: absolute; /* 문서 흐름에서 벗어나 자유롭게 위치 지정 */
    top: -9999px;      /* 화면 상단 바깥 아주 멀리 보냄 */
    left: 0;
    width: 1px;        /* 스크린리더가 인식할 수 있도록 최소한의 크기 유지 */
    height: 1px;
    overflow: hidden;  /* 내용이 1x1 영역을 넘어가면 숨김 */
    white-space: nowrap; /* 텍스트가 줄바꿈되지 않도록 처리 */
}

/* 본문 바로가기 링크가 키보드 포커스를 받았을 때 스타일 */
.skip_link:focus {
    position: fixed;   /* 화면(viewport) 기준으로 위치 고정 */
    top: 0;            /* 화면 최상단에 위치 */
    left: 0;
    width: 100%;           /* 너비 100% */
    height: 30px;          /* 높이 46px */
    background-color: #094fa3; /* 파란색 배경 */
    color: #ffffff;        /* 흰색 글자 */
    font-weight: 700;      /* 굵은 글씨체 */
    text-align: center;    /* 텍스트 가운데 정렬 */
    line-height: 26px;     /* 수직 정렬을 위해 높이와 동일하게 설정 */
    text-decoration: none;
    z-index: 9999;         /* 다른 모든 요소들보다 위에 보이도록 설정 */
    overflow: visible;     /* 숨겼던 내용 다시 보이게 함 */
}



/*메인 레이어 팝업 기본-이미지*/
.popup_screen_mask{ display: block; position: absolute; z-index: 999; top: 0; left: 0;  width: 100%; height: 100%; background:rgba(0,0,0,0.5);}
.layer_popup{  position: relative; /* padding-bottom: 40px; */  background: #fff; }
.layer_popup .layer_pop_area{  width: 100%; height: 100%; background: #fff; }
.layer_popup .layer_pop_area .pop_con {font-size: 0;padding-bottom: 40px;}
.layer_popup .layer_pop_area .pop_con a {display: block;}
.layer_popup .layer_pop_area .pop_con img{ width: 100%; height: inherit;}

.layer_popup .pop_bottom{ position: absolute; padding: 7px 20px; bottom: 0px; left: 0px; width: 100%; background: #222; }
.layer_popup .pop_bottom .one_day{ text-decoration: none; margin-left: 10px;}
.layer_popup .pop_bottom label {margin-left: 5px; color: #fff; }
.layer_popup .pop_bottom .btn{padding: 5px 0; background: none; border: none; font-size: 15px; color: #fff; }
@media screen and ( max-width:1070px){
    .layer_popup { height: auto !important; max-width: 62.500vw;}
}
@media screen and ( max-width:640px){
    .layer_popup{padding-bottom:80px; max-width: 94.5vw;}
    .layer_popup .layer_pop_area.pop_grid{padding-bottom:50px}
    .layer_popup .layer_pop_area .pop_con{width:100% !important;margin-top:15px !important;padding:0 10px 20px}
    .layer_popup .pop_bottom{padding:10px}
    .layer_popup .pop_bottom input[type="checkbox"]{width:20px;height:20px;border-radius:4px;border:2px solid #666666}
    .layer_popup .pop_bottom label{margin-left:0;font-size:14px}
    .layer_popup .pop_bottom .btn{padding:5px 0;font-size:14px}

}


/*메인 레이어 팝업-텍트트 인경우*/
.layer_popup.text_type{ padding: 15px; padding-bottom: 43px; border: 4px solid #0f4da3; background: #fff; }
.layer_popup.text_type .layer_pop_area .pop_ti{  padding-bottom: 10px; border-bottom: 1px solid #4083e0; font-size: 20px; letter-spacing: -0.05em; color: #0f4da3; }
.layer_popup.text_type .layer_pop_area .pop_ti .txt{ display: inline-block; width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 1em;}

/*텍스트*/
.layer_popup.text_type .layer_pop_area .pop_con .txt_wrap{ padding: 10px 0;}
.layer_popup.text_type .layer_pop_area .pop_con .in_txt{ line-height: 1.5em;}

@media screen and ( max-width:1070px){
    .layer_popup.text_type .layer_pop_area .pop_ti{  padding-bottom: 5px; font-size: 15px; }
    .layer_popup.text_type .layer_pop_area .pop_con .txt_wrap{padding: 5px 0;}
    .layer_popup.text_type .layer_pop_area .pop_con .in_txt{ line-height: 1.3em; font-size: 13px;}
    .layer_popup .layer_pop_area .pop_con a {padding: 8px 0; display: block;}

}

/*메인 레이어 팝업-텍스트, 서비스일시중지 팝업 인경우*/
.layer_popup.text_type.ver2 {padding:30px; padding-bottom:71px; border:7px solid #0f4da3; background:#fff; background-image:url("/images/cnt/pop_bg01.png"), url("/images/cnt/pop_bg02.png"); background-repeat:no-repeat; background-position:top right, bottom left;}
.layer_popup.text_type.ver2 .pop_ti_ver2::before {content:''; display:block; width:130px; height:31px; background:url("/images/cnt/pop_logo.png") no-repeat 0 0; padding-bottom:27px;}
.layer_popup.text_type.ver2 .pop_ti_ver2 {font-size:20px; word-break:keep-all;}
.layer_popup.text_type.ver2 .pop_ti_ver2 em {display:block; padding-top:5px; font-size:34px; color:#0b3a80; font-weight:600; word-spacing:-2px; line-height:1em;}
.layer_popup.text_type.ver2 .layer_pop_area {background:none;}
.layer_popup.text_type.ver2 .layer_pop_area .pop_con {word-spacing:-1px;  word-break:keep-all;}
.layer_popup.text_type.ver2 .layer_pop_area .pop_con .txt_wrap {padding:40px 0; font-size:16px; color:#333;}
.layer_popup.text_type.ver2 .layer_pop_area .pop_con .time_area {padding:14px; text-align:center; color:#fff; background:#0b3a80; border-radius:3px;-webkit-box-shadow: 3px 3px 7px 0px rgba(0,0,0,0.3); -moz-box-shadow: 3px 3px 7px 0px rgba(0,0,0,0.3);box-shadow: 3px 3px 7px 0px rgba(0,0,0,0.3);}
.layer_popup.text_type.ver2 .layer_pop_area .pop_con .time_area p {font-size:20px;}
.layer_popup.text_type.ver2 .layer_pop_area .pop_con .time_area span {display:block; padding-top:13px; font-size:16px;}

@media screen and ( max-width:1070px){
    .layer_popup.text_type.ver2 .layer_pop_area .pop_con .in_txt {font-size:16px; line-height:1.5em;}
}

@media screen and ( max-width:570px){
    .layer_popup.text_type.ver2 {padding:20px; padding-bottom:61px;}
    .layer_popup.text_type.ver2 .pop_ti_ver2::before {padding-bottom:20px; width:90px; height:21px; background-size:contain;}
    .layer_popup.text_type.ver2 .pop_ti_ver2 {font-size:14px;}
    .layer_popup.text_type.ver2 .pop_ti_ver2 em {font-size:20px;}
    .layer_popup.text_type.ver2 .layer_pop_area .pop_con .txt_wrap {padding:20px 0;}
    .layer_popup.text_type.ver2 .layer_pop_area .pop_con .in_txt {font-size:13px; line-height:1.3em;}
    .layer_popup.text_type.ver2 .layer_pop_area .pop_con .time_area {padding:8px;}
    .layer_popup.text_type.ver2 .layer_pop_area .pop_con .time_area p {font-size:14px;}
    .layer_popup.text_type.ver2 .layer_pop_area .pop_con .time_area span {padding-top:5px; font-size:13px;}
}

@media screen and ( max-width:420px){
        .layer_popup.text_type.ver2 {padding:15px; padding-bottom:56px;}
        .layer_popup.text_type.ver2 .mb {display:none;}
        .layer_popup.text_type.ver2 .pop_ti_ver2::before {padding-bottom:15px;}
}

/*모바일 백신 알린 레이어*/
.vaccine_screen{ position: absolute; z-index: 9999; top: 0; left: 0;  width: 100%; height: 100%; background:rgba(0,0,0,0.5);  padding: 0 10%;}
.vaccine_screen .ti{ display: inline-block; padding: 20px;  width: 100%; color: #fff; font-size: 30px; font-weight: 700; text-align: center; line-height: 1.4em; transform: translateY(200px); background: #377cff; }

@media screen and ( max-width:380px){
    .vaccine_screen .ti{  font-size: 24px;}
}

/*logo_area*/
.logo_area { height: 101px; }
.logo_area .wsize {padding: 0 20px;}
.logo_area .top_logo{ position: absolute; left: 20px; top: 30px; z-index: 100;}
.logo_area .top_logo a {display: block;}
.logo_area .top_logo img {}

/*나의예약 버튼*/
/* .logo_area .tool_btn .my_reservation{ position: relative; display: inline-block; width: 151px; height: 36px; line-height: 36px; background: #ededed; font-size: 16px; border-radius: 20px; padding-left: 36px; color: #003669; vertical-align: middle; transition: background-color 0.3s;}
.logo_area .tool_btn .my_reservation:hover{ background: #df2e4b; color: #fff; }
.logo_area .tool_btn .my_reservation:before{ content: ""; display: block; width: 24px; height: 24px; position: absolute; top: 6px; left: 6px; background: url("/images/common/ico_c_check.png") no-repeat 0 0; }
 */


/* util_area */
.util_area {padding: 33px 0 34px; height: 101px; text-align: right;}

 /* util_area - 검색영역 */
.top_srch_area { display: inline-block; vertical-align: middle; }
.top_srch_area .top_srch_wrap{ position: relative; display: inline-block; }
.top_srch_area .top_srch_bx { padding: 0 0 0 20px; width: 360px; height: 40px; display: inline-block; color: #666666; background: #f5f5f5; border-radius: 20px; border: 0; z-index: 100; }
.top_srch_area .top_srch_btn { position: absolute; right:2px; top: 2px; display: block; width: 36px; height: 36px; background: url(/images/common/ico_top_srch.png) no-repeat center center; background-color: #006aee; border-radius: 18px; /*transition: background-color 0.3s;*/ }
.top_srch_area .top_srch_btn:hover{ background-color: #0056cc;}
.top_srch_area .top_srch_btn.on{ background: url(/images/common/ico_top_sch_x.png) no-repeat center center; }
.top_srch_area .top_srch_btn.on:hover{ background-color: #ededed;}
.top_srch_area .btn_srch_map { margin-left: 2px; padding: 10px 14px; display: inline-block; font-size: 15px; color: #006aee; font-weight: 400; border: 1px solid #006aee; border-radius: 18px; vertical-align: middle; letter-spacing: -0.05em;}

.util_area .util_right { margin-left: 30px; display: inline-block; vertical-align: middle;}
.util_area .util_right > li{ position: relative; float: left;}
.util_area .util_right > li:not(:first-of-type) { margin-left:10px; padding-left:10px;}
.util_area .util_right > li:not(:first-of-type):before { content: ''; position: absolute; top: 50%; left: 0; display: block; width: 2px; height: 2px; background: #d5d5d5; transform: translateY(-50%);}
.util_area .util_right > li > a{ display: inline-block; height: 34px; line-height: 34px; font-size: 15px; color: #222;}
.util_area .util_right > li > a.red{color: #e30070; font-weight: 400;}


/*모바일 네비게이션 열기 버튼*/
.mobile_navi_toggle { display: none; position: relative; width: 38px; height: 36px; margin-left: 38px; vertical-align: middle; }
.mobile_navi_toggle > span{ position: absolute; top: 1.656vw; right: 0; display:block; width: 5.938vw; height: 4px; background: #222; }
.mobile_navi_toggle > span.bar1{ margin-top: -2.500vw; }
.mobile_navi_toggle > span.bar2{ }
.mobile_navi_toggle > span.bar3{ margin-top: 2.500vw; }



@media screen and ( max-width:1280px){
    .util_area {padding: 30px 0 30px;}
    .top_srch_area .top_srch_wrap .top_srch_bx {display: none;}
    .top_srch_area .top_srch_btn {position:inherit;right: unset; top: unset; width: 40px; height: 40px; background: url(/images/common/ico_btn_srch_bk.png) no-repeat center center;background-size: cover; border-radius: 0;}
    .top_srch_area .btn_srch_map {display: none;}
    .top_srch_area .voiceRcg {display: none;}
    .top_srch_area .top_srch_btn:hover{ background-color: unset;}

}

@media screen and ( max-width:768px){
    .util_area {padding: 30px 0;}
    .mobile_navi_toggle > span{ top: 2.656vw;}

}

@media screen and ( max-width: 640px){
    .logo_area {height: 18.750vw;}
    .logo_area .top_logo {top: 5.469vw;left:1.563vw;}
    .top_logo img {width: 32.656vw;}
    .util_area {padding:6.250vw 0;height: 18.750vw;}
    .top_srch_area .top_srch_btn {width: 6.250vw; height: 6.250vw;}
    .mobile_navi_toggle {margin-left: 5.938vw; width: 5.938vw; height: 5.625vw;}
    .mobile_navi_toggle > span {background: #222; height: 4px;}

}

@media screen and ( max-width:360px){
    .util_area {padding:19px 0px;}
    .top_srch_area .top_srch_btn {width: 22px; height: 22px;}
    .mobile_navi_toggle > span{width: 21px; height: 2px;}
    .mobile_navi_toggle > span.bar1{ margin-top: -2.500vw; }
    .mobile_navi_toggle > span.bar3{ margin-top: 2.500vw; }

}
@media screen and ( max-width:280px){
    .util_area {padding:14px 0px;}
    .mobile_navi_toggle{margin-top:-2px}
}



/*gnb*/
.gnb_area{ position: absolute; top: 101px; left: 0; z-index: 90; width: 100%; height: 60px; overflow: hidden; background: #003caa; }
/*
.gnb_area .bar{ position: absolute; top: 70px; left: 0px; width: 80px; height: 3px; background: #425e9c; opacity: 0; transition: all 0.3s;}
.gnb_area .bar.on{ opacity: 1;}
*/
.gnb_area .bg_box{ position: absolute; top: 60px; z-index: -1; width: 100%; min-height: 250px;  background: url(/images/common/bg_gnb_img1.png) no-repeat -180px -80px; background-color: #fff;}
/* .gnb_area .bg_box:before{ content: ""; display: block; position: absolute; top: 0; left: 0;  width: 100%; height: 100%; background-color: #fff;  } */
.gnb_area .bg_box > .bg_img1{ position: absolute; bottom: -35px; left: 50%; margin-left: -640px; width: 160px; height: 200px; background: url(/images/common/bg_gnb_img_tree.png) no-repeat 0 0; background-size: contain; }
.gnb_area .bg_box > .bg_img2{ position: absolute; bottom: -20px; left: 50%; margin-left: 250px; width: 580px; height: 200px; background: url(/images/common/bg_gnb_img_infi.png) no-repeat 0 0; }


.gnb_area .gnb_wrap{ }
.gnb_area .gnb_wrap > .depth1{ width: 100%; height: 60px; }
.gnb_area .gnb_wrap > .depth1:after{ content: ""; display: block; clear: both;}
.gnb_area .gnb_wrap > .depth1 > li{ position: relative; float: left; width: 20%; text-align: center;} /* -- width: 16.6%;*/
.gnb_area .gnb_wrap > .depth1 > li:hover,
.gnb_area .gnb_wrap > .depth1 > li:focus { background-color: #002b84; }
.gnb_area .gnb_wrap > .depth1 > li > a{ display: block; padding: 20px 0; color: #fff; font-size: 20px; font-weight: 500; text-decoration: none; line-height: 1em;  letter-spacing: -0.05em;}
.gnb_area .gnb_wrap > .depth1 > li > .innerWrap{display: none; position: absolute; top: 60px; left: 0px;  width: 100%;  height: 345px; border-left: 1px solid #eee;}
.gnb_area .gnb_wrap > .depth1 > li > .innerWrap:hover,
.gnb_area .gnb_wrap > .depth1 > li > .innerWrap:focus {background-color: #f0f6fd;}
.gnb_area .gnb_wrap > .depth1 > li.gnb_map > .innerWrap > img { margin: 10% 0; width:70%; height: auto;}
.gnb_area .gnb_wrap > .depth1 > li:last-of-type > .innerWrap {border-right: 1px solid #eee;}
/* .gnb_area .gnb_wrap > .depth1 > li > .innerWrap > .ti{ position: absolute; top: 50px; left: 0px; width: 240px; font-size: 28px; font-weight: 500; letter-spacing: -0.05em; color: #fff; }
.gnb_area .gnb_wrap > .depth1 > li > .innerWrap > .ti:before{ content: ""; position: absolute; top: -20px; display: block; width: 40px; height: 3px; background:#fff; } */
.gnb_area .gnb_wrap > .depth1 > li > .innerWrap > .depth2{ padding: 20px 0; width: 100%; height: 100%; font-size: 0;  }


.gnb_area .gnb_wrap > .depth1 > li > .innerWrap > .depth2 > li{ padding: 0 10px; vertical-align: top; position: relative; width:100%; text-align: left; word-break: keep-all;}
.gnb_area .gnb_wrap > .depth1 > li > .innerWrap > .depth2 > li > a{ display: block; padding: 10px 15px; font-size: 16px;  color: #444; line-height: 1em; text-decoration: none; transition: all 0.3s; letter-spacing: -0.05em; border-radius: 19px;}
.gnb_area .gnb_wrap > .depth1 > li > .innerWrap > .depth2 > li.on > a{ color: #fff; position:relative; background: #002b84;}
.gnb_area .gnb_wrap > .depth1 > li > .innerWrap > .depth2 > li.on > a:after {content:''; position:absolute; right: 15px; top: 12px; width: 7px; height: 13px; background: url(/images/common/btn_ico_arrow.png) no-repeat 0 0; background-position: -4px -43px; }

.gnb_area .gnb_wrap > .depth1 > li > .innerWrap > .depth2 > li > .depth3{ padding: 10px 0px 15px 0px; }
.gnb_area .gnb_wrap > .depth1 > li > .innerWrap > .depth2 > li > .depth3 > li{ position: relative; padding:0 10px;}
.gnb_area .gnb_wrap > .depth1 > li > .innerWrap > .depth2 > li > .depth3 > li:before{ content: ""; position: absolute; top: 14px; left: 10px; width: 3px; height: 3px; background: #b8b8b8;}
.gnb_area .gnb_wrap > .depth1 > li > .innerWrap > .depth2 > li > .depth3 > li > a{ display: block; min-height: 14px; padding: 5px 0 5px 8px; color: #666; font-size: 14px; letter-spacing: -0.05em;  }
.gnb_area .gnb_wrap > .depth1 > li > .innerWrap > .depth2 > li > .depth3 > li > a:hover{ color: #425e9c;  }






.gnb_area .depth1 > li > a > .new_win{ display: inline-block; width: 18px; height: 18px; margin-left: 8px; background: url(/images/common/ico_outLink.png) no-repeat 0 0;}
.gnb_area .depth2 > li > a > .new_win{ display: inline-block; width: 13px; height: 13px; margin-left: 5px; background: url(/images/common/ico_newwin.png) no-repeat 0 0;}
.gnb_area .depth2 > li > a:hover > .new_win,
.gnb_area .depth2 > li.on > a > .new_win{ background-position: -33px 0;}
.gnb_area .depth3 > li > a > .new_win{ display: inline-block; width: 13px; height: 13px; margin-left: 5px; background: url(/images/common/ico_newwin.png) no-repeat 0 0;}

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

    /* .gnb_area .gnb_wrap > .depth1 > li > a{  padding: 20px 8px 40px;  font-size: 19px;}
    .gnb_area .gnb_wrap > .depth1 > li > .innerWrap{  padding-left: 20%;  background-size:190px auto;   }  */
    .gnb_area .gnb_wrap > .depth1 > li > .innerWrap > .ti{ width: 180px; font-size: 24px; }
    .gnb_area .gnb_wrap > .depth1 > li > .innerWrap > .depth2{ width: 100%; }
    .gnb_area .gnb_wrap > .depth1 > li > .innerWrap > .depth2 > li{ margin-bottom: 7px; padding-right: 7px;  }
    .gnb_area .gnb_wrap > .depth1 > li > .innerWrap > .depth2 > li > a{ font-size: 15px; }
}
@media screen and ( max-width:1200px){
    .gnb_area .bg_box > .bg_img1{ margin-left: -580px; }
    .gnb_area .gnb_wrap > .depth1 > li > .innerWrap > .depth2 > li > a{  letter-spacing: -0.05em; padding-right: 4px;}
    .gnb_area .gnb_wrap > .depth1 > li > .innerWrap > .depth2 > li > .depth3 > li > a{ font-size: 13px;}
}
@media screen and ( max-width:1070px){
    .gnb_area{display: none;}
    .util_area .util_right {display: none;}
    .mobile_navi_toggle {display: inline-block;}
}





/*mobile_navi_area*/
.mobile_navi_mask{ display: none; position: absolute; top: 0; left: 0; z-index: 1000;  width: 100%; height: 100%; background:rgba(0,0,0,0.5);}
.mobile_navi_mask.on{ display: block;}

/*모바일 navi*/
#m_gnb{ position: fixed; display: none; z-index: 1100; top: 0px; right: -100%; width: 400px; height: 100%; overflow-y: auto; background: #fff;  }
#m_gnb.on{ display: block;}

#m_gnb .top{ position: relative; height: 60px; background: #003caa; }
#m_gnb .top h2{ padding-top: 20px; padding-left: 20px; color:#fff; font-size: 18px;  font-weight: 500; }

#m_gnb .btn_gnb_close{display:block; position:absolute; top:18px; right:18px; width:30px; height:30px; }
#m_gnb .btn_gnb_close span{display:inline-block; width:27px; height:2px; transform:rotate(45deg); background:#fff;}
#m_gnb .btn_gnb_close .bar2{transform:translate(0,-15px) rotate(-45deg);}

#m_gnb .link{ min-height: 70px; padding: 18px;background: #006aee;}
#m_gnb .link > a{ display: inline-block; padding: 9px 10px; color:#fff;border:1px solid #fff;}
#m_gnb .link > a+a{ margin-left: 8px;}
/*로그인 후 버튼*/
#m_gnb .link > a.after_btn{ padding: 9px 10px; color:#fff; border:1px solid #fff; }

#m_gnb .depth1{}
#m_gnb .depth1 a{position:relative;display:block; padding:16px 20px 14px 20px; font-weight:500; font-size:17px; border-bottom:1px solid #d5d5d5;color: #222;}
#m_gnb .depth1 > li > a.on{color:#003caa;}
#m_gnb .depth1 > li > a:after { content:''; position:absolute; top: 50%; right: 20px; display:block; width: 18px; height: 10.5px; transform: translateY(-50%);background:url(/images/common/ico_m_menu.png) no-repeat 0% 0%;background-size: 100% auto; }
#m_gnb .depth1 > li > a.on:after { background-position: 0% 112%; }

/*#m_gnb .on + .depth2{display:block;}*/
#m_gnb .depth2{display:none; background:#f6f6f6;}
#m_gnb .depth2 a{padding:10px 0 10px 40px; margin:0; font-size:15px; color:#444; background:#f5f5f5;}
#m_gnb .depth2 a:hover,
#m_gnb .depth2 a:focus{color:#333; background:#fcfcfc;}
#m_gnb .depth3{display:block; padding:0;}
#m_gnb .depth3 a{position:relative; padding:10px 0 10px 60px; font-size:13px; font-weight:300; color:#666;}
#m_gnb .depth3 a:before{content:''; display:block; position:absolute; top:50%; left:54px; width:3px; height:3px; margin-top: -1px; background:#8c8c8c;}
#m_gnb .depth2 .on a[target="_blank"]:after,
#m_gnb .depth2 a[target="_blank"]:hover:after,
#m_gnb .depth2 a[target="_blank"]:focus:after{background-position:0 -75px;}

#m_gnb .depth1 > li > a > .new_win,
#m_gnb .depth2 > li > a > .new_win,
#m_gnb .depth3 > li > a > .new_win{ display: inline-block; width: 13px; height: 13px; margin-left: 5px; background: url(/images/common/ico_outLink_bk.png) no-repeat 0 0; background-size: cover; vertical-align: bottom;}

@media screen and ( max-width:640px){
    #m_gnb{width: 90%;}
    #m_gnb .top{height: 18.750vw;}
    #m_gnb .top h2{ padding: 5.469vw 6.250vw 7.656vw;font-size: 5.625vw;line-height: 1em;}

    #m_gnb .btn_gnb_close {top: 7.813vw;right: 7.031vw;width: 6.250vw; height: 6.250vw;}
    #m_gnb .btn_gnb_close span{width: 7.969vw;height: 0.781vw;}

    #m_gnb .link{ min-height: 18.438vw; padding: 4.063vw 5.938vw; font-size: 0; }
    #m_gnb .link > a, #m_gnb .link > a.after_btn { padding: 2.656vw 2.813vw; font-size: 4.375vw; border:2px solid #fff; line-height:1em;}
    #m_gnb .link > a + a {margin-left: 3.125vw;}

    #m_gnb .depth1 a {padding: 3.594vw 3.125vw 4.219vw 5.781vw;line-height:1em;font-size: 5.625vw;border-bottom: 2px solid #d5d5d5;}
    #m_gnb .depth1 > li > a:after {width: 5.469vw; height: 3.281vw;right:3.125vw;}


    #m_gnb .depth2 a {padding: 3.125vw 3.125vw 3.125vw 12.500vw; font-size: 4.688vw;}
    #m_gnb .depth1 > li > a > .new_win,
    #m_gnb .depth2 > li > a > .new_win,
    #m_gnb .depth3 > li > a > .new_win{width: 5.313vw; height: 5.313vw; margin-left: 2.813vw;}
}


@media screen and ( max-width:360px){
    #m_gnb{width: 90.833vw;}
    #m_gnb .btn_gnb_close {top: 6.111vw;}
    #m_gnb .btn_gnb_close span {height: 3px;}
    #m_gnb .link > a, #m_gnb .link > a.after_btn {border: 1px solid #fff;}
    #m_gnb .depth1 a {border-bottom: 1px solid #d5d5d5;}
    #m_gnb .depth1 > li > a > .new_win, #m_gnb .depth2 > li > a > .new_win, #m_gnb .depth3 > li > a > .new_win {width: 5.278vw;height: 5.278vw;}
}



/*footer*/
footer .foot1{ padding: 20px 18px; background-color: #455062; }
footer .foot1 .wsize {}

/*관련기관 바로가기*/
footer .foot1 .relation_link { position: absolute; top: 0; right: 0;}
footer .foot1 .relation_link > .ti { position: relative; z-index: 1; display: inline-block; margin-bottom: 0; padding: 12px 20px; min-width: 260px; height: 40px; color:#fff; font-size: 15px; border: 1px solid #5a697b; background: #455062; border-radius: 20px; transition: all 0.3s; }
footer .foot1 .relation_link > .ti.on { background: #2c3646; border-radius: 0 0 20px 20px; border-top: 0; transition: all 1s;}
footer .foot1 .relation_link > .ti:hover { background: #2c3646;}
footer .foot1 .relation_link > .ti:before { content: ""; position: absolute; top: 50%; right: 10px; margin-top: -10px; width: 20px; height: 20px; background: url(/images/common/ico_drop_arrow_1.png)no-repeat center center; transform: rotate(0deg); }
footer .foot1 .relation_link > .ti.on:before { transform: rotate(180deg);}
footer .foot1 .relation_link > .list { opacity: 95%; display: none; position: absolute; z-index: 1; bottom: 40px; left: 0; width: 100%;  padding: 20px 0; background: #2c3646; border: 1px solid #5a697b; border-bottom: 0; border-radius: 20px 20px 0 0 ;}
footer .foot1 .relation_link > .list > li { }
footer .foot1 .relation_link > .list > li > a { display: block; padding: 10px 10px 10px 20px; color: #fff; font-size: 15px;}
footer .foot1 .relation_link > .list > li > a:hover {text-decoration: underline;}

/*개인정보처리방침 메뉴*/
footer .foot1 .btn_list {padding-right: 270px;}
footer .foot1 .btn_list > li{ margin-right: 30px; position: relative; float: left; }
footer .foot1 .btn_list > li+li { padding-left: 30px; }
footer .foot1 .btn_list > li+li:before{ content: ""; position: absolute; top: 13px; left: 0;  display: inline-block; width: 1px; height: 10px; background: #5a697b;}
footer .foot1 .btn_list > li > a{ display: block; padding: 10px 0; color: #ccc; font-weight: 300; line-height: 1.2em; }
footer .foot1 .btn_list > li > a.pi{ color: #fff;}

/* footer .foot1{ min-height: 220px; background-color: #fff;}
footer .foot1 .wsize{ padding-top: 60px; } */
footer .foot1 .call { position: absolute; top: 45px; right: 290px; background: url(/images/common/ico_foot_call.png) no-repeat 0 0 ; min-height: 60px; padding-left: 80px;}
footer .foot1 .call .ti{ display: block; margin: 4px 0 14px 0; font-size: 22px; }
footer .foot1 .call strong{ font-size: 26px; font-weight: 500; }
footer .foot1 .call .txt{ margin-top: 10px;}
footer .foot1 .call .txt span{ display: block; margin-bottom: 5px; }
footer .foot1 .flogo { position: absolute; top: 60px; right: 0px;}
footer .foot1 .flogo a + a {margin-left: 15px;}
footer .foot1 .flogo img { display: inline-block; height: 64px;}
footer .foot1 address { margin-top: 17px; display: block; line-height: 1.6em; word-break: keep-all;}
footer .foot1 address .addr { display: block; color: #cccccc; }
footer .foot1 .copytxt { display: inline-block; width: 100%; margin-top: 10px; font-size: 13px; color: #ccc;}


/* footer .foot2{ min-height: 220px; background-color: #fff;}
footer .foot2 .wsize{ padding-top: 60px; }
footer .foot2 .call { position: absolute; top: 45px; right: 290px; background: url(/images/common/ico_foot_call.png) no-repeat 0 0 ; min-height: 60px; padding-left: 80px;}
footer .foot2 .call .ti{ display: block; margin: 4px 0 14px 0; font-size: 22px; }
footer .foot2 .call strong{ font-size: 26px; font-weight: 500; }
footer .foot2 .call .txt{ margin-top: 10px;}
footer .foot2 .call .txt span{ display: block; margin-bottom: 5px; }
footer .foot2 .flogo { position: absolute; top: 60px; right: 0px;}
footer .foot2 .flogo img { display: inline-block; margin-left: 15px;}
footer .foot2 address { display: block; margin-right: 52%; line-height: 1.8em; word-break: keep-all;}
footer .foot2 address .addr { display: block; }
footer .foot2 .copytxt { display: inline-block; width: 100%; margin-top: 15px; font-size: 14px; color: #929292;}
 */
@media screen and ( max-width:1276px){
    /* footer .foot2 address { margin-right: 55%; } */
}

@media screen and ( max-width:1070px){

    footer .foot1{ height: auto; padding: 15px 0px; text-align: center;}

    footer .foot1 .relation_link { position: relative; top: 0; display: inline-block; }
    footer .foot1 .relation_link > .ti { text-align: left;}
    footer .foot1 .relation_link > .list > li > a { text-align: left;}

    footer .foot1 .btn_list{ position: static; padding-right:0; text-align: center;}
    footer .foot1 .btn_list > li{ float: none; display: inline-block;}

    footer .foot1 address{text-align:center;}
    footer .foot1 .flogo {margin-top: 10px;position: inherit; top: unset; right: unset;}
    /* footer .foot2{ min-height: 100%; padding-bottom: 60px;}
    footer .foot2 .wsize{ padding-top: 110px; }
    footer .foot2 .call { position: absolute; top: 20px; right: auto; left: 0px; padding-left: 0px; background: none;}
    footer .foot2 .call .ti{ display: inline-block; margin: 10px 0 0 0; }
    footer .foot2 .call strong{ margin-left: 10px; display: inline-block; font-size: 22px; }
    footer .foot2 .call .txt span{ display: inline-block;}

    footer .foot2 .flogo { position: absolute; top: 20px; right: 0px;}
    footer .foot2 address { margin-right: 0;} */

}
@media screen and ( max-width:768px){
/*
    footer .foot1 .relation_link > .ti { font-size: 13px;}
    footer .foot1 .relation_link > .list { padding: 8px 0 60px;}
    footer .foot1 .relation_link > .list > li > a { font-size: 13px;  padding: 10px 10px 10px 15px;}

    footer .foot1 .btn_list > li{ margin-top: 5px; }
    footer .foot1 .btn_list > li+li:before{ top: 3px;}
    footer .foot1 .btn_list > li > a{ font-size: 12px; padding: 10px 5px; }

    footer .foot2 .wsize{ padding-top: 20px; }
    footer .foot2 .call { position: static; padding-left: 0px; background: none; text-align: center; margin-bottom: 10px;}
    footer .foot2 .call .txt span{ margin-bottom: 5px; }

    footer .foot2 .flogo { position: static; text-align: center; margin-bottom: 15px;}
    footer .foot2 .flogo img { width: auto; height: 50px;}
    footer .foot2 address { line-height: 1.5em; font-size: 14px; text-align: center;}
    footer .foot2 .copytxt { font-size: 12px; text-align: center;} */
}
@media screen and ( max-width:640px){

    footer .foot1 {padding: 4.688vw 0 17.969vw; }
    footer .foot1 .relation_link > .ti {font-size:4.688vw; padding:3.438vw 6.250vw; min-width:81.250vw; height:12.500vw; border: 2px solid #5a697b; border-radius: 6.250vw;}
    footer .foot1 .relation_link > .ti.on {border-radius: 0 0 6.250vw 6.250vw;}
    footer .foot1 .relation_link > .ti:before {margin-top:-1.563vw;width: 5.313vw;height: 2.969vw;right:6.250vw;background: url(/images/common/ico_drop_arrow_1_mo.png)no-repeat center center;background-size: cover;}

    footer .foot1 .relation_link > .list {bottom: 12.500vw; padding: 3.125vw 0 5.469vw; border: 2px solid #5a697b; border-bottom: 0; border-radius: 6.250vw 6.250vw 0 0;}
    footer .foot1 .relation_link > .list > li > a {font-size:4.688vw; padding:2.344vw 4.688vw 2.344vw 6.250vw; line-height: 1.3em;}

    footer .foot1 .btn_list {margin-top: 2.344vw;}
    footer .foot1 .btn_list > li {margin-right: 0;}
    footer .foot1 .btn_list > li + li {margin-left: 2.813vw;padding-left:3.125vw;}
    footer .foot1 .btn_list > li+li:before {top: 2.188vw;width: 2px; height:3.125vw; }
    footer .foot1 .btn_list > li > a {font-size:3.750vw; }

    footer .foot1 .flogo {margin-top: 3.125vw;}
    footer .foot1 .flogo a + a {margin-left: 5.469vw}
    footer .foot1 .flogo img {height: 20vw;}

    footer .foot1 address {margin-right: 0;margin-top:5.469vw;font-size: 4.375vw;}
    footer .foot1 address .addr {line-height: 1.5em; letter-spacing: -0.02em;}

    footer .foot1 .copytxt {margin-top: 3.125vw;padding: 0 3.125vw;font-size: 3.750vw;line-height: 1.5em; letter-spacing: -0.02em;}


    /* footer .foot2 .wsize{ padding-top: 20px; }
    footer .foot2 .call .ti{ font-size: 18px; }
    footer .foot2 .call strong{ font-size: 18px; }
    footer .foot2 .call .txt{ font-size: 13px;}

    footer .foot2 .flogo img { width: auto; height: 45px;}
    footer .foot2 .copytxt { width: 100%; font-size: 12px; text-align: center;}   */
}

@media screen and ( max-width:375px ){
    footer .foot1 .btn_list > li + li:before {top: 50%;width:1px;height: 8px;margin-top: -4px;}
}

@media screen and ( max-width:360px){
    footer .foot1 .relation_link > .ti {border: 1px solid #5a697b;}
    footer .foot1 .relation_link > .list {border: 1px solid #5a697b; border-bottom : 0;}
    footer .foot1 .btn_list {margin-top:1.111vw;}
    footer .foot1 .btn_list > li > a {padding: 2.222vw 0;}


}





/*===================================== 서브 레이아웃 ==================================*/


/*sub_visual_area*/
.sub_visual_area {display:none;}


/*single_visual_area 회원가입, 로그인, 아이디비밀번호찾기, 예약step 의 서브비쥬얼*/
.single_visual_area {display:none;}
.single_visual_area{ margin-top: 60px; position: relative; height: 110px; background: url(/images/common/bg_sub_visual.png) no-repeat 0 0; overflow: hidden;}
.single_visual_area .txt{ padding: 39px 0;line-height: 1em; font-size:32px; color: #222; text-align: left; letter-spacing: -0.08em}

.single_visual_area .con_2 {position: absolute;right: 0px;top: 40px;}
.single_visual_area .con_2 .locate {margin-top: 6px;font-size: 0;}
.single_visual_area .con_2 .locate > li{ position: relative; font-size: 14px; display:inline-block; }
.single_visual_area .con_2 .locate > li+li{ padding-left: 24px; }
.single_visual_area .con_2 .locate > li+li:before{ content: ""; display:inline-block; width: 6px; height: 11px; position: absolute; top: 3px; left: 12px; background: url(/images/common/ico_gap_arrow.png) no-repeat 0px center;}
.single_visual_area .con_2 .locate > li:first-child{ position: relative; top: 2px;  width: 17px; height: 15px; background: url(/images/common/ico_locate_home2.png) no-repeat center center; }



@media screen and ( max-width:1300px){
}
@media screen and ( max-width:1070px){
    .single_visual_area{ position: relative; height: 100px; background: url(/images/common/bg_sub_visual.png) no-repeat 0 0; overflow: hidden;}
    .single_visual_area .txt{ font-size:28px; color: #222; line-height: 1em; text-align: center; }
}
@media screen and ( max-width:768px){
	.sub_title_area .con_2 .locate > li+li:before{top:1px}
}
@media screen and ( max-width:550px){
    .single_visual_area .txt{ font-size:26px;}
}




/*snb_area*/
.sub_visual_area + .snb_area{ margin-top: 10px;}
.snb_area.on{ margin-top: 60px;}
.snb_area{ position: relative; height: 50px; background: #0b397f; color: #fff;}
.snb_area:before{ content: ""; display: block; height: 50px; background: #006aee; color: #fff;}

.snb_area .depth2{ position: absolute; top: 0; left: 0;  width: 100%; height: 50px; text-align: center;}
.snb_area .depth2 > li{display: inline-block;margin: 0 25px;}
.snb_area .depth2 > li > a{position: relative;display: inline-block;padding: 17px 0px;font-size: 18px;font-weight: 300;color: #c3deff;vertical-align: middle;}
.snb_area .depth2 > li > a:hover {text-decoration: none;}
.snb_area .depth2 > li > a:before{ content: ""; position: absolute; top: 38px; left: 50%;  display: block; width: 0%; height: 2px; background: #f3f3f3; transition: all 0.3s; transform: translateX(-50%)}
.snb_area .depth2 > li.on > a{ font-weight: 500; color: #fff; }
.snb_area .depth2 > li.on > a:before{width: 100%;}

.snb_area .depth2 > li > .depth3{ display: none; position: absolute; top: 60px; left: 0; width: 100%; height: 50px; text-align: center; }
.snb_area .depth2 > li > .depth3 > li{ display: inline-block; }
.snb_area .depth2 > li > .depth3 > li+li:before{ content: ""; display: inline-block; position: relative; top: 0px;  width: 1px; height: 12px; background: #d9d9d9; vertical-align: middle;}
.snb_area .depth2 > li > .depth3 > li > a{ position: relative; display: inline-block; padding: 18px; font-size: 16px; color: #666; vertical-align: middle;}
.snb_area .depth2 > li > .depth3 > li > a:before{ content: ""; position: absolute; top: 49px; left: 50%; display: block; width: 0%; height: 2px; background: #425e9c;  transition: all 0.3s; transform: translateX(-50%)}
.snb_area .depth2 > li.on > .depth3{display: block;}
.snb_area .depth2 > li > .depth3 > li.on > a{ color: #425e9c;}
.snb_area .depth2 > li > .depth3 > li.on > a:before{ width: 100%;}
/*.snb_area .depth2 > li > .depth3 > li > a:hove{ width: 100%;}*/

@media screen and ( max-width:1300px){
    .snb_area .depth2 > li > a {padding: 17px 0;color:#c3deff;font-size: 18px;}
    .snb_area .depth2 > li > .depth3 > li > a{ padding: 18px 10px; font-size: 15px; }
}
@media screen and ( max-width:1070px){
    .snb_area{ display: none;}

}
@media screen and ( max-width:768px){

}


/* sub_gnb */
.sub_top_area {position:relative;}
.sub_top_area .sub_title_area {margin-top: 0;height: 240px;}
.sub_top_area .sub_title_area .wsize {height: 100%;}
.sub_top_area .sub_title_area .sub_title {top: 88px;font-size: 40px; color:#fff;text-align: center; letter-spacing: -0.05em;}
.sub_top_area .sub_gnb_area {position: absolute; bottom:0; left: 50%; transform: translateX(-50%); width: 100%;}
.sub_top_area .sub_gnb_area .sub_gnb_wrap > .depth1 {text-align:center;}
.sub_top_area .sub_gnb_area .sub_gnb_wrap > .depth1 > li {display: inline-block; float: none; width: 17.3%;background:#003caa;border-radius: 5px 5px 0 0;}
.sub_top_area .sub_gnb_area .sub_gnb_wrap > .depth1 > li > a {display: block;padding: 20px 0;color: #fff;font-size: 20px;font-weight: 500;text-decoration: none;line-height: 1em;letter-spacing: -0.05em;}
.sub_top_area .sub_gnb_area .sub_gnb_wrap > .depth1 > li.on {background: #fff;}
.sub_top_area .sub_gnb_area .sub_gnb_wrap > .depth1 > li.on a {color:#003caa;}


/*==========================  sub_body =======================*/
/*서브타이틀, 로케이션*/
.sub_title_area{position: relative; height:110px; padding:0; background:#f0f6fd url(/images/common/bg_sub_visual.png) no-repeat 50% 50% }
.snb_area ~ .sub_title_area {margin-top:0;}
.sub_title_area .wsize{ height:110px; }
.sub_title_area .sub_title{ position:relative; top:37px; font-size:32px; color:#222; font-weight: 500; line-height: 1em;}
.sub_title_area .con_2{ position: absolute; right: 0px; top: 40px;}
.sub_title_area .con_2 .locate{ margin-top: 6px; font-size: 0; }
.sub_title_area .con_2 .locate > li{ position: relative; font-size: 14px; display:inline-block; }
.sub_title_area .con_2 .locate > li+li{ padding-left: 24px; }
.sub_title_area .con_2 .locate > li+li:before{ content: ""; display:inline-block; width: 6px; height: 11px; position: absolute; top: 3px; left: 12px; background: url(/images/common/ico_gap_arrow.png) no-repeat 0px center; background-size: cover;}
.sub_title_area .con_2 .locate > li+li:after{content:"";display:inline-block;}
.sub_title_area .con_2 .locate > li:first-child{ position: relative; top: 2px;  width: 17px; height: 15px; background: url(/images/common/ico_locate_home2.png) no-repeat center center; background-size: cover;}
.sub_title_area .con_2 .in_btn{ float: right; font-size: 0; margin-left: 30px;}
.sub_title_area .con_2 .in_btn > li{  font-size: 13px; display: inline-block;}
.sub_title_area .con_2 .in_btn > li+li{  margin-left: -1px;}
.sub_title_area .con_2 .in_btn > li a{ display: block; width: 40px; height: 40px; border: 1px solid #d9d9d9;}
.sub_title_area .con_2 .in_btn > li.btn_sns_open a{ background: url(/images/common/ico_sns_link.png) no-repeat center center; }
.sub_title_area .con_2 .in_btn > li.btn_print a{ background: url(/images/common/ico_print.png) no-repeat center center; }

@media screen and (max-width:1070px){
    /*서브타이틀, 로케이션*/
    .sub_title_area{ position: relative; height: 100px;  margin-top: 0; padding-top: 20px; background: #d9e7fa; text-align: center;}
    .sub_title_area .wsize{ height: auto; }
    .sub_title_area .sub_title{ position: relative; top: 0px; font-size: 30px; color: #222; font-weight: 500; text-align: center; line-height: 1em; letter-spacing: -0.05em;}
    .sub_title_area .con_2{ position: static; display: inline-block; }
    .sub_title_area .con_2 .locate{ float: left; margin-top: 12px; font-size: 0; }
    .sub_title_area .con_2 .locate > li+li{ padding-left: 14px; }
    .sub_title_area .con_2 .locate > li+li:before{  top: 3px; left: 5px;}

    .sub_title_area .con_2 .in_btn{ float: right; margin-left: 15px;}
    .sub_title_area .con_2 .in_btn > li.btn_print{ display: none;}
    .sub_title_area .con_2 .in_btn > li > a{ border-radius: 40px;}
}
@media screen and ( max-width:768px){
    .sub_title_area {height: 31.250vw; padding-top: 6.250vw; background: url(/images/common/bg_sub_visual_mo.png) no-repeat 0 0;background-size:cover;}
    .sub_title_area .sub_title{ font-size: 8.125vw; letter-spacing: -0.08em;}
    .sub_title_area .con_2 .locate {margin-top: 2.813vw;}
    .sub_title_area .con_2 .locate > li {font-size: 4.375vw;}
    .sub_title_area .con_2 .locate > li:first-child {top: 0.625vw; width:5.313vw; height:4.688vw;}
    .sub_title_area .con_2 .locate > li+li {padding-left: 8.438vw;}
    .sub_title_area .con_2 .locate > li+li:before {width:2.344vw; height:4.375vw; top: -0.938vw; left: 2.969vw; }
}
@media screen and ( max-width:640px){
    .sub_title_area .con_2 .locate > li+li:before {top: -0.278vw;}
}



/*--------서브 컨텐츠*/
.sub_cnt_area{ min-height: 800px; background: #fff; /*overflow:auto;*/ padding-top: 1px;}
.sub_cnt_area .article{ margin: 45px auto; } /*기본 article*/
.sub_cnt_area .paragraph{ margin: 45px auto;} /*기본 문단 구분*/


/*.sub_cnt_area .wsize:first-child{ padding-top: 50px;}*/
.sub_cnt_area .wsize:last-child{ padding-bottom: 60px;}

/*컨텐츠 전체 배경 설정*/
/*회원가입, 로그인, 아이디비밀번호찾기, 예약step 의 서브비쥬얼인 경우 .sub_cnt_area 에 .bg_gray 를 붙여서 사용함*/
.sub_cnt_area.bg_gray{ background: #fafafa;   padding-top: 1px;}

@media screen and (max-width:768px){
    .sub_cnt_area{ min-height: 250px;}
    .sub_cnt_area article.article{ margin: 45px 0;}
    .sub_cnt_area .paragraph{ margin: 30px auto;}
    /*.sub_cnt_area .wsize:first-child{ padding-top: 50px;}*/
    .sub_cnt_area .wsize:last-child{ padding-bottom: 40px;}
}

@media screen and (max-width:640px){
    .sub_cnt_area .wsize:last-child{ padding-bottom: 17.969vw;}
}

@media screen and (min-width:640px){
    .w_banner_img {display: block;}
    .m_banner_img {display: none;}
}
@media screen and (max-width:640px) {
    .w_banner_img {display: none;}
    .m_banner_img {display: block;}
}