@charset "UTF-8";
/*=============================================================

	Date: 2026-09-17〜10-16
	CSS Document ： フェリシモ手帳プレゼントキャンペーン 本番

	【修正 2026-10-13】
	共通ヘッダーの「日本国内にお住まいの方はこちら」バナーが
	固定背景（#wrap-bg / position: fixed）に覆われて見えない問題を修正。
	背景グラデーションを #outer-te 自体の背景（background-attachment: fixed）に移し、
	#wrap-bg は非表示に変更。
	※修正箇所は「★修正」で検索してください。

=============================================================*/
/*------------------------------------

ベース

------------------------------------*/
.fsc_gfooter__breadcrumb {
		margin-top: 0;
		position: relative;
}
#footercontent .fsc_gfooter__breadcrumb {
		display: none;
}
#footercontent {
		/* position: relative;
		z-index: 1; */
}
body .pc {
		display: block !important;
}
body .sp {
		display: none !important;
}
body.fixed-body{
overflow: hidden;
}
/*------------------------------------

ベース

------------------------------------*/
#outer-te {
		width: 100%;
		overflow-x: hidden;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		position: relative;
		opacity: 0;
		/* ★修正：背景グラデーションを #outer-te 自体に持たせる
		   （fixed レイヤーがヘッダー・フッターに重ならないようにするため） */
		background: linear-gradient(120deg,
			#f6e9de 0%,
			#f7e5e4 25%,
			#eeeddc 50%,
			#f2f1e4 75%,
			#f7e5e4 100%
		) fixed;
}
#outer-te.load {
	animation: fade-simple 1s forwards 0.6s;
}
/* 背景 */
/* ★修正：position: fixed の背景レイヤーが画面最上部から全面に広がり、
   共通ヘッダーのバナーを覆っていたため非表示に変更。
   背景は上記 #outer-te の background で表示しています。 */
#wrap-bg {
	display: none;
	/*
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background: linear-gradient(120deg,
	#f6e9de 0%,
	#f7e5e4 25%,
	#eeeddc 50%,
	#f2f1e4 75%,
	#f7e5e4 100%
	);
	padding: 60px 0;
	*/
}
#wrap-bg.fixed-stop {
		top: auto;
		bottom: 0;
		position: absolute;
}
#wrapper {
	width: 100%;
    max-width: 2000px;
    margin: 0 auto;
    position: relative;
    text-align: center;
    line-height: 2.1;
    letter-spacing: 0.1em;
		font-size: 105%;
}
#wrapper img {
		max-width: 100%;
		height: auto;
}
#wrapper-inner {
	background: #fff9f3;
	padding: 0em 0 4.5em;
	width: 94%;
	margin: 0 auto;
	max-width: 1000px;
}
#wrapper-contents {font-family: "A1 Gothic R", "游ゴシック", "Yu Gothic", "YuGothic", "ヒラギノ角ゴ Pro W3", "ヒラギノ角ゴ W3", "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic", "メイリオ", "Meiryo", "Noto Sans", "Noto Sans CJK JP", "system-ui", sans-serif;}
@media (hover: hover) {
		#wrapper a {
				transition: all .3s;
		}
		#wrapper a:hover {
				text-decoration: none;
				opacity: .7;
		}
}


/*------------------------------------

ヘッダー

------------------------------------*/
#headerbox {
	background: #FFF;
}
#headerbox h1 {
	font-size: 70%;
	text-align: left;
	padding: 0.9em 0;
	margin: 0;
	width: 94%;
	margin: 0 auto;
	max-width: 1170px;
}
/*------------------------------------

タイトル

------------------------------------*/
#title {
	position: relative;
	background-color: #f5e8f2;
}
#title picture {
display: flex;
justify-content: center;
align-items: center;
}
#title .ttl-bg {
	max-width: none;
}
#title #title-inner {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}
#title #title-box {
	max-width: 1150px;
	margin: 0 auto;
	position: relative;
	height: 100%;
}
#title .top_ashirai01 {
position: absolute;
top: 0;
left: 0;
}
#title .top_ashirai02 {
position: absolute;
top: 21%;
right: 1.8%;
}
#title .top_ashirai03 {
position: absolute;
top: 60%;
left: -2%;
}
#title .ttl-text {
padding-top: 2.8em;
}

#title .ttl-point {
	max-width: 300px;
	top: 72%;
	right: -1.5%;
	position: absolute;
}
#title .ttl-point02 {
top: 36%;
left: 49em;
		position: absolute;
}
.ashirai {
position: absolute;
}
/* --- 初期状態：すべて非表示 --- */
#title .ttl-bg,
#title .top_ashirai01,
#title .top_ashirai02,
#title .top_ashirai03,
#title .ttl-text,
#title .ttl-point,
#title .ttl-point02 {
	opacity: 0;
}
/* --- ロード完了後に発火するアニメーション --- */
#outer-te.load #title .ttl-bg,
#outer-te.load #title .top_ashirai01,
#outer-te.load #title .top_ashirai02,
#outer-te.load #title .top_ashirai03 {
    animation: fadeInBase 2.5s ease forwards;
}

#outer-te.load #title .ttl-text {
    animation: fadeInUp 1.2s ease forwards;
    animation-delay: 0.5s; /* 背景・大枠より0.4秒遅らせて下から出す */
}

#outer-te.load #title .ttl-point02 {
	animation: fadeInUp02 0.8s ease forwards;
	animation-delay: 1.5s;
}
#outer-te.load #title .ttl-point  {
	animation: fadeInUp 0.8s ease forwards;
	animation-delay: 1s;
}
/* --- アニメーション定義 --- */
@keyframes fadeInBase {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@keyframes fadeInUp {
    0% {
        transform: translateY(20px);
        opacity: 0;
    }
    100% {
        transform: translateY(0);
        opacity: 1;
    }
}
@keyframes fadeInUp02 {
	0% {
			transform: translateY(10px);
			opacity: 0;
	}
	100% {
			transform: translateY(0);
			opacity: 1;
	}
}
/*------------------------------------

背景

------------------------------------*/
#wrapper_outer {
	background-image: url(../images/main_bk_on.webp);
	background-size: contain;
	background-repeat: repeat;
	background-position: center;
	width: 100%;
	/* background-attachment: fixed; */
	/* ↑固定する時 */
}

/*------------------------------------

見出し

------------------------------------*/
.c-ttl {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	gap: 1em;
	margin: 0 0 1.4em;
	position: relative;
}

.c-ttl h2 {
	font-family: "A1 Gothic M", "游ゴシック", "Yu Gothic", "YuGothic";
	font-size: 185%;
	font-weight: bold;
}


