@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; }
/*******************************************************************************
'/career/css/common_smp.cssから貼り付け
'*******************************************************************************/
@media only screen and (max-width:599px) {
/* =============================================================================
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:active { 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:active, 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; }
/* mobile */
.mobile label.is-error { margin: 0 0 -5px; padding: 0.125em 0 0 18px; 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: 5px 30px 10px 0; }
.header-logo img { vertical-align: bottom; }
.header-logo img:first-child { padding:5px 0 10px; }
.header-catch { padding-left: 0; }
/* =============================================================================
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:active, .navigation-item > a:active { color: #ff6d00; }
.navigation-item.is-current a { color: #ff6d00 !important; }
.navigation-item:nth-child(1):active ~ .navigation-bar { left: 0; }
.navigation-item:nth-child(1).is-current ~ .navigation-bar { left: 0; }
.navigation-item:nth-child(2):active ~ .navigation-bar { left: 16.666%; }
.navigation-item:nth-child(2).is-current ~ .navigation-bar { left: 16.666%; }
.navigation-item:nth-child(3):active ~ .navigation-bar { left: 33.3333%; }
.navigation-item:nth-child(3).is-current ~ .navigation-bar { left: 33.3333%; }
.navigation-item:nth-child(4):active ~ .navigation-bar { left: 50%; }
.navigation-item:nth-child(4).is-current ~ .navigation-bar { left: 50%; }
.navigation-item:nth-child(5):active ~ .navigation-bar { left: 66.6666%; }
.navigation-item:nth-child(5).is-current ~ .navigation-bar { left: 66.6666%; }
.navigation-item:nth-child(6):active ~ .navigation-bar { left: 83.3333%; }
.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:active, .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:active, .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:active, .navigation-mobile-sub-secondary a:active, .navigation-mobile-sub-tertiary a:active, .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:active, .footer-pagetop a:active, .footer-pagetop a:focus { color: #ff6d00; text-decoration: none; }
.footer-pagetop a:active, .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-height { height: 20px; }
/* 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-push { 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; }
.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:active, .link-inverse:active { color: #fff; }
/* default 通常 */
.link-default:link, .link-default:visited { color: #0f5a84; text-decoration: none; }
.link-default:active, .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:active, .link-alpha:active { text-decoration: none; opacity: 0.66; }
/* block クラスhover-xxでhover時の挙動を変更 */
.link-block { display: block; }
.link-block:active, .link-block:active { text-decoration: none; }
.link-block:active .hover-alpha, .link-block:active .hover-alpha { opacity: 0.66; }
.link-block:active .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:active, .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:active, .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); }
/**/
.button2 { 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; }
.button2:link, .button2:visited { color: #0f5a84; }
.button2:active, .button2:active { top: 2px; border: 3px solid #bbc1c0; box-shadow: none; color: #0f5a84; text-decoration: none;}
.button2::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); }
.button3 { display: inline-block; position: relative; box-sizing: border-box; padding: 9px 0px; /*    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; text-align:center; }
.button3:link, .button:visited { color: #0f5a84; }
.button3:active, .button:active { top: 2px; border: 3px solid #bbc1c0; box-shadow: none; color: #0f5a84; text-decoration: none;}
.button3::after { position: absolute; top: 50%; right: 9px; margin-top: -4px; width: 5px;
height: 5px; border: 0; }
.button4 { display: inline-block; position: relative; box-sizing: border-box; background-image:url(../images/top/icon_search.png); background-size:60%;
background-repeat:no-repeat; background-position:center; /*    min-width: 195px;*/ border: 3px solid #ff6d00; background-color: #ff7e00; box-shadow: 1px 2px 0 rgba(110, 111, 111, 0.5);
text-align: center; text-decoration: none; font-weight: bold; font-size: 1.8rem; width:100%;
height:60px; }
.button4:link, .button:visited { color: #0f5a84; }
.button4:active, .button:active { top: 2px; border: 3px solid #bbc1c0; box-shadow: none; color: #0f5a84; text-decoration: none;}
.button4::after { position: absolute; top: 50%; right: 9px; margin-top: -4px; width: 5px;
height: 5px; border: 0; }
.button4 img{ width: 100%; }
/* 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-w50 { width: 50%; }
.button-w50-gutter { width: 50%; padding: 0 4px; box-sizing: border-box; }
/* 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:active, .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:active, .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, .button-primary-entry-lg { border: 3px solid #ff6d00; background-color: #ff6d00; box-shadow: 1px 3px 0 #6e6f6f; color: #fff; }
.modal-login .modal-container .button-primary{ border: 3px solid #ff6d00; background-color: #ff6d00; box-shadow: 1px 3px 0 #6e6f6f; color: #fff; }
.modal-login .modal-container .button-primary::after {border-top: 3px solid #FFF;border-right: 3px solid #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:active, .button-primary:active, .button-primary-entry:active, .button-primary-entry:active, .button-primary-entry-lg: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, .button-primary-entry-lg::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:active, .button-primary-entry:active { top: 2px; }
/* primary-entry-lg */
.button-primary-entry-lg { padding-top: 0; padding-bottom: 0; min-width: 300px; height: 60px; box-shadow: 4px 4px 0 rgba(0, 0, 0, 0.5);
font-size: 2.8rem; line-height: 58px; }
.button-primary-entry-lg::after { position: absolute; top: 50%; right: 20px; margin-top: -10px; width: 12px;
height: 12px; border: 0; border-top: 5px solid #fff; border-right: 5px solid #fff; content: "";
-webkit-transform: rotate(45deg); transform: rotate(45deg); }
/* 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:active, .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 2px 0 rgba(110, 111, 111, 0.47); 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:active, .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; }
/* outline */
.button-outline { border: 1px solid #ccc; }
.button-photo-upload { box-sizing: border-box; padding: 4px 5px 3px; min-width: 186px; line-height: 1; }
/* 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_applied_list.png") center no-repeat;
background-color: #0f5a84; text-indent: 100%; white-space: nowrap; }
.button-favorites-list { display: inline-block; overflow: hidden; width: 100px; height: 65px; background: url("../images/btn_favorited_list.png") center no-repeat;
background-color: #0f5a84; text-indent: 100%; white-space: nowrap; }
.button-applications:active, .button-applications:active, .button-favorites-list:active, .button-favorites-list:active { opacity: 0.66; }
/* line */
.button-line { display: block; box-sizing: border-box; height: 56px; border: 2px solid #00C300; border-radius: 4px;
background: url("../images/smp/icon_line.png") 18% 50% no-repeat; color: #00C300; text-align: left; line-height: 56px; background-size:26px;
padding-left:30%; }
.button-line:link, .button-line:visited { color: #00C300; }
.button-line:active, .button-line.active { color: #00C300; text-decoration: none; opacity: 0.66; }
/* twitter */
.button-twitter { display: block; box-sizing: border-box; height: 56px; border: 2px solid #000000; border-radius: 4px;
background: url("../images/smp/icon_twitter.png") 18% 50% no-repeat; color: #000000; text-align: left; line-height: 56px; background-size:26px;
padding-left:30%; }
.button-twitter:link, .button-twitter:visited { color: #000000; }
.button-twitter:active, .button-twitter.active { color: #000000; text-decoration: none; opacity: 0.66; }
/* facebook */
.button-facebook { display: block; box-sizing: border-box; height: 56px; border: 2px solid #0866FF; border-radius: 4px;
background: url("../images/smp/icon_facebook_new.png") 18% 50% no-repeat; color: #0866FF; text-align: left; line-height: 56px; background-size:26px;
padding-left:30%; }
.button-facebook:link, .button-facebook:visited { color: #0866FF; }
.button-facebook:active, .button-facebook.active { color: #0866FF; text-decoration: none; opacity: 0.66; }
/* 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:active, .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:active, .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?20181009"); background-position: 50% 25%; background-size: 30px auto; }
.button-scout2 { background-image: url("../images/smp/icon_scout_smp.png"); background-position: 50% 25%; background-size: 30px auto; }
.button-guide { background-image: url("../images/icon_guide.png?20181009"); background-size: 25px auto; }
.button-guide2 { background-image: url("../images/smp/icon_guide_smp.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_conditions.png"); background-size: 26px auto; }
.button-new { background-image: url("../images/icon_new.png"); background-size: 26px auto; }
.button-checkbox { 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:active, .button-content-add:active { text-decoration: none; opacity: 0.66; }
/* =============================================================================
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 0px; 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: 0.8rem; line-height: 1; }
.tags2 { margin: 0 0 0px; letter-spacing: -0.4em; }
.tags2 > li { display: inline-block; margin-right: 5px; padding: 2px 4px; border: 1px solid #909998; color: #909998;
white-space: nowrap; letter-spacing: normal; font-size: 0.8rem; line-height: 1; }
/* =============================================================================
Badge
============================================================================= */
/* New
------------------------------------------ */
.badge-new::before { position: absolute; top: -5px; left: -5px; z-index: 1; 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-number2{ /*    display: inline-block;*/ margin: 0px; padding: 0px; padding-left:4px; padding-right:4px; background: #fc3601;
color: #fff; font-weight: bold; font-size: 1.4rem; }
.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; }
.company-reservation .icon-arrow { position:absolute; padding-left: 9px; height: 14px; right:12px; }
.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-arrow2 { /*    position: relative;*/ height: 14px; }
.icon-arrow2::after { display: block; position: absolute; top: 25%; right: 12px; 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-arrow3 { /*    position: relative;*/ height: 14px; }
.icon-arrow3::after { display: block; position: absolute; /*    top: 34%;*/ right: 12px; margin-top: 30px; 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.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::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-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: 36px; 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.png") left center no-repeat; background-size: 21px auto; }
.icon-building::before { background: url("../images/icon_building.png") left center no-repeat; background-size: 18px; }
.icon-person::before { background: url("../images/icon_person.png") left center no-repeat; background-size: 18px; }
.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 { background: url("../images/icon_schedule.png") left center no-repeat; background-size: 24px; }
.icon-star::before { background: url("../images/icon_star.png") left center no-repeat; background-size: 24px; }
.icon-checkboard { margin-right: 10px; width: 25px; height: 28px; background: url("../images/icon_checkboard.png") no-repeat; vertical-align: text-bottom;}
/* =============================================================================
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 > li.narrow { min-height: auto; }
.list-flex > li .with-icon { width: 100%; padding-right: 15px; box-sizing: border-box; overflow: hidden; text-overflow: ellipsis;
white-space: nowrap; }
.list-flex > li.button { border-radius: 0; box-shadow: none; }
.list-flex a { display: block; width: 100%; text-align: center; }
.list-flex a.left { text-align: left; }
/* =============================================================================
Table
============================================================================= */
/* Default
------------------------------------------ */
.table { margin: 0; padding: 0; border-collapse: collapse; }
.table th { background-color: #e7e9e9; }
.table th{ padding: 0.75em; border: 1px solid #ccc; /*	border-bottom:none;*/ }
.table td { padding: 0.75em; border: 1px solid #ccc; /*	border-top:none;*/ }
.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; }
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::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 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:active, .tab-item > a:active { text-decoration: none; opacity: 0.75; }
.tab-item.is-current > a:active, .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;}
.modal-container.modal-container-lg { min-width: 820px; }
.infolist-header{ padding: 22px 40px 16px 10px!important; 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; }
.modal-title { margin: 0 0 20px; text-align: center; letter-spacing: 0.1em; font-size: 2.6rem; line-height: 1;}
.info-title { text-align: left!important;}
.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("/career/common/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:active { opacity: 0.66; }
.modal-scroll{ height:400px !important; overflow: auto; -webkit-overflow-scrolling:touch !important; }
/* =============================================================================
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:active { 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:active, .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:active, .menu-dropdown-item > a:active { text-decoration: none; opacity: 0.66; }
/* =============================================================================
Block / Box
============================================================================= */
/* Block
------------------------------------------ */
.block { position: relative; box-sizing: border-box; margin: 10px 0; padding: 25px 25px 25px 25px; box-shadow: 0px 3px 6px #00000029;
background-color: #fff; }
.block:first-child { margin-top: 0; margin-bottom: 25px;}
.block-image { float: left; margin: 0; width:50%; }
.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: 15px; min-height: 210px; border: 1px solid #909998;
padding-top: 0px; }
.box.box-lg { min-height: 226px; }
.box-title { /*    margin: 0 0 5px;*/ padding: 0 0 0 48px; font-size: 1.8rem; }
.box-title > em { font-style: normal; font-size: 1.8rem; }
.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: 1.6rem; 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: 0px; font-size: 1.4rem; line-height: 1.6rem; padding-bottom: 5px; }
.media-title.media-title-constrained { min-height: 0px; }
.media-body { margin-left: 130px; }
.media-description > p { margin: 0 0 1em; color: #000; line-height: 1.5714; font-size:1.2rem; }
.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: 0px; padding: 0px; /*    border: 1px solid #cdd1d1;*/ background-color: #fff;}
.section.section-skeleton { padding: 0px; border: none; background-color:#f7f7f7; }
.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: 10px; border-bottom: 1px solid #000; padding-top:14px; padding-bottom:14px; }
.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;*/ padding-bottom:10px; }
.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:active, .breadcrumb a:active { text-decoration: none; }
.breadcrumb ul { padding: 15px 10px; }
.breadcrumb li { display: inline; }
/* =============================================================================
Aside
============================================================================= */
.asides { position: relative; box-sizing: border-box; padding: 15px; background-color: #e7e9e9; }
/* 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; }
.search_smp { padding-bottom: 10px; }
.search_smp span { font-weight: bold; padding-bottom: 10px; display: block; }
.search_smp .button4 { height: 60px !important; }
/* =============================================================================
Member
============================================================================= */
/* member
------------------------------------------ */
.member { position: relative; margin: 20px 0 10px; }
.member-title { margin: 0 120px 12px 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; overflow-x: auto; max-height: none;}
.login-body { margin: 0 auto; max-width: 460px; width: 80%; }
.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 { position: relative; padding: 10px; border: 1px solid #909998; border-bottom: none; background-color: #0f5a84;
color: #fff; font-size: 1.8rem; }
.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; }
/* 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/form/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/form/icon_check_on.png") no-repeat 0 center; }
.regist-accordion .accordion_list.radio_type label { background: url("../images/form/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/form/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; }
.regist-submit-update-container > .button-gradetion-orange { display: block; margin: 10px auto 0; padding: 5px; width: 330px; height: 40px;
color: #0f5a84; border: none; font-size: 2.4rem; font-family: Meiryo, "メイリオ", -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", YuGothic, "游ゴシック", sans-serif; cursor: pointer; }
/* 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:active, .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:active, .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-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: 10px 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:active { 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
------------------------------------------ */
.l-responsive #header { min-width: 0; }
.l-responsive #header .l-left, .l-responsive #header .l-right { /*overflow: hidden;*/ box-sizing: border-box; width: auto; height: 61px; }
.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 .headerlogo-dsc { display: none; }
.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: 0px; }
.l-responsive #contents { margin: 10px auto 20px; margin-bottom:0px; }
.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-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:active, .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: 20px; padding-bottom: 20px;*/ border-radius: 4px; box-shadow: 1px 2px 0 #6e6f6f; font-size: 1.6rem;}
.l-responsive .button:active, .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: 51px; height: 44px; border-radius: 4px; background: url("../images/btn_applied_list.png") center no-repeat; background-color: #0f5a84;
background-size: 40px auto; }
.l-responsive .button-favorites-list { width: 68px; height: 44px; border-radius: 4px; background: url("../images/btn_favorited_list.png") center no-repeat; background-color: #6cb450;
background-size: 60px 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:active, .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-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:active, .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:active, .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: 31px;
height: 31px; border: 1px solid #fff; border-radius: 50%; white-space: nowrap; font-size: 1.2rem;
line-height: 31px; }
.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; }
.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 .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 .modal-header { padding: 24px 12px 0; border-top: 2px solid #ff6d00; }
.l-responsive .modal-title { margin: 0 20px 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::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-bottom: 10px; }
.l-responsive .section-header::before { height: 2px; }
.l-responsive .section-header.section-header-separate { position: relative; border: none; margin: 0; padding: 10px; box-shadow: 0px 0px 6px #00000029; background-color: #fff;}
.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-top: 10px; padding-left: 10px; padding-right: 10px; }
.l-responsive .section-body:last-child { margin-bottom: 0; }
.l-responsive .member { margin: 0; padding-right: 60px; height: 56px; width: 126px; }
.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-favorites { position: relative; display: inline-block; top: 6px; width: 75px; }
.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-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 .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 { 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; }
.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-select { height: 100%; }
.l-responsive .regist-modal .modal-container { margin-top: 5%; }
.l-responsive .regist-accordion { z-index: 0; overflow-x: hidden; overflow-y: scroll; -webkit-overflow-scrolling: touch; max-height: 300px;
height: 80%; -webkit-transform: translateZ(0); transform: translateZ(0); /* form.css より*/}
.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 .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; }
.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 0; border: 2px solid #fc3601; text-align: left; font-weight: bold;
font-size: 1.2rem; line-height: 1.33; padding-left:45px; }
.mobile #ctl00_ContentPlaceHolder1_MyErrInfo_errDiv .notice-important-container { box-sizing: border-box; padding: 0 0 10px; border: 2px solid #fc3601; border-top: none; 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: 35px; height: 35px; }
.l-responsive .list-pager-link > a span { font-weight: bold; font-size: 1.6rem; }
.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; }
/* 追記 2017/04/ */
.pc_view{ display:none; }
.smp_view{ display:block; }
.fll{ float:left; }
.flr{ float:right; }
.clear{ clear:both; }
.fwb{ font-weight:bold; }
.pb5{ padding-bottom:5px; }
.pb10{ padding-bottom:10px; }
.pb40{ padding-bottom:40px; }
.pb20{ padding-bottom:20px; }
.pt5{ padding-top:5px; }
.pt10{ padding-top:10px; }
.pt20{ padding-top:20px; }
.pt40{ padding-top:40px; }
.mt10{ margin-top:10px; }
.mb0{ margin-bottom:0px; }
.mb10{ margin-bottom:10px; }
.mt20{ margin-top:20px; }
.mb20{ margin-bottom:20px; }
.mr10{ margin-right:10px; }
.mr20{ margin-right:20px; }
.ml10{ margin-left:10px; }
.ml20{ margin-left:20px; }
.pl10{ padding-left:10px !important; }
.pr10{ padding-right:10px !important; }
.pr5{ padding-right:5% !important; }
.pl20{ padding-left:20px !important; }
.pr20{ padding-right:20px !important; }
.bgc_fffbcd{ background-color:#fffbcd !important; }
.bgc_f7f7f7{ background-color:#f7f7f7 !important; }
.bgc_0f5a84{ background-color:#0f5a84 !important; }
.bgc_909998{ background-color:#909998 !important; }
.bgc_fed88e{ background-color:#fed88e !important; }
.bgc_ff6d00 { background-color:#ff6d00 !important; }
.bgc_f{ background-color:#fff !important; }
.bgc_4{ background-color:#444 !important; }
/**/
/* Read More 不満検索
------------------------------------------ */
.readmore { position: relative; }
.readmore-launcher { position: absolute; bottom: 0; left: 0; padding: 26px 0 0; width: 100%;
background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0), white 38%); background: linear-gradient(180deg, rgba(255, 255, 255, 0), white 38%); text-align: right; }
.readmore-launcher.is-open { padding: 0px 0 0; background: none; }
.readmore-more { padding-bottom: 54px; }
.bgc_fffbcd .readmore-launcher{ background: -moz-linear-gradient(top,  rgba(255,251,205,0) 0%, rgba(255,251,205,1) 38%, rgba(255,251,205,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(255,251,205,0) 0%,rgba(255,251,205,1) 38%,rgba(255,251,205,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(255,251,205,0) 0%,rgba(255,251,205,1) 38%,rgba(255,251,205,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00fffbcd', endColorstr='#fffbcd',GradientType=0 ); /* IE6-9 */}
.arrow{ position: relative; display: inline-block; padding: 0 0 0 16px; color: #000; vertical-align: middle;
text-decoration: none; }
.arrow::before, .arrow::after{ position: absolute; top: -1px; bottom: 0; left: 0; margin: auto;
content: ""; vertical-align: middle; }
.arrow-bottom::before{ width: 12px; height: 12px; background: #0f5a84; }
.arrow-bottom::after{ top: -3px; left: 3px; width: 4px; height: 4px; border-top: 2px solid #fff;
border-right: 2px solid #fff; -webkit-transform: rotate(135deg); transform: rotate(135deg); }
.arrow-top::before{ width: 12px; height: 12px; background: #0f5a84; }
.arrow-top::after{ top: 0px; left: 3px; width: 4px; height: 4px; border-top: 2px solid #fff;
border-right: 2px solid #fff; -webkit-transform: rotate(315deg); transform: rotate(315deg); }
.arrow2{ display:block; width:100%; height:18px; background-color:#054265; padding:0;
margin:0; margin-top:12px; }
.arrow2 span{ position:relative; top:13px; width: 0; height: 0; border: 5px solid transparent;
border-top: 5px solid #fff; }
.arrow3{ display:block; width:100%; height:18px; background-color:#054265; padding:0;
margin:0; margin-bottom:12px; }
.arrow3 span{ position:relative; top:-10px; width: 0; height: 0; border: 5px solid transparent;
border-bottom: 5px solid #fff; }
.btn_w1{ width:45%; }
.w2{ width:92%; }
.w3{ width:45%; padding-left:5%; }
.w4{ width:10%; }
.w5{ width:100% !important; }
.w6{ width:180px; }
.w7{ width:37%; padding-right:5%; }
.w7 img{ width:100%; }
.w8{ width:58%; }
.w9{ width:30%; }
.w10{ margin-left:10px; width:75%; padding-right:3%; }
.w11{ width:17%; }
.w12{ width:23%; padding-right:5%; display: table-cell; vertical-align: middle; }
.w13{ width:67%; display: table-cell; vertical-align: middle; }
.w13 h3{ line-height:1.8rem; padding-bottom:0px !important; font-size:1.2rem !important; }
.w14{ width:80%; padding-right:3%; }
.btn_h1{ /*height:60px;*/ }
.fln{ float:none !important; }
.d_b{ display:block; }
.dis_b{ /*	display:block;*/ }
.dis_b th{ display:block; }
.dis_b td{ display:block; }
.border1{ border-top:solid 1px #ccc; }
.border2{ border-top:solid 1px #909998; }
.border3{ border-left:solid 4px #ff6d00; padding-left:5px; }
.pb10{ padding-bottom:10px; }
.pt10{ padding-top:10px; }
.fc_b72727{ color:#b72727; }
.fc_f{ color:#fff; }
.fc_383838{ color:#383838; }
.fc_383838 a{ color:#383838; }
.cover1{ position:relative; /*    bottom: 0; left: 0;*/ padding: 40px 0 0; width: 100%; background: -webkit-linear-gradient(top, rgba(247, 247, 247, 0), rgb(247, 247, 247) 38%);
background: linear-gradient(180deg, rgba(247, 247, 247, 0), rgb(247, 247, 247) 38%); text-align: right; margin-top:-50px; }
.l-responsive .button3 { display: block; padding-top: 15px; padding-bottom: 15px; border-radius: 4px; box-shadow: 1px 2px 0 #6e6f6f;
font-size: 1.6rem; }
.l-responsive .button3:active, .l-responsive .button3:active { box-shadow: none; }
.l-responsive .button3::after { margin-top: -5px; width: 6px; height: 6px; content: ""; }
.l-responsive .button4 { border-radius: 4px; box-shadow: 1px 2px 0 #6e6f6f; font-size: 1.2rem; }
.botton5{ position: relative; box-sizing: border-box; margin: 0 0 10px; padding: 0 4px; width: 49%;}
.botton5 .button-icon2{ background-color:#ff6d00; }
.button-icon2 { display: block; overflow: hidden; box-sizing: border-box; padding: 30px 2px 4px; width: 100%;
height: 60px; border-width: 2px; border-color: #ff6d00; background-color: #fff; background-position: 5% 50%;
background-repeat: no-repeat; text-align: center; font-weight: bold; font-size: 1.2rem; align-items: center;
-webkit-box-align: center; padding-left:40px; }
.botton5 .button-icon2:link,.botton5 .button-icon2:visited { color: #fff; }
.botton5 .button-icon2:active, .botton5 .button-icon2:active { color: #fff; text-decoration: none; }
.botton5 .button-icon2::after { display: none; }
.botton5 .button-icon2 > span { display: block; position:relative; top: 0%; right: 0; left: 0;
width: 100%; -webkit-transform: translateY(-50%); transform: translateY(-50%); }
.botton5 .button { box-shadow: 1px 3px 0 #000; }
.tal{ text-align:left !important; }
.tac{ text-align:center !important; }
.fs1{ font-size:1.2rem; }
/*レコメンド用*/
#recmnd_addarea .block { padding: 25px 25px 25px 7px !important; }
#recmnd_addarea .block-footer { margin: 0px -25px -25px -7px!important; }
#recmnd_addarea .block-image { width:84px; }
#recmnd_addarea .recruit-title { margin: 10px 0 8px; font-size: 1.2rem; line-height: 1.7; }
#recmnd_addarea .recruit-company { padding:5px 0px; text-align:right; }
#recmnd_addarea .w3 { width:60%; }
#recmnd_addarea2 .block { padding: 25px 25px 25px 7px !important;}
#recmnd_addarea2 .block-footer { margin: 0px -25px -25px -7px!important;}
#recmnd_addarea2 .block-image { width:84px;}
#recmnd_addarea2 .recruit-title { margin: 10px 0 8px; font-size: 1.2rem; line-height: 1.7;}
#recmnd_addarea2 .recruit-company { padding:5px 0px; text-align:right; }
#recmnd_addarea2 .w3 { width:60%;}
#RecommendArea .entry-note { margin: 0px 0px 20px; padding: 1em; }
#RecommendArea .entry-aside .block-footer { position: inherit!important; }
#RecommendArea #recmnd_addarea .block-footer { margin: 0px -25px -25px -7px!important; position: inherit!important; }
#RecommendArea .badge-new:before { content: "NEW"; font-family: Helvetica,Arial,sans-serif; height: 55px; line-height: 55px; text-align: center;
width: 60px; font-size: 1.4rem; top: -10px; }
#RecommendArea .icon-area { background-size: 18px 18px; }
#RecommendArea{ padding-bottom:0px!important; margin-bottom:0px!important; }
.SpdApp { position: fixed; top: 55%; left: 50%; transform: translate(-50%, -50%); z-index: 1001;
width: 95%; }
#SpdAppBg { position:fixed; z-index: 100; top:0px; left:0px; width:100%;
height:500%; 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:39px; }
.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; display: inline-block; width: 11%; height: 38px; border: 1px solid #cdd1d1; margin-right: 5px;
border-radius: 50%; background: #fff no-repeat center center / contain; vertical-align: top; }
.tblSpdApp td { padding: 10px 0px; }
.infolist-header.modal-header { padding:22px 16px 0px 20px; }
@media screen and (max-width: 599px) {.infolist-header.modal-header { padding:11px 5px 0px 5px !important;} .SpdappContent { border-right: none !important }}
.infoScr { overflow: scroll; overflow-y: hidden !important;}
.SpdappContent { overflow-y: scroll; border-right: solid 15px #fff;}
@media screen and (max-width: 330px) { .SpdappContent { max-height: 250px !important; }}
.icon-hourglass::before { background: url("../images/top/icon_hourglass.png") left center no-repeat; }
/* header-oshirase
------------------------------------------ */
html,body { height:100%; }
.is-fixed { position: fixed; width: 100%; height: 100%; left: 0; }
.header-oshirase-btn, .header-oshirase-modal { display: none !important; }
.top-oshirase-btn { display: block; position: relative; margin: 13px 4px 0; padding: 3px; background-color: #fff;
border: 2px solid #196bbf; border-radius: 5px; cursor: pointer; text-align: center; }
.top-oshirase-btn .main { display: inline-block; vertical-align: middle; font-size: 13px; font-weight: bold; margin: 0;
padding: 0; }
.top-oshirase-btn img { width: 20px !important; height: auto; vertical-align: -2.5px; margin-right: 5px; }
.top-oshirase-btn .number { display: inline-block; vertical-align: middle; font-size: 10px; font-weight: bold; transform: scale(0.9);
color: #fff; text-align: center; padding: 3px; margin: 0; min-width: 16px;
line-height: 16px; background-color: #FC3601; border-radius: 100px; }
.top-oshirase-modal { display: none; position: fixed; top: 14px; left: 14px; z-index: 999;
background-color: #fff; width: calc(100% - 28px); border-radius: 5px; box-shadow: 0px 0px 7px 4px rgba(0, 0, 0, 0.2); }
.top-oshirase-modal::after { content: ""; display: block; width: 100%; height: 100%; position: fixed;
top: 0; left: 0; z-index: -1; background-color: rgba(255, 255, 255, 0.8); }
.top-oshirase-modal .ttl { background-color: #D0DDEB; font-size: 18px; font-weight: bold; color: #00338B; text-align: center;
margin: 0; line-height: 40px; border-radius: 5px 5px 0 0; position: relative; }
.top-oshirase-modal .close { position: absolute; top: 0; right: 0; width: 40px; cursor: pointer;}
.header-oshirase-modal .close:hover { opacity: 0.7; }
.top-oshirase-modal .close img { width: 16px; height: auto; vertical-align: middle; }
.top-oshirase-modal .list { width: 100%; border-top: 0; border-radius: 0 0 5px 5px; box-sizing: border-box;
overflow-y: scroll; -webkit-overflow-scrolling:touch; }
.top-oshirase-modal li { position: relative; }
/*.top-oshirase-modal li::after { content: ""; width: 8px; height: 8px; border-top: 4px solid #0f5a84; border-right: 4px solid #0f5a84;
opacity: 0.3; position: absolute; top: 50%; right: 13px; margin-top: -4px;
transform: rotate(45deg); }*/
.top-oshirase-modal a { display: block; padding: 0px 0px 9px 0px; color: #666666; }
.top-oshirase-modal .category { float: left; display: flex; align-items: center; background-color: #0f5a84; font-size: 11px;
line-height: 23px; color: #fff; padding: 0 7px; margin: 0 0 10px; width: 210px; height: 20px; }
.top-oshirase-modal .category img { width: 15px; height: auto; margin-right: 5px; }
.top-oshirase-modal .date { color: #999999; font-size: 11px; font-weight: inherit; float: right; margin: 5px 9px 0 0;}
.top-oshirase-modal .main { width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center;}
.top-oshirase-modal .img { overflow: hidden; width: 38px; height: 38px; border: 1px solid #ccc; border-radius: 100px; margin: 0px 0px 14px 12px; }
.top-oshirase-modal .img span { width: 38px; height: 38px; box-sizing: content-box; background: #fff no-repeat center center / contain; display: inline-block;}
.top-oshirase-modal .txt { flex: 1; font-size: 12px; margin: 0px 12px 0px 12px; }
.top-oshirase-modal .txt span { overflow: hidden; position: relative; display: block; text-align: justify; text-justify: inter-ideograph;
line-height: 1.5; max-height: calc(2em * 1.5); color: #666666; }
.top-oshirase-modal .txt span:first-child::before { content: "..."; position: absolute; right: 0; bottom: 0; background-color: #fff;
width: 1em; height: 1.5em; letter-spacing: -0.05em; }
.top-oshirase-modal .txt span:first-child::after { content: ""; position: absolute; right: 0; width: 1em; height: 1.5em;
background-color: #fff; }
.top-oshirase-modal .txt span strong { font-weight: normal; }
.top-oshirase-modal .list .is-kouho .category { background-color: #FC3601; }
.top-oshirase-modal .list .is-kouho strong { color: #FC3601; }
.top-oshirase-modal .list .is-like .category { background-color:  #909CB5; }
.top-oshirase-modal .list .is-like strong { color:  #909CB5; }
.top-oshirase-modal .list .is-only .category { background-color: #FF6B01; }
.top-oshirase-modal .list .is-only strong { color: #FF6B01; }
.top-oshirase-modal .list .is-welcome .category { background-color: #71C414; }
.top-oshirase-modal .list .is-welcome strong { color: #71C414; }
.top-oshirase-modal .list .is-scout .category { background-image:url(../images/headhunting_backcolor.png);background-repeat: no-repeat; background-size: cover; background-color: rgba(0,0,0,0); }
.top-oshirase-modal .list .is-scout strong { color: #E8007C; }
.top-oshirase-modal .list .is-profile .category { background-color: #0F5A84; }
.top-oshirase-modal .list .is-profile strong { color: #0F5A84; }
.top-oshirase-modal .list .is-new { background-color: #fcfade !important; }
.top-oshirase-modal .list .is-new .txt span:first-child::before { background-color: #fcfade; }
.top-oshirase-modal .list .is-new .txt span:first-child::after { background-color: #fcfade; }
.top-oshirase-modal .list .is-casual .category { background-image:url(../images/obi_casual_ribon.png);background-repeat: no-repeat; background-size: contain; background-color: rgba(0,0,0,0); }
.top-oshirase-modal .list .is-casual strong { color: #0E987C; }
@media only screen and (max-width: 374px) { .top-oshirase-modal .list .category, .top-oshirase-modal .date { float: none; margin-bottom: 7px; }
.top-oshirase-modal .date { display: block; margin: 0 0 7px; }}
.header-todilist-btn{ display: none!important; }
}
/*******************************************************************************
'/career/css/common.cssから貼り付け
'*******************************************************************************/
@media only screen and (min-width:600px), print {
@import url("https://fonts.googleapis.com/earlyaccess/notosansjapanese.css");
/* =============================================================================
#
# 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; }
/*削除 .tokuten-note { margin: 18px 0 0; text-align: left; } */
/* 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 {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 2px 0 rgba(110, 111, 111, 0.47);
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; }
/* outline */
.button-outline { border: 1px solid #ccc; }
.button-photo-upload { box-sizing: border-box; padding: 4px 5px 3px; min-width: 186px; line-height: 1; }
/* 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 #000000; border-radius: 4px;
background: url("../images/icon_X.png") 4% 50% no-repeat; color: #000000; text-align: left; line-height: 40px; padding-left: 20%; }
.button-twitter:link, .button-twitter:visited { color: #000000; }
.button-twitter:hover, .button-twitter.active { color: #000000; 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 #0866FF; border-radius: 4px;
background: url("../images/icon_facebook_new.png") 4% 50% no-repeat; color: #0866FF; text-align: left; line-height: 40px; padding-left: 20%; }
.button-facebook:link, .button-facebook:visited { color: #0866FF; }
.button-facebook:hover, .button-facebook.active { color: #0866FF; 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("../images/Line_login_button.png") center no-repeat; width:180px; height:40px; background-size: contain;}
.button-login-apple { background: url("../images/btn_apple.png") center no-repeat; width:180px; height:40px; background-size: contain;}
.button-login-facebook { background: url("../images/Facebook_login_button.png") center no-repeat; width:180px; height:40px; background-size: contain; }
.button-login-yahoo { background: url("../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; }
/* =============================================================================
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.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::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-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.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 { background: url("../images/icon_search.png") left center no-repeat; width: 20px; height: 20px; }*/
.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; }
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::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 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;}
.modal-container.modal-container-lg { min-width: 820px; }
.infolist-header{padding: 22px 12px 0 !important; 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; }
.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("/career/common/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;  box-shadow: 0px 0px 6px #00000029;
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; box-shadow: 0px 0px 6px #00000029;
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; }
/* =============================================================================
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; }
.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.6rem; }
.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; }
.lgnstr{margin: 3px;font-size: 13px; clear:both;}
.lngpssf{float:right;text-decoration: underline;font-size: 13px;}
.lgnli1,.lgnli2,.lgnli3 {display:inline-block;}
/* =============================================================================
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; }
/* 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/form/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/form/icon_check_on.png") no-repeat 0 center; }
.regist-accordion .accordion_list.radio_type label { background: url("../images/form/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/form/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; }
.regist-submit-update-container > .button-gradetion-orange { display: block; margin: 10px auto 0; padding: 5px; width: 330px; height: 40px; color: #0f5a84; border: none; font-size: 2.2
    rem; font-family: Meiryo, "メイリオ", -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", YuGothic, "游ゴシック", sans-serif; cursor: pointer; }
/* 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 (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: 40px; height: 40px; border: 1px solid #cdd1d1; display: inline-block; margin-right: 5px;
border-radius: 50%; background: #fff no-repeat center center / contain; vertical-align: top; }
.tblSpdApp td { padding: 10px 0px; }
/* 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; }
.modal-container-infolist .list { width: 100%; max-height: 606px; border-radius: 0 0 5px 5px;
box-sizing: border-box; overflow-y: scroll; }
.modal-container-infolist li { position: relative; width: 490px; }
.modal-container-infolist li::after { content: ""; width: 8px; height: 8px; border-top: 3px solid #0f5a84; border-right: 3px solid #0f5a84;
opacity: 0.3; position: absolute; top: 50%; right: 13px; margin-top: -4px;
transform: rotate(45deg); }
.modal-container-infolist a { display: block; padding: 0px 5px 11px 0px; color: #666666; }
.modal-container-infolist a:hover { text-decoration: none; background-color: #edf2f7; }
.modal-container-infolist .category { float: left; display: inline-block; background-color: #0f5a84; font-size: 11px; color: #fff; margin: 0 0 10px; }
.modal-container-infolist .category img { width: 15px; height: auto; vertical-align: middle;   margin-left: 5px;  margin-bottom: 2px; }
.modal-container-infolist .is-only .category img { width: 12px; height: auto; vertical-align: middle;   margin-left: 5px;  margin-bottom: 0; }
.modal-container-infolist .is-kouho .category img { width: 15px; height: auto; vertical-align: middle;   margin-left: 5px;  margin-bottom: 0; }
.modal-container-infolist .is-like .category img { width: 15px; height: auto; vertical-align: middle;   margin-left: 5px;  margin-bottom: 0; }
.modal-container-infolist .date { color: #999999; font-size: 11px;  float: right; margin: 3px -30px 0 0;}
.modal-container-infolist .main { width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center;}
.modal-container-infolist .img { overflow: hidden; width: 38px; height: 38px; border: 1px solid #ccc; border-radius: 100px; margin: 0 0 0 12px; }
.modal-container-infolist .img span { width: 38px; height: 38px; box-sizing: content-box; background: #fff no-repeat center center / contain; display: inline-block;}
.modal-container-infolist .txt { flex: 1; font-size: 13px; margin: 0; margin-left: 13px;}
.modal-container-infolist .txt span { font: normal normal normal 13px/18px Noto Sans JP; overflow: hidden; position: relative; display: block; text-align: justify; text-justify: inter-ideograph;
line-height: 1.3; color: #666666; }
.modal-container-infolist .txt span:first-child::before { content: "..."; position: absolute; right: 0; bottom: 0; width: 1em;
height: 1.5em; background-color: #fff; letter-spacing: -0.05em; }
.modal-container-infolist .txt span:first-child::after { content: ""; position: absolute; right: 0; width: 1em; height: 1.5em;
background-color: #fff; }
.modal-container-infolist a:hover .txt span::before, .modal-container-infolist a:hover .txt span::after, .modal-container-infolist .list .is-new a:hover .txt span::before, .modal-container-infolist .list .is-new a:hover .txt span::after { background-color: #edf2f7; }
.modal-container-infolist .txt span strong { font-weight: normal; }
.modal-container-infolist .list .is-kouho .category { background-color: #FC3601; }
.modal-container-infolist .list .is-kouho strong { color: #FC3601; }
.modal-container-infolist .list .is-like .category { background-color:  #909CB5; }
.modal-container-infolist .list .is-like strong { color:  #909CB5; }
.modal-container-infolist .list .is-only .category { background-color: #FF6B01; }
.modal-container-infolist .list .is-only strong { color: #FF6B01; }
.modal-container-infolist .list .is-welcome .category { background-color: #71C414; }
.modal-container-infolist .list .is-welcome strong { color: #71C414; }
.modal-container-infolist .list .is-scout .category { background-image:url("../images/headhunting_backcolor.png"); background-repeat: no-repeat; background-size: cover; background-color: rgba(0,0,0,0); }
.modal-container-infolist .list .is-scout strong { color: #E8007C; }
.modal-container-infolist .list .is-profile .category { background-color: #0F5A84; }
.modal-container-infolist .list .is-profile strong { color: #0F5A84; }
.modal-container-infolist .list .is-new { background-color: #fcfade !important; }
.modal-container-infolist .list .is-new .txt span:first-child::before { background-color: #fcfade; }
.modal-container-infolist .list .is-new .txt span:first-child::after { background-color: #fcfade; }
.modal-container-infolist .list .is-casual .category { background-image:url("../images/obi_casual_ribon.png"); background-repeat: no-repeat; background-size: contain; background-color: rgba(0,0,0,0); }
.modal-container-infolist .list .is-casual strong { color: #0E987C; }
/*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; }
}
.modal-container-infolist .list_design {
    border-radius: 6px;
    margin-bottom: 10px;
    margin-left: 10px;
    background-color: #fff;
    box-shadow: 0px 3px 6px #00004A26;
}
.list_design_SP{
    border-radius: 6px;
    margin-bottom: 10px;
    margin-right: 12px;
    margin-left: 12px;
    background-color: #fff;
    box-shadow: 0px 3px 6px #00004A26;
}
.title_design{
    width: 210px;
    height: 20px;
    font-size: 5px;
}
.infolist_style{  background: #FFFFFF 0% 0% no-repeat padding-box; box-shadow: 0px 3px 6px #00004a26; border-radius: 6px; opacity: 1;}
.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;}
.modal-container-infolist .icon_space_welcome {margin-left: 63px; vertical-align: middle;}
.modal-container-infolist .icon_space_only {margin-left: 7px; vertical-align: middle;}
.modal-container-infolist .icon_space_profile {margin-left: 30px; vertical-align: middle;}
.modal-container-infolist .icon_space_scout {margin-left: 40px; vertical-align: middle;}
.modal-container-infolist .icon_space_kouho {margin-left: 28px; vertical-align: middle;}
.modal-container-infolist .icon_space_like {margin-left: 28px; vertical-align: middle;}
.modal-container-infolist .icon_space_casual {margin-left: 40px; vertical-align: middle;}

.infolist-shadow{
        box-shadow: 0px 3px 6px #00004a26;
        margin-bottom: 10px;
}
.info-head {
    margin-left: 10px;
}
.header-oshirase-modal .txt span.shokushu_name_bold,.modal-container-infolist .txt span.shokushu_name_bold,.top-oshirase-modal .txt span.shokushu_name_bold { font-weight: bold; font-size: 11px; padding-top: 4px !important;}
.header-oshirase-modal .txt span.casual_kigen,.modal-container-infolist .txt span.casual_kigen,.top-oshirase-modal .txt span.casual_kigen { font-weight: bold; font-size: 11px; padding-top: 4px !important; font-family: 'Meiryo'; }
/*******************************************************************************
'/career/css/head_smp.cssから貼り付け
'*******************************************************************************/
@media only screen and (max-width: 599px) {
/* =============================================================================
気になる
============================================================================= */
/* Base layout
------------------------------------------ */
.member-favorites { position: relative; display: inline-block!important; top: 6px; width: 75px; }
.member-applications { overflow: inherit!important; }
.button-favorites-list { display: inline-block; overflow: hidden; width: 68px; height: 44px; border-radius: 4px; background: url("../images/btn_favorited_list.png") center no-repeat; background-color: #6cb450; background-size: 60px auto; text-indent: 100%; white-space: nowrap; }
.button-applications { width: 51px!important; height: 44px!important; border-radius: 4px!important; background: url("../images/btn_mypage.png") center no-repeat!important; background-color: #0f5a84!important; background-size: 44px auto!important; }
}