@charset "utf-8";  


/* Aside-3 */
#aside , .aside__btn__top , .aside__btn__top > span , .aside__nav__link { width:5rem } 
.aside__btn__top , .aside__btn__top > span , .aside__nav__link  { height:5rem }
#aside { position:fixed ; right:-18rem ; bottom:0.5rem ; z-index:80 ; opacity:0 } 
#aside.top { right:0.5rem ; opacity:1 }
 
.aside__btn__top , .aside__nav__link , .aside__nav__link::before , .aside__nav__link::after { border-radius:100% }
.aside__btn__top , .aside__nav__link { 
    display:block ; 
    font-size:0 ; color:transparent
}
.aside__btn__top { 
    overflow:hidden ; text-indent:-99rem ;
    position:absolute ; right:0 ; bottom:0 ; background-color:#444444 ;
}
.aside__btn__top:hover { background-color:#000000 }
#aside , .aside__btn__top , .aside__btn__top > span , 
.aside__btn__top > span::before , .aside__btn__top > span::after ,
.aside__nav__link , .aside__nav__link::before , .aside__nav__link::after { transition:0.3s all }
.aside__btn__top > span , .aside__btn__top > span::before , .aside__btn__top > span::after ,

.aside__nav__link::before , .aside__nav__link::after { 
    display:block ; 
    position:absolute ; left:50% ; top:50% ; transform:translate(-50%,-50%) ;
}
.aside__btn__top > span { transform:translate(-50%,-50%) scale(0.8) }
.aside__btn__top:hover > span { transform:translate(-50%,-50%) scale(1) }
.aside__btn__top > span::before , .aside__btn__top > span::after ,
.aside__nav__link::before , .aside__nav__link::after { content:"" ; box-sizing:border-box }
.aside__btn__top > span::before {
    width:1.2rem ; height:1.2rem ; 
    border:solid 0.2rem #ffffff ; border-right:none ; border-bottom:none  ;
    transform:translate(-50%,-50%) rotate(45deg)
}
.aside__btn__top > span::after {
    width:0.2rem ; height:1.6rem ; 
    background-color:#ffffff ; border-radius:1rem ;
    top:53%
}
.aside__btn__top:hover > span::before { top:65% }
.aside__btn__top:hover > span::after  { 
    top:40% ; transform:translate(-50%,-50%) rotate(90deg) ;
    height:1.8rem
}

.aside__nav { 
    position:absolute ; right:5rem ; bottom:0 ;
    width:11rem ; 
}
.aside__nav::after { display:block ; content:"" ; clear:both }
.aside__nav__item  { float:left ; margin-right:0.5rem ; display:block } 
.aside__nav__link  { position:relative ; background-color:#ffffff }
.aside__nav__link::before { 
    width:3rem ; height:3rem ;
    background:no-repeat center ; background-size:cover ;
    opacity:0.5 ;
}
.aside__nav__link:hover::before { opacity:1  }
.aside__nav__link:hover { box-shadow:0 0.1rem 0.3rem rgba(0,0,0,0.2) }
.aside__nav__link::after  { 
    width:100% ; height:100% ;
    border:solid 1px rgba(0,0,0,0.1) }
.aside__nav__link.copyLink::before  { background-image:url(../icons/icon_link.svg) }
.aside__nav__link.subscribe::before { background-image:url(../icons/icon_bell.svg) }





@media screen and (min-width:1024px){ 
 
    /* Aside-3 */
    #aside , .aside__btn__top , .aside__nav , .aside__nav__link { width:6rem } 
    .aside__btn__top , .aside__nav__link { height:6rem }  
    .aside__nav { right:6rem ; width:13rem }
    .aside__btn__top > span { transform:translate(-50%,-50%) scale(1) }

} 
    




@media print {  }