body {
    font-family: "Helvetica Neue",
    Arial,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    Meiryo,
    sans-serif;
    background: #f5f5f5;
    hegiht: 100%;
}
.disabled a,
a.disabled {
    pointer-events: none;
}

a:hover {
    color: #004f9d;
}

a {
    color: #004f9d;
}
button{
    outline: none;
}
small {
    font-size: 80%;
}
.alignC {
    text-align: center;
}
.mb0 {
    margin-bottom: 0;
}
.side-nav {
    padding-top: 1em;
    height: calc(100vh - 55px);
    overflow: scroll;
}
#actions-sidebar .side-nav > li {
    margin-bottom: 10px;
}
.side-nav li ol {
    margin-bottom: 12px;
    margin-left: 0;
}
.side-nav li ol li {
    margin: 0;
    padding: 0 0 0 0px;
}
.side-nav li ol > li {
    /**display: none;**/
}
.side-nav li a:not(.button) {
    color: #fff;
    padding: 0.35rem 0.875rem;
}
.side-nav li a:not(.button):hover {
    color: #fff;
    background: rgba(0,0,0,0.045);
}
.side-nav li > b {
    position: relative;
    display: block;
    cursor: pointer;
}
.side-nav li > b:after {
    position: absolute;
    content: "\f068";
    font-family: FontAwesome;
    right: 0;
    display: inline-block;
    margin: 0;
    font-size: 13px;
    background-size: contain;
    vertical-align: middle;
    font-weight: normal;
}
.side-nav li > b.on:after {
    position: absolute;
    content: "\f067";
    font-family: FontAwesome;
}
i.fas, i.far {
    font-family: FontAwesome;
    font-weight: bold;
    font-style: normal;
}
header {
    background-color: #D33C44;
    color: #ffffff;
    font-size: 30px;
    height: 84px;
    line-height: 64px;
    padding: 16px 0px;
    box-shadow: 0px 1px rgba(0, 0, 0, 0.24);
}

header .header-title {
    padding-left:80px
}

legend {
    color:#15848F;
}

.row {
    max-width: 80rem;
}

.actions.columns {
    margin-top:1rem;
    border-left: 5px solid #15848F;
    padding-left: 15px;
    padding: 32px 20px;
}

.actions.columns h3 {
    color:#15848F;
}

.related table {
    border: 0;
    width: 100%;
    table-layout: fixed;
}

.index table thead {
    height: 3.5rem;
}

.header-help {
    float: right;
    margin-right:2rem;
    margin-top: -80px;
    font-size:16px;
}

.header-help span {
    font-weight: normal;
    text-align: center;
    text-decoration: none;
    line-height: 1;
    white-space: nowrap;
    display: inline-block;
    padding: 0.25rem 0.5rem 0.375rem;
    font-size: 0.8rem;
    background-color: #0097a7;
    color: #FFF;
    border-radius: 1000px;
}

.header-help a {
    color: #fff;
}

ul.pagination li a {
    color: rgba(0, 0 ,0 , 0.54);
}

ul.pagination li.active a {
    background-color: #004f9d;
    color: #FFF;
    font-weight: bold;
    cursor: default;
}
ul.pagination .disabled:hover a {
    background: none;
}

.paginator {
    text-align: center;
}

.paginator ul.pagination li {
    float: none;
    display: inline-block;
}

.paginator p {
    text-align: right;
    color: rgba(0, 0 ,0 , 0.54);
}

.asc:after {
    content: " \2193";
}
.desc:after {
    content: " \2191";
}

.form .error-message {
    display: block;
    padding: 0.375rem 0.5625rem 0.5625rem;
    margin-top: -1px;
    margin-bottom: 1rem;
    font-size: 0.75rem;
    font-weight: normal;
    font-style: italic;
    color: rgba(0, 0, 0, 0.54);
}

.required > label {
    font-weight: bold;
}
.required > label:after {
    content: ' *';
    color: #C3232D;
}

select[multiple] {
    min-height:150px;
    background: none;
}
input[type=checkbox],
input[type=radio] {
    margin-right: 0.5em;
}

.date select,
.time select,
.datetime select {
    display: inline;
    width: auto;
    margin-right: 3px;
}

.error label,
.error label.error {
    color: #C3232D;
}

.view h2 {
    color: #6F6F6F;
}

.view .columns.strings {
    border-radius: 3px;
    box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.24);
    margin-right:0.7rem;
}

.view .numbers {
    background-color: #B7E3EC;
    color: #FFF;
    border-radius: 3px;
    box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.24);
    margin-right: 0.7rem;
}

.view .columns.dates {
    border-radius: 3px;
    box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.24);
    margin-right:0.7rem;
    background-color:#DCE47E;
    color: #fff;
}

.view .columns.booleans {
    border-radius: 3px;
    box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.24);
    margin-right:0.7rem;
    background-color: #8D6E65;
    color: #fff;
}

.view .strings p {
    border-bottom: 1px solid #eee;
}
.view .numbers .subheader, .view .dates .subheader {
    color:#747474;
}
.view .booleans .subheader {
    color: #E9E9E9
}

.view .texts .columns {
    margin-top:1.2rem;
    border-bottom: 1px solid #eee;
}

/** Notices and Errors **/
.cake-error,
.cake-debug,
.notice,
p.error,
p.notice {
    display: block;
    clear: both;
    background-repeat: repeat-x;
    margin-bottom: 18px;
    padding: 7px 14px;
    border-radius: 3px;
    box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.24);
}

.cake-debug,
.notice,
p.notice {
    color: #000000;
    background: #ffcc00;
}

.cake-error,
p.error {
    color: #fff;
    background: #C3232D;
}

pre {
    background: none repeat scroll 0% 0% #FFF;
    box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.24);
    margin: 15px 0px;
    color: rgba(0, 0 ,0 , 0.74);
    padding:5px;
}

.cake-error .cake-stack-trace {
    margin-top:10px;
}

.cake-stack-trace code {
    background: inherit;
    border:0;
}

.cake-code-dump .code-highlight {
    display: block;
    background-color: #FFC600;
}

.cake-error a,
.cake-error a:hover {
    color:#fff;
    text-decoration: underline;
}

.checks {
    padding:30px;
    color: #626262;
    background-color: #B7E3EC;
    border-radius: 3px;
    box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.24);
    margin-bottom: 2em;
}

.checks h4 {
    margin-bottom: 1.5rem;
}

.checks hr {
    border: 0;
    height: 0;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}

.checks .success,
.checks .problem {
    margin-left: 10px;
}
.checks .success:before,
.checks .problem:before {
    line-height: 0px;
    font-size: 28px;
    height: 12px;
    width: 12px;
    border-radius: 15px;
    text-align: center;
    vertical-align: middle;
    display: inline-block;
    position: relative;
    left: -11px;
}

.checks .success:before {
    content: "✓";
    color: green;
    margin-right: 9px;
}

.checks .problem:before {
    content: "✘";
    color: red;
    margin-right: 9px;
}
.top-bar .name {
    height: auto;
}
.top-bar.expanded .title-area {
    background: #fff;
    max-width: 20%;
    /*追加*/
    max-width: calc(200px - 1rem);
    padding: 8px 0;
}
.top-bar.expanded .title-area img {
    height: auto;
    width: 120px;
    margin-top: 1px;
}
.top-bar.expanded .title-area a {
    padding: 0;
    text-align: center;
}

.top-bar.expanded, .top-bar {
    background: #fff;
    box-shadow: 0px 2px 5px rgba(70,70,70,0.4);
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 100;
}
.top-bar-section {
    position: absolute;
    right: 0 !important;
    left: auto !important;
    top: 0;
    width: 15%;
}
.top-bar-section ul li,.top-bar-section li:not(.has-form) a:not(.button) {
    color: #cc0c2f;
    height: 76px;
    line-height: 1;
    background: #fff;
    text-align: center;
    font-size: 12px;
    padding: 0;
}
.top-bar-section ul li a {
    padding: 12px 0.9375rem 0!important;
}
.top-bar-section ul li i {
    font-size: 2em;
    margin: 5px;
}
.top-bar-section li:not(.has-form) a:not(.button):hover, button:hover {
    background: #cc0c2f;
    color: #fff;
}
.top-bar-section #info_help span{
    padding: 12px 0.9375rem 0!important;
    display: block;
    height: 76px;
    cursor: pointer;
}
.top-bar-section .info_help{
    position: relative;
}
.top-bar-section .info_help a.help_link{
	pointer-events: none;
}
.top-bar-section .info_help_link{
    position: absolute;
    width: 120px;
    left: -14px;
}
.top-bar-section .config{
    width: 140px;
    left: 26px;
}
.top-bar-section .info_help_link li{
    display: none;
    height: auto;
    background: #fff;
    width: 100%;
}
.top-bar-section .info_help_link li a{
    color: #333!important;
    height: auto!important;
    padding: 12px 0 12px 8px!important;
    text-align: left!important;
}
.top-bar-section ul li#info_help:hover:not(.has-form)>a{
    background: #cc0c2f;
}
.top-bar-section ul.info_help_link li:hover:not(.has-form)>a{
    background: #555;
    color: white!important;
}
/* .top-bar-section .accordion_div {
    position: absolute;
    bottom: -20px;
}
.top-bar-section .accordion_div a {
    padding: 5px 10px !important;
    margin: 0;
} */
.top-bar input {
    padding: 0.55em;
}
.top-bar-section button {
    width: 50px;
}

.top-bar-section a.disabled {
    pointer-events: none;
    color:gray !important;
}
.top-bar-section #accordion_div{
    display: none;
    position: absolute;
    top: 78px;
    left: 38px;
    width: 148px;
    box-shadow: 0 2px 4px 2px rgba(70,70,70,0.2);
}
.top-bar-section #accordion_div ul li{
    width: 100%;
    height: auto;
    line-height: inherit;
    background: #fff;
    text-align: left;
}
.top-bar-section #accordion_div ul li:hover{
    background: #cc0c2f !important;
    color: #fff;
}
.top-bar-section #accordion_div ul li a{
    height: auto;
    line-height: 1.2em;
    font-size: 12px;
    text-align: left;
    color: #cc0c2f;
    background: transparent !important;
}
.top-bar-section #accordion_div ul li a:hover{
    color: #fff;
} 

.top-bar-section #accordion_div ul li.disabled a, .top-bar-section #accordion_div ul li.disabled a:hover {
    color: #808080 !important;
}

.top-bar-section #accordion_div ul li.disabled:hover {
    background: #fff !important;
}


#keyword-form {
    display: inline-block;
}
#keyword-form li{
    display: inline-block;
    vertical-align: middle;
}
#keyword-form .select {
    width: 200px;
    display: inline-block;
}
#keyword-form .text {
    width: 260px;
    display: inline-block;
}
#keyword-form .info_i {
    margin-left: 5px;
}
#keyword-form .info_i:hover {
    cursor: pointer;
}
#keyword-form .info_i i{
    color: #555;
    font-size: 25px;
}
.top-bar input, .top-bar select, .top-bar .button, .top-bar button {
    font-size: 16px;
    height: auto;
    position: unset;
    top: unset;
}
.side-nav li.heading {
    color: #1798A5;
    font-size: 0.875rem;
    font-weight: bold;
    text-transform: uppercase;
    padding: 0.4375rem 0.875rem;
}

