@charset "utf-8";
*{
	box-sizing:border-box;
}
html{
	width:100%;
	overflow-x:hidden;
}
body,
div,
span,
td,
input,
textarea
{
	box-sizing:border-box;
}
body{
	width:100%;
	background-color:#CCCCCC;
	margin: 0;
}
strong.red{
	color:red;
}
#id_area_caution{
	color:red;
	padding:0px 12px 12px 12px;
	margin-bottom:12px;
	font-size:0.9rem;
}

#wrapper {
	width: 950px;
	margin: 0px auto;
	padding: 0px;
	box-shadow:0px 0px 12px #555555;
	overflow:auto;
}

#header ul#h_nav{
	display:flex;
	display:-webkit-flex;

	flex-flow:row nowrap;
	-webkit-flex-flow:row nowrap;
	-moz-flex-flow:row nowrap;
	-ms-flex-flow:row nowrap;

	justify-content:flex-start;
	-webkit-justify-content:flex-start;
	-moz-justify-content:flex-start;
	-ms-justify-content:flex-start;

	align-items:center;
	-webkit-align-items:center;
	-moz-align-items:center;
	-ms-align-items:center;
	list-style-type:none;
	margin-top:12px;
	margin-bottom:0px;
	padding-right:18px;
}

#header ul#h_nav > li:first-child:after{
	content: '｜';
	margin-left:0px;
	margin-right:0px;
	color:transparent;
}
#header ul#h_nav > li:last-child:before{
	margin-left:0px;
	margin-right:0px;
	content: '｜';
	color:transparent;
}
#header ul#h_nav > li > a{
	color:white;
	font-size:0.87rem;
}

#header{
	width: 100%;
	height: 76px;
	margin: 0;
	padding: 20px 8px 6px 15px;

	text-align: left;
	background-color: #1a3d8c;
	overflow: hidden;
	box-shadow:0px 0px 12px #555555;

	display:flex;
	display:-webkit-flex;

	flex-flow:row nowrap;
	-webkit-flex-flow:row nowrap;
	-moz-flex-flow:row nowrap;
	-ms-flex-flow:row nowrap;

	justify-content:space-between;
	-webkit-justify-content:space-between;
	-moz-justify-content:space-between;
	-ms-justify-content:space-between;

	align-items:center;
	-webkit-align-items:center;
	-moz-align-items:center;
	-ms-align-items:center;

}

#footer{
	width: 100%;
	margin: 0;
	padding: 12px;
	text-align: center;
	background-color: #eeeeee;
	overflow: hidden;
	font-size:0.9rem;
}

#footer a,
#footer a:visited
{
	color:#1b3872;
}
small {
	font-size: 80%;
}
#footer p {
	margin-top: 0.5em;
	text-align: center;
	line-height: 1.5em;
}
#main {
	background-color:white;
	min-height: 100vh;
	width: 100%;
	background-color:white;
	margin: 0px;
	padding: 24px;
	clear: both;
	overflow: hidden;
	border-left:1px solid #AAAAAA;
	border-right:1px solid #AAAAAA;
	overflow:auto;
	position:relative;
}
input.cls_val{
	width:60px;
	text-align:right;
	padding:4px;
	border-radius:4px;
	box-shadow:none;
	outline:none;
	border:1px solid #AAAAAA;
}
h1{
	margin:0px;
}
table.def{
    border-collapse:collapse;
	width:100%;
}
table#id_table_input.def tr.child.close > td{
	border-top:0px none;
}
table#id_table_input.def tr.child.close > td > div{
	display:none;
}
table#id_table_input.def td{
	padding:0px;
}

table.def th,
table.def td
{
	padding:6px;
	font-size:0.9rem;
	border-top:1px solid #AAAAAA;
}
#id_table_input td{
	padding:0px;
}
#id_table_input td > div{
	padding:6px;
}
#id_table_input td > div > a{
	width:100%;
	height:100%;
}

