/*
Last Updated: 2022-01-13
Author: Minoura
*/

/*----------------------------------------
	全体
----------------------------------------*/

html{
	font-family:'游ゴシック体', 'Yu Gothic', YuGothic,'メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ ゴシック',sans-serif;
	font-size:62.5%;
	color: #000;
	-webkit-text-size-adjust:100%;
	line-height:1.5;
	font-weight: 500;
}
body{ font-size:1.4rem; font-size: 1.4em; }
main{ background: url(../images/washi.webp); }
footer{ background: url(../images/washi.webp); }
img{ vertical-align: bottom; }


a{
	color:#009dc4;
	transition: all 0.4s;
}
a:hover{
	color:#05bfee;
	transition: all 0.4s;
}

.text_red{ color:#cc0000; }
.text_white{ color:#fff; }
.text_bold{ font-weight: bold; }
.text_normal{ font-weight: normal; }

/*----------------------------------------
	text
----------------------------------------*/

p{ line-height:1.8; }

.text_10{ font-size:1.0rem !important; }
.text_11{ font-size:1.1rem !important; }
.text_12{ font-size:1.2rem !important; }
.text_13{ font-size:1.3rem !important; }
.text_14{ font-size:1.4rem !important; }
.text_15{ font-size:1.5rem !important; }

/*line-height*/
.lh_11{ line-height: 1.1 !important; }
.lh_12{ line-height: 1.2 !important; }
.lh_13{ line-height: 1.3 !important; }
.lh_14{ line-height: 1.4 !important; }
.lh_15{ line-height: 1.5 !important; }
.lh_16{ line-height: 1.6 !important; }
.lh_17{ line-height: 1.7 !important; }
.lh_18{ line-height: 1.8 !important; }

/*letter-spacing*/
.ls_1{ letter-spacing: 1px; }
.ls_2{ letter-spacing: 2px; }
.ls_3{ letter-spacing: 3px; }

@media print, screen and (min-width: 769px){

	.text_16{ font-size:1.6rem !important; }
	.text_17{ font-size:1.7rem !important; }
	.text_18{ font-size:1.8rem !important; }
	.text_19{ font-size:1.9rem !important; }
	.text_20{ font-size:2.0rem !important; }
	.text_21{ font-size:2.1rem !important; }
	.text_22{ font-size:2.2rem !important; }
	.text_24{ font-size:2.4rem !important; }
	.text_26{ font-size:2.6rem !important; }
	.text_28{ font-size:2.8rem !important; }
	.text_30{ font-size:3.0rem !important; }
	.text_32{ font-size:3.2rem !important; }
	.text_34{ font-size:3.4rem !important; }
	.text_36{ font-size:3.6rem !important; }
	.text_38{ font-size:3.8rem !important; }
	.text_40{ font-size:4.0rem !important; }
	.text_42{ font-size:4.2rem !important; }
	.text_48{ font-size:4.8rem !important; }

	/*line-height*/
	.lh_19{ line-height: 1.9 !important; }
	.lh_20{ line-height: 2 !important; }
	.lh_21{ line-height: 2.1 !important; }
	.lh_22{ line-height: 2.2 !important; }
	.lh_23{ line-height: 2.3 !important; }
	.lh_24{ line-height: 2.4 !important; }
	.lh_25{ line-height: 2.5 !important; }

	/*letter-spacing*/
	.ls_4{ letter-spacing: 4px; }
	.ls_5{ letter-spacing: 5px; }
	.ls_6{ letter-spacing: 6px; }
	.ls_7{ letter-spacing: 7px; }
	.ls_8{ letter-spacing: 8px; }

}/*END*/

@media print, screen and (min-width:769px) and ( max-width: 899px) {

	.text_18{ font-size: 1.7rem !important; }
	.text_19{ font-size: 1.7rem !important; }
	.text_22{ font-size: 1.8rem !important; }
	.text_30{ font-size: 2.4rem !important; }
	.text_40{ font-size: 3.2rem !important; }

}/*END*/

@media print, screen and (min-width: 900px) and ( max-width: 1039px) {

	.text_19{ font-size: 1.8rem !important; }
	.text_22{ font-size: 2.0rem !important; }
	.text_30{ font-size: 2.8rem !important; }
	.text_40{ font-size: 3.6rem !important; }

}/*END*/

@media screen and (max-width: 768px){

	.text_16,
	.text_17,
	.text_18{
		font-size: 1.5rem;
	}
	.text_20,
	.text_19{
		font-size: 1.6rem !important;
	}
	.text_21,
	.text_22,
	.text_24{
		font-size: 1.8rem !important;
	}
	.text_26,
	.text_28,
	.text_30,
	.text_32,
	.text_34,
	.text_38,
	.text_36,
	.text_40,
	.text_42{
		font-size: 2rem !important;
	}
	.text_48{
		font-size: 3.2rem !important;
	}

	/*letter-spacing*/
	.ls_4{ letter-spacing: 3px; }
	.ls_5{ letter-spacing: 4px; }
	.ls_6{ letter-spacing: 4px; }
	.ls_7{ letter-spacing: 4px; }
	.ls_8{ letter-spacing: 4px; }

	/*line-height*/
	.lh_19,
	.lh_20,
	.lh_21,
	.lh_22,
	.lh_23,
	.lh_24,
	.lh_25{
		line-height: 1.8 !important;
	}

}/*END*/

@media screen and (max-width: 599px){

	.text_16,
	.text_17,
	.text_18{
		font-size: 1.4rem;
	}
	.text_20,
	.text_19{
		font-size: 1.5rem !important;
	}
	.text_21,
	.text_22,
	.text_24{
		font-size: 1.6rem !important;
	}
	.text_26,
	.text_28,
	.text_30,
	.text_32,
	.text_34{
		font-size: 1.8rem !important;
	}
	.text_38,
	.text_36,
	.text_40,
	.text_42{
		font-size: 2rem !important;
	}
	.text_48{
		font-size: 2.8rem !important;
	}

	/*letter-spacing*/
	.ls_4{ letter-spacing: 2px; }
	.ls_5{ letter-spacing: 2px; }
	.ls_6{ letter-spacing: 2px; }
	.ls_7{ letter-spacing: 2px; }
	.ls_8{ letter-spacing: 2px; }

}/*END*/


li{ list-style:none; }
.center{ text-align:center; }

.op:hover img{
	filter: alpha(opacity=60);
	-moz-opacity:060;
	opacity:0.60;
}
.btn_hover{
	position: relative;
	display: block;
}
.btn_hover:hover{
	animation:btn_hover 0.6s ease-in-out;
}
@keyframes btn_hover{
	0%{
		top: 0;
	}
	40%{
		top: -6px;
	}
	100%{
		top: 0;
	}
}

/*----------------------------------------
	layout
----------------------------------------*/

#container{
	position: relative;
	overflow: hidden;
	max-width: 500px;
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	/*box-shadow: 0 0 50px 0px rgba(0,0,0,0.3);*/
}
.fixed_bg{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url("../images/washi.webp") center top;
	z-index: -1;
}
.fixed_ribbon_l,
.fixed_ribbon_r{
	position: fixed;
	top: 0;
	background: url("../images/ribbon.webp") center top repeat-y;
	background-size: 100%;
	height: 100vh;
	width: 5.92%;
	max-width: 80px;
	box-shadow: 0 0 8px 0px rgba(0,0,0,0.2);
}
.fixed_ribbon_l{
	left: 0;
}
.fixed_ribbon_r{
	right: 0;
}
.btn_yoyaku{
	display: block;
	margin-left: auto;
	margin-right: auto;
	width: 88%;
}
.btn_web{
	display: block;
	margin-left: auto;
	margin-right: auto;
	width: 53.33%;
}

@media screen and (max-width: 749px){

	#container{
		max-width: inherit;
	}
	.fixed_bg,
	.fixed_ribbon_l,
	.fixed_ribbon_r{
		display: none;
	}

}/*END*/
@media print, screen and (min-width: 769px){



}/*END*/