#actions-sidebar {
    background: #f5f5f5;
    position: fixed;
    padding: 0;
}
.side-nav li {
    padding-left: 0.9375rem;
    padding-right: 0.9375rem;
    margin: 0 0 0.25rem 0;
}
.side-nav li a {
    transition: .2s;
}
.side-nav li a:hover {
    background: #004f9d !important;
}
.side-nav li ol {
    margin-left: -0.9375rem;
    margin-right: -0.9375rem;
}
.side-nav li ol li a {
    padding-left: 2.1em !important;
}
.index table {
    margin-top: 0rem;
    border: 0;
    width: 100%;
    table-layout: fixed;
}

table {
    background: #fff;
    margin-bottom: 1.25rem;
    border: none;
    table-layout: fixed;
    width: 100%;
}

table thead {
    background: none;
}

table tr {
    border-bottom: 1px solid #ebebec;
}

table thead tr {
    border-bottom: 1px solid #ebebec;
}

table tr th {
    padding: 0.5625rem 0.625rem;
    font-size: 0.875rem;
    color: #1798A5;
    text-align: left;
    border-bottom: 1px solid #ebebec;
}

table tr:nth-of-type(even) {
    background: none;
}

fieldset {
    border: none;
    padding: 1.25rem;
    margin: 1.125rem 0;
}

fieldset legend {
    border-bottom: 2px solid #1798A5;
    width: 100%;
    line-height: 2rem;
}

.form button[type="submit"] {
    float: right;
    text-transform: uppercase;
    box-shadow: none;
}

.form button:hover, .form button:focus {
    background: #cc0c2f;
    box-shadow: none;
}

button {
    background: #cc0c2f;
}

div.message {
    text-align: center;
    cursor: pointer;
    display: block;
    font-weight: normal;
    padding: 0 1.5rem 0 1.5rem;
    transition: height 300ms ease-out 0s;
    background-color: #a0d3e8;
    color: #626262;
    top: 15px;
    right: 15px;
    z-index: 999;
    overflow: hidden;
    height: 50px;
    line-height: 2.5em;
}

div.message:before {
    line-height: 0px;
    font-size: 20px;
    height: 12px;
    width: 12px;
    border-radius: 15px;
    text-align: center;
    vertical-align: middle;
    display: inline-block;
    position: relative;
    left: -11px;
    background-color: #FFF;
    padding: 12px 14px 12px 10px;
    content: "i";
    color: #a0d3e8;
}

div.message.error {
    background-color: #C3232D;
    color: #FFF;
}

div.message.error:before {
    padding: 11px 16px 14px 7px;
    color: #C3232D;
    content: "x";
}
div.message.hidden {
    height: 0;
}


.vertical-table th {
    padding: 0.5625rem 0.625rem;
    font-size: 0.875rem;
    color: #1798A5;
    border: none;
    text-align: left;
}

.vertical-table {
    vertical-align: middle;
}

.vertical-table td {
    text-align: right;
}

.content {
    padding: 2rem;
    background: #f5f5f5;
}

/* Use 'one true layout' methods to get equal height columns */
.container {
    overflow: hidden;
    min-height: 92%; /* full height almost always */
    padding-top: 72px;
    min-height: 100%;
}
.large-3 {
    width: 200px;
}
.large-9 {
    width: calc(100% - 200px);
    margin-left: 200px;
}
/* Force equal height by overflowing */
.content,
#actions-sidebar {
    margin-bottom: -99999px;
    padding-bottom: 99999px;
}
#actions-sidebar {
    background: #002c61;
}
#actions-sidebar li {
    color: #fff;
}
@media(max-width: 640px) {
    #actions-sidebar {
        padding-bottom: 2rem;
        margin-bottom: 0;
    }
}

.content h3 {
    color: #cc0c2f;
    padding-bottom: 0.5rem;
    margin-bottom: 20px;
    font-weight: bold;
    font-size: 1.4em;
}

.content h4 {
    color: #051b72;
    padding-bottom: 0.5rem;
    margin-bottom: 20px;
    border-bottom: 2px solid #be140b;
}

.content .related h4 {
    color: #4d8f97;
    padding-bottom: 0.5rem;
    margin-top: 20px;
    margin-bottom: 10px;
    border-bottom: 0px;
}
table {
    box-shadow: 0 2px 4px 2px rgba(70,70,70,0.2);
    padding: 0 10px;
    border: 8px solid #fff !important;
}
table tr th, table tr td, table thead tr th {
    vertical-align: top;
    word-break: break-all;
    padding: 0.5625rem 0.3rem;
    position: relative;
}
table thead tr th {
    vertical-align: middle;
}
table tr td a {
    position: absolute;
    width: 100%;
    height: 100%;
    display: block;
    margin: -0.5625rem -0.3rem;
}
table tbody tr {
    transition: 0.2s;
}
table tbody tr:hover {
    background: #f1f1f1;
}
table.inner_table {
    box-shadow: none;
    padding: 0 ;
    border: 0 !important;
    margin: 0;
    background: none;
}
table.inner_table th, table.inner_table td {
    padding: 0 0.3rem;
    margin: 0;
    vertical-align: middle;
}
table.inner_table td {
    padding: 0 0.3rem 10px;
}
table thead .inner_table tr, table thead .inner_table tr th, .inner_table tr {
    border-bottom: 0;
}
table thead .inner_table tr:hover {
    background: none !important;
}
table.inner_table .td_lastdate{
    text-align: center;
}
table .inner_table_box{
    position: relative;
    margin-bottom: 24px;
}
.tooltips-box{
    position: relative;
}
.tooltips-box .tooltips{
    position: absolute;
    min-width: 140px;
    max-width: 244px;
    padding: 6px;
    font-size: 13px;
    background: #555;
    color: #fff;
    left: 0;
    border-radius: 5px;
    bottom: 60px;
    text-align: left;
}
.tooltips-box .tooltips::before{
    position: absolute;
    bottom: -17px;
    left: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    border-top-color: #555;
    border-width: 9px;
    margin-left: -9px;
}
#keyword-form .info_i .tooltips{
    min-width: 420px;
    max-width: 420px;
    background: #555;
    right: -200px;
    top: 38px;
    text-align: center;
    height: 100px;
    left: auto;
    z-index: 9999;
}
#keyword-form .info_i .tooltips::before{
    border-top-color: transparent;
    border-bottom-color: #555;
    top: -17px;
}
table .table_amount{
    margin: 0;
    text-align: center;
    position: absolute;
    bottom: 2px;
    left: 50%;
    margin-left: -20px;
    font-size: 14px;
}
table .new_info{
    padding: 1px 0;
    display: block;
    font-size: 12px;
    background: #cc0c2f;
    color: white;
    width: 50px;
    border-radius: 5px;
    text-align: center;
    margin-bottom: 4px;
}


/***
companyスカウト一覧・メッセージ機能
***/

.company-index .badge_on{
    position: relative;
}
.company-index .badge_on::before{
    position: absolute;
    content: "";
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: red;
    top: -10px;
    right: -5px;
}
.company-index .tooltips-box .tooltips{
    bottom: 34px;
    width: 100%;
    min-width: 470px;
    left: auto;
    right: -10px;
    text-align: center;
    padding: 5px;
}
.company-index .tooltips-box .tooltips::before{
    left: 86%;
}


.badge_on_menu_company_scout{
    position: relative;
}
.badge_on_menu_company_scout::before{
    position: absolute;
    content: "";
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: red;
    top: -30px;
    right: -121px;
}

.badge_on_menu_decline{
    position: relative;
}
.badge_on_menu_decline::before{
    position: absolute;
    content: "";
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: red;
    top: -30px;
    right: -93px;
}


/*** footer ***/
footer {
    position: relative;
    text-align: center;
    background: #cc0c2f;
    z-index: 1;
    font-size: 13px;
    padding: 8px;
    color: #fff;
}


/*** タレントページ ***/
.tag_talent {
    background: #eee;
    color: #888;
    border-radius: 13px;
    display: inline-block;
    margin: 0px 2px 3px;
    padding: 2px 8px;
    border: 1px solid #bbb;
    font-size: 12px;
}
.amount {
    margin-top: -20px;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 0.1rem;
    line-height: 1;
}
.amount .amount_b {
    font-size: 25px;
    color: #cc0c2f;
}
p.male {
    background: #bfefff;
    border-radius: 4px;
    padding: 1px 8px;
    font-size: 14px;
    margin-bottom: 8px;
    font-weight: bold;
}
p.female {
    background: #ffd6ff;
    border-radius: 4px;
    padding: 1px 6px;
    font-size: 14px;
    margin-bottom: 8px;
    font-weight: bold;
}
p.unisex {
    border-radius: 4px;
    padding: 1px 6px;
    font-size: 14px;
    margin-bottom: 8px;
    font-weight: bold;
}
.talents table tbody.student_list tr:nth-child(odd) {
    border-bottom: none;
}

.badge_on_menu_talent_scout{
    position: relative;
}
.badge_on_menu_talent_scout::before{
    position: absolute;
    content: "";
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: red;
    top: -30px;
    right: -93px;
}

.badge_on_menu_message{
    position: relative;
}
.badge_on_menu_message::before{
    position: absolute;
    content: "";
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: red;
    top: -30px;
    right: -108px;
}

.badge_on_menu_rejection{
    position: relative;
}
.badge_on_menu_rejection::before{
    position: absolute;
    content: "";
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: red;
    top: -30px;
    right: -78px;
}

/*detail タグ色付け*/
span.female {
    background: #ffd6ff;
    border-radius: 4px;
    padding: 4px 13px;
    font-size: 16px;
}
span.male {
    background: #bfefff;
    border-radius: 4px;
    padding: 1px 8px;
    font-size: 16px;
}
span.unisex {
    border-radius: 4px;
    padding: 1px 8px;
    font-size: 16px;
}
span.mask{
    color: transparent;
    text-shadow: 0 0 6px rgba(0,0,0,.75);
    opacity: .75;
}
.talents.detail .talent_name .mask{
    text-shadow: 0 0 10px rgba(0,0,0,.6);
    opacity: .6;
    line-height: 1.1;
}
.js-modal-open p.male {
    display: inline-block;
}
.contact {
    margin-top: 10px;
    font-size: 24px;
    position: relative;
    /*z-index: 10;*/
}
.contact i {
    margin: 0 4px;
    color: #555;
}

.status_blue {
    background: #bfd6ff;
    border-radius: 4px;
    display: block;
    text-align: center;
    padding: 3px;
    margin: 0 0 3px;
}
.status_orange {
    background: #ffd6a1;
    border-radius: 4px;
    display: block;
    text-align: center;
    padding: 3px;
    margin: 0 0 3px;
}
.status_green {
    background: #bfe7b0;
    border-radius: 4px;
    display: block;
    text-align: center;
    padding: 3px;
    margin: 0 0 3px;
}
.status_gray {
    background: #eee;
    border-radius: 4px;
    display: block;
    text-align: center;
    padding: 3px;
    margin: 0 0 3px;
}
.talent .progress {
    background-color: rgba(0, 0 ,0 , 0);
    border: none;
    height: auto;
    margin-bottom: 0.325rem;
    padding: 0;
    font-size: 15px;
    line-height: 1.3em;
    font-weight: bold;
}
.talent .progress span {
    font-size: 80%;
    color: #555;
    display: block;
    font-weight: normal;
}
.progress_total {
    text-align: right;
    font-size: 14px;
}
.college_detail {
    padding: 6px 0 0 10px;
    font-size: 13px;
    color: #555;
}
.copy_message {
    font-size: 13px;
    padding-top: 10px;
}

