@charset "UTF-8";
/* CSS Document */

/* =========================== */
/* 共通スタイル */
/* =========================== */
.container {
  max-width: 1200px;
  margin: 0 auto;
}

/* セクションタイトル - 統一スタイル */
.section-title {
  width: 700px;
  height: 54px;
  max-width: 100%;
  font-size: 32px;
  font-weight: normal;
  background-color: #C9E9DC;
  padding: 10px 20px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* セクション説明文 */
.section-description {
  max-width: 980px;
  font-size: 16px;
  line-height: 1.8;
  margin: 30px auto;
  color: #555;
}

/* =========================== */
/* 仕事紹介ページ ヘッダー */
/* =========================== */
.about-header {
  width: 100%;
  margin-top: 120px; /* ヘッダーの高さ分を確保 */
}

.about-header-img {
  width: 100%;
  height: auto;
  display: block;
}

.about-header-sp {
  width: 100%;
  height: auto;
  display: block;
}

/* =========================== */
/* 1. 導入セクション */
/* =========================== */
.about-intro {
  margin: 80px auto 80px; /* 修正：上下のマージンを調整して重なりを防ぐ */
  max-width: 1200px;
  padding: 20px 0; /* 追加：内部にパディングを追加 */
}

.about-intro p {
  font-size: 18px;
  line-height: 1.8;
  color: #555;
}

/* 笑顔のメッセージ画像 */
.about-smile-img {
  display: block;
  width: 100%;
  max-width: 360px;
  height: auto;
}

/* 右側のスタッフ画像 */
.about-staff-group {
  width: 100%;
  height: auto;
}

/* =========================== */
/* 2. そうごう薬局で働くRCS職の魅力 */
/* =========================== */
.about-rcs-benefits {
  text-align: center;
  max-width: 1200px;
  margin: 60px auto; /* 修正：上下のマージンをはっきり指定 */
  padding: 20px 0; /* 追加：内部にパディングを追加 */
}

.about-rcs-benefits .section-title {
  width: 700px;
  height: auto;
  max-width: 100%;
  font-size: 32px;
  font-weight: normal;
  background-color: #C9E9DC;
  padding: 10px 20px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
}

.about-rcs-benefits .section-description {
  max-width: 980px;
  font-size: 16px;
  text-align: left !important;
  line-height: 1.8;
  margin: 30px auto;
  padding: 0 15px; /* 追加：左右のパディング */
}

/* 魅力ポイントのグリッドレイアウト */
.benefits-grid {
  margin: 0 auto;
}

/* 各魅力ポイント */
.benefit-item {
  text-align: center;
  margin-bottom: 20px;
}

.benefit-item img {
  width: 100%;
  max-width: 100%;
  height: auto;
}

/* =========================== */
/* 3. 一日の流れセクション */
/* =========================== */
.day-schedule {
  margin: 60px auto; /* 上下のマージンを設定 */
}

/* セクションタイトル */
.day-schedule .section-title {
  width: 700px;
  height: 54px;
  max-width: 100%;
  font-size: 32px;
  font-weight: normal;
  background-color: #C9E9DC;
  padding: 10px 20px;
  margin: 0 auto 30px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* 全体ラッパー */
.day-schedule-wrapper {
  /* border-radiusを削除 */
}

/* 動画コンテナ */
.video-container {
  width: 328px;
  height: 580px;
  max-width: 100%;
  border: 1px solid #eee;
  margin: 0 auto;
}

.video-container iframe {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* タイムライン全体 */
.day-schedule-timeline {
  position: relative;
  padding: 0 15px;
}

/* =============== PC/タブレット版タイムライン =============== */
.timeline-desktop {
  position: relative;
}

/* タイムライン中央線 */
.timeline-line {
  position: absolute;
  width: 1px;
  background-color: #000; /* 黒に変更 */
  left: 60px; /* 修正: 時間画像の中央に配置 */
  top: 40px;
  bottom: 20px;
  z-index: 1;
}

/* タイムラインアイテム */
.timeline-item {
  position: relative;
  margin-bottom: 40px;
  z-index: 2;
}

/* タイムライン時間表示 */
.timeline-time {
  width: 120px; /* 幅を固定して均等に */
  margin-right: 20px;
  position: relative;
  z-index: 3;
  text-align: center; /* 中央揃え */
}

.timeline-time img {
  width: 100px;
  height: auto;
  display: inline-block; /* インラインブロック化 */
}

/* タイムラインコンテンツ */
.timeline-content {
  flex: 1;
  padding-top: 15px;
}

/* タイムラインテキスト部分 */
.timeline-text {
  max-width: 280px;
}

/* タイムラインタイトル */
.timeline-title {
  color: #008E44;
  font-size: 22px;
  font-weight: bold;
  margin-bottom: 10px;
}

/* タイムラインリスト */
.timeline-list {
  padding-left: 25px;
  margin-bottom: 15px;
}

.timeline-list li {
  font-size: 16px;
  margin-bottom: 5px;
  color: #333;
}

/* タイムライン画像 */
.timeline-image {
  text-align: right;
  max-width: 190px;
}

.timeline-image img {
  max-width: 100%;
  height: auto;
}

/* 閉店セクション */
.closing-section {
  position: relative;
  margin-top: 30px;
}

.closing-item {
  margin-bottom: 20px;
}

.closing-item:last-child {
  margin-bottom: 0;
}

/* 閉店共通画像 */
.closing-image {
  position: absolute;
  right: 0;
  top: 20px;
  max-width: 190px;
}

.closing-image img {
  max-width: 100%;
  height: auto;
}

/* =============== スマホ版タイムライン =============== */
.timeline-mobile {
  position: relative;
  padding: 20px 0;
  max-width: 350px;
  margin: 0 auto;
}

/* タイムライン中央線 */
.timeline-mobile-line {
  position: absolute;
  width: 1px;
  background-color: #000;
  left: 40px;
  top: 50px;
  bottom: 60px;
  z-index: 1;
}

/* すべてのタイムラインアイテム */
.timeline-mobile-item {
  position: relative;
  display: flex;
  z-index: 2;
  margin-bottom: 20px;
  align-items: flex-start; /* 基本は上揃え */
}

/* 時間表示エリア */
.timeline-mobile-time {
  width: 80px;
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 45px;
  z-index: 3;
}

.timeline-mobile-time img {
  width: 80px;
  height: auto;
}

/* コンテンツエリア */
.timeline-mobile-content {
  flex: 1;
  padding-left: 20px;
}

/* タイトル */
.timeline-mobile-content .timeline-title {
  color: #008E44;
  font-size: 18px;
  font-weight: bold;
  margin: 0 0 10px 0;
  display: flex;
  align-items: center;
  min-height: 45px;
  text-align: left !important;
}

/* リスト */
.timeline-mobile-content .timeline-list {
  padding-left: 20px;
  margin-bottom: 10px;
  list-style-type: disc;
  width: 100%;
}

.timeline-mobile-content .timeline-list li {
  font-size: 14px;
  margin-bottom: 3px;
  color: #333;
  text-align: left;
}

/* 画像 */
.timeline-mobile-image {
  margin-top: 10px;
  width: 100%;
}

.timeline-mobile-image img {
  max-width: 100%;
  height: auto;
}

/* 時間表示がない項目（午前業務など） */
.timeline-mobile-item.no-time {
  padding-left: 80px; /* time-imageの幅分左にずらす */
  margin-top: -5px; /* 前の項目との間隔を詰める */
  align-items: flex-start; /* 上揃えに */
}

/* 時間表示がない項目のタイトル */
.timeline-mobile-item.no-time .timeline-mobile-content .timeline-title {
  min-height: auto; /* 高さ制限を解除 */
  padding-top: 0;
}

/* モバイル表示時の調整 */
@media (max-width: 767.98px) {
  /* 時間表示エリア - 常に中央揃え */
  .timeline-mobile-time {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important; /* 垂直方向中央揃え */
    min-height: 45px !important;
    padding-top: 0 !important;
  }
  
  /* タイトル - 常に中央揃え */
  .timeline-mobile-content .timeline-title {
    display: flex !important;
    align-items: center !important; /* 垂直方向中央揃え */
    min-height: 45px !important;
    margin-top: 0 !important;
    text-align: left !important;
  }
  
  /* 親要素の調整 */
  .timeline-mobile-item {
    align-items: flex-start !important; /* 親要素は上揃え */
  }
  
  /* リストの位置調整 */
  .timeline-mobile-content .timeline-list {
    margin-top: 5px !important;
  }
  
  /* 時間表示のない項目（午前業務など） */
  .timeline-mobile-item.no-time {
    padding-left: 80px !important; 
    margin-top: -5px !important;
  }
  
  /* 8:50（出社）の特別調整 */
  .timeline-mobile-item:first-child .timeline-mobile-time,
  .timeline-mobile-item:first-child .timeline-mobile-content .timeline-title {
    min-height: 45px !important;
    padding-top: 0 !important;
  }
  
  /* 9:00（開店）の調整 */
  .timeline-mobile-item:nth-child(2) .timeline-mobile-time,
  .timeline-mobile-item:nth-child(2) .timeline-mobile-content .timeline-title {
    min-height: 45px !important;
  }
  
  /* 13:00（お昼休憩）の調整 */
  .timeline-mobile-item:nth-child(4) .timeline-mobile-time,
  .timeline-mobile-item:nth-child(4) .timeline-mobile-content .timeline-title {
    min-height: 45px !important;
  }
  
  /* 14:00（午後業務）の調整 */
  .timeline-mobile-item:nth-child(5) .timeline-mobile-time,
  .timeline-mobile-item:nth-child(5) .timeline-mobile-content .timeline-title {
    min-height: 45px !important;
  }
  
  /* 17:50（閉店業務）の調整 */
  .timeline-mobile-item:nth-child(6) .timeline-mobile-time,
  .timeline-mobile-item:nth-child(6) .timeline-mobile-content .timeline-title {
    min-height: 45px !important;
  }
  
  /* 18:00（閉店・退社）の調整 */
  .timeline-mobile-item:nth-child(7) .timeline-mobile-time,
  .timeline-mobile-item:nth-child(7) .timeline-mobile-content .timeline-title {
    min-height: 45px !important;
  }
  
  /* リストがある項目の時間表示微調整 */
  .timeline-mobile-item:has(.timeline-list) .timeline-mobile-time {
    padding-top: 0 !important;
  }
}

/* =========================== */
/* 4. 主な接客・事務業務 */
/* =========================== */
.about-tasks {
  max-width: 1200px;
  margin: 60px auto;
  padding: 20px 0;
}

.about-tasks .section-title {
  width: 700px;
  height: auto;
  max-width: 100%;
  font-size: 32px;
  font-weight: normal;
  background-color: #C9E9DC;
  padding: 10px 20px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
}

.about-tasks .section-description {
  max-width: 980px;
  font-size: 16px;
  text-align: center !important;
  line-height: 1.8;
  margin: 30px auto;
}

/* 業務アイテム */
.task-item {
  position: relative;
  border: 1px solid #e0e0e0;
  background-color: #fff;
  /* border-radiusを削除 */
  overflow: hidden;
  transition: all 0.3s ease;
}

/* RCSタイプのアイテムには緑色の枠線 */
.task-item.rcs-item {
  border: 4px solid #97D5BB !important;
}

/* タスク番号と種類とタイトル */
.task-header {
  display: flex;
  justify-content: center; /* 中央寄せに変更 */
  align-items: center;
  padding: 10px 15px 0;
  text-align: center;
}

.task-number {
  font-family: 'Yomogi', cursive; /* Yomogiフォントを適用 */
  font-size: 28px;
  color: #28813b;
  margin-right: 5px;
  vertical-align: bottom; /* 下揃え */
}

.task-title h3 {
  font-size: 18px;
  font-weight: bold;
  color: #000;
  margin: 0;
  padding: 0;
  display: inline; /* インライン表示 */
  vertical-align: bottom; /* 下揃え */
}

.task-type {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 14px;
  font-size: 0.75rem;
  font-weight: bold;
  color: #fff;
  margin-left: 10px;
}

.task-type.rcs {
  background-color: #4FB383;
}

.task-type.pharmacist {
  background-color: #BFBFBF;
}

/* タスク内容 */
.task-content {
  padding: 15px;
}

.task-content p {
  font-size: 16px;
  color: #000;
  line-height: 1.6;
  text-align: left;
  margin-bottom: 15px;
}

.task-image {
  width: 100%;
  text-align: center;
}

/* =========================== */
/* 5. レセプト業務 */
/* =========================== */
.about-receipt {
  margin: 60px auto;
  padding: 20px 0;
}

.about-receipt .section-title {
  width: 700px;
  height: 54px;
  max-width: 100%;
  font-size: 32px;
  font-weight: normal;
  background-color: #C9E9DC;
  padding: 10px 20px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
}

.about-receipt .section-description {
  max-width: 980px;
  font-size: 16px;
  text-align: center !important;
  line-height: 1.8;
  margin: 30px auto;
}

/* レセプト情報エリア */
.receipt-info {
  margin-bottom: 0; /* 上下の間隔を縮小 */
  padding: 50px 30px;
}

.receipt-flow {
  text-align: center;
}

.flow-image {
  max-width: 100%;
  height: auto;
}

.receipt-speech-container {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
}

.speech-staff-image {
  max-width: 100%;
  height: auto;
}

/* レセプト業務画像（1枚絵） */
.receipt-work {
  margin-top: 0; /* 上のマージンを削除 */
  text-align: center;
}

.work-image {
  width: 100%;
  height: auto;
  display: block;
}

/* スマホサイズ対応 */
@media (max-width: 767.98px) {
  .receipt-info {
    margin-bottom: 0px; /* スマホではさらに縮小 */
    padding: 40px 15px; /* パディングも調整 */
  }
  
  .receipt-content {
    padding: 15px;
    max-width: 100%; /* スマホでも横幅いっぱいに表示 */
  }
  
  /* フロー図の余白を調整 */
  .receipt-flow {
    padding: 0 10px; /* 左右に余白を追加 */
  }
  
  /* 吹き出しコンテナにも余白調整 */
  .receipt-speech-container {
    padding: 0 10px;
  }
}

/* =========================== */
/* 6. 店頭商品等の相談・販売（更新版） */
/* =========================== */
.store-sales-content{
  background-color: #fff;
  padding: 30px;
}
.job-content-container {
  padding: 20px;
  border: 1px solid #A5A5A5;
}
/* スマホサイズでpadding調整 */
@media (max-width: 767.98px) {
  .job-content-container {
    padding: 20px;
  }
}
/* 仕事内容リスト全体 */
.job-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.job-description li{
	list-style: none;
}
/* 各仕事項目 */
.job-list-item {
  margin-bottom: 15px;
}

.job-list-item:last-child {
  margin-bottom: 0;
}

/* 仕事項目タイトル */
.job-item-title {
  color: #000;
  font-size: 18px;
  margin-bottom: 5px;
  display: flex;
  align-items: center;
}

/* 緑丸マーカー */
.job-item-marker {
  display: inline-block;
  width: 12px;
  height: 12px;
  background-color: #008E44;
  border-radius: 50%;
  margin-right: 8px;
}

/* 仕事項目テキスト */
.job-item-text {
  font-size: 14px;
  color: #000;
  line-height: 1.5;
  margin: 0 0 0 20px; /* 左側にマーカー分の余白 */
}

/* 仕事内容ボックス */
.store-sales-box {
  background-color: #fff;
　padding: 20px;
}

/* POPイメージのスタイリング（既存を微調整） */
.job-pop {
  padding-top: 50px;
}

/* レスポンシブ調整 */
@media (max-width: 767.98px) {
   /* スマホでの余白調整 */
  .store-sales-content {
    padding: 20px 15px; /* 外側の余白を縮小 */
  }
  
  .store-sales-box {
    padding: 15px !important; /* ボックス内パディング調整 */
  }
  
 
  .job-info {
    padding-top: 15px; /* スマホでは上部余白を小さく */
  }
  
  .job-content-container {
    padding: 15px; /* 内側のパディングも縮小 */
  }
  
  /* POPイメージの上部余白調整 */
  .job-pop {
    padding-top: 20px; /* スマホでは上部余白を小さく */
  }
	/* スマホサイズで仕事項目を小さく */
  .job-item-title {
    font-size: 14px;
  }
  
  .job-item-text {
    font-size: 12px;
  }
  
  /* スマホサイズでマージン調整 */
  .job-list-item {
    margin-bottom: 10px;
  }
  
  /* スマホサイズでボックス内パディング調整 */
  .store-sales-box {
    padding: 15px !important;
  }
  
  /* スマホサイズでジョブタイトルを小さく */
  .job-title {
    font-size: 12px;
    padding: 3px 15px !important;
  }
}

/* タブレットサイズ対応 */
@media (min-width: 768px) and (max-width: 991.98px) {
  .job-item-title {
    font-size: 15px;
  }
  
  .job-item-text {
    font-size: 13px;
  }
}

/* =========================== */
/* 7. 健康サポートイベントの運営 */
/* =========================== */
.about-health-support {
  margin: 60px auto;
  padding: 30px 0;
}

.about-health-support .section-title {
  width: 700px;
  height: 54px;
  max-width: 100%;
  font-size: 32px;
  font-weight: normal;
  background-color: #C9E9DC;
  padding: 10px 20px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
}

.about-health-support .section-description {
  font-size: 1rem;
  line-height: 1.6;
  color: #555;
  max-width: 800px;
  margin: 30px auto;
  text-align: center;
}

/* 健康サポート情報コンテナ */
.health-support-content {
  background-color: #fff;
  padding: 30px;
}

/* イベントでの役割ボックス - 店頭商品と同様のスタイル */
.event-role-box {
  background-color: #fff;
  position: relative;
}

/* イベントタイトル - 店頭商品と同様のスタイル */
.event-title {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: #fff;
  padding: 0 15px;
  font-weight: bold;
  z-index: 1;
  margin-top: 3px; /* タイトルを少し下げて枠線と重なるように調整 */
}

/* イベント情報エリア */
.event-info {
  padding-top: 30px;
}

/* イベントコンテンツコンテナ */
.event-content-container {
  border: 1px solid #A5A5A5; /* 店頭商品セクションと同じ色に合わせる */
  padding: 20px;
}

/* イベント項目リスト */
.event-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

/* 各イベント項目 */
.event-list-item {
  margin-bottom: 15px;
}

.event-list-item:last-child {
  margin-bottom: 0;
}

/* イベント項目タイトル */
.event-item-title {
  color: #000;
  font-size: 16px;
  margin-bottom: 5px;
}

/* 緑丸マーカー */
.event-item-marker {
  display: inline-block;
  width: 12px;
  height: 12px;
  background-color: #008E44;
  border-radius: 50%;
  margin-right: 8px;
  flex-shrink: 0;
  margin-top: 5px;
}

/* イベント項目テキスト */
.event-item-text {
  font-size: 16px;
  color: #000;
  line-height: 1.5;
  margin: 0; /* 左側にマーカー分の余白 */
}

/* イベント画像 */
.event-image {
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
}

.event-image img {
  max-width: 100%;
  height: auto;
}

/* 吹き出しメッセージエリア */
.health-support-message {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
}

.health-support-message img {
  max-width: 100%;
  height: auto;
}

/* イベント写真 - マージンを0にして直接くっつける */
.health-support-event {
  margin-top: 0;
}

.health-support-event img {
  width: 100%;
  height: auto;
}

/* スマホサイズ対応 */
@media (max-width: 767.98px) {
  .about-health-support {
    margin: 40px auto;
    padding: 0 15px;
  }
  
  .health-support-content {
    padding: 20px 15px;
    max-width: 350px;
    margin-left: auto;
    margin-right: auto;
  }
  
  .event-role-box {
    padding: 15px !important;
  }
  
  .event-title {
    font-size: 12px;
    padding: 0 10px !important;
  }
  
  .event-info {
    padding-top: 15px;
  }
  
  .event-content-container {
    padding: 15px;
  }
  
  .event-item-title {
    font-size: 14px;
  }
  
  .event-item-text {
    font-size: 12px;
  }
  
  /* スマホでのリストと画像の調整 */
  .event-description {
    margin-bottom: 20px;
  }
  
  .health-support-event {
    max-width: 350px;
    margin-left: auto;
    margin-right: auto;
  }
}

/* タブレットサイズ対応 */
@media (min-width: 768px) and (max-width: 991.98px) {
  .event-item-title {
    font-size: 15px;
  }
  
  .event-item-text {
    font-size: 13px;
  }
}
/* =========================== */
/* レスポンシブ対応 */
/* =========================== */

/* タブレットサイズ対応 */
@media (max-width: 991.98px) {
  .section-title {
    font-size: 28px;
    width: 600px;
  }
  
  /* 一日の流れセクション - タブレット */
  .video-container {
    width: 280px;
    height: 500px;
  }
  
  .timeline-line {
    left: 50px; /* タブレットでは左に寄せる */
  }
  
  .timeline-time {
    width: 100px;
  }
  
  .timeline-time img {
    width: 80px;
  }
  
  .timeline-title {
    font-size: 20px;
  }
  
  .timeline-list li {
    font-size: 15px;
  }
  
  .timeline-image {
    max-width: 150px;
  }
  
  .closing-image {
    max-width: 150px;
  }
  
  /* 主な接客・事務業務 - タブレット */
  .task-number, .task-title h3 {
    font-size: 1.1rem;
  }
  
  .task-content p {
    font-size: 16px;
  }
  
  /* レセプト業務 - タブレット */
  .about-receipt .section-description {
    font-size: 16px;
  }
  
  /* 店頭商品等の相談・販売 - タブレット */
  .about-store-sales .section-description {
    font-size: 16px;

  }
  
  /* 健康サポートの取り組み - タブレット */
  .about-health-support .section-description {
    font-size: 16px;
  }
  
  .health-support-title {
    font-size: 15px;
  }
}

/* スマホサイズ対応 */
@media (max-width: 767.98px) {
  /* セクションタイトル - スマホ統一スタイル */
  .section-title,
  .about-rcs-benefits .section-title,
  .day-schedule .section-title,
  .about-tasks .section-title,
  .about-receipt .section-title,
  .about-store-sales .section-title,
  .about-health-support .section-title {
    width: 350px;
    height: auto;
    font-size: 18px;
    font-weight: normal;
    padding: 10px 15px;
  }
  
  .about-header {
    margin-top: 80px;
  }
  
  /* 導入セクション - スマホ */
  .about-intro {
    margin: 40px auto 40px !important; /* 重要度を上げて確実に適用 */
    padding: 0 15px; /* スマホではパディングを調整 */
  }
  
  .about-intro p {
    font-size: 16px; /* スマホでフォントサイズを小さく */
    margin-bottom: 25px; /* 段落の下マージンを増やす */
  }
  
  .about-intro .text-1 {
    margin-bottom: 30px !important; /* 最初のテキストの下マージンを増やす */
  }
  
  .about-intro .text-2 {
    margin-top: 30px !important; /* 2番目のテキストの上マージンを増やす */
    margin-bottom: 30px !important; /* 2番目のテキストの下マージンを増やす */
  }
  
  .about-smile-img {
    margin: 0 auto 30px; /* 中央寄せと下マージン追加 */
  }
  
  /* そうごう薬局で働くRCS職の魅力 - スマホ */
  .about-rcs-benefits {
    margin: 40px auto !important; /* 重要度を上げて確実に適用 */
    padding: 20px 10px; /* スマホではパディングを調整 */
  }
  
  .about-rcs-benefits .section-description {
    text-align: center !important; /* スマホでは中央寄せに */
    font-size: 14px;
    padding: 0 10px;
  }
  
  .benefit-item {
    margin-bottom: 15px;
  }
  
  .section-description {
    font-size: 14px;
  }
  
  /* 一日の流れセクション - スマホ */
  .day-schedule {
    margin: 40px auto;
  }
  
  .video-container {
    width: 100%;
    max-width: 320px;
    height: 560px;
    margin: 0 auto;
  }
  
  /* 主な接客・事務業務 - スマホ */
  .about-tasks {
    margin: 40px auto;
    padding: 0 15px;
  }
  
  .task-number{
    font-size: 28px;
  }
  .task-title h3 {
    font-size: 18px;
  }
  
  .task-content p {
    font-size: 14px;
  }
  
  /* レセプト業務 - スマホ */
  .about-receipt {
    margin: 40px auto;
    padding: 0 15px;
  }
  
  .about-receipt .section-description {
    font-size: 0.9rem;
  }
  
  .receipt-flow, .receipt-speech-container {
    text-align: center;
  }
  
  /* 店頭商品等の相談・販売 - スマホ */
  .about-store-sales {
    margin: 40px auto;
    padding: 0 15px;
  }
  
  .about-store-sales .section-description {
    font-size: 0.9rem;
  }
  
  .job-title {
    font-size: 12px;
  }
  
  /* 健康サポートの取り組み - スマホ */
  .about-health-support {
    margin: 40px auto;
    padding: 0 15px;
  }
  
  .about-health-support .section-description {
    font-size: 0.9rem;
  }
  
  .health-support-title {
    font-size: 14px;
    text-align: center;
  }
  
  /* スマホサイズでの中央寄せ (全セクション共通) */
  .about-intro,
  .about-rcs-benefits,
  .day-schedule-wrapper,
  .about-tasks,
  .receipt-content,
  .receipt-info,
  .receipt-work,
  .store-sales-content,
  .store-sales-photos,
  .health-support-content,
  .health-support-event {
    max-width: 350px;
    margin-left: auto;
    margin-right: auto;
	padding-left: 0!important;
	padding-right: 0!important;

  }
  /* すべてのセクション説明文を左寄せに統一 */
  .section-description,
  .about-rcs-benefits .section-description,
  .day-schedule .section-description,
  .about-tasks .section-description,
  .about-receipt .section-description,
  .about-store-sales .section-description,
  .about-health-support .section-description {
    text-align: left !important;
    padding: 0 15px;
  }
  /* 店頭商品等の相談・販売セクションのタイトル調整 */
  .job-title {
    margin-top: 0 !important;
  }
  
  /* 健康サポートイベントの運営セクションのタイトル調整 */
  .event-title {
    margin-top: 10px !important;
  }
  /* 店頭商品等の相談・販売セクション */
  .store-sales-content {
    padding: 15px 15px !important; /* 上下左右のパディングを減らす */
  }
  
  .store-sales-box {
    padding: 10px !important; /* ボックス内のパディングをさらに減らす */
  }
  
  /* 健康サポートイベントの運営セクション */
  .health-support-content {
    padding: 15px 15px !important; /* 上下左右のパディングを減らす */
  }
  
  .event-role-box {
    padding: 10px !important; /* ボックス内のパディングをさらに減らす */
  }
  
  /* イベント情報エリアの上部パディング調整 */
  .event-info, .job-info {
    padding-top: 10px !important; /* 上部パディングをさらに減らす */
  }
  
  /* コンテンツコンテナの内部パディング調整 */
  .job-content-container, .event-content-container {
    padding: 20px 12px !important; /* 内部パディングをさらに減らす */
  }
/* イベント項目テキスト */
.event-item-text {
  font-size: 14px;
  color: #000;
  line-height: 1.5;
  margin-left: 0px!important; /* 左側にマーカー分の余白 */
}

}