@import url("common.css");

/* visual */

#visual {
	width:100%; /*height:580px;*/ position:relative; 
	height:100vh;
}
#visual .slick-slider {position: relative; display: block;}
#visual .slick-list {position: relative; display: block; overflow: hidden;}
#visual .slick-slide {display: none; float: left; height:580px; min-height: 1px;}
#visual .slick-initialized .slick-slide{display: block;}
#visual .slick-vertical .slick-slide{display: block; height: auto; border: 1px solid transparent;}

#visual .slick-prev, #visual .slick-next{ 
	font-size: 0; line-height: 0; position: absolute; 
	top: 50%; margin-top:-43px; display: block; cursor: pointer; 
	color: transparent; border: none; outline: none; 
	background: transparent;
z-index:1500;
}
/* #visual .sub_imgbox .slick-next{width:90px;height:86px;background:url('/images/main/next.png') 0 0 no-repeat; right:0; font-size:0; }
#visual .sub_imgbox .slick-prev{width:90px;height:86px;background:url('/images/main/prev.png') 0 0 no-repeat;left:0; font-size:0;} */

#visual .cover01 {background-image:url('/images/main/visual01.jpg'); background-repeat:no-repeat; }
#visual .cover02 {background-image:url('/images/main/visual02.jpg'); background-repeat:no-repeat; }

#visual .sub_imgbox{height:100%;}
#visual .section {
	width:100%;
	height:100%;
	position:relative;
	overflow:hidden;
	background-position:center;
	background-size:cover; 
	border:0;
	
}
#visual .sub_imgbox .slick-list ,
#visual .sub_imgbox .slick-track {height:100%;}

#visual .txt_area {position:relative; width:1170px;
	margin:250px auto 0 auto;  text-shadow: 0 0 10px rgba(0, 0, 0, .35);
}
#visual .txt_area .logotxt {position:relative;}
#visual .txt_area span {display:inline-block;}
#visual .txt_area span.logotxt01 {position:relative; top:0;}
#visual .txt_area span.logotxt02 {display:none; position:relative; right:60px;}
#visual .txt_area h1 {width:100%;font-family: 'Raleway', sans-serif; font-weight:700; font-size:60px; letter-spacing:-0.3pt; color:#fff; position:absolute; bottom:-94px; left:0px;}
#visual .txt_area h4 {width:100%;font-family: 'Raleway', sans-serif; font-weight:600; font-size:45px; letter-spacing:0pt; color:#fff; position:absolute; bottom:-142px; left:0px;}

#visual .txt_area h2 {width:100%;font-family: 'Raleway', sans-serif; font-weight:700; font-size:50px; letter-spacing:0pt; color:#fff; position:absolute; bottom:-118px; left:0px; line-height: 53px;}
#visual .txt_area h3 {width:100%;font-size:27px; letter-spacing:-0.3pt; color:#fff; position:absolute; bottom:-155px; left:0px;font-weight: 400;}
#visual .txt_area h3 strong {font-weight: 600;}






/* 메인 슬라이더 배너 애니메이션 */
/* #visual .section {
	background-size:100%;
	background-size:cover;
	background-size:auto 100%;
} */
#visual .slick-active.section {
	
	animation-name:fadeScale;
	animation-duration:2.5s;
	animation-fill-mode: forwards;
	/* opacity:0; */
	/* animation-delay:.5s; */
}
#visual .slick-active .txt_area {
    transform:translateY(-150px);
        opacity:0;
}
#visual .slick-active .txt_area {
    animation-name:fadeInRight;
    animation-duration:3s;
    animation-fill-mode: forwards;
}

@keyframes fadeInRight {
    0% {
        transform:translateY(-150px);
        opacity:0;
    }
    100% {
        transform:translateY(0);
        opacity:1;
    }
}

/* @keyframes fadeScale {
    0% {
        background-size:auto 110%;
				opacity:.2;
    }
		40% {
        background-size:auto 110%;
				opacity:.9;
    }
    100% {
        background-size:auto 100%;
				opacity:1;
    }
} */

@media (min-width:1600px) {
	
		@keyframes fadeScale {
			0% {
					background-size:110%;
					opacity:.2;
			}
			40% {
					background-size:110%;
					opacity:.9;
			}
			100% {
					background-size:100%;
					opacity:1;
			}
	}

}

@media (max-width:1599px) {
	
		@keyframes fadeScale {
			0% {
					background-size:auto 110%;
					opacity:.2;
			}
			40% {
					background-size:auto 110%;
					opacity:.9;
			}
			100% {
					background-size:auto 100%;
					opacity:1;
			}
		}

}



