@charset "utf-8";
/* =====================================================================
   じゃぱにーずリフトガール — キャラクターサイズ比較 2026
   対象：page-size.php（Template Name: キャラクターサイズ比較表 ／ /size/）
   読み込み：header.php（このテンプレートの固定ページでのみ読み込み）
   動き：js/size2026.js
   ・<section id="mainContent"> に付けた .jlgSize 配下だけに限定。
   ・トークンは css/chrome2026.css の :root を使います。
   ===================================================================== */

#mainContent#mainContent.jlgSize .left{
	font-family: var(--jlg-font);
	font-feature-settings: "palt" 1;
	color: var(--jlg-ink);
}
html.is-size-modal-open{
	overflow: hidden;
}

/* =====================================================================
   キャラ選択フォーム
   ===================================================================== */
#mainContent#mainContent.jlgSize .jlgSizeForm{
	position: relative;
	margin: 0 0 28px;
	padding: 22px 22px 20px;
	border: 1px solid var(--jlg-line);
	border-radius: var(--jlg-radius-lg);
	background: var(--jlg-surface);
	box-shadow: var(--jlg-shadow-sm);
}
#mainContent#mainContent.jlgSize .jlgSizeForm::before{
	content: "";
	position: absolute;
	top: -1px;
	left: 28px;
	right: 28px;
	height: 3px;
	border-radius: 0 0 3px 3px;
	background: var(--jlg-grad);
}
#mainContent#mainContent.jlgSize .jlgSizePickers{
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
	align-items: stretch;
	gap: 14px;
	margin: 0 0 18px;
}
#mainContent#mainContent.jlgSize .jlgSizePickers__vs{
	align-self: center;
	display: grid;
	place-items: center;
	width: 46px;
	height: 46px;
	margin-top: 24px;
	border-radius: 50%;
	background: var(--jlg-grad);
	color: #fff;
	font-family: var(--jlg-font-en);
	font-size: 15px;
	letter-spacing: .04em;
	box-shadow: 0 10px 22px -10px rgba(255, 0, 144, .75);
}
#mainContent#mainContent.jlgSize .jlgSizePick{
	display: flex;
	flex-direction: column;
	gap: 8px;
	min-width: 0;
}
#mainContent#mainContent.jlgSize .jlgSizePick__label{
	display: flex;
	align-items: center;
	gap: 7px;
	margin: 0;
	color: var(--jlg-ink);
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: .08em;
}
#mainContent#mainContent.jlgSize .jlgSizePick__label::before{
	content: "";
	width: 6px;
	height: 6px;
	border-radius: 2px;
	background: var(--jlg-grad);
	transform: rotate(45deg);
}

