@charset "utf-8";

/* tag */
.tag_content {
    background-color: var(--color-white);
}
.tag_content_inner {
    border: solid var(--color-light-gray);
}
.tag_content_item_ttl {
    padding-left: 18rem;
    line-height: 1.77;
    border-bottom: 2rem solid #e6e6e6;
    position: relative;
}
.tag_content_item_ttl.tag_content_item_ttl_corporate {
    padding-block: 0;
    border-bottom: none;
}
.tag_content_item_ttl::before {
    content: '';
    width: 8rem;
    height: 8rem;
    margin: auto;
    border-radius: 50%;
    background-color: var(--color-red);
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
}
.tag_content_item_ttl_corporate::before {
    background-color: #ccc;
}

.tag_list {
    display: flex;
    flex-wrap: wrap;
}
.tag_list input {
    display: none;
}
.tag_list label {
    line-height: 1.8;
    color: var(--color-red);
    background-color: var(--color-white);
    border: 1px solid var(--color-red);
    display: block;
    cursor: pointer;
}
.tag_list label:has(input:checked) {
    color: var(--color-white);
    background-color: var(--color-red);
}
@media (min-width: 769px) {
    .tag_content {
        margin-top: 82rem;
        display: flex;
        justify-content: space-between;
    }
    .tag_ttl {
        width: 168rem;
        font-size: 32px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .tag_content_inner {
        width: 989rem;
        padding: 22rem 60rem 40rem 70rem;
        border-left-width: 2rem;
    }
    .tag_content_item + .tag_content_item {
        margin-top: 22rem;
    }
    .tag_content_item_ttl {
        padding-block: 8rem;
        font-size: 12px;
    }
    .tag_content_item_ttl.tag_content_item_ttl_corporate {
        margin-top: 16rem;
    }
    .tag_content_item_ttl_l {
        margin-right: 5rem;
        font-size: 18px;
    }
    .tag_content_item_ttl_corporate {
        font-size: 13px;
    }

    .tag_content_item_ttl + .tag_list {
        margin-top: 12rem;
    }
    .tag_content_item_ttl_corporate + .tag_list {
        margin-top: 8rem;
    }
    .tag_list {
        gap: 10px 8px;
    }
    .tag_list label {
        padding: 3px 10px;
        font-size: 13px;
    }
}
@media (max-width: 768px) {
    .tag_content {
        margin-top: 32rem;
    }
    .tag_ttl {
        padding: 15rem 20rem;
        font-size: 24rem;
    }
    .tag_content_inner {
        padding: 20rem 20rem 43rem;
        border-top-width: 2rem;
    }
    .tag_content_item + .tag_content_item {
        margin-top: 22rem;
    }
    .tag_content_item_ttl {
        padding-block: 8rem;
        font-size: 12rem;
    }
    .tag_content_item_ttl.tag_content_item_ttl_corporate {
        margin-top: 20rem;
    }
    .tag_content_item_ttl_l {
        margin-right: 5rem;
        font-size: 18rem;
    }
    .tag_content_item_ttl_corporate {
        font-size: 13rem;
    }

    .tag_content_item_ttl + .tag_list {
        margin-top: 12rem;
    }
    .tag_content_item_ttl_corporate + .tag_list {
        margin-top: 8rem;
    }
    .tag_list {
        gap: 10rem 8rem;
    }
    .tag_list label {
        padding: 3rem 8rem;
        font-size: 12rem;
    }
}

/* people_list */
.people_list {
    display: flex;
    flex-wrap: wrap;
}
.people_list > li {
    position: relative;
}
.people_list > li > a {
    color: var(--color-red);
}
.people_list > li::before,
.people_list > li .people_item_bottom_cover::after {
    background: no-repeat 50% 50% / contain;
}
.people_item[data-bg='0']::before,
.people_item[data-bg='0'] .people_item_bottom_cover::after {
    background-image: url(../img/common/gradation_1.svg);
}
.people_item[data-bg='1']::before,
.people_item[data-bg='1'] .people_item_bottom_cover::after {
    background-image: url(../img/common/gradation_2.svg);
}
.people_item[data-bg='2']::before,
.people_item[data-bg='2'] .people_item_bottom_cover::after {
    background-image: url(../img/common/gradation_3.svg);
}
.people_item[data-bg='3']::before,
.people_item[data-bg='3'] .people_item_bottom_cover::after {
    background-image: url(../img/common/gradation_4.svg);
}
.people_item[data-bg='4']::before,
.people_item[data-bg='4'] .people_item_bottom_cover::after {
    background-image: url(../img/common/gradation_5.svg);
}
.people_item[data-bg='5']::before,
.people_item[data-bg='5'] .people_item_bottom_cover::after {
    background-image: url(../img/common/gradation_6.svg);
}
.people_item[data-bg='6']::before,
.people_item[data-bg='6'] .people_item_bottom_cover::after {
    background-image: url(../img/common/gradation_7.svg);
}
.people_item[data-bg='7']::before,
.people_item[data-bg='7'] .people_item_bottom_cover::after {
    background-image: url(../img/common/gradation_8.svg);
}
.people_item[data-bg='8']::before,
.people_item[data-bg='8'] .people_item_bottom_cover::after {
    background-image: url(../img/common/gradation_9.svg);
}
.people_list > li::before,
.people_item_bottom_cover::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
}
.people_item_bottom_cover {
    content: '';
    position: absolute;
    z-index: 5;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
    clip-path: polygon(0% 100%, 0% 40%, 100% 40%, 100% 100%);
}
.people_list > li .people_img {
    width: 100%;
    border-radius: 50%;
    position: relative;
    z-index: 1;
    height: auto;
    display: block;
    overflow: hidden;
    margin-inline: auto;
    clip-path: polygon(60% 90%, 40% 90%, -50% 0%, 150% 0%);
}
.people_ttl {
    filter: drop-shadow(0px 2px 0px var(--color-red)) drop-shadow(2px 0px 0px var(--color-red))
        drop-shadow(-2px 0px 0px var(--color-red)) drop-shadow(0px -2px 0px var(--color-red));
    position: absolute;
    z-index: 7;
}
.people_ttl_top_wrap {
    display: inline-block;
    position: relative;
    z-index: 2;
}
.people_ttl_top {
    background: #fff;
    display: block;
}
.people_ttl_bottom_wrap {
    display: inline-block;
    position: relative;
    z-index: 3;
}
.people_ttl_bottom {
    background: #fff;
    display: block;
}
@media (min-width: 769px) {
    .people_list {
        margin-top: 118rem;
        gap: 60rem 32rem;
    }
    .people_list > li {
        min-width: 264rem;
        width: 264rem;
        height: 264rem;
    }
    .people_ttl {
        left: 15rem;
        bottom: 2rem;
    }
    .people_ttl_top_wrap {
        font-size: 12rem;
        white-space: nowrap;
    }
    .people_ttl_top {
        padding: 4rem 10rem;
    }
    .people_ttl_bottom_wrap {
        margin-top: 8rem;
        font-size: 22rem;
    }
    .people_ttl_bottom {
        padding: 5rem 10rem;
        margin-top: -10rem;
    }
}
@media (max-width: 768px) {
    .people_list {
        margin-top: 60rem;
        gap: 40rem 15rem;
    }
    .people_list > li {
        min-width: 160rem;
        width: 160rem;
        height: 160rem;
    }
    .people_ttl {
        left: 1rem;
        bottom: -24rem;
    }
    .people_ttl_top_wrap {
        font-size: 10rem;
    }
    .people_ttl_top {
        padding: 4rem 10rem;
    }
    .people_ttl_bottom_wrap {
        margin-top: 8rem;
        font-size: 18rem;
    }
    .people_ttl_bottom {
        padding: 5rem 10rem;
        margin-top: -10rem;
    }
}

