@charset "utf-8";
/*
Theme Name: PORTAL Child
Template: portal_tcd095
Version: 1.11.0
*/

/*-------------------------------------------------
　検証中
-------------------------------------------------*/

/* ★をあとで調整する */
.side-container {
  display: flex;
  justify-content: left;
}

.navi-button {
  display: inline-block;
  margin: 0px 15px 5px 0px;
  padding: 0.5em 1.2em;
  text-decoration: none;
  background: #f7f7f7;
  border-left: solid 4px #ff8376;
  color: #282828;
  font-weight: 400;
  font-size: 15px;
  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.15);
}
/*【767px以下】ナビボタン */
@media (max-width: 767px) {
.btn-sticky {
  font-size: 14px;
  }
}

.c-logo__text {
  letter-spacing: 3px;
}

.wpcf7 .wpcf7-submit {
  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.20);
}

/* コメント欄（あとで調整する） */
#comment_textarea textarea {
  font-size: 15px;
}

/*-------------------------------------------------
　検証中
-------------------------------------------------*/

ul.timeline-list {
  padding-left: 0;
  margin: 0;
}
ul.timeline-list li {
  list-style: none;
  padding-left: 4rem;
  position: relative;
}
ul.timeline-list li:not(:last-of-type) {
  padding-bottom: 4rem;
}
ul.timeline-list li:not(:last-of-type)::before {
  content: " ";
  display: block;
  position: absolute;
  background-color: #000;
  width: 2px;
  height: calc(100% - 1.4rem);
  top: calc(1.5rem + 0.45em);
  left: 0.7rem;
}
ul.timeline-list li::after {
  content: " ";
  display: block;
  position: absolute;
  background-color: #000;
  width: 1.6rem;
  height: 1.6rem;
  top: 0.45em;
  left: 0;
}


/*-------------------------------------------------
　コンテンツエリアの横幅：共通
-------------------------------------------------*/

/* 全体の幅（固定＋投稿＋一覧のコンテンツエリアを810px→740pxに変更） */
.l-inner {
  max-width: 740px;
}
/* LPページの幅（コンテンツの横幅＞普通を指定時に810px→740pxに変更） */
.p-article--lp-body--normal {
  max-width: 740px;
}

/*-------------------------------------------------
　フロント＋固定＋投稿＋一覧＋LPの横幅
-------------------------------------------------*/

/* STEP.1 フロント（ヘッダー幅を860pxに変更） */
.p-header-slider__content .l-inner {
  max-width: 860px;
}
/* STEP.2 固定＋投稿＋一覧（パンくずエリアの幅を860pxに変更） */
.l-header__inner .l-inner {
  max-width: 860px;
}
/* STEP.3 固定＋投稿（ヘッダーエリアの幅を860pxに変更） */
.p-article__header .l-inner {
  max-width: 860px;
}
/* STEP.4 一覧（ヘッダーエリアの幅を860pxに変更） */
.p-page-header__inner.l-inner {
  max-width: 860px;
}
/* STEP.5 LP（ヘッダーエリアの幅を860pxに変更） */
.p-lp-header__inner.l-inner {
  max-width: 860px;
}

/*-------------------------------------------------
　フォントスタイル
-------------------------------------------------*/

/* 文字の高さ */
.post_content p:not([class]) {
  line-height: 2.2;
}
/* 文字の高さ */
@media (max-width: 767px) {
.post_content p:not([class]) {
  line-height: 2;
  }
}

/*-------------------------------------------------
　フォントカラー
-------------------------------------------------*/

/* テーマ全体のテキスト */
body {
  color: #282828;
}
/* タブ（アクティブな白背景のテキストカラーに反映） */
.p-archive-tab__label-item.is-active {
  color: #282828;
}
/* リンク（プロフィール＋フッターリンクに反映） */
a {
  color: #282828;
}
/* フッター（プロフィールテキストに反映） */
.p-footer__item {
  color: #282828;
}

/*-------------------------------------------------
　追加フォントカラー
-------------------------------------------------*/

/* レッド */
span.red {
  color: #e2041b;
}

/*-------------------------------------------------
　パンくず：カラー調整＋表示変更
-------------------------------------------------*/

/* ホームアイコン＋アーカイブ＋カテゴリー（最終パンくずリストはアクセントカラーが反映） */
.single-post-page.is-site-design--dark .c-breadcrumb__item > * {
  color: #686868;
}
/* 矢印アイコン */
.single-post-page.is-site-design--dark .c-breadcrumb__item:before {
  color: #686868;
}
/* 最終パンくずリスト（アクセントカラー解除＋個別指定） */
.single-post-page.is-site-design--dark .c-breadcrumb__item:last-of-type span {
  color: #adadad;
}
/* ※停止中※最終パンくずリスト（画像のない固定ページはパンくずとタイトルが近いため非表示にする）
.c-breadcrumb__item:last-of-type {
  display: none;
} */