/*** タレント詳細 ***/
i.fa-heart{
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
}
.talents.detail fieldset {
    margin: 0;
    padding: 0;
}
.talents.detail fieldset legend {
    border-bottom: none;
    width: 100%;
    line-height: 2rem;
    background: none;
    font-weight: bold;
    margin-left: -0.1875rem;
    margin: 0;
    padding: 0 0.1875rem;
    color: #333;
}
.talents.detail .talent_name {
    font-size: 16px;
    font-weight: bold;
    padding: 5px 0;
    max-width: 1000px;
}
.talents.detail .talent_name {
    margin-right: 5px;
    font-size: 1.4em;
}
.talent_name > span {
    display: inline-block;
    margin-bottom: 5px;
}
.talent_img {
    margin-right: 20px;
    width: 85px;
}
.favbtn{
    cursor: pointer;
    margin-bottom: 6px;
}
.tags {
    padding-top: 12px;
    font-weight: normal;
    font-size: 13px;
}
.tags span {
    border-radius: 13px;
    display: inline-block;
    margin: 0px 2px 3px;
    padding: 2px 7px;
    border: 1px solid #bbb;
    cursor: pointer;
    vertical-align: middle;
}
.tags span.check-tags-disabled {
    cursor: default;
}
.tags .tagnum {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    padding: 2px 0 0 0;
    font-size: 11px;
    margin: 0 0 0 4px;
    text-align: center;
    background: #6d6d6d;
    line-height: 18px;
    border: none;
    color: white;
}
.tags > span:hover {
    background:#bbb;
    color: white;
}
.tags > span:hover > .tagnum{
    background:#6d6d6d;
    color: white;
}
.tags span.on {
    background: #004f9d;
    border: 1px solid #004f9d;
    color: #fff;
}

.index .tags{
    padding: 0;
    margin: 0 0 30px 0;
}

table.td {
    table-layout: auto;
}
table.td tr:hover {
    background: unset;
}
table.inner {
    box-shadow: none;
    background: #f2f2f2;
    border: none !important;
}
table.inner tr {
    border-bottom: none;
}
table.inner tr td {
    padding: 5px 10px;
}
table.td button {
    padding: 8px 20px;
    font-size: 14px;
    margin-bottom: 0;
    float: right;
}
table.td textarea {
    margin: 8px 0;
}
.talents.detail table tr th, .talents.detail table tr td {
    position: unset;
}
.bottom_btn {
    text-align: center;
    margin-bottom: 50px;
}
/* JOB, タレント　詳細ページボタン */
.detail .btn_add {
    padding: 10px 20px;
    font-size: 14px;
    background: #004f9d;
}
.detail .btn_add:hover {
    background: #004f9d;
}
/* ボタン固定 追加 */
.overlay{
    background: rgba(50,50,50,.9);
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 100;
    margin: 0;
    padding-left: 200px;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
}
.overlay-agent{
    background: rgba(50,50,50,.9);
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 100;
    margin: 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
}

.fixbtn{
    margin-bottom: 0;
}
.fixbtn .innr{
    padding: 15px 0;
}
.bottom_btn a {
    display: inline-block;
    padding: 7px 20px;
    background: #bbb;
    margin: 0 20px;
}
.bottom_btn button {
    display: inline-block;
    padding: 7px 20px;
    margin: 0 20px;
    background: #cc0c2f;
    color: #fff;
}
.comment_box {
}
.comment_box .comment {
    text-align: center;
}
.bottom_btn #talent_submit, #agent_talent_submit, #talent_submit_agent, #talent_career_submit, #company_submit, #job_submit, #talent_submit_student, #talent_submit_career, #agent_new_submit {
    display: inline-block;
    padding: 7px 20px;
    margin: 0 20px;
    background: #cc0c2f;
    color: #fff;
    float: none;
}
.bottom_btn .comment{
    margin-bottom: 8px;
}
.navy {
    color: #004f9d;
}
.toggle {
    display: block;
    background: #fff;
    margin: auto auto 30px;
    border: 2px solid #aaa;
    width: 42px;
    height: 42px;
    line-height: 42px;
    font-size: 25px;
    text-align: center;
    border-radius: 50%;
    cursor: pointer;
}
td .fa {
    font-size:18px;
}
.detail_wrap{
    overflow: hidden;
}
.detail_wrap > div{
    float: left;
}
.edit_delete {
    float: right;
    font-size: 25px;
    cursor: pointer;
    display: inline-block;
    position: relative;
}
.detail_wrap .edit_delete {
    max-width: 462px;
    min-width: 280px;
    float: right;
    font-size: 25px;
    cursor: pointer;
    display: inline-block;
    position: relative;
}
.btn_edit_delete a{
    position: relative;
    margin: 0 0 5px 0;
    text-align: center;
    background: #bbb;
    color: #222;
    display: inline-block;
    width: 80px;
    padding: 8px 0;
    font-size: 14px;
    cursor: pointer;
}
.btn_edit_delete button {
    float: none !important;
}
.talentsinfo .btn_edit_delete a.reissue{
    background: #cc0c2f;
    width: auto;
    color: white;
    padding: 8px 3%;
}
.talentsinfo .btn_edit_delete a.scout{
    background: #cc0c2f;
    width: auto;
    color: white;
    padding: 8px 3%;
}
.talentsinfo .btn_edit_delete a.scout:before{
  content:"\f1d8";
  font-family: FontAwesome;
  display: inline-block;
  width: 14px;
  height: 14px;
  margin: 0 5px 4px 0;
  font-size: 13px;
  background-size: contain;
  vertical-align: middle;
}
.talentsinfo .btn_edit_delete a.dl{
    background: #004f9d;
    color: white;
    width: auto;
    padding: 8px 3%;
}
.talentsinfo .btn_edit_delete a.dl:before{
  content:"\f019";
  font-family: FontAwesome;
  display: inline-block;
  width: 14px;
  height: 14px;
  margin: 0 5px 4px 0;
  font-size: 13px;
  background-size: contain;
  vertical-align: middle;
}
.btn_migration a{
    width: 200px;
    margin-right: 20px;
    margin-bottom: 20px;
}
p.btn_show {
    font-size: 14px;
    margin-bottom: 0;
    position: absolute;
    top: 0;
    left: 0;
    cursor: pointer;
}
p.btn_show:hover {
    text-decoration: underline;
}
body.modal_open {
	position: fixed;
	width: 100%;
	height: 100%;
	left: 0;
}

.modal{
    display: none;
    height: 100vh;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1000
}
.modal__bg{
    background: rgba(0,0,0,0.8);
    height: 100vh;
    position: absolute;
    width: 100%;
    z-index: 100;
    left: -230px;
}
.modal__content{
    background: #fff;
    left: calc(50% - 230px);
    padding: 40px;
    position: absolute;
    top: 50%;
    transform: translate(-50%,-50%);
    width: 60%;
    z-index: 101;
}
.js-modal-close {
    float: right;
}
.list_modal{
    display: none;
    height: 100%;
    position: fixed;
    top: 0;
    /* width: 100%; */
    z-index: 1000;
    background-color: #FFFFFF;
}

