:root {--boradius:2rem;}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {font-weight: 300;}
h1 {line-height:1;}
h2 {line-height:1.2;}
h3 {line-height:1.3;}
h4 {line-height: 1.4;}
h5 {line-height: 1.5; font-size: 1.2rem;}
h6 {line-height: 1.5;}

.cover .top:before {background-image: url("cover-seal.png");}

.border {border-color:var(--primary) !important; border-radius: var(--boradius);}
[class*='frame-'] {position: relative; overflow: unset;}
[class*='frame-']:before, .frame-top-bottom:before {-webkit-mask-image: url('png-frame.png'); mask-image: url('png-frame.png'); -webkit-mask-size: contain; mask-size: contain; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center; mask-position: center; background-color: var(--primary); content:""; display: block; width:10rem; height: 4rem; top: -3.5rem; position: absolute; left: 50%; transform: translateX(-50%); opacity:.5;}
.frame-bottom:before, .frame-bottom-top:before {top: auto; bottom: -3.5rem; transform: translateX(-50%) scale(-1);}
.bg-primary [class*='frame-']:before {background-color: var(--light);}
[class*='frame-']:is(.border-light, .frame-light):before {background-color: var(--light);}

.hero {margin-bottom: -1px;}
.hero .block-image.main {position: -webkit-sticky; position: sticky; top:0; inset:0; z-index: 1; min-height: 100vh;}
.hero .block-image.main img {height: 100%; width: 100%; min-height: inherit;}
.hero .block-image.main img.mob {display: none;}
.hero .block-image.main img {transition: 1s all; transform-origin: bottom;}
.hero:hover .block-image.main img {transform:scale(2);}
.hero ~ div {z-index: 5;}

.mt--100vh {margin-top: -100vh;}
.mt--50vw {margin-top: -50vw;}
.pb-50vh {padding-bottom: 50vh;}

@media (max-width:767px) {

  .hero .block-image.main img.mob {display: block;}
  .hero .block-image.main img.pc {display: none;}

  .frame-top {margin-top: 4rem;}
  .frame-top-bottom:before {top: auto; bottom: -3rem; transform: translateX(-50%) scale(-1);}
  .frame-bottom-top:before {top: -3rem; bottom: auto; transform: translateX(-50%);}

  .mt--50vw {margin-top: -60vh !important;}

}
