@charset 'utf-8';

/* °ψΕλ */
.ub{font-family: 'Ubuntu', sans-serif;}
body * {line-height:1.2em}


/* privacy */
.privacy { color:#666; width: 100%; overflow: hidden; box-sizing:border-box; padding:20px; font-size:15px;	line-height: 140%; word-break:break-all; }
.privacy h2 { font-size:18px; font-weight:bold; color:#000; text-align: left; margin:50px 0 30px; }
.privacy h2:first-child { margin-top: 0; }
.privacy > p { margin:15px 0; }
.privacy > p+dl { margin-top: 30px; }
.privacy > dl { padding-bottom:20px;}
.privacy > dl > dt{ font-size:15px;color:#3680b9;font-weight:700;padding-bottom:5px;}
.privacy > dl > dd{ padding-bottom:10px;text-align:justify; font-size:15px; line-height:140%;}
.privacy > dl > dd ul{ padding:10px; }
.privacy > dl > dd ul li{ line-height:120%; margin-top: 10px; }
.privacy > dl > dd ul li:first-child { margin-top: 0; }
.privacy > dl > dd ul li p { margin:0 10px 5px; line-height: 140%; }
.sTxt h3 { font-size:16px; color: #333; font-weight: 700; margin: 20px 0 10px; }
.sTxt p { margin-top: 10px; }
.sTxt dt { margin-top: 10px; }
.sTxt dd { margin:0 8px; }


/* -------- header -------- */
.header{position:fixed; top: 0; left: 0; width: 100%; display:flex; align-items:center; justify-content:center; box-sizing:border-box; transition:0.3s; z-index: 300; border-bottom: 1px solid #ffffff20;}
.header::after{content:""; position:absolute; top: 100px; right: 99px; width: 1px; height: 100vh; background: #ffffff20; transition:0.3s 0.1s} 
.header .logo{position: absolute; left: 70px; width: 147px; height: 51px; background:url(/img/common/logo.png) 50% 50% no-repeat; background-size:cover; cursor: pointer; transition:0.3s; z-index: 20;}
.header .logo a{position:absolute; top: 0; right: 0; bottom: 0; left: 0;}
.header .gnb{width: 100%}
.header .gnb .xi-angle-down-min{display:none; }
.header .gnb > ul{ display:flex; justify-content:center}
.header .gnb > ul > li{}
.header .gnb > ul > li > a{display:inline-block; vertical-align: top; font-size:16px; letter-spacing:-0.015em; color: #fff; line-height: 100px; padding: 0 60px; transition:0.3s}
.header .gnb > ul > li > ul{position:absolute; left: 0; width: 100%; background: #fff; display:none; text-align: center;}
.header .gnb > ul > li > ul > li{display:inline-block; vertical-align: top;}
.header .gnb > ul > li > ul > li > a{display:inline-block; vertical-align: top;font-size:16px; color: #555; padding: 25px 40px; }
.header .gnb > ul > li.w100{}
.header .gnb > ul > li.w100 > ul{position:absolute; top: 100px; left: 0; display:none; height: 191px; box-sizing:border-box; padding-top: 42px; overflow: hidden; text-align: left;}
.header .gnb > ul > li.w100 > ul::before{content:""; position:absolute; top: 0; left: 0; bottom: 0; width: 100%; background: #f5f5f5;}
.header .gnb > ul > li.w100 > ul > li{display:inline-block; vertical-align: top; width: 100%;}
.header .gnb > ul > li.w100 > ul > li > a{position:relative; width: 100%;  max-width:423px; font-family: 'Ubuntu', sans-serif; font-size:20px; font-weight:500; color: #333; line-height:1.3em; padding: 8px 0; background: #f5f5f5; z-index: 10; margin-left: 260px; opacity: 0.5; transition:opacity 0.3s; text-transform: uppercase;}
.header .gnb > ul > li.w100 > ul > li > a::before{content:""; display:inline-block; position:relative; top: -5px; width: 0; height: 2px; background: #00c73c; margin-right: 15px; transition:0.3s}
.header .gnb > ul > li.w100 > ul > li:last-of-type > a{margin-bottom:0;}
.header .gnb > ul > li.w100 > ul > li > .depth01{position:absolute; top: 0; left: 683px; width: 100%; padding: 42px 0 50px; display:inline-block; vertical-align: top; background: #fff; padding-left: 80px; box-sizing:border-box;  opacity: 0;}
.header .gnb > ul > li.w100 > ul > li > .depth01:last-of-type{z-index: -1; height: 191px;}

.header .gnb > ul > li.w100 > ul > li > .depth01 > li{display:inline-block; vertical-align: top; margin-right: 80px; }
.header .gnb > ul > li.w100 > ul > li > .depth01 > li:last-of-type{margin-right: 0;}
.header .gnb > ul > li.w100 > ul > li > .depth01 > li > ul{}
.header .gnb > ul > li.w100 > ul > li > .depth01 > li > ul > li{margin-bottom:7px;}
.header .gnb > ul > li.w100 > ul > li > .depth01 > li > ul > li:last-of-type{margin-bottom:0;}
.header .gnb > ul > li.w100 > ul > li > .depth01 > li > ul > li > a{position:relative; display:inline-block; vertical-align: top; font-family: 'Ubuntu', sans-serif; font-size:16px; color: #555; padding: 8px 30px 8px 0; width: 294px; box-sizing:border-box; text-transform: uppercase; }
.header .gnb > ul > li.w100 > ul > li > .depth01 > li > ul > li > a::after{content:""; position:absolute; bottom: 0; left: 0; width: 0; height: 1px; background: #00c73c; transition:0.3s}
.header .gnb > ul > li.w100 > ul > li > .depth01 > li > ul > li > a i{position:absolute; top: 50%; transform:translateY(-50%); right: 0;}
.header .lang{position:absolute; right: 0; width: 100px; border-left:1px solid #ffffff20; box-sizing:border-box;  transition:0.3s; z-index: 20;}
.header .lang::before{content:""; position:absolute; bottom: -4px; left: -1px; width: 1px; height: 7px; background: #fff;}
.header .lang::after{content:""; position:absolute; bottom: -1px; left: -4px; width: 7px; height: 1px; background: #fff;}
.header .lang a{display:inline-block; width: 100%; line-height: 100px; text-align: center; font-family: 'Ubuntu', sans-serif; font-weight: 300; font-size:14px; color: #fff; opacity: 0.7; transition:0.3s}
.header .m_btn{display:none; position:relative; vertical-align:top; cursor: pointer; transition:0.3s; z-index: 20;}
.header .m_btn span{position:relative; display:inline-block; vertical-align: top; width: 30px; height: 2px; background: #fff; margin: 9px 0; transition:0.3s}
.header .m_btn span::before{content:""; position:absolute; display:inline-block; top: 8px; left: 0; background: #fff; width: 30px; height: 2px; transition:0.3s}
.header .m_btn span::after{content:""; position:absolute; display:inline-block; top: -8px; left: 0; background: #fff; width: 30px; height: 2px; transition:0.3s}
.header .m_btn.on span{background: transparent;}
.header .m_btn.on span::before{top: 0; transform:rotate(-45deg);}
.header .m_btn.on span::after{top: 0; transform:rotate(45deg);}
.header .m_gnb{display:none; position:fixed; top: 0; right: -100%; width: 100%; height: 100%; max-width:500px; background: #fff; transition:0.3s}
.header .m_gnb > ul{margin-top:81px;  border-left: 1px solid #ddd; box-sizing:border-box; border-top: 1px solid #e5e5e5;}
.header .m_gnb > ul > li{}
.header .m_gnb > ul > li > a{position:relative; padding: 20px 30px; display:inline-block; vertical-align: top; width: 100%; font-weight:500; font-size:20px; color: #333;border-bottom: 1px solid #ddd; box-sizing:border-box; transition:0.3s}
.header .m_gnb > ul > li > a i{position:absolute; right: 16px;}
.header .m_gnb > ul > li > ul{display:none; border-bottom: 1px solid #ddd; padding: 12px 0;}
.header .m_gnb > ul > li > ul > li{}
.header .m_gnb > ul > li > ul > li > a{position:relative; width: 100%; font-size:16px; display:inline-block; vertical-align: top; padding: 14px 30px; color: #333; box-sizing:border-box;}
.header .m_gnb > ul > li > ul > li > a i{position:absolute; right: 16px;}
.header .m_gnb > ul > li > ul > li > ul{display:none; border-bottom: 1px solid #ddd;}
.header .m_gnb > ul > li > ul > li > ul > li{}
.header .m_gnb > ul > li > ul > li > ul > li a{display:inline-block; width: 100%; vertical-align: top; padding: 14px 50px; color: #333; font-size:16px; box-sizing:border-box;}
.header .m_gnb > ul > li > ul > li > ul > li a i{display:none; }
.header .m_gnb > ul > li.w100 > ul{padding: 0; border-bottom: none;}
.header .m_gnb > ul > li.w100 a{text-transform: uppercase;}
.header .m_gnb > ul > li.w100 > ul > li > a{border-bottom: 1px solid #ddd; padding: 16px 30px;}
/* on */
.header.color,
.header.on{background: #fff;}
.header.color .logo,
.header.on .logo{background:url(/img/common/logo_c.png) 50% 50% no-repeat; background-size:cover}
.header.color .gnb > ul > li > a,
.header.on .gnb > ul > li > a{color: #333;}
.header.color .gnb > ul > li > ul,
.header.on .gnb > ul > li > ul{ border-top: 1px solid #e5e5e5;}
.header.color::after{background: #e5e5e5;}
.header.color .lang,
.header.on .lang{border-left: 1px solid #e5e5e5;}
.header.color .lang::after,
.header.color .lang::before{background: #999999;}
.header.on .lang::after,
.header.on .lang::before{display:none; }
.header.color .lang a,
.header.on .lang a{color: #333;}
.header .gnb > ul > li.w100 > ul > li.on02 .depth01{opacity: 1; z-index: 5;}
.header .gnb > ul > li.w100 > ul > li.on02 > a{opacity: 1;}
.header .gnb > ul > li.w100 > ul > li.on02 > a::before{width: 25px;}
/* m_gnb */
.header .m_gnb.on{right: 0;}
.header .m_gnb > ul > li > a.on{background: #00c73c; color: #fff;}
.header .m_gnb > ul > li.w100 > ul > li > a.on02{background: #038e2c; color: #fff;}
/* hover */
.header .gnb > ul > li.hover > a{background: #00c73c; color: #fff;}
.header .gnb > ul > li.w100 > ul > li > .depth01 > li > ul > li > a:hover{font-weight:500; color: #00c73c}
.header .gnb > ul > li.w100 > ul > li > .depth01 > li > ul > li > a:hover::after{width: 100%;}

/* -------- footer -------- */
.footer{position:relative; background: #151515; width: 100%; box-sizing:border-box; padding: 40px 70px 80px; font-size:0;}

.footer .f_logo{display:inline-block; vertical-align: top; width: 161px; height: 55px; background:url(/img/common/f_logo.png) 50% 50% no-repeat; background-size:cover}
.footer .box{display:inline-block; vertical-align: top; width: 360px; box-sizing:border-box; padding-left: 46px; font-size:0; margin-top:20px;}
.footer .box .copy{font-family: 'Ubuntu', sans-serif; font-size:14px; letter-spacing:-0.015em; color: #626262; margin-top: 22px;}
.footer .box .copy span{color: #00c73c;}
.footer .box ul{margin-bottom:30px;}
.footer .box ul li{display:inline-block; vertical-align: top; width: 50%;}
.footer .box ul li a{font-size:15px; letter-spacing:-0.015em; color: #aaa; font-weight:bold;}
.footer .box .info{}
.footer .box .info dl{margin-bottom:13px;}
.footer .box .info dl:last-of-type{margin-bottom:0;}
.footer .box .info dl.w50{display:inline-block; width: 50%;}
.footer .box .info dl dt{display:inline-block; vertical-align: top; font-family: 'Ubuntu', sans-serif; font-weight:300; font-size:15px; letter-spacing:-0.015em; color: #777; margin-right: 10px;}
.footer .box .info dl dd{display:inline-block; vertical-align: top; font-weight: 300; font-size:15px; letter-spacing:-0.015em; color: #aaa;}
.footer .f_nav{display:inline-block; vertical-align: top; width: calc(100% - 521px); text-align: right; box-sizing:border-box; padding-right: 130px; margin-top:20px;}
.footer .f_nav > ul{display:inline-block; vertical-align: top;}
.footer .f_nav > ul > li{display:inline-block; width: 74px; vertical-align: top; text-align: left; width: auto; margin-right: 50px;}
.footer .f_nav > ul > li > span{display:inline-block; vertical-align: top; width: 100%; font-size:15px; letter-spacing:-0.015em; color: #aaa;}
.footer .f_nav > ul > li > ul{margin-top:20px;}
.footer .f_nav > ul > li > ul > li{margin-bottom:16px;}
.footer .f_nav > ul > li > ul > li:last-of-type{margin-bottom:0;}
.footer .f_nav > ul > li > ul > li a{display:inline-block; font-weight:300; font-size:14px; color: #777; letter-spacing:-0.015em;}
.footer .f_nav > ul > li.w420{width: 100%; max-width:480px; margin-right: 0;}
.footer .f_nav > ul > li.w420 > ul > li{display:inline-block; vertical-align: top; width: 50%; box-sizing:border-box; padding-right: 26px;}
.footer .f_nav > ul > li.w420 > ul > li:nth-of-type(2n){padding-right: 0;}
.footer .f_nav > ul > li.w420 > ul > li a{font-family: 'Ubuntu', sans-serif;}
.footer .top_btn{position:absolute; top: 60px; right: 85px; text-align: center; cursor: pointer;}
.footer .top_btn .icon{margin-bottom:10px;}
.footer .top_btn .icon i{ font-size:15px; color: #9e9e9e;}
.footer .top_btn p{font-family: 'Ubuntu', sans-serif; font-weight:300; font-size:15px; color: #9e9e9e;}

.sns-box{position:absolute; top: 60px; right: 148px; }
.sns-box li:not(:last-child) { margin-bottom:15px; }
.sns-box li a { display:flex; align-items: center; justify-content: center; width:36px; height:36px; background:rgba(255, 255, 255, 0.10); border-radius:36px; transition: all 0.3s; }
.sns-box li a:hover { background:rgba(0, 199, 60, 1) }



@media screen and (max-height: 800px){
	.header::after{right: 79px; top: 80px;}
	.header .gnb{height: 80px;}
	.header .gnb > ul > li > a{line-height:80px}
	.header .lang{width: 80px;}
	.header .lang a{line-height:80px}
	.header .gnb > ul > li.w100 > ul{top: 80px;}

}

@media screen and (max-width:1740px){
	.footer .box{padding-left: 0; margin-top: 0;}
	.footer .f_logo{display:block; margin-bottom:40px;}
	.footer .f_nav{width: calc(100% - 360px); margin-top: 0; padding-right: 0;}
	
	.footer .box ul{margin-bottom:20px;}
	
	
	.sns-box ul { display:flex; }
	.sns-box li:not(:last-child) { margin:0 15px 0 0; }

}

@media screen and (max-width:1500px){
	.header .gnb > ul > li.w100 > ul > li > a{margin-left: 70px; max-width:350px;}
	.header .gnb > ul > li.w100 > ul > li > .depth01{left: 420px;}
	.header .gnb > ul > li > a{padding: 0 30px;}

	.footer{padding: 40px 16px 80px;}
	.footer .f_nav > ul > li{margin-right: 30px;}
	.footer .f_nav > ul > li.w420{max-width:434px;}
}


@media screen and (max-width:1220px){
	.footer .f_nav{text-align: left;}
	.footer .f_nav > ul > li.w420{width: auto; max-width:none; margin-right: 30px;}
	.footer .f_nav > ul > li.w420 > ul > li{display:block; width: auto; padding-right: 0;}
}


@media screen and (max-width:1200px){
	.header{background: #fff; border-bottom: 1px solid #e5e5e5;}
	.header::after{display:none; }
	.header::before{top: 80px; background: #e5e5e5; z-index: 10;}
	.header .logo{background:url(/img/common/logo_c.png) 50% 50% no-repeat; background-size:cover; left: 16px;}
	.header .gnb{height: 80px;}
	.header .gnb > ul{display:none; }
	.header .lang{width: 80px; right: 80px; border-left: 1px solid #e5e5e5;}
	.header .lang::after,
	.header .lang::before{display:none; }
	.header .lang a{line-height:80px; color: #333;}
	.header .m_btn{position:absolute; right: 0; display:block; width: 80px; text-align: center;border-left: 1px solid #e5e5e5; height: 80px; box-sizing:border-box; padding: 30px 0;}
	.header .m_btn span::before,
	.header .m_btn span::after,
	.header .m_btn span{background: #333;}
	.header .m_gnb{display:block; }

	
}

@media screen and (max-width:1000px){
	.footer{padding: 30px 16px 50px;}
	.footer .f_nav > ul{display:none; }
	.footer .box{width: 100%;}
	.footer .box ul li{width: auto; margin-right: 20px;}
	.footer .box ul li:last-of-type{margin-right: 0;}
	.footer .box .info dl.w50{width: auto; margin-right: 20px;}
	.footer .box .info dl.w50:last-of-type{margin-right: 0;}
	.footer .top_btn{right: 16px; bottom: 50px; top: auto;}

	.sns-box{ right: 16px; }

}