@charset "UTF-8";

/* 陰はあっち */
/* 角丸はこっち */

/* 1280の場合、vw単位の１ピクセルは、100/1280　つまり　1/12.8 */

/* ============================================ */
/* z-indexはいまこうなってる                    */
/* -------------------------------------------- */
	/* -2147483647から2147483647 */
	/* ヘッダ		7000 */
	/* 拡大画面の黒	8000 */
	/* ドロワー		9000 */
	/* 拡大画面		9001 */
/* ============================================ */

/* ============================================ */
/* PCとモバイルとで表示を切り替えるもの         */
/* -------------------------------------------- */
.switch_pc { display: block !important; }
.switch_mobile { display: none !important; }

/* ============================================ */
/* フォント関係                                 */
/* サイズと位置修飾系以外はbasisのほうへ        */
/* -------------------------------------------- */
/* htmlに指定した値が1remになる */
html{
	font-size:16px; /*最初は単なる絶対値指定でやってた */
	font-size: 6.25%;/* 16pxに6.25%を掛けると1pxになるよ！ */
	font-size: 50%;/* 16pxに6.25%を掛けると1pxになるよ！ */
	font-size: calc(16vw / 800);	/*相対化してみようと思ったが、うまくいかんようだ */
	font-size: 100%;	/*これだと主要ブラウザで16pxだそうだ*/
}
/* bodyだけは、クロムのバグに対応するためにemを使用する */
body {
	font-size:1em;
}
/* -------------------------------------------- */
/* 本文 */
.myFrame{
	line-height:1.8;
	font-size:1.1rem;
	font-size:1rem;
}
/* -------------------------------------------- */
/* ヘッダー関連 */
h2{
	font-size:1.4rem;
	font-size:1.2rem;
}
h3{
	font-size:1.5rem;
	font-size:1.3rem;

}
/* -------------------------------------------- */
/* ボタン表面の文字 */
.btn_0 p, .btn_1 p{
	font-size:28px;	/*PC版では24pxに戻して 2.5em;*/
	font-size:1.2rem;
	line-height: 120%;
	white-space: nowrap;
}
/* ナビゲーションドロワーのはちょっとでかいんで*/
header .btn_1 p{
	font-size:1.2rem;
	font-size:1.1rem;
}
/* -------------------------------------------- */
/* コンテンツカード関連 */
/* newとかの添え字 */
.card_content .soeji{
	font-size:20px;
	font-size:1.2rem;
	font-size:1rem;
}
/* タイトル */
.card_content .title{
	font-size:26px;		/*ＰＣ版では22に戻して;*/
	font-size:1.2rem;
	font-size:1.1rem;
	line-height:1.7;	/*数字で書くと倍数 1.5*/
}
.card_content .media{
	font-size:22px;	/*PC版では18pxに*/
	font-size:0.9rem;
}
.card_content .genre{
	font-size:22px;	/*PC版では18pxに*/
	font-size:1rem;
}
/* -------------------------------------------- */
/* コンテンツカード関連2 */
/* タイトル */
.dangumi2 .card_content .title{
	font-size:1.4rem;
	font-size:1.2rem;
	line-height:1.7;	/*数字で書くと倍数 1.5*/
}
.dangumi2 .card_content .commentary{
	font-size:1rem;
	font-size:1rem;
}
/* -------------------------------------------- */
/* フッター */
footer > aside{
	font-size:1.2vw;	/* vwでも指定できるなぁ でも挙動はヘン */
}
footer > section > div h2{
	font-size:0.65em;
	font-size:0.8rem;
	line-height:1.5;	/*数字だと倍率*/
}
footer > section > div{
	font-size:0.65em;
	font-size:0.8rem;	/*0.6が最小かもiphone*/
	line-height:1.5;	/*数字だと倍率*/
}
/* -------------------------------------------- */
/* ○○さんとリンクしました系 */
.linkList{
	font-size:1rem;
}
/* ○○を受賞しました */
.reward{
	font-size:0.9rem;
}
/* ============================================ */
/* 汎用品                                       */
/* 下に書いた物の方が優先されるので、ここに書く */
/* -------------------------------------------- */
.btn_0 p, .btn_1 p{
	position: absolute;
	margin:0;
	padding:0;
	width:90%;
	top: 50%;
	left: 50%;
	-ms-transform: translate(-50%,-50%);
	-webkit-transform : translate(-50%,-50%);
	transform : translate(-50%,-50%);
	text-align:center;
/*	background:#ff0000;*/
}
/*	ボタン。幅や配置については、下で上書きして調節せい */
.btn_0{
	box-shadow: 5px 5px 12px rgba(0,0,0,0.3);
	box-shadow: 0.625vw 0.625vw 1.5vw rgba(0,0,0,0.3);
	border-radius: 6px;
	border-radius: 0.75vw;
	height:80px;
	height:10vw;
}
.btn_1{
	box-shadow: 5px 5px 12px rgba(0,0,0,1.0);
	box-shadow: 0.625vw 0.625vw 1.5vw rgba(0,0,0,0.3);
	box-shadow: 0.5vw 0.5vw 1.5vw rgba(0,0,0,0.5);
	box-shadow: 0.5vw 0.5vw 1.5vw rgba(0,0,0,0.7);
	border-radius: calc(8vw / 12.8);
	height:80px;
	height:10vw;
}
/* 通常の黒枠ヘッダ */
h2{
/*	height:calc(56vw / 8); あえて指定せず２行に対応 */
	overflow:hidden;
	line-height:1.5rem;	/* ボタンの高さ */
	width:65%;
	padding:0.4rem 0.3rem;	/*上下　左右*/
	border-radius:calc(10vw / 12.8);
	text-align:center;
	margin:auto;
	margin-bottom:2rem;
}
/*	商品紹介ページのキャッチフレーズ */
.catchphrase{
	width:90%;

}
/* 通常の黒文字ヘッダ */
h3{
	width:90%;
/*	height:60px;あえて指定せず２行に対応 */
	line-height:2.5vw;
	padding:0;
	text-align:left;
	margin:0 auto 0.5rem auto;　	/*上　右　下　左 */
	background: #FF0000; 
	background:none;
}
/*	セクション2 */
section{
	margin:0;
	padding:0;
	width:100%;
/*	background:#ff00ff;*/
}
/* セクション3 */
section > section{
	margin:0;
	padding:0;
	width:100%;
/*	background:#ffff00;	*/
}
.myFrame{
	margin:auto;
	margin-bottom:40px;
	margin-bottom:5vw;
	width:98%;
	padding:16px 10px 16px 20px;	/*上　右　下　左 */
	padding:2vw 1.25vw 2vw 2.5vw;	/*上　右　下　左 */
	border-radius: 8px;;
	border-radius: 1vw;;
}
/* -------------------------------------------- */
/* スペーサ類 */
.spacer_16{
	margin:0;
	padding:0;
	height:calc(16vw / 12.8);
/*	background:#FF0000;*/
}
.spacer_32{
	margin:0;
	padding:0;
	height:calc(32vw / 12.8);
/*	background:#FF0000;*/
}
.spacer_64{
	margin:0;
	padding:0;
	height:calc(64vw / 12.8);
/*	background:#FF0000;*/
}
/* -------------------------------------------- */
/* youtube ユーチューブ */
iframe{
//	position:absolute;
	display:block;	/*これやらない場合にはdivで囲んでtext-align:center */
	width:calc(784vw / 12.8);
	height:calc(784vw * 0.75 / 12.8);	/* 16:9動画なら*0.5625になる*/
	width:calc(640vw / 12.8);
	height:calc(640vw * 0.75 / 12.8);	/* 16:9動画なら*0.5625になる*/
/*	object-fit: contain; ユーチューにはこれ効かない*/
	margin:auto;

	margin-bottom:8vw;
}
/* ============================================ */
/* ヘッダー                                     */
/* デジメスとナビゲーションドロワーはここに入る */
/* -------------------------------------------- */
/* ヘッダ部分の全体。headerタグ                 */
header {
	position: fixed;            /* ヘッダーの固定 */
	width:100%;
	font-size:0;	/* 中のインラインブロック要素の隙間を消すため */
	z-index: 9990;	/*これを忘れてたんだよアホ！！ 数字がでかいほど手前。*/
	z-index: 7000;	/*これを忘れてたんだよアホ！！ 数字がでかいほど手前。値はいちばん上にまとめる9*/
	box-shadow: 0px 4px 20px rgba(0,0,0,0.6);	/* アルファだけ少数で最大1 */
	box-shadow: 0px 2px 10px rgba(0,0,0,0.6);	/* アルファだけ少数で最大1 */
	box-shadow: 0px 0.5vw 2.5vw rgba(0,0,0,0.6);	/* アルファだけ少数で最大1 */
}
/* 縦横比揃えるための裏技 vw単位使わない場合 */
header:before{
  content:'';
  display:block;
	padding-bottom:5%;	/* 1280x64 */

}
/* 上の後処理として、全体をコンテナで包む */
#container_head{
	position:absolute;
	top:0;
	width:100%;
	height:100%;
	background:#ffff00;
	background:none;
}
/* -------------------------------------------- */
/* ヘッダーの３つ割                             */
#container_head>.left{
	display:inline-block;
	vertical-align: top;	/*毒消し*/
	width:11.25%;	/* 144px */
	height:100%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
	border-bottom: solid 2px #000000;
	background:#ff0000;
	background:none;

}
#container_head>.center{
	display:inline-block;
	vertical-align: top;	/*毒消し*/
	width:71.875%;
	height:100%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	border-bottom: solid 2px #000000;
