:root{
	--am-gold: #94824F;
	--am-gold-rgb: 94,82,55;
	--am-white: #fff;
	--am-text: #888;
	--am-text-strong: #4F4F4F;
	--am-darkblue:#083e87;
	
	--am-font-jp:
		"Hiragino Mincho ProN",
		"Yu Mincho",
		"YuMincho",
		"Noto Serif JP",
		"MS Mincho",
		serif;
	
	--am-font-sans:
		"Hiragino Kaku Gothic ProN",
		"Hiragino Sans",
		"Yu Gothic",
		"YuGothic",
		"Noto Sans JP",
		"Meiryo",
		sans-serif;
	
	--u: min(100vw, 750px);   /* ← 基準長さ（これが“縮尺”） */
	
	/*
	--compare-border: #070e5c;
	--compare-bg: #fbf5f2;
	--compare-cell: #f3f1ee;
	--compare-text: #4b4b4b;

	--compare-fixer: #5f73b0;
	--compare-fixer-head: #070e5c;
	--compare-fixer-text: #ffffff;
	--compare-fixer-accent: #ffd400;
	*/
	
	--compare-border: #9b8f6a;
	--compare-bg: #fbf5f2;
	--compare-cell: #f3f1ee;
	--compare-text: #4b4b4b;

	--compare-fixer: #f6a2b4;
	--compare-fixer-head: #f08aa1;
	--compare-fixer-text: #ffffff;
	--compare-fixer-accent: #ffd400;
	
	
	
	
}
html, body{
	margin:0; padding:0; background:var(--am-white);
}

#main-contents {
	width: var(--u);
	margin: 0 auto;
	position: relative;
	background: #fff;
}



.amHero {
	width: 100%;
	margin: 0 auto;
	position: relative;
	background: #fff;
}
.amHero_image {
	width:100%;
	margin: 0 auto;
}
.amHero_image img {
	width:100%;
	display: block;
}
.amHero_layer{
	position: absolute;
	inset: 0;
}
.amHero_layer_center {
	display: flex;
	justify-content: center;
	align-items: center;
}
.amCenter {
	/*display: flex;*/
	/*justify-content: center;*/
	align-items: center;
	text-align: center;
}


.secFV,
.secCompareTable,
.secExplainImage,
.secOffer,
.secPioneer,
.secOfferWrapper {
	margin: 0;
}
.secCase,
.secExplain01,
.secExplain02,
.secFlow,
.secArtist,
.secAccess,
.secGreeting,
.secFaq,
.secPayment {
	margin: 0 8% 0 8%;
}
/* .secFlow img {
	margin:5% auto !important;
}*/
.secArtist img {
	margin: 10% auto 3% auto;
	width: 80%;
}


/* ------------------------------------------------------------ */
/* amTitle001 タイトル 金明朝                                   */
/* ------------------------------------------------------------ */
.amTitle001 {
	align-items: center;
	text-align: center;
	font-family: var(--am-font-jp);
	color: var(--am-gold);
	font-size: calc(var(--u) * (48/750)) !important;
	font-weight: 600;
	line-height: calc(var(--u) * (55/750)) !important;
}

/* ------------------------------------------------------------ */
/* amTitle002 タイトル補足                                      */
/* ------------------------------------------------------------ */
.amTitle002 {
	align-items: center;
	text-align: center;
	font-family: var(--am-font-sans);
	color: var(--am-text-strong);
	font-size: calc(var(--u) * (38/750)) !important;
	font-weight: 600;
	line-height: calc(var(--u) * (45/750)) !important;
}

/* ------------------------------------------------------------ */
/* amTitle003 紺帯タイトル                                      */
/* ------------------------------------------------------------ */
.amTitle003 {
	margin:10% 0 5% 0;
	height:calc(var(--u) * (100/750));
	/* background-color: var(--am-darkblue); */
	background-color: var(--am-gold);
}
.amTitle003 p {
	padding-top: 8px;
	text-align: center;
	color: var(--am-white);
	white-space: nowrap;
	font-size: calc(var(--u) * (48/750)) !important;
	font-family: var(--am-font-jp);
	font-weight: 600;
}

/* ------------------------------------------------------------ */
/* amTitle004 タイトルキャプション                              */
/* ------------------------------------------------------------ */
.amTitle004 {
	align-items: center;
	text-align: center;
	font-family: var(--am-font-jp);
	color: var(--am-gold);
	font-size: calc(var(--u) * (30/750)) !important;
	font-weight: 600;
	line-height: calc(var(--u) * (40/750)) !important;
}

