@charset "utf-8";

Fonts
********************************************************************* */
@font-face{
  font-family:'Noto Sans';
  font-style:normal;
  font-weight:300;
  src:url(../fonts/NotoSansKR-DemiLight.eot);
  src:url(../fonts/NotoSansKR-DemiLight.eot?#iefix) format('embedded-opentype'),
     url(../fonts/NotoSansKR-DemiLight.woff) format('woff'),
     url(../fonts/NotoSansKR-DemiLight.otf) format('opentype');
}
@font-face{
  font-family:'Noto Sans';
  font-style:normal;
  font-weight:400;
  src:url(../fonts/NotoSansKR-Regular.eot);
  src:url(../fonts/NotoSansKR-Regular.eot?#iefix) format('embedded-opentype'),
     url(../fonts/NotoSansKR-Regular.woff) format('woff'),
     url(../fonts/NotoSansKR-Regular.otf) format('opentype');
}
@font-face{
  font-family:'Noto Sans';
  font-style:normal;
  font-weight:700;
  src:url(../fonts/NotoSansKR-Medium.eot);
  src:url(../fonts/NotoSansKR-Medium.eot?#iefix) format('embedded-opentype'),
     url(../fonts/NotoSansKR-Medium.woff) format('woff'),
     url(../fonts/NotoSansKR-Medium.otf) format('opentype');
}
@font-face{
  font-family:'Noto Sans';
  font-style:normal;
  font-weight:800;
  src:url(../fonts/NotoSansKR-Medium.eot);
  src:url(../fonts/NotoSansKR-Medium.eot?#iefix) format('embedded-opentype'),
     url(../fonts/NotoSansKR-Bold.woff) format('woff'),
     url(../fonts/NotoSansKR-Bold.otf) format('opentype');
}
@import url('https://fonts.googleapis.com/css?family=Nanum+Myeongjo&display=swap');

/* base */
/*@import url( "./notosanskr.css" );*/
html {width: 100%; min-height: 100%; height:100%; margin: 0; font-size: 62.5%; }  /* font-size:100% - 16px,  1rem = 10px */
body {width: 100%; min-height: 100%; height:100%; margin: 0; background-color: #fff;}
body,input,textarea,select,button,table,label{font-family:'Noto Sans','Malgun Gothic','맑은고딕','dotum','돋움','Gulim',AppleGothic,sans-serif; font-size:1.2rem;} 
input,textarea,select,button{border:none; background:#fff;}
body,div,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,p,form,fieldset,input,table,tr,th,td{margin:0;padding:0;word-break: keep-all;}
h1,h2,h3,h4,h5,h6{font-weight:normal;font-size:100%}
ul,ol,li{list-style:none}
fieldset{width:100%;}
fieldset,img{border:0;}
.hidden, legend, caption{display:none !important;}
.invisible{visibility:hidden;}
address{font-style:normal}
label{cursor: default;}
li{list-style:none}
p,li,dd,td{font-size:1em;line-height:1.5em; color:black;}
body{overflow-y:scroll; /* overflow-x:hidden; */}
table{width:100%;table-layout:fixed;border-spacing:0;border-collapse:collapse;}  
select {-webkit-appearance: none; -moz-appearance: none; appearance: none;
   height: 22px;
   height: auto;
   font-size: 15px;
   color: #888;
   line-height: 22px;
   vertical-align: middle;}
select::-ms-expand {display: none;}
input {
   margin: 0;
   padding: 0;
   font-size: inherit;
   color: #555;
   line-height: 17px;
   vertical-align: middle;
   -webkit-border-radius: 0;
}
.clearfix:after{content:"";display:block;visibility:hidden;clear:both;height:0;}
/* a-style */
a{color:black; text-decoration:none;}
a:hover{color:black;text-decoration:none;}
a:active{text-decoration:none; font-weight:normal;}
a:focus{text-decoration:none; font-weight:normal;}
.blind{text-align:-9999px; position:absolute; left:-1000%; top:0; width:1px; height:1px; overflow:hidden; display:block;}
*{margin:0;padding:0;}

/* html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
} */

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, main {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

input, button, select, textarea {outline: none;}

/* Magin */
.mt10 {margin-top: 10px;}
.mt40 {margin-top: 40px;}

/* Padding */
.pd5{padding:5px 10px !important;}
.pd10{padding:10px 10px !important;}

.pdt5{padding-top:5px !important;}
.pdt10{padding-top:10px !important;}
.pdt50{padding-top:50px !important;}

.pdr0{padding-right:0px !important;}
.pdr5{padding-right:5px !important;}
.pdr10{padding-right:10px !important;}

.pdl0{padding-left:0px !important;}
.pdl10{padding-left:10px !important;}

.pdb5 {padding-bottom: 5px !important;}
.pdb10 {padding-bottom: 10px !important;}
.pdb50 {padding-bottom: 50px !important;}

.pdtb10 {padding-top:10px;padding-bottom: 10px;}

/* Height*/
.ht10 {height:10px !important;}
.ht20 {height:20px !important;}
.ht30 {height:30px !important;}
.ht50 {height:50px !important;}
.ht100 {height: 100px !important;}
.ht200 {height: 200px !important;}
.h100per {height: 100% !important;}

/* Width */
.w90 {width: 90px !important;}
.w50 {width: 50px !important;}
.w60 {width: 60px !important;}
.w100 {width: 100px !important;}
.w200 {width: 200px !important;}
.w300 {width: 300px !important;}
.w800 {width: 800px !important;}
.w720 {width: 720px !important;}
.w100per {width: 100% !important;}

/* Min-Width */
.minw1080{min-width:1080px !important;}

/* Max-Width */
.maxnw100per{max-width: 100% !important;}
.maxnw100per5{max-width: calc(100% - 5px) !important;}

/* Align */
.vat {vertical-align: top;}
.vab {vertical-align: bottom;}
.tac {text-align: center !important;}
.tal {text-align: left !important;}
.tar {text-align: right !important;}

/* Font Weight*/
.fwb {font-weight:bold !important;}

/* Color */
.clrRed {color:#ff0000 !important;}
.clrWht {color:#fff !important;}

/* Display */
.dspBlk {display:block !important;}
.dspIn {display:inline-block !important;}
.dspNone {display:none !important;}

/* Position */
.pstAb {position:absolute !important;}
.pstFx {position:fixed !important;}
.pstRe {position:relative !important;}

#wrap {width: 100%;}
#container{
   /*padding-top: 80px;*/
   /*margin-bottom: 10rem;*/  /* Footer 스크롤 없이 하단 붙이기 */
   /* overflow: hidden; */
}
#container #content{
    height: 100%;
}
@media only screen and (max-width: 1100px) {

 }


/* 헤더*/
#header {
   width: 100%;
   z-index: 9999;
   position: fixed;
   overflow: hidden;
   border-bottom: 1px solid rgba(255, 255, 255, .3);
   transition: background .4s ease;
}
#header.load {
   top: 0;
   transition:0.5s
}
#header .header_wrap {
   position: relative;
   max-width: 1100px;
   margin: 0 auto;
   z-index: 900;
}
#header .header_wrap h1.logo {
   position: absolute;
   top: 22px;
   left: 0px;
   width: 220px;
   height: 50px;
   text-indent: -9999px;
   background: url(../../images/layout/logo.png) 0 0 no-repeat;
   background-size: contain;
   z-index: 999;
}
#header .header_wrap h1.logo > a {
   display: block;
   height: 100%;
   color:#fff;
}
#header .gnbWrap {
   position: relative;
   text-align: center;
   width:100%;
}
#header #gnb {
   font-size: 0;
   text-align: center;
   display: inline-block;
   vertical-align: top;
}
#header .gnbWrap > h2 {
   display: none;
}
#header #gnb > li {
   display: inline-block;
   margin: 0 5px;
   float: left;
}
#header #gnb > li > a {
   display: inline-block;
   height: 90px;
   line-height: 89px;
   padding: 0px 15px;
   color: #fff;
   font-size: 17px;
   text-align: center;
}
#header #gnb > li > a:after {
   display: block;
   content: '';
   border-bottom: solid 2px #002060;
   transform: scaleX(0);
   transition: transform 250ms ease-in-out;
   z-index: 999;
   position: relative;
   top: 0;
}
#header.active {
   background-color: #002060;
   border-bottom: none;
}
#header.active #gnb > li > a {
   color: #fff;
}


