@charset "utf-8";

body {overflow: hidden; word-break: break-word; font-family: '微软雅黑','黑体','宋体', dotum, sans-serif, Arial !important;}

.txt-shadow {text-shadow: -1px -1px 0 #333, 1px -1px 0 #333, -1px 1px 0 #333, 1px 1px 0 #333;}

wrap1200 {width:95%; max-width: 1200px; height: auto; margin: 0 auto;}
.wrap1300 {width:95%; max-width: 1300px; height: auto; margin: 0 auto;}
.wrap1400 {width:95%; max-width: 1400px; height: auto; margin: 0 auto;}
.wrap1540 {width:95%; max-width: 1540px; height: auto; margin: 0 auto;}

.default-wrap {width: 95%;  height: auto; margin: 0 auto;}

.Montserrat {font-family: '微软雅黑','黑体','宋体', dotum, sans-serif, Arial !important;}
.NotoSansKR {font-family: '微软雅黑','黑体','宋体', dotum, sans-serif, Arial !important;}
.NanumSquare {font-family: '微软雅黑','黑体','宋体', dotum, sans-serif, Arial !important;}

.clearfix{*zoom:1}
.clearfix:after{display:block;content:"";clear:both; visibility:hidden; height:0}
.tran02 {
	transition: all 0.2s ease;
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-ms-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
}
.tran03 {
	transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
}
.tran04 {
	transition: all 0.4s ease;
	-webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	-ms-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
}
.txtcolor-main {color: #EE8833!important;}
.txtcolor-sub {color: #ff5353!important;}
.bgcolor-main {background-color: #EE8833!important;}
.bgcolor-sub {background-color: #ff5353!important;}
.width20 {width: 20%!important;}
.width30 {width: 30%!important;}

.btn-style1 {display:block; width:auto; height:auto; position: relative;}
.btn-style1 a {display:inline-block;width:auto;height:auto;position: relative;padding: 15px 20px; margin-left: 5em;}
.btn-style1 a .txt {font-size: 0.95rem;color:#ffffff;margin-right:70px;position:relative;z-index:5;}
.btn-style1 a .arrow {display:block;width: 46px;height:1px;background:#999999;position: absolute;right: 26px;top: 55%;z-index: 5;}
.btn-style1 a .arrow:after {content:"";display:block;width: 15px;height:1px;background: #999999;transform:rotate(45deg);position:absolute;right: -1px;bottom: 6px;z-index:5;}
.business-article:hover .btn-style1 a {margin-left: 0em;}
.business-article:hover .btn-style1 a .txt {color:#ffffff;}
.business-article:hover .btn-style1 a .arrow {background:#ffffff;}
.business-article:hover .btn-style1 a .arrow:after {background: #ffffff;}
.btn-style1 a .circle {position:absolute;z-index: 4;width: 20px;height: 20px;border-radius: 50%;background:#EE8833;top: calc(50% - 8px);right: 20px;}

.btn-style2 {display:inline-block;width:auto;height: 100%;position:relative;max-width:320px; overflow:hidden;border: 1px solid #c50d14; border-radius:2px;}
.btn-style2 a {display:block;width:100%;height: 100%;position: relative;padding: 15px 20px;text-align: center;background:#EE8833;text-align:center;}
.btn-style2 a p {font-size:0.95rem; color:#ffffff; position:relative; z-index:2}
.btn-style2 .white-box {width: 200%;height:100%;transform: skewX(-45deg) translateX(-110%);background: #ffffff;display:block;position: absolute;z-index: 1;top: 0;left: 0;}

@media all and (min-width:1024px) {
	.pc-hidden {display: none!important;}

	.btn-style1 .arrow, .btn-style1 .circle {transition: all 0.3s ease;}
   .btn-style1:hover a .arrow {right:20px}
   .btn-style1:hover a .circle {width:100%;height: 100%;top: 0;right: 0;border-radius: 0;}

   .btn-style2 a p, .btn-style2 .white-box {transition: all 0.7s ease;;}
   .btn-style2:hover a p {color:#EE8833;}
   .btn-style2:hover .white-box {transform:skewX(-45deg) translateX(-10%);}
}

@media all and (min-width:768px) and (max-width:1023px) {
	.tablet-hidden {display: none!important;}
}

@media all and (max-width:767px) { 
	.mobile-hidden {display: none!important;}
    .btn-style1 a { padding: 15px 20px 15px 20px; margin-left: 6em;}
    .btn-style1 a .txt {color:#333333; margin-right: 25px; padding-top: -5px;}
    .btn-style1 a .arrow {top: 75%;}
    .btn-style1 a .circle {top: calc(75% - 10px);}

    .business-article:hover .btn-style1 a {margin-left: 5em;}
    .business-article:hover .btn-style1 a .txt {color:#333333;}
    .business-article:hover .btn-style1 a .arrow {background:#999999;}
    .business-article:hover .btn-style1 a .arrow:after {background: #999999;}

}

@media all and (min-width:1520px) {
}

@media all and (min-width:1200px) and (max-width:1519px) {
}

@media all and (min-width:1024px) and (max-width:1199px){
}
@media all and (min-width:768px) and (max-width:1023px) {
}

@media all and (max-width:767px) { 
}

#header {width: 100%;height: 90px;position: absolute;z-index: 9000;border-bottom: 1px solid rgba(255,255,255,0.25);top: 0;left: 0;}
.hd-container {width: 100%; height: 100%; position: relative;}
.hd-container:after {content:"";display:block;width:25%;height:90px;background:#f4f4f4;position:absolute;top: -2px;left:-45px;transform: skewX(45deg);opacity:0;}
.hd-wr {width: 90%;height: 100%;margin: 0 auto;position: relative;display: flex;flex-wrap:nowrap;z-index: 9999;justify-content: space-between;}
.hd-logo {width: 200px;height:100%;padding-top: 9px;}
.hd-logo a img { height: 72px;}
.gnb-box {width: calc(100% - 400px);height:100%;text-align:center;}
.hd-lang-box {width:240px;height: 100%;padding-top: 24px;}

.gnb {display: flex; width: auto; height:100%; justify-content:flex-start;}
.gnb>li {display:block; width:auto; height: 100%;position:relative;}
.gnb>li:first-child {margin-left: 250px;}
.gnb>li>a {display: block;width:auto;height:100%;font-size:18px;padding: 30px 60px 0;color: #ffffff;z-index: 10000;position: relative;}
.gnb>li:hover>a {background: #ffffff; color: #EE8833;}
.gnb>li.now:before {content: "";display:block;width:50%;height: 4px;background:#EE8833;position:absolute;bottom: -1px;left:50%;transform: translateX(-50%);z-index: 9999;}
.gnb>li.now>a {color: #EE8833!important;}
.gnb .sub-nav {display:none;width:100%;height:auto;background: #ffffff;position:absolute;top: 0;left:0;padding: 90px 5px 20px;z-index: 9999;}
.gnb>li:hover .sub-nav {box-shadow: 2px 2px 10px rgba(0,0,0,0.25);}
.gnb .sub-nav li {display: block; width:auto; height:auto; padding:5px 0;}
.gnb .sub-nav li a {display:block;width:auto;height:auto;padding: 4px;font-size: 16px;color:#777777;border-bottom: 1px solid #ffffff;transition: all 0.3s ease;word-break: keep-all;}
.gnb .sub-nav li a:hover {color:#EE8833; border-bottom: 1px solid #EE8833;}

.hd-lang-box ul {display: block;width: 100%;height:auto;}
.hd-lang-box ul li {display:block;width: 33.33%;height:auto;float: left;text-align: center;}
.hd-lang-box ul li a {display:block;width:auto;height:auto;font-size: 16px;background:transparent;border-radius: 20px;padding: 6px 11px 7px; color:#ffffff;}
.hd-lang-box ul li.on a {background:#EE8833; color:#ffffff;}

.hd-hbg-box {padding-top: 29px;padding-left: 20px;display:block;position: absolute;top: 0;right: 0;}
.hbg-trg {display:block;width: 32px;height: 25px;position:relative;background: transparent;border: none;}
.hbg-trg .line1 {display:block;width:100%;height:3px;background: #ffffff;position: absolute;right:0;top: 0;}
.hbg-trg .line2 {display:block;width: 85%;height:3px;background: #ffffff;position: absolute;right:0;top: calc(50% - 2px);}
.hbg-trg .line3 {display:block;width:100%;height:3px;background: #ffffff;position: absolute;right:0;bottom: 0;}

.mobile-hd-lang-box {width:auto;height:auto;padding-top: 14px;position: absolute;top: 0;right: 60px;}
.mb-lang-btn {display:block; width: auto; height: auto; position: relative;}
.mb-lang-btn>a {display:inline-block;font-size: 15px;padding: 0 15px;background:#EE8833;color:#ffffff;height: 42px;line-height: 42px;}
.mb-lang-selector {display:none;width:100%;height: auto;position:absolute;top: 42px;left:0;background:#ffffff;padding: 3px 0;border: 1px solid #cccccc;border-top: 0;}
.mb-lang-selector li {display:block;}
.mb-lang-selector li a {display:block;padding: 5px 15px;font-size:14px;}

.hd-container:after,
.hd-container,
.hd-container .gnb>li>a,
.hd-container .hd-lang-box ul li a,
.hbg-trg span {transition: all 0.3s ease;}


.hd-container.on {background:#ffffff; border-bottom:1px solid #dddddd;}
.hd-container.on:after {opacity:1;}
.hd-container.on .gnb>li>a {color:#222222;}
.hd-container.on .gnb>li:hover>a {color:#EE8833;}
.hd-container.on .hd-lang-box ul li a {color:#222222;}
.hd-container.on .hd-lang-box ul li.on a {color:#ffffff;}
.hd-container:hover {background:#ffffff}
.hd-container:hover:after {opacity:1}
.hd-container:hover .gnb>li>a {color:#222222;}
.hd-container:hover .gnb>li:hover>a {color:#EE8833;}
.hd-container:hover .hd-lang-box ul li a {color:#222222;}
.hd-container:hover .hd-lang-box ul li.on a {color:#ffffff;}

.hd-container:hover .hbg-trg span {background: #888888;}
.hd-container.on .hbg-trg span {background: #888888;;}

.allNav-container {display: none;position: fixed;top: 0;right: 0;background: #ffffff;width: 100%;height: 100vh;padding: 5%;z-index: 10000;font-size: 13px;/* transform: translateX(100%); *//* opacity:0; transition: all 1s ease;*/overflow-y: auto;}
.allNav-container .hd-wrap {display:block;width:100%;height:auto;padding-bottom: 4%;margin-bottom: 4%;border-bottom:1px solid #dddddd;}
.allNav-container .logo {width: 25%;float:left;padding-top: 0px;}
.allNav-container .logo img {max-width:54px;}
.allNav-container .right-box {width: 75%;float: right;height: 100%;position: relative;}
.allNav-container .right-box .all-lang-btn {display:block;width:auto;height: 100%;float: left;}
.allNav-container .right-box .all-lang-btn a {display:inline-block;width: auto;padding: 9px 15px;background: #e42e26;border-radius:2px;color: #ffffff;}
.allNav-container .right-box .close-btn {float:left;padding: 0px 0 0 8px;position: absolute;top: 0;right: 0;}
.allNav-container .right-box .allnav-close {display: block;width: 30px;height: 30px;position:relative;cursor:pointer;background:#f4f4f4;border: 1px solid #bbbbbb;}
.allNav-container .right-box .allnav-close .line1 {width: 100%;height: 2px;background: #777777;position:absolute;top: 42%;left:0;transform:rotate(45deg);}
.allNav-container .right-box .allnav-close .line2 {width: 100%;height: 2px;background: #777777;position:absolute;top: 42%;left:0;transform:rotate(-45deg);}

.allNav-container .center-wrap {display:block; width:100%;}
.allNav {display:block; width:100%; height:auto;}
.allNav>li {display:inline-block;width:100%;height: auto;padding-bottom: 10px;border-bottom: 1px solid #dddddd;margin-bottom: 10px;}
.allNav>li>a {display: block;width: 100%;float: left;font-size: 1.25em;word-break: keep-all;FONT-WEIGHT: 500; padding-bottom: 10px;}
.allNav li .sub-nav {display: flex;width: 100%;float: left;flex-wrap: wrap;}
.allNav li .sub-nav li {display:block;width:50%;padding: 1%;float:left;}
.allNav li .sub-nav a {font-size: 1em;background: #f9f9f9;display: block;width: 100%;height: 100%;border: 1px solid #eeeeee;text-align: center;word-break: keep-all;display: flex;justify-content: center;align-items: center;padding: 5%;}


.allNav-container.allnav-on {transform: translate(0);}


@media all and (min-width:1520px) {
   
}

@media all and (min-width:1200px) and (max-width:1519px) {
    .hd-logo { width: 150px; }
    .gnb>li:first-child {margin-left: 100px;}
}

@media all and (min-width:1024px) and (max-width:1199px){
    .hd-logo { width: 150px; }
    .gnb>li:first-child {margin-left: 20px;}
}
@media all and (min-width:768px) and (max-width:1023px) {
   .hd-lang-box {position:absolute; top:0; right: 60px;}
}

@media all and (max-width:767px) {
	#header {height: 70px;}
	.hd-container:after {display:none;}
	.hd-logo {width: 130px;padding-top: 8px;}
	.hd-logo a img {height: 54px;}
	.hd-hbg-box {padding-top: 22px;}
    .mobile-hd-lang-box {right: 52px; top:2px;}
    .mb-lang-btn > a {font-size: 12px; padding: 0 12px; height: 36px; line-height: 36px;} 
    .mb-lang-selector {top:36px;}
}


#footer {width:100%;height:auto;background:#222222;position: relative;z-index: 100;}
.ft-container {width:90%;height: 100%;padding:60px 0;margin: 0 auto;}
.ft-top-wr {padding-bottom:15px;margin-bottom:15px;border-bottom: 1px solid #555555;position: relative;}
.ft-logo-box {width:200px;float: left;}
.ft-link-box {width:calc(100% - 410px);float: left;padding-top: 5px;}
.ft-family-box {width:210px;position: absolute;bottom: 25px;right: 0;}

.ft-link-box ul {display: block; width: auto; height: auto;}
.ft-link-box ul li{display: block;width: auto;height: auto;float: left;margin: 0 30px;}
.ft-link-box ul li a {font-size: 15px; color:#eeeeee; z-index: 2; line-height: 48px;}
#footer .family-site {display: block; width: 100%; height: auto; position: relative;}
#footer .family-site > a {display: block;padding: 0 25px;position: relative;border: 1px solid #666666;height: 50px;line-height: 50px;}
#footer .family-site > a .txt {font-size: 15px; color:#eeeeee;}
#footer .family-site > a .plus {font-size:15px;color:#eeeeee;position: absolute;top: 50%;right: 25px;transform: translateY(-50%);}
#footer .family-site-selector {position:absolute;bottom: 50px;left:0;padding:20px 25px;background:#eeeeee;width:100%;height:auto; display:none;}
#footer .family-site-selector li {display:block;}
#footer .family-site-selector li a {display:block;padding:3px 0;font-size:15px;color: #666666;border-bottom: 1px solid #eeeeee;}
#footer .family-site-selector li a:hover {color:#EE8833; border-bottom:1px solid #EE8833;}

.ft-address-box {margin-bottom:10px;}
.ft-address-box span {font-size:15px; color:#999999; margin-right:30px;}
.ft-address-box span b {color:#eeeeee; font-weight: inherit;}
.ft-copyright-box { padding-bottom: 10px; }
.ft-copyright-box span {color:#eeeeee; letter-spacing: 0px;}


#mail_pop{position:fixed; width:100%; height:100%; top:0; left:0; display:none; z-index:9999; background: rgba(0,0,0,0.5);}
#mail_pop .no_mail{
	width:900px; 
	height:495px; 
	position:absolute; 
	top:50%; left:50%; 
	border:2px solid #ff5353; 
	margin-left: -450px;
    margin-top: -275.5px;	
}
.pop_content {
    background-color: #f6f6f6;
    text-align: center;
    font-size: 16px;
    line-height: 26px;
    height: 100%;
    box-sizing: border-box;
    padding: 85px 30px;
}
.pop_content strong{    
	display: block;
    font-size: 20px;
    line-height: 1;
    margin-bottom: 18px;
    padding-top: 180px;
	background:url(/img/ico_mail.png) no-repeat 50% 0;
	
    line-height:1.4
}
.pop_content .small_txt {
    display: block;
    padding-top: 12px;
    font-size: 14px;
    color: #ff5353;
}
.pop_open .pop_close{
	position: absolute;
    right: 0;
    top: 0;
    width: 60px;
    height: 60px;
	background:url(/img/close_btn.png) no-repeat center;
    font-size: 0;
    text-indent: -9999%;
	display:block;
}


#footer.footer-section-main {height: 260px;transition: all 0.6s ease;position: relative;}
#footer.footer-section-main.active {transform: translateY(-260px)}
.section2 {transition: all 0.6s ease;}
.section2.footer-active {transform: translateY(-260px)}

@media all and (min-width:1520px) {
}

@media all and (min-width:1200px) and (max-width:1519px) {
}

@media all and (min-width:1024px) and (max-width:1199px){
}
@media all and (min-width:768px) and (max-width:1023px) {
}

@media all and (max-width:767px) {
	#footer.footer-section-main {height: auto;}
    .ft-container {padding: 7% 0;}
    .ft-logo-box {width:100%;float:none;height: 50px;padding-top: 7px;}
    .ft-logo-box img {width:auto;}
    .ft-link-box {width:100%;float:none;padding-top: 10px;}
    .ft-family-box {bottom:auto;top: 0px;width: 50%;}
    #footer .family-site > a {height: 40px; line-height:40px; font-size:13px;}
    .ft-link-box ul li {width: 48%;margin: 1% 1%;}
    .ft-link-box ul li a {display:block;width:100%;height:100%;font-size:12px;padding: 9px 15px;border: 1px solid #555555;}
    .ft-link-box ul li:nth-child(3) a {font-size: 11px;}
    .ft-top-wr {margin-bottom:20px; padding-bottom: 20px;}
    .ft-address-box span {display:inline-block; font-size: 14px;}
    #footer .family-site-selector {bottom: 40px;}
    .ft-bottom-wr {width: 100%;}
    .ft-container #top_btn {bottom: 20px; right:20px;}
}