@charset "utf-8";
/*
Theme Name: Lightning Child
Theme URI:
Template: lightning
Description:
Author:アートフレア株式会社
Tags: 
Version: 1.1
*/

/* 標準データ最終更新日：2024/11/22  */


/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
 *  general　全体的な設定
 * ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

/* :root設定、@import、フォント読み込み、bodyへの上書き、カラー変数設定など */
:root {
  --num: 'Montserrat', sans-serif;
  --jp: 'IBM Plex Sans JP', sans-serif;
}
body, html {
	color: #000;
	font-family: var(--jp);
}
.num-font {
  font-family: var(--num);
}
/*ヘッダーを非表示*/
header {
	display: none;
}
/*ハンバーガーメニューを非表示*/
#vk-mobile-nav-menu-btn {
    display: none;
}

 a:not([class]) {
    text-decoration: underline;
	-webkit-text-decoration-style: solid;
	text-decoration-style: solid;
    text-underline-offset: 2px;
    text-decoration-thickness: 1px;
}
a:not([class]):hover {
    color: var(--vk-color-text-link-hover);
}
/* Mediaとテキスト */
.wp-block-media-text:not(.has-media-on-the-right) .wp-block-media-text__content {
    padding-right: 0;
}
.wp-block-media-text.has-media-on-the-right .wp-block-media-text__content {
    padding-left: 0;
}

@media (max-width: 768px) {
	.wp-block-media-text .wp-block-media-text__content {
		padding:0;
		margin-top:1em;
	}
}

/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
 *  common 汎用パーツ系
 * ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

/* 繰り返しボタン・見出し、余白設計など */
/*CTAエリア*/
.cta-area {
  max-width: 880px;
  margin: 0 auto;
}
.cta-tel a, .cta-mail a {
	height: 108px;
	max-width: 100%;
	align-items: center;
    justify-content: center;
	display: flex;
    flex-direction: column;
}
.cta-mail a {
	background-color: rgb(255 255 1 / 90%) !important
}
.cta-mail a:hover {
	background-color: rgb(255 255 1 / 100%)!important;
	opacity: 1;
}
.cta-tel .vk_button_link_txt{
	font-size: 2.5rem;
	font-weight: 600;
	line-height: 1.2;
}
.cta-mail .vk_button_link_txt{
	font-size: 2.25rem;
	font-weight: 700;
	line-height: 1.2;
}
/**/
.mark-bg {
	display: flex;
    background: #E30606;
    text-align: center;
    color: #fff;
    margin: 0 auto;
    justify-content: center;
    align-items: center;
    width: 80px;
	line-height: 2;
	font-weight: 600;
    border-radius: 50vw;
}
.youtube-box iframe {
	aspect-ratio: 16 / 9;
	width: 100%;
	height: auto;
	display: block;
	height: auto !important;
}
.no-gap {
	gap: 0!important;
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
 *  header ヘッダーまわり
 * ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

	/* ヘッダーウィジェット・グローバルナビ */

/* ヘッダー固定 */
body  {
	overflow-x: unset !important;
    display: flex;
    flex-direction: column;
}
.device-pc #site-header {
    position: sticky;
    top: 0;
}
.logged-in #site-header {
    top: 32px;
}

/* グローバルナビ */
.global-nav-list>li>a {
	transition: .3s;
	border-bottom: 3px solid transparent;
}

.global-nav-list>li>a:hover,
.global-nav-list>li.current-menu-item>a {
    color: var(--vk-color-custom-1);
/*     border-bottom: 3px solid var(--vk-color-custom-1); */
}

/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
 *  footer フッターまわり
 * ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

	/* フッターウィジェット、フッターロゴ、コピーライト */


/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
 *  pageheader,breadcrumb 下層ページヘッダー
 * ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

	/* 下層ページのページヘッダー、パンクズ設定 */



/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
 *  Toppage トップページ
 * ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