@media only screen and (max-width: 1140px) {
   #header .header_wrap {
      margin-right: 20px;
      margin-left: 20px;
   }
 }

@media only screen and (max-width: 1100px) {
   #header {
     overflow: unset;
   }
   #header .header_wrap {
      margin-right: 0px;
      margin-left: 0px;
   }
   #header::after {
     clear: both;
     content: "";
     display: block;
   }
   #header.is-hidden {
     -webkit-transform: translateY(-100%);
         -ms-transform: translateY(-100%);
             transform: translateY(-100%);
   }
   #header .header_wrap h1.logo {
      top: 43px; 
      left: 15px; 
      width: 165px;
   }
   #header .logo a, #header .logo img {
     display: block;
   }
 }


@media only screen and (max-width: 1100px) {
   #header #gnb > li > a{
      display: none;
   }
 }

#header #gnb > li > .two_depth {
   font-size: 0;
   display: none;
   padding: 40px 0 40px;
   box-sizing: border-box;
   width: 100%;
   text-align: center;
}

/*
#header #gnb:hover > li > .two_depth {
   display: block;
}
*/

#header #gnb > li > .two_depth:after {clear: both;content:'';display: block;} 

#header #gnb > li > .two_depth > li {
   text-align: center;
   display: block;
}

#header #gnb > li > .two_depth > li > a {
   display: block;
   color: #fff;
   font-size: 15px;
   line-height: 22px;
   margin-bottom: 20px;
}