table.def th{
	background-color:#1a3d8c;
	color:white;
	padding:12px 6px;
}
table.def td.nowrap,
table.def th.nowrap
{
	width:10px;
	white-space:nowrap;
}
td.d{
	text-align:center;
}
tr.group > td,
tr.bikou > td
{
	background-color:#DDDDDD;
	font-weight:bold;
	padding:12px 0px !important;
	cursor: pointer;
	display: table-cell;
	text-align:left;
}
tr.bikou > td{
	text-align:center;
	cursor:default;
	border-top: 6px double black;
}
tr.group > td:hover{
	font-size:0.94rem;
	transition-property: font-size;
	transition-duration: 0.2s;
}

tr.group > td > div.caret{
	font-family: 'Font Awesome 5 PRO';
	content: '\f078';
	color: #1a3d8c;
	font-weight:bold;
	margin-right:12px;
	margin-left:6px;
	display:inline-block;
}
td.new{
	position:relative;
}
tr.open > td.new:before,
span.new_icon:before
{
	background-color:red;
	color:white;
	position:absolute;
	font-size:0.6rem;
	border-radius:6px;
	border:1px solid red;
	text-align:center;
	display:block;
	left:-12px;
	top:-6px;
	padding:2px;
	opacity:0.8;
	transition-property: opacity;
	transition-duration: 0.2s;
}
tr.close > td.new:before{
	opacity:0.0;
	transition-property: opacity;
	transition-duration: 0.2s;
}
span.new_icon:before{
	display:inline-block;
	margin-right:2px;
	margin-left:2px;
	width:48px;
	position:static;
}

tr.open > td.item_new:before,
span.new_icon:before
{
	content: 'NEW';
}
tr.open > td.item_zaiko_limit:before{
	content: '在庫限り';
	background-color:#007dc4;
	border-color:#007dc4;;
}
tr.open > td.item_zaiko_small:before{
	content: '在庫僅少';
	background-color: #5e9e36;
	border-color:#5e9e36;
}

div.controller{
	width:100%;
	margin-top:24px;
	padding:24px 12px;
	height:auto;
	text-align:center;
	border-top:1px dotted #AAAAAA;
	display:flex;
	display:-webkit-flex;

	flex-flow:row nowrap;
	-webkit-flex-flow:row nowrap;
	-moz-flex-flow:row nowrap;
	-ms-flex-flow:row nowrap;

	justify-content:center;
	-webkit-justify-content:center;
	-moz-justify-content:center;
	-ms-justify-content:center;

	align-items:center;
	-webkit-align-items:center;
	-moz-align-items:center;
	-ms-align-items:center;

}

div.controller.flex-column{
	flex-flow:column nowrap;
	-webkit-flex-flow:column nowrap;
	-moz-flex-flow:column nowrap;
	-ms-flex-flow:column nowrap;
}

div.controller > input{
	margin-bottom:12px;
}

div.controller > #id_area_print_caution{
	padding:24px;
	background-color:#F0F0F0;
	margin-bottom:24px;
}

div.controller > #id_area_print_caution::before{
	font-family: 'Font Awesome 5 PRO';
	content: '\f06a';
	color: red;
	font-size:1.2rem;
}
a.btn,
input.btn
{
	text-decoration:none !important;
	font-size:1.0rem;
	font-weight:bold;
	padding:12px 24px;
	margin:0px 12px;
	text-align:center;
	cursor:pointer;
	background-image:url('');
	box-shadow:none;
	border:1px solid #AAAAAA;
	border-radius:6px;
}
	a.btn{
		display:inline-block;
	}
	a.btn:hover,
	input.btn:hover
	{
		filter:brightness(120%);
	}