/*	background:#ffff00;*/
}
#container_head>.right{
	display:inline-block;
	vertical-align: top;	/*毒消し*/
	width:16.875%;	/* 216px */
	height:100%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
	border-bottom: solid 2px #000000;
	background:#ff00ff;
	background:none;
}
/* ============================================ */
/* エンブレム                                   */
/* 箱の中に画像を直接置いてある */
/* -------------------------------------------- */
#container_head>.left>img{
	width:calc(102vw / 12.8);
	width:calc(104vw / 12.8);
	object-fit: contain;	/*これで縦横比が整合するようだ*/
	margin-left:calc(26vw / 12.8);
	margin-top:calc(18.5vw / 12.8);
	margin-left:calc(24vw / 12.8);
	margin-top:calc(18.435vw / 12.8);
/* 画像を取り替えるぜ211108 */
	margin-left:calc(8vw / 12.8);
	margin-top:calc(6vw / 12.8);
}
/* ============================================ */
/* デジメス                                     */
/* -------------------------------------------- */
/* アニメコンテナに直接指定してみよう */
#anim_container_digimes{
	width:100%;
	height:100%;
	margin-left;0;
/*	margin-top:calc(16vw/8);*/
	background:#ffff00;
	background:none;
}
/* ============================================ */
/* ナビゲーションドロワー                       */
/* -------------------------------------------- */
/* ルートのラッパーdiv　*/
#navigationDrawer {
	font-size:0;	/* 中のインラインブロック要素の隙間を消すため */
	background:#ff0000;
	background:none;
