@charset "utf-8";

/*common*/

html.of_hide{height:100%;}
html.of_hide body{overflow:hidden;position:absolute;width:100%; /* margin-right: 17px; */}
html.of_hide #wrap{overflow:hidden;}
html.of_hide2 body{overflow:hidden;}
/*html.of_hide #wrap{height:100%;overflow:hidden;}*/


html, body{height:100%;}

html.naviOn #m_navi > span{background-color:transparent;}
html.naviOn #m_navi > span:before, html.naviOn #m_navi > span:after{border-radius:2px;}
html.naviOn #m_navi > span:before{top:0;bottom:0;
    -ms-transform: rotate(45deg); /* IE 9 */    -webkit-transform: rotate(45deg); /* Safari */    transform: rotate(45deg);
}
html.naviOn #m_navi > span:after{top:0;bottom:0;
    -ms-transform: rotate(135deg); /* IE 9 */    -webkit-transform: rotate(135deg); /* Safari */    transform: rotate(135deg);
}
#subFrame{position: absolute;bottom:0;height:0;}
#container{}

.hide{opacity:0;}
.hide2{opacity:0;visibility: hidden;}
#wrap{position: relative;min-height:100%;}
.ov_h{overflow:hidden;}
input.ipt { box-sizing: border-box; font-size: 0.875em; height: 2.5833em;border: 1px solid #CFCFCF; background: #fff; border-radius: 3px; padding: 0px 0.5em; -webkit-appearance: none; box-shadow: none; }
.media_mobile, .mobile540{display: none;}
input.ipt.w100pc{width:100%;}
input.ipt.w400{width:400px;}
input.ipt.w440{width:440px;}
input.ipt.w160{width:160px;}

textarea.txa{box-sizing: border-box; font-size: 0.875em ; border: 1px solid #CFCFCF; background: #fff; line-height: 1.5em; border-radius: 3px; padding: 0.5em;box-shadow:none;min-height:7.1em;-webkit-appearance:none;}
textarea.txa.w100pc{width:100%;}

/* 레이어 팝업 창 */
#pop_common{
    position: absolute;width: 100%; height: 100%;  left: 0; top: 0; z-index: 30;background-color: rgba(0, 0, 0, 0.7); display:none;visibility:hidden;opacity:0;
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#cc000000, endColorstr=#cc000000);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#cc000000, endColorstr=#cc000000)";
	-webkit-transition:visibility .3s ease-in-out, opacity .3s ease-in-out;
    -moz-transition:visibility .3s ease-in-out, opacity .3s ease-in-out;
    -o-transition:visibility .3s ease-in-out, opacity .3s ease-in-out;
    transition:visibility .3s ease-in-out, opacity .3s ease-in-out;
}
#pop_common:nth-child(n){filter:none}
#pop_common.on{visibility:visible;opacity:1;}

#pop_bg_common{
    position: fixed;width: 100%; height: 100%;  left: 0; top: 0; z-index: 30;background-color: rgba(0, 0, 0, 0.5); display:none;visibility:hidden;opacity:0;
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#cc000000, endColorstr=#cc000000);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#cc000000, endColorstr=#cc000000)";
	-webkit-transition:visibility .3s ease-in-out, opacity .3s ease-in-out;
    -moz-transition:visibility .3s ease-in-out, opacity .3s ease-in-out;
    -o-transition:visibility .3s ease-in-out, opacity .3s ease-in-out;
    transition:visibility .3s ease-in-out, opacity .3s ease-in-out;
}
#pop_bg_common:nth-child(n){filter:none}
#pop_bg_common.on{visibility:visible;opacity:1;}

#pop_bg_common.t2{z-index: 32;}




.area_con{overflow: hidden;}
.owen_sect > .cont{max-width:1500px;margin-left:auto; margin-right:auto;position: relative;}
.owen_sect > .cont.w800{max-width:800px;}
.owen_sect .bg.bg_full{position: absolute;top:0;bottom:0;left:0;right:0;}

/*icutter*/
img.h100p{height:100% !important; width:auto !important;position: relative;}
img.w100p{width:100% !important; height:auto !important;position: relative;}


/*header*/

#header{box-shadow:0px 1px 5px rgba(0,0,0,0.5);z-index:10;position: fixed;width:100%;left:0;top:0;height:3.5em;
    -webkit-transition: .5s ease-in-out;  -moz-transition: .5s ease-in-out;  -o-transition: .5s ease-in-out;  transition: .5s ease-in-out;
    -webkit-transition-property: height;
    -moz-transition-property: height;
    transition-property: height;
}
#header h1{position: absolute;height:100%;font-size: 1em;margin:0 1.5em;}
#header h1 > a{vertical-align: middle;display: inline-block;height:2.2em;}
#header h1 img{max-height:100%;}
#header > .inner{height:100%;position: relative;
    background-color:rgb(0,0,0);
    background-color:rgba(0,0,0,0.7);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#b2000000,endColorstr=#b2000000);
    zoom: 1;
    -webkit-transition: .5s ease-in-out;
    -moz-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
    -webkit-transition-property: height, background-color;
    -moz-transition-property: height, background-color;
    transition-property: height, background-color;
}
#header > .inner:nth-child(n) { filter: none; }
#header > .inner > *{height:3.5em;}
#header .area_lnb{}
#header .area_lnb:after{content:'';clear:both;display: block;}
#header .m_area{display: none;position: absolute;top:0;width:4em;}

