@charset "utf-8";

@import url("style.css");
@import url("layout.css");

clearfix::after { content: ''; display: block; clear: both; }
html.fixed{ height: 100%; overflow: hidden; position: fixed; width: 100%; touch-action: none; top: 0; left: 0 }

/* 맨 위로 */
#top_btn { position: fixed; bottom: 50px; right: 25px; z-index: 1000; cursor: pointer; }
/* 600px visual */
@media all and (max-width:600px)
{
#top_btn { bottom: 35px; }
#top_btn img { width:40px; }
}
/* 맨 위로 끝 */


/* Main_Visual */
#visual { position: relactive }
#visual .visu article { height: 100vh; position: relactive; overflow: hidden; vertical-align: top; }
#visual .visu .bg { background-size: cover !important; height: 100vh; }

#visual .visu01 .bg{ background-image: url("../main/image/main_img1.jpg")}
#visual .visu02 .bg{ background-image: url("../main/image/main_img2.jpg")}
#visual .visu03 .bg{ background-image: url("../main/image/main_img3.jpg")}
#visual .visu04 .bg{ background-image: url("../main/image/main_img4.jpg")}

#visual .bg { transform: scale(1); transition: opacity 1.5s ease-out, transform 5000ms ease-in-out; background-repeat: no-repeat;  background-position: center; position: relactive;}
#visual .bg.on { transform: scale(1.05);}

#visual .visu .txt{ position: absolute; top: 50%; transform: translateY(-50%); width: 100%; z-index: 10; box-sizing: border-box; }
#visual .visu .txt .text1{ font-weight:700; font-family: 'NanumHuman', sans-serif; font-size:60px; color:rgb(255, 255, 255);  line-height: 120%; text-shadow: 1px 1px 5px rgba(0,0,0,0.55); }
#visual .visu .txt .text2{ margin-top: 40px; font-weight:400; font-family: 'Noto Sans KR', sans-serif; font-size:18px; color:rgb(255, 255, 255);  line-height: 150%; text-shadow: 1px 1px 2px rgba(0,0,0,0.75); }

#visual .slick-slide.slick-active .txt .text1 { transition-delay: .2s; animation: text-up 1.5s cubic-bezier(0.4, 0, 0.2, 1) both }
#visual .slick-slide.slick-active .txt .text2 { transition-delay: .5s; animation: text-up 1.5s cubic-bezier(0.4, 0, 0.2, 1) both }

@keyframes text-up {
  from {transform: translate3d(0, 150%, 0); opacity:0; filter:Alpha(opacity=0);}
  to {transform: translate3d(0, 0, 0); opacity:1.0; filter:Alpha(opacity=100);}
}

.slick_dots { position: absolute; right: 3.2%; bottom: 100px; color: rgb(255, 255, 255); font-size: 14px; }
.slick_dots>div,
.slick_dots bitton,
.slick_dots>div>div { display: inline-block; vertical-align: middle; font-weight: 600 }
.slick_dots .nums { margin: 0 35px;}
.slick_dots>div>div { margin: 0 5px }
.slick_dots .total_num { color: #888 }
.slick_dots button { background: none; padding: 0; border: 0 none; cursor: pointer; background: none; }
.slick_dots button img { width: 42px; vertical-align: middle }

.hero__scroll { position: absolute; bottom: 60px; width: 56px; margin: auto; display: block; padding-bottom: 40px; left: 0; right: 0; text-transform: uppercase; }
.hero__scroll .chevron { margin-top: 20px; display: block; -webkit-animation: pulse 2s infinite; animation: pulse 2s infinite; }

@-webkit-keyframes pulse {
  0% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0); }
  50% {
    -webkit-transform: translate(0, 10px);
            transform: translate(0, 10px); }
  100% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0); } }

@keyframes pulse {
  0% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0); }
  50% {
    -webkit-transform: translate(0, 10px);
            transform: translate(0, 10px); }
  100% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0); } }


@media screen and (max-width: 800px) {
    .hero__scroll { display: none; }
}

.section{text-align:center; background-size: cover;}
.slide{background-size: cover;}

/* 1390px visual */
@media all and (max-width:1390px)
{
#visual .visu .txt .text1{ font-size:50px; }
#visual .visu .txt .text2{ margin-top: 35px; font-size:16px; }
}

/* 800px visual */
@media all and (max-width:800px)
{
#visual .visu .txt .text1{ font-size:40px; }
#visual .visu .txt .text2{ margin-top: 30px; font-size:15px; }
}

/* 600px visual */
@media all and (max-width:600px)
{
#visual .visu .txt .text1{ font-size:28px; }
#visual .visu .txt .text2{ margin-top: 25px; font-size:13px; letter-spacing:-0.5px; }
}
/* Main_visual END */


