﻿/* =============================================================
   company-lp.css
   医療介護マッチングサービス「つなぐ」採用企業向けLP
   ============================================================= */

/* -------------------------------------------------------------
   CSS 変数
   ------------------------------------------------------------- */
:root {
  --clp-blue:        #0145C4;   /* 見出し・アクセント青 */
  --clp-blue-dark:   #1a6fb8;
  --clp-red:         #EF0000;   /* CTAボタン赤 */
  --clp-red-dark:    #DB0000;
  --clp-cyan:        #4dcfdc;   /* サブカラー水色 */
  --clp-text:        #333333;
  --clp-text-sub:    #313131666;
  --clp-bg:          #f5fafd;
  --clp-white:       #ffffff;
  --clp-inner:       1080px;
  --clp-radius:      8px;
}

/* -------------------------------------------------------------
   リセット・ベース
   ------------------------------------------------------------- */
.clp *,
.clp *::before,
.clp *::after {
  box-sizing: border-box;
}

.clp {
  font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
  color: var(--clp-text);
  line-height: 1.7;
  overflow-x: hidden;
}

.clp img {
  max-width: 100%;
  height: auto;
  display: block;
}

/* -------------------------------------------------------------
   共通インナー
   ------------------------------------------------------------- */
.clp-inner {
  max-width: var(--clp-inner);
  margin: 0 auto;
  padding: 0 40px;
}

@media (max-width: 660px) {
  .clp-inner {
    padding: 0 20px;
  }
}

/* -------------------------------------------------------------
   共通ボタン
   ------------------------------------------------------------- */
.clp-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 28px;
  border-radius: 50px;
  font-size: 15px;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
	box-shadow: 0 3px 0 #DB0000;
	transition:all ease 0.3s;
	-webkit-transition:all ease 0.3s;
	-moz-transition:all ease 0.3s;
}

.clp-btn:hover {
	box-shadow: 0 0px 0 #DB0000;
}

.clp-btn--red {
  background: var(--clp-red);
  color: var(--clp-white);
  border: 2px solid var(--clp-red);
}

.clp-btn--outline-red {
  background: var(--clp-white);
  color: var(--clp-red);
  border: 2px solid var(--clp-red);
	justify-content: center;
}
a.clp-btn--red:hover {
  color:#FFF!important;
}

.clp-btn__icon {
  width: 18px;
  height: auto;
  display: inline-block;
}


/* -------------------------------------------------------------
   HERO
   ------------------------------------------------------------- */
.clp-hero {
  position: relative;
  min-height: 480px;
  overflow: hidden;
}

/* 背景画像 */
.clp-hero__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.clp-hero__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
}

/* 内側レイアウト */
.clp-hero__inner {
  position: relative;
  z-index: 1;
  max-width:1400px;
  margin: 0 auto;
  padding: 60px 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
}

/* テキスト側 */
.clp-hero__content {
  flex: 0 0 auto;
  max-width: 680px;
}

/* キャンペーンバッジ */
.clp-hero__badge {
  display: inline-block;
  color:#FF0000;
  border: 1.5px solid #FF0000;
  border-radius: 50px;
  font-size: 16px;
  font-weight: 700;
  padding: 4px 16px;
  margin-bottom: 16px;
}

/* 見出し */
.clp-hero__title {
  font-size: clamp(28px, 4vw, 52px);
  font-weight: 600;
  line-height: 1.35;
  color:#313131;
  margin: 0 0 16px;
	letter-spacing: 3px;
}

.clp-hero__title-b {
  color:#0145C4;
}
.clp-hero__title-s {
  font-size: clamp(16px, 4vw, 36px);
}

/* サブコピー */
.clp-hero__copy {
  font-size: 14px;
  color: var(--clp-text);
  line-height: 1.8;
  margin: 0 0 28px;
}

/* CTAボタン群 */
.clp-hero__btns {
  display: grid;
	gap:1rem;
	grid-template-columns: repeat(2, 1fr);
}

/* イラスト側 */
.clp-hero__image {
  flex: 0 0 auto;
  width: 42%;
  max-width: 560px;
}

.clp-hero__image img {
  width: 100%;
}

/* -------------------------------------------------------------
   レスポンシブ：Hero
   ------------------------------------------------------------- */
@media (max-width: 900px) {
  .clp-hero__inner {
    flex-direction: column;
    align-items: flex-start;
    padding: 40px 24px;
    gap: 24px;
  }

  .clp-hero__content {
    max-width: 100%;
	  width: 100%;
	  text-align: center;
  }

  .clp-hero__image {
    width: 70%;
    max-width: 320px;
    margin: 0 auto;
  }
  .clp-hero__btns {
    justify-content: center;
  }
.clp-hero__image img {
  display: none;
}
.clp-hero {
  min-height: auto;
}
}

