@charset "utf-8";

/************************************/
/*     データ入稿封筒全画面共通     */
/************************************/

/* common.cssのwrapperのpadding値を一部修正 */
.wrapper {
	padding-bottom: 10px;

}

/* common.cssのpagenavのmargin値を一部修正 */
.pagenav {
	margin-left: 10px;
	margin-right: 10px;

}



h3 {
	margin: 0 0 5px;
	padding: 2px 0 2px 7px;
	background-color: #CDCCBF;
	font-size: 100%;
	font-weight: 700;

}



/* 前のステップへボタン */
.btn_back {
	display: block;
	height: 20px;
	width: 120px;
	margin: 0;
	background: url("../../images/ms/btn_back.png") no-repeat scroll left center transparent;
	border: medium none;
	cursor: pointer;
	outline: medium none;
	text-decoration: none;
	text-indent: -9999px;

}
/* 次のステップへボタン */
.btn_next {
	display: block;
	height: 20px;
	width: 120px;
	margin: 0;
	background: url("../../images/ms/btn_next.png") no-repeat scroll left center transparent;
	border: medium none;
	cursor: pointer;
	outline: medium none;
	text-decoration: none;
	text-indent: -9999px;

}



/* 機能説明 */
div.sys_instruction {
	padding-left: 18px;
	margin-bottom: 10px;
	background: url(../../images/common/icn_inst.png) no-repeat left top;
	line-height: 1.4em;
	color: #000066;
	text-align: left;

}



/* 処理後のメッセージ表示領域 */
.sys_afHandlingMesWrap {
	margin: 5px 10px 0;
	line-height: 1.5em;
	border: dashed 1px #ffffff;

}
/* 「確認」「完了」の表示領域 */
.sys_afHandlingMesWrap .afHandlingMesHead {
	float: left;
	font-weight: bold;
	padding: 5px  0 4px 15px;

}
/* メッセージ */
.sys_afHandlingMesWrap .afHandlingMes {
	width: 860px;
	float: right;
	padding: 5px 0 4px 10px;

}

/* エラーメッセージ表示領域 */
.sys_afHandlingMesWrap.error {
	*border: dashed 1px #FF0000;
	background-color: #FF0000;
	color: #DC143C;

}
/* エラーメッセージの「確認」の表示領域 */
.sys_afHandlingMesWrap.error .afHandlingMesHead {
	color: #ffffff;

}
/* エラーメッセージ */
.sys_afHandlingMesWrap.error .afHandlingMes {
	background-color: #fff0f0;
	border-left: dashed 1px #FF0000;
	*border-left: dashed 1px #FFFFFF;

}

/* 処理成功メッセージ表示領域 */
.sys_afHandlingMesWrap.success {
	*border: dashed 1px #66ccff;
	background-color: #66ccff;
	color: #4682B4;

}
/* 「確認」の表示領域 */
.sys_afHandlingMesWrap.success .afHandlingMesHead {
	color: #FFFFF0;

}
/* 処理完了メッセージ */
.sys_afHandlingMesWrap.success .afHandlingMes {
	background-color: #F5FFFA;
	border-left: dashed 1px #66ccff;
	*border-left: dashed 1px #FFFFFF;

}



/************************************/
/*     ステップ１．基本仕様選択     */
/************************************/

/* 商品（封筒サイズ）・部材（封筒色）共通カテゴリ */
.categoryListWrap {
	margin: 0 0 10px;
	padding: 0;

}
/* 商品（封筒サイズ）カテゴリ一覧表示領域 */
categoryListWrap.product {}
/* 部材（封筒の色）カテゴリ一覧表示領域 */
categoryListWrap.material {}
/* 選択可能なカテゴリ */
.categoryListWrap div {
	width: 185px;
	height: 30px;
	float: left;
	margin: 0;
	padding: 0;
	text-align: center;

}
/* 選択中のカテゴリ */
.categoryListWrap div.btn_current {
	height: 25px;
	padding: 5px 0 0;
	background: url(../../images/ms/img_gbtn_0_current.png) no-repeat top left;
	color: #ffffff;
	font-weight: bold;

}
/* カテゴリのリンク */
.categoryListWrap div a {
	width: 185px;
	height: 25px;
	display: inline-block;
	*display: block;
	*zoom: 1;
	background: url(../../images/ms/img_gbtn_0.png) no-repeat top left;
	padding: 5px 0 0;

}
.categoryListWrap div a:hover{
	color: #ff9900;

}



/* 商品（封筒サイズ）一覧表示領域 */
.productsListWrap {
	margin: 10px 0 20px;
	padding: 5px 10px;

}
/* 商品（封筒サイズ）カタログ一覧本体 */
.productListBody {}

/* 商品（封筒サイズ）一情報表示領域 */
.productListBody .aProduct {
	display: inline-block;
	*display: inline;
	*zoom: 1;
	vertical-align: top;
	margin: 15px 6px 0;
	padding: 0;

}
/* 商品（封筒サイズ）サムネイル画像と商品名の背景 */
.productListBody .aProduct .productVisibleInfo {
	width: 170px;
	height: auto;
	background-color: #f7f7f7;
	text-align: center;

}

/* 商品（封筒サイズ）のサムネイル画像表示領域（推奨サイズは最大横160px以内・最大縦180px以内） */
.productListBody .aProduct .productVisibleInfo .productThumb1 {
	height: auto;
	width: 170px;
	margin-left: auto;
	margin-right: auto;
	padding: 17px 0 0;

}
/* 商品（封筒サイズ）の商品名表示領域 */
.productListBody .aProduct .productVisibleInfo .productName {
	margin: 12px 0 0;
	padding: 0 7px 12px;
	width: 156px;

}
/* 商品（封筒サイズ）の概要１表示領域 */
.productListBody .aProduct .productBrief1 {
	width: 170px;
	height: auto;
	margin: 0;
	padding: 5px 0;
	color: #333333;

}


/* 部材（封筒の色）一覧表示領域 */
.materialListWrap {
	margin: 0 0 30px;
	padding: 5px 10px;

}
/* 部材（封筒の色）カタログ一覧本体 */
.materialListBody {}
/* 部材（封筒の色）の一情報表示領域 */
.materialListBody .aMaterial {
	width: 447px;
	display: inline-block;
	*display: inline;
	*zoom: 1;
	vertical-align: top;
	margin: 7px 0 5px 10px;
	padding: 0;

}
/* 部材（封筒の色）のラジオボタン位置調整 */
.materialListBody .aMaterial input {
	vertical-align: middle;
	margin: 0 5px 0 0;

}
/* 部材（封筒の色）のサムネイル画像表示領域 */
.materialListBody .aMaterial .materialThumb1 {
	display: inline-block;
	*display: inline;
	*zoom: 1;
	vertical-align: middle;
	margin: 0 3px 0 0;
	padding: 0;

}
/* 部材（封筒の色）のサムネイル画像 */
.materialListBody .aMaterial .materialThumb1 img {
	vertical-align: middle;
	border: none;

}
/* 部材（封筒の色）の名称 */
.materialListBody .aMaterial .materialName {
	display: inline-block;
	*display: inline;
	*zoom: 1;
	vertical-align: middle;
	margin: 0;
	padding: 0;

}


/* 印刷色選択領域 */
.colorPrintingSelectWrap {
	margin: 0 0 40px;
	padding: 5px 10px;

}
/* 印刷色数名の一覧表示領域 */
.colorPrintingSelectWrap .colorPrintingNameListWrap {
	margin: 20px 0;
	padding: 0 10px 0 18px;

}
/* 印刷色数名 */
.aColorPrintingName {
	margin: 10px 0 0;
	padding: 0 0 3px 0;
	border-bottom: solid #dcdcdc 2px;

}
/* 印刷色数名のラジオボタンの配置（中央配置） */
.aColorPrintingName input {
	vertical-align: middle;
	margin: 0 5px 0 0;

}
/* 印刷色数名のラジオボタンのテキストの配置（中央配置） */
.aColorPrintingName label {
	vertical-align: middle;

}


/* 色一覧表示領域 */
.colorPrintingSelectWrap .colorListWrap {
	margin: 10px 10px 0 50px;
	padding: 2px;
	background-color: #F2F2EA;
	border: solid #dcdcdc 1px;

}
/* 色一覧のタイトル */
.colorPrintingSelectWrap .colorListWrap .colorLabel {
	width: 145px;
	display: inline-block;
	*display: inline;
	*zoom: 1;
	vertical-align: top;
	padding: 10px 0 10px 10px;
	margin: 0 10px 0 0;

}
/* 色一覧 */
.colorPrintingSelectWrap .colorListWrap .colorList {
	width: 695px;
	background-color: #ffffff;
	display: inline-block;
	*display: inline;
	*zoom: 1;
	margin: 0;
	padding: 0 0 10px;

}
/* 色の一情報表示領域 */
.aBasicColor {
	width: 200px;
	display: inline-block;
	*display: inline;
	*zoom: 1;
	vertical-align: top;
	margin: 10px 10px 0;
	padding: 0;

}
/* 色のラジオボタンの配置（中央揃え） */
.aBasicColor input {
	vertical-align: middle;

}
/* 色のラジオボタンのテキストの配置（中央揃え） */
.aBasicColor label {
	vertical-align: middle;

}
/* 色のサンプル色 */
.aBasicColor .basicColorRgb {
	width: 55px;
	height: 18px;
	display: inline-block;
	*display: inline;
	*zoom: 1;
	vertical-align: middle;
	border: solid #cccccc 1px;
	margin: 0 3px;
	padding: 0;

}

/* 特色選択・入力欄 */
.characterColor {
	width: 695px;
	display: inline-block;
	*display: inline;
	*zoom: 1;
	margin: 0;
	padding: 10px 10px 0;

}
/* 特色のテキストボックスのサイズ指定 */
.characterColor input.characterTxtBox {
	width: 280px;
	vertical-align: middle;

}
/* 特色のラジオボタンの配置指定 */
.characterColor input.characterRadio {
	vertical-align: middle;

}
/* 特色のラジオボタンのテキスト配置指定 */
.characterColor label {
	vertical-align: middle;
	margin-left: 3px;

}
/* 特色の例文 */
.characterColor .characterColorExa {
	display: inline-block;
	*display: inline;
	*zoom: 1;
	vertical-align: middle;

}



/************************************/
/*   ステップ２．原稿アップロード   */
/************************************/

/* 基本仕様確認と原稿アップロード領域 */
.specConfandMsUploadWrap {
	width: 698px;
	margin: 15px auto;
	padding: 0 2px 2px;
	border: solid 1px #808080;

}
/* 選択された基本仕様一覧 */
.specConfandMsUploadWrap .specConfList {}
/* 選択された基本仕様の一項目 */
.specConfandMsUploadWrap .specConfList .aSlctSpec {
	background-color: #F2F2EA;
	margin: 2px 0 0;
	padding: 0;

}
.specConfandMsUploadWrap .specConfList .aSlctSpec div {
	display: table-cell;
	*display: inline;
        *zoom: 1;
	vertical-align: middle;
	margin: 0;

}
/* 選択された基本仕様のラベル */
.specConfandMsUploadWrap .specConfList .aSlctSpec div.slctSpecLabel {
	width: 193px;
	padding-left: 7px;

}
/* 選択された基本仕様の内容表示領域 */
.specConfandMsUploadWrap .specConfList .aSlctSpec div.slctSpecContent {
	width: 491px;
	padding: 8px 0 7px 7px;
	background-color: #ffffff;
	border-bottom: solid 1px #e1e1e1;

}
/* 選択された基本仕様の内容 */
.specConfandMsUploadWrap .specConfList .aSlctSpec div.slctSpecContent div {
	padding: 0 7px 0 0;

}
/* 基本色のRGB表示指定 */
.specConfandMsUploadWrap .specConfList .aSlctSpec div.slctSpecContent div.basicColorRgb {
	width: 55px;
	height: 18px;
	border: solid #cccccc 1px;
	margin: 0;
	padding: 0;
}



