@charset "utf-8";

/* scrollbar */
::-webkit-scrollbar {
  width: 0px;
}

::-webkit-scrollbar-track {
  background: #0f0f0f;
}

::-webkit-scrollbar-thumb {
  background: #000;
}

::-webkit-scrollbar-thumb:hover {
  background: #000;
}

li.menu-item{
overflow: hidden;
text-align: right;
margin: 0 0 6px 0;
}

li.menu-item a{
position: relative;
transition: 0.5s ease-out;
}

/*li.menu-item a::after{
content: attr(data-content);
position: absolute;
bottom: -102%;
left: 0;
font-size: 2rem;
}*/

/*li.menu-item a:hover{
translate:0px -102%;
}*/

.menuzh{
font-size: 1.2rem;
}

.msold{
font-size: 2rem;
margin: 0 8px 0 8px;
font-weight: lighter;
}

.primary-navigation__link:hover {
font-size: 2.3rem;
transition: 0.2s ease-out;
color: rgba(170,170,170,1.00);
padding: 3px 5px 3px 5px;
}

.primary-navigation__link:hover .menuzh{
font-size: 1.8rem;
transition: 0.2s ease-out;
letter-spacing: 3px;
color: rgba(255,255,255,1.00);
}

.primary-navigation__link::after {
content: '';
display: block;
position: absolute;
bottom: 0px;
right: 0px;
width: 0px;
height: 100%;
z-index: -1;
background-color: rgba(0,0,0,1.00);
}

li.menu-item:hover a.primary-navigation__link::after{
width: 100%;
transition: 0.2s ease-in-out;
}

.mnopnam{
font-size: 2rem;
display: block;
margin: 0 0 20px 0;
font-weight: bold;
letter-spacing: 1px;
}

.inpbg {
    background-repeat: no-repeat;
    background-size: contain;
    width: 100%;
    height: 100vh;
	overflow-x: hidden;
	animation: flyin 0.2s ease-in;
	transition: all 300ms;
}

@keyframes flyin {
  from {position: absolute; left: 25%;}
  to {position: relative; left: 0%;}
}

.inpb01 {
    background-image: url(../images/pg01.jpg);
}

.inpb02 {
    background-image: url(../images/pg02.jpg);
}

.inpb03 {
    background-image: url(../images/pg03.jpg);
}

.ing {
    background-repeat: no-repeat;
    background-size: contain;
    width: 100%;
    height: 100vh;
	overflow-x: hidden;
}

.ing01 {
    background-image: url(../images/pg01.jpg);
}

.ing02 {
    background-image: url(../images/pg02.jpg);
}

.ing03 {
    background-image: url(../images/pg03.jpg);
}

.infshow {
background-color: rgba(255,255,255,1.00);
-webkit-box-shadow: 1px 1px 3px 2px rgba(54,45,45,0);
box-shadow: -7px 0px 12px 0px rgba(54,45,45,0);
position: absolute;
width: 71.5%;
right: 0px;
height: 100vh;
animation: fly 0.4s ease-out forwards;
transition: all 300ms ;
font-family: "微軟正黑體";
}

@keyframes fly {
  from {right: -1000px;opacity: 100%;box-shadow: -7px 0px 12px 0px rgba(54,45,45,0);}
  to {right: 0px;opacity: 100%;box-shadow: -7px 0px 12px 0px rgba(54,45,45,1);}
}

.workall{
display: flex;
flex-wrap: wrap;
overflow: hidden scroll;
height: 100%;
}

.workblock{
width: 33.3333333333%;
height: 50vh;
border-right: 1px solid #ebebeb;
border-bottom: 1px solid #ebebeb;
overflow: hidden;
position: relative;
background-color: #F5F5F5;
}

.workpc{
position: absolute;
width: 100%;
height: 100%;
left: 0%;
top:0%;
transition: all 0.3s;
}

.workpc:hover img{
width: 340px;
height: 340px;
border-radius: 50%;
left: 12%;
top:7%;
transform-origin: center center;
transition: all 0.3s ease-out;
overflow: hidden;
}

.workpc img{
width: 100%;
height: 100%;
position: absolute;
left: 0%;
top:0%;
transition: all 0.4s ease-out;
}

/*.workpc:hover img{
transform: scale(1.1,1.1);
transform-origin: center center;
transition: all 0.3s;
}*/