@media (max-width: 660px) {
.clp-btn {
    justify-content: center;
    padding:0.7rem;
    font-size: 16px;
  }
.clp-hero__btns {
  gap: 1rem;
  grid-template-columns: repeat(1, 1fr);
}
.clp-hero__badge {
  border: 3px solid #F00;
  font-size: 14px;
}
.clp-hero__copy {
  font-size: 14px;
  margin: 0 0 20px;
  text-align: left;
}
.clp-hero__copy br{
  display:none;
}
.clp-hero__inner {
    padding: 50px 24px 30px;
    gap: 24px;
}
}

/* -------------------------------------------------------------
   キャンペーン
   ------------------------------------------------------------- */
.clp-campaign {
  background: #fff;
  padding: 64px 40px;
  text-align: center;
}

.clp-campaign__inner {
  max-width: var(--clp-inner);
  margin: 0 auto;
}

/* ＼期間限定／ */
.clp-campaign__label {
  font-size: 24px;
  font-weight: 700;
  color: var(--clp-red);
  margin: 0 0 6px;
  letter-spacing: 1px;
}

/* メインタイトル */
.clp-campaign__title {
  font-size: clamp(24px, 3.5vw, 42px);
  font-weight: 700;
  color: #313131;
  margin: 0 0 4px;
  letter-spacing: 2px;
}
.clp-campaign__title div{
	display:inline-block;
	background:linear-gradient(transparent 70%, #ff6 50%);
	line-height: 1.4;
}

.clp-campaign__title-b {
  color: var(--clp-blue);
}

/* （熊本県を除く） */
.clp-campaign__sub {
  font-size: 24px;
  color: #313131;
  margin: 0 0 16px;
	font-weight: bold;
}

/* 2026年4月末… */
.clp-campaign__note {
  font-size: 16px;
  color: #313131;
  margin: 0 0 40px;
}

/* カード群 */
.clp-campaign__cards {
  display: grid;
	gap:1rem;
	grid-template-columns: repeat(3, 1fr);
}

/* カード */
.clp-campaign-card {
  background: #fff;
  border: 1.5px solid #e0e0e0;
  border-radius: 12px;
  padding:20px 10px;
  text-align: center;
  box-shadow: 0 2px 12px rgba(0,0,0,.06);
}

/* カード見出し行（アイコン＋タイトル） */
.clp-campaign-card__head {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 18px;
  font-weight: 700;
  color: #333;
  margin-bottom: 20px;
}

.clp-campaign-card__icon {
  width: 28px;
  height: auto;
  display: inline-block;
}

/* 赤タグ（全事業所 / 打ち消し線） */
.clp-campaign-card__tag {
  display: inline-block;
  background: var(--clp-red);
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  padding: 4px 16px;
  border-radius: 50px;
  margin-bottom: 20px;
}

.clp-campaign-card__head img {
  max-width: 19px;
  height: auto;
  display: block;
}

/* 無料テキスト */
.clp-campaign-card__free {
  font-size: 18px;
  font-weight: 700;
  color: #333;
  margin: 0 0 20px;
  line-height: 1.3;
}

.clp-campaign-card__free span {
  font-size: clamp(32px, 4vw, 42px);
  color: var(--clp-blue);
  font-weight: 900;
	position: relative;
}
.clp-campaign-card__free span::after{
	content:"";
	position: absolute;
	top:-5px;
	right:-16px;
	background-image: url(../../img/company_lp/top_fi.png);
	background-size:contain;
	background-position:center center;
	background-repeat:no-repeat;
	padding:10px 12px;
}

/* 説明文 */
.clp-campaign-card__desc {
  font-size: 14px;
  color: #2E2E2E;
  line-height: 1.7;
  margin: 0;
}
@media (max-width: 900px) {
.clp-campaign__cards {
  grid-template-columns: repeat(2, 1fr);
}
}
/* レスポンシブ */
@media (max-width: 660px) {
  .clp-campaign {
    padding: 48px 20px;
  }

  .clp-campaign__cards {
    flex-direction: column;
    align-items: center;
  }

  .clp-campaign-card {
    max-width: 100%;
    width: 100%;
  }
.clp-campaign__label {
  font-size: 16px;
}
.clp-campaign__title {
  font-size: 20px;
  letter-spacing: 0;
}
.clp-campaign__sub {
  font-size: 16px;
  margin: 0 0 16px;
}
.clp-campaign__note {
  font-size: 14px;
  margin: 0 0 25px;
}
.clp-campaign__cards {
    grid-template-columns: repeat(1, 1fr);
}
.clp-campaign-card__head {
  font-size: 16px;
  margin-bottom: 15px;
}
.clp-campaign-card__tag {
  font-size: 16px;
  margin-bottom: 15px;
}
.clp-campaign-card__free span {
  font-size: 30px;
}
.clp-campaign-card__free {
  font-size: 16px;
  margin: 0 0 15px;
}
}

/* -------------------------------------------------------------
   お悩みセクション
   ------------------------------------------------------------- */
.clp-problems {
  background: #EAEFF4;
  padding: 72px 40px;
}

.clp-problems__inner {
  max-width: var(--clp-inner);
  margin: 0 auto;
}

/* タイトル */
.clp-problems__title {
  font-size: clamp(24px, 3.5vw, 42px);
  font-weight: 700;
  color: #313131;
  text-align: center;
  margin: 0 0 48px;
  letter-spacing: 2px;
}
.clp-problems__title div{
	display:inline-block;
	background:linear-gradient(transparent 70%, #ff6 50%);
	line-height: 1.4;
}

.clp-problems__title-em {
  padding-bottom: 2px;
}

/* カード群 */
.clp-problems__cards {
  display: flex;
  gap: 16px;
  justify-content: space-between;
  flex-wrap: wrap;
  margin-bottom: 32px;
}

/* カード */
.clp-problem-card {
  background: #fff;
  border-radius: 12px;
  padding: 20px 18px 24px;
  flex: 1 1 200px;
  max-width: 260px;
  box-shadow: 0 2px 10px rgba(0,0,0,.06);
}

/* カード上部（タイトル＋アイコン） */
.clp-problem-card__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 12px;
}

.clp-problem-card__title {
  font-size: 18px;
  font-weight: 700;
  color: var(--clp-red);
  line-height: 1.5;
  margin: 0;
}

.clp-problem-card__icon {
  width: 36px;
  flex-shrink: 0;
}

/* 本文 */
.clp-problem-card__text {
  font-size: 13px;
  color: #444;
  line-height: 1.75;
  margin: 0;
}

/* 解決ボックス */
.clp-problems__solution {
  position: relative;
  margin-top: 8px;
}

.clp-problems__arrow {
  position: absolute;
  right: 790px;
  top: -23px;
  width: 98px;
}

.clp-problems__solution-box {
  background: #fff;
  border-radius: 12px;
  padding: 20px 28px;
  display: flex;
  align-items: center;
  gap: 20px;
  box-shadow: 0 2px 10px rgba(0,0,0,.06);
	justify-content: center;
}

.clp-problems__bulb {
  width: 52px;
  flex-shrink: 0;
}

.clp-problems__solution-text {
  font-size: 15px;
  color: #333;
  line-height: 1.8;
  margin: 0;
}

.clp-problems__solution-em {
  font-size: 18px;
  font-weight: 700;
  color: var(--clp-blue);
}

/* レスポンシブ */
@media (max-width: 900px) {
  .clp-problems {
    padding: 48px 20px;
  }

  .clp-problems__cards {
    gap: 12px;
  }

  .clp-problem-card {
    max-width: 100%;
    flex: 1 1 calc(50% - 12px);
  }

  .clp-problems__solution {
    padding-left: 0;
  }

  .clp-problems__arrow {
    position: static;
    display: block;
    margin: 0 auto 12px;
  }

  .clp-problems__solution-box {
    flex-direction: column;
    text-align: center;
    gap: 12px;
  }
.clp-problems__arrow {
    display: none !important;
  }
.clp-problems__cards {
  margin-bottom: 12px;
}
}

@media (max-width: 660px) {
  .clp-problem-card {
    flex: 1 1 100%;
  }
.clp-problems__title {
  font-size: 16px;
  margin: 0 0 25px;
  letter-spacing: 0;
}
.clp-problem-card__title br{
  display: none;
}
.clp-problem-card__icon {
  width: 26px;
}
.clp-problems__solution-box {
  padding: 1rem;
  gap: 5px;
}
.clp-problems__solution-text {
  font-size: 14px;
text-align: left;
}
.clp-problems__solution-em {
  font-size: 16px;
}
.clp-problems__bulb {
  width: 36px;
}
}

/* -------------------------------------------------------------
   採用企業に選ばれる7つの理由
   ------------------------------------------------------------- */
.clp-reasons {
  background: #fff;
  padding: 72px 40px;
}
.clp-reasons__inner {
  max-width: var(--clp-inner);
  margin: 0 auto;
  text-align: center;
}
.clp-reasons__list {
  margin-top: 48px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  text-align: left;
}
.clp-reason-item {
  display: flex;
  align-items: center;
  gap: 40px;
}
.clp-reason-item__image {
  flex: 0 0 300px;
  width: 300px;
}
.clp-reason-item__image img {
  width: 100%;
  border-radius: 12px;
}
.clp-reason-item__body { flex: 1; }
.clp-reason-item__num { display: inline; }
.clp-reason-item__num span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  background: #37D8DE;
  color: #fff;
  font-size: 16px;
  font-weight: 900;
  border-radius: 50%;
}
.clp-reason-item__title {
  font-size: clamp(16px, 2vw, 20px);
  font-weight: 700;
  color: #313131;
  line-height: 1.5;
	display: inline;
}
.clp-reason-item__text {
  font-size: 14px;
  color: #444;
  line-height: 1.85;
  margin:16px 0 16px;
}
.clp-reason-item__em {
  color:#FF0000;
}
.clp-reason-item__badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #FF0000;
  color: #FFF;
  font-size: 13px;
  font-weight: 700;
  padding: 5px 16px;
  border-radius: 50px;
  margin: 0;
}
.clp-reason-item__badge-icon { font-size: 14px; font-weight: 900; }
@media (max-width: 900px) {
.clp-reason-item__image {
  flex: 0 0 280px;
  width: 280px;
}
.clp-reason-item {
  gap: 25px;
}
.clp-reason-item__num span {
  width: 27px;
  height: 27px;
  font-size: 14px;
}
}
@media (max-width: 660px) {
  .clp-reasons { padding: 48px 20px; }
  .clp-reason-item {
    flex-direction: column;
    align-items: flex-start;
    padding: 24px 20px;
    gap: 20px;
  }
  .clp-reason-item__image {
    flex: none;
    width: 100%;
    max-width: 240px;
    margin: 0 auto;
  }
.clp-reasons__list {
  margin-top: 20px;
  gap:2rem;
}
.clp-reason-item {
    padding: 0 5%;
    gap: 15px;
}
.clp-reason-item__image {
    max-width: 300px;
}
.clp-reason-item__num span {
    width: 22px;
    height: 22px;
    font-size: 12px;
}
.clp-reason-item__title {
  font-size: 16px;
}
.clp-reason-item__text {
  font-size: 14px;
  margin: 10px 0;
}
}