/*-------------------------------------------------
　ロード画面
-------------------------------------------------*/

/*【767px以下】キャッチフレーズ（中央にテキスト位置を調整） */
@media (max-width: 767px) {
.p-loading-screen__catch-sp {
  margin-bottom: 70px;
  }
}

/*-------------------------------------------------
　ヘッダーメッセージ
-------------------------------------------------*/

/* テキスト */
.p-header-message {
  font-size: 15px;
  font-weight: 400;
}
/*【767px以下】テキスト */
@media (max-width: 767px) {
.p-header-message {
  font-size: 14px;
  min-height: 50px;
 }
}

/*-------------------------------------------------
　ドロワーメニュー
-------------------------------------------------*/

/* ロゴ（通常ロゴに影響がでないようドロワーメニューのみ調整） */
.p-drawer-menu__header .c-logo__image {
  max-width: 85%;
  width: auto;
  max-height: 85%;
}
/*【767px以下】ロゴ */
@media (max-width: 767px) {
.p-drawer-menu__header {
  margin: 0 0 20px -20px;
 }
}
/* テキストリンク */
.c-categories a {
  font-size: 15px;
}
/* テキストリンク */
@media (max-width: 767px) {
.c-categories a {
  min-height: 60px;
  }
}
/* リンクホバー（アクセントカラー解除＋個別指定） */
.c-categories a:hover {
  color: #8f8f8f;
}
/* ※停止中※広告エリア（HTML自由記入の形式にした場合の調整）
.p-drawer-menu__item {
  font-size: 15px;
  line-height: 1.8;
} */

/*-------------------------------------------------
　ヘッダーコンテンツ
-------------------------------------------------*/

/* 検索アイコン */
.p-header__search-button label {
  display: none;
}
/* 検索フォーム（ホバーで表示されるフォームを非表示） */
.p-header__search-form {
  display: none;
}
/* ※停止中※キャッチフレーズ＋説明文の位置
.p-header-slider__content {
  top: 55%;
} */
/* ※停止中※【767px以下】キャッチフレーズ＋説明文の位置
@media (max-width: 767px) {
.p-header-slider__content {
  top: 55%;
 }
} */
/* 説明文 */
.p-header-slider__content-desc {
  font-size: 17px;
  line-height: 2.2;
}
/*【767px以下】説明文 */
@media (max-width: 767px) {
.p-header-slider__content-desc {
  font-size: 15px;
  line-height: 2;
  text-align:left;
 }
}
/* タブ（位置を中央に変更） */
.u-flex {
  display: flex;
  justify-content: center;
}
/* タブの背景カラー（アクセントカラー解除＋個別指定） */
.p-archive-tab__label-item {
  background: #484848;
}
/* タブのテキスト */
.c-tab-label {
  border-radius: 5px 5px 0 0;
  font-weight: 500;
}
/*【1200px以上】タブのデザイン調整 */
@media (min-width: 1200px) {
.c-tab-label {
  width: 196px;
 }
}
/* タブアニメーション（速度を0.3s→0.8sに変更） */
body:not(.use_loading_screen) .c-animation--tab-label {
  animation: fadeIn_tabLabel 0.8s cubic-bezier(0.65,0.05,0.36,1) 0.3s forwards;
}

/*-------------------------------------------------
　フッターコンテンツ
-------------------------------------------------*/

/* タイトルのカラー（アクセントカラー解除＋個別指定） */
.p-footer__item-headline {
  color: #484848;
  border-left: 4px solid #484848;
}
/* プロフィール説明文 */
.p-footer__item-profile__desc {
  font-size: 15px;
  line-height: 1.8;
}
/* メニュー中央 */
.c-categories a {
  font-size: 15px;
}
/* メニュー右 */
.p-footer__item-articles__title {
  font-size: 15px;
}
/* メニュー右のデザイン調整（余白をメニュー中央の実線と平行に合わせる） */
.p-footer__item-articles__link {
  padding: 22px 0;
}
/*【992px以下】フッターナビ（並びをセンターに変更） */
@media (max-width: 992px) {
.p-footer__nav-list {
  justify-content: center;
 }
}

