@charset "utf-8";

/*=================모바일 및 기본 세팅===================*/
html,body{  position:relative; overflow-x:hidden }
html.open,body.open{ overflow: hidden;}
#skiptoContent { display:block; margin:0; padding:0; z-index:2000}
a.quick_menu {display:block; font-size:1em; left:0; text-align:center; top:-10000px; position:absolute; width:100%; z-index:500;}
a.quick_menu:hover, a.quick_menu:focus, a.quick_menu:active {background:none repeat scroll 0 0 #404b64; color:#fff; font-weight:bold; height:40px; padding:10px 0; position:absolute; top:0; z-index:4000;}

.sprite{ background-image:url("/home/jeonil/images/common/sprite_m.png"); background-repeat: no-repeat; background-size:742px }
.container{ max-width:640px; margin:0 auto}

#header_area { padding:15px; }
#header_area .tnb_wrap{ display:none; }

#header_area .logo{ position:relative; display:inline-block;   z-index: 3001 }
#header_area .logo a{ display:block; width:62px; height:45px; text-indent: -9999px; background-size:600px;  }
#header_area .logo.open a{ width:50px; background-position:-440px 0; transition:all 0s ease 0.3s}

#header_area .site_link_wrap,#header_area .util_menu_wrap{ display:none }

.m_menu{position:absolute;right:15px;top:15px;padding:10px;width:40px;height: 39px;background:#062e58; border-radius: 3px;  z-index:3001;}
.m_menu span{display:inline-block;text-indent:-9999px;width:20px;height:3px;margin-top: 8px;border-radius:15px;background:#fff;}
.m_menu:before,.m_menu:after{ position:absolute; right:10px; display:block; content:"";  height:3px; border-radius:10px; background:#fff;  transition:0.2s}
.m_menu:before{ top:10px; width:20px; }
.m_menu:after{ bottom:10px; width:20px;}
.m_menu.open span{ width:0px; }
.m_menu.open:before{ width:20px; top: 18px; transform:rotate(45deg); transition:0.2s; }
.m_menu.open:after{ top: 18px; transform:rotate(-45deg); transition:0.2s; }

.m_gnb{ position:fixed; left:0; bottom:-200%;  width:100%; height:100%;   background:#fff;  z-index:3000; transition: cubic-bezier(.2,.62,.51,.9) 0.3s }
.m_gnb.open{  bottom:0; }
.m_gnb .m_login_box{ display:table; width:100%; border-top:#1a3e87 solid 1px;   border-bottom:#1a3e87 solid 1px; background:#243558; }
.m_gnb .m_login_box > a{ display:table-cell; width:50%; color:#fff; padding:15px 0; border-right:#000 solid 1px;  font-size:0.75em; font-weight:bold; text-align:center }
.m_gnb .m_login_box > a.m_join{ border-right:0 ;}
.m_gnb > ul{ position:relative; background:#062E58;  width:40%; padding-top:70px;  }
.m_gnb > ul > li.open > a{ background:#fff; color:#062E58;   }
.m_gnb > ul > li > a{ position:relative; display:block; font-size:1.2em; font-weight:bold; padding:20px 20px; background:#062E58; color:#fff;    }
.m_gnb > ul > li > ul{ display:none; position:absolute; top:70px; right:-150%; width:150%; padding:0 15px; overflow-y:scroll }
.m_gnb > ul > li > ul > li > a{ position:relative; display:block; padding:20px 20px 20px 10px; background:#fff; font-size:1em; font-weight:bold; border-bottom:#d1d1d1 solid 1px;  }
.m_gnb > ul > li > ul > li > ul{ display:none;  padding:5px 0; }
.m_gnb > ul > li > ul > li > ul > li > a{ display:block; padding:12px 20px; font-size:0.9em; font-weight:bold;   }
.m_gnb ul ul li.has_sub > a:before,.m_gnb ul ul li.has_sub > a:after{ position:absolute; content:"";  background-color:#4c4c4c; }
.m_gnb ul ul li.has_sub > a:before{ width:14px; height:2px; top:50%; right:8px; transform:translateY(-50%);  }
.m_gnb ul ul li.has_sub > a:after{ width:2px; height:14px; top:50%;  right:14px ; transform:translateY(-50%);  }
.m_gnb ul ul li.has_sub.open > a:after{ display:none }

.gnb{ display:none }

.total_banner{ padding:15px; background:#f9f9f9 }
.total_banner .total_title{ position:relative; margin-bottom:20px; }
.total_banner .total_title h3{ font-size:16px; font-weight:500 }
.banner_ctrl{ position:absolute; right:0; top:0; padding:0; }
.banner_ctrl a{ margin:0 5px;  }
.banner_list li{ float:left; font-size:18px; margin:0 15px }
.banner_list li a{  display:flex; align-items:center; min-height:50px;  line-height:1.3;  transition:0.3s  }
.banner_list li a:hover{ color:#000; font-weight:500; transition:0.3s} 

.bottom_links:after{ display:block; clear: both; content:""}
.bottom_links .link_wrap{ position:relative; float:left; width:50%; background:#4f4f4f; }
.bottom_links .link_wrap a{ position:relative; display:block; font-size:14px; padding:15px 20px; color:#c5c5c5 }
.bottom_links .link_wrap a i{ position:absolute; right:10px; top:50%; transform:translateY(-50%) }
.bottom_links .link_wrap ul{ display:none; position:absolute; bottom:37px; width:100%; max-height:250px; overflow-y:auto; padding:10px; background:#4f4f4f;  }
.bottom_links .link_wrap ul li a{ display:block; padding:5px; font-size:14px;  }

.copyright{ padding:20px 0 50px; background:#353535; text-align: center;  }
.copyright p{ font-size:12px; color:#aeaeae; line-height: 1.3 }
.logo_bottom{  display:inline-block; width:62px; height:45px; margin-bottom:20px;  text-indent: -9999px; background-size:600px; background-position:-58px 0; transition: cubic-bezier(.2,.62,.51,.9) 0.3s }
.bottom_menu{ margin-bottom:20px; }
.bottom_menu li{ display:inline-block; font-size:14px;   }
.bottom_menu li:nth-child(1) a{font-size:17px;}
.bottom_menu li a{ display:block; color:#aeaeae; padding:5px 10px; }
.copyright .go_top{display:none;}

@media all and (min-width:1440px) {
	.copyright{ padding:20px 0 100px;}
	.copyright .container{position:relative;}
	.copyright .go_top{display:block; padding-top:16px; color:#fff; background:#221f1f; width:74px; height:74px; top:0px; right:0; position:absolute; border-radius:5px;}
	.copyright .go_top span{display:block;}
}


/*===============서브영역==============*/
#header_area.sub_header_area{ border-bottom:#eee solid 1px; }
#header_area.sub_header_area .m_service_open{ display:none; }
#header_area.sub_header_area .logo{ margin-left:0; }
#header_area.sub_header_area .m_menu{ right:15px; left:auto }

#sub_visual_area{ display:flex; justify-content: center; align-items: center;  flex-direction: column;  height:130px; background-size:cover; background-position:center; }
#sub_visual_area .sub_title{ color:rgba(255,255,255,0.3); margin-bottom:10px; }
#sub_visual_area .title{ color:#fff; font-size:25px; font-weight:bold }

#content_area{ padding:25px 15px 15px; background:#fafafa }

.left_menu{ display:none; }

.content_top{ position:relative; }
.content_top h3{ font-size:22px; color:#161011; margin-bottom:20px;   }
.share_box{ position:absolute; right:0; top:0; }
.share_box .print{ display:none  }
.share_box > ul > li > a{ display:block; width:30px; height:30px; line-height: 29px; text-align: center; font-size:16px; }
.share_box .btn_share{   border-radius: 3px; border:#eee solid 1px;  }
.share_box .sns_share > a{  background:#3F3F3F; color:#fff; border:0; }
.sns_links_wrap{ display:none; position:fixed; width:100%; height:100%;  left:0; top:0; background:rgba(0,0,0,0.8); z-index: 6000 }
.sns_links_wrap .sub_sns_links{ display:block; position:absolute; width:80%; left:10%; right:10%; top:50%; transform:translateY(-50%); padding:20px 10px; border:#eee solid 1px;  background:#fff;  overflow:hidden; z-index: 200}
.sub_sns_links span{ display:block; text-align: center; margin-bottom:20px; font-size:18px;  font-weight:bold  }
.sub_sns_links ul{ text-align: center; }
.sub_sns_links ul li{ display:inline-block;  margin-right:3px; margin-bottom:3px;  }
.sub_sns_links ul li a{ display:block;  width:40px; height:40px; background-size:cover; background-position:center; background-repeat:no-repeat; text-indent: -9999px;  }
.sub_sns_links .sns01{ background-image:url("/home/www/images/sub/sns01_icon.png")}
.sub_sns_links .sns02{ background-image:url("/home/www/images/sub/sns02_icon.png")}
.sub_sns_links .sns03{ background-image:url("/home/www/images/sub/sns03_icon.png")}
.sub_sns_links .sns04{ background-image:url("/home/www/images/sub/sns04_icon.png")}
.sub_sns_links .sns05{ background-image:url("/home/www/images/sub/sns05_icon.png")}
.sub_sns_links .sns_close_btn{ position:absolute; right:20px; top:20px; font-size:20px; color:#2a2a2a }
.sub_sns_links .copy_addr{ text-align: center;  padding:10px 0; overflow: hidden  }
.sub_sns_links .copy_addr .copy_addr_txt{ background:#f7f7f7; min-width:200px; color:#acacac; border:#e5e5e5 solid 1px; font-weight:300;  height:34px; padding:5px;   border-radius: 3px;  }
.sub_sns_links .copy_addr .copy_btn{ background:#1e1e1e; color:#fff; border:0; border-radius: 3px; height:34px; padding:0 10px;  }

.breadcrumb{ margin-bottom:20px; }
.breadcrumb:after{ display:block; content:""; clear: both }
.breadcrumb ul li{ position:relative; float:left; margin-right:12px;  }
.breadcrumb ul li:after{ display:block; position:absolute; right:-10px; top:50%; transform:translateY(-50%); color:#666; content:"\f105"; font-family:"font awesome 5 pro"; font-weight:300; }
.breadcrumb ul li:last-child:after{ display:none;  }
.breadcrumb ul li a{ display:block; font-size:12px; font-weight:500;  }

.con_tab_4depth ul{ position:relative; height:42px;  border-top:#000 solid 1px; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; z-index: 100; overflow:hidden  }
.con_tab_4depth ul:after{ display:block; position:absolute; right:15px; top:11px; color:#fff;   content:"\f078"; font-family:"font awesome 5 pro"; font-weight:900; z-index: 100 }
.con_tab_4depth ul li{ position:absolute; width:100%; font-size:16px;  font-weight:500;  border-bottom:#eee solid 1px; }
.con_tab_4depth ul li a{ display:block; padding:12px 15px 14px; background:#fff; }
.con_tab_4depth ul li.active { z-index:  200 }
.con_tab_4depth ul li.active a{ background:#eb4141; color:#fff; }
.con_tab_4depth ul.open{ overflow:visible }
.con_tab_4depth ul.open li{ position:relative; }

.con_tab_5depth{  margin-bottom:15px; padding-bottom:10px; border-bottom:#eee solid 1px; }
.con_tab_5depth ul:after{ display:block; content:""; clear: both }
.con_tab_5depth ul li{ float:left; margin-right:5px; font-size:14px; font-weight:500;  margin-bottom:5px;  }
.con_tab_5depth ul li a{ display:block; background:#f1f1f1; border:#dadada solid 1px; border-radius: 3px; padding:10px 10px 12px; height:38px;   }
.con_tab_5depth ul li.active a{ background:#313131; color:#fff; border:#313131 solid 1px; }

.content{ margin:20px 0; background:#fff; padding:15px; border:#eee solid 1px;  }


/*===============서브영역 끝==============*/

/*==================
사이즈별 추가코드
==================*/

/*smartphones ( portrait )*/
@media all and (max-width:320px) {

}

/*smartphones ( landscape )*/
@media all and (min-width:321px) and (max-width:360px) {

}

/*smartphones ( landscape )*/
@media all and (min-width:361px) and (max-width:375px) {

}

/*smartphones ( landscape )*/
@media all and (min-width:376px) and (max-width:414px) {

}

/*smartphones ( landscape )*/
@media all and (min-width:415px) and (max-width:480px) {

}

/*tablet( portrait )*/
@media all and (min-width:640px) {



}
@media all and (min-width:641px) and (max-width:767px) {

}

/*=================
태블릿 기본 세팅
===================*/
@media all and (min-width:768px) {

	.container{ max-width:760px; }

	/*==================서브레이아웃 ==========================*/
	.con_tab_4depth ul{ border-left:#eee solid 1px; }
	.con_tab_4depth ul li{ position:relative; float:left; width:25%; border-right:#eee solid 1px;   }
	.con_tab_4depth ul li a{ text-align: center; }

}

/*=================
데스크탑 기본 세팅
===================*/
@media all and ( min-width:1024px){

	.container{ max-width:1000px; }

	.sns_links_wrap .sub_sns_links{ width:570px; left:50%; transform: translateX(-50%) translateY(-50%);  padding:30px; }
	.sub_sns_links span{ font-size:24px; margin-bottom:60px;  }
	.sub_sns_links ul li{ margin:0 5px; }
	.sub_sns_links ul li a{ width:60px; height:60px; }
	.sub_sns_links .copy_addr{ margin-top:20px; }
	.sub_sns_links .copy_addr .copy_addr_txt{ width:80%; }
	.sub_sns_links .copy_addr .copy_btn{ width:15%; cursor: pointer}
	.sub_sns_links .sns_close_btn{ right:30px; top:30px; }

	/*배너모음*/
	.total_banner{ overflow:hidden }
	.total_title{ float:left; width:20%; }
	.banner_ctrl{ position:relative; top:10px;  }
	.banner_list_wrap{ float:right; width:80%; }

}

@media all and ( min-width:1440px){

	.sprite{ background-image:url("/home/jeonil/images/common/sprite.png"); background-repeat: no-repeat; background-size:auto !important }
	.container{ max-width:1280px; }

	#header_area{ padding:0; }
	#header_area .tnb_wrap{ display:block; background:#062e58; padding: 8px 0  }
	#header_area .tnb_wrap:after{ display:block; clear: both; content:" "}
	#header_area .site_link_wrap, #header_area .util_menu_wrap{ display:block; }
	#header_area .site_link_wrap{ position:relative; float:left;  width:380px; height:24px; padding:0 30px 0 10px; background:#052546; border-radius: 30px; word-break: keep-all; overflow:hidden }
	#header_area .site_link_wrap .site_link a{ display:block; float:left; font-size:13px; padding:0 10px; margin:0 5px;  line-height: 25px;   color:#fff;  border-right:#ccc solid 1px;  }
	#header_area .site_link_wrap .site_link a:nth-child(3n){ border-right:0; }

	#header_area .site_link_wrap .site_ctrl{ position:absolute; top:3px;  left:0; width:100%; }
	#header_area .site_link_wrap .site_ctrl a{ position:absolute; display:inline-block; color:#fff;  }
	#header_area .site_link_wrap .site_ctrl a.prev{ left:10px; }
	#header_area .site_link_wrap .site_ctrl a.next{ right:30px; }
	#header_area .site_link_wrap .site_ctrl a.pause{ right:5px; }
	#header_area .util_menu_wrap{ float:right; }
	#header_area .util_menu_wrap a{ display:inline-block; font-size:12px; color:#fff; padding:5px 10px; border:#fff solid 1px; border-radius: 30px; margin:0 0 0 5px; }
	#header_area .util_menu_wrap a:first-child{ border:0; font-size:14px;  }
	#header_area .util_menu_wrap a:first-child i{ margin-left:10px; }

	#header_area .logo a{ width:92px; height:76px; margin-top:-11px}

	.m_menu,.m_gnb{ display:none }

	.gnb_wrap{ padding:30px 0 0; }
	.gnb_wrap:after{ display:block; clear: both; content:""}
	.gnb{ display:block; float:right; }
	.gnb > ul{ float:left; vertical-align: middle;   }
	.gnb > ul > li{ position:relative; float:left; font-size:20px; margin-right:62px;  }
	.gnb > ul > li > a{  display:block; color:#313131; font-weight:500; padding:17px 0 42px; position:relative; z-index: 5000 }
	.gnb > ul > li:hover > a{ color:#1873DA;  }
	.gnb > ul > li > ul{ position:absolute; width:100%; min-width:220px; left:50%; top:76px;  transform:translateX(0);  opacity: 0; visibility: hidden; border-top:#1873DA solid 4px; border-bottom-left-radius: 20px; border-bottom-right-radius: 20px;  overflow:hidden; box-shadow:rgba(0,0,0,0.2) 2px 2px 4px; z-index: 4000}
	.gnb > ul > li > ul.active{ transform:translateX(-50%);  opacity: 1;  visibility: visible;  transition:all 0.3s ease }
	.gnb > ul > li > ul > li{ font-size:14px; font-weight:500;    text-align: center;  }
	.gnb > ul > li > ul > li:last-child > a{ border:0; }
	.gnb > ul > li > ul > li > a{ display:block; padding:15px 22px; background:#fff; border-bottom:#e5e5e5 solid 1px; line-height:1.3;}
	.gnb > ul > li > ul > li > a:hover{ background:#e9e9e9;  }


	.gnb > a{ float:left;  display:inline-block;  width:55px; line-height: 52px; height: 55px; font-size:20px; color:#fff;  text-align: center;  vertical-align: middle }
	.gnb > a.btn_sitemap{ background:#464646; }



	#footer_area{ clear:both; }
	.total_banner{  padding:10px 0; margin-top:40px;   }
	.total_banner .total_title{ width:auto; margin-top:15px;  margin-bottom:0; }
	.total_banner .total_title h3{ font-size:18px;  margin-right:30px;  display:inline-block; vertical-align:middle }
	.banner_ctrl{ position:relative;  top:0; display:inline-block; vertical-align:middle }
	.banner_list_wrap{ width:75%; }	 
	.banner_list li{ font-size:16px; font-weight:500; }
	.banner_list li a{   }

	.logo_bottom{ float:left; width:92px; height:76px;  background-position:-112px 0; margin-right:86px; margin-top:5px; }
	.bottom_menu{ text-align:left; }
	.bottom_menu li{ margin-right:20px; }
	.bottom_menu li a{ padding:5px 0;}
	.copyright{ padding:40px 0 100px; }
	.copyright p{ text-align: left; }

	/*===========서브영역===========*/

	#header_area .sub_search_box{ position:relative; display:inline-block; float:left; }
	#header_area .sub_search_box .sub_search_btn{ display:inline-block; width:55px; height:55px;  font-size:20px;  background:#1873da; color:#fff; text-align: center; line-height: 52px;  }
	#header_area .sub_search_box .sch_field{ display:none; position:absolute; width:305px; right:0; top:0; border:#1873da solid 2px; z-index: 5000;  overflow:hidden  }
	#header_area .sub_search_box .sch_field.open{ display:block; }
	#header_area .sub_search_box .sch_field .sub_sch_txt{  float: left; width:200px; padding:10px;   height:51px; border:0; color:#1873da; font-size:16px;  }
	#header_area .sub_search_box .sch_field .sub_sch_txt::placeholder{ color:#1873da; }
	#header_area .sub_search_box .sch_field .sub_sch_btn{ float: left; width:51px; height:51px; background:#fff; border:0;  font-size:20px;  color:#1873da;  }
	#header_area .sub_search_box .sch_field .sch_close_btn{  float: left; display:block; width:50px; height:51px;  font-size:20px;  background:#1873da; color:#fff; text-align: center; line-height: 46px; }

	#content_area{ padding:35px 0; }
	#content_area:after{ display:block; content:""; clear: both }
	#content_area > .container{ width:1400px; margin:0 auto; }

	#sub_visual_area{ height:200px; }
	#sub_visual_area .sub_title{ font-size:25px;  margin-bottom:20px; }
	#sub_visual_area .title{ font-size:45px;  }

	.left_menu{ display:block; float:left; width:240px;  }
	.left_menu h2{ display:flex; align-items: center; padding:0 24px;   font-size:30px; height:200px; line-height: 1.3; color:#fff; background:#313131 }
	.left_menu h2 i{ margin-right:10px; }
	.left_menu > ul{ border-left:#ccc solid 1px; border-right:#ccc solid 1px; border-bottom:#ccc solid 1px; }
	.left_menu ul li { position:relative; border-top:#ccc solid 1px; font-size:17px;  line-height:1.3; word-break:keep-all }
	.left_menu ul li.has_sub:after{ position:absolute; right:15px; top:27px; color:#eb4141;  transform:translateY(-50%); content:"\f078"; font-family: 'font awesome 5 pro'; font-weight:700; transition:all 0.3s ease }
	.left_menu ul li.open:after{ color:#fff }
	.left_menu ul li.open > a{ background:#045a2b; color:#fff; }
	.left_menu ul li.has_sub.open:after{ transform: rotate(-180deg);  margin-top:-10px; transition:all 0.3s ease }
	.left_menu ul li a{ display:block; background:#fff; padding:20px 25px; color:#353535; font-weight:500;   }
	.left_menu ul li ul{ display:none; padding:10px 0 10px 30px; border-top:#ccc solid 1px; }
	.left_menu ul li ul li{ border-top:0; font-size:16px; }
	.left_menu ul li ul li a{ display:block; padding:8px 0; background:#fafafa}
	.left_menu ul li ul li a:hover,  .left_menu ul li ul li.active a{ color:#eb4141;  }

	.content_warp{ float:right; width:1010px;  }
	.content_top h3{ font-size:35px; margin-top:35px; margin-bottom:30px;   }
	.content_top .share_box{ top:0; }
	.content_top .share_box > ul > li{ float:left;  }
	.content_top .share_box > ul > li > a{ display:block; width:45px; height:45px; line-height: 43px; border-radius: 0; font-size:18px;  }
	.content_top .share_box .print{ display:inline-block; background:#fff; border:#ededed solid 1px; }
	.sub_sns_links .sns_close_btn{ font-size:35px;  }

	.breadcrumb{ margin-bottom:35px; }
	.breadcrumb ul li{ margin-right:20px; }
	.breadcrumb ul li:after{ font-size:24px; top:55%;  right:-15px; }
	.breadcrumb ul li a{ font-size:16px; }

	.con_tab_4depth ul{ display:table;   width:100%; height:auto; border-radius: 0; border-left:0;   }
	.con_tab_4depth ul li{ display:table-cell; width:20%; font-size:16px; border-left:#eee solid 1px;   }
	.con_tab_4depth ul li.active{ border-left:#eb4141 solid 1px; border-right:#eb4141 solid 1px;  border-bottom:#eb4141 solid 1px;  }
	.con_tab_4depth ul li a{ padding:16px 0;  height:50px; }
	.con_tab_4depth ul:after{ display:none; }

	.con_tab_5depth{ padding-bottom:20px; }
	.con_tab_5depth ul{   }
	.con_tab_5depth ul li{ font-size:14px;   margin:0 5px 5px 0;  }
	.con_tab_5depth ul li a{ padding:8px 15px 10px; height:34px;  }

	.content{ padding:30px; }
}