/* reset */
html, body {position:relative; -webkit-font-smoothing:antialiased;width:100%;height:100%;touch-action:auto;}
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, a, button, address, em, img, small, strong, sub, sup, dl, dt, dd, ol, ul, li, fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td, hr {margin:0; padding:0;box-sizing:border-box;}
body {padding:0; background:#fff;font-family: 'Roboto', sans-serif;font-size:14px;line-height:1.6;color:#000;box-sizing:border-box;min-width:280px;overflow-x:hidden}
h1, h2, h3, h4, h5, h6 {font-weight:normal}
ol, ul, li {list-style:none}
table {width:100%; border-collapse:separate; border-spacing:0}
form, fieldset, iframe {display:block; border:0}
img, button {border:0 none; vertical-align:middle}
img {width:100%; height: auto; border: 0;}
hr {height:0; display:none}
i, em, address {font-style:normal}
label, button {cursor:pointer}
caption, legend {width:0; height:0; margin:0; padding:0; text-indent:-9999em; overflow:hidden; font-size:0;}
.blind {position:absolute !important; left:-9999em; width:0; height:0; margin:0; padding:0; text-indent:-9999em; overflow:hidden; font-size:0; line-height:0;}
header, footer, section, article, aside, nav, hgroup, details, menu, figure, figcaption {display:block;box-sizing:border-box;}
input, textarea, select {margin:0; padding:0;font-family: 'Roboto', sans-serif;font-size:16px; color:#000; vertical-align:middle;border-radius:0;box-shadow:none;box-sizing:border-box;}
select{appearance:none;-webkit-appearance:none;-moz-appearance:none;}
select::-ms-expand {display:none}
textarea {border: 1px solid #000; resize:none; overflow-y:auto}
button {overflow:visible; margin:0; padding:0; border:0 none; background:none; font-size:0;font-family: 'Roboto', sans-serif;vertical-align:top; cursor:pointer;}
button::-moz-focus-inner {border:0; padding:0;}
.ellipsis {display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
a {color:#000; text-decoration:none; word-break:break-all;}
a:link, a:visited, a:hover, a:active, a:focus {text-decoration:none;}
input:-webkit-autofill{-webkit-box-shadow:0 0 0px 1000px white inset;}

.ft-noto{font-family: 'Noto Serif', serif !important;}

/*header*/
#header{position:relative;height:50px;z-index:9;}
#header .header-sec{width:100%;z-index:10;}
#header .header-sec .ly-inner{padding:13px 20px;}
#header .header-sec .logo{background:url(/asset/images/logo_black.png)no-repeat;background-size:100%;}
#header .header-sec.white .logo{background:url(/asset/images/logo_white.svg)no-repeat;background-size:100%;}
#header .header-sec.white .hamburger span{background:#fff;}
.logo a{display:block;font-size:0;width:110px;height:25px;}
.m-menu-pop{display:none;z-index:10;position:fixed;width:100%;height:100vh;top:0;left:0;background:#fff;}
.m-menu-pop ul{margin-top:65px;}
.m-menu-pop ul li{margin:0 25px;}
.m-menu-pop ul li a{position:relative;display:inline-block;color:#000;line-height:50px;font-weight:bold;font-size:28px;font-family: 'Noto Serif', serif !important;}
.m-menu-pop ul li a:after{content:'';position:absolute;bottom:0;left:0;width:0;height:2px;background:#000;transition:all 0.2s;}
.m-menu-pop ul li.on a, .m-menu-pop ul li:hover a{font-weight:bold;}
.m-menu-pop ul li.on a:after, nav ul li:hover a:after{width:100%;}

nav{display:block;}
nav ul{margin-top:0;}
nav ul li{margin:0 14px;}
nav ul li a{position:relative;display:inline-block;color:#fff;font-size:14px;padding:7px 2px 3px;display:inline-block;text-shadow: 0px 2px 8px rgba(0, 0, 0, 0.4);line-height:1.6;}
nav ul li a:after{content:'';position:absolute;bottom:0;left:0;width:0;height:2px;background:#fff;transition:all 0.2s;}
nav ul li.on a, nav ul li:hover a{font-weight:bold;}
nav ul li.on a:after, nav ul li:hover:after{width:100%;}
#header.fixed{z-index:11;}
#header.fixed .header-sec{position:fixed;top:0;z-index:10;animation-duration:0.2s;animation-name: fadein;background:#fff;}
#header.fixed .header-sec .logo{background:url(/asset/images/logo_black.png)no-repeat;background-size:100%;}
#header.fixed nav ul li a{color:#333;text-shadow:none;}
#header.fixed nav ul li a:after{background:#333;}
.main #header{height:auto;position:fixed;width:100%;}
.main #header .header-sec{background:transparent;}
.main #header .header-sec .logo{background:url(/asset/images/logo_white.svg)no-repeat;background-size:100%;}
.main #header .hamburger{position:fixed;}
.main #header .hamburger span{background:#fff;}
.main .section.top-visual .ct-inner h1, .main .section.top-visual .ct-inner .address{position:fixed;}


.hamburger{position:absolute;top:0;right:0;}
.hamburger.active span{background:#333 !important;}
.hamburger.active .top{transform: translateY(6px) translateX(0) rotate(45deg);}
.hamburger.active .middle{opacity:0;}
.hamburger.active .bottom{transform: translateY(-6px) translateX(0) rotate(-45deg);}
.hamburger{width:60px;padding:20px;font-size:0;z-index:11;}
.hamburger span{display:inline-block;width:100%;height:2px;border-radius:10px;background:#333;transition:all .2s ease;}
.hamburger span + span{margin-top:4px;}
.hamburger.fixed{position:fixed;top:0;right:0;animation-duration:0.2s;animation-name: fadein;}
@keyframes fadein {
	from {
        opacity:0;
	}
	to {
		opacity:1;
	}
}

footer{border-top:1px solid #dadada;}
.footer-in{padding:15px 20px 20px;max-width:1080px;margin:auto;}
.footer-in p{font-size:14px;}
.footer-in .footer-logo{width:54px;margin-top:10px;}

.shadow1{-moz-box-shadow:0px 2px 8px 0 rgba(0, 0, 0, 0.4); -webkit-box-shadow:0px 2px 8px 0 rgba(0, 0, 0, 0.4); box-shadow:0px 2px 8px 0 rgba(0, 0, 0, 0.4);}

/* flex */
.flex{display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align:center; -ms-flex-align: center; align-items: center;}
.flex2{display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align:center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;}
.flex3{display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align:center; -ms-flex-align: center; align-items: center; -webkit-justify-content: center; justify-content: center;}

/* align */
.box_middle{position:absolute; top:50%; left:50%; -webkit-transform:translate(-50%, -50%); transform:translate(-50%, -50%);}

[class^="bg"]{background-repeat: no-repeat; background-position: center; background-size:100%;}
.section.top-visual{width:100%;overflow:hidden;}
.section.top-visual .ct-inner{width:100%;height:100%;position:relative;}
.section.top-visual .ct-inner .obj-img{width:100%;height:100%;}
.section.top-visual .ct-inner h1{position:absolute;text-align:center;font-size:5.5vw;color:#fff;font-weight:bold;text-shadow: 0px 2px 8px rgba(0, 0, 0, 0.4);}
.section.top-visual .ct-inner .address{position:absolute;width:100%;padding:0 20px;font-size:12px;color:#fff;text-shadow: 0px 2px 8px rgba(0, 0, 0, 0.4);bottom:34px;text-align:center;}
.section.top-visual .ct-inner .scroll-down{position:absolute;left: 50%;bottom: 64px;z-index: 15;width: 70px;margin-left: -35px;color: #FFF; font-size: 13px;text-align: center;}
.scroll-action{position:absolute;left:50%;transform:translate(0,-50%);bottom:65px;}
.scroll-action span {
    position: absolute;
    top: 0;
    left: 50%;
    width: 10px;
    height: 10px;
    margin-left: -5px;
    border-left: 1px solid #fff;
    border-bottom: 1px solid #fff;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-animation: sdb07 2s infinite;
    animation: sdb07 2s infinite;
    opacity: 0;
    box-sizing: border-box;
  }
  .scroll-action span:nth-of-type(1) {
    -webkit-animation-delay: 0s;
    animation-delay: 0s;
  }
 .scroll-action span:nth-of-type(2) {
    top: 10px;
    -webkit-animation-delay: .15s;
    animation-delay: .15s;
  }
 .scroll-action span:nth-of-type(3) {
    top: 20px;
    -webkit-animation-delay: .3s;
    animation-delay: .3s;
  }
  @-webkit-keyframes sdb07 {
    0% {
      opacity: 0;
    }
    50% {
      opacity: 1;
    }
    100% {
      opacity: 0;
    }
  }
  @keyframes sdb07 {
    0% {
      opacity: 0;
    }
    50% {
      opacity: 1;
    }
    100% {
      opacity: 0;
    }
  }
  

.section.content .ct-inner{padding:80px 20px;text-align:center;max-width:1120px;margin:auto;}
.section.content .ct-inner.tp2{max-width:100%;}
.section.content .ct-inner h2{font-size:1.5rem;line-height:normal;font-weight:bold;}
.section.content .ct-inner p{margin-top:16px;}
.section.content .ct-inner .logo-box{display:inline-block;width:120px;margin-bottom:69px;}
.section.content + .section.content .ct-inner{padding-top:0;}
.section.content .obj-img{margin-bottom:40px;}
.section.content.pf01 .ct-inner{max-width:1122px;margin:auto;}
.section.content.pn01 .ct-inner{max-width:1200px;margin:auto;}
.section.content.dr01 .ct-inner{max-width:1320px;margin:auto;padding:80px 0;}

/*about*/
.ico-activity img{width:auto;}
.ico-tit{font-size:1.5rem;font-weight:700;line-height:normal;margin-top:27px;}
.ico-txt{display:inline-block;width:200px;margin-top:9px;}
.activity-wrap li{margin-top:32px;width:100%;display:inline-block;}
.activity-wrap li > div{display:inline-block;}
.activity-wrap li + li{margin-top:40px;}

/*portfolio*/
.portfolio-list li{border:1px solid #cfd3d6;}
.portfolio-list li + li{margin-top:20px;}
.portfolio-list li a{display:block;padding:30px 10px 20px;}
.portfolio-list li a.tp2{padding-top:0;}
.portfolio-list li a.tp3{padding-top:10px;}
.portfolio-list li a span{display:block;}
.portfolio-list li a .krafton img{width:90px;}
.portfolio-list li a .morenorisoft img{width:85px;}
.portfolio-list li a .ridebeam img{width:166px;}
.portfolio-list li a .asblanc img{width:196px;}
.portfolio-list li a .techfloor img{width:184px;}
.portfolio-list li a .bakkt img{width:160px;}
.portfolio-list li a .Klaytn img{width:164px;}
.portfolio-list li a .Trusttoken img{width:202px;}
.portfolio-list li a .Lition img{width:142px;}
.portfolio-list li a .settle img{width:149px;}
.portfolio-list li a span.txt01{font-size:12px;margin-top:24px;}
.portfolio-list li a span.txt01.asblanc{margin-top:-12px;}
.portfolio-list li a span.txt01.Klaytn{margin-top:-7px;}
.portfolio-list li a span.txt01.Trusttoken{margin-top:-14px;}
.portfolio-list li a span.txt02{font-size:20px;line-height:normal;font-weight:700;margin-top:20px;}
.portfolio-list li a span.txt03{font-size:14px;margin-top:5px;word-break: break-word;}
.portfolio-list li a span.txt03 em{color:#3095d3;text-decoration:underline;}
.portfolio-list li a span.txt04{font-size:12px;margin-top:16px;}

/*team*/
.team-list li + li{margin-top:80px;}
.team-list li span{display:block;}
.team-list li span.txt01{font-size:2rem;font-weight:700;line-height:normal;margin-bottom:17px;}
.team-list li span.txt02{font-size:1rem;}
.team-list li span.txt03{font-size:0.875rem;color:#3095d3;margin-top:16px;}

/*contact*/
.contact-wrap p{margin-bottom:40px;}
.contact-wrap p a{color:#3095d3;font-weight:500;text-decoration:underline;display:inline-block;width:100%;}
.contact-wrap .direction{margin-top:16px;}
#g-Map{height:235px;width:100%;max-width:480px;margin:auto;}

.main .section.top-visual{font-size:60px;height:100%;}
#mainVideo{position:fixed;top:0;left:0;right:0;bottom:0;min-width:100%;min-height:100%;}
video{height:120%;width:100%;object-fit:cover;margin-top:-50px;}

.only-m{display:block;}
.only-p{display:none;}
@media all and (-ms-high-contrast:none) { 
  *::-ms-backdrop, [data-aos^=fade][data-aos^=fade],[data-aos^=zoom][data-aos^=zoom],[data-aos^=flip][data-aos^=flip]{ opacity: 1 !important; transform:translate3d(0px, 0px, 0px)} 
  video{height:auto;}
}

@media all and (min-width:360px){
    body{font-size:16px;}
}

@media all and (min-width:768px){
    .activity-wrap li{width:auto;margin:0 50px;display: -webkit-inline-flex; display: -ms-inline-flexbox; display: inline-flex;  -webkit-box-align:top; -ms-flex-align: top; align-items: top;}
}

@media all and (min-width:1132px){
    .only-m{display:none;}
    .only-p{display:block;}
    #header{height:auto;}
    #header .header-sec{position:absolute;}
    #header .header-sec .ly-inner{padding:24px 40px;}
    #header .header-sec .logo{background:url(/asset/images/logo_white.svg)no-repeat;background-size:100%;}
    .logo a{width:190px;height:37px;}

    .footer-in{padding:30px 0;display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align:center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;}
    .footer-in p{font-size:14px;}
    .footer-in .footer-logo{width:54px;margin-top:0;}
    
    [class^="bg"]{background-size: cover;}
    .section.top-visual{height:100vh;}
    .section.top-visual .ct-inner h1{font-size:60px;}
    .section.top-visual .ct-inner .address{padding:0;font-size:14px;font-weight:500;}
    .section.top-visual .obj-img img{object-fit:cover;width:100%;height:100%;}
    .section.content .ct-inner h2{font-size:2rem;}
    .section.content .ct-inner p{margin-top:24px;}

    .section.content .obj-img{margin-bottom:80px;}
    .section.content.ct01 .ct-inner{padding:204px 0 82px;}
    .section.content.ct02 .ct-inner{padding:0 0 201px;}
    .section.content.ct03 .ct-inner{padding:0 0 240px;}
    .section.content.pf01 .ct-inner{padding:160px 0 210px;}
    .section.content.pn01 .ct-inner{padding:205px 0 210px;}
    .section.content.dr01 .ct-inner{padding:205px 0 210px;}
    
    .activity-wrap{max-width:1200px;margin:51px auto 0;padding-left:40px;}
    .activity-wrap li{margin:0 70px;} 
    .activity-wrap li + li{margin-top:60px;}

    .portfolio-list{font-size:0;flex-flow: row wrap;display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align:center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;}
    .portfolio-list li{display:inline-block;margin-top:42px;}
    .portfolio-list li + li{margin-top:42px;}
    .portfolio-list li a{position:relative;}
    .portfolio-list li a .text-wrap{opacity:0;position:absolute;width:100%;height:100%;top:0;left:0;background:#fff;z-index:5;padding:38px 23px;transition:all 0.2s;}
    .portfolio-list li:hover{border-color:#add9f4;-moz-box-shadow:0px 4px 21px 0 rgba(48, 149, 211, 0.4); -webkit-box-shadow:0px 4px 21px 0 rgba(48, 149, 211, 0.4); box-shadow:0px 4px 21px 0 rgba(48, 149, 211, 0.4);}
    .portfolio-list li:hover .text-wrap{opacity:1;}
    .portfolio-list li a{padding:0;}
    .portfolio-list li a span.company-logo{width:332px;height:280px;display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align:center; -ms-flex-align: center; align-items: center; -webkit-justify-content: center; justify-content: center;}
    .portfolio-list li a span.txt01{margin-top:0 !important;}
    .portfolio-list li a span.txt02{margin-top:29px;}
    .portfolio-list li a span.txt04{position:absolute;bottom:18px;left:50%;transform:translate(-50%, 0);text-align:center;}    
    
    .team-list{font-size:0;flex-flow: row wrap;display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align:center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;}
    .team-list li{margin:120px 58px 0;width:440px;height:270px;text-align:left;}
    .team-list li:nth-child(-n+2){margin-top:0;}
    .team-list li:nth-child(n+3):nth-child(-n+4){height:248px;}
    .team-list li:last-child{height:auto;}
    .team-list li + li{margin-top:120px;}
    .team-list li span{display:block;}
    .team-list li span.txt01{font-size:2rem;font-weight:700;line-height:normal;margin-bottom:17px;}
    .team-list li span.txt02{font-size:1rem;}
    .team-list li span.txt03{font-size:0.875rem;color:#3095d3;margin-top:16px;}

    .contact-wrap h4{font-size:32px;font-weight:700;margin-bottom:17px;line-height:normal;}
    .contact-wrap p{margin-bottom:80px;}
    .contact-wrap p a{width:auto;}
    .contact-wrap .direction{margin-top:20px;}
    #g-Map{height:258px;}

    .main .section.top-visual .ct-inner h1{font-size:60px;}
    #mainVideo{position:fixed;top:-50px;left:0;right:0;bottom:0;min-width:100%;min-height:100%;}
}

@media all and (min-width:1600px){
    .section.top-visual .ct-inner h1{font-size:80px;}
}


