/*====================
TOP PAGE
====================*/
.page-contents.top{
  padding-top: 0;
}
.top__mv{
  background-image: url(../images/top_mv_bg-light.png);
  background-repeat: no-repeat;
  position: relative;
}
.top__mv h1{
  padding-bottom: 0.125em;
  width: max-content;
  color: transparent;
  background: var(--color) url(../images/common/title_text-light.png) no-repeat top -0.625em right -10%;
  background-size: 1.25em auto;
  font-family: var(--roman-font);
  font-weight: 500;
  line-height: 0.875;
  letter-spacing: -0.02em;
  background-clip: text;
  -webkit-background-clip: text;
}
.top__mv p{
  font-weight: bold;
}
@media (orientation: portrait) {
  .top__mv{
    height: 100svh;
    box-sizing: border-box;
    align-content: center;
    background-position: top 0 right -25vw;
    background-size: 87.5vw auto;
  }
  .top__mv h1{
    margin-top: 1.5em;
    font-size: 13.5vw;
  }
  .top__mv p{
    margin-top: 1em;
    margin-right: -1em;
    font-size: 3.25vw;
  }
}
@media (orientation: landscape) {
  .top__mv{
    padding-top: 32.5vh;
    padding-bottom: calc(var(--margin) * 24);
    background-position: top 0 right -7.5vw;
    background-size: 42.5vw auto;
  }
  .top__mv h1{
    font-size: 7.875vw;
  }
  .top__mv p{
    margin-top: 3em;
    margin-left: 1em;
    font-size: 0.875vw;
  }
}
.top__mv__news{
  padding: 1.25em 7.75vw 1.25em 2.5em;
  border-top-left-radius: 3.75em;
  border-bottom-left-radius: 3.75em;
  box-sizing: border-box;
  box-shadow: 0 0 15px rgba(0,0,0, 0.12);
  background: var(--bgcolor-light);
  position: absolute;
  bottom: calc(var(--margin) * 4.5);
  right: 0;
}
.top__mv__news h2{
  margin-right: 0.5em;
  padding-right: 0.5em;
  border-right: var(--border);
  display: inline-block;
  color: var(--color-brand);
  font-size: 1.125em;
  font-family: var(--roman-font);
  font-weight: 600;
}
.top__mv-news__wrapper{
  position: absolute;
  overflow: hidden;
}
.top__mv__news ul{
  width: 100%;
  position: relative;
}
.top__mv__news li{
  width: 100%;
  display: none;
}
.top__mv__news dl{
  font-size: 0.8125em;
  line-height: 1.6;
  letter-spacing: var(--spacing-narrow);
}
.top__mv__news dd a{
  color: var(--color);
  transition: .3s color;
}
.top__mv__news dd a:hover{
  color: var(--color-brand);
}
.top__mv__news .catName{
  display: none;
}
@media (width < 737px) {
  .top__mv__news{
    width: 96%;
    height: 5.75em;
  }
  .top__mv__news h2{
    line-height: 1;
  }
  .top__mv-news__wrapper{
    width: 86%;
    top: 1.625em;
    left: 2.5em;
    overflow: hidden;
  }
  .top__mv__news dt{
    width: 6em;
    padding-left: 6em;
  }
  .top__mv__news dd{
    margin-top: 0.25em;
  }
}
@media (737px <= width) {
  .top__mv__news{
    padding: 1.25em 7.75vw 1.25em 2.5em;
    border-top-left-radius: 3.75em;
    border-bottom-left-radius: 3.75em;
    width: 32.5em;
    position: absolute;
    bottom: calc(var(--margin) * 7);
    right: 0;
  }
  .top__mv__news h2{
    margin-right: 0.5em;
    padding-right: 0.5em;
    border-right: var(--border);
    display: inline-block;
    font-size: 1.125em;
  }
  .top__mv-news__wrapper{
    width: 20em;
    position: absolute;
    top: 1.125em;
    left: 7.5em;
    overflow: hidden;
  }
}
/*statement*/
.top__statement{
  border-radius: var(--radius-large);
  color: var(--color-light);
  background-color: var(--color-brand);
  background-image: url(../images/top_statement-bg-light.png), var(--bgpattern-brand);
  background-repeat: no-repeat, repeat;
  background-position: top -80vh right -90%, top left;
  position: relative;
}
.top__statement__bg{
  width: 82.5%;
  max-width: 780px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 1;
}
.top__statement .l-inner{
  position: relative;
  z-index: 5;
}
.top__statement__title{
  margin-left: 1.25%;
  line-height: 1.6;
}
.top__statement__title::before{
  content: attr(data-title);
  display: block;
  margin-bottom: 2em;
  margin-left: -1.5em;
  padding-left: 1.5em;
  background: url(../images/common/icon-o-white.svg) no-repeat left center;
  background-size: 1em auto;
  font-size: 0.5em;
  font-family: var(--roman-font);
  font-weight: 600;
  letter-spacing: var(--spacing-narrow);
}
.top__statement h2{
  font-size: 1.75em;
}
.top__statement__text{
  margin-top: calc(var(--margin) * 7);
  font-weight: 600;
  line-height: 2.5;
}
@media (width < 737px) {
  .top__statement{
    padding-top: calc(var(--margin) * 15);
    padding-bottom: 18.5em;
  }
  .top__statement__text br{
    display: none;
  }
}
@media (737px <= width) {
  .top__statement__title{
    margin-left: var(--inner-padding);
  }
  .top__statement h2{
    font-size: 2.25em;
  }
  .top__statement__text{
    margin-right: 3.75%;
    margin-left: auto;
    width: 33.5em;
    font-size: 1.125em;
  }
}
@media (737px <= width < 1280px) {
  .top__statement{
    padding-top: calc(var(--margin) * 22);
    padding-bottom: 7.5em;
  }
}
@media (1280px <= width) {
  .top__statement{
    padding-top: calc(var(--margin) * 22);
    padding-bottom: calc(var(--margin) * 33.5);
  }
  .top__statement__title{
    margin-left: 5em;
  }
}
.top__statement__image01{
  position: absolute;
  z-index: 4;
}
.top__statement__image02{
  position: absolute;
  z-index: 3;
}
@media (width < 737px) {
  .top__statement__image01{
    width: 38.5%;
    bottom: 12.5em;
    right: 5.5%;
    z-index: 2;
  }
  .top__statement__image02{
    width: 17.5em;
    bottom: -7.5em;
    left: var(--inner-padding-wider);
  }
}
@media (737px <= width < 1280px) {
  .top__statement__text{
    margin-right: 0;
    width: 45vw;
  }
  .top__statement__text br{
    display: none;
  }
  .top__statement__image01{
    width: 32.5vw;
    top: calc(var(--margin) * 10.5);
    right: var(--inner-padding);
  }
  .top__statement__image02{
    width: 40vw;
    bottom: calc(var(--margin) * -12.5);
    left: 0;
  }
}
@media (1280px <= width) {
  .top__statement__image01{
    width: 25.5vw;
    top: calc(var(--margin) * 13.5);
    right: 10.875vw;
  }
  .top__statement__image02{
    width: 31.75vw;
    bottom: calc(var(--margin) * -10);
    right: 57.5vw;
  }
}
/*Business*/
.top__business{
  margin-top: calc(var(--margin) * 36);
}
.top__business__summary{
  letter-spacing: var(--spacing-narrow);
}
.top__business__list{
  margin-top: calc(var(--margin) * 10);
}
.top__business__list>li{
  padding-top: 6.875em;
  padding-bottom: 2em;
  padding-inline: calc(var(--inner-padding) * 2);
  border-radius: 2em;
  background: var(--bgcolor-light);
}
.top__business__list>li:not(:first-child){
  margin-top: calc(var(--margin) * 3.2);
}
.top__business__list>li h3{
  font-size: 1.375em;
  font-weight: bold;
}
.top__business__list>li p{
  margin-top: 0.5em;
  font-size: 0.9375em;
  letter-spacing: var(--spacing-narrow);
}
.top__business__list>li{
  background-repeat: no-repeat;
  background-position: center 2.5em;
  background-size: 5.25em auto;
}
.top__business__list>li:first-child{
  background-image: url(../images/top_pharmacy.svg);
}
.top__business__list>li:nth-child(2){
  background-image: url(../images/top_mimamori.svg);
}
.top__business__list>li:nth-child(3){
  background-image: url(../images/top_grouphome.svg);
}
@media (width < 737px) {
  .top__business__summary{
    margin-top: 1em;
  }
  .top__business__list>li h3{
    margin-top: 1em;
  }
  .top__business__list .s-btn--egg{
    width: 2em;
    margin-right: -1em;
    margin-left: auto;
  }
  .top__business__list .s-btn--egg svg{
    width: 0.75em;
  }
}
@media (737px <= width) {
  .top__business{
    margin-top: calc(var(--margin) * 24);
  }
  .top__business__list>li{
    display: flex;
    justify-content: space-between;
    padding: 6.875em 2.75em 6.875em 22.5%;
    background-position: 8.6% center;
    background-size: 5.25em auto;
  }
  .top__business__list>li h3{
    font-size: 1.75em;
  }
}
@media (737px <= width < 1280px) {
  .top__business__list>li{
    padding: 4.375em 6.25% 4.375em 22%;
    background-position: 7% center;
    background-size: 5em auto;
  }
  .top__business__list>li .text-wrapper{
    margin-right: 1em;
  }
}
@media (1280px <= width) {
  .top__business__title{
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .top__business__list>li{
    padding: 6.875em 4.375em 6.875em 22.5%;
  }
}
/*Recruit*/
.top__recruit{
  margin-top: calc(var(--margin) * 16);
  padding-block: calc(var(--margin) * 12);
  border-radius: var(--radius-large);
  color: var(--color-light);
  background: var(--color-brand);
  background-size: cover;
  position: relative;
  overflow: hidden;
}
.top__recruit__content{
  z-index: 5;
  position: relative;
}
.top__recruit__text{
  margin-top: calc(var(--margin) * 5);
}
.top__recruit__text h3{
  margin-block: var(--leading-trim);
  font-size: 1.875em;
  font-weight: bold;
  line-height: 1.6;
}
.top__recruit__text p{
  font-size: 0.9375em;
  font-weight: 400;
  letter-spacing: 0;
}
.top__recruit__text h3+p{
  margin-top: calc(var(--margin) * 5.5);
}
.top__recruit__btn{
  margin-top: calc(var(--margin) * 4);
  font-size: 0.875em;
  text-align: right;
}
@media (737px <= width) {
  .top__recruit__text{
    margin-top: calc(var(--margin) * 2.5);
    margin-right: 0;
    margin-left: auto;
    width: 35em;
  }
  .top__recruit__text h3{
    font-size: 1.875em;
  }
}
.top__recruit__bg{
  display: flex;
  transform: rotate(-20deg);
  z-index: 1;
  position: absolute;
  top: -10%;
  left: -25%;
  .bg-line{
    margin-left: 1.25em;
    flex-basis: 57vw;
    flex-shrink: 0;
  }
  .bg-line:nth-of-type(odd){
    animation: slideUpReverse 10s linear infinite;
  }
  .bg-line:nth-of-type(even){
    animation: slideUp 10s linear infinite;
  }
  .bg-line>ul:nth-of-type(2){
    animation-delay: 5s;
  }
  .bg-line li{
    margin-top: 1.25em;
  }
  &::after{
    content: "";
    display: block;
    width: 200%;
    height: 200%;
    background: url(../images/rec_bg-translucent.png);
    position: absolute;
    top: -20%;
    left: -20%;
  }
  @media (737px <= width) {
    top: -25%;
    left: 20%;
    .bg-line{
      flex-basis: 32.5vw;
    }
    .bg-line:nth-of-type(odd){
      animation: slideUp 20s linear infinite;
    }
    .bg-line:nth-of-type(even){
      animation: slideUpReverse 20s linear infinite;
    }
    .bg-line>ul:nth-of-type(2){
      animation-delay: 20s;
    }
  }
}
@keyframes slideUp {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-50%);
  }
}
@keyframes slideUpReverse {
  0% {
    transform: translateY(-50%);
  }
  100% {
    transform: translateY(0);
  }
}
/*news*/
.top__news{
  margin-top: calc(var(--margin) * 14);
  margin-bottom: calc(var(--margin) * 13);
}
.top__news h2{
  pointer-events: none;
}
.top__news .sec-title::after{
  font-size: 3.25em;
}
.top__news__list{
  margin-top: calc(var(--margin) * 5);
}
.top__news__list>li{
  border-top: var(--border);
}
.top__news__list>li>dl{
  padding-block: calc(var(--margin) * 5);
  background: url(../images/common/icon-arrow-teal.svg) no-repeat center right;
  background-size: 1em auto;
  letter-spacing: var(--spacing-narrow);
}
.top__news__list dt{
  font-family: var(--number-font);
}
.top__news__list dd{
  padding-right: 2.5em;
}
.top__news__list dd a{
  color: var(--color);
}
.top__news__list dd a:hover{
  color: var(--color-brand);
}
.top__news__list .catName{
  display: none;
}
.top__news__archive{
  margin-top: 1em;
}
.top__news__archive a{
  display: inline-block;
  padding-right: 1.25em;
  color: var(--color-brand);
  background: url(../images/common/icon-arrow-teal) no-repeat right 0 bottom 0.5em;
  background-size: 0.75em auto;
}
@media (737px <= width) {
  .top__news.flex-wrapper{
    display: flex;
    justify-content: space-between;
  }
  .top__news__title{
    flex-basis: 25%;
  }
  .top__news__list{
    flex-basis: 75%;
  }
  .top__news__list>li>dl{
    display: flex;
  }
  .top__news__list dd{
    margin-left: 2.625em;
  }
  .top__news .sec-title::after{
    font-size: 5em;
  }
}
.top footer{
  margin-top: calc(var(--margin) * 12);
}
/*animation*/
.page-contents{
  width: 100%;
  position: relative;
  overflow: hidden;
}
.top__mv, .top__statement, .top__business, .top__news, footer{
  position: relative;
  z-index: 100;
}
.mv__bg{
  position: absolute;
  top: 0;
  left: 50%;
}
.bg-circle-larger{
  height: auto;
  aspect-ratio: 1/1;
  pointer-events: none;
  animation: spinReverse 20s linear infinite;
}
@media (orientation: portrait) {
  .mv__bg{
    transform: translate(-12.5%,-46.5%);
  }
  .bg-circle-larger{
    width: 89.5vh;
  }
}
@media (orientation: landscape) {
  .mv__bg{
    transform: translate(-12.5%,-57.5%);
  }
  .bg-circle-larger{
    width: 138vh;
  }
}
.bg-circle{
  margin: auto;
  pointer-events: none;
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
  transition: opacity 3s;
  z-index: 1;
}
.bg-circle p{
  position: absolute;
}
.bg-circle p:first-of-type{
  animation: spin 13s linear infinite;
}
.bg-circle p:nth-of-type(2){
  animation: spin 8s linear infinite;
}
.bg-circle p:nth-of-type(3){
  animation: spin 5s linear infinite;
}
@media screen and (orientation: portrait) {
  .bg-circle{
    width: 72.5vw;
    aspect-ratio: 1/1;
  }
}
@media screen and (orientation: landscape) {
  .bg-circle{
    height: 86vh;
    aspect-ratio: 1/1;
  }
}
@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes spinReverse {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(-360deg);
  }
}
.page-contents.is-secBlue{
  >.contents__bg{
    opacity: 0;
  }
}
.top__statement{
  transition: opacity 4s;
}
.top__statement.is-hidden{
  opacity: 0;
}
.scrollUpTrigger{
  transition-property: opacity transform;
  transition: 1.2s;
  transition-duration: 4s;
  transition-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
}
.scrollUpTrigger.is-hidden{
  opacity: 0;
  transform: translateY(5em);
}