/*company メッセージ modal*/
.company-index .modal{
    transform: translateX(100%);
    width: 100vw;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 2;
    transition: .3s;
}
.company-index .modal.slidein{
    transform: translateX(0);
    margin-top: 55px;
    transition: .3s;
}
.company-index .modal__bg{
    background: none;
    left: -40%;
}
.company-index .modal__content{
    width: 60%;
    height: 100%;
    left: auto;
    right: 0;
    top: 22px;
    transform: initial;
    padding: 0 0 0 38px;
}
.company-index .modal__content .js-scout-close{
    float: right;
    width: 38px;
    text-align: center;
    height: 96.5%;
    left: 0;
    color: white;
    top: 0;
    position: absolute;
    background: #5c5c5c;
}
.company-index .modal__content .js-scout-close:hover{
    cursor: pointer;
    background: #004f9d;
}
.company-index .modal__content .js-scout-close span {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
}
.company-index .modal__content .js-scout-close span i{
    position: absolute;
    top: 45%;
    left: 50%;
    font-family: FontAwesome;
    display: block;
    font-style: normal;
    margin-left: -8px;
    font-size: 20px;
}
.company-index .modal__content .modal_head{
    padding-top: 15px;
    margin: 0 1.1rem 0 1.1rem;
}
.company-index .modal__content h3{
    color: #222;
    font-size: 17px;
    padding: 0;
    display: inline-block;
    vertical-align: middle;
    margin: 0;
}
.company-index .modal__content .mes_head{
    font-size: 13px;
    font-weight: normal;
    margin: 0;
}
.company-index .modal__content .mes_img{
    margin: 0;
    display: inline-block;
    padding-right: 10px;
}
.company-index .modal__content .mes_img img{
    border-radius: 50%;
    width: 52px;
    height: 52px;
}
.company-index .modal__content .modal_head_icon {
    float: right;
    width: auto;
    margin-top: 5px;
}
.company-index .modal__content .modal_head_tags{
    display: inline-block;
    vertical-align: middle;
}
.company-index .modal__content .modal_head_fav{
    display: inline-block;
    vertical-align: middle;
    margin: 0;
}
.company-index .modal__content .modal_head_fav img {
}
.company-index .modal__content ul{
    margin: 0;
}
.company-index .modal__content ul li{
    display: inline-block;
    padding: 0 22px 12px;
    font-weight: bold;
}
.company-index .modal__content ul li:hover{
    cursor: pointer;
    color: #004f9d;
}
.company-index .modal__content ul li.active{
    position: relative;
}
.company-index .modal__content ul li.active:before{
    position: absolute;
    content: "";
    bottom: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: #cc0c2f;
}
.company-index .modal__content .content-area {
    background: #f5f5f5;
}
.company-index .modal__content .tab-content {
    display: none;
}
.company-index .modal__content .tab-content.show {
    display: block;
}
.company-index .modal__content .tab-prof, .company-index .modal__content .tab-agent-prof{
    height: calc(96.5vh - 150px - 43px);
    overflow-y: auto;
    padding: 20px;
}
.company-index .modal__content .content-box {
    background: white;
    padding: 5px 20px;
    margin-bottom: 20px;
}
.company-index .modal__content .content-box:last-child {
    margin-bottom: 0;
}
.company-index .modal__content dl {
    background: white;
    padding: 10px;
    margin: 0;
    font-size: 14px;
    border-bottom: 1px solid #e1e1e1;
}
.company-index .modal__content dl:last-child {
    border-bottom: none;
}
.company-index .modal__content dt {
    font-weight: bold;
    margin: 0;
    width: 22%;
    display: inline-block;
    vertical-align: middle;
}
.company-index .modal__content dd {
    display: inline-block;
    margin: 0;
    vertical-align: middle;
}
.company-index .modal__content .mes_chat_area{
    height: calc(88vh - 161px - 44px);
    overflow-y: auto;
    padding: 30px 20px 20px;
}
.mes_chat_area_job{
    height: calc(85vh - 335px);
    overflow-y: auto;
    padding: 30px 20px 20px;
}
.company-index .modal__content .mes_chat_area_talent{
    height: calc(107vh - 335px);
    overflow-y: auto;
    padding: 30px 20px 20px;
}
.company-index .modal__content .mes_select_area{
}
.company-index .modal__content .select_job{
    width: 70%;
    display: inline-block;
}
.company-index .modal__content .select_job select{
    height: 48px;
    padding: 0 16px;
    font-weight: bold;
    border-radius: 6px;
    border: 0px;
    outline: none;
    background-color: white;
    cursor: pointer;
}
.company-index .modal__content .select_icon{
    display: inline-block;
    cursor: pointer;
    position: relative;
}
.company-index .modal__content .select_icon i{
    font-size: 18px;
    color: #5c5c5c;
    font-weight: bold;
    font-style: normal;
    margin-left: 10px;
}
.company-index .modal__content .select_icon .tooltips{
    bottom: 34px;
    width: 100%;
    min-width: 470px;
    left: auto;
    right: -170px;
    text-align: center;
    padding: 5px;
}
.company-index .modal__content .select_icon .tooltips::before{
    left: 62%;
}
.company-index .modal__content .mes_chat_box{
    overflow: hidden;
}
.company-index .modal__content .mes_chat_box figure{
    margin: 0;
    display: inline-block;
    padding-right: 8px;
    float: left;
}
.company-index .modal__content .mes_chat_box figure img{
    border-radius: 50%;
    width: 40px;
    height: 40px;
}
.company-index .modal__content .mes_add {
    position: absolute;
    bottom: 0px;
    right: -40px;
}
.company-index .modal__content .own_mes .mes_add {
    right:  auto;
    left: -40px;
    color: #222;
    text-align: right;
}
.company-index .modal__content .mes_add span{
    font-size: 11px;
    display: block;
}
.company-index .modal__content .mes_chat {
    background: white;
    padding: 10px;
    border-radius: 14px;
    position: relative;
    max-width: 70%;
    float: left;
    margin-bottom: 10px;
}
.company-index .modal__content .own_mes {
    background: #004f9d;
    color: white;
    float: right;
}
.company-index .modal__content .alliance_own_mes {
    background: #004f9d;
    color: white;
    display: flex;
}
.mes_chat_box.alliance_yrs {
    display: flex;
    justify-content: flex-end;
}
.company-index .modal__content .alliance_yrs_mes .mes_add {
    right:  auto;
    left: -40px;
    color: #222;
    text-align: right;
}
.company-index .modal__content .alliance_own_mes .mes_add {
    color: #222;
}
.company-index .modal__content .alliance_own_mes pre.mes_chat_txt {
    background: #004f9d;
    color: white;
}
.mes_chat_box.mes_right {
    display: flex;
    justify-content: flex-end;
}
.company-index .modal__content .mes_right .alliance_own_mes .mes_add {
    left: -40px;
}
.company-index .modal__content .mes_left .alliance_yrs_mes .mes_add {
    left: auto;
    right: -40px;
}
.company-index .modal__content .mes_chat_txt {
    font-size: 14px;
    margin: 0;
}
.company-index .modal__content .own_mes pre.mes_chat_txt {
    background: #004f9d;
    color: white;
}
pre.mes_chat_txt {
    border: none;
    box-shadow: none;
}
.company-index .modal__content .mes_date {
    text-align: center;
    margin-bottom: 8px;
    font-size: 12px;
}
.company-index .modal__content .tab-chat {
    position: relative;
}
.company-index .modal__content .mes_footer {
    border-top: 1px solid #dbd6d9;
    position: relative;
    bottom: 0;
    width: 100%;
    background-color: #fff;
}
.company-index .modal__content .msg-box-flex {
    min-height: 50px;
}
.company-index .modal__content .msgform {
    position: absolute;
    width: 100%;
    bottom: 0;
    background: white;
}
.company-index .modal__content .msg-textarea {
    border: none;
    color: #746d79;
    font-size: 14px;
    max-height: 130px;
    padding: 14px;
    margin: 0;
    width: calc(100% - 54px);
    line-height: 20px;
    resize: none;
    outline: none;
    box-sizing: border-box;
    box-shadow: none;
}
.company-index .modal__content .msg-send-box {
    width: 100%;
}
.company-index .modal__content .mes_send,
.modal__content .alliance_mes_send {
    font-family: FontAwesome;
    border: 0px;
    outline: none;
    background-color: #004f9d;
    color: #fff;
    line-height: 1;
    width: 54px;
    height: 51px;
    padding: 10px 18px;
    margin: 0;
    position: absolute;
    bottom: -1px;
    right: 0;
    font-weight: bold;
    font-size: 14px;
}
.company-index .modal__content .mes_send:hover {
    background: #cc0c2f;
}
.company-index .modal__content .focus-none {
    color: #ccc;
    font-size: 12px;
    min-height: 25px;
}
.company-index .modal__content .focus-none:empty:not(:focus):before {
    content: attr(data-text);
}
.company-index .modal__content .focus-none::before {
    color: #c4c1c5;
}

.company-index .modal__content .tab-memo {
    height: calc(100vh - 110px - 43px);
    overflow-y: auto;
    padding: 20px;
}
.company-index .modal__content .tab-memo dl{
    background: none;
    border-bottom: none;
    padding: 10px 0;
}
.company-index .modal__content .tab-memo .select_job select{
    margin-bottom: 0;
}
.company-index .modal__content .tab-memo textarea {
    margin: 0;
    height: 100px;
    padding: 10px 16px;
    font-weight: bold;
    border-radius: 6px;
    border: 0px;
    outline: none;
    background-color: white;
    box-shadow: none;
    cursor: text;
}
.company-index .modal__content .tab-memo ::-moz-placeholder{
    font-weight: normal;
    font-size: 13px;
}
.company-index .modal__content .tab-memo ::placeholder{
    font-weight: normal;
    font-size: 13px;
}
.company-index .modal__content .tab-memo dt{
    width: 22%;
    margin-left: 1%;
}
.company-index .modal__content .tab-memo dd{
    width: 76%;
}
.company-index .modal__content .tab-memo .select_job{
    width: 100%;
    display: block;
}
.company-index .modal__content .tab-memo .save_btn {
    text-align: center;
    margin: 20px 0 0 0;
}
.company-index .modal__content .tab-memo .save_btn button {
    padding: 10px 30px;
    font-size: 14px;
    margin-bottom: 0;
}
/* スカウト済みタレント一覧
.scouts-students */
.scouts-students table tr{
    border-bottom: none;
}
.scouts-students .scout-contact {
    width: 100%;
    border-bottom: 1px solid #ebebec;
}
.scouts-students table tbody .scout-contact:hover {
    background: none;
}
.scouts-students .scout-contact .scout-contact_box{
    display: block;
    width: 100%;
    min-width: 1000px;
    text-align: center;
}
.scouts-students .scout-contact .scout-contact_area > p{
    display: inline-block;
    margin: 0 20px 0 0;
    font-size: 14px;
}
.scouts-students .scout-contact .scout-contact_area > p:last-child{
    margin-right: 0;
}
.scouts-students .scout-contact .status_tag{
    width: 100px;
}
.scouts-students .scout-contact .mes_send {
    font-family: FontAwesome;
    border: 0px;
    outline: none;
    background-color: #004f9d;
    color: #fff;
    line-height: 1;
    padding: 12px 18px;
    margin: 0;
    font-weight: bold;
    font-size: 14px;
}
.scouts-students .scout-contact .mes_send_index {
    font-family: FontAwesome;
    border: 0px;
    outline: none;
    background-color: #004f9d;
    color: #fff;
    line-height: 1;
    padding: 8px 10px;
    margin: 0;
    font-weight: bold;
    font-size: 14px;
}

.column, .columns {
    position: unset;
}
dl.edit_job{
    display:flex;
    flex-wrap: wrap;
    font-size: 14px;
    margin-bottom: 0;
  }
dl.edit_job dt{
    width: 30%;
    padding: 5px 10px;
    box-sizing: border-box;
  }
dl.edit_job dd{
    padding: 5px 10px;
    margin: 0;
    width: 70%;
    background: #fff;
    box-sizing: border-box;
  }
dl.edit_job dd label {
    display: inline-block;
}
dl.edit_job textarea {
    height: 100px;
}
dl.edit_job input[type="submit"] {
    display: block;
    margin: 10px auto auto;
    background: #cc0c2f;
    color: #fff;
    border: none;
    padding: 8px 15px;
}
.ico_innr {
    position: relative;
    margin-bottom: 40px;
}
.plus {
    font-size: 46px;
    line-height: 1;
    cursor: pointer;
}

.edit_delete p{
    margin:0;
    padding:0;
}
.hidden_hukidasi {
    display: none;
    position: absolute;
    padding: 10px;
    font-size: 12px;
    line-height: 1.6em;
    color: #fff;
    border-radius: 5px;
    background: #000;
    width: 110px;
}
.hidden_hukidasi:before {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    border: 10px solid transparent;
    border-top: 10px solid #000;
    margin-left: -10px;
}
.hidden_hukidasi a {
    color: #fff;
    display: inline-block;
    position: unset;
    width: auto;
    font-size: 14px;
    padding: 0 10px;
}
.edit_delete:hover .hidden_hukidasi {
    display: inline-block;
    top: -50px;
    left: -43px;
}

/*** タレント新規登録 ***/
table.talent_add {
    table-layout: auto;
}
table.talent_add tr:hover {
    background: unset;
}
table.talent_add td {
    vertical-align: middle;
}
table.talent_add input, table.talent_add select {
    margin-bottom: 0;
}
table.talent_add label {
    display: inline-block;
    margin-right: 20px;
}
select[name="registered[year]"], select[name="birthday[year]"], select[name="school_start[year]"], select[name="school_end[year]"],
select[name="validperiod_start[year]"], select[name="validperiod_end[year]"], select[name="schedule[year]"] {
    width: 5em;
}
select[name="registered[month]"], select[name="registered[day]"], select[name="birthday[month]"], select[name="birthday[day]"],
select[name="school_start[month]"], select[name="school_end[month]"], select[name="validperiod_start[month]"], select[name="validperiod_start[day]"],
select[name="validperiod_end[month]"], select[name="validperiod_end[day]"], select[name="schedule[month]"], select[name="schedule[day]"],
select[name="schedule[hour]"], select[name="schedule[minute]"] {
    width: 3.3em;
}
table.talent_add .input.date label {
    display: none;
}
.add_talent_btn {
    text-align: center;
    padding-bottom: 30px;
}
.require {
    float: right;
    background: #dc143c;
    color: #fff;
    padding: 2px 8px;
    border-radius: 3px;
    font-size: 12px;
}
.empbox{
    height: 80px;
}
/*** 企業ページ ***/
.s_person, .c_outline {
    padding: 6px 0 0 10px;
    font-size: 13px;
    color: #555;
}
.t_school {
    font-size: 13px;
    padding-left: 15px;
    color: #555;
}
.balloonoya {
    position   : relative;
  }
  .balloonoya:hover .balloon {
    display: inline;
  }
  .balloon {
    position: absolute;
    display: none;
    padding: 2px;
    background-color:#dc143c;
    width:auto;
    left : 0;
    top : -42px;
    margin-top : 12px;
    font-size: 13px;
    padding: 4px 6px 3px;
    color: #fff;
    border-radius: 3px;
  }
  .balloon:after{
    border-top: 10px solid #dc143c;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    bottom: -8px;
    left : 5%;
    content: "";
    position: absolute;
  }