.worktxt{
position: absolute;
bottom: -10%;
width: 100%;
height: 50px;
text-align: center;
}

.worktx_h1{
font-size: 1.28em;
color: #000;
font-weight: bold;
}

.worktx_h2{
font-size: 1.02em;
color: #7f7f7f;
margin: 0 0 1px 0;
}

.workblock:hover .worktxt{
bottom: 7%;
transition: all 0.4s ease-in-out;
}

.viewwork{
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 20px 0px 80px 0px;
width: 100%;
height: 100%;
overflow: hidden scroll;
}

.inpg .menu-toggle span {
background-color: #606060;
}

.inpg .menu-toggle.close span:nth-child(2),.inpg .menu-toggle.close span:nth-child(3) {
    background-color: #ffffff;
}

.vtop {
margin: 0 0 30px 0;
width: 26px;
height: 26px;
z-index: 7;
position: absolute;
left: 31%;
top: 3%;
background-image: url(../images/listico.svg);
background-repeat: no-repeat;
}

.vtop a {
display: block;
}

.vtop:hover {
width: 31px;
height: 31px;
left: 30.95%;
top: 2.9%;
background-image: url(../images/listico_h.svg);
transform-origin: center;
transition: all 0.3s ease-out;
}

.workinf {
    margin: 50px auto 5px auto;
    width: 80%;
    display: flex;
}

.win_left {
    width: 90%;
    padding-left: 8%;
}

.win_right {
    width: 12%;
    padding-top: 12%;
}

.wsh2{
margin: 0 0 10px 0;
}

.wsh2_1{
font-size: 1.2em;
font-weight: bold;
}

.wsh2_2{
font-size: 1em;
}

.wsh1{
margin: 0 0 27px 0;
}

.wsh1_1{
font-size: 3.2em;
font-weight: bold;
}

.wsh1_2{
font-size: 1.2em;
margin: -8px 0 0 0;
}

.wobpc{
margin: 0 auto 80px auto;
width: 100%;
background-color: #000;
min-height: 675px;
}

.wobpc img{
width: 100%;
}

.wointro {
    margin: 0 auto 80px auto;
    width: 68%;
    font-size: 1.2em;
    line-height: 1.7em;
}

.alpcarea{
margin: 0 auto 40px auto;
width: 80%;
}

#slider1 {
width: 100%;
margin: 0 auto;
}
			
/* responsive rules */
@media (max-width: 850px) {
#slider1 {
	width: 100%;
	height: 245px  !important; 
}

}

.linkwork{
margin: 30px auto 0 auto;
width: 80%;
}

.linkwork a {
background-color: rgba(77,77,77,1.00);
color: #FFF;
font-size: 1em;
text-align: center;
padding: 5px 25px 5px 25px;
float: right;
position: relative;
z-index: 1;
}

.linkwork a::after {
content: "";
display: block;
position: absolute;
left: 0px;
top: 0px;
width: 0px;
background-color: #000000;
z-index: -1;
height: 100%;
}

.linkwork:hover a::after{
width: 100%;
transition: all 300ms ease-out;
}

.awrbox {
   
}

.awo {
    display: inline-block;
    margin: 0 8px;
}

.awo a {
display: block;
width: 42px;
height: 42px;
border-radius: 50%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
background-color: #fff;
-webkit-box-shadow: 0px 0px 5px 3px rgba(134,134,134,0.40);
box-shadow: 0px 0px 5px 3px rgba(134,134,134,0.40);
/* text-align: center; */
padding: 8px 0 0 12px;
}

.awrbox .awo:nth-child(1) a{
background-image: url(../images/arrow_left.svg);
background-repeat: no-repeat;
background-position: 11px 9px;
}

.awrbox .awo:nth-child(2) a{
background-image: url(../images/arrow_r.svg);
background-repeat: no-repeat;
background-position: 14px 9px;
}

.awrbox .awo:nth-child(1) a:hover {
background-color: #6E6E6E;
background-image: url(../images/arrow_left_h.svg);
transition: all 0.2s linear;
background-position: 8px 9px;
}

.awrbox .awo:nth-child(2) a:hover {
background-color: #6E6E6E;
background-image: url(../images/arrow_r_h.svg);
transition: all 0.2s linear;
background-position: 17px 9px;
}

.backaw {
position: absolute;
z-index: 7;
left: 30.5%;
top: 3%;
}

