@charset "Shift_JIS";

/**====================
///// ’•Ά—š—π /////
====================**/


#BuyLogSarch {
	color: #fff;
	font-size: 14px;
	max-width: 600px;
	top: 100px;
	width: 100%;
}

#BuyLogSarch .input_dl,
#BuyLogSarch ul.disc_type {
	margin-bottom: 20px;
}

#BuyLogSarch .input_dl > dd {
	float: left;
	margin: 0 5px;
	width: auto;
}

#BuyLogSarch .pe_time {
	margin-bottom: 10px;
}

#BuyLogSarch .pe_time > div {
	float: left;
	margin-right: 0.5em;
}

#OrderHistory {
	margin-top: 20px;
}

.MODEbuylog2 .bill,
.MODEbuylog2 .others {
	float: left;
	width: 49%;
}

.MODEbuylog2 .ship {
	float: right;
	width: 49%;
}

.MODEbuylog2 .slip {
	text-align: center;
	margin: 10px auto;
	width: 100%;
	max-width: 748px;
}

.MODEbuylog2 .slip > li {
	padding: 10px;
	display: inline-block;
	text-align: center;
}

.MODEbuylog2 .slip > li > p {
	display: inline-block;
}

.MODEbuylog2 .slip > li > p:first-child:after {
	content: "F";
}

.MODEbuylog2 .slip > li > a {
	font-weight: bold;
	color: #f00;
}

.buyLog_hit {
	border: 1px solid #ccc;
	border-radius: 5px;
	box-shadow: 0 0 4px #ccc;
	font-size: 15px;
	padding: 10px;
}

.buyLog_hit > ul {
	float: left;
	width: 90%;
}

.buyLog_hit > ul > li {
	float: left;
	margin: 10px;
}

.buyLog_hit > ul > li:last-child {
	float: right;
	font-weight: bold;
	margin: 10px;
}

.buyLog_hit a.btn_type_4 {
	float: right;
	margin: 0 auto;
	padding: 10px;
}


/* --ƒƒbƒZ[ƒWƒ{ƒbƒNƒX-- */

#MsgBox {
	margin-bottom: 30px;
	margin-top: 30px;
}

#MsgBox form {
	margin: 0 auto 20px;
	max-width: 748px;
}

#MsgBox header {
	background: none;
	border: none;
	font-size: 15px;
	color: var(--mainthema-background-color);
}

#MsgBox section {
	display: table;
	width: 100%;
}

#MsgBox section > div {
	border: none;
	border-right: 1px solid #ccc;
	border-top: 1px solid #ccc;
	display: table-cell;
	padding: 5px;
	vertical-align: middle;
}

#MsgBox section > header {
	border: none;
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
	border-top: 1px solid #ccc;
	background-color: #eee;
	display: table-cell;
	padding: 5px;
	vertical-align: middle;
	width: 120px;
}

#MsgBox section:last-child > div,
#MsgBox section:last-child > header {
	border-bottom: 1px solid #ccc;
}

#MsgBox section ul input[type="text"] {
	width: 100%;
}

#MsgBox section ul li {
	display: inline-block;
	width: 100%;
}

#MsgButton {
	margin: 0 auto;
}

#MsgButton a {
	font-size: 20px;
	padding: 10px;
}

#MsgComentList {
	font-size: 15px;
	margin: 20px 0 40px;
}

#MsgComentList .customer > ul {
	background-color: #ffc;
}

#MsgComentList .customer > ul:hover {
	background-color: #ffffe9;
}

#MsgComentList .msg_close > ul:before {
	-moz-transform: rotate(-90deg);
	-webkit-transform: rotate(-90deg);
	transform: rotate(-90deg);
}

#MsgComentList .shop > ul {
	background-color: #eef;
}

#MsgComentList .shop > ul:hover {
	background-color: #f4f4ff;
}

#MsgComentList header {
	background: none;
	border: none;
	font-size: 15px;
	margin-bottom: 10px;
}

#MsgComentList section {
	border: 1px solid #ccc;
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
	margin: -1px auto 0;
	max-width: 748px;
}

#MsgComentList section > article {
	border: none;
	border-top: 1px dotted #ccc;
	display: block;
	margin: 0 10px;
	padding: 10px 20px;
}

#MsgComentList section > ul {
	cursor: pointer;
	display: table;
	padding: 5px 30px;
	position: relative;
	width: 100%;
}

#MsgComentList section > ul > li {
	display: table-cell;
}

#MsgComentList section > ul > li.msg_day {
	text-align: right;
	width: 160px;
}

