@charset "utf-8";
@import url( ./fonts.css );

/* 초기화 */
html, body,
div, span,
dl, dt, dd, ul, ol, li,
h1, h2, h3, h4, h5, h6,
p, address,
form, fieldset, legend, input, select, textarea,
table, caption, col, colgroup, thead, tfoot, tbody, th, td{margin:0; padding:0;}
h1, h2, h3, h4, h5, h6{font-size:100%; font-weight:normal;}
html, fieldset, img, abbr, acronym{border:0 none;}
ol, ul, li, dl, dt, dd{list-style:none;}
table{border-collapse:collapse; border-spacing:0;}
caption, th, td{font-weight:normal;}
address, caption, em{font-weight:normal; font-style:normal;}
caption{display:none;}
legend{display:none;}
html{}
body{min-width:320px; margin:0; padding:0; font-size:14px; font-family:'Montserrat', "NanumSquareNeo",'Noto Sans KR', sans-serif !important; overflow-x:hidden; position:relative;}
textarea, select{font-size:12px; font-family:"NanumSquareNeo",'Noto Sans KR', sans-serif !important;}
select{height:24px; margin:0; padding:2px; border:1px solid #d7d7d7; font-family:"NanumSquareNeo",'Noto Sans KR', sans-serif !important; background:#fff;}
p{margin:0; padding:0; word-break:keep-all; word-wrap:break-word;}
div{word-break:keep-all; word-wrap:break-word;}
hr{display:none;}
pre{overflow-x:scroll; font-size:1.1em;}
a{color:#222; text-decoration:none;}
button{cursor:pointer;}
iframe{max-width:100%;}
*, :after, :before{-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}

.dn{display:none;}

.mT30{margin-top:30px;}
.mT50{margin-top:50px;}

.blind{font-size:0; left:-1000em; line-height:0; position:absolute;}


.wd-info{padding-bottom:5px; margin-bottom:0; font-size:14px; color:#ff4545; display:none;}

@media screen and (max-width:640px){
	.wd-info{display:block;}
	.wd-wrap{overflow-x:scroll;}
	.wd-wrap table{width:760px !important;}
}

@media screen and (max-width:780px){
	.wd{display:none;}
}


#wrap{z-index:9999; position:relative;}

#header-section{width:100%; top:0; left:0; z-index:99999; position:fixed;}
#header-section.header-on{background:#fff; border-bottom:1px solid #dedede;}
#header-section .header-area{width:100%; max-width:1600px; margin:0 auto; padding:0 100px;}
#header-section .gnb-box{height:88px; z-index:9999; position:relative;}
#header-section #logo{width:100px; top:50%; left:0; -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); transform:translateY(-50%); position:absolute;}
#header-section #logo img{width:100%;}
#header-section #gnb{margin-left:260px; float:left;}

#header-section #gnb:after{clear:both; content:""; display:block;}
#header-section #gnb .gnb-1ul{}
#header-section #gnb .gnb-1ul:after{clear:both; content:""; display:block;}
#header-section #gnb .gnb-1ul .gnb-1li{position:relative; float:left;}
#header-section #gnb .gnb-1ul .gnb-1li .gnb-1a{font-family:'Montserrat'; padding:0 36px; font-size:18px; line-height:88px; display:block; color:#fff; font-weight:700;}
#header-section.header-on #gnb .gnb-1ul .gnb-1li .gnb-1a{color:#000;}
#header-section #gnb .gnb-2ul{height:0; z-index:10000; opacity:0; overflow:hidden; position:absolute;}
#header-section #gnb .gnb-2ul:after{clear:both; content:""; display:block;}

#header-section #gnb .gnb-1ul .gnb-1li:last-child .gnb-2wrap{border-right:1px solid #e1dfe2;}
#header-section #gnb .gnb-2ul .gnb-2li{float:left;}
#header-section #gnb .gnb-2ul .gnb-2li .gnb-2a{padding:3px 15px; font-size:16px; line-height:56px; color:#fff; display:block; position:relative;}

#header-section #gnb .gnb-1ul .gnb-1li .gnb-1a:after{width:0; max-width:100%; height:4px; left:50%; bottom:0; z-index:1; background:#fff; content:""; position:absolute; transition:all 0.33s ease-out 0s; -moz-transition:all 0.33s ease-out 0s; -webkit-transition:all 0.33s ease-out 0s; -ms-transition:all 0.33s ease-out 0s; -o-transition:all 0.33s ease-out 0s; -ms-transform:translateX(-50%); -webkit-transform:translateX(-50%); -moz-transform:translateX(-50%); transform:translateX(-50%);}
#header-section #gnb .gnb-1ul .gnb-1li .gnb-1a.on:after,
#header-section #gnb .gnb-1ul .gnb-1li .gnb-1a:hover:after{width:60px;}

#header-section #gnb .gnb-1ul .gnb-1li:nth-child(1) .gnb-2ul{width:800px; left:40px;}
#header-section #gnb .gnb-1ul .gnb-1li:nth-child(2) .gnb-2ul{width:600px; left:25px;}
#header-section #gnb .gnb-1ul .gnb-1li:nth-child(3) .gnb-2ul{width:300px; left:25px;}
#header-section #gnb .gnb-1ul .gnb-1li:nth-child(4) .gnb-2ul{width:200px; left:30px;}
#header-section #gnb .gnb-1ul .gnb-1li:nth-child(5) .gnb-2ul{width:350px; right:-10px;}
#header-section #gnb .gnb-1ul .gnb-1li:nth-child(6) .gnb-2ul{width:600px; right:-10px;}

@media screen and (max-width:1240px){
	#header-section .header-area{padding:0 60px;}
	#header-section #gnb{display:none;}
	#header-section .gnb-box{height:70px;}
}

@media screen and (max-width:760px){
	#header-section .header-area{padding:0 40px;}
	#header-section #logo{height:auto; left:10px;}
	#header-section #logo img{width:100%;}
}

@media screen and (max-width:640px){
	#header-section .header-area{padding:0 20px;}
}

@media screen and (max-width:480px){
	#header-section #logo{width:80px;}
}

.gnb-bg-box{width:100%; height:0; top:88px; left:0; z-index:1000; background-color:rgba(255,255,255,0.05); display:none; position:absolute;}
#header-section.header-on .gnb-bg-box{background-color:rgba(50,103,255,.9);}

#header-section .top-tel{top:32px; right:60px; font-size:22px; font-weight:700;position:absolute;}
#header-section .top-tel a{color:#fff;}
#header-section .top-tel span{font-size:16px; display:inline-block;}
#header-section.header-on .top-tel a{color:#091D4E;}


#header-section .hbg-menu{width:30px; height:30px; top:20px; right:0; z-index:999; text-indent:-9000px; background:url("../img/btn_allmenu.png") no-repeat center center; display:none; position:absolute;}
#header-section .btn-rallmenu{width:30px; height:30px; top:30px; right:0; z-index:999; background:url("../img/btn_allmenu.png") no-repeat center center; position:absolute;}
#header-section.header-on .hbg-menu{background:url("../img/btn_allmenu_on.png") no-repeat center center;}
#header-section.header-on .btn-rallmenu{background:url("../img/btn_allmenu_on.png") no-repeat center center;}

@media screen and (max-width:1000px){
	#header-section .hbg-menu{display:block;}
	#header-section .btn-rallmenu{display:none;}
	#header-section .top-tel{top:20px; right:60px;}
}

@media screen and (max-width:640px){
	#header-section .top-tel{font-size:18px; top:25px; right:50px;}
	#header-section .top-tel span{font-size:13px;}
}

#main-vod{max-height:970px; background:url("../img/vod_bg.jpg") no-repeat #fff; background-size:cover; overflow:hidden; position:relative;}
#main-vod video{vertical-align:middle;}
#main-vod .vod-bg{width:100%; height:100%; top:0; left:0; background:rgba(0,0,0,.4); position:absolute;}
#main-vod .vod-txt{width:100%; top:50%; left:0; -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); transform:translateY(-50%); z-index:999; text-align:center; color:#fff; position:absolute;}
#main-vod .vod-txt div{font-weight:300; font-size:34px; line-height:120%; color:#fff;}
#main-vod .vod-txt h1{font-family:'Montserrat'; margin-top:40px; font-weight:900; font-size:120px; line-height:120%; color:#fff;}
#main-vod .vod-txt p{margin-top:40px; font-weight:300; font-size:22px; line-height:140%; color:#fff;}
#main-vod .down{width:45px; height:104px; left:50%; bottom:40px; -ms-transform:translateX(-50%); -webkit-transform:translateX(-50%); -moz-transform:translateX(-50%); transform:translateX(-50%); z-index:9999; position:absolute;}
#main-vod .down div{position:relative;}
#main-vod .down span{width:45px; height:104px; background:url("../img/mdown.png") no-repeat; display:block; position:absolute;}

#allMenu-section{width:100%; height:0; top:0; left:0; z-index:99999; background:rgba(0,0,0,.93); position:fixed; opacity:0; overflow:hidden;}
#allMenu-section .allMenu-area{width:100%; max-width:1600px; margin:82px auto; padding:0 10px;}
#allMenu-section .allMenu-area:after{clear:both; content:""; display:block;}
#allMenu-section .allMenu-area .am-top{text-align:right;}
#allMenu-section .allMenu-area .am-top a{display:inline-block; width:48px; background:#0c5aa9; text-align:center;}
#allMenu-section .allMenu-area .am-top a i{line-height:48px; font-size:30px; color:#fff;}
#allMenu-section .allMenu-area ul.am-ul{margin:0 -37px;}
#allMenu-section .allMenu-area ul.am-ul:after{clear:both; content:""; display:block;}
#allMenu-section .allMenu-area ul.am-ul li.am-1li{width:20%; padding:0 37px; float:left;}
#allMenu-section .allMenu-area ul.am-ul li.am-1li:nth-child(4):after{clear:both; content:""; display:block;}
#allMenu-section .allMenu-area .am-box{height:400px; margin-top:40px;}
#allMenu-section .allMenu-area .am-box h2{font-weight:700; font-size:20px; line-height:70px; color:#fff; border-top:2px solid #0c5aa9; border-bottom:1px solid #7b7b7b; display:block; position:relative;}
#allMenu-section .allMenu-area .am-box ul{margin-top:10px;}
#allMenu-section .allMenu-area .am-box ul li{margin:22px 0;}
#allMenu-section .allMenu-area .am-box ul li a{font-size:16px; color:#fff; display:block;}

#sideMask{-webkit-overflow-scrolling:touch;overflow-y:scroll;position:fixed;left:0;right:0;top:0;bottom:0;z-index:1000001;background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABAQMAAAAl21bKAAAAA1BMVEUAAACnej3aAAAAAXRSTlOzEo46UAAAAApJREFUeF5jYAAAAAIAAd6ej78AAAAASUVORK5CYII=');zoom:1;display:none}
#sideMask .menu-in{position:absolute;width:230px;top:0;bottom:0;left:-230px;background-color:#fff;color:#fff;z-index:11;-moz-box-shadow:7px 0 7px -3px rgba(0,0,0,0.5);-webkit-box-shadow:7px 0 7px -3px rgba(0,0,0,0.5);box-shadow:7px 0 7px -3px rgba(0,0,0,0.5);min-height:800px}
#sideMask .side-menuTop{background-color:#28272b;border-bottom:1px solid #323135;padding-left:1em;position:relative}
#sideMask #sgnb{}
#sideMask #sgnb h1{padding:10px 15px; text-align:center; display:block;}
#sideMask #sgnb h1 img{width:auto; height:30px;}
#sideMask #sgnb .sgnb_1dli{position:relative; word-wrap: break-word;}
#sideMask #sgnb .sgnb_1dli_on{color:#fff;}
#sideMask #sgnb .sgnb_1da{margin-top:-1px; font-weight:500; display:block;height:45px; font-size:14px; line-height:45px; padding-left:25px; border-bottom:1px solid #d7d7d7; border-top:1px solid #d7d7d7; -moz-box-sizing:border-box;box-sizing:border-box;background-color:rgba(255,255,255,0.04); position:relative;}
#sideMask #sgnb .sgnb_1da span:after{position:absolute;right:15px; content:"";width:15px;height:40px;display: inline-block;background: url("../img/smarrow_down.png") 50% no-repeat;background-size: contain;float:right;-webkit-transition: transform .3s;transition: transform .3s}
#sideMask #sgnb .sgnb_2dul{width:100%; z-index:2000; display:none; background:#e9e9e9;}
#sideMask #sgnb .on{color:#ea595e !important;}
#sideMask #sgnb .on span:after{-webkit-transform: rotate(-180deg);transform: rotate(-180deg);}
#sideMask #sgnb .sgnb_2da{padding-left:25px; font-size:14px; line-height:40px; border-bottom:1px solid #d9d9d9; display:block;}
#sideMask #sgnb .sgnb_2da span:before{display:inline-block; margin:0 10px 0 0; color:#222; content:'-';}
#sideMask #sgnb .sgnb-sns{padding:10px 0; text-align:center; border-bottom:1px solid #d9d9d9; background:#f7f7f7;}
#sideMask #sgnb .sgnb-sns a{width:35px; height:35px; margin-right:5px; font-size:17px; line-height:35px; text-align:center; color:#fff; border-radius:50%; background-color:#777; vertical-align:bottom; -webkit-transition:background-color .5s; transition:background-color .5s; display:inline-block;}
#sideMask #sgnb .sgnb-sns a:hover{background-color:#222;}
#sideMask #sgnb .sgnb-copyright{padding-top:10px; font-size:12px; text-align:center; color:#999;}
#sideMask #sgnb .sgnb-copyright strong{font-weight:500; color:#222;}
#sideMask .side-close{width:50px; height:50px; right:-50px; top:0; text-indent:-9000px; background:rgba(0,0,0,.6) url("../img/btn_close.png") no-repeat center center; background-size:60%; position:absolute; cursor:pointer;}

#svisual-section{height:400px; background:url('../img/svisual02.jpg') no-repeat center; position:relative;background-size:cover;}
#svisual-section.company{height:400px; background:url('../img/svisual_company.jpg') no-repeat center; background-size:cover;}
#svisual-section.business{background:url('../img/svisual_business.jpg') no-repeat center; background-size:cover;}
#svisual-section.system{background:url('../img/svisual_system.jpg') no-repeat center; background-size:cover;}
#svisual-section.rnd{background:url('../img/svisual_rnd.jpg') no-repeat center; background-size:cover;}
#svisual-section.ir{background:url('../img/svisual_ir.jpg') no-repeat center; background-size:cover;}

#svisual-section .svisual-txt{width:100%; top:54%; -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); transform:translateY(-50%); position:absolute; text-align:center;}
#svisual-section .svisual-txt h2{font-family:'Montserrat'; width:100%; font-size:72px; font-weight:700; color:#fff;}
#svisual-section .svisual-txt p{width:100%; font-size:18px; color:#fff; margin-top:10px; line-height:1.4em;}

@media screen and (max-width:820px){
	#svisual-section{height:300px;}
	#svisual-section .svisual-txt h2{font-size:40px;}
}

@media screen and (max-width:640px){
	#svisual-section{height:250px;}
	#svisual-section .svisual-txt h2{font-size:30px;}
	#svisual-section .svisual-txt p{font-size:16px;}
}

@media screen and (max-width:480px){
	#svisual-section{height:200px;}
	#svisual-section .svisual-txt h2{font-size:24px;}
	#svisual-section .svisual-txt p{font-size:14px;}
}

#snav-section{width:100%;border-bottom:1px solid rgba(0,0,0,.2);}
#snav-section .snav-area{width:100%; max-width:1600px; height:60px; margin:0 auto; padding:0 100px; line-height:60px;}
#snav-section .snav-area:after{clear:both; content:""; display:block;}
#snav-section .snav-area .home-box{border-left:1px solid rgba(0,0,0,.2); float:left;}
#snav-section .snav-area .home-box a{padding:0 20px; font-size:28px; display:block; color:#000;}
#snav-section .snav-area a{display:block; position:relative;}
#snav-section .snav-area a span{width:12px; height:12px; top:50%; right:20px; margin-top:-6px; display:block; position:absolute;}
#snav-section .snav-area a span:before{width:100%; height:2px; top:50%; margin-top:-1px; background:#000; content:""; display:block; position:absolute;}
#snav-section .snav-area a span:after{width:2px; height:100%; top:0; left:50%; margin-left:-1px; background:#000; content:""; display:block; position:absolute; transition:0.3s}

@media screen and (max-width:1200px){
	#snav-section .snav-area{padding:0;}
	#snav-section .snav-area .home-box{border-left:0;}
}

@media screen and (max-width:780px){
	#snav-section .snav-area{height:50px; line-height:50px;}
	#snav-section .snav-area .home-box{display:none;}
}

#snav-section .snav-area .depth1-box{min-width:250px; position:relative; float:left;}
#snav-section .snav-area .depth1-box a.d-curr{padding:0 60px 0 20px; font-size:16px; border-left:1px solid rgba(0,0,0,.2);display:block; color:#000;}
#snav-section .snav-area .depth2-box{min-width:280px; position:relative; float:left;}
#snav-section .snav-area .depth2-box a.d-curr{padding:0 60px 0 20px; font-weight:500; background:#04285b; font-size:16px; color:#fff;  border-left:1px solid rgba(0,0,0,.2); border-right:1px solid rgba(0,0,0,.2); display:block; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; overflow:hidden;}
#snav-section .snav-area .depth1-box a span:before{background:#000;}
#snav-section .snav-area .depth1-box a span:after{background:#000;}
#snav-section .snav-area .depth2-box a span:before{background:#fff;}
#snav-section .snav-area .depth2-box a span:after{background:#fff;}
#snav-section .snav-area a.curr span:after{transform:rotate(90deg);}

#snav-section .snav-area ul{width:100%; top:60px; left:0; padding:10px 0; z-index:1000; border:1px solid #e1dfe2; background:#f9f9f9; display:none; position:absolute;}
#snav-section .snav-area ul li{}
#snav-section .snav-area ul li a{padding:15px 20px; font-size:15px; line-height:100%; display:block;}

@media screen and (max-width:780px){
	#snav-section .snav-area .depth1-box,
	#snav-section .snav-area .depth2-box{width:50%; min-width:auto;}
	#snav-section .snav-area .depth1-box a.d-curr{border-left:0;}
	#snav-section .snav-area .d-curr{font-size:15px !important;}

	#snav-section .snav-area ul{top:50px;}
	#snav-section .snav-area .depth1-box ul{border-left:0 !important;}
	#snav-section .snav-area .depth2-box ul{border-right:0 !important;}
}

@media screen and (max-width:680px){
	#snav-section .snav-area .d-curr{padding:0 40px 0 15px !important; font-size:14px !important;}
	#snav-section .snav-area a span{width:10px; height:10px; right:15px; margin-top:-5px;}
	#snav-section .snav-area ul li a{padding:7px 15px; line-height:160%;}
}

@media screen and (max-width:500px){
	#snav-section .snav-area ul li a{font-size:14px;}
}


#wrap.sub #container-section{width:100%; max-width:1600px; margin:0 auto 100px; padding:80px 100px 0;}
#wrap.wide #container-section{width:100%; margin:0 auto; padding:0 0 0;}

@media screen and (max-width:1024px){
	#wrap.sub #container-section{padding:50px 60px 0;}
}

@media screen and (max-width:860px){
	#wrap.sub #container-section{padding:50px 40px 0;}
}

@media screen and (max-width:640px){
	#wrap.sub #container-section{margin:0 auto 50px; padding:50px 20px 0;}
}


/* fond bar */
.fond-bar{display:flex; align-items:center; position:fixed; bottom:0; width:100%; height:75px; background:url("../img/fond-bar-bg.jpg?v1") no-repeat center; background-size:cover; z-index: 1000001; display:none;}
.fond-bar .inner {max-width:1240px; margin:0 auto; display:flex; justify-content:space-between; align-items:center; gap:1em;}
.fond-bar .inner:after{clear:both; display:block; content:"";}
.fond-bar_tit {color:#fff; font-size:1.35em; display:flex; align-items: center; float:left;}
.fond-bar_tit span{line-height:1.7em;}
.fond-bar_tit a {font-size:1.7em;  line-height:1.7em; font-weight:700; margin:0 1rem; color:#fff;}
.fond-bar_tit a.mo{display:none;}
.fond-bar_item-wrapper{display:flex;  gap:0.25em; float:left;}
.fond-bar_item-wrapper:after{clear:both; display:block; content:"";}
.fond-bar_item-wrapper input[type="text"],
.fond-bar_item-wrapper input[type="tel"],
.fond-bar .select {color: #333333; font-weight:700; width:33%; max-width:150px; height:2.5em; padding: 0 0.5em; border: 1px solid #e2e2e2; border-radius:2px; box-sizing:content-box;}
.fond-bar .fond_chk {color:#ffffff; line-height:2.5em; float:left; margin:0 20px; font-size:1.1em;}
.fond-bar .fond_chk a{color:#fff; text-decoration:underline;}
.fond-bar .fond_chk #yes_bar{display: none;}
.fond-bar .fond_chk #yes_bar:checked + label::before{background-image: url('../img/fond-bar_yes.png'); margin-right:5px;}
.fond-bar .fond_chk #yes_bar + label::before {width: 1.7em; height: 1.7em; display: inline-block; vertical-align: middle; background: center center/cover no-repeat; background-image: url('../img/fond-bar_no.png'); content: '';}
.fond-bar .fond-bar_call{display: none;}
.fond-bar .fond_submit{font-size:1.2em; color:#fff; font-weight: 700; padding:0.5em 1em; border: 0px; background:#0a0a0a; float:left;}

@media screen and (max-width: 1080px){
	.fond-bar {height:auto;padding:10px 0;}
	.fond-bar .inner{width:98%; }
	.fond-bar_tit {font-size:1.1em;}
	.fond-bar_tit span{display:none;}
	.fond-bar_tit a.mo{display:block;}
	.fond-bar_tit a.pc{display:none;}
	.fond-bar_tit a {font-size:1.3em; border:1px solid #fff; padding:10px;}
	.fond-bar form{justify-content:center; gap:0.5em;}
	.fond-bar_item-wrapper input[type="text"], 
	.fond-bar_item-wrapper input[type="tel"], 
	.fond-bar select {max-width: 100%;}
	.fond-bar .fond_chk{margin:10px 0 0;}
	.fond-bar .fond_submit{margin-top:10px; float:right;}
}

@media screen and (max-width: 640px){
	.fond-bar {height:auto;padding:10px 0;}
	.fond-bar .inner{width:98%; }
	.fond-bar_tit {font-size:1em;}
	.fond-bar_tit a {font-size:1.1em; border:1px solid #fff; padding:10px;}
	.fond-bar .fond_submit{font-size:1em;}
}

@media screen and (max-width:480px){
	.fond-bar .fond_chk{font-size:0.9em;}
	.fond-bar .fond_submit{font-size:0.9em;}
}

#footer-section{width:100%; background:#111; padding:40px 0 40px;}
#footer-section .content{width:100%; max-width:1640px;margin:0 auto; padding:0 20px; position:relative;}
#footer-section .content:after{clear:both;display:block; content:"";}
#footer-section h1.copy_logo{width:100px;}
#footer-section h1.copy_logo img{width:100%;}
#footer-section .fbtn-area{}
#footer-section .fbtn-area:after{clear:both; content:""; display:block;}
#footer-section .fbtn-area .abox{}
#footer-section .fbtn-area .abox:after{clear:both; content:""; display:block;}
#footer-section .fbtn-area .abox ul{margin:30px 0;}
#footer-section .fbtn-area .abox ul:after{clear:both;display:block; content:"";}

#footer-section .fbtn-area .abox ul li{float:left; margin-right:10px;}
#footer-section .fbtn-area .abox ul li a{display:block; height:53px; width:235px; border:1px solid rgba(255,255,255,.4); position:relative; text-align:left;}
#footer-section .fbtn-area .abox ul li a span{display:inline-block; width:100%; position:relative; padding:0 25px;}
#footer-section .fbtn-area .abox ul li a span i{position:absolute; top:15px; right:20px; font-size:20px;}
#footer-section .fbtn-area .abox ul li a em{width:100%; z-index:10000; font-size:14px; line-height:53px; color:rgba(255,255,255,.4); display:block; position:absolute; font-weight:700;}
#footer-section .fbtn-area .abox ul li a:after{width:0; height:100%; max-width:100%; top:0; left:0; right:0; bottom:0; z-index:0; opacity:0; transition:all 0.33s ease-out 0s; -moz-transition:all 0.33s ease-out 0s; -webkit-transition:all 0.33s ease-out 0s; border:1px solid #fff; background-color:#fff; content:""; position:absolute; overflow:hidden;}
#footer-section .fbtn-area .abox ul li a:hover:after{width:100%; opacity:1;}
#footer-section .fbtn-area .abox ul li a:hover em{color:#111;}
#footer-section .fbtn-area p {font-size:14px; line-height:22px; color:rgba(255,255,255,.4);; font-weight:800;}

#footer-section .right-area{position:absolute; right:0; bottom:0;}
#footer-section .right-area:after{clear:both; display:block; content:"";}
#footer-section .right-area .family-site{float:left;}
#footer-section .right-area .family-site p{padding:15px 120px 15px 15px; border:1px solid rgba(255,255,255,.4); cursor:pointer; background:url(../img/family_arrow.png) no-repeat right 15px center; color:rgba(255,255,255,.4);}
#footer-section .right-area .family-site ul{background:#fff; position:absolute; bottom:53px; width:100%; padding:10px 0; display:none; border: 1px solid #ddd;}
#footer-section .right-area .family-site ul li a{display:block; padding:7px 20px; color:#999; font-weight:300;}
#footer-section .right-area .family-site ul li a:hover{color:#333;}
#footer-section .right-area .top{float:left; margin-left:20px;}
#footer-section .right-area .top a{display:inline-block; text-align:center; width:50px; line-height:50px; background:#fff; color:#04285b; font-size:30px; border-radius:50px;}
#footer-section .right-area .top a i{vertical-align:middle;}


@media screen and (max-width:980px){
	#footer-section h1.copy_logo{width:90px;}
	#footer-section .fbtn-area .abox ul li a{height:48px; width:200px;}
	#footer-section .fbtn-area .abox ul li a em{line-height:48px;}
	#footer-section .fbtn-area .abox ul li a span i{top:15px; right:15px; font-size:18px;}

	#footer-section .right-area .family-site p{padding:13px 100px 13px 20px;}
	#footer-section .right-area .family-site,
	#footer-section .right-area .family-site ul li a{font-size:14px;}
	#footer-section .right-area .top a{width:45px; line-height:45px; font-size:24px;}
}

@media screen and (max-width:740px){
	#footer-section{padding:30px 0;}
	#footer-section h1.copy_logo{width:80px;}
	#footer-section .fbtn-area .abox ul{margin:20px 0 15px;}
	#footer-section .fbtn-area p {font-size:13px; font-weight:700;}
	#footer-section .right-area{position:relative; margin-top:40px;}
}

@media screen and (max-width:480px){
	#footer-section h1.copy_logo{text-align:center; margin:0 auto;}
	#footer-section .fbtn-area .abox ul li{float:left; width:50%; margin-right:0; padding:0 5px;}
	#footer-section .fbtn-area .abox ul li a{width:100%; height:42px;}
	#footer-section .fbtn-area .abox ul li a em{line-height:42px;}
	#footer-section .fbtn-area .abox ul li a span{padding:0 10px; font-size:13px;}
	#footer-section .fbtn-area .abox ul li a span i{top:12px; right:10px; font-size:16px;}
	#footer-section .fbtn-area p {text-align:center; font-size:12px; font-weight:600;}

	#footer-section .right-area{float:right; margin-top:30px;}
	#footer-section .right-area .family-site p{padding:13px 130px 13px 20px;}
	#footer-section .right-area .family-site,
	#footer-section .right-area .family-site ul li a{font-size:14px;}
	#footer-section .right-area .top a{width:40px; line-height:40px; font-size:22px;}
}

.policy-section{padding:50px 30px; font-size:14px;line-height:140%;background:#f8f8f8;box-sizing:border-box; text-align:left;}
.policy-section h1{font-size:30px; font-weight:700;}
.policy-section div{border:1px solid #dedede; max-height:500px; margin-top:30px; overflow-y:scroll; background:#fff; padding:20px 30px;}

/*공통*/
.cont-area{width:100%; max-width:1600px; margin:0 auto; padding:0 100px;}
.tit-area h1{font-family:'Montserrat',"NanumSquareNeo",'Noto Sans KR', sans-serif !important;; font-size:60px; font-weight:800; line-height:1.3em;}
.tit-area p{font-weight:400; font-size:22px; line-height:1.4em; margin-top:20px;}
.wide-top{padding-top:80px;}

@media (max-width:1480px){
	.tit-area h1{font-size:54px;}
}

@media (max-width:1240px){
	.tit-area h1{font-size:50px;}
	.tit-area p{font-size:20px;}
}

@media (max-width:1024px){
	.cont-area{padding:0 60px;}
}

@media (max-width:840px){
	.cont-area{padding:0 40px;}
	.tit-area p{font-size:18px;}
}

@media (max-width:760px){
	.tit-area h1{font-size:44px; line-height:1.4em;}
}

@media (max-width:640px){
	.cont-area{padding:0 20px;}
	.tit-area h1{font-size:32px;}
	.tit-area br{display:none;}
	.tit-area p{font-size:16px;}
}

@media (max-width:480px){
	.tit-area h1{font-size:30px; line-height:1.3em;}
}


.title-box{margin-bottom:50px;}
.title-box h2{font-size:50px; font-weight:800; line-height:180%; text-align:center; color:#252525;}
.title-box h3{padding:0 10px; font-weight:400; font-size:18px; line-height:140%; text-align:center; color:#525252;}


@media screen and (max-width:820px){
	.title-box{margin-bottom:40px;}
	.title-box h2{font-size:32px;}
	.title-box h3{font-size:17px;}
}

@media screen and (max-width:640px){
	.title-box{margin-bottom:30px;}
	.title-box h2{font-size:28px;}
	.title-box h3{font-size:16px;}
}

@media screen and (max-width:480px){
	.title-box{margin-bottom:20px;}
	.title-box h2{font-size:22px;}
	.title-box h3{font-size:14px;}
}

.page-tit{font-size:50px; font-weight:800; position:relative; padding-bottom:15px; margin-bottom:50px;}
.page-tit:after{width:40px; height:3px; bottom:0; left:0px; background:#04285b; content:""; display:block; position:absolute;}


/*서브탭*/
.sub-tab{margin-bottom:50px;}
.sub-tab table{width:100%;}
.sub-tab table tr td{border:1px solid #dedede; text-align:center; font-size:22px; font-weight:700;}
.sub-tab table tr td a{display:inline-block; width:100%; line-height:62px; color:#525252;}
.sub-tab table tr td:hover,
.sub-tab table tr td.curr{border:2px solid #04285B;}
.sub-tab table tr td:hover a,
.sub-tab table tr td.curr a{color:#04285B; font-weight:700;}
.sub-tab table.tb02 tr td{width:50%;}
.sub-tab table.tb02 tr td{width:50%;}
.sub-tab table.tb03 tr td{width:33.3333%;}
.sub-tab table.tb04 tr td{width:25%;}
.sub-tab table.tb05 tr td{width:20%;}

@media screen and (max-width:820px){
	.sub-tab{margin-bottom:40px;}
	.sub-tab table tr td{font-size:20px;}
	.sub-tab table tr td a{line-height:54px;}
}

@media screen and (max-width:640px){
	.sub-tab{margin-bottom:30px;}
	.sub-tab table tr td{font-size:18px;}
	.sub-tab table tr td a{line-height:48px;}
}

@media screen and (max-width:480px){
	.sub-tab{margin-bottom:20px;}
	.sub-tab table tr td{font-size:16px;}
	.sub-tab table tr td a{line-height:40px;}
}
