@charset 'utf-8';
/* ¸ð¹ÙÀÏ */
input[type="submit"],input[type="button"], input[type="file"],  input[type="text"], button { appearance: none; -moz-appearance: none; -webkit-appearance: none; border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0; }
input[type="checkbox"]{ padding: 0 !important;}
/* select */
select::-ms-expand { display: none; }
select { 
    -webkit-appearance: none; 
    -moz-appearance: none; 
    appearance: none;
     background: url(/img/sub/icon_select.png) no-repeat 93% 50%;
}

/* °øÅë */
body *{line-height: 1.3; word-break:keep-all}
figure{margin: 0;}
.clip {position: absolute; clip: rect(0,0,0,0); width: 1px; height: 1px;overflow: hidden;} 
.w1710{width: 100%; max-width: 1710px; margin: 0 auto; box-sizing:border-box}
.w1200{width: 100%; max-width: 1200px; box-sizing:border-box; margin: 0 auto;}
.w1400{width: 100%; max-width: 1400px; box-sizing:border-box; margin: 0 auto;}
/*.w1500{width: 100%; max-width: 1500px; margin: 0 auto; box-sizing:border-box}
.w1440{width: 100%; max-width: 1440px; box-sizing:border-box; margin: 0 auto;}
.w860{width: 100%; max-width: 860px; margin: 0 auto 0 0; box-sizing:border-box}
.tc{font-family: 'Noto Sans TC', sans-serif;}
.m{display:none; }
 */
/* privacy */
/* .privacy { color:#666; width: 100%; overflow: hidden; box-sizing:border-box; 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;} */

