/* vietnamese */
@font-face {
  font-family: 'Anton';
  font-style: normal;
  font-weight: 400;
  src: local('Anton Regular'), local('Anton-Regular'), url(/cs19/fonts/Anton.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Anton';
  font-style: normal;
  font-weight: 400;
  src: local('Anton Regular'), local('Anton-Regular'), url(/cs19/fonts/Anton.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Anton';
  font-style: normal;
  font-weight: 400;
  src: local('Anton Regular'), local('Anton-Regular'), url(/cs19/fonts/Anton.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
body { } .s.menu { position: fixed; top: 9.6875rem; left: 15%; width: 100%; height: calc(100% - 9.6875rem); display: flex; flex-direction: column; align-items: left; justify-content: left; z-index: 10000; pointer-events: none; display: none; } .hidden .s.menu { display: flex; } .hidden .logo { z-index: 99999999; position: relative; } .hidden .menu__item { opacity: 1; transition: all 3s; } .menu__item { position: relative; display: flex; flex-wrap: wrap; opacity: 0; justify-content: center; pointer-events: auto; margin-top: -30px; margin-left: 30px;	transition: all 3s; } .menu--closed .menu__item { pointer-events: none; } .menu__item-number { display: none; font-size: 0.85rem; } .menu__item-textwrap { position: relative; overflow: hidden; line-height: 1; margin: 1rem 0 0 0; } .menu__item-text { font-family: "Anton", Arial, sans-serif; text-transform: uppercase; -webkit-text-stroke: 2px #fff; text-stroke: 2px #fff; -webkit-text-fill-color: transparent; text-fill-color: transparent; color: transparent; font-size: 2rem; padding: 0 1rem; cursor: pointer; display: inline-block; } .menu__item--current .menu__item-text { -webkit-text-fill-color: #fff; text-fill-color: #fff; color: #fff; -webkit-text-stroke: 2px transparent; text-stroke: 2px transparent; } .menu__item-link { pointer-events: none; font-weight: bold; align-self: flex-end; opacity: 0; width: 100%; cursor: pointer; text-align: center; opacity: 0; } .menu__item--current .menu__item-link { pointer-events: auto; } .gridwrap { display: grid; max-width: 1500px; margin: 0 auto; grid-template-columns: 100%; grid-template-rows: 1.25rem calc(100% - 1.25rem); position: relative; padding: 2rem 2vw 2rem 5vw; pointer-events: none; margin-left: 20%; } .gridback { align-self: center; grid-area: 1 / 1 / 2 / 2; justify-self: center; background: none; border: 0; margin: 0; padding: 0; color: #fff; opacity: 0; } .gridback:hover { color: var(--color-link-hover); } .gridback:focus { outline: none; } .grid--open ~ .gridback { pointer-events: auto; } .grid.nuuu { grid-area: 2 / 1 / 3 / 2; --gridgap: 3vw; --gridwidth: 100%; --gridheight: calc(100vh - 9.6875rem); display: grid; width: 100%; height: var(--gridheight); grid-template-rows: repeat(20,calc(var(--gridheight) / 10 - var(--gridgap))); grid-template-columns: repeat(20,calc(var(--gridwidth) / 10 - var(--gridgap))); grid-gap: var(--gridgap); align-content: center; justify-content: center; } .grid__item.nuuu2 { opacity: 0; position: relative; background-repeat: no-repeat; background-position: 50% 50%; background-size: cover; } .grid--open .grid__item.nuuu2 { pointer-events: auto; } .grid__item::after { content: ''; background: rgba(0,0,0,0.6); position: absolute; width: 100%; height: 100%; top: 0; left: 0; transition: background 1s cubic-bezier(1,0,0,1); } .grid--open .grid__item::after { background: rgba(0,0,0,0); } /* Layout 1 */ .grid--layout-1 .grid__item:first-child {grid-area: 3 / 1 / 8 / 4;} .grid--layout-1 .grid__item:nth-child(2) {grid-area: 1 / 2 / 3 / 4;} .grid--layout-1 .grid__item:nth-child(3) {grid-area: 5 / 4 / 8 / 8; } .grid--layout-1 .grid__item:nth-child(4) {grid-area: 2 / 7 / 5 / 11;} .grid--layout-1 .grid__item:nth-child(5) {grid-area: 1 / 4 / 5 / 7;} .grid--layout-1 .grid__item:nth-child(6) {grid-area: 8 / 5 / 11 / 2;} .grid--layout-1 .grid__item:nth-child(7) {grid-area: 10 / 9 / 8 / 11;} .grid--layout-1 .grid__item:nth-child(8) {grid-area: 5 / 8 / 8 / 10;} .grid--layout-1 .grid__item:nth-child(9) {grid-area: 8 / 5 / 11 / 9;} /* Layout 2 */ .grid--layout-2 .grid__item:first-child { grid-area: 2 / 1 / 5 / 4; } .grid--layout-2 .grid__item:nth-child(2) { grid-area: 1 / 4 / 4 / 7; } .grid--layout-2 .grid__item:nth-child(3) {grid-area: 1 / 7 / 5 / 10;} .grid--layout-2 .grid__item:nth-child(4) {grid-area: 5 / 1 / 7 / 4;} .grid--layout-2 .grid__item:nth-child(5) {grid-area: 4 / 4 / 7 / 7;} .grid--layout-2 .grid__item:nth-child(6) {grid-area: 7 / 7 / 11 / 4;} .grid--layout-2 .grid__item:nth-child(7) {grid-area: 5 / 7 / 8 / 11;} .grid--layout-2 .grid__item:nth-child(8) {grid-area: 7 / 2 / 9 / 4;} /* Layout 3 */ .grid--layout-3 .grid__item:first-child {grid-area: 1 / 2 / 3 / 5;} .grid--layout-3 .grid__item:nth-child(2) {grid-area: 3 / 1 / 6 / 5;} .grid--layout-3 .grid__item:nth-child(3) {grid-area: 1 / 5 / 5 / 8;} .grid--layout-3 .grid__item:nth-child(4) {grid-area: 2 / 8 / 6 / 11;} .grid--layout-3 .grid__item:nth-child(5) {grid-area: 5 / 5 / 8 / 8;} .grid--layout-3 .grid__item:nth-child(6) {grid-area: 6 / 8 / 8 / 11;} .grid--layout-3 .grid__item:nth-child(7) {grid-area: 6 / 2 / 8 / 5;} .grid--layout-3 .grid__item:nth-child(8) {grid-area: 11 / 4 / 8 / 7;} .grid--layout-3 .grid__item:nth-child(9) {grid-area: 8 / 9 / 11 / 7;} /* Layout 4 */ .grid--layout-4 .grid__item:first-child {grid-area: 2 / 1 / 4 / 4;} .grid--layout-4 .grid__item:nth-child(2) {grid-area: 1 / 4 / 3 / 7;} .grid--layout-4 .grid__item:nth-child(3) {grid-area: 3 / 4 / 5 / 7;} .grid--layout-4 .grid__item:nth-child(4) {grid-area: 1 / 7 / 4 / 11;} .grid--layout-4 .grid__item:nth-child(5) {grid-area: 4 / 2 / 7 / 4;} .grid--layout-4 .grid__item:nth-child(6) {grid-area: 5 / 7 / 8 / 4;} .grid--layout-4 .grid__item:nth-child(7) {grid-area: 4 / 7 / 8 / 11;} .grid--layout-4 .grid__item:nth-child(8) {grid-area: 8 / 9 / 11 / 4;} /* Layout 5 */ .grid--layout-5 .grid__item:first-child {grid-area: 2 / 1 / 5 / 4;} .grid--layout-5 .grid__item:nth-child(2) {grid-area: 1 / 4 / 5 / 7;} .grid--layout-5 .grid__item:nth-child(3) {grid-area: 5 / 2 / 7 / 5;} .grid--layout-5 .grid__item:nth-child(4) {grid-area: 1 / 7 / 4 / 11;} .grid--layout-5 .grid__item:nth-child(5) {grid-area: 5 / 7 / 7 / 5;} .grid--layout-5 .grid__item:nth-child(6) {grid-area: 7 / 5 / 10 / 1;} .grid--layout-5 .grid__item:nth-child(7) {grid-area: 4 / 7 / 7 / 9;} .grid--layout-5 .grid__item:nth-child(8) {grid-area: 4 / 9 / 9 / 11;} .grid--layout-5 .grid__item:nth-child(9) {grid-area: 7 / 5 / 11 / 9;} /* Layout 6 */ .grid--layout-6 .grid__item:first-child {grid-area: 2 / 1 / 4 / 4;} .grid--layout-6 .grid__item:nth-child(2) {grid-area: 1 / 4 / 3 / 7;} .grid--layout-6 .grid__item:nth-child(3) {grid-area: 3 / 4 / 5 / 7;} .grid--layout-6 .grid__item:nth-child(4) {grid-area: 1 / 7 / 4 / 11;} .grid--layout-6 .grid__item:nth-child(5) {grid-area: 4 / 2 / 7 / 4;} .grid--layout-6 .grid__item:nth-child(6) {grid-area: 5 / 7 / 8 / 4;} .grid--layout-6 .grid__item:nth-child(7) {grid-area: 4 / 7 / 8 / 11;} .grid--layout-6 .grid__item:nth-child(8) {grid-area: 8 / 9 / 11 / 4;} .content__item { max-width: 600px; margin: 0 auto; font-size: 1.15rem; padding: 1.5rem; } .js .content__item { position: absolute; top: 0; opacity: 0; pointer-events: none; } .js .content__item--current { position: relative; opacity: 1; pointer-events: auto; } .page--preview { display: none; width: 0;height: 0; } .hidden .page--preview{ background:#000;display: block; z-index: 106; width: 100%; height: 100vh; position: fixed;top: 0; left: 0; overflow: hidden; height: 100vh; } @media screen and (min-width: 53em) { /*	.content { position: relative; display: flex; justify-content: center; align-items: center; margin: 0 auto; min-height: 60vh; text-align: left; }*/ /*	.frame { position: fixed; text-align: left; display: grid; align-content: space-between; max-width: none; height: 100vh; padding: 2rem; pointer-events: none; grid-template-columns: 50% 50%; grid-template-rows: auto auto auto; grid-template-areas: 'pageheader menutop' '... ...' '... codropsheader'; }*/ .codrops-header { grid-area: codropsheader; padding: 0; justify-self: end; text-align: right; } .codrops-links { margin: 0; } .frame a { pointer-events: auto; } .pageheader { grid-area: pageheader; margin: 0; } .menutop { grid-area: menutop; justify-self: end; width: 100%; display: grid; grid-template-rows: 100%; grid-auto-flow: column; justify-content: end; grid-gap: 1rem; } .menutop__item:nth-child(2) { margin: 0 2rem 0 0; } .s.menu { top: 100px; height: 100%; } .menu__item { margin: 1rem 0; flex-wrap: nowrap; justify-content: flex-start; } .menu__item-number { display: block; color: #fff; } .menu__item-text { font-size: 8vh; } .menu__item-link { text-align: left; width: auto; color: #fff; } .gridwrap { grid-gap: 3rem; padding: 2rem 5vw; } .grid { --gridheight: 1100px; } .content__item { font-size: 1.5rem; padding: 10vh 1rem; } }

.mu_tel {
position: absolute;
    font-size: 32px;
    color: #fff;
    right: 15%;
    top: 20%;
    z-index: 99;
}
.mu_tel .li{
	margin-bottom: 50px;
}
.mu_tel .li b{
	font-size: 22px;
	font-weight: normal;
	    font-family: 'Montserrare';
	    display: block;
	    padding-bottom: 16px;
	text-transform: uppercase;
}
.mu_tel .li p {
	font-weight: normal;
	font-style: normal;
	    font-size: 18px;
	    line-height: 34px;
	    color: #e2e2e2;
}
.li_wechat {
	text-align: left;
}
.li_wechat div{
	text-indent: 18px;
}
.li_wechat img{
	width: 70px;
	display: block;
	padding: 6px;
	border: 1px solid #747474;
}
.li_wechat div {
	font-size: 14px;
	    text-indent: 5px;
}

 .home_mu {
    background: #f6f6f6;
    position: fixed;
    left: 0;
    top: 0;
    width: 69px;
    height: 100vh;
    z-index: 9900;
    float: left;
    border-right: 1px solid #999;
}
#top .hidden .home_mu {
    z-index: inherit;
    height: auto;
    z-index: 999;
    height: 100%;
    background: none;
}
div.open.burger .x, div.open.burger .z {
    width: 40px;
}
.hidden div.burger.open {
    left: 11px;
    position: fixed;
}
.hidden #top .home_mu {
    z-index: inherit;
    height: auto;
    z-index: 999;
    height: 100%;
    background: none;
}
.hidden div.circle.expand {
	display: none;
}