
/*header 수정*/
#headerArea{z-index: 10}
#headerArea .headerInner{max-width: 1400px; height: 90px; margin: 0 auto}
#headerArea .headerInner .headerBottom .header{padding-top: 0}
#headerArea .headerInner .headerBottom .logo a{margin: 0}
#headerArea .headerInner .topMenu{height: 45px}
#headerArea .headerInner .topMenu ul{float: right;
    position: unset;
    padding-top: 15px;
    width: 193px}
#headerArea .headerInner .headerBottom .logo a{width: 121px; height: 37px; background-size: 120px 37px}

#headerArea .headerInner .headerBottom #gnb{position: unset; float: left; margin-left: 6%; width: 63%}
#headerArea .headerInner .headerBottom #gnb ul li a.depth1{text-transform: uppercase; font-family: montserrat}

#headerArea .headerInner .headerBottom .select{position: unset; float: right}
#headerArea .headerInner .topMenu ul li:nth-child(1):after{top: 19px; right: 140px}
#headerArea .headerInner .topMenu ul li:nth-child(3):after{top: 19px; right: 69px}
ul.dropdownmenu{width: 900px}
ul.dropdownmenu li.m3 ul {left: -270px}
ul.dropdownmenu li.menu:last-child{margin-right: 0}
ul.dropdownmenu li ul li:last-of-type {border-radius: 0 0 5px 0}

/*main slider*/

.red-slide{width: 100%; height: 100%}
.main_slide{width: 100%; height: 1100px; position: absolute; z-index: 0}
.main_slide .swiper-slide{background-size: cover; background-position: 0 0}
.slide1{background: url(../images/main_nssao_visual1.jpg)}
.mb_text{display: none}
.slide2{background: url(../images/main_nssao_visual2.jpg)}
.slide3{background: url(../images/main_nssao_visual3.jpg)}
.slide4{background: url(../images/main_nssao_visual4.jpg)}


.swiper-pagination {
  position: absolute;
  z-index: 20;
  left: 50%;
  transform: translate(-50%);
  bottom: 300px
}

.swiper-button-prev{background: url(../images/icon_visual1.png) no-repeat}
.swiper-button-next{background: url(../images/icon_visual2.png) no-repeat}

.swiper-pagination-fraction, .swiper-pagination-custom, .swiper-container-horizontal > .swiper-pagination-bullets{bottom: 460px; left: 50%; width: 100px}
.swiper-button-prev, .swiper-container-rtl .swiper-button-next {
    left: 40%; top: 635px; width: 45px}
.swiper-button-next, .swiper-container-rtl .swiper-button-prev {
    right: 40%; top: 635px; width: 45px}
.swiper-button-prev:after, .swiper-button-next:after{font-size: 0}
.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet-active{margin: -1px 4px}

/*main text*/
.main-title{margin-top: 300px;
    text-align: left;
    max-width: 1400px;
    margin: 235px auto 0}