/*	display:none;	これやると下位のボタンとかまで消えるのでダメよ*/
}
/* -------------------------------------------- */
/* PC版では使わない連中 */
.ndHide {		/* 非表示にするクラス */
	display:none;
}
#ndLabelOpen {	/* ラベル：ハンバーガーアイコンボタン */
	display:none;
}
#ndLabelCloseShade {	/*閉じる用の薄黒カバー*/
	display:none;
}
/* -------------------------------------------- */
/* ナビゲーションドロワー本体 ドロワーの直下にいるな */
#nav-content {
	display: block;
	overflow: auto;
	position: fixed;
	top: calc(64vw / 12.8);
	right:0;
	z-index: 9999;/*最前面に*/
	z-index: 9000;/*最前面に*/
	width: calc(216vw / 12.8);
	width: calc(200vw / 12.8);
	max-width: 40%;/*最大幅（調整してください）*/
	height: 100%;
	background:#ffff00;
	background:none;
}
/* -------------------------------------------- */
/* ラベル：ドロワーにつけるクローズボタン */
#ndLabelCloseBtn {
	display:none;
}
/* -------------------------------------------- */
/* ドロワーに載っけるナビボタン */
#nav-content .btn_1{
	position:relative;
/*	margin:0 16 0 32;*/	/*上　右　下　左 */
	width: calc(192vw / 12.8);
	width: calc(176vw / 12.8);
	height: calc(64vw / 12.8);
	height: calc(60vw / 12.8);
	margin-left:0;
	margin-left:calc(8vw / 12.8);
	margin-top:0;
}
#nav-content .btn_1:hover{
-webkit-transform: rotate(-3deg);
transform: rotate(-3deg);
}
/* -------------------------------------------- */
/* ここのスペーサ16だけ、高さを調節 */
#nav-content .spacer_16{
	height:calc(32vw / 12.8);

}
/* -------------------------------------------- */
/* ソーシャルメディア関連 */
#nav-content .social_area{
	position:relative;
	width: calc(176vw / 12.8);
	height: calc(60vw / 12.8);
	margin-left:calc(8vw / 12.8);
	margin-top:0;
	background:#ff0000;
	background:none;
}
.social_area .btn_0{
	height:100%;
	width:40%;
}
.social_area .btn_0:hover{
-webkit-transform: rotate(-3deg);
transform: rotate(-3deg);
}
.social_area .btn_0 p{
	position:relative;
	font-size:2rem;
	color:#55acee;
}
/* ============================================ */
/* メインコンテンツ                             */
/* ゲームカードの段組とか                       */
/* -------------------------------------------- */
/*	メインコンテンツ */
#main{
	width:100%;
	margin-top:calc(40vw/8);
	margin:0;					/*上　右　下　左 */
	font-size:0;	/*下位のインラインブロックの隙間殺し*/
	line-height:0;
}
/* -------------------------------------------- */
/* ヘッダの陰に隠れる部分のスペーサ             */
#spacer_header{
	display:block;
	width:100%;
	height:calc(64vw / 12.8);
	background:#ff0000;
	background:none;
}
/* フッターの陰に隠れる部分のスペーサ             */
/* 高さは、フッタに設定した高さと整合するように */
#spacer_footer{
	width:100%;
	height:calc(190vw / 12.8);
	background:#ff00ff;
	background:none;
}
/* ============================================ */
/* メインを横３つのカラムに分ける               */
/* -------------------------------------------- */
#column_left{
	display:inline-block;
	vertical-align: top;	/*インラインにはこれ必要 */
	width:calc(216vw / 12.8);	/*スクロールバーが出るとはみ出す */
	width:calc(200% / 1280 * 100);
	width:calc(184% / 1280 * 100);
	height:50vw;
	background:#ff0000;
	background:none;
}
#column_center{
	display:inline-block;
	vertical-align: top;	/*インラインにはこれ必要 */
	width:calc(864% / 1280 * 100);
	height:auto;
	background:#ffff00;
	background:none;
}
#column_right{
	display:inline-block;
	vertical-align: top;	/*インラインにはこれ必要 */
	width:calc(216% / 1280 * 100);
	width:calc(232% / 1280 * 100);
	height:30vw;
	background:#00ffff;
	background:none;
}
/* ============================================ */
/* 段組１：スマホ２段ＰＣ３段                   */
/* -------------------------------------------- */
.dangumi{
	width:100%;
	margin: auto;	/* 普通のブロック要素はマージンで中央寄せる */
}
/*	1の段 */
.dangumi .dan:nth-child(3n+1) {
	float:left;
	width:33.3%;
	height:calc(336vw / 12.8);
	text-align:center;
	background:#0000ff;
	background:none;
}
/*	2の段 */
.dangumi .dan:nth-child(3n+2) {
	float:left;
	width:33.3%;
	height:calc(336vw / 12.8);
	text-align:center;
	background:#00ffff;
	background:none;
}
/*	3の段 */
.dangumi .dan:nth-child(3n) {
	height:calc(336vw / 12.8);
	text-align:center;
	background:#00ff00;
	background:none;

}
/* 3の段に疑似要素をつけて回り込みを解除 */
.dangumi .dan:nth-child(3n):after {
   content: "";
   clear: both;
   display: block;
}
/* 最後の段はフロートさせない */
/* これまずくないか？
.dangumi .dan:last-child{
	float:none;
}
*/
/* 最後の要素に疑似要素をつけて回り込みを解除 */
/* これ、効いてないくさいんだよなぁ */
.dangumi .dan:last-child:after {
   content: "";
   clear: both;
   display: block;
}
/* -------------------------------------------- */
/* コンテンツカード */
.card_content{
	display:inline-block;
	position:static;
	width:calc(256vw / 12.8);
	height:calc(280vw / 12.8);
	box-shadow: 0.625vw 0.625vw 1.5vw rgba(0,0,0,0.3);
	border-radius: 0.75vw;
	text-align:left;	/*これで下位の要素を制御する*/
	font-size:0;
	line-height:0;	/*これがないと下位の要素の隙間がずれる*/
}
.card_content:hover{
-webkit-transform: rotate(3deg);
transform: rotate(3deg);
}
/* 画像をカード上に絶対値指定するためのラッパー */
.card_content .iconWrapper_smartphone,
.card_content .iconWrapper_arcade,
.card_content .iconWrapper_cellphone,
.card_content .iconWrapper_laptop,
.card_content .iconWrapper_desktop{
	display:block;
	position:relative;
	vertical-align:top; /*ずれなくなるおまじない！！！*/
	width:calc(144vw * 128 /144 / 12.8);
	height:calc(160vw * 128 /144 / 12.8);
	margin:auto;
	margin-top:0.5vw;
	background:#ff00ff;
	background:none;
}
/* 機体の画像 */
.dangumi .card_content .kyoutai{
	width:100%;
	height:100%;
}
/*	画面の画像*/
.iconWrapper_smartphone .kyoutai_screen{
	display:inline-block;
	position:absolute;
	width: calc(64vw * 128 /144 / 12.8);
	height:calc(96vw * 128 /144 / 12.8);
	left:  calc(40vw * 128 /144 / 12.8);
	top:   calc(32vw * 128 /144 / 12.8);
}
/*	画面の画像*/
.iconWrapper_arcade .kyoutai_screen{
	display:inline-block;
	position:absolute;
	width: calc(88vw * 128 /144 / 12.8);
	height:calc(66vw * 128 /144 / 12.8);
	left:  calc(28vw * 128 /144 / 12.8);
	top:   calc(27vw * 128 /144 / 12.8);
}
/*	画面の画像*/
.iconWrapper_cellphone .kyoutai_screen{
	display:inline-block;
	position:absolute;
	width: calc(60vw * 128 /144 / 12.8);
	height:calc(60vw * 128 /144 / 12.8);
	left:  calc(42vw * 128 /144 / 12.8);
	top:   calc(33vw * 128 /144 / 12.8);
}
/*	画面の画像*/
.iconWrapper_laptop .kyoutai_screen{
	display:inline-block;
	position:absolute;
	width: calc(100vw * 128 /144 / 12.8);
	height:calc( 75vw * 128 /144 / 12.8);
	left:  calc( 22vw * 128 /144 / 12.8);
	top:   calc( 50vw * 128 /144 / 12.8);
}
/*	画面の画像*/
.iconWrapper_desktop .kyoutai_screen{
	display:inline-block;
	position:absolute;
	width: calc(80vw * 128 /144 / 12.8);
	height:calc(60vw * 128 /144 / 12.8);
	left:  calc(10vw * 128 /144 / 12.8);
	top:   calc(61vw * 128 /144 / 12.8);
}
/* newとかの添え字 */
.card_content .soeji{
	position:absolute;
	top: 1.2vw;
	left: -4.3vw;
}
/* ゲームタイトル */
.card_content .title{
	display:block;
	width:100%;
	height:calc(64vw / 12.8);
	margin:0;
	margin-top:1vw;
	padding:0;
	text-align:center;
	line-height:calc(32vw / 12.8);
	overlap:hidden;
	background:#00FF00;
	background:none;
}
.card_content .media{
	display:block;
	width:100%
	height:calc(32vw / 12.8);
	margin-top:-0.5vw;
	text-align:center;
	line-height:calc(32vw / 12.8);
	overlap:hidden;
	background:#00FFFF;
	background:none;
}
.card_content .genre{
	display:block;
	width:100%
	height:calc(32vw / 12.8);
	text-align:center;
	line-height:calc(32vw / 12.8);
	margin-top:-0.5vw;
	overlap:hidden;
	background:#00FF00;
	background:none;
}
/* -------------------------------------------- */
/* コンテンツカード おすすめシリーズ用 */
#osusume{
	height:calc(190vw / 12.8);
}
#osusume .card_content{
	position:relative;
	width:calc(250vw / 12.8);
	height:calc(172vw / 12.8);
	text-align:center;
	vertical-align:center;
}
#osusume .card_content img{
	position:absolute;
	height:90%;
	object-fit: contain;