/* ページごと、パーツごとにコメントアウトで注釈を入れてください。 */
/*メインイメージ*/
.main-image figure {
	margin-bottom: 0!important;
}
.main-ttl {
	margin: 0 2vw;
}
/*左右レイアウト*/
.leftside-area {
	position: relative;
	margin-right: calc(50% - 48vw);
}
.txt-area {
	position: relative;
}
.leftside-area .ttl-img {
	position: absolute;
    top: -10%;
    left: -15%;
    z-index: 10;
}
.leftside-area .list-box {
	padding: 2em;
    box-shadow: 4px 4px 4px 0px rgb(51 51 51 / 13%);
	width: 90%;
	margin-left: -12%;
	padding-left: 16%;
	position: relative;
	margin-top: 25%;
	font-size: 1.5rem;
	font-weight: 600;
}
.rightside-area {
	margin-left: calc(50% - 48vw);
	position: relative;
}
.rightside-area .txt-area {
	position: relative;
	justify-content: flex-end;
}
.rightside-area .ttl-img {
	position: absolute;
    top: -10%;
    left: 5%;
    z-index: 10;
}
.rightside-area .list-box {
    padding: 3em 0;
    box-shadow: 4px 4px 4px 0px rgb(51 51 51 / 13%);
    width: 90%;
    margin-left: 20%;
    padding-right: 10%;
    padding-left: 7%;
    position: relative;
    margin-top: 25%;
	font-size: 1.1rem;
	font-weight: 600;
}
/*左右レイアウト ポイント*/
.list-box.point {
	margin-top: 24%;
	padding: 3em;
	font-size: 1.1rem;
	margin-left: 0;
	box-shadow: 0px 0px 8px 0px rgb(51 51 51 / 13%);
}
.point-area {
	padding: 1.5em 1.5em 1.5em 1.2em;
}
.point-ttl {
	font-size: 1.8rem;
}
.point-list  {
	font-size: 1.2rem;
}
.img-area {
  width: 100%;
  aspect-ratio: 1000 / 662;
  display: flex;
  justify-content: center;
  /*align-items: flex-end;*/
  background: transparent;
	z-index: 5;
}
.img-area img {
	box-shadow: 20px 20px 0px rgb(227 6 6 / 70%);
	max-width: 100%;
	max-height: 100%;
	object-fit: cover;
	display: block;
}
.rightside-area .img-area img {
	box-shadow: -20px 20px 0px rgb(227 6 6 / 70%);
}
.rightside-area .list-box.point {
	margin-left: auto;
}
@media (max-width: 1199px) {
	.leftside-area .list-box {
		padding: 2em;
		margin-left: -10%;
		padding-left: 13%;
		font-size: 1.2rem;
		width: 95%;
	}
	.list-box.point {
		margin-top: 21%;
		padding: 3em;
		font-size: 1.1rem;
		margin-left: 0;
	}
}
/*黒帯見出し*/
.bkbg {
  background-color: #000;
  color: #fff;
clip-path: polygon(0 20%, 100% 0%, 100% 100%, 0% 80%);
  padding: 8em 1em;
  text-align: center;
  position: relative;
  z-index: 2;
}
.bkbg-ttl {
  margin: 0 auto;
  position: relative;
	font-size: 3rem;
}
.bkbg-ttl::after {
    content: '';
    display: block;
    width: 230px;
    height: 230px;
    background-repeat: no-repeat;
    background-image: url(../../../wp-content/uploads/path01.png);
    background-size: contain;
    position: absolute;
    right: 0;
    top: 0;
    transform: translateY(-16%);
}
.sec .bkbg-ttl::after {
    content: '';
    display: block;
    width: 230px;
    height: 230px;
    background-repeat: no-repeat;
    background-image: url(../../../wp-content/uploads/path02.png);
    background-size: contain;
    position: absolute;
    right: 0;
    top: 0;
    transform: translateY(-16%);
}
.bkbg-left {
	background-color: #000;
	color: #fff;
	clip-path: polygon(0 0%, 100% 20%, 100% 80%, 0% 100%);
	padding: 8em 1em;
	text-align: center;
	position: relative;
	z-index: 2;
}
.bkbg-left-ttl {
  margin: 0 auto;
  position: relative;
	font-size: 3rem;
}
.bkbg-left-ttl::before {
    content: '';
    display: block;
    width: 230px;
    height: 230px;
    background-repeat: no-repeat;
    background-image: url(../../../wp-content/uploads/path02.png);
    background-size: contain;
    position: absolute;
    left: 0;
    top: 0;
    transform: translateY(-16%);
}
/*提供サービス*/
.service-box_inner {
	box-shadow: 10px 10px 0px 0px rgb(51 51 51 / 80%);
	margin: 0 auto;
	max-width: 1400px;
	border: 10px solid #fff;
}
.service-ttl {
	font-size: 3rem;
	font-weight: 700;
	color: #fff;
}
.service-box .row {
	margin: auto;
	display: flex;
	align-items: center;
	justify-content: center;
}
.service-item {
    position: relative;
    background: #fff;
	max-width: 330px!important;
	height: 80px;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 10px;
	padding: 0 10px!important;
}
.btn-p {
	position: relative;
    z-index: 10;
    background: #fff;
	margin: 0 auto;
	font-weight: 500;
	font-size: 1.25rem;
	line-height:1.4;
}
.service-item::before {
    position: absolute;
    width: 100%!important;
    height: 80px;
    z-index: -1;
    top: 10px;
    right: -10px;
    content: '';
    background-image: url(../../../wp-content/uploads/btn-bg.png);
	background-repeat: repeat-x;
	background-size: cover;
}
.service-item {
	flex: 0 0 43%!important;
}
@media (min-width: 992px) {
    .service-item {
        flex: 0 0 28%!important;
    }
}
/*カルーセル*/
.slider-ttl {
	font-size: 3rem;
	text-shadow: 0 0 20px #fff;
}
/*青タイトル*/
.blue-ttl {
	text-align: center;
	position: relative;
	z-index: 10;
}
.blue-ttl img {
	max-width: 976px;
}
.blue-ttl-und {
	margin-top: -4em!important;
}
/*比較表*/
.hikaku-wrap {
	background-color: #fff;
	padding: 0 2em;
}
.hikaku .wp-block-column.is-vertically-aligned-stretch {
    align-self: stretch;
	display: flex;
	align-items: center;
	justify-content: center;
}
/*申し込みの流れ*/
.cta-area.flow {
	max-width: 77%;
}
.cta-area.flow .cta-tel a, 
.cta-area.flow .cta-mail a {
	height: 80px;
	max-width: 100%;
	box-shadow: 2px 2px 2px 0px rgb(51 51 51 / 13%);
}
.cta-area.flow .cta-tel .vk_button_link_txt{
	font-size: 1.5rem;
}
.cta-area.flow .cta-mail .vk_button_link_txt{
	font-size: 1.25rem;
}
.vk_step .vk_step_item .vk_step_item_dot.vk_step_item_style-default {
    color: #fff;
    font-family: var(--num);
    font-weight: 600;
}
/*よくある質問*/
.is-style-vk_faq-bgfill-circle .vk_faq_content:before {
    background-color: #0058c4;
    color: #fff !important;
}
/*データで見るカウント*/
.data-ttl {
	font-size: 3rem;
	text-shadow: 4px 4px #000000d9;
}
.count-grid .row {
	margin: 0!important;
}
.count-box-wrapper {
	background: black;
    clip-path: polygon(1% 4%, 100% 0%, 98% 97%, 2% 99%);
    padding: 18px!important;
    box-sizing: border-box;
 }