/* 選択ボタン */
#mainContent#mainContent.jlgSize .jlgSizePick__btn{
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: stretch;
	flex: 1;
	width: 100%;
	min-height: 150px;
	margin: 0;
	padding: 8px 8px 12px;
	border: 1px solid var(--jlg-line);
	border-radius: var(--jlg-radius);
	background: var(--jlg-surface);
	color: var(--jlg-ink);
	font-family: var(--jlg-font);
	text-align: left;
	cursor: pointer;
	transition: border-color .25s ease, box-shadow .3s ease, transform .3s var(--jlg-ease), background .25s ease;
}
#mainContent#mainContent.jlgSize .jlgSizePick__btn:hover{
	border-color: rgba(255, 0, 144, .35);
	box-shadow: var(--jlg-shadow);
	transform: translateY(-2px);
}
#mainContent#mainContent.jlgSize .jlgSizePick__btn:focus-visible{
	outline: 3px solid rgba(255, 0, 144, .35);
	outline-offset: 3px;
}
/* 未選択 */
#mainContent#mainContent.jlgSize .jlgSizePick__btn:not(.is-selected){
	justify-content: center;
	align-items: center;
	border: 1.5px dashed rgba(255, 0, 144, .35);
	background: #fff8fc;
}
#mainContent#mainContent.jlgSize .jlgSizePick__btn:not(.is-selected):hover{
	background: var(--jlg-tint);
}
#mainContent#mainContent.jlgSize .jlgSizePick__empty{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	color: var(--jlg-pink);
	font-size: 15px;
	font-weight: 700;
	letter-spacing: .06em;
}
#mainContent#mainContent.jlgSize .jlgSizePick__empty::before{
	content: "\f002";
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: var(--jlg-grad);
	color: #fff;
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	font-size: 15px;
	box-shadow: 0 10px 20px -10px rgba(255, 0, 144, .8);
}
/* 選択済み */
#mainContent#mainContent.jlgSize .jlgSizePick__img{
	display: block;
	aspect-ratio: 16 / 9;
	margin: 0 0 10px;
	overflow: hidden;
	border-radius: var(--jlg-radius-sm);
	background: #f4eef3;
}
#mainContent#mainContent.jlgSize .jlgSizePick__img img{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center top;
}
#mainContent#mainContent.jlgSize .jlgSizePick__body{
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 0 4px;
}
#mainContent#mainContent.jlgSize .jlgSizePick__name{
	font-size: 16px;
	font-weight: 700;
	line-height: 1.4;
}
#mainContent#mainContent.jlgSize .jlgSizePick__meta{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0 8px;
	color: var(--jlg-muted);
	font-size: 13px;
	font-variant-numeric: tabular-nums;
}
#mainContent#mainContent.jlgSize .jlgSizePick__meta i{
	width: 3px;
	height: 3px;
	border-radius: 50%;
	background: currentColor;
	opacity: .5;
}
#mainContent#mainContent.jlgSize .jlgSizePick__change{
	position: absolute;
	top: 14px;
	right: 14px;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 4px 11px;
	border-radius: 999px;
	background: rgba(36, 26, 51, .7);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
	color: #fff;
	font-size: 11.5px;
	font-weight: 700;
}
#mainContent#mainContent.jlgSize .jlgSizePick__change::before{
	content: "\f021";
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	font-size: 10px;
}

/* 比較するボタン */
#mainContent#mainContent.jlgSize .jlgSizeForm__submit{
	margin: 0;
	text-align: center;
}
#mainContent#mainContent.jlgSize .jlgSizeForm__submit button{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	width: min(100%, 340px);
	min-height: 52px;
	padding: 0 28px;
	border: 0;
	border-radius: 999px;
	background: var(--jlg-grad-wide);
	background-size: 250% 100%;
	background-position: 0% 50%;
	color: #fff;
	font-family: var(--jlg-font);
	font-size: 16px;
	font-weight: 700;
	letter-spacing: .1em;
	cursor: pointer;
	box-shadow: 0 14px 28px -14px rgba(255, 0, 144, .8);
	transition: background-position .8s var(--jlg-ease), transform .3s var(--jlg-ease), box-shadow .3s ease;
}
#mainContent#mainContent.jlgSize .jlgSizeForm__submit button::before{
	content: "\f545"; /* ruler */
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	font-size: 14px;
}
#mainContent#mainContent.jlgSize .jlgSizeForm__submit button:hover{
	background-position: 60% 50%;
	transform: translateY(-2px);
}
#mainContent#mainContent.jlgSize .jlgSizeForm__submit button.is-ready{
	animation: jlgSizePulse 1.2s var(--jlg-ease) 1;
}

/* =====================================================================
   キャラ選択モーダル（<dialog>）
   ===================================================================== */
#mainContent#mainContent.jlgSize .jlgSizeModal{
	width: min(980px, calc(100% - 32px));
	max-width: none;
	height: min(88dvh, 880px);
	max-height: none;
	margin: auto;
	padding: 0;
	border: 0;
	border-radius: var(--jlg-radius-lg);
	background: transparent;
	color: var(--jlg-ink);
	overflow: visible;
}
#mainContent#mainContent.jlgSize .jlgSizeModal::backdrop{
	background: rgba(30, 12, 40, .5);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
}
#mainContent#mainContent.jlgSize .jlgSizeModal[open]{
	display: block;
	animation: jlgSizeIn .32s var(--jlg-ease);
}
#mainContent#mainContent.jlgSize .jlgSizeModal__panel{
	display: flex;
	flex-direction: column;
	height: 100%;
	overflow: hidden;
	border-radius: var(--jlg-radius-lg);
	background: #fff;
	box-shadow: 0 40px 80px -30px rgba(30, 10, 40, .6);
	font-family: var(--jlg-font);
	font-feature-settings: "palt" 1;
}