/*------------------------------------

メイン

------------------------------------*/
.main-contents {
	position: relative;
}
.main-contents > p {line-height:1.7;}
.main-contents p {
	color: #3f2710;
}
.orange-txt{color:#8676a3;}

/* ルビ */
[data-ruby] {
	position: relative;
}
[data-ruby]::before {
	content: attr(data-ruby);
	position: absolute;
	top: -1.6em;
	left: 0;
	right: 0;
	margin: auto;
	font-size: 0.5em;
	white-space: nowrap;
}
/*------------------------------------

見出し

------------------------------------*/
.c-ttl {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	gap: 1em;
	margin: 0 0 1.4em;
	position: relative;
}

.c-ttl h2 {
	font-family: "A1 Gothic M", "游ゴシック", "Yu Gothic", "YuGothic";
	font-size: 230%;
	font-weight: bold;
	color: #673a1b;
}
.c-ttl img {}
.c-ttl .ashirai01 {}
.c-ttl .ashirai02 {}

/*------------------------------------

お申し込み期間

------------------------------------*/
#due_date {
	margin: 5em 0 3em;
}
#due_date h2 {
color: #9b3f71;
}
#due_date .c-ttl {
	margin: 0 0 0.8em;
}
#due_date .c-ttl .ashirai01 {
	margin-top: -3.8em;
}
#due_date .c-ttl .ashirai02 {
	margin-top: 0.8em;
}
#due_date .due_date_wrap {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
#due_date .due_date_box {
	width: 720px;
	background-color: #f9ebef;
	border: 2px solid #9b3f71;
	border-radius: 0 0 30px 30px;
	margin-top: -3px;
}
#due_date .due_date_ttl {
	color: #fff;
	background-color: #9b3f71;
	font-size: 130%;
	line-height: 1.8em;
}
#due_date .due_date_te {
	margin: 1em auto;
	line-height: 1.6;
}
#due_date .due_date_te div {
	font-size: 170%;
	font-family: "A1 Gothic M";
color: #9b3f71;

}


/* 未ログイン ログインボタン表示 */
.login-btn {
}
.login-btn a {
	background: #4b2d16;
	border-radius: 3em;
	color: #FFF;
	font-size: 150%;
	font-weight: bold;
	display: block;
	width: max-content;
	margin: 1em auto 0.5em;
	padding: 0.6em 3em;
	line-height: 1.4;
	position: relative;
	}
	#due_date .due_date_te div span {
	font-size: 80%;
	line-height: 1.3;
	display: inline-block;
	/* margin-bottom: 1.5em; */
		}

		.login-btn a {
			background: #4b2d16;
			border-radius: 3em;
			color: #FFF;
			font-size: 150%;
			font-weight: bold;
			display: block;
			width: max-content;
			margin: 1em auto 0.5em;
			padding: 0.5em 3.4em;
			line-height: 1.4;
			position: relative; /* 矢印の位置基準にするため必須 */
		}

		.login-btn a::after {
			content: "";
			position: absolute;
			top: 50%;
			right: 1.5em;
			width: 10px;
			height: 10px;
			border-top: 2px solid #FFF;
			border-right: 2px solid #FFF;
			transform: translateY(-50%) rotate(45deg);
			transition: right 0.3s ease;
		}

		/* （おまけ）ホバー時に矢印が少し右に動く演出 */
		.login-btn a:hover::after {
			right: 1.2em;
		}

/* お申し込み期間あしらい */
#due_date  .due-ashirai01 {
	top: 42%;
	left: 12%;
}
#due_date  .due-ashirai02 {
	bottom: -8%;
	right: 12%;
}


/*------------------------------------

ショッピングバッグボタン用

------------------------------------*/
.shopping-btn {
	font-family: "游ゴシック", "Yu Gothic", "YuGothic", "ヒラギノ角ゴ Pro W3", "ヒラギノ角ゴ W3", "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic", "メイリオ", "Meiryo", "Noto Sans", "Noto Sans CJK JP", "system-ui", sans-serif;
	margin: 3em 0 auto;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	gap: 1em;
	}

	.shopping-btn .size {
	font-size: 110%;
	/* padding: 0.3em 1.1em; */
	position: relative;
	display: flex;
	align-items: center;
	/* margin: 2em 0; */
	background: #FFF;
	border: 1px solid #3f2710;
	border-radius: 0.3em;
	gap: 0.2em;
	font-weight: bold;
	letter-spacing: 0.1em;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	}
	.shopping-btn .size span:nth-child(1) {
	display: inline-block;
	/* width: 100%; */
	/* height: 100%; */
	/* content: 'タイプを選択'; */
	font-size: 110%;
	background: #3f2710;
	color: #FFF;
	padding: 0.3em 1em;
	}
	/*プルダウンの三角を設定*/
	.shopping-btn .size::after {
	position: absolute;
	right: 0.8em;
	content: '';
	width: 0.8em;
	height: 0.5em;
	background: #3f2710;
	clip-path: polygon(0 0, 100% 0, 50% 100%);
	}
	.shopping-btn .size select {
	/* width: 100%; */
	padding: 0 2em 0 1em;
	color: #3f2710;
	cursor: pointer;
	text-overflow: ellipsis; /*テキストがオーバーしたら'...'で省略*/
	z-index: 1;
	/* 標準のスタイルを無効にする */
	border: none;
	-webkit-appearance: none;
	 appearance: none;
	outline: none;
	background: transparent;
	font-family: "游ゴシック体 Pr6N D";
	}
	.shopping-btn .btn {
	/* display: block; */
	background: none;
	border: none;
	padding: 0;
	}
	.shopping-btn .btn button {
		background: #9b3f71;
    display: inline-block;
    border-radius: 3em;
    cursor: pointer;
    box-shadow: 3px 3px 0px #d7b2c6;
	color: #FFF;
	padding: 0.6em 4em 0.6em 1.8em;
	border: none;
	font-size: 110%;
	letter-spacing: 0.12em;
	outline: none;
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 0.5em;
	transition: all 0.3s;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-family: "A1 Gothic M", "游ゴシック", "Yu Gothic", "YuGothic";

	}

	.shopping-btn .btn button::before {
	display: block;
	width: 1em;
	height: 1em;
	content: '';
	background-image: url("../images/bag_icon.svg");
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	margin-right: 1.7em;
	}

	.shopping-btn .btn button:hover {
		opacity: 0.7;
		}

	.shopping-btn p {
	width: 90%;
	font-size: 100%;
	}
	.shopping-btn p.txt {}
	.shopping-btn p.txt_error {
	color: #d7053d;
	}


.check-entry-link {
    margin-top: 20px;
    margin-bottom: 40px;
    text-align: center;
}
.check-entry-link a {
	color: #3f2710;
	text-decoration: underline;
	font-weight: bold;
	font-size: 18px;
}
/*------------------------------------

キャンペーンの魅力

------------------------------------*/
#campaign {
	margin-top: 5em;
}
#campaign .c-ttl {
	gap: 0.2em;
}
/* #campaign .c-ttl h2 {
	font-size: 230%;
} */
#campaign .ashirai01 {
margin-top: -2em;
}
#campaign .ashirai02 {
margin-bottom: -1em;}

#campaign .point-list.point-list02 {
flex-direction: column;
align-items: center;
margin-top: 0;
}