/* 原稿アップロードフォーム */
.specConfandMsUploadWrap .msUploadForm {
	margin: 15px 7px 7px 15px;
	padding: 0;

}
/* 原稿アップロードにおける注意書き */
.specConfandMsUploadWrap .msUploadForm .sys_instruction {
	margin-bottom: 5px;

}

/* 原稿アップロードの選択項目 */
.specConfandMsUploadWrap .msUploadForm .aMsUploadSpec {
	background-color: #b1d0ed;
	margin: 2px 0 0;

}
.specConfandMsUploadWrap .msUploadForm .aMsUploadSpec div {
	display: table-cell;
	*display: inline;
        *zoom: 1;
	vertical-align: middle;
	margin: 0;

}
/* 原稿アップロードの選択項目ラベル */
.specConfandMsUploadWrap .msUploadForm .aMsUploadSpec div.msUploadFormLabel {
	width: 178px;
	padding-left: 7px;

}
/* 原稿アップロードの選択必須項目 */
.specConfandMsUploadWrap .msUploadForm .aMsUploadSpec div.msUploadFormLabel.indis {
	background: url(../../images/stamp/icn_indispensable_s.png) no-repeat 95%;

}
/* 原稿アップロードフォーム */
.specConfandMsUploadWrap .msUploadForm .aMsUploadSpec div.msUploadFormInpt {
	width: 484px;
	padding: 8px 0 7px 7px;
	background-color: #FFFFFF;
	border-bottom: solid 1px #e1e1e1;

}
.specConfandMsUploadWrap .msUploadForm .aMsUploadSpec div.msUploadFormInpt div {
	padding: 0 10px 0 0;

}
/* 原稿アップロードのフォーム定義 */
.specConfandMsUploadWrap .msUploadForm .aMsUploadSpec div.msUploadFormInpt input,select {
	width: 150px;

}
/* 作成ソフトのプルダウン */
.specConfandMsUploadWrap .msUploadForm .aMsUploadSpec div.msUploadFormInpt select.msSoftware {}
/* 作成ソフトのバージョン */
.specConfandMsUploadWrap .msUploadForm .aMsUploadSpec div.msUploadFormInpt input.msSoftwareVer {}
/* 作成ソフトのOS */
.specConfandMsUploadWrap .msUploadForm .aMsUploadSpec div.msUploadFormInpt select.msOs {}
/* 原稿アップロードのファイル選択 */
.specConfandMsUploadWrap .msUploadForm .aMsUploadSpec div.msUploadFormInpt input.msUploadFile {
	width: 80%;

}

/* アップロード済みの原稿がある場合 */
/* 注文する原稿選択用ラジオボタン */
.specConfandMsUploadWrap .msUploadForm .aMsUploadSpec div.msUploadFormInpt input.slctOrder {
	width: auto;
	display: inline-block;
	*display: inline;
	*zoom: 1;
	vertical-align: middle;
	margin-right: 3px;

}
/* 注文する原稿選択内容 */
.specConfandMsUploadWrap .msUploadForm .aMsUploadSpec div.msUploadFormInpt label {
	display: inline-block;
	*display: inline;
	*zoom: 1;
	vertical-align: middle;
	margin-right: 25px;

}



/* アップロード前の注意書き */
.msUploadcaution {
	width: 680px;
	margin: 30px auto 0;
	padding: 7px 10px;
	border: dashed 2px #ff9393;
	background-color: #fff8f8;
	line-height: 1.4em;
	color: #B22222;

}

/* アップロードボタン */
.btn_upload {
	display: block;
	height: 20px;
	width: 150px;
	margin: 0;
	background: url("../../images/common/btn_upload.png") no-repeat scroll left center transparent;
	border: medium none;
	cursor: pointer;
	outline: medium none;
	text-decoration: none;
	text-indent: -9999px;

}
