/*
Theme Name: Uno Child (sioyaki)
Template: uno
Description: Uno テーマの子テーマ。このサイト固有のCSS・配色（theme.json）・テンプレート差し替えを置く場所。
Version: 1.0.0
*/

/* ==================================================================
   このサイト固有のCSSをここに書く
   - テンプレート（親テーマ Uno）を更新しても消えない
   - 汎用化できそうな調整は、子ではなくテンプレート側のSCSSに実装を検討
   - 調整箇所の逆引きはテンプレートの docs/tuning.md を参照
   ================================================================== */

/* コンテンツ幅：メイン980px / 幅広1180px（theme.json の layout と揃えている） */
:root {
	--uno-content-w: 980px;
	--uno-wide-w: 1180px;
}
.c-toc {
    border:2px solid var(--uno-secondary);
}

/* フッターのSNSフォローアイコン：背景がプライマリ色（オレンジ）の帯のため、
   ブランドカラーの塗りつぶし丸だと馴染みすぎるので、白抜き（透明背景+白枠）にする */
.l-footer__col .c-share--follow .c-share__btn {
	background: transparent;
	border: 1.5px solid rgba(255, 255, 255, .85);
}


/* ==================================================================
   旧 Emanon 子テーマ（emanon-premium-child/style.css）から移植
   - Emanonブロックの置き換えが終わったセクションから順次削除していく
   ================================================================== */

.for-pc{
	display:none;
}
@media screen and (min-width: 568px){
	.for-pc{
		display:block;
	}
}
/*トップページ施術メニューボタン*/
ul.ul_menu,
ul.ul_course{
	list-style:none!important;
	margin-top:0px!important;
}
ul.ul_menu li,
ul.ul_course li{
	border-radius: 5px;
	margin-bottom: 3px;
	display:flex;
}
ul.ul_menu li {
	background-color: #7f6e61;
}
ul.ul_course li {
	background-color: #ab9482;
}
ul.ul_menu li a,
ul.ul_course li a{
	display: flex;
	width:100%;
	flex-direction:row;
	align-items: center;
	padding: 16px 10px;
	color: #fff;
	font-size: 110%;
	font-weight:bold;
	line-height:1.6;
}
ul.ul_menu li a:hover,
ul.ul_course li a:hover{
	color: var(--wp--preset--color--primary);
}
ul.ul_menu li a img,
ul.ul_course li a img{
	width: 10%;
	margin-right: 5px;
}
@media screen and (min-width: 568px){
	ul.ul_menu,
	ul.ul_course{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		margin-bottom: 15px;
	}
	.ul_menu li{
		width: 24%;/*width: 32%;*/
		text-align: center;
		box-shadow: 5px 5px 5px rgb(0 0 0 / 30%);
		margin-bottom: 12px;
		border-radius: 10px;
		border: 1px solid #fff;
	}
	.ul_course li{
		width: 32%;
		text-align: center;
		box-shadow: 5px 5px 5px rgb(0 0 0 / 30%);
		margin-bottom: 12px;
		border-radius: 10px;
		border: 1px solid #fff;
	}
	ul.ul_menu li a,
	ul.ul_course li a{
		display: flex;
		flex-direction:column;
		gap:8px;
		padding: 16px 10px;
		font-size: 110%;
		justify-content: center;
}
	ul.ul_menu li a img,
	ul.ul_course li a img{
		width: 15%;
}
}

/*料金ページ*/
.couponBox_price{
	border:10px solid #f2954e; 
}
ul.price-menu {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 0.75em;
	list-style: none !important;
	margin: 0;
}
ul.price-menu li {
	display: flex;
	align-items: center;
	font-weight: bold;
	padding: 0.5em 1em !important;
	background-color: #f2eee3;
	border-radius: 8px;
	box-sizing: border-box;
}
ul.price-menu li a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.5em;
	width: 100%;
	color: var(--uno-link);
}
ul.price-menu li a:hover {
	color: var(--wp--preset--color--secondary);
}
ul.price-menu .ico-chevron-right {
	flex-shrink: 0;
}
@media screen and (min-width: 568px){
	ul.price-menu {
		grid-template-columns: repeat(4, 1fr);
	}
}
/**/
@media screen and (max-width: 567px){
	.flex_gap_zero{
		gap: 0px!important;
	}
}
@media screen and (min-width: 568px){
.width80{
	width:80%;
}
}
/*アクセス*/
.table_uketsuke table tr:first-child td,
.table_uketsuke table tr td:first-child{
		background-color:#f2954e;
		color:#fff;
	}
