@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Prompt:wght@100;200;300;400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Marcellus&display=swap');
/*@import url('https://fonts.googleapis.com/css2?family=Titillium+Web:wght@200;300;400;600;700;900&display=swap');*/


html,body{width:100%; min-height:100%; background-color: #fff; -webkit-text-size-adjust:none; word-break: keep-all; position:relative; padding: 0; font-size: 0.625em; box-sizing: border-box;}
input,button,textarea{}
input[type=submit],input[type=image],input[type=button],button,a{cursor: pointer; text-decoration: none;}
img,video,audio,object,embed,iframe{max-width:100%;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td,legend{margin:0;padding:0}
fieldset,img,abbr,acronym{border:none}
fieldset{display:block}
ol,ul{list-style:none outside}
h1,h2,h3,h4,h5,h6,address,caption,cite,code,dfn,em,th,var{font-size:100%;font-weight:normal}

hr,legend,caption,hr{visibility:hidden;overflow:hidden;position:absolute;top:0;left:0;width:0;height:0;margin:0;padding:0;font-size:0;line-height:0;text-indent:-1000em}


img{
	image-rendering: -moz-crisp-edges; /* Firefox */
	image-rendering: -o-crisp-edges; /* Opera */
	image-rendering: -webkit-optimize-contrast;/* Webkit (non-standard naming) */
	image-rendering: crisp-edges;
}


* {margin:0; padding:0; list-style:none; text-decoration:none; box-sizing: border-box; }
body,th,td,input,select,textarea,h2,h3,h4,h5,address,code{font-family: 'Noto Sans KR', serif; font-style:normal; font-weight:normal; font-size:1rem; line-height:1.6; color:#666; }

ul>li>a { text-decoration:none; }
a {color: #333; text-decoration: none;}
table { border-collapse: collapse; }
textarea {box-sizing: border-box; resize: none;}
select {-webkit-border-radius: 0; -moz-appearance: none; appearance: none; box-sizing: border-box; cursor: pointer;}
input,select,textarea,strong,em,p,h1,h2,h3,h4,span,td,button,th,li,a,i,b {font-style:normal; margin: 0; }
ul { margin: 0;padding: 0;list-style: none;}
img {max-width:100%;}
button {cursor: pointer;}
.clear:after {content: ""; display: block; clear: both;}
html.scrollHidden,
body.scrollHidden {
	overflow: hidden !important;
}
.wrap1460 {max-width: 1480px; width: 100%; padding: 0 10px; margin: 0 auto;}
.wrap1280 {max-width: 1300px; width: 100%; padding: 0 10px; margin: 0 auto;}
.wrap950 {max-width: 950px; width: 100%; padding: 0 10px; margin: 0 auto;}

/********************************************/
#hd {position: relative;}
.sound_only,
#hd_h1,
#skip_to_container,
#hd_login_msg {display: none;}



/* header */



header { width: 100%; height: 11rem; position: absolute; top:0; z-index: 200; transition: .3s ease;}
.header_wrap {max-width: 146rem; width: 100%; padding: 0 10px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; height: 100%;}
.header_logo {font-size: 0;}
.logo {position: relative; display: inline-block; width: 21.4rem; height: 6.7rem;}
.logo a {position: absolute; width: 100%; height: 100%; background: url('/img/hd_logo.png') no-repeat; opacity: 1; background-position: center !important; background-size: contain !important; text-indent: -9999px; transition: .3s ease; }
.logo a:nth-of-type(1) {background: url('/img/hd_hover_logo.png') no-repeat; opacity: 0;}

.header_wrap .gnb {height: 100%;  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 3;}
.header_wrap .gnb_list {display: flex;  height: 100%; position: relative;}
.header_wrap .gnb_list > li {height: 100%; position: relative; width: 14rem;}
.header_wrap .gnb_list > li > a {display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; text-align: center;}
.header_wrap .gnb_list > li > a span {position: relative; font-size: 1.7rem; font-weight: 500; color: #fff; line-height: 1.9rem;}



.header_wrap .nav__depth2 {display: none; position: absolute; top: 100%; width: 100%; left: 0; z-index: 3;text-align: center; height: 250px; padding: 3rem 0 0;}
.header_wrap .nav__depth2 li a {display: block; padding: 1rem 0; }
.header_wrap .nav__depth2 li a span { display: inline-block; font-size: 1.5rem; font-weight: 400; color: #888888; transition: color .3s ease;line-height: 1.9rem;}



/* 로그인 조인 */
.headerside {position: relative;}
.headerside_wrap {display: flex; position: absolute; top: 50%; right: 7rem; transform: translateY(-50%);}
.headerside_wrap ul {display: flex;}
.headerside_wrap ul li {position: relative;}
.headerside_wrap ul li:first-of-type::after {content: ""; position: absolute; top: 50%; transform: translateY(-50%); right: 0; width: 1px; height: 1rem; background: #eeeeee;}
.headerside_wrap ul li a {padding: 1rem; color: #fff; font-weight: 400; font-size: 1.6rem;}
.header:hover .headerside_wrap ul li a:hover {color: #bb9632;}


/* 햄버거 */
.hamburger_wrap { cursor: pointer;  }
.nav_icon4 {width: 3rem; height: 3rem; display: flex; flex-wrap: wrap; justify-content: space-between; align-content: space-between; transition: .3s ease; }
.nav_icon4 span {width: 1rem; height: 1rem; border-radius: 50%; background: #fff;  margin: 0 1rem 0 0;}
.nav_icon4 span:nth-child(2n) { margin: 0;}


/* 햄버거 네브 */

.nav_bg {display: none; position: absolute; top: 100%; width: 100% ;  height: 250px; background: #fbfbfb; left: 0; z-index: 1; border-top: 1px solid #eee;}


.header.all {background: #fff;}
.header.all .logo a:nth-of-type(1) {opacity: 1;}
.header.all .logo a:nth-of-type(2) {opacity: 0;}
.header.all .header_wrap .gnb_list > li > a span {color: #1b1b1b;}
.header.all .headerside_wrap ul li a {color: #666666;}
.header.all .nav_icon4 span {background: #23408f;}

.header .nav_icon4.open span:nth-child(2) { background-color: #bb9632;}
.header .nav_icon4.open {transform: rotate(-45deg);}


.header.scrolled {background: #fff; box-shadow: 1px 3px 30px 0 rgba(0,0,0,0.3);}
.header.scrolled .logo a:nth-of-type(1) {opacity: 1;}
.header.scrolled .logo a:nth-of-type(2) {opacity: 0;}
.header.scrolled .header_wrap .gnb_list > li > a span {color: #1b1b1b;}
.header.scrolled .headerside_wrap ul li a {color: #666666;}
.header.scrolled .nav_icon4 span {background: #23408f;}


.header.all .header_wrap .gnb_list > li > .navItem__link.on span {color: #ec1f3e;}

@media screen and (min-width: 1025px) {


	.header_wrap .gnb_list > li:hover > a {background: #39539a;}
	.header_wrap .gnb_list > li:hover > a span {color: #fff; }
	.header.all .header_wrap .gnb_list > li:hover > a span {color: #fff;}

	.header.all .header_wrap .gnb_list > li:hover .nav__depth2 {background: #bb9632;}
	.header.all .header_wrap .gnb_list > li:hover .nav__depth2 li a span {color: #fff;}



}


.sub #header,
#sub_head{background-color: #fff; border-bottom:1px solid #6e7a86;}

.sub #header .pcMenu,
#sub_head .pcMenu{padding-top:2.5rem;}

.sub #header .pcMenu .mMenu,
#sub_head .pcMenu .mMenu{margin-left: 2.1rem; display:block;}

.sub #header .pcMenu:before{content: ""; width:38rem; height:8.5rem; background-color: #fff; display: inline-block; position:absolute; left: 0; top:0; z-index:2;}
.sub #header .pcMenu .pc_menu,
#sub_head .pcMenu .pc_menu{position: absolute; left:0rem; top:112px; z-index:0;}

.sub #header .pcMenu .pc_menu.en,
#sub_head .pcMenu .pc_menu.en{top:128px;}

.sub #header h1,
#sub_head h1{padding:2.2rem 0 2.4rem;}
.sub #header h1 img,
#sub_head h1 img{height:4rem;}

.sub #header .language>a,
#sub_head .language>a{color: #8e979d;}

.sub #header .language>a:before,
#sub_head .language>a:before{background-color: #003976;}

.sub #header .language>a:hover,
#sub_head .language>a:hover,
.sub #header .language>a.active,
#sub_head .language>a.active{color: #003976;}

.sub #header .language,
#sub_head .language{margin-top:2.4rem;}

.sub #header .pcMenu .mMenu>p,
#sub_head .pcMenu .mMenu>p{color: #003976;}

.sub #header .pcMenu .mMenu>span,
.sub #header .pcMenu .mMenu:before,
.sub #header .pcMenu .mMenu:after,
#sub_head .pcMenu .mMenu>span,
#sub_head .pcMenu .mMenu:before,
#sub_head .pcMenu .mMenu:after{background-color: #003976;}


#sub_head{width:100%; background-color: #fff; font-size:0; line-height:0; text-align: center; position: fixed; left:0; top:0; z-index:6;}

#sub_head .pc_menu>li{opacity:1;}
#sub_head .pc_menu>li:before{background-color: #003976;}
#sub_head .pc_menu>li>a{color: #8e979d;}

#sub_head .pc_menu .gnbSub>li{opacity:1;}
#sub_head .pc_menu .gnbSub>li>a{color: #8e979d;}

#sub_head .pc_menu>li:hover>a,
#sub_head .pc_menu>li.active>a,
#sub_head .pc_menu>li.oPage>a{color: #003976;}

#sub_head .pc_menu>li .gnbSub>li:hover>a,
#sub_head .pc_menu>li .gnbSub>li.active>a,
#sub_head .pc_menu>li .gnbSub>li.oPage>a{color: #003976;}


#sVisual{width:100%; background-repeat: no-repeat; background-position: center top; background-size: cover; font-size:0; line-height:0; overflow:hidden; position: relative; z-index:7;}
#sVisual .inConts{height:56rem; display:table; margin: 0 auto;}
#sVisual h2{padding:3rem 0 0; text-align: center; display:table-cell; vertical-align: middle; text-shadow:0px 2px 5px rgba(0,0,0,0.3);}
#sVisual h2>strong{font-weight:bold; font-size:4.5rem; text-align: center; line-height:1; color: #fff; display:inline-block; vertical-align: top; position: relative; text-transform : uppercase;}
#sVisual h2>p{padding-top:3rem; font-weight:400; font-size:2.2rem; line-height:1; color: #fff; text-transform : uppercase;}

#sVisual.bg01{background: url("/img/img_sVisual_01.jpg") no-repeat center; background-size: cover;}
#sVisual.bg02{background: url("/img/img_sVisual_01.jpg") no-repeat center; background-size: cover;}
#sVisual.bg03{background: url("/img/img_sVisual_03.jpg") no-repeat center; background-size: cover;}
#sVisual.bg04{background: url("/img/img_sVisual_04.jpg") no-repeat center; background-size: cover;}
#sVisual.bg05{background: url("/img/img_sVisual_05.jpg") no-repeat center; background-size: cover;}
#sVisual.bg06{background: url("/img/img_sVisual_06.jpg") no-repeat center; background-size: cover;}
#sVisual.bg07{background: url("/img/img_sVisual_01.jpg") no-repeat center; background-size: cover;}

#sVisual.bg10{background: url("/img/img_sVisual_06.jpg") no-repeat center; background-size: cover;}

#sVisual.bg11{background-image:url("https://lsmetal.biz/common/css/../../images/img_sVisual11.jpg");}
#sVisual.bg12,
#sVisual.bg13{background-image:url("https://lsmetal.biz/common/css/../../images/img_sVisual_01.jpg");}

#snb {width:100%; background-color: #fff; border-bottom:1px solid rgba(191,191,191,0.6); font-size:0; line-height:0; position: relative; z-index:6; }
/*#snb{width:100%; background-color: #fff; border-bottom:1px solid rgba(191,191,191,0.6); font-size:0; line-height:0; position: relative; z-index:6;}*/
#snb #nav{max-width:1280px; margin:0 auto;  border-left:1px solid rgba(191,191,191,0.6); box-sizing:border-box;}
#snb #nav>li{min-width:240px; border-right:1px solid rgba(191,191,191,0.6); display:inline-block; vertical-align:top; position:relative; box-sizing:border-box;}
#snb #nav>li>a{width:100%; height:49px; padding:0 50px 0 20px; font-weight: 300; font-size:15px; line-height:1.2; color:#666; display:table; position: relative; box-sizing:border-box;}
#snb #nav>li>a>span{padding:5px 0; display:table-cell; vertical-align: middle;}

#snb #nav>li>a i{width:15px; height:10px; margin-top:-5px; position: absolute; right:20px; top:50%; display:inline-block;}
#snb #nav>li>a i:after,
#snb #nav>li>a i:before{content: ""; width:10px; height: 2px; margin:0 0 0 0; background-color: #333; display: block; position:absolute; top:50%;}
#snb #nav>li>a i:after{right:6px; transform:rotate(45deg);}
#snb #nav>li>a i:before{right:0px; transform:rotate(-45deg);}

#snb #nav>li.home{width:61px; min-width:60px;}
#snb #nav>li.home>a{width:60px; height:49px; padding:0; background:url("/img/icon_home.gif") no-repeat center center; font-size:0; line-height:0;}
#snb #nav>li.home>a:before{content: ""; display:none;}

#snb #nav>li:last-child>a{font-weight: 400; color: #333;}

#snb #nav .lnbSub{background-color: #fff; border:1px solid rgba(191,191,191,0.6); position:absolute; left:-1px; right:-1px;  display:none; box-sizing:border-box;}
#snb #nav .lnbSub>a{width:100%; height:45px; padding:0px 20px; font-weight: 300; font-size:15px; line-height:1.2; color:#666; display:table; box-sizing:border-box;}
#snb #nav .lnbSub>a>span{padding:5px 0; display:table-cell; vertical-align: middle;}
#snb #nav .lnbSub>a+a{border-top:1px solid #ddd;}
#snb #nav .lnbSub>a:hover,
#snb #nav .lnbSub>a.active{color: #23408f;}
#snb #nav .lnbSub>a.active{font-weight: 400;}

#snb #nav>li.active>a i{transform:rotate(180deg);}

#pageTop{padding:8rem 0 6rem; font-size:0; line-height:0; text-align: center; position: relative;}
#pageTop>h3{font-weight: bold; font-size:3.6rem; line-height:1; color: #222; position: relative; padding-top: 6rem;}
#pageTop>h3::before {content: ""; position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 1px; height: 3.4rem; background: #333;}
#pageTop>p{padding-top:1.5rem; font-weight: 500; font-size:1.6rem; line-height:1.5; color: #666;}

#container{width:100%; margin:0 auto;  position: relative; box-sizing: border-box;}
#contents{width:100%; max-width:1200px; min-height:46rem; margin:0 auto; padding:0 0 14rem; position: relative; box-sizing: border-box;}

#container #contents.full{width:100%; padding-bottom:0px; overflow:hidden;}
#container #contents.full .fullBox{width:1920px; margin-left:-960px; position: relative; left:50%;}
#container #contents.full .fullBox.gray{background-color: #f7f7f7;}
#container #contents.full .inConts{padding:80px 0;}





	#footer{width:100%; text-align: left; position: relative;}
    .footer__top {padding: 6rem 0; background: #f1f3f8;}
    .footer__top .wrap1280 {display: flex; gap: 15rem; justify-content: center;}
	.ft__add {flex: 1;}
    .ft__add--flex {display: flex; align-items: center; flex-wrap: wrap;}
	.ft__add--flex.mg {margin-top: 1.5rem;}
    .ft__add--flex li {display: flex; align-items: center; margin-top: 0.5rem;}
    .ft__add--flex li span {padding: 0 1rem; ; background-color: #23408f; color: #fff; font-size: 1.6rem;}
    .ft__add--flex li p {padding: 0 1rem;}
	.ft__add--flex li + li {position: relative;}
	.ft__add--flex li + li::before {position: absolute; content: ""; width: 1px ; height: 1rem; background: #999999; top: 50%; left: 0; transform: translateY(-50%);}
	.ft__bk {font-size: 1.6rem; font-weight: 400; color: #333333;}
	.ft__gray {font-size: 1.6rem; font-weight: 400; color: #666666;}
	.ft__bk.pd {padding: 0 1rem 0 0;}
	.ft__titBox {display: inline-block; font-size: 1.7rem ; color: #fff; font-weight: 500; border-radius: 3px; padding: 0.5rem 1rem;}
	.ft__titBox.mg {margin-top: 2.5rem;}

	
	.footer__btm {padding: 6rem 0; background: #e4e9f6;}
	.ft__site { padding-left: 40rem;}
	.site__list {margin-top: 2.5rem;}
	.site__list li {display: flex; align-items: center; gap: 2.5rem; }
	.site__list li + li {margin-top: 1rem;}
	.site__list li b {font-size: 1.6rem; font-weight: 500; color: #333333; width: 18.5rem;}
	.site__list li p a {font-size: 1.6rem; font-weight: 500; color: #4a54d9;}
	.site__list li span {margin: 0 1rem; display: inline-block; position: relative; width: 1px ; height: 1rem; background: #999999;}

	

	a.goTop{width:50px; height:50px; background-color: #acacac; font-size:0; line-height:0; position: fixed; right:15px; bottom:15px; z-index:9; display:block; overflow:hidden; opacity: 0;}
	a.goTop.open{opacity: 1;}
	a.goTop:before{content: ""; width: 100%; height: 100%; background:url('../../images/arr_goTop.png') no-repeat center center; display: block; position:absolute; left: 0; top:0px;}
	a.goTop:hover{background-color: #003876; border-radius:25px; transform:rotate(180deg);}
	a.goTop:hover:before{transform:rotate(-180deg);}


/*[e] Layout Style */




@media only screen and (max-width : 1300px){
	.header_wrap .gnb_list > li {width: 12rem;}
	.logo {width: 17rem; height: 6rem;}
	.headerside_wrap {right: 5rem;}

	.footer__top .wrap1280 {gap: 10rem;}
	.ft__site { padding-left: 35rem; }
}
@media only screen and (max-width : 1024px){
    .pc {display: none;}

	.header {height: 8rem; position: fixed;}
	.logo {width: 16rem; height: 6rem;}
	
    .header_wrap .gnb {position: absolute;  opacity: 0; visibility: hidden; overflow: auto; left: 0; top: 100%; height: calc(100vh - 100%); background: rgba(0,0,0,0.7); transform: translate(0,0); width: 100%; transition: .3s ease;}
    .header_wrap .gnb.active {opacity: 1; visibility: visible; }
    .header_wrap .gnb_list {display: block; height: auto; }
    .header_wrap .gnb_list > li {display: block; height: auto; border-top: 1px solid #ddd; width: 100%;}
    .header_wrap .gnb_list > li > a {padding: 2rem; width: 100%;  display: block; background: #fff; height: auto; text-align: left;}
    .header_wrap .gnb_list > li > a::after {display: none;}
    .header_wrap .gnb_list > li > a span {font-size: 1.8rem; font-weight: 500;}
    .header_wrap .nav__depth2 {text-align: start; padding: 0; width: 100%; position: relative; height: auto;}
    .header_wrap .nav__depth2 li a {padding: 2rem; background: #fafafa;}
    .header_wrap .nav__depth2 li { border-top: 1px solid #ddd; margin: 0;}
    .header_wrap .nav__depth2 li:first-child {margin: 0;}
    .header_wrap .nav__depth2 li:last-child {margin: 0;}
    .header_wrap .gnb_list > li > a span {color: #1b1b1b;}
	.header .header_wrap .gnb_list > li > a span br {display: none;}
	.header_wrap .nav__depth2 li a span br {display: none;}
    
    .header_wrap .gnb_list > li > .navItem__link.active {background: #23408f;}
    .header.all .header_wrap .gnb_list > li > .navItem__link.active span { color: #fff;}

    .header.all .header_wrap .gnb_list > li > .navItem__link.on {background: #23408f;}
    .header.all .header_wrap .gnb_list > li > .navItem__link.on span {color: #fff;}

	.footer__top .wrap1280 {flex-wrap: wrap; gap: 3rem;}
	.ft__logo{width: 100%; }
	.ft__logo img {width: 20rem;}
	.ft__site { padding-left: 0; }


    #snb #nav>li.home {display: none;}
    #snb #nav>li {width: 50%; min-width: auto;}
    #snb #nav {border-left: none;}

    #sVisual .inConts {height: 45rem;}
    #sVisual h2>strong {font-size: 4rem;}


}
@media only screen and (max-width : 840px){

	:root,
	html{font-size:6.5px;}

	:root {
		--f__size--12 : 2rem;
		--f__size--13 : 2rem;
		--f__size--14 : 2rem;
		--f__size--15 : 2rem;
		--f__size--16 : 2rem;
		--f__size--17 : 2.2rem;
		--f__size--18 : 2.2rem;
		--f__size--19 : 2.2rem;
		--f__size--20 : 2.4rem;
		--f__size--21 : 2.4rem;
		--f__size--22 : 2.4rem;
		--f__size--23 : 2.6rem;
		--f__size--24 : 2.6rem;

		--f__size--36 : 3rem;
	}


	.ft__add--flex li {margin-top: 1rem;}

	
}

@media only screen and (max-width : 380px){

    #snb #nav>li>a {padding: 0 40px 0 10px;}
    #snb #nav>li>a {font-size: 14px;}
    #snb #nav>li>a i {right: 10px;}

}

/*
-webkit-transform: translateY(-50%); transform: translateY(-50%);
-webkit-transform: translateX(-50%); transform: translateX(-50%);
filter:grayscale(100%) blur(0px); -webkit-filter:grayscale(100%) blur(0px);
transition: all .5s linear;
transition: all .5s ease-out;
transform:rotate(180deg);
-webkit-transition-timing-function:ease-in linear; transition-timing-function:ease-in linear;
-webkit-transition-delay: .8s; transition-delay: .8s;
:before{content: ""; width: 24px; height: 24px; background-color: #fff; border:1px solid #666; display: inline-block; position:absolute; left: 0; top:0px; box-sizing: border-box;}
display: flex; justify-content: space-between; // 양쪽 끝 정렬
display: flex; justify-content: space-around; // 센터 정렬
display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; //한줄 감추기
display: block; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; //두줄 감추기
active
:first-child
text-indent:-99999px;
!important
display:table;
table-layout:fixed;
display:table-row;
display:table-cell;
box-sizing:border-box;
word-break:keep-all; word-wrap:break-word;
border-radius:2px;
*/