.backaw a {
display: block;
background-image: url(../images/bakaw.svg);
background-repeat: no-repeat;
width: 40px;
height: 27px;
}

.backaw:hover {
    left: 30.5%;
    top: 3%;
	animation: bk 1s ease-out alternate forwards infinite;
	transition: all 0.3s ease-out;
}

@keyframes bk {
  from {left: 30.5%;}
  to {left: 30%;}
}

#aboutus{
visibility: hidden;
}

.aboutpop{
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
display: block;
z-index: 9;
background: rgba(0,0,0,.92);
}

.menu-close {
    width: 29px;
    height: 59px;
    position: absolute;
    right: 23px;
    top: 3px;
    transition: cubic-bezier(0.22,0.61,0.36,1);
    z-index: 7;
}

.menu-close span {
    display: block;
    width: 100%;
    height: 3px;
    background-color: #fff;
    position: absolute;
    left: 0;
    transition: all .125s ease-out;
}

.menu-close span:nth-child(1) {
    top: 50%;
    transform: rotate(45deg) translateY(-50%);
}

.menu-close span:nth-child(2) {
    bottom: 50%;
    transform: rotate(-45deg) translateY(50%);
    width: 100%;
}

.backmenu {
    position: absolute;
    top: -3%;
    left: 15%;
}

.abtarea {
    color: #fff;
    font-size: 1.1em;
    line-height: 1.9em;
    text-align: justify;
	font-family: "微軟正黑體";
}

#aboutus .primary-navigation__aside-logo {
opacity: 1;
visibility: visible;
}

#aboutus .primary-navigation__aside-text{
opacity: 1;
visibility: visible;
}

.aside-logo{
    margin-bottom: 2em;
}

.aside-text{
font-family: "微軟正黑體";
font-size: 1.05em;
line-height: 1.6;
color: #dcdcdc;
margin-bottom: 2em;
}

.aboallv {
    width: 80%;
    margin: 0 auto 0 auto;
    height: 780px;
    overflow: auto;
    padding: 0 85px 0 0;
}

.abtth1 {
    font-size: 2em;
    margin: 0 0 50px 0;
    color: #ffffff;
    font-family: "微軟正黑體";
}

.fea {
    margin: 0 auto 32px auto;
    width: 59%;
}

.fea img{
width: 100%;
}

.othfea{
margin: 42px 0 0 0;
color: #fff;
}

.othfh1{
font-weight: bold;
margin: 0 0 15px 0;
font-size: 1.35em;
}

.othfh2{
margin: 0 0 15px 0;
}

.othfh2 ul li {
    margin: 0 0 8px 0;
    font-size: 1.1em;
    font-family: "微軟正黑體";
    float: left;
    min-width: 37%;
}

.othfh2 ul:after{
content: '';
display: block;
clear: both;
}

.culogall{
display: flex;
flex-wrap: wrap;
}

.culogo {
    width: 18%;
    margin: 0 1% 25px 1%;
}

.culogo img{
width: 100%;
}

#popview{
position: fixed;
background-color: rgba(0,0,0,0.3);
width: 100%;
height: 100%;
z-index: 8;
visibility: hidden;
transition: all 0.3s;
top: 0px;
}

#popview iframe{
width: 100%;
height: 100%;
}

.popclose{
position: absolute;
right: 2%;
top: 2%;
cursor: pointer;
}

#gotop {
    display: none;
    position: fixed;
    right: 20px;
    bottom: 20px;    
    cursor: pointer;
	z-index: 7;
}

.newslink{
margin: 80px auto 0 auto;
width: 80%;
}

.nwltit{
font-size: 1.3em;
margin: 0 0 15px 0;
}

.nwlist{
font-size: 1.1em;
}

.nwlist ul li a{
color: #878787;
}

.nwlist ul li a:hover{
color: #000;
text-decoration: underline;
}

.incontus{
    margin-top: 65px;
	text-align: center;
	color: #fff;
	font-family: "微軟正黑體";
}

.incutt{
font-size: 1.3em;
font-weight: bold;
margin: 0 0 15px 0;
display: block;
}

.fbico {
    margin: 0 22px 0 0;
}

.shico {
    margin: 10px 0 0 0;
}

.jSlider > img:first-child {
    height: inherit;
}