/* -------------------------------------------------------------
   導入企業の成果事例
   ------------------------------------------------------------- */
.clp-cases {
  background: #EBF5FB;
  padding: 72px 40px;
  text-align: center;
}
.clp-cases__inner {
  max-width: var(--clp-inner);
  margin: 0 auto;
}
.clp-cases__title {
  font-size: clamp(24px, 3.5vw, 42px);
  font-weight: 700;
  color: #313131;
  margin: 0 0 12px;
  letter-spacing: 2px;
}
.clp-cases__title div{
	display:inline-block;
	background:linear-gradient(transparent 70%, #ff6 50%);
	line-height: 1.4;
}
.clp-cases__title-em {
  color: var(--clp-blue);
}
.clp-cases__sub {
  font-size: 16px;
  color: #555;
  margin: 0 0 40px;
}
.clp-cases__grid {
  display: grid;
	gap:1rem;
	grid-template-columns: repeat(2, 1fr);
}
.clp-case-card {
  background: #fff;
  border-radius: 12px;
  padding: 28px 28px 32px;
  box-shadow: 0 2px 12px rgba(0,0,0,.06);
	text-align: left;
}
.clp-case-card__label {
  font-size: 16px;
  font-weight: 700;
  color:#2D9DEB;
  margin: 0 0 16px;
}
.clp-case-card__head {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 16px;
}
.clp-case-card__avatar {
  width: 60px;
  height: 60px;
  flex-shrink: 0;
  border-radius: 50%;
}
.clp-case-card__title {
  font-size: 20px;
  font-weight: 700;
  color: #313131;
  line-height: 1.6;
  margin: 0;
}
.clp-case-card__text {
  font-size: 16px;
  color: #444;
  line-height: 1.85;
  margin: 0;
}
@media (max-width: 900px) {
.clp-case-card {
  padding: 1rem;
}
.clp-case-card__title {
  font-size: 16px;
}
.clp-case-card__label {
  font-size: 14px;
}
.clp-case-card__text {
  font-size: 14px;
  line-height: 1.7;
}
}
@media (max-width: 660px) {
  .clp-cases { padding: 48px 20px; }
  .clp-case-card { max-width: 100%; flex: 1 1 100%; }
.clp-cases__title {
  font-size: 20px;
  letter-spacing: 0;
}
.clp-cases__sub {
  font-size: 14px;
  margin: 0 0 20px;
}
.clp-cases__grid {
  gap: 1rem;
  grid-template-columns: repeat(1, 1fr);
}
.clp-case-card__title br{display: none;}
.clp-price__cards {
  grid-template-columns: repeat(1, 1fr);
  margin-top: 30px;
}
.clp-price-card:nth-of-type(1)::before {
    left: 10px;
    padding: 7%;
}
.clp-price-card__type {
    min-height: auto;
  }
.clp-price__notes p {
  font-size: 14px;
  line-height: 1.7;
  margin: 0.8rem 0 0;
  padding-left: 1.5rem;
  text-indent: -1.38rem;
}
.clp-price__notes p::before {
  padding: 8px;
  margin-right: 6px;
}
}

/* -------------------------------------------------------------
    就職説明会・施設見学会開催情報
   ------------------------------------------------------------- */
#clp_setumei{
  background: #FFF;
  padding: 72px 40px;
}
.clp_setumei_inner {
  max-width: var(--clp-inner);
  margin: 0 auto;
}
#clp_setumei .clp-cases__title{text-align: center;}
#clp_setumei .clp-cases__sub{text-align: center;}

