@charset "utf-8";

/* **************************************************

Name: voice3.css

Description: media/recruiting/voice/css/voice.css
Description: media/recruiting/voice/css/voice2.css の追加修正

Create: 2026.07.30
Update: 

Copyright 2026 Hitachi Systems, Ltd.

***************************************************** */
#Contents {
    overflow-x: clip;
    padding-bottom: 65px;
}

@media screen and (max-width: 767px) {
    #Contents {
        padding-bottom: inherit;
    }
}

#Contents > .GridSet > .Grid4 > #Grid4Reset {
    position: relative;
    width: 100vw;
    left: calc((100vw - 100%) / -2);
}

@media (max-width: 1304px) {
    #Contents > .GridSet > .Grid4 > #Grid4Reset {
        width: 100%;
        left: 0;
    }
}


.renew {
    font-family: "Hitachi Sans", "Noto Sans JP", "Yu Gothic UI", "Noto Sans", sans-serif;
}


.renew [class^="heading"] .photo img {
    width: 100%;
    object-fit: cover;
    object-position: top;
}

.renew .schedule .Grid4 > div {
    flex: 1;
}

@media screen and (min-width: 768px) {
    .renew .schedule .detail {
		max-width: 650px;
	}
}

.renew .schedule h2,
.renew .career h2{
	background: none;
}

.slick-slide img {
	width: 100%;
	height: 100%;
    object-fit: cover;
    object-position: top;
}

.renew .voiceBtn a {
    text-decoration: none;
    background: #222;
}

.renew .careerTimeline .item .point {
    background: #cc0000;
}

.renew .careerTimeline .item .point:before {
    border-top: 5px solid #cc0000;
}

.renew h2:after {
    background: #222;
}

.renew h2 {
    background: none;
}

.renew .voiceSlider .dots-voice li {
    border: 2px solid #222;
}

.renew .voiceSlider .dots-voice li:hover, .renew .voiceSlider .dots-voice li.slick-active {
    background: #222;
}

.renew .voiceSlider .autoplay-buttons[data-play="stop"]:before, .renew .voiceSlider .autoplay-buttons[data-play="play"]:before {
    content: url(/-/media/recruiting/voice/image/renew/stop2.svg);
}

.renew .Container.Wide.schedule:before, .renew .Container.Wide.career:before {
        left: 50%;
        transform: translateX(-50%);
}

.renew .schedule .detail dt {
    background-color: #222;
}

.renew .schedule .detail:nth-child(n+2) dt:before {
    border-top-color: #222;
}

.renew .schedule .detail:not(:last-child) dd:before {
    background-color: #222;
}


.renew [class^="heading"] .profile_title, .renew .voiceSlider .profile_title {
    font-weight: bold;
    top: 50%;
    bottom: 50%;
    margin: 0;
    padding: 0;
    color: #0C0C0C;

    &::after {
        display: none;
    }
}

.renew .headingList .profile_title {
    font-size: 1.25rem;
}

.renew [class^="heading"] .profile_title span, .renew .voiceSlider .profile_title span {
    background-color: #fff;
    display: inline-block;
    margin-top: 0.2rem;
    position: relative;
    z-index: 2;
    font-size: inherit;
    line-height: 160%;
}

.renew .headingList .profile_title span {
    padding: 0.5rem;
}

.renew .voiceSlider .profile_title span {
    padding: 0.25rem 0.5rem;
}