/* ヘッダー */
#mainContent#mainContent.jlgSize .jlgSizeModal__head{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 16px 18px 14px 24px;
	background:
		radial-gradient(60% 140% at 0% 0%, rgba(255, 122, 196, .28), transparent 70%),
		radial-gradient(50% 140% at 100% 0%, rgba(180, 60, 200, .18), transparent 70%),
		#fff7fb;
	border-bottom: 1px solid var(--jlg-line);
}
#mainContent#mainContent.jlgSize .jlgSizeModal__title{
	margin: 0;
	font-size: 18px;
	font-weight: 900;
	letter-spacing: .05em;
}
#mainContent#mainContent.jlgSize .jlgSizeModal__title span{
	margin-right: 2px;
	background: var(--jlg-grad);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: transparent;
}
#mainContent#mainContent.jlgSize .jlgSizeModal__close{
	position: relative;
	flex: 0 0 auto;
	width: 40px;
	height: 40px;
	border: 1px solid var(--jlg-line);
	border-radius: 50%;
	background: #fff;
	cursor: pointer;
	transition: background .25s ease, transform .3s var(--jlg-ease);
}
#mainContent#mainContent.jlgSize .jlgSizeModal__close::before,
#mainContent#mainContent.jlgSize .jlgSizeModal__close::after{
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 16px;
	height: 2px;
	border-radius: 2px;
	background: var(--jlg-ink);
	transform: translate(-50%, -50%) rotate(45deg);
}
#mainContent#mainContent.jlgSize .jlgSizeModal__close::after{
	transform: translate(-50%, -50%) rotate(-45deg);
}
#mainContent#mainContent.jlgSize .jlgSizeModal__close:hover{
	background: var(--jlg-tint);
	transform: rotate(90deg);
}

/* 検索・並べ替え・絞り込み */
#mainContent#mainContent.jlgSize .jlgSizeModal__tools{
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 14px 24px 12px;
	border-bottom: 1px solid var(--jlg-line);
	background: #fff;
}
#mainContent#mainContent.jlgSize .jlgSizeModal__search{
	position: relative;
	display: block;
	margin: 0;
}
#mainContent#mainContent.jlgSize .jlgSizeModal__search::before{
	content: "\f002";
	position: absolute;
	top: 50%;
	left: 16px;
	transform: translateY(-50%);
	color: var(--jlg-pink);
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	font-size: 14px;
	pointer-events: none;
}
#mainContent#mainContent.jlgSize .jlgSizeModal__search input{
	width: 100%;
	height: 46px;
	padding: 0 16px 0 42px;
	border: 1px solid rgba(36, 26, 51, .12);
	border-radius: 999px;
	background: #fbf8fb;
	color: var(--jlg-ink);
	font-family: var(--jlg-font);
	font-size: 15px;
	transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