/* ------------------------------------------------------------ */
/* amTitle005 タイトル 金明朝 単語用文字大                      */
/* ------------------------------------------------------------ */
.amTitle005 {
	align-items: center;
	text-align: center;
	font-family: var(--am-font-jp);
	color: var(--am-gold);
	font-size: calc(var(--u) * (65/750)) !important;
	font-weight: 600;
	line-height: calc(var(--u) * (80/750)) !important;
}



/* ------------------------------------------------------------ */
/* amText 文章                                                  */
/* ------------------------------------------------------------ */
.amText{
	width: 100%;
	/*margin:5% 0 5% 0 !important;*/
}
.amText p{
	/*margin: 0 5% 0 10% !important;*/
	font-family: var(--am-font-sans);
	font-size: calc(var(--u) * (32/750)) !important;
	font-weight:600;
	line-height: calc(var(--u) * (48/750)) !important;
	letter-spacing: 0.01em;
	color: var(--am-text);
	text-align: left;
	overflow-wrap: anywhere;
	word-break: normal;
}
.amText strong{
	font-weight: 800;
	color: var(--am-text-strong);
}
.amText p + p{
	margin-top: 18px;
}
.amFVVideo {
	width: 100%;
	height: calc(var(--u) * (800/750));
	margin: 5% 0 5% 0;
}
.amCase {
	text-align: center;
	position: relative;
}
.amCase::before {
	content:"Before";
	position:absolute;
	bottom:calc(var(--u) * (10/750));
	left:calc(var(--u) * (10/750));
	font-size:calc(var(--u) * (40/750));;
	color:var(--am-white);
	font-weight:900;
}
.amCase::after {
	content:"After";
	position:absolute;
	bottom:calc(var(--u) * (10/750));
	left:calc(var(--u) * (330/750));
	font-size:calc(var(--u) * (40/750));;
	color:var(--am-white);
	font-weight:900;
}
.amCase img {
	display: inline-block !important;
	width: 49%;
}
.amCaseTitle {
	position: relative;
	height: calc(var(--u) * (100/750));
	text-align: left;
}
.amCaseTitle::after {
	content: "";
	position: absolute;
	top:65%;
	left:8%;
	right:0%;
	height:1px;
	background: color-mix(in srgb, var(--am-gold) 85%, transparent);
	transform: translateY(-50%);
	z-index: 0;
}
.amCaseTitle p {
	position: relative;
	display:inline-block !important;
	margin: 5% 0 0 2% !important;
	background:#fff;
	padding-right: 10px;
	z-index:1;
	font-size: calc(var(--u) * (35/750)) !important;
	line-height: calc(var(--u) * (60/750)) !important;
	color: var(--am-gold);
	font-family: var(--am-font-sans);
	font-weight: 600;
	text-align: center;
}
.amCaseText p {
	/* amTextと合わせる */
	font-size: calc(var(--u) * (32/750)) !important;
	line-height: calc(var(--u) * (48/750)) !important;
	
	margin: 0 5% 0 8% !important;
	font-family: var(--am-font-sans);
	letter-spacing: 0.01em;
	color: var(--am-text);
	text-align: left;
	overflow-wrap: anywhere;
	word-break: normal;
	font-weight:600;
}
.table_radius {
	border:1px solid #000;
	border-radius:calc(var(--u) * (20/750));
	overflow:hidden;
}
.table_radius table{
	width:100%;
	border-collapse:collapse;
}
.pill_01,
.pill_02,
.pill_title {
	height:calc(var(--u) * (30/750));
	margin: 3% 0 3% 0;
	width:50%;
	align-items:center;
	justify-content:center;
	display:flex;
	border-radius:9999px;
	font-size: calc(var(--u) * (15/750)) !important;
	font-weight:700;
	color:#fff;
}
.pill_01 {
	background:#8c52ff;
}
.pill_02 {
	background:#0097b2;
}
.pill_title {
	width:70%;
	background:#92644e;
	height:calc(var(--u) * (80/750));
	font-size: calc(var(--u) * (38/750)) !important;
}
.table_radius_text p,
.table_radius_text p strong {
	font-family: var(--am-font-sans);
	font-size: calc(var(--u) * (25/750)) !important;
	font-weight:500;
	line-height: calc(var(--u) * (30/750))  !important;
	letter-spacing: 0.01em;
	color: var(--am-text-strong);
	text-align: left;
	overflow-wrap: anywhere;
	word-break: normal;
}
.table_radius_text p {
	margin-right:10% !important;
}
.table_radius_text p strong {
	font-weight:900;
	
}
.attention001 {
	background-color: #efe9e0; <!-- #ebecf0-->
	margin-top:5%;
}
.attention001 .title {
	line-height: calc(var(--u) * (60/750))  !important;
	padding: 5%;
	text-align:left;
	font-family: var(--am-font-sans);
	font-size: calc(var(--u) * (40/750)) !important;
	font-weight:900;
	color: var(--am-text-strong);
}
.attention001 .caution {
	line-height: calc(var(--u) * (25/750))  !important;
	text-align:left;
	font-family: var(--am-font-sans);
	font-size: calc(var(--u) * (20/750)) !important;
	font-weight:900;
	color: var(--am-text-strong);
}
.white-caution {
	background-color: #fff;
	width: 95%;
	margin: 5% auto 5% auto !important;
}
.white-caution p {
	margin: 3% !important;
}
.amText .table001 {
	margin: 0 0 0 5%;
}
.gold-caution {
	margin-left:9% !important;
	white-space: nowrap;
	color: var(--am-gold);
	text-align: left;
	font-size: calc(var(--u) * (38/750)) !important;
	font-family: var(--am-font-jp);
	font-weight: 600;
	line-height: calc(var(--u) * (48/750)) !important;
}


