/****** 공통 영역 ******/
/* 공통 클래스, 레이아웃 */
.ctt_privacy { width: 100%; max-width: 1200px; margin: auto !important; }

/* 체크박스 */
input[type="checkbox"] { /*display:none;*/ }
input[type="checkbox"] + label span { display:inline-block; width:18px; height:18px; margin:-2px 10px 0 0; vertical-align:middle; background:url('../images/common/ckbx.png') no-repeat; cursor:pointer; }
input[type="checkbox"]:checked + label span { background:url('../images/common/ckbx_ck.png') no-repeat; }
/* input focus */
input:focus { outline: 1px solid #3ec5ad }
/* input placeholder */
input::placeholder, textarea::placeholder { color: #aaa; }
/* 라디오박스 */
input[type="radio"] { display:none; }
input[type="radio"] + label { color:#f2f2f2; font-family: Arial, sans-serif; }
input[type="radio"] + label span { display:inline-block; width:20px; height:20px; margin:-1px auto; vertical-align:middle; background:url('../images/common/rdbx.png') no-repeat; cursor:pointer; }
input[type="radio"]:checked + label span { background:url('../images/common/rdbx_ck.png') no-repeat; }
input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill{ background-color: #f9f9f9 !important; }



/****** 헤더 ******/
.background_box{ width: 100%; height: 100%; position: fixed; z-index: 7; background: rgba(0,0,0,0.4); display:none; }

html,body{ /*overflow:scroll; -webkit-overflow-scrolling:touch;*/ overflow-x: hidden; -webkit-text-size-adjust: none; }
#header { padding: 0 110px; width: 100%; height: 130px; margin: auto; display: flex; align-items: center; justify-content: space-between; flex-flow: row wrap; }
.nav_sub{ width: 100%; height: auto; background-color: white; border-bottom: 1px solid #e3e2e2}
.nav{ width: 100%; height: 35px; max-width: 1200px; padding: 0 20px; margin: auto; display: flex; justify-content: flex-end; align-items: center; flex-flow: row nowrap; }
.nav_area{ width: 100%; height: 100%; position: relative; display: flex; flex-flow: row wrap; justify-content: space-between; align-items: center; }
.menu_sub{ width: 60%; height: auto;  color: #333; }
.logo_area{ width: 23%; height: 130px; display: flex; flex-flow: row nowrap; justify-content: flex-start; align-items: center; transition: all 0.2s ease-in-out; }
.logo{ width: 100%; max-width: 207px; min-width: 207px; height: auto; cursor: pointer; transition: all 0.2s ease-in-out; cursor: pointer; }
.nav_admin { width: 17%; display: flex; justify-content: flex-end; }
.nav_admin > a { color: #666; }
.nav_admin > span { color: #666; padding: 0 17px; font-size: 14px; }
.bar_line { width: 1px; height: 15px; margin: 0 8px; background-color: #999999; }
.menu { width: 100%; height: 50px; max-width: 1200px; margin: auto; display: flex; justify-content: space-around; align-items: center; flex-flow: row nowrap; }
.menu li{ width: 100%; position: relative; display: flex; flex-flow: row nowrap; justify-content: center; align-items: center; color: #fff }
.menu li p { width: auto; color: #333; font-size: 20px; font-weight: 500; cursor: pointer; display: inline; text-align: center; letter-spacing: -1px;}
.menu_hamburger{ display: none; }
.mobile_menu_tit { display: none !important; }
.bullet { display: none !important; }


/* 전체 서브 메뉴 */
.sub_menu { display: none; }
.all_sub_menu_area_sub { width: 100%; position: fixed; top: 90px; left: 0; z-index: 999; margin: auto; }
.all_sub_menu_area_sub > div { display: flex; justify-content: space-between; padding: 0 110px; width: 100%; position: absolute; top: 40px; left: 0; z-index: 10; background: rgba(0,0,0,0.8); }
.all_sub_menu_area_sub > div > div:nth-of-type(1) { width: 23%; }
.all_sub_menu_area_sub > div > div:nth-of-type(3) { width: 17%; }
.all_sub_menu_area {  width: 60%; margin: auto; display: none; flex-flow: row nowrap; justify-content: space-around; align-items: flex-start; }
.all_sub_menu { width: 100%; height: auto; padding: 20px 0; }
.all_sub_menu li { font-size: 17px; width: 100%; padding: 5px 0; display: flex; flex-flow: row nowrap; justify-content: center; align-items: center; cursor: pointer; color: #f5f5f5; letter-spacing: -1px;}
.all_sub_menu li:hover { color: #069cd7; }



@media (max-width: 1640px){
    .all_sub_menu li { font-size: 14px; }
}
@media (max-width: 1370px){
    .all_sub_menu li { font-size: 13px; }
}
@media (min-width: 961px){
    .menu li { display: flex; justify-content: center; }
	.menu li p { height: 130px; line-height: 130px;  } 
}
@media all and (max-width: 1530px){
    /* .menu_sub { padding: 0 3vw; } */
}
@media all and (max-width: 1300px){
    .all_sub_menu_area_sub > div > div:nth-of-type(3),
    .nav_admin { display: none !important; }
	#header { padding: 0 30px; }
	.all_sub_menu_area_sub > div > div:nth-of-type(1),
    .logo_area { width: 30%; transition: all 0.5s ease-in-out; }
	.all_sub_menu_area,
    .menu_sub { width: 70%; transition: all 0.5s ease-in-out; }
	.all_sub_menu_area_sub > div { padding: 0 30px }
}
@media all and (max-width:1050px){
    .menu li p .space{ display: none; }
    .menu li p .line_feed{ display: inline; }
}
@media all and (max-width:960px){

    #header{ padding: 0; }

    .nav{ padding: 0 20px }
    .nav_area{ display: flex; justify-content: flex-end; flex-flow: row wrap; }
    .logo { padding-left: 10px; }
    .logo_area{ justify-content: flex-start; }

    .menu{ display: block; width: 270px; height: 100%; background: #fff; position: fixed; top: 0; right: -270px; z-index: 10; transition: all 0.5s ease-in-out; flex-flow: row wrap; padding: 0; }
    .menu li { width: 100%; padding: 0; font-size: 15px; cursor: pointer; flex-flow: row wrap; justify-content: space-between; border-bottom: 1px dotted #ddd; }
    .menu li p { text-align: left; width: 85%; padding: 10px 20px; font-size: 17.5px; font-weight: 500; color: #333; }
	.menu li .bullet { width: 15% !important; display: flex !important;  justify-content: center; align-items: center; } 
    .mobile_menu_tit { display: block !important; padding: 20px !important ; background: #fff; color: #069cd7 !important; font-size: 25px !important; }

    .menu_hamburger{ width: 35px; height: 24px; position: absolute; cursor: pointer; top: 57px; left:-55px; display: block; }
    .menu_hamburger div{ width: 100%; height: 2.5px; background: #333 !important; position: absolute; left: 0; transition: all 0.3s ease-in-out; }
    .menu_hamburger div:nth-of-type(1){ top: 0; }
    .menu_hamburger div:nth-of-type(2){ top: 50%; right:0; left: 0; margin: auto; }
    .menu_hamburger div:nth-of-type(3){ top: 100%; }
    .bullet { display: block !important; }
 
    .nav_admin { display: none; }
    .logo_area { width: 100%; }

    .sub_menu { background: #f5f5f5; display: none; width: 100%; padding: 10px 20px; position: static; top:49px; left:0; z-index: 1000; box-shadow: 1px 1px 3px 1px transparent; }
    .sub_menu li{ margin: 0; padding: 3px 0; border-left: 0 solid; font-weight: normal; color: #333; border: 0; }
    .sub_menu li:hover{ font-weight: normal; border-left: 0px solid; }

}
@media all and (max-width:380px){
    .logo_area{ padding: 0 0 0 13px; height: 90px; }

}


/****** 서브 페이지 공통 ******/
.sub_title_area{ width: 100%; height: 200px; background-position: center; background-repeat: repeat; background-size:  cover; display: flex; flex-flow: column nowrap; justify-content: center; align-items: center; transition: all 0.2s ease-in-out; background-color: rgb(19, 24, 82); }
.sub_title_area>p{ color: rgb(255,255,255); font-size: 32px; letter-spacing: -2px; text-shadow: 2px 2px 8px rgba(0,0,0,0.7); }
.sub_title_area>div{ color: rgb(99,129,69); font-size: 16px; cursor: default; }
.sub_title_area>div>span{ cursor: pointer; }
.sub_nav{ width: 100%; height: auto; display:block;  border-top: 1px solid #c4c4c4; border-bottom: 1px solid #c4c4c4; }
.sub_nav ul{ width: 100%; height: 55px; margin: auto; max-width: 1180px; display: flex; align-items: center; justify-content: flex-start; flex-flow: row nowrap; }
.sub_nav ul li{ display: flex; flex-flow: row nowrap; justify-content: center; align-items: center; font-size: 20px; cursor: pointer; }
.sub_nav ul li:nth-of-type(1){ width: 80px; height: 100%; border-left: 1px solid #c4c4c4; border-right: 1px solid #c4c4c4; }
.sub_nav ul li:nth-of-type(2), .sub_nav ul li:nth-of-type(3){ width: 250px; height: 100%; border-right: 1px solid #c4c4c4; position: relative; padding: 0 20px ;}
.sub_nav .menu_name, .sub_nav .sub_menu_name{ width: 220px; color: #333; font-weight: 400; letter-spacing: -1px; font-size: 17px; transition: all 0.2s ease-in-out; }
.sub_nav .menu_select, .sub_nav .sub_menu_select{ width: 250px; position: absolute; top: 55px; left: -1px; z-index: 10; border: 1px solid #c4c4c4; background-color: rgb(255,255,255); display: none; }
.sub_nav i{ color: #777; transition: all 0.2s ease-in-out; }
.sub_nav .menu_select p, .sub_nav .sub_menu_select p{ padding: 0 0 0 20px; height: 45px; color: #333; display: flex; flex-flow: row wrap; justify-content: left; align-items: center; letter-spacing: -2px;  font-size: 16px; }
.sub_nav .menu_select p:hover, .sub_nav .sub_menu_select p:hover{ color: #069cd7; }
.content_title{ width: 100%; max-width: 1180px; height: 180px; margin: 0 auto;  border-bottom: 1px solid lightgray; padding: 50px 0; }
.content_title dt{ text-align: center; font-size: 34px; font-weight: bold; letter-spacing: -2px; color: rgb(51,51,51); }
.content_title dd{ text-align: center; font-size: 16px; font-weight: 300; color: #999; margin-top: 5px; letter-spacing: -.5px; }

.sub_nav .menu_hide{ display: none; }

/* 컨텐츠 영역 */
#container_wr{ width: 100%; height: auto; }


@media (max-width:960px){

    /****** 서브 페이지 공통 ******/
    .sub_title_area { height: 190px; }
    .sub_title_area > p{ font-size: 28px; }
    .sub_title_area > div{ font-size: 16px; }
    .sub_nav ul{ padding: 0; }
    .sub_nav ul li{ font-size: 18px; }
    .sub_nav ul li:nth-of-type(1){ display: none; }
    .content_title { padding-left: 20px; padding-right: 20px; }
    .content_title dt{ font-size: 30px; }
}

@media (max-width: 760px){
    #header { top: -7px; }
    .content_title { padding: 50px 0; }
}


@media (max-width:480px){
    /****** 서브 페이지 공통 ******/
    .sub_nav ul li:nth-of-type(2), .sub_nav ul li:nth-of-type(3){ width: 50%; }
    .sub_nav .menu_select, .sub_nav .sub_menu_select { width: 100%; }
    .sub_nav .menu_name, .sub_nav .sub_menu_name{ width: 100%; font-size: 16px; }
    .sub_nav .menu_select p, .sub_nav .sub_menu_select p{ font-size: 16px; }
    .content_title { padding: 50px 0 30px 0; }
}
@media (max-width: 479px){
    .content_title { padding: 30px 0; height: auto; }
    .sub_nav .menu_name, .sub_nav .sub_menu_name { font-size: 13px; }
    .sub_nav .menu_select p, .sub_nav .sub_menu_select p { font-size: 13px; height: 35px; }
    .content_title dt { font-size: 25px; }

}


/******* 푸터 *******/
.footer_sub { display: flex; align-items: center; border-top: 1px solid #ccc; width: 100%; height: 190px; color: #dadada; background-color: #fff }
.footer { width: 100%; margin: auto; max-width: 1200px; display: flex; justify-content: space-between; flex-flow: row wrap; }
.footer > .info { width: 100%; }
.footer > .info > .add { display: flex; justify-content: center; flex-flow: row wrap; }
.footer > .info > .add > h1 { word-break: keep-all; display: inline; font-size: 16px; color: #333; margin-right: 12px; font-weight: 400;  }
.footer > .info > .add > h1:last-child { margin-right: 0; }
.footer > .info > .add > h1 > span { font-size: 16px; color: #333; }
.footer > .info > .copyright { font-size: 16px; letter-spacing: 0; text-transform: uppercase; }
.footer > .info > .copyright > a:nth-of-type(1) { border-bottom: 2px solid #ccc; margin: 0 10px; display: inline-block; }
.footer > .info > .copyright > a { letter-spacing: -1px }
.footer > div > p { color: #333; line-height: 30px; font-size: 15px; display: flex; justify-content: center; flex-flow: row wrap ; }
.footer > div > p > span { padding-right: 1%; display: block; }


@media all and (max-width:1200px){
    .footer { display: block;}
    .footer > .info { width: 100%; }
    .footer > .info > p { word-break: keep-all; }
}
@media (max-width: 1087px){
    .all_sub_menu li { font-size: 13px; }
}

@media (max-width: 960px){
    #header, .logo_area { height: 100px; }
    .menu_hamburger { top: 40px; }
}
@media (max-width: 600px){
	.location_content > div > table td { font-size: 14px }
	.location_content > div > table th { padding-left: 5px !important; font-size: 14px; }
}
@media (max-width: 500px){
    .footer { padding: 0 20px }
	.footer > .info > .add { justify-content: flex-start; }
	.footer > div > p { justify-content: flex-start; }
	.footer > div > p a { margin: 0 !important }
	.footer > div > p a:nth-of-type(1) { margin-right: 10px !important }
}
@media (max-width:480px){
    .footer{ justify-content: flex-start; flex-flow: row wrap; }
    .footer>div{ justify-content: flex-start; flex-flow: row wrap; font-size: 12px;}
    .footer div:nth-of-type(1) h4{ width: 100%; justify-content: flex-start; }
    .footer div:nth-of-type(1) h4>span:nth-of-type(2){ display: none; }
    .footer .bar_line{ display: none; }
    .footer div:nth-of-type(2) p{ display: flex; flex-flow: row wrap; }
    .footer_title{ min-width: 85px; }
    .h_add { display: none; }
    .footer { padding: 35px 20px; }
    .footer .hidden { display: none; }
    .footer > .info > .add > h1:nth-of-type(1){ font-size: 17px; width: 100%; margin: 10px 0; }
	
}

@media (max-width:400px){
    .footer > .info > .add > h1 { font-size: 13.5px; }
    .footer > .info > .add > h1 > span { font-size: 13px; }
    .footer > div > p { font-size: 13px !important; line-height: 21px }
}

/* GNB 메뉴 */
.nav h1{float: left;}
.nav h1 a{display: block;}
.gnb{float: right;padding-top: 9px;}
.gnb > li{float: left;position: relative;width: 134px;text-align: center;}
.gnb > li > a{padding-bottom: 19px;font-weight: 600;}
.gnb_depth2{display: none;position: absolute;top: 36px;left:7px;z-index: 100;width: 100%;height: 230px;padding: 15px 0 0;border-left: 1px solid #e7e7e7;}
.gnb > li:first-child .gnb_depth2{border-left: none;}
.gnb_depth2:hover{background: #f6fcfe;}
.gnb_depth2 li{width:130px;}
.gnb_depth2 li a{display: block;padding: 10px 0 9px;font-size: 13px;color: #333}
.gnb_depth2 li a:hover{color: #28aacf}
.gnb_bg{display: none;position: absolute;right: 0;top: 45px;z-index: 99;width: 800px;height: 230px;background: white;}