#header #gnb > li > .two_depth > li > .th_depth > li {
   text-align: center;
   display: block;
   padding-left: 15px;
}

#header #gnb > li > .two_depth > li > .th_depth > li > a {
   display: block;
   color: #777;
   font-size: 13px;
   line-height: 22px;
   text-align: left;
}

#header.active {}
#header.active:after {content:'';position: absolute;width: 100%;height: 1px;top: 90px;z-index: -1; }

#header.ov{background: #002060;box-shadow: 0 0 14px rgba(0,0,0,.4); transition:0.5s}
#header.ov:after {content:'';position: absolute;top: 91px;width: 100%;
   height: 1px;background-color: rgba(255,255,255,0.4);z-index: -1; transition:0.5s}

#header.active #gnb > li > a {}
#header.active #gnb > li > .two_depth > li > a {}
#header.active #gnb > li > a:hover {}
#header.active #gnb > li > .two_depth > li > a:hover {}

#header.ov #gnb > li > a {}
#header.ov #gnb > li > .two_depth > li > a {}
#header.ov #gnb > li > a:hover {}
#header.ov #gnb > li > .two_depth > li > a:hover {}
#header.ov .header_wrap .top_area .top-btn {
   background: url(/images/bar_01.png) 57% 55% no-repeat;
}
#header .header_wrap .top_area {
   z-index: 100;
   position: absolute;
   top: 38px;
   right: 0px;
   background: url(/images/bar_02.png) 57% 55% no-repeat;
   display: block;
}

#header .header_wrap .top_area .top-btn > a {
   color: rgba(255,255,255,0.8);
   font-size: 14px;
}

#header .header_wrap .top_area .top-btn > a:first-child {
   margin-right: 12px;
}

#header .header_wrap .top_area .top-btn > a:first-child::after {
   content:"";
   width: 1px;
   height: 11px;
   background: rgba(255,255,255,0.8);
}

#header .header_wrap .top_area .top-btn > a:last-child {
   margin-left: 12px;
}

@media only screen and (max-width: 1280px) {

}

@media only screen and (max-width: 1100px) {
   #header .gnbWrap {
      height: 70px;
   }
   #header.active:after {
      top: 70px;
   }
   #header .header_wrap .top_area{
      display: none;
   }
 }

@media only screen and (max-width: 768px) {

 }


 /* 메인 이미지 */
.mainBg {
   position: relative;
   /* width: 100%; */
   /* max-width:100%; */
   height: 100vh;
   margin: 0 auto;
}

.mainBg .visual {
   position: absolute;
   top: 0;
   left: 0;
   /* width: 100%; */
   /* max-width:100%; */
   height: 100vh;
}
.main .mainBg img {
   width: 100%;
   height: 100%;
   position: absolute;
   -ms-transform: scale(1.2,1.2);
   -o-transform: scale(1.2,1.2);
   -moz-transform: scale(1.2,1.2);
   -webkit-transform: scale(1.2,1.2);
   transform: scale(1.2,1.2);
   -webkit-transition: transform 3700ms ease-in-out;
   -moz-transition: transform 3700ms ease-in-out;
   -o-transition: transform 3700ms ease-in-out;
   -ms-transition: transform 3700ms ease-in-out;
   transition: transform 3700ms ease-in-out;
}

@media only screen and (max-width: 1024px) {   
   .mainBg {
      position: relative;

      margin: 0 auto;
      z-index: -1;
   }

   .mainBg .visual {
      position: absolute;
      top: 0;
      left: 0;

   }
}

