@charset "utf-8";

@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.8/dist/web/static/pretendard.css");
@import url(https://fonts.googleapis.com/css?family=Noto+Sans+KR:300,500);
@import url(https://cdn.jsdelivr.net/gh/theeluwin/NotoSansKR-Hestia@master/stylesheets/NotoSansKR-Hestia.css);
@import url(http://cdn.jsdelivr.net/font-notosans-kr/1.0.0-v1004/NotoSansKR-2350.css);
@import url('https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900');
@import url('https://fonts.googleapis.com/css?family=Nanum+Myeongjo&display=swap');
@import url(https://cdn.jsdelivr.net/xeicon/2/xeicon.min.css);
@import url(css/blank.css);


*{margin:0; padding:0; box-sizing:border-box;letter-spacing:-0.01em;color:inherit;}
body * {-webkit-text-size-adjust: auto;}
img {border:0; vertical-align:top;}
a {border:0; text-decoration:none;}
ul, li {list-style:none;}
body {font-family: 'Pretendard', 'Noto Sans KR','Nanum Barun Gothic','Nanum Gothic','Roboto', sans-serif; color:#505050; margin: 0 auto; overflow-x: hidden;}
div {display:block;}
h1,h2,h3,h4,h5 {font-weight:300;line-height:1.25}
/* h1 {letter-spacing: 3px; color: #136191;} */
b {letter-spacing:inherit;font-weight:700}
.inner {width: 600px; margin:auto;clear:both;}
.inner2 {width: 640px; margin:auto;clear:both;}
.c_main {color:#009ac9 !important;}
.c_sub {color:#2a4198 !important;}
.c_sub2 {color:#6fcfec !important;}
.c_lightgray {color:#c0c0c0 !important;}
.c_white {color:#fff !important;}
.c_black {color:#303030 !important;}
.c_sky1 {color:#407998 !important;}

h1 {font-size:50px; line-height: 1.15;}
h2 {font-size:40px}
h3 {font-size:30px;}
h4 {font-size:24px;}
h5 {font-size:18px;line-height:1.5;}
p {font-size:17px;font-weight:300;line-height:1.7;color:inherit;word-break:keep-all }
p.small {font-size:15px;}
span {color:inherit}

.float {float:left;}
.float_r {float:right}
.center {text-align:center !important}
.half {width:50% !important}
.clearfix:after {content: ""; display: block; clear: both;}

hr {width:100%;height:1px;background:#e0e0e0;border:0;margin:0px auto 60px;}
.thin {color: #b4b4b4 !important; letter-spacing: 5px; font-size: 16px; font-style: italic; font-family: 'Nanum Myeongjo', serif;}


/* 마진,패딩 설정 */
.mg0 {margin-left:0 !important;margin-right:0 !important}

.mtm30 {margin-top:-30px;}
.mt10 {margin-top:10px;}
.mt20 {margin-top:20px;}
.mt30 {margin-top:30px;}
.mt40 {margin-top:40px;}
.mt50 {margin-top:50px;}
.mt60 {margin-top:60px;}
.mt70 {margin-top:70px;}
.mt80 {margin-top:80px;}
.pt85 {padding-top:85px;}
.pt100 {padding-top:100px;}
.mt100 {margin-top:100px;}


.mb10 {margin-bottom:10px;}
.mb20 {margin-bottom:20px;}
.mb30 {margin-bottom:30px;}
.mb40 {margin-bottom:40px;}
.mb50 {margin-bottom:50px;}
.mb60 {margin-bottom:60px;}
.mb70 {margin-bottom:70px;}
.mb80 {margin-bottom:80px;}
.mb100 {margin-bottom:100px;}


.pl03 {padding-left:3%}
.pl05 {padding-left:5%}
.pl10 {padding-left:10%}
.pl15 {padding-left:15%}
.pl20 {padding-left:20%}
.pl25 {padding-left:25%}
.pl30 {padding-left:30%}
.pl35 {padding-left:35%}

.pr03 {padding-right:3%}
.pr05 {padding-right:5%}
.pr10 {padding-right:10%}
.pr15 {padding-right:15%}
.pr20 {padding-right:20%}
.pr25 {padding-right:25%}
.pr30 {padding-right:30%}
.pr35 {padding-right:35%}


.bd_b {border-bottom:1px #e0e0e0 solid}
.bd_t {border-top:1px #e0e0e0 solid}



/* 컬럼 설정 */
.col5 {width:20%;}
.col4 {width:25%;}
.col3 {width:33.33%;}


/*폰트설정*/

.roboto{font-family: 'Roboto', sans-serif;}



/* 공통 */
#wrap {width:640px; min-width:600px; margin:auto; position:relative; }
#header {position: fixed; width: 640px; min-width:600px; height:80px; z-index:10; background: rgba(255,255,255,0.8);}
#header .logo {position: absolute; top: 50%; left: 0px; transform: translate(10%, -50%);}
#header .logo img {width: 198px;}

#header .tel_icon {display: inline-block; margin-top: 26px;}

#header .menu {float: right; text-align: center; margin-top: 5px;}
#header .menu i {font-size: 40px; color: #16649f; line-height: 73px;}

#header #gnb {line-height:50px;margin-top:28px; right: 320px; float:right;position:relative;  z-index: 1000;}
#header #gnb > ul {}
#header #gnb > ul > li {float:left;width:130px;overflow:hidden}
#header #gnb > ul > li > p {line-height:inherit;font-size:20px;text-align:center}
#header #gnb > ul > li a {display:block; color: #fff;}
#header #gnb > ul > li > p a.on,#header #gnb > ul > li > p a:hover {font-weight:bold;color:#97d6ff;}
#header #gnb .subnav { 
 margin:auto;
 clear:both;
 display: none;
 position: absolute;
  z-index:10;
  text-align:left;
  top:47px;
  left:0;
  font-size:15px;
  width:600px;
  padding-top:15px;
 }
 #header #gnb .subnav div {display: flex;}
#header #gnb .subnav dl {background: rgba(5, 5, 5, 0.397); width: 600px;}
#header #gnb .subnav dd {line-height:40px; width: 90px;}
#header #gnb .subnav dl:nth-child(1) dd {width: 130px; margin-left: 30px;}
#header #gnb .subnav dl:nth-child(2) dd {margin-left: 10px;}
#header #gnb .subnav dl:nth-child(3) dd {margin-left: -10px;}
#header #gnb .subnav dl:nth-child(4) dd {margin-left: -30px;}
#header #gnb .subnav a:hover {font-size:larger;color:#97d6ff;}
#header #gnb .subnav a {display:block;-webkit-transition:all 0.2s ease-out;transition:all 0.2s ease-out;}


/* 공통푸터 */
#footer {width: 100%; background: #353434; position: relative; display: inline-block;}
/* #footer .tel {width: 100%; height: 140px; background: url(/images/ft_tel.jpg) no-repeat top center;} */
#footer .tel {height: 100px; display: block; text-indent: -9999px; background: url(/base/img/m/images/footer_tel.jpg) no-repeat top center;}
#footer .inner {position: relative; padding: 50px 0px;}
#footer .txt {display: inline-block; font-size: 16px; line-height: 25px;}
#footer .footer_txt {color: #d3d3d3;}
#footer .txt span {letter-spacing:1px;display:inline-block;opacity:0.7; margin-right: 30px;}
#footer .float {width: 100%; position: absolute;}
#footer .inner .footer_top {position: absolute; top: 50px; right: 20px; width: 50px; height: 50px; background-color: #103163; background: url(images/top_btn.jpg) no-repeat center;}
#footer .inner .footer_top a {display: block; width: 100%; height: 100%;}

#footer .sns {
    display: flex;
    justify-content: space-between;
    text-align: center;
    color: #bfbfbf;
    margin-bottom: 30px;
}

#footer .sns a {
    width: 49%;
    padding: 10px 20px;
    border-radius: 20px;
    font-size: 18px;
    border: 1px solid #bfbfbf;
}

#footer .sns a i {
    color: #2cb24a;
}

/* 메인 */
#main {width:100%; min-width:600px; float:left; position:relative; margin-top: -80px;}
#main .flexslider {text-align:center;height:900px;}
#main .main_sl1 {width:100%;height:900px; background: url(images/main_sl1.jpg) no-repeat center;}
#main .main_sl2 {width:100%;height:900px; background: url(images/main_sl2.jpg) no-repeat center;}
#main .main_sl3 {width:100%;height:900px; background: url(images/main_sl3.jpg) no-repeat center;}
#main .main_sl4 {width:100%;height:900px; background: url(images/main_sl4.jpg) no-repeat center;}
#main .main_sl5 {width:100%;height:900px; background: url(images/main_sl5.jpg) no-repeat center;}
#main .slides {z-index: 0;}
#main .slides .inner img {position: absolute; top: 50%; left: 50%; display: block; transform: translate(-50%, -50%);}


#main .paragraph{ margin: 0 auto; width: 100%; position: relative;}
#main .section {padding-top: 80px;}
#main .title {color: #303030; font-weight: 700;}

/* #main .section1 */
#main .section1 .title {text-align: center; margin-bottom: 30px;}
#main .section1 .sec1_img {max-width: 640px; height: 378px; margin: 0 auto; background: url(images/section1_img.png) no-repeat center;}
#main .section1 .sec1_img h2 {padding-top: 72px; padding-left: 200px; color: #fff; font-weight: 700;}

#main .section1 .sec1_bar {height: 400px; background: url(images/section1_back.png) no-repeat right bottom; padding: 50px 0;}
#main .section1 .sec1_bar .bar_box:not(:first-child) {
    margin-top: 35px;
}

#main .section1 .sec1_bar .bar_box p {
    font-size: 24px;
    margin-bottom: 8px;
}

.progress_wrap {
    position: relative;
    width: 600px;
    height: 35px;
    /* border: 1px solid #ddd; */
    box-sizing: border-box;
}

.progress_wrap .bar {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 0;
    height: 35px;

}

.progress_wrap1 .bar {background: #ea5413;}
.progress_wrap2 .bar {background: #16649f;}
.progress_wrap3 .bar {background: #28a7e1;}

.progress_wrap span {
    position: absolute;
    line-height: 35px;
    font-weight: 800;
    font-size: 30px;
}

.progress_wrap span:after {
    content: "례";
    position: absolute;
    top: 0;
    right: -23px;
    color: #303030;
    font-size: 22px;
    font-weight: 400;
}

.progress_wrap1 span {right: 50px; top: 0; bottom: 0; color:#ea5413;}
.progress_wrap2 span {right: 190px; top: 0; bottom: 0; color:#16649f;}
.progress_wrap3 span {right: 452px; top: 0; bottom: 0; color:#28a7e1;}



/* #main .section2 */
#main .section2 .title {text-align: center; margin-bottom: 30px;}

#main .section2 .sec2_box {
    display: flex;
    justify-content: center;
}

#main .section2 .sec2_box .sec2_icon {
    text-align: center;
    padding: 0 25px;
}

#main .section2 .sec2_box .sec2_icon:hover p {
    font-weight: 700;
}

#main .section2 .sec2_box .sec2_icon:not(:last-child) {
    border-right: 1px solid #dbdbdb;
}

#main .section2 .sec2_box .sec2_icon p {
    margin-top: 30px;
    font-size: 25px;
    font-weight: 400;
}


/* #main .section3 */
#main .section3 {
    max-width: 640px;
    margin: 0 auto;
}

#main .section3 .sec3_txt {
    position: relative;
    width: 600px;
    height: 378px;
    background: #edf8ef;
}

#main .section3 .sec3_txt .sec3_txt_box {
    position: absolute;
    top: 50px;
    left: 40px;
}

#main .section3 .sec3_txt .sec3_txt_box .title {
    width: 450px;
    border-bottom: 1px solid #a4a4a4;
    margin-bottom: 30px;
    padding-bottom: 20px;
}

#main .section3 .sec3_txt p {
    font-size: 20px;
    line-height: 25px;
    margin-top: 30px;
}

#main .section3 .sec3_img {
    position: relative;
    top: -115px;
    right: -40px;
    width: 600px;
    height: 344px;
    background: url(images/section3_img.jpg) no-repeat center;
}

#main .section3 .sec3_img a {
    position: absolute;
    bottom: 40px;
    left: 40px;
}

/* #main .section4 */
#main .section4 {
    max-width: 640px;
    margin: 0 auto;
}

#main .section4 .sec4_txt {
    position: relative;
    top: 0;
    left: 40px;
    width: 600px;
    height: 378px;
    background: #fff1ea;
}

#main .section4 .sec4_txt .sec4_txt_box {
    position: absolute;
    top: 50px;
    left: 40px;
}

#main .section4 .sec4_txt .sec4_txt_box .title {
    width: 450px;
    border-bottom: 1px solid #a4a4a4;
    margin-bottom: 30px;
    padding-bottom: 20px;
}