/*　中央揃え */
top: 50%;
left: 50%;
-webkit-transform: translate(-50%,-50%);
-moz-transform: translate(-50%,-50%);
-ms-transform: translate(-50%,-50%);
-o-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
}
/* ============================================ */
/* 段組２：スマホ１段ＰＣ２段                   */
/* PC版では2段に並べる                          */
/* -------------------------------------------- */
.dangumi2{
	width:100%;
	margin: auto;	/* 普通のブロック要素はマージンで中央寄せる */
}
/*	奇数の段 */
.dangumi2 .dan:nth-child(2n+1) {
	float:left;
	display:block;
	width:50%;
	height:calc(160vw / 12.8);
	height:calc(168vw / 12.8);
	text-align:center;
	background:#ff0000;
	background:none;
}
/*	偶数の段 */
.dangumi2 .dan:nth-child(2n){
/*	float:left; コレ書いてはダメみたいだ */
	height:calc(160vw / 12.8);
	height:calc(168vw / 12.8);
	text-align:center;
	background:#0000ff;
	background:none;
}
/* 偶数段に疑似要素をつけて回り込みを解除 */
.dangumi2 .dan:nth-child(2n):after{
	content:"";
	clear:both;
	display:block;
}
/* 最後の段はフロートさせない */
.dangumi2 .dan:last-child{
	float:none;
}
/* 最後の要素に疑似要素をつけて回り込みを解除 */
.dangumi2 .dan:last-child:after {
   content: "";
   clear: both;
   display: block;
}
/* -------------------------------------------- */
/* コンテンツカード横長 */
.dangumi2 .dan .card_content{
	display:inline-block;	/*これじゃないとダメ？*/
	position:static;
	width:calc(416vw / 12.8);
	height:calc(144vw / 12.8);
/*	margin:auto;	オートで並べると右側のやつが画面中央に来ちゃう */
	box-shadow: 5px 5px 12px rgba(0,0,0,0.3);
	border-radius: 6px;
	box-shadow: 0.625vw 0.625vw 1.5vw rgba(0,0,0,0.3);
	border-radius: 0.75vw;
	text-align:left;	/*これで下位の要素を制御する*/
	line-height:0;	/*これがないと下位の要素の隙間がずれる*/
}
/* 文字とかを横に並べるためのイメージのラッパー */
.dangumi2 .dan .card_content .iconWrapper_square{	/* カード上に絶対値指定するためのラッパー */
	display:inline-block;
	position:relative;
	vertical-align:top; /*ずれなくなるおまじない！！！*/
	width:calc(128vw / 12.8);
	height:calc(128vw / 12.8);
	margin-left:calc(8vw / 12.8);
	margin-top:calc(8vw / 12.8);
	background:none;
}
/* 画像:スマホ用の正方形アイコンとか。筐体画像とか*/
/* 正方形じゃないやつは、フィッティングされる */
.dangumi2 .dan .card_content img{
	display:block;
	position:absolute;
	width:100%;
	height:100%;
	object-fit: contain;
}
/* newとかの添え字 .iconWrapper_squareに入れた*/
.dangumi2 .dan .card_content .soeji{
	top: 1.2vw;
	left: 0.5vw;
}
/* 画像をカード上に絶対値指定するためのラッパー*/
/* 段組2向けに、縦128に縮小、および、全体の形状を正方形にする */
/* 修正部分以外は、上の段組１向けのやつを継承 */
.dangumi2 .card_content .iconWrapper_smartphone,
.dangumi2 .card_content .iconWrapper_arcade,
.dangumi2 .card_content .iconWrapper_cellphone,
.dangumi2 .card_content .iconWrapper_laptop,
.dangumi2 .card_content .iconWrapper_desktop{
	display:inline-block;
	width:calc( 128vw / 12.8);
	height:calc(128vw / 12.8);
	margin-left:calc(8vw / 12.8);
	margin-top:calc(8vw / 12.8);
	background:#ff0000;
	background:none;
}
/*	画面の画像*/
.dangumi2 .card_content .iconWrapper_smartphone .kyoutai_screen{
	width: calc( 64vw * 128 / 160 / 12.8);
	height:calc( 96vw * 128 / 160 / 12.8);
	left:  calc( 48vw * 128 / 160 / 12.8);
	top:   calc( 32vw * 128 / 160 / 12.8);
}
.dangumi2 .card_content .iconWrapper_arcade .kyoutai_screen{
	width: calc( 88vw * 128 / 160 / 12.8);
	height:calc( 66vw * 128 / 160 / 12.8);
	left:  calc( 36vw * 128 / 160 / 12.8);
	top:   calc( 27vw * 128 / 160 / 12.8);
}
.dangumi2 .card_content .iconWrapper_cellphone .kyoutai_screen{
	width: calc( 60vw * 128 / 160 / 12.8);
	height:calc( 60vw * 128 / 160 / 12.8);
	left:  calc( 50vw * 128 / 160 / 12.8);
	top:   calc( 33vw * 128 / 160 / 12.8);
}
.dangumi2 .card_content .iconWrapper_laptop .kyoutai_screen{
	width: calc(100vw * 128 / 160 / 12.8);
	height:calc( 75vw * 128 / 160 / 12.8);
	left:  calc( 30vw * 128 / 160 / 12.8);
	top:   calc( 50vw * 128 / 160 / 12.8);
}
.dangumi2 .card_content .iconWrapper_desktop .kyoutai_screen{
	width: calc( 80vw * 128 / 160 / 12.8);
	height:calc( 60vw * 128 / 160 / 12.8);
	left:  calc( 18vw * 128 / 160 / 12.8);
	top:   calc( 61vw * 128 / 160 / 12.8);
}
.dangumi2 .dan .card_content .title{
	display:inline-block;
	vertical-align:top; /*ずれなくなるおまじない！！！*/
	margin:0;
	padding:0;
	width:calc(272vw / 12.8);
	width:calc(264vw / 12.8);
	height:calc(56vw / 12.8);
	line-height: calc(28vw / 12.8);;	/*領域の高さに*/
	margin-left:calc(136vw / 12.8);
	margin-left:calc(144vw / 12.8);
	margin-top:calc(-130vw / 12.8);
	margin-top:calc(-120vw / 12.8);
	text-align:left;
	background:#00FF00;
	background:none;
}
.dangumi2 .dan .card_content .commentary{
	display:inline-block;
	vertical-align:top; /*ずれなくなるおまじない！！！*/
	margin:0;
	padding:0;
	width:calc(264vw / 12.8);
	height:calc(64vw / 12.8);
	margin-left:calc(144vw / 12.8);
	margin-left:calc(152vw / 12.8);
	margin-top:calc(-74vw / 12.8);
	margin-top:calc(-64vw / 12.8);
	line-height: calc(32vw / 12.8);	/*領域の高さに*/
	line-height: calc(22vw / 12.8);	/*領域の高さに*/
	text-align:left;
	overflow:hidden;
	background:#00FFFF;
	background:none;
}
/* ============================================ */
/* 段組３：スマホ１段ＰＣ３段                   */
/* -------------------------------------------- */
.dangumi3{
	width:100%;
	margin: auto;	/* 普通のブロック要素はマージンで中央寄せる */
}
/*	1の段 */
.dangumi3 .dan:nth-child(3n+1) {
	float:left;
	width:33.3%;
	text-align:center;
	background:#0000ff;
	background:none;
}
/*	2の段 */
.dangumi3 .dan:nth-child(3n+2) {
	float:left;
	width:33.3%;
	text-align:center;
	background:#00ffff;
	background:none;
}
/*	3の段 */
.dangumi3 .dan:nth-child(3n) {
	text-align:center;
	background:#00ff00;
	background:none;
}
/* 3の段に疑似要素をつけて回り込みを解除 */
.dangumi3 .dan:nth-child(3n):after {
   content: "";
   clear: both;
   display: block;
}
/* 最後の段はフロートさせない */
.dangumi3 .dan:last-child{
	float:none;
}
/* 最後の要素に疑似要素をつけて回り込みを解除 */
.dangumi3 .dan:last-child:after {
   content: "";
   clear: both;
   display: block;
}
/* -------------------------------------------- */
/* コンテンツカード */
.dangumi3 .dan .card_content{
	display:inline-block;
	position:relative;	/*画像載せるんで*/
	line-height:0;	/*これがないと下位の要素の隙間がずれる*/
	width:80%;		/* ％で指定すると、３段目が親を全幅として認識するのでまずい！*/
	width:calc(250vw / 12.8);
	height:calc(130vw / 8);
	border-radius: 1.5vw;
	box-shadow: 0.625vw 0.625vw 1.5vw rgba(0,0,0,0.3);
	margin:auto;
	text-align:left;	/*これで下位の要素を制御する*/
}