#campaign .point-list.point-list02 .point-box {
	background: #FFF;
	border-radius: 2em;
	overflow: hidden;
	width: 85%;
	margin: 0 auto 2em;
	padding: 3.6em 2em 2em;
	position: relative;

}
#campaign .point-list.point-list02 .point-box::before {
	display: block;
	width: 100%;
	height: 100%;
	content: '';
	background: url(../images/c01_point_bg2.webp) no-repeat top;
	background-size: contain;
	position: absolute;
	top: 0;
	left: 0;
}
/* point03 */
#campaign .point-list .point03.point-box h3 {
margin-bottom: 0.8em;
}
#campaign .point-list.point-list02 .point_flex_box {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 2em;
}
#campaign .point-list.point-list02 .point_flex_box .point_flex_box1 {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 0.5em;
}
#campaign .point-list.point-list02 .point_flex_box .point_flex_box2 {
	position: relative;
}
#campaign .point-list.point-list02 .point_flex_box .point_flex_box2 .p3_ashirai03 {
	position: absolute;
	top: 1em;
	left: -1em;
}

/* point04 */
#campaign .point-list.point-list02 .point04_outer {
	position: relative;
	width: 100%;
	margin-bottom: 6em;
}
#campaign .point-list.point-list02 .point04_outer .p4_ashirai04 {
	position: absolute;
	top:-0.5em;
	left: 2.7em;
	z-index: 1;
	width: 15.5%;
}
#campaign .point-list.point-list02 .point-box.point04 {
	padding: 2.6em 2em 1.5em;
}
#campaign .point-list.point-list02 .point04 .point_flex_box .point_flex_box1 {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	margin-top: 1.8em;
}
#campaign .point-list.point-list02 .point04 .point_flex_box p.p4ttl_sub {
	font-size: 155%;
	color: #9d814f;
	line-height: 1.3em;
	letter-spacing: 2px;
	font-family: "A1 Gothic M";
	margin-bottom: -0.1em;
}
#campaign .point-list.point-list02 .point04 .point_flex_box p.p4ttl_sub span {
	font-size: 50%;
	letter-spacing: 0.1px;
}
#campaign .point-list.point-list02 .point04.point-box h3 {
	font-size: 210%;
	line-height: 1.2em;
	margin-bottom: 0.3em;
}
#campaign .point-list.point-list02 .point-box h3 .min-txt {
	font-size: 65%;
}

#campaign .point-list.point-list02 .point04 .point_flex_box p.due_date_red {
	color: #c21519;
	text-align: left;
	font-family: "游ゴシック体 Pr6N D";
	font-size: 90%;
	line-height: 1.8em;
	margin-bottom: 0;
	margin-top: 1em;
}
#campaign .point-list.point-list02 .point04 .point_flex_box p.due_date_red span.red_bg {
	font-size: 110%;
}
#campaign .point-list.point-list02 .point04 .point_flex_box p.p4_img_attend {
	font-size: 60%;
	color: #3f2710;
	margin-bottom: 0.5em;
}
#campaign .point-list.point-list02 .point04 .point_flex_box p.detail_wrap {
	font-size: 62%;
	text-align: left;
	color: #3f2710;
	padding: 1.3em ;
	background-color: #f1f1f1;
	margin-bottom: 0;
}
#campaign .point-list .point-box h3 span.c01_point04_line {
	background: linear-gradient(transparent 49%, #f0e2ea 50%);
	padding-bottom: 0.1em;
}

/*------------------------------------

キャンペーンの魅力 あしらい

------------------------------------*/
.main-contents .c01-ashirai01 {
	top: 30%;
	left: -4%;
	/* width: 10%; */
}
.main-contents .c01-ashirai02 {
	top: 80%;
	right: -5.5%;
	/* width: 9%; */
}

/*------------------------------------

フェリシモ手帳を手に入れるには？

------------------------------------*/
#chart {
	/* margin: -5em 0 5em; */
	margin: -5em 0 2em;
	padding-top: 5em;
}
#chart .c-ttl {
	background: #ac9379;
	color: #FFF;
	font-size: 110%;
	padding: 1.1em 0;
}
#chart .c-ttl h2 {
	margin: 0;
	color: #fff;
	font-size: 180%;
}
#chart .c-ttl .ashirai01 {
	position: absolute;
	bottom: 99%;
	left: auto;
}
#chart .chart01 {}
#chart .chart02 {}

/* --- ここから修正・追加 --- */
#chart .chart-txt {
	margin: 1em auto 1.5em;
	font-weight: bold;
	font-size: 110%;
	line-height: 1.8;
	font-family: "游ゴシック", "Yu Gothic", "YuGothic", "ヒラギノ角ゴ Pro W3", "ヒラギノ角ゴ W3", "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic", "メイリオ", "Meiryo", "Noto Sans", "Noto Sans CJK JP", "system-ui", sans-serif;
	text-align: left; /* 左揃え指定 */
	max-width: 680px; /* テキスト全体の幅を整える場合の設定（不要であれば削除可） */
}
#chart .chart-txt .big-txt {
	font-size: 140%;
	display: block;
	line-height: 1.5;
	margin-top: 1.5em;
	margin-bottom: 0.3em;
}
#chart .chart-txt .big-txt:first-child {
	margin-top: 0;
}