/*** ジョブ編集 ***/
.jobs.detail fieldset {
    margin: 0;
    padding: 0;
}
.jobs.detail fieldset legend {
    border-bottom: none;
    width: 100%;
    line-height: 2rem;
    background: none;
    font-weight: bold;
    margin-left: -0.1875rem;
    margin: 0;
    padding: 0 0.1875rem;
    color: #333;
}
.jobs.detail .talent_name {
    font-size: 16px;
    font-weight: bold;
    padding: 5px 0;
}
.jobs.detail .tags {
    color: #707070;
    padding-top: 5px;
    padding-left: 30px;
}
.jobs.detail .tags span {
    background: #eee;
    color: #888;
    border-radius: 13px;
    display: inline-block;
    margin: 0px 2px 3px;
    padding: 2px 8px;
    border: 1px solid #bbb;
    font-size: 13px;
}
div.submit {
    margin: auto;
}
input[type="checkbox"] {
    margin-bottom: 0;
}

textarea[name=headline] {
    height : 30px;
}

/** ログインフォーム **/
.login_form {
    max-width: 400px;
    width: 100%;
    margin: auto;
    padding: 20px 20px;
    background: #fff;
    border-radius: 6px;
    box-shadow: 0px 0px 4px 2px rgba(50, 50, 50, 0.1);
}
.login_form .logo {
    margin-bottom: 10px;
    font-size: 14px;
    vertical-align: bottom;
    text-align: center;
}
.login_form .logo img {
    height: auto;
    width: 180px;
    vertical-align: baseline;
}
.login_form .logo span {
    font-size: 2.5em;
}
.login_form button {
    float: none !important;
    margin: auto;
    display: block;
    padding: .7rem 1rem;
    width: 100%;
    border-radius: 4px;
}
.login_form fieldset {
    margin-bottom: 0;
    margin-top: 0;
    padding: 0 0 0px;
}
.login_form input {
    font-size: 16px !important;
    padding: 10px !important;
    height: auto !important;
}
.login_form p.forget {
    margin: 15px 0 0;
    text-align: center;
    font-size: 14px;
}
.login_form p.forget a {
    color: #cc0c2f !important;
}
.form-signin {
    width: 100%;
    max-width: 420px;
    padding: 15px;
    margin: auto;

}
.form-signin .h3 {
    font-size: 20px !important;
    font-weight: bold;
}
.form-signin p {
    font-size: 15px;
    text-align: left;
}
.form-signin p {
    text-align: left;
    font-size: 13px;
}
.form-signin.forget p small {
    color: #666;
}
.form-signin.forget .inner {
    max-width: 330px;
    margin: auto;
    width: 100%;
}
.text-center {
    text-align: center!important;
}
.form-signin.forget {
    max-width: 620px;
    width: 100%;
}

/* ログインページ */
.form-signin {
    height: calc(100vh - 40px);
    align-items: center;
    display: flex;
}
.form-signin form {
    width: 100%;
}

/* モーダルCSS */
.modalArea, .occupationArea, .certificationArea {
    display: none;
    position: fixed;
    z-index: 10;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }

  .modalBg {
    width: 100%;
    height: 100%;
    background-color: rgba(30,30,30,0.9);
  }

  .modalWrapper {
    position: absolute;
    top: 50%;
    left: 50%;
    transform:translate(-50%,-50%);
    width: 70%;
    height: 500px;
    max-width: 900px;
    padding: 10px 30px;
    background-color: #fff;
  }
  .modalWrapper li {
      font-size: 14px;
  }
  .modalWrapper #closebtn {
    position: absolute;
    top: 1%;
    right: 2%;
    cursor: pointer;
  }
  .modalWrapper #closebtn i {
    font-size: 2rem;
    font-family: FontAwesome;
    color: #cc0c2f;
    font-style: normal;
  }
  .modalContents {
      overflow: auto;
  }
  .occupationModalClose {
    position: absolute;
    top: 0.5rem;
    right: 1rem;
    cursor: pointer;
  }



  .carier_button {
    padding: 5px 10px;
    border: 1px solid #282828;
    border-radius: 2px;
    cursor: pointer;
    background: #ccc;
    display: inline-block;
  }

  #tabs, #occupationTabs, #certificationTabs {
    border: 1px solid #ccc;
    max-height: 250px;
    overflow: auto;
}
  #occupationTabs, #certificationTabs {
    max-height: auto;
    overflow: visible;
}

  #occupationTabs .ui-tabs-nav, #certificationTabs .ui-tabs-nav {
    max-height: 250px;
    overflow: auto;
  }
  #occupationTabs .ui-tabs-panel, #certificationTabs .ui-tabs-panel {
    max-height: 250px;
    overflow: auto;
  }

  #certificationTabs {
    max-height: auto;
  }

  /*#certificationTabs .ui-tabs-nav {
    max-height: 180px;
    overflow: auto;
  }
  #certificationTabs .ui-tabs-panel {
    max-height: 180px;
    overflow: auto;
  }*/

  .ui-tabs-vertical {
  }

  .scroll_ul .ui-tabs-nav {
      padding: 0;
      float: left;
      width: 35%;
      margin: 0;
  }

  .scroll_ul .ui-tabs-nav > li {
      clear: left;
      width: 100%;
      margin: 0;
      list-style: none;
      border-bottom: 1px solid #ccc;
      border-right: 1px solid #ccc;
      background: #eee;
  }

  .scroll_ul .ui-tabs-nav > li > a {
      display:block;
      padding: 5px 10px;
      box-sizing: border-box;
  }

  .scroll_ul .ui-tabs-nav > li.ui-tabs-active {
      padding-bottom: 0;
      border-right: none;
      background: #fff;
  }

  .ui-tabs-vertical > .ui-tabs-panel {
      padding: 1em;
      float: left;
      width: 65%;
      box-sizing: border-box;
  }

  .ui-tabs.scroll_ul .ui-tabs-nav > li.ui-tabs-active {
      margin-bottom: 0;
  }
  #occupationModalClose.button, #certificationModalClose.button {
      margin: 15px auto;
      padding: 7px 20px;
      display: block;
      width: 100px;
  }

/* talent向け公開ページ
　 talents/job */
.job-talents{
    background: white;
    letter-spacing: 0.02em;
}
.job-talents .large-9{
    margin: 0 auto 50px;
    width: 1000px !important;
}
.job-talents .job_date{
    text-align: right;
    font-size: 13px;
    color: #aaa;
    margin: 0;
}
.job-talents .job_mes{
    color: #cc0c2f;
    font-weight: bold;
    font-size: 18px;
    margin-bottom: 15px;
    border-bottom: 2px solid #ddd;
    padding-bottom: 3px;
}
.job-talents .job_tags{
    margin-bottom: 10px;
}
.job-talents .job_tags span{
    font-weight: bold;
    font-size: 13px;
    border-radius: 20px;
    padding: 5px 10px;
    color: white;
    margin: 0 5px 0px 0;
    display: inline-block;
}
.job-talents .job_tags .tag_blue{
    background: #005170;
}
.job-talents .job_tags .tag_green{
    background: #025a10;
}
.job-talents .job_tags .tag_orange{
    background: #c04902;
}
.job-talents .ttl_02{
    font-size: 25px;
    color: #222;
    font-weight: bold;
}
.job-talents .job_head_area{
    margin: 0 0 15px 0;
}
.job-talents .job_head_logo{
    display: inline-block;
    vertical-align: middle;
    margin: 0;
    line-height: 1;
    width: 90px;
    height: 90px;
    text-align: center;
    position: relative;
    border-radius: 50%;
    /*border: 1px solid #e1e1e1;*/
    padding: 10px;
}
.job-talents .job_head_logo img{
    position: absolute;
    /*top: 50%;
    left: 50%;*/
    width: 80px;
    height: 80px;
    margin-left: -40px;
    margin-top: -12%;
    object-fit:cover;
    border-radius: 50%;  /* 角丸半径を50%にする(=円形にする) */

}
.job-talents .job_head_area .ttl_05{
    display: inline-block;
    vertical-align: middle;
    margin: 0 0 0 15px;
    font-size: 15px;
    line-height: 1;
}
.job-talents .job_pr {
}
.job-talents .job_pr_box {
    overflow: hidden;
    margin-bottom: 50px;
}
.job-talents .job_imgs {
    margin: 0;
    float: left;
    width: 30%;
}

.job-talents .job_imgs img {
    max-width: 285px;
    max-height: 175px;
    width: 100%;
}

.job-talents .job_pr_area{
    float: left;
    width: 70%;
}
.job-talents .job_pr_box:nth-child(even) .job_imgs{
    float: right;
    text-align: right;
}
.job-talents .job_pr_box:nth-child(even) .job_pr_area{
}
.job-talents .ttl_04{
    font-weight: bold;
    font-size: 20px;
    border: 0;
    padding: 0;
    margin: 0 0 20px 0;
}
.job-talents .job_txt_area{
    margin-bottom: 20px;
}
.job-talents .ttl_03{
    font-weight: bold;
    font-size: 18px;
    background: #004f9d;
    color: white;
    padding: 15px;
    margin: 0;
}
.job-talents table{
    box-shadow: none;
    border: 0!important;
}
.job-talents table tbody tr {
    transition: 0s;
}
.job-talents table tbody tr:hover {
    background: white
}
.job-talents table td:first-child {
    background: #f1f1f1;
    font-weight: bold;
}
.job-talents table td {
    padding: 15px;
}
.job-talents .job_add_txt{
    font-size: 13px;
}
.job-talents .job_add_txt a{
    color: #004f9d;
    text-decoration: underline;
    font-weight: bold
}
.job-talents .overlay{
    padding-left: 0;
    background: rgba(50,50,50,.7);
}
.job-talents button{
    padding-left: 0;
    outline: none;
    line-height: 1;
    font-weight: bold;
    font-size: 18px;
    padding: 18px 0;
    width: 250px;
    padding: 18px 0;
}
.job-talents button i{
    padding-left: 10px;
}
.job-talents button[name="ng"]{
    background: #bbb;
    margin: 0 20px 0 0;
    display: inline-block;
    float: none;
}
.job-talents button[name="ng"]:hover{
    background: #004f9d;
    color: white;
}
.job-talents .bottom_btn #talent_submit[name="ok"]{
    padding: 18px 0;
    margin: 0;
    float: none;
}
.job-talents .bottom_btn #talent_submit[name="ok"]:hover{
    font-size: 17px;
    margin-bottom: 6px;
}