#mainContent#mainContent.jlgSize .jlgSizeModal__search input:focus{
	outline: none;
	border-color: var(--jlg-pink);
	background: #fff;
	box-shadow: 0 0 0 4px rgba(255, 0, 144, .12);
}
#mainContent#mainContent.jlgSize .screen-reader-text{
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}
#mainContent#mainContent.jlgSize .jlgSizeModal__row{
	display: flex;
	align-items: center;
	gap: 12px;
	min-width: 0;
}
#mainContent#mainContent.jlgSize .jlgSizeModal__rowLabel{
	flex: 0 0 4.5em;
	white-space: nowrap;
	color: var(--jlg-muted);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .08em;
}
#mainContent#mainContent.jlgSize .jlgSizeSeg{
	display: flex;
	gap: 6px;
	min-width: 0;
	overflow-x: auto;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
}
#mainContent#mainContent.jlgSize .jlgSizeSeg::-webkit-scrollbar{
	display: none;
}
#mainContent#mainContent.jlgSize .jlgSizeSeg button{
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	height: 34px;
	padding: 0 14px;
	border: 1px solid var(--jlg-line);
	border-radius: 999px;
	background: #fff;
	color: var(--jlg-ink);
	font-family: var(--jlg-font);
	font-size: 13px;
	font-weight: 700;
	white-space: nowrap;
	cursor: pointer;
	transition: background .2s ease, color .2s ease, border-color .2s ease;
}
#mainContent#mainContent.jlgSize .jlgSizeSeg button:hover{
	border-color: rgba(255, 0, 144, .35);
	color: var(--jlg-pink);
}
#mainContent#mainContent.jlgSize .jlgSizeSeg button.is-active{
	border-color: transparent;
	background: var(--jlg-grad);
	color: #fff;
}
/* 並べ替え：昇順／降順の矢印（もう一度押すと切り替え） */
#mainContent#mainContent.jlgSize .jlgSizeSeg[data-group="sort"] button.is-active::after{
	content: "\f062";
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	font-size: 10px;
}
#mainContent#mainContent.jlgSize .jlgSizeSeg[data-group="sort"] button.is-active[data-dir="desc"]::after{
	content: "\f063";
}
#mainContent#mainContent.jlgSize .jlgSizeModal__count{
	margin: 0;
	color: var(--jlg-muted);
	font-size: 12.5px;
	text-align: right;
}
#mainContent#mainContent.jlgSize .jlgSizeModal__count strong{
	margin-right: 2px;
	color: var(--jlg-pink);
	font-family: var(--jlg-font-en);
	font-size: 17px;
	font-weight: normal;
}

/* キャラ一覧 */
#mainContent#mainContent.jlgSize .jlgSizeModal__list{
	flex: 1;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
	align-content: start;
	gap: 12px;
	margin: 0;
	padding: 16px 24px 28px;
	overflow-y: auto;
	overscroll-behavior: contain;
	list-style: none;
	background: #fcf9fb;
}
#mainContent#mainContent.jlgSize .jlgSizeModal__list li{
	margin: 0;
	padding: 0;
	list-style: none;
}
#mainContent#mainContent.jlgSize .jlgSizeCard{
	--sexc: var(--jlg-pink);
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 6px 6px 10px;
	border: 1px solid var(--jlg-line);
	border-radius: 16px;
	background: #fff;
	color: var(--jlg-ink);
	font-family: var(--jlg-font);
	text-align: left;
	cursor: pointer;
	transition: border-color .2s ease, box-shadow .25s ease, transform .25s var(--jlg-ease);
}
#mainContent#mainContent.jlgSize .jlgSizeCard.is-man{
	--sexc: #1a7cea;
}
#mainContent#mainContent.jlgSize .jlgSizeCard:hover{
	border-color: rgba(255, 0, 144, .3);
	box-shadow: var(--jlg-shadow);
	transform: translateY(-2px);
}
#mainContent#mainContent.jlgSize .jlgSizeCard:focus-visible{
	outline: 3px solid rgba(255, 0, 144, .4);
	outline-offset: 2px;
}
#mainContent#mainContent.jlgSize .jlgSizeCard.is-current{
	border: 2px solid var(--jlg-pink);
	padding: 5px 5px 9px;
	background: #fff7fb;
}
#mainContent#mainContent.jlgSize .jlgSizeCard.is-current::after{ /* 選択中のチェック */
	content: "\f00c";
	position: absolute;
	top: -8px;
	right: -8px;
	z-index: 2;
	display: grid;
	place-items: center;
	width: 26px;
	height: 26px;
	border: 2px solid #fff;
	border-radius: 50%;
	background: var(--jlg-grad);
	color: #fff;
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	font-size: 11px;
}
#mainContent#mainContent.jlgSize .jlgSizeCard__img{
	position: relative;
	display: block;
	aspect-ratio: 16 / 9;
	margin: 0 0 8px;
	overflow: hidden;
	border-radius: 11px;
	background: #f4eef3;
}
#mainContent#mainContent.jlgSize .jlgSizeCard__img img{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center top;
	transition: transform .5s var(--jlg-ease);
}
#mainContent#mainContent.jlgSize .jlgSizeCard:hover .jlgSizeCard__img img{
	opacity: 1;
	transform: scale(1.05);
}
#mainContent#mainContent.jlgSize .jlgSizeCard__tag{
	position: absolute;
	left: 6px;
	bottom: 6px;
	padding: 3px 8px;
	border-radius: 999px;
	background: rgba(36, 26, 51, .72);
	color: #fff;
	font-size: 10.5px;
	font-weight: 700;
	line-height: 1.3;
}
#mainContent#mainContent.jlgSize .jlgSizeCard__tag.is-other{
	left: auto;
	right: 6px;
	top: 6px;
	bottom: auto;
	background: var(--jlg-grad);
}
#mainContent#mainContent.jlgSize .jlgSizeCard__body{
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 0 3px;
}
#mainContent#mainContent.jlgSize .jlgSizeCard__name{
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.4;
}
#mainContent#mainContent.jlgSize .jlgSizeCard__name::before{ /* 性別の色 */
	content: "";
	flex: 0 0 auto;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--sexc);
}
#mainContent#mainContent.jlgSize .jlgSizeCard__meta{
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 4px;
}
#mainContent#mainContent.jlgSize .jlgSizeCard__meta > span{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1px;
	padding: 4px 2px 5px;
	border-radius: 8px;
	background: #f7f3f7;
	color: var(--jlg-ink);
	font-size: 12.5px;
	font-weight: 700;
	line-height: 1.2;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}