#main .section4 .sec4_txt p {
    font-size: 20px;
    line-height: 25px;
    margin-top: 30px;
}

#main .section4 .sec4_img {
    position: relative;
    top: -115px;
    left: 0;
    width: 600px;
    height: 344px;
    background: url(images/section4_img.jpg) no-repeat center;
}

#main .section4 .sec4_img a {
    position: absolute;
    bottom: 40px;
    left: 40px;
}


/* #main .section4 */
/* #main .section4 {
    max-width: 640px;
    margin: 0 auto;
    height: 600px;
    background: url(images/section4_img.png) no-repeat bottom;
    margin-top: -40px;
}

#main .section4 .sec4_txt {
    text-align: center;
}

#main .section4 .sec4_txt p {
    font-size: 20px;
} */


/* #main .section5 */
#main .section5 h3 {
    font-weight: 700;
    font-size: 30px;
}

#main .section5 .sec5_cont {
    max-width: 570px;
    margin: 0 auto;
}

#main .section5 .num_box {
    display: flex;
    justify-content: space-between;
}

#main .section5 .num_box .num_txt {
    width: 370px;
}

#main .section5 .num_box .num_txt h2 {
    font-weight: 700;
    color: #ea5413;
    font-size: 35px;
}

#main .section5 .info_box {
    display: flex;
    justify-content: space-between;
    margin-top: 40px;
}

