/*
Theme Name:整骨院
Version: 1.0
Template:lightning
*/

/*******************************************************
 * 変数
********************************************************/
:root{
	/*--color_main: #ff9900;*/
	--color_main: #f7820c;
	--color_sub: #3d2500;
	--color_sub-light: #dec49e;
	--font_serif: "Lora", "Noto Serif JP", serif;
}

/*******************************************************
 * 共通
********************************************************/
.font-bold{font-weight: bold;}
.font-serif{font-family: var(--font_serif);}
.font-red{color: #ff0000;}

/*******************************************************
 * WP上書き
********************************************************/
.wp-block-table.is-style-stripes tbody tr:nth-child(odd){background-color: #fff6e8;}
.wp-block-table tr td:first-child{font-weight: bold;}


/*******************************************************
 * テーマ上書き
********************************************************/
a[data-type="page"]{color: var(--vk-color-text-link-hover); text-decoration-color: var(--vk-color-text-link-hover);}

.page_top_btn{bottom: 80px;}

@media screen and (min-width: 1200px) {
	.container,
	.container-lg,
	.container-md,
	.container-sm,
	.container-xl{max-width: 1340px;}
}
@media screen and (max-width: 480px) {
	.site-footer{padding-bottom: 100px;}
}

/*******************************************************
 * プラグイン上書き
********************************************************/
h2.is-style-vk-heading-both_ends{font-family: var(--font_serif); color: var(--color_sub); font-weight: 400; font-size: 2.2em;}
h2.is-style-vk-heading-both_ends::before,
h2.is-style-vk-heading-both_ends::after{border-color: var(--color_sub-light);}

ul:not(.wp-block-social-links).is-style-vk-check-square-mark li::before,
ol.is-style-vk-check-square-mark li::before{color: var(--color_main); font-size: 1.3em; left: -1.2em;}

.vk_flow .vk_flow_frame{border-color: var(--color_main); border-radius: 5px;}
.vk_flow_num{display: inline-block; background-color: var(--color_main); width: 1.8em;height: 1.8em; border: 1px solid var(--color_main); border-radius: 50%; margin-right: 0.5em; text-align: center; color: #fff; line-height: 1.6em; font-weight: bold; font-size: 0.8em;}
.vk_flow .vk_flow_frame_text_title{border: none; color: var(--color_sub);}
.vk_flow .vk_flow_frame_image{max-width: 450px;}
.vk_flow .vk_flow_frame_image img{border-radius: 5px;}
.vk_flow.vk_flow-arrow-on::after,
.vk_flow>.vk_flow_frame_arrow{filter: brightness(0) saturate(100%) invert(56%) sepia(99%) saturate(1318%) hue-rotate(360deg) brightness(102%) contrast(105%);}

@media screen and (min-width: 1200px) {
	.vk_flow{display: inline-block; width: 17%; margin-right: 3%; position: relative;}
	.vk_flow.vk_flow-arrow-off{margin-right: 0;}
	.vk_flow .vk_flow_frame{flex-direction: column-reverse;}
	.vk_flow .vk_flow_frame_text_title{margin: 0.6em 0 0.4em; padding: 0; font-size: 1.1em;}
	.vk_flow.vk_flow-arrow-on::after{position:absolute; top: 50%; right: -46px; transform: translateY(-50%) rotate(-90deg);}
}

.vk_faq{border: none; padding-bottom: 0; margin-bottom: 0;}
.vk_faq-body{margin-bottom: 0;}
.vk_faq_title{cursor:pointer; position:relative; padding-right:30px;}
.vk_faq_title::after{content:"+"; position:absolute; right:0; top:50%; transform:translateY(-50%); font-size:24px; font-weight:bold; transition:.3s;}
.vk_faq_title.active::after{transform:translateY(-50%) rotate(45deg);}
.vk_faq .vk_faq_content{display:grid; grid-template-rows:0fr; overflow:hidden; margin:0; padding: .4rem .8rem .8rem 3rem; transition:grid-template-rows .3s ease;}
.vk_faq_content > p{min-height:0; overflow:hidden; margin:0; padding:0;}
.vk_faq_title.active + .vk_faq_content{grid-template-rows:1fr;}
.vk_faq_title.active + .vk_faq_content > p{padding-top:0.4rem;}

.swiper-horizontal>.swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal,
.swiper-pagination-custom,
.swiper-pagination-fraction{bottom: 0;}

/*******************************************************
 * ヘッダー
********************************************************/
.site-header-container{position: relative;}
.header__description{padding: 10px 0 0 15px; font-size: 11px; font-weight: bold; position: absolute; top: 0; left: 0;}
.site-header--layout--nav-float .site-header-logo{width: 25%; margin-right: 0.5em; margin-bottom: 0;}
.site-header-logo{font-size: 2.5em; font-family: var(--font_serif); font-weight: 500;}
.global-nav--layout--float-right{width: 50%;}
.current-menu-item a{color: var(--color_main) !important;}
.current-menu-item.menu-access > a{color: var(--vk-color-text-body) !important;}
.global-nav-list>li.menu-access:before{display: none;}
.header__cta{width: 25%; padding: 2% 0 2% 5%}
.header__tel{font-size: 0.8em;}
.header__tel a{font-size: 2.2em; font-weight: bold; color: var(--color_main);}
.header__tel a i{margin-right: 3px; font-size: 0.8em; position: relative; top: -2px;}
.header__tel .time{display: inline-block; margin-top: 5px; line-height: 1.7;}

.vk-menu-acc ul.sub-menu li.current-menu-item a{color: #fff !important;}

@media screen and (min-width: 992px) {
	.site-header-container{align-items: center;}
	.header_scrolled .site-header .header__description{display: none;}
}
/*******************************************************
 * トップページ
********************************************************/
.home .site-body{padding-bottom: 0;}

.ltg-slide picture img{height: 700px; object-fit: cover; margin-left: auto;}
.ltg-slide-text-set{font-family: var(--font_serif); font-weight: 400;}
.ltg-slide-text-title{margin-bottom: 30px; font-weight: 500; font-size: 3em; letter-spacing: 0.1em; line-height: 1.8;}
.ltg-slide-text-caption{font-size: 1.4em; letter-spacing: 0.1em;}

.top-problem-title{font-family: var(--font_serif); color: var(--color_sub); font-weight: 400; font-size: 1.7em;}
.top-problem-list{display: flex; flex-wrap: wrap;}
.top-problem-list li{width: calc(48% - 1.2em); margin-right: calc(2% + 1.2em) !important;}
.top-problem-list li:nth-child(2n){margin-right: 0 !important;}
.top-problem-img{width: 100%; text-align: center; position: relative;}
.top-problem-img::before{content: ""; width: 100%; height: 55%; display: block; background: linear-gradient(rgba(255,255,255,0) 0, #fffcf9 80%); position: absolute; bottom: 0; left: 0;}
.wp-block-image.top-problem-img img{width: 100%; max-width: 250px; height: 400px !important; object-fit: cover; object-position: 0 0;}

.top-reason img{width: 100%; object-fit: cover; aspect-ratio: 1 / 0.55;}
h3.headline-has-num{border: none; padding-bottom: 0; font-size: 1.4em; color: var(--color_sub);}
h3.headline-has-num::after{display: none;}
h3.headline-has-num .num{display: inline-block; background-color: var(--color_main); width: 50px;height: 50px;border: 1px solid var(--color_main);border-radius: 50%;margin-right: 0.5em;text-align: center;color: #fff;line-height: 48px; font-weight: bold; font-size: 1.2em;}

.top-menu img{width: 100%; object-fit: cover; aspect-ratio: 1 / 0.55;}
.top-menu h3{margin: 0.7em 0 0.4em !important; font-size: 1.3em; color: var(--color_sub);}
.top-menu .wp-block-column{box-shadow: 0 2px 10px 0 #dfd8cd;}
.top-menu .vk_button-color-custom{background-color: #fff;}
.top-menu .vk_button-color-custom a{font-weight: bold;}

.top-menu_box{position: relative; transition: 0.3s;}
.top-menu_box img{width: 100%; object-fit: cover; aspect-ratio: 3 / 2; border-radius: 5px;}
.top-menu_box .name{background-color: var(--color_yellow-green); width: 100%; padding: 0.25em; border-radius: 0 0 5px 5px; color: #fff; font-weight: bold; font-size: 1.2em; text-align: center; position: absolute; bottom: 0; left: 0;}
.top-menu_box .name i{position: absolute; top: 50%; right: 3px; transform: translatey(-50%);}
.top-menu_box a{display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0;}
.top-menu_box:hover{opacity: 0.7;}

.map iframe{width: 100%; height: auto !important; aspect-ratio: 1; object-fit: cover;}


/*******************************************************
 * 院紹介
********************************************************/
.table01{background-color: #fff;}
.table01 thead tr th{background-color: var(--color_sub); border-right: 1px solid currentColor; color: #fff;}
.table01 thead tr th:last-child{border-right: none;}
.table01 td:first-of-type{background-color: #fff8f3; width: 25%; min-width: 150px; color: var(--color_sub); font-weight: bold;}

.table-oh{background-color: #fff; border-color: var(--color_sub); text-align: center; color: var(--color_sub);}
.table-oh tr:first-of-type td{background-color: var(--color_sub); border-right-color: #fff; color: #fff; font-weight: bold;}
.table-oh tr:first-of-type td:last-of-type{border-right-color: var(--color_sub);}

.info-map{text-align: center;}
.info-map iframe{width: 100%; height: auto !important; aspect-ratio: 1 / 0.5; object-fit: cover;}

.info-cta-title{font-family: var(--font_serif); color: var(--color_sub); font-weight: 400; font-size: 1.7em;}


/*******************************************************
 * 料金紹介
********************************************************/
.table01.has-img .flex{display: flex; gap: 10px; align-items: center;}




/*******************************************************
 * 施術メニュー_交通事故
********************************************************/
h3.kj-headline{border: none; padding-bottom: 0; margin-bottom: 0.35em !important; color: var(--color_sub); }
h3.kj-headline::after{display: none;}
h3.kj-headline .step{display: inline-block; background-color: var(--color_main); width: 50px; height: 50px; border: 1px solid var(--color_main); border-radius: 50%; margin-right: 0.5em; text-align: center; color: #fff; line-height: 48px; font-weight: bold; font-size: 0.7em; position: relative; top: -0.25em;}
.kj-triangle{width: 0; height: 0; margin: 40px auto; border-style: solid; border-right: 20px solid transparent; border-left: 20px solid transparent; border-top: 20px solid var(--color_main); border-bottom: 0;}

.table01.kj-table{text-align: center;}
.kj-table th{background-color: var(--color_sub); color: #fff;}

.cta{display: flex; border: 3px solid #f7820c; border-radius: 10px; margin: 80px 0; color: var(--color_sub);}
.cta__text{width: 62%; padding: 2em;}
.cta__text .main-text{font-size: 1.8em; font-family: var(--font_serif);}
.cta__text .tel{display: inline-block; background-color: #dae7dd; padding-bottom: 1em; text-align: center;}
.cta__text .tel p{margin-bottom: 0; font-size: 2.5em; line-height: 1;}
.cta__text .tel .mc{display: block; background-color: #28a745; margin-bottom: 0.7em; padding: 0.5em; font-size: 0.45em; font-weight: bold; color: #fff;}
.cta__text .tel a{padding: 1em 0.5em; color: #006de4; font-weight: bold; text-decoration: none;}
.cta__text .tel i{margin-right: 0.1em; font-size: 0.6em; position: relative; top: -5px;}
.cta__text .tel .att{display: block; margin-top: 0.5em; font-size: 0.3em; line-height: 1.3;}
.cta__img{width: 38%; padding: 2em;}
.cta__img img{border-radius: 5px;}


/*******************************************************
 * ブログ
********************************************************/
.single .entry-body a:not([class]){color: #0978d7;}
.entry-meta-item-author{display: none;}

/*******************************************************
 * フッター
********************************************************/
.site-footer{background-color: var(--color_main); color: #fff;}
.footer-nav{text-align: center;}
.footer-nav-list li{border-color: #fff;}
.footer-nav .nav li a,
.footer-nav nav li a{color: #fff;}
.footer-nav .current-menu-item a{color: #fff !important;}
.footer-nav .current-menu-item.menu-access > a{color: #fff !important;}

.footer__name p,
.footer__address p,
.footer__tel p{margin-bottom: 0;}
.footer__name{font-size: 1.6em; font-weight: bold; color: var(--color_sub);}
.footer__logo{max-width: 200px;}
.footer__address{margin: 5px 0 0 !important;}
.footer__tel{margin-bottom: 5px !important; font-size: 2.2em; font-weight: bold;}
.footer__tel a{text-decoration: none; color: var(--color_main);}
.footer__tel i{margin-right: 3px; font-size: 0.8em; position: relative; top: -1px;}

.footer.table-oh{font-size: 0.6em;}

.site-footer-copyright{padding-top: 0; padding-bottom: 0;}
.site-footer-copyright p:last-child{display: none;}


/*******************************************************
 * スマホ用フローティングボタン
********************************************************/
.mobile__btns{display: none; position: fixed; bottom: 0; left: 0; width: 100%;}
.mobile__btns ul{display: flex; list-style: none; margin: 0; padding: 0;}
.mobile__btns ul li{width: 50%; margin: 0;}
.mobile__btns ul li a{display: flex; flex-wrap: wrap; justify-content: center; align-items: center; width: 100%; height: 100%; padding: 0.75em 0.5em; border-top: 1px solid #ffff; text-align: center; color: #fff; font-weight: bold; text-decoration: none;}
.mobile__btns ul li a .micro-copy{display: block; width: 100%; margin-bottom: 0;}
.mobile__btns ul li a i{margin-right: 2px; font-size: 0.8em; position: relative; top: 1px;}
.mobile__btns ul li.tel a{background-color: var(--color_main); font-size: 1.3em;}
.mobile__btns ul li.tel a .micro-copy{font-size: 0.7em;}
.mobile__btns ul li.line a{background-color: #06c755; font-size: 1.1em; line-height: 1;}
.mobile__btns ul li.line a .micro-copy{font-size: 0.8em;}
.mobile__btns ul li.line a i{font-size: 1.1em;}


/*******************************************************
 * レスポンシブ
********************************************************/
@media screen and (max-width: 1200px) {
	.site-header--layout--nav-float .site-header-container{flex-wrap: wrap;}
	.site-header--layout--nav-float .site-header-logo{width: 50%; order: 1; margin-right: 0;}
	body:not(.header_scrolled) .global-nav--layout--float-right{width: 100%; margin-left: 0; order: 3; justify-content: center !important; padding-bottom: 2%;}
	.header__cta{width: 50%; order: 2; padding: 1% 0 1% 1%; text-align: right;}
	
	#info.is-layout-flex{flex-wrap: wrap !important; padding-top: 5%;}
	#info.is-layout-flex .wp-block-column{width: 48%; flex-basis: auto; flex-grow: 0; padding: 0 !important;}
	
	.table01 td:first-of-type{width: 40%;}
	
	.table01.hoken td:first-of-type{width: 25%;}
}

@media screen and (max-width: 992px) {
	.vk-menu-acc ul.sub-menu li.current-menu-item a{color: #332 !important;}
	
	.site-header-container{display: flex; max-width: 100%;}
	.site-header--layout--nav-float .site-header-logo{padding-top: 30px; text-align: left;}
	.site-header-logo img{margin: 0;}
	.header__cta{padding: 10px 44px 10px 0;}
	.h-menu__tel{display: block; background-color: #dae7dd; padding-bottom: 1em; text-align: center;}
	.h-menu__tel p{margin-bottom: 0; font-size: 2.5em; line-height: 1;}
	.h-menu__tel .mc{display: block; background-color: #28a745; margin-bottom: 0.7em; padding: 0.5em; font-size: 0.45em; font-weight: bold; color: #fff;}
	.h-menu__tel a{padding: 1em 0.5em; color: #006de4; font-weight: bold; text-decoration: none;}
	.h-menu__tel i{margin-right: 0.1em; font-size: 0.6em; position: relative; top: -5px;}
	.h-menu__tel .att{display: block; margin-top: 0.5em; font-size: 0.3em; line-height: 1.3;}
	
	.lightning_swiper,
	.page-header{margin-top: 0 !important;}
	
	.wp-block-columns.kj-first-message{flex-direction: column;}
	.cta{flex-direction: column-reverse;}
	.cta__text{width: 100%; padding-top: 0;}
	.cta__text .tel{display: block;}
	.cta__img{width: 100%;}
}

@media screen and (max-width: 782px) {
	.top-problem-title{text-align: center !important;}
	.top-reason h3.headline-has-num{margin-bottom: 0.5em;}
	.top-reason .br-pc{display: none;}
	
	.director-img img{width: 100%; object-fit: cover; object-position: 50% 0; aspect-ratio: 1 / 0.6;}
	
	.footer.table-oh{font-size: 0.9em;}
}

@media screen and (max-width: 480px) {
	.wp-block-image.alignright{float: none; margin: 0 auto 1em;}
	
	h2.is-style-vk-heading-both_ends{font-size: 1.8em;}
	h2.is-style-vk-heading-both_ends .vk-heading__text-wrapper{max-width: 234px;}
	
	.vk_faq .vk_faq_title{padding-right: 2rem;}
	.vk_faq .vk_faq_content:before{top: 0.8rem;}
	
	.site-header--layout--nav-float .site-header-container{flex-direction: column;}
	.header__description{width: calc(100% - 36px); padding: 13px 0 0 0; font-size: 9px; position: relative; top: 0; left: 0;}
	.header__description p{margin-bottom: 0;}
	.site-header--layout--nav-float .site-header-logo{padding: 0 0 10px; font-size: 2em;}
	.header__cta{display: none;}
	
	.vk-mobile-nav-menu-btn{background: var(--color_main); border-color: #fff;}
	.vk-mobile-nav-menu-btn::before{content: ""; width: 100%; height: 100%; background: url('_g3/inc/vk-mobile-nav/package/images/vk-menu-btn-white.svg') center 50% no-repeat rgba(255, 255, 255, 0); position: absolute; top: 0; left: 0; z-index: 2101;}
	
	.ltg-slide picture img{height: auto; object-fit: cover; aspect-ratio: 1 / 1.3;}
	.ltg-slide-text-set{top: 74%;}
	.ltg-slide-text-title{margin-bottom: 0.75em; font-size: 8.64vw; line-height: 1.5;}
	.ltg-slide-text-caption{font-size: 4.32vw;}
	
	.top-problem{position: relative;}
	.top-problem-list li{width: 100%; margin-right: 0 !important;}
	.home .top-problem-list li{width: calc(100% - 50px);}
	.top-problem .wp-block-column:last-child{position: absolute; right: 0; bottom: 0;}
	.wp-block-image.top-problem-img{text-align: right;}
	.wp-block-image.top-problem-img img{width: 70px; height: auto !important;}
	.top-problem-img::before{width: 70px; right: 0; left: auto;}
	
	h3.headline-has-num .num{width: 30px; height: 30px; font-size: 0.8em; line-height: 30px; position: relative; top: -2px;}
	
	.coupon-ticket-box{width: 100%; flex-direction: column; gap: 0; padding: 1em !important;}
	
	.kj-first-message{padding: 1em; font-size: 0.85em;}
	.kj-first-message p span > span{font-size: 1.2em !important;}
	
	h3.kj-headline .step{display: block; margin: 0 auto 12px;}
	
	.cta__img{padding-bottom: 1em;}
	.cta__text .main-text p{margin-bottom: 0.5em;}
	.cta__text .tel{font-size: 0.9em;}
	.cta__text .tel a{width: 100%; display: block; padding: 0 0.2em;}
	
	.table01.has-img td{width: 50%; padding: 1em;}
	.table01.has-img td .flex{flex-direction: column; gap: 2px;}
	.table01.has-img td img{width: 80px !important;}
	
	.table-scroll{overflow-x: scroll;}
	.table-scroll table{width: 100%; border-collapse: collapse; white-space: nowrap;}
	.table01.hoken td:first-of-type{width: 80px; min-width: 0;}
	
	.footer.table-oh{width: 100%;}
	
	.mobile__btns{display: block;}
}