#visual .slick-active .txt_area .logotxt {
    animation-delay:2s;
}
#visual .slick-active .txt_area h1,
#visual .slick-active .txt_area h2 {
    animation-delay:2.3s;
}
#visual .slick-active .txt_area h3,
#visual .slick-active .txt_area h4 {
    animation-delay:2.5s;
}


/* 메인 슬라이더 내부 텍스트 반응형 */
@media (max-width:1620px){
    .main-visual .main-slider .slider-visual > .visual-txt {
        padding:0 15px;
    }
}

/* 메인 슬라이더 반응형 */
@media (max-width:1220px){
    .main-visual {
        height:calc(100vh - 56px);
    }
}

/* 반응형 라이브러리 */
@media (min-width:801px){
    .only-mobile {
        display:none;
    }
}

@media (max-width:800px){
    .only-pc {
        display:none;
    }
}
/* .main-visual .main-slider .slider-visual > .img-box > .img {
    
} */

/* 슬라이더 이동 버튼 */
.main-visual > .arrow-con {
    position:absolute;
    bottom:67px;
    width:100%;
}

.main-visual > .arrow-con > .arrows {
    max-width:1645px;
    margin:0 auto;
}

.main-visual > .arrow-con > .arrows::after {
    content:"";
    display:block;
    clear:both;
}

.main-visual > .arrow-con > .arrows > .slick-arrow {
    position:static;
    font-size:15px;
    color:#fff;
    width:auto;
    height:auto;
    line-height:normal;
}

.main-visual > .arrow-con > .arrows > .slick-arrow::before {
    display:none;
}

.main-visual > .arrow-con > .arrows > .slick-prev {
    float:left;
}

.main-visual > .arrow-con > .arrows > .slick-next {
    float:right;
}

.main-visual > .arrow-con > .arrows > .slick-arrow > i {
    font-size:24px;
}

.main-visual > .arrow-con > .arrows > .slick-arrow > i,
.main-visual > .arrow-con > .arrows > .slick-arrow > span {
    display:inline-block;
    vertical-align:middle;
}

/* 슬라이더 내부 텍스트 */
.main-visual .main-slider .slider-visual > .visual-txt {
    position:absolute;
    left:0;
    bottom:150px;
    width:100%;
}

.main-visual .main-slider .slider-visual > .visual-txt > .inner-txt-con {
    max-width:1645px;
    margin:0 auto;
}

.main-visual .main-slider .slider-visual > .visual-txt > .inner-txt-con > .inner-txt-1 {
    display:inline-block;
    font-size:14px;
    color:#fff;
    padding:10px;
    margin-bottom:15px;
    border-radius:5px;
    background-color:#3a75bf;
    letter-spacing:1px;
    line-height:1;
}

.main-visual .main-slider .slider-visual > .visual-txt > .inner-txt-con > .inner-txt-2 {
    font-size:50px;
    font-weight:300;
    color:#1c2939;
    letter-spacing:-2px;
    line-height:65px;
    margin-bottom:15px;
}

.main-visual .main-slider .slider-visual > .visual-txt > .inner-txt-con > .inner-txt-2 > b {
    color:#286abd;
}

.main-visual .main-slider .slider-visual > .visual-txt > .inner-txt-con > .inner-txt-3 {
    font-size:20px;
    color:#303030;
    letter-spacing:1px;
    opacity:.9;
    line-height:35px;
}

.main-visual .main-slider .slider-visual-3 > .visual-txt > .inner-txt-con > .white-txt,
.main-visual .main-slider .slider-visual-4 > .visual-txt > .inner-txt-con > .white-txt {
    color:#fff;
}

.main-visual .main-slider .slider-visual > .visual-txt > .inner-txt-con > .inner-txt {
    transform:translateX(0);
    opacity:0;
}

.main-visual .main-slider .slick-active .visual-txt > .inner-txt-con > .inner-txt {
    animation-name:fadeInRight;
    animation-duration:2s;
    animation-fill-mode: forwards;
}

@keyframes fadeInRight {
    0% {
        transform:translateX(-50px);
        opacity:0;
    }
    100% {
        transform:translateX(0);
        opacity:1;
    }
}

.main-visual .main-slider .slick-active .visual-txt > .inner-txt-con > .inner-txt-1 {
    animation-delay:2s;
}

.main-visual .main-slider .slick-active .visual-txt > .inner-txt-con > .inner-txt-2 {
    animation-delay:2.3s;
}

