@charset "UTF-8";

/*
 ============================================================
 loto6-db.com 統合版 style.css
 - 旧 style.css の基本設定
 - common.css の既存レイアウト/部品
 - 2026年向けレスポンシブ調整
 ============================================================
*/

/*
 Theme base refresh for loto6-db.com
 既存テーマのHTML構造を維持しながら、古い全要素指定を整理
*/

* {
    margin: 0;
    padding: 0;
    border: 0;
    box-sizing: border-box;
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    font-style: inherit;
    background-color: transparent;
    color: inherit;
}

html {
    font-size: 16px;
}

body {
    margin: 0;
    padding: 0;
    color: #2f343b;
    background: #f6f8fb;
    font-family:
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        "Hiragino Kaku Gothic ProN",
        "Yu Gothic",
        "Meiryo",
        sans-serif;
    font-size: 16px;
    line-height: 1.8;
}

a {
    color: #1867a9;
    text-decoration: none;
}

a:hover {
    color: #2c7cff;
    text-decoration: underline;
}

ul {
    list-style: none;
}

img {
    max-width: 100%;
    height: auto;
}

.cntr {
    text-align: center;
}

input,
textarea,
select,
button {
    border: 1px solid #d9dee5;
    font: inherit;
}

p.last-update {
    margin: 0 0 10px;
    width: 100%;
    text-align: right;
    font-size: 12px;
    color: #8a929c;
}

/* 旧レイアウト互換 */
div.wrap {
    width: min(1180px, 94%);
    margin: 0 auto;
}

div.body {
    width: min(1180px, 94%);
    margin: 32px auto 0;
}

div.single-body-main {
    width: calc(100% - 352px);
    float: left;
}

div.builder-body {
    width: 100%;
    padding: 36px 40px;
    background: #fff;
    border: 1px solid #edf0f3;
    border-radius: 8px;
}

div.related {
    width: 100%;
}

div.bottom,
div.bottom-ad {
    width: 100%;
}

div.footer {
    width: 100%;
    background: #111827;
}

.clearfix::after {
    content: "";
    display: table;
    clear: both;
}

.clearfix {
    display: block;
}

@media screen and (max-width: 900px) {

    div.wrap,
    div.body {
        width: 94%;
    }

    div.single-body-main {
        width: 100%;
        float: none;
    }

    div.builder-body {
        padding: 28px 24px;
    }
}

@media screen and (max-width: 600px) {

    div.wrap,
    div.body {
        width: 100%;
    }

    div.builder-body {
        padding: 22px 16px;
        border-radius: 0;
    }
}


/* COMMON */
*{
	margin: 0px ;
	padding: 0px ;
}

body {
	font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック",monospace ;
	background: #ffffff;
}

a {
	color: #5507FF ;
	text-decoration: none ;
}

a:hover {
	opacity: 0.7 ;
	filter: alpha(opacity=70) ;
	-ms-filter: "alpha( opacity=70 )" ;
}


ul{
	margin: 0px 30px 0px 0px;
	padding: 0px ;
	list-style: none;
}

table {
	margin: 5px auto 0px auto ;
	padding:0px;
	width: 100% ;
	border: 1px #666666 solid;
	border-collapse: collapse;
	border-spacing: 0;
	font-size: 1em;
	line-height:2em;
}

table th {
	padding: 1px ;
	vertical-align: top ;
	border: 1px #666666 solid ;
	border-width: 0 0 1px 1px ;
	background-color: #96c8ff ;
	text-align: center ;
}

table td {
	padding: 1px;
	vertical-align: top ;
	text-align: right;
	border: 1px #666666 solid;
	border-width: 0 0 1px 1px;
	background-color: #ffffff ;
	text-align: center ;
}

table#deme {
	font-size: .6em;
	line-height:1em;
}

table#deme th {
	padding: 1px ;
	vertical-align: top ;
	border: 1px #666666 solid ;
	border-width: 0 0 1px 1px ;
	background-color: #96c8ff ;
	text-align: center ;
}

table#deme td {
	padding: 1px;
	vertical-align: top ;
	text-align: right;
	border: 1px #666666 solid;
	border-width: 0 0 1px 1px;
	background-color: #ffffff ;
	text-align: center ;
}

p.deme {
	margin: 0em 0px 1.1em 0px ;
	padding: 0.4em 0px 0em 0px;
	font-size: .6em;
	line-height:1em;
	color: #333333 ;
	text-align: left ;
}

.marker {
	background: linear-gradient(transparent 0%, #ffff66 0%);
	font-weight: bold; 
}

.hit {
	font-weight: bold;
	color: #FF6600;
}

h1 {
	padding: 0px 0px 0.2em 0px;
	border-bottom: 2px dashed #1867a9 ;
	font-size: 1.7em;
	color: #333333;
	width: 100% ;
}

h3 {
	margin: 2em auto 1em auto ;
	color: #000000 ;
	text-align: left ;
	font-weight: bold ;
	width: 100% ;
}


p {
	margin: 0em 0px 1.1em 0px ;
	padding: 0.4em 0px 0em 0px;
	font-size: 1em;
	line-height:2em;
	color: #333333 ;
	text-align: left ;
}

p.gad {
	padding-top: 32px ;
	font-size: 0.75em;
}

header{
	margin: 0px;
	padding: 0px 0px 0px 0px;
	background: #ffffff;
}

header .inner{
	display: flex;
	justify-content: flex-end;
	align-items: center;
	position: relative;
	text-align: center;
	background: #000000;
}

header .inner:before {
	position: absolute;
	top: 100%;
	left: 50%;
	background: #000000;
}





header nav {
	padding: 10px 0px 10px 0px;
	width: 100%;
}

header nav ul{
	margin: 0px auto 0px auto;
	display: flex;
	align-items: center;
	width: 1100px;
}

header nav ul li a{
	color: #000000;
	text-decoration: none;
	padding: 16px ;
}

#nav_toggle{
	display: none;
}


div.breadcrumbs {
	margin: 32px auto 40px auto ;
	width: 1100px ;
	height: auto ;
	font-size: .75em;
	line-height: 1em;
}

div.body {
	margin: 96px auto 0px auto ;
	width: 1100px ;
	height: auto ;
}

footer {
	margin: 32px 0px 0px 0px ;
	padding: 10px 0px 10px 0px ;
	width: 100% ;
	background-color: #000000 ;
}

div.footer-body {
	margin: 0px auto 0px auto ;
	width: 1100px ;
	height: auto ;
}

div.footer-body ul {
	margin: 0px 0px 30px 20px ;
	list-style-type: disc ;
}

div.footer-body ul li {
	padding: 0px 0px 0.5em 0px ;
	line-height: 1.5em;
}


div.copyright {
	margin: 8px 0px 8px 0px ;
	width: 100% ;
	font-size: .75em;
	line-height: 0.8em;
	text-align: center ;
	color: #ffffff ;
}


div.ad {
	margin: 32px auto 32px auto ;
	width: 100% ;
	height: auto ;
}

/* NEWS */


div.list {
	margin: 0px auto 50px 15px;
	padding: 19px ;
	width: 676px ;
	float: left ;
	background: #ffffff;
}

div.archive-headline {
    padding: 0px 19px 40px 19px ;
    width: 300px ;
    min-height: 230px ; 
    height: auto !important ; 
    background-color: #ffffff ;
    float: left ;
}

div.archive-headline a {
    color: #333333 ;
}


div.archive-headline div.title {
    margin: 0px 0px 7px 0px ;
}

div.archive-headline div.date-and-time {
    font-size: 0.75em;
}



div.main {
	margin: 0px auto 50px 15px;
	padding: 32px ;
	width: 650px ;
	float: left ;
	background: #ffffff;
}

