@charset "UTF-8";
@import url("../app_common.css");


/*----------------------------------------------------------*/
/* タブメニュー領域											*/
/*----------------------------------------------------------*/
#menu_tab {
	margin: 0px;
}

#menu_tab a {
		float	:left;

	display			:block;
	width			:130px;
	background-color:#ddd;
	padding			:4px 4px;
	margin			:0px 0px 2px 2px;
	border			:1px solid #333;
	text-align		:center;
}

@media screen and (min-width: 600px) {
	#menu_tab a {
		margin			:0px 0px 6px 6px;
	}
}
@media screen and (min-width: 960px) {
	#menu_tab {
		margin	:0px 24px 0px 24px;
	}

	#menu_tab a {
		padding			:11px 4px;
		margin			:12px 12px 0px 24px;
		border-bottom	:0px;
		border-radius	:10px 10px 0px 0px / 10px 10px 0px 0px;
		box-shadow		:3px 0px 2px 0px #999;
	}

	#contents {
		margin	:0px 24px 12px;
	}
@m}


/*----------------------------------------------------------*/
/* メイン領域												*/
/*----------------------------------------------------------*/
/*
#description_msg {
	padding			:4px 8px;
	margin			:4px 4px;
	background-color:#eee;
	border			:1px solid #99c;
	font-size		:14px;
}
*/

/* 左領域（画像選択等の領域） */
#main_left_area {
	float	:left;
	width	:50%;
}
@media screen and (min-width: 600px) {
	#main_left_area {
/*
		width	:135px;
		width	:-webkit-calc(100% - 425px) ;
		width	:calc(100% - 425px);
*/
		width	:25%;
	}
}
@media screen and (min-width: 960px) {
	#main_left_area {
		width	:150px;
	}
}

/* 画像選択領域 */
#search_img_area {
	width	:128px;
	height	:128px;
	border	:1px solid #999;
	margin	:4px auto 0px;
}
@media screen and (min-width: 600px) {
	#search_img_area {
		margin	:4px auto 0px;
	}
}
@media screen and (min-width: 960px) {
	#search_img_area {
		border	:2px solid #999;
		margin	:8px auto 0px;
	}
}

#search_thumb img {
	max-width		:128px;
	max-height		:128px;
}

#search_img_msg {
	padding	:2px;
	background-image	:url("../../img/filedrag.jpg");
	background-position	:50% 50%;
	background-repeat	:no-repeat;
}

#search_img_msg_header {
	font-size	:26px;
	font-weight	:bold;
	text-align	:center;
}

#search_img_msg_content {
	font-size	:11px;
	margin		:10px 0px;
}

/* 解析するボタン領域 */
#search_btn_area {
	text-align	:center;
}

#search_btn {
	font-size	:20px;
	font-weight	:bold;
	width		:128px;
}



/* 右領域（操作手順等の領域） */
#main_right_area {
	float		:left;
	text-align	:center;
	width		:50%;
	padding		:0px;
}
@media screen and (min-width: 600px) {
	#main_right_area {
		width	:55%;
		padding	:0px 0px 0px 0px;
	}
}
@media screen and (min-width: 960px) {
	#main_right_area {
		width	:710px;
		padding	:0px 0px 0px 20px;
	}
}


/* 操作手順領域 */
#manual_img_area {
	float		:left;

	background	:none;
	margin		:0px 0px 0px 0px;
}

#description_msg {
	padding			:4px 8px;
	margin			:0px 4px 4px;
	background-color:#eee;
	border			:1px solid #99c;
	font-size		:14px;
	text-align		:left;
}

@media screen and (min-width: 600px) {
	#manual_img_area {
		background	:url(../../img/manual.png) top center no-repeat;
		width		:410px;
		height		:150px;
		margin		:2px 0px 0px 0px;
	}

	#manual_img {
		display		:none;
		text-align	:center;
	}

	#description_msg {
		margin			:90px 4px 4px;
	}
}
@media screen and (min-width: 960px) {
	#manual_img_area {
		width		:510px;
		margin		:6px 0px 0px 0px;
	}
}



