*{margin:0;padding:0;-webkit-text-size-adjust:none;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
a{text-decoration:none;margin:0;padding:0;}
a:hover,a:focus,a:link,a:visited{text-decoration:none;}

ul, li{list-style:none;}
img{border:none;max-width:100%;height:auto;}
a img {border:none;max-width:100%;height:auto;}


html {
  margin: 0;padding:0;
  background:#ffffff;
  background-attachment: fixed;
  background-size: auto 100%;
    background-repeat: no-repeat;
     -webkit-text-size-adjust: none;
     -moz-text-size-adjust: none;
     -ms-text-size-adjust: none;
     -o-text-size-adjust: none;
}

body {margin:0px;padding:0px;overflow-x:hidden;}


/* 패드 */
@media only screen and (min-width : 840px) and (max-width : 1024px) {

#mainImg{background-color:#00043b;}

.Menu{position:absolute;width:100%;height:100%;}

.Hambeger-icon{position:absolute;width:50px;right:30px;top:25px;z-index:5;}
.Hambeger-icon span {height:7px;width:60px;background:white;display:block;margin: 7px 0px 7px 0px;transition: 0.4s ease-in-out;transform: none;border-radius:5px;}

input.hamburger-checkbox {position: absolute;z-index: 10;top: 10px;right: 20px;width: 40px;opacity: 0;height: 25px;}
#openmenu:checked ~ .menu-pane {
  width: 400px;
  right: 0;
  transform: translateX(-0px);
  transition: 0.6s ease-in-out;
}
#openmenu:checked ~ .body-text {
display: none;
}
#openmenu:checked ~ .Hambeger-icon{
  position:fixed;
}
#openmenu:checked ~ .Hambeger-icon span:nth-of-type(1) {
  transform: translate(0%, 200%) rotate(-45deg);
  background-color: black;
}
#openmenu:checked ~ .Hambeger-icon span:nth-of-type(2) {
  transform: scale(0,0);
}
#openmenu:checked ~ .Hambeger-icon span:nth-of-type(3) {
  transform: translate(0%, -190%) rotate(45deg);
  background-color: black;
}

div.menu-pane {
  background-color: #fff;
  position: fixed;
  transform: scale(0,0) translateX(100vw);
  top: 0;
  right: 0;
  width: 0px;
  height: 100vh;
  transition: 0.6s ease-in-out;
  z-index:4;
}

div.menu-pane ul.dump{width:100%;height:120px;padding:0;}
.category{width:100%;padding:10px 0px 10px 50px; text-align:left;}
.category li{width:100%;padding-bottom:20px;}
.category li:hover span{color:#0d6efd;}
div.menu-pane ul li label{display:inline-block;width:100%;}
div.menu-pane ul li label span{font-size:150%;color:black;}
.updown1{position:absolute; right:10px;}

#updown1{position:absolute;display:none;}
#updown2{position:absolute;display:none;}
#updown3{position:absolute;display:none;}
#updown4{position:absolute;display:none;}
.category1{height:0px;opacity: 0;transform: translateY(0px);transition: 0.2s ease-in-out;}
.category1 li{padding:20px 0 10px 0;display:none;color:black;cursor:pointer;}
.category1 li:hover{text-decoration:underline;}
.category2{height:0px;opacity: 0;transform: translateY(0px);transition: 0.2s ease-in-out;}
.category2 li{padding:20px 0 10px 0;display:none;color:black;cursor:pointer;}
.category2 li:hover{text-decoration:underline;}
.category3{height:0px;opacity: 0;transform: translateY(0px);transition: 0.2s ease-in-out;}
.category3 li{padding:20px 0 10px 0;display:none;color:black;cursor:pointer;}
.category3 li:hover{text-decoration:underline;}
label{cursor:pointer;}

#updown1:checked ~ .category1 {
  opacity: 1;
  height:100px;
  transform: translateY(5px);
  transition: 0.6s ease-in-out;
}
#updown1:checked ~ .category1 li {display:block;}
#updown2:checked ~ .category2 {
  opacity: 1;
  height:100px;
  transform: translateY(5px);
  transition: 0.6s ease-in-out;
}
#updown2:checked ~ .category2 li {display:block;}
#updown3:checked ~ .category3 {
  opacity: 1;
  height:200px;
  transform: translateY(5px);
  transition: 0.6s ease-in-out;
}
#updown3:checked ~ .category3 li {display:block;}