div.main-deme {
	margin: 0px auto 50px 0px;
	padding: 32px ;
	width: 1040px ;
	background: #ffffff;
}

div.main h2,
div.main-deme h2 {
	margin: 80px 0px 40px 0px;
	position: relative;
	padding: 0.6em 1em ;
	font-size: 1.5em;
	background: #e0edff;
}

div.main h2:after,
div.main-deme h2:after {
	position: absolute;
	content: '';
	top: 100%;
	left: 30px;
	border: 15px solid transparent;
	border-top: 15px solid #e0edff;
	width: 0;
	height: 0;
}

div.main h2#summary,
div.main-deme h2#summary {
	color: #ffffff;
	background: #2c7cff;
}

div.main h2#summary:after,
div.main-deme h2#summary:after {
	border-top: 15px solid #2c7cff;
}

div.main p.date,
div.main-deme p.date {
    margin: 0.5em 0px 2em 0px ;
    width: 100% ;
    font-size: .85em ;
    line-height: 1em ;
    text-align: left ;
}

div.main p.top-img {
    margin: 0em 0em 1em 0em ;
}



div.side {
    margin: 0px 0px 0px 15px ;
    width: 336px ;
    float: right ;
}

div.side h4 {
	margin: 0px 0px 40px 0px;
	position: relative;
	padding: 0.6em 1em ;
	font-size: 1em;
	color: #ffffff;
	text-align: center;
	background: #2c7cff;
}

div.side ul {
	margin: 0px 0px 30px 0px ;
	list-style: none;
}


div.side ul li {
	padding: 0px 0px 0.75em 0px ;
	line-height: 1.5em;
}



/* 新着記事 */
#new-entries,
#popularity-articles{
  line-height:150%;
  margin-bottom:20px;
}

#new-entries h4,
#popularity-articles h4{
  margin-bottom:15px;
}

#new-entries .new-entry,
#popularity-articles .new-entry{
  clear:both;
}

#new-entries .new-entry-thumb,
#popularity-articles .new-entry-thumb{
  float: left;
  margin-bottom:10px;
  padding-bottom:5px;
}

#new-entries .new-entry-content,
#popularity-articles .new-entry-content{
  margin-left: 95px;
  margin-bottom:10px;
}


.addtoany_share_save_container {
	padding: 3em 0px 0px 0px ;
}


div.side div.tw {
	padding-top: 32px ;
}



.scroll-table {
  overflow: auto;
  white-space: nowrap;
}



/*スマホ・タブレット用の設定*/
@media screen and (max-width: 900px){
	header{
		padding: 5px 0;
		position: relative;
	}

	.inner{
		width: 100%;
	}

	body {
		background: #ffffff;
	}



	div.breadcrumbs {
		width: 92% ;
	}

	div.body {
		margin: 16px auto 0px auto;
		padding: 0px;
		width: 100% ;
	}

	div.main-deme {
		margin: 0px auto 50px 0px;
		padding: 32px ;
		width: 100% ;
	}

	div.body p img {
		width: 100% ;
        }

	div.list,
	div.main {
		margin: 0px auto 50px auto;
		padding: 3% ;
		width: 96% ;
		float: none ;
	}

	div.main img {
		width: 100%;
	}


	div.archive-headline {
		margin: 0px auto 0px ;
		width: 94% ;
		float: none;
	}

	div.archive-headline img {
		width: 100% ;
	}

	div.side {
		margin: 0px auto 50px auto ;
		padding: 0px;
		width: 94% ;
		float: none ;
	}

	p {
		margin: 0px 1em 1em 1em ;
		padding: 0px;
		font-size: 1em;
		line-height:1.5em;
	}


	div.main h2 {
		margin: 2em 0px 1em 0px;
		position: relative;
		padding: 0.5em 1em ;
		font-size: 1em;
	}

	div.footer-body {
		margin: 16px auto 0px auto;
		padding: 0px;
		width: 94% ;
	}
}



/*列ヘッダ固定テーブル*/
/*https://qiita.com/s0tter/items/14fb4ec2600828a21a22*/
.sticky_table {
  display: block;
  position: relative;
  overflow: scroll;
  width: calc(100vw - 3.0rem);
  height: calc(75vh);
  border-collapse: collapse;
  font-size: 0;
}

.sticky_table thead,
.sticky_table tbody {
  display: block;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
}

.sticky_table th,
.sticky_table td {
  display: inline-block;
  width: 8.0rem;
  background: #fff;
  font-size: 1.0rem;
}

.sticky_table tbody th {
  position: -webkit-sticky;
  position: sticky;
  left: 0;
  z-index: 1;
}

.sticky_table thead {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 2;
}

.sticky_table thead th.blank {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  left: 0;
  z-index: 3;
}




















.clearfix:after {
    content: "."; 
    display: block;
    height: 0; 
    clear: both; 
    visibility: hidden;
}
.clearfix {
    display: inline-block;
}
/* Hides from IE-mac \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* End hide from IE-mac */




























		/* header */
		#top-head {
			position: fixed;
			width: 100%;
			margin: 0 auto;
			padding: 25px 0 0;
			z-index: 999;
		}

		#top-head a,
		#top-head {
			color: #fff;
			text-decoration: none;
		}

		#top-head .inner {
			position: relative;

		}
		#top-head .logo {
			float: left;
			margin-left: 25px;
			font-size: 24px;
			font-family: 'Anton', sans-serif;
			font-size: 16px;
		}


		#global-nav ul {
			list-style: none;
			position: absolute;
			right: 0;
			bottom: 0;
			font-size: 14px;
		}
		#global-nav ul li {
			float: left;
			position: relative;
			font-family: 'Anton', sans-serif;
		}
		#global-nav ul li a {
			padding: 0 10px;
			font-family: 'Anton', sans-serif;
		}

		#global-nav ul li a:hover {
			color: #999999 ;
		}

		#global-nav ul li a img {
			height: 16px ;
		}




/* Toggle Button */
#nav-toggle {
	display: none;
	position: absolute;
	right: 15px;
	top: 16px;
	width: 24px;
	height: 24px;
	cursor: pointer;
	z-index: 101;
}

#nav-toggle div {
	position: relative;
}
#nav-toggle span {
	display: block;
	position: absolute;
	height: 1px;
	width: 100%;
	background: #ffffff ;
	left: 0;
	-webkit-transition: .35s ease-in-out;
	-moz-transition: .35s ease-in-out;
	transition: .35s ease-in-out;
}

#nav-toggle span:nth-child(1) {
	top: 0;
}
#nav-toggle span:nth-child(2) {
	top: 8px;
}
#nav-toggle span:nth-child(3) {
	top: 16px;
}

@media screen and (max-width: 980px) {
	article {
		padding: 0 0px;
	}
	.inner {
		width: 100%;
		padding: 0 20px;
	}
	#global-nav ul li a {
		padding: 0 20px;
	}
	#top-head.fixed #global-nav ul li a {
		padding: 0 15px;
	}
}


	#top-head,
	.inner {
		width: 100%;
		padding: 0;
	}
	#top-head {
		top: 0;
		position: fixed;
		margin-top: 0;
	}