.artist_name {
	margin: 3% 0 3% 0;
	line-height: calc(var(--u) * (60/750))  !important;
	text-align:left;
	font-family: var(--am-font-sans);
	font-size: calc(var(--u) * (45/750)) !important;
	font-weight:900;
	color: var(--am-text-strong);
}








/* ------------------------------------------------------------ */
/* オファーボタン                                               */
/* ------------------------------------------------------------ */
.secOffer .btn-offer {
	margin: 0 auto;
	width:100%;
	position: absolute;
	top: 60%;
	left: 50%;
	transform: translateX(-50%);
}

/* ------------------------------------------------------------ */
/* 比較テーブル                                                 */
/* ------------------------------------------------------------ */
.compare-wrap{
	max-width: 750px;
	margin: 10px auto;
	padding: 16px;
	background: #fff;
	font-family: var(--am-font-sans);
}
.compare-frame{
	background: var(--compare-bg);
	border: 2px solid var(--compare-border);
	border-radius: 18px;
	overflow: hidden;
}

table.compare{
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	table-layout: fixed;
}
table.compare col.col-label{ width: 26%; }
table.compare col.col-fixer{ width: 19%; }
table.compare col.col-oth{ width: 18.333%; }
.compare th,
.compare td{
	background: var(--compare-cell);
	/* padding: 18px 10px; */
	padding: 18px 10px 18px 5px;
	text-align: center;
	vertical-align: middle;
	border-right: 2px solid var(--compare-border);
	border-bottom: 2px solid var(--compare-border);
	font-weight: 700;
}
.compare tr > *:last-child{ border-right: 0; }
.compare tbody tr:last-child > *{ border-bottom: 0; }
.compare th.rowhead{
	font-weight: 800;
	/*font-size: 22px;*/
	font-size:calc(var(--u) * (28/750));
	letter-spacing: 0.02em;
}
.compare thead th{
	font-size:calc(var(--u) * (25/750));
	padding: 22px 5px 22px 5px;
	line-height: 1.3;
}
.compare thead th.blank{
	background: var(--compare-cell);
}
.compare .fixer{
	background: var(--compare-fixer);
	color: var(--compare-fixer-text);
	border-right: 2px solid var(--compare-border);
}
.compare thead th.fixer{
	background: var(--compare-fixer-head);
	color: #fff;
	font-weight: 900;
	line-height: 1.15;
	padding: 18px 10px 20px;
}
.compare tbody td.fixer{
	font-weight: 900;
}

.cell-inner{
	display: grid;
	gap: 10px;
	place-items: center;
}
.symbol{
	font-size:calc(var(--u) * (40/750));
	line-height: 1;
	font-weight: 900;
}

.desc{
	font-size:calc(var(--u) * (26/750));
	line-height: 1.2;
	font-weight: 800;
	word-break: keep-all;
}
.desc.small{
	font-size:calc(var(--u) * (22/750));
	font-weight: 800;
	line-height: 1.25;
}
.fixer .symbol{
	position: relative;
	width: 44px;
	height: 44px;
	font-size: 0; /* 文字の◎は使わない */
}
.fixer .symbol::before,
.fixer .symbol::after{
	content:"";
	position:absolute;
	inset: 0;
	border-radius: 999px;
	border: 3px solid var(--compare-fixer-accent);
}
.fixer .symbol::after{
	inset: 7px;               /* 内側リング */
	border-width: 3px;
}
td:not(.fixer) .symbol{
	color:#3f3f3f;
}
.compare-note{
	font-size:calc(var(--u) * (14/750));
	color: #333;
	margin: 10px 4px 0;
	text-align: right;
	font-weight: 700;
}
.compare-hero {
	font-size:calc(var(--u) * (25/750));
}

@media (max-width: 520px){
	.fixer .symbol{ width: 38px; height: 38px; }
}