#HeadDump{margin:0 auto;padding:0;width:100%;height:90px;}
#Head{position:fixed;width:100%;height:110px;top:0;text-align:center;background:transparent;border-bottom:2px solid transparent;z-index:999;}
#Head span.LogoLink{position:absolute;left:30px;top:20px;}
.Logo{width:100%;margin-top:5px;}
.Head_Menu{display:none;}

#Main1{background-image: url('../images/subMainImg.png'); height:500px;  background-repeat:no-repeat; background-size:cover;}
.textMessage1{width:100%;display:flex;justify-content:center;align-items:center;height:500px;}
.textMessage1 ul{color: white; padding:20px 50px;font-weight: bold;text-align:center;}
#Main2{background-image: url('../images/technology.png'); height:500px;  background-repeat:no-repeat; background-size:cover;}
#Main3{background-image: url('../images/contactImg.png'); height:500px;  background-repeat:no-repeat; background-size:cover;}
#Main4{background-image: url('../images/solution.png'); height:500px;  background-repeat:no-repeat; background-size:cover;}


#Main{text-align:center;margin:0 auto;padding:0;width:100vw;}
#Main ul.MiddleBox{position:absolute;float:left;text-align:center;margin:0 auto;padding:0px 20vw 0px 20vw;width:100vw;top:40vw;}
#Main ul.MiddleBox li{position:absolute;margin:0 auto;padding:10px;width:300px;height:300px;}
#Main ul.MiddleBox li.tl{top:0;right:50%;}
#Main ul.MiddleBox li.tr{top:0;left:50%;}
#Main ul.MiddleBox li.bl{top:300px;right:50%;}
#Main ul.MiddleBox li.br{top:300px;left:50%;}
a.line{display: flex;justify-content:center;align-items:center;border: 3px solid #000;margin:0 auto;padding:0;width:100%;height:280px;color:#555555;}
a.line:hover{border: 8px solid #000;transition: all 250ms ease-out; left: 0%; width: 100%;height:280px;cursor:pointer;}
.MainBackImg {margin:0 auto;padding:0;width:100%;}
.MainBackImgStar {position:absolute;top:0;left:0;margin: 0 auto;padding:0;width:100vw;}

@keyframes StarfadeIn {
    from {        opacity:0;    }
    to {        opacity:1;    }
}
@keyframes StarfadeDown {
    from {        opacity:1;    }
    to {        opacity:0;    }
}

.textMessage{width:60%;position:absolute; top:18%;}
.textMessage ul{color: white;text-align:left; padding:20px 50px;font-weight: bold;}
.textMessage ul:nth-child(1) li{font-size: 150%;}
.textMessage ul:nth-child(2) li{font-size:80%;}
.textMessage1 ul:nth-child(1) li{font-size: 100%;}
.textMessage1 ul:nth-child(2) li{font-size:160%;}
.boxOne{height:50px;}
.boxTwo{height:60px;}
.blank{height:100px;}
.blank1{height:60px;}

.subProduct0{padding:0 150px 30px 150px;}
.subProduct3{padding:0 150px 30px 150px;}
.subContent1{font-size: 150%;font-weight:bold;color:white;}
.subContent2{font-size: 120%;font-weight:bold;color:white;padding-bottom:10px;}
#product2{display:flex;flex-direction:column-reverse;}
.more{background:#fff;width:200px;height:50px;margin:0 auto;border-radius:25px;cursor:pointer;border:1px solid #0071D0;}
.more p{font-weight:bold; color:#0071D0;font-size:90%;height:50px;display:flex;justify-content:center;align-items:center;}

#introduce{width:100%;}
.introduceBox{display:flex; padding: 0 20px;}
.intro1{width:40%; font-size: 120%; font-weight: bold;}
.intro2{width:60%; font-size: 80%; padding-left:5%;}
.menuBox{max-width:641px;margin:0 auto;}
.submenuBox{display:flex; justify-content:center;flex-wrap:wrap;}
.submenuBox div > div{width:100%;display:flex; justify-content:center;padding-top:10px;}
.submenuBox div{width:50%;}
.submenuBox div:nth-child(1), .submenuBox div:nth-child(2){padding-bottom: 20px;}
.submenuBox a img{width: 100%; padding:0 20px;}
.submenuBox > div >div > a{display:flex;justify-content:center;align-items:center;width: 140px; height:40px;border-radius:20px; border:1px solid #0071D0; color:#0071D0;font-size:90%;}
.organImages{padding: 0 75px;}

.backgr{width:100%;position:relative;text-align:center;}
.backgr img{width:100%;}
.contactButton{position:absolute;bottom:10%;width:100%;display:flex;justify-content:center;align-items:center;}
.contactButton a{color:#0071D0;;background:#fff;height:50px;width:190px;display:flex;justify-content:center;align-items:center;font-weight:bold;font-size:100%; z-index:5;bottom:10%;border-radius:30px;}

.giveContainer > .container{display:flex;justify-content:center;}
.giveContainer{padding-top: 50px;}
.mainHistory{position:relative;}
.mainHistory h2{position:relative;font-size:180%; color: #000; line-height:3; left:-210px; top:-30px;}
.mainHistory h2::before{content: "";position:absolute;left:174px; top:0%;width:10px;height:10px;
border-radius:50%;background:#0071D0; transform:translateY(350%);  box-sizing:border-box;}
.mainHistory div{position:relatvie; padding: 0 0 0 40px;}
.history01{position:relative; width:250px;bottom:87px;left:30px;}
.mainHistory li{font-size: 15px; color:#6B6F72;}
.mainHistory > div::before{content: ""; position:absolute; left: 8px; top: 0px; height:100%; border-left:2px solid #0071D0;}
.mainHistory div:first-child::before{top: 10px;height:clac(100%-10px);}

#Footer{position:relative; width:100%; bottom:0;text-align:center;}
.copyright{font-size:80%;color:#555555; height:50px;display:flex;justify-content:center;align-items:center;}
.container{max-width:641px; margin:0 auto;}
.footerBox{display:flex; justify-content: center;}
.footerMenu{padding:30px 30px;text-align:left;}
.subMenuTitle span{color:black;font-weight:bold;}
#Footer p{border-top: 1px solid black;}
.subMenuTitle1 span{color: white;font-weight:bold;}
.subMenuTitle2{padding: 20px 0 0 0;text-align:left;}
.subMenuTitle2 span{cursor:pointer;font-size:80%; font-weight:bold;}
.subMenuTitle2 span:hover{color:#0d6efd;}
.subMenuTitle3{padding:20px 0 0 0;text-align:left;}
.subMenuTitle3 span{cursor:pointer;font-size:80%; font-weight:bold;color:white;}
.subMenuTitle3 span:hover{color:#0d6efd;}
.colorhover:hover{color:#0d6efd;}


#companyRoad{max-width:641px;margin:0 auto;display:flex;flex-wrap:wrap;padding:30px;}
.companyRoad1{width:100%; padding:20px;}
.companyRoad1 p:nth-child(1){font-weight:bold;font-size:110%;padding-bottom:20px;}
.companyRoad2{width:100%; padding:20px; display:flex; flex-wrap:wrap;}
.companyRoad2 img{width:50%;}
.subRoad1{padding-top:20px;width:100%;}
.companyRoad3{width:100%;}
.companyRoad3 iframe{width:100%;}


.techn{display:flex;flex-wrap:wrap;}
.techn div{padding: 20px;}
.Patent{width:50%;}
.subTitle{text-align:center;}
.techn01 > div{text-align:center;padding-bottom: 20px;}
.technIntroduce ul li{text-align: left;}
.technIntroduce ul li:nth-child(1){text-align:center;font-weight:bold;font-size:150%;}
.subTitle p:nth-child(1){color:#0EACE4; font-size: 110%;font-weight: bold; padding:10px 0;}
.subTitle p:nth-child(2){font-weight: bold; font-size:150%;padding:0 0 20px 0;}
.container .blank1{height:30px;}

.solutionTitle{text-align:center;}
.boxThree{height:30px;}
.solutionTitle p:nth-child(1){color:#0EACE4;font-weight:bold;font-size: 100%;padding:10px 0;}
.solutionTitle p:nth-child(2){font-weight:bold;font-size:180%;}

#wrap{text-align:center;margin:0 auto;padding:0;width:100%;}
#wrap ul.box{float:left;text-align:center;margin:0 auto;padding:0;width:100%;}
#wrap ul.box li.tbox{float:left;text-align:center;margin:0 auto;padding:0;width:100%;}

}

@media only screen and (min-width : 641px) and (max-width : 840px) {

#mainImg{background-color:#00043b;}

.Menu{position:absolute;width:100%;height:100%;}

.Hambeger-icon{position:absolute;width:50px;right:30px;top:25px;z-index:5;}
.Hambeger-icon span {height:7px;width:60px;background:white;display:block;margin: 7px 0px 7px 0px;transition: 0.4s ease-in-out;transform: none;border-radius:5px;}

input.hamburger-checkbox {position: absolute;z-index: 10;top: 10px;right: 20px;width: 40px;opacity: 0;height: 25px;}
#openmenu:checked ~ .menu-pane {
  width: 400px;
  right: 0;
  transform: translateX(-0px);
  transition: 0.6s ease-in-out;
}
#openmenu:checked ~ .body-text {
display: none;
}
#openmenu:checked ~ .Hambeger-icon{
  position:fixed;
}
#openmenu:checked ~ .Hambeger-icon span:nth-of-type(1) {
  transform: translate(0%, 200%) rotate(-45deg);
  background-color: black;
}
#openmenu:checked ~ .Hambeger-icon span:nth-of-type(2) {
  transform: scale(0,0);
}
#openmenu:checked ~ .Hambeger-icon span:nth-of-type(3) {
  transform: translate(0%, -190%) rotate(45deg);
  background-color: black;
}

div.menu-pane {
  background-color: #fff;
  position: fixed;
  transform: scale(0,0) translateX(100vw);
  top: 0;
  right: 0;
  width: 0px;
  height: 100vh;
  transition: 0.6s ease-in-out;
  z-index:4;
}

div.menu-pane ul.dump{width:100%;height:120px;padding:0;}
.category{width:100%;padding:10px 0px 10px 50px; text-align:left;}
.category li{width:100%;padding-bottom:20px;}
.category li:hover span{color:#0d6efd;}
div.menu-pane ul li label{display:inline-block;width:100%;}
div.menu-pane ul li label span{font-size:150%;color:black;}
.updown1{position:absolute; right:10px;}

#updown1{position:absolute;display:none;}
#updown2{position:absolute;display:none;}
#updown3{position:absolute;display:none;}
#updown4{position:absolute;display:none;}
.category1{height:0px;opacity: 0;transform: translateY(0px);transition: 0.2s ease-in-out;}
.category1 li{padding:20px 0 10px 0;display:none;color:black;cursor:pointer;}
.category1 li:hover{text-decoration:underline;}
.category2{height:0px;opacity: 0;transform: translateY(0px);transition: 0.2s ease-in-out;}
.category2 li{padding:20px 0 10px 0;display:none;color:black;cursor:pointer;}
.category2 li:hover{text-decoration:underline;}
.category3{height:0px;opacity: 0;transform: translateY(0px);transition: 0.2s ease-in-out;}
.category3 li{padding:20px 0 10px 0;display:none;color:black;cursor:pointer;}
.category3 li:hover{text-decoration:underline;}
label{cursor:pointer;}

#updown1:checked ~ .category1 {
  opacity: 1;
  height:100px;
  transform: translateY(5px);
  transition: 0.6s ease-in-out;
}
#updown1:checked ~ .category1 li {display:block;}
#updown2:checked ~ .category2 {
  opacity: 1;
  height:100px;
  transform: translateY(5px);
  transition: 0.6s ease-in-out;
}
#updown2:checked ~ .category2 li {display:block;}
#updown3:checked ~ .category3 {
  opacity: 1;
  height:200px;
  transform: translateY(5px);
  transition: 0.6s ease-in-out;
}
#updown3:checked ~ .category3 li {display:block;}

#HeadDump{margin:0 auto;padding:0;width:100%;height:90px;}
#Head{position:fixed;width:100%;height:110px;top:0;text-align:center;background:transparent;border-bottom:2px solid transparent;z-index:999;}
#Head span.LogoLink{position:absolute;left:30px;top:20px;}
.Logo{width:100%;margin-top:5px;}
.Head_Menu{display:none;}

#Main{text-align:center;margin:0 auto;padding:0;width:100vw;}
#Main ul.MiddleBox{position:absolute;float:left;text-align:center;margin:0 auto;padding:0px 20vw 0px 20vw;width:100vw;top:40vw;}
#Main ul.MiddleBox li{position:absolute;margin:0 auto;padding:10px;width:300px;height:300px;}
#Main ul.MiddleBox li.tl{top:0;right:50%;}
#Main ul.MiddleBox li.tr{top:0;left:50%;}
#Main ul.MiddleBox li.bl{top:300px;right:50%;}
#Main ul.MiddleBox li.br{top:300px;left:50%;}
a.line{display: flex;justify-content:center;align-items:center;border: 3px solid #000;margin:0 auto;padding:0;width:100%;height:280px;color:#555555;}
a.line:hover{border: 8px solid #000;transition: all 250ms ease-out; left: 0%; width: 100%;height:280px;cursor:pointer;}
.MainBackImg {margin:0 auto;padding:0;width:100%;}
.MainBackImgStar {position:absolute;top:0;left:0;margin: 0 auto;padding:0;width:100vw;}

@keyframes StarfadeIn {
    from {        opacity:0;    }
    to {        opacity:1;    }
}
@keyframes StarfadeDown {
    from {        opacity:1;    }
    to {        opacity:0;    }
}

.textMessage{width:60%;position:absolute; top:18%;}
.textMessage ul{color: white;text-align:left; padding:20px 50px;font-weight: bold;}
.textMessage ul:nth-child(1) li{font-size: 150%;}
.textMessage ul:nth-child(2) li{font-size:80%;}
.textMessage1 ul:nth-child(1) li{font-size: 100%;}
.textMessage1 ul:nth-child(2) li{font-size:160%;}
.boxOne{height:50px;}
.boxTwo{height:60px;}
.blank{height:100px;}

#Main .blank{height:0;}
.Product1{padding-bottom: 50px;}
.subProduct0{padding:0 100px 30px 100px;}
.subProduct3{padding:0 100px 30px 100px;}
.subContent1{font-size: 150%;font-weight:bold;color:white;}
.subContent2{font-size: 120%;font-weight:bold;color:white;padding-bottom:10px;}
#product2{display:flex;flex-direction:column-reverse;}
.more{background:#fff;width:200px;height:50px;margin:0 auto;border-radius:25px;cursor:pointer;border:1px solid #0071D0;}
.more p{font-weight:bold; color:#0071D0;font-size:90%;height:50px;display:flex;justify-content:center;align-items:center;}

#Main1{background-image: url('../images/subMainImg.png'); height:400px;  background-repeat:no-repeat; background-size:cover;}
.textMessage1{width:100%;display:flex;justify-content:center;align-items:center;height:400px;}
.textMessage1 ul{color: white; padding:20px 50px;font-weight: bold;text-align:center;}
#Main2{background-image: url('../images/technology.png'); height:400px;  background-repeat:no-repeat; background-size:cover;}
#Main3{background-image: url('../images/contactImg.png'); height:400px;  background-repeat:no-repeat; background-size:cover;}
#Main4{background-image: url('../images/solution.png'); height:400px;  background-repeat:no-repeat; background-size:cover;}

#introduce{width:100%;}
.introduceBox{display:flex;padding:0 20px;}
.intro1{width:40%; font-size: 120%; font-weight: bold;}
.intro2{width:60%; font-size: 80%; padding-left:5%;}
.menuBox{max-width:641px;margin:0 auto;}
.submenuBox{display:flex; justify-content:center;flex-wrap:wrap;}
.submenuBox div > div{width:100%;display:flex; justify-content:center;padding-top:10px;}
.submenuBox div{width:50%;}
.submenuBox div:nth-child(1), .submenuBox div:nth-child(2){padding-bottom: 20px;}
.submenuBox a img{width: 100%; padding:0 20px;}
.submenuBox > div >div > a{display:flex;justify-content:center;align-items:center;width: 140px; height:40px;border-radius:20px; border:1px solid #0071D0; color:#0071D0;font-size:90%;}
.organImages{padding: 0 70px;}

.backgr{width:100%;position:relative;text-align:center;}
.backgr img{width:100%;}
.contactButton{position:absolute;bottom:10%;width:100%;display:flex;justify-content:center;align-items:center;}
.contactButton a{color:#0071D0;;background:#fff;height:40px;width:160px;display:flex;justify-content:center;align-items:center;font-weight:bold;font-size:95%; z-index:5;bottom:10%;border-radius:30px;}

#Footer{position:relative; width:100%; bottom:0;text-align:center;}
.copyright{font-size:80%;color:#555555; height:50px;display:flex;justify-content:center;align-items:center;}
.container{max-width:641px; margin:0 auto;}
.footerBox{display:flex; justify-content: center;}
.footerMenu{padding:30px 30px;text-align:left;}
.subMenuTitle span{color:black;font-weight:bold;}
#Footer p{border-top: 1px solid black;}
.subMenuTitle1 span{color: white;font-weight:bold;}
.subMenuTitle2{padding: 20px 0 0 0;text-align:left;}
.subMenuTitle2 span{cursor:pointer;font-size:80%; font-weight:bold;}
.subMenuTitle2 span:hover{color:#0d6efd;}
.subMenuTitle3{padding:20px 0 0 0;text-align:left;}
.subMenuTitle3 span{cursor:pointer;font-size:80%; font-weight:bold;color:white;}
.subMenuTitle3 span:hover{color:#0d6efd;}
.colorhover:hover{color:#0d6efd;}

.giveContainer > .container{display:flex;justify-content:center;}
.giveContainer{padding-top: 50px;}
.mainHistory{position:relative;}
.mainHistory h2{position:relative;font-size:180%; color: #000; line-height:3; left:-210px; top:-30px;}
.mainHistory h2::before{content: "";position:absolute;left:174px; top:0%;width:10px;height:10px;
border-radius:50%;background:#0071D0; transform:translateY(350%);  box-sizing:border-box;}
.mainHistory div{position:relatvie; padding: 0 0 0 40px;}
.history01{position:relative; width:250px;bottom:87px;left:30px;}
.mainHistory li{font-size: 15px; color:#6B6F72;}
.mainHistory > div::before{content: ""; position:absolute; left: 8px; top: 0px; height:100%; border-left:2px solid #0071D0;}
.mainHistory div:first-child::before{top: 10px;height:clac(100%-10px);}


#companyRoad{max-width:641px;margin:0 auto;display:flex;flex-wrap:wrap;padding:30px;}
.companyRoad1{width:100%; padding:20px;}
.companyRoad1 p:nth-child(1){font-weight:bold;font-size:110%;padding-bottom:20px;}
.companyRoad2{width:100%; padding:20px; display:flex; flex-wrap:wrap;}
.companyRoad2 img{width:50%;}
.subRoad1{padding-top:20px;width:100%;}
.companyRoad3{width:100%;}
.companyRoad3 iframe{width:100%;}


.techn{display:flex;flex-wrap:wrap;}
.techn div{padding: 20px;}
.Patent{width:50%;}
.subTitle{text-align:center;}
.techn01 > div{text-align:center;padding-bottom: 20px;}
.technIntroduce ul li{text-align: left;}
.technIntroduce ul li:nth-child(1){text-align:center;font-size:150%;font-weight:bold;}
.subTitle p:nth-child(1){color:#0EACE4; font-size: 110%;font-weight: bold; padding:10px 0;}
.subTitle p:nth-child(2){font-weight: bold; font-size:150%;padding:0 0 20px 0;}
.container .blank1{height:30px;}

.solutionTitle{text-align:center;}
.boxThree{height:30px;}
.solutionTitle p:nth-child(1){color:#0EACE4;font-weight:bold;font-size: 100%;padding:10px 0;}
.solutionTitle p:nth-child(2){font-weight:bold;font-size:180%;}

#wrap{text-align:center;margin:0 auto;padding:0;width:100%;}
#wrap ul.box{float:left;text-align:center;margin:0 auto;padding:0;width:100%;}
#wrap ul.box li.tbox{float:left;text-align:center;margin:0 auto;padding:0;width:100%;}
}


@font-face {
  font-family: 'Gothic';
   font-style: normal;
   font-weight: 100;
   src: url(font/NotoSansKR-Bold.woff2) format('woff2'),
        url(font/NotoSansKR-Bold.woff) format('woff'),
        url(font/NotoSansKR-Bold.otf) format('opentype');
}

@font-face {
    font-family: 'Shedding';
    font-weight:100;
    font-style: normal;
    src: url('font/Nanum DaeHanMinGugYeorSaCe.woff2') format('woff2'),
         url('font/Nanum DaeHanMinGugYeorSaCe.woff') format('woff');
         url('font/Nanum DaeHanMinGugYeorSaCe.ttf') format('truetype');
}

@font-face {
    font-family: 'Graffiti';
    font-weight:100;
    font-style: normal;
    src: url('font/Nanum DaHaengCe.woff2') format('woff2'),
         url('font/Nanum DaHaengCe.woff') format('woff');
         url('font/Nanum DaHaengCe.ttf') format('truetype');
}

@font-face {
  font-family: 'DotumChe';
  font-style: normal;
  font-weight: 100;
  src: url(font/NotoSansKR-Regular.woff2) format('woff2'),
       url(font/NotoSansKR-Regular.woff) format('woff'),
       url(font/NotoSansKR-Regular.otf) format('opentype');
}

@font-face {
  font-family: 'OldBody';
  font-style: normal;
  font-weight: 100;
  src: url(font/JejuHallasan-Regular.eot);
  src: url(font/JejuHallasan-Regular.eot?#iefix) format('embedded-opentype'),
       url(font/JejuHallasan-Regular.woff2) format('woff2'),
       url(font/JejuHallasan-Regular.woff) format('woff'),
       url(font/JejuHallasan-Regular.ttf) format('truetype');
}

@font-face {
  font-family: 'BatangChe';
  font-style: normal;
  font-weight: 100;
       url(font/Nanum DaeHanMinGugYeorSaCe.woff2) format('woff2'),
       url(font/Nanum DaeHanMinGugYeorSaCe.woff) format('woff'),
       url(font/Nanum DaeHanMinGugYeorSaCe.ttf) format('truetype');
}


@font-face {
    font-family: 'Digital Dismay';
    src: url('font/Digital Dismay.otf');
    font-weight: normal;
    font-style: normal;
}

@-webkit-keyframes fadeInDown {
    from {
        opacity:0;
        -webkit-transform: translatey(-100px);
        -moz-transform: translatey(-100px);
        -o-transform: translatey(-100px);
        transform: translatey(-100px);
    }
    to {
        opacity:1;
        -webkit-transform: translatey(0);
        -moz-transform: translatey(0);
        -o-transform: translatey(0);
        transform: translatey(0);
    }
}
@-moz-keyframes fadeInDown {
    from {
        opacity:0;
        -webkit-transform: translatey(-100px);
        -moz-transform: translatey(-100px);
        -o-transform: translatey(-100px);
        transform: translatey(-100px);
    }
    to {
        opacity:1;
        -webkit-transform: translatey(0);
        -moz-transform: translatey(0);
        -o-transform: translatey(0);
        transform: translatey(0);
    }
}
@keyframes fadeInDown {
    from {
        opacity:0;
        -webkit-transform: translatey(-100px);
        -moz-transform: translatey(-100px);
        -o-transform: translatey(-100px);
        transform: translatey(-100px);
    }
    to {
        opacity:1;
        -webkit-transform: translatey(0);
        -moz-transform: translatey(0);
        -o-transform: translatey(0);
        transform: translatey(0);
    }
}