@layer component {
    .p-ar {
        margin-top: 0 !important;
        padding-bottom: calc(1* var(--base-unit));
        overflow: hidden;
    }
    .p-link01__lang--pdr-45 {
        padding-right: calc(4.5 * var(--base-unit));
    }
}

@layer component {
    .p-ar-lead {
        display: grid;
        place-items: center;
    }
    .p-ar-lead__text {
        font-size: calc(1.8 * var(--base-unit));
        line-height: 1.6111111111;
        letter-spacing: 0.03em;
        text-align: left;
    }
    
    @media screen and (max-width: 767px) {
        .p-ar-lead__text {
            font-size: calc(1.5 * var(--base-unit));
            line-height: 1.6;
            letter-spacing: 0.04em;
        }
    }

    @media screen and (max-width: 767px) {
        .p-ar-section {
          padding: calc(30 * var(--mc--quantity--of-design--horizontal)) calc(20 * var(--mc--quantity--of-design--horizontal)) calc(42 * var(--mc--quantity--of-design--horizontal));
          padding-top: calc(4 * var(--base-unit));
          padding-bottom: 0;
          font-size: calc(1.1* var(--base-unit));
        }
        .p-ar-section.--pt120 {
            padding-top: calc(8 * var(--base-unit));
        }
        .p-ar-section.--pb80 {
            padding-bottom:calc(4 * var(--base-unit));
        }
        .p-ar-section.--pt0 {
            padding-top: 0;
        }
        .p-ar-section .p-link01.p-link01--bg {
            padding-bottom: calc(1 * var(--base-unit));
        }
        .p-ar-section .p-hd03 {
            padding-left: calc(1.5 * var(--base-unit));
        }
        .p-ar-section .p-link01__list>li {
            padding-left: calc(1.5 * var(--base-unit));
        }
      }
      @media screen and (min-width: 768px) and (max-width: 1199px) {
        .p-ar-section {
            font-size: calc(1.6* var(--base-unit));
          padding-top: 80px;
          padding-left: calc(var(--mc-layout--offset--of-outer-left) + var(--mc-layout--offset--of-inner-left));
          padding-right: calc(var(--mc-layout--offset--of-outer-right) + var(--mc-layout--offset--of-inner-right));
        }
        .p-ar-section.--pb80 {
            padding-bottom: 80px;
        }
        .p-ar-section.--pt120 {
            padding-top: 120px;
        }
        .p-ar-section.--pt0 {
            padding-top: 0;
        }
      }
      @media screen and (min-width: 1200px) and (max-width: 1439px) {
        .p-ar-section {
            font-size: calc(1.6* var(--base-unit));
          padding-top: 80px;
          padding-left: calc(var(--mc-layout--offset--of-outer-left) + var(--mc-layout--offset--of-inner-left));
          padding-right: calc(var(--mc-layout--offset--of-outer-right) + var(--mc-layout--offset--of-inner-right));
        }
        .p-ar-section.--pb80 {
            padding-bottom: 80px;
        }
        .p-ar-section.--pt120 {
            padding-top: 120px;
        }
        .p-ar-section.--pt0 {
            padding-top: 0;
        }
      }
      @media screen and (min-width: 1440px) {
        .p-ar-section {
            font-size: calc(1.6* var(--base-unit));
          padding-top: 80px;
          padding-left: calc(var(--mc-layout--offset--of-outer-left) + var(--mc-layout--offset--of-inner-left));
          padding-right: calc(var(--mc-layout--offset--of-outer-right) + var(--mc-layout--offset--of-inner-right));
        }
        .p-ar-section.--pb80 {
            padding-bottom: 80px;
        }
        .p-ar-section.--pt120 {
            padding-top: 120px;
        }
        .p-ar-section.--pt0 {
            padding-top: 0;
        }
      }

    .p-ar-needs {
        padding-top: 4rem;
        padding-bottom: 4rem;
        padding-left: calc(var(--mc-layout--offset--of-outer-left) + var(--mc-layout--offset--of-inner-left));
        padding-right: calc(var(--mc-layout--offset--of-outer-right) + var(--mc-layout--offset--of-inner-right));
        font-size: calc(1.6* var(--base-unit));
    }
    @media screen and (max-width:767px) {
        .p-ar-needs {
            font-size: calc(1.1* var(--base-unit));
        }
    }
    .p-ar-needs__cat-list {
        display: grid;
        justify-content: space-between;
        grid-template-rows: repeat(2, auto);
        grid-template-columns: repeat(3, auto);
        row-gap: calc(3* var(--base-unit));
        margin-top: calc(8 * var(--base-unit));
    }
    @media screen and (max-width:1024px) {
        .p-ar-needs__cat-list {
            grid-template-rows: repeat(3, auto);
            grid-template-columns: repeat(2, auto);
            justify-content: center;
            column-gap: calc(3* var(--base-unit));
        }
    }
    @media screen and (max-width:767px) {
        .p-ar-needs__cat-list {
            grid-template-rows: auto;
            grid-template-columns: 100%;
            row-gap:calc(1.1* var(--base-unit));
            margin-top: calc(4 * var(--base-unit));
        }
    }
    .p-ar-needs__cat-list-item {
        width: 360px;
        width: min(360px, 26.4vw);
        width: clamp(290px, 26.4vw, 360px);
        height: 84px;
        border: solid 1px;
        box-sizing: border-box;
        color: #333;
    }
    @media screen and (max-width:1024px) {
        .p-ar-needs__cat-list-item {
            width: clamp(290px, 26.4vw, 360px);
        }
    }
    @media screen and (max-width:767px) {
        .p-ar-needs__cat-list-item {
            width: 100%;
            height: calc(8* var(--base-unit));
            font-size: calc(1.5* var(--base-unit));
        }
    }
    .p-ar-needs__cat-list-item > a {
        width: 100%;
        height: 100%;
        display: grid;
        place-items: center;
        text-align: center;
        line-height: calc(24/16);
    }
    .p-ar-needs__cat-list-item:hover {
        background-color: #A22041;
        color: #FFFFFF;
    }
    .p-ar-needs__cat-list-item.active {
        background-color: #A22041;
        color: #FFFFFF;
    }
    
    .p-ar-needs__cat-list-guide-txt {
        font-size: 28px;
        color: #333;
        text-align: center;
        margin-top: calc(8* var(--base-unit));
        line-height: 1.5;
    }
    @media  screen and (max-width: 768px) {
        .p-ar-needs__cat-list-guide-txt {
            font-size: calc(2.2 * var(--base-unit));
            margin-top: calc(4* var(--base-unit));
            text-align: left;
        }
    }
    .p-ar-needs__block-list {
        width: 100%;
        margin-top: calc(8* var(--base-unit));
        display: grid;
        grid-template-rows: repeat(2, auto);
        grid-template-columns: repeat(2, 420px);
        justify-content: center;
        row-gap: calc(5* var(--base-unit));
        column-gap: 139px
    }
    @media screen and (max-width:1200px) {
        .p-ar-needs__block-list {
            grid-template-columns: repeat(2, 46%);
            justify-content: space-evenly;
            padding-left: 0;
            column-gap: 0;
        }
    }
   
    @media screen and (max-width:767px) {
        .p-ar-needs__block-list {
            grid-template-rows: auto;
            grid-template-columns: 100%;
            justify-content: start;
            row-gap: calc(4* var(--base-unit));
            margin-top: calc(4* var(--base-unit));
        }
    }
    .p-ar-needs__block {
        width: 100%;
    }
    .p-ar-needs__block-heading {
        font-size: 22px;
        font-weight: bold;
        letter-spacing: .1em;
        color: #333;
    }
    @media screen and (max-width:767px) {
        .p-ar-needs__block-heading {
            font-size: calc(1.8* var(--base-unit));

        }
    }
    .p-ar-needs__block-innner-heading {
        margin: calc(.8* var(--base-unit)) 0 0;
        line-height: calc(32/18);
        font-size: 18px;
        font-weight: bold;
        color: #333;
    }
    .p-ar-needs__block-innner-heading:first-of-type {
        margin: calc(1.8* var(--base-unit)) 0 0;
        
    }
    @media screen and (max-width:767px) {
        .p-ar-needs__block-innner-heading {
            font-size: calc(1.6* var(--base-unit));
        }
    }
    .p-ar-needs__block-inner-list {
        margin: calc(1.8* var(--base-unit)) 0 0;
        display: grid;
        margin-left: calc(2.4* var(--base-unit));
        row-gap: 6px;
    }
    @media screen and (max-width:1024px) {
        .p-ar-needs__block-inner-list {
            margin-left:0;
        }
    }
    @media screen and (max-width:767px) {
        .p-ar-needs__block-inner-list {
            margin-left:calc(1.5* var(--base-unit));
            margin-left: 0;
        }
    }
    .p-ar-needs__block-inner-list.--mt-s {
        margin-top: calc(.6* var(--base-unit));
        margin-left: calc(2.4* var(--base-unit));
    }
    @media screen and (max-width:1024px) {
        .p-ar-needs__block-inner-list.--mt-s {
            margin-left:0;
        }
    }
    @media screen and (max-width:767px) {
        .p-ar-needs__block-inner-list.--mt-s {
            margin-left:calc(1.5* var(--base-unit));
            margin-left: 0;
        }
    }


    .p-ar-needs__block-inner-list-item {
        width: fit-content;
        color: #333;
        padding-left: 26px;
    }
    .p-ar-needs__block-inner-list-item > a {
        width: fit-content;
        display: inline-block;
        grid-auto-flow: column;
        justify-content: start;
        align-items: center;
        line-height: calc(26/16);
        padding-right: 7px;
    }
    .p-ar-needs__block-inner-list-item > a.p-ar-needs__inline {
        display: inline;
    }
    @media screen and (max-width:767px) {
        .p-ar-needs__block-inner-list-item {
            padding-left: calc(2* var(--base-unit));
        }
        .p-ar-needs__block-inner-list-item > a {
            font-size: calc(1.5* var(--base-unit));
            /* padding-left: calc(2* var(--base-unit)); */
            padding-right: calc(.7* var(--base-unit));
        }
    }
    
    .p-ar-needs__block-inner-list-item.active {
        background-color: #A22041;
        color: #FFFFFF;
    }
    
    .p-ar-needs__block-inner-list-item.inactive {
        color: #999999;
    }
    .p-ar-needs__block-inner-list-item > a > span {
        position: relative;
    }
    .p-ar-needs__block-inner-list-item > a > span::before {
        position: absolute;
        left: -20px;
        content: '';
        display: inline-block;
        background-color: #A22041;
        background-size: contain;
        background-repeat: no-repeat;
        vertical-align: top;
        mask: url(../svg/cmn_icon_arrow_01.svg) no-repeat center center / contain;
        -webkit-mask: url(../svg/cmn_icon_arrow_01.svg) no-repeat center center / contain;
        width: calc(var(--base-unit)* 1);
        height: calc(var(--base-unit)* 1);
        margin-top: 8px;
    }
    @media screen and (max-width:767px) {
        .p-ar-needs__block-inner-list-item > a > span::before {
            font-size: calc(1.5* var(--base-unit));
            left: -1em;
            width: .6em;
            height: .6em;
            margin-top: .5em;
        }
    }
    .p-ar-needs__block-inner-list-item.active > a > span::before {
        background-color: #E3BCC6; 
    }
    .p-ar-needs__block-inner-list-item.inactive > a > span::before {
        background-color: #E3BCC6; 
    }

    .p-ar-needs__block-inner-list-item > a > .p-link01__ico {
        transform: translateY(0px);
        transition: none;
        filter: invert(25%) sepia(65%) saturate(0%) hue-rotate(224deg) brightness(85%) contrast(116%);
    }
    .p-ar-needs__block-inner-list-item.active > a > .p-link01__ico {
        filter: invert(79%) sepia(18%) saturate(304%) hue-rotate(308deg) brightness(103%) contrast(93%);
    }
    .p-ar-needs__block-inner-list-item.inactive > a > .p-link01__ico {
        filter: invert(40%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(100%) contrast(100%);
    }

    .sp-only {
        display: none;
    }
    @media screen and (max-width:1024px) {
        .sp-only {
            display: block;
        }
    }
    .p-btn02.p-ar-btn > a {
        font-size: calc(1.6* var(--base-unit));
        line-height: calc(28 / 16);
        min-width: 100%;
    }
    .p-btn02.p-ar-btn > a::after {
        background: #333;
    }
    .p-ar-movie {
        width: var(--new-contents-width);
    }
    @media screen and (max-width:767px) {
        .p-ar-movie {
            padding-top: calc(2 * var(--base-unit));
        }
    }

    
} 

.p-notes01__list>li>div:first-child {
    white-space: wrap;
}
.p-notes01.p-notes01--small {
    text-indent: -1.4em;
    padding-left: 1.4em;
    box-sizing: border-box;
}

.p-ar-needs__block-inner-list-item .p-link01 > a.p-ar-needs__block-inner-list-item-web{
    padding-left: 0;
    padding-right: 7px;
}
.p-ar-needs__block-inner-list-item .p-link01 > a.p-ar-needs__block-inner-list-item-web > span::before {
    display: none;
}

.p-ar-needs__block-inner-list-item .p-link01 {
    font-weight: unset;       
}
.p-ar-needs__block-inner-list-item .p-link01 a::after{
    transition: unset;
}
.p-ar-needs__block-inner-list-item .p-link01:not(:first-child) {
    border-left: 1px solid #000;
    padding-left: calc(.9 * var(--base-unit));
}
.p-ar-needs__block-inner-list-item.active .p-link01 a {
    color: #fff;
}
.p-ar-needs__block-inner-list-item.active .p-link01 a::after{
    background: #fff;
    transition: unset;
}
.p-ar-needs__block-inner-list-item.active .p-link01:not(:first-child) {
    border-left: 1px solid #fff;
}

.p-ar-needs__block-inner-list-item.inactive .p-link01 a {
    color: #999999;;
}
.p-ar-needs__block-inner-list-item.inactive .p-link01 a::after{
    background: #999999;;
}
.p-ar-needs__block-inner-list-item.inactive .p-link01:not(:first-child) {
    border-left: 1px solid #999999;;
}

@media screen and (min-width: 768px) {
    .p-link01 a.p-ar-needs__block-inner-list-item-web:hover {
        background-size: 0;
    }
}

/* 表紙画像ホバーアクション */
.p-linkset01--wrapper .p-linkset01__link {
    margin: auto;
}

.p-linkset01 a .p-linkset01__fig-img img{
    object-fit: contain;
    transition: 0.3s ease 0s;
  }

.p-linkset01 a:hover .p-linkset01__fig-img img{
      transform: scale(1.06);
      transition: 0.3s ease 0s;
    }

.p-linkset01 a .p-linkset01__fig-img {
    transition: box-shadow 0.3s;
    }
.p-linkset01 a:hover .p-linkset01__fig-img {
       box-shadow: 0 3px 8px rgb(0 0 0 / 0.1);
       border: 1px solid #d5d5d5;
    }