@media (min-width: 769px) {
    @media (hover: hover) {
        .animation_loaded .people_list > li::before,
        .animation_loaded .people_list > li .people_item_bottom_cover::after {
            transition: var(--roll-transition);
        }
        .animation_loaded .people_list > li:hover::before,
        .animation_loaded .people_list > li:hover .people_item_bottom_cover::after {
            rotate: 180deg;
        }
        .animation_loaded .people_img {
            transition: scale 0.4s;
        }
        .animation_loaded .people_list > li:hover .people_img {
            scale: 1.1;
        }
    }
}

/* people_view_side */
.people_view_img_wrap {
    position: relative;
}
.people_view_img_wrap::before,
.people_view_item_bottom_cover::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
}
.people_view_item_bottom_cover {
    content: '';
    position: absolute;
    z-index: 5;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
    clip-path: polygon(0% 100%, 0% 50%, 100% 50%, 100% 100%);
}
.people_view_img_wrap::before,
.people_view_img_wrap .people_view_item_bottom_cover::after {
    background: no-repeat 50% 50% / contain;
}
.people_view_img_wrap[data-bg='0']::before,
.people_view_img_wrap[data-bg='0'] .people_view_item_bottom_cover::after {
    background-image: url(../img/common/gradation_1.svg);
}
.people_view_img_wrap[data-bg='1']::before,
.people_view_img_wrap[data-bg='1'] .people_view_item_bottom_cover::after {
    background-image: url(../img/common/gradation_2.svg);
}
.people_view_img_wrap[data-bg='2']::before,
.people_view_img_wrap[data-bg='2'] .people_view_item_bottom_cover::after {
    background-image: url(../img/common/gradation_3.svg);
}
.people_view_img_wrap[data-bg='3']::before,
.people_view_img_wrap[data-bg='3'] .people_view_item_bottom_cover::after {
    background-image: url(../img/common/gradation_4.svg);
}
.people_view_img_wrap[data-bg='4']::before,
.people_view_img_wrap[data-bg='4'] .people_view_item_bottom_cover::after {
    background-image: url(../img/common/gradation_5.svg);
}
.people_view_img_wrap[data-bg='5']::before,
.people_view_img_wrap[data-bg='5'] .people_view_item_bottom_cover::after {
    background-image: url(../img/common/gradation_6.svg);
}
.people_view_img_wrap[data-bg='6']::before,
.people_view_img_wrap[data-bg='6'] .people_view_item_bottom_cover::after {
    background-image: url(../img/common/gradation_7.svg);
}
.people_view_img_wrap[data-bg='7']::before,
.people_view_img_wrap[data-bg='7'] .people_view_item_bottom_cover::after {
    background-image: url(../img/common/gradation_8.svg);
}
.people_view_img_wrap[data-bg='8']::before,
.people_view_img_wrap[data-bg='8'] .people_view_item_bottom_cover::after {
    background-image: url(../img/common/gradation_9.svg);
}
.people_view_img {
    width: 100%;
    position: relative;
    z-index: 1;
    height: auto;
    display: block;
    margin-inline: auto;
    border-radius: 50%;
    clip-path: polygon(60% 90%, 40% 90%, -50% 0%, 150% 0%);
}
.people_view_ttl {
    line-height: 1.77;
    color: var(--color-red);
    background: #fff;
    filter: drop-shadow(0px 2px 0px var(--color-red)) drop-shadow(2px 0px 0px var(--color-red))
        drop-shadow(-2px 0px 0px var(--color-red)) drop-shadow(0px -2px 0px var(--color-red));
    position: absolute;
    z-index: 7;
}

