@charset "utf-8";

::selection { background-color: #777; }
::placeholder{	color: #777; }

#wp{
	clear: both; float: left;
	width: 100%; height: auto;
	padding: 0; margin: 0;
}
#drop_box_memo{
	clear: both; float: left;
	padding: 5px; margin: 0; width: 100%;
	text-align: left; color: #fff; font-size: 100%; line-height: 30px; letter-spacing: 0px; text-indent: 0px;
	background-color: #333;
	border-bottom: 1px #555 solid;
	animation: drop_box_memo_a1 1000ms ease 0s 1 normal;			
	animation-fill-mode: forwards;
}
@keyframes drop_box_memo_a1 {
	0% { opacity:0; }
	100% { opacity:1.0; }
}
#drop_box_memo span{
	text-align: left; color: #0cc; font-size: 100%; line-height: 30px; letter-spacing: 0px; text-indent: 0px;
	cursor: pointer;
}
#drop_box{
	clear: both;
	padding: 65px 20px 0 20px; width: 220px; height: 220px;
	background-color: #111;
	border: 2px #09f dashed; border-radius: 7px;
	text-align: center; color: #aaa; font-size: 113%; line-height: 40px;
	overflow: hidden;
	position: relative;
	margin: auto; top: 50px; right: 0; bottom: 0; left: 0;
	text-align-last: justify;
	text-justify: inter-ideograph;
}
#drop_box:hover{
	transition: all 500ms ease 0ms;
	background-color: #222; border: 2px #0af dashed; color: #fff;
}
#drop_box input[type="file"]{
	position: absolute; top: -50px; right: 0;
	width: 100%; height: 125%;
	font-size: 1px;
	cursor: pointer;
	opacity: 0; filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);
}
#file_joho_box{
	display: none;
	clear: both; float: left;
	padding: 5px 0 10px 0; margin: 0; width: 100%; height: auto;
	border-bottom: 1px #333 solid;
	overflow: hidden;
}
.file_joho_box_w{
	clear: both; float: left;
	padding: 0 5px; margin: 0; width: 190px; height: 24px;
	text-align: left; color: #fff; font-size: 88%; line-height: 24px;
}
#file_joho_kensuu, #file_joho_ngfile, #file_joho_size, #file_joho_size_aes{
	float: left;
	padding: 0; margin: 0; width: 80px; height: 24px;
	text-align: right; color: #fff; font-size: 88%; line-height: 24px;
}
#img_box{
	display: none;	
	clear: both; float: left;
	padding: 0; margin: 20px 0 0 0; width: 100%;
	background-color: #000;
}
#img_box div{
	float: left;
	padding: 0; margin: 0;
	width : calc( 100vw / 4); height:  calc( 100vw / 4);
	background-color: #333;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	overflow: hidden;
	display: flex; align-items: center; justify-content: center;
	border-style: none;
}
@media screen and (min-width: 500px){ #img_box div{ width : calc( 100vw / 5); height:  calc( 100vw / 5); } }
@media screen and (min-width: 600px){ #img_box div{ width : calc( 100vw / 6); height:  calc( 100vw / 6); } }
@media screen and (min-width: 700px){ #img_box div{ width : calc( 100vw / 7); height:  calc( 100vw / 7); } }
@media screen and (min-width: 800px){ #img_box div{ width : calc( 100vw / 8); height:  calc( 100vw / 8); } }
@media screen and (min-width: 900px){ #img_box div{ width : calc( 100vw / 9); height:  calc( 100vw / 9); } }
@media screen and (min-width: 1000px){ #img_box div{ width : calc( 100vw / 10); height:  calc( 100vw / 10); } }
@media screen and (min-width: 1100px){ #img_box div{ width : calc( 100vw / 11); height:  calc( 100vw / 11); } }
@media screen and (min-width: 1200px){ #img_box div{ width : calc( 100vw / 12); height:  calc( 100vw / 12); } }
#img_box div img{
	display: none;
	padding: 0; margin: 0; width: 75%; height: 75%;
	object-fit: cover;
	border-style: none;
}
#kaishi_box{
	display: none;
	clear: both; float: left;
	padding: 0; margin: 0; width: 100%; height: auto;
}
#kaishi_kinou_box{
	clear: both; float: left;
	padding: 0; margin: 0; height: auto; width: 100%; max-width: 100%;
}
@media screen and (min-width: 960px){ #kaishi_kinou_box{ max-width: 49.5%; } }
#kaishi_box_er{
	clear: both; float: left;
	padding: 10px 3px; margin: 20px 0 5px 0; width: 100%; height: auto; min-height: 48px;
	background-color: #f00;
	border: 1px #fff solid; border-radius: 4px;
	text-align: left; color: #fff; font-size: 100%; line-height: 26px; letter-spacing: 0px; text-indent: 0px; font-weight: bold;
}
#kaishi_kagi_box{
	clear: both; float: left;
	padding: 0; margin: 0; width: 100%; max-width: 100%;
}
#kaishi_t{
	float: left;
	padding: 0 0 0 3px; margin: 0; width: auto; height: 35px;
	text-align: left; color: #fff; font-size: 100%; line-height: 35px;
	cursor: pointer;
}
#kaishi_kagi_input{
	clear: both; float: left;
	padding: 0; margin: 0; width : calc( 100% - 57px); height: 40px;
	background-color: #fbc;
}
#kaishi_kagi_input input{
	padding: 0 3px; margin: 0; width: 100%; height: 100%;
	text-align: left; color: #000; font-size: 100%; line-height: 40px;
}
#kaishi_kagi_sw{
	float: left;
	padding: 0; margin: 0 0 0 7px; width: 50px; height: 40px;
	background-color: #088;
	border: 1px #777 solid; border-radius: 4px;
	text-align: center; color: #fff; font-size: 100%; line-height: 40px;
}
#kaishi_kagi_sw:hover{ background-color: #0aa; cursor: pointer; }
#kaishi_dl_box{
	clear: both; float: left;
	padding: 0; margin: 25px 0 0 0; width: 100%;
}
#kaishi_dl{
	float: left;
	padding: 0 0 0 3px; margin: 0; height: 35px;
	text-align: left; color: #fff; font-size: 100%; line-height: 35px;
	cursor: pointer;
}
#kaishi_dl_bb{
	clear: both; float: left;
	padding: 0; margin: 0; width: 100%;
}
#kaishi_dl_bb div{
	float: left;
	padding: 0; margin-right: 1.25%; height: 35px; width : 19%;
	background-color: #555;
	border: 1px #fff dashed; border-radius: 4px;
	text-align: center; color: #fff; font-size: 88%; line-height: 35px;
	opacity:0.4; cursor: pointer;
}
#kaishi_dl_bb div:nth-child(1){
	border: 1px #aaa solid; opacity:1.0; cursor: default;
}
#kaishi_dl_bb div:last-child{
	margin-right: 0;
}
#kaishi_yuukoukigen_box{
	clear: both; float: left;
	padding: 0; margin: 25px 0 0 0; width: 100%;
}
#kaishi_yuukoukigen{
	float: left;
	padding: 0 0 0 3px; margin: 0; height: 35px;
	text-align: left; color: #fff; font-size: 100%; line-height: 35px;
	cursor: pointer;
}
#kaishi_yuukoukigen_bb{
	clear: both; float: left;
	width: 100%;
}
#kaishi_yuukoukigen_bb div{
	float: left;
	padding: 0; margin-right: 1.25%; height: 35px; width : 19%;
	background-color: #555;
	border: 1px #fff dashed; border-radius: 4px;
	text-align: center; color: #fff; font-size: 88%; line-height: 35px;
	opacity:0.4; cursor: pointer;
}
#kaishi_yuukoukigen_bb div:nth-child(1){
	border: 1px #aaa solid; opacity:1.0; cursor: default;
}
#kaishi_yuukoukigen_bb div:last-child{
	margin-right: 0;
}
#kaishi_yuukoukigen_bb2{
	clear: both; float: left;
	width: 100%;
}
#kaishi_yuukoukigen_bb2 div{
	float: left;
	padding: 0; margin: 10px 1.25% 0 0; height: 35px; width : 19%;
	background-color: #555;
	border: 1px #fff dashed; border-radius: 4px;
	text-align: center; color: #fff; font-size: 88%; line-height: 35px;
	opacity:0.4; cursor: pointer;
}
#kaishi_yuukoukigen_bb2 div:last-child{
	margin-right: 0;
}
#kaishi_password_box{
	clear: both; float: left;
	padding: 0; margin: 25px 0 0 0; width: 100%;
}
#kaishi_password_t{
	float: left;
	padding: 0 0 0 3px; margin: 0; height: 35px;
	text-align: left; color: #fff; font-size: 100%; line-height: 35px;
	cursor: pointer;
}
#kaishi_password_bb{
	clear: both; float: left;
	padding: 0; margin: 0; width: 100%;
}
#kaishi_password_bb div{
	float: left;
	padding: 0; margin: 0; height: 35px; width : 49.5%;
	background-color: #555;
	border: 1px #fff dashed; border-radius: 4px;
	text-align: center; color: #fff; font-size: 100%; line-height: 35px;
	opacity:0.4; cursor: pointer;
}
#kaishi_password_bb div:nth-child(1){
	margin-right: 1%;
}
#kaishi_password_bb div:last-child{
	border: 1px #aaa solid; opacity:1.0; cursor: default;
}
#kaishi_password_input_b{
	visibility: hidden;
	clear: both; float: left;
	padding: 0; margin: 10px 0 0 0; width: 100%;
}
#kaishi_password_input_box{
	clear: both; float: left;
	padding: 0; margin: 0; width : calc( 100% - 57px); height: 40px;
}
#kaishi_password_input_box input{
	padding: 0 3px; margin: 0; width: 100%; height: 100%;
	text-align: left; color: #000; font-size: 100%; line-height: 40px;
}
#kaishi_password_input_sw{
	float: left;
	padding: 0; margin: 0 0 0 7px; width: 50px; height: 40px;
	background-color: #088;
	border: 1px #777 solid; border-radius: 4px;
	text-align: center; color: #fff; font-size: 100%; line-height: 40px;
}
#kaishi_password_input_sw:hover{ background-color: #0aa; cursor: pointer; }
#kaishi_checkbox_box{
	clear: both; float: left;
	padding: 0; margin: 25px 0 20px 0; width: 100%; height: auto;
	border: 2px #cc0 dotted; border-radius: 4px;
	overflow: hidden;
}
#kaishi_checkbox_box label{
	float: left;
	padding: 13px 0 87px 0; margin: 0; width: 50px; height: auto;
	text-align: center; color: #fff; font-size: 150%; line-height: 30px; letter-spacing: 0px; text-indent: 0px;
	display: flex; justify-content: center; align-items: center;
}
#checkbox_input_cx{ display: none; }
#kaishi_checkbox_box label .dummy{
	width: 20px; height: 20px;
	border: 2px solid #088; border-radius: 15%;
	display: inline-flex;
	vertical-align: text-top;
	background-color: #333;
}
#kaishi_checkbox_box label input:checked+.dummy:after{
	content: '';
	width: 100%; height: 50%;
	border-left: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(-45deg);
}
#checkbox_t{
	float: left;
	padding: 8px 0 8px 5px; margin: 0; width : calc( 100% - 50px); height: auto;
	border-left: 1px #333 solid;
	text-align: left; color: #fff; font-size: 100%; line-height: 26px; letter-spacing: 0px; text-indent: 0px;
}
#kaishi_sw{
	clear: both; float: left;
	padding: 0; margin: 30px 0 0 0; width: 100%;
}
#kaishi_sw div{
	float: left;
	padding: 0; height: 45px; width : 49.5%;
	border: 1px #aaa dashed; border-radius: 4px;
	text-align: center; color: #fff; font-size: 100%; line-height: 45px; letter-spacing: 0px; text-indent: 0px;
	background-color: #333;
}
#kaishi_sw_y{ margin-right: 1%;	opacity:0.5; }
#kaishi_sw_n{ cursor: pointer; }
#aes_end_box{
	display: none;
	clear: both; float: left;
	padding: 50px 0 0 0; margin: 0; width: 100%;
}
#aes_end_t1{
	clear: both; float: left;
	padding: 0 3px; margin: 0; width: 100%; height: 30px;
	text-align: left; color: #fff; font-size: 100%; line-height: 30px; letter-spacing: 0px; text-indent: 0px;
}
#aes_end_t2{
	clear: both; float: left;
	padding: 0; margin: 0; width: 100%; height: 40px;
}
@media screen and (min-width: 1280px){ #aes_end_t2{ padding: 0 5px; width: 100%; } }
#aes_end_t2a{
	clear: both; float: left;
	padding: 0;margin: 0 10px 0 0; width : calc( 100% - 10px - 95px); height: 40px;
	background-color: #090;
}
@media screen and (min-width: 1280px){ #aes_end_t2a{ margin: 0 10px 0 0; width : calc( 60% - 10px - 95px); } }
#aes_end_t2 input{
	padding: 0 3px; margin: 0; width: 100%; height: 100%;
	text-align: left; color: #000; font-size: 100%; line-height: 40px;
}
#aes_end_t2_copy{
	float: left;
	padding: 0; margin: 0; width: 95px; height: 40px;
	background-color: #555;
	border: 1px #777 solid; border-radius: 4px;
	text-align: center; color: #fff; font-size: 100%; line-height: 40px; letter-spacing: 0px; text-indent: 0px;
	cursor: pointer;
}
#aes_end_t2_copy:hover{ background-color: #777; }
#aes_end_t3{
	clear: both; float: left;
	padding: 5px; margin: 50px 0 0 0; width: 100%; min-height: 100px; height: auto;
	background-color: #333;
	border: 2px #fff solid;
	text-align: left; color: #fff; font-size: 100%; line-height: 26px; letter-spacing: 0px; text-indent: 0px;
}
#qr_hyouji_button{
	clear: both; float: left;
	padding: 0; margin: 40px 0 0 0; width: 100%; height: auto;
	display: flex; align-items: center; justify-content: center;
}
#qr_hyouji_button_sw{
	padding: 0; margin: 0 auto; width: 100%; max-width: 320px; height: 45px;
	background-color: #333;
	border: 1px #aaa dashed; border-radius: 4px;
	text-align: center; color: #fff; font-size: 107%; line-height: 45px; letter-spacing: 0px; text-indent: 0px;
}#qr_hyouji_button_sw:hover{ cursor: pointer; background-color: #555; }
#sumahoyou_t{
	display: none;
	clear: both; float: left;
	padding: 10px 5px; margin: 50px 0 0 0; width: 100%;
	border-top: 1px #444 solid;
	background-color: #434343;
	text-align: left; color: #fff; font-size: 100%; line-height: 26px; letter-spacing: 0px; text-indent: 0px;
}
#qr_box{
	display: none;
	clear: both; float: left;
	padding: 30px 0 50px 0; margin: 0; width: 100%; height: auto;
	background-color: #333;
	border-top: 1px #444 solid; border-bottom: 1px #444 solid;
}
#qrcode_img{
	clear: both;
	padding: 15px; margin: 0 auto; width: 220px; max-width: 320px; height: 220px; max-height: 320px;
	background-color: #fff;
}
#aes_end_box_close{
	clear: both; float: left;
	padding: 0; margin: 40px 0 0 0; width: 100%; height: auto;
	display: flex; align-items: center; justify-content: center;
}
#aes_end_box_close_t{
	clear: both; float: left;
	padding: 0; margin: 0; width: 100%; height: 45px;
	background-color: #333;
	border: 1px #aaa dashed;
	text-align: center; color: #fff; font-size: 107%; line-height: 45px; letter-spacing: 0px; text-indent: 0px;
}#aes_end_box_close_t:hover{ cursor: pointer; background-color: #555; }
@media screen and (min-width: 1280px){ #aes_end_box_close_t{ width: 100%; max-width: 320px; border-radius: 4px; } }
#syousai_mode{
	display: none;
	clear: both; float: left;
	padding: 0 0 50px 0; margin: 0; width: 100%; height: auto;
	background-color: #000;
}
#syousai_mode_txt{
	padding: 5px; margin: 0; width: 100%; max-width: 1280px; height: auto; min-height: 140px;
	background-color: #333;
	border: 2px #fff solid; border-radius: 4px;
	text-align: left; color: #fff; font-size: 100%; line-height: 28px; letter-spacing: 0; text-indent: 0;
	margin: 0 auto;
}
@media screen and (min-width: 1280px){ #syousai_mode_txt{ margin: 50px auto 0px auto; } }
#syousai_mode_txt br{ display: block; content: ''; margin: 0; padding: 0; letter-spacing: normal; }
#syousai_mode_txt p{
	padding: 0 0 18px 0; font-weight: bold;
	text-align: left; color: #f90; font-size: 100%; line-height: 28px; letter-spacing: 0; text-indent: 0;
}
#syousai_mode_txt span{
	display: block;
	padding: 25px 0 0 0; margin: 0;
	text-align: left; color: #fff; font-size: 100%; line-height: 28px; letter-spacing: 0; text-indent: 0;
}
#syousai_mode_close{
	padding: 0; margin: 0; width: 200px; height: 40px;
	background-color: #333;
	border: 1px #aaa dashed; border-radius: 4px;
	text-align: center; color: #fff; font-size: 100%; line-height: 40px; letter-spacing: 0; text-indent: 0;
	margin: 30px auto 0 auto;
}
#syousai_mode_close:hover{ background-color: #555; cursor: pointer; }