a.btn_white,
input.btn_white
{
	color:#555555 !important;
	background-color:#EEEEEE;
	background-image:url('');
	border-radius:6px;
	border:1px solid #AAAAAA;
	cursor:pointer;
}
a.btn_green,
input.btn_green
{
	border-radius:6px;
	border:1px solid #AAAAAA;
	background: #299a0b;
	background: -moz-linear-gradient(top, #299a0b 0%, #5cc43c 100%);
	background: -webkit-linear-gradient(top, #299a0b 0%,#5cc43c 100%);
	background: linear-gradient(to bottom, #299a0b 0%,#5cc43c 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#299a0b', endColorstr='#5cc43c',GradientType=0 );
	color:white;
	font-weight:bold;
}

input.wide{
	width:240px;
}

#id_res{
	display:none;
	padding:12px;
	text-align:left;
}
#id_res input{
	width:600px;
	margin-left:12px;
}
.hidden{
	display:none;
}
#id_area_confirm{
	padding:24px;
	border:2px solid #1a3d8c;
	border-radius:12px;
}
#id_area_confirm h2{
	width:100%;
	font-size:1.6rem;
	text-align:center;
	color:#1a3d8c;
	margin:0px;
}
#id_area_confirm_html{
	margin-bottom:12px;
}
span.hissu{
	color:white;
	background-color:red;
	font-size:9px;
	font-weight:bold;
	display:inline-block;
	margin-left:4px;
	padding:2px 4px;
	text-align:center;
	width:auto;
	border-radius:2px;
	text-shadow:none !important;
}
	span.hissu:before{
		content: "必須";
		color:white;
	}
	#id_hissu_caution > span.hissu{
		margin-right:4px;
	}

input[type='text'],
input[type='email'],
input[type='tel'],
input[type='number'],
textarea
{
	padding:6px;
	background-image: url('');
	border: 1px solid #AAAAAA;
	border-radius: 4px;
}
#id_btn_new_order{
	margin:2px 0px 8px 0px;
	font-weight:normal;
	font-size:1.0rem;
}

#form_caution{
	display:none;
}
#frmregist > table{
	border:1px solid #AAAAAA;
}
#frmregist table td{
	padding:12px;
}
#id_area_save_form{
	font-size:0.9rem;
	padding:12px;
	border-top:1px dotted #DDDDDD;
	width:100%;
}
div.caution,
#id_hissu_caution
{
	padding-bottom:12px;
}
#id_top_caution > span.hosoku,
#id_hissu_caution
{
	font-size:0.7rem;
}
div.error{
	color:red;
	font-weight:bold;
	font-size:0.8rem;
	margin-top:4px;
	margin-left:6px;
	display:inline-block;
}
table.def td.left{
	background-color:#eaeffb;
	width:188px;
	white-space: break-spaces;
}
}
input[type='checkbox'] + label{
	margin-left:2px;
	margin-right:8px;
}
div.red{
	width:100%;
	color:red;
	font-size:0.7rem;
	margin-top:12px;
}
span.red{
	color:red;
}
#id_sec_input{
	overflow:visible !important;
}

tr#id_tr_form_user_field_1 label:after{
	content: '';
	display:block;
}

tr#id_tr_form_user_field_2{
	display:none;
}
tr#id_tr_form_user_field_3{
	display:none;
}
tr#id_tr_form_user_field_4{
	display:none;
}
tr#id_tr_form_user_field_5{
	display:none;
}

#user_field_1,
#user_field_2,
#user_field_3,
#user_field_4,
#user_field_5
{
	margin-left:12px;
	width:240px;
	display:none;
}
#id_bottom_comment{
	margin-top:12px;
	width:100%;
	height:128px;
}

#company_name,
#address
{
	width:100%;
	max-width:100%;
}
#mail,
#mail_again,
#tel,
#id_s_text1
{
	max-width:100%;
	width:360px;
}

span.special{
	color:red;
	font-size:0.7rem;
	margin-left:12px;
}

span.special:before{
	content: '※';
}
#ipt_comment,
#id_s_text3
{
	width:100%;
}
.form_note{
	color:red;
	font-size:0.8rem;
}
#id_area_form_privacy{
	border:4px solid #1a3d8c;
	padding:12px;
	border-radius:12px;
	margin-top:24px;
	display:none;
}
	h3{
		color:#1a3d8c;
		margin-bottom:6px;
	}

	#id_area_form_privacy > h3:first-child{
		margin-top:6px;
	}

	#id_area_form_privacy > p{
		padding-left:24px;
	}

	#id_area_form_privacy li{
		font-size:0.9rem;
	}

#furi_first_name,
#furi_last_name,
#first_name,
#last_name,
#id_s_text5,
#id_s_text6,
#id_s_text7,
#id_s_text8
{
	width:120px;
	margin:2px;
}

div.div_item_img{
	text-align:center;
	width:100%;
	padding:2px 0px;
	overflow:visible !important;
}

img.item_img{
	width:48px;
}