#m_navi{position: absolute;right:0; top:0;bottom:0;left:0;margin:auto;width:2.5em;height:2.5em;font-size:1em;}
#m_navi > span{position: relative;display: block;width:100%;height:3px;background-color: #898989; border-radius:3px;margin:0 auto;
	-webkit-transition: .3s ease-in-out;  -moz-transition: .3s ease-in-out;  transition: .3s ease-in-out;
	-webkit-transition-property: background-color;
	-moz-transition-property: background-color;
	transition-property: background-color;
}
#m_navi > span:before, #m_navi > span:after{
    position: absolute;display: block;width:100%;height:3px;background-color: #898989; border-radius:3px;content:"";
    -webkit-transition: .3s ease-in-out;  -moz-transition: .3s ease-in-out;  -o-transition: .3s ease-in-out;  transition: .3s ease-in-out;
    -webkit-transition-property: top, bottom, -webkit-transform;
    -moz-transition-property: top, bottom, -moz-transform;
    transition-property: top, bottom, transform;
}
#m_navi > span:before{top:-10px;left:0;}
#m_navi > span:after{bottom:-10px;left:0;}

/*lnb*/
#lnb{height:100%;}
.top_menu > ul > li{display: inline-block;height:100%;vertical-align: middle;}
.top_menu > ul > li:first-child{}
.top_menu > ul > li > a{display:block;padding:1.125em 1.25em;font-size:1em;color:#fff;font-weight: 300;position: relative;
-webkit-transition: .15s linear;  -moz-transition: .15s linear; transition: .15s linear;
-webkit-transition-property: color, background-color; -moz-transition-property: color, background-color; transition-property: color, background-color;}
.top_menu > ul > li > a:after{position: absolute;content: '';bottom:0;left:0;right:0;background-color: #A40000;height:0;
	-webkit-transition:height .2s ease; -moz-transition:height .2s ease; -ms-transition:height .2s ease; -o-transition:height .2s ease; transition:height .2s ease;
}
.top_menu > ul > li:hover > a{color:#A40000;}
.top_menu > ul > li.on > a{ color:#A40000;}
.top_menu > ul > li:hover > a:after{height:3px;}

#lnb > ul{height:100%;text-align: center;}
#lnb .depth2{visibility: hidden;}

/*gnb*/
.area_gnb{height:100%;position: absolute;right:0;top:0;}
.area_gnb:after{content:'';clear:both;display: block;}
.area_gnb p{float:left;font-size:1.125em;font-weight: 400;color:#666;margin-right:1em;padding:1em 0;}
.area_gnb #gnb{float:left;height:100%;}
#gnb ul{height:100%;}
#gnb ul:after{content:'';clear:both;display: block;}

.img_para.ani > *{
    -webkit-transition:opacity .3s linear, -webkit-transform 0.3s ease;
    -moz-transition:opacity .3s linear, -moz-transform 0.3s ease;
	-ms-transform:opacity .3s linear, -ms-transform 0.3s ease;
    -o-transition:opacity .3s linear, -o-transform 0.3s ease;
    transition:opacity .3s linear, transform 0.3s ease;
}

#aside_nav{}
#aside_nav > nav{position: fixed;height:192px;right: 2%;top: 0;bottom: 0;margin: auto;z-index: 5;}
#aside_nav > nav > ul{height: 100%;text-align: right;}
#aside_nav > nav > ul > li{height:16.666%;}
#aside_nav > nav > ul > li.blank{display: none;}
#aside_nav > nav > ul > li > a{text-align: right;display: inline-block;font-size: 0.875em;position: relative;height:100%;color:rgba(50,50,50,.7);}
#aside_nav .tit{vertical-align: middle;white-space: nowrap;padding-right:15px; position: absolute;right: 13px;top: 0;bottom: 0;height:1em;line-height: 1em;margin: auto;
	-webkit-transition: color .3s linear;
	-o-transition: color .3s linear;
	transition: color .3s linear;
}
#aside_nav .ico{display: inline-block;vertical-align: middle;width: 14px;height: 14px;position: relative;}
#aside_nav .ico > span{width: 0;height: 0;border:4px solid #464646;margin: auto;position: absolute;border-radius:50%;top: 0;bottom: 0;left: 0;right: 0;
	-webkit-transition:  width .2s linear, height .2s linear, border-width .2s linear, color .3s linear;
	-o-transition:  width .2s linear, height .2s linear, border-width .2s linear, color .3s linear;
	transition:  width .2s linear, height .2s linear, border-width .2s linear, color .3s linear;
}
#aside_nav > nav > ul > li.on .ico > span{width: 10px;height: 10px;border-width:2px;}
html.bd_bg0 #aside_nav > nav > ul > li > a,
html.bd_bg2 #aside_nav > nav > ul > li > a,
html.bd_bg3 #aside_nav > nav > ul > li > a,
html.bd_bg4 #aside_nav > nav > ul > li > a,
html.bd_bg7 #aside_nav > nav > ul > li > a{color:#aaa;}
html.bd_bg0 #aside_nav > nav .ico > span,
html.bd_bg2 #aside_nav > nav .ico > span,
html.bd_bg3 #aside_nav > nav .ico > span,
html.bd_bg4 #aside_nav > nav .ico > span,
html.bd_bg7 #aside_nav > nav .ico > span{border-color:#ccc;}

/*메뉴얼 페이지*/
#area_main #sect1{}
#area_main .owen_sect{position: relative;overflow: hidden;}
#area_main .owen_sect .bg.bg_full{position: absolute;top:0;bottom:0;left:0;right:0;overflow: hidden;}
#area_main .owen_sect .cont{position: relative;}
#area_main #sect1:nth-child(n){ filter:none;}
#area_main #sect1 .bg .bg_cover{position: absolute;top:0;bottom:0;left:0;right:0;z-index: 1 ; background:rgb(0,0,0); background: transparent\9; background:rgba(0,0,0,0.4);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#59000000,endColorstr=#59000000);zoom: 1;}
#area_main #sect1 .bg .bg_cover :nth-child(n) { filter: none; }
#area_main #sect1 .out_bx{position: relative;margin: auto; margin-top:10%;height:250px;width:250px;-webkit-border-radius: 50%;z-index:}

#area_main #sect1 .img_list{height:100%;}
#area_main #sect1 .img_list > ul{position: relative;height:100%;}
#area_main #sect1 .img_list > ul > li{position: absolute;top:0;bottom:0;left:0;right:0;height:100%;overflow: hidden;display: block;visibility: hidden;}
#area_main #sect1 .img_list > ul > li.show{z-index: 1}
#area_main #sect1 .img_list > ul > li img{width:100%;}

#area_main #sect1 .cont{z-index: 2; text-align: center;}
#area_main #sect1 .cont h2{font-weight: 300;margin:1.5em 0 1em;color: #fff;font-size: 1.5em;}
#area_main #sect1 .cont h2 strong{font-weight: 300;}
#area_main #sect1 .cont .btns{margin-bottom:1.5em;}
#area_main #sect1 .cont .btns button{margin:0.25em 0.25em;}

/*bx hide*/
#area_main #sect1 #bx_circle{position: absolute;width:80%;height:80%;top:0;bottom:0;left:0;right:0;margin:auto;}
#area_main #sect1 #bx_circle > canvas{width:100%;height:100%;}
#area_main #sect1 #bx_circle .bx_t .simbol{position: absolute;top: 10px;bottom:0px; left:0;right:0;height:0%; width:0%; margin:auto;border-top:5px solid #fff;height:30%;width:30%;
	-webkit-transition:.6s ease-out; -moz-transition:.6s ease-out; -ms-transition:.6s ease-out; -o-transition:.6s ease-out; transition:.6s ease-out;
	-webkit-transition-property:width, height; -moz-transition-property:width, height; -o-transition-property:width, height; transition-property:width, height;
}
#area_main #sect1 #bx_circle .bx_t{display: block;position: absolute;top:0;bottom:0;right: 0;left: 0;}
#area_main #sect1 #bx_circle .bx_t > img.logo_t{position: absolute;width:30%;top:9%;bottom:0;left: 0;right: 0;margin:auto;}
#area_main #sect1 #bx_circle .bx_t .simbol >span{display: block;width:5px;margin:auto;height:100%;background-color: #fff;
-webkit-transition:background-color .3s ease-out; -moz-transition:background-color .3s ease-out; -ms-transition:background-color .3s ease-out; -o-transition:background-color .3s ease-out; transition:background-color .3s ease-out;
}

