@charset "utf-8";
/*
Theme Name: RINJIN
Description: 
Author: COSMICGEAR
Version: 1.0
*/
/*-root*/ :root {
  --fnt-base: YakuHanJP, "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Noto Sans JP", Meiryo, sans-serif;;
  --clr-wht: #fafafa;
  --fnt-en: YakuHanRPs, montserrat, var(--fnt-base);
  --fnt-titu: titular, sans-serif;
  --head2: clamp(35px, 3.3cqw, 70px);
  --head2_udr:clamp(35px, 3.3cqw, 70px);
  --head3_min: min(24px, calc(100vw/21));
  --head-h:90px;
  
  --clr-gry:#5b5b5b;
  --wall-blk: #171717;
  --wall-gry: #3A3A3A;
/*  --easing: cubic-bezier(0.25, 1, 0.5, 1);*/
  --easing: cubic-bezier(0.43, 0.03, 0.02, 0.98);
  --transit: .5s var(--easing);  
  --lnav_wall:50vw;
}
/*base=====*/
html {
  scroll-behavior: auto;
}
html, body {
  /*  overscroll-behavior: none;*/
}
body {
  width: 100%;
  height: 100%;
  overflow-x: hidden;
  font-family: YakuHanRPs, var(--fnt-base);
  font-size: min(3.2vw, 14px);
  overflow-wrap: anywhere;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  font-weight: 400;
  opacity: 0;
  transition: opacity var(--transit);
  background-color: var(--clr-wht);
  
}
body.is-load{
  opacity: 1;
}
body.home{
  background-color: var(--wall-blk);
  color: var(--clr-wht);
}
body::before
,body::after{
  content: "";
  position: fixed;
  top: 0;
  width: var(--lnav_wall);
  height: 100vh;
  transform: translateY(-120%);
  transition:transform 1s var(--easing);
  will-change: transform;
  z-index: 5;
}
body::after{
  right: 0;
  background-color: #000;
  transition-delay: .15s;
}
body::before{
  left: 0;
  background-color: rgba(0,0,0,.5);
  transition-delay: 0s;
  background-image: radial-gradient(var(--wall-blk) .5px, transparent .5px);
  background-size: 3px 3px;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  will-change:auto;
}
body.nav-open::before
,body.nav-open::after{
  transform: translateY(0);
}
.fl {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
}
.fl.jc_c {
  justify-content: center;
}
.fl_c {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
}
.fl_c.ai_c {
  -ms-align-items: center;
  align-items: center;
}
figure {
  margin-bottom: 0 !important;
}
/*container
========================================================*/
#container {
  width: 100%;
  min-height: 100dvh;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  overflow-x: hidden;
}
a.cvr {
  position: absolute;
  inset: 0;
  z-index: 1;
}
/*hum
=====================================*/
#hum-button {
  position: fixed;
  top: 0;
  right: 0;
  width: min(65px, 15vw);
  aspect-ratio: 1/1;
  z-index: 100;
  cursor: pointer;
  display: flex;
  -ms-align-items: center;
  align-items: center;
  justify-content: center;
  background-color: var(--clr-wht);
  transition: opacity 0.2s ease-out 0s, translate 1.5s cubic-bezier(0.19, 1, 0.22, 1) 0s, visibility 0.2s ease-out;
  translate:0 50%;
  opacity: 0;
  visibility: hidden;
  mix-blend-mode: difference;
}
.is-scrolled #hum-button{
  translate:0 0;
  opacity: 1;
  visibility: visible;
}
#hum-button button {
  width: 67%;
  height: 1px;
  background-color:var(--wall-blk);
  position: relative;
  transition: transform var(--transit);
}
#hum-button button::before, #hum-button button::after {
  content: "";
  width: 100%;
  height: 1px;
  position: absolute;
  left: 0;
  background-color: var(--wall-blk);
  transition: transform var(--transit);
  transform-origin: center;
}
#hum-button button::before {
  top: -8px;
}
#hum-button button::after {
  bottom: -8px;
}
#hum-button.open {
  top: 0;
  right: 0;
}
#hum-button.open button {
  transform: rotate(20deg);
}
#hum-button.open button::before, #hum-button.open button::after {
  top: 0;
  bottom: auto;
}
#hum-button.open button::before, #hum-button.open button::after {
  transform: rotate(140deg);
}
#l-nav {
  position: fixed;
  width: 100vw;
  height: 100vh;
  top: 0;
  left: 0;
  z-index: 99;
  visibility: hidden;
  opacity: 0;
  transition: translate var(--transit),visibility var(--transit),opacity var(--transit);
  overflow-y: scroll;
  transition-delay: .15s;
}
#l-nav.is-view {
  visibility: visible;
  opacity: 1;
  transition-delay: .6s;
}
.l-nav_inner {
  margin-left: auto;
  width: 50vw;
  min-height: 100svh;
  padding: min(100px, 25vw) min(35px, 8vw) min(50px, 12vw);
  display: grid;
  grid-template-columns: min(700px, 100%);
  justify-content: center;
  align-content: center;
  gap: min(50px, 12vw);
  z-index: 1;
  color: var(--clr-wht);
}
.l-nav__menu li a{
  font-size: clamp(18px, 6.133vw, 30px);
  font-family: var(--fnt-en);
  font-weight: 600;
  padding: .25em 0;
  display: block;
}
.l-nav__sns{
  display: flex;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  gap:10px;
}
.l-nav__sns dt{
  font-family: var(--fnt-en);
}
.l-nav__sns dd{
  justify-content: flex-start;
}
/*header
=====================================*/
header {
  width: 100%;
  overflow: hidden;
  z-index: calc(infinity);
  position: fixed;
  top: 0;
  left: 0;
  transition: translate var(--transit);
  mix-blend-mode: difference;
  pointer-events: none;
}
.head-inner {
  min-height: 100%;
  padding-left: min(50px, 4vw);
  padding-right: min(50px, 4vw);
  -ms-align-items: center;
  align-items: center;
  justify-content: space-between;
}
.h-logo {
  display: grid;
  -ms-align-items: center;
  align-items: center;
  justify-content: flex-start;
  grid-template-columns: min(30px, 10vw) auto;
  gap: min(10px, 2.5vw);
  pointer-events: auto;
  width: min(160px,40vw);
}
#svg-logo {
  aspect-ratio: 1;
}
.h-logo img {
  object-fit: contain;
  object-position: center left;
  width: 100%;
  height: 100%;
}
.h-logo svg {
  object-fit: cover;
  height: 100%;
  object-position: center;
}
#svg-logo svg path, .h-logo span.ttl svg {
  fill: #fff;
}
.h-logo span.ttl {
  height: min(30px, 12vw);
}
.header-nav{
  transition: opacity 0.4s ease-out 0s, translate 1.8s cubic-bezier(0.19, 1, 0.22, 1) 0s, visibility 0.4s ease-out;
  opacity: 1;
  visibility: visible;
  gap:min(20px,4vw);
  pointer-events: auto;
}
.h-sns-link {
  display: grid;
  grid-template-columns: repeat(3, min(18px, 12vw));
  -ms-align-items: center;
  align-items: center;
  gap: 1em;
  pointer-events: auto;
}
.h-sns-link a {
  aspect-ratio: 1;
}
.h-sns-link a img {
  object-fit: contain;
  height: 100%;
  object-position: center;
}
.g-nav{
  display: flex;
  color: #fff;
  gap:1em;
  font-family: var(--fnt-en);
}
.g-nav li a{
  display: grid;
  padding-top: min(30px, 3vw);
  padding-bottom: min(30px, 3vw);
  font-weight: 500;
  font-size: min(15px,3.8vw);
}
.is-scrolled .header-nav{
  translate:0 -100%;
  opacity: 0;
  visibility: hidden;
  
}
/*main
=====================================*/
main {
  flex: 1;
}
.inner {
  width: min(1280px, 100%);
  margin-left: auto;
  margin-right: auto;
  padding-left: min(50px, 4vw);
  padding-right: min(50px, 4vw);
}
.inner.w-mid {
  width: min(1380px, 100%);
}
/*button*/
.play-round-button {
  width: var(--w-size);
  aspect-ratio: 1;
  display: grid;
  grid-template-columns: 25%;
  place-content: center;
  --hvr_move: 0px
}
.play-round-button .round {
  position: absolute;
  inset: 0;
  animation: rotate 20s linear infinite;
}
.play-round-button .arrow {
  translate: 20% 0;
}
.play-round-button svg {
  fill: currentColor;
}
.play-round-button:hover {
  --hvr_move: 15%;
}
@keyframes rotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.item-tag {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  color: var(--wall-blk);
  -ms-align-items: baseline;
  align-items: baseline;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  -o-flex-wrap: wrap;
  flex-wrap: wrap;
  padding: 5px .75em;
  gap:5px min(3em,6vw);
}
.item-tag::before {
  content: "";
  position: absolute;
  inset: 0;
  background-color: var(--clr-wht);
}
.item-tag .disc-data{
  margin-left: auto;
}
/*#hero
============================*/
.hero-main{
  padding-top: var(--head-h);
}
.hero-slide-wrap {
  width: 100%;
  overflow: hidden;
}
#hero-wall-slider {
  height: 710px;
}
.hero-wall-item figure, .hero-movie-item figure {
  width: 100%;
  height: 100%;
  overflow: hidden;
  isolation: isolate;
}
.hero-wall-item figure img, .hero-movie-item figure img {
  object-fit: cover;
  height: 100%;
  object-position: center;
}
.hero-wall-item figure img {
  filter: blur(5px);
  scale: 1.05;
}
#hero-movie-slider {
  z-index: 2;
  position: absolute;
  width: min(900px, calc(100vw - min(100px, 8vw)));
  top: 50%;
  left: 50%;
  translate: -50% -50%;
}
.hero-movie-item {
  scale: .85;
  transform-origin: center;
  transition: scale .6s var(--easing);
  display: flex;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -ms-align-items: flex-start;
  align-items: flex-start;
  gap: 10px;
}
.swiper-slide-active .hero-movie-item {
  scale: 1;
  transition: scale .6s var(--easing);
}
.hero-movie-item figure {
  box-shadow: 0 10px 20px rgba(0, 0, 0, .6);
  border-radius: 10px;
  aspect-ratio: 1/0.6122;
}
.hero-movie-item .play-round-button {
  --w-size: min(120px, 20vw);
  position: absolute;
  right: 0;
  bottom: 0;
  translate: 40% 25%;
  opacity: 0;
  visibility: hidden;
  transition: opacity .3s var(--easing), visibility .3s var(--easing);
  transition-delay: 1s;
  mix-blend-mode: difference;
}
.swiper-slide-active .hero-movie-item .play-round-button {
  opacity: 1;
  visibility: visible;
  
}
.hero-movie-item .item-tag {
  font-size: min(18px, 4vw);
  opacity: 0;
  transition: opacity var(--transit);
  transition-delay: 1s;
}