@media screen and (max-width: 1750px){

.workpc:hover img {
    width: 265px;
    height: 265px;
}

.worktx_h2 {
    font-size: 1em;
}

.worktx_h1 {
    font-size: 1.15em;
    color: #000;
    font-weight: bold;
}

.wsh1_1 {
    font-size: 2.7em;
}

.wsh1_2 {
    font-size: 1em;
    margin: -5px 0 0 0;
}

.wobpc {
    min-height: 555px;
}

.jSlider {
    height: 523px !important;
}

.jSlider .slider-content-wrapper {
    height: 523px !important;
}

.awo {
    margin: 0 5px;
}

.awo a {
    width: 35px;
    height: 35px;
}

.awrbox .awo:nth-child(1) a {
    background-position: 8px 6px;
}

.awrbox .awo:nth-child(1) a:hover {
    background-position: 6px 6px;
}

.awrbox .awo:nth-child(2) a {
    background-position: 11px 6px;
}

.awrbox .awo:nth-child(2) a:hover {
     background-position: 13px 6px;
}


.workblock {
    width: 33.3333333333%;
    height: auto;
    aspect-ratio: 3 / 3.1;
}

}

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

.workpc:hover img {
    width: 260px;
    height: 260px;
    left: 10%;
    top: 7%;
}

.primary-navigation__link {
    font-size: 2.1rem !important;
    line-height: 2.7rem  !important;
}

.primary-navigation__link:hover {
    font-size: 1.7rem !important;
}

.primary-navigation__link:hover .menuzh {
    font-size: 1.6rem;
}

.mnopnam {
    font-size: 1.7rem;
}

.aboallv {
    width: 80%;
    height: 670px;
    padding: 0 5px 0 0;
}

.fea {
    width: 67%;
}

.wsh1_1 {
    font-size: 2.6em;
    font-weight: bold;
}

.wsh1_2 {
    font-size: 0.98em;
    margin: -4px 0 0 0;
}

.win_right {
    width: 12%;
}

.wobpc {
    min-height: 520px;
}

.wobpc video{
    height: 520px !important;
}

.jSlider {
    height: 490px !important;
}

.jSlider .slider-content-wrapper {
    height: 490px !important;
}

.awo {
    margin: 0 5px;
}

.awo a {
    width: 35px;
    height: 35px;
}

.awrbox .awo:nth-child(1) a {
    background-position: 8px 6px;
}

.awrbox .awo:nth-child(1) a:hover {
    background-position: 6px 6px;
}

.awrbox .awo:nth-child(2) a {
    background-position: 11px 6px;
}

.awrbox .awo:nth-child(2) a:hover {
     background-position: 13px 6px;
}

}


@media screen and (max-width: 1366px){

.aboallv {
    width: 80%;
    height: 570px;
}

.primary-navigation__link {
    font-size: 1.8rem !important;
    line-height: 2.5rem !important;
}

.menuzh {
    font-size: 1.1rem;
}

.msold {
    font-size: 1.4rem;
    margin: 0 5px 0 5px;
}

.primary-navigation__link:hover {
    font-size: 1.6rem !important;
}

.primary-navigation__link:hover .menuzh {
    font-size: 1.4rem;
}

.infshow {
width: 73%;
}

.workpc:hover img {
    width: 220px;
    height: 220px;
    left: 18%;
    top: 5%;
}

.worktx_h2 {
    font-size: 1em;
}

.worktx_h1 {
    font-size: 1.2em;
    color: #000;
    font-weight: bold;
}

.win_right {
    width: 14%;
}

.backaw {
left: 29%;
top: 3%;
}

.backaw:hover {
    left: 29%;
    top: 3%;
}

@keyframes bk {
  from {left: 29%;}
  to {left: 30%;}
}


.vtop {
left: 29%;
top: 3%;
}

.vtop:hover {
left: 29%;
top: 3%;
}

.awo {
    margin: 0 5px;
}

.awo a {
    width: 35px;
    height: 35px;
}

.awrbox .awo:nth-child(1) a {
    background-position: 8px 6px;
}

.awrbox .awo:nth-child(1) a:hover {
    background-position: 6px 6px;
}

.awrbox .awo:nth-child(2) a {
    background-position: 11px 6px;
}

.awrbox .awo:nth-child(2) a:hover {
     background-position: 13px 6px;
}

.wobpc {
    min-height: 475px;
}

}


@media screen and (max-width: 1280px){
	
.workinf {
    margin: 40px auto 5px auto;
}

.wsh2 {
    margin: 0 0 5px 0;
}

.wsh1_1 {
    font-size: 2.3em;
}

.wsh1 {
    margin: 0 0 20px 0;
}
	
}