#area_main #sect1 #bx_circle .bx_t .simbol.show{height:30%;width:30%;
	-webkit-transition:width .5s cubic-bezier(.45,.32,.55,1.53), height .4s cubic-bezier(.45,.32,.55,1.53) 0.1s, border-color .3s linear;
	-moz-transition:width .5s cubic-bezier(.45,.32,.55,1.53), height .4s cubic-bezier(.45,.32,.55,1.53) 0.1s, border-color .3s linear;
	-ms-transition:width .5s cubic-bezier(.45,.32,.55,1.53), height .4s cubic-bezier(.45,.32,.55,1.53) 0.1s, border-color .3s linear;
	-o-transition:width .5s cubic-bezier(.45,.32,.55,1.53), height .4s cubic-bezier(.45,.32,.55,1.53) 0.1s, border-color .3s linear;
	transition:width .5s cubic-bezier(.45,.32,.55,1.53), height .4s cubic-bezier(.45,.32,.55,1.53) 0.1s, border-color .3s linear;
}


#area_main #sect1 #bx_logo{position: absolute;top:0;bottom:0;left: 0;right: 0;margin: auto;width:200px;height:200px;z-index: 1;
	-webkit-transition:width .5s cubic-bezier(.45,.32,.55,1.53), height .5s cubic-bezier(.45,.32,.55,1.53);
	-moz-transition:width .5s cubic-bezier(.45,.32,.55,1.53), height .5s cubic-bezier(.45,.32,.55,1.53);
	-ms-transition:width .5s cubic-bezier(.45,.32,.55,1.53), height .5s cubic-bezier(.45,.32,.55,1.53);
	-o-transition:width .5s cubic-bezier(.45,.32,.55,1.53), height .5s cubic-bezier(.45,.32,.55,1.53);
	transition:width .5s cubic-bezier(.45,.32,.55,1.53), height .5s cubic-bezier(.45,.32,.55,1.53);
}

#area_main #sect1 .bx_key_feature{}
#area_main #sect1 .bx_key_feature > ul{text-align: center;}
#area_main #sect1 .bx_key_feature > ul > li{display: inline-block;margin:0 0.5em;vertical-align: top;}
#area_main #sect1 .bx_key_feature > ul > li > a{width:160px;height:120px;display: block;color: #666;background-color: #fff;padding:1em;border:1px solid #fff;
	-webkit-transition: background-color .4s linear, color .4s linear, border-color .4s linear;
    -moz-transition: background-color .4s linear, color .4s linear, border-color .4s linear;
    -o-transition: background-color .4s linear, color .4s linear, border-color .4s linear;
    transition: background-color .4s linear, color .4s linear, border-color .4s linear;
}
#area_main #sect1 .bx_key_feature > ul > li > a > *{display: inline-block;vertical-align: middle;}
#area_main #sect1 .bx_key_feature > ul > li > a h3{font-size: 2.75em;font-weight: 300;margin-bottom:0.2em;}
#area_main #sect1 .bx_key_feature > ul > li > a p{}
#area_main #sect1 .bx_key_feature > ul > li.on > a{background-color: #666;color: #fff;border-color:#666;}