.hero-movie-item .item-tag .date {
  font-size: min(12px, 3vw);
  font-family: var(--fnt-en);
}
.hero-movie-item .item-tag::before {
  scale: .25 1;
  transition: scale var(--transit);
  transition-delay: 1s;
  transform-origin: left center;
}
.swiper-slide-active .hero-movie-item .item-tag {
  opacity: 1;
}
.swiper-slide-active .hero-movie-item .item-tag{
  opacity: 1;
  
}
.swiper-slide-active .hero-movie-item .item-tag::before {
  scale: 1 1;
}
/*#index content 
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
.index-contents {
  padding-top: min(120px, 15vw);
  padding-bottom: min(120px, 15vw);
  display: grid;
  grid-template-columns: 100%;
  gap: min(120px, 12vw);
  -ms-align-items: flex-start;
  align-items: flex-start;
}
.lead-text {
  font-kerning: none;
  line-height: calc(32/16);
}
.in-text {
  font-kerning: none;
  line-height: calc(28/16);
}
.lead-text.cnt, .in-text.cnt {
  text-align: center;
}
/*title settings*/
.sec-title {
  font-family: var(--fnt-en);
  font-size: var(--head2);
  letter-spacing: -0.01em;
}
.inner-wrapper {
  width: min(1540px, 100%);
  padding-left: min(50px, 4vw);
  padding-right: min(50px, 4vw);
  margin-left: auto;
  margin-right: auto;
}
.sec-title.vart {
  writing-mode: vertical-rl;
  transform: scale(-1, -1);
  text-align: end;
}
.arrow-title {
  fill: var(--clr-wht);
  display: grid;
  grid-template-columns: .5em auto;
  justify-content: flex-start;
  -ms-align-items: center;
  align-items: center;
  font-size: var(--head3_min);
  gap: .5em;
  font-weight: 600;
  letter-spacing: .2em;
}
.index-vart-wrapper {
  display: flex;
  gap: min(50px, 5vw) min(80px, 5vw);
  padding-right: min(130px, 8vw);
}

