@charset "utf-8";
/*
Theme Name: X-T9 Child
Theme URI:
Template: x-t9
Description:
Author:アートフレア株式会社
Tags: 
Version: 1.0
*/


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

/* :root設定、bodyへの上書き、カラー変数設定など */

:root{
	--vk-color-text-link-hover: var(--vk-color-custom-1);
	--en:"Poppins","Noto Sans JP",sans-serif;
}
*[data-mobile-font-size] {
    transition: .3s;
}
.fw-bold{
	font-weight:bold;
}
.w-80{
	width:80%;
	margin:auto;
}
.gap-min{
	gap:5px;
}
.en{font-family:var(--en);}


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

/* 繰り返しボタン・見出し、余白設計など */
/* テキストリンク */
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);
}
/* 
見出し */
.is-style-title-big .vk_heading_title strong{
	    font-size: clamp(30px, 3.5vw, 64px);
}


/* VKボタン */
.vk_button .vk_button_link:where(:not(.has-vk-color-primary-color)):hover{
	filter:none;
}
.vk_button .vk_button_link:where(:not(.has-vk-color-primary-color)):hover {
    background:  color-mix(in srgb, var(--wp--preset--color--primary) 70%, black 30%);
}

.vk_button_link ,.wp-block-button{
  transition: all .25s ease;
}

/* hover */
.vk_button_link:hover ,.wp-block-button:hover{
  transform: translateY(3px); 
}

/* 画像角丸 */
figure.wp-block-image.is-style-vk-image-rounded img{
	border-radius:30px;
}

.reservation-btn a{
	background-color:var(--wp--preset--color--custom-ssc-3) !important;
	border-color:var(--wp--preset--color--custom-ssc-3) !important;
}
.reservation-btn a:hover{
	background-color:var(--wp--preset--color--primary-hover)!important;
	border-color:var(--wp--preset--color--primary-hover)!important;
}


/* FAQ */
.vk_faq .vk_faq_title{
	border-bottom:none;
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
 *  header ヘッダーまわり
 * ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
/* ヘッダー固定 */
html,body {
	height:auto !important;
}
.wp-site-blocks {
    overflow-x: unset !important;
    display: flex;
    flex-direction: column;
}
header.wp-block-template-part {
    position: sticky;
    top: 0;
    z-index: 1000;
}
@media (min-width: 600px) {
	.logged-in header.wp-block-template-part {
		top: 32px;
	}
}
header{
	padding:15px 15px 25px;
}
/* グローバルナビ */
@media (min-width: 600px) {
header li.wp-block-navigation-item {
	border-bottom: solid 0px transparent;
	transition:.3s;
}
header li.wp-block-navigation-item:hover a{
    color:var(--wp--preset--color--custom-ssc-3) !important;
}
header li.wp-block-navigation-item.current-menu-item a{
    color:var(--wp--preset--color--custom-ssc-3) !important;
}
}


.header_btn a{
	border:none;
	text-align:left!important;
	padding:10px 30px 10px!important;
}
.header_btn a strong{
	font-size:28px;
	line-height:1;

}
.header_btn_tel a strong{
		font-family:var(--en);
}

header .wp-block-navigation__responsive-container-content{
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
	align-content:center;
	align-items:center;
}
.wp-block-navigation__responsive-container-close{
	top:20px;
}
header .wp-block-navigation-link a{
	border:none!important;
	text-align:center;
	font-size:clamp(1.5rem , 5vw , 2rem);
	font-weight:600;
}

/* ハンバーガー */
.wp-block-navigation .wp-block-navigation__responsive-container-close, .wp-block-navigation .wp-block-navigation__responsive-container-open{
	border-radius:50%;
	background-color:#343778;
}
.wp-block-navigation__responsive-container-close svg, .wp-block-navigation__responsive-container-open svg {
    fill: #fff;
}
.wp-block-navigation__responsive-container-close, .wp-block-navigation__responsive-container-open{
	width:65px!important;
	height:65px!important;
}
.wp-block-navigation__responsive-container-close svg, .wp-block-navigation__responsive-container-open svg {
    height: 34px;
    width: 34px;
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
 *  footer フッターまわり
 * ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

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

.footer_link{
	list-style:none;
	display:flex!important;
	flex-wrap:wrap!important;
	--navigation-layout-direction: auto!important;
}
.footer_link li{
	width:45%!important;
	border:none;
}
.footer_link li a{
		border:none!important;
}


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

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


#page-header{
	margin:0 2%;
}
#page-header{
	overflow:unset;
	position:relative;
	z-index:2;
  max-width:96dvw!important;
margin-left: calc(52% - var(--wp--custom--width--wrapper) / 2) !important;
	border-radius:30px!important;
}

