:root {
	--text-color:#222;

	--default-font-size: 16rem;
	--default-line-height: 1.7;

	--font-size-SS: 12rem;
	--font-size-S: 14rem;
	--font-size-M: 16rem;
	--font-size-L: 18rem;
	--font-size-LL: 20rem;
	--font-size-LLL: 24rem;
	--font-size-LLLL: 32rem;

	--margin-space-SS:10rem;
	--margin-space-S:20rem;
	--margin-space-M:40rem;
	--margin-space-L:60rem;

	--body-background-color: #fff;

	--header-background-color: #fffffff8;
	--header-height-pc: 80rem;
	--header-height-sp: 60rem;

	--header-humburger-color: var(--text-color);
	--slide-menu-bg-color: var(--header-background-color);

	--footer-background-color: #eee;
}
@media (max-width:780px) {
}


*, ::before, ::after {
	margin:0px; padding:0px; box-sizing:border-box; vertical-align:baseline; backface-visibility:visible; justify-content:center; align-items:center; flex-wrap:wrap;
}
body,main,section,article,aside,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,button,p,blockquote,th,table,tbody,tr,td,a,img,label,time,nav,figure,picture {
	position:relative; border:none; border-spacing:0;
}

ul, ol { list-style:none; }
h1, h2, h3, h4, h5, h6 { font-size:inherit; }

body { font-size:var(--default-font-size); line-height:var(--default-line-height); font-feature-settings: "palt" 1; width:100%; min-height:100%; height:auto; text-align:center; word-break:normal; word-wrap:break-word; overflow-wrap:break-word; background:var(--body-background-color); color:var(--text-color);　 }

a { text-decoration:none; color:inherit; }

figure { max-width:100%; line-height:0; }
figure img { width:100%; height:auto; }

.objectFit { object-fit:cover; width:100%; height:100%; }
.objectFit.contain { object-fit:contain; }

.notes { text-align:left; margin-top:2em; }
.notes > *, .note { text-indent:-1em; padding-left:1em; }
.notes > *::before, .note::before { content:'※'; }
.notes > * + * { margin-top:0.33em; }


/***********************************************************

スケーリング

***********************************************************/
html { font-size:1px; margin-top:0 !important; height:100%; }
@media (max-width:1240px) {
	html.scaleing1240 { font-size:calc(1 / 1240 * 100vw); }
}
@media (max-width:1040px) {
	html.scaleing1040 { font-size:calc(1 / 1040 * 100vw); }
}
@media (max-width:780px) {
	html, html.scaleing1240, html.scaleing1040 { font-size:calc(1 / 390 * 100vw); }
}