/* ぶら下げインデント設定 */
#chart .note-list {
	list-style: none;
	padding-left: 0;
	margin: 0.5em 0 1.5em 0;
}
#chart .note-list li {
	padding-left: 1em; /* 左側に1文字分の余白を作る */
	text-indent: -1em;  /* 1行目だけ1文字分左に戻す */
	margin-bottom: 0.4em;
	font-weight: normal; /* 注記部分は通常の太さにする場合 */
}
/*------------------------------------

お申し込み方法

------------------------------------*/
#entry {
	/* background: #f1f1f1; */
	/* padding: 3.8em 0 4.2em; */
	padding: 0em 0 4.2em;
}
#entry .c-ttl {
margin-bottom: 0.6em;
}
#entry .c-ttl h2 {
	color: #673a1b;
}
#entry .c-ttl .ashirai01 {
margin-top: -2em;
margin-right: -1em;
margin-left: 1em;
}
#entry .c-ttl .ashirai02 {}
#entry .midashi-txt {
	font-size: 130%;
	display: block;
	font-weight: bold;
	line-height: 1.5;
	margin: 0;
	font-family: "游ゴシック体 Pr6N D";
}
#entry .entry-box {
width: 77%;
margin: 1.3em auto 2.3em;
background: #FFF;
padding: 1.2em 1em 1.2em;
}
#entry .entry-box p {
	color: #df674e;
	font-weight: bold;
	font-size: 191%;
	font-family: "游ゴシック", "Yu Gothic", "YuGothic", "ヒラギノ角ゴ Pro W3", "ヒラギノ角ゴ W3", "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic", "メイリオ", "Meiryo", "Noto Sans", "Noto Sans CJK JP", "system-ui", sans-serif;
}
#entry .entry-box img {}
#entry .entry-box img.entry01 {
	margin-bottom: 0.5em;
}
#entry .entry-box img.entry02 {}
.atten-btn {
	color: #3f2710;
	font-weight: bold;
	position: relative;
	background: #FFF;
	padding: 0.2em 2.9em;
	border: 1px solid #3f2710;
	display: inline-block;
	font-size: 120%;
	transition: all 0.3s;
	cursor: pointer;
	box-shadow: 3px 3px 0px #666666;
	font-family: "游ゴシック", "Yu Gothic", "YuGothic", "ヒラギノ角ゴ Pro W3", "ヒラギノ角ゴ W3", "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic", "メイリオ", "Meiryo", "Noto Sans", "Noto Sans CJK JP", "system-ui", sans-serif;
}
.atten-btn::after {
	display: block;
	width: 0.5em;
	height: 100%;
	content: '';
	background: url("../images/atten_arrow.webp") no-repeat center;
	background-size: contain;
	position: absolute;
	top: 0;
	right: 1.2em;
	transition: all 0.3s;
}
.atten-btn:hover {
	background: #fefae6;
}
.atten-btn:hover::after {
	right: 0.9em;
	background-size: contain;
}
/* 注意事項中身 */
.detail-overlay {
	display: none;
	width: 100%;
	height: 100%;
	margin-left: 0;
	padding: 0;
	text-align: center;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 209000;
	background: rgba(0, 0, 0, 0.25);
}
.overlay-inner {
	width: 80%;
	max-width: 920px;
	display: flex;
	margin: 0 auto;
	justify-content: center;
	align-items: center;
	position: relative;
}
.overlay-contents {
	margin: 5vh auto;
	vertical-align: middle;
	background: #FFF;
	max-height: 90vh;
	overflow-y: scroll;
	padding: 4em 6em;
	position: relative;
	text-align: justify;
	line-height: 1.6;
	font-size: 88%;
	letter-spacing: 0.03em;
	font-family: "游ゴシック", "Yu Gothic", "YuGothic", "ヒラギノ角ゴ Pro W3", "ヒラギノ角ゴ W3", "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic", "メイリオ", "Meiryo", "Noto Sans", "Noto Sans CJK JP", "system-ui", sans-serif;
}
.overlay-inner::after {
	display: block;
	width: 1.5em;
	height: 1.5em;
	content: '';
	background: url("../images/close.png") no-repeat center;
	background-size: contain;
	position: absolute;
	top: 96px;
	right: 2em;
	z-index: 100;
	cursor: pointer;
}
.overlay-contents p {}
.overlay-contents .midashi {
	font-weight: bold;
	font-size: 130%;
	border-bottom: 2px solid #000;
}
.overlay-contents .red_te {
	color: #d62c66;
	font-weight: bold;
}
.overlay-contents .indent-box {}
.overlay-contents .indent-box p {
	margin: 0;
	text-indent: -1em;
	padding-left: 1em;
	line-height: 1.8;
}
.overlay-contents .indent-box p.campaign_num {
	text-align: right;
}
/* ショッピングバッグボタン */

.shopping_bag-btn {
	display: block;
	margin: 3em auto 0;
}
.shopping_bag-btn span {
	color: #fff;
	font-weight: bold;
	position: relative;
	background: #9b3f71;
	padding: 0.5em 2.7em;
	display: inline-block;
	border-radius: 3em;
	font-size: 130%;
	letter-spacing: 3px;
	transition: all 0.3s;
	cursor: pointer;
	box-shadow: 3px 3px 0px #d7b2c6;
	font-family: "游ゴシック", "Yu Gothic", "YuGothic", "ヒラギノ角ゴ Pro W3", "ヒラギノ角ゴ W3", "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic", "メイリオ", "Meiryo", "Noto Sans", "Noto Sans CJK JP", "system-ui", sans-serif;
}
.shopping_bag-btn span::after {
	display: block;
	width: 0.5em;
	height: 100%;
	content: '';
	background: url("../images/shopping_gag_arrow.webp") no-repeat center;
	background-size: contain;
	position: absolute;
	top: 0;
	right: 1.2em;
	transition: all 0.3s;
}
.shopping_bag-btn span:hover {
opacity: 1;
}
.shopping_bag-btn span:hover::after {
	right: 0.9em;
	background-size: contain;
}


/*------------------------------------

リード

------------------------------------*/
#lead {
	padding-top: 4em;
	margin: 0em 0 2em;
}
#lead .c-ttl {
font-size:115%;
margin:0 0 0.8em;
}
#lead .c-ttl.midashi {
	margin-bottom: -0.7em;
}
#lead p {
	text-align: justify;
	margin: 0 auto;
	text-align: center;
	color: #3f2710;
	font-family: "A1 Gothic R", "游ゴシック", "Yu Gothic", "YuGothic";
	line-height: 2em;
    letter-spacing: 0.11em;
}
#lead.top_lead {
	padding-top: 2em;
	margin: 0 auto 1em;
}
#lead.top_lead p {
	font-size: 115%;
	letter-spacing: 2.6px;
	line-height: 1.9em;
}
#lead .c-ttl {
margin: 0 auto 1.2em;
position: relative;
}
#lead .c-ttl h2 {
font-family: "A1 Gothic R", "游ゴシック", "Yu Gothic", "YuGothic";
font-size: 230%;
font-weight: bold;
color: #9b3f71;
line-height: 1.2em;
margin: 0 auto;
}
#lead .c-ttl h2 .big-txt {
font-size: 110%;
font-family: "解ミン 月 B JIS2004 AP";
}
#lead .min-txt {
font-size:70%;
}
#lead .c-ttl .ashirai01 {
	position: absolute;
	top: 65%;
	left: 9%;
}
#lead .c-ttl .ashirai02 {
	position: absolute;
	top: 17%;
	right: 13%;
}
/* あしらい */
.main-contents .lead_ashirai1 {
	bottom: -3%;
	left: 14%;
}
.main-contents .lead_ashirai2 {
	top: 62%;
	right: 12%;
}

