


/*======================================
main_var 버젼 공통 css
======================================*/
:root {
  --mainpadding: 110px 0px;
}


@media (min-width: 768px) and (max-width: 1024px) {
  :root {
    --mainpadding: 80px 0px;
  }



}

@media (max-width: 767px) {
  :root {
    --mainpadding: 50px 0px;
  }
}

/*======================================
메인 공통 스타일 제목
======================================*/

.maincom strong {font-size: inherit;  color: inherit;}
	h3.maincom { line-height:1.1;}

h4.maincom {font-weight:400; line-height:1.5; color:#858585;}
h4.maincom strong{font-weight:600;}




@media (min-width: 1025px) {
	h3.maincom { font-size:82px;}
	h4.maincom {font-size:23px; padding:30px 0px;}
}



@media (min-width:768px) and (max-width:1024px) {
	h3.maincom { font-size:52px;  }
	h4.maincom {font-size:20px; padding:30px 0px;}
}



@media (max-width: 767px) {
	h3.maincom { font-size:35px;  }
	h4.maincom {font-size:17px; padding:20px 0px;}
}







/*======================================
mv_main
======================================*/

.mv_main {
  width: 100%;
  aspect-ratio: 16 / 9;
  z-index: 1;
  background: #000;
  overflow: hidden;
}

.mv_main video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.7;
  display: block;
}


@media (max-width: 1023px) {
.mv_main { margin-top:50px;
  aspect-ratio: 16 / 15;
}



}

@media (min-width: 768px) and (max-width: 1024px) {

}

@media (max-width: 767px) {

}




/*======================================
vision_wrapper
======================================*/
.vision_wrapper {overflow:hidden; width:100%; 
padding:var(--mainpadding); 
position:relative;
background:url('/kor/images/main/vision_bg.gif') no-repeat center right; background-size:cover;}
.vision_wrapper  .int {width:580px;}
	.vision_wrapper  .int h3{color:var(--red);}
	.vision_wrapper  .int strong {font-size: inherit; line-height: inherit;  color: inherit;}
	.vision_wrapper  .int h3 strong{font-weight:600; }


