﻿@charset "utf-8";

/* All Device */
	.body{ overflow: auto}
	.page{position: absolute; left: 0; top: 0; width:100%; min-width: 1056px; background-color: #fff; min-height:100%;}

/* Header // ST */
	.header01{height: 82px; background:#fff; border-bottom: 1px solid #eaeaea; position: fixed;top: 0;transition: top 0.6s ease-in-out;width: 100%; z-index: 100; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
	.header02 {background-color:rgba(255, 255, 255, 1); border-bottom: 1px solid #e0e0e0; position: fixed;top: 0;transition: top 0.4s ease-in-out;width: 100%; /*box-shadow:0px 0px 12px rgba(0,0,0,.15);*/ z-index: 99; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
	.header03 {background-color:rgba(255, 255, 255, 1); /*border-bottom: 1px solid #e0e0e0; */position: fixed;top: 0; transition: top 0.2s ease-in-out;width: 100%; height: 141px; box-shadow:0px 0px 12px rgba(0,0,0,.05);z-index: 98; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
	.nav-up {top: -82px !important; background-color: rgba(255, 255, 255, 1);}


	.header02.nav-up{
		background-color: rgba(255, 255, 255, 0.9);
		border-bottom: 1px solid #e0e0e0;
		-webkit-animation-name: example; /* Safari 4.0 - 8.0 */
		-webkit-animation-duration: 1.5s; /* Safari 4.0 - 8.0 */
		animation-name: example;
		animation-duration: 1.5s;
	}
	
	.header02.nav-up .submenu01>li>a{color:#484848;}
	.header02.nav-up .submenu01>li>a:hover{color:#000;}
	.header02.nav-up .btn_nav>span>i{background-color: #484848;}
	.header02.nav-up .btn_nav:hover span>i{background-color:#000;}

	.nav-down{}
	/* Safari 4.0 - 8.0 */
	@-webkit-keyframes example {
	  from {background-color:#ffffff; border-bottom: 1px solid #e0e0e0;}
	  to {background-color: rgba(255, 255, 255, 0.9); border-bottom: 1px solid #e0e0e0;}
	}

	/* Standard syntax */
	@keyframes example {
	  from {background-color:#ffffff; border-bottom: 1px solid #e0e0e0;}
	  to {background-color: rgba(255, 255, 255, 0.9); border-bottom: 1px solid #e0e0e0;}
	}


	/* 공통사이즈 */
	.TopGnb{position:relative; min-width:700px; margin:0 auto;}

	/* 로고 */
	.logo{position: absolute; top: 20px; left:10px; line-height: 100%;}
	.logo>a{display:block; width: 223px; height: 37px;}
	.logo>a>img{max-width: 223px; width: auto; height: 37px;}
	/* 상단바 */
	.Language_box{position: absolute; top:0px; left: 0px; width:100%; height: 27px;}
	.Language{float: right; margin-right: 15px; margin-top: 5px;}
	.Language>li{float: left;}
	.Language>li>a{display: inline-block; padding: 0 15px; height: 27px; line-height: 27px; font-weight: 500; text-align: center; color: #999; font-size: 12px; text-decoration: none;}
	.Language>li>a:hover{color: #000;}
	/* 로그인 */
	.Login{}
	.Login:hover{}
	.minfo{display: inline-block; padding: 0; height: 27px; line-height: 27px; text-align: right; font-size: 12px; margin-right: 5px; color: #58b6c4; font-weight: 600;}
	/* 로그인아웃 */
	.Logout{}
	.Logout:hover{}
	/* 언어 */
	.kr{}
	.kr:hover{}
	.en{}
	.en:hover{}
	.ch{}
	.ch:hover{}
	.vn{}
	.vn:hover{}
	/* 검색 */
	.Search{position: absolute; top: 40px; right:15px; width: 247px; padding-right: 30px; border-radius: 15px; height: 30px; border: 1px solid #e0e0e0; background-color: #fff;}
	.Search>input{width: 100%; height: 30px; border:none; padding: 5px 15px; font-size: 15px; color: #707070; background-color: transparent; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
	.Search>a{position: absolute; top: 0; right:5px; width: 30px; height: 30px; text-indent: -5000px; background: url("/Content/Homepage/image/ko-KR/common/icon_search.png") center 50% no-repeat; border-radius: 15px;}
	.Search>a:hover{background: url("/Content/Homepage/image/ko-KR/common/icon_search_01.png") center 50% no-repeat;}

	/* 메뉴 /모바일&PC */
	.Gnb{display: block; height:59px; padding-top: 82px;}
	.Gnb:before{content:''; display:block; clear:both;} 
	.btn_nav{position:absolute; right:0; top:80px; width:80px; height:60px; overflow: hidden; display:block; z-index:10000000; cursor:pointer;}
	.btn_nav>span{display:inline-block; width:30px; margin-left: 20px; margin-top: 20px; height:21px;text-align: right;}
	.btn_nav>span>i{display:block; height:3px; margin:0; padding: 0; line-height: 0px; font-size: 0; background-color:#484848;}
	.btn_nav:hover span>i{background-color:#000;}
	.btn_nav>span>i:nth-child(1){width:30px; float: right; margin-bottom: 6px;}
	.btn_nav>span>i:nth-child(2){width:25px; float: left; margin-bottom: 6px;}
	.btn_nav>span>i:nth-child(3){width:30px; float: right;}

	.btn_nav01{position: absolute; left: 0; top: 0; width: 100%; z-index: 90;}
	.btn_nav02{display:block; position: fixed; width: 100%; height: 100%; background-color: rgba(255, 255, 255, 0); left:0; top: 0; z-index: 80;}
	.btnclose{position: absolute; left: 0; bottom: -25px; width: 100%; height: 50px; text-align: center;z-index: 1000}
	.btn_nav03{display: inline-block; width: 50px; height: 50px; border-radius: 50%; background:#fff url(/Content/Homepage/image/vi-VN/fonts/vicons/ic_expand_less_black_24px.svg) center 50% no-repeat; background-size: 100%;border: 1px solid #ddd;cursor: pointer;}
	.btn_nav03:hover{background-color:#404040;border: 1px solid #404040;}

	.submenu01{float: left; margin-left: 35px;}
	.submenu01:after{content:''; display:block; clear:both;}
	.submenu01>li{float:left; list-style:none; margin-right: 60px;position: relative;}
	.submenu01>li:hover ul{display: block;}
	.submenu01>li>a{font-size:18px; font-weight: 500; display:inline-block; height:58px; line-height:58px; margin:0; color:#000; text-decoration:none; position: relative;}
	.submenu01>li>a:hover{color:#505050;}

	.display_off{display: none !important;}
	.display_on{display: block !important;}

	.submenu01>li ul{display:none; position: absolute; top: 50px; z-index: 1000000; padding:15px 0; border: 1px solid #e0e0e0; border-radius: 5px;box-shadow:0px 0px 12px rgba(0,0,0,.05);}
	.submenu01>li ul:before{content:''; display:block; clear:both; position: absolute; top: -7px; left: 45px; width: 15px; height: 7px; background: url("/Content/Homepage/image/ko-KR/common/mbar.png") center top no-repeat; z-index:1000}
	.submenu01>li:nth-child(1) ul {left: -20px; width: 110px; background-color: #fff;}
	.submenu01>li:nth-child(2) ul {left: -20px; width: 140px; background-color: #fff;}
	.submenu01>li:nth-child(3) ul {left: -20px; width: 160px; background-color: #fff;}
	.submenu01>li:nth-child(4) ul {left: -20px; width: 110px; background-color: #fff;}
	.submenu01>li:nth-child(5) ul {left: -20px; width: 110px; background-color: #fff;}
	
	.submenu01>li ul>li>a{display: block; font-size: 14px; line-height: 130%;  color: #707070; padding:7px 20px;}
	.submenu01>li ul>li>a:hover{color: #999;}


	/*pc전체메뉴*/
	.gnb_allbtn{display:block; position: absolute; width: 100%; height: auto; border-bottom: 1px solid #d0d0d0; background-color: #fff; left: 0; top:110px; z-index:99; box-shadow:2px 2px 10px rgba(0,0,0,.05); }
	.pc_depths_box{display: block; min-width:700px; margin:0 auto; padding:50px 30px;  overflow: hidden}

	.pc_depths_box>li{float: left; font-size: 16px; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
	.pc_depths_box>li:nth-child(1){width: 134px;}
	.pc_depths_box>li:nth-child(2){width: 124px;}
	.pc_depths_box>li:nth-child(3){width: 140px;}
	.pc_depths_box>li:nth-child(4){width: 124px;}
	.pc_depths_box>li:nth-child(5){width: 124px;}
	.pc_depths_box>li>a{display: inline-block; border-bottom: 2px solid #707070; color:#000;}
	.pc_depths_box>li>a:hover{color:#ccc;}
	.pc_depths_box>li>ul{margin-top: 10px; border-left: 1px solid #e0e0e0;}
	.pc_depths_box>li>ul>li>a{display: block; font-size: 13px;color:#909090; padding: 5px 10px; line-height: 120%; text-align: left;}
	.pc_depths_box>li>ul>li>a:hover{color:#000;}
		

	
	.niv01_1:hover #subca_1{display: block;}
	.listmu.current {display: block;}
	.caon {display: block;}

/* Header // END  */



/* Con_wrap // ST  */
	.Container{padding-top: 291px;}
	.Con_wrap{background-color: #fff; padding-bottom: 100px;}
	.Contents{margin: 0 auto; position: relative; padding:40px 10px 20px; min-height: 400px; min-width:700px; overflow: hidden;}
/* Con_wrap // END  */

/* Footer // ST  */
	.footermargin{height: 20px; min-width: 320px; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
	.Footer{ overflow: hidden; background-color: #fff; border-top: 1px solid #e0e0e0; padding: 20px; position: absolute; left: 0; bottom: 0; width: 100%; color: #909090; font-size: 11px; text-align: center;}
	.Footer>ul{display: inline-block; margin: 0 auto;}
	.Footer>ul>li{color: #505050; font-size: 12px; float: left; padding:5px;}
    .Footer>ul>li:before{content: "|";display: inline-block;margin: 0 15px 0 5px;color: #c8c8c8;font-size: 10px;}
	.Footer>ul>li:first-child:before{content: "|";display: none;}
	.Footer>ul>li>a{color: #707070;}
	.Footer>ul>li>a:hover{color: #000;}
	.Footer>ul:AFTER{clear: both; display: block; content: "";}
	.Footer>p{color: #505050; font-size: 12px;}
	.Footer>p>span{ display: inline-block; margin-right:20px;}
	.Footer>p>strong{color: #202020; font-weight: 600; margin-right:20px;}
	.Footer>p.address01>span{display: inline-block;}
/* Footer // ENd  */




/* BUTTON(CSS) ----------- */
.btn1,.btn2,.btn3,.btn4,.btn_img{border-radius:2px;display:inline-block;overflow:visible;margin:0;padding:0 7px;border:0 none;background:none;text-align:center;vertical-align:middle;/* outline:0; */cursor:pointer}
.btn1{position:relative;min-width:45px;height:30px;padding:0 10px;background-color:#c30;font-weight:bold;line-height:30px;color:#fff !important}
.btn1.blue{background-color:#4b6898;box-shadow:inset 1px 1px 0 #6f86ad;border:1px solid #1d4b98;}
.btn1.blue:hover,.btn1.blue:active{background-color:#265198;box-shadow:inset 1px 1px 0 #5174ad;border:1px solid #003998;}
.btn1.brown{background-color:#af7d41}
.btn1.gray{background-color:#999;box-shadow:inset 1px 1px 0 #b2b2b2;border:1px solid #909090;}
.btn1.gray:hover,.btn1.gray:active{background-color:#7a7a7a;box-shadow:inset 1px 1px 0 #9c9c9c;border:1px solid #616161;}
.btn1.sky{background-color:#6fb5b9}
.btn1 .ico_arr4_r{margin:-2px -13px 0 13px}
.btn1.large{height:42px;line-height:42px}
.btn1.red{background-color:#cc3300;box-shadow:inset 1px 1px 0 #cc613e;border:1px solid #a90000;}
.btn1.red:hover,.btn1.red:active{background-color:#a90000;box-shadow:inset 1px 1px 0 #b52f00;border:1px solid #8c0000;}
.btn1.green{background-color:#fff;border:1px solid #4c9a3d;color:#489139 !important;}
.btn1.green:hover,.btn1.green:active{background-color:#fff;border:1px solid #336628;color:#336628 !important;}
.btn1.down{background-color:#4c9a3d;border:1px solid #336628;color:#fff;box-shadow:inset 1px 1px 0 #52aa43;}
.btn1.down:hover,.btn1.down:active{background-color:#3e7a30;border:1px solid #336628;color:#fff;box-shadow:inset 1px 1px 0 #4f8c37;}
/*.btn1.pop{background-color:#009ea4;border:1px solid #008f94;color:#fff;box-shadow:inset 1px 1px 0 #00adaf;}
.btn1.pop:hover,.btn1.pop:active{background-color:#008f94;border:1px solid #008789;color:#fff;box-shadow:inset 1px 1px 0 #00999b;}*/
.btn1.pop{background-color:#fff;border:1px solid #1d4b98;color:#1d4b98 !important;}
.btn1.pop:hover,.btn1.pop:active{background-color:#fff;border:1px solid #2ca9e9;color:#2ca9e9 !important;}
.btn1.add{background-color:#dea800;border:1px solid #be8b00;color:#fff;box-shadow:inset 1px 1px 0 #e8b400;}
.btn1.add:hover,.btn1.add:active{background-color:#cfa100;border:1px solid #bc9600;color:#fff;box-shadow:inset 1px 1px 0 #dbba00;}

.center{text-align:center !important;}
.right{text-align:right !important;}
.left{text-align:left !important;}


/* 팝업 */
/* 기본팝업 */
#popup1{width: 360px; left: 370px; top:86px; z-index: 10001;}
.popupLayer{border: solid 1px #d0d0d0; background-color: #fff; position: absolute; box-shadow:2px 2px 5px rgba(0,0,0,0.1)}
.popupLayer .popuptitle{position: relative; height: 40px;}
.popupLayer .popuptitle h2{font-weight: 400; line-height: 40px; padding-left: 30px; font-size: 16px; color: #828790; text-indent: 10px; background: #fff url(/Content/Homepage/image/ko-KR/common/pop_title_icon.png) 10px 50% no-repeat;}
.popupLayer .popuptitle .btnArea{position: absolute; right: 15px; top: 7px;}
.popupLayer .popuptitle .btnArea .minBtn.on{text-indent: -5000px; background: url(/Content/Homepage/image/ko-KR/common/del_de01.png) center 50% no-repeat; width: 26px; height: 26px; border: none;}
.popupLayer .popuptitle .btnArea .minBtn.on:hover{background: url(/Content/Homepage/image/ko-KR/common/del_ov01.png) center 50% no-repeat;}
.popupLayer .popuptitle .btnArea .minBtn.off{text-indent: -5000px; background: url(/Content/Homepage/image/ko-KR/common/view_de01.png) center 50% no-repeat; width: 26px; height: 26px; border: none;}
.popupLayer .popuptitle .btnArea .minBtn.off:hover{background: url(/Content/Homepage/image/ko-KR/common/view_ov01.png) center 50% no-repeat;}
.popupLayer .popuptitle .btnArea .closeBtn{text-indent: -5000px; background: url(/Content/Homepage/image/ko-KR/common/close_de01.png) center 50% no-repeat; width: 26px; height: 26px; margin-left: 5px; border: none;}
.popupLayer .popuptitle .btnArea .closeBtn:hover{background: url(/Content/Homepage/image/ko-KR/common/close_ov01.png) center 50% no-repeat;}
.popupLayer .popupContent {background-color: #fff; border-top:1px solid #e0e0e0;  position: relative; padding-bottom: 45px;}
/* 모달팝업 */
#Mo_popup1{}
.Mo_popupLayer_bg{position: fixed; width: 100%; height: 100%; top:0; left: 0; background-color: rgba(0,0,0,0.85); z-index: 10001;}
.Mo_popupLayer_box{width: 600px; margin: 15% auto; border: solid 1px #d0d0d0; background-color: #fff; box-shadow:2px 2px 5px rgba(0,0,0,0.1)}
.Mo_popupLayer_box .popuptitle{position: relative; height: 40px;}
.Mo_popupLayer_box .popuptitle h2{font-weight: 400; line-height: 40px; padding-left: 30px; font-size: 16px; color: #828790; text-indent: 10px; background: #fff url(/Content/Homepage/image/ko-KR/common/pop_title_icon.png) 10px 50% no-repeat;}
.Mo_popupLayer_box .popuptitle .btnArea{position: absolute; right: 15px; top: 7px;}
.Mo_popupLayer_box .popuptitle .btnArea .minBtn.on{text-indent: -5000px; background: url(/Content/Homepage/image/ko-KR/common/del_de01.png) center 50% no-repeat; width: 26px; height: 26px; border: none;}
.Mo_popupLayer_box .popuptitle .btnArea .minBtn.on:hover{background: url(/Content/Homepage/image/ko-KR/common/del_ov01.png) center 50% no-repeat;}
.Mo_popupLayer_box .popuptitle .btnArea .minBtn.off{text-indent: -5000px; background: url(/Content/Homepage/image/ko-KR/common/view_de01.png) center 50% no-repeat; width: 26px; height: 26px; border: none;}
.Mo_popupLayer_box .popuptitle .btnArea .minBtn.off:hover{background: url(/Content/Homepage/image/ko-KR/common/view_ov01.png) center 50% no-repeat;}
.Mo_popupLayer_box .popuptitle .btnArea .closeBtn{text-indent: -5000px; background: url(/Content/Homepage/image/ko-KR/common/close_de01.png) center 50% no-repeat; width: 26px; height: 26px; margin-left: 5px; border: none;}
.Mo_popupLayer_box .popuptitle .btnArea .closeBtn:hover{background: url(/Content/Homepage/image/ko-KR/common/close_ov01.png) center 50% no-repeat;}
.Mo_popupLayer_box .popupContent {background-color: #fff; border-top:1px solid #e0e0e0;  position: relative; padding-bottom: 45px;}


.pop_footer_btn{position: absolute; bottom: 0; left: 0; width: 100%; height: 45px; border-top:1px solid #e0e0e0; background-color: #fff;}
.pop_footer_btn>ul{text-align: right; padding: 10px;}
.pop_footer_btn>ul>li{display: inline-block}
.btn_ubmit_01{display: inline-block; background-color: #da4b00; border: 1px solid #da4b00; border-radius: 2px; width: 70px; height: 25px; line-height: 25px; text-align: center; color: #fff; font-size: 13px; font-weight: 500;}
.btn_ubmit_01:hover{display: inline-block; background-color: #404040; border: 1px solid #404040;}
.btn_cancel_01{display: inline-block; background-color: #fff; border: 1px solid #BBBBBB; border-radius: 2px; width: 70px; height: 25px; line-height: 25px; text-align: center; color: #707070; font-size: 13px; font-weight: 500;}
.btn_cancel_01:hover{background-color: #f0f0f0; border: 1px solid #aaa; color: #606060;}



/* 로그인 */
.Login_Contents{margin: 0 auto; padding:40px 10px 100px; min-width:700px;}

.login_container_box {position: absolute; height:100%; width: 100%; left: 0; top: 25px;}

.login_box{position: absolute; width: 100%; top: 47%;}
.login_box .hjcon{margin: 0 auto; width: 496px; overflow: hidden;}
.login_box .idcon{margin: 0 auto; width: 260px; overflow: hidden;}

.logininput{}
.logininput>ul{width: 496px;}
.logininput>ul>li{float: left; position: relative;}
.logininput>ul.idpwsh>li{float:inherit;}
.logininput>ul>li h3{display: inline-block; position: absolute; left: 55px; top: 30px; font-size: 16px; color: #303030; font-weight: 600;}
.logininput>ul>li h4{display: inline-block; position: absolute; left: 55px; top: 52px; font-size: 13px; color: #777; font-weight: 500;}
.join_box{margin-top: 10px;}
.join_box>a{display: inline-block; color: #505050;}
.join_box>a:hover{color: #0182ba;}
.join_box>span{display: inline-block; padding: 0 20px; color: #c0c0c0; font-weight: 200;}
.logininput>h2{color: #a0a0a0; font-size: 24px; padding-left: 60px; font-weight: 400; margin-bottom: 5px;}
.logininput input{color: #707070; font-size: 12px; padding: 0 10px; font-weight: 400; border: 1px solid #e0e0e0; border-radius: 3px; width: 260px; height: 40px; }
.logininput input[type=text]{margin-bottom: 4px;}
.logininput input[type=password]{background-color: #f6f6f6;}
.logininput .btn_email01{color: #404040; font-size: 14px; padding: 0 10px; font-weight: 400; background-color: #404040; border: none; color: #fff; border-radius: 4px; width: 260px; height: 40px; cursor: pointer;}
.logininput .btn_email01:hover{background-color: #202020;}

.inicon_02{background: url(/Content/Homepage/image/ko-KR/common/de_inicon.png) 0 50% no-repeat; width: 60px; height: 84px; display: inline-block;}
.login_btn01{display: inline-block; margin-left: 10px; width: 160px; height: 84px; background: url(/Content/Homepage/image/ko-KR/common/login_de_btn.png) 0 0 no-repeat; text-indent: -5000px;}
.login_btn01:hover{background: url(/Content/Homepage/image/ko-KR/common/login_ov_btn.png) 0 0 no-repeat;}




/* 에러 */
.error_box_bg{position: fixed; width: 100%; height: 100%; top:0; left: 0; padding: 2%; background-color:#f2f2f2; z-index: 10001;}
.error_box{display: table; width: 100%; height: 100%; border: 1px solid #d0d0d0; background-color: #fff;}
.error_box .ct {display: table-cell; vertical-align: middle; text-align: center;}
.error_box .txt {background: url(/Content/Homepage/image/ko-KR/common/icon_monitor.png) no-repeat center; display: block; width: 146px; height: 120px; margin: 0 auto; line-height: 103px; font-size: 28px; color: #d0d0d0; font-weight: 600; text-align: center;}
.error_box h4 {margin-top: 40px; line-height: 100%; font-size: 20px; color: #707070; font-weight: 500; text-align: center;}
.error_box p {margin-top: 10px; line-height: 100%; font-size: 16px; color: #999999; font-weight: 500; text-align: center;}
.home_btn {display: inline-block; margin: 0 auto; margin-top: 20px; line-height: 50px; padding: 0 40px; font-size: 14px; color: #fff; background-color: #01a1ce; font-weight: 500; text-align: center; border-radius: 5px;}
.home_btn:hover {background-color: #005fc0;}



/* Mobile */
@media all and (min-width:421px){
}


@media all and (min-width:640px){

}


/* Tablet */
@media all and (min-width:768px){


}



/* Desktop */
@media all and (min-width:1056px) {
	.Contents{width:1056px;}
	.TopGnb{width: 1056px;}
	.pc_sub_menu_box{width: 1056px;}
	.pc_depths_box{width:1056px;}

}




/* PRINT ----------- */
@media print{
.header, .footer{display:none}
}
