@charset "utf-8";

/*//////////////////////////////////////////////////////////
//  - CSS for HTML for PC
//////////////////////////////////////////////////////////*/

* {
	margin: 0;
	padding: 0;
}

html {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
}

body {
	position: relative;
	color: #444;
	font-size: 1rem;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
	line-height: 1.4;
	width: 100%;
	background-color: #f2f2f2;
	-webkit-font-smoothing: antialiased;
	-webkit-text-size-adjust: 100%;
}

#wrapper {
	display: flex;
	width: 1366px;
	height: 768px;
	margin: 25px auto 0 auto;
}

#wrapper2 {
	display: flex;
	width: 750px;
	height: 570px;
	margin: 25px auto 0 auto;
}


/*----------------------------------------------------------
  - LOGIN
----------------------------------------------------------*/
#login {
	width: 100%;
	height: 100%;
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/login_bg.jpg') no-repeat;
	border-radius: 18px;
}

#login .innerblock {
	width: 440px;
	margin: 0 auto;
}

#login .innerblock .logo h1 {
	width: 370px;
	margin: 58px auto 45px auto;
}

#login .innerblock .company-name h2 {
	color: #444;
	font-size: 21px;
	text-align: center;
	font-weight: bold;
}

#login .innerblock .msg-developer {
	padding: 30px;
	margin: 20px 0 35px 0;
	background-color: #fff;
	border-radius: 10px;
	box-shadow: 0px 0px 10px -5px #000;
	box-sizing: border-box;
}

#login .innerblock .msg-developer>.sec-ttl {
	margin-bottom: 20px;
	padding: 0 0 0 30px;
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/ico-msg.png') left center no-repeat;
}

#login .innerblock .msg-developer>.sec-ttl h2 {
	font-size: 18px;
	font-weight: bold;
}

#login .innerblock .msg-developer>.sec-article {
	width: 100%;
	height: 105px;
	padding-right: 20px;
	overflow-y: scroll;
	box-sizing: border-box;
}

#login .innerblock .msg-developer>.sec-article p {
	color: #000;
	font-size: 13px;
	line-height: 1.7;
}

#login .innerblock .form {
	padding: 30px;
	background-color: #fff;
	border-radius: 10px;
	box-shadow: 0px 0px 10px -5px #000;
	box-sizing: border-box;
}

#login .innerblock .form ul {
	width: 380px;
	display: flex;
	margin: 0 0 10px 0;
	padding: 0;
}

#login .innerblock .form ul li:nth-child(odd) {
	display: block;
	width: 100px;
	height: 50px;
	padding: 0 0 0 13px;
	font-size: 14px;
	line-height: 50px;
	font-weight: bold;
	background-color: #efefef;
	border-radius: 4px 0 0 4px;
	border-left: 1px solid #ccc;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	box-sizing: border-box;
}

#login .innerblock .form ul li:nth-child(even) {
	display: block;
	width: 280px;
}

/* form */
input[type='text'] {
	width: 100%;
	height: 50px;
	padding: 0 0 0 10px;
	border-radius: 0 4px 4px 0;
	border-left: none;
	border-right: 1px solid #ccc;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	box-sizing: border-box;
}

input[type='password'] {
	width: 100%;
	height: 50px;
	padding: 0 0 0 10px;
	border-radius: 0 4px 4px 0;
	border-left: none;
	border-right: 1px solid #ccc;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	box-sizing: border-box;
	font-size: 26px;
}

.btn-login {
	display: block;
	width: 220px;
	padding: 0 0 0 24px;
	margin: 20px auto 0 auto;
	color: #fff;
	font-size: 16px;
	line-height: 55px;
	font-weight: bold;
	border-radius: 30px;
	border: none;
	box-shadow: 0px 6px 15px -5px #777777;
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/btn-ico-login.png') left 65px center #0099ff no-repeat;
	box-sizing: border-box;
}

.btn-login:hover {
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/btn-ico-login.png') left 65px center #1869c2 no-repeat;
	box-shadow: none;
}



/*----------------------------------------------------------
  - SIDE
----------------------------------------------------------*/

#side {
	width: 200px;
	height: 100%;
	padding: 35px 0 0 30px;
	background-color: #fff;
	border-radius: 18px 0 0 18px;
	box-sizing: border-box;
}