/* モバイル */
/* スマホ　767px以下 */
@media only screen and (max-width: 767px) {


	article {
	    margin: 50px auto ;
	    width: 100% ;
	    height: auto ;
	    text-align: center;
	    line-height: 1.9;
	}

	article h3 {
	    font-size: 1em;
	}

	h2 {
		font-size: 100% ;
		line-height: 200% ;
	}

	p {
		font-size: 10px ;
		line-height: 16px ;
		text-align: left ;
	}

	.pc_none {
		display : block
	}

	.mb_none {
		display : none
	}


	/* Fixed reset */
	#top-head.fixed {
		padding-top: 0;
		background: transparent;
	}


	#mobile-head {
		background: #000000;
		width: 100%;
		height: 56px;
		z-index: 999;
		position: relative;
	}

	#top-head.fixed .logo,
	#top-head .logo {
		position: absolute;
		top: 50%;
		left: 50%;
		-ms-transform: translate(-50%,-50%);
		-webkit-transform: translate(-50%,-50%);
		transform: translate(-50%,-50%);
		margin:0;/*余計な隙間を除く*/
		padding:0;/*余計な隙間を除く*/
	}

	#global-nav {
		position: absolute;
		/* 開いてないときは画面外に配置 */
		top: -600px;
		background: #000000;
		width: 100%;
		text-align: center;
		padding: 10px 0;
		-webkit-transition: .5s ease-in-out;
		-moz-transition: .5s ease-in-out;
		transition: .5s ease-in-out;
	}
	#global-nav ul {
		margin-top: 24px ;
		margin-bottom: 32px ;
		list-style: none;
		position: static;
		right: 0;
		bottom: 0;
	}
	#global-nav ul li {
		float: none;
		position: static;
	}
	#global-nav ul li:after  {
		display: none;
	}
	#top-head #global-nav ul li a,
	#top-head.fixed #global-nav ul li a {
		width: 100%;
		display: block;
		color: #fff;
		font-size: 16px;
		line-height:16px ;
		padding: 8px 0;
	}

	#top-head #global-nav ul li a div,
	#top-head.fixed #global-nav ul li a  div {
		width: 100%;
		font-size:8px;
		line-height:16px ;
	}

	#nav-toggle {
		display: block;
	}


	/* #nav-toggle 切り替えアニメーション */
	.open #nav-toggle span:nth-child(1) {
		top: 11px;
		-webkit-transform: rotate(315deg);
		-moz-transform: rotate(315deg);
		transform: rotate(315deg);
	}
	.open #nav-toggle span:nth-child(2) {
		width: 0;
		left: 50%;
	}
	.open #nav-toggle span:nth-child(3) {
		top: 11px;
		-webkit-transform: rotate(-315deg);
		-moz-transform: rotate(-315deg);
		transform: rotate(-315deg);
	}
	/* #global-nav スライドアニメーション */
	.open #global-nav {
		/* #global-nav top + #mobile-head height */
		-moz-transform: translateY(656px);
		-webkit-transform: translateY(656px);
		transform: translateY(656px);
	}




	footer {
		height: auto ;
	}

	div.inner-ft {
		padding: 40px 0px 24px 0px;
		width: 100%;
		height: auto ;
		position: static;
	}

	div.inner-ft div.logo-ft {
		margin: 0px auto ;
		width: 86% ;
		height: 250px ;
		position: static;
	}

	div.inner-ft div.logo-ft ul {
		width: 50% ;
                list-style: none;
		text-align: left ;
		float: left ;
	}

	div.inner-ft div.logo-ft ul li {
                list-style: none;
		font-size: 85% ;
		line-height: 160% ;
		text-align: left ;
	}

	div.inner-ft div.addr-ft {
		margin: 0px auto ;
		width: 90% ;
		height: 100px ;
		position: static;
	}

	div.inner-ft div.addr-ft h4,
	div.inner-ft div.addr-ft p {
		text-align: center ;
	}

	div.inner-ft div.copyright {
		margin-top: 80px ;
		width: 100% ;
		text-align: center ;
		font-size: 40% ;
		height: 15px ;
		position: static;
	}



}

/* =========================================================
   2026 Layout Refresh
   loto6-db.com
   既存HTMLを崩さず、PC/スマホの読みやすさを改善
   ========================================================= */

:root {
    --loto-blue: #2c7cff;
    --loto-blue-dark: #1867a9;
    --loto-blue-soft: #eef5ff;
    --loto-text: #2f343b;
    --loto-muted: #6b7280;
    --loto-border: #dfe4ea;
    --loto-bg: #f6f8fb;
    --loto-white: #ffffff;
}

/* 基本 */
html {
    box-sizing: border-box;
    font-size: 16px;
}

*,
*::before,
*::after {
    box-sizing: inherit;
}

body {
    margin: 0;
    color: var(--loto-text);
    background: var(--loto-bg);
    font-family:
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        "Hiragino Kaku Gothic ProN",
        "Yu Gothic",
        "Meiryo",
        sans-serif;
    font-size: 16px;
    line-height: 1.8;
}

a {
    color: var(--loto-blue-dark);
    text-decoration: none;
}

a:hover {
    opacity: 1;
    color: var(--loto-blue);
    text-decoration: underline;
}

img {
    max-width: 100%;
    height: auto;
}

/* ヘッダー */
header {
    background: var(--loto-white);
}

header .inner {
    background: #111827;
}

header nav {
    padding: 0;
}

header nav ul {
    width: min(1180px, 94%);
    min-height: 58px;
    margin: 0 auto;
    padding: 0;
    gap: 2px;
}

header nav ul li a {
    display: block;
    padding: 18px 14px;
    color: #ffffff;
    font-size: 14px;
    line-height: 1.4;
}

header nav ul li a:hover {
    color: #ffffff;
    background: rgba(255,255,255,.10);
    text-decoration: none;
}

/* パンくず */
div.breadcrumbs {
    width: min(1180px, 94%);
    margin: 24px auto 18px;
    color: var(--loto-muted);
    font-size: 12px;
    line-height: 1.6;
}

/* 全体レイアウト */
div.body {
    width: min(1180px, 94%);
    margin: 32px auto 0;
}

div.main {
    width: calc(100% - 352px);
    margin: 0;
    padding: 36px 40px;
    background: var(--loto-white);
    border: 1px solid #edf0f3;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0,0,0,.035);
    float: left;
}

div.side {
    width: 320px;
    margin: 0;
    padding: 0;
    float: right;
}

div.main-deme {
    width: 100%;
    margin: 0 0 50px;
    padding: 36px 40px;
    background: var(--loto-white);
    border: 1px solid #edf0f3;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0,0,0,.035);
}

/* 記事タイトル */
h1 {
    margin: 0 0 24px;
    padding: 0 0 14px;
    border-bottom: 3px solid var(--loto-blue);
    color: #1f2937;
    font-size: 30px;
    line-height: 1.45;
    font-weight: 700;
}

div.main h2,
div.main-deme h2 {
    margin: 42px 0 20px;
    padding: 12px 16px;
    border-left: 5px solid var(--loto-blue);
    border-radius: 3px;
    background: var(--loto-blue-soft);
    color: #1f2937;
    font-size: 21px;
    line-height: 1.5;
    font-weight: 700;
}

div.main h2::after,
div.main-deme h2::after {
    display: none;
}

h3 {
    margin: 32px 0 14px;
    color: #1f2937;
    font-size: 18px;
    line-height: 1.5;
    text-align: left;
    font-weight: 700;
}

p {
    margin: 0 0 1.25em;
    padding: 0;
    color: var(--loto-text);
    font-size: 16px;
    line-height: 1.9;
}

/* 一般テーブル */
table {
    width: 100%;
    margin: 16px auto 0;
    border: 1px solid var(--loto-border);
    border-collapse: collapse;
    background: var(--loto-white);
    font-size: 14px;
    line-height: 1.5;
}

table th,
table td {
    padding: 9px 8px;
    border: 1px solid var(--loto-border);
    vertical-align: middle;
    text-align: center;
}

table th {
    background: #eaf3ff;
    color: #1f2937;
    font-weight: 700;
}

table td {
    background: var(--loto-white);
}