.swiper-container-event .swiper-slide.event-slider-item{
	border: 0px solid #ddd!important;
	padding: 1rem!important;
	box-shadow: 0 3px 6px rgba(0,0,0,0.16)!important;
}
.pdf-wrapper {
  height: 428px!important;
  border-radius: 3px!important;
	margin-bottom: 1rem;
}
#clp_setumei h3{
	color:#0145C4;
}

/* レスポンシブ */
@media (max-width: 900px) {
  #clp_setumei{
    padding: 48px 20px;
  }
}
@media (max-width: 660px) {
.pdf-wrapper {
  height: 360px !important;
  margin-bottom: 0.5rem;
}
#clp_setumei h3 {
  font-size: 16px;
	overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
	.lockable-dim{
		font-size: 14px;
	}
}

/* -------------------------------------------------------------
   料金について
   ------------------------------------------------------------- */
.clp-price {
  background:#ECFBFD;
  padding: 72px 40px;
  text-align: center;
}
.clp-price__inner {
  max-width: var(--clp-inner);
  margin: 0 auto;
}
.clp-price__cards {
  display: grid;
	gap:1rem;
	grid-template-columns: repeat(3, 1fr);
  margin-top: 48px;
}
.clp-price-card {
  background: #fff;
  border: 4px solid #FFF;
  border-radius: 16px;
  padding: 28px 24px 32px;
  text-align: center;
  box-shadow:0 4px 16px rgba(0, 0, 0, 0.08);
  transition: transform .2s;
	position: relative;
}
.clp-price-card:nth-of-type(1)::before{
	content:"";
	position: absolute;
	top:-5px;
	left:15px;
	background-image: url(../../img/company_lp/top_six.png);
	background-size:contain;
	background-position:center center;
	background-repeat:no-repeat;
	padding:8%;
}
.clp-price-card:hover { transform: translateY(-4px); }
.clp-price-card--large { border-color: var(--clp-blue); }
.clp-price-card__badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background:#1198F9;
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  padding: 5px 16px;
  border-radius: 50px;
  margin-bottom: 16px;
}
.clp-price-card__type {
  font-size: 20px;
  color:#313131;
  line-height: 1.5;
  margin: 0 0 16px;
  min-height: 60px;
}
.clp-price-card__price {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 2px;
  margin: 0;
}
.clp-price-card__unit { font-size: 16px; font-weight: 700; color: var(--clp-blue); }
.clp-price-card__num {
  font-size: clamp(28px, 4vw, 40px);
  font-weight: 900;
  color: var(--clp-blue);
  line-height: 1;
}
.clp-price-card__yen { font-size: 18px; font-weight: 700; color: var(--clp-blue); }
.clp-price-card__tax { font-size: 14px; color: var(--clp-blue); }
.clp-price__notes {
  margin-top: 32px;
  text-align: left;
  display: inline-block;
}
.clp-price__notes p {
  font-size: 16px;
  color: #313131;
  line-height: 1.9;
  margin: 0.3rem 0 0;
  padding-left: 1.5em;
  text-indent: -1.5em;
}
.clp-price__notes p::before {
	content:"";
	background-image: url(../../img/company_lp/clp-price.png);
	background-size:contain;
	background-position:center center;
	background-repeat:no-repeat;
	padding:10px;
	margin-right:8px;
}
@media (max-width: 900px) {
.clp-price-card {
  border-radius: 10px;
  padding: 1rem;
}
.clp-price-card__type {
  font-size: 16px;
  margin: 0 0 15px;
  min-height: 48px;
}
.clp-price-card__num {
  font-size: clamp(25px, 2vw, 30px);
}
.clp-price-card:nth-of-type(1)::before {
  top: -5px;
  left: 5px;
  padding: 7%;
}
}
@media (max-width: 660px) {
  .clp-price { padding: 48px 20px; }
  .clp-price__cards { flex-direction: column; align-items: center; }
  .clp-price-card { max-width: 100%; width: 100%; }
.clp-compare__wrap {
  margin-top: 30px;
}
.clp-price__cards {
  grid-template-columns: repeat(1, 1fr);
  margin-top: 30px;
}
.clp-price-card:nth-of-type(1)::before {
    left: 15px;
}
.clp-price-card__type {
    min-height: auto;
  }
.clp-price__notes p::before {
  padding: 8px;
  margin-right: 5px;
}
.clp-price__notes p {
  font-size: 14px;
  line-height: 1.7;
  margin: 0.5rem 0 0;
  padding-left: 1.5em;

  text-indent: -1.5em;
}
}

