@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/

/* 追加css */
/* トップページPC */


/* -------------------------------- 固定ページ共通 -------------------------------- */

.c-pageTitle {
display: none;
}
.l-mainContent__inner>.post_content {
margin-top: 0;
}

.l-content {
padding-top: 0;
}

/* -------------------------------- 固定ページ共通 -------------------------------- */


/* -------------------------------- メインビジュアル -------------------------------- */

.main-catch {
  width: 100%;
}

.main-copy {
  width: 66%;
}
.main-text {
  width: 100%;
}
.main-bigtext-pc {
  font-size: 2rem;
  font-weight: bold;
  color: #707070;
}
.main-text-pc {
  font-size: 1rem;
  color: #707070;
}


.p-mainVisual__textLayer {
  margin-bottom: 3rem;
}
.sp {
  display: none;
}

.is-style-good_list li:before {
  color: #0094C3;
}

.p-mainVisual__slideTitle {
  font-size: 34px;
}

.customer {
background: #fff;
}

.swl-cell-bg[data-icon="circle"] {
    --cell-icon-color: #0094C3;
}

.w-header__inner {
  display: flex;
  align-items: baseline;
}

.profile-box {
  padding: 2em !important;
  gap: 3em !important;
}
@media screen and (max-width: 1450px) {
	.main-copy {
		width: 48%;
	}
	.main-bigtext-pc {
		font-size: 1.5rem;
	}
}
@media screen and (min-width: 959px) {
	.sp-main-text {
		display: none;
	}
}


/*------タブレット切り替え------*/

@media screen and (max-width: 959px) {
  .pc {
    display: none;
  }

	.p-mainVisual__slide {
		padding-bottom: 6rem;
	}
	.main-text {
		position: relative;
		top: 26rem;
		text-align: center;
	}
	.p-mainVisual__slideBtn {
		position: relative;
		top: 28rem;
		margin: 0;
	}
}

/*------スマホ切り替え------*/

@media screen and (max-width: 782px) {
  .pc {
    display: none;
  }
	.p-mainVisual__slide {
		padding-bottom: 16rem;
	}
	.main-text {
		position: relative;
		top: 14rem;
		text-align: center;
	}
	.p-mainVisual__slideBtn {
		position: relative;
		top: 16rem;
		margin: 0;
	}
}

/* -------------------------------- メインビジュアル -------------------------------- */




/* -------------------------------- 画面右SNSアイコン -------------------------------- */

.side-floating-icons {
  position: fixed;
  top: 40%;
  right: 0;
  z-index: 9999;
  display: flex;
  flex-direction: column;
  gap: 12px;
  background: rgba(255, 255, 255, 0.9);
  padding: 8px 6px;
  border-radius: 10px 0 0 10px;
  box-shadow: 0 0 8px rgba(0,0,0,0.15);
}

.side-floating-icons img {
  width: 36px;
  height: 36px;
  transition: transform 0.2s ease;
}

.side-floating-icons img:hover {
  transform: scale(1.1);
}

/* -------------------------------- 画面右SNSアイコン -------------------------------- */



/* -------------------------------- カスタマージャーニー -------------------------------- */
.customer-wrap {
	width: 100%;
	overflow-x: auto;
}
.table-wrapper {
  position: relative;
  width: 100%;
  min-width: 1200px;
  margin: 10px auto;
  overflow-x: auto;
}
.overlay-btn-wrap {
	min-width: 1200px;
	position: relative;
}

table.customer-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  background:#fff;
}

/* フェーズ */
.phase-h {
  background-color: #0094c3;
  color: #fff;
}
.phase-calc {
  border-left: 1px solid #0094c3;
  border-right: 1px solid #fff;
  border-bottom: 1px dashed var(--color_border) !important;
  padding: 8px;
  text-align: center;
  vertical-align: middle;
}
.phase-end {
  text-align: center;
  border-left: 1px solid #fff;
  border-right: 1px solid #0094c3;
}

th.phase {
  position: relative;
  padding: 10px;
  text-align: center;
  z-index: 1;
  font-size: 0.9rem;
}
th.phase-end {
  font-size: 0.9rem;
}

/* 各thの右上に「＼」を描画（最後のセル以外） */
th.phase:not(:last-of-type)::after {
  content: '';
  position: absolute;
  top: 6px;
  right: -16px; /* セルの外側に描画 */
  width: 29px;
  height: 29px;
  border-left: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(225deg); /* 「＼」形状 */
  background: #0094c3; /* テーブル背景と一致させる */
  z-index: 10;
}

.phase-calc1 {
  border-left: 1px solid #0094c3 !important;
  border-right: 1px solid #0094c3 !important;
  border-bottom: 1px dashed var(--color_border) !important;
  background-color: #e0f0f5 !important;
  color: #0094c3 !important;
  padding: 8px;
  text-align: center;
  vertical-align: middle;
}
.phase-text {
  font-size: 0.9rem;
  font-weight: 600;
}

td.phase-cell {
  border-left: 1px solid #0094c3 !important;
  border-right: 1px solid #0094c3 !important;
    border-bottom: 1px dashed var(--color_border) !important;
  padding: 8px;
  text-align: left;
  vertical-align: middle;
}

/* サービス */
tr.service-table {
  border-bottom: 1px dashed #c7e4eb !important;
}
tr.table-end {
  border-bottom: 1px solid #0094c3 !important;
}

.service-table4 {
  height: 140px;
}
.service-table5 {
  height: 180px;
}

.service-cell {
  vertical-align: top !important;
}