/* 文言 */
.dangumi3 .dan .card_content>div{
	vertical-align:top;
	line-height:1.5rem;
	margin-top:5%;
	margin-left:5%;
	margin-right:5%;
    font-weight: bold;	/* webkitが勝手にやってる */
	font-size:1rem;
	background:#ffff00;
	background:none;
}
/* マーク */
.dangumi3 .dan .card_content span{
	font-size:1.5rem;
    font-weight: normal;
	margin-right:1rem;
	background:#ff0000;
	background:none;
}
/* バッジ */
.dangumi3 .dan .card_content>img{
	display:block;
	position: absolute;
	top: 100%;
	left: 50%;
}
.dangumi3 .dan:first-child img{
	height:45%;
	-ms-transform: translate(-50%,-100%);
	-webkit-transform : translate(-50%,-100%);
	transform : translate(-50%,-100%);
}
.dangumi3 .dan:nth-child(2) img{
	height:35%;
	-ms-transform: translate(-50%,-115%);
	-webkit-transform : translate(-50%,-115%);
	transform : translate(-50%,-115%);
}
.dangumi3 .dan:nth-child(3) img{
	height:30%;
	-ms-transform: translate(-50%,-125%);
	-webkit-transform : translate(-50%,-125%);
	transform : translate(-50%,-125%);
}