#lightbox{
	padding:12px;
	background-color:white;
}
span#lightboxCaption{
	text-align:center;
	padding:12px;
	background-color:white;
	font-size:1.2rem;
	width:100% !important;
	margin-top:4px;
	white-space:nowrap;
}

#overlay{
	background-color:black;
}

a.scaleup{
	display:block;
}
a.scaleup:hover{
	transition: all 200ms 0s ease;
	transform: scale(2.20,2.20);
}

.screen_mode_hide{
	display:none;
}
.screen_mode_show{
	display:block;
}

td.click{
	cursor:pointer;
}

#id_overlay{
	z-index:99;
	top:0px;
	left:0px;
	position:fixed;
	visibility:hidden;
	width:100vw;
	height:100vh;
	background-color:rgba(0,0,0,0.6);
}

#id_float_window{
	z-index:100;
	visibility:hidden;
	position:fixed;
	top: 50%;
	left: 50%;
	transform: translateY(-50%) translateX(-50%);
	-webkit- transform: translateY(-50%) translateX(-50%);
}

#id_float_window > #id_float_window_inner{
	background-color:white;
	border:1px solid #AAAAAA;
	box-shadow:0px 0px 6px #555555;
	border-radius:6px;
}

#id_float_window_inner > div.image{
	padding:12px 0px;
	width:100%;
	height:520px;
	text-align:center;
	color: #DDDDDD;
}
#id_float_window_inner > div.item_code_and_close{
	width:100%;
	height:auto;
	color:blue;
	font-weight:bold;
	text-align:center;
	font-size:1.0rem;
	padding: 18px 12px;
	border-bottom: 1px solid #AAAAAA;
	line-height: 18px;
	position:relative;
}

#id_float_window_inner > div.item_code_and_close > span.item_code{
	width:100%;
	font-weight:bold;
	font-size:1.0rem;
	line-height: 18px;
}
#id_float_window_inner > div.item_code_and_close > a.close{
	display:inline-block;
	cursor:pointer;
	position:absolute;
	right:18px;
	top:18px;
	color:#AAAAAA;
}
	#id_float_window_inner > div.item_code_and_close >a.close::before{
		content: '\f410';
		font-family: 'Font Awesome 5 PRO';
		font-size:1.6rem;
	}
	#id_float_window_inner > div.item_code_and_close > a.close:hover{
		color: #333333;
	}

#id_float_window_inner > div.image > img{
	object-fit:contain;
	width:100%;
	height:100%;
}
#id_float_window_inner > div.title{
	width:100%;
	height:".$title_height."px;
	line-height:33px;
	overflow:hidden;
	background-color:#1a3d8c;
	text-align:center;
	color: #FFFFFF;
	padding:4px 6px;
	font-size:0.95rem;
}
#id_float_window_inner > div.detail{
		width:100%;
		font-size:0.9rem;
		height:120px;
		line-height:20px;
		overflow:hidden;
		background-color:white;
		text-align:left;
		color: #333333;
		padding:12px;
		background-color:#EEEEEE;
	}

ol.kakko,
ol.kakko2
{
	list-style-type:none;
	padding-left:48px;
}
ol.kakko > li:first-child:before{
	margin-left:-32px;
	content: '(1) ';
	margin-right:5px;
}
ol.kakko > li:nth-child(2):before{
	margin-left:-32px;
	content: '(2) ';
	margin-right:5px;
}
ol.kakko > li:nth-child(3):before{
	margin-left:-32px;
	content: '(3) ';
	margin-right:5px;
}

ol.kakko2 > li:first-child:before{
	margin-left:-42px;
	content: '【1】 ';
}
ol.kakko2 > li:nth-child(2):before{
	margin-left:-42px;
	content: '【2】 ';
}
ol.kakko2 > li:nth-child(3):before{
	margin-left:-42px;
	content: '【3】 ';
}
ol.kakko2 > li:nth-child(4):before{
	margin-left:-42px;
	content: '【4】 ';
}

