:root {
  --purple: #04328D;
  --blue:#0171D1;
  --green:#019B89;
  --red:#EE3C16;
}

/* topページ */

.p-sub-mv3{
  background-image: linear-gradient(180deg, rgba(151, 215, 255, 1), rgba(255, 255, 255, 1));
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  position: relative;
  padding-bottom: 20rem;
  padding-top: 8rem;
  text-align: center;
  font-family: "Noto Sans JP", sans-serif;
}

.p-sub-mv3::before{
  content: "";
  width: 100%;
  position: absolute;
  height: 100%;
  bottom: 0;
  left: 0;
  background-image: url(../img/rules/mv3-background-bottom.svg);
  background-position: bottom;
  background-repeat: no-repeat;
  background-size: cover;
  z-index: 1;
}

.p-sub-mv3 h3,h1{
 color: var(--purple);
 font-weight: 900;
 text-shadow:1px 1px 0 #fff, -1px 1px 0 #fff, -1px -1px 0 #fff, 1px -1px 0 #fff;
 margin-left: 2rem;
 margin-right: 2rem;
 z-index: 2;
 position: relative;
}

.p-sub-mv3 h3{
  font-size: 3.5rem;
}

.p-sub-mv3 h1{
  font-size: 7.2rem;
  text-stroke: 5px #FFF;
}

.p-sub-mv3__human{
  position: absolute;
  z-index: 1;
  bottom: 0;
  width: 15%;
  min-width: 140px;
  max-width: 300px;
}

.p-sub-mv3__human.user{
  left: 6rem;
}

.p-sub-mv3__human.worker{
  right: 6rem;
}

@media screen and (max-width: 769px) {
  .p-sub-mv3{
    padding-bottom: 18rem;
    padding-top: 5rem;
    text-align: center;
  }
  
  .p-sub-mv3 h3{
    font-size: 2rem;
  }
  
  .p-sub-mv3 h1{
    font-size: 4rem;
    text-stroke: 5px #FFF;
    line-height: 1.3em;
  }
  
  .p-sub-mv3__human.user{
    left: 0rem;
  }
  
  .p-sub-mv3__human.worker{
    right: 0rem;
  }
  
}

.l-header__nav-box.__rules{
  background-color: var(--purple);
  position: static;
}

.l-header__nav-box.__rules .l-header__nav{
  gap: 3rem;
  justify-content: space-around;
}

.l-header__nav-box.__rules .l-header__nav__item{
  color: #ffffff;
  padding: 1rem 0;
  border-radius: 0;
}

.l-header__nav-box.__rules .l-header__nav__item.l-header__nav__item__current-page{
  border-bottom: #ffffff solid 3px;
}

.l-header__nav-box.__rules .l-header__nav__item__hover-anim {
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  height: 100%;
  place-content: center;
  padding: 1rem 0;
  border-radius: 0;
  border-bottom: 3px solid transparent;
}

.l-header__nav-box.__rules .l-header__nav__item__hover-anim:hover {
  color: #ffffff;
  border-radius: 0;
  padding: 1rem 0;
  height: 100%;
  border-bottom: #ffffff solid 3px;
  background-color: inherit;
}