.main-visual .main-slider .slick-active .visual-txt > .inner-txt-con > .inner-txt-3 {
    animation-delay:2.5s;
}


/* 메인 슬라이더 내부 텍스트 반응형 */
@media (max-width:1620px){
    .main-visual .main-slider .slider-visual > .visual-txt {
        padding:0 15px;
    }
}

/* 메인 슬라이더 반응형 */
@media (max-width:1220px){
    .main-visual {
        height:calc(100vh - 56px);
    }
}

/* 반응형 라이브러리 */
@media (min-width:801px){
    .only-mobile {
        display:none;
    }
}

@media (max-width:800px){
    .only-pc {
        display:none;
    }
}







/* Contents */
#main_container > div {text-align:center;}
#main_container h2 {display:inline-block; color:#295198; font-size:38px; font-family: 'Raleway', sans-serif; font-weight:900;line-height:40px; margin-bottom:7px;} /*background:url('/img/tit_icon.png') right top no-repeat; padding-right:15px; */
#main_container h2 strong {font-family: 'Raleway', sans-serif; font-weight:900; color: #0c2551;}
#main_container p.stit {font-size:18px; color:#888;letter-spacing:-0.2pt;line-height:20px;font-family:"NotoKR-Regular", Sans-serif; }

#about {
	background:url('/images/main/about_bg.jpg') top center no-repeat; 
	padding:82px 0;
	background-size:cover;
}
#about h2 img {margin-left:10px;}
#about ul {margin:45px auto 0 auto; width:100%; max-width:1170px; overflow:hidden;}
#about li {float:left; width:24%; margin:0 0.5%;}
#about li a {
	display:block; width:100%; height:80px; padding-top:165px; 
	padding-bottom:30px; 
	-webkit-transition:all 0.3s;
	-moz-transition:all 0.3s;
	transition:all 0.3s;
	border-radius:20px;
}
#about li a p {color:#333; font-size:22px; line-height:100%; letter-spacing:-0.5pt;  margin-bottom:13px; font-weight: 500;font-family: 'NotoKR-Medium', sans-serif;}
#about li a span {color:#666; font-size:15px; line-height:150%; letter-spacing:-0.5pt;}
#about li a:hover {-webkit-transition:all 0.3s;-moz-transition:all 0.3s;transition:all 0.3s;}
#about li.one a {background:#fff url('/images/main/about_icon1.png') center 48px no-repeat;}
#about li.two a {background:#fff url('/images/main/about_icon2.png') center 48px no-repeat;}
#about li.three a {background:#fff url('/images/main/about_icon3.png') center 48px no-repeat;}
#about li.four a {background:#fff url('/images/main/about_icon4.png') center 48px no-repeat;}


#about li.one a:hover {background:#2172e1 url('/images/main/about_icon1_up.png') center 43px no-repeat;}
#about li.two a:hover {background:#2172e1 url('/images/main/about_icon2_up.png') center 43px no-repeat;}
#about li.three a:hover {background:#2172e1 url('/images/main/about_icon3_up.png') center 43px no-repeat;}
#about li.four a:hover {background:#2172e1 url('/images/main/about_icon4_up.png') center 43px no-repeat;}
#about li a:hover p {color:#fff;}
#about li a:hover span {color:#a1c9ff;}


#about.eng li {
	width:32.3%;
}
#about.eng li.three {
	display:none;
}



#Business { background: #fff; padding:82px 0;}
#Business h2 img {margin-left:10px;}
#Business ul {margin:45px auto 0 auto; width:100%; max-width:1170px; overflow:hidden;}
#Business li {float:left; width:33.3%; margin:0;transition:all 0.3s ease;}
#Business li:hover {top:-8px; transition:all 0.3s ease;}
#Business li a {display:block; width:100%; /*height:80px; */padding-top:165px; padding-bottom:40px; -webkit-transition:all 0.3s;-moz-transition:all 0.3s;transition:all 0.3s;}
#Business li a img{position:absolute; left:0; top:0; opacity:0; transition:all 0.5s ease;}


#Business li a p {color:#fff;font-size:24px; line-height:140%; letter-spacing:-0.2pt; margin-top: 5px; margin-bottom:7px; font-weight: 400;font-family: 'NotoKR-Medium', sans-serif;}
#Business li a span {color:#fff;font-size:15px; line-height:150%; letter-spacing:-0.5pt;}
#Business li a:hover {-webkit-transition:all 0.3s;-moz-transition:all 0.3s;transition:all 0.3s;}

#Business li.one {background:url('/images/main/business_bg_01.jpg')no-repeat;}
#Business li.two {background:url('/images/main/business_bg_02.jpg')no-repeat;}
#Business li.three {background:url('/images/main/business_bg_03.jpg')no-repeat;}

#Business li.one a {background:url('/images/main/business_icon1.png') center 50px no-repeat;}
#Business li.two a {background:url('/images/main/business_icon2.png') center 50px no-repeat;}
#Business li.three a {background:url('/images/main/business_icon3.png') center 50px no-repeat;}

#Business li.one a:hover {background:rgba(2, 56, 58, 0.55) url('/images/main/business_icon1.png') center 45px no-repeat;}
#Business li.two a:hover {background:rgba(255,255,255, 0.55) url('/images/main/business_icon2.png') center 45px no-repeat;}
#Business li.three a:hover {background:rgba(2, 56, 58, 0.55) url('/images/main/business_icon3.png') center 45px no-repeat;}

#Business li.two a p {color:#333;}
#Business li.two a span {color:#000;}

#Business li a:hover p {color:#fff;}
#Business li a:hover span {color:#a1fff2;}

#Business li.two a p {color:#333;}
#Business li.two a:hover span {color:#333;}





#main_partners {
	background-color:#f8f8f8;
	padding:82px 0;
	margin:0 auto;
}
#main_partners strong .more {color:#fff; font-size:18px; line-height:100%; letter-spacing:-0.2pt;font-family:"Raleway", Sans-serif; border: 1px solid #cccccc;font-weight:800;  padding: 10px 64px;}
#main_partners .more:hover{color:#fff;transition:all 0.3s ease;border: 1px solid #fff;}


.main_section.partner {position:relative;background-color:#f8f8f8;overflow: hidden;}
.main_section.partner h2,
.main_section.partner .partner_box {position:relative;z-index:5;}
.main_section.partner:after {content:'Partner';position:absolute;bottom:-100px;left:80px;color: #efefef;font-size:260px;font-weight:600;letter-spacing:0.2rem;}
.main_section_tit {position: relative;}
.main_section_tit .linkbtnL {position: absolute;right:0;top: 104px;z-index: 9;}
.partner_box{
	overflow:hidden; 
	max-width:1170px; 
	margin:65px auto 0;
}
.partner_track{display:flex;gap:60px;animation:scrollLeft 40s linear infinite; width:fit-content; }
.partner_track:hover {animation-play-state: paused;}
.partner_box span {
	flex:0 0 auto;
	width:120px;
	height:40px;
	background-repeat:no-repeat;background-position:center;background-size:contain;position:relative}
.hidden_txt {
	opacity:0;
	font-size:0;
	color:transparent;
}
/* 로고별 배경 */
.partner_box .p_logo1 { background-image: url('/images/main/p_hynix.png'); }
.partner_box .p_logo2 { background-image: url('/images/main/p_onsemi.png'); }
.partner_box .p_logo3 { background-image: url('/images/main/p_dbhitek.png'); }
.partner_box .p_logo4 { background-image: url('/images/main/p_siltron.png'); }
.partner_box .p_logo5 { background-image: url('/images/main/p_samsungele.png'); }
.partner_box .p_logo6 { background-image: url('/images/main/p_tsmc.png'); width:80px; }
.partner_box .p_logo7 { background-image: url('/images/main/p_winbond.png'); }
.partner_box .p_logo8 { background-image: url('/images/main/p_nuvoton.png'); }
.partner_box .p_logo9 { background-image: url('/images/main/p_zeus.png'); }
.partner_box .p_logo10 { background-image: url('/images/main/p_jtcorp.png'); }
.partner_box .p_logo11 { background-image: url('/images/main/p_psk.png'); }
.partner_box .p_logo12 { background-image: url('/images/main/p_profab.png'); }
.partner_box .p_logo13 { background-image: url('/images/main/p_aOSilicon.png'); }
.partner_box .p_logo14 { background-image: url('/images/main/p_leadingServe.png'); }


/* 애니메이션 정의 */
@keyframes scrollLeft {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}



#main_banner{
	background:url('/images/main/main_banner_bg.jpg') top center no-repeat; 
	background-size:cover;
}
#main_banner ul{margin:0 auto; overflow:hidden; clear:both; max-width:1170px; padding:82px 0 ;}
#main_banner li{float:left;  width:47.2%;  margin-right:20px; box-sizing:border-box;/*width:553px; */ height:260px; background-repeat:no-repeat;background-size:553px 260px; transition:all 0.5s ease; position:Relative; overflow:hidden;  text-align:left; }
/*#main_banner li img{position:absolute; left:0; top:0; opacity:0; transition:all 0.5s ease;}*/
#main_banner li .two{margin-right: 0px;}
#main_banner li a{display:block; width:90%; height:100%; padding:64px 0 0 43px; box-sizing:border-box;transition:all 0.3s ease;margin-right: 20px; }
.eng#main_banner li a {
  /* padding:46px 0 0 43px; */
	padding-top:46px;
}
#main_banner li h6{
	font-size:26px; color:#fff; letter-spacing:-0.5pt; 
	line-height:120%; font-weight:400; margin:0 0 17px; position:relative; }
#main_banner li div{
	font-size:16px; color:#ddd; color:#eee;
	letter-spacing:-0.8pt; line-height:22px; font-weight:400; margin:0 0 30px; position:relative; }

#main_banner li strong{position:Relative;color:#fff; font-size:18px; line-height:100%; letter-spacing:0pt;font-family:"Raleway", Sans-serif; border: 1px solid #fff;font-weight:800; width: 179px; height: 39px; padding: 8px 62px;}
	

#main_banner .one br:nth-child(2),
#main_banner .two br:nth-child(1) {
	display:none;
}
.eng#main_banner .one br:nth-child(2),
.eng#main_banner .two br:nth-child(1) {
	display:block;
}
#main_banner .one{
	background:rgba(0, 0, 0, .23) url('/images/main/main_banner_nwicon_01.png') 93% 60px no-repeat;}
#main_banner .two{
	float: right; 
	background:rgba(0, 0, 0, .2) url('/images/main/main_banner_nwicon_02.png') 93% 60px no-repeat;
	margin:0px 0px 02
}

#main_banner li:hover a{transition:all 0.3s ease;}
/*.main_banner li:hover a{padding-left:55px;transition:all 0.3s ease;}*/
#main_banner li:hover div{color:#fff; transition:all 0.3s ease;}
#main_banner li:hover strong{border: 1px solid #fff; color:#0e3c96; background: #fff;  transition:all 0.3s ease;}







#customer {background:#101d35; padding:35px 0; color:#fff;}
/*#customer h2 {display:inline-block; font-size:20px; font-family:"NotoKR-Medium", NanumGothic, MalgunGothic, Dotum, Gulim, sans-serif; letter-spacing:-0.5pt; color:#b5bcca; margin:0 30px 0 0; background:none; padding-right:0;}*/
#customer strong {display:inline-block; color:#fff; font-family:"Open Sans",sans-serif; font-size:40px; font-weight:700; margin-right:15px; letter-spacing: 0pt; line-height: 100%;}
#customer strong img {margin-top: -8px;}
#customer p {/*font-family:"Titillium Web",sans-serif;*/ display:inline-block;  color:#aaaaaa; font-size:15px; margin-right:15px;letter-spacing: -0.2pt;}
#customer span {display:inline-block;color:#f4f4f4; font-size:20px;font-weight: 300;line-height: 30px;}










/*******************************************************************************
	@media 1024px~1200px
*******************************************************************************/
@media all and (max-width:1200px){


	/* visual */

	#visual .txt_area {text-align:center; width:96%; margin:0 auto; top:50%; margin-top:-160px;}
	#visual .txt_area span.logotxt02 {display:none;}
	#visual .txt_area h1 {position:relative; text-align:center; bottom:-26px; left:0;}	
	#visual .txt_area h4 {position:relative; text-align:center; bottom:-26px; left:0;}

	#visual .txt_area h2 {position:relative; text-align:center; bottom:-26px; left:0;}
	#visual .txt_area h3 {position:relative; text-align:center; bottom:-26px; left:0;}

	#visual .cover01 .txt_area {
		text-shadow: 3px 3px 10px rgba(0, 0, 0, .75);
	}

	/* Contents */
	.thum {width:96%;}

	#about ul {max-width:96%;}
	#about li a {padding-bottom:25px; }
	#about li a span {font-size:14px;}	

	.thum .slick-prev, .thum .slick-prev:hover {left:30%;}
	.thum .slick-next, .thum .slick-next:hover {right:30%;}

	#Business ul {max-width:96%;}	

	#main_partners ul {max-width:96%;}
	#main_partners li {width:31.8%;}

	#main_partners li a{padding:45px 22px 0;}
	#main_partners li span{font-size:19px;}
	#main_partners li h6{font-size:19px;margin:29px 0 32px; height:66px}
	#main_partners li div{font-size:15px;height:126px;}
	#main_partners li p{font-size:15px; color:#888; margin-bottom: 17%; }
	#main_partners li a span i{margin:8px 0 0px 0px; }	
	
	
	
	#main_banner ul {width: 96%;}
	#main_banner .one br:nth-child(2),
	#main_banner .two br:nth-child(1) {
		display:block;
	}
	#main_banner .one{
		background-size:150px;
	}
	#main_banner .two{
		background-size:175px;
	}

	#customer strong { margin-bottom: 10px;}

	

}


/*******************************************************************************
	@media 980~1024px
*******************************************************************************/
@media all and (max-width:1024px){

	/* #visual {padding-top: 80px;} */

	#about li a span {font-size:14px;}


	#about.eng li {
		width:100%;
	}

}


/*******************************************************************************
	@media 768~980px
*******************************************************************************/
@media all and (max-width:980px){
	/* #visual {padding-top: 80px;} */
	/* visual */
	/* #visual .sub_imgbox .slick-next{width:60px;background-image:url('/images/main/next_m.png');}
	#visual .sub_imgbox .slick-prev{width:60px;background-image:url('/images/main/prev_m.png');} */


	/* contents */

	#about {padding:60px 0; background-size:cover;}
	#about ul {margin:40px auto 0 auto;}
	#about li {float:left; width:49%; margin:0 0.5% 1% 0.5%;}
	#about li a {height:70px; padding-top:145px; padding-bottom:40px;}
	#about li a p {margin-bottom:15px;}
	#about li a span {font-size:15px;}



		
	#main_banner li a{padding:54px 0 0 33px;margin-right: 20px; }	
	#main_banner li div{font-size:15px;}	

	#Business li a p {font-size:20px; line-height: 160%;}	
	#Business li a span {font-size:14px; padding: 0 5px;}	


	#main_partners li a{padding:45px 22px 0;}
	#main_partners li span{font-size:19px;}
	#main_partners li h6{font-size:19px;margin:29px 0 25px; height:73px; line-height: 140%;}
	#main_partners li div{font-size:15px;height:126px;}
	#main_partners li p{font-size:15px; color:#888; margin-bottom: 17%; }
	#main_partners li a span i{margin:8px 0 0px 0px; }	
	
	#main_banner .one{
		background-size:126px;
	}
	#main_banner .two{
		background-size:145px;
	}
	
	
	#customer {padding:40px 0;}
	#customer h2 {font-size:18px; margin:0 20px 0 0;}
	#customer strong { margin-right:15px; margin-bottom: 10px;}
	#customer p {font-size:15px; margin-right:5px;}


}


/*******************************************************************************
	@media 768px ~ 860px
*******************************************************************************/
@media all and (max-width:860px) { 


	#main_partners li a{padding:30px 15px 0;}
	#main_partners li span{font-size:17px;}
	#main_partners li h6{font-size:17px;margin:29px 0 20px; height: 70px; line-height: 140%;}
	#main_partners li div{font-size:14px; height:100px;}
	#main_partners li p{font-size:14px; color:#888; margin-bottom: 17%; }

	
	
}