/* サイドバー */
div.side h4 {
    margin: 0 0 16px;
    padding: 11px 14px;
    border-radius: 4px;
    background: var(--loto-blue);
    color: #ffffff;
    font-size: 15px;
    font-weight: 700;
}

div.side ul {
    margin: 0 0 28px;
    padding: 0;
}

div.side ul li {
    padding: 9px 2px;
    border-bottom: 1px solid #eceff3;
    line-height: 1.5;
}

/* フッター */
footer {
    margin-top: 56px;
    padding: 28px 0 20px;
    background: #111827;
}

div.footer-body {
    width: min(1180px, 94%);
}

div.copyright {
    color: #d1d5db;
    line-height: 1.5;
}

/* プラグインのデータ表示を本文幅いっぱいに */
.loto6-latest-wrap,
.loto6-frequency-box,
.loto6-position-frequency-wrap,
.loto6-deme-wrap,
.loto6-interval-wrap,
.loto6-number-index,
.loto6-number-detail {
    width: 100%;
    max-width: 100%;
}

/* 数字選択を少し押しやすく */
.loto6-number-selector,
.loto6-number-nav {
    gap: 8px !important;
}

.loto6-number-selector-circle,
.loto6-number-nav-circle,
.loto6-number-co-circle,
.loto6-number-circle,
.loto6-interval-circle {
    border-color: #9ca3af !important;
    transition: .15s ease;
}

.loto6-number-selector-circle:hover,
.loto6-number-nav-circle:hover,
.loto6-number-co-circle:hover {
    border-color: var(--loto-blue) !important;
    background: var(--loto-blue-soft) !important;
    text-decoration: none;
}

/* データカード */
.loto6-number-card,
.loto6-number-position-item {
    border-color: var(--loto-border) !important;
    border-radius: 6px;
    box-shadow: 0 1px 3px rgba(0,0,0,.025);
}

/* スマホ */
@media screen and (max-width: 900px) {

    div.breadcrumbs,
    div.body,
    div.footer-body {
        width: 94%;
    }

    div.body {
        margin-top: 20px;
    }

    div.main,
    div.main-deme,
    div.side {
        width: 100%;
        float: none;
    }

    div.main,
    div.main-deme {
        margin: 0 0 28px;
        padding: 28px 24px;
    }

    div.side {
        margin: 0 auto 40px;
    }

    header nav ul {
        width: 100%;
    }
}

@media screen and (max-width: 600px) {

    body {
        font-size: 15px;
        line-height: 1.75;
    }

    div.breadcrumbs {
        margin: 14px auto 12px;
    }

    div.body {
        width: 100%;
        margin-top: 10px;
    }

    div.main,
    div.main-deme {
        padding: 22px 16px;
        border-left: 0;
        border-right: 0;
        border-radius: 0;
        box-shadow: none;
    }

    div.side {
        width: 92%;
    }

    h1 {
        font-size: 24px;
        line-height: 1.45;
    }

    div.main h2,
    div.main-deme h2 {
        margin-top: 34px;
        padding: 10px 12px;
        font-size: 18px;
    }

    h3 {
        font-size: 17px;
    }

    p {
        margin: 0 0 1.15em;
        font-size: 15px;
        line-height: 1.8;
    }

    table {
        font-size: 13px;
    }

    table th,
    table td {
        padding: 7px 6px;
    }
}



/* =====================================================================
   LOTO6 DATA PARTY - DATA TERMINAL UI
   Concept: dense financial-data layout + clean green brokerage palette
   Version: 2026-10
===================================================================== */

:root {
    --ld-green: #00a786;
    --ld-green-dark: #007d67;
    --ld-green-soft: #e9f8f4;
    --ld-navy: #172235;
    --ld-navy-2: #22324a;
    --ld-text: #202832;
    --ld-muted: #6d7783;
    --ld-bg: #f4f6f7;
    --ld-panel: #ffffff;
    --ld-border: #d9e0e5;
    --ld-border-dark: #c8d1d8;
    --ld-blue: #2e72d2;
    --ld-red: #d95757;
    --ld-even: #3178d4;
    --ld-odd: #d95757;
    --ld-shadow: 0 1px 3px rgba(22,34,53,.05);
}

/* ---------- global ---------- */

html {
    background: var(--ld-bg);
}

body {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: var(--ld-bg) !important;
    color: var(--ld-text) !important;
    font-family:
        -apple-system, BlinkMacSystemFont,
        "Segoe UI", "Noto Sans JP", "Hiragino Kaku Gothic ProN",
        "Yu Gothic", Meiryo, sans-serif !important;
    font-size: 15px !important;
    line-height: 1.75;
    letter-spacing: .01em;
}

a {
    color: var(--ld-green-dark);
}

a:hover {
    color: var(--ld-green);
}

img {
    max-width: 100%;
    height: auto;
}

/* ---------- header ---------- */

.loto-site-header {
    position: relative !important;
    width: 100%;
    min-height: 58px;
    margin: 0 !important;
    padding: 0 !important;
    background: var(--ld-navy) !important;
    border-bottom: 3px solid var(--ld-green);
    box-shadow: none !important;
    z-index: 1000;
}

.loto-header-inner {
    width: min(1180px, 94%) !important;
    min-height: 58px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 24px;
}

.loto-header-logo {
    min-width: 118px;
    flex: 0 0 auto;
}

.loto-header-logo a {
    display: block;
    color: #fff !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    line-height: 1.25;
    letter-spacing: .04em;
    text-decoration: none !important;
    white-space: nowrap;
}

.loto-global-nav {
    margin-left: auto;
}

.loto-global-nav ul {
    display: flex !important;
    align-items: stretch !important;
    gap: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.loto-global-nav li {
    margin: 0 !important;
    padding: 0 !important;
    border-left: 1px solid rgba(255,255,255,.07);
}

.loto-global-nav li:last-child {
    border-right: 1px solid rgba(255,255,255,.07);
}

.loto-global-nav a {
    display: flex !important;
    align-items: center;
    min-height: 58px;
    padding: 0 16px !important;
    background: transparent !important;
    color: #eef3f6 !important;
    font-size: 13px !important;
    font-weight: 600;
    line-height: 1.2 !important;
    text-decoration: none !important;
    transition: background .15s ease, color .15s ease;
}

.loto-global-nav a:hover {
    background: rgba(255,255,255,.08) !important;
    color: #fff !important;
}

.loto-menu-toggle {
    display: none !important;
}

/* ---------- common content frame ---------- */

div.body,
.body {
    width: min(1180px, 94%) !important;
    max-width: 1180px !important;
    margin: 24px auto 48px !important;
    padding: 0 !important;
    background: transparent !important;
}

main,
.main {
    background: var(--ld-panel);
}

div.main,
#main,
.main {
    box-sizing: border-box;
    border: 1px solid var(--ld-border);
    background: var(--ld-panel);
    box-shadow: var(--ld-shadow);
}

div.breadcrumbs,
.breadcrumbs {
    margin: 0 0 12px !important;
    padding: 9px 12px !important;
    border: 1px solid var(--ld-border);
    background: #fff !important;
    color: var(--ld-muted);
    font-size: 12px !important;
}

/* ---------- headings ---------- */

h1, h2, h3, h4 {
    font-family:
        -apple-system, BlinkMacSystemFont,
        "Segoe UI", "Noto Sans JP", "Hiragino Kaku Gothic ProN",
        "Yu Gothic", Meiryo, sans-serif !important;
}

h1 {
    margin: 0 0 22px !important;
    padding: 0 0 12px !important;
    border: 0 !important;
    border-bottom: 2px solid var(--ld-green) !important;
    background: transparent !important;
    color: var(--ld-text) !important;
    font-size: 28px !important;
    line-height: 1.4 !important;
    font-weight: 700 !important;
}

h2 {
    margin: 32px 0 16px !important;
    padding: 9px 12px !important;
    border: 0 !important;
    border-left: 4px solid var(--ld-green) !important;
    background: #f5f8f8 !important;
    color: var(--ld-text) !important;
    font-size: 20px !important;
    line-height: 1.45 !important;
    font-weight: 700 !important;
}

h3 {
    color: var(--ld-text) !important;
}

/* ---------- tables ---------- */

table {
    border-collapse: collapse;
}

table th {
    background: #eef3f4 !important;
    color: #25313c !important;
    font-weight: 700 !important;
}

table th,
table td {
    border-color: var(--ld-border) !important;
}

table tbody tr:nth-child(even) td {
    background: #fafbfb;
}

table tbody tr:hover td {
    background: #f1faf7;
}

/* =====================================================================
   HOME
===================================================================== */

.loto-home {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    background: var(--ld-bg) !important;
}

.loto-home-container {
    width: min(1180px, 94%) !important;
    margin: 0 auto !important;
}

/* hero: smaller, denser, terminal-like */

.loto-home-hero {
    position: relative;
    padding: 44px 0 46px !important;
    background:
        linear-gradient(105deg, var(--ld-navy) 0%, #1d2d43 64%, #174838 100%) !important;
    border-bottom: 1px solid rgba(0,0,0,.15);
}

.loto-home-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .18;
    background-image:
        linear-gradient(rgba(255,255,255,.07) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.07) 1px, transparent 1px);
    background-size: 36px 36px;
}

.loto-home-hero .loto-home-container {
    position: relative;
    z-index: 1;
}

.loto-home-kicker {
    margin: 0 0 8px !important;
    color: #65d8bd !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: .18em !important;
}

.loto-home-hero h1 {
    max-width: 760px;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    color: #fff !important;
    font-size: clamp(34px, 4.4vw, 50px) !important;
    line-height: 1.22 !important;
    letter-spacing: .02em;
}

.loto-home-lead {
    max-width: 760px !important;
    margin: 18px 0 0 !important;
    color: #d5dce5 !important;
    font-size: 15px !important;
    line-height: 1.85 !important;
}

.loto-home-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px !important;
    margin-top: 22px !important;
}

.loto-home-button {
    min-width: 142px !important;
    padding: 10px 18px !important;
    border: 1px solid rgba(255,255,255,.34) !important;
    border-radius: 4px !important;
    background: transparent !important;
    color: #fff !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    box-shadow: none !important;
}

.loto-home-button-primary {
    border-color: var(--ld-green) !important;
    background: var(--ld-green) !important;
}

.loto-home-button-primary:hover {
    background: var(--ld-green-dark) !important;
}

/* home sections */

.loto-home-section {
    padding: 42px 0 !important;
    background: #fff;
    border-bottom: 1px solid #e8ecef;
}

.loto-home-section-alt {
    background: var(--ld-bg) !important;
}

.loto-home-section-head {
    max-width: 820px !important;
    margin: 0 0 22px !important;
}

.loto-home-section-head > span {
    display: block;
    margin: 0 0 5px !important;
    color: var(--ld-green-dark) !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    letter-spacing: .14em !important;
}

.loto-home-section-head h2 {
    margin: 0 0 7px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: var(--ld-text) !important;
    font-size: 24px !important;
    line-height: 1.45 !important;
}

.loto-home-section-head p {
    margin: 0 !important;
    color: var(--ld-muted) !important;
    font-size: 13px !important;
}

/* data menu: compact cards */

.loto-home-menu-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0,1fr)) !important;
    gap: 10px !important;
}

.loto-home-menu-card {
    min-height: 0 !important;
    padding: 18px !important;
    border: 1px solid var(--ld-border) !important;
    border-radius: 5px !important;
    background: #fff !important;
    color: var(--ld-text) !important;
    box-shadow: none !important;
    transform: none !important;
}

.loto-home-menu-card:hover {
    border-color: var(--ld-green) !important;
    background: #fbfefd !important;
    box-shadow: 0 2px 7px rgba(0,126,102,.08) !important;
    transform: none !important;
}

.loto-home-menu-icon {
    width: 32px !important;
    height: 24px !important;
    margin: 0 0 12px !important;
    border-radius: 3px !important;
    background: var(--ld-green-soft) !important;
    color: var(--ld-green-dark) !important;
    font-size: 10px !important;
    font-weight: 800 !important;
}

.loto-home-menu-card h3 {
    margin: 0 0 5px !important;
    font-size: 16px !important;
    line-height: 1.45 !important;
}

.loto-home-menu-card p {
    min-height: 42px !important;
    margin: 0 0 10px !important;
    color: var(--ld-muted) !important;
    font-size: 12px !important;
    line-height: 1.65 !important;
}

.loto-home-menu-card > span {
    color: var(--ld-green-dark) !important;
    font-size: 11px !important;
}

.loto-home-menu-card-featured {
    border-top: 3px solid var(--ld-green) !important;
    background: #fbfefd !important;
}

/* data panels */

.loto-home-data-box,
.loto-home-number-area {
    padding: 18px !important;
    border: 1px solid var(--ld-border) !important;
    border-radius: 5px !important;
    background: #fff !important;
    box-shadow: none !important;
}

/* articles */

.loto-home-articles {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0,1fr)) !important;
    gap: 12px !important;
}

.loto-home-article {
    border: 1px solid var(--ld-border) !important;
    border-radius: 5px !important;
    box-shadow: none !important;
}

.loto-home-article-content {
    padding: 14px !important;
}

.loto-home-article-date {
    color: #89949e !important;
    font-size: 10px !important;
}

.loto-home-article h3 {
    font-size: 14px !important;
    line-height: 1.55 !important;
}

.loto-home-article-excerpt {
    color: var(--ld-muted) !important;
    font-size: 12px !important;
}

/* =====================================================================
   PLUGIN UI - shared
===================================================================== */

.loto6-frequency-box,
.loto6-interval-wrap,
.loto6-position-frequency-wrap,
.loto6-deme-wrap,
.loto6-number-detail,
.loto6-number-selector {
    color: var(--ld-text);
}

.loto6-frequency-buttons,
.loto6-even-odd-range-buttons {
    gap: 5px !important;
}

.loto6-frequency-btn,
.loto6-even-odd-range-button {
    padding: 7px 11px !important;
    border: 1px solid var(--ld-border-dark) !important;
    border-radius: 3px !important;
    background: #fff !important;
    color: #394550 !important;
    font-size: 12px !important;
    font-weight: 600 !important;
}

.loto6-frequency-btn:hover,
.loto6-even-odd-range-button:hover {
    border-color: var(--ld-green) !important;
    background: var(--ld-green-soft) !important;
    color: var(--ld-green-dark) !important;
}

.loto6-frequency-btn.current,
.loto6-frequency-btn.is-current,
.loto6-even-odd-range-button.is-current {
    border-color: var(--ld-green) !important;
    background: var(--ld-green) !important;
    color: #fff !important;
}

/* number circles: calmer, financial UI */

.loto6-number-circle,
.loto6-interval-circle,
.loto6-number-nav-circle,
.loto6-number-co-circle,
.loto6-number-selector-circle {
    border-color: #aeb9c2 !important;
    background: #fff !important;
    color: #25313c !important;
    box-shadow: none !important;
}

.loto6-number-circle:hover,
.loto6-number-nav-circle:hover,
.loto6-number-selector-circle:hover {
    border-color: var(--ld-green) !important;
    background: var(--ld-green-soft) !important;
    color: var(--ld-green-dark) !important;
}

/* latest / position / history tables */