/* スカウト一覧　.job-talents  */
.job-talents .content-area .tab-prof{
    background: white;
    height: calc(100vh - 500px);
}
.job-talents .content-area .tab-agent-prof{
    background: white;
    height: calc(100vh - 250px);
}
.job-talents .tab-prof .job_pr_area, .job-talents .tab-agent-prof .job_pr_area{
    width: 68%;
    margin-left: 2%;
}
/*.job-talents .tab-prof .ttl_04{
    margin-bottom: 6px;
    font-size: 14px;
}*/
.job-talents .tab-prof > p{
    font-size: 14px;
}
.job-talents .tab-prof .ttl_03, .job-talents .tab-agent-prof .ttl_03{
    margin-bottom: 25px;
}
.job-talents .tab-prof .ttl_03, .job-talents .tab-agent-prof .ttl_03{
    color: white;
    width: 100%;
    padding: 4px 10px;
}
.job-talents .tab-prof .scoutjob_btn_area{
    width: 375px;
    margin: 0 auto;
}
/* .job-talents .tab-prof button[name="ng"]{
    margin: 0 10px 0 0;
} */
.job-talents .tab-prof button{
    width: 180px;
    font-size: 15px;
}
.job-talents .tab-prof .modal{
    display: none;
    position: fixed;
    z-index: 1000;
    transform: none;
    transition: 0s;
}
.job-talents .tab-prof .modal__bg{
    background: rgba(0,0,0,0.8);
    height: 100vh;
    position: absolute;
    width: 100%;
    z-index: 100;
    left: auto;
}
.job-talents .tab-prof .modal__content{
    background: #fff;
    left: 50%;
    padding: 40px;
    position: absolute;
    top: 50%;
    transform: translate(-50%,-50%);
    width: 60%;
    z-index: 999;
    transition: 0s;
    right: auto;
    height: auto;
}
.job-talents .tab-prof .js-modal-close {
    float: right;
}
.job-talents .tab-prof .modal__content h3 {
    margin: 0 0 20px 0;
}
.job-talents .tab-prof .modal__content label {
    margin: 0 10px 0 0;
    display: inline-block
}
.job-talents .tab-prof .modal__content input {
}
.job-talents .tab-prof .modal__content textarea{
    margin: 12px 0 0 0;
    box-shadow: none;
    height: 150px;
    border-color: #717171;
    border-radius: 2px;
}
.job-talents .tab-prof .modal__content .send_btn{
    width: 120px;
    margin: 30px auto 0;
}
.job-talents .tab-prof .modal__content button{
    width: auto;
    font-weight: normal;
    padding: 15px 30px;
    margin: 0;
}
.job-talents .tab-prof .modal__content button:hover{
    background: #cc0c2f;
}
.job-talents .tab-chat .mes_chat_area {
    height: calc(100vh - 500px);
}
.title_flex {
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
.title_flex .change_career {
    text-align: center;
    background: #bbb;
    color: #222;
    padding: 8px;
    font-size: 14px;
    cursor: pointer;
    font-weight: bold;
    max-height: 36px;
    margin-top: 20px;
}

/*
案件一覧ページ
*/
.pc{
    display: block;
}
.sp{
    display: none;
}
.jobs-list {
    background: #ddd;
}
.joblist_head_wrap{
    background: white;
}
.jobs-list .job_wrap{
    padding: 20px;
    border-radius: 5px;
    background: white;
    letter-spacing: 0.02em;
    margin-bottom: 20px;
}
.jobs-list .job_cnt_ttl{
    font-weight: bold;
    font-size: 24px;
}
.jobs-list .job_cnt_inbox{
    overflow: hidden;
    margin-bottom: 20px;
}
.jobs-list .job_imgs{
    width: 42%;
    margin: 0 3% 0 0;
    float: left;
}
.jobs-list .job_pr_area{
    width: 55%;
    float: left;
}
.jobs-list .ttl_02{
    margin: 0 0 20px 0;
    font-weight: bold;
    font-size: 24px;
}
.jobs-list .ttl_02{
    margin: 0 0 20px 0;
}
.jobs-list .joblist_head ul{
    margin: 0;
    border: 1px solid #000;
    border-radius: 5px;
    text-align: center;
}
.jobs-list .joblist_head li.active{
    background: #000;
    color: white;
}
.jobs-list .joblist_head li{
    display: inline-block;
    width: 49.86%;
    padding: 7px 0;
    text-align: center;
    line-height: 1;
}
.jobs-list .search_box{
    margin: 10px 0;
}
.jobs-list .search_box input{
    padding: 6px;
    border-radius: 5px;
}
.jobs-list .amount{
    margin-top: 0;
}
.jobs-list .job_imgs img{
    max-width: 100%;
}
.jobs-list .job_tags{
    margin-bottom: 10px;
}
.jobs-list .job_tags span{
    font-weight: bold;
    font-size: 13px;
    border-radius: 20px;
    padding: 5px 10px;
    color: white;
    margin: 0;
    display: inline-block;
}
.jobs-list .job_tags .tag_blue{
    background: #005170;
}
.jobs-list .job_tags .tag_green{
    background: #025a10;
}
.jobs-list .job_tags .tag_orange{
    background: #c04902;
}
.jobs-list .job_tags .new_icon{
    background: #cc0c2f;
    border-radius: 0;
}
.jobs-list .job_tags{
    clear: both;
    margin-bottom: 10px;
}
.jobs-list .job_tags .job_cnt_date{
    float: right;
    width: auto;
    color: #333;
}
.jobs-list .job_tags .date{
    color: #333;
}
.jobs-list .job_condition{
    color: #aaa;
}
.jobs-list .place{
    margin-bottom: 10px;
}
.jobs-list .price{
    margin-bottom: 0;

}
.jobs-list .job_list_btns{
    width: 395px;
    margin: 0 auto;
}
.jobs-list .job_list_btns > button{
    width: 180px;
    font-size: 15px;
    border-radius: 5px;
}
.jobs-list .btn_favorite{
    background: white;
    border: 1px solid #cc0c2f;
    color: #cc0c2f;
    margin-right: 20px;
    color: #222;
}
.jobs-list .btn_favorite i{
    color: #cc0c2f;
}
.jobs-list .btn_detail{
    background: #cc0c2f;
    border: 1px solid #cc0c2f;
}
/*
.jobs-list .btn_favorite:hover{
    background: #cc0c2f;
    border: 1px solid #cc0c2f;
    color: white;
}
.jobs-list .btn_detail:hover{
    background: white;
    border: 1px solid #cc0c2f;
    color: #cc0c2f;
}
*/
.jobs-list i{
    padding-right: 10px;
}
.joblist_foot{

}
.joblist_foot ul{
    overflow: hidden;
}
.joblist_foot .icon_link li{
    width: 25%;
    float: left;
    padding: 10px;
    border: 1px solid #aaa;
    background: white;
    text-align: center;
    list-style-type: none;
    color:#222;
}
.joblist_foot .icon_link li a{
    color:#222;
}
.joblist_foot .icon_link p{
    margin: 0;
}
.joblist_foot .icon_link .newcnt{
    position: relative;
}
.joblist_foot .icon_link .newcnt::before{
    position: absolute;
    content: "";
    line-height: 0px;
    font-size: 10px;
    height: 12px;
    width: 12px;
    border-radius: 50%;
    text-align: center;
    vertical-align: middle;
    display: inline-block;
    right: 10px;
    top: -2px;
    background-color: #cc0c2f;
}
.joblist_foot .icon_link .icon{
    font-size: 35px;
    line-height: 1;
    margin-bottom: 7px;
}
.joblist_foot .icon_link .text{
    font-size: 14px;
}
.joblist_foot .icon_link li.display{
    background: #222;
    color: white;
}
.joblist_foot .icon_link li.display a{
    color: white;
}
.joblist_foot .icon_link li.display a:hover{
    color: white;
}
.jobs-list .paginator {

}
.jobs-list .pagination {

}
.jobs-list .pagination li{
    padding: 11px;
    width: auto;
    height: 33px;
    line-height: 1;
}
.jobs-list .pagination li:hover{
    background: white;
    border-radius: 3px;
}
.jobs-list .pagination li.active{
    background: white;
    border-radius: 3px;
}

/* header */
@media screen and (max-width: 980px) {
    #keyword-form .select{
        width: 130px;
    }
    #keyword-form .text{
        width: 140px;
    }
    .top-bar button{
        width: 70px;
        padding: 0.4125rem 0;
    }
}

@media screen and (max-width: 1400px) {
    .detail_wrap .edit_delete{
        width: 43%;
    }
    .talent_img{
        width: 10%;
        margin-right: 2%;
    }
    .talents.detail .talent_name{
        width: 45%;
    }
}