/*------------------------------------

2027年のフェリシモ手帳

------------------------------------*/
#c01 {
	margin: 4em 0 3em;
}
#c01 .c-ttl {
	color: #673a1b;
	/* display: block; */
	/* margin-bottom: 0.6em; */
	align-items: flex-end;
}
#c01 .c-ttl .ashirai01 {
	position: absolute;
	top: 59%;
	left: 13.6%;
}
#c01 .c-ttl .ashirai02 {
		position: absolute;
    top: 41%;
    right: 12.8%;
}
#c01 .c-ttl h2 {
	font-family: "秀英角ゴシック銀 B";
	font-size: 268%;
	letter-spacing: 0.1em;
	/* width: 100%; */
	line-height: 1.5;
	display: block;
	/* margin: 0 auto; */
	margin-bottom: -0.7em;
	width: 13.4em;
}
#c01 .c-ttl .sub-ttl {
	font-family: "秀英角ゴシック銀 B";
	font-size: 158%;
}
#c01 .dash {
	letter-spacing: -0.05em;
}
.point-list {
	display: flex;
	justify-content: center;
	align-items: stretch;
	flex-wrap: wrap;
	gap: 5%;
	margin: 3.0em 0 0;
}
.point-list .point-box {
	background: #FFF;
	border-radius: 2em;
	overflow: hidden;
	width: 40%;
	margin: 0 0 2em;
	padding: 3em 1em 0.5em;
	position: relative;
}
.point-list .point-box::before {
	display: block;
	width: 100%;
	height: 100%;
	content: '';
	background: url(../images/c01_point_bg.webp) no-repeat top;
	background-size: contain;
	position: absolute;
	top: 0;
	left: 0;
}
.point-list .point-box h3 {
	color: #9b3f71;
	font-weight: bold;
	font-size: 140%;
	position: relative;
	line-height: 1.3;
	font-family: "A1 Gothic M", "游ゴシック", "Yu Gothic", "YuGothic";
}
.point-list .point-box h3 span.min-txt {
font-size:80%;
}
#c01 .point-list .point01.point-box h3 span.min-txt {
	display: inline-block;
	line-height: 1.3;
}
.point-list .point-box p {
	position: relative;
	text-align: center;
	line-height: 1.53;
	font-size: 84%;
	letter-spacing: 0.05em;
	margin-bottom: 0.2em;
}
#c01 .point-list .point01.point-box p {
	font-size: 75%;
	line-height: 0.8;
	margin-bottom: 1.3em;
}
/*------------------------------------

2027年のフェリシモ手帳 あしらい

------------------------------------*/
.main-contents .pre-ashirai02 {
	top: 33%;
	left: -4%;
	width: 7%;
}
.main-contents .pre-ashirai03 {
	bottom: 11%;
	right: -5.5%;
	width: 9%;
}

/*------------------------------------

選べる3種からプレゼント！

------------------------------------*/
#select_nav {
		padding: 4em 0 6em;
}
#select_nav .c-ttl h2 {
		color: #673a1b;
}
#select_nav .c-ttl .ashirai01 {
	margin-top: -3em;
	margin-right: -2em;
	margin-left: 2em;
}
#select_nav .c-ttl .ashirai02 {
		margin-top: -1em;
}
#select_nav .nav-list {
		display: flex;
		justify-content: center;
		align-items: center;
		gap: 4%;
}
#select_nav .nav-list .nav-box {
		background: #FFF;
		display: block;
		border-radius: 50%;
}
#select_nav .nav-list .nav-box:nth-child(1) {}
#select_nav .nav-list .nav-box:nth-child(2) {}
#select_nav .nav-list .nav-box:nth-child(3) {}
#select_nav .nav-list .nav-box:hover {
		opacity: 1;
}
#select_nav .nav-list .nav-box:nth-child(1):hover {
		background: #f6e5e7;
}
#select_nav .nav-list .nav-box:nth-child(2):hover {
		background: #e3ede4;
}
#select_nav .nav-list .nav-box:nth-child(3):hover {
		background: #e8e7f0;
}
/*------------------------------------

各手帳紹介

------------------------------------*/
#category-wrap {
		font-weight: bold;
}
/* 手帳タイトル */
.techo-ttl {
		color: #FFF;
		min-height: 145px;
		display: flex;
		justify-content: center;
		align-items: center;
		position: relative;
		margin: 0 0 3.5em;
		padding: 1em 0 1.2em;
}
.techo-ttl h3 {
		font-weight: bold;
		margin: 0.1em 0 0;
		font-family: "A1 Gothic M", "游ゴシック", "Yu Gothic", "YuGothic";
}
.techo-ttl h3 .sub-ttl {
	font-size: 94%;
	line-height: 1;
	display: block;
	margin: 0 0 0.3em;
}
.techo-ttl h3 .main-ttl {
		display: block;
		font-size: 112%;
}
.techo-ttl h3 .big-ttl {
		font-size: 160%;
}
.techo-ttl .techo-icon {
	position: absolute;
	top: 0%;
	right: 2em;
	width: 17.5%;
}
#category-wrap .main-contents {
		padding: 0 0 7em;
}
#category-wrap .slick-wrap {
		width: 90%;
		margin: 0 auto;
}
#category-wrap .slick-wrap .splide__track {
    overflow: inherit;
}
#category-wrap .slick-wrap .splide__slide {}
#category-wrap .slick-wrap img {}
#category-wrap p {
		line-height: 1.55;
		font-size: 122%;
		margin: 1em 0 0;
		font-family: "A1 Gothic M", "游ゴシック", "Yu Gothic", "YuGothic";
}

#category-wrap .splide__slide p span.text_bg {
	font-family: "A1 Gothic B";
}
/* 個別 */
#log {
		background: #faf1f2;
}
#log .techo-ttl {
		background: #cb8b9d;
}
#log .techo-ttl h3 {
		margin-top: 0.5em;
}
#log .techo-ttl .ashirai01 {
	position: absolute;
	top: 51%;
	left: -5%;
}
#log .techo-ttl .ashirai02 {
	position: absolute;
	top: 3%;
	right: -2%;
}
#log p {
		color: #ba4d6e;
}
#category-wrap #log .splide__slide p span.text_bg {
	color: #ba4d6e;
	font-size: 120%;
}
#log .prev-arrow {
		background-image: url(../images/log_arrow_l.svg);
}
#log .next-arrow {
		background-image: url(../images/log_arrow_r.svg);
}
#log .slick-dots li.slick-active button:before {
		background: #ba4d6e;
}
/* compact */
#compact {
		background: #f0f5f0;
}
#compact .techo-ttl {
		background: #73a67a;
}
#compact .techo-ttl .ashirai01 {
	position: absolute;
	top: -10%;
	left: -5.5%;
}
#compact .techo-ttl .ashirai02 {
	position: absolute;
	top: 71%;
	right: -3%;
}
#compact p {
		color: #55875a;
}
#category-wrap #compact .splide__slide p span.text_bg {
	color: #55875a;
	font-size: 120%;
}
#compact .prev-arrow {
		background-image: url(../images/compact_arrow_l.svg);
}
#compact .next-arrow {
		background-image: url(../images/compact_arrow_r.svg);
}
#compact .slick-dots li.slick-active button:before {
		background: #55875a;
}
#category-wrap #display {
		background: #f2f2f7;
		padding-bottom: 4em;
		margin-bottom: 4em;
}
/* display */
#display .techo-ttl {
		background: #8a87b4;
}
#display .techo-ttl .ashirai01 {
	position: absolute;
	top: 66%;
	left: -5%;
}
#display .techo-ttl .ashirai02 {
	position: absolute;
	top: -17%;
	right: -3%;
}
#display .techo-ttl .ashirai03 {
	position: absolute;
	top: -13%;
	left: 20%;
}
#display .techo-ttl h3 .big-ttl {
	font-size: 140%;
}

#display p {
		color: #6969a8;
}
#category-wrap #display .splide__slide p span.text_bg {
	color: #6969a8;
	font-size: 120%;
}

#category-wrap .splide__slide p span {
	color: #4d4d4d;
	font-size: 70%;
}

