@charset "utf-8";
/*
 * resposive.css は 991px 以下のデバイスへと反映されます。
 * 
 * ブレイクポイントは標準のLightningテーマおよびBootstrapの理念に基づき
 * sm: 576px　md: 768px　lg: 992px　xl: 1200px　となっているので、それに準じてください。
 * 
*/

/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
 *  General　全体的な設定
 * ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
/* :root設定、bodyへの上書き、カラー変数設定など */
html {
    margin-top: unset !important;
}
.admin-bar #wpadminbar {
    visibility: hidden;
}
.admin-bar .vk-mobile-nav-menu-btn {
    top: 5px;
}
.vk-mobile-nav-menu-btn {
	border: unset;
}
.vk-mobile-nav nav {
    font-family: var(--mc);
}

/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
 *  Common 汎用パーツ系
 * ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
/* 繰り返しボタン・見出し、余白設計など 汎用パーツへの上書き */
/*ボタン*/
.btn-more,
.btn-more.reserv {
    font-size: 1.5rem;
    max-width: 230px;
}
/*固定CTA*/
@media (max-width: 781.98px) {
	.cta-bnr {
		position: fixed!important;
		right: 0;
		bottom: 0;
		width: 100%;
	}
	.cta-bnr_inner {
		width: auto;
		padding: 1rem;
		flex-direction: row !important;
        justify-content: center;
		gap: 0.8em;
	}
	.cta-bnr_inner img {
		width: 28px!important;
	}
	.cta-txt-box {
		display: flex;
		align-items: flex-start !important;
        gap: 0.2em;
	}
}

body:not(.scrolled) .cta-bnr_inner {
    transform: translateY(100%);
    transition: .3s;
    transition-delay: 0s;
}

.cta-bnr_inner {
    transition: .8s;
    transition-delay: .3s;
}

/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
 *  Header, Hamburger ヘッダーまわり・ハンバーガーナビ
 * ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
header#site-header {
    min-height: calc(44px + 5px + 5px);
    display: flex;
    align-items: center;
	top:unset;
	display: none;
}

header#site-header {
    display: block;
    position: fixed;
    box-shadow: none;
}

.site-header-logo {
    width: fit-content;
    padding: 10px !important;
}

@keyframes loadingAfterLogo{
  40%   { 
	  opacity: 0;
	  transform:translatex(0);
	  transform:translatey(100px);
	}
  100% { 
	  opacity: 1;
	  transform:translatex(0);
	  transform:translatey(0);
	} 
}

/* ロゴ */
@keyframes loadingLogo{
  0%{
    opacity: 0;
    transform: translate3d(0, 10px, 0) scale(1.2);
	filter:blur(5px);
  }
  30%{
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1.00);
	  filter:blur(0);
  }
  50%{
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1.00);
  }
	70%{
    opacity: 0;
  }
  100%{
    transform: translate3d(0, -40vh, 0) scale(0.50);
  }
}

/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
 *  Footer フッターまわり
 * ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
/* フッターウィジェット、フッターロゴ、コピーライト */
@media (max-width: 781.98px) {
	.footer-add-box,
	.footer-navi-box {
		display: flex;
		flex-direction: column;
		align-items: center;
		padding: 0 1.5rem;
	}
	ul.footer-navi {
		font-size: 1.3rem;
		justify-content: center;
		gap: 1.5rem 3rem;
		margin: 1.5rem 0 4rem;
	}
}
@media (max-width: 575.98px) {
	.footer-logo {
		max-width: 170px;
		margin-bottom: 3rem;
	}
}


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

/* MV */
div#mv-video-hor1-innner,
div#mv-video-hor2-innner {
    display: none;
}

div#mv-video-hor1,
div#mv-video-hor2 {
    width: 100vw;
    max-height: 50lvh;
    min-height: unset;
}
div#mv-video-hor2 {
    position: static;
}
div#mv-video-hor1>video,
div#mv-video-hor2>video {
    filter: none;
    transform: none;
    height: 50lvh;
    width: 100lvw;
    position: static;
}
div#mv-hor-text img {
    height: auto !important;
    width: 90lvw !important;
}
div#mv-hor-text {
    max-height: unset;
    width: 100vw;
}
span.wp-block-cover__background {
    pointer-events: none;
}


/*コンセプトエリア*/
.top-concept_area_und {
	margin-top: 4rem;
}
.top-concept_area {
		margin-top: -144px;
}
.top-access-box {
	flex-direction: column;
}
.news-area {
	margin-left: 0;
}
.postListText_date {
    margin-right: 0.5em;
	min-width: 105px;
}
.news-area .postListText_singleTermLabel {
	margin-top: 0;
}
.news-area .postListText_title {
    font-size: 1rem;
    padding-top: .4rem;
}
@media (max-width: 781.98px) {
	.top-service-ttl-area {
		margin-top: 0;
		margin-left: 0;
	}
	.top-service-title-en.und {
		padding-left: 1.5em;
		margin-top: 0rem;
	}
}
@media (max-width: 767.98px) {
	.top-concept_area_und figure{
		justify-content: center;
	}
	.top-concept_area_und img {
		width: 170px!important;
    	margin-top: 2em;
	}
    .top-concept_area {
        margin-top: -114px;
    }
	.machine-img,
	.personal-img {
		min-height: 50vh!important;
	}
	.top-sec_p {
		margin-top: 4rem;
	}
	.top-access-box {
		padding: 4em 3.5rem;
	}
}
@media (max-width: 575.98px) {
	.top-concept_area {
		margin-top: -137px;
	}
	.top-service-card {
		padding: 1.5rem 2rem;
		margin-bottom: 1.5rem;
	}
	.top-access-box {
		padding: 3em 2rem;
	}
	.insta-title-box {
		flex-direction: column;
		gap: 1em;
		
	}
}

/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
 *  Pageheader, Breadcrumb 下層ページヘッダー・パンくずリスト
 * ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
/* 下層ページのページヘッダー、パンクズ設定 */



/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
 *  Page 下層ページ
 * ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
/* ページごと、パーツごとにコメントアウトで注釈を入れてください。 */
@media (max-width: 781.98px) {
	.monitor-cols {
		flex-direction: column;
		max-width: 80%;
		margin: auto;
	}
}
/*料金・サービス内容*/
@media (max-width: 767.98px) {
	.price-box {
		flex-direction: column;
		width: 100%;
	}
	.session-flow-cols .wp-block-column {
		padding: 0.7rem .5em;
	}
	.wp-block-columns.session-flow-cols {
		gap: 1.2rem;
	}
	.session-flow-cols p {
		writing-mode: horizontal-tb;
	}
	/*プラン*/
	.wp-block-group.menu-group {
		gap: 1rem;
	}
	p.menu-content mark {
		font-size: 1rem;
	} 
	.menu-content mark::after {
		right: -1rem;
	} 
}
@media (max-width: 575.98px) {
	.wp-block-group.menu-group {
		flex-direction: column;
	}
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
 *  Archive　ブログ一覧ページ
 * ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
/* パーツごとにコメントアウトで注釈を入れてください。 */



/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
 *  Single　ブログ詳細ページ
 * ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
/* パーツごとにコメントアウトで注釈を入れてください。 */
@media (max-width: 575.98px) {
	.blog .postListText_title {
		padding-top: .5rem;
	}
}

/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
 *  その他・追加機能
 * ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
/* パーツごとにコメントアウトで注釈を入れてください。 */
/*Q&Aのタイトル*/
.vk_faq_title p {
    font-size: 1em!important;
} 