.main-title > p{width: 75%;
    padding: 50px 0 20px;
    font-size: 22.86px; text-shadow: 1px 1px 10px #000; position: relative}
.main-title > p:after{content: ''; position: absolute; top: 20px; left: 0; width: 5.5%; border-bottom: 3px solid #fff}
.main-title a{color: #fff;
    box-sizing: border-box;
    background: rgba(68,107,187,.7);
    margin-top: 42px; font-size: 14px; padding: 8px 20px;
    border-radius: 5px; font-family: Montserrat Light}
.mb_text{display: none}


/*content*/

#content{min-height: 290px;}
.empty{height: 720px}
.mb_end{display: none}

    /*main List left*/
.mainList{width: 100%; overflow: hidden}
.mainList_inner{width: 1400px; height: 235px; margin: 0 auto}
.list_l{float: left; width: 62%; text-align: left; }
.list_l ul{font-size: 0}
.list_l ul li{display: inline-block; width: 25%; height: 235px; position: relative; background: rgba(32,31,31,.8)}
.list_l ul li:first-child{border-radius: 10px 0 0 10px}
.list_l ul li:last-child{border-radius: 0 10px 10px 0}

.list_l ul li:hover,
.list_l ul li:active{background: rgba(55,60,132,.6); transition: all .3s}
.list_l ul li:hover h3{color: #4affff}
.list_l ul li:hover p{color: #c8ffff}
.list_l ul li:after{content: ''; position: absolute; right: 0; top: 45px; height: 145px; border-right: 1px solid #5f6072}
.list_l ul li:last-child:after{content: ''; border: 0}
.list_l ul li a{color: #fff; display: block; padding: 40px 25px}
.list_l ul li h3{font-family: Montserrat; font-size: 20.32px; text-transform: uppercase}
.list_l ul li span{float: right; font-family: Montserrat; font-weight: 100; font-size: 66.67px}
.list_l ul li p{font-family: Montserrat Light; font-size: 15.24px; padding-top: 35px; text-transform: uppercase}

    /*main List right*/
.list_r{float: right;  width: 35%; overflow: hidden}
.list_down{width: 49%; height: 235px; font-family: Montserrat; font-weight: bold}
.list_down_l{float: left}
.list_r ul li{}
.list_down_l ul{height: 100%; text-align: left; font-size: 17.78px}

.list_down_l ul li{height: 30.5%; margin-bottom: 10px}

.list_down_l ul li a{color: #fff; padding: 22px; display: block; background: rgba(83,92,89,.5); border-radius: 10px}
.list_down_l ul li a:hover,
.list_down_l ul li a:active{color: #95efff; background: rgba(55,60,132,.8)}

.icon{}
.icon a{position: relative}
.ico{width: 50px; height: 50px; display: block; position: absolute; right: 15px; top: 11px}
.ico_u{background: url(../images/icon_menu1.png) no-repeat}
.icon_u a:hover .ico_u{background: url(../images/icon_menu1_1.png) no-repeat}
.ico_m{background: url(../images/icon_menu2.png) no-repeat}
.icon_m a:hover .ico_m{background: url(../images/icon_menu2_1.png) no-repeat}
.ico_d{background: url(../images/icon_menu3.png) no-repeat}
.icon_d a:hover .ico_d{background: url(../images/icon_menu3_1.png) no-repeat}

.list_down_r{position: relative; float: right; border-radius: 10px; background: rgba(75,83,78,.5)}
.list_down_r a{color: #fff; padding: 22px; display: block; font-size: 17.78px; text-align: left; position: relative}
.list_down_r:hover,
.list_down_r:active{background: rgba(55,60,132,.8)}
.list_down_r:hover a,
.list_down_r:active a{color: #95efff}
.list_down_r:hover .ico_s,
.list_down_r:active .ico_s{background: url(../images/icon_menu4_1.png) no-repeat; position: absolute; top: 45px; right: 45px; width: 50px; height: 50px; z-index: 1}
.ico_s{background: url(../images/icon_menu4.png) no-repeat; position: absolute; top: 45px; right: 45px; width: 50px; height: 50px}
.ico_last{background: url(../images/icon_menu5.png) no-repeat; position: absolute; width: 164px; height: 164px; top:60px; right: 16%; transition: all .5s}

.main_search{width: 1400px; height: 50px; margin: 0 auto}
.form_search{position: relative; display: inline-block; float: right; border-bottom: 1px solid #6d6d6d; width: 490px}
.input_search{width: 85%; height: 50px; background: #000; color: #fff; font-family: Montserrat; letter-spacing: 2px; font-size: 12px}
/* placeholder 스타일 지정 */
input::placeholder {color: #898691}
input::-webkit-input-placeholder {color: #898691}
/* IE */
input:-ms-input-placeholder {color: #898691}
/* Firefox */
input:-mos-input-placeholder {color: #898691}
.button_search{width: 50px; height: 50px; float: right; background: url(../images/search.png) no-repeat; background-position: center}
.button_search:hover { opacity: .5}

/*footer*/

#footerArea{margin-top: 80px; width: 1400px}
#footerArea .footerLeft{margin: 47px 0}
#footerArea .footerLeft ul li{background: none; color: #a0a0a0}
#footerArea .footerLeft ul li.main_f{background: url(../images/icon1_footer.png) no-repeat; height: 18px; width: 16px; padding-right: 0px}
#footerArea .footerRight{width: 540px}
#footerArea .footerRight ul li{width: 270px; height: 45px; margin-right: 0}
#footerArea .footerRight ul li:nth-child(1) a{height: 45px}
#footerArea .footerRight ul li:nth-child(2) a{height: 45px}

#footerArea .footerLeft .language { color: #a0a0a0; }
.main-wrap #footerArea .footerLeft .language { color: #fff;  line-height: 40px;  }

/************************************
 * custom css 추가 bywoong
 ************************************/
.dropdownmenu li:first-child:nth-last-child(4), 
.dropdownmenu li:first-child:nth-last-child(4) ~ li { 
	margin-right: 8%; 
}

.dropdownmenu li:first-child:nth-last-child(5), 
.dropdownmenu li:first-child:nth-last-child(5) ~ li { 
	/* margin-right: 3.8%;  */
}


@media screen and (max-width:1400px) {
    #headerArea .headerInner{width: 98%}
    #headerArea .headerInner .headerBottom #gnb{width: 66%}
    ul.dropdownmenu li.menu:last-child{margin-right: 0}
    #wrap .swiper-container img{width: 70%}
    #wrap .swiper-container img.pc_text_three{width: 60%}
    #wrap .swiper-container img.pc_text_last{width: 40%}

    .main-title{width: 98%}
    .title{width: 98%}

    .mainList_inner{width: 98% }
    .list_down_l ul li:nth-of-type(2) a{padding: 9px 22px}
    .d{display: block}

    .main_search{width: 98%}
    .form_search{width: 35%}

    #footerArea{width: 98%}
}

@media screen and (max-width:1200px) {

    #headerArea .headerInner .headerBottom #gnb {width: 61%; margin-left: 5%}
    #headerArea .headerInner .headerBottom #gnb ul li a.depth1{font-size: 17px}
    ul.dropdownmenu li.m3 ul {left: -304px}
    .list_l ul li a{padding: 40px 10px}
    .list_l ul li p{font-size: 13px}
    .ico_last{right: 9%}

}

@media screen and (max-width:1035px) {
    #footerArea .footerRight{width: 267px; margin: 39px 0 0}
    #footerArea .footerRight ul li:nth-child(1) a{margin-left: 59px}
    .sm-screen #footerArea .footerRight {margin: 63px 0}
}

@media screen and (max-width:1024px) {
    .list_l ul li p{font-size: 12px}
    .ico_last{right: 1%}

    #footerArea .footerRight ul li{width: 267px; margin: 0 0 0 57px}
    #footerArea .footerRight ul li:nth-child(1) a{margin-left: 0}
    #footerArea .footerRight ul li:nth-child(2){width: 269px}

}

@media screen and (max-width:1000px) {
    #headerArea .headerInner .headerBottom .header{position: relative}
    #headerArea .headerInner .headerBottom #gnb{position: absolute; margin: 0; left: 0; top: 70px; width: 600px}
    .title > p{font-size: 17px}

    .list_l{width: 100%; margin-bottom: 15px}
    .list_r{width: 100%; overflow: visible}
    .list_l ul li p{font-size: 15px}
    .list_down_l ul li:nth-of-type(2) a{padding: 22px}
    .d{display: inline-block}
    .ico_last{right: 15%}

    .form_search{width: 49%}


}

@media screen and (max-width:768px) {

    body{background: #000}

    #headerArea{height: 110px}
    #headerArea .headerInner{width: 100%}
    #headerArea .headerInner .headerBottom .logo a{width: 310px; height: 61px; margin: 28px auto; background-size: auto}
    #headerArea .headerInner .headerBottom .header img{top:47px}

    #headerArea .headerInner .headerBottom #gnb{width: 100%; top: 110px}
    ul.dropdownmenu{width: 100%}
    ul.dropdownmenu li.menu{margin-right: 0 !important}
    ul.dropdownmenu li.m3 ul{left: 0}

    .swiper-container{height: 1305px}
    .main_slide{height: auto; z-index: 10; background: #000}
    .main_slide .swiper-slide{background-position: 0 90px; background-repeat: no-repeat}

    .slide1{background: url(../images/mb_nssao_visual1.jpg)}
    .slide2{background: url(../images/mb_nssao_visual2.jpg)}
    .slide3{background: url(../images/mb_nssao_visual3.jpg)}
    .slide4{background: url(../images/mb_nssao_visual4.jpg)}

    .swiper-pagination-fraction, .swiper-pagination-custom, .swiper-container-horizontal > .swiper-pagination-bullets{top: 530px}
    .swiper-button-next, .swiper-container-rtl .swiper-button-prev{right: 2%; top: 545px}
    .swiper-button-prev, .swiper-container-rtl .swiper-button-next{left: 2%; top: 545px}

    .main-title{text-align: center; margin: 200px auto 0}
    .title{text-align: center; margin: 300px auto 0}
    .title > p{display: none}
    .main-title > p{margin: 0 auto; font-size: 14px; padding: 40px 0 20px; text-align: center}
    .main-title > p:after{content: ""; border-bottom: 0}
    .main-title a{display: none}
    .title a{display: none}
    .pc_text{display: none}
    #wrap .swiper-container img{width: 80%}
    #wrap .swiper-container img.pc_text_three{width: 75%}
    #wrap .swiper-container img.pc_text_last{width: 55%}
    #wrap .swiper-container .mb_text{position: unset; margin: 0 auto}

    .empty{height: 699px; background: #000}
    #content{height: 800px; position: relative; z-index: 50}
    .mainList_inner{width: 95%}
    .list_l ul li{width: 48.9%; border-radius: 10px}
    .list_l ul li:first-child{border-radius: 10px; margin: 0 2.2% 2.2% 0}
    .list_l ul li:last-child{border-radius: 10px; margin-left: 2.2%}
    .list_l ul li:after{content: ''; border-right: 0}
    .list_l ul li p{width: 80%}

    .main_search{display: none}

    #footerArea{width: 100%; background: #000; margin-top: 0}
    #footerArea .footerLeft{margin: 30px 0}
    #footerArea .footerLeft nav{margin: 0px auto 0}
    #footerArea .footerLeft ul{font-size: 15px}
    #footerArea .footerLeft ul li.main_f{display: none}
    #footerArea .footerLeft ul li:first-child{padding: 0}
    #footerArea .footerLeft ul li:last-child{display: none}
    #footerArea .footerLeft address{font-size: 14px; color: #a0a0a0}
	#footerArea .footerLeft .mb_copyright{color: #a0a0a0; font-size: 13px}
    #footerArea .footerLeft .mb_copyright a.t{background-position: 0 -2px}
    #footerArea .footerRight{width: 100%; margin: 0 auto; padding: 0 0 5%}
    #footerArea .footerRight ul li{width: 220px; margin: 0}
}

@media screen and (max-width:500px) {

    #headerArea{height:90px}
    #headerArea .headerInner .headerBottom .logo a{background-size: 70%; margin: 15px auto}
    #headerArea .headerInner .headerBottom #gnb{top: 90px}
    #headerArea .headerInner .headerBottom .header img {top: 37px}

    .list_l ul li span{font-size: 55px}
    .list_r span{font-size: 15px}
    .d {display: block;}
    .list_down_l ul li:nth-of-type(2) a{padding: 18px 22px;}
    .ico_last{ background-size: 90%; right: 1%;}
    .list_down_l ul li:nth-of-type(2) a {line-height: 1em;}

    #footerArea .footerRight ul{display: inline-block}
    #footerArea .footerRight ul li:nth-child(1){margin: 0 auto}
}

@media screen and (max-width: 480px){
    .swiper-container {height: 699px}
    .main-title > p{font-size: 12px}
		
    #footerArea .footerRight ul li:nth-child(1) {width: 220px}
    #footerArea .footerRight ul li:nth-child(2) a {height: 80px; margin-top: 15px}
}

@media screen and (max-width:380px) {
    #wrap {min-width: 320px}
    .ico_last{right: -3%}




}