/*button settiings*/
.button-wrap{
  display: flex;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -ms-align-items: center;
  align-items: center;
}
.button-wrap.ai-end{
  -ms-align-items: flex-end;
  align-items: flex-end;
}
.button-more a{
  display: grid;
  grid-template-columns: auto min(18px,4vw);
  fill:currentColor;
  -ms-align-items: center;
  align-items: center;
  gap:1em;
  font-family: var(--fnt-en);
  letter-spacing: .025em;
  --hvr_move: 0px;
  justify-content: flex-start;
}
.button-more a .arw{
  translate:0 0;
  transition:translate var(--transit);
}
.link-more{
  padding-bottom: .5em;
  letter-spacing: .05em;
}
.link-more span{
  font-family: var(--fnt-en);
  padding-right: 2em;
  line-height: 1;
}
.link-more span::before
,.link-more span::after{
  content: "";
  width: .3em;
  aspect-ratio:1;
  border: 1px solid;
  border-color: currentColor currentColor transparent transparent;
  position: absolute;
  right: 0;
  top: 50%;
  rotate:45deg;
  transform-origin: left center;
  translate:0 -50%;
  
}
.link-more span::after{
  right: .5em;
  transition:translate var(--transit);
}
.link-more::before
,.link-more::after{
  content: "";
  width: 100%;
  height: 1px;
  
  position: absolute;
  left: 0;
  bottom: 0;
}
.link-more::before{
  background-color: var(--clr-gry);
}
.link-more::after{
  background-color: currentColor;
  scale:0 1;
  transition:scale var(--transit);
  transform-origin: left center;
}
@media(hover){
  .button-more a:hover{
    --hvr_move: 15%;
  }
  .button-more a:hover .arw{
    translate:25% 0;
  }
  .link-more:hover::after{
    scale:1 1;
  }
  .link-more:hover span::after{
    translate:115% -50%;
  }
}
/*index aboutus +++++++++++++++++++++++++++++++++*/
.box-index-about {
  display: grid;
  grid-template-columns: 100%;
  gap: 2em;
  -ms-align-items: flex-start;
  align-items: flex-start;
}
.box-index-about .comment{
  width: min(70em,100%);
  line-height: calc(28 / 16);
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  letter-spacing: .05em;
  gap:1em;
}
.sns-link-list {
  display: flex;
  -ms-align-items: center;
  align-items: center;
  justify-content: flex-end;
  gap: 1em;
}
.sns-link-list a {
  width: min(21px, 10vw);
  aspect-ratio: 1;
}
.sns-link-list a img {
  object-fit: contain;
  height: 100%;
  object-position: center;
}
/*index discography*/
.index-disco-blc .button-wrap{
  padding-left: min(50px,4vw);
  padding-right: min(50px,4vw);
}
.index-disco-blc .button-wrap .button-more{
  border: 1px solid;
  border-color: #000 currentColor currentColor;
  background-color: #000;
  margin-top: -1px;
}
.index-disco-blc .button-wrap .button-more a{
  padding: 0 1.5em 10px 2em;
}
.index-disco-wrapper {
  gap: min(50px, 5vw) min(40px, 4vw);
}
.index-disco-wrapper::before
,.index-disco-wrapper::after{
  content: "";
  position: absolute;
  width: 100vw;
  height: 1px;
  background-color: #fff;
  left: 50%;
  translate:-50% 0;
}
.index-disco-wrapper::before{
  top: -1px;
}
.index-disco-wrapper::after{
  bottom: 0;
}
.box-index-disco {
  padding-top: min(80px, 12vw);
  padding-bottom: min(80px, 12vw);
  padding-right: min(50px, 8vw);
  padding-left: min(40px, 4vw);
  width: 100%;
  border-left: 1px solid;
}
.box-index-disco::before {
  content: "";
  position: absolute;
  width: 100vw;
  height: 100%;
  top: 0;
  left: 0;
  background-color: #000;
}
.index-disco-blc .sec-title {
  padding-top: min(90px, 8vw);
  padding-bottom: min(90px, 8vw);
  text-align: center;
}
#disco-slider {
  width: 100%;
  overflow: hidden;
}
.disco-slide-item {
  display: grid;
  grid-template-columns: min(480px, 45%) auto;
  grid-template-rows: auto 1fr;
  gap: min(50px, 4vw) min(50px, 6vw);
}
.disco-slide-item .thumb-area{
  padding-bottom: min(20px,5vw);
  grid-row: span 2;
}
.disco-slide-item .thumb-area figure {
  aspect-ratio: 1;
  border-radius: 3px;
  overflow: hidden;
  isolation: isolate;
}
.disco-slide-item .thumb-area figure img {
  object-fit: cover;
  height: 100%;
  object-position: center;
}
.disco-slide-item .thumb-area .play-round-button{
  --w-size:min(120px, 30%);
  position: absolute;
  right: 0;
  bottom: 0;
  translate:10% 0;
  mix-blend-mode: difference;
}
.disco-slide-item .data-area {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -ms-align-items: flex-start;
  align-items: flex-start;
  gap: min(40px, 7vw);
}
.disco-slide-item .disc-head {
  gap:5px min(4em, 20vw);
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  justify-content: flex-start;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  -o-flex-wrap: wrap;
  flex-wrap: wrap;
}
.disco-slide-item .disc-head .title {
  font-size: min(18px, 4vw);
}
.disco-slide-item .disc-head .disc-data {
  display: flex;
  font-size: min(12px, 3.2vw);
  font-family: var(--fnt-en);
  gap:1em;
  margin-left: auto;
}
.link-button-set {
  --gap: 6px;
  margin-top: auto;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  justify-content: flex-end;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  -o-flex-wrap: wrap;
  flex-wrap: wrap;  
  gap: var(--gap);
  letter-spacing: .05em;
  text-indent: .05em;  
}
.link-button-set a {
  border: 1px solid;
  font-family: var(--fnt-titu);
  font-size: min(16px, 4vw);
  display: grid;
  place-content: center;
  height: 1.8em;
  border-radius: 2px;
  min-width: 5em;
  background-color: var(--clr-wht);
}
.disco-slide-item.link-button-set{
  margin-left: auto;
}
.disco-slide-item .link-button-set a{
  background-color: var(--wall-gry);
}
@media(hover){
  .disco-slide-item .link-button-set a:hover{
    filter: brightness(1.75);
  }
}
.disco-slide-item .credit-list > li {
  font-size: min(16px, 3.6vw);
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  gap:5px 1.5em;
  line-height: calc(24/16);
}
.credits-other{
  line-height: calc(24/16);
  flex: 1;
}
.disco-slide-item .credit-list > li:nth-child(n+2) {
  margin-top: 1.5em;
}
.disco-slide-item .credit-list > li > p:nth-child(2)::before{
  content: ":";
  position: absolute;
  left: -.75em;
  top: 0;
  translate:-50% 0;
}
.disco-navgation {
  position: absolute;
  width: 97%;
  top: 50%;
  left: 50%;
  translate: -50% -50%;
  z-index: 1;
  pointer-events: none;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  justify-content: flex-start;
}
button.swiper-button-disabled {
  opacity: 0;
  visibility: hidden;
  transition: opacity var(--transit), visibility var(--transit);
}
.disco-navgation button {
  width: min(35px, 8vw);
  fill: currentColor;
  pointer-events: auto;
  --hvr_move: 0px;
}
.disco-button-next {
  margin-left: auto;
}
.disco-button-prev {
  scale: -1 1;
/*  translate: 35% 0;*/
}
.disco-navgation button:hover {
  --hvr_move: 15%;
}
.disco-slide-item .data-area .link-more{
  margin-left: auto;
  margin-top: auto;
}
/*index information +++++++++++++++++++++++++++++++++*/
.index-info-blc .acv-info-list{
  margin-top: min(25px,5vw);
}
.acv-post-item{
  display: grid;
  grid-template-columns: auto auto 1fr;
  gap:min(50px,5vw);
  -ms-align-items: center;
  align-items: center;
  border-bottom: 1px solid var(--clr-gry);
  padding-bottom: min(25px,5vw);
  padding-top: min(25px,5vw);
  translate:0 0;
   transition:translate var(--transit);
}
.acv-post-item::after{
  content: "";
  width: 100%;
  height: 1px;
  position: absolute;
  bottom: -1px;
  left: 0;
  background-color: #fff;
  transform-origin: left center;
  scale:0 1;
  transition:scale var(--transit);
}
.acv-post-item .post-date{
  display: grid;
  grid-template-columns: auto auto;
  font-family: var(--fnt-en);
  place-content:center;
  place-items:center;
  gap:0 5px;
  color: var(--clr-gry);
}
.acv-post-item .post-date .date_day{
  grid-column: span 2;
  font-size: 4em;
  letter-spacing: .05em;
  text-indent: .05em;
}
.post-category{
  text-align: center;
  font-family: var(--fnt-en);
}
.acv-post-item .post-title{
  line-height: calc(20/14);
}

@media(hover){
  .acv-post-item:hover{
    translate:min(30px,3vw) 0;
  }
  .acv-post-item:hover:after{
    scale:1 1;
  }
}
.index-info-blc .button-wrap{
  margin-top: min(25px,4vw);
}

/*footer
=====================================*/
footer {
  background-color: #000;
  padding: 20px;
  color: var(--clr-wht);
}
footer p.copy {
  text-align: center;
  font-size: min(12px, 3vw);
  font-family: var(--fnt-en);
}