html {
	background: #06306f !important;
}

body.oripagate-portal-active {
	background-color: #06306f !important;
	background-image:
		radial-gradient(ellipse at 50% 560px, rgba(0, 190, 255, .22) 0, rgba(0, 127, 255, .08) 18%, rgba(6, 48, 111, 0) 42%),
		linear-gradient(112deg, rgba(6, 48, 111, 0) 0, rgba(6, 48, 111, 0) 34%, rgba(0, 136, 255, .13) 39%, rgba(0, 136, 255, .03) 46%, rgba(6, 48, 111, 0) 56%),
		linear-gradient(68deg, rgba(6, 48, 111, 0) 0, rgba(6, 48, 111, 0) 44%, rgba(0, 136, 255, .12) 49%, rgba(0, 136, 255, .03) 56%, rgba(6, 48, 111, 0) 66%),
		linear-gradient(180deg, rgba(3, 13, 34, .12) 0, rgba(3, 13, 34, .05) 260px, rgba(6, 48, 111, 0) 760px),
		linear-gradient(90deg, rgba(4, 18, 42, .42) 0, rgba(4, 18, 42, .16) 12%, rgba(6, 48, 111, 0) 31%, rgba(6, 48, 111, 0) 69%, rgba(4, 18, 42, .16) 88%, rgba(4, 18, 42, .42) 100%),
		url("oripagate-stage-bg-v1.jpg") !important;
	background-position: center center, center center, center center, center center, center center, center center !important;
	background-size: 100% 160vh, 100% 140vh, 100% 140vh, 100% 180vh, 100% 180vh, cover !important;
	background-repeat: no-repeat !important;
	background-attachment: fixed !important;
}

body.oripagate-skin-active:not(.oripagate-portal-active) {
	background-color: #06306f !important;
	background-image:
		radial-gradient(ellipse at 50% 520px, rgba(0, 190, 255, .2) 0, rgba(0, 127, 255, .07) 18%, rgba(6, 48, 111, 0) 42%),
		linear-gradient(112deg, rgba(6, 48, 111, 0) 0, rgba(6, 48, 111, 0) 34%, rgba(0, 136, 255, .11) 39%, rgba(0, 136, 255, .025) 46%, rgba(6, 48, 111, 0) 56%),
		linear-gradient(68deg, rgba(6, 48, 111, 0) 0, rgba(6, 48, 111, 0) 44%, rgba(0, 136, 255, .1) 49%, rgba(0, 136, 255, .025) 56%, rgba(6, 48, 111, 0) 66%),
		linear-gradient(180deg, rgba(3, 13, 34, .12) 0, rgba(3, 13, 34, .05) 230px, rgba(6, 48, 111, 0) 720px),
		linear-gradient(90deg, rgba(4, 18, 42, .44) 0, rgba(4, 18, 42, .17) 12%, rgba(6, 48, 111, 0) 31%, rgba(6, 48, 111, 0) 69%, rgba(4, 18, 42, .17) 88%, rgba(4, 18, 42, .44) 100%),
		url("oripagate-stage-bg-v1.jpg") !important;
	background-position: center center, center center, center center, center center, center center, center center !important;
	background-size: 100% 160vh, 100% 140vh, 100% 140vh, 100% 180vh, 100% 180vh, cover !important;
	background-repeat: no-repeat !important;
	background-attachment: fixed !important;
	color: #101827;
}

body.oripagate-skin-active:not(.oripagate-portal-active) #container {
	background: transparent !important;
}

body.oripagate-skin-active:not(.oripagate-portal-active) #header-container {
	margin: 14px auto 0;
	background: transparent !important;
}