#display .prev-arrow {
		background-image: url(../images/display_arrow_l.svg);
}
#display .next-arrow {
		background-image: url(../images/display_arrow_r.svg);
}
#display .slick-dots li.slick-active button:before {
		background: #8a87b4;
}

/*------------------------------------

フェリシモ手帳の魅力を動画でチェック！

------------------------------------*/

/* 動画 */
#movie {
	padding: 3em 0 4em;
}
#movie .c-ttl {
	font-size: 90%;
	align-items: flex-end;
	margin: 0 0 0.7em;
}
#movie .c-ttl h2 {
	font-family: "秀英角ゴシック銀 B";
	color: #673a1b;
	font-size: 180%;
	line-height: 1.3;
}
#movie .c-ttl h2 span {
	font-size: 78%;
	letter-spacing: 1px;
}
#movie .c-ttl::before, #movie .c-ttl::after {
	display: block;
	width: 2px;
	height: 4.4em;
	margin: 0 0.4em 0.5em;
	background: #673a1b;
	content: '';
	transform: rotate(-24deg);
}
#movie .c-ttl::after {
	transform: rotate(24deg);
}

#movie .movie-box {
width: 40%;
aspect-ratio: 4.8 / 9;
margin: 0 auto;
/* height: 0; */
}

/*------------------------------------

#recommend

------------------------------------*/
#recommend {
		margin: 5em auto;
		display: flex;
		justify-content: center;
		align-items: center;
		flex-wrap: wrap;
		gap: 4%;
}
#recommend a {
}
#recommend a img {}


/*==================================

ページトップへ

==================================*/
.pageTop {
	position: relative;
	height: 0;
	margin: 0 auto;
	max-width: 1000px;
	width: 100%;
	z-index: 10000;
    display: none;
}
.pageTop a {
	position: fixed;
    bottom: 15px;
    right: 20px;
	left: auto;
	display: block;
	width: 80px;
	height: 80px;
	padding-bottom: 10px;
	background-image: url(../images/pagetop.webp);
	background-repeat: no-repeat;
	background-size: contain;
	z-index: 10000;
    transition: all 0.3s;

}
.pageTop a:hover {
    bottom: 20px;
    background-repeat: no-repeat;
}

@media (min-width: 768px) {
	.pageTop a:hover {
		bottom: 20px;
		opacity: 1.0;
	}
}
@media (max-width: 768px) {
	.pageTop a {
		right: 10px;
		bottom: 25px;
		width: 13vw;
		height: 13vw;
	}
}



/*------------------------------------

スライド ページネーション

------------------------------------*/
.splide__pagination {
		bottom: -2.2em;
		left: 0;
		padding: 0 1em;
		position: absolute;
		/* right: 0.5em; */
		z-index: 1;
		/* justify-content: flex-end; */
}
.splide__pagination__page {
		background: #d8d8d8;
		/* border: 1px solid #959596; */
		border-radius: 50%;
		display: inline-block;
		width: 0.7em;
		height: 0.7em;
		margin: 0 0.4em;
		opacity: 1;
		padding: 0;
		position: relative;
		transition: transform .2s linear;
}
.splide__pagination__page.is-active {
		background: #cd851e;
		transform: scale(1);
		z-index: 1
}
.splide__pagination__page:hover {
		cursor: pointer;
		opacity: .9
}
.splide__pagination__page:focus-visible {
		outline: none;
		outline-offset: none
}
.splide.is-focus-in .splide__pagination__page:focus {
		outline: none;
		outline-offset: none;
}
.splide *:focus {
		outline: none;
}
/* スライダー用 矢印 */
.splide__arrow {
		box-sizing: initial;
		width: 3em;
		height: 2.5em;
		transition: all .3s;
		opacity: 1;
		outline: none;
		background: none;
		top: 40%;
}
.splide__arrow img {
		width: 100%;
}
.splide__arrow--prev {
		left: -1.1em;
		padding-right: 2.5em;
}
.splide__arrow--next {
		right: -1.1em;
		padding-left: 2.5em;
}
/* hover */
@media (hover: hover) and (min-width: 769px) {
		.staple-links_lv a:hover {
				opacity: .7;
		}
		.splide__arrow--prev:hover {
				left: -1.5em;
				padding-right: 2.5em;
		}
		.splide__arrow--next:hover {
				right: -1.5em;
				padding-left: 2.5em;
		}
}
/*------------------------------------

アニメーション

 ------------------------------------*/
.fade_te {
		opacity: 0;
}
.fade_te.on {
		animation: fadeIn 0.5s forwards 0s;
}
@keyframes fade-simple {
		0% {
				opacity: 0;
		}
		100% {
				opacity: 1;
		}
}
@keyframes fadeIn {
		0% {
				transform: translateY(2em);
				opacity: 0;
		}
		100% {
				transform: translateY(0);
				opacity: 1;
		}
}
@keyframes fadeLeft {
		0% {
				transform: translateX(-15px);
				opacity: 0;
		}
		100% {
				transform: translateX(0);
				opacity: 1;
		}
}
@keyframes fadeRight {
		0% {
				transform: translateX(15px);
				opacity: 0;
		}
		100% {
				transform: translateX(0);
				opacity: 1;
		}
}
@media (max-width: 1000px) {
		#wrapper {
				font-size: 1.7vw;
		}
		.techo-ttl h3 {
				font-size: 3.2vw;
		}
		.techo-ttl .techo-icon {
				top: 40%;
		}
		#campaign .point-list.point-list02 .point04.point-box h3 {
			font-size: 2.8vw;
	}

}
/*------------------------------------

SP

------------------------------------*/
@media (max-width: 980px) {

}
/*------------------------------------

SP

------------------------------------*/
@media (max-width: 768px) {
		body .pc {
				display: none !important;
		}
		body .sp {
				display: block !important;
		}
		#wrapper p {
			font-size: 3.2vw;
		}
		/*------------------------------------

タイトルエリア

------------------------------------*/
		/* 背景 */
		#wrap-bg {
				/* background: #fefae6; */
		}
		#wrapper {
				font-size: 3.4vw;
				width: 100%;
		}
		#wrapper img {}
		#wrapper-inner {
			padding: 2.8em 0 5.5em;
			width: 100%;
	}


			/*------------------------------------

ヘッダー

------------------------------------*/
		#headerbox {}
		#headerbox h1 {
				padding-left: 0.8em;
				background: #FFF;
		}
		/*------------------------------------

タイトル

------------------------------------*/
#title {}

#title .ttl-bg {
		max-width: none;
		width: 100%;
		margin: 0%;
}
#title .ttl-text {
		width: 100%;
		padding-top: 1.5em;
	}
#title .ttl-text img {
	width: 90%;
}
#title .ttl-point {
	width: 41%;
	top: 74%;
	right: 1%;
}
#title .pre-ashirai01 {
		top: -6%;
		right: -5%;
}
#title .pre-ashirai02 {
		top: 18%;
		right: -2%;
}
#title .pre-ashirai03 {
		left: -1%;
		top: 87%;
}
#title .pre-ashirai04 {
		left: -2%;
		top: 97%;
}
#title .ttl-point02 {
	width: 23%;
	top: 31%;
	left: 22.9em;
}

	/*------------------------------------

メイン

------------------------------------*/
		.main-contents {}
		.main-contents p {}
		/* ルビ */
		[data-ruby] {}
		[data-ruby]::before {}