#area_main #sect1 .bx_desc{text-align: center;color: #fff;margin-top:2%;margin-bottom:5%;padding-bottom:80px;}
#area_main #sect1 .bx_desc h2{font-size: 1.75em;line-height: 1.5;margin-bottom:10px;position: relative;}
#area_main #sect1 .bx_desc p{font-size: 1.5em;position: relative;}
#area_main #sect1 .bx_desc .bot_btn{position: absolute;bottom:1.5em;left:0;right:0;bottom: 10px;}

#main_spot{position: relative;}
#main_spot footer{z-index: 2;position: absolute;bottom: 0;right: 0;left: 0;padding:1em;background:rgb(255,255,255);background: transparent9;background:rgba(255,255,255,0.7);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#b2ffffff,endColorstr=#b2ffffff);
}
#main_spot footer:nth-child(n) {filter: none;}
#main_spot footer > .in:after{content: '';display: table;clear: both;}
#main_spot footer > .in > div{width: 48%;float: left;margin:0 1%;}
#main_spot footer > .in > div.bx_news{width:38%}
#main_spot footer > .in > div.bx_notice{width:55%;margin-left:4%;}
#main_spot footer > .in > div h3{font-size: 1em;font-weight: 400;margin-bottom: .75em;}
#main_spot footer > .in > div h3 > span{display: inline;font-size: 1.5em;position: relative;padding-left:0.5em;vertical-align: middle;}
#main_spot footer > .in > div h3 > span:after{position: absolute;top: 5px;bottom: 5px;left: 0;width:3px;background-color: #A40000;content: '';}
#main_spot footer > .in > div h3 ul{display: inline-block;vertical-align: middle;margin-left:1em;}
#main_spot footer > .in > div h3 ul > li{float: left;padding:0 0.75em;position: relative;}
#main_spot footer > .in > div h3 ul > li:after{left:0;top: 0;bottom: 0;width:1px;background-color: #999;content: '';position: absolute;height:.75em;margin: auto;}
#main_spot footer > .in > div h3 ul > li:first-child:after{content: none;}
#main_spot footer > .in > div h3 ul > li > a{display: block;}
#main_spot footer > .in > div h3 ul > li.on{font-weight: 700;color: #A40000;}
#main_spot footer > .in > div > ul{}
#main_spot footer > .in > div > ul > li{font-weight: 300;line-height: 1.5;position: relative;padding-left: 0.625em;color: #666;font-size: 0.875em;white-space: nowrap;-ms-text-overflow: ellipsis;text-overflow: ellipsis;overflow: hidden;}
#main_spot footer > .in > div > ul > li:after{content: '·';position: absolute;left: 0.05em;top: 0;}
#main_spot footer > .in > div > ul > li > a{}
#main_spot footer > .in > div > ul > li > a .date{color: #44311C;font-weight: 400;margin-right:0.25em;}

#area_main #sect2 > .bg{background-color: #FDFFFC;}
#area_main #sect2 > .cont{margin-top:7%;margin-bottom:7%;}
#area_main #sect2 > .cont > h2{font-size: 2.75em;font-weight: 300;text-align: center;line-height: 1.5;color: #333;}
#area_main #sect2 > .cont .history{text-align: center;text-align: center;margin-top: 5%;}
#area_main #sect2 > .cont .history > ul{display: inline-block;}
#area_main #sect2 > .cont .history > ul > li{text-align: left;padding-left:1em;position: relative;font-size: 1.25em;line-height: 1.5;margin-bottom:10px;}
#area_main #sect2 > .cont .history > ul > li:after{position: absolute;left:0;top:0;content: '·';}
#area_main #sect2 > .cont .history > ul > li p{color: #333;}

#area_main #sect3{background-color: #e5e5e5;}
#area_main #sect3 > .cont{margin-top:7%;margin-bottom:7%;color: #1D3557;}
#area_main #sect3 > .cont > h2{font-size: 2.75em;font-weight: 300;text-align: center;line-height: 1.5;}
#area_main #sect3 > .cont .list_type2{max-width:1300px;margin:5% auto 0;}

#area_main #sect4{background-color: #f1f1f1;color: #666;}
#area_main #sect4 > .cont{margin-top:5%;margin-bottom:5%;}
#area_main #sect4 > .cont > h2{font-size: 2.75em;font-weight: 300;text-align: center;line-height: 1.5;color: #333;}
#area_main #sect4 > .cont > h3{font-size: 2.125em;font-weight: 300;text-align: center;line-height: 1.5;}
#area_main #sect4 > .cont .list_type3{max-width:1200px;margin:3.5% auto 0;}

#area_main #sect5{background:#333;color: #ccc;}
#area_main #sect5 > .cont{margin-top:3%;margin-bottom:3%;}
#area_main #sect5 > .cont > h2{font-size: 2.625em;font-weight: 300;text-align: center;line-height: 1.5;}
#area_main #sect5 > .cont .bx_contact{max-width:1300px;overflow: hidden;margin:3% auto 0;text-align: center;}
#area_main #sect5 > .cont .bx_contact > ul{margin-left:1px;margin-top:1px;}
#area_main #sect5 > .cont .bx_contact > ul:after{content: '';display: block;clear: both;}
#area_main #sect5 > .cont .bx_contact > ul > li{width:25%;float: left;}
#area_main #sect5 > .cont .bx_contact > ul > li > a{display: block;border:1px solid #666;margin-left:-1px;height:50px;padding:13px;margin-top:-1px;}
#area_main #area_map{position: relative;height: 0;padding-bottom:30%;}
#area_main #bx_map{position: absolute;top:0;bottom:0;left: 0;bottom: 0;width:100%;height:100%;}