@media print, screen and (min-width: 920px){



}/*END*/

@media print, screen and (min-width: 1120px){



}/*END*/

@media screen and (max-width: 768px){



}/*END*/

@media screen and (max-width: 599px){



}/*END*/



@media print, screen and (min-width: 769px){





}/*END*/

@media screen and (max-width: 768px){






}/*END*/

@media screen and (max-width: 599px){



}/*END*/




/*----------------------------------------
	header
----------------------------------------*/

header{
	position: relative;
}
.menu_btn{
	position: fixed;
	left: 50%;
	cursor: pointer;
	z-index: 9999;
}
.ins_btn{
	position: fixed;
	top: 25px;
    left: 48%;
	cursor: pointer;
	z-index: 9999;
}


.menu_btn span{
	display: inline-block;
	width: 100%;
	height: 3px;
	background: #fff;
	position: absolute;
	left: 0;
	transition: all 0.5s;
}
.menu_btn span.scrolled {
    background: #D5317A; /* スクロール後の新しい背景色 */
}
.menu_form span{
	/*background: #be9662;*/
}
.menu_btn:hover span{
	/*background: #be9662;*/
}
.menu_btn span:nth-child(1){
	top: 0;
}

.menu_btn span:nth-child(3){
	bottom: 0;
}
.open .menu_btn span{
}
.open .menu_btn span:nth-child(1){
	transform: rotate(-45deg);
	top: 10px;
}
.open .menu_btn span:nth-child(2){
	opacity: 0;
}
.open .menu_btn span:nth-child(3){
	transform: rotate(45deg);
	bottom: 14px;
}
.drawer{
	position: fixed;
	background: rgba(0, 0, 0, 0.9);
	top: 0;
	right: 0;
	width: 100%;
	height: 100vh;
	color: #fff;
	display: flex;
	justify-content: center;
	visibility: hidden;
	opacity: 0;
	transform: translateX(100%);
	transition: 0.5s ease-in-out;
	z-index: 50;
}
.drawer ul{
	text-align: center;
	padding-top: 180px;
}
.drawer ul li{
	position: relative;
	transform: translateX(-150px);
	transition: transform 0.5s ease;
}
.drawer ul li:nth-child(2){ transition-delay: 0.1s; }
.drawer ul li:nth-child(3){ transition-delay: 0.15s; }
.drawer ul li:nth-child(4){ transition-delay: 0.2s; }
.drawer ul li:nth-child(5){ transition-delay: 0.25s; }
.drawer ul li:nth-child(6){ transition-delay: 0.3s; }
.drawer ul li:nth-child(7){ transition-delay: 0.35s; }
.drawer ul li:nth-child(8){ transition-delay: 0.4s; }
.drawer ul li:nth-child(9){ transition-delay: 0.45s; }
.drawer ul li:nth-child(10){ transition-delay: 0.5s; }
.drawer ul li:nth-child(11){ transition-delay: 0.55s; }
.drawer ul li:nth-child(12){ transition-delay: 0.6s; }
.drawer ul li:nth-child(13){ transition-delay: 0.65s; }
.drawer ul li a{
	transition: all 0.4s;
	display: inline-block;
	font-size: 3rem;
	color: #fff;
	text-decoration: none;
	padding: 20px;
	cursor: pointer;
}
.drawer li a:hover{
	color: #be9662;
}
.open .drawer{
	visibility: visible;
	opacity: 1;
	transform: translateX(0);
}
.open .drawer ul li{
	transform: translateX(0);
}