/* -------------------------------------------------------------
   他の採用手法との比較
   ------------------------------------------------------------- */
.clp-compare {
  background: #FFF;
  padding: 72px 40px;
  text-align: center;
}
.clp-compare__inner {
  max-width: var(--clp-inner);
  margin: 0 auto;
}
.clp-compare__wrap {
  overflow-x: auto;
  margin-top: 48px;
  -webkit-overflow-scrolling: touch;
}
.clp-compare__table {
  width: 100%;
  min-width: 560px;
  border-collapse: collapse;
  text-align: center;
  font-size: 14px;
}
.clp-compare__th-item {
  width: 34%;
  background: #2E2E2E!important;
  border: none;
}
.clp-compare__th {
  padding: 14px 12px;
  font-size: 15px;
  font-weight: 700;
  color: #FFF;
  background:#2E2E2E !important;
  border:2px solid #FFF !important;
}
.clp-compare__th--tsunagu {
  background:#0145C4!important;
  color: #fff;
  border-color: var(--clp-blue);
  font-size: 17px;
}
.clp-compare__label {
  text-align: left;
  padding: 16px 20px;
  font-size: 18px;
  font-weight: 600;
  color: #2E2E2E;
  background:#F3F4F6;
  border:2px solid #FFF !important;
  border-left: none;
}
.clp-compare__td {
  padding: 16px 12px;
  color: #2E2E2E;
  background:#F3F4F6;
  border:2px solid #FFF !important;
  line-height: 1.6;
  vertical-align: middle;
	font-size: 16px;
}
.clp-compare__td--tsunagu {
  background: #B1FCFF;
  font-weight: 700;
  border-color: #FFF;
}
.clp-compare__td.clp-compare__bad { color: #2E2E2E; }
.clp-compare__highlight { color: var(--clp-blue); font-weight: 700;font-size: 20px; }
.clp-compare__check { color:#FDBC2E; font-weight: 900;font-size: 25px;margin-right:8px; }
.clp-compare__cross { color: #2E2E2E; font-size: 18px; font-weight: 900; }
.clp-compare__sub { font-size: 16px; color: #2E2E2E; }
.clp-compare__table tbody tr:nth-child(even) .clp-compare__label,
.clp-compare__table tbody tr:nth-child(even) .clp-compare__td { background: #F3F4F6; }
.clp-compare__table tbody tr:nth-child(even) .clp-compare__td--tsunagu { background: #B1FCFF; }
@media (max-width: 900px) {
.clp-compare__label {
  padding: 1rem;
  font-size: 16px;
}
.clp-compare__highlight {
  font-size: 18px;
}
.clp-compare__check {
  font-size: 20px;
  margin-right: 5px;
}
.clp-compare__td {
  font-size: 14px;
}
.clp-compare__sub {
  font-size: 14px;
}
.clp-compare__cross {
  font-size: 14px;
}
}
@media (max-width: 660px) {
  .clp-compare { padding: 48px 16px; }
.clp-compare__label {
    padding: 0.5rem;
    font-size: 13px;
}
.clp-compare__th--tsunagu {
  font-size: 13px;
  padding: 0.5rem;
}
.clp-compare__th {
  padding:0.5rem;
  font-size: 13px;
}
.clp-compare__wrap {
  margin-top: 30px;
}
 .clp-compare__td {
    font-size: 13px;
    padding: 0.5rem;
  }
.clp-compare__check {
    font-size: 13px;
    margin-right: 3px;
  }
.clp-compare__highlight {
    font-size: 13px;
  }
}

/* -------------------------------------------------------------
   求職者に選ばれている理由
   ------------------------------------------------------------- */
.clp-jobseeker {
  background: #ECFBFD;
  padding: 72px 40px;
  text-align: center;
}

.clp-jobseeker__inner {
  max-width: var(--clp-inner);
  margin: 0 auto;
}

/* サブタイトル */
.clp-jobseeker__sub {
  font-size: 15px;
  color: #333;
  margin: 0 0 10px;
  font-weight: 500;
}

/* メインタイトル */
.clp-jobseeker__title {
  font-size: clamp(22px, 3vw, 36px);
  font-weight: 700;
  color: #313131;
  margin: 0 0 30px;
  letter-spacing: 2px;
}
.clp-jobseeker__title div{
	display:inline-block;
	background:linear-gradient(transparent 70%, #ff6 50%);
	line-height: 1.4;
}
.clp-jobseeker__title-em {
  color: var(--clp-blue);
}

/* カード群 */
.clp-jobseeker__cards {
  display: grid;
	gap:1.5rem;
	grid-template-columns: repeat(3, 1fr);
	margin-top: 2.5rem;
}

/* 画像（角丸なし＋上部フィット） */
.clp-jobseeker-card__image {
  width: 100%;
  margin-bottom: 20px;
}

.clp-jobseeker-card__image img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 16px 16px 0 0;
}

/* カードタイトル */
.clp-jobseeker-card__title {
  font-size: 17px;
  font-weight: 700;
  color: #313131;
  line-height: 1.5;
  margin: 0 0 12px;
  padding: 0 20px;
	text-align: center;
}

/* カード本文 */
.clp-jobseeker-card__text {
  font-size: 16px;
  color:#313131;
  line-height: 1.85;
  text-align: left;
}

/* レスポンシブ */
@media (max-width: 900px) {
.clp-jobseeker__cards {
  gap: 1rem;
}
.clp-jobseeker-card__text {
  font-size: 14px;
  line-height: 1.6;
}
.clp-jobseeker-card__image {
  margin-bottom: 10px;
}
.clp-jobseeker-card__title {
  font-size: 15px;
  margin: 0 0 10px;
}
}
@media (max-width: 660px) {
  .clp-jobseeker {
    padding: 48px 20px;
  }

  .clp-jobseeker__cards {
    flex-direction: column;
    align-items: center;
  }

  .clp-jobseeker-card {
    max-width: 100%;
    width: 100%;
  }
.clp-jobseeker__cards {
  grid-template-columns: repeat(1, 1fr);
  margin-top: 1.5rem;
	gap: 2rem;
}
.clp-jobseeker__title {
  font-size: 20px;
  margin: 0 0 20px;
  letter-spacing: 0;
}
	.clp-jobseeker-card__title br{display: none;}
}

/* -------------------------------------------------------------
   オンライン施設見学ページ制作事例
   ------------------------------------------------------------- */
#clp_online{
  background: #FFF;
  padding: 72px 40px;
}
.clp_online_inner {
  max-width: var(--clp-inner);
  margin: 0 auto;
}
#clp_online .clp-cases__title{text-align: center;}
#clp_online .clp-cases__sub{text-align: center;}

.swiper-container-tour .swiper-slide.tour-slider-item {
  border: 0px solid #ddd!important;
  border-radius: 3px!important;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16)!important;
  padding: 1rem!important;
	position: relative;
}
#clp_online li a{
	position: absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
}
#clp_online dt{
	margin-bottom: 0.5rem;
}
#clp_online h3{
	overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
	color:#0145C4;
}
#clp_online dd p{
	overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/* レスポンシブ */
@media (max-width: 900px) {
  #clp_online{
    padding: 48px 20px;
  }
}
@media (max-width: 660px) {
#clp_online h3 {
   font-size: 16px;
}
#clp_online dd p {
  font-size: 14px;
}
}