#MsgComentList section > ul > li.msg_name {
	font-size: 13px;
	width: 250px;
}

#MsgComentList section > ul > li.msg_title {
	color: darkblue;
}

#MsgComentList section > ul:before {
	*display: inline;
	*zoom: 1;
	background-color: #fff;
	border: 1px solid #ccc;
	border-radius: 5px;
	bottom: 0;
	content: "₯";
	display: block;
	height: 20px;
	left: 5px;
	margin: auto;
	position: absolute;
	text-align: center;
	top: 0;
	vertical-align: middle;
	width: 20px;
}

#MsgComentList section > ul:hover > li.msg_title {
	color: #FF8C00;
	text-decoration: underline;
}

#MsgContent {
	box-sizing: border-box;
	resize: vertical;
	width: 100%;
}

#MsgContent ~ p {
	text-align: right;
}

#MsgBox .img_uploader > li {
	width: 100%;
	display: block;
	float: inherit;
	margin: 10px 0;
}

#MsgBox .img_uploader > li:first-child > label {
	box-sizing: border-box;
	width: 100%;
	float: left;
	position: relative;
	box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.4);
	border: 2px solid var(--mainthema-background-color);
	color: #fff;
	font-weight: bold;
	text-align: center;
	background-color: var(--mainthema-background-color);
	display: inline-block;
	border-radius: 5px;
	padding: 10px;
	cursor: pointer;
	transition-property: all;
	-webkit-transition-property: all;
	-moz-transition-property: all;
	-o-transition-property: all;
	-ms-transition-property: all;
}

#MsgBox .img_uploader > li:first-child > label:hover {
	background-color: #fff;
	color: var(--mainthema-background-color);
}

#MsgBox .img_uploader > li:first-child > label p {
	display: inline;
}

#MsgBox .img_uploader > li:first-child > label p#upfilevalue {
	display: none;
}

#MsgBox .img_uploader #upfile {
	position: absolute;
	z-index: -100;
	opacity: 0;
	width: 100%;
	left: 0;
	top: 0;
	height: 100%;
}

#MsgBox .img_uploader > li:last-child > div > label {
	display: block;
	float: left;
}

#MsgBox .img_uploader > li:last-child img {
	float: left;
	height: 30px;
	display: block;
	width: auto;
}

#MsgBox #captcha {
	width: 100px;
	height: 30px;
}

.secure_submit {
	position: relative;
}

.secure_submit > .secure_msg {
	position: absolute;
	top: -20px;
	left: 0;
	right: 60%;
	width: 220px;
	margin: 0 auto;
	text-align: center;
	font-size: 26px;
	font-weight: bold;
	color: #f00;
	border: 2px solid #f00;
	transform: rotate(-10deg);
	-moz-transform: rotate(-10deg);
	-webkit-transform: rotate(-10deg);
	background-color: #fff;
}

.secure_submit > a {
	display: block;
	border-radius: 5px;
	box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
	margin: 100px 0;
	padding: 10px;
	background-color: #AF0000;
	background: linear-gradient(to bottom, #FF6161, #AF0000);
	background: -ms-linear-gradient(top, #FF6161, #AF0000);
	background: -moz-linear-gradient(top, #FF6161 0%, #AF0000);
	background: -webkit-gradient(linear, left top, left bottom, from(#FF6161), to(#AF0000));
	font-family: "ƒƒCƒŠƒI", "Meiryo";
	box-shadow: 1px 2px 2px rgba(0, 0, 0, 0.3), 0px 1px 0px rgba(255, 255, 255, 0.8) inset, 0px -1px 0px rgba(255, 255, 255, 0.5) inset;
}

.secure_submit > a > p {
	display: block;
	font-weight: bold;
	padding: 20px 15px 15px 15px;
	background-color: #fff;
	color: #ff8c00;
	max-width: 600px;
	margin: 10px auto;
	border-radius: 10px;
	border: 2px solid #fff;
	text-align: center;
	transition-property: all;
	-webkit-transition-property: all;
	-moz-transition-property: all;
	-o-transition-property: all;
	-ms-transition-property: all;
	transition-duration: 0.5s;
	-webkit-transition-duration: 0.5s;
	-moz-transition-duration: 0.5s;
	-o-transition-duration: 0.5s;
	-ms-transition-duration: 0.5s;
}

.secure_submit > a:hover > p {
	/*		border-color                       : #f00;	*/
	color: #f00;
	box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
	border-color: #f00;
}

.secure_submit > a > p > span {
	display: block;
}

.secure_submit > a > p > span.secure_title {
	font-size: 18px;
}

.secure_submit > a > p > span.secure_note {
	font-size: 12px;
	line-height: 1.8em;
	margin: 10px 0;
	color: #f00;
	display: block;
}

#FileupErrMsg {
	text-align: center;
	font-size: 13px;
	font-weight: bold;
	color: #f00;
	margin: 10px 0;
}

#MsgComentList2 {
	max-width: 100%;
	margin: 0 auto;
	height: 660px;
	overflow-y: auto;
	border: 1px solid #ccc;
	border-top: 0;
	/*		border-bottom                      : 0;	*/
	padding: 20px;
}

#MsgComentList2 > .msg_block {
	clear:both;
	margin-bottom: 10px;
	width: 80%;
}

#MsgComentList2 > .msg_block.msg_left {
	float: left;
}

#MsgComentList2 > .msg_block.msg_right {
	float: right;
}