@media print, screen and (min-width: 750px){

	.menu_btn{
		width: 32px;
		height: 27px;
		top: 26px;
		left: 50%;
		margin-left: 190px;
	}
	.ins_btn{
		width: 36px;
        height: 27px;
        top: 23px;
        left: 47.5%;
        margin-left: 190px;
	}	
	.menu_btn span:nth-child(2){
		top: 12px;
	}

}/*END*/



@media screen and (max-width: 749px){

	.menu_btn, .ins_btn{
		left: auto;
		right: 4.5%;
		width: 40px;
		height: 28px;
		margin-left: auto;
		top: 30px;
	}
	.menu_btn span:nth-child(2){
		bottom: 12px;
	}
	.open .menu_btn span:nth-child(1){
		top: 12px;
	}
	.open .menu_btn span:nth-child(2){
		bottom: 8px;
	}
	.drawer ul{
		padding-top: 100px;
	}
	.drawer ul li{
		transform: translateX(-70px);
	}
	.drawer ul li a{
		font-size: 2rem;
		padding: 16px;
	}

}/*END*/


@media screen and (max-width: 479px){


	.menu_btn{
		width: 30px;
		height: 24px;
		top: 20px;
	}
	.ins_btn{
		width: 30px;
		height: 24px;
		right: 16%;
    	top: 18px;
	}	
	.menu_btn span:nth-child(2){
		bottom: 10px;
	}
	.open .menu_btn span:nth-child(1){
		top: 10px;
	}
	.open .menu_btn span:nth-child(3){
		bottom: 10px;
	}





}/*END*/