/* ============================================ */
/* 段組４：スマホ１段ＰＣ１段                   */
/* -------------------------------------------- */
.dangumi4{
	width:100%;
	margin: auto;	/* 普通のブロック要素はマージンで中央寄せる */
}
.dangumi4 .dan {
	display:block;
	position:relative;
	width:100%;
	height:16vw;
}
/* -------------------------------------------- */
/* コンテンツカード */
.dangumi4 .dan .card_content{
	line-height:0;	/*これがないと下位の要素の隙間がずれる*/
	width:100%;
	height:90%;
	border-radius: 1.5vw;
	box-shadow: 0.625vw 0.625vw 1.5vw rgba(0,0,0,0.3);
	display:block;
	position:relative;
	margin:auto;
	text-align:left;	/*これで下位の要素を制御する*/
}
.dangumi4 .dan .card_content div:first-child{
	display:block;
	position:absolute;
	width:50%;
	height:100%;
	margin-left:0;
	margin-top:0;
	background:#ff0000;
	background:none;
}
.dangumi4 .dan .card_content div:nth-child(2){
	display:block;
	position:absolute;
	width:50%;
	height:100%;
	margin-left:50%;
	margin-top:0;
	background:#0000ff;
	background:none;
}
.dangumi4 img{
	width:100%;
	margin-top:1rem;
	object-fit: contain;	/*これで縦横比が整合するようだ なくてもいけてる*/
}
.dangumi4 .title{
	display:inline-block;
	vertical-align:top; /*ずれなくなるおまじない！！！*/
	margin:0;
	margin-left:5%;
	width:95%;
	height:1rem;
	margin-top:1rem;
	text-align:left;
	background:#00FF00;
	background:none;
}
.dangumi4 .commentary{
	display:inline-block;
	vertical-align:top; /*ずれなくなるおまじない！！！*/
	margin:0;
	padding:1rem;
	text-align:left;
	background:#ffff00;
	font-size:1rem;
	line-height:1.5;	/*数字だと倍率*/
	background:none;
}
/* ============================================ */
/*	下端のサブナビゲーション                    */
/* -------------------------------------------- */
#subnavi{
	display:none;