/*-------------------------------------------------
　共通ヘッダーデザイン調整：固定＋投稿
-------------------------------------------------*/
/* STEP.X 固定ページと投稿ページのヘッダーデザイン共通化の準備 */

/* パンくずエリア */
.single-post-page.is-site-design--dark .l-header__inner {
  border-bottom: 1px solid #ddd;
}

/*-------------------------------------------------
　共通ヘッダーデザイン調整：投稿＋一覧（同時修正）
-------------------------------------------------*/
/* STEP.1 投稿ページと一覧ページを固定ページも考慮しながらデザイン共通化する */

/* 日付 */
.c-release-date__inner {
  display: none;
}
/* 日付の表示エリア */
.c-release-date {
  display: none;
}
/* 更新日 */
.c-date {
  display: none;
}
/* カテゴリー */
.p-article__header-meta__list.u-flex-align-center {
  display: none;
}
/* デザイン調整（固定ページとのデザインを調整） */
.p-article__header-meta {
  margin-bottom: 0px;
}

/*-------------------------------------------------
　固定ページ
-------------------------------------------------*/
/* STEP.2 先に固定ページをデザイン共通化の下準備をしておく */

/* 記事上下の余白 */
.p-article__body {
  padding: 60px 0 60px;
}
/*【767px以下】記事上下の余白 */
@media (max-width: 767px) {
.p-article__body {
  padding: 0px 0 40px;
 }
}

/*-------------------------------------------------
　投稿ページ（NoIndex）
-------------------------------------------------*/
/* STEP.3 投稿ページを固定ページと比較しながらデザインを整える */

/* 前へ次へナビゲーション */
.p-page-nav {
  display: none;
}
/* 関連記事 */
.p-related-post {
  display: none;
}
/* コメントタイトル */
.c-article-title {
  display: none;
}
/* コメントの余白 */
.p-single-comment {
  margin-top: 60px;
}
/*【767px以下】コメントの余白 */
@media (max-width: 767px) {
.p-single-comment {
  margin-top: 40px;
 }
}

/*-------------------------------------------------
　LPページ
-------------------------------------------------*/
/* STEP.4 LPページのデザインを確定させる */

/* ヘッダー（高さ500px→300pxに変更） */
.p-lp-header {
  text-align: left;
  height: 350px;
}
/*【767px以下】ヘッダー（高さ350px→280pxに変更） */
@media (max-width: 767px) {
.p-lp-header {
  height: 280px;
  }
}
/*【767px以下】余白調整*/
@media (max-width: 767px) {
* + .p-lp-header__description {
  margin-top: calc(25px - 0.6em);
  }
}
/* 説明文 */
.p-lp-header__description {
  font-size: 17px;
  line-height: 2.2;
}
/*【767px以下】説明文 */
@media (max-width: 767px) {
.p-lp-header__description {
  font-size: 15px;
  line-height: 2;
  }
}
/* LPコンテンツ */
.p-article--lp {
  margin: 100px 0 100px;
}
/*【767px以下】LPコンテンツ */
@media (max-width: 767px) {
.p-article--lp {
  margin: 40px 0 40px;
 }
}

/*-------------------------------------------------
　一覧（NoIndex）
-------------------------------------------------*/
/* STEP.5 一覧ページのヘッダーをLPページと合わせ全体のデザインを変更する */

/* ヘッダー（高さ470px→350pxに変更） */
.p-page-header {
  height: 350px;
}
/*【767px以下】ヘッダー（高さ340px→320pxに変更） */
@media (max-width: 767px) {
.p-page-header {
  height: 320px;
  }
}
/* デザイン調整（日付の非表示による調整） */
.p-archive__link {
  width: 100%;
}
/* 記事数のタブを非表示 */
.p-page-header__count.c-tab-label.u-flex-center {
  display: none;
}
/* カテゴリーを非表示 */
.p-archive__item-meta.p-archive__item-meta--pc.u-flex-align-center {
  display: none;
}
/* 記事一覧のタイトル */
.p-archive__item-title {
  font-size: 18px;
}
/*【767px以下】記事一覧のタイトル */
@media (max-width: 767px) {
.p-archive__item-title {
  font-size: 16px;
 }
}
/* 全体の余白を調整 */
.p-archive__item {
  padding: 50px 0;
}
/*【767px以下】全体の余白を調整 */
@media (max-width: 767px) {
.p-archive__item {
  padding: 10px 0 40px;
  }
}

/*-------------------------------------------------
　アコーディオン
-------------------------------------------------*/