#page-header .wp-block-cover__background {
		border-radius:30px!important;
}

.pageheader_subtext{
	text-transform: uppercase;
	font-family:var(--en);
}
.vk_breadcrumb_inner a{
	color:#fff;
	opacity:0.7;
}

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

/* ヒーローエリア */
.teaser_btn{
	font-size:22px;
	font-weight:600;
}
.teaser_btn a{
	display:flex;
	align-items:center;
	align-content:center;
	gap:10px;
	min-height:100px;
}
.teaser{
	padding:50px;
}
.teaser h2{
font-size:clamp(30px , 4vw, 64px);
font-weight: 900;
letter-spacing: 0.11em;

}
.teaser_right{
	padding-right:2%;
}



.teaser_btn_jatco a {
  position: relative;
  display: block;
  width: 100%;
  text-align: center;
  padding: 15px;
  border-radius: 25px;
  overflow: hidden;
  z-index: 1;
	  background: rgba(84, 84, 84, 0.0);
	transition:0.3s;
}

/* グラデーションレイヤー */
/* .teaser_btn_jatco a::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 25px;
  background: rgba(84, 84, 84, 0.0);
  transition: transform .3s ease;
  z-index: 0;
	opacity:0;
} */

/* hoverで下に降りてくる */
.teaser_btn_jatco a:hover {
	  background: rgba(84, 84, 84, 0.1);
}

/* テキストを前面に */
.teaser_btn_jatco a span {
  position: relative;
  z-index: 2;
}

/* お知らせ */
.news{
margin:0;}
.home .news .vk_posts{
	background-color:#fff;
	border-radius:30px;
	width:100%;
	overflow:hidden;
} 
.home .news .vk_post{
	margin-left:0;
	margin-right:0;
	padding-left:15px;
}
.news.vk_post:first-child{
	border-radius:30px 30px 0 0;
}
.vk_post:hover {
    background: #F4F5F8;44px;
}
.postListText_date{
	padding-left:10px;
}


/* 選ばれる理由 */
.reason_number{
	width:100px;
	height:100px;
	position:absolute;
	top:-50px;
	left:50%;
	transform: translateX(-50%);
	font-size:14px;
	line-height:1.3;
	padding-top:15px;
}
.reason_number strong{
	font-size:44px;
	display:block;
	font-family:var(--en);
}

/* 縦型スライダー */
.tate-swiper {
  height: 700px; /* 表示崩れの場合はここを変更 */
  overflow: hidden;
	margin:0;
}
.tate-swiper .tate-swiper-wrapper {
  transition-timing-function: linear !important;
	margin:0;
}
.tate-swiper-slide img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius:30px;
	margin:0 !important;
}


.vk_gridcolcard_item_body{
overflow:unset;	
	background-color:#fff;
	border-radius:30px;
}
.reason_box figure{
margin-top:0;
	border-radius:30px 30px 0 0;
	overflow:hidden;
}
.reason_txt{
	padding:0 30px 30px;
}
.reason_box .vk_gridcolcard_item{
	overflow:unset;	
}
.tag-scroll {
  overflow: hidden;
}

.tag-scroll-wrapper {
  display: flex;
  flex-wrap: nowrap;
  gap: 12px;
  width: max-content;
  animation: scroll-tag 20s linear infinite;
}