@media only screen and (max-width: 768px) {

}


/* .main .mainBg > img {
   /* width: 100%; 
   max-width:100%;
   height: 100%;
   position: absolute;
   -ms-transform: scale(1.2,1.2);
   -o-transform: scale(1.2,1.2);
   -moz-transform: scale(1.2,1.2);
   -webkit-transform: scale(1.2,1.2);
   transform: scale(1.2,1.2);
   -webkit-transition: transform 3700ms ease-in-out;
   -moz-transition: transform 3700ms ease-in-out;
   -o-transition: transform 3700ms ease-in-out;
   -ms-transition: transform 3700ms ease-in-out;
   transition: transform 3700ms ease-in-out;
} */

.mainBg .visual li{
   position: absolute;
   top: 50%;
   left: 50%;
   width: 100%;
   height: 100%;
   transform: translate(-50%,-50%);
   background-repeat: no-repeat;
   background-position: center center;
   -webkit-background-size: cover;
   -moz-background-size: cover;
   -o-background-size: cover;
   background-size: cover;
}

.visual .mainBg01 {
   background: url('/images/visual_01.jpg?v=221102')  no-repeat center center;
}

.visual .mainBg02 {
   background: url('/images/visual_02.jpg?v=221102')  no-repeat center center;
}


@media only screen and (max-width: 1100px) {

}

@media only screen and (max-width: 768px) {

}

@media only screen and (max-width: 480px) {

}


.textWrap {
   width: 100%;
   position: absolute;
   top: 39%;
   left: 50%;
   text-align: center;
   margin: 0 auto;
   z-index:999;
   transform: translate(-50%,-50%);
}

.textWrap > div {
   left: 0;
   top: 50%;
   width: 1000px;
   padding-left: 70px;
   height: ;
   margin: 0 auto;
   text-align: left;

}

.textWrap .textB {
   display: inline-block;
   color: #fff;
   font-size: 80px;
   font-weight: bold;
   line-height: 100px;
   padding-bottom: 20px;
   letter-spacing: -1px;
   text-shadow: 4px 4px 5px rgba(0,0,0,0.4);
}

.textWrap .textB .f80 {

}

.textWrap .textS{  
   font-size: 20px;
   color: #ddd;
   text-shadow: 3px 3px 3px rgba(0,0,0,0.4);
   margin-top: 15px;
}

.slide-right {
 width: 100%;
 overflow: hidden;
}
.mainBg01 .slide-right > .slide-right1 {
 animation: 2s main01-1 forwards;
 animation-delay: 0s;
 opacity: 0;
 margin-left: 160px;
}
.mainBg01 .slide-right > .slide-right2 {
 animation: 2s main01-2 forwards;
 animation-delay: 0.8s;
 opacity: 0;
 padding-left: 50px;
 margin-left: 160px;
}
.mainBg02 .slide-right > .slide-right1 {
   animation: 4.7s main02-1 forwards;
   animation-delay: 0s;
   opacity: 1;
  }
.mainBg02 .slide-right > .slide-right2 {
   animation: 4.7s main02-2 forwards;
   opacity: 1;
   padding-left: 50px;
}

@keyframes main01-1 {
   to {
     opacity: 1;
     margin-left: 0%;
   }
}
@keyframes main01-2 {
   to {
     opacity: 1;
     margin-left: 0%;
   }
}
@keyframes main02-1 {
   0% {
      opacity: 1;
    }
    20% {
      opacity: 1;
      margin-left: 0%;
    }
    80% {
      opacity: 1;
      margin-left: 0%;
    }
    100% {
      opacity: 0;
      margin-left: 0%;
    }
}
@keyframes main02-2 {
   0% {
     opacity: 1;
   }
   20% {
     opacity: 1;
     margin-left: 0%;
   }
   80% {
     opacity: 1;
     margin-left: 0%;
   }
   100% {
     opacity: 0;
     margin-left: 0%;
   }
  }
/* .fast {
   animation-delay: 0.3s !important;
}

.slow {
   animation-delay: 0.5s !important;
}

.reallyslow {
   animation-delay: 0.7s !important;
}

.reallyslow_s {
   animation-delay: 0.5s !important;
   
} */
@media only screen and (min-width: 1580px) {
   .videowrapper video {
      width: 100%;
      height: auto !important;
  }
}
@media only screen and (max-width: 1280px) {

}