/*	height:600px;*/
/*	background:#00ff00;*/
}

/* ============================================ */
/* フッター                                     */
/* -------------------------------------------- */
/* フッタを下に吸着させるために全体をrelativeで包む */
#container_adjustFoot{
position: relative;.
width: 100%;
height: auto !important;
height: 100%;
min-height: 100%;
}
/* -------------------------------------------- */
/* フッタ全体の高さは、下のasideとdivの高さの和に */
/* なおかつ、上の方のスペーサspacer_footerに同じ値を入れて */
footer{
	position: absolute;
	bottom: 0;
	height:calc(190vw / 12.8);	/*140+30*/
/*	background:#ff0000; */
}
footer > aside{
	width:auto;
	height:calc(30vw / 12.8);
	margin:0;
	padding:0 calc(50vw / 12.8);
	text-align:right;
/*	background:#FCFCFB;*/
}
footer > section > div h2{
	width:auto;
	height:auto;
	margin:0;
	padding-left:0;
	padding-bottom:5px;
	padding-bottom:calc(5vw / 12.8);
	text-align:left;
	background:#C2C2BE;
}
footer > section > div{
	bottom:0;
	width:auto;
	height:calc(160vw / 12.8);
	margin-bottom:0;
	margin:0;
	padding:10px 30px;
	padding:calc(10vw/8) calc(30vw / 12.8);
	text-align:left;
	background:#C2C2BE;
	overflow:hidden;
}
/* ============================================ */