#side .navi {
	margin: 70px 0 0 0;
}

#side .navi ul li {
	width: 100%;
	margin: 0 0 20px;
	padding: 0;
	box-sizing: border-box;
}

#side .navi .navi-upload,
#side .navi .navi-status,
#side .navi .navi-help,
#side .navi .navi-pass,
#side .navi .navi-exp_typ {
	background-position: left center;
	background-repeat: no-repeat;
	padding-left: 30px;
}

#side .navi .navi-upload {
	background-image: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/ico-upload.png');
}

#side .navi .navi-status {
	background-image: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/ico-status.png');
}

#side .navi .navi-help {
	background-image: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/ico-help.png');
}

#side .navi .navi-pass {
	background-image: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/ico-msg.png');
}

#side .navi .navi-exp_typ {
	background-image: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/ico-get_exptype.png');
}

#side .navi .navi-upload a,
#side .navi .navi-status a,
#side .navi .navi-help a,
#side .navi .navi-pass a,
#side .navi .navi-exp_typ a {
	color: #444;
	text-decoration: none;
	font-weight: bold;
}

#side .navi .navi-upload a:hover {
	color: #ff0099;
}

#side .navi .navi-status a:hover {
	color: #ff9900;
}

#side .navi .navi-help a:hover {
	color: #66cc33;
}

#side .navi .navi-pass a:hover {
	color: #0067ff;
}

#side .navi .navi-exp_typ a:hover {
	color: #ff0099;
}

#side .navi .current {
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/navi-current-bg.png') right center no-repeat;
}



/*----------------------------------------------------------
  - MAIN
----------------------------------------------------------*/

#main {
	width: 1166px;
	height: 100%;
	padding: 35px;
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/main_bg.jpg') no-repeat;
	background-size: cover;
	border-radius: 0 18px 18px 0;
	box-sizing: border-box;
}


/*-----------
	common 
-----------*/
#main .sec-upload,
#main .sec-msg-developer,
#main .sec-msg-admin,
#main .sec-status,
#main .sec-help,
#main .sec-msg-edit {
	padding: 30px;
	background-color: #fff;
	border-radius: 10px;
	box-shadow: 0px 0px 10px -5px #000;
	box-sizing: border-box;
}



#main .sec-upload.dragover {
	border: 2px solid #0067ff;
	background: rgb(83, 235, 255, 0.8);
}

/*-- ttl --*/
#main .sec-upload>.sec-ttl,
#main .sec-msg-developer>.sec-ttl,
#main .sec-msg-admin>.sec-ttl,
#main .sec-status>.sec-ttl,
#main .sec-help>.sec-ttl,
#main .sec-msg-edit>.sec-ttl {
	margin-bottom: 20px;
	padding: 0 0 0 30px;
	position: relative;
}

#main .sec-upload>.sec-ttl h2,
#main .sec-msg-developer>.sec-ttl h2,
#main .sec-msg-admin>.sec-ttl h2,
#main .sec-status>.sec-ttl h2,
#main .sec-help>.sec-ttl h2,
#main .sec-msg-edit>.sec-ttl h2 {
	font-size: 18px;
	font-weight: bold;
}

/*-- 矢印アニメーション --*/
#main .sec-msg-developer>.sec-ttl::after {
	border-right: solid 2px #00f; 
    border-top: solid 2px #00f; 
    content: "";
    display: block;
    height: 8px;
    position: absolute;
    right: 40px;
    top: 30%;
    transform: rotate(-45deg); 
    transition: transform .3s ease-in-out;
    width: 8px;
}

#main .sec-msg-developer>.sec-ttl.close::after {
	top: 30%; 
    transform: rotate(135deg); 
}

/*-- article --*/
#main .sec-msg-developer>.sec-article {
	 
	width: 100%;		
	padding-right: 20px;
	overflow-y: auto;
	box-sizing: border-box;
}

#main .sec-msg-developer>.sec-article.close {  /*--宮本追加--*/
	display: none;     
	width: 100%;
	padding-right: 20px;
	overflow-y: auto;
	box-sizing: border-box;
}

#main .sec-msg-admin>.sec-article {
	  
	height: 215px;
	width: 100%;
	padding-right: 20px;
	overflow-y: auto;
	box-sizing: border-box;
}

