/*---------------------------
新人（freshers）詳細ページ専用パーツ
freshers/index.php の ?id= 詳細表示でのみ使用
---------------------------*/

/*このページでは氏名の下の下線は不要*/
.card_list_name::after { content:none; }

.fresh_hr { border:none; border-top:1px solid #e3e3e3; margin:40px 0; }
.h1_wrappers.is-detail { margin-bottom:0; }

/*写真＋プロフィール情報*/
.fresh_detail { display:flex; flex-direction:column; gap:32px; }
.fresh_detail_photo { width:60%; max-width:320px; margin:0 auto; }
.fresh_detail_photo img { width:100%; aspect-ratio:1/1; object-fit:cover; display:block; }
.fresh_detail_info { width:100%; }

.fresh_department { font-size:16px; margin-bottom:8px; }
.fresh_name_row { display:flex; align-items:baseline; flex-wrap:wrap; justify-content:space-between; gap:8px; margin-bottom:8px; }
.fresh_name { margin:0; font-size:26px; font-weight:bold; letter-spacing:0.05em; }
.fresh_ename { font-size:13px; font-weight:bold; color:#707070; letter-spacing:0.1em; }
.fresh_university { font-size:14px; color:#333; }

.fresh_block { border-top:1px solid #e3e3e3; padding-top:24px; margin-top:24px; }
.fresh_subheading { position:relative; display:flex; align-items:center; gap:24px; font-size:20px; font-weight:bold; margin-bottom:12px; }
.fresh_subheading::before { content:''; width:8px; height:8px; flex-shrink:0; background:#000; }
.fresh_block_text { font-size:14px; line-height:2; letter-spacing:0.05em; text-align:justify; }
.fresh_block_text.is-no-justify { text-align:left; }

@media screen and (min-width:769px){
    .fresh_detail { flex-direction:row; align-items:flex-start; gap:9.79vw; width:90%; margin-left:auto; margin-right:auto; }
    .fresh_detail_photo { width:25.43vw; max-width:none; margin:0; }
    .fresh_detail_info { flex:1; }
    .fresh_name { font-size:32px; }
}

/*THIS IS ME! セクション*/
.fresh_thisisme { position:relative; overflow:hidden; background:#333; color:#fff; padding:40px 24px; margin-top:80px; display:flex; flex-direction:column; gap:24px; }
.fresh_thisisme_bg { position:absolute; top:0; left:0; margin:0; font-size:15vw; line-height:1; color:rgba(255,255,255,0.08); white-space:nowrap; pointer-events:none; user-select:none; }
.fresh_thisisme_body { position:relative; z-index:1; }
.fresh_thisisme_heading { font-size:18px; font-weight:bold; margin:0 0 16px; }
.fresh_thisisme_text { font-size:14px; line-height:2; letter-spacing:0.05em; }
.fresh_thisisme_link { position:relative; display:inline-block; margin-top:16px; font-size:13px; color:#fff; text-decoration:none; }
.fresh_thisisme_link::after { content:''; position:absolute; left:0; bottom:-2px; width:100%; height:1px; background:#fff; transform:scaleX(1); transform-origin:left; transition:transform 0.3s ease; }
.fresh_thisisme_link:hover { color:#fff; }
.fresh_thisisme_link:hover::after { transform:scaleX(0); transform-origin:right; }
.fresh_thisisme_media { position:relative; z-index:1; }
.fresh_thisisme_media img { width:100%; aspect-ratio:605/424; object-fit:cover; display:block; }
.fresh_thisisme_play { position:relative; display:block; width:100%; padding:0; border:0; background:none; cursor:pointer; }
.fresh_thisisme_play img { width:100%; aspect-ratio:605/424; object-fit:cover; display:block; }
.fresh_thisisme_play_icon { position:absolute; top:50%; left:50%; width:56px; height:56px; transform:translate(-50%, -50%); border-radius:50%; background:rgba(0,0,0,0.55); }
.fresh_thisisme_play_icon::after { content:''; position:absolute; top:50%; left:54%; width:0; height:0; transform:translate(-50%, -50%); border-style:solid; border-width:9px 0 9px 16px; border-color:transparent transparent transparent #fff; }

@media screen and (min-width:769px){
    .fresh_thisisme { flex-direction:row; align-items:center; justify-content:space-between; gap:80px; padding:56px; margin-top:160px; }
    .fresh_thisisme_bg { font-size:8vw; }
    .fresh_thisisme_body { width:32%; }
    .fresh_thisisme_media { width:43.5%; }
    .fresh_thisisme_play_icon { width:72px; height:72px; }
    .fresh_thisisme_play_icon::after { border-width:12px 0 12px 20px; }
}

/*動画モーダル*/
.video_modal { position:fixed; inset:0; z-index:1000; display:none; align-items:center; justify-content:center; padding:24px; }
.video_modal.is-open { display:flex; }
.video_modal_overlay { position:absolute; inset:0; background:rgba(0,0,0,0.8); }
.video_modal_body { position:relative; z-index:1; width:100%; max-width:800px; padding:24px; }
.video_modal_close { position:absolute; top:-40px; right:0; width:36px; height:36px; border:0; background:none; font-size:28px; line-height:1; color:#fff; cursor:pointer; }
.video_modal_content { max-height:90vh; overflow-y:auto; }
.video_modal_frame { position:relative; width:100%; aspect-ratio:16/9; background:#000; }
.video_modal_frame iframe { position:absolute; inset:0; width:100%; height:100%; border:0; display:block; }
.video_modal_caption { margin-top:16px; font-size:14px; line-height:2; letter-spacing:0.05em; color:#fff; }
body.is-modal-open { overflow:hidden; }

@media screen and (min-width:769px){
    .video_modal_body { padding:32px; }
    .video_modal_close { top:0; }
}

/*OTHERS：自動で右から左に流れるカード一覧*/
.fresh_others_heading { display:flex; align-items:baseline; gap:16px; margin-bottom:32px; }
.fresh_others_en { font-size:26px; font-weight:bold; letter-spacing:0.05em; margin:0; }
.fresh_others_sub { font-size:15px; color:#707070; }
.fresh_others_viewport { overflow:hidden; touch-action:pan-y; }
.fresh_others_track { display:flex; width:max-content; gap:44px; will-change:transform; transform:translateZ(0); backface-visibility:hidden; }
/* PC/タブレットのみCSSアニメーションで自動再生。スマホはJS(fresh_others.js)がtransformを直接制御し、ドラッグ操作も受け付ける */
@media screen and (min-width:769px){
    .fresh_others_track { animation:fresh-marquee 240s linear infinite; }
    .fresh_others_viewport:hover .fresh_others_track { animation-play-state:paused; }
}
.fresh_other_card { display:block; width:130px; flex-shrink:0; }
.fresh_other_photo { display:block; aspect-ratio:1/1; overflow:hidden; margin-bottom:12px; }
.fresh_other_photo img { width:100%; height:100%; object-fit:cover; display:block; }
.fresh_other_department { height:2.4em; display:block; font-size:12px; line-height:1.2; color:#707070; }
.fresh_other_name { display:block; font-size:16px; margin-bottom:4px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.fresh_other_university { position:relative; display:block; font-size:12px; color:#000; padding-bottom:8px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; line-height:1.7em; }
.fresh_other_university::after { content:''; position:absolute; left:0; bottom:0; width:42px; height:1px; background:#000; }

@keyframes fresh-marquee {
    from { transform:translateX(0); }
    to { transform:translateX(calc(-100% / var(--fresh-others-copies, 2))); }
}

.fresh_others { border-top:1px solid #E3E3E3; padding-top:40px; }
@media screen and (min-width:769px){
    .fresh_others { padding-top:80px; }
    .fresh_others_en { font-size:35px; }
    .fresh_other_card { width:170px; }
}

/*一覧に戻る*/
.fresh_back { display:inline-flex; align-items:center; gap:8px; margin-top:80px; font-size:13px; }
@media screen and (min-width:769px){
    .fresh_back { margin-top:120px; }
}

.h1_text { margin-bottom:0; }
.card_list.cols-4 { margin-top:40px; grid-template-columns:repeat(2, 1fr); }
.card_list_name { padding-bottom:0; }
.page_link_nav.is-top-spaced { margin-top:40px; margin-bottom:64px; }
@media screen and (min-width:769px){
    .card_list.cols-4 { margin-top:100px; grid-template-columns:repeat(5, 1fr); }
    .page_link_nav.is-top-spaced { margin-top:40px; margin-bottom:80px; }
}