body.oripagate-skin-active:not(.oripagate-portal-active) #header-container-in,
body.oripagate-skin-active:not(.oripagate-portal-active) #header-in {
	max-width: 1180px;
	margin: 0 auto;
	background:
		linear-gradient(135deg, rgba(8, 13, 23, .88) 0%, rgba(18, 27, 45, .9) 58%, rgba(8, 13, 23, .92) 100%),
		url("oripagate-stage-bg-v1.jpg") center 18% / cover no-repeat !important;
	border: 1px solid rgba(244, 186, 61, .65);
	border-radius: 8px 8px 0 0;
	box-shadow: 0 14px 36px rgba(3, 7, 15, .2), inset 0 1px 0 rgba(255, 255, 255, .08) !important;
}

body.oripagate-skin-active:not(.oripagate-portal-active) .logo-text,
body.oripagate-skin-active:not(.oripagate-portal-active) .site-name-text,
body.oripagate-skin-active:not(.oripagate-portal-active) .site-name-text-link,
body.oripagate-skin-active:not(.oripagate-portal-active) .logo-header a {
	color: #fff7da !important;
	font-weight: 900;
	letter-spacing: 0;
	text-shadow: 0 2px 0 rgba(0, 0, 0, .45), 0 0 22px rgba(244, 186, 61, .22);
}

body.oripagate-skin-active:not(.oripagate-portal-active) .tagline {
	color: #f4d488 !important;
	font-size: 13px;
	font-weight: 700;
}

body.oripagate-skin-active:not(.oripagate-portal-active) #navi {
	background: transparent !important;
}

body.oripagate-skin-active:not(.oripagate-portal-active) #navi-in {
	max-width: 1180px;
	margin: 0 auto 14px;
	border: 1px solid rgba(244, 186, 61, .65);
	border-top: 0;
	border-radius: 0 0 8px 8px;
	background:
		linear-gradient(90deg, rgba(244, 186, 61, .12), transparent 18%, transparent 82%, rgba(66, 145, 255, .13)),
		#0c1321 !important;
	overflow: hidden;
}

body.oripagate-skin-active:not(.oripagate-portal-active) #navi-in a {
	color: #f9fafb !important;
	font-weight: 800;
}

body.oripagate-skin-active:not(.oripagate-portal-active) #navi-in a:hover,
body.oripagate-skin-active:not(.oripagate-portal-active) #navi-in a:focus-visible {
	background: rgba(244, 186, 61, .16) !important;
	color: #ffd86c !important;
}

body.oripagate-skin-active:not(.oripagate-portal-active) #content {
	margin-top: 0 !important;
}

body.oripagate-skin-active:not(.oripagate-portal-active) #content-in {
	max-width: 1180px;
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) 320px !important;
	gap: 16px !important;
	align-items: start !important;
}

body.oripagate-skin-active:not(.oripagate-portal-active) #main,
body.oripagate-skin-active:not(.oripagate-portal-active) #sidebar {
	width: auto !important;
	max-width: none !important;
	min-width: 0 !important;
	float: none !important;
	clear: none !important;
	border: 1px solid #d9c07c !important;
	border-radius: 8px !important;
	background: #fff !important;
	box-shadow: 0 10px 28px rgba(10, 16, 28, .08) !important;
}

body.oripagate-skin-active:not(.oripagate-portal-active) #main {
	grid-column: 1 !important;
	padding: 22px !important;
}

body.oripagate-skin-active:not(.oripagate-portal-active) #sidebar {
	grid-column: 2 !important;
	padding: 14px !important;
}

body.oripagate-skin-active:not(.oripagate-portal-active) #sidebar-scroll {
	position: static !important;
	top: auto !important;
	width: auto !important;
	max-width: none !important;
}

body.oripagate-skin-active:not(.oripagate-portal-active) #content-in::before,
body.oripagate-skin-active:not(.oripagate-portal-active) #content-in::after {
	content: none !important;
	display: none !important;
}

body.oripagate-skin-active:not(.oripagate-portal-active) .entry-title,
body.oripagate-skin-active:not(.oripagate-portal-active) .archive-title {
	margin: 0 0 18px !important;
	padding: 0 0 14px !important;
	border-bottom: 3px solid #c7962e;
	color: #101827 !important;
	font-size: 26px !important;
	font-weight: 900 !important;
	line-height: 1.35 !important;
	letter-spacing: 0 !important;
}