#main .sec-msg-developer>.sec-article p,
#main .sec-msg-admin>.sec-article p {
	color: #000;
	font-size: 13px;
	line-height: 1.7;
}

::-webkit-scrollbar {
	width: 14px;
	border: none;
	background-color: #efefef;
}

::-webkit-scrollbar-thumb {
	border: 3px solid #efefef;
	background-color: #cccccc;
	border-radius: 20px;
}



/*----------- 
	btn
-----------*/

/* btn-logout */
#main .btn-logout {
	width: 140px;
}

#main .btn-logout a {
	display: block;
	padding: 0 0 0 17px;
	font-size: 12px;
	line-height: 36px;
	color: #444;
	text-align: center;
	font-weight: bold;
	text-decoration: none;
	border-radius: 30px;
	box-shadow: 0px 4px 10px -5px #000;
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/btn-ico-logout.png') left 28px center #fff no-repeat;
	box-sizing: border-box;
}

#main .btn-logout a:hover {
	color: #fff;
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/btn-ico-logout.png') left 28px center #1869c2 no-repeat;
	box-shadow: none;
}

/* btn-upload */
#main .btn-upload {
	width: 220px;
	margin: 30px auto 0 auto;
}

#main .btn-upload a {
	display: block;
	padding: 0 0 0 24px;
	font-size: 16px;
	color: #fff;
	line-height: 55px;
	text-align: center;
	font-weight: bold;
	text-decoration: none;
	border-radius: 30px;
	box-shadow: 0px 6px 15px -5px #777777;
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/btn-ico-upload.png') left 48px center #0099ff no-repeat;
	box-sizing: border-box;
}

#main .btn-upload a:hover {
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/btn-ico-upload.png') left 48px center #1869c2 no-repeat;
	box-shadow: none;
}

/* btn-edit */
#main .btn-edit {
	width: 85px;
}

#main .btn-edit a {
	display: block;
	padding: 0 0 0 15px;
	font-size: 12px;
	color: #fff;
	line-height: 30px;
	text-align: center;
	font-weight: bold;
	text-decoration: none;
	border-radius: 30px;
	box-shadow: 0px 4px 10px -5px #777777;
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/btn-ico-edit.png') left 17px center #0099ff no-repeat;
	box-sizing: border-box;
}

#main .btn-edit a:hover {
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/btn-ico-edit.png') left 17px center #1869c2 no-repeat;
	box-shadow: none;
}


/*------ sec-user ------*/
#main .sec-user {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	margin-bottom: 30px;
}

#main .sec-user .user-name {
	width: 320px;
	padding: 0 15px 0 0;
	color: #fff;
	box-sizing: border-box;
}

#main .sec-user .user-name p {
	text-align: right;
	font-size: 13px;
	font-weight: bold;
	line-height: 1.3;
}

#main .sec-user .user-honorific {
	width: 80px;
	font-size: 16px;
	line-height: 36px;
	color: #fff;
	font-weight: bold;
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/ico-user.png') left 25px center no-repeat;
}

#main .innerblock {
	display: flex;
	justify-content: space-between;
}

#main .sec-left-block {
	width: 666px;
	height: 630px;
}

#main .sec-right-block {
	width: 395px;
}



/*------ sec-upload ------*/
#main .sec-upload {
	height: 100%;
}

#main .sec-upload>.sec-ttl {
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/ico-upload.png') left center no-repeat;
}

#main .sec-upload .sec-pct {
	margin-top: 90px;
	text-align: center;
}

#main .sec-upload .sec-file-select {}

/* sec-file-select */
#main .sec-upload .sec-file-select {
	width: 500px;
	margin: 50px auto;
}

#main .sec-upload .sec-file-select .sec-file-list {
	height: 300px;
	overflow-y: auto;
}

#main .sec-upload .sec-file-select .sec-file-list ul {
	padding-right: 30px;
}

#main .sec-upload .sec-file-select .sec-file-list ul li {
	padding: 15px 0 15px 25px;
	font-size: 14px;
	color: #000;
	border-bottom: 1px solid #ccc;
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/ico-file.png') left center no-repeat;
}

#main .sec-upload .sec-file-select .sec-file-list ul li:first-child {
	border-top: 1px solid #ccc;
}

#main .sec-upload .sec-file-select .ico-btn-delete {
	float: right;
	width: 16px;
	cursor: pointer;
	text-indent: -9999px;
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/ico-delete.png') right center no-repeat;
}

