@charset "utf-8";

/* 나눔폰트 적용 */
@font-face {
	font-family: 'NotoKrL';
	font-style: normal;
	font-weight: 100;
	src: local('Noto Sans Light'), local('NotoSans-Light'), url(/fonts/notokr-light.eot);
	src: url(/fonts/notokr-light.eot?#iefix) format('embedded-opentype'),
		 url(/fonts/notokr-light.woff2) format('woff2'),
		 url(/fonts/notokr-light.woff) format('woff');;
}

@font-face {
	font-family: 'NotoKrR';
	font-style: normal;
	font-weight: 300;
	src: local('Noto Sans Regular'), local('NotoSans-Regular'), url(/fonts/notokr-regular.eot);
	src: url(/fonts/notokr-regular.eot?#iefix) format('embedded-opentype'),
		 url(/fonts/notokr-regular.woff2) format('woff2'),
		 url(/fonts/notokr-regular.woff) format('woff');
}

@font-face {
	font-family: 'NotoKrM';
	font-style: normal;
	font-weight: 500;
	src: local('Noto Sans Medium'), local('NotoSans-Medium'), url(/fonts/notokr-medium.eot);
	src: url(/fonts/notokr-medium.eot?#iefix) format('embedded-opentype'),
		 url(/fonts/notokr-medium.woff2) format('woff2'),
		 url(/fonts/notokr-medium.woff) format('woff');
}

@font-face {
	font-family: 'NotoKrB';
	font-style: normal;
	font-weight: 700;
	src: local('Noto Sans Bold'), local('NotoSans-Bold'), url(/fonts/notokr-bold.eot);
	src: url(/fonts/notokr-bold.eot?#iefix) format('embedded-opentype'),
		 url(/fonts/notokr-bold.woff2) format('woff2'),
		 url(/fonts/notokr-bold.woff) format('woff');
}
@font-face {
    font-family: 'nanum-square-r';
    src: url('/fonts/nanumsquarer.eot');
    src: url('/fonts/nanumsquarer.eot?#iefix') format('embedded-opentype'),
         url('/fonts/nanumsquarer.woff2') format('woff2'),
         url('/fonts/nanumsquarer.woff') format('woff'),
         url('/fonts/nanumsquarer.ttf') format('truetype'),
         url('/fonts/nanumsquarer.svg#nanumsquarerregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'nanum-square-b';
    src: url('/fonts/nanumsquareb.eot');
    src: url('/fonts/nanumsquareb.eot?#iefix') format('embedded-opentype'),
         url('/fonts/nanumsquareb.woff2') format('woff2'),
         url('/fonts/nanumsquareb.woff') format('woff'),
         url('/fonts/nanumsquareb.ttf') format('truetype'),
         url('/fonts/nanumsquareb.svg#nanumsquarebregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

/* reset */
html,body{width:100%;  width:100%; height:100%;  margin:0px; padding:0px; } 
*{-webkit-text-size-adjust:none;box-sizing: border-box;}
html {overflow-y:scroll}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,form,fieldset,p,button,strong,span,em,iframe,img, textarea,input {margin:0px;padding:0px}
body {width:100%;font-family:'NotoKrR', '나눔 고딕', NotoKrR Gothic, "맑은 고딕", Malgun Gothic, '돋움',dotum,Helvetica,sans-serif;background-size:100% auto;font-size:16.5px; background:#fff;line-height:150%;color:#666; letter-spacing:-0.5px; text-align:left;word-break:break-all;-ms-word-break:break-all; }
html, h1, h2, h3, h4, h5, h6, form, fieldset, img {margin:0;padding:0;border:0}
h1, h2, h3, h4, h5, h6 {font-size:1em;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block}
#hd ul, nav ul, #ft ul {margin:0;padding:0;list-style:none}
legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
label, input, button, select, img {vertical-align:middle}
input, button {margin:0;padding:0;font-family:'NotoKrR','나눔 고딕', NotoKrR Gothic, "맑은 고딕", Malgun Gothic, '돋움',dotum,Helvetica,sans-serif;font-size:15.5px; }
button {cursor:pointer}
textarea, select {font-family:'NotoKrR','나눔 고딕', NotoKrR Gothic, "맑은 고딕", Malgun Gothic, '돋움',dotum,Helvetica,sans-serif; font-size:15.5px; }
select {margin:0; }
p {margin:0;padding:0;word-break:break-all}
hr {display:none}
pre {overflow-x:scroll;font-size:1.1em}
a:link, a:visited {color:#000;text-decoration:none; border:0px;}
a:hover, a:focus, a:active {color:#000;text-decoration:none}
img {border:0px;}
li{list-style:none; margin:0px; padding:0px;}


/*scroll none*/
body {-ms-overflow-style: none;}
::-webkit-scrollbar {display: none;}


/*intro-video*/
.video-background {background: #000;position: fixed;top: 0; right: 0; bottom: 0; left: 0;z-index: -99;}
.video-foreground,.video-background iframe {position: absolute;top: 0;left: 0;width: 100%;height: 100%;pointer-events: none;}
#vidtop-content {top: 0;color: #fff;}
.vid-info { position: absolute; top: 0; right: 0; width: 33%; background: rgba(0,0,0,0.3); color: #fff; padding: 1rem; font-family: Avenir, Helvetica, sans-serif; }
.vid-info h1 { font-size: 2rem; font-weight: 700; margin-top: 0; line-height: 1.2; }
.vid-info a { display: block; color: #fff; text-decoration: none; background: rgba(0,0,0,0.5); transition: .6s background; border-bottom: none; margin: 1rem auto; text-align: center; }
@media (min-aspect-ratio: 16/9) {
.video-foreground { height: 300%; top: -100%; }
}
@media (max-aspect-ratio: 16/9) {
.video-foreground { width: 300%; left: -100%; }
}
@media all and (max-width: 600px) {
.vid-info { width: 50%; padding: .5rem; }
.vid-info h1 { margin-bottom: .2rem; }
}
@media all and (max-width: 500px) {
.vid-info .acronym { display: none; }
}



#totalWrap {position:relative;height:100vh;overflow:hidden;}
.overay {position:absolute;left:0;right:0;top:0;bottom:0;background: url(/img2025/bg.jpg) center center no-repeat;}
.layer {position: absolute;left: 0;top: 0;right: 0;bottom: 0;box-sizing: border-box;padding: 0 20%;/* z-index:9; */}

.layer:after {content:'';display:block;clear:both}
.layer h1 {float:left;margin-top:360px;}
.layer h1 a {display: block;color:#fff;font-size:64px;line-height: 120%;letter-spacing: -1px;    text-shadow: 0px 0px 8px rgba(0, 0, 0, 0.6);}
.layer h1 .btn0 {content:'';display: block;width: 76px;height: 76px;margin:30px 0 0;border-radius: 50%;background: #ffffff url(/img2025/arrow.png) center center no-repeat}
.layer h1:hover .btn0 {background: #ec6c00 url(/img2025/arrow_w.png) center center no-repeat}
.layer h1 span {display: block;margin: 0 0 15px;font-size:32px;line-height: 100%;}
.layer .in_btn {/* float:right; */width: 100%;margin: 408px 0 0 !important;display: grid;grid-template-columns: 1fr 1fr 1fr;grid-template-rows: 1fr 1fr ;background: rgba(0, 0, 0, .5);/* border-left: 1px solid rgba(255,255,255,.2); *//* border-top: 1px solid rgba(255,255,255,.2); */gap: 30px 10px;border: 1px solid rgba(255, 255, 255, .2);/* border-left: 0; *//* border-top: 0; */border-radius: 40px;padding: 40px 30px 10px 30px  !important;}
.layer .in_btn:after {content:'';}
.layer .in_btn li {position: relative;text-align: left;/* border: 1px solid #ec6c00; *//* border-left: 0; *//* border-top: 0; */border-radius: 20px;padding: 10px 40px;/* background: rgba(250, 250,250, .7) url(/img/main/bg5.png) no-repeat right top; */}

.layer .in_btn li a {display: block;font-size: 24px;color: #fff;font-family: 'NotoKrM';}
.layer .in_btn li a > p {display: inline-block;position: absolute;top: 43px;font-size: 23px;/* text-shadow: 0px 0px 6px rgb(0 0 0 / 40%); */}
.layer .in_btn li a:hover{color:#fc7706}
.layer .in_btn li a > span {display: inline-block;width: 104px;height: 104px;border-radius: 50%;margin: 0 20px 0 0;background-size: 104px !important;}
.layer .in_btn .linkBtn {display: inline-block}

.btn01 {background: url(/img/main/icon2.png) center center no-repeat;}
.layer .in_btn li:hover .btn01 {background:url(/img/main/icon2_1.png) center center no-repeat;}
.btn02 {background:#fff url(/img/main/icon3.png) center center no-repeat;}
.layer .in_btn li:hover .btn02 {background:url(/img/main/icon3_1.png) center center no-repeat;}
.btn03 {background: url(/img/main/icon3.png) center center no-repeat;}
.layer .in_btn li:hover .btn03 {background:url(/img/main/icon3_1.png) center center no-repeat;}
.btn04 {background: url(/img/main/icon6.png) center center no-repeat;}
.layer .in_btn li:hover .btn04 {background:url(/img/main/icon6_1.png) center center no-repeat;}
.btn05 {background: url(/img/main/icon1.png) center center no-repeat;}
.layer .in_btn li:hover .btn05 {background:url(/img/main/icon1_1.png) center center no-repeat;}
.btn06 {background:#fff url(/img2025/icon06.png) center center no-repeat;}
.layer .in_btn li:hover .btn06 {background:#234039 url(/img2025/icon06_w.png) center center no-repeat;}
.btn07 {background:#fff url(/img2025/icon07.png?v=1) center center no-repeat;}
.layer .in_btn li:hover .btn07 {background:#58b1a1 url(/img2025/icon07_w.png?v=1) center center no-repeat;}
.btn08 {background:#fff url(/img2025/icon10.png) center center no-repeat;}
.layer .in_btn li:hover .btn08 {background:#A83C25 url(/img2025/icon10_w.png) center center no-repeat;}
.btn09 {background:#fff url(/img2025/icon11.png) center center no-repeat;}
.layer .in_btn li:hover .btn09 {background:#5d7682 url(/img2025/icon11_w.png) center center no-repeat;}
.btn10 {background:#fff url(/img2025/icon12.png) center center no-repeat;}
.layer .in_btn li:hover .btn10 {background:#5d7682 url(/img2025/icon12_w.png) center center no-repeat;}
@media all and (max-width: 1800px) {
.layer {padding:0 10%}
}

@media all and (max-width: 1300px) {
.layer h1 a {font-size:46px;        padding-top: 30px;}
.layer h1 span {font-size:26px;        word-break: keep-all;line-height: 33px;}
.layer h1 .btn0 {width: 54px;height: 54px;background-size: 24px !important;}
.layer .in_btn {width:760px;}
.layer .in_btn li a {font-size:22px;}

.content {padding: 45px 20px 20px 20px !important;}

.layer h1{float: none;margin-top: 80px;}
.layer .in_btn {float: none;width: 100%;padding: 20px !important;margin: 320px 0 0 !important;gap: 10px}
.layer .in_btn li {padding: 9px;margin: 0 auto;text-align: center;}
.layer .in_btn li a > p {top:10px;line-height: 25px;font-size: 17px;text-align: center;        position: relative;}
.layer .in_btn .linkBtn {    width: 160px;}
.overay {    background-size: cover;}
.layer .in_btn li a > span {display: block;        margin: 0;}
}

@media all and (max-width: 700px) {
.layer {padding:0 1%;}
.layer .in_btn li a > span {width: 80px;height: 80px;background-size: 80px !important;}
.layer .in_btn li a > p {top: 2px;font-size: 15px;letter-spacing:-1px;}
}


.background-slideshow {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      z-index: -1;
    }

    .slide {
      position: absolute;
      width: 100%;
      height: 100%;
      background-size: cover;
      background-position: center center;
      opacity: 0;
      animation: fade 15s infinite;
    }

    .slide:nth-child(1) {
      background-image: url('/img/ibg.jpg');
      animation-delay: 0s;
    }

    .slide:nth-child(2) {
      background-image: url('/img/ibg1.jpg');
      animation-delay: 5s;
    }

    .slide:nth-child(3) {
      background-image: url('/img/ibg2.jpg');
      animation-delay: 10s;
    }

    @keyframes fade {
      0% { opacity: 0; }
      10% { opacity: 1; }
      30% { opacity: 1; }
      40% { opacity: 0; }
      100% { opacity: 0; }
    }

    .content {
      position: relative;
      z-index: 1;
      text-align: center;
      padding-top: 20%;
      color: white;
      text-shadow: 0 0 5px #000;}



  .content {
      position: relative;
      z-index: 2;
      height: 100%;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      color: white;
      text-align: center;
      padding: 95px 20px 20px 20px;
    }

    .logo {
      max-width: 300px;
      margin-bottom: 30px;
    }

    h1 {
      font-size: 3.5rem;
      text-shadow: 2px 2px 8px rgba(0,0,0,0.7);
      margin-top: 25px;
    }

    p {
      font-size: 1.8rem;
      margin-top: 10px;
    }

    .enter-button {
      margin-top: 40px;
      padding: 12px 30px;
      background-color: rgba(255,255,255,0.9);
      border: none;
      border-radius: 25px;
      font-size: 1rem;
      font-weight: bold;
      cursor: pointer;
      transition: all 0.3s ease;
    }

    .enter-button:hover {
      background-color: #000;
      color: #fff;
    }

    @media (max-width: 768px) {
      h1 {
        font-size: 1.8rem;
      }

      p {
        font-size: 1rem;
      }

      .logo {
        max-width: 200px;
      }
    }