/*------------------------------------

見出し

------------------------------------*/
.c-ttl {
	margin: 0 0 0.8em;
}
.c-ttl h2 {font-size: 170%;}
.c-ttl img { }
.c-ttl .ashirai01 {width: 3.0em;}
.c-ttl .ashirai02 { width: 3.0em;}

/*------------------------------------

リード

------------------------------------*/
#lead {}
#lead .c-ttl.midashi {
	margin-bottom: 0em;
}
#lead .c-ttl {
	font-size: 85%;
}
	#lead p {
	}
	#lead.top_lead p {
font-size: 3.2vw;
letter-spacing: 2px;
}
	/*------------------------------------

申し込み期間

------------------------------------*/
#due_date .due_date_box {
	width: 100%;
    border: 0.1em solid #9b3f71;
    border-radius: 0 0 1.2em 1.2em;
}
#due_date .due_date_te div {
	font-size: 4.7vw;
}
#due_date .due_date_wrap {
	width: 97%;
	margin: 0 auto;
}
#due_date {
	margin: 5em auto ;
}
#due_date .due-ashirai01 {
	top: 37%;
	left: 1%;
	width: 13%;
}
#due_date .due-ashirai02 {
	bottom: -10%;
	right: 4%;
	width: 15%;
}
#due_date .c-ttl .ashirai01 {
	margin-right: -1.3em;
}
#due_date .c-ttl .ashirai02 {
	margin-left: -0.5em;
}
#due_date .nav-list {gap: 4%;}
#due_date .nav-list .nav-box {width: 48%;margin-bottom: 3.5%;border-width: 2px;}
#due_date .nav-list .nav-box::after { }
.login-btn a {
	font-size: 4.3vw;
}

.shopping-btn .btn button {
	margin: 0.4em auto;
	font-size: 4.5vw;
}
/*------------------------------------

キャンペーンの魅力

------------------------------------*/
#campaign .point-list.point-list02 .point-box::before {
	display: block;
	width: 100%;
	height: 100%;
	content: '';
	background: url(../images/c01_point_bg.webp) no-repeat top;
	background-size: contain;
	position: absolute;
	top: 0;
	left: 0;
}
#campaign .point-list.point-list02 .point_flex_box {
	gap: 2em;
	flex-direction: column;
}
#campaign .point-list.point-list02 .point-box {
	padding: 3.6em 1.2em 1.2em;

}
#campaign .point-list.point-list02 .point03 .point_flex_box p {
	margin-bottom: 1em;
}
#campaign .point-list.point-list02 .point03 .point_flex_box1 img {
	width: 80%;
}


#campaign .point-list.point-list02 .point04_outer .p4_ashirai04 {
	position: absolute;
	top: -1em;
	left: -0.1em;
	width: 29%;
	z-index: 1;
}
#campaign .point-list.point-list02 .point04 .point_flex_box p.p4ttl_sub {
	font-size: 4.6vw;
}
#campaign .point-list.point-list02 .point-box h3 .min-txt {
	font-size: 3.9vw;
	letter-spacing: 1.2px;
}
#campaign .point-list.point-list02 .point04.point-box h3 {
	font-size: 6.4vw;
}
#campaign .point-list.point-list02 .point04 .point_flex_box {
	gap: 1em;
}
#campaign .point-list.point-list02 .point04 .point_flex_box p.due_date_red {
	margin-top: 1em;
	font-size: 2.6vw;
}
.main-contents .c01-ashirai01 {
	top: 30%;
	left: 0%;
	width: 17%;
}
.main-contents .c01-ashirai02 {
	top: 77%;
	right: -1.5%;
	width: 17%;
}
/*------------------------------------

フェリシモ手帳を手に入れるには？

------------------------------------*/
#chart { }
#chart .c-ttl { }
#chart .c-ttl h2 {
	font-size: 6vw;
}
#chart .c-ttl .ashirai01 {width: 28%;}
#chart .chart01 { }
#chart .chart02 {margin-left: 1%;}
#chart .chart-txt {
	font-size: 3.3vw;
}
#chart .chart-txt .big-txt { }
.techo-buy {width: 90%;}
.techo-buy p {font-size: 111%;}
.techo-buy .spec-btn {font-size: 93%;}
.techo-buy .spec-btn::after { }
.techo-buy a.spec-btn.buy { }
.techo-buy a.spec-btn.merry { }
/*------------------------------------

お申し込み方法

------------------------------------*/
#entry { }
#entry .c-ttl { }
#entry .c-ttl h2 {font-size: 215%;}
#entry .c-ttl .ashirai01 { }
#entry .c-ttl .ashirai02 { }
#entry .midashi-txt {font-size: 114%;}
#entry .entry-box {
	width: 87%;
}
#entry .entry-box p {font-size: 153%;}
#entry .entry-box img { }
#entry .entry-box img.entry01 { }
#entry .entry-box img.entry02 { }
.atten-btn {font-size: 116%;}
.atten-btn::after { }
/* 注意事項中身 */
.detail-overlay { }
.overlay-inner {width: 90%;}
.overlay-contents {
	padding: 2em 2em 5em 2em;
}
.overlay-inner::after {top: 14vw;right: 6vw;}
.overlay-contents p { }
.overlay-contents .midashi { }
.overlay-contents .red_te { }
.overlay-contents .indent-box { }
.overlay-contents .indent-box p { }
.overlay-contents .indent-box p.campaign_num { }

	/* ショッピングバッグ */
	.shopping_bag-btn span {
		font-size: 4vw;
	}


/*------------------------------------

2027年のテーマ リード

------------------------------------*/
#lead .c-ttl .ashirai01 {
	position: absolute;
	top: 75%;
	left: -3%;
	width: 17%;
	z-index: -1;
}
#lead .c-ttl .ashirai02 {
	position: absolute;
	top: 12%;
	right: -3%;
	width: 13%;
}
.main-contents .lead_ashirai1 {
	bottom: -9%;
	left: -4%;
	width: 15%;
}
.main-contents .lead_ashirai2 {
	top: 62%;
	right: -4%;
	width: 15%;
}
#lead .c-ttl h2 img.midashi_ttl {
	width: 95%;
}

/*------------------------------------

あしらいライン flex

------------------------------------*/
#ashirai_wrap .ashirai_flex_inner img {
	width: 11vw;
}

