/*------------------------------------------------------------
	全体
------------------------------------------------------------*/
*{
	font-family: "Noto Sans", sans-serif;
	color: #222222;
	text-align: center;
	text-align-last: center;
	margin: 0;
	padding: 0;
}

body{
	margin: 0 auto;
	padding: 0px;
	font-size: 14px;
	line-height: 1.5em;
	font-feature-settings: "palt";
	overflow-x: clip;
}
p{
	font-size: clamp(16px, 2vw, 20px);
    line-height: 1.7em;
}
.cap{
	font-size: clamp(13px, 2vw, 16px);
	font-weight: 700;
}
a{
	text-decoration: none;
}
ul, li {
    list-style-type: none;
    margin: 0px;
    padding: 0px;
    display: block;
	word-break:break-all;
}
img{
	width: 100%;
	flex-shrink: 0;
}
.cap{
	font-size: 0.7em;
	 line-height: 1.5em;
	padding-left: 1em;
    text-indent: -1em;
}
.sp{
	display: none;
}
.pc{
	display: block;
}
a.external{
	display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.25em;
}
a.external::after{
	font-family: 'Font Awesome 5 Free';
	font-weight: 900;
	content: '\f35d';
	font-size: 14px;
}

@media all and (min-width:840px){
}
@media all and (max-width:540px){
	.sp{
		display: block;
	}
	.pc{
		display: none!important;
	}
}
/*------------------------------------------------------------
	ヘッダー（header）
------------------------------------------------------------*/
header{
	position: relative;
    z-index: 100;
    width: calc(100% - 4rem);
	background: #222222;
	padding: 1rem 2rem;
	margin-bottom: 4em;
}
header > div{
	max-width: 1440px;
	width: 100%;
	display: flex;
    justify-content: space-between;
    align-items: center;
}
header a.headerLogo img {
    filter: invert(100%);
    max-width: 100%;
    width: auto;
    height: 2.25em;
}
header ul.headerLinks{
	display: flex;
	gap: 24px;
    font-size: 15px;
	font-weight: 400;
}
header ul.headerLinks *{
	color: #f5f0e9;
}

@media all and (max-width:840px){
	header ul.headerLinks{
		display: none;
	}
	.menu.menuToggle{
		display: flex;
		flex-direction: column;
        justify-content: space-around;
		/*display: block;
		position: relative;*/
		width: 30px;
		height: 30px;
		z-index: 10;
		margin-left: 10px;
		cursor: pointer;
	}
	.menu.menuToggle span{
		display: inline-block;
		/*position: absolute;
		left: 0;*/
		width: 100%;
		height: 2px;
		background: #FFFFFF;
		-webkit-transition: background 0.3s, -webkit-transform 0.3s;
		transition: background 0.3s, -webkit-transform 0.3s;
		transition: transform 0.3s, background 0.3s;
		transition: transform 0.3s, background 0.3s, -webkit-transform 0.3s;
	}
	/*.menu.menuToggle span:nth-of-type(1) {
		top: 0;
	}
	.menu.menuToggle span:nth-of-type(2) {
		top: 14px;
	}
	.menu.menuToggle span:nth-of-type(3) {
		bottom: 0;

	}*/
	.menu.menuToggle.is-active span {
		background: #FFFFFF;
	}
	.menu.menuToggle.is-active span:nth-of-type(1) {
		-webkit-transform: translateY(10px) rotate(45deg);
		transform: translateY(10px) rotate(45deg);
	}
	.menu.menuToggle.is-active span:nth-of-type(2) {
		opacity: 0;
	}
	.menu.menuToggle.is-active span:nth-of-type(3) {
		-webkit-transform: translateY(-10px) rotate(-45deg);
		transform: translateY(-10px) rotate(-45deg);
	}
	.menu.menuToggle.is-active span {
		background: #FFFFFF;
	}
}

@media all and (max-width:540px){	
	header{
		margin-bottom: 1em;
	}
	header a.headerLogo img {
		height: 1.75em;
	}
}
/*------------------------------------------------------------
	メニュー
------------------------------------------------------------*/
.menuBox{
	display: none;
	position: fixed;
	top: 0;
    left: 0;
	z-index: 98;
	width: 100vw;
	height: 100vh;
}
.innerBox {
    width: 100%;
    height: 100%;
    margin-right: 0;
    margin-left: auto;
    background: #222222;
}
ul.naviUl {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: flex-start;	
    justify-content: flex-start;
    height: 100%;
    padding-left: 5%;
    padding-right: 5%;	
    font-size: clamp(16px, 2vw, 18px);
    font-weight: 500;
}
ul.naviUl li{
	display: flex;
	width: 100%;
	padding: 1.25em 0;
	border-top: 1px #f5f0e9 solid;
}
ul.naviUl li:last-child{
	border-bottom: 1px #f5f0e9 solid;
}
ul.naviUl a{
	/*position: relative;*/
	color: #f5f0e9;
	
}
/*ul.naviUl a::after{
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 1px;
	background: #f5f0e9;
	transition: 0.2s;
	transform-origin: left;
	transform: scaleX(0);
}*/
/*ul.naviUl a:hover::after{
	transform: scaleX(1);
}*/