/* 凡例・ご利用方法領域 */
#legend_notice_msg {
	float		:right;

	font-size	:11px;
	text-align	:left;
	width		:80px;
	padding		:0px;
	margin		:8px auto 12px;
}
@media screen and (min-width: 600px) {
	#legend_notice_msg {
		font-size	:13px;
		padding		:2px;
		margin		:4px 0px 4px 4px;
	}
}
@media screen and (min-width: 960px) {
	#legend_notice_msg {
		padding		:4px;
		margin		:4px 0px 4px 8px;
	}
}





/* 最初の画面に戻るボタン */
#top_return_btn{
	margin	:12px 12px 12px 0px;
}


/* 検索結果領域 */
.result_header {
	background-color:#fc9;
	font-weight		:bold;
	border			:1px solid #666;
	border-bottom	:0px;
	padding			:4px 8px;
	margin			:8px 0px 0px;
}

.result_area {
	border		:1px solid #666;
	padding		:0px 2px 4px;
	background-color: #F0F9E3;
}
@media screen and (min-width: 600px) {
	.result_header {
		margin	:20px 0px 0px;
	}

	.result_area {
		padding	:4px 12px 12px;
	}
}

.result_rec_no {
	text-align	:right;
	font-weight	:bold;
	padding		:0px;
}
@media screen and (min-width: 600px) {
	.result_rec_no {
		padding		:4px 0px 8px;
	}
}

@media screen and (max-width: 959px) {
	.all_view_btn {
		font-size	:11px;
	}

	.rec_no {
		font-size	:0px;
	}

	.rec_no:before {
		font-size	:13px;
		content		:'6';
	}
}


.result_additional_msg {
	display	:none;
}
@media screen and (min-width: 600px) {
	.result_additional_msg {
		display	:block;
	}
}



.search_result_tbl_area {
	width		:auto;
}

.search_result_tbl {
	width			:100%;
	border-spacing	:0;
	border-top		:1px solid #333;
	background-color:#fff;
	float			:left;
	margin			:2px 0px 2px 2x;
}

.search_result_tbl td {
	width			:16.6%;
	text-align		:center;
	vertical-align	:top;
	border-right	:1px solid #333;
	border-bottom	:1px solid #333;
	word-break		:break-all;
}

.search_result_tbl tr td:first-child {
	border-left	:1px solid #333;
}

.search_result_td_6over {
	display		:none;
}

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

@media screen and (min-width: 960px) {
	.search_result_tbl td {
		width			:12.5%;
	}

	.search_result_td_6over {
		display			:table-cell;
	}
}


.search_result_tbl .img_tr img {
	width		:100%;
	max-width	:100px;
}

.search_result_tbl .str_tr td {
	height		:20px;
	font-size	:1.2em;
}

.search_result_tbl .source_tr td {
	display	:none;
}
@media screen and (min-width: 600px) {
	.search_result_tbl {
		margin			:2px 4px 2px 2px;
	}
}

@media screen and (min-width: 960px) {
	.search_result_tbl {
		margin			:2px 4px 2px 2px;
	}

	.search_result_tbl .source_tr td {
		display			:table-cell;
	}
}


/* SMSボタン領域 */
#sms_button_area {
	text-align	:right;
	margin		:16px 2px 4px 0px;
}
@media screen and (min-width: 600px) {
	#sms_button_area {
		margin		:12px 8px 0px 0px;
	}
}
@media screen and (min-width: 960px) {
	#sms_button_area {
		margin		:24px 12px 0px 0px;
	}
}

#sms_button_area > div {
	display			:inline-block;
	margin-bottom	:5px;
	vertical-align	:bottom;
}

#sms_button_area > iframe {
	display			:inline-block;
	margin-bottom	:5px;
	vertical-align	:bottom;
}