#main .sec-upload .sec-file-select ul.sec-btn-block {
	margin: 15px auto 0 auto;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
}

/* btn */
#main .sec-upload .sec-file-select .btn-add-file,
#main .sec-upload .sec-file-select .btn-cancel {
	width: 190px;
}

#main .sec-upload .sec-file-select .btn-add-file a,
#main .sec-upload .sec-file-select .btn-cancel a {
	display: block;
	font-size: 12px;
	line-height: 40px;
	text-align: center;
	font-weight: bold;
	text-decoration: none;
	border-radius: 30px;
	box-shadow: 0px 4px 9px -5px #777777;
	box-sizing: border-box;
}

#main .sec-upload .sec-file-select .btn-add-file a {
	color: #fff;
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/btn-ico-file.png') left 37px center #0099ff no-repeat;
	padding: 0 0 0 20px;
}

#main .sec-upload .sec-file-select .btn-cancel a {
	color: #888;
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/btn-ico-delete.png') left 50px center #ccc no-repeat;
	padding: 0 0 0 23px;
}

#main .sec-upload .sec-file-select .btn-add-file a:hover {
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/btn-ico-file.png') left 37px center #1869c2 no-repeat;
	box-shadow: none;
}

#main .sec-upload .sec-file-select .btn-cancel a:hover {
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/btn-ico-delete.png') left 50px center #eee no-repeat;
	box-shadow: none;
}

/*------ sel-headerEdit ------*/
.sel-headerEdit {
	padding: 12px;
	font-size: 17px;
	border-radius: 10px;
	background: #0099ff;
	color: #fff;
	font-weight: bold;
	width: 250px;
}

.sel-headerEdit option {
	background: white;
	color: black;
}

/*------ sec-msg-developer ------*/
#main .sec-msg-developer {
	margin-bottom: 35px;
}

#main .sec-msg-developer>.sec-ttl {
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/ico-msg.png') left center no-repeat;
}

#main .sec-msg-developer>.sec-article {
	height: 170px;
}


/*------ sec-msg-admin ------*/
#main .sec-msg-admin {
	
}

#main .sec-msg-admin>.sec-ttl {
	display: flex;
	justify-content: space-between;
	align-items: center;
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/ico-msg.png') left center no-repeat;
}


#main .sec-msg-admin>.btn-edit {}


/*------ sec-status ------*/
#main .sec-status {
	width: 100%;
	height: 100%;
}

#main .sec-status>.sec-ttl {
	display: flex;
	justify-content: space-between;
	align-items: center;
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/ico-status.png') left center no-repeat;
}

#main .sec-status .sec-status-innerbox {
	width: 100%;
	height: 525px;
	margin: 0 auto;
	padding: 0 20px 0 0;
	overflow-y: scroll;
	box-sizing: border-box;
}

#main .sec-status .sec-status-innerbox table {
	width: 100%;
}

#main .sec-status .sec-status-innerbox table th,
#main .sec-status .sec-status-innerbox table td {
	padding: 10px;
	border: 1px solid #eeeeee;
	border-collapse: collapse;
}

#main .sec-status .sec-status-innerbox table th {
	color: #555555;
	font-size: 11px;
	font-weight: bold;
	text-align: center;
	background-color: #f9f9f9;
}

#main .sec-status .sec-status-innerbox table td {
	vertical-align: top;
	color: #000;
	font-size: 12px;
	line-height: 1.7;
}

#main .sec-status .sec-status-innerbox table tr:nth-child(odd) td {
	background-color: #f7f9fa;
}


/*------ sec-help ------*/
#main .sec-help {
	width: 100%;
	height: 100%;
}

#main .sec-help>.sec-ttl {
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/ico-help.png') left center no-repeat;
}

#main .sec-help .sec-article-innerbox {
	width: 960px;
	height: 500px;
	margin: 0 auto;
	padding: 30px;
	overflow-y: scroll;
	box-sizing: border-box;
}

#main .sec-help .sec-article-innerbox ul {
	padding-bottom: 20px;
	margin-bottom: 20px;
	border-bottom: 1px solid #ccc;
	box-sizing: border-box;
}

#main .sec-help .sec-article-innerbox ul li:nth-child(1) {
	padding-right: 50px;
	margin-bottom: 10px;
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/help-toggle-down.png') right center no-repeat;
}

#main .sec-help .sec-article-innerbox ul li h3 {
	font-size: 18px;
	font-weight: bold;
}

#main .sec-help .sec-article-innerbox ul li.active {
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/help-toggle-up.png') right center no-repeat;
}

#main .sec-help .sec-article-innerbox ul li:nth-child(2) {
	display: none;
}

#main .sec-help .sec-article-innerbox ul li:nth-child(2) p {
	color: #000;
	font-size: 14px;
	line-height: 1.7;
}

/*------ sec-msg-admin-edit ------*/
#main .sec-msg-edit {
	width: 100%;
}

#main .sec-msg-edit>.sec-ttl {
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/ico-edit.png') left center no-repeat;
}

#main .sec-msg-edit .sec-msg-edit-innerbox {
	height: 486px;
}

/* btn-update */
#main .msg-btn-inner {
	float: right;
}

#main .btn-update {
	width: 190px;
}

#main .btn-update {
	display: block;
	padding: 0 0 0 15px;
	font-size: 12px;
	color: #fff;
	line-height: 40px;
	text-align: center;
	font-weight: bold;
	text-decoration: none;
	border-radius: 30px;
	box-shadow: 0px 4px 9px -5px #777777;
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/btn-ico-update.png') left 37px center #0099ff no-repeat;
	box-sizing: border-box;
	border: none;
}

#main .btn-update:hover {
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/btn-ico-update.png') left 37px center #1869c2 no-repeat;
	box-shadow: none;
}

/* btn-status-update */
#main .btn-status-update {
	width: 150px;
	height: 30px;
}

#main .btn-status-update {
	display: block;
	padding: 0 0 0 15px;
	font-size: 12px;
	color: #fff;
	line-height: 30px;
	text-align: center;
	font-weight: bold;
	text-decoration: none;
	border-radius: 30px;
	box-shadow: 0px 4px 9px -5px #777777;
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/btn-ico-update.png') left 17px center #0099ff no-repeat;
	box-sizing: border-box;
	border: none;
}

#main .btn-status-update:hover {
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/btn-ico-update.png') left 17px center #1869c2 no-repeat;
	box-shadow: none;
}

/*----------------------------------------------------------
  - PASSWORD_CHANGE
----------------------------------------------------------*/
#password_change {
	width: 100%;
	height: 100%;
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/login_bg.jpg') no-repeat;
	border-radius: 18px;
}

#password_change .innerblock {
	width: 540px;
	margin: 0 auto;
}

#password_change .innerblock .logo h1 {
	width: 370px;
	margin: 58px auto 45px auto;
}

#password_change .innerblock .company-name h2 {
	color: #444;
	font-size: 21px;
	text-align: center;
	font-weight: bold;
}

#password_change .innerblock .form {
	padding: 30px;
	margin: 20px 0 35px 0;
	background-color: #fff;
	border-radius: 10px;
	box-shadow: 0px 0px 10px -5px #000;
	box-sizing: border-box;
}

#password_change .innerblock .form ul {
	width: 480px;
	display: flex;
	margin: 0 0 10px 0;
	padding: 0;
}

#password_change .innerblock .form ul li:nth-child(odd) {
	display: block;
	width: 200px;
	height: 50px;
	padding: 0 0 0 13px;
	font-size: 14px;
	line-height: 50px;
	font-weight: bold;
	background-color: #efefef;
	border-radius: 4px 0 0 4px;
	border-left: 1px solid #ccc;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	box-sizing: border-box;
}

#password_change .innerblock .form ul li:nth-child(even) {
	display: block;
	width: 280px;
}

/* form */
input[type='password'] {
	width: 100%;
	height: 50px;
	padding: 0 0 0 10px;
	border-radius: 0 4px 4px 0;
	border-left: none;
	border-right: 1px solid #ccc;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	box-sizing: border-box;
	font-size: 26px;
}

.btn-password_change {
	display: inline-block;
	width: 220px;
	padding: 0 0 0 24px;
	margin: 20px auto 0 auto;
	color: #fff;
	font-size: 16px;
	line-height: 55px;
	font-weight: bold;
	border-radius: 30px;
	border: none;
	box-shadow: 0px 6px 15px -5px #777777;
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/btn-ico-update.png') left 17px center #0099ff no-repeat;
	box-sizing: border-box;
}