#area_feature{position: relative;}
#area_feature > .bx_img{position: absolute;width:50%;left: 0;top: 0;bottom:0;overflow: hidden;}
#area_feature > .bx_img > ul{height:100%;}
#area_feature > .bx_img > ul > li{overflow: hidden;position: relative;}
#area_feature > .bx_img > ul > li > a{display: block;height: 100%;position: absolute;bottom: 0;left: 0;right: 0;}
#area_feature > .bx_img > ul > li img{position: absolute;bottom: 150px;left: 0;right: 0;margin: 0 auto;}
#area_feature > .bx_txt{margin-left: 50%;position: relative;background-color: #377494;color: #fff;text-align: center;
    -webkit-transition: background-color .5s ease-in-out;-o-transition: background-color .5s ease-in-out;transition: background-color .5s ease-in-out;}
#area_feature > .bx_txt > ul{}
#area_feature > .bx_txt > ul > li{display: table;width:100%;}
#area_feature > .bx_txt > ul > li > .in{display: table-cell;height: 100%;width: 100%;vertical-align: middle;padding:0 5%;}
#area_feature > .bx_txt h2{font-size: 50px;font-weight: 300;margin-bottom: 20px;}
#area_feature > .bx_txt h3{font-weight: 300;font-size: 25px;-ms-word-break: keep-all; word-break: keep-all;line-height: 1.5;margin-bottom:15px;}
#area_feature > .bx_txt p{font-weight: 300;font-size: 20px;-ms-word-break: keep-all; word-break: keep-all;line-height: 1.5;}
.bd_bg3 #area_feature > .bx_txt{background-color: #484048;}
.bd_bg4 #area_feature > .bx_txt{background-color: #0F3E58;}
.bd_bg5 #area_feature > .bx_txt{background-color: #377494;}
#area_feature.fixing > .bx_img{position: fixed;}
#area_feature.fixing > .bx_img > ul > li{height:100%;position: absolute;bottom: 0;left:0;right: 0;}


/*footer*/
#footer{bottom: 0; background:#333;}
#footer:nth-child(n) { filter: none; }
#footer > .inner{padding:1em;position: relative;}
#footer .company_info{text-align: center;margin-left:-32px;}
#footer .company_info >li{position: relative;font-size: 0.875em; color: #ccc;line-height: 1.75;display:inline-block;margin-left:16px;padding-left:16px;}
#footer .company_info >li:after{position: absolute;height:10px;width:1px;background-color: #ccc;top:0;bottom:0;margin:auto;left:-1px;content:'';}
#footer .company_info >li:first-child:after{content: none;}

#footer .checkOut{position: absolute;bottom:100%;margin-bottom:15px;right:15px;}
#footer .checkOut a{display: block;text-align: center;background-color: #fff;width:60px;height:60px;border-radius:50%;padding:10px;position: relative;}
#footer .checkOut img{max-width:50px;}
#footer .checkOut p{position: absolute;font-size: 0.875em;margin-top:0.25em;bottom:100%;margin-bottom:10px;background-color: #2B2D42;color: #BFBFC6; left: -25px; padding: 0.5em; right: -5px;visibility: hidden;opacity: 0;
    -webkit-transition:visibility .3s ease-in-out, opacity .3s ease-in-out;
    -moz-transition:visibility .3s ease-in-out, opacity .3s ease-in-out;
    -o-transition:visibility .3s ease-in-out, opacity .3s ease-in-out;
    transition:visibility .3s ease-in-out, opacity .3s ease-in-out;
}
#footer .checkOut a:hover p{visibility: visible;opacity: 1;}

/*로그인*/
#pop_login{position:fixed;left:0;right:0;z-index:31;width:30.5em;top:0px; margin:auto; background-color: #fff;display:none;visibility:hidden;opacity:0;max-width:96%;
	-webkit-transform: scale(0.5,0.5); -moz-transform: scale(0.5,0.5); -ms-transform: scale(0.5,0.5); -o-transform: scale(0.5,0.5); transform: scale(0.5,0.5);
	-webkit-transition:visibility .3s ease-in-out, opacity .3s ease-in-out, -webkit-transform .5s ease-in-out;
    -moz-transition:visibility .3s ease-in-out, opacity .3s ease-in-out, -moz-transform .5s ease-in-out;
    -ms-transition:visibility .3s ease-in-out, opacity .3s ease-in-out, -ms-transform .5s ease-in-out;
    -o-transition:visibility .3s ease-in-out, opacity .3s ease-in-out, -o-transform .5s ease-in-out;
    transition:visibility .3s ease-in-out, opacity .3s ease-in-out, transform .5s ease-in-out;
}
#pop_login.on{visibility:visible;opacity:1; -webkit-transform: scale(1,1); -moz-transform: scale(1,1); -ms-transform: scale(1,1); -o-transform: scale(1,1); transform: scale(1,1);}
#pop_login > .inner{margin:2.5em;position:relative;overflow:hidden;}
#pop_login .login_by_sns > ul{margin-top:2em;}
#pop_login .login_by_sns > ul > li > a{
	height: 2.5833em; line-height: 2.5833em;  display: inline-block; *display: inline; *zoom: 1; position: relative; color: #fff;font-size: 0.875em;width:100%;border-radius:0.3em;text-align: center;margin-bottom:1em;
}



