/*
		common
				2025 - 01 - 07
							*/

@charset "utf-8";

:root{
	--MainColor: #E68815;
	--MainColor2: #FCF3E7;		/* メインカラーを元に明るくしたver */
	--MainColor3: #FFFDFB;		/* さらに明るくver */
	--ReverseColor: #1977ea;	/* メインカラーの逆色 */
	--ReverseColor2: #E7F1FC;	/* メインカラーの逆色を元に明るくしたver */

	--AT_MC: #E68815;
	--AT_MC2: #FCF3E7;

	--AT_TableBorderColor: 		var(--AT_MC);
	--AT_TabColor: 			var(--AT_MC);
	--AT_TabColor_Hover: 		var(--AT_MC2);
	--AT_CellColor: 		white;
	--AT_CellColor_Hover: 		var(--AT_MC2);
	--AT_CellBorderColor_Hover: 	var(--AT_MC);
	--AT_BtnColor: 			var(--AT_MC2);
	--AT_BtnColor_Hover: 		var(--AT_MC);
	--AT_BtnBorderColor: 		var(--AT_MC);
	--AT_NoColor: 			var(--AT_MC);
}


html{
	/*font-size: 1vmin;*/	/* ◆全体サイズ基準 remはbodyじゃダメ */
	/*overflow: hidden;*/
	overflow-y: auto;
	overflow-x: hidden;	/* IE用 */
        /*-ms-overflow-style: none;*/    /* IE, Edge 対応 */
        /*scrollbar-width: none; */      /* Firefox 対応 */
}
html::-webkit-scrollbar {
	/*display:none;*/
}
html,body{
	margin: 0;
	height: 100%;
	/*font-family: 'Meiryo UI';*/
	/*font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "ＭＳ Ｐゴシック", sans-serif;*/
}
body,p,input,textarea,select{
	/*font-family: "Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;*/
}
body{
	user-select: none;
	-moz-user-select: none;		/* Firefox */
	-webkit-user-select: none;	/* Safari */
	-khtml-user-select: none;	/* Safari */

	-webkit-text-size-adjust: 100%;	/* iphone_safari文字サイズバグ直し */

	overscroll-behavior-y: none;	/* androidで下にひっぱって更新を無効化？ */
	/*touch-action: pan-down;*/
}
@supports (-webkit-touch-callout: none) {	/* Safari用のハックは、Chromeに適用されないようにする */
	body {
		height: -webkit-fill-available;	/* Safari用のハック */
	}
	body,p,input,textarea,select{font-size: 16px;}
}
div,input,textarea{
	box-sizing: border-box;
}
p{
	padding: 0;
	margin: 0;
	line-height: 100%;
	display: inline-block;
	vertical-align: middle;
}
table{
	/*table-layout:fixed;*/
}
@media screen and (orientation: landscape){	/*▲横長*/
	.PC{
		/*display: block;*/
	}
	.SP{
		/*display: none;*/
	}
}
@media screen and (orientation: portrait){	/*▲縦長*/
	.PC{
		/*display: none;*/
	}
	.SP{
		/*display: block;*/
	}
}
.btn:hover{
	/*cursor: pointer;*/
}
._Flex{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;

	display: flex;	/* flex = 子を左右上下中央に配置 */
        align-items: center;
        justify-content: center;
}
._Hide{
	display: none;
}
.PC ._SpOnly{
	display: none;
}
.SP ._PcOnly{
	display: none;
}

















._c_DebugDisplayArea{
	position: fixed;
	display: block;
	top: 50%;
	left: 0;
	width: 20%;
	min-width: 20vmin;
	height: 20%;
	min-height: 6vmin;
	background: black;
	border: solid 1px red;
	z-index: 99999999;
	overflow: hidden;
	transition: all 500ms ease;
}.SP ._c_DebugDisplayArea{
	display: none;
}
._c_DebugDisplayArea.drag{
	transition: none;
}
._c_DebugDisplayArea_tab{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 3vmin;
	/*background: yellow;*/
	border-bottom: solid 1px yellow;
}._c_DebugDisplayArea_tab:hover{
	cursor: grab;
}._c_DebugDisplayArea_tab:active{
	cursor: grabbing;
}
._c_DebugDisplayArea_tab > span{
	color: yellow;
	font-size: 2vmin;
	line-height: 140%;
	padding: 0 0 0 2vmin;
}
._c_DebugDisplayArea_view{
	position: absolute;
	bottom: 0;
	left: 0;
	width: calc(100% - 2vmin);
	height: calc(100% - 2vmin - 3vmin);
	/*background: yellow;*/
	color: white;
	overflow-x: hidden;
	overflow-y: scroll;
	font-size: 2vmin;
	line-height: 150%;
	padding: 1vmin;
	user-select: text;
	overflow-wrap: break-word;/*英語でも自動改行*/
}
._c_DebugDisplayArea_sz{
	position: absolute;
	bottom: 0;
	right: 0;
	width: 1.5vmin;
	height: 1.5vmin;
	/*background: yellow;*/
	/*border-bottom: solid 1px yellow;*/
}._c_DebugDisplayArea_sz:hover{
	cursor: nwse-resize;
}._c_DebugDisplayArea_sz:active{
	cursor: nwse-resize;
}
._c_DebugDisplayArea_btn{
	position: absolute;
	top: 0.2vmin;
	right: 0.2vmin;
	width: calc(2.6vmin - 2px);
	height: calc(2.6vmin - 2px);
	/*background: yellow;*/
	border: solid 1px yellow;
}._c_DebugDisplayArea_btn:hover{
	cursor: pointer;
	background: yellow;
}




