.btn-password_cancel {
	display: inline-block;
	float: right;
	width: 220px;
	padding: 0 0 0 24px;
	margin: 20px auto 0 auto;
	color: #888;
	font-size: 16px;
	line-height: 55px;
	text-align: center;
	font-weight: bold;
	border-radius: 30px;
	border: none;
	box-shadow: 0px 6px 15px -5px #777777;
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/btn-ico-delete.png') left 17px center #ccc no-repeat;
	box-sizing: border-box;
	text-decoration: none;
}

.btn-password_change:hover {
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/btn-ico-update.png') left 17px center #1869c2 no-repeat;
	box-shadow: none;
}

.btn-password_cancel:hover {
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/btn-ico-delete.png') left 17px center #eee no-repeat;
	box-shadow: none;
}

/*----------------------------------------------------------
  - TEMPORARY_PASSWORD
----------------------------------------------------------*/
#temporary_password {
	width: 100%;
	height: 100%;
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/login_bg.jpg') no-repeat;
	border-radius: 18px;
}

#temporary_password .innerblock {
	width: 540px;
	margin: 0 auto;
}

#temporary_password .innerblock .logo h1 {
	width: 370px;
	margin: 58px auto 45px auto;
}

#temporary_password .innerblock .company-name h2 {
	color: #444;
	font-size: 21px;
	text-align: center;
	font-weight: bold;
}

#temporary_password .innerblock .form {
	padding: 30px;
	margin: 20px 0 35px 0;
	background-color: #fff;
	border-radius: 10px;
	box-shadow: 0px 0px 10px -5px #000;
	box-sizing: border-box;
}

#temporary_password .innerblock .form ul {
	width: 480px;
	display: flex;
	margin: 0 0 10px 0;
	padding: 0;
}

#temporary_password .innerblock .form ul li:nth-child(odd) {
	display: block;
	width: 200px;
	height: 50px;
	padding: 0 0 0 13px;
	font-size: 14px;
	line-height: 50px;
	font-weight: bold;
	background-color: #efefef;
	border-radius: 4px 0 0 4px;
	border-left: 1px solid #ccc;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	box-sizing: border-box;
}

#temporary_password .innerblock .form ul li:nth-child(even) {
	display: block;
	width: 280px;
}

/* form */
input[type='text'] {
	width: 100%;
	height: 50px;
	padding: 0 0 0 10px;
	border-radius: 0 4px 4px 0;
	border-left: none;
	border-right: 1px solid #ccc;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	box-sizing: border-box;
}

.btn-temporary_password {
	display: inline-block;
	width: 220px;
	padding: 0 0 0 24px;
	margin: 20px auto 0 auto;
	color: #fff;
	font-size: 16px;
	line-height: 55px;
	font-weight: bold;
	border-radius: 30px;
	border: none;
	box-shadow: 0px 6px 15px -5px #777777;
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/btn-ico-update.png') left 17px center #0099ff no-repeat;
	box-sizing: border-box;
}

.btn-password_cancel {
	display: inline-block;
	float: right;
	width: 220px;
	padding: 0 0 0 24px;
	margin: 20px auto 0 auto;
	color: #888;
	font-size: 16px;
	line-height: 55px;
	text-align: center;
	font-weight: bold;
	border-radius: 30px;
	border: none;
	box-shadow: 0px 6px 15px -5px #777777;
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/btn-ico-delete.png') left 17px center #ccc no-repeat;
	box-sizing: border-box;
	text-decoration: none;
}

.btn-temporary_password:hover {
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/btn-ico-update.png') left 17px center #1869c2 no-repeat;
	box-shadow: none;
}

.btn-password_cancel:hover {
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/btn-ico-delete.png') left 17px center #eee no-repeat;
	box-shadow: none;
}

/*----------------------------------------------------------
  - RECEIVE
----------------------------------------------------------*/
#receive {
	width: 800px;
	height: 600px;
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/login_bg.jpg') no-repeat;
	border-radius: 18px;
	background-position: 50% 0%;
}

#receive .innerblock {
	width: 640px;
	margin: 0 auto;
}

#receive .innerblock .logo h1 {
	width: 370px;
	margin: 58px auto 5px auto;
}