@media print, screen and (min-width: 769px) and ( max-width:1119px){



}/*END*/

@media print, screen and (min-width: 1120px){



}/*END*/



/*----------------------------------------
	MV
----------------------------------------*/

.mv{
	position: relative;
}
.mv h1{
	position: absolute;
	left: 0;
	top: 0;
	z-index: 2;
}
.mv ul.clearfix{
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	background: rgba(123,28,44,0.6);
	z-index: 3;
}
.mv ul.clearfix li{
	float: left;
	box-sizing: border-box;
}
.mv ul.clearfix li a{
	display: block;
}
.mv ul.clearfix li:first-child{
	width: 40%;
}
.mv ul.clearfix li:last-child{
	width: 60%;
	border-left: 1px solid #fff;
}
.mv ul.clearfix li:first-child a:hover{
	background: rgba(0,0,0,0.6);
}
.mv ul.clearfix li:last-child a:hover{
	background: rgba(0,0,0,0.6);
}
.slick-dots{
	position: absolute;
	left: 3%;
	bottom: 80px;
	width: 140px;
	z-index: 3;
	display: none;
}
.slick-dots li{
	float: left;
	margin-right: 10px;
	width: 13px;
	height: 13px;
	overflow: hidden;
}
.slick-dots li button{
	/*border-radius: 50%;*/
	border: none;
	background: #595757;
	width: 13px;
	height: 13px;
	max-width: 13px;
	max-height: 13px;
	color: transparent;
	overflow: hidden;
	cursor: pointer;
	display: block;
}
.slick-dots li.slick-active button{
	background: #bebfc0;
}


/*----------------------------------------
	content
----------------------------------------*/

.content_frame {
    /*background: url('../images/washi.webp') repeat;*/
    box-sizing: border-box;
    padding-left: 4.66%;
    padding-right: 4.66%;
}
.content_frame ul{
	margin-left: -2.94%;
}
.content_frame ul li{
	float: left;
	width: 47.05%;
	margin-left: 2.94%;
	margin-bottom: 30px;
}
.content_frame ul li a{
	display: block;
	box-shadow: 5px 5px 0 0 rgba(0,0,0,0.1);
	transition: all 0.4s;
}

.diviners .content_frame ul li, .price .content_frame ul li{
	clear: both;
	float: none;
	width: 97.05%;
}

.diviners .content_frame .mini{
	clear: none;
	float: left;
	width: 30%;
}
.service .content_frame ul li{
	float: left;
	width: 47.05%;
	margin-left: 2.94%;
	margin-bottom: 30px;
}

.content_frame ul li a:hover{
	box-shadow: 5px 5px 0 0 rgba(0,0,0,0.4);
}
.conversion_content01{
	background: #7B1C2C;
}
.conversion_content02{
	background: #3D005B;
}
.conversion_content03{
	background: #B98F04;
}
.conversion_content04{
	background: #F9A94C;
}
.conversion_content05{
	background: #B0DAEB;
}
.conversion_content08{
	background: #BCBCBC;
}
.conversion_content_etc{
	
}

.btn_more{
	background: #f2e9e0;
}
.btn_more a{
	display: block;
	margin-left: auto;
	margin-right: auto;
	width: 40.26%;
}
.btn_conversion{
	background: #fff;
}
.btn_form{
	display: block;
	width: 100%;
	color: #fff;
	border: none;
	padding-top: 35px;
	padding-bottom: 35px;
	font-size: 2.1rem;
	font-weight: bold;
	cursor: pointer;
	line-height: 1;
	letter-spacing: 1px;
	transition: all 0.4s;
	background: #000;
	max-width: 92%;
	text-decoration: none;
	margin-right: auto;
	margin-left: auto;
	text-align: center;
}
.btn_form:hover{
	color: #fff;
}



/*----------------------------------------
	フォーム
----------------------------------------*/