.loto6-latest-table,
.loto6-position-table,
.loto6-deme-table,
.loto6-number-history-table,
.loto6-even-odd-history-table {
    border: 1px solid var(--ld-border) !important;
    background: #fff;
}

.loto6-latest-table th,
.loto6-position-table th,
.loto6-deme-table th,
.loto6-number-history-table th,
.loto6-even-odd-history-table th {
    background: #edf2f3 !important;
    color: #293640 !important;
}

/* number detail */

.loto6-number-hero {
    border: 1px solid var(--ld-border) !important;
    border-left: 4px solid var(--ld-green) !important;
    border-radius: 5px !important;
    background: #fff !important;
}

.loto6-number-big-circle {
    border-color: var(--ld-green) !important;
    background: var(--ld-green-soft) !important;
    color: var(--ld-green-dark) !important;
}

.loto6-number-cards {
    gap: 8px !important;
}

.loto6-number-card {
    border: 1px solid var(--ld-border) !important;
    border-radius: 4px !important;
    background: #fff !important;
    box-shadow: none !important;
}

.loto6-number-card strong {
    color: var(--ld-green-dark) !important;
}

/* =====================================================================
   EVEN / ODD VISUAL PAGE
===================================================================== */

.loto6-even-odd-wrap {
    color: var(--ld-text);
}

.loto6-even-odd-latest {
    border: 1px solid var(--ld-border) !important;
    border-top: 3px solid var(--ld-green) !important;
    border-radius: 5px !important;
    background: #fff !important;
    box-shadow: none !important;
}

.loto6-even-odd-eyebrow {
    color: var(--ld-green-dark) !important;
}

.loto6-even-odd-mini-card,
.loto6-even-odd-summary-card {
    border: 1px solid var(--ld-border) !important;
    border-radius: 4px !important;
    box-shadow: none !important;
}

.loto6-even-odd-number {
    border-width: 2px !important;
    box-shadow: none !important;
}

.loto6-even-odd-number.is-odd {
    border-color: #e7aaaa !important;
    background: #fffafa !important;
}

.loto6-even-odd-number.is-even {
    border-color: #9dbce6 !important;
    background: #f7faff !important;
}

.loto6-even-odd-bar {
    height: 18px !important;
    border-radius: 3px !important;
    background: #e8edf0 !important;
}

.loto6-even-odd-bar.is-large {
    height: 24px !important;
}

.loto6-even-odd-bar-odd {
    background: var(--ld-odd) !important;
}

.loto6-even-odd-bar-even {
    background: var(--ld-even) !important;
}

.loto6-even-odd-pattern-row {
    grid-template-columns: 150px 1fr 100px !important;
    padding: 9px 0 !important;
}

.loto6-even-odd-pattern-bar {
    height: 12px !important;
    border-radius: 2px !important;
    background: #e9edef !important;
}

.loto6-even-odd-pattern-bar-fill {
    border-radius: 2px !important;
    background: var(--ld-green) !important;
}

/* ---------- footer ---------- */

footer,
#footer {
    background: var(--ld-navy) !important;
    color: #c8d0d8 !important;
}

footer a,
#footer a {
    color: #e4ecef !important;
}

/* =====================================================================
   Responsive
===================================================================== */

@media screen and (max-width: 900px) {

    .loto-header-inner {
        width: 100% !important;
        min-height: 56px !important;
        padding: 0 14px !important;
        box-sizing: border-box;
        position: relative;
    }

    .loto-menu-toggle {
        display: block !important;
        width: 40px !important;
        height: 40px !important;
        padding: 8px !important;
        border: 0 !important;
        background: transparent !important;
        cursor: pointer;
    }

    .loto-menu-toggle span {
        display: block !important;
        width: 23px !important;
        height: 2px !important;
        margin: 5px 0 !important;
        background: #fff !important;
    }

    .loto-global-nav {
        display: none !important;
        position: absolute !important;
        top: 56px !important;
        left: 0 !important;
        width: 100% !important;
        margin: 0 !important;
        background: var(--ld-navy) !important;
        border-top: 1px solid rgba(255,255,255,.09);
    }

    .loto-global-nav.is-open {
        display: block !important;
    }

    .loto-global-nav ul {
        display: block !important;
    }

    .loto-global-nav li {
        border: 0 !important;
        border-top: 1px solid rgba(255,255,255,.08) !important;
    }

    .loto-global-nav a {
        min-height: 0 !important;
        padding: 13px 16px !important;
    }

    .loto-home-menu-grid,
    .loto-home-articles {
        grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    }
}

@media screen and (max-width: 620px) {

    body {
        font-size: 14px !important;
    }

    div.body,
    .body {
        width: 94% !important;
        margin-top: 16px !important;
    }

    h1 {
        font-size: 23px !important;
    }

    h2 {
        font-size: 18px !important;
    }

    .loto-home-container {
        width: 92% !important;
    }

    .loto-home-hero {
        padding: 34px 0 36px !important;
    }

    .loto-home-hero h1 {
        font-size: 32px !important;
    }

    .loto-home-lead {
        font-size: 14px !important;
    }

    .loto-home-section {
        padding: 32px 0 !important;
    }

    .loto-home-section-head h2 {
        font-size: 21px !important;
    }

    .loto-home-menu-grid,
    .loto-home-articles {
        grid-template-columns: 1fr !important;
    }

    .loto-home-menu-card {
        padding: 15px !important;
    }

    .loto-home-data-box,
    .loto-home-number-area {
        padding: 12px !important;
    }

    .loto6-even-odd-pattern-row {
        grid-template-columns: 1fr !important;
    }
}

/* keep mobile helper */
.loto-sp-only {
    display: none;
}
@media screen and (max-width: 600px) {
    .loto-sp-only {
        display: block;
    }
}

/* =========================================
   数字 1～43 の背景色
========================================= */

.loto6-number-circle,
.loto6-interval-circle,
.loto6-number-nav-circle,
.loto6-number-co-circle,
.loto6-number-selector-circle {
    background: #f3faf7 !important;
    border-color: #b9d9cf !important;
    color: #25313c !important;
}

/* ホバー時 */
.loto6-number-circle:hover,
.loto6-interval-circle:hover,
.loto6-number-nav-circle:hover,
.loto6-number-co-circle:hover,
.loto6-number-selector-circle:hover {
    background: #e3f5ef !important;
    border-color: var(--ld-green) !important;
    color: var(--ld-green-dark) !important;
}

/* =========================================
   記事一覧
========================================= */

.archive-list {
    display: grid;
    gap: 10px;
}

.archive-headline {
    margin: 0 !important;
    border: 1px solid var(--ld-border);
    border-radius: 4px;
    background: #fff;
}

.archive-headline > a {
    display: grid;
    grid-template-columns: 180px 1fr;
    gap: 16px;
    padding: 14px;
    color: var(--ld-text);
    text-decoration: none;
}

.archive-headline > a:hover {
    background: #fbfefd;
    text-decoration: none;
}

.archive-thumbnail img {
    display: block;
    width: 100%;
    height: 110px;
    object-fit: cover;
}

.archive-content .title {
    margin: 0 0 6px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: var(--ld-text) !important;
    font-size: 16px !important;
    line-height: 1.55 !important;
}

.date-and-time {
    margin-bottom: 8px;
    color: var(--ld-muted);
    font-size: 11px;
}

.archive-category {
    color: var(--ld-green-dark);
}

.archive-excerpt {
    margin: 0;
    color: var(--ld-muted);
    font-size: 12px;
    line-height: 1.7;
}

.archive-pagination {
    margin-top: 24px;
}