/*
	#MsgComentList2 > .msg_block:last-child {
		margin-bottom                      : 0;
	}
*/

#MsgComentList2 .msg_block.new_log > ul > li:first-child:before {
	content: "NEW";
	color: #f00;
	padding: 0 10px;
	display: inline;
	float: left;
	font-weight: bold;
}

#MsgComentList2 > .msg_block.msg_left > ul {
	float: left;
}

#MsgComentList2 > .msg_block.msg_right > ul {
	float: right;
}

#MsgComentList2 > .msg_block.msg_left > ul li {
	text-align: left;
}

#MsgComentList2 > .msg_block.msg_right > ul li {
	text-align: right;
}

#MsgComentList2 > .msg_block.msg_left .coment_div {
	background-color: rgba(var(--mainthema-background-rgb), 0.1);
	border: 2px solid var(--mainthema-background-color);
	color: #000;
	border-radius: 10px;
}

#MsgComentList2 > .msg_block.msg_right .coment_div {
	background-color: lightgreen;
	color: #000;
	border: 2px solid darkcyan;
	border-radius: 10px;
}

#MsgComentList2 > .msg_block .coment_div {
	clear: both;
}
#MsgComentList2 > .msg_block .coment_div fieldset {
	position: relative;
	display: inline-block;
	border: 2px solid #999;
	padding: 16px;
}
#MsgComentList2 > .msg_block .coment_div legend {
	position: absolute;
	left: 0;
	right: 0;
	top: -10px;
	width: 190px;
	margin: auto;
	text-align: center;
	background-color: #fff;
}

#MsgComentList2 > .msg_block.msg_right p.msg_img > a {
	float: right;
}

#MsgComentList2 > .msg_block.msg_left p.msg_img > a {
	float: left;
}

#MsgComentList2 > .msg_block p.msg_img > a > img {
	max-height: 200px;
	width: auto;
}

#MsgComentList2 > .msg_block p.msg_img > a:hover > img {
	opacity: 0.5;
}

#MsgComentList2 > .msg_block p.msg_img:after {
	content: "";
	display: block;
	clear: both;
}
#MsgComentList2 > .msg_block.msg_system {
	display:none;
	clear: both;
	float: left;
	width: 100%;
	margin: 50px 0 20px;
	text-align: center;
	font-size: 1.2em;
	color: black;
	font-weight: bold;
}
#MsgComentList2 > .msg_block.msg_system:last-child {
	display:block;
}

#MsgTextBox {
	max-width: 100%;
	display: block;
	width: 100%;
	margin: 0 auto;
	/*		background-color: #0b2265;
		background                         : linear-gradient(to bottom, #89c, #0b2265);
		background                         : -ms-linear-gradient(top, #89c, #0b2265);
		background                         : -moz-linear-gradient(top, #89c 0%, #0b2265);
		background                         : -webkit-gradient(linear, left top, left bottom, from(#ff0000), to(#ff0000));	*/
}

#MsgTextBox > .bbs_formset {
	width: 100%;
	line-height: 30px;
	background: none;
}

#MsgTextBox > div {
	/*		display                            : table-cell;	*/
	vertical-align: bottom;
	padding: 1px;
	background-color: #ff0000;
	background: linear-gradient(to bottom, #ff0000, #ff0000);
	background: -ms-linear-gradient(top, #ff0000, #ff0000);
	background: -moz-linear-gradient(top, #ff0000 0%, #ff0000);
	background: -webkit-gradient(linear, left top, left bottom, from(#ff0000), to(#ff0000));
	margin: 10px 0;
}

#MsgTextBox > a {
	vertical-align: middle;
	padding: 0;
	margin: 0;
	line-height: 48px;
	font-size: 18px;
}

#MsgTextBox .msg_img{
	font-size: 16px;
	float: left;
	width: 30%;
	text-align: center;
	line-height: 48px;
	background: none;
	margin:0;
}

#MsgTextBox .msg_img div {
	color: #fff;
	font-size: 18px;
	font-weight: bold;
	cursor: pointer;
	display: block;
	width: 100%;
	text-align: center;
}

#MsgTextBox .msg_img label {
	position: relative;
	display: inline-block;
	padding-left: 40px;
}

#MsgTextBox .msg_img img {
	margin: auto;
	width: 30px;
	display: block;
}

#MsgTextBox .msg_img img.img_icon {
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	left: 0;
	height: 22px;
	width: 40px;
	margin: auto 0;
}

#MsgTextBox > a span {
	display: block;
}


#MsgTextBox > .msg_submit {
	float: right;
	width: 69%;
	text-align: center;
	margin:0;
	background:none;

}

#MsgTextBox > .msg_submit {
	font-size: 16px;
	display: inline-block;
	line-height: 26px;
	margin: 0;
	padding: 0;
}
#MsgTextBox .textarea_title{
	color: #fff;
	padding: 9px;
	display: inline-block;
	font-weight: bold;
}

#MsgTextBox textarea {
	line-height: 20px;
	box-sizing: border-box;
	width: 100%;
	display: block;
	resize: none;
	border:none;
}

#MsgComentTitle {
	max-width: 100%;
	margin: 0 auto;
	padding: 5px;
	text-align: center;
	font-weight: bold;
	font-size: 16px;
	white-space: nowrap;
	-o-text-overflow: ellipsis;
	text-overflow: ellipsis;
	overflow: hidden;
	background-color: var(--mainthema-background-color);
	color: #fff;
	text-shadow: 1px 1px 2px #000;
}

#MsgTextBox .upfile_text {
	color: #fff;
}

@media screen and (max-width: 768px) {
	#MsgComentList2 {
		height: 400px;
	}
	#MsgTextBox > a span > i {
		display:none;
	}
}

@media screen and (max-width: 480px) {
	#MsgTextBox > .msg_img {
		width: 16%;
		display: block;
		height: 50px;
	}
	#MsgTextBox > .msg_submit {
		width: 82%;
	}
	#MsgTextBox > .msg_img {
	}
	#MsgTextBox > .msg_img label {
		white-space: nowrap;
		text-indent: -9999px;
		width: 100%;
		padding: 0;
	}
	#MsgTextBox > a.msg_img img.img_icon {
		margin: auto;
	}
}


/*₯₯₯₯₯Responsive₯₯₯₯₯*/

@media screen and (max-width: 768px) {
	/* =768pxˆΘ‰Ί‚̏ꍇ= */
	/* 1ƒJƒ‰ƒ€ */
	/* MODEbuylog2 */
	#MsgBox section > div {
		border: 1px solid #ccc;
		display: block;
		margin-top: -1px;
		width: 100%;
	}
	#MsgBox section header {
		padding: 0;
	}
	#MsgBox section header,
	#MsgBox section ul li {
		display: block;
		width: 100%;
	}
	#MsgComentList section > ul > li {
		display: block;
	}
	#MsgComentList section > ul > li.msg_day {
		float: right;
		width: 100%;
	}
	#MsgComentList section > ul > li.msg_name {
		float: left;
		width: 100%;
	}
	.MODEbuylog2 .bill,
	.MODEbuylog2 .others,
	.MODEbuylog2 .ship {
		float: inherit;
		width: 100%;
	}
	.MODEbuylog2 .slip > li > p:after {
		display: none;
	}
	.MODEbuylog2 .slip > li > p {
		display: block;
	}
}


