@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,700;1,600&display=swap');
/*=================모바일 및 기본 세팅===================*/


.main_visual_area{ position:relative; background-color:#000 }
.visual_slide li{ float:left; width:100%; display:flex; flex-direction: column; height: 600px;  padding:38px; background-size:cover; background-position:center; color:#fff;  text-align: center  }
.visual_slide li p{ font-size:14px; margin-bottom:10px; margin-top:-20px;  transition:all 0.5s ease 0.3s; opacity: 0; }
.visual_slide li span{ display:block;font-size:26px; font-weight:bold;  margin-top:0;  transition:all 0.5s ease 0.5s;  opacity: 0; word-break: keep-all; line-height: 1.3; margin-bottom:140px;   }
.visual_slide li.move p{ transition:all 1s ease 0.3s;  margin-bottom:10px;   margin-top:0; opacity: 1 }
.visual_slide li.move span{ transition:all 1s ease 0.6s;    margin-top:0; opacity: 1 }

.visual_pager{ position:absolute; bottom:180px; width:100%; text-align: center; }
.visual_pager .pager{ display:inline-block;  line-height:13px; height:13px;  vertical-align: -1px; }
.visual_pager a{ display:inline-block; position:relative; color:#fff; margin-right:5px;   vertical-align: middle  }
.visual_pager a span{ display:inline-block; background:#fff; width:13px;  text-indent: -9999px; border-radius: 20px;  }
.visual_pager a.selected span{ background:#eb4141; width:32px; }

.visual_ctrl{ position:absolute; top:100px; width:100%; }
.visual_ctrl a{ position:absolute; color:#fff; margin:0 5px;  font-size:30px; transform:translateY(-50%) }
.visual_ctrl a.prev{ left:10px; }
.visual_ctrl a.next{ right:10px; }

.safe_bnr{ position:absolute; right:15px; left:15px; bottom:15px; background:#fff; padding:60px 10px 10px; border-radius: 15px;  }
.safe_bnr .icon{ position:absolute; font-size:40px; top:10px; left:50%; transform: translateX(-50%); color:#0d3f98; }
.safe_bnr div{ overflow:hidden }
.safe_bnr span{ display:block; font-weight:bold; font-size:18px; margin-bottom:10px; text-align:center; color:#545454 }
.safe_bnr dl{ padding:10px 15px; }
.safe_bnr dl dt{ color:#0d3f98; font-weight:bold; margin-bottom:10px;   }
.safe_bnr dl dt i{ margin-right:10px; color:#222 }
.safe_bnr dl dd{ font-size:14px; line-height: 1.3}
.safe_bnr a{  display:block; width:50%; margin:0 auto; background:#0076ff; color:#fff; font-size:14px;  font-weight:500; padding:10px 20px 12px; border-radius:50px; margin-top:10px; text-align: center }

.quick_links{ padding:15px; overflow:hidden  }
.quick_links h3{ color:#414347; margin-bottom:20px; font-weight:300;    }
.quick_links h3 span{ display:inline-block; font-weight:bold; margin-left:5px;   }
.quick_links ul li{ float:left; width:33.333%; margin-bottom:10px; }
.quick_links ul li a{ display:block; font-size:14px; text-align: center; padding:15px 0;  border-radius: 15px; word-break:keep-all;}
.quick_links ul li a:hover{ background:#0d3f98; color:#fff; }
.quick_links ul li i{ display:block; width:60px; height:60px; margin:0 auto; background-color:#f2f2f2;  border-radius: 60px; margin-bottom:10px;  background-size:470px;    }
.quick_links ul li i.icon01{background-position: -234px -44px;}
.quick_links ul li i.icon02{background-position: -177px -44px;}
.quick_links ul li i.icon03{background-position: -175px -43px;}
.quick_links ul li i.icon04{background-position: -264px -38px;}
.quick_links ul li i.icon05{background-position: -53px -44px;}
.quick_links ul li i.icon06{background-position: -116px -44px;}
.quick_links ul li i.icon07{background-position: 7px -44px;}

.latest_area{ position:relative; padding:15px; }
.latest_area:after{ display:block; clear: both; content:"" }
.latest_area h3{  font-size:20px; font-family: 'Montserrat'; margin-bottom:20px; }
.latest_area h3 span a{ display:inline-block; font-size:14px;  font-weight:bold; color:#505050; border:#000 solid 1px; padding:10px; border-radius: 30px; vertical-align: middle; margin-left:10px;  }

.latest_area div{ display:none}
.latest_area div:nth-child(2){ display:block  }
.latest_area ul li { margin-bottom:20px; }
.latest_area ul li:last-child{ margin:0; }
.latest_area ul li a{ display:block; float:left;}
.latest_area div ul li a{ width:100%; font-size:16px;  font-weight:bold; color:#000; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; margin-bottom:10px;  }
.latest_area .text{ line-height: 1.3; font-size:14px;   }
.latest_area span{ display:inline-block; font-size:14px;   font-weight:300;}
.latest_area .title{text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
.latest_area .date{float:right;}
.latest_area h3 span a.active{ color:#007836;  border:#007836 solid 1px;  float:none;}
.latest_area .view_more{ position:absolute; right:20px; top:25px; }

@media all and (max-width:767px) {
	.latest_area div ul li a{width:71%; text-overflow:ellipsis;}
}

@media all and (min-width:768px) {
	.latest_area h3 span a{padding:10px 20px;}

	.latest_area div ul li a{width:84%; text-overflow:ellipsis;}
	.latest_area div ul li span{margin-top:10px;}
}

.notify_main{ position:relative; margin:15px; border-radius: 15px; overflow:hidden }
.notify_main .caroufredsel_wrapper{ border-radius:15px; }
.notify_main_list li{ float:left; border-radius: 15px;   overflow:hidden }
.notify_main_list li img{ width:100%; max-width:100%; }
.notify_ctrl{ position:absolute; left:0; right:0;  bottom:0; background:rgba(70,70,70,0.6); padding:10px 15px; border-bottom-left-radius: 15px; border-bottom-right-radius: 15px;  }
.notify_ctrl a{ color:#fff; margin:0 3px;   }
.notify_ctrl .paging{ color:#fff; display:inline-block; margin-right:10px; }

.notify_main_pager{ display:none !important}

.mid_banner ul{ text-align: center; padding:15px; }
.mid_banner ul li{position:relative; display:flex; align-items: center; justify-content: center; flex-direction:column; background-size:cover; background-position:center; background-repeat: no-repeat; padding:55px; color:#fff; border-radius: 20px; margin:10px 0; }
.mid_banner ul li:nth-child(1){ background-image:url(/home/gjlm/images/main/bg_mid01.jpg)}
.mid_banner ul li:nth-child(2){ background-image:url(/home/gjlm/images/main/bg_mid02.jpg)}
.mid_banner ul li:nth-child(3){ background-image:url(/home/gjlm/images/main/bg_mid03.jpg)}
.mid_banner ul li span{ font-family: "Noto Serif KR";font-size:25px; margin-bottom:20px; }
.mid_banner ul li p{ line-height: 1.3; word-break: keep-all; width: 100%;}
.mid_banner ul li a{ background:#0d3f98; color:#fff; padding:10px 20px; margin-top:20px; border-radius: 20px;  }

.latest_row2{ background:#f8f8f8 }
.quick_banner { position:relative; padding:25px 15px; background:#0d3f98; border-radius: 20px; }
.quick_banner h3{ margin-bottom:20px; color:#fff; }
.bnr_list li{ float:left; width:160px; margin:0 5px;   }
.bnr_list li a{ display:block; color:#fff;  }
.bnr_list li p{ text-overflow: ellipsis; overflow: hidden; white-space: nowrap;  margin:22px 0 12px; font-weight:bold; }
.bnr_list .thumb{ min-height:150px; background-size:cover; background-position:center; border-radius: 15px;  }
.quick_banner .bnr_ctrl{ position:absolute; right:15px; top:15px; }
.quick_banner .bnr_ctrl a{ margin-left:5px; color:#fff; }

.prom_video{ position:relative; padding:25px 15px; }
.prom_video h3{ font-family: 'Montserrat', sans-serif; margin-bottom:15px; }
.prom_video_list li{ float:left; width:160px; margin:0 5px;   }
.prom_video_list li a{ display:block; }
.prom_video_list li p{ text-overflow: ellipsis; overflow: hidden; white-space: nowrap; color:#333; margin:22px 0 12px; font-weight:bold  }
.prom_video_list .thumb{ min-height:150px; background-size:cover; background-position:center; border-radius: 15px;  }
.prom_video .video_ctrl{ position:absolute; right:15px; top:15px; }
.prom_video .video_ctrl a{ margin-left:5px; }

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

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

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

/*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; }
	.visual_slide li{ justify-content: center; align-content: flex-start; height:400px; padding:0 50px; overflow:hidden }
	.visual_slide li .container{ width:1000px; margin:0 auto}
	.visual_slide li p{ text-align: left; }
	.visual_slide li span{ text-align: left; margin-bottom:0;  }
	.visual_pager{ left:50%; margin-left:-330px; bottom:100px; text-align: left; }
	.visual_ctrl{ top:50%; transform: translateY(-50%);}

	.safe_bnr{ width:36%; right:10%; top:50%; bottom:auto; left:auto; transform: translateY(-50%);}

	.quick_links ul li{width:20%;}

	.latest_area{float:left; width:49%}
	.latest_area ul { overflow:hidden }
	.latest_area ul li{ width:97%;}
	.latest_area ul li:last-child{ margin-right:0; border-right:0;  }

	.notify_main{ float:left; width:49%; margin-right:0; }
	.mid_banner{ float:right; width:49%; }
	.mid_banner ul li{ margin:0 0 20px; }
	.quick_banner{ float:left; width:49%; margin-left:15px;}

	.prom_video{ clear:both; }
}

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

	.container{ max-width:1000px; }

	.visual_slide li p{ max-width:1000px; margin:0 auto }
	.visual_pager{ text-align:left; margin-left: -460px; bottom:120px; }

	.safe_bnr{ position:absolute; width:350px; left:auto;  right:50px; bottom:auto; top:50%; transform: translateY(-50%); text-align: left; }
	.safe_bnr .icon{ display:block;   float:none; margin:0 auto 25px auto}

	.quick_links h3{ float:left; width:15%; text-align:left; font-size:25px; margin-bottom:0; padding-top:30px;  }
	.quick_links h3 span{ display:block; margin:10px 0 0 0; }
	.quick_links ul{ float:right; width:85%; }

	.latest_area{ float:left; width:60%; margin-bottom:15px;  padding:0;  }
	.latest_area .view_more{top:8px;}

	.notify_main{ width:38%; margin-top:0; }

	.mid_banner{ clear: both; float: none; width:100%;  }
	.mid_banner ul{ display:flex; justify-content: space-between; }
	.mid_banner ul li{ width:49%; }
	.mid_banner ul li p{ display:block; }

	.latest_row2{ clear:both; overflow:hidden; padding:25px 0; }
	.quick_banner{ float:left; width:35%;   margin-left:0;}
	.quick_banner h3{ float:none; }
	.quick_banner > div{ float:none; width:auto;  max-width:350px; max-height:250px; }

	.prom_video{ float:right; width:65%; clear: none }
	.prom_video_list li{ width:200px; margin:0 10px;  }

	#footer_area{ clear:both  }

}

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

	.visual_slide li{ height:650px; }
	.visual_slide li .container{ width:1280px;  }
	.visual_slide li span{ font-size:60px; margin-bottom:200px;    }
	.visual_slide li p{ font-size:43px; margin:0 auto 0 0   }

	.visual_ctrl a{ font-size:65px; }
	.visual_pager{ width:auto; left:50%; margin-left:-650px; padding-left:20px; bottom:180px}
	.safe_bnr{ right:50%; margin-right:-640px; transform: translateY(-70%); }


	#latest_area:after{ display:block; clear: both;  content:"" }

	.quick_links{ position:relative; margin-top:-120px; margin-bottom:80px;  background:#fff; border-radius: 20px; box-shadow:rgba(0,0,0,0.2) 1px 1px 40px; z-index: 100;}
	.quick_links h3{ font-size:30px; padding-left:50px; width:20%;}
	.quick_links ul{ width:80%; }
	.quick_links ul li i{ width:106px; height:106px; margin-bottom:15px;  }
	.quick_links ul li i.icon01{ background-position:-422px -78px; }
	.quick_links ul li i.icon02{ background-position:-323px -76px; }
	.quick_links ul li i.icon03{ background-position:-276px -59px; }
	.quick_links ul li i.icon04{ background-position:-402px -59px; }
	.quick_links ul li i.icon05{ background-position:-97px -76px; }
	.quick_links ul li i.icon06{ background-position:-212px -75px; }
	.quick_links ul li i.icon07{ background-position:12px -73px; }
	.quick_links ul li a{ font-size:16px; font-weight:bold }

	.latest_area{ float:left; width:720px; margin-bottom:65px;  padding:0;  height:298px;}
	.latest_area h3{ font-size:22px; margin-bottom:12px;}
	.latest_area h3 span{ font-size:18px; }
	.latest_area ul li{ width:97%;  margin-bottom:-4px;  }
	.latest_area ul li:last-child{ margin-right:0; padding-right:0; }
	.latest_area .title{ font-size:19px; padding:10px 0; color:#292b30; font-weight:500; }
	.latest_area .text{ line-height:1.8 }

	.mid_banner ul{ padding:0; }
	.mid_banner ul li{ padding:70px 80px; margin-bottom:50px; }

	.notify_main{ float:right; padding:0; width:500px;  }
	.notify_ctrl{ left:0; right:0; bottom:0;  }

	.latest_row2{ padding:50px 0}
	.quick_banner{ float:left; width:360px;}
	.quick_banner .bnr_ctrl{ top:25px; }

	.prom_video{ clear: none; float:right; width:851px; padding:0;  }
	.prom_video > div.caroufredsel_wrapper{ width:851px !important; }
	.prom_video h3{ font-size:22px; margin-bottom:33px; }
	.prom_video_list li{ width:267px; margin:0 25px 0 0; }
	.prom_video_list li span{ display:inline-block; font-size:14px; }
	.prom_video_list .thumb{  height:190px; }
	.prom_video .video_ctrl{ top:0; right:0; }
	.prom_video .video_ctrl a{ font-size:20px; }


}

@media all and (min-width:768px) and (max-width:1439px) {
	.latest_area div ul li a{width:70%;}
	.latest_area div ul li span{margin-top:0;}
}


.popmovie {position:absolute; top:0; left:0; visibility:visible; width:100%;  margin:0; z-index:9999;}
@media all and ( min-width:640px){
	.popmovie {width:60%;}
}
@media all and ( min-width:1200px){
	.popmovie {width:35%;}
}