@media only screen and (max-width: 1100px) {
   .textWrap .textB {
      font-size: 70px;
      line-height: 85px;
   }
}

@media only screen and (max-width: 768px) {
   .textWrap .textB {
      font-size: 65px;
      line-height: 80px;
   }
}

@media only screen and (max-width: 480px) {
   .textWrap > div {
      padding-left: 50px;
   }
   .textWrap .textB {
      font-size: 50px;
      line-height: 65px;
   }
}
 


.bx-wrapper {
   box-shadow: none !important; 
   border: none !important;
   background: none !important;
   margin-bottom: 0 !important;
}
.bx-wrapper .bx-pager-item {
   margin-bottom: 8px;
   cursor: default !important;
}
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager {
   width: 80% !important;
   left: 95px;
}
.bx-wrapper .bx-pager.bx-default-pager a {
   background: rgba(255,255,255,0.4) !important;
   margin: 0 7px !important;
   cursor: default !important;;
}
.bx-wrapper .bx-pager.bx-default-pager a.active {
   cursor: default !important;
}
.bx-wrapper .bx-pager.bx-default-pager a.active {
   background: #fff !important;
}
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto {
   display: none;
}
.bx-controls {
   display: block;
   position: absolute;
   top: 50%;
   right: 50px;
   text-align: center;
   /* width: 100%; */
   max-width:100%;
}

@media only screen and (max-width: 1280px) {
   .bx-controls {
      display: block;
      position: absolute;
      top: 50%;
      right: 50px;
      text-align: center;
      /* width: 100%; */
      max-width:100%;
   }
 }

 @media only screen and (max-width: 480px) {
   .bx-controls {
      right: 30px;
   }
   
 }

#container .container_wrap {
   text-align: center;
}

.scrollDown {
   position: absolute;
   bottom: 50px;
   left: 50%;
   transform: translate(-50%, 0%);
}
.chevron {
   position: absolute;
   width: 28px;
   height: 8px;
   opacity: 0;
   transform: scale3d(0.5, 0.5, 0.5);
   animation: move 3s ease-out infinite;
   margin-left: 30px;
 }
 
 .chevron:first-child {
   animation: move 3s ease-out 1s infinite;
 }
 
 .chevron:nth-child(2) {
   animation: move 3s ease-out 2s infinite;
 }
 
 .chevron:before,
 .chevron:after {
   content: ' ';
   position: absolute;
   top: 0;
   height: 100%;
   width: 51%;
   background: #fff;
 }
 
 .chevron:before {
   left: 0;
   transform: skew(0deg, 30deg);
 }
 
 .chevron:after {
   right: 0;
   width: 50%;
   transform: skew(0deg, -30deg);
 }
 
 @keyframes move {
   25% {
     opacity: 1;
 
   }
   33% {
     opacity: 1;
     transform: translateY(30px);
   }
   67% {
     opacity: 1;
     transform: translateY(40px);
   }
   100% {
     opacity: 0;
     transform: translateY(55px) scale3d(0.5, 0.5, 0.5);
   }
 }
 
.text {
   display: block;
   margin-top: 75px;
   font-family: "Helvetica Neue", "Helvetica", Arial, sans-serif;
   font-size: 12px;
   color: #fff;
   text-transform: uppercase;
   white-space: nowrap;
   opacity: .25;
   animation: scrolltext 2s linear alternate infinite;
}

@keyframes scrolltext {
   to {
     opacity: 1;
   }
}
@-webkit-keyframes scrolltext {
   to {
      opacity: 1;
    }
 }