body.oripagate-skin-active:not(.oripagate-portal-active) .breadcrumb {
	max-width: 1180px;
	margin: 0 auto 12px !important;
	padding: 0 4px !important;
	color: #667085;
	font-size: 12px;
}

body.oripagate-skin-active:not(.oripagate-portal-active) .widget {
	padding: 0 0 14px !important;
	border-bottom: 1px solid #edf1f6;
	background: transparent !important;
	box-shadow: none !important;
}

body.oripagate-skin-active:not(.oripagate-portal-active) .widget:last-child {
	border-bottom: 0;
}

body.oripagate-skin-active:not(.oripagate-portal-active) .widget h2,
body.oripagate-skin-active:not(.oripagate-portal-active) .widget h3,
body.oripagate-skin-active:not(.oripagate-portal-active) .widget-title {
	margin: 0 0 12px !important;
	padding: 10px 12px !important;
	border: 0 !important;
	border-left: 4px solid #f4ba3d !important;
	background: linear-gradient(90deg, #111a2d, #18243a) !important;
	color: #fff7da !important;
	font-size: 15px !important;
	font-weight: 900 !important;
}

body.oripagate-skin-active:not(.oripagate-portal-active) .entry-card-wrap,
body.oripagate-skin-active:not(.oripagate-portal-active) .related-entry-card-wrap {
	border: 1px solid #e0c986 !important;
	border-radius: 8px !important;
	background: #fff !important;
	box-shadow: 0 1px 0 rgba(18, 28, 45, .03);
	overflow: hidden;
}

body.oripagate-skin-active:not(.oripagate-portal-active) .entry-card-title,
body.oripagate-skin-active:not(.oripagate-portal-active) .related-entry-card-title {
	color: #101827 !important;
	font-weight: 900 !important;
	line-height: 1.5 !important;
}

body.oripagate-skin-active:not(.oripagate-portal-active) .cat-link,
body.oripagate-skin-active:not(.oripagate-portal-active) .tag-link,
body.oripagate-skin-active:not(.oripagate-portal-active) .post-cat,
body.oripagate-skin-active:not(.oripagate-portal-active) .post-tag {
	border-radius: 999px !important;
	background: #fff3c8 !important;
	color: #6d4300 !important;
	font-weight: 800 !important;
}

body.oripagate-skin-active:not(.oripagate-portal-active) .pagination a,
body.oripagate-skin-active:not(.oripagate-portal-active) .pagination .current {
	border: 1px solid #dce4ee !important;
	border-radius: 7px !important;
	background: #fff !important;
	color: #172033 !important;
	font-weight: 800 !important;
}

body.oripagate-skin-active:not(.oripagate-portal-active) .pagination .current {
	background: #172033 !important;
	color: #fff !important;
}

body.oripagate-skin-active:not(.oripagate-portal-active) .ndc-directory,
body.oripagate-skin-active:not(.oripagate-portal-active) .ndc-section {
	margin-top: 0 !important;
}

body.oripagate-skin-active:not(.oripagate-portal-active) .ndc-section-head,
body.oripagate-skin-active:not(.oripagate-portal-active) .ndc-section-title {
	border: 0 !important;
	background: linear-gradient(90deg, #111a2d, #18243a) !important;
	color: #fff7da !important;
}

body.oripagate-skin-active:not(.oripagate-portal-active) .ndc-card-grid {
	gap: 12px !important;
}

body.oripagate-skin-active:not(.oripagate-portal-active) .ndc-card {
	border: 1px solid #e0c986 !important;
	border-radius: 8px !important;
	background: #fff !important;
	box-shadow: 0 1px 0 rgba(18, 28, 45, .03) !important;
	overflow: hidden;
}

body.oripagate-skin-active:not(.oripagate-portal-active) .ndc-card__title {
	color: #101827 !important;
	font-weight: 900 !important;
}

body.oripagate-skin-active:not(.oripagate-portal-active) .ndc-pill,
body.oripagate-skin-active:not(.oripagate-portal-active) .ndc-badge {
	border-radius: 999px !important;
	background: #f5fbf8 !important;
	color: #216b42 !important;
	font-weight: 800 !important;
}

body.oripagate-skin-active:not(.oripagate-portal-active) .ndc-card__actions a,
body.oripagate-skin-active:not(.oripagate-portal-active) .wp-block-button__link {
	border-radius: 6px !important;
	background: linear-gradient(135deg, #1a2335, #0b1020) !important;
	color: #fff !important;
	font-weight: 900 !important;
	text-decoration: none !important;
	box-shadow: inset 0 0 0 1px rgba(244, 186, 61, .28);
}

body.oripagate-skin-active:not(.oripagate-portal-active) #footer {
	margin-top: 24px;
	background: #101827 !important;
	color: #dce7f7 !important;
}

@media (max-width: 900px) {
	body.oripagate-skin-active:not(.oripagate-portal-active) #content-in {
		grid-template-columns: 1fr !important;
	}

	body.oripagate-skin-active:not(.oripagate-portal-active) #main,
	body.oripagate-skin-active:not(.oripagate-portal-active) #sidebar {
		grid-column: 1 !important;
	}
}