@keyframes scroll-tag {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

.tag-scroll-item {
  flex-shrink: 0;
  padding: 8px 20px;
  background: #29abe2;
  color: #fff;
  border-radius: 4px;
  white-space: nowrap;
  font-size: 0.9rem;
}



/* 料金・オプション */
.time_price{
		font-size:clamp(18px , 3.0vw , 30px);
	font-weight:600;
}
.time_price .vk_inline-font-size{
	font-size:clamp(36px , 4.0vw , 75px) !important;
	font-family:var(--en);
}
.option_box{
		padding:10px 30px 30px;
	margin:0 auto;
	position:relative;
	overflow:hidden;
}
.option_box_bottom_min{
	padding-bottom:40px;
}
.option_title{
	border-bottom:solid 1px #ccc;
	padding-bottom:25px;
}
.option_title h3{
	font-size:clamp(20px , 3.5vw , 40px);
}
.option_title_sun{
	padding:5px 10px;
	border-radius:5px;
}
.ic_plus{
	margin-bottom:-15px;
	position:relative;
	z-index:2;
}

/* タグスライダー */
.tag-scroll {
  overflow: hidden;
	margin-inline: -80px !important;
}

.tag-scroll-wrapper {
  display: flex;
  flex-wrap: nowrap;
  gap: 12px;
  width: max-content;
  animation: scroll-tag 15s linear infinite;
}
@keyframes scroll-tag {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
.tag-scroll-item {
    flex-shrink: 0;
    padding: 10px 20px;
    background: #29abe2;
    color: #fff;
    border-radius: 4px;
    white-space: nowrap;
    font-size: 1rem;
    font-weight: bold;
}

/* ４つアイコンボタン */

.top_ic_btn{
	padding:50px 30px;
	transition:0.3s;
}
.top_ic_btn p{
	font-size:clamp(16px , 1.3vw ,24px);
}
.top_ic_btn:hover{
background: #f4f4f4 !important;
border: 1px solid #d1d1d1 !important;

}


/* CTA */
.cta_box{
	padding:60px 50px!important;
}

.cta_btn1 a{
	min-width:430px!important;
}
.cta_btn2 a{
	min-width:430px!important;
	display:flex;
	flex-wrap:wrap;
	align-content:center;
	align-items:center;
	min-height:94px!important;
	flex-direction: column-reverse;
}
.cta_btn2 a:hover{
color:#fff!important;}
.cta_btn1 .vk_button_link_txt{
	font-family:var(--en);
	font-size:39px;
	line-height:1.2;
}
.cta_btn2 .vk_button_link_txt{
	font-size:30px;
	line-height:1.2;
	padding-top:5px;
} 

.cta_btn1 .vk_button_link_subCaption,.cta_btn2  .vk_button_link_subCaption{
	font-size:18px;
}


.footer_jatco{
	width:40%;
	margin:auto;
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
 *  page 下層ページ
 * ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

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

/* ご利用案内 */
.howto_tel .vk_button_link_txt{
	font-size:1.5rem;
}
/*ご利用案内 > 流れ */
.vk_step h4{
	text-align:left!important;
}
.vk_step_item_dot_num{
	font-family:var(--en);
	font-size:2.0rem;
}
.vk_step .vk_step_item .vk_step_item_dot{
	padding-top:16px;
}

/*ご利用案内 > よくある質問 */
.vk_faq .vk_faq_title:before {
background-color:#343778;
	top:11px;
    font-weight: 500;
    font-size: 22px;
    line-height: 105%;
    width: 2.8rem;
    height: 2.8rem;
    line-height: 2.8rem;
	color:#fff;
border-radius:50%;
    font-family: var(--en);
}
.vk_faq .vk_faq_title {
    padding: 1.2rem 1.2rem 1.2rem 3.5rem;
    margin: 0;
    position: relative;
    font-weight: bold;
    font-size: 20px;
	color:#343778;
}

.vk_faq .vk_faq_content:before{
	background-color:#02A3DF;
	top:11px;
    font-weight: 500;
    font-size: 22px;
    line-height: 105%;
    width: 2.8rem;
    height: 2.8rem;
    line-height: 2.8rem;
	color:#fff;
border-radius:50%;
    font-family: var(--en);
}
.vk_faq .vk_faq_content{
	padding-left:3.5rem;
}

.emergency_box{
	position:relative;
}
.emergency_number{
	position:absolute;
	width:50px;
	height:50px;
	top:-25px;
	left:50%;
	font-size:1.6rem;
	display:flex;
	align-items:center;
	justify-content:center;
	transform: translateX(-50%);
	line-height:1;
	font-family:var(--en);
	border-radius:50%;
}


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

/* パーツごとにコメントアウトで注釈を入れてください。 */
.vk_post .vk_post_date{
	font-size:0.9rem;
}
.postListText_title,.postListText_date{
	font-size:16px;
}
.postListText_title a{
	text-decoration:none;
}
.postListText_singleTermLabel{
	min-width:120px;
}
.postListText_singleTermLabel a{
	padding:5px;
	    text-decoration: none;
}

.vk_post.card{
	border-radius:30px;
	    padding: 25px !important;
}
.vk_post.card .vk_post_imgOuter{
	border-radius:25px;
	
}
.card-body{
	padding-left:0;
	padding-right:0;
}
.card-title a{
	color:#343778 !important;
	font-size:clamp(16px , 1.3vw ,20px);
}
.card-title a:hover{
	color:#02A3DF !important;
}
.vk_post:hover .vk_post_title a{
	border-bottom:none;
}

.howto_tel-big .vk_button_link_txt{
	font-size:2.5rem;
}

/* 料金・プラン */
.recommend_ic{
	padding:4px 15px !important;
}

.option_price strong{
	font-size:2rem;
	font-family:var(--en);
	font-weight:400;
}

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