@layer component {
    .p-ir-shareholder {
        margin: calc(8 * var(--base-unit)) auto 0;
        width: var(--width-contents);
    }
    @media screen and (max-width: 767px) {
        .p-ir-shareholder {
            margin-top: calc(4 * var(--base-unit));
        }
    }
    .p-ir-shareholder__list {
        display: grid;
    }
    @media print, screen and (min-width: 768px) {
        .p-ir-shareholder__list {
            grid-template-columns: repeat(3, 1fr);
        }
    }
    @media print, screen and (min-width: 768px) {
        .p-ir-shareholder__list-item {
            border-right: 1px solid #D5D5D5;
            border-bottom: 1px solid #D5D5D5;
        }
        .p-ir-shareholder__list-item:nth-child(3n) {
            border-right: none;
        }
        .p-ir-shareholder__list-item:nth-child(4) {
            border-bottom: none;
        }
        .p-ir-shareholder__list-item:nth-child(5) {
            border-bottom: none;
        }
        .p-ir-shareholder__list-item:nth-child(6) {
            border-bottom: none;
        }
    }

    @media screen and (max-width: 767px) {
        .p-ir-shareholder__list-item {
            border-bottom: 1px solid #D5D5D5;
        }
    }
    
    @media screen and (max-width: 767px) {
        .p-ir-shareholder__list-item:first-of-type {
            border-top: 1px solid #D5D5D5;
        }
    }
    .p-ir-shareholder__link {
        display: grid;
        padding: calc(3 * var(--base-unit)) calc(1.5 * var(--base-unit));
        transition: background-color 0.3s ease 0s;
        box-sizing: border-box;
        height: 100%;
    }
    @media print, screen and (min-width: 768px) {
        .p-ir-shareholder__link {
            justify-items: center;
        }
    }
    @media screen and (max-width: 767px) {
        .p-ir-shareholder__link {
            align-items: center;
            grid-template-columns: calc(4.8 * var(--base-unit)) 1fr;
            -moz-column-gap: calc(2 * var(--base-unit));
                 column-gap: calc(2 * var(--base-unit));
            padding: calc(1.6 * var(--base-unit));
        }
    }
    @media screen and (min-width: 768px){
        .p-ir-shareholder__link:hover {
            background-color: #a22041;
        }
    }
    .p-ir-shareholder__icon {
        width: calc(10 * var(--base-unit));
        position: relative;
    }
    @media screen and (max-width: 767px) {
        .p-ir-shareholder__icon {
            width: calc(4.8 * var(--base-unit));
        }
    }
    .p-ir-shareholder__icon-img {
        width: 100%;
        height: auto;
        transition: opacity 0.3s ease 0s;
    }
    @media screen and (min-width: 768px){
        .p-ir-shareholder__link:hover .p-ir-shareholder__icon-img {
            opacity: 0;
        }
    }
    .p-ir-shareholder__icon-img-hover {
        width: 100%;
        height: auto;
        position: absolute;
        inset: 0;
        opacity: 0;
        transition: opacity 0.3s ease 0s;
    }
    @media screen and (min-width: 768px){
        .p-ir-shareholder__link:hover .p-ir-shareholder__icon-img-hover {
            opacity: 1;
        }
    }
    .p-ir-shareholder__txt {
        display: grid;
        grid-template-columns: 1fr calc(2.8 * var(--base-unit));
        justify-content: center;
        align-items: center;
        -moz-column-gap: calc(1 * var(--base-unit));
             column-gap: calc(1 * var(--base-unit));
        font-size: calc(2 * var(--base-unit));
        letter-spacing: 0.1em;
        transition: color 0.3s ease 0s;
    }
    @media print, screen and (min-width: 768px) {
        .p-ir-shareholder__txt {
            margin-top: calc(1 * var(--base-unit));
        }
    }
    @media screen and (max-width: 767px) {
        .p-ir-shareholder__txt {
            grid-template-columns: 1fr calc(2.2 * var(--base-unit));
            -moz-column-gap: 0.2em;
                 column-gap: 0.2em;
            font-weight: 500;
            font-size: calc(1.8 * var(--base-unit));
        }
    }
    .p-ir-shareholder__txt::after {
        content: "";
        display: block;
        width: calc(1.5 * var(--base-unit));
        height: calc(1.5 * var(--base-unit));
        background-color: #000;
        -webkit-mask: url(/jp/en/ir/shareholder/assets_r24/images/icon_arrow.svg) no-repeat center center/contain;
                mask: url(/jp/en/ir/shareholder/assets_r24/images/icon_arrow.svg) no-repeat center center/contain;
        transition: background-color 0.3s ease 0s;
    }
    @media screen and (max-width: 767px) {
        .p-ir-shareholder__txt::after {
            width: calc(2 * var(--base-unit));
            height: calc(2 * var(--base-unit));
        }
    }
    @media screen and (min-width: 768px){
        .p-ir-shareholder__link:hover .p-ir-shareholder__txt {
            color: #fff;
        }
        .p-ir-shareholder__link:hover .p-ir-shareholder__txt::after {
            background-color: #fff;
        }
    }
}