body.oripagate-portal-active #header-container,
body.oripagate-portal-active #navi,
body.oripagate-portal-active #breadcrumb,
body.oripagate-portal-active .entry-title,
body.oripagate-portal-active .date-tags,
body.oripagate-portal-active .sns-share,
body.oripagate-portal-active .sns-follow,
body.oripagate-portal-active .under-entry-content,
body.oripagate-portal-active #sidebar,
body.oripagate-portal-active #footer,
body.oripagate-portal-active #go-to-top,
body.oripagate-portal-active .mobile-footer-menu-buttons {
	display: none !important;
}

body.oripagate-portal-active #container,
body.oripagate-portal-active #content,
body.oripagate-portal-active #content-in,
body.oripagate-portal-active #main,
body.oripagate-portal-active .article,
body.oripagate-portal-active .entry-content {
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	float: none !important;
}

body.oripagate-portal-active .entry-content > .ogp-site {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}

.ogp-site {
	--ogp-ink: #101827;
	--ogp-muted: #667085;
	--ogp-line: #d8bc72;
	--ogp-soft: #f4f7fb;
	--ogp-panel: #ffffff;
	--ogp-navy: #0b1020;
	--ogp-gold: #f4ba3d;
	--ogp-green: #37a66b;
	--ogp-blue: #3677d8;
	--ogp-red: #b92f36;
	box-sizing: border-box;
	max-width: 1180px;
	margin: 0 auto;
	padding: 18px 12px 32px;
	color: var(--ogp-ink);
	font-family: inherit;
}

.ogp-site * {
	box-sizing: border-box;
}

.ogp-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	padding: 14px 10px 12px;
	background:
		linear-gradient(135deg, rgba(8, 13, 23, .88) 0%, rgba(18, 27, 45, .9) 58%, rgba(8, 13, 23, .92) 100%),
		url("oripagate-stage-bg-v1.jpg") center 18% / cover no-repeat;
	border: 1px solid rgba(244, 186, 61, .7);
	border-bottom: 0;
	border-radius: 8px 8px 0 0;
	box-shadow: 0 14px 36px rgba(3, 7, 15, .2), inset 0 1px 0 rgba(255, 255, 255, .08);
}

.ogp-logo {
	font-size: 31px;
	font-weight: 800;
	line-height: 1.05;
	color: #fff7da;
	text-shadow: 0 2px 0 rgba(0, 0, 0, .45), 0 0 22px rgba(244, 186, 61, .22);
}

.ogp-tagline {
	margin-top: 5px;
	color: #f4d488;
	font-size: 13px;
	font-weight: 700;
}

