@charset "UTF-8";
@font-face { font-family: "Noto Sans JP"; font-style: "normal"; font-weight: 400; src: url("../font/NotoSansCJKjp-Regular.otf") format("opentype"), url("../font/NotoSansCJKjp-Regular.woff") format("woff"); font-display: swap; }
@font-face { font-family: "Noto Sans JP"; font-style: "normal"; font-weight: 500; src: url("../font/NotoSansCJKjp-Medium.otf") format("opentype"), url("../font/NotoSansCJKjp-Medium.woff") format("woff"); font-display: swap; }
@font-face { font-family: "Noto Sans JP"; font-style: "normal"; font-weight: 700; src: url("../font/NotoSansCJKjp-Bold.otf") format("opentype"), url("../font/NotoSansCJKjp-Bold.woff") format("woff"); font-display: swap; }
/* =============================================================================
#
# INFORMATION
#
# FileName:	common.css
# Created:	2017-1-15
# UpdatedBy:2017-1-30
#
============================================================================= */
/* =============================================================================

 Base

============================================================================= */
/*! normalize.css v5.0.0 | MIT License | github.com/necolas/normalize.css */
/**
 * 1. Change the default font family in all browsers (opinionated).
 * 2. Correct the line height in all browsers.
 * 3. Prevent adjustments of font size after orientation changes in
 *    IE on Windows Phone and in iOS.
 */
/* Document
   ========================================================================== */
html {
    font-family: sans-serif;
    /* 1 */
    line-height: 1.15;
    /* 3 */

    -webkit-text-size-adjust: 100%;
    /* 2 */
    -ms-text-size-adjust: 100%;
    /* 3 */
}

/* Sections
   ========================================================================== */
/**
 * Remove the margin in all browsers (opinionated).
 */
body {
    margin: 0;
}

/**
 * Add the correct display in IE 9-.
 */
article, aside, footer, header, nav, section {
    display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
    margin: 0.67em 0;
    font-size: 2em;
}

/* Grouping content
   ========================================================================== */
/**
 * Add the correct display in IE 9-.
 * 1. Add the correct display in IE.
 */
figcaption, figure, main {
    /* 1 */
    display: block;
}

/**
 * Add the correct margin in IE 8.
 */
figure {
    margin: 1em 40px;
}

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
    /* 1 */
    overflow: visible;
    box-sizing: content-box;
    /* 1 */
    height: 0;
    /* 2 */
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
    /* 1 */
    font-size: 1em;
    font-family: monospace, monospace;
    /* 2 */
}

/* Text-level semantics
   ========================================================================== */
/**
 * 1. Remove the gray background on active links in IE 10.
 * 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
 */
a {
    background-color: transparent;
    /* 1 */

    -webkit-text-decoration-skip: objects;
    /* 2 */
}

/**
 * Remove the outline on focused links when they are also active or hovered
 * in all browsers (opinionated).
 */
a:active, a:hover {
    outline-width: 0;
}

/**
 * 1. Remove the bottom border in Firefox 39-.
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
    border-bottom: none;
    /* 1 */
    text-decoration: underline;
    /* 2 */
    text-decoration: underline dotted;
    /* 2 */
}

/**
 * Prevent the duplicate application of `bolder` by the next rule in Safari 6.
 */
b, strong {
    font-weight: inherit;
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b, strong {
    font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code, kbd, samp {
    /* 1 */
    font-size: 1em;
    font-family: monospace, monospace;
    /* 2 */
}

/**
 * Add the correct font style in Android 4.3-.
 */
dfn {
    font-style: italic;
}

/**
 * Add the correct background and color in IE 9-.
 */
mark {
    background-color: #ff0;
    color: #000;
}

/**
 * Add the correct font size in all browsers.
 */
small {
    font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub, sup {
    position: relative;
    vertical-align: baseline;
    font-size: 75%;
    line-height: 0;
}

sub {
    bottom: -0.25em;
}

sup {
    top: -0.5em;
}

/* Embedded content
   ========================================================================== */
/**
 * Add the correct display in IE 9-.
 */
audio, video {
    display: inline-block;
}

/**
 * Add the correct display in iOS 4-7.
 */
audio:not([controls]) {
    display: none;
    height: 0;
}

/**
 * Remove the border on images inside links in IE 10-.
 */
img {
    border-style: none;
}

/**
 * Hide the overflow in IE.
 */
svg:not(:root) {
    overflow: hidden;
}

/* Forms
   ========================================================================== */
/**
 * 1. Change the font styles in all browsers (opinionated).
 * 2. Remove the margin in Firefox and Safari.
 */
button, input, optgroup, select, textarea {
    /* 1 */
    margin: 0;
    /* 1 */
    font-size: 100%;
    font-family: sans-serif;
    /* 1 */
    line-height: 1.15;
    /* 2 */
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button, input {
    /* 1 */
    overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button, select {
    /* 1 */
    text-transform: none;
}

/**
 * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
 *    controls in Android 4.
 * 2. Correct the inability to style clickable types in iOS and Safari.
 */
button, html [type="button"], [type="reset"], [type="submit"] {
    -webkit-appearance: button;
    /* 2 */
}

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner {
    padding: 0;
    border-style: none;
}

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring {
    outline: 1px dotted ButtonText;
}

/**
 * Change the border, margin, and padding in all browsers (opinionated).
 */
fieldset {
    margin: 0 2px;
    padding: 0.35em 0.625em 0.75em;
    border: 1px solid #c0c0c0;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */
legend {
    /* 2 */
    display: table;
    box-sizing: border-box;
    /* 1 */
    padding: 0;
    /* 1 */
    max-width: 100%;
    /* 1 */
    color: inherit;
    /* 3 */
    white-space: normal;
    /* 1 */
}

/**
 * 1. Add the correct display in IE 9-.
 * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
    display: inline-block;
    /* 1 */
    vertical-align: baseline;
    /* 2 */
}

/**
 * Remove the default vertical scrollbar in IE.
 */
textarea {
    overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10-.
 * 2. Remove the padding in IE 10-.
 */
[type="checkbox"], [type="radio"] {
    box-sizing: border-box;
    /* 1 */
    padding: 0;
    /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button {
    height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type="search"] {
    /* 1 */
    outline-offset: -2px;

    -webkit-appearance: textfield;
    /* 2 */
}

/**
 * Remove the inner padding and cancel buttons in Chrome and Safari on macOS.
 */
[type="search"]::-webkit-search-cancel-button, [type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
    /* 1 */
    font: inherit;

    -webkit-appearance: button;
    /* 2 */
}

/* Interactive
   ========================================================================== */
/*
 * Add the correct display in IE 9-.
 * 1. Add the correct display in Edge, IE, and Firefox.
 */
details, menu {
    display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
    display: list-item;
}

/* Scripting
   ========================================================================== */
/**
 * Add the correct display in IE 9-.
 */
canvas {
    display: inline-block;
}

/**
 * Add the correct display in IE.
 */
template {
    display: none;
}

/* Hidden
   ========================================================================== */
/**
 * Add the correct display in IE 10-.
 */
[hidden] {
    display: none;
}

/* =============================================================================
 Default
============================================================================= */
/* Html,Body
------------------------------------------ */
html {
    font-size: 62.5%;
}

body {
    margin: 0;
    padding: 0;
    background-color: #e7e9e9;
    color: #383838;
    letter-spacing: 0.04em;
    font-size: 1.4em;
    font-family: Meiryo, "メイリオ", -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", YuGothic, "游ゴシック", sans-serif;
}

/* Link
------------------------------------------ */
a {
    color: inherit;
}

a:link {
    color: #0f5a84;
    text-decoration: none;
}

a:visited {
    color: #0f5a84;
    text-decoration: none;
}

a:hover, a:active {
    color: #4a84a8;
    text-decoration: underline;
}

/* headline
------------------------------------------ */
h2 {
    font-weight: bold;
    font-size: 2.0rem;
}

h3 {
    font-weight: bold;
    font-size: 1.8rem;
}

/* paragraph
------------------------------------------ */
p {
    line-height: 1.33;
}

/* List
------------------------------------------ */
ul, ol {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

dl {
    margin: 0;
    line-height: 1.5;
}

dl dt {
    font-weight: bold;
}

dl dd {
    margin-left: 0;
}

/* img
------------------------------------------ */
img {
    vertical-align: bottom;
}

/* form
------------------------------------------ */
input[type=text], input[type=password] {
    height: 40px;
    border: 1px solid #909998;
    background-color: #f8f9f9;
    font-family: Meiryo, "メイリオ", -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", YuGothic, "游ゴシック", sans-serif;
}

input[type=text].is-error, input[type=password].is-error {
    border-color: #fc3601;
}

label.is-error {
    display: block;
    margin: 5px auto;
    padding: 5px 0 5px 23px;
    background: url("../images/icon_exclamation.png") left center no-repeat;
    background-size: 19px auto;
    color: #fc3601;
    font-weight: bold;
    font-size: 1.6rem;
}

/*jast 追加分
    ----------------------------------------------------------------------------------------------------*/
.serverErr {
    display: inherit;
}

.serverErr .errMsg {
    background:url("../images/icon_exclamation.png") no-repeat scroll left center / 19px auto;
    letter-spacing:-1px;
    margin: 5px auto;
    padding: 5px 0 5px 23px;
    background-size: 19px auto;
    color: #fc3601;
    font-weight: bold;
    font-size: 1.6rem;
    display: none;
}
/*----------------------------------------------------------------------------------------------------*/

/* mobile */
.mobile label.is-error {
    margin: 0 0 -5px;
    padding: 0.125em 0 0 18px;
    background-size: 14px auto;
    font-size: 1.2rem;
}

/*jast 追加分
    ----------------------------------------------------------------------------------------------------*/
.mobile .serverErr .errMsg {
    margin: 0 0 -5px;
    padding: 0.125em 0 0 30px;
    background-size: 14px auto;
    font-size: 1.2rem;
}
/*----------------------------------------------------------------------------------------------------*/


/* =============================================================================

 Layout

============================================================================= */
/* =============================================================================
 Header
============================================================================= */
#header {
    position: relative;
    z-index: 10;
    background-color: #fff;
}

#header.is-extend {
    border-bottom: 1px solid #d1d3d3;
}

.header-utility {
    padding: 4px 0;
    background: #000;
}

.header-title {
    display: inline-block;
    margin: 4px auto 3px;
    color: #fff;
    font-size: 1.2rem;
}

.header-links {
    margin: 0 auto;
    font-size: 1.2rem;
}

.header-links > li {
    display: inline-block;
    margin-left: 18px;
}

.header-links > li:first-child {
    margin-left: 0;
}

.header-logo {
    margin-top: 26px;
}

.header-logo img {
    vertical-align: bottom;
}
.header-logo img:first-child {
    width: 184px;
}
.header-logo .header-catch {
   width: 120px;
    margin-left: 8px;
}
.header-logo-woman .header-logo img {
    height: 61px;
    width: auto;
}

/* =============================================================================
 Navigation
============================================================================= */
#navigation {
    position: relative;
}

#navigation > ul {
    margin: 0 -1px;
}

.navigation-item {
    float: left;
    box-sizing: border-box;
    padding: 0 1px 0;
    width: 16.666667%;
}

.navigation-item > a {
    display: block;
    position: relative;
    padding: 11px 6px 17px;
    text-align: center;
    text-decoration: none;
    font-size: 1.6rem;
}

.navigation-item > a::after {
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background-color: #909998;
    content: "";
}

.navigation-item > a:link, .navigation-item > a:visited {
    color: #000;
}

.navigation-item > a:hover, .navigation-item > a:active {
    color: #ff6d00;
}

.navigation-item.is-current a {
    color: #ff6d00 !important;
}

.navigation-item:nth-child(1):hover ~ .navigation-bar {
    left: 0 !important;
}

.navigation-item:nth-child(1).is-current ~ .navigation-bar {
    left: 0;
}

.navigation-item:nth-child(2):hover ~ .navigation-bar {
    left: 16.666% !important;
}

.navigation-item:nth-child(2).is-current ~ .navigation-bar {
    left: 16.666%;
}

.navigation-item:nth-child(3):hover ~ .navigation-bar {
    left: 33.3333% !important;
}

.navigation-item:nth-child(3).is-current ~ .navigation-bar {
    left: 33.3333%;
}

.navigation-item:nth-child(4):hover ~ .navigation-bar {
    left: 50% !important;
}

.navigation-item:nth-child(4).is-current ~ .navigation-bar {
    left: 50%;
}

.navigation-item:nth-child(5):hover ~ .navigation-bar {
    left: 66.6666% !important;
}

.navigation-item:nth-child(5).is-current ~ .navigation-bar {
    left: 66.6666%;
}

.navigation-item:nth-child(6):hover ~ .navigation-bar {
    left: 83.3333% !important;
}

.navigation-item:nth-child(6).is-current ~ .navigation-bar {
    left: 83.3333%;
}

.navigation-bar {
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    box-sizing: border-box;
    width: 16.6666%;
    height: 4px;
    border-right: 1px solid #fff;
    border-left: 1px solid #fff;
    background-color: #ff6d00;
    -webkit-transition: all 0.5s ease-out;
    transition: all 0.5s ease-out;
}

.navigation-bar::after {
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -8px;
    width: 0;
    height: 0;
    border-width: 6px 6px 0 6px;
    border-style: solid;
    border-color: #ff6d00 transparent transparent transparent;
    content: "";
}

.navigation-bar.is-hidden {
    display: none;
}

/* =============================================================================
 navigation-simplicity
============================================================================= */
.navigation-simplicity {
    background-color: #909998;
    text-align: center;
}

.navigation-simplicity li {
    padding: 35px 30px;
}

/* =============================================================================
 Navigation Mobile
============================================================================= */
#navigation-mobile {
    display: none;
}

.navigation-mobile-main > ul {
    display: -webkit-box;
    display: flex;
    margin: 0 -1px;

    -webkit-box-pack: justify;
    flex-wrap: nowrap;
    justify-content: space-between;
}

.navigation-mobile-main-item {
    display: -webkit-box;
    display: flex;
    position: relative;
    box-sizing: border-box;
    margin: 0;
    width: 33.333333%;
    border: 1px solid #a6b0af;
    border-left: none;

    align-items: center;
    -webkit-box-align: center;
}

.navigation-mobile-main-item:last-child {
    border-right: none;
}

.navigation-mobile-main-item.is-current a {
    color: #ff6d00 !important;
}

.navigation-mobile-main-item.is-current a::after {
    background-color: #ff6d00;
}

.navigation-mobile-main-item.is-current a:hover, .navigation-mobile-main-item.is-current a:active {
    color: #ff6d00;
}

.navigation-mobile-main-item a {
    display: block;
    position: static;
    padding: 8px 4px 9px;
    width: 100%;
    text-align: center;
    text-decoration: none;
    font-size: 1.2rem;
    line-height: 26px;
}

.navigation-mobile-main-item a::after {
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background-color: #909998;
    content: "";
}

.navigation-mobile-main-item a:link, .navigation-mobile-main-item a:visited {
    color: #000;
}

.navigation-mobile-main-item a:hover, .navigation-mobile-main-item a:active {
    color: #ff6d00;
}

.navigation-mobile-scroller {
    position: absolute;
    z-index: 0;
    overflow-x: hidden;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
    width: 100%;
    height: 100%;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

.navigation-mobile-sub {
    z-index: 0;
}

.navigation-mobile-sub-container {
    position: fixed;
    top: 86px;
    right: 0;
    bottom: 0;
    overflow: hidden;
    width: 60px;
    background-color: #e8e6e6;
    -webkit-transition: width 0.3s, -webkit-transform 0.3s;
    transition: width 0.3s, -webkit-transform 0.3s;
    transition: transform 0.3s, width 0.3s;
    transition: transform 0.3s, width 0.3s, -webkit-transform 0.3s;
    -webkit-transform: translateX(60px);
    transform: translateX(60px);
}

.navigation-mobile-sub-container.is-open {
    width: 100vw;
    -webkit-transform: translateX(0);
    transform: translateX(0);
}

.navigation-mobile-sub-primary {
    padding: 10px 10px 12px;
    background-color: #e8e6e6;
}

.navigation-mobile-sub-primary::before {
    display: block;
    position: fixed;
    top: 0;
    right: 0;
    z-index: 101;
    width: 52px;
    height: 1px;
    background-color: #e8e6e6;
    content: "";
}

.navigation-mobile-sub-primary::after {
    display: block;
    position: fixed;
    top: 0;
    right: 0;
    z-index: 100;
    width: 100%;
    height: 1px;
    background-color: #a6b0af;
    content: "";
}

.navigation-mobile-sub-primary ul {
    margin: 0 -4px -10px;
}

.navigation-mobile-sub-primary ul::after {
    display: block;
    clear: both;
    content: "";
}

.navigation-mobile-sub-primary-item, .navigation-mobile-sub-primary-item-lg, .navigation-mobile-sub-primary-item-xl {
    position: relative;
    float: left;
    box-sizing: border-box;
    margin: 0 0 10px;
    padding: 0 4px;
    width: 33.3333%;
}

.navigation-mobile-sub-primary-item > a, .navigation-mobile-sub-primary-item-lg > a, .navigation-mobile-sub-primary-item-xl > a {
    min-width: 0;
}

.navigation-mobile-sub-primary-item-lg {
    width: 50%;
}

.navigation-mobile-sub-primary-item-xl {
    width: 66.6666%;
}

.navigation-mobile-sub-secondary, .navigation-mobile-sub-tertiary {
    padding: 10px;
}

.navigation-mobile-sub-secondary > ul, .navigation-mobile-sub-tertiary > ul {
    margin: 0 0 10px;
    border: 1px solid #adaeae;
}

.navigation-mobile-sub-secondary > ul:last-child, .navigation-mobile-sub-tertiary > ul:last-child {
    margin-bottom: 0;
}

.navigation-mobile-sub-secondary li, .navigation-mobile-sub-tertiary li {
    border-top: 1px solid #adaeae;
}

.navigation-mobile-sub-secondary li:first-child, .navigation-mobile-sub-tertiary li:first-child {
    border-top: none;
}

.navigation-mobile-sub-secondary a, .navigation-mobile-sub-tertiary a {
    display: block;
    position: relative;
    padding: 14px 14px 14px 12px;
    background-color: #fff;
    color: #333;
}

.navigation-mobile-sub-secondary a:link, .navigation-mobile-sub-secondary a:visited, .navigation-mobile-sub-tertiary a:link, .navigation-mobile-sub-tertiary a:visited {
    color: #333;
}

.navigation-mobile-sub-secondary a:hover, .navigation-mobile-sub-secondary a:active, .navigation-mobile-sub-tertiary a:hover, .navigation-mobile-sub-tertiary a:active {
    color: #333;
}

.navigation-mobile-sub-secondary a::after, .navigation-mobile-sub-tertiary a::after {
    position: absolute;
    top: 50%;
    right: 9px;
    margin-top: -3px;
    width: 6px;
    height: 6px;
    border: 0;
    border-top: 2px solid #ff6d00;
    border-right: 2px solid #ff6d00;
    content: "";
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.navigation-mobile-sub-secondary {
    background-color: #fed88e;
}

.navigation-mobile-sub-secondary a {
    padding-top: 15px;
    padding-bottom: 15px;
    font-weight: bold;
}

.navigation-mobile-sub-tertiary {
    background-color: #e8e6e6;
}

.navigation-mobile-sub-tertiary a {
    font-size: 1.2rem;
}

.navigation-mobile-sub-logout .icon {
    vertical-align: -4px;
}

.navigation-mobile-sub-launcher {
    position: absolute;
    top: 30px;
    right: 0;
    width: 53px;
}

.navigation-mobile-sub-launcher.is-open {
    background-color: #e8e6e6;
}

.navigation-mobile-sub-launcher.is-open > a::before {
    top: 45%;
    width: 28px;
    height: 3px;
    box-shadow: none;
    -webkit-transform: translateX(-50%) rotate(45deg);
    transform: translateX(-50%) rotate(45deg);
}

.navigation-mobile-sub-launcher.is-open > a::after {
    display: block;
    position: absolute;
    top: 45%;
    left: 50%;
    width: 28px;
    height: 3px;
    background: #ff6d00;
    content: "";
    -webkit-transform: translateX(-50%) rotate(135deg);
    transform: translateX(-50%) rotate(135deg);
}

.navigation-mobile-sub-launcher > a {
    display: block;
    box-sizing: border-box;
    width: 53px;
    height: 56px;
    border-left: 1px solid #a6b0af;
    cursor: pointer;
}

.navigation-mobile-sub-launcher > a::before {
    position: absolute;
    top: 34px;
    left: 50%;
    width: 22px;
    height: 3px;
    background: #ff6d00;
    box-shadow: 0 5px white, 0 -8px #ff6d00, 0 -13px white, 0 -16px #ff6d00;
    content: "";
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.navigation-mobile-sub-launcher span {
    display: block;
    overflow: hidden;
    width: 0;
    height: 0;
}

/* =============================================================================
 Contents
============================================================================= */
/* Base layout
------------------------------------------ */
#page {
    min-width: 1140px;
}

#contents {
    margin: 25px auto 45px;
}

.l-constrained {
    margin: 0 auto;
    padding-right: 20px;
    padding-left: 20px;
    width: 1100px;
}

.l-main {
    float: left;
    width: 68.636364%;
}

.l-sub {
    float: right;
    width: 30%;
}

/* =============================================================================
 Footer
============================================================================= */
#footer {
    position: relative;
}

/* Footer Links
------------------------------------------ */
.footer-links {
    padding: 40px 0;
}

.footer-links ul {
    font-size: 1.2rem;
    line-height: 1.5;
}

.footer-links hr {
    clear: both;
    margin: 22px 0 25px;
    border: none;
    border-top: 1px solid #000;
}

.footer-links-title {
    margin: 0 0 25px;
    font-size: 1.6rem;
}

.footer-links-area {
    border-spacing: 0;
    border-collapse: collapse;
    font-size: 1.2rem;
}

.footer-links-area th {
    padding-right: 12px;
    text-align: left;
    white-space: nowrap;
    font-weight: normal;
}

.footer-links-area td {
    color: #0f5a84;
}

.footer-links-resources p {
    margin-top: -10px;
}

.footer-links-resources ul {
    line-height: 1;
}

.footer-links-relation ul {
    margin-top: -10px;
    line-height: 1;
}

.footer-links-relation li {
    margin-top: 10px;
}

/* Footer Pagetop
------------------------------------------ */
.footer-pagetop {
    position: relative;
    float: right;
    margin: 0 50px 0 0;
}

.footer-pagetop a {
    display: block;
    position: fixed;
    bottom: 0;
    z-index: 1000;
    width: 50px;
    height: 40px;
    background-color: #ff6d00;
    color: #ff6d00;
}

.footer-pagetop a:link, .footer-pagetop a:visited {
    color: #ff6d00;
    text-decoration: none;
}

.footer-pagetop a:hover, .footer-pagetop a:active, .footer-pagetop a:focus {
    color: #ff6d00;
    text-decoration: none;
}

.footer-pagetop a:hover, .footer-pagetop a:visited {
    opacity: 0.66;
}

.footer-pagetop a::after {
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -3px 0 0 -5px;
    width: 10px;
    height: 10px;
    border: 0;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
    content: "";
    -webkit-transform: rotate(315deg);
    transform: rotate(315deg);
}

/* Footer Utility
------------------------------------------ */
.footer-utility {
    overflow: hidden;
    box-sizing: border-box;
    height: 100px;
    background-color: #fff;
}

/* Footer Logos
------------------------------------------ */
.footer-logos {
    float: left;
    margin-right: 15px;
    padding: 20px 0;
}

.footer-logos li {
    margin-right: 25px;
}

.footer-logos img {
    max-width: 100%;
    height: auto;
    vertical-align: middle;
}

.footer-logo-gakujo {
    width: 120px;
}

/* Footer Policy
------------------------------------------ */
.footer-policy {
    margin: 30px 0;
}

.footer-policy li {
    margin: 10px 0;
}

/* Footer Copyright
------------------------------------------ */
.footer-copyright {
    position: relative;
    height: 100px;
}

.footer-copyright > p {
    position: absolute;
    top: 50%;
    right: 0;
    margin: 0;
    font-weight: bold;
    font-size: 1.2rem;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

/* =============================================================================
 Grid System
============================================================================= */
/* Container
------------------------------------------ */
.l-container {
    margin: 0 -6px;
    padding: 0;
}

.l-container.l-gutter-0 {
    margin: 0 0;
}

.l-container.l-gutter-0 [class^="l-col"] {
    padding-right: 0;
    padding-left: 0;
}

.l-container.l-gutter-6 {
    margin: 0 -3px;
}

.l-container.l-gutter-6 [class^="l-col"] {
    padding-right: 3px;
    padding-left: 3px;
}

.l-container.l-gutter-8 {
    margin: 0 -4px 0 -4px;
}

.l-container.l-gutter-8 [class^="l-col"] {
    padding-right: 4px;
    padding-left: 4px;
}

.l-container.l-gutter-9 {
    margin: 0 -4px 0 -5px;
}

.l-container.l-gutter-9 [class^="l-col"] {
    padding-right: 5px;
    padding-left: 4px;
}

.l-container.l-gutter-20 {
    margin: 0 -10px;
}

.l-container.l-gutter-20 [class^="l-col"] {
    padding-right: 10px;
    padding-left: 10px;
}

.l-container.l-gutter-30 {
    margin: 0 -15px;
}

.l-container.l-gutter-30 [class^="l-col"] {
    padding-right: 15px;
    padding-left: 15px;
}

/* Row, Group
------------------------------------------ */
/* Column
------------------------------------------ */
.l-col-1 {
    width: 8.333333%;
}

.l-col-2 {
    width: 16.666667%;
}

.l-col-3 {
    width: 25%;
}

.l-col-4 {
    width: 33.333333%;
}

.l-col-5 {
    width: 41.666667%;
}

.l-col-6 {
    width: 50%;
}

.l-col-7 {
    width: 58.333333%;
}

.l-col-8 {
    width: 66.666667%;
}

.l-col-9 {
    width: 75%;
}

.l-col-10 {
    width: 83.333333%;
}

.l-col-11 {
    width: 91.666667%;
}

.l-col-12 {
    width: 100%;
}

.l-col-custom-sm {
    width: 26.181818%;
}

.l-col-custom {
    width: 33.818182%;
}

.l-col-custom-lg {
    width: 40%;
}

.l-col-custom-xl {
    width: 60%;
}

.l-col-1, .l-col-2, .l-col-3, .l-col-4, .l-col-5, .l-col-6, .l-col-7, .l-col-8, .l-col-9, .l-col-10, .l-col-11, .l-col-12, .l-col-custom-sm, .l-col-custom, .l-col-custom-lg, .l-col-custom-xl {
    float: left;
    box-sizing: border-box;
    padding: 0 6px;
}

/* push pull
------------------------------------------ */
.l竏恥ush {
    float: right;
}

.l-pull {
    float: left;
}

.l-push-2 {
    margin-left: 16.666667%;
}

.l-push-1 {
    margin-left: 8.333333%;
}

/* Utility
------------------------------------------ */
.l-center {
    float: none;
    margin-right: auto;
    margin-left: auto;
}

.l-left {
    float: left;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
}

.l-right {
    float: right;
}

/* =============================================================================

 Responsive

============================================================================= */
/* Responsive
 * bodyにl-responsiveを付加する
------------------------------------------ */
.l-responsive .l-constrained {
    max-width: 1100px;
    width: auto;
}

/* =============================================================================

 Module

============================================================================= */
/* =============================================================================
 Link
============================================================================= */
.link {
    font-weight: bold;
}

/* inverse 背景色あり*/
.link-inverse {
    font-weight: bold;
}

.link-inverse:link, .link-inverse:visited {
    color: #fff;
}

.link-inverse:hover, .link-inverse:active {
    color: #fff;
}

/* default 通常 */
.link-default:link, .link-default:visited {
    color: #0f5a84;
    text-decoration: none;
}

.link-default:hover, .link-default:active {
    color: #4a84a8;
    text-decoration: underline;
}

/* arrow 矢印付き */
.link-arrow, .link-arrow-square {
    display: inline-block;
    font-weight: bold;
}

.link-arrow-square {
    vertical-align: middle;
}

/* alpha hoverで透過 */
.link-alpha:hover, .link-alpha:active {
    text-decoration: none;
    opacity: 0.66;
}

/* block クラスhover-xxでhover時の挙動を変更 */
.link-block {
    display: block;
}

.link-block:hover, .link-block:active {
    text-decoration: none;
}

.link-block:hover .hover-alpha, .link-block:active .hover-alpha {
    opacity: 0.66;
}

.link-block:hover .hover-underline, .link-block:active .hover-underline {
    text-decoration: underline;
}

/* alert 警告色 */
.link-alert {
    color: #fc3601;
}

.link-alert:link, .link-alert:visited {
    color: #fc3601;
}

.link-alert:hover, .link-alert:active {
    color: #ff3a01;
}

/* =============================================================================
 Button
============================================================================= */
.button {
    display: inline-block;
    position: relative;
    box-sizing: border-box;
    padding: 9px 14px;
    min-width: 195px;
    border: 3px solid #a2c7e5;
    background-color: #fff;
    box-shadow: 1px 2px 0 rgba(110, 111, 111, 0.5);
    text-align: center;
    text-decoration: none;
    font-weight: bold;
    font-size: 1.8rem;
}

.button:link, .button:visited {
    color: #0f5a84;
}

.button:hover, .button:active {
    top: 2px;
    border: 3px solid #bbc1c0;
    box-shadow: none;
    color: #0f5a84;
    text-decoration: none;
}

.button::after {
    position: absolute;
    top: 50%;
    right: 9px;
    margin-top: -4px;
    width: 5px;
    height: 5px;
    border: 0;
    border-top: 3px solid #0f5a84;
    border-right: 3px solid #0f5a84;
    content: "";
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

/* Button Sizes
------------------------------------------ */
.button-xs {
    padding: 5px 3px 5px 5px;
    min-width: 102px;
}

.button-sm {
    min-width: 160px;
}

.button-md {
    min-width: 195px;
}

.button-lg {
    min-width: 240px;
}

.button-xl {
    min-width: 276px;
}

.button-xxl {
    min-width: 360px;
    height: 60px;
    font-size: 2.8rem;
}

.button-xxl::after {
    position: absolute;
    top: 50%;
    right: 9px;
    margin-top: -4px;
    width: 8px;
    height: 8px;
    border: 0;
    border-top: 5px solid #fff;
    border-right: 5px solid #fff;
    content: "";
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.button-100 {
    min-width: auto;
    width: 100%;
}

/* Button Utility
------------------------------------------ */
.button-block {
    display: block !important;
}

/* 矢印なし */
.button-simplicity {
    padding: 6px 8px;
}

.button-simplicity::after {
    display: none !important;
}

/* Button Variation
------------------------------------------ */
/* secondary */
.button-secondary {
    border: 3px solid #ff6d00;
    box-shadow: 1px 2px 0 rgba(110, 111, 111, 0.47);
    color: #ff6d00;
}

.button-secondary:link, .button-secondary:visited {
    color: #ff6d00;
}

.button-secondary:hover, .button-secondary:active {
    color: #ff6d00;
    text-decoration: none;
}

.button-secondary::after {
    border-top: 3px solid #ff6d00;
    border-right: 3px solid #ff6d00;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

/* tertiary */
.button-tertiary:link, .button-tertiary:visited {
    color: #7daac3;
}

.button-tertiary:hover, .button-tertiary:active {
    color: #7daac3;
    text-decoration: none;
}

.button-tertiary::after {
    border-top: 3px solid #7daac3;
    border-right: 3px solid #7daac3;
}

/* primary */
.button-primary, .button-primary-entry {
    border: 3px solid #ff6d00;
    background-color: #ff6d00;
    box-shadow: 1px 3px 0 #6e6f6f;
    color: #fff;
}

.button-primary:link, .button-primary:visited, .button-primary-entry:link, .button-primary-entry:visited, .button-primary-entry-lg:link, .button-primary-entry-lg:visited {
    color: #fff;
}

.button-primary:hover, .button-primary:active, .button-primary-entry:hover, .button-primary-entry:active, .button-primary-entry-lg:active {
    top: 3px;
    border: 3px solid #ff6d00;
    box-shadow: none;
    color: #fff;
    text-decoration: none;
}

.button-primary::after, .button-primary-entry::after {
    position: absolute;
    top: 50%;
    right: 9px;
    z-index: 10;
    margin-top: -4px;
    width: 5px;
    height: 5px;
    border: 0;
    border-top: 3px solid #fff;
    border-right: 3px solid #fff;
    content: "";
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

/* primary-entry */
.button-primary-entry {
    padding: 13px 14px;
    box-shadow: 1px 2px 0 0 rgba(110, 111, 111, 0.5);
    font-size: 1.6rem;
}

.button-primary-entry:hover, .button-primary-entry:active {
    top: 2px;
}

/* primary-entry-lg */
.button-primary-entry-lg {
    padding-top: 0;
    padding-bottom: 0;
    width: 100%;
    height: 70px;
    font-size: 36px;
    font-weight: 500;
    letter-spacing: 3px;
    line-height: 64px;
    background-color: #ff6d01;
    border: 2px solid #fff;
    border-radius: 10px;
}
.button-primary-entry-lg:hover {
    border: 2px solid #fff;
    top: 0;
}
.button-primary-entry-lg:hover::before {
  content: "";
  width: 100%;
  height: 100%;
  border-radius: 10px;
  background: rgb(255, 255, 255, 0.4);
  display: block;
  position: absolute;
  top: 0;
  left: 0;
}
.button-primary-entry-lg::after {
    position: absolute;
    top: 48%;
    right: 20px;
    margin-top: -10px;
    width: 30px;
    height: 30px;
    border: 0;
    background-image: url(../images/top/ttl_arrow.png);
    background-size: 50%;
    background-repeat: no-repeat;
    content: "";
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
}

.button-primary-entry-lg span {
    font-size: 12px;
    font-weight: 600;
    line-height: 1.5em;
    letter-spacing: 1px;
    display: inline-block;
    background-color: #fff;
    color: #383838;
    border-radius: 50%;
    position: relative;
    right: 15px;
    padding: 8px;
}

/* login */
.button-login {
    padding: 13px 14px;
    min-width: 140px;
    border: 3px solid #909998;
    background: #909998;
    box-shadow: 1px 2px 0 0 rgba(110, 111, 111, 0.5);
    font-size: 1.6rem;
}

.button-login:link, .button-login:visited {
    color: #fff;
}

.button-login:hover, .button-login:active {
    border: 3px solid #909998;
    color: #fff;
    text-decoration: none;
}

.button-login::after {
    border-top: 3px solid #fff;
    border-right: 3px solid #fff;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

/* favorite */
.button-favorite {
    overflow: hidden;
    height: 44px;
    border: 3px solid #6bb451;
    background-color: #6bb451;
    box-shadow: 1px 3px 0 #6e6f6f;
    font-weight: bold;
}

.button-favorite::after {
    display: none;
}

.button-favorite::before {
    display: inline-block;
    margin-right: 6px;
    width: 16px;
    height: 16px;
    background: url("../images/icon_heart_inverse.png") no-repeat;
    content: "";
}

.button-favorite:link, .button-favorite:visited {
    color: #fff;
}

.button-favorite:hover, .button-favorite:active {
    top: 0;
    border: 3px solid #6bb451;
    box-shadow: 1px 2px 0 rgba(110, 111, 111, 0.47);
    opacity: 0.6;
}

.button-favorite.is-checked {
    top: 2px;
    border: 3px solid #6bb451;
    background-color: #fff;
    box-shadow: none;
    color: #6bb451;
    text-decoration: none;
}

.button-favorite.is-checked::before {
    background: url("../images/icon_heart.png") no-repeat;
}

/* casual */
.button-casual {
    overflow: hidden;
    height: 44px;
    border: 3px solid #0E997C;
    background-color: #0E997C;
    box-shadow: 1px 3px 0 #6e6f6f;
    font-weight: bold;
    font-size: 15px;
    padding: 11px 0;
}

.button-casual::after {
    display: none;
}

.button-casual:link, .button-casual:visited {
    color: #fff;
}

.button-casual:hover, .button-casual:active {
    top: 0;
    border: 3px solid #0E997C;
    box-shadow: 1px 2px 0 rgba(110, 111, 111, 0.47);
    opacity: 0.6;
}

.offer-text {
    color: #0E997C;
    display: list-item;
    font-size: 12px;
    font-weight: bold;
    margin-bottom: 3px;
}

/* casual-like */
.button-casual-like {
    border: 3px solid #0E997C;
    background-color: #0E997C;
    box-shadow: 1px 3px 0 #6e6f6f;
    color: #fff;
    font-size: 1.4rem!important;
}

.button-casual-like:link, .button-casual-like:visited {
    color: #fff;
}

.button-casual-like:hover, .button-casual-like:active {
    top: 3px;
    border: 3px solid #0E997C;
    box-shadow: none;
    color: #fff;
    text-decoration: none;
}

.button-casual-like::after {
    position: absolute;
    top: 50%;
    right: 9px;
    z-index: 10;
    margin-top: -4px;
    width: 5px;
    height: 5px;
    border: 0;
    border-top: 3px solid #fff;
    border-right: 3px solid #fff;
    content: "";
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

/* outline */
.button-outline {
    border: 1px solid #ccc;
}

.button-photo-upload {
    box-sizing: border-box;
    padding: 4px 5px 3px;
    min-width: 166px;
    line-height: 1;
}

.button-photo-select {
    box-sizing: border-box;
    padding: 4px 5px 3px;
    min-width: 186px;
    line-height: 1;
}

.button-photo-delete {
    border:1px solid #909998;
    color: #909998;
    padding: 4px 5px 3px;
    min-width: 170px;
    line-height: 1;
}

.button-photo-delete:hover {
    border:1px solid #909998;
    color:#909998;
    border-width: 1px;
}

.button-photo-delete:disabled {
    box-shadow: none;
    text-decoration: none;
    top: 2px;
}

/* down, up */
.button-down::after, .button-up::after {
    position: absolute;
    top: 50%;
    right: 9px;
    margin-top: -4px;
    width: 5px;
    height: 5px;
    border: 0;
    border-top: 3px solid #0f5a84;
    border-right: 3px solid #0f5a84;
    content: "";
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
}

.button-up::after {
    right: 9px;
    margin-top: -4px;
    -webkit-transform: rotate(315deg);
    transform: rotate(315deg);
}

/* application */
.button-applications {
    display: inline-block;
    overflow: hidden;
    width: 100px;
    height: 65px;
    background: url("../images/btn_mypage.png") center no-repeat;
    background-color: #0f5a84;
    text-indent: 100%;
    white-space: nowrap;
}

.button-applications:hover, .button-applications:active {
    opacity: 0.66;
}

/* line */
.button-line {
    display: block;
    box-sizing: border-box;
    height: 40px;
    border: 2px solid #00C300;
    border-radius: 4px;
    background: url("../images/icon_line.png?202006121400") 4% 50% no-repeat;
    color: #00C300;
    text-align: center;
    line-height: 40px;
}

.button-line:link, .button-line:visited {
    color: #00C300;
}

.button-line:hover, .button-line.active {
    color: #00C300;
    text-decoration: none;
    opacity: 0.66;
}

/* twitter */
.button-twitter {
    display: block;
    box-sizing: border-box;
    height: 40px;
    border: 2px solid #55acee;
    border-radius: 4px;
    background: url("../images/icon_twitter.png") 4% 50% no-repeat;
    color: #55acee;
    text-align: left;
    line-height: 40px;
    padding-left: 20%;
}

.button-twitter:link, .button-twitter:visited {
    color: #55acee;
}

.button-twitter:hover, .button-twitter.active {
    color: #55acee;
    text-decoration: none;
    opacity: 0.66;
}

.button-facebook:link, .button-facebook:visited {
    color: #3b5999;
}

/* facebook */
.button-facebook {
    display: block;
    box-sizing: border-box;
    height: 40px;
    border: 2px solid #3b5999;
    border-radius: 4px;
    background: url("../images/icon_facebook.png") 4% 50% no-repeat;
    color: #3b5999;
    text-align: left;
    line-height: 40px;
    padding-left: 20%;
}

.button-facebook:link, .button-facebook:visited {
    color: #3b5999;
}

.button-facebook:hover, .button-facebook.active {
    color: #3b5999;
    text-decoration: none;
    opacity: 0.66;
}

/* sns account */

.button-login-facebook, .button-login-yahoo, .button-login-apple, .button-login-line {
    display: block;
    border: none;
    box-shadow: none;
    text-align: center;
    font-size: 2.0rem;
    display: block;
    margin :5px;
    box-shadow: 2px 3px 0 rgba(110, 111, 111, 0.47);
}

.button-login-line {
    background: url("../../common/images/Line_login_button.png") center no-repeat;
    width:180px;
    height:40px;
    background-size: contain;
}

.button-login-apple {
    background: url("../../common/images/btn_apple.png") center no-repeat;
    width:180px;
    height:40px;
    background-size: contain;
}

.button-login-facebook {
    background: url("../../common/images/Facebook_login_button.png") center no-repeat;
    width:180px;
    height:40px;
    background-size: contain;
}

.button-login-yahoo {
    background: url("../../common/images/YahooJAPANId_login_button.png") center no-repeat;
    width:180px;
    height:40px;
    background-size: contain;
}

.button-login-facebook:hover, .button-login-yahoo:hover, .button-login-apple:hover, .button-login-line:hover {
    top: 3px;
    border: none;
    box-shadow: none;
}

.button_1 {
    position: relative;
    box-sizing: border-box;
    min-width: 140px;
    text-align: center;
    text-decoration: none;
    font-weight: bold;
    font-size: 1.8rem;
}
.button-like-questionary {
    font-size: 14px;
    width: 210px;
    margin: 20px auto 0 auto;
}
/* Mobile Menu
------------------------------------------ */
.button-icon {
    display: block;
    overflow: hidden;
    box-sizing: border-box;
    padding: 36px 2px 4px;
    width: 100%;
    height: 72px;
    border-width: 2px;
    border-color: #ff6d00;
    background-color: #fff;
    background-position: 50% 20%;
    background-repeat: no-repeat;
    text-align: center;
    font-weight: bold;
    font-size: 1.2rem;

    align-items: center;
    -webkit-box-align: center;
}

.button-icon:link, .button-icon:visited {
    color: #ff6d00;
}

.button-icon:hover, .button-icon:active {
    color: #ff6d00;
    text-decoration: none;
}

.button-icon::after {
    display: none;
}

.button-icon > span {
    display: block;
    position: absolute;
    top: 80%;
    right: 0;
    left: 0;
    width: 100%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

.button-career {
    background-color: #ff6d00;
    background-image: url("../images/icon_profile_inverse.png");
    background-size: 25px auto;
}

.button-career:link, .button-career:visited {
    color: #fff;
}

.button-career:hover, .button-career:active {
    border-color: #ff6d00;
    color: #fff;
}

.button-setting {
    background-image: url("../images/icon_gear.png");
    background-size: 31px auto;
}

.button-favorites {
    background-image: url("../images/icon_heart02.png");
    background-size: 20px auto;
}

.button-scout {
    background-image: url("../images/icon_scout.png");
    background-position: 50% 25%;
    background-size: 30px auto;
}

.button-guide {
    background-image: url("../images/icon_guide.png");
    background-size: 25px auto;
}

.button-area {
    background-image: url("../images/icon_marker.png");
    background-size: 17px auto;
}

.button-job {
    background-image: url("../images/icon_briefcase.png");
    background-size: 26px auto;
}

.button-conditions {
    background-image: url("../images/icon_checkbox.png");
    background-size: 20px auto;
}

.button-content-add {
    display: block;
    padding: 9px;
    border: 1px dashed #333;
    text-align: center;
    font-weight: bold;
    font-size: 1.8rem;
}

.button-content-add::before {
    padding-right: 0.125em;
    color: #333;
    content: "+";
}

.button-content-add:hover, .button-content-add:active {
    text-decoration: none;
    opacity: 0.66;
}

.button-wide-horizontal-padding {
    padding: 10px 35px;
}

/* =============================================================================
 Label
============================================================================= */
/* triangle エリアリンクなどに使用 */
.label-triangle, .label-triangle-lg {
    display: block;
    position: relative;
    box-sizing: border-box;
    height: 64px;
    border: 2px solid #ff6d00;
    background-color: rgba(255, 255, 255, 0.6);
    color: #000 !important;
    text-align: center;
    font-weight: bold;
    font-size: 1.8rem;
    line-height: 64px;
}

.label-triangle::before, .label-triangle-lg::before {
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 0;
    border-width: 11px 11px 0 0;
    border-style: solid;
    border-color: #ff6d00 transparent transparent transparent;
    content: "";
}

.label-triangle-lg {
    height: 79px;
    background-color: #fff;
    box-shadow: 1px 3px 0 rgba(0, 0, 0, 0.23);
    line-height: 79px;
}

/* Help
------------------------------------------ */
.label-help {
    display: inline-block;
    position: relative;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background-color: #fff;
    color: #595959;
    vertical-align: middle;
    text-align: center;
    font-size: 1.8rem;
    line-height: 26px;
    cursor: pointer;
}

/* =============================================================================
 Tags
============================================================================= */
.tags {
    margin: 0 0 10px;
    letter-spacing: -0.4em;
}

.tags > li {
    display: inline-block;
    margin-right: 5px;
    padding: 2px 4px;
    border: 1px solid #909998;
    color: #909998;
    white-space: nowrap;
    letter-spacing: normal;
    font-size: 1.2rem;
    line-height: 1;
}

/* =============================================================================
 Badge
============================================================================= */
/* New
------------------------------------------ */
.badge-new::before {
    position: absolute;
    top: -5px;
    left: -5px;
    z-index: 10;
    width: 60px;
    height: 60px;
    background-color: #fc3202;
    color: #fff;
    content: "NEW";
    text-align: center;
    font-weight: bold;
    font-family: Helvetica, Arial, sans-serif;
    line-height: 60px;
}

/* Number
------------------------------------------ */
.badge-number, .badge-number-applications, .badge-number-navigation {
    display: inline-block;
    margin: 0 0 0 10px;
    padding: 0 4px;
    height: 25px;
    background: #fc3601;
    color: #fff;
    vertical-align: bottom;
    font-weight: bold;
    font-size: 1.6rem;
    line-height: 25px;
}

.badge-number-applications {
    position: absolute;
    top: -5px;
    right: -5px;
    z-index: 10;
    box-sizing: border-box;
    min-width: 24px;
    height: 24px;
    text-align: center;
    letter-spacing: 0;
    font-size: 1.4rem;
    line-height: 24px;
}

.badge-number-navigation {
    position: absolute;
    margin-top: -3px;
    margin-left: 8px;
    padding: 0 2px;
    min-width: 24px;
    height: 24px;
    text-align: center;
    letter-spacing: 0;
    font-size: 1.4rem;
    line-height: 24px;
}

/* Alert
------------------------------------------ */
.badge-alert {
    position: absolute;
    top: 2px;
    right: 3px;
    width: 25px;
    height: 25px;
    background: url("../images/icon_bell.png") center/16px auto no-repeat;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-animation: shake 1.3s ease 0.5s 3;
    animation: shake 1.3s ease 0.5s 3;
}

@-webkit-keyframes shake {
    10%, 90% {
        -webkit-transform: translate3d(-1px, 0, 0);
        transform: translate3d(-1px, 0, 0);
    }
    20%, 80% {
        -webkit-transform: translate3d(1px, 0, 0);
        transform: translate3d(1px, 0, 0);
    }
    30%, 50%, 70% {
        -webkit-transform: translate3d(-2px, 0, 0);
        transform: translate3d(-2px, 0, 0);
    }
    40%, 60% {
        -webkit-transform: translate3d(2px, 0, 0);
        transform: translate3d(2px, 0, 0);
    }
}

@keyframes shake {
    10%, 90% {
        -webkit-transform: translate3d(-1px, 0, 0);
        transform: translate3d(-1px, 0, 0);
    }
    20%, 80% {
        -webkit-transform: translate3d(1px, 0, 0);
        transform: translate3d(1px, 0, 0);
    }
    30%, 50%, 70% {
        -webkit-transform: translate3d(-2px, 0, 0);
        transform: translate3d(-2px, 0, 0);
    }
    40%, 60% {
        -webkit-transform: translate3d(2px, 0, 0);
        transform: translate3d(2px, 0, 0);
    }
}

/* =============================================================================
 Icon
============================================================================= */
.icon {
    display: inline-block;
}

/* Icon Sizes
------------------------------------------ */
.icon-lg {
    padding-left: 40px;
}

/* Icon Square
------------------------------------------ */
.icon-square {
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 40px;
    background-color: #ff6d00;
    background-position: center;
    background-size: 26px auto;
    background-repeat: no-repeat;
}

/* Icon arrow
------------------------------------------ */
.icon-arrow, .icon-arrow-inverse, .icon-arrow-alert, .icon-arrow-square, .icon-arrow-square-before {
    position: relative;
    padding-left: 9px;
    height: 14px;
    box-sizing:content-box;
}

.icon-arrow::after, .icon-arrow-inverse::after, .icon-arrow-alert::after, .icon-arrow-square::after, .icon-arrow-square-before::after {
    display: block;
    position: absolute;
    top: 50%;
    right: 0;
    margin-top: -2px;
    width: 6px;
    height: 6px;
    border: 0;
    border-top: 1px solid #0f5a84;
    border-right: 1px solid #0f5a84;
    content: "";
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.icon-arrow-square-skill::after {
    display: block;
    position: absolute;
    top: 30%;
    right: 0;
    margin-top: -2px;
    width: 6px;
    height: 6px;
    border: 0;
    border-top: 1px solid #131458;
    border-right: 1px solid #131458;
    content: "";
    -webkit-transform: rotate(45deg);
    transform: rotate(135deg);
}

.icon-arrow-square-skill-active::after {
    display: block;
    position: absolute;
    top: 30%;
    right: 0;
    margin-top: -2px;
    width: 6px;
    height: 6px;
    border: 0;
    border-top: 1px solid #131458;
    border-right: 1px solid #131458;
    content: "";
    -webkit-transform: rotate(45deg);
    transform: rotate(-45deg);
}

.icon-arrow.icon-lg, .icon-arrow-inverse.icon-lg, .icon-arrow-alert.icon-lg, .icon-arrow-square.icon-lg, .icon-arrow-square-before.icon-lg {
    padding-left: 9px;
}

.icon-arrow.icon-lg::after, .icon-arrow-inverse.icon-lg::after, .icon-arrow-alert.icon-lg::after, .icon-arrow-square.icon-lg::after, .icon-arrow-square-before.icon-lg::after {
    margin-top: -4px;
}

.icon-arrow.icon-sm, .icon-arrow-inverse.icon-sm, .icon-arrow-alert.icon-sm, .icon-arrow-square.icon-sm, .icon-arrow-square-before.icon-sm {
    padding-left: 0.75rem;
    height: 1rem;
}

.icon-arrow.icon-sm::after, .icon-arrow-inverse.icon-sm::after, .icon-arrow-alert.icon-sm::after, .icon-arrow-square.icon-sm::after, .icon-arrow-square-before.icon-sm::after {
    margin-top: 0;
    width: 5px;
    height: 5px;
    -webkit-transform: translateY(-50%) rotate(45deg);
    transform: translateY(-50%) rotate(45deg);
}

.icon-arrow-alert::after {
    border-top: 2px solid #fc3601;
    border-right: 2px solid #fc3601;
}

.icon-arrow-inverse::after {
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
}

.icon-arrow-square, .icon-arrow-square-before {
    position: relative;
    margin-left: 6px;
    padding-left: 0;
    width: 13px;
    height: 13px;
}

.icon-arrow-square::before, .icon-arrow-square-before::before {
    position: absolute;
    top: 1px;
    left: 0;
    width: 13px;
    height: 13px;
    background-color: #0f5a84;
    content: "";
}

.icon-arrow-square-skill::before {
    position: absolute;
    top: 1px;
    left: 0;
    width: 13px;
    height: 13px;
    background-color: #E0E9F3;
    content: "";
}

.icon-arrow-square-skill-active::before {
    position: absolute;
    top: 1px;
    left: 0;
    width: 13px;
    height: 13px;
    background-color: #E0E9F3;
    content: "";
}

.icon-arrow-square::after, .icon-arrow-square-before::after {
    left: -1px;
    z-index: 2;
    margin-top: 1px;
    width: 4px;
    height: 4px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    -webkit-transform: rotate(45deg) translateY(-78%);
    transform: rotate(45deg) translateY(-78%);
}

.icon-arrow-square-skill::after {
    right: 22.5px;
    z-index: 2;
    margin-top: 1px;
    width: 4px;
    height: 4px;
    border-top: 2px solid #131458;
    border-right: 2px solid #131458;
    transform: rotate(135deg);
}

.icon-arrow-square-skill-active::after {
    right: 22.5px;
    z-index: 2;
    margin-top: 1px;
    width: 4px;
    height: 4px;
    border-top: 2px solid #131458;
    border-right: 2px solid #131458;
    transform: rotate(-45deg);
}

.icon-arrow-square-before {
    margin-right: 5px;
    margin-left: 0;
}

.icon-arrow-switch {
    display: inline-block;
    position: relative;
    margin-left: 0.33em;
    width: 1em;
    height: 1em;
    background-color: #0f5a84;
    vertical-align: -0.175em;
}

.icon-arrow-switch::after {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 10;
    width: 4px;
    height: 4px;
    border: 0;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    content: "";
    -webkit-transform: translate(-66%, -50%) rotate(45deg);
    transform: translate(-66%, -50%) rotate(45deg);
}

/* Icon Validation
------------------------------------------ */
.icon-area {
    margin-right: 6px;
    width: 18px;
    height: 18px;
    background: url("../images/icon_area.png") no-repeat;
    vertical-align: bottom;
}

.icon-money {
    margin-right: 6px;
    width: 18px;
    height: 18px;
    background: url("../images/icon_money.png") no-repeat;
    vertical-align: bottom;
}

.icon-heart {
    margin-right: 6px;
    width: 16px;
    height: 16px;
    background: url("../images/icon_heart_inverse.png") no-repeat;
    vertical-align: middle;
}

.icon-mail-alert {
    margin-right: 6px;
    width: 30px;
    height: 19px;
    background: url("../images/icon_mail_alert.png") no-repeat;
    vertical-align: middle;
}

.icon-marker, .icon-marker-inverse {
    display: inline-block;
    margin-right: 6px;
    width: 18px;
    height: 26px;
    background: url("../images/icon_marker.png") left center/18px 100% no-repeat;
    vertical-align: baseline;
}

.icon-marker-inverse {
    background: url("../images/icon_marker_inverse.png") left center no-repeat;
}

.icon-briefcase {
    display: inline-block;
    margin-right: 6px;
    width: 25px;
    height: 21px;
    background: url("../images/icon_briefcase.png") left center/25px 100% no-repeat;
}

.icon-briefcase-inverse {
    background: url("../images/icon_briefcase_inverse.png") left center no-repeat;
}

.icon-lock {
    margin-right: 0.25em;
    width: 18px;
    height: 23px;
    background: url("../images/icon_lock.png") center/100% auto no-repeat;
    vertical-align: -0.175em;
}

.icon-gear-inverse {
    background-image: url("../images/icon_gear_inverse.png");
}

.icon-profile-inverse {
    background-image: url("../images/icon_profile_inverse.png");
    background-size: 24px auto;
}

.icon-entry-inverse {
    background-image: url("../images/icon_entry_inverse.png");
    background-size: 28px auto;
}

.icon-exit {
    margin-right: 6px;
    width: 20px;
    height: 18px;
    background: url("../images/icon_exit.png") left center/20px auto no-repeat;
}

.icon-camera {
    margin-right: 6px;
    width: 18px;
    height: 14px;
    background: url("../images/icon_camera.png") left center/18px auto no-repeat;
}

.icon-download {
    margin-right: 6px;
    width: 15px;
    height: 17px;
    background: url("../images/icon_download.png") left center/15px auto no-repeat;
}

.icon-trash {
    margin-right: 6px;
    width: 15px;
    height: 16px;
    background: url("../images/icon_trash.png") left center/15px auto no-repeat;
}

.is-current .icon-marker {
    background: url("../images/icon_marker_inverse.png") left center no-repeat;
}

.is-current .icon-briefcase {
    background: url("../images/icon_briefcase_inverse.png") left center no-repeat;
}

/* Icon Position
 TODO:使い回せるように修正する
------------------------------------------ */
.icon-position {
    position: relative;
    margin: 0 0 0 -42px;
    padding-left: 42px;
    height: 1em;
}

.icon-position::before {
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    width: 40px;
    height: 40px;
    content: "";
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

.icon-discontent::before {
    background: url("../images/icon_discontent.png") left center no-repeat;
}

.icon-briefcase2::before {
    background: url("../images/icon_briefcase.png") left center no-repeat;
    background-size: 30px auto;
}

.icon-marker2::before {
    background: url("../images/icon_marker_orange.png") left center no-repeat;
    background-size: 21px auto;
}

.icon-building::before {
    top: 100%;
    background: url("../images/icon_building.png") left center no-repeat;
}

.icon-person::before {
    top: 33%;
    background: url("../images/icon_person.png") left center no-repeat;
}

.icon-comment::before {
    background: url("../images/icon_comment.png") left center no-repeat;
}

.icon-checkbox::before {
    background: url("../images/icon_checkbox.png") left center no-repeat;
    background-size: 29px auto;
}

.icon-schedule::before {
    top: 100%;
    background: url("../images/icon_schedule.png") left center no-repeat;
}

.icon-star::before {
    top: 80%;
    background: url("../images/icon_star.png") left center no-repeat;
}

.icon-checkboard {
    margin-right: 10px;
    width: 25px;
    height: 28px;
    background: url("../images/icon_checkboard.png") no-repeat;
    vertical-align: text-bottom;
}

.icon-search-wh {
    background: url("../images/icon_search_wh.png") left center no-repeat;
    background-size: contain;
    vertical-align: bottom;
    width:  26px;
    height: 26px;
    content: ' ';
}

.icon-cross {
    background: url("../images/icon_cross.png") left center no-repeat;
    background-size: contain;
    vertical-align: bottom;
    width:  26px;
    height: 26px;
    content: ' ';
}


.border-middle-9d9e9e {
    background: url("../images/border_middle_9d9e9e.png") center repeat-x;
    display: inline-block;
    width: 100px;
    height: 25px;
}

/* =============================================================================
 Image TODO:後で移動する
============================================================================= */
/* inline
------------------------------------------ */
.image-inline {
    padding-right: 6px;
    vertical-align: middle;
}

/* =============================================================================
 Title
============================================================================= */
/* Page title
------------------------------------------ */
.page-title {
    position: relative;
    margin: 0 0 25px;
    padding: 9px 8px 9px 54px;
    background-color: #595959;
    color: #fff;
    font-size: 2.2rem;
    line-height: 1;
}

.page-title.has-sholder {
    padding: 14px 8px 14px 54px;
}

.page-title .page-title-shoulder {
    display: block;
    position: absolute;
    top: 50%;
    right: 10px;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

/* Title
------------------------------------------ */
.title, .title-lg, .title-sm {
    color: #000;
    font-family: Meiryo, "メイリオ", -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", YuGothic, "游ゴシック", sans-serif;
}

.title {
    margin: 0 0 15px;
    font-size: 1.8rem;
}

.title-lg {
    margin: 0 0 15px;
    font-size: 2.0rem;
}

/* =============================================================================

 List

============================================================================= */
/* Inline
------------------------------------------ */
.list-inline {
    letter-spacing: -0.4em;
}

.list-inline > li {
    display: inline-block;
    margin-right: 1em;
    letter-spacing: normal;
}

/* separator 区切り文字付き */
.list-separator, .list-separator-slash {
    margin: 0;
    padding: 0;
    letter-spacing: -0.4em;
}

.list-separator > li, .list-separator-slash > li {
    display: inline-block;
    letter-spacing: normal;
}

.list-separator > li:before, .list-separator-slash > li:before {
    padding: 0 0.5em;
}

.list-separator > li:first-child:before, .list-separator-slash > li:first-child:before {
    display: none;
}

.list-separator > li:before {
    padding: 0 0.25em;
    content: "|";
}

.list-separator-slash > li:before {
    color: #909998;
    content: "/";
}

/*
----------------------------------------------------------------------------- */
.list-lg li {
    margin: 0.5em 0;
}

.list-lg a {
    white-space: nowrap;
    font-size: 1.6rem;
}

.list-conditions {
    margin: 0 0 10px;
}

.list-conditions > li {
    margin-right: 5px;
    padding: 2px 4px;
    border: 1px solid #909998;
    color: #909998;
    white-space: nowrap;
    font-size: 1.2rem;
    line-height: 1;
}

/* Flex
------------------------------------------ */
.list-flex {
    display: -webkit-box;
    display: flex;

    -webkit-box-pack: justify;
    flex-wrap: wrap;
    justify-content: space-between;
}

.list-flex > li {
    display: -webkit-box;
    display: flex;
    box-sizing: border-box;
    margin: 0 0 9px;
    padding: 8px;
    min-height: 58px;
    width: 49.33%;
    border: 1px dashed #0f5a84;
    line-height: 1.25;

    align-items: center;
    -webkit-box-align: center;
    -webkit-box-pack: center;
    justify-content: center;
}

.list-flex a {
    display: block;
    width: 100%;
    text-align: center;
}

/* =============================================================================
 Table
============================================================================= */
/* Default
------------------------------------------ */
.table {
    margin: 0;
    padding: 0;
    border-collapse: collapse;
}

.table th {
    background-color: #e7e9e9;
}

.table th, .table td {
    padding: 0.75em;
    border: 1px solid #ccc;
}

.table-stripe {
    border-collapse: collapse;
}

.table-stripe tr:nth-child(even) {
    background-color: #f2f8fa;
}

.table-stripe th {
    box-sizing: border-box;
    padding: 0.66em;
    width: 153px;
    color: #00a0e9;
    vertical-align: top;
    text-align: left;
    font-weight: normal;
}

.table-stripe td {
    padding: 0.66em;
}

/* =============================================================================
 Form
============================================================================= */
/* =============================================================================
 input radio checkbox
============================================================================= */
input[type=radio], input[type=checkbox] {
    display: none;
}

.radio, .checkbox, .checkbox-simlicity {
    display: inline-block;
    position: relative;
    box-sizing: border-box;
    margin: 0 0 10px 0;
    padding: 0 0 0 30px;
    vertical-align: middle;
    cursor: pointer;
    -webkit-transition: background-color 0.2s linear;
    transition: background-color 0.2s linear;
}

.radio:after, .checkbox:after, .checkbox-simlicity:after {
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    z-index: 0;
    box-sizing: border-box;
    margin-top: -10px;
    width: 20px;
    height: 20px;
    border: 2px solid #ff6d00;
    background-color: #fff;
    content: "";
    -webkit-transition: border-color 0.2s linear;
    transition: border-color 0.2s linear;
}

.radio:before {
    display: block;
    position: absolute;
    top: 50%;
    left: 20px;
    margin-top: -5px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #ff6d00;
    content: "";
    opacity: 0;
    -webkit-transition: opacity 0.2s linear;
    transition: opacity 0.2s linear;
}

input[type=radio]:checked + .radio:before {
    opacity: 1;
}

.checkbox:before {
    display: block;
    position: absolute;
    top: 50%;
    left: 6px;
    z-index: 1;
    margin-top: -7px;
    width: 5px;
    height: 9px;
    border-right: 3px solid #ff6d00;
    border-bottom: 3px solid #ff6d00;
    content: "";
    opacity: 0;
    -webkit-transition: opacity 0.2s linear;
    transition: opacity 0.2s linear;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

input[type=checkbox]:checked + .checkbox:before {
    opacity: 1;
}

.checkbox-simlicity {
    display: block;
    margin: 0;
    padding: 8px 14px 8px 30px;
}

.checkbox-simlicity:after {
    display: block;
    z-index: 0;
    margin-top: -10px;
    width: 20px;
    height: 20px;
    border: 1px solid #b0b6b5;
    border-radius: 3px;
    background-color: #fff;
    box-shadow: inset 1px 1px 0 0 rgba(0, 0, 0, 0.15);
    content: "";
}

input[type=checkbox]:checked + .checkbox-simlicity:after {
    background-color: #ff6d00;
}

.checkbox-simlicity:before {
    display: block;
    position: absolute;
    top: 50%;
    left: 6px;
    z-index: 1;
    margin-top: -7px;
    width: 5px;
    height: 9px;
    border-right: 3px solid #fff;
    border-bottom: 3px solid #fff;
    content: "";
    opacity: 0;
    -webkit-transition: opacity 0.2s linear;
    transition: opacity 0.2s linear;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

input[type=checkbox]:checked + .checkbox-simlicity:before {
    opacity: 1;
}

/* Input text
------------------------------------------ */
input.input-text {
    display: inline-block;
    box-sizing: border-box;
    padding: 10px 14px;
    width: 234px;
    height: auto;
    border: 2px solid #909998;
    border-radius: 5px;
    background-color: #fff;
    box-shadow: inset 0 2px 0 0 rgba(0, 0, 0, 0.15);
    color: #333;
    font-size: 1.8rem;
    line-height: normal;
}

input.input-text::-webkit-input-placeholder {
    color: #909998;
}

input.input-text::-moz-placeholder {
    color: #909998;
}

input.input-text:-moz-placeholder {
    color: #909998;
}

input.input-text:-ms-input-placeholder {
    color: #909998;
}

input.input-text.input-text-sm {
    width: 110px;
}

input.input-text.input-text-lg {
    width: 408px;
}

input.input-text.input-text-xl {
    width: 480px;
}

/* Input File
------------------------------------------ */
.input-file-image {
    display: none;
}

/* radio switch
------------------------------------------ */
.radio-switch-group {
    display: block;
    box-sizing: border-box;
    margin: 0 auto;
    width: 320px;
    box-shadow: 1px 2px 0 rgba(110, 111, 111, 0.5);
}

.radio-switch-group::after {
    display: block;
    clear: both;
    content: "";
}

.radio-switch-on, .radio-switch-off {
    display: block;
    box-sizing: border-box;
    margin: 0;
    padding: 10px;
    width: 50%;
    border: 1px solid #909998;
    background: #fff;
    color: #909998;
    text-align: center;
    font-weight: bold;
    font-size: 1.6rem;
    line-height: 1;
    cursor: pointer;
}

.radio-switch-on {
    float: left;
    border-right: none;
}

.radio-switch-off {
    float: right;
    border-left: none;
}

.radio-switch-on-enabled {
    padding: 11px;
    background-color: #fc3601;
    box-shadow: inset 3px 3px 0 0 rgba(0, 0, 0, 0.35);
    color: #909998;
    cursor: default;
}

.radio-switch-off-enabled {
    padding: 11px;
    background-color: #0f5a84;
    box-shadow: inset 3px 3px 0 0 rgba(0, 0, 0, 0.35);
    color: #909998;
    cursor: default;
}

.radio-switch-on-enabled-unchecked {
    padding: 11px;
    cursor: default;
}

.radio-switch-off-enabled-unchecked {
    padding: 11px;
    cursor: default;
}

input[type="radio"]:checked + .radio-switch-on {
    background-color: #fc3601;
    box-shadow: inset 3px 3px 0 0 rgba(0, 0, 0, 0.35);
    color: #fff;
}

input[type="radio"]:checked + .radio-switch-on {
    background-color: #fc3601;
    box-shadow: inset 3px 3px 0 0 rgba(0, 0, 0, 0.35);
    color: #fff;
}

input[type="radio"]:checked + .radio-switch-off {
    background-color: #0f5a84;
    box-shadow: inset 3px 3px 0 0 rgba(0, 0, 0, 0.35);
    color: #fff;
}

/* Select
------------------------------------------ */
.select-container {
    display: inline-block;
    position: relative;
    overflow: hidden;
    margin-right: 0.33em;
    border-radius: 3px;
    background-color: #fff;
}

.select-container::after {
    display: block;
    position: absolute;
    top: 50%;
    right: 11px;
    width: 5px;
    height: 5px;
    border: 0;
    border-top: 2px solid #595959;
    border-right: 2px solid #595959;
    content: "";
    -webkit-transform: translateY(-50%) rotate(135deg);
    transform: translateY(-50%) rotate(135deg);
}

.select {
    box-sizing: border-box;
    padding: 10px 30px 10px 11px;
    width: 220px;
    border: 2px solid #909998;
    border-radius: 3px;
    background-color: transparent;

    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.select.select-xs {
    width: 80px;
}

.select.select-sm {
    width: 110px;
}

.select.select-md {
    width: 185px;
}

.select.select-lg {
    width: 550px;
}

select.select::-ms-expand {
    display: none;
}

/* Textarea
------------------------------------------ */
.textarea-container {
    position: relative;
    margin: 20px auto;
}

.textarea-container:last-child {
    margin-bottom: 0;
}

.textarea {
    box-sizing: border-box;
    padding: 1em;
    width: 808px;
    height: 186px;
    border: 2px solid #909998;
    border-radius: 5px;
    background-color: #fff;
    box-shadow: inset 2px 2px 0 0 rgba(0, 0, 0, 0.15);
    font-size: 1.8rem;
}

.textarea-count {
    position: absolute;
    top: 50%;
    right: 0;
    width: 180px;
    border: 1px solid #909998;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

.textarea-count-ent-signup {
    padding: 20px 18px !important;
    min-width: 180px !important;
    width: auto!important;
}

.caption-textarea-count {
    margin: 2px 0 0;
    font-weight: bold;
}

.textarea-count::after {
    position: absolute;
    top: 50%;
    right: 100%;
    margin-top: -8px;
    width: 0;
    height: 0;
    border-width: 8px 12px 8px 0;
    border-style: solid;
    border-color: transparent #fff transparent transparent;
    content: "";
}

.textarea-count::before {
    position: absolute;
    top: 50%;
    right: 100%;
    margin-top: -9px;
    width: 0;
    height: 0;
    border-width: 9px 13px 9px 0;
    border-style: solid;
    border-color: transparent #909998 transparent transparent;
    content: "";
}

.textarea-count dl {
    padding: 20px;
    white-space: nowrap;
    font-weight: bold;
}

.textarea-count-ent-signup dl {
    padding: 0 !important;
}

.textarea-count em {
    color: #ff6d00;
    vertical-align: middle;
    font-style: normal;
    font-size: 2.4rem;
}

.textarea-count em.is-over {
    color: red;
}

/* =============================================================================
 Tab
============================================================================= */
/* tab
------------------------------------------ */
.tab {
    position: relative;
    padding: 0;
}

.tab-contents > .tab-content {
    display: none;
}

.tab-contents > .tab-content.is-display {
    display: block;
}

.tab-item > a:hover, .tab-item > a:active {
    text-decoration: none;
    opacity: 0.75;
}

.tab-item.is-current > a:hover, .tab-item.is-current > a:active {
    opacity: 1;
}

/* =============================================================================
 Modal
============================================================================= */
/* Modal
------------------------------------------ */
#modal-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000;
    overflow-y: auto;
    width: 100%;
    height: 100%;
    background: rgba(144, 153, 152, 0.87);
    cursor: pointer;

    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.modal {
    display: none;
    position: fixed;
    top: 0;
    left: 50%;
    z-index: 1010;
    overflow-y: auto;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);

    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.modal.is-visible {
    display: block;
}

.modal.is-visible .modal-container {
    -webkit-transform: translateY(0);
    transform: translateY(0);
}

.modal-container {
    position: relative;
    margin: 3em auto 4em;
    min-width: 700px;
    background: #fff;
    cursor: auto;
    -webkit-transition-duration: 0.5s;
    transition-duration: 0.5s;
    -webkit-transition-property: -webkit-transform;
    transition-property: -webkit-transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);

    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.skill-modal-container {
    position: relative;
    margin: 3em auto 4em;
    min-width: 700px;
    background: #fff;
    cursor: auto;
    -webkit-transition-duration: 0.5s;
    transition-duration: 0.5s;
    -webkit-transition-property: -webkit-transform;
    transition-property: -webkit-transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);

    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.modal-container.modal-container-lg {
    min-width: 820px;
}

.modal-container.transition {
    margin: calc( 50vh - 35% ) auto;
}

.infolist-header{
  padding: 22px 20px 0;
  border-top: 4px solid #00338B !important;
}

.modal-header {
    padding: 35px 50px 0;
    border-top: 4px solid #ff6d00;
}

.modal-header.modal-header-simplicity {
    padding: 20px 30px 0;
}

.skill-modal-header {
    padding: 35px 50px 0;
    border-top: 4px solid #ff6d00;
}

.skill-modal-header.modal-header-simplicity {
    padding: 20px 30px 0;
}

.modal-title {
    margin: 0 0 20px;
    text-align: center;
    letter-spacing: 0.1em;
    font-size: 2.6rem;
    line-height: 1;
}

.modal-logo {
    margin-right: 14px;
    padding-bottom: 1px;
    width: 110px;
    vertical-align: bottom;
}

.modal-body {
    padding: 0 50px 50px;

    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.modal-body.modal-body-simplicity {
    padding: 0 30px 30px;
}

.infolist-close{
     background: url("../images/icon_close_navy_oshirase.png") center no-repeat !important;
}

.modal-close {
    position: absolute;
    top: 20px;
    right: 16px;
    overflow: hidden;
    width: 20px;
    height: 20px;
    background: url("../images/icon_close.png") center no-repeat;
    text-indent: 100%;
    white-space: nowrap;
    cursor: pointer;
}

.modal-close:hover {
    opacity: 0.66;
}

/* =============================================================================
 Popup
============================================================================= */
/* Popup
------------------------------------------ */
.popup {
    visibility: hidden;
    position: absolute;
    top: 100%;
    right: 0;
    z-index: 100;
    opacity: 0;
    -webkit-transition: opacity 0.3s, visibility 0.3s;
    transition: opacity 0.3s, visibility 0.3s;
}

.popup.is-visible {
    visibility: visible;
    opacity: 1;
}

.popup.is-visible .popup-container {
    -webkit-transform: translateY(0);
    transform: translateY(0);
}

.popup-container {
    position: relative;
    box-sizing: border-box;
    margin: 17px auto 0;
    width: 270px;
    border: 3px solid #fc3601;
    background: #fff;
    box-shadow: 3px 2px 0 0 rgba(65, 67, 67, 0.47);
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: -webkit-transform;
    transition-property: -webkit-transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);
}

.popup-container::before {
    position: absolute;
    right: 44px;
    bottom: 100%;
    z-index: 1;
    width: 0;
    height: 0;
    border-width: 0 7px 11px 7px;
    border-style: solid;
    border-color: transparent transparent #fc3701 transparent;
    content: "";
}

.popup-container::after {
    position: absolute;
    right: 42px;
    bottom: 99%;
    z-index: 0;
    width: 0;
    height: 0;
    border-width: 0 7px 11px 7px;
    border-style: solid;
    border-color: transparent transparent #414343 transparent;
    content: "";
    opacity: 0.47;
}

.popup-header {
    position: relative;
    z-index: 5;
    margin: 0 0 14px;
    padding: 10px 30px 10px 17px;
    background-color: #fc3601;
}

.popup-title {
    margin: 0;
    color: #fff;
    font-size: 2.0rem;
}

.popup-body {
    padding: 0 17px 17px;
}

.popup-close {
    display: block;
    position: absolute;
    top: 10px;
    right: 14px;
    z-index: 10;
    overflow: hidden;
    width: 18px;
    height: 18px;
    background: url("../images/icon_close_inverse.png") center no-repeat;
    text-indent: 100%;
    white-space: nowrap;
}

.popup-close:hover {
    opacity: 0.66;
}

/* help */
.popup-help {
    visibility: hidden;
    position: absolute;
    top: calc(100% + 20px);
    right: -12px;
    z-index: 100;
    box-sizing: border-box;
    padding: 15px 10px;
    min-width: 285px;
    width: auto;
    border-radius: 3px;
    background-color: #333;
    text-align: left;
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 1.5;
    opacity: 0;
    -webkit-transition: opacity 0.3s, visibility 0.3s;
    transition: opacity 0.3s, visibility 0.3s;
}

.popup-help.is-visible {
    visibility: visible;
    opacity: 1;
}

.popup-help.is-visible .popup-container {
    -webkit-transform: translateY(0);
    transform: translateY(0);
}

.popup-help::after {
    position: absolute;
    right: 16px;
    bottom: 100%;
    margin-left: -7px;
    width: 0;
    height: 0;
    border-width: 0 7px 12px 7px;
    border-style: solid;
    border-color: transparent transparent #333 transparent;
    content: "";
}

.popup-help-body {
    display: block;
    color: #fff;
}

/* =============================================================================
 Menu
============================================================================= */
/* Menu DropDown
------------------------------------------ */
.menu-dropdown {
    box-sizing: border-box;
    border: 3px solid #ff6d00;
    background-color: #fff;
}

.menu-dropdown-launcher {
    display: block;
    position: relative;
    padding: 17px;
    font-weight: bold;
}

.menu-dropdown-launcher:hover, .menu-dropdown-launcher:active {
    color: #000;
    text-decoration: none;
    opacity: 0.66;
}

.menu-dropdown-launcher::after {
    position: absolute;
    top: 19px;
    right: 17px;
    width: 9px;
    height: 9px;
    border: 0;
    border-top: 3px solid #ff6d00;
    border-right: 3px solid #ff6d00;
    content: "";
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
}

.menu-dropdown-launcher.is-open {
    padding-bottom: 13px;
}

.menu-dropdown-list {
    display: none;
    margin: 0 17px 17px;
    padding: 10px 0 0;
    border-top: 1px solid #000;
}

.menu-dropdown-item {
    margin-top: 1px;
}

.menu-dropdown-item:first-child {
    margin-top: 0;
}

.menu-dropdown-item > a {
    display: block;
    padding: 10px 16px;
    background-color: #e7e9e9;
}

.menu-dropdown-item > a:hover, .menu-dropdown-item > a:active {
    text-decoration: none;
    opacity: 0.66;
}

/* Menu DropDown Select
------------------------------------------ */
.menu-dropdown-select-launcher {
    display: block;
    position: relative;
    padding: 17px;
    font-weight: bold;
    box-sizing: border-box;
    border: 3px solid #ff6d00;
    background-color: #fff;
}

.menu-dropdown-select-launcher:hover, .menu-dropdown-select-launcher:active {
    color: #000;
    text-decoration: none;
    opacity: 0.66;
}

.menu-dropdown-select-launcher::after {
    position: absolute;
    top: 19px;
    right: 17px;
    width: 9px;
    height: 9px;
    border: 0;
    border-top: 3px solid #ff6d00;
    border-right: 3px solid #ff6d00;
    content: "";
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
}

.menu-dropdown-select-window {
    display: none;
    position: relative;
    padding: 17px;
    font-weight: bold;
    box-sizing: border-box;
    border: 3px solid #ff6d00;
    background-color: #fff;
}

.menu-dropdown-select-item {
    margin-top: 1px;
    position: relative;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.menu-dropdown-select-item:first-child {
    margin-top: 0;
}

.menu-dropdown-select-item > a {
    display: block;
    padding: 10px 26px 10px 16px;
    background-color: #e7e9e9;
}

.menu-dropdown-select-item > a:hover, .menu-dropdown-select-item > a:active {
    text-decoration: none;
    opacity: 0.66;
}

.menu-dropdown-select-item::after {
    position: absolute;
    top: 50%;
    right: 9px;
    margin-top: -4px;
    width: 5px;
    height: 5px;
    border: 0;
    border-top: 3px solid #383838;
    border-right: 3px solid #383838;
    content: "";
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

/* =============================================================================
 Block / Box
============================================================================= */
/* Block
------------------------------------------ */
.block {
    position: relative;
    box-sizing: border-box;
    margin: 10px 0;
    padding: 25px 32px 25px 25px;
    border: 1px solid #cdd1d1;
    background-color: #fff;
}

.block:first-child {
    margin-top: 0;
}

.block-image {
    float: left;
    margin: 0;
}

.block-image img {
    max-width: 100%;
    height: auto;
}

.block-image + .block-body {
    margin-left: 295px;
}

.block-title {
    margin: 0 0 20px;
    padding: 0 0 0 48px;
    font-size: 1.8rem;
}

.block-title > em {
    font-style: normal;
    font-size: 2.2rem;
}

.block-more {
    text-align: center;
}

/* Block Utility
------------------------------------------ */
.block-utility {
    margin-bottom: 20px;
    padding: 8px;
    background-color: #cedce7;
}

.block-utility p {
    margin: 0 0 18px;
    text-align: center;
    line-height: 1.8;
}

.block-utility-container {
    box-sizing: border-box;
    padding: 25px;
    border: 1px solid #909998;
    background: #fff;
}

.block-utility-more {
    margin: 18px 0 0;
    text-align: center;
}

/* Box
------------------------------------------ */
.box {
    box-sizing: border-box;
    margin: 0 0 15px;
    padding: 25px;
    min-height: 210px;
    border: 1px solid #909998;
}

.box.box-lg {
    min-height: 226px;
}

.box-title {
    margin: 0 0 20px;
    padding: 0 0 0 48px;
    font-size: 1.8rem;
}

.box-title > em {
    font-style: normal;
    font-size: 2.2rem;
}

.box-body {
    min-height: 40px;
}

.box-body p {
    line-height: 1.5;
}

.box-more {
    text-align: center;
}

/* =============================================================================
 Recruit / Event
============================================================================= */
/* Recruit
------------------------------------------ */
.recruit hr {
    margin: 14px 0;
    height: 1px;
    border: none;
    background-color: #909998;
}

.recruit-title {
    margin: 16px 0 8px;
    font-size: 1.4rem;
    line-height: 1.7;
}

.recruit-title:first-child {
    margin-top: 0;
}

.recruit-company {
    font-size: 1.2rem;
}

.recruit-data {
    margin: 14px 0;
}

.recruit-data > li {
    margin: 5px 0;
}

.recruit-more {
    margin: 18px 0 0;
}

.recruit-more > a:first-child {
    float: left;
}

.recruit-more > a:last-child {
    float: right;
}

/* Event
------------------------------------------ */
.event-title {
    margin: 16px 0 20px;
    font-size: 2.0rem;
    line-height: 1.3;
}

.event-title:first-child {
    margin-top: 0;
}

.event-data {
    margin: 20px 0;
    width: 100%;
    font-size: 1.4rem;
}

.event-data th {
    box-sizing: border-box;
    width: 98px;
}

/* =============================================================================
 Media
============================================================================= */
/* Media
------------------------------------------ */
.media-image {
    float: left;
    box-sizing: border-box;
    margin: 0 20px 0 0;
    width: auto;
    border: 1px solid #909998;
}

.media-image img {
    vertical-align: bottom;
}

.media-title {
    margin: 0 0 14px;
    font-weight: normal;
    font-size: 1.8rem;
    line-height: 1.4;
}

.media-title.media-title-constrained {
    min-height: 50px;
}

.media-body {
    margin-left: 130px;
}

.media-description > p {
    margin: 0 0 1em;
    color: #000;
    line-height: 1.5714;
}

.media-description > p:last-child {
    margin-bottom: 0;
}

/* Media Simplicity
------------------------------------------ */
.media-simplicity {
    display: table;
    margin-bottom: 15px;
    padding-bottom: 15px;
    border-bottom: 1px dotted #909998;
}

.media-simplicity:last-child {
    padding-bottom: 0;
    border: none;
}

.media-simplicity-image, .media-simplicity-body {
    display: table-cell;
    vertical-align: middle;
}

.media-simplicity-image {
    width: 66px;
}

.media-simplicity-image img {
    box-sizing: border-box;
    max-width: 100%;
    height: auto;
    border: 1px solid #909998;
    vertical-align: bottom;
}

.media-simplicity-body {
    padding: 0 0 0 15px;
    font-size: 1.6rem;
    line-height: 1.5;
}

/* =============================================================================
 Section
============================================================================= */
/* Section
------------------------------------------ */
.section {
    position: relative;
    box-sizing: border-box;
    margin: 0 0 20px;
    padding: 20px;
    border: 1px solid #cdd1d1;
    background-color: #fff;
}

.section.section-skeleton {
    padding: 0;
    border: none;
    background: transparent;
}

.section:last-child {
    margin-bottom: 0;
}

.section-header {
    margin-bottom: 20px;
}

.section-header::before {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background-color: #ff6d00;
    content: "";
}

.section-header.section-header-separate {
    position: relative;
    box-sizing: border-box;
    margin: 0;
    padding: 20px;
    border: 1px solid #cdd1d1;
    background-color: #fff;
}

.section-header.section-header-secondary::before {
    background-color: #909998;
}

.section-hgroup {
    padding: 0 0 10px;
    border-bottom: 1px solid #000;
}

.section-title {
    margin: 0;
    font-weight: bold;
    font-size: 2.0rem;
}

.section-title .section-title-shoulder {
    padding: 0 0 0 10px;
    font-weight: normal;
    font-size: 1.4rem;
}

.section-subtitle {
    display: inline-block;
    margin: 0;
    color: #ff6d00;
}

.section-body {
    margin: 20px 0;
}

.section-body:last-child {
    margin-bottom: 0;
}

.section-header-separate + .section-body {
    margin: 10px 0;
}

.section-footer {
    margin: 20px 0 0;
}

.section-header-separate + .section-body + .section-footer {
    margin: 10px 0 0;
}

.section-more {
    text-align: right;
}

/* Section aside
------------------------------------------ */
.section-aside {
    margin: 0 0 15px;
    padding: 15px;
    border: none;
}

.section-aside p {
    text-align: center;
}

.section-aside-header {
    margin-right: -8px;
    margin-left: -8px;
}

.section-aside-header::before {
    background-color: #000;
}

.section-aside-title {
    text-align: center;
}

.section-aside-logo {
    margin-right: 10px;
    padding-bottom: 4px;
    width: 85px;
    vertical-align: bottom;
}

.section-aside-description {
    text-align: center;
    line-height: 1.7;
}

/* =============================================================================
 Breadcrumb
============================================================================= */
.breadcrumb {
    background-color: #fff;
}

.breadcrumb ul {
    padding: 15px 0;
    font-size: 1.2rem;
}

.breadcrumb li {
    display: inline-block;
}

.breadcrumb li:before {
    padding: 0 6px;
    content: "＞";
}

.breadcrumb li:first-child:before {
    display: none;
}

.breadcrumb a:link, .breadcrumb a:visited {
    text-decoration: underline;
}

.breadcrumb a:hover, .breadcrumb a:active {
    text-decoration: none;
}

@media only screen and (max-width: 599px) {
  .breadcrumb ul {
    padding: 15px 10px;
  }

  .breadcrumb li {
    display: inline;
  }
}

/* =============================================================================
 Aside
============================================================================= */
.asides {
    position: relative;
    box-sizing: border-box;
    padding: 15px;
    background-color: #909998;
}

/* Sns Links
------------------------------------------ */
.sns-links {
    text-align: center;
}

.sns-links > li {
    padding: 5px 0;
}

/* App Links
------------------------------------------ */
.app-links {
    text-align: center;
}

.app-links > li {
    padding: 10px 0;
}

/* =============================================================================
 Banner
============================================================================= */
.banner {
    margin: 0 0 15px;
}

.banner:last-child {
    margin-bottom: 0;
}

.banner img {
    max-width: 100%;
    height: auto;
    vertical-align: bottom;
}

/* =============================================================================
 Ranking
============================================================================= */
.ranking > li {
    margin-bottom: 15px;
    padding: 0 0 15px;
    border-bottom: 1px dotted #909998;
}

.ranking > li:last-child {
    padding-bottom: 0;
    border: none;
}

.ranking > li:nth-child(1) a {
    background: url("../images/icon_ranking01.png") 2px 50% no-repeat;
}

.ranking > li:nth-child(2) a {
    background: url("../images/icon_ranking02.png") 2px 50% no-repeat;
}

.ranking > li:nth-child(3) a {
    background: url("../images/icon_ranking03.png") 2px 50% no-repeat;
}

.ranking > li:nth-child(4) a {
    background: url("../images/icon_ranking04.png") 2px 50% no-repeat;
}

.ranking > li:nth-child(5) a {
    background: url("../images/icon_ranking05.png") 2px 50% no-repeat;
}

.ranking-item > a {
    display: block;
    padding-left: 60px;
    min-height: 30px;
}

.ranking-company {
    display: block;
    font-size: 1.6rem;
    line-height: 1.5;
}

.ranking-job {
    display: block;
    line-height: 1.33;
}

/* =============================================================================
 Hero
============================================================================= */
.hero {
    position: relative;
}

/* =============================================================================
 Search
============================================================================= */
.search input {
    width: 325px;
    height: 42px;
    border: 1px solid #ccc;
    border-radius: 3px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);
}

.search-header {
    position: absolute;
    top: 30px;
    left: 25.52%;
}

/* Search Simplicity
------------------------------------------ */
.search-simplicity input[type=text] {
    display: inline-block;
    box-sizing: border-box;
    margin: 0 auto 20px;
    padding: 5px 0 5px 50px;
    width: 290px;
    background: #f8f9f9 url("../images/icon_search.png") 10px 50% no-repeat;
    font-size: 1.6rem;
    line-height: 40px;
}

.search-simplicity input[type=text]::-webkit-input-placeholder {
    color: #909998;
}

.search-simplicity input[type=text]::-moz-placeholder {
    color: #909998;
}

.search-simplicity input[type=text]:-moz-placeholder {
    color: #909998;
}

.search-simplicity input[type=text]:-ms-input-placeholder {
    color: #909998;
}

/* =============================================================================
 Member
============================================================================= */
/* member
------------------------------------------ */
.member {
    position: relative;
    margin: 20px 0 15px;
}

.member-title {
    margin: 0 120px 17px 0;
    color: #000;
    text-align: right;
    letter-spacing: 0.1em;
    font-weight: bold;
}

.member-name {
    font-size: 1.8rem;
}

.member-links {
    margin: 13px 120px 0 0;
    text-align: right;
    font-size: 1.2rem;
}

.member-applications {
    position: absolute;
    top: -15px;
    right: 0;
    width: 100px;
}

.member-entry {
    display: inline-block;
}

.member-account {
    display: inline-block;
    margin-left: 10px;
}

/* member information
------------------------------------------ */
.member-information-title {
    margin: 0 0 12px;
    text-align: center;
    font-size: 1.6rem;
}

.member-information-mail {
    margin: 12px 0;
    text-align: center;
    letter-spacing: 0.1em;
    font-weight: bold;
    font-size: 2.2rem;
}

.member-information-list {
    margin-bottom: -14px;
}

.member-information-list dt {
    padding: 5px 0;
    background-color: #e7e9e9;
    text-align: center;
}

.member-information-list dd {
    margin: 0;
    border-bottom: 1px dotted #8e9796;
}

.member-information-list dd:last-child {
    border: none;
}

.member-information-list dd > .link-block {
    padding: 14px 8px 14px 0;
}

.member-information-date {
    margin: 0 0 5px;
    color: #fc3601;
    font-weight: bold;
    font-size: 1.8rem;
}

.member-information-date:last-child {
    margin-bottom: 0;
}

.member-information-company {
    margin: 5px 0;
    color: #000;
}

.member-information-company:last-child {
    margin-bottom: 0;
}

/* =============================================================================
 Login
============================================================================= */
.login {
    background-color: #e7e9e9;
    overflow-x: hidden;
    max-height: calc(100vh - 210px);
    overflow-y: auto;
}

@media only screen and (max-width: 599px) {
    .login {
        overflow-x: auto;
        max-height: none;
    }
}

.login-button {
    margin: 0 auto;
    /*max-width: 600px;*/
    width: 80%;
    margin-left:auto;
    margin-right:auto;
}

.login-body {
    margin: 0 auto;
    max-width: 460px;
    width: 80%;
}

.login-sns-account {
    width:100%;
}

.login-sns-account > li {
    text-align: center;
    display: table-cell;
}

.login-sns-account > li:first-child {
    margin-top: 0;
}

.login-fieldset {
    margin: 20px auto 10px;
}

input.login-input {
    display: block;
    box-sizing: border-box;
    margin: 14px auto;
    padding: 0 16px;
    width: 100%;
    height: 44px;
    border: 2px solid #dbdede;
    background-color: #fff;
    box-shadow: 0 0 0 1px #909998;
    font-size: 1.6rem;
}

input.login-input:first-child {
    margin-top: 0;
}

input.login-input.is-error {
    margin: 10px auto;
    border: 1px solid #dbdede;
    background-color: #fdeae5;
    box-shadow: 0 0 0 2px #fc3601;
}

.login-hr {
    position: relative;
    margin: 0 auto;
    text-align: center;
    font-size: 1.4rem;
}

.login-hr > p {
    display: inline-block;
    position: relative;
    z-index: 10;
    margin: 0;
    padding: 0 8px;
    background-color: #e7e9e9;
}

.login-hr::after {
    position: absolute;
    top: 50%;
    left: 0;
    z-index: 0;
    width: 100%;
    height: 1px;
    background-color: #000;
    content: "";
}

.login-reset-password {
    text-align: right;
}

.login-entrance {
    margin: 10px auto 10px;
    max-width: 220px;
}

.login-entrance > label {
    display: block;
    margin: 0 0 14px;
}

.login-entrance > button[type=submit] {
    display: block;
    min-width: 220px;
    font-size: 2.2rem;
    cursor: pointer;
}

.login-footer {
    padding: 20px 20px 32px;
    background-color: #00196A;
    color: #fff;
    text-align: center;
}

.login-footer > p {
    margin: 0 0 20px;
    color: #fff;
    text-align: center;
}

.login-footer .button {
    padding-top: 14px;
    padding-bottom: 14px;
    min-width: 220px;
    font-size: 2.2rem;
}

/* =============================================================================
 Resigt 登録系
============================================================================= */
/* regist
------------------------------------------ */
.regist table {
    margin: 20px 0 0;
    width: 100%;
}

.regist table:first-child {
    margin-top: 0;
}

.regist caption
/*jast 追加分 20190711
----------------------------------------------------------------------------------------------------*/
, .regist .regist-table-sub td:first-child
/*----------------------------------------------------------------------------------------------------*/
{
    position: relative;
    padding: 10px;
    border: 1px solid #909998;
    border-bottom: none;
    background-color: #0f5a84;
    color: #fff;
    font-size: 1.8rem;
}

/*jast 追加分 20190711
----------------------------------------------------------------------------------------------------*/
.regist .regist-table-sub td:first-child {
    text-align: center;
}
/*----------------------------------------------------------------------------------------------------*/
.regist th {
    box-sizing: border-box;
    padding: 20px;
    width: 240px;
    border-color: #909998;
    color: #000;
    vertical-align: top;
    text-align: left;
    line-height: 1.5;
}

.regist td {
    padding: 20px;
    border-color: #909998;
    font-size: 1.8rem;
}

.regist td.regist-text-field {
    padding-left: 33px;
    vertical-align: top;
}

.regist td.regist-bg-ligth-gray {
    background-color: #f8f8f8;
}

.regist-launcher-container {
    box-sizing: border-box;
    width: 200px;
}

.regist-field {
    margin-top: 13px;
}

.regist-field:first-child {
    margin-top: 0;
}

.regist-more {
    margin-top: 20px;
}

.regist-pr {
    padding: 20px;
    background-color: #e7e9e9;
}

.regist-pr p {
    margin: 1em 0 0;
}

.regist-pr p:first-child {
    margin-top: 0;
}

.regist-pr.regist-ai-pr {
    display:flex;
}

.regist-pr.regist-ai-pr .button {
    margin-bottom: 10px;
    padding: 9px 20px;
}

.regist-pr.regist-ai-pr .pr-sample, .regist-pr.regist-ai-pr .ai-pr .pr-rule {
    display:inline-flex;
}

.regist-pr.regist-ai-pr .ai-pr .button {
    color:#ff6d00;
}

/* select modal */
.regist-select {
    position: relative;
    padding-bottom: 64px;
}

.regist-select-item {
    position: relative;
    margin-bottom: 10px;
    padding: 8px 40px 8px 15px;
    background-color: #0f5a84;
    color: #fff;
    font-size: 2.0rem;
    cursor: pointer;
}

.regist-select-item::after {
    display: block;
    position: absolute;
    top: 50%;
    right: 12px;
    width: 8px;
    height: 8px;
    border: 0;
    border-top: 3px solid #fff;
    border-right: 3px solid #fff;
    content: "";
    -webkit-transform: translateY(-50%) rotate(135deg);
    transform: translateY(-50%) rotate(135deg);
}

.regist-select-item.is-open {
    margin-bottom: 0;
}

.regist-select-item.is-open::after {
    -webkit-transform: translateY(-50%) rotate(-45deg);
    transform: translateY(-50%) rotate(-45deg);
}

.regist-select-more, .regist-select-more-fixed {
    padding: 15px 0 5px;
    text-align: center;
}

.regist-select-more-fixed {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 0;
}

.regist-accordion {
    overflow-x: hidden;
    overflow-y: scroll;
    margin-right: -15px;
    padding-right: 15px;
    height: 465px;
    /* form.css より*/
}

.regist-accordion .accordion_list dl {
    border-bottom: 1px solid #fff;
    position:relative;
}

.regist-accordion .accordion_list dl.other {
    margin: 0 0 3%;
}

.regist-accordion .accordion_list dl dt {
    background: #0f5a84;
    font-size: 2rem;
    font-weight: bold;
    color: #fff;
    padding: 1% 2%;
    cursor: pointer;
    position: relative;
}

.regist-accordion .accordion_list dl dt.trigger {
    padding: 2%;
    min-height:26px;
}

.regist-accordion .accordion_list dl dt.input {
    background: none;
    padding: 0;
    position:absolute;
    top:14px;
    left:2%;
    z-index:999;
}

.regist-accordion .accordion_list dl dt .icon-arrow-square {
    position: absolute;
    top: 30%;
    right: 2%;
}

.regist-accordion .accordion_list dl dt .icon-arrow-square::after {
    border-bottom: 2px solid #fff;
    border-top: 0;
}

.regist-accordion .accordion_list dl dt.active .icon-arrow-square::after {
    border: none;
    border-left: 2px solid #fff;
    border-top: 2px solid #fff;
}

.regist-accordion .accordion_list dl dd {
    border: 1px solid #ccc;
    border-top: none;
    padding: 0% 2%;
}

.regist-accordion .accordion_list dl dd ul li {
    display: block;
    border-bottom: 1px solid #ccc;
    font-size: 1.8rem;
    padding: 2% 0;
}

.regist-accordion .accordion_list dl dd ul li:last-child {
    border-bottom: none;
}

.regist-accordion .accordion_list label {
    background: url("../images/icon_check_off.png") no-repeat 0 center;
    cursor: pointer;
    padding: 0 0 0 30px;
    display: block;
}

.regist-accordion .accordion_list input:checked + label {
    background: url("../images/icon_check_on.png") no-repeat 0 center;
}

.regist-accordion .accordion_list.radio_type label {
    background: url("../images/icon_radio_off.png") no-repeat 0 center;
    cursor: pointer;
    padding: 0 0 0 30px;
    display: block;
}

.regist-accordion .accordion_list.radio_type input:checked + label {
    background: url("../images/icon_radio_on.png") no-repeat 0 center;
}

/* submit */
.regist-submit-update-container {
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1000;
    overflow: hidden;
    height: 60px;
    background-color: rgba(15, 90, 132, 0.9);
}

.regist-submit-update-container > .button {
    display: block;
    margin: 10px auto 0;
    padding: 5px;
    width: 330px;
    height: 40px;
    color: #0f5a84;
    font-size: 2.4rem;
    font-family: Meiryo, "メイリオ", -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", YuGothic, "游ゴシック", sans-serif;
    cursor: pointer;
}

/* submit */
.regist-submit-tempupdate-container {
    display: none;
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1000;
    overflow: hidden;
    height: 60px;
    background-color: rgba(15, 90, 132, 0.9);
}

.regist-submit-tempupdate-container > .tempbutton {
    background: transparent url('../images/icon_update-red.png') 82px 7.5px no-repeat padding-box;
    background-color: #FFFFFF;
    display: block;
    margin: 10px auto 0;
    width: 360px;
    height: 40px;
    color: #FC3601;
    font-size: 18px;
    font-weight: bold;
    cursor: pointer;
    position: relative;
    box-sizing: border-box;
    padding: 10px 0 0 36px;
    min-width: 195px;
    border: 3px solid #a2c7e5;
    box-shadow: 1px 2px 0 rgb(110 111 111 / 50%);
    text-align: center;
}
.regist-submit-tempupdate-container > .tempbutton:hover {
    top: 2px;
    border: 3px solid #bbc1c0;
    box-shadow: none;
    color: #FC3601;
    text-decoration: none;
}
.regist-submit-tempupdate-container > .tempbutton-short {
    background: transparent url('../images/icon_update-red.png') 88px 7.5px no-repeat padding-box;
    background-color: #FFFFFF;
    display: block;
    margin: 10px auto 0;
    width: 360px;
    height: 40px;
    color: #FC3601;
    font-size: 18px;
    font-weight: bold;
    cursor: pointer;
    position: relative;
    box-sizing: border-box;
    padding: 10px 0 0 28px;
    min-width: 195px;
    border: 3px solid #a2c7e5;
    box-shadow: 1px 2px 0 rgb(110 111 111 / 50%);
    text-align: center;
}
.regist-submit-tempupdate-container > .tempbutton-short:hover {
    top: 2px;
    border: 3px solid #bbc1c0;
    box-shadow: none;
    color: #FC3601;
    text-decoration: none;
}
.regist-submit-tempupdate-container > .tempbutton-long {
    background: transparent url('../images/icon_update-red.png') 52px 7.5px no-repeat padding-box;
    background-color: #FFFFFF;
    display: block;
    margin: 10px auto 0;
    width: 360px;
    height: 40px;
    color: #FC3601;
    font-size: 18px;
    font-weight: bold;
    cursor: pointer;
    position: relative;
    box-sizing: border-box;
    padding: 10px 0 0 32px;
    min-width: 195px;
    border: 3px solid #a2c7e5;
    box-shadow: 1px 2px 0 rgb(110 111 111 / 50%);
    text-align: center;
}
.regist-submit-tempupdate-container > .tempbutton-long:hover {
    top: 2px;
    border: 3px solid #bbc1c0;
    box-shadow: none;
    color: #FC3601;
    text-decoration: none;
}
.regist-submit-allupdate-container > .allbutton {
    background: transparent url('../images/icon_update_all.png') 44px 7.5px no-repeat padding-box;
    background-color: #FFFFFF;
    display: inline-block;
    margin: 10px 0 23px 0;
    width: 270px;
    height: 40px;
    color: #0f5a84;
    font-size: 18px;
    font-weight: bold;
    cursor: pointer;
    position: relative;
    box-sizing: border-box;
    padding: 8px 0 0 36px;
    min-width: 195px;
    border: 3px solid #a2c7e5;
    box-shadow: 1px 2px 0 rgb(110 111 111 / 50%);
    text-align: center;
}
.regist-submit-allupdate-container > .allbutton:hover {
    top: 2px;
    border: 3px solid #bbc1c0;
    box-shadow: none;
    color: #0f5a84;
    text-decoration: none;
}
.regist-submit-allupdate-container > .is-disabled {
    background: transparent url('../images/icon_update_all-gray.png') 44px 7.5px no-repeat padding-box;
    background-color: #FFFFFF;
    top: 2px;
    color: #BBBBBB;
    border: 3px solid #CCCCCC;
    box-shadow: none;
    text-decoration: none;
    pointer-events: none;
}
@media only screen and (max-width: 599px) {
    .regist-submit-tempupdate-container {
        position: fixed;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 1000;
        overflow: hidden;
        height: 69px;
        background-color: rgba(15, 90, 132, 0.9);
    }

    .regist-submit-tempupdate-container > .tempbutton {
        background: transparent url('../images/icon_update-red.png') 87px 11px no-repeat padding-box;
        background-color: #FFFFFF;
        display: block;
        margin: 10.5px auto 0;
        width: 335px;
        height: 48px;
        color: #FC3601;
        font-size: 14px;
        font-weight: bold;
        cursor: pointer;
        position: relative;
        box-sizing: border-box;
        padding: 15px 0 0 34px;
        min-width: 195px;
        border: 3px solid #a2c7e5;
        box-shadow: 1px 2px 0 rgb(110 111 111 / 50%);
        text-align: center;
    }
    .regist-submit-tempupdate-container > .tempbutton-short {
        background: transparent url('../images/icon_update-red.png') 95px 11px no-repeat padding-box;
        background-color: #FFFFFF;
        display: block;
        margin: 10.5px auto 0;
        width: 335px;
        height: 48px;
        color: #FC3601;
        font-size: 14px;
        font-weight: bold;
        cursor: pointer;
        position: relative;
        box-sizing: border-box;
        padding: 15px 0 0 34px;
        min-width: 195px;
        border: 3px solid #a2c7e5;
        box-shadow: 1px 2px 0 rgb(110 111 111 / 50%);
        text-align: center;
    }
    .regist-submit-tempupdate-container > .tempbutton-short:hover {
        top: 2px;
        border: 3px solid #bbc1c0;
        box-shadow: none;
        color: #FC3601;
        text-decoration: none;
    }
    .regist-submit-tempupdate-container > .tempbutton-long {
        background: transparent url('../images/icon_update-red.png') 65px 11px no-repeat padding-box;
        background-color: #FFFFFF;
        display: block;
        margin: 10.5px auto 0;
        width: 335px;
        height: 48px;
        color: #FC3601;
        font-size: 14px;
        font-weight: bold;
        cursor: pointer;
        position: relative;
        box-sizing: border-box;
        padding: 15px 0 0 34px;
        min-width: 195px;
        border: 3px solid #a2c7e5;
        box-shadow: 1px 2px 0 rgb(110 111 111 / 50%);
        text-align: center;
    }
    .regist-submit-tempupdate-container > .tempbutton-long:hover {
        top: 2px;
        border: 3px solid #bbc1c0;
        box-shadow: none;
        color: #FC3601;
        text-decoration: none;
    }
    .regist-submit-allupdate-container {
        text-align: center;
    }
    .regist-submit-allupdate-container > .allbutton {
        background: transparent url('../images/icon_update_all.png') 82px 12px no-repeat padding-box;
        background-color: #FFFFFF;
        display: inline-block;
        margin: 0 0 12px 0;
        width: 333px;
        height: 50px;
        color: #0f5a84;
        font-size: 15px;
        font-weight: bold;
        cursor: pointer;
        position: relative;
        box-sizing: border-box;
        padding: 14px 0 0 32px;
        border: 3px solid #a2c7e5;
        box-shadow: 1px 2px 0 rgb(110 111 111 / 50%);
    }
    .regist-submit-allupdate-container > .allbutton:hover {
        top: 2px;
        border: 3px solid #bbc1c0;
        box-shadow: none;
        color: #0f5a84;
        text-decoration: none;
    }
    .regist-submit-allupdate-container > .is-disabled {
        background: transparent url('../images/icon_update_all-gray.png') 82px 12px no-repeat padding-box;
        background-color: #FFFFFF;
        top: 2px;
        color: #BBBBBB;
        border: 3px solid #CCCCCC;
        box-shadow: none;
        text-decoration: none;
        pointer-events: none;
    }
    .regist-re30-container {
        display: inline-block!important;
        margin-bottom: 15px;
        width: 330px;
    }
}

/* Inline Element
------------------------------------------ */
.regist-require {
    display: inline-block;
    float: right;
    padding: 0 0.33em;
    height: 20px;
    background-color: #fc3601;
    color: #fff;
    font-weight: normal;
    font-size: 1.2rem;
    line-height: 20px;
}

.regist-notice {
    margin: 0.66em 0;
    color: #909998;
    font-size: 1.4rem;
}

.regist-notice:last-child {
    margin-bottom: -0.33em;
}

.regist-caution {
    margin-top: 0.5em;
    color: #fc3601;
    font-weight: normal;
    line-height: 1.15;
}

/* Tab
------------------------------------------ */
.regist-tab {
    padding: 0 35px;
    border-bottom: 4px solid #0f5a84;
    letter-spacing: -0.4em;
}

.regist-tab-item {
    display: inline-block;
    float: left;
    margin: 16px 0 0 20px;
    background-color: #fff;
    box-shadow: 2.3px 0 0 0 rgba(110, 111, 111, 0.5);
    letter-spacing: normal;
}

.regist-tab-item:first-child {
    margin-left: 0;
}

.regist-tab-item.is-current {
    margin-top: 0;
    box-shadow: none;
}

.regist-tab-item.is-current a {
    height: 60px;
    border-color: #0f5a84;
    background-color: #0f5a84;
    color: #fff;
    line-height: 60px;
}

.regist-tab-item.is-current a:link, .regist-tab-item.is-current a:visited {
    color: #fff;
}

.regist-tab-item.is-current a:hover, .regist-tab-item.is-current a:active {
    color: #fff;
    text-decoration: none;
}

.regist-tab-item > a {
    display: inline-block;
    box-sizing: border-box;
    width: 330px;
    height: 44px;
    border-top: 4px solid #ff6d00;
    vertical-align: bottom;
    text-align: center;
    font-weight: bold;
    font-size: 2.4rem;
    line-height: 44px;
}

.regist-tab-item > a:link, .regist-tab-item > a:visited {
    color: #ff6d00;
}

.regist-tab-item > a:hover, .regist-tab-item > a:active {
    text-decoration: none;
    opacity: 0.66;
}

.regist-tab-container {
    padding: 20px;
    background-color: #fff;
}

/* Input */
.regist-note {
    margin: 0 0 10px;
    color: #000;
    font-size: 1.2rem;
    line-height: 1.66;
}

.regist-function {
    text-align: center;
}

/* =============================================================================
 Mission
============================================================================= */
/* mission
   --------------------------------------------------------------------------- */
.mission {
    box-sizing: border-box;
    padding: 35px 0 38px;
    min-width: 1140px;
    border-top: 4px solid #ff6d00;
    background-color: #fff;
}

.l-responsive .mission {
    min-width: 0;
}

.mission-title {
    margin: 0 0 30px;
    font-size: 1.8rem;
}

.mission-title img {
    width: 128px;
}

.mission-logo {
    padding-right: 20px;
    vertical-align: bottom;
}

.mission-body {
    margin: 30px 0 0;
}

.mission-body p {
    margin: 0;
    line-height: 1.6;
}

/* =============================================================================
 Notice 緊急通知
============================================================================= */
.notice-important {
    padding: 16px 0;
}

.notice-important-title {
    display: none;
}

.notice-important-container {
    box-sizing: border-box;
    padding: 18px 66px;
    border: 3px solid #fc3601;
    background: url("../images/icon_exclamation.png") 15px 50% no-repeat;
    color: #fc3601;
    text-align: center;
    line-height: 1.57;
}

.notice-important-container > p {
    margin: 0.67em 0 0;
}

.notice-important-container > p:first-child {
    margin-top: 0;
}

/* =============================================================================
 Pager
============================================================================= */
/* Pager
------------------------------------------ */
.list-pager {
    display: block;
    margin: 20px -2.5px 0;
    text-align: center;
    letter-spacing: 0;
    font-size: 0;
}

.list-pager ul {
    display: inline-block;
}

.list-pager-link {
    display: inline-block;
    margin: 0 2.5px;
}

.list-pager-link > a {
    display: table;
    box-sizing: border-box;
    width: 35px;
    height: 35px;
}

.list-pager-link > a span {
    display: table-cell;
    padding-top: 2px;
    vertical-align: middle;
    text-align: center;
    font-size: 1.6rem;
    line-height: 1.0;
}

.list-pager-prev > a, .list-pager-next > a {
    position: relative;
    background-color: #fff;
}

.list-pager-prev > a::before, .list-pager-next > a::before {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    width: 5px;
    height: 5px;
    border-top: 3px solid #ff6d00;
    border-right: 3px solid #ff6d00;
    content: "";
}

.list-pager-prev > a span, .list-pager-next > a span {
    font-size: 0;
}

.list-pager-prev > a::before {
    left: 3px;
    -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);
}

.list-pager-next > a::before {
    right: 3px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.list-pager-notlink > a {
    border: 0;
    background-color: #c2c7c6;
    pointer-events: none;
}

.list-pager-notlink > a::before {
    border-top-color: #fff;
    border-right-color: #fff;
}

.list-pager-now > a {
    border: 1px solid #ff6d00;
    background-color: #fff;
    color: #ff6d00;
    font-weight: bold;
}

.list-pager-other > a {
    color: #8e9a98;
}

.list-pager-other > a span {
    padding-left: 0.25em;
    text-align: left;
    letter-spacing: -0.675em;
}

/* Clearfix
------------------------------------------ */
#navigation > ul:after, .l-constrained:after, .l-container:after, .l-row:after, .tab:after, .block:after, .media:after {
    display: block;
    clear: both;
    content: "";
}

/* Hide Text
------------------------------------------ */
.footer-pagetop a {
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
}

/* =============================================================================

 Utility

============================================================================= */
/* =============================================================================
 Helper
============================================================================= */
/* Layout
------------------------------------------ */
/* margin */
.mg-0 {
    margin: 0 !important;
}

.mg-5 {
    margin: 5px !important;
}

.mg-10 {
    margin: 10px !important;
}

.mg-15 {
    margin: 15px !important;
}

.mg-20 {
    margin: 20px !important;
}

.mg-25 {
    margin: 25px !important;
}

.mg-30 {
    margin: 30px !important;
}

.mg-60 {
    margin: 60px !important;
}

.mgb-0 {
    margin-bottom: 0 !important;
}

.mgb-5 {
    margin-bottom: 5px !important;
}

.mgb-10 {
    margin-bottom: 10px !important;
}

.mgb-15 {
    margin-bottom: 15px !important;
}

.mgb-20 {
    margin-bottom: 20px !important;
}

.mgb-25 {
    margin-bottom: 25px !important;
}

.mgb-30 {
    margin-bottom: 30px !important;
}

.mgb-60 {
    margin-bottom: 60px !important;
}

.mgt-0 {
    margin-top: 0 !important;
}

.mgt-5 {
    margin-top: 5px !important;
}

.mgt-10 {
    margin-top: 10px !important;
}

.mgt-15 {
    margin-top: 15px !important;
}

.mgt-20 {
    margin-top: 20px !important;
}

.mgt-25 {
    margin-top: 25px !important;
}

.mgt-30 {
    margin-top: 30px !important;
}

.mgt-60 {
    margin-top: 60px !important;
}

.mgr-0 {
    margin-right: 0 !important;
}

.mgr-5 {
    margin-right: 5px !important;
}

.mgr-10 {
    margin-right: 10px !important;
}

.mgr-15 {
    margin-right: 15px !important;
}

.mgr-20 {
    margin-right: 20px !important;
}

.mgr-25 {
    margin-right: 25px !important;
}

.mgr-30 {
    margin-right: 30px !important;
}

.mgr-60 {
    margin-right: 60px !important;
}

.mgl-0 {
    margin-left: 0 !important;
}

.mgl-5 {
    margin-left: 5px !important;
}

.mgl-10 {
    margin-left: 10px !important;
}

.mgl-15 {
    margin-left: 15px !important;
}

.mgl-20 {
    margin-left: 20px !important;
}

.mgl-25 {
    margin-left: 25px !important;
}

.mgl-30 {
    margin-left: 30px !important;
}

.mgl-60 {
    margin-left: 60px !important;
}

/* padding */
.pd-0 {
    padding: 0 !important;
}

.pd-5 {
    padding: 5px !important;
}

.pd-10 {
    padding: 10px !important;
}

.pd-15 {
    padding: 15px !important;
}

.pd-20 {
    padding: 20px !important;
}

.pd-25 {
    padding: 25px !important;
}

.pd-30 {
    padding: 30px !important;
}

.pd-60 {
    padding: 60px !important;
}

.pdb-0 {
    padding-bottom: 0 !important;
}

.pdb-5 {
    padding-bottom: 5px !important;
}

.pdb-10 {
    padding-bottom: 10px !important;
}

.pdb-15 {
    padding-bottom: 15px !important;
}

.pdb-20 {
    padding-bottom: 20px !important;
}

.pdb-25 {
    padding-bottom: 25px !important;
}

.pdb-30 {
    padding-bottom: 30px !important;
}

.pdb-60 {
    padding-bottom: 60px !important;
}

.pdt-0 {
    padding-top: 0 !important;
}

.pdt-5 {
    padding-top: 5px !important;
}

.pdt-10 {
    padding-top: 10px !important;
}

.pdt-15 {
    padding-top: 15px !important;
}

.pdt-20 {
    padding-top: 20px !important;
}

.pdt-25 {
    padding-top: 25px !important;
}

.pdt-30 {
    padding-top: 30px !important;
}

.pdt-60 {
    padding-top: 60px !important;
}

.pdr-0 {
    padding-right: 0 !important;
}

.pdr-5 {
    padding-right: 5px !important;
}

.pdr-10 {
    padding-right: 10px !important;
}

.pdr-15 {
    padding-right: 15px !important;
}

.pdr-20 {
    padding-right: 20px !important;
}

.pdr-25 {
    padding-right: 25px !important;
}

.pdr-30 {
    padding-right: 30px !important;
}

.pdr-60 {
    padding-right: 60px !important;
}

.pdl-0 {
    padding-left: 0 !important;
}

.pdl-5 {
    padding-left: 5px !important;
}

.pdl-10 {
    padding-left: 10px !important;
}

.pdl-15 {
    padding-left: 15px !important;
}

.pdl-20 {
    padding-left: 20px !important;
}

.pdl-25 {
    padding-left: 25px !important;
}

.pdl-30 {
    padding-left: 30px !important;
}

.pdl-60 {
    padding-left: 60px !important;
}

/* Background
------------------------------------------ */
.bgc-brand-gray {
    background-color: #909998;
}

.bgc-brand-light-gray {
    background-color: #e7e9e9;
}

/* Text
------------------------------------------ */
/* size */
.text-lg {
    font-size: 1.6rem !important;
}

.text-md {
    font-size: 1.4rem !important;
}

.text-sm {
    font-size: 1.2rem !important;
}

/* color */
.text-primary {
    color: #ff6d00;
}

.text-secondary {
    color: #0f5a84;
}

.text-tertiary {
    color: #909998;
}

.text-center {
    text-align: center;
}

.text-left {
    text-align: left;
}

.text-right {
    text-align: right;
}

/* other */
.text-hide {
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
}

/* Hover
------------------------------------------ */
.helper-hover-alpha:hover {
    opacity: 0.66;
}

/* visible / hidden
 * Responsive Only
------------------------------------------ */
/* visible */
.l-responsive {
    /* hidden */
}

.l-responsive .visible-mobile {
    display: none;
}

.l-responsive .visible-desktop {
    display: block;
}

.l-responsive .visible-inline-mobile {
    display: none;
}

.l-responsive .visible-inline-desktop {
    display: inline;
}

.l-responsive .hidden-mobile {
    display: block;
}

.l-responsive .hidden-desktop {
    display: none;
}

.l-responsive .hidden-inline-mobile {
    display: inline;
}

.l-responsive .hidden-inline-desktop {
    display: none;
}

/* visible / hidden
 * Normal
------------------------------------------ */
.mobile {
    /* visible */
    /* hidden */
}

.mobile .visible-mobile {
    display: block;
}

.mobile .visible-desktop {
    display: none;
}

.mobile .visible-inline-mobile {
    display: inline;
}

.mobile .visible-inline-desktop {
    display: none;
}

.mobile .hidden-mobile {
    display: none;
}

.mobile .hidden-desktop {
    display: block;
}

.mobile .hidden-inline-mobile {
    display: none;
}

.mobile .hidden-inline-desktop {
    display: inline;
}

.desktop {
    /* hidden */
}

.desktop .visible-mobile {
    display: none;
}

.desktop .visible-desktop {
    display: block;
}

.desktop .visible-inline-mobile {
    display: none;
}

.desktop .visible-inline-desktop {
    display: inline;
}

.desktop .hidden-mobile {
    display: block;
}

.desktop .hidden-desktop {
    display: none;
}

.desktop .hidden-inline-mobile {
    display: inline;
}

.desktop .hidden-inline-desktop {
    display: none;
}

/* Clearfix
------------------------------------------ */
.clearfix:after {
    display: block;
    clear: both;
    content: " ";
}

/* =============================================================================
  Legacy Browser
============================================================================= */
/* IE9
------------------------------------------ */
/* IE8
------------------------------------------ */
@media only screen and  (max-width: 599px) {
    .l-responsive #header {
        min-width: 0;
    }

    .l-responsive #header .l-left, .l-responsive #header .l-right {
        overflow: hidden;
        box-sizing: border-box;
        width: auto;
    }

    .l-responsive .header-utility {
        overflow: hidden;
        box-sizing: border-box;
        height: 30px;
    }

    .l-responsive .header-title {
        display: block;
        margin: 0;
        padding: 5px 0;
        text-align: center;
        font-size: 1.1rem;
    }

    .l-responsive .header-logo {
        margin: 5px 0 5px 10px;
    }

    .l-responsive .header-logo img {
        width: calc(0.6 * 100vw);
        max-width: none;
        min-width: 100px;
    }

    .l-responsive .header-logo.header-logo-tech img {
        padding: 0;
    }

    .l-responsive .header-logo-woman {
        width: calc(100% - 194px)!important;
        min-width: 126px;
    }

    .l-responsive .header-logo-woman .header-logo img {
        width: 100%;
        max-width: 180px;
        min-width: 116px;
        height: auto;
        max-height: 36px;
        padding-top: 11px;
    }

    .l-responsive .header-links {
        display: none;
    }

    .l-responsive .header-catch {
        display: none;
    }

    .l-responsive #navigation {
        display: none;
    }

    .l-responsive #navigation-mobile {
        display: block;
    }

    .l-responsive #page {
        overflow: hidden;
        min-width: 320px;
    }

    .l-responsive #contents {
        margin: 15px auto 20px;
    }

    .l-responsive .l-constrained {
        padding-right: 0;
        padding-left: 0;
    }

    .l-responsive #footer {
        min-width: 0;
    }

    .l-responsive #footer .navigation-simplicity {
        display: none;
    }

    .l-responsive .footer-pagetop > a {
        display: none;
    }

    .l-responsive .footer-links {
        display: none;
    }

    .l-responsive .footer-utility {
        position: relative;
        margin: 0;
        padding-bottom: 48px;
        height: auto;
    }

    .l-responsive .footer-logos {
        position: absolute;
        bottom: 0;
        left: 0;
        float: none;
        margin: 0;
        padding: 0;
        width: 100px;
    }

    .l-responsive .footer-logos li:first-child {
        margin: 0;
        padding: 10px;
    }

    .l-responsive .footer-logos li:nth-child(2) {
        display: none;
    }

    .l-responsive .footer-logo-gakujo {
        width: 80px;
    }

    .l-responsive .footer-height {
        height: 20px;
    }

    .l-responsive .footer-policy {
        margin: 0;
        padding: 10px;
        border-bottom: 1px solid #c0c2c2;
        background-color: #f7f7f7;
    }

    .l-responsive .footer-policy > li {
        display: inline-block;
        margin: 0 0.5em 0 0;
        font-size: 0.9rem;
    }

    .l-responsive .footer-policy .icon {
        padding-left: 6px;
    }

    .l-responsive .footer-policy .icon::after {
        margin-top: 1px;
        width: 4px;
        height: 4px;
    }

    .l-responsive .footer-copyright {
        position: absolute;
        right: 0;
        bottom: 0;
        left: 100px;
        height: 48px;
    }

    .l-responsive .footer-copyright > p {
        left: 0;
        margin: 0;
        font-size: 1.0rem;
    }

    .l-responsive .footer-copyright-en {
        display: block;
        margin-top: 0.25em;
        letter-spacing: 0;
        font-weight: normal;
        font-family: "Helvetica", "Arial", sans-serif;
    }

    .l-responsive.mobile .footer-pagetop {
        position: relative;
        float: none;
        margin: 0;
    }

    .l-responsive.mobile .footer-pagetop > a {
        display: block;
        position: relative !important;
        bottom: 0 !important;
        z-index: 1;
        width: auto;
        border-top: 2px solid #ff6d00;
        border-bottom: 2px solid #ff6d00;
        background-color: #fff;
    }

    .l-responsive.mobile .footer-pagetop > a:hover, .l-responsive.mobile .footer-pagetop > a:visited {
        opacity: 1;
    }

    .l-responsive.mobile .footer-pagetop > a::after {
        border-top: 2px solid #ff6d00;
        border-right: 2px solid #ff6d00;
    }

    .l-responsive .l-main, .l-responsive .l-sub {
        float: none;
        width: 100%;
    }

    .l-responsive .l-col-1, .l-responsive .l-col-2, .l-responsive .l-col-3, .l-responsive .l-col-4, .l-responsive .l-col-5, .l-responsive .l-col-6, .l-responsive .l-col-7, .l-responsive .l-col-8, .l-responsive .l-col-9, .l-responsive .l-col-10, .l-responsive .l-col-11, .l-responsive .l-col-12, .l-responsive .l-col-custom-sm, .l-responsive .l-col-custom, .l-responsive .l-col-custom-lg, .l-responsive .l-col-custom-xl {
        float: none;
        width: 100%;
    }

    .l-responsive .l-order {
        /* l-order コンテンツの順序入れ替え */
        display: -webkit-box;
        display: flex;

        flex-flow: column;
    }

    .l-responsive .l-order-inverse {
        /* シンプルな入れ替え 隣接するコンテンツの順序を入れ替える */
        -webkit-box-ordinal-group: 3;
        order: 2;
    }

    .l-responsive .l-order-inverse + .l-order-inverse {
        -webkit-box-ordinal-group: 2;
        order: 1;
    }

    .l-responsive .button {
        display: block;
        padding-top: 14px;
        padding-bottom: 14px;
        border-radius: 4px;
        box-shadow: 1px 2px 0 #6e6f6f;
        font-size: 1.5rem;
    }

    .l-responsive .button:hover, .l-responsive .button:active {
        box-shadow: none;
    }

    .l-responsive .button::after {
        margin-top: -5px;
        width: 6px;
        height: 6px;
        content: "";
    }

    .l-responsive {
        /* sns account */
    }

    .l-responsive .button-tertiary {
        padding-top: 9px;
        padding-bottom: 9px;
    }

    .l-responsive .button-applications {
        width: 90px;
        height: 44px;
        border-radius: 4px;
        background: url("../images/btn_applied_list_sp.png") center no-repeat;
        background-color: #0f5a84;
        background-size: 79px auto;
    }

    .l-responsive .button-icon {
        padding: 36px 2px 4px;
        border-width: 2px;
        font-size: 1.2rem;
    }

    .l-responsive .button-primary-entry {
        overflow: hidden;
        box-sizing: border-box;
        min-width: 0;
        width: 55px;
        height: 44px;
        border: none;
        border-radius: 4px;
        background: url("../images/btn_entry_sp.png") center/44px auto no-repeat;
        background-color: #0f5a84;
        box-shadow: none;
        text-indent: 100%;
        white-space: nowrap;
        padding: 0;
    }

    .l-responsive .button-primary-entry::after {
        display: none;
    }

    .l-responsive .button-primary-entry:hover, .l-responsive .button-primary-entry:active {
        top: 0;
    }

    .l-responsive .button-photo-upload {
        box-sizing: border-box;
        margin: 0 auto;
        padding: 4px 5px 3px;
        min-width: 0;
        width: 180px;
        font-size: 1.6rem;
        line-height: normal;
    }

    .l-responsive .button-photo-upload .icon-camera {
        width: 22px;
        height: 18px;
        background-size: 22px auto;
    }

    .l-responsive .button-photo-delete {
        box-sizing: border-box;
        margin: 0 auto;
        padding: 4px 5px 3px;
        min-width: 0;
        width: 180px;
        font-size: 1.6rem;
        line-height: normal;
    }

    .l-responsive .button-photo-delete:disabled {
        box-shadow: none;
    }

    .l-responsive .button-content-add {
        display: block;
        position: relative;
        padding: 14px 6px;
        border: 3px solid #a2c7e5;
        border-radius: 4px;
        box-shadow: 1px 2px 0 #6e6f6f;
        font-size: 1.6rem;
    }

    .l-responsive .button-content-add::before {
        position: absolute;
        left: 5px;
        padding-right: 0.125em;
        color: #333;
    }

    .l-responsive .button-content-add:hover, .l-responsive .button-content-add:active {
        top: 2px;
        box-shadow: none;
        opacity: 1;
    }

    .l-responsive .button-login {
        overflow: hidden;
        box-sizing: border-box;
        min-width: 0;
        width: 55px;
        height: 44px;
        border: none;
        border-radius: 4px;
        background: url("../images/btn_login_sp.png") center/40px auto no-repeat;
        background-color: #909998;
        box-shadow: none;
        text-indent: 100%;
        white-space: nowrap;
        padding: 0;
    }

    .l-responsive .button-login::after {
        display: none;
    }

    .l-responsive .button-login:hover, .l-responsive .button-login:active {
        top: 0;
    }


    .l-responsive .badge-number-applications {
        top: -4px;
        right: -6px;
        min-width: 18px;
        height: 18px;
        border-radius: 50%;
        font-size: 1.0rem;
        line-height: 18px;
    }

    .l-responsive .badge-number-navigation {
        top: -4px;
        right: -4px;
        z-index: 10;
        box-sizing: border-box;
        width: 25px;
        height: 25px;
        border: 1px solid #fff;
        border-radius: 50%;
        white-space: nowrap;
        font-size: 1.2rem;
        line-height: 25px;
    }

    .l-responsive .icon-square {
        width: 35px;
    }

    .mobile .icon-arrow-switch {
        margin-left: 0;
        background-color: transparent;
        vertical-align: -0.175em;
    }

    .mobile .icon-arrow-switch::after {
        display: block;
        width: 4px;
        height: 4px;
        border: 0;
        border-top: 1px solid #0f5a84;
        border-right: 1px solid #0f5a84;
        content: "";
        -webkit-transform: translate(-50%, -50%) rotate(45deg);
        transform: translate(-50%, -50%) rotate(45deg);
    }

    .l-responsive .icon-gear-inverse {
        background-size: 20px auto;
    }

    .l-responsive .icon-profile-inverse {
        background-size: 17px auto;
    }

    .l-responsive .icon-lock {
        width: 11px;
        height: 14px;
        background-size: 11px auto;
    }

    .l-responsive .icon-trash {
        margin-right: 3px;
        width: 11px;
        height: 11px;
        background-size: 100% auto;
    }

    .l-responsive .page-title {
        margin: 0 0 15px;
        padding: 9px 8px 9px 48px;
        font-size: 1.5rem;
        line-height: 1.33;
    }

    .l-responsive .checkbox-simlicity {
        padding: 10px 14px 10px 34px;
        font-weight: bold;
        font-size: 1.4rem;
    }

    .l-responsive .checkbox-simlicity:after {
        margin-top: -12px;
        width: 24px;
        height: 24px;
        border: 1px solid #b0b6b5;
        border-radius: 2px;
    }

    .l-responsive .checkbox-simlicity:before {
        left: 8px;
    }

    .l-responsive input.input-text {
        padding: 10px 9px;
        width: 129px;
        height: auto;
        border: 2px solid #6e6f6f;
        border-radius: 4px;
        background-color: #fff;
        box-shadow: inset 0 2px 0 0 rgba(0, 0, 0, 0.15);
        font-size: 1.4rem;
    }

    .l-responsive input.input-text.input-text-sm {
        width: 120px;
    }

    .l-responsive input.input-text.input-text-lg {
        width: 100%;
    }

    .l-responsive input.input-text.input-text-xl {
        width: 100%;
    }

    .l-responsive input.input-text.input-text-mobile-block {
        display: block;
        width: 100%;
    }

    .l-responsive label.select-container {
        vertical-align: middle;
    }

    .l-responsive label.select-container::after {
        display: block;
        position: absolute;
        top: 50%;
        right: 11px;
        width: 5px;
        height: 5px;
        border: 0;
        border-top: 2px solid #595959;
        border-right: 2px solid #595959;
        content: "";
        -webkit-transform: translateY(-50%) rotate(135deg);
        transform: translateY(-50%) rotate(135deg);
    }

    .l-responsive label.select-container.select-container-mobile-block {
        display: block;
    }

    .l-responsive label.select-container.select-container-mobile-block > .select {
        width: 100%;
    }

    .l-responsive .select {
        width: 177px;
        border-color: #6e6f6f;
    }

    .l-responsive .select.select-xs {
        width: 85px;
    }

    .l-responsive .select.select-sm {
        width: 85px;
    }

    .l-responsive .select.select-md {
        width: 157px;
    }

    .l-responsive .select.select-lg {
        display: block;
        width: 100%;
    }

    .l-responsive .radio-switch-group {
        display: block;
        width: auto;
    }

    .l-responsive .radio-switch-group::after {
        display: block;
        clear: both;
        content: "";
    }

    .l-responsive .radio-switch-on, .l-responsive .radio-switch-off {
        display: block;
        float: left;
        padding: 12px 6px;
        font-size: 1.4rem;
    }

    .l-responsive .textarea-container {
        position: relative;
        margin: 17px auto;
    }

    .l-responsive .textarea-container:last-child {
        margin-bottom: 0;
    }

    .l-responsive .textarea {
        padding: 1em;
        width: 100%;
        height: 190px;
        border: 1px solid #909998;
        border-radius: 4px;
        box-shadow: inset 1px 2px 0 0 rgba(0, 0, 0, 0.15);
        font-size: 1.4rem;
    }
    /*jast 追加分
    ----------------------------------------------------------------------------------------------------*/
    .l-responsive .textarea-onepr_syok_height {
        height: 255px;
    }
    /*----------------------------------------------------------------------------------------------------*/

    .l-responsive .textarea-count {
        position: static;
        width: auto;
        border: none;
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    .l-responsive .caption-textarea-count {
        font-size: 1.0rem;
    }

    .l-responsive .textarea-count::after {
        display: none;
    }

    .l-responsive .textarea-count::before {
        display: none;
    }

    .l-responsive .textarea-count dl {
        padding: 0;
        font-weight: bold;
        font-size: 1.0rem;
    }

    .l-responsive .textarea-count dt, .l-responsive .textarea-count dd {
        display: inline;
    }

    .l-responsive .textarea-count em {
        font-size: 1.2rem;
    }

    .l-responsive .modal {
        top: 0;
        overflow-x: hidden;
        -webkit-overflow-scrolling: touch;
        width: 100%;
        height: 100%;
    }

    .l-responsive .modal-container {
        min-width: 0 !important;
        width: 93.75%;
    }

    .l-responsive .skill-modal-container {
        min-width: 0 !important;
        width: 100%;
        height: 100%;
    }

    .l-responsive .modal-header {
        padding: 24px 12px 0;
        border-top: 2px solid #ff6d00;
    }

    .l-responsive .skill-modal-header {
        padding: 13px 12px 0;
        border-top: 2px solid #ff6d00;
        border-bottom: 1px solid #CCCCCC;
    }

    .l-responsive .modal-title {
        margin: 0 0 10px;
        font-size: 1.6rem;
    }

    .l-responsive .modal-logo {
        margin-right: 6px;
        width: 63px;
    }

    .l-responsive .modal-body {
        padding: 0 9px 12px;
    }

    .l-responsive .modal-close {
        position: absolute;
        top: 12px;
        right: 10px;
        width: 20px;
        height: 20px;
        background: none;
    }

    .l-responsive .modal-close .infolist-close {
        position: absolute;
        top: 12px;
        right: 10px;
        width: 20px;
        height: 20px;
        background: none!important;
}
     .l-responsive .modal-close.accordion_list.infolist-close::before, .l-responsive .modal-close::after {
        display: block;
        position: absolute;
        top: 45%;
        left: 50%;
        width: 20px;
        height: 2px;
        background: none;
        content: "";
        -webkit-transform: translateX(-50%) rotate(45deg);
        transform: translateX(-50%) rotate(45deg);
        -webkit-transform-origin: 50%;
        transform-origin: 50%;
}

    .l-responsive .modal-close::before, .l-responsive .modal-close::after {
        display: block;
        position: absolute;
        top: 45%;
        left: 50%;
        width: 20px;
        height: 2px;
        background: #ff6d00;
        content: "";
        -webkit-transform: translateX(-50%) rotate(45deg);
        transform: translateX(-50%) rotate(45deg);
        -webkit-transform-origin: 50%;
        transform-origin: 50%;
    }

    .l-responsive .modal-close::after {
        -webkit-transform: translateX(-50%) rotate(-45deg);
        transform: translateX(-50%) rotate(-45deg);
        -webkit-transform-origin: 50%;
        transform-origin: 50%;
    }

    .l-responsive .section {
        padding: 10px;
        border: none;
    }

    .l-responsive .section-header {
        margin-right: -10px;
        margin-bottom: 10px;
        margin-left: -10px;
    }

    .l-responsive .section-header::before {
        height: 2px;
    }

    .l-responsive .section-header.section-header-separate {
        margin: 0;
        padding: 10px;
        border: none;
    }

    .l-responsive .section-hgroup {
        padding: 0 15px 8px;
    }

    .l-responsive .section-title {
        color: #333;
        font-size: 1.5rem;
    }

    .l-responsive .section-title .section-title-shoulder {
        padding: 0 0 0 6px;
        font-size: 1.2rem;
    }

    .l-responsive .section-body {
        margin: 10px 0;
    }

    .l-responsive .section-body:last-child {
        margin-bottom: 0;
    }

    .l-responsive .member {
        margin: 0;
        padding-right: 60px;
        height: 56px;
    }

    .l-responsive .member-title {
        display: none;
    }

    .l-responsive .member-links {
        display: none;
    }

    .l-responsive .member-applications {
        position: relative;
        top: 6px;
        width: 90px;
    }

    .l-responsive .member-entry {
        display: inline-block;
        margin: 6px 0 0;
    }

    .l-responsive .member-account {
        display: inline-block;
        margin: 6px 0 0 2px;
    }

    .l-responsive .login-body {
        margin: 0 10px;
        width: auto;
    }

    .l-responsive .login-sns-account {
        padding: 10px 0 20px;
    }

    .l-responsive .login-sns-account > li {
        margin-top: 10px;
    }

    .l-responsive .login-sns-account > li:first-child {
        margin-top: 0;
    }

    .l-responsive .login-hr {
        font-size: 1.2rem;
    }

    .l-responsive .login-hr > p {
        padding: 0 10px;
    }

    .l-responsive .login-fieldset {
        margin: 10px auto;
    }

    .l-responsive input.login-input {
        margin: 7px auto;
        padding: 0 8px;
        height: 40px;
        border: 2px solid #6e6f6f;
        border-radius: 4px;
        background-color: #fff;
        box-shadow: inset 2px 3px 0 0 rgba(0, 0, 0, 0.15);
        font-size: 1.2rem;
    }

    .l-responsive input.login-input:first-child {
        margin-top: 0;
    }

    .l-responsive input.login-input.is-error {
        margin: 10px auto;
        border: 1px solid #dbdede;
        background-color: #fdeae5;
        box-shadow: 0 0 0 2px #fc3601;
    }

    .l-responsive .login-reset-password {
        text-align: right;
    }

    .l-responsive .login-reset-password a {
        font-weight: normal;
        font-size: 1.2rem;
    }

    .l-responsive .login-reset-password .icon {
        margin: 0;
        vertical-align: -1px;
    }

    .l-responsive .login-entrance {
        margin: 15px auto;
        max-width: none;
        text-align: center;
    }

    .l-responsive .login-entrance > label {
        display: inline-block;
        margin: 0 0 15px;
        font-size: 1.2rem;
    }

    .l-responsive .login-entrance > button[type=submit] {
        width: 100%;
        font-size: 1.6rem;
    }

    .l-responsive .login-footer {
        padding: 10px 10px 22px;
    }

    .l-responsive .login-footer > p {
        margin: 0 0 10px;
        font-size: 1.2rem;
    }

    .l-responsive .login-footer .button {
        padding-top: 14px;
        padding-bottom: 14px;
        font-size: 1.6rem;
    }

    .l-responsive .regist-submit-update-container > .button {
        padding: 5px;
        width: 270px;
        color: #0f5a84;
        font-size: 1.6rem;
        cursor: pointer;
    }

    .l-responsive .regist-accordion .regist-select-more {
        padding: 5px 0 5px;
    }

    .l-responsive {
        /* select modal */
    }

    .l-responsive .regist table, .l-responsive .regist tbody, .l-responsive .regist tr, .l-responsive .regist th, .l-responsive .regist td {
        display: block;
        box-sizing: border-box;
    }

    .l-responsive .regist caption {
        display: block;
        padding: 10px;
        text-align: left;
        font-size: 1.2rem;
    }

    .l-responsive .regist tr {
        margin-bottom: 10px;
        width: 100%;
    }

    .l-responsive .regist tr:last-child {
        margin-bottom: 0;
    }

    .l-responsive .regist th {
        box-sizing: border-box;
        padding: 10px;
        width: auto;
        border-bottom: none;
        font-size: 1.2rem;
        line-height: 1.15;
    }

    .l-responsive .regist td {
        padding: 10px;
        border-top: none;
        font-size: 1.4rem;
    }

    .l-responsive .regist .regist-table-sub {
        border: 1px solid #909998;
    }

    .l-responsive .regist .regist-table-sub caption
    /*jast 追加分 20190711
    ----------------------------------------------------------------------------------------------------*/
    , .l-responsive .regist .regist-table-sub td:first-child
    /* ----------------------------------------------------------------------------------------------------*/
    {
        overflow: hidden;
        padding: 14px 10px 14px 10px;
        border: none;
    }

    .l-responsive .regist .regist-table-sub tr {
        margin: 0;
    }

    .l-responsive .regist .regist-table-sub th {
        box-sizing: border-box;
        padding: 15px 10px 5px;
        width: auto;
        border: none;
        background-color: transparent;
        line-height: normal;
    }

    .l-responsive .regist .regist-table-sub td {
        margin: 0 10px;
        padding: 0 0 20px;
        border: none;
        border-bottom: 1px solid #909998;
    }

    /*jast 追加分 20190711
    ----------------------------------------------------------------------------------------------------*/
    .l-responsive .regist .regist-table-sub td:first-child {
        margin: 0;
        text-align: left;
        font-size: 1.2rem;
    }
    /* ----------------------------------------------------------------------------------------------------*/
    .l-responsive .regist .regist-table-sub tr:last-child td {
        margin-bottom: 0;
        border-bottom: none;
    }

    .l-responsive .regist-launcher-container {
        margin-top: -1px;
        padding-top: 1px !important;
        width: auto;
        background-color: #fff;
    }

    .l-responsive .regist-require {
        float: none;
        margin-right: 0.66em;
        padding: 0 0.33em;
        height: 15px;
        vertical-align: bottom;
        font-size: 1.0rem;
        line-height: 15px;
    }

    .l-responsive .regist-notice {
        font-size: 1.2rem;
    }

    .l-responsive .regist-caution {
        display: inline-block;
        margin: 0 0 0 0.5em;
        color: #fc3601;
    }

    .l-responsive .regist-tab {
        padding: 0 10px;
        border-bottom: 2px solid #0f5a84;
    }

    .l-responsive .regist-tab-item {
        margin: 5px 0 0 7px;
        width: 31.6666%;
        box-shadow: 2px 2px 0 0 rgba(110, 111, 111, 0.5);
    }

    .l-responsive .regist-tab-item:first-child {
        margin-left: 0;
    }

    .l-responsive .regist-tab-item.is-current {
        margin-top: 0;
        box-shadow: none;
    }

    .l-responsive .regist-tab-item.is-current a {
        height: 35px;
        border-color: #0f5a84;
        color: #fff;
        line-height: 35px;
    }

    .l-responsive .regist-tab-item > a {
        display: block;
        width: auto;
        height: 30px;
        border-top: 2px solid #ff6d00;
        font-size: 1.4rem;
        line-height: 30px;
    }

    .l-responsive .regist-tab-container {
        padding: 15px 0;
        background-color: transparent;
    }

    .l-responsive .regist-more {
        margin-top: 10px;
    }

    .l-responsive .regist-note {
        margin: 10px 0;
        font-size: 1.0rem;
        line-height: 1.5;
    }

    .l-responsive .regist-note:last-child {
        margin-bottom: 0;
    }

    .l-responsive .regist-pr {
        padding: 10px;
        font-size: 1.0rem;
    }

    .l-responsive .regist-pr p {
        margin: 15px 0 0;
    }

    .l-responsive .regist-pr p:first-child {
        margin-top: 0;
    }

    .l-responsive .regist-pr.regist-ai-pr {
        display:block;
    }

    .l-responsive .regist-pr.regist-ai-pr .pr-sample {
        margin-bottom: 10px;
    }

    .l-responsive .regist-modal .modal-container {
        margin-top: 5%;
    }

    .l-responsive .regist-modal .skill-modal-container {
        margin-top: 31px;
    }

    .l-responsive .regist-accordion {
        z-index: 0;
        overflow-x: hidden;
        overflow-y: scroll;
        -webkit-overflow-scrolling: touch;
        max-height: 320px;
        height: 80%;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        /* form.css より*/
    }

    .l-responsive .regist-accordion-special{
        height: 320px!important;
    }

    .l-responsive .regist-accordion-special2{
        height: 265px!important;
    }

    .l-responsive .regist-accordion-special3{
        height: 265px!important;
    }

    .l-responsive .regist-accordion .accordion_list {
        margin: 0 0 5%;
    }

    .l-responsive .regist-accordion .accordion_list dl dt {
        padding: 3%;
        font-size: 1.5rem;
    }

    .l-responsive .regist-accordion .accordion_list dl dt .icon-arrow-square {
        position: absolute;
        top: 30%;
        right: 2%;
    }

    .l-responsive .regist-accordion .accordion_list dl dt .icon-arrow-square::after {
        border-top: 0;
        border-bottom: 2px solid #fff;
    }

    .l-responsive .icon-arrow-square-skill {
        position: absolute;
        top: 50%;
        right: -2.5%;
    }

    .l-responsive .icon-arrow-square-skill::after {
        border-top: 0;
        border-bottom: 2px solid #131458;
        transform: rotate(45deg);
    }

    .l-responsive .icon-arrow-square-skill-active {
        position: absolute;
        top: 50%;
        right: -2.5%;
    }

    .l-responsive .icon-arrow-square-skill-active::after {
        border-top: 0;
        border-bottom: 2px solid #131458;
        transform: rotate(135deg)!important;
    }

    .l-responsive .regist-accordion .accordion_list dl dd ul li {
        padding: 3% 0;
        font-size: 1.5rem;
    }

    .l-responsive label.is-error-regist {
        margin: 0.5em 0;
    }

    /*jast 追加分
    ----------------------------------------------------------------------------------------------------*/
    .l-responsive .serverErr {
        margin: 0.5em 0;
    }
    /* ----------------------------------------------------------------------------------------------------*/

    .l-responsive .mission {
        padding: 20px;
        border-top: none;
        background-color: #fff;
    }

    .l-responsive .mission-title {
        margin: 0 0 20px;
        font-size: 0.9rem;
    }

    .l-responsive .mission-logo {
        float: left;
        padding-right: 11px;
        width: 97px;
    }

    .l-responsive .mission-catch {
        display: block;
        margin: 0 0 0 108px;
    }

    .l-responsive .mission-catch span {
        display: block;
        margin: 1px 0;
    }

    .l-responsive .mission-body {
        margin: 20px 0 0;
    }

    .l-responsive .mission-body p {
        font-size: 1.2rem;
        line-height: 1.6;
    }

    .mobile .notice-important {
        box-sizing: border-box;
        margin: 10px;
        padding: 0;
    }

    .mobile .notice-important-title {
        display: block;
        padding-left: 29px;
        height: 25px;
        background: url("../images/icon_exclamation_inverse.png") 5px center/18px auto no-repeat;
        background-color: #fc3601;
        color: #fff;
        font-size: 1.2em;
        line-height: 25px;
    }

    .mobile .notice-important-container {
        box-sizing: border-box;
        padding: 10px 0 10px;
        border: 2px solid #fc3601;
        background: none;
        text-align: left;
        font-weight: bold;
        font-size: 1.2rem;
        line-height: 1.33;
    }

    .mobile .notice-important-container > p {
        margin-right: 10px;
        margin-left: 10px;
    }

    .l-responsive .list-pager {
        display: table;
        margin: 15px auto;
        max-width: 300px;
        width: 100%;
    }

    .l-responsive .list-pager-link {
        display: table-cell;
        vertical-align: middle;
    }

    .l-responsive .list-pager-link > a {
        margin: 0 auto;
        width: 20px;
        height: 20px;
    }

    .l-responsive .list-pager-link > a span {
        font-weight: bold;
        font-size: 1.2rem;
    }

    .l-responsive .list-pager-prev, .l-responsive .list-pager-next {
        padding: 0;
        width: 20px;
    }

    .l-responsive .list-pager-prev > a, .l-responsive .list-pager-next > a {
        margin: 0;
    }

    .l-responsive .list-pager-prev > a::before, .l-responsive .list-pager-next > a::before {
        width: 4px;
        height: 4px;
        border-top-width: 2px;
        border-right-width: 2px;
    }

    .l-responsive .list-pager-prev > a span, .l-responsive .list-pager-next > a span {
        font-size: 0;
    }

    .l-responsive .list-pager-prev {
        padding-right: 22px;
    }

    .l-responsive .list-pager-prev > a::before {
        left: 2px;
    }

    .l-responsive .list-pager-next {
        padding-left: 22px;
    }

    .l-responsive .list-pager-next > a::before {
        right: 2px;
    }

    .l-responsive .list-pager-other > a span {
        font-weight: normal;
    }

    .l-responsive .visible-mobile {
        display: block;
    }

    .l-responsive .visible-desktop {
        display: none;
    }

    .l-responsive .visible-inline-mobile {
        display: inline;
    }

    .l-responsive .visible-inline-desktop {
        display: none;
    }

    .l-responsive .hidden-mobile {
        display: none;
    }

    .l-responsive .hidden-desktop {
        display: block;
    }

    .l-responsive .hidden-inline-mobile {
        display: none;
    }

    .l-responsive .hidden-inline-desktop {
        display: inline;
    }
}

@media (min-width: 600px) and (max-width: 958px) {
    .l-responsive .footer-utility {
        position: relative;
        height: auto;
    }

    .l-responsive .footer-policy {
        position: absolute;
        top: 50%;
        left: 235px;
        margin: 0;
        width: calc(50% - 235px);
        font-size: 1.3rem;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
    }

    .l-responsive .footer-policy li {
        margin: 10px 0;
    }
}

/* スマホレイアウト用追記 2017/04/ */
.pc_view{
	display:block;
}

.smp_view{
	display:none;
}

.fll{
	float:left;
}

.flr{
	float:right;
}

.clear{
	clear:both;
}

.fwb{
	font-weight:bold;
}
/**/

/* print
------------------------------------------ */
@media print {
    body {
        /* Chrome印刷用(背景色設定) */
        -webkit-print-color-adjust: exact;
	    zoom: 96%;
    }
}
@page {
  margin-left: 10px;
  margin-right: 10px;
}


.SpdApp {
    position: fixed;
    top: 55%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 999;
}
#SpdAppBg {
    position:fixed;
    z-index: 100;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    background: rgba(144, 153, 152, 0.87);
}
/*.SpdNewsClass {
    border-top:3px solid #de9610;
    border-bottom:3px solid #de9610;
    text-align:center;
    padding:10px 0px;
    border-radius: 2px;
    background: #FFFFF5;
}*/
.SpdNewsClass img {
    width:50px;
}
.spdapBtn {
    width:70%;
    margin:0 auto;
}
.buruburu {
    display: inline-block;
    animation: hurueru .2s  infinite;
}

@keyframes hurueru {
    0% {transform: translate(0px, 0px) rotateZ(0deg)}
    25% {transform: translate(2px, 2px) rotateZ(1deg)}
    50% {transform: translate(0px, 2px) rotateZ(0deg)}
    75% {transform: translate(2px, 0px) rotateZ(-1deg)}
    100% {transform: translate(0px, 0px) rotateZ(0deg)}
}
.cmpSpdAppIocn {
    box-sizing: border-box;
    width: 60px;
    height: 60px;
    border: 1px solid #cdd1d1;
    margin: 0 auto;
    border-radius: 50%;
    background: #fff no-repeat center center / contain;
}
.tblSpdApp td {
    padding: 10px 0px;
}

.infolist-header.modal-header {
     padding:22px 16px 16px 20px;
}



/* header-oshirase
------------------------------------------ */
.header-oshirase-btn {
    display: inline-block;
    position: relative;
    margin: 24px 0 0 30px;
    background-color: #fff;
    border: 2px solid #196bbf;
    border-radius: 5px;
    cursor: pointer;
}
.header-oshirase-btn:hover {
    background-color: #edf2f7;
}
.header-oshirase-btn .main {
    font-size: 13px;
    font-weight: bold;
    margin: 0;
    padding: 7px 15px 6px 8px;
}
.header-oshirase-btn img {
    width: 20px;
    height: auto!important;
    vertical-align: -2px;
    margin-right: 5px;
}
.header-oshirase-btn .number {
    display: inline-block;
    font-size: 10px;
    font-weight: bold;
    transform: scale(0.9);
    color: #fff;
    text-align: center;
    padding: 3px;
    min-width: 16px;
    line-height: 16px;
    background-color: #FC3601;
    border-radius: 100px;
    position: absolute;
    left: calc(100% - 16px);
    top: -15px;
}
.shokushu_name_bold{
    font-weight: bold;
    font-size: 11px;
    padding-top: 4px !important
}
.icon_space_welcome {margin-left: 63px;}
.icon_space_only {margin-left: 7px;}
.icon_space_profile {margin-left: 30px;}
.icon_space_scout {margin-left: 40px;}
.icon_space_kouho {margin-left: 28px;}
.icon_space_like {margin-left: 28px;}
.icon_space_casual {margin-left: 40px;}

@media only screen and (max-width: 599px) {
    .header-oshirase-btn,
    .header-oshirase-modal {
        display: none !important;
    }
    .infolist-header.modal-header {
     padding:11px 12px 0px 12px !important;
}
}

/*20200601追加ヘッダーアイコン*/
.header-todilist-btn{
    display: inline-block;
    position: relative;
    margin: 24px 0 0 20px;
    background-color: #fff;
    border: 2px solid #13b5b1;
    border-radius: 5px;
    cursor: pointer;
}
.header-todilist-btn:hover{
    opacity: .8;
    text-decoration: none;
}
.header-todilist-btn .main {
    font-size: 13px;
    font-weight: bold;
    margin: 0;
    padding: 7px 15px 6px 8px;
    color:#000;
}
.header-todilist-btn img{
    width: 14px;
    height: auto;
    vertical-align: -2px;
    margin-right: 5px;
}
.header-todilist-btn .number{
    padding: 2px 10px 2px;
    border-radius: 50px;
    color:#fff;
    position: absolute;
    top:-32px;
    right:10px;
    background-color: #13b5b1;
    font-size: 13px;
    z-index: 2;
}
.header-todilist-btn .number:before{
    content:'';
    position: absolute;
    bottom:-4px;
    left:50%;
    margin-left: -6px;
    width: 10px;
    height: 10px;
    background-color: #13b5b1;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
        transform: rotate(45deg);
    z-index: -1;
}
@media only screen and (max-width: 599px) {
.header-todilist-btn{
    display: none!important;
}
}

.lgnstr{
    margin: 3px;
    font-size: 13px;
    clear:both;
}

.lngpssf{
    float:right;
    text-decoration: underline;
    font-size: 13px;
}
.lgnli1,.lgnli2,.lgnli3 {
    display:inline-block;
}