/*******************************************************************************
	@media 640px~768px
*******************************************************************************/
@media all and (max-width:768px){

	#main_container h2 {font-size:40px; margin-bottom:10px;}
	#main_container h2 img {max-height:30px;}
	#main_container p.stit {font-size:18px;}



	#about {padding:50px 0;}
	#about li a {height:70px; padding-top:140px; padding-bottom:40px;}
	#about li a p {font-size:22px;}
	#about li a span {font-size:14px; line-height:140%;}

	#about li.one a {background:#fff url('/images/main/about_icon1.png') center 35px no-repeat;}
	#about li.two a {background:#fff url('/images/main/about_icon2.png') center 35px no-repeat;}
	#about li.three a {background:#fff url('/images/main/about_icon3.png') center 35px no-repeat;}
	#about li.four a {background:#fff url('/images/main/about_icon4.png') center 35px no-repeat;}
	#about li.one a:hover {background:#2172e1 url('/images/main/about_icon1_up.png') center 30px no-repeat;}
	#about li.two a:hover {background:#2172e1 url('/images/main/about_icon2_up.png') center 30px no-repeat;}
	#about li.three a:hover {background:#2172e1 url('/images/main/about_icon3_up.png') center 30px no-repeat;}
	#about li.four a:hover {background:#2172e1 url('/images/main/about_icon4_up.png') center 30px no-repeat;}

	#Business ul {}	
	#Business li a {padding-top:140px; padding-bottom:25px; }
	#Business li.one a {background:url('/images/main/business_icon1.png') center 40px no-repeat;}
	#Business li.two a {background:url('/images/main/business_icon2.png') center 40px no-repeat;}
	#Business li.three a {background:url('/images/main/business_icon3.png') center 40px no-repeat;}

	#Business li.one a:hover {background:rgba(2, 56, 58, 0.55) url('/images/main/business_icon1.png') center 35px no-repeat;}
	#Business li.two a:hover {background:rgba(255,255,255, 0.55) url('/images/main/business_icon2.png') center 35px no-repeat;}
	#Business li.three a:hover {background:rgba(2, 56, 58, 0.55) url('/images/main/business_icon3.png') center 35px no-repeat;}
	
		
	#main_banner{background:url('/images/main/main_banner_bg_m.jpg') top center no-repeat; padding:0px 0;}
	#main_banner ul{padding:30px 0 30px 0 ;}	
	#main_banner li{height:100%;width:100%;}
	#main_banner li a{height:100%; padding:7% 0 7% 23px; margin-bottom: 0px;}
	#main_banner li h6{font-size:20px;line-height:100%;margin:0 0 7px;}
	#main_banner li div{font-size:13.5px;letter-spacing:-0.8pt; line-height:20px;margin:0 0 20px; }
	#main_banner li strong{font-size:16px;letter-spacing:0.5pt;padding: 6px 42px;}
			

	#main_banner .one{background:rgba(0, 0, 0, .23) url('/images/main/main_banner_nwicon_01_m.png') 93.5% 40px no-repeat;}
	#main_banner .two{float: right; background:rgba(0, 0, 0, .2) url('/images/main/main_banner_nwicon_02_m.png') 93.5% 40px no-repeat; margin:10px 0px 0;}


	#main_banner .one br:nth-child(2),
	#main_banner .two br:nth-child(1) {
		display:none;
	}

	
	#customer {padding:30px 0;}
	#customer h2 {font-size:26px; display:block; margin:5px 0 20px 0;}
	#customer strong {display:block; font-size:32px; line-height:32px; margin-right:0px; margin-bottom:10px;}
	#customer p {font-size:15px; margin-right:5px;}

}