.ogp-search {
	display: flex;
	width: min(360px, 44vw);
	margin: 0;
}

.ogp-search input {
	flex: 1;
	min-width: 0;
	height: 39px;
	padding: 0 12px;
	border: 1px solid rgba(244, 186, 61, .58);
	border-right: 0;
	border-radius: 6px 0 0 6px;
	background: #fffaf0;
	font-size: 13px;
}

.ogp-search button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 43px;
	height: 39px;
	border: 0;
	border-radius: 0 6px 6px 0;
	background: linear-gradient(135deg, #1a2335, #070b14);
	color: #fff;
	font-size: 17px;
	cursor: pointer;
}

.ogp-nav {
	display: flex;
	align-items: center;
	gap: 4px;
	padding: 0 10px 12px;
	background:
		linear-gradient(90deg, rgba(244, 186, 61, .12), transparent 18%, transparent 82%, rgba(66, 145, 255, .13)),
		#0c1321;
	border: 1px solid rgba(244, 186, 61, .7);
	border-top: 0;
}

.ogp-nav a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 31px;
	padding: 7px 10px;
	border-radius: 6px;
	color: #f9fafb !important;
	-webkit-text-fill-color: #f9fafb !important;
	text-decoration: none;
	font-size: 12px;
	font-weight: 800;
	white-space: nowrap;
	text-shadow: none !important;
	opacity: 1 !important;
}

.ogp-nav a:link,
.ogp-nav a:visited {
	color: #f9fafb !important;
	-webkit-text-fill-color: #f9fafb !important;
}

.ogp-nav a:hover,
.ogp-nav a:focus,
.ogp-nav a:focus-visible,
.ogp-nav a:active {
	background: rgba(244, 186, 61, .16) !important;
	color: #ffd86c !important;
	-webkit-text-fill-color: #ffd86c !important;
}

.ogp-top-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 310px;
	gap: 14px;
	padding: 14px;
	background:
		linear-gradient(180deg, rgba(10, 16, 32, .88), rgba(10, 16, 32, .98)),
		url("oripagate-stage-bg-v1.jpg") center top / cover no-repeat;
	border: 1px solid #17223a;
	border-radius: 0 0 8px 8px;
}

.ogp-main-area {
	display: grid;
	gap: 14px;
	min-width: 0;
}

.ogp-sidebar {
	display: grid;
	align-content: start;
	gap: 14px;
	min-width: 0;
}

.ogp-hero {
	position: relative;
	min-height: 325px;
	overflow: hidden;
	padding: 46px 34px;
	border: 1px solid #2b3855;
	border-radius: 8px;
	background:
		linear-gradient(135deg, rgba(7, 16, 31, .78) 0%, rgba(17, 28, 49, .76) 55%, rgba(7, 13, 24, .9) 100%),
		url("oripagate-stage-bg-v1.jpg") center 43% / cover no-repeat;
	color: #fff;
}

.ogp-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	background:
		linear-gradient(110deg, rgba(255, 255, 255, .08) 0 1px, transparent 1px 44px),
		linear-gradient(45deg, transparent 0 42%, rgba(244, 186, 61, .17) 43% 47%, transparent 48%);
	opacity: .7;
}

.ogp-hero-copy {
	position: relative;
	z-index: 2;
	max-width: 570px;
}

.ogp-eyebrow {
	display: inline-flex;
	margin: 0 0 18px;
	padding: 6px 11px;
	border: 1px solid rgba(244, 186, 61, .72);
	border-radius: 999px;
	background: rgba(255, 255, 255, .08);
	color: #ffe2a1;
	font-size: 13px;
	font-weight: 800;
}

.ogp-hero h1 {
	margin: 0 0 13px;
	color: #fff;
	font-size: 31px;
	font-weight: 800;
	line-height: 1.32;
}

.ogp-hero h1 strong {
	color: #ffd469;
	font-weight: 900;
}