#sec1 { background: url("../main/image/mc_img1.jpg") no-repeat center; background-size: cover; overflow: hidden; }
/* Notice & Link */
.notice_link { margin:0 auto; padding:0; width:1320px; }
.notice { position: relative; margin:0; padding:0; width:672px; }
.notice .title { padding:0 0 24px 0; margin:0; font-weight:500; font-family: 'Noto Sans KR', sans-serif; font-size:43px; color:rgb(17, 17, 17); line-height: 100%; text-align: left; border-bottom: rgb(149, 149, 149) 1px solid;}
.notice .title SPAN { padding:0 0 0 15px; font-weight:400; font-family: 'Noto Sans KR', sans-serif; font-size:16px; color:rgb(102, 102, 102); line-height:100%; }
.notice ul li { padding:0 0 32px 0; margin:22px 0 0 0; border-bottom: rgb(153, 153, 153) 1px solid;}
.notice ul li:after { clear: both; display: block; content: "";}

.notice ul li .date { padding:0; margin:0; width:95px; float:left; font-weight:400; font-family: 'Noto Sans KR', sans-serif; font-size:16px; color:rgb(102, 102, 102); line-height: 100%; text-align: center;}
.notice ul li .date SPAN { font-weight:700; font-size:30px; color:rgb(21, 146, 194); line-height: 150%; }
.notice ul li .list  { padding:0; margin:0 0 0 0; width:calc(100% - 105px); float:left; }
.notice ul li .list P.tit { padding:0; margin:10px 0 0 0; width:100%; font-weight:400; font-family: 'Noto Sans KR', sans-serif; font-size:19px; color:rgb(51, 51, 51); line-height: 130%; text-align: left;}
.notice ul li .list P.cont { padding:0; margin:9px 0 0 0; width:100%; height:15px; overflow: hidden; font-weight:400; font-family: 'Noto Sans KR', sans-serif; font-size:15px; color:rgb(133, 133, 133); line-height: 15px; text-align: left;}
.notice .more { position: absolute; top:20px; right:0px; font-weight:400; font-family: 'Nanum Gothic', sans-serif; font-size:13px; color:rgb(51, 51, 51); line-height: 100%;}
.notice .more A { color:rgb(51, 51, 51); }

.link { margin:90px 0 0 0; padding:0; width:672px; }
.link ul li { margin:0; padding:0; width:49%; float:left; text-align: left; background: url("../main/image/link1_bg.png") no-repeat  88% 75%; background-color:rgb(0, 156, 255); }
.link ul li:last-child { margin:0 0 0 2%; background: url("../main/image/link2_bg.png") no-repeat 88% 80%; background-color:rgb(40, 71, 170); }
.link ul li .title { margin:0; padding:36px 0 0 27px; font-weight:500; font-family: 'Noto Sans KR', sans-serif; font-size:24px; color:rgb(255, 255, 255); line-height: 100%; }
.link ul li P.cont { margin:0; padding:20px 0 0 27px; font-weight:400; font-family: 'Noto Sans KR', sans-serif; font-size:15px; color:rgb(255, 255, 255); line-height: 130%; }
.link ul li P.more { margin:45px 0 36px 27px; padding:10px 0px 10px 0px; width:122px; background-color:rgb(0, 62, 102); font-weight:400; font-family: 'Noto Sans KR', sans-serif; font-size:15px; color:rgb(255, 255, 255); line-height: 100%; text-align: center;}
.link ul li P.more A { color:rgb(255, 255, 255); }

/* 1390px Notice & Link */
@media all and (max-width:1390px)
{
.notice_link { width:95%; }
}

/* 710px Notice & Link */
@media all and (max-width:710px)
{
.notice { width:100%; }
.link { margin:60px 0 0 0; width:100%; }
}

/* 610px Notice & Link */
@media all and (max-width:610px)
{
.notice .title { padding:0 0 20px 0; margin:0; font-size:35px; }
.notice .title SPAN { padding:0 0 0 15px; font-size:14px; }
.notice ul li .date { width:90px; font-size:14px; }
.notice ul li .date SPAN { font-size:25px; }
.notice ul li .list  { width:calc(100% - 100px); }
.notice ul li .list P.tit { font-size:17px; }
.notice ul li .list P.cont { height:14px; font-size:14px; line-height: 14px; }

.link { margin:30px 0 0 0; }
.link ul li { width:100%; }
.link ul li:last-child { margin:10px 0 0 0; }
.link ul li .title { padding:30px 0 0 27px; font-size:20px; }
.link ul li P.cont { padding:15px 0 0 27px; font-size:13px; }
.link ul li P.more { margin:30px 0 25px 27px; padding:8px 0px 8px 0px; width:122px; font-size:13px; }

}
/* Notice & Link END */


