@import url('https://fonts.googleapis.com/css2?family=Lato:wght@300;400;700&family=Noto+Sans+KR:wght@100;300;400;500;700&display=swap');
@import url(//spoqa.github.io/spoqa-han-sans/css/SpoqaHanSans-kr.css);





*, *[lang='en']
{font-family:'Spoqa Han Sans'; }
.container
{padding:0px;}



/*header*/
#header
{height:89px;}
#header.sticky
{height:89px;}
#header .logo
{width:auto; left:174px;}
#header .logo a img.logo-light
{max-height:100%;}
#header.sticky .logo a img.logo-dark
{max-height:54px;}
#header.is-active .logo a img.logo-dark
{max-height:54px;}

/* GNB STR*/
#header .gnb
{position:relative; left:0px; margin-left:0px; max-width:920px; margin : 0 auto; width:100%;}
#header .gnb > li > a
{height : 89px; line-height:89px; padding:0 55px; letter-spacing:0px; font-size:19px; font-weight:600;}
#header .gnb > li:hover > a
{color:#1b4298 !important;}
#header .gnb > li > .subnav li a:hover, #header .gnb > li > .subnav li.is-active a
{color:#1b4298;}


#header.sticky .gnb > li > a:after , #header.is-active .gnb > li > a:after
{background-color:#1b4298;}
#header.sticky .gnb > li > a
{height:89px; line-height:89px;}

/* GNB END */


/* GNB lan STR */
.lan
{position:absolute; right:275px; top : 30px; color:#c8c8c8;}
.lan li
{display : inline-block; margin:0px 5px;}
.lan li a
{font-size:19px; font-weight:400; color:#d32929;}
.lan li.active a
{color:white;}

#header.sticky .lan li.active a
{color:#0c255d;}
#header.is-active .lan li.active a
{color:#0c255d;}
/* GNB lan END */
/*
#main-hero .imgscale 
{ animation:imgscale 2s}


@keyframes imgscale {
    0% {
        transform: scale(1.1);

    }
    100% {
        transform: scale(1.0);

    }
}
*/



/* main visual STR */
#main-hero
{height:940px;}
#main-hero .slick-active.imgscale
{transform:scale(1.1);  transition-duration:8s;}
#main-hero .slick-slide .slide-caption .caption-inner
{text-align:center;}
#main-hero .slick-slide .slide-caption span
{font-family:'lato'; font-size:40px; letter-spacing:0px; font-weight:300; transform:skew(0.1deg);}
#main-hero .slick-slide .slide-caption h2
{font-size:76px; line-height:1; font-size:76px; font-family:'lato'; font-weight:500;}
#main-hero .slick-slide .slide-caption p
{line-height:1; opacity:1; font-family:'Noto Sans Kr'; font-weight:100; font-size:36px;}

#main-hero .slick-dots li button
{width:15px; height:15px; opacity:1;}
#main-hero .slick-dots li.slick-active button
{background:#0c255d;opacity:1;}
button.slick-arrow
{display : none !important;}



.arrow_mouse
{position:absolute; bottom:180px; z-index:999; left:48.5%; text-align:center;}
.arrow_mouse .mousemove
{position:absolute; animation:mousemove 5s infinite;}
.mousemove span
{display:block; color:#fff; font-size:14px; }
@keyframes mousemove{
	0% {top:-30px;}
	25% {top:0px;}
	50% {top:-15px;}
	75% {top:0px;}
	100% {top:-30px;}
}
/* main visual END */




.main-about-section .section-heading h2
{font-weight:400; color:#3a3a3a; line-height:130%; font-size:40px;}
.main-about-section .section-heading p
{font-size:18px; color:#8e8e8e;}
.main-about-section .company_wrap .com_wrap
{width:33.3333%; float:left; padding:0px 10px;}
.main-about-section .company_wrap .com_wrap .com
{position:relative;}
.main-about-section .company_wrap .com_wrap .com .com_txt
{position:absolute; top:0px; width:100%; height:100%; text-align:center; padding-top:150px;}
.main-about-section .company_wrap .com_wrap .com .com_txt .txt01
{font-size:32px; color:white;}
.main-about-section .company_wrap .com_wrap .com .com_txt .txt02
{font-size:19px; color:white; margin-top:15px; transform:skew(0.1deg); font-weight:300;}
.main-about-section .company_wrap .com_wrap .com .com_txt a
{padding:10px 25px; color:white; border:1px solid white; display : inline-block; margin-top:30px; transition-duration:0.15s}
.main-about-section .company_wrap .com_wrap .com .com_txt a:hover
{background:#0c245c; border-color:#0c245c;}

.main-product-section .section-heading h2
{font-weight:400; color:#3a3a3a; line-height:130%; font-size:40px;}
.main-product-section .section-heading p
{font-size:18px; color:#8e8e8e;}
.main-product-section .more
{text-align:center; margin-top:30px;}
.main-product-section .more a
{padding:10px 40px; color:#868686; border: 1px solid #c6c6c6; display : inline-block; transition-duration:0.2s;}
.main-product-section .more a:hover
{background:#0c245c; border-color:#0c245c; color:white;}
.main-product-section .article-list table
{background:transparent; box-shadow:none;}
.main-product-section .article-list td.board_output_gallery_img .board_output_imgs
{width:100%; height:300px;}
.main-product-section .article-list .board_output_gallery_subject
{text-align:center; font-size:19px;}
.main-product-section .article-list .board_output_gallery_subject a
{color:#424242;}



.customer
{padding:70px 0px;}
.customer .cus_tit
{position:relative; font-size:28px; color:#3a3a3a; padding-bottom:15px; display : inline-block;}
.customer .plus 
{position:absolute; right:15px; top:4px; width:24px; height:24px; transition-duration:0.3s;}
.customer .plus a
{width:100%;height:100%; display : inline-block;}
.customer .plus .col
{width:24px; height:1px; background:#767676;  margin-top:11px !important;}
.customer .plus .row
{width:1px; height:24px; background:#767676;position:absolute; right:12px;}
.customer .plus:hover
{transform:rotate(90deg);}
.customer .plus:hover .col , .customer .plus:hover .row
{background:#044794;}
.customer hr
{margin:0px !important;}
.customer hr.blue
{width:40%; border-color:#106faa;}

.customer .inq
{width:33.3333%; padding:0px 10px; float:left; position:relative;}
.customer .inq .inq_inner
{background:url('../images/b_inq.jpg') no-repeat center; width:365px; height:141px; margin-top:20px;}
.customer .inq .inq_inner .inq_txt
{padding:30px 0px 0px 20px; font-size:17px; color:white; font-weight:300; transform:skew(0.1deg);}

.customer .notice
{width:33.333%; padding:0px 10px;float:left;position:relative;}
.customer .notice .notice_inner
{margin-top:20px;}
.customer .notice .notice_inner tr.board_output_1_tr
{display : inline-block; width:100%; padding:0px 0px 13px;}
.customer .notice .notice_inner tr.board_output_1_tr td:nth-child(2) a
{ font-size:16px; color:#797979; }
.customer .notice .notice_inner tr.board_output_1_tr td:nth-child(3)
{color:#9a9a9a; font-size:15px;}




















/* ENG VER */
.customer .notice .notice_inner tr.board_output_18_tr
{display : inline-block; width:100%; padding:0px 0px 13px;}
.customer .notice .notice_inner tr.board_output_18_tr td:nth-child(2) a
{ font-size:16px; color:#797979; }
.customer .notice .notice_inner tr.board_output_18_tr td:nth-child(3)
{color:#9a9a9a; font-size:15px;}



.customer .cs_center
{width:33.3333%; padding:0px 10px; float:left;position:relative;}
.customer .cs_center .cs_inner
{margin-top:20px; display : inline-block; position:relative;}
.customer .cs_center .cs_inner .txt01
{color:#4273ac; font-size:36px; font-weight:600;}
.customer .cs_center .cs_inner .txt02
{color:#4b4b4b; font-size:24px; margin: 10px 0px 0px;}
.customer .cs_center .cs_inner .txt03 
{color:#575757; font-size:15px; padding-top:5px;}
.customer .cs_center .cs_inner .txt03 span
{color:#979797; font-size:15px; padding-right:5px;}
.customer .cs_center .cs_inner .txt04
{padding-top:10px; font-size:15px; color:#979797; display : inline-block;}
.customer .cs_center .cs_inner .cs_call
{background:url('../images/cs_center_call.png');width:98px; height:97px; position:absolute; top:10px; right:-125px;}
.customer .cs_center .cs_inner .cs_call a
{width:100%;height:100%; display : inline-block;}



#footer
{padding:60px 0px; background:#051f32;}
#footer .info
{opacity:1;}
#footer .info li.txt01
{list-style : none;  font-size:15px; font-weight:300; float:right; width:79%; text-align:left;}
#footer .info li.txt01 span
{margin:0px 20px 0px 0px; color:#fff; opacity:1;}
#footer .info p.copy
{float:right; color:#fff; font-size:15px; width:79%; text-align:left; margin-top:10px;}
#footer .info .f_logo
{background:url('../images/f_logo.png'); width:180px; height:50px; float:left; margin-top:35px;}


/* sub */
#sub-hero.hero-01 .hero-bg
{background-image:url('../images/sub-menu-bg1.jpg')}
#sub-hero.hero-02 .hero-bg
{background-image:url('../images/sub-menu-bg2.jpg')}
#sub-hero.hero-03 .hero-bg
{background-image:url('../images/sub-menu-bg3.jpg')}
#sub-hero.hero-04 .hero-bg
{background-image:url('../images/sub-menu-bg4.jpg')}

.sub_tit
{padding-bottom:0px;}



/* sub menu */
#header .gnb > li:hover > a, #header .gnb > li.is-active > a
{color:#1b4298 !important;}

.dropdown-nav-section .dropdown-02 > a
{color:#1b4298;}
.dropdown-nav-section .dropdown-wrap > .dropdown
{padding: 0px;}
.dropdown-nav-section .dropdown-wrap > .dropdown li.is-active a
{background:#1b4298;}

.dropdown-nav-section .dropdown-wrap > a
{letter-spacing:0px;}







/* sub form */
.formmail_border
{border:1px solid #d4d4d4;}




@media screen and (max-width:1700px){
	#header .gnb
	{max-width:895px; text-align:center;}
}

@media screen and (max-width:1450px){
	#header .logo
	{left:70px;}

	.lan
	{right:70px;}
}

@media screen and (max-width:1200px){
	#header .logo
	{left:10px;}
	.lan
	{right:10px;}

}

@media screen and (max-width:414px){

	.arrow_mouse
	{display:none;}

	#header nav .btn-close-nav
	{left:unset; right:0px;}
	#header .gnb
	{padding-top:0px;}
	#header .gnb > li > a
	{padding:0px 20px;}
	
	#header .logo
	{left:15px;}
	
	#main-hero
	{height:340px;}
	#main-hero .slick-slide .slide-caption span
	{font-size:24px; margin-top:60px;}
	#main-hero .slick-slide .slide-caption h2
	{font-size:32px;}
	#main-hero .slick-slide .slide-caption p
	{font-size:22px; margin-top:15px;}
	#main-hero .slick-dots
	{bottom:10px;}
	
	.main-about-section .section-heading h2
	{font-size:32px;}
	.main-about-section .section-heading p
	{font-size:16px;}
	.main-about-section .company_wrap .com_wrap
	{padding:0px 20px; text-align:center; margin-bottom:30px; width:100%; float:none;}
	
	.main-product-section .article-list > tbody > tr
	{margin:0px;}
	.main-product-section .article-list > tbody > tr > td
	{padding:0px;}
	
	
	.customer .inq , .customer .notice , .customer .cs_center
	{width:100%; padding:0px 20px; float:none; margin:30px 0px;}
	
	#footer
	{padding:60px 20px;}
	#footer .info
	{text-align:center;}
	#footer .info .f_logo
	{display : inline-block; float:none;}
	#footer .info li.txt01
	{width:100%; float:none; text-align:left; margin-top:10px;}
	#footer .info p.copy
	{width:100%;}
	
	
	/* mobile lan */
	.lan
	{position:relative; top:0px; right:0px; text-align:center;}
	.lan li.active a
	{color:#333;}
	/* sub form*/
	.inq .table
	{display : inline-block;}
	.inq .table > tbody
	{display : inline-block; width:100%;}
	.inq .table > tbody > tr
	{height: auto; display : inline-block; width:100%;}
	.inq .table > tbody > tr > td:nth-child(1)
	{display : inline-block; width:20% !important;}
	.inq .table > tbody > tr > td:nth-child(2)
	{width:79% !important; display : inline-block; }
	.inq .table > tbody > tr:nth-child(2) > td:nth-child(2)
	{height:25px;}
	.inq .table > tbody > tr > td:nth-child(2) > .formmail_border 
	{width:100%;}
	.inq .table > tbody > tr > td:nth-child(2) > .formmail_textarea_style
	{width:100%;}
	.inq .table > tbody > tr:last-child td.formmail_cell_bgcolor
	{width:100% !important; }



	

#header.sticky .gnb > li > a:after, #header.is-active .gnb > li > a:after
{background-color:transparent;}
}


@media screen and (max-width:360px){
	.customer .inq .inq_inner
	{width:100%;}
	.customer .cs_center .cs_inner .cs_call
	{right:-100px;}
}