/* 메인 배너 */
.mainBannerBox{

}
.mainCon01 {
   width: 1100px;
   margin: 0 auto;
   padding-top: 100px;
   padding-bottom: 130px;
}
.conTop {
   text-align: center;
}
.mainCon01 .conTop .j-name {
   color: #aaa;
   font-size: 13px;
   font-weight: bold;
   letter-spacing: 10px;
   margin-top: 10px;
}
.mainCon01 .conTop .j-text {
   color: #444;
   font-size: 23px;
   font-weight: 800;
   letter-spacing: -1px;
   line-height: 38px;
   margin-top: 25px;
   margin-bottom: 80px;
   padding: 0px 50px;
}
.mainCon01 .conTop .j-text > span {
   color: #003bb1;
}
.mainCon01 .conBottom {
   display: flex;
   justify-content: space-between;
}
.mainCon01 .conBottom ul.j-point {
   width: 30%;
   vertical-align: top;
}
.mainCon01 .conBottom ul.j-point li {
   display: block;
   color: #333;
   font-size: 24px;
   font-weight: 800;
   margin-bottom: 25px;
   text-align: center;
}
.mainCon01 .conBottom ul.j-point li:first-child {
   height: 100px ;
}
.mainCon01 .conBottom ul.j-point li:last-child {
   color: #888;
   font-size: 15px;
   font-weight: normal;
   line-height: 24px;
}
.mainCon02 {
   font-size: 0;
   height: 450px;
   background: #f5f5f5;
}
.mainCon02 .conLeft, .mainCon02 .conRight {
   display: inline-block;
   width: 50%;
   vertical-align: top;
}
.mainCon02 .conLeft {
   position: relative;
}
.mainCon02 .conRight {
   overflow: hidden;
   text-align: left;
}
.mainCon02 .conRight > img {
   height: 450px;
}
.mainCon02 .conLeft .j-link {
   width: 550px;
   position: absolute;
   top: 100px;
   right: 0;
   text-align: left;
}
.mainCon02 .conLeft .j-link li {
   font-size: 16px;
   color: #777;
   line-height: 26px;
   width: 80%;
   word-break: break-all;
}
.mainCon02 .conLeft .j-link li:first-child {
   font-size: 26px;
   color: #222;
   font-weight: 800;
   margin-bottom: 20px;
   letter-spacing: -0.25px;
}
.mainCon02 .conLeft .j-link li:last-child {
   margin-top: 30px;
}
.mainCon02 .conLeft .j-link li > a {
   display: inline-block;
   font-size: 16px;
   color: #fff;
   height: 50px;
   line-height: 46px;
   background:#002060;
   background-position-x: 170px;
   padding: 0px 25px 0px 25px;
}
.mainCon02 .conLeft .j-link li > a > span {
   display: inline-block;
   padding-left: 20px;
}


@media only screen and (max-width: 1140px) { 
   #container .container_wrap {
      width: 100%;
   }
   .mainCon01{
      width: calc(100% - 40px);
      padding-left: 20px;
      padding-right: 20px;
   }
   .mainCon01 .conTop .j-text {
      font-size: 22px;
      line-height: 36px;
      margin-bottom: 70px;
      padding: 0px 20px;
  }
  .mainCon02{
      
   }
  .mainCon02 .conLeft .j-link {
      width: auto;
      left: 50px;
   }
}


@media only screen and (max-width: 1024px) {  
   .mainCon01{
      padding-top: 100px;
      padding-bottom: 110px;
   }
   .mainCon01 .conBottom ul.j-point li {
      font-size: 22px;
      margin-bottom: 20px;
   }
   .mainCon02{

   }
   .mainCon02 .conLeft .j-link {
      top: 80px;
   }
   .mainCon02 .conLeft .j-link li:first-child {
      font-size: 24px;
   }
   .mainCon02 .conLeft .j-link li > br {
      display: none;
   }
} 

@media only screen and (max-width: 768px) {
   .mainCon01{
      padding-top: 80px;
      padding-bottom: 40px;
   }
   .mainCon01 .conTop .j-text {
      font-size: 20px;
      line-height: 30px;
      margin-bottom: 70px;
      padding: 0px 20px;
   }
   .mainCon01 .conBottom {
      display: block;
   }
   .mainCon01 .conBottom ul.j-point {
      width: 100%;
      margin-bottom: 50px;
   }
   .mainCon01 .conBottom ul.j-point li {
      font-size: 20px;
      margin-bottom: 10px;
   }
   .mainCon01 .conBottom ul.j-point li:first-child {
      height: 80px;
   }
   .mainCon01 .conBottom ul.j-point li > img {
      width: 80px;
   }
   .mainCon02 .conLeft .j-link li:first-child {
      font-size: 22px;
   }
   .mainCon01 .conBottom ul.j-point li:last-child {
      padding: 0px 50px;
   }
   .mainCon02 {
      height: 400px;
   }
   .mainCon02 .conRight {
      display: none;
   }
   .mainCon02 .conLeft {
      width: 100%;
   }
   .mainCon02 .conLeft .j-link {
      width: 80%;
      left: 50%;
      text-align: center;
      transform: translate(-50%,0);
   }
   .mainCon02 .conLeft .j-link li {
      width: 100%;
      font-size: 15px;
      line-height: 24px;
   }
   .mainCon02 .conLeft .j-link li > a {
      font-size: 14px;
   }
 }

 @media only screen and (max-width: 480px) {
   .mainCon02 .conLeft .j-link {
      
   }
 }