/* タイトル */
.post_content .p-faq-list__title {
  padding: 28px 60px 26px 30px;
  font-size: 15px;
  font-weight: 500;
}
/*【992px以下】タイトル */
@media (max-width: 992px) {
.post_content .p-faq-list__title {
  padding: 22px 45px 22px 20px;
  font-size: 15px;
 } 
}
/* 説明文 */
.post_content .p-faq-list__desc {
  font-size: 16px;
  line-height: 2;
}
/*【992px以下】説明文 */
@media (max-width: 992px) {
.post_content .p-faq-list__desc {
  padding: 28px 18px;
  font-size: 15px;
  line-height: 1.8;
 } 
}
/* 開閉アイコン */
.post_content .p-faq-list__title-icon:before, .post_content .p-faq-list__title-icon:after {
  background: #282828;
}

/*-------------------------------------------------
　区切り線
-------------------------------------------------*/

/* 実線 */
hr {
  border: 1px solid #ddd;
  border-bottom: none;
  border-left: none;
  border-right: none;
  margin: 2.5em 0 2.5em;
  padding: 0;
}

/*-------------------------------------------------
　ボタン
-------------------------------------------------*/

/* ※停止中※ボタン（TCD基本デザインの調整） */
.simple_button {
  margin: 0;
  padding:0 1.25em;
  width: 180px;
  height: 50px;
  font-size: 15px;
  color: #fff;
  background: #f8f8f8;
  border-radius: 0px;
}

/*-------------------------------------------------
　囲み枠
-------------------------------------------------*/
/* TCD CLASSIC EDITORは細かな調整が効かないのでオリジナルで作成 */

/* シンプル囲み枠 */
.simple_box {
  margin-top: 40px;
  margin-bottom: 40px;
  padding: 24px 30px;
  background-color: #ffffff;
  border: 1px solid #dddddd;
  font-size: 16px;
  line-height: 2.2;
}
/*【767px以下】シンプル囲み枠 */
@media (max-width: 767px) {
.simple_box {
  margin-top: 25px;
  margin-bottom: 25px;
  padding: 20px 20px;
  font-size: 15px;
  line-height: 2;
  }
}

/*-------------------------------------------------
　ボタン（TCD CLASSIC EDITOR）
-------------------------------------------------*/

/* 位置（中央→左寄せに変更） */
.tcdce-button-wrapper {
  text-align: left !important;
}
/* デザインの調整 */
.tcdce-button.custom_button {
  border-radius: 5px !important;
  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.20);
}

/*-------------------------------------------------
　テーブル（TCD CLASSIC EDITOR）
-------------------------------------------------*/

/* 横幅の調整（横スクロールを停止） */
.post_content .s_table {
  overflow: unset!important;
  white-space: normal!important;
}
/*【767px以下】デザインの調整 */
@media (max-width: 767px) {
.post_content :is(th, td) {
  line-height: 2;
  }
}

/*-------------------------------------------------
　ステップバー
-------------------------------------------------*/

/* ナビゲーション */
.progressbar {
  margin: 5px 0 30px;
  display: flex;
  flex-wrap: wrap;
}
.progressbar .item {
  position: relative;
  width: 33%;
  text-align: center;
  position: relative;
  align-items: center;
  justify-content: center;
  padding: 13px 0;
  line-height: 1.5;
  background: #f2f2f2;
  color: #282828;
}
.progressbar .item:not(:last-child)::before,
.progressbar .item:not(:last-child)::after {
  margin: auto;
  position: absolute;
  z-index: 2;
  top: 0;
  bottom: 0;
  left: 100%;
  content: '';
  border: 37px solid transparent;
  border-left: 20px solid #f2f2f2;
}
.progressbar .item:not(:last-child)::before {
  margin-left: 1px;
  border-left-color: #cbcbcb;
}
@media (max-width: 767px) {
.progressbar .item {
  font-size: 13px;
  line-height: 1.5;
  padding: 10px 0;
}
.progressbar .item:not(:last-child)::before,
.progressbar .item:not(:last-child)::after {
  border-width: 29px;
  border-left-width: 12px;
}
}
/* アクティブ */
.progressbar .item.active {
  z-index: 1;
  background: #5b5b5b;
  color: #fff;
}
.progressbar .item.active:not(:last-child)::after {
  border-left-color: #5b5b5b;
}
.progressbar .item.active:not(:last-child)::before {
  border-left: none;
}


/*---------------------------------------
　ステップバー
----------------------------------------*/

