@charset "utf-8";

/* common */
::selection{background: rgba(14, 46, 104, 0.56);color:#fff;}
body{font-size:16px; word-break:keep-all; overflow-x:hidden;}
body.active{position:fixed; width:100%; height:100%; overflow:hidden;}
.inr{position:relative; max-width:1400px; margin:0 auto;}
.inr.v2{width:1640px;}
.inr:after{content:''; display:block; clear:both;}
.inr.sub{position:relative; width:1200px; margin:0 auto;}
.inr.sub02{position:relative; width:1100px; margin:0 auto;}

/* header */
#header{position:absolute; top:0; z-index:9999; width:100%; height:100px; text-align:center; box-sizing:border-box; transition:all 0.3s ease; background:#fff;} 
#header h1{position:absolute; top:30px; left:100px;}
#header h1 > a{display:flex; align-items: center;}
#header h1 img{height:36px;}

#header .btn_menu{display:none; position:absolute; top:60px; right:5%; z-index:91; width:25px; height:24px; font-size:0px; transition:all 0.3s ease 0s; cursor:pointer;}
#header .btn_menu > span{display:block; position:absolute; left:0px; width:100%; height:2px; background:#222;}
#header .btn_menu > span:nth-of-type(1){top:5px;}
#header .btn_menu > span:nth-of-type(2){top:50%; margin-top:-1px; transition:background 0.3s ease 0s;}
#header .btn_menu > span:nth-of-type(3){top:17px;}
#header .btn_menu > span:nth-of-type(1),
#header .btn_menu > span:nth-of-type(3){transition:all 0.3s ease; transition-property:top, transform; transition-delay:0.3s, 0s;}
#header .btn_menu.active{position:fixed; transform:rotate(180deg);}
#header .btn_menu.active > span:nth-of-type(1){top:10px; transform:rotate(-45deg);}
#header .btn_menu.active > span:nth-of-type(2){background:transparent;}
#header .btn_menu.active > span:nth-of-type(3){top:10px; transform:rotate(45deg);}
#header .btn_menu.active > span:nth-of-type(1),
#header .btn_menu.active > span:nth-of-type(3){background:#222; transition-delay:0s, 0.3s;}
#header .btn_close{position:fixed; opacity:0; visibility:hidden; top:0px; left:0px; z-index:99; width:-webkit-calc(100% - 320px); width:100%; height:-webkit-calc(100vh - -0px * 1); height:calc(100vh - -0px * 1); background:#000; font-size:0; transition:all 0.3s ease-out 0s;}

#header nav{display:inline-block;}
#header nav .m_quick{display:none;}
#header nav .gnb{text-align:center;}
#header nav .gnb > li{display:inline-block; position:relative;}
#header nav .gnb > li:last-child:after{background:none;}
#header nav .gnb > li > a{position:relative; display:inline-block; padding:36px 0; font-size:19px; color:#222; font-weight:500; text-transform:uppercase;}
#header nav .gnb > li.case .sub_menu{display:none;}
#header nav .gnb > li:hover > a{color:#20307b;}
#header nav ul.gnb > li > a{padding:35px;}

#header nav .gnb > li ul > li:first-child > a{border-top-width:0px;}
#header nav .gnb > li.tit_gnb{display:none;}
#header .gnb .sub_menu li a:hover{color:#20307b; font-weight:600;}

#header nav ul.gnb > li{float:left; text-align:center;}
#header nav ul.gnb > li.show > a:hover > span,
#header[data-show="active"] nav .gnb > li > a.active  > span{color:#0088aa;}
#header nav ul.gnb > li > a{display:block;position:relative;transition:transform 0.3s ease;}
#header nav ul.gnb > li > a > h2{display:none;}
#header nav ul.gnb > li > a > span{position:relative; font-size:19px; font-weight:300; color:#fff; transition:all 0.3s ease;}
#header nav ul.gnb > li > a:hover > span{}
#header nav ul.gnb > li > a:hover > span:before,
#header nav ul.gnb > li > a.active > span:before{content: ""; position: absolute; top:2px; left:-20px; width:2px; height:18px; background:#0088aa; transition: 0.3s; -webkit-transition: 0.3s;}
#header nav ul.gnb > li > a:hover > span:after,
#header nav ul.gnb > li > a.active > span:after{content: ""; position: absolute; top:2px; right:-20px; width:2px; height:18px; background:#0088aa; transition: 0.3s; -webkit-transition: 0.3s;}

#header nav ul.gnb > li{position:relative;}
#header nav ul.gnb > li > a{box-sizing:border-box; padding-top:0px; padding-bottom:0px;}

#header nav ul.gnb > li:first-child > ul{border-left:1px solid #eee;}
#header .bg_gnb{position:absolute;left:0px;top:0px;z-index:-1;width:100%;background:#fff; border-bottom:1px solid #eee; transform:translateY(-100%);transition:all 0.5s ease 0s;}
#header .bg_gnb.show{transform:translateY(0);}
#header.fixed{position:fixed; top:0; left:0; right:0; background:#fff; border-bottom:1px solid #eee;}
#header[data-show="active"] h1,
#header.fixed h1 .fixed{display:block;}
#header[data-show="active"] nav .gnb > li > a,
#header.fixed nav .gnb > li > a{font-weight:500; color:#333;}
#header[data-show="active"] nav .gnb > li > a.on,
#header.fixed nav .gnb > li > a.on{font-weight:500;}


#header[data-show="active"]{position:relative; background:#fff; border-bottom:1px solid #eee;}
#header[data-show="active"].fixed{position:relative;}
#header[data-show="active"] h1{top:24px;}
#header[data-show="active"] h1 a{display:none;}
#header[data-show="active"] h1 .fixed{display:block;}
#header[data-show="active"] nav .gnb > li > a{padding:31px 0;}
#header[data-show="active"] > .area_util{top:21px;}

#container{position:relative; }
#content{position:relative;  width:100%; background:#fff;}





.area_sns{position:absolute; top:25px; right:100px;}
.area_sns ul{display:flex;}
.area_sns ul li{margin-left:10px;}
.area_sns ul li img{height:19px;}
.area_sns ul li > a{display:flex; justify-content: center; align-items: center; width:45px; height:45px; border-radius:50px; box-sizing:border-box;}
.area_sns ul li.blog > a{background:#2eb34a;}
.area_sns ul li.insta > a{
  background-image: -moz-linear-gradient( 90deg, rgb(238,169,56) 0%, rgb(240,92,44) 30%, rgb(232,49,145) 60%, rgb(65,74,235) 100%);
  background-image: -webkit-linear-gradient( 90deg, rgb(238,169,56) 0%, rgb(240,92,44) 30%, rgb(232,49,145) 60%, rgb(65,74,235) 100%);
  background-image: -ms-linear-gradient( 90deg, rgb(238,169,56) 0%, rgb(240,92,44) 30%, rgb(232,49,145) 60%, rgb(65,74,235) 100%);}
.area_sns ul li.youtube > a{background:#ed2123;}
.area_sns ul li.youtube > a img{height:15px;}
/*footer*/

.ft_utill{padding:55px 0;}
.ft_utill > li{position:relative; display:inline-block; margin:0 30px 0 0;}
.ft_utill > li:before{content:''; position:absolute; top:8px; right:-17px; width:1px; height:10px; background:rgba(255,255,255,0.05);}
.ft_utill > li:last-child{margin:0;}
.ft_utill > li:last-child:before{display:none;}
.ft_utill > li > a{display:inline-block; font-size:16px; font-weight:400; color:#efefef; opacity:0.7;}
.ft_info{border-top:1px solid rgba(255,255,255,0.1);}
#footer{position:relative; z-index:4; padding:0; background:#1c2c51; padding:0 0 140px;}
#footer[data-show="active"] .link_kakaomap{background:#ffd400;}
#footer .f_logo{margin:80px 0 0;}
#footer .f_logo img{height:40px;}
#footer address b{padding:0 5px 0 0; font-size:15px; font-weight:400; color:#d5d5d5; opacity:0.5;}
#footer address span{padding:0 20px 0 0; }
#footer address span, #footer address a{display:inline-block; font-size:15px; font-weight:500; color:#d5d5d5; line-height:1.5em;}
#footer address{margin:30px 0 0;}
#footer address br{display:none;}
#footer .btn_top_box{visibility:hidden; position:fixed; bottom:20px; right:20px; width:60px; height:60px; background:#12203f; text-align:center;}
#footer .btn_top{display:flex; justify-content: center; align-items: center; flex-direction: column; width:100%; height:100%;}
#footer .btn_top a{display:block; width:100%; height:100%;}
#footer .btn_top img{position:relative; height:7px;}
#footer .btn_top span{display:block; font-size:13px; color:#fff; line-height:1em; margin:5px 0 0;}
.area_copy{display:flex; justify-content: space-between; align-items: center; margin:10px 0 0;}
.area_copy p{font-size:15px; font-weight:300; color:#d5d5d5; line-height:1.3em; opacity:0.35;}

#side_area {position: fixed; top: 50%; right: 30px; transform: translateY(-50%); z-index: 99; cursor: pointer; opacity: 0; transition: 1s all 200ms;}
.quick_menu {background: #12203f; border-radius: 50px; width: 95px; text-align: center; box-shadow: 0px 10px 16px 4px rgba(0, 0, 0, 0.15); overflow:hidden;}
.quick_menu ul li {padding: 12px 0; font-size: 14px; transition:all 0.3s ease;}
.quick_menu ul li:nth-child(1){padding-top:30px;}
.quick_menu ul li:last-child{padding-bottom:25px;}
.quick_menu ul li a {color: #fff;}
.quick_menu ul li i {position: relative; display: block; padding-bottom:7px;}
.quick_menu ul li i img{height:22px;}
.quick_menu ul li span{display:inline-block; font-size: 14px; line-height:1.2em;}
.quick_menu ul li.top img{display:block; height:7px; margin:0 auto;}
.quick_menu ul li.top span{display:block; margin:5px 0 0; font-size:15px; font-weight:500;}
.quick_menu ul li:hover{background:rgba(255,255,255,0.1);}

.topBtn {width: 61px; border-radius: 21px; background: #fff; text-align: center; padding: 16.5px 0; font-size: 14px; font-weight: bold; margin: 19px auto 0; box-shadow: rgba(0, 0, 0, 0.1) 0px 3px 8px;}
.topBtn i {position: relative; display: block; padding-bottom: 5px;}
.topBtn i::before {content: ''; position: absolute; top: 0; left: 50%; transform: translateX(-50%); background: url('../images/common/q_icon4.png') no-repeat; width: 8px; height: 4px;}


/* sub visual */
.area_subVisual{position:relative; display:block; width:100%; height:510px; overflow:hidden!important; background-size:cover; background-color:#555; margin: 100px 0 0;}
.img_subVisual{width:100%; height:100%; background-size:cover !important; animation: imagescale 3s ease-in-out alternate; -webkit-animation: imagescale 3s ease-in-out alternate; -moz-animation: imagescale 3s ease-in-out alternate; -o-webkit-animation: imagescale 3s ease-in-out alternate; transform:scale(1.0);}
.area_subVisual > .txt{position:absolute; top:40%; width:100%; text-align:center;  transform:translateY(-50%);}
.area_subVisual > .txt .inr{margin:0 auto;}
.area_subVisual > .txt > h2{display:block; font-size:60px; font-weight:700; color:#fff; line-height:1.4em; text-transform:uppercase;}
.area_subVisual > .txt > span {display: block; font-size: 20px; color: #fff; padding: 10px 0 0;}
.area_subVisual > .txt > p{display:inline-block; font-size:18px; font-weight:400; color:#fff; text-transform:uppercase; word-break:keep-all;}
.area_subVisual.sub01 .img_subVisual{background-image:url(../images/content/s_visual01.jpg);}
.area_subVisual.sub02 .img_subVisual{ background-image:url(../images/content/s_visual02.jpg);}
.area_subVisual.sub03 .img_subVisual{ background-image:url(../images/content/s_visual03.jpg);}
.area_subVisual.sub04 .img_subVisual{ background-image:url(../images/content/s_visual04.jpg);}
.area_subVisual.sub05 .img_subVisual{ background-image:url(../images/content/s_visual05.jpg);}


/* lnb 
.lnb{width:100%; z-index:80; border-bottom:1px solid #eee; background:#fff;}
.lnb .wrap{width:1400px; margin:0 auto;}
.lnb.fixed{position:fixed; top:0;}
.lnb ul{max-width:100%; background:#fff; text-align:left;}
.lnb ul > li{position:relative; height:100%; display:inline-block; box-sizing:border-box;}
.lnb ul > li:last-child{border-right:0;}
.lnb li:before{content:""; position:absolute; left:50%; bottom:-1px; width:0; height:2px; background:#0a317c; opacity:0; transition:0.3s; -webkit-transition:0.3s;}
.lnb li.active:before, .lnb li:hover:before {width:100%; margin-left:-50%; opacity:1;}
.lnb ul > li > a{display:block; padding:20px 40px; font-size:18px; font-weight:400; color:#555; text-align:center; line-height:1.5em;}
.lnb li.active > a{color:#0a317c; font-weight:600;}
*/
.area_navigation{position:absolute; top:0; right:0; text-align:right;}
.area_navigation ul li{position:relative; display:inline-block; padding:0 10px; font-size:15px; color:#777;}
.area_navigation ul li a{padding:0;}
.area_navigation ul li img{display:inline-block; position:relative; top:-2px; height:14px; vertical-align:middle;}

.area_navigation ul li:after{content:""; position:absolute; top:10px; right:-2px; width:2px; height:2px; background:#aaa; border-radius:50px;}
.area_navigation ul li:last-child:after{display:none;}
.area_navigation ul li:before{display:none;}
.area_navigation ul li:last-child{padding:0 0 0 10px;}


.area_tab{max-width:1400px; margin:0 auto 50px;}
.area_tab ul{text-align:center;}
.area_tab ul > li{display:inline-block; min-width:145px; height:50px; padding:5px;}
.area_tab ul > li > a{display:block; height:100%; padding:0 7px; background:#fff; border:1px solid #e5e5e5; box-sizing:border-box; color:#666; font-size:16px; text-align:center; transition:all 0.5s ease;}
.area_tab ul > li > a.on{position:relative; z-index:3; background:#00ac4e; border:1px solid #00ac4e; color:#fff; box-shadow:0px 4px 13px rgb(210, 255, 231);}
.area_tab ul > li > a span{display:inline-block; vertical-align:middle; font-size:16px;}
.area_tab ul > li > a:after{content:''; display:inline-block; height:100%; vertical-align:middle;}


/* lnb */
.lnb{width:100%; border-bottom:1px solid #d9d9d9; background:#fff; text-align:left; transition:transform 1s cubic-bezier(0.57, 0.06, 0.07, 0.97); }
.lnb .inr{position:relative;}
.lnb .dept {display: flex;}
.lnb .dept > li{position:relative; width:auto; height:75px; box-sizing:border-box;}
.lnb .dept_tit a{position:relative;}
.lnb .dept_tit a:after{content:''; display:block; position:absolute; top:50%; right:0; width:11px; height:6px; margin-top:-3px; background:url(../images/content/icon_navigation02.svg) no-repeat 90% 50%; transition:all 0.3s ease-out 0s;}
.lnb .dept_tit a.active:after{transform:rotate(180deg);}
.lnb .dept > li a,
.lnb .dept_tit span{display:block; box-sizing:border-box; padding:24px 20px; font-weight:400; font-size:18px; width: 250px;position: relative;}
.lnb .dept_tit {position: relative;}
.lnb .dept_tit::before {content: ''; position: absolute; top: 50%; right: 20px; transform: translateY(-50%); background: url('../images/content/down_arrow.svg') no-repeat; width: 14px; height: 8px;}
.lnb .dept .home{width:75px;background: #151f3d url(../images/content/home.svg) no-repeat 50% 50%; background-size:22px auto;}
.lnb .dept .home a{display:block; overflow:hidden; height:100%; padding:0; font-size:0; text-indent:100%; white-space:nowrap;}
.lnb .dept_list{display:none; position:absolute; top:76px; left:-1px; z-index:20; width:100%; padding:6px 0; background:#fff; box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;}
.lnb .dept_list a{display:block; width:100%; box-sizing:border-box; font-weight:200; font-size:16px; color:#666; transition:all 0.3s ease-out 0s;}
.lnb .dept_list a:hover{color:#999;}
.lnb .dept:after{content:''; display:block; clear:both;}

.btn_m_lnb{display:none; position:relative; padding:12px 35px 12px 15px; border:1px solid #dbdbdb; font-size:16px; transition:all 0.3s ease 0s;}
.btn_m_lnb:after{content:''; display:block; position:absolute; top:50%; right:20px; width:9px; height:5px; margin-top:-2.5px; background:url(../images/common/img_arrow_blue.png) no-repeat 0 0; background-size:100%; transition:all 0.3s ease 0s;}
.btn_m_lnb.active{background-color:#faa61a; border:1px solid #faa61a; color:#fff;}
.btn_m_lnb.active:after{transform:rotate(-360deg); background-image:url(../images/common/img_arrow.png);}

.lnb .dept > li:last-child:after{background:none;}
.lnb .dept .dept_list li a{padding:10px 20px !important;}

.lnb .dept > li:nth-child(3) {border-left: 1px solid #d9d9d9; border-right: 1px solid #d9d9d9;}
.lnb .sub_menu {display: none;}
.lnb .area_sns {display: none;}



 /* **********************************
 * INTRO
 * **********************************/
.area_intro{width:100%; padding:30px; box-sizing:border-box;}
.list_intro_wrap{overflow:hidden; width:100%; height:calc(100vh - 60px);}
.list_intro{overflow:hidden; width:101%; height:100%; font-size:0;}
.list_intro:after{content:""; display:block; clear:both;}
.list_intro .intro_item{float:left; display:inline-block; margin:0 30px 0 0; width:calc((100% / 2) - 15px); height:100%; padding:0; 
font-size:1rem; transition:width 430ms ease;}
.list_intro .intro_item:nth-child(2){margin:0;}
.list_intro .intro_item .item_inner{display:block; position:relative; z-index:10; width:100%; height:100%;}
.list_intro .intro_item .item_inner:after{
	opacity:0;
	visibility:hidden;
	content:"";
	display:block;
	position:absolute;
	top:0;
	left:0;
	z-index:-1;
	width:100%;
	height:100%;
	background:-moz-linear-gradient(left,  rgba(2,112,65,1) 0%, rgba(252,254,253,0) 99%, rgba(255,255,255,0) 100%);
	background:-webkit-linear-gradient(left,  rgba(2,112,65,1) 0%,rgba(252,254,253,0) 99%,rgba(255,255,255,0) 100%);
	background: linear-gradient(to right, #173487 0%,rgba(252,254,253,0) 99%,rgba(255,255,255,0) 100%);
	transition:all 600ms;
}
.list_intro .intro_item .item_inner .logo{display:block;}
.list_intro .intro_item .item_inner .logo img{height:58px;}
.list_intro .intro_item .item_inner{background-repeat:no-repeat; background-position:50% 50%;}
.list_intro .intro_item:nth-child(1) .item_inner{background-image:url(../images/common/intro01.jpg);}
.list_intro .intro_item:nth-child(2) .item_inner{background-image:url(../images/common/intro02.jpg);}
.list_intro .intro_item a{display:inline-block; position:absolute; width:80%; top:47.6%; left:50%; text-align:center; transform:translate(-50%,-50%);color:#fff;}
.list_intro .intro_item a:before,
.list_intro .intro_item a:after{content:""; display:block; position:absolute; left:50%; margin-left:-100px; width:200px; height:1px; transform:rotate(-45deg); background:rgba(255,255,255,.7);}
.list_intro .intro_item a:before{bottom:100%; margin-bottom:22%;}
.list_intro .intro_item a:after{top:100%; margin-top:22%;}
.list_intro .intro_item a em{margin:30px 0 0;display:block; line-height:1.5; font-size:21px; font-weight:300;}
.list_intro .intro_item a .more{overflow:hidden; display:inline-block; position:absolute; top:100%; left:0; width:100%; height:22px; line-height:1; margin-top:22%; font-size:20px; font-weight:500; text-align:center;}
.list_intro .intro_item a .more span{display:inline-block; transform:translateY(100%);}
.list_intro .intro_item i{position:absolute; bottom:44px; left:0; width:100%; font-size:18px; text-align:center; color:#fff;}

.list_intro .intro_item.active{width:58%;}
.list_intro .intro_item.active .item_inner:after{opacity:1;visibility:visible;}
.list_intro .intro_item.active a{}
.list_intro .intro_item.active a:before,
.list_intro .intro_item.active a:after{transform:none;}
.list_intro .intro_item.active a:before{margin-bottom:15%;}
.list_intro .intro_item.active a:after{margin-top:15%;}
.list_intro .intro_item.active a .more{opacity:1; visibility:visible;}
.list_intro .intro_item.active a .more span{transform:translateY(0);}
.list_intro .intro_item.active i{opacity:0; visibility:hidden;}
.list_intro .intro_item.not_active{width:calc(42% - 30px);}

/* transition */
.list_intro .intro_item a{transition:all 600ms;}
.list_intro .intro_item a:before,
.list_intro .intro_item a:after{transition:all 600ms 700ms;}
.list_intro .intro_item a .more{transition:all 600ms 300ms;}
.list_intro .intro_item a .more span{transition:all 600ms 300ms;}
.list_intro .intro_item.active a:before,
.list_intro .intro_item.active a:after{transition:all 600ms 300ms; }
.list_intro .intro_item.active a .more{transition:all 600ms 600ms;}
.list_intro .intro_item.active a .more span{transition:all 600ms 600ms;}


@media all and (min-width:768px){
	.list_intro .intro_item{height: 100% !important;}	
}
@media all and (max-width:1600px){
	#header h1 {left:30px;}
	.area_sns{right:30px;}
	#header nav ul.gnb > li > a{padding:0 30px;}
}

@media all and (max-width:1500px){
	.inr{ width:90%;}
	.lnb .wrap{width:90%;}
	#header nav ul.gnb > li > a{padding:0 25px;}
}
@media all and (max-width:1400px){
	.inr{width:90%;}
	#header nav ul.gnb > li > a{padding:0 20px; font-size:18px;}
	
}

@media all and (max-width:1300px){
	#header h1 {left:20px;}
	#header h1 img{height:34px;}
	.area_sns{right:20px;}
	#header nav ul.gnb > li > a{padding:0 15px; font-size:17px;}
}
@media all and (max-width:1200px){
	#footer .area_title h2{font-size:50px;}
	#footer address br{display:block;}
	
	.area_intro{padding:20px; }
	.list_intro_wrap{height:calc(100vh - 40px);}
	.list_intro .intro_item{margin:0 20px 0 0; width:calc((100% / 2) - 10px);}
	.list_intro .intro_item .item_inner .logo img{height:46px;}
	.list_intro .intro_item a em{font-size:20px; margin:20px 0 0;}
	.list_intro .intro_item a:before, .list_intro .intro_item a:after{width:120px; margin-left: -60px;}
}
@media all and (max-width:1100px){
	#footer .area_title h2{font-size:47px;}
}

@media all and (min-width:1201px){
	#header.show:before{content:''; position:absolute; left:0; right:0; top:100px; z-index:900; border-bottom:1px solid #eee;}
	#header nav ul.gnb > li > a{height:100px; line-height:100px;}
	#header nav ul.gnb > li > ul{position:absolute; top:100px; z-index:10; width:100%; border-right:1px solid #eee;}
	#header nav ul.gnb > li > ul > li > a{display:block; padding:10px 5px;}
	#header nav ul.gnb > li > ul > li:first-child > a{padding-top:15px;}
	#header nav ul.gnb > li > ul{opacity:0; visibility:hidden; transition:all 0.1s ease 0s;}
	#header nav ul.gnb > li > ul.show{opacity:1; visibility:visible; transition-delay:0.3s;}
	#header nav .gnb > li.top{display:none;}
	#header nav .gnb > li:nth-child(2) > ul{border-left:1px solid #eee;}

}

/*
@media all and (max-width:1200px){
	#header{height:80px;}
	#header h1{top:25px;}
	#header h1 img{height:30px;}
	.area_sns{display:none;}
	#header.fixed{position:relative;}
	#header.fixed h1 > a.wt{display:flex;}
	#header.fixed h1 > a.color{display:none;}
	#header .btn_menu{top:25px; right:3%;}
	#header .btn_menu,
	#header .btn_close{display:block;}
	#header nav{margin:0;}
	#header nav .gnb > li{display:block; padding:0; margin:0 5px;}
	#header nav .gnb > li.tit_gnb{margin:0 0 30px;}
	#header nav .gnb > li.tit_gnb .btn_intra{position:absolute; top:18px; right: 85px; display:inline-block; background:#fff; border-radius:50px; box-sizing:border-box;}
	#header nav .gnb > li.tit_gnb .btn_intra a{display:block; padding:6px 15px; box-sizing:border-box;}
	#header nav .gnb > li.tit_gnb .btn_intra a span{font-size:16px; font-weight:600; color:#ed1c24;}
	#header nav .gnb > li.tit_gnb a{border:none;}
	#header nav .gnb > li.tit_gnb img{position:relative; top:9px;}
	#header[data-show="active"] h1{top:20px;}
	#footer .btn_top_box{right:5%; bottom:123px;}

	.lnb .wrap{width:94%;}
	.lnb ul > li > a{font-size:17px; padding:15px 30px;}

	#area_quick a{padding:15px 18px;}
	#area_quick:hover a{padding:15px 20px;}

	#footer{padding:90px 0;}
	#footer .area_title p{font-size:15px;}
	#footer .area_title .btn_more{margin:40px 0 0;}


}
*/

@media all and (max-width:1200px){
	#header{height:80px;}
	#header h1{top:25px;}
	#header h1 img{height:30px;}
	.area_sns{display:none;}
	#header .bg_gnb{display:none !important;}
	#header.mob nav .gnb > li.top{display:block; padding:25px 20px;}
	#header.mob nav .gnb > li .area_sns{display:block; position:relative; top:0; right:0;}
	#header.mob nav .gnb > li .area_sns > ul{display:flex;}
	#header.mob nav .gnb > li .area_sns > ul > li{margin-right:5px; margin-left:0;}
	#header.mob nav .gnb > li .area_sns > ul > li > a{display:flex; padding:0; text-align:center; width:34px; height:34px;}
	.area_sns ul li img{height:14px;}
	.area_sns ul li.youtube > a img{height:12px;}
	#header .btn_menu{top:27px; right:20px;}
	#header .btn_menu,
	#header .btn_close{display:block;}

	#header nav{position:fixed; visibility:hidden; top:0px; right:-100%; z-index:90;  width: 100%; height: -webkit-calc(100vh - 0px * 1); height: calc(100vh - 0px * 1); background:rgba(0,0,0,0); font-size: 0; transition: all 0.3s ease-out 0s; transition:all 0.5s ease-out 0s;}
	#header nav.active{right:0px;  background:rgba(0,0,0,0.4); visibility:visible;}
	#header nav .gnb{position:absolute;top:0px;right:-100%;z-index:99;  width:100%; max-width:400px; height: 100%; background:#fff; background-size:cover; box-shadow:-5px 0px 15px rgba(0,0,0,0.1); overflow-y: auto; transition: all 0.8s ease-out 0s; }
	#header nav.active .gnb{right:0;}
	#header nav{margin:0;}
	#header.mob nav .gnb > li{float:unset;  display:block; padding:0; margin:0;}
	#header nav ul.gnb > li > a{position:relative; padding:10px 25px; font-size:16px;}
	#header nav ul.gnb > li > a:before{content:''; display:block; position:absolute; opacity:0.2; top:50%; right:25px; width:14px; height:7px; margin-top:-4px; background:url(../images/common/icon_navigation02.svg) no-repeat 50% 0; background-size:14px 7px; transition:all 0.4s ease 0s;}
	#header nav ul.gnb > li > a.active:before{opacity:1; transform:rotate(180deg);}
	#header nav .gnb > li > a{display:block; padding:20px 80px; font-size:20px; font-weight:500; color:#222; text-align:left; transition:all 0.3s ease 0s;}
	#header nav .gnb > li > a.active{font-weight:700;}
	#header nav .gnb > li > ul.sub_menu{display:none; padding:14px 0; text-align:left; width:100%; background:#f9f9f9; border-top:1px solid #eee; border-bottom:1px solid #eee; box-sizing:border-box;}
	#header nav .gnb > li ul > li > a{position:relative; display:block; padding:5px 30px ; text-align:left; font-size:15px; color:#444;}

	#header nav .m_quick{position:absolute; bottom:0; right:-100%; max-width:400px; width:100%; height:80px; display:flex; z-index:999; background:#12203f; transition: all 0.8s ease-out 0s; box-shadow:18px -7px 9px 1px rgb(207 212 224 / 53%)}
	#header nav.active .m_quick{right:0;}
	#header nav .m_quick li{flex:0 1 25%; height:100%; line-height:100%; border-right:1px solid rgba(255,255,255,0.1);}
	#header nav .m_quick li:last-child{border:none;}
	#header nav .m_quick li > a{display:flex; flex-direction: column; justify-content: center; align-items: center; padding:5px; box-sizing:border-box; width:100%; height:100%;}
	#header nav .m_quick li > a > span{display:inline-block; width:100%; margin:7px 0 0; font-size:12px; color:#fff; line-height:1.1em; word-break:break-word;}
	#header nav .m_quick li i{display:block;}
	#header nav .m_quick li img{display:block; height:20px; margin:0 auto;}

	#side_area{display:none;}
	#footer .btn_top_box{visibility:visible;}

    .area_subVisual {margin: 80px 0 0;}
    .area_subVisual > .txt > h2 {font-size: 48px;}
    .area_subVisual > .txt > span {font-size: 16px;}
}
@media all and (max-width:1024px){
	.ft_utill{padding:35px 0 30px;}
	#footer{padding:0 0 80px;}
	#footer .f_logo{margin:40px 0 0;}
	#footer .f_logo img{height:34px;}
	#footer address{margin:20px 0 0;}
}
@media all and (max-width:950px){
	#footer .area_title span{margin:0 0 10px;}
	#footer .area_title .btn_more{margin:30px 0 0;}
	#footer .map{position:relative; top:0; width:90%; height:400px; margin:30px auto 0;}
	#footer .map .img_map img{min-width:100%;}
	.link_kakaomap{left:unset; right:0; z-index:90; width:85px; height:85px;}
	#footer address{margin:30px 0 0;}
}
@media all and (max-width:768px){
	#header{height:70px;}
	#header h1{top:19px;}
	#header .btn_menu{top:22px;}
	.ft_utill{padding:25px 0 20px;}
	.ft_utill > li > a{font-size:15px;}
	#footer{padding:0 0 70px;}
	#footer .f_logo{margin:30px 0 0;}
	#footer .f_logo img{height:30px;}
	#footer address{margin:15px 0 0;}

	.area_tab ul > li{padding:4px 4px 6px; min-width:120px; height:45px;}
	.area_tab ul > li > a span{font-size:15px;}

	.area_tab{margin:0 auto 28px;}
	.area_navigation{position:relative; margin:0 0 20px; text-align:left;}
	.area_navigation ul li img{height:12px}
	.area_navigation ul li:nth-child(1){padding-left:0;}
	.area_navigation ul li{font-size:14px; padding:0 7px;}
	.area_navigation ul li:nth-child(1):after{right:-3px;}
	.area_navigation ul li:after{right:-5px;}

	#footer .btn_top_box{bottom:10px; right:10px; width:50px; height:50px;} 

	.area_intro{padding:0; height:100%;}
	.list_intro{width:100%;}
	.list_intro_wrap{height:100%;}
	.list_intro .intro_item{float:none; width:100% !important; height: 43vh !important; padding:14px; box-sizing:border-box;}
	.list_intro .intro_item:last-child{padding-top:0;}
	.list_intro .intro_item .item_inner{background-size:cover; transition:background 300ms;}
	.list_intro .intro_item a:before,
	.list_intro .intro_item a:after{content:""; transform:rotate(-25deg);}
	.list_intro .intro_item a .more span{font-size:15px;}

	.list_intro_wrap span.scroll{display:block; position:fixed; z-index:10;}
	.list_intro_wrap span.scroll span{color:#fff;}
	.list_intro_wrap span.scroll i:before{background:#fff;}
	.list_intro_wrap span.scroll span{margin-bottom:27px;}
	.list_intro_wrap span.scroll i{height:110px;}

    .area_subVisual {margin: 70px 0 0; height: 320px;}
    .area_subVisual > .txt {top: 38%;}
    .area_subVisual > .txt > h2 {font-size: 40px;}
    .area_subVisual > .txt > span {padding: 6px 0 0;}
    .lnb .dept .home {width: 60px;}
    .lnb .dept > li {height: 60px;}
    .lnb .dept > li a {padding: 20px; font-size: 14px;}
    .lnb .dept .home {background-size: 16px auto;}
}
@media all and (max-width:650px){
	#footer address br{display:none;}
	#footer address{margin:20px 0 0;}
	#footer address b,
	#footer address span, #footer address a{display:block; font-size:14px;}
	#footer address b{margin:7px 0 0;}
	.area_copy p{font-size:14px;}

    .lnb .inr {width: 100%;}
    .lnb .dept > li {width: 45%;}
    .lnb .dept > li:nth-child(3) {border-right: 0;}
    .lnb .dept > li a {width: 100%;}
}
@media all and (max-width:600px){
	.area_tab ul > li{padding:3px 3px 5px; min-width:110px;}
	.area_lnb a[data-lnb="home"]{margin:0; width:50px;}
	.area_lnb *[data-lnb]{min-width:190px;}
}
@media all and (max-width:550px){
	#header{height:60px;}
	#header h1{left:10px; top:17px;}
	#header h1 img{height:25px;}
	#header .btn_menu{top:18px;}
	#header nav .m_quick{height:65px;}
	#header nav .m_quick li > a > span{font-size:11px;}
	#header nav .m_quick li img{height:18px;}
	#header nav .gnb{height:calc(100% - 65px);}
	#header.mob nav .gnb > li.top{padding:20px;}
	#header nav ul.gnb > li > a{padding:8px 20px; font-size:15px;}
	#header nav ul.gnb > li > a:before{right:20px;}
	#header nav .gnb > li ul > li > a{font-size:14px; padding:4px 25px;}
	.ft_utill{padding:15px 0;}
	.ft_utill > li > a{font-size:14px;}

	.area_tab ul > li{min-width:100px; height:40px; padding:2px 2px 4px;}
	.area_tab ul > li > a span{font-size:14px;}
	.area_navigation{margin:0 0 15px;}
	.area_navigation ul li{font-size:13px;}
	.lnb ul > li > a{font-size:15px; padding:10px 25px;}

	#footer .btn_top_box{width:45px; height:45px;} 

	.list_intro .intro_item .item_inner .logo img{height:40px;}
	.list_intro .intro_item a em{font-size:17px; margin:15px 0 0;}

    .area_subVisual {margin: 60px 0 0;}

}
@media all and (max-width:450px){
	.area_tab ul > li{padding:0 2px 6px 0; min-width:80px; height:36px;}
	.area_tab ul > li > a span{font-size:13px;}
	.area_navigation{margin:0 0 10px;}
	.lnb ul > li > a{font-size:14px; padding:5px 20px;}

    .lnb .dept .dept01 {display: none;}
    .lnb .dept > li {width: 86%;}
    .lnb .dept > li:nth-child(3) {border-left: 0;}
}
@media all and (max-width:400px){
	.area_tab ul > li > a span{font-size:12px;}

	.list_intro .intro_item .item_inner .logo img{height:34px;}
	.list_intro .intro_item a em{font-size:16px; margin:12px 0 0;}
}
@media all and (max-width:390px){
	.area_tab ul > li{min-width:auto;}
}
@media all and (max-width:350px){
	.area_copy{margin:5px 0 0;}
}