#receive .innerblock .msg-developer {
	padding: 30px;
	margin: 10px 0 15px 0;
	background-color: #fff;
	border-radius: 10px;
	box-shadow: 0px 0px 10px -5px #000;
	box-sizing: border-box;
}

#receive .innerblock .msg-developer>.sec-ttl {
	margin-bottom: 20px;
	padding: 0 0 0 30px;
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/ico-msg.png') left center no-repeat;
}

#receive .innerblock .msg-developer>.sec-article {
	width: 100%;
	height: 105px;
	padding-right: 20px;
	overflow-y: scroll;
	box-sizing: border-box;
}

#receive .innerblock .msg-developer>.sec-article p {
	color: #000;
	font-size: 13px;
	line-height: 1.7;
}

#receive .innerblock .form {
	padding: 30px;
	background-color: #fff;
	border-radius: 10px;
	box-shadow: 0px 0px 10px -5px #000;
	box-sizing: border-box;
}

#receive .innerblock .form ul {
	width: 580px;
	display: flex;
	margin: 0 0 10px 0;
	padding: 0;
}

#receive .innerblock .form ul li:nth-child(odd) {
	display: block;
	width: 100px;
	height: 50px;
	padding: 0 0 0 13px;
	font-size: 14px;
	line-height: 50px;
	font-weight: bold;
	background-color: #efefef;
	border-radius: 4px 0 0 4px;
	border-left: 1px solid #ccc;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	box-sizing: border-box;
}

#receive .innerblock .form ul li:nth-child(even) {
	display: block;
	width: 480px;
}

/* form */
input[type='text'] {
	width: 100%;
	height: 50px;
	padding: 0 0 0 10px;
	border-radius: 0 4px 4px 0;
	border-left: none;
	border-right: 1px solid #ccc;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	box-sizing: border-box;
}

.btn-receive {
	display: inline-block;
	width: 220px;
	padding: 0 0 0 24px;
	margin: 20px auto 0 auto;
	color: #fff;
	font-size: 16px;
	line-height: 55px;
	font-weight: bold;
	border-radius: 30px;
	border: none;
	box-shadow: 0px 6px 15px -5px #777777;
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/btn-ico-login.png') left 17px center #0099ff no-repeat;
	box-sizing: border-box;
}

.btn-receive-cancel {
	display: inline-block;
	float: right;
	width: 220px;
	padding: 0 0 0 24px;
	margin: 20px auto 0 auto;
	color: #888;
	font-size: 16px;
	line-height: 55px;
	font-weight: bold;
	border-radius: 30px;
	border: none;
	box-shadow: 0px 6px 15px -5px #777777;
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/btn-ico-delete.png') left 17px center #ccc no-repeat;
	box-sizing: border-box;
}

.btn-receive:hover {
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/btn-ico-login.png') left 17px center #1869c2 no-repeat;
	box-shadow: none;
}

.btn-receive-cancel:hover {
	background: url('https://0000r-img.s3.ap-northeast-1.amazonaws.com/images/btn-ico-delete.png') left 17px center #eee no-repeat;
	box-shadow: none;
}


#inputFile {
	position: relative;
	padding: 180px 0 100px;
	text-align: center;
}

#dropArea {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	padding: 100px 0 0;
	border: 2px dashed #494949;
	background: rgba(22, 165, 191, 0);
	transition: all 0.25s cubic-bezier(0.21, 0.51, 0.51, 1);
}

#dropArea.dragover {
	border: 2px solid #16a5bf;
	background: rgba(22, 165, 191, 0.6);
}

#uploadFile {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10;
	display: block;
	width: 300px;
	height: 80px;
	opacity: 0;
}

#inputFileWrap {
	position: relative;
	display: inline-block;
}

#btnInputFile,
#btnChangeFile {
	display: table;
	width: 300px;
}

#btnChangeFile {
	display: none;
}


#btnInputFile span,
#btnChangeFile span {
	position: relative;
	z-index: 2;
	display: table-cell;
	width: 300px;
	height: 80px;
	border: 1px solid #333;
	border-radius: 4px;
	background: #333;
	text-decoration: none;
	color: #fff;
	font-size: 26px;
	line-height: 1;
	font-weight: bold;
	vertical-align: middle;
}

#upFileWrap.selected #btnInputFile {
	display: none;
}

#upFileWrap.selected #btnChangeFile {
	display: table;
}