@media screen and (max-width: 1250px){

.aboallv {
    height: 510px;
}

.primary-navigation__link {
    font-size: 1.5rem !important;
    line-height: 2rem !important;
}

.primary-navigation__link:hover {
    font-size: 1.4rem !important;
}

.menuzh {
    font-size: 1rem;
}

.primary-navigation__link:hover .menuzh {
    font-size: 1.2rem;
    letter-spacing: 2px;
}

.msold {
    font-size: 1.2rem;
}

.abtarea {
    font-size: 1em;
    line-height: 1.9em;
}

.othfh2 ul li {
    font-size: 1em;
    min-width: 43%;
}

.workpc:hover img {
    width: 200px;
    height: 200px;
    left: 16%;
    top: 7%;
}

.worktx_h2 {
    font-size: 0.85em;
}

.worktx_h1 {
    font-size: 1em;
    color: #000;
    font-weight: bold;
}

.win_right {
    width: 16%;
}

.workinf {
    width: 85%;
}

.wsh1_1 {
    font-size: 2.3em;
}

.wobpc {
    min-height: 430px;
}

.jSlider {
    height: 405px !important;
}

.jSlider .slider-content-wrapper {
    height: 405px !important;
}

}

@media screen and (min-device-width: 834px) and (max-device-width: 1194px) {

.inpb01,.inpb02{
    background-size: cover;
    background-position-x: -70px;
}

.inpb03 {
    background-size: cover;
    background-position-x: -90px;
}

.ing01,.ing02 {
    background-size: cover;
    background-position-x: -70px;
}

.ing03 {
    background-size: cover;
    background-position-x: -90px;
}

.site-header__logo {
    width: 80% !important;
}
	
}



@media screen and (max-width: 1100px){

.workpc:hover img {
    width: 170px;
    height: 170px;
    left: 18%;
    top: 7%;
}

.workblock:hover .worktxt{
bottom: 4%;
}

.aboallv {
    height: 470px;
}

.abtarea {
    font-size: 1em;
    line-height: 1.9em;
}

.othfh2 ul li {
    font-size: 1em;
    min-width: 46%;
}


}