/*------------------------------------

2027年のフェリシモ手帳

------------------------------------*/
#c01 {
	margin: 4.5em 0 0;
}
#c01 .c-ttl {}
#c01 .c-ttl .ashirai01 {
		width: 14%;
		top: 144%;
		left: 0%;
		z-index: 1;
}
#c01 .c-ttl .ashirai02 {
		width: 15%;
		top: -17%;
		right: 1%;
}
#c01 .c-ttl h2 {
		font-size: 203%;
}
#c01 .c-ttl .sub-ttl {
		font-size: 135%;
}
#c01 .dash {}
.point-list {
	margin: 2em 0 0;
}
.point-list .point-box {
		width: 85%;
}
.point-list .point-box::before {}
.point-list .point-box h3 {
font-size: 146%;
}
.point-list .point-box p {
		font-size: 98%;
}
#c01 .point-list {}
#c01 .point-list img {
		width: 100%;
}

/*------------------------------------

予告 あしらい

------------------------------------*/
.main-contents .pre-ashirai02 {
	top: 30%;
	left: -2%;
	width: 16%;
}
.main-contents .pre-ashirai03 {
	bottom: 0%;
	right: -4%;
	width: 17%;
}

/*------------------------------------

選べる3種からプレゼント！

------------------------------------*/
#select_nav {padding: 4em 0 4em;}
	#select_nav .c-ttl {margin-bottom:0.3em;}
#select_nav .c-ttl h2 {font-size: 195%;}
#select_nav .c-ttl .ashirai01 {
	margin-top: -5em;
	margin-right: -2em;
	margin-left: 1em;
	width: 20%;
}
#select_nav .c-ttl .ashirai02 {
margin-left: -0.8em;
margin-top: 0em;
width: 14%;
}
#select_nav .nav-list {width: 94%;margin: 0 auto;gap: 2%;}
#select_nav .nav-list .nav-box { }
#select_nav .nav-list .nav-box:nth-child(1) { }
#select_nav .nav-list .nav-box:nth-child(2) { }
#select_nav .nav-list .nav-box:nth-child(3) { }

/*------------------------------------

各手帳紹介

------------------------------------*/
#category-wrap { }
/* 手帳タイトル */
.techo-ttl {
	min-height: auto;
	padding: 1.3em 0 1.4em;
	margin: 0 0 4.0em;
}
.techo-ttl h3 {font-size: 5.2vw;}
.techo-ttl h3 .sub-ttl { }
.techo-ttl h3 .main-ttl { }
.techo-ttl h3 .big-ttl {
	font-size: 142%;
}
#display .techo-ttl h3 .big-ttl {
	font-size: 130%;
}
.techo-ttl .techo-icon {right: 0%;width: 24%;}
#category-wrap .main-contents { }
#category-wrap .slick-wrap {width: 98%;}
#category-wrap .slick-wrap .splide__track { }
#category-wrap .slick-wrap .splide__slide { }
#category-wrap .slick-wrap img { }
#category-wrap p {font-size: 100%;}
/* 個別 */
#log { }
#log .techo-ttl { }
#log .techo-ttl h3 {
    margin-top: 0;
}
#log .techo-ttl h3 .sub-ttl {
    line-height: 1.8;
}
#log .techo-ttl .techo-icon {
}
#log .techo-ttl .ashirai01 {
	top: 67%;
	left: -5%;
	width: 26%;
}
#log .techo-ttl .ashirai02 {
	top: -17%;
	right: 1%;
}
#log p { }
#log .splide__pagination__page.is-active { }


#compact { }
#compact .techo-ttl { }
#compact .techo-ttl .ashirai01 {
	top: -21%;
	left: -7%;
	width: 37%;
}
#compact .techo-ttl .ashirai02 {
	top: 89%;
	right: -1%;
	width: 17%;
}
#compact .techo-ttl .techo-icon {
top: 19%;
}
#compact p { }
#compact .splide__pagination__page.is-active { }
#category-wrap #display { }
#display .techo-ttl { }
#display .techo-ttl .ashirai01 {
	top: 63%;
	left: -7%;
	width: 25%;
}
#display .techo-ttl .ashirai02 {
	top: -25%;
	right: -5%;
	width: 23%;
}


#display p { }
#display .splide__pagination__page.is-active { }
#display .techo-ttl .ashirai03 {
	position: absolute;
	top: -20%;
	left: 3%;
	width: 21%;
}
#category-wrap .splide__slide p span.text_bg {
	font-size: 4.4vw !important;
	line-height: 1.2;
	display: block;
	margin-bottom: -0.7em;
}
/*------------------------------------

フェリシモ手帳の魅力を動画でチェック！

------------------------------------*/
#movie .movie-box {
	width: 70%;
	margin: 0 auto;
	/* height: 0; */
}
#movie .c-ttl {
	font-size: 87%;
	align-items: flex-end;
	margin: 0 0 0.7em;
}
#movie .c-ttl::before, #movie .c-ttl::after {
	margin: 0 -0.2em 0.5em;
}
/*------------------------------------

#recommend

------------------------------------*/
#recommend { }
#recommend a {width: 85%;}
#recommend a img { }
	/*------------------------------------

スライド ページネーション

------------------------------------*/
.splide__pagination { }
.splide__pagination__page { }
.splide__pagination__page.is-active { }
.splide__pagination__page:focus-visible { }
.splide.is-focus-in .splide__pagination__page:focus { }
.splide *:focus { }
/* スライダー用 矢印 */
.splide__arrow {top: 32vw;width: 7vw;height: 2.5em;}
.splide__arrow img { }
.splide__arrow--prev { left: -0.2em;}
.splide__arrow--next {right: -0.2em;}


}

/*==================================

コンテンツアセット呼び出し
キャンペーンバナー

==================================*/
#campaign-footer-bnr {}
#campaign-footer-bnr .c-ttl {
		font-size: 90%;
		align-items: flex-end;
		margin: 0 0 1.0em;
}
#campaign-footer-bnr .c-ttl h2 {
	font-family: "秀英角ゴシック銀 B";
	color: #673a1b;
	font-size: 180%;
}
#campaign-footer-bnr .c-ttl::before, #campaign-footer-bnr .c-ttl::after {
		display: block;
		width: 2px;
		height: 4.4em;
		margin: 0 0.6em 0.5em;
		background: #673a1b;
		content: '';
		transform: rotate(-31deg);
}
#campaign-footer-bnr .c-ttl::after {
		transform: rotate(31deg);
}
#campaign-footer-bnr .campaign-footer-box {
		display: flex;
		justify-content: center;
		align-items: center;
		gap: 4%;
		width: 90%;
		margin: 0 auto;
		flex-wrap: wrap;
}
#campaign-footer-bnr .campaign-footer-box a {
		width: 48%;
}
#campaign-footer-bnr .campaign-footer-box a img {}
/*------------------------------------

SP

------------------------------------*/
@media (max-width: 768px) {
		#campaign-footer-bnr {}
		#campaign-footer-bnr .c-ttl {
				font-size: 80%;
		}
		#campaign-footer-bnr .c-ttl::before, #campaign-footer-bnr .c-ttl::after {}
		#campaign-footer-bnr .c-ttl::after {}
		#campaign-footer-bnr .campaign-footer-box {
				width: 75%;
		}
		#campaign-footer-bnr .campaign-footer-box a {
				width: 100%;
				margin-bottom: 1.4em;
		}
		#campaign-footer-bnr .campaign-footer-box a img {}
}