#mainContent#mainContent.jlgSize .jlgSizeCard__meta small{
	color: var(--jlg-muted);
	font-size: 10px;
	font-weight: 500;
}
#mainContent#mainContent.jlgSize .jlgSizeCard__meta > span.is-sortkey{ /* 並べ替えに使っている項目を強調 */
	background: var(--jlg-tint);
	color: var(--jlg-pink);
}
#mainContent#mainContent.jlgSize .jlgSizeModal__empty{
	margin: 0;
	padding: 40px 20px;
	color: var(--jlg-muted);
	font-size: 14px;
	text-align: center;
	background: #fcf9fb;
}

/* =====================================================================
   比較結果（全身イラスト・データ）
   全身イラストは全キャラ共通の縮尺で描かれているため、
   2枚の幅を必ず同じにして（＝高さの比率を保って）表示する。
   ===================================================================== */
#mainContent#mainContent.jlgSize .charaBox{
	overflow: hidden;
	margin: 0 0 18px;
	padding: 0;
	border: 1px solid rgba(255, 0, 144, .14);
	border-radius: var(--jlg-radius-lg);
	background:
		url("../images/scale.png") no-repeat center center / auto 100%,
		radial-gradient(60% 50% at 50% 100%, rgba(255, 122, 196, .28), transparent 75%),
		linear-gradient(180deg, #fffafd 0%, #fbeaf4 100%);
	box-shadow: 0 24px 50px -34px rgba(80, 20, 70, .55);
	font-size: 0;
}
#mainContent#mainContent.jlgSize .charaBox.cl2 .charaItem{
	width: 50%;
}
#mainContent#mainContent.jlgSize .charaBox .charaItem img{
	filter: drop-shadow(0 12px 14px rgba(80, 20, 70, .16));
}

