@charset "utf-8";
/* CSS Document */

.main {height: 250px;}
#apply.main {background: url("/common/images/apply/mainBg.png") center bottom no-repeat;}
.apply .status li {background: #fadaca; color: #fff;}
#inquiry.main {background: url("/common/images/inquiry/mainBg.png") center bottom no-repeat;}
.inquiry .status li {background: #ddd9cc; color: #fff;}


/* Sameparts of form style */
::-webkit-input-placeholder {
color:#989898;
transition:all .2s;
}
::-moz-placeholder {
color:#989898;
transition:all .2s;
}
:-ms-input-placeholder {
color:#989898!important;
transition:all .2s;
}
:-moz-placeholder {
color:#989898;
transition:all .2s;
}
:focus::-webkit-input-placeholder {
color:transparent
}
:focus::-moz-placeholder {
color:transparent
}
:focus:-ms-input-placeholder {
color:transparent!important
}
:focus:-moz-placeholder {
color:transparent
}
:disabled {
    cursor: default !important;
    background: #c5bebe !important;
}
:disabled:hover {margin: 0 !important;}
.detail :disabled:hover {margin: 0 10px !important;}
input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button {
-webkit-appearance:none;
margin:0;
}
.bg_gry {background: #c5bebe; color: #fff;}
form {width: 920px; margin: 5% auto; text-align: center;}
.status {display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: space-evenly; justify-content: space-evenly;}
.status li {display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center;text-align: center; font-weight: 400; box-sizing: border-box; line-height: 1; position: relative; width: 100%; padding: 1.38em;}
.status li:before,.status li:after {position: absolute; top: 0; display: block; content: "";}
.checkData:before,.sendData:before {border: 30px solid transparent; border-left: 28px solid; border-right: 0px; left: 0;}
.inputData:after,.checkData:after {border: 30px solid; border-left: 28px solid transparent; border-right: 0px; right: 0;}
form table {text-align: left; border-collapse: collapse; width: 880px; margin: 0 auto;}
form th.required:after {content: "必須"; background: #d82432; color: #fff; font-size: 12px; border-radius: 3px; padding: .3em .8em .5em; font-weight: 400; float: right; line-height: 1;}
form th {font-weight: 500;}
form .intro {margin: 5% auto;}
form tr,.noneBd th {border-bottom: 1px solid #efefef;}
form tr:first-child {border-top: 1px solid #efefef;}
.noneBd {border: 0;}
form th, form td {padding: 1.5em 1em; letter-spacing: 0.05em; box-sizing: border-box;}
form th p {display: inline-block;}
form td p {margin: 1% auto 0; overflow: hidden; clear: both;}
.noneBd td {padding-bottom: 0;}
form th {width: 28%;}
form td {width: 72%;}
form th span {display: block; font-size: .9em;}
input,textarea,select,button {font-size: 16px; -webkit-appearance: none; -moz-appearance: none; appearance: none; border: 0; border-radius: 5px; padding: .7em .9em; box-sizing: border-box;}
input,textarea.req,.jobData textarea {background: #efefef; letter-spacing: 0.03em;}
.blocked {overflow: hidden;}
.full {width: 100%;}
.half {width: 49%; overflow: hidden;}
.half .txt {float: right; margin-top: 4%;}
.half input:not(.full) {width: 90%;}
#age:not(.full) {width: 20%; margin-right: 2%;}
select {background: url("/common/images/select.png") 88% center no-repeat; border: 1px solid #ddd;}
.radio input,.chkbox input {position: absolute; left: -9999px}
.radio, .chkbox {display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: flex-start; justify-content: flex-start; float: left; line-height: 1; position: relative; cursor: pointer;}
.radio {padding-left: 1em; margin-right: 5%;}
.radio:before {content: ""; display: inline-block; background: none; border: 1px solid #ddd; border-radius: 50%; width: 14px; height: 14px; margin: 0 .7em 0 0;}
.radio span:after {content: ""; display: block; width: 10px; height: 10px; border-radius: 50%; background-color:#6c9f2f;position: absolute;top: 3px; left: 19px; transition: all .3s cubic-bezier(.68,-.55,.265,1.55); -webkit-transform: scale(0); transform: scale(0); -webkit-transform-origin: center; transform-origin: center;}
.radio:hover,.radio input:checked+span,.chkbox:not(.disabled):hover,.chkbox input:checked+span {color: #6c9f2f;}
.radio input:checked+span:after,.chkbox input:checked+span:after {-webkit-transform: scale(1); transform: scale(1);}
.chkbox:before {content: ""; display: inline-block; background: none; border: 1px solid #ddd; border-radius: 3px; width: 20px; height: 20px; margin: 0 .7em 0 0; margin-right: .8em;}
.chkbox span:after {content: ""; display: block; width: 26px; height: 18px; background: url("/common/images/check.png") center center no-repeat; position: absolute;top: 2px; left: 2px; transition: all .3s cubic-bezier(.68,-.55,.265,1.55); -webkit-transform: scale(0); transform: scale(0); -webkit-transform-origin: center; transform-origin: center;}
form table .chkbox {margin-right: 5%}
.agreeChk {display: inline-block; margin: 3% auto;}
.agreement {overflow: hidden; margin-bottom: 4%;}
.agreement p {margin: 7% auto 4%;}
.policy {border: 1px solid #d2d2d2; width: 80%; height: 250px; margin: 0 auto; resize: none; font-weight: 500; outline: 0;}
button[type="submit"],button[type="button"],button[type="reset"],input#input,input#update {line-height: 1; padding: 1.2em 0; width: 330px; font-size: 18px; letter-spacing: 0.1em; border-radius: 7px; position: relative; cursor: pointer; outline: 0;}
button.bg_red:after {content: "▶"; font-size: .8em; position: absolute; top: 40%; right: 5%;}
button.bg_grn:before,button#return:before {content: "◀"; font-size: .8em; position: absolute; top: 40%; left: 5%;}
form .btnArea {display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; margin: 5% auto;}
form .btnArea button,input#input,input#update  {margin: 0 10px;}
button[type="reset"]:hover,button[type="submit"]:hover,button[type="button"]:hover,input#input:hover,input#update:hover {margin: 1px 9px -1px 11px;}
.readOnly {background: #f3f7ff; outline: 0; cursor: default;}
textarea.readOnly {width: 100%; resize: none; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; background: #f3f7ff;}
.sendData .status {margin-bottom: 7%;}
.sendData .intro {margin: 3% auto;}
.sendData .intro a {color: #2f349f;}
.sendData .intro a:hover {text-decoration: underline;}
.sendData .btnArea {margin-top: 7%;}

.jobData .chkbox {overflow: hidden; margin: 1%;}
.jobData th.required:after {display: block; float: left; overflow: hidden; margin: 1%;}

.detail form .btnArea {flex-wrap: wrap;}
.detail form .btnArea p {width: 100%; margin-top: 3%;}
.disabled {cursor: default;}
#areaSelect li {margin: 1% auto;}
.admin th {width: 120px;}
.admin th p {width: 100%;}
.list th {border-left: 1px solid #fff;text-align: center;}
.list th:first-child {border-left: 0;}
.list .index {width: 7%; text-align: center}
.list .no {width: 13%;}
.list .title {width: 50%;}
.list .del {width: 13%;}
.list table,.list th,.list td { width: unset; font-size: 16px;}
.list th,.list td {padding: .5em .7em;}
.list table {border: 1px solid #bbb2af;}
.list table a {border-radius: 5px;padding: .7em 0; box-sizing: border-box; width: 100%; display: block; text-align: center;}
.list table a:hover {margin: 1px -1px -1px 1px;}
input.delete {cursor: pointer;}
input.delete:hover {margin: 1px -1px -1px 1px;}
.list .chkbox {overflow: visible;}

@media screen and (max-width: 896px) {
    .main .right {position: absolute; right: 0;}
    form,form table,.policy{width: 100%;}
    form th p {width: 100%;}
    form th.required:after {display: inline-block; float: none; clear: both;}
    input, textarea, select, button {font-size: 14px;}
    .status li {padding: 1.5em;}
    .radio span:after {left: 17px;}
    .blocked {overflow: visible;}
}
@media screen and (max-width:480px) {
    #inquiry.main .right {right: -10%;}
    .status li {padding: 1.2em;}
    .inputData:after, .checkData:after {border: 24px solid; border-left: 16px solid transparent; border-right: 0;}
    .checkData:before, .sendData:before {border: 24px solid transparent; border-left: 16px solid; border-right: 0;}
    form .intro,.agreement p {text-align: left; font-size: 13px;}
    form .intro {padding: 0 1em;}
    input, textarea, select, button {font-size: 13px;}
    form {margin-bottom: 10%;}
    form th, form td {display: block; width: 100%; overflow: hidden}
    form th p {width: auto; margin-right: 1em; text-indent: 1em; }
    .inquiry th p {border-left: 7px solid #6c9f2f;}
    .apply th p {border-left: 7px solid #d82432;}
    form td p {font-size: .8em; letter-spacing: normal; display: inline-block;}
    form th {padding: 1em .8em 0}
    form td {padding: 1em .8em .8em;}
    .noneBd th {border-color: transparent}
    form th span {display: inline-block; float: right;}
    form td p.red {display: block; width: 100%;}
    #age:not(.full) {width: 40%}
    .apply #return,.apply #send,.inquiry #return,.inquiry #send{ font-size: 3.8vw; margin: 0 1vw;}
}
@media screen and (max-width: 380px) {
    .status li {font-size: 3.5vw;}
    .inputData:after, .checkData:after {border: 6.2vw solid;border-left: 16px solid transparent;border-right: 0;}
    .checkData:before, .sendData:before {border: 6.2vw solid transparent; border-left: 16px solid; border-right: 0;}
    form table .chkbox {margin-bottom: 4%;}
    form table .chkbox:last-of-type {margin-bottom: 0;}
    .half input:not(.full) {width: 85%;}
}