/*table {margin: 0px;border-collapse: collapse;-ms-word-break: keep-all;word-break: keep-all;}*/
.mainTableList {width: 100%;table-layout: fixed;color: #666;margin: 0px;border-collapse: collapse;-ms-word-break: keep-all;word-break: keep-all;}
/* .mainTableList th {border: 1px solid #c3c8cb;height: 28px;color: #658290;font-weight:bold;} */
.mainTableList tr td {height: 42px;font-size: 1.5rem; border-bottom: 1px solid #e6e6e6;}
.mainTableList tr:last-child td {border-bottom: none;}
.mainTableList th {text-align: center;}
.mainTableList .tac {text-align: center;}
.mainTableList .tal {text-align: left;padding-left: 10px;}
.mainTableList .tar {text-align: right;padding-right: 0px;color:#999;}
.mainTableList .taj {text-align: justify;padding-left: 10px;padding-right: 10px;}
.mainTableList .bt3px51b9d3 {border-top: 3px solid #51b9d3;}
/* .mainTableList > tbody > tr:hover{background-color:#d5d5d5} */


@media only screen and (max-width: 1100px) { 
   .mainTableList tr td {height: 40px;font-size: 1.5rem; border-bottom: 1px solid #e6e6e6;}
}

/* 메인 공지사항 제목 ... */
.txt_line { 
   width: calc(100% - 10px); 
   padding: 0px 5px 0px 0px; 
   overflow: hidden; 
   text-overflow: ellipsis; 
   white-space: nowrap; 
}

.txt_line > img { 
   vertical-align: top;
}
 
.txt_line > a{ 
   color:#333;
}

/* 메인 TAB */
.tabArea {
   font-size: 1.6rem;
   min-width: 320px;
   max-width: 100%;
   /*padding: 50px;*/
   /*margin: 0 auto;*/
   background: #ffffff;
   /* border-bottom: 1px solid #ddd; */
   margin-bottom: 20px;
}
/* 
section {
   display: none;
   padding: 20px 0 0;
   border-top: 1px solid #ddd;
} */

/*라디오버튼 숨김*/
.tabArea > input {
   display: none;
}

.tabArea > label {
   display: inline-block;
   margin: 0 0 -1px;
   padding: 0px 25px 0px 0px;
   font-weight: 600;
   text-align: center;
   color: #bbb;
   font-size : 1.7rem
   /* border: 1px solid transparent; */
}

.tabArea > label:hover {
   /* color: #2e9cdf; */
   cursor: pointer;
}

/*input 클릭시, label 스타일*/
.tabArea > input:checked + label {
   color: #222;
   /* border: 1px solid #ddd;
   border-top: 2px solid #2e9cdf;
   border-bottom: 1px solid #ffffff; */
}

#tab1:checked ~ #noticeTab1,
#tab2:checked ~ #noticeTab2 {
   display: block;
}

.more{
   float: right;
   padding-top: 0px;
   padding-right: 0px;
   vertical-align: top;
   margin-top: -5px;
   /* padding:6px 3px 5px 9px;
   border-radius: 50%;
   width:20px;
   height:20px;
   border:1px solid #bbb;
   vertical-align: middle; */
}

@media (max-width: 768px){      
   .table table tbody {
      width: 100%;
      display: block;
   }
   .tabArea > label{
      font-size: 1.75rem;
   }
   .mainTableList tr td {height:45px;}
}

@media (max-width: 480px){     
   .tabArea {
      margin-bottom: 5px;
   }

   .tabArea > label{
      padding: 0px 10px 10px 0px;
   }
   .mainTableList tr td {padding-left:px}
   .mainTableList tr td:first-child {padding-left:px}
   .mainTableList tr td:last-child {padding-right:px}

   .more {
      padding-right: ;
  }
}


/*** footer ***/
#footer {
   clear: both; 
   width: 100%;
   /* margin-top: -16rem; */ /* Footer 스크롤 없이 하단 붙이기 */
   background: #fff;
   /* padding: 20px 0px 20px; */
   /* overflow:hidden; */
}
.footer {
   max-width: 1100px;
   margin: 0 auto;
   padding-top: 40px;
   padding-bottom: 100px;
}
.footer-logo {
  display: inline-block;
  vertical-align: top;
  margin-right: 70px;
  width: 220px;
  height: 50px;
  text-indent: -9999px;
  overflow: hidden;
  background: url('../../images/layout/footer_logo.png?v=221103') 0 0 no-repeat;
  background-size: contain;
}
.footer-logo > img {
}
#footer .address {
   display: inline-block;
   padding-left: 0px;
   color: #888;
   font-size: 13px;
   line-height: 26px;
}
#footer .address .privacy > a{
   display: inline-block;
   color: #777;
   font-weight: bold;
   margin-bottom: 10px;
}
#footer .address .privacy > a:hover{
   color: #ee4e0f;
}
#footer .address div > img {
   vertical-align: top;
   margin: 8px 10px 0px 10px;
   opacity: 0.7;
}
.footerAddr, .footerTel {
   display: inline-block;
}
.footerCopy {
   display: block;
}