#mainContent#mainContent.jlgSize .charaTable{
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px;
	font-size: 16px;
}
#mainContent#mainContent.jlgSize .charaTable.cl2 .charaItem{
	display: block;
	width: auto;
}
#mainContent#mainContent.jlgSize .charaTable .charaItem table{
	width: 100%;
	margin: 0;
	border: 1px solid var(--jlg-line);
	border-collapse: separate;
	border-spacing: 0;
	border-radius: var(--jlg-radius);
	overflow: hidden;
	background: #fff;
	box-shadow: var(--jlg-shadow-sm);
}
#mainContent#mainContent.jlgSize .charaTable .charaItem table tr th,
#mainContent#mainContent.jlgSize .charaTable .charaItem table tr td{
	padding: 12px 16px;
	border: 0;
	border-bottom: 1px solid var(--jlg-line);
	background: none;
}
#mainContent#mainContent.jlgSize .charaTable .charaItem table tbody tr:last-child th,
#mainContent#mainContent.jlgSize .charaTable .charaItem table tbody tr:last-child td{
	border-bottom: 0;
}
#mainContent#mainContent.jlgSize .charaTable .charaItem table thead tr th{
	padding: 13px 16px;
	border: 0;
	background: var(--jlg-grad);
	color: #fff;
	font-size: 15px;
	font-weight: 700;
	letter-spacing: .05em;
	text-align: center;
}
#mainContent#mainContent.jlgSize .charaTable .charaItem table tbody tr th{
	width: 38%;
	background: #fbf6fa;
	color: var(--jlg-muted);
	font-size: 13px;
	font-weight: 700;
	text-align: left;
}
#mainContent#mainContent.jlgSize .charaTable .charaItem table tbody tr td{
	color: var(--jlg-ink);
	font-family: var(--jlg-font-en);
	font-size: 22px;
	line-height: 1.2;
	text-align: left;
	font-variant-numeric: tabular-nums;
}

/* =====================================================================
   RESPONSIVE
   ===================================================================== */