.vision_wrapper  .chartin { width:980px; 
position:absolute; top:50%; transform:translateY(-50%); right:0px;
align-items: flex-start; display:flex; flex-wrap:wrap; align-content: center;}
.vision_wrapper  .chartin div {  width:calc((116% / 3 ) + 0px);   position:relative;
  aspect-ratio: 1 / 1;  align-content: center;  color:#fff;   margin-left:-8%;}
.vision_wrapper  .chartin dl  {position:absolute; top:50%; transform:translateY(-50%); padding-left:20%;}

.vision_wrapper  .chartin dl dt {color:#fff; font-size:17px; }
.vision_wrapper  .chartin dl dd{color:#fff; font-size:27px; font-weight:600;}

.vision_wrapper  .chartin div img {width:100%;}

.vision_wrapper  .chartin div:nth-child(1) {z-index:3; margin-left:0px;}
.vision_wrapper  .chartin div:nth-child(2) {z-index:2;}
.vision_wrapper  .chartin div:nth-child(3) {z-index:1;}

.websmall_br {width:100%; display:block;}


.a_arrow_type02 {border:1px solid var(--black); display:inline-block; font-size:20px; padding-left:20px; line-height:2.5;}



@media (min-width: 1650px) {
.vision_wrapper  .chartin { width:1100px;   right:0px;} 
}

@media (min-width: 1500px) {
	.websmall_br{width:20px; display:inline-block;}

}



@media (min-width: 1025px) and (max-width:1300px) {

.vision_wrapper  .chartin { width:860px; right:-110px;}
.vision_wrapper  .chartin div {    margin-left:-8%;}
.vision_wrapper  .chartin dl  {padding-left:19%;}



}

@media (min-width: 1025px) {


}




@media (max-width: 1024px) {
.vision_wrapper {height:890px;}

.vision_wrapper  .int {width:350px; }
.vision_wrapper .int h3 {line-height:1;}
	.websmall_br{width:10px; display:inline-block;}
.vision_wrapper  .chartin { width:310px; top:60px; transform:translateY(0); }

.vision_wrapper  .chartin div {  width:100%; margin-left:0%; margin-top:-80px;}
.vision_wrapper  .chartin div:nth-child(1) { margin-top:0px;}
.vision_wrapper  .chartin dl  {position:absolute; top:110px; z-index:3;
 width:100%; text-align:Center; transform:translateY(-50%); padding-left:0%;}
.vision_wrapper  .chartin dl dt { font-size:15px; }
.vision_wrapper  .chartin dl dd{font-size:24px; }
.vision_wrapper  .chartin div img {  position: absolute; z-index:1; display:flex;
  top: 50%;   
  left: 50%;
  transform: translate(-50%, -50%) rotate(90deg);transform-origin: center;}

}



@media (min-width: 768px) and (max-width: 1024px) {
}

@media (max-width: 767px) {
.vision_wrapper {height:auto;}
.vision_wrapper  .int {width:100%; }
.vision_wrapper  .chartin { width:280px;   padding-bottom:60px;
position:relative; margin:0 auto;}
.a_arrow_type02 {font-size:17px;}


}




/*======================================
education_wrap
======================================*/

    .education_wrap {padding:var(--mainpadding);    }
    .education_grid { overflow:hidden; }


        .education_wrap .tab-menu {
      margin-top: 40px;
    }



        .education_wrap .tab-menu button {
      display: block;
      background: none;
      border: none;
      font-size: 28px; line-height:1.3;
      margin:20px 0px;
      cursor: pointer;
      color: #999;
      text-align: left; letter-spacing:-2px;
			border-bottom-width: 4px;
			border-bottom-style: solid;
			border-bottom-color: transparent;
    }
    .tab-menu button.active {
	  border-bottom-color: var(--red);
      font-weight: 600;
	  color:var(--black);
    }

    .education_right {
      flex: 1 ;  overflow:hidden;
    }
            .education_wrap .tab-content {
      display: none;
    }
            .education_wrap .tab-content.active {
      display: block;
    }
           .education_wrap  .custom-controls-wrapper {
      display: flex; 
      justify-content: end;
      align-items: center; gap:20px; 
      margin-bottom: 10px;
      flex-wrap: wrap;
    }
           .education_wrap  .custom-dots {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
    }
           .education_wrap  .custom-dots .dot {
      width: 8px;
      height: 8px;
      border-radius: 50%;
      background: #ccc;
      cursor: pointer;
    }
           .education_wrap  .custom-dots .dot.active {
      background:var(--red);
    }
           .education_wrap  .custom-controls {
      display: flex;
      align-items: center;
      gap: 12px;
    }
           .education_wrap  .custom-controls button {
      width: 36px;
      height: 36px;
      border-radius: 50%;
      background: #eee;
      border: none;
      font-size: 16px;
      cursor: pointer;
    }

           .education_wrap  .custom-controls button svg {width:20px; height:20px; margin-top:8px;}

            .education_wrap .slider {
      position: relative;
    }
            .education_wrap .card { 
box-shadow:5px 5px 5px rgba(0,0,0,0.2);
      color: #fff; margin:10px; cursor:pointer;
      border-radius: 16px;
      overflow: hidden;
      transition: transform 0.3s ease;
      flex-shrink: 0;
      width: 100%;
      aspect-ratio: 4 / 5.3;
      display: flex; position:relative;
      flex-direction: column;

    }
            .education_wrap .card:nth-child(2n){margin-top:100px;}

.education_wrap .card::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100px;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%);
  z-index: 2;
  pointer-events: none;
}


.education_wrap .card dl { position:absolute; z-index:3;
 bottom:0; lefT:0; width:100%; padding:30px; box-sizing:border-box; 
}

.education_wrap .card dl  dt {font-size:16px; line-height:1.5;padding-bottom:15px; color:#fff;}
.education_wrap .card dl  dd {font-size:24px; font-weight:700; line-height:1.5; color:#fff;}


   .education_wrap  .card:hover {
      transform: scale(1.03);
    }
    .education_wrap .card img {
      width: 100%;
      height: 100%;
      object-fit: cover;
	  position:relative; z-index:1;
    }



@media (min-width: 1025px) {

    .education_left {
      width:400px; 
    }

.education_wrap .card dl  dt {font-size:19px; }
.education_wrap .card dl  dd {font-size:28px; }





}





@media (min-width: 768px) and (max-width: 1024px) {
    .education_left {
      width:300px;  
    }

        .education_wrap .tab-menu button {
      font-size: 24px; 
    }
}



@media (max-width: 767px) {
    .education_left {width:100%; }
		.education_right {flex-basis:100%; padding-top:20px;}
.education_wrap .tab-menu {display:flex; flex-wrap:Wrap; gap:10px 20px; margin-top:0}
        .education_wrap .tab-menu button {
      font-size: 21px;  margin:0;
    }

            .education_wrap .card:nth-child(2n){margin-top:60px;}

.education_wrap .card::before {
  height: 60px;
}
            .education_wrap .card {  margin:10px 5px; }
.education_wrap .card dl { padding:20px;}
.education_wrap .card dl  dd {font-size:21px; }

}


@media (max-width: 400px) {
            .education_wrap .card {  margin:10px 25px; }
}




/*======================================
board_wrapper 
======================================*/

    .board_wrapper {
      width:100%; text-align:Center; padding: var(--mainpadding);
    }
    .board_wrapper h2 {font-size:45px;  padding-bottom:20px;line-height:2; font-weight:800;}

    .board_wrapper .notice_tabs {
      display: flex; 
      justify-content: center;
      gap:0px;
      margin-bottom: 30px;
      font-size: 18px;
    }

    .board_wrapper .notice_tabs button {
      background: none;
	  border-style:solid; width:170px;
		  border-color: #eeeeee;
		  border-width:0px 0px 2px 0px;
      cursor: pointer; padding:20px 0px;
      color: #888; position:relative;
      font-size: 20px;
    }

    .board_wrapper .notice_tabs button:before {content:''; position:absolute; right:0px; width:1px; height:16px;
	background:rgba(0,0,0,0.2); top:50%; transform:translateY(-50%)}
    .board_wrapper .notice_tabs button:last-child:before {display:none}
    .board_wrapper .notice_tabs button.active {
      color: var(--red);
		  border-color: var(--red);
    }
    .board_wrapper .notice_slider_wrap {
      position: relative;
    }

    .board_wrapper .notice_slider {
      display: flex; padding:30px 0px;
      align-items: stretch;
      width: 100%;
    }


    .board_wrapper .notice_card {
      overflow: hidden; text-align:left;
	  padding:10px 20px;cursor:pointer;
      flex-shrink: 0;
		  transition: transform 0.3s ease;

    }

.board_wrapper .notice_card:hover {
  transform: translateY(-4px);

}



    .board_wrapper .notice_card .tit_line  {padding:25px 0px;}
    .board_wrapper .notice_card .tit_line dt {color:var(--red)}

    .board_wrapper .notice_card .tit_line dd{font-size:20px; line-height:1.5; }

    .board_wrapper .notice_card p.img {
      width: 100%;
      aspect-ratio: 4 / 3;
  /*background-color:rgba(0,0,0,0.1);*/ 
  background-image:url('/nimg/logo.png');
  background-position:center center;
  background-size:60% auto ;
  background-repeat:no-repeat;
  background-blend-mode: luminosity;
  border: 1px solid #ccc;
  border-radius: 20px


    }


    .board_wrapper .notice_card p.img img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
	  border-radius: 20px;
	  object-position:top;
    }

    .board_wrapper .notice_card .line_data {border-top:1px solid #ddd; padding:20px 0px; display:flex; flex-wrap:wrap;  justify-content: space-between;}
    .board_wrapper .notice_card:hover  .line_data {border-top:1px solid var(--red); }

    .board_wrapper .notice_card .line_data dt {
color:#a9a9a9;
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'none'%20viewBox%3D'0%200%2024%2024'%20stroke-width%3D'1.5'%20stroke%3D'%23bbb'%20class%3D'size-6'%3E%3Cpath%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%20d%3D'M12%206v6h4.5m4.5%200a9%209%200%201%201-18%200%209%209%200%200%201%2018%200Z'%20%2F%3E%3C%2Fsvg%3E");
background-size: auto 20px;
background-repeat: no-repeat;
background-position: left 0px center;
padding-left:25px;
}


    .board_wrapper .notice_card .line_data dd {
	color:#a9a9a9;
		font-weight:600; letter-spacing:0;
		background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%20fill%3D'%23bbb'%20class%3D'size-6'%3E%3Cpath%20fill-rule%3D'evenodd'%20d%3D'M12%202.25c-5.385%200-9.75%204.365-9.75%209.75s4.365%209.75%209.75%209.75%209.75-4.365%209.75-9.75S17.385%202.25%2012%202.25ZM12.75%209a.75.75%200%200%200-1.5%200v2.25H9a.75.75%200%200%200%200%201.5h2.25V15a.75.75%200%200%200%201.5%200v-2.25H15a.75.75%200%200%200%200-1.5h-2.25V9Z'%20clip-rule%3D'evenodd'%20%2F%3E%3C%2Fsvg%3E");
		background-size: auto 27px;
		background-repeat: no-repeat;
		background-position: right center;
		padding-right:40px;
}


    .board_wrapper .notice_card:hover   .line_data dd {
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%20fill%3D'%23d82228'%20class%3D'size-6'%3E%3Cpath%20fill-rule%3D'evenodd'%20d%3D'M12%202.25c-5.385%200-9.75%204.365-9.75%209.75s4.365%209.75%209.75%209.75%209.75-4.365%209.75-9.75S17.385%202.25%2012%202.25ZM12.75%209a.75.75%200%200%200-1.5%200v2.25H9a.75.75%200%200%200%200%201.5h2.25V15a.75.75%200%200%200%201.5%200v-2.25H15a.75.75%200%200%200%200-1.5h-2.25V9Z'%20clip-rule%3D'evenodd'%20%2F%3E%3C%2Fsvg%3E");
 }

    .board_wrapper  .detail_button {display:inline-block; background-color:#333; border-radius:50px; margin-top:50px;
	color:#fff; font-size:17px; line-height:1.5; padding:20px 40px; width:260px; text-align:left; letter-spacing:0;
			font-weight:600;
			background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%20fill%3D'%23fff'%20class%3D'size-6'%3E%3Cpath%20fill-rule%3D'evenodd'%20d%3D'M12%203.75a.75.75%200%200%201%20.75.75v6.75h6.75a.75.75%200%200%201%200%201.5h-6.75v6.75a.75.75%200%200%201-1.5%200v-6.75H4.5a.75.75%200%200%201%200-1.5h6.75V4.5a.75.75%200%200%201%20.75-.75Z'%20clip-rule%3D'evenodd'%20%2F%3E%3C%2Fsvg%3E");
		background-size: auto 25px;
		background-repeat: no-repeat;
		background-position: right 30px center;
	
	}



    .board_wrapper .slider-nav-button {
      position: absolute;
      transform: translateY(-50%);
      background: #d32f2f;
      border: none;
      border-radius: 50%;
      width: 70px;
      height: 70px;
      color: #fff;
      cursor: pointer;
      z-index: 10;
    }
    .board_wrapper .slider-prev {
      left:34px;
      top: 50%;
    }
    .board_wrapper .slider-next {
      right:34px;
      top: 50%;
    }

    .board_wrapper .slider-nav-button svg {
		width:30px; height:30px;  margin-top:5px; 
    }







@media (min-width: 768px) and (max-width: 1024px) {

  

 .board_wrapper h2 {font-size:35px;}
    .board_wrapper .notice_tabs button {
width:150px;
      font-size: 19px;
    }

    .board_wrapper .notice_slider {padding:20px 0px; }

    .board_wrapper .notice_card {
	  padding:10px 10px;

    }

    .board_wrapper .notice_card .line_data { padding:15px 0px;}


    .board_wrapper .slider-nav-button {
      width: 60px;
      height: 60px; 
    }
    .board_wrapper .slider-prev {
      left:24px; 
    }
    .board_wrapper .slider-next {
      right:24px; 
    }

    .board_wrapper .slider-nav-button svg {
		width:20px; height:20px;  
    }


    .board_wrapper .notice_slider {padding:20px 0px ; }

    .board_wrapper .notice_card {
	  padding:0px 10px;

    }





}

@media (max-width: 767px) {
 .board_wrapper h2 {font-size:27px; line-height:1.3; padding-left:10px; padding-right:10px;}
    .board_wrapper .notice_tabs button {
width:auto; padding-left:13px; padding-right:13px; font-size:17px;
    }

    .board_wrapper .slider-nav-button {
      width: 40px; top:30%;
      height: 40px;
    }
    .board_wrapper .notice_slider {padding:10px 0px ; }

    .board_wrapper .slider-nav-button svg {
		width:17px; height:17px;  
    }

    .board_wrapper  .detail_button {margin-top:20px; padding:20px 30px; width:210px
		background-size: auto 25px; font-size:16px;
		background-position: right 30px center;
	
	}



}




/*======================================
banner_under_zone
======================================*/
.banner_under_zone {background:url('/images/main/inbg.gif') no-repeat center center; background-size:cover; padding:70px 0px;}
.banner_under_zone  h3 {color:#fff; font-size:55px; line-height:1.3; font-weight:700;}
.banner_under_zone  h4 {color:#fff;  font-size:22px; line-height:1.3; padding:20px 0px 50px 0px;}
.banner_under_zone .a_arrow_type01 {color:#fff; font-size:20px;  line-height:2.5; padding-left:20px;
background-color:rgba(108 ,2 ,10 , 0.5); border:1px solid rgba(255,255,255,0.4)}

@media (min-width: 1025px) {




}

@media (min-width: 768px) and (max-width: 1024px) {

	.banner_under_zone {padding:70px 0px;}
	.banner_under_zone  h3 { font-size:45px;  }
	.banner_under_zone  h4 {font-size:20px;padding:20px 0px 30px 0px;}
	.banner_under_zone .a_arrow_type01 { font-size:18px;  }




}

@media (max-width: 767px) {
	.banner_under_zone {padding:50px 0px;}
	.banner_under_zone  h3 { font-size:30px;  }
	.banner_under_zone  h4 {font-size:18px;padding:10px 0px 30px 0px;}
	.banner_under_zone .a_arrow_type01 { font-size:18px;  }

}