.archive-pagination .nav-links {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.archive-pagination .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    height: 34px;
    padding: 0 9px;
    border: 1px solid var(--ld-border);
    border-radius: 3px;
    background: #fff;
    color: var(--ld-text);
    text-decoration: none;
}

.archive-pagination .page-numbers.current {
    border-color: var(--ld-green);
    background: var(--ld-green);
    color: #fff;
}

@media screen and (max-width: 600px) {

    .archive-headline > a {
        grid-template-columns: 100px 1fr;
        gap: 12px;
        padding: 11px;
    }

    .archive-thumbnail img {
        height: 78px;
    }

    .archive-content .title {
        font-size: 14px !important;
    }

    .archive-excerpt {
        display: none;
    }

}

/* =========================================
   固定ページ
========================================= */

.page-header {
    margin-bottom: 20px;
}

.page-header h1 {
    margin-bottom: 7px !important;
}

.page-update-date {
    margin: 0;
    color: var(--ld-muted);
    font-size: 11px;
    text-align: right;
}

.page-entry {
    margin-top: 22px;
}

.page-entry::after {
    content: "";
    display: block;
    clear: both;
}

/* =====================================================
   ロト6 データページ共通フル幅レイアウト
===================================================== */

.page-full-width {
    width: min(1180px, 94%) !important;
    max-width: 1180px !important;
    margin: 24px auto 48px !important;
    padding: 0 !important;
}

.page-full-width .main-full {
    width: 100% !important;
    max-width: none !important;
    float: none !important;

    margin: 0 !important;
    padding: 22px 24px 30px !important;

    box-sizing: border-box;

    border: 1px solid var(--ld-border);
    background: #ffffff;
}

/* 本文も100%使用 */
.page-full-width .page-content,
.page-full-width .page-entry {
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box;
}

/* 古いfloatを確実に解除 */
.page-full-width .main-full::after,
.page-full-width .page-entry::after {
    content: "";
    display: block;
    clear: both;
}


/* -----------------------------------------
   データテーブル
----------------------------------------- */

.page-full-width table {
    max-width: 100%;
}


/* -----------------------------------------
   横に広い表はスクロール可能に
----------------------------------------- */

.page-full-width .loto6-deme-wrap,
.page-full-width .loto6-position-frequency-wrap,
.page-full-width .loto6-frequency-box,
.page-full-width .loto6-interval-wrap,
.page-full-width .loto6-number-detail,
.page-full-width .loto6-even-odd-wrap {
    width: 100%;
    max-width: none;
    box-sizing: border-box;
}


/* -----------------------------------------
   ページ見出し
----------------------------------------- */

.page-full-width .page-header {
    margin-bottom: 22px;
}

.page-full-width .page-header h1 {
    margin-bottom: 6px !important;
}

.page-full-width .page-update-date {
    margin: 0;
    color: var(--ld-muted);
    font-size: 11px;
    text-align: right;
}


/* -----------------------------------------
   スマホ
----------------------------------------- */

@media screen and (max-width: 700px) {

    .page-full-width {
        width: 96% !important;
        margin-top: 14px !important;
    }

    .page-full-width .main-full {
        padding: 14px 10px 22px !important;
    }

}


/* =========================================================
   数字詳細ページ：4期間トレンド表示
   目先20回 / 短期43回 / 中期100回 / 長期全期間
========================================================= */

.loto6-number-trend-panel{
    margin:24px 0 30px!important;
    padding:18px!important;
    border:1px solid #d9e0e5!important;
    border-top:3px solid #00a786!important;
    background:#fff!important;
    box-sizing:border-box!important;
}

.loto6-number-trend-head{
    display:flex!important;
    align-items:flex-end!important;
    justify-content:space-between!important;
    gap:24px!important;
    margin-bottom:14px!important;
}

.loto6-number-trend-kicker{
    display:block!important;
    margin-bottom:3px!important;
    color:#007d67!important;
    font-size:10px!important;
    font-weight:800!important;
    letter-spacing:.14em!important;
}

.loto6-number-trend-head h2{
    margin:0!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
    color:#202832!important;
    font-size:18px!important;
    line-height:1.45!important;
}

.loto6-number-trend-head p{
    max-width:520px!important;
    margin:0!important;
    color:#6d7783!important;
    font-size:11px!important;
    line-height:1.65!important;
    text-align:right!important;
}

.loto6-number-trend-grid{
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:8px!important;
}

.loto6-number-trend-card{
    position:relative!important;
    min-height:138px!important;
    padding:12px!important;
    border:1px solid #d9e0e5!important;
    border-top-width:4px!important;
    background:#fff!important;
    box-sizing:border-box!important;
}

/* 強い上向き */
.loto6-number-trend-card.trend-strong_up{
    border-top-color:#007b63!important;
    background:#f1faf7!important;
}

/* 上向き */
.loto6-number-trend-card.trend-up{
    border-top-color:#35a682!important;
    background:#f7fcfa!important;
}

/* 中立 */
.loto6-number-trend-card.trend-flat{
    border-top-color:#82909c!important;
    background:#fafbfb!important;
}

/* 下向き */
.loto6-number-trend-card.trend-down{
    border-top-color:#d68a2f!important;
    background:#fffaf3!important;
}

/* 強い下向き */
.loto6-number-trend-card.trend-strong_down{
    border-top-color:#d65b5b!important;
    background:#fff6f6!important;
}

.loto6-number-trend-period{
    display:flex!important;
    align-items:baseline!important;
    justify-content:space-between!important;
    gap:8px!important;
    margin-bottom:9px!important;
}

.loto6-number-trend-period strong{
    color:#202832!important;
    font-size:14px!important;
    font-weight:800!important;
}

.loto6-number-trend-period span{
    color:#7b858e!important;
    font-size:10px!important;
}

.loto6-number-trend-signal{
    display:flex!important;
    align-items:center!important;
    gap:8px!important;
    min-height:36px!important;
    margin-bottom:10px!important;
}

.loto6-number-trend-arrow{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-width:38px!important;
    height:30px!important;
    padding:0 7px!important;
    border-radius:3px!important;
    color:#fff!important;
    font-size:16px!important;
    font-weight:900!important;
    line-height:1!important;
    box-sizing:border-box!important;
}

.trend-strong_up .loto6-number-trend-arrow{
    background:#007b63!important;
}
.trend-up .loto6-number-trend-arrow{
    background:#35a682!important;
}
.trend-flat .loto6-number-trend-arrow{
    background:#82909c!important;
}
.trend-down .loto6-number-trend-arrow{
    background:#d68a2f!important;
}
.trend-strong_down .loto6-number-trend-arrow{
    background:#d65b5b!important;
}

.loto6-number-trend-signal>strong{
    color:#2a343d!important;
    font-size:12px!important;
    font-weight:800!important;
    line-height:1.3!important;
}

.loto6-number-trend-stats{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:4px!important;
    padding-top:9px!important;
    border-top:1px solid rgba(120,130,140,.18)!important;
}

.loto6-number-trend-stats span{
    display:block!important;
    color:#7a858f!important;
    font-size:9px!important;
    line-height:1.35!important;
    text-align:center!important;
}

.loto6-number-trend-stats strong{
    display:block!important;
    margin-top:3px!important;
    color:#27323b!important;
    font-size:12px!important;
    font-weight:800!important;
    font-variant-numeric:tabular-nums!important;
}

.loto6-number-trend-scale{
    display:grid!important;
    grid-template-columns:repeat(5,1fr)!important;
    max-width:430px!important;
    margin:14px auto 0!important;
    overflow:hidden!important;
    border:1px solid #d9e0e5!important;
    border-radius:3px!important;
    font-size:11px!important;
    font-weight:800!important;
    line-height:1!important;
    text-align:center!important;
}