/* ÀÌ¿ë¾à°ü */
.service{padding: 200px 0;}
.service .scon .s_tit{ margin-bottom:50px;}
.service dl{margin-bottom:20px;}
.service dl dt{font-weight:bold; font-size:23px; color: #222; margin-bottom:10px;}
.service dl dd{}
.service dl dd p{font-size:16px; line-height: 1.6; color: #555; margin-bottom:10px;}
.service dl dd > ul{margin-left: 14px;}
.service dl dd > ul > li{font-size:16px; line-height: 1.6; color: #555; margin-bottom:10px;}
.service dl dd > ul > li:last-of-type{margin-bottom:0px;}
.service dl dd > ul > li > ul{margin-left: 14px; margin-top: 6px;}
.service dl dd > ul > li > ul > li{font-size:16px; line-height: 1.6; color: #555; margin-bottom:6px;}
.service dl dd > ul > li > ul > li:last-of-type{margin-bottom:0;}
.service .add_list{}
.service .add_list li{font-weight:500; font-size:18px; line-height: 1.6; color: #444;}


/* ÆäÀÌ¡ */
.paging {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-top: 70px;
}

.paging .arr {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.paging .arr a:not(:last-child) {
  margin-right: 5px;
}

.paging .arr a.last,
.paging .arr a.first {
  letter-spacing: -10px;
}

.paging .arr a.last i,
.paging .arr a.first i {
  -webkit-transform: translateX(-5px);
  transform: translateX(-5px); 
}

.paging a {
  width: 35px;
  height: 35px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  color: #222;
  border-radius:50%;
  font-weight:600;
  font-size:15px;
}
.paging a i{font-size:15px; color: #929398;}

.paging ul {
  margin: 0 5px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.paging ul li:not(:last-child) {
  margin-right: 5px;
}

.paging ul li.on a {
  color: #fff;
  background: #e60012;
  border-color: #e60012;
}



/* header
------------------------------------------------------ */
.header{position:fixed; top: 0; left: 0; width: 100%; display:flex; align-items:center; justify-content:space-between; box-sizing:border-box; padding: 0 50px 0 100px; z-index: 500; transition:0.3s}
.header .logo{position:relative; width: 108px; height: 34px; background:url(/img/common/new_logo2.png) 50% 50% no-repeat; background-size:cover; z-index: 100;}
.header .logo a{position:absolute; top: 0; left: 0; bottom: 0; right: 0} 
.header .gnb{margin-left: -100px;}
.header .gnb > ul{display:flex;}
.header .gnb > ul > li{position:relative; margin: 0 40px;}
.header .gnb > ul > li > a{position:relative; display:inline-block; vertical-align: top; font-weight:600; font-size:18px; color: #fff; padding: 0 50px; line-height: 100px; transition:0.3s}
.header .gnb > ul > li > a::after{content:''; position:absolute; bottom: 16px; left: 50%; transform:translateX(-50%); width: 7px; height: 7px; background: #ff0000; border-radius:50%; transition:0.3s; opacity: 0; z-index: 10;}
.header .gnb > ul > li > ul{display:none; position:absolute; top: 100px; left: 0; width: 100%; background: #fff; border-radius:10px; text-align: center; padding: 30px 0;}
.header .gnb > ul > li > ul > li{}
.header .gnb > ul > li > ul > li > a{display:inline-block; vertical-align: top; font-size:15px; color: #777777; font-weight:300; width: 100%; padding: 4px 0;}
/* .header .header_ui{width: 240px;} */
.header .header_ui{width: 70px;}
.header .header_ui .input_box{position:relative; width: 100%; height: 40px; margin-top: 32px; transition:0.3s}
.header .header_ui .input_box input{width: 100%; height: 40px; border:none; border-bottom: 1px solid #aaaaaa; padding: 0 10px; outline:none; font-size:16px; color: #222; font-family: 'Poppins', sans-serif; box-sizing:border-box; background: transparent;  transition:0.5s}
.header .header_ui .input_box input::placeholder{color: #aaa; letter-spacing:-0.025em; transition:0.3s}
.header .header_ui .input_box button{position:absolute; top: 50%; right: 0; width: 38px; height: 38px; background: #fff; border:none; font-size:21px; color: #333; transform:translateY(-50%); background: transparent; transition:0.3s}
.header .header_ui .m_btn{position:relative; display:none; width: 100px; text-align: center; z-index: 20;}
.header .header_ui .m_btn .icon{display:inline-block; vertical-align: top; position:relative; width: 55px; height: 55px; margin: 23px 0; cursor: pointer;}
.header .header_ui .m_btn .icon span{display:inline-block; position:relative; width: 24px; height: 2px; background: #222; margin: 27px 0 26px; transition:0.3s}
.header .header_ui .m_btn .icon span::after{content:''; position:absolute; top: -7px; right: 0; background: #222; height: 2px; width: 24px; transition:0.3s}
.header .header_ui .m_btn .icon span::before{content:''; position:absolute; top: 7px; left: 0; background: #222; height: 2px; width: 24px; transition:0.3s}
.header .m_gnb{display:none; position:fixed; top: 0; right: 0; width: 100%; height: 100vh; background: #222; z-index: 10;}
.header .m_gnb nav{display:flex; align-items:center; justify-content:center; height: 100%;}
.header .m_gnb nav > ul{text-align: center;}
.header .m_gnb nav > ul > li{}
.header .m_gnb nav > ul > li > a{display:inline-block; vertical-align: top; font-weight:bold; font-size:50px; color: #666; text-transform: uppercase;}
.header .m_gnb nav > ul > li > ul{display:none; }
.header .m_gnb nav > ul > li > ul > li{margin: 5px 0;	}
.header .m_gnb nav > ul > li > ul > li > a{display: inline-block; width: 100%; vertical-align: top; font-size: 18px; letter-spacing: 0.03em; color: #fff; padding: 13px 0; box-sizing: border-box;}
.header .m_gnb nav > ul > li.on > a{color: #fff;}

.header .gnb > ul > li:hover > a::after{opacity: 1;}
.header .gnb > ul > li > ul > li > a:hover{color: #ff0000;}
.header .header_ui .m_btn .icon:hover span::after{width: 12px;}
.header .header_ui .m_btn .icon:hover span::before{width: 12px;}
.header .header_ui .m_btn .icon.on span{background: transparent;}
.header .header_ui .m_btn .icon.on span::after{top: 0; transform:rotate(-45deg); background: #fff;}
.header .header_ui .m_btn .icon.on span::before{top: 0; transform:rotate(45deg); background: #fff;}
.header .header_ui .m_btn .icon.on:hover span::after{width: 24px;}
.header .header_ui .m_btn .icon.on:hover span::before{width: 24px;}

.header.sub .header_ui .input_box input{border-color:#fff}
.header.sub .header_ui .input_box input::placeholder{color: #fff;}
.header.sub .header_ui .input_box button{color: #fff;}

.header.up{top: -80px;}

.header.on,
.header.scroll{background: #fff;}
.header.on .gnb > ul > li > a,
.header.scroll .gnb > ul > li > a{color: #222; line-height: 80px;  text-shadow: 0px 0px 20px rgba(0, 0, 0, 0.2); }
.header.on .header_ui .input_box,
.header.scroll .header_ui .input_box{margin-top: 20px;}
.header.on .header_ui .input_box input,
.header.scroll.sub .header_ui .input_box input{border-color:#aaa}
.header.on .header_ui .input_box input::placeholder,
.header.scroll.sub .header_ui .input_box input::placeholder{color: #aaa;}
.header.on .header_ui .input_box button,
.header.scroll.sub .header_ui .input_box button{color: #333;}
.header.on .gnb > ul > li > ul,
.header.scroll .gnb > ul > li > ul{top: 80px; box-shadow:0px 0px 6px 1px #00000030; border-radius:15px}
.header.on .gnb > ul > li > a::after,
.header.scroll .gnb > ul > li > a::after{bottom: 12px;}


/* footer
------------------------------------------------------ */
.footer{position:relative; width: 100%; background: #222222; box-sizing:border-box; padding: 70px 100px 70px 0;}
.footer.sub{padding: 70px 0;}
.footer .top_btn{position:absolute; top: -60px; right: 0; width: 100px; height: 100px; background: #e60012; cursor: pointer; text-align: center;}
.footer .top_btn .icon{display:flex; align-items:center; justify-content:center; flex-direction:column; font-weight:500; font-size:12px; color: #fff; height: 100%;}
.footer .top_btn .icon p{margin-top: 6px;}
.footer > div:not(.top_btn) > div{margin-left: auto; margin-right: 0;}
.footer .top{display:flex; flex-wrap:wrap; justify-content:space-between; border-bottom: 1px solid #ffffff30;}
.footer .top .sns{display:flex;	margin-bottom:26px;}
.footer .top .sns dl{ margin-right: 56px;}
.footer .top .sns dl:last-of-type{margin-right: 0;}
.footer .top .sns dl dt{display:inline-block; vertical-align: top; position:relative; font-size:14px; color: #999; padding: 0 10px; margin-right: 16px;}
.footer .top .sns dl dt::before{content:''; position:absolute; top: 2px; left: 0; height: 14px; width: 1px; background: #fff; opacity: 0.2;}
.footer .top .sns dl dt::after{content:''; position:absolute; top: 2px; right: 0; height: 14px; width: 1px; background: #fff; opacity: 0.2;}
.footer .top .sns dl dd {display:inline-block; vertical-align: top; margin-right: 12px;}
.footer .top .sns dl dd:last-of-type{margin-right: 0;}
.footer .top .sns dl dd a{display:inline-block; vertical-align: middle; background-size:cover !important; transition:0.3s}
.footer .top .sns dl .icon01 a{width: 19px; height: 17px; background:url(/img/common/f_sns03.png) 50% 50% no-repeat;}
.footer .top .sns dl .icon02 a{width: 19px; height: 17px; background:url(/img/common/f_sns04.png) 50% 50% no-repeat;}
.footer .top .sns dl .icon03 a{width: 20px; height: 17px; background:url(/img/common/f_sns05.png) 50% 50% no-repeat;}
.footer .top .sns dl .icon04 a{width: 16px; height: 16px; background:url(/img/common/f_sns01.png) 50% 50% no-repeat;}
.footer .top .sns dl .icon05 a{width: 16px; height: 16px; background:url(/img/common/f_sns02.png) 50% 50% no-repeat;}
.footer .top .sns dl .icon01:hover a{background:url(/img/common/f_snsH03.png) 50% 50% no-repeat;}
.footer .top .sns dl .icon02:hover a{background:url(/img/common/f_snsH04.png) 50% 50% no-repeat;}
.footer .top .sns dl .icon03:hover a{background:url(/img/common/f_snsH05.png) 50% 50% no-repeat;}
.footer .top .sns dl .icon04:hover a{background:url(/img/common/f_snsH01.png) 50% 50% no-repeat;}
.footer .top .sns dl .icon05:hover a{background:url(/img/common/f_sns02H.png) 50% 50% no-repeat;}
.footer .top .link{display:flex;}
.footer .top .link li{ margin-right: 74px;}
.footer .top .link li:last-of-type{margin-right: 20px;}
.footer .top .link li a{font-weight:bold; font-size:16px; color: #999;}
.footer .top .link li a.c{color: #e60012;}
.footer .top .link li:hover a:not(.c){color: #fff;}
.footer .info{display:flex; flex-wrap:wrap; justify-content:space-between; margin-top: 84px;}
.footer .info .left{}
.footer .info .left p{font-family: 'Roboto', sans-serif; font-weight:500; font-size:14px; letter-spacing:0.025em; color: #777777; text-transform: uppercase; margin-top: 36px}
.footer .info .left h2{font-weight:bold; font-size:15px; color: #fff;}
.footer .info .left h2 img{margin-left: 26px; vertical-align: middle; margin-bottom:2px;}
.footer .info .left ul{display:flex; margin-top: 14px;}
.footer .info .left ul li{font-size:15px; color: #999999; margin-right: 60px;}
.footer .info .left ul li:last-of-type{margin-right: 0;}
.footer .info .left ul li.c{color: #fff;}
.footer .info .left ul li span{}
.footer .info .right{text-align: right;}
.footer .info .right .f_logo{width: 81px; height: 73px; background:url(/img/common/f_logo.png) 50% 50% no-repeat; background-size:cover; margin-right: 0; margin-left: auto;}
.footer .info .right .family{position:relative;width: 160px; height: 40px;  margin-top: 32px; text-align: left;}
.footer .info .right .family p{position:relative; width: 100%; height: 100%; font-family: 'SBAggroM'; font-weight:500; font-size:12px; color: #999; letter-spacing:0.01em; line-height: 40px; cursor: pointer;}
.footer .info .right .family p::after{content:''; position:absolute; bottom: 0; left: 0; width: 100%; height: 2px; background: rgb(237,107,0); background: linear-gradient(120deg, rgba(237,107,0,1) 0%, rgba(174,0,3,1) 100%);}
.footer .info .right .family p i{font-size:16px; position:absolute; top: 50%; right: 0; transform:translateY(-50%);}
.footer .info .right .family ul{display:none; position:absolute; bottom: 40px; left: 0; width: 100%; background: #222222; z-index: 20;}
.footer .info .right .family ul li{}
.footer .info .right .family ul li a{display:inline-block; width: 100%; height: 100%; font-family: 'SBAggroM'; font-weight:500; font-size:12px; color: #999; line-height: 30px;}
.footer .info .right .family ul li:hover a{color: #fff;}



@media screen and (max-width: 1900px){
	.header .gnb > ul > li{margin: 0;}
}
@media screen and (max-width: 1710px){
	.w1710{padding: 0 40px;}
	.header .gnb{width: calc(100% - 131px); margin-left: 0;}

}
@media screen and (max-width: 1500px){
	.w1710{padding: 0 40px;}
	.header{padding: 0 0 0 40px;}

	.footer .w1710 {padding: 0 0 0 40px;}
	.footer.sub .w1710{padding: 0 40px;}
}

@media screen and (max-width: 1400px){
	.w1400{padding: 0 40px;}
	.main .mv .career{width: 380px;}
	.header .gnb > ul > li > a{padding: 0 30px;}
}


@media screen and (max-width: 1200px){
	.w1200{padding: 0 16px;}
	.w1400{padding: 0 16px;}
	.header{padding: 0 0 0 16px; justify-content:space-between; background: #fff;}
	.header .gnb{display:none; }
/* 	.header .header_ui{display:flex; width: 340px;} */
	.header .header_ui{width: 70px;}
	.header .header_ui form{width: calc(100% - 70px);}
	.header .header_ui .input_box{width:100%;}
	.header .header_ui .m_btn{display:block; height: 70px; width: 70px;}
	.header .header_ui .m_btn .icon{margin: 8px 0;}
	.header.scroll .header_ui .input_box,
	.header .header_ui .input_box{margin-top: 17px;}


	.footer{padding: 40px 0;}
	.footer .w1710 {padding: 0 16px;}
	.footer.sub .w1710{padding: 0 16px;}
	.footer .top_btn{width: 60px; height: 60px; top: 0;}
	.footer .top{justify-content:center}
	.footer .info .left h2{margin-bottom:10px;}
	.footer .info{margin-top: 40px;}
	.footer .info .left{width: 100%; text-align: center;}
	.footer .info .left ul{justify-content:center; flex-wrap:wrap; margin-bottom:0; margin-top: 0;}
	.footer .info .left ul li{margin-right: 30px; margin-bottom:10px;}
	.footer .info .left p{margin-top: 16px;}
	.footer .info .right{display:flex; width: 100%; justify-content:center; margin-top: 30px;}
	.footer .info .right .f_logo{order:2; margin-left: 20px;}
	.footer .top .sns{width: 100%; margin-bottom:0px; order:2; margin-top: 10px; margin-bottom:40px; justify-content:center}*/


}

@media screen and (max-width: 800px){
	.header .m_gnb nav > ul > li > a{font-size:36px;}
	.header .m_gnb nav > ul > li > ul > li > a{padding: 5px 0;}


	.footer .top{flex-wrap:nowrap; justify-content:flex-start; align-items:center; padding-bottom:20px;}
	.footer .top .link{flex-direction:column;text-align: right;}
	.footer .top .link li:last-of-type,
	.footer .top .link li{margin-right: 0;}
	.footer .top .sns{flex-wrap:wrap; order:unset; margin-bottom:0px;margin-top: 0;}
	.footer .top .sns dl{width: 100%; margin-bottom:12px; margin-right: 0;}
	.footer .top .sns dl:last-of-type{margin-bottom:0;}
	.footer .info{margin-top: 0;}
	.footer .info .left{margin-top: 20px; text-align: left;}
	.footer .info .left ul{justify-content:flex-start;}
	.footer .info .right{justify-content:flex-end;}
	
	.service{padding: 100px 0;}
	.service .scon .s_tit{margin-bottom:25px;}
	.service dl dd > ul{margin-left: 0;}
}