/***********************************************************

FORM

***********************************************************/
input, textarea, button { outline:none; }
input, textarea { border:1rem solid #ccc; padding:0 16rem; }
input, textarea { font-size:18rem; }
input { height:40rem; width:100%; }
button { width:320rem; height:60rem; border:1rem solid #ccc; display:flex; font-size:var(--font-size-L); background:white; }
button:disabled { opacity:0.33; }
button:not(:disabled):hover { cursor:pointer; }
label { display:inline-block; }
label.full { width:100%; }
form { margin:2em 0; }
form .formTitle { font-size:var(--font-size-LL); margin-bottom:40rem; }
form .buttons { margin-top:3em; }

/* バリデーション */
form.formValidation .validateErrorMessage { position:absolute; left:0; bottom:0; transform:translateY(calc(100% + 5rem)); border-radius:5rem; padding:5rem 10rem; background:rgba(255, 47, 47, 0.8); color:#fff; font-weight:bold; z-index:2; white-space:nowrap; font-size:0.8em; line-height:1.5em; pointer-events:none; }
form.formValidation .validateErrorMessage::before { content:''; position:absolute; left:20rem; top:-8rem; border-style:solid; border-color:transparent transparent rgba(255, 47, 47, 0.8); border-width:0 4rem 8rem; pointer-events:none;}

/* 認証コード */
form .authCodeForm { display:flex; gap:10rem; margin-top:2em; }
form .authCodeForm > div { width:60rem; height:80rem; border:1rem solid #ccc; display:flex; font-size:40rem; cursor:pointer; }
form .authCodeForm > div.focus { border:2rem solid #a2d7dd; }
form .authCodeForm input { position:fixed; left:-100%; top:-100%; }

/***********************************************************

フォント

***********************************************************/

/* 標準フォント (Noto Sans) */
.notoSans { font-family:'Noto Sans JP', sans-serif; font-optical-sizing: auto; font-weight:400; font-style: normal; }

/* フォントサイズ */
.fontSizeSS { font-size:var(--font-size-SS); }
.fontSizeS { font-size:var(--font-size-S); }
.fontSizeM { font-size:var(--font-size-M); }
.fontSizeL { font-size:var(--font-size-L); }
.fontSizeLL { font-size:var(--font-size-LL); }
.fontSizeLLL { font-size:var(--font-size-LLL); }


/***********************************************************

PC / SP切り替え

***********************************************************/
.sp { display:none; }
@media (max-width:780px) {      /* MOBILE */
	.sp { display:block; }
	img.sp, span.sp, br.sp { display:inline; }
}


.marginTopSS { margin-top:var(--margin-space-SS); }
.marginTopS { margin-top:var(--margin-space-S); }
.marginTopM { margin-top:var(--margin-space-M); }
.marginTopL { margin-top:var(--margin-space-L); }

/***********************************************************

MAIN

***********************************************************/
main { position:absolute; left:0; top:0; width:100%; min-height:100%;  padding-bottom:var(--footer-height);  }
main:has(header.fixedHeader) { padding-top:var(--header-height); }


/***********************************************************

HEADER

***********************************************************/
header { width:100%; height:var(--header-height-pc); background:var(--header-background-color); padding:0 40rem; }
header.shadow { box-shadow:0 2rem 6rem #00000010; }
header .wrapper { height:100%; }

header .headerLogo img { width:auto; height:60rem; }

@media (max-width:780px) {
	header { height:var(--header-height-sp); padding:0 20rem; }

	header .headerLogo img { height:42rem; }
}

/* 上部完全固定型 */
header.fixedHeader { position:fixed; left:0; top:0; z-index:1000; }

/* ロゴの左側固定 */
header .headerLogo.headerLogoLeft { position:absolute; left:0; top:50%; transform:translateY(-50%); z-index:1; display:block; }

@media (max-width:780px) {

}


/***********************************************************

NAVIGATION

***********************************************************/

/* 標準 */
nav { display:flex; align-items:stretch; height:100%; }
nav > * { display:flex; padding:0 40rem; }
nav .absoluteRight { position:absolute; right:0; height:100%; }
@media (max-width:780px) {

	nav.pc { display:none; }

	/* 標準 */
	nav.slideMenu {
		top:var(--header-height-sp); height:calc(100vh - var(--header-height-sp));
		padding:var(--header-height-sp) 0;
	}
}


/***********************************************************

FOOTER

***********************************************************/
footer { width:100%; opacity:1; visibility:hidden; padding-top:60rem; }
footer .bg { width:100%; padding:20rem 0; background:var(--footer-background-color); }
html.ready footer { visibility:visible; position:absolute; left:0; bottom:0; }

@media (max-width:780px) {
}


/* ボーダーボックス */
.borderBox { border:1px solid #ccc; padding:40rem; margin:1.5em 0; }
.borderBox.borderBoxShadow { box-shadow:10rem 10rem 20rem #00000008; }

/* ページタイトル */
.pageTitle { margin:60rem 0; font-size:var(--font-size-LLL); }


/***********************************************************

MODULES

***********************************************************/
/*
HOME用ブロックタイトル
*/
.modHomeBlockTitle { margin-top:60rem; margin-bottom:40rem; }

/*
インデックスグリッド
*/
.indexGrid { display:grid; grid-template-columns:180rem 1fr; text-align:left; }
.indexGrid.indexGridShort { grid-template-columns:120rem 1fr; }

/*-----------------------------------------------
コンテンツラッパー
-----------------------------------------------*/
.contentWrapper { width:100%; max-width:1200rem; margin-left:auto;  margin-right:auto; }
.contentWrapper.width1000 { max-width:1000rem; }
.contentWrapper.width960 { max-width:960rem; }
.contentWrapper.width800 { max-width:800rem; }
.contentWrapper.width640 { max-width:640rem; }
html.scaleing1040 .contentWrapper { max-width:1000rem; }

/*-----------------------------------------------
トップスクロールボタン
-----------------------------------------------*/
.scrollToTop { position:fixed; right:20rem; bottom:20rem; width:80rem; opacity:0; pointer-events:none; transition:opacity 0.33s; }
html.scrolled .scrollToTop { opacity:1; pointer-events:auto; cursor:pointer; }

/*-----------------------------------------------
ボタン
-----------------------------------------------*/
.buttons { display:flex; margin-top:4em; }
.button { width:320rem; height:60rem; border:1rem solid #ccc; display:flex; font-size:var(--font-size-L); }
.button:not(:disabled):hover { cursor:pointer; }

/*-----------------------------------------------
フロート式サイドボタン
-----------------------------------------------*/

/* ボタンラッパー */
.floatButtons { position:fixed; z-index:200;  right:0; top:150rem;  color:#fff; }

/* ボタン */
.floatButton { display:flex; justify-content:center; align-items:center; flex-direction:column; color:inherit;  width:80rem; height:80rem; font-size:14rem; line-height:1.5em; }
a.floatButton:link, a.floatButton:active, a.floatButton:hover { text-decoration:none; color:inherit; }

/* ボタンホバー時に明るくする */
.floatButton.brightness:hover { filter:brightness(120%); }

/* ボタン内の画像サイズ */
.floatButton .icon { display:block; width:24rem; font-size:24rem; line-height:1; margin-bottom:8rem; }

/* ボタン別指定 */
.floatButton:nth-child(1) { background:#ee827c; }
.floatButton:nth-child(2) { background:#ad7d4c; }
.floatButton:nth-child(3) { background:#5a544b; }
.floatButton:nth-child(4) { background:#2c4f54; }
.floatButton:nth-child(5) { background:#cca6bf; }

/* 横書き */
.floatButton.horizontalText { writing-mode:sideways-lr; width:60rem; height:120rem; }

@media (max-width:780px) {

	/* ボタンラッパー */
	.floatButtons { right:auto; top:auto; width:100%; display:flex;  left:0; bottom:0; }

	/* ボタン */
	.floatButton { flex-direction:row; width:auto; height:60rem; font-size:14rem; flex:1; }
	.floatButton .icon { margin-bottom:0; margin-right:4rem; }
	.floatButton.horizontalText { writing-mode:horizontal-tb; height:60rem; }
}

/*-----------------------------------------------
スライドイン式ナビゲーション
-----------------------------------------------*/
/*
.modSlideInNavigation {  }
.modSlideInNavigation nav.slideMenu {
position:fixed; left:100%; top:var(--header-height-pc); width:100%; height:calc(100vh - var(--header-height-pc)); background-color:#fff; z-index:100;
flex-direction:column; justify-content:flex-start; align-items:flex-start;
padding:var(--header-height-pc) 0;
transition:left 0.5s;
}
.modSlideInNavigation nav.slideMenu.sp { display:none; }
.modSlideInNavigation nav.slideMenu > * { font-size:var(--font-size-LL); width:100%; height:60rem; justify-content:flex-start; }
.modSlideMenuOpened nav.slideMenu { left:0; }
*/

/*
ハンバーガーメニュー

<header>
<div class="menuFrame navInsertHere"></div>
<div class="hamburgerMenu"><div class="bar"></div></div>
</header>
*/
.hamburgerMenu { position:absolute; right:0; top:0; width:var(--header-height-pc); height:var(--header-height-pc); display:flex; flex-direction:column; background:#fcfcfc; cursor:pointer; z-index:1001; }
.hamburgerMenu.sp { display:none; }

/* メニューフレーム */
.hamburgerMenu .menuFrame { position:fixed; left:0; top:var(--header-height-pc); width:100vw; height:calc(100vh - var(--header-height-pc)); background:var(--slide-menu-bg-color); transition:left 1s; display:flex; flex-direction:column; justify-content:flex-start; padding-top:var(--header-height-pc); transition:opacity 0.5s; opacity:0; pointer-events:none; }
.hamburgerMenu .menuFrame > * { font-size:var(--font-size-LL); height:60rem; display:flex; }

/* メニューアイコン */
.hamburgerMenu .menuIcon { width:100%; height:100%; display:flex; }
.hamburgerMenu .menuIcon > * { width:50%; height:5%; background:var(--header-humburger-color); transition:all 0.3s; overflow:visible; }
.hamburgerMenu .menuIcon > *::before,
.hamburgerMenu .menuIcon > *::after { content:''; width:100%; height:100%; background:var(--header-humburger-color); transition:all 0.5s; display:block; position:absolute; left:0; top:0;}
.hamburgerMenu .menuIcon > *::before { transform:translateY(-300%); }
.hamburgerMenu .menuIcon > *::after { transform:translateY(300%); }

/* メニューアクティブ時 */
html.slideMenuActive .hamburgerMenu .menuFrame { opacity:1; }
html.slideMenuActive .hamburgerMenu .menuIcon > * { background:transparent; }
html.slideMenuActive .hamburgerMenu .menuIcon > *::before { transform:translateY(0) rotate(45deg); transform-origin:center center; }
html.slideMenuActive .hamburgerMenu .menuIcon > *::after { transform:translateY(0) rotate(-45deg); transform-origin:center center; }

@media (max-width:780px) {

	.hamburgerMenu { width:var(--header-height-sp); height:var(--header-height-sp); }

	/* メニューフレーム */
	.hamburgerMenu .menuFrame { top:var(--header-height-sp); height:calc(100vh - var(--header-height-sp)); }
	.hamburgerMenu .menuFrame > * { font-size:var(--font-size-LL); height:60rem; display:flex; }

	/* ロゴの左側固定 */
	.hamburgerMenu .fixedLeftLogo figure img { height:calc((var(--header-height-sp) / 3) * 2); }

	/* ハンバーガーメニュー */
	.hamburgerMenu { width:var(--header-height-sp); height:var(--header-height-sp); }
	.hamburgerMenu.sp { display:flex; }
}

/* ホバー処理各種 */
.hover.whiteToBlack { background:white; color:black; transition:all 0.2s; }
.hover.whiteToBlack:not(:disabled):hover { background:black; color:white; }


/***********************************************************

セクション

***********************************************************/

/*-----------------------------------------------
投稿セクション
-----------------------------------------------*/
section.wpPost { margin-top:60rem; }
section.wpPost .postTitle { font-size:var(--font-size-LL); font-weight:500; display:flex; text-align:left; }
section.wpPost .postDate { text-align:right; margin-top:var(--margin-space-SS); }
section.wpPost .postContent { text-align:left; margin-top:var(--margin-space-M); font-size:var(--font-size-L); }
section.wpPost .postContent > * { margin:1.25em 0; }
section.wpPost .postContent > *:first-child { margin-top:0; }
section.wpPost .postContent .wp-block-embed { border:1rem solid #ccc; padding:20rem; font-size:var(--font-size-M); line-height:var(--default-line-height); }

@media (max-width:780px) {
	section.wpPost .postTitle,
	section.wpPost .postDate,
	section.wpPost .postContent { padding:0 10rem; }
}


/*-----------------------------------------------
404セクション
-----------------------------------------------*/
section.page404 { padding:100rem 0; }
section.page404 .message { font-size:1.5em; font-size:var(--font-size-L); }


/*-----------------------------------------------
COMING SOONセクション
-----------------------------------------------*/
section.comingSoon { padding:100rem 0; }
section.comingSoon .message {  font-size:1.5em; font-size:var(--font-size-L); }


/*-----------------------------------------------
マイページセクション
-----------------------------------------------*/
section.myPage {  }

/***********************************************************

コンテンツブロック

***********************************************************/

/*
キービジュアル
*/
.BLOCK_KeyVisual { aspect-ratio: 1600 / 900; width:100%; overflow:hidden; }
.BLOCK_KeyVisual.height600 { height:600rem; }
.BLOCK_KeyVisual.height600 figure { width:100%; height:100%; }


/***********************************************************

WORDPRESS OVERRIDE

***********************************************************/

#wpadminbar { background:#00000080; }