@media screen and (max-width: 800px) {
    fieldset {
        width: 100%;
        display: contents;
    }
    .content {
        padding-left: 1rem;
        padding-right: 1rem;
    }
    nav #keyword-form {
        display: none;
    }
    #actions-sidebar {
      display:none;
    }
    .large-9 {
        width: 100%;
        margin-left: 0;
    }
    table.talent_add label {
        margin-right: 10px;
    }
    table.talent_add #first-td {
        /*width: 90px !important;*/
    }
    .preferred_memo {
        width: 3em !important;
    }
    .preferred-memo-label {
        width: calc(100% - 4em);
        margin-right: 5px !important;
    }
    .input.select {
        display: flex;
        align-items: center;
        margin: 3px 0;
    }
    .talents.detail table.talent_add td {
        display: block;
        width: 100%;
    }
    select, input[type="text"], input[type="password"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="week"], input[type="email"], input[type="number"], input[type="search"], input[type="tel"], input[type="time"], input[type="url"], input[type="color"], textarea {
        font-size: 16px;
    }
    .modalWrapper {
        width: 90%;
        padding: 10px 15px;
        height: 80%;
        overflow: auto;
    }

    #tabs, #occupationTabs, #certificationTabs {
        border: 1px solid #ccc;
        max-height: none;
        overflow: auto;
    }

    .scroll_ul {
        overflow-x: scroll;
        width: 306px;
    }
    .scroll_ul{
        overflow-x: auto;
    }
    .scroll_ul::-webkit-scrollbar{
        width: 5px;
        background: #d1d1d1;
    }
    .scroll_ul::-webkit-scrollbar:horizontal{
        height: 5px;
        background: #d1d1d1;
    }
    .scroll_ul::-webkit-scrollbar-thumb{
        background: #777777;
        border-radius: 2px;
    }
    .scroll_ul::-webkit-scrollbar-thumb:horizontal{
        background: #777777;
        border-radius: 2px;
    }
    .scroll_ul::-webkit-scrollbar {
        height: 10px;
    }
    .scroll_ul .ui-tabs-nav {
          float: none;
          width: auto;
          display: block;
          white-space: nowrap;
          font-size: 0;
          width: 800px;
    }
    #occupationTabs .ui-tabs-nav, #certificationTabs .ui-tabs-nav {
        overflow: initial;
    }
      .scroll_ul .ui-tabs-nav > li {
        clear: none;
        width: fit-content;
        display: inline-block;
        margin: 0;
      }
      .scroll_ul .ui-tabs-nav > li > a {
          display:block;
          padding: 5px 10px;
          box-sizing: border-box;
          font-size: 13px;
      }
      .scroll_ul .ui-tabs-nav > li.ui-tabs-active {
          padding-bottom: 0;
          border-right: none;
          background: #fff;
      }
      .ui-tabs-vertical > .ui-tabs-panel {
          padding: 1em;
          float: none;
          width: 100%;
      }

      .ui-tabs.scroll_ul .ui-tabs-nav > li.ui-tabs-active {
          margin-bottom: 0;
      }
      select#school-id {
          width: 100%;
      }

      .overlay{
        padding-left: 0;
    }
    .overlay{
        padding-left: 0;
    }
    .detail .no-relate{
        margin-bottom: 6px;
    }
    .detail_wrap > div{
        float: none;
    }
    .talent_img{
        width: 100%;
        margin: 10px 0;
    }
    .talents.detail .talent_name{
        width: 100%;
    }
    .edit_delete {
        float: none;
        width: 100%;
        margin-bottom: 10px;
        text-align: center;
    }
    .detail_wrap .edit_delete{
        width: 100%;
        float: none;
    }
    .btn_edit_delete a{
        width: 48%;
        padding: 12px 0;
    }
    .talentsinfo .btn_edit_delete a.scout{
        width: 100%;
        margin-bottom: 6px;
        display: block;
    }
    .talentsinfo .btn_edit_delete a.dl{
        width: 100%;
        margin-bottom: 6px;
        display: block;
    }
    p.btn_show{
        position: relative;
    }

    /* talent向け公開ページ
    　 talents/job */
    .job-talents{
        width: 100%;
    }
    .job-talents .large-9{
        width: 100% !important;
    }
    .job-talents .job_date{
    }
    .job-talents .job_mes{
        font-size: 16px;
    }
    .job-talents .ttl_02{
        font-size: 20px;
    }
    .job-talents .job_head_area{
    }
    .job-talents .job_head_logo{
    }
    .job-talents .job_head_area .ttl_05{
    }
    .job-talents .job_pr_box {
        overflow: visible;
    }
    .job-talents .job_imgs {
        float: none;
        width: 100%;
        margin: 0 0 20px 0;
        text-align: center;
    }
    .job-talents .job_pr_area{
        float: none;
        width: 100%;
    }
    .job-talents .job_pr_box:nth-child(even) .job_imgs{
        float: none;
        text-align: center;
    }
    .job-talents .job_pr_box:nth-child(even) .job_pr_area{
    }
    .job-talents .ttl_04{
        font-size: 18px;
        margin: 0 0 12px 0;
    }
    .job-talents .job_txt_area{
        margin-bottom: 20px;
    }
    .job-talents .ttl_03{
        font-size: 17px;
    }
    .job-talents table{
    }
    .job-talents table tbody tr {
    }
    .job-talents table tbody tr:hover {
    }
    .job-talents table td:first-child {
        width: 95px;
        font-weight: bold;
    }
    .job-talents table td {
    }
    .job-talents .job_add_txt{
    }
    .job-talents .overlay{
        padding-left: 1rem;
        padding-right: 1rem;
    }
    .job-talents button{
        width: 48%;
    }
    .job-talents button[name="ng"]{
        margin: 0 2% 0 0;
        float: left;
    }
    .job-talents .bottom_btn #talent_submit{
    }
    .job-talents button[name="ok"]{
        float: left;
    }
    /*案件一覧ページ*/
    .jobs-list-contents{
        padding-top: 130px;
    }
    .pc{
        display: none;
    }
    .sp{
        display: block;
    }
    .jobs-list .amount{
        margin-bottom: 5px;
    }
    .jobs-list .job_cnt_ttl{
        font-size: 14px;
    }
    .jobs-list .job_wrap .job_imgs{
    }
    .jobs-list .job_wrap .ttl_02{
        font-size: 14px;
        margin-bottom: 5px;
    }
    .jobs-list-spnav{
        clear: both;
        background: white;
        padding-left: 0.9375rem;
        padding-right: 0.9375rem;
    }
    .jobs-list .joblist_head li{
        width: 49.3%;
    }
    .jobs-list .place{
        margin-bottom: 1px;
    }
    .jobs-list .job_condition p{
        font-size: 14px;
    }
    .jobs-list .job_list_btns{
        width: 100%;
    }
    .jobs-list .job_list_btns > button{
        width: 49%;
        margin: 0;
        line-height: 1;
        padding: 13px 0;
    }
    .jobs-list .btn_favorite{
        margin-right: 1%;
    }
    .joblist_foot{
        padding: 0;
        margin: 0;
    }
    .joblist_foot_menu{
        margin-bottom: 30px;
    }
    .joblist_foot .icon_link{
        position: fixed;
        left: 0;
        bottom: 0;
        width: 100%;
        z-index: 100;
    }
    .joblist_foot .icon_link{
        margin: 0;
    }
    .joblist_foot .icon_link li{
        padding: 10px 0;
    }
    .joblist_foot .nav_link{
        overflow: hidden;
        margin: 0;
    }
    .joblist_foot .nav_link li{
        position: relative;
        width: 50%;
        float: left;
        padding: 10px 0;
        border: 1px solid #aaa;
        background: white;
        text-align: center;
        list-style-type: none;
        color:#222;
        font-size: 13px;
    }
    .joblist_foot .nav_link li::after{
        position: absolute;
        font-family: FontAwesome;
        content: "\f054";
        top: 12px;
        right: 6px;
        font-size: 12px;
        color: #cc0c2f;
    }
    .joblist_foot .nav_link li a{
        color:#222;
    }
    .joblist_foot .footer{

    }
    .jobs-list-spnav{

    }
    .jobs-list-spnav h3{
        text-align: center;
        font-size: 16px;
        font-weight: bold;
    }
    /*ハンバーガー*/
    /*=============================
    .btn-trigger
    =============================*/
    .hamburger-menu{
        width: auto;
        padding-top: 0.9375rem;
        padding-left: 0.9375rem;
        padding-right: 0.9375rem;
    }
    .btn-trigger {
    position: relative;
    width: 30px;
    height: 24px;
    cursor: pointer;
    }
    .btn-trigger span {
    position: absolute;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: #222;
    border-radius: 4px;
    }
    .btn-trigger, .btn-trigger span {
    display: inline-block;
    transition: all .5s;
    box-sizing: border-box;
    }
    .btn-trigger span:nth-of-type(1) {
    top: 0;
    }
    .btn-trigger span:nth-of-type(2) {
    top: 12px;
    }
    .btn-trigger span:nth-of-type(3) {
    bottom: 0;
    }


    /*=============================
    #btn01
    =============================*/
    #btn01.active span:nth-of-type(1) {
    -webkit-transform: translateY(20px) rotate(-45deg);
    transform: translateY(10px) rotate(-45deg);
    }
    #btn01.active span:nth-of-type(2) {
    opacity: 0;
    }
    #btn01.active span:nth-of-type(3) {
    -webkit-transform: translateY(-20px) rotate(45deg);
    transform: translateY(-13px) rotate(45deg);
    }
}
@media screen and (max-width: 640px) {
    .top-bar.expanded .title-area a {
        padding: 0;
    }
    .top-bar.expanded .title-area img {
        height: auto;
        width: 100px;
        margin-top: 6px;
    }
    .top-bar-section{
        width: auto;
    }
    .top-bar-section ul li, .top-bar-section li:not(.has-form) a:not(.button){
        padding: 0;
    }
    .bottom_btn button.edit_btn {
        display: block;
        margin: 12px auto 0;
    }
}

/* main --------------------------- */
.main {
    width: 1000px;
    margin: auto;
}
.main .box {
    padding: 30px;
    background: #fff;
    border: 1px solid #f5f5f5;
    box-shadow: 0 4px 6px rgb(147 153 153 / 6%);
    border-radius: 6px;
}
.main h1 {
font-size: 18px;
font-weight: bold;
margin: 0 0 15px 0;
}
/* privacypolicy ---------------------- */
.privacypolicy h2 {
    background: #f0f5f8;
    border-radius: 4px;
    font-size: 18px;
    font-weight: bold;
    padding: 15px 20px 12px 20px;
    margin: 0 0 20px 0;
}
.privacypolicy p,.main .box dd {
    font-size: 14px;
    line-height: 1.8;
}
.privacypolicy p.txt_right {
    text-align: right;
}
.privacypolicy dl {
    margin: 30px 0 0 0;
}
.privacypolicy dt {
    color: #4893ce;
    font-size: 15px;
    font-weight: bold;
    margin: 10px 0;
}
.privacypolicy dd {
    margin: 0 0 40px 0;
}
.privacypolicy dd dt {
    font-size: 13px;
    color: #28374e;
    margin: 0 0 10px 0;
}
.privacypolicy dd dd {
    padding: 0 0 0 35px;
}
.privacypolicy dl.contact_info {
    border: 2px solid #e3ebf9;
    padding: 20px 30px 25px 30px;
    margin: 0 0 30px 0;
}
.privacypolicy dl.contact_info dd {
    margin: 0;
}

@media screen and (max-width: 640px) {
    .main {
        width: 100%;
        margin: auto;
    }
}
.job_headline {
    font-size: 20px;
}

.job_company_name {
    position: static;
    width:auto;
    height:auto;
    margin:0;
    float:left;
}
.out_link {
    color:#0044CC;
}
.out_link:after {
    content: url("/img/link-out.jpg");
    font-weight: 900;
}

td.ipo_code div{
    display: inline-block;
}

.add-careers {
    background: #cc0c2f;
    padding: 5px;
    position: absolute;
    top: 93px;
    right: 30px;
}
.add-careers a {
    font-size: 90%;
    color: #fff;
}

.tag-buttton {
    background: #004f9d;
    padding: 5px;
    position: absolute;
    top: 140px;
    right: 30px;
}
.tag-buttton a {
    font-size: 90%;
    color: #fff;
}

table.talent_add .checkbox {
    display: inline-block;
    margin-right: 20px;
}

.aproache_status {
    position   : relative;
}

.aproache_status:hover .aproache_status_hover {
    display: inline;
}

.aproache_status_hover {
    position   : absolute;
    display: none;
    padding: 2px;
    background-color: rgba(255, 255, 255, 1);
    width:180px;
    left : 0%;
    top : 100%;
    margin-top : 12px;
    font-size: 80%;
}

.aproache_status_hover:after{
    border-bottom: 12px solid rgba(255, 255, 255, 1);
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    top: -12px;
    left : 5%;
    content: "";
    position: absolute;
}

/* 企業管理画面の不採用理由モーダル */
.job-companies .tab-memo .modal{
    display: none;
    position: fixed;
    z-index: 1000;
    transform: none;
    transition: 0s;
}
.job-companies .tab-memo .modal__bg{
    background: rgba(0,0,0,0.8);
    height: 100vh;
    position: absolute;
    width: 100%;
    z-index: 100;
    left: auto;
}
.job-companies .tab-memo .modal__content{
    background: #fff;
    left: 50%;
    padding: 40px;
    position: absolute;
    top: 50%;
    transform: translate(-50%,-50%);
    width: 60%;
    z-index: 999;
    transition: 0s;
    right: auto;
    height: auto;
}
.job-companies .tab-memo .js-modal-close {
    float: right;
}
.job-companies .tab-memo .modal__content h3 {
    margin: 0 0 20px 0;
}
.job-companies .tab-memo .modal__content label {
    margin: 0 10px 0 0;
    display: inline-block
}
.job-companies .tab-memo .modal__content input {
}
.job-companies .tab-memo .modal__content textarea{
    margin: 12px 0 0 0;
    box-shadow: none;
    height: 150px;
    border-color: #717171;
    border-radius: 2px;
    border-style: solid;
    border-width: 1px;
}
.job-companies .tab-memo .modal__content .send_btn{
    width: 150px;
    margin: 30px auto 0;
}
.job-companies .tab-memo .modal__content button{
    width: auto;
    font-weight: normal;
    padding: 15px 30px;
    margin: 0;
}
.job-companies .tab-memo .modal__content button:hover{
    background: #cc0c2f;
}

td#driver_license_td .checkbox {
    float: left;
    margin-right: 0;
}

.preview_photo {
    max-height: 118px;
    max-width: 100px;
}

.preview_building {
    /*top: 50%;
    left: 50%;*/
    width: 80px;
    height: 80px;
    object-fit:cover;
    border-radius: 50%;  /* 角丸半径を50%にする(=円形にする) */
}

.preview_image {
    max-width: 300px;
    max-height: 184px;
}

.photo_del {
    background-color: #EFEFEF;
    color: #000000;
    margin: 0 4px 0 0;
    padding: 1px 6px;
    font-size: 14px;
    border-radius: 3px;  /* 角丸半径を50%にする(=円形にする) */
    border:solid 1px #4F4F4F;
}

.photo_del:hover {
    background-color: #E5E5E5 !important;
    color: #000000;
}

