@charset "UTF-8";
/* ============================================================
   WordPress版の追加スタイル（フォーム・管理バーなど）
   ============================================================ */

/* ログイン中の管理バー分、固定ヘッダーを下げる */
body.admin-bar header { top: 32px; }
@media screen and (max-width: 782px) { body.admin-bar header { top: 46px; } }

/* 縦長の人物写真でも顔が切れないよう上寄せ */
#fv .collage .c { background-position: center 25%; }
#fv .collage .c5, #fv .collage .c6 { background-position: center 12%; }
.post .eye { object-position: center 22%; }
#newsfeed .pitem .photo img { object-position: center 20%; }

/* ---------- スマホで人物写真が切れないように ---------- */
@media screen and (max-width: 767px) {
  /* 人を知る：6枚を縦長の枠で2列に */
  #know_the_people .photo { height: auto; display: grid; grid-template-columns: 1fr 1fr; }
  #know_the_people .photo div { position: static; width: auto; height: auto; aspect-ratio: 3 / 4; background-position: center 18%; }
  /* 採用情報の写真 */
  #recruit_info .base .img { height: auto; aspect-ratio: 4 / 3; background-position: center 18%; }
  /* 会社を知る：右の写真4枚 */
  #know_the_company .base .photo { height: auto; grid-template-rows: none; grid-auto-rows: auto; }
  #know_the_company .base .photo .img { aspect-ratio: 1 / 1; }
  /* インターン写真 */
  #internship .base .photo { height: auto; aspect-ratio: 4 / 3; }
  /* 環境を知る：大きい写真 */
  #know_the_environment .photo.p01 .main { height: auto; aspect-ratio: 4 / 3; }
  /* 下層ページ上部の写真 */
  #headarea.type1 .img { min-height: 0; aspect-ratio: 4 / 3; }
}

/* 枠内のバナー（マイナビ等） */
.infobox .banners { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 1.5em; margin-top: 2.2em; line-height: 0; }
.infobox .banners a { transition: opacity .3s; }
.infobox .banners a:hover { opacity: .7; }

/* プロフィールの名前 */
.profile .info .pname { font-weight: 800; font-size: 2.4em; line-height: 1.3; margin-top: .2em; }

/* 自由入力欄（プライバシーポリシーなど） */
.policy h2, .policy h3, .policy h4 { font-size: 1.25em; font-weight: 800; color: var(--blue); border-left: 6px solid var(--blue); padding-left: .8em; margin: 2.6em 0 1em; line-height: 1.5; }
.policy p { line-height: 2.1; margin-bottom: 1em; }
.policy a { color: var(--blue); text-decoration: underline; }
.policy ol { padding-left: 1.5em; margin: .8em 0; }
.policy ol li { line-height: 2; }

/* ブログ一覧のページ送り */
.pager { display: flex; justify-content: center; gap: .6em; margin-top: 3.5em; }
.pager .page-numbers { display: inline-flex; justify-content: center; align-items: center; min-width: 2.6em; height: 2.6em; border: 2px solid #000; font-weight: bold; font-family: var(--en); }
.pager .page-numbers.current, .pager a.page-numbers:hover { background: #000; color: #fff; }

/* ---------- Contact Form 7 ---------- */
.form .wpcf7-form-control-wrap { display: block; }
.form .wpcf7-radio { display: flex; flex-wrap: wrap; gap: .8em 1.6em; padding-top: .45em; }
.form .wpcf7-list-item { margin: 0; }
.form .wpcf7-list-item label { display: flex; align-items: center; gap: .5em; font-weight: bold; cursor: pointer; }
.form .wpcf7-list-item input { width: 1.2em; height: 1.2em; accent-color: var(--blue); }
.form .wpcf7-not-valid { border-color: #E60012 !important; }
.form .wpcf7-not-valid-tip { color: #E60012; font-size: .8125em; font-weight: bold; margin-top: .4em; }
.form .wpcf7-submit { display: flex; margin: 3em auto 0; border: none; cursor: pointer; font-family: inherit; -webkit-appearance: none; appearance: none; border-radius: 0; }
.form .wpcf7-submit:hover { background-color: #000; }
.form .wpcf7-spinner { display: block; margin: 1em auto 0; }
.form .wpcf7-response-output { margin: 2em 0 0 !important; padding: 1.2em 1.5em !important; border: 3px solid var(--blue) !important; font-weight: bold; text-align: center; line-height: 1.8; }
.form .wpcf7 form.invalid .wpcf7-response-output, .form .wpcf7 form.failed .wpcf7-response-output { border-color: #E60012 !important; color: #E60012; }
/* 送信完了後は入力欄を隠して完了メッセージを大きく */
.form .wpcf7 form.sent .row, .form .wpcf7 form.sent .wpcf7-submit, .form .wpcf7 form.sent .wpcf7-spinner { display: none; }
.form .wpcf7 form.sent .wpcf7-response-output { font-size: 1.25em; color: var(--blue); padding: 3em 2em !important; border-width: 4px !important; }