.overlay-btn3 {
  position: absolute;
  top: calc(4 * 5.54rem + 2px); /* 4行目位置 */
  left: calc(2 / 6 * 102%);
  width: calc(3 / 6 * 97.3%);
  z-index: 2;
  text-align: center;
}
.overlay-btn3 button {
  width: 100%;
  padding: 6px 8px;
  font-size: 0.82rem;
  background: #e25211;
  color: white;
  border: none;
  border-radius: 4px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.2);
}
.overlay-btn3 button:hover {
  background-color: #eb6f37;
  border-radius: 4px;
}

.overlay-btn5 {
  position: absolute;
  top: calc(5 * 6.66rem + 2px); /* 5行目位置 */
  left: calc(2 / 6 * 52%);
  width: calc(5 / 6 * 98.4%);
  z-index: 2;
  text-align: center;
  pointer-events: auto;
}
.overlay-btn5 button {
  width: 100%;
  padding: 6px 8px;
  font-size: 0.82rem;
  background: #59959b;
  color: white;
  border: none;
  border-radius: 4px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.2);
}
.overlay-btn5 button:hover {
  background-color: #629fa6;
  border-radius: 4px;
}
.overlay-btn5 a , .overlay-btn3 a {
  color: #fff;
  width: 100%;
  display: block;
}

/*　ボタン共通設定 */
.cell-btn {
  display: block;
  width: 100%;
  margin: 6px 0;
  padding: 6px 12px;
  color: #fff;
  border: none;
  border-radius: 4px;
  font-size: 0.82rem;
  cursor: pointer;
  box-shadow: 0 2px 6px rgba(0,0,0,0.2);
  text-decoration: none;
  transition: opacity 0.3s ease;
}
.cell-btn a {
  display: block;
  color: #fff;
}

.cell-btn:hover {
  opacity: 0.7;
}


/* 各サービスボタンカラー */
.keikomi-btn {
  font-size: 0.75rem;
  background-color: #4a67b0;
  white-space: nowrap;
}
.news-btn {
  background-color: #e59a17;
  white-space: nowrap;
}
.hello-btn {
  background-color: #00489d;
  white-space: nowrap;
}
.feed-btn {
  background-color: #30b060;
  white-space: nowrap;
}
.kakuduke-btn {
  background-color: #f18d4e;
  white-space: nowrap;
}
.risk-btn {
  background-color: #1290a8;
  white-space: nowrap;
  font-size: 0.75rem;
  padding: 7px 0;
}


/*------スマホ切り替え------*/

@media screen and (max-width: 599px){
  .overlay-btn5 {
    top: calc(5 * 7rem + 2px); /* コンサル5行目位置 */
  }
}

/* -------------------------------- カスタマージャーニー -------------------------------- */



/* -------------------------------- サポート体制 -------------------------------- */

/*------スマホ切り替え------*/

@media screen and (min-width: 751px) {
  .sp {
    display:none;
  }
  .salon-text {
    padding-left: 5.5em;
    padding-right:5.5em;
  }
}

@media screen and (max-width: 781px) {
  .post_content h1 {
    font-size: 1.4em;
  }
  
  .salon-list-padding {
    padding-bottom: 3em;
  }
  
  .salon-text {
    padding-left: 1.5em;
    padding-right:1.5em;
  }
   .sp-column-reverse {
      flex-direction: column-reverse !important;
  }
  .salon-h {
    font-size: 1.15em !important;
  }
  .sp-padding {
    padding-bottom: 4em;
  }
  
  .sub-padding {
    padding-bottom: 3em;
  }
  
  img.banner {
    width: 100%;
  }
  .side-floating-icons {
    top:30%;
    gap: 8px;
    padding: 4px 4px;
  }
  .side-floating-icons img {
    width: 22px;
    height: 22px;
    transition: transform 0.2s ease;
  }
  
  .profile-box {
    flex-direction: column-reverse !important;
  }
}

/* -------------------------------- サポート体制 -------------------------------- */


/* -------------------------------- セミナースケジュール -------------------------------- */
/* サイドバー非表示 - 一覧ページ */
.post-type-archive-tribe_events .l-sidebar {
  display: none;
}
.post-type-archive-tribe_events .l-main {
  width: 100%;
}

/* サイドバー非表示 - 詳細ページ */
.single-tribe_events .l-sidebar {
  display: none;
}
.single-tribe_events .l-main {
  width: 100%;
}

.p-toc , .-double {
	display: none;
}

/* 見出しデザイン */
.tribe-events-content h2 {
	font-size: 1.4em;
	background: #0094c3;
	color: #fff;
	padding: .75em 1em;
	border-radius: var(--swl-radius--2, 0px);
}
.tribe-events-content h3 {
	font-size: 1.3em;
	line-height: 1.4;
	margin: 2em 0 2em;
	position: relative;
	padding: 0 .5em .5em;
	margin-bottom: 1em !important;
	
}
.tribe-events-content h3:where(:not([class^="swell-block-"]):not(.faq_q):not(.p-postList__title))::before {
	content: "";
	width: 100%;
	height: 2px;
	background: repeating-linear-gradient(90deg, var(--color_htag) 0%, var(--color_htag) 29.3%, rgba(150, 150, 150, .2) 29.3%, rgba(150, 150, 150, .2) 100%);
}
.tribe-events-content h3:before {
	bottom: 0;
	display: block;
	left: 0;
	position: absolute;
	z-index: 0;
}
.tribe-events-content h4 {
	font-size: 1.2em;
	font-weight: bold;
	border-left: 2px solid #0094c3;
	padding-left: 0.5em;
	margin: 2em 0 1em;
}

/* -------------------------------- セミナースケジュール -------------------------------- */


/* -------------------------------- デフォルト素材css変更 -------------------------------- */
.is-style-big_icon_point , .is-style-big_icon_good , .is-style-big_icon_hatena , .is-style-big_icon_memo , .is-style-big_icon_caution , .is-style-big_icon_bad {
	background: #fff;
}