/* original package
--------------------------------------------- */
body.page-id-2915 {
    background: linear-gradient(226deg, #FCFBF5 0%, #F9F4EA 79.23%);
}
.page-id-2915 h3 {
    display: table;
    padding: 8px 24px;
    align-items: flex-start;
    color: #FFF;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    border-radius: 24px;
    background: #928456;
    margin: auto;
}
figure {
	margin: 0;
}
.menu-left {
    display: none;
}
.menu-left a {
    border-left: double 3px;
    padding: 7px 0 7px 10px;
    line-height: 30px;
	display: inline-block; /* transformを効かせるために必要 */
	/* 滑らかに動かすための設定 (0.3秒かけて変化) */
    transition: transform 0.3s ease, color 0.3s ease;
}
.menu-left a:hover {
	transform: translateX(16px); /* 右に16px移動 */
    color: #928456;
}
.menu-left a.is-active {
    transform: translateX(16px);
    color: #928456;
}

.menu-b-logo {
    max-width: 80px;
    margin: 40px auto 0;
}
.main-conte {
    max-width: 500px;
    margin: auto;
}
.main-conte>div {
    background: #fff;
	/*box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25); */
	box-shadow: 0 -4px 10px -5px rgba(0, 0, 0, 0.25);
}
.logo-content {
    display: none;
}
.main-txt01 {
    padding: 48px 20px 0 20px;
}
span.txt01gold {
    color: #928456;
	font-size: 20px;
	font-weight: 600;
}
.block02 {
    display: flex;
    width: auto;
    height: 557px;
    padding: 32px;
    justify-content: center;
    align-items: center;
    gap: 10px;
}
/* 1. 親コンテナの設定（中央に重ねる土台） */
.block02 .wp-block-cover__inner-container {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 400px; /* 必要に応じて調整 */
}

/* 2. 重ね合わせの共通設定 */
.block02-txt,
.block02-maru {
    position: absolute;
    margin: 0 !important;
    padding: 0;
}

/* 下側の画像 */
.block02-txt {
    z-index: 1;
}

/* 3. 上側の画像（bg_block02c.png を回転させる） */
.block02-maru {
    z-index: 2;
    /* アニメーションの設定: 名称、時間、動き、無限反復 */
    animation: spin-right 20s linear infinite;
}

/* 4. 回転の動きを定義 */
@keyframes spin-right {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

/* 画像自体のリセット */
.block02-txt img,
.block02-maru img {
    display: block;
    height: auto;
    max-width: 100%;
}
.block03 {
    margin-top: 48px;
	display: flex;
    padding: 72px 0 64px 0;
    flex-direction: column;
    align-items: center;
	width: 100%;
    gap: 56px;
    align-self: stretch;
    background: var(--02, linear-gradient(180deg, #F7F1E4 0%, #FCFAF7 100%));
}
.block03>div {
        width: 100%;
}

.block03 .txt-01 {
    color: #928456;
    font-size: 24px;
    font-weight: 600;
    display: flex;
    padding: 0 0 16px 0;
	margin: 0 24px;
    justify-content: center;
    border-bottom: 3px double #928456;
    margin-bottom: 56px;
}
.block03 .txt-02-txt,
.block03 .txt-04-txt,
.block03 .txt-06-txt {
    display: block;
    width: fit-content;
    padding: 16px 32px;
    align-items: center;
    background: #FFF;
    color: #000;
    text-align: center;
    font-size: 18px;
    font-weight: 600;
    margin: auto;
}
.block03 .txt-03 {
    color: #808174;
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    margin: 16px auto 24px;
}


.block03 .wp-block-image img {
	align-self: flex-start !important;
    margin-left: 0 !important;
    max-width: 420px;
    width: 90%;
}
.txt-04,
.txt-06 {
    margin: 64px auto 0;
    align-items: center;
}

.txt-05,
.txt-07 {
    color: #808174;
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    padding: 16px 0 24px;
}

.block03-img02 {
	display: flex;
    justify-content: flex-end;
}

.ap-pro>div {
    display: flex;
    padding: 64px 20px;
    flex-direction: column;
    align-items: center;
    gap: 72px;
}
.ap-pro .txt-01 {
    padding: 8px 24px;
    border-radius: 24px;
    background: #928456;
    color: #FFF;
    text-align: center;
    font-size: 24px;
    font-weight: 600;
    line-height: normal;
}
.ap-pro .txt-02 {
    display: flex;
    padding: 16px 24px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    align-self: stretch;
    background: #F4EEE1;
}
.g-prod>div {
    display: block;
}
@media (min-width: 500px) {
	.g-prod>div {
		display: flex;
		width: auto;
		align-items: stretch;
	}
}
.g-prod3 {
    margin: 32px 0;
}
.g-prod3>div {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 56px;
}

.txt-prod-name {
    display: flex;
    width: 170px;
    margin: 0 20px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
    align-self: stretch;
}
p.flavor {
    color: #808174;
    text-align: center;
    font-size: 14px;
    font-weight: 600;

}
.g-condition {
    display: flex;
    padding: 0 20px 72px 20px;
    flex-direction: column;
    align-items: center;
    gap: 64px;
    margin-top: 64px;
}
.g-condition>div {
    display: flex;
    width: auto;
    padding: 40px 23px 17px 23px;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    border-radius: 16px;
    background: #FCFBF5;
}
.page-id-2915 h3.design-conditions {
	margin-top: -62px;
}


/* リスト全体の設定 */
.wp-block-list {
    list-style: none;      /* デフォルトの数字を消す */
    counter-reset: my-count; /* カウンターを初期化 */
    padding: 0;
}

/* リスト項目（li）の設定 */
.wp-block-list li {
    counter-increment: my-count; /* 数字を1ずつ増やす */
    position: relative;
    padding-left: 2em;           /* 数字を表示するスペースを確保 */
    margin-bottom: 15px;
    display: flex;
    align-items: center;
}

ol#custom-list {
     margin: 15px 0 0 0;
}
.wp-block-list li::before {
    /* decimal-leading-zero を指定することで 01, 02 になる */
    content: counter(my-count, decimal-leading-zero);
    position: absolute;
    left: 0;
    font-weight: bold;
    color: #333;             /* お好みの色に */
    font-size: 1.2rem;       /* お好みのサイズに */
    border-bottom: 1px solid #333; /* 下線を入れるとおしゃれです */
}
.wp-block-list li::before {
    top: 0;
    color: #928456;
    font-size: 16px;
    font-style: normal;
    font-weight: 800;
    line-height: normal;
	border-bottom: none;
}
.g-step>div {
    display: flex;
    width: 92%;
    max-width: 460px;
    padding: 48px 40px 40px 40px;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    background: linear-gradient(180deg, #F7F1E4 0%, #FCFAF7 100%);
    margin: auto;
}
.sankaku-shita {
    text-align: center;
    padding-top: 24px;
}
.g-step>div>div {
    margin-top: -77px;
    margin-left: -30px;
}
.g-nagare3 {
    padding-top: 18px;
}
.g-nagare3 .g-step {
    padding-top: 32px;
}
p.flow-annai {
    color: #808174;
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    padding: 32px 0 64px;
}
.wp-block-group.g-price>div {
    display: flex;
    padding: 72px 20px;
    flex-direction: column;
    align-items: center;
    gap: 56px;
    background: var(--01, linear-gradient(180deg, #FCFBF6 0%, #F6F3E5 100%));
}
.wp-block-group.unit-price {
    background: #FFF;
    width: 100%;
}
.unit-price>div {
    display: flex;
    padding: 8px 0 24px 0;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.price-img01 {
    padding: 20px;
}
.price-txt01 {
    color: #928456;
    font-size: 20px;
    font-weight: 600;
}
.price-txt02 {
    text-align: center;
    font-weight: 600;
    padding-top: 6px;
}
p.price-txt03 {
    text-align: center;
    font-weight: 600;
}
.g-price02 {
    background: #FFF;
}
.price-txt04 {
	display: flex;
    padding: 24px 20px;
    justify-content: center;
    text-align: center;
    font-weight: 600;
}
.juzi {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 24px;
}
.g-price-txt06 {
    display: flex;
    padding: 8px;
    justify-content: center;
    border: 1px solid #808174;
    background: #FFF;
    margin-top: 32px;
}
.g-price-txt06>div {
    display: flex;
    padding: 24px 40px;
    justify-content: center;
    flex: 1 0 0;
    border: 1px solid #808174;
}
p.price-txt06 {
    font-size: 20px;
    font-weight: 600;
}
.g-scene>div {
    display: flex;
    padding: 72px 0;
    flex-direction: column;
    align-items: center;
    gap: 56px;
    align-self: stretch;
}
.g-scene .txt01 {
    font-size: 20px;
    font-weight: 600;
}
.scene7>div {
    display: flex;
    flex-wrap: wrap;
	justify-content: space-around;
	gap: 8px;

}
.g-s1c {
    width: 100%;
}
.g-s2c {
    width: 48.9%;
}
/* 親要素の余白もリセットする場合 */
.wp-block-image {
    margin-bottom: 0;
}

.g-s2c .wp-block-image {
    margin-bottom: 0;
}
/* 親要素：配置の基準にする */
.g-s1c > div,
.g-s2c > div {
    position: relative;
    display: inline-block;
    line-height: 0;
	display: block;
    vertical-align: bottom;
}

.scene-titl {
    position: absolute;
    top: 0;
    left: 0;
    writing-mode: vertical-rl;
    text-orientation: mixed;
    background-color: #ffffff;
    padding: 15px 10px;
    z-index: 10;
    font-size: 18px;
    font-weight: 600;
    line-height: 25px;
}

.scene7 .wp-block-image {
    margin: 0;
}
.scene7 .wp-block-image img {
    display: block;
    width: 100%;
    height: auto;
}
.txt02 {
    color: #928456;
    font-size: 32px;
    font-weight: 800;
}
.g-kansya>div {
    display: flex;
    padding: 8px 32px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 10px;
}
.g-howto-send {
    display: flex;
    padding: 0 20px 72px 20px;
    flex-direction: column;
    align-items: center;
    gap: 64px;
}
.g-howto-send>div {
    display: flex;
    width: 96%;
    padding: 40px 24px 32px 24px;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    border-radius: 16px;
    background: var(--01, linear-gradient(180deg, #FCFBF6 0%, #F6F3E5 100%));
}
.wp-block-group.g-yokuaru {
    display: flex;
    padding: 0 20px;
    flex-direction: column;
    align-items: center;
    gap: 56px;
    align-self: stretch;
    background: #FCFBF5;
}
.g-yokuaru>div {
    display: flex;
    padding: 0;
    flex-direction: column;
    align-items: center;
    gap: 56px;
}
.g-original-ques>div {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* 全体の外枠 */
.accord {
    background-color: #fff;
    border-radius: 30px;
    display: flex;
	padding: 24px 16px;
	flex-direction: column;
	align-items: flex-start;
	gap: 24px;
	align-self: stretch;
}
.accord>div {
	width: 100%;
}	
/* 質問エリア */
.questions {
    cursor: pointer;
    position: relative;
    padding: 10px 0;
}

/* Qとテキストとアイコンを横並びにする */
.questions .wp-block-group__inner-container {
    display: flex;
    align-items: center;
    justify-content: space-between; /* テキストとアイコンを両端に */
    gap: 14px;
}

/* Qの装飾 */
.questions p {
    margin: 0;
    font-weight: 600;
    display: flex;
    align-items: center;
}

.questions p::before {
    content: "Q";
    color: #a89a78;
    font-size: 20px;
    margin-right: 15px;
}

/* アイコン（丸背景） */
.icon {
    position: relative;
    display: block;
    width: 32px;
    min-width: 32px;
    height: 32px;
    background-color: #e6ddd0;
    border-radius: 50%;
}

/* ＋とーの線 */
.icon::before, .icon::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #fff;
    transition: all 0.3s;
}

.icon::before { width: 14px; height: 2px; } /* 横棒 */
.icon::after { width: 2px; height: 14px; }  /* 縦棒 */

/* 開いた時のアニメーション（縦棒を回転させて消す） */
.questions.is-open .icon::after {
    transform: translate(-50%, -50%) rotate(90deg);
    opacity: 0;
}

/* 回答エリア：初期状態は非表示 */
.answer {
    display: none; 
    margin: 0;
    padding: 15px 0 15px 40px; /* Qの文字分だけ左を下げる */
    position: relative;
}

/* Aの装飾 */
.answer::before {
    content: "A";
    position: absolute;
    left: 0;
    color: #a89a78;
    font-size: 20px;
    top: 10px;
	font-weight: 600;
}
.g-order>div {
    display: flex;
    padding: 72px 20px;
    flex-direction: column;
    align-items: center;
    gap: 64px;
    align-self: stretch;
}
.g-3pro>div {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 56px;
}
.g-order-titl>div {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 56px;
}
.g-product>div {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 32px;
}
.g-product-name {
    display: flex;
	width: 100%;
    padding: 24px 0;
    justify-content: center;
    align-items: center;
    gap: 10px;
	white-space: nowrap;
    text-align: center;
}
.g-product .g-product-name {
    border-top: 1px solid #808174;
    border-bottom: 1px solid #808174;
}
/* クリック範囲の基準となる親要素 */
.g-product {
    position: relative; /* 子要素の基準点にする */
    transition: background-color 0.3s ease; /* ホバー時の演出用（任意） */
}
.g-product a::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1; /* 他の要素の上に被せる */
}
.g-product:hover {
    opacity: 0.8; /* 全体を少し薄くするなど */
    cursor: pointer;
	box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
}

p.txt-name {
    text-align: center;
    font-weight: 600;
}
.txt-flavor {
	color: #808174;
    font-size: 13px;
    font-weight: 600;
    display: flex;
    justify-content: center;
    align-self: stretch;
}
[id] {
    scroll-margin-top: 92px;
}

@media (min-width: 500px) {
		.menu-left>div {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		gap: 16px;
		margin: auto;
		width: 240px;
	}
	.main-conte {
		margin-top: 40px;
    }
	.main-conte>div {
		border-radius: 50px 50px 0 0;
	}
	.origi-main-img img {
		border-radius: 50px 50px 0 0;
	}
	.page-id-2915 h3 {
		font-size: 24px;
	}
	span.txt01gold {
		font-size: 24px;
	}
	.g-condition>div {
		width: 100%;
		max-width: 460px;
		padding: 48px 40px 25px 40px;
	}
	.page-id-2915 h3.design-conditions {
		margin-top: -74px;
	}
	.block03 .txt-02-txt,
	.block03 .txt-04-txt,
	.block03 .txt-06-txt {
		font-size: 20px;
	}
	.unit-price>div {
		flex-direction: row;
	}
	.price-txt04 {
		width: 200px;
	}
	.g-product-name {
		border-top: 1px solid #808174;
		border-bottom: 1px solid #808174;
	}
	.g-prod .g-product-name {
		padding: 0;
		margin: 0 20px;
		border-top: 1px solid #808174;
		border-bottom: 1px solid #808174;
		text-align: center;
	}
	p.txt-prod-name {
		margin: 0;
		border-top: none;
		border-bottom: none;
	}
	.g-product>div {
		flex-direction: row;
	}
}

@media (min-width: 768px) {
    .origi-p>div {
        display: flex;
        align-items: flex-start;
        width: 100%;
		padding-right: 24px;
    }

    /* 2. メニュー（左側）の設定：残り幅をすべて占有し固定 */
    .menu-left {
        flex: 1; /* ロゴが消えたので、500px以外の残りをすべて占める */
        position: sticky;
        top: 52px;
        height: calc(100vh - 52px);
        
        display: flex;
        justify-content: center;
        align-items: center;
    }

    /* 3. メインコンテンツ：500px固定 */
    .main-conte {
        flex: 0 0 500px;
        width: 500px;
        min-height: calc(100vh - 87px);
    }
	.menu-left {
		display: flex;
		align-items: center;
		gap: 10px;
	}
	.g-price02>div {
		display: flex;
		align-items: center;
	}
	.g-price02 img {
		width: 250px;
	}
}


@media (min-width: 1000px) {

    /* 中央：メインコンテンツ（固定幅500px） */
    .main-conte {
		flex: 0 0 500px;
        width: 500px;
        min-height: calc(100vh - 87px);
    }

    /* 左右：メニューとロゴ（残りの幅を等分） */
    .menu-left,
    .logo-content {
		flex: 1;
        position: sticky;
        
        /* 【重要】ヘッダーの高さ分、固定位置を下げます */
        top: 87px; 
        
        /* 【重要】画面全体の高さ(100vh)からヘッダーの87pxを引いた高さにする */
        height: calc(100vh - 87px);
        
        /* 中身を上下中央に配置 */
        display: flex;
        justify-content: center;
        align-items: center;
    }
	.menu-b-logo {
		display: none;
	}
	.logo-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
	}
	.logo-content>div {
		max-width: 184px;
	}
}