@media (max-width: 1140px) {
   .footer {
      padding: 30px 30px 50px;
   }
}

@media (max-width: 1100px) {
   .footer-logo {
      width: 165px;
   }
   .footerAddr, .footerTel {
      display: block;
   }
   #footer .address div > img {
      display: none;
   }
}

@media only screen and (max-width: 768px) {
   .footer {
      padding-top: 30px;
      padding-left: 30px;
      padding-right: 30px;
   }
   .footer-logo {
      display: block;
      margin-right: 0px;
      margin-bottom: 10px;
   }
   #footer .address {
      font-size: 12px;
      line-height: 22px;
   }
}
@media only screen and (max-width: 480px) {
   #footer .address {
      font-size: 11px;
      line-height: 22px;
   }
}



 input[type="text"], input[type="password"] {
   font-size: 15px;
   height: 32px;
   line-height: 32px;
   padding-left: 15px;
   border: 1px solid #cdcdcd;
   -webkit-appearance: none;
}


 
/*** 로그인 ***/
#login-contents {
   width: 400px;
   /* min-height: 300px; */
   margin: 0 auto;
   margin-top: 100px;
   text-align: left;
   min-height: calc(100% - 300px);;
}

#login-contents > h4 {
   font-size: 26px;
   font-weight: bold;
   margin-bottom: 15px;
}

#login-contents > h4 > span {
   font-size: 15px;
   font-weight: normal;
   color:#999;
}

.login_box {
   width: auto;
}

.input_box {
   padding-right: 20px;
}

.input_box > input[type=text], input[type=password] {
   width: 378px;
   border-color: #ddd;
   color: #666;
   font-size: 16px;
   padding: 0 0 0 20px;
   line-height: 52px;
   height: 52px;
   margin-bottom: 10px;
 }

 .login_btn > a {
   display: inline-block;
   background: #002060;
   width: 400px;
   height: 58px;
   line-height: 58px;
   color: #fff;
   font-size: 16px;
   text-align: center;
   border-radius: 50px;
   margin-top: 20px;
 }


@media only screen and (max-width: 480px) {
   
   
   /*** 로그인 ***/
   #login-contents {
      width: calc(100% - 7rem);
      min-height: 300px;
      margin: 0 auto;
      margin-top: 100px;
      text-align: left;
   }

   #login-contents > h4 {
      font-size: 26px;
      font-weight: bold;
      margin-bottom: 15px;
      padding-left:20px;
   }

   #login-contents > h4 > span {
      font-size: 15px;
      font-weight: normal;
      color:#999;
   }

   .login_box {
      width: auto;
   }

   .input_box {
      padding: 0px 0px 0px 20px;
   }

   .input_box > input[type=text], input[type=password] {
      /* width: 378px; */
      width: calc(100% - 4.2rem);
      border-color: #ddd;
      color: #666;
      font-size: 16px;
      padding: 0 0 0 20px;
      line-height: 52px;
      height: 52px;
      margin-bottom: 10px;
   }

   .login_btn{
      padding-left:20px;
   }

   .login_btn > a {
      display: inline-block;
      background: #002060;
      /* width: 400px; */
      width: calc(100% - 2.2rem);
      height: 58px;
      line-height: 58px;
      color: #fff;
      font-size: 16px;
      text-align: center;
      border-radius: 50px;
      margin-top: 20px;
   }
 }

 /* 찾아오시는길 */

 a#MOVE_TOP_BTN {
   position: fixed;
   right: 2%;
   bottom: 50px;
   display: none;
   z-index: 999;
}

a#MOVE_TOP_BTN:hover {
   transition: all ease 0.5s 0s;
}