#main .section5 .info_box .time_txt {
    display: flex;
    width: 370px;
}

#main .section5 .info_box .time_txt .week p {
    color: #ea5413;
    font-weight: 700;
    font-size: 20px;
}

#main .section5 .info_box .time_txt .week p:first-child {
    letter-spacing: 34px;
}

#main .section5 .info_box .time_txt .week p:nth-child(2) {
    letter-spacing: 8px;
}

#main .section5 .info_box .time_txt .clock {
    margin-left: 40px;
}

#main .section5 .info_box .time_txt .clock p {
    font-size: 20px;
}


/* #main .section6 */
#main .section6 {
    text-align: center;
    padding: 70px 0;
}

#main .section6 .title {
    margin-bottom: 20px;
}

#main .section6 .slider {
    display: flex;
    align-items: center;
}



/* 서브 */
#sub {width:100%; max-width: 640px; margin: -80px auto 0;}
#sub .subtop {position: relative; width:100%; height: 400px; text-align:center;}
#sub .subtop .subtop_txt {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -10%); color: #fff;}
#sub .subtop .subtop_txt h1 {font-weight: 700;}
#sub .subtop.subtop1 {background: url(images/subtop1.jpg) no-repeat center;}
#sub .subtop.subtop2 {background: url(images/subtop2.jpg) no-repeat center;}
#sub .subtop.subtop3 {background: url(images/subtop3.jpg) no-repeat center;}
#sub .subtop.subtop4 {background: url(images/subtop4.jpg) no-repeat center;}
#sub .subtop.subtop5 {background: url(images/subtop5.jpg) no-repeat center;}