.people_view_info_item_ttl {
    line-height: 1.32;
    color: #ccc;
}
.people_view_info_item + .people_view_info_item {
    line-height: 1;
    border-top: 2rem solid #e6e6e6;
}
@media (min-width: 769px) {
    .people_view {
        padding-block: 120rem 200rem;
    }
    .people_view .inner {
        padding-inline: 100rem;
    }
    .people_view_inner {
        display: flex;
        justify-content: space-between;
    }
    .people_view_side {
        width: 407rem;
    }
    .people_view_img_wrap {
        min-width: 407rem;
        width: 407rem;
        height: 407rem;
    }
    .people_view_ttl {
        padding-inline: 20rem;
        font-size: 32rem;
        left: 0;
        bottom: 40rem;
    }

    .people_view_info {
        margin-top: 4rem;
    }
    .people_view_info_item {
        padding-block: 16rem;
    }
    .people_view_info_item_ttl {
        font-size: 12px;
    }
    .people_view_info_item_txt {
        margin-top: 6rem;
        font-size: 16px;
    }
}
@media (max-width: 768px) {
    .people_view {
        padding-block: 80rem 140rem;
    }
    .people_view .inner {
        padding-inline: 20rem;
    }
    .people_view_img_wrap {
        min-width: 335rem;
        width: 335rem;
        height: 335rem;
    }
    .people_view_ttl {
        padding: 7rem 20rem;
        font-size: 24rem;
        left: 0;
        bottom: 20rem;
    }

    .people_view_info {
        margin-top: 20rem;
    }
    .people_view_info_item {
        padding-block: 20rem;
        display: flex;
        align-items: center;
    }
    .people_view_info_item_ttl {
        width: 70rem;
        font-size: 12rem;
    }
    .people_view_info_item_txt {
        font-size: 14rem;
    }
}

/* people_view_content */
.people_view_content_ttl {
    padding: 5rem 15rem;
    color: var(--color-white);
    background-color: var(--color-red);
    display: inline;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
}
.people_view_content_item_ttl {
    padding-left: 18px;
    line-height: 1.77;
    position: relative;
}
.people_view_content_item_ttl::before {
    content: '';
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: var(--color-red);
    display: block;
    position: absolute;
    left: 0;
}
.people_view_content_item_txt {
    line-height: 1.8;
    font-weight: 400;
}
@media (min-width: 769px) {
    .people_view_content {
        width: 740rem;
    }
    .people_view_content_ttl {
        font-size: 32px;
        line-height: 1.6;
    }
    .people_view_content_item {
        margin-top: 60rem;
    }
    .people_view_content_item_ttl {
        padding-block: 5px;
        font-size: 26px;
    }
    .people_view_content_item_ttl::before {
        top: 25px;
    }
    .people_view_content_item_txt {
        margin-top: 10px;
        font-size: 16px;
    }
}
@media (max-width: 768px) {
    .people_view_content {
        margin-top: 80rem;
    }
    .people_view_content_ttl {
        font-size: 21rem;
        line-height: 1.77;
    }
    .people_view_content_item {
        margin-top: 40rem;
    }
    .people_view_content_item_ttl {
        padding-block: 5rem;
        font-size: 18rem;
    }
    .people_view_content_item_ttl::before {
        top: 18rem;
    }
    .people_view_content_item_txt {
        margin-top: 10rem;
        font-size: 14rem;
    }
}

@media (min-width: 769px) {
    .people .btn_back_wrap {
        margin-top: 180rem;
    }
    .people_view .btn_back_wrap {
        margin-top: 160rem;
    }
}
@media (max-width: 768px) {
    .btn_back_wrap {
        margin-top: 140rem;
    }
}