/* ============================================ */
/* へなへなシリーズで作った汎用品               */
/* -------------------------------------------- */
/* 更新履歴のテーブル */
#updates{
	margin-left:0%;
	width:100%;
	border-spacing:1rem;
}
#updates tr{
	line-height:1.5rem;
}
#updates td:nth-child(3n+1){
	width:20%;
	text-align:right;
	background:lightblue;
	background:none;
}
#updates td:nth-child(3n+2){
	width:11%;
	text-align:right;
	background:yellow;
	background:none;
}
#updates td:nth-child(3n+3){
	text-align:left;
	margin-left;20rem;
	background:lightgreen;
	background:none;
}


/* ============================================ */
/* 会社案内のところで作った汎用品               */
/* -------------------------------------------- */
/* テキストリンクの丸ボタン的修飾 */
.textLink_A{
	display:inline-block;
	border-radius: 1rem;
	margin-top:0.5rem;
	padding:0.2rem 1rem;
	box-shadow: 0.3vw 0.3vw 0.8vw rgba(0,0,0,0.3);
}
.textLink_B{
	display:inline-block;
	border-radius: 1rem;
	margin-top:0.8rem;
	margin-right:0.2rem;
	padding:0.05rem 0.5rem;
	box-shadow: 0.2vw 0.2vw 0.5vw rgba(0,0,0,0.3);
}
/* -------------------------------------------- */
/* メッセンジャー風画面 */
.messenger{
	width:90%;
	margin:auto;
}
.yose_hidari{
	text-align:left;
}
.yose_migi{
	text-align:right;
	line-height:8rem;
}
.fukidashi_L{
	display:inline-block;
	padding:0.5rem 1.5rem;
	line-height:1.5rem;
	border-radius: 1rem;
	line-height:2rem;
}
.fukidashi_R{
	margin-top:1rem;
	display:inline-block;
	padding:0.5rem 1.5rem;
	line-height:1.5rem;
	border-radius: 1rem;
	max-width:80%;
/*	border : solid 0.2vw #50b090; */
}
/* ============================================ */
/* 会社案内のところのテーブル                   */
/* モバイルとPCとで調整が必要。　　　　　　　　 */
/* -------------------------------------------- */
/* 会社概要のところのテーブル */
#kaishagaiyou{
	margin-left:8%;
}
#kaishagaiyou tr{
	line-height:1.5rem;
}
#kaishagaiyou td{
	padding:0.3rem;
}

#kaishagaiyou td:nth-child(2n-1){
	color:#666666;
	padding-right:2rem;
	width:30%;
	text-align:right;
}
/* -------------------------------------------- */
/* 代表者略歴のところのテーブル1 */
#umedamasateru{
	margin-left:8%;
	margin-bottom:1.5rem;
}
#umedamasateru tr{
	line-height:1.5rem;
}
#umedamasateru th{
	text-align:left;
	margin-left;5%;
}
#umedamasateru td:nth-child(2n+1){
	width:20%;
	background:blue;
	background:none;
}
/* 代表者略歴のところのテーブル2 */
#sakuhinrireki{
	margin-left:8%;
}
#sakuhinrireki tr{
	line-height:1.5rem;
}
#sakuhinrireki th{
	text-align:left;
	margin-left;5%;
}

#sakuhinrireki td:nth-child(3n+1){
	width:13%;
	background:blue;
	background:none;
}
#sakuhinrireki td:nth-child(3n+2){
	width:40%;
	background:blue;
	background:none;
}
/* -------------------------------------------- */
/* 連絡先のところのテーブル1 */
#renrakusaki{
	margin-left:20%;
	margin-top:1rem;
}
#renrakusaki tr{
	line-height:1.5rem;
}
#renrakusaki td:nth-child(2n+1){
	width:50%;
	padding-right:2rem;
	text-align:right;
	background:blue;
	background:none;
}

/* ============================================ */
/* モーダルウインドウ関連                       */
/* -------------------------------------------- */

/* 黒と並列すると、下になっちゃうので、黒の子要素にする */
.half_black img{
/*	display:block;　これダメ */
	margin-top: 5vh;
	height:90vh;
	object-fit: contain;	/*これで縦横比が整合するようだ*/
}
/* ============================================ */



/* ============================================ */
/* 広告関連                                     */
/* -------------------------------------------- */
/* PCではセンターの広告を切る */
#ad_center{
	display:none;
}