@charset "utf-8";

/* common */
#wrap{overflow:hidden}
.montserrat{font-family: 'Montserrat';}
.inner{width:100%; max-width:1200px; margin:0 auto; position:relative;}

@media all and (max-width:1200px){
	.inner{width:93.75%}
}


/* header */
#wrap.main #header{position:fixed; background:rgba(0,0,0,0.5); height:110px; border-bottom:0;}
#header{position:relative; background:#fff; left:0; top:0; width:100%; height:110px; z-index:100; padding:0 100px; box-sizing:border-box; transition:all 0.4s; -ms-transition:all 0.4s; -webkit-transition:all 0.4s; -o-transition:all 0.4s; -moz-transition:all 0.4s; }
#header .header_inner{box-sizing:border-box; width:100%; height:100%; position:relative;}
#header .top_box{padding-top:15px; text-align:right;}
#header .top_box a{display:inline-block; font-size:16px; font-weight:bold; letter-spacing:-0.045em; color:#0fbede; margin-right:55px; padding-bottom:5px; }
#header .top_box a i{display:inline-block; vertical-align:middle; width:17px; height:14px; background:url("http://dgraib.com/img/depth01_icon01.png") no-repeat center; margin-right:8px; margin-top:-3px;}
#header .top_box a b {display:inline-block; vertical-align:middle; border-bottom:1px solid #0fbede; }
#header .top_box a span{display:inline-block; vertical-align:middle; width:5px; height:8px; background:url("http://dgraib.com/img/depth01_icon01_01.png") no-repeat center; margin-left:10px; margin-top:-3px;}
/*#header a.logo{position:absolute; left:0; top:50%; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); -o-transform:translateY(-50%); -moz-transform:translateY(-50%);}*/
/*#header .right{position:absolute; z-index:2; right:0; top:50%; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); -o-transform:translateY(-50%); -moz-transform:translateY(-50%);}*/
#header a.logo{position:absolute; left:0; top:45px; background:url('http://www.hiwiz.co.kr/data/img/HiwizTech_black200.png') no-repeat center; width:200px; height:38px;}
#header .right{position:absolute; z-index:2; right:0; top:55px; }
#header .right .gnb > ul{font-size:0; letter-spacing:-4px;}
#header .right .gnb > ul > li{display:inline-block; vertical-align:top; position:relative; margin:0;}
#header .right .gnb > ul > li:nth-of-type(2) {width:184px; }
#header .right .gnb > ul > li > a{display:block; font-size:18px; color:#000000; letter-spacing:-0.05em; font-weight:300; padding:0px 70px 0px 20px; box-sizing:border-box;}
#header .right .gnb > ul > li.icon > a{background:#000; border-radius:30px; padding:6px 30px; color:#fff;}
#header .right .gnb > ul > li.icon > a i{display:inline-block; vertical-align:middle; position:relative; top:-2px; margin-right:4px;}
#header .right .gnb > ul > li.icon ul.depth02{padding:0 30px; background:#f2f8fe}
#header .right .gnb > ul > li.icon ul.depth02 li a{color:#09526d}
#header .right .gnb > ul > li ul.depth02{position:absolute; left:0; top:55px; width:100%; padding:0 20px; height:0; overflow:hidden; box-sizing:border-box; transition:all 0.3s; -ms-transition:all 0.3s; -webkit-transition:all 0.3s; -o-transition:all 0.3s; -moz-transition:all 0.3s;}
#header .right .gnb > ul > li ul.depth02 li{position:relative; z-index:3;}
#header .right .gnb > ul > li ul.depth02 li a{display:block; padding:10px 0; text-align:left; font-size:16px; color:#222222; letter-spacing:-0.045em; font-weight:300;}
#header .right .gnb > ul > li ul.depth02 li a.icon{font-weight:500;}
#header .right .gnb > ul > li ul.depth02 li a.icon i{display:inline-block; vertical-align:middle; position:relative; top:-2px; margin-left:4px;}
#header .right .gnb > ul > li:hover > a{font-weight:500; color:#0fbede !important; }
#header .right .gnb > ul > li ul.depth02 li a:hover{color:#0fbede;}
.pc_bg{width:100%; height:0; background:#fff; position:absolute; overflow:hidden; left:0; top:110px; transition:all 0.3s; -ms-transition:all 0.3s; -webkit-transition:all 0.3s; -o-transition:all 0.3s; -moz-transition:all 0.3s;}
#wrap.main .pc_bg{top:110px;}
#wrap.main #header.on{background:#fff;}
#wrap.main #header a.logo{background:url('http://www.hiwiz.co.kr/data/img/HiwizTech_white200.png') no-repeat center; }
#wrap.main #header.on a.logo{background:url('http://www.hiwiz.co.kr/data/img/HiwizTech_black200.png') no-repeat center; }
#wrap.main #header .right .gnb > ul > li > a{color:#fff;}
#wrap.main #header .right .gnb > ul > li ul.depth02{top:55px} 
#wrap.main #header.on .right .gnb > ul > li > a{color:#000;}
#header.on a.logo{background:url('http://www.hiwiz.co.kr/data/img/HiwizTech_black200.png') no-repeat center;}
#header.on .header_inner{border-bottom:1px solid #eaeaea}
#header.on .right .gnb > ul > li ul.depth02{height:220px;}
#header.on .right .gnb > ul > li.icon > a{background:#09526d;}
.pc_bg.on{height:220px; }

#header .m_menu{display:none; position:absolute; right:20px; top:30px;}
#header .m_menu a{font-size:16px; font-weight:500; letter-spacing:-0.045em; color:#fff; font-family: 'Montserrat';}
#header .m_menu a i{display:inline-block; vertical-align:middle; margin-top:-3px; margin-left:15px;}

/* #header 스크롤 시 변경 */
#wrap.main #header.nver{position:fixed; background:rgba(0,0,0,0.5)}
#header.nver a.logo{background:url('http://www.hiwiz.co.kr/data/img/HiwizTech_white200.png') no-repeat center;}
#header.nver{position:fixed; background:rgba(0,0,0,0.5)}
#header.nver .right .gnb > ul > li > a{color:#fff;}
#wrap.main #header.nver.on{position:fixed; background:#fff;}
#header.nver.on a.logo{background:url('http://www.hiwiz.co.kr/data/img/HiwizTech_black200.png') no-repeat center;}
#header.nver.on{position:fixed; background:#fff}
#header.nver.on .right .gnb > ul > li > a{color:#0b3e4f;}
#header.nver.on .top_box a{color:#0fbede;}
#header.nver.on .top_box a i{background:url('http://dgraib.com/img/depth01_icon01.png') no-repeat center }
#header.nver.on .top_box a span{background:url('http://dgraib.com/img/depth01_icon01_01.png') no-repeat center }


@media all and (max-width:1400px){
	#header{padding:0 20px;}
	#header .right .gnb > ul > li:nth-of-type(2) {width:164px; }
	#header .right .gnb > ul > li > a{padding:6px 50px 6px 20px;}
	#header .top_box a{margin-right:35px;}
}
@media all and (max-width:1200px){
	#header .right .gnb > ul > li:nth-of-type(2) {width:123px; }
	#header .right .gnb > ul > li > a{padding:6px 30px 6px 10px; font-size:16px;}
	#header .right .gnb > ul > li ul.depth02{padding:0 10px;}
	#header .right .gnb > ul > li ul.depth02 li a{font-size:14px;}
	#header .top_box a{margin-right:15px;}
}
@media all and (max-width:1000px){
	#wrap.main #header{height:100px;}
	#header{height:100px;}
	#header .top_box{display:none;}
	#header a.logo{top:30px;}
	#header .right .gnb{display:none}
	#header .m_menu{display:block;}
}


/* footer */
#footer{background:#444; padding:60px 100px 90px; transition:all 0.4s; -ms-transition:all 0.4s; -webkit-transition:all 0.4s; -o-transition:all 0.4s; -moz-transition:all 0.4s; position:relative;}
#footer:after{clear:both; content:""; display:block; height:0; visibility:hidden}
#footer a.logo{float:left; }
#footer .right{float:right}
#footer .right a.policy{display:block; width:164px; height:45px; line-height:45px; background:#363d46; text-align:center; font-size:16px; font-weight:300; color:#7e8389; letter-spacing:-0.045em; margin-left:auto; margin-bottom:20px;}
#footer .right ul li{display:inline-block; vertical-align:top; font-size:16px; color:#bbbbbb; letter-spacing:-0.045em; font-weight:300; padding:0 10px;}
#footer .right ul li strong{display:inline-block; font-weight:300; font-size:12px; padding-left:5px; position:relative;}
/*#footer .right ul li strong:before{content:''; position:absolute; left:8px; top:2px; width:1px; height:16px; background:#ccc; }*/
#footer .right ul li a{display:block; font-size:16px; color:#bbbbbb; letter-spacing:-0.045em; font-weight:300;}
#footer .right ul li:last-child{padding-right:0;}
#footer .right p{text-transform:uppercase; text-align:right; font-size:14px; color:#afafaf; letter-spacing:0em; font-weight:500; margin-top:10px;}

@media all and (max-width:1400px){
	#footer{padding:60px 20px 90px;}
}
@media all and (max-width:1000px){
	#footer{text-align:center;}
	#footer a.logo{float:none; display:inline-block; vertical-align:top;}
	#footer .right{float:none; margin-top:30px;}
	#footer .right p{text-align:center;}
}


/* sub_tab */
.sub_common{width:100%; height:300px; display:table; background-color:#aaa; background-size:cover; background-position:center center; background-repeat:no-repeat;}
.sub_common h4{text-align:center; display:table-cell; vertical-align:middle; font-size:42px; color:#222222; letter-spacing:-0.045em; font-weight:bold;}
.sub_tab{margin-top:-33px; position:relative; z-index:2;}
.sub_tab .inner:after{clear:both; content:""; display:block; height:0; visibility:hidden}
.sub_tab .m_depth:after{clear:both; content:""; display:block; height:0; visibility:hidden}
.sub_tab .m_depth{width:66.666666%; float:left;}
.sub_tab .home_btn{float:left; width:33.333333%; height:66px; background:#0fbede;}
.sub_tab .home_btn a{display:block; width:100%; height:100%; text-align:center; line-height:66px; font-size:16px; color:#fff;}
.sub_tab .home_btn a img{position:relative; top:-2px; display:inline-block; vertical-align:middle; margin-right:10px;}
.sub_tab .m_depth > div{float:left; width:50%; height:66px; line-height:66px; border-right:1px solid #eee; border-bottom:1px solid #e4e4e4; box-sizing:border-box; position:relative; cursor:pointer;}
.sub_tab .m_depth01{background:#fff;}
.sub_tab .m_depth01 > ul{display:none;position:absolute; top:65px; width:100%; background:#fff; border:1px solid #eee; box-sizing:border-box; z-index:100; padding:15px 0;}
.sub_tab .m_depth01 > ul li a{font-size:16px; line-height:1.3; padding:10px 30px; color:#888; display:block; box-sizing:border-box; }
.sub_tab .m_depth01 > ul li:last-of-type a{border-bottom:0;}
.sub_tab .m_depth01 > div p{overflow:hidden; padding:0 30px; position:relative; box-sizing:border-box; }
.sub_tab .m_depth01 > div p span{float:left; font-size:16px; width:calc(100% - 27px); display:block; letter-spacing:-0.045em; color:#222222; font-weight:400;}
.sub_tab .m_depth01 > div p > img{position:absolute; right:30px; top:calc(50% - 10px)}
.sub_tab .m_depth02{background:#fff}
.sub_tab .m_depth02 > ul{display:none;position:absolute; top:65px; width:100%; background:#fff; border:1px solid #eee; box-sizing:border-box; z-index:100; padding:15px 0;}
.sub_tab .m_depth02 > ul li a{font-size:16px; line-height:1.3; padding:10px 30px; color:#888; display:block; box-sizing:border-box; }
.sub_tab .m_depth02 > ul li:last-of-type a{border-bottom:0;}
.sub_tab .m_depth02 > div p{overflow:hidden; padding:0 30px; position:relative; box-sizing:border-box; }
.sub_tab .m_depth02 > div p span{float:left; font-size:16px; width:calc(100% - 27px); display:block; letter-spacing:-0.045em; color:#222222; font-weight:400;}
.sub_tab .m_depth02 > div p > img{position:absolute; right:30px; top:calc(50% - 10px)}

.quick{position:fixed; right:0; top:78%; z-index:999; text-align:right;}
.quick a{display:block; }
.quick a.top_btn img{width:70px;}
.quick a.consult_btn img{width:150px;}

/* -- m_menu -- */
.right_menu_bg{display:none; width:100%; height:100%; position:fixed; left:0; top:0; z-index:999; display:none; background:rgba(0,0,0,0.8);}
.right_menu_bg.on{display:block;}
.right_menu{position:fixed; right:-100%; top:0; min-width:520px; width:70%; z-index:9999; height:100%; background:#fff; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; -ms-transition:all 0.3s; -o-transition:all 0.3s; transition:all 0.3s; overflow-y:auto;}
.right_menu.on {right:0; }
.right_menu .top_box{position:relative; height:100px; border-bottom:1px solid #cbcbcb;}
.right_menu .top_box:after{clear:both; content:""; display:block; height:0; visibility:hidden}
.right_menu .top_box a.logo{position:absolute; left:20px; top:35px;}
.right_menu .top_box .x_btn{position:absolute; right:20px; top:35px; font-size:16px; font-weight:500; letter-spacing:-0.045em; color:#444444; font-family: 'Montserrat';}
.right_menu .top_box .x_btn i{display:inline-block; vertical-align:middle; margin-top:-3px; margin-left:20px; }

.right_menu .gnb{}
.right_menu .gnb > ul{}
.right_menu .gnb > ul > li{}
.right_menu .gnb > ul > li > a{display:block; padding:30px 20px; font-size:24px; font-weight:500; letter-spacing:-0.045em; color:#444444; position:relative; border-bottom:1px solid #eaeaea}
.right_menu .gnb > ul > li > a:before{content:''; position:absolute; right:20px; top:45px; width:21px; height:12px; background:url('http://dgraib.com/img/m_menu_icon.png') no-repeat center;}
.right_menu .gnb .depth02{background:#f5f5f5; border-bottom:1px solid #eaeaea; padding:30px 20px; box-sizing:border-box;}
.right_menu .gnb .depth02 li{margin-bottom:30px;}
.right_menu .gnb .depth02 li:last-of-type{margin-bottom:0;}
.right_menu .gnb .depth02 li a{display:block; font-size:20px; letter-spacing:-0.045em; color:#222222; position:relative; padding-left:15px;}
.right_menu .gnb .depth02 li a:before{content:'_'; position:absolute; left:0; bottom:0; }
.right_menu .gnb .depth02 li:hover a{color:#0fbede}
.right_menu .gnb > ul > li.on > a{padding:30px 24px;}
.right_menu .gnb > ul > li.on > a:after{content:''; position:absolute; left:0; top:0; width:4px; height:100%; background:#0fbede}
.right_menu .gnb > ul > li.on > a:before{background:url('http://dgraib.com/img/m_menu_icon_on.png') no-repeat center;}

.right_menu .bot_box{position:relative; padding-top:40px;}
.right_menu .bot_box a{display:block; padding:25px 20px; background:#505050; font-size:24px; font-weight:500; letter-spacing:-0.045em; color:#fff; }
.right_menu .bot_box a i{display:inline-block; vertical-align:middle; margin-top:-3px; margin-right:10px;}
.right_menu .bot_box a span{position:absolute; right:20px; top:75px;}