/* -------------------------------------------------------------
   ご利用までの流れ
   ------------------------------------------------------------- */
.clp-flow {
  background: #DCF3FB;
  padding: 72px 40px 80px;
  text-align: center;
}

.clp-flow__inner {
  max-width: var(--clp-inner);
  margin: 0 auto;
}

/* タイトル */
.clp-flow__title {
  font-size: clamp(22px, 3vw, 36px);
  font-weight: 700;
  color: #313131;
  margin: 0 0 48px;
  letter-spacing: 2px;
}
.clp-flow__title div{
	display:inline-block;
	background:linear-gradient(transparent 70%, #ff6 50%);
	line-height: 1.4;
}
.clp-flow__title-em {
  color: var(--clp-blue);
}
.clp-flow ul{
	display: grid;
	gap:1rem;
	grid-template-columns: repeat(4, 1fr);
}
.clp-flow dt .pc{
	display: block;
}
.clp-flow dt .sp{
	display: none;
}
.clp-flow dd:nth-of-type(1){
	margin:0.5rem auto;
}
.clp-flow dd:nth-of-type(2){
	font-size: 20px;
	font-weight: bold;
}


/* レスポンシブ */
@media (max-width: 900px) {
  .clp-flow {
    padding: 48px 20px;
  }
.clp-flow dd:nth-of-type(2) {
  font-size: 16px;
  line-height: 1.5;
}
}

@media (max-width: 660px) {
.clp-flow ul {
  grid-template-columns: repeat(2, 1fr);
}
.clp-flow dt .pc {
  display: none;
}
.clp-flow dt .sp {
  display: block;
}
.clp-flow__title {
  font-size: 20px;
  margin: 0 0 30px;
  letter-spacing: 0;
}
}

/* -------------------------------------------------------------
   CTAバナー
   ------------------------------------------------------------- */
.clp-cta {
  text-align: center;
  padding: 80px 40px;
  background-image: url(../../img/company_lp/top_tw.jpg);
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
	background-attachment: fixed;
}

.clp-cta__inner {
  max-width: 945px;
  margin: 0 auto;
}

.clp-cta__title {
  font-size: clamp(20px, 3vw, 42px);
  font-weight: 700;
  color: #fff;
  line-height: 1.5;
  margin: 0 0 16px;
	position: relative;
	overflow: hidden;
	padding-bottom: 25px;
}
.clp-cta__title::after{
	content:"";
	position: absolute;
	bottom:0;
	left:0;
	background-image:url('../../img/company_lp/clp-cta.png');
	background-size:contain;
	background-position:center center;
	background-repeat:no-repeat;
	height:20.5px;
	width:100%;
}

.clp-cta__text {
  font-size: 15px;
  color: #fff;
  line-height: 1.8;
  margin: 0 0 32px;
}

.clp-cta__btns {
  display: grid;
	gap:1rem;
	grid-template-columns: repeat(2, 1fr);
	width:min(100%,650px);
	margin:0 auto;
}
.clp-btn--red {
  background: #EF0000;
  color:#FFF;
  box-shadow: 0 3px 0 #DB0000;transition:all ease 0.3s;
	-webkit-transition:all ease 0.3s;
	-moz-transition:all ease 0.3s;
	border:3px solid #EF0000;
	justify-content: center;
}

.clp-btn--red:hover {
  box-shadow: 0 0 0 rgba(0,0,0,.15);
}
.clp-btn--white {
  background: #FFF;
  color:#EF0000;
  box-shadow: 0 3px 0 #DB0000;transition:all ease 0.3s;
	-webkit-transition:all ease 0.3s;
	-moz-transition:all ease 0.3s;
	border:3px solid #EF0000;
	justify-content: center;
}

.clp-btn--white:hover {
  box-shadow: 0 0 0 rgba(0,0,0,.15);
}
.clp-cta__note {
  font-size: 13px;
  color: rgba(255,255,255,.85);
  margin: 0;
}
.clp-cta__text{
	font-weight: bold;
	font-size: 16px;
}

@media (max-width: 900px) {
  .clp-cta {
    padding: 56px 20px;
  }
.clp-cta__inner {
  max-width: 513px;
}
}
@media (max-width: 660px) {
.clp-cta__text {
  font-size: 14px;
}
.clp-cta__btns {
  gap: 0.5rem;
}
.clp-cta .clp-btn--red{
	font-size: 13px !important;
	padding: 0.5rem!important;
}
.clp-cta .clp-btn {
    padding: 0.5rem;
    font-size: 13px;
}
}


#clp_bana{
	background:#FCEF8B;
	position: fixed;
	bottom:0;
	left: 0;
	right: 0;
	z-index: 9;
	padding:1rem;
}
#clp_bana .clp-hero__btns{
	width:min(100%,650px);
	margin:0 auto;
}
@media (max-width: 660px) {
#clp_bana .clp-hero__btns {
	gap: 0.5rem;
	grid-template-columns: repeat(2, 1fr);
}
#clp_bana .clp-btn--red{
	font-size: 13px !important;
	padding: 0.5rem!important;
}
#clp_bana .clp-btn {
    padding: 0.5rem;
    font-size: 13px;
}
#clp_bana {
  padding: 0.5rem;
}
}