#sec2 { background: url("../main/image/mc_img2.jpg") no-repeat center; background-size: cover; overflow: hidden; }
/* License */
.license { position: relative; margin:0 auto; padding:0; width:1320px; display:flex; flex-wrap:wrap; }
.license:after { clear: both; display: block; content: "";}
.license .title { position: relative; padding:0; margin:0; float:left; width:calc(100% - 999px);}
.license .title H2.tit { padding:0; margin:0; font-weight:500; font-family: 'Noto Sans KR', sans-serif; font-size:50px; color:rgb(255, 255, 255); line-height:100%; text-align: left;}
.license .title H2 SPAN { padding:0; margin:0; font-weight:700; font-family: 'Noto Sans KR', sans-serif; font-size:65px; color:rgb(255, 255, 255); line-height:130%; text-align: left; }
.license .title P.txt { padding:0; margin:35px 0 0 0; font-weight:400; font-family: 'Noto Sans KR', sans-serif; font-size:15px; color:rgb(255, 255, 255); line-height:20px; text-align: left;}

.license .licenselist { position:relative; padding:0; margin:0; width:999px; }
.license .licenselist li { margin:0 0 0 15px;}
.license .licenselist li:first-child { margin:0;}

.license .licenselist li .license_thumb { position:relative; width:100%; height:0; padding-bottom:150%; overflow:hidden; }
.license .licenselist li .license_thumb>img { position:absolute; top:0; left:0; max-width:100%; }
.license .licenselist li h3 { margin:28px 0 0 0; font-weight:400; font-family: 'Noto Sans KR', sans-serif; font-size:17px; color:rgb(255, 255, 255); line-height: 100%;}

/* 1390px License */
@media all and (max-width:1390px)
{
.license { width:95%; }
}

/* 1360px License */
@media all and (max-width:1360px)
{
.license .title { width:30%; }
.license .licenselist { width:70%; }
}

/* 1020px License */
@media all and (max-width:1020px)
{
.license .title { width:100%; }
.license .title H2.tit br { display: none; }
.license .title H2 SPAN { line-height: 100%; }
.license .title P.txt { display: none; }
.license .licenselist { margin:20px 0 0 0; width:100%; }
}

/* 800px License */
@media all and (max-width:800px)
{
.license .title H2.tit { font-size:40px; }
.license .title H2 SPAN { font-size:50px; }
}

/* 600px License */
@media all and (max-width:600px)
{
.license .title H2.tit { font-size:35px; }
.license .title H2 SPAN { font-size:40px; }
}
/* License END */


#sec3 { background: url("../main/image/mc_img3.jpg") no-repeat right; overflow: hidden; }
/* Result */
.result { position: relative; margin:0 auto; padding:0; width:1340px; }
.result:after { clear: both; display: block; content: "";}

.result H2 { margin:0; padding:0; font-weight:500; font-family: 'Noto Sans KR', sans-serif; font-size:50px; color:rgb(34, 34, 34); line-height:100%; text-align: center;}
.result H2 SPAN { color:rgb(119, 119, 119); }
.result P { margin:15px 0 0 0; padding:0; font-weight:400; font-family: 'Noto Sans KR', sans-serif; font-size:17px; color:rgb(136, 136, 136); line-height:100%; text-align: center;}

.result ul { margin:57px 0 0 0; overflow: hidden; }

.result ul li { padding:0; margin:0 1% 38px 1%; width:23%; float: left;}
.result ul li .result_thumb { height:177px; background-size: cover; background-position: center; }
.result ul li .result_title { margin:25px 0 0 0; padding:0; height:17px; overflow: hidden; font-weight:400; font-family: 'Noto Sans KR', sans-serif; font-size:17px; color:rgb(115, 115, 115); line-height:100%; text-align: center;}


/* 1390px Result */
@media all and (max-width:1390px)
{
.result { width:95%; }
}

/* 1000px Result */
@media all and (max-width:1000px)
{
.result ul { height:514px; }
.result ul li { width:31%; }
}

/* 630px Result */
@media all and (max-width:630px)
{
.result H2 { font-size:40px; }
.result P { margin:13px 0 0 0; font-size:15px; }
.result ul { margin:40px 0 0 0; }
.result ul li { width:48%; }
}

/* 500px Result */
@media all and (max-width:500px)
{
#sec3 {  background: url("") no-repeat right;}
}

/* Result ENG */


/* Map */
#sec4 { padding:0; margin:0; width:100%; height:100%;  overflow: hidden;}
#sec4 .map { padding:0; margin:0; width:100%; height: calc(100vh - 240px);  overflow: hidden;}
.root_daum_roughmap { margin: 0; width: 100%; height: calc(100vh - 240px) !important; }
.wrap_controllers  { display: none; }
.map_border {  display: none; }