#reservation{
	padding-right: 4%;
	padding-left: 4%;
	background: #fff;
}
#reservation table{
	line-height: 2;
	width: 100%;
}
#reservation th,
#reservation td{
	border: 2px solid #dcdcdc;
	text-align: left;
}
#reservation th{
	background: #eee;
	padding: 5px 15px;
}
#reservation td{
	padding: 15px 15px;
}
.btn_check input,
.btn_check button{
	width: 100%;
	color: #fff;
	border: none;
	padding-top: 35px;
	padding-bottom: 35px;
	font-size: 2.1rem;
	font-weight: bold;
	cursor: pointer;
	line-height: 1;
	letter-spacing: 1px;
	transition: all 0.4s;
	font-family:'游ゴシック体', 'Yu Gothic', YuGothic,'メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ ゴシック',sans-serif;
}
.btn_check input{
	background: #000;
}
.btn_check button{
	background: #aaa;
}
.btn_check input:hover,
.btn_check button:hover{
	opacity: 0.7;
}
.hissu,
.nini{
	display: inline-block;
	padding: 3px 6px;
	line-height: 1;
	font-size: 1.4rem;
	margin-left: 6px;
	vertical-align: 2px;
}
.hissu{
	border: 1px solid #f39800;
	background: #f39800;
	color: #fff;
}
.nini{
	border: 1px solid #000;
	background: #fff;
}

select,
textarea,
input[type="text"],
input[type="tel"]{
	border: none;
	padding: 12px 15px;
	box-sizing: border-box;
	font-family:'游ゴシック体', 'Yu Gothic', YuGothic,'メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ ゴシック',sans-serif;
	-webkit-appearance: none;
	appearance: none;
	background: #eee;
	font-size: 1.8rem;
}
input[type="button"]{
	font-family:'游ゴシック体', 'Yu Gothic', YuGothic,'メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ ゴシック',sans-serif;
	-webkit-appearance: none;
	appearance: none;
}
.form1{ width: 70px; }
.form2{ width: 120px; }
.form3{ width: 200px; }
.form4{ width: 300px; }
.form_all{ width: 100%; }
:focus{ outline: none; }
input[type="text"]:focus,
textarea:focus{
	border-color: #00a8eb;
}

@media screen and (max-width: 768px){

	select,
	textarea,
	input[type="text"]{
		font-size: 1.6rem;
	}
	.form3,
	.form4{
		width: 100%;
	}

}/*END*/


/*----------------------------------------
	radio checkbox
----------------------------------------*/

.radio input[type="radio"],
.check input[type="checkbox"]{
	position: absolute;
	height: 1px;
	width: 1px;
	clip: rect(0, 0, 0, 0);
}
.radio label,
.check label{
	display: block;
	position: relative;
	cursor: pointer;
	margin-left: 10px;
	padding-left: 20px;
	line-height: 2.5;
}
.radio label:before,
.check label:before{
	position: absolute;
	content: "";
	top: 50%;
	left: -10px;
	width: 20px;
	height: 20px;
	margin-top: -10px;
	background: #eee;
	border: none;
	border-radius: 50%;
}
.check label:before{ border-radius: 0; }
.radio label,
.check label{
	margin-left: 0\9;
	padding: 11px\9;
}
.radio label:not(:target),
.check label:not(:target){
	margin-left: 10px\9;
	padding: 11px 0 11px 25px\9;
}
.radio label:before,
.check label:before{
	display: none\9;
}
.radio label:not(:target):before,
.check label:not(:target):before{
	display: inline-block\9;
}
.radio input[type="radio"]:checked + label:after{
	position: absolute;
	content: "";
	top: 50%;
	left: -7px;
	width: 8px;
	height: 8px;
	margin-top: -4px;
	border-radius: 50%;
	background: #c2d352;
}
.check input[type="checkbox"]:checked + label:after {
	content: "";
	position: absolute;
	top: 50%;
	box-sizing: border-box;
	display: block;
	left: -6px;
	width: 16px;
	height: 8px;
	margin-top: -4px;
	border-left: 2px solid #fff;
	border-bottom: 2px solid #fff;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
.check input[type="checkbox"]:checked + label:before{
	border: 2px solid #014099;
	background: #014099;
}
.radio input[type="radio"]:focus + label:before,
.check input[type="checkbox"]:focus + label:before{
	border-color: #95a90f;
	box-shadow: 0 0 5px #014099;
}


/*----------------------------------------
	footer
----------------------------------------*/

.foot_sns{
	background: #e4e4e5;
}
.foot_sns ul{
	width: 51.6%;
	margin-right: auto;
	margin-left: auto;
}
.foot_sns li{
	width: 33.33%;
	padding-left: 3.87%;
	padding-right: 3.87%;
	box-sizing: border-box;
	float: left;
}
.fixed_link{
	position: fixed;
	left: 0;
	bottom: -550px;
	z-index: 10;
	width: 100%;
	background: rgba(123,28,44,0.95);
	background: rgba(255,255,255,0.95);
	transition: all 0.4s;
	padding-top: 1px;
}
.fixed_link ul{
	margin-top: 8px;
}
.fixed_link li{
	float: left;
	width: 33.33%;
	box-sizing: border-box;
	border-right: 1px solid #fff;
	background: rgba(0,0,0,0.7);
}
.fixed_link li a{
	display: block;
}
#scroll-to-top {
	display: none; /* 最初は非表示にする */
	position: fixed;
	bottom: 70px;
	right: 20px;
    width: 50px; /* 画像のサイズに合わせて調整してください */
    height: 50px; /* 画像のサイズに合わせて調整してください */
    background: none;
    border: none;
    cursor: pointer;
	z-index: 1;
}
#scroll-to-top img {
    width: 100%;
    height: auto;
}
@media (min-width: 750px) {
	#scroll-to-top {
		right: 8%; /* ウィンドウサイズが750px以上の時に右側のマージンを設定 */
	}
}