@media screen and (max-width: 567px){
	.table_uketsuke{
		font-size:81%;
	}
}
/**/
#page_contact div{
	display:flex;
	flex-wrap: wrap;
}
#page_contact div dt{
	width:20%;
	font-weight:bold;
	margin:5px 0;
	padding:15px 0;
	border-bottom:1px dashed #ccc;
}
#page_contact div dd{
	width:80%;
	margin:5px 0;
	padding:15px 0 15px 10px;
	border-bottom:1px dashed #ccc;
}
#page_contact div span.form_require{
	font-size:80%;
	background-color:red;
	color:#fff;
	padding:5px;
	border-radius:5px;
}
#page_contact .form_btn{
	text-align:center;
	
}
#page_contact .form_btn input[type="submit"]{
	font-size:110%;
	font-weight:bold;
	border-radius:10px;
	padding:10px 20px;;
}
/**/
@media screen and (min-width: 568px){
	.header-menu .sub-menu .menu-item > a{
		font-size:0.9rem;
	}
}
/**/
.l-footer__inner .l-content #sns_follow-2 h3.footer-widget__title{
	text-align:center;
}
@media screen and (max-width: 567px){
.l-footer__inner .l-content #sns_follow-2{
	margin:30px 0;
}
}
/*フッター中央カラム　鍼灸コンパスバナー*/
.footer_center_shinqcompass{
	text-align:center;
	margin:30px 0;
}
@media screen and (max-width: 567px){
.footer_center_shinqcompass{
	margin-top:0;
}
}
.l-footer__inner .l-content #nav_menu-4 #menu-groupmenu li a::before{
	color:#fff;
}
/**/
aside.sidebar-left .widget_media_image{
	margin-bottom:0px;
	padding:0;
}
/**/
.header-contact__inner .contact__title,
#contact_section-3 .contact__title{
	font-weight:bold;
	font-size:1.3rem;
}
/**/
.is-style-item__checkmark > li::before,
.is-style-item__arrow > li::before,
.is-style-item__checkmark--square > li::before{
    color: #009902;
}
/**/
.page .wp-block-post-template figure.wp-block-post-featured-image{
	width:100%!important;
}
/*20230330追加-デフォルト見出しのデザイン追加-*/
.h2-bg-color-ribbon .article-body h2:not(.is-style-none):not(.epb-advance-headling__text){
	position:relative;padding-top:8px;padding-bottom:8px;padding-right:12px;padding-left:12px;background-color:#f2954e;color:#ffffff;
}
.h2-bg-color-ribbon .article-body h2:not(.is-style-none):not(.epb-advance-headling__text)::before{
	position:absolute;content:"";top:100%;left:0;border-width:0 20px 12px 0;border-style:solid;border-color:transparent;border-right-color:rgba(0, 0, 0, 0.1)
}
.h3-border-bottom-two-colors .article-body h3:not(.is-style-none):not(.epb-advance-headling__text){
position:relative;padding-top:12px;padding-bottom:12px;border-bottom:solid 3px #ffce5b;
}

.h3-border-bottom-two-colors .article-body h3:not(.is-style-none):not(.epb-advance-headling__text)::before{
position:absolute;content:"";bottom:-3px;left:0;width:15%;height:3px;background-color:#f2954e;z-index:2;
}
.h4-dashed-bottom .article-body h4:not(.is-style-none):not(.epb-advance-headling__text) {
padding-top:8px;padding-bottom:8px;border-bottom:2px dashed #f2954e;
}