@charset "utf-8";

/* 共通 標準要素 A
------------------------------------------------------------------------------------------------------------------------------------------------------------------ */
html {
	/*横向きにした際のフォントサイズ自動調整オフ */
	-webkit-text-size-adjust: 100%;
	/* ウェブフォント用設定。また、モリサワ系には指定時に別途回転をかける */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}



/* テキストリンク */
a:link    { color: #727681;	text-decoration:none; transition: all 0.3s ease; }
a:visited { color: #727681;	text-decoration:none; }
a:hover   { color: #0363C4; text-decoration:none; }
a:active  { color: #0363C4;	text-decoration:none; }

/* ページ */

/* ==========================================
nwk1: ヘッダー
========================================== */
.nwk1 {
width: 100%;
height: 76px;
position: fixed;
top: 0;
left: 0;
z-index: 1000;
}

.nwk1_inner {
position: relative;
z-index: 2;
width: 1200px;
height: 100%;
margin: 0 auto;
padding: 0;
display: flex;
justify-content: space-between;
align-items: center;
}

.nwk1_bg {
position: absolute;
top: 0;
right: 0;
z-index: 1;
height: 100%;
width: calc(50% + 660px);
background-image: url("../images/wk1bg.webp");
background-repeat: repeat-y;
background-position: left top;
background-size: 100% auto;
border-bottom-left-radius: 60px;
}

.nwk1_logo img {
display: block;
}

.nwk1_right {
display: flex;
align-items: center;
gap: 30px;
font-family: "Noto Sans JP", sans-serif;
font-weight: 900;
}

.nwk1_nav ul {
display: flex;
gap: 25px;
margin: 0;
padding: 0;
list-style: none;
}

.nwk1_nav a {
color: #fff;
font-size: 15px;
text-decoration: none;
transition: color 0.2s ease;
}

.nwk1_nav a:hover {
color: #fff6a1;
}

.nwk1_cta .btn_orange {
display: inline-block;
padding: 8px 28px 12px 28px;
border-radius: 30px;
font-size: 16px;
color: #fff;
text-decoration: none;
letter-spacing: 0.05em;
background: linear-gradient(to bottom, #ffc000 0%, #ff8300 50%, #ff5e00 100%);
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.25);
transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.nwk1_cta .btn_orange:hover {
transform: translateY(-1px);
box-shadow: 0 6px 8px rgba(0, 0, 0, 0.3);
}

/* ==========================================
nwk2: メインビジュアル
========================================== */
.nwk2 {
position: relative;
width: 1320px;
margin: 0 auto;
padding: 100px 0 15px 0;
}

.nwk2s90 { position: relative; margin: 0 auto; width: 100%; }

.nwk2img {
position: absolute;
top: -10px;
right: 0;
width: 850px;
}

.nwk2img img {
width: 100%;
}

.nwk2 h1 {
position: relative;
font-family: "Noto Sans JP", sans-serif;
font-weight: 900;
font-size: 64px;
line-height: 1.2;
margin: 20px 0 0 0;
background: linear-gradient(135deg, #4282c4 0%, #1a3c6e 50%, #0d1e38 100%);
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
color: transparent;
display: inline-block;
}

.nwk2 h2 {
position: relative;
width: 604px;
font-family: "Noto Sans JP", sans-serif;
font-weight: 400;
font-size: 28px;
line-height: 1.4;
margin: 20px 0 0 0;
}

.nwk2awrd {
position: relative;
margin: 20px 0 0 0;
width: 684px;
}

.nwk2awrd img {
width: 100%;
}

.btn_orange_large {
position: relative;
display: block;
width: 100%;
max-width: 680px;
margin: 110px auto 0 auto;
border-radius: 50px;
box-sizing: border-box;
overflow: hidden;
background: linear-gradient(to bottom, #ffc000 0%, #ff8300 50%, #ff5e00 100%);
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2);
transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.btn_orange_large a {
display: block;
width: 100%;
padding: 18px 0;
text-align: center;
text-decoration: none;
font-family: "Noto Sans JP", sans-serif;
font-weight: 700;
font-size: 28px;
color: #fff;
letter-spacing: 0.05em;
}

.btn_orange_large:hover {
transform: translateY(-2px);
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.25);
}

/* ==========================================
無限ループカルーセル & ポップアップモーダル
========================================== */
.infinite_carousel {
  width: 100%;
  background-color: #fff;
  padding: 70px 0 40px 0;
  position: relative;
  
  /* ドラッグ・スワイプ用の設定 */
  overflow-x: auto;
  touch-action: pan-y; /* 縦スクロールのみ許可（横スワイプ時のブラウザバック防止） */
  cursor: grab;
  -ms-overflow-style: none; /* IE, Edgeのスクロールバー非表示 */
  scrollbar-width: none;    /* Firefoxのスクロールバー非表示 */
}

/* Chrome, Safariのスクロールバー非表示 */
.infinite_carousel::-webkit-scrollbar {
  display: none;
}

.infinite_carousel:active {
  cursor: grabbing;
}

.carousel_track {
  display: flex;
  align-items: center;
  gap: 40px;
  width: max-content;
  /* CSSアニメーションはJSと競合するため削除 */
}

.carousel_item {
  flex-shrink: 0;
  cursor: pointer;
  transition: transform 0.2s ease;
  user-select: none; /* テキスト・画像選択を防止 */
  -webkit-user-drag: none;
}

.carousel_item:hover {
  transform: scale(1.05);
}

.carousel_item img {
  height: 200px;
  width: auto;
  display: block;
  object-fit: contain;
  pointer-events: none; /* 画像単体のドラッグ挙動を無効化し、親要素にイベントを渡す */
}

/* モーダル関連（変更なし） */
.popup_modal {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  z-index: 9999;
}

.popup_overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(15, 28, 48, 0.75);
  backdrop-filter: blur(8px);
}

.popup_content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: 2;
  font-family: "Noto Sans JP", sans-serif;
  color: #fff;
  text-align: center;
}

.popup_close {
  position: absolute;
  top: -10px;
  right: -80px;
  background: none;
  border: none;
  color: #fff;
  font-size: 50px;
  cursor: pointer;
  line-height: 1;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 300;
}

.popup_img_wrap {
  background-color: transparent;
  padding: 0;
  border-radius: 0;
  box-shadow: none;
  margin-bottom: 20px;
  display: flex;
  justify-content: center;
}

.popup_img_wrap img {
  max-height: 360px;
  width: auto;
  display: block;
}

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

.popup_title {
  font-size: 18px;
  font-weight: 700;
  margin: 0 0 3px 0;
  text-align: center;
}

.popup_sub {
  font-size: 32px;
  font-weight: 900;
  margin: 0 0 5px 0;
  letter-spacing: 0.05em;
  text-align: center;
}

.popup_client {
  font-size: 16px;
  font-weight: 700;
  margin: 0;
  text-align: center;
}

@media screen and (max-width: 1023px) {
}



/* ==========================================
nwk4: お悩みセクション
========================================== */
.nwk4 {
position: relative;
margin: 0;
padding: 65px 0 0 0;
width: 100%;
background-color: #f5f5f5;
}

.nwkmdsh3 h3 {
text-align: center;
color: #2F87B0;
font-size: 30px;
font-family: "Noto Sans JP", sans-serif;
font-weight: 700;
}

.nwkmdsline {
position: relative;
margin: 1em auto 1.5em auto;
width: 210px;
height: 4px;
background-color: #2F87B0;
}

.nwkmdstxt { margin: 0 auto; width: 100%; }

.nwkmdstxt p {
text-align: center;
color: #2F87B0;
font-size: 24px;
font-family: "Noto Sans JP", sans-serif;
font-weight: 400;
line-height: 1.6;
}

.nwk4_inner {
position: relative;
margin: 3em auto 0 auto;
padding: 0 0 2em 0;
width: 1280px;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
box-sizing: border-box;
}

.nwk4inbx {
position: relative;
padding: 1.5em;
width: 220px;
background-color: #fff;
border-radius: 10px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.nwk4inbximg {
position: relative;
margin: 0 auto;
width: 100%;
max-width: 140px;
}

.nwk4inbximg img {
width: 100%;
}

.nwk4inbxtxt {
position: relative;
margin: 1em auto 0 auto;
}

.nwk4inbxtxt p {
color: #2F87B0;
text-align: center;
font-size: 19px;
font-weight: 700;
line-height: 1.4;
}

/* ==========================================
nwk5: アプレの3つの強み
========================================== */
.nwk5 {
position: relative;
margin: 0;
padding: 0;
width: 100%;
background-image: url("../images/wk5bg.webp");
background-repeat: no-repeat;
background-size: 100% 100%;
z-index: 0;
overflow: hidden;
}

.nwk5ue {
position: relative;
margin: 0 auto;
width: 100%;
height: 70px;
z-index: 10;
}

.nwk5ue img {
width: 100%;
height: 100%;
display: block;
}

.nwk5lef {
position: absolute;
top: -50px;
left: 0px;
width: 700px;
height: auto;
z-index: 1;
}

.nwk5lef img {
width: 100%;
display: block;
}

.nwk5rig {
position: absolute;
top: -200px;
right: 0px;
width: 470px;
height: auto;
z-index: 1;
}

.nwk5rig img {
width: 100%;
display: block;
}

.nwk5_inner {
position: relative;
margin: 0 auto;
padding: 75px 0;
width: 1200px;
min-height: 500px;
z-index: 2;
}

.nwk5tit {
position: relative;
margin: 0 auto;
width: 515px;
}

.nwk5tit img {
width: 100%;
}

.nwk5k_container {
position: relative;
margin: 3em auto 1em auto;
display: flex;
justify-content: space-between;
align-items: flex-start;
width: 1100px;
padding: 0;
box-sizing: border-box;
}

.nwk5k_card {
width: 320px;
display: flex;
flex-direction: column;
box-sizing: border-box;
}

.nwk5cd_header {
display: flex;
align-items: center;
margin-bottom: 24px;
}

.nwk5num_box {
width: 40px;
margin-right: 25px;
flex-shrink: 0;
}

.nwk5num_img {
width: 100%;
height: auto;
display: block;
}

.nwk5cd_title {
margin: 0;
font-size: 30px;
font-family: "Noto Sans JP", sans-serif;
font-weight: 700;
line-height: 1.2;
color: #fff;
}

.nwk5cd_text {
margin: 0 0 24px 0;
font-size: 22px;
line-height: 1.5;
color: #fff;
text-align: justify;
font-family: "Noto Sans JP", sans-serif;
font-weight: 400;
}

.nwk5cd_photo {
width: 100%;
border-radius: 12px;
overflow: hidden;
}

.nwk5cd_photo img {
width: 100%;
height: auto;
}

/* ==========================================
nwk6: トータルサポート
========================================== */
.nwk6 {
position: relative;
margin: 0;
padding: 1.5em 0 0 0;
width: 100%;
}

.nwk6_container {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
row-gap: 50px;
width: 1200px;
margin: 2em auto 0 auto;
padding: 0;
box-sizing: border-box;
}

.nwk6_item {
width: 210px;
display: flex;
flex-direction: column;
align-items: center;
box-sizing: border-box;
}

.nwk6_icon_box {
width: 100%;
height: 140px;
display: flex;
justify-content: center;
align-items: center;
margin-bottom: 20px;
}

.nwk6_icon_img {
max-width: 100%;
max-height: 100%;
width: auto;
height: auto;
display: block;
object-fit: contain;
}

.nwk6_label {
width: 100%;
height: 46px;
background-color: #333333;
color: #ffffff;
font-size: 16px;
font-weight: bold;
border-radius: 23px;
display: flex;
justify-content: center;
align-items: center;
text-align: center;
letter-spacing: 0.03em;
white-space: nowrap;
box-sizing: border-box;
padding: 0 10px;
}

/* ==========================================
nwk7: お客様の声 (80%縮小版)
========================================== */
.nwk7 {
position: relative;
margin: 1.6em auto 0 auto;
padding: 7.2em 0 4em 0;
width: 100%;
min-height: 1600px;
background-image: url("../images/wk7bg.webp");
background-repeat: no-repeat;
background-position: center top;
background-size: 1600px auto;
}

.nwk7_container {
width: 864px;
margin: 0 auto;
padding: 0;
}

.nwk7_con1 { position: relative; margin: 160px auto 0 auto; width: 100%; height: 680px; padding-left: 456px; }
.nwk7_con2 { position: relative; margin: 80px auto 0 auto; width: 100%; height: 760px; padding-right: 456px; }
.nwk7_con3 { position: relative; margin: 80px auto 0 auto; width: 100%; height: 680px; padding-left: 456px; }
.nwk7_con4 { position: relative; margin: 80px auto 0 auto; width: 100%; height: auto; min-height: 720px; padding-right: 456px; }

.nwk7_conbx {
width: 408px;
margin: 0 auto;
padding: 0;
background-color: transparent;
font-family: "Noto Sans JP", sans-serif;
color: #333333;
box-sizing: border-box;
}

.nwk7_title {
margin: 0 0 19.2px 0;
font-size: 24px;
font-weight: 700;
line-height: 1.35;
}

.nwk7_text {
margin: 0 0 22.4px 0;
font-size: 19.2px;
font-weight: 400;
line-height: 1.7;
text-align: justify;
}

.nwk7_author {
text-align: right;
margin-bottom: 16px;
}

.nwk7_company {
font-size: 19.2px;
font-weight: 700;
line-height: 1.4;
}

.nwk7_name {
font-size: 19.2px;
font-weight: 700;
line-height: 1.4;
margin-top: 3.2px;
}

.nwk7_divider {
border: none;
border-top: 1.2px solid #666666;
margin: 0 0 16px 0;
}

.nwk7_list {
display: flex;
flex-wrap: wrap;
list-style: none;
margin: 0;
padding: 0;
row-gap: 12.8px;
}

.nwk7_item {
display: flex;
align-items: center;
width: 50%;
font-size: 16px;
font-weight: 700;
color: #2b7ab9;
box-sizing: border-box;
}

.nwk7_item_full {
width: 100%;
}

.nwk7_check_icon {
width: 20.8px;
height: auto;
margin-right: 9.6px;
flex-shrink: 0;
}

.nwk7_con1img { position: absolute; top: -24px; left: -80px; width: 509.6px; }
.nwk7_con1img img { width: 100%; }
.nwk7_con2img { position: absolute; top: 88px; right: -32px; width: 436px; }
.nwk7_con2img img { width: 100%; }
.nwk7_con3img { position: absolute; top: 0px; left: 64px; width: 331.2px; }
.nwk7_con3img img { width: 100%; }
.nwk7_con4img { position: absolute; top: 16px; right: -120px; width: 504px; }
.nwk7_con4img img { width: 100%; }



/* ==========================================
nwk8: 周年事業の進め方
========================================== */
.nwk8 {
position: relative;
margin: 0;
padding: 0;
width: 100%;
background-image: url("../images/wk8bg.webp");
background-repeat: no-repeat;
background-size: 100% 100%;
z-index: 0;
overflow: hidden;
}

.nwk8ue {
position: relative;
margin: 0 auto;
width: 100%;
height: 70px;
z-index: 10;
}

.nwk8ue img {
width: 100%;
height: 100%;
display: block;
}

.nwk8_inner {
position: relative;
margin: 0 auto;
padding: 50px 0 80px 0;
width: 1200px;
min-height: 500px;
z-index: 2;
}

.nwkmdsfh3 { position: relative; margin-top: 80px; }
.nwkmdsfh3 h3 { text-align: center; color: #fff; font-size: 30px; font-family: "Noto Sans JP", sans-serif; font-weight: 700; }
.nwkmdsfline { position: relative; margin: 1em auto 1.5em auto; width: 210px; height: 4px; background-color: #fff; }

.nwkmdsftxt { position: relative; margin: 0 auto; width: 100%; }

.nwkmdsftxt p { text-align: center; color: #fff; font-size: 24px; font-family: "Noto Sans JP", sans-serif; font-weight: 400; line-height: 1.6; }

.nwk8_conbx {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: flex-start;
width: 1200px;
margin: 0 auto;
padding: 0;
background-color: transparent;
font-family: "Noto Sans JP", sans-serif;
box-sizing: border-box;
}

.nwk8_item {
width: 240px;
display: flex;
flex-direction: column;
box-sizing: border-box;
}

.nwk8_photo_box {
width: 100%;
height: 180px;
border-radius: 20px;
overflow: hidden;
margin-bottom: 20px;
}

.nwk8_photo {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}

.nwk8_title {
margin: 0 0 16px 0;
font-size: 30px;
font-weight: 900;
color: #ffffb3;
text-align: center;
line-height: 1.2;
letter-spacing: 0.05em;
}

.nwk8_list {
margin: 0;
padding: 0;
list-style: none;
}

.nwk8_list li {
position: relative;
padding-left: 18px;
font-size: 20px;
font-weight: 400;
color: #ffffff;
line-height: 1.45;
margin-bottom: 8px;
letter-spacing: -0.02em;
}

.nwk8_list li:last-child {
margin-bottom: 0;
}

.nwk8_list li::before {
content: "・";
position: absolute;
left: 0;
top: 0;
color: #ffffff;
font-weight: bold;
}

.nwk8_arrow_box {
width: 36px;
height: 180px;
display: flex;
justify-content: center;
align-items: center;
flex-shrink: 0;
}

.nwk8_arrow {
width: 100%;
height: auto;
display: block;
padding-top: 70px;
}

/* ==========================================
nwk9: よくある質問
========================================== */
.nwk9 {
position: relative;
margin: 0;
padding: 5em 0 7em 0;
width: 100%;
}

.nwk9_conbx {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
width: 1280px;
margin: 4em auto 0 auto;
padding: 0;
background-color: transparent;
row-gap: 50px;
font-family: "Noto Sans JP", sans-serif;
box-sizing: border-box;
}

.nwk9_card {
width: 610px;
min-height: 290px;
position: relative;
cursor: pointer;
user-select: none;
display: grid;
}

.nwk9_card_off {
grid-area: 1 / 1;
width: 100%;
height: 100%;
border-radius: 24px;
background-image: url("../images/wk9cardbg.webp");
background-repeat: no-repeat;
background-size: 100% 100%;
clip-path: polygon(0 0, 100% 0, 100% calc(100% - 40px), calc(100% - 40px) 100%, 0 100%);
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding: 35px 30px;
box-sizing: border-box;
opacity: 1;
visibility: visible;
transition: opacity 0.3s ease, visibility 0.3s ease;
}

.nwk9_card::after {
content: "";
position: absolute;
bottom: 0;
right: 0;
width: 40px;
height: 40px;
background-color: #ffaf92;
border-radius: 0 0 16px 0;
clip-path: polygon(0 0, 0 100%, 100% 0);
box-shadow: -2px 2px 5px rgba(0,0,0,0.15);
transition: opacity 0.3s ease;
z-index: 2;
pointer-events: none;
}

.nwk9_q_symbol {
font-size: 50px;
font-weight: 900;
color: rgba(255, 255, 255, 0.7);
line-height: 1;
margin-bottom: 40px;
}

.nwk9_q_text {
margin: 0;
font-size: 27px;
font-weight: 900;
color: #ffffff;
text-align: center;
line-height: 1.4;
letter-spacing: 0.02em;
}

.nwk9_card_on {
grid-area: 1 / 1;
width: 100%;
height: 100%;
border-radius: 24px;
background-color: #ffaf92;
padding: 35px 35px;
box-sizing: border-box;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
opacity: 0;
visibility: hidden;
transition: opacity 0.3s ease, visibility 0.3s ease;
}

.nwk9_a_title {
font-size: 22px;
font-weight: 900;
color: #ffffff;
text-align: center;
line-height: 1.35;
width: 100%;
padding-bottom: 14px;
border-bottom: 2px solid #ffffff;
margin-bottom: 14px;
letter-spacing: 0.01em;
}

.nwk9_a_text {
margin: 0;
font-size: 23px;
font-weight: 900;
color: #ffffff;
text-align: justify;
line-height: 1.45;
letter-spacing: 0.01em;
}

.nwk9_card.is-active .nwk9_card_off {
opacity: 0;
visibility: hidden;
}

.nwk9_card.is-active .nwk9_card_on {
opacity: 1;
visibility: visible;
}

.nwk9_card.is-active::after {
opacity: 0;
}

/* ==========================================
apb9 & apb10 & apb11 & apb12: 取引実績・フォーム・電話・フッター
========================================== */
.nwkmdsh3bk h3 {
text-align: center;
color: #333;
font-size: 30px;
font-family: "Noto Sans JP", sans-serif;
font-weight: 700;
}

.nwkmdslinebk {
position: relative;
margin: 1em auto 1.5em auto;
width: 210px;
height: 4px;
background-color: #333;
}

.apb9 { 
position: relative; 
margin: 0 auto; 
padding: 0 0 2em 0; 
width: 100%; 
background-color: #fcf6ea;
}

.apb9_container { 
position: relative;
display: block;
margin: 0 auto;
padding: 5em 0;
width: 1060px;
box-sizing: border-box;
}

/* 2. 白いカコミ（幅1000px） */
.apb9wk {
background-color: #ffffff; /* 内側の白 */
width: 100%;
margin: 4em auto 0 auto; /* コンテナ内で中央配置にする */
box-sizing: border-box;
border-radius: 16px; /* 角丸 */

/* 中のパディング（テキストの上下左右の余白） */
padding: 60px 60px; 

/* floatをクリアするための設定 */
overflow: hidden; 
}

/* 3. テキストエリアのスタイル */
.apb9txt {
font-size: 1.2rem; /* やや大きめで読みやすいフォントサイズ */
line-height: 1.8;   /* 画像のゆったりした行間を再現 */
text-align: justify; /* 左右の端を綺麗に揃える */
margin: 0;
word-break: break-all;
position: relative;
display: block;
}

.keishoryaku { position: absolute; bottom:0; right: 0; }



/* 4. 右上の画像バッジ（右上配置・丸型回り込み） */
.apb9bdg { position: relative; right: -30px;
float: right;        /* 右側に寄せてテキストを回り込ませる */
width: 230px;        /* 画像の表示サイズ */
height: 230px;
margin-top: -10px;
margin-left: 25px;   /* テキストとの横の余白 */
margin-bottom: 20px; /* 下に来るテキストとの縦の余白 */

/* 画像の円形に沿ってテキストを回り込ませる設定 */
shape-outside: circle(37%); 

object-fit: contain;
user-select: none;
}

.apb10 { 
position: relative; 
margin: 0 auto; 
padding: 0; 
width: 100%; 
		background-color: #fff;
}

.apb10_container { position: relative;
display: block;
margin: 0 auto;
padding: 5em 0 5em 0;
width: 900px;
}

.apb10wk { margin: 0 auto 0 auto; width: 100%; display: block; }

/* フォームのコンテナ */
.fm_container { 
padding-top: 2em; 
margin: 0 auto;
width: 100%;
max-width: 900px;
box-sizing: border-box;
}

/* 各入力行のラップ */
.fm_row {
display: flex;
margin-bottom: 24px;
align-items: stretch;
}

/* 左側：濃紺のラベルエリア（通常の項目はデフォルトの横並び） */
.fm_label {
background-color: #353535;
color: #ffffff;
width: 190px;
min-height: 54px;
display: flex;
align-items: center;
justify-content: center;
font-size: 1em;
font-weight: bold;
letter-spacing: 0.05em;
flex-shrink: 0;
padding: 12px 15px;
box-sizing: border-box;
text-align: center;
line-height: 1.4;
}

/* ★お問い合わせ内容専用：要素を縦並び（改行）にするクラス */
.fm_label_vertical {
flex-direction: column;
}

/* 必須マーク（＊：通常項目用は横に並び続けるように設定） */
.fm_required { 
display: inline-block;
color: #ffffff;
margin-left: 4px;
font-weight: normal;
}

/* 注記（複数選択可など）のスタイル */
.fm_note {
font-size: 0.75em;
font-weight: normal;
display: block;
margin-top: 6px; /* 上のテキストとの隙間を確保 */
}

/* 右側：入力エリア */
.fm_field {
flex-grow: 1;
margin-left: 24px;
display: flex;
gap: 20px;
align-items: center;
}

/* 各種テキスト入力フィールド */
.fm_input_text {
width: 100%;
height: 54px;
background-color: #f5f5f5;
border: none;
box-sizing: border-box;
padding: 0 20px;
font-size: 1.1em;
color: #333333;
}

.fm_input_text::placeholder {
color: #b0b0b0;
font-size: 0.95em;
}

/* お問い合わせ内容の詳細（テキストエリア） */
.fm_textarea {
width: 100%;
min-height: 400px;
background-color: #f5f5f5;
border: none;
box-sizing: border-box;
padding: 20px;
font-size: 1.1em;
color: #333333;
resize: vertical;
font-family: inherit;
}

/* チェックボックス群のリスト */
.fm_check_list {
list-style: none;
padding: 0;
margin: 0;
width: 100%;
display: flex;
flex-direction: column;
gap: 24px;
}

.fm_check_item {
display: flex;
align-items: center;
cursor: pointer;
user-select: none;
font-size: 1.1em;
font-weight: bold;
color: #353535;
}

.fm_check_item input[type="checkbox"] {
display: none;
}

/* カスタムの円形チェックマーク */
.fm_custom_indicator {
width: 28px;
height: 28px;
border: 3px solid #353535;
border-radius: 50%;
margin-right: 15px;
box-sizing: border-box;
display: inline-block;
position: relative;
background-color: #ffffff;
flex-shrink: 0;
}

/* チェックが入ったときの真ん中の丸 */
.fm_check_item input[type="checkbox"]:checked + .fm_custom_indicator::after {
content: "";
position: absolute;
width: 14px;
height: 14px;
background-color: #2f78b0;
border-radius: 50%;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}

/* 送信ボタンエリア（display: flexを明示的に指定） */
.fm_submit_area {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
margin-top: 50px;
width: 100%;
}

.fm_btn_submit {
background-color: #353535;
color: #ffffff;
border: none;
width: 240px;
height: 60px;
font-size: 1.3em;
font-weight: bold;
cursor: pointer;
transition: opacity 0.2s ease;
letter-spacing: 0.1em;
}

.fm_btn_submit:hover {
opacity: 0.9;
}

.fm_input_text:focus, .fm_textarea:focus {
outline: 2px solid #353535;
}

/* 未選択時のエラーメッセージ用スタイル */
.fm_error_msg {
color: #ff3333;
font-size: 0.9em;
font-weight: bold;
margin-top: 15px;
display: none; /* 初期状態は非表示 */
}

/* 送信完了メッセージのスタイル（大きな太い赤文字） */
.fm_success_msg {
color: #ff3333;
font-size: 1.8em; /* 大きな文字サイズ */
font-weight: 900;
text-align: center;
margin-top: 25px; /* ボタンとの隙間 */
letter-spacing: 0.05em;
display: none;    /* 初期状態は非表示（JSで制御） */
}

.apb11 { 
position: relative; 
margin: 0 auto; 
padding: 0; 
width: 100%; 
background-color: #f5f5f5;
}

.apb11_container { position: relative;
display: block;
margin: 0 auto;
padding: 2.5em 0 3.5em 0;
width: 1110px;
}

.apb11 h2 { scroll-margin-top: 80px; 
color: #353535;
text-align: center;
font-size: 50px;
font-style: normal;
font-weight: 900;
line-height: 1.3;
}

/* 指定のラップ要素（コンポーネントの親枠として機能） */
.apb11wk {
width: 100%;
padding: 10px 20px 0px 20px;
box-sizing: border-box;
display: flex;
justify-content: center;
align-items: center;
}

/* 1. 全体を包むコンテナ（要素の横並びを制御） */
.tel_wrapper {
display: flex;
align-items: center;
justify-content: center;
gap: 15px; /* アイコン、電話番号、受付時間の間の余白 */
box-sizing: border-box;
width: 100%;
max-width: 1110px;
}

/* 2. 左側の電話ピクトグラム（画像） */
.tel_icon {
width: 56px; /* 画像の表示サイズ */
height: auto;
object-fit: contain;
flex-shrink: 0;
user-select: none;
}

/* 3. 中央の電話番号テキスト */
.tel_number {
color: #353535; /* 特徴的な濃紺のブランドカラー */
font-size: 65px; /* 力強い太字サイズ */
font-weight: 900; /* 最も太いウエイト */
line-height: 1;
margin: 0;
white-space: nowrap; /* 途中で意図しない改行を防ぐ */
}

/* 4. 右側の受付時間エリア */
.tel_info {
color: #353535;
font-size: 26px; /* 電話番号に対してバランスの良い大きめのサイズ */
font-weight: 900;
line-height: 1.1;
flex-shrink: 0;
}

/* 「※」注記の行に少し上の隙間を作る */
.tel_info_note {
display: block;
font-size: 1em;
margin-top: 4px;
}

.apb12 { 
position: relative; 
margin: 0 auto; 
padding: 0; 
width: 100%; 
background-image: url("../images/footerbg.webp");
background-repeat: no-repeat;
background-size: 100% 100%;
}

.apb12_container { position: relative;
display: block;
margin: 0 auto;
padding: 2em 0 2em 0;
width: 1110px;
}

.apb12 h6 {
color: #fff;
text-align: center;
font-size: 23px;
font-style: normal;
font-weight: 700;
margin-bottom: 0.5em;
}

.apb12 p { 
color: #fff;
text-align: center;
font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: 28px;
}

.apb12 p a:link    { color: #fff;	text-decoration:none; transition: all 0.3s ease; }
.apb12 p a:visited { color: #fff;	text-decoration:none; }
.apb12 p a:hover   { color: #fff; text-decoration:none; }
.apb12 p a:active  { color: #fff;	text-decoration:none; }



/* thanks.html */

.thankwk {
position: relative;
width: 1320px;
margin: 0 auto;
padding: 100px 0 15px 0;
}

.thankwk90 { position: relative; margin: 0 auto; width: 100%; }


.hcmt { position: relative; margin: 0 auto; padding: 6em 0; }

.hcmt h2 {
color: #353535;
font-size: 40px;
font-style: normal;
font-weight: 900;
line-height: 1.3;
text-align: center !important;
}

.hcmt h3 { 
margin: 2em 0 0 0;
color: #353535;
text-align: center;
font-size: 28px;
font-style: normal;
font-weight: 700;
line-height: 1.5;
width: 100%;
}

.hcmt p { 
margin: 2em 0 0 0;
color: #353535;
text-align: center;
font-size: 20px;
font-style: normal;
font-weight: 700;
line-height: 1.3;
width: 100%;
}

/* PC版の電話リンクを無効にする */
a[href^="tel:"] {
pointer-events: none;
}

/* スマホ版のみ表示する。PC版では削除 */
.sponly { display:none; }

/* PC版のみ表示する。スマホ版では削除 */
.pconly { display:block; }

/* ハンバーガーボタン（デフォルトは非表示） */
.sp_menu_btn {
display: none;
}

/* SP表示用のヘッダー領域 */
.sp_header_top {
display: none;
}



/* ページトップへ戻るボタンの固定配置設定 */
#js_top_wrap {
  position: fixed;
  right: 20px;       /* 画面右端からの距離（適宜調整してください） */
  bottom: 20px;      /* 画面下端からの距離（適宜調整してください） */
  z-index: 99;     /* 他の要素より手前に表示 */
  display: none;     /* JS実行前の初期状態は非表示（JS側でも制御されます） */
}

#js_top_btn {
  display: block;
  cursor: pointer;
  transition: opacity 0.3s ease;
}

#js_top_btn:hover {
  opacity: 0.8;
}

#js_top_btn img {
  display: block;
  width: 70px;       /* ボタン画像の幅（デザインに合わせて調整） */
  height: auto;
}

/* スマホ用調整（必要に応じて common_sp.css などで調整してください） */
@media screen and (max-width: 768px) {
  #js_top_wrap {
    right: 15px;
    bottom: 15px;
  }
  #js_top_btn img {
    width: 50px;     /* スマホ時のボタンサイズ */
  }
}



/* 固定ヘッダーの高さ分（約100px〜120px）だけ上部に余白を確保 */
#strength,
#voice,
#flow,
#faq,
#contact,
#lptop {
  scroll-margin-top: 120px; /* 固定ヘッダーの高さ + 余白 */
}