@media screen and (max-width: 960px){
  .l-header__nav-box.__rules{
    display: block;
    overflow: scroll;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
  
  .l-header__nav-box.__rules::-webkit-scrollbar{
    display: none;
  }
  
  .l-header__nav-box.__rules .l-header__nav {
    gap: 2rem;
    min-width: 658px;
  }
}

.p-sub{ 
  max-width: 113rem;
  margin: 0 auto;
  padding: 0 1.6rem;
  font-family: "Noto Sans JP", sans-serif;
}   

.p-sub-feature{
  text-align: center;
  font-weight: bold;
  margin: 6rem 0;
}

.p-sub-feature__container{
  display: grid ;
  grid-template-columns: repeat(2, 1fr);
  gap: 2rem;
  margin-bottom: 6rem;
}

.p-sub-feature__container p{
  color: var(--purple);
  font-size: 2rem;
  border: 4px solid var(--purple);
  margin: auto;
  padding: 2rem 3rem;
  border-radius: 2rem;
  width: 70%;
}

.p-sub-feature__container p span{
  font-size: 3rem;
}

.p-sub-feature__container img{
  object-fit: contain;
  object-position: bottom;
  position: relative;
}

.p-sub-feature__container{
  display: grid ;
  grid-template-columns: repeat(2, 1fr);
  gap: 2rem;
}

.p-sub-feature__user{
  display: grid ;
  grid-template-columns: 2fr 1fr;
}

.p-sub-feature__user .user figcaption{
  color: #ffffff;
  background-color: var(--blue);
  padding: 1rem;
  font-size: 1.8rem;
  border-radius: 50rem;
  margin: -2rem auto;
  z-index: 1;
  position: relative;
  border: solid #ffffff 2px;
  max-width: 200px
}

.p-sub-feature__worker{
  display: grid ;
  grid-template-columns: 1fr 2fr;
}

.p-sub-feature__worker .worker figcaption{
  color: #ffffff;
  background-color: var(--green);
  padding: 1rem;
  font-size: 1.8rem;
  border-radius: 50rem;
  margin: -2rem auto;
  z-index: 1;
  position: relative;
  border: solid #ffffff 2px;
  max-width: 200px;
}

.p-sub-feature__word{
  line-height: 5rem;
  text-decoration: underline;
  text-underline-offset: .5rem;
  text-decoration-color: #C10000;
  text-decoration-thickness: .8rem;
  font-size: 2.8rem;
  text-align: center;
  font-weight: bold;
}

.no-line{
  font-size: 2.8rem;
  text-align: center;
  font-weight: bold;
}


@media screen and (max-width: 769px) {
  
  .p-sub-feature__container{
    margin-bottom: 4rem;
  }
  
  .p-sub-feature__user{
    grid-template-columns: 1fr;
    gap: 1rem;
    grid-template-rows: subgrid;
    grid-row: span 2;
  }
  
  .p-sub-feature__worker{
    grid-template-columns: 1fr;
    gap: 1rem;
    grid-template-rows: subgrid;
    grid-row: span 2;
  }
  
  .p-sub-feature__worker p{
    order: 1;
  }
  
  .p-sub-feature__worker figure{
    order: 2;
  }
  
  .p-sub-feature__container p{
    font-size: 1.6rem;
    padding: 1rem;
    border-radius: 2rem;
    width: 90%;
  }
  
  .p-sub-feature__container p span{
    font-size: 2.1rem;
  }
  
  .p-sub-feature__container img{
    max-width: 150px;
    min-width: 80px;
  }
  
  .p-sub-feature__word{
    line-height: 4rem;
    text-decoration-thickness: .5rem;
    font-size: 2.1rem;
  }
  
  
  .no-line{
    line-height: 4rem;
    text-decoration-thickness: .5rem;
    font-size: 2.1rem;
  }
}


.p-sub-select{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 3rem;
  margin-bottom: 6rem;
}

.p-sub-select__button{
  background-color: var(--purple);
  color: #ffffff;
  padding: 2rem;
  border-radius: 1rem;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: background-color;
}

.p-sub-select__button:hover{
  background-color: var(--red);
}

.p-sub-select__button h3{
  font-size: 2.8rem;
  position: relative;
  padding-left: 4.5rem;
  margin-bottom: 1rem;
}

.p-sub-select__button h3 .angle-icon {
  width: 3.2rem;
  height: 3.2rem;
  position: absolute;
  background-color: white;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  color: #05328C;
  font-size: 1.8rem;
  border-radius: 50%;
  left: 0;
  top: 50%;
  translate: 0 -50%;
}

@media screen and (max-width: 769px) {
  .p-sub-select{
    display: grid;
    grid-template-columns: 1fr;
    gap: 3rem;
  }
  
  .p-sub-select__button h3{
    font-size: 2.3rem;
  }
}


.p-sub-example{
  font-size: 2.8rem;
  color: var(--purple);
  border: solid 4px var(--purple);
  border-radius: 1rem;
  font-weight: bold;
  padding: 1rem 2rem;
  display: flex;
  margin-bottom: 3rem;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}

.p-sub-example:hover{
  color: #ffffff;
  border: solid 4px var(--purple);
  background-color: var(--purple);
}

.p-sub-example a{
  position: relative;
  padding-left: 4.5rem;
  display: block;
}

.p-sub-example a .angle-icon{
  width: 3.2rem;
  height: 3.2rem;
  position: absolute;
  background-color: var(--purple);
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  color:  white;
  font-size: 1.8rem;
  border-radius: 50%;
  left: 0;
  top: 0%;
  translate: 0 20%;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}

.p-sub-example:hover a .angle-icon {
  background-color:#ffffff;
}

.p-sub-example a span.angle-icon i.fa-angle-right {
  background-image: url(../img/icon_down_w.svg);
  width: 15px;
  height: 15px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  rotate: -90deg;
}

.p-sub-example:hover a span.angle-icon i.fa-angle-right {
  background-image: url(../img/icon_link.svg);
  rotate: 0deg;
}

.p-sub-example figure {
  margin: auto;
}

.p-sub-example .icon-data {
  background-image: url(../img/rules/icon-data.svg);
  width: 52px;
  height: 60px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  display: block;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}

.p-sub-example:hover .icon-data{
  background-image: url(../img/icon_law.svg);
  width: 52px;
  height: 60px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  display: block;
}

@media screen and (max-width: 769px) {
  .p-sub-example{
    font-size: 2.3rem;
    flex-direction: column-reverse;
    gap: 1rem;
    flex-wrap: wrap;
  }
}

.attention{
  text-align: center;
  font-weight: normal;
}

.attention p{
  text-align: left;
  display: inline-block;
}

.p-rules__tar{
  text-align: right;
  display: block;
}

@media screen and (max-width: 850px) {
  br {
      display: none;
    }
    
  em {
      font-style: normal;
      display: contents;
  }
  
  .sp-br{
    display: block;
  }
  
  .sp-em{
    display: inline-flex;
  }
}



/* subページ */

.p-sub-mv3.__small{
  padding: 3rem 6rem;
  text-align: left;
  width: auto;
  font-family: "Noto Sans JP", sans-serif;
}

.p-sub-mv3.__small h3,h1{
 color: var(--purple);
 font-weight: 900;
 text-shadow:1px 1px 0 #fff, -1px 1px 0 #fff, -1px -1px 0 #fff, 1px -1px 0 #fff;
 margin-left: 2rem;
 margin-right: 2rem;
}

.p-sub-mv3.__small h3{
  font-size: 1.8rem;
}

.p-sub-mv3.__small h1{
  font-size: 4rem;
  text-stroke: 5px #FFF;
}

@media screen and (max-width: 769px) {
  .p-sub-mv3.__small{
    padding: 3rem;
  }
  
  .p-sub-mv3.__small h3,h1{
   color: var(--purple);
   font-weight: 900;
   text-shadow:1px 1px 0 #fff, -1px 1px 0 #fff, -1px -1px 0 #fff, 1px -1px 0 #fff;
   margin-left: 0rem;
   margin-right: 0rem;
  }
  
  .p-sub-mv3.__small h3{
    font-size: 1.8rem;
    line-height: 2rem;
    margin-bottom: 2rem;
  }
  
  .p-sub-mv3.__small h1{
    font-size: 2.8rem;
    text-stroke: 5px #FFF;
    line-height: 3.6rem
  }
}

.rules-tit{
  font-size: 4rem;
  color: var(--purple);
  margin-top: 8rem;
  font-weight: bold;
  margin-bottom: 3rem;
}

.p-rules__back{
  background: linear-gradient(90deg, #C4E0F8 0%, #C4E0F8 50%, #BFEDCD 50%, #BFEDCD 100%);
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  position: relative;
  margin-bottom: 6rem;
}
.p-rules__back.img-non{
  padding-bottom: 8rem;
}

.p-rules__back::after{
  content: "";
  width: 100%;
  position: absolute;
  height: 100%;
  bottom: 0;
  left: 0;
  background-image: url(../img/rules/back-last.svg);
  background-position: bottom;
  background-repeat: no-repeat;
  background-size: contain;
}

@media screen and (min-width: 1500px) {
    .p-rules__back::after{
    bottom: -5rem;
  }
  
  
  .p-rules__back.last::after{
    bottom: 0rem;
  }
}

@media screen and (min-width: 1800px) {
    .p-rules__back::after{
    bottom: -6rem;
  }
}

.p-rules__inner{
  padding: 0 1.6rem;
  max-width: 113rem;
  margin-inline: auto;
  font-weight: bold;
  position: relative;
  z-index: 2;
}

.p-rules__inner.small{
  padding: 0 3rem 12rem;
}

.p-rules__tit{
  font-size: 3.2rem;
  color: #ffffff;
  background-color: var(--purple);
  border-radius:  0 0 1rem 1rem;
  padding: 3rem;
  text-align: center;
  margin-bottom: 3rem;
}

.p-rules__content{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10rem;
  row-gap: 3rem;
  justify-content: space-between;
  text-align: center;
  margin-bottom: 6rem;
}

.p-rurles__user, .p-rurles__worker{
  display: grid;
  gap: 3rem;
}

.p-rules__wrapper{
  display: grid;
  grid-template-columns: 1.5fr 3fr;
  gap: 1rem;
  justify-content: space-between;
  text-align: center;
}

.p-rules__wrapper div{
  margin: auto 0 0;
}

.p-rurles__worker .p-rules__wrapper{
  grid-template-columns: 3fr 1.5fr;
}

.p-rules__human{
  position: relative;
}

.p-rules__human figcaption{
  color: #ffffff;
  background-color: var(--blue);
  padding: .5rem;
  font-size: 1.8rem;
  border-radius: 50rem;
  margin: -2rem auto;
  z-index: 1;
  position: relative;
  border: solid #ffffff 2px;
  max-width: 200px
}

.p-rurles__worker> .p-rules__wrapper >div{
  order: 2;
}

.p-rurles__worker .p-rules__human figcaption{
  background-color: var(--green);
}

.p-rules__comment{
  align-content: center;
  background-color: #ffffff;
  position: relative;
  border-radius: 1rem;
  margin: auto 0;
  padding: 3rem;
}

.p-rurles__worker .p-rules__comment{
  order: 1;
}

.p-rurles__user .p-rules__comment::before{
  content: url(../img/rules/comment.svg);
  position: absolute;
  bottom: 0;
  left: 5%;
  translate: -30% 70%;
}

.p-rurles__worker .p-rules__comment::before{
  content: url(../img/rules/comment.svg);
  position: absolute;
  bottom: 0;
  right: 5%;
  translate: 30% 70%;
  scale: -1 1;
}

.p-rules__check{
  font-size: 2.4rem;
  background-color: #ffffff;
  border-radius: 100vw;
  padding: 2rem;
  border: solid 4px var(--blue);
  color: var(--blue);
  display: grid;
  place-content: center;
  align-items: center;
  gap: 1rem;
  grid-template-columns: .1fr 1.2fr;
}

.p-rurles__worker .p-rules__check{
  border: solid 4px var(--green);
  color: var(--green);
}

.p-rules__check::before {
  content: "";
  background-image: url(../img/rules/check-blue.svg);
  background-repeat: no-repeat;
  width: 4rem;
  height: 3rem;
  display: block;
}

.p-rurles__worker .p-rules__check::before {
  background-image: url(../img/rules/check-green.svg);
}

@media screen and (max-width: 769px) {
  .p-rules__inner.small{
    padding: 0 1.6rem 8rem;
  }
  
  .rules-tit{
    font-size: 2.8rem;
    margin-top: 4rem;
    margin-bottom: 2rem;
  }
  
  .p-rules__tit{
    font-size: 1.8rem;
  }
  
  .p-rules__content{
    grid-template-columns: 1fr;
    gap: 3rem;
    justify-content: space-between;
    margin-bottom: 3rem;
  }
  
  .p-rurles__user, .p-rurles__worker {
    gap: 2.5rem;
  }
  
  .p-rules__human{
    max-width: 150px;
    margin-inline: auto;
  }
  
  .p-rules__human figcaption{
    margin: -1rem auto;
  }
  
  .p-rules__check{
    font-size: 1.6rem;
    background-color: #ffffff;
    border-radius: 100vw;
    padding: 2rem;
    border: solid 4px var(--blue);
    color: var(--blue);
    place-content: center;
    align-items: center;
    gap: 1rem;
  }
}

.p-rules__imp{
  display: grid;
  gap: 3rem;
  grid-template-columns: .5fr 3fr;
  align-items: center;
  padding: 3rem ;
  background-color: #ffffff;
  border-radius: 2rem;
  margin-bottom: 6rem;
}

.p-rules__imp img{
  object-fit: contain;
}

.p-rules__imp .p-rules__list{
  font-size: 2rem;
  color: var(--red);
}

.p-rules__imp .p-rules__list li{
  text-indent: -1em;
  padding-left: 1em;
}

.p-rules__imp p{
  font-size: 2rem;
  color: var(--red);
}

@media screen and (max-width: 769px) {
  .p-rules__imp{
    grid-template-columns: 1fr;
    margin-bottom: 3rem;
  }
  
  .p-rules__imp figure{
    max-width: 15rem;
    margin-inline: auto;
  }
  
  .p-rules__imp p{
    font-size: 1.8rem;
    color: var(--red);
  }
  
  .p-rules__imp .p-rules__list{
    font-size: 1.8rem;
    color: var(--red);
  }

}

.p-rules__block{
  background-color: #ffffff;
  padding: 3rem 6rem 6rem;
  border-radius: 2rem;
  margin-bottom: 10rem;
}

.p-rules__block h3{
  font-size: 2.8rem;
  text-align: center;
  color: var(--purple);
  margin-bottom: 3rem;
}

.p-rules__block h5{
  font-size: 2rem;
}

.p-rules__tabletit{
  margin-bottom: 2rem;
}

.p-rules__tabletit:has(.p-rules__attention) h5{
  margin-bottom: .5rem;
}

.p-rules__attention{
  font-size: 1.2rem;
  font-weight: normal;
}

.p-rules__block .p-sub-block__tablebox.__mt{
  margin-top: 3rem;
}

.p-sub-block__table tr:nth-child(1) .td-row-head.__purple{
  border-top: 5px solid var(--purple);
}

.p-rules__block .p-sub-block__table .td-row-head{
  padding: 1.5rem;
  font-weight: bold;
  width: 30%;
}

.p-sub-block__table .td-row-body-lg-font.__purple{
  color: var(--purple);
}

.p-rules__block .p-sub-block__table .td-row-head.icon-table.haichi::before{
  content: "";
  background-image: url(../img/rules/haichi.svg);
 background-repeat: no-repeat;
 background-size: contain;
 width: 40px;
 height: 40px;
 padding-left: .5rem;
 display: block;
 margin: auto auto 1rem;
}

.p-rules__block .p-sub-block__table .td-row-head.icon-table.syukko::before{
  content: "";
  background-image: url(../img/rules/syukko.svg);
 background-repeat: no-repeat;
 background-size: contain;
 width: 40px;
 height: 40px;
 padding-left: .5rem;
 display: block;
 margin: auto auto 1rem;
}

.p-rules__block .p-sub-block__table .td-row-body{
  vertical-align: middle;
}

.p-rules__block .p-sub-block__table .td-row-body-lg-font{
  font-size: 1.8rem;
}

.p-rules__block .p-sub-block__table .td-row-body-sm-font{
  font-size: 1.4rem;
  font-weight: 500;
}

.p-rules__block .p-sub-block__table .head-down{
  padding-left: 1em;
  text-indent: -1em;
  display: block;
}

.p-rules__block .common-btn{
 max-width: 500px;
 margin: 4rem auto 0rem;
}

@media screen and (max-width: 769px) {
  .p-rules__block{
    padding: 3rem 2rem 2rem;
    border-radius: 2rem;
    margin-bottom: 4rem;
  }
  
  .p-rules__block h3{
    font-size: 1.8rem;
  }
  
  .p-rules__block h5{
    font-size: 1.6rem;
  }
  
  .p-rules__block .p-sub-block__table .td-row-body-lg-font{
    font-size: 1.6rem;
  }
}

.p-rules__unit{
  display: grid; 
  grid-template-columns: 1fr .7fr 1fr;
  gap: 1rem;
  text-align: center;
}

.p-rules__unit .p-rules__comment{
  margin: 0 0 auto 0;
}

.p-rules__unit .p-rules__comment::before{
  content: url(../img/rules/comment.svg);
  position: absolute;
  bottom: 0;
}

.p-rules__unit .p-rules__comment.left::before{
  right: 5%;
  translate: 30% 70%;
  scale: -1 1;
}

.p-rules__unit .p-rules__comment.right::before{
  left: 5%;
  translate: -30% 70%;
}

.p-rules__unit figure{
  position: relative;
}

@media screen and (max-width: 769px) {
  .p-rules__unit{
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
    row-gap: 3rem;
  }
  
  .p-rules__unit figure{
    order: 3;
    grid-column: 1/3;
    max-width: 200px;
    margin-inline: auto;
  }
  
  .p-rules__unit .p-rules__comment{
    margin: 0;
    padding: 1rem;
  }

 .p-rules__unit .p-rules__comment.right{
   order: 2;
 }
 
 .p-rules__unit .p-rules__comment.left::before{
   right: 50%;
   translate: 50% 70%;
   scale: -1 1;
 }
 
 .p-rules__unit .p-rules__comment.right::before{
   left: 50%;
   translate: -50% 70%;
 }
}

.p-rules__button{
  max-width: 50rem;
  margin: 8rem auto 0;
}

.p-rules__button .p-mv__contents__card__btn {
  height: 6.5rem;
  border-radius: 3.6rem;
}


@media screen and (max-width: 769px){
  .p-rules__button{
    margin: 4rem auto 0;
  }
}

/* alterationページ */
.p-rules__mainsolution{
  max-width: 113rem;
  display: block;
  margin-inline: auto;
  margin-bottom: 2rem;
  padding: 0 1.6rem;
  font-family: "Noto Sans JP", sans-serif;
  }

.p-rules__solution{
  margin-bottom: 6rem;
  background-color: #F4EFE9;
  border-radius: 3rem;
  padding: 6rem;
  font-weight: bold;
}

.p-rules__solution figure{
  max-width: 250px;
  margin: 0 auto 3rem;
}

.p-rules__solution h3{
  font-size: 2.8rem;
  text-align: center;
}

.p-rules__solution:has(.p-rules__block) h3{
  margin-bottom: 3rem;
}

.p-rules__solution .p-rules__block {
  margin-bottom: 6rem;
}

.p-rules__solution .p-rules__block .p-sub-block__table .td-row-head {
  width: 10%;
}

.p-rules__solution .p-sub-block__table .below-space-15 {
  padding-bottom: 1rem;
}

.p-rules__solution .common-btn {
  max-width: 500px;
  margin: 4rem auto 0rem;
}

@media screen and (max-width: 769px) {
  .p-rules__solution{
    padding: 3rem;
  }
  
  .p-rules__solution figure{
    max-width: 150px;
    margin: 0 auto 3rem;
  }
  
  .p-rules__solution h3{
    font-size: 1.8rem;
    text-align: center;
  }
}

.p-rules__tit.non-back{
  background-color: inherit;
  color: #000;
}





/* expirationページ */

.p-rurles__user.sp-reverse__second{
  display: grid;
  grid-template-rows: subgrid;
  grid-row: span 6;
}

.p-rurles__worker.sp-reverse__third{
  display: grid;
  grid-template-rows: subgrid;
  grid-row: span 6;
}

.p-rules__text{
  font-size: 2.1rem;
  text-align: left;
}

.p-rules__content a{
  color: #D2422C;
  font-size: 2.1rem;
  text-align: left;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}

.p-rules__content a .link-icon{
  padding-left: 1rem;
  display: inline-flex;
}

.p-rules__content a .link-icon .fa-arrow-up-right-from-square-red{
  background-image: url(../img/rules/icon_blank-red.svg);
  width: 15px;
  height: 15px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.p-rules__content a:hover{
  color: var(--purple);
}

.p-rules__content a:hover .link-icon .fa-arrow-up-right-from-square-red{
  background-image: url(../img/icon_blank.svg);
}


.p-rules__content .p-rules__imp{
  gap: 1rem;
  grid-template-columns: .5fr 1fr;
  padding: 2rem;
  text-align: left;
  margin-bottom: 0;
}

.p-rules__content .p-rules__imp.row-line{
  gap: 1rem;
  grid-template-columns: 1fr;
  padding: 2rem;
  text-align: left;
  margin-bottom: 0;
}

.p-rules__content .p-rules__imp.row-line .imp-mark{
  max-width: 100px;
  margin: 0 auto;
  width: 100%;
}

.p-rules__bluebox{
  background-color: var(--blue);
  color: #ffffff;
  font-size: 2.4rem;
  border-radius: 100vw;
  margin: auto 0;
  padding: 2rem;
}

.p-rules__greenbox{
  background-color: var(--green);
  color: #ffffff;
  font-size: 2.4rem;
  border-radius: 100vw;
  margin: auto 0;
  padding: 2rem;
}

.p-rules__text.__center{
  text-align: center;
}

@media screen and (max-width: 769px) {
  .p-rurles__worker.sp-reverse{
    order: 2;
  }
  
  .p-rurles__user.sp-reverse__second{
    order: 1;
  }
  
  .p-rurles__worker.sp-reverse__third{
    order: 3;
  }
}


/* indefiniteページ */
.p-rules__tit.non-back.about-ind .p-rules__text{
  margin-top: 2rem;
  text-align: left;
}

.p-rules__tit.non-back .attention{
  margin-top: 1rem;
  text-align: left;
}

@media screen and (max-width: 769px) {
  .p-rules__tit.non-back.about-ind{
    margin: 0 auto;
  }
  .p-rules__tit.non-back.about-ind .p-rules__text{
    font-size: 1.6rem;
  }
  
  .p-rules__tit.non-back .attention{
    margin-top: .6rem;
  }
}

.p-rules__block .p-tit__black{
  color: #000000;
}

.p-rules__block .merit-tex {
  margin-bottom: 3rem;
}

.p-rules__block .merit-tex,.p-rules__block .merit-tex .tex-circle{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  text-align: center;
}

.p-rules__block .merit-tex .tex-circle p{
  background-color: #F7C967;
  border-radius: 100%;
  aspect-ratio: 1 / 1;
  padding: 2rem;
  display: flex;
  align-items: center;
  place-content: center;
  margin: auto;
  width: 75%;
}

.merit-unit{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 2rem;
}

.merit-unit .p-rules__comment{
  background-color: #F8E9E2;
  text-align: center;
  position: relative;
}

.merit-unit .p-rules__comment::before {
  content: url(../img/rules/comment-red.svg);
  position: absolute;
  bottom: 0;
}

.merit-unit .p-rules__comment.left::before {
  right: 5%;
  translate: 30% 70%;
  scale: -1 1;
}

.merit-unit .p-rules__comment.right::before {
    left: 5%;
    translate: -30% 70%;
}

.merit-unit div{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
}

.merit-unit div figure img {
  object-fit: contain;
}

@media screen and (max-width: 769px) {
  .p-rules__block .merit-tex {
    grid-template-columns: 1fr;
  }
  
  .p-rules__block .merit-tex .tex-circle p{
    max-width: 150px;
  }
  
  .merit-unit{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
  }
  
  .merit-unit div{
    order: 3;
    grid-column: 1 / 3;
    max-width: 200px;
    margin-inline: auto;
  }
  
  .merit-unit .p-rules__comment{
    margin: 0;
    padding: 1rem;
  }
  
  .merit-unit .p-rules__comment.left{
    order: 1;
  }
  
  .merit-unit .p-rules__comment.right{
    order: 2;
  }
  
  
  .merit-unit .p-rules__comment.left::before {
    right: 50%;
    translate: 50% 70%;
    scale: -1 1;
  }
  
  .merit-unit .p-rules__comment.right::before {
      left: 50%;
      translate: -50% 70%;
  }
}

@media screen and (max-width: 400px) {
  .p-rules__block .merit-tex .tex-circle p{
    border-radius: 1rem;
    padding: 1rem;
    width: auto;
    margin: 0;
    aspect-ratio: auto;
  }
}



.p-rules__block .confirmation-tex{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
  margin-top: 3rem;
}

.p-rules__block .confirmation-tex .p-rurles__user,.p-rules__block .confirmation-tex .p-rurles__worker{
  display: grid;
  grid-template-rows: subgrid;
  grid-row: span 3;
}

@media screen and (max-width: 769px) {
  .p-rules__block .confirmation-tex{
    grid-template-columns: 1fr;
  }
}

.p-rules__block .p-schedule{
  display: flex;
  gap: 3rem;
  flex-wrap: wrap;
  align-items: center;
  margin-bottom: 3rem;
}

.p-rules__block .p-tit__red{
  background-color: #C10000;
  color: #ffffff;
  border-radius: 100vw;
  margin: 6rem auto 3rem;
  padding: 2rem 3rem;
  max-width: 150px;
}


.p-rules__block .p-schedule:not(:first-of-type){
  margin-top: 8rem;
}


.p-special .p-rules__block .p-schedule:not(:first-of-type){
  margin-top: 8rem;
}

.p-rules__block .p-schedule h3{
  background-color: var(--purple);
  color: #ffffff;
  border-radius: 100vw;
  margin: auto 0;
  padding: 2rem 3rem;
}

.p-rules__block .schedule-ill{
  overflow: scroll;
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.p-rules__block .schedule-ill::-webkit-scrollbar{
  display: none;
}

.p-rules__block .schedule-ill img{
  min-width: 700px;
}

@media screen and (max-width: 769px){
  .p-rules__block .p-schedule:not(:first-of-type){
    margin-top: 4rem;
  }
  
  
  .p-special .p-rules__block .p-schedule:not(:first-of-type){
    margin-top: 4rem;
  }
}

.p-rules__back.last{
  margin-top: 10rem;
  margin-bottom: 0rem;
}

.p-rules__content.last{
  padding-bottom: 20rem;
  margin-bottom: 0rem;
}

@media screen and (max-width: 769px){
  .p-rules__content.last{
    padding-bottom: 10rem;
  }
}

