@charset "utf-8";
@import url(https://fonts.googleapis.com/css2?family=Oswald:wght@400;500;600;700&display=swap);
body,html {
 padding:0;
 margin:0;
 overflow:hidden;
 width:100%;
 height:100%;
 font-family:Oswald,
 sans-serif
}
* {
 -webkit-box-sizing:border-box;
 box-sizing:border-box
}
*,
:active,
:focus,
:hover {
 outline:0;
 -webkit-outline:none
}
.wrapper {
 height:120px;
 width:100%;
 margin:0;
 padding:0;
 overflow:hidden;
 position:relative;
 z-index:1;
 border-bottom:1px solid rgba(20,40,60,.15)
}
.wrapper #lng {
 position:relative;
 height:120px;
 margin:0 auto;
 max-width:1280px
}
.logo {
 position:absolute;
 left:16px;
 background-image:url(og2020.svg);
 height:90px;
 width:96px;
 background-color:transparent;
 background-size:100% auto;
 background-repeat:no-repeat;
 top:50%;
 -webkit-transform:translate(0,-50%);
 -ms-transform:translate(0,-50%);
 transform:translate(0,-50%);
 z-index:5
}
.bg {
 width:100%;
 height:100%;
 position:absolute;
 z-index:2;
 top:0;
 left:0;
 background:#19458b;
 background:-webkit-gradient(linear,left top,left bottom,from(rgba(25,69,139,1)),to(rgba(41,112,226,1)));
 background:-o-linear-gradient(top,rgba(25,69,139,1) 0,rgba(41,112,226,1) 100%);
 background:linear-gradient(180deg,rgba(25,69,139,1) 0,rgba(41,112,226,1) 100%)
}
.bg:after,
.bg:before {
 content:'';
 height:122px;
 position:absolute;
 display:block;
 top:0
}
.bg:before {
 width:160px;
 background-color:#fff;
 left:-42px;
 top:0;
 -webkit-transform:skewX(30deg);
 -ms-transform:skewX(30deg);
 transform:skewX(30deg)
}
.wrapper:after,
.wrapper:before {
 content:'';
 width:50%;
 display:block;
 height:120px;
 position:absolute;
 top:0;
 z-index:0
}
.wrapper:before {
 background:#fff;
 right:50%
}
.wrapper:after {
 background:#e12727;
 background:-webkit-gradient(linear,left top,left bottom,from(rgba(225,39,39,1)),to(rgba(225,105,105,1)));
 background:-o-linear-gradient(top,rgba(225,39,39,1) 0,rgba(225,105,105,1) 100%);
 background:linear-gradient(180deg,rgba(225,39,39,1) 0,rgba(225,105,105,1) 100%);
 left:50%
}
.bg:after {
 width:160px;
 background:#e12727;
 background:-webkit-gradient(linear,left top,left bottom,from(rgba(225,39,39,1)),to(rgba(225,105,105,1)));
 background:-o-linear-gradient(top,rgba(225,39,39,1) 0,rgba(225,105,105,1) 100%);
 background:linear-gradient(180deg,rgba(225,39,39,1) 0,rgba(225,105,105,1) 100%);
 right:-42px;
 top:0;
 -webkit-transform:skewX(30deg);
 -ms-transform:skewX(30deg);
 transform:skewX(30deg)
}
a.hLink {
 position:absolute;
 top:0;
 left:0;
 width:100%;
 height:100%;
 z-index:9999
}
.slogans {
 display:block;
 max-width:calc(100% - 240px);
 height:100%;
 position:absolute;
 left:50%;
 padding:0;
 margin:0;
 z-index:6;
 color:#fff;
 -webkit-transform:translate(-50%,-50%);
 -ms-transform:translate(-50%,-50%);
 transform:translate(-50%,-50%);
 top:50%;
 width:100%;
 font-size:22px
}
.slogans li {
 display:block;
 position:absolute;
 top:50%;
 left:50%;
 -webkit-transform:translate(-50%,-150%);
 -ms-transform:translate(-50%,-150%);
 transform:translate(-50%,-150%);
 font-weight:500;
 text-align:center;
 line-height:1em;
 width:100%;
 -webkit-transition:all .5s ease-in-out .25s;
 -o-transition:all .5s ease-in-out .25s;
 transition:all .5s ease-in-out .25s;
 text-shadow:0 1px 3px rgba(0,0,0,.25);
 opacity:0
}
.stage0 .slogans li:nth-of-type(1),
.stage1 .slogans li:nth-of-type(1),
.stage2 .slogans li:nth-of-type(2),
.stage3 .slogans li:nth-of-type(3),
.stage4 .slogans li:nth-of-type(4),
.stage5 .slogans li:nth-of-type(5) {
 opacity:1;
 -webkit-transform:translate(-50%,-50%);
 -ms-transform:translate(-50%,-50%);
 transform:translate(-50%,-50%)
}
.nowrap {
 white-space:nowrap
}
@media (max-width:520px) {
 .logo {
  width:80px;
  height:70px
 }
 .bg:before {
  left:-56px
 }
 .bg:after {
  right:-106px
 }
 .slogans {
  left:120px;
  max-width:calc(100% - 120px);
  top:50%;
  -webkit-transform:translate(0,-50%);
  -ms-transform:translate(0,-50%);
  transform:translate(0,-50%);
  font-size:16px
 }
 .slogans li {
  text-align:left
 }
}