/*타겟매쓰 소개*/

.owen_sect.para_con{}
.owen_sect.para_con .cont{}
.owen_sect.para_con .cont > .inner{}
.owen_sect.para_con .cont > .inner > h2{font-weight: 300;font-size: 2.125em;line-height: 1.5;margin-bottom:0.25em;letter-spacing: 2.5px;}
.owen_sect.para_con .cont > .inner > h3{font-weight: 400;font-size: 1.25em;line-height: 1.5;margin-bottom:0.5em;}
.owen_sect.para_con .cont > .inner > p{line-height: 1.75;margin-bottom:0.5em;}
.owen_sect.para_con .cont > .inner > ul{}
.owen_sect.para_con .cont > .inner > ul > li{padding-left:0.625em;position: relative;margin-bottom:0.5em;line-height: 1.75;}
.owen_sect.para_con .cont > .inner > ul > li:after{content: '-';position: absolute;top:0;left:0;}

#area_brand_intro{}
#area_brand_intro #area_spot .bg.video{overflow: hidden; }
#area_brand_intro #area_spot .bg.video > video{position: absolute; left: 0; width: 100%; bottom: 0; top: 0;margin:auto;}
#area_brand_intro #area_spot .cover{position: absolute;top:0;bottom:0;left:0;right:0;background-color: rgba(0,0,0,0.7);}
#area_brand_intro #area_spot button.view_video{position: absolute;right:1em;bottom:1em;color: #ccc;}
#area_brand_intro #area_spot button.view_video img{width:100%;}
#area_brand_intro #area_spot button.view_video > span{vertical-align: middle;display: inline-block;}
#area_brand_intro #area_spot button.view_video > span.img{height:1.5em;width: 1.5em;border-radius:50%;overflow: hidden;background-color: #ccc;}
#area_brand_intro #area_spot button.view_video:hover{color: #fff;}
#area_brand_intro #area_spot button.view_video:hover > span.img{background-color: #E63946;}

#intro_sect1{background-color: #121114;overflow: visible;position: relative;}
#intro_sect1 .bg{padding-bottom:5em;}
#intro_sect1 .bg img{ -webkit-filter: grayscale(1);filter: blur(20px) grayscale(1);max-width:100%;}
#intro_sect1 .cont{position: absolute;width:35em;max-width:95%;margin:auto;top:150px;right:1em;}
#intro_sect1 .cont > .inner{padding:2em;background-color: #666;color: #fff;border-radius:0.3em;}

#intro_sect2{background-color: #fff;overflow: visible;position: relative;}
#intro_sect2 .bg{padding-bottom:5em;text-align: right;}
#intro_sect2 .bg img{ -webkit-filter: grayscale(1);filter: blur(20px) grayscale(1);max-width:100%;}
#intro_sect2 .cont{position: absolute;width:35em;max-width:95%;margin:auto;top:150px;left:1em;}
#intro_sect2 .cont > .inner{padding:2em;background-color: #999;color: #fff;border-radius:0.3em;}

#intro_sect3{background-color: #121114;overflow: visible;position: relative;}
#intro_sect3 .bg{padding-bottom:5em;}
#intro_sect3 .bg img{ -webkit-filter: grayscale(1);filter: blur(20px) grayscale(1);max-width:100%;}
#intro_sect3 .cont{position: absolute;width:35em;max-width:95%;margin:auto;top:150px;right:1em;}
#intro_sect3 .cont > .inner{padding:2em;background-color: #666;color: #fff;border-radius:0.3em;}


/*체험하기*/
#area_trial{}
#area_trial .form_type01 h3{}
#area_trial #bx_write{margin-top:3em;}
#area_trial_completed{text-align: center;}
#area_trial_completed .tb_type1{margin-top:3em;}
#area_trial_completed .list_type5{margin-top:5em;}
#area_trial_completed .list_type5 > h2{font-size: 1.375em;margin-bottom:0.5em;}
#area_trial_completed .list_type5 > p{font-size: 1.125em;margin-bottom:3em;font-weight: 400;}