.loto6-number-trend-scale span{
    display:block!important;
    padding:7px 5px!important;
    color:#fff!important;
}

.loto6-number-trend-scale .is-strong-down{background:#d65b5b!important;}
.loto6-number-trend-scale .is-down{background:#d68a2f!important;}
.loto6-number-trend-scale .is-flat{background:#82909c!important;}
.loto6-number-trend-scale .is-up{background:#35a682!important;}
.loto6-number-trend-scale .is-strong-up{background:#007b63!important;}

.loto6-number-trend-note{
    margin:11px 0 0!important;
    color:#77818a!important;
    font-size:10px!important;
    line-height:1.65!important;
    text-align:right!important;
}

@media screen and (max-width:850px){
    .loto6-number-trend-grid{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
    }
    .loto6-number-trend-head{
        display:block!important;
    }
    .loto6-number-trend-head p{
        max-width:none!important;
        margin-top:6px!important;
        text-align:left!important;
    }
}

@media screen and (max-width:520px){
    .loto6-number-trend-panel{
        padding:13px 10px!important;
    }
    .loto6-number-trend-grid{
        grid-template-columns:1fr 1fr!important;
        gap:5px!important;
    }
    .loto6-number-trend-card{
        min-height:130px!important;
        padding:9px!important;
    }
    .loto6-number-trend-arrow{
        min-width:32px!important;
        height:27px!important;
        font-size:13px!important;
    }
    .loto6-number-trend-signal>strong{
        font-size:11px!important;
    }
    .loto6-number-trend-note{
        text-align:left!important;
    }
}


/* =========================================================
   数字詳細ページ：4期間トレンド「株探風」強調表示
   目先 / 短期 / 中期 / 長期 を横一列で比較し、
   矢印アイコンを最優先で見せる
========================================================= */

.loto6-number-trend-panel{
    margin:24px 0 30px!important;
    padding:16px 18px 18px!important;
    border:1px solid #cfd7dd!important;
    border-top:3px solid #00a786!important;
    background:#fff!important;
}

.loto6-number-trend-head{
    margin-bottom:14px!important;
}

.loto6-number-trend-grid{
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:10px!important;
}

/* 各期間カード */
.loto6-number-trend-card{
    min-height:170px!important;
    padding:10px 8px 12px!important;
    border:1px solid #d7dee3!important;
    border-top-width:3px!important;
    background:#fff!important;
    text-align:center!important;
}

/* 期間名を上部に明確表示 */
.loto6-number-trend-period{
    display:block!important;
    margin:0 0 7px!important;
    text-align:center!important;
}

.loto6-number-trend-period strong{
    display:block!important;
    color:#202832!important;
    font-size:15px!important;
    font-weight:800!important;
    line-height:1.25!important;
}

.loto6-number-trend-period span{
    display:block!important;
    margin-top:2px!important;
    color:#6d7783!important;
    font-size:10px!important;
}

/* 矢印＋判定を縦配置 */
.loto6-number-trend-signal{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:5px!important;
    min-height:88px!important;
    margin:0 0 10px!important;
}

/* 株探風の大きな矢印ボックス */
.loto6-number-trend-arrow{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:66px!important;
    min-width:66px!important;
    height:58px!important;
    padding:0!important;
    border-radius:9px!important;
    color:#fff!important;
    font-size:36px!important;
    font-weight:900!important;
    line-height:1!important;
    letter-spacing:-.13em!important;
    text-indent:-.08em!important;
    box-sizing:border-box!important;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.25),
        0 1px 2px rgba(0,0,0,.12)!important;
}

/* 判定文字 */
.loto6-number-trend-signal>strong{
    display:block!important;
    margin:0!important;
    font-size:16px!important;
    font-weight:800!important;
    line-height:1.2!important;
    white-space:nowrap!important;
}

/* 色分け */
.trend-strong_up{
    border-top-color:#007b63!important;
    background:#f4fbf9!important;
}
.trend-strong_up .loto6-number-trend-arrow{
    background:#007b63!important;
}
.trend-strong_up .loto6-number-trend-signal>strong{
    color:#00624f!important;
}

.trend-up{
    border-top-color:#2e9f7a!important;
    background:#f7fcfa!important;
}
.trend-up .loto6-number-trend-arrow{
    background:#2e9f7a!important;
}
.trend-up .loto6-number-trend-signal>strong{
    color:#187a5f!important;
}

.trend-flat{
    border-top-color:#7d8b96!important;
    background:#fafbfb!important;
}
.trend-flat .loto6-number-trend-arrow{
    background:#7d8b96!important;
}
.trend-flat .loto6-number-trend-signal>strong{
    color:#55616b!important;
}

.trend-down{
    border-top-color:#d8892e!important;
    background:#fffaf2!important;
}
.trend-down .loto6-number-trend-arrow{
    background:#d8892e!important;
}
.trend-down .loto6-number-trend-signal>strong{
    color:#b46a14!important;
}

.trend-strong_down{
    border-top-color:#d95757!important;
    background:#fff6f6!important;
}
.trend-strong_down .loto6-number-trend-arrow{
    background:#d95757!important;
}
.trend-strong_down .loto6-number-trend-signal>strong{
    color:#ba4343!important;
}

/* 出現・期待・z をカード下部にコンパクト表示 */
.loto6-number-trend-stats{
    display:grid!important;
    grid-template-columns:repeat(3,1fr)!important;
    gap:0!important;
    padding-top:8px!important;
    border-top:1px solid #e3e7ea!important;
}

.loto6-number-trend-stats span{
    display:block!important;
    padding:0 3px!important;
    color:#79838c!important;
    font-size:9px!important;
    line-height:1.25!important;
    text-align:center!important;
    border-right:1px solid #edf0f2!important;
}

.loto6-number-trend-stats span:last-child{
    border-right:0!important;
}

.loto6-number-trend-stats strong{
    display:block!important;
    margin-top:3px!important;
    color:#27323b!important;
    font-size:12px!important;
    font-weight:800!important;
    font-variant-numeric:tabular-nums!important;
}

/* 下の凡例バーも株価トレンド風に */
.loto6-number-trend-scale{
    display:grid!important;
    grid-template-columns:repeat(5,1fr)!important;
    max-width:520px!important;
    margin:14px auto 0!important;
    overflow:hidden!important;
    border:1px solid #cfd7dd!important;
    border-radius:3px!important;
    font-size:12px!important;
    font-weight:900!important;
    text-align:center!important;
}

.loto6-number-trend-scale span{
    padding:7px 5px!important;
    color:#fff!important;
}

.loto6-number-trend-scale .is-strong-down{background:#d95757!important;}
.loto6-number-trend-scale .is-down{background:#d8892e!important;}
.loto6-number-trend-scale .is-flat{background:#7d8b96!important;}
.loto6-number-trend-scale .is-up{background:#2e9f7a!important;}
.loto6-number-trend-scale .is-strong-up{background:#007b63!important;}

@media screen and (max-width:850px){
    .loto6-number-trend-grid{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
    }
}

@media screen and (max-width:520px){
    .loto6-number-trend-panel{
        padding:12px 8px 14px!important;
    }

    .loto6-number-trend-grid{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
        gap:6px!important;
    }

    .loto6-number-trend-card{
        min-height:160px!important;
        padding:8px 6px 10px!important;
    }

    .loto6-number-trend-period strong{
        font-size:13px!important;
    }

    .loto6-number-trend-arrow{
        width:56px!important;
        min-width:56px!important;
        height:50px!important;
        font-size:31px!important;
        border-radius:7px!important;
    }

    .loto6-number-trend-signal>strong{
        font-size:14px!important;
    }

    .loto6-number-trend-stats strong{
        font-size:11px!important;
    }
}