/*******************************************************************************
	@media ~640px
*******************************************************************************/
@media all and (max-width:640px){

	#visual {
		height:450px;
	}
	#visual .sub_imgbox{
		height:380px; 
		height:450px; }
	#visual .section{
		width:100%;
		height:380px;
		height:450px;
	}
	#visual .sub_imgbox .slick-list ,
	#visual .sub_imgbox .slick-track {height:380px;
	height:450px;
	}	
	#visual .txt_area {padding-top: 50px; }
		
	/* visual */
	#visual .cover01 {background-image:url('/images/main/visual01_m.jpg'); background-size:cover;}
	#visual .cover02 {background-image:url('/images/main/visual02_m.jpg'); background-size:cover;}

	#visual .txt_area {width:84%; text-align: center;}
	#visual .txt_area h1 {font-size:40px;  bottom:0; margin:5% auto 0 auto; /* margin:5% auto 0 auto;*/}
	#visual .txt_area h4 {font-size:30px;  bottom:0; margin:5% auto 0 auto; }
	#visual .txt_area h2 {font-size:30px;  bottom:0; margin:5% auto 0 auto;line-height: 32px;}
	#visual .txt_area h3 {font-size:20px;  bottom:0; margin:5% auto 0 auto;}
	#visual .txt_area span.logotxt01 {width:85%}


	/* Contents */
		
	#main_container h2 {font-size:32px; margin-bottom:0px;}
	#main_container h2 img {max-height:30px;}
	#main_container p.stit {font-size:14px;}

	#about {padding:50px 0 50px 0;background-image:url('/images/main/about_bg_m.jpg'); background-size:cover;}
	#about ul {margin:20px auto 0 auto;}	
	#about li a {height:70px; padding-top:140px; padding-bottom:25px;}
	#about li a p {font-size:18px;}
	#about li a span {font-size:14px; line-height:140%; letter-spacing: -1pt;}

		
	#Business {padding:50px 0 50px 0; background-size:cover;}
	#Business ul {margin:20px auto 0 auto;}	
	#Business li{height:100%;width:100%;}	
	#Business li a {height:70px; padding-top:95px; padding-bottom:0px;}
	#Business li a p {font-size:20px; line-height:100%;}
	#Business li a span {font-size:14px; line-height:120%; letter-spacing: -1pt;}
	#Business li.one {background:url('/images/main/business_bg_01_m.jpg')no-repeat;}
	#Business li.two {background:url('/images/main/business_bg_02_m.jpg')no-repeat;}
	#Business li.three {background:url('/images/main/business_bg_03_m.jpg')no-repeat;}
	
	#Business li.one a {background:url('/images/main/business_icon1_m.png') center 25px no-repeat;}
	#Business li.two a {background:url('/images/main/business_icon2_m.png') center 25px no-repeat;}
	#Business li.three a {background:url('/images/main/business_icon3_m.png') center 25px no-repeat;}

	#Business li.one a:hover {background:rgba(5,45,122, 0.55) url('/images/main/business_icon1_m.png') center 20px no-repeat;}
	#Business li.two a:hover {background:rgba(255,255,255, 0.55) url('/images/main/business_icon2_m.png') center 20px no-repeat;}
	#Business li.three a:hover {background:rgba(5,45,122, 0.55) url('/images/main/business_icon3_m.png') center 20px no-repeat;}
	
	

	#main_partners {background:url('/images/main/main_partners_bg.jpg') top center no-repeat;padding:50px 0 50px 0;}
	#main_partners ul {margin:35px auto 0 auto;}
	#main_partners li {width:100%;}

	#main_partners strong .more {letter-spacing:0pt; padding: 8px 54px;}

	#main_partners li a{padding:10px 10px;}
	#main_partners li span{font-size:14px;}
	#main_partners li a span i{margin:3px 0 0px 0px; }
	
	#main_partners li h6{font-size:16px;line-height:28px; letter-spacing:-0.85pt; margin:9px 0 10px; height:100%;line-height:125%;}
	#main_partners li div{font-size:13.5px; letter-spacing:-0.5pt; line-height:110%; height:100%;margin-bottom: 0%;}
	#main_partners li p{font-size:13.5;margin-bottom: 3%; display: none;}

	/* 공지사항 내용 부분 */ 
	#main_partners li a div {font-size:13.5px; letter-spacing:-0.5pt; line-height:110%}
	#main_partners li a div p{font-size:13.5px; letter-spacing:-0.5pt; line-height:110%; display: block;}
	
		
	#customer {padding:30px 0;}
	#customer strong {display:block; font-size:25px; line-height:25px; margin-right:0px; margin-bottom:10px;}
	#customer strong img {}	
	#customer p {font-size:14px;}	
	#customer span {font-size:16px;}	

}

/*******************************************************************************
	@media ~480px
*******************************************************************************/
@media all and (max-width:480px){

	/* Contents */
	#main_container p.stit {width:96%; margin:0 auto; word-break:keep-all;}
	#main_container p.stit br {display:none;}

	#about ul {margin:20px auto 0 auto;}	
	#about li a {height:60px; padding-top:130px; padding-bottom:20px;}
	#about li a p {font-size:18px;margin-bottom:5px;}
	#about li a span {font-size:11px; line-height:140%; letter-spacing: -0.5pt;}	
	#about li.one a {background:#fff url('/images/main/about_icon1.png') center 25px no-repeat;}
	#about li.two a {background:#fff url('/images/main/about_icon2.png') center 25px no-repeat;}
	#about li.three a {background:#fff url('/images/main/about_icon3.png') center 25px no-repeat;}
	#about li.four a {background:#fff url('/images/main/about_icon4.png') center 25px no-repeat;}
	#about li.one a:hover {background:#2172e1 url('/images/main/about_icon1_up.png') center 22px no-repeat;}
	#about li.two a:hover {background:#2172e1 url('/images/main/about_icon2_up.png') center 22px no-repeat;}
	#about li.three a:hover {background:#2172e1 url('/images/main/about_icon3_up.png') center 22px no-repeat;}
	#about li.four a:hover {background:#2172e1 url('/images/main/about_icon4_up.png') center 22px no-repeat;}

	#customer {padding:25px 0 15px 0;}	
	#customer p {font-size:13px;}	
	#customer span {font-size:15px;}	
	
}

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

	#main_banner .one br:nth-child(2),
	#main_banner .two br:nth-child(1) {
		display:block;
	}
	#main_banner .one{
		background-size:96px;
		background-position-y:30px;
	}
	#main_banner .two{
		background-size:115px;
		background-position-y:30px;
	}

}

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

	#main_banner .one{
		background-size:76px;
	}
	#main_banner .two{
		background-size:95px;
	}

}