.image_area_talent {
    height: 118px;
    width: 100px;
    position: relative;
    margin-top: 10px;
    background-color: #D4D4D4;
    text-align: center;
}

.image_area_building {
    width: 80px;
    height: 80px;
    position: relative;
    margin-top: 10px;
    border-radius: 50%;  /* 角丸半径を50%にする(=円形にする) */
}

.image_area_photo {
    width: 300px;
    height: 184px;
    position: relative;
    margin-top: 10px;
    background-color: #D4D4D4;
    text-align: center;
}

.del_btn {
    width: 20px;
    height: 20px;
    position: absolute;
    top: 0px;
    right: 0px;
    border-radius: 50%;  /* 角丸半径を50%にする(=円形にする) */
}


/* ステイタスのソート */
.sortable { position: relative; }
.sort_box {position: absolute; background: #fff; padding: 15px; width: 170px; box-shadow: 0 2px 2px 3px rgba(55,55,55,0.1); z-index: 10; top: 25px; left: -30px;}
.sort_box ul { list-style: none; margin-left: 0;}
.sort_btn { display: inline-block; font-size: 13px; text-align: center; border: 1px solid #ccc; border-radius: 5px !important; padding: 5px 10px; background: #eee; }
.sort_submit { margin-right: 10px; background: #004f9d; color: #fff; }
.status_btn:hover { color: #cc0c2f; }
.status_btn:hover, .sort_btn { cursor: pointer; }

.company_building {
    width: 16px;
    height: 18px;
    margin-left: 6px;
}

.company_building a {
    position: static;
    display: inline-block !important;
    width: 18px;
}

.csv_dl_button {
    background: #004f9d;
    padding: 5px;
    display: block;
    width: 250px;
    margin: 0;
    text-align: center;
    color: #FFFFFF;
    display: inline-block;
}

.csv_dl_button a {
    color: #FFFFFF;
    width: 250px;
    display: block;
}

.csv_dl_button.disabled
 {
    background: #bfbdbd;
}

.csv_dl_button.disabled a
{
    pointer-events: none;
}

.check-row {
    display: none;
}

/* agent向け公開ページ
　 agent/agents */
.agent-agents{
    background: white;
    letter-spacing: 0.02em;
}
.agent-agents .large-9{
    margin: 0 auto 50px;
    width: 1000px !important;
}
.agent-agents .agent_date{
    text-align: right;
    font-size: 13px;
    color: #aaa;
    margin: 0;
}
.agent-agents .agent_mes{
    color: #cc0c2f;
    font-weight: bold;
    font-size: 18px;
    margin-bottom: 15px;
    border-bottom: 2px solid #ddd;
    padding-bottom: 3px;
}
.agent-agents .agent_tags{
    margin-bottom: 10px;
}
.agent-agents .agent_tags span{
    font-weight: bold;
    font-size: 13px;
    border-radius: 20px;
    padding: 5px 10px;
    color: white;
    margin: 0 5px 0px 0;
    display: inline-block;
}
.agent-agents .agent_tags .tag_blue{
    background: #005170;
}
.agent-agents .agent_tags .tag_green{
    background: #025a10;
}
.agent-agents .agent_tags .tag_orange{
    background: #c04902;
}
.agent-agents .ttl_02{
    font-size: 25px;
    color: #222;
    font-weight: bold;
}
.agent-agents .agent_head_area{
    margin: 0 0 15px 0;
}
.agent-agents .agent_head_logo{
    display: inline-block;
    vertical-align: middle;
    margin: 0;
    line-height: 1;
    width: 90px;
    height: 90px;
    text-align: center;
    position: relative;
    border-radius: 50%;
    /*border: 1px solid #e1e1e1;*/
    padding: 10px;
}
.agent-agents .agent_head_logo img{
    position: absolute;
    /*top: 50%;
    left: 50%;*/
    width: 80px;
    height: 80px;
    margin-left: -40px;
    margin-top: -12%;
    object-fit:cover;
    border-radius: 50%;  /* 角丸半径を50%にする(=円形にする) */

}
.agent-agents .agent_head_area .ttl_05{
    display: inline-block;
    vertical-align: middle;
    margin: 0 0 0 15px;
    font-size: 15px;
    line-height: 1;
}
.agent-agents .agent_pr {
}
.agent-agents .agent_pr_box {
    overflow: hidden;
    margin-bottom: 50px;
}
.agent-agents .agent_imgs {
    margin: 0;
    float: left;
    width: 30%;
}

.agent-agents .agent_imgs img {
    max-width: 285px;
    max-height: 175px;
    width: 100%;
}

.agent-agents .agent_pr_area{
    float: left;
    width: 70%;
}
.agent-agents .agent_pr_box:nth-child(even) .agent_imgs{
    float: right;
    text-align: right;
}
.agent-agents .agent_pr_box:nth-child(even) .agent_pr_area{
}
.agent-agents .ttl_04{
    font-weight: bold;
    font-size: 20px;
    border: 0;
    padding: 0;
    margin: 0 0 20px 0;
}
.agent-agents .agent_txt_area{
    margin-bottom: 20px;
}
.agent-agents .ttl_03{
    font-weight: bold;
    font-size: 18px;
    background: #004f9d;
    color: white;
    padding: 15px;
    margin: 0;
}
.agent-agents table{
    box-shadow: none;
    border: 0!important;
}
.agent-agents table tbody tr {
    transition: 0s;
}
.agent-agents table tbody tr:hover {
    background: white
}
.agent-agents table td:first-child {
    background: #f1f1f1;
    font-weight: bold;
}
.agent-agents table td {
    padding: 15px;
}
.agent-agents .agent_add_txt{
    font-size: 13px;
}
.agent-agents .agent_add_txt a{
    color: #004f9d;
    text-decoration: underline;
    font-weight: bold
}
.agent-agents .overlay{
    padding-left: 0;
    background: rgba(50,50,50,.7);
}
.agent-agents button{
    padding-left: 0;
    outline: none;
    line-height: 1;
    font-weight: bold;
    font-size: 18px;
    padding: 18px 0;
    width: 250px;
    padding: 18px 0;
}
.agent-agents button i{
    padding-left: 10px;
}
.agent-agents button[name="ng"]{
    background: #bbb;
    margin: 0 20px 0 0;
    display: inline-block;
    float: none;
}
.agent-agents button[name="ng"]:hover{
    background: #004f9d;
    color: white;
}
.agent-agents .bottom_btn #talent_submit[name="ok"]{
    padding: 18px 0;
    margin: 0;
    float: none;
}
.agent-agents .bottom_btn #talent_submit[name="ok"]:hover{
    font-size: 17px;
    margin-bottom: 6px;
}

.spacer {
    height: 20px;
}
/* 繝ｪ繧ｯ繧ｨ繧ｹ繝亥ｯｾ蠢� */
.bottom_btn_request {
    text-align: center;
    margin-bottom: 50px;
}
.bottom_btn_request a {
    display: inline-block;
    padding: 20px 20px;
    margin: 0 20px;
    width: 200px;
    background: #bbb;
    color: #fff;
}
.bottom_btn_request .request{
    background: #004f9d;
}
.bottom_btn_request .rejection{
    background: #bbb;
}
.bottom_btn_request .approval{
    background: #cc0c2f;
}
.topleft_btn_request {
    text-align: center;
}
.topleft_btn_request .request{
    background: #004f9d;
}
.topleft_btn_request .approved{
    background: #5380ad;
}
.topleft_btn_request .requested{
    background: #bbb;
}
.topleft_btn_request a, .topleft_btn_request span {
    padding: 12px 20px;
    margin: 0 20px;
    background: #bbb;
    color: #fff;
    display: inline-block;
    width: 123px;
}

.agent_head_logo {
    width: 80px;
}
.mr-1 {
    margin-right: calc(1rem * 0.5);
}
.my-1 {
    margin-top: calc(1rem * 0.5);
    margin-bottom: calc(1rem * 0.5);
}
.nowrap {
    white-space:nowrap;
}
.select-disabled {
    pointer-events:none;
    background:none;
}
.talent_age_sex {
    position: relative;
}
.unread_alliance_mes {
    height: 15px;
    width: 15px;
    background-color: red;
    border-radius: 100%;
    position: absolute;
    top: -3px;
    right: -3px;
}

.justify-center {
    display: flex;
    justify-content: center;
}
.justify-between {
    display: flex;
    justify-content: space-between;
}
.align-item-center {
    display: flex;
    align-items: center;
}

li.username span {
    display: block;
    border-radius: 50%;
    line-height: 40px;
    width: 40px;
    height: 40px;
    background: #aaa;
    color: #fff;
    font-size: 18px;
    text-align: center;
    margin: 17px 15px 0 0;
}
.top-bar-section {
    width: 280px;
}
.tabs {
    background-color: #fff;
    position: fixed;
    top: 78px;
}
.tab_item {
    width: 50%;
    height: 40px;
    border-bottom: 3px solid #002c61;
    background-color: #f5f5f5;
    line-height: 40px;
    font-size: 16px;
    text-align: center;
    color: #565656;
    display: block;
    float: left;
    text-align: center;
    font-weight: bold;
    transition: all 0.2s ease;
}
/* .tab_item:hover {
    opacity: 0.75;
} */
input[name="tab_item"] {
    display: none;
}
.tab_content {
    display: none;
    overflow: hidden;
    clear: both;
}
#cms:checked ~ #cms_content,
#mp:checked ~ #mp_content {
    display: block;
}
.tabs input:checked + .tab_item {
    background-color: #002c61;
    color: #fff;
}
input[type="checkbox"]+label, input[type="radio"]+label {
    margin: 0;
    display: block;
}
#actions-sidebar {
    width: 200px;
}

li.username span {
    display: block;
    border-radius: 50%;
    line-height: 40px;
    width: 40px;
    height: 40px;
    background: #aaa;
    color: #fff;
    font-size: 18px;
    text-align: center;
    margin: 17px 15px 0 12px;
}
.top-bar-section {
    width: 285px;
}
.tabs {
    background-color: #002c61;
    position: fixed;
    top: 78px;
}
.tab_item {
    width: 50%;
    height: 40px;
    background-color: #D9E5FF;
    line-height: 40px;
    font-size: 16px;
    text-align: center;
    color: #565656;
    display: block;
    float: left;
    text-align: center;
    font-weight: bold;
}
/* .tab_item:hover {
    opacity: 0.75;
} */
input[name="tab_item"] {
    display: none;
}
.tab_content {
    display: none;
    overflow: hidden;
    clear: both;
}
#cms:checked ~ #cms_content,
#mp:checked ~ #mp_content {
    display: block;
}
.tabs input:checked + .tab_item {
    background-color: #002c61;
    color: #fff;
    position: relative;
}
/* .tabs input:checked + .tab_item:after {
    content: "";
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 10px solid #cc0c2f;
    bottom: -10px;
    left: 40px;
    position: absolute;
    z-index: 99;
} */
/* .tabs input:checked + .tab_item:hover {
    opacity: 1;
} */
input[type="checkbox"]+label, input[type="radio"]+label {
    margin: 0;
    display: block;
}
#actions-sidebar {
    width: 200px;
}
.side-nav {
    overflow: hidden;
}
/* 左メニューのメッセージ未読の赤丸表示 */
.wrap_menu_mes {
    position: relative;
}
.menu_mes {
    height: 15px;
    width: 15px;
    background-color: red;
    border-radius: 100%;
    position: absolute;
    top: 0px;
    left: 20px;
}