/*mobile phone*/
@media screen and (max-width: 850px){

.inpg .backaw {
    left: inherit;
    top: 2.2%;
    right: 18%;
}

.backaw:hover {
    left: inherit;
    top: 2.5%;
    right: 18%;
    animation: none;
}

.vtop {
    left: inherit;
    top: 2.5%;
    right: 20%;
}

.vtop:hover {
    left: inherit;
    top: 2%;
    right: 20%;
    animation: none;
}

.inpbg {
    background-repeat: no-repeat;
    background-size: contain;
    width: 100%;
    height: 100vh;
	overflow-x: hidden;
	animation: flyin 0.3s ease-out;
	transition: all 0.3s;
}

@keyframes flyin {
  from {position: relative; top: 25%;}
  to {position: relative; top: 0%;}
}

.inpg .menu-toggle span {
    background-color: #ffffff;
}

.inpg .site-header {
    background: #000;
}

.inpg .logo-wrapper {
    top: 9px;
    left: 20px;
}

.inpg .menu-toggle {
    right: 26px;
    top: 1px;
    width: 33px;
}

.wobpc {
    min-height: auto;
	margin: 0 auto 40px auto;
}

.infshow {
    -webkit-box-shadow: none;
    box-shadow: none;
    width: 100%;
    right: inherit;
    height: 80vh;
    left: 0px;
    top: 24vh;
	animation: fly 0.7s ease-out forwards;
	transition: all 0.3s;
}

@keyframes fly {
  from {top: 28vh;opacity: 100%;box-shadow: none;height: 80vh;}
  to {top: 24vh;opacity: 100%;box-shadow: none;height: 80vh;}
}

.inpb01,.ing01  {
    background-image: url(../images/RWD_pg01.jpg);
}

.inpb02,.ing02 {
    background-image: url(../images/RWD_pg02.jpg);
}

.inpb03,.ing03 {
    background-image: url(../images/RWD_pg03.jpg);
}

.workblock {
    width: 350px;
    height: 350px;
    border-right: none;
    border-bottom: 1px solid #ebebeb;
    margin: 20px auto 0 auto;
}

.worktxt {
bottom: 0%;
width: 100%;
height: auto;
background-color: rgba(73,73,73,0.70);
z-index: 1;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 5px;
}

.workpc:hover img {
    width: 260px;
    height: 260px;
    left: 13%;
    top: 7%;
}

.workblock:hover .worktxt {
    bottom: 0%;
    transition: all 0.4s ease-in-out;
}

.worktx_h1 {
font-size: 1.1em;
color: #fff;
}

.worktx_h2 {
font-size: 1em;
color: #D9D9D9;
margin: 0 0 1px 0;
}

.workinf {
    margin: 15px auto 20px auto;
    width: 87%;
    display: flex;
    flex-wrap: wrap;
}

.wointro {
    width: 80%;
    font-size: 1.1em;
    line-height: 1.7em;
	margin: 0 auto 45px auto;
}

.wobpc video,.wobpc iframe{
height: 320px !important;
}

.win_left {
    width: 100%;
    padding-left: 4%;
}

.win_right {
    width: 100%;
    padding-top: 2%;
}

.awrbox {
    float: right;
}

.awo {
    margin: 0 3px;
}

.awo a {
    width: 35px;
    height: 35px;
}

.awrbox .awo:nth-child(1) a {
    background-position: 8px 6px;
}

.awrbox .awo:nth-child(2) a {
    background-position: 11px 6px;
}

.wsh2 {
    margin: 0 0 15px 0;
}

.wsh1_1 {
    font-size: 2.1em;
    margin: 0 0 15px 0;
    line-height: 1.2em;
}

.wsh1_2 {
    font-size: 1.12em;
}

.jSlider .slider-content-wrapper {
    width: 100%;
    height: 245px !important;
    overflow: hidden;
}

li.menu-item {
    text-align: left;
	width: 85%;
    margin: 0 auto;
}

.msold {
    font-size: 1.4rem;
    margin: 0 5px 0 5px;
}

.menuzh {
    font-size: 1rem;
}

.primary-navigation__link {
    color: #DCDCDC;
	font-size: 1.4rem !important;
}

.mnopnam {
    font-size: 1.2rem;
    margin: 0 0 10px 0;
}

.wdabt {
    bottom: 2%;
    border-top: 1px solid #646464;
    padding: 15px 0 0 0;
    margin: 55px auto 0 auto !important;
}

.primary-navigation__aside-text {
    font-size: 1em;
}

.aboallv {
    width: 80%;
    height: 560px;
    padding: 0 0px 0 0;
}

.abtth1 {
    font-size: 1.6em;
    margin: 0 0 40px 0;
}

.backmenu {
    top: -6%;
    left: 20%;
}

.fea {
    margin: 0 auto 20px auto;
    width: 100%;
}

.abtarea {
    font-size: 1rem;
    line-height: 1.9em;
}

.othfh1 {
    margin: 0 0 15px 0;
    font-size: 1.25em;
}

.othfh2 ul li {
    font-size: 1em;
}

.culogo {
    width: 31%;
    margin: 0 1% 9px 1%;
}

.popclose {
    right: 5%;
    top: 2%;
}


}

@media screen and (min-width: 834px) and (max-width: 1194px) and (orientation:portrait) {

.inpb01,.inpb02,.inpb03{
    background-position-x: 0px;
}

.ing01,.ing02,.ing03 {
    background-position-x: 0px;
	background-size: contain;
}

.workall {
    width: 95%;
    margin: 0 auto;
}

.workblock {
    width: 48%;
    height: 400px;
}

.inpg .backaw {
    top: 1.5%;
    right: 10%;
}

.backaw:hover {
    top: 1.5%;
    right: 10%;
}

.vtop {
    top: 1.5%;
    right: 10%;
}

.vtop:hover {
    top: 1.5%;
    right: 10%;

}

	
}

@media screen and (max-width: 375px){

.primary-navigation__link {
    font-size: 1.2rem !important;
}

.workblock {
    height: 340px;
}

.workpc:hover img {
    width: 260px;
    height: 260px;
    left: 11%;
    top: 7%;
}

.wsh1_1 {
    font-size: 2.3em;
}

.infshow {
    top: 26vh;
}

@keyframes fly {
  from {top: 29vh;opacity: 100%;box-shadow: none;height: 80vh;}
  to {top: 26vh;opacity: 100%;box-shadow: none;height: 80vh;}
}

}