.count-box-wrapper.one {
	background: black;
    clip-path: polygon(1% 4%, 100% 0%, 98% 92%, 2% 88%);
    padding: 30px!important;
    box-sizing: border-box;
 }
.count-box-wrapper.odd {
	background: black;
    clip-path: polygon(2% 1%, 98% 4%, 99% 100%, 2% 97%);
    padding: 18px!important;
    box-sizing: border-box;
 }
.count-txt {
    font-size: 1.1rem;
}
.count-txt.one {
    font-size: 1.5rem;
}
.count {
	font-size: 4rem;
}
.count.one {
	font-size: 7rem;
}
.count-aft {
	font-size: 1.5rem;
}
.count-aft.one {
	font-size: 4rem;
}
/*お問い合わせ*/
.snow-monkey-form .smf-progress-tracker__item__number {
    background: #0058c4 !important;
}
.snow-monkey-form .is-style-smf-required .smf-item__label::after {
    background: #c41d08;
}
.snow-monkey-form .smf-button-control button[type="submit"] {
    background-color: #0058c4;
}
.snow-monkey-form .smf-button-control button[type="submit"]:hover {
    background-color: #0058c4e3;
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
 *  page 下層ページ
 * ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

	/* ページごと、パーツごとにコメントアウトで注釈を入れてください。 */



/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
 *  Archive / Single ブログ一覧ページ、ブログ詳細ページ
 * ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

	/* パーツごとにコメントアウトで注釈を入れてください。 */



/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
 *  メモ用
 * ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */