@charset "euc-kr";
@font-face {
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 400;
  src: url(https://example.com/MaterialIcons-Regular.eot); /* For IE6-8 */
  src: local('Material Icons'),
    local('MaterialIcons-Regular'),
    url(https://example.com/MaterialIcons-Regular.woff2) format('woff2'),
    url(https://example.com/MaterialIcons-Regular.woff) format('woff'),
    url(https://example.com/MaterialIcons-Regular.ttf) format('truetype');
}
.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;  /* Preferred icon size */
  display: inline-block;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: normal;
  white-space: nowrap;
  direction: ltr;

  /* Support for all WebKit browsers. */
  -webkit-font-smoothing: antialiased;
  /* Support for Safari and Chrome. */
  text-rendering: optimizeLegibility;

  /* Support for Firefox. */
  -moz-osx-font-smoothing: grayscale;

  /* Support for IE. */
  font-feature-settings: 'liga';
}
/* CSS Document */
*{margin:0; padding:0; font-family:'©ø¨£¢¥¢ç ¡Æi¥ìn', 'Nanum Gothic', 'NanumGothic', sans-serif; box-sizing:border-box;}
a{text-decoration:none;}
a:link{text-decoration:none;}
a:hover{text-decoration:none;}
a:active{text-decoration:none;}
a:visited{text-decoration:none;}
.clearfix:before,
.clearfix:after{display:table; content:"";}
.clearfix:after{clear:both;}
ul,li{list-style:none;}
table {border-collapse: collapse;}
body {max-width: 800px; min-width: 340px; margin: 0 auto !important}
/* top */
.menubox .menu_title {margin-top: 20px;}
.menubox .menu_title h1 {font-size: 34px; color: #444;}
.menubox .menu_title p {font-size: 20px; margin-bottom: 20px;}
.menubox .menu_copy {text-align: center; margin-top: 30px;}
.menubox .menu_copy h1 {font-size: 18px; color:#000;}
.menubox .menu_copy h2 {font-size: 24px; line-height:30px; margin-top:10px; color:#000 !important;}
.menubox .menu_copy h2 a {color: #333;}
.menubox {position: fixed; left: -100%; top: 0; transition: all 0.3s; width: 100%; height: 100%; background: #fff; z-index: 9999; padding: 30px; overflow: auto;}
.menubox ul.sidelist li a {color: #333;}
.menubox ul.sidelist li  {padding: 10px 0; border-bottom: 1px solid #ddd;}
.menubox p.sidebtn {position: relative; border-bottom: 1px solid #ddd; font-size: 20px; padding: 20px 0; font-weight: 600;}
.menubox p.sidebtn:after {content: ''; position: absolute; right: 0; top: 30px; width: 15px; height: 2px; background: #666; transform:rotate(90deg);}
.menubox p.sidebtn:before {content: ''; position: absolute; right: 0; top: 30px; width: 15px;height: 2px; background: #666;}
.menubox.on {left: 0px;}
.top {width: 100%; position: fixed; top: 48px; left: 0; border-bottom: 1px solid #ddd;background: #fff; z-index: 9998; height: 50px;}
.top a {position: relative; top: 5px; left: 10px;}
.top a img {width: 160px;}
.top .menubtn { position: absolute; right: 10px; top: 12px; width: 30px; height: 24px; z-index: 99999;}
.top .menubtn .btn_c {position: absolute; width: 15px;height: 1px;background: #000; top: 10px;}
.top .menubtn .btn_t,
.top .menubtn .btn_b {position: absolute; width: 30px; height: 1px; background: #000;}
.top .menubtn .btn_b {bottom: 0;}
.menubox .close {position: absolute; top: 52px; right: 10px; width: 30px;height: 30px;}
.menubox .close ul li:first-child {transform: rotate(-45deg);}
.menubox .close ul li:last-child {transform: rotate(45deg);}
.menubox .close ul li:first-child,
.menubox .close ul li:last-child {position: absolute; top: 15px; width: 30px; height: 1px; background: #000;}
.menubox .sidemenu ul.sidelist {display: none;}
.container {}
/*section01*/
 
/*section02*/
.section02  {padding: 0 10px;background: #f3f3f3; padding-top: 10px;}
.main_title{text-align: center; display: block;}
.main_title p:first-child {font-size: 28px; margin: 0px auto;}
.main_title p:last-child {font-size: 18px; font-weight: 400; color: #444; letter-spacing: -1px; margin-bottom: 10px; padding-top: 10px;}
.section02 .main_title p:last-child {font-size: 16px;}
.section02 div {width: 49%; text-align: center;  float: left;position: relative; height:150px; overflow: hidden; z-index: 998; border-radius: 10px; margin: 20px auto;}
.section02 div:nth-of-type(1) {background: url(../img/section02_1.jpg) no-repeat center center / cover ; margin-right: 2%;}
.section02 div:nth-of-type(2) {background: url(../img/section02_2.jpg) no-repeat center center / cover ;}
.section02 div:last-child {background: url(../img/section02_3.jpg) no-repeat center center / cover ;}
.section02 div>a {width: 100%; display: block; height:100%; background: #000; opacity: .3; position: absolute; z-index: 998;}
.section02 div>span {position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); z-index: 999;}
.section02 div span span {display: block; font-size: 60px; color: #fff;}
.section02 div span p {font-size: 20px; color: #ddd; font-weight: 700; width: 200px}

.section01 a img {max-width: 100%; position: fixed; top: 0; left: 50%; transform: translateX(-50%); z-index: 9998;}
/*section03*/
.section03 {margin: 0px auto; margin-top: 20px; }
.section03 .blinking {width: 80%;font-size: 18px; text-align: center; font-weight: 700; color: #3aaeea; margin: 40px auto;}
.section03 .blinking b {font-size: 30px;font-weight: 800;}
.section03 .main_title p:last-child {margin: 0;padding: 0;}
.section03 .main_title p:first-child {}
.section3box {width: 100%; padding: 0 10px; margin-top: 10px;}
.section3box div {border: 1px solid  #ddd; text-align: center; width: 49%; float: left; position: relative; padding: 10px 20px; margin-bottom: 10px;}
.section3box div:hover {border-image: linear-gradient(to right, #01c9ca 0%, #3886FF 100%); border-image-width: 10px; border-image-slice: 1; }
.section3box div p:first-child {font-size: 20px; font-weight: 700; color: #333;}
.section3box div p:nth-of-type(2) {height: 50px; line-height: 1.5em; padding-top: 10px; font-size: 12px; letter-spacing: -1px; color: #333;}
.section3box div:nth-child(odd) {margin-right: 2%;}
.section3box .material-icons {font-size: 40px; color: #666; margin-top: 10px;}
/*section04*/
.section04 {margin: 10px auto;}
/*section05*/
.section05 {text-align: center; padding: 10px 10px;background: #f3f3f3; padding-bottom: 20px;}
.section05 .main_title p:last-child {letter-spacing: -2px; margin-bottom: 10px;}
.section05 .section05_table {width: 100%;}
.section05 .section05_table div {width: 32%; background: #fff; border-radius: 10px; float: left; margin-top: 10px;position: relative; height: 120px; overflow: hidden;}
.section05 .section05_table div span:first-child {font-size: 40px; margin-top: 40px; color: #444;}
.section05 .section05_table div span:last-child {width: 100%; height: 30px; background: #3aaeea;position: absolute; top: 0;left: 0; line-height: 30px;color: #fff; font-weight: 800;}
.section05 .section05_table div:nth-child(2){margin-left: 2%; margin-right: 2%;}
.section05 .section05_table div:nth-child(5){margin-left: 2%; margin-right: 2%;}
/*.section05 .section05_table div:last-child span:last-child{background: linear-gradient(to right, #36b0ed, #014d71);}*/
.section05 .section05_table div:nth-child(5) p {color: #36b0ed; font-weight: 700; font-size: 20px;}
.section05 .section05_table div:last-child a p {color: #333;}
.section05 iframe {float: left; margin: 1%;}
.section05 .mainline {width: 95%; height: 8px; margin: 0 auto; background: linear-gradient(to right, #36b0ed, #014d71); margin-bottom: 20px; position: relative;}
.section05 .mainline span:first-child {position: absolute; top: -4px;left: -2px; width: 16px;height: 16px; border-radius: 100%; display: inline-block;background: #36b0ed;}
.section05 .mainline span:last-child {
    position: absolute; top: -7px; right: -5px; width: 0; height: 0; border-top: 11px solid transparent; border-bottom: 11px solid transparent; border-left: 11px solid #014d71;
}
.section06 {padding: 10px; margin-top: 10px;}
.section07 {margin: 10px 0; padding: 10px;}
.section_title {}
.section_title p {font-size: 20px; font-weight: 700; color: #333; padding-bottom: 15px; float: left;}
.section_title span {font-size: 20px; font-weight: 700; color: #333; padding-bottom: 5px;}
.section_title .more {color: #333; float: right;}


/*copy*/
.copy {background: #333; color: #666; margin-bottom: 80px;}
.copy a img {width: 120px;}
.copy .copynav {width: 100%; position: fixed; bottom: 0; left: 0; z-index: 9998;}
.copy .copynav div {width: 50%; float: left; text-align: center;}
.copy .copynav div:first-child {background: #014d71;}

.copy .copynav div:last-child {background: #36b0ed; text-align: center;}
.copy .copynav div:last-child a{line-height: 80px;}
.copy .copynav div a {display: block;font-size: 14px; width: 100%;  height: 80px; color: #fff;}
.copy .copynav div:first-child a {height: 40px; line-height: 40px;}
.copy .copynav div:first-child a:first-child {background: #666;}
.copy .copybox {padding: 10px;}
.copy .copybox p{font-size: 12px;line-height: 1.5em; letter-spacing: -1px;}

/*sub*/
.sub {min-width: 800px; min-width: 340px; margin: 0px auto !important;}

.sub01 .smenu ul li:first-child a,
.sub02 .smenu ul li:nth-child(2) a,
.sub03 .smenu ul li:nth-child(3) a,
.sub04 .smenu ul li:nth-child(4) a,
.sub05 .smenu ul li:nth-child(5) a {color:#fff; background:#333;}

.sub .smenu {text-align: center; width: 100%;}
.sub .smenu ul {width: 90%; margin: 30px auto;}
.sub .smenu ul li {float: left; border: 1px solid #ddd; width: 50%;  box-sizing: border-box; }
.sub .smenu ul li:nth-child(2),
.sub .smenu ul li:nth-child(4),
.sub .smenu ul li:nth-child(6){margin-left: -1px;}
.sub .smenu ul li:nth-child(3),
.sub .smenu ul li:nth-child(4),
.sub .smenu ul li:nth-child(5),
.sub .smenu ul li:nth-child(6) {margin-top: -1px;}
.sub .smenu ul li a { color: #333; display: block; padding: 14px 10px;}
.sub .contents {padding: 10px;}
.sub .contents .title {font-size: 24px; font-weight: 700;text-align: left; border-left: 4px solid #0f6dad; padding-left: 5px; margin: 20px 10px;}
.sub .contents .sbox {padding: 10px;line-height: 1.5em;}
.sub .contents .sbox .ssbox p {border-bottom: 1px solid #ddd; padding-bottom: 20px;}
.sub .contents .sbox .ssbox p:last-child {border: none;}
.sub .contents .sbox .ssbox b {padding: 20px 0; display: block; font-size: 18px;}
.subtop {width: 100%; height: 200px; text-align: center; margin-top: 50px;}
.subtop p {color: #fff; font-size: 30px; line-height: 250px;}
.sub .contents .sbox .smap {width: 100%; height: 300px;}

.subtop01 {background: url(../img/subtop01.jpg) no-repeat top center / cover;}
.subtop02 {background: url(../img/subtop02.jpg) no-repeat center center / cover;}
.subtop03 {background: url(../img/subtop03.jpg) no-repeat center center / cover;}
.subtop04 {background: url(../img/subtop04.jpg) no-repeat center center / cover;}
.subtop05 {background: url(../img/subtop05.jpg) no-repeat center center / cover;}

.sub02_02_img img {max-width: 100%;}
.sub02_03_img img {max-width: 100%;}
.stable { margin-bottom: 20px; font-size: 12px; padding-bottom: 20px;}
.stable td,
.stable th {padding: 4px;}
.blinking span {font-size: 16px; color: #3aaeea; font-weight: 600;}
.blinking{ 
    -webkit-animation:blink 1s ease-in-out infinite alternate; 
    -moz-animation:blink 1s ease-in-out infinite alternate; 
    animation:blink 1s ease-in-out infinite alternate; 
    position: relative;
    z-index: 9997;
} 
    @-webkit-keyframes blink{
        0% {opacity:0;} 
        100% {opacity:1;}
    } 
    @-moz-keyframes blink{
        0% {opacity:0;}
        100% {opacity:1;} 
    } 
    @keyframes blink{
        0% {opacity:0;}
        100% {opacity:1;} 
    }