.ogp-hero p {
	margin: 0 0 22px;
	color: #dce7f7;
	font-size: 15px;
	line-height: 1.85;
}

.ogp-hero-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.ogp-hero-actions a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 38px;
	padding: 8px 12px;
	border: 1px solid rgba(244, 186, 61, .78);
	border-radius: 6px;
	background: rgba(5, 10, 20, .62);
	color: #fff;
	text-decoration: none;
	font-size: 13px;
	font-weight: 800;
}

.ogp-hero-visual {
	position: absolute;
	right: 22px;
	bottom: 32px;
	z-index: 1;
	width: 320px;
	height: 190px;
	pointer-events: none;
}

.ogp-card,
.ogp-gate {
	position: absolute;
	display: block;
	box-shadow: 0 18px 45px rgba(0, 0, 0, .42);
}

.ogp-card {
	width: 96px;
	height: 138px;
	border: 2px solid rgba(255, 255, 255, .64);
	border-radius: 10px;
}

.ogp-card::after {
	content: "";
	position: absolute;
	inset: 16px 12px;
	border: 2px solid rgba(255, 255, 255, .42);
	border-radius: 8px;
}

.ogp-card-a {
	left: 0;
	top: 34px;
	transform: rotate(-15deg);
	background: linear-gradient(145deg, #fff1bf, #f15e54 54%, #172338);
}

.ogp-card-b {
	right: 2px;
	top: 35px;
	transform: rotate(15deg);
	background: linear-gradient(145deg, #ffe8ba, #efb43f 52%, #172338);
}

.ogp-card-c {
	left: 111px;
	top: 0;
	transform: rotate(1deg);
	background: linear-gradient(145deg, #e8f1ff, #6093e9 55%, #18233b);
}

.ogp-gate {
	left: 96px;
	bottom: 0;
	width: 122px;
	height: 82px;
	border: 2px solid rgba(244, 186, 61, .72);
	border-radius: 12px;
	background: rgba(5, 10, 20, .74);
}

.ogp-gate::before {
	content: "";
	position: absolute;
	inset: 24px 43px;
	border: 2px solid rgba(244, 186, 61, .88);
	border-radius: 50%;
}

.ogp-main-panels {
	display: grid;
	grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
	gap: 14px;
}

.ogp-panel,
.ogp-side-panel {
	border: 1px solid var(--ogp-line);
	border-radius: 8px;
	background: var(--ogp-panel);
	padding: 14px;
}

.ogp-panel h2,
.ogp-side-panel h2 {
	margin: 0 0 12px;
	padding: 0;
	color: #111827;
	font-size: 16px;
	font-weight: 800;
	line-height: 1.35;
}

.ogp-purpose-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 9px;
}

.ogp-purpose-grid a {
	display: flex;
	align-items: center;
	gap: 8px;
	min-height: 42px;
	padding: 8px;
	border: 1px solid #e0e7f1;
	border-radius: 7px;
	background: #fff;
	color: #182235;
	text-decoration: none;
	font-size: 12px;
	font-weight: 800;
}

.ogp-purpose-grid em {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	border-radius: 6px;
	background: #eef5ff;
	color: #2366c7;
	font-style: normal;
	font-size: 12px;
}

.ogp-genre-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 9px;
}

.ogp-genre-grid a {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	min-height: 75px;
	padding: 8px 6px;
	border: 1px solid #e0e7f1;
	border-radius: 7px;
	background: #fff;
	color: #182235;
	text-align: center;
	text-decoration: none;
	font-size: 11px;
	font-weight: 800;
	line-height: 1.35;
}

.ogp-mini-icon {
	display: block;
	width: 32px;
	height: 32px;
	margin-bottom: 7px;
	border: 1px solid rgba(20, 31, 52, .12);
	border-radius: 9px;
}

.ogp-mini-icon.red { background: linear-gradient(135deg, #ffe6d8, #ef6d62); }
.ogp-mini-icon.blue { background: linear-gradient(135deg, #e7f2ff, #6fa1eb); }
.ogp-mini-icon.gold { background: linear-gradient(135deg, #fff1bd, #efbd45); }
.ogp-mini-icon.green { background: linear-gradient(135deg, #e5f8ed, #58bd80); }

.ogp-safety {
	padding-bottom: 12px;
}

.ogp-chip-row {
	display: flex;
	flex-wrap: wrap;
	gap: 9px;
}

.ogp-chip-row a {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	min-height: 35px;
	padding: 8px 11px;
	border: 1px solid #dcefe5;
	border-radius: 7px;
	background: #f5fcf8;
	color: #216b42;
	text-decoration: none;
	font-size: 12px;
	font-weight: 800;
}

.ogp-chip-row a::before {
	content: "";
	width: 15px;
	height: 15px;
	border-radius: 50%;
	background: var(--ogp-green);
	box-shadow: inset 0 0 0 4px #dff5e8;
}

.ogp-ranking-list {
	display: grid;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ogp-ranking-list li {
	display: grid;
	grid-template-columns: 27px minmax(0, 1fr) auto;
	gap: 8px;
	align-items: center;
	padding: 7px 0;
	border-bottom: 1px solid #edf1f6;
}

.ogp-ranking-list li:last-child {
	border-bottom: 0;
}

.ogp-rank-num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	border-radius: 7px;
	background: #f3b43c;
	color: #fff;
	font-size: 12px;
	font-weight: 900;
}

.ogp-ranking-list a {
	min-width: 0;
	color: #172033;
	text-decoration: none;
}

.ogp-ranking-list b {
	display: block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 13px;
	line-height: 1.35;
}

.ogp-ranking-list small {
	display: block;
	overflow: hidden;
	margin-top: 2px;
	color: #677389;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 10px;
}

.ogp-stars {
	color: #f3b43c;
	font-size: 12px;
	letter-spacing: 0;
	white-space: nowrap;
}

.ogp-dark-button {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 35px;
	margin-top: 12px;
	border-radius: 6px;
	background: #172033;
	color: #fff !important;
	text-decoration: none;
	font-size: 12px;
	font-weight: 800;
}

.ogp-updates {
	display: grid;
	gap: 10px;
}

.ogp-updates a {
	display: grid;
	grid-template-columns: 72px minmax(0, 1fr);
	gap: 9px;
	align-items: center;
	color: #172033;
	text-decoration: none;
}

.ogp-updates img,
.ogp-thumb-fallback {
	width: 72px;
	height: 44px;
	border-radius: 4px;
	object-fit: cover;
	background: linear-gradient(135deg, #172033 0%, #5a4b22 44%, #f3b43c 100%);
}

.ogp-updates a:nth-child(5n+1) .ogp-thumb-fallback {
	background:
		linear-gradient(135deg, rgba(9, 15, 31, .18), rgba(255, 255, 255, 0)),
		linear-gradient(135deg, #211331 0%, #8f126e 48%, #e0a838 100%);
}

.ogp-updates a:nth-child(5n+2) .ogp-thumb-fallback {
	background:
		radial-gradient(circle at 78% 22%, rgba(255, 212, 92, .85), rgba(255, 212, 92, 0) 22%),
		linear-gradient(135deg, #2a145d 0%, #7618c7 54%, #25103e 100%);
}

.ogp-updates a:nth-child(5n+3) .ogp-thumb-fallback {
	background:
		linear-gradient(145deg, rgba(255, 255, 255, .14) 0 18%, transparent 18% 100%),
		linear-gradient(135deg, #8a0d4d 0%, #e62591 58%, #3b134c 100%);
}

.ogp-updates a:nth-child(5n+4) .ogp-thumb-fallback {
	background:
		linear-gradient(110deg, rgba(255, 255, 255, .16) 0 23%, transparent 23% 100%),
		linear-gradient(135deg, #142237 0%, #0c6c60 48%, #8be047 100%);
}

.ogp-updates a:nth-child(5n) .ogp-thumb-fallback {
	background:
		radial-gradient(circle at 30% 45%, rgba(255, 255, 255, .35), rgba(255, 255, 255, 0) 24%),
		linear-gradient(135deg, #b60f66 0%, #e83f9d 54%, #ffb47c 100%);
}

.ogp-updates b {
	display: -webkit-box;
	overflow: hidden;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	font-size: 12px;
	line-height: 1.45;
}

.ogp-updates small {
	display: block;
	margin-top: 2px;
	color: #6b7688;
	font-size: 10px;
}

.ogp-price-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 8px;
}

.ogp-price-grid a,
.ogp-dictionary-links a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	min-height: 38px;
	padding: 8px 10px;
	border: 1px solid #e1e7f0;
	border-radius: 7px;
	background: #fff;
	color: #172033;
	text-decoration: none;
	font-size: 12px;
	font-weight: 800;
}

.ogp-price-grid a {
	justify-content: center;
	background: #fffaf0;
	border-color: #ead895;
	color: #533c12;
}

.ogp-dictionary-links {
	display: grid;
	gap: 8px;
}

.ogp-dictionary-links b {
	color: #68758a;
	font-size: 11px;
}

.ogp-table-panel {
	padding: 0;
	overflow: hidden;
}

.ogp-table-panel h2 {
	padding: 14px 14px 0;
}

.ogp-table-wrap {
	overflow-x: auto;
	padding: 0 14px 14px;
}

.ogp-table {
	width: 100%;
	min-width: 720px;
	border-collapse: collapse;
	font-size: 12px;
}

.ogp-table th,
.ogp-table td {
	padding: 10px 9px;
	border-bottom: 1px solid #edf1f6;
	text-align: left;
	vertical-align: middle;
}

.ogp-table th {
	background: #f5f7fb;
	color: #263247;
	font-weight: 800;
}

.ogp-detail {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 28px;
	padding: 5px 9px;
	border-radius: 5px;
	background: #172033;
	color: #fff !important;
	text-decoration: none;
	font-size: 11px;
	font-weight: 800;
	white-space: nowrap;
}

.ogp-empty {
	margin: 0;
	color: #68758a;
	font-size: 13px;
	line-height: 1.7;
}

@media (max-width: 980px) {
	.ogp-top-grid {
		grid-template-columns: 1fr;
	}

	.ogp-main-panels {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 680px) {
	.ogp-site {
		padding: 8px 6px 24px;
	}

	.ogp-header {
		display: block;
		padding: 14px 10px;
	}

	.ogp-search {
		width: 100%;
		margin-top: 12px;
	}

	.ogp-nav {
		flex-wrap: wrap;
		gap: 8px;
	}

	.ogp-nav a {
		flex: 1 1 calc(50% - 8px);
		border: 1px solid rgba(244, 186, 61, .72);
		background: #fffaf0 !important;
		color: #0b1628 !important;
		-webkit-text-fill-color: #0b1628 !important;
		text-shadow: none !important;
		opacity: 1 !important;
	}

	.ogp-nav a:link,
	.ogp-nav a:visited {
		color: #0b1628 !important;
		-webkit-text-fill-color: #0b1628 !important;
	}

	.ogp-nav a:hover,
	.ogp-nav a:focus,
	.ogp-nav a:focus-visible,
	.ogp-nav a:active {
		background: #172033 !important;
		color: #ffd86c !important;
		-webkit-text-fill-color: #ffd86c !important;
	}

	.ogp-top-grid {
		padding: 10px;
	}

	.ogp-hero {
		min-height: 320px;
		padding: 28px 18px;
	}

	.ogp-hero h1 {
		font-size: 25px;
	}

	.ogp-hero-visual {
		opacity: .24;
		right: -90px;
	}

	.ogp-purpose-grid,
	.ogp-genre-grid,
	.ogp-price-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 420px) {
	.ogp-purpose-grid,
	.ogp-genre-grid {
		grid-template-columns: 1fr;
	}
}