@media screen and (max-width: 759px){
	#mainContent#mainContent.jlgSize .jlgSizeForm{
		padding: 18px 14px 16px;
		border-radius: 20px;
	}
	#mainContent#mainContent.jlgSize .jlgSizeForm::before{
		left: 20px;
		right: 20px;
	}
	#mainContent#mainContent.jlgSize .jlgSizePickers{
		gap: 8px;
		grid-template-columns: minmax(0, 1fr) 0 minmax(0, 1fr);
	}
	#mainContent#mainContent.jlgSize .jlgSizePickers__vs{
		position: relative;
		z-index: 2;
		width: 34px;
		height: 34px;
		margin: 24px 0 0 -17px;
		font-size: 12px;
	}
	#mainContent#mainContent.jlgSize .jlgSizePick__btn{
		min-height: 130px;
		padding: 6px 6px 10px;
		border-radius: 14px;
	}
	#mainContent#mainContent.jlgSize .jlgSizePick__empty{
		font-size: 13px;
		gap: 8px;
		text-align: center;
	}
	#mainContent#mainContent.jlgSize .jlgSizePick__empty::before{
		width: 38px;
		height: 38px;
		font-size: 13px;
	}
	#mainContent#mainContent.jlgSize .jlgSizePick__name{
		font-size: 14px;
	}
	#mainContent#mainContent.jlgSize .jlgSizePick__meta{
		font-size: 11.5px;
		gap: 0 6px;
	}
	#mainContent#mainContent.jlgSize .jlgSizePick__change{
		top: 10px;
		right: 10px;
		padding: 3px 8px;
		font-size: 10.5px;
	}
	#mainContent#mainContent.jlgSize .jlgSizeForm__submit button{
		width: 100%;
	}

	/* モーダルは下から出てくるシート型 */
	#mainContent#mainContent.jlgSize .jlgSizeModal{
		width: 100%;
		height: 94dvh;
		margin: auto 0 0;
		border-radius: 22px 22px 0 0;
	}
	#mainContent#mainContent.jlgSize .jlgSizeModal[open]{
		animation: jlgSizeUp .38s var(--jlg-ease);
	}
	#mainContent#mainContent.jlgSize .jlgSizeModal__panel{
		border-radius: 22px 22px 0 0;
	}
	#mainContent#mainContent.jlgSize .jlgSizeModal__head{
		padding: 14px 14px 12px 18px;
	}
	#mainContent#mainContent.jlgSize .jlgSizeModal__head::before{ /* つまみ */
		content: "";
		position: absolute;
		top: 6px;
		left: 50%;
		width: 38px;
		height: 4px;
		border-radius: 4px;
		background: rgba(36, 26, 51, .15);
		transform: translateX(-50%);
	}
	#mainContent#mainContent.jlgSize .jlgSizeModal__title{
		font-size: 16px;
	}
	#mainContent#mainContent.jlgSize .jlgSizeModal__tools{
		gap: 8px;
		padding: 12px 14px 10px;
	}
	#mainContent#mainContent.jlgSize .jlgSizeModal__search input{
		height: 44px;
		font-size: 16px; /* iOSで入力時に拡大されないように */
	}
	#mainContent#mainContent.jlgSize .jlgSizeModal__row{
		gap: 8px;
	}
	#mainContent#mainContent.jlgSize .jlgSizeModal__rowLabel{
		flex: 0 0 auto;
		min-width: 3.4em;
		font-size: 11px;
		letter-spacing: .02em;
		white-space: nowrap;
	}
	#mainContent#mainContent.jlgSize .jlgSizeSeg{
		margin-right: -14px;
		padding-right: 14px;
	}
	#mainContent#mainContent.jlgSize .jlgSizeSeg button{
		height: 32px;
		padding: 0 12px;
		font-size: 12.5px;
	}
	#mainContent#mainContent.jlgSize .jlgSizeModal__list{
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 8px;
		padding: 12px 12px calc(24px + env(safe-area-inset-bottom));
	}
	#mainContent#mainContent.jlgSize .jlgSizeCard{
		padding: 5px 5px 8px;
		border-radius: 14px;
	}
	#mainContent#mainContent.jlgSize .jlgSizeCard.is-current{
		padding: 4px 4px 7px;
	}
	#mainContent#mainContent.jlgSize .jlgSizeCard__img{
		border-radius: 10px;
	}
	#mainContent#mainContent.jlgSize .jlgSizeCard__name{
		font-size: 13px;
	}
	#mainContent#mainContent.jlgSize .jlgSizeCard__meta{
		gap: 3px;
	}
	#mainContent#mainContent.jlgSize .jlgSizeCard__meta > span{
		font-size: 11px;
		padding: 3px 1px 4px;
	}
	#mainContent#mainContent.jlgSize .jlgSizeCard__meta small{
		font-size: 9px;
	}

	#mainContent#mainContent.jlgSize .charaBox{
		border-radius: 20px;
	}
	#mainContent#mainContent.jlgSize .charaTable{
		gap: 8px;
	}
	#mainContent#mainContent.jlgSize .charaTable .charaItem table thead tr th{
		padding: 11px 8px;
		font-size: 13px;
	}
	#mainContent#mainContent.jlgSize .charaTable .charaItem table tr th,
	#mainContent#mainContent.jlgSize .charaTable .charaItem table tr td{
		padding: 10px 10px;
	}
	#mainContent#mainContent.jlgSize .charaTable .charaItem table tbody tr th{
		width: auto;
		font-size: 11.5px;
	}
	#mainContent#mainContent.jlgSize .charaTable .charaItem table tbody tr td{
		font-size: 17px;
	}
}

@keyframes jlgSizeIn{
	from{ opacity: 0; transform: translateY(14px) scale(.98); }
	to  { opacity: 1; transform: none; }
}
@keyframes jlgSizeUp{
	from{ transform: translateY(100%); }
	to  { transform: none; }
}
@keyframes jlgSizePulse{
	0%  { box-shadow: 0 0 0 0 rgba(255, 0, 144, .55), 0 14px 28px -14px rgba(255, 0, 144, .8); }
	70% { box-shadow: 0 0 0 16px rgba(255, 0, 144, 0), 0 14px 28px -14px rgba(255, 0, 144, .8); }
	100%{ box-shadow: 0 0 0 0 rgba(255, 0, 144, 0), 0 14px 28px -14px rgba(255, 0, 144, .8); }
}
@media (prefers-reduced-motion: reduce){
	#mainContent#mainContent.jlgSize .jlgSizeModal[open],
	#mainContent#mainContent.jlgSize .jlgSizeForm__submit button.is-ready{
		animation: none;
	}
}