/* 全体のデザイン */
.stepbar {
  margin: 2.8em auto 2.5em;
  width: 100%;
  border-top: 1px solid #ddd;
}
/* 三角矢印 */
.stepbar .stepbarwrap .triangle {
  margin: 0 auto;
  display: block;
  width: 0;
  content: "";
  border: solid 1em transparent;
  border-top-color: #5d5d5d;
}
/* ステップ */
.stepbar .stepbarwrap .steptitle span {
  margin: 1em auto 0.7em;
  display: block;
  font-size: 14px;
  line-height: 1.2;
}
/* タイトル */
.stepbar .stepbarwrap .title {
  margin-bottom: 1em;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.4;
}
/* 説明文 */
.stepbar .stepbarwrap .txt {
  margin-bottom: 2em;
  display: block;
  font-size: 16px;
}
/*【767px以下】説明文 */
@media (max-width: 767px) {
.stepbar .stepbarwrap .txt {
  font-size: 15px;
 }
}

/*-------------------------------------------------
　Contact Form 7
-------------------------------------------------*/

/* 全体の余白 */
.wpcf7 form {
  margin: 1.5em 2.5em 0;
}
/*【767px以下】フォームデザイン調整（モバイル表示では左右のボーダー廃止するための処理） */
@media (max-width: 767px) {
.wpcf7 form {
  margin: 1.5em 0 0;
  line-height: 2;
 }
}
/* フォーム間の余白（ここの数値は上下の余白にも影響する） */
.wpcf7 p:not([class]) {
  margin-bottom: 1em;
}
/* ボタン下の余白を調整（全体＋フォーム間＋ボタン下の影響を確認しながら決定） */
.wpcf7 p:last-child {
  margin-bottom: 0em;
}
/* 【余白保留】フォーム送信前と送信後のデザイン調整（フォーム上下の余白と背景を白に変更） */
.wpcf7 {
  padding: 10px 0 10px;
  background: #fff;
}
/*【767px以下】デザイン調整（囲み枠を非表示にして上下にボーダーを追加） */
@media (max-width: 767px) {
.wpcf7 {
  border: none;
  border-top: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
 }
}
/* ラベル */
.wpcf7 p {
  font-size: 16px;
 }
/*【767px以下】ラベル */
@media (max-width: 767px) {
.wpcf7 p {
  font-size: 15px;
 }
}
/* 入力エリア＋入力テキストのカラー追加（テキストは15pxに固定＋枠線の高さはline-heightで調整） */
.wpcf7 input {
  padding: 8px 10px;
  border: 1px solid #ddd;
  font-size: 15px;
  line-height: 1.4;
  color: #282828; 
}
/* メッセージエリア＋入力テキストのカラー追加（テキストはパソコンとモバイル共にサイズ15px＋高さ1.8に固定） */
.wpcf7 textarea {
  height: 240px;
  padding: 10px;
  line-height: 1.8;
  font-size: 15px;
  color: #282828; 
  border: 1px solid #ddd;
}
/* 送信ボタン（TCD CLASSIC EDITOR のデザインと共通） */
.wpcf7 .wpcf7-submit {
  margin: 0;
  width: 200px;
  height: 56px;
  background: #e2041b;
  border-radius: 5px;
  font-size: 15px;
}
/*【767px以下】送信ボタン（TCD CLASSIC EDITOR のデザインと共通） */
@media (max-width: 767px) {
.wpcf7 .wpcf7-submit {
  width: 180px;
  height: 52px;
  font-size: 14px;
  }
}
/* 送信後の処理（送信後にフォームを非表示にする処理） */
form.sent div.wpcf7-form {
  display:none;
}
/* 送信完了（送信後のテキストカラーを変更） */
.wpcf7-form.sent {
  color: #228b22;
  font-weight: 500;
}

/*-------------------------------------------------
　Visual Form Builder
-------------------------------------------------*/

/*
VFB を最新版にしてもらう→再調整をする
CyberHacks Visual Form Builder.css
.cyberhacks-visual-form-builder ul
margin: 0 14px !important! をmargin: 0 !important!にしたい
 */

/* Fieldset（フォーム上部の見出しを非表示） */
.cyberhacks-visual-form-builder .cvfb-legend {
  display: none;
}
/* 余白と枠線の調整（Contact Form 7と共通デザイン＋横幅14pxのmarginを初期値で組み込む） */
.cyberhacks-visual-form-builder fieldset {
  padding: 26px 14px 0px !important;
  border: 1px solid #ddd !important;
}


/*-------------------------------------------------
　仮CSS
-------------------------------------------------*/

.cvfb-item-select .cvfb-desc {
  display: none !important;
}
input.cvfb-text, input[type="text"].cvfb-text {
  box-shadow: none !important;
}
.cpb-posted-area {
  line-height: 1.8;
}