@charset "utf-8";

html{
	font-size: 16px;
}

*,
*::before,
*::after{
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

@font-face {
	font-family: 'NotoSans';
	src: url(../fonts/footer_fonts/NotoSansJP-VariableFont_wght.ttf);/*20250715修正*/
}

@font-face {
	font-family: 'ShipporiM';
	src: url(../fonts/footer_fonts/ShipporiMincho-Regular.ttf);/*20250715修正*/
}

/*20250715修正*/

/* body{
	width: 100%;
	font-family: "NotoSans","Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", yu-mincho-pr6, serif;
	color: #333;
	letter-spacing: 0.1em;
	overflow-x: hidden;
} */

footer li{
	list-style: none;
}

footer ol > li{
	list-style: decimal-leading-zero;
}

footer img{
	/* width: 100%; *//*20250715修正*/
	vertical-align: bottom;
}

footer a{
	color: #333;
	text-decoration: none;
	transition: all 0.3s;
}

footer a:hover{
	filter: brightness(0.8);
	color: #000;
}
/* ---------変数・汎用クラス--------- */
/* ●変数 */
/* PC用 */
:root{
	/* フォントサイズ用 */
	--footer-font-xxs: 0.625rem;  /* 10x */
	--footer-font-xs: 0.75rem;    /* 12px */
	--footer-font-s:  clamp(0.75rem, 0.666rem + 0.17vw, 0.875rem); /* 12~14px */
	--footer-font-n:  clamp(0.875rem, 0.791rem + 0.17vw, 1rem);    /* 14~16px */
	--footer-font-l:  1.125rem;   /* 18px */
	--footer-font-xl: 1.5rem;     /* 24px */
	--footer-font-ttl: 2rem;      /* 32px */
	--footer-font-cc:  clamp(2rem, 0.664rem + 2.78vw, 4rem);       /* 32px~64px */

	/* margin,padding用 */
	--footer-space-xs: 0.25rem; /* 4px */
	--footer-space-s:  0.5rem;  /* 8px */
	--footer-space-n: 	1rem;    /* 16px */
	--footer-space-nn: 1.5rem;  /* 24px */
	--footer-space-l:  2rem;    /* 32px */
	--footer-space-xl: 4rem;    /* 64px */
	--footer-space-h:  6.25rem; /* 100px */

	/* コンテンツサイズ */
	--footer-arrow-size: 2.5rem;   /* 40px */
	--footer-contents-size: 50rem; /* 800px */

	/* 色 */
	--footer-c-gray:  #727171;
	--footer-c-grayw: #adadad;
	--footer-c-whiteg:#DBDCDC;
	--footer-c-gold:  #D2AF3A;
	--footer-c-goldw:  #866f22;
	--footer-c-blue:  #1a2c51;

	/* 画像用サイズ */
	--footer-img-icon-xs:0.75rem; /* 12px */
	--footer-img-icon-ss:1rem;    /* 16px */
	--footer-img-icon-s: 1.25rem; /* 20px */
	--footer-img-icon-l: 2.5rem;  /* 40px */
	--footer-img-icon-xl: 5rem;   /* 80px */
	--footer-img-m     : 6rem;    /* 96px */
	--footer-img-l     : clamp(17rem, 14.996rem + 4.17vw, 20rem); /*  272~320px */
	--footer-img-xl    : 30rem;   /* 480px */
	--footer-img-banner: 20rem;   /* 320~400px */
	--footer-img-contact:clamp(17rem, 14.996rem + 4.17vw, 20rem); /*  272~320px */
}
@media screen and (max-width:768px) {
	/* スマホ用 */
	:root{
		/* フォントサイズ用 */
		--footer-font-xxs: 0.5rem;  /* 8px */
		--footer-font-xs: 0.5rem;   /* 8px */
		--footer-font-s:  0.625rem; /* 10px */
		--footer-font-n:  0.75rem;  /* 12px */
		--footer-font-l:  1.125rem; /* 18px */
		--footer-font-xl: 1rem;     /* 24px */
		--footer-font-ttl: 1.5rem;  /* 32px */
		--footer-font-cc: clamp(1.5rem, 0.538rem + 5.13vw, 3rem); /* 24px~48px */
		/* margin,padding用 */
		--footer-space-xs: 0.25rem; /* 4px */
		--footer-space-s:  0.5rem;  /* 8px */
		--footer-space-n: 	1rem;    /* 16px */
		--footer-space-nn: 1.5rem;  /* 24px */
		--footer-space-l:  2rem;    /* 32px */
		--footer-space-xl: 5rem;    /* 80px */
		--footer-space-h:  4rem;    /* 64px */
		/* 画像用サイズ */
		--footer-img-icon-xs: 0.625rem; /* 10px */
		--footer-img-icon-ss: 0.875rem; /* 14px */
		--footer-img-icon-s:  1rem;     /* 16px */
		--footer-img-icon-l: 2rem;      /* 32px */
		--footer-img-icon-xl: 4rem;     /* 64px */
		--footer-img-l: 12rem;			 /* 192px */
		--footer-img-banner: 17rem;	 /* 272px */
		--footer-img-contact: 15rem;    /* 240px */
	}
}

/* ●汎用クラス（サイズ、幅、一部カラーは原則ここにあるクラスを使用します） */

/* 基本フォントサイズ */
.footer-font-xxs{font-size: var(--footer-font-xxs);}
.footer-font-xs{font-size: var(--footer-font-xs);}
.footer-font-s{font-size: var(--footer-font-s);}
.footer-font-n{font-size: var(--footer-font-n);}
.footer-font-l{font-size: var(--footer-font-l);}
.footer-font-xl{font-size: var(--footer-font-xl);}

/* h2用フォントサイズ */
.footer-font-title{font-size: var(--footer-font-ttl);}

/* キャッチコピー用フォントサイズ */
.footer-font-cc{font-size: var(--footer-font-cc);}
.footer-font-cc-s{font-size: calc(var(--footer-font-cc) * 0.8);}
.footer-font-cc-l{font-size: calc(var(--footer-font-cc) * 1.3);}
.footer-font-sc{font-size: calc(var(--footer-font-cc) * 0.5);}

/* フォント太さ */
.footer-font-bold{font-weight: 600;}

/* 基本幅、高さ調整用(padding) */
.footer-padding-s{padding: var(--footer-space-s);}
.footer-padding-n{padding: 1rem;}
.footer-padding-nn{padding: var(--footer-space-nn);}
.footer-paddingt-n{padding-top: var(--footer-space-n);}
.footer-paddingt-nn{padding-top: var(--footer-space-nn);}
.footer-paddingt-l{padding-top: var(--footer-space-l);}
.footer-paddingb-n{padding-bottom: var(--footer-space-n);}
.footer-paddingb-l{padding-bottom: var(--footer-space-l);}
.footer-paddingl-n{padding-left: var(--footer-space-n);}
.footer-paddingl-l{padding-left: var(--footer-space-l);}
.footer-paddingr-n{padding-right: var(--footer-space-n);}
.footer-paddingr-l{padding-right: var(--footer-space-l);}
.footer-paddingtb-xs{padding: var(--footer-space-xs) 0;}
.footer-paddingtb-s{padding: var(--footer-space-s) 0;}
.footer-paddingtb-n{padding: var(--footer-space-n) 0;}
.footer-paddingtb-l{padding: var(--footer-space-xl) 0;}
.footer-paddingtb-xl{padding: var(--footer-space-xl) 0;}
.footer-paddingrl-s{padding: 0 var(--footer-space-s);}
.footer-paddingrl-n{padding: 0 var(--footer-space-n);}
.footer-paddingrl-l{padding: 0 var(--footer-space-l);}

/* ヘッダーと同じ高さの幅 */
.footer-paddingt-h{padding-top: var(--footer-space-h);}

/* ナビゲーションの幅 */
.footer-padding-nav{padding: var(--footer-space-n) 0 var(--footer-space-n) 0;}
.footer-padding-nav-c{padding: var(--footer-space-n) var(--footer-space-l) var(--footer-space-n) var(--footer-space-l);}

/* 幅、高さ調整用(marginが必要な場合) */
.footer-marginl-xs{margin-left: var(--footer-space-xs);}
.footer-marginrl-n{margin: var(--footer-space-n);}
.footer-margint-n{margin-top: var(--footer-space-n);}
.footer-margint-nn{margin-top: var(--footer-space-nn);}
.footer-margint-xl{margin-top: var(--footer-space-xl);}
.footer-margintb-nn{margin: var(--footer-space-nn) 0;}
.footer-margintb-xl{margin: var(--footer-space-xl) 0;}

/* 文字間の幅 */
.footer-line-height-p{line-height: 1.7;}

/* コンテンツなどの幅 */
.footer-padding-content{padding: var(--footer-space-n) var(--footer-space-n) calc(var(--footer-space-n) * 3) var(--footer-space-n);}
.footer-padding-content-s{padding: var(--footer-space-n) var(--footer-space-n) calc(var(--footer-space-n) * 2) var(--footer-space-n);}
.footer-padding-box{padding: var(--footer-space-n) calc(var(--footer-space-n) * 3);}
.footer-padding-box-s{padding: var(--footer-space-s) var(--footer-space-n);}

/* 矢印用 */
.footer-arrow-size{width: var(--footer-arrow-size); aspect-ratio: 5 / 4; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); clip-path: polygon(0% 0%, 100% 0%, 50% 100%);}

