@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;900&display=swap');
@font-face {
    font-family: 'SUIT-Regular';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_suit@1.0/SUIT-Regular.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}


* {
  margin: 0;
  padding: 0; }

body {
  font-family: 'SUIT-Regular', sans-serif;
  line-height: 1;
  font-size: 13px;
  background: #fff;
  color: #848484;
  font-weight: 300;
  overflow-x: hidden;
  word-break: keep-all; word-wrap: break-word;
}

p {
  color: #6a6a6a;
  font-size: 14px;
  line-height: 1;
	}

a,
a:hover,
a:focus {
  -webkit-transition-duration: 500ms;
  transition-duration: 500ms;
  text-decoration: none;
}

ul,
ol {
  margin: 0; }
  ul li,
  ol li {
    list-style: none; }

img {
  height: auto;
  max-width: 100%;
  border:0;
  outline:none;
  }






/* :: 4.0 Header Area CSS */
.header-area {
  position: absolute;
  z-index: 100;
  width: 100%;
  top: 0px;
  left: 0;
  z-index: 300; }
  .header-area .musica-main-menu {
    position: relative;
    width: 100%;
    height: 95px;
    background-color: rgba(0, 0, 0, 0.5);
    padding: 0 5%; }
    @media only screen and (max-width: 767px) {
      .header-area .musica-main-menu {
        height: 70px; } }
    .header-area .musica-main-menu .classy-nav-container {
      background-color: transparent; }
    .header-area .musica-main-menu .classy-navbar {
      background-color: transparent;
      height: 95px;
      padding: 0; }
      @media only screen and (max-width: 767px) {
        .header-area .musica-main-menu .classy-navbar {
          height: 70px; justify-content: flex-end; /* 모바일일때 flex정렬값 */ } }


      .header-area .musica-main-menu .classy-navbar .classynav ul li a {
        font-weight: 500;
        text-transform: uppercase;
        color: #ffffff;
        font-size: 16px;
		font-family: 'Poppins', sans-serif;
		}


		 @media only screen and (max-width: 1200px) {
			.header-area .musica-main-menu .classy-navbar .classynav ul li a { font-size:14px; padding: 0px 10px; }
			
		 }

      .header-area .musica-main-menu .classy-navbar .classynav ul li .on {color:#7ecef4;}

        /*@media only screen and (min-width: 1200px) and (max-width: 1260px) {
          .header-area .musica-main-menu .classy-navbar .classynav ul li a {
            font-size: 16px;
            padding: 0 7px; } }*/
        /*@media only screen and (min-width: 1040px) and (max-width: 1199px) {
          .header-area .musica-main-menu .classy-navbar .classynav ul li a {
            font-size: 14px;
            padding: 0 4px; } }*/
		@media only screen and (min-width: 992px) and (max-width: 1039px) {
          .header-area .musica-main-menu .classy-navbar .classynav ul li a {
            font-size: 14px;
            padding: 0 5px; } }
        .header-area .musica-main-menu .classy-navbar .classynav ul li a:hover, .header-area .musica-main-menu .classy-navbar .classynav ul li a:focus {
          color: #7ecef4; }
        @media only screen and (max-width: 991px) {
          .header-area .musica-main-menu .classy-navbar .classynav ul li a {
           color:#fff; } }
        /*@media only screen and (max-width: 767px) {
          .header-area .musica-main-menu .classy-navbar .classynav ul li a {
            background-color: #000; } }*/


      .header-area .musica-main-menu .classy-navbar .mega_title {background-color: #3c92ca; color:#fff !important; width:100%; text-align:center; padding:5px; font-size:16px; border-radius:3px;}




	  .header-area .musica-main-menu .classy-navbar .classynav ul li.megamenu-item > a::after,
      .header-area .musica-main-menu .classy-navbar .classynav ul li.has-down > a::after {
        color: #000; }
      .header-area .musica-main-menu .classy-navbar .classynav ul li ul li a {
        color: #262626; }
        @media only screen and (min-width: 992px) and (max-width: 1199px) {
          .header-area .musica-main-menu .classy-navbar .classynav ul li ul li a {
            padding: 0 15px; } }
        @media only screen and (min-width: 768px) and (max-width: 991px) {
          .header-area .musica-main-menu .classy-navbar .classynav ul li ul li a {
            color: #ffffff; } }
        @media only screen and (max-width: 767px) {
          .header-area .musica-main-menu .classy-navbar .classynav ul li ul li a {
            color: #ffffff; } }
    .header-area .musica-main-menu .top-social-info {
      margin-left: 70px; }
      @media only screen and (min-width: 992px) and (max-width: 1199px) {
        .header-area .musica-main-menu .top-social-info {
          margin-left: 40px; } }
      @media only screen and (min-width: 768px) and (max-width: 991px) {
        .header-area .musica-main-menu .top-social-info {
          margin-left: 25px;
          margin-top: 30px;
		  } 
		  .top-social-info > a > img { width:20px; }
		  }
		  
      @media only screen and (max-width: 767px) {
        .header-area .musica-main-menu .top-social-info {
          margin-left: 20px;
          margin-top: 30px;} }
      .header-area .musica-main-menu .top-social-info a {
        display: inline-block;
        color: #ffffff;
        padding: 10px 10px;
        font-size: 14px; }
        @media only screen and (min-width: 992px) and (max-width: 1199px) {
          .header-area .musica-main-menu .top-social-info a {
            padding: 0 5px; } }
  .header-area .is-sticky .musica-main-menu {
    position: fixed;
    width: 100%;
    height: 95px;
    top: 0;
    left: 0;
    z-index: 9999;
    background-color: rgba(0, 0, 0, 0.5);
    box-shadow: 0 5px 50px 15px rgba(0, 0, 0, 0.2); }
    @media only screen and (max-width: 767px) {
      .header-area .is-sticky .musica-main-menu {
        height: 70px; } }



@media only screen and (min-width: 768px) and (max-width: 991px) {
  .breakpoint-on .classy-navbar .classy-menu {
    background-color: #0c0527; } }
@media only screen and (max-width: 767px) {
  .breakpoint-on .classy-navbar .classy-menu {
    background-color: #0c0527; } }

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .classynav ul li .megamenu .single-mega.cn-col-4 {
    padding: 0; } }
@media only screen and (max-width: 767px) {
  .classynav ul li .megamenu .single-mega.cn-col-4 {
    padding: 0; } }

.classycloseIcon .cross-wrap span {
  background: #ffffff; }

/* :: 5.0 Hero Slides Area */
.hero-area {
  position: relative;
  z-index: 1; }

.slide-down {
  position: absolute;
  bottom: 15px;
  z-index: 100;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  cursor: pointer; }
  .slide-down h6 {
    font-size: 16px;
    color: #ffffff;
    font-weight: 600;
    margin-bottom: 15px; }
  .slide-down .line {
    width: 3px;
    height: 60px;
    margin: 0 auto;
    background-color: #ffffff;
    -webkit-animation: slide_down 2s linear infinite;
    animation: slide_down 2s linear infinite; }

.hero-slides {
  position: relative;
  z-index: 1; }










/*	 게시판 리스트 부분 */
.tomatod4_board_title {font-size:20px; font-family:impact;}
.tomatod4_board_title a {color:#444;}
.tomatod4_board_con {padding-bottom:10px;}
.tomatod4_board_more {font-size:14px; color:#666;}
.tomatod4_board_more a {color:#666;}
.tomatod4_board_more span {font-weight:600;}







/*	 메인 맵 뽑아오기 */
.tomatod4_main_map {padding-top: 10px;}
.tomatod4_main_map .p_map .wrap_controllers {display:none;}
.tomatod4_main_map .p_map {width:100%;}
.tomatod4_main_map .root_daum_roughmap {width:100% !important; border-radius:0; padding:0; border:0;}










/* 서브카피와 페이지 중간 여백 */
.tmt_sub_pad50 {height:50px;}









/*	 각 단락 배경들 모바일일때 여백 정리 위아래 30으로 통일함 */
@media only screen and (max-width:991px) {

.tmt_main_2frame {padding:30px 0;}
.tmt_main_3frame {padding:30px 0;}
}




/* 게시판 및 게시판헤드 등 기타 버튼들 기본컬러 변경 */
.btn.btn-color {border: 1px solid #095789; background-color: #434343;}
.btn.active.btn-color, .btn.btn-color:hover, .btn.btn-color:focus, .btn.btn-color:active {background-color: #313131;}
.border-color, i.border-color, img.border-color {border-color: #434343;}




/* 모바일부분 광고 */
.tmt_add_size {padding:15px;}
.tmt_add_frame {width:100%; position:fixed; left:0; bottom:0; z-index:9999; text-align:center; background-color:#3c92ca; line-height:30px;}
.tmt_add_frame .text {padding:15px;}
.tmt_add_frame a {color:#fff;}
.tmt_add_frame img {width:100%;}





/* 페이지 타이틀과 설명 폰트 */
.tmt_page_title_text1 {font-size:30px; color: #000; font-weight:600;}


.tmt_page_title_text1 .line_1 {border-top: 1px dotted #464646; margin-top:40px; margin-bottom:10px;}
.line_2 {border-top: 1px dotted #464646; margin-top:60px; margin-bottom:60px;}













.clear:after { 
    content:""; 
    display:block; 
    clear:both;
}


/* 전화번호 pc:none */
/*.togo_tell { display:none; }
.togo_tell a { color:#fff; font-size:20px; }*/

/* 모바일 소셜 아이콘 pc:none */
/*.top-social-info_m { display:none; }*/


/* 전화번호, 모바일 소셜 아이콘 */
/*@media only screen and (max-width:991px) {
	.top-social-info_m { display:block; margin-top:80px; text-align:center; }
	.top-social-info_m > a { color:#fff !important; margin:0 10px; font-size:12px !important; }
	.top-social-info { display:none; }
	.togo_tell { display:block; text-align:center; margin-top:40px; color:#fff; font-size:20px; }
	
}*/



/* logo */
.nav-brand img { max-width:35px; }
.nav-brand span { color:#fff; font-family: 'Poppins', sans-serif; text-transform:uppercase; margin-left:10px;  }
@media (max-width:768px) { 
	.nav-brand img { max-width:50px; }
	.nav-brand span { display:none; }
}



/* knk_menu */
.knk_menu { position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); }

.knk_menu > li > a { padding:0 40px; }



@media (max-width:1800px) {
	.knk_menu > li > a { padding:0 20px; }
}
@media (max-width:1400px) {
	.knk_menu { margin-left:40px; }
	.knk_menu > li > a { padding:0 10px; }
}
@media (max-width:991px) {
	.knk_menu { position: static; left: 0; top: 0; transform: translate(0,0); margin-left:0; }
	
}





/* modal_contact */
.modal_contact { position:fixed; left:0; right:0; top:0; bottom:0;  z-index:-1; opacity:0; transition:.5s; }
.modal_contact.on { z-index:500; opacity:1; }
.modal_contact_bg { position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,.5); z-index:-1; opacity:0; transition:.5s; }
.modal_contact.on .modal_contact_bg { z-index:500; opacity:1; }
.modal_contact_box { position:absolute; left:50%; top:5%; transform:translateX(-50%); width:0; height:0; background:#fff; border-radius:20px; transition:.5s; opacity:0; z-index:-1;  }
.modal_contact.on .modal_contact_box { width:80%; height:80%; opacity:1; z-index:700; overflow-x:hidden; overflow-y:scroll; }
.m_close { position:absolute; left:50%; bottom:3%; transform:translateX(-50%); z-index:700; cursor:pointer; }
.m_close i { font-size:35px; color:#fff; }




/* knk_main_icon */
.knk_main_icon { display:flex; flex-flow:wrap; width:100%; }
.knk_main_icon .main_icon { width:25%; }
.knk_main_icon a { display:block; position:relative; }

.knk_main_icon .icon_img img { width:100%; }

.knk_main_icon .icon_text { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:100%; height:100%; background:#000; }
.knk_main_icon .icon_color1 { background:#070d2b; }
.knk_main_icon .icon_color2 { background:#001d0a; }
.knk_main_icon .icon_color3 { background:#210002; }
.knk_main_icon .icon_color4 { background:#100019; }
.knk_main_icon .icon_text1 { animation:mainicon 6s infinite;  }
.knk_main_icon .icon_text2 { animation:mainicon1 6s infinite;  }
.knk_main_icon .icon_text > span { color:#fff; text-align:center; position:absolute; top:50%; transform:translateY(-50%); width:100%; font-weight:500; font-family: 'Poppins', sans-serif; font-size:15px; text-transform:uppercase; }

@keyframes mainicon {
	0% { opacity:0;  }
	50% { opacity:1; }
	100% { opacity:0; }
}
@keyframes mainicon1 {
	0% { opacity:1;  }
	50% { opacity:0; }
	100% { opacity:1; }
}













/* knk_box1 */
.knk_box1 > ul > li { float:left; width:25%; overflow:hidden; } 

.knk_box1_img { position:relative; }
.knk_box1_img > img { width:100%; position:relative; transition:.4s; }

.knk_box1_txt { position:absolute; left:30px; top:30px; z-index:2; }
.knk_box1_txt1 { display:block; font-size:30px; color:#313131; font-weight:900;  }
.knk_box1_txt2 { display:block; font-size:16px; color:#313131; font-weight:500; margin-top:10px; }
.knk_box1_txt3 { display:block; font-size:30px; color:#fff; font-weight:500; font-family: 'Poppins', sans-serif; text-transform:uppercase;  }
.knk_box1_txt4 { display:block; font-size:16px; color:#fff; font-weight:400; margin-top:10px; }

.knk_box1_line { position:absolute; left:0; top:0; width:100%; height:100%; }
.knk_box1_line > .w_line { position:absolute; background:#fff; transition:1s; }
.knk_box1_line > .b_line { position:absolute; background:#000; transition:1s; }
.knk_box1_line > .line1 { left:0; top:0; width:0; height:8px; opacity:0; }
.knk_box1_line > .line2 { right:0; top:0; height:0; width:8px; opacity:0; }
.knk_box1_line > .line3 { right:0; bottom:0; width:0; height:8px; opacity:0; }
.knk_box1_line > .line4 { left:0; bottom:0; height:0; width:8px; opacity:0; }


.knk_box1_contents > a:hover .knk_box1_img > img { transform:scale(1.1); }

.knk_box1_contents > a:hover .knk_box1_line > .line1 { width:100%; opacity:1; }
.knk_box1_contents > a:hover .knk_box1_line > .line2 { height:100%; opacity:1; }
.knk_box1_contents > a:hover .knk_box1_line > .line3 { width:100%; opacity:1; }
.knk_box1_contents > a:hover .knk_box1_line > .line4 { height:100%; opacity:1; }

@media only screen and (max-width:1200px) { 
	.knk_box1_txt1 { font-size:25px; }
	.knk_box1_txt2 { font-size:14px; }
	.knk_box1_txt3 { font-size:25px; }
	.knk_box1_txt4 { font-size:14px; }
}
@media only screen and (max-width:991px) { 
	.knk_box1 > ul > li { width:50%; }
}
@media only screen and (max-width:768px) {
	.knk_box1 > ul > li { width:100%; }
	.knk_box1_txt1 { font-size:20px; }
	.knk_box1_txt2 { font-size:12px; }
	.knk_box1_txt3 { font-size:20px; }
	.knk_box1_txt4 { font-size:12px; }

	.knk_box1_line > .line1 { height:4px; }
	.knk_box1_line > .line2 { width:4px; }
	.knk_box1_line > .line3 { height:4px; }
	.knk_box1_line > .line4 { width:4px; }
}



/* knk_box2 */
.knk_box2 { padding-top:120px; }
.knk_box2_title { text-align:center; color:#1b1b1b; text-transform:uppercase;  }
.knk_box2_txt1 { font-size:40px; font-weight:500; line-height:1.4; margin-bottom:3px; font-family: 'Poppins', sans-serif; }
.knk_box2_txt2 { font-size:18px; font-weight:400; line-height:1.6; }


/* knk_box2(tab) */
.knk_box2_contents { margin-top:50px; }

.knk_box2_tab_title { margin-bottom:30px; }
.knk_box2_tab_title > ul { display:flex; flex-flow:wrap; width:100%; justify-content:center;  }
.knk_box2_tab_title > ul > li {  }
.knk_box2_tab_title_li > a { display:block; margin:0 10px; font-size:15px; font-weight:400; color:#1b1b1b; font-family: 'Poppins', sans-serif; text-transform:uppercase; }

.knk_box2_tab_contents { background:none; }

@media only screen and (max-width:768px) {
	.knk_box2_tab_title_li > a { font-size:12px; margin:10px; }
}



/* knk_box3 */
.knk_box3 { height:388px; background:url(img/knk_box3_bg.jpg) no-repeat 50% 50%; background-size:cover; background-attachment: fixed; }

.knk_box3_text_box { text-align:center; color:#fff; padding:125px 5px 0; }
.knk_box3_text1 { font-size:40px; font-weight:700; line-height:1.4; font-family: 'Poppins', sans-serif;  }
.knk_box3_text2 { font-size:18px; font-weight:400; line-height:1.6; margin:20px 0 30px; text-transform:uppercase; }
.knk_box3_more a { display:block; font-size:18px; font-weight:500; width:207px; height:46px; line-height:42px; margin:0 auto; background:#00a1e9; color:#fff; border:2px solid transparent; transition:.3s;  }
.knk_box3_more a:hover { border:2px solid #fff; }

@media only screen and (max-width:768px) {
	.knk_box3_text1 { font-size:30px; }
	.knk_box3_text2 { font-size:15px; }
}




/* knk_box4 */
.knk_box4_wrap { max-width:1600px; margin:0 auto; }

.knk_box4_contents1_text1 { font-size:30px; line-height:1; font-weight:400; color:#000; font-family: 'Poppins', sans-serif;  }
.knk_box4_contents1_text2 { font-size:15px; line-height:1.6; font-weight:400; color:#000;  }

.knk_box4_contents2_text1 { font-size:30px; line-height:1; font-weight:400; color:#000; font-family: 'Poppins', sans-serif; text-transform:uppercase;  }
.knk_box4_contents2_text2 { font-size:15px; line-height:1.6; font-weight:400; color:#000;  }
.knk_box4_contents2_text3 { font-size:16px; line-height:1.8; font-weight:400; color:#434343;  }
.knk_box4_contents2_text3 > i { margin-right:8px; }
.knk_box4_contents2_text3 > span { font-family: 'Poppins', sans-serif; }

.knk_box4_location_txt { font-size:20px; margin-bottom:10px; font-weight:500; color:#313131; text-transform:uppercase; font-family: 'Poppins', sans-serif; }

.knk_box4_map { width:100%; height:310px; }
.knk_box4_map > .root_daum_roughmap { width:100% !important; }

.knk_box4_img1 a { display:block; position:relative;  }
.knk_box4_img1 a img { width:100%; }
.knk_box4_img1 a:before {  width:0; content:''; position:absolute; left:0; top:0; height:100%; background:url(img/knk_box4_img_hover_01.png) no-repeat; }
.knk_box4_img2 a:before { background:url(img/knk_box4_img_hover_02.png) no-repeat; }
.knk_box4_img3 a:before { background:url(img/knk_box4_img_hover_03.png) no-repeat; }
.knk_box4_img1 a.on:before { animation:width1 1s; animation-fill-mode:both;   }
.knk_box4_img1 a.off:before { animation:width2 1s; animation-fill-mode:both;  }

@keyframes width1 {
	0% { width:0; opacity:0; background-size:cover; }
	100% { width:100%; opacity:1; background-size:cover; }
}
@keyframes width2 {
	0% { width:100%; opacity:1; background-size:cover; }
	100% { width:0; opacity:0; background-size:cover; }
}

@media only screen and (max-width:768px) {
	.knk_box4_contents1_text2 { font-size:16px; }
	.knk_box4_contents1_text2 > br { display:none; }
	.knk_box4_contents2_text2 { font-size:16px; }
}






@media only screen and (max-width:991px) {
	.togo_f_text1 > br { display:none; }
}





/* footer1 */
.footer1 { background:#313131; padding:20px 0; }
.footer1_text { color:#fff; text-align:center; }
.footer1_text > a { color:#fff; font-size:13px; }


/* footer1 반응형 */
@media (max-width: 991px) {
	.footer1_text > a { font-size:12px; letter-spacing:-1px; }
}

/* knk_footer_box*/
.knk_footer_box { background:#434343; padding:30px 0; }
.knk_f_text1 { color:#fff; line-height:1.8; }
.knk_copy { color:#fff; font-size:13px; line-height:1.8; }
.knk_copy > a { color:#fff; }
.knk_admin { margin-top:10px; }
.knk_admin > a { color:#fff;  }