@font-face{font-family:HelveticaNeue;src:url(../font/SourceHanSansCN-Regular.otf);src:url(../font/SourceHanSansCN-Regular.otf?#iefix) format('embedded-opentype')}

@font-face {
    font-family: "AlpinaCondensed";
    src:  url("../font/GT-Alpina-Condensed-Thin.woff2") format("woff2"),
    url("../font/GT-Alpina-Condensed-Thin.woff") format("woff");
    font-style: normal;
    font-weight: 400;
}

@font-face {
    font-family: "HaptikRegular";
    src:  url("../font/GT-Haptik-Regular-2.woff2") format("woff2"),
    url("../font/GT-Haptik-Regular-2.woff") format("woff");
    font-style: normal;
    font-weight: 400;
}

a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;-webkit-text-size-adjust:none;-webkit-font-smoothing:antialiased;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
body{line-height:1}
ol,ul{list-style:none}
blockquote,q{quotes:none}
blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}
table{border-collapse:collapse;border-spacing:0}
pre{font-size:12px}
/*body,html{height:100%}*/
div{position:relative;    max-width: 100%;}
.dn{display:none}
.db{display:block}
.dib{display:inline-block}
.fl{float:left}
.fr{float:right}
.h{width:100%}
.ov{overflow:visible}
b{font-weight:700}
.mt{margin-bottom:20px}
.mb{margin-bottom:20px}
html body,html input,html select,html textarea{font-family:HaptikRegular,sans-serif;font-weight:400;font-size:15px;line-height:19px}
html.zn body,html.zn input,html.zn select,html.zn textarea{font-size:14px;line-height:21px}
@media screen and (min-width:768px){html body,html input,html select,html textarea{font-size:16px;line-height:20px}
    html.zn body,html.zn input,html.zn select,html.zn textarea{font-size:14px;line-height:22px}
}
a{color:inherit;text-decoration:none}
img{display:block}
button{background:0 0;border:none;cursor:pointer;padding:0;margin:0;font-family:inherit;font-size:inherit}
button:focus{outline:0}
button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0;border-radius:0}
input,select,textarea{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;outline:0;border-radius:0;-webkit-appearance:none;-moz-appearance:none;appearance:none}
input{color:#000;background:0 0;border:none}
input[type=checkbox]{display:none}
input[type=checkbox]+label:before{font-family:Icons;display:inline-block;content:"\f096";width:22px;padding-left:1px}
input[type=checkbox]:checked+label:before{content:"\f046"}
select{color:#000;background:0 0;border:2px solid;width:100%;padding:13px 10px 12px}
.select:after{content:"\f0d7";font-family:Icons;color:#000;padding:6px 4px 2px;position:absolute;right:10px;top:21px;z-index:1;text-align:right;width:25px;pointer-events:none}
label{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}

.clear { zoom:1; }
.clear:after {
    content:".";
    display:block;
    height:0;
    visibility:hidden;
    clear:both;
}

header{position:fixed;top:0;left:0;width:100%;overflow:visible;background:#fff;z-index:104;padding:15px 30px;display:flex;min-height:50px;line-height: 30px;}
.logowrap{flex:50%;align-self:start}
.logowrap a{display:block;font-family: HaptikRegular;font-size:22px;font-weight: 400;}
.logowrap .logo{background-repeat:no-repeat;font-weight:400}
.logowrap .logo.logo-zn{margin-top:0;background-position:left 1px;}
.logowrap .logo.logo-en{margin-top:1px;background-position:left 0;font-size:28px}

.mainnavi{flex: 50%;align-self:start;margin-right:1%;}
.mainnavi ul{display: flex;}
.mainnavi ul li{flex: 1;text-align: left;}
.mainnavi ul li a{font-size:16px;font-family: HaptikRegular;font-size:28px;}
.mainnavi ul li a:hover{text-decoration: none;color:#00ff00;}
.mainnavi ul li a.active{color:#00ff00;}
#mainnavi .paa{opacity: 0;display: none;}

footer,.footer{width:100%;overflow:visible;background:#fff;z-index:4;padding:15px 30px;display:flex;color:#000;font-family: HaptikRegular;font-size:14px;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    line-height: 1.3;
}
footer .l,.footer .l{flex:65%;text-align:left;}
footer .r,.footer .r{flex:35%;text-align:right;}

.expanded{display:block!important}
.menu-icon{opacity:0;background:url(../image/menu-open.png) no-repeat;display:inline-block;width:18px;height:13px;background-size:contain;position:absolute;top:25px;right:20px}
.menu-icon.close{background:url(../image/menu-close.png) no-repeat;display:inline-block;width:16px;height:16px;background-size:contain;position:absolute}

.include{position:relative;margin-top:95px;}
.paa{display:flex;padding:15px 30px}
.index-paa{padding-top:50px;}
.paa .free{flex:50%;align-self:start;}
.paa .text{flex:50%;align-self:start;margin-right:1%;text-align: left;line-height: 1;}
.paa .text a:hover{text-decoration: none;color:#00ff00;}

.about .paa{margin-top:310px;}
.about .free{font-size:36px;font-family: AlpinaCondensed;line-height:initial;word-break: break-word}
.about .free a:hover{text-decoration: none;color:#00ff00s}
.about .free a.qrcode{position: relative;}
.about .free a.qrcode img{
    position: absolute;top:-133px;left:-18px;width: 136px;height:136px;z-index: 100;display:none;
}
/*.about .free a.qrcode:hover img{display:block;}*/
.about .project{
    display: flex;
    margin-top:70px;
    padding-top:10px;
}
.about .awards,.about .publish{
    flex: 1;
    color:#666;
    font-size:14px;
    line-height: 1.5;
    text-align: left;
    margin-left:30px;
    word-break: break-word
}

.project{padding:110px 0 10px 0;}
.project .project-item{margin-top:15px;z-index: 100}
.project .project-item.size_1{width: 100%;}
.project .project-item.size_2{/**float:left;**/width: 24%;}
.project .project-item.size_2_2{float:right;width: 49%;}
.project .project-item .title{font-size:16px;color:#000;font-family:AlpinaCondensed;margin-left:30px;line-height:initial;font-weight: 300; }
.index-project .project-item .title{font-size:68px;}
.detail-project .project-item.size_2,.detail-project .project-item.size_2_2{width: 49.5%;}
.project .project-item .con img{width: 100%;}

.details .top-con{width: 100%}
.details .top-con .details-img img{width: 100%}
.details .details-con{display: flex;padding:15px 30px;}
.details .details-con p{color:#000;font-size:14px;line-height: 1.5;font-family:HaptikRegular;}
.details .details-con .details-con-l{flex: 50%;text-align: left}
.details .details-con .details-con-r{display:flex;flex: 50%;}
.details .details-con .details-con-r .details-con-r-l,
.details .details-con .details-con-r .details-con-r-r{flex: 1;}
.details .paa .text{font-size:50px;line-height: inherit;line-height: 1;margin:40px 0 10px 0;font-family:AlpinaCondensed;}
.details .project{padding-top:0;}

.products-list .project{padding:30px 30px;padding-top:110px;}
.products-list .project .project-item{margin-top:30px;}
.products-list .project .project-item .title{margin-left:0;}

@media screen and (max-width:1024px){
    header {padding:15px 15px;}
    footer,.footer {padding:15px 15px;position: static !important;}
    footer .r,.footer .r{text-align:right;}
    .footer span{
        white-space: nowrap;
        font-size: 12px;
        -webkit-transform-origin-x: 0;
        -webkit-transform: scale(0.5);
    }
    .logowrap{z-index: 15;}
    .menu-icon{opacity:1;z-index: 15;}
    #mainnavi{display:none;z-index:11;
        background:#ffffff;width:100%;text-align:center;padding-bottom:20px;
        height:100%;min-height:100%;max-width:100%;position:fixed;left:0;top:0}
    #mainnavi .paa{
        display: block;
        opacity: 1;
        margin-top:90px !important;
        font-size:12px;
        line-height: 1.3;
    }
    #mainnavi>ul{opacity:0;width:100%;text-align:center;display: block;}
    #mainnavi>ul li{
        display: block;
        text-align: center !important;
        margin-top:10%;
    }
    .mainnavi ul li a{font-size:25px;font-family: AlpinaCondensed;color:#000 !important;}
    .logowrap .logo.logo-en{font-size:22px;}
    .paa{padding:15px 15px;}
    .paa .free{flex:0;}
    .paa .text{text-align: left;flex: 100%;line-height: 1;font-size:12px;}
    .index-project{padding-top:60px;}
    .project .project-item{margin-top:10px;}
    .project .project-item .title{font-size:22px;margin-left:15px;}
    .index-project .project-item .title{font-size:34px;}
    .project .project-item.size_2, .project .project-item.size_2_2{width: 100%;float:none;}
    .products-list .project .project-item{margin-top:15px;}

    .about .paa{margin-top:375px;}
    .about .paa .free{flex: 100%;font-size:28px;line-height: 1.2;font-family:AlpinaCondensed;}
    .about .project{
        display: block !important;
        padding-right:20px;
        margin-top:20px;
        padding-top:10px;
    }
    .about .awards, .about .publish{margin-left:15px;font-size:12px;}
    .about .project .publish{margin-top:20px;padding-top:20px;}


    .details .details-con{display: block;padding:15px 15px;}
    .details .details-con .details-con-r{margin-top:20px;}
    .details .details-con .details-con-r .details-con-r-l{flex: 65%;}
    .details .details-con .details-con-r .details-con-r-r{flex: 35%;margin-left:10px;}
    .details .details-con p{line-height: 1.2;font-size:12px;}
    .details .paa .text{font-size:28px;margin-top:0px;margin-bottom:0px;}


    .products-list .project{padding:30px 15px;}
}

@media screen and (min-width:1440px){
}

@media screen and (min-width:1920px){
    .logowrap .logo.logo-en{
        font-size:30px !important;
    }
    .mainnavi ul li a{
        font-size:30px !important;
    }
    .paa .text{
        font-size: 26px !important;
    }
    .index-project{padding-top:100px;}
    .index-project .project-item .title,.index-project-title{
        font-size:120px !important;
    }

    .details .details-con p{
        font-size:26px !important;
    }
    .details .paa .text{
        font-size:90px !important;
    }

    .index-paa,.products-list .project{padding-top:170px !important;}
    .project{padding-top:140px;}
  /*  #nrimg img{width:100%}*/
    .about .free{font-size:90px;}
    .about .project{padding-top:70px !important;}
    .about .paa{margin-top:505px;}

}
 #nrimg img{max-width: 100%; height: 100%;}
 #nrimg .wp-video-shortcode{ max-width: 100%;}
  #nrimg .wp-video{ margin: 0 auto;}
 .aligncenter { display: block; margin-left: auto; margin-right: auto; } .aligncenter p.wp-caption-text { display: block; margin-left: auto; margin-right: auto; text-align: center; }