/* メイン全体幅 */
.footer-contents-size{width: 95%; max-width: var(--footer-contents-size); margin: 0 auto;}

/* 下線用(色別) */
.footer-border-bottom{border-bottom: #333 1px solid; padding: var(--footer-space-xs); padding-top: 0;}
.footer-border-bottomw{border-bottom: #FFF 1px solid; padding: var(--footer-space-xs); padding-top: 0;}
.footer-border-bottomg{border-bottom: var(--footer-c-gold) 2px solid;}
.footer-border-bottom-dotted{border-bottom: #333 1px dotted; padding: var(--footer-space-xs);}

/* 背景及びそれに合わせた文字色 */
.footer-bg-gray{color: #fff; background-color: var(--footer-c-gray);}
.footer-bg-gold{color: #fff; background-color: var(--footer-c-gold);}
.footer-bg-blue{color: #fff; background-color: var(--footer-c-blue);}
.footer-bg-white{color: #333; background-color: #fff;}
.footer-bg-whiteg{background-color: var(--footer-c-whiteg);}
.footer-c-lgold{background: linear-gradient(30deg, var(--footer-c-goldw), var(--footer-c-gold) 66%, var(--footer-c-goldw)); -webkit-background-clip: text; -webkit-text-fill-color: transparent;}

/* アイコンサイズ */
.footer-img-icon-xs{width: auto; height: var(--footer-img-icon-xs); margin-right: var(--footer-space-xs);}
.footer-img-icon-ss{width: auto; height: var(--footer-img-icon-ss); margin-right: var(--footer-space-xs);}
.footer-img-icon-s{width: auto; height: var(--footer-img-icon-s); margin-right: var(--footer-space-xs);}
.footer-img-icon-l{width: auto; height: var(--footer-img-icon-l);}
.footer-img-icon-xl{width: auto; height: var(--footer-img-icon-xl);}

/* 基本画像サイズ */
.footer-img-m{width: var(--footer-img-m);}
.footer-img-l{width: var(--footer-img-l);}
.footer-img-xl{width: var(--footer-img-xl);}

/* バナー用サイズ */
.footer-img-banner{width: var(--footer-img-banner);} 

/* お問い合わせ用のサイズ */
.footer-img-contact{width: calc(var(--footer-img-contact) * 1.1); height: var(--footer-img-contact);}
.footer-img-contact-inner{width: var(--footer-img-l); height: var(--footer-img-l);}

/* 改行位置制御 */
.footer-nowrap-word{white-space: nowrap;}

@media screen and (max-width:768px) {
	/* コンテンツサイズのスマホ版 */
	.footer-padding-box{padding: var(--footer-space-n) calc(var(--footer-space-n) * 1.5);}
	.footer-padding-content{padding: var(--footer-space-n) 0 calc(var(--footer-space-n) * 3) 0;}
}
/* ---------変数・汎用クラスここまで--------- */

/* ☆フッター */
footer{
	width: 100%;
	font-family: "NotoSans","Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", yu-mincho-pr6, serif;
	font-weight: 400;/*20250715修正*/
	color: #333;
	letter-spacing: 0.1em;
	line-height: 1.6;
	overflow-x: hidden;
}

footer .footer_upper{
	max-width: 22rem;
	margin: 0 auto;
	padding-top: 4rem;/*20250715修正*/
	text-align: center;
}

footer .footer_upper > h2 > img{
	width: 18.75rem;
}

footer .footer_tel_fax{
	display: flex;
	flex-direction: row;
	justify-content: center;
	gap: var(--footer-space-s); /* 8px */
}

footer .sns_icons{
	display: flex;
	flex-direction: row;
	justify-content: space-around;
	gap: 1rem;
}


footer .footer_nav > ul{
	display: flex;
	flex-direction: row;
	justify-content: space-around;
	gap: 1rem;
	flex-wrap: wrap;
	line-height: 1.5;
}

footer .footer_nav > ul > li > a{
	position: relative;
	font-weight: 600;
	display: flex;
	align-items: center;
}

footer .footer_lower{
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	gap: 2rem;
}

footer .footer_lower_box ul{
	width: fit-content;
	display: flex;
	flex-direction: column;
	margin: 0 auto;
}

footer .footer_wrapper small{
	display: block;
	text-align: center;
	letter-spacing: 0;
}

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

	/* ☆フッター */
	footer .footer_upper{
		max-width: 19rem;
	}

	footer .footer_upper > h2 > img{
		width: 17rem;
	}

	footer .footer_lower{
		flex-direction: column;
		align-items: center;
		gap: var(--footer-space-n);
	}
}

@media screen and (max-width:385px) {
	footer .footer_nav ul{
		flex-direction: column;
		align-items: center;
	}
}