#id_print_header_new_application{
	width:100%;
	display:block;
	padding:24px;
	border:4px solid black;
	margin-bottom:6px;
}
#id_print_header_new_application_date{
	text-align:right;
	width:100%;
}
#id_print_header_new_application_atena{
	width:198px;
	margin-bottom:18px;
}
#id_print_header_new_application_atena_houjin{
	width:100%;
	text-align:left;
	white-space:nowrap;
}
#id_print_header_new_application_atena_rijichou{
	width:100%;
	text-align:right;
	white-space:nowrap;
}
#id_print_header_new_application_title{
	width:100%;
	text-align:center;
	margin-bottom:24px;
}
#id_print_header_new_application_title_shoshiki{
	font-size:12px;
	margin-right:12px;
}
#id_print_header_new_application_title_title{
	font-size:1.7rem;
	letter-spacing:18px;
	font-weight:bold;
}
#id_print_header_new_application_hosoku{
	text-align:center;
}

p.text{
	padding:6px;
}

p.text + p.text{
	margin-top:24px;
}

h3.border{
	margin-left:auto;
	margin-right:auto;
	margin-top:0px;
	padding:12px;
	border:1px solid black;
	text-align:center;
	width:auto;
}

div.blue{
	background-color:#eefbff;
	padding:12px;
	margin-bottom:18px;
	margin-top:12px;
	font-size:0.95rem;
	border:2px dotted #CCCCCC;
	border-radius:4px;
}

#id_string_down_icon{
	margin:0px 6px;
	font-weight:bold;
	color:#1a3d8c;
}

#breadcrumb{
	margin:0px;
	margin-bottom:12px;
	line-height: 1.75em;
	font-size:75%;
	width:100%;
	background-color:white;
}

p.footer-link > span:not(:last-child):after{
	content: ' | ';
}

#id_p_mudan{
	font-size:0.8rem;
}

/* 印刷モード */
@media print{
	@page {
		size:portrait;
		margin:0;
	}
	body{
		background-color:white;
		-webkit-print-color-adjust: exact;
	}
	form#frmregist table input,
	form#frmregist table textarea,
	form#frmregist table number,
	form#frmregist table select
	{
		border:0px none;
		padding:0px;
		font-size:0.9rem;
		background-color:white;
	}
	form#frmregist table input[type=checkbox]{
		border:0px none;
	}
	div#header{
		display:none;
	}
	div#footer{
		display:none;
	}
	div#main{
		box-shadow:none;
		border:0px none;
		top:0 !important;
		left:0 !important;
		width:100%;
	}
	.print_mode_hide,
	#id_hissu_caution,
	span.hissu,
	#id_tr_form_mail_again,
	#id_area_save_form,
	div.controller
	{
		display:none;
	}
	.print_mode_show{
		display:block;
	}
	select{
		-webkit-appearance: none;/* ベンダープレフィックス(Google Chrome、Safari用) */
		-moz-appearance: none; /* ベンダープレフィックス(Firefox用) */
		appearance: none; /* 標準のスタイルを無効にする */
	}
	input[type='checkbox']{
		visibility:hidden;
	}
	input[type='checkbox']:checked{
		visibility:visible;
	}
	#id_top_caution > h2,
	#id_print_title > h2
	{
		width:100%;
		text-align:center;
	}
	#id_print_title > #id_today{
		width:100%;
		text-align:right;
	}
	table.def th{
		background-color:#555555 !important;
		color:white;
	}
	table.def td,
	table.def th
	{
		font-size:0.9rem;
		border:1px solid black;
	}
	table.def td.left{
		width:208px;
		background-color:#EEEEEE;
		color:black;
	}
	form#frmregist table input#user_field_2,
	form#frmregist table input#user_field_3,
	form#frmregist table input#user_field_4,
	form#frmregist table input#user_field_5
	{
		padding-left:12px;
		padding-right:12px;
		border-left:1px solid black;
		border-right:1px solid black;
	}

	#id_area_submit_cancel_button{
		display:none;
	}

	#id_form_note_comment{
		color:black;
	}
	table.def td{
		padding-top:1px !important;
		padding-bottom:1px !important;
	}
	#id_tr_form_comment{
		display:table-row;
	}
	#id_print_header_new_application{
		padding:12px 24px;
	}
	#id_area_form_privacy{
		padding:6px 12px;
		margin-top:12px;
	}
	#breadcrumb{
		display:none;
	}
	#id_controller{
		display:none !important;
	}

}