._AT{
	position: relative;
	display: inline-block;
	/*border: solid 3px green;*/
}
._AT p,
._AT input{
	font-size: 2em;
	margin: 0;
	padding: 0;
	line-height: 100%;
}
._AT .sticky_top{
	position: -webkit-sticky;
	position: sticky;
	top: 0;
	line-height: 0;/*table下の謎の余白カット*/
	z-index: 2;
}
._AT .sticky_bottom{
	line-height: 0;/*table下の謎の余白カット*/
}
._AT .button_list{
	display: block;
	background: white;
	padding: 1em 0;
}
._AT table{
	display: inline-block;
	line-height: 0;
	border: none;
	border-collapse: collapse; /* セルの線を重ねる */
	border-spacing: 0;       /* 表の線と線の間の幅 */
	table-layout: fixed;
}
._AT table td{
	border: solid 1px var(--AT_TableBorderColor);
}
._AT .table_top{
	/*margin: 2em 0 0 0;*/
}
._AT .table_top td{
	position: relative;
	padding: 1em 0 1.5em 0;
	background: var(--AT_TabColor);
	/*border-right-color: var(--MainColor2);*/
	color: white;
}
._AT .table_bottom{
	/*margin: 0 0 2em 0;*/
}
._AT .table_bottom td{
	background: var(--AT_CellColor);
	padding: 0;
}
._AT .table_bottom td.no{
	color: var(--AT_NoColor);
}
._AT input[type=text]{
	position: relative;
	display: inline-block;
	width: 100%;
	width: calc(100% - 1em - 4px);
	padding: 0.5em;
	margin: 0;
	border: solid 2px transparent;
}
._AT input[type=text]:hover{
	cursor: pointer;
	background: var(--AT_CellColor_Hover);
	border-color: var(--AT_CellBorderColor_Hover);
}
._AT input[type=checkbox]{
	display: inline-block;
	vertical-align: middle;
	inline-size: 1.5em;
	block-size: 1.5em;
	line-height: 0;
	/*accent-color: var(--MainColor2);*/
}
._AT input[type=checkbox]:hover{
	cursor: pointer;
	/*accent-color: var(--MainColor);*/
}
._AT .at_btn{
	position: relative;
	display: inline-block;
	padding: 1em;
	line-height: 100%;
	margin: 0 0.5em;
	border: solid 1px var(--AT_BtnBorderColor);
	background: var(--AT_BtnColor);
	border-radius: 0.5em;
}
._AT .at_btn:hover{
	cursor: pointer;
	background: var(--AT_BtnColor_Hover);
	color: white;
}
._AT .tab_btn.son:hover{
	cursor: pointer;
	background: var(--AT_TabColor_Hover);
	color: black;
}
._AT .tab_btn.sort1:after{/*昇順*/
	content: "";
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translate(-50%,0);
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 1em 0.8em 0 0.8em;
	border-color: white rgba(255,255,255,0) rgba(255,255,255,0) rgba(255,255,255,0);	/*下*/
}
._AT .tab_btn:hover.sort1:after{
	border-color: black rgba(255,255,255,0) rgba(255,255,255,0) rgba(255,255,255,0);	/*下*/
}
._AT .tab_btn.sort2:after{/*降順*/
	content: "";
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translate(-50%,0);
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 0.8em 1em 0.8em;
	border-color: rgba(255,255,255,0) rgba(255,255,255,0) white rgba(255,255,255,0);	/*上*/
}
._AT .tab_btn:hover.sort2:after{
	border-color: rgba(255,255,255,0) rgba(255,255,255,0) black rgba(255,255,255,0);	/*上*/
}