/*가이드*/
#area_guide .tab_type2{margin-bottom:2em;}
.bx_guide > p{font-size: 1.25em;margin-bottom:2em;text-align: center;}
.bx_guide .list_video > ol{text-align: center;margin-left:-1em;}
.bx_guide .list_video > ol:after{content: '';display: block;clear: both;}
.bx_guide .list_video > ol > li{float: left;width:20%;margin-bottom:1em;}
.bx_guide .list_video > ol > li > a{margin-left:1em;border:1px solid #ccc;border-radius:3px;display: block;padding:10%;position: relative;overflow: hidden;
	-webkit-transition:background-color .3s ease-in-out, border-color .3s ease-in-out;
    -moz-transition:background-color .3s ease-in-out, border-color .3s ease-in-out;
    -o-transition:background-color .3s ease-in-out, border-color .3s ease-in-out;
    transition:background-color .3s ease-in-out, border-color .3s ease-in-out;
}
.bx_guide .list_video > ol > li > a:hover{border-color:#A40000;}
.bx_guide .list_video > ol > li.on.admin > a{background-color: #FFC8E7;border-color:#A40000;}
.bx_guide .list_video > ol > li.on.teacher > a{background-color: #CFEFFF;border-color:#00A1EF;}
.bx_guide .list_video > ol > li.on.student > a{background-color: #D3FFF9;border-color:#41EAD4;}

.bx_guide .list_video > ol .label{font-weight: 400;font-size: 1em;position: absolute; width: 6.6667em; height: 1.6667em; line-height: 1.6667em; top: 0.8333em; right: -1.6667em; background: #00A1EF; color: #fff;
	z-index:1; font-size: 1em; text-align: center; -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg);}
.bx_guide .list_video > ol > li.admin .label{background-color: #A40000;}
.bx_guide .list_video > ol > li.teacher .label{background-color: #00A1EF;}
.bx_guide .list_video > ol > li.student .label{background-color: #41EAD4;}
.bx_guide .list_video > ol .img{height:0;padding-bottom: 50%;position: relative;}
.bx_guide .list_video > ol .img img{position: absolute;top:0;bottom:0;left: 0;right: 0;margin: auto;max-height: 100%;max-width: 100%;background-color: #ccc;border-radius:7px;overflow: hidden;
	-webkit-transition:background-color .3s ease-in-out; -moz-transition:background-color .3s ease-in-out; -o-transition:background-color .3s ease-in-out; transition:background-color .3s ease-in-out;
    }

.bx_guide .list_video > ol > li.on.admin .img img{background-color: #A40000;}
.bx_guide .list_video > ol > li.on.teacher .img img{background-color: #00A1EF;}
.bx_guide .list_video > ol > li.on.student .img img{background-color: #41EAD4;}
.bx_guide .list_video > ol .con{margin-top:10%;}
.bx_guide .list_video > ol .con p{-ms-text-overflow: ellipsis;text-overflow: ellipsis;overflow: hidden;white-space: nowrap;}

/*.bx_guide .list_video > ol > li .tooltip p{margin-top:0.5em;}
.bx_guide .list_video > ol > li .tooltip .img{}
.bx_guide .list_video > ol > li .tooltip .img img{max-width:100%;width:500px;}
.bx_guide .list_video > ol > li button{margin:0 0.5em;vertical-align: middle;}
.bx_guide .list_video > ol > li button > img{height:35px;}*/

.bx_video{margin-bottom:50px;max-width:720px;margin-left:auto;margin-right: auto;background-color: #333;}
.bx_video > .inner{height:0;padding-bottom:56.25%;position: relative;}
.bx_video > .inner >iframe{position: absolute;top:0;bottom:0;right:0;left:0;width:100%;height:100%;}











/*고객센터 - 문의하기*/
#area_contact .left_area{float:left;width:70%;position: relative;}
#area_contact .left_area:after{position: absolute;right:0;top:0;bottom:0;border-right: 1px solid #ccc;content: '';}
#area_contact .left_area #bx_write{margin-right:1em;}
#area_contact .right_area{float:right;width:30%;position: relative;}
#area_contact .bx_contact_info{margin:auto;max-width:300px;padding-left:1em;}
#area_contact .bx_contact_info h3{margin-top:1em;}
#area_contact .bx_contact_info dl{}
#area_contact .bx_contact_info dl > dt{margin-top:2em;}
#area_contact .bx_contact_info dl > dd{color:#666;font-size: 0.875em;margin:0.5em 0;line-height:1.5;}
#area_contact .bx_contact_info dl > dd .email{font-size: 1.5em;font-weight: 300;color: #A40000;}
#area_contact .bx_contact_info dl > dd .tel{font-size: 1.75em;font-weight: 300;color: #A40000;}
#area_contact .bx_contact_info .btns{margin-top:2em;}
#area_contact .bx_contact_info .btns button.btn_pack{font-size: 0.875em;margin-bottom:0.5em;}


/*고객센터 - 원격지원*/
#area_remote{}
#remote_sect1{overflow: hidden;position: relative;}
#remote_sect1 .bg .cover{background-color: rgba(255,255,255, 0.5);position: absolute;top:0;bottom:0;right:0;left:0;}
#remote_sect1 .cont{margin-top:15%;}
#remote_sect1 .cont > h3{text-align: center;font-size: 2.5em;font-weight: 300;margin-bottom:0.5em;}
#remote_sect1 .cont > p{text-align: center;font-size: 1.25em;line-height: 1.5;}
#remote_sect1 .cont > p .tel{font-size: 1.5em;color:#A40000;font-weight: 300;}
#remote_sect1 .list_remote{margin:4em 10% 0;}
.list_remote > ul{margin-left:-5%;}
.list_remote > ul > li{width:33.333%;float:left;margin-bottom:5%;}
.list_remote > ul > li > a{display: block;margin-left:15%;text-align: center;background-color: rgba(255,255,255,0.5);padding:1.5em;border-radius:0.2em;}
.list_remote .img{width:7.5em;height:7.5em;margin:auto;}
.list_remote .img img{max-width:100%;max-height:100%;}
.list_remote p{margin-top:2em;font-size: 1.125em;}

/*스토리 - 인터뷰*/
#area_story_slide{margin-bottom:3em;}
#area_story_slide > .box_slide{overflow:hidden;}
#area_story_slide > .box_slide > ul:after{content: '';display: table;clear: both;}
#area_story_slide > .box_slide > ul > li{position: relative;width: 100%;}
#area_story_slide > .box_slide dl{height:460px;}
#area_story_slide > .box_slide dl > dt{width:60%;float:left;overflow:hidden;height:100%;}
#area_story_slide > .box_slide dl > dt > a{display: block;height:100%;}
#area_story_slide > .box_slide dl > dd{width:40%;float:left;height:100%}
#area_story_slide div.bg_line{margin-left:10.4167%;padding:10px 0px;background: #FEB3DE;;height:100%;box-sizing:border-box;}
#area_story_slide div.bg_line > div{height:100%;background-color: #fff;padding:0 1.75em;}
#area_story_slide h2{color:#a00459;font-size:0.9375em;padding-top:37px;margin-bottom:1.3889em;font-weight:400;}
#area_story_slide h3{color:#333333; font-size:1.25em; line-height:1.25em;margin-bottom:0.7273em;overflow:hidden;-ms-text-overflow: ellipsis;text-overflow: ellipsis;white-space: nowrap;}
#area_story_slide h4{color: #999999; font-size: 0.875em; margin-bottom:1.3333em;font-weight:400;}
#area_story_slide p{font-size:0.875em;color: #888; line-height:25px;max-height:200px;overflow:hidden; display: -webkit-box; -webkit-line-clamp: 8;  -webkit-box-orient: vertical; }
#area_story_slide .paginate{text-align:center;margin:30px 0px;}
#area_story_slide .paginate > .swiper-pagination-switch{width:12px; height:12px;border-radius:6px;background-color: #e3e3e3; margin:0px 0.375em;opacity: 1;
-webkit-transition: .3s ease-in-out;  -moz-transition: .3s ease-in-out;  -o-transition: .3s ease-in-out;  transition: .3s ease-in-out;}
#area_story_slide .paginate > .swiper-active-switch{width:30px; background-color: #940450;}
#area_story_slide .paginate > .swiper-pagination-switch:hover{background-color: #940450;}

/*공지사항*/
.list_post1{position: relative;}
.list_post1 > ul{}
.list_post1 > ul > li{margin-top: 3.25em;}
.list_post1 > ul > li:first-child{margin-top: 0;}
.list_post1 > ul > li > dt{}
.list_post1 dl{position: relative;}
.list_post1 dl > dt{position: absolute;width:6.25em;padding:0.75em 0;text-align: center;top:1em;background-color: #fff;}
.list_post1 dt strong{display: block;font-size: 1.125em;}
.list_post1 dt span{display: block;font-size: 1.125em;color: #999;}
.list_post1 dl > dd{margin-left:7.5em;padding-top:.75em;}
.list_post1 dl > dd > h3{font-size: 1.625em;line-height: 1.375;max-height: 2.75em;overflow: hidden;margin-bottom: 0.5em;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
.list_post1 dl > dd > p{font-size: 0.9375em;line-height: 1.5;max-height: 6em;overflow: hidden;font-weight: 300;color: #666; display: -webkit-box;-webkit-line-clamp: 4;-webkit-box-orient: vertical;}
.list_post1 .bg_line{left:3.125em;top: 0;bottom: 0;width:1px;background-color: #E9E9E9;position: absolute;}

/*포스트 상세 팝업*/

#pop_post_view {width:1100px;}
.pop_type1 > .arti_type1{padding:4%;}
.arti_type1{background-color: #fff;height:100%;box-sizing: border-box;}
.arti_type1 > header{padding: 0em 1em .875em;border-bottom:2px solid #DFDFDF;}
.arti_type1 > header >.inner{position: relative;overflow: hidden;}
.arti_type1 > header >.inner:after{content: '';display: table;clear: both;}
.arti_type1 > header .cate{background-color: #23a8f5;color: #ffffff;font-size: 15px;padding: 6px 10px;line-height: 1;font-weight: 300;display: inline-block;}
.arti_type1 > header > .inner > h2{color: #333333;font-size: 24px;margin: 13px 0 10px;}
.arti_type1 > header > .inner > p{color: #666;font-size: 15px;font-weight: 300;}
.arti_type1 > header > .inner > p > span{margin-right: 15px;}
.arti_type1 > header > .inner > p strong{color: #c8c8c8;font-weight: 300;}

.arti_type1 > header .btn_close{top: 10px;right: 10px;position: absolute;}
.arti_type1 .bx_article_detail{box-sizing: border-box;}
.arti_type1 .bx_article_detail > .inner{height:100%;overflow: hidden;position: relative;}
.arti_type1 .bx_article_detail .article_detail{max-width:867px;padding:30px 0;margin:auto;}
.arti_type1 .bx_article_detail .article_detail > .con{font-size: 16px;margin-bottom:60px;}
.arti_type1 .article_detail > .con .img{max-width:560px;margin:auto}
.arti_type1 .article_detail > .con img{max-width:100%;display: block;margin: 10px auto;}
.arti_type1 .article_detail > .con .img figure{display: block;margin: 12px 6px;color: #9a9a9a;line-height: 1.5;font-size: 0.9375em;-ms-word-break: keep-all;word-break: keep-all;}
.arti_type1 .article_detail > .con p{color: #666666;font-weight: 300;line-height: 1.35;margin:1.25em 0;font-size: 1.125em;word-break: keep-all;}

.hashes_t1{margin-top:0.875em;margin-bottom:-4px; white-space: nowrap;-ms-text-overflow: ellipsis;text-overflow: ellipsis;overflow: hidden;}
.hashes_t1 span{display: inline-block;font-size: 13px;color: #666666;background-color: #f3f4f6;padding: 4px 6px ;font-weight: 300;margin:0 2px 4px;}


/*준비중*/
.tmp_ready_box{text-align: center;}
.tmp_ready_box img{margin-bottom:3em;max-width:auto;}
.tmp_ready_box h3{font-size: 2.5em;font-weight: 300;margin-bottom:0.25em;}
.tmp_ready_box h4{font-size: 1.75em;font-weight: 300;}