#loading-animation {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh; /* ローディングアニメーションを画面の中央に配置 */
}

.card {
  width: 30px;
  height: 50px;
  background: #D5317A;
  margin: 0 5px;
  border-radius: 5px;
  animation: shuffle 1.5s infinite ease-in-out;
}

/* アニメーションのキーフレーム定義 */
@keyframes shuffle {
  0%, 100% {
    transform: translateY(0);
  }
  25% {
    transform: translateY(-20px);
  }
  75% {
    transform: translateY(20px);
  }
}

/* 個々のカードに遅延を設定 */
.card:nth-child(1) {
  animation-delay: 0s;
}
.card:nth-child(2) {
  animation-delay: 0.1s;
}
.card:nth-child(3) {
  animation-delay: 0.2s;
}

/* 初期状態で全コンテンツを非表示に */
.content-container {
    display: block; /* 初期状態でblockに設定 */
    opacity: 0; /* 初期状態では透明に */
    transition: opacity 1s ease-in-out; /* 透明度の変化にトランジションを適用 */
}



	
:root{
  --bn-height: 66px;
  --bn-safe: env(safe-area-inset-bottom, 0px);
  --bn-accent: #D5317A; /* 既存のアクセント色 */
}
@media (max-width: 750px){
  body{ padding-bottom: calc(var(--bn-height) + var(--bn-safe)); }

  .bottom-nav{
    position: fixed;
    left: 0; right: 0; bottom: 0;
    height: var(--bn-height);
    padding-bottom: var(--bn-safe);
    background: #fff;
    border-top: 1px solid #eee;
    display: flex;
    z-index: 9999;
  }
  .bottom-nav .bn-item{
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    color: #333;
    font-size: 12px;      /* 6個並べても収まるサイズ */
    line-height: 1;
    padding-top: 2px;
  }
  .bottom-nav .bn-item svg{
    width: 20px; height: 20px; /* 6個対応で少し小さめ */
    fill: currentColor;
    display: block;
  }
  /* 現在ページ */
  .bottom-nav .bn-item[aria-current="page"],
  .bottom-nav .bn-item.active{
    color: var(--bn-accent);
    font-weight: 600;
  }
  /* CTAだけ強調（色と太字） */
  .bottom-nav .bn-item.cta{
    color: var(--bn-accent);
    font-weight: 700;
  }

  /* 既存のフローティングリンクはモバイルでは隠す */
  .fixed_link{ display: none !important; }
}

/* PCでは非表示 */
@media (min-width: 751px){
  .bottom-nav{ display: none; }
}