/*------------------------------------------------------------
	パンくずリスト
------------------------------------------------------------*/
ul#breadcrumb{
	display: flex;
    align-items: center;
	flex-wrap: wrap;
	gap: 0.5em;
	margin: 0.7em auto;
}
ul#breadcrumb li{
	
}
ul#breadcrumb li::after{
	font-family: 'Font Awesome 5 Free';
	font-weight: 900;
	content: "\f105";	
	font-size: 14px;
}
ul#breadcrumb li:last-child::after{
	content: "";
}
ul#breadcrumb li *{
	font-size: 14px;
}





/*------------------------------------------------------------
	コンテンツ
------------------------------------------------------------*/
main{
	max-width: 1100px;
	margin: 0 auto;
}
.ttl{
	background: #b2a386;
	padding: 1.75rem;
	margin-bottom: 2rem;
}
.ttl *{
	color: #f5f0e9;
	line-height: 1.2em;
}
.ttl .ttlWarp p{
	font-size: clamp(14px, 2.5vw, 24px);
    font-weight: 700;
}
.ttl .ttlWarp h1{
	font-size: clamp(24px, 5vw, 48px);
}
@media all and (max-width:840px){
	main{
		padding: 0 20px;
	}
}


/*------------------------------------------------------------
	フッター（footer）
------------------------------------------------------------*/
footer{
	margin-top: 4em;
}
footer a{
	transition: .3s;
}
footer a:hover{
	opacity: 0.7;
}
footer hr{
	border-color: #222222;
}





footer .ftBottom{
	background: #f3eee7;
	padding: 2rem 20px 0.5rem;
	border-top: 3px #222222 solid;
}
footer .ftBottom > div{
	max-width: 1100px;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}
footer .ftBottom .ftlinkWarp{
	margin-bottom: 2rem;
	font-size: 16px;
}
footer .ftBottom .ftlinkWarp *{
	text-align-last: left;
}
footer .ftBottom .ftlinkWarp ul{
	display: flex;
    flex-wrap: wrap;
    gap: 0.5em 2em;
    margin-top: 0.5em;
}
footer .ftBottom .ftlinkWarp li a{
	font-weight: 600;
}
footer .ftBottom .ftlinkWarp li a::before{
	font-family: 'Font Awesome 5 Free';
	font-weight: 900;
	content: "\f105";	
	font-size: 14px;
	padding-right: 0.25em;
}



footer .ftBottom .ftlogoWarp{
	display: flex;
	align-items: center;
    gap: 3rem;
	margin-top: 2rem;
	margin-bottom: 1rem;
}
footer .ftBottom a.footerLogo{
	display: block;
}
footer .ftBottom a.footerLogo img{
	max-width: 100%;
    width: auto;
    height: 3em;
}
footer .ftBottom p{	
	color: #cf121b;
	padding-bottom: 1em;
}
footer .ftBottom span{	
	display: inline;
}
footer .ftBottom small,
footer .ftBottom small *{
	font-size: 12px;
	font-weight: 500;
	color: #222222;
}

footer .ftBottom .snsLink{
	display: flex;
	gap: 0.5rem;
}
footer .ftBottom .snsLink a{
	display: flex;
	justify-content: center;
    align-items: center;
    width: 45px;
    height: 45px;
    background: #222222;
    border-radius: 50%;
}
footer .ftBottom .snsLink a::after{
	font-family: 'Font Awesome 5 Brands';
	font-weight: 400;
	font-size: 24px;
	color: #f3eee7;
}
footer .ftBottom .snsLink a.inst::after{	
	content: "\f16d";	
}
footer .ftBottom .snsLink a.xTwitter::after{
	font-family: 'Font Awesome 6 Brands';
	content: "\e61b";
}
footer .ftBottom .snsLink a.line::after{	
	content: "\f3c0";	
}

@media all and (max-width:540px){	
	footer .ftBottom .ftlogoWarp{
		justify-content: center;
	}
	footer .ftBottom a.footerLogo img{
		height: 2.5em;
	}
}



