@charset "UTF-8";

/* ================================== */
/* 今回のサンプル(A〜D)の共通デザイン */
/* ================================== */
/*                           */
/*                           */
/* 以下のCSSは、描画領域の横幅に関係なく、常に適用されます。 */
/* 描画領域の横幅が600px・850px以上になった際には、別途HTMLソース側に記述したCSSで装飾を上書きする形(＝モバイルファースト)でレスポンシブ・ウェブデザインを実現しています。 */

img.AutoFitWidth600Max { 
	width:100%;
	/* max-width: 100%; */
	max-width: 600px;
	height: auto;
}
img.AutoFitWidth700Max { 
	width:100%;
	max-width: 700px;
	height: auto;
}
img.AutoFitWidth800Max { 
        width: 100%;
}

.inputwidth {
	width: 98%;
}

.pc { display: none !important; }
.sp { display: block !important; }


	/* -------------------------- */
	/* ▼ページ周囲の余白をなくす */
	body {
		padding: 0;
		margin: 0;
	}

	/* -------------------- */
	/* ▼メインカラムの装飾 */
	/* -------------------- */
	.main-column {
		background-color: #ffffff;	/* 背景色 */
		padding: 1px 0px;		/* 内側の余白(上下に1px) */
	}
	.main-box {
		margin: 1em;
		line-height: 1.5;
	}
	.main-box ul li {
		line-height: 1.8;
	}
	.main-box h3 {
		margin-top: 1em;
		padding-top: 1em;
		border-top: 1px dashed gray;
	}



	/* ------------------ */
	/* ▼ヘッダ部分の装飾 */
	.pageheader {
		background-color: #ffffff;

		
		margin: 0px;
		//padding: 1em;
		border-bottom: 1px solid #222222;
	}

	/* ------------------ */
	/* ▼フッタ部分の装飾 */
	.pagefooter {
		background-color: #333333;
		margin: 0px;
		padding: 1em;
		border-top: 1px solid #333333;
	}

	.wrapbox {
	        width : 95%;
		max-width: 800px;
	}
	
	
	.wrapbox500 {
	        width : 95%;
		max-width: 500px;
	}
	
	

/* ================================================================================================================ */