/* V’•Ά—š—πˆκ——css */
	.buylog_list {
		margin: 20px 0;
	}

	.buylog_list .buylog_list_head {
		border: 1px solid var(--mainthema-background-color);
		background-color: rgba(var(--mainthema-background-rgb),0.1);
		border-radius: 4px 4px 0 0;
		padding: 10px;
		overflow: hidden;
		width: 100%;
	}
	.buylog_list .buylog_list_head ul{
		display: grid;
		gap: 10px;
	    grid-template-areas:
				"no day tmp1 button"
				"tmp2 tmp2 tmp2 total";
		grid-template-columns: auto auto 1fr 240px;
	}
	.buylog_list .buylog_list_head ul span:first-child:after{
		content: "F";
	}
	.buylog_list .buylog_list_head ul li.buylog_list_head___d{
		grid-area: day;
	}
	.buylog_list .buylog_list_head ul li.buylog_list_head___n{
		grid-area: no;
	}
	.buylog_list .buylog_list_head ul li.buylog_list_head___b{
		grid-area: button;
	}
	.buylog_list .buylog_list_head ul li.buylog_list_head___t{
		text-align:right;
		grid-area: total;
	}
	.buylog_list .buylog_list_head ul li.buylog_list_head___t span:last-child{
		font-size:1.8em;
		font-weight:bold;
		color:red;
	}
	.buylog_list .buylog_list_foot {
		border: 1px solid var(--mainthema-background-color);
		background-color: #fff;
		border-radius: 0 0 4px 4px;
		padding: 0 10px;
		overflow: hidden;
		border-top: none;
		width: 100%;
	}
/*
	.buylog_list .buylog_list_table td {
		padding: 0 10px;
		line-height: 27px;
	}

	.buylog_list .buylog_list_table_a {
		float: right;
		width: 200px;
	}

	.buylog_list .buylog_list_table_a td {
		text-align: center;
	}

	.buylog_list .buylog_list_table_a a.buylog2_btn {
		border: 1px solid darkblue;
		border-radius: 4px;
		display: block;
		background-color: #fff;
		line-height: 25px;
		overflow: hidden;
		position: relative;
		text-indent: -10px;
	}

	.buylog_list .buylog_list_table_a a.buylog2_btn:after {
		content: "";
		display: inline-block;
		width: 0px;
		height: 0px;
		border-top: 5px solid transparent;
		border-right: 8px solid transparent;
		border-bottom: 5px solid transparent;
		border-left: 8px solid darkblue;
		position: absolute;
		top: 0;
		bottom: 0;
		margin: auto 0 auto 5px;
	}

	.buylog_list .buylog_list_table_a a.buylog2_btn:hover {
		border-color: #FF8C00;
		color: #FF8C00;
	}

	.buylog_list .buylog_list_table_a a.buylog2_btn:hover:after {
		border-left-color: #FF8C00;
	}

	.buylog_list .buylog_list_table_a a.buylog2_btn.buylog_navi_alert {
		color: #f00;
		border-color: #f00;
		font-weight: bold;
	}

	.buylog_list .buylog_list_table_a a.buylog2_btn.buylog_navi_alert:after {
		border-left-color: #f00;
	}

	.buylog_list .buylog_list_table_b {
		float: left;
	}

	.buylog_list .buylog_list_table_b .total {
		color: #f00;
		font-weight: bold;
	}
*/
	.buylog_list .buylog_navi_alert {
		color: red;
		border-color: red;
	}
	.buylog_list .status_msg {
		width: 95%;
		margin: 20px auto;
	}

	.buylog_list .status_msg>span:nth-child(2) {
		font-size: 20px;
		font-weight: bold;
		color: #333;
	}

	.buylog_list .buylog_list_foot .item_list li {
		margin: 20px 10px;
	}

	.buylog_list .buylog_list_foot .item_list li .item_image {
		width: 80px;
		float: left;
		margin-left: 20px;
		margin-right: 30px;
	}

	.buylog_list .buylog_list_foot .item_list li .item_name {
		font-size: 13px;
		line-height: 20px;
	}

	.buylog_list .buylog_list_foot .item_list li .item_maker, .buylog_list .buylog_list_foot .item_list li .item_no {
		font-size: 12px;
	}

	.buylog_list .buylog_list_foot .item_list li .item_tanka {
		font-size: 12px;
		color: #f00;
	}
	@media screen and (max-width: 768px) {
		.buylog_list .buylog_list_head ul{
			grid-template-areas: 
					"no"
					"day"
					"total"
					"button";
			gap: 5px;
			grid-template-columns: 1fr;
		}
		/*
		.buylog_list_table.buylog_list_table_b{
			width:100%;
		}
		.buylog_list_table.buylog_list_table_a{
			margin:auto;
			float: inherit;
		}
		.buylog_list .buylog_list_table_a a.buylog2_btn{
		    line-height: 50px;
			font-size: 15px;
		}
		.buylog_list .buylog_list_table_a a.buylog2_btn:after{
			border-top-width: 8px;
			border-right-width: 8px;
			border-bottom-width: 8px;
			border-left-width: 14px;
		}
		*/

	}