#sub .paragraph {width:640px; margin:0 auto; padding: 80px 0;}

.root_daum_roughmap .wrap_controllers {display: none;}

#sub .paragraph .tabs {width: 100%; height: 66px; margin-bottom: 30px; display: flex; }
#sub .paragraph .tabs li {text-align:center; font-size:18px; border:1px #dbdbdb solid; width:50%; }
#sub .paragraph .tabs.w3 li {width:33.3333%; }
#sub .paragraph .tabs.w5 li {width:20%; }
#sub .paragraph .tabs li a {display:block; font-size: 20px; line-height: 66px;}
#sub .paragraph .tabs li.active {font-weight: 700; background-color: #e05815; color: #fff; border: 1px solid #e05815;}

.sub1_4_sns {
    display: flex;
    text-align: center;
}

.sub1_4_sns a {
    width: 50%;
    height: 100px;
    font-weight: 700;
    font-size: 35px;
    color: #fff;
    display: block;
    line-height: 100px;
}

.sub1_4_sns a img {
    vertical-align: middle;
    margin-top: -5px
}

.sub1_4_sns .naver {
    background: #2cb24a;
}

.sub1_4_sns .kakao {
    background: #ffdc00;
    color: #371d1e;
}

/* 테이블 */
.table1 {
    width: 100%;
    border-collapse: collapse;
    text-align: center;
}

.table1 tr th, .table1 tr td {
    padding: 15px;
    font-size: 18px;
    border: 1px solid #dbdbdb;
}

.table1 tr th:first-child, .table1 tr td:first-child {
    border-left: none;
}

.table1 tr th:last-child, .table1 tr td:last-child {
    border-right: none;
}


.table1 tr th {
    background: #ffeee6;
}

.table1 tr td.on {
    background: url(images/table_on.png) no-repeat center;
}


/* 게시판 */
#sub #content .board_box {width:100%;display:inline-block;font-size:15px;line-height:1.7;margin-bottom:120px;}
#sub #content .board_box .inner {padding:0 20px}

@media screen and (max-width:320px) {
     body {zoom:44%;}
 }
 @media screen and (min-width:321px) and (max-width:359px) {
     body {zoom:50%;}
 }
 @media screen and (min-width:360px) and (max-width:374px) {
     body {zoom:56.2%;}
 }
 @media screen and (min-width:375px) and (max-width:375px) {
     body {zoom:58.5%;}
 }
 @media screen and (min-width:376px) and (max-width:413px) {
     body {zoom:59.6%;}
 }
 @media screen and (min-width:414px) and (max-width:479px) {
     body {zoom:64.6%;}
 }
 @media screen and (min-width:480px) and (max-width:639px) {
     body {zoom:75%;}
 }

 
/* 아이패드(1024X768)보다 큰 스크린 사이즈와 해상도를 갖는 모든 기기에서의 해상도 설정 */
 @media all and (min-width: 640px) {
     body {width:640px; margin:0 auto;}
 


  @media all and (min-width: 640px) {
     body {zoom:100%; margin:0 auto;}
 } 


 }