/*!
 *  Font Awesome 4.7.0 by @davegandy - http://fontawesome.io - @fontawesome
 *  License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)
 */
@import url(//fonts.googleapis.com/css?family=Noto%20Serif%20JP);
@import url(//fonts.googleapis.com/css?family=Noto%20Serif%20JP);

@font-face {
    font-family: 'FontAwesome';
    src: url(/assets/fontawesome-webfont-7bfcab6db99d5cfbf1705ca0536ddc78585432cc5fa41bbd7ad0f009033b2979.eot);
    src: url(/assets/fontawesome-webfont-7bfcab6db99d5cfbf1705ca0536ddc78585432cc5fa41bbd7ad0f009033b2979.eot?#iefix) format("embedded-opentype"), url(/assets/fontawesome-webfont-2adefcbc041e7d18fcf2d417879dc5a09997aa64d675b7a3c4b6ce33da13f3fe.woff2) format("woff2"), url(/assets/fontawesome-webfont-ba0c59deb5450f5cb41b3f93609ee2d0d995415877ddfa223e8a8a7533474f07.woff) format("woff"), url(/assets/fontawesome-webfont-aa58f33f239a0fb02f5c7a6c45c043d7a9ac9a093335806694ecd6d4edc0d6a8.ttf) format("truetype"), url(/assets/fontawesome-webfont-ad6157926c1622ba4e1d03d478f1541368524bfc46f51e42fe0d945f7ef323e4.svg#fontawesomeregular) format("svg");
    font-weight: normal;
    font-style: normal
}

.fa {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.fa-lg {
    font-size: 1.33333333em;
    line-height: 0.75em;
    vertical-align: -15%
}

.fa-2x {
    font-size: 2em
}

.fa-3x {
    font-size: 3em
}

.fa-4x {
    font-size: 4em
}

.fa-5x {
    font-size: 5em
}

.fa-fw {
    width: 1.28571429em;
    text-align: center
}

.fa-ul {
    padding-left: 0;
    margin-left: 2.14285714em;
    list-style-type: none
}

.fa-ul>li {
    position: relative
}

.fa-li {
    position: absolute;
    left: -2.14285714em;
    width: 2.14285714em;
    top: 0.14285714em;
    text-align: center
}

.fa-li.fa-lg {
    left: -1.85714286em
}

.fa-border {
    padding: .2em .25em .15em;
    border: solid 0.08em #eeeeee;
    border-radius: .1em
}

.fa-pull-left {
    float: left
}

.fa-pull-right {
    float: right
}

.fa.fa-pull-left {
    margin-right: .3em
}

.fa.fa-pull-right {
    margin-left: .3em
}

.pull-right {
    float: right
}

.pull-left {
    float: left
}

.fa.pull-left {
    margin-right: .3em
}

.fa.pull-right {
    margin-left: .3em
}

.fa-spin {
    -webkit-animation: fa-spin 2s infinite linear;
    animation: fa-spin 2s infinite linear
}

.fa-pulse {
    -webkit-animation: fa-spin 1s infinite steps(8);
    animation: fa-spin 1s infinite steps(8)
}

@-webkit-keyframes fa-spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    100% {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg)
    }
}

@keyframes fa-spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    100% {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg)
    }
}

.fa-rotate-90 {
    -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)";
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg)
}

.fa-rotate-180 {
    -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2)";
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg)
}

.fa-rotate-270 {
    -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=3)";
    -webkit-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    transform: rotate(270deg)
}

.fa-flip-horizontal {
    -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1)";
    -webkit-transform: scale(-1, 1);
    -ms-transform: scale(-1, 1);
    transform: scale(-1, 1)
}

.fa-flip-vertical {
    -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)";
    -webkit-transform: scale(1, -1);
    -ms-transform: scale(1, -1);
    transform: scale(1, -1)
}

:root .fa-rotate-90,
:root .fa-rotate-180,
:root .fa-rotate-270,
:root .fa-flip-horizontal,
:root .fa-flip-vertical {
    filter: none
}

.fa-stack {
    position: relative;
    display: inline-block;
    width: 2em;
    height: 2em;
    line-height: 2em;
    vertical-align: middle
}

.fa-stack-1x,
.fa-stack-2x {
    position: absolute;
    left: 0;
    width: 100%;
    text-align: center
}

.fa-stack-1x {
    line-height: inherit
}

.fa-stack-2x {
    font-size: 2em
}

.fa-inverse {
    color: #ffffff
}

.fa-glass:before {
    content: "\f000"
}

.fa-music:before {
    content: "\f001"
}

.fa-search:before {
    content: "\f002"
}

.fa-envelope-o:before {
    content: "\f003"
}

.fa-heart:before {
    content: "\f004"
}

.fa-star:before {
    content: "\f005"
}

.fa-star-o:before {
    content: "\f006"
}

.fa-user:before {
    content: "\f007"
}

.fa-film:before {
    content: "\f008"
}

.fa-th-large:before {
    content: "\f009"
}

.fa-th:before {
    content: "\f00a"
}

.fa-th-list:before {
    content: "\f00b"
}

.fa-check:before {
    content: "\f00c"
}

.fa-remove:before,
.fa-close:before,
.fa-times:before {
    content: "\f00d"
}

.fa-search-plus:before {
    content: "\f00e"
}

.fa-search-minus:before {
    content: "\f010"
}

.fa-power-off:before {
    content: "\f011"
}

.fa-signal:before {
    content: "\f012"
}

.fa-gear:before,
.fa-cog:before {
    content: "\f013"
}

.fa-trash-o:before {
    content: "\f014"
}

.fa-home:before {
    content: "\f015"
}

.fa-file-o:before {
    content: "\f016"
}

.fa-clock-o:before {
    content: "\f017"
}

.fa-road:before {
    content: "\f018"
}

.fa-download:before {
    content: "\f019"
}

.fa-arrow-circle-o-down:before {
    content: "\f01a"
}

.fa-arrow-circle-o-up:before {
    content: "\f01b"
}

.fa-inbox:before {
    content: "\f01c"
}

.fa-play-circle-o:before {
    content: "\f01d"
}

.fa-rotate-right:before,
.fa-repeat:before {
    content: "\f01e"
}

.fa-refresh:before {
    content: "\f021"
}

.fa-list-alt:before {
    content: "\f022"
}

.fa-lock:before {
    content: "\f023"
}

.fa-flag:before {
    content: "\f024"
}

.fa-headphones:before {
    content: "\f025"
}

.fa-volume-off:before {
    content: "\f026"
}

.fa-volume-down:before {
    content: "\f027"
}

.fa-volume-up:before {
    content: "\f028"
}

.fa-qrcode:before {
    content: "\f029"
}

.fa-barcode:before {
    content: "\f02a"
}

.fa-tag:before {
    content: "\f02b"
}

.fa-tags:before {
    content: "\f02c"
}

.fa-book:before {
    content: "\f02d"
}

.fa-bookmark:before {
    content: "\f02e"
}

.fa-print:before {
    content: "\f02f"
}

.fa-camera:before {
    content: "\f030"
}

.fa-font:before {
    content: "\f031"
}

.fa-bold:before {
    content: "\f032"
}

.fa-italic:before {
    content: "\f033"
}

.fa-text-height:before {
    content: "\f034"
}

.fa-text-width:before {
    content: "\f035"
}

.fa-align-left:before {
    content: "\f036"
}

.fa-align-center:before {
    content: "\f037"
}

.fa-align-right:before {
    content: "\f038"
}

.fa-align-justify:before {
    content: "\f039"
}

.fa-list:before {
    content: "\f03a"
}

.fa-dedent:before,
.fa-outdent:before {
    content: "\f03b"
}

.fa-indent:before {
    content: "\f03c"
}

.fa-video-camera:before {
    content: "\f03d"
}

.fa-photo:before,
.fa-image:before,
.fa-picture-o:before {
    content: "\f03e"
}

.fa-pencil:before {
    content: "\f040"
}

.fa-map-marker:before {
    content: "\f041"
}

.fa-adjust:before {
    content: "\f042"
}

.fa-tint:before {
    content: "\f043"
}

.fa-edit:before,
.fa-pencil-square-o:before {
    content: "\f044"
}

.fa-share-square-o:before {
    content: "\f045"
}

.fa-check-square-o:before {
    content: "\f046"
}

.fa-arrows:before {
    content: "\f047"
}

.fa-step-backward:before {
    content: "\f048"
}

.fa-fast-backward:before {
    content: "\f049"
}

.fa-backward:before {
    content: "\f04a"
}

.fa-play:before {
    content: "\f04b"
}

.fa-pause:before {
    content: "\f04c"
}

.fa-stop:before {
    content: "\f04d"
}

.fa-forward:before {
    content: "\f04e"
}

.fa-fast-forward:before {
    content: "\f050"
}

.fa-step-forward:before {
    content: "\f051"
}

.fa-eject:before {
    content: "\f052"
}

.fa-chevron-left:before {
    content: "\f053"
}

.fa-chevron-right:before {
    content: "\f054"
}

.fa-plus-circle:before {
    content: "\f055"
}

.fa-minus-circle:before {
    content: "\f056"
}

.fa-times-circle:before {
    content: "\f057"
}

.fa-check-circle:before {
    content: "\f058"
}

.fa-question-circle:before {
    content: "\f059"
}

.fa-info-circle:before {
    content: "\f05a"
}

.fa-crosshairs:before {
    content: "\f05b"
}

.fa-times-circle-o:before {
    content: "\f05c"
}

.fa-check-circle-o:before {
    content: "\f05d"
}

.fa-ban:before {
    content: "\f05e"
}

.fa-arrow-left:before {
    content: "\f060"
}

.fa-arrow-right:before {
    content: "\f061"
}

.fa-arrow-up:before {
    content: "\f062"
}

.fa-arrow-down:before {
    content: "\f063"
}

.fa-mail-forward:before,
.fa-share:before {
    content: "\f064"
}

.fa-expand:before {
    content: "\f065"
}

.fa-compress:before {
    content: "\f066"
}

.fa-plus:before {
    content: "\f067"
}

.fa-minus:before {
    content: "\f068"
}

.fa-asterisk:before {
    content: "\f069"
}

.fa-exclamation-circle:before {
    content: "\f06a"
}

.fa-gift:before {
    content: "\f06b"
}

.fa-leaf:before {
    content: "\f06c"
}

.fa-fire:before {
    content: "\f06d"
}

.fa-eye:before {
    content: "\f06e"
}

.fa-eye-slash:before {
    content: "\f070"
}

.fa-warning:before,
.fa-exclamation-triangle:before {
    content: "\f071"
}

.fa-plane:before {
    content: "\f072"
}

.fa-calendar:before {
    content: "\f073"
}

.fa-random:before {
    content: "\f074"
}

.fa-comment:before {
    content: "\f075"
}

.fa-magnet:before {
    content: "\f076"
}

.fa-chevron-up:before {
    content: "\f077"
}

.fa-chevron-down:before {
    content: "\f078"
}

.fa-retweet:before {
    content: "\f079"
}

.fa-shopping-cart:before {
    content: "\f07a"
}

.fa-folder:before {
    content: "\f07b"
}

.fa-folder-open:before {
    content: "\f07c"
}

.fa-arrows-v:before {
    content: "\f07d"
}

.fa-arrows-h:before {
    content: "\f07e"
}

.fa-bar-chart-o:before,
.fa-bar-chart:before {
    content: "\f080"
}

.fa-twitter-square:before {
    content: "\f081"
}

.fa-facebook-square:before {
    content: "\f082"
}

.fa-camera-retro:before {
    content: "\f083"
}

.fa-key:before {
    content: "\f084"
}

.fa-gears:before,
.fa-cogs:before {
    content: "\f085"
}

.fa-comments:before {
    content: "\f086"
}

.fa-thumbs-o-up:before {
    content: "\f087"
}

.fa-thumbs-o-down:before {
    content: "\f088"
}

.fa-star-half:before {
    content: "\f089"
}

.fa-heart-o:before {
    content: "\f08a"
}

.fa-sign-out:before {
    content: "\f08b"
}

.fa-linkedin-square:before {
    content: "\f08c"
}

.fa-thumb-tack:before {
    content: "\f08d"
}

.fa-external-link:before {
    content: "\f08e"
}

.fa-sign-in:before {
    content: "\f090"
}

.fa-trophy:before {
    content: "\f091"
}

.fa-github-square:before {
    content: "\f092"
}

.fa-upload:before {
    content: "\f093"
}

.fa-lemon-o:before {
    content: "\f094"
}

.fa-phone:before {
    content: "\f095"
}

.fa-square-o:before {
    content: "\f096"
}

.fa-bookmark-o:before {
    content: "\f097"
}

.fa-phone-square:before {
    content: "\f098"
}

.fa-twitter:before {
    content: "\f099"
}

.fa-facebook-f:before,
.fa-facebook:before {
    content: "\f09a"
}

.fa-github:before {
    content: "\f09b"
}

.fa-unlock:before {
    content: "\f09c"
}

.fa-credit-card:before {
    content: "\f09d"
}

.fa-feed:before,
.fa-rss:before {
    content: "\f09e"
}

.fa-hdd-o:before {
    content: "\f0a0"
}

.fa-bullhorn:before {
    content: "\f0a1"
}

.fa-bell:before {
    content: "\f0f3"
}

.fa-certificate:before {
    content: "\f0a3"
}

.fa-hand-o-right:before {
    content: "\f0a4"
}

.fa-hand-o-left:before {
    content: "\f0a5"
}

.fa-hand-o-up:before {
    content: "\f0a6"
}

.fa-hand-o-down:before {
    content: "\f0a7"
}

.fa-arrow-circle-left:before {
    content: "\f0a8"
}

.fa-arrow-circle-right:before {
    content: "\f0a9"
}

.fa-arrow-circle-up:before {
    content: "\f0aa"
}

.fa-arrow-circle-down:before {
    content: "\f0ab"
}

.fa-globe:before {
    content: "\f0ac"
}

.fa-wrench:before {
    content: "\f0ad"
}

.fa-tasks:before {
    content: "\f0ae"
}

.fa-filter:before {
    content: "\f0b0"
}

.fa-briefcase:before {
    content: "\f0b1"
}

.fa-arrows-alt:before {
    content: "\f0b2"
}

.fa-group:before,
.fa-users:before {
    content: "\f0c0"
}

.fa-chain:before,
.fa-link:before {
    content: "\f0c1"
}

.fa-cloud:before {
    content: "\f0c2"
}

.fa-flask:before {
    content: "\f0c3"
}

.fa-cut:before,
.fa-scissors:before {
    content: "\f0c4"
}

.fa-copy:before,
.fa-files-o:before {
    content: "\f0c5"
}

.fa-paperclip:before {
    content: "\f0c6"
}

.fa-save:before,
.fa-floppy-o:before {
    content: "\f0c7"
}

.fa-square:before {
    content: "\f0c8"
}

.fa-navicon:before,
.fa-reorder:before,
.fa-bars:before {
    content: "\f0c9"
}

.fa-list-ul:before {
    content: "\f0ca"
}

.fa-list-ol:before {
    content: "\f0cb"
}

.fa-strikethrough:before {
    content: "\f0cc"
}

.fa-underline:before {
    content: "\f0cd"
}

.fa-table:before {
    content: "\f0ce"
}

.fa-magic:before {
    content: "\f0d0"
}

.fa-truck:before {
    content: "\f0d1"
}

.fa-pinterest:before {
    content: "\f0d2"
}

.fa-pinterest-square:before {
    content: "\f0d3"
}

.fa-google-plus-square:before {
    content: "\f0d4"
}

.fa-google-plus:before {
    content: "\f0d5"
}

.fa-money:before {
    content: "\f0d6"
}

.fa-caret-down:before {
    content: "\f0d7"
}

.fa-caret-up:before {
    content: "\f0d8"
}

.fa-caret-left:before {
    content: "\f0d9"
}

.fa-caret-right:before {
    content: "\f0da"
}

.fa-columns:before {
    content: "\f0db"
}

.fa-unsorted:before,
.fa-sort:before {
    content: "\f0dc"
}

.fa-sort-down:before,
.fa-sort-desc:before {
    content: "\f0dd"
}

.fa-sort-up:before,
.fa-sort-asc:before {
    content: "\f0de"
}

.fa-envelope:before {
    content: "\f0e0"
}

.fa-linkedin:before {
    content: "\f0e1"
}

.fa-rotate-left:before,
.fa-undo:before {
    content: "\f0e2"
}

.fa-legal:before,
.fa-gavel:before {
    content: "\f0e3"
}

.fa-dashboard:before,
.fa-tachometer:before {
    content: "\f0e4"
}

.fa-comment-o:before {
    content: "\f0e5"
}

.fa-comments-o:before {
    content: "\f0e6"
}

.fa-flash:before,
.fa-bolt:before {
    content: "\f0e7"
}

.fa-sitemap:before {
    content: "\f0e8"
}

.fa-umbrella:before {
    content: "\f0e9"
}

.fa-paste:before,
.fa-clipboard:before {
    content: "\f0ea"
}

.fa-lightbulb-o:before {
    content: "\f0eb"
}

.fa-exchange:before {
    content: "\f0ec"
}

.fa-cloud-download:before {
    content: "\f0ed"
}

.fa-cloud-upload:before {
    content: "\f0ee"
}

.fa-user-md:before {
    content: "\f0f0"
}

.fa-stethoscope:before {
    content: "\f0f1"
}

.fa-suitcase:before {
    content: "\f0f2"
}

.fa-bell-o:before {
    content: "\f0a2"
}

.fa-coffee:before {
    content: "\f0f4"
}

.fa-cutlery:before {
    content: "\f0f5"
}

.fa-file-text-o:before {
    content: "\f0f6"
}

.fa-building-o:before {
    content: "\f0f7"
}

.fa-hospital-o:before {
    content: "\f0f8"
}

.fa-ambulance:before {
    content: "\f0f9"
}

.fa-medkit:before {
    content: "\f0fa"
}

.fa-fighter-jet:before {
    content: "\f0fb"
}

.fa-beer:before {
    content: "\f0fc"
}

.fa-h-square:before {
    content: "\f0fd"
}

.fa-plus-square:before {
    content: "\f0fe"
}

.fa-angle-double-left:before {
    content: "\f100"
}

.fa-angle-double-right:before {
    content: "\f101"
}

.fa-angle-double-up:before {
    content: "\f102"
}

.fa-angle-double-down:before {
    content: "\f103"
}

.fa-angle-left:before {
    content: "\f104"
}

.fa-angle-right:before {
    content: "\f105"
}

.fa-angle-up:before {
    content: "\f106"
}

.fa-angle-down:before {
    content: "\f107"
}

.fa-desktop:before {
    content: "\f108"
}

.fa-laptop:before {
    content: "\f109"
}

.fa-tablet:before {
    content: "\f10a"
}

.fa-mobile-phone:before,
.fa-mobile:before {
    content: "\f10b"
}

.fa-circle-o:before {
    content: "\f10c"
}

.fa-quote-left:before {
    content: "\f10d"
}

.fa-quote-right:before {
    content: "\f10e"
}

.fa-spinner:before {
    content: "\f110"
}

.fa-circle:before {
    content: "\f111"
}

.fa-mail-reply:before,
.fa-reply:before {
    content: "\f112"
}

.fa-github-alt:before {
    content: "\f113"
}

.fa-folder-o:before {
    content: "\f114"
}

.fa-folder-open-o:before {
    content: "\f115"
}

.fa-smile-o:before {
    content: "\f118"
}

.fa-frown-o:before {
    content: "\f119"
}

.fa-meh-o:before {
    content: "\f11a"
}

.fa-gamepad:before {
    content: "\f11b"
}

.fa-keyboard-o:before {
    content: "\f11c"
}

.fa-flag-o:before {
    content: "\f11d"
}

.fa-flag-checkered:before {
    content: "\f11e"
}

.fa-terminal:before {
    content: "\f120"
}

.fa-code:before {
    content: "\f121"
}

.fa-mail-reply-all:before,
.fa-reply-all:before {
    content: "\f122"
}

.fa-star-half-empty:before,
.fa-star-half-full:before,
.fa-star-half-o:before {
    content: "\f123"
}

.fa-location-arrow:before {
    content: "\f124"
}

.fa-crop:before {
    content: "\f125"
}

.fa-code-fork:before {
    content: "\f126"
}

.fa-unlink:before,
.fa-chain-broken:before {
    content: "\f127"
}

.fa-question:before {
    content: "\f128"
}

.fa-info:before {
    content: "\f129"
}

.fa-exclamation:before {
    content: "\f12a"
}

.fa-superscript:before {
    content: "\f12b"
}

.fa-subscript:before {
    content: "\f12c"
}

.fa-eraser:before {
    content: "\f12d"
}

.fa-puzzle-piece:before {
    content: "\f12e"
}

.fa-microphone:before {
    content: "\f130"
}

.fa-microphone-slash:before {
    content: "\f131"
}

.fa-shield:before {
    content: "\f132"
}

.fa-calendar-o:before {
    content: "\f133"
}

.fa-fire-extinguisher:before {
    content: "\f134"
}

.fa-rocket:before {
    content: "\f135"
}

.fa-maxcdn:before {
    content: "\f136"
}

.fa-chevron-circle-left:before {
    content: "\f137"
}

.fa-chevron-circle-right:before {
    content: "\f138"
}

.fa-chevron-circle-up:before {
    content: "\f139"
}

.fa-chevron-circle-down:before {
    content: "\f13a"
}

.fa-html5:before {
    content: "\f13b"
}

.fa-css3:before {
    content: "\f13c"
}

.fa-anchor:before {
    content: "\f13d"
}

.fa-unlock-alt:before {
    content: "\f13e"
}

.fa-bullseye:before {
    content: "\f140"
}

.fa-ellipsis-h:before {
    content: "\f141"
}

.fa-ellipsis-v:before {
    content: "\f142"
}

.fa-rss-square:before {
    content: "\f143"
}

.fa-play-circle:before {
    content: "\f144"
}

.fa-ticket:before {
    content: "\f145"
}

.fa-minus-square:before {
    content: "\f146"
}

.fa-minus-square-o:before {
    content: "\f147"
}

.fa-level-up:before {
    content: "\f148"
}

.fa-level-down:before {
    content: "\f149"
}

.fa-check-square:before {
    content: "\f14a"
}

.fa-pencil-square:before {
    content: "\f14b"
}

.fa-external-link-square:before {
    content: "\f14c"
}

.fa-share-square:before {
    content: "\f14d"
}

.fa-compass:before {
    content: "\f14e"
}

.fa-toggle-down:before,
.fa-caret-square-o-down:before {
    content: "\f150"
}

.fa-toggle-up:before,
.fa-caret-square-o-up:before {
    content: "\f151"
}

.fa-toggle-right:before,
.fa-caret-square-o-right:before {
    content: "\f152"
}

.fa-euro:before,
.fa-eur:before {
    content: "\f153"
}

.fa-gbp:before {
    content: "\f154"
}

.fa-dollar:before,
.fa-usd:before {
    content: "\f155"
}

.fa-rupee:before,
.fa-inr:before {
    content: "\f156"
}

.fa-cny:before,
.fa-rmb:before,
.fa-yen:before,
.fa-jpy:before {
    content: "\f157"
}

.fa-ruble:before,
.fa-rouble:before,
.fa-rub:before {
    content: "\f158"
}

.fa-won:before,
.fa-krw:before {
    content: "\f159"
}

.fa-bitcoin:before,
.fa-btc:before {
    content: "\f15a"
}

.fa-file:before {
    content: "\f15b"
}

.fa-file-text:before {
    content: "\f15c"
}

.fa-sort-alpha-asc:before {
    content: "\f15d"
}

.fa-sort-alpha-desc:before {
    content: "\f15e"
}

.fa-sort-amount-asc:before {
    content: "\f160"
}

.fa-sort-amount-desc:before {
    content: "\f161"
}

.fa-sort-numeric-asc:before {
    content: "\f162"
}

.fa-sort-numeric-desc:before {
    content: "\f163"
}

.fa-thumbs-up:before {
    content: "\f164"
}

.fa-thumbs-down:before {
    content: "\f165"
}

.fa-youtube-square:before {
    content: "\f166"
}

.fa-youtube:before {
    content: "\f167"
}

.fa-xing:before {
    content: "\f168"
}

.fa-xing-square:before {
    content: "\f169"
}

.fa-youtube-play:before {
    content: "\f16a"
}

.fa-dropbox:before {
    content: "\f16b"
}

.fa-stack-overflow:before {
    content: "\f16c"
}

.fa-instagram:before {
    content: "\f16d"
}

.fa-flickr:before {
    content: "\f16e"
}

.fa-adn:before {
    content: "\f170"
}

.fa-bitbucket:before {
    content: "\f171"
}

.fa-bitbucket-square:before {
    content: "\f172"
}

.fa-tumblr:before {
    content: "\f173"
}

.fa-tumblr-square:before {
    content: "\f174"
}

.fa-long-arrow-down:before {
    content: "\f175"
}

.fa-long-arrow-up:before {
    content: "\f176"
}

.fa-long-arrow-left:before {
    content: "\f177"
}

.fa-long-arrow-right:before {
    content: "\f178"
}

.fa-apple:before {
    content: "\f179"
}

.fa-windows:before {
    content: "\f17a"
}

.fa-android:before {
    content: "\f17b"
}

.fa-linux:before {
    content: "\f17c"
}

.fa-dribbble:before {
    content: "\f17d"
}

.fa-skype:before {
    content: "\f17e"
}

.fa-foursquare:before {
    content: "\f180"
}

.fa-trello:before {
    content: "\f181"
}

.fa-female:before {
    content: "\f182"
}

.fa-male:before {
    content: "\f183"
}

.fa-gittip:before,
.fa-gratipay:before {
    content: "\f184"
}

.fa-sun-o:before {
    content: "\f185"
}

.fa-moon-o:before {
    content: "\f186"
}

.fa-archive:before {
    content: "\f187"
}

.fa-bug:before {
    content: "\f188"
}

.fa-vk:before {
    content: "\f189"
}

.fa-weibo:before {
    content: "\f18a"
}

.fa-renren:before {
    content: "\f18b"
}

.fa-pagelines:before {
    content: "\f18c"
}

.fa-stack-exchange:before {
    content: "\f18d"
}

.fa-arrow-circle-o-right:before {
    content: "\f18e"
}

.fa-arrow-circle-o-left:before {
    content: "\f190"
}

.fa-toggle-left:before,
.fa-caret-square-o-left:before {
    content: "\f191"
}

.fa-dot-circle-o:before {
    content: "\f192"
}

.fa-wheelchair:before {
    content: "\f193"
}

.fa-vimeo-square:before {
    content: "\f194"
}

.fa-turkish-lira:before,
.fa-try:before {
    content: "\f195"
}

.fa-plus-square-o:before {
    content: "\f196"
}

.fa-space-shuttle:before {
    content: "\f197"
}

.fa-slack:before {
    content: "\f198"
}

.fa-envelope-square:before {
    content: "\f199"
}

.fa-wordpress:before {
    content: "\f19a"
}

.fa-openid:before {
    content: "\f19b"
}

.fa-institution:before,
.fa-bank:before,
.fa-university:before {
    content: "\f19c"
}

.fa-mortar-board:before,
.fa-graduation-cap:before {
    content: "\f19d"
}

.fa-yahoo:before {
    content: "\f19e"
}

.fa-google:before {
    content: "\f1a0"
}

.fa-reddit:before {
    content: "\f1a1"
}

.fa-reddit-square:before {
    content: "\f1a2"
}

.fa-stumbleupon-circle:before {
    content: "\f1a3"
}

.fa-stumbleupon:before {
    content: "\f1a4"
}

.fa-delicious:before {
    content: "\f1a5"
}

.fa-digg:before {
    content: "\f1a6"
}

.fa-pied-piper-pp:before {
    content: "\f1a7"
}

.fa-pied-piper-alt:before {
    content: "\f1a8"
}

.fa-drupal:before {
    content: "\f1a9"
}

.fa-joomla:before {
    content: "\f1aa"
}

.fa-language:before {
    content: "\f1ab"
}

.fa-fax:before {
    content: "\f1ac"
}

.fa-building:before {
    content: "\f1ad"
}

.fa-child:before {
    content: "\f1ae"
}

.fa-paw:before {
    content: "\f1b0"
}

.fa-spoon:before {
    content: "\f1b1"
}

.fa-cube:before {
    content: "\f1b2"
}

.fa-cubes:before {
    content: "\f1b3"
}

.fa-behance:before {
    content: "\f1b4"
}

.fa-behance-square:before {
    content: "\f1b5"
}

.fa-steam:before {
    content: "\f1b6"
}

.fa-steam-square:before {
    content: "\f1b7"
}

.fa-recycle:before {
    content: "\f1b8"
}

.fa-automobile:before,
.fa-car:before {
    content: "\f1b9"
}

.fa-cab:before,
.fa-taxi:before {
    content: "\f1ba"
}

.fa-tree:before {
    content: "\f1bb"
}

.fa-spotify:before {
    content: "\f1bc"
}

.fa-deviantart:before {
    content: "\f1bd"
}

.fa-soundcloud:before {
    content: "\f1be"
}

.fa-database:before {
    content: "\f1c0"
}

.fa-file-pdf-o:before {
    content: "\f1c1"
}

.fa-file-word-o:before {
    content: "\f1c2"
}

.fa-file-excel-o:before {
    content: "\f1c3"
}

.fa-file-powerpoint-o:before {
    content: "\f1c4"
}

.fa-file-photo-o:before,
.fa-file-picture-o:before,
.fa-file-image-o:before {
    content: "\f1c5"
}

.fa-file-zip-o:before,
.fa-file-archive-o:before {
    content: "\f1c6"
}

.fa-file-sound-o:before,
.fa-file-audio-o:before {
    content: "\f1c7"
}

.fa-file-movie-o:before,
.fa-file-video-o:before {
    content: "\f1c8"
}

.fa-file-code-o:before {
    content: "\f1c9"
}

.fa-vine:before {
    content: "\f1ca"
}

.fa-codepen:before {
    content: "\f1cb"
}

.fa-jsfiddle:before {
    content: "\f1cc"
}

.fa-life-bouy:before,
.fa-life-buoy:before,
.fa-life-saver:before,
.fa-support:before,
.fa-life-ring:before {
    content: "\f1cd"
}

.fa-circle-o-notch:before {
    content: "\f1ce"
}

.fa-ra:before,
.fa-resistance:before,
.fa-rebel:before {
    content: "\f1d0"
}

.fa-ge:before,
.fa-empire:before {
    content: "\f1d1"
}

.fa-git-square:before {
    content: "\f1d2"
}

.fa-git:before {
    content: "\f1d3"
}

.fa-y-combinator-square:before,
.fa-yc-square:before,
.fa-hacker-news:before {
    content: "\f1d4"
}

.fa-tencent-weibo:before {
    content: "\f1d5"
}

.fa-qq:before {
    content: "\f1d6"
}

.fa-wechat:before,
.fa-weixin:before {
    content: "\f1d7"
}

.fa-send:before,
.fa-paper-plane:before {
    content: "\f1d8"
}

.fa-send-o:before,
.fa-paper-plane-o:before {
    content: "\f1d9"
}

.fa-history:before {
    content: "\f1da"
}

.fa-circle-thin:before {
    content: "\f1db"
}

.fa-header:before {
    content: "\f1dc"
}

.fa-paragraph:before {
    content: "\f1dd"
}

.fa-sliders:before {
    content: "\f1de"
}

.fa-share-alt:before {
    content: "\f1e0"
}

.fa-share-alt-square:before {
    content: "\f1e1"
}

.fa-bomb:before {
    content: "\f1e2"
}

.fa-soccer-ball-o:before,
.fa-futbol-o:before {
    content: "\f1e3"
}

.fa-tty:before {
    content: "\f1e4"
}

.fa-binoculars:before {
    content: "\f1e5"
}

.fa-plug:before {
    content: "\f1e6"
}

.fa-slideshare:before {
    content: "\f1e7"
}

.fa-twitch:before {
    content: "\f1e8"
}

.fa-yelp:before {
    content: "\f1e9"
}

.fa-newspaper-o:before {
    content: "\f1ea"
}

.fa-wifi:before {
    content: "\f1eb"
}

.fa-calculator:before {
    content: "\f1ec"
}

.fa-paypal:before {
    content: "\f1ed"
}

.fa-google-wallet:before {
    content: "\f1ee"
}

.fa-cc-visa:before {
    content: "\f1f0"
}

.fa-cc-mastercard:before {
    content: "\f1f1"
}

.fa-cc-discover:before {
    content: "\f1f2"
}

.fa-cc-amex:before {
    content: "\f1f3"
}

.fa-cc-paypal:before {
    content: "\f1f4"
}

.fa-cc-stripe:before {
    content: "\f1f5"
}

.fa-bell-slash:before {
    content: "\f1f6"
}

.fa-bell-slash-o:before {
    content: "\f1f7"
}

.fa-trash:before {
    content: "\f1f8"
}

.fa-copyright:before {
    content: "\f1f9"
}

.fa-at:before {
    content: "\f1fa"
}

.fa-eyedropper:before {
    content: "\f1fb"
}

.fa-paint-brush:before {
    content: "\f1fc"
}

.fa-birthday-cake:before {
    content: "\f1fd"
}

.fa-area-chart:before {
    content: "\f1fe"
}

.fa-pie-chart:before {
    content: "\f200"
}

.fa-line-chart:before {
    content: "\f201"
}

.fa-lastfm:before {
    content: "\f202"
}

.fa-lastfm-square:before {
    content: "\f203"
}

.fa-toggle-off:before {
    content: "\f204"
}

.fa-toggle-on:before {
    content: "\f205"
}

.fa-bicycle:before {
    content: "\f206"
}

.fa-bus:before {
    content: "\f207"
}

.fa-ioxhost:before {
    content: "\f208"
}

.fa-angellist:before {
    content: "\f209"
}

.fa-cc:before {
    content: "\f20a"
}

.fa-shekel:before,
.fa-sheqel:before,
.fa-ils:before {
    content: "\f20b"
}

.fa-meanpath:before {
    content: "\f20c"
}

.fa-buysellads:before {
    content: "\f20d"
}

.fa-connectdevelop:before {
    content: "\f20e"
}

.fa-dashcube:before {
    content: "\f210"
}

.fa-forumbee:before {
    content: "\f211"
}

.fa-leanpub:before {
    content: "\f212"
}

.fa-sellsy:before {
    content: "\f213"
}

.fa-shirtsinbulk:before {
    content: "\f214"
}

.fa-simplybuilt:before {
    content: "\f215"
}

.fa-skyatlas:before {
    content: "\f216"
}

.fa-cart-plus:before {
    content: "\f217"
}

.fa-cart-arrow-down:before {
    content: "\f218"
}

.fa-diamond:before {
    content: "\f219"
}

.fa-ship:before {
    content: "\f21a"
}

.fa-user-secret:before {
    content: "\f21b"
}

.fa-motorcycle:before {
    content: "\f21c"
}

.fa-street-view:before {
    content: "\f21d"
}

.fa-heartbeat:before {
    content: "\f21e"
}

.fa-venus:before {
    content: "\f221"
}

.fa-mars:before {
    content: "\f222"
}

.fa-mercury:before {
    content: "\f223"
}

.fa-intersex:before,
.fa-transgender:before {
    content: "\f224"
}

.fa-transgender-alt:before {
    content: "\f225"
}

.fa-venus-double:before {
    content: "\f226"
}

.fa-mars-double:before {
    content: "\f227"
}

.fa-venus-mars:before {
    content: "\f228"
}

.fa-mars-stroke:before {
    content: "\f229"
}

.fa-mars-stroke-v:before {
    content: "\f22a"
}

.fa-mars-stroke-h:before {
    content: "\f22b"
}

.fa-neuter:before {
    content: "\f22c"
}

.fa-genderless:before {
    content: "\f22d"
}

.fa-facebook-official:before {
    content: "\f230"
}

.fa-pinterest-p:before {
    content: "\f231"
}

.fa-whatsapp:before {
    content: "\f232"
}

.fa-server:before {
    content: "\f233"
}

.fa-user-plus:before {
    content: "\f234"
}

.fa-user-times:before {
    content: "\f235"
}

.fa-hotel:before,
.fa-bed:before {
    content: "\f236"
}

.fa-viacoin:before {
    content: "\f237"
}

.fa-train:before {
    content: "\f238"
}

.fa-subway:before {
    content: "\f239"
}

.fa-medium:before {
    content: "\f23a"
}

.fa-yc:before,
.fa-y-combinator:before {
    content: "\f23b"
}

.fa-optin-monster:before {
    content: "\f23c"
}

.fa-opencart:before {
    content: "\f23d"
}

.fa-expeditedssl:before {
    content: "\f23e"
}

.fa-battery-4:before,
.fa-battery:before,
.fa-battery-full:before {
    content: "\f240"
}

.fa-battery-3:before,
.fa-battery-three-quarters:before {
    content: "\f241"
}

.fa-battery-2:before,
.fa-battery-half:before {
    content: "\f242"
}

.fa-battery-1:before,
.fa-battery-quarter:before {
    content: "\f243"
}

.fa-battery-0:before,
.fa-battery-empty:before {
    content: "\f244"
}

.fa-mouse-pointer:before {
    content: "\f245"
}

.fa-i-cursor:before {
    content: "\f246"
}

.fa-object-group:before {
    content: "\f247"
}

.fa-object-ungroup:before {
    content: "\f248"
}

.fa-sticky-note:before {
    content: "\f249"
}

.fa-sticky-note-o:before {
    content: "\f24a"
}

.fa-cc-jcb:before {
    content: "\f24b"
}

.fa-cc-diners-club:before {
    content: "\f24c"
}

.fa-clone:before {
    content: "\f24d"
}

.fa-balance-scale:before {
    content: "\f24e"
}

.fa-hourglass-o:before {
    content: "\f250"
}

.fa-hourglass-1:before,
.fa-hourglass-start:before {
    content: "\f251"
}

.fa-hourglass-2:before,
.fa-hourglass-half:before {
    content: "\f252"
}

.fa-hourglass-3:before,
.fa-hourglass-end:before {
    content: "\f253"
}

.fa-hourglass:before {
    content: "\f254"
}

.fa-hand-grab-o:before,
.fa-hand-rock-o:before {
    content: "\f255"
}

.fa-hand-stop-o:before,
.fa-hand-paper-o:before {
    content: "\f256"
}

.fa-hand-scissors-o:before {
    content: "\f257"
}

.fa-hand-lizard-o:before {
    content: "\f258"
}

.fa-hand-spock-o:before {
    content: "\f259"
}

.fa-hand-pointer-o:before {
    content: "\f25a"
}

.fa-hand-peace-o:before {
    content: "\f25b"
}

.fa-trademark:before {
    content: "\f25c"
}

.fa-registered:before {
    content: "\f25d"
}

.fa-creative-commons:before {
    content: "\f25e"
}

.fa-gg:before {
    content: "\f260"
}

.fa-gg-circle:before {
    content: "\f261"
}

.fa-tripadvisor:before {
    content: "\f262"
}

.fa-odnoklassniki:before {
    content: "\f263"
}

.fa-odnoklassniki-square:before {
    content: "\f264"
}

.fa-get-pocket:before {
    content: "\f265"
}

.fa-wikipedia-w:before {
    content: "\f266"
}

.fa-safari:before {
    content: "\f267"
}

.fa-chrome:before {
    content: "\f268"
}

.fa-firefox:before {
    content: "\f269"
}

.fa-opera:before {
    content: "\f26a"
}

.fa-internet-explorer:before {
    content: "\f26b"
}

.fa-tv:before,
.fa-television:before {
    content: "\f26c"
}

.fa-contao:before {
    content: "\f26d"
}

.fa-500px:before {
    content: "\f26e"
}

.fa-amazon:before {
    content: "\f270"
}

.fa-calendar-plus-o:before {
    content: "\f271"
}

.fa-calendar-minus-o:before {
    content: "\f272"
}

.fa-calendar-times-o:before {
    content: "\f273"
}

.fa-calendar-check-o:before {
    content: "\f274"
}

.fa-industry:before {
    content: "\f275"
}

.fa-map-pin:before {
    content: "\f276"
}

.fa-map-signs:before {
    content: "\f277"
}

.fa-map-o:before {
    content: "\f278"
}

.fa-map:before {
    content: "\f279"
}

.fa-commenting:before {
    content: "\f27a"
}

.fa-commenting-o:before {
    content: "\f27b"
}

.fa-houzz:before {
    content: "\f27c"
}

.fa-vimeo:before {
    content: "\f27d"
}

.fa-black-tie:before {
    content: "\f27e"
}

.fa-fonticons:before {
    content: "\f280"
}

.fa-reddit-alien:before {
    content: "\f281"
}

.fa-edge:before {
    content: "\f282"
}

.fa-credit-card-alt:before {
    content: "\f283"
}

.fa-codiepie:before {
    content: "\f284"
}

.fa-modx:before {
    content: "\f285"
}

.fa-fort-awesome:before {
    content: "\f286"
}

.fa-usb:before {
    content: "\f287"
}

.fa-product-hunt:before {
    content: "\f288"
}

.fa-mixcloud:before {
    content: "\f289"
}

.fa-scribd:before {
    content: "\f28a"
}

.fa-pause-circle:before {
    content: "\f28b"
}

.fa-pause-circle-o:before {
    content: "\f28c"
}

.fa-stop-circle:before {
    content: "\f28d"
}

.fa-stop-circle-o:before {
    content: "\f28e"
}

.fa-shopping-bag:before {
    content: "\f290"
}

.fa-shopping-basket:before {
    content: "\f291"
}

.fa-hashtag:before {
    content: "\f292"
}

.fa-bluetooth:before {
    content: "\f293"
}

.fa-bluetooth-b:before {
    content: "\f294"
}

.fa-percent:before {
    content: "\f295"
}

.fa-gitlab:before {
    content: "\f296"
}

.fa-wpbeginner:before {
    content: "\f297"
}

.fa-wpforms:before {
    content: "\f298"
}

.fa-envira:before {
    content: "\f299"
}

.fa-universal-access:before {
    content: "\f29a"
}

.fa-wheelchair-alt:before {
    content: "\f29b"
}

.fa-question-circle-o:before {
    content: "\f29c"
}

.fa-blind:before {
    content: "\f29d"
}

.fa-audio-description:before {
    content: "\f29e"
}

.fa-volume-control-phone:before {
    content: "\f2a0"
}

.fa-braille:before {
    content: "\f2a1"
}

.fa-assistive-listening-systems:before {
    content: "\f2a2"
}

.fa-asl-interpreting:before,
.fa-american-sign-language-interpreting:before {
    content: "\f2a3"
}

.fa-deafness:before,
.fa-hard-of-hearing:before,
.fa-deaf:before {
    content: "\f2a4"
}

.fa-glide:before {
    content: "\f2a5"
}

.fa-glide-g:before {
    content: "\f2a6"
}

.fa-signing:before,
.fa-sign-language:before {
    content: "\f2a7"
}

.fa-low-vision:before {
    content: "\f2a8"
}

.fa-viadeo:before {
    content: "\f2a9"
}

.fa-viadeo-square:before {
    content: "\f2aa"
}

.fa-snapchat:before {
    content: "\f2ab"
}

.fa-snapchat-ghost:before {
    content: "\f2ac"
}

.fa-snapchat-square:before {
    content: "\f2ad"
}

.fa-pied-piper:before {
    content: "\f2ae"
}

.fa-first-order:before {
    content: "\f2b0"
}

.fa-yoast:before {
    content: "\f2b1"
}

.fa-themeisle:before {
    content: "\f2b2"
}

.fa-google-plus-circle:before,
.fa-google-plus-official:before {
    content: "\f2b3"
}

.fa-fa:before,
.fa-font-awesome:before {
    content: "\f2b4"
}

.fa-handshake-o:before {
    content: "\f2b5"
}

.fa-envelope-open:before {
    content: "\f2b6"
}

.fa-envelope-open-o:before {
    content: "\f2b7"
}

.fa-linode:before {
    content: "\f2b8"
}

.fa-address-book:before {
    content: "\f2b9"
}

.fa-address-book-o:before {
    content: "\f2ba"
}

.fa-vcard:before,
.fa-address-card:before {
    content: "\f2bb"
}

.fa-vcard-o:before,
.fa-address-card-o:before {
    content: "\f2bc"
}

.fa-user-circle:before {
    content: "\f2bd"
}

.fa-user-circle-o:before {
    content: "\f2be"
}

.fa-user-o:before {
    content: "\f2c0"
}

.fa-id-badge:before {
    content: "\f2c1"
}

.fa-drivers-license:before,
.fa-id-card:before {
    content: "\f2c2"
}

.fa-drivers-license-o:before,
.fa-id-card-o:before {
    content: "\f2c3"
}

.fa-quora:before {
    content: "\f2c4"
}

.fa-free-code-camp:before {
    content: "\f2c5"
}

.fa-telegram:before {
    content: "\f2c6"
}

.fa-thermometer-4:before,
.fa-thermometer:before,
.fa-thermometer-full:before {
    content: "\f2c7"
}

.fa-thermometer-3:before,
.fa-thermometer-three-quarters:before {
    content: "\f2c8"
}

.fa-thermometer-2:before,
.fa-thermometer-half:before {
    content: "\f2c9"
}

.fa-thermometer-1:before,
.fa-thermometer-quarter:before {
    content: "\f2ca"
}

.fa-thermometer-0:before,
.fa-thermometer-empty:before {
    content: "\f2cb"
}

.fa-shower:before {
    content: "\f2cc"
}

.fa-bathtub:before,
.fa-s15:before,
.fa-bath:before {
    content: "\f2cd"
}

.fa-podcast:before {
    content: "\f2ce"
}

.fa-window-maximize:before {
    content: "\f2d0"
}

.fa-window-minimize:before {
    content: "\f2d1"
}

.fa-window-restore:before {
    content: "\f2d2"
}

.fa-times-rectangle:before,
.fa-window-close:before {
    content: "\f2d3"
}

.fa-times-rectangle-o:before,
.fa-window-close-o:before {
    content: "\f2d4"
}

.fa-bandcamp:before {
    content: "\f2d5"
}

.fa-grav:before {
    content: "\f2d6"
}

.fa-etsy:before {
    content: "\f2d7"
}

.fa-imdb:before {
    content: "\f2d8"
}

.fa-ravelry:before {
    content: "\f2d9"
}

.fa-eercast:before {
    content: "\f2da"
}

.fa-microchip:before {
    content: "\f2db"
}

.fa-snowflake-o:before {
    content: "\f2dc"
}

.fa-superpowers:before {
    content: "\f2dd"
}

.fa-wpexplorer:before {
    content: "\f2de"
}

.fa-meetup:before {
    content: "\f2e0"
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0
}

.sr-only-focusable:active,
.sr-only-focusable:focus {
    position: static;
    width: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    clip: auto
}

/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
html {
    font-family: sans-serif;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%
}

body {
    margin: 0
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
    display: block
}

audio,
canvas,
progress,
video {
    display: inline-block;
    vertical-align: baseline
}

audio:not([controls]) {
    display: none;
    height: 0
}

[hidden],
template {
    display: none
}

a {
    background-color: transparent
}

a:active,
a:hover {
    outline: 0
}

abbr[title] {
    border-bottom: none;
    text-decoration: underline;
    text-decoration: underline dotted
}

b,
strong {
    font-weight: bold
}

dfn {
    font-style: italic
}

h1 {
    font-size: 2em;
    margin: 0.67em 0
}

mark {
    background: #ff0;
    color: #000
}

small {
    font-size: 80%
}

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}

sup {
    top: -0.5em
}

sub {
    bottom: -0.25em
}

img {
    border: 0
}

svg:not(:root) {
    overflow: hidden
}

figure {
    margin: 1em 40px
}

hr {
    box-sizing: content-box;
    height: 0
}

pre {
    overflow: auto
}

code,
kbd,
pre,
samp {
    font-family: monospace, monospace;
    font-size: 1em
}

button,
input,
optgroup,
select,
textarea {
    color: inherit;
    font: inherit;
    margin: 0
}

button {
    overflow: visible
}

button,
select {
    text-transform: none
}

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
    -webkit-appearance: button;
    cursor: pointer
}

button[disabled],
html input[disabled] {
    cursor: default
}

button::-moz-focus-inner,
input::-moz-focus-inner {
    border: 0;
    padding: 0
}

input {
    line-height: normal
}

input[type="checkbox"],
input[type="radio"] {
    box-sizing: border-box;
    padding: 0
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
    height: auto
}

input[type="search"] {
    -webkit-appearance: textfield;
    box-sizing: content-box
}

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none
}

fieldset {
    border: 1px solid #c0c0c0;
    margin: 0 2px;
    padding: 0.35em 0.625em 0.75em
}

legend {
    border: 0;
    padding: 0
}

textarea {
    overflow: auto
}

optgroup {
    font-weight: bold
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

td,
th {
    padding: 0
}

/*! Source: https://github.com/h5bp/html5-boilerplate/blob/master/src/css/main.css */
@media print {

    *,
    *:before,
    *:after {
        color: #000 !important;
        text-shadow: none !important;
        background: transparent !important;
        box-shadow: none !important
    }

    a,
    a:visited {
        text-decoration: underline
    }

    a[href]:after {
        content: " (" attr(href) ")"
    }

    abbr[title]:after {
        content: " (" attr(title) ")"
    }

    a[href^="#"]:after,
    a[href^="javascript:"]:after {
        content: ""
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid
    }

    thead {
        display: table-header-group
    }

    tr,
    img {
        page-break-inside: avoid
    }

    img {
        max-width: 100% !important
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3
    }

    h2,
    h3 {
        page-break-after: avoid
    }

    .navbar {
        display: none
    }

    .btn>.caret,
    .dropup>.btn>.caret {
        border-top-color: #000 !important
    }

    .label {
        border: 1px solid #000
    }

    .table {
        border-collapse: collapse !important
    }

    .table td,
    .table th {
        background-color: #fff !important
    }

    .table-bordered th,
    .table-bordered td {
        border: 1px solid #ddd !important
    }
}

@font-face {
    font-family: "Glyphicons Halflings";
    src: url(/../fonts/bootstrap/glyphicons-halflings-regular.eot);
    src: url(/../fonts/bootstrap/glyphicons-halflings-regular.eot?#iefix) format("embedded-opentype"), url(/../fonts/bootstrap/glyphicons-halflings-regular.woff2) format("woff2"), url(/../fonts/bootstrap/glyphicons-halflings-regular.woff) format("woff"), url(/../fonts/bootstrap/glyphicons-halflings-regular.ttf) format("truetype"), url(/../fonts/bootstrap/glyphicons-halflings-regular.svg#glyphicons_halflingsregular) format("svg")
}

.glyphicon {
    position: relative;
    top: 1px;
    display: inline-block;
    font-family: "Glyphicons Halflings";
    font-style: normal;
    font-weight: 400;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.glyphicon-asterisk:before {
    content: "\002a"
}

.glyphicon-plus:before {
    content: "\002b"
}

.glyphicon-euro:before,
.glyphicon-eur:before {
    content: "\20ac"
}

.glyphicon-minus:before {
    content: "\2212"
}

.glyphicon-cloud:before {
    content: "\2601"
}

.glyphicon-envelope:before {
    content: "\2709"
}

.glyphicon-pencil:before {
    content: "\270f"
}

.glyphicon-glass:before {
    content: "\e001"
}

.glyphicon-music:before {
    content: "\e002"
}

.glyphicon-search:before {
    content: "\e003"
}

.glyphicon-heart:before {
    content: "\e005"
}

.glyphicon-star:before {
    content: "\e006"
}

.glyphicon-star-empty:before {
    content: "\e007"
}

.glyphicon-user:before {
    content: "\e008"
}

.glyphicon-film:before {
    content: "\e009"
}

.glyphicon-th-large:before {
    content: "\e010"
}

.glyphicon-th:before {
    content: "\e011"
}

.glyphicon-th-list:before {
    content: "\e012"
}

.glyphicon-ok:before {
    content: "\e013"
}

.glyphicon-remove:before {
    content: "\e014"
}

.glyphicon-zoom-in:before {
    content: "\e015"
}

.glyphicon-zoom-out:before {
    content: "\e016"
}

.glyphicon-off:before {
    content: "\e017"
}

.glyphicon-signal:before {
    content: "\e018"
}

.glyphicon-cog:before {
    content: "\e019"
}

.glyphicon-trash:before {
    content: "\e020"
}

.glyphicon-home:before {
    content: "\e021"
}

.glyphicon-file:before {
    content: "\e022"
}

.glyphicon-time:before {
    content: "\e023"
}

.glyphicon-road:before {
    content: "\e024"
}

.glyphicon-download-alt:before {
    content: "\e025"
}

.glyphicon-download:before {
    content: "\e026"
}

.glyphicon-upload:before {
    content: "\e027"
}

.glyphicon-inbox:before {
    content: "\e028"
}

.glyphicon-play-circle:before {
    content: "\e029"
}

.glyphicon-repeat:before {
    content: "\e030"
}

.glyphicon-refresh:before {
    content: "\e031"
}

.glyphicon-list-alt:before {
    content: "\e032"
}

.glyphicon-lock:before {
    content: "\e033"
}

.glyphicon-flag:before {
    content: "\e034"
}

.glyphicon-headphones:before {
    content: "\e035"
}

.glyphicon-volume-off:before {
    content: "\e036"
}

.glyphicon-volume-down:before {
    content: "\e037"
}

.glyphicon-volume-up:before {
    content: "\e038"
}

.glyphicon-qrcode:before {
    content: "\e039"
}

.glyphicon-barcode:before {
    content: "\e040"
}

.glyphicon-tag:before {
    content: "\e041"
}

.glyphicon-tags:before {
    content: "\e042"
}

.glyphicon-book:before {
    content: "\e043"
}

.glyphicon-bookmark:before {
    content: "\e044"
}

.glyphicon-print:before {
    content: "\e045"
}

.glyphicon-camera:before {
    content: "\e046"
}

.glyphicon-font:before {
    content: "\e047"
}

.glyphicon-bold:before {
    content: "\e048"
}

.glyphicon-italic:before {
    content: "\e049"
}

.glyphicon-text-height:before {
    content: "\e050"
}

.glyphicon-text-width:before {
    content: "\e051"
}

.glyphicon-align-left:before {
    content: "\e052"
}

.glyphicon-align-center:before {
    content: "\e053"
}

.glyphicon-align-right:before {
    content: "\e054"
}

.glyphicon-align-justify:before {
    content: "\e055"
}

.glyphicon-list:before {
    content: "\e056"
}

.glyphicon-indent-left:before {
    content: "\e057"
}

.glyphicon-indent-right:before {
    content: "\e058"
}

.glyphicon-facetime-video:before {
    content: "\e059"
}

.glyphicon-picture:before {
    content: "\e060"
}

.glyphicon-map-marker:before {
    content: "\e062"
}

.glyphicon-adjust:before {
    content: "\e063"
}

.glyphicon-tint:before {
    content: "\e064"
}

.glyphicon-edit:before {
    content: "\e065"
}

.glyphicon-share:before {
    content: "\e066"
}

.glyphicon-check:before {
    content: "\e067"
}

.glyphicon-move:before {
    content: "\e068"
}

.glyphicon-step-backward:before {
    content: "\e069"
}

.glyphicon-fast-backward:before {
    content: "\e070"
}

.glyphicon-backward:before {
    content: "\e071"
}

.glyphicon-play:before {
    content: "\e072"
}

.glyphicon-pause:before {
    content: "\e073"
}

.glyphicon-stop:before {
    content: "\e074"
}

.glyphicon-forward:before {
    content: "\e075"
}

.glyphicon-fast-forward:before {
    content: "\e076"
}

.glyphicon-step-forward:before {
    content: "\e077"
}

.glyphicon-eject:before {
    content: "\e078"
}

.glyphicon-chevron-left:before {
    content: "\e079"
}

.glyphicon-chevron-right:before {
    content: "\e080"
}

.glyphicon-plus-sign:before {
    content: "\e081"
}

.glyphicon-minus-sign:before {
    content: "\e082"
}

.glyphicon-remove-sign:before {
    content: "\e083"
}

.glyphicon-ok-sign:before {
    content: "\e084"
}

.glyphicon-question-sign:before {
    content: "\e085"
}

.glyphicon-info-sign:before {
    content: "\e086"
}

.glyphicon-screenshot:before {
    content: "\e087"
}

.glyphicon-remove-circle:before {
    content: "\e088"
}

.glyphicon-ok-circle:before {
    content: "\e089"
}

.glyphicon-ban-circle:before {
    content: "\e090"
}

.glyphicon-arrow-left:before {
    content: "\e091"
}

.glyphicon-arrow-right:before {
    content: "\e092"
}

.glyphicon-arrow-up:before {
    content: "\e093"
}

.glyphicon-arrow-down:before {
    content: "\e094"
}

.glyphicon-share-alt:before {
    content: "\e095"
}

.glyphicon-resize-full:before {
    content: "\e096"
}

.glyphicon-resize-small:before {
    content: "\e097"
}

.glyphicon-exclamation-sign:before {
    content: "\e101"
}

.glyphicon-gift:before {
    content: "\e102"
}

.glyphicon-leaf:before {
    content: "\e103"
}

.glyphicon-fire:before {
    content: "\e104"
}

.glyphicon-eye-open:before {
    content: "\e105"
}

.glyphicon-eye-close:before {
    content: "\e106"
}

.glyphicon-warning-sign:before {
    content: "\e107"
}

.glyphicon-plane:before {
    content: "\e108"
}

.glyphicon-calendar:before {
    content: "\e109"
}

.glyphicon-random:before {
    content: "\e110"
}

.glyphicon-comment:before {
    content: "\e111"
}

.glyphicon-magnet:before {
    content: "\e112"
}

.glyphicon-chevron-up:before {
    content: "\e113"
}

.glyphicon-chevron-down:before {
    content: "\e114"
}

.glyphicon-retweet:before {
    content: "\e115"
}

.glyphicon-shopping-cart:before {
    content: "\e116"
}

.glyphicon-folder-close:before {
    content: "\e117"
}

.glyphicon-folder-open:before {
    content: "\e118"
}

.glyphicon-resize-vertical:before {
    content: "\e119"
}

.glyphicon-resize-horizontal:before {
    content: "\e120"
}

.glyphicon-hdd:before {
    content: "\e121"
}

.glyphicon-bullhorn:before {
    content: "\e122"
}

.glyphicon-bell:before {
    content: "\e123"
}

.glyphicon-certificate:before {
    content: "\e124"
}

.glyphicon-thumbs-up:before {
    content: "\e125"
}

.glyphicon-thumbs-down:before {
    content: "\e126"
}

.glyphicon-hand-right:before {
    content: "\e127"
}

.glyphicon-hand-left:before {
    content: "\e128"
}

.glyphicon-hand-up:before {
    content: "\e129"
}

.glyphicon-hand-down:before {
    content: "\e130"
}

.glyphicon-circle-arrow-right:before {
    content: "\e131"
}

.glyphicon-circle-arrow-left:before {
    content: "\e132"
}

.glyphicon-circle-arrow-up:before {
    content: "\e133"
}

.glyphicon-circle-arrow-down:before {
    content: "\e134"
}

.glyphicon-globe:before {
    content: "\e135"
}

.glyphicon-wrench:before {
    content: "\e136"
}

.glyphicon-tasks:before {
    content: "\e137"
}

.glyphicon-filter:before {
    content: "\e138"
}

.glyphicon-briefcase:before {
    content: "\e139"
}

.glyphicon-fullscreen:before {
    content: "\e140"
}

.glyphicon-dashboard:before {
    content: "\e141"
}

.glyphicon-paperclip:before {
    content: "\e142"
}

.glyphicon-heart-empty:before {
    content: "\e143"
}

.glyphicon-link:before {
    content: "\e144"
}

.glyphicon-phone:before {
    content: "\e145"
}

.glyphicon-pushpin:before {
    content: "\e146"
}

.glyphicon-usd:before {
    content: "\e148"
}

.glyphicon-gbp:before {
    content: "\e149"
}

.glyphicon-sort:before {
    content: "\e150"
}

.glyphicon-sort-by-alphabet:before {
    content: "\e151"
}

.glyphicon-sort-by-alphabet-alt:before {
    content: "\e152"
}

.glyphicon-sort-by-order:before {
    content: "\e153"
}

.glyphicon-sort-by-order-alt:before {
    content: "\e154"
}

.glyphicon-sort-by-attributes:before {
    content: "\e155"
}

.glyphicon-sort-by-attributes-alt:before {
    content: "\e156"
}

.glyphicon-unchecked:before {
    content: "\e157"
}

.glyphicon-expand:before {
    content: "\e158"
}

.glyphicon-collapse-down:before {
    content: "\e159"
}

.glyphicon-collapse-up:before {
    content: "\e160"
}

.glyphicon-log-in:before {
    content: "\e161"
}

.glyphicon-flash:before {
    content: "\e162"
}

.glyphicon-log-out:before {
    content: "\e163"
}

.glyphicon-new-window:before {
    content: "\e164"
}

.glyphicon-record:before {
    content: "\e165"
}

.glyphicon-save:before {
    content: "\e166"
}

.glyphicon-open:before {
    content: "\e167"
}

.glyphicon-saved:before {
    content: "\e168"
}

.glyphicon-import:before {
    content: "\e169"
}

.glyphicon-export:before {
    content: "\e170"
}

.glyphicon-send:before {
    content: "\e171"
}

.glyphicon-floppy-disk:before {
    content: "\e172"
}

.glyphicon-floppy-saved:before {
    content: "\e173"
}

.glyphicon-floppy-remove:before {
    content: "\e174"
}

.glyphicon-floppy-save:before {
    content: "\e175"
}

.glyphicon-floppy-open:before {
    content: "\e176"
}

.glyphicon-credit-card:before {
    content: "\e177"
}

.glyphicon-transfer:before {
    content: "\e178"
}

.glyphicon-cutlery:before {
    content: "\e179"
}

.glyphicon-header:before {
    content: "\e180"
}

.glyphicon-compressed:before {
    content: "\e181"
}

.glyphicon-earphone:before {
    content: "\e182"
}

.glyphicon-phone-alt:before {
    content: "\e183"
}

.glyphicon-tower:before {
    content: "\e184"
}

.glyphicon-stats:before {
    content: "\e185"
}

.glyphicon-sd-video:before {
    content: "\e186"
}

.glyphicon-hd-video:before {
    content: "\e187"
}

.glyphicon-subtitles:before {
    content: "\e188"
}

.glyphicon-sound-stereo:before {
    content: "\e189"
}

.glyphicon-sound-dolby:before {
    content: "\e190"
}

.glyphicon-sound-5-1:before {
    content: "\e191"
}

.glyphicon-sound-6-1:before {
    content: "\e192"
}

.glyphicon-sound-7-1:before {
    content: "\e193"
}

.glyphicon-copyright-mark:before {
    content: "\e194"
}

.glyphicon-registration-mark:before {
    content: "\e195"
}

.glyphicon-cloud-download:before {
    content: "\e197"
}

.glyphicon-cloud-upload:before {
    content: "\e198"
}

.glyphicon-tree-conifer:before {
    content: "\e199"
}

.glyphicon-tree-deciduous:before {
    content: "\e200"
}

.glyphicon-cd:before {
    content: "\e201"
}

.glyphicon-save-file:before {
    content: "\e202"
}

.glyphicon-open-file:before {
    content: "\e203"
}

.glyphicon-level-up:before {
    content: "\e204"
}

.glyphicon-copy:before {
    content: "\e205"
}

.glyphicon-paste:before {
    content: "\e206"
}

.glyphicon-alert:before {
    content: "\e209"
}

.glyphicon-equalizer:before {
    content: "\e210"
}

.glyphicon-king:before {
    content: "\e211"
}

.glyphicon-queen:before {
    content: "\e212"
}

.glyphicon-pawn:before {
    content: "\e213"
}

.glyphicon-bishop:before {
    content: "\e214"
}

.glyphicon-knight:before {
    content: "\e215"
}

.glyphicon-baby-formula:before {
    content: "\e216"
}

.glyphicon-tent:before {
    content: "\26fa"
}

.glyphicon-blackboard:before {
    content: "\e218"
}

.glyphicon-bed:before {
    content: "\e219"
}

.glyphicon-apple:before {
    content: "\f8ff"
}

.glyphicon-erase:before {
    content: "\e221"
}

.glyphicon-hourglass:before {
    content: "\231b"
}

.glyphicon-lamp:before {
    content: "\e223"
}

.glyphicon-duplicate:before {
    content: "\e224"
}

.glyphicon-piggy-bank:before {
    content: "\e225"
}

.glyphicon-scissors:before {
    content: "\e226"
}

.glyphicon-bitcoin:before {
    content: "\e227"
}

.glyphicon-btc:before {
    content: "\e227"
}

.glyphicon-xbt:before {
    content: "\e227"
}

.glyphicon-yen:before {
    content: "\00a5"
}

.glyphicon-jpy:before {
    content: "\00a5"
}

.glyphicon-ruble:before {
    content: "\20bd"
}

.glyphicon-rub:before {
    content: "\20bd"
}

.glyphicon-scale:before {
    content: "\e230"
}

.glyphicon-ice-lolly:before {
    content: "\e231"
}

.glyphicon-ice-lolly-tasted:before {
    content: "\e232"
}

.glyphicon-education:before {
    content: "\e233"
}

.glyphicon-option-horizontal:before {
    content: "\e234"
}

.glyphicon-option-vertical:before {
    content: "\e235"
}

.glyphicon-menu-hamburger:before {
    content: "\e236"
}

.glyphicon-modal-window:before {
    content: "\e237"
}

.glyphicon-oil:before {
    content: "\e238"
}

.glyphicon-grain:before {
    content: "\e239"
}

.glyphicon-sunglasses:before {
    content: "\e240"
}

.glyphicon-text-size:before {
    content: "\e241"
}

.glyphicon-text-color:before {
    content: "\e242"
}

.glyphicon-text-background:before {
    content: "\e243"
}

.glyphicon-object-align-top:before {
    content: "\e244"
}

.glyphicon-object-align-bottom:before {
    content: "\e245"
}

.glyphicon-object-align-horizontal:before {
    content: "\e246"
}

.glyphicon-object-align-left:before {
    content: "\e247"
}

.glyphicon-object-align-vertical:before {
    content: "\e248"
}

.glyphicon-object-align-right:before {
    content: "\e249"
}

.glyphicon-triangle-right:before {
    content: "\e250"
}

.glyphicon-triangle-left:before {
    content: "\e251"
}

.glyphicon-triangle-bottom:before {
    content: "\e252"
}

.glyphicon-triangle-top:before {
    content: "\e253"
}

.glyphicon-console:before {
    content: "\e254"
}

.glyphicon-superscript:before {
    content: "\e255"
}

.glyphicon-subscript:before {
    content: "\e256"
}

.glyphicon-menu-left:before {
    content: "\e257"
}

.glyphicon-menu-right:before {
    content: "\e258"
}

.glyphicon-menu-down:before {
    content: "\e259"
}

.glyphicon-menu-up:before {
    content: "\e260"
}

* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

*:before,
*:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

html {
    font-size: 10px;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0)
}

body {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 14px;
    line-height: 1.428571429;
    color: #333333;
    background-color: #fff
}

input,
button,
select,
textarea {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit
}

a {
    color: #337ab7;
    text-decoration: none
}

a:hover,
a:focus {
    color: #23527c;
    text-decoration: underline
}

a:focus {
    outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px
}

figure {
    margin: 0
}

img {
    vertical-align: middle
}

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

.img-rounded {
    border-radius: 6px
}

.img-thumbnail {
    padding: 4px;
    line-height: 1.428571429;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 4px;
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    display: inline-block;
    max-width: 100%;
    height: auto
}

.img-circle {
    border-radius: 50%
}

hr {
    margin-top: 20px;
    margin-bottom: 20px;
    border: 0;
    border-top: 1px solid #eeeeee
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0
}

.sr-only-focusable:active,
.sr-only-focusable:focus {
    position: static;
    width: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    clip: auto
}

[role="button"] {
    cursor: pointer
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
    font-family: inherit;
    font-weight: 500;
    line-height: 1.1;
    color: inherit
}

h1 small,
h1 .small,
h2 small,
h2 .small,
h3 small,
h3 .small,
h4 small,
h4 .small,
h5 small,
h5 .small,
h6 small,
h6 .small,
.h1 small,
.h1 .small,
.h2 small,
.h2 .small,
.h3 small,
.h3 .small,
.h4 small,
.h4 .small,
.h5 small,
.h5 .small,
.h6 small,
.h6 .small {
    font-weight: 400;
    line-height: 1;
    color: #777777
}

h1,
.h1,
h2,
.h2,
h3,
.h3 {
    margin-top: 20px;
    margin-bottom: 10px
}

h1 small,
h1 .small,
.h1 small,
.h1 .small,
h2 small,
h2 .small,
.h2 small,
.h2 .small,
h3 small,
h3 .small,
.h3 small,
.h3 .small {
    font-size: 65%
}

h4,
.h4,
h5,
.h5,
h6,
.h6 {
    margin-top: 10px;
    margin-bottom: 10px
}

h4 small,
h4 .small,
.h4 small,
.h4 .small,
h5 small,
h5 .small,
.h5 small,
.h5 .small,
h6 small,
h6 .small,
.h6 small,
.h6 .small {
    font-size: 75%
}

h1,
.h1 {
    font-size: 36px
}

h2,
.h2 {
    font-size: 30px
}

h3,
.h3 {
    font-size: 24px
}

h4,
.h4 {
    font-size: 18px
}

h5,
.h5 {
    font-size: 14px
}

h6,
.h6 {
    font-size: 12px
}

p {
    margin: 0 0 10px
}

.lead {
    margin-bottom: 20px;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.4
}

@media (min-width: 768px) {
    .lead {
        font-size: 21px
    }
}

small,
.small {
    font-size: 85%
}

mark,
.mark {
    padding: .2em;
    background-color: #fcf8e3
}

.text-left {
    text-align: left
}

.text-right {
    text-align: right
}

.text-center {
    text-align: center
}

.text-justify {
    text-align: justify
}

.text-nowrap {
    white-space: nowrap
}

.text-lowercase {
    text-transform: lowercase
}

.text-uppercase,
.initialism {
    text-transform: uppercase
}

.text-capitalize {
    text-transform: capitalize
}

.text-muted {
    color: #777777
}

.text-primary {
    color: #337ab7
}

a.text-primary:hover,
a.text-primary:focus {
    color: #286090
}

.text-success {
    color: #3c763d
}

a.text-success:hover,
a.text-success:focus {
    color: #2b542c
}

.text-info {
    color: #31708f
}

a.text-info:hover,
a.text-info:focus {
    color: #245269
}

.text-warning {
    color: #8a6d3b
}

a.text-warning:hover,
a.text-warning:focus {
    color: #66512c
}

.text-danger {
    color: #a94442
}

a.text-danger:hover,
a.text-danger:focus {
    color: #843534
}

.bg-primary {
    color: #fff
}

.bg-primary {
    background-color: #337ab7
}

a.bg-primary:hover,
a.bg-primary:focus {
    background-color: #286090
}

.bg-success {
    background-color: #dff0d8
}

a.bg-success:hover,
a.bg-success:focus {
    background-color: #c1e2b3
}

.bg-info {
    background-color: #d9edf7
}

a.bg-info:hover,
a.bg-info:focus {
    background-color: #afd9ee
}

.bg-warning {
    background-color: #fcf8e3
}

a.bg-warning:hover,
a.bg-warning:focus {
    background-color: #f7ecb5
}

.bg-danger {
    background-color: #f2dede
}

a.bg-danger:hover,
a.bg-danger:focus {
    background-color: #e4b9b9
}

.page-header {
    padding-bottom: 9px;
    margin: 40px 0 20px;
    border-bottom: 1px solid #eeeeee
}

ul,
ol {
    margin-top: 0;
    margin-bottom: 10px
}

ul ul,
ul ol,
ol ul,
ol ol {
    margin-bottom: 0
}

.list-unstyled {
    padding-left: 0;
    list-style: none
}

.list-inline {
    padding-left: 0;
    list-style: none;
    margin-left: -5px
}

.list-inline>li {
    display: inline-block;
    padding-right: 5px;
    padding-left: 5px
}

dl {
    margin-top: 0;
    margin-bottom: 20px
}

dt,
dd {
    line-height: 1.428571429
}

dt {
    font-weight: 700
}

dd {
    margin-left: 0
}

.dl-horizontal dd:before,
.dl-horizontal dd:after {
    display: table;
    content: " "
}

.dl-horizontal dd:after {
    clear: both
}

@media (min-width: 768px) {
    .dl-horizontal dt {
        float: left;
        width: 160px;
        clear: left;
        text-align: right;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap
    }

    .dl-horizontal dd {
        margin-left: 180px
    }
}

abbr[title],
abbr[data-original-title] {
    cursor: help
}

.initialism {
    font-size: 90%
}

blockquote {
    padding: 10px 20px;
    margin: 0 0 20px;
    font-size: 17.5px;
    border-left: 5px solid #eeeeee
}

blockquote p:last-child,
blockquote ul:last-child,
blockquote ol:last-child {
    margin-bottom: 0
}

blockquote footer,
blockquote small,
blockquote .small {
    display: block;
    font-size: 80%;
    line-height: 1.428571429;
    color: #777777
}

blockquote footer:before,
blockquote small:before,
blockquote .small:before {
    content: "\2014 \00A0"
}

.blockquote-reverse,
blockquote.pull-right {
    padding-right: 15px;
    padding-left: 0;
    text-align: right;
    border-right: 5px solid #eeeeee;
    border-left: 0
}

.blockquote-reverse footer:before,
.blockquote-reverse small:before,
.blockquote-reverse .small:before,
blockquote.pull-right footer:before,
blockquote.pull-right small:before,
blockquote.pull-right .small:before {
    content: ""
}

.blockquote-reverse footer:after,
.blockquote-reverse small:after,
.blockquote-reverse .small:after,
blockquote.pull-right footer:after,
blockquote.pull-right small:after,
blockquote.pull-right .small:after {
    content: "\00A0 \2014"
}

address {
    margin-bottom: 20px;
    font-style: normal;
    line-height: 1.428571429
}

code,
kbd,
pre,
samp {
    font-family: Menlo, Monaco, Consolas, "Courier New", monospace
}

code {
    padding: 2px 4px;
    font-size: 90%;
    color: #c7254e;
    background-color: #f9f2f4;
    border-radius: 4px
}

kbd {
    padding: 2px 4px;
    font-size: 90%;
    color: #fff;
    background-color: #333;
    border-radius: 3px;
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.25)
}

kbd kbd {
    padding: 0;
    font-size: 100%;
    font-weight: 700;
    box-shadow: none
}

pre {
    display: block;
    padding: 9.5px;
    margin: 0 0 10px;
    font-size: 13px;
    line-height: 1.428571429;
    color: #333333;
    word-break: break-all;
    word-wrap: break-word;
    background-color: #f5f5f5;
    border: 1px solid #ccc;
    border-radius: 4px
}

pre code {
    padding: 0;
    font-size: inherit;
    color: inherit;
    white-space: pre-wrap;
    background-color: transparent;
    border-radius: 0
}

.pre-scrollable {
    max-height: 340px;
    overflow-y: scroll
}

.container {
    padding-right: 5px;
    padding-left: 5px;
    margin-right: auto;
    margin-left: auto
}

.container:before,
.container:after {
    display: table;
    content: " "
}

.container:after {
    clear: both
}

@media (min-width: 768px) {
    .container {
        width: 730px
    }
}

@media (min-width: 992px) {
    .container {
        width: 950px
    }
}

@media (min-width: 1200px) {
    .container {
        width: 1150px
    }
}

.container-fluid {
    padding-right: 5px;
    padding-left: 5px;
    margin-right: auto;
    margin-left: auto
}

.container-fluid:before,
.container-fluid:after {
    display: table;
    content: " "
}

.container-fluid:after {
    clear: both
}

.row {
    margin-right: -5px;
    margin-left: -5px
}

.row:before,
.row:after {
    display: table;
    content: " "
}

.row:after {
    clear: both
}

.row-no-gutters {
    margin-right: 0;
    margin-left: 0
}

.row-no-gutters [class*="col-"] {
    padding-right: 0;
    padding-left: 0
}

.col-xs-1,
.col-sm-1,
.col-md-1,
.col-lg-1,
.col-xs-2,
.col-sm-2,
.col-md-2,
.col-lg-2,
.col-xs-3,
.col-sm-3,
.col-md-3,
.col-lg-3,
.col-xs-4,
.col-sm-4,
.col-md-4,
.col-lg-4,
.col-xs-5,
.col-sm-5,
.col-md-5,
.col-lg-5,
.col-xs-6,
.col-sm-6,
.col-md-6,
.col-lg-6,
.col-xs-7,
.col-sm-7,
.col-md-7,
.col-lg-7,
.col-xs-8,
.col-sm-8,
.col-md-8,
.col-lg-8,
.col-xs-9,
.col-sm-9,
.col-md-9,
.col-lg-9,
.col-xs-10,
.col-sm-10,
.col-md-10,
.col-lg-10,
.col-xs-11,
.col-sm-11,
.col-md-11,
.col-lg-11,
.col-xs-12,
.col-sm-12,
.col-md-12,
.col-lg-12 {
    position: relative;
    min-height: 1px;
    padding-right: 5px;
    padding-left: 5px
}

.col-xs-1,
.col-xs-2,
.col-xs-3,
.col-xs-4,
.col-xs-5,
.col-xs-6,
.col-xs-7,
.col-xs-8,
.col-xs-9,
.col-xs-10,
.col-xs-11,
.col-xs-12 {
    float: left
}

.col-xs-1 {
    width: 8.3333333333%
}

.col-xs-2 {
    width: 16.6666666667%
}

.col-xs-3 {
    width: 25%
}

.col-xs-4 {
    width: 33.3333333333%
}

.col-xs-5 {
    width: 41.6666666667%
}

.col-xs-6 {
    width: 50%
}

.col-xs-7 {
    width: 58.3333333333%
}

.col-xs-8 {
    width: 66.6666666667%
}

.col-xs-9 {
    width: 75%
}

.col-xs-10 {
    width: 83.3333333333%
}

.col-xs-11 {
    width: 91.6666666667%
}

.col-xs-12 {
    width: 100%
}

.col-xs-pull-0 {
    right: auto
}

.col-xs-pull-1 {
    right: 8.3333333333%
}

.col-xs-pull-2 {
    right: 16.6666666667%
}

.col-xs-pull-3 {
    right: 25%
}

.col-xs-pull-4 {
    right: 33.3333333333%
}

.col-xs-pull-5 {
    right: 41.6666666667%
}

.col-xs-pull-6 {
    right: 50%
}

.col-xs-pull-7 {
    right: 58.3333333333%
}

.col-xs-pull-8 {
    right: 66.6666666667%
}

.col-xs-pull-9 {
    right: 75%
}

.col-xs-pull-10 {
    right: 83.3333333333%
}

.col-xs-pull-11 {
    right: 91.6666666667%
}

.col-xs-pull-12 {
    right: 100%
}

.col-xs-push-0 {
    left: auto
}

.col-xs-push-1 {
    left: 8.3333333333%
}

.col-xs-push-2 {
    left: 16.6666666667%
}

.col-xs-push-3 {
    left: 25%
}

.col-xs-push-4 {
    left: 33.3333333333%
}

.col-xs-push-5 {
    left: 41.6666666667%
}

.col-xs-push-6 {
    left: 50%
}

.col-xs-push-7 {
    left: 58.3333333333%
}

.col-xs-push-8 {
    left: 66.6666666667%
}

.col-xs-push-9 {
    left: 75%
}

.col-xs-push-10 {
    left: 83.3333333333%
}

.col-xs-push-11 {
    left: 91.6666666667%
}

.col-xs-push-12 {
    left: 100%
}

.col-xs-offset-0 {
    margin-left: 0%
}

.col-xs-offset-1 {
    margin-left: 8.3333333333%
}

.col-xs-offset-2 {
    margin-left: 16.6666666667%
}

.col-xs-offset-3 {
    margin-left: 25%
}

.col-xs-offset-4 {
    margin-left: 33.3333333333%
}

.col-xs-offset-5 {
    margin-left: 41.6666666667%
}

.col-xs-offset-6 {
    margin-left: 50%
}

.col-xs-offset-7 {
    margin-left: 58.3333333333%
}

.col-xs-offset-8 {
    margin-left: 66.6666666667%
}

.col-xs-offset-9 {
    margin-left: 75%
}

.col-xs-offset-10 {
    margin-left: 83.3333333333%
}

.col-xs-offset-11 {
    margin-left: 91.6666666667%
}

.col-xs-offset-12 {
    margin-left: 100%
}

@media (min-width: 768px) {

    .col-sm-1,
    .col-sm-2,
    .col-sm-3,
    .col-sm-4,
    .col-sm-5,
    .col-sm-6,
    .col-sm-7,
    .col-sm-8,
    .col-sm-9,
    .col-sm-10,
    .col-sm-11,
    .col-sm-12 {
        float: left
    }

    .col-sm-1 {
        width: 8.3333333333%
    }

    .col-sm-2 {
        width: 16.6666666667%
    }

    .col-sm-3 {
        width: 25%
    }

    .col-sm-4 {
        width: 33.3333333333%
    }

    .col-sm-5 {
        width: 41.6666666667%
    }

    .col-sm-6 {
        width: 50%
    }

    .col-sm-7 {
        width: 58.3333333333%
    }

    .col-sm-8 {
        width: 66.6666666667%
    }

    .col-sm-9 {
        width: 75%
    }

    .col-sm-10 {
        width: 83.3333333333%
    }

    .col-sm-11 {
        width: 91.6666666667%
    }

    .col-sm-12 {
        width: 100%
    }

    .col-sm-pull-0 {
        right: auto
    }

    .col-sm-pull-1 {
        right: 8.3333333333%
    }

    .col-sm-pull-2 {
        right: 16.6666666667%
    }

    .col-sm-pull-3 {
        right: 25%
    }

    .col-sm-pull-4 {
        right: 33.3333333333%
    }

    .col-sm-pull-5 {
        right: 41.6666666667%
    }

    .col-sm-pull-6 {
        right: 50%
    }

    .col-sm-pull-7 {
        right: 58.3333333333%
    }

    .col-sm-pull-8 {
        right: 66.6666666667%
    }

    .col-sm-pull-9 {
        right: 75%
    }

    .col-sm-pull-10 {
        right: 83.3333333333%
    }

    .col-sm-pull-11 {
        right: 91.6666666667%
    }

    .col-sm-pull-12 {
        right: 100%
    }

    .col-sm-push-0 {
        left: auto
    }

    .col-sm-push-1 {
        left: 8.3333333333%
    }

    .col-sm-push-2 {
        left: 16.6666666667%
    }

    .col-sm-push-3 {
        left: 25%
    }

    .col-sm-push-4 {
        left: 33.3333333333%
    }

    .col-sm-push-5 {
        left: 41.6666666667%
    }

    .col-sm-push-6 {
        left: 50%
    }

    .col-sm-push-7 {
        left: 58.3333333333%
    }

    .col-sm-push-8 {
        left: 66.6666666667%
    }

    .col-sm-push-9 {
        left: 75%
    }

    .col-sm-push-10 {
        left: 83.3333333333%
    }

    .col-sm-push-11 {
        left: 91.6666666667%
    }

    .col-sm-push-12 {
        left: 100%
    }

    .col-sm-offset-0 {
        margin-left: 0%
    }

    .col-sm-offset-1 {
        margin-left: 8.3333333333%
    }

    .col-sm-offset-2 {
        margin-left: 16.6666666667%
    }

    .col-sm-offset-3 {
        margin-left: 25%
    }

    .col-sm-offset-4 {
        margin-left: 33.3333333333%
    }

    .col-sm-offset-5 {
        margin-left: 41.6666666667%
    }

    .col-sm-offset-6 {
        margin-left: 50%
    }

    .col-sm-offset-7 {
        margin-left: 58.3333333333%
    }

    .col-sm-offset-8 {
        margin-left: 66.6666666667%
    }

    .col-sm-offset-9 {
        margin-left: 75%
    }

    .col-sm-offset-10 {
        margin-left: 83.3333333333%
    }

    .col-sm-offset-11 {
        margin-left: 91.6666666667%
    }

    .col-sm-offset-12 {
        margin-left: 100%
    }
}

@media (min-width: 992px) {

    .col-md-1,
    .col-md-2,
    .col-md-3,
    .col-md-4,
    .col-md-5,
    .col-md-6,
    .col-md-7,
    .col-md-8,
    .col-md-9,
    .col-md-10,
    .col-md-11,
    .col-md-12 {
        float: left
    }

    .col-md-1 {
        width: 8.3333333333%
    }

    .col-md-2 {
        width: 16.6666666667%
    }

    .col-md-3 {
        width: 25%
    }

    .col-md-4 {
        width: 33.3333333333%
    }

    .col-md-5 {
        width: 41.6666666667%
    }

    .col-md-6 {
        width: 50%
    }

    .col-md-7 {
        width: 58.3333333333%
    }

    .col-md-8 {
        width: 66.6666666667%
    }

    .col-md-9 {
        width: 75%
    }

    .col-md-10 {
        width: 83.3333333333%
    }

    .col-md-11 {
        width: 91.6666666667%
    }

    .col-md-12 {
        width: 100%
    }

    .col-md-pull-0 {
        right: auto
    }

    .col-md-pull-1 {
        right: 8.3333333333%
    }

    .col-md-pull-2 {
        right: 16.6666666667%
    }

    .col-md-pull-3 {
        right: 25%
    }

    .col-md-pull-4 {
        right: 33.3333333333%
    }

    .col-md-pull-5 {
        right: 41.6666666667%
    }

    .col-md-pull-6 {
        right: 50%
    }

    .col-md-pull-7 {
        right: 58.3333333333%
    }

    .col-md-pull-8 {
        right: 66.6666666667%
    }

    .col-md-pull-9 {
        right: 75%
    }

    .col-md-pull-10 {
        right: 83.3333333333%
    }

    .col-md-pull-11 {
        right: 91.6666666667%
    }

    .col-md-pull-12 {
        right: 100%
    }

    .col-md-push-0 {
        left: auto
    }

    .col-md-push-1 {
        left: 8.3333333333%
    }

    .col-md-push-2 {
        left: 16.6666666667%
    }

    .col-md-push-3 {
        left: 25%
    }

    .col-md-push-4 {
        left: 33.3333333333%
    }

    .col-md-push-5 {
        left: 41.6666666667%
    }

    .col-md-push-6 {
        left: 50%
    }

    .col-md-push-7 {
        left: 58.3333333333%
    }

    .col-md-push-8 {
        left: 66.6666666667%
    }

    .col-md-push-9 {
        left: 75%
    }

    .col-md-push-10 {
        left: 83.3333333333%
    }

    .col-md-push-11 {
        left: 91.6666666667%
    }

    .col-md-push-12 {
        left: 100%
    }

    .col-md-offset-0 {
        margin-left: 0%
    }

    .col-md-offset-1 {
        margin-left: 8.3333333333%
    }

    .col-md-offset-2 {
        margin-left: 16.6666666667%
    }

    .col-md-offset-3 {
        margin-left: 25%
    }

    .col-md-offset-4 {
        margin-left: 33.3333333333%
    }

    .col-md-offset-5 {
        margin-left: 41.6666666667%
    }

    .col-md-offset-6 {
        margin-left: 50%
    }

    .col-md-offset-7 {
        margin-left: 58.3333333333%
    }

    .col-md-offset-8 {
        margin-left: 66.6666666667%
    }

    .col-md-offset-9 {
        margin-left: 75%
    }

    .col-md-offset-10 {
        margin-left: 83.3333333333%
    }

    .col-md-offset-11 {
        margin-left: 91.6666666667%
    }

    .col-md-offset-12 {
        margin-left: 100%
    }
}

@media (min-width: 1200px) {

    .col-lg-1,
    .col-lg-2,
    .col-lg-3,
    .col-lg-4,
    .col-lg-5,
    .col-lg-6,
    .col-lg-7,
    .col-lg-8,
    .col-lg-9,
    .col-lg-10,
    .col-lg-11,
    .col-lg-12 {
        float: left
    }

    .col-lg-1 {
        width: 8.3333333333%
    }

    .col-lg-2 {
        width: 16.6666666667%
    }

    .col-lg-3 {
        width: 25%
    }

    .col-lg-4 {
        width: 33.3333333333%
    }

    .col-lg-5 {
        width: 41.6666666667%
    }

    .col-lg-6 {
        width: 50%
    }

    .col-lg-7 {
        width: 58.3333333333%
    }

    .col-lg-8 {
        width: 66.6666666667%
    }

    .col-lg-9 {
        width: 75%
    }

    .col-lg-10 {
        width: 83.3333333333%
    }

    .col-lg-11 {
        width: 91.6666666667%
    }

    .col-lg-12 {
        width: 100%
    }

    .col-lg-pull-0 {
        right: auto
    }

    .col-lg-pull-1 {
        right: 8.3333333333%
    }

    .col-lg-pull-2 {
        right: 16.6666666667%
    }

    .col-lg-pull-3 {
        right: 25%
    }

    .col-lg-pull-4 {
        right: 33.3333333333%
    }

    .col-lg-pull-5 {
        right: 41.6666666667%
    }

    .col-lg-pull-6 {
        right: 50%
    }

    .col-lg-pull-7 {
        right: 58.3333333333%
    }

    .col-lg-pull-8 {
        right: 66.6666666667%
    }

    .col-lg-pull-9 {
        right: 75%
    }

    .col-lg-pull-10 {
        right: 83.3333333333%
    }

    .col-lg-pull-11 {
        right: 91.6666666667%
    }

    .col-lg-pull-12 {
        right: 100%
    }

    .col-lg-push-0 {
        left: auto
    }

    .col-lg-push-1 {
        left: 8.3333333333%
    }

    .col-lg-push-2 {
        left: 16.6666666667%
    }

    .col-lg-push-3 {
        left: 25%
    }

    .col-lg-push-4 {
        left: 33.3333333333%
    }

    .col-lg-push-5 {
        left: 41.6666666667%
    }

    .col-lg-push-6 {
        left: 50%
    }

    .col-lg-push-7 {
        left: 58.3333333333%
    }

    .col-lg-push-8 {
        left: 66.6666666667%
    }

    .col-lg-push-9 {
        left: 75%
    }

    .col-lg-push-10 {
        left: 83.3333333333%
    }

    .col-lg-push-11 {
        left: 91.6666666667%
    }

    .col-lg-push-12 {
        left: 100%
    }

    .col-lg-offset-0 {
        margin-left: 0%
    }

    .col-lg-offset-1 {
        margin-left: 8.3333333333%
    }

    .col-lg-offset-2 {
        margin-left: 16.6666666667%
    }

    .col-lg-offset-3 {
        margin-left: 25%
    }

    .col-lg-offset-4 {
        margin-left: 33.3333333333%
    }

    .col-lg-offset-5 {
        margin-left: 41.6666666667%
    }

    .col-lg-offset-6 {
        margin-left: 50%
    }

    .col-lg-offset-7 {
        margin-left: 58.3333333333%
    }

    .col-lg-offset-8 {
        margin-left: 66.6666666667%
    }

    .col-lg-offset-9 {
        margin-left: 75%
    }

    .col-lg-offset-10 {
        margin-left: 83.3333333333%
    }

    .col-lg-offset-11 {
        margin-left: 91.6666666667%
    }

    .col-lg-offset-12 {
        margin-left: 100%
    }
}

table {
    background-color: transparent
}

table col[class*="col-"] {
    position: static;
    display: table-column;
    float: none
}

table td[class*="col-"],
table th[class*="col-"] {
    position: static;
    display: table-cell;
    float: none
}

caption {
    padding-top: 8px;
    padding-bottom: 8px;
    color: #777777;
    text-align: left
}

th {
    text-align: left
}

.table {
    width: 100%;
    max-width: 100%;
    margin-bottom: 20px
}

.table>thead>tr>th,
.table>thead>tr>td,
.table>tbody>tr>th,
.table>tbody>tr>td,
.table>tfoot>tr>th,
.table>tfoot>tr>td {
    padding: 8px;
    line-height: 1.428571429;
    vertical-align: top;
    border-top: 1px solid #ddd
}

.table>thead>tr>th {
    vertical-align: bottom;
    border-bottom: 2px solid #ddd
}

.table>caption+thead>tr:first-child>th,
.table>caption+thead>tr:first-child>td,
.table>colgroup+thead>tr:first-child>th,
.table>colgroup+thead>tr:first-child>td,
.table>thead:first-child>tr:first-child>th,
.table>thead:first-child>tr:first-child>td {
    border-top: 0
}

.table>tbody+tbody {
    border-top: 2px solid #ddd
}

.table .table {
    background-color: #fff
}

.table-condensed>thead>tr>th,
.table-condensed>thead>tr>td,
.table-condensed>tbody>tr>th,
.table-condensed>tbody>tr>td,
.table-condensed>tfoot>tr>th,
.table-condensed>tfoot>tr>td {
    padding: 5px
}

.table-bordered {
    border: 1px solid #ddd
}

.table-bordered>thead>tr>th,
.table-bordered>thead>tr>td,
.table-bordered>tbody>tr>th,
.table-bordered>tbody>tr>td,
.table-bordered>tfoot>tr>th,
.table-bordered>tfoot>tr>td {
    border: 1px solid #ddd
}

.table-bordered>thead>tr>th,
.table-bordered>thead>tr>td {
    border-bottom-width: 2px
}

.table-striped>tbody>tr:nth-of-type(odd) {
    background-color: #f9f9f9
}

.table-hover>tbody>tr:hover {
    background-color: #f5f5f5
}

.table>thead>tr>td.active,
.table>thead>tr>th.active,
.table>thead>tr.active>td,
.table>thead>tr.active>th,
.table>tbody>tr>td.active,
.table>tbody>tr>th.active,
.table>tbody>tr.active>td,
.table>tbody>tr.active>th,
.table>tfoot>tr>td.active,
.table>tfoot>tr>th.active,
.table>tfoot>tr.active>td,
.table>tfoot>tr.active>th {
    background-color: #f5f5f5
}

.table-hover>tbody>tr>td.active:hover,
.table-hover>tbody>tr>th.active:hover,
.table-hover>tbody>tr.active:hover>td,
.table-hover>tbody>tr:hover>.active,
.table-hover>tbody>tr.active:hover>th {
    background-color: #e8e8e8
}

.table>thead>tr>td.success,
.table>thead>tr>th.success,
.table>thead>tr.success>td,
.table>thead>tr.success>th,
.table>tbody>tr>td.success,
.table>tbody>tr>th.success,
.table>tbody>tr.success>td,
.table>tbody>tr.success>th,
.table>tfoot>tr>td.success,
.table>tfoot>tr>th.success,
.table>tfoot>tr.success>td,
.table>tfoot>tr.success>th {
    background-color: #dff0d8
}

.table-hover>tbody>tr>td.success:hover,
.table-hover>tbody>tr>th.success:hover,
.table-hover>tbody>tr.success:hover>td,
.table-hover>tbody>tr:hover>.success,
.table-hover>tbody>tr.success:hover>th {
    background-color: #d0e9c6
}

.table>thead>tr>td.info,
.table>thead>tr>th.info,
.table>thead>tr.info>td,
.table>thead>tr.info>th,
.table>tbody>tr>td.info,
.table>tbody>tr>th.info,
.table>tbody>tr.info>td,
.table>tbody>tr.info>th,
.table>tfoot>tr>td.info,
.table>tfoot>tr>th.info,
.table>tfoot>tr.info>td,
.table>tfoot>tr.info>th {
    background-color: #d9edf7
}

.table-hover>tbody>tr>td.info:hover,
.table-hover>tbody>tr>th.info:hover,
.table-hover>tbody>tr.info:hover>td,
.table-hover>tbody>tr:hover>.info,
.table-hover>tbody>tr.info:hover>th {
    background-color: #c4e3f3
}

.table>thead>tr>td.warning,
.table>thead>tr>th.warning,
.table>thead>tr.warning>td,
.table>thead>tr.warning>th,
.table>tbody>tr>td.warning,
.table>tbody>tr>th.warning,
.table>tbody>tr.warning>td,
.table>tbody>tr.warning>th,
.table>tfoot>tr>td.warning,
.table>tfoot>tr>th.warning,
.table>tfoot>tr.warning>td,
.table>tfoot>tr.warning>th {
    background-color: #fcf8e3
}

.table-hover>tbody>tr>td.warning:hover,
.table-hover>tbody>tr>th.warning:hover,
.table-hover>tbody>tr.warning:hover>td,
.table-hover>tbody>tr:hover>.warning,
.table-hover>tbody>tr.warning:hover>th {
    background-color: #faf2cc
}

.table>thead>tr>td.danger,
.table>thead>tr>th.danger,
.table>thead>tr.danger>td,
.table>thead>tr.danger>th,
.table>tbody>tr>td.danger,
.table>tbody>tr>th.danger,
.table>tbody>tr.danger>td,
.table>tbody>tr.danger>th,
.table>tfoot>tr>td.danger,
.table>tfoot>tr>th.danger,
.table>tfoot>tr.danger>td,
.table>tfoot>tr.danger>th {
    background-color: #f2dede
}

.table-hover>tbody>tr>td.danger:hover,
.table-hover>tbody>tr>th.danger:hover,
.table-hover>tbody>tr.danger:hover>td,
.table-hover>tbody>tr:hover>.danger,
.table-hover>tbody>tr.danger:hover>th {
    background-color: #ebcccc
}

.table-responsive {
    min-height: .01%;
    overflow-x: auto
}

@media screen and (max-width: 767px) {
    .table-responsive {
        width: 100%;
        margin-bottom: 15px;
        overflow-y: hidden;
        -ms-overflow-style: -ms-autohiding-scrollbar;
        border: 1px solid #ddd
    }

    .table-responsive>.table {
        margin-bottom: 0
    }

    .table-responsive>.table>thead>tr>th,
    .table-responsive>.table>thead>tr>td,
    .table-responsive>.table>tbody>tr>th,
    .table-responsive>.table>tbody>tr>td,
    .table-responsive>.table>tfoot>tr>th,
    .table-responsive>.table>tfoot>tr>td {
        white-space: nowrap
    }

    .table-responsive>.table-bordered {
        border: 0
    }

    .table-responsive>.table-bordered>thead>tr>th:first-child,
    .table-responsive>.table-bordered>thead>tr>td:first-child,
    .table-responsive>.table-bordered>tbody>tr>th:first-child,
    .table-responsive>.table-bordered>tbody>tr>td:first-child,
    .table-responsive>.table-bordered>tfoot>tr>th:first-child,
    .table-responsive>.table-bordered>tfoot>tr>td:first-child {
        border-left: 0
    }

    .table-responsive>.table-bordered>thead>tr>th:last-child,
    .table-responsive>.table-bordered>thead>tr>td:last-child,
    .table-responsive>.table-bordered>tbody>tr>th:last-child,
    .table-responsive>.table-bordered>tbody>tr>td:last-child,
    .table-responsive>.table-bordered>tfoot>tr>th:last-child,
    .table-responsive>.table-bordered>tfoot>tr>td:last-child {
        border-right: 0
    }

    .table-responsive>.table-bordered>tbody>tr:last-child>th,
    .table-responsive>.table-bordered>tbody>tr:last-child>td,
    .table-responsive>.table-bordered>tfoot>tr:last-child>th,
    .table-responsive>.table-bordered>tfoot>tr:last-child>td {
        border-bottom: 0
    }
}

fieldset {
    min-width: 0;
    padding: 0;
    margin: 0;
    border: 0
}

legend {
    display: block;
    width: 100%;
    padding: 0;
    margin-bottom: 20px;
    font-size: 21px;
    line-height: inherit;
    color: #333333;
    border: 0;
    border-bottom: 1px solid #e5e5e5
}

label {
    display: inline-block;
    max-width: 100%;
    margin-bottom: 5px;
    font-weight: 700
}

input[type="search"] {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-appearance: none;
    appearance: none
}

input[type="radio"],
input[type="checkbox"] {
    margin: 4px 0 0;
    margin-top: 1px \9;
    line-height: normal
}

input[type="radio"][disabled],
input.disabled[type="radio"],
fieldset[disabled] input[type="radio"],
input[type="checkbox"][disabled],
input.disabled[type="checkbox"],
fieldset[disabled] input[type="checkbox"] {
    cursor: not-allowed
}

input[type="file"] {
    display: block
}

input[type="range"] {
    display: block;
    width: 100%
}

select[multiple],
select[size] {
    height: auto
}

input[type="file"]:focus,
input[type="radio"]:focus,
input[type="checkbox"]:focus {
    outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px
}

output {
    display: block;
    padding-top: 7px;
    font-size: 14px;
    line-height: 1.428571429;
    color: #555555
}

.form-control {
    display: block;
    width: 100%;
    height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.428571429;
    color: #555555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
    -o-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
    transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s
}

.form-control:focus {
    border-color: #66afe9;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6)
}

.form-control::-moz-placeholder {
    color: #999;
    opacity: 1
}

.form-control:-ms-input-placeholder {
    color: #999
}

.form-control::-webkit-input-placeholder {
    color: #999
}

.form-control::-ms-expand {
    background-color: transparent;
    border: 0
}

.form-control[disabled],
.form-control[readonly],
fieldset[disabled] .form-control {
    background-color: #eeeeee;
    opacity: 1
}

.form-control[disabled],
fieldset[disabled] .form-control {
    cursor: not-allowed
}

textarea.form-control {
    height: auto
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {

    input.form-control[type="date"],
    input.form-control[type="time"],
    input.form-control[type="datetime-local"],
    input.form-control[type="month"] {
        line-height: 34px
    }

    input.input-sm[type="date"],
    .input-group-sm>.form-control[type="date"],
    .input-group-sm>.input-group-addon[type="date"],
    .input-group-sm>.input-group-btn>.btn[type="date"],
    .input-group-sm input[type="date"],
    input.input-sm[type="time"],
    .input-group-sm>.form-control[type="time"],
    .input-group-sm>.input-group-addon[type="time"],
    .input-group-sm>.input-group-btn>.btn[type="time"],
    .input-group-sm input[type="time"],
    input.input-sm[type="datetime-local"],
    .input-group-sm>.form-control[type="datetime-local"],
    .input-group-sm>.input-group-addon[type="datetime-local"],
    .input-group-sm>.input-group-btn>.btn[type="datetime-local"],
    .input-group-sm input[type="datetime-local"],
    input.input-sm[type="month"],
    .input-group-sm>.form-control[type="month"],
    .input-group-sm>.input-group-addon[type="month"],
    .input-group-sm>.input-group-btn>.btn[type="month"],
    .input-group-sm input[type="month"] {
        line-height: 30px
    }

    input.input-lg[type="date"],
    .input-group-lg>.form-control[type="date"],
    .input-group-lg>.input-group-addon[type="date"],
    .input-group-lg>.input-group-btn>.btn[type="date"],
    .input-group-lg input[type="date"],
    input.input-lg[type="time"],
    .input-group-lg>.form-control[type="time"],
    .input-group-lg>.input-group-addon[type="time"],
    .input-group-lg>.input-group-btn>.btn[type="time"],
    .input-group-lg input[type="time"],
    input.input-lg[type="datetime-local"],
    .input-group-lg>.form-control[type="datetime-local"],
    .input-group-lg>.input-group-addon[type="datetime-local"],
    .input-group-lg>.input-group-btn>.btn[type="datetime-local"],
    .input-group-lg input[type="datetime-local"],
    input.input-lg[type="month"],
    .input-group-lg>.form-control[type="month"],
    .input-group-lg>.input-group-addon[type="month"],
    .input-group-lg>.input-group-btn>.btn[type="month"],
    .input-group-lg input[type="month"] {
        line-height: 44px
    }
}

.form-group {
    margin-bottom: 15px
}

.radio,
.checkbox {
    position: relative;
    display: block;
    margin-top: 10px;
    margin-bottom: 10px
}

.radio.disabled label,
fieldset[disabled] .radio label,
.checkbox.disabled label,
fieldset[disabled] .checkbox label {
    cursor: not-allowed
}

.radio label,
.checkbox label {
    min-height: 20px;
    padding-left: 20px;
    margin-bottom: 0;
    font-weight: 400;
    cursor: pointer
}

.radio input[type="radio"],
.radio-inline input[type="radio"],
.checkbox input[type="checkbox"],
.checkbox-inline input[type="checkbox"] {
    position: absolute;
    margin-top: 4px \9;
    margin-left: -20px
}

.radio+.radio,
.checkbox+.checkbox {
    margin-top: -5px
}

.radio-inline,
.checkbox-inline {
    position: relative;
    display: inline-block;
    padding-left: 20px;
    margin-bottom: 0;
    font-weight: 400;
    vertical-align: middle;
    cursor: pointer
}

.radio-inline.disabled,
fieldset[disabled] .radio-inline,
.checkbox-inline.disabled,
fieldset[disabled] .checkbox-inline {
    cursor: not-allowed
}

.radio-inline+.radio-inline,
.checkbox-inline+.checkbox-inline {
    margin-top: 0;
    margin-left: 10px
}

.form-control-static {
    min-height: 34px;
    padding-top: 7px;
    padding-bottom: 7px;
    margin-bottom: 0
}

.form-control-static.input-lg,
.input-group-lg>.form-control-static.form-control,
.input-group-lg>.form-control-static.input-group-addon,
.input-group-lg>.input-group-btn>.form-control-static.btn,
.form-control-static.input-sm,
.input-group-sm>.form-control-static.form-control,
.input-group-sm>.form-control-static.input-group-addon,
.input-group-sm>.input-group-btn>.form-control-static.btn {
    padding-right: 0;
    padding-left: 0
}

.input-sm,
.input-group-sm>.form-control,
.input-group-sm>.input-group-addon,
.input-group-sm>.input-group-btn>.btn {
    height: 30px;
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px
}

select.input-sm,
.input-group-sm>select.form-control,
.input-group-sm>select.input-group-addon,
.input-group-sm>.input-group-btn>select.btn {
    height: 30px;
    line-height: 30px
}

textarea.input-sm,
.input-group-sm>textarea.form-control,
.input-group-sm>textarea.input-group-addon,
.input-group-sm>.input-group-btn>textarea.btn,
select.input-sm[multiple],
.input-group-sm>.form-control[multiple],
.input-group-sm>.input-group-addon[multiple],
.input-group-sm>.input-group-btn>.btn[multiple] {
    height: auto
}

.form-group-sm .form-control {
    height: 30px;
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px
}

.form-group-sm select.form-control {
    height: 30px;
    line-height: 30px
}

.form-group-sm textarea.form-control,
.form-group-sm select.form-control[multiple] {
    height: auto
}

.form-group-sm .form-control-static {
    height: 30px;
    min-height: 32px;
    padding: 6px 10px;
    font-size: 12px;
    line-height: 1.5
}

.input-lg,
.input-group-lg>.form-control,
.input-group-lg>.input-group-addon,
.input-group-lg>.input-group-btn>.btn {
    height: 44px;
    padding: 10px 16px;
    font-size: 16px;
    line-height: 1.3333333;
    border-radius: 6px
}

select.input-lg,
.input-group-lg>select.form-control,
.input-group-lg>select.input-group-addon,
.input-group-lg>.input-group-btn>select.btn {
    height: 44px;
    line-height: 44px
}

textarea.input-lg,
.input-group-lg>textarea.form-control,
.input-group-lg>textarea.input-group-addon,
.input-group-lg>.input-group-btn>textarea.btn,
select.input-lg[multiple],
.input-group-lg>.form-control[multiple],
.input-group-lg>.input-group-addon[multiple],
.input-group-lg>.input-group-btn>.btn[multiple] {
    height: auto
}

.form-group-lg .form-control {
    height: 44px;
    padding: 10px 16px;
    font-size: 16px;
    line-height: 1.3333333;
    border-radius: 6px
}

.form-group-lg select.form-control {
    height: 44px;
    line-height: 44px
}

.form-group-lg textarea.form-control,
.form-group-lg select.form-control[multiple] {
    height: auto
}

.form-group-lg .form-control-static {
    height: 44px;
    min-height: 36px;
    padding: 11px 16px;
    font-size: 16px;
    line-height: 1.3333333
}

.has-feedback {
    position: relative
}

.has-feedback .form-control {
    padding-right: 42.5px
}

.form-control-feedback {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
    display: block;
    width: 34px;
    height: 34px;
    line-height: 34px;
    text-align: center;
    pointer-events: none
}

.input-lg+.form-control-feedback,
.input-group-lg>.form-control+.form-control-feedback,
.input-group-lg>.input-group-addon+.form-control-feedback,
.input-group-lg>.input-group-btn>.btn+.form-control-feedback,
.input-group-lg+.form-control-feedback,
.form-group-lg .form-control+.form-control-feedback {
    width: 44px;
    height: 44px;
    line-height: 44px
}

.input-sm+.form-control-feedback,
.input-group-sm>.form-control+.form-control-feedback,
.input-group-sm>.input-group-addon+.form-control-feedback,
.input-group-sm>.input-group-btn>.btn+.form-control-feedback,
.input-group-sm+.form-control-feedback,
.form-group-sm .form-control+.form-control-feedback {
    width: 30px;
    height: 30px;
    line-height: 30px
}

.has-success .help-block,
.has-success .control-label,
.has-success .radio,
.has-success .checkbox,
.has-success .radio-inline,
.has-success .checkbox-inline,
.has-success.radio label,
.has-success.checkbox label,
.has-success.radio-inline label,
.has-success.checkbox-inline label {
    color: #3c763d
}

.has-success .form-control {
    border-color: #3c763d;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075)
}

.has-success .form-control:focus {
    border-color: #2b542c;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #67b168;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #67b168
}

.has-success .input-group-addon {
    color: #3c763d;
    background-color: #dff0d8;
    border-color: #3c763d
}

.has-success .form-control-feedback {
    color: #3c763d
}

.has-warning .help-block,
.has-warning .control-label,
.has-warning .radio,
.has-warning .checkbox,
.has-warning .radio-inline,
.has-warning .checkbox-inline,
.has-warning.radio label,
.has-warning.checkbox label,
.has-warning.radio-inline label,
.has-warning.checkbox-inline label {
    color: #8a6d3b
}

.has-warning .form-control {
    border-color: #8a6d3b;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075)
}

.has-warning .form-control:focus {
    border-color: #66512c;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #c0a16b;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #c0a16b
}

.has-warning .input-group-addon {
    color: #8a6d3b;
    background-color: #fcf8e3;
    border-color: #8a6d3b
}

.has-warning .form-control-feedback {
    color: #8a6d3b
}

.has-error .help-block,
.has-error .control-label,
.has-error .radio,
.has-error .checkbox,
.has-error .radio-inline,
.has-error .checkbox-inline,
.has-error.radio label,
.has-error.checkbox label,
.has-error.radio-inline label,
.has-error.checkbox-inline label {
    color: #a94442
}

.has-error .form-control {
    border-color: #a94442;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075)
}

.has-error .form-control:focus {
    border-color: #843534;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483
}

.has-error .input-group-addon {
    color: #a94442;
    background-color: #f2dede;
    border-color: #a94442
}

.has-error .form-control-feedback {
    color: #a94442
}

.has-feedback label~.form-control-feedback {
    top: 25px
}

.has-feedback label.sr-only~.form-control-feedback {
    top: 0
}

.help-block {
    display: block;
    margin-top: 5px;
    margin-bottom: 10px;
    color: #737373
}

@media (min-width: 768px) {
    .form-inline .form-group {
        display: inline-block;
        margin-bottom: 0;
        vertical-align: middle
    }

    .form-inline .form-control {
        display: inline-block;
        width: auto;
        vertical-align: middle
    }

    .form-inline .form-control-static {
        display: inline-block
    }

    .form-inline .input-group {
        display: inline-table;
        vertical-align: middle
    }

    .form-inline .input-group .input-group-addon,
    .form-inline .input-group .input-group-btn,
    .form-inline .input-group .form-control {
        width: auto
    }

    .form-inline .input-group>.form-control {
        width: 100%
    }

    .form-inline .control-label {
        margin-bottom: 0;
        vertical-align: middle
    }

    .form-inline .radio,
    .form-inline .checkbox {
        display: inline-block;
        margin-top: 0;
        margin-bottom: 0;
        vertical-align: middle
    }

    .form-inline .radio label,
    .form-inline .checkbox label {
        padding-left: 0
    }

    .form-inline .radio input[type="radio"],
    .form-inline .checkbox input[type="checkbox"] {
        position: relative;
        margin-left: 0
    }

    .form-inline .has-feedback .form-control-feedback {
        top: 0
    }
}

.form-horizontal .radio,
.form-horizontal .checkbox,
.form-horizontal .radio-inline,
.form-horizontal .checkbox-inline {
    padding-top: 7px;
    margin-top: 0;
    margin-bottom: 0
}

.form-horizontal .radio,
.form-horizontal .checkbox {
    min-height: 27px
}

.form-horizontal .form-group {
    margin-right: -5px;
    margin-left: -5px
}

.form-horizontal .form-group:before,
.form-horizontal .form-group:after {
    display: table;
    content: " "
}

.form-horizontal .form-group:after {
    clear: both
}

@media (min-width: 768px) {
    .form-horizontal .control-label {
        padding-top: 7px;
        margin-bottom: 0;
        text-align: right
    }
}

.form-horizontal .has-feedback .form-control-feedback {
    right: 5px
}

@media (min-width: 768px) {
    .form-horizontal .form-group-lg .control-label {
        padding-top: 11px;
        font-size: 16px
    }
}

@media (min-width: 768px) {
    .form-horizontal .form-group-sm .control-label {
        padding-top: 6px;
        font-size: 12px
    }
}

.btn {
    display: inline-block;
    margin-bottom: 0;
    font-weight: normal;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    touch-action: manipulation;
    cursor: pointer;
    background-image: none;
    border: 1px solid transparent;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.428571429;
    border-radius: 4px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.btn:focus,
.btn.focus,
.btn:active:focus,
.btn.focus:active,
.btn.active:focus,
.btn.active.focus {
    outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px
}

.btn:hover,
.btn:focus,
.btn.focus {
    color: #333;
    text-decoration: none
}

.btn:active,
.btn.active {
    background-image: none;
    outline: 0;
    -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125)
}

.btn.disabled,
.btn[disabled],
fieldset[disabled] .btn {
    cursor: not-allowed;
    filter: alpha(opacity=65);
    opacity: 0.65;
    -webkit-box-shadow: none;
    box-shadow: none
}

a.btn.disabled,
fieldset[disabled] a.btn {
    pointer-events: none
}

.btn-default {
    color: #333;
    background-color: #fff;
    border-color: #ccc
}

.btn-default:focus,
.btn-default.focus {
    color: #333;
    background-color: #e6e6e6;
    border-color: #8c8c8c
}

.btn-default:hover {
    color: #333;
    background-color: #e6e6e6;
    border-color: #adadad
}

.btn-default:active,
.btn-default.active,
.open>.btn-default.dropdown-toggle {
    color: #333;
    background-color: #e6e6e6;
    background-image: none;
    border-color: #adadad
}

.btn-default:active:hover,
.btn-default:active:focus,
.btn-default.focus:active,
.btn-default.active:hover,
.btn-default.active:focus,
.btn-default.active.focus,
.open>.btn-default.dropdown-toggle:hover,
.open>.btn-default.dropdown-toggle:focus,
.open>.btn-default.dropdown-toggle.focus {
    color: #333;
    background-color: #d4d4d4;
    border-color: #8c8c8c
}

.btn-default.disabled:hover,
.btn-default.disabled:focus,
.btn-default.disabled.focus,
.btn-default[disabled]:hover,
.btn-default[disabled]:focus,
.btn-default.focus[disabled],
fieldset[disabled] .btn-default:hover,
fieldset[disabled] .btn-default:focus,
fieldset[disabled] .btn-default.focus {
    background-color: #fff;
    border-color: #ccc
}

.btn-default .badge {
    color: #fff;
    background-color: #333
}

.btn-primary {
    color: #fff;
    background-color: #337ab7;
    border-color: #2e6da4
}

.btn-primary:focus,
.btn-primary.focus {
    color: #fff;
    background-color: #286090;
    border-color: #122b40
}

.btn-primary:hover {
    color: #fff;
    background-color: #286090;
    border-color: #204d74
}

.btn-primary:active,
.btn-primary.active,
.open>.btn-primary.dropdown-toggle {
    color: #fff;
    background-color: #286090;
    background-image: none;
    border-color: #204d74
}

.btn-primary:active:hover,
.btn-primary:active:focus,
.btn-primary.focus:active,
.btn-primary.active:hover,
.btn-primary.active:focus,
.btn-primary.active.focus,
.open>.btn-primary.dropdown-toggle:hover,
.open>.btn-primary.dropdown-toggle:focus,
.open>.btn-primary.dropdown-toggle.focus {
    color: #fff;
    background-color: #204d74;
    border-color: #122b40
}

.btn-primary.disabled:hover,
.btn-primary.disabled:focus,
.btn-primary.disabled.focus,
.btn-primary[disabled]:hover,
.btn-primary[disabled]:focus,
.btn-primary.focus[disabled],
fieldset[disabled] .btn-primary:hover,
fieldset[disabled] .btn-primary:focus,
fieldset[disabled] .btn-primary.focus {
    background-color: #337ab7;
    border-color: #2e6da4
}

.btn-primary .badge {
    color: #337ab7;
    background-color: #fff
}

.btn-success {
    color: #fff;
    background-color: #5cb85c;
    border-color: #4cae4c
}

.btn-success:focus,
.btn-success.focus {
    color: #fff;
    background-color: #449d44;
    border-color: #255625
}

.btn-success:hover {
    color: #fff;
    background-color: #449d44;
    border-color: #398439
}

.btn-success:active,
.btn-success.active,
.open>.btn-success.dropdown-toggle {
    color: #fff;
    background-color: #449d44;
    background-image: none;
    border-color: #398439
}

.btn-success:active:hover,
.btn-success:active:focus,
.btn-success.focus:active,
.btn-success.active:hover,
.btn-success.active:focus,
.btn-success.active.focus,
.open>.btn-success.dropdown-toggle:hover,
.open>.btn-success.dropdown-toggle:focus,
.open>.btn-success.dropdown-toggle.focus {
    color: #fff;
    background-color: #398439;
    border-color: #255625
}

.btn-success.disabled:hover,
.btn-success.disabled:focus,
.btn-success.disabled.focus,
.btn-success[disabled]:hover,
.btn-success[disabled]:focus,
.btn-success.focus[disabled],
fieldset[disabled] .btn-success:hover,
fieldset[disabled] .btn-success:focus,
fieldset[disabled] .btn-success.focus {
    background-color: #5cb85c;
    border-color: #4cae4c
}

.btn-success .badge {
    color: #5cb85c;
    background-color: #fff
}

.btn-info {
    color: #fff;
    background-color: #5bc0de;
    border-color: #46b8da
}

.btn-info:focus,
.btn-info.focus {
    color: #fff;
    background-color: #31b0d5;
    border-color: #1b6d85
}

.btn-info:hover {
    color: #fff;
    background-color: #31b0d5;
    border-color: #269abc
}

.btn-info:active,
.btn-info.active,
.open>.btn-info.dropdown-toggle {
    color: #fff;
    background-color: #31b0d5;
    background-image: none;
    border-color: #269abc
}

.btn-info:active:hover,
.btn-info:active:focus,
.btn-info.focus:active,
.btn-info.active:hover,
.btn-info.active:focus,
.btn-info.active.focus,
.open>.btn-info.dropdown-toggle:hover,
.open>.btn-info.dropdown-toggle:focus,
.open>.btn-info.dropdown-toggle.focus {
    color: #fff;
    background-color: #269abc;
    border-color: #1b6d85
}

.btn-info.disabled:hover,
.btn-info.disabled:focus,
.btn-info.disabled.focus,
.btn-info[disabled]:hover,
.btn-info[disabled]:focus,
.btn-info.focus[disabled],
fieldset[disabled] .btn-info:hover,
fieldset[disabled] .btn-info:focus,
fieldset[disabled] .btn-info.focus {
    background-color: #5bc0de;
    border-color: #46b8da
}

.btn-info .badge {
    color: #5bc0de;
    background-color: #fff
}

.btn-warning {
    color: #fff;
    background-color: #f0ad4e;
    border-color: #eea236
}

.btn-warning:focus,
.btn-warning.focus {
    color: #fff;
    background-color: #ec971f;
    border-color: #985f0d
}

.btn-warning:hover {
    color: #fff;
    background-color: #ec971f;
    border-color: #d58512
}

.btn-warning:active,
.btn-warning.active,
.open>.btn-warning.dropdown-toggle {
    color: #fff;
    background-color: #ec971f;
    background-image: none;
    border-color: #d58512
}

.btn-warning:active:hover,
.btn-warning:active:focus,
.btn-warning.focus:active,
.btn-warning.active:hover,
.btn-warning.active:focus,
.btn-warning.active.focus,
.open>.btn-warning.dropdown-toggle:hover,
.open>.btn-warning.dropdown-toggle:focus,
.open>.btn-warning.dropdown-toggle.focus {
    color: #fff;
    background-color: #d58512;
    border-color: #985f0d
}

.btn-warning.disabled:hover,
.btn-warning.disabled:focus,
.btn-warning.disabled.focus,
.btn-warning[disabled]:hover,
.btn-warning[disabled]:focus,
.btn-warning.focus[disabled],
fieldset[disabled] .btn-warning:hover,
fieldset[disabled] .btn-warning:focus,
fieldset[disabled] .btn-warning.focus {
    background-color: #f0ad4e;
    border-color: #eea236
}

.btn-warning .badge {
    color: #f0ad4e;
    background-color: #fff
}

.btn-danger {
    color: #fff;
    background-color: #d9534f;
    border-color: #d43f3a
}

.btn-danger:focus,
.btn-danger.focus {
    color: #fff;
    background-color: #c9302c;
    border-color: #761c19
}

.btn-danger:hover {
    color: #fff;
    background-color: #c9302c;
    border-color: #ac2925
}

.btn-danger:active,
.btn-danger.active,
.open>.btn-danger.dropdown-toggle {
    color: #fff;
    background-color: #c9302c;
    background-image: none;
    border-color: #ac2925
}

.btn-danger:active:hover,
.btn-danger:active:focus,
.btn-danger.focus:active,
.btn-danger.active:hover,
.btn-danger.active:focus,
.btn-danger.active.focus,
.open>.btn-danger.dropdown-toggle:hover,
.open>.btn-danger.dropdown-toggle:focus,
.open>.btn-danger.dropdown-toggle.focus {
    color: #fff;
    background-color: #ac2925;
    border-color: #761c19
}

.btn-danger.disabled:hover,
.btn-danger.disabled:focus,
.btn-danger.disabled.focus,
.btn-danger[disabled]:hover,
.btn-danger[disabled]:focus,
.btn-danger.focus[disabled],
fieldset[disabled] .btn-danger:hover,
fieldset[disabled] .btn-danger:focus,
fieldset[disabled] .btn-danger.focus {
    background-color: #d9534f;
    border-color: #d43f3a
}

.btn-danger .badge {
    color: #d9534f;
    background-color: #fff
}

.btn-link {
    font-weight: 400;
    color: #337ab7;
    border-radius: 0
}

.btn-link,
.btn-link:active,
.btn-link.active,
.btn-link[disabled],
fieldset[disabled] .btn-link {
    background-color: transparent;
    -webkit-box-shadow: none;
    box-shadow: none
}

.btn-link,
.btn-link:hover,
.btn-link:focus,
.btn-link:active {
    border-color: transparent
}

.btn-link:hover,
.btn-link:focus {
    color: #23527c;
    text-decoration: underline;
    background-color: transparent
}

.btn-link[disabled]:hover,
.btn-link[disabled]:focus,
fieldset[disabled] .btn-link:hover,
fieldset[disabled] .btn-link:focus {
    color: #777777;
    text-decoration: none
}

.btn-lg,
.btn-group-lg>.btn {
    padding: 10px 16px;
    font-size: 16px;
    line-height: 1.3333333;
    border-radius: 6px
}

.btn-sm,
.btn-group-sm>.btn {
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px
}

.btn-xs,
.btn-group-xs>.btn {
    padding: 1px 5px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px
}

.btn-block {
    display: block;
    width: 100%
}

.btn-block+.btn-block {
    margin-top: 5px
}

input.btn-block[type="submit"],
input.btn-block[type="reset"],
input.btn-block[type="button"] {
    width: 100%
}

.fade {
    opacity: 0;
    -webkit-transition: opacity 0.15s linear;
    -o-transition: opacity 0.15s linear;
    transition: opacity 0.15s linear
}

.fade.in {
    opacity: 1
}

.collapse {
    display: none
}

.collapse.in {
    display: block
}

tr.collapse.in {
    display: table-row
}

tbody.collapse.in {
    display: table-row-group
}

.collapsing {
    position: relative;
    height: 0;
    overflow: hidden;
    -webkit-transition-property: height, visibility;
    transition-property: height, visibility;
    -webkit-transition-duration: 0.35s;
    transition-duration: 0.35s;
    -webkit-transition-timing-function: ease;
    transition-timing-function: ease
}

.caret {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 2px;
    vertical-align: middle;
    border-top: 4px dashed;
    border-top: 4px solid \9;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent
}

.dropup,
.dropdown {
    position: relative
}

.dropdown-toggle:focus {
    outline: 0
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 160px;
    padding: 5px 0;
    margin: 2px 0 0;
    font-size: 14px;
    text-align: left;
    list-style: none;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ccc;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 4px;
    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175)
}

.dropdown-menu.pull-right {
    right: 0;
    left: auto
}

.dropdown-menu .divider {
    height: 1px;
    margin: 9px 0;
    overflow: hidden;
    background-color: #e5e5e5
}

.dropdown-menu>li>a {
    display: block;
    padding: 3px 20px;
    clear: both;
    font-weight: 400;
    line-height: 1.428571429;
    color: #333333;
    white-space: nowrap
}

.dropdown-menu>li>a:hover,
.dropdown-menu>li>a:focus {
    color: #262626;
    text-decoration: none;
    background-color: #f5f5f5
}

.dropdown-menu>.active>a,
.dropdown-menu>.active>a:hover,
.dropdown-menu>.active>a:focus {
    color: #fff;
    text-decoration: none;
    background-color: #337ab7;
    outline: 0
}

.dropdown-menu>.disabled>a,
.dropdown-menu>.disabled>a:hover,
.dropdown-menu>.disabled>a:focus {
    color: #777777
}

.dropdown-menu>.disabled>a:hover,
.dropdown-menu>.disabled>a:focus {
    text-decoration: none;
    cursor: not-allowed;
    background-color: transparent;
    background-image: none;
    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false)
}

.open>.dropdown-menu {
    display: block
}

.open>a {
    outline: 0
}

.dropdown-menu-right {
    right: 0;
    left: auto
}

.dropdown-menu-left {
    right: auto;
    left: 0
}

.dropdown-header {
    display: block;
    padding: 3px 20px;
    font-size: 12px;
    line-height: 1.428571429;
    color: #777777;
    white-space: nowrap
}

.dropdown-backdrop {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 990
}

.pull-right>.dropdown-menu {
    right: 0;
    left: auto
}

.dropup .caret,
.navbar-fixed-bottom .dropdown .caret {
    content: "";
    border-top: 0;
    border-bottom: 4px dashed;
    border-bottom: 4px solid \9
}

.dropup .dropdown-menu,
.navbar-fixed-bottom .dropdown .dropdown-menu {
    top: auto;
    bottom: 100%;
    margin-bottom: 2px
}

@media (min-width: 768px) {
    .navbar-right .dropdown-menu {
        right: 0;
        left: auto
    }

    .navbar-right .dropdown-menu-left {
        left: 0;
        right: auto
    }
}

.btn-group,
.btn-group-vertical {
    position: relative;
    display: inline-block;
    vertical-align: middle
}

.btn-group>.btn,
.btn-group-vertical>.btn {
    position: relative;
    float: left
}

.btn-group>.btn:hover,
.btn-group>.btn:focus,
.btn-group>.btn:active,
.btn-group>.btn.active,
.btn-group-vertical>.btn:hover,
.btn-group-vertical>.btn:focus,
.btn-group-vertical>.btn:active,
.btn-group-vertical>.btn.active {
    z-index: 2
}

.btn-group .btn+.btn,
.btn-group .btn+.btn-group,
.btn-group .btn-group+.btn,
.btn-group .btn-group+.btn-group {
    margin-left: -1px
}

.btn-toolbar {
    margin-left: -5px
}

.btn-toolbar:before,
.btn-toolbar:after {
    display: table;
    content: " "
}

.btn-toolbar:after {
    clear: both
}

.btn-toolbar .btn,
.btn-toolbar .btn-group,
.btn-toolbar .input-group {
    float: left
}

.btn-toolbar>.btn,
.btn-toolbar>.btn-group,
.btn-toolbar>.input-group {
    margin-left: 5px
}

.btn-group>.btn:not(:first-child):not(:last-child):not(.dropdown-toggle) {
    border-radius: 0
}

.btn-group>.btn:first-child {
    margin-left: 0
}

.btn-group>.btn:first-child:not(:last-child):not(.dropdown-toggle) {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0
}

.btn-group>.btn:last-child:not(:first-child),
.btn-group>.dropdown-toggle:not(:first-child) {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0
}

.btn-group>.btn-group {
    float: left
}

.btn-group>.btn-group:not(:first-child):not(:last-child)>.btn {
    border-radius: 0
}

.btn-group>.btn-group:first-child:not(:last-child)>.btn:last-child,
.btn-group>.btn-group:first-child:not(:last-child)>.dropdown-toggle {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0
}

.btn-group>.btn-group:last-child:not(:first-child)>.btn:first-child {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0
}

.btn-group .dropdown-toggle:active,
.btn-group.open .dropdown-toggle {
    outline: 0
}

.btn-group>.btn+.dropdown-toggle {
    padding-right: 8px;
    padding-left: 8px
}

.btn-group>.btn-lg+.dropdown-toggle,
.btn-group-lg.btn-group>.btn+.dropdown-toggle {
    padding-right: 12px;
    padding-left: 12px
}

.btn-group.open .dropdown-toggle {
    -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125)
}

.btn-group.open .dropdown-toggle.btn-link {
    -webkit-box-shadow: none;
    box-shadow: none
}

.btn .caret {
    margin-left: 0
}

.btn-lg .caret,
.btn-group-lg>.btn .caret {
    border-width: 5px 5px 0;
    border-bottom-width: 0
}

.dropup .btn-lg .caret,
.dropup .btn-group-lg>.btn .caret {
    border-width: 0 5px 5px
}

.btn-group-vertical>.btn,
.btn-group-vertical>.btn-group,
.btn-group-vertical>.btn-group>.btn {
    display: block;
    float: none;
    width: 100%;
    max-width: 100%
}

.btn-group-vertical>.btn-group:before,
.btn-group-vertical>.btn-group:after {
    display: table;
    content: " "
}

.btn-group-vertical>.btn-group:after {
    clear: both
}

.btn-group-vertical>.btn-group>.btn {
    float: none
}

.btn-group-vertical>.btn+.btn,
.btn-group-vertical>.btn+.btn-group,
.btn-group-vertical>.btn-group+.btn,
.btn-group-vertical>.btn-group+.btn-group {
    margin-top: -1px;
    margin-left: 0
}

.btn-group-vertical>.btn:not(:first-child):not(:last-child) {
    border-radius: 0
}

.btn-group-vertical>.btn:first-child:not(:last-child) {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0
}

.btn-group-vertical>.btn:last-child:not(:first-child) {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px
}

.btn-group-vertical>.btn-group:not(:first-child):not(:last-child)>.btn {
    border-radius: 0
}

.btn-group-vertical>.btn-group:first-child:not(:last-child)>.btn:last-child,
.btn-group-vertical>.btn-group:first-child:not(:last-child)>.dropdown-toggle {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0
}

.btn-group-vertical>.btn-group:last-child:not(:first-child)>.btn:first-child {
    border-top-left-radius: 0;
    border-top-right-radius: 0
}

.btn-group-justified {
    display: table;
    width: 100%;
    table-layout: fixed;
    border-collapse: separate
}

.btn-group-justified>.btn,
.btn-group-justified>.btn-group {
    display: table-cell;
    float: none;
    width: 1%
}

.btn-group-justified>.btn-group .btn {
    width: 100%
}

.btn-group-justified>.btn-group .dropdown-menu {
    left: auto
}

[data-toggle="buttons"]>.btn input[type="radio"],
[data-toggle="buttons"]>.btn input[type="checkbox"],
[data-toggle="buttons"]>.btn-group>.btn input[type="radio"],
[data-toggle="buttons"]>.btn-group>.btn input[type="checkbox"] {
    position: absolute;
    clip: rect(0, 0, 0, 0);
    pointer-events: none
}

.input-group {
    position: relative;
    display: table;
    border-collapse: separate
}

.input-group[class*="col-"] {
    float: none;
    padding-right: 0;
    padding-left: 0
}

.input-group .form-control {
    position: relative;
    z-index: 2;
    float: left;
    width: 100%;
    margin-bottom: 0
}

.input-group .form-control:focus {
    z-index: 3
}

.input-group-addon,
.input-group-btn,
.input-group .form-control {
    display: table-cell
}

.input-group-addon:not(:first-child):not(:last-child),
.input-group-btn:not(:first-child):not(:last-child),
.input-group .form-control:not(:first-child):not(:last-child) {
    border-radius: 0
}

.input-group-addon,
.input-group-btn {
    width: 1%;
    white-space: nowrap;
    vertical-align: middle
}

.input-group-addon {
    padding: 6px 12px;
    font-size: 14px;
    font-weight: 400;
    line-height: 1;
    color: #555555;
    text-align: center;
    background-color: #eeeeee;
    border: 1px solid #ccc;
    border-radius: 4px
}

.input-group-addon.input-sm,
.input-group-sm>.input-group-addon,
.input-group-sm>.input-group-btn>.input-group-addon.btn {
    padding: 5px 10px;
    font-size: 12px;
    border-radius: 3px
}

.input-group-addon.input-lg,
.input-group-lg>.input-group-addon,
.input-group-lg>.input-group-btn>.input-group-addon.btn {
    padding: 10px 16px;
    font-size: 16px;
    border-radius: 6px
}

.input-group-addon input[type="radio"],
.input-group-addon input[type="checkbox"] {
    margin-top: 0
}

.input-group .form-control:first-child,
.input-group-addon:first-child,
.input-group-btn:first-child>.btn,
.input-group-btn:first-child>.btn-group>.btn,
.input-group-btn:first-child>.dropdown-toggle,
.input-group-btn:last-child>.btn:not(:last-child):not(.dropdown-toggle),
.input-group-btn:last-child>.btn-group:not(:last-child)>.btn {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0
}

.input-group-addon:first-child {
    border-right: 0
}

.input-group .form-control:last-child,
.input-group-addon:last-child,
.input-group-btn:last-child>.btn,
.input-group-btn:last-child>.btn-group>.btn,
.input-group-btn:last-child>.dropdown-toggle,
.input-group-btn:first-child>.btn:not(:first-child),
.input-group-btn:first-child>.btn-group:not(:first-child)>.btn {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0
}

.input-group-addon:last-child {
    border-left: 0
}

.input-group-btn {
    position: relative;
    font-size: 0;
    white-space: nowrap
}

.input-group-btn>.btn {
    position: relative
}

.input-group-btn>.btn+.btn {
    margin-left: -1px
}

.input-group-btn>.btn:hover,
.input-group-btn>.btn:focus,
.input-group-btn>.btn:active {
    z-index: 2
}

.input-group-btn:first-child>.btn,
.input-group-btn:first-child>.btn-group {
    margin-right: -1px
}

.input-group-btn:last-child>.btn,
.input-group-btn:last-child>.btn-group {
    z-index: 2;
    margin-left: -1px
}

.nav {
    padding-left: 0;
    margin-bottom: 0;
    list-style: none
}

.nav:before,
.nav:after {
    display: table;
    content: " "
}

.nav:after {
    clear: both
}

.nav>li {
    position: relative;
    display: block
}

.nav>li>a {
    position: relative;
    display: block;
    padding: 10px 15px
}

.nav>li>a:hover,
.nav>li>a:focus {
    text-decoration: none;
    background-color: #eeeeee
}

.nav>li.disabled>a {
    color: #777777
}

.nav>li.disabled>a:hover,
.nav>li.disabled>a:focus {
    color: #777777;
    text-decoration: none;
    cursor: not-allowed;
    background-color: transparent
}

.nav .open>a,
.nav .open>a:hover,
.nav .open>a:focus {
    background-color: #eeeeee;
    border-color: #337ab7
}

.nav .nav-divider {
    height: 1px;
    margin: 9px 0;
    overflow: hidden;
    background-color: #e5e5e5
}

.nav>li>a>img {
    max-width: none
}

.nav-tabs {
    border-bottom: 1px solid #ddd
}

.nav-tabs>li {
    float: left;
    margin-bottom: -1px
}

.nav-tabs>li>a {
    margin-right: 2px;
    line-height: 1.428571429;
    border: 1px solid transparent;
    border-radius: 4px 4px 0 0
}

.nav-tabs>li>a:hover {
    border-color: #eeeeee #eeeeee #ddd
}

.nav-tabs>li.active>a,
.nav-tabs>li.active>a:hover,
.nav-tabs>li.active>a:focus {
    color: #555555;
    cursor: default;
    background-color: #fff;
    border: 1px solid #ddd;
    border-bottom-color: transparent
}

.nav-pills>li {
    float: left
}

.nav-pills>li>a {
    border-radius: 4px
}

.nav-pills>li+li {
    margin-left: 2px
}

.nav-pills>li.active>a,
.nav-pills>li.active>a:hover,
.nav-pills>li.active>a:focus {
    color: #fff;
    background-color: #337ab7
}

.nav-stacked>li {
    float: none
}

.nav-stacked>li+li {
    margin-top: 2px;
    margin-left: 0
}

.nav-justified,
.nav-tabs.nav-justified {
    width: 100%
}

.nav-justified>li,
.nav-tabs.nav-justified>li {
    float: none
}

.nav-justified>li>a,
.nav-tabs.nav-justified>li>a {
    margin-bottom: 5px;
    text-align: center
}

.nav-justified>.dropdown .dropdown-menu {
    top: auto;
    left: auto
}

@media (min-width: 768px) {

    .nav-justified>li,
    .nav-tabs.nav-justified>li {
        display: table-cell;
        width: 1%
    }

    .nav-justified>li>a,
    .nav-tabs.nav-justified>li>a {
        margin-bottom: 0
    }
}

.nav-tabs-justified,
.nav-tabs.nav-justified {
    border-bottom: 0
}

.nav-tabs-justified>li>a,
.nav-tabs.nav-justified>li>a {
    margin-right: 0;
    border-radius: 4px
}

.nav-tabs-justified>.active>a,
.nav-tabs.nav-justified>.active>a,
.nav-tabs-justified>.active>a:hover,
.nav-tabs-justified>.active>a:focus {
    border: 1px solid #ddd
}

@media (min-width: 768px) {

    .nav-tabs-justified>li>a,
    .nav-tabs.nav-justified>li>a {
        border-bottom: 1px solid #ddd;
        border-radius: 4px 4px 0 0
    }

    .nav-tabs-justified>.active>a,
    .nav-tabs.nav-justified>.active>a,
    .nav-tabs-justified>.active>a:hover,
    .nav-tabs-justified>.active>a:focus {
        border-bottom-color: #fff
    }
}

.tab-content>.tab-pane {
    display: none
}

.tab-content>.active {
    display: block
}

.nav-tabs .dropdown-menu {
    margin-top: -1px;
    border-top-left-radius: 0;
    border-top-right-radius: 0
}

.navbar {
    position: relative;
    min-height: 50px;
    margin-bottom: 20px;
    border: 1px solid transparent
}

.navbar:before,
.navbar:after {
    display: table;
    content: " "
}

.navbar:after {
    clear: both
}

@media (min-width: 768px) {
    .navbar {
        border-radius: 4px
    }
}

.navbar-header:before,
.navbar-header:after {
    display: table;
    content: " "
}

.navbar-header:after {
    clear: both
}

@media (min-width: 768px) {
    .navbar-header {
        float: left
    }
}

.navbar-collapse {
    padding-right: 5px;
    padding-left: 5px;
    overflow-x: visible;
    border-top: 1px solid transparent;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    -webkit-overflow-scrolling: touch
}

.navbar-collapse:before,
.navbar-collapse:after {
    display: table;
    content: " "
}

.navbar-collapse:after {
    clear: both
}

.navbar-collapse.in {
    overflow-y: auto
}

@media (min-width: 768px) {
    .navbar-collapse {
        width: auto;
        border-top: 0;
        box-shadow: none
    }

    .navbar-collapse.collapse {
        display: block !important;
        height: auto !important;
        padding-bottom: 0;
        overflow: visible !important
    }

    .navbar-collapse.in {
        overflow-y: visible
    }

    .navbar-fixed-top .navbar-collapse,
    .navbar-static-top .navbar-collapse,
    .navbar-fixed-bottom .navbar-collapse {
        padding-right: 0;
        padding-left: 0
    }
}

.navbar-fixed-top,
.navbar-fixed-bottom {
    position: fixed;
    right: 0;
    left: 0;
    z-index: 1030
}

.navbar-fixed-top .navbar-collapse,
.navbar-fixed-bottom .navbar-collapse {
    max-height: 340px
}

@media (max-device-width: 480px) and (orientation: landscape) {

    .navbar-fixed-top .navbar-collapse,
    .navbar-fixed-bottom .navbar-collapse {
        max-height: 200px
    }
}

@media (min-width: 768px) {

    .navbar-fixed-top,
    .navbar-fixed-bottom {
        border-radius: 0
    }
}

.navbar-fixed-top {
    top: 0;
    border-width: 0 0 1px
}

.navbar-fixed-bottom {
    bottom: 0;
    margin-bottom: 0;
    border-width: 1px 0 0
}

.container>.navbar-header,
.container>.navbar-collapse,
.container-fluid>.navbar-header,
.container-fluid>.navbar-collapse {
    margin-right: -5px;
    margin-left: -5px
}

@media (min-width: 768px) {

    .container>.navbar-header,
    .container>.navbar-collapse,
    .container-fluid>.navbar-header,
    .container-fluid>.navbar-collapse {
        margin-right: 0;
        margin-left: 0
    }
}

.navbar-static-top {
    z-index: 1000;
    border-width: 0 0 1px
}

@media (min-width: 768px) {
    .navbar-static-top {
        border-radius: 0
    }
}

.navbar-brand {
    float: left;
    height: 50px;
    padding: 15px 5px;
    font-size: 16px;
    line-height: 20px
}

.navbar-brand:hover,
.navbar-brand:focus {
    text-decoration: none
}

.navbar-brand>img {
    display: block
}

@media (min-width: 768px) {

    .navbar>.container .navbar-brand,
    .navbar>.container-fluid .navbar-brand {
        margin-left: -5px
    }
}

.navbar-toggle {
    position: relative;
    float: right;
    padding: 9px 10px;
    margin-right: 5px;
    margin-top: 8px;
    margin-bottom: 8px;
    background-color: transparent;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px
}

.navbar-toggle:focus {
    outline: 0
}

.navbar-toggle .icon-bar {
    display: block;
    width: 22px;
    height: 2px;
    border-radius: 1px
}

.navbar-toggle .icon-bar+.icon-bar {
    margin-top: 4px
}

@media (min-width: 768px) {
    .navbar-toggle {
        display: none
    }
}

.navbar-nav {
    margin: 7.5px -5px
}

.navbar-nav>li>a {
    padding-top: 10px;
    padding-bottom: 10px;
    line-height: 20px
}

@media (max-width: 767px) {
    .navbar-nav .open .dropdown-menu {
        position: static;
        float: none;
        width: auto;
        margin-top: 0;
        background-color: transparent;
        border: 0;
        box-shadow: none
    }

    .navbar-nav .open .dropdown-menu>li>a,
    .navbar-nav .open .dropdown-menu .dropdown-header {
        padding: 5px 15px 5px 25px
    }

    .navbar-nav .open .dropdown-menu>li>a {
        line-height: 20px
    }

    .navbar-nav .open .dropdown-menu>li>a:hover,
    .navbar-nav .open .dropdown-menu>li>a:focus {
        background-image: none
    }
}

@media (min-width: 768px) {
    .navbar-nav {
        float: left;
        margin: 0
    }

    .navbar-nav>li {
        float: left
    }

    .navbar-nav>li>a {
        padding-top: 15px;
        padding-bottom: 15px
    }
}

.navbar-form {
    padding: 10px 5px;
    margin-right: -5px;
    margin-left: -5px;
    border-top: 1px solid transparent;
    border-bottom: 1px solid transparent;
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
    margin-top: 8px;
    margin-bottom: 8px
}

@media (min-width: 768px) {
    .navbar-form .form-group {
        display: inline-block;
        margin-bottom: 0;
        vertical-align: middle
    }

    .navbar-form .form-control {
        display: inline-block;
        width: auto;
        vertical-align: middle
    }

    .navbar-form .form-control-static {
        display: inline-block
    }

    .navbar-form .input-group {
        display: inline-table;
        vertical-align: middle
    }

    .navbar-form .input-group .input-group-addon,
    .navbar-form .input-group .input-group-btn,
    .navbar-form .input-group .form-control {
        width: auto
    }

    .navbar-form .input-group>.form-control {
        width: 100%
    }

    .navbar-form .control-label {
        margin-bottom: 0;
        vertical-align: middle
    }

    .navbar-form .radio,
    .navbar-form .checkbox {
        display: inline-block;
        margin-top: 0;
        margin-bottom: 0;
        vertical-align: middle
    }

    .navbar-form .radio label,
    .navbar-form .checkbox label {
        padding-left: 0
    }

    .navbar-form .radio input[type="radio"],
    .navbar-form .checkbox input[type="checkbox"] {
        position: relative;
        margin-left: 0
    }

    .navbar-form .has-feedback .form-control-feedback {
        top: 0
    }
}

@media (max-width: 767px) {
    .navbar-form .form-group {
        margin-bottom: 5px
    }

    .navbar-form .form-group:last-child {
        margin-bottom: 0
    }
}

@media (min-width: 768px) {
    .navbar-form {
        width: auto;
        padding-top: 0;
        padding-bottom: 0;
        margin-right: 0;
        margin-left: 0;
        border: 0;
        -webkit-box-shadow: none;
        box-shadow: none
    }
}

.navbar-nav>li>.dropdown-menu {
    margin-top: 0;
    border-top-left-radius: 0;
    border-top-right-radius: 0
}

.navbar-fixed-bottom .navbar-nav>li>.dropdown-menu {
    margin-bottom: 0;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0
}

.navbar-btn {
    margin-top: 8px;
    margin-bottom: 8px
}

.navbar-btn.btn-sm,
.btn-group-sm>.navbar-btn.btn {
    margin-top: 10px;
    margin-bottom: 10px
}

.navbar-btn.btn-xs,
.btn-group-xs>.navbar-btn.btn {
    margin-top: 14px;
    margin-bottom: 14px
}

.navbar-text {
    margin-top: 15px;
    margin-bottom: 15px
}

@media (min-width: 768px) {
    .navbar-text {
        float: left;
        margin-right: 5px;
        margin-left: 5px
    }
}

@media (min-width: 768px) {
    .navbar-left {
        float: left !important
    }

    .navbar-right {
        float: right !important;
        margin-right: -5px
    }

    .navbar-right~.navbar-right {
        margin-right: 0
    }
}

.navbar-default {
    background-color: #f8f8f8;
    border-color: #e7e7e7
}

.navbar-default .navbar-brand {
    color: #777
}

.navbar-default .navbar-brand:hover,
.navbar-default .navbar-brand:focus {
    color: #5e5e5e;
    background-color: transparent
}

.navbar-default .navbar-text {
    color: #777
}

.navbar-default .navbar-nav>li>a {
    color: #777
}

.navbar-default .navbar-nav>li>a:hover,
.navbar-default .navbar-nav>li>a:focus {
    color: #333;
    background-color: transparent
}

.navbar-default .navbar-nav>.active>a,
.navbar-default .navbar-nav>.active>a:hover,
.navbar-default .navbar-nav>.active>a:focus {
    color: #555;
    background-color: #e7e7e7
}

.navbar-default .navbar-nav>.disabled>a,
.navbar-default .navbar-nav>.disabled>a:hover,
.navbar-default .navbar-nav>.disabled>a:focus {
    color: #ccc;
    background-color: transparent
}

.navbar-default .navbar-nav>.open>a,
.navbar-default .navbar-nav>.open>a:hover,
.navbar-default .navbar-nav>.open>a:focus {
    color: #555;
    background-color: #e7e7e7
}

@media (max-width: 767px) {
    .navbar-default .navbar-nav .open .dropdown-menu>li>a {
        color: #777
    }

    .navbar-default .navbar-nav .open .dropdown-menu>li>a:hover,
    .navbar-default .navbar-nav .open .dropdown-menu>li>a:focus {
        color: #333;
        background-color: transparent
    }

    .navbar-default .navbar-nav .open .dropdown-menu>.active>a,
    .navbar-default .navbar-nav .open .dropdown-menu>.active>a:hover,
    .navbar-default .navbar-nav .open .dropdown-menu>.active>a:focus {
        color: #555;
        background-color: #e7e7e7
    }

    .navbar-default .navbar-nav .open .dropdown-menu>.disabled>a,
    .navbar-default .navbar-nav .open .dropdown-menu>.disabled>a:hover,
    .navbar-default .navbar-nav .open .dropdown-menu>.disabled>a:focus {
        color: #ccc;
        background-color: transparent
    }
}

.navbar-default .navbar-toggle {
    border-color: #ddd
}

.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
    background-color: #ddd
}

.navbar-default .navbar-toggle .icon-bar {
    background-color: #888
}

.navbar-default .navbar-collapse,
.navbar-default .navbar-form {
    border-color: #e7e7e7
}

.navbar-default .navbar-link {
    color: #777
}

.navbar-default .navbar-link:hover {
    color: #333
}

.navbar-default .btn-link {
    color: #777
}

.navbar-default .btn-link:hover,
.navbar-default .btn-link:focus {
    color: #333
}

.navbar-default .btn-link[disabled]:hover,
.navbar-default .btn-link[disabled]:focus,
fieldset[disabled] .navbar-default .btn-link:hover,
fieldset[disabled] .navbar-default .btn-link:focus {
    color: #ccc
}

.navbar-inverse {
    background-color: #222;
    border-color: #090909
}

.navbar-inverse .navbar-brand {
    color: #9d9d9d
}

.navbar-inverse .navbar-brand:hover,
.navbar-inverse .navbar-brand:focus {
    color: #fff;
    background-color: transparent
}

.navbar-inverse .navbar-text {
    color: #9d9d9d
}

.navbar-inverse .navbar-nav>li>a {
    color: #9d9d9d
}

.navbar-inverse .navbar-nav>li>a:hover,
.navbar-inverse .navbar-nav>li>a:focus {
    color: #fff;
    background-color: transparent
}

.navbar-inverse .navbar-nav>.active>a,
.navbar-inverse .navbar-nav>.active>a:hover,
.navbar-inverse .navbar-nav>.active>a:focus {
    color: #fff;
    background-color: #090909
}

.navbar-inverse .navbar-nav>.disabled>a,
.navbar-inverse .navbar-nav>.disabled>a:hover,
.navbar-inverse .navbar-nav>.disabled>a:focus {
    color: #444;
    background-color: transparent
}

.navbar-inverse .navbar-nav>.open>a,
.navbar-inverse .navbar-nav>.open>a:hover,
.navbar-inverse .navbar-nav>.open>a:focus {
    color: #fff;
    background-color: #090909
}

@media (max-width: 767px) {
    .navbar-inverse .navbar-nav .open .dropdown-menu>.dropdown-header {
        border-color: #090909
    }

    .navbar-inverse .navbar-nav .open .dropdown-menu .divider {
        background-color: #090909
    }

    .navbar-inverse .navbar-nav .open .dropdown-menu>li>a {
        color: #9d9d9d
    }

    .navbar-inverse .navbar-nav .open .dropdown-menu>li>a:hover,
    .navbar-inverse .navbar-nav .open .dropdown-menu>li>a:focus {
        color: #fff;
        background-color: transparent
    }

    .navbar-inverse .navbar-nav .open .dropdown-menu>.active>a,
    .navbar-inverse .navbar-nav .open .dropdown-menu>.active>a:hover,
    .navbar-inverse .navbar-nav .open .dropdown-menu>.active>a:focus {
        color: #fff;
        background-color: #090909
    }

    .navbar-inverse .navbar-nav .open .dropdown-menu>.disabled>a,
    .navbar-inverse .navbar-nav .open .dropdown-menu>.disabled>a:hover,
    .navbar-inverse .navbar-nav .open .dropdown-menu>.disabled>a:focus {
        color: #444;
        background-color: transparent
    }
}

.navbar-inverse .navbar-toggle {
    border-color: #333
}

.navbar-inverse .navbar-toggle:hover,
.navbar-inverse .navbar-toggle:focus {
    background-color: #333
}

.navbar-inverse .navbar-toggle .icon-bar {
    background-color: #fff
}

.navbar-inverse .navbar-collapse,
.navbar-inverse .navbar-form {
    border-color: #101010
}

.navbar-inverse .navbar-link {
    color: #9d9d9d
}

.navbar-inverse .navbar-link:hover {
    color: #fff
}

.navbar-inverse .btn-link {
    color: #9d9d9d
}

.navbar-inverse .btn-link:hover,
.navbar-inverse .btn-link:focus {
    color: #fff
}

.navbar-inverse .btn-link[disabled]:hover,
.navbar-inverse .btn-link[disabled]:focus,
fieldset[disabled] .navbar-inverse .btn-link:hover,
fieldset[disabled] .navbar-inverse .btn-link:focus {
    color: #444
}

.breadcrumb {
    padding: 8px 15px;
    margin-bottom: 20px;
    list-style: none;
    background-color: #f5f5f5;
    border-radius: 4px
}

.breadcrumb>li {
    display: inline-block
}

.breadcrumb>li+li:before {
    padding: 0 5px;
    color: #ccc;
    content: "/ "
}

.breadcrumb>.active {
    color: #777777
}

.pagination {
    display: inline-block;
    padding-left: 0;
    margin: 20px 0;
    border-radius: 4px
}

.pagination>li {
    display: inline
}

.pagination>li>a,
.pagination>li>span {
    position: relative;
    float: left;
    padding: 6px 12px;
    margin-left: -1px;
    line-height: 1.428571429;
    color: #337ab7;
    text-decoration: none;
    background-color: #fff;
    border: 1px solid #ddd
}

.pagination>li>a:hover,
.pagination>li>a:focus,
.pagination>li>span:hover,
.pagination>li>span:focus {
    z-index: 2;
    color: #23527c;
    background-color: #eeeeee;
    border-color: #ddd
}

.pagination>li:first-child>a,
.pagination>li:first-child>span {
    margin-left: 0;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px
}

.pagination>li:last-child>a,
.pagination>li:last-child>span {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px
}

.pagination>.active>a,
.pagination>.active>a:hover,
.pagination>.active>a:focus,
.pagination>.active>span,
.pagination>.active>span:hover,
.pagination>.active>span:focus {
    z-index: 3;
    color: #fff;
    cursor: default;
    background-color: #337ab7;
    border-color: #337ab7
}

.pagination>.disabled>span,
.pagination>.disabled>span:hover,
.pagination>.disabled>span:focus,
.pagination>.disabled>a,
.pagination>.disabled>a:hover,
.pagination>.disabled>a:focus {
    color: #777777;
    cursor: not-allowed;
    background-color: #fff;
    border-color: #ddd
}

.pagination-lg>li>a,
.pagination-lg>li>span {
    padding: 10px 16px;
    font-size: 16px;
    line-height: 1.3333333
}

.pagination-lg>li:first-child>a,
.pagination-lg>li:first-child>span {
    border-top-left-radius: 6px;
    border-bottom-left-radius: 6px
}

.pagination-lg>li:last-child>a,
.pagination-lg>li:last-child>span {
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px
}

.pagination-sm>li>a,
.pagination-sm>li>span {
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5
}

.pagination-sm>li:first-child>a,
.pagination-sm>li:first-child>span {
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px
}

.pagination-sm>li:last-child>a,
.pagination-sm>li:last-child>span {
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px
}

.pager {
    padding-left: 0;
    margin: 20px 0;
    text-align: center;
    list-style: none
}

.pager:before,
.pager:after {
    display: table;
    content: " "
}

.pager:after {
    clear: both
}

.pager li {
    display: inline
}

.pager li>a,
.pager li>span {
    display: inline-block;
    padding: 5px 14px;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 15px
}

.pager li>a:hover,
.pager li>a:focus {
    text-decoration: none;
    background-color: #eeeeee
}

.pager .next>a,
.pager .next>span {
    float: right
}

.pager .previous>a,
.pager .previous>span {
    float: left
}

.pager .disabled>a,
.pager .disabled>a:hover,
.pager .disabled>a:focus,
.pager .disabled>span {
    color: #777777;
    cursor: not-allowed;
    background-color: #fff
}

.label {
    display: inline;
    padding: .2em .6em .3em;
    font-size: 75%;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: .25em
}

.label:empty {
    display: none
}

.btn .label {
    position: relative;
    top: -1px
}

a.label:hover,
a.label:focus {
    color: #fff;
    text-decoration: none;
    cursor: pointer
}

.label-default {
    background-color: #777777
}

.label-default[href]:hover,
.label-default[href]:focus {
    background-color: #5e5e5e
}

.label-primary {
    background-color: #337ab7
}

.label-primary[href]:hover,
.label-primary[href]:focus {
    background-color: #286090
}

.label-success {
    background-color: #5cb85c
}

.label-success[href]:hover,
.label-success[href]:focus {
    background-color: #449d44
}

.label-info {
    background-color: #5bc0de
}

.label-info[href]:hover,
.label-info[href]:focus {
    background-color: #31b0d5
}

.label-warning {
    background-color: #f0ad4e
}

.label-warning[href]:hover,
.label-warning[href]:focus {
    background-color: #ec971f
}

.label-danger {
    background-color: #d9534f
}

.label-danger[href]:hover,
.label-danger[href]:focus {
    background-color: #c9302c
}

.badge {
    display: inline-block;
    min-width: 10px;
    padding: 3px 7px;
    font-size: 12px;
    font-weight: bold;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    background-color: #777777;
    border-radius: 10px
}

.badge:empty {
    display: none
}

.btn .badge {
    position: relative;
    top: -1px
}

.btn-xs .badge,
.btn-group-xs>.btn .badge {
    top: 0;
    padding: 1px 5px
}

.list-group-item.active>.badge,
.nav-pills>.active>a>.badge {
    color: #337ab7;
    background-color: #fff
}

.list-group-item>.badge {
    float: right
}

.list-group-item>.badge+.badge {
    margin-right: 5px
}

.nav-pills>li>a>.badge {
    margin-left: 3px
}

a.badge:hover,
a.badge:focus {
    color: #fff;
    text-decoration: none;
    cursor: pointer
}

.jumbotron {
    padding-top: 30px;
    padding-bottom: 30px;
    margin-bottom: 30px;
    color: inherit;
    background-color: #eeeeee
}

.jumbotron h1,
.jumbotron .h1 {
    color: inherit
}

.jumbotron p {
    margin-bottom: 15px;
    font-size: 21px;
    font-weight: 200
}

.jumbotron>hr {
    border-top-color: #d5d5d5
}

.container .jumbotron,
.container-fluid .jumbotron {
    padding-right: 5px;
    padding-left: 5px;
    border-radius: 6px
}

.jumbotron .container {
    max-width: 100%
}

@media screen and (min-width: 768px) {
    .jumbotron {
        padding-top: 48px;
        padding-bottom: 48px
    }

    .container .jumbotron,
    .container-fluid .jumbotron {
        padding-right: 60px;
        padding-left: 60px
    }

    .jumbotron h1,
    .jumbotron .h1 {
        font-size: 63px
    }
}

.thumbnail {
    display: block;
    padding: 4px;
    margin-bottom: 20px;
    line-height: 1.428571429;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 4px;
    -webkit-transition: border 0.2s ease-in-out;
    -o-transition: border 0.2s ease-in-out;
    transition: border 0.2s ease-in-out
}

.thumbnail>img,
.thumbnail a>img {
    display: block;
    max-width: 100%;
    height: auto;
    margin-right: auto;
    margin-left: auto
}

.thumbnail .caption {
    padding: 9px;
    color: #333333
}

a.thumbnail:hover,
a.thumbnail:focus,
a.thumbnail.active {
    border-color: #337ab7
}

.alert {
    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: 4px
}

.alert h4 {
    margin-top: 0;
    color: inherit
}

.alert .alert-link {
    font-weight: bold
}

.alert>p,
.alert>ul {
    margin-bottom: 0
}

.alert>p+p {
    margin-top: 5px
}

.alert-dismissable,
.alert-dismissible {
    padding-right: 35px
}

.alert-dismissable .close,
.alert-dismissible .close {
    position: relative;
    top: -2px;
    right: -21px;
    color: inherit
}

.alert-success {
    color: #3c763d;
    background-color: #dff0d8;
    border-color: #d6e9c6
}

.alert-success hr {
    border-top-color: #c9e2b3
}

.alert-success .alert-link {
    color: #2b542c
}

.alert-info {
    color: #31708f;
    background-color: #d9edf7;
    border-color: #bce8f1
}

.alert-info hr {
    border-top-color: #a6e1ec
}

.alert-info .alert-link {
    color: #245269
}

.alert-warning {
    color: #8a6d3b;
    background-color: #fcf8e3;
    border-color: #faebcc
}

.alert-warning hr {
    border-top-color: #f7e1b5
}

.alert-warning .alert-link {
    color: #66512c
}

.alert-danger {
    color: #a94442;
    background-color: #f2dede;
    border-color: #ebccd1
}

.alert-danger hr {
    border-top-color: #e4b9c0
}

.alert-danger .alert-link {
    color: #843534
}

@-webkit-keyframes progress-bar-stripes {
    from {
        background-position: 40px 0
    }

    to {
        background-position: 0 0
    }
}

@keyframes progress-bar-stripes {
    from {
        background-position: 40px 0
    }

    to {
        background-position: 0 0
    }
}

.progress {
    height: 20px;
    margin-bottom: 20px;
    overflow: hidden;
    background-color: #f5f5f5;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1)
}

.progress-bar {
    float: left;
    width: 0%;
    height: 100%;
    font-size: 12px;
    line-height: 20px;
    color: #fff;
    text-align: center;
    background-color: #337ab7;
    -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
    -webkit-transition: width 0.6s ease;
    -o-transition: width 0.6s ease;
    transition: width 0.6s ease
}

.progress-striped .progress-bar,
.progress-bar-striped {
    background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-size: 40px 40px
}

.progress.active .progress-bar,
.progress-bar.active {
    -webkit-animation: progress-bar-stripes 2s linear infinite;
    -o-animation: progress-bar-stripes 2s linear infinite;
    animation: progress-bar-stripes 2s linear infinite
}

.progress-bar-success {
    background-color: #5cb85c
}

.progress-striped .progress-bar-success {
    background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent)
}

.progress-bar-info {
    background-color: #5bc0de
}

.progress-striped .progress-bar-info {
    background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent)
}

.progress-bar-warning {
    background-color: #f0ad4e
}

.progress-striped .progress-bar-warning {
    background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent)
}

.progress-bar-danger {
    background-color: #d9534f
}

.progress-striped .progress-bar-danger {
    background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent)
}

.media {
    margin-top: 15px
}

.media:first-child {
    margin-top: 0
}

.media,
.media-body {
    overflow: hidden;
    zoom: 1
}

.media-body {
    width: 10000px
}

.media-object {
    display: block
}

.media-object.img-thumbnail {
    max-width: none
}

.media-right,
.media>.pull-right {
    padding-left: 10px
}

.media-left,
.media>.pull-left {
    padding-right: 10px
}

.media-left,
.media-right,
.media-body {
    display: table-cell;
    vertical-align: top
}

.media-middle {
    vertical-align: middle
}

.media-bottom {
    vertical-align: bottom
}

.media-heading {
    margin-top: 0;
    margin-bottom: 5px
}

.media-list {
    padding-left: 0;
    list-style: none
}

.list-group {
    padding-left: 0;
    margin-bottom: 20px
}

.list-group-item {
    position: relative;
    display: block;
    padding: 10px 15px;
    margin-bottom: -1px;
    background-color: #fff;
    border: 1px solid #ddd
}

.list-group-item:first-child {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px
}

.list-group-item:last-child {
    margin-bottom: 0;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px
}

.list-group-item.disabled,
.list-group-item.disabled:hover,
.list-group-item.disabled:focus {
    color: #777777;
    cursor: not-allowed;
    background-color: #eeeeee
}

.list-group-item.disabled .list-group-item-heading,
.list-group-item.disabled:hover .list-group-item-heading,
.list-group-item.disabled:focus .list-group-item-heading {
    color: inherit
}

.list-group-item.disabled .list-group-item-text,
.list-group-item.disabled:hover .list-group-item-text,
.list-group-item.disabled:focus .list-group-item-text {
    color: #777777
}

.list-group-item.active,
.list-group-item.active:hover,
.list-group-item.active:focus {
    z-index: 2;
    color: #fff;
    background-color: #337ab7;
    border-color: #337ab7
}

.list-group-item.active .list-group-item-heading,
.list-group-item.active .list-group-item-heading>small,
.list-group-item.active .list-group-item-heading>.small,
.list-group-item.active:hover .list-group-item-heading,
.list-group-item.active:hover .list-group-item-heading>small,
.list-group-item.active:hover .list-group-item-heading>.small,
.list-group-item.active:focus .list-group-item-heading,
.list-group-item.active:focus .list-group-item-heading>small,
.list-group-item.active:focus .list-group-item-heading>.small {
    color: inherit
}

.list-group-item.active .list-group-item-text,
.list-group-item.active:hover .list-group-item-text,
.list-group-item.active:focus .list-group-item-text {
    color: #c7ddef
}

a.list-group-item,
button.list-group-item {
    color: #555
}

a.list-group-item .list-group-item-heading,
button.list-group-item .list-group-item-heading {
    color: #333
}

a.list-group-item:hover,
a.list-group-item:focus,
button.list-group-item:hover,
button.list-group-item:focus {
    color: #555;
    text-decoration: none;
    background-color: #f5f5f5
}

button.list-group-item {
    width: 100%;
    text-align: left
}

.list-group-item-success {
    color: #3c763d;
    background-color: #dff0d8
}

a.list-group-item-success,
button.list-group-item-success {
    color: #3c763d
}

a.list-group-item-success .list-group-item-heading,
button.list-group-item-success .list-group-item-heading {
    color: inherit
}

a.list-group-item-success:hover,
a.list-group-item-success:focus,
button.list-group-item-success:hover,
button.list-group-item-success:focus {
    color: #3c763d;
    background-color: #d0e9c6
}

a.list-group-item-success.active,
a.list-group-item-success.active:hover,
a.list-group-item-success.active:focus,
button.list-group-item-success.active,
button.list-group-item-success.active:hover,
button.list-group-item-success.active:focus {
    color: #fff;
    background-color: #3c763d;
    border-color: #3c763d
}

.list-group-item-info {
    color: #31708f;
    background-color: #d9edf7
}

a.list-group-item-info,
button.list-group-item-info {
    color: #31708f
}

a.list-group-item-info .list-group-item-heading,
button.list-group-item-info .list-group-item-heading {
    color: inherit
}

a.list-group-item-info:hover,
a.list-group-item-info:focus,
button.list-group-item-info:hover,
button.list-group-item-info:focus {
    color: #31708f;
    background-color: #c4e3f3
}

a.list-group-item-info.active,
a.list-group-item-info.active:hover,
a.list-group-item-info.active:focus,
button.list-group-item-info.active,
button.list-group-item-info.active:hover,
button.list-group-item-info.active:focus {
    color: #fff;
    background-color: #31708f;
    border-color: #31708f
}

.list-group-item-warning {
    color: #8a6d3b;
    background-color: #fcf8e3
}

a.list-group-item-warning,
button.list-group-item-warning {
    color: #8a6d3b
}

a.list-group-item-warning .list-group-item-heading,
button.list-group-item-warning .list-group-item-heading {
    color: inherit
}

a.list-group-item-warning:hover,
a.list-group-item-warning:focus,
button.list-group-item-warning:hover,
button.list-group-item-warning:focus {
    color: #8a6d3b;
    background-color: #faf2cc
}

a.list-group-item-warning.active,
a.list-group-item-warning.active:hover,
a.list-group-item-warning.active:focus,
button.list-group-item-warning.active,
button.list-group-item-warning.active:hover,
button.list-group-item-warning.active:focus {
    color: #fff;
    background-color: #8a6d3b;
    border-color: #8a6d3b
}

.list-group-item-danger {
    color: #a94442;
    background-color: #f2dede
}

a.list-group-item-danger,
button.list-group-item-danger {
    color: #a94442
}

a.list-group-item-danger .list-group-item-heading,
button.list-group-item-danger .list-group-item-heading {
    color: inherit
}

a.list-group-item-danger:hover,
a.list-group-item-danger:focus,
button.list-group-item-danger:hover,
button.list-group-item-danger:focus {
    color: #a94442;
    background-color: #ebcccc
}

a.list-group-item-danger.active,
a.list-group-item-danger.active:hover,
a.list-group-item-danger.active:focus,
button.list-group-item-danger.active,
button.list-group-item-danger.active:hover,
button.list-group-item-danger.active:focus {
    color: #fff;
    background-color: #a94442;
    border-color: #a94442
}

.list-group-item-heading {
    margin-top: 0;
    margin-bottom: 5px
}

.list-group-item-text {
    margin-bottom: 0;
    line-height: 1.3
}

.panel {
    margin-bottom: 20px;
    background-color: #fff;
    border: 1px solid transparent;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05)
}

.panel-body {
    padding: 15px
}

.panel-body:before,
.panel-body:after {
    display: table;
    content: " "
}

.panel-body:after {
    clear: both
}

.panel-heading {
    padding: 10px 15px;
    border-bottom: 1px solid transparent;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px
}

.panel-heading>.dropdown .dropdown-toggle {
    color: inherit
}

.panel-title {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 16px;
    color: inherit
}

.panel-title>a,
.panel-title>small,
.panel-title>.small,
.panel-title>small>a,
.panel-title>.small>a {
    color: inherit
}

.panel-footer {
    padding: 10px 15px;
    background-color: #f5f5f5;
    border-top: 1px solid #ddd;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px
}

.panel>.list-group,
.panel>.panel-collapse>.list-group {
    margin-bottom: 0
}

.panel>.list-group .list-group-item,
.panel>.panel-collapse>.list-group .list-group-item {
    border-width: 1px 0;
    border-radius: 0
}

.panel>.list-group:first-child .list-group-item:first-child,
.panel>.panel-collapse>.list-group:first-child .list-group-item:first-child {
    border-top: 0;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px
}

.panel>.list-group:last-child .list-group-item:last-child,
.panel>.panel-collapse>.list-group:last-child .list-group-item:last-child {
    border-bottom: 0;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px
}

.panel>.panel-heading+.panel-collapse>.list-group .list-group-item:first-child {
    border-top-left-radius: 0;
    border-top-right-radius: 0
}

.panel-heading+.list-group .list-group-item:first-child {
    border-top-width: 0
}

.list-group+.panel-footer {
    border-top-width: 0
}

.panel>.table,
.panel>.table-responsive>.table,
.panel>.panel-collapse>.table {
    margin-bottom: 0
}

.panel>.table caption,
.panel>.table-responsive>.table caption,
.panel>.panel-collapse>.table caption {
    padding-right: 15px;
    padding-left: 15px
}

.panel>.table:first-child,
.panel>.table-responsive:first-child>.table:first-child {
    border-top-left-radius: 3px;
    border-top-right-radius: 3px
}

.panel>.table:first-child>thead:first-child>tr:first-child,
.panel>.table:first-child>tbody:first-child>tr:first-child,
.panel>.table-responsive:first-child>.table:first-child>thead:first-child>tr:first-child,
.panel>.table-responsive:first-child>.table:first-child>tbody:first-child>tr:first-child {
    border-top-left-radius: 3px;
    border-top-right-radius: 3px
}

.panel>.table:first-child>thead:first-child>tr:first-child td:first-child,
.panel>.table:first-child>thead:first-child>tr:first-child th:first-child,
.panel>.table:first-child>tbody:first-child>tr:first-child td:first-child,
.panel>.table:first-child>tbody:first-child>tr:first-child th:first-child,
.panel>.table-responsive:first-child>.table:first-child>thead:first-child>tr:first-child td:first-child,
.panel>.table-responsive:first-child>.table:first-child>thead:first-child>tr:first-child th:first-child,
.panel>.table-responsive:first-child>.table:first-child>tbody:first-child>tr:first-child td:first-child,
.panel>.table-responsive:first-child>.table:first-child>tbody:first-child>tr:first-child th:first-child {
    border-top-left-radius: 3px
}

.panel>.table:first-child>thead:first-child>tr:first-child td:last-child,
.panel>.table:first-child>thead:first-child>tr:first-child th:last-child,
.panel>.table:first-child>tbody:first-child>tr:first-child td:last-child,
.panel>.table:first-child>tbody:first-child>tr:first-child th:last-child,
.panel>.table-responsive:first-child>.table:first-child>thead:first-child>tr:first-child td:last-child,
.panel>.table-responsive:first-child>.table:first-child>thead:first-child>tr:first-child th:last-child,
.panel>.table-responsive:first-child>.table:first-child>tbody:first-child>tr:first-child td:last-child,
.panel>.table-responsive:first-child>.table:first-child>tbody:first-child>tr:first-child th:last-child {
    border-top-right-radius: 3px
}

.panel>.table:last-child,
.panel>.table-responsive:last-child>.table:last-child {
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px
}

.panel>.table:last-child>tbody:last-child>tr:last-child,
.panel>.table:last-child>tfoot:last-child>tr:last-child,
.panel>.table-responsive:last-child>.table:last-child>tbody:last-child>tr:last-child,
.panel>.table-responsive:last-child>.table:last-child>tfoot:last-child>tr:last-child {
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px
}

.panel>.table:last-child>tbody:last-child>tr:last-child td:first-child,
.panel>.table:last-child>tbody:last-child>tr:last-child th:first-child,
.panel>.table:last-child>tfoot:last-child>tr:last-child td:first-child,
.panel>.table:last-child>tfoot:last-child>tr:last-child th:first-child,
.panel>.table-responsive:last-child>.table:last-child>tbody:last-child>tr:last-child td:first-child,
.panel>.table-responsive:last-child>.table:last-child>tbody:last-child>tr:last-child th:first-child,
.panel>.table-responsive:last-child>.table:last-child>tfoot:last-child>tr:last-child td:first-child,
.panel>.table-responsive:last-child>.table:last-child>tfoot:last-child>tr:last-child th:first-child {
    border-bottom-left-radius: 3px
}

.panel>.table:last-child>tbody:last-child>tr:last-child td:last-child,
.panel>.table:last-child>tbody:last-child>tr:last-child th:last-child,
.panel>.table:last-child>tfoot:last-child>tr:last-child td:last-child,
.panel>.table:last-child>tfoot:last-child>tr:last-child th:last-child,
.panel>.table-responsive:last-child>.table:last-child>tbody:last-child>tr:last-child td:last-child,
.panel>.table-responsive:last-child>.table:last-child>tbody:last-child>tr:last-child th:last-child,
.panel>.table-responsive:last-child>.table:last-child>tfoot:last-child>tr:last-child td:last-child,
.panel>.table-responsive:last-child>.table:last-child>tfoot:last-child>tr:last-child th:last-child {
    border-bottom-right-radius: 3px
}

.panel>.panel-body+.table,
.panel>.panel-body+.table-responsive,
.panel>.table+.panel-body,
.panel>.table-responsive+.panel-body {
    border-top: 1px solid #ddd
}

.panel>.table>tbody:first-child>tr:first-child th,
.panel>.table>tbody:first-child>tr:first-child td {
    border-top: 0
}

.panel>.table-bordered,
.panel>.table-responsive>.table-bordered {
    border: 0
}

.panel>.table-bordered>thead>tr>th:first-child,
.panel>.table-bordered>thead>tr>td:first-child,
.panel>.table-bordered>tbody>tr>th:first-child,
.panel>.table-bordered>tbody>tr>td:first-child,
.panel>.table-bordered>tfoot>tr>th:first-child,
.panel>.table-bordered>tfoot>tr>td:first-child,
.panel>.table-responsive>.table-bordered>thead>tr>th:first-child,
.panel>.table-responsive>.table-bordered>thead>tr>td:first-child,
.panel>.table-responsive>.table-bordered>tbody>tr>th:first-child,
.panel>.table-responsive>.table-bordered>tbody>tr>td:first-child,
.panel>.table-responsive>.table-bordered>tfoot>tr>th:first-child,
.panel>.table-responsive>.table-bordered>tfoot>tr>td:first-child {
    border-left: 0
}

.panel>.table-bordered>thead>tr>th:last-child,
.panel>.table-bordered>thead>tr>td:last-child,
.panel>.table-bordered>tbody>tr>th:last-child,
.panel>.table-bordered>tbody>tr>td:last-child,
.panel>.table-bordered>tfoot>tr>th:last-child,
.panel>.table-bordered>tfoot>tr>td:last-child,
.panel>.table-responsive>.table-bordered>thead>tr>th:last-child,
.panel>.table-responsive>.table-bordered>thead>tr>td:last-child,
.panel>.table-responsive>.table-bordered>tbody>tr>th:last-child,
.panel>.table-responsive>.table-bordered>tbody>tr>td:last-child,
.panel>.table-responsive>.table-bordered>tfoot>tr>th:last-child,
.panel>.table-responsive>.table-bordered>tfoot>tr>td:last-child {
    border-right: 0
}

.panel>.table-bordered>thead>tr:first-child>td,
.panel>.table-bordered>thead>tr:first-child>th,
.panel>.table-bordered>tbody>tr:first-child>td,
.panel>.table-bordered>tbody>tr:first-child>th,
.panel>.table-responsive>.table-bordered>thead>tr:first-child>td,
.panel>.table-responsive>.table-bordered>thead>tr:first-child>th,
.panel>.table-responsive>.table-bordered>tbody>tr:first-child>td,
.panel>.table-responsive>.table-bordered>tbody>tr:first-child>th {
    border-bottom: 0
}

.panel>.table-bordered>tbody>tr:last-child>td,
.panel>.table-bordered>tbody>tr:last-child>th,
.panel>.table-bordered>tfoot>tr:last-child>td,
.panel>.table-bordered>tfoot>tr:last-child>th,
.panel>.table-responsive>.table-bordered>tbody>tr:last-child>td,
.panel>.table-responsive>.table-bordered>tbody>tr:last-child>th,
.panel>.table-responsive>.table-bordered>tfoot>tr:last-child>td,
.panel>.table-responsive>.table-bordered>tfoot>tr:last-child>th {
    border-bottom: 0
}

.panel>.table-responsive {
    margin-bottom: 0;
    border: 0
}

.panel-group {
    margin-bottom: 20px
}

.panel-group .panel {
    margin-bottom: 0;
    border-radius: 4px
}

.panel-group .panel+.panel {
    margin-top: 5px
}

.panel-group .panel-heading {
    border-bottom: 0
}

.panel-group .panel-heading+.panel-collapse>.panel-body,
.panel-group .panel-heading+.panel-collapse>.list-group {
    border-top: 1px solid #ddd
}

.panel-group .panel-footer {
    border-top: 0
}

.panel-group .panel-footer+.panel-collapse .panel-body {
    border-bottom: 1px solid #ddd
}

.panel-default {
    border-color: #ddd
}

.panel-default>.panel-heading {
    color: #333333;
    background-color: #f5f5f5;
    border-color: #ddd
}

.panel-default>.panel-heading+.panel-collapse>.panel-body {
    border-top-color: #ddd
}

.panel-default>.panel-heading .badge {
    color: #f5f5f5;
    background-color: #333333
}

.panel-default>.panel-footer+.panel-collapse>.panel-body {
    border-bottom-color: #ddd
}

.panel-primary {
    border-color: #337ab7
}

.panel-primary>.panel-heading {
    color: #fff;
    background-color: #337ab7;
    border-color: #337ab7
}

.panel-primary>.panel-heading+.panel-collapse>.panel-body {
    border-top-color: #337ab7
}

.panel-primary>.panel-heading .badge {
    color: #337ab7;
    background-color: #fff
}

.panel-primary>.panel-footer+.panel-collapse>.panel-body {
    border-bottom-color: #337ab7
}

.panel-success {
    border-color: #d6e9c6
}

.panel-success>.panel-heading {
    color: #3c763d;
    background-color: #dff0d8;
    border-color: #d6e9c6
}

.panel-success>.panel-heading+.panel-collapse>.panel-body {
    border-top-color: #d6e9c6
}

.panel-success>.panel-heading .badge {
    color: #dff0d8;
    background-color: #3c763d
}

.panel-success>.panel-footer+.panel-collapse>.panel-body {
    border-bottom-color: #d6e9c6
}

.panel-info {
    border-color: #bce8f1
}

.panel-info>.panel-heading {
    color: #31708f;
    background-color: #d9edf7;
    border-color: #bce8f1
}

.panel-info>.panel-heading+.panel-collapse>.panel-body {
    border-top-color: #bce8f1
}

.panel-info>.panel-heading .badge {
    color: #d9edf7;
    background-color: #31708f
}

.panel-info>.panel-footer+.panel-collapse>.panel-body {
    border-bottom-color: #bce8f1
}

.panel-warning {
    border-color: #faebcc
}

.panel-warning>.panel-heading {
    color: #8a6d3b;
    background-color: #fcf8e3;
    border-color: #faebcc
}

.panel-warning>.panel-heading+.panel-collapse>.panel-body {
    border-top-color: #faebcc
}

.panel-warning>.panel-heading .badge {
    color: #fcf8e3;
    background-color: #8a6d3b
}

.panel-warning>.panel-footer+.panel-collapse>.panel-body {
    border-bottom-color: #faebcc
}

.panel-danger {
    border-color: #ebccd1
}

.panel-danger>.panel-heading {
    color: #a94442;
    background-color: #f2dede;
    border-color: #ebccd1
}

.panel-danger>.panel-heading+.panel-collapse>.panel-body {
    border-top-color: #ebccd1
}

.panel-danger>.panel-heading .badge {
    color: #f2dede;
    background-color: #a94442
}

.panel-danger>.panel-footer+.panel-collapse>.panel-body {
    border-bottom-color: #ebccd1
}

.embed-responsive {
    position: relative;
    display: block;
    height: 0;
    padding: 0;
    overflow: hidden
}

.embed-responsive .embed-responsive-item,
.embed-responsive iframe,
.embed-responsive embed,
.embed-responsive object,
.embed-responsive video {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0
}

.embed-responsive-16by9 {
    padding-bottom: 56.25%
}

.embed-responsive-4by3 {
    padding-bottom: 75%
}

.well {
    min-height: 20px;
    padding: 19px;
    margin-bottom: 20px;
    background-color: #f5f5f5;
    border: 1px solid #e3e3e3;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05)
}

.well blockquote {
    border-color: #ddd;
    border-color: rgba(0, 0, 0, 0.15)
}

.well-lg {
    padding: 24px;
    border-radius: 6px
}

.well-sm {
    padding: 9px;
    border-radius: 3px
}

.close {
    float: right;
    font-size: 21px;
    font-weight: bold;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    filter: alpha(opacity=20);
    opacity: 0.2
}

.close:hover,
.close:focus {
    color: #000;
    text-decoration: none;
    cursor: pointer;
    filter: alpha(opacity=50);
    opacity: 0.5
}

button.close {
    padding: 0;
    cursor: pointer;
    background: transparent;
    border: 0;
    -webkit-appearance: none;
    appearance: none
}

.modal-open {
    overflow: hidden
}

.modal {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1050;
    display: none;
    overflow: hidden;
    -webkit-overflow-scrolling: touch;
    outline: 0
}

.modal.fade .modal-dialog {
    -webkit-transform: translate(0, -25%);
    -ms-transform: translate(0, -25%);
    -o-transform: translate(0, -25%);
    transform: translate(0, -25%);
    -webkit-transition: -webkit-transform 0.3s ease-out;
    -moz-transition: -moz-transform 0.3s ease-out;
    -o-transition: -o-transform 0.3s ease-out;
    transition: transform 0.3s ease-out
}

.modal.in .modal-dialog {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0)
}

.modal-open .modal {
    overflow-x: hidden;
    overflow-y: auto
}

.modal-dialog {
    position: relative;
    width: auto;
    margin: 10px
}

.modal-content {
    position: relative;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #999;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 6px;
    -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
    box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
    outline: 0
}

.modal-backdrop {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1040;
    background-color: #000
}

.modal-backdrop.fade {
    filter: alpha(opacity=0);
    opacity: 0
}

.modal-backdrop.in {
    filter: alpha(opacity=50);
    opacity: 0.5
}

.modal-header {
    padding: 15px;
    border-bottom: 1px solid #e5e5e5
}

.modal-header:before,
.modal-header:after {
    display: table;
    content: " "
}

.modal-header:after {
    clear: both
}

.modal-header .close {
    margin-top: -2px
}

.modal-title {
    margin: 0;
    line-height: 1.428571429
}

.modal-body {
    position: relative;
    padding: 15px
}

.modal-footer {
    padding: 15px;
    text-align: right;
    border-top: 1px solid #e5e5e5
}

.modal-footer:before,
.modal-footer:after {
    display: table;
    content: " "
}

.modal-footer:after {
    clear: both
}

.modal-footer .btn+.btn {
    margin-bottom: 0;
    margin-left: 5px
}

.modal-footer .btn-group .btn+.btn {
    margin-left: -1px
}

.modal-footer .btn-block+.btn-block {
    margin-left: 0
}

.modal-scrollbar-measure {
    position: absolute;
    top: -9999px;
    width: 50px;
    height: 50px;
    overflow: scroll
}

@media (min-width: 768px) {
    .modal-dialog {
        width: 600px;
        margin: 30px auto
    }

    .modal-content {
        -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
        box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5)
    }

    .modal-sm {
        width: 300px
    }
}

@media (min-width: 992px) {
    .modal-lg {
        width: 900px
    }
}

.tooltip {
    position: absolute;
    z-index: 1070;
    display: block;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-style: normal;
    font-weight: 400;
    line-height: 1.428571429;
    line-break: auto;
    text-align: left;
    text-align: start;
    text-decoration: none;
    text-shadow: none;
    text-transform: none;
    letter-spacing: normal;
    word-break: normal;
    word-spacing: normal;
    word-wrap: normal;
    white-space: normal;
    font-size: 12px;
    filter: alpha(opacity=0);
    opacity: 0
}

.tooltip.in {
    filter: alpha(opacity=90);
    opacity: 0.9
}

.tooltip.top {
    padding: 5px 0;
    margin-top: -3px
}

.tooltip.right {
    padding: 0 5px;
    margin-left: 3px
}

.tooltip.bottom {
    padding: 5px 0;
    margin-top: 3px
}

.tooltip.left {
    padding: 0 5px;
    margin-left: -3px
}

.tooltip.top .tooltip-arrow {
    bottom: 0;
    left: 50%;
    margin-left: -5px;
    border-width: 5px 5px 0;
    border-top-color: #000
}

.tooltip.top-left .tooltip-arrow {
    right: 5px;
    bottom: 0;
    margin-bottom: -5px;
    border-width: 5px 5px 0;
    border-top-color: #000
}

.tooltip.top-right .tooltip-arrow {
    bottom: 0;
    left: 5px;
    margin-bottom: -5px;
    border-width: 5px 5px 0;
    border-top-color: #000
}

.tooltip.right .tooltip-arrow {
    top: 50%;
    left: 0;
    margin-top: -5px;
    border-width: 5px 5px 5px 0;
    border-right-color: #000
}

.tooltip.left .tooltip-arrow {
    top: 50%;
    right: 0;
    margin-top: -5px;
    border-width: 5px 0 5px 5px;
    border-left-color: #000
}

.tooltip.bottom .tooltip-arrow {
    top: 0;
    left: 50%;
    margin-left: -5px;
    border-width: 0 5px 5px;
    border-bottom-color: #000
}

.tooltip.bottom-left .tooltip-arrow {
    top: 0;
    right: 5px;
    margin-top: -5px;
    border-width: 0 5px 5px;
    border-bottom-color: #000
}

.tooltip.bottom-right .tooltip-arrow {
    top: 0;
    left: 5px;
    margin-top: -5px;
    border-width: 0 5px 5px;
    border-bottom-color: #000
}

.tooltip-inner {
    max-width: 200px;
    padding: 3px 8px;
    color: #fff;
    text-align: center;
    background-color: #000;
    border-radius: 4px
}

.tooltip-arrow {
    position: absolute;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid
}

.popover {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1060;
    display: none;
    max-width: 276px;
    padding: 1px;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-style: normal;
    font-weight: 400;
    line-height: 1.428571429;
    line-break: auto;
    text-align: left;
    text-align: start;
    text-decoration: none;
    text-shadow: none;
    text-transform: none;
    letter-spacing: normal;
    word-break: normal;
    word-spacing: normal;
    word-wrap: normal;
    white-space: normal;
    font-size: 14px;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ccc;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 6px;
    -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2)
}

.popover.top {
    margin-top: -10px
}

.popover.right {
    margin-left: 10px
}

.popover.bottom {
    margin-top: 10px
}

.popover.left {
    margin-left: -10px
}

.popover>.arrow {
    border-width: 11px
}

.popover>.arrow,
.popover>.arrow:after {
    position: absolute;
    display: block;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid
}

.popover>.arrow:after {
    content: "";
    border-width: 10px
}

.popover.top>.arrow {
    bottom: -11px;
    left: 50%;
    margin-left: -11px;
    border-top-color: #999999;
    border-top-color: rgba(0, 0, 0, 0.25);
    border-bottom-width: 0
}

.popover.top>.arrow:after {
    bottom: 1px;
    margin-left: -10px;
    content: " ";
    border-top-color: #fff;
    border-bottom-width: 0
}

.popover.right>.arrow {
    top: 50%;
    left: -11px;
    margin-top: -11px;
    border-right-color: #999999;
    border-right-color: rgba(0, 0, 0, 0.25);
    border-left-width: 0
}

.popover.right>.arrow:after {
    bottom: -10px;
    left: 1px;
    content: " ";
    border-right-color: #fff;
    border-left-width: 0
}

.popover.bottom>.arrow {
    top: -11px;
    left: 50%;
    margin-left: -11px;
    border-top-width: 0;
    border-bottom-color: #999999;
    border-bottom-color: rgba(0, 0, 0, 0.25)
}

.popover.bottom>.arrow:after {
    top: 1px;
    margin-left: -10px;
    content: " ";
    border-top-width: 0;
    border-bottom-color: #fff
}

.popover.left>.arrow {
    top: 50%;
    right: -11px;
    margin-top: -11px;
    border-right-width: 0;
    border-left-color: #999999;
    border-left-color: rgba(0, 0, 0, 0.25)
}

.popover.left>.arrow:after {
    right: 1px;
    bottom: -10px;
    content: " ";
    border-right-width: 0;
    border-left-color: #fff
}

.popover-title {
    padding: 8px 14px;
    margin: 0;
    font-size: 14px;
    background-color: #f7f7f7;
    border-bottom: 1px solid #ebebeb;
    border-radius: 5px 5px 0 0
}

.popover-content {
    padding: 9px 14px
}

.carousel {
    position: relative
}

.carousel-inner {
    position: relative;
    width: 100%;
    overflow: hidden
}

.carousel-inner>.item {
    position: relative;
    display: none;
    -webkit-transition: 0.6s ease-in-out left;
    -o-transition: 0.6s ease-in-out left;
    transition: 0.6s ease-in-out left
}

.carousel-inner>.item>img,
.carousel-inner>.item>a>img {
    display: block;
    max-width: 100%;
    height: auto;
    line-height: 1
}

@media all and (transform-3d),
(-webkit-transform-3d) {
    .carousel-inner>.item {
        -webkit-transition: -webkit-transform 0.6s ease-in-out;
        -moz-transition: -moz-transform 0.6s ease-in-out;
        -o-transition: -o-transform 0.6s ease-in-out;
        transition: transform 0.6s ease-in-out;
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-perspective: 1000px;
        -moz-perspective: 1000px;
        perspective: 1000px
    }

    .carousel-inner>.item.next,
    .carousel-inner>.item.active.right {
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
        left: 0
    }

    .carousel-inner>.item.prev,
    .carousel-inner>.item.active.left {
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
        left: 0
    }

    .carousel-inner>.item.next.left,
    .carousel-inner>.item.prev.right,
    .carousel-inner>.item.active {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        left: 0
    }
}

.carousel-inner>.active,
.carousel-inner>.next,
.carousel-inner>.prev {
    display: block
}

.carousel-inner>.active {
    left: 0
}

.carousel-inner>.next,
.carousel-inner>.prev {
    position: absolute;
    top: 0;
    width: 100%
}

.carousel-inner>.next {
    left: 100%
}

.carousel-inner>.prev {
    left: -100%
}

.carousel-inner>.next.left,
.carousel-inner>.prev.right {
    left: 0
}

.carousel-inner>.active.left {
    left: -100%
}

.carousel-inner>.active.right {
    left: 100%
}

.carousel-control {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 15%;
    font-size: 20px;
    color: #fff;
    text-align: center;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
    background-color: rgba(0, 0, 0, 0);
    filter: alpha(opacity=50);
    opacity: 0.5
}

.carousel-control.left {
    background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.0001) 100%);
    background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.0001) 100%);
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.0001) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#00000000', GradientType=1);
    background-repeat: repeat-x
}

.carousel-control.right {
    right: 0;
    left: auto;
    background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.0001) 0%, rgba(0, 0, 0, 0.5) 100%);
    background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.0001) 0%, rgba(0, 0, 0, 0.5) 100%);
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0.0001) 0%, rgba(0, 0, 0, 0.5) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#80000000', GradientType=1);
    background-repeat: repeat-x
}

.carousel-control:hover,
.carousel-control:focus {
    color: #fff;
    text-decoration: none;
    outline: 0;
    filter: alpha(opacity=90);
    opacity: 0.9
}

.carousel-control .icon-prev,
.carousel-control .icon-next,
.carousel-control .glyphicon-chevron-left,
.carousel-control .glyphicon-chevron-right {
    position: absolute;
    top: 50%;
    z-index: 5;
    display: inline-block;
    margin-top: -10px
}

.carousel-control .icon-prev,
.carousel-control .glyphicon-chevron-left {
    left: 50%;
    margin-left: -10px
}

.carousel-control .icon-next,
.carousel-control .glyphicon-chevron-right {
    right: 50%;
    margin-right: -10px
}

.carousel-control .icon-prev,
.carousel-control .icon-next {
    width: 20px;
    height: 20px;
    font-family: serif;
    line-height: 1
}

.carousel-control .icon-prev:before {
    content: "\2039"
}

.carousel-control .icon-next:before {
    content: "\203a"
}

.carousel-indicators {
    position: absolute;
    bottom: 10px;
    left: 50%;
    z-index: 15;
    width: 60%;
    padding-left: 0;
    margin-left: -30%;
    text-align: center;
    list-style: none
}

.carousel-indicators li {
    display: inline-block;
    width: 10px;
    height: 10px;
    margin: 1px;
    text-indent: -999px;
    cursor: pointer;
    background-color: #000 \9;
    background-color: rgba(0, 0, 0, 0);
    border: 1px solid #fff;
    border-radius: 10px
}

.carousel-indicators .active {
    width: 12px;
    height: 12px;
    margin: 0;
    background-color: #fff
}

.carousel-caption {
    position: absolute;
    right: 15%;
    bottom: 20px;
    left: 15%;
    z-index: 10;
    padding-top: 20px;
    padding-bottom: 20px;
    color: #fff;
    text-align: center;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6)
}

.carousel-caption .btn {
    text-shadow: none
}

@media screen and (min-width: 768px) {

    .carousel-control .glyphicon-chevron-left,
    .carousel-control .glyphicon-chevron-right,
    .carousel-control .icon-prev,
    .carousel-control .icon-next {
        width: 30px;
        height: 30px;
        margin-top: -10px;
        font-size: 30px
    }

    .carousel-control .glyphicon-chevron-left,
    .carousel-control .icon-prev {
        margin-left: -10px
    }

    .carousel-control .glyphicon-chevron-right,
    .carousel-control .icon-next {
        margin-right: -10px
    }

    .carousel-caption {
        right: 20%;
        left: 20%;
        padding-bottom: 30px
    }

    .carousel-indicators {
        bottom: 20px
    }
}

.clearfix:before,
.clearfix:after {
    display: table;
    content: " "
}

.clearfix:after {
    clear: both
}

.center-block {
    display: block;
    margin-right: auto;
    margin-left: auto
}

.pull-right {
    float: right !important
}

.pull-left {
    float: left !important
}

.hide {
    display: none !important
}

.show {
    display: block !important
}

.invisible {
    visibility: hidden
}

.text-hide {
    font: 0/0 a;
    color: transparent;
    text-shadow: none;
    background-color: transparent;
    border: 0
}

.hidden {
    display: none !important
}

.affix {
    position: fixed
}

@-ms-viewport {
    width: device-width
}

.visible-xs {
    display: none !important
}

.visible-sm {
    display: none !important
}

.visible-md {
    display: none !important
}

.visible-lg {
    display: none !important
}

.visible-xs-block,
.visible-xs-inline,
.visible-xs-inline-block,
.visible-sm-block,
.visible-sm-inline,
.visible-sm-inline-block,
.visible-md-block,
.visible-md-inline,
.visible-md-inline-block,
.visible-lg-block,
.visible-lg-inline,
.visible-lg-inline-block {
    display: none !important
}

@media (max-width: 767px) {
    .visible-xs {
        display: block !important
    }

    table.visible-xs {
        display: table !important
    }

    tr.visible-xs {
        display: table-row !important
    }

    th.visible-xs,
    td.visible-xs {
        display: table-cell !important
    }
}

@media (max-width: 767px) {
    .visible-xs-block {
        display: block !important
    }
}

@media (max-width: 767px) {
    .visible-xs-inline {
        display: inline !important
    }
}

@media (max-width: 767px) {
    .visible-xs-inline-block {
        display: inline-block !important
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .visible-sm {
        display: block !important
    }

    table.visible-sm {
        display: table !important
    }

    tr.visible-sm {
        display: table-row !important
    }

    th.visible-sm,
    td.visible-sm {
        display: table-cell !important
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .visible-sm-block {
        display: block !important
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .visible-sm-inline {
        display: inline !important
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .visible-sm-inline-block {
        display: inline-block !important
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .visible-md {
        display: block !important
    }

    table.visible-md {
        display: table !important
    }

    tr.visible-md {
        display: table-row !important
    }

    th.visible-md,
    td.visible-md {
        display: table-cell !important
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .visible-md-block {
        display: block !important
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .visible-md-inline {
        display: inline !important
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .visible-md-inline-block {
        display: inline-block !important
    }
}

@media (min-width: 1200px) {
    .visible-lg {
        display: block !important
    }

    table.visible-lg {
        display: table !important
    }

    tr.visible-lg {
        display: table-row !important
    }

    th.visible-lg,
    td.visible-lg {
        display: table-cell !important
    }
}

@media (min-width: 1200px) {
    .visible-lg-block {
        display: block !important
    }
}

@media (min-width: 1200px) {
    .visible-lg-inline {
        display: inline !important
    }
}

@media (min-width: 1200px) {
    .visible-lg-inline-block {
        display: inline-block !important
    }
}

@media (max-width: 767px) {
    .hidden-xs {
        display: none !important
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .hidden-sm {
        display: none !important
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .hidden-md {
        display: none !important
    }
}

@media (min-width: 1200px) {
    .hidden-lg {
        display: none !important
    }
}

.visible-print {
    display: none !important
}

@media print {
    .visible-print {
        display: block !important
    }

    table.visible-print {
        display: table !important
    }

    tr.visible-print {
        display: table-row !important
    }

    th.visible-print,
    td.visible-print {
        display: table-cell !important
    }
}

.visible-print-block {
    display: none !important
}

@media print {
    .visible-print-block {
        display: block !important
    }
}

.visible-print-inline {
    display: none !important
}

@media print {
    .visible-print-inline {
        display: inline !important
    }
}

.visible-print-inline-block {
    display: none !important
}

@media print {
    .visible-print-inline-block {
        display: inline-block !important
    }
}

@media print {
    .hidden-print {
        display: none !important
    }
}

.slick-loading .slick-list {
    background: #fff url(/assets/ajax-loader-e7b44c86b050fca766a96ddac2d0932af0126da6f2305280342d909168dcce6b.gif) center center no-repeat
}

@font-face {
    font-family: "slick";
    src: url(/fonts/slick.eot);
    src: url(/fonts/slick.eot?#iefix) format("embedded-opentype"), url(/assets/slick-26726bac4060abb1226e6ceebc1336e84930fe7a7af1b3895a109d067f5b5dcc.woff) format("woff"), url(/assets/slick-37bc99cfdbbc046193a26396787374d00e7b10d3a758a36045c07bd8886360d2.ttf) format("truetype"), url(/fonts/slick.svg#slick) format("svg");
    font-weight: normal;
    font-style: normal
}

.slick-prev,
.slick-next {
    position: absolute;
    display: block;
    height: 20px;
    width: 20px;
    line-height: 0px;
    font-size: 0px;
    cursor: pointer;
    background: transparent;
    color: transparent;
    top: 50%;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    padding: 0;
    border: none;
    outline: none
}

.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus {
    outline: none;
    background: transparent;
    color: transparent
}

.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before {
    opacity: 1
}

.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before {
    opacity: 0.25
}

.slick-prev:before,
.slick-next:before {
    font-family: "slick";
    font-size: 20px;
    line-height: 1;
    color: white;
    opacity: 0.75;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.slick-prev {
    left: -25px
}

[dir="rtl"] .slick-prev {
    left: auto;
    right: -25px
}

.slick-prev:before {
    content: "←"
}

[dir="rtl"] .slick-prev:before {
    content: "→"
}

.slick-next {
    right: -25px
}

[dir="rtl"] .slick-next {
    left: -25px;
    right: auto
}

.slick-next:before {
    content: "→"
}

[dir="rtl"] .slick-next:before {
    content: "←"
}

.slick-dotted.slick-slider {
    margin-bottom: 30px
}

.slick-dots {
    position: absolute;
    bottom: -25px;
    list-style: none;
    display: block;
    text-align: center;
    padding: 0;
    margin: 0;
    width: 100%
}

.slick-dots li {
    position: relative;
    display: inline-block;
    height: 20px;
    width: 20px;
    margin: 0 5px;
    padding: 0;
    cursor: pointer
}

.slick-dots li button {
    border: 0;
    background: transparent;
    display: block;
    height: 20px;
    width: 20px;
    outline: none;
    line-height: 0px;
    font-size: 0px;
    color: transparent;
    padding: 5px;
    cursor: pointer
}

.slick-dots li button:hover,
.slick-dots li button:focus {
    outline: none
}

.slick-dots li button:hover:before,
.slick-dots li button:focus:before {
    opacity: 1
}

.slick-dots li button:before {
    position: absolute;
    top: 0;
    left: 0;
    content: "•";
    width: 20px;
    height: 20px;
    font-family: "slick";
    font-size: 6px;
    line-height: 20px;
    text-align: center;
    color: black;
    opacity: 0.25;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.slick-dots li.slick-active button:before {
    color: black;
    opacity: 0.75
}

.slick-slider {
    position: relative;
    display: block;
    box-sizing: border-box;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent
}

.slick-list {
    position: relative;
    overflow: hidden;
    display: block;
    margin: 0;
    padding: 0
}

.slick-list:focus {
    outline: none
}

.slick-list.dragging {
    cursor: pointer;
    cursor: hand
}

.slick-slider .slick-track,
.slick-slider .slick-list {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

.slick-track {
    position: relative;
    left: 0;
    top: 0;
    display: block
}

.slick-track:before,
.slick-track:after {
    content: "";
    display: table
}

.slick-track:after {
    clear: both
}

.slick-loading .slick-track {
    visibility: hidden
}

.slick-slide {
    float: left;
    height: 100%;
    min-height: 1px;
    display: none
}

[dir="rtl"] .slick-slide {
    float: right
}

.slick-slide img {
    display: block
}

.slick-slide.slick-loading img {
    display: none
}

.slick-slide.dragging img {
    pointer-events: none
}

.slick-initialized .slick-slide {
    display: block
}

.slick-loading .slick-slide {
    visibility: hidden
}

.slick-vertical .slick-slide {
    display: block;
    height: auto;
    border: 1px solid transparent
}

.slick-arrow.slick-hidden {
    display: none
}

#job-video-form.overflow {
    height: 590px;
    overflow-y: auto;
    overflow-x: hidden
}

.user-box {
    border: 1px solid #d8d8d8;
    background-color: #fff
}

.user-box.user-video .user-box-inner {
    padding-bottom: 0
}

.user-box.user-video .user-box-inner.user-box-inner-fix-height {
    padding-bottom: 20px
}

.user-box.user-video .user-box-title {
    border-bottom: 0
}

.user-box.user-video .user-video-footer {
    padding: 10px 20px 20px
}

@media only screen and (max-width: 1022px) {
    .user-box.user-video .user-video-footer {
        padding: 10px 10px 20px
    }
}

.user-box.user-video .user-video-footer h3 {
    margin: 0;
    border-top: 1px solid #d8d8d8;
    padding: 20px 0 10px
}

.user-box .user-box-title {
    margin: 0;
    padding: 10px 20px;
    color: #000;
    font-size: 1.4rem;
    border-bottom: 1px solid #d8d8d8
}

@media only screen and (max-width: 767px) {
    .user-box .user-box-title {
        padding: 10px 10px
    }
}

.user-box .user-box-title h2,
.user-box .user-box-title h3 {
    margin: 0;
    font-size: 1.4rem;
    font-weight: bold
}

.user-box .user-box-title .cf-title::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    content: "language";
    display: inline-block;
    font-size: 2.4rem;
    vertical-align: middle;
    margin-right: 5px;
    font-weight: normal;
    float: left
}

.user-box .user-box-title .cf-title-content {
    font-weight: bold
}

.user-box .user-box-title-not-border {
    border-bottom: 0
}

.user-box .user-box-inner {
    padding: 20px
}

@media only screen and (max-width: 599px) {
    .user-box .user-box-inner.user-box-inner-fix-height .user-box-title {
        padding: 0
    }
}

@media only screen and (max-width: 1022px) {
    .user-box .user-box-inner {
        padding: 20px 10px
    }
}

@media only screen and (max-width: 767px) {
    .user-box .user-box-inner {
        padding: 15px 10px 10px
    }
}

@media only screen and (max-width: 767px) {
    .user-box .btn-upload-video {
        max-width: 100%
    }
}

.video-container iframe,
.video-container object,
.video-container embed {
    top: 0;
    left: 0;
    width: 100%;
    border: none
}

footer {
    width: 100%;
    clear: both
}

footer .footer-inner {
    text-align: center;
    border-top: 1px solid #d8d8d8;
    background-color: #F5F9FA;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0
}

footer .sitemap {
    max-width: 1210px;
    margin: 0 auto 50px;
    padding: 5px 15px
}

footer .sitemap .sitemap-wrapper {
    zoom: 1;
    padding: 15px 0;
    border-top: 1px solid #d8d8d8
}

footer .sitemap .sitemap-wrapper:before,
footer .sitemap .sitemap-wrapper:after {
    display: block;
    height: 0;
    visibility: hidden;
    content: "\0020"
}

footer .sitemap .sitemap-wrapper:after {
    clear: both
}

footer .sitemap .sitemap-wrapper:first-child {
    border: none
}

footer .sitemap h3 {
    float: left;
    width: 140px;
    margin: 4px 0 0 0;
    text-align: left;
    font-size: 1.2rem;
    color: #000
}

footer .sitemap .sitemap-mul-list h3 {
    width: 100%
}

footer .sitemap .sitemap-mul-list>li {
    width: 30.33%
}

footer .sitemap .sitemap-mul-list>li ul {
    width: 100%
}

footer .sitemap .sitemap-mul-list>li ul>li {
    width: 100%;
    text-align: left
}

footer .sitemap ul {
    float: left;
    width: calc(100% - 140px);
    zoom: 1
}

footer .sitemap ul:before,
footer .sitemap ul:after {
    display: block;
    height: 0;
    visibility: hidden;
    content: "\0020"
}

footer .sitemap ul:after {
    clear: both
}

footer .sitemap ul li {
    float: left;
    font-size: 1.0rem;
    line-height: 2;
    list-style: none;
    margin-right: 30px
}

footer .sitemap ul li span.reject-cf-footer {
    position: relative;
    color: #000;
    display: inline-block;
    padding-left: 16px
}

footer .sitemap ul li span.reject-cf-footer::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    content: "chevron_right";
    position: absolute;
    top: 5px;
    left: 0px;
    font-size: 1.1rem
}

footer .sitemap ul li a {
    position: relative;
    color: #000;
    display: inline-block;
    padding-left: 16px
}

footer .sitemap ul li a::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    content: "chevron_right";
    position: absolute;
    top: 5px;
    left: 0px;
    font-size: 1.1rem
}

footer .sitemap ul li a:hover {
    color: #3A50C9
}

.copyright {
    background: #1c2b36;
    text-align: center
}

.copyright small {
    color: #fff;
    line-height: 30px
}

.mgr-contents footer {
    position: absolute;
    bottom: 0px;
    width: calc(100% - 200px);
    height: 44px;
    padding: 10px 0
}

.mgr-contents-table footer {
    width: 100%
}

.mgr-contents-table .modal-table-body .modal-body {
    max-height: 100% !important;
    color: #2A2B2D
}

.mgr-contents-table .table-label-field {
    float: left
}

.mgr-contents-table .btn-table-result-submit {
    margin-bottom: 15px;
    cursor: pointer
}

.mgr-contents-table .modal-dialog {
    min-width: 50%
}

.mgr-contents-table .button-update-type-2 {
    float: left;
    width: 100%;
    text-align: center;
    display: flex;
    justify-content: center
}

.header-pc.is-login {
    display: none
}

.header-cfn {
    zoom: 1;
    background-color: #fff;
    border-bottom: 1px solid #d8d8d8
}

.header-cfn:before,
.header-cfn:after {
    display: block;
    height: 0;
    visibility: hidden;
    content: "\0020"
}

.header-cfn:after {
    clear: both
}

.header-cfn .header-top {
    zoom: 1;
    background: #89ABE3;
    height: 25px
}

.header-cfn .header-top:before,
.header-cfn .header-top:after {
    display: block;
    height: 0;
    visibility: hidden;
    content: "\0020"
}

.header-cfn .header-top:after {
    clear: both
}

.header-cfn .header-top h1 {
    line-height: 18px;
    font-size: 1.2rem;
    margin: 3px 0 0 30px;
    color: #fff;
    float: left
}

@media only screen and (max-width: 1022px) {
    .header-cfn .header-top h1 {
        margin: 2px 0 0 15px
    }
}

.header-cfn .header-top .header-top-link {
    zoom: 1;
    float: right;
    margin: 3px 40px 0 0
}

.header-cfn .header-top .header-top-link:before,
.header-cfn .header-top .header-top-link:after {
    display: block;
    height: 0;
    visibility: hidden;
    content: "\0020"
}

.header-cfn .header-top .header-top-link:after {
    clear: both
}

@media only screen and (max-width: 1022px) {
    .header-cfn .header-top .header-top-link {
        margin: 2px 15px 0 0
    }
}

.header-cfn .header-top .header-top-link a,
.header-cfn .header-top .header-top-link p {
    color: #2A2B2D;
    float: left;
    line-height: 18px;
    font-size: 1.2rem;
    cursor: default
}

.header-cfn .header-top .header-top-link a.change-language {
    color: #fff;
    margin: 0 0 0 5px;
    cursor: pointer
}

.header-cfn .header-top .header-top-link a.change-language:hover {
    color: #3A50C9
}

.header-cfn .header-top .header-top-link a.change-language:focus,
.header-cfn .header-top .header-top-link a.change-language:active {
    text-decoration: none;
    outline: 0
}

.header-cfn .header-top .header-top-link a.change-language:before {
    content: "";
    width: 1px;
    top: 5px;
    bottom: 5px;
    left: 0;
    background: #2A2B2D;
    position: absolute;
    display: none
}

.header-cfn .header-top .header-top-link p {
    margin: 0 0 0 20px;
    color: #fff
}

.header-cfn .logo {
    zoom: 1;
    margin: 0 20px 0 0;
    padding: 20px 0 0 18px;
    float: left
}

.header-cfn .logo:before,
.header-cfn .logo:after {
    display: block;
    height: 0;
    visibility: hidden;
    content: "\0020"
}

.header-cfn .logo:after {
    clear: both
}

.header-cfn .logo img {
    width: 115px
}

@media only screen and (max-width: 1022px) {
    .header-cfn .logo img {
        width: auto
    }
}

@media only screen and (max-width: 1022px) {
    .header-cfn .logo {
        padding: 16px 0 0 15px;
        margin: 0 20px 0 0
    }
}

.header-cfn .logo p {
    line-height: 1.0;
    font-size: 0.9rem;
    margin: 0;
    color: #9A9B9D
}

@media only screen and (max-width: 1022px) {
    .header-cfn .logo p img {
        width: auto;
        height: 25px
    }
}

.header-cfn .header-menu {
    zoom: 1;
    float: left;
    margin-left: 0;
    border-right: 1px solid #d8d8d8
}

.header-cfn .header-menu:before,
.header-cfn .header-menu:after {
    display: block;
    height: 0;
    visibility: hidden;
    content: "\0020"
}

.header-cfn .header-menu:after {
    clear: both
}

@media only screen and (max-width: 1022px) {
    .header-cfn .header-menu {
        margin: 0
    }
}

.header-cfn .header-menu div {
    float: left;
    border-left: 1px solid #d8d8d8;
    font-size: 0.9rem;
    text-align: center
}

.header-cfn .header-menu a {
    position: relative;
    display: block;
    width: 108px;
    height: 70px;
    text-decoration: none;
    color: #000;
    box-sizing: border-box;
    padding-top: 50px
}

.header-cfn .header-menu a.is-selected::after,
.header-cfn .header-menu a:hover::after,
.header-cfn .header-menu a:active::after {
    left: 0;
    right: 0
}

.header-cfn .header-menu a::after {
    content: "";
    height: 3px;
    display: block;
    position: absolute;
    bottom: 0px;
    background-color: #89ABE3;
    z-index: 1;
    left: 50%;
    right: 50%;
    -webkit-transition-property: left, right;
    transition-property: left, right;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out
}

@media only screen and (min-width: 992px) and (max-width: 1240px) {
    .header-cfn .header-menu a {
        width: 90px
    }
}

@media only screen and (min-width: 992px) and (max-width: 1180px) {
    .header-cfn .header-menu a {
        width: 78px;
        min-height: 56px
    }
}

@media only screen and (max-width: 991px) {
    .header-cfn .header-menu a {
        width: 52px;
        min-height: 70px
    }
}

@media only screen and (max-width: 1180px) {
    .header-cfn .header-menu a {
        height: auto;
        padding: 17px 6px 13px
    }

    .header-cfn .header-menu a[class*=menu] {
        background: none
    }
}

.header-cfn .header-menu .menu-header-cf {
    background: url(/assets/cf-list-icon-21e25f66eb54d99b60832f992a38b45977e81d273e1ae9dd5c9596c2926d825f.png) center 14px no-repeat;
    background-size: 40px auto
}

.header-cfn .header-menu .menu-header-online-cf {
    background: url(/assets/menu-header_01@2x-a2ead24fbed53c17470e980a5e680cd9c7cb3bb41facf4866fda5e90f2508472.png) center 14px no-repeat;
    background-size: 25px 25px
}

.header-cfn .header-menu .menu-header-scout {
    background: url(/assets/menu-header_02@2x-bf1089e742d4722d27e5732114783a026e1fa83043e9920251d7dcf8e4944f4b.png) center 12px no-repeat;
    background-size: 25px 25px
}

.header-cfn .header-menu .menu-header-message {
    background: url(/assets/menu-header_03@2x-ccf036e4879eed2f67a1ae7b52b5a2bc6d11e689141daf08f044f39bc7ea7e3e.png) center 14px no-repeat;
    background-size: 24px 22px
}

.header-cfn .header-menu .menu-header-list {
    background: url(/assets/menu-header_04@2x-fb87f4a7acb7ab8fa7c0d716c694ea87cedadeb8d1bf68ed719e4e25a16f6f23.png) center 14px no-repeat;
    background-size: 24px 22px
}

.header-cfn .header-menu .menu-header-contents {
    background: url(/assets/menu-header_05@2x-f80e9f00225de03494c80e059aad4d13ab18befaea8eef60c051c1149f0188db.png) center 14px no-repeat;
    background-size: 24px 25px
}

.header-cfn .header-menu .menu-header-internship {
    background: url(/assets/menu-header_06@2x-69ce4f0c54fbf89c63c43330c86a975e510ecfa7e7f7d9093553d0093c4d9cea.svg) center 9px no-repeat;
    background-size: 35px 35px
}

.header-cfn .header-menu .menu-mypage .material-icons {
    position: absolute;
    left: 0;
    right: 0;
    top: 8px;
    font-size: 40px;
    color: #000
}

@media only screen and (max-width: 1180px) {
    .header-cfn .header-menu .menu-mypage .material-icons {
        display: none
    }
}

.header-cfn .navbar-default {
    background: none;
    border: 0;
    min-height: 44px
}

.header-cfn .navbar-default .navbar-toggle {
    margin: 0;
    padding: 8px;
    width: 46px;
    height: 46px;
    border-radius: 0;
    background: #fff;
    border-top: 0
}

.header-cfn .navbar-default .icon-bar {
    margin-left: auto;
    margin-right: auto
}

.header-cfn .navbar-default .navbar-collapse {
    background: #fff;
    border-bottom: 1px solid #d8d8d8
}

.header-cfn .header-register {
    padding-right: 20px !important
}

@media only screen and (min-width: 992px) and (max-width: 1180px) {
    .header-cfn .header-register {
        padding-right: 10px !important
    }
}

@media only screen and (max-width: 991px) {
    .header-cfn .header-register {
        padding-right: 0 !important
    }
}

.header-cfn .header-register .button {
    margin-left: 15px !important
}

@media only screen and (max-width: 1180px) {
    .header-cfn .header-register .button {
        margin-left: 4px !important
    }
}

@media only screen and (max-width: 991px) {
    .header-cfn .header-register .button {
        font-size: 1rem
    }
}

.header-cfn .header-register .register-page-button {
    right: 15px
}

@media only screen and (max-width: 1180px) {
    .header-cfn .header-register .register-page-button {
        margin-left: 15px !important
    }
}

.header-cfn .header-register .popup-login {
    right: 150px
}

@media only screen and (max-width: 1180px) {
    .header-cfn .header-register .popup-login {
        right: 113px
    }
}

@media only screen and (max-width: 991px) {
    .header-cfn .header-register .popup-login {
        right: 90px
    }
}

.header-cfn .header-register .register-button-fb {
    width: 180px !important;
    justify-content: center
}

@media only screen and (max-width: 991px) {
    .header-cfn .header-register .register-button-fb {
        width: 141px !important;
        padding-left: 2px;
        padding-right: 2px
    }
}

.header-cfn .header-login {
    zoom: 1;
    position: relative;
    float: right
}

.header-cfn .header-login:before,
.header-cfn .header-login:after {
    display: block;
    height: 0;
    visibility: hidden;
    content: "\0020"
}

.header-cfn .header-login:after {
    clear: both
}

@media only screen and (min-width: 1241px) {
    .header-cfn .header-login {
        padding: 18px 0 0 0
    }
}

@media only screen and (min-width: 992px) and (max-width: 1240px) {
    .header-cfn .header-login {
        padding: 15px 10px 0 0
    }
}

@media only screen and (max-width: 991px) {
    .header-cfn .header-login {
        padding-top: 20px
    }
}

@media screen and (max-width: 800px) {
    .header-cfn .header-login .list-inline>li {
        padding-right: 0px;
        padding-left: 2px
    }
}

.header-cfn .header-login p {
    float: left;
    margin: 6px 0 0 10px;
    font-size: 1.3rem
}

@media only screen and (max-width: 1180px) {
    .header-cfn .header-login p {
        margin: 3px 0 0 5px
    }
}

.header-cfn .header-login .header-login-link {
    float: left
}

.header-cfn .header-login .header-login-link a {
    color: #000;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    float: left
}

@media screen and (min-width: 1365px) {
    .header-cfn .header-login .header-login-link a {
        max-width: 270px
    }
}

@media screen and (min-width: 1241px) and (max-width: 1364px) {
    .header-cfn .header-login .header-login-link a {
        max-width: 150px
    }
}

@media only screen and (min-width: 992px) and (max-width: 1240px) {
    .header-cfn .header-login .header-login-link a {
        max-width: 130px
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .header-cfn .header-login .header-login-link a {
        max-width: 120px
    }
}

.header-cfn .header-login .header-login-link a:hover {
    color: #89ABE3
}

.header-cfn .header-login .right-menu {
    float: left;
    margin-top: -4px
}

.header-cfn .header-login .right-menu li a {
    display: inline-block;
    margin-top: 6px
}

.header-cfn .header-login .right-menu li a .material-icons {
    color: #89ABE3;
    vertical-align: middle;
    text-align: center;
    font-size: 2.4rem
}

.header-cfn .header-login .right-menu li a .material-icons:hover {
    color: #c0ccd5
}

.header-cfn .header-login .right-menu li a span {
    display: inline-block;
    height: 18px;
    line-height: 18px;
    font-size: 1rem;
    border-radius: 10px;
    background: #DD0E1B;
    color: #fff;
    text-align: center;
    vertical-align: middle;
    font-weight: bold;
    margin: -32px 0px 0px -17px;
    z-index: 9999;
    padding: 0px 6px
}

.header-cfn .header-login .right-menu li:first-child .material-icons {
    font-size: 2.8rem
}

.header-cfn .header-login .button {
    float: left;
    width: 120px;
    height: 30px;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s;
    margin-left: 40px
}

.header-cfn .header-login .button:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.header-cfn .header-login .button:hover,
.header-cfn .header-login .button:focus,
.header-cfn .header-login .button:active {
    color: #fff
}

.header-cfn .header-login .button::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -55px;
    left: 0px;
    border-radius: 100%;
    background-color: #89ABE3;
    width: 140px;
    height: 140px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

@media only screen and (min-width: 992px) and (max-width: 1180px) {
    .header-cfn .header-login .button {
        margin-left: 15px;
        width: 110px
    }
}

@media only screen and (max-width: 991px) {
    .header-cfn .header-login .button {
        margin-left: 10px;
        width: 90px
    }
}

.header-cfn .header-login .header-login-menu a {
    position: relative;
    padding-right: 15px;
    display: block
}

.header-cfn .header-login .header-login-menu a:after {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-feature-settings: 'liga';
    font-feature-settings: 'liga';
    position: relative;
    content: "arrow_drop_down";
    font-size: 1.8rem;
    vertical-align: middle;
    position: absolute;
    right: -2px;
    top: 4px
}

.header-cfn .popup-login {
    visibility: hidden;
    margin-top: 20px;
    position: absolute;
    width: 240px;
    top: 48px;
    right: 40px;
    background-color: #fff;
    padding: 20px;
    border-top: 4px solid #89ABE3;
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
    z-index: 99;
    transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
    transform-origin: 0 0;
    opacity: 0;
    transform: scale(1, 0.2)
}

.header-cfn .popup-login .popup-login-button .button {
    margin: 20px auto 0 auto;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s
}

.header-cfn .popup-login .popup-login-button .button:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.header-cfn .popup-login .popup-login-button .button:hover,
.header-cfn .popup-login .popup-login-button .button:focus,
.header-cfn .popup-login .popup-login-button .button:active {
    color: #fff
}

.header-cfn .popup-login .popup-login-button .button::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -75px;
    left: 0px;
    border-radius: 100%;
    background-color: #89ABE3;
    width: 180px;
    height: 180px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

.header-cfn .popup-login::before {
    display: block;
    content: "";
    position: absolute;
    right: 18px;
    top: -24px;
    width: 0;
    height: 0;
    border: 10px solid transparent;
    border-bottom: 14px solid #89ABE3
}

.header-cfn .popup-login.is-opened {
    padding: 10px;
    visibility: visible;
    opacity: 1;
    transform: scale(1, 1)
}

.header-cfn .popup-login.logined a:visited {
    color: #3A50C9 !important
}

.header-cfn .popup-login.logined a:hover {
    color: #89ABE3 !important
}

.header-cfn .is-login .popup-login {
    width: 180px
}

.header-cfn .is-login .popup-login::before {
    left: auto;
    right: 18px
}

.header-cfn .logined::before {
    left: 200px
}

.header-sp {
    display: none
}

.header-sp .header-sp-menu {
    display: none
}

.header-sp .header-sp-logo {
    position: absolute;
    text-align: center;
    top: 9px;
    left: 50%;
    margin-left: -35px
}

.header-sp .header-sp-logo img {
    width: 70px;
    height: auto
}

.header-sp .header-sp-language {
    text-align: right;
    position: absolute;
    right: 0;
    top: 0
}

.header-sp .header-sp-language .inner {
    position: relative;
    width: 100%;
    height: 100%
}

.header-sp .header-sp-language a {
    display: block;
    margin-top: 12px;
    position: relative;
    padding-right: 20px
}

.header-sp .header-sp-language a:not(.change-language) {
    display: none
}

.header-sp .header-sp-language a::after {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    content: "arrow_drop_down";
    position: absolute;
    top: 0px;
    right: 0px;
    font-size: 2.1rem;
    z-index: 0
}

.header-sp .header-sp-language .change-language~.seperate-mark,
.header-sp .header-sp-language .change-language~.using-language {
    display: none
}

.page-top .header-cfn {
    border-bottom: none
}

.page-top .header-cfn-with-s3 {
    border-bottom: 1px solid #d8d8d8
}

@media only screen and (max-width: 767px) {
    body {
        padding-top: 46px
    }
}

@media only screen and (max-width: 1180px) {
    .header-cfn {
        min-width: auto
    }
}

@media only screen and (max-width: 767px) {
    .header-cfn {
        min-width: auto;
        height: 46px;
        position: fixed;
        top: 0px;
        width: 100%;
        background-color: #fff;
        z-index: 100
    }
}

@media only screen and (max-width: 1180px) {
    .header-pc {
        min-width: auto
    }
}

@media only screen and (max-width: 767px) {
    .header-pc {
        display: none
    }
}

@media only screen and (max-width: 767px) {
    .header-sp {
        display: block
    }
}

body.is-mobile {
    padding-top: 25px
}

body.is-mobile .register-flow {
    margin-top: 40px
}

body.is-mobile-event-entry {
    padding-top: 0
}

.heading-style-01 {
    position: relative;
    font-size: 2.4rem;
    padding-bottom: 20px;
    margin: 0 0 60px 0;
    text-align: center
}

.heading-style-01:before {
    content: "";
    position: absolute;
    width: 80px;
    height: 2px;
    left: calc(50% - 40px);
    bottom: 0px;
    background-color: #89ABE3
}

.heading-style-02 {
    position: relative;
    font-size: 1.6rem;
    padding-bottom: 12px;
    margin: 0 0 20px 0;
    text-align: left;
    line-height: 1.5em
}

.heading-style-02::after {
    content: "";
    position: absolute;
    width: 160px;
    height: 1px;
    left: 0px;
    bottom: 0px;
    background-color: #89ABE3
}

.heading-style-02::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 1px;
    left: 0px;
    bottom: 0px;
    background-color: #d8d8d8
}

.heading-style-03 {
    position: relative;
    font-size: 2.4rem;
    padding-bottom: 19px;
    margin: 0 0 20px 0;
    text-align: left;
    line-height: 1.5em
}

.heading-style-03::after {
    content: "";
    position: absolute;
    width: 160px;
    height: 1px;
    left: 0px;
    bottom: 0px;
    background-color: #89ABE3
}

.heading-style-03::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 1px;
    left: 0px;
    bottom: 0px;
    background-color: #d8d8d8
}

.menu {
    border-top: 1px solid #9A9B9D
}

.menu ul {
    height: 50px;
    overflow: hidden
}

.menu li {
    -webkit-transition: 0.1s;
    -moz-transition: 0.1s;
    -ms-transition: 0.1s;
    -o-transition: 0.1s;
    transition: 0.1s;
    position: relative;
    float: left;
    width: 160px;
    list-style: none;
    line-height: 50px;
    text-align: center;
    cursor: pointer;
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%)
}

.menu li::before {
    content: '';
    display: inline-block;
    margin-right: 15px;
    vertical-align: middle;
    position: relative;
    top: -2px
}

.menu li:first-child::before {
    width: 22px;
    height: 20px;
    background: url(/../images/icon-activity.png);
    background-size: contain
}

.menu li:nth-child(2)::before {
    width: 26px;
    height: 18px;
    background: url(/../images/icon-apps.png);
    background-size: contain
}

.menu li:nth-child(3)::before {
    width: 22px;
    height: 22px;
    background: url(/../images/icon-course.png);
    background-size: contain
}

.menu li:nth-child(4)::before {
    width: 21px;
    height: 21px;
    background: url(/../images/icon-friend.png);
    background-size: contain
}

.menu li:nth-child(5)::before {
    width: 19px;
    height: 20px;
    background: url(/../images/icon-setting.png);
    background-size: contain
}

.menu li:after {
    -webkit-transition: 0.2s;
    -moz-transition: 0.2s;
    -ms-transition: 0.2s;
    -o-transition: 0.2s;
    transition: 0.2s;
    content: '';
    width: 160px;
    height: 2px;
    display: block;
    position: absolute;
    bottom: 0px;
    background-color: #89ABE3;
    -webkit-transform: translateY(2px);
    -moz-transform: translateY(2px);
    transform: translateY(2px)
}

.menu li a {
    text-decoration: none;
    color: #89ABE3
}

.menu li.is-selected,
.menu li:hover {
    -webkit-filter: grayscale(0%);
    filter: grayscale(0%)
}

.menu li.is-selected:after,
.menu li:hover:after {
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    transform: translateY(0px);
    bottom: 0px
}

.badge {
    display: inline-block;
    background-color: #DD0E1B;
    font-size: 1.0rem;
    line-height: 1;
    padding: 4px 6px;
    border-radius: 10px;
    color: #fff
}

.color-london {
    color: #C00
}

.grid-information {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap
}

.grid-information dt,
.grid-information dd {
    margin: 0;
    padding: 0;
    font-size: 1.2rem
}

.grid-information dt {
    position: relative;
    padding: 6px 20px 6px 0;
    border-right: 1px solid #d8d8d8;
    box-sizing: border-box;
    font-weight: bold
}

.grid-information dt::after {
    position: absolute;
    content: "";
    width: 5px;
    height: 5px;
    bottom: -3px;
    right: -3px;
    border-radius: 5px;
    background-color: #d8d8d8
}

.grid-information dt:last-of-type::after {
    position: absolute;
    content: "";
    width: 5px;
    height: 5px;
    bottom: -3px;
    right: -3px;
    border-radius: 5px;
    background-color: #d8d8d8
}

.grid-information dt:first-child::before {
    position: absolute;
    content: "";
    width: 5px;
    height: 5px;
    top: -3px;
    right: -3px;
    background-color: #d8d8d8;
    border-radius: 5px
}

.grid-information dd {
    padding: 6px 0 6px 20px;
    box-sizing: border-box
}

.breadcrums {
    font-size: 1.2rem;
    color: #000;
    padding: 10px 0;
    margin-bottom: 0;
    border-radius: 0
}

.breadcrums .breadcrums-home::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    position: relative;
    top: 3px;
    content: "home";
    display: inline-block;
    font-size: 1.6rem;
    margin-right: 8px
}

.breadcrums a {
    color: #000
}

.breadcrums a:hover {
    color: #89ABE3
}

.breadcrums span::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    position: relative;
    top: 4px;
    content: "navigate_next";
    display: inline-block;
    font-size: 1.6rem;
    margin-right: 4px
}

.register-info {
    width: 100%;
    margin: 0 auto 30px;
    border: 1px solid #d8d8d8;
    display: flex;
    align-items: center
}

@media only screen and (max-width: 599px) {
    .register-info {
        display: block;
        zoom: 1
    }

    .register-info:before,
    .register-info:after {
        display: block;
        height: 0;
        visibility: hidden;
        content: "\0020"
    }

    .register-info:after {
        clear: both
    }
}

.register-info .thumb {
    vertical-align: middle;
    text-align: center;
    width: 120px;
    display: table-cell;
    padding: 30px;
    line-height: 0;
    float: left
}

@media only screen and (max-width: 599px) {
    .register-info .thumb {
        display: block;
        float: left;
        width: 33.33%;
        margin: 0 0 15px;
        padding: 10px
    }
}

.register-info .thumb img {
    max-width: 100%;
    max-height: 100%
}

.register-info .content {
    vertical-align: middle;
    font-size: 1.3rem;
    display: table-cell;
    padding: 20px 10px
}

@media only screen and (max-width: 599px) {
    .register-info .content {
        display: block;
        padding: 10px;
        font-size: 1.2rem
    }
}

.register-info .company-name {
    font-size: 1.6rem;
    line-height: 1.6;
    overflow: hidden;
    margin: 0
}

@media only screen and (max-width: 599px) {
    .register-info .company-name {
        margin: 0 0 10px
    }
}

.register-info dl {
    margin: 0;
    zoom: 1
}

.register-info dl:before,
.register-info dl:after {
    display: block;
    height: 0;
    visibility: hidden;
    content: "\0020"
}

.register-info dl:after {
    clear: both
}

@media only screen and (max-width: 599px) {
    .register-info dl {
        font-size: 1.4rem
    }
}

.register-info dt {
    width: 80px;
    float: left;
    padding: 0;
    font-weight: bold
}

@media only screen and (max-width: 599px) {
    .register-info dt {
        width: 100%
    }
}

.register-info dd {
    width: calc(100% - 100px);
    float: left;
    margin: 0;
    padding: 0
}

.register-info dd:before {
    content: ':';
    margin: 0 5px 0 0
}

@media only screen and (max-width: 599px) {
    .register-info dd {
        padding-left: 0;
        width: 100%
    }

    .register-info dd:before {
        content: '';
        display: none
    }
}

.resume-controller-edit {
    clear: both;
    text-align: right
}

.resume-controller-edit .button {
    width: 120px;
    float: right
}

.resume-controller {
    display: flex;
    display: -webkit-flex;
    margin-bottom: 20px
}

.resume-controller .cfn-tab li {
    width: 220px
}

@media only screen and (max-width: 767px) {
    .resume-controller .nav-tabs {
        width: 100%
    }
}

.resume-controller .nav-tabs li {
    min-width: 220px
}

@media only screen and (max-width: 1240px) {
    .resume-controller .nav-tabs li {
        min-width: 200px
    }
}

.resume-controller .resume-controller-note {
    font-weight: bold;
    color: #DD0E1B;
    padding-top: 10px
}

.resume-controller .button {
    margin-top: 10px;
    margin-left: auto;
    width: 120px;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s
}

.resume-controller .button:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.resume-controller .button:hover,
.resume-controller .button:focus,
.resume-controller .button:active {
    color: #fff
}

.resume-controller .button::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -45px;
    left: 0px;
    border-radius: 100%;
    background-color: #89ABE3;
    width: 120px;
    height: 120px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

.resume-controller .button~.button {
    margin-left: 10px
}

.job-entry-preview-note {
    text-align: center
}

.resume-cf-box {
    border: 1px solid #d8d8d8;
    padding: 30px;
    margin: 0 auto 30px
}

@media only screen and (max-width: 991px) {
    .resume-cf-box {
        padding: 20px
    }
}

@media only screen and (max-width: 599px) {
    .resume-cf-box {
        padding: 15px 10px
    }
}

.resume-cf-box h2 {
    margin: 0;
    width: 100%
}

@media only screen and (max-width: 991px) {
    .resume-cf-box h2 {
        font-size: 1.4rem
    }
}

.resume-cf-box .resume-cf-box-info {
    padding: 20px;
    background-color: #F5F9FA
}

.resume-cf-box p {
    font-size: 1.4rem
}

.resume-cf-box img {
    vertical-align: bottom;
    margin-right: 5px;
    max-width: 90%;
    height: auto
}

@media only screen and (max-width: 991px) {
    .resume-cf-box img {
        display: block;
        margin: 0 0 10px
    }
}

.resume-preview {
    border: 1px solid #d8d8d8;
    margin: 0 0 20px;
    background-color: #fff
}

@media only screen and (max-width: 991px) {
    .resume-preview {
        padding: 20px
    }
}

@media only screen and (max-width: 599px) {
    .resume-preview {
        padding: 15px 10px 0;
        margin-bottom: 0
    }
}

.resume-preview .notice {
    color: #DD0E1B
}

.resume-preview .highlight {
    padding: 20px;
    background: #F5F9FA
}

.resume-preview .highlight .notice {
    font-size: 1.4rem;
    margin-bottom: 10px
}

.resume-preview .md-textfield-input:disabled,
.resume-preview .md-select-box:disabled {
    border: 1px solid #9A9B9D !important
}

.resume-preview-head-container {
    margin-bottom: 5px;
    font-size: 9pt
}

.resume-preview-head-container .resume-preview-contact {
    margin-left: auto
}

.resume-preview-head-container .resume-preview-contact p {
    display: inline-block
}

.resume-preview-head-container .resume-preview-contact a {
    margin-left: 17px;
    font-size: 1.2rem;
    display: inline-block;
    position: relative
}

.resume-preview-head-container .resume-preview-contact .material-icons {
    font-size: 1.6rem;
    line-height: 1.2em;
    vertical-align: middle;
    margin: 0 3px 0 0
}

.resume-preview-head-container .memo {
    margin-left: 40px
}

.resume-preview-head-container .memo p {
    display: inline-block;
    max-width: 600px
}

.resume-preview-head-container .memo a {
    position: relative
}

.resume-preview-head-container .memo textarea {
    width: 600px;
    display: inline-block
}

.resume-status {
    padding-bottom: 20px
}

.resume-status .change-status {
    text-decoration: underline;
    font-size: 1rem;
    margin-left: 10px
}

.resume-status .publish,
.resume-status .unpublish {
    position: relative
}

.resume-status .publish:before,
.resume-status .unpublish:before {
    content: attr(data-text);
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 100%;
    color: #6A6B6D;
    font-size: .7em;
    text-align: center
}

.resume-status .publish {
    color: #25B665
}

.resume-status .unpublish {
    color: #3984C4
}

.resume-status .resume-notice-box .notice {
    font-size: 1.2rem
}

.resume-status .resume-notice-box a {
    font-size: 1.2rem;
    text-decoration: underline
}

.resume-status-title {
    color: #000;
    font-size: 1rem
}

.resume-preview .resume-other-label.resume-work-time {
    text-align: right;
    padding-right: 10px
}

.resume-preview .title-stroke:first-child,
.resume-preview .resume-preview-heading:first-child {
    margin-top: 0
}

.resume-preview .resume-preview-heading {
    margin-top: 30px
}

.resume-preview .resume-preview-information {
    margin: 0.6em;
    color: #000;
    zoom: 1
}

.resume-preview .resume-preview-information:first-child {
    margin-top: 1.2em
}

.resume-preview .resume-preview-information:last-child {
    margin-bottom: 1.2em
}

.resume-preview .resume-preview-information:before,
.resume-preview .resume-preview-information:after {
    display: block;
    height: 0;
    visibility: hidden;
    content: "\0020"
}

.resume-preview .resume-preview-information:after {
    clear: both
}

.resume-preview .resume-preview-information dt {
    float: left;
    width: 155px;
    padding: 5px 0;
    font-size: 1.4rem
}

.resume-preview .resume-preview-information dd {
    float: left;
    width: 100%;
    padding: 6px 20px 6px 20px;
    font-size: 1.2rem
}

.resume-preview .resume-preview-information dd.application-block-dd {
    width: calc(100% - 155px)
}

.resume-preview .resume-preview-information dd.application-block-dd span {
    text-align: left;
    width: calc(100% - 150px)
}

.resume-preview .resume-preview-information dd .clearfix br {
    display: block;
    content: "";
    margin-top: 0
}

.resume-preview .resume-preview-information dd p strong {
    white-space: pre-line
}

.resume-preview .resume-preview-information strong {
    font-size: 1.2rem
}

.resume-preview .resume-preview-information .download-video {
    margin-top: 10px;
    width: 150px
}

.resume-preview .resume-preview-information .resume-work-block {
    display: block;
    width: 100%
}

.resume-preview .resume-preview-information .resume-work-block dt {
    clear: both
}

.resume-preview .resume-preview-information .resume-work-block dt:first-child::before,
.resume-preview .resume-preview-information .resume-work-block dt:first-child::after,
.resume-preview .resume-preview-information .resume-work-block dt:before,
.resume-preview .resume-preview-information .resume-work-block dt:after {
    display: none
}

.resume-preview .resume-preview-information .resume-work-block dd {
    border-left: 1px solid #d8d8d8;
    float: right;
    position: relative;
    left: -1px
}

.resume-preview .resume-preview-information .resume-work-block dd:first-child:before {
    position: absolute;
    content: "";
    width: 5px;
    height: 5px;
    top: -3px;
    left: -3px;
    background-color: #d8d8d8;
    border-radius: 5px
}

.resume-preview .resume-preview-information .resume-work-block dd:after {
    position: absolute;
    content: "";
    width: 5px;
    height: 5px;
    bottom: -3px;
    left: -3px;
    border-radius: 5px;
    background-color: #d8d8d8
}

.resume-preview .resume-preview-information .user-work-position {
    margin-bottom: 3px
}

.resume-preview .resume-preview-information .user-job-description {
    margin-top: 3px
}

.resume-preview .resume-preview-information .resume-work .user-work-company {
    margin-bottom: 3px
}

.resume-preview .resume-preview-description {
    width: calc(100% - 180px);
    padding: 0 20px;
    font-size: 1.4rem;
    border-left: 1px solid #d8d8d8;
    margin: 20px 0 20px 180px
}

@media only screen and (max-width: 599px) {
    .resume-preview .resume-preview-description {
        padding: 0 10px
    }
}

.edit-user-preview .resume-preview-information dd {
    width: calc(100% - 155px);
    padding: 5px 0 5px 20px
}

.resume-preview-history ul {
    padding-left: 20px;
    margin-left: 40px;
    margin-bottom: 40px
}

.resume-preview-history ul li {
    margin: 10px 0
}

.resume-preview-qa {
    padding: 0 40px
}

.resume-preview-qa th {
    text-align: left
}

.resume-preview-qa table p {
    margin-bottom: 0px
}

.please-login {
    padding-bottom: 20px;
    font-size: 1.4rem;
    color: #2A2B2D
}

.scout-wrapper {
    width: 100%;
    float: left
}

.scout-wrapper .scout-id-content {
    float: left;
    margin-right: 5px
}

.scout-wrapper .scout-resume-preview-link {
    padding-top: 11px
}

.scout-wrapper .disable-link-view {
    color: #89ABE3
}

.scout-id-content {
    margin-top: 6px
}

.scout-id-content .scout-id-label {
    text-transform: capitalize;
    color: #000;
    font-size: 1.8rem;
    margin-right: 5px
}

.scout-id-content .scout-id-text {
    font-weight: bold;
    color: #77bf81;
    font-size: 2rem
}

.resume-status-wrapper .boldfont-18 {
    font-size: 1.8rem !important;
    font-weight: bold
}

.page-resume .resume-note-block {
    width: calc(100% - 130px);
    margin-right: 10px;
    margin-top: 6px
}

.page-resume .resume-note-message {
    color: #DD0E1B;
    font-weight: bold
}

.page-resume .resume-controller-wrap {
    align-items: center
}

.page-resume .resume-controller {
    flex-wrap: wrap
}

@media only screen and (max-width: 599px) {
    .page-resume .resume-controller {
        margin-top: 30px
    }
}

@media only screen and (max-width: 599px) {
    .page-resume .resume-controller .nav-tabs {
        margin-bottom: 0
    }
}

@media only screen and (max-width: 1022px) {
    .page-resume .resume-controller .nav-tabs li {
        min-width: 0px
    }
}

@media only screen and (max-width: 599px) {
    .page-resume .resume-controller .nav-tabs li {
        width: 50%
    }
}

@media only screen and (max-width: 599px) {
    .page-resume .resume-controller .button-edit {
        margin-bottom: 20px
    }
}

@media only screen and (max-width: 599px) {
    .page-resume .resume-controller .button-print {
        display: none
    }
}

@media only screen and (max-width: 599px) {
    .page-resume .grid-information {
        display: block
    }
}

.page-resume .grid-information dt,
.page-resume .grid-information dd {
    word-break: break-word
}

@media only screen and (max-width: 599px) {

    .page-resume .grid-information dt:first-child,
    .page-resume .grid-information dd:first-child {
        padding-top: 0
    }
}

@media only screen and (max-width: 599px) {

    .page-resume .grid-information dt,
    .page-resume .grid-information dd {
        float: none;
        width: 100%
    }
}

@media only screen and (max-width: 599px) {
    .page-resume .grid-information dt {
        border-right: none;
        padding-bottom: 0
    }
}

@media only screen and (max-width: 599px) {

    .page-resume .grid-information dt::before,
    .page-resume .grid-information dt::after {
        display: none
    }
}

@media only screen and (max-width: 991px) {
    .page-resume .grid-information dd {
        width: calc(100% - 160px)
    }
}

@media only screen and (max-width: 599px) {
    .page-resume .grid-information dd {
        padding-top: 10px;
        padding-bottom: 10px;
        padding-left: 6mm;
        width: 100%
    }
}

@media only screen and (max-width: 599px) {
    .page-resume .resume-preview .resume-preview-description {
        width: 100%;
        padding-bottom: 20px;
        margin-left: 0;
        border-left: none;
        border-bottom: 1px solid #d8d8d8;
        padding-left: 0
    }

    .page-resume .resume-preview .resume-preview-description:last-child {
        border-bottom: none
    }
}

@media only screen and (max-width: 991px) {

    .page-resume .resume-preview .register-row .md-textfield,
    .page-resume .resume-preview .register-row .md-select,
    .page-resume .resume-preview .register-row .md-textarea {
        padding-right: 40px
    }
}

@media only screen and (max-width: 767px) {

    .page-resume .resume-preview .register-row .md-textfield,
    .page-resume .resume-preview .register-row .md-select,
    .page-resume .resume-preview .register-row .md-textarea {
        margin: 0 0 5px
    }
}

@media only screen and (max-width: 599px) {

    .page-resume .resume-preview .register-row .md-textfield,
    .page-resume .resume-preview .register-row .md-select,
    .page-resume .resume-preview .register-row .md-textarea {
        padding-right: 30px
    }
}

@media only screen and (max-width: 599px) {

    .page-resume .resume-preview .register-row .is-ok::before,
    .page-resume .resume-preview .register-row .is.ng::before {
        right: 0
    }
}

@media only screen and (max-width: 599px) {
    .page-resume .resume-preview .register-row .md-radio {
        margin: 0
    }
}

@media only screen and (max-width: 599px) {
    .page-resume .resume-preview .register-row .cf-btn {
        margin-bottom: 10px
    }
}

@media only screen and (max-width: 599px) {
    .page-resume .resume-preview .note {
        font-size: 1.2rem
    }
}

.page-resume .resume-preview .resume-preview-heading {
    margin: 10px 0 0 10px
}

@media print {
    .print-logo-resume {
        max-width: 200px !important
    }
}

.edu-notice {
    margin-bottom: 10px
}

.edu-notice.register-edu-notice {
    padding: 0 30px;
    margin-bottom: 0
}

@media only screen and (max-width: 767px) {
    .edu-notice.register-edu-notice {
        padding: 0
    }
}

.resume-preview div+.register-row {
    margin-top: 20px
}

@media only screen and (max-width: 767px) {
    .resume-preview div+.register-row {
        margin-top: 0
    }
}

.resume-preview .register-row {
    padding: 0
}

.resume-preview .register-row .md-textfield,
.resume-preview .register-row .md-select,
.resume-preview .register-row .md-textarea {
    margin: 0
}

.resume-preview .register-row .md-checkbox {
    padding: 6px 0
}

.resume-preview .register-row:hover {
    background-color: #fff
}

.resume-preview .register-row+div {
    margin-top: 20px
}

@media only screen and (max-width: 767px) {
    .resume-preview .register-row+div {
        margin-top: 0
    }
}

.resume-preview .register-row .user-tels-info {
    display: inline-flex
}

.resume-preview .register-row .user-tels-info .country-code-symbol {
    margin-top: 8px;
    margin-right: 10px
}

.resume-preview .register-row .user-tels-info .user-tels {
    width: 260px
}

.resume-preview .register-row .user-tels-info .ng-messages-list {
    width: 224px
}

.resume-preview .register-row .user-tels-info .country-code-note {
    font-size: 1.0rem;
    margin: 4px 0 0 0;
    clear: both
}

.resume-preview .register-row .resume-email-field .resume-email-input {
    border: none;
    border-bottom: 1px solid;
    border-radius: 0;
    border-color: #e67e22
}

.resume-preview .register-button-wrapper {
    zoom: 1
}

.resume-preview .register-button-wrapper:before,
.resume-preview .register-button-wrapper:after {
    display: block;
    height: 0;
    visibility: hidden;
    content: "\0020"
}

.resume-preview .register-button-wrapper:after {
    clear: both
}

.resume-preview .register-button-wrapper,
.resume-preview .register-add-education {
    clear: left;
    margin: 0 !important;
    padding: 10px 0
}

.resume-preview .register-button-wrapper+div,
.resume-preview .register-add-education+div {
    margin-top: 20px
}

.resume-preview .register-double-major {
    margin-top: 20px
}

.resume-preview .md-textfield-title {
    display: flex;
    flex-wrap: wrap;
    align-items: center
}

@media only screen and (max-width: 599px) {
    .resume-preview .md-textfield-title {
        display: block
    }
}

@media only screen and (max-width: 599px) {
    .resume-preview .md-textfield-title.validate.is-ok:before {
        top: 35px
    }
}

.resume-preview .md-textfield-title strong {
    font-size: 1.4rem;
    font-weight: bold
}

@media only screen and (max-width: 599px) {
    .resume-preview .md-textfield-title strong {
        display: block;
        margin: 0 0 10px
    }
}

.resume-preview .md-textfield-title .md-textfield-input {
    width: calc(100% - 5em);
    margin-left: auto
}

@media only screen and (max-width: 599px) {
    .resume-preview .md-textfield-title .md-textfield-input {
        width: 100%
    }
}

.resume-preview .note {
    padding: 0;
    margin: 8px 0;
    font-size: 1.4rem
}

.resume-preview .note span.orange {
    color: #e67e22;
    border-bottom: 1px solid #e67e22
}

.resume-preview .note span.blue {
    color: #89ABE3;
    border-bottom: 1px solid #89ABE3
}

.resume-preview .button-add {
    margin-top: 10px;
    width: 160px;
    font-size: 1.3rem
}

.resume-preview .button-add span {
    padding-left: 1.6rem
}

.resume-preview .button-add span::before {
    content: "add";
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    display: block;
    font-size: 1.4rem;
    position: absolute;
    top: 3px
}

.resume-preview .button-delete {
    margin-top: 10px;
    width: 70px;
    display: none;
    border: none;
    background-color: #d8d8d8;
    color: #6A6B6D;
    margin-right: 10px;
    font-size: 1.3rem
}

.resume-preview .button-delete span {
    padding-left: 1.6rem
}

.resume-preview .button-delete span::before {
    content: "remove";
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    display: block;
    font-size: 1.4rem;
    position: absolute;
    top: 3px
}

.resume-preview .button-delete::before {
    display: none
}

.resume-edit-button {
    display: flex;
    justify-content: flex-end;
    margin: 20px 0
}

.resume-edit-button .button-cancel {
    margin-right: 10px
}

.resume-edit-button .button-cancel::before {
    display: none
}

.resume-edit-button .button-cancel:hover {
    background-color: #6A6B6D;
    color: #fff
}

.public-resume-label {
    margin: 0 10px 10px 0
}

.sidemenu {
    width: 280px;
    z-index: 2
}

@media only screen and (max-width: 1022px) {
    .sidemenu {
        position: static !important
    }
}

.sidemenu.is_stuck {
    margin-top: 20px
}

.company-detail-sidemenu {
    max-height: 640px;
    overflow: auto
}

.company-detail-sidemenu.is_stuck {
    margin-top: 20px
}

.sidemenu-box {
    border: 1px solid #d8d8d8;
    background-color: #fff;
    margin-bottom: 20px
}

.sidemenu-box:last-child {
    margin-bottom: 0
}

.sidemenu-box h3 {
    border-bottom: 1px solid #d8d8d8;
    background-color: #F2F2F2;
    margin: 0;
    padding: 13px 20px;
    color: #000;
    font-size: 1.4rem;
    font-weight: bold
}

.sidemenu-box h4 {
    margin: 0;
    font-size: 1.4rem
}

.sidemenu-box .sidemenu-inner {
    padding: 20px
}

@media only screen and (max-width: 1022px) {
    .sidemenu-box .sidemenu-inner {
        padding: 20px 10px
    }
}

.sidemenu-box .apply-calendar {
    color: #000;
    margin: 0 0 10px 0
}

.sidemenu-box .apply-calendar::before {
    content: "event";
    color: #000;
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    display: inline-block;
    margin-right: 4px;
    font-size: 1.6rem;
    top: 4px
}

.sidemenu-box .apply-note {
    border: 1px solid;
    margin: 0 0 8px 0;
    padding: 0 8px;
    text-align: center
}

@media only screen and (max-width: 1022px) {
    .sidemenu-box .button.button-outline {
        width: 49%;
        position: relative;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        overflow: hidden;
        -moz-osx-font-smoothing: grayscale;
        position: relative;
        -webkit-transition-property: all;
        transition-property: all;
        -webkit-transition-duration: 0.1s;
        transition-duration: 0.1s
    }

    .sidemenu-box .button.button-outline:hover::before {
        -webkit-transform: scale(2);
        transform: scale(2);
        opacity: 1
    }

    .sidemenu-box .button.button-outline:hover,
    .sidemenu-box .button.button-outline:focus,
    .sidemenu-box .button.button-outline:active {
        color: #fff
    }

    .sidemenu-box .button.button-outline::before {
        content: "";
        display: block;
        position: absolute;
        z-index: -1;
        top: -187px;
        left: 0px;
        border-radius: 100%;
        background-color: #3A50C9;
        width: 400px;
        height: 400px;
        -webkit-transform: scale(0);
        transform: scale(0);
        -webkit-transition-property: transform;
        transition-property: transform;
        -webkit-transition-duration: 0.3s;
        transition-duration: 0.3s;
        -webkit-transition-property: all;
        transition-property: all;
        -webkit-transition-timing-function: ease-out;
        transition-timing-function: ease-out;
        opacity: 0.2
    }
}

.sidemenu-box .button-scholar {
    float: left;
    width: 115px;
    height: 26px;
    font-size: 1.0rem;
    margin: 10px 0;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s
}

.sidemenu-box .button-scholar:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.sidemenu-box .button-scholar:hover,
.sidemenu-box .button-scholar:focus,
.sidemenu-box .button-scholar:active {
    color: #fff
}

.sidemenu-box .button-scholar::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -44.5px;
    left: 0px;
    border-radius: 100%;
    background-color: #3A50C9;
    width: 115px;
    height: 115px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

.sidemenu-box .button-scholar span::before {
    content: "school"
}

.sidemenu-box .button-badge {
    float: right;
    width: 115px;
    height: 26px;
    font-size: 1.0rem;
    margin: 10px 0;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s
}

.sidemenu-box .button-badge:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.sidemenu-box .button-badge:hover,
.sidemenu-box .button-badge:focus,
.sidemenu-box .button-badge:active {
    color: #fff
}

.sidemenu-box .button-badge::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -44.5px;
    left: 0px;
    border-radius: 100%;
    background-color: #3A50C9;
    width: 115px;
    height: 115px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

.sidemenu-box .button-badge span::before {
    content: "local_offer"
}

.sidemenu-box .button-entry {
    clear: both;
    width: 100%;
    margin-top: 10px;
    cursor: pointer
}

.sidemenu-box .button-entry::before {
    display: none
}

.sidemenu-box .button-entry:hover {
    opacity: 0.8
}

.sidemenu-box .button-event-registered {
    color: black;
    clear: both;
    width: 100%;
    margin-top: 10px;
    background-color: #F2F2F2;
    -webkit-transform: unset;
    transform: unset;
    margin-bottom: 0px
}

.sidemenu-box .button-event-registered:hover {
    color: black
}

.sidemenu-box .button-attend {
    height: 50px;
    font-size: 18px
}

.sidemenu-box .button-entry-day1 {
    background-color: #77bf81;
    cursor: pointer
}

.sidemenu-box .button-entry-day2 {
    background-color: #e67e22;
    cursor: pointer
}

.sidemenu-navi li {
    display: block;
    margin: 0;
    list-style: none;
    border-top: 1px solid #d8d8d8
}

.sidemenu-navi li:first-child {
    border-top: none
}

.sidemenu-navi li a {
    position: relative;
    height: 50px;
    width: 100%;
    position: relative;
    top: 0px;
    color: #000;
    font-size: 1.2rem;
    padding-left: 20px;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    text-decoration: none;
    -webkit-transition: all 0.1s;
    transition: all 0.1s
}

.sidemenu-navi li a.is-selected::after,
.sidemenu-navi li a:hover::after,
.sidemenu-navi li a:focus::after,
.sidemenu-navi li a:active::after {
    top: 0;
    bottom: 0
}

.sidemenu-navi li a::after {
    content: "";
    width: 3px;
    display: block;
    position: absolute;
    left: 0px;
    background-color: #89ABE3;
    z-index: 100;
    top: 50%;
    bottom: 50%;
    -webkit-transition-property: top, bottom;
    transition-property: top, bottom;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out
}

.sidemenu-navi li a:after,
.sidemenu-navi li a p:after {
    z-index: 30
}

.sidemenu-navi li a::before,
.sidemenu-navi li a p::before {
    color: #000;
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    display: inline-block;
    margin-right: 10px;
    font-size: 2.4rem
}

.sidemenu-navi li a.is-selected,
.sidemenu-navi li a p.is-selected,
.sidemenu-navi li a:hover,
.sidemenu-navi li a:focus,
.sidemenu-navi li a p:focus,
.sidemenu-navi li a:active,
.sidemenu-navi li a p:active {
    color: #89ABE3
}

.sidemenu-navi li a.is-selected::before,
.sidemenu-navi li a.is-selected p::before,
.sidemenu-navi li a p.is-selected::before,
.sidemenu-navi li a p.is-selected p::before,
.sidemenu-navi li a:hover::before,
.sidemenu-navi li a:hover p::before,
.sidemenu-navi li a:focus::before,
.sidemenu-navi li a:focus p::before,
.sidemenu-navi li a p:focus::before,
.sidemenu-navi li a p:focus p::before,
.sidemenu-navi li a:active::before,
.sidemenu-navi li a:active p::before,
.sidemenu-navi li a p:active::before,
.sidemenu-navi li a p:active p::before {
    color: #89ABE3
}

.sidemenu-navi li a.is-selected,
.sidemenu-navi li a p.is-selected {
    cursor: default
}

.sidemenu-navi li a .badge,
.sidemenu-navi li a p.badge {
    position: absolute;
    top: calc(50% - 10px);
    right: 20px
}

.sidemenu-navi li a p {
    margin-bottom: 0
}

.sidemenu-navi li a:hover p {
    color: #89ABE3
}

.sidemenu-navi .sidemenu-navi-top a::before {
    content: "home"
}

.sidemenu-navi .sidemenu-navi-profile a::before {
    content: "portrait"
}

.sidemenu-navi .sidemenu-navi-mail a::before {
    content: "mail_outline"
}

.sidemenu-navi .sidemenu-navi-video a::before {
    content: "videocam"
}

.sidemenu-navi .sidemenu-navi-company a::before {
    content: "business"
}

.sidemenu-navi .sidemenu-navi-history a::before {
    content: "av_timer"
}

.sidemenu-navi .sidemenu-navi-setting a::before {
    content: "settings"
}

.sidemenu-navi .sidemenu-navi-cfn-online-top a::before {
    content: "public"
}

.sidemenu-navi .sidemenu-navi-myschedule a::before {
    content: "\ebcc"
}

.sidemenu-navi .sidemenu-child {
    position: relative
}

.sidemenu-navi .sidemenu-child a {
    padding-left: 50px
}

.sidemenu-navi .sidemenu-child:after {
    content: "";
    display: block;
    height: calc(100% - 10px);
    width: 15px;
    border: dashed 1px #000;
    border-top: 0;
    border-right: 0;
    position: absolute;
    left: 30px;
    bottom: 50%
}

.sidemenu-company-detail h4 {
    border-bottom: 1px solid #d8d8d8;
    padding: 13px 20px
}

.sidemenu-company-detail .sidemenu-apply h2 {
    margin-top: 0;
    background: #89ABE3
}

.sidemenu-company-detail .sidemenu-apply .online-overview {
    margin: 0 0 10px
}

.sidemenu-company-detail .sidemenu-apply div {
    border-bottom: 1px solid #89ABE3;
    padding: 10px 0
}

.sidemenu-company-detail .sidemenu-apply div p,
.sidemenu-company-detail .sidemenu-apply div i {
    display: inline-block;
    vertical-align: middle
}

.sidemenu-company-detail .sidemenu-apply div i {
    color: #3A50C9
}

.sidemenu-company-detail .sidemenu-apply div .icon,
.sidemenu-company-detail .sidemenu-apply div span {
    vertical-align: middle;
    display: inline-block;
    color: #3A50C9;
    font-size: 1.2rem;
    padding: 2px 8px;
    text-align: center;
    min-width: 5.3em
}

@media only screen and (max-width: 991px) {

    .sidemenu-company-detail .sidemenu-apply div .icon,
    .sidemenu-company-detail .sidemenu-apply div span {
        font-size: 1.1rem;
        padding: 0 8px
    }
}

.sidemenu-company-detail .sidemenu-apply div+h4 {
    border-top: 1px solid #d8d8d8
}

.sidemenu-company-detail .sidemenu-apply .privacy-policy-noti {
    border: 0px;
    padding-bottom: 0px;
    font-weight: bold
}

.sidemenu-company-detail .sidemenu-apply .privacy-policy-noti a {
    text-decoration: underline
}

.sidemenu-company-detail .sidemenu-apply p {
    line-height: 1.5;
    margin: 0;
    text-align: left
}

@media only screen and (max-width: 991px) {
    .sidemenu-company-detail .sidemenu-apply p {
        margin: 0 15px 0 0
    }
}

.sidemenu-company-detail .sidemenu-apply p strong {
    display: inline-block;
    padding: 2px 4px
}

@media only screen and (max-width: 991px) {
    .sidemenu-company-detail .sidemenu-apply p strong {
        border-bottom: none
    }
}

.sidemenu-company-detail .sidemenu-apply .company-job {
    font-size: 1.4rem;
    line-height: 1.5;
    margin-top: 0;
    word-break: break-word
}

.sidemenu-company-detail .sidemenu-apply .button-company-apply {
    margin-top: 20px;
    width: 100%;
    height: 30px;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s
}

.sidemenu-company-detail .sidemenu-apply .button-company-apply:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.sidemenu-company-detail .sidemenu-apply .button-company-apply:hover,
.sidemenu-company-detail .sidemenu-apply .button-company-apply:focus,
.sidemenu-company-detail .sidemenu-apply .button-company-apply:active {
    color: #fff
}

.sidemenu-company-detail .sidemenu-apply .button-company-apply::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -105px;
    left: 0px;
    border-radius: 100%;
    background-color: #3A50C9;
    width: 240px;
    height: 240px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

.sidemenu-company-detail .sidemenu-apply .button-job-apply {
    width: 100%;
    height: 36px;
    margin-top: 20px;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s
}

.sidemenu-company-detail .sidemenu-apply .button-job-apply:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.sidemenu-company-detail .sidemenu-apply .button-job-apply:hover,
.sidemenu-company-detail .sidemenu-apply .button-job-apply:focus,
.sidemenu-company-detail .sidemenu-apply .button-job-apply:active {
    color: #fff
}

.sidemenu-company-detail .sidemenu-apply .button-job-apply::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -105px;
    left: 0px;
    border-radius: 100%;
    background-color: #89ABE3;
    width: 240px;
    height: 240px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

@media only screen and (max-width: 991px) {
    .sidemenu-company-detail .sidemenu-apply .button-job-apply {
        margin-bottom: 15px
    }
}

@media only screen and (max-width: 1022px) {
    .sidemenu-company-detail .sidemenu-apply .button-job-apply {
        max-width: 180px;
        margin: 20px auto 0;
        height: 30px
    }
}

@media only screen and (max-width: 767px) {
    .sidemenu-company-detail .sidemenu-apply .button-job-apply {
        display: none
    }
}

.sidemenu-company-detail .sidemenu-apply .count-down-time {
    color: orange
}

.sidemenu-company-detail .sidemenu-apply .job-notification {
    border-bottom: none;
    padding: 4px 4px
}

@media only screen and (max-width: 767px) {
    .sidemenu-company-detail .sidemenu-apply .job-notification {
        display: none
    }
}

.sidemenu {
    width: 280px;
    margin: 0 0 20px
}

@media only screen and (max-width: 1022px) {
    .sidemenu {
        position: static !important
    }
}

.sidemenu .sidemenu-header {
    background: #89ABE3;
    margin: 0;
    padding: 15px;
    text-align: center;
    color: #fff;
    font-size: 1.4rem
}

.hidden-ss .badge {
    right: 10px !important
}

.sidemenu-navi-cfn-seminar {
    position: relative;
    background: linear-gradient(to bottom, #3a50c9 50%, #1630bf 50%);
    border: none;
    color: white;
    padding: 10px 30px;
    border-radius: 5px;
    cursor: pointer;
    display: flex;
    align-items: center;
    margin-bottom: 20px
}

.sidemenu-navi-cfn-seminar svg {
    position: absolute;
    right: 1.5rem;
    top: 50%;
    transform: translateY(-50%);
    fill: white
}

.notify-box {
    border: 1px solid #d8d8d8;
    width: 100%;
    max-width: 760px;
    margin: 40px auto;
    padding: 33px 40px 40px;
    font-size: 1.4rem
}

.notify-box p {
    font-size: 1.4rem
}

.notify-box h2 {
    margin: 0 0 40px
}

.notify-box dl {
    margin: 0 0 40px
}

.notify-box dt {
    width: 100px;
    font-weight: bold;
    padding: 5px 0
}

.notify-box dd {
    padding: 5px 0
}

.notify-box dd:before {
    content: ":";
    margin: 0 5px 0 0
}

@-webkit-keyframes loaderrotate {
    100% {
        -webkit-transform: rotate(360deg)
    }
}

@keyframes loaderrotate {
    100% {
        transform: rotate(360deg);
        -webkit-transform: rotate(360deg)
    }
}

@-webkit-keyframes loaderbounce {

    0%,
    100% {
        -webkit-transform: scale(0)
    }

    50% {
        -webkit-transform: scale(1)
    }
}

@keyframes loaderbounce {

    0%,
    100% {
        transform: scale(0);
        -webkit-transform: scale(0)
    }

    50% {
        transform: scale(1);
        -webkit-transform: scale(1)
    }
}

.page-overlay {
    background: rgba(255, 255, 255, 0.7);
    display: inherit;
    width: 100%;
    height: 100vh;
    position: fixed;
    top: 0;
    z-index: 9999;
    bottom: 0
}

.page-overlay.is-black {
    background: rgba(0, 0, 0, 0.6)
}

.page-overlay-footer {
    float: left;
    height: 67px;
    width: 100%;
    text-align: center;
    position: relative
}

.page-overlay-footer.hide {
    display: none
}

#pageloaderfooter.animate {
    width: 40px;
    height: 40px;
    text-align: center;
    left: 0;
    position: absolute;
    right: 0;
    margin: auto;
    top: 20px;
    animation: loaderrotate 2.0s infinite linear
}

#pageloaderfooter.animate .dot1,
#pageloaderfooter.animate .dot2 {
    width: 60%;
    height: 60%;
    display: inline-block;
    position: absolute;
    top: 0;
    background-color: #89ABE3;
    border-radius: 100%;
    animation: loaderbounce 2.0s infinite ease-in-out
}

#pageloaderfooter.animate .dot2 {
    top: auto;
    bottom: 0px;
    animation-delay: -1.0s;
    background-color: #f22c39
}

.background-load {
    position: fixed;
    width: 25%;
    min-width: 220px;
    height: 3%;
    left: 0;
    text-align: center;
    right: 0;
    bottom: 0;
    margin: auto
}

.page-load {
    top: 0px;
    background-color: gray
}

.title-load {
    top: -160px;
    font-size: 23px;
    font-weight: bold
}

.percent-load {
    top: -120px
}

.background-progress {
    background-color: gray;
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden
}

#pageprogress-percent {
    font-size: 40px;
    font-weight: bold;
    color: #3A50C9
}

.percent {
    width: 0%;
    background-color: coral;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0
}

.green {
    color: #66bb6a
}

.light-green {
    background-color: #77bf81
}

#pageloader.hide {
    display: none
}

#pageloader.animate {
    width: 40px;
    height: 40px;
    position: fixed;
    text-align: center;
    top: 50%;
    left: 50%;
    margin: -30px 0 0 -30px;
    animation: loaderrotate 2.0s infinite linear
}

#pageloader.animate .dot1,
#pageloader.animate .dot2 {
    width: 60%;
    height: 60%;
    display: inline-block;
    position: absolute;
    top: 0;
    background-color: #89ABE3;
    border-radius: 100%;
    animation: loaderbounce 2.0s infinite ease-in-out
}

#pageloader.animate .dot2 {
    top: auto;
    bottom: 0px;
    animation-delay: -1.0s;
    background-color: #f22c39
}

.search-box {
    background-color: #fff;
    border: 1px solid #d8d8d8;
    border-radius: 4px;
    padding: 0 30px
}

.search-box .search-container {
    position: relative;
    box-sizing: border-box;
    border-bottom: 1px solid #d8d8d8;
    padding: 16px 0;
    zoom: 1
}

.search-box .search-container:before,
.search-box .search-container:after {
    display: block;
    height: 0;
    visibility: hidden;
    content: "\0020"
}

.search-box .search-container:after {
    clear: both
}

.search-box .search-container-box {
    float: left;
    width: 50%;
    zoom: 1
}

.search-box .search-container-box:before,
.search-box .search-container-box:after {
    display: block;
    height: 0;
    visibility: hidden;
    content: "\0020"
}

.search-box .search-container-box:after {
    clear: both
}

.search-box .search-container-box.search-container-box-fullwidth {
    width: 100%
}

.search-box .search-container-box.search-container-box-email,
.search-box .search-container-box.search-container-box-id {
    width: 100%
}

.search-box .search-detail {
    position: absolute;
    transform-origin: 0 0;
    opacity: 0;
    visibility: hidden;
    transform: scale(1, 0);
    transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1)
}

.search-box .search-detail.is-opened {
    position: relative;
    visibility: visible;
    opacity: 1;
    transform: scale(1, 1)
}

.search-box .search-title {
    font-size: 1.4rem;
    width: 14rem;
    height: 100%;
    float: left;
    padding-top: 2px;
    font-weight: bold;
    color: #6A6B6D
}

.search-box .search-condition {
    zoom: 1;
    font-size: 1.3rem;
    line-height: 2;
    width: calc(100% - 14rem);
    float: left
}

.search-box .search-condition:before,
.search-box .search-condition:after {
    display: block;
    height: 0;
    visibility: hidden;
    content: "\0020"
}

.search-box .search-condition:after {
    clear: both
}

.search-box .search-condition p {
    font-size: 1.3rem;
    margin-bottom: 10px
}

.search-box .search-condition .md-textfield {
    margin: 0
}

.search-box .search-condition .display-condition {
    text-align: left
}

.search-box .search-container-box-radio-all {
    width: 14rem
}

.search-box .show-search-form {
    width: 14rem
}

.search-box .search-container-box-radio {
    width: calc((100% - 28rem)/3)
}

.search-box .search-container-box-radio .search-condition,
.search-box .search-container-box-radio-all .search-condition {
    width: 3rem
}

.search-box .search-container-box-radio .search-title,
.search-box .search-container-box-radio-all .search-title {
    width: calc(100% - 3rem)
}

.search-box .search-condition-set {
    display: inline-block
}

.search-box .search-condition-set:focus,
.search-box .search-condition-set:active {
    outline: 0
}

.search-box .search-condition-set .material-icons {
    color: #9A9B9D;
    font-size: 1.6rem;
    line-height: 1.2em;
    margin: 0 4px 0 0;
    vertical-align: middle
}

.search-box .search-condition-keyword {
    width: 70%;
    float: left
}

.search-box .search-condition-keyword.search-condition-keyword-email,
.search-box .search-condition-keyword.search-condition-keyword-id {
    width: 100%
}

.search-box .search-condition-language {
    width: 25%;
    float: right
}

.search-box .search-option {
    padding-top: 20px
}

.search-box .search-init {
    position: relative;
    padding: 20px 0
}

.search-box .search-init .search-detail-open {
    position: absolute;
    top: 24px;
    right: 0px
}

.search-box .search-init .search-detail-open .material-icons {
    font-size: 2.0rem;
    vertical-align: middle;
    margin: 0 5px 0 0
}

.search-box .search-init .search-detail-close {
    display: none;
    position: absolute;
    top: 24px;
    right: 0px
}

.search-box .search-init .search-detail-close::before {
    content: "remove_circle_outline";
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    position: absolute;
    left: -24px;
    font-size: 2.0rem
}

.search-box .search-init .button {
    margin: 0 auto
}

.search-box .md-checkbox,
.search-box .md-radio {
    display: inline-block;
    margin-right: 20px
}

.search-box .md-checkbox:last-child,
.search-box .md-radio:last-child {
    margin-right: 0
}

.search-box-wrapper .search-condition-set {
    height: auto;
    width: fit-content;
    display: flex;
    align-items: center;
    padding: 0 10px
}

.search-box-wrapper .search-condition-set.button-outline:hover {
    background-color: #89ABE3
}

.search-box-wrapper .search-condition-set.button-outline:hover .material-icons {
    color: #fff
}

.search-box-wrapper .search-condition-set .material-icons {
    color: #3A50C9;
    font-size: 2.4rem
}

.search-box-wrapper .search-container-wrap .search-container-box-radio {
    width: 16rem
}

.search-box-wrapper .search-container-wrap .search-condition {
    width: 100% !important
}

.search-box-wrapper .search-container-wrap .search-internship {
    width: 19rem
}

@media only screen and (max-width: 767px) {
    .search-box-wrapper .search-company-filter {
        display: block
    }

    .search-box-wrapper .show-search-form {
        float: right !important;
        margin-top: 10px;
        padding: 0 !important;
        width: auto
    }

    .search-box-wrapper .search-container-wrap {
        width: 100% !important
    }

    .search-box-wrapper .search-container-wrap .search-container-box {
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        width: 25% !important
    }
}

.candidate-apply-date-box {
    width: 300px;
    display: flex
}

.candidate-apply-date-box .md-textfield-input {
    width: calc(100% - 26px)
}

.candidate-apply-date-box .candidate-apply-date-from {
    margin-right: 20px
}

.candidate-apply-date-box .candidate-apply-date-to {
    margin-left: 20px
}

.candidate-apply-date-box .candidate-apply-date-from,
.candidate-apply-date-box .candidate-apply-date-to {
    width: 100%;
    position: relative
}

.candidate-apply-date-box .candidate-apply-date-from .dropdown-menu-left,
.candidate-apply-date-box .candidate-apply-date-to .dropdown-menu-left {
    right: 25px;
    left: auto !important;
    top: auto !important;
    bottom: 0
}

.candidate-apply-date-box .candidate-apply-date-from .dropdown-menu-left .material-icons,
.candidate-apply-date-box .candidate-apply-date-to .dropdown-menu-left .material-icons {
    cursor: pointer
}

.candidate-apply-date-box input:focus {
    outline: none;
    border-color: #89ABE3;
    border-width: 2px
}

.box-offset {
    position: relative
}

.box-offset.is-medium {
    padding-left: 240px
}

.box-offset .is-absolute {
    position: absolute;
    left: 0
}

.box-style-1 {
    position: relative;
    padding: 20px
}

.box-style-1 dt,
.box-style-1 dd {
    padding: 5px 0
}

.box-style-1 dt {
    width: 70px
}

.box-style-1 dt:after {
    content: ':';
    float: right
}

.box-style-1 dd {
    padding-left: 10px;
    width: calc(100% - 70px);
    box-sizing: border-box
}

.box-style-1+.box-style-1 {
    padding-top: 0
}

.box-style-1+.box-style-1 .cf-job-name {
    padding-top: 20px;
    border-top: 1px solid #d8d8d8
}

@media only screen and (max-width: 480px) {
    .page-top {
        overflow-x: hidden
    }
}

.page-top .top-wrapper {
    padding: 0 15px 30px
}

.page-top .top-wrapper-left {
    float: left
}

.page-top .top-wrapper-right {
    float: right
}

.page-top .top-main {
    width: 100%;
    background: url(/assets/main-visual-24deebc6fde137bcf5a64eeb24436d11e65121a28da64b88da73d390de8680ad.png) center center no-repeat;
    background-size: cover
}

.page-top .top-main .top-wrapper {
    width: 100%;
    max-width: 1010px
}

.page-top .top-main h2 {
    width: 450px;
    color: #fff;
    font-size: 3.2rem;
    line-height: 1.6;
    margin-bottom: 50px
}

@media only screen and (max-width: 599px) {
    .page-top .top-main h2 {
        font-size: 1.8rem;
        margin: 0;
        padding: 20px
    }
}

.page-top .top-main .button {
    width: 280px;
    height: 42px;
    line-height: 28px;
    color: #fff;
    background-color: #3A50C9;
    font-size: 1.4rem;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s;
    box-shadow: 0px 3px 0px rgba(0, 0, 0, 0.3)
}

.page-top .top-main .button:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.page-top .top-main .button:hover,
.page-top .top-main .button:focus,
.page-top .top-main .button:active {
    color: #fff
}

.page-top .top-main .button::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -116px;
    left: 0px;
    border-radius: 100%;
    background-color: rgba(255, 255, 255, 0.3);
    width: 280px;
    height: 280px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

@media only screen and (max-width: 599px) {
    .page-top .top-main .button {
        width: 220px;
        height: 36px;
        margin: 40px 20px 0 20px
    }
}

.page-top .top-main .top-wrapper {
    padding: 70px 15px 105px
}

@media only screen and (max-width: 599px) {
    .page-top .top-main .top-wrapper {
        height: 200px;
        padding: 0
    }
}

@media only screen and (max-width: 599px) {
    .page-top .heading-style-01 {
        font-size: 1.6rem
    }
}

@media only screen and (max-width: 599px) {
    .page-top .heading-style-02 {
        font-size: 1.4rem
    }
}

.page-top .top-nav {
    position: relative;
    width: 100%;
    clear: both;
    background-color: rgba(192, 192, 192, 0.3)
}

@media only screen and (min-width: 768px) {
    .page-top .top-nav {
        top: -90px
    }
}

.page-top .top-nav .top-nav-button {
    max-width: 1180px;
    margin: 10px auto;
    display: flex;
    justify-content: space-between
}

@media only screen and (max-width: 767px) {
    .page-top .top-nav .top-nav-button {
        display: block;
        padding: 0 20px;
        margin: 0 auto 10px;
        width: 100%;
        float: left
    }
}

.page-top .top-nav .top-nav-button li {
    background-color: #fff;
    border-style: solid;
    border-width: 0.5px;
    list-style: none;
    width: 100%;
    margin: 0 10px
}

@media only screen and (max-width: 767px) {
    .page-top .top-nav .top-nav-button li {
        margin: 10px 0 0 0
    }
}

@media only screen and (min-width: 480px) and (max-width: 767px) {
    .page-top .top-nav .top-nav-button li {
        width: 48%;
        margin-right: 4%;
        float: left
    }

    .page-top .top-nav .top-nav-button li:nth-child(2n) {
        margin-right: 0
    }
}

.page-top .top-nav .top-nav-button li a {
    display: flex;
    border: 1px solid #6A6B6D;
    color: #000;
    width: 100%;
    height: 100%;
    padding: 10px 10px 10px 60px;
    align-items: center;
    position: relative;
    box-sizing: border-box;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out
}

@media only screen and (max-width: 1022px) {
    .page-top .top-nav .top-nav-button li a {
        font-size: 1.2rem;
        padding: 5px 10px 5px 40px
    }

    .page-top .top-nav .top-nav-button li a br {
        display: none
    }
}

@media only screen and (max-width: 767px) {
    .page-top .top-nav .top-nav-button li a {
        display: block;
        min-height: initial
    }
}

.page-top .top-nav .top-nav-button li a:hover {
    background-color: #89ABE3;
    color: #fff;
    border: 1px solid #89ABE3
}

.page-top .top-nav .top-nav-button li a:hover::before {
    left: 30px
}

@media only screen and (max-width: 767px) {
    .page-top .top-nav .top-nav-button li a:hover::before {
        left: 24px
    }
}

.page-top .top-nav .top-nav-button li a::before {
    -webkit-transition: left 0.2s ease-in-out;
    -o-transition: left 0.2s ease-in-out;
    transition: left 0.2s ease-in-out;
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    content: "keyboard_arrow_right";
    position: absolute;
    font-size: 2.0rem;
    top: 50%;
    left: 20px;
    margin-top: -0.5em
}

.page-top .top-logo {
    padding: 60px 15px 0
}

@media only screen and (max-width: 599px) {
    .page-top .top-logo {
        padding: 40px 0
    }
}

@media only screen and (max-width: 599px) {
    .page-top .top-logo .company-describe {
        padding: 0 15px 60px
    }
}

.page-top .top-logo .button {
    width: 325px;
    max-width: 100%;
    height: 42px;
    margin: 30px auto 0 auto;
    line-height: 28px;
    color: #3A50C9;
    border: 1px solid #3A50C9;
    font-size: 1.4rem;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s
}

.page-top .top-logo .button:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.page-top .top-logo .button:hover,
.page-top .top-logo .button:focus,
.page-top .top-logo .button:active {
    color: #fff
}

.page-top .top-logo .button::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -116px;
    left: 0px;
    border-radius: 100%;
    background-color: #3A50C9;
    width: 280px;
    height: 280px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

@media only screen and (max-width: 599px) {
    .page-top .top-logo .button {
        font-size: 1.2rem
    }
}

.page-top .top-logo-news {
    text-align: left;
    margin: -20px auto 20px;
    clear: both;
    width: 100%
}

.page-top .top-logo-news .top-wrapper {
    padding-bottom: 0;
    display: flex;
    align-items: center
}

.page-top .top-logo-news .top-wrapper h2 {
    padding: 0;
    margin: 0
}

@media only screen and (max-width: 767px) {
    .page-top .top-logo-news .top-wrapper-right {
        width: 100%
    }
}

@media only screen and (min-width: 768px) {
    .page-top .top-logo-news .top-wrapper-right {
        width: calc(100% - 270px)
    }
}

.page-top .top-logo-news .top-wrapper-right .notification p {
    margin: 0;
    text-indent: -24px;
    padding-left: 24px;
    font-size: 1.4rem
}

.page-top .top-logo-news .top-wrapper-right .notification p::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    content: "notifications_none";
    font-size: 2.0rem;
    color: #3A50C9;
    top: 5px;
    text-indent: 0px
}

.page-top .top-logo-news .top-wrapper-right a.notification-toggle {
    cursor: pointer;
    margin-left: 5px
}

.page-top .top-logo-news .top-wrapper-right a.notification-toggle ins {
    text-decoration: none
}

.page-top .top-logo-news .top-wrapper-right a.notification-toggle.active span {
    transform: scaleY(-100%)
}

.page-top .top-logo-news h2 {
    float: left;
    margin-top: 20px;
    margin-left: 15px;
    padding: 0 30px;
    color: #3b55cd;
    font-weight: bold
}

@media only screen and (max-width: 767px) {
    .page-top .top-logo-news h2 {
        width: 100%;
        text-align: center
    }
}

@media only screen and (min-width: 768px) {
    .page-top .top-logo-news h2 {
        width: 250px
    }
}

.page-top .top-logo-banner {
    clear: both;
    width: 100%
}

@media only screen and (max-width: 480px) {
    .page-top .top-logo-banner .top-wrapper {
        padding: 10px 15px 20px
    }
}

.page-top .top-logo-banner .top-banner-container {
    width: 100%;
    float: left
}

@media only screen and (min-width: 481px) {
    .page-top .top-logo-banner .top-banner-container {
        display: table;
        align-items: center
    }
}

.page-top .top-logo-banner .top-banner-container .row {
    margin: 0
}

@media only screen and (max-width: 480px) {
    .page-top .top-logo-banner .top-banner-container .row:nth-child(2n) {
        margin-top: 10px
    }
}

.page-top .top-logo-banner .top-banner-container li.banners-list {
    float: left
}

.page-top .top-logo-banner .top-banner-container li {
    list-style: none;
    display: inline-block;
    text-align: center
}

@media only screen and (min-width: 481px) {
    .page-top .top-logo-banner .top-banner-container li {
        width: 32%;
        margin-right: 2%;
        margin-bottom: 2%
    }
}

@media only screen and (max-width: 480px) {
    .page-top .top-logo-banner .top-banner-container li {
        margin-bottom: 10px
    }

    .page-top .top-logo-banner .top-banner-container li:last-child {
        margin-bottom: 0
    }
}

.page-top .top-logo-banner .top-banner-container li:nth-child(3n) {
    margin-right: 0
}

.page-top .top-logo-banner .top-banner-container li a {
    display: block
}

.page-top .top-logo-banner .top-banner-container li img {
    min-width: 100%;
    max-width: 100%
}

.page-top .top-logo-container {
    max-width: 1180px;
    margin: 0 auto;
    list-style: none;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap
}

.page-top .top-logo-container li {
    width: 12.5%;
    height: 84px;
    box-sizing: border-box;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center
}

@media only screen and (max-width: 991px) {
    .page-top .top-logo-container li {
        width: 20%
    }
}

@media only screen and (max-width: 599px) {
    .page-top .top-logo-container li {
        width: 25%
    }
}

@media only screen and (max-width: 599px) {
    .page-top .top-logo-container img {
        width: 100%;
        height: auto
    }
}

.page-top .top-venue {
    width: 100%;
    clear: both;
    margin-bottom: 30px
}

.page-top .top-venue .top-wrapper {
    position: relative;
    padding-top: 0;
    padding-bottom: 0
}

.page-top .top-venue .top-venue-container {
    background: url(/assets/bg-top-venue-a32bd16d597205b1e970a384c5c8fc31d246edb3718c2ba65e3748a7f0a193df.jpg) center center no-repeat;
    background-size: cover
}

@media only screen and (min-width: 1023px) {
    .page-top .top-venue .top-venue-container {
        padding: 0 0 30px
    }
}

@media only screen and (max-width: 1022px) {
    .page-top .top-venue .top-venue-container {
        padding: 0 0 100px
    }
}

@media only screen and (max-width: 599px) {
    .page-top .top-venue .top-venue-container {
        padding: 0 0 160px
    }
}

.page-top .top-venue .top-venue-container .heading-style-01 {
    font-size: 25px;
    font-weight: bold;
    padding: 0;
    margin: 0
}

.page-top .top-venue .top-venue-container .heading-style-01::before {
    left: calc(50% - 140px);
    top: 25px;
    width: 280px
}

@media only screen and (max-width: 599px) {
    .page-top .top-venue .top-venue-container .heading-style-01::before {
        width: 265px;
        left: calc(50% - 132px)
    }
}

.page-top .top-venue .button {
    width: 300px;
    height: 42px;
    margin: 20px auto;
    line-height: 28px;
    color: #3A50C9;
    border: 1px solid #3A50C9;
    font-size: 1.4rem;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s
}

.page-top .top-venue .button:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.page-top .top-venue .button:hover,
.page-top .top-venue .button:focus,
.page-top .top-venue .button:active {
    color: #fff
}

.page-top .top-venue .button::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -116px;
    left: 0px;
    border-radius: 100%;
    background-color: #3A50C9;
    width: 280px;
    height: 280px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

@media only screen and (max-width: 599px) {
    .page-top .top-venue .button {
        font-size: 1.2rem
    }
}

.page-top .top-venue-map {
    position: relative;
    max-width: 1180px;
    height: 540px;
    margin: 0 auto;
    background: url(/assets/top-map-5b6bbf329031017c10f2857ee03c5cdf26f1bb0ebfdaaa8150dea2dc0c04d757.png) no-repeat
}

@media only screen and (max-width: 1240px) {
    .page-top .top-venue-map {
        width: 992px;
        background-size: contain;
        height: 450px
    }
}

@media only screen and (max-width: 1022px) {
    .page-top .top-venue-map {
        width: auto;
        height: auto;
        padding: 15px 5px
    }
}

.page-top .top-venue-map li {
    position: absolute;
    list-style: none
}

@media only screen and (max-width: 1022px) {
    .page-top .top-venue-map li {
        position: static;
        width: 33.3333%;
        float: left
    }
}

@media only screen and (max-width: 599px) {
    .page-top .top-venue-map li {
        width: 50%
    }
}

@media only screen and (max-width: 1022px) {
    .page-top .top-venue-map li {
        padding: 0 10px
    }
}

@media only screen and (max-width: 319px) {
    .page-top .top-venue-map li {
        width: 100%
    }
}

@media only screen and (max-width: 1022px) {
    .page-top .top-venue-map li a {
        position: relative
    }
}

.page-top .top-venue-map li a span.before-organize {
    color: #3A50C9;
    border-color: #3A50C9
}

.page-top .top-venue-map li a span.before-organize:hover {
    color: #fff;
    background: #3A50C9
}

.page-top .top-venue-map li a span.after-organize {
    color: #000;
    border-color: #6A6B6D
}

.page-top .top-venue-map li a span.after-organize:hover {
    color: #fff;
    background: #6A6B6D
}

.page-top .top-venue-map li a {
    position: absolute;
    display: block;
    text-decoration: none
}

@media only screen and (max-width: 1022px) {
    .page-top .top-venue-map li a {
        position: relative
    }
}

.page-top .top-venue-map li a::before {
    position: absolute;
    display: block;
    content: "";
    top: -14px;
    left: -14px;
    width: 12px;
    height: 12px;
    background: #DD0E1B;
    border-radius: 12px
}

@media only screen and (max-width: 1022px) {
    .page-top .top-venue-map li a::before {
        display: none
    }
}

.page-top .top-venue-map li a::after {
    position: absolute;
    display: block;
    content: "";
    top: -18px;
    left: -18px;
    width: 20px;
    height: 20px;
    background: #DD0E1B;
    border-radius: 20px;
    opacity: 0.3;
    -webkit-transition: all 0.2s;
    transition: all 0.2s
}

@media only screen and (max-width: 1022px) {
    .page-top .top-venue-map li a::after {
        display: none
    }
}

.page-top .top-venue-map li a:hover::after,
.page-top .top-venue-map li a:focus::after,
.page-top .top-venue-map li a:active::after {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 0
}

.page-top .top-venue-map li span {
    position: relative;
    display: block;
    color: #DD0E1B;
    border: 1px solid #DD0E1B;
    font-size: 1.1rem;
    padding: 1px 0px;
    width: 60px;
    text-align: center
}

@media only screen and (max-width: 1022px) {
    .page-top .top-venue-map li span {
        min-width: 100%;
        margin-bottom: 2px;
        min-height: 30px;
        line-height: 30px;
        font-size: 1rem
    }
}

.page-top .top-venue-map .tokyo {
    top: 228px;
    left: 968px
}

@media only screen and (max-width: 1240px) {
    .page-top .top-venue-map .tokyo {
        top: 189px;
        left: 807px
    }
}

.page-top .top-venue-map .tokyo a::before {
    top: 3px;
    left: -18px
}

.page-top .top-venue-map .tokyo a::after {
    top: -1px;
    left: -22px
}

.page-top .top-venue-map .tokyo span {
    margin-bottom: 2px
}

@media only screen and (min-width: 481px) {
    .page-top .top-venue-map .tokyo span {
        width: 140px
    }
}

@media only screen and (max-width: 480px) {
    .page-top .top-venue-map .tokyo span {
        min-width: 108px
    }
}

.page-top .top-venue-map .osaka {
    top: 252px;
    left: 872px
}

.page-top .top-venue-map .hongkong {
    top: 288px;
    left: 780px
}

.page-top .top-venue-map .hongkong a::before {
    top: -14px;
    bottom: auto;
    left: auto;
    right: -14px
}

.page-top .top-venue-map .hongkong a::after {
    top: -18px;
    bottom: auto;
    left: auto;
    right: -18px
}

@media only screen and (max-width: 1240px) {
    .page-top .top-venue-map .hongkong {
        top: 242px;
        left: 635px
    }
}

.page-top .top-venue-map .hongkong span {
    width: 72px
}

.page-top .top-venue-map .shanghai {
    top: 248px;
    left: 826px
}

@media only screen and (max-width: 1240px) {
    .page-top .top-venue-map .shanghai {
        top: 204px;
        left: 676px
    }
}

.page-top .top-venue-map .shanghai a::before {
    top: auto;
    bottom: 3px;
    left: auto;
    right: -18px
}

.page-top .top-venue-map .shanghai a::after {
    top: auto;
    bottom: -1px;
    left: auto;
    right: -22px
}

.page-top .top-venue-map .seoul {
    top: 202px;
    left: 932px
}

.page-top .top-venue-map .seoul a::before {
    top: auto;
    bottom: -14px;
    left: -14px;
    right: auto
}

.page-top .top-venue-map .seoul a::after {
    top: auto;
    bottom: -18px;
    left: -18px;
    right: auto
}

@media only screen and (max-width: 1240px) {
    .page-top .top-venue-map .seoul {
        top: 163px;
        left: 778px
    }
}

.page-top .top-venue-map .taiwan {
    top: 292px;
    left: 886px
}

@media only screen and (max-width: 1240px) {
    .page-top .top-venue-map .taiwan {
        top: 245px;
        left: 729px
    }
}

.page-top .top-venue-map .taiwan a::before {
    top: -18px;
    bottom: auto;
    left: 14px;
    right: auto
}

.page-top .top-venue-map .taiwan a::after {
    top: -22px;
    bottom: auto;
    left: 10px;
    right: auto
}

.page-top .top-venue-map .singapore {
    top: 347px;
    left: 788px
}

.page-top .top-venue-map .singapore a::before {
    top: -14px;
    bottom: auto;
    left: auto;
    right: -14px
}

.page-top .top-venue-map .singapore a::after {
    top: -18px;
    bottom: auto;
    left: auto;
    right: -18px
}

@media only screen and (max-width: 1240px) {
    .page-top .top-venue-map .singapore {
        top: 290px;
        left: 644px
    }
}

.page-top .top-venue-map .beijing {
    top: 206px;
    left: 824px
}

.page-top .top-venue-map .beijing a::before {
    top: auto;
    bottom: -14px;
    left: auto;
    right: -14px
}

.page-top .top-venue-map .beijing a::after {
    top: auto;
    bottom: -18px;
    left: auto;
    right: -18px
}

@media only screen and (max-width: 1240px) {
    .page-top .top-venue-map .beijing {
        top: 167px;
        left: 674px
    }
}

.page-top .top-venue-map .sydney {
    top: 440px;
    left: 1000px
}

@media only screen and (max-width: 1240px) {
    .page-top .top-venue-map .sydney {
        top: 370px;
        left: 758px
    }

    .page-top .top-venue-map .sydney a::before {
        top: -14px;
        bottom: auto;
        left: auto;
        right: -14px
    }

    .page-top .top-venue-map .sydney a::after {
        top: -18px;
        bottom: auto;
        left: auto;
        right: -18px
    }
}

.page-top .top-venue-map .london {
    top: 190px;
    left: 568px
}

@media only screen and (max-width: 1240px) {
    .page-top .top-venue-map .london {
        top: 158px;
        left: 473px
    }
}

.page-top .top-venue-map .boston {
    top: 182px;
    left: 379px
}

.page-top .top-venue-map .boston a::before {
    top: auto;
    bottom: -14px;
    left: -14px;
    right: auto
}

.page-top .top-venue-map .boston a::after {
    top: auto;
    bottom: -18px;
    left: -18px;
    right: auto
}

@media only screen and (max-width: 1240px) {
    .page-top .top-venue-map .boston {
        top: 150px;
        left: 315px
    }
}

.page-top .top-venue-map .newyork {
    top: 238px;
    left: 359px
}

.page-top .top-venue-map .newyork a::before {
    top: -14px;
    bottom: auto;
    left: -14px;
    right: auto
}

.page-top .top-venue-map .newyork a::after {
    top: -18px;
    bottom: auto;
    left: -18px;
    right: auto
}

@media only screen and (max-width: 1240px) {
    .page-top .top-venue-map .newyork {
        top: 200px;
        left: 300px
    }
}

.page-top .top-venue-map .seattle {
    top: 161px;
    left: 147px
}

.page-top .top-venue-map .seattle a::before {
    top: auto;
    bottom: -14px;
    left: auto;
    right: -14px
}

.page-top .top-venue-map .seattle a::after {
    top: auto;
    bottom: -18px;
    left: auto;
    right: -18px
}

@media only screen and (max-width: 1240px) {
    .page-top .top-venue-map .seattle {
        top: 132px;
        left: 110px
    }
}

.page-top .top-venue-map .losangels,
.page-top .top-venue-map .new_losangels {
    top: 258px;
    left: 145px
}

.page-top .top-venue-map .losangels a::before,
.page-top .top-venue-map .new_losangels a::before {
    top: -14px;
    bottom: auto;
    left: auto;
    right: -14px
}

.page-top .top-venue-map .losangels a::after,
.page-top .top-venue-map .new_losangels a::after {
    top: -18px;
    bottom: auto;
    left: auto;
    right: -18px
}

@media only screen and (max-width: 1240px) {

    .page-top .top-venue-map .losangels,
    .page-top .top-venue-map .new_losangels {
        top: 215px;
        left: 105px
    }
}

.page-top .top-venue-map .losangels span,
.page-top .top-venue-map .new_losangels span {
    width: 84px
}

.page-top .top-venue-map .accounting {
    top: 258px;
    left: 145px
}

.page-top .top-venue-map .accounting a::before {
    top: -14px;
    bottom: auto;
    left: auto;
    right: -14px
}

.page-top .top-venue-map .accounting a::after {
    top: -18px;
    bottom: auto;
    left: auto;
    right: -18px
}

@media only screen and (max-width: 1240px) {
    .page-top .top-venue-map .accounting {
        top: 215px;
        left: 105px
    }
}

.page-top .top-venue-map .accounting span {
    width: 84px
}

.page-top .top-venue-map .sanfrancisco {
    top: 212px;
    left: 114px
}

.page-top .top-venue-map .sanfrancisco a::before {
    top: auto;
    bottom: -14px;
    left: auto;
    right: -14px
}

.page-top .top-venue-map .sanfrancisco a::after {
    top: auto;
    bottom: -18px;
    left: auto;
    right: -18px
}

@media only screen and (max-width: 1240px) {
    .page-top .top-venue-map .sanfrancisco {
        top: 176px;
        left: 85px
    }
}

.page-top .top-venue-map .sanfrancisco span {
    width: 80px
}

.page-top .top-venue-map .sanfrancisco a::before {
    top: auto;
    bottom: 3px;
    left: auto;
    right: -18px
}

.page-top .top-venue-map .sanfrancisco a::after {
    top: auto;
    bottom: -1px;
    left: auto;
    right: -22px
}

.page-top .top-venue-info {
    transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
    position: absolute;
    z-index: 1;
    opacity: 0;
    width: 520px;
    height: 280px;
    padding: 0;
    top: 280px;
    background-color: #fff;
    position: absolute;
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.3);
    transform: scale(0.2, 0.2)
}

@media only screen and (max-width: 599px) {
    .page-top .top-venue-info {
        width: 92%;
        height: 420px;
        top: 20px;
        left: 4%
    }
}

.page-top .top-venue-info .button {
    width: 180px;
    height: 32px;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s
}

.page-top .top-venue-info .button:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.page-top .top-venue-info .button:hover,
.page-top .top-venue-info .button:focus,
.page-top .top-venue-info .button:active {
    color: #fff
}

.page-top .top-venue-info .button::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -74px;
    left: 0px;
    border-radius: 100%;
    background-color: #3A50C9;
    width: 180px;
    height: 180px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

.page-top .top-venue-info .button-close {
    position: absolute;
    display: block;
    color: #fff;
    font-size: 2.0rem;
    top: 8px;
    right: 8px;
    font-family: 'Material Icons';
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-feature-settings: 'liga';
    font-feature-settings: 'liga';
    border: 1px solid #fff;
    line-height: 1;
    padding: 2px
}

.page-top .top-venue-info .grid-information {
    padding: 5px 20px;
    overflow-y: auto;
    overflow-x: hidden;
    max-height: 165px
}

@media only screen and (max-width: 1022px) {
    .page-top .top-venue-info .grid-information {
        display: block
    }

    .page-top .top-venue-info .grid-information dt {
        border: none;
        padding: none
    }

    .page-top .top-venue-info .grid-information dt::after,
    .page-top .top-venue-info .grid-information dt::before {
        display: none
    }

    .page-top .top-venue-info .grid-information dd {
        width: 100%;
        padding: 0 0 8px 0;
        margin-bottom: 10px;
        border-bottom: 1px solid #d8d8d8
    }
}

.page-top .top-venue-info dt {
    width: 8em
}

.page-top .top-venue-info dd {
    width: calc(100% - 8em);
    word-break: break-all
}

.page-top .top-venue-info .top-venue-info-title {
    background-color: #3A50C9;
    padding: 8px 0;
    margin: 0 0 20px 0;
    padding: 10px 20px;
    color: #fff
}

.page-top .top-venue-info .top-venue-info-title:first-child {
    margin-top: 0
}

.page-top .top-venue-info .top-venue-info-title a {
    color: #000
}

.page-top .top-venue-info .top-venue-info-title a:hover {
    color: #89ABE3
}

.page-top .top-venue-info.is-closed {
    visibility: hidden
}

.page-top .top-venue-info.is-opened {
    visibility: visible;
    transform: scale(1, 1);
    opacity: 1
}

.page-top .top-nav-two {
    width: 100%;
    clear: both;
    position: absolute;
    bottom: 0px;
    left: 0;
    right: 0
}

.page-top .top-nav-two .top-nav-container {
    background-color: rgba(0, 0, 0, 0.2);
    padding: 10px 0;
    margin-left: 15px;
    margin-right: 15px
}

.page-top .top-nav-two .top-nav-container ul {
    display: flex;
    justify-content: space-between;
    max-width: 1010px;
    width: 100%;
    margin: 0 auto;
    padding: 10px 15px
}

@media only screen and (max-width: 599px) {
    .page-top .top-nav-two .top-nav-container ul {
        flex-direction: column;
        padding: 5px 15px
    }
}

@media only screen and (min-width: 992px) {
    .page-top .top-nav-two .top-nav-container .text-links a {
        line-height: 1.8
    }
}

@media only screen and (max-width: 991px) {
    .page-top .top-nav-two .top-nav-container .text-links a {
        font-size: 1.2rem;
        line-height: 2
    }
}

@media only screen and (max-width: 767px) {
    .page-top .top-nav-two .top-nav-container .text-links a {
        font-size: 1rem
    }
}

.page-top .top-nav-two .top-nav-container .text-links a:hover {
    background-color: #3A50C9;
    color: #fff
}

.page-top .top-nav-two .top-nav-container .img-links .logo-nav-img-hover {
    display: none
}

.page-top .top-nav-two .top-nav-container .img-links a {
    transition: all 0.3s
}

.page-top .top-nav-two .top-nav-container .img-links a:hover {
    background-color: #3A50C9;
    transition: all 0.3s
}

.page-top .top-nav-two .top-nav-container .img-links a:hover .logo-nav-img {
    display: none
}

.page-top .top-nav-two .top-nav-container .img-links a:hover .logo-nav-img-hover {
    display: block
}

.page-top .top-nav-two .top-nav-container li {
    width: 100%;
    list-style: none
}

@media only screen and (min-width: 768px) {
    .page-top .top-nav-two .top-nav-container li {
        margin: 0 20px
    }
}

@media only screen and (max-width: 767px) {
    .page-top .top-nav-two .top-nav-container li {
        margin-right: 20px
    }

    .page-top .top-nav-two .top-nav-container li:last-child {
        margin-right: 0
    }
}

@media only screen and (max-width: 599px) {
    .page-top .top-nav-two .top-nav-container li {
        margin-bottom: 5px
    }
}

.page-top .top-nav-two .top-nav-container li a {
    padding: 6px 10px;
    display: block;
    text-align: center;
    border: 1px solid #3A50C9;
    border-radius: 5px;
    background-color: #fff;
    width: 100%;
    float: left;
    height: 100%
}

@media only screen and (max-width: 767px) {
    .page-top .top-nav-two .top-nav-container li a {
        min-height: 30px
    }
}

.page-top .top-nav-two .top-nav-container li img {
    width: auto;
    max-width: 180px;
    display: inline-block;
    vertical-align: sub
}

.page-top .top-about {
    clear: both;
    width: 100%
}

@media only screen and (max-width: 767px) {
    .page-top .top-about {
        padding: 0 15px
    }
}

@media only screen and (max-width: 767px) {
    .page-top .top-about .top-wrapper {
        margin: 0 -15px
    }
}

@media only screen and (min-width: 768px) {
    .page-top .top-about .top-about-container {
        display: flex
    }
}

.page-top .top-about .top-about-container p {
    font-size: 1.4rem;
    color: #000
}

.page-top .top-about .heading-style-01 {
    padding-bottom: 2px;
    margin-bottom: 20px
}

.page-top .top-about .top-wrapper-left .heading-style-01::before {
    width: 215px;
    left: calc(50% - 110px)
}

.page-top .top-about .top-wrapper-right .heading-style-01::before {
    width: 270px;
    left: calc(50% - 140px)
}

.page-top .top-about .top-wrapper-left,
.page-top .top-about .top-wrapper-right {
    background-color: #F5F9FA;
    padding: 30px 20px 90px;
    position: relative
}

@media only screen and (min-width: 1241px) {

    .page-top .top-about .top-wrapper-left,
    .page-top .top-about .top-wrapper-right {
        width: 48%
    }
}

@media only screen and (max-width: 1240px) {

    .page-top .top-about .top-wrapper-left,
    .page-top .top-about .top-wrapper-right {
        width: 49%;
        padding: 20px 15px 90px
    }
}

@media only screen and (max-width: 767px) {

    .page-top .top-about .top-wrapper-left,
    .page-top .top-about .top-wrapper-right {
        width: 100%;
        padding: 20px 15px 90px
    }
}

.page-top .top-about .top-wrapper-left p,
.page-top .top-about .top-wrapper-right p {
    text-align: left
}

.page-top .top-about .top-wrapper-left {
    margin-right: 4%
}

@media only screen and (max-width: 1240px) {
    .page-top .top-about .top-wrapper-left {
        margin-right: 2%
    }
}

@media only screen and (max-width: 767px) {
    .page-top .top-about .top-wrapper-left {
        margin-right: 0;
        margin-bottom: 30px
    }
}

.page-top .top-about .button {
    bottom: 50px;
    left: 0;
    right: 0;
    color: #fff;
    font-size: 1.4rem;
    margin: 0 auto;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s;
    position: absolute;
    box-shadow: 0px 3px 0px rgba(0, 0, 0, 0.3)
}

.page-top .top-about .button:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.page-top .top-about .button:hover,
.page-top .top-about .button:focus,
.page-top .top-about .button:active {
    color: #fff
}

.page-top .top-about .button::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -116px;
    left: 0px;
    border-radius: 100%;
    background-color: #89ABE3;
    width: 280px;
    height: 280px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

@media only screen and (max-width: 480px) {
    .page-top .top-about .button {
        margin: 0 auto;
        width: 90%;
        min-height: 42px
    }
}

@media only screen and (min-width: 481px) {
    .page-top .top-about .button {
        width: 280px;
        height: 42px
    }
}

.page-top .top-app {
    width: 100%;
    clear: both
}

.page-top .top-app .text-red {
    color: red !important
}

.page-top .top-app .top-wrapper {
    padding-top: 0;
    padding-bottom: 0
}

.page-top .top-app .top-wrapper .top-app-container {
    float: left;
    width: 100%;
    background-color: #F5F9FA
}

@media only screen and (min-width: 1241px) {
    .page-top .top-app .top-wrapper-left {
        width: 35%;
        padding-top: 50px;
        padding-left: 40px
    }
}

@media only screen and (max-width: 1240px) {
    .page-top .top-app .top-wrapper-left {
        width: 30%;
        padding: 0 15px
    }
}

@media only screen and (max-width: 767px) {
    .page-top .top-app .top-wrapper-left {
        width: 100%
    }
}

@media only screen and (max-width: 1240px) {
    .page-top .top-app .top-wrapper-left img {
        max-width: 100%;
        height: auto
    }
}

.page-top .top-app .top-wrapper-left p {
    text-align: center;
    margin: 0;
    line-height: 0
}

.page-top .top-app .top-wrapper-right {
    padding-top: 10px
}

@media only screen and (min-width: 768px) {
    .page-top .top-app .top-wrapper-right {
        width: 53%;
        margin-right: 4%
    }
}

@media only screen and (max-width: 1240px) {
    .page-top .top-app .top-wrapper-right {
        width: 60%;
        padding: 0 15px
    }
}

@media only screen and (max-width: 767px) {
    .page-top .top-app .top-wrapper-right {
        width: 100%
    }
}

.page-top .top-app .top-wrapper-right .top-app-heading {
    font-weight: bold;
    font-size: 2.1rem;
    margin-top: 5px;
    margin-bottom: 15px;
    color: #000
}

.page-top .top-app .top-wrapper-right p {
    font-size: 1.4rem;
    color: #000
}

.page-top .top-app .top-app-download {
    zoom: 1
}

.page-top .top-app .top-app-download:before,
.page-top .top-app .top-app-download:after {
    display: block;
    height: 0;
    visibility: hidden;
    content: "\0020"
}

.page-top .top-app .top-app-download:after {
    clear: both
}

.page-top .top-app .top-app-download p {
    float: left;
    margin-right: 20px
}

@media only screen and (max-width: 767px) {
    .page-top .top-app .top-app-download p {
        margin-right: 2%;
        max-width: 48%
    }
}

.page-top .top-app .top-app-download img {
    max-width: 100%;
    height: auto
}

.page-top .top-app .top-app-download.app-conversion-instruction img {
    width: 180px;
    height: auto
}

.page-top .top-app .top-app-download.app-conversion-instruction p {
    margin-bottom: 1em;
    float: none
}

.page-top .top-app .top-app-download.app-conversion-instruction .app-conversion-txt-wrapper {
    font-size: 75%;
    width: 180px
}

.page-top .top-app .top-app-download.app-conversion-instruction .app-conversion-txt-wrapper #old-app-txt {
    float: left
}

.page-top .top-app .top-app-download.app-conversion-instruction .app-conversion-txt-wrapper #new-app-txt {
    float: right
}

@media only screen and (max-width: 767px) {
    .page-top .top-app .top-app-download.app-conversion-instruction p {
        max-width: 100% !important
    }
}

.top-wrapper .heading-style-01 {
    color: #000
}

#user-agreement-modal .cf-button-user-agreement {
    text-align: center
}

#user-agreement-modal .button-nope,
#user-agreement-modal .button-ok {
    display: inline;
    margin-top: 20px;
    margin-left: 2%
}

#user-agreement-modal .user-agreement-form {
    display: inline-block
}

#browser-warning-modal .modal-title {
    min-height: 22px
}

#browser-warning-modal .modal-content {
    width: 645px
}

#browser-warning-modal .cf-button-browser-warning {
    text-align: center
}

#browser-warning-modal .button-ok {
    display: inline;
    margin-top: 20px;
    margin-left: 2%
}

.page-mail .sa-full-lines .sa-button-container {
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center
}

.page-mail .sa-full-lines .sa-button-container .cancel {
    -webkit-order: 2;
    order: 2
}

.page-mail .sa-full-lines .sa-button-container .sa-confirm-button-container {
    -webkit-order: 1;
    order: 1
}

@media only screen and (max-width: 767px) {
    .page-mail .contents {
        position: relative;
        overflow: hidden
    }
}

.page-mail .mail-list {
    box-sizing: border-box;
    height: 800px;
    border: 1px solid #d8d8d8;
    background-color: #fff;
    margin-top: 20px;
    overflow: auto
}

@media only screen and (max-width: 767px) {
    .page-mail .mail-list {
        height: 600px;
        margin: 0
    }
}

.page-mail .mail-list a {
    color: #000
}

.page-mail .mail-controller .cfn-tab li {
    width: 25%
}

@media only screen and (max-width: 599px) {
    .page-mail .mail-controller .cfn-tab li {
        width: 100%;
        text-align: left
    }
}

.page-mail .mail-controller .cfn-tab li a::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    font-size: 1.8rem;
    vertical-align: middle;
    margin-right: 5px
}

.page-mail .mail-controller .cfn-tab li.mail-tab-01 a::before {
    content: "mail_outline"
}

.page-mail .mail-controller .cfn-tab li.mail-tab-02 a::before {
    content: "domain"
}

.page-mail .mail-controller .cfn-tab li.mail-tab-03 a::before {
    content: "sms"
}

.page-mail .mail-controller .cfn-tab li.mail-tab-04 a::before {
    content: "domain"
}

.page-mail .mail-header {
    zoom: 1
}

.page-mail .mail-header:before,
.page-mail .mail-header:after {
    display: block;
    height: 0;
    visibility: hidden;
    content: "\0020"
}

.page-mail .mail-header:after {
    clear: both
}

.page-mail .mail-header .mail-forum {
    float: left;
    margin-right: 12px
}

.page-mail .mail-header .mail-category {
    float: left;
    color: #000;
    line-height: 1.2
}

.page-mail .mail-header .mail-date {
    float: right;
    line-height: 1.2;
    color: #000
}

.page-mail .mail-list-item {
    display: block;
    position: relative;
    padding: 15px;
    border-top: 1px solid #d8d8d8
}

.page-mail .mail-list-item.is-selected::after,
.page-mail .mail-list-item:hover::after,
.page-mail .mail-list-item:focus::after,
.page-mail .mail-list-item:active::after {
    top: 0;
    bottom: 0
}

.page-mail .mail-list-item::after {
    content: "";
    width: 3px;
    display: block;
    position: absolute;
    left: 0px;
    background-color: #89ABE3;
    z-index: 100;
    top: 50%;
    bottom: 50%;
    -webkit-transition-property: top, bottom;
    transition-property: top, bottom;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out
}

.page-mail .mail-list-item:after {
    z-index: 1
}

.page-mail .mail-list-item:first-child {
    border: 0
}

.page-mail .mail-list-item p {
    margin: 0;
    line-height: 1.5
}

.page-mail .mail-list-item .mail-sender {
    margin: 15px 0 6px 0;
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    color: #9A9B9D;
    text-overflow: ellipsis
}

.page-mail .mail-list-item .mail-title {
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    color: #9A9B9D;
    text-overflow: ellipsis
}

.page-mail .mail-list-item .job-name {
    margin: 0px 0 6px 0;
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    color: #9A9B9D;
    text-overflow: ellipsis
}

.page-mail .mail-unread .mail-sender,
.page-mail .mail-unread .mail-title,
.page-mail .mail-unread .mail-category,
.page-mail .mail-unread .mail-date,
.page-mail .mail-unread .job-name {
    font-weight: bold;
    color: #000
}

.page-mail .mail-left {
    width: 43.2%;
    float: left
}

@media only screen and (max-width: 767px) {
    .page-mail .mail-left {
        width: 100%;
        padding-top: 20px;
        max-height: 100vh
    }
}

.page-mail .mail-right {
    position: relative;
    width: 56.8%;
    float: left
}

@media only screen and (max-width: 767px) {
    .page-mail .mail-right.is-show {
        right: 0
    }
}

@media only screen and (max-width: 767px) {
    .page-mail .mail-right {
        width: calc(100% - 20px);
        position: absolute;
        bottom: 0;
        right: -100%;
        background: #fff;
        z-index: 99;
        border: 1px solid #d8d8d8;
        transition: all .3s ease 0s
    }
}

.page-mail .mail-right .mail-header {
    padding-left: 30px
}

.page-mail .mail-category span {
    display: inline-block;
    position: relative;
    padding-left: 20px
}

.page-mail .mail-category span::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    position: absolute;
    top: 0px;
    left: 0px;
    font-size: 1.6rem;
    color: #000
}

.page-mail .mail-category span.mail-category-interview::before {
    content: "sms"
}

.page-mail .mail-category span.mail-category-resume::before {
    content: "domain"
}

.page-mail .mail-category span.mail-category-seminar::before {
    content: "school"
}

.page-mail .mail-filter {
    padding-top: 20px;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: flex-end;
    justify-content: flex-end
}

@media only screen and (max-width: 599px) {
    .page-mail .mail-filter {
        display: block
    }
}

@media screen and (-ms-high-contrast: active),
(-ms-high-contrast: none) {
    .page-mail .mail-filter {
        display: block;
        zoom: 1
    }

    .page-mail .mail-filter:before,
    .page-mail .mail-filter:after {
        display: block;
        height: 0;
        visibility: hidden;
        content: "\0020"
    }

    .page-mail .mail-filter:after {
        clear: both
    }
}

.page-mail .mail-content {
    box-sizing: border-box;
    height: 800px;
    border: 1px solid #d8d8d8;
    border-left: none;
    background-color: #fff;
    margin-top: 20px;
    overflow: auto;
    padding: 15px
}

@media only screen and (max-width: 767px) {
    .page-mail .mail-content {
        border: 0;
        height: 100%;
        margin: 0
    }

    .page-mail .mail-content>div {
        height: 100%
    }
}

.page-mail .mail-content .mail-content-tab {
    line-height: 0px
}

.page-mail .mail-content .message-bookmark-button {
    position: relative;
    top: 10px;
    color: black
}

.page-mail .mail-content .message-bookmark-button.unbookmark-message:before {
    content: "\2605";
    font-size: 23px;
    color: #89ABE3
}

.page-mail .mail-content .message-bookmark-button.bookmark-message:before {
    content: "\2606";
    font-size: 23px
}

.page-mail .mail-content p {
    margin: 0;
    line-height: 1.5
}

.page-mail .mail-content .mail-sender {
    margin: 15px 0 6px 0;
    color: #2A2B2D;
    font-weight: bold
}

.page-mail .mail-content .mail-title {
    color: #2A2B2D;
    font-size: 1.2rem
}

.page-mail .mail-content .job-name {
    margin: 0px 0 6px 0;
    color: #2A2B2D;
    font-size: 1.2rem
}

.page-mail .mail-content .mail-body {
    margin-top: 15px;
    border-top: 1px solid #d8d8d8;
    padding: 15px 0 35px
}

.page-mail .mail-content .mail-body p {
    word-break: break-all;
    margin-bottom: 1em;
    color: #000
}

.page-mail .mail-action {
    position: absolute;
    border-top: 1px solid #cecece;
    width: 480px;
    bottom: 0px;
    top: auto;
    left: 0;
    right: 0;
    z-index: 1;
    width: 100%;
    display: flex;
    padding: 10px 20px;
    background-color: rgba(255, 255, 255, 0.6);
    justify-content: flex-end
}

.page-mail .mail-action.mail-btn-height button {
    height: auto;
    min-height: 30px
}

@media only screen and (max-width: 767px) {
    .page-mail .mail-action.mail-action-box-button {
        justify-content: space-between
    }

    .page-mail .mail-action.mail-action-box-button .button-close-mail-content {
        margin-left: 0;
        margin-right: 10px
    }
}

.page-mail .mail-action button {
    display: block;
    margin-left: 10px;
    width: 140px
}

.page-mail .mail-action .button-delete {
    border: 1px solid #9A9B9D;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s
}

.page-mail .mail-action .button-delete:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.page-mail .mail-action .button-delete:hover,
.page-mail .mail-action .button-delete:focus,
.page-mail .mail-action .button-delete:active {
    color: #fff
}

.page-mail .mail-action .button-delete::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -55px;
    left: 0px;
    border-radius: 100%;
    background-color: #9A9B9D;
    width: 140px;
    height: 140px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

.page-mail .mail-action .button-delete:before {
    display: block
}

@media only screen and (max-width: 599px) {
    .page-mail .mail-action {
        display: none;
        background: #fff
    }
}

.page-mail .md-select {
    float: left;
    width: 55%;
    margin: 5px auto 0 0
}

@media only screen and (max-width: 599px) {
    .page-mail .md-select {
        width: 100%;
        margin: 5px 0 20px
    }
}

.page-mail .md-checkbox {
    display: inline-flex
}

@media only screen and (max-width: 1022px) {
    .page-mail .md-checkbox {
        width: auto
    }
}

@media only screen and (max-width: 599px) {
    .page-mail .md-checkbox {
        float: none
    }
}

.page-mail .md-checkbox .md-checkbox-label {
    font-size: 1.2rem
}

.page-mail .mail-filter-box .md-select,
.page-mail .mail-filter-box .md-textfield {
    float: none;
    width: 40%
}

@media only screen and (max-width: 599px) {

    .page-mail .mail-filter-box .md-select,
    .page-mail .mail-filter-box .md-textfield {
        min-width: 350px
    }
}

.page-mail .mail-filter-box .md-textfield {
    margin: 0 auto 0 0
}

.page-mail .mail-filter-box .md-checkbox {
    text-align: right
}

@media only screen and (max-width: 1022px) {
    .page-mail .mail-filter-box .md-checkbox {
        width: 200px
    }
}

@media only screen and (max-width: 599px) {
    .page-mail .mail-filter-box .md-checkbox {
        width: auto;
        text-align: left;
        margin-top: 10px
    }
}

.page-mail .mail-box-content {
    width: 100%;
    margin-top: 10px
}

@media only screen and (max-width: 599px) {
    .page-mail .mail-box-content {
        float: none;
        width: auto
    }
}

.page-mail .cf-icon {
    padding: 2px 6px;
    min-width: 60px
}

@media only screen and (max-width: 599px) {
    .mail-controller .cfn-tab {
        display: block
    }
}

@media only screen and (max-width: 599px) {
    .mail-controller .cfn-tab a:after {
        height: 1px
    }
}

.mail-right .full-lines-message,
.mail-left .full-lines-message {
    font-weight: bold;
    color: #e81c11
}

.mail-notice {
    margin-bottom: -15px;
    margin-top: 5px;
    font-size: 1.3rem
}

[ng\:cloak],
[ng-cloak],
[data-ng-cloak],
[x-ng-cloak],
.ng-cloak,
.x-ng-cloak {
    display: none !important
}

.page-mypage .user-wrapper,
.page-history .user-wrapper,
.page-mail .user-wrapper,
.page-resume .user-wrapper,
.page-appointment .user-wrapper,
.page-online-interview-booking .user-wrapper,
.page-account-setting .user-wrapper,
.page-job-entry .user-wrapper,
.page-desired-conditional-job-list .user-wrapper,
.page-reminder-notification .user-wrapper {
    *zoom: 1;
    width: 1210px;
    margin: 0 auto;
    padding: 20px 15px 60px 15px
}

.page-mypage .user-wrapper:before,
.page-mypage .user-wrapper:after,
.page-history .user-wrapper:before,
.page-history .user-wrapper:after,
.page-mail .user-wrapper:before,
.page-mail .user-wrapper:after,
.page-resume .user-wrapper:before,
.page-resume .user-wrapper:after,
.page-appointment .user-wrapper:before,
.page-appointment .user-wrapper:after,
.page-online-interview-booking .user-wrapper:before,
.page-online-interview-booking .user-wrapper:after,
.page-account-setting .user-wrapper:before,
.page-account-setting .user-wrapper:after,
.page-job-entry .user-wrapper:before,
.page-job-entry .user-wrapper:after,
.page-desired-conditional-job-list .user-wrapper:before,
.page-desired-conditional-job-list .user-wrapper:after,
.page-reminder-notification .user-wrapper:before,
.page-reminder-notification .user-wrapper:after {
    content: " ";
    display: table
}

.page-mypage .user-wrapper:after,
.page-history .user-wrapper:after,
.page-mail .user-wrapper:after,
.page-resume .user-wrapper:after,
.page-appointment .user-wrapper:after,
.page-online-interview-booking .user-wrapper:after,
.page-account-setting .user-wrapper:after,
.page-job-entry .user-wrapper:after,
.page-desired-conditional-job-list .user-wrapper:after,
.page-reminder-notification .user-wrapper:after {
    clear: both
}

@media only screen and (max-width: 599px) {

    .page-mypage .user-wrapper,
    .page-history .user-wrapper,
    .page-mail .user-wrapper,
    .page-resume .user-wrapper,
    .page-appointment .user-wrapper,
    .page-online-interview-booking .user-wrapper,
    .page-account-setting .user-wrapper,
    .page-job-entry .user-wrapper,
    .page-desired-conditional-job-list .user-wrapper,
    .page-reminder-notification .user-wrapper {
        padding-bottom: 0
    }
}

.page-mypage .user-wrapper .sidemenu,
.page-history .user-wrapper .sidemenu,
.page-mail .user-wrapper .sidemenu,
.page-resume .user-wrapper .sidemenu,
.page-appointment .user-wrapper .sidemenu,
.page-online-interview-booking .user-wrapper .sidemenu,
.page-account-setting .user-wrapper .sidemenu,
.page-job-entry .user-wrapper .sidemenu,
.page-desired-conditional-job-list .user-wrapper .sidemenu,
.page-reminder-notification .user-wrapper .sidemenu {
    float: left
}

.page-mypage .contents,
.page-history .contents,
.page-mail .contents,
.page-resume .contents,
.page-appointment .contents,
.page-online-interview-booking .contents,
.page-account-setting .contents,
.page-job-entry .contents,
.page-desired-conditional-job-list .contents,
.page-reminder-notification .contents {
    float: right;
    padding: 0 0 0 20px
}

@media only screen and (max-width: 1022px) {

    .page-mypage .contents,
    .page-history .contents,
    .page-mail .contents,
    .page-resume .contents,
    .page-appointment .contents,
    .page-online-interview-booking .contents,
    .page-account-setting .contents,
    .page-job-entry .contents,
    .page-desired-conditional-job-list .contents,
    .page-reminder-notification .contents {
        padding: 0
    }
}

.page-mypage .user-banner,
.page-history .user-banner,
.page-mail .user-banner,
.page-resume .user-banner,
.page-appointment .user-banner,
.page-online-interview-booking .user-banner,
.page-account-setting .user-banner,
.page-job-entry .user-banner,
.page-desired-conditional-job-list .user-banner,
.page-reminder-notification .user-banner {
    margin: 0 0 20px 0;
    line-height: 0
}

.page-mypage .user-schedule,
.page-history .user-schedule,
.page-mail .user-schedule,
.page-resume .user-schedule,
.page-appointment .user-schedule,
.page-online-interview-booking .user-schedule,
.page-account-setting .user-schedule,
.page-job-entry .user-schedule,
.page-desired-conditional-job-list .user-schedule,
.page-reminder-notification .user-schedule {
    margin: 0 0 40px 0
}

.page-mypage .user-schedule .user-schedule-select::after,
.page-history .user-schedule .user-schedule-select::after,
.page-mail .user-schedule .user-schedule-select::after,
.page-resume .user-schedule .user-schedule-select::after,
.page-appointment .user-schedule .user-schedule-select::after,
.page-online-interview-booking .user-schedule .user-schedule-select::after,
.page-account-setting .user-schedule .user-schedule-select::after,
.page-job-entry .user-schedule .user-schedule-select::after,
.page-desired-conditional-job-list .user-schedule .user-schedule-select::after,
.page-reminder-notification .user-schedule .user-schedule-select::after {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    position: relative;
    top: 2px;
    content: "arrow_drop_down";
    display: inline-block;
    font-size: 1.6rem;
    color: #3A50C9
}

@media screen and (-ms-high-contrast: active),
(-ms-high-contrast: none) {

    .page-mypage .user-schedule .user-schedule-select::after,
    .page-history .user-schedule .user-schedule-select::after,
    .page-mail .user-schedule .user-schedule-select::after,
    .page-resume .user-schedule .user-schedule-select::after,
    .page-appointment .user-schedule .user-schedule-select::after,
    .page-online-interview-booking .user-schedule .user-schedule-select::after,
    .page-account-setting .user-schedule .user-schedule-select::after,
    .page-job-entry .user-schedule .user-schedule-select::after,
    .page-desired-conditional-job-list .user-schedule .user-schedule-select::after,
    .page-reminder-notification .user-schedule .user-schedule-select::after {
        display: none
    }
}

.page-mypage .user-schedule .user-schedule-select select,
.page-history .user-schedule .user-schedule-select select,
.page-mail .user-schedule .user-schedule-select select,
.page-resume .user-schedule .user-schedule-select select,
.page-appointment .user-schedule .user-schedule-select select,
.page-online-interview-booking .user-schedule .user-schedule-select select,
.page-account-setting .user-schedule .user-schedule-select select,
.page-job-entry .user-schedule .user-schedule-select select,
.page-desired-conditional-job-list .user-schedule .user-schedule-select select,
.page-reminder-notification .user-schedule .user-schedule-select select {
    color: #3A50C9;
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    border: 0
}

.page-mypage .user-schedule .user-schedule-select select:focus,
.page-history .user-schedule .user-schedule-select select:focus,
.page-mail .user-schedule .user-schedule-select select:focus,
.page-resume .user-schedule .user-schedule-select select:focus,
.page-appointment .user-schedule .user-schedule-select select:focus,
.page-online-interview-booking .user-schedule .user-schedule-select select:focus,
.page-account-setting .user-schedule .user-schedule-select select:focus,
.page-job-entry .user-schedule .user-schedule-select select:focus,
.page-desired-conditional-job-list .user-schedule .user-schedule-select select:focus,
.page-reminder-notification .user-schedule .user-schedule-select select:focus {
    outline: 0
}

.page-mypage .user-schedule .user-no-appointment p,
.page-history .user-schedule .user-no-appointment p,
.page-mail .user-schedule .user-no-appointment p,
.page-resume .user-schedule .user-no-appointment p,
.page-appointment .user-schedule .user-no-appointment p,
.page-online-interview-booking .user-schedule .user-no-appointment p,
.page-account-setting .user-schedule .user-no-appointment p,
.page-job-entry .user-schedule .user-no-appointment p,
.page-desired-conditional-job-list .user-schedule .user-no-appointment p,
.page-reminder-notification .user-schedule .user-no-appointment p {
    margin: 10px 10px 10px 20px
}

.page-mypage .user-schedule #appointment-scroll-top-wapper,
.page-history .user-schedule #appointment-scroll-top-wapper,
.page-mail .user-schedule #appointment-scroll-top-wapper,
.page-resume .user-schedule #appointment-scroll-top-wapper,
.page-appointment .user-schedule #appointment-scroll-top-wapper,
.page-online-interview-booking .user-schedule #appointment-scroll-top-wapper,
.page-account-setting .user-schedule #appointment-scroll-top-wapper,
.page-job-entry .user-schedule #appointment-scroll-top-wapper,
.page-desired-conditional-job-list .user-schedule #appointment-scroll-top-wapper,
.page-reminder-notification .user-schedule #appointment-scroll-top-wapper {
    margin: 0px 20px;
    overflow-x: scroll;
    overflow-y: hidden;
    position: relative;
    height: 20px;
    z-index: 10;
    top: 80px
}

.page-mypage .user-schedule #appointment-scroll-top-wapper .appointment-scroll-top,
.page-history .user-schedule #appointment-scroll-top-wapper .appointment-scroll-top,
.page-mail .user-schedule #appointment-scroll-top-wapper .appointment-scroll-top,
.page-resume .user-schedule #appointment-scroll-top-wapper .appointment-scroll-top,
.page-appointment .user-schedule #appointment-scroll-top-wapper .appointment-scroll-top,
.page-online-interview-booking .user-schedule #appointment-scroll-top-wapper .appointment-scroll-top,
.page-account-setting .user-schedule #appointment-scroll-top-wapper .appointment-scroll-top,
.page-job-entry .user-schedule #appointment-scroll-top-wapper .appointment-scroll-top,
.page-desired-conditional-job-list .user-schedule #appointment-scroll-top-wapper .appointment-scroll-top,
.page-reminder-notification .user-schedule #appointment-scroll-top-wapper .appointment-scroll-top {
    height: 20px
}

.page-mypage .user-schedule .appointment-box,
.page-history .user-schedule .appointment-box,
.page-mail .user-schedule .appointment-box,
.page-resume .user-schedule .appointment-box,
.page-appointment .user-schedule .appointment-box,
.page-online-interview-booking .user-schedule .appointment-box,
.page-account-setting .user-schedule .appointment-box,
.page-job-entry .user-schedule .appointment-box,
.page-desired-conditional-job-list .user-schedule .appointment-box,
.page-reminder-notification .user-schedule .appointment-box {
    padding: 20px !important
}

.page-mypage .user-schedule .navline-position,
.page-history .user-schedule .navline-position,
.page-mail .user-schedule .navline-position,
.page-resume .user-schedule .navline-position,
.page-appointment .user-schedule .navline-position,
.page-online-interview-booking .user-schedule .navline-position,
.page-account-setting .user-schedule .navline-position,
.page-job-entry .user-schedule .navline-position,
.page-desired-conditional-job-list .user-schedule .navline-position,
.page-reminder-notification .user-schedule .navline-position {
    top: 0px !important
}

.page-mypage .user-dashboard-wrapper,
.page-history .user-dashboard-wrapper,
.page-mail .user-dashboard-wrapper,
.page-resume .user-dashboard-wrapper,
.page-appointment .user-dashboard-wrapper,
.page-online-interview-booking .user-dashboard-wrapper,
.page-account-setting .user-dashboard-wrapper,
.page-job-entry .user-dashboard-wrapper,
.page-desired-conditional-job-list .user-dashboard-wrapper,
.page-reminder-notification .user-dashboard-wrapper {
    margin: 0 -.5% 30px;
    *zoom: 1
}

.page-mypage .user-dashboard-wrapper:before,
.page-mypage .user-dashboard-wrapper:after,
.page-history .user-dashboard-wrapper:before,
.page-history .user-dashboard-wrapper:after,
.page-mail .user-dashboard-wrapper:before,
.page-mail .user-dashboard-wrapper:after,
.page-resume .user-dashboard-wrapper:before,
.page-resume .user-dashboard-wrapper:after,
.page-appointment .user-dashboard-wrapper:before,
.page-appointment .user-dashboard-wrapper:after,
.page-online-interview-booking .user-dashboard-wrapper:before,
.page-online-interview-booking .user-dashboard-wrapper:after,
.page-account-setting .user-dashboard-wrapper:before,
.page-account-setting .user-dashboard-wrapper:after,
.page-job-entry .user-dashboard-wrapper:before,
.page-job-entry .user-dashboard-wrapper:after,
.page-desired-conditional-job-list .user-dashboard-wrapper:before,
.page-desired-conditional-job-list .user-dashboard-wrapper:after,
.page-reminder-notification .user-dashboard-wrapper:before,
.page-reminder-notification .user-dashboard-wrapper:after {
    content: " ";
    display: table
}

.page-mypage .user-dashboard-wrapper:after,
.page-history .user-dashboard-wrapper:after,
.page-mail .user-dashboard-wrapper:after,
.page-resume .user-dashboard-wrapper:after,
.page-appointment .user-dashboard-wrapper:after,
.page-online-interview-booking .user-dashboard-wrapper:after,
.page-account-setting .user-dashboard-wrapper:after,
.page-job-entry .user-dashboard-wrapper:after,
.page-desired-conditional-job-list .user-dashboard-wrapper:after,
.page-reminder-notification .user-dashboard-wrapper:after {
    clear: both
}

.page-mypage .user-dashboard-box,
.page-history .user-dashboard-box,
.page-mail .user-dashboard-box,
.page-resume .user-dashboard-box,
.page-appointment .user-dashboard-box,
.page-online-interview-booking .user-dashboard-box,
.page-account-setting .user-dashboard-box,
.page-job-entry .user-dashboard-box,
.page-desired-conditional-job-list .user-dashboard-box,
.page-reminder-notification .user-dashboard-box {
    position: relative;
    width: 24%;
    float: left;
    margin: 0 .5% 10px;
    height: 190px;
    box-sizing: border-box;
    background-color: #fff;
    border: 1px solid #d8d8d8
}

@media only screen and (max-width: 1240px) {

    .page-mypage .user-dashboard-box,
    .page-history .user-dashboard-box,
    .page-mail .user-dashboard-box,
    .page-resume .user-dashboard-box,
    .page-appointment .user-dashboard-box,
    .page-online-interview-booking .user-dashboard-box,
    .page-account-setting .user-dashboard-box,
    .page-job-entry .user-dashboard-box,
    .page-desired-conditional-job-list .user-dashboard-box,
    .page-reminder-notification .user-dashboard-box {
        width: 49%
    }
}

@media only screen and (max-width: 599px) {

    .page-mypage .user-dashboard-box,
    .page-history .user-dashboard-box,
    .page-mail .user-dashboard-box,
    .page-resume .user-dashboard-box,
    .page-appointment .user-dashboard-box,
    .page-online-interview-booking .user-dashboard-box,
    .page-account-setting .user-dashboard-box,
    .page-job-entry .user-dashboard-box,
    .page-desired-conditional-job-list .user-dashboard-box,
    .page-reminder-notification .user-dashboard-box {
        height: 100px
    }
}

.page-mypage .user-dashboard-box .pie,
.page-history .user-dashboard-box .pie,
.page-mail .user-dashboard-box .pie,
.page-resume .user-dashboard-box .pie,
.page-appointment .user-dashboard-box .pie,
.page-online-interview-booking .user-dashboard-box .pie,
.page-account-setting .user-dashboard-box .pie,
.page-job-entry .user-dashboard-box .pie,
.page-desired-conditional-job-list .user-dashboard-box .pie,
.page-reminder-notification .user-dashboard-box .pie {
    position: absolute;
    top: 48px;
    left: 0;
    right: 0;
    margin: auto;
    width: 128px;
    height: 128px;
    border-radius: 50%;
    background: #d8d8d8;
    background-image: linear-gradient(to right, transparent 50%, #3a50c9 0);
    -webkit-transition: all 0.4s;
    transition: all 0.4s
}

@media only screen and (max-width: 599px) {

    .page-mypage .user-dashboard-box .pie,
    .page-history .user-dashboard-box .pie,
    .page-mail .user-dashboard-box .pie,
    .page-resume .user-dashboard-box .pie,
    .page-appointment .user-dashboard-box .pie,
    .page-online-interview-booking .user-dashboard-box .pie,
    .page-account-setting .user-dashboard-box .pie,
    .page-job-entry .user-dashboard-box .pie,
    .page-desired-conditional-job-list .user-dashboard-box .pie,
    .page-reminder-notification .user-dashboard-box .pie {
        display: none
    }
}

.page-mypage .user-dashboard-box .pie-inner,
.page-history .user-dashboard-box .pie-inner,
.page-mail .user-dashboard-box .pie-inner,
.page-resume .user-dashboard-box .pie-inner,
.page-appointment .user-dashboard-box .pie-inner,
.page-online-interview-booking .user-dashboard-box .pie-inner,
.page-account-setting .user-dashboard-box .pie-inner,
.page-job-entry .user-dashboard-box .pie-inner,
.page-desired-conditional-job-list .user-dashboard-box .pie-inner,
.page-reminder-notification .user-dashboard-box .pie-inner {
    width: 122px;
    height: 122px;
    border-radius: 50%;
    background: #fff;
    position: absolute;
    top: 3px;
    left: 3px;
    z-index: 2
}

.page-mypage .user-dashboard-box .pie-half,
.page-history .user-dashboard-box .pie-half,
.page-mail .user-dashboard-box .pie-half,
.page-resume .user-dashboard-box .pie-half,
.page-appointment .user-dashboard-box .pie-half,
.page-online-interview-booking .user-dashboard-box .pie-half,
.page-account-setting .user-dashboard-box .pie-half,
.page-job-entry .user-dashboard-box .pie-half,
.page-desired-conditional-job-list .user-dashboard-box .pie-half,
.page-reminder-notification .user-dashboard-box .pie-half {
    position: relative;
    display: block;
    margin-left: 50%;
    height: 100%;
    border-radius: 0 100% 100% 0 / 50%;
    background: #d8d8d8;
    transform-origin: left;
    z-index: 1
}

.page-mypage .user-dashboard-title,
.page-history .user-dashboard-title,
.page-mail .user-dashboard-title,
.page-resume .user-dashboard-title,
.page-appointment .user-dashboard-title,
.page-online-interview-booking .user-dashboard-title,
.page-account-setting .user-dashboard-title,
.page-job-entry .user-dashboard-title,
.page-desired-conditional-job-list .user-dashboard-title,
.page-reminder-notification .user-dashboard-title {
    position: relative;
    background-color: #223496;
    color: #fff;
    font-size: 1.2rem;
    line-height: 1.2;
    min-height: 36px;
    padding-left: 40px;
    display: flex;
    align-items: center
}

@media screen and (-ms-high-contrast: active),
(-ms-high-contrast: none) {

    .page-mypage .user-dashboard-title,
    .page-history .user-dashboard-title,
    .page-mail .user-dashboard-title,
    .page-resume .user-dashboard-title,
    .page-appointment .user-dashboard-title,
    .page-online-interview-booking .user-dashboard-title,
    .page-account-setting .user-dashboard-title,
    .page-job-entry .user-dashboard-title,
    .page-desired-conditional-job-list .user-dashboard-title,
    .page-reminder-notification .user-dashboard-title {
        height: 36px;
        min-height: auto
    }
}

@media only screen and (max-width: 599px) {

    .page-mypage .user-dashboard-title,
    .page-history .user-dashboard-title,
    .page-mail .user-dashboard-title,
    .page-resume .user-dashboard-title,
    .page-appointment .user-dashboard-title,
    .page-online-interview-booking .user-dashboard-title,
    .page-account-setting .user-dashboard-title,
    .page-job-entry .user-dashboard-title,
    .page-desired-conditional-job-list .user-dashboard-title,
    .page-reminder-notification .user-dashboard-title {
        padding: 5px;
        justify-content: center
    }
}

.page-mypage .user-dashboard-title::before,
.page-history .user-dashboard-title::before,
.page-mail .user-dashboard-title::before,
.page-resume .user-dashboard-title::before,
.page-appointment .user-dashboard-title::before,
.page-online-interview-booking .user-dashboard-title::before,
.page-account-setting .user-dashboard-title::before,
.page-job-entry .user-dashboard-title::before,
.page-desired-conditional-job-list .user-dashboard-title::before,
.page-reminder-notification .user-dashboard-title::before {
    content: "";
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    position: absolute;
    top: 50%;
    margin-top: -0.5em;
    left: 10px;
    font-size: 2.0rem
}

@media only screen and (max-width: 599px) {

    .page-mypage .user-dashboard-title::before,
    .page-history .user-dashboard-title::before,
    .page-mail .user-dashboard-title::before,
    .page-resume .user-dashboard-title::before,
    .page-appointment .user-dashboard-title::before,
    .page-online-interview-booking .user-dashboard-title::before,
    .page-account-setting .user-dashboard-title::before,
    .page-job-entry .user-dashboard-title::before,
    .page-desired-conditional-job-list .user-dashboard-title::before,
    .page-reminder-notification .user-dashboard-title::before {
        display: none
    }
}

.page-mypage .user-dashboard-box-01 .user-dashboard-title::before,
.page-history .user-dashboard-box-01 .user-dashboard-title::before,
.page-mail .user-dashboard-box-01 .user-dashboard-title::before,
.page-resume .user-dashboard-box-01 .user-dashboard-title::before,
.page-appointment .user-dashboard-box-01 .user-dashboard-title::before,
.page-online-interview-booking .user-dashboard-box-01 .user-dashboard-title::before,
.page-account-setting .user-dashboard-box-01 .user-dashboard-title::before,
.page-job-entry .user-dashboard-box-01 .user-dashboard-title::before,
.page-desired-conditional-job-list .user-dashboard-box-01 .user-dashboard-title::before,
.page-reminder-notification .user-dashboard-box-01 .user-dashboard-title::before {
    content: "portrait"
}

.page-mypage .user-dashboard-box-02 .user-dashboard-title::before,
.page-history .user-dashboard-box-02 .user-dashboard-title::before,
.page-mail .user-dashboard-box-02 .user-dashboard-title::before,
.page-resume .user-dashboard-box-02 .user-dashboard-title::before,
.page-appointment .user-dashboard-box-02 .user-dashboard-title::before,
.page-online-interview-booking .user-dashboard-box-02 .user-dashboard-title::before,
.page-account-setting .user-dashboard-box-02 .user-dashboard-title::before,
.page-job-entry .user-dashboard-box-02 .user-dashboard-title::before,
.page-desired-conditional-job-list .user-dashboard-box-02 .user-dashboard-title::before,
.page-reminder-notification .user-dashboard-box-02 .user-dashboard-title::before {
    content: "mail_outline"
}

.page-mypage .user-dashboard-box-03 .user-dashboard-title::before,
.page-history .user-dashboard-box-03 .user-dashboard-title::before,
.page-mail .user-dashboard-box-03 .user-dashboard-title::before,
.page-resume .user-dashboard-box-03 .user-dashboard-title::before,
.page-appointment .user-dashboard-box-03 .user-dashboard-title::before,
.page-online-interview-booking .user-dashboard-box-03 .user-dashboard-title::before,
.page-account-setting .user-dashboard-box-03 .user-dashboard-title::before,
.page-job-entry .user-dashboard-box-03 .user-dashboard-title::before,
.page-desired-conditional-job-list .user-dashboard-box-03 .user-dashboard-title::before,
.page-reminder-notification .user-dashboard-box-03 .user-dashboard-title::before {
    content: "business"
}

.page-mypage .user-dashboard-box-04 .user-dashboard-title::before,
.page-history .user-dashboard-box-04 .user-dashboard-title::before,
.page-mail .user-dashboard-box-04 .user-dashboard-title::before,
.page-resume .user-dashboard-box-04 .user-dashboard-title::before,
.page-appointment .user-dashboard-box-04 .user-dashboard-title::before,
.page-online-interview-booking .user-dashboard-box-04 .user-dashboard-title::before,
.page-account-setting .user-dashboard-box-04 .user-dashboard-title::before,
.page-job-entry .user-dashboard-box-04 .user-dashboard-title::before,
.page-desired-conditional-job-list .user-dashboard-box-04 .user-dashboard-title::before,
.page-reminder-notification .user-dashboard-box-04 .user-dashboard-title::before {
    content: "chat_bubble_outline"
}

.page-mypage .user-dashboard-value,
.page-history .user-dashboard-value,
.page-mail .user-dashboard-value,
.page-resume .user-dashboard-value,
.page-appointment .user-dashboard-value,
.page-online-interview-booking .user-dashboard-value,
.page-account-setting .user-dashboard-value,
.page-job-entry .user-dashboard-value,
.page-desired-conditional-job-list .user-dashboard-value,
.page-reminder-notification .user-dashboard-value {
    width: 100%;
    text-align: center;
    position: absolute;
    top: 86px;
    z-index: 3;
    color: #000;
    font-size: 2.0rem
}

@media only screen and (max-width: 599px) {

    .page-mypage .user-dashboard-value,
    .page-history .user-dashboard-value,
    .page-mail .user-dashboard-value,
    .page-resume .user-dashboard-value,
    .page-appointment .user-dashboard-value,
    .page-online-interview-booking .user-dashboard-value,
    .page-account-setting .user-dashboard-value,
    .page-job-entry .user-dashboard-value,
    .page-desired-conditional-job-list .user-dashboard-value,
    .page-reminder-notification .user-dashboard-value {
        position: static;
        font-size: 1.5rem;
        padding: 20px 0
    }
}

.page-mypage .user-dashboard-value strong,
.page-history .user-dashboard-value strong,
.page-mail .user-dashboard-value strong,
.page-resume .user-dashboard-value strong,
.page-appointment .user-dashboard-value strong,
.page-online-interview-booking .user-dashboard-value strong,
.page-account-setting .user-dashboard-value strong,
.page-job-entry .user-dashboard-value strong,
.page-desired-conditional-job-list .user-dashboard-value strong,
.page-reminder-notification .user-dashboard-value strong {
    font-size: 3.6rem;
    margin: 0 0.1em
}

@media only screen and (max-width: 599px) {

    .page-mypage .user-dashboard-value strong,
    .page-history .user-dashboard-value strong,
    .page-mail .user-dashboard-value strong,
    .page-resume .user-dashboard-value strong,
    .page-appointment .user-dashboard-value strong,
    .page-online-interview-booking .user-dashboard-value strong,
    .page-account-setting .user-dashboard-value strong,
    .page-job-entry .user-dashboard-value strong,
    .page-desired-conditional-job-list .user-dashboard-value strong,
    .page-reminder-notification .user-dashboard-value strong {
        font-size: inherit;
        font-weight: normal
    }
}

.page-mypage .user-job-detail,
.page-history .user-job-detail,
.page-mail .user-job-detail,
.page-resume .user-job-detail,
.page-appointment .user-job-detail,
.page-online-interview-booking .user-job-detail,
.page-account-setting .user-job-detail,
.page-job-entry .user-job-detail,
.page-desired-conditional-job-list .user-job-detail,
.page-reminder-notification .user-job-detail {
    border-bottom: 1px solid #d8d8d8
}

.page-mypage .user-video-upload-box .video-title,
.page-history .user-video-upload-box .video-title,
.page-mail .user-video-upload-box .video-title,
.page-resume .user-video-upload-box .video-title,
.page-appointment .user-video-upload-box .video-title,
.page-online-interview-booking .user-video-upload-box .video-title,
.page-account-setting .user-video-upload-box .video-title,
.page-job-entry .user-video-upload-box .video-title,
.page-desired-conditional-job-list .user-video-upload-box .video-title,
.page-reminder-notification .user-video-upload-box .video-title {
    margin: 0 0 5px
}

.page-mypage .user-video-upload-box .video-memo,
.page-history .user-video-upload-box .video-memo,
.page-mail .user-video-upload-box .video-memo,
.page-resume .user-video-upload-box .video-memo,
.page-appointment .user-video-upload-box .video-memo,
.page-online-interview-booking .user-video-upload-box .video-memo,
.page-account-setting .user-video-upload-box .video-memo,
.page-job-entry .user-video-upload-box .video-memo,
.page-desired-conditional-job-list .user-video-upload-box .video-memo,
.page-reminder-notification .user-video-upload-box .video-memo {
    margin: 10px 0 5px
}

.page-mypage .user-job,
.page-mypage .user-video,
.page-mypage .user-video-upload-box,
.page-history .user-job,
.page-history .user-video,
.page-history .user-video-upload-box,
.page-mail .user-job,
.page-mail .user-video,
.page-mail .user-video-upload-box,
.page-resume .user-job,
.page-resume .user-video,
.page-resume .user-video-upload-box,
.page-appointment .user-job,
.page-appointment .user-video,
.page-appointment .user-video-upload-box,
.page-online-interview-booking .user-job,
.page-online-interview-booking .user-video,
.page-online-interview-booking .user-video-upload-box,
.page-account-setting .user-job,
.page-account-setting .user-video,
.page-account-setting .user-video-upload-box,
.page-job-entry .user-job,
.page-job-entry .user-video,
.page-job-entry .user-video-upload-box,
.page-desired-conditional-job-list .user-job,
.page-desired-conditional-job-list .user-video,
.page-desired-conditional-job-list .user-video-upload-box,
.page-reminder-notification .user-job,
.page-reminder-notification .user-video,
.page-reminder-notification .user-video-upload-box {
    margin-bottom: 20px
}

.page-mypage .user-job .user-box-inner,
.page-mypage .user-video .user-box-inner,
.page-mypage .user-video-upload-box .user-box-inner,
.page-history .user-job .user-box-inner,
.page-history .user-video .user-box-inner,
.page-history .user-video-upload-box .user-box-inner,
.page-mail .user-job .user-box-inner,
.page-mail .user-video .user-box-inner,
.page-mail .user-video-upload-box .user-box-inner,
.page-resume .user-job .user-box-inner,
.page-resume .user-video .user-box-inner,
.page-resume .user-video-upload-box .user-box-inner,
.page-appointment .user-job .user-box-inner,
.page-appointment .user-video .user-box-inner,
.page-appointment .user-video-upload-box .user-box-inner,
.page-online-interview-booking .user-job .user-box-inner,
.page-online-interview-booking .user-video .user-box-inner,
.page-online-interview-booking .user-video-upload-box .user-box-inner,
.page-account-setting .user-job .user-box-inner,
.page-account-setting .user-video .user-box-inner,
.page-account-setting .user-video-upload-box .user-box-inner,
.page-job-entry .user-job .user-box-inner,
.page-job-entry .user-video .user-box-inner,
.page-job-entry .user-video-upload-box .user-box-inner,
.page-desired-conditional-job-list .user-job .user-box-inner,
.page-desired-conditional-job-list .user-video .user-box-inner,
.page-desired-conditional-job-list .user-video-upload-box .user-box-inner,
.page-reminder-notification .user-job .user-box-inner,
.page-reminder-notification .user-video .user-box-inner,
.page-reminder-notification .user-video-upload-box .user-box-inner {
    *zoom: 1
}

.page-mypage .user-job .user-box-inner:before,
.page-mypage .user-job .user-box-inner:after,
.page-mypage .user-video .user-box-inner:before,
.page-mypage .user-video .user-box-inner:after,
.page-mypage .user-video-upload-box .user-box-inner:before,
.page-mypage .user-video-upload-box .user-box-inner:after,
.page-history .user-job .user-box-inner:before,
.page-history .user-job .user-box-inner:after,
.page-history .user-video .user-box-inner:before,
.page-history .user-video .user-box-inner:after,
.page-history .user-video-upload-box .user-box-inner:before,
.page-history .user-video-upload-box .user-box-inner:after,
.page-mail .user-job .user-box-inner:before,
.page-mail .user-job .user-box-inner:after,
.page-mail .user-video .user-box-inner:before,
.page-mail .user-video .user-box-inner:after,
.page-mail .user-video-upload-box .user-box-inner:before,
.page-mail .user-video-upload-box .user-box-inner:after,
.page-resume .user-job .user-box-inner:before,
.page-resume .user-job .user-box-inner:after,
.page-resume .user-video .user-box-inner:before,
.page-resume .user-video .user-box-inner:after,
.page-resume .user-video-upload-box .user-box-inner:before,
.page-resume .user-video-upload-box .user-box-inner:after,
.page-appointment .user-job .user-box-inner:before,
.page-appointment .user-job .user-box-inner:after,
.page-appointment .user-video .user-box-inner:before,
.page-appointment .user-video .user-box-inner:after,
.page-appointment .user-video-upload-box .user-box-inner:before,
.page-appointment .user-video-upload-box .user-box-inner:after,
.page-online-interview-booking .user-job .user-box-inner:before,
.page-online-interview-booking .user-job .user-box-inner:after,
.page-online-interview-booking .user-video .user-box-inner:before,
.page-online-interview-booking .user-video .user-box-inner:after,
.page-online-interview-booking .user-video-upload-box .user-box-inner:before,
.page-online-interview-booking .user-video-upload-box .user-box-inner:after,
.page-account-setting .user-job .user-box-inner:before,
.page-account-setting .user-job .user-box-inner:after,
.page-account-setting .user-video .user-box-inner:before,
.page-account-setting .user-video .user-box-inner:after,
.page-account-setting .user-video-upload-box .user-box-inner:before,
.page-account-setting .user-video-upload-box .user-box-inner:after,
.page-job-entry .user-job .user-box-inner:before,
.page-job-entry .user-job .user-box-inner:after,
.page-job-entry .user-video .user-box-inner:before,
.page-job-entry .user-video .user-box-inner:after,
.page-job-entry .user-video-upload-box .user-box-inner:before,
.page-job-entry .user-video-upload-box .user-box-inner:after,
.page-desired-conditional-job-list .user-job .user-box-inner:before,
.page-desired-conditional-job-list .user-job .user-box-inner:after,
.page-desired-conditional-job-list .user-video .user-box-inner:before,
.page-desired-conditional-job-list .user-video .user-box-inner:after,
.page-desired-conditional-job-list .user-video-upload-box .user-box-inner:before,
.page-desired-conditional-job-list .user-video-upload-box .user-box-inner:after,
.page-reminder-notification .user-job .user-box-inner:before,
.page-reminder-notification .user-job .user-box-inner:after,
.page-reminder-notification .user-video .user-box-inner:before,
.page-reminder-notification .user-video .user-box-inner:after,
.page-reminder-notification .user-video-upload-box .user-box-inner:before,
.page-reminder-notification .user-video-upload-box .user-box-inner:after {
    content: " ";
    display: table
}

.page-mypage .user-job .user-box-inner:after,
.page-mypage .user-video .user-box-inner:after,
.page-mypage .user-video-upload-box .user-box-inner:after,
.page-history .user-job .user-box-inner:after,
.page-history .user-video .user-box-inner:after,
.page-history .user-video-upload-box .user-box-inner:after,
.page-mail .user-job .user-box-inner:after,
.page-mail .user-video .user-box-inner:after,
.page-mail .user-video-upload-box .user-box-inner:after,
.page-resume .user-job .user-box-inner:after,
.page-resume .user-video .user-box-inner:after,
.page-resume .user-video-upload-box .user-box-inner:after,
.page-appointment .user-job .user-box-inner:after,
.page-appointment .user-video .user-box-inner:after,
.page-appointment .user-video-upload-box .user-box-inner:after,
.page-online-interview-booking .user-job .user-box-inner:after,
.page-online-interview-booking .user-video .user-box-inner:after,
.page-online-interview-booking .user-video-upload-box .user-box-inner:after,
.page-account-setting .user-job .user-box-inner:after,
.page-account-setting .user-video .user-box-inner:after,
.page-account-setting .user-video-upload-box .user-box-inner:after,
.page-job-entry .user-job .user-box-inner:after,
.page-job-entry .user-video .user-box-inner:after,
.page-job-entry .user-video-upload-box .user-box-inner:after,
.page-desired-conditional-job-list .user-job .user-box-inner:after,
.page-desired-conditional-job-list .user-video .user-box-inner:after,
.page-desired-conditional-job-list .user-video-upload-box .user-box-inner:after,
.page-reminder-notification .user-job .user-box-inner:after,
.page-reminder-notification .user-video .user-box-inner:after,
.page-reminder-notification .user-video-upload-box .user-box-inner:after {
    clear: both
}

@media only screen and (min-width: 598px) {

    .page-mypage .user-job .user-box-inner .md-switch,
    .page-mypage .user-video .user-box-inner .md-switch,
    .page-mypage .user-video-upload-box .user-box-inner .md-switch,
    .page-history .user-job .user-box-inner .md-switch,
    .page-history .user-video .user-box-inner .md-switch,
    .page-history .user-video-upload-box .user-box-inner .md-switch,
    .page-mail .user-job .user-box-inner .md-switch,
    .page-mail .user-video .user-box-inner .md-switch,
    .page-mail .user-video-upload-box .user-box-inner .md-switch,
    .page-resume .user-job .user-box-inner .md-switch,
    .page-resume .user-video .user-box-inner .md-switch,
    .page-resume .user-video-upload-box .user-box-inner .md-switch,
    .page-appointment .user-job .user-box-inner .md-switch,
    .page-appointment .user-video .user-box-inner .md-switch,
    .page-appointment .user-video-upload-box .user-box-inner .md-switch,
    .page-online-interview-booking .user-job .user-box-inner .md-switch,
    .page-online-interview-booking .user-video .user-box-inner .md-switch,
    .page-online-interview-booking .user-video-upload-box .user-box-inner .md-switch,
    .page-account-setting .user-job .user-box-inner .md-switch,
    .page-account-setting .user-video .user-box-inner .md-switch,
    .page-account-setting .user-video-upload-box .user-box-inner .md-switch,
    .page-job-entry .user-job .user-box-inner .md-switch,
    .page-job-entry .user-video .user-box-inner .md-switch,
    .page-job-entry .user-video-upload-box .user-box-inner .md-switch,
    .page-desired-conditional-job-list .user-job .user-box-inner .md-switch,
    .page-desired-conditional-job-list .user-video .user-box-inner .md-switch,
    .page-desired-conditional-job-list .user-video-upload-box .user-box-inner .md-switch,
    .page-reminder-notification .user-job .user-box-inner .md-switch,
    .page-reminder-notification .user-video .user-box-inner .md-switch,
    .page-reminder-notification .user-video-upload-box .user-box-inner .md-switch {
        margin: 0 0 5px 5px
    }
}

.page-mypage .user-job .user-box-inner .convert-error-text,
.page-mypage .user-video .user-box-inner .convert-error-text,
.page-mypage .user-video-upload-box .user-box-inner .convert-error-text,
.page-history .user-job .user-box-inner .convert-error-text,
.page-history .user-video .user-box-inner .convert-error-text,
.page-history .user-video-upload-box .user-box-inner .convert-error-text,
.page-mail .user-job .user-box-inner .convert-error-text,
.page-mail .user-video .user-box-inner .convert-error-text,
.page-mail .user-video-upload-box .user-box-inner .convert-error-text,
.page-resume .user-job .user-box-inner .convert-error-text,
.page-resume .user-video .user-box-inner .convert-error-text,
.page-resume .user-video-upload-box .user-box-inner .convert-error-text,
.page-appointment .user-job .user-box-inner .convert-error-text,
.page-appointment .user-video .user-box-inner .convert-error-text,
.page-appointment .user-video-upload-box .user-box-inner .convert-error-text,
.page-online-interview-booking .user-job .user-box-inner .convert-error-text,
.page-online-interview-booking .user-video .user-box-inner .convert-error-text,
.page-online-interview-booking .user-video-upload-box .user-box-inner .convert-error-text,
.page-account-setting .user-job .user-box-inner .convert-error-text,
.page-account-setting .user-video .user-box-inner .convert-error-text,
.page-account-setting .user-video-upload-box .user-box-inner .convert-error-text,
.page-job-entry .user-job .user-box-inner .convert-error-text,
.page-job-entry .user-video .user-box-inner .convert-error-text,
.page-job-entry .user-video-upload-box .user-box-inner .convert-error-text,
.page-desired-conditional-job-list .user-job .user-box-inner .convert-error-text,
.page-desired-conditional-job-list .user-video .user-box-inner .convert-error-text,
.page-desired-conditional-job-list .user-video-upload-box .user-box-inner .convert-error-text,
.page-reminder-notification .user-job .user-box-inner .convert-error-text,
.page-reminder-notification .user-video .user-box-inner .convert-error-text,
.page-reminder-notification .user-video-upload-box .user-box-inner .convert-error-text {
    color: #d03a1c;
    margin-bottom: 10px
}

.page-mypage .user-job .user-box-title,
.page-mypage .user-video .user-box-title,
.page-mypage .user-video-upload-box .user-box-title,
.page-history .user-job .user-box-title,
.page-history .user-video .user-box-title,
.page-history .user-video-upload-box .user-box-title,
.page-mail .user-job .user-box-title,
.page-mail .user-video .user-box-title,
.page-mail .user-video-upload-box .user-box-title,
.page-resume .user-job .user-box-title,
.page-resume .user-video .user-box-title,
.page-resume .user-video-upload-box .user-box-title,
.page-appointment .user-job .user-box-title,
.page-appointment .user-video .user-box-title,
.page-appointment .user-video-upload-box .user-box-title,
.page-online-interview-booking .user-job .user-box-title,
.page-online-interview-booking .user-video .user-box-title,
.page-online-interview-booking .user-video-upload-box .user-box-title,
.page-account-setting .user-job .user-box-title,
.page-account-setting .user-video .user-box-title,
.page-account-setting .user-video-upload-box .user-box-title,
.page-job-entry .user-job .user-box-title,
.page-job-entry .user-video .user-box-title,
.page-job-entry .user-video-upload-box .user-box-title,
.page-desired-conditional-job-list .user-job .user-box-title,
.page-desired-conditional-job-list .user-video .user-box-title,
.page-desired-conditional-job-list .user-video-upload-box .user-box-title,
.page-reminder-notification .user-job .user-box-title,
.page-reminder-notification .user-video .user-box-title,
.page-reminder-notification .user-video-upload-box .user-box-title {
    position: relative;
    padding: 0 0 0 230px;
    min-height: 240px
}

@media only screen and (max-width: 1240px) {

    .page-mypage .user-job .user-box-title,
    .page-mypage .user-video .user-box-title,
    .page-mypage .user-video-upload-box .user-box-title,
    .page-history .user-job .user-box-title,
    .page-history .user-video .user-box-title,
    .page-history .user-video-upload-box .user-box-title,
    .page-mail .user-job .user-box-title,
    .page-mail .user-video .user-box-title,
    .page-mail .user-video-upload-box .user-box-title,
    .page-resume .user-job .user-box-title,
    .page-resume .user-video .user-box-title,
    .page-resume .user-video-upload-box .user-box-title,
    .page-appointment .user-job .user-box-title,
    .page-appointment .user-video .user-box-title,
    .page-appointment .user-video-upload-box .user-box-title,
    .page-online-interview-booking .user-job .user-box-title,
    .page-online-interview-booking .user-video .user-box-title,
    .page-online-interview-booking .user-video-upload-box .user-box-title,
    .page-account-setting .user-job .user-box-title,
    .page-account-setting .user-video .user-box-title,
    .page-account-setting .user-video-upload-box .user-box-title,
    .page-job-entry .user-job .user-box-title,
    .page-job-entry .user-video .user-box-title,
    .page-job-entry .user-video-upload-box .user-box-title,
    .page-desired-conditional-job-list .user-job .user-box-title,
    .page-desired-conditional-job-list .user-video .user-box-title,
    .page-desired-conditional-job-list .user-video-upload-box .user-box-title,
    .page-reminder-notification .user-job .user-box-title,
    .page-reminder-notification .user-video .user-box-title,
    .page-reminder-notification .user-video-upload-box .user-box-title {
        padding: 0 0 0 210px
    }
}

@media only screen and (max-width: 599px) {

    .page-mypage .user-job .user-box-title,
    .page-mypage .user-video .user-box-title,
    .page-mypage .user-video-upload-box .user-box-title,
    .page-history .user-job .user-box-title,
    .page-history .user-video .user-box-title,
    .page-history .user-video-upload-box .user-box-title,
    .page-mail .user-job .user-box-title,
    .page-mail .user-video .user-box-title,
    .page-mail .user-video-upload-box .user-box-title,
    .page-resume .user-job .user-box-title,
    .page-resume .user-video .user-box-title,
    .page-resume .user-video-upload-box .user-box-title,
    .page-appointment .user-job .user-box-title,
    .page-appointment .user-video .user-box-title,
    .page-appointment .user-video-upload-box .user-box-title,
    .page-online-interview-booking .user-job .user-box-title,
    .page-online-interview-booking .user-video .user-box-title,
    .page-online-interview-booking .user-video-upload-box .user-box-title,
    .page-account-setting .user-job .user-box-title,
    .page-account-setting .user-video .user-box-title,
    .page-account-setting .user-video-upload-box .user-box-title,
    .page-job-entry .user-job .user-box-title,
    .page-job-entry .user-video .user-box-title,
    .page-job-entry .user-video-upload-box .user-box-title,
    .page-desired-conditional-job-list .user-job .user-box-title,
    .page-desired-conditional-job-list .user-video .user-box-title,
    .page-desired-conditional-job-list .user-video-upload-box .user-box-title,
    .page-reminder-notification .user-job .user-box-title,
    .page-reminder-notification .user-video .user-box-title,
    .page-reminder-notification .user-video-upload-box .user-box-title {
        padding: 10px 10px 10px 110px
    }
}

.page-mypage .user-job .user-box-title h3,
.page-mypage .user-video .user-box-title h3,
.page-mypage .user-video-upload-box .user-box-title h3,
.page-history .user-job .user-box-title h3,
.page-history .user-video .user-box-title h3,
.page-history .user-video-upload-box .user-box-title h3,
.page-mail .user-job .user-box-title h3,
.page-mail .user-video .user-box-title h3,
.page-mail .user-video-upload-box .user-box-title h3,
.page-resume .user-job .user-box-title h3,
.page-resume .user-video .user-box-title h3,
.page-resume .user-video-upload-box .user-box-title h3,
.page-appointment .user-job .user-box-title h3,
.page-appointment .user-video .user-box-title h3,
.page-appointment .user-video-upload-box .user-box-title h3,
.page-online-interview-booking .user-job .user-box-title h3,
.page-online-interview-booking .user-video .user-box-title h3,
.page-online-interview-booking .user-video-upload-box .user-box-title h3,
.page-account-setting .user-job .user-box-title h3,
.page-account-setting .user-video .user-box-title h3,
.page-account-setting .user-video-upload-box .user-box-title h3,
.page-job-entry .user-job .user-box-title h3,
.page-job-entry .user-video .user-box-title h3,
.page-job-entry .user-video-upload-box .user-box-title h3,
.page-desired-conditional-job-list .user-job .user-box-title h3,
.page-desired-conditional-job-list .user-video .user-box-title h3,
.page-desired-conditional-job-list .user-video-upload-box .user-box-title h3,
.page-reminder-notification .user-job .user-box-title h3,
.page-reminder-notification .user-video .user-box-title h3,
.page-reminder-notification .user-video-upload-box .user-box-title h3 {
    margin: 10px 0;
    font-weight: normal;
    font-size: 1.6rem
}

@media only screen and (max-width: 767px) {

    .page-mypage .user-job .user-box-title h3.user-video-memo,
    .page-mypage .user-video .user-box-title h3.user-video-memo,
    .page-mypage .user-video-upload-box .user-box-title h3.user-video-memo,
    .page-history .user-job .user-box-title h3.user-video-memo,
    .page-history .user-video .user-box-title h3.user-video-memo,
    .page-history .user-video-upload-box .user-box-title h3.user-video-memo,
    .page-mail .user-job .user-box-title h3.user-video-memo,
    .page-mail .user-video .user-box-title h3.user-video-memo,
    .page-mail .user-video-upload-box .user-box-title h3.user-video-memo,
    .page-resume .user-job .user-box-title h3.user-video-memo,
    .page-resume .user-video .user-box-title h3.user-video-memo,
    .page-resume .user-video-upload-box .user-box-title h3.user-video-memo,
    .page-appointment .user-job .user-box-title h3.user-video-memo,
    .page-appointment .user-video .user-box-title h3.user-video-memo,
    .page-appointment .user-video-upload-box .user-box-title h3.user-video-memo,
    .page-online-interview-booking .user-job .user-box-title h3.user-video-memo,
    .page-online-interview-booking .user-video .user-box-title h3.user-video-memo,
    .page-online-interview-booking .user-video-upload-box .user-box-title h3.user-video-memo,
    .page-account-setting .user-job .user-box-title h3.user-video-memo,
    .page-account-setting .user-video .user-box-title h3.user-video-memo,
    .page-account-setting .user-video-upload-box .user-box-title h3.user-video-memo,
    .page-job-entry .user-job .user-box-title h3.user-video-memo,
    .page-job-entry .user-video .user-box-title h3.user-video-memo,
    .page-job-entry .user-video-upload-box .user-box-title h3.user-video-memo,
    .page-desired-conditional-job-list .user-job .user-box-title h3.user-video-memo,
    .page-desired-conditional-job-list .user-video .user-box-title h3.user-video-memo,
    .page-desired-conditional-job-list .user-video-upload-box .user-box-title h3.user-video-memo,
    .page-reminder-notification .user-job .user-box-title h3.user-video-memo,
    .page-reminder-notification .user-video .user-box-title h3.user-video-memo,
    .page-reminder-notification .user-video-upload-box .user-box-title h3.user-video-memo {
        float: none;
        width: 100%;
        margin: 10px 0
    }
}

@media only screen and (max-width: 599px) {

    .page-mypage .user-job .user-box-title h3,
    .page-mypage .user-video .user-box-title h3,
    .page-mypage .user-video-upload-box .user-box-title h3,
    .page-history .user-job .user-box-title h3,
    .page-history .user-video .user-box-title h3,
    .page-history .user-video-upload-box .user-box-title h3,
    .page-mail .user-job .user-box-title h3,
    .page-mail .user-video .user-box-title h3,
    .page-mail .user-video-upload-box .user-box-title h3,
    .page-resume .user-job .user-box-title h3,
    .page-resume .user-video .user-box-title h3,
    .page-resume .user-video-upload-box .user-box-title h3,
    .page-appointment .user-job .user-box-title h3,
    .page-appointment .user-video .user-box-title h3,
    .page-appointment .user-video-upload-box .user-box-title h3,
    .page-online-interview-booking .user-job .user-box-title h3,
    .page-online-interview-booking .user-video .user-box-title h3,
    .page-online-interview-booking .user-video-upload-box .user-box-title h3,
    .page-account-setting .user-job .user-box-title h3,
    .page-account-setting .user-video .user-box-title h3,
    .page-account-setting .user-video-upload-box .user-box-title h3,
    .page-job-entry .user-job .user-box-title h3,
    .page-job-entry .user-video .user-box-title h3,
    .page-job-entry .user-video-upload-box .user-box-title h3,
    .page-desired-conditional-job-list .user-job .user-box-title h3,
    .page-desired-conditional-job-list .user-video .user-box-title h3,
    .page-desired-conditional-job-list .user-video-upload-box .user-box-title h3,
    .page-reminder-notification .user-job .user-box-title h3,
    .page-reminder-notification .user-video .user-box-title h3,
    .page-reminder-notification .user-video-upload-box .user-box-title h3 {
        font-size: 1.4rem;
        width: 100%;
        display: block
    }
}

@media only screen and (max-width: 767px) {

    .page-mypage .user-job .user-box-title .user-video-memo,
    .page-mypage .user-video .user-box-title .user-video-memo,
    .page-mypage .user-video-upload-box .user-box-title .user-video-memo,
    .page-history .user-job .user-box-title .user-video-memo,
    .page-history .user-video .user-box-title .user-video-memo,
    .page-history .user-video-upload-box .user-box-title .user-video-memo,
    .page-mail .user-job .user-box-title .user-video-memo,
    .page-mail .user-video .user-box-title .user-video-memo,
    .page-mail .user-video-upload-box .user-box-title .user-video-memo,
    .page-resume .user-job .user-box-title .user-video-memo,
    .page-resume .user-video .user-box-title .user-video-memo,
    .page-resume .user-video-upload-box .user-box-title .user-video-memo,
    .page-appointment .user-job .user-box-title .user-video-memo,
    .page-appointment .user-video .user-box-title .user-video-memo,
    .page-appointment .user-video-upload-box .user-box-title .user-video-memo,
    .page-online-interview-booking .user-job .user-box-title .user-video-memo,
    .page-online-interview-booking .user-video .user-box-title .user-video-memo,
    .page-online-interview-booking .user-video-upload-box .user-box-title .user-video-memo,
    .page-account-setting .user-job .user-box-title .user-video-memo,
    .page-account-setting .user-video .user-box-title .user-video-memo,
    .page-account-setting .user-video-upload-box .user-box-title .user-video-memo,
    .page-job-entry .user-job .user-box-title .user-video-memo,
    .page-job-entry .user-video .user-box-title .user-video-memo,
    .page-job-entry .user-video-upload-box .user-box-title .user-video-memo,
    .page-desired-conditional-job-list .user-job .user-box-title .user-video-memo,
    .page-desired-conditional-job-list .user-video .user-box-title .user-video-memo,
    .page-desired-conditional-job-list .user-video-upload-box .user-box-title .user-video-memo,
    .page-reminder-notification .user-job .user-box-title .user-video-memo,
    .page-reminder-notification .user-video .user-box-title .user-video-memo,
    .page-reminder-notification .user-video-upload-box .user-box-title .user-video-memo {
        margin-bottom: 2rem
    }
}

.page-mypage .user-job .user-box-title .cf-icon,
.page-mypage .user-video .user-box-title .cf-icon,
.page-mypage .user-video-upload-box .user-box-title .cf-icon,
.page-history .user-job .user-box-title .cf-icon,
.page-history .user-video .user-box-title .cf-icon,
.page-history .user-video-upload-box .user-box-title .cf-icon,
.page-mail .user-job .user-box-title .cf-icon,
.page-mail .user-video .user-box-title .cf-icon,
.page-mail .user-video-upload-box .user-box-title .cf-icon,
.page-resume .user-job .user-box-title .cf-icon,
.page-resume .user-video .user-box-title .cf-icon,
.page-resume .user-video-upload-box .user-box-title .cf-icon,
.page-appointment .user-job .user-box-title .cf-icon,
.page-appointment .user-video .user-box-title .cf-icon,
.page-appointment .user-video-upload-box .user-box-title .cf-icon,
.page-online-interview-booking .user-job .user-box-title .cf-icon,
.page-online-interview-booking .user-video .user-box-title .cf-icon,
.page-online-interview-booking .user-video-upload-box .user-box-title .cf-icon,
.page-account-setting .user-job .user-box-title .cf-icon,
.page-account-setting .user-video .user-box-title .cf-icon,
.page-account-setting .user-video-upload-box .user-box-title .cf-icon,
.page-job-entry .user-job .user-box-title .cf-icon,
.page-job-entry .user-video .user-box-title .cf-icon,
.page-job-entry .user-video-upload-box .user-box-title .cf-icon,
.page-desired-conditional-job-list .user-job .user-box-title .cf-icon,
.page-desired-conditional-job-list .user-video .user-box-title .cf-icon,
.page-desired-conditional-job-list .user-video-upload-box .user-box-title .cf-icon,
.page-reminder-notification .user-job .user-box-title .cf-icon,
.page-reminder-notification .user-video .user-box-title .cf-icon,
.page-reminder-notification .user-video-upload-box .user-box-title .cf-icon {
    position: relative
}

.page-mypage .user-job .user-box-title .user-job-company,
.page-mypage .user-video .user-box-title .user-job-company,
.page-mypage .user-video-upload-box .user-box-title .user-job-company,
.page-history .user-job .user-box-title .user-job-company,
.page-history .user-video .user-box-title .user-job-company,
.page-history .user-video-upload-box .user-box-title .user-job-company,
.page-mail .user-job .user-box-title .user-job-company,
.page-mail .user-video .user-box-title .user-job-company,
.page-mail .user-video-upload-box .user-box-title .user-job-company,
.page-resume .user-job .user-box-title .user-job-company,
.page-resume .user-video .user-box-title .user-job-company,
.page-resume .user-video-upload-box .user-box-title .user-job-company,
.page-appointment .user-job .user-box-title .user-job-company,
.page-appointment .user-video .user-box-title .user-job-company,
.page-appointment .user-video-upload-box .user-box-title .user-job-company,
.page-online-interview-booking .user-job .user-box-title .user-job-company,
.page-online-interview-booking .user-video .user-box-title .user-job-company,
.page-online-interview-booking .user-video-upload-box .user-box-title .user-job-company,
.page-account-setting .user-job .user-box-title .user-job-company,
.page-account-setting .user-video .user-box-title .user-job-company,
.page-account-setting .user-video-upload-box .user-box-title .user-job-company,
.page-job-entry .user-job .user-box-title .user-job-company,
.page-job-entry .user-video .user-box-title .user-job-company,
.page-job-entry .user-video-upload-box .user-box-title .user-job-company,
.page-desired-conditional-job-list .user-job .user-box-title .user-job-company,
.page-desired-conditional-job-list .user-video .user-box-title .user-job-company,
.page-desired-conditional-job-list .user-video-upload-box .user-box-title .user-job-company,
.page-reminder-notification .user-job .user-box-title .user-job-company,
.page-reminder-notification .user-video .user-box-title .user-job-company,
.page-reminder-notification .user-video-upload-box .user-box-title .user-job-company {
    font-size: 1.4rem;
    margin: 0
}

@media only screen and (max-width: 599px) {

    .page-mypage .user-job .user-box-title .user-job-company,
    .page-mypage .user-video .user-box-title .user-job-company,
    .page-mypage .user-video-upload-box .user-box-title .user-job-company,
    .page-history .user-job .user-box-title .user-job-company,
    .page-history .user-video .user-box-title .user-job-company,
    .page-history .user-video-upload-box .user-box-title .user-job-company,
    .page-mail .user-job .user-box-title .user-job-company,
    .page-mail .user-video .user-box-title .user-job-company,
    .page-mail .user-video-upload-box .user-box-title .user-job-company,
    .page-resume .user-job .user-box-title .user-job-company,
    .page-resume .user-video .user-box-title .user-job-company,
    .page-resume .user-video-upload-box .user-box-title .user-job-company,
    .page-appointment .user-job .user-box-title .user-job-company,
    .page-appointment .user-video .user-box-title .user-job-company,
    .page-appointment .user-video-upload-box .user-box-title .user-job-company,
    .page-online-interview-booking .user-job .user-box-title .user-job-company,
    .page-online-interview-booking .user-video .user-box-title .user-job-company,
    .page-online-interview-booking .user-video-upload-box .user-box-title .user-job-company,
    .page-account-setting .user-job .user-box-title .user-job-company,
    .page-account-setting .user-video .user-box-title .user-job-company,
    .page-account-setting .user-video-upload-box .user-box-title .user-job-company,
    .page-job-entry .user-job .user-box-title .user-job-company,
    .page-job-entry .user-video .user-box-title .user-job-company,
    .page-job-entry .user-video-upload-box .user-box-title .user-job-company,
    .page-desired-conditional-job-list .user-job .user-box-title .user-job-company,
    .page-desired-conditional-job-list .user-video .user-box-title .user-job-company,
    .page-desired-conditional-job-list .user-video-upload-box .user-box-title .user-job-company,
    .page-reminder-notification .user-job .user-box-title .user-job-company,
    .page-reminder-notification .user-video .user-box-title .user-job-company,
    .page-reminder-notification .user-video-upload-box .user-box-title .user-job-company {
        font-size: 1.2rem
    }
}

.page-mypage .user-job .user-job-photo,
.page-mypage .user-video .user-job-photo,
.page-mypage .user-video-upload-box .user-job-photo,
.page-history .user-job .user-job-photo,
.page-history .user-video .user-job-photo,
.page-history .user-video-upload-box .user-job-photo,
.page-mail .user-job .user-job-photo,
.page-mail .user-video .user-job-photo,
.page-mail .user-video-upload-box .user-job-photo,
.page-resume .user-job .user-job-photo,
.page-resume .user-video .user-job-photo,
.page-resume .user-video-upload-box .user-job-photo,
.page-appointment .user-job .user-job-photo,
.page-appointment .user-video .user-job-photo,
.page-appointment .user-video-upload-box .user-job-photo,
.page-online-interview-booking .user-job .user-job-photo,
.page-online-interview-booking .user-video .user-job-photo,
.page-online-interview-booking .user-video-upload-box .user-job-photo,
.page-account-setting .user-job .user-job-photo,
.page-account-setting .user-video .user-job-photo,
.page-account-setting .user-video-upload-box .user-job-photo,
.page-job-entry .user-job .user-job-photo,
.page-job-entry .user-video .user-job-photo,
.page-job-entry .user-video-upload-box .user-job-photo,
.page-desired-conditional-job-list .user-job .user-job-photo,
.page-desired-conditional-job-list .user-video .user-job-photo,
.page-desired-conditional-job-list .user-video-upload-box .user-job-photo,
.page-reminder-notification .user-job .user-job-photo,
.page-reminder-notification .user-video .user-job-photo,
.page-reminder-notification .user-video-upload-box .user-job-photo {
    width: 200px;
    height: 140px;
    background-color: #fff;
    border: 1px solid #6A6B6D;
    position: absolute;
    left: 0px;
    display: flex;
    justify-content: center;
    align-items: center
}

@media only screen and (max-width: 599px) {

    .page-mypage .user-job .user-job-photo,
    .page-mypage .user-video .user-job-photo,
    .page-mypage .user-video-upload-box .user-job-photo,
    .page-history .user-job .user-job-photo,
    .page-history .user-video .user-job-photo,
    .page-history .user-video-upload-box .user-job-photo,
    .page-mail .user-job .user-job-photo,
    .page-mail .user-video .user-job-photo,
    .page-mail .user-video-upload-box .user-job-photo,
    .page-resume .user-job .user-job-photo,
    .page-resume .user-video .user-job-photo,
    .page-resume .user-video-upload-box .user-job-photo,
    .page-appointment .user-job .user-job-photo,
    .page-appointment .user-video .user-job-photo,
    .page-appointment .user-video-upload-box .user-job-photo,
    .page-online-interview-booking .user-job .user-job-photo,
    .page-online-interview-booking .user-video .user-job-photo,
    .page-online-interview-booking .user-video-upload-box .user-job-photo,
    .page-account-setting .user-job .user-job-photo,
    .page-account-setting .user-video .user-job-photo,
    .page-account-setting .user-video-upload-box .user-job-photo,
    .page-job-entry .user-job .user-job-photo,
    .page-job-entry .user-video .user-job-photo,
    .page-job-entry .user-video-upload-box .user-job-photo,
    .page-desired-conditional-job-list .user-job .user-job-photo,
    .page-desired-conditional-job-list .user-video .user-job-photo,
    .page-desired-conditional-job-list .user-video-upload-box .user-job-photo,
    .page-reminder-notification .user-job .user-job-photo,
    .page-reminder-notification .user-video .user-job-photo,
    .page-reminder-notification .user-video-upload-box .user-job-photo {
        width: 100px;
        height: 70px
    }
}

.page-mypage .user-job .user-job-video,
.page-mypage .user-video .user-job-video,
.page-mypage .user-video-upload-box .user-job-video,
.page-history .user-job .user-job-video,
.page-history .user-video .user-job-video,
.page-history .user-video-upload-box .user-job-video,
.page-mail .user-job .user-job-video,
.page-mail .user-video .user-job-video,
.page-mail .user-video-upload-box .user-job-video,
.page-resume .user-job .user-job-video,
.page-resume .user-video .user-job-video,
.page-resume .user-video-upload-box .user-job-video,
.page-appointment .user-job .user-job-video,
.page-appointment .user-video .user-job-video,
.page-appointment .user-video-upload-box .user-job-video,
.page-online-interview-booking .user-job .user-job-video,
.page-online-interview-booking .user-video .user-job-video,
.page-online-interview-booking .user-video-upload-box .user-job-video,
.page-account-setting .user-job .user-job-video,
.page-account-setting .user-video .user-job-video,
.page-account-setting .user-video-upload-box .user-job-video,
.page-job-entry .user-job .user-job-video,
.page-job-entry .user-video .user-job-video,
.page-job-entry .user-video-upload-box .user-job-video,
.page-desired-conditional-job-list .user-job .user-job-video,
.page-desired-conditional-job-list .user-video .user-job-video,
.page-desired-conditional-job-list .user-video-upload-box .user-job-video,
.page-reminder-notification .user-job .user-job-video,
.page-reminder-notification .user-video .user-job-video,
.page-reminder-notification .user-video-upload-box .user-job-video {
    width: 200px;
    height: 140px;
    background-color: #d8d8d8;
    border: 1px solid #6A6B6D;
    position: absolute;
    left: 0px
}

@media only screen and (max-width: 599px) {

    .page-mypage .user-job .user-job-video,
    .page-mypage .user-video .user-job-video,
    .page-mypage .user-video-upload-box .user-job-video,
    .page-history .user-job .user-job-video,
    .page-history .user-video .user-job-video,
    .page-history .user-video-upload-box .user-job-video,
    .page-mail .user-job .user-job-video,
    .page-mail .user-video .user-job-video,
    .page-mail .user-video-upload-box .user-job-video,
    .page-resume .user-job .user-job-video,
    .page-resume .user-video .user-job-video,
    .page-resume .user-video-upload-box .user-job-video,
    .page-appointment .user-job .user-job-video,
    .page-appointment .user-video .user-job-video,
    .page-appointment .user-video-upload-box .user-job-video,
    .page-online-interview-booking .user-job .user-job-video,
    .page-online-interview-booking .user-video .user-job-video,
    .page-online-interview-booking .user-video-upload-box .user-job-video,
    .page-account-setting .user-job .user-job-video,
    .page-account-setting .user-video .user-job-video,
    .page-account-setting .user-video-upload-box .user-job-video,
    .page-job-entry .user-job .user-job-video,
    .page-job-entry .user-video .user-job-video,
    .page-job-entry .user-video-upload-box .user-job-video,
    .page-desired-conditional-job-list .user-job .user-job-video,
    .page-desired-conditional-job-list .user-video .user-job-video,
    .page-desired-conditional-job-list .user-video-upload-box .user-job-video,
    .page-reminder-notification .user-job .user-job-video,
    .page-reminder-notification .user-video .user-job-video,
    .page-reminder-notification .user-video-upload-box .user-job-video {
        width: 100%;
        height: auto;
        position: static;
        margin: 0 0 20px
    }
}

.page-mypage .user-job .user-job-video>a,
.page-mypage .user-video .user-job-video>a,
.page-mypage .user-video-upload-box .user-job-video>a,
.page-history .user-job .user-job-video>a,
.page-history .user-video .user-job-video>a,
.page-history .user-video-upload-box .user-job-video>a,
.page-mail .user-job .user-job-video>a,
.page-mail .user-video .user-job-video>a,
.page-mail .user-video-upload-box .user-job-video>a,
.page-resume .user-job .user-job-video>a,
.page-resume .user-video .user-job-video>a,
.page-resume .user-video-upload-box .user-job-video>a,
.page-appointment .user-job .user-job-video>a,
.page-appointment .user-video .user-job-video>a,
.page-appointment .user-video-upload-box .user-job-video>a,
.page-online-interview-booking .user-job .user-job-video>a,
.page-online-interview-booking .user-video .user-job-video>a,
.page-online-interview-booking .user-video-upload-box .user-job-video>a,
.page-account-setting .user-job .user-job-video>a,
.page-account-setting .user-video .user-job-video>a,
.page-account-setting .user-video-upload-box .user-job-video>a,
.page-job-entry .user-job .user-job-video>a,
.page-job-entry .user-video .user-job-video>a,
.page-job-entry .user-video-upload-box .user-job-video>a,
.page-desired-conditional-job-list .user-job .user-job-video>a,
.page-desired-conditional-job-list .user-video .user-job-video>a,
.page-desired-conditional-job-list .user-video-upload-box .user-job-video>a,
.page-reminder-notification .user-job .user-job-video>a,
.page-reminder-notification .user-video .user-job-video>a,
.page-reminder-notification .user-video-upload-box .user-job-video>a {
    display: block;
    width: 100%;
    height: 100%
}

.page-mypage .user-job .user-job-video img,
.page-mypage .user-video .user-job-video img,
.page-mypage .user-video-upload-box .user-job-video img,
.page-history .user-job .user-job-video img,
.page-history .user-video .user-job-video img,
.page-history .user-video-upload-box .user-job-video img,
.page-mail .user-job .user-job-video img,
.page-mail .user-video .user-job-video img,
.page-mail .user-video-upload-box .user-job-video img,
.page-resume .user-job .user-job-video img,
.page-resume .user-video .user-job-video img,
.page-resume .user-video-upload-box .user-job-video img,
.page-appointment .user-job .user-job-video img,
.page-appointment .user-video .user-job-video img,
.page-appointment .user-video-upload-box .user-job-video img,
.page-online-interview-booking .user-job .user-job-video img,
.page-online-interview-booking .user-video .user-job-video img,
.page-online-interview-booking .user-video-upload-box .user-job-video img,
.page-account-setting .user-job .user-job-video img,
.page-account-setting .user-video .user-job-video img,
.page-account-setting .user-video-upload-box .user-job-video img,
.page-job-entry .user-job .user-job-video img,
.page-job-entry .user-video .user-job-video img,
.page-job-entry .user-video-upload-box .user-job-video img,
.page-desired-conditional-job-list .user-job .user-job-video img,
.page-desired-conditional-job-list .user-video .user-job-video img,
.page-desired-conditional-job-list .user-video-upload-box .user-job-video img,
.page-reminder-notification .user-job .user-job-video img,
.page-reminder-notification .user-video .user-job-video img,
.page-reminder-notification .user-video-upload-box .user-job-video img {
    width: 100%;
    height: 100%
}

.page-mypage .user-job .user-job-video a:focus,
.page-mypage .user-job .user-job-video a:active,
.page-mypage .user-video .user-job-video a:focus,
.page-mypage .user-video .user-job-video a:active,
.page-mypage .user-video-upload-box .user-job-video a:focus,
.page-mypage .user-video-upload-box .user-job-video a:active,
.page-history .user-job .user-job-video a:focus,
.page-history .user-job .user-job-video a:active,
.page-history .user-video .user-job-video a:focus,
.page-history .user-video .user-job-video a:active,
.page-history .user-video-upload-box .user-job-video a:focus,
.page-history .user-video-upload-box .user-job-video a:active,
.page-mail .user-job .user-job-video a:focus,
.page-mail .user-job .user-job-video a:active,
.page-mail .user-video .user-job-video a:focus,
.page-mail .user-video .user-job-video a:active,
.page-mail .user-video-upload-box .user-job-video a:focus,
.page-mail .user-video-upload-box .user-job-video a:active,
.page-resume .user-job .user-job-video a:focus,
.page-resume .user-job .user-job-video a:active,
.page-resume .user-video .user-job-video a:focus,
.page-resume .user-video .user-job-video a:active,
.page-resume .user-video-upload-box .user-job-video a:focus,
.page-resume .user-video-upload-box .user-job-video a:active,
.page-appointment .user-job .user-job-video a:focus,
.page-appointment .user-job .user-job-video a:active,
.page-appointment .user-video .user-job-video a:focus,
.page-appointment .user-video .user-job-video a:active,
.page-appointment .user-video-upload-box .user-job-video a:focus,
.page-appointment .user-video-upload-box .user-job-video a:active,
.page-online-interview-booking .user-job .user-job-video a:focus,
.page-online-interview-booking .user-job .user-job-video a:active,
.page-online-interview-booking .user-video .user-job-video a:focus,
.page-online-interview-booking .user-video .user-job-video a:active,
.page-online-interview-booking .user-video-upload-box .user-job-video a:focus,
.page-online-interview-booking .user-video-upload-box .user-job-video a:active,
.page-account-setting .user-job .user-job-video a:focus,
.page-account-setting .user-job .user-job-video a:active,
.page-account-setting .user-video .user-job-video a:focus,
.page-account-setting .user-video .user-job-video a:active,
.page-account-setting .user-video-upload-box .user-job-video a:focus,
.page-account-setting .user-video-upload-box .user-job-video a:active,
.page-job-entry .user-job .user-job-video a:focus,
.page-job-entry .user-job .user-job-video a:active,
.page-job-entry .user-video .user-job-video a:focus,
.page-job-entry .user-video .user-job-video a:active,
.page-job-entry .user-video-upload-box .user-job-video a:focus,
.page-job-entry .user-video-upload-box .user-job-video a:active,
.page-desired-conditional-job-list .user-job .user-job-video a:focus,
.page-desired-conditional-job-list .user-job .user-job-video a:active,
.page-desired-conditional-job-list .user-video .user-job-video a:focus,
.page-desired-conditional-job-list .user-video .user-job-video a:active,
.page-desired-conditional-job-list .user-video-upload-box .user-job-video a:focus,
.page-desired-conditional-job-list .user-video-upload-box .user-job-video a:active,
.page-reminder-notification .user-job .user-job-video a:focus,
.page-reminder-notification .user-job .user-job-video a:active,
.page-reminder-notification .user-video .user-job-video a:focus,
.page-reminder-notification .user-video .user-job-video a:active,
.page-reminder-notification .user-video-upload-box .user-job-video a:focus,
.page-reminder-notification .user-video-upload-box .user-job-video a:active {
    outline: 0;
    text-decoration: none
}

.page-mypage .user-job dl,
.page-mypage .user-video dl,
.page-mypage .user-video-upload-box dl,
.page-history .user-job dl,
.page-history .user-video dl,
.page-history .user-video-upload-box dl,
.page-mail .user-job dl,
.page-mail .user-video dl,
.page-mail .user-video-upload-box dl,
.page-resume .user-job dl,
.page-resume .user-video dl,
.page-resume .user-video-upload-box dl,
.page-appointment .user-job dl,
.page-appointment .user-video dl,
.page-appointment .user-video-upload-box dl,
.page-online-interview-booking .user-job dl,
.page-online-interview-booking .user-video dl,
.page-online-interview-booking .user-video-upload-box dl,
.page-account-setting .user-job dl,
.page-account-setting .user-video dl,
.page-account-setting .user-video-upload-box dl,
.page-job-entry .user-job dl,
.page-job-entry .user-video dl,
.page-job-entry .user-video-upload-box dl,
.page-desired-conditional-job-list .user-job dl,
.page-desired-conditional-job-list .user-video dl,
.page-desired-conditional-job-list .user-video-upload-box dl,
.page-reminder-notification .user-job dl,
.page-reminder-notification .user-video dl,
.page-reminder-notification .user-video-upload-box dl {
    margin: 0;
    display: -webkit-flex;
    display: flex;
    flex-wrap: wrap;
    margin: 0;
    align-items: flex-start;
    padding-top: 20px;
    color: #000
}

.page-mypage .user-job dl dt,
.page-mypage .user-video dl dt,
.page-mypage .user-video-upload-box dl dt,
.page-history .user-job dl dt,
.page-history .user-video dl dt,
.page-history .user-video-upload-box dl dt,
.page-mail .user-job dl dt,
.page-mail .user-video dl dt,
.page-mail .user-video-upload-box dl dt,
.page-resume .user-job dl dt,
.page-resume .user-video dl dt,
.page-resume .user-video-upload-box dl dt,
.page-appointment .user-job dl dt,
.page-appointment .user-video dl dt,
.page-appointment .user-video-upload-box dl dt,
.page-online-interview-booking .user-job dl dt,
.page-online-interview-booking .user-video dl dt,
.page-online-interview-booking .user-video-upload-box dl dt,
.page-account-setting .user-job dl dt,
.page-account-setting .user-video dl dt,
.page-account-setting .user-video-upload-box dl dt,
.page-job-entry .user-job dl dt,
.page-job-entry .user-video dl dt,
.page-job-entry .user-video-upload-box dl dt,
.page-desired-conditional-job-list .user-job dl dt,
.page-desired-conditional-job-list .user-video dl dt,
.page-desired-conditional-job-list .user-video-upload-box dl dt,
.page-reminder-notification .user-job dl dt,
.page-reminder-notification .user-video dl dt,
.page-reminder-notification .user-video-upload-box dl dt {
    position: relative;
    width: 9em;
    border: 1px solid #3a50c9;
    font-size: 1.2rem;
    margin: 0 0 20px 0;
    padding: 5px 0 5px 30px;
    margin-right: 20px;
    font-weight: normal;
    text-align: left
}

@media only screen and (max-width: 864px) {

    .page-mypage .user-job dl dt,
    .page-mypage .user-video dl dt,
    .page-mypage .user-video-upload-box dl dt,
    .page-history .user-job dl dt,
    .page-history .user-video dl dt,
    .page-history .user-video-upload-box dl dt,
    .page-mail .user-job dl dt,
    .page-mail .user-video dl dt,
    .page-mail .user-video-upload-box dl dt,
    .page-resume .user-job dl dt,
    .page-resume .user-video dl dt,
    .page-resume .user-video-upload-box dl dt,
    .page-appointment .user-job dl dt,
    .page-appointment .user-video dl dt,
    .page-appointment .user-video-upload-box dl dt,
    .page-online-interview-booking .user-job dl dt,
    .page-online-interview-booking .user-video dl dt,
    .page-online-interview-booking .user-video-upload-box dl dt,
    .page-account-setting .user-job dl dt,
    .page-account-setting .user-video dl dt,
    .page-account-setting .user-video-upload-box dl dt,
    .page-job-entry .user-job dl dt,
    .page-job-entry .user-video dl dt,
    .page-job-entry .user-video-upload-box dl dt,
    .page-desired-conditional-job-list .user-job dl dt,
    .page-desired-conditional-job-list .user-video dl dt,
    .page-desired-conditional-job-list .user-video-upload-box dl dt,
    .page-reminder-notification .user-job dl dt,
    .page-reminder-notification .user-video dl dt,
    .page-reminder-notification .user-video-upload-box dl dt {
        padding: 5px 0 5px 27px;
        margin: 0 0 10px;
        width: 8em
    }
}

.page-mypage .user-job dl dt:nth-child(4n-1),
.page-mypage .user-video dl dt:nth-child(4n-1),
.page-mypage .user-video-upload-box dl dt:nth-child(4n-1),
.page-history .user-job dl dt:nth-child(4n-1),
.page-history .user-video dl dt:nth-child(4n-1),
.page-history .user-video-upload-box dl dt:nth-child(4n-1),
.page-mail .user-job dl dt:nth-child(4n-1),
.page-mail .user-video dl dt:nth-child(4n-1),
.page-mail .user-video-upload-box dl dt:nth-child(4n-1),
.page-resume .user-job dl dt:nth-child(4n-1),
.page-resume .user-video dl dt:nth-child(4n-1),
.page-resume .user-video-upload-box dl dt:nth-child(4n-1),
.page-appointment .user-job dl dt:nth-child(4n-1),
.page-appointment .user-video dl dt:nth-child(4n-1),
.page-appointment .user-video-upload-box dl dt:nth-child(4n-1),
.page-online-interview-booking .user-job dl dt:nth-child(4n-1),
.page-online-interview-booking .user-video dl dt:nth-child(4n-1),
.page-online-interview-booking .user-video-upload-box dl dt:nth-child(4n-1),
.page-account-setting .user-job dl dt:nth-child(4n-1),
.page-account-setting .user-video dl dt:nth-child(4n-1),
.page-account-setting .user-video-upload-box dl dt:nth-child(4n-1),
.page-job-entry .user-job dl dt:nth-child(4n-1),
.page-job-entry .user-video dl dt:nth-child(4n-1),
.page-job-entry .user-video-upload-box dl dt:nth-child(4n-1),
.page-desired-conditional-job-list .user-job dl dt:nth-child(4n-1),
.page-desired-conditional-job-list .user-video dl dt:nth-child(4n-1),
.page-desired-conditional-job-list .user-video-upload-box dl dt:nth-child(4n-1),
.page-reminder-notification .user-job dl dt:nth-child(4n-1),
.page-reminder-notification .user-video dl dt:nth-child(4n-1),
.page-reminder-notification .user-video-upload-box dl dt:nth-child(4n-1) {
    margin-left: 30px
}

@media only screen and (max-width: 864px) {

    .page-mypage .user-job dl dt:nth-child(4n-1),
    .page-mypage .user-video dl dt:nth-child(4n-1),
    .page-mypage .user-video-upload-box dl dt:nth-child(4n-1),
    .page-history .user-job dl dt:nth-child(4n-1),
    .page-history .user-video dl dt:nth-child(4n-1),
    .page-history .user-video-upload-box dl dt:nth-child(4n-1),
    .page-mail .user-job dl dt:nth-child(4n-1),
    .page-mail .user-video dl dt:nth-child(4n-1),
    .page-mail .user-video-upload-box dl dt:nth-child(4n-1),
    .page-resume .user-job dl dt:nth-child(4n-1),
    .page-resume .user-video dl dt:nth-child(4n-1),
    .page-resume .user-video-upload-box dl dt:nth-child(4n-1),
    .page-appointment .user-job dl dt:nth-child(4n-1),
    .page-appointment .user-video dl dt:nth-child(4n-1),
    .page-appointment .user-video-upload-box dl dt:nth-child(4n-1),
    .page-online-interview-booking .user-job dl dt:nth-child(4n-1),
    .page-online-interview-booking .user-video dl dt:nth-child(4n-1),
    .page-online-interview-booking .user-video-upload-box dl dt:nth-child(4n-1),
    .page-account-setting .user-job dl dt:nth-child(4n-1),
    .page-account-setting .user-video dl dt:nth-child(4n-1),
    .page-account-setting .user-video-upload-box dl dt:nth-child(4n-1),
    .page-job-entry .user-job dl dt:nth-child(4n-1),
    .page-job-entry .user-video dl dt:nth-child(4n-1),
    .page-job-entry .user-video-upload-box dl dt:nth-child(4n-1),
    .page-desired-conditional-job-list .user-job dl dt:nth-child(4n-1),
    .page-desired-conditional-job-list .user-video dl dt:nth-child(4n-1),
    .page-desired-conditional-job-list .user-video-upload-box dl dt:nth-child(4n-1),
    .page-reminder-notification .user-job dl dt:nth-child(4n-1),
    .page-reminder-notification .user-video dl dt:nth-child(4n-1),
    .page-reminder-notification .user-video-upload-box dl dt:nth-child(4n-1) {
        margin-left: 0
    }
}

.page-mypage .user-job dl dt::before,
.page-mypage .user-video dl dt::before,
.page-mypage .user-video-upload-box dl dt::before,
.page-history .user-job dl dt::before,
.page-history .user-video dl dt::before,
.page-history .user-video-upload-box dl dt::before,
.page-mail .user-job dl dt::before,
.page-mail .user-video dl dt::before,
.page-mail .user-video-upload-box dl dt::before,
.page-resume .user-job dl dt::before,
.page-resume .user-video dl dt::before,
.page-resume .user-video-upload-box dl dt::before,
.page-appointment .user-job dl dt::before,
.page-appointment .user-video dl dt::before,
.page-appointment .user-video-upload-box dl dt::before,
.page-online-interview-booking .user-job dl dt::before,
.page-online-interview-booking .user-video dl dt::before,
.page-online-interview-booking .user-video-upload-box dl dt::before,
.page-account-setting .user-job dl dt::before,
.page-account-setting .user-video dl dt::before,
.page-account-setting .user-video-upload-box dl dt::before,
.page-job-entry .user-job dl dt::before,
.page-job-entry .user-video dl dt::before,
.page-job-entry .user-video-upload-box dl dt::before,
.page-desired-conditional-job-list .user-job dl dt::before,
.page-desired-conditional-job-list .user-video dl dt::before,
.page-desired-conditional-job-list .user-video-upload-box dl dt::before,
.page-reminder-notification .user-job dl dt::before,
.page-reminder-notification .user-video dl dt::before,
.page-reminder-notification .user-video-upload-box dl dt::before {
    content: "";
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    position: absolute;
    color: #3a50c9;
    top: 50%;
    margin-top: -0.5em;
    left: 8px;
    font-size: 1.6rem
}

@media only screen and (max-width: 864px) {

    .page-mypage .user-job dl dt::before,
    .page-mypage .user-video dl dt::before,
    .page-mypage .user-video-upload-box dl dt::before,
    .page-history .user-job dl dt::before,
    .page-history .user-video dl dt::before,
    .page-history .user-video-upload-box dl dt::before,
    .page-mail .user-job dl dt::before,
    .page-mail .user-video dl dt::before,
    .page-mail .user-video-upload-box dl dt::before,
    .page-resume .user-job dl dt::before,
    .page-resume .user-video dl dt::before,
    .page-resume .user-video-upload-box dl dt::before,
    .page-appointment .user-job dl dt::before,
    .page-appointment .user-video dl dt::before,
    .page-appointment .user-video-upload-box dl dt::before,
    .page-online-interview-booking .user-job dl dt::before,
    .page-online-interview-booking .user-video dl dt::before,
    .page-online-interview-booking .user-video-upload-box dl dt::before,
    .page-account-setting .user-job dl dt::before,
    .page-account-setting .user-video dl dt::before,
    .page-account-setting .user-video-upload-box dl dt::before,
    .page-job-entry .user-job dl dt::before,
    .page-job-entry .user-video dl dt::before,
    .page-job-entry .user-video-upload-box dl dt::before,
    .page-desired-conditional-job-list .user-job dl dt::before,
    .page-desired-conditional-job-list .user-video dl dt::before,
    .page-desired-conditional-job-list .user-video-upload-box dl dt::before,
    .page-reminder-notification .user-job dl dt::before,
    .page-reminder-notification .user-video dl dt::before,
    .page-reminder-notification .user-video-upload-box dl dt::before {
        left: 5px
    }
}

.page-mypage .user-job dl .user-job-detail-title-01::before,
.page-mypage .user-video dl .user-job-detail-title-01::before,
.page-mypage .user-video-upload-box dl .user-job-detail-title-01::before,
.page-history .user-job dl .user-job-detail-title-01::before,
.page-history .user-video dl .user-job-detail-title-01::before,
.page-history .user-video-upload-box dl .user-job-detail-title-01::before,
.page-mail .user-job dl .user-job-detail-title-01::before,
.page-mail .user-video dl .user-job-detail-title-01::before,
.page-mail .user-video-upload-box dl .user-job-detail-title-01::before,
.page-resume .user-job dl .user-job-detail-title-01::before,
.page-resume .user-video dl .user-job-detail-title-01::before,
.page-resume .user-video-upload-box dl .user-job-detail-title-01::before,
.page-appointment .user-job dl .user-job-detail-title-01::before,
.page-appointment .user-video dl .user-job-detail-title-01::before,
.page-appointment .user-video-upload-box dl .user-job-detail-title-01::before,
.page-online-interview-booking .user-job dl .user-job-detail-title-01::before,
.page-online-interview-booking .user-video dl .user-job-detail-title-01::before,
.page-online-interview-booking .user-video-upload-box dl .user-job-detail-title-01::before,
.page-account-setting .user-job dl .user-job-detail-title-01::before,
.page-account-setting .user-video dl .user-job-detail-title-01::before,
.page-account-setting .user-video-upload-box dl .user-job-detail-title-01::before,
.page-job-entry .user-job dl .user-job-detail-title-01::before,
.page-job-entry .user-video dl .user-job-detail-title-01::before,
.page-job-entry .user-video-upload-box dl .user-job-detail-title-01::before,
.page-desired-conditional-job-list .user-job dl .user-job-detail-title-01::before,
.page-desired-conditional-job-list .user-video dl .user-job-detail-title-01::before,
.page-desired-conditional-job-list .user-video-upload-box dl .user-job-detail-title-01::before,
.page-reminder-notification .user-job dl .user-job-detail-title-01::before,
.page-reminder-notification .user-video dl .user-job-detail-title-01::before,
.page-reminder-notification .user-video-upload-box dl .user-job-detail-title-01::before {
    content: "account_balance"
}

.page-mypage .user-job dl .user-job-detail-title-02::before,
.page-mypage .user-video dl .user-job-detail-title-02::before,
.page-mypage .user-video-upload-box dl .user-job-detail-title-02::before,
.page-history .user-job dl .user-job-detail-title-02::before,
.page-history .user-video dl .user-job-detail-title-02::before,
.page-history .user-video-upload-box dl .user-job-detail-title-02::before,
.page-mail .user-job dl .user-job-detail-title-02::before,
.page-mail .user-video dl .user-job-detail-title-02::before,
.page-mail .user-video-upload-box dl .user-job-detail-title-02::before,
.page-resume .user-job dl .user-job-detail-title-02::before,
.page-resume .user-video dl .user-job-detail-title-02::before,
.page-resume .user-video-upload-box dl .user-job-detail-title-02::before,
.page-appointment .user-job dl .user-job-detail-title-02::before,
.page-appointment .user-video dl .user-job-detail-title-02::before,
.page-appointment .user-video-upload-box dl .user-job-detail-title-02::before,
.page-online-interview-booking .user-job dl .user-job-detail-title-02::before,
.page-online-interview-booking .user-video dl .user-job-detail-title-02::before,
.page-online-interview-booking .user-video-upload-box dl .user-job-detail-title-02::before,
.page-account-setting .user-job dl .user-job-detail-title-02::before,
.page-account-setting .user-video dl .user-job-detail-title-02::before,
.page-account-setting .user-video-upload-box dl .user-job-detail-title-02::before,
.page-job-entry .user-job dl .user-job-detail-title-02::before,
.page-job-entry .user-video dl .user-job-detail-title-02::before,
.page-job-entry .user-video-upload-box dl .user-job-detail-title-02::before,
.page-desired-conditional-job-list .user-job dl .user-job-detail-title-02::before,
.page-desired-conditional-job-list .user-video dl .user-job-detail-title-02::before,
.page-desired-conditional-job-list .user-video-upload-box dl .user-job-detail-title-02::before,
.page-reminder-notification .user-job dl .user-job-detail-title-02::before,
.page-reminder-notification .user-video dl .user-job-detail-title-02::before,
.page-reminder-notification .user-video-upload-box dl .user-job-detail-title-02::before {
    content: "translate"
}

.page-mypage .user-job dl .user-job-detail-title-03::before,
.page-mypage .user-video dl .user-job-detail-title-03::before,
.page-mypage .user-video-upload-box dl .user-job-detail-title-03::before,
.page-history .user-job dl .user-job-detail-title-03::before,
.page-history .user-video dl .user-job-detail-title-03::before,
.page-history .user-video-upload-box dl .user-job-detail-title-03::before,
.page-mail .user-job dl .user-job-detail-title-03::before,
.page-mail .user-video dl .user-job-detail-title-03::before,
.page-mail .user-video-upload-box dl .user-job-detail-title-03::before,
.page-resume .user-job dl .user-job-detail-title-03::before,
.page-resume .user-video dl .user-job-detail-title-03::before,
.page-resume .user-video-upload-box dl .user-job-detail-title-03::before,
.page-appointment .user-job dl .user-job-detail-title-03::before,
.page-appointment .user-video dl .user-job-detail-title-03::before,
.page-appointment .user-video-upload-box dl .user-job-detail-title-03::before,
.page-online-interview-booking .user-job dl .user-job-detail-title-03::before,
.page-online-interview-booking .user-video dl .user-job-detail-title-03::before,
.page-online-interview-booking .user-video-upload-box dl .user-job-detail-title-03::before,
.page-account-setting .user-job dl .user-job-detail-title-03::before,
.page-account-setting .user-video dl .user-job-detail-title-03::before,
.page-account-setting .user-video-upload-box dl .user-job-detail-title-03::before,
.page-job-entry .user-job dl .user-job-detail-title-03::before,
.page-job-entry .user-video dl .user-job-detail-title-03::before,
.page-job-entry .user-video-upload-box dl .user-job-detail-title-03::before,
.page-desired-conditional-job-list .user-job dl .user-job-detail-title-03::before,
.page-desired-conditional-job-list .user-video dl .user-job-detail-title-03::before,
.page-desired-conditional-job-list .user-video-upload-box dl .user-job-detail-title-03::before,
.page-reminder-notification .user-job dl .user-job-detail-title-03::before,
.page-reminder-notification .user-video dl .user-job-detail-title-03::before,
.page-reminder-notification .user-video-upload-box dl .user-job-detail-title-03::before {
    content: "work"
}

.page-mypage .user-job dl .user-job-detail-title-04::before,
.page-mypage .user-video dl .user-job-detail-title-04::before,
.page-mypage .user-video-upload-box dl .user-job-detail-title-04::before,
.page-history .user-job dl .user-job-detail-title-04::before,
.page-history .user-video dl .user-job-detail-title-04::before,
.page-history .user-video-upload-box dl .user-job-detail-title-04::before,
.page-mail .user-job dl .user-job-detail-title-04::before,
.page-mail .user-video dl .user-job-detail-title-04::before,
.page-mail .user-video-upload-box dl .user-job-detail-title-04::before,
.page-resume .user-job dl .user-job-detail-title-04::before,
.page-resume .user-video dl .user-job-detail-title-04::before,
.page-resume .user-video-upload-box dl .user-job-detail-title-04::before,
.page-appointment .user-job dl .user-job-detail-title-04::before,
.page-appointment .user-video dl .user-job-detail-title-04::before,
.page-appointment .user-video-upload-box dl .user-job-detail-title-04::before,
.page-online-interview-booking .user-job dl .user-job-detail-title-04::before,
.page-online-interview-booking .user-video dl .user-job-detail-title-04::before,
.page-online-interview-booking .user-video-upload-box dl .user-job-detail-title-04::before,
.page-account-setting .user-job dl .user-job-detail-title-04::before,
.page-account-setting .user-video dl .user-job-detail-title-04::before,
.page-account-setting .user-video-upload-box dl .user-job-detail-title-04::before,
.page-job-entry .user-job dl .user-job-detail-title-04::before,
.page-job-entry .user-video dl .user-job-detail-title-04::before,
.page-job-entry .user-video-upload-box dl .user-job-detail-title-04::before,
.page-desired-conditional-job-list .user-job dl .user-job-detail-title-04::before,
.page-desired-conditional-job-list .user-video dl .user-job-detail-title-04::before,
.page-desired-conditional-job-list .user-video-upload-box dl .user-job-detail-title-04::before,
.page-reminder-notification .user-job dl .user-job-detail-title-04::before,
.page-reminder-notification .user-video dl .user-job-detail-title-04::before,
.page-reminder-notification .user-video-upload-box dl .user-job-detail-title-04::before {
    content: "class"
}

.page-mypage .user-job dl .user-job-detail-title-05::before,
.page-mypage .user-video dl .user-job-detail-title-05::before,
.page-mypage .user-video-upload-box dl .user-job-detail-title-05::before,
.page-history .user-job dl .user-job-detail-title-05::before,
.page-history .user-video dl .user-job-detail-title-05::before,
.page-history .user-video-upload-box dl .user-job-detail-title-05::before,
.page-mail .user-job dl .user-job-detail-title-05::before,
.page-mail .user-video dl .user-job-detail-title-05::before,
.page-mail .user-video-upload-box dl .user-job-detail-title-05::before,
.page-resume .user-job dl .user-job-detail-title-05::before,
.page-resume .user-video dl .user-job-detail-title-05::before,
.page-resume .user-video-upload-box dl .user-job-detail-title-05::before,
.page-appointment .user-job dl .user-job-detail-title-05::before,
.page-appointment .user-video dl .user-job-detail-title-05::before,
.page-appointment .user-video-upload-box dl .user-job-detail-title-05::before,
.page-online-interview-booking .user-job dl .user-job-detail-title-05::before,
.page-online-interview-booking .user-video dl .user-job-detail-title-05::before,
.page-online-interview-booking .user-video-upload-box dl .user-job-detail-title-05::before,
.page-account-setting .user-job dl .user-job-detail-title-05::before,
.page-account-setting .user-video dl .user-job-detail-title-05::before,
.page-account-setting .user-video-upload-box dl .user-job-detail-title-05::before,
.page-job-entry .user-job dl .user-job-detail-title-05::before,
.page-job-entry .user-video dl .user-job-detail-title-05::before,
.page-job-entry .user-video-upload-box dl .user-job-detail-title-05::before,
.page-desired-conditional-job-list .user-job dl .user-job-detail-title-05::before,
.page-desired-conditional-job-list .user-video dl .user-job-detail-title-05::before,
.page-desired-conditional-job-list .user-video-upload-box dl .user-job-detail-title-05::before,
.page-reminder-notification .user-job dl .user-job-detail-title-05::before,
.page-reminder-notification .user-video dl .user-job-detail-title-05::before,
.page-reminder-notification .user-video-upload-box dl .user-job-detail-title-05::before {
    content: "room"
}

.page-mypage .user-job dl .user-job-detail-title-06::before,
.page-mypage .user-video dl .user-job-detail-title-06::before,
.page-mypage .user-video-upload-box dl .user-job-detail-title-06::before,
.page-history .user-job dl .user-job-detail-title-06::before,
.page-history .user-video dl .user-job-detail-title-06::before,
.page-history .user-video-upload-box dl .user-job-detail-title-06::before,
.page-mail .user-job dl .user-job-detail-title-06::before,
.page-mail .user-video dl .user-job-detail-title-06::before,
.page-mail .user-video-upload-box dl .user-job-detail-title-06::before,
.page-resume .user-job dl .user-job-detail-title-06::before,
.page-resume .user-video dl .user-job-detail-title-06::before,
.page-resume .user-video-upload-box dl .user-job-detail-title-06::before,
.page-appointment .user-job dl .user-job-detail-title-06::before,
.page-appointment .user-video dl .user-job-detail-title-06::before,
.page-appointment .user-video-upload-box dl .user-job-detail-title-06::before,
.page-online-interview-booking .user-job dl .user-job-detail-title-06::before,
.page-online-interview-booking .user-video dl .user-job-detail-title-06::before,
.page-online-interview-booking .user-video-upload-box dl .user-job-detail-title-06::before,
.page-account-setting .user-job dl .user-job-detail-title-06::before,
.page-account-setting .user-video dl .user-job-detail-title-06::before,
.page-account-setting .user-video-upload-box dl .user-job-detail-title-06::before,
.page-job-entry .user-job dl .user-job-detail-title-06::before,
.page-job-entry .user-video dl .user-job-detail-title-06::before,
.page-job-entry .user-video-upload-box dl .user-job-detail-title-06::before,
.page-desired-conditional-job-list .user-job dl .user-job-detail-title-06::before,
.page-desired-conditional-job-list .user-video dl .user-job-detail-title-06::before,
.page-desired-conditional-job-list .user-video-upload-box dl .user-job-detail-title-06::before,
.page-reminder-notification .user-job dl .user-job-detail-title-06::before,
.page-reminder-notification .user-video dl .user-job-detail-title-06::before,
.page-reminder-notification .user-video-upload-box dl .user-job-detail-title-06::before {
    content: "school"
}

.page-mypage .user-job dl dd,
.page-mypage .user-video dl dd,
.page-mypage .user-video-upload-box dl dd,
.page-history .user-job dl dd,
.page-history .user-video dl dd,
.page-history .user-video-upload-box dl dd,
.page-mail .user-job dl dd,
.page-mail .user-video dl dd,
.page-mail .user-video-upload-box dl dd,
.page-resume .user-job dl dd,
.page-resume .user-video dl dd,
.page-resume .user-video-upload-box dl dd,
.page-appointment .user-job dl dd,
.page-appointment .user-video dl dd,
.page-appointment .user-video-upload-box dl dd,
.page-online-interview-booking .user-job dl dd,
.page-online-interview-booking .user-video dl dd,
.page-online-interview-booking .user-video-upload-box dl dd,
.page-account-setting .user-job dl dd,
.page-account-setting .user-video dl dd,
.page-account-setting .user-video-upload-box dl dd,
.page-job-entry .user-job dl dd,
.page-job-entry .user-video dl dd,
.page-job-entry .user-video-upload-box dl dd,
.page-desired-conditional-job-list .user-job dl dd,
.page-desired-conditional-job-list .user-video dl dd,
.page-desired-conditional-job-list .user-video-upload-box dl dd,
.page-reminder-notification .user-job dl dd,
.page-reminder-notification .user-video dl dd,
.page-reminder-notification .user-video-upload-box dl dd {
    width: calc(44% - 9em);
    font-size: 1.2rem;
    margin: 0 0 20px 0;
    line-height: 1.4
}

@media only screen and (max-width: 864px) {

    .page-mypage .user-job dl dd,
    .page-mypage .user-video dl dd,
    .page-mypage .user-video-upload-box dl dd,
    .page-history .user-job dl dd,
    .page-history .user-video dl dd,
    .page-history .user-video-upload-box dl dd,
    .page-mail .user-job dl dd,
    .page-mail .user-video dl dd,
    .page-mail .user-video-upload-box dl dd,
    .page-resume .user-job dl dd,
    .page-resume .user-video dl dd,
    .page-resume .user-video-upload-box dl dd,
    .page-appointment .user-job dl dd,
    .page-appointment .user-video dl dd,
    .page-appointment .user-video-upload-box dl dd,
    .page-online-interview-booking .user-job dl dd,
    .page-online-interview-booking .user-video dl dd,
    .page-online-interview-booking .user-video-upload-box dl dd,
    .page-account-setting .user-job dl dd,
    .page-account-setting .user-video dl dd,
    .page-account-setting .user-video-upload-box dl dd,
    .page-job-entry .user-job dl dd,
    .page-job-entry .user-video dl dd,
    .page-job-entry .user-video-upload-box dl dd,
    .page-desired-conditional-job-list .user-job dl dd,
    .page-desired-conditional-job-list .user-video dl dd,
    .page-desired-conditional-job-list .user-video-upload-box dl dd,
    .page-reminder-notification .user-job dl dd,
    .page-reminder-notification .user-video dl dd,
    .page-reminder-notification .user-video-upload-box dl dd {
        width: calc(100% - 9em);
        padding: 0 0 5px 10px
    }
}

.page-mypage .user-job .user-job-footer,
.page-mypage .user-video .user-job-footer,
.page-mypage .user-video-upload-box .user-job-footer,
.page-history .user-job .user-job-footer,
.page-history .user-video .user-job-footer,
.page-history .user-video-upload-box .user-job-footer,
.page-mail .user-job .user-job-footer,
.page-mail .user-video .user-job-footer,
.page-mail .user-video-upload-box .user-job-footer,
.page-resume .user-job .user-job-footer,
.page-resume .user-video .user-job-footer,
.page-resume .user-video-upload-box .user-job-footer,
.page-appointment .user-job .user-job-footer,
.page-appointment .user-video .user-job-footer,
.page-appointment .user-video-upload-box .user-job-footer,
.page-online-interview-booking .user-job .user-job-footer,
.page-online-interview-booking .user-video .user-job-footer,
.page-online-interview-booking .user-video-upload-box .user-job-footer,
.page-account-setting .user-job .user-job-footer,
.page-account-setting .user-video .user-job-footer,
.page-account-setting .user-video-upload-box .user-job-footer,
.page-job-entry .user-job .user-job-footer,
.page-job-entry .user-video .user-job-footer,
.page-job-entry .user-video-upload-box .user-job-footer,
.page-desired-conditional-job-list .user-job .user-job-footer,
.page-desired-conditional-job-list .user-video .user-job-footer,
.page-desired-conditional-job-list .user-video-upload-box .user-job-footer,
.page-reminder-notification .user-job .user-job-footer,
.page-reminder-notification .user-video .user-job-footer,
.page-reminder-notification .user-video-upload-box .user-job-footer {
    padding: 10px 20px;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: flex-end;
    justify-content: flex-end
}

@media only screen and (max-width: 599px) {

    .page-mypage .user-job .user-job-footer,
    .page-mypage .user-video .user-job-footer,
    .page-mypage .user-video-upload-box .user-job-footer,
    .page-history .user-job .user-job-footer,
    .page-history .user-video .user-job-footer,
    .page-history .user-video-upload-box .user-job-footer,
    .page-mail .user-job .user-job-footer,
    .page-mail .user-video .user-job-footer,
    .page-mail .user-video-upload-box .user-job-footer,
    .page-resume .user-job .user-job-footer,
    .page-resume .user-video .user-job-footer,
    .page-resume .user-video-upload-box .user-job-footer,
    .page-appointment .user-job .user-job-footer,
    .page-appointment .user-video .user-job-footer,
    .page-appointment .user-video-upload-box .user-job-footer,
    .page-online-interview-booking .user-job .user-job-footer,
    .page-online-interview-booking .user-video .user-job-footer,
    .page-online-interview-booking .user-video-upload-box .user-job-footer,
    .page-account-setting .user-job .user-job-footer,
    .page-account-setting .user-video .user-job-footer,
    .page-account-setting .user-video-upload-box .user-job-footer,
    .page-job-entry .user-job .user-job-footer,
    .page-job-entry .user-video .user-job-footer,
    .page-job-entry .user-video-upload-box .user-job-footer,
    .page-desired-conditional-job-list .user-job .user-job-footer,
    .page-desired-conditional-job-list .user-video .user-job-footer,
    .page-desired-conditional-job-list .user-video-upload-box .user-job-footer,
    .page-reminder-notification .user-job .user-job-footer,
    .page-reminder-notification .user-video .user-job-footer,
    .page-reminder-notification .user-video-upload-box .user-job-footer {
        padding: 10px
    }
}

@media only screen and (max-width: 480px) {

    .page-mypage .user-job .user-job-footer,
    .page-mypage .user-video .user-job-footer,
    .page-mypage .user-video-upload-box .user-job-footer,
    .page-history .user-job .user-job-footer,
    .page-history .user-video .user-job-footer,
    .page-history .user-video-upload-box .user-job-footer,
    .page-mail .user-job .user-job-footer,
    .page-mail .user-video .user-job-footer,
    .page-mail .user-video-upload-box .user-job-footer,
    .page-resume .user-job .user-job-footer,
    .page-resume .user-video .user-job-footer,
    .page-resume .user-video-upload-box .user-job-footer,
    .page-appointment .user-job .user-job-footer,
    .page-appointment .user-video .user-job-footer,
    .page-appointment .user-video-upload-box .user-job-footer,
    .page-online-interview-booking .user-job .user-job-footer,
    .page-online-interview-booking .user-video .user-job-footer,
    .page-online-interview-booking .user-video-upload-box .user-job-footer,
    .page-account-setting .user-job .user-job-footer,
    .page-account-setting .user-video .user-job-footer,
    .page-account-setting .user-video-upload-box .user-job-footer,
    .page-job-entry .user-job .user-job-footer,
    .page-job-entry .user-video .user-job-footer,
    .page-job-entry .user-video-upload-box .user-job-footer,
    .page-desired-conditional-job-list .user-job .user-job-footer,
    .page-desired-conditional-job-list .user-video .user-job-footer,
    .page-desired-conditional-job-list .user-video-upload-box .user-job-footer,
    .page-reminder-notification .user-job .user-job-footer,
    .page-reminder-notification .user-video .user-job-footer,
    .page-reminder-notification .user-video-upload-box .user-job-footer {
        display: block
    }
}

.page-mypage .user-job .user-job-footer p,
.page-mypage .user-video .user-job-footer p,
.page-mypage .user-video-upload-box .user-job-footer p,
.page-history .user-job .user-job-footer p,
.page-history .user-video .user-job-footer p,
.page-history .user-video-upload-box .user-job-footer p,
.page-mail .user-job .user-job-footer p,
.page-mail .user-video .user-job-footer p,
.page-mail .user-video-upload-box .user-job-footer p,
.page-resume .user-job .user-job-footer p,
.page-resume .user-video .user-job-footer p,
.page-resume .user-video-upload-box .user-job-footer p,
.page-appointment .user-job .user-job-footer p,
.page-appointment .user-video .user-job-footer p,
.page-appointment .user-video-upload-box .user-job-footer p,
.page-online-interview-booking .user-job .user-job-footer p,
.page-online-interview-booking .user-video .user-job-footer p,
.page-online-interview-booking .user-video-upload-box .user-job-footer p,
.page-account-setting .user-job .user-job-footer p,
.page-account-setting .user-video .user-job-footer p,
.page-account-setting .user-video-upload-box .user-job-footer p,
.page-job-entry .user-job .user-job-footer p,
.page-job-entry .user-video .user-job-footer p,
.page-job-entry .user-video-upload-box .user-job-footer p,
.page-desired-conditional-job-list .user-job .user-job-footer p,
.page-desired-conditional-job-list .user-video .user-job-footer p,
.page-desired-conditional-job-list .user-video-upload-box .user-job-footer p,
.page-reminder-notification .user-job .user-job-footer p,
.page-reminder-notification .user-video .user-job-footer p,
.page-reminder-notification .user-video-upload-box .user-job-footer p {
    margin: 0
}

.page-mypage .user-job .user-job-footer .user-job-deadline,
.page-mypage .user-video .user-job-footer .user-job-deadline,
.page-mypage .user-video-upload-box .user-job-footer .user-job-deadline,
.page-history .user-job .user-job-footer .user-job-deadline,
.page-history .user-video .user-job-footer .user-job-deadline,
.page-history .user-video-upload-box .user-job-footer .user-job-deadline,
.page-mail .user-job .user-job-footer .user-job-deadline,
.page-mail .user-video .user-job-footer .user-job-deadline,
.page-mail .user-video-upload-box .user-job-footer .user-job-deadline,
.page-resume .user-job .user-job-footer .user-job-deadline,
.page-resume .user-video .user-job-footer .user-job-deadline,
.page-resume .user-video-upload-box .user-job-footer .user-job-deadline,
.page-appointment .user-job .user-job-footer .user-job-deadline,
.page-appointment .user-video .user-job-footer .user-job-deadline,
.page-appointment .user-video-upload-box .user-job-footer .user-job-deadline,
.page-online-interview-booking .user-job .user-job-footer .user-job-deadline,
.page-online-interview-booking .user-video .user-job-footer .user-job-deadline,
.page-online-interview-booking .user-video-upload-box .user-job-footer .user-job-deadline,
.page-account-setting .user-job .user-job-footer .user-job-deadline,
.page-account-setting .user-video .user-job-footer .user-job-deadline,
.page-account-setting .user-video-upload-box .user-job-footer .user-job-deadline,
.page-job-entry .user-job .user-job-footer .user-job-deadline,
.page-job-entry .user-video .user-job-footer .user-job-deadline,
.page-job-entry .user-video-upload-box .user-job-footer .user-job-deadline,
.page-desired-conditional-job-list .user-job .user-job-footer .user-job-deadline,
.page-desired-conditional-job-list .user-video .user-job-footer .user-job-deadline,
.page-desired-conditional-job-list .user-video-upload-box .user-job-footer .user-job-deadline,
.page-reminder-notification .user-job .user-job-footer .user-job-deadline,
.page-reminder-notification .user-video .user-job-footer .user-job-deadline,
.page-reminder-notification .user-video-upload-box .user-job-footer .user-job-deadline {
    margin-right: 10px
}

.page-mypage .user-job .user-job-footer .button,
.page-mypage .user-video .user-job-footer .button,
.page-mypage .user-video-upload-box .user-job-footer .button,
.page-history .user-job .user-job-footer .button,
.page-history .user-video .user-job-footer .button,
.page-history .user-video-upload-box .user-job-footer .button,
.page-mail .user-job .user-job-footer .button,
.page-mail .user-video .user-job-footer .button,
.page-mail .user-video-upload-box .user-job-footer .button,
.page-resume .user-job .user-job-footer .button,
.page-resume .user-video .user-job-footer .button,
.page-resume .user-video-upload-box .user-job-footer .button,
.page-appointment .user-job .user-job-footer .button,
.page-appointment .user-video .user-job-footer .button,
.page-appointment .user-video-upload-box .user-job-footer .button,
.page-online-interview-booking .user-job .user-job-footer .button,
.page-online-interview-booking .user-video .user-job-footer .button,
.page-online-interview-booking .user-video-upload-box .user-job-footer .button,
.page-account-setting .user-job .user-job-footer .button,
.page-account-setting .user-video .user-job-footer .button,
.page-account-setting .user-video-upload-box .user-job-footer .button,
.page-job-entry .user-job .user-job-footer .button,
.page-job-entry .user-video .user-job-footer .button,
.page-job-entry .user-video-upload-box .user-job-footer .button,
.page-desired-conditional-job-list .user-job .user-job-footer .button,
.page-desired-conditional-job-list .user-video .user-job-footer .button,
.page-desired-conditional-job-list .user-video-upload-box .user-job-footer .button,
.page-reminder-notification .user-job .user-job-footer .button,
.page-reminder-notification .user-video .user-job-footer .button,
.page-reminder-notification .user-video-upload-box .user-job-footer .button {
    width: 140px;
    height: 30px;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s
}

.page-mypage .user-job .user-job-footer .button:hover::before,
.page-mypage .user-video .user-job-footer .button:hover::before,
.page-mypage .user-video-upload-box .user-job-footer .button:hover::before,
.page-history .user-job .user-job-footer .button:hover::before,
.page-history .user-video .user-job-footer .button:hover::before,
.page-history .user-video-upload-box .user-job-footer .button:hover::before,
.page-mail .user-job .user-job-footer .button:hover::before,
.page-mail .user-video .user-job-footer .button:hover::before,
.page-mail .user-video-upload-box .user-job-footer .button:hover::before,
.page-resume .user-job .user-job-footer .button:hover::before,
.page-resume .user-video .user-job-footer .button:hover::before,
.page-resume .user-video-upload-box .user-job-footer .button:hover::before,
.page-appointment .user-job .user-job-footer .button:hover::before,
.page-appointment .user-video .user-job-footer .button:hover::before,
.page-appointment .user-video-upload-box .user-job-footer .button:hover::before,
.page-online-interview-booking .user-job .user-job-footer .button:hover::before,
.page-online-interview-booking .user-video .user-job-footer .button:hover::before,
.page-online-interview-booking .user-video-upload-box .user-job-footer .button:hover::before,
.page-account-setting .user-job .user-job-footer .button:hover::before,
.page-account-setting .user-video .user-job-footer .button:hover::before,
.page-account-setting .user-video-upload-box .user-job-footer .button:hover::before,
.page-job-entry .user-job .user-job-footer .button:hover::before,
.page-job-entry .user-video .user-job-footer .button:hover::before,
.page-job-entry .user-video-upload-box .user-job-footer .button:hover::before,
.page-desired-conditional-job-list .user-job .user-job-footer .button:hover::before,
.page-desired-conditional-job-list .user-video .user-job-footer .button:hover::before,
.page-desired-conditional-job-list .user-video-upload-box .user-job-footer .button:hover::before,
.page-reminder-notification .user-job .user-job-footer .button:hover::before,
.page-reminder-notification .user-video .user-job-footer .button:hover::before,
.page-reminder-notification .user-video-upload-box .user-job-footer .button:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.page-mypage .user-job .user-job-footer .button:hover,
.page-mypage .user-job .user-job-footer .button:focus,
.page-mypage .user-job .user-job-footer .button:active,
.page-mypage .user-video .user-job-footer .button:hover,
.page-mypage .user-video .user-job-footer .button:focus,
.page-mypage .user-video .user-job-footer .button:active,
.page-mypage .user-video-upload-box .user-job-footer .button:hover,
.page-mypage .user-video-upload-box .user-job-footer .button:focus,
.page-mypage .user-video-upload-box .user-job-footer .button:active,
.page-history .user-job .user-job-footer .button:hover,
.page-history .user-job .user-job-footer .button:focus,
.page-history .user-job .user-job-footer .button:active,
.page-history .user-video .user-job-footer .button:hover,
.page-history .user-video .user-job-footer .button:focus,
.page-history .user-video .user-job-footer .button:active,
.page-history .user-video-upload-box .user-job-footer .button:hover,
.page-history .user-video-upload-box .user-job-footer .button:focus,
.page-history .user-video-upload-box .user-job-footer .button:active,
.page-mail .user-job .user-job-footer .button:hover,
.page-mail .user-job .user-job-footer .button:focus,
.page-mail .user-job .user-job-footer .button:active,
.page-mail .user-video .user-job-footer .button:hover,
.page-mail .user-video .user-job-footer .button:focus,
.page-mail .user-video .user-job-footer .button:active,
.page-mail .user-video-upload-box .user-job-footer .button:hover,
.page-mail .user-video-upload-box .user-job-footer .button:focus,
.page-mail .user-video-upload-box .user-job-footer .button:active,
.page-resume .user-job .user-job-footer .button:hover,
.page-resume .user-job .user-job-footer .button:focus,
.page-resume .user-job .user-job-footer .button:active,
.page-resume .user-video .user-job-footer .button:hover,
.page-resume .user-video .user-job-footer .button:focus,
.page-resume .user-video .user-job-footer .button:active,
.page-resume .user-video-upload-box .user-job-footer .button:hover,
.page-resume .user-video-upload-box .user-job-footer .button:focus,
.page-resume .user-video-upload-box .user-job-footer .button:active,
.page-appointment .user-job .user-job-footer .button:hover,
.page-appointment .user-job .user-job-footer .button:focus,
.page-appointment .user-job .user-job-footer .button:active,
.page-appointment .user-video .user-job-footer .button:hover,
.page-appointment .user-video .user-job-footer .button:focus,
.page-appointment .user-video .user-job-footer .button:active,
.page-appointment .user-video-upload-box .user-job-footer .button:hover,
.page-appointment .user-video-upload-box .user-job-footer .button:focus,
.page-appointment .user-video-upload-box .user-job-footer .button:active,
.page-online-interview-booking .user-job .user-job-footer .button:hover,
.page-online-interview-booking .user-job .user-job-footer .button:focus,
.page-online-interview-booking .user-job .user-job-footer .button:active,
.page-online-interview-booking .user-video .user-job-footer .button:hover,
.page-online-interview-booking .user-video .user-job-footer .button:focus,
.page-online-interview-booking .user-video .user-job-footer .button:active,
.page-online-interview-booking .user-video-upload-box .user-job-footer .button:hover,
.page-online-interview-booking .user-video-upload-box .user-job-footer .button:focus,
.page-online-interview-booking .user-video-upload-box .user-job-footer .button:active,
.page-account-setting .user-job .user-job-footer .button:hover,
.page-account-setting .user-job .user-job-footer .button:focus,
.page-account-setting .user-job .user-job-footer .button:active,
.page-account-setting .user-video .user-job-footer .button:hover,
.page-account-setting .user-video .user-job-footer .button:focus,
.page-account-setting .user-video .user-job-footer .button:active,
.page-account-setting .user-video-upload-box .user-job-footer .button:hover,
.page-account-setting .user-video-upload-box .user-job-footer .button:focus,
.page-account-setting .user-video-upload-box .user-job-footer .button:active,
.page-job-entry .user-job .user-job-footer .button:hover,
.page-job-entry .user-job .user-job-footer .button:focus,
.page-job-entry .user-job .user-job-footer .button:active,
.page-job-entry .user-video .user-job-footer .button:hover,
.page-job-entry .user-video .user-job-footer .button:focus,
.page-job-entry .user-video .user-job-footer .button:active,
.page-job-entry .user-video-upload-box .user-job-footer .button:hover,
.page-job-entry .user-video-upload-box .user-job-footer .button:focus,
.page-job-entry .user-video-upload-box .user-job-footer .button:active,
.page-desired-conditional-job-list .user-job .user-job-footer .button:hover,
.page-desired-conditional-job-list .user-job .user-job-footer .button:focus,
.page-desired-conditional-job-list .user-job .user-job-footer .button:active,
.page-desired-conditional-job-list .user-video .user-job-footer .button:hover,
.page-desired-conditional-job-list .user-video .user-job-footer .button:focus,
.page-desired-conditional-job-list .user-video .user-job-footer .button:active,
.page-desired-conditional-job-list .user-video-upload-box .user-job-footer .button:hover,
.page-desired-conditional-job-list .user-video-upload-box .user-job-footer .button:focus,
.page-desired-conditional-job-list .user-video-upload-box .user-job-footer .button:active,
.page-reminder-notification .user-job .user-job-footer .button:hover,
.page-reminder-notification .user-job .user-job-footer .button:focus,
.page-reminder-notification .user-job .user-job-footer .button:active,
.page-reminder-notification .user-video .user-job-footer .button:hover,
.page-reminder-notification .user-video .user-job-footer .button:focus,
.page-reminder-notification .user-video .user-job-footer .button:active,
.page-reminder-notification .user-video-upload-box .user-job-footer .button:hover,
.page-reminder-notification .user-video-upload-box .user-job-footer .button:focus,
.page-reminder-notification .user-video-upload-box .user-job-footer .button:active {
    color: #fff
}

.page-mypage .user-job .user-job-footer .button::before,
.page-mypage .user-video .user-job-footer .button::before,
.page-mypage .user-video-upload-box .user-job-footer .button::before,
.page-history .user-job .user-job-footer .button::before,
.page-history .user-video .user-job-footer .button::before,
.page-history .user-video-upload-box .user-job-footer .button::before,
.page-mail .user-job .user-job-footer .button::before,
.page-mail .user-video .user-job-footer .button::before,
.page-mail .user-video-upload-box .user-job-footer .button::before,
.page-resume .user-job .user-job-footer .button::before,
.page-resume .user-video .user-job-footer .button::before,
.page-resume .user-video-upload-box .user-job-footer .button::before,
.page-appointment .user-job .user-job-footer .button::before,
.page-appointment .user-video .user-job-footer .button::before,
.page-appointment .user-video-upload-box .user-job-footer .button::before,
.page-online-interview-booking .user-job .user-job-footer .button::before,
.page-online-interview-booking .user-video .user-job-footer .button::before,
.page-online-interview-booking .user-video-upload-box .user-job-footer .button::before,
.page-account-setting .user-job .user-job-footer .button::before,
.page-account-setting .user-video .user-job-footer .button::before,
.page-account-setting .user-video-upload-box .user-job-footer .button::before,
.page-job-entry .user-job .user-job-footer .button::before,
.page-job-entry .user-video .user-job-footer .button::before,
.page-job-entry .user-video-upload-box .user-job-footer .button::before,
.page-desired-conditional-job-list .user-job .user-job-footer .button::before,
.page-desired-conditional-job-list .user-video .user-job-footer .button::before,
.page-desired-conditional-job-list .user-video-upload-box .user-job-footer .button::before,
.page-reminder-notification .user-job .user-job-footer .button::before,
.page-reminder-notification .user-video .user-job-footer .button::before,
.page-reminder-notification .user-video-upload-box .user-job-footer .button::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -55px;
    left: 0px;
    border-radius: 100%;
    background-color: #3a50c9;
    width: 140px;
    height: 140px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

@media only screen and (max-width: 599px) {

    .page-mypage .user-job .user-job-footer .button,
    .page-mypage .user-video .user-job-footer .button,
    .page-mypage .user-video-upload-box .user-job-footer .button,
    .page-history .user-job .user-job-footer .button,
    .page-history .user-video .user-job-footer .button,
    .page-history .user-video-upload-box .user-job-footer .button,
    .page-mail .user-job .user-job-footer .button,
    .page-mail .user-video .user-job-footer .button,
    .page-mail .user-video-upload-box .user-job-footer .button,
    .page-resume .user-job .user-job-footer .button,
    .page-resume .user-video .user-job-footer .button,
    .page-resume .user-video-upload-box .user-job-footer .button,
    .page-appointment .user-job .user-job-footer .button,
    .page-appointment .user-video .user-job-footer .button,
    .page-appointment .user-video-upload-box .user-job-footer .button,
    .page-online-interview-booking .user-job .user-job-footer .button,
    .page-online-interview-booking .user-video .user-job-footer .button,
    .page-online-interview-booking .user-video-upload-box .user-job-footer .button,
    .page-account-setting .user-job .user-job-footer .button,
    .page-account-setting .user-video .user-job-footer .button,
    .page-account-setting .user-video-upload-box .user-job-footer .button,
    .page-job-entry .user-job .user-job-footer .button,
    .page-job-entry .user-video .user-job-footer .button,
    .page-job-entry .user-video-upload-box .user-job-footer .button,
    .page-desired-conditional-job-list .user-job .user-job-footer .button,
    .page-desired-conditional-job-list .user-video .user-job-footer .button,
    .page-desired-conditional-job-list .user-video-upload-box .user-job-footer .button,
    .page-reminder-notification .user-job .user-job-footer .button,
    .page-reminder-notification .user-video .user-job-footer .button,
    .page-reminder-notification .user-video-upload-box .user-job-footer .button {
        width: 80px
    }
}

@media only screen and (max-width: 480px) {

    .page-mypage .user-job .user-job-footer .button,
    .page-mypage .user-video .user-job-footer .button,
    .page-mypage .user-video-upload-box .user-job-footer .button,
    .page-history .user-job .user-job-footer .button,
    .page-history .user-video .user-job-footer .button,
    .page-history .user-video-upload-box .user-job-footer .button,
    .page-mail .user-job .user-job-footer .button,
    .page-mail .user-video .user-job-footer .button,
    .page-mail .user-video-upload-box .user-job-footer .button,
    .page-resume .user-job .user-job-footer .button,
    .page-resume .user-video .user-job-footer .button,
    .page-resume .user-video-upload-box .user-job-footer .button,
    .page-appointment .user-job .user-job-footer .button,
    .page-appointment .user-video .user-job-footer .button,
    .page-appointment .user-video-upload-box .user-job-footer .button,
    .page-online-interview-booking .user-job .user-job-footer .button,
    .page-online-interview-booking .user-video .user-job-footer .button,
    .page-online-interview-booking .user-video-upload-box .user-job-footer .button,
    .page-account-setting .user-job .user-job-footer .button,
    .page-account-setting .user-video .user-job-footer .button,
    .page-account-setting .user-video-upload-box .user-job-footer .button,
    .page-job-entry .user-job .user-job-footer .button,
    .page-job-entry .user-video .user-job-footer .button,
    .page-job-entry .user-video-upload-box .user-job-footer .button,
    .page-desired-conditional-job-list .user-job .user-job-footer .button,
    .page-desired-conditional-job-list .user-video .user-job-footer .button,
    .page-desired-conditional-job-list .user-video-upload-box .user-job-footer .button,
    .page-reminder-notification .user-job .user-job-footer .button,
    .page-reminder-notification .user-video .user-job-footer .button,
    .page-reminder-notification .user-video-upload-box .user-job-footer .button {
        width: 100%;
        margin-top: 10px
    }
}

.page-mypage .user-job .user-box-title,
.page-history .user-job .user-box-title,
.page-mail .user-job .user-box-title,
.page-resume .user-job .user-box-title,
.page-appointment .user-job .user-box-title,
.page-online-interview-booking .user-job .user-box-title,
.page-account-setting .user-job .user-box-title,
.page-job-entry .user-job .user-box-title,
.page-desired-conditional-job-list .user-job .user-box-title,
.page-reminder-notification .user-job .user-box-title {
    min-height: 160px
}

.page-mypage .user-job .user-job-photo .img-box,
.page-history .user-job .user-job-photo .img-box,
.page-mail .user-job .user-job-photo .img-box,
.page-resume .user-job .user-job-photo .img-box,
.page-appointment .user-job .user-job-photo .img-box,
.page-online-interview-booking .user-job .user-job-photo .img-box,
.page-account-setting .user-job .user-job-photo .img-box,
.page-job-entry .user-job .user-job-photo .img-box,
.page-desired-conditional-job-list .user-job .user-job-photo .img-box,
.page-reminder-notification .user-job .user-job-photo .img-box {
    position: relative;
    float: left;
    width: 198px;
    height: 138px
}

.page-mypage .user-job .user-job-photo .img-box img,
.page-history .user-job .user-job-photo .img-box img,
.page-mail .user-job .user-job-photo .img-box img,
.page-resume .user-job .user-job-photo .img-box img,
.page-appointment .user-job .user-job-photo .img-box img,
.page-online-interview-booking .user-job .user-job-photo .img-box img,
.page-account-setting .user-job .user-job-photo .img-box img,
.page-job-entry .user-job .user-job-photo .img-box img,
.page-desired-conditional-job-list .user-job .user-job-photo .img-box img,
.page-reminder-notification .user-job .user-job-photo .img-box img {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto
}

.page-mypage .button-seeall,
.page-history .button-seeall,
.page-mail .button-seeall,
.page-resume .button-seeall,
.page-appointment .button-seeall,
.page-online-interview-booking .button-seeall,
.page-account-setting .button-seeall,
.page-job-entry .button-seeall,
.page-desired-conditional-job-list .button-seeall,
.page-reminder-notification .button-seeall {
    margin: 40px auto 0 auto;
    width: 400px;
    max-width: 100%;
    height: 36px;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s
}

.page-mypage .button-seeall:hover::before,
.page-history .button-seeall:hover::before,
.page-mail .button-seeall:hover::before,
.page-resume .button-seeall:hover::before,
.page-appointment .button-seeall:hover::before,
.page-online-interview-booking .button-seeall:hover::before,
.page-account-setting .button-seeall:hover::before,
.page-job-entry .button-seeall:hover::before,
.page-desired-conditional-job-list .button-seeall:hover::before,
.page-reminder-notification .button-seeall:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.page-mypage .button-seeall:hover,
.page-mypage .button-seeall:focus,
.page-mypage .button-seeall:active,
.page-history .button-seeall:hover,
.page-history .button-seeall:focus,
.page-history .button-seeall:active,
.page-mail .button-seeall:hover,
.page-mail .button-seeall:focus,
.page-mail .button-seeall:active,
.page-resume .button-seeall:hover,
.page-resume .button-seeall:focus,
.page-resume .button-seeall:active,
.page-appointment .button-seeall:hover,
.page-appointment .button-seeall:focus,
.page-appointment .button-seeall:active,
.page-online-interview-booking .button-seeall:hover,
.page-online-interview-booking .button-seeall:focus,
.page-online-interview-booking .button-seeall:active,
.page-account-setting .button-seeall:hover,
.page-account-setting .button-seeall:focus,
.page-account-setting .button-seeall:active,
.page-job-entry .button-seeall:hover,
.page-job-entry .button-seeall:focus,
.page-job-entry .button-seeall:active,
.page-desired-conditional-job-list .button-seeall:hover,
.page-desired-conditional-job-list .button-seeall:focus,
.page-desired-conditional-job-list .button-seeall:active,
.page-reminder-notification .button-seeall:hover,
.page-reminder-notification .button-seeall:focus,
.page-reminder-notification .button-seeall:active {
    color: #fff
}

.page-mypage .button-seeall::before,
.page-history .button-seeall::before,
.page-mail .button-seeall::before,
.page-resume .button-seeall::before,
.page-appointment .button-seeall::before,
.page-online-interview-booking .button-seeall::before,
.page-account-setting .button-seeall::before,
.page-job-entry .button-seeall::before,
.page-desired-conditional-job-list .button-seeall::before,
.page-reminder-notification .button-seeall::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -182px;
    left: 0px;
    border-radius: 100%;
    background-color: #3A50C9;
    width: 400px;
    height: 400px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

.page-mypage .user-history,
.page-history .user-history,
.page-mail .user-history,
.page-resume .user-history,
.page-appointment .user-history,
.page-online-interview-booking .user-history,
.page-account-setting .user-history,
.page-job-entry .user-history,
.page-desired-conditional-job-list .user-history,
.page-reminder-notification .user-history {
    margin-top: 30px
}

@media only screen and (max-width: 1022px) {

    .page-mypage .user-history,
    .page-history .user-history,
    .page-mail .user-history,
    .page-resume .user-history,
    .page-appointment .user-history,
    .page-online-interview-booking .user-history,
    .page-account-setting .user-history,
    .page-job-entry .user-history,
    .page-desired-conditional-job-list .user-history,
    .page-reminder-notification .user-history {
        margin-top: 20px
    }
}

.page-mypage .user-history.disable,
.page-history .user-history.disable,
.page-mail .user-history.disable,
.page-resume .user-history.disable,
.page-appointment .user-history.disable,
.page-online-interview-booking .user-history.disable,
.page-account-setting .user-history.disable,
.page-job-entry .user-history.disable,
.page-desired-conditional-job-list .user-history.disable,
.page-reminder-notification .user-history.disable {
    background: #f3f3f3
}

.page-mypage .user-history .user-box-inner,
.page-history .user-history .user-box-inner,
.page-mail .user-history .user-box-inner,
.page-resume .user-history .user-box-inner,
.page-appointment .user-history .user-box-inner,
.page-online-interview-booking .user-history .user-box-inner,
.page-account-setting .user-history .user-box-inner,
.page-job-entry .user-history .user-box-inner,
.page-desired-conditional-job-list .user-history .user-box-inner,
.page-reminder-notification .user-history .user-box-inner {
    border-bottom: 1px solid #d8d8d8
}

.page-mypage .user-history .user-box-inner:last-child,
.page-history .user-history .user-box-inner:last-child,
.page-mail .user-history .user-box-inner:last-child,
.page-resume .user-history .user-box-inner:last-child,
.page-appointment .user-history .user-box-inner:last-child,
.page-online-interview-booking .user-history .user-box-inner:last-child,
.page-account-setting .user-history .user-box-inner:last-child,
.page-job-entry .user-history .user-box-inner:last-child,
.page-desired-conditional-job-list .user-history .user-box-inner:last-child,
.page-reminder-notification .user-history .user-box-inner:last-child {
    border-bottom: none
}

.page-mypage .user-lead,
.page-history .user-lead,
.page-mail .user-lead,
.page-resume .user-lead,
.page-appointment .user-lead,
.page-online-interview-booking .user-lead,
.page-account-setting .user-lead,
.page-job-entry .user-lead,
.page-desired-conditional-job-list .user-lead,
.page-reminder-notification .user-lead {
    margin-bottom: 30px
}

@media only screen and (max-width: 1022px) {

    .page-mypage .user-lead,
    .page-history .user-lead,
    .page-mail .user-lead,
    .page-resume .user-lead,
    .page-appointment .user-lead,
    .page-online-interview-booking .user-lead,
    .page-account-setting .user-lead,
    .page-job-entry .user-lead,
    .page-desired-conditional-job-list .user-lead,
    .page-reminder-notification .user-lead {
        margin-bottom: 20px
    }

    .page-mypage .user-lead p,
    .page-history .user-lead p,
    .page-mail .user-lead p,
    .page-resume .user-lead p,
    .page-appointment .user-lead p,
    .page-online-interview-booking .user-lead p,
    .page-account-setting .user-lead p,
    .page-job-entry .user-lead p,
    .page-desired-conditional-job-list .user-lead p,
    .page-reminder-notification .user-lead p {
        margin: 0
    }
}

.page-mypage .user-lead p,
.page-history .user-lead p,
.page-mail .user-lead p,
.page-resume .user-lead p,
.page-appointment .user-lead p,
.page-online-interview-booking .user-lead p,
.page-account-setting .user-lead p,
.page-job-entry .user-lead p,
.page-desired-conditional-job-list .user-lead p,
.page-reminder-notification .user-lead p {
    font-size: 1.4rem;
    line-height: 1.8
}

.page-mypage .user-lead.application-histories-text,
.page-history .user-lead.application-histories-text,
.page-mail .user-lead.application-histories-text,
.page-resume .user-lead.application-histories-text,
.page-appointment .user-lead.application-histories-text,
.page-online-interview-booking .user-lead.application-histories-text,
.page-account-setting .user-lead.application-histories-text,
.page-job-entry .user-lead.application-histories-text,
.page-desired-conditional-job-list .user-lead.application-histories-text,
.page-reminder-notification .user-lead.application-histories-text {
    margin-bottom: 0
}

.page-mypage .user-lead.application-histories-text p,
.page-history .user-lead.application-histories-text p,
.page-mail .user-lead.application-histories-text p,
.page-resume .user-lead.application-histories-text p,
.page-appointment .user-lead.application-histories-text p,
.page-online-interview-booking .user-lead.application-histories-text p,
.page-account-setting .user-lead.application-histories-text p,
.page-job-entry .user-lead.application-histories-text p,
.page-desired-conditional-job-list .user-lead.application-histories-text p,
.page-reminder-notification .user-lead.application-histories-text p {
    margin-bottom: 0
}

.page-mypage .select-event-years,
.page-mypage .select-job-apply-years,
.page-history .select-event-years,
.page-history .select-job-apply-years,
.page-mail .select-event-years,
.page-mail .select-job-apply-years,
.page-resume .select-event-years,
.page-resume .select-job-apply-years,
.page-appointment .select-event-years,
.page-appointment .select-job-apply-years,
.page-online-interview-booking .select-event-years,
.page-online-interview-booking .select-job-apply-years,
.page-account-setting .select-event-years,
.page-account-setting .select-job-apply-years,
.page-job-entry .select-event-years,
.page-job-entry .select-job-apply-years,
.page-desired-conditional-job-list .select-event-years,
.page-desired-conditional-job-list .select-job-apply-years,
.page-reminder-notification .select-event-years,
.page-reminder-notification .select-job-apply-years {
    width: 146px;
    min-width: 146px;
    float: right;
    margin-bottom: -10px
}

.page-mypage .history-button-wrapper,
.page-history .history-button-wrapper,
.page-mail .history-button-wrapper,
.page-resume .history-button-wrapper,
.page-appointment .history-button-wrapper,
.page-online-interview-booking .history-button-wrapper,
.page-account-setting .history-button-wrapper,
.page-job-entry .history-button-wrapper,
.page-desired-conditional-job-list .history-button-wrapper,
.page-reminder-notification .history-button-wrapper {
    display: flex;
    display: -webkit-flex;
    -webkit-justify-content: flex-end;
    justify-content: flex-end
}

@media only screen and (max-width: 767px) {

    .page-mypage .history-button-wrapper,
    .page-history .history-button-wrapper,
    .page-mail .history-button-wrapper,
    .page-resume .history-button-wrapper,
    .page-appointment .history-button-wrapper,
    .page-online-interview-booking .history-button-wrapper,
    .page-account-setting .history-button-wrapper,
    .page-job-entry .history-button-wrapper,
    .page-desired-conditional-job-list .history-button-wrapper,
    .page-reminder-notification .history-button-wrapper {
        flex-wrap: wrap;
        justify-content: flex-start
    }
}

.page-mypage .history-button-wrapper.box-no-flex,
.page-history .history-button-wrapper.box-no-flex,
.page-mail .history-button-wrapper.box-no-flex,
.page-resume .history-button-wrapper.box-no-flex,
.page-appointment .history-button-wrapper.box-no-flex,
.page-online-interview-booking .history-button-wrapper.box-no-flex,
.page-account-setting .history-button-wrapper.box-no-flex,
.page-job-entry .history-button-wrapper.box-no-flex,
.page-desired-conditional-job-list .history-button-wrapper.box-no-flex,
.page-reminder-notification .history-button-wrapper.box-no-flex {
    display: block;
    width: 100%;
    float: left
}

.page-mypage .history-button-wrapper.box-no-flex .history-button-area-left,
.page-history .history-button-wrapper.box-no-flex .history-button-area-left,
.page-mail .history-button-wrapper.box-no-flex .history-button-area-left,
.page-resume .history-button-wrapper.box-no-flex .history-button-area-left,
.page-appointment .history-button-wrapper.box-no-flex .history-button-area-left,
.page-online-interview-booking .history-button-wrapper.box-no-flex .history-button-area-left,
.page-account-setting .history-button-wrapper.box-no-flex .history-button-area-left,
.page-job-entry .history-button-wrapper.box-no-flex .history-button-area-left,
.page-desired-conditional-job-list .history-button-wrapper.box-no-flex .history-button-area-left,
.page-reminder-notification .history-button-wrapper.box-no-flex .history-button-area-left {
    display: flex;
    display: -webkit-flex;
    -webkit-justify-content: flex-end;
    justify-content: flex-end;
    float: left
}

@media only screen and (max-width: 767px) {

    .page-mypage .history-button-wrapper.box-no-flex .history-button-area-left,
    .page-history .history-button-wrapper.box-no-flex .history-button-area-left,
    .page-mail .history-button-wrapper.box-no-flex .history-button-area-left,
    .page-resume .history-button-wrapper.box-no-flex .history-button-area-left,
    .page-appointment .history-button-wrapper.box-no-flex .history-button-area-left,
    .page-online-interview-booking .history-button-wrapper.box-no-flex .history-button-area-left,
    .page-account-setting .history-button-wrapper.box-no-flex .history-button-area-left,
    .page-job-entry .history-button-wrapper.box-no-flex .history-button-area-left,
    .page-desired-conditional-job-list .history-button-wrapper.box-no-flex .history-button-area-left,
    .page-reminder-notification .history-button-wrapper.box-no-flex .history-button-area-left {
        width: 100%;
        float: left;
        clear: both
    }
}

.page-mypage .history-button-wrapper.box-no-flex .history-button-area-right,
.page-history .history-button-wrapper.box-no-flex .history-button-area-right,
.page-mail .history-button-wrapper.box-no-flex .history-button-area-right,
.page-resume .history-button-wrapper.box-no-flex .history-button-area-right,
.page-appointment .history-button-wrapper.box-no-flex .history-button-area-right,
.page-online-interview-booking .history-button-wrapper.box-no-flex .history-button-area-right,
.page-account-setting .history-button-wrapper.box-no-flex .history-button-area-right,
.page-job-entry .history-button-wrapper.box-no-flex .history-button-area-right,
.page-desired-conditional-job-list .history-button-wrapper.box-no-flex .history-button-area-right,
.page-reminder-notification .history-button-wrapper.box-no-flex .history-button-area-right {
    display: flex;
    display: -webkit-flex;
    -webkit-justify-content: flex-end;
    justify-content: flex-end
}

@media only screen and (max-width: 767px) {

    .page-mypage .history-button-wrapper.box-no-flex .history-button-area-right,
    .page-history .history-button-wrapper.box-no-flex .history-button-area-right,
    .page-mail .history-button-wrapper.box-no-flex .history-button-area-right,
    .page-resume .history-button-wrapper.box-no-flex .history-button-area-right,
    .page-appointment .history-button-wrapper.box-no-flex .history-button-area-right,
    .page-online-interview-booking .history-button-wrapper.box-no-flex .history-button-area-right,
    .page-account-setting .history-button-wrapper.box-no-flex .history-button-area-right,
    .page-job-entry .history-button-wrapper.box-no-flex .history-button-area-right,
    .page-desired-conditional-job-list .history-button-wrapper.box-no-flex .history-button-area-right,
    .page-reminder-notification .history-button-wrapper.box-no-flex .history-button-area-right {
        clear: both;
        flex-wrap: wrap;
        justify-content: flex-start
    }
}

@media only screen and (max-width: 767px) {

    .page-mypage .history-button-wrapper.box-no-flex .history-button-area-right .button,
    .page-history .history-button-wrapper.box-no-flex .history-button-area-right .button,
    .page-mail .history-button-wrapper.box-no-flex .history-button-area-right .button,
    .page-resume .history-button-wrapper.box-no-flex .history-button-area-right .button,
    .page-appointment .history-button-wrapper.box-no-flex .history-button-area-right .button,
    .page-online-interview-booking .history-button-wrapper.box-no-flex .history-button-area-right .button,
    .page-account-setting .history-button-wrapper.box-no-flex .history-button-area-right .button,
    .page-job-entry .history-button-wrapper.box-no-flex .history-button-area-right .button,
    .page-desired-conditional-job-list .history-button-wrapper.box-no-flex .history-button-area-right .button,
    .page-reminder-notification .history-button-wrapper.box-no-flex .history-button-area-right .button {
        width: 49%;
        margin: 0 0 10px
    }

    .page-mypage .history-button-wrapper.box-no-flex .history-button-area-right .button:nth-child(even),
    .page-history .history-button-wrapper.box-no-flex .history-button-area-right .button:nth-child(even),
    .page-mail .history-button-wrapper.box-no-flex .history-button-area-right .button:nth-child(even),
    .page-resume .history-button-wrapper.box-no-flex .history-button-area-right .button:nth-child(even),
    .page-appointment .history-button-wrapper.box-no-flex .history-button-area-right .button:nth-child(even),
    .page-online-interview-booking .history-button-wrapper.box-no-flex .history-button-area-right .button:nth-child(even),
    .page-account-setting .history-button-wrapper.box-no-flex .history-button-area-right .button:nth-child(even),
    .page-job-entry .history-button-wrapper.box-no-flex .history-button-area-right .button:nth-child(even),
    .page-desired-conditional-job-list .history-button-wrapper.box-no-flex .history-button-area-right .button:nth-child(even),
    .page-reminder-notification .history-button-wrapper.box-no-flex .history-button-area-right .button:nth-child(even) {
        margin-left: auto
    }
}

@media only screen and (max-width: 480px) {

    .page-mypage .history-button-wrapper.box-no-flex .history-button-area-right .button,
    .page-history .history-button-wrapper.box-no-flex .history-button-area-right .button,
    .page-mail .history-button-wrapper.box-no-flex .history-button-area-right .button,
    .page-resume .history-button-wrapper.box-no-flex .history-button-area-right .button,
    .page-appointment .history-button-wrapper.box-no-flex .history-button-area-right .button,
    .page-online-interview-booking .history-button-wrapper.box-no-flex .history-button-area-right .button,
    .page-account-setting .history-button-wrapper.box-no-flex .history-button-area-right .button,
    .page-job-entry .history-button-wrapper.box-no-flex .history-button-area-right .button,
    .page-desired-conditional-job-list .history-button-wrapper.box-no-flex .history-button-area-right .button,
    .page-reminder-notification .history-button-wrapper.box-no-flex .history-button-area-right .button {
        width: 100%
    }
}

.page-mypage .history-button-wrapper .button,
.page-history .history-button-wrapper .button,
.page-mail .history-button-wrapper .button,
.page-resume .history-button-wrapper .button,
.page-appointment .history-button-wrapper .button,
.page-online-interview-booking .history-button-wrapper .button,
.page-account-setting .history-button-wrapper .button,
.page-job-entry .history-button-wrapper .button,
.page-desired-conditional-job-list .history-button-wrapper .button,
.page-reminder-notification .history-button-wrapper .button {
    width: 150px;
    height: 26px;
    font-size: 1.0rem;
    margin-left: 10px
}

@media only screen and (max-width: 767px) {

    .page-mypage .history-button-wrapper .button,
    .page-history .history-button-wrapper .button,
    .page-mail .history-button-wrapper .button,
    .page-resume .history-button-wrapper .button,
    .page-appointment .history-button-wrapper .button,
    .page-online-interview-booking .history-button-wrapper .button,
    .page-account-setting .history-button-wrapper .button,
    .page-job-entry .history-button-wrapper .button,
    .page-desired-conditional-job-list .history-button-wrapper .button,
    .page-reminder-notification .history-button-wrapper .button {
        width: 49%;
        margin: 0 0 10px
    }

    .page-mypage .history-button-wrapper .button~.button,
    .page-history .history-button-wrapper .button~.button,
    .page-mail .history-button-wrapper .button~.button,
    .page-resume .history-button-wrapper .button~.button,
    .page-appointment .history-button-wrapper .button~.button,
    .page-online-interview-booking .history-button-wrapper .button~.button,
    .page-account-setting .history-button-wrapper .button~.button,
    .page-job-entry .history-button-wrapper .button~.button,
    .page-desired-conditional-job-list .history-button-wrapper .button~.button,
    .page-reminder-notification .history-button-wrapper .button~.button {
        margin-left: auto
    }
}

@media only screen and (max-width: 480px) {

    .page-mypage .history-button-wrapper .button,
    .page-history .history-button-wrapper .button,
    .page-mail .history-button-wrapper .button,
    .page-resume .history-button-wrapper .button,
    .page-appointment .history-button-wrapper .button,
    .page-online-interview-booking .history-button-wrapper .button,
    .page-account-setting .history-button-wrapper .button,
    .page-job-entry .history-button-wrapper .button,
    .page-desired-conditional-job-list .history-button-wrapper .button,
    .page-reminder-notification .history-button-wrapper .button {
        width: 100%
    }
}

.page-mypage .history-button-wrapper .button-question,
.page-history .history-button-wrapper .button-question,
.page-mail .history-button-wrapper .button-question,
.page-resume .history-button-wrapper .button-question,
.page-appointment .history-button-wrapper .button-question,
.page-online-interview-booking .history-button-wrapper .button-question,
.page-account-setting .history-button-wrapper .button-question,
.page-job-entry .history-button-wrapper .button-question,
.page-desired-conditional-job-list .history-button-wrapper .button-question,
.page-reminder-notification .history-button-wrapper .button-question {
    border: 1px solid #d03a1c;
    color: #d03a1c;
    background: none;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s
}

.page-mypage .history-button-wrapper .button-question:hover::before,
.page-history .history-button-wrapper .button-question:hover::before,
.page-mail .history-button-wrapper .button-question:hover::before,
.page-resume .history-button-wrapper .button-question:hover::before,
.page-appointment .history-button-wrapper .button-question:hover::before,
.page-online-interview-booking .history-button-wrapper .button-question:hover::before,
.page-account-setting .history-button-wrapper .button-question:hover::before,
.page-job-entry .history-button-wrapper .button-question:hover::before,
.page-desired-conditional-job-list .history-button-wrapper .button-question:hover::before,
.page-reminder-notification .history-button-wrapper .button-question:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.page-mypage .history-button-wrapper .button-question:hover,
.page-mypage .history-button-wrapper .button-question:focus,
.page-mypage .history-button-wrapper .button-question:active,
.page-history .history-button-wrapper .button-question:hover,
.page-history .history-button-wrapper .button-question:focus,
.page-history .history-button-wrapper .button-question:active,
.page-mail .history-button-wrapper .button-question:hover,
.page-mail .history-button-wrapper .button-question:focus,
.page-mail .history-button-wrapper .button-question:active,
.page-resume .history-button-wrapper .button-question:hover,
.page-resume .history-button-wrapper .button-question:focus,
.page-resume .history-button-wrapper .button-question:active,
.page-appointment .history-button-wrapper .button-question:hover,
.page-appointment .history-button-wrapper .button-question:focus,
.page-appointment .history-button-wrapper .button-question:active,
.page-online-interview-booking .history-button-wrapper .button-question:hover,
.page-online-interview-booking .history-button-wrapper .button-question:focus,
.page-online-interview-booking .history-button-wrapper .button-question:active,
.page-account-setting .history-button-wrapper .button-question:hover,
.page-account-setting .history-button-wrapper .button-question:focus,
.page-account-setting .history-button-wrapper .button-question:active,
.page-job-entry .history-button-wrapper .button-question:hover,
.page-job-entry .history-button-wrapper .button-question:focus,
.page-job-entry .history-button-wrapper .button-question:active,
.page-desired-conditional-job-list .history-button-wrapper .button-question:hover,
.page-desired-conditional-job-list .history-button-wrapper .button-question:focus,
.page-desired-conditional-job-list .history-button-wrapper .button-question:active,
.page-reminder-notification .history-button-wrapper .button-question:hover,
.page-reminder-notification .history-button-wrapper .button-question:focus,
.page-reminder-notification .history-button-wrapper .button-question:active {
    color: #fff
}

.page-mypage .history-button-wrapper .button-question::before,
.page-history .history-button-wrapper .button-question::before,
.page-mail .history-button-wrapper .button-question::before,
.page-resume .history-button-wrapper .button-question::before,
.page-appointment .history-button-wrapper .button-question::before,
.page-online-interview-booking .history-button-wrapper .button-question::before,
.page-account-setting .history-button-wrapper .button-question::before,
.page-job-entry .history-button-wrapper .button-question::before,
.page-desired-conditional-job-list .history-button-wrapper .button-question::before,
.page-reminder-notification .history-button-wrapper .button-question::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -75px;
    left: 0px;
    border-radius: 100%;
    background-color: #d03a1c;
    width: 180px;
    height: 180px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

.page-mypage .history-button-wrapper .button-question:hover,
.page-history .history-button-wrapper .button-question:hover,
.page-mail .history-button-wrapper .button-question:hover,
.page-resume .history-button-wrapper .button-question:hover,
.page-appointment .history-button-wrapper .button-question:hover,
.page-online-interview-booking .history-button-wrapper .button-question:hover,
.page-account-setting .history-button-wrapper .button-question:hover,
.page-job-entry .history-button-wrapper .button-question:hover,
.page-desired-conditional-job-list .history-button-wrapper .button-question:hover,
.page-reminder-notification .history-button-wrapper .button-question:hover {
    border: 1px solid #d03a1c
}

.page-mypage .history-button-wrapper .button-resume,
.page-history .history-button-wrapper .button-resume,
.page-mail .history-button-wrapper .button-resume,
.page-resume .history-button-wrapper .button-resume,
.page-appointment .history-button-wrapper .button-resume,
.page-online-interview-booking .history-button-wrapper .button-resume,
.page-account-setting .history-button-wrapper .button-resume,
.page-job-entry .history-button-wrapper .button-resume,
.page-desired-conditional-job-list .history-button-wrapper .button-resume,
.page-reminder-notification .history-button-wrapper .button-resume {
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s
}

.page-mypage .history-button-wrapper .button-resume:hover::before,
.page-history .history-button-wrapper .button-resume:hover::before,
.page-mail .history-button-wrapper .button-resume:hover::before,
.page-resume .history-button-wrapper .button-resume:hover::before,
.page-appointment .history-button-wrapper .button-resume:hover::before,
.page-online-interview-booking .history-button-wrapper .button-resume:hover::before,
.page-account-setting .history-button-wrapper .button-resume:hover::before,
.page-job-entry .history-button-wrapper .button-resume:hover::before,
.page-desired-conditional-job-list .history-button-wrapper .button-resume:hover::before,
.page-reminder-notification .history-button-wrapper .button-resume:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.page-mypage .history-button-wrapper .button-resume:hover,
.page-mypage .history-button-wrapper .button-resume:focus,
.page-mypage .history-button-wrapper .button-resume:active,
.page-history .history-button-wrapper .button-resume:hover,
.page-history .history-button-wrapper .button-resume:focus,
.page-history .history-button-wrapper .button-resume:active,
.page-mail .history-button-wrapper .button-resume:hover,
.page-mail .history-button-wrapper .button-resume:focus,
.page-mail .history-button-wrapper .button-resume:active,
.page-resume .history-button-wrapper .button-resume:hover,
.page-resume .history-button-wrapper .button-resume:focus,
.page-resume .history-button-wrapper .button-resume:active,
.page-appointment .history-button-wrapper .button-resume:hover,
.page-appointment .history-button-wrapper .button-resume:focus,
.page-appointment .history-button-wrapper .button-resume:active,
.page-online-interview-booking .history-button-wrapper .button-resume:hover,
.page-online-interview-booking .history-button-wrapper .button-resume:focus,
.page-online-interview-booking .history-button-wrapper .button-resume:active,
.page-account-setting .history-button-wrapper .button-resume:hover,
.page-account-setting .history-button-wrapper .button-resume:focus,
.page-account-setting .history-button-wrapper .button-resume:active,
.page-job-entry .history-button-wrapper .button-resume:hover,
.page-job-entry .history-button-wrapper .button-resume:focus,
.page-job-entry .history-button-wrapper .button-resume:active,
.page-desired-conditional-job-list .history-button-wrapper .button-resume:hover,
.page-desired-conditional-job-list .history-button-wrapper .button-resume:focus,
.page-desired-conditional-job-list .history-button-wrapper .button-resume:active,
.page-reminder-notification .history-button-wrapper .button-resume:hover,
.page-reminder-notification .history-button-wrapper .button-resume:focus,
.page-reminder-notification .history-button-wrapper .button-resume:active {
    color: #fff
}

.page-mypage .history-button-wrapper .button-resume::before,
.page-history .history-button-wrapper .button-resume::before,
.page-mail .history-button-wrapper .button-resume::before,
.page-resume .history-button-wrapper .button-resume::before,
.page-appointment .history-button-wrapper .button-resume::before,
.page-online-interview-booking .history-button-wrapper .button-resume::before,
.page-account-setting .history-button-wrapper .button-resume::before,
.page-job-entry .history-button-wrapper .button-resume::before,
.page-desired-conditional-job-list .history-button-wrapper .button-resume::before,
.page-reminder-notification .history-button-wrapper .button-resume::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -57px;
    left: 0px;
    border-radius: 100%;
    background-color: #3A50C9;
    width: 140px;
    height: 140px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

@media only screen and (max-width: 767px) {

    .page-mypage .history-button-wrapper .button-resume,
    .page-history .history-button-wrapper .button-resume,
    .page-mail .history-button-wrapper .button-resume,
    .page-resume .history-button-wrapper .button-resume,
    .page-appointment .history-button-wrapper .button-resume,
    .page-online-interview-booking .history-button-wrapper .button-resume,
    .page-account-setting .history-button-wrapper .button-resume,
    .page-job-entry .history-button-wrapper .button-resume,
    .page-desired-conditional-job-list .history-button-wrapper .button-resume,
    .page-reminder-notification .history-button-wrapper .button-resume {
        position: relative;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        overflow: hidden;
        -moz-osx-font-smoothing: grayscale;
        position: relative;
        -webkit-transition-property: all;
        transition-property: all;
        -webkit-transition-duration: 0.1s;
        transition-duration: 0.1s
    }

    .page-mypage .history-button-wrapper .button-resume:hover::before,
    .page-history .history-button-wrapper .button-resume:hover::before,
    .page-mail .history-button-wrapper .button-resume:hover::before,
    .page-resume .history-button-wrapper .button-resume:hover::before,
    .page-appointment .history-button-wrapper .button-resume:hover::before,
    .page-online-interview-booking .history-button-wrapper .button-resume:hover::before,
    .page-account-setting .history-button-wrapper .button-resume:hover::before,
    .page-job-entry .history-button-wrapper .button-resume:hover::before,
    .page-desired-conditional-job-list .history-button-wrapper .button-resume:hover::before,
    .page-reminder-notification .history-button-wrapper .button-resume:hover::before {
        -webkit-transform: scale(2);
        transform: scale(2);
        opacity: 1
    }

    .page-mypage .history-button-wrapper .button-resume:hover,
    .page-mypage .history-button-wrapper .button-resume:focus,
    .page-mypage .history-button-wrapper .button-resume:active,
    .page-history .history-button-wrapper .button-resume:hover,
    .page-history .history-button-wrapper .button-resume:focus,
    .page-history .history-button-wrapper .button-resume:active,
    .page-mail .history-button-wrapper .button-resume:hover,
    .page-mail .history-button-wrapper .button-resume:focus,
    .page-mail .history-button-wrapper .button-resume:active,
    .page-resume .history-button-wrapper .button-resume:hover,
    .page-resume .history-button-wrapper .button-resume:focus,
    .page-resume .history-button-wrapper .button-resume:active,
    .page-appointment .history-button-wrapper .button-resume:hover,
    .page-appointment .history-button-wrapper .button-resume:focus,
    .page-appointment .history-button-wrapper .button-resume:active,
    .page-online-interview-booking .history-button-wrapper .button-resume:hover,
    .page-online-interview-booking .history-button-wrapper .button-resume:focus,
    .page-online-interview-booking .history-button-wrapper .button-resume:active,
    .page-account-setting .history-button-wrapper .button-resume:hover,
    .page-account-setting .history-button-wrapper .button-resume:focus,
    .page-account-setting .history-button-wrapper .button-resume:active,
    .page-job-entry .history-button-wrapper .button-resume:hover,
    .page-job-entry .history-button-wrapper .button-resume:focus,
    .page-job-entry .history-button-wrapper .button-resume:active,
    .page-desired-conditional-job-list .history-button-wrapper .button-resume:hover,
    .page-desired-conditional-job-list .history-button-wrapper .button-resume:focus,
    .page-desired-conditional-job-list .history-button-wrapper .button-resume:active,
    .page-reminder-notification .history-button-wrapper .button-resume:hover,
    .page-reminder-notification .history-button-wrapper .button-resume:focus,
    .page-reminder-notification .history-button-wrapper .button-resume:active {
        color: #fff
    }

    .page-mypage .history-button-wrapper .button-resume::before,
    .page-history .history-button-wrapper .button-resume::before,
    .page-mail .history-button-wrapper .button-resume::before,
    .page-resume .history-button-wrapper .button-resume::before,
    .page-appointment .history-button-wrapper .button-resume::before,
    .page-online-interview-booking .history-button-wrapper .button-resume::before,
    .page-account-setting .history-button-wrapper .button-resume::before,
    .page-job-entry .history-button-wrapper .button-resume::before,
    .page-desired-conditional-job-list .history-button-wrapper .button-resume::before,
    .page-reminder-notification .history-button-wrapper .button-resume::before {
        content: "";
        display: block;
        position: absolute;
        z-index: -1;
        top: -87px;
        left: 0px;
        border-radius: 100%;
        background-color: #3A50C9;
        width: 200px;
        height: 200px;
        -webkit-transform: scale(0);
        transform: scale(0);
        -webkit-transition-property: transform;
        transition-property: transform;
        -webkit-transition-duration: 0.3s;
        transition-duration: 0.3s;
        -webkit-transition-property: all;
        transition-property: all;
        -webkit-transition-timing-function: ease-out;
        transition-timing-function: ease-out;
        opacity: 0.2
    }
}

@media only screen and (max-width: 480px) {

    .page-mypage .history-button-wrapper .button-resume,
    .page-history .history-button-wrapper .button-resume,
    .page-mail .history-button-wrapper .button-resume,
    .page-resume .history-button-wrapper .button-resume,
    .page-appointment .history-button-wrapper .button-resume,
    .page-online-interview-booking .history-button-wrapper .button-resume,
    .page-account-setting .history-button-wrapper .button-resume,
    .page-job-entry .history-button-wrapper .button-resume,
    .page-desired-conditional-job-list .history-button-wrapper .button-resume,
    .page-reminder-notification .history-button-wrapper .button-resume {
        position: relative;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        overflow: hidden;
        -moz-osx-font-smoothing: grayscale;
        position: relative;
        -webkit-transition-property: all;
        transition-property: all;
        -webkit-transition-duration: 0.1s;
        transition-duration: 0.1s
    }

    .page-mypage .history-button-wrapper .button-resume:hover::before,
    .page-history .history-button-wrapper .button-resume:hover::before,
    .page-mail .history-button-wrapper .button-resume:hover::before,
    .page-resume .history-button-wrapper .button-resume:hover::before,
    .page-appointment .history-button-wrapper .button-resume:hover::before,
    .page-online-interview-booking .history-button-wrapper .button-resume:hover::before,
    .page-account-setting .history-button-wrapper .button-resume:hover::before,
    .page-job-entry .history-button-wrapper .button-resume:hover::before,
    .page-desired-conditional-job-list .history-button-wrapper .button-resume:hover::before,
    .page-reminder-notification .history-button-wrapper .button-resume:hover::before {
        -webkit-transform: scale(2);
        transform: scale(2);
        opacity: 1
    }

    .page-mypage .history-button-wrapper .button-resume:hover,
    .page-mypage .history-button-wrapper .button-resume:focus,
    .page-mypage .history-button-wrapper .button-resume:active,
    .page-history .history-button-wrapper .button-resume:hover,
    .page-history .history-button-wrapper .button-resume:focus,
    .page-history .history-button-wrapper .button-resume:active,
    .page-mail .history-button-wrapper .button-resume:hover,
    .page-mail .history-button-wrapper .button-resume:focus,
    .page-mail .history-button-wrapper .button-resume:active,
    .page-resume .history-button-wrapper .button-resume:hover,
    .page-resume .history-button-wrapper .button-resume:focus,
    .page-resume .history-button-wrapper .button-resume:active,
    .page-appointment .history-button-wrapper .button-resume:hover,
    .page-appointment .history-button-wrapper .button-resume:focus,
    .page-appointment .history-button-wrapper .button-resume:active,
    .page-online-interview-booking .history-button-wrapper .button-resume:hover,
    .page-online-interview-booking .history-button-wrapper .button-resume:focus,
    .page-online-interview-booking .history-button-wrapper .button-resume:active,
    .page-account-setting .history-button-wrapper .button-resume:hover,
    .page-account-setting .history-button-wrapper .button-resume:focus,
    .page-account-setting .history-button-wrapper .button-resume:active,
    .page-job-entry .history-button-wrapper .button-resume:hover,
    .page-job-entry .history-button-wrapper .button-resume:focus,
    .page-job-entry .history-button-wrapper .button-resume:active,
    .page-desired-conditional-job-list .history-button-wrapper .button-resume:hover,
    .page-desired-conditional-job-list .history-button-wrapper .button-resume:focus,
    .page-desired-conditional-job-list .history-button-wrapper .button-resume:active,
    .page-reminder-notification .history-button-wrapper .button-resume:hover,
    .page-reminder-notification .history-button-wrapper .button-resume:focus,
    .page-reminder-notification .history-button-wrapper .button-resume:active {
        color: #fff
    }

    .page-mypage .history-button-wrapper .button-resume::before,
    .page-history .history-button-wrapper .button-resume::before,
    .page-mail .history-button-wrapper .button-resume::before,
    .page-resume .history-button-wrapper .button-resume::before,
    .page-appointment .history-button-wrapper .button-resume::before,
    .page-online-interview-booking .history-button-wrapper .button-resume::before,
    .page-account-setting .history-button-wrapper .button-resume::before,
    .page-job-entry .history-button-wrapper .button-resume::before,
    .page-desired-conditional-job-list .history-button-wrapper .button-resume::before,
    .page-reminder-notification .history-button-wrapper .button-resume::before {
        content: "";
        display: block;
        position: absolute;
        z-index: -1;
        top: -237px;
        left: 0px;
        border-radius: 100%;
        background-color: #3A50C9;
        width: 500px;
        height: 500px;
        -webkit-transform: scale(0);
        transform: scale(0);
        -webkit-transition-property: transform;
        transition-property: transform;
        -webkit-transition-duration: 0.3s;
        transition-duration: 0.3s;
        -webkit-transition-property: all;
        transition-property: all;
        -webkit-transition-timing-function: ease-out;
        transition-timing-function: ease-out;
        opacity: 0.2
    }
}

.page-mypage .history-button-wrapper .button-cancel,
.page-history .history-button-wrapper .button-cancel,
.page-mail .history-button-wrapper .button-cancel,
.page-resume .history-button-wrapper .button-cancel,
.page-appointment .history-button-wrapper .button-cancel,
.page-online-interview-booking .history-button-wrapper .button-cancel,
.page-account-setting .history-button-wrapper .button-cancel,
.page-job-entry .history-button-wrapper .button-cancel,
.page-desired-conditional-job-list .history-button-wrapper .button-cancel,
.page-reminder-notification .history-button-wrapper .button-cancel {
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s
}

.page-mypage .history-button-wrapper .button-cancel:hover::before,
.page-history .history-button-wrapper .button-cancel:hover::before,
.page-mail .history-button-wrapper .button-cancel:hover::before,
.page-resume .history-button-wrapper .button-cancel:hover::before,
.page-appointment .history-button-wrapper .button-cancel:hover::before,
.page-online-interview-booking .history-button-wrapper .button-cancel:hover::before,
.page-account-setting .history-button-wrapper .button-cancel:hover::before,
.page-job-entry .history-button-wrapper .button-cancel:hover::before,
.page-desired-conditional-job-list .history-button-wrapper .button-cancel:hover::before,
.page-reminder-notification .history-button-wrapper .button-cancel:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.page-mypage .history-button-wrapper .button-cancel:hover,
.page-mypage .history-button-wrapper .button-cancel:focus,
.page-mypage .history-button-wrapper .button-cancel:active,
.page-history .history-button-wrapper .button-cancel:hover,
.page-history .history-button-wrapper .button-cancel:focus,
.page-history .history-button-wrapper .button-cancel:active,
.page-mail .history-button-wrapper .button-cancel:hover,
.page-mail .history-button-wrapper .button-cancel:focus,
.page-mail .history-button-wrapper .button-cancel:active,
.page-resume .history-button-wrapper .button-cancel:hover,
.page-resume .history-button-wrapper .button-cancel:focus,
.page-resume .history-button-wrapper .button-cancel:active,
.page-appointment .history-button-wrapper .button-cancel:hover,
.page-appointment .history-button-wrapper .button-cancel:focus,
.page-appointment .history-button-wrapper .button-cancel:active,
.page-online-interview-booking .history-button-wrapper .button-cancel:hover,
.page-online-interview-booking .history-button-wrapper .button-cancel:focus,
.page-online-interview-booking .history-button-wrapper .button-cancel:active,
.page-account-setting .history-button-wrapper .button-cancel:hover,
.page-account-setting .history-button-wrapper .button-cancel:focus,
.page-account-setting .history-button-wrapper .button-cancel:active,
.page-job-entry .history-button-wrapper .button-cancel:hover,
.page-job-entry .history-button-wrapper .button-cancel:focus,
.page-job-entry .history-button-wrapper .button-cancel:active,
.page-desired-conditional-job-list .history-button-wrapper .button-cancel:hover,
.page-desired-conditional-job-list .history-button-wrapper .button-cancel:focus,
.page-desired-conditional-job-list .history-button-wrapper .button-cancel:active,
.page-reminder-notification .history-button-wrapper .button-cancel:hover,
.page-reminder-notification .history-button-wrapper .button-cancel:focus,
.page-reminder-notification .history-button-wrapper .button-cancel:active {
    color: #fff
}

.page-mypage .history-button-wrapper .button-cancel::before,
.page-history .history-button-wrapper .button-cancel::before,
.page-mail .history-button-wrapper .button-cancel::before,
.page-resume .history-button-wrapper .button-cancel::before,
.page-appointment .history-button-wrapper .button-cancel::before,
.page-online-interview-booking .history-button-wrapper .button-cancel::before,
.page-account-setting .history-button-wrapper .button-cancel::before,
.page-job-entry .history-button-wrapper .button-cancel::before,
.page-desired-conditional-job-list .history-button-wrapper .button-cancel::before,
.page-reminder-notification .history-button-wrapper .button-cancel::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -57px;
    left: 0px;
    border-radius: 100%;
    background-color: #9A9B9D;
    width: 140px;
    height: 140px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

.page-mypage .history-button-wrapper .button-cancel span::before,
.page-history .history-button-wrapper .button-cancel span::before,
.page-mail .history-button-wrapper .button-cancel span::before,
.page-resume .history-button-wrapper .button-cancel span::before,
.page-appointment .history-button-wrapper .button-cancel span::before,
.page-online-interview-booking .history-button-wrapper .button-cancel span::before,
.page-account-setting .history-button-wrapper .button-cancel span::before,
.page-job-entry .history-button-wrapper .button-cancel span::before,
.page-desired-conditional-job-list .history-button-wrapper .button-cancel span::before,
.page-reminder-notification .history-button-wrapper .button-cancel span::before {
    content: "clear"
}

@media only screen and (max-width: 767px) {

    .page-mypage .history-button-wrapper .button-cancel,
    .page-history .history-button-wrapper .button-cancel,
    .page-mail .history-button-wrapper .button-cancel,
    .page-resume .history-button-wrapper .button-cancel,
    .page-appointment .history-button-wrapper .button-cancel,
    .page-online-interview-booking .history-button-wrapper .button-cancel,
    .page-account-setting .history-button-wrapper .button-cancel,
    .page-job-entry .history-button-wrapper .button-cancel,
    .page-desired-conditional-job-list .history-button-wrapper .button-cancel,
    .page-reminder-notification .history-button-wrapper .button-cancel {
        position: relative;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        overflow: hidden;
        -moz-osx-font-smoothing: grayscale;
        position: relative;
        -webkit-transition-property: all;
        transition-property: all;
        -webkit-transition-duration: 0.1s;
        transition-duration: 0.1s
    }

    .page-mypage .history-button-wrapper .button-cancel:hover::before,
    .page-history .history-button-wrapper .button-cancel:hover::before,
    .page-mail .history-button-wrapper .button-cancel:hover::before,
    .page-resume .history-button-wrapper .button-cancel:hover::before,
    .page-appointment .history-button-wrapper .button-cancel:hover::before,
    .page-online-interview-booking .history-button-wrapper .button-cancel:hover::before,
    .page-account-setting .history-button-wrapper .button-cancel:hover::before,
    .page-job-entry .history-button-wrapper .button-cancel:hover::before,
    .page-desired-conditional-job-list .history-button-wrapper .button-cancel:hover::before,
    .page-reminder-notification .history-button-wrapper .button-cancel:hover::before {
        -webkit-transform: scale(2);
        transform: scale(2);
        opacity: 1
    }

    .page-mypage .history-button-wrapper .button-cancel:hover,
    .page-mypage .history-button-wrapper .button-cancel:focus,
    .page-mypage .history-button-wrapper .button-cancel:active,
    .page-history .history-button-wrapper .button-cancel:hover,
    .page-history .history-button-wrapper .button-cancel:focus,
    .page-history .history-button-wrapper .button-cancel:active,
    .page-mail .history-button-wrapper .button-cancel:hover,
    .page-mail .history-button-wrapper .button-cancel:focus,
    .page-mail .history-button-wrapper .button-cancel:active,
    .page-resume .history-button-wrapper .button-cancel:hover,
    .page-resume .history-button-wrapper .button-cancel:focus,
    .page-resume .history-button-wrapper .button-cancel:active,
    .page-appointment .history-button-wrapper .button-cancel:hover,
    .page-appointment .history-button-wrapper .button-cancel:focus,
    .page-appointment .history-button-wrapper .button-cancel:active,
    .page-online-interview-booking .history-button-wrapper .button-cancel:hover,
    .page-online-interview-booking .history-button-wrapper .button-cancel:focus,
    .page-online-interview-booking .history-button-wrapper .button-cancel:active,
    .page-account-setting .history-button-wrapper .button-cancel:hover,
    .page-account-setting .history-button-wrapper .button-cancel:focus,
    .page-account-setting .history-button-wrapper .button-cancel:active,
    .page-job-entry .history-button-wrapper .button-cancel:hover,
    .page-job-entry .history-button-wrapper .button-cancel:focus,
    .page-job-entry .history-button-wrapper .button-cancel:active,
    .page-desired-conditional-job-list .history-button-wrapper .button-cancel:hover,
    .page-desired-conditional-job-list .history-button-wrapper .button-cancel:focus,
    .page-desired-conditional-job-list .history-button-wrapper .button-cancel:active,
    .page-reminder-notification .history-button-wrapper .button-cancel:hover,
    .page-reminder-notification .history-button-wrapper .button-cancel:focus,
    .page-reminder-notification .history-button-wrapper .button-cancel:active {
        color: #fff
    }

    .page-mypage .history-button-wrapper .button-cancel::before,
    .page-history .history-button-wrapper .button-cancel::before,
    .page-mail .history-button-wrapper .button-cancel::before,
    .page-resume .history-button-wrapper .button-cancel::before,
    .page-appointment .history-button-wrapper .button-cancel::before,
    .page-online-interview-booking .history-button-wrapper .button-cancel::before,
    .page-account-setting .history-button-wrapper .button-cancel::before,
    .page-job-entry .history-button-wrapper .button-cancel::before,
    .page-desired-conditional-job-list .history-button-wrapper .button-cancel::before,
    .page-reminder-notification .history-button-wrapper .button-cancel::before {
        content: "";
        display: block;
        position: absolute;
        z-index: -1;
        top: -87px;
        left: 0px;
        border-radius: 100%;
        background-color: #9A9B9D;
        width: 200px;
        height: 200px;
        -webkit-transform: scale(0);
        transform: scale(0);
        -webkit-transition-property: transform;
        transition-property: transform;
        -webkit-transition-duration: 0.3s;
        transition-duration: 0.3s;
        -webkit-transition-property: all;
        transition-property: all;
        -webkit-transition-timing-function: ease-out;
        transition-timing-function: ease-out;
        opacity: 0.2
    }
}

@media only screen and (max-width: 480px) {

    .page-mypage .history-button-wrapper .button-cancel,
    .page-history .history-button-wrapper .button-cancel,
    .page-mail .history-button-wrapper .button-cancel,
    .page-resume .history-button-wrapper .button-cancel,
    .page-appointment .history-button-wrapper .button-cancel,
    .page-online-interview-booking .history-button-wrapper .button-cancel,
    .page-account-setting .history-button-wrapper .button-cancel,
    .page-job-entry .history-button-wrapper .button-cancel,
    .page-desired-conditional-job-list .history-button-wrapper .button-cancel,
    .page-reminder-notification .history-button-wrapper .button-cancel {
        position: relative;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        overflow: hidden;
        -moz-osx-font-smoothing: grayscale;
        position: relative;
        -webkit-transition-property: all;
        transition-property: all;
        -webkit-transition-duration: 0.1s;
        transition-duration: 0.1s
    }

    .page-mypage .history-button-wrapper .button-cancel:hover::before,
    .page-history .history-button-wrapper .button-cancel:hover::before,
    .page-mail .history-button-wrapper .button-cancel:hover::before,
    .page-resume .history-button-wrapper .button-cancel:hover::before,
    .page-appointment .history-button-wrapper .button-cancel:hover::before,
    .page-online-interview-booking .history-button-wrapper .button-cancel:hover::before,
    .page-account-setting .history-button-wrapper .button-cancel:hover::before,
    .page-job-entry .history-button-wrapper .button-cancel:hover::before,
    .page-desired-conditional-job-list .history-button-wrapper .button-cancel:hover::before,
    .page-reminder-notification .history-button-wrapper .button-cancel:hover::before {
        -webkit-transform: scale(2);
        transform: scale(2);
        opacity: 1
    }

    .page-mypage .history-button-wrapper .button-cancel:hover,
    .page-mypage .history-button-wrapper .button-cancel:focus,
    .page-mypage .history-button-wrapper .button-cancel:active,
    .page-history .history-button-wrapper .button-cancel:hover,
    .page-history .history-button-wrapper .button-cancel:focus,
    .page-history .history-button-wrapper .button-cancel:active,
    .page-mail .history-button-wrapper .button-cancel:hover,
    .page-mail .history-button-wrapper .button-cancel:focus,
    .page-mail .history-button-wrapper .button-cancel:active,
    .page-resume .history-button-wrapper .button-cancel:hover,
    .page-resume .history-button-wrapper .button-cancel:focus,
    .page-resume .history-button-wrapper .button-cancel:active,
    .page-appointment .history-button-wrapper .button-cancel:hover,
    .page-appointment .history-button-wrapper .button-cancel:focus,
    .page-appointment .history-button-wrapper .button-cancel:active,
    .page-online-interview-booking .history-button-wrapper .button-cancel:hover,
    .page-online-interview-booking .history-button-wrapper .button-cancel:focus,
    .page-online-interview-booking .history-button-wrapper .button-cancel:active,
    .page-account-setting .history-button-wrapper .button-cancel:hover,
    .page-account-setting .history-button-wrapper .button-cancel:focus,
    .page-account-setting .history-button-wrapper .button-cancel:active,
    .page-job-entry .history-button-wrapper .button-cancel:hover,
    .page-job-entry .history-button-wrapper .button-cancel:focus,
    .page-job-entry .history-button-wrapper .button-cancel:active,
    .page-desired-conditional-job-list .history-button-wrapper .button-cancel:hover,
    .page-desired-conditional-job-list .history-button-wrapper .button-cancel:focus,
    .page-desired-conditional-job-list .history-button-wrapper .button-cancel:active,
    .page-reminder-notification .history-button-wrapper .button-cancel:hover,
    .page-reminder-notification .history-button-wrapper .button-cancel:focus,
    .page-reminder-notification .history-button-wrapper .button-cancel:active {
        color: #fff
    }

    .page-mypage .history-button-wrapper .button-cancel::before,
    .page-history .history-button-wrapper .button-cancel::before,
    .page-mail .history-button-wrapper .button-cancel::before,
    .page-resume .history-button-wrapper .button-cancel::before,
    .page-appointment .history-button-wrapper .button-cancel::before,
    .page-online-interview-booking .history-button-wrapper .button-cancel::before,
    .page-account-setting .history-button-wrapper .button-cancel::before,
    .page-job-entry .history-button-wrapper .button-cancel::before,
    .page-desired-conditional-job-list .history-button-wrapper .button-cancel::before,
    .page-reminder-notification .history-button-wrapper .button-cancel::before {
        content: "";
        display: block;
        position: absolute;
        z-index: -1;
        top: -237px;
        left: 0px;
        border-radius: 100%;
        background-color: #9A9B9D;
        width: 500px;
        height: 500px;
        -webkit-transform: scale(0);
        transform: scale(0);
        -webkit-transition-property: transform;
        transition-property: transform;
        -webkit-transition-duration: 0.3s;
        transition-duration: 0.3s;
        -webkit-transition-property: all;
        transition-property: all;
        -webkit-transition-timing-function: ease-out;
        transition-timing-function: ease-out;
        opacity: 0.2
    }
}

.page-mypage .history-button-wrapper .notice,
.page-history .history-button-wrapper .notice,
.page-mail .history-button-wrapper .notice,
.page-resume .history-button-wrapper .notice,
.page-appointment .history-button-wrapper .notice,
.page-online-interview-booking .history-button-wrapper .notice,
.page-account-setting .history-button-wrapper .notice,
.page-job-entry .history-button-wrapper .notice,
.page-desired-conditional-job-list .history-button-wrapper .notice,
.page-reminder-notification .history-button-wrapper .notice {
    color: #d03a1c;
    margin-right: auto
}

@media only screen and (max-width: 767px) {

    .page-mypage .history-button-wrapper .notice,
    .page-history .history-button-wrapper .notice,
    .page-mail .history-button-wrapper .notice,
    .page-resume .history-button-wrapper .notice,
    .page-appointment .history-button-wrapper .notice,
    .page-online-interview-booking .history-button-wrapper .notice,
    .page-account-setting .history-button-wrapper .notice,
    .page-job-entry .history-button-wrapper .notice,
    .page-desired-conditional-job-list .history-button-wrapper .notice,
    .page-reminder-notification .history-button-wrapper .notice {
        width: 100%;
        margin: 0 0 10px
    }
}

.page-mypage .header-wrapper,
.page-history .header-wrapper,
.page-mail .header-wrapper,
.page-resume .header-wrapper,
.page-appointment .header-wrapper,
.page-online-interview-booking .header-wrapper,
.page-account-setting .header-wrapper,
.page-job-entry .header-wrapper,
.page-desired-conditional-job-list .header-wrapper,
.page-reminder-notification .header-wrapper {
    display: flex;
    display: -webkit-flex;
    -webkit-justify-content: flex-start;
    justify-content: flex-start
}

@media only screen and (max-width: 767px) {

    .page-mypage .header-wrapper,
    .page-history .header-wrapper,
    .page-mail .header-wrapper,
    .page-resume .header-wrapper,
    .page-appointment .header-wrapper,
    .page-online-interview-booking .header-wrapper,
    .page-account-setting .header-wrapper,
    .page-job-entry .header-wrapper,
    .page-desired-conditional-job-list .header-wrapper,
    .page-reminder-notification .header-wrapper {
        flex-wrap: wrap;
        justify-content: flex-start
    }
}

.page-mypage .header-wrapper.box-no-flex,
.page-history .header-wrapper.box-no-flex,
.page-mail .header-wrapper.box-no-flex,
.page-resume .header-wrapper.box-no-flex,
.page-appointment .header-wrapper.box-no-flex,
.page-online-interview-booking .header-wrapper.box-no-flex,
.page-account-setting .header-wrapper.box-no-flex,
.page-job-entry .header-wrapper.box-no-flex,
.page-desired-conditional-job-list .header-wrapper.box-no-flex,
.page-reminder-notification .header-wrapper.box-no-flex {
    width: 100%;
    float: left
}

.page-mypage .header-wrapper.box-no-flex .header-area-left,
.page-history .header-wrapper.box-no-flex .header-area-left,
.page-mail .header-wrapper.box-no-flex .header-area-left,
.page-resume .header-wrapper.box-no-flex .header-area-left,
.page-appointment .header-wrapper.box-no-flex .header-area-left,
.page-online-interview-booking .header-wrapper.box-no-flex .header-area-left,
.page-account-setting .header-wrapper.box-no-flex .header-area-left,
.page-job-entry .header-wrapper.box-no-flex .header-area-left,
.page-desired-conditional-job-list .header-wrapper.box-no-flex .header-area-left,
.page-reminder-notification .header-wrapper.box-no-flex .header-area-left {
    display: flex;
    display: -webkit-flex;
    float: left;
    margin-right: 5px
}

@media only screen and (max-width: 767px) {

    .page-mypage .header-wrapper.box-no-flex .header-area-left,
    .page-history .header-wrapper.box-no-flex .header-area-left,
    .page-mail .header-wrapper.box-no-flex .header-area-left,
    .page-resume .header-wrapper.box-no-flex .header-area-left,
    .page-appointment .header-wrapper.box-no-flex .header-area-left,
    .page-online-interview-booking .header-wrapper.box-no-flex .header-area-left,
    .page-account-setting .header-wrapper.box-no-flex .header-area-left,
    .page-job-entry .header-wrapper.box-no-flex .header-area-left,
    .page-desired-conditional-job-list .header-wrapper.box-no-flex .header-area-left,
    .page-reminder-notification .header-wrapper.box-no-flex .header-area-left {
        width: 100%;
        float: left;
        clear: both
    }
}

.page-mypage .header-wrapper.box-no-flex .header-area-right,
.page-history .header-wrapper.box-no-flex .header-area-right,
.page-mail .header-wrapper.box-no-flex .header-area-right,
.page-resume .header-wrapper.box-no-flex .header-area-right,
.page-appointment .header-wrapper.box-no-flex .header-area-right,
.page-online-interview-booking .header-wrapper.box-no-flex .header-area-right,
.page-account-setting .header-wrapper.box-no-flex .header-area-right,
.page-job-entry .header-wrapper.box-no-flex .header-area-right,
.page-desired-conditional-job-list .header-wrapper.box-no-flex .header-area-right,
.page-reminder-notification .header-wrapper.box-no-flex .header-area-right {
    display: flex;
    display: -webkit-flex
}

@media only screen and (max-width: 767px) {

    .page-mypage .header-wrapper.box-no-flex .header-area-right,
    .page-history .header-wrapper.box-no-flex .header-area-right,
    .page-mail .header-wrapper.box-no-flex .header-area-right,
    .page-resume .header-wrapper.box-no-flex .header-area-right,
    .page-appointment .header-wrapper.box-no-flex .header-area-right,
    .page-online-interview-booking .header-wrapper.box-no-flex .header-area-right,
    .page-account-setting .header-wrapper.box-no-flex .header-area-right,
    .page-job-entry .header-wrapper.box-no-flex .header-area-right,
    .page-desired-conditional-job-list .header-wrapper.box-no-flex .header-area-right,
    .page-reminder-notification .header-wrapper.box-no-flex .header-area-right {
        clear: both;
        flex-wrap: wrap;
        justify-content: flex-start
    }
}

.page-mypage .history-title,
.page-history .history-title,
.page-mail .history-title,
.page-resume .history-title,
.page-appointment .history-title,
.page-online-interview-booking .history-title,
.page-account-setting .history-title,
.page-job-entry .history-title,
.page-desired-conditional-job-list .history-title,
.page-reminder-notification .history-title {
    word-break: break-word
}

.page-mypage .history-title p,
.page-history .history-title p,
.page-mail .history-title p,
.page-resume .history-title p,
.page-appointment .history-title p,
.page-online-interview-booking .history-title p,
.page-account-setting .history-title p,
.page-job-entry .history-title p,
.page-desired-conditional-job-list .history-title p,
.page-reminder-notification .history-title p {
    display: inline-block;
    margin: 0;
    font-size: 1.4rem;
    color: #000
}

.page-mypage .history-title .history-title-date,
.page-history .history-title .history-title-date,
.page-mail .history-title .history-title-date,
.page-resume .history-title .history-title-date,
.page-appointment .history-title .history-title-date,
.page-online-interview-booking .history-title .history-title-date,
.page-account-setting .history-title .history-title-date,
.page-job-entry .history-title .history-title-date,
.page-desired-conditional-job-list .history-title .history-title-date,
.page-reminder-notification .history-title .history-title-date {
    margin-left: 20px;
    color: #000
}

@media only screen and (max-width: 767px) {

    .page-mypage .history-title .history-title-date,
    .page-history .history-title .history-title-date,
    .page-mail .history-title .history-title-date,
    .page-resume .history-title .history-title-date,
    .page-appointment .history-title .history-title-date,
    .page-online-interview-booking .history-title .history-title-date,
    .page-account-setting .history-title .history-title-date,
    .page-job-entry .history-title .history-title-date,
    .page-desired-conditional-job-list .history-title .history-title-date,
    .page-reminder-notification .history-title .history-title-date {
        margin-left: 0;
        display: block
    }
}

.page-mypage .history-title h3,
.page-history .history-title h3,
.page-mail .history-title h3,
.page-resume .history-title h3,
.page-appointment .history-title h3,
.page-online-interview-booking .history-title h3,
.page-account-setting .history-title h3,
.page-job-entry .history-title h3,
.page-desired-conditional-job-list .history-title h3,
.page-reminder-notification .history-title h3 {
    margin: 4px 0 20px 0
}

.page-mypage .history-title .color-green,
.page-history .history-title .color-green,
.page-mail .history-title .color-green,
.page-resume .history-title .color-green,
.page-appointment .history-title .color-green,
.page-online-interview-booking .history-title .color-green,
.page-account-setting .history-title .color-green,
.page-job-entry .history-title .color-green,
.page-desired-conditional-job-list .history-title .color-green,
.page-reminder-notification .history-title .color-green {
    background: #25B665;
    border: 1px solid #25B665
}

.page-mypage .history-title .bg-internship-tag,
.page-history .history-title .bg-internship-tag,
.page-mail .history-title .bg-internship-tag,
.page-resume .history-title .bg-internship-tag,
.page-appointment .history-title .bg-internship-tag,
.page-online-interview-booking .history-title .bg-internship-tag,
.page-account-setting .history-title .bg-internship-tag,
.page-job-entry .history-title .bg-internship-tag,
.page-desired-conditional-job-list .history-title .bg-internship-tag,
.page-reminder-notification .history-title .bg-internship-tag {
    background: #ff80c0
}

.page-mypage .history-title .bg-fulltime-tag,
.page-history .history-title .bg-fulltime-tag,
.page-mail .history-title .bg-fulltime-tag,
.page-resume .history-title .bg-fulltime-tag,
.page-appointment .history-title .bg-fulltime-tag,
.page-online-interview-booking .history-title .bg-fulltime-tag,
.page-account-setting .history-title .bg-fulltime-tag,
.page-job-entry .history-title .bg-fulltime-tag,
.page-desired-conditional-job-list .history-title .bg-fulltime-tag,
.page-reminder-notification .history-title .bg-fulltime-tag {
    background: #45818E
}

.page-mypage .history-title .applied-jobs-title .h3,
.page-history .history-title .applied-jobs-title .h3,
.page-mail .history-title .applied-jobs-title .h3,
.page-resume .history-title .applied-jobs-title .h3,
.page-appointment .history-title .applied-jobs-title .h3,
.page-online-interview-booking .history-title .applied-jobs-title .h3,
.page-account-setting .history-title .applied-jobs-title .h3,
.page-job-entry .history-title .applied-jobs-title .h3,
.page-desired-conditional-job-list .history-title .applied-jobs-title .h3,
.page-reminder-notification .history-title .applied-jobs-title .h3 {
    font-size: 1.6rem
}

.page-mypage .history-title .applied-jobs-title .cf-icon,
.page-history .history-title .applied-jobs-title .cf-icon,
.page-mail .history-title .applied-jobs-title .cf-icon,
.page-resume .history-title .applied-jobs-title .cf-icon,
.page-appointment .history-title .applied-jobs-title .cf-icon,
.page-online-interview-booking .history-title .applied-jobs-title .cf-icon,
.page-account-setting .history-title .applied-jobs-title .cf-icon,
.page-job-entry .history-title .applied-jobs-title .cf-icon,
.page-desired-conditional-job-list .history-title .applied-jobs-title .cf-icon,
.page-reminder-notification .history-title .applied-jobs-title .cf-icon {
    float: right
}

@media only screen and (max-width: 767px) {

    .page-mypage .history-title .applied-jobs-title .cf-icon,
    .page-history .history-title .applied-jobs-title .cf-icon,
    .page-mail .history-title .applied-jobs-title .cf-icon,
    .page-resume .history-title .applied-jobs-title .cf-icon,
    .page-appointment .history-title .applied-jobs-title .cf-icon,
    .page-online-interview-booking .history-title .applied-jobs-title .cf-icon,
    .page-account-setting .history-title .applied-jobs-title .cf-icon,
    .page-job-entry .history-title .applied-jobs-title .cf-icon,
    .page-desired-conditional-job-list .history-title .applied-jobs-title .cf-icon,
    .page-reminder-notification .history-title .applied-jobs-title .cf-icon {
        width: 111px
    }
}

@media only screen and (max-width: 767px) {

    .page-mypage .history-title .applied-jobs-title,
    .page-history .history-title .applied-jobs-title,
    .page-mail .history-title .applied-jobs-title,
    .page-resume .history-title .applied-jobs-title,
    .page-appointment .history-title .applied-jobs-title,
    .page-online-interview-booking .history-title .applied-jobs-title,
    .page-account-setting .history-title .applied-jobs-title,
    .page-job-entry .history-title .applied-jobs-title,
    .page-desired-conditional-job-list .history-title .applied-jobs-title,
    .page-reminder-notification .history-title .applied-jobs-title {
        display: flex;
        flex-direction: column-reverse
    }

    .page-mypage .history-title .applied-jobs-title span,
    .page-history .history-title .applied-jobs-title span,
    .page-mail .history-title .applied-jobs-title span,
    .page-resume .history-title .applied-jobs-title span,
    .page-appointment .history-title .applied-jobs-title span,
    .page-online-interview-booking .history-title .applied-jobs-title span,
    .page-account-setting .history-title .applied-jobs-title span,
    .page-job-entry .history-title .applied-jobs-title span,
    .page-desired-conditional-job-list .history-title .applied-jobs-title span,
    .page-reminder-notification .history-title .applied-jobs-title span {
        margin-top: 5px;
        margin-bottom: 5px
    }
}

.page-mypage .history-content,
.page-history .history-content,
.page-mail .history-content,
.page-resume .history-content,
.page-appointment .history-content,
.page-online-interview-booking .history-content,
.page-account-setting .history-content,
.page-job-entry .history-content,
.page-desired-conditional-job-list .history-content,
.page-reminder-notification .history-content {
    display: table;
    width: 100%;
    height: 100px;
    border-collapse: collapse
}

@media only screen and (max-width: 767px) {

    .page-mypage .history-content,
    .page-history .history-content,
    .page-mail .history-content,
    .page-resume .history-content,
    .page-appointment .history-content,
    .page-online-interview-booking .history-content,
    .page-account-setting .history-content,
    .page-job-entry .history-content,
    .page-desired-conditional-job-list .history-content,
    .page-reminder-notification .history-content {
        display: block;
        height: auto;
        *zoom: 1
    }

    .page-mypage .history-content:before,
    .page-mypage .history-content:after,
    .page-history .history-content:before,
    .page-history .history-content:after,
    .page-mail .history-content:before,
    .page-mail .history-content:after,
    .page-resume .history-content:before,
    .page-resume .history-content:after,
    .page-appointment .history-content:before,
    .page-appointment .history-content:after,
    .page-online-interview-booking .history-content:before,
    .page-online-interview-booking .history-content:after,
    .page-account-setting .history-content:before,
    .page-account-setting .history-content:after,
    .page-job-entry .history-content:before,
    .page-job-entry .history-content:after,
    .page-desired-conditional-job-list .history-content:before,
    .page-desired-conditional-job-list .history-content:after,
    .page-reminder-notification .history-content:before,
    .page-reminder-notification .history-content:after {
        content: " ";
        display: table
    }

    .page-mypage .history-content:after,
    .page-history .history-content:after,
    .page-mail .history-content:after,
    .page-resume .history-content:after,
    .page-appointment .history-content:after,
    .page-online-interview-booking .history-content:after,
    .page-account-setting .history-content:after,
    .page-job-entry .history-content:after,
    .page-desired-conditional-job-list .history-content:after,
    .page-reminder-notification .history-content:after {
        clear: both
    }
}

.page-mypage .history-content div,
.page-history .history-content div,
.page-mail .history-content div,
.page-resume .history-content div,
.page-appointment .history-content div,
.page-online-interview-booking .history-content div,
.page-account-setting .history-content div,
.page-job-entry .history-content div,
.page-desired-conditional-job-list .history-content div,
.page-reminder-notification .history-content div {
    display: table-cell;
    padding: 0 20px;
    border: 1px solid #d8d8d8;
    border-bottom: none;
    vertical-align: middle;
    border-left: none;
    border-right: none
}

@media only screen and (max-width: 1022px) {

    .page-mypage .history-content div,
    .page-history .history-content div,
    .page-mail .history-content div,
    .page-resume .history-content div,
    .page-appointment .history-content div,
    .page-online-interview-booking .history-content div,
    .page-account-setting .history-content div,
    .page-job-entry .history-content div,
    .page-desired-conditional-job-list .history-content div,
    .page-reminder-notification .history-content div {
        padding: 10px
    }
}

@media only screen and (max-width: 767px) {

    .page-mypage .history-content div,
    .page-history .history-content div,
    .page-mail .history-content div,
    .page-resume .history-content div,
    .page-appointment .history-content div,
    .page-online-interview-booking .history-content div,
    .page-account-setting .history-content div,
    .page-job-entry .history-content div,
    .page-desired-conditional-job-list .history-content div,
    .page-reminder-notification .history-content div {
        display: flex;
        float: left;
        height: 100px;
        align-items: center
    }

    .page-mypage .history-content div:nth-child(3),
    .page-history .history-content div:nth-child(3),
    .page-mail .history-content div:nth-child(3),
    .page-resume .history-content div:nth-child(3),
    .page-appointment .history-content div:nth-child(3),
    .page-online-interview-booking .history-content div:nth-child(3),
    .page-account-setting .history-content div:nth-child(3),
    .page-job-entry .history-content div:nth-child(3),
    .page-desired-conditional-job-list .history-content div:nth-child(3),
    .page-reminder-notification .history-content div:nth-child(3) {
        clear: left
    }
}

.page-mypage .history-content div p,
.page-history .history-content div p,
.page-mail .history-content div p,
.page-resume .history-content div p,
.page-appointment .history-content div p,
.page-online-interview-booking .history-content div p,
.page-account-setting .history-content div p,
.page-job-entry .history-content div p,
.page-desired-conditional-job-list .history-content div p,
.page-reminder-notification .history-content div p {
    margin: 0;
    line-height: 1.5
}

.page-mypage .history-content:last-child div,
.page-history .history-content:last-child div,
.page-mail .history-content:last-child div,
.page-resume .history-content:last-child div,
.page-appointment .history-content:last-child div,
.page-online-interview-booking .history-content:last-child div,
.page-account-setting .history-content:last-child div,
.page-job-entry .history-content:last-child div,
.page-desired-conditional-job-list .history-content:last-child div,
.page-reminder-notification .history-content:last-child div {
    border-bottom: 1px solid #d8d8d8
}

@media only screen and (max-width: 767px) {

    .page-mypage .history-content:last-child div.history-content-deadline,
    .page-mypage .history-content:last-child div.history-content-button,
    .page-history .history-content:last-child div.history-content-deadline,
    .page-history .history-content:last-child div.history-content-button,
    .page-mail .history-content:last-child div.history-content-deadline,
    .page-mail .history-content:last-child div.history-content-button,
    .page-resume .history-content:last-child div.history-content-deadline,
    .page-resume .history-content:last-child div.history-content-button,
    .page-appointment .history-content:last-child div.history-content-deadline,
    .page-appointment .history-content:last-child div.history-content-button,
    .page-online-interview-booking .history-content:last-child div.history-content-deadline,
    .page-online-interview-booking .history-content:last-child div.history-content-button,
    .page-account-setting .history-content:last-child div.history-content-deadline,
    .page-account-setting .history-content:last-child div.history-content-button,
    .page-job-entry .history-content:last-child div.history-content-deadline,
    .page-job-entry .history-content:last-child div.history-content-button,
    .page-desired-conditional-job-list .history-content:last-child div.history-content-deadline,
    .page-desired-conditional-job-list .history-content:last-child div.history-content-button,
    .page-reminder-notification .history-content:last-child div.history-content-deadline,
    .page-reminder-notification .history-content:last-child div.history-content-button {
        border-top: 0
    }
}

.page-mypage .history-content.history-interview .history-content-title,
.page-history .history-content.history-interview .history-content-title,
.page-mail .history-content.history-interview .history-content-title,
.page-resume .history-content.history-interview .history-content-title,
.page-appointment .history-content.history-interview .history-content-title,
.page-online-interview-booking .history-content.history-interview .history-content-title,
.page-account-setting .history-content.history-interview .history-content-title,
.page-job-entry .history-content.history-interview .history-content-title,
.page-desired-conditional-job-list .history-content.history-interview .history-content-title,
.page-reminder-notification .history-content.history-interview .history-content-title {
    background: url(/assets/icon-history-interview-e6063aeb8c9040c78a04a7415043777d6e78a5f669a481198db1736c33e860c7.png) center 20px no-repeat #F5F9FA
}

.page-mypage .history-content.history-seminar .history-content-title,
.page-history .history-content.history-seminar .history-content-title,
.page-mail .history-content.history-seminar .history-content-title,
.page-resume .history-content.history-seminar .history-content-title,
.page-appointment .history-content.history-seminar .history-content-title,
.page-online-interview-booking .history-content.history-seminar .history-content-title,
.page-account-setting .history-content.history-seminar .history-content-title,
.page-job-entry .history-content.history-seminar .history-content-title,
.page-desired-conditional-job-list .history-content.history-seminar .history-content-title,
.page-reminder-notification .history-content.history-seminar .history-content-title {
    background: url(/assets/icon-history-seminar-dbe4ca234e983c70c384282000e241da72cd4f87de30192cc593fe4a5c4da863.png) center 20px no-repeat #F5F9FA
}

.page-mypage .history-content .history-content-title,
.page-history .history-content .history-content-title,
.page-mail .history-content .history-content-title,
.page-resume .history-content .history-content-title,
.page-appointment .history-content .history-content-title,
.page-online-interview-booking .history-content .history-content-title,
.page-account-setting .history-content .history-content-title,
.page-job-entry .history-content .history-content-title,
.page-desired-conditional-job-list .history-content .history-content-title,
.page-reminder-notification .history-content .history-content-title {
    min-width: 111px;
    width: 111px;
    border-left: 1px solid #d8d8d8;
    border-right: 1px solid #d8d8d8;
    background-color: #F5F9FA
}

@media only screen and (max-width: 767px) {

    .page-mypage .history-content .history-content-title,
    .page-history .history-content .history-content-title,
    .page-mail .history-content .history-content-title,
    .page-resume .history-content .history-content-title,
    .page-appointment .history-content .history-content-title,
    .page-online-interview-booking .history-content .history-content-title,
    .page-account-setting .history-content .history-content-title,
    .page-job-entry .history-content .history-content-title,
    .page-desired-conditional-job-list .history-content .history-content-title,
    .page-reminder-notification .history-content .history-content-title {
        justify-content: center;
        align-items: center
    }
}

.page-mypage .history-content .history-content-title p,
.page-history .history-content .history-content-title p,
.page-mail .history-content .history-content-title p,
.page-resume .history-content .history-content-title p,
.page-appointment .history-content .history-content-title p,
.page-online-interview-booking .history-content .history-content-title p,
.page-account-setting .history-content .history-content-title p,
.page-job-entry .history-content .history-content-title p,
.page-desired-conditional-job-list .history-content .history-content-title p,
.page-reminder-notification .history-content .history-content-title p {
    position: relative;
    top: 26px;
    font-size: 1.0rem;
    text-align: center
}

.page-mypage .history-content .history-content-info,
.page-history .history-content .history-content-info,
.page-mail .history-content .history-content-info,
.page-resume .history-content .history-content-info,
.page-appointment .history-content .history-content-info,
.page-online-interview-booking .history-content .history-content-info,
.page-account-setting .history-content .history-content-info,
.page-job-entry .history-content .history-content-info,
.page-desired-conditional-job-list .history-content .history-content-info,
.page-reminder-notification .history-content .history-content-info {
    width: 361px
}

@media only screen and (min-width: 768px) {

    .page-mypage .history-content .history-content-info.info-long-width,
    .page-history .history-content .history-content-info.info-long-width,
    .page-mail .history-content .history-content-info.info-long-width,
    .page-resume .history-content .history-content-info.info-long-width,
    .page-appointment .history-content .history-content-info.info-long-width,
    .page-online-interview-booking .history-content .history-content-info.info-long-width,
    .page-account-setting .history-content .history-content-info.info-long-width,
    .page-job-entry .history-content .history-content-info.info-long-width,
    .page-desired-conditional-job-list .history-content .history-content-info.info-long-width,
    .page-reminder-notification .history-content .history-content-info.info-long-width {
        width: 450px
    }
}

@media only screen and (max-width: 767px) {

    .page-mypage .history-content .history-content-info,
    .page-history .history-content .history-content-info,
    .page-mail .history-content .history-content-info,
    .page-resume .history-content .history-content-info,
    .page-appointment .history-content .history-content-info,
    .page-online-interview-booking .history-content .history-content-info,
    .page-account-setting .history-content .history-content-info,
    .page-job-entry .history-content .history-content-info,
    .page-desired-conditional-job-list .history-content .history-content-info,
    .page-reminder-notification .history-content .history-content-info {
        width: calc(100% - 111px);
        align-items: center;
        border-right: 1px solid #d8d8d8
    }
}

.page-mypage .history-content .history-content-info .history-content-date::before,
.page-history .history-content .history-content-info .history-content-date::before,
.page-mail .history-content .history-content-info .history-content-date::before,
.page-resume .history-content .history-content-info .history-content-date::before,
.page-appointment .history-content .history-content-info .history-content-date::before,
.page-online-interview-booking .history-content .history-content-info .history-content-date::before,
.page-account-setting .history-content .history-content-info .history-content-date::before,
.page-job-entry .history-content .history-content-info .history-content-date::before,
.page-desired-conditional-job-list .history-content .history-content-info .history-content-date::before,
.page-reminder-notification .history-content .history-content-info .history-content-date::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    position: relative;
    top: 4px;
    content: "alarm";
    display: inline-block;
    font-size: 1.6rem;
    margin-right: 4px;
    color: #000
}

.page-mypage .history-content .history-content-info .history-content-venue,
.page-history .history-content .history-content-info .history-content-venue,
.page-mail .history-content .history-content-info .history-content-venue,
.page-resume .history-content .history-content-info .history-content-venue,
.page-appointment .history-content .history-content-info .history-content-venue,
.page-online-interview-booking .history-content .history-content-info .history-content-venue,
.page-account-setting .history-content .history-content-info .history-content-venue,
.page-job-entry .history-content .history-content-info .history-content-venue,
.page-desired-conditional-job-list .history-content .history-content-info .history-content-venue,
.page-reminder-notification .history-content .history-content-info .history-content-venue {
    margin-top: 4px
}

.page-mypage .history-content .history-content-info .history-content-venue::before,
.page-history .history-content .history-content-info .history-content-venue::before,
.page-mail .history-content .history-content-info .history-content-venue::before,
.page-resume .history-content .history-content-info .history-content-venue::before,
.page-appointment .history-content .history-content-info .history-content-venue::before,
.page-online-interview-booking .history-content .history-content-info .history-content-venue::before,
.page-account-setting .history-content .history-content-info .history-content-venue::before,
.page-job-entry .history-content .history-content-info .history-content-venue::before,
.page-desired-conditional-job-list .history-content .history-content-info .history-content-venue::before,
.page-reminder-notification .history-content .history-content-info .history-content-venue::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    position: relative;
    top: 4px;
    content: "room";
    display: inline-block;
    font-size: 1.6rem;
    margin-right: 4px;
    color: #000
}

.page-mypage .history-content .history-content-info .history-content-seminar,
.page-mypage .history-content .history-content-info .history-content-interview,
.page-history .history-content .history-content-info .history-content-seminar,
.page-history .history-content .history-content-info .history-content-interview,
.page-mail .history-content .history-content-info .history-content-seminar,
.page-mail .history-content .history-content-info .history-content-interview,
.page-resume .history-content .history-content-info .history-content-seminar,
.page-resume .history-content .history-content-info .history-content-interview,
.page-appointment .history-content .history-content-info .history-content-seminar,
.page-appointment .history-content .history-content-info .history-content-interview,
.page-online-interview-booking .history-content .history-content-info .history-content-seminar,
.page-online-interview-booking .history-content .history-content-info .history-content-interview,
.page-account-setting .history-content .history-content-info .history-content-seminar,
.page-account-setting .history-content .history-content-info .history-content-interview,
.page-job-entry .history-content .history-content-info .history-content-seminar,
.page-job-entry .history-content .history-content-info .history-content-interview,
.page-desired-conditional-job-list .history-content .history-content-info .history-content-seminar,
.page-desired-conditional-job-list .history-content .history-content-info .history-content-interview,
.page-reminder-notification .history-content .history-content-info .history-content-seminar,
.page-reminder-notification .history-content .history-content-info .history-content-interview {
    margin-top: 4px
}

.page-mypage .history-content .history-content-info ul,
.page-history .history-content .history-content-info ul,
.page-mail .history-content .history-content-info ul,
.page-resume .history-content .history-content-info ul,
.page-appointment .history-content .history-content-info ul,
.page-online-interview-booking .history-content .history-content-info ul,
.page-account-setting .history-content .history-content-info ul,
.page-job-entry .history-content .history-content-info ul,
.page-desired-conditional-job-list .history-content .history-content-info ul,
.page-reminder-notification .history-content .history-content-info ul {
    font-size: 1.2rem;
    padding-left: 20px
}

.page-mypage .history-content .history-content-info-col-2,
.page-history .history-content .history-content-info-col-2,
.page-mail .history-content .history-content-info-col-2,
.page-resume .history-content .history-content-info-col-2,
.page-appointment .history-content .history-content-info-col-2,
.page-online-interview-booking .history-content .history-content-info-col-2,
.page-account-setting .history-content .history-content-info-col-2,
.page-job-entry .history-content .history-content-info-col-2,
.page-desired-conditional-job-list .history-content .history-content-info-col-2,
.page-reminder-notification .history-content .history-content-info-col-2 {
    width: 546px
}

@media only screen and (max-width: 767px) {

    .page-mypage .history-content .history-content-info-col-2,
    .page-history .history-content .history-content-info-col-2,
    .page-mail .history-content .history-content-info-col-2,
    .page-resume .history-content .history-content-info-col-2,
    .page-appointment .history-content .history-content-info-col-2,
    .page-online-interview-booking .history-content .history-content-info-col-2,
    .page-account-setting .history-content .history-content-info-col-2,
    .page-job-entry .history-content .history-content-info-col-2,
    .page-desired-conditional-job-list .history-content .history-content-info-col-2,
    .page-reminder-notification .history-content .history-content-info-col-2 {
        width: calc(100% - 111px);
        display: block;
        height: auto
    }
}

@media only screen and (max-width: 767px) {

    .page-mypage .history-content .history-content-deadline,
    .page-history .history-content .history-content-deadline,
    .page-mail .history-content .history-content-deadline,
    .page-resume .history-content .history-content-deadline,
    .page-appointment .history-content .history-content-deadline,
    .page-online-interview-booking .history-content .history-content-deadline,
    .page-account-setting .history-content .history-content-deadline,
    .page-job-entry .history-content .history-content-deadline,
    .page-desired-conditional-job-list .history-content .history-content-deadline,
    .page-reminder-notification .history-content .history-content-deadline {
        width: 111px;
        height: auto;
        border-left: 1px solid #d8d8d8;
        border-right: 1px solid #d8d8d8
    }

    .page-mypage .history-content .history-content-deadline br,
    .page-history .history-content .history-content-deadline br,
    .page-mail .history-content .history-content-deadline br,
    .page-resume .history-content .history-content-deadline br,
    .page-appointment .history-content .history-content-deadline br,
    .page-online-interview-booking .history-content .history-content-deadline br,
    .page-account-setting .history-content .history-content-deadline br,
    .page-job-entry .history-content .history-content-deadline br,
    .page-desired-conditional-job-list .history-content .history-content-deadline br,
    .page-reminder-notification .history-content .history-content-deadline br {
        display: none
    }
}

.page-mypage .history-content .history-content-button,
.page-history .history-content .history-content-button,
.page-mail .history-content .history-content-button,
.page-resume .history-content .history-content-button,
.page-appointment .history-content .history-content-button,
.page-online-interview-booking .history-content .history-content-button,
.page-account-setting .history-content .history-content-button,
.page-job-entry .history-content .history-content-button,
.page-desired-conditional-job-list .history-content .history-content-button,
.page-reminder-notification .history-content .history-content-button {
    width: 140px;
    border-right: 1px solid #d8d8d8;
    border-top: 1px solid #d8d8d8
}

@media only screen and (max-width: 767px) {

    .page-mypage .history-content .history-content-button,
    .page-history .history-content .history-content-button,
    .page-mail .history-content .history-content-button,
    .page-resume .history-content .history-content-button,
    .page-appointment .history-content .history-content-button,
    .page-online-interview-booking .history-content .history-content-button,
    .page-account-setting .history-content .history-content-button,
    .page-job-entry .history-content .history-content-button,
    .page-desired-conditional-job-list .history-content .history-content-button,
    .page-reminder-notification .history-content .history-content-button {
        width: calc(100% - 111px);
        height: auto;
        border-right: 1px solid #d8d8d8;
        justify-content: flex-end
    }
}

.page-mypage .history-content .history-content-button .button,
.page-history .history-content .history-content-button .button,
.page-mail .history-content .history-content-button .button,
.page-resume .history-content .history-content-button .button,
.page-appointment .history-content .history-content-button .button,
.page-online-interview-booking .history-content .history-content-button .button,
.page-account-setting .history-content .history-content-button .button,
.page-job-entry .history-content .history-content-button .button,
.page-desired-conditional-job-list .history-content .history-content-button .button,
.page-reminder-notification .history-content .history-content-button .button {
    width: 140px;
    height: 26px;
    font-size: 1.0rem
}

.page-mypage .history-content .history-content-button .button:nth-child(2),
.page-history .history-content .history-content-button .button:nth-child(2),
.page-mail .history-content .history-content-button .button:nth-child(2),
.page-resume .history-content .history-content-button .button:nth-child(2),
.page-appointment .history-content .history-content-button .button:nth-child(2),
.page-online-interview-booking .history-content .history-content-button .button:nth-child(2),
.page-account-setting .history-content .history-content-button .button:nth-child(2),
.page-job-entry .history-content .history-content-button .button:nth-child(2),
.page-desired-conditional-job-list .history-content .history-content-button .button:nth-child(2),
.page-reminder-notification .history-content .history-content-button .button:nth-child(2) {
    margin-top: 5px
}

@media only screen and (max-width: 767px) {

    .page-mypage .history-content.history-interview,
    .page-mypage .history-content.history-seminar,
    .page-history .history-content.history-interview,
    .page-history .history-content.history-seminar,
    .page-mail .history-content.history-interview,
    .page-mail .history-content.history-seminar,
    .page-resume .history-content.history-interview,
    .page-resume .history-content.history-seminar,
    .page-appointment .history-content.history-interview,
    .page-appointment .history-content.history-seminar,
    .page-online-interview-booking .history-content.history-interview,
    .page-online-interview-booking .history-content.history-seminar,
    .page-account-setting .history-content.history-interview,
    .page-account-setting .history-content.history-seminar,
    .page-job-entry .history-content.history-interview,
    .page-job-entry .history-content.history-seminar,
    .page-desired-conditional-job-list .history-content.history-interview,
    .page-desired-conditional-job-list .history-content.history-seminar,
    .page-reminder-notification .history-content.history-interview,
    .page-reminder-notification .history-content.history-seminar {
        border: 1px solid #d8d8d8;
        border-top: none
    }

    .page-mypage .history-content.history-interview .history-content-title,
    .page-mypage .history-content.history-seminar .history-content-title,
    .page-history .history-content.history-interview .history-content-title,
    .page-history .history-content.history-seminar .history-content-title,
    .page-mail .history-content.history-interview .history-content-title,
    .page-mail .history-content.history-seminar .history-content-title,
    .page-resume .history-content.history-interview .history-content-title,
    .page-resume .history-content.history-seminar .history-content-title,
    .page-appointment .history-content.history-interview .history-content-title,
    .page-appointment .history-content.history-seminar .history-content-title,
    .page-online-interview-booking .history-content.history-interview .history-content-title,
    .page-online-interview-booking .history-content.history-seminar .history-content-title,
    .page-account-setting .history-content.history-interview .history-content-title,
    .page-account-setting .history-content.history-seminar .history-content-title,
    .page-job-entry .history-content.history-interview .history-content-title,
    .page-job-entry .history-content.history-seminar .history-content-title,
    .page-desired-conditional-job-list .history-content.history-interview .history-content-title,
    .page-desired-conditional-job-list .history-content.history-seminar .history-content-title,
    .page-reminder-notification .history-content.history-interview .history-content-title,
    .page-reminder-notification .history-content.history-seminar .history-content-title {
        border-left: none;
        width: 110px;
        min-width: 110px
    }

    .page-mypage .history-content.history-interview .history-content-info,
    .page-mypage .history-content.history-seminar .history-content-info,
    .page-history .history-content.history-interview .history-content-info,
    .page-history .history-content.history-seminar .history-content-info,
    .page-mail .history-content.history-interview .history-content-info,
    .page-mail .history-content.history-seminar .history-content-info,
    .page-resume .history-content.history-interview .history-content-info,
    .page-resume .history-content.history-seminar .history-content-info,
    .page-appointment .history-content.history-interview .history-content-info,
    .page-appointment .history-content.history-seminar .history-content-info,
    .page-online-interview-booking .history-content.history-interview .history-content-info,
    .page-online-interview-booking .history-content.history-seminar .history-content-info,
    .page-account-setting .history-content.history-interview .history-content-info,
    .page-account-setting .history-content.history-seminar .history-content-info,
    .page-job-entry .history-content.history-interview .history-content-info,
    .page-job-entry .history-content.history-seminar .history-content-info,
    .page-desired-conditional-job-list .history-content.history-interview .history-content-info,
    .page-desired-conditional-job-list .history-content.history-seminar .history-content-info,
    .page-reminder-notification .history-content.history-interview .history-content-info,
    .page-reminder-notification .history-content.history-seminar .history-content-info {
        border-right: none;
        width: calc(100% - 110px)
    }

    .page-mypage .history-content.history-interview .history-content-info ul,
    .page-mypage .history-content.history-seminar .history-content-info ul,
    .page-history .history-content.history-interview .history-content-info ul,
    .page-history .history-content.history-seminar .history-content-info ul,
    .page-mail .history-content.history-interview .history-content-info ul,
    .page-mail .history-content.history-seminar .history-content-info ul,
    .page-resume .history-content.history-interview .history-content-info ul,
    .page-resume .history-content.history-seminar .history-content-info ul,
    .page-appointment .history-content.history-interview .history-content-info ul,
    .page-appointment .history-content.history-seminar .history-content-info ul,
    .page-online-interview-booking .history-content.history-interview .history-content-info ul,
    .page-online-interview-booking .history-content.history-seminar .history-content-info ul,
    .page-account-setting .history-content.history-interview .history-content-info ul,
    .page-account-setting .history-content.history-seminar .history-content-info ul,
    .page-job-entry .history-content.history-interview .history-content-info ul,
    .page-job-entry .history-content.history-seminar .history-content-info ul,
    .page-desired-conditional-job-list .history-content.history-interview .history-content-info ul,
    .page-desired-conditional-job-list .history-content.history-seminar .history-content-info ul,
    .page-reminder-notification .history-content.history-interview .history-content-info ul,
    .page-reminder-notification .history-content.history-seminar .history-content-info ul {
        width: 50%
    }

    .page-mypage .history-content.history-interview .history-content-info ul li,
    .page-mypage .history-content.history-seminar .history-content-info ul li,
    .page-history .history-content.history-interview .history-content-info ul li,
    .page-history .history-content.history-seminar .history-content-info ul li,
    .page-mail .history-content.history-interview .history-content-info ul li,
    .page-mail .history-content.history-seminar .history-content-info ul li,
    .page-resume .history-content.history-interview .history-content-info ul li,
    .page-resume .history-content.history-seminar .history-content-info ul li,
    .page-appointment .history-content.history-interview .history-content-info ul li,
    .page-appointment .history-content.history-seminar .history-content-info ul li,
    .page-online-interview-booking .history-content.history-interview .history-content-info ul li,
    .page-online-interview-booking .history-content.history-seminar .history-content-info ul li,
    .page-account-setting .history-content.history-interview .history-content-info ul li,
    .page-account-setting .history-content.history-seminar .history-content-info ul li,
    .page-job-entry .history-content.history-interview .history-content-info ul li,
    .page-job-entry .history-content.history-seminar .history-content-info ul li,
    .page-desired-conditional-job-list .history-content.history-interview .history-content-info ul li,
    .page-desired-conditional-job-list .history-content.history-seminar .history-content-info ul li,
    .page-reminder-notification .history-content.history-interview .history-content-info ul li,
    .page-reminder-notification .history-content.history-seminar .history-content-info ul li {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap
    }

    .page-mypage .history-content.history-interview .history-content-button,
    .page-mypage .history-content.history-seminar .history-content-button,
    .page-history .history-content.history-interview .history-content-button,
    .page-history .history-content.history-seminar .history-content-button,
    .page-mail .history-content.history-interview .history-content-button,
    .page-mail .history-content.history-seminar .history-content-button,
    .page-resume .history-content.history-interview .history-content-button,
    .page-resume .history-content.history-seminar .history-content-button,
    .page-appointment .history-content.history-interview .history-content-button,
    .page-appointment .history-content.history-seminar .history-content-button,
    .page-online-interview-booking .history-content.history-interview .history-content-button,
    .page-online-interview-booking .history-content.history-seminar .history-content-button,
    .page-account-setting .history-content.history-interview .history-content-button,
    .page-account-setting .history-content.history-seminar .history-content-button,
    .page-job-entry .history-content.history-interview .history-content-button,
    .page-job-entry .history-content.history-seminar .history-content-button,
    .page-desired-conditional-job-list .history-content.history-interview .history-content-button,
    .page-desired-conditional-job-list .history-content.history-seminar .history-content-button,
    .page-reminder-notification .history-content.history-interview .history-content-button,
    .page-reminder-notification .history-content.history-seminar .history-content-button {
        border-right: none;
        border-bottom: none;
        min-height: 75px;
        width: calc(100% - 110px)
    }

    .page-mypage .history-content.history-interview .history-content-deadline,
    .page-mypage .history-content.history-seminar .history-content-deadline,
    .page-history .history-content.history-interview .history-content-deadline,
    .page-history .history-content.history-seminar .history-content-deadline,
    .page-mail .history-content.history-interview .history-content-deadline,
    .page-mail .history-content.history-seminar .history-content-deadline,
    .page-resume .history-content.history-interview .history-content-deadline,
    .page-resume .history-content.history-seminar .history-content-deadline,
    .page-appointment .history-content.history-interview .history-content-deadline,
    .page-appointment .history-content.history-seminar .history-content-deadline,
    .page-online-interview-booking .history-content.history-interview .history-content-deadline,
    .page-online-interview-booking .history-content.history-seminar .history-content-deadline,
    .page-account-setting .history-content.history-interview .history-content-deadline,
    .page-account-setting .history-content.history-seminar .history-content-deadline,
    .page-job-entry .history-content.history-interview .history-content-deadline,
    .page-job-entry .history-content.history-seminar .history-content-deadline,
    .page-desired-conditional-job-list .history-content.history-interview .history-content-deadline,
    .page-desired-conditional-job-list .history-content.history-seminar .history-content-deadline,
    .page-reminder-notification .history-content.history-interview .history-content-deadline,
    .page-reminder-notification .history-content.history-seminar .history-content-deadline {
        width: 110px;
        border-left: none;
        border-bottom: none
    }

    .page-mypage .history-content.history-interview .history-content-deadline.empty,
    .page-mypage .history-content.history-seminar .history-content-deadline.empty,
    .page-history .history-content.history-interview .history-content-deadline.empty,
    .page-history .history-content.history-seminar .history-content-deadline.empty,
    .page-mail .history-content.history-interview .history-content-deadline.empty,
    .page-mail .history-content.history-seminar .history-content-deadline.empty,
    .page-resume .history-content.history-interview .history-content-deadline.empty,
    .page-resume .history-content.history-seminar .history-content-deadline.empty,
    .page-appointment .history-content.history-interview .history-content-deadline.empty,
    .page-appointment .history-content.history-seminar .history-content-deadline.empty,
    .page-online-interview-booking .history-content.history-interview .history-content-deadline.empty,
    .page-online-interview-booking .history-content.history-seminar .history-content-deadline.empty,
    .page-account-setting .history-content.history-interview .history-content-deadline.empty,
    .page-account-setting .history-content.history-seminar .history-content-deadline.empty,
    .page-job-entry .history-content.history-interview .history-content-deadline.empty,
    .page-job-entry .history-content.history-seminar .history-content-deadline.empty,
    .page-desired-conditional-job-list .history-content.history-interview .history-content-deadline.empty,
    .page-desired-conditional-job-list .history-content.history-seminar .history-content-deadline.empty,
    .page-reminder-notification .history-content.history-interview .history-content-deadline.empty,
    .page-reminder-notification .history-content.history-seminar .history-content-deadline.empty {
        border-right: none
    }
}

.page-mypage .appointment-content,
.page-history .appointment-content,
.page-mail .appointment-content,
.page-resume .appointment-content,
.page-appointment .appointment-content,
.page-online-interview-booking .appointment-content,
.page-account-setting .appointment-content,
.page-job-entry .appointment-content,
.page-desired-conditional-job-list .appointment-content,
.page-reminder-notification .appointment-content {
    display: table;
    width: 100%;
    height: 100px;
    cursor: pointer;
    border-collapse: collapse
}

.page-mypage .appointment-content div,
.page-history .appointment-content div,
.page-mail .appointment-content div,
.page-resume .appointment-content div,
.page-appointment .appointment-content div,
.page-online-interview-booking .appointment-content div,
.page-account-setting .appointment-content div,
.page-job-entry .appointment-content div,
.page-desired-conditional-job-list .appointment-content div,
.page-reminder-notification .appointment-content div {
    display: table-cell;
    padding: 0 20px;
    border: 1px solid #d8d8d8;
    border-bottom: none;
    vertical-align: middle;
    border-left: none;
    border-right: none
}

.page-mypage .appointment-content div p,
.page-history .appointment-content div p,
.page-mail .appointment-content div p,
.page-resume .appointment-content div p,
.page-appointment .appointment-content div p,
.page-online-interview-booking .appointment-content div p,
.page-account-setting .appointment-content div p,
.page-job-entry .appointment-content div p,
.page-desired-conditional-job-list .appointment-content div p,
.page-reminder-notification .appointment-content div p {
    margin: 0;
    line-height: 1.5
}

.page-mypage .appointment-content:last-child div,
.page-history .appointment-content:last-child div,
.page-mail .appointment-content:last-child div,
.page-resume .appointment-content:last-child div,
.page-appointment .appointment-content:last-child div,
.page-online-interview-booking .appointment-content:last-child div,
.page-account-setting .appointment-content:last-child div,
.page-job-entry .appointment-content:last-child div,
.page-desired-conditional-job-list .appointment-content:last-child div,
.page-reminder-notification .appointment-content:last-child div {
    border-bottom: 1px solid #d8d8d8
}

@media only screen and (max-width: 767px) {

    .page-mypage .appointment-content:last-child div.appointment-content-deadline,
    .page-mypage .appointment-content:last-child div.appointment-content-button,
    .page-history .appointment-content:last-child div.appointment-content-deadline,
    .page-history .appointment-content:last-child div.appointment-content-button,
    .page-mail .appointment-content:last-child div.appointment-content-deadline,
    .page-mail .appointment-content:last-child div.appointment-content-button,
    .page-resume .appointment-content:last-child div.appointment-content-deadline,
    .page-resume .appointment-content:last-child div.appointment-content-button,
    .page-appointment .appointment-content:last-child div.appointment-content-deadline,
    .page-appointment .appointment-content:last-child div.appointment-content-button,
    .page-online-interview-booking .appointment-content:last-child div.appointment-content-deadline,
    .page-online-interview-booking .appointment-content:last-child div.appointment-content-button,
    .page-account-setting .appointment-content:last-child div.appointment-content-deadline,
    .page-account-setting .appointment-content:last-child div.appointment-content-button,
    .page-job-entry .appointment-content:last-child div.appointment-content-deadline,
    .page-job-entry .appointment-content:last-child div.appointment-content-button,
    .page-desired-conditional-job-list .appointment-content:last-child div.appointment-content-deadline,
    .page-desired-conditional-job-list .appointment-content:last-child div.appointment-content-button,
    .page-reminder-notification .appointment-content:last-child div.appointment-content-deadline,
    .page-reminder-notification .appointment-content:last-child div.appointment-content-button {
        border-top: 0
    }
}

.page-mypage .appointment-content.appointment-interview .appointment-content-title,
.page-history .appointment-content.appointment-interview .appointment-content-title,
.page-mail .appointment-content.appointment-interview .appointment-content-title,
.page-resume .appointment-content.appointment-interview .appointment-content-title,
.page-appointment .appointment-content.appointment-interview .appointment-content-title,
.page-online-interview-booking .appointment-content.appointment-interview .appointment-content-title,
.page-account-setting .appointment-content.appointment-interview .appointment-content-title,
.page-job-entry .appointment-content.appointment-interview .appointment-content-title,
.page-desired-conditional-job-list .appointment-content.appointment-interview .appointment-content-title,
.page-reminder-notification .appointment-content.appointment-interview .appointment-content-title {
    background: url(/assets/icon-history-interview-e6063aeb8c9040c78a04a7415043777d6e78a5f669a481198db1736c33e860c7.png) center 20px no-repeat #F5F9FA
}

.page-mypage .appointment-content.appointment-interview .appointment-content-info p,
.page-history .appointment-content.appointment-interview .appointment-content-info p,
.page-mail .appointment-content.appointment-interview .appointment-content-info p,
.page-resume .appointment-content.appointment-interview .appointment-content-info p,
.page-appointment .appointment-content.appointment-interview .appointment-content-info p,
.page-online-interview-booking .appointment-content.appointment-interview .appointment-content-info p,
.page-account-setting .appointment-content.appointment-interview .appointment-content-info p,
.page-job-entry .appointment-content.appointment-interview .appointment-content-info p,
.page-desired-conditional-job-list .appointment-content.appointment-interview .appointment-content-info p,
.page-reminder-notification .appointment-content.appointment-interview .appointment-content-info p {
    color: #3a50c9
}

.page-mypage .appointment-content.appointment-interview:hover,
.page-history .appointment-content.appointment-interview:hover,
.page-mail .appointment-content.appointment-interview:hover,
.page-resume .appointment-content.appointment-interview:hover,
.page-appointment .appointment-content.appointment-interview:hover,
.page-online-interview-booking .appointment-content.appointment-interview:hover,
.page-account-setting .appointment-content.appointment-interview:hover,
.page-job-entry .appointment-content.appointment-interview:hover,
.page-desired-conditional-job-list .appointment-content.appointment-interview:hover,
.page-reminder-notification .appointment-content.appointment-interview:hover {
    background-color: #3a50c9
}

.page-mypage .appointment-content.appointment-interview:hover .appointment-content-info p,
.page-history .appointment-content.appointment-interview:hover .appointment-content-info p,
.page-mail .appointment-content.appointment-interview:hover .appointment-content-info p,
.page-resume .appointment-content.appointment-interview:hover .appointment-content-info p,
.page-appointment .appointment-content.appointment-interview:hover .appointment-content-info p,
.page-online-interview-booking .appointment-content.appointment-interview:hover .appointment-content-info p,
.page-account-setting .appointment-content.appointment-interview:hover .appointment-content-info p,
.page-job-entry .appointment-content.appointment-interview:hover .appointment-content-info p,
.page-desired-conditional-job-list .appointment-content.appointment-interview:hover .appointment-content-info p,
.page-reminder-notification .appointment-content.appointment-interview:hover .appointment-content-info p {
    color: #fff
}

.page-mypage .appointment-content.appointment-seminar .appointment-content-title,
.page-history .appointment-content.appointment-seminar .appointment-content-title,
.page-mail .appointment-content.appointment-seminar .appointment-content-title,
.page-resume .appointment-content.appointment-seminar .appointment-content-title,
.page-appointment .appointment-content.appointment-seminar .appointment-content-title,
.page-online-interview-booking .appointment-content.appointment-seminar .appointment-content-title,
.page-account-setting .appointment-content.appointment-seminar .appointment-content-title,
.page-job-entry .appointment-content.appointment-seminar .appointment-content-title,
.page-desired-conditional-job-list .appointment-content.appointment-seminar .appointment-content-title,
.page-reminder-notification .appointment-content.appointment-seminar .appointment-content-title {
    background: url(/assets/icon-history-seminar-dbe4ca234e983c70c384282000e241da72cd4f87de30192cc593fe4a5c4da863.png) center 20px no-repeat #F5F9FA
}

.page-mypage .appointment-content.appointment-seminar .appointment-content-info p,
.page-history .appointment-content.appointment-seminar .appointment-content-info p,
.page-mail .appointment-content.appointment-seminar .appointment-content-info p,
.page-resume .appointment-content.appointment-seminar .appointment-content-info p,
.page-appointment .appointment-content.appointment-seminar .appointment-content-info p,
.page-online-interview-booking .appointment-content.appointment-seminar .appointment-content-info p,
.page-account-setting .appointment-content.appointment-seminar .appointment-content-info p,
.page-job-entry .appointment-content.appointment-seminar .appointment-content-info p,
.page-desired-conditional-job-list .appointment-content.appointment-seminar .appointment-content-info p,
.page-reminder-notification .appointment-content.appointment-seminar .appointment-content-info p {
    color: #DAE5E1
}

.page-mypage .appointment-content.appointment-seminar:hover,
.page-history .appointment-content.appointment-seminar:hover,
.page-mail .appointment-content.appointment-seminar:hover,
.page-resume .appointment-content.appointment-seminar:hover,
.page-appointment .appointment-content.appointment-seminar:hover,
.page-online-interview-booking .appointment-content.appointment-seminar:hover,
.page-account-setting .appointment-content.appointment-seminar:hover,
.page-job-entry .appointment-content.appointment-seminar:hover,
.page-desired-conditional-job-list .appointment-content.appointment-seminar:hover,
.page-reminder-notification .appointment-content.appointment-seminar:hover {
    background-color: #DAE5E1
}

.page-mypage .appointment-content.appointment-seminar:hover .appointment-content-info p,
.page-history .appointment-content.appointment-seminar:hover .appointment-content-info p,
.page-mail .appointment-content.appointment-seminar:hover .appointment-content-info p,
.page-resume .appointment-content.appointment-seminar:hover .appointment-content-info p,
.page-appointment .appointment-content.appointment-seminar:hover .appointment-content-info p,
.page-online-interview-booking .appointment-content.appointment-seminar:hover .appointment-content-info p,
.page-account-setting .appointment-content.appointment-seminar:hover .appointment-content-info p,
.page-job-entry .appointment-content.appointment-seminar:hover .appointment-content-info p,
.page-desired-conditional-job-list .appointment-content.appointment-seminar:hover .appointment-content-info p,
.page-reminder-notification .appointment-content.appointment-seminar:hover .appointment-content-info p {
    color: #fff
}

.page-mypage .appointment-content .appointment-content-title,
.page-history .appointment-content .appointment-content-title,
.page-mail .appointment-content .appointment-content-title,
.page-resume .appointment-content .appointment-content-title,
.page-appointment .appointment-content .appointment-content-title,
.page-online-interview-booking .appointment-content .appointment-content-title,
.page-account-setting .appointment-content .appointment-content-title,
.page-job-entry .appointment-content .appointment-content-title,
.page-desired-conditional-job-list .appointment-content .appointment-content-title,
.page-reminder-notification .appointment-content .appointment-content-title {
    width: 90px;
    border-left: 1px solid #d8d8d8;
    border-right: 1px solid #d8d8d8;
    background-color: #F5F9FA
}

@media only screen and (max-width: 767px) {

    .page-mypage .appointment-content .appointment-content-title,
    .page-history .appointment-content .appointment-content-title,
    .page-mail .appointment-content .appointment-content-title,
    .page-resume .appointment-content .appointment-content-title,
    .page-appointment .appointment-content .appointment-content-title,
    .page-online-interview-booking .appointment-content .appointment-content-title,
    .page-account-setting .appointment-content .appointment-content-title,
    .page-job-entry .appointment-content .appointment-content-title,
    .page-desired-conditional-job-list .appointment-content .appointment-content-title,
    .page-reminder-notification .appointment-content .appointment-content-title {
        justify-content: center;
        align-items: center
    }
}

@media only screen and (max-width: 480px) {

    .page-mypage .appointment-content .appointment-content-title,
    .page-history .appointment-content .appointment-content-title,
    .page-mail .appointment-content .appointment-content-title,
    .page-resume .appointment-content .appointment-content-title,
    .page-appointment .appointment-content .appointment-content-title,
    .page-online-interview-booking .appointment-content .appointment-content-title,
    .page-account-setting .appointment-content .appointment-content-title,
    .page-job-entry .appointment-content .appointment-content-title,
    .page-desired-conditional-job-list .appointment-content .appointment-content-title,
    .page-reminder-notification .appointment-content .appointment-content-title {
        width: 80px
    }
}

.page-mypage .appointment-content .appointment-content-title p,
.page-history .appointment-content .appointment-content-title p,
.page-mail .appointment-content .appointment-content-title p,
.page-resume .appointment-content .appointment-content-title p,
.page-appointment .appointment-content .appointment-content-title p,
.page-online-interview-booking .appointment-content .appointment-content-title p,
.page-account-setting .appointment-content .appointment-content-title p,
.page-job-entry .appointment-content .appointment-content-title p,
.page-desired-conditional-job-list .appointment-content .appointment-content-title p,
.page-reminder-notification .appointment-content .appointment-content-title p {
    position: relative;
    top: 26px;
    font-size: 1.0rem;
    text-align: center;
    color: #000
}

.page-mypage .appointment-content .appointment-content-info,
.page-history .appointment-content .appointment-content-info,
.page-mail .appointment-content .appointment-content-info,
.page-resume .appointment-content .appointment-content-info,
.page-appointment .appointment-content .appointment-content-info,
.page-online-interview-booking .appointment-content .appointment-content-info,
.page-account-setting .appointment-content .appointment-content-info,
.page-job-entry .appointment-content .appointment-content-info,
.page-desired-conditional-job-list .appointment-content .appointment-content-info,
.page-reminder-notification .appointment-content .appointment-content-info {
    width: 361px
}

@media only screen and (min-width: 768px) {

    .page-mypage .appointment-content .appointment-content-info.info-long-width,
    .page-history .appointment-content .appointment-content-info.info-long-width,
    .page-mail .appointment-content .appointment-content-info.info-long-width,
    .page-resume .appointment-content .appointment-content-info.info-long-width,
    .page-appointment .appointment-content .appointment-content-info.info-long-width,
    .page-online-interview-booking .appointment-content .appointment-content-info.info-long-width,
    .page-account-setting .appointment-content .appointment-content-info.info-long-width,
    .page-job-entry .appointment-content .appointment-content-info.info-long-width,
    .page-desired-conditional-job-list .appointment-content .appointment-content-info.info-long-width,
    .page-reminder-notification .appointment-content .appointment-content-info.info-long-width {
        width: 450px
    }
}

@media only screen and (max-width: 767px) {

    .page-mypage .appointment-content .appointment-content-info,
    .page-history .appointment-content .appointment-content-info,
    .page-mail .appointment-content .appointment-content-info,
    .page-resume .appointment-content .appointment-content-info,
    .page-appointment .appointment-content .appointment-content-info,
    .page-online-interview-booking .appointment-content .appointment-content-info,
    .page-account-setting .appointment-content .appointment-content-info,
    .page-job-entry .appointment-content .appointment-content-info,
    .page-desired-conditional-job-list .appointment-content .appointment-content-info,
    .page-reminder-notification .appointment-content .appointment-content-info {
        width: calc(100% - 111px);
        align-items: center;
        border-right: 1px solid #d8d8d8
    }
}

@media only screen and (max-width: 480px) {

    .page-mypage .appointment-content .appointment-content-info,
    .page-history .appointment-content .appointment-content-info,
    .page-mail .appointment-content .appointment-content-info,
    .page-resume .appointment-content .appointment-content-info,
    .page-appointment .appointment-content .appointment-content-info,
    .page-online-interview-booking .appointment-content .appointment-content-info,
    .page-account-setting .appointment-content .appointment-content-info,
    .page-job-entry .appointment-content .appointment-content-info,
    .page-desired-conditional-job-list .appointment-content .appointment-content-info,
    .page-reminder-notification .appointment-content .appointment-content-info {
        border-left: 1px solid #d8d8d8;
        width: calc(100% - 80px)
    }
}

@media only screen and (max-width: 480px) {

    .page-mypage .appointment-content .appointment-content-info .appointment-content-date,
    .page-history .appointment-content .appointment-content-info .appointment-content-date,
    .page-mail .appointment-content .appointment-content-info .appointment-content-date,
    .page-resume .appointment-content .appointment-content-info .appointment-content-date,
    .page-appointment .appointment-content .appointment-content-info .appointment-content-date,
    .page-online-interview-booking .appointment-content .appointment-content-info .appointment-content-date,
    .page-account-setting .appointment-content .appointment-content-info .appointment-content-date,
    .page-job-entry .appointment-content .appointment-content-info .appointment-content-date,
    .page-desired-conditional-job-list .appointment-content .appointment-content-info .appointment-content-date,
    .page-reminder-notification .appointment-content .appointment-content-info .appointment-content-date {
        margin-left: 3px
    }
}

.page-mypage .appointment-content .appointment-content-info .appointment-content-date::before,
.page-history .appointment-content .appointment-content-info .appointment-content-date::before,
.page-mail .appointment-content .appointment-content-info .appointment-content-date::before,
.page-resume .appointment-content .appointment-content-info .appointment-content-date::before,
.page-appointment .appointment-content .appointment-content-info .appointment-content-date::before,
.page-online-interview-booking .appointment-content .appointment-content-info .appointment-content-date::before,
.page-account-setting .appointment-content .appointment-content-info .appointment-content-date::before,
.page-job-entry .appointment-content .appointment-content-info .appointment-content-date::before,
.page-desired-conditional-job-list .appointment-content .appointment-content-info .appointment-content-date::before,
.page-reminder-notification .appointment-content .appointment-content-info .appointment-content-date::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    position: relative;
    top: 4px;
    content: "alarm";
    display: inline-block;
    font-size: 1.6rem;
    margin-right: 4px;
    color: #000
}

.page-mypage .appointment-content .appointment-content-info .appointment-content-venue,
.page-history .appointment-content .appointment-content-info .appointment-content-venue,
.page-mail .appointment-content .appointment-content-info .appointment-content-venue,
.page-resume .appointment-content .appointment-content-info .appointment-content-venue,
.page-appointment .appointment-content .appointment-content-info .appointment-content-venue,
.page-online-interview-booking .appointment-content .appointment-content-info .appointment-content-venue,
.page-account-setting .appointment-content .appointment-content-info .appointment-content-venue,
.page-job-entry .appointment-content .appointment-content-info .appointment-content-venue,
.page-desired-conditional-job-list .appointment-content .appointment-content-info .appointment-content-venue,
.page-reminder-notification .appointment-content .appointment-content-info .appointment-content-venue {
    margin-top: 4px
}

.page-mypage .appointment-content .appointment-content-info .appointment-content-venue::before,
.page-history .appointment-content .appointment-content-info .appointment-content-venue::before,
.page-mail .appointment-content .appointment-content-info .appointment-content-venue::before,
.page-resume .appointment-content .appointment-content-info .appointment-content-venue::before,
.page-appointment .appointment-content .appointment-content-info .appointment-content-venue::before,
.page-online-interview-booking .appointment-content .appointment-content-info .appointment-content-venue::before,
.page-account-setting .appointment-content .appointment-content-info .appointment-content-venue::before,
.page-job-entry .appointment-content .appointment-content-info .appointment-content-venue::before,
.page-desired-conditional-job-list .appointment-content .appointment-content-info .appointment-content-venue::before,
.page-reminder-notification .appointment-content .appointment-content-info .appointment-content-venue::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    position: relative;
    top: 4px;
    content: "room";
    display: inline-block;
    font-size: 1.6rem;
    margin-right: 4px;
    color: #000
}

.page-mypage .appointment-content .appointment-content-info .appointment-content-seminar,
.page-history .appointment-content .appointment-content-info .appointment-content-seminar,
.page-mail .appointment-content .appointment-content-info .appointment-content-seminar,
.page-resume .appointment-content .appointment-content-info .appointment-content-seminar,
.page-appointment .appointment-content .appointment-content-info .appointment-content-seminar,
.page-online-interview-booking .appointment-content .appointment-content-info .appointment-content-seminar,
.page-account-setting .appointment-content .appointment-content-info .appointment-content-seminar,
.page-job-entry .appointment-content .appointment-content-info .appointment-content-seminar,
.page-desired-conditional-job-list .appointment-content .appointment-content-info .appointment-content-seminar,
.page-reminder-notification .appointment-content .appointment-content-info .appointment-content-seminar {
    margin-top: 4px
}

.page-mypage .appointment-content .appointment-content-info ul,
.page-history .appointment-content .appointment-content-info ul,
.page-mail .appointment-content .appointment-content-info ul,
.page-resume .appointment-content .appointment-content-info ul,
.page-appointment .appointment-content .appointment-content-info ul,
.page-online-interview-booking .appointment-content .appointment-content-info ul,
.page-account-setting .appointment-content .appointment-content-info ul,
.page-job-entry .appointment-content .appointment-content-info ul,
.page-desired-conditional-job-list .appointment-content .appointment-content-info ul,
.page-reminder-notification .appointment-content .appointment-content-info ul {
    font-size: 1.2rem;
    padding-left: 20px
}

.page-mypage .appointment-content .appointment-content-info-col-2,
.page-history .appointment-content .appointment-content-info-col-2,
.page-mail .appointment-content .appointment-content-info-col-2,
.page-resume .appointment-content .appointment-content-info-col-2,
.page-appointment .appointment-content .appointment-content-info-col-2,
.page-online-interview-booking .appointment-content .appointment-content-info-col-2,
.page-account-setting .appointment-content .appointment-content-info-col-2,
.page-job-entry .appointment-content .appointment-content-info-col-2,
.page-desired-conditional-job-list .appointment-content .appointment-content-info-col-2,
.page-reminder-notification .appointment-content .appointment-content-info-col-2 {
    width: 546px
}

@media only screen and (max-width: 767px) {

    .page-mypage .appointment-content .appointment-content-info-col-2,
    .page-history .appointment-content .appointment-content-info-col-2,
    .page-mail .appointment-content .appointment-content-info-col-2,
    .page-resume .appointment-content .appointment-content-info-col-2,
    .page-appointment .appointment-content .appointment-content-info-col-2,
    .page-online-interview-booking .appointment-content .appointment-content-info-col-2,
    .page-account-setting .appointment-content .appointment-content-info-col-2,
    .page-job-entry .appointment-content .appointment-content-info-col-2,
    .page-desired-conditional-job-list .appointment-content .appointment-content-info-col-2,
    .page-reminder-notification .appointment-content .appointment-content-info-col-2 {
        width: calc(100% - 111px);
        display: block;
        height: auto
    }
}

@media only screen and (max-width: 767px) {

    .page-mypage .appointment-content .appointment-content-deadline,
    .page-history .appointment-content .appointment-content-deadline,
    .page-mail .appointment-content .appointment-content-deadline,
    .page-resume .appointment-content .appointment-content-deadline,
    .page-appointment .appointment-content .appointment-content-deadline,
    .page-online-interview-booking .appointment-content .appointment-content-deadline,
    .page-account-setting .appointment-content .appointment-content-deadline,
    .page-job-entry .appointment-content .appointment-content-deadline,
    .page-desired-conditional-job-list .appointment-content .appointment-content-deadline,
    .page-reminder-notification .appointment-content .appointment-content-deadline {
        width: 100%;
        height: auto;
        border-left: 1px solid #d8d8d8;
        border-right: 1px solid #d8d8d8
    }

    .page-mypage .appointment-content .appointment-content-deadline br,
    .page-history .appointment-content .appointment-content-deadline br,
    .page-mail .appointment-content .appointment-content-deadline br,
    .page-resume .appointment-content .appointment-content-deadline br,
    .page-appointment .appointment-content .appointment-content-deadline br,
    .page-online-interview-booking .appointment-content .appointment-content-deadline br,
    .page-account-setting .appointment-content .appointment-content-deadline br,
    .page-job-entry .appointment-content .appointment-content-deadline br,
    .page-desired-conditional-job-list .appointment-content .appointment-content-deadline br,
    .page-reminder-notification .appointment-content .appointment-content-deadline br {
        display: none
    }
}

.page-mypage .appointment-content .appointment-content-button,
.page-history .appointment-content .appointment-content-button,
.page-mail .appointment-content .appointment-content-button,
.page-resume .appointment-content .appointment-content-button,
.page-appointment .appointment-content .appointment-content-button,
.page-online-interview-booking .appointment-content .appointment-content-button,
.page-account-setting .appointment-content .appointment-content-button,
.page-job-entry .appointment-content .appointment-content-button,
.page-desired-conditional-job-list .appointment-content .appointment-content-button,
.page-reminder-notification .appointment-content .appointment-content-button {
    width: 140px;
    border-right: 1px solid #d8d8d8;
    border-top: 1px solid #d8d8d8
}

@media only screen and (max-width: 767px) {

    .page-mypage .appointment-content .appointment-content-button,
    .page-history .appointment-content .appointment-content-button,
    .page-mail .appointment-content .appointment-content-button,
    .page-resume .appointment-content .appointment-content-button,
    .page-appointment .appointment-content .appointment-content-button,
    .page-online-interview-booking .appointment-content .appointment-content-button,
    .page-account-setting .appointment-content .appointment-content-button,
    .page-job-entry .appointment-content .appointment-content-button,
    .page-desired-conditional-job-list .appointment-content .appointment-content-button,
    .page-reminder-notification .appointment-content .appointment-content-button {
        width: 100%;
        height: auto;
        border-left: 1px solid #d8d8d8;
        border-right: 1px solid #d8d8d8;
        justify-content: flex-end
    }
}

.page-mypage .appointment-content .appointment-content-button .button,
.page-history .appointment-content .appointment-content-button .button,
.page-mail .appointment-content .appointment-content-button .button,
.page-resume .appointment-content .appointment-content-button .button,
.page-appointment .appointment-content .appointment-content-button .button,
.page-online-interview-booking .appointment-content .appointment-content-button .button,
.page-account-setting .appointment-content .appointment-content-button .button,
.page-job-entry .appointment-content .appointment-content-button .button,
.page-desired-conditional-job-list .appointment-content .appointment-content-button .button,
.page-reminder-notification .appointment-content .appointment-content-button .button {
    width: 140px;
    height: 26px;
    font-size: 1.0rem
}

.page-mypage .event-day,
.page-history .event-day,
.page-mail .event-day,
.page-resume .event-day,
.page-appointment .event-day,
.page-online-interview-booking .event-day,
.page-account-setting .event-day,
.page-job-entry .event-day,
.page-desired-conditional-job-list .event-day,
.page-reminder-notification .event-day {
    width: 100%;
    float: left;
    margin-bottom: 20px;
    display: flex
}

.page-mypage .event-day:after,
.page-history .event-day:after,
.page-mail .event-day:after,
.page-resume .event-day:after,
.page-appointment .event-day:after,
.page-online-interview-booking .event-day:after,
.page-account-setting .event-day:after,
.page-job-entry .event-day:after,
.page-desired-conditional-job-list .event-day:after,
.page-reminder-notification .event-day:after {
    content: "";
    height: 3px;
    background-color: #89ABE3;
    margin-top: 10px;
    margin-left: 10px;
    width: calc(100% - 140px);
    display: inline-block;
    float: right
}

.user-video .md-radio {
    padding-bottom: 5px
}

.user-video .user-video-button {
    display: flex;
    justify-content: flex-end
}

@media only screen and (max-width: 599px) {
    .user-video .user-video-button {
        margin-bottom: 20px
    }
}

.user-video .user-video-button .single-upload {
    width: 140px
}

.user-video .user-video-button button {
    width: 140px;
    margin-left: 10px
}

.user-video .user-video-button button.button-delete {
    background-color: #6A6B6D
}

.user-video .user-video-button button.button-delete.button-delete-error::before {
    background-color: #A5A7AB
}

.user-video .user-video-button button.button-delete::before {
    background-color: lightgray
}

.user-video .user-video-label {
    position: absolute;
    top: 5px;
    right: 5px;
    padding: 14px 16px 16px 16px;
    line-height: 1;
    background: #d03a1c;
    border-radius: 100%
}

.user-video .user-video-label::after {
    content: '';
    position: absolute;
    border-top: 10px solid #d03a1c;
    border-right: 5px solid transparent;
    border-left: 5px solid transparent;
    bottom: 0px;
    left: 0px;
    transform: rotate(45deg)
}

.user-video .user-video-label span {
    color: #fff;
    font-size: 1.1rem
}

.user-video,
.user-video-upload-box {
    margin-top: 20px
}

@media only screen and (max-width: 599px) {

    .user-video .user-box-title,
    .user-video-upload-box .user-box-title {
        padding: 0px !important
    }
}

.user-video .md-checkbox,
.user-video-upload-box .md-checkbox {
    margin: 0 0 5px;
    display: inline-block
}

@media only screen and (max-width: 599px) {

    .user-video .md-checkbox,
    .user-video-upload-box .md-checkbox {
        display: block
    }
}

.video-register-contents .heading-style-02 {
    margin-top: 40px;
    float: left;
    width: 100%
}

.video-register-note {
    background: #F5F9FA;
    padding: 20px;
    word-break: break-word
}

.note-message {
    text-align: center;
    color: #25B665;
    font-weight: bold;
    padding-bottom: 20px
}

.user-video-footer {
    padding: 0 20px 20px 20px
}

.user-video-footer .user-video-history {
    margin-top: 10px;
    word-break: break-word
}

.user-video-footer .cf-icon {
    margin-right: 10px
}

.user-video-upload-box .user-job-footer .md-checkbox {
    margin: 0;
    padding-top: 5px
}

.user-video-upload-box .video-title {
    margin: 10px 0 5px
}

.user-job,
.user-video,
.user-video-upload-box {
    margin-bottom: 20px
}

.user-job .user-box-inner,
.user-video .user-box-inner,
.user-video-upload-box .user-box-inner {
    *zoom: 1
}

.user-job .user-box-inner:before,
.user-job .user-box-inner:after,
.user-video .user-box-inner:before,
.user-video .user-box-inner:after,
.user-video-upload-box .user-box-inner:before,
.user-video-upload-box .user-box-inner:after {
    content: " ";
    display: table
}

.user-job .user-box-inner:after,
.user-video .user-box-inner:after,
.user-video-upload-box .user-box-inner:after {
    clear: both
}

.user-job .user-job-occupation,
.user-video .user-job-occupation,
.user-video-upload-box .user-job-occupation {
    word-break: break-all;
    margin-bottom: 6px
}

@media only screen and (max-width: 599px) {

    .user-job .user-job-occupation,
    .user-video .user-job-occupation,
    .user-video-upload-box .user-job-occupation {
        clear: left
    }
}

.user-job .user-box-title,
.user-video .user-box-title,
.user-video-upload-box .user-box-title {
    word-break: break-word;
    position: relative;
    padding: 0 0 0 230px;
    min-height: 160px
}

@media only screen and (max-width: 1240px) {

    .user-job .user-box-title,
    .user-video .user-box-title,
    .user-video-upload-box .user-box-title {
        padding: 0 0 0 210px
    }
}

@media only screen and (max-width: 599px) {

    .user-job .user-box-title,
    .user-video .user-box-title,
    .user-video-upload-box .user-box-title {
        padding: 0
    }
}

.user-job .user-box-title h3,
.user-video .user-box-title h3,
.user-video-upload-box .user-box-title h3 {
    margin: 10px 0;
    font-weight: normal;
    font-size: 1.6rem
}

@media only screen and (max-width: 767px) {

    .user-job .user-box-title h3,
    .user-video .user-box-title h3,
    .user-video-upload-box .user-box-title h3 {
        font-size: 1.4rem
    }
}

@media only screen and (max-width: 599px) {

    .user-job .user-box-title h3,
    .user-video .user-box-title h3,
    .user-video-upload-box .user-box-title h3 {
        width: calc(100% - 110px);
        float: left;
        margin-left: 10px
    }
}

.user-job .user-box-title .cf-icon,
.user-video .user-box-title .cf-icon,
.user-video-upload-box .user-box-title .cf-icon {
    position: relative
}

@media only screen and (max-width: 599px) {

    .user-job .user-box-title .cf-icon,
    .user-video .user-box-title .cf-icon,
    .user-video-upload-box .user-box-title .cf-icon {
        float: left
    }
}

@media only screen and (max-width: 599px) {

    .user-job .user-box-title .cf-icon~.cf-icon,
    .user-video .user-box-title .cf-icon~.cf-icon,
    .user-video-upload-box .user-box-title .cf-icon~.cf-icon {
        margin-left: 5px
    }
}

.user-job .user-box-title .user-job-company,
.user-video .user-box-title .user-job-company,
.user-video-upload-box .user-box-title .user-job-company {
    font-size: 1.4rem;
    margin: 0
}

@media only screen and (max-width: 599px) {

    .user-job .user-box-title .user-job-company,
    .user-video .user-box-title .user-job-company,
    .user-video-upload-box .user-box-title .user-job-company {
        clear: left;
        margin-bottom: 10px
    }
}

.user-job .user-job-photo,
.user-video .user-job-photo,
.user-video-upload-box .user-job-photo {
    width: 200px;
    height: 140px;
    background-color: #d8d8d8;
    border: 1px solid #6A6B6D;
    position: absolute;
    left: 0px
}

@media only screen and (max-width: 599px) {

    .user-job .user-job-photo,
    .user-video .user-job-photo,
    .user-video-upload-box .user-job-photo {
        position: static;
        margin: 0 0 10px
    }
}

.user-job dl,
.user-video dl,
.user-video-upload-box dl {
    margin: 0;
    display: -webkit-flex;
    display: flex;
    flex-wrap: wrap;
    margin: 0;
    align-items: flex-start;
    padding-top: 20px
}

.user-job dl dt,
.user-video dl dt,
.user-video-upload-box dl dt {
    position: relative;
    width: 9em;
    border: 1px solid #3a50c9;
    font-size: 1.2rem;
    margin: 0 0 20px 0;
    padding: 5px 0 5px 30px;
    margin-right: 20px;
    font-weight: normal;
    text-align: left
}

@media only screen and (max-width: 864px) {

    .user-job dl dt,
    .user-video dl dt,
    .user-video-upload-box dl dt {
        padding: 5px 0 5px 30px;
        margin: 0 0 10px
    }
}

.user-job dl dt:nth-child(4n-1),
.user-video dl dt:nth-child(4n-1),
.user-video-upload-box dl dt:nth-child(4n-1) {
    margin-left: 30px
}

@media only screen and (max-width: 864px) {

    .user-job dl dt:nth-child(4n-1),
    .user-video dl dt:nth-child(4n-1),
    .user-video-upload-box dl dt:nth-child(4n-1) {
        margin-left: 0
    }
}

.user-job dl dt::before,
.user-video dl dt::before,
.user-video-upload-box dl dt::before {
    content: "";
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    position: absolute;
    color: #3a50c9;
    top: 50%;
    margin-top: -0.5em;
    left: 8px;
    font-size: 1.6rem
}

.user-job dl .user-job-detail-title-01::before,
.user-video dl .user-job-detail-title-01::before,
.user-video-upload-box dl .user-job-detail-title-01::before {
    content: "account_balance"
}

.user-job dl .user-job-detail-title-02::before,
.user-video dl .user-job-detail-title-02::before,
.user-video-upload-box dl .user-job-detail-title-02::before {
    content: "translate"
}

.user-job dl .user-job-detail-title-03::before,
.user-video dl .user-job-detail-title-03::before,
.user-video-upload-box dl .user-job-detail-title-03::before {
    content: "work"
}

.user-job dl .user-job-detail-title-04::before,
.user-video dl .user-job-detail-title-04::before,
.user-video-upload-box dl .user-job-detail-title-04::before {
    content: "class"
}

.user-job dl .user-job-detail-title-05::before,
.user-video dl .user-job-detail-title-05::before,
.user-video-upload-box dl .user-job-detail-title-05::before {
    content: "room"
}

.user-job dl .user-job-detail-title-06::before,
.user-video dl .user-job-detail-title-06::before,
.user-video-upload-box dl .user-job-detail-title-06::before {
    content: "school"
}

.user-job dl dd,
.user-video dl dd,
.user-video-upload-box dl dd {
    word-break: break-word;
    width: calc(44% - 9em);
    font-size: 1.2rem;
    margin: 0 0 20px 0;
    line-height: 1.4
}

@media only screen and (max-width: 864px) {

    .user-job dl dd,
    .user-video dl dd,
    .user-video-upload-box dl dd {
        width: calc(100% - 9em);
        padding: 0 0 5px 10px
    }
}

.user-job .user-job-footer,
.user-video .user-job-footer,
.user-video-upload-box .user-job-footer {
    padding: 10px 20px;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: flex-end;
    justify-content: flex-end
}

@media only screen and (max-width: 599px) {

    .user-job .user-job-footer,
    .user-video .user-job-footer,
    .user-video-upload-box .user-job-footer {
        padding: 10px
    }
}

@media only screen and (max-width: 480px) {

    .user-job .user-job-footer,
    .user-video .user-job-footer,
    .user-video-upload-box .user-job-footer {
        display: block
    }
}

.user-job .user-job-footer p,
.user-video .user-job-footer p,
.user-video-upload-box .user-job-footer p {
    margin: 0
}

.user-job .user-job-footer .user-job-deadline,
.user-video .user-job-footer .user-job-deadline,
.user-video-upload-box .user-job-footer .user-job-deadline {
    margin-right: 10px
}

.user-job .user-job-footer .button,
.user-video .user-job-footer .button,
.user-video-upload-box .user-job-footer .button {
    width: 140px;
    height: 30px;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s
}

.user-job .user-job-footer .button:hover::before,
.user-video .user-job-footer .button:hover::before,
.user-video-upload-box .user-job-footer .button:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.user-job .user-job-footer .button:hover,
.user-job .user-job-footer .button:focus,
.user-job .user-job-footer .button:active,
.user-video .user-job-footer .button:hover,
.user-video .user-job-footer .button:focus,
.user-video .user-job-footer .button:active,
.user-video-upload-box .user-job-footer .button:hover,
.user-video-upload-box .user-job-footer .button:focus,
.user-video-upload-box .user-job-footer .button:active {
    color: #fff
}

.user-job .user-job-footer .button::before,
.user-video .user-job-footer .button::before,
.user-video-upload-box .user-job-footer .button::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -55px;
    left: 0px;
    border-radius: 100%;
    background-color: #3a50c9;
    width: 140px;
    height: 140px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

@media only screen and (max-width: 480px) {

    .user-job .user-job-footer .button.button-apply,
    .user-video .user-job-footer .button.button-apply,
    .user-video-upload-box .user-job-footer .button.button-apply {
        width: 100%;
        margin-top: 10px;
        display: block;
        text-align: center;
        line-height: 30px;
        position: relative;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        overflow: hidden;
        -moz-osx-font-smoothing: grayscale;
        position: relative;
        -webkit-transition-property: all;
        transition-property: all;
        -webkit-transition-duration: 0.1s;
        transition-duration: 0.1s
    }

    .user-job .user-job-footer .button.button-apply:hover::before,
    .user-video .user-job-footer .button.button-apply:hover::before,
    .user-video-upload-box .user-job-footer .button.button-apply:hover::before {
        -webkit-transform: scale(2);
        transform: scale(2);
        opacity: 1
    }

    .user-job .user-job-footer .button.button-apply:hover,
    .user-job .user-job-footer .button.button-apply:focus,
    .user-job .user-job-footer .button.button-apply:active,
    .user-video .user-job-footer .button.button-apply:hover,
    .user-video .user-job-footer .button.button-apply:focus,
    .user-video .user-job-footer .button.button-apply:active,
    .user-video-upload-box .user-job-footer .button.button-apply:hover,
    .user-video-upload-box .user-job-footer .button.button-apply:focus,
    .user-video-upload-box .user-job-footer .button.button-apply:active {
        color: #fff
    }

    .user-job .user-job-footer .button.button-apply::before,
    .user-video .user-job-footer .button.button-apply::before,
    .user-video-upload-box .user-job-footer .button.button-apply::before {
        content: "";
        display: block;
        position: absolute;
        z-index: -1;
        top: -235px;
        left: 0px;
        border-radius: 100%;
        background-color: #3a50c9;
        width: 500px;
        height: 500px;
        -webkit-transform: scale(0);
        transform: scale(0);
        -webkit-transition-property: transform;
        transition-property: transform;
        -webkit-transition-duration: 0.3s;
        transition-duration: 0.3s;
        -webkit-transition-property: all;
        transition-property: all;
        -webkit-transition-timing-function: ease-out;
        transition-timing-function: ease-out;
        opacity: 0.2
    }
}

.finished-registration {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 999;
    background: #3a50c9;
    padding: 15px 0;
    margin: 0;
    border-radius: 0
}

.finished-registration-fixed-top {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 999;
    background: #3a50c9;
    padding: 15px 0;
    margin: 0;
    border-radius: 0
}

.alert-inner {
    width: 100%;
    text-align: center;
    max-width: 1210px;
    color: #fff;
    font-size: 1.8rem;
    padding: 15px;
    margin: 0 auto;
    position: relative
}

.alert-inner .close {
    text-shadow: none;
    opacity: 1;
    right: -10px
}

.alert-inner .close:focus {
    outline: 0
}

.alert-inner .close i {
    font-size: 3rem
}

.user-video-controller {
    margin: 20px -5px 0;
    display: flex
}

.user-video-controller .videoList-text p {
    margin-bottom: 5px
}

@media only screen and (max-width: 1022px) {
    .user-video-controller {
        display: block
    }
}

.user-video-controller span {
    padding-top: 5px
}

.user-video-controller .button-upload {
    margin-left: auto
}

#jobNoVideo .noti {
    float: right;
    font-weight: bold
}

#jobNoVideo .user-history {
    margin-top: 10px;
    margin-bottom: 20px
}

#jobNoVideo .user-box-inner {
    display: flex
}

#jobNoVideo .user-box-inner .history-button-wrapper {
    align-items: center
}

#jobNoVideo .user-box-inner .history-title h3 {
    word-break: break-word;
    margin-bottom: 5px
}

#jobNoVideo .user-box-inner .history-title-company {
    margin-right: 20px;
    word-break: break-all;
    display: inline-table
}

#jobNoVideo .user-box-inner .history-title-date {
    margin-left: 0
}

#jobNoVideo .video-pattern,
#jobNoVideo .row {
    margin: 0
}

.cf-popup-form-button .button-videoscout {
    width: 220px
}

@media only screen and (max-width: 599px) {

    .user-video .user-box-title,
    .user-video-upload-box .user-box-title {
        padding: 0
    }
}

.user-video .user-box-title p,
.user-video-upload-box .user-box-title p {
    padding: 0;
    font-size: 1.2rem;
    line-height: 1.8;
    margin-bottom: 1em;
    text-align: justify
}

.user-video .user-box-title textarea,
.user-video-upload-box .user-box-title textarea {
    height: 60px
}

.toggle-autocomplete+.autocomplete {
    display: none
}

.toggle-autocomplete:focus+.autocomplete {
    display: block
}

.video-pattern {
    margin: 0 0 20px
}

.video-pattern .video-pattern-label {
    margin: 0 10px 0 0;
    color: #000
}

.video-pattern .video-pattern-detail {
    display: inline-block;
    padding: 4px;
    font-size: 1.0rem;
    line-height: 1;
    min-width: 92px;
    text-align: center;
    color: #fff;
    background: #e67e22
}

.toggle-video-history {
    display: none;
    margin: 10px 0 0
}

.toggle-video-history.up .icon-up {
    display: inline-block
}

.toggle-video-history.up .icon-down {
    display: none
}

.toggle-video-history i {
    font-size: 3rem
}

.toggle-video-history .icon-up {
    display: none
}

.gray {
    background-color: lightgray;
    position: relative
}

.gray .video-converting {
    top: 48px !important
}

.gray .disable-banner {
    width: 100%;
    height: 160px;
    position: absolute;
    background-color: #3a50c9;
    z-index: 1;
    top: 50px;
    color: #fff;
    text-align: center
}

.gray .disable-title {
    font-weight: bold;
    font-size: 30px;
    margin-top: 30px
}

.page-mypage .job-mypage .user-box .user-box-inner {
    padding: 10px 20px
}

.page-mypage .job-mypage .history-title h3 {
    margin: 4px 0 10px 0
}

.page-mypage .job-mypage .video-pattern {
    margin: 0
}

.page-mypage .job-mypage .history-button-wrapper .notice {
    margin-bottom: 0
}

.page-mypage .job-mypage #event_years,
.page-mypage .job-mypage #job_apply_years {
    font-size: 12px;
    padding: 4px 10px;
    height: 30px;
    width: 80px;
    min-width: 80px
}

.page-mypage .job-mypage .user-history {
    margin-top: 20px
}

.page-mypage .user-schedule-select:after {
    left: -20px;
    pointer-events: none
}

.page-mypage #event-applied {
    color: #3A50C9;
    font-size: 1.3em;
    border: 1px solid #a6a6a6;
    background-color: #fff;
    border-radius: 4px;
    outline: none
}

@media only screen and (min-width: 481px) {
    .page-mypage #event-applied {
        min-width: 150px;
        width: auto
    }
}

@media only screen and (max-width: 480px) {
    .page-mypage #event-applied {
        min-width: 100%;
        width: 100%
    }
}

.user-video-status {
    width: 100%
}

@media only screen and (min-width: 598px) {
    .user-video-status {
        display: flex
    }
}

@media only screen and (max-width: 599px) {
    .user-video-status {
        display: inherit;
        float: left
    }
}

.user-video-status .video-status {
    font-weight: bold;
    float: left
}

.user-video-status .md-switch {
    float: left
}

@media only screen and (max-width: 599px) {
    .user-video-status .md-switch {
        margin-left: 10px
    }
}

@media only screen and (min-width: 598px) {
    .user-video-status .resume-status {
        margin-left: 10px
    }
}

.user-video-status .account-setting-status {
    display: inherit
}

@media only screen and (max-width: 599px) {
    .user-video-status .account-setting-status {
        width: 100%;
        float: left
    }
}

.user-video-status .public-status {
    font-size: 1.0rem;
    margin-top: 2px
}

@media only screen and (min-width: 598px) {
    .user-video-status .public-status {
        margin-left: 10px
    }
}

@media only screen and (max-width: 599px) {
    .new_user_video .user-box-title>p {
        width: calc(100% - 42px);
        margin: 0 0 15px
    }

    .new_user_video .user-box-title .md-textarea.pr-40.is-focused .md-textarea-label {
        top: -27px;
        line-height: 1
    }

    .new_user_video .user-box-title .md-textarea.pr-40 .md-textarea-label {
        width: calc(100% - 42px)
    }
}

.user-box {
    width: 100%;
    float: left
}

.user-box.user-job {
    width: 100%;
    float: left;
    clear: both
}

.user-box .user-box-inner .user-box-appointment-title,
.user-box .user-box-inner .user-box-appointment-list {
    width: 100%;
    clear: both;
    color: #000
}

.user-box .user-box-inner .user-box-appointment-list {
    margin-bottom: 20px
}

.user-box .user-box-inner.user-box-inner-disable {
    background: #f3f3f3
}

.user-box .history-alert-message {
    font-size: 1.4rem
}

.work-information-title {
    width: 100%;
    float: left;
    clear: both;
    background: linear-gradient(135deg, #6999DD, #1E9BC1);
    border-radius: 5px;
    color: #fff;
    padding: 0.5em 1em;
    font-size: 22px;
    font-weight: bold;
    align-items: center;
    margin-top: 0;
    margin-bottom: 0px !important
}

#modal-destroy-email .modal-dialog {
    min-width: 20%
}

@media (min-width: 768px) {
    #modal-destroy-email .modal-dialog {
        width: 400px
    }
}

.video-list-modal .modal.modal-video.fade .modal-dialog {
    max-width: 800px;
    min-width: initial;
    max-height: 600px
}

.video-list-modal .modal.modal-video.fade .modal-dialog .modal-content {
    float: left;
    width: 100%
}

.video-list-modal .modal.modal-video.fade .modal-dialog .modal-body {
    float: left;
    width: 100%;
    padding: 30px 50px 0
}

@media only screen and (max-width: 599px) {
    .video-list-modal .modal.modal-video.fade .modal-dialog .modal-body {
        padding: 30px 20px 0
    }
}

.video-list-modal .modal.modal-video.fade .modal-dialog .modal-body .video-player {
    max-width: 100%;
    max-height: 100%;
    height: auto;
    width: auto;
    object-fit: cover
}

@media only screen and (max-width: 599px) {
    .video-list-modal .modal.modal-video.fade .modal-dialog .modal-body .video-player {
        max-width: 300px;
        max-height: 350px
    }
}

@media only screen and (max-width: 480px) {
    .video-list-modal .modal.modal-video.fade .modal-dialog .modal-body .video-player {
        max-width: 250px;
        max-height: 280px
    }
}

.video-list-modal .modal.modal-video.fade .modal-dialog .modal-footer {
    float: left;
    width: 100%
}

.video-entry-modal-preview .modal.modal-video.fade .modal-dialog {
    max-width: 800px;
    min-width: initial;
    max-height: 600px
}

.video-entry-modal-preview .modal.modal-video.fade .modal-dialog .modal-content {
    float: left;
    width: 100%
}

.video-entry-modal-preview .modal.modal-video.fade .modal-dialog .modal-body {
    float: left;
    width: 100%;
    padding: 30px 50px 0
}

@media only screen and (max-width: 599px) {
    .video-entry-modal-preview .modal.modal-video.fade .modal-dialog .modal-body {
        padding: 30px 20px 0
    }
}

.video-entry-modal-preview .modal.modal-video.fade .modal-dialog .modal-body .video-player {
    max-width: 100%;
    max-height: 100%;
    height: auto;
    width: auto;
    object-fit: cover
}

@media only screen and (max-width: 599px) {
    .video-entry-modal-preview .modal.modal-video.fade .modal-dialog .modal-body .video-player {
        max-width: 300px;
        max-height: 350px
    }
}

@media only screen and (max-width: 480px) {
    .video-entry-modal-preview .modal.modal-video.fade .modal-dialog .modal-body .video-player {
        max-width: 250px;
        max-height: 280px
    }
}

.video-entry-modal-preview .modal.modal-video.fade .modal-dialog .modal-footer {
    float: left;
    width: 100%
}

.user-agreement .condition {
    margin-left: 20px
}

.user-agreement p {
    margin-bottom: 1em
}

.user-agreement .authentication-condition {
    margin-left: 40px
}

@media (min-width: 1022px) and (max-width: 1241px) {
    .page-mypage .history-content .history-content-info.info-long-width {
        max-width: 290px
    }
}

.page-mypage .online-interview .user-box {
    float: none;
    margin-bottom: 0
}

.page-mypage .online-interview .form-control-s {
    height: 30px;
    padding: 4px 8px;
    margin: 3px 0 3px 5px;
    font-size: 100%;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px
}

.page-mypage .online-interview .material-icons {
    font-family: 'Material Icons';
    font-size: 25px;
    display: inline-flex;
    vertical-align: middle
}

.page-mypage .online-interview .blue-color {
    color: #3A50C9
}

.page-mypage .online-interview .user-select-box {
    display: flex;
    align-items: center;
    margin-bottom: 10px
}

.page-mypage .online-interview .disabled-icon {
    cursor: not-allowed !important;
    color: #9A9B9D
}

.page-mypage .online-interview .top-subtitle {
    font-weight: bold;
    margin: 15px 0 0 0;
    clear: both
}

.page-mypage .online-interview .top-subtitle img {
    width: 30px;
    margin: 0 5px 0 0
}

.page-mypage .online-interview .olsem-list-table {
    border-left: 1px solid #ccc;
    margin: 0.5rem 0;
    width: 100%;
    word-break: break-word
}

.page-mypage .online-interview .olsem-list-table td {
    border-right: 1px solid #eee;
    padding: 0.7rem 1rem;
    vertical-align: middle;
    line-height: 1.7rem;
    text-align: center
}

.page-mypage .online-interview .olsem-list-table th {
    border-right: 1px solid #eee;
    padding: 0.7rem 1rem;
    vertical-align: middle;
    line-height: 1.5rem;
    background: #f3f3f3;
    text-align: center;
    color: #666;
    font-size: 90%;
    word-break: keep-all
}

.page-mypage .online-interview .olsem-list-table tr {
    border-bottom: 1px solid #ccc
}

.page-mypage .online-interview .olsem-list-table .blue-label {
    background-color: #1b365d
}

.page-mypage .online-interview .olsem-list-table .min-width-sm {
    min-width: 100px !important
}

.page-mypage .online-interview .olsem-list-table .min-width-md {
    min-width: 150px !important
}

.page-mypage .online-interview .b-end {
    border-right: 1px solid #ccc !important
}

.page-mypage .online-interview .button1 {
    color: #fff;
    margin: 0;
    display: inline-block;
    cursor: pointer
}

.page-mypage .online-interview .button1 a {
    color: #fff;
    font-size: 90%;
    font-weight: 400;
    display: inline-block;
    text-align: center;
    text-decoration: none;
    border-radius: 5px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 7px 7px
}

.page-mypage .online-interview .button-1 {
    background-color: #21bf73;
    white-space: nowrap
}

.page-mypage .online-interview .button-1:hover {
    background-color: #40bad5;
    color: #fff;
    transition: 0.3s
}

.page-mypage .online-interview .button-1[disabled] {
    cursor: not-allowed !important;
    background-color: #9A9B9D
}

.page-mypage .online-interview .no-online-interview {
    margin-top: 5px
}

.page-mypage .online-interview .no-online-interview p {
    margin: 10px 10px 10px 20px
}

.page-mypage .online-interview .txt-bold {
    font-weight: bold
}

.page-mypage .online-interview .txt-sml {
    font-size: 80% !important
}

.page-mypage .online-interview .txt-big {
    font-size: 120% !important
}

.page-mypage .online-interview .txt-left {
    text-align: left !important
}

.page-mypage .online-interview .txt-center {
    text-align: center
}

.page-mypage .online-interview .txt-right {
    text-align: left
}

.page-mypage .online-interview .txt-over {
    color: #999
}

.page-mypage .online-interview .clear {
    clear: both
}

.page-mypage .online-interview #popup {
    text-align: left;
    width: 30%;
    line-height: 140%;
    background: #f2f2f2;
    color: #404142;
    padding: 20px;
    box-sizing: border-box;
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: 10;
    border-radius: 7px;
    font-size: 100%
}

.page-mypage .online-interview .close-win {
    width: 20px;
    height: 20px;
    float: right;
    margin: 0 0 3px 5px
}

.page-mypage .online-interview .notice-txt {
    overflow-wrap: break-word;
    white-space: pre-line
}

.page-mypage .online-interview label {
    display: block
}

.page-mypage .online-interview label span:hover {
    cursor: pointer
}

.page-mypage .online-interview input[type="checkbox"] {
    display: none
}

.page-mypage .online-interview input[type="checkbox"]:checked+#popup {
    display: block;
    transition: .3s
}

.page-mypage .online-interview .user-tab-box {
    width: 100%;
    margin-top: -10px
}

.page-mypage .online-interview .user-tab-box .user-tab-box-wrapper {
    overflow: hidden;
    padding-top: 10px;
    position: relative;
    width: 100%
}

.page-mypage .online-interview .user-tab-box .user-tab-box-wrapper ul {
    list-style: none;
    display: -webkit-flex;
    -webkit-justify-content: flex-start;
    -webkit-align-items: flex-end;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    position: relative
}

.page-mypage .online-interview .user-tab-box .user-tab-box-wrapper ul li.active {
    background: #3a50c9;
    color: #fff;
    height: 4.5em
}

.page-mypage .online-interview .user-tab-box .user-tab-box-wrapper ul li {
    width: 300px;
    margin-right: 5px;
    font-size: 13px;
    background: #f0f0f0;
    height: 4em;
    display: -webkit-flex;
    -webkit-justify-content: center;
    -webkit-align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
    position: relative;
    cursor: pointer
}

.page-mypage .online-interview .user-tab-box .user-tab-box-wrapper .user-tab-nav.prev {
    background: linear-gradient(-90deg, rgba(255, 255, 255, 0), white)
}

.page-mypage .online-interview .user-tab-box .user-tab-box-wrapper .user-tab-nav.prev:after {
    font-family: 'Material Icons';
    content: '\e5cb'
}

.page-mypage .online-interview .user-tab-box .user-tab-box .user-tab-box-wrapper .user-tab-nav:after {
    color: #fff;
    background: #3a50c9;
    width: 20px;
    height: 20px;
    border-radius: 20px;
    display: -webkit-flex;
    -webkit-justify-content: center;
    -webkit-align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
    -o-transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1)
}

.page-mypage .online-interview .user-tab-box .user-tab-box-wrapper .user-tab-nav.next:after {
    font-family: 'Material Icons';
    content: '\e5cc'
}

.page-mypage .online-interview .user-tab-box .user-tab-box-wrapper .user-tab-nav:after {
    color: #fff;
    background: #3a50c9;
    width: 20px;
    height: 20px;
    border-radius: 20px;
    display: -webkit-flex;
    -webkit-justify-content: center;
    -webkit-align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
    -o-transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1)
}

.page-mypage .online-interview .user-tab-box .user-tab-box-wrapper .user-tab-nav.next {
    right: 0;
    background: -webkit-gradient(linear, left top, right top, color-stop(0, rgba(255, 255, 255, 0)), color-stop(50%, white));
    background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0, white 50%);
    background: -o-linear-gradient(left, rgba(255, 255, 255, 0) 0, white 50%);
    background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0, white 50%)
}

.page-mypage .online-interview .user-tab-box .user-tab-box-wrapper .user-tab-nav {
    position: absolute;
    bottom: 0;
    width: 60px;
    height: calc(100% - 10px);
    display: -webkit-flex;
    -webkit-justify-content: center;
    -webkit-align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: none;
    cursor: pointer
}

.page-mypage .online-interview .user-tab-box .user-tab-box-wrapper .user-tab-nav.active {
    display: flex
}

.page-mypage .online-interview .user-tab-box .user-tab-box-wrapper ul li span.badge {
    display: inline-block;
    background-color: #DD0E1B;
    font-size: 1.0rem;
    line-height: 1;
    padding: 4px 6px;
    border-radius: 10px;
    color: #fff;
    position: absolute;
    right: -1em;
    top: -0.5em;
    z-index: 1
}

.page-mypage .online-interview .user-tab-box .event-name div.event-name-tooltip {
    display: none
}

.page-mypage .online-interview .user-tab-box .event-name:hover div {
    display: block;
    position: fixed;
    overflow: hidden;
    width: 200px;
    background-color: black;
    z-index: 1000;
    color: white
}

.page-mypage .online-interview_content .tab-item-right,
.page-mypage .seminar-content .tab-item-right {
    display: inline-block;
    font-size: 80%;
    float: right;
    font-weight: 400;
    margin-left: auto;
    width: auto;
    display: flex;
    align-items: center
}

.page-mypage .online-interview_content {
    border: solid 1px #ccc;
    padding: 15px;
    background: #f5f5f5
}

.page-mypage .online-interview_content .event-content {
    padding: 10px;
    background: #fff;
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
    border-radius: 5px;
    border: solid 1px #ccc;
    margin-bottom: 20px
}

.page-mypage .grey-heading {
    background-color: #a6a6a6;
    padding: 0 10px;
    color: #fff;
    min-height: 37px;
    line-height: 2em
}

.page-mypage .grey-heading::after {
    display: none
}

.page-mypage .reminder .reminder-wrapper {
    display: -webkit-flex;
    -webkit-justify-content: space-between;
    -webkit-align-items: stretch;
    display: flex;
    justify-content: space-between;
    align-items: stretch
}

.page-mypage .reminder .reminder-wrapper .reminder-block {
    width: 49%;
    border: solid 1px #ccc;
    position: relative
}

.page-mypage .reminder .reminder-wrapper .reminder-block h3 {
    text-align: center;
    margin: 0;
    background: #f5f5f5;
    padding: 0.5em 0;
    border-bottom: solid 1px #ccc
}

.page-mypage .reminder .reminder-wrapper .reminder-block.reminder-from-corp h3 {
    background: #edffe3
}

.page-mypage .reminder .reminder-wrapper .reminder-block.reminder-from-cfn h3 {
    background: #e3eeff
}

.page-mypage .reminder .reminder-wrapper .reminder-block div.reminder-inner {
    padding: 10px 10px 0
}

.page-mypage .reminder .reminder-wrapper .reminder-block div.reminder-inner .reminder-list ul {
    list-style: none;
    margin-bottom: 0
}

.page-mypage .reminder .reminder-wrapper .reminder-block div.reminder-inner .reminder-list ul li {
    margin-bottom: 5px
}

.page-mypage .reminder .reminder-wrapper .reminder-block div.reminder-inner .reminder-list ul li dl {
    display: -webkit-flex;
    -webkit-justify-content: flex-start;
    -webkit-align-items: stretch;
    display: flex;
    justify-content: flex-start;
    align-items: stretch;
    margin: 0
}

.page-mypage .reminder .reminder-wrapper .reminder-block div.reminder-inner .reminder-list ul li dl dd p {
    margin-bottom: 0
}

.page-mypage .reminder .reminder-wrapper .reminder-block div.reminder-inner .reminder-list ul li dl dd p a {
    word-break: break-word
}

.page-mypage .reminder .reminder-wrapper .reminder-block div.reminder-inner .reminder-list ul li dl dd p a i {
    font-size: 2.0rem;
    margin-right: 4px;
    vertical-align: middle
}

.page-mypage .reminder .reminder-wrapper .reminder-block .reminder-toggle {
    color: #000;
    display: -webkit-flex;
    -webkit-justify-content: center;
    -webkit-align-items: center;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    position: absolute;
    left: 0;
    bottom: 0;
    height: 55px;
    width: 100%
}

.page-mypage .reminder .reminder-wrapper .reminder-block .reminder-toggle ins {
    text-decoration: none
}

.page-mypage .reminder .reminder-wrapper .reminder-block .reminder-toggle span {
    -webkit-transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1)
}

.page-mypage .reminder .reminder-wrapper .reminder-block .reminder-toggle:hover {
    background: #f5f5f5
}

.page-mypage .reminder .reminder-wrapper .reminder-block .reminder-toggle:hover span {
    transform: translateY(5px)
}

.page-mypage .reminder .reminder-wrapper .reminder-block .reminder-toggle.active span {
    transform: scaleY(-100%)
}

@media screen and (max-width: 768px) {
    .page-mypage .reminder {
        margin-bottom: 5vw
    }

    .page-mypage .reminder .reminder-wrapper {
        display: block
    }

    .page-mypage .reminder .reminder-wrapper .reminder-block {
        margin-bottom: 4vw;
        width: 100%
    }
}

.page-mypage .link-to-guide {
    text-decoration: underline;
    font-size: 18px;
    font-weight: normal;
    margin-right: 12px;
    float: right
}

.page-reminder-notification .reminder {
    margin-bottom: 30px
}

.page-reminder-notification .reminder .reminder-wrapper {
    display: -webkit-flex;
    -webkit-justify-content: space-between;
    -webkit-align-items: stretch;
    display: flex;
    justify-content: space-between;
    align-items: stretch
}

.page-reminder-notification .reminder .reminder-wrapper .reminder-block {
    width: 100%;
    position: relative
}

.page-reminder-notification .reminder .reminder-wrapper .reminder-block h3 {
    text-align: center;
    margin: 0;
    background: #f5f5f5;
    padding: 0.5em 0;
    border-bottom: solid 1px #ccc
}

.page-reminder-notification .reminder .reminder-wrapper .reminder-block div.reminder-inner {
    padding: 10px 10px 0
}

.page-reminder-notification .reminder .reminder-wrapper .reminder-block div.reminder-inner .reminder-list p {
    font-size: 1.5rem;
    margin-bottom: 0
}

@media only screen and (max-width: 599px) {
    .have-left_navigation_mobile:not(.page-resume) .user-contents {
        padding-top: 60px
    }
}

@media only screen and (max-width: 1240px) {

    .page-mypage .user-wrapper,
    .page-history .user-wrapper,
    .page-mail .user-wrapper,
    .page-resume .user-wrapper,
    .page-appointment .user-wrapper,
    .page-online-interview-booking .user-wrapper,
    .page-account-setting .user-wrapper,
    .page-desired-conditional-job-list .user-wrapper,
    .page-reminder-notification .user-wrapper {
        width: 992px
    }
}

@media only screen and (max-width: 1022px) {

    .page-mypage .user-wrapper,
    .page-history .user-wrapper,
    .page-mail .user-wrapper,
    .page-resume .user-wrapper,
    .page-appointment .user-wrapper,
    .page-online-interview-booking .user-wrapper,
    .page-account-setting .user-wrapper,
    .page-desired-conditional-job-list .user-wrapper,
    .page-reminder-notification .user-wrapper {
        width: 100%
    }
}

@media only screen and (max-width: 1022px) {

    .page-mypage .contents,
    .page-history .contents,
    .page-mail .contents,
    .page-resume .contents,
    .page-appointment .contents,
    .page-online-interview-booking .contents,
    .page-account-setting .contents,
    .page-desired-conditional-job-list .contents,
    .page-reminder-notification .contents {
        width: 100%
    }
}

.page-mypage .menu-mypage-sp-button,
.page-history .menu-mypage-sp-button,
.page-mail .menu-mypage-sp-button,
.page-resume .menu-mypage-sp-button,
.page-appointment .menu-mypage-sp-button,
.page-online-interview-booking .menu-mypage-sp-button,
.page-account-setting .menu-mypage-sp-button,
.page-desired-conditional-job-list .menu-mypage-sp-button,
.page-reminder-notification .menu-mypage-sp-button {
    display: none;
    position: fixed;
    top: 60px;
    right: 15px;
    border: 1px solid #3A50C9;
    border-radius: 4px;
    color: #3A50C9;
    background-color: rgba(255, 255, 255, 0.7);
    padding: 4px 38px 4px 8px;
    cursor: pointer;
    z-index: 9999
}

@media only screen and (max-width: 599px) {

    .page-mypage .menu-mypage-sp-button,
    .page-history .menu-mypage-sp-button,
    .page-mail .menu-mypage-sp-button,
    .page-resume .menu-mypage-sp-button,
    .page-appointment .menu-mypage-sp-button,
    .page-online-interview-booking .menu-mypage-sp-button,
    .page-account-setting .menu-mypage-sp-button,
    .page-desired-conditional-job-list .menu-mypage-sp-button,
    .page-reminder-notification .menu-mypage-sp-button {
        display: block
    }
}

.page-mypage .menu-mypage-sp-button::before,
.page-history .menu-mypage-sp-button::before,
.page-mail .menu-mypage-sp-button::before,
.page-resume .menu-mypage-sp-button::before,
.page-appointment .menu-mypage-sp-button::before,
.page-online-interview-booking .menu-mypage-sp-button::before,
.page-account-setting .menu-mypage-sp-button::before,
.page-desired-conditional-job-list .menu-mypage-sp-button::before,
.page-reminder-notification .menu-mypage-sp-button::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    position: absolute;
    top: 2px;
    right: 8px;
    content: "list";
    display: inline-block;
    font-size: 2.4rem
}

.page-mypage .menu-overlay,
.page-history .menu-overlay,
.page-mail .menu-overlay,
.page-resume .menu-overlay,
.page-appointment .menu-overlay,
.page-online-interview-booking .menu-overlay,
.page-account-setting .menu-overlay,
.page-desired-conditional-job-list .menu-overlay,
.page-reminder-notification .menu-overlay {
    transition: all 0.4s;
    visibility: hidden;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: #212121;
    opacity: 0;
    z-index: 200
}

.page-mypage .menu-overlay.is-opened,
.page-history .menu-overlay.is-opened,
.page-mail .menu-overlay.is-opened,
.page-resume .menu-overlay.is-opened,
.page-appointment .menu-overlay.is-opened,
.page-online-interview-booking .menu-overlay.is-opened,
.page-account-setting .menu-overlay.is-opened,
.page-desired-conditional-job-list .menu-overlay.is-opened,
.page-reminder-notification .menu-overlay.is-opened {
    visibility: visible;
    opacity: 0.4
}

.page-mypage .menu-mypage-sp,
.page-history .menu-mypage-sp,
.page-mail .menu-mypage-sp,
.page-resume .menu-mypage-sp,
.page-appointment .menu-mypage-sp,
.page-online-interview-booking .menu-mypage-sp,
.page-account-setting .menu-mypage-sp,
.page-desired-conditional-job-list .menu-mypage-sp,
.page-reminder-notification .menu-mypage-sp {
    transition: all 0.4s;
    visibility: hidden;
    position: fixed;
    z-index: 201;
    top: 100px;
    left: 5%;
    width: 90%;
    opacity: 0
}

.page-mypage .menu-mypage-sp.is-opened,
.page-history .menu-mypage-sp.is-opened,
.page-mail .menu-mypage-sp.is-opened,
.page-resume .menu-mypage-sp.is-opened,
.page-appointment .menu-mypage-sp.is-opened,
.page-online-interview-booking .menu-mypage-sp.is-opened,
.page-account-setting .menu-mypage-sp.is-opened,
.page-desired-conditional-job-list .menu-mypage-sp.is-opened,
.page-reminder-notification .menu-mypage-sp.is-opened {
    visibility: visible;
    opacity: 1
}

.page-mypage .menu-mypage-sp h3,
.page-history .menu-mypage-sp h3,
.page-mail .menu-mypage-sp h3,
.page-resume .menu-mypage-sp h3,
.page-appointment .menu-mypage-sp h3,
.page-online-interview-booking .menu-mypage-sp h3,
.page-account-setting .menu-mypage-sp h3,
.page-desired-conditional-job-list .menu-mypage-sp h3,
.page-reminder-notification .menu-mypage-sp h3 {
    background-color: #3A50C9;
    color: #fff;
    margin: 0;
    font-weight: normal;
    padding: 10px 20px
}

.page-mypage .menu-mypage-sp li,
.page-history .menu-mypage-sp li,
.page-mail .menu-mypage-sp li,
.page-resume .menu-mypage-sp li,
.page-appointment .menu-mypage-sp li,
.page-online-interview-booking .menu-mypage-sp li,
.page-account-setting .menu-mypage-sp li,
.page-desired-conditional-job-list .menu-mypage-sp li,
.page-reminder-notification .menu-mypage-sp li {
    border: 1px solid #d8d8d8;
    border-top: none;
    list-style: none;
    background-color: #fff
}

.page-mypage .menu-mypage-sp li a,
.page-history .menu-mypage-sp li a,
.page-mail .menu-mypage-sp li a,
.page-resume .menu-mypage-sp li a,
.page-appointment .menu-mypage-sp li a,
.page-online-interview-booking .menu-mypage-sp li a,
.page-account-setting .menu-mypage-sp li a,
.page-desired-conditional-job-list .menu-mypage-sp li a,
.page-reminder-notification .menu-mypage-sp li a {
    display: block;
    padding: 10px 10px 10px 20px
}

.page-mypage .menu-mypage-sp .badge,
.page-history .menu-mypage-sp .badge,
.page-mail .menu-mypage-sp .badge,
.page-resume .menu-mypage-sp .badge,
.page-appointment .menu-mypage-sp .badge,
.page-online-interview-booking .menu-mypage-sp .badge,
.page-account-setting .menu-mypage-sp .badge,
.page-desired-conditional-job-list .menu-mypage-sp .badge,
.page-reminder-notification .menu-mypage-sp .badge {
    position: absolute;
    right: 10px
}

.page-mypage .menu-mypage-sp .menu-mypage-sp-close,
.page-history .menu-mypage-sp .menu-mypage-sp-close,
.page-mail .menu-mypage-sp .menu-mypage-sp-close,
.page-resume .menu-mypage-sp .menu-mypage-sp-close,
.page-appointment .menu-mypage-sp .menu-mypage-sp-close,
.page-online-interview-booking .menu-mypage-sp .menu-mypage-sp-close,
.page-account-setting .menu-mypage-sp .menu-mypage-sp-close,
.page-desired-conditional-job-list .menu-mypage-sp .menu-mypage-sp-close,
.page-reminder-notification .menu-mypage-sp .menu-mypage-sp-close {
    display: block;
    padding: 6px;
    margin-top: 5px;
    background-color: #d8d8d8;
    text-align: center;
    color: #2A2B2D
}

@media only screen and (max-width: 1022px) {
    .page-mypage .user-banner img {
        width: 100%;
        height: auto
    }
}

@media only screen and (max-width: 599px) {
    .page-mypage .online-interview .olsem-list-table {
        border: 1px solid #ccc;
        border: none !important;
        margin: 0.5rem 0;
        width: 100%
    }

    .page-mypage .online-interview .olsem-list-table .txt-left {
        text-align: right !important
    }

    .page-mypage .online-interview .olsem-list-table .thead {
        display: none
    }

    .page-mypage .online-interview .olsem-list-table tr {
        width: 100%;
        border: 0px solid #ccc !important
    }

    .page-mypage .online-interview .olsem-list-table td {
        border-bottom: 1px solid #ccc;
        border-top: 0px solid #ccc;
        border-left: 0px solid #ccc;
        border-right: 0px solid #ccc;
        display: block;
        text-align: right;
        width: 100%
    }

    .page-mypage .online-interview .olsem-list-table td:first-child {
        background: #eeeeee;
        font-weight: bold;
        text-align: left !important
    }

    .page-mypage .online-interview .olsem-list-table td:before {
        content: attr(data-label);
        color: #999;
        ¥font-size: 90%;
        float: left;
        font-weight: bold;
        margin-right: 10px
    }

    .page-mypage .online-interview #popup {
        width: 70%;
        padding: 10px;
        line-height: 130%;
        font-size: 80%
    }

    .page-mypage .online-interview .tab-item-right {
        flex-direction: column;
        align-items: flex-end
    }
}

@media only screen and (max-width: 480px) {
    .page-mypage .online-interview .form-control-s .tab-item-right {
        width: 100%
    }

    .page-mypage .online-interview .user-select-box {
        flex-direction: column
    }
}

@media only screen and (min-width: 598px) {
    .page-mypage .online-interview .date-time-col {
        margin-left: auto;
        margin-right: auto;
        display: table;
        text-align: left
    }

    .page-mypage .online-interview .flex-center-items {
        display: flex;
        flex-flow: wrap;
        align-items: center
    }
}

@media only screen and (max-width: 599px) {
    .page-account-setting .user-wrapper {
        padding-top: 0
    }
}

.page-account-setting .register-row .md-switch {
    display: flex
}

@media only screen and (max-width: 1240px) {
    .page-account-setting .register-row .md-switch {
        width: 100%;
        float: none;
        padding-right: 0
    }

    .page-account-setting .register-row .md-switch .md-switch-wrap {
        margin-top: 5px
    }
}

.page-account-setting .register-row .md-switch .note {
    padding-left: 0
}

@media only screen and (max-width: 599px) {
    .page-account-setting .register-row .button-add {
        height: 24px;
        max-width: 143px
    }

    .page-account-setting .register-row .button-delete {
        height: 24px
    }

    .page-account-setting .register-row .md-textfield.is-ok::before,
    .page-account-setting .register-row .md-textfield.is-ng::before,
    .page-account-setting .register-row .md-select.is-ok::before,
    .page-account-setting .register-row .md-select.is-ng::before {
        right: 0
    }
}

@media only screen and (max-width: 991px) {

    .page-account-setting .register-row .md-select.is-ok::before,
    .page-account-setting .register-row .md-select.is-ng::before {
        right: 0
    }
}

@media only screen and (max-width: 991px) {
    .page-account-setting .register-next .button {
        height: 30px;
        font-size: 1.2rem
    }

    .page-account-setting .contents {
        margin-bottom: 20px
    }
}

@media only screen and (max-width: 599px) {
    .page-account-setting .register-inner:first-child {
        padding: 0 10px
    }

    .page-account-setting .register-inner:first-child p {
        line-height: normal;
        margin-bottom: 1em
    }
}

@media only screen and (max-width: 1022px) {

    .page-resume .sidemenu .button-entry,
    .page-account-setting .sidemenu .button-entry {
        max-width: 200px;
        margin: 0 auto
    }
}

.page-resume .sidemenu .joined-event,
.page-account-setting .sidemenu .joined-event {
    margin-bottom: 10px
}

.page-mypage-v2 .notifications-cfn-box,
.page-mypage-v2 .notifications-box {
    border: 1px solid #d8d8d8;
    background-color: #fff;
    border-radius: 5px;
    margin-bottom: 20px
}

.page-mypage-v2 .notifications-cfn-box:last-child,
.page-mypage-v2 .notifications-box:last-child {
    margin-bottom: 0
}

.page-mypage-v2 .notifications-cfn-box .box-title,
.page-mypage-v2 .notifications-box .box-title {
    border-bottom: 1px solid #d8d8d8;
    background-color: #3a50c9;
    margin: 0;
    padding: 10px 8px;
    color: #fff;
    font-size: 1.4rem;
    font-weight: bold;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px
}

.page-mypage-v2 .notifications-cfn-box .box-content,
.page-mypage-v2 .notifications-box .box-content {
    padding: 12px
}

@media only screen and (max-width: 1022px) {

    .page-mypage-v2 .notifications-cfn-box .box-content,
    .page-mypage-v2 .notifications-box .box-content {
        padding: 20px 10px
    }
}

.page-mypage-v2 .notifications-cfn-box .box-item,
.page-mypage-v2 .notifications-box .box-item {
    display: flex;
    margin-bottom: 8px
}

.page-mypage-v2 .notifications-cfn-box .box-item .noti-public-time,
.page-mypage-v2 .notifications-box .box-item .noti-public-time {
    min-width: 160px
}

.page-mypage-v2 .notifications-cfn-box .box-item .item-calendar,
.page-mypage-v2 .notifications-box .box-item .item-calendar {
    font-weight: bold;
    font-size: 1.3rem
}

.page-mypage-v2 .notifications-cfn-box .box-item .item-title,
.page-mypage-v2 .notifications-box .box-item .item-title {
    margin-left: 4px;
    color: #3a50c9;
    font-size: 1.3rem
}

.page-mypage-v2 .notifications-cfn-box .box-item .item-title a,
.page-mypage-v2 .notifications-box .box-item .item-title a {
    cursor: pointer
}

.page-mypage-v2 .notifications-cfn-box .box-item .tags,
.page-mypage-v2 .notifications-box .box-item .tags {
    margin-right: 10px
}

.page-mypage-v2 .notifications-cfn-box .box-item .tags span.tag,
.page-mypage-v2 .notifications-box .box-item .tags span.tag {
    display: inline-block;
    font-size: 12px;
    line-height: 1em;
    padding: 0.3em 0.5em;
    width: 12em;
    text-align: center;
    color: #fff;
    font-weight: bold;
    border-radius: 2em
}

.page-mypage-v2 .notifications-cfn-box .box-item .tags span.tag.tag-favorite_job,
.page-mypage-v2 .notifications-box .box-item .tags span.tag.tag-favorite_job {
    background: #b7b185
}

.page-mypage-v2 .notifications-cfn-box .box-item .tags span.tag.tag-careerforum,
.page-mypage-v2 .notifications-box .box-item .tags span.tag.tag-careerforum {
    background: #4479ca
}

.page-mypage-v2 .notifications-cfn-box .box-item .tags span.tag.tag-online_seminar,
.page-mypage-v2 .notifications-box .box-item .tags span.tag.tag-online_seminar {
    background: #f7b27e
}

.page-mypage-v2 .notifications-cfn-box .box-item .tags span.tag.tag-appointment_mail,
.page-mypage-v2 .notifications-box .box-item .tags span.tag.tag-appointment_mail {
    background: #b7cf89
}

.page-mypage-v2 .notifications-cfn-box .box-item .tags span.tag.tag-web_mail_apply,
.page-mypage-v2 .notifications-box .box-item .tags span.tag.tag-web_mail_apply {
    background: #ce8282
}

.page-mypage-v2 .notifications-cfn-box .box-item .tags span.tag.tag-web_mail_favorite,
.page-mypage-v2 .notifications-box .box-item .tags span.tag.tag-web_mail_favorite {
    background: #83c2d5
}

.page-mypage-v2 .notifications-cfn-box .box-item .tags span.tag.tag-message,
.page-mypage-v2 .notifications-box .box-item .tags span.tag.tag-message {
    background: #f7b27e
}

.page-mypage-v2 .notifications-cfn-box .scroll-bar-noti,
.page-mypage-v2 .notifications-box .scroll-bar-noti {
    overflow-y: auto
}

.page-mypage-v2 .notifications-cfn-box .info-tag,
.page-mypage-v2 .notifications-box .info-tag {
    padding: 12px
}

@media screen and (max-width: 880px) {

    .page-mypage-v2 .notifications-cfn-box .info-tag ul,
    .page-mypage-v2 .notifications-box .info-tag ul {
        overflow-x: auto;
        white-space: nowrap
    }

    .page-mypage-v2 .notifications-cfn-box .info-tag ul li dl,
    .page-mypage-v2 .notifications-box .info-tag ul li dl {
        display: block
    }

    .page-mypage-v2 .notifications-cfn-box .info-tag ul li dl dt,
    .page-mypage-v2 .notifications-cfn-box .info-tag ul li dl dd,
    .page-mypage-v2 .notifications-box .info-tag ul li dl dt,
    .page-mypage-v2 .notifications-box .info-tag ul li dl dd {
        font-size: 3.5vw
    }
}

.page-mypage-v2 .notifications-cfn-box .info-tag ul li,
.page-mypage-v2 .notifications-box .info-tag ul li {
    white-space: no-wrap;
    display: inline-block;
    margin-right: 0.5em;
    line-height: 1em;
    border-radius: 3em;
    padding: 0.2em 0.6em;
    font-size: 12px;
    cursor: pointer
}

.page-mypage-v2 .notifications-cfn-box .info-tag ul li.tag-all,
.page-mypage-v2 .notifications-box .info-tag ul li.tag-all {
    border: solid 1px #000
}

.page-mypage-v2 .notifications-cfn-box .info-tag ul li.tag-favorite_job,
.page-mypage-v2 .notifications-box .info-tag ul li.tag-favorite_job {
    border: solid 1px #b7b185
}

.page-mypage-v2 .notifications-cfn-box .info-tag ul li.tag-careerforum,
.page-mypage-v2 .notifications-box .info-tag ul li.tag-careerforum {
    border: solid 1px #4479ca
}

.page-mypage-v2 .notifications-cfn-box .info-tag ul li.tag-online_seminar,
.page-mypage-v2 .notifications-box .info-tag ul li.tag-online_seminar {
    border: solid 1px #f7b27e
}

.page-mypage-v2 .notifications-cfn-box .info-tag ul li.tag-appointment_mail,
.page-mypage-v2 .notifications-box .info-tag ul li.tag-appointment_mail {
    border: solid 1px #b7cf89
}

.page-mypage-v2 .notifications-cfn-box .info-tag ul li.tag-web_mail_apply,
.page-mypage-v2 .notifications-box .info-tag ul li.tag-web_mail_apply {
    border: solid 1px #ce8282
}

.page-mypage-v2 .notifications-cfn-box .info-tag ul li.tag-web_mail_favorite,
.page-mypage-v2 .notifications-box .info-tag ul li.tag-web_mail_favorite {
    border: solid 1px #83c2d5
}

.page-mypage-v2 .notifications-cfn-box .info-tag ul li.tag-message,
.page-mypage-v2 .notifications-box .info-tag ul li.tag-message {
    border: solid 1px #f7b27e
}

.page-mypage-v2 .notifications-cfn-box .info-tag ul li:hover,
.page-mypage-v2 .notifications-cfn-box .info-tag ul li.active,
.page-mypage-v2 .notifications-box .info-tag ul li:hover,
.page-mypage-v2 .notifications-box .info-tag ul li.active {
    color: #fff
}

.page-mypage-v2 .notifications-cfn-box .info-tag ul li.tag-all:hover,
.page-mypage-v2 .notifications-cfn-box .info-tag ul li.active.tag-all,
.page-mypage-v2 .notifications-box .info-tag ul li.tag-all:hover,
.page-mypage-v2 .notifications-box .info-tag ul li.active.tag-all {
    background-color: #000
}

.page-mypage-v2 .notifications-cfn-box .info-tag ul li.tag-favorite_job:hover,
.page-mypage-v2 .notifications-cfn-box .info-tag ul li.active.tag-favorite_job,
.page-mypage-v2 .notifications-box .info-tag ul li.tag-favorite_job:hover,
.page-mypage-v2 .notifications-box .info-tag ul li.active.tag-favorite_job {
    background-color: #b7b185
}

.page-mypage-v2 .notifications-cfn-box .info-tag ul li.tag-careerforum:hover,
.page-mypage-v2 .notifications-cfn-box .info-tag ul li.active.tag-careerforum,
.page-mypage-v2 .notifications-box .info-tag ul li.tag-careerforum:hover,
.page-mypage-v2 .notifications-box .info-tag ul li.active.tag-careerforum {
    background-color: #4479ca
}

.page-mypage-v2 .notifications-cfn-box .info-tag ul li.tag-online_seminar:hover,
.page-mypage-v2 .notifications-cfn-box .info-tag ul li.active.tag-online_seminar,
.page-mypage-v2 .notifications-box .info-tag ul li.tag-online_seminar:hover,
.page-mypage-v2 .notifications-box .info-tag ul li.active.tag-online_seminar {
    background-color: #f7b27e
}

.page-mypage-v2 .notifications-cfn-box .info-tag ul li.tag-appointment_mail:hover,
.page-mypage-v2 .notifications-cfn-box .info-tag ul li.active.tag-appointment_mail,
.page-mypage-v2 .notifications-box .info-tag ul li.tag-appointment_mail:hover,
.page-mypage-v2 .notifications-box .info-tag ul li.active.tag-appointment_mail {
    background-color: #b7cf89
}

.page-mypage-v2 .notifications-cfn-box .info-tag ul li.tag-web_mail_apply:hover,
.page-mypage-v2 .notifications-cfn-box .info-tag ul li.active.tag-web_mail_apply,
.page-mypage-v2 .notifications-box .info-tag ul li.tag-web_mail_apply:hover,
.page-mypage-v2 .notifications-box .info-tag ul li.active.tag-web_mail_apply {
    background-color: #ce8282
}

.page-mypage-v2 .notifications-cfn-box .info-tag ul li.tag-web_mail_favorite:hover,
.page-mypage-v2 .notifications-cfn-box .info-tag ul li.active.tag-web_mail_favorite,
.page-mypage-v2 .notifications-box .info-tag ul li.tag-web_mail_favorite:hover,
.page-mypage-v2 .notifications-box .info-tag ul li.active.tag-web_mail_favorite {
    background-color: #83c2d5
}

.page-mypage-v2 .notifications-cfn-box .info-tag ul li.tag-message:hover,
.page-mypage-v2 .notifications-cfn-box .info-tag ul li.active.tag-message,
.page-mypage-v2 .notifications-box .info-tag ul li.tag-message:hover,
.page-mypage-v2 .notifications-box .info-tag ul li.active.tag-message {
    background-color: #f7b27e
}

.page-mypage-v2 .notifications-cfn-box .show-more-toggle,
.page-mypage-v2 .notifications-box .show-more-toggle {
    text-align: center;
    font-weight: bold
}

.page-mypage-v2 .notifications-cfn-box .show-more-toggle a,
.page-mypage-v2 .notifications-box .show-more-toggle a {
    cursor: pointer
}

.page-mypage-v2 .notifications-cfn-box .show-more-toggle .material-icons,
.page-mypage-v2 .notifications-box .show-more-toggle .material-icons {
    color: #3A50C9 !important;
    font-size: 2rem !important;
    display: inline-block;
    vertical-align: bottom
}

.page-mypage-v2 .container {
    display: flex;
    flex-wrap: wrap
}

.page-mypage-v2 .notifications-cfn-box .box-item .item-title {
    word-wrap: break-word;
    word-break: break-all
}

@media screen and (max-width: 880px) {
    .page-mypage-v2 .notifications-cfn-box .box-item {
        display: flex;
        flex-direction: column
    }

    .page-mypage-v2 .notifications-cfn-box .box-item .item-title {
        margin-left: 0px;
        word-wrap: break-word;
        word-break: break-all
    }
}

@media screen and (max-width: 880px) {
    .page-mypage-v2 .notifications-box .box-content {
        padding: 0px
    }

    .page-mypage-v2 .notifications-box .box-content .box-item:nth-child(odd) {
        background: #f5f5f5
    }
}

@media screen and (max-width: 880px) {
    .page-mypage-v2 .notifications-box .box-item {
        display: flex;
        flex-direction: column;
        padding: 10px
    }

    .page-mypage-v2 .notifications-box .box-item .item-title {
        margin-left: 0px;
        padding: 2px 0px
    }
}

.page-mypage-v2 #reminder-detail-modal .modal-content,
.page-mypage-v2 #reminder-detail-modal .modal-dialog,
.page-mypage-v2 .notification-cfn-modal .modal-content,
.page-mypage-v2 .notification-cfn-modal .modal-dialog {
    min-width: 60%
}

.page-mypage-v2 .reminder-detail {
    padding: 20px;
    border: 1px solid #d8d8d8;
    word-wrap: break-word;
    word-break: break-all
}

.page-mypage-v2 .reminder-detail .reminder-detail-note {
    margin-bottom: 10px;
    white-space: pre-wrap;
    word-wrap: break-word;
    clear: both
}

.page-mypage-v2 .padding-lr-2rem {
    padding: 0 4.45rem
}

.page-mypage-v2 .modal-notification-content {
    padding: 20px;
    border: 1px solid #d8d8d8
}

.page-mypage-v2 .modal-notification-footer {
    padding-right: 30px !important
}

.pw-contents {
    width: 580px;
    margin: 40px auto;
    box-sizing: border-box;
    background-color: #fff;
    border: 1px solid #d8d8d8
}

.pw-contents h2 {
    margin: 0 0 30px 0;
    padding: 13px 10px;
    font-size: 1.6rem;
    background-color: #89ABE3;
    color: #fff;
    text-align: center
}

@media only screen and (max-width: 1022px) {
    .pw-contents h2 {
        margin: 0 0 10px
    }
}

.pw-contents .pw-not-border #pw-remind-form .is-focused.md-textfield::after,
.pw-contents .pw-not-border #pw-remind-form .is-input.md-textfield::after {
    display: none
}

.pw-contents .pw-not-border #pw-remind-form .pw-label {
    font-weight: 500;
    font-size: 1.3rem;
    color: #e67e22
}

.pw-contents .pw-not-border #pw-remind-form .pw-input-border {
    border: 1px solid #e67e22;
    height: 30px;
    border-radius: 5px
}

.pw-contents .pw-not-border #pw-remind-form .md-textfield-label {
    top: 5px
}

.pw-contents .pw-inner {
    padding: 20px 40px 40px 40px
}

@media only screen and (max-width: 1022px) {
    .pw-contents .pw-inner {
        padding: 20px 20px 30px
    }
}

@media only screen and (max-width: 767px) {
    .pw-contents .pw-inner .md-checkbox {
        margin: 10px 0 0
    }
}

@media only screen and (max-width: 767px) {
    .pw-contents .pw-inner .alert {
        padding: 10px;
        font-size: 1rem
    }

    .pw-contents .pw-inner .alert .close {
        font-size: inherit;
        margin-top: 4px
    }
}

.pw-contents .pw-button-wrapper {
    margin-top: 30px;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center
}

.pw-contents .pw-button-wrapper .button {
    margin: 0 10px
}

@media only screen and (max-width: 480px) {
    .pw-contents .pw-button-wrapper .button {
        margin: 0 auto
    }
}

.pw-contents .pw-button-wrapper .button.button-facebook {
    justify-content: center
}

@media only screen and (max-width: 480px) {
    .pw-contents .pw-button-wrapper .button.button-facebook {
        margin-top: 10px
    }
}

@media only screen and (max-width: 480px) {
    .pw-contents .pw-button-wrapper {
        display: block
    }
}

.pw-contents p {
    font-size: 1.4rem
}

@media only screen and (max-width: 599px) {
    .pw-contents p {
        margin: 0 0 20px
    }
}

.pw-contents .md-checkbox {
    display: inline-block
}

.pw-contents .forgot-password {
    display: inline-block;
    margin-left: 20px
}

@media only screen and (max-width: 1022px) {
    .pw-contents {
        width: 100%
    }
}

@media only screen and (max-width: 599px) {
    .pw-contents .pw-button-wrapper {
        margin-top: 10px
    }
}

@media only screen and (max-width: 1022px) {
    .pw-contents .md-checkbox {
        display: block
    }
}

@media only screen and (max-width: 1022px) {
    .pw-contents .forgot-password {
        margin-left: 0;
        display: block
    }
}

.environment-recommended {
    border: 1px solid #d8d8d8;
    background: #f6f9fa;
    font-size: 1.1rem;
    color: #595959;
    padding: 13px 15px;
    width: 580px;
    margin: 40px auto;
    font-weight: normal
}

@media only screen and (max-width: 1022px) {
    .environment-recommended {
        width: 100%
    }
}

.environment-recommended .uppercase {
    text-transform: uppercase
}

.environment-recommended h5 {
    color: #3a50c9;
    margin-bottom: 15px;
    font-weight: normal
}

.environment-recommended .description {
    margin: 0 0 10px
}

.environment-recommended .dowload-latest-version {
    list-style: none;
    margin: 0 0 10px;
    padding: 0
}

.environment-recommended .dowload-latest-version li {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    margin: 0 0 12px
}

.environment-recommended .dowload-latest-version img {
    width: 14px;
    height: 14px;
    margin: 0 4px 0 0
}

.environment-recommended .dowload-latest-version span {
    min-width: 130px;
    padding: 0 5px;
    display: inherit;
    align-items: center
}

.environment-recommended .dowload-latest-version a {
    color: #595959;
    display: inherit;
    align-items: center;
    position: relative
}

.environment-recommended .dowload-latest-version a:hover {
    color: #3a50c9
}

.environment-recommended .dowload-latest-version a:after {
    content: "";
    display: block;
    height: 1px;
    position: absolute;
    right: 0;
    left: 22px;
    bottom: 1px;
    background: #a2a2a2
}

.environment-recommended .dowload-latest-version i {
    color: #595959;
    font-size: 1.8rem;
    margin: 0 5px 0 0;
    position: relative;
    top: 3px
}

.environment-recommended .notice {
    margin: 0 0 10px;
    color: #a2a2a2;
    font-size: 1rem
}

.environment-recommended-pass {
    padding: 0
}

.environment-recommended-pass h5 {
    color: #fff;
    background-color: #3a50c9;
    margin: 0;
    padding: 14px 0
}

.environment-recommended-pass .environment-content {
    padding: 20px 40px 10px 40px;
    display: block;
    float: left;
    width: 100%
}

.environment-recommended-pass .environment-content>div {
    float: left;
    width: 50%
}

.environment-recommended-pass .environment-content>div .dowload-latest-version li {
    justify-content: flex-start
}

.environment-recommended-pass .environment-content>div .dowload-latest-version li a:after {
    display: none
}

.top-wrapper .text-danger {
    color: #DD0E1B
}

#resend_otp.disabled_resend {
    opacity: 0.7;
    pointer-events: none;
    cursor: default;
    color: #9A9B9D
}

.resume-data h3 {
    margin-top: 60px
}

.resume-data dl {
    margin-top: 40px;
    border: 1px solid #d8d8d8;
    border-top: none;
    background-color: #F5F9FA;
    display: flex;
    display: -webkit-flex;
    -webkit-justify-content: flex-content;
    justify-content: flex-content;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-align-content: center;
    align-content: center;
    *zoom: 1
}

.resume-data dl:before,
.resume-data dl:after {
    content: " ";
    display: table
}

.resume-data dl:after {
    clear: both
}

.resume-data dl dt {
    font-weight: bold;
    padding: 10px;
    box-sizing: border-box;
    width: 20%;
    border-top: 1px solid #d8d8d8;
    border-right: none
}

.resume-data dl dd {
    border-top: 1px solid #d8d8d8;
    border-left: 1px solid #d8d8d8;
    box-sizing: border-box;
    width: 80%;
    margin: 0;
    padding: 10px;
    background-color: #fff
}

.resume-data dl dd span {
    display: inline-block;
    min-width: 70px;
    padding: 2px 6px;
    text-align: center
}

.top-wrapper {
    *zoom: 1;
    width: 1210px;
    margin: 0 auto;
    padding: 0 15px 60px;
    position: relative
}

.top-wrapper:before,
.top-wrapper:after {
    content: " ";
    display: table
}

.top-wrapper:after {
    clear: both
}

@media only screen and (max-width: 1240px) {
    .top-wrapper {
        width: 992px
    }
}

.top-wrapper .sidemenu {
    float: right;
    top: 15px;
    right: calc(50% - 590px);
    overflow: auto
}

@media only screen and (max-width: 1240px) {
    .top-wrapper .sidemenu {
        right: calc(50% - 481px)
    }
}

.top-wrapper .company-tab {
    border-bottom: 0;
    float: left;
    width: 100%;
    clear: both
}

@media only screen and (min-width: 481px) {
    .top-wrapper .company-tab li {
        margin-right: 10px
    }
}

.top-wrapper .company-tab li a {
    color: #000;
    background-color: #deebf7;
    border-radius: 0
}

@media only screen and (max-width: 767px) {
    .top-wrapper .company-tab li a {
        padding-left: 10px;
        padding-right: 10px
    }
}

.top-wrapper .company-tab li a.is-selected,
.top-wrapper .company-tab li a:hover,
.top-wrapper .company-tab li a:focus,
.top-wrapper .company-tab li a:active {
    color: #fff;
    background-color: #3366ff
}

.top-wrapper .company-tab li a.is-selected:after,
.top-wrapper .company-tab li a:hover:after,
.top-wrapper .company-tab li a:focus:after,
.top-wrapper .company-tab li a:active:after {
    display: none
}

.top-wrapper .company-tab li a:after {
    display: none
}

.top-wrapper .company-apply {
    margin-top: 20px;
    float: left;
    width: 100%;
    clear: both
}

.top-wrapper .company-apply .company-apply-left {
    float: left
}

@media only screen and (max-width: 767px) {
    .top-wrapper .company-apply .company-apply-left {
        width: 100%
    }
}

@media only screen and (min-width: 768px) {
    .top-wrapper .company-apply .company-apply-left {
        width: 170px
    }
}

.top-wrapper .company-apply .company-apply-left p {
    float: left;
    border: 3px solid #3a50c9;
    color: #000;
    font-weight: bold;
    border-radius: 5px;
    padding: 5px 15px
}

@media only screen and (min-width: 768px) {
    .top-wrapper .company-apply .company-apply-left p {
        margin: 5px 0px 10px
    }
}

@media only screen and (max-width: 767px) {
    .top-wrapper .company-apply .company-apply-left p {
        margin: 0px 0px 10px
    }
}

.top-wrapper .company-apply .company-apply-right {
    float: right
}

@media only screen and (max-width: 767px) {
    .top-wrapper .company-apply .company-apply-right {
        width: 100%
    }
}

@media only screen and (min-width: 768px) {
    .top-wrapper .company-apply .company-apply-right {
        width: calc(100% - 170px)
    }
}

.top-wrapper .company-apply .company-apply-right ul {
    width: 100%;
    float: left;
    clear: both
}

.top-wrapper .company-apply .company-apply-right ul li {
    list-style: none;
    position: relative;
    width: 100%;
    float: left;
    padding: 2px
}

.top-wrapper .company-apply .company-apply-right ul li .cf-icon {
    min-width: 115px;
    float: left
}

.top-wrapper .company-apply .company-apply-right ul li a {
    display: block
}

.top-wrapper .company-apply .company-apply-right ul li span.apply-content {
    float: left;
    width: calc(100% - 126px);
    margin-left: 10px
}

.top-wrapper .company-apply .company-apply-right ul li span.apply-content span {
    color: #3a50c9;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    float: left;
    width: 100%
}

.top-wrapper .company-apply .company-apply-right .show-more-apply {
    color: #3a50c9;
    float: right;
    cursor: pointer;
    display: none
}

.top-wrapper .company-apply .company-apply-right .show-more-apply__icon {
    font-size: 0.9em
}

.top-wrapper .company-apply .company-apply-right .hide-apply {
    color: #3a50c9;
    float: right;
    cursor: pointer;
    display: none
}

.top-wrapper .company-apply.company-detail-info-box .company-apply-right ul li .cf-icon {
    min-width: 90px
}

.top-wrapper .company-apply.company-detail-info-box .company-apply-right ul li span.apply-content {
    width: calc(100% - 125px)
}

.contents {
    width: calc(100% - 280px);
    padding: 0 20px 0 0;
    float: left
}

.contents ul {
    list-style: none
}

.contents.contents-thanks {
    float: none;
    width: 100%
}

.contents .mypage-v2-anchor ul {
    display: -webkit-flex;
    -webkit-justify-content: space-between;
    -webkit-align-items: stretch;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    margin-bottom: 20px;
    background: #fff;
    overflow: hidden
}

.contents .mypage-v2-anchor ul li {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: auto;
    border-right: solid 1px #ccc
}

.contents .mypage-v2-anchor ul li:last-child {
    border-right: 0
}

.contents .mypage-v2-anchor ul li a {
    height: 2em;
    display: -webkit-flex;
    -webkit-justify-content: center;
    -webkit-align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 13px;
    text-align: center;
    color: #000;
    position: relative;
    -webkit-transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
    -o-transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1)
}

.contents .mypage-v2-anchor ul li a:hover {
    background: #3a50c9;
    color: #fff
}

.contents .mypage-v2-anchor ul li a:after {
    font-family: 'Material Icons';
    content: '\e5cf';
    font-size: 200%;
    width: 1em;
    height: 1em;
    position: absolute;
    right: 0.3em;
    top: calc(50% - 0.7em);
    color: #3a50c9
}

.contents .mypage-v2-anchor ul li a br {
    display: none
}

@media screen and (max-width: 768px) {
    .contents .mypage-v2-anchor ul li a {
        height: 3em;
        font-size: 2.8vw
    }

    .contents .mypage-v2-anchor ul li a:after {
        display: none
    }

    .contents .mypage-v2-anchor ul li a br {
        display: block
    }
}

.contents .slick-slider {
    position: relative;
    display: block;
    box-sizing: border-box;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent
}

.contents .slick-list {
    position: relative;
    display: block;
    overflow: hidden;
    margin: 0;
    padding: 0
}

.contents .slick-list:focus {
    outline: none
}

.contents .slick-list.dragging {
    cursor: pointer;
    cursor: hand
}

.contents .slick-slider .slick-track,
.contents .slick-slider .slick-list {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

.contents .slick-track {
    position: relative;
    top: 0;
    left: 0;
    display: block;
    margin-left: auto;
    margin-right: auto
}

.contents .slick-track:before,
.contents .slick-track:after {
    display: table;
    content: ''
}

.contents .slick-track:after {
    clear: both
}

.contents .slick-loading .slick-track {
    visibility: hidden
}

.contents .slick-slide {
    display: none;
    float: left;
    height: 100%;
    min-height: 1px
}

.contents [dir='rtl'] .slick-slide {
    float: right
}

.contents .slick-slide img {
    display: block
}

.contents .slick-slide.slick-loading img {
    display: none
}

.contents .slick-slide.dragging img {
    pointer-events: none
}

.contents .slick-initialized .slick-slide {
    display: block
}

.contents .slick-loading .slick-slide {
    visibility: hidden
}

.contents .slick-vertical .slick-slide {
    display: block;
    height: auto;
    border: 1px solid transparent
}

.contents .slick-arrow.slick-hidden {
    display: none
}

.contents .slider {
    max-width: 880px;
    margin: auto;
    display: -webkit-flex;
    -webkit-justify-content: space-between;
    -webkit-align-items: stretch;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch
}

.contents .slider article {
    background: #fff;
    padding: 10px;
    border: solid 1px #ccc;
    border-radius: 5px;
    margin: 0 7px
}

.contents .slider article a {
    display: block;
    width: 100%;
    height: 100%
}

.contents .slider article figure {
    margin-bottom: 10px;
    height: 160px;
    position: relative
}

.contents .slider article figure img {
    width: 100%
}

.contents .slider article figure ins {
    position: absolute;
    left: 3%;
    top: 10%;
    width: 94%;
    text-decoration: none
}

.contents .slider article figure ins span {
    display: inline-block;
    vertical-align: top;
    font-weight: bold;
    color: #fff;
    line-height: 1em;
    padding: 0.1em 0.3em;
    font-size: 20px
}

.contents .slider article div {
    font-size: 13px;
    color: #000
}

.contents .slider article div dl {
    margin: 5px
}

.contents .slider article div dl dt {
    text-decoration: none;
    text-align: center;
    background: #001273;
    color: #fff;
    margin: 0;
    margin-bottom: 0.2em;
    border-radius: 1em;
    width: 5em
}

.contents .slider article figure ins.bos span {
    background-color: #23365a
}

.contents .slider article figure ins.ldn span {
    background-color: #b6030d
}

.contents .slider article figure ins.los span {
    background-color: #fffd0b;
    color: #000
}

.contents .slider article div .msg .icons span {
    display: inline-block;
    background: #f2b000;
    line-height: 1em;
    font-weight: bold;
    padding: 0.1em 0.5em;
    border-radius: 0.2em
}

.contents .slider article div .msg p {
    margin-bottom: 0
}

.contents .slider button {
    font-size: 30px;
    width: 1em;
    height: 1em;
    border-radius: 50%;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    overflow: hidden
}

.contents .slider button.slick-prev {
    left: -18px;
    text-align: center
}

.contents .slider button.slick-prev:before {
    font-family: 'Material Icons';
    content: '\e5cb';
    color: #001273;
    font-weight: bold;
    font-size: inherit
}

.contents .slider button.slick-next {
    right: -18px;
    text-align: center
}

.contents .slider button.slick-next:before {
    font-family: 'Material Icons';
    content: '\e5cc';
    color: #001273;
    font-size: inherit;
    font-weight: bold
}

@media screen and (max-width: 768px) {
    .contents .slider article figure ins span {
        font-size: 7vw
    }
}

.contents .slider-area {
    width: 880px;
    margin: auto
}

.contents .slider-area .slider>div {
    width: 100%
}

.contents .slider-area article {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin: 0;
    padding: 0 7px;
    border: 0
}

.contents .slider-area article a {
    padding: 5px;
    width: calc(100%);
    display: block;
    border: solid 1px #ccc;
    border-radius: 5px
}

.contents .slider-area article .tags {
    display: -webkit-flex;
    -webkit-justify-content: space-between;
    -webkit-align-items: stretch;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    font-size: 12px;
    height: 1.6em;
    overflow: hidden;
    margin-bottom: 0.4em
}

.contents .slider-area article .tags span {
    display: inline-block;
    font-size: inherit;
    color: #fff;
    background: #000;
    line-height: 1em;
    padding: 0 0.5em;
    margin-right: 0.2em;
    line-height: 1em;
    overflow: hidden;
    height: 1.6em;
    display: -webkit-flex;
    -webkit-justify-content: center;
    -webkit-align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    white-space: nowrap
}

.contents .slider-area article .tags span.event.ldn {
    background: #c61d09
}

.contents .slider-area article .tags span.event.ldn:after {
    content: "London"
}

.contents .slider-area article .tags span.event.los {
    background: #e6ab2c
}

.contents .slider-area article .tags span.event.los:after {
    content: "Los Angeles"
}

.contents .slider-area article .tags span.event.tks {
    background: #50a135
}

.contents .slider-area article .tags span.event.tks:after {
    content: "Tokyo Summer"
}

.contents .slider-area article .tags span.event.cfnonline {
    background: #3a50c9
}

.contents .slider-area article .tags span.event.cfnonline:after {
    content: "CFN(オンライン)"
}

.contents .slider-area article .tags span.com {
    color: #000;
    background: #fff;
    padding: 0
}

.contents .slider-area article .tags span.com.new:after {
    content: "新着"
}

.contents .slider-area article .tags span.com.deadline:after {
    content: "締切間近"
}

.contents .slider-area article h5 {
    margin: 5px 0;
    font-size: 12px;
    line-height: 1.4em;
    height: 2.8em;
    overflow: hidden;
    display: block;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    color: #000
}

.contents .slider-area article .category {
    display: block;
    font-size: 12px;
    white-space: nowrap;
    overflow: hidden;
    padding-bottom: 0.2em;
    padding-top: 0.2em;
    color: #000
}

.contents .slider-area article figure {
    margin: 15px auto;
    width: 80%;
    height: 100px;
    background-position: center center;
    background-size: contain;
    background-repeat: no-repeat
}

.contents .slider-area article .slide-wrap {
    margin-bottom: 10px
}

.contents .slider-area article .slide-wrap .subject {
    height: 3.2em;
    font-size: 14px;
    background: #f5f5f5;
    padding: 0.2em 0.5em;
    border-left: solid 3px #3a50c9;
    margin-bottom: 0.4em;
    overflow: hidden;
    display: block;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    line-height: 1.4em;
    font-weight: bold;
    text-decoration: none
}

.contents .slider-area article .slide-wrap .type {
    color: #fff;
    font-size: 12px;
    height: 1.6em
}

.contents .slider-area article .slide-wrap .type:after {
    line-height: 1em;
    padding: 0.1em 0.5em;
    background: #ff80c0;
    font-size: inherit
}

.contents .slider-area article .slide-wrap .type.internship:after {
    content: "Internship"
}

.contents .slider-area article .bottom {
    display: -webkit-flex;
    -webkit-justify-content: space-between;
    -webkit-align-items: stretch;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch
}

.contents .slider-area article .bottom .deadline {
    text-align: center
}

.contents .slider-area article .bottom .deadline span {
    border-radius: 2em;
    font-size: 12px
}

.contents .slider-area article .bottom .deadline span:before {
    content: "応募締切："
}

.contents .slider-area article .bottom .fav {
    text-align: right
}

.contents .slider-area article .bottom .fav span {
    font-size: 14px
}

.contents .slider-area article .bottom .fav span:before {
    font-family: 'Material Icons';
    content: '\e87d'
}

@media screen and (max-width: 768px) {
    .contents .slider-area {
        width: 96%
    }

    .contents .slider-area article {
        height: 100vw
    }

    .contents .slider-area article figure {
        height: 28vw
    }

    .contents .slider-area article div .tags span {
        font-size: 3vw
    }

    .contents .slider-area article div h5 {
        padding: 0.5vw 0;
        font-size: 3.5vw
    }

    .contents .slider-area article div .category {
        font-size: 3.2vw;
        line-height: 1em
    }

    .contents .slider-area article div ins {
        font-size: 3.5vw
    }

    .contents .slider-area article div p {
        font-size: 3vw
    }
}

.contents .slider-area .slider-list>div {
    display: -webkit-flex;
    -webkit-justify-content: space-between;
    -webkit-align-items: stretch;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.contents .slider-area .slider-list>div article {
    width: calc(25%);
    margin-bottom: 10px;
    -webkit-box-flex: initial;
    -ms-flex: initial;
    flex: initial
}

@media screen and (max-width: 768px) {
    .contents .slider-area .slider-list>div article {
        width: 50%
    }
}

.contents section .mypage-v2-h3 {
    background: -webkit-linear-gradient(315deg, #6999DD, #1E9BC1);
    background: -o-linear-gradient(315deg, #6999DD, #1E9BC1);
    background: linear-gradient(135deg, #6999DD, #1E9BC1);
    border-radius: 5px;
    color: #fff;
    padding: 0.5em 1em;
    font-size: 22px;
    font-weight: bold;
    display: -webkit-flex;
    -webkit-justify-content: space-between;
    -webkit-align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.contents section .mypage-v2-h3 a {
    color: #fff;
    font-size: 16px;
    display: inline-block;
    padding-right: 1.5em;
    background: url(/assets/cf-link-arrow-da9149a5597b895d3de78a8c79df08cf4392d17c785da6d67878153325e2da37.svg) right center/1em no-repeat;
    line-height: 1em
}

@media screen and (max-width: 768px) {
    .contents section .mypage-v2-h3 {
        font-size: 4vw;
        display: block;
        display: -webkit-flex;
        -webkit-justify-content: flex-end;
        -webkit-align-items: flex-end;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end;
        -webkit-box-align: end;
        -ms-flex-align: end;
        align-items: flex-end;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap
    }
}

@media screen and (max-width: 768px) {
    .contents section .mypage-v2-h3>span {
        display: block;
        text-align: left;
        width: 100%;
        margin-bottom: 1vw
    }
}

.contents .backtotop {
    font-size: 16px;
    margin-bottom: 1em
}

@media screen and (max-width: 768px) {
    .contents .backtotop {
        font-size: 3.5vw
    }
}

.contents .backtotop a {
    font-size: inherit
}

.contents .backtotop a:before {
    font-size: inherit;
    content: "\e5cb";
    font-family: 'Material Icons';
    width: 1.5em;
    height: 1.5em;
    display: -webkit-flex;
    -webkit-justify-content: center;
    -webkit-align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    background: #3a50c9;
    color: #fff;
    vertical-align: middle;
    border-radius: 2em;
    margin-bottom: 0.2em;
    margin-right: 0.4em
}

.contents .job-filter .cf-company-filter-list {
    margin-bottom: 20px
}

.contents .job-filter .cf-company-filter-list .search-box {
    margin-bottom: 0
}

#cfn-mypage-renewal {
    padding-bottom: 1em
}

#cfn-mypage-renewal .slick-dotted.slick-slider {
    margin-bottom: 30px
}

#cfn-mypage-renewal .slick-slider {
    position: relative;
    display: block;
    box-sizing: border-box;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent
}

#cfn-mypage-renewal .slider-area {
    width: 880px;
    margin: auto
}

#cfn-mypage-renewal .slider-area .slider>div {
    width: 100%
}

#cfn-mypage-renewal section .h3 {
    background: -webkit-linear-gradient(315deg, #6999DD, #1E9BC1);
    background: -o-linear-gradient(315deg, #6999DD, #1E9BC1);
    background: linear-gradient(135deg, #6999DD, #1E9BC1);
    border-radius: 5px;
    color: #fff;
    padding: 0.5em 1em;
    font-size: 22px;
    font-weight: bold;
    display: -webkit-flex;
    -webkit-justify-content: space-between;
    -webkit-align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 0
}

#cfn-mypage-renewal .slider,
#cfn-mypage-renewal #top-slider-wrapper {
    max-width: 880px;
    margin: auto;
    display: -webkit-flex;
    -webkit-justify-content: space-between;
    -webkit-align-items: stretch;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch
}

.cf-detail img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto
}

.company-mainvisual {
    line-height: 0;
    margin-bottom: 25px;
    width: 880px;
    max-width: 100%;
    height: 326px;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center
}

@media only screen and (max-width: 768px) {
    .company-mainvisual.internship-job-detail-cover-photo {
        height: auto;
        margin-bottom: 0px
    }
}

.company-mainvisual.internship-image {
    height: auto
}

.company-mainvisual img {
    line-height: 0;
    max-width: 100%;
    max-height: 100%;
    height: auto
}

.company-mainvisual .company-cover-photo {
    max-width: 100%;
    max-height: 100%
}

.cfn-contents-top {
    width: 100%;
    float: none
}

.company-info {
    display: flex;
    display: -webkit-flex;
    -webkit-align-items: center;
    align-items: center;
    border: 1px solid #d8d8d8;
    padding: 25px 20px
}

@media only screen and (max-width: 599px) {
    .company-info {
        padding: 15px 10px
    }
}

.company-info .company-info-logo {
    width: 85px
}

.company-info .company-info-logo img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto
}

.company-info .company-info-title {
    margin-left: 20px;
    margin-right: auto;
    width: calc(100% - 110px)
}

@media only screen and (max-width: 599px) {
    .company-info .company-info-title {
        width: calc(100% - 90px);
        margin-left: 15px
    }
}

@media only screen and (max-width: 599px) {
    .company-info .company-info-title.disable-like-button {
        margin-left: 5px
    }
}

.company-info .company-info-title h2 {
    margin: 0;
    word-break: break-word
}

.company-info .company-info-title p {
    word-break: break-word;
    margin: 0;
    color: #000;
    font-size: 1.4rem
}

.company-info .company-info-button .button {
    width: 140px;
    height: 30px
}

.company-info .company-info-button .button span::before {
    content: "favorite_border";
    top: 2px
}

@media only screen and (max-width: 599px) {
    .company-info.company-info-header-box .company-info-logo {
        width: 70px
    }

    .company-info.company-info-header-box .company-info-title {
        margin-left: 3px
    }

    .company-info.company-info-header-box .company-info-title p {
        font-size: 1.2rem
    }
}

.company-info.company-detail-info-box .company-info-logo {
    width: 70px
}

.company-info.company-detail-info-box .company-info-title {
    margin-left: 3px
}

.company-info.company-detail-info-box .company-info-title p {
    font-size: 1.2rem
}

.company-contents .heading-style-02 {
    padding-bottom: 0;
    margin-bottom: 10px;
    color: #3a50c9
}

.company-contents h2 {
    word-break: break-word;
    margin: 30px 0 20px 0;
    float: left;
    width: 100%
}

@media only screen and (max-width: 599px) {
    .company-contents h2 {
        font-size: 1.6rem
    }
}

.company-contents h3 {
    margin-top: 20px
}

.company-contents h3.english-text {
    font-size: 1.4rem
}

.company-contents h4 {
    color: #000;
    font-size: 1.6rem;
    margin-bottom: 10px;
    word-break: break-word
}

.company-contents p {
    margin-bottom: 1em;
    font-size: 1.4rem;
    word-break: break-word;
    color: #000
}

.company-contents p:last-child {
    margin: 0
}

.company-contents .company-contents-photo {
    display: flex;
    display: -webkit-flex;
    margin: 0 -5px
}

@media only screen and (max-width: 767px) {
    .company-contents .company-contents-photo {
        display: block;
        margin: 0 0 15px
    }
}

.company-contents .company-contents-photo .slick-dots li {
    width: auto;
    height: auto
}

.company-contents .company-contents-photo .slick-dots li.slick-active button {
    background: #000
}

.company-contents .company-contents-photo .slick-dots button {
    width: 10px;
    height: 10px;
    margin: 0;
    text-indent: -9999px;
    background: #6A6B6D;
    border-radius: 100%;
    padding: 0
}

.company-contents .company-contents-photo .slick-track {
    display: flex;
    align-items: center
}

.company-contents .company-contents-photo .photo-item {
    max-width: 100%;
    width: calc(100% /3);
    height: 180px;
    line-height: 180px;
    text-align: center;
    outline: 0;
    padding: 0 5px
}

@media only screen and (max-width: 767px) {
    .company-contents .company-contents-photo .photo-item {
        height: auto
    }
}

.company-contents .company-contents-photo img {
    max-width: 100%;
    margin: 0 auto
}

@media only screen and (min-width: 768px) {
    .company-contents .company-contents-photo img {
        max-height: 100%
    }
}

@media only screen and (max-width: 767px) {
    .company-contents .company-contents-photo img {
        max-height: 220px
    }
}

@media only screen and (max-width: 480px) {
    .company-contents .company-contents-photo img {
        max-height: 150px
    }
}

.company-contents .company-contents-photo img:focus {
    outline: 0
}

.company-contents .company-contents-photo>p,
.company-contents .company-contents-photo .slick-slide {
    padding: 0 5px
}

.company-contents .company-contents-photo p:focus {
    outline: 0
}

.company-mainvisual-custom.company-mainvisual-block {
    display: block;
    position: relative
}

.company-mainvisual-custom.company-mainvisual-block .company-cover-photo {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto
}

.company-mainvisual-custom.photo-img-center .company-cover-photo {
    left: 0;
    right: 0
}

@media only screen and (max-width: 599px) {
    .company-mainvisual-custom {
        height: auto
    }

    .company-mainvisual-custom .company-cover-photo {
        width: auto
    }
}

.company-tab {
    margin-top: 30px;
    display: flex;
    display: -webkit-flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: flex-content;
    justify-content: flex-content
}

.company-tab li {
    min-width: 140px
}

.company-data dl {
    margin-top: 10px;
    *zoom: 1;
    border: 1px solid #d8d8d8;
    border-top: none;
    background-color: #F5F9FA;
    display: flex;
    display: -webkit-flex;
    -webkit-justify-content: flex-content;
    justify-content: flex-content;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-align-content: center;
    align-content: center;
    color: #000
}

.company-data dl:before,
.company-data dl:after {
    content: " ";
    display: table
}

.company-data dl:after {
    clear: both
}

.company-data dl dt {
    font-weight: bold;
    padding: 10px;
    box-sizing: border-box;
    width: 198px;
    border-top: 1px solid #d8d8d8;
    border-right: none
}

.company-data dl dd {
    border-top: 1px solid #d8d8d8;
    border-left: 1px solid #d8d8d8;
    box-sizing: border-box;
    width: calc(100% - 198px);
    margin: 0;
    padding: 10px;
    background-color: #fff;
    word-break: break-word
}

.company-data dl dd p {
    margin-bottom: 0;
    color: #000
}

.company-data dl dd span.fresher-gender {
    margin: 0 10px 0 0
}

.company-data dl dd span.fresher-gender.staff-number {
    font-size: 1.2rem
}

.company-data dl dd span:not(.fresher-gender) {
    display: inline-block;
    min-width: auto;
    padding: 2px 6px;
    text-align: left
}

.company-data dl dd span.working-schedule,
.company-data dl dd span.comma {
    padding: 0px
}

.company-data-hr dl {
    *zoom: 1;
    display: flex;
    display: -webkit-flex;
    -webkit-justify-content: flex-content;
    justify-content: flex-content;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-align-content: center;
    align-content: center;
    color: #000
}

.company-data-hr dl:before,
.company-data-hr dl:after {
    content: " ";
    display: table
}

.company-data-hr dl:after {
    clear: both
}

@media only screen and (max-width: 599px) {
    .company-data-hr dl {
        display: block;
        margin: 5px 0
    }
}

.company-data-hr dl dt {
    word-wrap: break-word;
    font-weight: normal
}

@media only screen and (max-width: 599px) {
    .company-data-hr dl dt {
        width: 100%;
        padding: 5px 0
    }
}

.company-data-hr dl dd {
    box-sizing: border-box;
    width: calc(100% - 210px);
    margin: 0;
    padding-left: 5px;
    background-color: #fff;
    word-break: break-word
}

@media only screen and (max-width: 599px) {
    .company-data-hr dl dd {
        width: 100%;
        padding: 5px 0
    }
}

@media only screen and (max-width: 599px) {
    .company-data-hr dl dd p {
        margin: 0
    }
}

.company-data-hr dl dd span.fresher-gender {
    margin: 0 0 0 0
}

.company-data-hr dl dd span:not(.fresher-gender) {
    display: inline-block;
    min-width: auto;
    padding: 2px 6px;
    text-align: left
}

.company-data-hr dl dd span.margin-content {
    margin: -3px 0 0 0;
    padding-left: 5px;
    border-bottom: 0
}

@media only screen and (max-width: 599px) {
    .company-data-hr dl dd span.margin-content {
        margin: 0;
        padding: 0
    }
}

.cf-ad-text {
    margin: 5px 0 15px 0;
    word-break: break-word
}

.cf-ad-text span {
    color: #6A6B6D;
    border: 1px solid #6A6B6D;
    display: inline-block;
    margin-right: 8px;
    padding: 3px 10px;
    line-height: 1;
    font-size: 1.0rem;
    position: relative;
    top: -2px
}

.cf-mainvisual {
    width: 880px;
    height: 400px;
    margin: 0 0 20px;
    background: url(/assets/bg-top-venue-a32bd16d597205b1e970a384c5c8fc31d246edb3718c2ba65e3748a7f0a193df.jpg)
}

@media only screen and (min-width: 992px) and (max-width: 1240px) {
    .cf-mainvisual {
        width: 662px
    }
}

@media only screen and (max-width: 1022px) {
    .cf-mainvisual {
        background-size: cover;
        background-repeat: no-repeat;
        height: auto;
        width: auto
    }
}

.top-venue-map {
    position: relative;
    max-width: 880px;
    height: 400px;
    margin: 0 auto;
    background: url(/assets/top-map-5b6bbf329031017c10f2857ee03c5cdf26f1bb0ebfdaaa8150dea2dc0c04d757.png) no-repeat;
    background-size: 100% 400px
}

@media only screen and (max-width: 1022px) {
    .top-venue-map {
        background-size: contain;
        height: 310px
    }
}

@media only screen and (max-width: 1022px) {
    .top-venue-map {
        height: auto;
        padding: 20px;
        *zoom: 1
    }

    .top-venue-map:before,
    .top-venue-map:after {
        content: " ";
        display: table
    }

    .top-venue-map:after {
        clear: both
    }
}

@media only screen and (max-width: 599px) {
    .top-venue-map {
        padding: 20px 10px;
        background-position: center center
    }
}

.top-venue-map li {
    position: absolute;
    list-style: none
}

@media only screen and (max-width: 1022px) {
    .top-venue-map li {
        position: static;
        width: 33.3333%;
        float: left
    }
}

@media only screen and (max-width: 599px) {
    .top-venue-map li {
        width: 50%
    }
}

@media only screen and (max-width: 1022px) {
    .top-venue-map li {
        padding: 0 10px
    }
}

.top-venue-map li a {
    position: absolute;
    display: block;
    text-decoration: none
}

@media only screen and (max-width: 1022px) {
    .top-venue-map li a {
        position: relative
    }
}

.top-venue-map li a::before {
    position: absolute;
    display: block;
    content: "";
    top: -14px;
    left: -14px;
    width: 12px;
    height: 12px;
    background: #d03a1c;
    border-radius: 12px
}

@media only screen and (max-width: 1022px) {
    .top-venue-map li a::before {
        display: none
    }
}

.top-venue-map li a::after {
    position: absolute;
    display: block;
    content: "";
    top: -18px;
    left: -18px;
    width: 20px;
    height: 20px;
    background: #d03a1c;
    border-radius: 20px;
    opacity: 0.3;
    -webkit-transition: all 0.2s;
    transition: all 0.2s
}

@media only screen and (max-width: 1022px) {
    .top-venue-map li a::after {
        display: none
    }
}

.top-venue-map li a:hover::after,
.top-venue-map li a:focus::after,
.top-venue-map li a:active::after {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 0
}

.top-venue-map li span {
    position: relative;
    display: block;
    color: #d03a1c;
    border: 1px solid #d03a1c;
    font-size: 1.1rem;
    padding: 1px 0px;
    line-height: 1.2;
    width: 60px;
    text-align: center;
    background-color: #fff;
    margin-bottom: 2px
}

.top-venue-map li span:hover,
.top-venue-map li span:focus,
.top-venue-map li span:active {
    color: #fff;
    background-color: #d03a1c
}

@media only screen and (max-width: 1022px) {
    .top-venue-map li span {
        width: 100%;
        margin-bottom: 5px;
        min-height: 30px;
        line-height: 30px;
        font-size: 1rem
    }
}

.top-venue-map .tokyo {
    top: 172px;
    left: 728px
}

@media only screen and (min-width: 992px) and (max-width: 1240px) {
    .top-venue-map .tokyo {
        top: 126px;
        left: 550px
    }
}

.top-venue-map .tokyo a {
    cursor: default
}

.top-venue-map .tokyo a::before {
    top: 2px;
    bottom: auto;
    left: -20px;
    right: auto
}

.top-venue-map .tokyo a::after {
    top: -2px;
    bottom: auto;
    left: -24px;
    right: auto
}

.top-venue-map .tokyo a span {
    width: 124px
}

@media only screen and (min-width: 992px) and (max-width: 1240px) {
    .top-venue-map .tokyo a span {
        width: 109px
    }
}

@media only screen and (max-width: 1022px) {
    .top-venue-map .tokyo a span {
        width: 100%;
        margin-bottom: 5px;
        min-height: 30px;
        line-height: 30px;
        font-size: 1rem
    }
}

.top-venue-map .tokyo a span:hover {
    color: #fff;
    background-color: #d03a1c
}

.top-venue-map .osaka {
    top: 252px;
    left: 872px
}

.top-venue-map .hongkong {
    top: 218px;
    left: 576px
}

.top-venue-map .hongkong a::before {
    top: -14px;
    bottom: auto;
    left: auto;
    right: -14px
}

.top-venue-map .hongkong a::after {
    top: -18px;
    bottom: auto;
    left: auto;
    right: -18px
}

@media only screen and (min-width: 992px) and (max-width: 1240px) {
    .top-venue-map .hongkong {
        top: 167px;
        left: 415px
    }
}

.top-venue-map .shanghai {
    top: 178px;
    left: 596px
}

@media only screen and (min-width: 992px) and (max-width: 1240px) {
    .top-venue-map .shanghai {
        top: 131px;
        left: 431px
    }
}

.top-venue-map .shanghai a::before {
    top: auto;
    bottom: 3px;
    left: auto;
    right: -18px
}

.top-venue-map .shanghai a::after {
    top: auto;
    bottom: -1px;
    left: auto;
    right: -22px
}

.top-venue-map .seoul {
    top: 142px;
    left: 696px
}

.top-venue-map .seoul a::before {
    top: auto;
    bottom: -14px;
    left: -14px;
    right: auto
}

.top-venue-map .seoul a::after {
    top: auto;
    bottom: -18px;
    left: -18px;
    right: auto
}

@media only screen and (min-width: 992px) and (max-width: 1240px) {
    .top-venue-map .seoul {
        top: 103px;
        left: 525px
    }
}

.top-venue-map .taiwan {
    top: 222px;
    left: 656px
}

@media only screen and (min-width: 992px) and (max-width: 1240px) {
    .top-venue-map .taiwan {
        top: 180px;
        left: 487px
    }
}

.top-venue-map .taiwan a::before {
    top: -18px;
    bottom: auto;
    left: 14px;
    right: auto
}

.top-venue-map .taiwan a::after {
    top: -22px;
    bottom: auto;
    left: 10px;
    right: auto
}

.top-venue-map .singapore {
    top: 257px;
    left: 570px
}

.top-venue-map .singapore a::before {
    top: -14px;
    bottom: auto;
    left: auto;
    right: -14px
}

.top-venue-map .singapore a::after {
    top: -18px;
    bottom: auto;
    left: auto;
    right: -18px
}

@media only screen and (min-width: 992px) and (max-width: 1240px) {
    .top-venue-map .singapore {
        top: 257px;
        left: 412px
    }
}

.top-venue-map .beijing {
    top: 136px;
    left: 594px
}

.top-venue-map .beijing a::before {
    top: auto;
    bottom: -14px;
    left: auto;
    right: -14px
}

.top-venue-map .beijing a::after {
    top: auto;
    bottom: -18px;
    left: auto;
    right: -18px
}

@media only screen and (min-width: 992px) and (max-width: 1240px) {
    .top-venue-map .beijing {
        top: 97px;
        left: 429px
    }
}

.top-venue-map .sydney {
    top: 336px;
    left: 664px
}

.top-venue-map .sydney a::before {
    top: -14px;
    bottom: auto;
    left: auto;
    right: -14px
}

.top-venue-map .sydney a::after {
    top: -18px;
    bottom: auto;
    left: auto;
    right: -18px
}

@media only screen and (min-width: 992px) and (max-width: 1240px) {
    .top-venue-map .sydney {
        top: 254px;
        left: 481px
    }
}

.top-venue-map .london {
    top: 143px;
    left: 421px
}

@media only screen and (min-width: 992px) and (max-width: 1240px) {
    .top-venue-map .london {
        top: 110px;
        left: 318px
    }
}

.top-venue-map .boston {
    top: 132px;
    left: 279px
}

.top-venue-map .boston a::before {
    top: auto;
    bottom: -14px;
    left: -14px;
    right: auto
}

.top-venue-map .boston a::after {
    top: auto;
    bottom: -18px;
    left: -18px;
    right: auto
}

@media only screen and (min-width: 992px) and (max-width: 1240px) {
    .top-venue-map .boston {
        top: 97px;
        left: 210px
    }
}

.top-venue-map .newyork {
    top: 188px;
    left: 269px
}

.top-venue-map .newyork a::before {
    top: -14px;
    bottom: auto;
    left: -14px;
    right: auto
}

.top-venue-map .newyork a::after {
    top: -18px;
    bottom: auto;
    left: -18px;
    right: auto
}

@media only screen and (min-width: 992px) and (max-width: 1240px) {
    .top-venue-map .newyork {
        top: 144px;
        left: 200px
    }
}

.top-venue-map .newyork a {
    cursor: default
}

.top-venue-map .losangels,
.top-venue-map .new_losangels {
    top: 201px;
    left: 87px
}

@media only screen and (min-width: 992px) and (max-width: 1240px) {

    .top-venue-map .losangels,
    .top-venue-map .new_losangels {
        top: 154px;
        left: 45px
    }
}

.top-venue-map .losangels span,
.top-venue-map .new_losangels span {
    width: 84px
}

@media only screen and (max-width: 1022px) {

    .top-venue-map .losangels span,
    .top-venue-map .new_losangels span {
        width: 100%;
        margin-bottom: 5px;
        min-height: 30px;
        line-height: 30px;
        font-size: 1rem
    }
}

.top-venue-map .losangels a::before,
.top-venue-map .new_losangels a::before {
    top: -14px;
    bottom: auto;
    left: auto;
    right: -14px
}

.top-venue-map .losangels a::after,
.top-venue-map .new_losangels a::after {
    top: -18px;
    bottom: auto;
    left: auto;
    right: -18px
}

.top-venue-map .accounting {
    top: 201px;
    left: 87px
}

@media only screen and (min-width: 992px) and (max-width: 1240px) {
    .top-venue-map .accounting {
        top: 154px;
        left: 45px
    }
}

.top-venue-map .accounting span {
    width: 84px
}

@media only screen and (max-width: 1022px) {
    .top-venue-map .accounting span {
        width: 100%;
        margin-bottom: 5px;
        min-height: 30px;
        line-height: 30px;
        font-size: 1rem
    }
}

.top-venue-map .accounting a::before {
    top: -14px;
    bottom: auto;
    left: auto;
    right: -14px
}

.top-venue-map .accounting a::after {
    top: -18px;
    bottom: auto;
    left: auto;
    right: -18px
}

.top-venue-map .seattle {
    top: 121px;
    left: 87px
}

.top-venue-map .seattle a::before {
    top: auto;
    bottom: -14px;
    left: auto;
    right: -14px
}

.top-venue-map .seattle a::after {
    top: auto;
    bottom: -18px;
    left: auto;
    right: -18px
}

@media only screen and (min-width: 992px) and (max-width: 1240px) {
    .top-venue-map .seattle {
        top: 81px;
        left: 50px
    }
}

.top-venue-map .sanfrancisco {
    top: 161px;
    left: 47px
}

@media only screen and (min-width: 992px) and (max-width: 1240px) {
    .top-venue-map .sanfrancisco {
        top: 118px;
        left: 9px
    }
}

.top-venue-map .sanfrancisco span {
    width: 108px
}

@media only screen and (max-width: 1022px) {
    .top-venue-map .sanfrancisco span {
        width: 100%;
        margin-bottom: 5px;
        min-height: 30px;
        line-height: 30px;
        font-size: 1rem
    }
}

.top-venue-map .sanfrancisco a::before {
    top: auto;
    bottom: 3px;
    left: auto;
    right: -18px
}

.top-venue-map .sanfrancisco a::after {
    top: auto;
    bottom: -1px;
    left: auto;
    right: -22px
}

.cf-entry {
    *zoom: 1;
    display: block;
    margin: 0 0 20px;
    padding: 12px;
    border: 1px solid #d8d8d8;
    position: relative;
    transition: all .3s ease 0s
}

.cf-entry:before,
.cf-entry:after {
    content: " ";
    display: table
}

.cf-entry:after {
    clear: both
}

.cf-entry:hover,
.cf-entry.hovered {
    box-shadow: 0 0 3px #9A9B9D
}

.cf-entry:hover .entry-thumb img,
.cf-entry.hovered .entry-thumb img {
    filter: sepia(0%)
}

@media only screen and (max-width: 767px) {
    .cf-entry {
        padding: 45px 10px 10px
    }
}

.cf-entry:active,
.cf-entry:focus {
    outline: 0;
    text-decoration: none
}

.cf-entry img {
    max-width: 100%
}

.cf-entry .entry-thumb {
    float: left;
    width: 273px;
    height: 169px;
    display: flex;
    justify-content: center;
    align-items: center
}

@media only screen and (max-width: 767px) {
    .cf-entry .entry-thumb {
        width: 180px;
        height: 111px;
        margin: 0 0 13px;
        float: none;
        display: inline-block;
        vertical-align: middle
    }
}

@media only screen and (max-width: 480px) {
    .cf-entry .entry-thumb {
        width: 120px;
        height: 74px
    }
}

.cf-entry .entry-thumb img {
    max-width: 100%;
    max-height: 100%;
    filter: sepia(40%);
    transition: all .3s ease 0s
}

.cf-entry .event-name {
    font-size: 1.6rem;
    margin: 0 0 1rem
}

.cf-entry .entry-content {
    padding-left: 30px;
    width: calc(100% - 273px);
    float: left
}

@media only screen and (max-width: 767px) {
    .cf-entry .entry-content {
        padding-left: 15px;
        width: calc(100% - 184px);
        margin: 0 0 13px;
        float: none;
        display: inline-block;
        vertical-align: middle
    }
}

@media only screen and (max-width: 480px) {
    .cf-entry .entry-content {
        width: calc(100% - 124px)
    }
}

.cf-entry .entry-info-title {
    margin: 0 0 15px
}

.cf-entry .entry-info-title img {
    height: 35px
}

@media only screen and (max-width: 767px) {
    .cf-entry .entry-info-title {
        position: absolute;
        top: 8px;
        left: 15px;
        margin: 0
    }

    .cf-entry .entry-info-title img {
        max-height: 30px
    }
}

.cf-entry .entry-info-date {
    display: flex;
    align-items: center;
    margin: 0 0 15px;
    color: #000
}

@media only screen and (max-width: 767px) {
    .cf-entry .entry-info-date {
        display: block;
        margin: 0
    }
}

.cf-entry .entry-info-date>span {
    display: inline-block;
    padding: 3px 8px;
    margin: 0 5px 0 0;
    background: #3A50C9;
    color: #fff;
    font-size: 1.2rem
}

@media only screen and (max-width: 767px) {
    .cf-entry .entry-info-date>span {
        line-height: 1;
        padding: 3px;
        margin: 0 0 5px;
        font-size: 1rem
    }
}

.cf-entry .cf-info-news,
.cf-entry .cf-info-notification {
    position: relative;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 0 0 0 30px;
    box-sizing: border-box;
    white-space: nowrap;
    width: calc(100% - 273px - 30px);
    float: right
}

@media only screen and (max-width: 767px) {

    .cf-entry .cf-info-news,
    .cf-entry .cf-info-notification {
        width: 100%;
        clear: both;
        float: none
    }
}

.cf-entry .cf-info-news.finished {
    padding: 0
}

.cf-entry .cf-info-news.finished:before {
    display: none
}

.cf-entry .cf-info-news::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    content: "fiber_new";
    position: absolute;
    top: -1px;
    left: 0px;
    font-size: 2.8rem;
    color: #e67e22
}

.cf-entry .cf-info-notification::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    content: "notifications_none";
    position: absolute;
    top: -2px;
    left: 0px;
    top: 0px;
    left: 0px;
    font-size: 2.1rem;
    color: #e67e22
}

.cf-entry .cf-info-finished-text,
.cf-entry .cf-info-prepare-text {
    margin-top: 13px;
    padding: 5px;
    text-align: center;
    font-size: 1.6rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: calc(100% - 273px - 30px);
    float: right
}

@media only screen and (max-width: 767px) {

    .cf-entry .cf-info-finished-text,
    .cf-entry .cf-info-prepare-text {
        font-size: 1.2rem;
        width: 100%;
        clear: both;
        float: none
    }
}

.cf-entry .cf-info-finished-text {
    background-color: #6A6B6D;
    color: #fff
}

.cf-entry .cf-info-prepare-text {
    background-color: #e67e22;
    color: #fff
}

.cf-ad {
    margin: 0 0 20px;
    text-align: center;
    font-size: 1.6rem
}

.cf-ad img {
    max-width: 100%
}

.cf-note {
    font-size: 1.4rem;
    margin: 20px 0;
    color: #000
}

.cf-info {
    display: block;
    border: 1px solid #d8d8d8;
    margin-top: 20px
}

.cf-info .cf-info-title {
    position: absolute;
    z-index: 1;
    top: 10px;
    left: 20px;
    font-size: 2.2rem;
    font-weight: bold;
    color: #fff;
    text-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3)
}

@media only screen and (max-width: 767px) {
    .cf-info .cf-info-title {
        left: 10px;
        right: 10px
    }
}

.cf-info .cf-info-title::after {
    content: "";
    display: block;
    position: absolute;
    bottom: -4px;
    left: 0px;
    height: 2px;
    width: 80px;
    background-color: #036;
    -webkit-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out
}

.cf-info .cf-info-date {
    position: absolute;
    width: 100%;
    height: 100%;
    line-height: 40px;
    bottom: 0px;
    left: 0px;
    color: #fff;
    box-sizing: border-box;
    padding: 44px 20px 0 20px;
    font-size: 1.5rem;
    background: -moz-linear-gradient(bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.2) 100%);
    background: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.2) 100%);
    background: linear-gradient(to top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.2) 100%)
}

@media only screen and (max-width: 767px) {
    .cf-info .cf-info-date {
        padding-left: 10px;
        padding-right: 10px
    }
}

.cf-info .cf-info-wrapper {
    *zoom: 1;
    padding: 10px 20px
}

.cf-info .cf-info-wrapper:before,
.cf-info .cf-info-wrapper:after {
    content: " ";
    display: table
}

.cf-info .cf-info-wrapper:after {
    clear: both
}

@media only screen and (max-width: 1022px) {
    .cf-info .cf-info-wrapper {
        padding: 10px
    }
}

.cf-info .cf-info-news,
.cf-info .cf-info-notification {
    position: relative;
    float: left;
    width: 50%;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 0px 2em;
    box-sizing: border-box;
    white-space: nowrap
}

.cf-info .cf-info-news::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    content: "fiber_new";
    position: absolute;
    top: -1px;
    left: 0px;
    font-size: 2.4rem;
    color: #e67e22
}

.cf-info .cf-info-notification::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    content: "notifications_none";
    position: absolute;
    top: -2px;
    left: 0px;
    top: 0px;
    left: 0px;
    font-size: 2.0rem;
    color: #e67e22
}

.cf-info .cf-info-image {
    position: relative;
    height: 160px
}

.cf-info .cf-info-image>img {
    width: 100%
}

.cf-info .cf-info-image img {
    position: relative;
    -webkit-filter: sepia(40%);
    -moz-filter: sepia(40%);
    -o-filter: sepia(40%);
    -ms-filter: sepia(40%);
    filter: sepia(40%);
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    max-width: 100%
}

.cf-info .cf-info-finished-text,
.cf-info .cf-info-prepare-text {
    position: absolute;
    width: 60%;
    bottom: 30px;
    left: 20%;
    padding: 5px 0;
    text-align: center;
    font-size: 1.6rem
}

@media only screen and (max-width: 767px) {

    .cf-info .cf-info-finished-text,
    .cf-info .cf-info-prepare-text {
        width: auto;
        bottom: 10px;
        left: 10px;
        right: 10px;
        margin: 0 auto
    }
}

.cf-info .cf-info-finished-text {
    background-color: #6A6B6D;
    color: #fff
}

.cf-info .cf-info-prepare-text {
    background-color: #e67e22;
    color: #fff
}

.cf-info:hover,
.cf-info.hovered:not(.cf-info-disabled) {
    color: #89ABE3;
    text-decoration: none
}

.cf-info:hover .cf-info-image img,
.cf-info.hovered:not(.cf-info-disabled) .cf-info-image img {
    position: relative;
    -webkit-filter: sepia(0%);
    -moz-filter: sepia(0%);
    -o-filter: sepia(0%);
    -ms-filter: sepia(0%);
    filter: sepia(0%)
}

.cf-info:hover .cf-info-title::after,
.cf-info.hovered:not(.cf-info-disabled) .cf-info-title::after {
    width: 100%
}

.cf-info.cf-info-disabled .cf-info-news,
.cf-info.cf-info-disabled .cf-info-notification {
    color: #6A6B6D
}

.cf-info.cf-info-disabled .cf-info-image img {
    -webkit-filter: sepia(40%);
    -moz-filter: sepia(40%);
    -o-filter: sepia(40%);
    -ms-filter: sepia(40%);
    filter: sepia(40%)
}

.cf-info.cf-info-disabled:hover .cf-info-image img,
.cf-info.cf-info-disabled.hovered .cf-info-image img {
    -webkit-filter: sepia(40%);
    -moz-filter: sepia(40%);
    -o-filter: sepia(40%);
    -ms-filter: sepia(40%);
    filter: sepia(40%)
}

.cf-info.cf-info-disabled:hover .cf-info-title::after,
.cf-info.cf-info-disabled.hovered .cf-info-title::after {
    width: 100%
}

.cf-info.cf-info-prepare {
    pointer-events: none
}

.cf-info.cf-info-prepare .cf-info-image img {
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    filter: grayscale(100%)
}

.cf-info.cf-info-prepare:hover .cf-info-image img {
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    filter: grayscale(100%)
}

.cf-info-boston .cf-info-title a {
    color: #036
}

.cf-info-london .cf-info-title a {
    color: #C00
}

.cf-info-tokyo-summer .cf-info-title a {
    color: #390
}

.cf-flow {
    border: 1px solid #d8d8d8;
    margin: 0 0 20px 0;
    line-height: 80px;
    text-align: center;
    font-size: 1.6rem;
    color: #000;
    text-align: left
}

.cf-flow h2 {
    font-size: 1.4rem;
    line-height: 1.5rem;
    margin: 0;
    background-color: #3a50c9;
    color: #fff;
    padding: 10px
}

.cf-flow h3 {
    font-size: 1.4rem;
    line-height: 1.5rem;
    margin: 0;
    border-top: 1px solid #d8d8d8;
    padding-top: 20px
}

.cf-flow h3 i {
    font-style: normal;
    display: inline-block;
    margin-right: 0.5rem
}

.cf-flow div {
    padding: 0 15px 10px 15px
}

.cf-flow p {
    margin: 15px 0 0 0;
    line-height: 1.3
}

.cf-cms-step,
.cf-cms-course {
    margin: 20px 0;
    background-color: #9A9B9D;
    height: 240px;
    line-height: 240px;
    color: #fff;
    text-align: center;
    font-size: 1.6rem
}

.sidemenu .sidemenu-title {
    font-size: 1.4rem;
    line-height: 1.5rem;
    margin: 0;
    background-color: #89ABE3;
    color: #fff;
    padding: 10px
}

.sidemenu .cf-ad {
    margin: 0 0 20px 0;
    line-height: 0;
    height: 140px;
    line-height: 0
}

.sidemenu .cf-flow h3 {
    position: relative;
    padding-left: 40px
}

.sidemenu .cf-flow h3::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    position: absolute;
    top: 15px;
    left: 4px;
    font-size: 2.4rem
}

.sidemenu .cf-flow-1 h3::before {
    content: "phonelink"
}

.sidemenu .cf-flow-2 h3::before {
    content: "description"
}

.sidemenu .cf-flow-3 h3::before {
    content: "language"
}

.sidemenu .cf-flow-4 h3::before {
    content: "business"
}

.sidemenu .cf-flow-5 h3::before {
    content: "school"
}

.sidemenu .cf-flow-6 h3::before {
    content: "flight_takeoff"
}

.cf-menu {
    border: 1px solid #d8d8d8
}

.cf-menu .sidemenu-navi li a {
    height: 40px
}

.resume-job-preview-qa table tbody tr th:nth-child(1),
.resume-job-preview-qa table tbody tr td:nth-child(1) {
    background-color: #F5F9FA
}

.resume-job-preview-qa table tbody tr td .text-blue {
    color: #3a50c9
}

.resume-job-preview-qa table tbody tr td .text-orange {
    color: #e67e22
}

.resume-job-preview-qa table tbody tr td ul li {
    word-break: break-word
}

.resume-job-preview-qa table .number-col {
    width: 80px
}

.resume-job-preview-qa table p {
    margin: 0
}

.introduce-question {
    padding-top: 20px
}

#company-question h3 {
    margin-top: 0;
    float: left;
    width: 100%
}

#company-question h3 span {
    float: left
}

#company-question h3 p {
    font-size: 1.2rem;
    float: right;
    line-height: 2;
    margin-left: 10px;
    font-weight: bold;
    color: #000
}

#company-question .resume-job-preview-qa {
    margin-top: 20px
}

#company-question .resume-job-preview-qa table tbody tr td:nth-child(1) {
    width: 30px
}

#company-question .resume-job-preview-qa table tbody tr td:nth-child(2) {
    min-width: 60px
}

@media only screen and (min-width: 598px) {
    #company-question .resume-job-preview-qa table tbody tr td:nth-child(2) {
        width: 180px
    }
}

#company-question .resume-job-preview-qa table tbody tr td:last-child {
    max-width: 250px;
    min-width: 100px
}

#cf_company_detail {
    *zoom: 1
}

#cf_company_detail:before,
#cf_company_detail:after {
    content: " ";
    display: table
}

#cf_company_detail:after {
    clear: both
}

#cf_company_detail .company-contents,
#cf_company_detail .company-data {
    width: 100%;
    float: left
}

#cf_company_detail .company-data .heading-style-02 {
    padding-bottom: 0;
    margin-bottom: 10px;
    color: #3a50c9
}

.block-content-textleft .text-align-left {
    text-align: left !important
}

.company-detail-tab {
    float: left;
    width: 100%;
    margin-top: 30px
}

.company-detail-tab .company-tab {
    width: 50%;
    float: left;
    margin-top: 0
}

.company-detail-tab .cfn-company-button-show {
    width: 50%;
    float: right;
    display: flex;
    justify-content: flex-end
}

.company-detail-tab .cfn-company-button-show a {
    margin-left: 10px
}

.company-detail-tab .cfn-company-button-show a img {
    max-height: 42px;
    max-width: 42px;
    width: auto;
    height: auto
}

@media only screen and (max-width: 599px) {
    .user-wrapper .top-wrapper {
        padding-left: 0;
        padding-right: 0
    }
}

.preview-scout {
    margin-top: 50px
}

@media only screen and (max-width: 1022px) {
    .top-wrapper {
        width: auto;
        min-width: 0px
    }
}

@media only screen and (max-width: 599px) {
    .top-wrapper {
        padding-bottom: 30px
    }
}

.contents {
    margin-bottom: 30px
}

@media only screen and (max-width: 599px) {
    .contents {
        margin-bottom: 20px
    }
}

@media only screen and (max-width: 1022px) {
    .contents {
        width: 100%;
        padding: 0
    }
}

@media only screen and (max-width: 1022px) {
    .company-info {
        height: auto;
        flex-wrap: wrap;
        -webkit-flex-wrap: wrap
    }

    .company-info h2 {
        font-size: 1.4rem
    }

    .company-info .company-info-button {
        margin-left: auto
    }
}

@media only screen and (max-width: 599px) {
    .company-info .company-info-button {
        margin-top: 20px;
        width: 100%;
        clear: both;
        *zoom: 1
    }

    .company-info .company-info-button:before,
    .company-info .company-info-button:after {
        content: " ";
        display: table
    }

    .company-info .company-info-button:after {
        clear: both
    }

    .company-info .company-info-button>.button {
        float: right
    }
}

@media only screen and (max-width: 1022px) {
    .company-tab.cfn-tab li {
        width: auto;
        min-width: 0px;
        padding-left: 8px;
        padding-right: 8px;
        font-size: 1.2rem
    }

    .company-tab.cfn-tab li a {
        padding-left: 5px;
        padding-right: 5px
    }
}

@media only screen and (max-width: 1022px) {
    .company-mainvisual img {
        width: 100%;
        height: auto
    }
}

@media only screen and (max-width: 1022px) {
    .company-data dl dt {
        width: 100%;
        padding: 10px 20px
    }
}

@media only screen and (max-width: 599px) {
    .company-data dl dt {
        padding: 10px
    }
}

@media only screen and (max-width: 1022px) {
    .company-data dl dd {
        width: 100%;
        border-left: none
    }
}

@media only screen and (max-width: 599px) {
    .company-data dl dd {
        padding: 10px
    }
}

.company-data dl dd.company-fresher-recruitments {
    font-size: 1.2rem
}

.sp-apply {
    display: none;
    position: fixed;
    bottom: 0px;
    z-index: 100;
    width: 100%;
    padding: 10px 15px;
    border-top: 1px solid #d8d8d8;
    background-color: #fff
}

.sp-apply .button {
    margin: 0 auto
}

@media only screen and (max-width: 599px) {
    .sp-apply {
        display: block
    }

    .sp-apply .button-max-apply {
        font-size: 10px
    }
}

@media only screen and (max-width: 1022px) {
    .sidemenu {
        width: 100%
    }
}

@media only screen and (max-width: 599px) {
    body.job-detail {
        padding-bottom: 40px
    }

    body.job-detail footer {
        bottom: 40px
    }
}

body.job-detail .button-job-like {
    width: 160px;
    height: 36px;
    font-size: 1.4rem;
    background-color: #e67e22;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s
}

body.job-detail .button-job-like:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

body.job-detail .button-job-like:hover,
body.job-detail .button-job-like:focus,
body.job-detail .button-job-like:active {
    color: #fff
}

body.job-detail .button-job-like::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -75px;
    left: 0px;
    border-radius: 100%;
    background-color: #eb9950;
    width: 180px;
    height: 180px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

@media only screen and (max-width: 599px) {
    body.job-detail .company-info .company-info-button {
        display: none
    }
}

body.job-detail .sp-apply .button-job-like {
    display: none
}

@media only screen and (max-width: 599px) {
    body.job-detail .sp-apply {
        padding-left: 15px;
        padding-right: 15px;
        display: flex
    }

    body.job-detail .sp-apply .cf-btn {
        width: calc(50% - 5px);
        font-size: 1.2rem;
        height: 32px
    }

    body.job-detail .sp-apply .cf-btn.button-job-like {
        margin-right: 5px;
        display: flex
    }

    body.job-detail .sp-apply .cf-btn.button-job-apply {
        margin-left: 5px
    }
}

@media only screen and (max-width: 599px) {
    footer .sitemap {
        display: none
    }
}

.cf-company-list {
    width: 100%;
    float: left
}

.cf-company-list .cf-company-detail {
    float: left;
    width: 100%;
    padding: 5px
}

.cf-company-list .cf-company-detail:not(:first-child) {
    display: none
}

.cf-company-list .cf-company-button-list {
    width: auto;
    margin-left: 10px;
    display: flex;
    justify-content: flex-end
}

@media only screen and (min-width: 1241px) {
    .cf-company-list .cf-company-button-list {
        margin-right: 10px
    }
}

.cf-company-list .cf-company-button-list a {
    margin-right: 10px
}

.cf-company-list .cf-company-button-list a:last-child {
    margin-right: 0
}

.cf-company-list .cf-company-button-list img {
    float: left;
    padding: 0px 3px 0px 0px;
    width: 33px;
    height: auto
}

.cf-company-list.cf-like-list {
    padding: 20px;
    background: #f5f5f5;
    margin-bottom: 30px
}

.cf-company-list.cf-like-list .cf-company-detail-wrapper {
    padding: 10px 10px;
    background: #fff;
    border-radius: 10px
}

.cf-company-list.cf-like-list .cf-company-detail-wrapper .company-liked-info {
    margin-bottom: 10px
}

.cf-company-list.cf-like-list .cf-company-detail-wrapper .company-liked-info h2 {
    font-weight: bold;
    padding-left: 0.5em;
    padding-right: 0 !important;
    padding-bottom: 1em;
    border-bottom: solid 1px #ccc
}

.cf-company-list.cf-like-list .cf-company-detail-wrapper .company-liked-info h2 a {
    display: block;
    position: relative
}

.cf-company-list.cf-like-list .cf-company-detail-wrapper .company-liked-info h2 a:after {
    font-family: 'Material Icons';
    position: absolute;
    right: 0;
    top: calc(50% - 0.6em);
    content: '\e5cc';
    width: 1.3em;
    height: 1.3em;
    font-size: inherit;
    display: -webkit-flex;
    -webkit-justify-content: center;
    -webkit-align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    background: #3a50c9;
    color: #fff;
    font-weight: bold;
    margin-left: 0.4em;
    border-radius: 2em
}

.cf-company-list.cf-like-list .cf-company-detail-wrapper .cf-job-company-detail {
    display: -webkit-flex;
    -webkit-justify-content: space-between;
    -webkit-align-items: stretch;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch
}

.cf-company-list.cf-like-list .cf-company-detail-wrapper .cf-job-company-detail .cf-company-job-detail {
    display: -webkit-flex;
    -webkit-justify-content: space-between;
    -webkit-align-items: stretch;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    border-top: 0;
    padding-top: 0
}

.cf-company-list.cf-like-list .cf-company-detail-wrapper .cf-job-company-detail .cf-company-job-detail .cf-company-icon {
    margin-right: 1em
}

.cf-company-list.cf-like-list .cf-company-detail-wrapper .cf-job-company-detail .cf-company-job-detail .cf-job-name {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding-right: 0
}

.cf-company-list.cf-like-list .cf-company-detail-wrapper .cf-job-company-detail .cf-company-job-detail .cf-company-job-reminder {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding-right: 0;
    font-size: 1.2rem;
    max-width: 120px;
    margin-left: 10px
}

.cf-company-list.cf-like-list .cf-company-detail-wrapper .cf-job-company-detail .cf-company-job-detail .cf-company-job-reminder .reminder-toggle {
    display: block
}

.cf-company-list.cf-like-list .cf-company-detail-wrapper .cf-job-company-detail .cf-company-job-detail .cf-company-job-reminder input {
    margin-left: 10px
}

.cf-company-list.cf-like-list .cf-company-detail-wrapper .cf-job-company-detail .cf-company-job-detail .cf-company-job-reminder input.reminder-notification {
    display: inline-block
}

.cf-company-list.cf-like-list .cf-company-detail-wrapper .cf-job-company-detail .cf-company-job-detail .cf-company-job-reminder label {
    cursor: pointer
}

.cf-company-list.cf-like-list .cf-company-detail-wrapper .cf-job-company-detail .cf-company-detail-button {
    position: static
}

.cf-company-list.cf-like-list .cf-company-detail-wrapper .cf-job-company-detail .cf-job-company-center {
    margin-top: auto;
    margin-bottom: auto
}

.cf-like-list .cf-company-detail:not(:first-child) {
    display: block
}

.cf-like-list .cf-company-detail-header .cf-company-detail-name {
    padding-right: 160px
}

.cf-company-filter-list {
    margin: 20px 0 30px
}

@media only screen and (max-width: 767px) {
    .cf-company-filter-list .search-container-box {
        width: 100%;
        padding: 0 0 12px
    }
}

@media only screen and (max-width: 767px) {
    .cf-company-filter-list .search-container-box+.search-container-box {
        padding: 12px 0 0;
        border-top: 1px solid #d8d8d8
    }
}

.cf-company-filter-list .search-container-box.search-box-industries {
    width: 32%
}

@media only screen and (max-width: 767px) {
    .cf-company-filter-list .search-container-box.search-box-industries {
        width: 100%;
        padding: 0 0 12px
    }
}

@media only screen and (min-width: 992px) and (max-width: 1240px) {
    .cf-company-filter-list .search-container-box.search-box-industries {
        width: 50%
    }
}

.cf-company-filter-list .search-container-box.btn-show-advanced-search {
    width: 18%
}

@media only screen and (max-width: 767px) {
    .cf-company-filter-list .search-container-box.btn-show-advanced-search {
        width: 100%
    }
}

@media only screen and (min-width: 992px) and (max-width: 1240px) {
    .cf-company-filter-list .search-container-box.btn-show-advanced-search {
        width: 100%
    }

    .cf-company-filter-list .search-container-box.btn-show-advanced-search a {
        float: right
    }
}

@media only screen and (max-width: 599px) {
    .cf-company-filter-list .search-title {
        width: 100%;
        float: none;
        margin: 0 0 5px
    }
}

@media only screen and (max-width: 599px) {
    .cf-company-filter-list .search-condition {
        width: 100%;
        float: none
    }
}

.cf-company-filter-list .search-box {
    margin-bottom: 40px
}

@media only screen and (max-width: 767px) {
    .cf-company-filter-list .search-box {
        padding: 0 15px
    }
}

.cf-company-filter-list .search-box .search-container {
    padding: 12px 0
}

.cf-company-filter-list .search-box .note {
    display: inline-block;
    margin: 0 0 0 20px;
    color: #000
}

@media only screen and (max-width: 599px) {
    .cf-company-filter-list .search-box .note {
        margin: 0
    }
}

@media only screen and (max-width: 599px) {
    .cf-company-filter-list .search-container-box {
        float: none;
        width: 100%;
        padding: 0 0 12px 0
    }
}

@media only screen and (max-width: 599px) {
    .cf-company-filter-list .search-container-box+.search-container-box {
        border-top: 1px solid #d8d8d8;
        padding: 12px 0 0 0
    }
}

.cf-company-filter-list .search-init .button {
    margin-right: 0
}

.cf-company-filter-list table {
    margin: 0 0 20px
}

@media only screen and (max-width: 599px) {

    .cf-company-filter-list table thead,
    .cf-company-filter-list table th,
    .cf-company-filter-list table tbody,
    .cf-company-filter-list table tr,
    .cf-company-filter-list table td {
        border: none;
        padding: 0
    }
}

@media only screen and (max-width: 599px) {

    .cf-company-filter-list table tr,
    .cf-company-filter-list table td {
        display: block
    }
}

@media only screen and (max-width: 599px) {
    .cf-company-filter-list table tr:first-child td {
        border-top: none
    }
}

@media only screen and (max-width: 599px) {
    .cf-company-filter-list table td {
        padding: 10px;
        border-top: 1px solid #d8d8d8
    }
}

.cf-company-filter-list table td.cf-company-filter-label {
    width: 20%
}

@media only screen and (max-width: 599px) {
    .cf-company-filter-list table td.cf-company-filter-label {
        width: 100%;
        border-top: 1px solid #d8d8d8
    }
}

.cf-company-filter-list table td.cf-company-filter-label+td {
    width: 30%
}

@media only screen and (max-width: 599px) {
    .cf-company-filter-list table td.cf-company-filter-label+td {
        width: 100%
    }
}

@media only screen and (max-width: 599px) {
    .cf-company-filter-list table td+td {
        border-top: none
    }
}

.cf-company-filter-list table .button {
    margin-right: 0
}

.cf-company-filter-list .md-textfield {
    margin: 0
}

.cf-company-filter-list .cf-popup-open {
    display: inline-block
}

.cf-company-filter-list .cf-popup-open~.cf-popup-open {
    margin-left: 20px
}

.cf-company-filter-list .cf-popup-open .material-icons {
    vertical-align: top;
    font-size: 2rem;
    margin: 0 5px 0 0
}

.cf-company-filter-list .search-results {
    padding: 5px 0;
    margin: 0 0 10px
}

.cf-company-filter-list .select-box {
    margin: 0 0 10px
}

.cf-company-filter-list .select-box select {
    min-width: 263px
}

.cf-company-detail-wrapper {
    border: 1px solid #d8d8d8;
    margin-bottom: 10px;
    width: 100%;
    float: left
}

@media only screen and (max-width: 767px) {
    .cf-company-detail-wrapper {
        margin-bottom: 15px
    }
}

.cf-company-detail-wrapper .cf-company-detail {
    display: flex
}

.cf-company-detail-wrapper .cf-company-detail .cf-company-logo-wrapper {
    width: 80px;
    display: flex;
    align-items: center;
    margin-right: 10px;
    justify-content: center
}

@media only screen and (max-width: 767px) {
    .cf-company-detail-wrapper .cf-company-detail .cf-company-logo-wrapper {
        width: 40px
    }
}

.cf-company-detail-wrapper .cf-company-detail .cf-company-logo-wrapper .company-list-logo {
    max-width: 80px;
    max-height: 50px
}

@media only screen and (max-width: 767px) {
    .cf-company-detail-wrapper .cf-company-detail .cf-company-logo-wrapper .company-list-logo {
        max-width: 40px
    }
}

.cf-company-detail-wrapper .cf-company-detail .cf-company-content-wrapper {
    width: calc(100% - 90px);
    position: relative
}

@media only screen and (max-width: 767px) {
    .cf-company-detail-wrapper .cf-company-detail .cf-company-content-wrapper {
        width: calc(100% - 40px)
    }

    .cf-company-detail-wrapper .cf-company-detail .cf-company-content-wrapper .cf-company-button-show {
        margin-left: 0 !important
    }
}

.cf-company-detail-wrapper .cf-company-button {
    position: absolute;
    top: 10px;
    right: 20px;
    width: 125px
}

@media only screen and (max-width: 767px) {
    .cf-company-detail-wrapper .cf-company-button {
        position: relative;
        float: right;
        margin-top: 10px;
        display: block;
        width: 100%;
        top: 0;
        right: 0;
        padding-left: 5px
    }
}

.cf-company-detail-wrapper .cf-company-button .cf-company-button-show {
    margin: 0px 0px 5px 5px;
    float: right
}

.cf-company-detail-wrapper .cf-company-button .cf-company-button-show img {
    float: right;
    padding: 0px 3px 3px 0px;
    width: 34px;
    height: auto
}

.cf-company-detail-wrapper .cf-company-button .cf-company-button-icon {
    width: 120px;
    display: flex;
    justify-content: flex-end;
    float: left
}

@media only screen and (max-width: 767px) {
    .cf-company-detail-wrapper .cf-company-button .cf-company-button-icon {
        justify-content: flex-start
    }
}

.cf-company-detail-wrapper .cf-company-button .cf-company-button-icon a {
    margin-right: 10px
}

.cf-company-detail-wrapper .cf-company-button .cf-company-button-icon a:last-child {
    margin-right: 0
}

.cf-company-detail-wrapper .cf-company-button .button {
    width: 120px;
    margin-left: auto
}

.cf-company-detail-wrapper .cf-company-button .button span {
    padding-left: 0;
    line-height: 26px;
    right: 3px
}

.cf-company-detail-wrapper .cf-company-button .button span::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    vertical-align: middle
}

.cf-company-detail-wrapper .cf-company-button .cf-company-tag {
    float: left;
    display: flex
}

.cf-company-detail-wrapper .cf-company-button .cf-company-tag .button {
    width: 120px;
    float: left;
    margin-left: 5px
}

@media only screen and (max-width: 480px) {
    .cf-company-detail-wrapper .cf-company-button .cf-company-tag .button {
        width: 90px;
        margin: 0 0 5px 5px
    }
}

@media only screen and (max-width: 319px) {
    .cf-company-detail-wrapper .cf-company-button .cf-company-tag .button {
        width: 80px
    }
}

.cf-company-detail-wrapper .cf-company-button .cf-company-tag .button-company {
    background-color: #77bf81
}

.cf-company-detail-wrapper .cf-company-button .cf-company-tag .icon::before {
    display: none
}

.cf-company-detail-wrapper .button-show span::before {
    content: "expand_more"
}

.cf-company-detail-wrapper .button-hide {
    display: none
}

.cf-company-detail-wrapper .button-hide span::before {
    content: "expand_less"
}

.cf-company-detail {
    position: relative;
    padding: 20px
}

@media only screen and (max-width: 767px) {
    .cf-company-detail {
        padding: 10px 5px
    }
}

.cf-company-detail dt,
.cf-company-detail dd {
    padding: 5px 0
}

.cf-company-detail dt {
    width: 70px
}

.cf-company-detail dt:after {
    content: ':';
    float: right
}

.cf-company-detail dd {
    padding-left: 10px;
    width: calc(100% - 70px);
    box-sizing: border-box
}

.cf-company-detail+.cf-company-detail {
    padding-top: 0
}

.cf-company-detail+.cf-company-detail .cf-company-job-detail {
    border-top: 1px solid #d8d8d8;
    margin-left: 10px
}

@media only screen and (max-width: 767px) {
    .cf-company-detail .cf-company-detail-header {
        width: 100%
    }
}

.cf-company-job-detail {
    position: relative;
    padding-top: 20px
}

@media only screen and (max-width: 767px) {
    .cf-company-job-detail {
        padding-top: 10px
    }
}

.cf-company-icon {
    margin-bottom: 10px
}

.cf-job-name {
    font-size: 1.4rem;
    margin: 0;
    padding-right: 400px;
    word-break: break-word
}

@media only screen and (max-width: 1180px) {
    .cf-job-name {
        padding-right: 0;
        padding-bottom: 10px
    }
}

.cf-company-detail-header {
    display: block;
    float: left;
    width: 100%
}

.cf-company-detail-header .cf-company-icon {
    margin-bottom: 0;
    padding-left: 10px;
    width: 100%;
    float: left
}

.cf-company-detail-header .company-info-title {
    display: flex;
    align-items: center;
    width: 100%;
    float: left;
    clear: both
}

.cf-company-detail-header .company-info-title .company-info-logo {
    margin-left: 10px;
    width: 40px
}

.cf-company-detail-header .company-info-title .company-info-name {
    margin-left: 10px;
    width: calc(100% - 200px)
}

.cf-company-detail-header .company-info-title .company-info-type {
    margin-bottom: 0;
    text-align: left
}

.cf-company-detail-header .cf-company-detail-name {
    font-size: 1.6rem;
    margin: 0;
    padding-right: 160px;
    word-break: break-word
}

@media only screen and (max-width: 767px) {
    .cf-company-detail-header .cf-company-detail-name {
        padding-right: 120px;
        font-size: 1.4rem
    }
}

.cf-company-detail-header .cf-company-detail-name a {
    color: #000
}

.cf-company-detail-header .cf-company-detail-name a:hover {
    color: #3a50c9
}

.cf-company-detail-header .icon-new-registration:before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    content: "fiber_new";
    font-size: 2.4rem;
    color: #e67e22;
    display: inline-block;
    vertical-align: top
}

.cf-company-detail-header .cf-company-detail-status {
    position: absolute;
    right: 15px;
    top: 17px;
    padding: 2px 15px;
    display: inline-block;
    font-size: 1rem;
    line-height: 1;
    color: #fff;
    background-color: #036
}

.cf-company-detail-message {
    margin: 0 0 1rem
}

.cf-company-detail-content {
    margin: 0 0 10px;
    *zoom: 1
}

.cf-company-detail-content:before,
.cf-company-detail-content:after {
    content: " ";
    display: table
}

.cf-company-detail-content:after {
    clear: both
}

.cf-company-detail-content .cf-company-detail-thumb {
    width: 200px;
    margin-right: 15px
}

@media only screen and (max-width: 599px) {
    .cf-company-detail-content .cf-company-detail-thumb {
        float: none !important
    }
}

.cf-company-detail-content .cf-company-detail-thumb img {
    max-width: 100%
}

.page-liked-company-list .cf-company-icon {
    margin-bottom: 10px
}

.page-liked-company-list .cf-company-detail-button {
    position: absolute;
    top: 35px;
    right: 20px;
    display: flex;
    justify-content: space-between
}

@media only screen and (max-width: 1180px) {
    .page-liked-company-list .cf-company-detail-button {
        position: static;
        margin-right: 10px
    }
}

.cf-company-detail-button .user-like-job span {
    padding: 0
}

.cf-company-detail-button>.button {
    width: 120px
}

.cf-company-detail-button>.button~.button {
    margin-left: 5px
}

@media only screen and (max-width: 480px) {
    .cf-company-detail-button>.button {
        width: 90px
    }
}

@media only screen and (max-width: 319px) {
    .cf-company-detail-button>.button {
        width: 80px
    }
}

.cf-company-detail-button .button-company {
    background-color: #DAE5E1
}

.cf-company-detail-button .bookmark-unlike-button {
    padding-left: 0
}

@media only screen and (max-width: 599px) {
    .page-liked-company-list .col-xs-10 {
        width: 100%;
        left: 0
    }
}

.top-wrapper .note-experience {
    color: #DD0E1B
}

.top-wrapper p {
    color: #000
}

.page-liked-company-list .cf-company-button-list .cf-company-button-list-box {
    display: flex;
    width: 120px;
    margin-right: 10px
}

@media only screen and (max-width: 1180px) {
    .page-liked-company-list .cf-company-button-list {
        justify-content: space-between
    }

    .page-liked-company-list .cf-company-button-list .cf-company-button-list-box a {
        float: left
    }
}

.cf-company-detail-wrapper-box .cf-company-detail {
    padding: 5px
}

.cf-company-detail-wrapper-box .cf-company-detail-header-block {
    width: 100%;
    float: left
}

@media only screen and (min-width: 768px) {
    .cf-company-detail-wrapper-box .cf-company-detail-header-block {
        display: flex;
        align-items: center;
        justify-content: space-between
    }
}

@media only screen and (max-width: 767px) {
    .cf-company-detail-wrapper-box .cf-company-detail-header-block .cf-company-button-icon {
        left: 0;
        position: absolute;
        bottom: 0;
        margin-left: 0
    }
}

.cf-company-detail-wrapper-box .cf-company-detail-header-block .cf-company-icon {
    margin-bottom: 0
}

.cf-company-detail-wrapper-box .cf-company-detail-header-block .cf-company-icon .cf-icon {
    margin-right: 5px;
    min-width: 75px;
    margin-bottom: 7px;
    margin-top: 6px
}

.cf-company-detail-wrapper-box .cf-company-detail-header-block .cf-company-button-show {
    margin: 0px 0px 5px 5px;
    float: right
}

.cf-company-detail-wrapper-box .cf-company-detail-header-block .cf-company-button-show img {
    float: right;
    padding: 0px 3px 0px 0px;
    width: 34px;
    height: auto
}

.cf-company-detail-wrapper-box .cf-company-detail-header-block .cf-company-button-icon {
    width: 120px;
    display: flex;
    justify-content: flex-end;
    float: left;
    margin-bottom: 0
}

@media only screen and (max-width: 767px) {
    .cf-company-detail-wrapper-box .cf-company-detail-header-block .cf-company-button-icon {
        justify-content: flex-start
    }
}

.cf-company-detail-wrapper-box .cf-company-detail-header-block .cf-company-button-icon a {
    margin-right: 10px
}

.cf-company-detail-wrapper-box .cf-company-detail-header-block .cf-company-button-icon a:last-child {
    margin-right: 0
}

.cf-company-detail-wrapper-box .cf-company-detail-bottom-block {
    width: 100%;
    float: left
}

@media only screen and (min-width: 768px) {
    .cf-company-detail-wrapper-box .cf-company-detail-bottom-block {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0 2px 0
    }
}

@media only screen and (max-width: 767px) {
    .cf-company-detail-wrapper-box .cf-company-detail-bottom-block .cf-company-button-show {
        margin-top: 10px;
        width: 50%;
        float: right
    }
}

.cf-company-detail-wrapper-box .cf-company-detail-bottom-block .company-info-title {
    display: flex;
    align-items: center
}

@media only screen and (min-width: 768px) {
    .cf-company-detail-wrapper-box .cf-company-detail-bottom-block .company-info-title {
        width: calc(100% - 120px)
    }
}

@media only screen and (max-width: 767px) {
    .cf-company-detail-wrapper-box .cf-company-detail-bottom-block .company-info-title {
        width: 100%
    }
}

.cf-company-detail-wrapper-box .cf-company-detail-bottom-block .company-info-title .company-info-logo {
    margin-left: 10px;
    width: 40px
}

.cf-company-detail-wrapper-box .cf-company-detail-bottom-block .company-info-title .company-info-name {
    word-break: break-word;
    width: 100%;
    margin-right: 5px
}

.cf-company-detail-wrapper-box .cf-company-detail-bottom-block .company-info-title .cf-company-button-show {
    min-height: 40px
}

.cf-company-detail-wrapper-box .cf-company-detail-bottom-block .company-info-title .company-info-type {
    margin-bottom: 0;
    text-align: left
}

.cf-company-detail-wrapper-box .cf-company-detail-bottom-block .button {
    width: 120px;
    margin-left: auto
}

.cf-company-detail-wrapper-box .cf-company-detail-bottom-block .button span {
    padding-left: 0;
    line-height: 26px;
    right: 3px
}

.cf-company-detail-wrapper-box .cf-company-detail-bottom-block .button span::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    vertical-align: middle
}

.cf-company-detail-wrapper-box .cf-company-detail-bottom-block .cf-company-tag {
    float: left;
    display: flex
}

.cf-company-detail-wrapper-box .cf-company-detail-bottom-block .cf-company-tag .button {
    width: 120px;
    float: left;
    margin-left: 5px
}

@media only screen and (max-width: 480px) {
    .cf-company-detail-wrapper-box .cf-company-detail-bottom-block .cf-company-tag .button {
        width: 90px;
        margin: 0 0 5px
    }
}

@media only screen and (max-width: 319px) {
    .cf-company-detail-wrapper-box .cf-company-detail-bottom-block .cf-company-tag .button {
        width: 80px
    }
}

.cf-company-detail-wrapper-box .cf-company-detail-bottom-block .cf-company-tag .button-company {
    background-color: #77bf81
}

.cf-company-detail-wrapper-box .cf-company-detail-bottom-block .cf-company-tag .icon::before {
    display: none
}

.cf-company-detail-wrapper-box .cf-company-job-detail-top {
    width: 100%;
    float: left;
    margin-left: 0 !important
}

@media only screen and (max-width: 767px) {
    .cf-company-detail-wrapper-box .cf-company-job-detail-top .cf-company-icon {
        margin-bottom: 5px
    }
}

.cf-company-detail-wrapper-box .cf-company-job-detail-bottom {
    width: 100%;
    float: left
}

@media only screen and (min-width: 768px) {
    .cf-company-detail-wrapper-box .cf-company-job-detail-bottom {
        display: flex;
        align-items: center;
        justify-content: space-between
    }
}

.cf-company-detail-wrapper-box .cf-company-job-detail-bottom .cf-company-button-list {
    display: block
}

.cf-company-detail-wrapper-box .cf-company-job-detail-bottom .cf-company-button-list>div {
    width: 120px;
    display: flex
}

@media only screen and (min-width: 768px) {
    .cf-company-detail-wrapper-box .cf-company-job-detail-bottom .cf-company-button-list>div {
        justify-content: flex-end
    }
}

@media only screen and (max-width: 767px) {
    .cf-company-detail-wrapper-box .cf-company-job-detail-bottom .cf-company-button-list>div {
        justify-content: flex-start
    }
}

@media only screen and (min-width: 768px) {
    .cf-company-detail-wrapper-box .cf-company-job-detail-bottom .cf-job-name-box {
        width: calc(100% - 260px)
    }
}

.cf-company-detail-wrapper-box .cf-company-job-detail-bottom .cf-job-name-box .cf-job-name {
    text-align: left;
    width: 100%;
    padding: 0;
    margin-left: 10px;
    word-break: break-word
}

.cf-company-detail-wrapper-box .cf-company-job-detail-bottom .cf-company-detail-button {
    display: flex;
    justify-content: space-between
}

@media only screen and (min-width: 768px) {
    .cf-company-detail-wrapper-box .cf-company-job-detail-bottom .cf-company-detail-button {
        width: 250px
    }
}

@media only screen and (max-width: 767px) {
    .cf-company-detail-wrapper-box .cf-company-job-detail-bottom .cf-company-detail-button {
        margin-top: 10px
    }
}

.company-filter-list-wrapper .search-company-filter-wrap {
    padding-left: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important
}

.company-filter-list-wrapper .search-company-filter-wrap .search-container-box {
    border-left: 1px solid rgba(221, 221, 221, 0.49);
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 10px
}

.company-filter-list-wrapper .search-box {
    padding: 15px;
    background-color: #F2F2F2;
    border-radius: 0
}

.company-filter-list-wrapper .search-box .search-container {
    background-color: #ffffff;
    border-bottom: 0;
    margin-bottom: 10px;
    padding-left: 10px;
    padding-right: 10px;
    border-radius: 5px
}

.company-filter-list-wrapper .search-box .search-container .search-title {
    color: #000
}

.company-filter-list-wrapper .search-box .search-init {
    background-color: #ffffff;
    padding: 10px;
    border-radius: 5px
}

.search-company-filter {
    display: flex
}

.search-company-filter .search-container-wrap {
    width: calc(100% - 200px);
    display: flex
}

.search-company-filter .search-container-wrap .search-condition a {
    cursor: pointer;
    padding: 2px 3px
}

.search-company-filter .search-container-wrap .search-condition a.active {
    font-weight: bold;
    position: relative
}

.search-company-filter .search-container-wrap .search-condition a.active:before {
    content: "";
    position: absolute;
    visibility: visible;
    width: 100%;
    height: 2px;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 99;
    background-color: #3A50C9
}

.search-company-filter .search-container-wrap .search-condition .custom-search-tag a.active:before {
    position: relative
}

.search-company-filter .show-search-form {
    width: 250px
}

.search-company-filter .custom-search-container-wrap {
    width: 100%
}

.search-init-wrap {
    display: flex
}

.search-init-wrap .search-condition-set {
    margin-left: 15px !important
}

.search-init-wrap .search-condition-set:hover .material-icons {
    color: #fff
}

.search-init-wrap .button {
    cursor: pointer
}

.search-init-wrap .search-condition-clear {
    background-color: #6A6B6D
}

.search-init-wrap .search-condition-clear:before {
    background-color: #9A9B9D
}

.search-init-wrap .ml-15 {
    margin-left: 15px !important
}

.page-cf-create .cf-info {
    border: 1px solid #d8d8d8
}

.page-cf-create .cf-info .cf-info-wrapper {
    padding: 0px 0px
}

.page-cf-create .cf-info .cf-info-image {
    float: left;
    position: relative;
    width: 280px;
    height: 200px
}

.page-cf-create .cf-info .cf-title-image {
    text-align: center;
    width: 276;
    height: 50px;
    line-height: 50px
}

.page-cf-create .cf-info .cf-title-image span {
    color: #a39b9b
}

.page-cf-create .language-info {
    border: 1px solid #d8d8d8;
    padding: 10px 20px;
    background-color: #e8f1f7;
    display: flex;
    display: -webkit-flex;
    -webkit-align-items: center;
    align-items: center;
    height: 50px
}

.page-cf-create .language-info .language-info-title p {
    margin-bottom: 0px
}

.page-cf-create .language-info .language-info-logo i {
    font-size: 36px;
    line-height: 50px
}

.cf-detail p {
    font-size: 1.4rem
}

.cf-detail .cf-custom-content-02 {
    margin: 5px 0px
}

.cf-detail-contents {
    margin-top: 30px
}

.cf-detail-apply .button {
    margin: 60px auto;
    width: 360px;
    height: 42px;
    font-size: 1.4rem;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s
}

.cf-detail-apply .button:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.cf-detail-apply .button:hover,
.cf-detail-apply .button:focus,
.cf-detail-apply .button:active {
    color: #fff
}

.cf-detail-apply .button::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -159px;
    left: 0px;
    border-radius: 100%;
    background-color: #3a50c9;
    width: 360px;
    height: 360px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

@media only screen and (max-width: 599px) {
    .cf-detail-apply .button {
        max-width: 100%
    }
}

.cf-detail-apply-float {
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    position: fixed;
    width: 100%;
    bottom: 0px;
    padding: 10px 0;
    background-color: rgba(0, 0, 0, 0.3);
    z-index: 10
}

@media only screen and (max-width: 599px) {
    .cf-detail-apply-float {
        padding: 25px 0
    }
}

@media only screen and (max-width: 599px) {
    .cf-detail-apply-float {
        padding: 10px
    }
}

.cf-detail-apply-float .button {
    margin: 0 auto;
    width: 480px;
    height: 48px;
    font-size: 1.4rem;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s
}

.cf-detail-apply-float .button:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.cf-detail-apply-float .button:hover,
.cf-detail-apply-float .button:focus,
.cf-detail-apply-float .button:active {
    color: #fff
}

.cf-detail-apply-float .button::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -216px;
    left: 0px;
    border-radius: 100%;
    background-color: #3a50c9;
    width: 480px;
    height: 480px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

@media only screen and (max-width: 1022px) {
    .cf-detail-apply-float .button {
        width: 360px;
        height: 42px
    }
}

@media only screen and (max-width: 599px) {
    .cf-detail-apply-float .button {
        max-width: 100%
    }
}

.cf-ad-banner+.cf-detail-mainimage {
    margin-top: 20px
}

.cf-ad-banner img {
    max-width: 100%
}

@media only screen and (max-width: 1022px) {
    .cf-ad-banner img {
        width: 100%;
        height: auto
    }
}

.cf-detail-mainimage {
    margin-bottom: 20px
}

.cf-detail-mainimage img {
    width: auto;
    height: auto
}

@media only screen and (max-width: 1022px) {
    .cf-detail-mainimage img {
        width: 100%;
        height: auto
    }
}

.cf-detail-box {
    border: 3px solid #d8d8d8;
    padding: 16px 20px;
    margin: 20px 0
}

@media only screen and (max-width: 599px) {
    .cf-detail-box {
        padding: 15px 10px
    }
}

.cf-detail-box h2 {
    margin: 0 0 14px 0;
    font-size: 1.8rem;
    line-height: 1.5;
    border-left: 4px solid #d8d8d8;
    padding-left: 10px
}

.cf-detail-box p {
    margin: 0;
    font-size: 1.4rem
}

@media only screen and (max-width: 599px) {
    .cf-detail-box p.cf-detail-info-url {
        word-break: break-all
    }
}

.cf-detail-box ul {
    margin-left: 30px
}

@media only screen and (max-width: 599px) {
    .cf-detail-box ul {
        margin-left: 25px
    }
}

.cf-detail-box ul li {
    margin-bottom: 14px
}

.cf-detail-schedule {
    *zoom: 1
}

.cf-detail-schedule:before,
.cf-detail-schedule:after {
    content: " ";
    display: table
}

.cf-detail-schedule:after {
    clear: both
}

.cf-detail-schedule .cf-detail-schedule-box {
    width: 50%;
    float: left;
    padding-left: 20px;
    box-sizing: border-box
}

@media only screen and (max-width: 1022px) {
    .cf-detail-schedule .cf-detail-schedule-box {
        width: 100%;
        float: none
    }
}

@media only screen and (max-width: 599px) {
    .cf-detail-schedule .cf-detail-schedule-box {
        padding-left: 0
    }
}

.cf-detail-schedule h3 {
    font-size: 1.6rem;
    color: #3a50c9
}

.cf-detail-schedule .grid-information {
    padding-left: 20px
}

@media only screen and (max-width: 599px) {
    .cf-detail-schedule .grid-information {
        padding-left: 15px
    }
}

.cf-detail-schedule .grid-information dt {
    width: 4em;
    font-size: 1.4rem
}

.cf-detail-schedule .grid-information dd {
    width: calc(100% - 4em);
    font-size: 1.4rem
}

.cf-detail-info p {
    position: relative;
    padding-left: 36px;
    margin: 0 0 14px 14px
}

@media only screen and (max-width: 599px) {
    .cf-detail-info p {
        margin-left: 0
    }
}

.cf-detail-info p strong {
    font-size: 2.0rem;
    font-weight: normal;
    margin: 0 2px
}

.cf-detail-info p::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    position: absolute;
    top: -2px;
    left: 0px;
    font-size: 2.6rem;
    color: #9A9B9D
}

@media only screen and (max-width: 599px) {
    .cf-detail-info p::before {
        font-size: 2rem
    }
}

.cf-detail-info .cf-detail-info-date {
    margin-bottom: 4px
}

.cf-detail-info .cf-detail-info-date::before {
    top: 3px;
    content: "event_note"
}

@media only screen and (max-width: 599px) {
    .cf-detail-info .cf-detail-info-date::before {
        top: 10px
    }
}

.cf-detail-info .cf-detail-info-place::before {
    content: "place"
}

@media only screen and (max-width: 599px) {
    .cf-detail-info .cf-detail-info-place::before {
        top: 5px
    }
}

.cf-detail-info .cf-detail-info-tel::before {
    content: "call"
}

@media only screen and (max-width: 599px) {
    .cf-detail-info .cf-detail-info-tel::before {
        top: 3px
    }
}

.cf-detail-info .cf-detail-info-url {
    margin-bottom: 0
}

.cf-detail-info .cf-detail-info-url::before {
    content: "public"
}

@media only screen and (max-width: 599px) {
    .cf-detail-info .cf-detail-info-url::before {
        top: 3px
    }
}

.cf-others {
    margin-top: 20px
}

.cf-others .sidemenu-title {
    position: relative
}

.cf-others .other-cf-status {
    position: absolute;
    right: 0px;
    background-color: #e67e22;
    color: #fff;
    font-size: 1.2rem;
    padding: 5px
}

.cf-others .other-cf-registered {
    position: absolute;
    right: 0px;
    background-color: #3A50C9;
    color: #fff;
    font-size: 1.2rem;
    padding: 5px
}

.cf-others .other-cf-image {
    position: relative;
    background: url(/assets/img-cf-01-6512adbb660e4900b76d2fb989535b778e0b2343e7673c4c4f6fcd35f9bdadf2.jpg) center center no-repeat;
    height: 120px;
    background-size: cover
}

.cf-others .other-cf-title {
    position: absolute;
    bottom: 0px;
    padding: 5px 10px;
    color: #fff;
    background: -moz-linear-gradient(top, transparent 0%, rgba(0, 0, 0, 0.2) 100%);
    background: -webkit-linear-gradient(top, transparent 0%, rgba(0, 0, 0, 0.2) 100%);
    background: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.2) 100%)
}

.cf-others.sidebar-banner-img .other-cf-box {
    margin-bottom: 20px;
    float: left;
    width: 100%;
    border: 2px solid #89bdea
}

.cf-others.sidebar-banner-img .other-cf-title {
    position: relative;
    color: #000
}

.cf-menu-mobile {
    display: none;
    position: relative;
    margin: 20px 0
}

.cf-menu-mobile::after {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    content: "arrow_drop_down";
    position: absolute;
    top: 2px;
    right: 0;
    font-size: 2.6rem;
    color: #6A6B6D;
    z-index: 0
}

@media screen and (-ms-high-contrast: active),
(-ms-high-contrast: none) {
    .cf-menu-mobile::after {
        display: none
    }
}

.cf-menu-mobile select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 100%;
    border: 1px solid #d8d8d8;
    font-size: 1.4rem;
    padding: 4px 24px 4px 20px
}

@media only screen and (max-width: 599px) {
    .cf-menu-mobile {
        display: block
    }
}

.page-desired-conditional-job-list .company-data dl {
    margin-top: 0
}

.page-desired-conditional-job-list .company-data dt {
    padding: 15px;
    width: 198px
}

.page-desired-conditional-job-list .company-data dd {
    padding: 15px;
    width: calc(100% - 198px)
}

.page-desired-conditional-job-list .cf-desired-job-list .search-results {
    line-height: 30px;
    float: left
}

.print-name-badge-page h1 {
    font-seight: bold
}

@media only screen and (max-width: 767px) {
    .print-name-badge-page {
        padding-left: 15px;
        padding-right: 15px
    }
}

.print-name-badge-page .name-badge-app {
    margin: 0px auto;
    text-align: left;
    margin-top: 10px
}

.print-name-badge-page .name-badge-app .name-badge-app-download {
    font-weight: normal;
    font-size: 1.2em
}

.print-name-badge-page .name-badges-right .web-entrance {
    margin-top: 20px
}

.print-name-badge-page img {
    max-width: 100%
}

.print-name-badge-page .barcode {
    max-width: 300px;
    height: 42px
}

@media print {
    .print-name-badge-page .top-wrapper {
        width: 100%;
        padding: 0
    }
}

.print-name-badge-page #print-view {
    width: auto
}

#print-view {
    width: 498.897637795pt;
    margin: 25pt auto;
    padding: 30px 0 0;
    *zoom: 1
}

#print-view:before,
#print-view:after {
    content: " ";
    display: table
}

#print-view:after {
    clear: both
}

.badge-info {
    border: 1px dashed #000;
    padding: 10px 15px 15px;
    font-size: 1.6rem
}

.badge-info .code-fix-h {
    height: 52px
}

.have-scissor {
    position: relative
}

.have-scissor .scissor {
    width: 20px;
    height: 15px;
    overflow: hidden;
    position: absolute;
    top: -16px;
    left: 5px;
    z-index: -1
}

.have-scissor .scissor img {
    width: 100%
}

.badge-info-header {
    margin: 0 0 30px
}

.badge-info-header>span {
    -webkit-print-color-adjust: exact;
    color: #d8d8d8 !important;
    font-size: 1rem
}

.event-logo {
    margin-top: 4px;
    width: 50%
}

.badge-date {
    float: right;
    text-align: right;
    width: 50%
}

.badge-date li {
    display: inline-block;
    vertical-align: middle;
    border: 1px dashed #000;
    border-radius: 50%;
    width: 46px;
    height: 46px;
    line-height: 42px;
    text-align: center;
    font-size: 1.6rem;
    margin: 0 0 2px 2px;
    color: #000
}

.badge-info-content {
    margin: 0 0 30px;
    font-size: 1.4rem
}

.badge-info-content ul {
    list-style: none;
    line-height: 1.3
}

.badge-info-content li {
    color: #000
}

.badge-info-content .ticket-name {
    font-size: 1.6rem
}

.badge-info-content .barcode {
    height: 45px
}

.badge-box>.row {
    align-items: center;
    margin-left: -10px;
    margin-right: -10px
}

.badge-box>.row>[class*="col"] {
    padding-left: 10px;
    padding-right: 10px
}

#button-print-name-badge .button-print {
    width: 280px;
    height: 38px;
    font-size: 2.1rem;
    margin: 0 auto 10px
}

#button-print-name-badge .button-print:focus:before,
#button-print-name-badge .button-print:active:before,
#button-print-name-badge .button-print:hover:before {
    display: block !important;
    width: 280px
}

.badge-note {
    font-size: 1.4rem;
    border: 1px solid #d03a1c;
    padding: 8px 12px;
    position: relative;
    color: #000
}

.badge-note:before {
    content: "";
    display: block;
    position: absolute;
    left: 2px;
    top: 2px;
    right: 2px;
    bottom: 2px;
    border: 1px solid #d03a1c
}

.ticket-box {
    margin: 75pt 0 10pt;
    width: 71%;
    float: right;
    min-height: 340px
}

.ticket-box .code-fix-h {
    height: 52px
}

.ticket-box .text-note {
    display: none;
    position: absolute;
    left: -90px;
    width: 15px;
    top: 50%;
    line-height: 1.1;
    transform: translateY(-50%);
    font-size: 1.2rem
}

.ticket-box .text-note:before {
    content: '';
    position: absolute;
    border-style: solid;
    border-width: 10px 0 10px 10px;
    border-color: transparent #2A2B2D;
    display: block;
    width: 0;
    z-index: 1;
    right: -20px;
    top: 50%;
    transform: translateY(-50%)
}

.ticket-box .text-note-en {
    width: 55px
}

.ticket-box .scissor {
    display: none
}

.ticket-box ul {
    list-style: none
}

.ticket-box .item {
    border: 1px dashed #000;
    margin-top: -1px;
    padding: 10px 15px 13px
}

.ticket-box .item~.scissor,
.ticket-box .item~.text-note {
    display: block
}

.ticket-info {
    text-align: center;
    font-weight: bold;
    font-size: 1.8rem
}

.ticket-info li {
    margin: 0 0 1px
}

.ticket-info .date {
    font-size: 1.7rem
}

.ticket-info .barcode {
    margin-top: 7px;
    height: 45px
}

.ticket-header {
    margin: 0 0 14px
}

.ticket-header .ticket-logo {
    max-width: 250px;
    display: inline-block
}

.ticket-header .ticket-day {
    border: 1px solid #000;
    display: inline-block;
    margin-left: auto;
    color: #000;
    padding: 2px 12px;
    font-size: 1.4rem;
    font-weight: bold;
    position: relative;
    float: right;
    margin-top: 4px
}

.ticket-header .ticket-day:before {
    content: "";
    display: block;
    position: absolute;
    left: 2px;
    top: 2px;
    right: 2px;
    bottom: 2px;
    border: 1px solid #000
}

.name-badges-left {
    float: left;
    padding-right: 10px
}

.name-badges-left .print-wapper {
    width: 280px;
    margin: 0 auto
}

.name-badges-left .name-bage-box {
    float: none;
    margin-right: auto;
    margin-left: auto;
    margin-top: 20px;
    width: 75%
}

.name-badges-right {
    float: left
}

@media only screen and (min-width: 1241px) {
    .name-badges-left {
        width: 50%
    }

    .name-badges-right {
        width: 100%
    }
}

@media only screen and (max-width: 1240px) {
    .name-badges-left {
        width: auto;
        border-right: 0
    }

    .name-badges-right {
        width: auto
    }
}

@media print {
    .name-badges-left {
        border-right: 0;
        width: 100% !important
    }
}

.inquiry-fluid-form .register-row .md-textfield,
.inquiry-fluid-form .register-row .md-select,
.inquiry-fluid-form .register-row .md-switch,
.inquiry-fluid-form .register-row .md-textarea {
    width: 100%;
    max-width: 850px
}

@media only screen and (max-width: 767px) {
    .inquiry-fluid-form .register-row .md-textarea {
        padding-right: 30px
    }
}

.inquiry-fluid-form .register-next {
    padding: 30px
}

@media only screen and (max-width: 991px) {
    .inquiry-fluid-form .register-next {
        padding: 15px
    }
}

@media only screen and (max-width: 767px) {
    .inquiry-fluid-form .register-next {
        padding: 15px 40px 15px 0
    }
}

.inquiry-fluid-form .register-next>.btn-confirm {
    margin: 0 10px 0 0
}

.inquiry-fluid-form .register-next .button {
    margin-left: 0%
}

.inquiry-confirm-form .break-word {
    padding: 0 50px;
    margin-top: 5px
}

@media only screen and (max-width: 991px) {
    .inquiry-confirm-form .break-word {
        padding: 0 35px
    }
}

.inquiry-confirm-form .content {
    margin-bottom: 30px
}

.inquiry-confirm-form .resume-view .survey-preview-heading {
    font-size: 11pt;
    font-weight: bold;
    margin-top: 3mm;
    color: black;
    margin-left: 20px;
    margin-right: 20px
}

.inquiry-confirm-form .detail {
    padding-top: 15px
}

.inquiry-confirm-form .bottom-line-normal {
    border-bottom: 1px solid #89ABE3;
    padding: 5px;
    margin: 0 10px
}

.buttons-confirm-preview {
    display: flex;
    justify-content: flex-start
}

.buttons-confirm-preview .button {
    margin-left: 0%;
    text-align: center
}

@media only screen and (max-width: 767px) {
    .buttons-confirm-preview .button {
        width: 150px;
        margin: 0 2px
    }
}

.buttons-confirm-preview .preview-btn {
    margin-right: 30px
}

@media only screen and (max-width: 991px) {
    .buttons-confirm-preview .preview-btn {
        margin-left: 0%;
        padding: 15px 0
    }
}

@media only screen and (max-width: 767px) {
    .buttons-confirm-preview .preview-btn {
        margin-left: 0%;
        width: 150px;
        padding: 15px 0;
        margin-right: 4px
    }
}

.buttons-confirm-preview .preview-btn>a {
    margin-right: 10px
}

@media only screen and (max-width: 767px) {
    .buttons-confirm-preview {
        justify-content: space-evenly
    }
}

.bottom-line {
    border-bottom: 4px solid #89abe3
}

.page-liked-company-list .contents {
    width: 100%;
    padding-top: 1rem
}

.error-page .top-wrapper {
    padding: 0
}

.mgr-error-page .mgr-contents-body {
    display: flex;
    align-items: center;
    justify-content: center
}

.mgr-error-page .page-eror-item .error-content span {
    color: #4d5d70
}

.mgr-error-page .page-eror-item .error-content .button {
    background: #db1e2a;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s
}

.mgr-error-page .page-eror-item .error-content .button:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.mgr-error-page .page-eror-item .error-content .button:hover,
.mgr-error-page .page-eror-item .error-content .button:focus,
.mgr-error-page .page-eror-item .error-content .button:active {
    color: #fff
}

.mgr-error-page .page-eror-item .error-content .button::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -75px;
    left: 0px;
    border-radius: 100%;
    background-color: #f22c39;
    width: 180px;
    height: 180px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

.page-eror-item {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 30px 0
}

@media only screen and (max-width: 767px) {
    .page-eror-item {
        flex-wrap: wrap
    }
}

.page-eror-item .error-thumb {
    padding: 0 70px;
    border-right: 1px solid #dee8eb
}

@media only screen and (max-width: 1240px) {
    .page-eror-item .error-thumb {
        width: 300px;
        padding: 0 30px
    }
}

@media only screen and (max-width: 767px) {
    .page-eror-item .error-thumb {
        border-right: 0;
        border-bottom: 1px solid #dee8eb;
        padding: 20px 10px;
        margin-top: auto;
        max-width: 50%
    }
}

.page-eror-item .error-thumb img {
    max-width: 100%
}

.page-eror-item .error-content {
    padding: 0 70px
}

@media only screen and (max-width: 1240px) {
    .page-eror-item .error-content {
        padding: 0 30px
    }
}

@media only screen and (max-width: 767px) {
    .page-eror-item .error-content {
        text-align: center;
        width: 100%;
        padding: 20px 10px;
        margin-bottom: auto
    }
}

.page-eror-item .error-content span {
    color: #8aace6;
    font-size: 4rem;
    display: block;
    margin: 0 0 30px
}

@media only screen and (max-width: 1240px) {
    .page-eror-item .error-content span {
        font-size: 2.8rem;
        margin: 0 0 15px
    }
}

@media only screen and (max-width: 767px) {
    .page-eror-item .error-content span {
        font-size: 2.1rem;
        margin: 0 0 10px
    }
}

.page-eror-item .error-content .button {
    background: #3b55cd;
    width: 265px;
    height: 40px;
    font-size: 1.6rem;
    margin: 0 auto
}

@media only screen and (max-width: 767px) {
    .page-eror-item .error-content .button {
        width: 180px;
        height: 30px;
        font-size: 1.2rem
    }
}

video {
    display: block;
    max-width: 100%;
    height: auto
}

.modal-body video {
    max-height: 480px
}

.upload-video {
    height: 100%;
    position: relative
}

.upload-video .video-upload-notice {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    text-align: center;
    padding: 5px
}

.upload-video .open-upload-video-modal {
    display: flex;
    align-items: center;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    justify-content: center;
    margin: 0;
    color: #fff
}

.upload-video .open-upload-video-modal:focus,
.upload-video .open-upload-video-modal:active {
    outline: 0;
    text-decoration: none
}

@media only screen and (max-width: 599px) {
    .upload-video .open-upload-video-modal {
        height: 80px;
        position: static
    }
}

.upload-video .video-file-field {
    position: absolute;
    top: 0;
    left: 0;
    width: 20%;
    height: 100%;
    opacity: 0;
    cursor: pointer
}

.upload-video span.video-title {
    width: auto;
    margin-left: 15px
}

.upload-video span.video-name {
    margin-left: 30px;
    border-bottom: 1px solid orange;
    padding-bottom: 5px;
    color: black;
    width: calc(100% - 100px);
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden
}

.upload-video span.video-notice {
    display: flex;
    align-items: center;
    color: #3A50C9;
    white-space: nowrap
}

.upload-video span.video-notice .material-icons {
    font-size: 20px
}

.carousel-inner {
    margin: 0 0 30px;
    border: 1px solid #d8d8d8
}

.carousel-inner .result-box {
    margin: 0;
    border: 0
}

.carousel-inner .result-box-content {
    padding: 15px 60px
}

.carousel-control {
    display: flex;
    align-items: center;
    justify-content: center
}

.carousel-control.left,
.carousel-control.right {
    background: none;
    width: 40px;
    height: 40px;
    border-radius: 100%;
    background: #2E363F;
    top: 50%;
    bottom: auto;
    transform: translateY(-50%)
}

.carousel-control.left.left,
.carousel-control.right.left {
    left: 10px
}

.carousel-control.left.right,
.carousel-control.right.right {
    left: auto;
    right: 10px
}

.carousel-control.left:focus,
.carousel-control.left:active,
.carousel-control.left:hover,
.carousel-control.right:focus,
.carousel-control.right:active,
.carousel-control.right:hover {
    text-shadow: none
}

@media only screen and (max-width: 599px) {
    .has-video-thumb {
        min-height: 175px;
        text-indent: -9999px
    }
}

.label-describe-upload-video {
    white-space: pre-line;
    float: left;
    width: 100%;
    background-color: #d2def2
}

.label-describe-upload-video span {
    color: #000;
    padding: 10px;
    float: left
}

.label-describe-upload-video .label-describe-upload-hdr-video {
    color: #d03a1c
}

.user-video-upload-box .label-describe-upload-video {
    margin-bottom: 20px
}

.user-video-title {
    word-break: break-word
}

.cf-overlay {
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.4s;
    transition-duration: 0.4s;
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background-color: #212121;
    opacity: 0;
    z-index: 10;
    visibility: hidden
}

.cf-overlay.is-opened {
    visibility: visible;
    opacity: 0.4
}

.cf-popup-open:focus,
.cf-popup-open:active {
    text-decoration: none;
    outline: 0
}

.lisence-popup:focus,
.lisence-popup:active {
    text-decoration: none;
    outline: 0
}

.cf-popup {
    transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
    position: absolute;
    left: 10%;
    top: 0;
    width: 80%;
    max-height: 90%;
    overflow: visible;
    border-radius: 4px;
    background-color: #fff;
    z-index: 11;
    visibility: hidden;
    opacity: 0;
    transform: scale(0.2, 0.2)
}

.cf-popup.is-opened {
    visibility: visible;
    opacity: 1;
    transform: scale(1, 1)
}

.cf-popup.comfirmation-alert {
    min-width: 350px;
    width: 20%;
    left: 40%;
    overflow: hidden;
    border-radius: 0
}

.cf-popup-title {
    position: fixed;
    width: 100%;
    top: 0px;
    left: 0px;
    height: 50px;
    color: rgba(255, 255, 255, 0.9);
    background-color: #3A50C9;
    line-height: 50px;
    padding-left: 20px;
    font-size: 1.6rem;
    box-sizing: border-box
}

@media screen and (-ms-high-contrast: active),
(-ms-high-contrast: none) {
    .cf-popup-title {
        position: absolute
    }
}

.cf-popup-close {
    position: absolute;
    right: 12px;
    top: 10px;
    display: block;
    font-family: 'Material Icons';
    color: rgba(255, 255, 255, 0.9);
    line-height: 1;
    font-size: 2.0rem;
    padding: 6px;
    white-space: nowrap;
    direction: ltr;
    font-feature-settings: 'liga'
}

.cf-popup-close:hover {
    color: rgba(255, 255, 255, 0.9)
}

.cf-popup-contents {
    padding: 80px 30px 30px 30px
}

.cf-popup-form-box {
    padding: 0 20px;
    border: 1px solid #d8d8d8
}

.cf-popup-form-box .form-box-title {
    font-weight: bold;
    height: 25px;
    margin-top: 5px
}

.cf-popup-form-container {
    *zoom: 1;
    padding: 20px 10px;
    border-top: 1px solid #d8d8d8
}

.cf-popup-form-container:before,
.cf-popup-form-container:after {
    content: " ";
    display: table
}

.cf-popup-form-container:after {
    clear: both
}

.cf-popup-form-container:first-child {
    border: none
}

.cf-popup-form-container .md-textfield {
    margin: 0
}

.cf-popup-form-container .md-textfield.is-ng .md-input-message-animation {
    position: absolute;
    bottom: -20px;
    left: 0
}

.cf-popup-form-button {
    margin: 20px 0 0 auto;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: flex-end;
    justify-content: flex-end
}

.cf-popup-form-button .button {
    height: 30px;
    margin-left: 20px
}

@media only screen and (max-width: 480px) {
    .cf-popup-form-button .button {
        margin-left: 10px;
        font-size: 1rem
    }
}

.cf-popup-form-button .button:first-child {
    margin: 0
}

.cf-popup-form-button .button-clear {
    background-color: #9A9B9D;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s
}

.cf-popup-form-button .button-clear:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.cf-popup-form-button .button-clear:hover,
.cf-popup-form-button .button-clear:focus,
.cf-popup-form-button .button-clear:active {
    color: #fff
}

.cf-popup-form-button .button-clear::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -75px;
    left: 0px;
    border-radius: 100%;
    background-color: #d8d8d8;
    width: 180px;
    height: 180px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

.cf-popup-form-button .button-delete {
    background-color: #9A9B9D
}

.cf-popup-form-button .button-delete:hover {
    color: #fff
}

.cf-popup-form-button .button-register {
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s
}

.cf-popup-form-button .button-register:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.cf-popup-form-button .button-register:hover,
.cf-popup-form-button .button-register:focus,
.cf-popup-form-button .button-register:active {
    color: #fff
}

.cf-popup-form-button .button-register::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -75px;
    left: 0px;
    border-radius: 100%;
    background-color: #3a50c9;
    width: 180px;
    height: 180px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

.cf-popup-form-title {
    width: 160px;
    float: left;
    line-height: 28px;
    color: #6A6B6D
}

.cf-title {
    width: 70px;
    float: left;
    line-height: 28px;
    color: #000
}

.cf-popup-form-condition {
    float: left
}

.cf-popup-form-condition .md-checkbox {
    display: inline-block;
    margin-right: 30px
}

.cf-popup-form-condition .md-radio-label {
    margin-right: 20px
}

.cf-popup-form-01 .md-select {
    width: 200px
}

.cf-popup-form-01 .md-textfield {
    display: inline-block;
    width: 240px
}

.cf-popup-candidate-01,
.cf-popup-candidate-03,
.cf-popup-career-01,
.cf-popup-adopted-01,
.cf-popup-wanted-job-01,
.cf-popup-degree-01 {
    height: 200px;
    overflow: scroll
}

.cf-popup-candidate-01 .md-checkbox,
.cf-popup-candidate-03 .md-checkbox,
.cf-popup-career-01 .md-checkbox,
.cf-popup-adopted-01 .md-checkbox,
.cf-popup-wanted-job-01 .md-checkbox,
.cf-popup-degree-01 .md-checkbox {
    margin: 10px 0
}

.cf-popup-candidate-05 {
    height: 120px;
    overflow: scroll;
    margin-bottom: 20px
}

.cf-popup-candidate-05 p {
    font-size: 1.4rem;
    font-weight: bold;
    margin: 10px 0 0 0
}

.cf-popup-candidate-05 .md-checkbox {
    margin: 10px 0
}

.cf-popup-form-selected {
    border: 1px solid #d8d8d8;
    margin-top: 20px;
    padding: 10px 20px;
    background-color: #F5F9FA
}

.cf-popup-register {
    height: 300px;
    overflow: auto
}

.cf-popup-register .md-checkbox {
    margin: 10px 0
}

.cf-popup-register .cf-custom-content-03 ul,
.cf-popup-register .cf-custom-content-03 li {
    font-size: 1.2rem
}

.cf-popup-register .cf-custom-content-03 h2 {
    font-size: 1.2em;
    margin: 0 5px 0 0;
    padding: 0;
    font-weight: bold;
    line-height: normal;
    color: #000;
    background-color: #fff
}

.cf-popup-register .cf-custom-content-03 h3 {
    font-size: 0.95em
}

.cf-popup-register .cf-custom-content-03 h5 {
    font-size: 0.8em;
    font-weight: bold
}

.cf-popup-register .cf-custom-content-03 h4 {
    font-weight: bold;
    font-size: 0.9em
}

.cf-popup-register .cf-custom-content-03 p {
    font-size: 1.2rem;
    line-height: 1.8;
    margin-bottom: 2em;
    text-align: justify
}

.popup-form-box {
    border: 1px solid #d8d8d8;
    margin: 0 0 20px
}

.popup-form-box .form-box-container {
    border-top: 1px solid #d8d8d8;
    *zoom: 1
}

.popup-form-box .form-box-container:before,
.popup-form-box .form-box-container:after {
    content: " ";
    display: table
}

.popup-form-box .form-box-container:after {
    clear: both
}

.popup-form-box .form-box-container:first-child {
    border-top: 0
}

.popup-form-box .form-box-title {
    width: 160px;
    float: left;
    line-height: 26px;
    color: #6A6B6D;
    font-weight: bold;
    padding: 10px 20px
}

.popup-form-box .form-box-title+.form-box-condition {
    width: calc(100% - 160px);
    float: left
}

.popup-form-box .form-box-condition {
    padding: 10px 20px
}

.popup-form-box .form-box-condition.fixed-block {
    height: 200px;
    overflow: scroll
}

.popup-form-box .md-select {
    width: 150px;
    margin: 0 20px
}

.popup-form-box .md-select:first-child {
    margin-left: 0
}

.popup-form-box .md-checkbox.display-inline-block {
    vertical-align: middle
}

.popup-form-box .md-checkbox.display-inline-block .md-checkbox-label {
    margin: 0
}

.user-video .modal.modal-video.fade .modal-dialog {
    max-width: 800px;
    min-width: initial;
    max-height: 600px
}

.user-video .modal.modal-video.fade .modal-dialog .modal-content {
    float: left;
    width: 100%
}

.user-video .modal.modal-video.fade .modal-dialog .modal-body {
    float: left;
    width: 100%;
    padding: 30px 50px 0
}

@media only screen and (max-width: 599px) {
    .user-video .modal.modal-video.fade .modal-dialog .modal-body {
        padding: 30px 20px 0
    }
}

.user-video .modal.modal-video.fade .modal-dialog .modal-body video {
    max-width: 100%;
    max-height: 100%;
    height: auto;
    width: auto;
    object-fit: cover
}

@media only screen and (max-width: 599px) {
    .user-video .modal.modal-video.fade .modal-dialog .modal-body video {
        max-width: 300px;
        max-height: 350px
    }
}

@media only screen and (max-width: 480px) {
    .user-video .modal.modal-video.fade .modal-dialog .modal-body video {
        max-width: 250px;
        max-height: 280px
    }
}

.user-video .modal.modal-video.fade .modal-dialog .modal-footer {
    float: left;
    width: 100%
}

.modal-backdrop {
    background-color: #212121;
    transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
    visibility: hidden;
    opacity: 0
}

.modal-backdrop.in {
    opacity: .4;
    visibility: visible
}

.modal-dialog {
    min-width: 80%
}

@media screen and (-ms-high-contrast: active),
(-ms-high-contrast: none) {
    .modal-dialog {
        margin: 10px
    }
}

.modal.modal-confirm.large .modal-dialog {
    width: 400px
}

.modal.modal-confirm .modal-dialog {
    min-width: initial;
    width: 300px
}

@media only screen and (max-width: 480px) {
    .modal.modal-confirm .cf-popup-form-button {
        display: block;
        text-align: center
    }
}

@media only screen and (max-width: 480px) {
    .modal.modal-confirm .cf-popup-form-button>.button {
        width: 45%;
        display: inline-block;
        margin: 0 2%;
        text-align: center
    }
}

.modal.modal-video.fade .modal-dialog .modal-body {
    max-height: 80vh
}

.modal.fade {
    align-items: center;
    justify-content: center;
    display: flex !important;
    visibility: hidden;
    opacity: 0;
    transition: all 0.4s
}

.modal.fade.in {
    visibility: visible;
    opacity: 1
}

.modal.fade.in:nth-of-type(even) {
    z-index: 1042
}

.modal.fade.in .modal-dialog {
    visibility: visible;
    opacity: 1;
    transform: scale(1, 1) translate(0)
}

.modal.fade .modal-dialog {
    transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
    visibility: hidden;
    opacity: 0;
    transform: scale(0.2, 0.2) translate(0)
}

.modal.fade .modal-dialog .modal-body {
    max-height: 60vh;
    overflow: auto
}

.modal.fade .modal-dialog .modal-body video {
    width: 100%
}

.modal.fade .modal-header {
    color: rgba(255, 255, 255, 0.9);
    background-color: #3A50C9;
    padding: 13px 20px;
    border: 0
}

.modal.fade .modal-header .right-content {
    display: inline-block;
    float: right;
    width: 25%;
    text-align: center;
    font-size: 16px
}

.modal.fade .button.close-modal {
    opacity: 1;
    background-color: #9A9B9D;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s
}

.modal.fade .button.close-modal:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.modal.fade .button.close-modal:hover,
.modal.fade .button.close-modal:focus,
.modal.fade .button.close-modal:active {
    color: #fff
}

.modal.fade .button.close-modal::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -75px;
    left: 0px;
    border-radius: 100%;
    background-color: #d8d8d8;
    width: 180px;
    height: 180px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

.modal.fade button.close {
    opacity: 1;
    font-weight: normal;
    text-shadow: none;
    color: #fff;
    position: absolute;
    right: 12px;
    top: 13px;
    width: 32px;
    height: 32px
}

.modal.fade button.close>span {
    display: block;
    font-family: 'Material Icons';
    color: rgba(255, 255, 255, 0.9);
    line-height: 1;
    font-size: 2.0rem;
    padding: 6px;
    white-space: nowrap;
    direction: ltr;
    font-feature-settings: 'liga'
}

.modal.fade button.close>span:hover {
    color: rgba(255, 255, 255, 0.9)
}

.modal.fade .modal-title {
    font-size: 1.6rem;
    line-height: 1.45;
    margin: 0 25px 0 0
}

.modal.fade .modal-content {
    box-shadow: none;
    border: 0;
    border-radius: 4px;
    margin-left: auto;
    margin-right: auto
}

.modal.fade .modal-body {
    padding: 30px 30px 0
}

.modal.fade .modal-body.job-order-body {
    padding: 15px 50px 0
}

@media only screen and (max-width: 599px) {
    .modal.fade .modal-body {
        padding: 15px 15px 0
    }
}

.modal.fade .modal-footer {
    border: 0;
    margin: 0;
    padding: 0 20px 20px
}

@media only screen and (max-width: 599px) {
    .modal.fade .modal-footer {
        padding: 15px
    }
}

.modal.modal-confirmation .modal-dialog {
    min-width: auto;
    max-width: 300px;
    width: 90%;
    overflow: hidden;
    border-radius: 0
}

.modal.modal-confirmation .modal-dialog p {
    margin-bottom: 5px
}

.modal.appointment-modal .modal-dialog {
    min-width: auto;
    max-width: 500px;
    width: 90%;
    border-radius: 0;
    position: absolute;
    margin: auto;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: inline-table
}

.modal.appointment-modal .modal-content {
    border: none
}

.modal.appointment-modal .modal-header {
    background-color: #3a50c9;
    color: #fff
}

.modal.appointment-modal .modal-header .close {
    color: #fff
}

.modal.appointment-modal .modal-footer .btn-clear {
    color: #fff;
    background-color: #A6A6A6;
    border: none;
    width: 90px;
    height: 30px;
    float: right;
    margin-left: 5px;
    border-radius: 4px;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s
}

.modal.appointment-modal .modal-footer .btn-clear:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.modal.appointment-modal .modal-footer .btn-clear:hover,
.modal.appointment-modal .modal-footer .btn-clear:focus,
.modal.appointment-modal .modal-footer .btn-clear:active {
    color: #fff
}

.modal.appointment-modal .modal-footer .btn-clear::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -30px;
    left: 0px;
    border-radius: 100%;
    background-color: #e2e4e4;
    width: 90px;
    height: 90px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

@media only screen and (max-width: 599px) {
    .modal.appointment-modal .modal-footer .btn-clear {
        padding: 0
    }
}

.modal.appointment-modal .modal-footer .accept-btn {
    color: #fff;
    background-color: #3A50C9;
    border: none;
    width: 90px;
    display: inline-block;
    line-height: 2.4;
    text-align: center;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s
}

.modal.appointment-modal .modal-footer .accept-btn:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.modal.appointment-modal .modal-footer .accept-btn:hover,
.modal.appointment-modal .modal-footer .accept-btn:focus,
.modal.appointment-modal .modal-footer .accept-btn:active {
    color: #fff
}

.modal.appointment-modal .modal-footer .accept-btn::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -30px;
    left: 0px;
    border-radius: 100%;
    background-color: #89ABE3;
    width: 90px;
    height: 90px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

.modal-video-resume.resume-videos .modal-title {
    display: inline-block
}

.modal-video-resume.resume-videos .modal-nav {
    margin-left: 20px;
    display: inline-block
}

.modal-video-resume.resume-videos .modal-nav a {
    color: #fff;
    margin: 0 10px
}

.modal-video-resume.resume-videos .modal-nav a.prev::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    content: "navigate_before";
    vertical-align: middle
}

.modal-video-resume.resume-videos .modal-nav a.next::after {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    content: "navigate_next";
    vertical-align: middle
}

.modal-video-resume.resume-videos .modal-body {
    display: flex;
    padding: 0;
    background-color: #000
}

.modal-video-resume.resume-videos .modal-body .modal-body-video {
    width: 75%;
    max-height: calc(65vh - 70px);
    display: flex;
    flex-direction: column;
    align-items: center;
    box-sizing: border-box;
    padding-top: 20px
}

@media screen and (max-height: 768px) {
    .modal-video-resume.resume-videos .modal-body .modal-body-video {
        padding-top: 10px
    }
}

.modal-video-resume.resume-videos .modal-body .modal-body-video h2 {
    position: absolute;
    top: 0px;
    left: 20px;
    color: #fff;
    margin: 0;
    font-size: 1.6rem;
    padding: 20px 0
}

@media screen and (max-height: 768px) {
    .modal-video-resume.resume-videos .modal-body .modal-body-video h2 {
        padding: 7px 0
    }
}

.modal-video-resume.resume-videos .modal-body .modal-body-video video {
    max-height: 100%;
    height: auto;
    width: auto;
    object-fit: cover;
    max-width: 100%;
    padding-bottom: 20px
}

@media screen and (max-height: 768px) {
    .modal-video-resume.resume-videos .modal-body .modal-body-video video {
        padding-bottom: 10px
    }
}

.modal-video-resume.resume-videos .modal-body .modal-body-thumbnail {
    width: 25%;
    overflow-y: scroll;
    background-color: #1a1a1a
}

.modal-video-resume.resume-videos .modal-body .modal-body-thumbnail p {
    margin: 0
}

.modal-video-resume.resume-videos .modal-body .modal-body-thumbnail img {
    width: 100%;
    height: auto
}

.modal-video-resume.resume-videos .modal-body .modal-body-thumbnail .video-item {
    padding: 10px;
    display: flex;
    align-items: center
}

.modal-video-resume.resume-videos .modal-body .modal-body-thumbnail .video-item a {
    width: 50%
}

.modal-video-resume.resume-videos .modal-body .modal-body-thumbnail .video-item span {
    width: 50%;
    color: white;
    padding: 0 8px;
    text-align: left
}

.modal-video-resume.resume-videos .modal-body .modal-body-thumbnail .video-item span.manager-candidate-video-title {
    word-wrap: break-word
}

.modal-video-resume.resume-videos .modal-body .modal-body-thumbnail .video-item:hover {
    background-color: #525252;
    cursor: pointer
}

.modal-video-resume.resume-videos .modal-body .modal-body-thumbnail .video-item.video-active {
    background-color: #3a3a3a
}

.modal-video-resume.resume-videos .modal-body .modal-body-thumbnail .video-item.video-active:hover {
    background-color: #3a3a3a
}

.modal-video-resume.resume-videos .modal-footer {
    position: absolute;
    bottom: 0;
    background: #fff;
    width: 75%;
    padding: 0 25% 10px;
    left: 0
}

.modal-video-resume.resume-videos .modal-footer .cf-popup-form-button {
    margin-top: 10px
}

.modal-video-resume.resume-videos .modal-content .manager-candidate-video-modal-title {
    word-break: break-word
}

#job_name {
    display: block;
    margin: 0 40px 0 0
}

#resume-video .modal-body {
    overflow-y: hidden
}

#resume-video .modal-body .modal-body-thumbnail {
    max-height: 65vh;
    overflow-y: auto
}

.modal-open .modal.appointment-modal {
    overflow-y: hidden
}

@media only screen and (max-width: 864px) {
    .cf-popup-form-condition.display-mobile-block {
        display: block
    }

    .cf-popup-form-condition.display-mobile-block a,
    .cf-popup-form-condition.display-mobile-block #view-resume-btn {
        margin-bottom: 10px;
        clear: both
    }
}

.language-level-info {
    padding-right: 40px
}

.language-level-info #language-level-modal .modal-dialog {
    min-width: 50%
}

.language-level-info #language-level-modal .modal-body {
    padding: 0 30px 20px 30px;
    white-space: pre-line
}

.language-level-info .register-row {
    text-align: right
}

.add-question-note {
    width: 70%;
    float: left;
    margin: 20px 0 0 auto
}

.register-qa .md-textarea.validate.is-ok::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    color: #fff;
    font-size: 1.6rem;
    text-align: center;
    line-height: 20px;
    content: "done";
    display: block;
    background-color: #DAE5E1;
    width: 20px;
    height: 20px;
    position: absolute;
    border-radius: 20px;
    top: 0px;
    right: 10px;
    right: 4px
}

@media only screen and (max-width: 767px) {
    .register-qa .md-textarea.validate.is-ok::before {
        right: 0
    }
}

.register-qa .md-radio {
    position: relative;
    display: block
}

.register-qa .md-radio.validate {
    padding-right: 30px
}

.register-qa .md-radio.validate.is-ok::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    color: #fff;
    font-size: 1.6rem;
    text-align: center;
    line-height: 20px;
    content: "done";
    display: block;
    background-color: #DAE5E1;
    width: 20px;
    height: 20px;
    position: absolute;
    border-radius: 20px;
    right: -25px;
    top: 0;
    bottom: 0;
    margin: auto
}

.register-qa .md-checkbox {
    position: relative;
    display: block
}

.register-qa .md-checkbox.validate {
    padding-right: 30px
}

.register-qa .md-checkbox.validate.is-ok::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    color: #fff;
    font-size: 1.6rem;
    text-align: center;
    line-height: 20px;
    content: "done";
    display: block;
    background-color: #DAE5E1;
    width: 20px;
    height: 20px;
    position: absolute;
    border-radius: 20px;
    right: -25px;
    top: 0;
    bottom: 0;
    margin: auto
}

.md-textfield {
    position: relative;
    font-size: 1.4rem;
    display: inline-block;
    box-sizing: border-box;
    border-radius: 0px;
    width: 100%;
    margin: 17px 0 7px 0
}

.md-textfield.is-no-label input::-webkit-datetime-edit {
    color: #6A6B6D
}

.md-textfield.is-focused.pr-40:after,
.md-textfield.is-input.pr-40:after {
    right: 40px
}

.md-textfield.is-focused .md-textfield-input,
.md-textfield.is-input .md-textfield-input {
    outline: none
}

.md-textfield.is-focused .md-textfield-label,
.md-textfield.is-input .md-textfield-label {
    z-index: 1;
    top: -20px;
    left: 0px;
    font-size: 1.2rem;
    color: #3a50c9
}

.md-textfield.is-focused::after,
.md-textfield.is-input::after {
    left: 0;
    right: 0
}

.md-textfield.is-focused.required .md-textfield-label,
.md-textfield.is-input.required .md-textfield-label {
    color: #e67e22
}

.md-textfield.is-focused input::-webkit-datetime-edit,
.md-textfield.is-input input::-webkit-datetime-edit {
    color: #6A6B6D
}

.md-textfield::after {
    content: "";
    height: 2px;
    display: block;
    position: absolute;
    bottom: 0px;
    background-color: #3a50c9;
    z-index: 3;
    left: 50%;
    right: 50%;
    -webkit-transition-property: left, right;
    transition-property: left, right;
    -webkit-transition-duration: 0.2s;
    transition-duration: 0.2s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out
}

.md-textfield.required .md-textfield-input,
.md-textfield.required .md-datepicker-input-container {
    border-color: #e67e22
}

.md-textfield.required::after {
    display: none
}

.md-textfield.optional .md-textfield-input,
.md-textfield.optional .md-datepicker-input-container {
    border-color: #3a50c9
}

.md-textfield.optional::after {
    display: none
}

.md-textfield.validate.is-ok::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    color: #fff;
    font-size: 1.6rem;
    text-align: center;
    line-height: 20px;
    content: "done";
    display: block;
    background-color: #DAE5E1;
    width: 20px;
    height: 20px;
    position: absolute;
    border-radius: 20px;
    top: 0px;
    right: 10px;
    top: 6px
}

@media only screen and (max-width: 767px) {
    .md-textfield.validate.is-ok::before {
        right: 0
    }
}

.md-textfield.validate.is-ng::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    color: #fff;
    font-size: 1.6rem;
    text-align: center;
    line-height: 20px;
    content: "error";
    display: block;
    background-color: #d03a1c;
    width: 20px;
    height: 20px;
    position: absolute;
    border-radius: 20px;
    top: 0px;
    right: 10px;
    top: 6px
}

@media only screen and (max-width: 767px) {
    .md-textfield.validate.is-ng::before {
        right: 0
    }
}

.md-textfield input::-webkit-datetime-edit {
    color: transparent
}

.md-textfield .error-label {
    position: absolute;
    top: 100%;
    font-size: 1.2rem;
    left: 0
}

.md-textfield .md-datepicker-input-container .material-icons {
    font-size: 2.1rem
}

.md-textfield-style-box {
    margin: 0
}

.md-textfield-style-box .md-textfield-input,
.md-textfield-style-box .md-datepicker-input-container {
    border: 1px solid;
    height: 32px;
    border-radius: 4px
}

.md-textfield-style-box .md-datetime-picker .md-datepicker-input-container {
    height: 32px;
    padding: 4px 0
}

.md-textfield-style-box .md-datetime-picker .md-datepicker-input-container .material-icons {
    margin-top: 2px
}

.md-textfield-input {
    height: 27px;
    border: none;
    position: relative;
    z-index: 1;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    display: block;
    font-size: 1.4rem;
    margin: 0;
    padding: 2px 4px 2px 4px;
    box-sizing: border-box;
    width: 100%;
    background: none;
    text-align: left;
    color: inherit
}

@media only screen and (max-width: 767px) {
    .md-textfield-input {
        border-radius: 0
    }
}

.md-textfield-input:disabled {
    border-bottom: 1px solid #9A9B9D !important
}

.md-textfield-input:disabled+label {
    color: #9A9B9D
}

.md-textfield-input:-ms-input-placeholder {
    color: #ACACA9
}

.md-textfield-label {
    bottom: 0;
    color: #000;
    font-size: 1.4rem;
    left: 6px;
    right: 0;
    pointer-events: none;
    position: absolute;
    z-index: 0;
    display: block;
    top: 0px;
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-align: left;
    transition-duration: 0.2s;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1)
}

.md-textarea {
    position: relative;
    font-size: 1.4rem;
    display: inline-block;
    box-sizing: border-box;
    width: 100%;
    margin: 17px 0 0px 0
}

.md-textarea.is-focused.pr-40:after,
.md-textarea.is-input.pr-40:after {
    right: 40px
}

.md-textarea.is-focused .md-textarea-input,
.md-textarea.is-input .md-textarea-input {
    outline: none
}

.md-textarea.is-focused .md-textarea-label,
.md-textarea.is-input .md-textarea-label {
    z-index: 1;
    top: -20px;
    left: 0px;
    font-size: 1.2rem;
    color: #3a50c9
}

.md-textarea.is-focused.required .md-textarea-label,
.md-textarea.is-input.required .md-textarea-label {
    color: #e67e22
}

.md-textarea.is-focused::after,
.md-textarea.is-input::after {
    left: 0;
    right: 0
}

.md-textarea::after {
    content: "";
    height: 2px;
    display: block;
    position: absolute;
    bottom: 0px;
    background-color: #3a50c9;
    z-index: 3;
    left: 50%;
    right: 50%;
    -webkit-transition-property: left, right;
    transition-property: left, right;
    -webkit-transition-duration: 0.2s;
    transition-duration: 0.2s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out
}

.md-textarea.required .md-textarea-input {
    border: 1px solid #e67e22
}

.md-textarea.required::after {
    display: none
}

.md-textarea.optional .md-textarea-input {
    border: 1px solid #3a50c9
}

.md-textarea.optional::after {
    display: none
}

.md-textarea.validate.is-ok::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    color: #fff;
    font-size: 1.6rem;
    text-align: center;
    line-height: 20px;
    content: "done";
    display: block;
    background-color: #DAE5E1;
    width: 20px;
    height: 20px;
    position: absolute;
    border-radius: 20px;
    top: 0px;
    right: 10px
}

@media only screen and (max-width: 767px) {
    .md-textarea.validate.is-ok::before {
        right: 0
    }
}

.md-textarea.validate.is-ng::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    color: #fff;
    font-size: 1.6rem;
    text-align: center;
    line-height: 20px;
    content: "error";
    display: block;
    background-color: #d03a1c;
    width: 20px;
    height: 20px;
    position: absolute;
    border-radius: 20px;
    top: 0px;
    right: 10px
}

@media only screen and (max-width: 767px) {
    .md-textarea.validate.is-ng::before {
        right: 0
    }
}

.md-textarea-input {
    border: none;
    position: relative;
    z-index: 1;
    border: 1px solid rgba(0, 0, 0, 0.12);
    display: block;
    font-size: 1.4rem;
    margin: 0;
    padding: 4px 4px 6px 4px;
    box-sizing: border-box;
    width: 100%;
    height: 80px;
    background: none;
    text-align: left;
    color: inherit;
    resize: vertical;
    border-radius: 0;
    -webkit-appearance: none;
    box-shadow: none
}

.md-textarea-input:disabled {
    background-color: #edf1f2;
    border: 1px solid #9A9B9D !important
}

.md-textarea-input:disabled+label {
    color: #9A9B9D
}

.md-textarea-input.double-height {
    height: 160px
}

.md-textarea .text-input-expand {
    height: 160px
}

.md-textarea-label {
    bottom: 0;
    color: #6A6B6D;
    font-size: 1.4rem;
    left: 4px;
    right: 0;
    pointer-events: none;
    position: absolute;
    z-index: 1;
    display: block;
    top: 0px;
    width: 100%;
    overflow: hidden;
    text-align: left;
    transition-duration: 0.2s;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1)
}

input[type=radio],
input[type=checkbox] {
    display: none
}

.md-radio {
    display: inline-block;
    position: relative
}

.md-radio.required .md-radio-label:after {
    border: 2px solid #e67e22
}

.md-radio.required .md-radio-label:before {
    background-color: #e67e22
}

.md-radio.validate {
    padding-right: 30px
}

.md-radio.validate.is-ok::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    color: #fff;
    font-size: 1.6rem;
    text-align: center;
    line-height: 20px;
    content: "done";
    display: block;
    background-color: #DAE5E1;
    width: 20px;
    height: 20px;
    position: absolute;
    border-radius: 20px;
    right: 10px
}

.md-radio.validate.is-ng::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    color: #fff;
    font-size: 1.6rem;
    text-align: center;
    line-height: 20px;
    content: "error";
    display: block;
    background-color: #d03a1c;
    width: 20px;
    height: 20px;
    position: absolute;
    border-radius: 20px;
    top: 0px;
    right: 10px
}

.md-checkbox.required .md-checkbox-label:after {
    border: 2px solid #e67e22
}

.md-checkbox.required .md-checkbox-label:before {
    border-right: 3px solid #e67e22;
    border-bottom: 3px solid #e67e22
}

.md-checkbox.validate {
    padding-right: 30px
}

.md-checkbox.validate.is-ok::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    color: #fff;
    font-size: 1.6rem;
    text-align: center;
    line-height: 20px;
    content: "done";
    display: block;
    background-color: #DAE5E1;
    width: 20px;
    height: 20px;
    position: absolute;
    border-radius: 20px;
    right: 10px
}

.md-checkbox.validate.is-ng::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    color: #fff;
    font-size: 1.6rem;
    text-align: center;
    line-height: 20px;
    content: "error";
    display: block;
    background-color: #d03a1c;
    width: 20px;
    height: 20px;
    position: absolute;
    border-radius: 20px;
    top: 0px;
    right: 10px
}

.md-checkbox.disabled .md-checkbox-label {
    pointer-events: none;
    color: #d8d8d8
}

.md-checkbox.disabled .md-checkbox-label::after {
    border: 2px solid #d8d8d8
}

.md-radio-label,
.md-checkbox-label {
    box-sizing: border-box;
    position: relative;
    display: inline-block;
    padding: 0px 12px 0px 27px;
    border-radius: 8px;
    vertical-align: middle;
    cursor: pointer
}

.md-radio-label:not([disabled]):hover:after,
.md-checkbox-label:not([disabled]):hover:after {
    border-color: #3a50c9
}

.md-radio-label:after,
.md-checkbox-label:after {
    -webkit-transition: border-color 0.2s ease-out;
    transition: border-color 0.2s ease-out;
    position: absolute;
    top: 50%;
    left: 0px;
    display: block;
    margin-top: -10px;
    width: 20px;
    height: 20px;
    border: 2px solid #9A9B9D;
    border-radius: 3px;
    content: ''
}

.md-radio-label:before {
    -webkit-transition: opacity 0.2s ease-out;
    transition: opacity 0.2s ease-out;
    position: absolute;
    top: 50%;
    left: 5px;
    display: block;
    margin-top: -5px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #3a50c9;
    content: '';
    opacity: 0
}

input[type=radio]:checked+.md-radio-label:before {
    opacity: 1
}

.md-radio-label:after {
    border-radius: 10px
}

.md-checkbox-label:before {
    -webkit-transition: opacity 0.1s ease-out;
    transition: opacity 0.1s ease-out;
    position: absolute;
    top: 50%;
    left: 6px;
    display: block;
    margin-top: -7px;
    width: 8px;
    height: 11px;
    border-right: 3px solid #3a50c9;
    border-bottom: 3px solid #3a50c9;
    content: '';
    opacity: 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg)
}

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

.md-select-label {
    bottom: 0;
    color: transparent;
    font-size: 1.4rem;
    left: 6px;
    right: 0;
    pointer-events: none;
    position: absolute;
    z-index: 0;
    display: block;
    top: 0px;
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-align: left;
    transition-duration: 0.2s;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1)
}

.md-select {
    position: relative;
    display: inline-block
}

.md-select.pr-40::after {
    right: 40px
}

.md-select::after {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    content: "arrow_drop_down";
    position: absolute;
    top: -4px;
    right: 0;
    font-size: 2.6rem;
    color: #6A6B6D;
    z-index: 0
}

@media screen and (-ms-high-contrast: active),
(-ms-high-contrast: none) {
    .md-select::after {
        display: none
    }
}

.md-select.is-focused .md-select-label,
.md-select.is-input .md-select-label {
    z-index: 1;
    top: -20px;
    left: 0px;
    font-size: 1.2rem;
    color: #3a50c9
}

.md-select.is-focused.required .md-select-label,
.md-select.is-input.required .md-select-label {
    color: #e67e22
}

.md-select.required .md-select-box {
    border-color: #e67e22
}

.md-select.required.is-focused .md-select-box,
.md-select.required.is-input .md-select-box {
    border-bottom: 1px solid #e67e22
}

.md-select.optional .md-select-box {
    border-bottom: 1px solid #3a50c9
}

.md-select.optional.is-focused .md-select-box,
.md-select.optional.is-input .md-select-box {
    border-color: #3a50c9
}

.md-select.validate.is-ok::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    color: #fff;
    font-size: 1.6rem;
    text-align: center;
    line-height: 20px;
    content: "done";
    display: block;
    background-color: #DAE5E1;
    width: 20px;
    height: 20px;
    position: absolute;
    border-radius: 20px;
    top: 0px;
    right: 10px;
    top: 6px
}

@media only screen and (max-width: 767px) {
    .md-select.validate.is-ok::before {
        right: 0
    }
}

.md-select.validate.is-ng::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    color: #fff;
    font-size: 1.6rem;
    text-align: center;
    line-height: 20px;
    content: "error";
    display: block;
    background-color: #d03a1c;
    width: 20px;
    height: 20px;
    position: absolute;
    border-radius: 20px;
    top: 0px;
    right: 10px;
    top: 6px
}

@media only screen and (max-width: 767px) {
    .md-select.validate.is-ng::before {
        right: 0
    }
}

.md-select.is-focused .md-select-box {
    border-bottom: 2px solid #3a50c9
}

.md-select-style-box .md-select-box {
    border: 1px solid;
    height: 32px;
    border-radius: 4px;
    line-height: 32px
}

.md-select-style-box::after {
    top: 2px
}

.md-select-box {
    width: 100%;
    height: 26px;
    position: relative;
    z-index: 1;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    outline: none;
    border: none;
    border-bottom: 1px solid #d8d8d8;
    color: #000;
    font-size: 1.4rem;
    padding: 0px 30px 0px 6px;
    background: transparent;
    border-radius: 0px
}

.md-select-box:disabled {
    border-bottom: 1px solid #9A9B9D !important;
    color: #9A9B9D
}

@media screen and (-ms-high-contrast: active),
(-ms-high-contrast: none) {
    .md-select-box {
        padding-right: 6px
    }
}

.md-switch-label {
    word-break: break-word
}

.md-switch input[type=radio] {
    display: inline-block;
    margin-right: 6px
}

.md-switch input[type=radio]+label {
    position: relative;
    display: inline-block;
    margin-right: 12px;
    font-size: 14px;
    line-height: 30px;
    cursor: pointer
}

@media (min-width: 1px) {
    .md-switch input[type=radio] {
        display: none;
        margin: 0
    }

    .md-switch input[type=radio]+label::before {
        content: "";
        position: absolute;
        top: 50%;
        left: 0;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        display: block;
        width: 18px;
        height: 18px;
        margin-top: -9px;
        background: #FFF
    }

    .md-switch input[type=radio]+label::before {
        border: 2px solid #ccc;
        border-radius: 30px
    }

    .md-switch input[type=radio]:checked+label::after {
        content: "";
        position: absolute;
        top: 50%;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        display: block
    }

    .md-switch input[type=radio]:checked+label::after {
        left: 5px;
        width: 8px;
        height: 8px;
        margin-top: -4px;
        background: #E71063;
        border-radius: 8px
    }

    .md-switch .md-switch-wrap {
        position: relative;
        display: inline-block;
        width: 40px;
        height: 12px;
        border-radius: 12px;
        background-color: #9A9B9D;
        overflow: visible
    }

    .md-switch .md-switch-wrap input[type=radio]+label {
        position: static;
        float: left;
        display: block;
        height: 20px;
        width: 20px;
        margin-right: 0;
        padding: 0;
        overflow: visible
    }

    .md-switch .md-switch-wrap input[type=radio]+label::before {
        top: 0;
        bottom: 0;
        z-index: 1;
        display: block;
        width: 50%;
        height: auto;
        margin-top: 0;
        text-align: center;
        color: transparent;
        background: transparent;
        border: 0 none;
        border-radius: 0
    }

    .md-switch .md-switch-wrap input[type=radio]+label:last-child::before {
        left: 50%;
        right: 0
    }

    .md-switch .md-switch-wrap input[type=radio]:checked+label::before {
        color: #fff
    }

    .md-switch .md-switch-wrap input[type=radio]+label::after {
        border-radius: 0
    }

    .md-switch .md-switch-wrap input[type=radio]:first-child+label::after {
        content: none
    }

    .md-switch .md-switch-wrap input[type=radio]+label+input[type=radio]+label::after {
        content: "";
        position: absolute;
        top: -4px;
        z-index: 0;
        display: block;
        width: auto;
        height: auto;
        margin: auto;
        height: 20px;
        border-radius: 20px;
        background: #3A50C9;
        -webkit-transition: all 200ms;
        transition: all 200ms;
        box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5)
    }

    .md-switch .md-switch-wrap.disabled input[type=radio]+label+input[type=radio]+label::after {
        background: #bdbdbd
    }

    .md-switch .md-switch-wrap.disabled {
        background: rgba(0, 0, 0, 0.12)
    }

    .md-switch .md-switch-wrap.disabled label {
        cursor: not-allowed;
        pointer-events: none !important
    }

    .md-switch .md-switch-wrap input[type=radio]:checked+label+input[type=radio]+label::after {
        left: 0;
        right: 50%;
        background: #fff
    }

    .md-switch .md-switch-wrap input[type=radio]+label+input[type=radio]:checked+label::after {
        left: 50%;
        right: 0
    }

    .md-switch .md-switch-wrap input[type=radio]+label {
        width: 100%;
        pointer-events: initial
    }

    .md-switch .md-switch-wrap input[type=radio]:checked+label {
        width: 0;
        pointer-events: none
    }
}

@media screen and (min-color-index: 0) and (-webkit-min-device-pixel-ratio: 0) {
    button.button {
        display: -webkit-flex;
        display: flex
    }
}

.button {
    box-sizing: border-box;
    width: 180px;
    height: 30px;
    text-decoration: none;
    color: #fff;
    background-color: #3A50C9;
    border-radius: 3px;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
    font-size: 1.2rem;
    border: none;
    padding: 0;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s
}

.button:hover {
    text-decoration: none
}

.button:focus,
.button:active {
    outline: 0;
    text-decoration: none
}

.button span {
    position: relative;
    display: inline-block;
    padding-left: 2rem
}

.button span::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    display: inline;
    position: absolute;
    font-size: 1.6rem;
    top: -1px;
    left: 0px
}

.button .fa {
    font-size: 2.1rem;
    margin: 0 10px 0 0
}

.button:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.button:hover,
.button:focus,
.button:active {
    color: #fff
}

.button::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -75px;
    left: 0px;
    border-radius: 100%;
    background-color: #3a50c9;
    width: 180px;
    height: 180px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

.button:disabled {
    border: 1px solid #9A9B9D;
    background-color: #d8d8d8;
    color: #9A9B9D;
    pointer-events: none
}

.button:disabled::before {
    display: none !important
}

.button.button-non-focus {
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s
}

.button.button-non-focus:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.button.button-non-focus:hover,
.button.button-non-focus:focus,
.button.button-non-focus:active {
    color: #fff
}

.button.button-non-focus::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -75px;
    left: 0px;
    border-radius: 100%;
    background-color: #3a50c9;
    width: 180px;
    height: 180px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

.btn-edit {
    box-sizing: border-box;
    width: 180px;
    height: 30px;
    text-decoration: none;
    color: #fff;
    background-color: #9A9B9D;
    border-radius: 3px;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
    font-size: 1.2rem;
    border: none;
    padding: 0;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s
}

.btn-edit:hover {
    text-decoration: none
}

.btn-edit:focus,
.btn-edit:active {
    outline: 0;
    text-decoration: none
}

.btn-edit:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.btn-edit:hover,
.btn-edit:focus,
.btn-edit:active {
    color: #fff
}

.btn-edit::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -75px;
    left: 0px;
    border-radius: 100%;
    background-color: #d8d8d8;
    width: 180px;
    height: 180px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

@media only screen and (max-width: 767px) {
    .btn-edit {
        width: 150px;
        margin: 0 2px
    }
}

.button-print:focus:before,
.button-print:active:before {
    display: none !important
}

.button-outline {
    border: 1px solid #3A50C9;
    color: #3A50C9;
    background: none;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s
}

.button-outline:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.button-outline:hover,
.button-outline:focus,
.button-outline:active {
    color: #fff
}

.button-outline::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -75px;
    left: 0px;
    border-radius: 100%;
    background-color: #3a50c9;
    width: 180px;
    height: 180px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

.button-outline:hover {
    border: 1px solid #3a50c9
}

.button-small {
    width: 80px;
    height: 24px;
    font-size: 1.2rem;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s
}

.button-small:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.button-small:hover,
.button-small:focus,
.button-small:active {
    color: #fff
}

.button-small::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -28px;
    left: 0px;
    border-radius: 100%;
    background-color: #3a50c9;
    width: 80px;
    height: 80px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

.button-cancel {
    border: 1px solid #6A6B6D;
    color: #6A6B6D;
    background-color: #d8d8d8
}

.button-gray-dark {
    background-color: #9A9B9D;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s
}

.button-gray-dark:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.button-gray-dark:hover,
.button-gray-dark:focus,
.button-gray-dark:active {
    color: #fff
}

.button-gray-dark::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -75px;
    left: 0px;
    border-radius: 100%;
    background-color: #d8d8d8;
    width: 180px;
    height: 180px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

.button-gray-dark:hover {
    color: #fff
}

.button-orange {
    background-color: #e67e22;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s
}

.button-orange:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.button-orange:hover,
.button-orange:focus,
.button-orange:active {
    color: #fff
}

.button-orange::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -75px;
    left: 0px;
    border-radius: 100%;
    background-color: #eb9950;
    width: 180px;
    height: 180px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

.button-green {
    background-color: #DAE5E1;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s
}

.button-green:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.button-green:hover,
.button-green:focus,
.button-green:active {
    color: #fff
}

.button-green::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -75px;
    left: 0px;
    border-radius: 100%;
    background-color: #390;
    width: 180px;
    height: 180px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

.button-light-blue {
    background-color: #2196F3;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s
}

.button-light-blue:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.button-light-blue:hover,
.button-light-blue:focus,
.button-light-blue:active {
    color: #fff
}

.button-light-blue::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -75px;
    left: 0px;
    border-radius: 100%;
    background-color: #81BEF7;
    width: 180px;
    height: 180px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

.button-disabled {
    border: 1px solid #babcbe;
    background-color: #e2e4e4;
    color: #babcbe;
    cursor: default;
    pointer-events: none
}

.button-disabled::before {
    display: none
}

.button-opacity {
    opacity: 0.3;
    cursor: default;
    pointer-events: none
}

.button-opacity::before {
    display: none
}

.button-grey {
    background-color: #d8d8d8;
    border: 1px solid #9A9B9D;
    color: #6A6B6D;
    padding-top: 5px;
    padding-bottom: 5px
}

.button-grey:hover {
    background-color: #9A9B9D
}

.button-grey::before {
    display: none
}

.button-facebook {
    background: #3E5A97;
    border: 1px solid #20448B;
    padding: 0 10px;
    justify-content: flex-start
}

.button-facebook:hover {
    background-color: #303d57
}

.button-facebook::before {
    display: none
}

.md-input-message-animation {
    opacity: 1;
    margin-top: 0px;
    color: #e67e22;
    font-size: 12px
}

.select-box {
    position: relative
}

.select-box select {
    min-width: 50px;
    height: 32px;
    border: 1px solid #9A9B9D;
    padding: 0 20px 0 10px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: transparent;
    border-radius: 0
}

@media screen and (-ms-high-contrast: active),
(-ms-high-contrast: none) {
    .select-box select {
        padding: 0
    }
}

.select-box select:focus {
    border-color: #3A50C9;
    outline: 0
}

.select-box:before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    pointer-events: none;
    content: "arrow_drop_down";
    position: absolute;
    top: 8px;
    right: 0;
    font-size: 2.6rem;
    color: #6A6B6D;
    z-index: 0
}

@media screen and (-ms-high-contrast: active),
(-ms-high-contrast: none) {
    .select-box:before {
        display: none
    }
}

.action-inline i,
.action-inline .material-icons {
    vertical-align: top
}

.link-edit {
    font-size: 1.3rem
}

.link-edit::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    content: "edit";
    display: inline-block;
    font-size: 1.4rem;
    top: 3px
}

.link-help {
    font-size: 1.3rem
}

.link-help::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    content: "help_outline";
    display: inline-block;
    font-size: 1.6rem;
    top: 3px
}

label {
    font-weight: normal
}

.is-disabled {
    border-bottom: 1px solid #d8d8d8 !important
}

textarea.is-disabled {
    border: 1px solid #d8d8d8 !important
}

.button.is-disabled {
    border: 1px solid #9A9B9D !important;
    background-color: #d8d8d8;
    color: #9A9B9D
}

.button.is-disabled::before {
    background-color: #d8d8d8 !important
}

.button.is-disabled:hover {
    cursor: default
}

.button-delete {
    cursor: pointer;
    background-color: #d8d8d8;
    padding-top: 5px;
    padding-bottom: 5px
}

.color-disable-text input {
    color: #5b5c5d
}

.cicle-progress {
    background: #1e88e5;
    width: 140px;
    height: 140px;
    text-align: center;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    line-height: 1;
    border-radius: 50%;
    position: absolute;
    padding: 10px;
    top: 0;
    left: 0;
    bottom: 0;
    margin: auto
}

.cicle-progress span strong {
    white-space: pre-line
}

.cicle-progress.blue-cicle {
    background: #1e88e5
}

.cicle-progress.blue-cicle .bar,
.cicle-progress.blue-cicle .fill {
    border-color: #67aae5
}

.cicle-progress.green-cicle {
    background: #66bb6a
}

.cicle-progress.green-cicle .bar,
.cicle-progress.green-cicle .fill {
    border-color: #76d97b
}

.cicle-progress.orange-cicle {
    background: #ff7043
}

.cicle-progress.orange-cicle .bar,
.cicle-progress.orange-cicle .fill {
    border-color: #ff9877
}

.cicle-progress.deg-45 .bar {
    transform: rotate(45deg)
}

.cicle-progress.deg-90 .bar {
    transform: rotate(90deg)
}

.cicle-progress.deg-180 .bar {
    transform: rotate(180deg)
}

.cicle-progress.deg-270 .slice {
    clip: rect(auto, auto, auto, auto)
}

.cicle-progress.deg-270 .bar {
    transform: rotate(270deg)
}

.cicle-progress.deg-270 .fill {
    display: block;
    transform: rotate(180deg)
}

.cicle-progress.deg-360 .slice {
    clip: rect(auto, auto, auto, auto)
}

.cicle-progress.deg-360 .bar {
    transform: rotate(360deg)
}

.cicle-progress.deg-360 .fill {
    display: block;
    transform: rotate(180deg)
}

.cicle-progress .slice {
    position: absolute;
    width: 100%;
    height: 100%;
    clip: rect(0, 140px, 140px, 70px);
    top: 0;
    left: 0
}

.cicle-progress .bar {
    position: absolute;
    border: 10px solid #67aae5;
    width: 100%;
    height: 100%;
    clip: rect(0, 70px, 140px, 0);
    border-radius: 50%;
    transform: rotate(90deg)
}

.cicle-progress .fill {
    position: absolute;
    border: 10px solid #67aae5;
    width: 100%;
    height: 100%;
    clip: rect(0, 70px, 140px, 0);
    border-radius: 50%;
    transform: rotate(0deg);
    display: none
}

.manager-notify-box {
    padding: 15px 15px 15px 50px;
    margin: 0 0 10px;
    position: relative;
    background: #d2f5d4;
    display: flex
}

.manager-notify-box>i {
    position: absolute;
    left: 15px
}

.manager-notify-box .word-wrap {
    width: -moz-available;
    width: -webkit-fill-available
}

.cfn-privacy-box {
    font-size: 1.2rem
}

.cfn-privacy-box .table-resume-policy,
.cfn-privacy-box .table-resume-policy tbody,
.cfn-privacy-box .table-resume-policy tr,
.cfn-privacy-box .table-resume-policy tr td {
    border: 0
}

.cfn-privacy-box .table-resume-policy tr td {
    padding: 0
}

.cfn-privacy-box .table-resume-policy tr td:first-child {
    width: 200px
}

.ul-style-1 {
    list-style: none;
    margin: 0 0 2em;
    padding: 0 0 0 20px;
    font-size: 1.2rem
}

.ul-style-1>li {
    position: relative;
    padding: 0 0 0 20px
}

.ul-style-1>li:after {
    content: "-";
    position: absolute;
    left: 0;
    top: 1px
}

.ul-style-1>li:first-child {
    padding: 0 0 0 10px
}

.ul-style-1>li:first-child:after {
    display: none
}

.ul-style-2 {
    list-style: none;
    margin: 0 0 2em;
    padding: 0 0 0 15px;
    font-size: 1.2rem
}

.ul-style-2>li {
    position: relative;
    padding: 0 0 0 20px
}

.ul-style-2>li:after {
    content: "・";
    position: absolute;
    left: 0;
    top: 1px
}

.ul-style-2>li:first-child {
    padding: 0 0 0 10px
}

.ul-style-2>li:first-child:after {
    display: none
}

.ul-style-3 {
    list-style: none;
    margin: 0 0 2em;
    padding: 0 0 0 15px;
    font-size: 1.2rem
}

.ul-style-3>li {
    position: relative;
    padding: 0 0 0 20px
}

.ul-style-3>li:after {
    content: "・";
    position: absolute;
    left: 0;
    top: 1px
}

.ul-style-3>li:first-child {
    padding: 0 0 0 10px
}

.ul-style-3>li:first-child:after {
    display: none
}

.ul-style-4 {
    list-style: none;
    margin: 0 0 2em 3em;
    font-size: 1.2rem
}

.ul-style-4>li {
    position: relative;
    padding: 0 0 0 10px
}

.ul-style-4>li:after {
    position: absolute;
    left: 0;
    top: 1px
}

.ul-style-5 {
    list-style: none;
    margin: 0 0 2em;
    padding: 0px;
    font-size: 1.2rem
}

.ul-style-5>li {
    position: relative;
    padding: 0 0 0 20px
}

.ul-style-5>li:after {
    content: "・";
    position: absolute;
    left: 0;
    top: 1px
}

.ul-style-5>li:first-child {
    padding: 0 0 0 10px
}

.ul-style-5>li:first-child:after {
    display: none
}

.ul-style-5>li.title-1:first-child {
    padding: 0 0 0 5px
}

.ul-style-5>li.title-1:first-child:before {
    content: "*";
    margin: 0 10px 0 0
}

.ul-style-5>li.title-2:first-child {
    padding: 0px
}

.ul-style-5>li.title-2:first-child:before {
    content: "・";
    margin: 0 10px 0 0
}

.ul-style-6 {
    list-style: none;
    margin: 0 0 2em;
    padding: 0px;
    font-size: 1.2rem
}

.ul-style-6>li {
    position: relative;
    padding: 0 0 0 20px
}

.ul-style-6>li:after {
    content: "・";
    position: absolute;
    left: 0;
    top: 1px
}

.ul-style-6>li:first-child {
    padding: 0 0 0 10px
}

.ul-style-6>li:first-child:after {
    display: none
}

.ul-style-6>li.title:first-child {
    padding: 0 0 0 5px
}

.ul-style-6>li.title:first-child:before {
    content: "-";
    margin: 0 10px 0 0
}

.ul-style-6>li.title-2:first-child {
    padding: 0px
}

.ul-style-6>li.title-2:first-child:before {
    margin: 0 10px 0 0
}

.ol-style-1 {
    list-style: none;
    margin: 0 0 2em;
    padding: 0 0 0 15px
}

.ol-style-1>li {
    counter-increment: item;
    position: relative;
    padding: 0 0 0 20px;
    margin: 0 0 2px
}

.ol-style-1>li:before {
    content: counter(item) ".";
    width: 1.2em;
    position: absolute;
    left: 0;
    top: 0;
    text-align: center;
    display: inline-block
}

.ol-style-2 {
    list-style: none;
    margin: 0 0 2em;
    padding: 0 0 0 15px
}

.ol-style-2>li {
    counter-increment: item;
    position: relative;
    padding: 0 0 0 20px;
    margin: 0 0 2px
}

.ol-style-2>li:before {
    content: counter(item) ":";
    width: 1.2em;
    position: absolute;
    left: 0;
    top: 0;
    text-align: center;
    display: inline-block
}

.ol-style-3 {
    list-style: none;
    margin: 0 0 2em;
    padding: 0 0 0 15px
}

.ol-style-3>li {
    counter-increment: item;
    position: relative;
    padding: 0 0 0 20px;
    margin: 0 0 2px
}

.ol-style-3>li:before {
    content: counter(item) ")";
    width: 1.2em;
    position: absolute;
    left: 0;
    top: 0;
    text-align: center;
    display: inline-block
}

.given-time {
    margin-top: -20px
}

.grid-information {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap
}

.grid-information dt,
.grid-information dd {
    margin: 0;
    padding: 0;
    font-size: 1.2rem
}

.grid-information dt {
    position: relative;
    padding: 6px 20px 6px 0;
    border-right: 1px solid #d8d8d8;
    box-sizing: border-box;
    font-weight: bold
}

.grid-information dt::after {
    position: absolute;
    content: "";
    width: 5px;
    height: 5px;
    bottom: -3px;
    right: -3px;
    border-radius: 5px;
    background-color: #d8d8d8
}

.grid-information dt:last-of-type::after {
    position: absolute;
    content: "";
    width: 5px;
    height: 5px;
    bottom: -3px;
    right: -3px;
    border-radius: 5px;
    background-color: #d8d8d8
}

.grid-information dt:first-child::before {
    position: absolute;
    content: "";
    width: 5px;
    height: 5px;
    top: -3px;
    right: -3px;
    background-color: #d8d8d8;
    border-radius: 5px
}

.grid-information dd {
    padding: 6px 0 6px 20px;
    box-sizing: border-box
}

.dl-style-01 {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: -10px 0 0 0
}

.dl-style-01 dt,
.dl-style-01 dd {
    margin: 0;
    padding: 0;
    font-size: 1.2rem
}

.dl-style-01 dt {
    width: 12em;
    position: relative;
    padding: 1px 20px 1px 10px;
    margin-top: 14px;
    border-left: 4px solid #d8d8d8;
    box-sizing: border-box;
    font-weight: bold
}

@media only screen and (max-width: 1180px) {
    .dl-style-01 dt {
        width: 11em;
        padding: 1px 10px
    }
}

.dl-style-01 dd {
    width: calc(100% - 12em);
    margin-top: 14px;
    padding: 1px 0 1px 20px;
    box-sizing: border-box
}

.cfn-tab {
    position: relative;
    list-style: none;
    display: flex;
    display: -webkit-flex;
    border-bottom: 1px solid #d8d8d8
}

.cfn-tab.is-single {
    border: 0
}

.cfn-tab li {
    text-align: center
}

.cfn-tab li a {
    padding: 11px 0;
    display: block;
    color: #9A9B9D;
    position: relative
}

.cfn-tab li a.is-selected::after,
.cfn-tab li a:hover::after,
.cfn-tab li a:active::after {
    left: 0;
    right: 0
}

.cfn-tab li a::after {
    content: "";
    height: 3px;
    display: block;
    position: absolute;
    bottom: 0px;
    background-color: #3a50c9;
    z-index: 1;
    left: 50%;
    right: 50%;
    -webkit-transition-property: left, right;
    transition-property: left, right;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out
}

.cfn-tab li a:hover {
    border-color: transparent
}

.cfn-tab li a:focus {
    text-decoration: none;
    outline: 0
}

.cfn-tab li a.is-selected,
.cfn-tab li a:hover,
.cfn-tab li a:focus,
.cfn-tab li a:active {
    border-color: transparent;
    color: #000
}

.cfn-tab li a.is-selected {
    cursor: default
}

.cfn-tab li a.has-error {
    color: #d03a1c
}

.cfn-tab li a.has-error::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    color: #fff;
    font-size: 1.6rem;
    text-align: center;
    line-height: 20px;
    content: "error";
    display: block;
    background-color: #d03a1c;
    width: 20px;
    height: 20px;
    position: absolute;
    border-radius: 20px;
    width: 20px;
    height: 20px;
    border-radius: 20px;
    top: 50%;
    transform: translateY(-50%);
    line-height: 20px;
    right: 10px
}

.tab-content {
    display: none
}

.tab-content.is-show {
    display: block
}

.tab-content h3 {
    margin-top: 4rem;
    margin-bottom: 1.2rem
}

.nav-tabs.cfn-nav-tabs-style-2 {
    position: relative;
    list-style: none;
    display: flex;
    display: -webkit-flex;
    border-bottom: 0;
    margin: 0 0 20px 0
}

@media only screen and (max-width: 599px) {
    .nav-tabs.cfn-nav-tabs-style-2.nav-profile {
        display: block
    }
}

.nav-tabs.cfn-nav-tabs-style-2>li {
    float: none;
    text-align: center
}

.nav-tabs.cfn-nav-tabs-style-2>li:last-child {
    margin: 0
}

.nav-tabs.cfn-nav-tabs-style-2>li.active>a,
.nav-tabs.cfn-nav-tabs-style-2>li:hover>a {
    background: none;
    border: 0;
    border-bottom: 1px solid transparent;
    color: #000
}

.nav-tabs.cfn-nav-tabs-style-2>li.active>a:after,
.nav-tabs.cfn-nav-tabs-style-2>li:hover>a:after {
    left: 0;
    right: 0
}

.nav-tabs.cfn-nav-tabs-style-2>li>a {
    background: none;
    border: 0;
    border-bottom: 1px solid #d8d8d8;
    padding: 11px 0;
    border-radius: 0;
    display: block;
    color: #9A9B9D;
    min-width: 160px;
    margin: 0;
    transition: all .3s ease-out 0;
    position: relative
}

.nav-tabs.cfn-nav-tabs-style-2>li>a.is-selected::after,
.nav-tabs.cfn-nav-tabs-style-2>li>a:hover::after,
.nav-tabs.cfn-nav-tabs-style-2>li>a:active::after {
    left: 0;
    right: 0
}

.nav-tabs.cfn-nav-tabs-style-2>li>a::after {
    content: "";
    height: 3px;
    display: block;
    position: absolute;
    bottom: 0px;
    background-color: #3a50c9;
    z-index: 1;
    left: 50%;
    right: 50%;
    -webkit-transition-property: left, right;
    transition-property: left, right;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out
}

.nav-tabs.cfn-nav-tabs-style-2>li>a:hover {
    border: 0;
    border-bottom: 1px solid transparent
}

@media only screen and (max-width: 599px) {
    .nav-tabs.cfn-nav-tabs-style-2>li>a {
        min-width: 120px
    }
}

.nav-tabs.cfn-nav-tabs-style-preview {
    border-bottom: 0;
    float: left;
    width: 100%;
    clear: both;
    margin: 20px 0
}

.nav-tabs.cfn-nav-tabs-style-preview li {
    margin-right: 10px;
    min-width: 140px;
    min-height: 40px;
    text-align: center
}

.nav-tabs.cfn-nav-tabs-style-preview li a {
    color: #000;
    background-color: #deebf7;
    border-radius: 0;
    cursor: pointer
}

@media only screen and (max-width: 767px) {
    .nav-tabs.cfn-nav-tabs-style-preview li a {
        padding-left: 10px;
        padding-right: 10px
    }
}

.nav-tabs.cfn-nav-tabs-style-preview li a.is-selected,
.nav-tabs.cfn-nav-tabs-style-preview li a:hover,
.nav-tabs.cfn-nav-tabs-style-preview li a:focus,
.nav-tabs.cfn-nav-tabs-style-preview li a:active {
    color: #fff;
    background-color: #3366ff
}

.nav-tabs.cfn-nav-tabs-style-preview li a.is-selected:after,
.nav-tabs.cfn-nav-tabs-style-preview li a:hover:after,
.nav-tabs.cfn-nav-tabs-style-preview li a:focus:after,
.nav-tabs.cfn-nav-tabs-style-preview li a:active:after {
    display: none
}

.nav-tabs.cfn-nav-tabs-style-preview li a:after {
    display: none
}

.nav-tabs.cfn-nav-tabs-style-preview li.active a {
    color: #fff;
    background-color: #3366ff
}

.cfn-tab-content-style-2 {
    display: block
}

.company-info .company-info-title h2 {
    margin: 0;
    color: #000
}

#company_detail {
    float: left;
    width: 100%;
    clear: both
}

.subtitle {
    color: #DD0E1B;
    font-size: 1.4rem;
    margin-left: 10px
}

.title-stroke,
.resume-preview .resume-preview-heading {
    color: #89ABE3;
    position: relative;
    margin: 40px 0 20px 0;
    font-weight: normal;
    font-size: 1.6rem;
    border-bottom: 1px solid #89ABE3;
    padding-bottom: 5px
}

.title-stroke-under {
    position: relative;
    font-size: 1.6rem;
    padding-bottom: 12px;
    margin: 0 0 20px 0;
    text-align: left
}

.title-stroke-under::after {
    content: "";
    position: absolute;
    width: 160px;
    height: 1px;
    left: 0px;
    bottom: 0px;
    background-color: #3a50c9
}

.title-stroke-under::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 1px;
    left: 0px;
    bottom: 0px;
    background-color: #d8d8d8
}

table {
    border-collapse: collapse;
    background-color: #fff;
    border: 1px solid #d8d8d8;
    box-sizing: border-box
}

table th {
    text-align: center
}

table thead,
table th,
table tbody,
table tr,
table td {
    border: 1px solid #d8d8d8;
    padding: 10px
}

.table-line {
    border-collapse: collapse;
    background-color: transparent;
    border: none
}

.table-line tbody,
.table-line tr {
    border: none
}

.table-line th,
.table-line td {
    font-size: 1.2rem;
    text-align: left;
    border: none;
    border-bottom: 1px solid #9A9B9D
}

.pagination ul li {
    display: inline-block;
    vertical-align: middle
}

.pagination {
    margin: 0 0 20px;
    text-align: left
}

.pagination ul {
    list-style: none;
    margin-right: 5px
}

.pagination ul li {
    line-height: 30px;
    padding: 0;
    width: 34px;
    margin-right: 4px;
    text-align: center
}

@media only screen and (max-width: 599px) {
    .pagination ul li {
        width: auto
    }
}

.pagination ul li a {
    display: block;
    line-height: 30px;
    width: 34px;
    border: 1px solid #3A50C9;
    box-sizing: border-box;
    color: #3A50C9
}

@media only screen and (max-width: 599px) {
    .pagination ul li a {
        line-height: 28px;
        width: 30px
    }
}

.pagination ul li a:hover {
    border: 1px solid #3a50c9;
    background-color: #3a50c9;
    color: #fff
}

.pagination ul li.page-back a,
.pagination ul li.page-next a {
    border: none
}

.pagination ul li.page-back a:hover,
.pagination ul li.page-next a:hover {
    border: none;
    background-color: transparent;
    color: #3A50C9
}

.pagination ul li.is-selected {
    border: 1px solid #9A9B9D
}

.pagination ul li i {
    display: block;
    line-height: 30px
}

#joblist-select-item select.md-select-box {
    height: 42px
}

@media only screen and (max-width: 599px) {
    body.overflow-hidden-xs {
        overflow: hidden
    }

    body.overflow-hidden-xs .dhx_cal_data {
        overflow: hidden
    }
}

.scheduler-wapper {
    position: relative
}

.scheduler-wapper #reservation-schedule {
    height: 800px;
    margin-top: -40px;
    width: 838px
}

.scheduler-wapper #reservation-schedule .my_event {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    margin-top: 3px;
    margin-left: 1px;
    background-color: #DAE5E1;
    overflow: hidden;
    border-radius: 3px 3px 3px 3px
}

.scheduler-wapper #reservation-schedule .my_event:hover {
    background-color: #390
}

.scheduler-wapper #reservation-schedule .my_event.cell_interview {
    background-color: #3a50c9
}

.scheduler-wapper #reservation-schedule .my_event.cell_interview:hover {
    background-color: #3A50C9
}

.scheduler-wapper #reservation-schedule .my_event.reverved-schedule-bg {
    background-color: #bbb
}

.scheduler-wapper #reservation-schedule .dhx_cal_select_menu.my_event div {
    border: 0;
    background-color: transparent;
    color: #000
}

.scheduler-wapper #reservation-schedule .dhx_cal_event.my_event .my_event_body {
    padding-top: 3px;
    text-align: center
}

.scheduler-wapper #reservation-schedule .dhx_cal_event.my_event .my_event_body>span {
    display: inline-block;
    text-align: center
}

.scheduler-wapper #reservation-schedule .my_event .event_date {
    font-weight: bold
}

.scheduler-wapper #reservation-schedule .my_event_resize {
    height: 3px;
    position: absolute;
    bottom: -1px
}

.scheduler-wapper #reservation-schedule .my_event_move {
    position: absolute;
    top: 0;
    height: 10px;
    cursor: pointer
}

.scheduler-wapper #reservation-schedule .dhx_cal_data {
    border-color: transparent
}

.scheduler-wapper #reservation-schedule>.dhx_cal_data .dhx_scale_holder {
    border-top: 1px solid #CECECE
}

.scheduler-wapper #reservation-schedule .dhx_cal_header {
    top: 61px !important;
    overflow: initial
}

.scheduler-wapper #reservation-schedule .dhx_cal_header>.dhx_scale_bar {
    border-bottom: 1px solid #CECECE
}

.scheduler-wapper #reservation-schedule .dhx_cal_navline {
    display: none
}

.scheduler-wapper #appointment-registration {
    height: 1418px
}

.scheduler-wapper #appointment-registration>.dhx_cal_data.dhx_resize_denied {
    height: 100%important;
    overflow-x: visible;
    overflow-y: visible
}

.scheduler-wapper #appointment-registration .dhx_cal_data {
    border-color: transparent
}

.scheduler-wapper #appointment-registration .dhx_cal_data .dhx_scale_holder {
    height: 100% !important
}

.scheduler-wapper #appointment-registration>.dhx_cal_data .dhx_scale_holder {
    border-top: 1px solid #CECECE
}

.scheduler-wapper #appointment-registration .my_event {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 195px;
    color: #fff;
    margin: 3px 0 0 1px;
    background-color: #DAE5E1;
    overflow: hidden;
    border-radius: 3px 3px 3px 3px
}

.scheduler-wapper #appointment-registration .my_event:hover {
    background-color: #390
}

.scheduler-wapper #appointment-registration .my_event.cell_interview {
    background-color: #3a50c9
}

.scheduler-wapper #appointment-registration .my_event.cell_interview:hover {
    background-color: #3A50C9
}

.scheduler-wapper #appointment-registration .my_event.reverved-schedule-bg {
    background-color: #f30514
}

.scheduler-wapper #appointment-registration .my_event.cell-disabled {
    background-color: #bbb
}

.scheduler-wapper #appointment-registration .dhx_cal_select_menu.my_event div {
    border: 0;
    background-color: transparent;
    color: #000
}

.scheduler-wapper #appointment-registration .dhx_cal_event.my_event .my_event_body {
    padding-top: 3px;
    padding-left: 5px
}

.scheduler-wapper #appointment-registration .my_event .event_date {
    font-weight: bold;
    padding-right: 5px
}

.scheduler-wapper #appointment-registration .my_event_resize {
    height: 3px;
    position: absolute;
    bottom: -1px
}

.scheduler-wapper #appointment-registration .my_event_move {
    position: absolute;
    top: 0;
    height: 10px;
    cursor: pointer
}

.scheduler-wapper #appointment-registration>.dhx_cal_navline {
    display: none
}

.scheduler-wapper #appointment-registration .dhx_cal_data .dhx_scale_holder:last-of-type {
    visibility: hidden
}

.scheduler-wapper.no-x-scroll .horizontal-scroll-box {
    overflow: initial
}

.scheduler-wapper>.dhx_cal_navline {
    max-width: 100%
}

@media only screen and (max-width: 767px) {
    .scheduler-wapper>.dhx_cal_navline .dhx_cal_date {
        padding: 0;
        text-align: left
    }
}

@media only screen and (max-width: 767px) {
    .scheduler-wapper>.dhx_cal_navline .dhx_cal_next_button {
        right: 0;
        width: 15px
    }
}

@media only screen and (max-width: 767px) {
    .scheduler-wapper>.dhx_cal_navline .dhx_cal_prev_button {
        right: 30px;
        width: 15px
    }
}

@media only screen and (max-width: 767px) {
    .scheduler-wapper>.dhx_cal_navline .dhx_cal_today_button {
        width: 60px;
        right: 50px
    }
}

.scheduler-wapper>.dhx_scale_holder {
    border-top: 1px solid #cecece;
    border-left: 1px solid #cecece
}

.scheduler-wapper>.dhx_scale_holder>.dhx_scale_hour {
    border: 0;
    background: #fff;
    border-bottom: 1px solid #cecece
}

.day-nav>.dhx_cal_navline {
    max-width: 100%
}

@media only screen and (min-width: 1023px) and (max-width: 1240px) {
    .day-nav>.dhx_cal_navline {
        width: 600px
    }
}

@media only screen and (max-width: 767px) {
    .day-nav>.dhx_cal_navline .dhx_cal_date {
        padding: 0;
        text-align: left
    }
}

@media only screen and (max-width: 767px) {
    .day-nav>.dhx_cal_navline .dhx_cal_next_button {
        right: 65px;
        width: 20px
    }
}

@media only screen and (max-width: 767px) {
    .day-nav>.dhx_cal_navline .dhx_cal_prev_button {
        right: 95px;
        width: 20px
    }
}

@media only screen and (max-width: 767px) {
    .day-nav>.dhx_cal_navline .dhx_cal_today_button {
        width: 60px;
        right: 115px
    }
}

.day-nav>.dhx_cal_navline .dhx_cal_next_button,
.day-nav>.dhx_cal_navline .dhx_cal_prev_button {
    text-align: center
}

.day-nav>.dhx_scale_holder {
    border-top: 1px solid #cecece;
    border-left: 1px solid #cecece
}

.day-nav>.dhx_scale_holder>.dhx_scale_hour {
    border: 0;
    background: #fff;
    border-bottom: 1px solid #cecece
}

.day-nav .fa {
    font-size: 20px;
    color: #3A50C9
}

.day-nav .button-disabled .fa {
    color: #696969
}

.dhx_cal_edit {
    *zoom: 1;
    display: none;
    position: absolute;
    top: 10px;
    left: 10px;
    right: 10px;
    bottom: 10px;
    width: 300px;
    height: 160px;
    margin: auto;
    padding: 20px;
    background-color: #fff;
    box-shadow: 0px 0px 3px #333;
    z-index: 10
}

.dhx_cal_edit:before,
.dhx_cal_edit:after {
    content: " ";
    display: table
}

.dhx_cal_edit:after {
    clear: both
}

@media only screen and (max-width: 599px) {
    .dhx_cal_edit {
        position: fixed
    }
}

.dhx_cal_edit .semina-title {
    font-weight: bold;
    margin: 0
}

.dhx_cal_edit .semina-info {
    margin: 10px 0
}

.dhx_cal_edit .button {
    float: left
}

.dhx_cal_edit .button-cancel {
    margin-left: 10px;
    border: none
}

.dhx_cal_edit .button-cancel:hover {
    color: inherit
}

.dhx_cal_edit .button-cancel::before {
    display: none
}

.dhx_cal_container {
    background-color: transparent !important
}

.dhx_scale_hour {
    border-left: 1px solid #cecece;
    width: 49px !important
}

.appointment-page-scheduler>.dhx_scale_holder {
    margin-top: 1px
}

.appointment-page-scheduler>.dhx_scale_holder:before {
    content: "";
    background: #fff;
    position: absolute;
    left: -1px;
    right: -1px;
    height: 37px;
    z-index: 2;
    bottom: calc(100% + 1px);
    border: 1px solid #d8d8d8;
    border-bottom: 0
}

.appointment-page-scheduler>.dhx_scale_holder>.dhx_scale_hour {
    height: 132px !important
}

.horizontal-scroll-box {
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
    text-align: left;
    line-height: 0;
    font-size: 0
}

.horizontal-scroll-box>* {
    white-space: normal;
    display: inline-block;
    vertical-align: top;
    line-height: initial;
    font-size: initial
}

html {
    min-height: 100%;
    font-size: 62.5%;
    position: relative
}

body {
    min-height: 100%;
    line-height: 1.5;
    font-size: 1.4rem;
    font-family: 'Noto Sans JP', Avenir, "Open Sans", "Helvetica Neue", Helvetica, Arial, Verdana, Roboto, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", "Meiryo UI", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    color: #2A2B2D;
    font-weight: 400;
    background-color: #fff;
    margin: 0
}

a {
    -webkit-transition: 0.1s;
    -moz-transition: 0.1s;
    -ms-transition: 0.1s;
    -o-transition: 0.1s;
    transition: 0.1s;
    color: #3A50C9;
    text-decoration: none
}

a:hover {
    color: #3a50c9;
    text-decoration: none
}

a:focus,
a:active {
    text-decoration: none;
    color: #3A50C9
}

a[href="javascript:void(0);"] {
    cursor: default
}

p,
ul,
li {
    margin: 0;
    padding: 0
}

ul.initial {
    padding-left: 20px
}

p {
    font-size: 1.2rem;
    line-height: 1.8;
    margin-bottom: 2em;
    text-align: justify
}

h1 {
    font-size: 2.8rem;
    line-height: 1;
    color: #2A2B2D;
    font-weight: 400;
    margin: 60px 0 30px 0
}

h2 {
    font-size: 2.1rem;
    font-weight: 400;
    margin: 40px 0 20px 0
}

h3 {
    margin-top: 1em;
    margin-bottom: 1em;
    font-weight: bold;
    font-size: 1.6rem
}

h1+h2 {
    margin-top: 20px
}

dl {
    margin-top: 1em;
    margin-bottom: 1em
}

small {
    font-size: 80%
}

.badge {
    display: inline-block;
    background-color: #d03a1c;
    font-size: 1.0rem;
    line-height: 1;
    padding: 4px 6px;
    border-radius: 10px;
    color: #fff
}

.cf-icon {
    display: inline-block;
    padding: 4px;
    font-size: 1.0rem;
    line-height: 1;
    min-width: 92px;
    text-align: center;
    color: #fff
}

.cf-icon-resume-search {
    color: #fff;
    background-color: #DAE5E1
}

.cf-icon-news {
    color: #d03a1c;
    border: 1px solid #d03a1c
}

.cf-icon-boston {
    color: #fff;
    background-color: #036
}

.cf-icon-tokyo-summer {
    color: #fff;
    background-color: #390
}

.cf-icon-osaka-summer {
    color: #fff;
    background-color: #c6d219
}

.cf-icon-london {
    color: #fff;
    background-color: #C00
}

.cf-icon-interested {
    color: #fff;
    background-color: #16a085
}

.cf-icon-pr {
    color: #fff;
    background-color: #3A50C9
}

.cf-icon-duplicated {
    color: #fff;
    background-color: #6A6B6D
}

.cf-icon-done {
    color: #fff;
    background-color: #6A6B6D
}

.cf-icon-walkin {
    color: #6A6B6D;
    background-color: #d8d8d8;
    border: 1px solid #6A6B6D
}

.cf-icon-resume {
    color: #fff;
    background-color: #0a9607
}

.cf-icon-scout-mail {
    color: #fff;
    background-color: #d35400
}

.cf-icon-apply {
    color: #fff;
    background-color: #16a085
}

.cf-icon-new {
    color: #fff;
    background-color: #e67e22
}

.cf-icon-internship-job {
    color: #fff;
    background-color: #ff80c0
}

.cf-icon-applied-job {
    color: #fff;
    background-color: #1e588f
}

.pull-left {
    float: left
}

.pull-right {
    float: right
}

.text-center {
    text-align: center
}

.text-left {
    text-align: left
}

.text-right {
    text-align: right
}

.clear-both {
    clear: both
}

.fluid-width {
    width: 100%
}

.mr-5 {
    margin-right: 5px
}

.ml-5 {
    margin-left: 5px
}

.mr-20 {
    margin-right: 20px
}

.mb-20 {
    margin-bottom: 20px
}

.mb-10 {
    margin-bottom: 10px
}

.mt-10 {
    margin-top: 10px
}

.pr-40 {
    padding-right: 40px
}

.m-auto {
    margin-left: auto;
    margin-right: auto
}

.m-l-auto {
    margin-left: auto
}

.m-r-auto {
    margin-right: auto
}

.display-none {
    display: none
}

.display-block {
    display: block
}

.display-inline {
    display: inline
}

.display-inline-block {
    display: inline-block
}

.overflow-hidden {
    overflow: hidden
}

.position-absolute {
    position: absolute
}

.row.is-native {
    margin-left: 0;
    margin-right: 0
}

.row.is-native>[class*="col"] {
    padding-left: 0;
    padding-right: 0
}

.row.row-flex {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: stretch
}

.row.row-flex>[class*="col"] {
    position: relative;
    display: inline-block;
    vertical-align: top;
    float: none
}

.row.row-flex.vertical-bottom>[class*="col"] {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    vertical-align: bottom;
    -webkit-align-self: flex-end;
    -ms-flex-item-align: end;
    align-self: flex-end
}

.fade-custom {
    opacity: 0;
    transition: opacity .3s ease-in-out;
    visibility: hidden;
    height: 0;
    overflow: hidden
}

.fade-custom.in {
    height: auto;
    overflow: initial;
    opacity: 1;
    visibility: visible
}

.inactive-link {
    pointer-events: none;
    color: #d8d8d8
}

.display-flex-right {
    display: flex;
    justify-content: flex-end
}

.display-flex-left {
    display: flex;
    justify-content: flex-start
}

.outline-none:focus {
    outline: none
}

.create-title-lable {
    min-width: 220px
}

.create-title-lable.download-field-label {
    min-width: 140px;
    padding-top: 6px;
    margin-bottom: 0px
}

.m-auto {
    margin: auto
}

.m-40 {
    margin: 40px !important
}

.m-20 {
    margin: 20px !important
}

.m-10 {
    margin: 10px !important
}

.m-5 {
    margin: 5px !important
}

.m-0 {
    margin: 0 !important
}

.mb-40 {
    margin-bottom: 40px !important
}

.mb-20 {
    margin-bottom: 20px !important
}

.mb-10 {
    margin-bottom: 10px !important
}

.mb-5 {
    margin-bottom: 5px !important
}

.mb-0 {
    margin-bottom: 0 !important
}

.mt-40 {
    margin-top: 40px !important
}

.mt-20 {
    margin-top: 20px !important
}

.mt-10 {
    margin-top: 10px !important
}

.mt-5 {
    margin-top: 5px !important
}

.mt-0 {
    margin-top: 0 !important
}

.ml-40 {
    margin-left: 40px !important
}

.ml-20 {
    margin-left: 20px !important
}

.ml-10 {
    margin-left: 10px !important
}

.ml-5 {
    margin-left: 5px !important
}

.ml-0 {
    margin-left: 0px !important
}

.mr-40 {
    margin-right: 40px !important
}

.mr-20 {
    margin-right: 20px !important
}

.mr-10 {
    margin-right: 10px !important
}

.mr-5 {
    margin-right: 5px !important
}

.mr-0 {
    margin-right: 0px !important
}

.p-30 {
    padding: 30px !important
}

.p-20 {
    padding: 20px !important
}

.p-15 {
    padding: 15px !important
}

.p-10 {
    padding: 10px !important
}

.p-5 {
    padding: 5px !important
}

.p-0 {
    padding: 0 !important
}

.pb-30 {
    padding-bottom: 30px !important
}

.pb-20 {
    padding-bottom: 20px !important
}

.pb-15 {
    padding-bottom: 15px !important
}

.pb-10 {
    padding-bottom: 10px !important
}

.pb-0 {
    padding-bottom: 0px !important
}

.pt-30 {
    padding-top: 30px !important
}

.pt-20 {
    padding-top: 20px !important
}

.pt-15 {
    padding-top: 15px !important
}

.pt-10 {
    padding-top: 10px !important
}

.pt-0 {
    padding-top: 0 !important
}

.pl-30 {
    padding-left: 30px !important
}

.pl-20 {
    padding-left: 20px !important
}

.pl-15 {
    padding-left: 15px !important
}

.pl-10 {
    padding-left: 10px !important
}

.pl-0 {
    padding-left: 0px !important
}

.pl-120 {
    padding-left: 120px
}

.pr-30 {
    padding-right: 30px !important
}

.pr-20 {
    padding-right: 20px !important
}

.pr-15 {
    padding-right: 15px !important
}

.pr-10 {
    padding-right: 10px !important
}

.pr-0 {
    padding-right: 0px !important
}

.red-text {
    color: #d03a1c
}

.green-text {
    color: #DAE5E1
}

a.disabled {
    pointer-events: none;
    cursor: default;
    background-color: #9A9B9D
}

a.disabled-popup-button {
    pointer-events: none;
    cursor: default;
    color: #9A9B9D
}

@media only screen and (max-width: 599px) {
    .hidden-ss {
        display: none
    }
}

.no-touch {
    pointer-events: none
}

iframe {
    max-width: 100%
}

.pointer-events-none {
    pointer-events: none
}

.memo-text {
    width: calc(100% - 65px)
}

@media only screen and (max-width: 599px) {
    .hidden-ss {
        display: none
    }
}

.visible-ss {
    display: none
}

@media only screen and (max-width: 599px) {
    .visible-ss {
        display: block
    }
}

.a-space {
    width: 1em;
    display: inline-block
}

.two-space {
    width: 2em;
    display: inline-block
}

.three-space {
    width: 2em;
    display: inline-block
}

.four-space {
    width: 4em;
    display: inline-block
}

.pdl-2 {
    padding-left: 2em
}

@media print and (-ms-high-contrast: none) {
    body {
        font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", "Meiryo UI", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
        font-weight: 500
    }
}

@media print {
    h1 {
        margin-top: 0
    }

    @page {
        margin: 18mm
    }

    @page {
        size: A4
    }

    .visible-block {
        display: block !important
    }

    #header,
    #sidebar,
    #footer,
    .breadcrums,
    .print-invisible,
    .sidemenu,
    .header-cfn,
    .resume-controller,
    footer {
        display: none
    }

    .user-wrapper {
        width: 100% !important
    }

    .mgr-contents,
    .contents {
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important
    }

    .user-contents .user-wrapper {
        margin: 0 !important;
        padding: 0 !important
    }

    .mgr-contents-body {
        padding: 0 !important
    }

    .new-page {
        page-break-before: always
    }

    .resume-preview-information.grid-information {
        display: block
    }

    .print-candidate-area .mgr-container {
        padding-bottom: 0 !important
    }

    .print-candidate-area .print-candidate .resume-preview {
        margin: 0 !important
    }

    .print-candidate-area .print-candidate .resume-preview .resume-preview-information {
        margin: 0.3em !important
    }
}

@media print and (-ms-high-contrast: none) {

    .print-candidate-area .print-candidate .resume-preview .resume-preview-information .resume-basic-info,
    .print-candidate-area .print-candidate .resume-preview .resume-preview-information .resume-other-label,
    .print-candidate-area .print-candidate .resume-preview .resume-preview-information .resume-other-info {
        line-height: 10pt
    }

    .print-candidate-area .print-candidate .resume-preview .resume-preview-information .resume-work-time {
        line-height: 9pt
    }

    .print-candidate-area .print-candidate .resume-preview .resume-preview-information .resume-name,
    .print-candidate-area .print-candidate .resume-preview .resume-preview-information .resume-name strong {
        font-size: 15pt;
        line-height: 18pt
    }

    .print-candidate-area .print-candidate .resume-preview .resume-preview-information .resume-university {
        font-weight: bold;
        line-height: 15pt
    }
}

@media print {
    .resume-preview {
        margin-bottom: 0 !important
    }
}

.register-top {
    margin: 20px 0 50px 0;
    display: -webkit-flex;
    display: flex
}

.register-top .register-top-box {
    *zoom: 1;
    width: 100%;
    box-sizing: border-box;
    border: 1px solid #d8d8d8;
    padding: 20px 30px;
    background-color: #fff
}

.register-top .register-top-box:before,
.register-top .register-top-box:after {
    content: " ";
    display: table
}

.register-top .register-top-box:after {
    clear: both
}

@media only screen and (max-width: 767px) {
    .register-top .register-top-box {
        padding: 20px 10px
    }
}

.register-top .register-top-box h2 {
    font-size: 1.6rem;
    margin: 0 0 20px
}

@media only screen and (max-width: 767px) {
    .register-top .register-top-box h2 {
        margin: 0 0 10px
    }
}

.register-top .register-top-box p {
    font-size: 1.4rem;
    border-top: 1px solid #d8d8d8;
    padding-top: 20px;
    margin: 0
}

.register-top .register-top-box .register-top-box-button-container {
    padding-left: 20px
}

.register-top .register-top-box .register-top-box-forgot {
    padding: 0;
    border: none;
    float: left;
    line-height: normal
}

.register-top .register-top-box .register-top-box-button {
    clear: left;
    *zoom: 1
}

.register-top .register-top-box .register-top-box-button:before,
.register-top .register-top-box .register-top-box-button:after {
    content: " ";
    display: table
}

.register-top .register-top-box .register-top-box-button:after {
    clear: both
}

.register-top .register-top-box .loginform-email-container {
    padding-right: 10px
}

.register-top .register-top-box .loginform-pass-container {
    padding-left: 10px
}

.register-top .register-top-box .md-textfield {
    margin: 15px 0
}

.register-top .register-top-box .md-checkbox {
    float: left;
    margin-bottom: 10px
}

.register-top .register-top-box .button {
    float: left;
    margin: 15px 20px 0 0
}

@media only screen and (max-width: 767px) {
    .register-top .register-top-box .button {
        margin-top: 10px
    }
}

.register-top .register-top-box-left {
    position: relative
}

.register-top .register-top-box-left .button {
    position: absolute;
    left: 30px;
    bottom: 20px
}

@media only screen and (max-width: 767px) {
    .register-top .register-top-box-left .button {
        left: 10px
    }
}

.register-top .register-top-box-right .md-checkbox-label {
    margin-bottom: 0
}

.register-top-sp {
    display: none
}

.register-top-sp .login-link-box .register-top-box-checkbox {
    display: flex
}

.register-top-sp .login-link-box .register-top-box-checkbox .register-top-box-forgot {
    margin-top: 0
}

.register-top-sp .login-link-box .register-top-box-button .button-facebook {
    justify-content: center !important
}

.register-top-sp p {
    font-size: 1.4rem;
    margin: 10px 0 0 0;
    line-height: 1.5
}

.register-top-sp .button {
    margin-top: 10px;
    width: 100%;
    height: 36px
}

.register-top-sp .button::before {
    display: none
}

.private::before {
    content: "lock";
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    font-size: 120%;
    vertical-align: text-bottom;
    margin-right: 5px
}

.select-private {
    display: block
}

.select-private::before {
    content: "lock";
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    font-size: 120%;
    position: absolute;
    top: 3px;
    left: 6px;
    color: #6A6B6D
}

.select-private .md-select-box {
    padding-left: 30px
}

.register-head-container {
    display: flex;
    display: -webkit-flex;
    margin-top: 40px
}

.register-head-container .button {
    margin-right: 20px
}

.register-flow {
    position: relative;
    height: 52px;
    margin: 70px 10px 30px;
    display: flex
}

@media only screen and (max-width: 599px) {
    .register-flow {
        margin-top: 60px
    }
}

.register-flow::before {
    content: "";
    display: block;
    width: 21px;
    height: 21px;
    border-radius: 21px;
    background-color: #3a50c9;
    position: absolute;
    top: -20px;
    left: 0;
    z-index: 1
}

@media only screen and (max-width: 1022px) {
    .register-flow::before {
        width: 11px;
        height: 11px;
        border-radius: 11px;
        background-color: #3a50c9;
        position: absolute;
        top: -15px;
        left: 0
    }
}

.register-flow::after {
    content: "";
    display: none;
    width: 100%;
    height: 2px;
    background-color: #d8d8d8;
    position: absolute;
    top: -10px;
    left: 0px;
    z-index: 0
}

@media only screen and (max-width: 767px) {
    .register-flow::after {
        display: block
    }
}

.register-flow.fluid-width {
    width: 100%;
    margin: 70px 0 30px
}

@media only screen and (max-width: 599px) {
    .register-flow.fluid-width {
        margin-top: 50px
    }
}

.register-flow .register-flow-step {
    box-flex: 1;
    -webkit-box-flex: 1;
    position: relative;
    width: 100%
}

@media only screen and (max-width: 767px) {
    .register-flow .register-flow-step {
        position: static
    }
}

@media only screen and (max-width: 767px) {

    .register-flow .register-flow-step:not(.is-active) span,
    .register-flow .register-flow-step:not(.is-active) p {
        color: transparent
    }
}

.register-flow .register-flow-step:not(.is-active) .shape::before {
    display: none
}

@media only screen and (max-width: 767px) {
    .register-flow .register-flow-step:not(.is-active) .step-name {
        display: none
    }
}

.register-flow .register-flow-step:first-child .shape::before {
    left: 0
}

@media only screen and (max-width: 767px) {
    .register-flow .register-flow-step.is-complete.is-show-status .register-flow-complete {
        display: block
    }
}

.register-flow .register-flow-step.is-complete .register-flow-complete {
    display: block
}

@media only screen and (max-width: 767px) {
    .register-flow .register-flow-step.is-complete .register-flow-complete {
        display: none
    }
}

.register-flow .register-flow-step.is-complete .shape::after {
    background-color: #3a50c9
}

.register-flow .register-flow-step.is-complete span,
.register-flow .register-flow-step.is-complete p {
    color: #3a50c9
}

@media only screen and (max-width: 767px) {

    .register-flow .register-flow-step.is-complete span,
    .register-flow .register-flow-step.is-complete p {
        color: transparent
    }
}

.register-flow .register-flow-step.is-complete span {
    font-weight: bold
}

.register-flow .register-flow-step.is-complete span::before {
    background-color: #3a50c9
}

.register-flow .register-flow-step.is-complete .register-flow-complete {
    color: #DAE5E1
}

.register-flow .register-flow-step.is-active::before {
    content: "edit";
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    display: block;
    width: 100%;
    text-align: center;
    color: #3a50c9;
    position: absolute;
    top: -40px
}

@media only screen and (max-width: 767px) {
    .register-flow .register-flow-step.is-active::before {
        display: none
    }
}

.register-flow .register-flow-step.is-active .shape::after {
    background-color: #3a50c9
}

.register-flow .register-flow-step.is-active span {
    font-weight: bold
}

@media only screen and (max-width: 767px) {
    .register-flow .register-flow-step.is-active span {
        font-weight: normal
    }
}

.register-flow .register-flow-step.is-active span::before {
    background-color: #3a50c9
}

.register-flow .register-flow-step.is-active span,
.register-flow .register-flow-step.is-active p {
    color: #3a50c9
}

@media only screen and (max-width: 767px) {

    .register-flow .register-flow-step.is-active span,
    .register-flow .register-flow-step.is-active p {
        color: #fff
    }
}

.register-flow .register-flow-step.is-active .register-flow-complete {
    color: #DAE5E1
}

@media only screen and (max-width: 767px) {
    .register-flow .register-flow-step .step-name {
        padding: 2px 5px;
        position: absolute;
        left: 0;
        right: 0;
        top: 11px;
        background-color: #3a50c9;
        text-align: left
    }
}

.register-flow .register-flow-step .shape {
    display: block;
    position: relative
}

.register-flow .register-flow-step .shape::after {
    content: "";
    display: block;
    width: 21px;
    height: 21px;
    border-radius: 21px;
    background-color: #d8d8d8;
    position: absolute;
    top: -20px;
    right: 0;
    z-index: 1
}

@media only screen and (max-width: 1022px) {
    .register-flow .register-flow-step .shape::after {
        width: 11px;
        height: 11px;
        border-radius: 11px;
        top: -15px;
        right: 0
    }
}

@media only screen and (max-width: 767px) {
    .register-flow .register-flow-step .shape:before {
        content: "";
        position: absolute;
        border-style: solid;
        border-width: 0 5px 15px;
        border-color: #3a50c9 transparent;
        display: block;
        width: 0;
        z-index: 1;
        top: -4px;
        left: -11px
    }
}

.register-flow .register-flow-step span {
    display: block;
    text-align: center
}

@media only screen and (max-width: 767px) {
    .register-flow .register-flow-step span {
        text-align: left;
        display: inline-block;
        font-size: 1.2rem
    }

    .register-flow .register-flow-step span:after {
        content: ":"
    }
}

.register-flow .register-flow-step span::before {
    content: "";
    display: block;
    width: 100%;
    height: 2px;
    background-color: #d8d8d8;
    position: absolute;
    top: -10px;
    left: 0px;
    z-index: 0
}

@media only screen and (max-width: 767px) {
    .register-flow .register-flow-step span::before {
        display: none
    }
}

.register-flow .register-flow-step p {
    margin: 0;
    text-align: center;
    font-size: 1.4rem;
    color: #000
}

@media only screen and (max-width: 767px) {
    .register-flow .register-flow-step p {
        text-align: left;
        display: inline-block;
        font-size: 1.2rem
    }
}

.register-flow .register-flow-step .register-flow-complete {
    position: absolute;
    top: -40px;
    width: 100%;
    font-weight: bold;
    display: none
}

@media only screen and (max-width: 767px) {
    .register-flow .register-flow-step .register-flow-complete {
        border: 1px solid #DAE5E1;
        font-size: 1.2rem;
        padding: 2px 5px;
        top: -50px;
        display: none;
        left: 0;
        right: 0
    }
}

.note {
    top: 10px;
    border: none;
    padding: 0;
    margin: 8px 0;
    font-size: 1.4rem
}

.note span.orange {
    color: #e67e22;
    border-bottom: 1px solid #e67e22
}

.note span.blue {
    color: #3a50c9;
    border-bottom: 1px solid #3a50c9
}

.register-contents {
    background-color: #fff;
    border: 1px solid #d8d8d8;
    padding: 20px 40px 40px 40px;
    margin-top: 20px
}

@media only screen and (max-width: 767px) {
    .register-contents {
        border: 0
    }
}

.register-contents h2 {
    margin-top: 30px;
    padding: 10px 30px;
    background-color: #3a50c9;
    line-height: 1;
    color: #fff;
    font-size: 1.8rem
}

.register-contents .register-contents-head {
    margin-top: 30px
}

.register-contents .register-contents-head:first-child {
    margin: 0
}

.register-contents .button-delete {
    border: none;
    background-color: #d8d8d8;
    color: #6A6B6D
}

.register-contents .button-delete span {
    padding-left: 1.6rem
}

.register-contents .button-delete span::before {
    content: "remove";
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    display: block;
    font-size: 1.4rem;
    position: absolute;
    top: 0px
}

.register-contents .button-delete::before {
    display: none
}

.register-contents .add-address {
    position: relative;
    top: 4px
}

.register-contents .add-address::before {
    content: "add";
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    font-size: 1.4rem
}

@media only screen and (min-width: 598px) {
    .register-contents .profile-add-tel {
        display: flex;
        align-items: center;
        margin: 0 0 8px
    }

    .register-contents .profile-add-tel>.button.button-add {
        margin: 0 10px 0 0
    }

    .register-contents .profile-add-tel>p {
        clear: none;
        padding: 0
    }
}

.register-contents .profile-add-tel>p {
    clear: both;
    margin: 0;
    padding-right: 30px
}

@media only screen and (max-width: 599px) {
    .register-contents .register-row .md-textfield.profile-no-zipcode {
        margin-top: 0
    }
}

.register-contents .register-row .md-textfield.profile-no-zipcode>p {
    padding-top: 10px;
    margin: 0
}

@media only screen and (max-width: 599px) {
    .register-contents .register-row .md-textfield.profile-no-zipcode>p {
        padding-top: 0
    }
}

.register-contents .register-row .text-note {
    clear: both
}

.register-contents .button-add {
    clear: left;
    margin-top: 10px;
    width: 180px;
    font-size: 1.3rem;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s
}

.register-contents .button-add:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.register-contents .button-add:hover,
.register-contents .button-add:focus,
.register-contents .button-add:active {
    color: #fff
}

.register-contents .button-add::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -66px;
    left: 0px;
    border-radius: 100%;
    background-color: #3a50c9;
    width: 160px;
    height: 160px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

.register-contents .button-add:hover::before,
.register-contents .button-add:focus::before,
.register-contents .button-add:active::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.register-contents .button-add span {
    padding-left: 1.6rem
}

.register-contents .button-add span::before {
    content: "add";
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    display: block;
    font-size: 1.4rem;
    position: absolute;
    top: 1px
}

.register-contents .button-delete {
    clear: left;
    margin-top: 10px;
    width: 70px;
    border: none;
    background-color: #d8d8d8;
    color: #6A6B6D;
    margin-right: 10px;
    font-size: 1.3rem
}

.register-contents .button-delete span {
    padding-left: 1.6rem
}

.register-contents .button-delete span::before {
    content: "remove";
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    display: block;
    font-size: 1.4rem;
    position: absolute;
    top: 1px
}

.register-contents .button-delete::before {
    display: none
}

.register-video-box {
    display: flex;
    align-items: center
}

.register-all-videos {
    margin: 25px 0 20px;
    display: flex;
    align-items: center
}

@media only screen and (max-width: 767px) {
    .register-all-videos {
        justify-content: flex-end;
        margin: 20px 0 0
    }
}

@media only screen and (max-width: 599px) {
    .register-all-videos {
        display: block
    }
}

@media only screen and (max-width: 599px) {
    .register-all-videos>span {
        display: block;
        float: none;
        margin: 0 0 5px
    }
}

.register-all-videos>.button {
    display: inline-block;
    text-align: center
}

@media only screen and (max-width: 480px) {
    .register-all-videos>.button {
        display: block;
        width: 100%;
        text-align: center
    }
}

.register-all-videos .button-add-video {
    width: 260px
}

@media only screen and (max-width: 599px) {
    .col-xs-12 .button-upload-video {
        width: 260px;
        margin-left: 0
    }
}

.button-upload-video {
    margin: 30px auto 20px 0
}

@media only screen and (max-width: 767px) {
    .button-upload-video {
        margin: 15px auto 20px 0
    }
}

@media only screen and (max-width: 480px) {
    .button-upload-video {
        display: block;
        text-align: center;
        width: 100%;
        line-height: 28px
    }
}

.button-upload-video:visited {
    color: #3A50C9
}

.button-upload-video:hover {
    color: #fff
}

.register-note {
    position: relative;
    border: 1px solid #3a50c9;
    font-size: 1.6rem;
    padding: 6px 10px 6px 48px;
    color: #3a50c9;
    margin: 40px 0 30px 0
}

.register-note::before {
    content: "warning";
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    font-size: 2.4rem;
    position: absolute;
    left: 14px
}

@media only screen and (max-width: 767px) {
    .register-note span {
        display: block;
        font-size: 1.2rem;
        margin: 5px 0 0
    }
}

.register-row {
    *zoom: 1;
    padding: 10px 30px
}

.register-row:before,
.register-row:after {
    content: " ";
    display: table
}

.register-row:after {
    clear: both
}

@media only screen and (max-width: 991px) {
    .register-row {
        padding: 10px 15px
    }
}

.register-row .error {
    color: #d03a1c;
    margin: 0;
    font-weight: bold
}

.register-row .md-textfield,
.register-row .md-select,
.register-row .md-switch {
    box-sizing: border-box;
    width: 50%;
    float: left;
    padding-right: 40px
}

.register-row .md-textfield.w-100-percent {
    width: 100%
}

.register-row .mt-5px {
    margin-top: 5px
}

.register-row .md-textfield {
    margin: 19px 0 20px 0
}

.register-row .md-switch {
    padding-top: 20px
}

.register-row .md-switch p {
    font-size: 1.4rem;
    display: inline-block;
    width: 80%
}

.register-row .md-textarea {
    width: 100%;
    padding-right: 40px
}

.register-row .md-radio {
    position: relative;
    float: left;
    margin: 20px 0;
    padding-right: 30px
}

.register-row .md-radio span {
    display: inline-block;
    margin: 0 20px 0 5px
}

.register-row .md-select {
    margin: 20px 0
}

.register-row .md-select::after {
    right: 40px
}

@media only screen and (max-width: 767px) {
    .register-row .md-select::after {
        right: 30px
    }
}

.register-row .md-checkbox {
    padding: 20px 0
}

.register-row .work_experience_radio {
    margin: 13px 0 5px 0
}

.register-double-major {
    display: none
}

.register-additional-education .button-delete {
    width: 160px;
    display: flex
}

.register-additional-education .button-add {
    width: 160px
}

.register-privacy {
    margin: 30px;
    text-align: center
}

.register-privacy .md-checkbox {
    display: inline-block
}

.register-leave {
    text-align: right;
    margin-top: 10px
}

@media only screen and (max-width: 599px) {
    .register-leave {
        margin: 0;
        font-size: 1.1rem
    }
}

.register-next {
    padding: 30px 0
}

.register-next .button {
    margin: 0 auto;
    width: 280px;
    height: 36px;
    font-size: 1.4rem;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s
}

.register-next .button:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.register-next .button:hover,
.register-next .button:focus,
.register-next .button:active {
    color: #fff
}

.register-next .button::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -122px;
    left: 0px;
    border-radius: 100%;
    background-color: #3a50c9;
    width: 280px;
    height: 280px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

.register-terms {
    padding: 10px;
    color: #000
}

.register-terms .register-terms-content {
    width: 100%;
    height: 140px;
    overflow: auto;
    padding: 15px;
    resize: none
}

.register-button-wrapper {
    padding-left: 20px
}

@media only screen and (max-width: 991px) {
    .register-button-wrapper {
        padding: 10px
    }
}

@media only screen and (max-width: 767px) {
    .register-button-wrapper {
        padding: 10px 0
    }
}

.register-button-wrapper .button-delete {
    width: 140px
}

.register-add-education {
    *zoom: 1;
    margin: 10px 30px
}

.register-add-education:before,
.register-add-education:after {
    content: " ";
    display: table
}

.register-add-education:after {
    clear: both
}

.register-add-education .button {
    margin-bottom: 10px
}

.register-address-addition {
    display: none
}

.register-block-lead {
    font-size: 1.4rem;
    margin: 30px 0;
    color: #000
}

.register-block-list {
    margin: 0 auto;
    background-color: #F5F9FA;
    padding: 30px;
    max-width: 768px
}

.register-block-list p {
    font-size: 1.4rem;
    color: #000
}

.register-block-list ul {
    font-size: 1.2rem;
    padding-left: 30px
}

.register-block-list ul li {
    position: relative;
    margin-top: 20px
}

.register-block-list .company-block-name {
    display: block
}

@media only screen and (min-width: 598px) {
    .register-block-list .company-block-name {
        width: calc(100% - 115px)
    }
}

@media only screen and (max-width: 599px) {
    .register-block-list .company-block-name {
        width: 100%
    }
}

.register-block-list .button-delete {
    display: flex;
    position: absolute;
    top: 0px;
    right: 15px;
    width: 90px;
    height: 24px;
    margin: 0
}

@media only screen and (max-width: 599px) {
    .register-block-list .button-delete {
        position: static;
        margin-top: 10px
    }
}

.register-qa {
    margin: 40px 0;
    position: relative;
    word-break: break-word
}

.register-qa.register-qa-disabled {
    background-color: #ccc
}

.register-qa.register-qa-disabled textarea {
    background-color: transparent
}

.register-qa~.register-qa {
    margin: 0 0 40px
}

@media only screen and (max-width: 1022px) {
    .register-qa~.register-qa {
        margin: 0 0 20px
    }
}

@media only screen and (max-width: 1022px) {
    .register-qa {
        margin: 20px 0
    }
}

.register-qa.is-ok h3:after {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    color: #fff;
    font-size: 1.6rem;
    text-align: center;
    line-height: 20px;
    content: "done";
    display: block;
    background-color: #DAE5E1;
    width: 20px;
    height: 20px;
    position: absolute;
    border-radius: 20px;
    top: 0px;
    right: 10px;
    top: 3px
}

.register-qa .disabled-question .md-radio-label:before {
    background-color: #9A9B9D
}

.register-qa .disabled-question .md-checkbox-label:before {
    border-right: 3px solid #9A9B9D;
    border-bottom: 3px solid #9A9B9D
}

.register-qa .disabled-question .md-radio-label:after {
    border: 2px solid #9A9B9D
}

.register-qa .disabled-question .md-checkbox-label:after {
    border: 2px solid #9A9B9D
}

.register-qa .checkbox-question .md-checkbox {
    position: static;
    padding: 0
}

.register-qa .checkbox-question .md-checkbox:before {
    top: 2px
}

.register-qa .md-radio {
    position: static;
    padding: 0
}

@media only screen and (max-width: 1022px) {
    .register-qa .md-radio {
        padding-right: 25px
    }
}

.register-qa .md-radio:before {
    top: 2px
}

@media only screen and (max-width: 599px) {
    .register-qa .md-radio .md-radio-label {
        padding-right: 10px
    }
}

.register-qa .md-radio.is-ok::before,
.register-qa .md-radio.is-ng::before,
.register-qa .md-textfield.is-ok::before,
.register-qa .md-textfield.is-ng::before {
    right: 0
}

.register-qa h3 {
    font-weight: normal;
    margin: 0 0 20px;
    padding-right: 40px;
    line-height: 1.5em;
    display: inline-block;
    position: relative
}

.register-qa>div {
    box-sizing: border-box;
    margin-left: 30px;
    margin-bottom: 0
}

@media only screen and (max-width: 1022px) {
    .register-qa>div {
        margin-left: 0
    }
}

.register-qa>div.md-textfield {
    padding-right: 30px
}

.register-qa .md-textarea.pr-40 {
    position: relative
}

.register-qa .md-textarea.pr-40 .text-counter~p {
    position: absolute;
    top: 100%;
    right: 40px
}

.register-qa .md-textfield {
    display: block
}

.register-thanks {
    padding-top: 30px;
    font-size: 1.4rem;
    margin: 0 15% 40px 15%;
    text-align: center
}

@media only screen and (max-width: 599px) {
    .register-thanks {
        margin: 0 10px 10px
    }
}

.account-setting {
    margin-top: 0
}

.account-setting [ng\:cloak],
.account-setting [ng-cloak],
.account-setting [data-ng-cloak],
.account-setting [x-ng-cloak],
.account-setting .ng-cloak,
.account-setting .x-ng-cloak {
    display: none !important
}

.account-setting .register-block-list {
    margin: 0
}

.cf-popup {
    max-height: 60%
}

.cf-popup-register {
    height: 300px;
    overflow-x: hidden;
    overflow-y: scroll
}

.cf-popup-register .cf-popup-contents {
    overflow: auto
}

.cf-popup-register .cfn-privacy-box .ol-style-1 {
    padding-left: 0
}

.cf-popup-register .cfn-privacy-box .ol-style-1 .link-privacy a {
    word-break: break-word
}

.cf-popup-register .grid-information dt {
    width: 150px
}

.cf-popup-register .grid-information dd {
    width: calc(100% - 150px)
}

.register-complete-message-sp {
    display: none
}

.register-complete-message-sp {
    position: relative;
    display: none;
    border: 1px solid #DAE5E1;
    color: #DAE5E1;
    padding: 5px 10px;
    margin-top: 20px
}

.register-complete-message-sp::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    color: #fff;
    font-size: 1.6rem;
    text-align: center;
    line-height: 20px;
    content: "done";
    display: block;
    background-color: #DAE5E1;
    width: 20px;
    height: 20px;
    position: absolute;
    border-radius: 20px;
    top: 0px;
    right: 10px;
    top: 6px
}

.note {
    top: 10px;
    border: none;
    padding: 0;
    margin: 8px 0;
    font-size: 1.4rem
}

.note span.orange {
    color: #e67e22;
    border-bottom: 1px solid #e67e22
}

.note span.blue {
    color: #3a50c9;
    border-bottom: 1px solid #3a50c9
}

.note-font {
    top: 10px;
    border: none;
    padding: 0;
    margin: 8px 0;
    font-size: 1.4rem;
    font-weight: bold
}

#register-form .register-terms {
    height: 150px;
    overflow-y: scroll;
    overflow-x: hidden;
    border: 1px solid #babcbe;
    margin: 10px 30px;
    padding-left: 10px
}

#register-form .register-terms.active {
    border: 1px solid #3a50c9
}

@media only screen and (min-width: 992px) {
    #register-form .register-terms {
        margin: 10px 30px
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    #register-form .register-terms {
        margin: 10px 15px
    }
}

@media only screen and (max-width: 767px) {
    #register-form .register-terms {
        margin: 10px 0
    }
}

#register-form .register-terms .cf-custom-content-03 ul,
#register-form .register-terms .cf-custom-content-03 li {
    font-size: 1.2rem
}

#register-form .register-terms .cf-custom-content-03 h2 {
    font-size: 1.2em;
    margin: 0 5px 0 0;
    padding: 0;
    font-weight: bold;
    line-height: normal;
    color: #000;
    background-color: #fff
}

#register-form .register-terms .cf-custom-content-03 h3 {
    font-size: 0.95em
}

#register-form .register-terms .cf-custom-content-03 h5 {
    font-size: 0.8em;
    font-weight: bold
}

#register-form .register-terms .cf-custom-content-03 h4 {
    font-weight: bold;
    font-size: 0.9em
}

#register-form .register-terms .cf-custom-content-03 p {
    font-size: 1.2rem;
    line-height: 1.8;
    margin-bottom: 2em;
    text-align: justify
}

.apply-target-entry-top {
    margin: 40px 0 50px 0
}

.apply-target-entry-top .resume-cf-box img {
    width: auto;
    height: 35px
}

.no-padding {
    padding: 0
}

@media only screen and (max-width: 1022px) {
    .register-top {
        display: block
    }
}

@media only screen and (max-width: 599px) {
    .register-top {
        display: none
    }
}

.register-top .register-top-box+.register-top-box {
    margin-left: 15px
}

@media only screen and (max-width: 1022px) {
    .register-top .register-top-box {
        width: 100%;
        margin-bottom: 20px;
        margin-left: 0
    }
}

@media only screen and (max-width: 599px) {
    .register-top .register-top-box {
        padding: 20px
    }
}

@media only screen and (max-width: 599px) {
    .register-top .register-top-box-right .button {
        width: 170px;
        margin: 10px 0 0 0
    }
}

@media only screen and (max-width: 599px) {
    .register-top .register-top-box-right .button:first-child {
        width: 100px;
        margin-right: 10px
    }
}

@media only screen and (max-width: 1022px) {
    .register-top .register-top-box-left {
        margin-right: 0;
        padding-bottom: 70px
    }
}

@media only screen and (max-width: 599px) {
    .register-top .register-top-box-left {
        padding: 0;
        border: none
    }
}

@media only screen and (max-width: 599px) {
    .register-top .register-top-box-left h2 {
        display: none
    }
}

@media only screen and (max-width: 599px) {
    .register-top .register-top-box-left .button {
        display: none
    }
}

@media only screen and (max-width: 599px) {
    .register-top .register-top-box-left p {
        border: none;
        font-size: 1.2rem
    }
}

@media only screen and (max-width: 599px) {
    .register-top-sp {
        display: block
    }
}

@media only screen and (max-width: 599px) {
    .register-complete-message-sp {
        display: block
    }
}

@media only screen and (max-width: 1022px) {
    .register-contents {
        margin-top: 20px;
        padding: 0
    }
}

@media only screen and (max-width: 1022px) {
    .register-contents h2 {
        margin: 0;
        padding-left: 20px
    }
}

@media only screen and (max-width: 1022px) {
    .register-contents.notify-box {
        padding: 20px 15px
    }

    .register-contents.notify-box h2 {
        margin: 0 0 20px;
        padding: 10px;
        font-size: 1.6rem
    }
}

@media only screen and (max-width: 599px) {
    .register-contents.notify-box {
        padding: 10px
    }
}

@media only screen and (max-width: 1022px) {
    .register-contents .note {
        padding-left: 20px
    }
}

@media only screen and (max-width: 1022px) {
    .register-contents .register-contents-head {
        margin: 0
    }
}

@media only screen and (max-width: 1022px) {
    .register-inner {
        padding: 20px
    }
}

@media only screen and (max-width: 767px) {
    .register-inner {
        padding: 20px 15px 30px
    }
}

@media only screen and (max-width: 599px) {
    .register-inner {
        padding: 15px 10px
    }
}

.register-inner .md-switch-wrap {
    margin-top: 8px
}

.register-inner .account-setting-status {
    margin-top: 23px
}

.register-inner .service-scout-link {
    padding-left: 20px
}

@media only screen and (max-width: 1022px) {
    .register-note {
        font-size: 1.4rem;
        padding: 6px 10px 6px 48px;
        margin: 0 0 20px 0
    }
}

@media only screen and (max-width: 767px) {
    .register-row {
        padding: 0
    }

    .register-row:hover {
        background-color: transparent
    }

    .register-row .md-textfield,
    .register-row .md-select {
        width: 100%;
        float: none;
        padding-right: 30px
    }

    .register-row .md-textfield:before,
    .register-row .md-select:before {
        right: 0
    }

    .register-row .button {
        float: left;
        clear: none;
        margin-bottom: 20px
    }

    .register-row .button-delete {
        margin-top: 0;
        margin-right: 10px
    }

    .register-row .button-add {
        margin-top: 0
    }
}

@media only screen and (max-width: 1022px) {
    .register-add-education {
        padding-left: 0;
        margin: 0
    }
}

@media only screen and (max-width: 1022px) {
    .register-privacy {
        margin: 0
    }

    .register-privacy .md-checkbox {
        margin: 0
    }
}

@media only screen and (max-width: 1022px) {
    .register-next {
        padding: 30px 0
    }

    .register-next .button {
        margin: 0 auto;
        width: 200px;
        height: 36px;
        font-size: 1.4rem;
        position: relative;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        overflow: hidden;
        -moz-osx-font-smoothing: grayscale;
        position: relative;
        -webkit-transition-property: all;
        transition-property: all;
        -webkit-transition-duration: 0.1s;
        transition-duration: 0.1s
    }

    .register-next .button:hover::before {
        -webkit-transform: scale(2);
        transform: scale(2);
        opacity: 1
    }

    .register-next .button:hover,
    .register-next .button:focus,
    .register-next .button:active {
        color: #fff
    }

    .register-next .button::before {
        content: "";
        display: block;
        position: absolute;
        z-index: -1;
        top: -82px;
        left: 0px;
        border-radius: 100%;
        background-color: #3a50c9;
        width: 200px;
        height: 200px;
        -webkit-transform: scale(0);
        transform: scale(0);
        -webkit-transition-property: transform;
        transition-property: transform;
        -webkit-transition-duration: 0.3s;
        transition-duration: 0.3s;
        -webkit-transition-property: all;
        transition-property: all;
        -webkit-transition-timing-function: ease-out;
        transition-timing-function: ease-out;
        opacity: 0.2
    }
}

@media only screen and (max-width: 1022px) and (max-width: 599px) {
    .register-next .button {
        height: 30px;
        width: 250px
    }
}

@media only screen and (max-width: 1022px) {
    .register-next {
        padding: 15px 0 30px
    }
}

@media only screen and (max-width: 767px) {
    .register-next {
        padding: 15px 0
    }
}

@media only screen and (max-width: 1022px) {
    .register-block-lead {
        margin: 20px 0
    }
}

@media only screen and (max-width: 599px) {
    .register-block-lead {
        margin: 5px 0
    }
}

@media only screen and (max-width: 1022px) {
    .register-block-list {
        padding: 10px 10px 20px
    }

    .register-block-list ul {
        padding-left: 20px
    }

    .register-block-list ul li {
        *zoom: 1
    }

    .register-block-list ul li:before,
    .register-block-list ul li:after {
        content: " ";
        display: table
    }

    .register-block-list ul li:after {
        clear: both
    }
}

@media only screen and (max-width: 599px) {
    .register-block-list {
        position: relative
    }
}

@media only screen and (max-width: 599px) {
    .register-privacy {
        text-align: left
    }
}

@media only screen and (max-width: 1022px) {
    .cf-popup {
        width: 90%;
        left: 5%
    }
}

@media only screen and (max-width: 1022px) {
    .cf-popup-contents {
        padding-left: 10px;
        padding-right: 10px
    }
}

@media only screen and (max-width: 1022px) {
    .cf-popup-form-box {
        padding: 0 15px
    }
}

@media only screen and (max-width: 1022px) {
    .cf-popup-register {
        height: 250px
    }
}

@media only screen and (max-width: 1022px) {
    .cf-popup-register .grid-information {
        display: block
    }

    .cf-popup-register .grid-information dt {
        border: none;
        padding: none
    }

    .cf-popup-register .grid-information dt::after,
    .cf-popup-register .grid-information dt::before {
        display: none
    }

    .cf-popup-register .grid-information dd {
        width: 100%;
        padding: 0 0 8px 0;
        margin-bottom: 10px;
        border-bottom: 1px solid #d8d8d8
    }
}

.note-experience {
    font-size: 1.0rem;
    margin-top: 0px;
    color: #DD0E1B
}

#register-form #license-modal {
    overflow: hidden;
    height: 100%;
    width: 100%;
    z-index: 9999
}

#register-form #license-modal .cf-custom-content-03 ul,
#register-form #license-modal .cf-custom-content-03 li {
    font-size: 1.2rem
}

#register-form #license-modal .cf-custom-content-03 h2 {
    font-size: 1.2em;
    margin: 0 5px 0 0;
    padding: 0;
    font-weight: bold;
    line-height: normal;
    color: #000;
    background-color: #fff
}

#register-form #license-modal .cf-custom-content-03 h3 {
    font-size: 0.95em
}

#register-form #license-modal .cf-custom-content-03 h5 {
    font-size: 0.8em;
    font-weight: bold
}

#register-form #license-modal .cf-custom-content-03 h4 {
    font-weight: bold;
    font-size: 0.9em
}

#register-form #license-modal .cf-custom-content-03 p {
    font-size: 1.2rem;
    line-height: 1.8;
    margin-bottom: 2em;
    text-align: justify
}

html.modal-open,
body.modal-open {
    overflow: hidden
}

.cfn-press-switch {
    margin-left: 15px
}

.user-history .user-box-title .cf-title {
    width: 29px
}

.page-resume .common-note,
.page-resume .contact-address-tip,
.page-resume .register-row.postal-code-field .note {
    font-size: 1.0rem;
    margin: 4px 0 0 0;
    clear: both
}

.page-resume .button-add span:before {
    content: "add"
}

.page-resume .button-delete {
    display: flex
}

.page-resume .button-delete span:before {
    content: "remove"
}

.page-resume .edit_user dt {
    padding: 15px 0px
}

.page-resume #user_m_work_experience_id option[value=""]:first-child {
    display: none
}

.page-resume .tels .country-code-select option:first-child {
    display: none
}

.page-resume .language-select option:first-child {
    display: none
}

.page-resume .md-checkbox.is_received_scout {
    margin-bottom: 20px
}

.page-resume .md-select.optional .md-select-box {
    border-top: 1px solid #89ABE3;
    border-left: 1px solid #89ABE3;
    border-right: 1px solid #89ABE3
}

.page-resume .custom-select>option[value=""] {
    display: none
}

.page-resume .md-textfield-input+p.note {
    font-size: 1.0rem;
    margin: 4px 0 0 0
}

.page-resume .md-switch {
    padding-top: 20px
}

.page-resume .md-switch .public-status {
    display: inline-block;
    margin-left: 18px;
    font-size: 1.4rem
}

@media only screen and (max-width: 767px) {
    .page-resume .md-switch .public-status {
        font-size: 1rem;
        margin-left: 10px
    }

    .page-resume .md-switch .public-status>span {
        text-align: center
    }
}

.page-resume .md-switch .public-status .is-open {
    color: #25B665
}

.page-resume .md-switch .public-status .is-private {
    color: #3984C4
}

.page-resume .md-switch .service-scout-link {
    display: inline-block;
    margin-left: 30px
}

@media only screen and (max-width: 767px) {
    .page-resume .md-switch .service-scout-link {
        margin-left: 10px;
        font-size: 1rem
    }
}

.page-resume .md-textarea .address2 {
    height: 64px
}

.page-resume .contact-address-tip {
    display: inline-block;
    font-weight: normal;
    margin: 5px 3px 0px 0px
}

.page-resume .edu-detail-tip,
.page-resume .self-pr-tip {
    font-size: 1.0rem;
    margin-bottom: 0px;
    width: calc(100% - 40px)
}

.page-resume .note-required {
    color: #d03a1c
}

.page-resume .md-textfield.university-name {
    width: 100%
}

.wrap-register {
    margin-bottom: 20px
}

@media print {
    .resume-preview {
        border-right: none;
        border-left: none
    }
}

.resume-preview.edit-user-preview {
    padding: 0;
    border: 0
}

.resume-preview.edit-user-preview .resume-preview-box,
.resume-preview.edit-user-preview .setting-public-resume-wrapper {
    border: 1px solid #d8d8d8;
    margin: 20px 0
}

.resume-preview.edit-user-preview .resume-preview-box {
    padding: 30px 40px
}

.resume-preview.edit-user-preview .setting-public-resume-wrapper {
    padding: 0 40px
}

@media only screen and (max-width: 991px) {
    .resume-preview.edit-user-preview .setting-public-resume-wrapper {
        padding: 0 20px
    }
}

@media only screen and (max-width: 767px) {
    .resume-preview.edit-user-preview .setting-public-resume-wrapper {
        padding: 0 10px
    }
}

.resume-preview.edit-user-preview .setting-public-resume-wrapper .public-status>span {
    min-width: 98px;
    position: relative;
    display: inline-block
}

@media only screen and (max-width: 767px) {
    .resume-preview.edit-user-preview .setting-public-resume-wrapper .public-status>span {
        min-width: auto
    }
}

.resume-preview.edit-user-preview .setting-public-resume-wrapper .public-status>span:before {
    content: attr(data-text);
    display: block;
    position: absolute;
    bottom: 100%;
    left: 0;
    right: 0;
    color: #6A6B6D;
    font-size: .7em;
    text-align: center
}

.register-row .industry-id-select-box optgroup {
    background: #f0f0f0;
    font-weight: bolder
}

.register-row .industry-id-select-box optgroup option {
    background: #ffffff
}

.resume-preview .resume-preview-information .resume-name,
.resume-preview .resume-preview-information .resume-name strong {
    font-size: 16pt;
    font-weight: bold
}

.resume-preview .resume-preview-information dt.resume-basic-info {
    padding-left: 0
}

.resume-preview .resume-preview-information dd.resume-other-info {
    padding-left: 6mm
}

.resume-preview .resume-preview-information .resume-basic-info {
    margin-top: 0;
    margin-bottom: 0;
    font-weight: normal
}

.resume-preview .resume-preview-information .resume-basic-info.resume-tel-and-skype {
    display: flex !important
}

.resume-preview .resume-preview-information .resume-work strong,
.resume-preview .resume-preview-information .resume-university,
.resume-preview .resume-preview-information .resume-university strong {
    font-size: 11pt;
    font-weight: bold
}

.resume-preview .resume-preview-information .resume-other-info,
.resume-preview .resume-preview-information .resume-other-label {
    margin-top: 0;
    margin-bottom: 0;
    padding-left: 0
}

.resume-preview .resume-preview-information .resume-other-label {
    font-weight: normal
}

.resume-preview .resume-preview-information .resume-work-time {
    text-align: right;
    padding-right: 10px
}

@media only screen and (max-width: 599px) {
    .resume-preview .resume-preview-information .resume-work-time {
        text-align: left
    }
}

.resume-preview .resume-preview-information .line-height-basic {
    line-height: 9pt
}

.resume-view .resume-preview-heading {
    font-size: 11pt;
    font-weight: bold;
    color: #000
}

.resume-view {
    padding: 0px
}

.resume-view.resume-view-box .resume-preview-heading {
    margin-top: 3mm;
    margin-left: 20px
}

.resume-view.resume-view-box .resume-preview-information dt,
.resume-view.resume-view-box .resume-preview-information dd {
    font-size: 1.2rem;
    margin-top: 0;
    margin-bottom: 0;
    padding-left: 6mm;
    font-weight: normal;
    word-break: normal;
    color: #333333
}

.resume-view.resume-view-box .resume-preview-information dd .clearfix br {
    display: block;
    content: "";
    margin-top: 0
}

.resume-view.resume-view-box .break-word {
    word-break: break-word
}

.page-resume .resume-view .resume-preview-heading {
    margin-left: 10px;
    margin-top: 3mm
}

.cfn-tab-content-style-2 .resume-preview-information dd .simple-format p {
    margin-bottom: 0;
    word-break: break-word;
    float: left
}

.cfn-tab-content-style-2 .resume-preview-information dd .simple-format p br {
    display: block;
    content: "";
    margin-top: 0
}

.surveys-content .button::before {
    width: 300px;
    height: 180px
}

@media only screen and (max-width: 767px) {
    .pw-settings-label-sp {
        color: #9A9B9D;
        font-size: 1.2rem
    }
}

.user-video .user-box-inner .user-box-title {
    min-height: 150px
}

.user-video.gray .md-checkbox-label {
    cursor: default
}

.user-video.gray .md-checkbox-label:hover:after {
    border-color: #9A9B9D
}

.user-video:first-child {
    margin-top: 0
}

.video-register-contents .user-video .user-box-title {
    border-bottom: 1px solid #d8d8d8;
    min-height: 160px
}

.video-register-contents .user-video .user-box-title.user-video-box {
    border-bottom: 0px
}

.cf-info .cf-info-image>img {
    width: 878px;
    height: 160px
}

.cf-info .cf-info-title>img {
    width: 100%;
    max-height: 30px
}

.cf-info .cf-info-image p {
    font-size: 2.1rem;
    margin-bottom: 0
}

.sidemenu .cf-ad img {
    width: 280px;
    height: 140px
}

.cf-ad-banner img {
    width: 100%;
    height: auto
}

.top-contents .contents .cf-mainvisual {
    margin: 5px 0px;
    clear: both
}

.top-contents .top-wrapper .sidemenu.no-banner {
    margin-top: 5px
}

.top-venue-map li a span.before-organize {
    color: #3A50C9;
    border-color: #3A50C9
}

.top-venue-map li a span.before-organize:hover {
    color: #fff;
    background: #3A50C9
}

.top-venue-map li a span.after-organize {
    color: #6A6B6D;
    border-color: #6A6B6D
}

.top-venue-map li a span.after-organize:hover {
    color: #fff;
    background: #6A6B6D
}

.cf-custom-content-02 .button::before {
    width: 300px;
    height: 220px
}

@media only screen and (min-width: 768px) {

    .cf-entry .cf-info-prepare-text,
    .cf-entry .cf-info-finished-text {
        position: absolute;
        bottom: 20px;
        right: 15px;
        width: calc(100% - 273px - 56px)
    }
}

.content-banner {
    clear: both
}

.content-banner .banner-long {
    clear: both
}

.content-banner .banner-long a {
    display: block
}

.content-banner .square-banner {
    clear: both
}

.content-banner .square-banner a {
    display: block
}

.content-banner .square-banner.banner-col-1 .cf-ad {
    width: 50%;
    text-align: left
}

.content-banner .square-banner.banner-col-2 .cf-ad {
    width: calc(50% - 5px);
    float: left
}

.content-banner .square-banner.banner-col-2 .cf-ad:nth-child(2) {
    float: right
}

.content-banner .text-banner {
    clear: both
}

.content-banner img {
    max-width: 100%;
    margin: 0 auto
}

@media only screen and (max-width: 1022px) {
    .square_banner_left {
        display: none
    }

    .square-banner {
        display: block;
        padding-top: 15px;
        width: 100%;
        float: left
    }

    .square-banner img {
        max-width: 280px;
        max-height: 140px;
        width: 100%
    }
}

@media only screen and (max-width: 480px) {
    .banner-col-2 img {
        max-height: 100px
    }
}

@media only screen and (min-width: 1023px) {
    .square_banner_left {
        display: block
    }

    .square-banner {
        display: none
    }
}

.event-map-body {
    padding-top: 0px
}

.event-map-body header,
.event-map-body footer {
    font-family: 'Noto Sans JP', Avenir, "Open Sans", "Helvetica Neue", Helvetica, Arial, Verdana, Roboto, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", "Meiryo UI", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif
}

.event-map-body .popup-login label {
    font-weight: normal
}

.event-map-body .event-map-content {
    margin-top: 30px
}

.register-contents .resume-cf-box h2,
.event-entry-content .resume-cf-box h2,
.scholarship-entry .resume-cf-box h2 {
    background-color: #FFF;
    font-size: 2.1rem;
    font-weight: 400;
    color: inherit;
    margin-top: 0px;
    padding: 0px
}

.register-contents .resume-cf-box img,
.event-entry-content .resume-cf-box img,
.scholarship-entry .resume-cf-box img {
    width: auto;
    height: 35px
}

.cf-detail-apply-float .join-scholarship,
.cf-detail-apply .join-scholarship {
    background-color: #dc0202
}

.cf-detail-apply-float .join-scholarship::before,
.cf-detail-apply .join-scholarship::before {
    background-color: #FA6464
}

.button-event-disabled .join-scholarship {
    border: 1px solid #babcbe;
    background-color: #e2e4e4;
    color: #babcbe;
    cursor: default;
    pointer-events: none
}

.warning-message-information {
    margin-top: 10px;
    color: #d03a1c;
    font-weight: 600;
    font-size: 12px
}

.cf-company-filter-list .search-container .search-condition .note {
    display: inline-block;
    margin: 0 0 0 20px;
    color: #000
}

.cf-company-filter-list .search-container .search-condition .search-condition-set {
    display: inline-block
}

.cf-company-filter-list .search-container .search-condition .search-condition-set i.material-icons {
    font-size: 2rem;
    margin: 0 5px 0 0
}

.cf-company-filter-list .search-container .search-condition .present-conditions {
    padding-left: 22px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

.cf-company-filter-list .search-container.show-search-form {
    border-bottom: 0
}

.cf-company-filter-list .search-container.show-search-form .material-icons {
    color: #3A50C9
}

.cf-popup-form-box.cf-popup-register .all-location-cbox {
    margin-left: 20px
}

.cf-popup-form-box.cf-popup-register .select-box {
    max-width: 95%
}

.cf-popup-form-box.cf-popup-register .select-box:before {
    top: 14px
}

.cf-popup-form-box.cf-popup-register .select-box select {
    max-width: 100%
}

.cf-popup-form-box.cf-popup-register .select-box select.job-categories,
.cf-popup-form-box.cf-popup-register .select-box select.industry-categories {
    min-width: 200px;
    margin-top: 10px
}

.cf-popup-form-box.cf-popup-register .md-radio {
    margin-top: 20px
}

.cf-popup-form-box.cf-popup-register .md-radio label.md-radio-label {
    min-width: 112px
}

.cf-company-list .text-right .pagination.display-inline-block .pagination-prev a,
.cf-company-list .text-right .pagination.display-inline-block .pagination-next a,
.cf-company-list .text-right .pagination.clear-f .pagination-prev a,
.cf-company-list .text-right .pagination.clear-f .pagination-next a,
.cf-company-filter-list .text-right .pagination.display-inline-block .pagination-prev a,
.cf-company-filter-list .text-right .pagination.display-inline-block .pagination-next a,
.cf-company-filter-list .text-right .pagination.clear-f .pagination-prev a,
.cf-company-filter-list .text-right .pagination.clear-f .pagination-next a {
    color: #000;
    border: none;
    border-radius: 0
}

.cf-company-list .text-right .pagination.display-inline-block .pagination-prev a:hover,
.cf-company-list .text-right .pagination.display-inline-block .pagination-next a:hover,
.cf-company-list .text-right .pagination.clear-f .pagination-prev a:hover,
.cf-company-list .text-right .pagination.clear-f .pagination-next a:hover,
.cf-company-filter-list .text-right .pagination.display-inline-block .pagination-prev a:hover,
.cf-company-filter-list .text-right .pagination.display-inline-block .pagination-next a:hover,
.cf-company-filter-list .text-right .pagination.clear-f .pagination-prev a:hover,
.cf-company-filter-list .text-right .pagination.clear-f .pagination-next a:hover {
    padding: 1px
}

.cf-company-list .text-right .pagination.display-inline-block .pagination-page.active a,
.cf-company-list .text-right .pagination.clear-f .pagination-page.active a,
.cf-company-filter-list .text-right .pagination.display-inline-block .pagination-page.active a,
.cf-company-filter-list .text-right .pagination.clear-f .pagination-page.active a {
    background: none;
    border-color: #9A9B9D;
    color: #2A2B2D;
    font-size: 14px
}

.cf-company-list .text-right .pagination.display-inline-block .pagination-page a,
.cf-company-list .text-right .pagination.clear-f .pagination-page a,
.cf-company-filter-list .text-right .pagination.display-inline-block .pagination-page a,
.cf-company-filter-list .text-right .pagination.clear-f .pagination-page a {
    padding: 0
}

.company-event-navigation {
    clear: both
}

.company-event-navigation .next-year-button {
    float: left
}

.company-event-navigation .prev-year-button {
    float: right
}

.modal-dialog .modal-content .modal-body .cf-popup-form-selected {
    max-height: 100px;
    overflow: auto
}

.cf-company-detail .cf-icon {
    margin-right: 5px;
    min-width: 75px
}

.top-contents .sidemenu.event-company-list .cf-menu {
    margin-bottom: 20px
}

.top-contents .sidemenu.event-company-list .sidemenu-box {
    margin-bottom: 0px
}

.button-job-like {
    background-color: #e67e22
}

.button-job-like::before {
    background-color: #eb9950
}

.button-job-disable {
    border: 1px solid #babcbe;
    background-color: #e2e4e4 !important;
    color: #babcbe;
    pointer-events: none;
    cursor: not-allowed
}

.button-job-disable:hover {
    cursor: not-allowed
}

.modal-internship-job .program-date {
    display: inline-block;
    width: 10em
}

.company-job-tags {
    margin-bottom: 10px
}

.company-job-tags ul li {
    display: inline-block;
    border: solid 2px #3D4294;
    font-size: 14px;
    line-height: 1em;
    margin-bottom: 0.5em;
    margin-right: 0.2em;
    padding: 0.4em 1em;
    border-radius: 2em;
    white-space: nowrap
}

.user-box-inner .history-content .history-content-info p {
    max-width: 320px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #000
}

.user-box-inner .history-content .history-content-deadline p {
    overflow: hidden;
    text-overflow: ellipsis
}

.button.button-outline {
    cursor: pointer
}

.button.button-outline:focus,
.button.button-outline:active {
    color: #3A50C9 !important
}

.button.button-outline:hover {
    color: #fff !important
}

.button.button-save-pdf {
    width: 150px
}

.button.button-save-pdf.button-edit-resume {
    width: 180px
}

.cf-popup-register .grid-information dd {
    word-break: break-all
}

.autocomplete {
    width: 100%;
    position: relative
}

.autocomplete ul {
    position: absolute;
    left: 0;
    width: 100%;
    border: 0.01px solid #9AB4E8;
    z-index: 99999;
    max-height: 405px;
    overflow: auto;
    background-color: #fff
}

.autocomplete li {
    margin-top: 2px;
    margin-bottom: 2px;
    text-align: left;
    font-weight: normal;
    display: block;
    height: 18px;
    white-space: pre;
    width: 100%;
    background-color: #fff;
    padding: 0px 2px 1px;
    line-height: 18px
}

.autocomplete li:hover {
    cursor: default;
    color: #ffffff;
    background-color: #0099ff
}

.remove-padding {
    padding-right: 0px !important
}

.show-checkbox:before {
    display: block;
    opacity: 1
}

.hide-checkbox:before {
    display: none
}

.profile-editing .register-contents .button-delete {
    display: flex
}

.profile-editing .register-contents .work-permit-cate select option:first-child,
.profile-editing .register-contents .country-code-tel select option:first-child {
    display: none
}

.profile-editing .user-tel-fields .button-delete,
.profile-editing .user-tel-fields .button-add,
.profile-editing .work-permission-fields .button-delete,
.profile-editing .work-permission-fields .button-add {
    margin-top: 0px;
    margin-bottom: 8px
}

.work-company-selection li .company-name {
    width: calc(100% - 110px);
    display: block;
    word-break: break-word
}

@media only screen and (min-width: 1023px) {
    #register-modal .cf-popup-register {
        height: 218px
    }
}

.word-wrap {
    word-wrap: break-word;
    word-break: break-all
}

.user-box-title .user-job-photo.company-logo-thank {
    line-height: 134px;
    background-color: #ffffff;
    text-align: center
}

.user-box-title .user-job-photo.company-logo-thank img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%
}

.profile_edit_success,
.profile_edit_success.user-preview-alert {
    width: calc(100% - 130px);
    padding: 4px 15px;
    margin-top: 10px;
    background-color: #dff0d8;
    border-color: #d6e9c6;
    color: #3c763d;
    border-radius: 3px;
    line-height: 1.45em
}

@media only screen and (max-width: 599px) {

    .profile_edit_success,
    .profile_edit_success.user-preview-alert {
        width: 100%;
        margin: 0
    }

    .profile_edit_success+.button {
        margin-right: 0
    }
}

.profile_edit_success .close {
    font-size: 15px;
    margin-top: 4px
}

.inquiry_create_success {
    width: calc(100% - 100px);
    padding: 4px 15px;
    margin-top: 10px;
    margin-left: 30px;
    background-color: #dff0d8;
    border-color: #d6e9c6;
    color: #3c763d;
    border-radius: 3px;
    line-height: 1.45em
}

@media only screen and (max-width: 599px) {
    .inquiry_create_success {
        width: 100%;
        margin: 0
    }

    .inquiry_create_success+.button {
        margin-right: 0
    }
}

.inquiry_create_success .close {
    font-size: 15px;
    margin-top: 4px
}

.profile_edit_false {
    width: calc(100% - 130px);
    padding: 4px 15px;
    margin-top: 10px;
    background-color: #f2dede;
    border-color: #ebccd1;
    color: #a94442;
    border-radius: 3px;
    line-height: 1.45em
}

@media only screen and (max-width: 599px) {
    .profile_edit_false {
        width: 100%;
        margin: 0
    }

    .profile_edit_false+.button {
        margin-right: 0
    }
}

.profile_edit_false .close {
    font-size: 15px;
    margin-top: 4px
}

.profile_edit_success.user-preview-alert {
    width: 100%
}

.new_user .register-row .button-delete {
    margin-top: 0
}

.header-cfn .popup-login .popup-login-button .button {
    width: 100%;
    box-shadow: none !important
}

.header-cfn .popup-login .popup-login-button .button-facebook {
    margin-top: 10px;
    justify-content: center
}

.header-cfn .popup-login .popup-login-button .button-facebook:hover {
    border-color: #3a50c9
}

p.disco-display-target {
    float: right;
    margin-bottom: 0
}

.overflow-hidden {
    overflow: hidden
}

@media only screen and (max-width: 767px) {
    .overflow-hidden {
        padding: 0 10px
    }
}

#inquiry-frame {
    background: #efefef;
    padding: 30px 0
}

#inquiry-frame iframe {
    width: 100%;
    height: 500px;
    min-height: 400px;
    max-height: 100vh;
    border-width: 0px;
    overflow: hidden
}

.md-input-message-animation {
    color: #DD0E1B;
    font-weight: bold
}

.profile_edit_success.user-preview-alert.register-msg {
    margin-bottom: -15px
}

@media only screen and (min-width: 768px) {
    .header-cfn.registration-header {
        height: 89px
    }
}

.header-forgot-password {
    margin-bottom: 1em
}

.header-forgot-password a:visited {
    color: #3A50C9 !important
}

.header-forgot-password a:hover {
    color: #89ABE3 !important;
    text-decoration: none
}

.top-wrapper .register-contents .event-entry-note {
    font-size: 1.4rem;
    color: #2A2B2D
}

.alert.alert-danger {
    color: #DD0E1B;
    font-weight: bold
}

.register-row .work-experience-description {
    float: left
}

.register-row .work-experience-description p {
    color: #DD0E1B
}

.register-contents .text-description {
    font-size: 1.2rem;
    margin-left: 20px
}

.surveys-inquiry .surveys-content {
    border: 1px solid #d8d8d8;
    padding: 20px;
    margin-top: 30px
}

.surveys-inquiry .surveys-content .button {
    width: 300px
}

.surveys-inquiry .surveys-content .font-bold {
    font-weight: bold
}

#confirm-inquiry .btn-clear {
    color: #fff;
    background-color: #A6A6A6;
    width: 96px
}

#confirm-inquiry .btn-clear:hover {
    color: #fff;
    background-color: #8A8989
}

#confirm-inquiry .accept-btn {
    color: #fff;
    background-color: #3A50C9;
    width: 96px
}

#confirm-inquiry .accept-btn:hover {
    background-color: #89ABE3
}

#confirm-inquiry .modal-body {
    padding: 10px 30px 10px 30px
}

#inquiry-form .modal-content {
    width: 350px;
    max-width: 100%
}

#inquiry-form .recaptcha-required {
    border: 1px solid #babcbe !important;
    background-color: #e2e4e4 !important;
    color: #babcbe;
    cursor: default;
    pointer-events: none
}

#inquiry-form .recaptcha-required:hover {
    background-color: #ddd !important;
    color: #babcbe !important;
    text-decoration: none
}

.multi-line {
    white-space: pre-wrap;
    word-wrap: break-word;
    clear: both
}

.disable-input {
    border-bottom: 1px solid #9A9B9D !important
}

.print-candidate .resume-preview {
    padding: 0px
}

.print-candidate .resume-preview .result-box-thumbnail img {
    width: 120px;
    margin-left: 20px
}

.print-candidate .resume-preview-information .question-answers {
    font-weight: normal
}

.print-candidate .resume-preview-information .question-answers .question-index {
    width: 25px
}

.print-candidate .resume-preview .resume-preview-information .resume-name,
.print-candidate .resume-preview .resume-preview-information .resume-name strong {
    font-size: 16pt;
    font-weight: bold
}

.print-candidate .resume-preview .resume-preview-information dt.resume-basic-info {
    padding-left: 0
}

.print-candidate .resume-preview .resume-preview-information .resume-basic-info {
    font-size: 1.2rem;
    margin-top: 0mm;
    margin-bottom: 0mm;
    font-weight: normal
}

.print-candidate .resume-preview .resume-preview-information .resume-work strong,
.print-candidate .resume-preview .resume-preview-information .resume-university,
.print-candidate .resume-preview .resume-preview-information .resume-university strong {
    font-weight: bold;
    font-size: 1.2rem
}

.print-candidate .resume-preview .resume-preview-information .resume-other-info,
.print-candidate .resume-preview .resume-preview-information .resume-other-label {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 1.2rem
}

.print-candidate .resume-preview .resume-preview-information dd.resume-other-info {
    padding-left: 6mm
}

.print-candidate .resume-preview .resume-preview-information .resume-other-label,
.print-candidate .resume-preview .resume-preview-information .application-status {
    font-weight: normal
}

.print-candidate .resume-preview .resume-preview-information .resume-work-time {
    text-align: right;
    padding-right: 10px
}

@media only screen and (max-width: 599px) {
    .print-candidate .resume-preview .resume-preview-information .resume-work-time {
        text-align: left
    }
}

.print-candidate .resume-preview .resume-preview-information .table-row {
    display: table-row;
    width: 100%;
    float: left
}

.print-candidate .resume-preview .resume-preview-information .block-title {
    width: 180px
}

.print-candidate .resume-preview .resume-preview-information .block-inline,
.print-candidate .resume-preview .resume-preview-information .block-title {
    display: table-cell;
    word-break: break-all
}

.print-candidate .resume-preview .resume-preview-information .line-height-basic {
    line-height: 1.8
}

.print-candidate .resume-preview-information .question {
    width: 100%;
    float: left
}

.print-candidate .resume-preview-information .question p {
    line-height: 1.8;
    white-space: pre-wrap
}

.print-candidate .resume-preview-information .question .question-title {
    margin-bottom: 0
}

.print-candidate .resume-preview-information .answer {
    padding-left: 30px
}

.resume-preview-history ul {
    margin-left: 0px
}

.resume-preview-history {
    padding-top: 5px !important
}

.resume-preview-appoinment-system {
    background-color: #e67e22;
    color: #fff;
    width: 140px;
    padding: 4px;
    margin-right: 10px;
    margin-bottom: 10px;
    font-weight: normal;
    text-align: center;
    display: inline-block;
    font-size: 1.4rem
}

.print-candidate .resume-preview .resume-preview-information dd p {
    margin-bottom: 0;
    word-break: break-word
}

.print-candidate .resume-preview .resume-preview-information dd p br {
    display: block;
    content: "";
    margin-top: 0
}

.resume-controller-block {
    justify-content: space-between
}

.resume-controller-block .wrapper-button {
    display: flex
}

@media only screen and (min-width: 1023px) and (max-width: 1240px) {
    .resume-controller-block .wrapper-button {
        width: 100%
    }
}

@media only screen and (max-width: 864px) {
    .resume-controller-block .wrapper-button {
        width: 100%
    }
}

.setting-block-company-expected .resume-setting-list-order {
    float: left;
    width: calc(100% - 15px);
    margin-left: 15px
}

.setting-block-company-expected .resume-setting-list-order li {
    margin-top: 10px;
    margin-bottom: 10px;
    float: left;
    clear: both;
    width: 100%
}

.setting-block-company-expected .header-account-setting-block,
.setting-block-company-expected .header-account-setting-expected {
    position: relative
}

.setting-block-company-expected .header-account-setting-block .link-account-setting,
.setting-block-company-expected .header-account-setting-expected .link-account-setting {
    position: absolute;
    right: 15px;
    top: -5px
}

.setting-block-company-expected .header-account-setting-block .link-account-setting a,
.setting-block-company-expected .header-account-setting-expected .link-account-setting a {
    font-size: 1.3rem;
    text-decoration: underline;
    margin-left: 10px
}

.check-box-mail-wrapper {
    position: relative;
    float: left;
    width: 100%
}

.check-box-mail-wrapper .check-box-mail {
    position: absolute;
    left: 10px;
    top: 0;
    bottom: 0;
    margin: auto;
    height: 22px;
    width: 22px;
    z-index: 99
}

.check-box-mail-wrapper .check-box-mail .message-bookmark-button {
    position: absolute;
    top: -37px
}

.check-box-mail-wrapper .check-box-mail .message-bookmark-button.invitation-bookmark-button {
    top: -49px
}

.check-box-mail-wrapper .check-box-mail .message-bookmark-button.unbookmark-message:before {
    content: "\2605";
    font-size: 23px;
    color: #3a50c9
}

.check-box-mail-wrapper .check-box-mail .message-bookmark-button.bookmark-message:before {
    content: "\2606";
    font-size: 23px
}

.check-box-mail-wrapper .tittle-mail {
    float: left
}

.check-box-mail-wrapper .tittle-mail.title-mail-widthfull {
    width: 100%
}

.check-box-mail-wrapper .tittle-mail .mail-list-item {
    padding-left: 40px
}

.mail-button-delete-box {
    margin-top: 10px
}

.mail-button-delete-box .message-filter-checkbox {
    display: inline-block
}

@media (max-width: 650px) {
    .mail-button-delete-box a {
        margin-bottom: 10px
    }
}

.mail-button-delete-box a,
.mail-button-delete-box button {
    display: inline-flex;
    width: 260px;
    margin-right: 5px
}

a.button-top-page:visited {
    color: #FFFFFF !important
}

@media (min-width: 768px) {
    .sidemenu-navi-mail-appointment a::before {
        content: "sms"
    }
}

.txt-break {
    overflow-wrap: break-word;
    word-break: break-word
}

@media only screen and (max-width: 1240px) {
    .d-datetime-field.d-maxlg-none {
        display: none
    }
}

@media only screen and (min-width: 1241px) {
    .d-datetime-field.d-minxl-none {
        display: none
    }
}

.md-datetime-picker,
.md-time-picker,
.md-date-picker {
    position: relative;
    display: inline-block;
    *zoom: 1
}

.md-datetime-picker:before,
.md-datetime-picker:after,
.md-time-picker:before,
.md-time-picker:after,
.md-date-picker:before,
.md-date-picker:after {
    content: " ";
    display: table
}

.md-datetime-picker:after,
.md-time-picker:after,
.md-date-picker:after {
    clear: both
}

.md-datetime-picker:disabled .md-datepicker-input-container,
.md-time-picker:disabled .md-datepicker-input-container,
.md-date-picker:disabled .md-datepicker-input-container {
    border-bottom: 1px solid #9A9B9D !important;
    color: #9A9B9D
}

.md-datetime-picker .md-datepicker-input-container.disabled,
.md-time-picker .md-datepicker-input-container.disabled,
.md-date-picker .md-datepicker-input-container.disabled {
    border: 1px solid #9A9B9D
}

.md-datetime-picker .md-datepicker-input-container.disabled .md-datetimepicker-input,
.md-time-picker .md-datepicker-input-container.disabled .md-datetimepicker-input,
.md-date-picker .md-datepicker-input-container.disabled .md-datetimepicker-input {
    border: 0 !important
}

.md-datetime-picker .uib-title,
.md-time-picker .uib-title,
.md-date-picker .uib-title {
    font-size: 1.4rem
}

.md-datetime-picker .uib-title:hover,
.md-datetime-picker .uib-title:focus,
.md-datetime-picker .uib-title:active,
.md-time-picker .uib-title:hover,
.md-time-picker .uib-title:focus,
.md-time-picker .uib-title:active,
.md-date-picker .uib-title:hover,
.md-date-picker .uib-title:focus,
.md-date-picker .uib-title:active {
    background: none;
    outline: 0;
    box-shadow: none
}

.md-datetime-picker .md-datetimepicker-button,
.md-time-picker .md-datetimepicker-button,
.md-date-picker .md-datetimepicker-button {
    width: 26px;
    height: 26px;
    padding: 0;
    background: none;
    border: 0;
    display: inline-block;
    vertical-align: top;
    color: #6A6B6D
}

.md-datetime-picker .md-datetimepicker-button:focus,
.md-datetime-picker .md-datetimepicker-button:active,
.md-time-picker .md-datetimepicker-button:focus,
.md-time-picker .md-datetimepicker-button:active,
.md-date-picker .md-datetimepicker-button:focus,
.md-date-picker .md-datetimepicker-button:active {
    outline: 0
}

.md-datetime-picker .md-datepicker-input-container,
.md-time-picker .md-datepicker-input-container,
.md-date-picker .md-datepicker-input-container {
    height: 26px;
    position: relative;
    display: inline-block;
    vertical-align: top;
    border-bottom: 1px solid #d8d8d8
}

.md-datetime-picker .md-datepicker-input-container.is-focused::after,
.md-time-picker .md-datepicker-input-container.is-focused::after,
.md-date-picker .md-datepicker-input-container.is-focused::after {
    left: 0;
    right: 0
}

.md-datetime-picker .md-datepicker-input-container.optional::after,
.md-time-picker .md-datepicker-input-container.optional::after,
.md-date-picker .md-datepicker-input-container.optional::after {
    display: none
}

.md-datetime-picker .md-datepicker-input-container::after,
.md-time-picker .md-datepicker-input-container::after,
.md-date-picker .md-datepicker-input-container::after {
    content: "";
    height: 2px;
    display: block;
    position: absolute;
    bottom: 0;
    background-color: #3a50c9;
    z-index: 3;
    left: 50%;
    right: 50%;
    -webkit-transition-property: left, right;
    transition-property: left, right;
    -webkit-transition-duration: 0.2s;
    transition-duration: 0.2s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out
}

.md-datetime-picker .md-datepicker-input-container .material-icons,
.md-time-picker .md-datepicker-input-container .material-icons,
.md-date-picker .md-datepicker-input-container .material-icons {
    color: #6A6B6D
}

.md-datetime-picker.required .md-datetimepicker-input,
.md-time-picker.required .md-datetimepicker-input,
.md-date-picker.required .md-datetimepicker-input {
    border-bottom: 1px solid #e67e22
}

.md-datetime-picker .md-datetimepicker-input,
.md-time-picker .md-datetimepicker-input,
.md-date-picker .md-datetimepicker-input {
    width: calc(100% - 26px);
    height: 26px;
    position: relative;
    z-index: 1;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    outline: none;
    border: none;
    color: #6A6B6D;
    font-size: 1.4rem;
    padding: 0px 6px 4px 6px;
    background: transparent;
    border-radius: 0px
}

.md-datetime-picker .md-datetimepicker-input.search-internship-job-month,
.md-time-picker .md-datetimepicker-input.search-internship-job-month,
.md-date-picker .md-datetimepicker-input.search-internship-job-month {
    width: 100%;
    padding: 0px
}

.md-datetime-picker .dropdown-menu,
.md-time-picker .dropdown-menu,
.md-date-picker .dropdown-menu {
    box-shadow: 0 0 7px rgba(34, 25, 25, 0.4)
}

.md-datetime-picker .dropdown-menu.datetime-picker-dropdown,
.md-time-picker .dropdown-menu.datetime-picker-dropdown,
.md-date-picker .dropdown-menu.datetime-picker-dropdown {
    min-width: 270px;
    top: 0;
    padding: 0;
    margin: 0;
    border: 0
}

.md-datetime-picker .dropdown-menu.datetime-picker-dropdown>li,
.md-time-picker .dropdown-menu.datetime-picker-dropdown>li,
.md-date-picker .dropdown-menu.datetime-picker-dropdown>li {
    float: none;
    margin: 0
}

.md-datetime-picker .dropdown-menu.datetime-picker-dropdown>li:last-child,
.md-time-picker .dropdown-menu.datetime-picker-dropdown>li:last-child,
.md-date-picker .dropdown-menu.datetime-picker-dropdown>li:last-child {
    padding: 10px 10px 20px !important
}

.date-picker-menu {
    padding: 0 !important
}

.uib-daypicker {
    border: 0
}

.uib-daypicker:focus {
    outline: 0
}

.uib-daypicker thead,
.uib-daypicker tbody,
.uib-daypicker tr,
.uib-daypicker td {
    padding: 5px 0;
    color: #2A2B2D;
    border: 0
}

.uib-daypicker small {
    font-size: 1.4rem;
    font-weight: normal
}

.uib-daypicker .btn {
    border: 0
}

.uib-daypicker thead button:focus,
.uib-daypicker thead button:active,
.uib-daypicker thead button:hover {
    background: none;
    outline: 0
}

.uib-daypicker thead tr:first-child {
    padding: 5px 0
}

.uib-daypicker thead tr:nth-child(2) {
    background: #e0e0e0;
    color: #2A2B2D
}

.uib-daypicker thead th {
    border: 0;
    padding: 6px 0;
    vertical-align: middle
}

.uib-daypicker thead .btn {
    padding: 2px 5px 0;
    font-size: 1.4rem
}

.uib-daypicker thead .btn:focus,
.uib-daypicker thead .btn:active {
    outline: 0;
    box-shadow: none;
    background: none
}

.uib-daypicker .uib-weeks>td {
    position: relative;
    padding: 4px
}

.uib-day .btn {
    padding: 6px 10px;
    width: 42px;
    height: 42px;
    min-width: auto;
    border-radius: 100%;
    box-shadow: none
}

.uib-day .btn:active,
.uib-day .btn:focus {
    outline: 0
}

.uib-day .btn.active {
    background: #3a50c9
}

.uib-day .btn.active span {
    color: #fff
}

.uib-left,
.uib-right {
    position: relative;
    background: none
}

.uib-left:focus,
.uib-left:active,
.uib-right:focus,
.uib-right:active {
    outline: 0;
    background: none
}

.uib-left:after,
.uib-right:after {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    color: #3A50C9
}

.uib-left i,
.uib-right i {
    display: none
}

.uib-left:after {
    content: "keyboard_arrow_left"
}

.uib-right:after {
    content: "keyboard_arrow_right"
}

.uib-timepicker {
    border: 0
}

.uib-timepicker:focus {
    outline: 0
}

.uib-timepicker thead,
.uib-timepicker tbody,
.uib-timepicker tr,
.uib-timepicker td {
    color: #2A2B2D;
    border: 0
}

.uib-timepicker tr {
    padding: 10px 5px
}

.uib-timepicker td {
    padding: 0px 10px
}

.uib-time button {
    border-radius: 0;
    padding: 7px 12px
}

.uib-increment.hours>a:focus,
.uib-increment.hours>a:active,
.uib-increment.minutes>a:focus,
.uib-increment.minutes>a:active,
.uib-decrement.hours>a:focus,
.uib-decrement.hours>a:active,
.uib-decrement.minutes>a:focus,
.uib-decrement.minutes>a:active {
    outline: 0
}

.uib-increment.hours .glyphicon:before,
.uib-increment.minutes .glyphicon:before,
.uib-decrement.hours .glyphicon:before,
.uib-decrement.minutes .glyphicon:before {
    display: none
}

.uib-increment.hours .glyphicon:after,
.uib-increment.minutes .glyphicon:after,
.uib-decrement.hours .glyphicon:after,
.uib-decrement.minutes .glyphicon:after {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap
}

.uib-increment.hours .glyphicon-chevron-up:after,
.uib-increment.minutes .glyphicon-chevron-up:after,
.uib-decrement.hours .glyphicon-chevron-up:after,
.uib-decrement.minutes .glyphicon-chevron-up:after {
    content: "keyboard_arrow_up"
}

.uib-increment.hours .glyphicon-chevron-down:after,
.uib-increment.minutes .glyphicon-chevron-down:after,
.uib-decrement.hours .glyphicon-chevron-down:after,
.uib-decrement.minutes .glyphicon-chevron-down:after {
    content: "keyboard_arrow_down"
}

.uib-monthpicker,
.uib-yearpicker {
    margin: 0px auto;
    border: 0
}

.uib-monthpicker:focus,
.uib-yearpicker:focus {
    outline: 0
}

.uib-monthpicker thead,
.uib-monthpicker tbody,
.uib-monthpicker tr,
.uib-monthpicker td,
.uib-monthpicker th,
.uib-yearpicker thead,
.uib-yearpicker tbody,
.uib-yearpicker tr,
.uib-yearpicker td,
.uib-yearpicker th {
    color: #2A2B2D;
    border: 0
}

.uib-monthpicker .btn-sm,
.uib-monthpicker .btn-group-sm>.btn,
.uib-yearpicker .btn-sm,
.uib-yearpicker .btn-group-sm>.btn {
    padding: 8px 10px 2px
}

.uib-monthpicker .btn-sm:focus,
.uib-monthpicker .btn-group-sm>.btn:focus,
.uib-monthpicker .btn-sm:active,
.uib-monthpicker .btn-group-sm>.btn:active,
.uib-yearpicker .btn-sm:focus,
.uib-yearpicker .btn-group-sm>.btn:focus,
.uib-yearpicker .btn-sm:active,
.uib-yearpicker .btn-group-sm>.btn:active {
    outline: 0;
    box-shadow: none;
    background: none
}

.uib-monthpicker button,
.uib-yearpicker button {
    border: 0
}

.uib-month .btn,
.uib-year .btn {
    box-shadow: none
}

.uib-month .btn:active,
.uib-month .btn:focus,
.uib-year .btn:active,
.uib-year .btn:focus {
    outline: 0
}

.uib-month .btn.active,
.uib-year .btn.active {
    background: #3a50c9
}

.uib-month .btn.active span,
.uib-year .btn.active span {
    color: #fff
}

.cf-popup-form-container .md-datetime-picker {
    vertical-align: top
}

.cf-popup-form-container .md-datetime-picker .dropdown-menu.datetime-picker-dropdown {
    top: auto;
    bottom: 0
}

.company-contents {
    clear: both
}

.company-contents .company-data-hr {
    float: left;
    width: 100%
}

.edit_job .register-inner .md-radio-label {
    display: block !important
}

.checkbox-question .md-checkbox {
    position: relative
}

.checkbox-question .md-checkbox .md-checkbox-label {
    display: block
}

.unfinished {
    color: #e67e22;
    text-align: center
}

#job-entry-confirm .entry-job,
#job-entry-warning .entry-job,
#private-resume-warning .entry-job {
    height: 50px
}

#job-entry-confirm .entry-confirm-footer,
#job-entry-warning .entry-confirm-footer,
#private-resume-warning .entry-confirm-footer {
    text-align: center
}

@media screen and (-ms-high-contrast: active),
(-ms-high-contrast: none) {

    #job-entry-confirm .cf-popup-form-button,
    #job-entry-warning .cf-popup-form-button,
    #private-resume-warning .cf-popup-form-button {
        display: block
    }
}

#entry-job-comfirm-modal .modal.modal-confirm .modal-dialog {
    min-width: initial;
    width: 400px
}

#entry-job-comfirm-modal .button {
    margin: auto
}

#private-resume-warning-modal .modal.modal-confirm .modal-dialog {
    min-width: initial;
    width: 525px !important
}

@media screen and (-ms-high-contrast: active),
(-ms-high-contrast: none) {
    #private-resume-warning-modal .modal.modal-confirm .modal-content {
        min-width: initial;
        width: 525px !important
    }
}

#private-resume-warning-modal .button {
    margin: auto
}

#entry-job-warning-modal .modal.modal-confirm .modal-dialog,
#private-resume-warning-modal .modal.modal-confirm .modal-dialog {
    min-width: initial;
    width: 600px
}

@media screen and (-ms-high-contrast: active),
(-ms-high-contrast: none) {

    #entry-job-warning-modal .modal.modal-confirm .modal-content,
    #private-resume-warning-modal .modal.modal-confirm .modal-content {
        min-width: initial;
        width: 600px
    }
}

@media only screen and (max-width: 480px) {

    #entry-job-warning-modal .modal .cf-popup-form-button,
    #private-resume-warning-modal .modal .cf-popup-form-button {
        display: flex !important
    }
}

@media only screen and (max-width: 480px) {

    #entry-job-warning-modal .modal .cf-popup-form-button>.button,
    #private-resume-warning-modal .modal .cf-popup-form-button>.button {
        display: flex !important
    }
}

@media screen and (-ms-high-contrast: active),
(-ms-high-contrast: none) {

    #entry-job-warning-modal .modal .cf-popup-form-button,
    #private-resume-warning-modal .modal .cf-popup-form-button {
        display: inline-flex
    }
}

@media screen and (-ms-high-contrast: active),
(-ms-high-contrast: none) {

    #entry-job-warning-modal .modal .modal-footer,
    #private-resume-warning-modal .modal .modal-footer {
        text-align: center
    }

    #entry-job-warning-modal .modal .modal-footer .button:first-child,
    #private-resume-warning-modal .modal .modal-footer .button:first-child {
        margin-right: 30px
    }
}

#entry-job-warning-modal .button,
#private-resume-warning-modal .button {
    margin: auto
}

#entry-job-warning-modal .multi-line,
#private-resume-warning-modal .multi-line {
    white-space: pre-line;
    word-wrap: break-word;
    clear: both
}

#entry-job-warning-modal span.job-entry,
#private-resume-warning-modal span.job-entry {
    word-break: break-word
}

#entry-job-warning-modal span.job-entry:before,
#private-resume-warning-modal span.job-entry:before {
    content: "";
    display: inline-block;
    width: 9px;
    height: 9px;
    margin-right: 5px;
    background: #000
}

.register-contents .register-info .content {
    word-break: break-word
}

.register-contents .register-info .content p {
    text-align: left !important
}

.register-contents-thanks {
    background: #f5f5f5;
    border-radius: 10px
}

.register-contents-thanks.register-contents-thanks>p {
    font-weight: bold
}

.register-contents-thanks h2 {
    font-weight: bold
}

.register-contents-thanks .register-info {
    background: #fff;
    padding-left: 20px;
    display: -webkit-flex;
    -webkit-justify-content: space-between;
    -webkit-align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.register-contents-thanks .register-info .thumb {
    padding: 10px;
    float: none
}

.register-contents-thanks .register-info .content p.company-name {
    font-weight: bold;
    border-left: solid 3px #3a50c9;
    padding-left: 0.5em;
    margin-bottom: 0.5em
}

.register-contents-thanks .register-info .content dl {
    border-top: solid 1px #ccc;
    display: -webkit-flex;
    -webkit-justify-content: space-between;
    -webkit-align-items: stretch;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-bottom: 0
}

.register-contents-thanks .register-info .content dl dt {
    width: 20%
}

.register-contents-thanks .register-info .content dl dd {
    width: 80%;
    text-indent: -0.6em;
    padding-left: 0.6em
}

.register-contents-thanks .register-info .content dl dt,
.register-contents-thanks .register-info .content dl dd {
    border-bottom: solid 1px #ccc
}

.register-info .content {
    word-break: break-word;
    width: calc(100% - 120px)
}

#modal-confirm-video .modal-dialog {
    min-width: auto;
    width: 300px
}

@media screen and (-ms-high-contrast: active),
(-ms-high-contrast: none) {
    #modal-confirm-video .modal-content {
        min-width: auto;
        width: 300px
    }
}

#job-entry-warning .apply-job-btn.disabled {
    background-color: #3A50C9;
    color: #fff
}

.mail-left .cf-icon.mail-forum,
.mail-right .cf-icon.mail-forum {
    color: #ffffff
}

.mail-left .bg-internship-tag.bg-internship-tag,
.mail-right .bg-internship-tag.bg-internship-tag {
    background-color: #ff80c0
}

.mail-list__group-load-more {
    padding: 1em;
    display: flex;
    justify-content: center
}

.mail-list__button-load-more:hover .span-load-more {
    color: #fff !important
}

.mail-list .span-load-more {
    color: #3A50C9 !important;
    text-align: center;
    padding: 0
}

.page-mypage .user-contents .user-wrapper .contents .cannot-deliver {
    color: #000
}

.page-mypage .user-contents .user-wrapper .contents .user-banner img {
    width: 100%
}

.page-account-setting .modal-popup-confirm-video {
    width: 22% !important;
    left: 40%
}

.bagde-box .flow-image-dummy {
    position: relative;
    width: 100%;
    height: 100%;
    padding: 0
}

.bagde-box .flow-image-dummy img {
    width: 100%;
    height: 100%
}

.user-box-title .user-job-photo img {
    max-width: 100%;
    max-height: 100%
}

.bagde-info p {
    font-size: 2.1rem;
    font-weight: bold;
    margin-bottom: 0
}

#withdrawn-reason {
    border: 1px solid #e67e22
}

body.page-online-interview-booking .olsem-list-table {
    width: 100%
}

body.page-online-interview-booking .olsem-list-table th {
    border-right: 1px solid #eee;
    padding: 0.7rem 1rem;
    vertical-align: middle;
    line-height: 1.5rem;
    background: #f3f3f3;
    text-align: center;
    color: #666;
    font-size: 90%
}

body.page-online-interview-booking .olsem-list-table td {
    line-height: 1.7rem
}

body.page-online-interview-booking .form-control-s {
    height: 30px;
    padding: 4px 8px;
    margin: 3px 0;
    font-size: 100%;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px
}

body.page-online-interview-booking .txt-bold {
    font-weight: bold
}

body.page-online-interview-booking .txt-sml {
    font-size: 80% !important
}

body.page-online-interview-booking .txt-left {
    text-align: left !important
}

body.page-online-interview-booking .button1 {
    color: #fff;
    margin: 0;
    display: inline-block;
    cursor: pointer;
    width: 100%
}

body.page-online-interview-booking .button1.disabled {
    cursor: not-allowed
}

body.page-online-interview-booking .button1 a {
    color: #fff;
    font-size: 90%;
    font-weight: 400;
    display: inline-block;
    text-align: center;
    text-decoration: none;
    border-radius: 5px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 7px 7px;
    width: 100%
}

body.page-online-interview-booking .button-1 {
    background-color: #21bf73;
    white-space: nowrap
}

body.page-online-interview-booking .button-1:hover {
    background-color: #40bad5;
    color: #fff;
    transition: 0.3s
}

body.page-online-interview-booking .button-reserved {
    background-color: #f30514;
    white-space: nowrap
}

body.page-online-interview-booking .button-expired {
    background-color: #bbb;
    white-space: nowrap
}

body.online-interview-history .online-interview-line {
    margin-top: 0px !important
}

body.online-interview-history .online-interview-icon {
    background: url(/assets/icon-oli-58a0ad6a66d6203817fd59bdd1463e838ee6ebccccf8ab8333320e52830d9069.png) center 36% no-repeat #F5F9FA !important
}

body.online-interview-history div.button-online-interview .button-cancel {
    margin-top: 5px
}

body.online-interview-history .video-pattern {
    margin-bottom: 15px !important
}

body.page-mypage div.user-select-box #event-applied {
    width: 60%
}

body.page-company-seminars-list html,
.public-seminars-list html {
    scroll-padding-top: 33px
}

body.page-company-seminars-list .icon,
.public-seminars-list .icon {
    display: inline-block;
    color: #fff;
    font-size: 80%;
    border-radius: 2px;
    margin-right: 5px;
    padding: 0 5px
}

body.page-company-seminars-list .icon1,
.public-seminars-list .icon1 {
    background: #12cad6
}

body.page-company-seminars-list .icon2,
.public-seminars-list .icon2 {
    background: #79d70f
}

body.page-company-seminars-list .daybar,
.public-seminars-list .daybar {
    background: #1b365d;
    color: #FFF;
    padding: 2px 5px;
    z-index: 5;
    margin: 0
}

body.page-company-seminars-list .daybar a,
.public-seminars-list .daybar a {
    color: #fff !important;
    margin: 0 5px;
    white-space: nowrap
}

body.page-company-seminars-list .daybar a:hover,
.public-seminars-list .daybar a:hover {
    color: #1b365d !important;
    background: #fff;
    border-radius: 5px
}

body.page-company-seminars-list .dayanc,
.public-seminars-list .dayanc {
    line-height: 1px
}

body.page-company-seminars-list .tabs .tab-label,
.public-seminars-list .tabs .tab-label {
    width: 94px;
    font-size: 106%;
    font-weight: bold;
    display: inline-block;
    border-radius: 3px 3px 0 0;
    background-color: #89ABE3;
    color: #fff;
    margin: 0 0 3px;
    padding: 10px;
    z-index: 1 !important;
    line-height: 100%
}

body.page-company-seminars-list .tabs .tab-label:hover,
.public-seminars-list .tabs .tab-label:hover {
    opacity: 0.7
}

body.page-company-seminars-list .tabs input[name="tab-radio"],
body.page-company-seminars-list .tabs .tab-content,
.public-seminars-list .tabs input[name="tab-radio"],
.public-seminars-list .tabs .tab-content {
    display: none
}

body.page-company-seminars-list .tabs .tab-content,
.public-seminars-list .tabs .tab-content {
    min-height: 200px
}

body.page-company-seminars-list .tabs #tab-1:checked~.tab-1-content,
body.page-company-seminars-list .tabs #tab-2:checked~.tab-2-content,
body.page-company-seminars-list .tabs #tab-3:checked~.tab-3-content,
.public-seminars-list .tabs #tab-1:checked~.tab-1-content,
.public-seminars-list .tabs #tab-2:checked~.tab-2-content,
.public-seminars-list .tabs #tab-3:checked~.tab-3-content {
    display: block
}

body.page-company-seminars-list .tabs input[name="tab-radio"]:checked+.tab-label,
.public-seminars-list .tabs input[name="tab-radio"]:checked+.tab-label {
    background-color: #1b365d
}

body.page-company-seminars-list .cf-custom-content-02 table.table02,
.public-seminars-list .cf-custom-content-02 table.table02 {
    width: 100%;
    border-collapse: collapse
}

body.page-company-seminars-list .cf-custom-content-02 table.table02 tbody td,
.public-seminars-list .cf-custom-content-02 table.table02 tbody td {
    background: #FFF;
    padding: 5px 3px;
    border: #d8d8d8 solid 1px !important;
    vertical-align: middle
}

body.page-company-seminars-list .cf-custom-content-02 table.table02 tbody th,
.public-seminars-list .cf-custom-content-02 table.table02 tbody th {
    background: #1b365d;
    color: #FFF;
    padding: 5px 3px;
    vertical-align: middle;
    text-align: left;
    line-height: 1.25em !important
}

body.page-company-seminars-list .cf-custom-content-02 .schedule-table,
.public-seminars-list .cf-custom-content-02 .schedule-table {
    display: block !important
}

body.page-company-seminars-list .cf-custom-content-02 .hide,
.public-seminars-list .cf-custom-content-02 .hide {
    display: none !important
}

body.page-company-seminars-list .cf-custom-content-02 .title-sml,
.public-seminars-list .cf-custom-content-02 .title-sml {
    font-size: 85%
}

body.page-company-seminars-list .cf-custom-content-02 .sml,
.public-seminars-list .cf-custom-content-02 .sml {
    font-size: 80%
}

body.page-company-seminars-list .cf-custom-content-02 .note-red,
.public-seminars-list .cf-custom-content-02 .note-red {
    color: #ff0000
}

body.page-company-seminars-list .cf-custom-content-02 .sem-room,
.public-seminars-list .cf-custom-content-02 .sem-room {
    width: 50px;
    text-align: center
}

body.page-company-seminars-list .cf-custom-content-02 .sem-time,
.public-seminars-list .cf-custom-content-02 .sem-time {
    position: relative;
    font-size: 1.7rem;
    font-weight: bold;
    padding-top: 1rem;
    margin: 0.5rem 0 0 0
}

body.page-company-seminars-list .cf-custom-content-02 h4,
.public-seminars-list .cf-custom-content-02 h4 {
    position: relative;
    font-size: 1.7rem;
    font-weight: bold;
    padding-top: 1rem;
    margin: 2rem 0 1rem 0;
    border-top: 1px solid #ccc
}

body.page-company-seminars-list .cf-custom-content-02 table.table01,
.public-seminars-list .cf-custom-content-02 table.table01 {
    width: 100%;
    border-collapse: collapse
}

body.page-company-seminars-list .cf-custom-content-02 table.table01 thead th,
.public-seminars-list .cf-custom-content-02 table.table01 thead th {
    background: #1b365d;
    color: #FFF;
    padding: 7px 5px;
    border: #d8d8d8 solid 1px
}

body.page-company-seminars-list .cf-custom-content-02 table.table01 tbody th,
.public-seminars-list .cf-custom-content-02 table.table01 tbody th {
    background: #1b365d;
    color: #FFF;
    padding: 7px 5px;
    vertical-align: middle;
    width: 7em;
    line-height: 1.25em !important;
    font-weight: 400
}

body.page-company-seminars-list .cf-custom-content-02 table.table01 tbody tr:last-child th,
.public-seminars-list .cf-custom-content-02 table.table01 tbody tr:last-child th {
    border: #d8d8d8 solid 1px;
    line-height: 1.25em !important
}

body.page-company-seminars-list .cf-custom-content-02 table.table01 tbody td,
.public-seminars-list .cf-custom-content-02 table.table01 tbody td {
    background: #FFF;
    padding: 7px 5px;
    border: #d8d8d8 solid 1px !important;
    vertical-align: middle
}

body.page-company-seminars-list .cf-custom-content-02 table.table01 tbody td p,
.public-seminars-list .cf-custom-content-02 table.table01 tbody td p {
    margin-bottom: 0 !important;
    text-align: left !important;
    line-height: 150% !important
}

body.page-company-seminars-list .cf-custom-content-02 .note-red,
.public-seminars-list .cf-custom-content-02 .note-red {
    color: #ff0000
}

body.page-company-seminars-list .cf-custom-content-02 h1,
.public-seminars-list .cf-custom-content-02 h1 {
    position: relative;
    padding: .5em .75em;
    margin: 2rem 0;
    background-color: #f6f6f6;
    font-size: 2.3rem;
    font-weight: normal
}

body.page-company-seminars-list .tabs .div-select-month,
.public-seminars-list .tabs .div-select-month {
    display: none
}

body.page-company-seminars-list th.label-company-name,
.public-seminars-list th.label-company-name {
    width: 40%
}

body.page-company-seminars-list th.label-schedule-time,
.public-seminars-list th.label-schedule-time {
    width: 19%
}

body.page-company-seminars-list #days-list,
.public-seminars-list #days-list {
    line-break: anywhere
}

body.page-company-seminars-list #days-list a,
.public-seminars-list #days-list a {
    display: inline-block
}

@media screen and (max-width: 640px) {

    body.page-company-seminars-list table.table01 thead,
    .public-seminars-list table.table01 thead {
        display: none
    }

    body.page-company-seminars-list .cf-custom-content-02 table.table01 tbody th,
    .public-seminars-list .cf-custom-content-02 table.table01 tbody th {
        display: block;
        width: 100%;
        border-top: #fff solid 0px !important;
        border-bottom: #d8d8d8 solid 1px !important
    }

    body.page-company-seminars-list .cf-custom-content-02 table.table01 tbody td,
    .public-seminars-list .cf-custom-content-02 table.table01 tbody td {
        display: block;
        border-top: #fff solid 0px !important;
        border-bottom: #d8d8d8 solid 1px !important
    }

    body.page-company-seminars-list .cf-custom-content-02 table.table01 tbody td::before,
    .public-seminars-list .cf-custom-content-02 table.table01 tbody td::before {
        content: attr(label);
        float: left;
        clear: both;
        font-weight: bold;
        color: #999;
        font-size: 12px
    }

    body.page-company-seminars-list .cf-custom-content-02 table.table01 tbody td p,
    .public-seminars-list .cf-custom-content-02 table.table01 tbody td p {
        padding-left: 125px;
        text-align: left !important
    }

    body.page-company-seminars-list .tabs .tab-label,
    body.page-company-seminars-list .tabs .tab-radio,
    body.page-company-seminars-list .tabs .daybar,
    .public-seminars-list .tabs .tab-label,
    .public-seminars-list .tabs .tab-radio,
    .public-seminars-list .tabs .daybar {
        display: none
    }

    body.page-company-seminars-list .tabs .div-select-month,
    .public-seminars-list .tabs .div-select-month {
        display: block
    }

    body.page-company-seminars-list .tabs .div-select-month .select-month:focus,
    .public-seminars-list .tabs .div-select-month .select-month:focus {
        border: 1px solid black !important
    }
}

body.page-company-seminars-list .cf-others .sidemenu-title::before,
.public-seminars-list .cf-others .sidemenu-title::before {
    content: "language";
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    position: absolute;
    top: 5px;
    left: 8px;
    font-size: 2.4rem;
    color: #fff
}

body.page-company-seminars-list .cf-others .sidemenu-title,
.public-seminars-list .cf-others .sidemenu-title {
    padding-left: 36px !important
}

.company-online-seminar .top-content {
    font-size: 150%;
    margin: 20px 0 0 0;
    line-height: 150%;
    float: left
}

.company-online-seminar .company-contents p {
    margin-bottom: 1em;
    font-size: 1.4rem;
    word-break: break-word;
    color: #000
}

.company-online-seminar .company-contents .icon-online-seminar {
    padding: 0 5px 5px 0;
    width: 25px
}

.company-online-seminar .company-contents .title-schedule-list-container::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 1px;
    left: 0px;
    bottom: 0px;
    background-color: #d8d8d8
}

.company-online-seminar .company-contents .title-schedule-list-container::after {
    content: "";
    position: absolute;
    width: 160px;
    height: 1px;
    left: 0px;
    bottom: 0px;
    background-color: #89ABE3
}

.company-online-seminar .company-contents .title-schedule-list-container {
    position: relative;
    margin: 40px 0px 10px 0px
}

.company-online-seminar .company-contents .title-schedule-list-container .title-schedule-list {
    line-height: 1.5em;
    margin-bottom: 5px;
    color: #89ABE3
}

.company-online-seminar .company-contents .title-schedule-list-container .privacy-policy-noti {
    font-weight: bold
}

.company-online-seminar .company-contents .title-schedule-list-container .privacy-policy-noti a {
    text-decoration: underline
}

.company-online-seminar .olsem-list-table {
    border-left: 1px solid #ccc;
    margin: 0.5rem 0;
    width: 100%
}

.company-online-seminar .olsem-list-table th {
    border-right: 1px solid #eee;
    padding: 0.7rem 1rem;
    vertical-align: middle;
    line-height: 1.5rem;
    background: #f3f3f3;
    text-align: center;
    color: #666;
    font-size: 90%
}

.company-online-seminar .olsem-list-table td {
    border-right: 1px solid #eee;
    padding: 0.7rem 1rem;
    vertical-align: middle;
    line-height: 1.7rem;
    text-align: center
}

.company-online-seminar .b-end {
    border-right: 1px solid #ccc !important
}

.company-online-seminar .txt-bold {
    font-weight: bold
}

.company-online-seminar .txt-sml {
    font-size: 80% !important
}

.company-online-seminar .txt-over {
    color: #999
}

.company-online-seminar .button1 {
    color: #fff;
    margin: 0;
    display: inline-block;
    cursor: pointer
}

.company-online-seminar .button1.disabled {
    cursor: default;
    pointer-events: none
}

.company-online-seminar .button1 a {
    color: #fff;
    font-size: 90%;
    font-weight: 400;
    display: inline-block;
    text-align: center;
    text-decoration: none;
    border-radius: 5px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 7px 7px
}

.company-online-seminar .button1 a.button-disabled {
    background-color: #e2e4e4;
    color: #babcbe
}

.company-online-seminar .button-1 {
    background-color: #21bf73;
    white-space: nowrap
}

.company-detail-tab .cfn-tab.company-tab.nav-tabs.seminar-tabs {
    display: inline-block;
    max-width: 100%;
    width: auto
}

.company-detail-tab .cfn-tab.company-tab.nav-tabs.seminar-tabs li {
    margin-bottom: 10px;
    margin-right: 5px !important
}

.company-detail-tab .cfn-company-button-show.with-seminar-tabs {
    display: inline-block;
    max-width: 100%;
    width: auto
}

.top-contents.entry-finish .entry-info {
    margin: 40px 0 20px 0
}

.top-contents.entry-finish .recommend-job {
    margin: 40px 0 20px 0
}

.top-contents.entry-finish .button-bottom {
    margin-top: 30px
}

.top-contents.entry-finish .register-info {
    flex-wrap: wrap
}

.top-contents.entry-finish .register-info .seminar-detail {
    width: 100%;
    margin-bottom: 10px
}

.top-contents.entry-finish .register-info .seminar-detail .button-seminar-detail {
    margin: auto
}

.top-contents.entry-confirm .entry-info {
    margin-top: 20px
}

.top-contents.entry-confirm dl.seminar-info {
    width: 100%;
    text-align: left
}

.top-contents.entry-confirm dl.seminar-info dd,
.top-contents.entry-confirm dl.seminar-info dt {
    width: 100%
}

.top-contents.entry-confirm .button-complete {
    max-width: 300px;
    min-width: 240px;
    width: auto;
    white-space: nowrap;
    margin: 10px auto
}

.top-contents.entry-confirm .resume-flex-wrap {
    flex-wrap: wrap
}

.top-contents.entry-confirm .button-edit-bottom {
    margin: 10px 0
}

.paragraph-pre-line {
    white-space: pre-line
}

.public-seminars-list .title-list-company-seminar {
    position: relative;
    padding: .5em .75em;
    margin: 0 0 1rem;
    background-color: #f6f6f6;
    font-size: 2.3rem;
    font-weight: normal
}

.public-seminars-list .seminar-title {
    font-size: 14px
}

.text-right .pagination.display-inline-block .pagination-prev a,
.text-right .pagination.display-inline-block .pagination-next a,
.text-right .pagination.clear-f .pagination-prev a,
.text-right .pagination.clear-f .pagination-next a {
    color: #000;
    border: none;
    border-radius: 0
}

.text-right .pagination.display-inline-block .pagination-prev a:hover,
.text-right .pagination.display-inline-block .pagination-next a:hover,
.text-right .pagination.clear-f .pagination-prev a:hover,
.text-right .pagination.clear-f .pagination-next a:hover {
    padding: 1px
}

.text-right .pagination.display-inline-block .pagination-page.active a,
.text-right .pagination.clear-f .pagination-page.active a {
    color: #fff;
    background-color: #3A50C9;
    border-color: #3A50C9
}

.text-right .pagination.display-inline-block .pagination-page a,
.text-right .pagination.clear-f .pagination-page a {
    padding: 0
}

.page-top .top-logo-container {
    justify-content: center
}

.page-top .top-logo-container>li {
    padding: 0 1px
}

.page-top .top-logo-container img {
    width: 118px;
    height: 75px;
    max-width: 100%
}

.page-top .top-logo .top-logo-news {
    margin: 0px !important;
    padding: 0px 48px;
    text-align: left !important
}

.page-top .top-logo .top-logo-news:last-of-type {
    margin-bottom: 40px
}

.page-top .top-venue-info {
    height: auto;
    max-height: 300px
}

.page-top .company-describe {
    padding-bottom: 60px
}

.page-top .company-describe p {
    text-align: center;
    font-size: 1.6rem
}

.page-top .top-agent {
    padding: 60px 0
}

@media only screen and (max-width: 767px) {
    .page-top .top-agent {
        padding: 60px 15px
    }
}

.page-top .top-agent .top-wrapper {
    max-width: 1010px;
    padding: 0
}

@media only screen and (max-width: 767px) {
    .page-top .top-agent .top-wrapper {
        margin: 0 -15px
    }
}

.page-top .top-agent .top-wrapper-left {
    width: 580px
}

@media only screen and (max-width: 1240px) {
    .page-top .top-agent .top-wrapper-left {
        width: 60%;
        padding: 0 15px
    }
}

@media only screen and (max-width: 767px) {
    .page-top .top-agent .top-wrapper-left {
        width: 100%
    }
}

.page-top .top-agent .top-wrapper-left p {
    font-size: 1.4rem
}

.page-top .top-agent .top-wrapper-right {
    width: 280px
}

@media only screen and (max-width: 1240px) {
    .page-top .top-agent .top-wrapper-right {
        width: 40%;
        padding: 0 15px
    }
}

@media only screen and (max-width: 767px) {
    .page-top .top-agent .top-wrapper-right {
        width: 100%
    }
}

.page-top .top-agent .top-wrapper-right p {
    text-align: center
}

@media only screen and (max-width: 1240px) {
    .page-top .top-agent .top-wrapper-right img {
        max-width: 100%;
        height: auto
    }
}

@media only screen and (max-width: 767px) {
    .page-top .top-agent .top-wrapper-right img {
        max-width: 70%
    }
}

.page-top .top-agent .button {
    width: 280px;
    height: 42px;
    color: #fff;
    font-size: 1.4rem;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s;
    box-shadow: 0px 3px 0px rgba(0, 0, 0, 0.3)
}

.page-top .top-agent .button:hover::before {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 1
}

.page-top .top-agent .button:hover,
.page-top .top-agent .button:focus,
.page-top .top-agent .button:active {
    color: #fff
}

.page-top .top-agent .button::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: -116px;
    left: 0px;
    border-radius: 100%;
    background-color: #3a50c9;
    width: 280px;
    height: 280px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    opacity: 0.2
}

@media only screen and (max-width: 480px) {
    .page-top .top-agent .button {
        margin: 0 auto
    }
}

.page-top .top-app-container {
    position: relative
}

.page-top .top-app-container #app_overlay {
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    position: absolute;
    text-align: center;
    font-size: 6.0rem;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center
}

.page-top .notification-with-s3 {
    margin-top: 10px
}

@-moz-document url-prefix() {
    .page-top .top-logo-container img {
        border: 1px solid #decdcd
    }
}

.header-cfn .header-top .h1-content {
    max-width: 50vw;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.header-cfn .header-top .header-top-link .header-top-link-right {
    float: left;
    position: relative
}

.header-cfn .header-top .header-top-link .header-top-link-right a {
    font-size: 1.3rem;
    font-weight: bold
}

.header-cfn .header-top .header-top-link .header-top-link-right .top-links-dropdown {
    display: none;
    background-color: #fff;
    position: absolute;
    top: 18px;
    right: 0;
    min-width: 320px;
    box-shadow: 1px 1px 8px #ddd;
    z-index: 999;
    padding: 20px
}

.header-cfn .header-top .header-top-link .header-top-link-right .top-links-dropdown a {
    font-size: 1.4rem;
    color: #000;
    clear: both;
    cursor: pointer;
    float: left
}

.header-cfn .header-top .header-top-link .header-top-link-right .top-links-dropdown a:hover {
    color: #3A50C9
}

.header-cfn .header-top .header-top-link .header-top-link-right:hover .top-links-dropdown,
.header-cfn .header-top .header-top-link .header-top-link-right:active .top-links-dropdown {
    display: block
}

.header-cfn .header-top .header-top-link a.company-manager {
    color: #fff !important;
    padding: 0 5px;
    margin: 0 5px;
    cursor: pointer !important
}

.header-cfn .header-top .header-top-link a.company-manager:hover {
    color: #3A50C9 !important
}

.header-cfn .header-top .header-top-link .seperate-mark,
.header-cfn .header-top .header-top-link .using-language {
    margin: 0 0 0 5px;
    color: #000;
    float: left
}

.top-venue .top-page-dummy-image img {
    width: 100%;
    height: auto
}

.internship-job-search #is {
    padding: 20px 0;
    max-width: 760px;
    margin: auto
}

@media only screen and (max-width: 480px) {
    .internship-job-search #is .dropdown-menu.dropdown-menu-left.datetime-picker-dropdown {
        left: 0px !important;
        right: 0px !important
    }
}

.internship-job-search #is #is-top .is-search {
    background: #f5f5f5;
    padding: 1vw 3vw 2vw 3vw;
    margin-bottom: 1vw
}

.internship-job-search #is #is-top .is-search .is-search-pulldown {
    display: -webkit-flex;
    -webkit-justify-content: space-between;
    -webkit-align-items: stretch;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.internship-job-search #is #is-top .is-search .is-search-pulldown dl {
    width: 48%;
    margin: 0;
    margin-bottom: 10px
}

.internship-job-search #is #is-top .is-search .is-search-pulldown dl dt {
    background: #3D4294;
    color: #fff;
    font-size: 14px;
    text-align: center;
    padding: 0.4em 0;
    margin-bottom: 5px
}

.internship-job-search #is #is-top .is-search .is-search-pulldown dl dd input,
.internship-job-search #is #is-top .is-search .is-search-pulldown dl dd select {
    width: 100%;
    font-size: 12px;
    padding: 0.2em
}

.internship-job-search #is #is-top .is-search .is-search-pulldown #search-area,
.internship-job-search #is #is-top .is-search .is-search-pulldown #search-type {
    margin-bottom: 20px
}

.internship-job-search #is #is-top .is-search .is-search-pulldown dl.wide {
    width: 100%
}

.internship-job-search #is #is-top .is-search .is-search-pulldown #search-month dd {
    display: -webkit-flex;
    -webkit-justify-content: space-between;
    -webkit-align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.internship-job-search #is #is-top .is-search .is-search-pulldown #search-month dd input {
    width: calc(50% - 0.8em)
}

.internship-job-search #is #is-top .is-search .is-search-tag {
    margin-bottom: 1vw
}

.internship-job-search #is #is-top .is-search .is-search-tag ul {
    list-style: none;
    display: -webkit-flex;
    -webkit-justify-content: flex-start;
    -webkit-align-items: stretch;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.internship-job-search #is #is-top .is-search .is-search-tag ul li {
    margin-bottom: 5px;
    margin-right: 5px
}

.internship-job-search #is #is-top .is-search .is-search-tag ul li label {
    font-size: 12px;
    overflow: hidden;
    margin-bottom: 0;
    border: solid 1px #ccc;
    border-radius: 0.3em;
    padding: 0.3em 0.7em 0.3em 0.833333em;
    background: url(/assets/icon-search-911ee9f406f2f642c29edc2aa4bfbe9ce68bc1d7ad8c85f8b3aaaf0173e2d233.svg) left 0.6em center/1em no-repeat #fff;
    cursor: pointer;
    vertical-align: top;
    display: flex
}

.internship-job-search #is #is-top .is-search .is-search-tag ul li label input {
    display: inline-block;
    -webkit-transform: translateX(-999px);
    -ms-transform: translateX(-999px);
    transform: translateX(-999px)
}

.internship-job-search #is #is-top .is-search .is-search-tag ul li label.on {
    background: url(/assets/icon-search-white-ece2a8b3d3d3508748ef41545f52b042fa422635bc961e266e0584fd712e4f2d.svg) left 0.6em center/1em no-repeat #3974f3;
    color: #fff
}

.internship-job-search #is #is-top .is-search h3 {
    background: #3D4294;
    color: #fff;
    text-align: center;
    font-size: 14px;
    padding: 0.5em 0em
}

.internship-job-search #is #is-top .is-search .is-search-submit {
    text-align: center
}

.internship-job-search #is #is-top .is-search .is-search-submit button {
    display: inline-block;
    font-size: 15px;
    line-height: 1em;
    padding: 0.5em 1em;
    border-radius: 3em;
    background: #fff;
    margin: 0 5px;
    font-weight: bold
}

.internship-job-search #is #is-top .is-search .is-search-submit button[type="button"] {
    background: #3974f3;
    color: #fff
}

.internship-job-search #is #is-top .is-search .is-search-keyword input {
    font-size: 12px;
    padding: 5px;
    margin-bottom: 1em;
    width: 100%;
    background: url(/assets/icon-search-911ee9f406f2f642c29edc2aa4bfbe9ce68bc1d7ad8c85f8b3aaaf0173e2d233.svg) right 0.5em center/1em no-repeat #fff;
    border: solid 1px #ccc
}

.internship-job-search #is #is-top .is-search .is-search-keyword ::placeholder {
    color: grey;
    opacity: 0.5
}

.internship-job-search #is #is-top #is-search-all {
    margin: 2vw 5vw
}

.internship-job-search #is #is-top #is-search-all a {
    background: #3974f3;
    color: #fff;
    font-size: 12px;
    text-align: center;
    padding: 0.5em;
    border-radius: 0.5em;
    display: -webkit-flex;
    -webkit-justify-content: center;
    -webkit-align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.internship-job-search #is #is-top #is-search-all a:hover {
    cursor: pointer !important
}

.internship-job-search #is #is-top #is-search-all a i {
    font-size: 30px;
    margin-right: 7px
}

.internship-job-search #is #is-top .is-narration {
    background: #f5f5f5;
    padding: 1vw 2vw;
    font-size: 1.2rem;
    font-weight: normal
}

.internship-job-search #is #is-top .is-narration h2 {
    font-size: 1.6rem;
    margin-top: 20px;
    margin-bottom: 10px;
    font-weight: 700
}

.internship-job-search #is #is-top .is-narration .is-narration-top {
    background: white;
    padding: 0.3vw 2.5vw;
    border-radius: 1em
}

.internship-job-search .cfn_front {
    -webkit-font-feature-settings: "palt";
    font-feature-settings: "palt";
    color: #3B4043;
    font-family: "Noto Serif JP", serif
}

.internship-job-search .cfn_front *,
.internship-job-search .cfn_front *:before,
.internship-job-search .cfn_front *:after {
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box
}

.internship-job-search .cfn_front .cfnt--sns {
    width: 290px;
    margin: 10rem auto
}

.internship-job-search .cfn_front .cfnt--sns .icn_cfn {
    margin: 0 auto 15px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 15px
}

.internship-job-search .cfn_front .cfnt--sns .icn_cfn img {
    width: 51px;
    margin-right: 15px
}

.internship-job-search .cfn_front .cfnt--sns .app-links-banners {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin: 0 auto 30px
}

.internship-job-search .cfn_front .cfnt--sns .app-links-banners a {
    width: 140px;
    margin: 0 auto
}

.internship-job-search .cfn_front .cfnt--sns ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.internship-job-search .cfn_front .cfnt--sns ul li a img {
    height: 50px
}

.internship-job-search .cfn_front img {
    height: auto;
    max-width: 100%;
    -o-object-fit: contain;
    object-fit: contain;
    vertical-align: bottom
}

.internship-job-search .cfn_front a {
    text-decoration: none;
    color: #3B4043
}

.internship-job-search .cfn_front li {
    list-style: none
}

.internship-job-search .cfn_front p,
.internship-job-search .cfn_front dd,
.internship-job-search .cfn_front td,
.internship-job-search .cfn_front li {
    font-size: 12px;
    line-height: 1.8;
    margin-bottom: 0
}

.internship-job-search #industries-modal .industry-category-name {
    text-align: center;
    padding-top: 20px;
    padding-bottom: 20px;
    margin-bottom: 20px;
    background-color: #f5f5f5;
    font-weight: bold
}

.internship-job-search #industries-modal.fade .modal-header {
    background-color: #3D4294
}

@media (min-width: 768px) {
    .internship-job-search #industries-modal .modal-content {
        margin-left: 30%;
        margin-right: 30%
    }
}

.internship-job-search .list-select-industry {
    margin-left: 20px
}

.internship-job-search .search-internship-job-month {
    position: relative
}

.internship-job-search .search-internship-job-month .material-icons {
    position: absolute;
    right: 0px
}

@media only screen and (min-width: 1600px) {
    .internship-job-search #is #is-top #is-search-all {
        margin: 1vw 2vw
    }
}

@media screen and (max-width: 768px) {
    .internship-job-search #is #is-top .is-search {
        padding: 3vw
    }

    .internship-job-search #is #is-top .is-search .is-search-tag {
        margin-bottom: 1vw
    }

    .internship-job-search #is #is-top .is-search .is-search-tag ul {
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }

    .internship-job-search #is #is-top .is-search .is-search-tag ul li {
        width: 32%;
        margin: 0;
        margin-bottom: 1vw
    }

    .internship-job-search #is #is-top .is-search .is-search-tag ul li label {
        width: 100%;
        padding-left: 1.4em;
        padding-right: 0;
        padding-top: 1em;
        padding-bottom: 1em;
        background-size: 0.8em;
        background-position: left 0.3em center;
        line-height: 1em;
        vertical-align: middle
    }

    .internship-job-search #is #is-top .is-search .is-search-tag ul li label input {
        display: none
    }

    .internship-job-search #is #is-top .is-search .is-search-tag ul li label.on {
        background-size: 0.8em;
        background-position: left 0.3em center
    }

    .internship-job-search #is #is-top .is-search .is-search-submit button {
        font-size: 14px
    }

    .internship-job-search #is #is-top .is-search .is-search-pulldown {
        flex-wrap: wrap
    }

    .internship-job-search #is #is-top .is-search .is-search-pulldown dl {
        width: 48%
    }
}

@media screen and (max-width: 485px) {
    .internship-job-search #is #is-top .is-search .is-search-tag ul li label {
        font-size: 10px
    }

    .internship-job-search #is #is-top .is-search .is-search-submit button {
        font-size: 12px
    }

    .internship-job-search #is #is-top .is-search .is-search-pulldown dl dt {
        font-size: 12px
    }

    .internship-job-search #is #is-top .is-search h3 {
        font-size: 14px
    }

    .internship-job-search #is #is-top .is-search .is-search-keyword input {
        font-size: 10px
    }

    .internship-job-search #is #is-top span {
        font-size: 10px
    }

    .internship-job-search #is #is-top #is-search-all h3 {
        font-size: 14px
    }

    .internship-job-search #is #is-top #is-search-all a {
        font-size: 10px
    }

    .internship-job-search #is #is-top #is-search-all a i {
        font-size: 22px
    }
}

@font-face {
    font-family: 'Material Symbols Outlined';
    font-style: normal;
    font-weight: 400;
    src: url(https://fonts.gstatic.com/s/materialsymbolsoutlined/v39/kJEhBvYX7BgnkSrUwT8OhrdQw4oELdPIeeII9v6oFsI.woff2) format("woff2")
}

.internship-job-result {
    word-wrap: break-word
}

.internship-job-result .mt-30 {
    margin-top: 30px !important
}

.internship-job-result .mt-16 {
    margin-top: 16px !important
}

.internship-job-result .mt-10 {
    margin-top: 10px !important
}

.internship-job-result .not-visibility {
    visibility: hidden
}

.internship-job-result .text-orange {
    color: #e67e22
}

.internship-job-result .text-blue {
    color: #89ABE3
}

.internship-job-result .button-disabled {
    border: 1px solid #babcbe;
    background-color: #e2e4e4 !important;
    color: #babcbe;
    cursor: default;
    pointer-events: none
}

.internship-job-result .material-symbols-outlined {
    font-family: 'Material Symbols Outlined';
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased
}

.internship-job-result #is {
    padding: 20px 0;
    max-width: 760px;
    margin: auto
}

.internship-job-result #is #is-result .is-functions {
    margin-bottom: 30px;
    display: -webkit-flex;
    -webkit-justify-content: space-between;
    -webkit-align-items: stretch;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch
}

.internship-job-result #is #is-result .is-functions span {
    font-size: 24px;
    color: #000;
    line-height: 1em
}

.internship-job-result #is #is-result .is-functions ins {
    text-decoration: none;
    font-size: 16px;
    font-weight: bold;
    line-height: 1em
}

.internship-job-result #is #is-result .is-functions .is-functions-pagetype {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.internship-job-result #is #is-result .is-functions .is-functions-pagetype a {
    display: inline-block;
    margin-right: 14px;
    line-height: 1em;
    border: solid 2px #3D4294;
    padding: 0.5em;
    font-size: 14px;
    border-radius: 4em;
    -webkit-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
    position: relative
}

.internship-job-result #is #is-result .is-functions .is-functions-pagetype a:hover {
    opacity: 0.7
}

.internship-job-result #is #is-result .is-functions .is-functions-pagetype a.on {
    background: #3D4294
}

.internship-job-result #is #is-result .is-functions .is-functions-pagetype a.on span {
    color: #fff
}

.internship-job-result #is #is-result .is-functions .is-functions-pagetype a ins {
    position: absolute;
    bottom: -1.5em;
    left: 0;
    width: 100%;
    text-align: center;
    font-size: 6px;
    white-space: nowrap;
    display: -webkit-flex;
    -webkit-justify-content: center;
    -webkit-align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 12px
}

.internship-job-result #is #is-result .is-functions .is-functions-sort {
    margin-left: 20px
}

.internship-job-result #is #is-result .is-result .is-result-wrapper .article-result-2:hover {
    cursor: pointer;
    background-color: #dddddd
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article {
    border: solid 1px #ccc;
    background: #fff;
    -webkit-box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.2);
    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.2);
    padding: 10px;
    position: relative
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article .tag ul li {
    display: inline-block;
    border: solid 2px #3D4294;
    font-size: 14px;
    line-height: 1em;
    margin-bottom: 0.5em;
    margin-right: 0.2em;
    padding: 0.4em 1em;
    border-radius: 2em;
    white-space: nowrap
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article h3 {
    border-radius: 4px;
    position: relative;
    background: #3974f3;
    color: #fff;
    font-size: 16px;
    padding: 0.6em 0.6em;
    line-height: 1.8em;
    margin: 0.4em 0
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article h3 .status-icon {
    min-width: 80px;
    font-size: 14px;
    border-radius: 4px;
    padding: 5px;
    position: absolute;
    display: -webkit-flex;
    text-align: center;
    -webkit-justify-content: center;
    -webkit-align-items: center;
    color: #fff;
    background-color: #e67e22;
    right: -4px;
    top: -16px;
    height: 30px
}

@media only screen and (max-width: 767px) {
    .internship-job-result #is #is-result .is-result .is-result-wrapper article h3 .status-icon {
        font-size: 16px;
        min-width: 70px;
        padding: 4px
    }
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article p {
    font-size: 14px;
    margin-bottom: 0.5em
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article .card-block {
    margin-bottom: 20px
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article .card-block h4 {
    border-left: solid 3px #3974f3;
    line-height: 1em;
    padding: 0.4em 0.6em;
    font-size: 16px
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article .card-block p {
    font-size: 14px;
    margin-bottom: 0
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article .card-bottom {
    bottom: 0;
    right: 5px;
    z-index: 2;
    margin-top: 10px
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article .card-bottom .card-favorite span {
    font-size: 1.2em;
    vertical-align: middle
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article .card-company dl {
    margin-top: 0;
    display: -webkit-flex;
    -webkit-justify-content: flex-start;
    -webkit-align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: flex
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article .card-company dl .row {
    margin-left: 10px
}

@media only screen and (max-width: 480px) {
    .internship-job-result #is #is-result .is-result .is-result-wrapper article .card-company dl .row {
        width: calc(60vw - 120px)
    }
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article .card-company dl .row li {
    display: inline-block;
    border: solid 2px #3D4294;
    font-size: 12px;
    line-height: 1em;
    margin-bottom: 0.5em;
    margin-right: 0.2em;
    padding: 0.4em 1em;
    border-radius: 2em;
    white-space: nowrap
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article .card-company dl dt {
    border-radius: 4px;
    margin-right: 5px;
    flex: 0 0 70px;
    text-align: center
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article .card-company dl dt img.card-screen {
    aspect-ratio: 1/1;
    height: 70px;
    object-fit: contain;
    border-radius: 4px
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article .card-company dl dt img.list-screen {
    aspect-ratio: 2/1;
    height: 70px;
    object-fit: contain;
    border-radius: 4px
}

@media only screen and (max-width: 767px) {
    .internship-job-result #is #is-result .is-result .is-result-wrapper article .card-company dl dt img {
        max-width: 25vw;
        height: auto
    }

    .internship-job-result #is #is-result .is-result .is-result-wrapper article .card-company dl dt img.list-screen {
        aspect-ratio: auto
    }
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article .card-company dl dd {
    top: 50%;
    font-size: 18px;
    word-break: break-word;
    flex: 1
}

@media only screen and (max-width: 480px) {
    .internship-job-result #is #is-result .is-result .is-result-wrapper article .card-company dl dd {
        font-size: 16px
    }
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article .card-info dl {
    display: -webkit-flex;
    -webkit-justify-content: space-between;
    -webkit-align-items: stretch;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    margin: 0
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article .card-info dl dd {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.internship-job-result #is #is-result #is-result-list #is-result-list-wrapper article {
    margin-bottom: 20px
}

.internship-job-result #is #is-result #is-result-list #is-result-list-wrapper article .list-top .company-name {
    font-size: 18px;
    margin-right: 5px
}

.internship-job-result #is #is-result #is-result-list #is-result-list-wrapper article .list-top .banner {
    display: -webkit-flex;
    -webkit-justify-content: flex-end;
    -webkit-align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-end;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: flex-start;
    max-width: 50%;
    margin-right: 10px
}

@media only screen and (min-width: 780px) {
    .internship-job-result #is #is-result #is-result-list #is-result-list-wrapper article .list-top .banner {
        min-width: 40%
    }
}

.internship-job-result #is #is-result #is-result-list #is-result-list-wrapper article .list-top .banner span {
    min-width: 250px;
    display: inline-block;
    background: #3974f3;
    color: #fff;
    font-size: 14px;
    font-weight: bold;
    line-height: 1em;
    padding: 0.4em 0.7em;
    margin-left: 2px;
    border-radius: 4px;
    text-align: center;
    word-break: break-word
}

.internship-job-result #is #is-result #is-result-list #is-result-list-wrapper article .list-top .banner .ad {
    margin-left: 5px
}

.internship-job-result #is #is-result #is-result-list #is-result-list-wrapper article .list-top .banner .ad span {
    font-size: 16px;
    padding: 0.1em 1em;
    font-weight: bold;
    color: #3974f3;
    border: solid 2px #3974f3;
    border-radius: 0.3em
}

.internship-job-result #is #is-result #is-result-list #is-result-list-wrapper article .list-top .card-company dl {
    margin: 0
}

.internship-job-result #is #is-result #is-result-list #is-result-list-wrapper article .list-top .card-company dl .header-job {
    width: 100%
}

.internship-job-result #is #is-result #is-result-list #is-result-list-wrapper article .list-top .card-company dl .row {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 10px
}

.internship-job-result #is #is-result #is-result-list #is-result-list-wrapper article .date dl {
    display: -webkit-flex;
    -webkit-justify-content: flex-start;
    -webkit-align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.internship-job-result #is #is-result #is-result-list #is-result-list-wrapper article .date dl dt {
    border-radius: 4px;
    background: #3D4294;
    color: #fff;
    padding: 0.3em 1em;
    margin-right: 0.5em;
    width: 150px;
    text-align: center;
    font-size: 14px
}

.internship-job-result #is #is-result #is-result-list #is-result-list-wrapper article .date dl dt.label-tag-applied {
    position: absolute;
    bottom: 10px;
    right: 5px;
    background-color: #1e588f
}

.internship-job-result #is #is-result #is-result-list #is-result-list-wrapper article .date dl dd {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    font-size: 14px;
    font-weight: bold
}

.internship-job-result #is #is-result #is-result-list #is-result-list-wrapper article .date dl dd span {
    display: inline-block
}

.internship-job-result #is .entry-fixed {
    position: -webkit-sticky;
    position: sticky;
    bottom: 0;
    left: 0;
    z-index: 5000;
    background: #DCDCDC;
    width: 100%;
    height: 80px;
    display: -webkit-flex;
    -webkit-justify-content: center;
    -webkit-align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.internship-job-result #is .entry-fixed .apply a {
    background: #2b37bc
}

.internship-job-result #is .entry-fixed .apply .button {
    display: inline-flex
}

@media only screen and (max-width: 480px) {
    .internship-job-result #is .entry-fixed .apply span {
        font-size: 12px
    }
}

@media only screen and (max-width: 395px) {
    .internship-job-result #is .entry-fixed .apply span {
        font-size: 10px
    }
}

@media only screen and (max-width: 345px) {
    .internship-job-result #is .entry-fixed .apply span {
        font-size: 8px
    }
}

@media only screen and (max-width: 280px) {
    .internship-job-result #is .entry-fixed .apply span {
        font-size: 7px
    }
}

.internship-job-result #is .entry-fixed .is-result-card-ui-prev {
    width: 50%
}

.internship-job-result #is .entry-fixed a {
    font-size: 14px;
    width: 15em;
    height: 3em;
    display: -webkit-flex;
    -webkit-justify-content: center;
    -webkit-align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer
}

@media only screen and (max-width: 760px) {
    .internship-job-result #is .entry-fixed a:hover {
        color: #3A50C9
    }
}

@media only screen and (max-width: 480px) {
    .internship-job-result #is .entry-fixed a {
        font-size: 12px
    }
}

@media only screen and (max-width: 395px) {
    .internship-job-result #is .entry-fixed a {
        font-size: 10px
    }
}

@media only screen and (max-width: 345px) {
    .internship-job-result #is .entry-fixed a {
        font-size: 8px
    }
}

@media only screen and (max-width: 280px) {
    .internship-job-result #is .entry-fixed a {
        font-size: 7px
    }
}

.internship-job-result #is-result-card .is-result-card-ui {
    display: -webkit-flex;
    -webkit-justify-content: space-between;
    -webkit-align-items: stretch;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch
}

.internship-job-result #is-result-card .is-result-card-ui .button {
    width: 13em;
    height: 4em
}

.internship-job-result #is-result-card .is-result-card-ui .job-expired {
    margin-top: 1.7em
}

@media only screen and (max-width: 550px) {
    .internship-job-result #is-result-card .is-result-card-ui .job-expired {
        margin-top: 1em
    }

    .internship-job-result #is-result-card .is-result-card-ui .job-expired .job-expired-text {
        margin-top: 1.7em
    }
}

.internship-job-result #is-result-card .is-result-card-ui dl dt {
    text-align: center
}

.internship-job-result #is-result-card .is-result-card-ui dl dt span {
    font-size: 36px
}

@media only screen and (max-width: 767px) {
    .internship-job-result #is-result-card .is-result-card-ui dl dt span {
        font-size: 30px
    }
}

@media only screen and (max-width: 480px) {
    .internship-job-result #is-result-card .is-result-card-ui dl dt span {
        font-size: 25px
    }
}

@media only screen and (max-width: 350px) {
    .internship-job-result #is-result-card .is-result-card-ui dl dt span {
        font-size: 20px
    }
}

.internship-job-result #is-result-card .is-result-card-ui dl.check dt span {
    color: #f00
}

.internship-job-result #is-result-card .is-result-card-ui dl.check dd {
    color: #f00
}

.internship-job-result #is-result-card #is-result-card-wrapper article {
    -webkit-transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
    -o-transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
    opacity: 0;
    -webkit-transform: scale(0.9) rotate(-5deg);
    -ms-transform: scale(0.9) rotate(-5deg);
    transform: scale(0.9) rotate(-5deg)
}

.internship-job-result #is-result-card #is-result-card-wrapper article .event-name {
    min-width: 250px;
    display: inline-block;
    color: #fff;
    font-size: 14px;
    font-weight: bold;
    line-height: 1em;
    padding: 0.4em 0.7em;
    margin-left: 2px;
    border-radius: 4px;
    text-align: center;
    margin-bottom: 0.5em
}

.internship-job-result #is-result-card #is-result-card-wrapper article .tag {
    padding: 0 20px
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper {
    padding: 0 20px
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-block h4 {
    border-left: solid 3px #3974f3;
    line-height: 1em;
    padding: 0.4em 0.6em;
    font-size: 16px
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-block table {
    width: 100%
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-block table tr th {
    text-align: left;
    background: #f5f5f5;
    width: 30%;
    vertical-align: text-top
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-block table tr td {
    word-break: break-word
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-block table tr td span {
    display: inline-block
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-block table.additional-questions .number-col {
    width: 10px
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-block table.additional-questions tr th {
    text-align: center;
    width: auto
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-block table.additional-questions tr td:nth-child(1) {
    width: 5%
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-block table.additional-questions tr td:nth-child(2) {
    width: 25%
}

@media only screen and (max-width: 767px) {
    .internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-block table.additional-questions tr td:nth-child(2) {
        width: 35%
    }
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-block p {
    font-size: 14px;
    margin-bottom: 0
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-block b.introduce-question p {
    font-size: 13px
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-info {
    display: -webkit-flex;
    -webkit-justify-content: space-between;
    -webkit-align-items: stretch;
    display: -webkit-box;
    display: -ms-flexbox;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch
}

@media only screen and (min-width: 1100px) {
    .internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-info {
        display: inline-block
    }
}

@media only screen and (max-width: 1100px) {
    .internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-info {
        display: flex
    }
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-info.result dl {
    margin: 0;
    display: flex
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-info.result dl dt {
    padding-right: 0.5em
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-info.result dl dt span {
    font-size: inherit
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-info.result dl dd {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

@media only screen and (min-width: 1100px) {
    .internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-resume-language {
        float: right
    }
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper h3 {
    position: relative;
    line-height: 1.8em;
    background: #3974f3;
    color: #fff;
    border-radius: 4px;
    padding: 0.6em 0.6em
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper h3 .status-icon {
    min-width: 92px;
    font-size: 18px;
    border-radius: 4px;
    padding: 5px;
    position: absolute;
    display: inline-block;
    text-align: center;
    color: #fff;
    background-color: #e67e22;
    left: auto;
    top: -25px
}

@media only screen and (max-width: 767px) {
    .internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper h3 .status-icon {
        font-size: 16px;
        min-width: 70px;
        padding: 4px
    }
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .center {
    text-align: center
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper img {
    max-height: 200px;
    display: inline
}

@media only screen and (max-width: 767px) {
    .internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper img {
        max-height: 180px;
        max-width: 100%
    }
}

.internship-job-result #is-result-card #is-result-card-wrapper article.slick-active {
    opacity: 1;
    -webkit-transform: scale(1) rotate(0);
    -ms-transform: scale(1) rotate(0);
    transform: scale(1) rotate(0)
}

.internship-job-result #is-result-modal {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    z-index: 1000;
    display: -webkit-flex;
    -webkit-justify-content: center;
    -webkit-align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: none
}

.internship-job-result #is-result-modal #is-result-modal-inner {
    width: 55%;
    background: #fff;
    padding: 10px
}

@media only screen and (min-width: 768px) {
    .internship-job-result #is-result-modal #is-result-modal-inner {
        overflow-y: auto;
        max-height: calc(100vh - 2%)
    }
}

.internship-job-result #is-result-modal #is-result-modal-inner #is-resutl-modal-close {
    margin-right: 15px
}

.internship-job-result #is-result-modal #is-result-modal-inner #card-add-favorite {
    margin-left: 15px
}

.internship-job-result #is-result-modal #is-result-modal-inner #is-result-card #is-result-card-wrapper article {
    height: 500px;
    overflow-y: auto;
    overflow-x: hidden;
    opacity: 1;
    -webkit-transform: scale(1) rotate(0);
    -ms-transform: scale(1) rotate(0);
    transform: scale(1) rotate(0)
}

.internship-job-result #is-result-modal #is-result-modal-inner #is-result-card #is-result-card-wrapper article .card-company dl {
    display: -webkit-flex;
    -webkit-justify-content: flex-start;
    -webkit-align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.internship-job-result #is-result-modal #is-result-modal-inner #is-result-card #is-result-card-wrapper article .card-company dl dt img.modal-screen {
    aspect-ratio: 1/1;
    object-fit: contain;
    max-width: 90px
}

.internship-job-result #is-result-modal #is-result-modal-inner #is-result-card #is-result-card-wrapper article .card-company dl dd {
    font-size: 18px;
    word-break: break-word;
    margin-left: 10px
}

@media only screen and (max-width: 480px) {
    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card #is-result-card-wrapper article .card-company dl dd {
        font-size: 16px
    }
}

.internship-job-result #is-result-modal #is-result-modal-inner .tag {
    padding: 0 20px
}

.internship-job-result #is-result-modal #is-result-modal-inner .tag ul li {
    display: inline-block;
    border: solid 2px #3D4294;
    font-size: 14px;
    line-height: 1em;
    margin-bottom: 0.5em;
    margin-right: 0.2em;
    padding: 0.4em 1em;
    border-radius: 2em;
    white-space: nowrap
}

.internship-job-result #is-result-modal #is-result-modal-inner .mg-bottom-0 {
    margin-bottom: 0
}

.internship-job-result #is-result-modal #is-result-modal-inner .width-80 {
    width: 80px !important
}

.internship-job-result #is-result-modal #is-result-modal-inner .padding-top-5 {
    padding-top: 5px
}

.internship-job-result #is-result-modal.active {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

@media only screen and (min-width: 800px) {
    .internship-job-result #is-result-modal .new-status-for-job {
        font-size: 14px;
        border-radius: 4px;
        padding: 0px 4px 2px 4px;
        text-align: center;
        color: #fff;
        background-color: #e67e22;
        width: 40%;
        float: right;
        margin-right: 10px;
        font-weight: bold
    }
}

@media screen and (max-width: 768px) {
    .internship-job-result #is #is-result .is-functions {
        margin-bottom: 5vw
    }

    .internship-job-result #is #is-result .is-functions span {
        font-size: 3vw
    }

    .internship-job-result #is #is-result .is-functions ins {
        font-size: 3vw
    }

    .internship-job-result #is #is-result .is-functions .is-functions-pagetype a ins {
        font-size: 10px
    }

    .internship-job-result #is #is-result #is-result-list #is-result-list-wrapper article .list-top .banner span {
        min-width: 120px;
        max-width: 120px;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden
    }

    .internship-job-result #is-result-modal #is-result-modal-inner {
        width: calc(100% - 5vw);
        overflow: auto;
        padding: 4vw
    }

    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card #is-result-card-wrapper article {
        padding: 10px;
        height: calc(80vh - 25vw)
    }
}

@media screen and (max-width: 768px) and (max-width: 550px) {
    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card #is-result-card-wrapper article {
        height: calc(80vh - 41vw)
    }
}

@media screen and (max-width: 768px) {
    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card #is-result-card-wrapper article .tag {
        padding: 0
    }

    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card #is-result-card-wrapper article .tag ul li {
        font-size: 2vw
    }

    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card #is-result-card-wrapper article .card-wrapper {
        padding: 0
    }

    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card #is-result-card-wrapper article .card-wrapper .card-block {
        margin-bottom: 2vw
    }

    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card #is-result-card-wrapper article .card-wrapper .card-block h4 {
        font-size: 3.5vw
    }

    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card #is-result-card-wrapper article .card-wrapper .card-block p {
        font-size: 3vw;
        line-height: 1.3em
    }

    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card #is-result-card-wrapper article .card-wrapper .card-block table tbody tr th {
        width: 30%
    }

    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card #is-result-card-wrapper article .card-wrapper .card-block table tbody tr th,
    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card #is-result-card-wrapper article .card-wrapper .card-block table tbody tr td {
        font-size: 3vw;
        padding: 0.2em
    }

    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card #is-result-card-wrapper article .card-wrapper .card-info {
        display: block
    }

    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card .is-result-card-ui {
        font-size: 2vw
    }
}

@media screen and (max-width: 768px) and (max-width: 550px) {
    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card .is-result-card-ui {
        font-size: 3vw
    }
}

@media screen and (max-width: 768px) {
    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card .is-result-card-ui a dl dt span {
        font-size: 8vw
    }
}

@media screen and (max-width: 768px) and (max-width: 550px) {
    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card .is-result-card-ui a dl {
        margin-top: 5px
    }
}

@media screen and (max-width: 768px) {
    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card .is-result-card-ui .button {
        font-size: 2vw
    }
}

@media screen and (max-width: 768px) and (max-width: 550px) {
    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card .is-result-card-ui .button {
        font-size: 3vw
    }
}

@media screen and (max-width: 768px) {
    .internship-job-result .new-status-for-job {
        font-size: 3.5vw;
        border-radius: 4px;
        padding: 0px 4px 2px 4px;
        text-align: center;
        color: #fff;
        background-color: #e67e22;
        margin-right: 10px;
        font-weight: bold
    }
}

.internship-job-result .mg-left--7 {
    margin-left: -7px
}

.internship-job-result .mg-left-7 {
    margin-left: 7px
}

.internship-job-result .mg-left-5 {
    margin-left: 5px
}

.internship-job-result .mg-top-7 {
    margin-top: 7px
}

.internship-job-result .mg-left-11 {
    margin-left: 11px
}

.internship-job-result .mg-left--15 {
    margin-left: -15px
}

.internship-job-result .liked-is-job-color {
    color: red;
    font-variation-settings: 'FILL' 1
}

.internship-job-result #card-add-favorite:focus {
    outline: initial
}

.internship-job-result .font-total-liked {
    font-style: normal;
    vertical-align: top
}

.internship-job-result .no-justify {
    text-align: inherit
}

.internship-job-result .company-urls-card {
    padding: 0px 20px
}

@media only screen and (min-width: 767px) {
    .internship-job-result .company-urls-modal {
        padding: 0px 20px
    }
}

.internship-job-result .company-urls {
    font-size: 1.2rem;
    color: #000;
    margin-bottom: 10px;
    border-radius: 0
}

.internship-job-result .company-urls a {
    color: #000
}

.internship-job-result .company-urls a:hover {
    color: #3a50c9
}

.internship-job-result .company-urls a:focus,
.internship-job-result .company-urls a:active {
    outline: none
}

.internship-job-result .company-urls span::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    position: relative;
    top: 4px;
    content: "navigate_next";
    display: inline-block;
    font-size: 1.6rem;
    margin-right: 4px
}

.internship-job-search #is {
    padding: 20px 0;
    max-width: 760px;
    margin: auto
}

@media only screen and (max-width: 480px) {
    .internship-job-search #is .dropdown-menu.dropdown-menu-left.datetime-picker-dropdown {
        left: 0px !important;
        right: 0px !important
    }
}

.internship-job-search #is #is-top .is-search {
    background: #f5f5f5;
    padding: 1vw 3vw 2vw 3vw;
    margin-bottom: 1vw
}

.internship-job-search #is #is-top .is-search .is-search-pulldown {
    display: -webkit-flex;
    -webkit-justify-content: space-between;
    -webkit-align-items: stretch;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.internship-job-search #is #is-top .is-search .is-search-pulldown dl {
    width: 48%;
    margin: 0;
    margin-bottom: 10px
}

.internship-job-search #is #is-top .is-search .is-search-pulldown dl dt {
    background: #3D4294;
    color: #fff;
    font-size: 14px;
    text-align: center;
    padding: 0.4em 0;
    margin-bottom: 5px
}

.internship-job-search #is #is-top .is-search .is-search-pulldown dl dd input,
.internship-job-search #is #is-top .is-search .is-search-pulldown dl dd select {
    width: 100%;
    font-size: 12px;
    padding: 0.2em
}

.internship-job-search #is #is-top .is-search .is-search-pulldown #search-area,
.internship-job-search #is #is-top .is-search .is-search-pulldown #search-type {
    margin-bottom: 20px
}

.internship-job-search #is #is-top .is-search .is-search-pulldown dl.wide {
    width: 100%
}

.internship-job-search #is #is-top .is-search .is-search-pulldown #search-month dd {
    display: -webkit-flex;
    -webkit-justify-content: space-between;
    -webkit-align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.internship-job-search #is #is-top .is-search .is-search-pulldown #search-month dd input {
    width: calc(50% - 0.8em)
}

.internship-job-search #is #is-top .is-search .is-search-tag {
    margin-bottom: 1vw
}

.internship-job-search #is #is-top .is-search .is-search-tag ul {
    list-style: none;
    display: -webkit-flex;
    -webkit-justify-content: flex-start;
    -webkit-align-items: stretch;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.internship-job-search #is #is-top .is-search .is-search-tag ul li {
    margin-bottom: 5px;
    margin-right: 5px
}

.internship-job-search #is #is-top .is-search .is-search-tag ul li label {
    font-size: 12px;
    overflow: hidden;
    margin-bottom: 0;
    border: solid 1px #ccc;
    border-radius: 0.3em;
    padding: 0.3em 0.7em 0.3em 0.833333em;
    background: url(/assets/icon-search-911ee9f406f2f642c29edc2aa4bfbe9ce68bc1d7ad8c85f8b3aaaf0173e2d233.svg) left 0.6em center/1em no-repeat #fff;
    cursor: pointer;
    vertical-align: top;
    display: flex
}

.internship-job-search #is #is-top .is-search .is-search-tag ul li label input {
    display: inline-block;
    -webkit-transform: translateX(-999px);
    -ms-transform: translateX(-999px);
    transform: translateX(-999px)
}

.internship-job-search #is #is-top .is-search .is-search-tag ul li label.on {
    background: url(/assets/icon-search-white-ece2a8b3d3d3508748ef41545f52b042fa422635bc961e266e0584fd712e4f2d.svg) left 0.6em center/1em no-repeat #3974f3;
    color: #fff
}

.internship-job-search #is #is-top .is-search h3 {
    background: #3D4294;
    color: #fff;
    text-align: center;
    font-size: 14px;
    padding: 0.5em 0em
}

.internship-job-search #is #is-top .is-search .is-search-submit {
    text-align: center
}

.internship-job-search #is #is-top .is-search .is-search-submit button {
    display: inline-block;
    font-size: 15px;
    line-height: 1em;
    padding: 0.5em 1em;
    border-radius: 3em;
    background: #fff;
    margin: 0 5px;
    font-weight: bold
}

.internship-job-search #is #is-top .is-search .is-search-submit button[type="button"] {
    background: #3974f3;
    color: #fff
}

.internship-job-search #is #is-top .is-search .is-search-keyword input {
    font-size: 12px;
    padding: 5px;
    margin-bottom: 1em;
    width: 100%;
    background: url(/assets/icon-search-911ee9f406f2f642c29edc2aa4bfbe9ce68bc1d7ad8c85f8b3aaaf0173e2d233.svg) right 0.5em center/1em no-repeat #fff;
    border: solid 1px #ccc
}

.internship-job-search #is #is-top .is-search .is-search-keyword ::placeholder {
    color: grey;
    opacity: 0.5
}

.internship-job-search #is #is-top #is-search-all {
    margin: 2vw 5vw
}

.internship-job-search #is #is-top #is-search-all a {
    background: #3974f3;
    color: #fff;
    font-size: 12px;
    text-align: center;
    padding: 0.5em;
    border-radius: 0.5em;
    display: -webkit-flex;
    -webkit-justify-content: center;
    -webkit-align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.internship-job-search #is #is-top #is-search-all a:hover {
    cursor: pointer !important
}

.internship-job-search #is #is-top #is-search-all a i {
    font-size: 30px;
    margin-right: 7px
}

.internship-job-search #is #is-top .is-narration {
    background: #f5f5f5;
    padding: 1vw 2vw;
    font-size: 1.2rem;
    font-weight: normal
}

.internship-job-search #is #is-top .is-narration h2 {
    font-size: 1.6rem;
    margin-top: 20px;
    margin-bottom: 10px;
    font-weight: 700
}

.internship-job-search #is #is-top .is-narration .is-narration-top {
    background: white;
    padding: 0.3vw 2.5vw;
    border-radius: 1em
}

.internship-job-search .cfn_front {
    -webkit-font-feature-settings: "palt";
    font-feature-settings: "palt";
    color: #3B4043;
    font-family: "Noto Serif JP", serif
}

.internship-job-search .cfn_front *,
.internship-job-search .cfn_front *:before,
.internship-job-search .cfn_front *:after {
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box
}

.internship-job-search .cfn_front .cfnt--sns {
    width: 290px;
    margin: 10rem auto
}

.internship-job-search .cfn_front .cfnt--sns .icn_cfn {
    margin: 0 auto 15px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 15px
}

.internship-job-search .cfn_front .cfnt--sns .icn_cfn img {
    width: 51px;
    margin-right: 15px
}

.internship-job-search .cfn_front .cfnt--sns .app-links-banners {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin: 0 auto 30px
}

.internship-job-search .cfn_front .cfnt--sns .app-links-banners a {
    width: 140px;
    margin: 0 auto
}

.internship-job-search .cfn_front .cfnt--sns ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.internship-job-search .cfn_front .cfnt--sns ul li a img {
    height: 50px
}

.internship-job-search .cfn_front img {
    height: auto;
    max-width: 100%;
    -o-object-fit: contain;
    object-fit: contain;
    vertical-align: bottom
}

.internship-job-search .cfn_front a {
    text-decoration: none;
    color: #3B4043
}

.internship-job-search .cfn_front li {
    list-style: none
}

.internship-job-search .cfn_front p,
.internship-job-search .cfn_front dd,
.internship-job-search .cfn_front td,
.internship-job-search .cfn_front li {
    font-size: 12px;
    line-height: 1.8;
    margin-bottom: 0
}

.internship-job-search #industries-modal .industry-category-name {
    text-align: center;
    padding-top: 20px;
    padding-bottom: 20px;
    margin-bottom: 20px;
    background-color: #f5f5f5;
    font-weight: bold
}

.internship-job-search #industries-modal.fade .modal-header {
    background-color: #3D4294
}

@media (min-width: 768px) {
    .internship-job-search #industries-modal .modal-content {
        margin-left: 30%;
        margin-right: 30%
    }
}

.internship-job-search .list-select-industry {
    margin-left: 20px
}

.internship-job-search .search-internship-job-month {
    position: relative
}

.internship-job-search .search-internship-job-month .material-icons {
    position: absolute;
    right: 0px
}

@media only screen and (min-width: 1600px) {
    .internship-job-search #is #is-top #is-search-all {
        margin: 1vw 2vw
    }
}

@media screen and (max-width: 768px) {
    .internship-job-search #is #is-top .is-search {
        padding: 3vw
    }

    .internship-job-search #is #is-top .is-search .is-search-tag {
        margin-bottom: 1vw
    }

    .internship-job-search #is #is-top .is-search .is-search-tag ul {
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }

    .internship-job-search #is #is-top .is-search .is-search-tag ul li {
        width: 32%;
        margin: 0;
        margin-bottom: 1vw
    }

    .internship-job-search #is #is-top .is-search .is-search-tag ul li label {
        width: 100%;
        padding-left: 1.4em;
        padding-right: 0;
        padding-top: 1em;
        padding-bottom: 1em;
        background-size: 0.8em;
        background-position: left 0.3em center;
        line-height: 1em;
        vertical-align: middle
    }

    .internship-job-search #is #is-top .is-search .is-search-tag ul li label input {
        display: none
    }

    .internship-job-search #is #is-top .is-search .is-search-tag ul li label.on {
        background-size: 0.8em;
        background-position: left 0.3em center
    }

    .internship-job-search #is #is-top .is-search .is-search-submit button {
        font-size: 14px
    }

    .internship-job-search #is #is-top .is-search .is-search-pulldown {
        flex-wrap: wrap
    }

    .internship-job-search #is #is-top .is-search .is-search-pulldown dl {
        width: 48%
    }
}

@media screen and (max-width: 485px) {
    .internship-job-search #is #is-top .is-search .is-search-tag ul li label {
        font-size: 10px
    }

    .internship-job-search #is #is-top .is-search .is-search-submit button {
        font-size: 12px
    }

    .internship-job-search #is #is-top .is-search .is-search-pulldown dl dt {
        font-size: 12px
    }

    .internship-job-search #is #is-top .is-search h3 {
        font-size: 14px
    }

    .internship-job-search #is #is-top .is-search .is-search-keyword input {
        font-size: 10px
    }

    .internship-job-search #is #is-top span {
        font-size: 10px
    }

    .internship-job-search #is #is-top #is-search-all h3 {
        font-size: 14px
    }

    .internship-job-search #is #is-top #is-search-all a {
        font-size: 10px
    }

    .internship-job-search #is #is-top #is-search-all a i {
        font-size: 22px
    }
}

@font-face {
    font-family: 'Material Symbols Outlined';
    font-style: normal;
    font-weight: 400;
    src: url(https://fonts.gstatic.com/s/materialsymbolsoutlined/v39/kJEhBvYX7BgnkSrUwT8OhrdQw4oELdPIeeII9v6oFsI.woff2) format("woff2")
}

.internship-job-result {
    word-wrap: break-word
}

.internship-job-result .mt-30 {
    margin-top: 30px !important
}

.internship-job-result .mt-16 {
    margin-top: 16px !important
}

.internship-job-result .mt-10 {
    margin-top: 10px !important
}

.internship-job-result .not-visibility {
    visibility: hidden
}

.internship-job-result .text-orange {
    color: #e67e22
}

.internship-job-result .text-blue {
    color: #89ABE3
}

.internship-job-result .button-disabled {
    border: 1px solid #babcbe;
    background-color: #e2e4e4 !important;
    color: #babcbe;
    cursor: default;
    pointer-events: none
}

.internship-job-result .material-symbols-outlined {
    font-family: 'Material Symbols Outlined';
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased
}

.internship-job-result #is {
    padding: 20px 0;
    max-width: 760px;
    margin: auto
}

.internship-job-result #is #is-result .is-functions {
    margin-bottom: 30px;
    display: -webkit-flex;
    -webkit-justify-content: space-between;
    -webkit-align-items: stretch;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch
}

.internship-job-result #is #is-result .is-functions span {
    font-size: 24px;
    color: #000;
    line-height: 1em
}

.internship-job-result #is #is-result .is-functions ins {
    text-decoration: none;
    font-size: 16px;
    font-weight: bold;
    line-height: 1em
}

.internship-job-result #is #is-result .is-functions .is-functions-pagetype {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.internship-job-result #is #is-result .is-functions .is-functions-pagetype a {
    display: inline-block;
    margin-right: 14px;
    line-height: 1em;
    border: solid 2px #3D4294;
    padding: 0.5em;
    font-size: 14px;
    border-radius: 4em;
    -webkit-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
    position: relative
}

.internship-job-result #is #is-result .is-functions .is-functions-pagetype a:hover {
    opacity: 0.7
}

.internship-job-result #is #is-result .is-functions .is-functions-pagetype a.on {
    background: #3D4294
}

.internship-job-result #is #is-result .is-functions .is-functions-pagetype a.on span {
    color: #fff
}

.internship-job-result #is #is-result .is-functions .is-functions-pagetype a ins {
    position: absolute;
    bottom: -1.5em;
    left: 0;
    width: 100%;
    text-align: center;
    font-size: 6px;
    white-space: nowrap;
    display: -webkit-flex;
    -webkit-justify-content: center;
    -webkit-align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 12px
}

.internship-job-result #is #is-result .is-functions .is-functions-sort {
    margin-left: 20px
}

.internship-job-result #is #is-result .is-result .is-result-wrapper .article-result-2:hover {
    cursor: pointer;
    background-color: #dddddd
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article {
    border: solid 1px #ccc;
    background: #fff;
    -webkit-box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.2);
    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.2);
    padding: 10px;
    position: relative
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article .tag ul li {
    display: inline-block;
    border: solid 2px #3D4294;
    font-size: 14px;
    line-height: 1em;
    margin-bottom: 0.5em;
    margin-right: 0.2em;
    padding: 0.4em 1em;
    border-radius: 2em;
    white-space: nowrap
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article h3 {
    border-radius: 4px;
    position: relative;
    background: #3974f3;
    color: #fff;
    font-size: 16px;
    padding: 0.6em 0.6em;
    line-height: 1.8em;
    margin: 0.4em 0
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article h3 .status-icon {
    min-width: 80px;
    font-size: 14px;
    border-radius: 4px;
    padding: 5px;
    position: absolute;
    display: -webkit-flex;
    text-align: center;
    -webkit-justify-content: center;
    -webkit-align-items: center;
    color: #fff;
    background-color: #e67e22;
    right: -4px;
    top: -16px;
    height: 30px
}

@media only screen and (max-width: 767px) {
    .internship-job-result #is #is-result .is-result .is-result-wrapper article h3 .status-icon {
        font-size: 16px;
        min-width: 70px;
        padding: 4px
    }
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article p {
    font-size: 14px;
    margin-bottom: 0.5em
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article .card-block {
    margin-bottom: 20px
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article .card-block h4 {
    border-left: solid 3px #3974f3;
    line-height: 1em;
    padding: 0.4em 0.6em;
    font-size: 16px
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article .card-block p {
    font-size: 14px;
    margin-bottom: 0
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article .card-bottom {
    bottom: 0;
    right: 5px;
    z-index: 2;
    margin-top: 10px
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article .card-bottom .card-favorite span {
    font-size: 1.2em;
    vertical-align: middle
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article .card-company dl {
    margin-top: 0;
    display: -webkit-flex;
    -webkit-justify-content: flex-start;
    -webkit-align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: flex
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article .card-company dl .row {
    margin-left: 10px
}

@media only screen and (max-width: 480px) {
    .internship-job-result #is #is-result .is-result .is-result-wrapper article .card-company dl .row {
        width: calc(60vw - 120px)
    }
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article .card-company dl .row li {
    display: inline-block;
    border: solid 2px #3D4294;
    font-size: 12px;
    line-height: 1em;
    margin-bottom: 0.5em;
    margin-right: 0.2em;
    padding: 0.4em 1em;
    border-radius: 2em;
    white-space: nowrap
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article .card-company dl dt {
    border-radius: 4px;
    margin-right: 5px;
    flex: 0 0 70px;
    text-align: center
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article .card-company dl dt img.card-screen {
    aspect-ratio: 1/1;
    height: 70px;
    object-fit: contain;
    border-radius: 4px
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article .card-company dl dt img.list-screen {
    aspect-ratio: 2/1;
    height: 70px;
    object-fit: contain;
    border-radius: 4px
}

@media only screen and (max-width: 767px) {
    .internship-job-result #is #is-result .is-result .is-result-wrapper article .card-company dl dt img {
        max-width: 25vw;
        height: auto
    }

    .internship-job-result #is #is-result .is-result .is-result-wrapper article .card-company dl dt img.list-screen {
        aspect-ratio: auto
    }
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article .card-company dl dd {
    top: 50%;
    font-size: 18px;
    word-break: break-word;
    flex: 1
}

@media only screen and (max-width: 480px) {
    .internship-job-result #is #is-result .is-result .is-result-wrapper article .card-company dl dd {
        font-size: 16px
    }
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article .card-info dl {
    display: -webkit-flex;
    -webkit-justify-content: space-between;
    -webkit-align-items: stretch;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    margin: 0
}

.internship-job-result #is #is-result .is-result .is-result-wrapper article .card-info dl dd {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.internship-job-result #is #is-result #is-result-list #is-result-list-wrapper article {
    margin-bottom: 20px
}

.internship-job-result #is #is-result #is-result-list #is-result-list-wrapper article .list-top .company-name {
    font-size: 18px;
    margin-right: 5px
}

.internship-job-result #is #is-result #is-result-list #is-result-list-wrapper article .list-top .banner {
    display: -webkit-flex;
    -webkit-justify-content: flex-end;
    -webkit-align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-end;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: flex-start;
    max-width: 50%;
    margin-right: 10px
}

@media only screen and (min-width: 780px) {
    .internship-job-result #is #is-result #is-result-list #is-result-list-wrapper article .list-top .banner {
        min-width: 40%
    }
}

.internship-job-result #is #is-result #is-result-list #is-result-list-wrapper article .list-top .banner span {
    min-width: 250px;
    display: inline-block;
    background: #3974f3;
    color: #fff;
    font-size: 14px;
    font-weight: bold;
    line-height: 1em;
    padding: 0.4em 0.7em;
    margin-left: 2px;
    border-radius: 4px;
    text-align: center;
    word-break: break-word
}

.internship-job-result #is #is-result #is-result-list #is-result-list-wrapper article .list-top .banner .ad {
    margin-left: 5px
}

.internship-job-result #is #is-result #is-result-list #is-result-list-wrapper article .list-top .banner .ad span {
    font-size: 16px;
    padding: 0.1em 1em;
    font-weight: bold;
    color: #3974f3;
    border: solid 2px #3974f3;
    border-radius: 0.3em
}

.internship-job-result #is #is-result #is-result-list #is-result-list-wrapper article .list-top .card-company dl {
    margin: 0
}

.internship-job-result #is #is-result #is-result-list #is-result-list-wrapper article .list-top .card-company dl .header-job {
    width: 100%
}

.internship-job-result #is #is-result #is-result-list #is-result-list-wrapper article .list-top .card-company dl .row {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 10px
}

.internship-job-result #is #is-result #is-result-list #is-result-list-wrapper article .date dl {
    display: -webkit-flex;
    -webkit-justify-content: flex-start;
    -webkit-align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.internship-job-result #is #is-result #is-result-list #is-result-list-wrapper article .date dl dt {
    border-radius: 4px;
    background: #3D4294;
    color: #fff;
    padding: 0.3em 1em;
    margin-right: 0.5em;
    width: 150px;
    text-align: center;
    font-size: 14px
}

.internship-job-result #is #is-result #is-result-list #is-result-list-wrapper article .date dl dt.label-tag-applied {
    position: absolute;
    bottom: 10px;
    right: 5px;
    background-color: #1e588f
}

.internship-job-result #is #is-result #is-result-list #is-result-list-wrapper article .date dl dd {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    font-size: 14px;
    font-weight: bold
}

.internship-job-result #is #is-result #is-result-list #is-result-list-wrapper article .date dl dd span {
    display: inline-block
}

.internship-job-result #is .entry-fixed {
    position: -webkit-sticky;
    position: sticky;
    bottom: 0;
    left: 0;
    z-index: 5000;
    background: #DCDCDC;
    width: 100%;
    height: 80px;
    display: -webkit-flex;
    -webkit-justify-content: center;
    -webkit-align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.internship-job-result #is .entry-fixed .apply a {
    background: #2b37bc
}

.internship-job-result #is .entry-fixed .apply .button {
    display: inline-flex
}

@media only screen and (max-width: 480px) {
    .internship-job-result #is .entry-fixed .apply span {
        font-size: 12px
    }
}

@media only screen and (max-width: 395px) {
    .internship-job-result #is .entry-fixed .apply span {
        font-size: 10px
    }
}

@media only screen and (max-width: 345px) {
    .internship-job-result #is .entry-fixed .apply span {
        font-size: 8px
    }
}

@media only screen and (max-width: 280px) {
    .internship-job-result #is .entry-fixed .apply span {
        font-size: 7px
    }
}

.internship-job-result #is .entry-fixed .is-result-card-ui-prev {
    width: 50%
}

.internship-job-result #is .entry-fixed a {
    font-size: 14px;
    width: 15em;
    height: 3em;
    display: -webkit-flex;
    -webkit-justify-content: center;
    -webkit-align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer
}

@media only screen and (max-width: 760px) {
    .internship-job-result #is .entry-fixed a:hover {
        color: #3A50C9
    }
}

@media only screen and (max-width: 480px) {
    .internship-job-result #is .entry-fixed a {
        font-size: 12px
    }
}

@media only screen and (max-width: 395px) {
    .internship-job-result #is .entry-fixed a {
        font-size: 10px
    }
}

@media only screen and (max-width: 345px) {
    .internship-job-result #is .entry-fixed a {
        font-size: 8px
    }
}

@media only screen and (max-width: 280px) {
    .internship-job-result #is .entry-fixed a {
        font-size: 7px
    }
}

.internship-job-result #is-result-card .is-result-card-ui {
    display: -webkit-flex;
    -webkit-justify-content: space-between;
    -webkit-align-items: stretch;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch
}

.internship-job-result #is-result-card .is-result-card-ui .button {
    width: 13em;
    height: 4em
}

.internship-job-result #is-result-card .is-result-card-ui .job-expired {
    margin-top: 1.7em
}

@media only screen and (max-width: 550px) {
    .internship-job-result #is-result-card .is-result-card-ui .job-expired {
        margin-top: 1em
    }

    .internship-job-result #is-result-card .is-result-card-ui .job-expired .job-expired-text {
        margin-top: 1.7em
    }
}

.internship-job-result #is-result-card .is-result-card-ui dl dt {
    text-align: center
}

.internship-job-result #is-result-card .is-result-card-ui dl dt span {
    font-size: 36px
}

@media only screen and (max-width: 767px) {
    .internship-job-result #is-result-card .is-result-card-ui dl dt span {
        font-size: 30px
    }
}

@media only screen and (max-width: 480px) {
    .internship-job-result #is-result-card .is-result-card-ui dl dt span {
        font-size: 25px
    }
}

@media only screen and (max-width: 350px) {
    .internship-job-result #is-result-card .is-result-card-ui dl dt span {
        font-size: 20px
    }
}

.internship-job-result #is-result-card .is-result-card-ui dl.check dt span {
    color: #f00
}

.internship-job-result #is-result-card .is-result-card-ui dl.check dd {
    color: #f00
}

.internship-job-result #is-result-card #is-result-card-wrapper article {
    -webkit-transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
    -o-transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
    opacity: 0;
    -webkit-transform: scale(0.9) rotate(-5deg);
    -ms-transform: scale(0.9) rotate(-5deg);
    transform: scale(0.9) rotate(-5deg)
}

.internship-job-result #is-result-card #is-result-card-wrapper article .event-name {
    min-width: 250px;
    display: inline-block;
    color: #fff;
    font-size: 14px;
    font-weight: bold;
    line-height: 1em;
    padding: 0.4em 0.7em;
    margin-left: 2px;
    border-radius: 4px;
    text-align: center;
    margin-bottom: 0.5em
}

.internship-job-result #is-result-card #is-result-card-wrapper article .tag {
    padding: 0 20px
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper {
    padding: 0 20px
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-block h4 {
    border-left: solid 3px #3974f3;
    line-height: 1em;
    padding: 0.4em 0.6em;
    font-size: 16px
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-block table {
    width: 100%
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-block table tr th {
    text-align: left;
    background: #f5f5f5;
    width: 30%;
    vertical-align: text-top
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-block table tr td {
    word-break: break-word
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-block table tr td span {
    display: inline-block
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-block table.additional-questions .number-col {
    width: 10px
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-block table.additional-questions tr th {
    text-align: center;
    width: auto
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-block table.additional-questions tr td:nth-child(1) {
    width: 5%
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-block table.additional-questions tr td:nth-child(2) {
    width: 25%
}

@media only screen and (max-width: 767px) {
    .internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-block table.additional-questions tr td:nth-child(2) {
        width: 35%
    }
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-block p {
    font-size: 14px;
    margin-bottom: 0
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-block b.introduce-question p {
    font-size: 13px
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-info {
    display: -webkit-flex;
    -webkit-justify-content: space-between;
    -webkit-align-items: stretch;
    display: -webkit-box;
    display: -ms-flexbox;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch
}

@media only screen and (min-width: 1100px) {
    .internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-info {
        display: inline-block
    }
}

@media only screen and (max-width: 1100px) {
    .internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-info {
        display: flex
    }
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-info.result dl {
    margin: 0;
    display: flex
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-info.result dl dt {
    padding-right: 0.5em
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-info.result dl dt span {
    font-size: inherit
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-info.result dl dd {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

@media only screen and (min-width: 1100px) {
    .internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .card-resume-language {
        float: right
    }
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper h3 {
    position: relative;
    line-height: 1.8em;
    background: #3974f3;
    color: #fff;
    border-radius: 4px;
    padding: 0.6em 0.6em
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper h3 .status-icon {
    min-width: 92px;
    font-size: 18px;
    border-radius: 4px;
    padding: 5px;
    position: absolute;
    display: inline-block;
    text-align: center;
    color: #fff;
    background-color: #e67e22;
    left: auto;
    top: -25px
}

@media only screen and (max-width: 767px) {
    .internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper h3 .status-icon {
        font-size: 16px;
        min-width: 70px;
        padding: 4px
    }
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper .center {
    text-align: center
}

.internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper img {
    max-height: 200px;
    display: inline
}

@media only screen and (max-width: 767px) {
    .internship-job-result #is-result-card #is-result-card-wrapper article .card-wrapper img {
        max-height: 180px;
        max-width: 100%
    }
}

.internship-job-result #is-result-card #is-result-card-wrapper article.slick-active {
    opacity: 1;
    -webkit-transform: scale(1) rotate(0);
    -ms-transform: scale(1) rotate(0);
    transform: scale(1) rotate(0)
}

.internship-job-result #is-result-modal {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    z-index: 1000;
    display: -webkit-flex;
    -webkit-justify-content: center;
    -webkit-align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: none
}

.internship-job-result #is-result-modal #is-result-modal-inner {
    width: 55%;
    background: #fff;
    padding: 10px
}

@media only screen and (min-width: 768px) {
    .internship-job-result #is-result-modal #is-result-modal-inner {
        overflow-y: auto;
        max-height: calc(100vh - 2%)
    }
}

.internship-job-result #is-result-modal #is-result-modal-inner #is-resutl-modal-close {
    margin-right: 15px
}

.internship-job-result #is-result-modal #is-result-modal-inner #card-add-favorite {
    margin-left: 15px
}

.internship-job-result #is-result-modal #is-result-modal-inner #is-result-card #is-result-card-wrapper article {
    height: 500px;
    overflow-y: auto;
    overflow-x: hidden;
    opacity: 1;
    -webkit-transform: scale(1) rotate(0);
    -ms-transform: scale(1) rotate(0);
    transform: scale(1) rotate(0)
}

.internship-job-result #is-result-modal #is-result-modal-inner #is-result-card #is-result-card-wrapper article .card-company dl {
    display: -webkit-flex;
    -webkit-justify-content: flex-start;
    -webkit-align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.internship-job-result #is-result-modal #is-result-modal-inner #is-result-card #is-result-card-wrapper article .card-company dl dt img.modal-screen {
    aspect-ratio: 1/1;
    object-fit: contain;
    max-width: 90px
}

.internship-job-result #is-result-modal #is-result-modal-inner #is-result-card #is-result-card-wrapper article .card-company dl dd {
    font-size: 18px;
    word-break: break-word;
    margin-left: 10px
}

@media only screen and (max-width: 480px) {
    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card #is-result-card-wrapper article .card-company dl dd {
        font-size: 16px
    }
}

.internship-job-result #is-result-modal #is-result-modal-inner .tag {
    padding: 0 20px
}

.internship-job-result #is-result-modal #is-result-modal-inner .tag ul li {
    display: inline-block;
    border: solid 2px #3D4294;
    font-size: 14px;
    line-height: 1em;
    margin-bottom: 0.5em;
    margin-right: 0.2em;
    padding: 0.4em 1em;
    border-radius: 2em;
    white-space: nowrap
}

.internship-job-result #is-result-modal #is-result-modal-inner .mg-bottom-0 {
    margin-bottom: 0
}

.internship-job-result #is-result-modal #is-result-modal-inner .width-80 {
    width: 80px !important
}

.internship-job-result #is-result-modal #is-result-modal-inner .padding-top-5 {
    padding-top: 5px
}

.internship-job-result #is-result-modal.active {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

@media only screen and (min-width: 800px) {
    .internship-job-result #is-result-modal .new-status-for-job {
        font-size: 14px;
        border-radius: 4px;
        padding: 0px 4px 2px 4px;
        text-align: center;
        color: #fff;
        background-color: #e67e22;
        width: 40%;
        float: right;
        margin-right: 10px;
        font-weight: bold
    }
}

@media screen and (max-width: 768px) {
    .internship-job-result #is #is-result .is-functions {
        margin-bottom: 5vw
    }

    .internship-job-result #is #is-result .is-functions span {
        font-size: 3vw
    }

    .internship-job-result #is #is-result .is-functions ins {
        font-size: 3vw
    }

    .internship-job-result #is #is-result .is-functions .is-functions-pagetype a ins {
        font-size: 10px
    }

    .internship-job-result #is #is-result #is-result-list #is-result-list-wrapper article .list-top .banner span {
        min-width: 120px;
        max-width: 120px;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden
    }

    .internship-job-result #is-result-modal #is-result-modal-inner {
        width: calc(100% - 5vw);
        overflow: auto;
        padding: 4vw
    }

    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card #is-result-card-wrapper article {
        padding: 10px;
        height: calc(80vh - 25vw)
    }
}

@media screen and (max-width: 768px) and (max-width: 550px) {
    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card #is-result-card-wrapper article {
        height: calc(80vh - 41vw)
    }
}

@media screen and (max-width: 768px) {
    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card #is-result-card-wrapper article .tag {
        padding: 0
    }

    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card #is-result-card-wrapper article .tag ul li {
        font-size: 2vw
    }

    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card #is-result-card-wrapper article .card-wrapper {
        padding: 0
    }

    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card #is-result-card-wrapper article .card-wrapper .card-block {
        margin-bottom: 2vw
    }

    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card #is-result-card-wrapper article .card-wrapper .card-block h4 {
        font-size: 3.5vw
    }

    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card #is-result-card-wrapper article .card-wrapper .card-block p {
        font-size: 3vw;
        line-height: 1.3em
    }

    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card #is-result-card-wrapper article .card-wrapper .card-block table tbody tr th {
        width: 30%
    }

    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card #is-result-card-wrapper article .card-wrapper .card-block table tbody tr th,
    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card #is-result-card-wrapper article .card-wrapper .card-block table tbody tr td {
        font-size: 3vw;
        padding: 0.2em
    }

    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card #is-result-card-wrapper article .card-wrapper .card-info {
        display: block
    }

    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card .is-result-card-ui {
        font-size: 2vw
    }
}

@media screen and (max-width: 768px) and (max-width: 550px) {
    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card .is-result-card-ui {
        font-size: 3vw
    }
}

@media screen and (max-width: 768px) {
    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card .is-result-card-ui a dl dt span {
        font-size: 8vw
    }
}

@media screen and (max-width: 768px) and (max-width: 550px) {
    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card .is-result-card-ui a dl {
        margin-top: 5px
    }
}

@media screen and (max-width: 768px) {
    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card .is-result-card-ui .button {
        font-size: 2vw
    }
}

@media screen and (max-width: 768px) and (max-width: 550px) {
    .internship-job-result #is-result-modal #is-result-modal-inner #is-result-card .is-result-card-ui .button {
        font-size: 3vw
    }
}

@media screen and (max-width: 768px) {
    .internship-job-result .new-status-for-job {
        font-size: 3.5vw;
        border-radius: 4px;
        padding: 0px 4px 2px 4px;
        text-align: center;
        color: #fff;
        background-color: #e67e22;
        margin-right: 10px;
        font-weight: bold
    }
}

.internship-job-result .mg-left--7 {
    margin-left: -7px
}

.internship-job-result .mg-left-7 {
    margin-left: 7px
}

.internship-job-result .mg-left-5 {
    margin-left: 5px
}

.internship-job-result .mg-top-7 {
    margin-top: 7px
}

.internship-job-result .mg-left-11 {
    margin-left: 11px
}

.internship-job-result .mg-left--15 {
    margin-left: -15px
}

.internship-job-result .liked-is-job-color {
    color: red;
    font-variation-settings: 'FILL' 1
}

.internship-job-result #card-add-favorite:focus {
    outline: initial
}

.internship-job-result .font-total-liked {
    font-style: normal;
    vertical-align: top
}

.internship-job-result .no-justify {
    text-align: inherit
}

.internship-job-result .company-urls-card {
    padding: 0px 20px
}

@media only screen and (min-width: 767px) {
    .internship-job-result .company-urls-modal {
        padding: 0px 20px
    }
}

.internship-job-result .company-urls {
    font-size: 1.2rem;
    color: #000;
    margin-bottom: 10px;
    border-radius: 0
}

.internship-job-result .company-urls a {
    color: #000
}

.internship-job-result .company-urls a:hover {
    color: #3a50c9
}

.internship-job-result .company-urls a:focus,
.internship-job-result .company-urls a:active {
    outline: none
}

.internship-job-result .company-urls span::before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem;
    display: inline-block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    position: relative;
    white-space: nowrap;
    position: relative;
    top: 4px;
    content: "navigate_next";
    display: inline-block;
    font-size: 1.6rem;
    margin-right: 4px
}

body {
    -ms-overflow-style: scrollbar !important
}

video::-internal-media-controls-download-button {
    display: none
}

video::-webkit-media-controls-enclosure {
    overflow: hidden
}

video::-webkit-media-controls-panel {
    width: calc(100% + 30px)
}

@-webkit-keyframes loaderrotate {
    100% {
        -webkit-transform: rotate(360deg)
    }
}

@keyframes loaderrotate {
    100% {
        transform: rotate(360deg);
        -webkit-transform: rotate(360deg)
    }
}

@-webkit-keyframes loaderbounce {

    0%,
    100% {
        -webkit-transform: scale(0)
    }

    50% {
        -webkit-transform: scale(1)
    }
}

@keyframes loaderbounce {

    0%,
    100% {
        transform: scale(0);
        -webkit-transform: scale(0)
    }

    50% {
        transform: scale(1);
        -webkit-transform: scale(1)
    }
}

.page-overlay {
    background: rgba(255, 255, 255, 0.7);
    display: inherit;
    width: 100%;
    height: 100vh;
    position: fixed;
    top: 0;
    z-index: 9999;
    bottom: 0
}

.page-overlay.is-black {
    background: rgba(0, 0, 0, 0.6)
}

.page-overlay-footer {
    float: left;
    height: 67px;
    width: 100%;
    text-align: center;
    position: relative
}

.page-overlay-footer.hide {
    display: none
}

#pageloaderfooter.animate {
    width: 40px;
    height: 40px;
    text-align: center;
    left: 0;
    position: absolute;
    right: 0;
    margin: auto;
    top: 20px;
    animation: loaderrotate 2.0s infinite linear
}

#pageloaderfooter.animate .dot1,
#pageloaderfooter.animate .dot2 {
    width: 60%;
    height: 60%;
    display: inline-block;
    position: absolute;
    top: 0;
    background-color: #89ABE3;
    border-radius: 100%;
    animation: loaderbounce 2.0s infinite ease-in-out
}

#pageloaderfooter.animate .dot2 {
    top: auto;
    bottom: 0px;
    animation-delay: -1.0s;
    background-color: #f22c39
}

.background-load {
    position: fixed;
    width: 25%;
    min-width: 220px;
    height: 3%;
    left: 0;
    text-align: center;
    right: 0;
    bottom: 0;
    margin: auto
}

.page-load {
    top: 0px;
    background-color: gray
}

.title-load {
    top: -160px;
    font-size: 23px;
    font-weight: bold
}

.percent-load {
    top: -120px
}

.background-progress {
    background-color: gray;
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden
}

#pageprogress-percent {
    font-size: 40px;
    font-weight: bold;
    color: #3A50C9
}

.percent {
    width: 0%;
    background-color: coral;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0
}

.green {
    color: #66bb6a
}

.light-green {
    background-color: #77bf81
}

#pageloader.hide {
    display: none
}

#pageloader.animate {
    width: 40px;
    height: 40px;
    position: fixed;
    text-align: center;
    top: 50%;
    left: 50%;
    margin: -30px 0 0 -30px;
    animation: loaderrotate 2.0s infinite linear
}

#pageloader.animate .dot1,
#pageloader.animate .dot2 {
    width: 60%;
    height: 60%;
    display: inline-block;
    position: absolute;
    top: 0;
    background-color: #89ABE3;
    border-radius: 100%;
    animation: loaderbounce 2.0s infinite ease-in-out
}

#pageloader.animate .dot2 {
    top: auto;
    bottom: 0px;
    animation-delay: -1.0s;
    background-color: #f22c39
}

.dhtmlx_message_area {
    position: fixed;
    right: 5px;
    width: 250px;
    z-index: 1000
}

.dhtmlx-info {
    min-width: 120px;
    font-family: Tahoma;
    z-index: 10000;
    overflow: hidden;
    margin: 5px 5px 10px;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease
}

.dhtmlx-info.hidden {
    height: 0;
    padding: 0;
    border-width: 0;
    margin: 0;
    overflow: hidden
}

.dhtmlx_modal_box {
    overflow: hidden;
    display: inline-block;
    min-width: 300px;
    text-align: center;
    position: fixed;
    box-shadow: 0 0 14px #888;
    z-index: 20000
}

.dhtmlx_popup_title {
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-width: 0;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAoCAMAAAAIaGBFAAAAhFBMVEVwcHBubm5sbGxqampoaGhmZmZlZWVjY2NhYWFfX19dXV1bW1taWlpYWFhWVlZUVFRSUlJRUVFPT09NTU1LS0tJSUlHR0dGRkZERERCQkJAQEA+Pj49PT09PT0+Pj5AQEBBQUFDQ0NERERGRkZHR0dJSUlKSkpMTExMTEw5OTk5OTk5OTkny8YEAAAAQklEQVQImQXBCRJCAAAAwKVSQqdyjSPXNP7/QLsIhA6OTiJnF7GrRCpzc/fw9PKW+/gqlCq1RqvTG/yMJrPF6m/bAVEhAxxnHG0oAAAAAElFTkSuQmCC);
    background: -webkit-linear-gradient(top, #707070 1%, #3d3d3d 70%, #4c4c4c 97%, #393939 97%);
    background: -moz-linear-gradient(top, #707070 1%, #3d3d3d 70%, #4c4c4c 97%, #393939 97%)
}

.dhtmlx-info,
.dhtmlx_button,
.dhtmlx_popup_button {
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: -moz-none;
    cursor: pointer
}

.dhtmlx_popup_text {
    overflow: hidden
}

.dhtmlx_popup_controls {
    border-radius: 6px;
    padding: 5px
}

.dhtmlx_button,
.dhtmlx_popup_button {
    height: 30px;
    line-height: 30px;
    display: inline-block;
    margin: 0 5px;
    border-radius: 6px;
    color: #FFF
}

.dhtmlx_popup_button {
    min-width: 120px
}

div.dhx_modal_cover {
    background-color: #000;
    cursor: default;
    filter: alpha(opacity=20);
    opacity: .2;
    position: fixed;
    z-index: 19999;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    border: none;
    zoom: 1
}

.dhtmlx-info img,
.dhtmlx_modal_box img {
    float: left;
    margin-right: 20px
}

.dhtmlx-alert-error .dhtmlx_popup_title,
.dhtmlx-confirm-error .dhtmlx_popup_title {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAsCAIAAAArRUU2AAAATklEQVR4nIWLuw2AMBBDjVuQiBT2oWbRDATrnB0KQOJoqPzRe3BrHI6dcBASYREKovtK6/6DsDOX+stN+3H1YX9ciRgnYq5EWYhS2dftBIuLT4JyIrPCAAAAAElFTkSuQmCC)
}

.dhtmlx-alert-error,
.dhtmlx-confirm-error {
    border: 1px solid red
}

.dhtmlx_button,
.dhtmlx_popup_button {
    box-shadow: 0 0 4px #888;
    border: 1px solid #838383
}

.dhtmlx_button input,
.dhtmlx_popup_button div {
    border: 1px solid #FFF;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAeCAMAAADaS4T1AAAAYFBMVEVwcHBtbW1ra2toaGhmZmZjY2NhYWFeXl5cXFxaWlpXV1dVVVVSUlJQUFBNTU1LS0tJSUlGRkZERERBQUE/Pz88PDw9PT0+Pj5AQEBCQkJDQ0NFRUVHR0dISEhKSkpMTEzqthaMAAAAMklEQVQImQXBhQ2AMAAAsOIMlwWH/8+kRSKVyRVKlVrQaHV6g9FktlhFm93hdLk9Xt8PIfgBvdUqyskAAAAASUVORK5CYII=);
    background: -webkit-linear-gradient(top, #707070 1%, #3d3d3d 70%, #4c4c4c 99%);
    background: -moz-linear-gradient(top, #707070 1%, #3d3d3d 70%, #4c4c4c 99%);
    border-radius: 6px;
    font-size: 15px;
    font-weight: 400;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    color: #fff;
    padding: 0;
    margin: 0;
    vertical-align: top;
    height: 28px;
    line-height: 28px
}

.dhtmlx_button input:active,
.dhtmlx_button input:focus,
.dhtmlx_popup_button div:active,
.dhtmlx_popup_button div:focus {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAeCAMAAADaS4T1AAAAXVBMVEVwcHBubm5tbW1sbGxra2tpaWloaGhnZ2dmZmZlZWVjY2NiYmJhYWFgYGBfX19dXV1cXFxbW1taWlpZWVlXV1dWVlZVVVVUVFRTU1NRUVFQUFBPT09OTk5NTU1LS0tT9SY0AAAAMUlEQVQImQXBhQGAMAAAIGxnx2z9/00BiVQmVyhVakGj1ekNRpPZYhVtdofT5fZ4fT8hpwG05JjexgAAAABJRU5ErkJggg==);
    background: -webkit-linear-gradient(top, #707070 1%, #4c4c4c 99%);
    background: -moz-linear-gradient(top, #707070 1%, #4c4c4c 99%)
}

.dhtmlx_popup_title {
    color: #fff;
    text-shadow: 1px 1px #000;
    height: 40px;
    line-height: 40px;
    font-size: 20px
}

.dhtmlx_popup_text {
    margin: 15px 15px 5px;
    color: #000;
    min-height: 30px;
    border-radius: 6px
}

.dhtmlx-error,
.dhtmlx-info {
    font-size: 14px;
    color: #000;
    box-shadow: 0 0 10px #888;
    padding: 0;
    background-color: #FFF;
    border-radius: 3px;
    border: 1px solid #fff
}

.dhtmlx-info div {
    padding: 5px 10px;
    background-color: #fff;
    border-radius: 3px;
    border: 1px solid #B8B8B8
}

.dhtmlx-error {
    background-color: #d81b1b;
    border: 1px solid #ff3c3c;
    box-shadow: 0 0 10px #000
}

.dhtmlx-error div {
    background-color: #d81b1b;
    border: 1px solid #940000;
    color: #FFF
}

.dhx_cal_event .dhx_body,
.dhx_cal_event .dhx_footer,
.dhx_cal_event .dhx_header,
.dhx_cal_event .dhx_title {
    background-color: #FFE763;
    border: 1px solid #B7A543;
    color: #887A2E;
    overflow: hidden;
    width: 100%;
    font-family: Tahoma;
    font-size: 8pt
}

.dhx_move_denied .dhx_cal_event .dhx_header,
.dhx_move_denied .dhx_cal_event .dhx_title {
    cursor: default
}

.dhx_cal_event .dhx_header {
    height: 1px;
    margin-left: 1px;
    border-width: 1px 1px 0;
    cursor: pointer
}

.dhx_cal_event .dhx_title {
    border-bottom-style: dotted;
    text-align: center;
    background-position: right;
    background-repeat: no-repeat;
    cursor: pointer
}

.dhx_cal_event .dhx_body,
.dhx_cal_event.dhx_cal_select_menu .dhx_body {
    border-width: 0 1px 1px;
    padding: 5px
}

.dhx_resize_denied,
.dhx_resize_denied .dhx_event_resize {
    cursor: default !important
}

.dhx_cal_event .dhx_event_resize {
    cursor: s-resize
}

.dhx_cal_event .dhx_footer,
.dhx_cal_event .dhx_select_menu_footer {
    height: 1px;
    margin-left: 2px;
    border-width: 0 1px 1px;
    position: relative
}

.dhx_cal_event_line {
    padding-left: 10px;
    cursor: pointer;
    overflow: hidden
}

.dhx_cal_event_clear {
    font-family: Tahoma;
    font-size: 8pt;
    height: 13px;
    padding-left: 2px;
    white-space: nowrap;
    overflow: hidden;
    cursor: pointer
}

.dhx_in_move {
    background-color: #FFFF80
}

.dhx_cal_event.dhx_cal_editor {
    z-index: 999;
    position: absolute;
    overflow: hidden
}

textarea.dhx_cal_editor {
    width: 100%;
    height: 100%;
    border: 0 solid #000;
    margin: 0;
    padding: 0;
    overflow: auto
}

div.dhx_menu_head {
    background-position: 0 -43px;
    width: 10px;
    height: 10px;
    margin-left: 5px;
    margin-top: 1px;
    border: none;
    cursor: default
}

div.dhx_menu_icon {
    width: 20px;
    height: 20px;
    margin-left: -5px;
    margin-top: 0;
    border: none;
    cursor: pointer
}

div.icon_details {
    background-position: 0 0
}

div.icon_edit {
    background-position: -22px 0
}

div.icon_save {
    background-position: -84px -1px
}

div.icon_cancel {
    background-position: -62px 0
}

div.icon_delete {
    background-position: -42px 0
}

.dhx_month_link {
    position: absolute;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    text-align: right;
    cursor: pointer;
    padding-right: 10px
}

.dhx_month_link a {
    color: #00f
}

.dhx_month_link a:hover {
    text-decoration: underline
}

.dhx_global_tip {
    font-family: Tahoma, Helvetica;
    text-align: center;
    font-size: 20px;
    position: fixed;
    top: 60px;
    right: 20px;
    background-color: rgba(255, 255, 255, 0.7);
    color: #000;
    z-index: 10000;
    padding: 20px 30px;
    width: 190px
}

.dhx_global_tip div {
    font-size: 30px
}

@media (-moz-touch-enabled) {
    .dhx_cal_container {
        user-select: none;
        -moz-user-select: none
    }
}

.dhx_unselectable,
.dhx_unselectable div {
    -webkit-user-select: none;
    -moz-user-select: none;
    -moz-user-select: -moz-none
}

.dhx_cal_light {
    -webkit-tap-highlight-color: transparent;
    font-size: 8pt;
    position: absolute;
    z-index: 10001;
    width: 580px;
    height: 300px;
    box-shadow: 5px 5px 5px #888
}

.dhx_mark {
    position: relative;
    top: 3px;
    background-image: url(/images/imgs/controls.gif);
    background-position: 0 -43px;
    padding-left: 10px
}

.dhx_ie6 .dhx_mark {
    background-position: 6px -41px
}

.dhx_cal_light select {
    font-family: Tahoma;
    font-size: 8pt;
    padding: 2px;
    margin: 0
}

.dhx_cal_ltitle {
    padding: 2px 0 2px 5px;
    overflow: hidden;
    white-space: nowrap
}

.dhx_cal_ltitle span {
    white-space: nowrap
}

.dhx_cal_lsection {
    font-weight: 700;
    padding: 5px 0 3px 10px
}

.dhx_section_time {
    white-space: nowrap
}

.dhx_cal_lsection .dhx_fullday {
    float: right;
    margin-right: 5px;
    font-size: 12px;
    font-weight: 400;
    line-height: 20px;
    vertical-align: top;
    cursor: pointer
}

.dhx_cal_lsection {
    font-size: 18px
}

.dhx_cal_ltext {
    padding: 2px 0 2px 10px;
    overflow: hidden
}

.dhx_cal_ltext textarea {
    overflow: auto;
    height: 100%;
    width: 100%;
    outline: 0 !important;
    resize: none
}

.dhx_time {
    font-weight: 700
}

.dhx_cal_larea {
    overflow: hidden;
    width: 572px;
    height: 1px
}

.dhx_btn_set {
    float: left
}

.dhx_btn_set div {
    float: left;
    vertical-align: middle;
    cursor: pointer
}

.dhx_save_btn {
    background-image: url(/images/imgs/controls.gif);
    background-position: -84px 0;
    width: 21px
}

.dhx_cancel_btn {
    background-image: url(/images/imgs/controls.gif);
    background-position: -63px 0;
    width: 20px
}

.dhx_delete_btn {
    background-image: url(/images/imgs/controls.gif);
    background-position: -42px 0;
    width: 20px
}

.dhx_cal_cover {
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 10000;
    top: 0;
    left: 0;
    background-color: #000;
    opacity: .1;
    filter: alpha(opacity=10)
}

.dhx_custom_button {
    padding: 0 3px;
    font-family: Tahoma;
    font-size: 8pt;
    font-weight: 400;
    margin-right: 5px;
    margin-top: 0;
    cursor: pointer
}

.dhx_custom_button div {
    cursor: pointer;
    float: left;
    height: 21px;
    line-height: 21px;
    vertical-align: middle
}

.dhx_cal_light_wide .dhx_cal_larea {
    border-top-width: 0
}

.dhx_cal_light_wide .dhx_cal_lsection {
    border: 0;
    float: left;
    text-align: right;
    width: 100px;
    height: 20px;
    padding: 5px 0 0 10px
}

.dhx_cal_light_wide .dhx_wrap_section {
    position: relative;
    overflow: hidden
}

.dhx_cal_light_wide .dhx_section_time {
    padding-top: 2px !important;
    height: 20px !important
}

.dhx_section_time {
    text-align: center
}

.dhx_cal_light_wide .dhx_cal_larea {
    width: 730px
}

.dhx_cal_light_wide {
    width: 738px
}

.dhx_cal_light_wide .dhx_section_time {
    background: 0 0
}

.dhx_cal_light_wide .dhx_cal_checkbox label {
    padding-left: 0
}

.dhx_cal_wide_checkbox input {
    margin-top: 8px;
    margin-left: 14px
}

.dhx_cal_light input {
    font-size: 8pt
}

.dhx_cal_light_wide .dhx_cal_lsection .dhx_fullday {
    float: none;
    margin-right: 0;
    cursor: pointer
}

.dhx_custom_button {
    float: right;
    height: 21px
}

.dhx_cal_light_wide .dhx_custom_button {
    position: absolute;
    top: 0;
    right: 0
}

.dhx_cal_light_wide .dhx_repeat_right {
    margin-right: 55px
}

.dhx_minical_popup {
    position: absolute;
    z-index: 10100;
    width: 251px;
    height: 175px
}

.dhx_scale_bar_header {
    position: absolute;
    border-bottom: 1px dotted #8894A3;
    width: 100%
}

.dhx_expand_icon {
    position: absolute;
    right: 0;
    background-image: url(/images/imgs/collapse_expand_icon.gif);
    width: 18px;
    height: 18px;
    cursor: pointer;
    background-position: 0 18px;
    z-index: 16
}

.dhx_agenda_area {
    width: 100%;
    overflow-y: auto
}

.dhx_agenda_line {
    clear: both;
    overflow: hidden
}

.dhx_agenda_line div {
    float: left;
    width: 188px;
    text-align: center;
    overflow: hidden
}

.dhx_agenda_area .dhx_agenda_line div {
    border-right: 0 dotted #8894A3
}

.dhx_v_border {
    position: absolute;
    left: 187px;
    top: 0;
    width: 1px;
    height: 100%
}

.dhx_agenda_line .dhx_event_icon {
    width: 20px;
    border-width: 0;
    background: url(/images/imgs/icon.png) 5px 4px no-repeat;
    cursor: pointer
}

.dhx_agenda_line span {
    padding-left: 5px
}

.dhx_year_week {
    position: relative
}

.dhx_year_month {
    height: 18px;
    padding-top: 3px;
    text-align: center;
    vertical-align: middle
}

.dhx_year_body .dhx_after .dhx_month_head,
.dhx_year_body .dhx_after .dhx_month_head a,
.dhx_year_body .dhx_before .dhx_month_head,
.dhx_year_body .dhx_before .dhx_month_head a {
    color: #E2E3E6 !important
}

.dhx_year_body .dhx_month_body {
    height: 0;
    overflow: hidden
}

.dhx_month_head.dhx_year_event {
    background-color: #FFE763
}

.dhx_year_body .dhx_after .dhx_month_head,
.dhx_year_body .dhx_before .dhx_month_head {
    cursor: default
}

.dhx_year_tooltip {
    border: 1px solid #BBB;
    background-image: url(/assets/dhtmlxscheduler/imgs/databg-29947c0e410a8a5618020150deb1e2e877c89c62c9a1263e2bfb2962d0d642c0.png);
    position: absolute;
    z-index: 9998;
    width: 300px;
    height: auto;
    font-family: Tahoma;
    font-size: 8pt;
    overflow: hidden
}

.dhx_tooltip_line {
    line-height: 20px;
    height: 20px;
    overflow: hidden
}

.dhx_tooltip_line .dhx_event_icon {
    width: 20px;
    height: 20px;
    padding-right: 10px;
    float: left;
    border-width: 0;
    position: relative;
    background: url(/assets/dhtmlxscheduler/imgs/icon-86fee4b0e4e30068d75a58dc63a126d3d27fffd215a494b9ffd2233e81a25548.png) 5px 4px no-repeat;
    cursor: pointer
}

.dhx_tooltip_date {
    float: left;
    width: auto;
    padding-left: 5px;
    text-align: center
}

.dhx_text_disabled {
    font-family: Tahoma;
    font-size: 8pt
}

.dhx_mini_calendar {
    -moz-box-shadow: 5px 5px 5px #888;
    -khtml-box-shadow: 5px 5px 5px #888;
    -moz-user-select: -moz-none;
    -webkit-user-select: none;
    -user-select: none
}

.dhx_mini_calendar .dhx_month_head {
    cursor: pointer
}

.dhx_mini_calendar .dhx_calendar_click {
    background-color: #C2D5FC
}

.dhx_cal_navline div.dhx_minical_icon {
    cursor: pointer;
    background-image: url(/assets/dhtmlxscheduler/imgs/calendar-70d9aa7f66e7ef8f7646e494936a539f7bde4e1eef042c7f9a63daf722f88bff.gif)
}

.dhx_matrix_scell {
    height: 100%
}

.dhx_matrix_cell,
.dhx_matrix_scell {
    overflow: hidden;
    text-align: center;
    vertical-align: middle
}

.dhx_matrix_cell {
    background-color: #fff
}

.dhx_matrix_line {
    overflow: hidden
}

.dhx_matrix_cell div,
.dhx_matrix_scell div {
    overflow: hidden;
    text-align: center;
    height: auto
}

.dhx_cal_lsection .dhx_readonly {
    font-size: 9pt;
    font-size: 8pt;
    padding: 2px;
    color: #887A2E
}

.dhx_cal_event_line .dhx_event_resize {
    cursor: w-resize;
    position: absolute;
    top: 0;
    width: 4px;
    height: 100%
}

.dhx_event_resize_start {
    left: 0
}

.dhx_event_resize_end {
    right: 0
}

.dhx_data_table.folder .dhx_matrix_cell,
.dhx_matrix_scell.folder {
    background-color: #969394;
    cursor: pointer
}

.dhx_matrix_scell .dhx_scell_level0 {
    padding-left: 5px
}

.dhx_matrix_scell .dhx_scell_level1 {
    padding-left: 20px
}

.dhx_matrix_scell .dhx_scell_level2 {
    padding-left: 35px
}

.dhx_matrix_scell .dhx_scell_level3 {
    padding-left: 50px
}

.dhx_matrix_scell .dhx_scell_level4 {
    padding-left: 65px
}

.dhx_matrix_scell.folder {
    font-weight: 700;
    text-align: left
}

.dhx_matrix_scell.folder .dhx_scell_expand {
    float: left;
    width: 10px;
    padding-right: 3px
}

.dhx_matrix_scell.folder .dhx_scell_name {
    float: left;
    width: auto
}

.dhx_matrix_scell.item .dhx_scell_name {
    padding-left: 15px;
    text-align: left
}

.dhx_data_table.folder .dhx_matrix_cell {
    border-right: 0
}

.dhx_section_timeline {
    overflow: hidden;
    padding: 4px 0 2px 10px
}

.dhx_section_timeline select {
    width: 552px
}

.dhx_map_area {
    width: 100%;
    height: 100%;
    overflow-y: auto;
    overflow-x: hidden
}

.dhx_map_line .dhx_event_icon {
    width: 20px;
    border-width: 0;
    background: url(/assets/dhtmlxscheduler/imgs/icon-86fee4b0e4e30068d75a58dc63a126d3d27fffd215a494b9ffd2233e81a25548.png) 5px 4px no-repeat;
    cursor: pointer
}

.dhx_map_line {
    clear: both;
    overflow: hidden
}

.dhx_map {
    position: absolute
}

.dhx_map_line .headline_description,
.dhx_map_line div {
    float: left;
    border-right: 1px dotted #8894A3;
    text-align: center;
    line-height: 21px;
    overflow: hidden
}

.dhx_map_line .dhx_map_description {
    float: left;
    border-right: 0 dotted #8894A3;
    text-align: center;
    line-height: 21px;
    overflow: hidden
}

.dhx_map_line .line_description {
    float: left;
    border-right: 1px dotted #8894A3;
    text-align: left;
    padding-left: 5px;
    overflow: hidden
}

.dhx_map_area .dhx_map_line div {
    border-right: 0 dotted #8894A3
}

.dhtmlXTooltip.tooltip {
    -moz-box-shadow: 3px 3px 3px #888;
    -webkit-box-shadow: 3px 3px 3px #888;
    -o-box-shadow: 3px 3px 3px #888;
    box-shadow: 3px 3px 3px #888;
    filter: progid:DXImageTransform.Microsoft.Shadow(color='#888888', Direction=135, Strength=5);
    background-color: #fff;
    cursor: default;
    padding: 10px;
    position: absolute;
    z-index: 500;
    font-family: Tahoma;
    opacity: 1
}

.dhx_cal_checkbox label {
    padding-left: 5px
}

.dhx_cal_light .radio {
    padding: 2px 0 2px 10px
}

.dhx_cal_light .radio input,
.dhx_cal_light .radio label {
    line-height: 15px
}

.dhx_cal_light .radio input {
    vertical-align: middle;
    margin: 0;
    padding: 0
}

.dhx_cal_light .radio label {
    vertical-align: middle;
    padding-right: 10px
}

.dhx_cal_light .combo {
    padding: 4px
}

.dhx_cal_light_wide .dhx_combo_box {
    width: 608px !important;
    left: 10px
}

.dhx_wa_column {
    float: left
}

.dhx_wa_scale_bar {
    font-family: Tahoma;
    padding-left: 10px;
    font-size: 11px
}

.dhx_wa_day_data {
    background-color: #FCFEFC;
    overflow-y: auto
}

.dhx_wa_ev_body {
    font-size: 12px;
    padding: 5px 0 5px 7px
}

.dhx_wa_dnd {
    font-family: Tahoma;
    position: absolute;
    padding-right: 7px;
    color: #887AE2 !important;
    background-color: #FFE763 !important
}

.dhx_cal_event_selected {
    background-color: #9cc1db;
    color: #fff
}

.dhx_second_scale_bar {
    padding-top: 2px
}

.dhx_grid_area {
    width: 100%;
    height: 100%;
    overflow-y: auto;
    background-color: #FCFEFC
}

.dhx_grid_area table {
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
    table-layout: fixed
}

.dhx_grid_area td {
    table-layout: fixed;
    text-align: center
}

.dhx_grid_line {
    height: 21px;
    clear: both;
    overflow: hidden
}

.dhx_grid_line div {
    float: left;
    cursor: default;
    padding-top: 0;
    padding-bottom: 0;
    text-align: center;
    line-height: 21px;
    overflow: hidden
}

.dhx_grid_area td,
.dhx_grid_line div {
    padding-left: 8px;
    padding-right: 8px
}

.dhx_grid_area tr.dhx_grid_event {
    height: 21px;
    overflow: hidden;
    margin: 0 0 1px
}

.dhx_grid_area tr.dhx_grid_event td {
    border-bottom: 1px solid #ECEEF4
}

.dhx_grid_area tr.dhx_grid_event:nth-child(2n) td,
.dhx_grid_area tr.dhx_grid_event:nth-child(2n+1) td {
    border-bottom-width: 0;
    border-bottom-style: none
}

.dhx_grid_area tr.dhx_grid_event:nth-child(2n) {
    background-color: #ECEEF4
}

.dhx_grid_area .dhx_grid_dummy {
    table-layout: auto;
    margin: 0 !important;
    padding: 0 !important
}

.dhx_grid_v_border {
    position: absolute;
    border-right: 1px solid #A4BED4;
    width: 1px;
    height: 100%
}

.dhx_grid_event_selected {
    background-color: #9cc1db !important;
    color: #fff !important
}

.dhx_grid_sort_desc .dhx_grid_view_sort {
    background-position: 0 -55px
}

.dhx_grid_sort_asc .dhx_grid_view_sort {
    background-position: 0 -66px
}

.dhx_grid_view_sort {
    width: 10px;
    height: 10px;
    position: absolute;
    border: none !important;
    top: 5px;
    background-repeat: no-repeat;
    background-image: url(/assets/dhtmlxscheduler/imgs/images-7b749bcb5361eb5c6498a7d793e80028bfea3e8eaf96649bbc26a75120a3b7cc.png)
}

.dhx_marked_timespan {
    position: absolute;
    width: 100%;
    margin-left: 0
}

.dhx_time_block {
    position: absolute;
    width: 100%;
    background: silver;
    opacity: .4;
    filter: alpha(opacity=40);
    z-index: 1
}

.dhx_time_block_reset {
    opacity: 1;
    filter: alpha(opacity=100)
}

.dhx_mini_calendar .dhx_marked_timespan,
.dhx_scheduler_month .dhx_marked_timespan {
    display: none
}

.dhx_now_time {
    width: 100%;
    border-bottom: 2px solid red;
    z-index: 1
}

.dhx_scheduler_month .dhx_now_time {
    border-bottom: 0;
    border-left: 2px solid red
}

.dhx_matrix_now_time {
    border-left: 2px solid red;
    z-index: 1
}

.dhx_matrix_now_time,
.dhx_now_time {
    opacity: .5
}

.dhx_cal_quick_info {
    position: absolute;
    z-index: 300;
    background-color: #8e99ae;
    background-color: rgba(98, 107, 127, 0.5);
    padding-left: 7px;
    transition: left .5s ease, right .5s;
    -moz-transition: left .5s ease, right .5s;
    -webkit-transition: left .5s ease, right .5s;
    -o-transition: left .5s ease, right .5s
}

.dhx_no_animate {
    transition: none;
    -moz-transition: none;
    -webkit-transition: none;
    -o-transition: none
}

.dhx_cal_quick_info.dhx_qi_left .dhx_qi_big_icon {
    float: right
}

.dhx_cal_qi_title {
    padding: 5px 0 10px 5px;
    letter-spacing: 1px
}

.dhx_cal_qi_tdate {
    font-size: 14px
}

.dhx_cal_qi_tcontent {
    font-size: 18px;
    font-weight: 700
}

.dhx_cal_qi_content {
    background-color: #fefefe;
    font-size: 14px;
    color: #444;
    width: 275px;
    overflow: hidden
}

.dhx_qi_big_icon {
    margin: 5px 9px 5px 0;
    min-width: 60px;
    line-height: 20px;
    vertical-align: middle;
    padding: 5px 10px 5px 5px;
    cursor: pointer;
    background-color: #fefefe
}

.dhx_cal_qi_controls div {
    float: left;
    height: 20px;
    text-align: center;
    line-height: 20px
}

.dhx_qi_big_icon .dhx_menu_icon {
    margin: 0 8px 0 0
}

.dhx_drag_marker {
    width: 100%;
    filter: alpha(Opacity=50);
    opacity: .5;
    background-color: #FFE763;
    position: absolute;
    box-sizing: border-box !important;
    border-top: 1px solid #B6B6B6;
    border-bottom: 1px solid #b6b6b6
}

.dhx_cal_data,
.dhx_cal_data div,
.dhx_cal_data table *,
.dhx_cal_header,
.dhx_cal_header div,
.dhx_cal_navline div,
.dhx_cal_quick_info,
.dhx_cal_quick_info div,
.dhx_multi_day,
.dhx_multi_day div,
.dhx_tooltip_line div {
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box
}

.dhx_cal_data table {
    border-collapse: separate
}

.dhx_cal_light .dhx_cal_radio label {
    margin-bottom: 0
}

.dhx_cal_event div {
    line-height: normal
}

.dhx_cal_container {
    font-size: 8pt;
    position: relative;
    overflow: hidden
}

.dhx_cal_container div {
    -moz-user-select: none;
    -moz-user-select: -moz-none
}

.dhx_cal_navline {
    height: 20px;
    position: absolute;
    z-index: 3;
    width: 750px;
    color: #2F3A48
}

.dhx_cal_navline div {
    position: absolute;
    white-space: nowrap
}

.dhx_cal_navline .dhx_cal_date {
    padding-top: 1px
}

.dhx_cal_button .dhx_left_bg {
    width: 1px;
    overflow: hidden;
    height: 17px;
    z-index: 20;
    top: 0
}

.dhx_cal_prev_button {
    background-image: url(/assets/dhtmlxscheduler/imgs/buttons-c0eabf7f79f1391eaf99eebaf496f976ff9323ae0c9401adbecfea0963a28cad.png);
    background-position: 0 0;
    cursor: pointer
}

.dhx_cal_next_button {
    background-image: url(/assets/dhtmlxscheduler/imgs/buttons-c0eabf7f79f1391eaf99eebaf496f976ff9323ae0c9401adbecfea0963a28cad.png);
    background-position: -30px 0;
    cursor: pointer
}

.dhx_cal_today_button {
    background-image: url(/assets/dhtmlxscheduler/imgs/buttons-c0eabf7f79f1391eaf99eebaf496f976ff9323ae0c9401adbecfea0963a28cad.png);
    background-position: -60px 0;
    cursor: pointer;
    text-align: center
}

.dhx_cal_tab {
    text-align: center;
    cursor: pointer;
    background-color: #D8E1EA;
    -webkit-border-top-left-radius: 4px;
    -webkit-border-top-right-radius: 4px;
    -moz-border-radius-topleft: 4px;
    -moz-border-radius-topright: 4px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px
}

.dhx_cal_tab.active {
    cursor: default
}

.dhx_cal_header {
    position: absolute;
    left: 10px;
    top: 23px;
    width: 750px;
    z-index: 2;
    overflow: hidden;
    color: #2F3A48
}

.dhx_cal_data {
    -webkit-tap-highlight-color: transparent;
    position: absolute;
    top: 44px;
    width: 600px;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    -ms-touch-action: pan-y
}

.dhx_cal_event,
.dhx_cal_event_clear,
.dhx_cal_event_line {
    -ms-touch-action: none
}

.dhx_scale_bar {
    position: absolute;
    text-align: center
}

.dhx_scale_holder,
.dhx_scale_holder_now {
    position: absolute
}

.dhx_scale_hour {
    height: 41px;
    width: 50px;
    text-align: center;
    line-height: 40px;
    overflow: hidden
}

.dhx_month_head {
    padding-right: 5px;
    text-align: right
}

.dhx_scale_ignore {
    display: none
}

.dhx_cal_drag {
    position: absolute;
    z-index: 9999;
    background-color: #FFE763;
    border: 1px solid #B7A543;
    opacity: .5;
    filter: alpha(opacity=50)
}

.dhx_loading {
    position: absolute;
    width: 128px;
    height: 15px;
    background-image: url(/assets/dhtmlxscheduler/imgs/loading-7fe06aa21e49981d0493782e7826a4f7d664cddc0d1983a703a767125f8858e8.gif);
    z-index: 9999
}

.dhx_multi_day,
.dhx_multi_day_icon {
    background-color: #E1E6FF;
    background-repeat: no-repeat;
    border-right: 1px dotted #8894A3
}

.dhx_multi_day {
    position: absolute
}

.dhx_multi_day_icon,
.dhx_multi_day_icon_small {
    background-position: center center;
    background-repeat: no-repeat
}

.dhtmlxLayoutPolyContainer_dhx_skyblue .dhx_cal_container {
    background-color: #d0e5ff
}

.dhx_form_repeat,
.dhx_form_repeat input {
    padding: 0 0 0 5px;
    margin: 0;
    font-family: Tahoma, Verdana;
    font-size: 11px;
    line-height: 24px
}

.dhx_form_repeat {
    overflow: hidden
}

.dhx_cal_light_wide .dhx_form_repeat {
    background-color: transparent
}

.dhx_repeat_center,
.dhx_repeat_divider,
.dhx_repeat_left,
.dhx_repeat_right {
    height: 115px;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.dhx_repeat_center,
.dhx_repeat_left {
    padding: 10px 0 0 10px;
    float: left
}

.dhx_repeat_left {
    width: 105px
}

.dhx_repeat_center {
    width: 345px;
    padding-top: 22px
}

.dhx_repeat_divider {
    float: left;
    width: 1px
}

.dhx_repeat_right {
    float: right;
    width: 173px;
    padding: 17px 3px 0 10px
}

input.dhx_repeat_text {
    height: 16px;
    width: 27px;
    margin: 0 4px;
    line-height: 18px;
    padding: 0 0 0 2px
}

.dhx_form_repeat select {
    height: 20px;
    width: 87px;
    padding: 0 0 0 2px;
    margin: 0 4px
}

input.dhx_repeat_date {
    height: 18px;
    width: 80px;
    padding: 0 0 0 2px;
    margin: 0 4px;
    background-repeat: no-repeat;
    background-position: 64px 0;
    border: 1px solid #7f9db9;
    line-height: 18px
}

input.dhx_repeat_radio {
    margin-right: 4px
}

input.dhx_repeat_checkbox {
    margin: 4px 4px 0 0
}

.dhx_repeat_days td {
    padding-right: 5px
}

.dhx_repeat_days label {
    font-size: 10px
}

.dhx_custom_button {
    width: 90px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px
}

.dhx_custom_button_recurring {
    background-position: -5px 20px;
    width: 20px;
    margin-right: 10px
}

.dhx_cal_light_rec {
    width: 640px
}

.dhx_cal_light_rec .dhx_cal_larea {
    width: 632px
}

.dhx_cal_light_rec.dhx_cal_light_wide {
    width: 816px
}

.dhx_cal_light_rec.dhx_cal_light_wide .dhx_cal_larea {
    width: 808px
}

.dhx_cal_event .dhx_title {
    border-width: 1px 1px 0;
    -webkit-border-top-left-radius: 1px;
    -webkit-border-top-right-radius: 1px;
    -moz-border-radius-topleft: 1px;
    -moz-border-radius-topright: 1px;
    border-top-left-radius: 1px;
    border-top-right-radius: 1px;
    font-family: "Segoe UI", Arial;
    font-weight: 700;
    font-size: 12px;
    height: 14px;
    line-height: 14px
}

.dhx_cal_event .dhx_body,
.dhx_cal_event.dhx_cal_select_menu .dhx_body {
    padding-bottom: 8px;
    -webkit-border-bottom-right-radius: 1px;
    -webkit-border-bottom-left-radius: 1px;
    -moz-border-radius-bottomright: 1px;
    -moz-border-radius-bottomleft: 1px;
    border-bottom-right-radius: 1px;
    border-bottom-left-radius: 1px
}

.dhx_cal_event .dhx_header,
.dhx_cal_event.dhx_cal_select_menu .dhx_footer {
    display: none
}

.dhx_cal_event .dhx_footer {
    height: 15px;
    border: 0;
    background-color: transparent !important;
    margin-top: -11px
}

.dhx_cal_event .dhx_footer:hover {
    background: url(/assets/dhtmlxscheduler/imgs_flat/resizing-cb7e4cfe32704f4a9ae2ab6ac05cb2df65652f5280cb9c8d9c0220f7d2fafb18.png) center center no-repeat
}

.dhx_cal_event .dhx_body,
.dhx_cal_event .dhx_header,
.dhx_cal_event .dhx_title {
    background-color: #5B9BE0;
    border-color: transparent;
    color: #fff
}

.dhx_cal_event,
.dhx_cal_event_line {
    -webkit-box-shadow: 0 0 1px #FFF;
    -moz-box-shadow: 0 0 1px #FFF;
    box-shadow: 0 0 1px #FFF
}

.dhx_cal_event.dhx_cal_editor {
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    border: 1px solid transparent
}

.dhx_cal_editor {
    font-size: 12px;
    font-family: "Segoe UI", Arial
}

div.dhx_menu_head,
div.dhx_menu_icon {
    background-image: url(/assets/dhtmlxscheduler/imgs_flat/controls-b3f22f3239081facb41da40f39c55d8fe2b0bdbba8332c9988ea35c7e036649d.png)
}

.dhx_cal_event_line {
    border: 1px solid transparent;
    background-color: #5B9BE0;
    color: #FFF;
    height: 17px;
    line-height: 16px;
    -webkit-border-radius: 1px;
    -moz-border-radius: 1px;
    border-radius: 1px
}

.dhx_cal_event_line:hover div {
    background: url(/assets/dhtmlxscheduler/imgs_flat/resize_dots-d9ffa7c4a919646c79f282e92d3c1f9448ce1dff63996ae3be661b19430895b7.png) repeat-y
}

.dhx_cal_event_line_start {
    -webkit-border-top-left-radius: 1px;
    -webkit-border-bottom-left-radius: 1px;
    -moz-border-radius-topleft: 1px;
    -moz-border-radius-bottomleft: 1px;
    border-top-left-radius: 1px;
    border-bottom-left-radius: 1px
}

.dhx_cal_event_line_end {
    -webkit-border-top-right-radius: 1px;
    -webkit-border-bottom-right-radius: 1px;
    -moz-border-radius-topright: 1px;
    -moz-border-radius-bottomright: 1px;
    border-top-right-radius: 1px;
    border-bottom-right-radius: 1px
}

.dhx_cal_event .dhx_body,
.dhx_cal_event_line {
    font-size: 12px;
    font-family: "Segoe UI", Arial
}

.dhx_cal_event:hover .dhx_footer {
    background: url(/assets/dhtmlxscheduler/imgs_flat/resizing-cb7e4cfe32704f4a9ae2ab6ac05cb2df65652f5280cb9c8d9c0220f7d2fafb18.png) center center no-repeat
}

.dhx_cal_container {
    background-color: #fff;
    font-family: "Segoe UI", Arial
}

.dhx_cal_data {
    border-top: 1px solid #CECECE
}

.dhx_scale_holder {
    background-image: url(/assets/dhtmlxscheduler/imgs_flat/databg-1e4549005c61996b9d75dca3a6d31d935a74967147c0404145b8772e669de3d8.png);
    border-right: 1px solid #CECECE
}

.dhx_scale_holder_now {
    background-image: url(/assets/dhtmlxscheduler/imgs_flat/databg_now-ee9b540c1166de31707ac7f8ba3510b99496c58519bf7233dd73c5e34a05f35f.png);
    border-right: 1px solid #CECECE
}

.dhx_scale_hour {
    border-bottom: 1px solid #CECECE;
    background-color: #fff;
    font: 11px/44px Arial;
    font-family: "Segoe UI", Arial;
    font-weight: lighter;
    color: #767676
}

.dhx_scale_h {
    display: inline-block;
    font-size: 22px
}

.dhx_scale_m {
    display: inline-block;
    font-size: 11px;
    line-height: 35px;
    vertical-align: top
}

.dhx_cal_header {
    border: 1px solid #CECECE;
    border-left: 0;
    border-bottom: 0
}

.dhx_scale_bar {
    border-left: 1px solid #CECECE;
    font: 12px/16px "Segoe UI", Arial;
    color: #767676;
    line-height: 30px;
    padding-top: 2px;
    background-color: #fff
}

.dhx_scale_bar>a {
    color: #5780AD;
    text-decoration: none
}

.dhx_scale_bar>a:hover {
    text-decoration: underline
}

.dhx_month_head>a {
    color: #5780AD;
    text-decoration: none
}

.dhx_month_head>a:hover {
    text-decoration: underline
}

.dhx_cal_navline div {
    top: 14px
}

.dhx_cal_date,
.dhx_cal_next_button,
.dhx_cal_prev_button,
.dhx_cal_tab,
.dhx_cal_today_button {
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    border: none;
    color: #454544;
    height: 30px;
    line-height: 30px;
    background: 0 0;
    font-family: "Segoe UI", Arial;
    font-weight: lighter
}

.dhx_cal_navline .dhx_cal_date {
    border: 0;
    color: #454544;
    font-family: "Segoe UI", Arial;
    font-weight: lighter;
    font-size: 22px;
    text-align: center;
    top: 14px;
    position: absolute;
    left: 0;
    width: 100%;
    z-index: -1
}

.dhx_cal_today_button {
    background: 0 0;
    color: #5780AD;
    font-size: 13px;
    font-weight: bolder;
    left: auto;
    right: 123px;
    text-decoration: none;
    width: 80px
}

.dhx_cal_next_button,
.dhx_cal_prev_button {
    left: auto;
    width: 46px
}

.dhx_cal_prev_button {
    right: 61px
}

.dhx_cal_next_button {
    right: 14px
}

.dhx_cal_tab {
    color: #5780AD;
    font-size: 13px;
    font-weight: bolder;
    padding-top: 0;
    text-decoration: none;
    width: 60px
}

.dhx_cal_tab:hover,
.dhx_cal_today_button:hover {
    text-decoration: underline
}

.dhx_cal_tab.active {
    background-color: #5780AD;
    border: none;
    color: #FFF;
    font-family: "Segoe UI", Arial;
    font-weight: lighter;
    text-decoration: none
}

.dhx_cal_tab_standalone {
    padding: 0 5px
}

.dhx_multi_day,
.dhx_multi_day_icon,
.dhx_multi_day_icon_small {
    background-color: #fff
}

.dhx_multi_day {
    border-top: 1px solid #CECECE
}

.dhx_multi_day_icon,
.dhx_multi_day_icon_small {
    border-bottom: 1px solid #CECECE;
    border-right: 1px solid #CECECE
}

.dhx_multi_day_icon_small {
    background-image: url(/assets/dhtmlxscheduler/imgs_flat/clock-ba1fa736b095282de7421a79132dba02660018fb6d0a1039d3a5b700e40b293a.png)
}

.dhx_multi_day_icon {
    background-image: url(/assets/dhtmlxscheduler/imgs_flat/clock_big-7c6cc98c4c89147fbe9fc8a7a9ade5227df5395d39bf8564aa27e1c34b2207ed.gif)
}

.dhx_month_body,
.dhx_month_head {
    background-color: #fff
}

.dhx_after .dhx_month_body,
.dhx_after .dhx_month_head,
.dhx_before .dhx_month_body,
.dhx_before .dhx_month_head {
    background-color: #F7F7F7
}

.dhx_month_head {
    height: 21px;
    padding-top: 0;
    font: 12px/21px "Segoe UI", Arial;
    color: #5780AD;
    border-right: 1px solid #CECECE
}

.dhx_after .dhx_month_head,
.dhx_before .dhx_month_head {
    color: #bbb
}

.dhx_month_body {
    border-right: 1px solid #CECECE;
    border-bottom: 1px solid #CECECE
}

.dhx_now .dhx_month_body,
.dhx_now .dhx_month_head {
    background-color: #FFF3A1;
    font-weight: 400
}

.dhx_cal_event_clear {
    color: #0E64A0
}

.dhx_cal_larea {
    margin-left: 0
}

.dhx_cal_light_wide .dhx_cal_larea {
    margin-left: 3px
}

.dhx_cal_light_wide .dhx_wrap_section {
    padding: 5px 0
}

.dhx_cal_larea,
.dhx_cal_light,
.dhx_cal_light_wide .dhx_wrap_section,
.dhx_cal_lsection,
.dhx_cal_ltext textarea,
.dhx_wrap_section {
    background-color: #fff;
    font-family: "Segoe UI", Arial
}

.dhx_cal_light input,
.dhx_cal_light_wide .dhx_cal_lsection .dhx_fullday,
.dhx_cal_lsection,
.dhx_cal_lsection .dhx_fullday {
    color: #444;
    font-family: "Segoe UI", Arial
}

.dhx_cal_light_wide .dhx_wrap_section {
    border-top: 0;
    border-bottom: 1px solid #CECECE
}

.dhx_cal_larea {
    border: 1px solid transparent
}

.dhx_cal_light,
.dhx_cal_light select,
.dhx_cal_ltext textarea {
    color: #2E2E2E
}

.dhx_cal_light {
    border: none;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0
}

.dhx_cal_light_wide .dhx_cal_lsection,
.dhx_cal_light_wide .dhx_cal_lsection .dhx_fullday {
    font-family: "Segoe UI", Arial;
    font-size: 13px;
    font-weight: 700
}

.dhx_section_time {
    background-color: transparent
}

.dhx_btn_set div:first-child,
.dhx_cancel_btn,
.dhx_delete_btn,
.dhx_save_btn {
    display: none
}

.dhx_btn_set,
.dhx_btn_set div {
    height: 30px;
    padding: 0 20px;
    line-height: 30px
}

.dhx_btn_set {
    margin: 12px 0 0;
    padding: 0;
    font-size: 13px;
    color: #444;
    font-weight: 400;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0
}

.dhx_left_btn_set {
    margin-left: 20px
}

.dhx_right_btn_set {
    margin-right: 20px
}

.dhx_save_btn_set {
    border: none;
    color: #FFF;
    background-color: #5B9BE0
}

.dhx_cancel_btn_set {
    background-color: #FE7510;
    color: #FFF
}

.dhx_delete_btn_set {
    border: 1px solid #888;
    color: #444
}

.dhx_cal_ltitle {
    height: 30px;
    line-height: 30px;
    border-bottom: 1px solid #CECECE
}

.dhx_cal_ltitle span {
    float: left
}

.dhx_cal_light .dhx_title {
    font-size: 13px;
    padding-left: 13px
}

.dhx_mark {
    display: none
}

.dhx_time {
    font-size: 12px;
    padding-left: 10px
}

.dhx_close_icon {
    float: right;
    width: 9px;
    height: 9px;
    background: url(/assets/dhtmlxscheduler/imgs_flat/close_icon-d58ba231065c4a1de79ffdccc35e8ced6741db35a504ac5334ff4a69ab6665d2.png) center center no-repeat;
    padding: 10px;
    margin-top: 1px
}

.dhx_cal_light_wide .dhx_cal_ltext.dhx_cal_template {
    line-height: 22px
}

.dhx_cal_ltext textarea {
    line-height: 20px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    border: 1px solid #CECECE;
    background-color: #F9F9F9
}

.dhtmlx_modal_box {
    border: none;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    background: #fff;
    font-family: "Segoe UI", Arial;
    width: 330px
}

.dhtmlx_popup_text {
    font-size: 16px
}

.dhtmlx_popup_controls {
    padding-bottom: 9px
}

.dhtmlx_popup_button,
.dhtmlx_popup_button div,
.dhtmlx_popup_button div:active,
.dhtmlx_popup_button:active {
    color: #444;
    background: #fff;
    box-shadow: none;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0
}

.dhtmlx_popup_button {
    border: 1px solid #888
}

.dhtmlx_popup_button div {
    border: none
}

.dhtmlx_popup_button.dhtmlx_ok_button {
    border-color: #5B9BE0;
    background-color: #5B9BE0;
    color: #FFF
}

.dhtmlx_popup_button.dhtmlx_cancel_button {
    border-color: #FE7510;
    background-color: #FE7510;
    color: #FFF
}

.dhtmlx_popup_button.dhtmlx_cancel_button div,
.dhtmlx_popup_button.dhtmlx_ok_button div {
    background: 0 0;
    color: #FFF
}

.dhx_cal_container.dhx_mini_calendar {
    box-sizing: border-box;
    border: none;
    box-shadow: 0 2px 10px 0 #AAA;
    border-radius: 0
}

.dhx_mini_calendar .dhx_year_month {
    border: 1px solid #CECECE;
    font-family: "Segoe UI", Arial
}

.dhx_mini_calendar .dhx_month_body,
.dhx_mini_calendar .dhx_month_head,
.dhx_mini_calendar .dhx_scale_bar,
.dhx_mini_calendar .dhx_year_body,
.dhx_mini_calendar .dhx_year_month {
    border-color: transparent
}

.dhx_mini_calendar .dhx_year_body {
    padding-top: 1px
}

.dhx_mini_calendar .dhx_scale_bar {
    border-width: 0
}

.dhx_mini_calendar .dhx_year_week {
    border-bottom: 1px solid #CECECE;
    padding-top: 1px
}

.dhx_mini_calendar .dhx_month_head {
    padding-right: 0;
    text-align: center
}

.dhx_mini_calendar .dhx_cal_next_button,
.dhx_mini_calendar .dhx_cal_prev_button {
    border: 0;
    height: 20px
}

.dhx_cal_navline div.dhx_minical_icon {
    left: 210px;
    top: 14px;
    width: 30px;
    height: 30px;
    background: url(/assets/dhtmlxscheduler/imgs_flat/calendar-bb1fd45a80dee0e63d1bc4a08e61eeedde0e55fe58488734164b3255ed9e45c4.gif) 3px 5px no-repeat
}

.dhx_cal_event_line .dhx_event_resize {
    background: 0 0
}

.dhx_cal_event_line .dhx_event_resize:hover {
    background: url(/assets/dhtmlxscheduler/imgs_flat/resize_dots-d9ffa7c4a919646c79f282e92d3c1f9448ce1dff63996ae3be661b19430895b7.png) repeat-y
}

.dhx_matrix_cell,
.dhx_matrix_scell {
    border-bottom: 1px solid #CECECE;
    border-right: 1px solid #CECECE
}

.dhx_cal_header div div {
    border-left: 1px solid #CECECE
}

.dhx_matrix_scell {
    font-size: 13px
}

.dhx_second_scale_bar {
    border-bottom: 1px solid #CECECE
}

.dhx_repeat_divider {
    border-left: 1px solid #CECECE
}

.dhx_custom_button {
    background-color: #fff;
    border: 1px solid #a4a4a4;
    border-radius: 0;
    color: #444
}

.dhx_cal_light_wide .dhx_custom_button {
    margin-top: 6px
}

.dhx_custom_button_recurring {
    background-image: url(/assets/dhtmlxscheduler/imgs_flat/but_repeat-2fb4f73b36feb67acc840717edbb1cc2130baf5efdc7bf109b78e6988ddee75f.gif)
}

input.dhx_repeat_date {
    border-color: #a8a8a8
}

.dhx_form_repeat {
    background-color: transparent
}

.dhx_agenda_line div,
.dhx_v_border {
    border-right: 1px solid #CECECE
}

.dhx_cal_header .dhx_agenda_line,
.dhx_cal_header .dhx_agenda_line div {
    height: 100%;
    line-height: 35px
}

.dhx_agenda_area,
.dhx_scheduler_agenda .dhx_cal_data {
    background-image: url(/assets/dhtmlxscheduler/imgs_flat/agenda_bg-dca37bc8d0e13f7f991b6e812d17f95f5b40756a906cd8546be13798072cabec.gif)
}

.dhx_agenda_line {
    height: 26px
}

.dhx_agenda_line div,
.dhx_agenda_line span {
    line-height: 26px
}

.dhx_agenda_line .dhx_event_icon {
    background-position: 5px 6px
}

.dhx_year_month {
    border: 1px solid #CECECE
}

.dhx_scale_bar_last {
    border-right: 1px solid #CECECE
}

.dhx_year_body {
    border-left: 1px solid #CECECE
}

.dhx_expand_icon {
    top: -3px
}

.dhx_scale_bar .dhx_cal_next_button,
.dhx_scale_bar .dhx_cal_prev_button {
    width: 20px;
    height: 100%;
    top: 0 !important;
    border: 0
}

.dhx_scale_bar .dhx_cal_next_button {
    right: 1px !important;
    border-left: 1px solid #CECECE
}

.dhx_scale_bar .dhx_cal_prev_button {
    left: 1px !important;
    border-right: 1px solid #CECECE
}

.dhx_map_line .headline_date,
.dhx_map_line .headline_description {
    border: 0
}

.dhx_map_line .headline_date {
    border-right: 1px solid #CECECE
}

.dhx_map_line.highlight {
    background-color: #b3daff
}

.dhx_cal_header .dhx_map_line {
    height: 100%
}

.dhx_cal_header .dhx_map_line .headline_date,
.dhx_cal_header .dhx_map_line .headline_description {
    height: 100%;
    line-height: 35px
}

.dhx_map_area {
    background-image: url(/assets/dhtmlxscheduler/imgs_flat/agenda_bg-dca37bc8d0e13f7f991b6e812d17f95f5b40756a906cd8546be13798072cabec.gif)
}

.dhx_map_line {
    height: 26px
}

.dhx_map_line .line_description,
.dhx_map_line div {
    line-height: 26px;
    height: 26px
}

.dhx_map_line .dhx_event_icon {
    background-position: 5px 6px
}

.dhx_cal_data div.dhx_map_area,
.dhx_cal_header div.dhx_map_line {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border-right: 1px solid #cecece
}

.dhtmlXTooltip.tooltip {
    border-left: 1px solid #CECECE;
    border-top: 1px solid #CECECE;
    color: #747473;
    font-size: 12px;
    line-height: 16px
}

.dhx_wa_scale_bar {
    border-top: 1px solid #CECECE;
    border-bottom: 1px solid #CECECE
}

.dhx_wa_column_last .dhx_wa_day_cont {
    border-left: 1px solid #CECECE
}

.dhx_wa_ev_body {
    border-bottom: 1px solid #CECECE
}

.dhx_wa_scale_bar {
    background-color: #f0ede7
}

.dhx_wa_ev_body.dhx_cal_event_selected {
    background-color: #fff3a1;
    color: #362d26
}

.dhx_wa_dnd {
    background-color: #fddb93 !important;
    color: #747473 !important;
    border: 1px solid #ccb177
}

.dhx_text_disabled {
    color: #2E2E2E
}

.dhx_cal_ltext .dhx_text_disabled {
    line-height: 22px
}

.dhx_grid_v_border {
    border-right-color: #CECECE
}

.dhx_cal_header .dhx_grid_line,
.dhx_cal_header .dhx_grid_line div {
    height: 100%;
    line-height: 35px
}

.dhx_cal_header .dhx_grid_line div.dhx_grid_view_sort {
    height: 10px;
    top: 12px
}

.dhx_month_body_border,
.dhx_month_head_border,
.dhx_scale_bar_border,
.dhx_scale_hour_border {
    border-left: 1px solid #CECECE
}

.dhx_cal_quick_info {
    background: rgba(204, 204, 204, 0.8);
    border: none;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    font-family: "Segoe UI", Arial;
    width: 280px
}

.dhx_cal_qi_title {
    color: #000
}

.dhx_cal_qi_tdate {
    color: #444
}

.dhx_cal_qi_content {
    background: 0 0;
    border: none;
    padding: 10px 8px
}

.dhx_qi_big_icon {
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    border: none;
    color: #FFF;
    float: none;
    font-size: 13px
}

.dhx_qi_big_icon .dhx_menu_icon {
    display: none !important
}

.dhx_cal_quick_info .icon_details {
    background: #5B9BE0;
    margin-left: 100px
}

.dhx_cal_quick_info .icon_details div {
    padding-left: 12px
}

.dhx_cal_quick_info .icon_delete {
    background: #FE7510
}

.dhx_cal_quick_info .icon_delete div {
    padding-left: 12px
}

.dhx_cal_navline .dhx_cal_export {
    width: 32px;
    height: 32px;
    margin: 2px;
    cursor: pointer;
    top: 12px
}

.dhx_cal_navline .dhx_cal_export.pdf {
    left: auto;
    right: 249px;
    background-image: url(/assets/dhtmlxscheduler/imgs_flat/export_pdf-73d45321400bca6c6192763b1a45426ef2d9e0a3ed4a7b2bff63d32bfd59cca6.png)
}

.dhx_cal_navline .dhx_cal_export.ical {
    left: auto;
    right: 210px;
    background-image: url(/assets/dhtmlxscheduler/imgs_flat/export_ical-d476b2ea7c15547207c82f96c693b0075fa520f9aa550ab464ffdd8cb97a1447.png)
}

.dhx_mini_calendar {
    font-family: "Segoe UI", Arial;
    padding: 5px
}

.dhx_mini_calendar .dhx_calendar_click,
.dhx_mini_calendar .dhx_year_event {
    border-radius: 0
}

.dhx_mini_calendar .dhx_month_head {
    color: #363636;
    font-family: "Segoe UI", Arial;
    font-size: 13px;
    margin: 2px
}

.dhx_mini_calendar .dhx_year_month {
    color: #454544;
    line-height: 20px;
    height: 25px;
    font-size: 20px;
    font-weight: lighter
}

.dhx_mini_calendar .dhx_cal_next_button,
.dhx_mini_calendar .dhx_cal_prev_button {
    top: 8px !important
}

.dhx_mini_calendar .dhx_scale_bar {
    font-family: "Segoe UI", Arial;
    font-size: 11px
}

body.stop-scrolling {
    height: 100%;
    overflow: hidden
}

.sweet-overlay {
    background-color: black;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
    background-color: rgba(0, 0, 0, 0.4);
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    display: none;
    z-index: 10000
}

.sweet-alert {
    background-color: white;
    font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    width: 478px;
    padding: 17px;
    border-radius: 5px;
    text-align: center;
    position: fixed;
    left: 50%;
    top: 50%;
    margin-left: -256px;
    margin-top: -200px;
    overflow: hidden;
    display: none;
    z-index: 99999
}

@media all and (max-width: 540px) {
    .sweet-alert {
        width: auto;
        margin-left: 0;
        margin-right: 0;
        left: 15px;
        right: 15px
    }
}

.sweet-alert h2 {
    color: #575757;
    font-size: 30px;
    text-align: center;
    font-weight: 600;
    text-transform: none;
    position: relative;
    margin: 25px 0;
    padding: 0;
    line-height: 40px;
    display: block
}

.sweet-alert p {
    color: #797979;
    font-size: 16px;
    text-align: center;
    font-weight: 400;
    position: relative;
    text-align: inherit;
    float: none;
    margin: 0;
    padding: 0;
    line-height: normal
}

.sweet-alert fieldset {
    border: none;
    position: relative
}

.sweet-alert .sa-error-container {
    background-color: #f1f1f1;
    margin-left: -17px;
    margin-right: -17px;
    overflow: hidden;
    padding: 0 10px;
    max-height: 0;
    webkit-transition: padding 0.15s, max-height 0.15s;
    transition: padding 0.15s, max-height 0.15s
}

.sweet-alert .sa-error-container.show {
    padding: 10px 0;
    max-height: 100px;
    webkit-transition: padding 0.2s, max-height 0.2s;
    transition: padding 0.25s, max-height 0.25s
}

.sweet-alert .sa-error-container .icon {
    display: inline-block;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background-color: #ea7d7d;
    color: white;
    line-height: 24px;
    text-align: center;
    margin-right: 3px
}

.sweet-alert .sa-error-container p {
    display: inline-block
}

.sweet-alert .sa-input-error {
    position: absolute;
    top: 29px;
    right: 26px;
    width: 20px;
    height: 20px;
    opacity: 0;
    -webkit-transform: scale(0.5);
    transform: scale(0.5);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-transition: all 0.1s;
    transition: all 0.1s
}

.sweet-alert .sa-input-error::before,
.sweet-alert .sa-input-error::after {
    content: "";
    width: 20px;
    height: 6px;
    background-color: #f06e57;
    border-radius: 3px;
    position: absolute;
    top: 50%;
    margin-top: -4px;
    left: 50%;
    margin-left: -9px
}

.sweet-alert .sa-input-error::before {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

.sweet-alert .sa-input-error::after {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg)
}

.sweet-alert .sa-input-error.show {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
}

.sweet-alert input {
    width: 100%;
    box-sizing: border-box;
    border-radius: 3px;
    border: 1px solid #d7d7d7;
    height: 43px;
    margin-top: 10px;
    margin-bottom: 17px;
    font-size: 18px;
    box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.06);
    padding: 0 12px;
    display: none;
    -webkit-transition: all 0.3s;
    transition: all 0.3s
}

.sweet-alert input:focus {
    outline: none;
    box-shadow: 0px 0px 3px #c4e6f5;
    border: 1px solid #b4dbed
}

.sweet-alert input:focus::-moz-placeholder {
    transition: opacity 0.3s 0.03s ease;
    opacity: 0.5
}

.sweet-alert input:focus:-ms-input-placeholder {
    transition: opacity 0.3s 0.03s ease;
    opacity: 0.5
}

.sweet-alert input:focus::-webkit-input-placeholder {
    transition: opacity 0.3s 0.03s ease;
    opacity: 0.5
}

.sweet-alert input::-moz-placeholder {
    color: #bdbdbd
}

.sweet-alert input:-ms-input-placeholder {
    color: #bdbdbd
}

.sweet-alert input::-webkit-input-placeholder {
    color: #bdbdbd
}

.sweet-alert.show-input input {
    display: block
}

.sweet-alert .sa-confirm-button-container {
    display: inline-block;
    position: relative
}

.sweet-alert .la-ball-fall {
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -27px;
    margin-top: 4px;
    opacity: 0;
    visibility: hidden
}

.sweet-alert button {
    background-color: #8CD4F5;
    color: white;
    border: none;
    box-shadow: none;
    font-size: 17px;
    font-weight: 500;
    -webkit-border-radius: 4px;
    border-radius: 5px;
    padding: 10px 32px;
    margin: 26px 5px 0 5px;
    cursor: pointer
}

.sweet-alert button:focus {
    outline: none;
    box-shadow: 0 0 2px rgba(128, 179, 235, 0.5), inset 0 0 0 1px rgba(0, 0, 0, 0.05)
}

.sweet-alert button:hover {
    background-color: #7ecff4
}

.sweet-alert button:active {
    background-color: #5dc2f1
}

.sweet-alert button.cancel {
    background-color: #C1C1C1
}

.sweet-alert button.cancel:hover {
    background-color: #b9b9b9
}

.sweet-alert button.cancel:active {
    background-color: #a8a8a8
}

.sweet-alert button.cancel:focus {
    box-shadow: rgba(197, 205, 211, 0.8) 0px 0px 2px, rgba(0, 0, 0, 0.0470588) 0px 0px 0px 1px inset !important
}

.sweet-alert button[disabled] {
    opacity: .6;
    cursor: default
}

.sweet-alert button.confirm[disabled] {
    color: transparent
}

.sweet-alert button.confirm[disabled]~.la-ball-fall {
    opacity: 1;
    visibility: visible;
    transition-delay: 0s
}

.sweet-alert button::-moz-focus-inner {
    border: 0
}

.sweet-alert[data-has-cancel-button=false] button {
    box-shadow: none !important
}

.sweet-alert[data-has-confirm-button=false][data-has-cancel-button=false] {
    padding-bottom: 40px
}

.sweet-alert .sa-icon {
    width: 80px;
    height: 80px;
    border: 4px solid gray;
    -webkit-border-radius: 40px;
    border-radius: 40px;
    border-radius: 50%;
    margin: 20px auto;
    padding: 0;
    position: relative;
    box-sizing: content-box
}

.sweet-alert .sa-icon.sa-error {
    border-color: #F27474
}

.sweet-alert .sa-icon.sa-error .sa-x-mark {
    position: relative;
    display: block
}

.sweet-alert .sa-icon.sa-error .sa-line {
    position: absolute;
    height: 5px;
    width: 47px;
    background-color: #F27474;
    display: block;
    top: 37px;
    border-radius: 2px
}

.sweet-alert .sa-icon.sa-error .sa-line.sa-left {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    left: 17px
}

.sweet-alert .sa-icon.sa-error .sa-line.sa-right {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    right: 16px
}

.sweet-alert .sa-icon.sa-warning {
    border-color: #F8BB86
}

.sweet-alert .sa-icon.sa-warning .sa-body {
    position: absolute;
    width: 5px;
    height: 47px;
    left: 50%;
    top: 10px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    margin-left: -2px;
    background-color: #F8BB86
}

.sweet-alert .sa-icon.sa-warning .sa-dot {
    position: absolute;
    width: 7px;
    height: 7px;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    margin-left: -3px;
    left: 50%;
    bottom: 10px;
    background-color: #F8BB86
}

.sweet-alert .sa-icon.sa-info {
    border-color: #C9DAE1
}

.sweet-alert .sa-icon.sa-info::before {
    content: "";
    position: absolute;
    width: 5px;
    height: 29px;
    left: 50%;
    bottom: 17px;
    border-radius: 2px;
    margin-left: -2px;
    background-color: #C9DAE1
}

.sweet-alert .sa-icon.sa-info::after {
    content: "";
    position: absolute;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    margin-left: -3px;
    top: 19px;
    background-color: #C9DAE1
}

.sweet-alert .sa-icon.sa-success {
    border-color: #A5DC86
}

.sweet-alert .sa-icon.sa-success::before,
.sweet-alert .sa-icon.sa-success::after {
    content: '';
    -webkit-border-radius: 40px;
    border-radius: 40px;
    border-radius: 50%;
    position: absolute;
    width: 60px;
    height: 120px;
    background: white;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg)
}

.sweet-alert .sa-icon.sa-success::before {
    -webkit-border-radius: 120px 0 0 120px;
    border-radius: 120px 0 0 120px;
    top: -7px;
    left: -33px;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transform-origin: 60px 60px;
    transform-origin: 60px 60px
}

.sweet-alert .sa-icon.sa-success::after {
    -webkit-border-radius: 0 120px 120px 0;
    border-radius: 0 120px 120px 0;
    top: -11px;
    left: 30px;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transform-origin: 0px 60px;
    transform-origin: 0px 60px
}

.sweet-alert .sa-icon.sa-success .sa-placeholder {
    width: 80px;
    height: 80px;
    border: 4px solid rgba(165, 220, 134, 0.2);
    -webkit-border-radius: 40px;
    border-radius: 40px;
    border-radius: 50%;
    box-sizing: content-box;
    position: absolute;
    left: -4px;
    top: -4px;
    z-index: 2
}

.sweet-alert .sa-icon.sa-success .sa-fix {
    width: 5px;
    height: 90px;
    background-color: white;
    position: absolute;
    left: 28px;
    top: 8px;
    z-index: 1;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

.sweet-alert .sa-icon.sa-success .sa-line {
    height: 5px;
    background-color: #A5DC86;
    display: block;
    border-radius: 2px;
    position: absolute;
    z-index: 2
}

.sweet-alert .sa-icon.sa-success .sa-line.sa-tip {
    width: 25px;
    left: 14px;
    top: 46px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg)
}

.sweet-alert .sa-icon.sa-success .sa-line.sa-long {
    width: 47px;
    right: 8px;
    top: 38px;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

.sweet-alert .sa-icon.sa-custom {
    background-size: contain;
    border-radius: 0;
    border: none;
    background-position: center center;
    background-repeat: no-repeat
}

@-webkit-keyframes showSweetAlert {
    0% {
        transform: scale(0.7);
        -webkit-transform: scale(0.7)
    }

    45% {
        transform: scale(1.05);
        -webkit-transform: scale(1.05)
    }

    80% {
        transform: scale(0.95);
        -webkit-transform: scale(0.95)
    }

    100% {
        transform: scale(1);
        -webkit-transform: scale(1)
    }
}

@keyframes showSweetAlert {
    0% {
        transform: scale(0.7);
        -webkit-transform: scale(0.7)
    }

    45% {
        transform: scale(1.05);
        -webkit-transform: scale(1.05)
    }

    80% {
        transform: scale(0.95);
        -webkit-transform: scale(0.95)
    }

    100% {
        transform: scale(1);
        -webkit-transform: scale(1)
    }
}

@-webkit-keyframes hideSweetAlert {
    0% {
        transform: scale(1);
        -webkit-transform: scale(1)
    }

    100% {
        transform: scale(0.5);
        -webkit-transform: scale(0.5)
    }
}

@keyframes hideSweetAlert {
    0% {
        transform: scale(1);
        -webkit-transform: scale(1)
    }

    100% {
        transform: scale(0.5);
        -webkit-transform: scale(0.5)
    }
}

@-webkit-keyframes slideFromTop {
    0% {
        top: 0%
    }

    100% {
        top: 50%
    }
}

@keyframes slideFromTop {
    0% {
        top: 0%
    }

    100% {
        top: 50%
    }
}

@-webkit-keyframes slideToTop {
    0% {
        top: 50%
    }

    100% {
        top: 0%
    }
}

@keyframes slideToTop {
    0% {
        top: 50%
    }

    100% {
        top: 0%
    }
}

@-webkit-keyframes slideFromBottom {
    0% {
        top: 70%
    }

    100% {
        top: 50%
    }
}

@keyframes slideFromBottom {
    0% {
        top: 70%
    }

    100% {
        top: 50%
    }
}

@-webkit-keyframes slideToBottom {
    0% {
        top: 50%
    }

    100% {
        top: 70%
    }
}

@keyframes slideToBottom {
    0% {
        top: 50%
    }

    100% {
        top: 70%
    }
}

.showSweetAlert[data-animation=pop] {
    -webkit-animation: showSweetAlert 0.3s;
    animation: showSweetAlert 0.3s
}

.showSweetAlert[data-animation=none] {
    -webkit-animation: none;
    animation: none
}

.showSweetAlert[data-animation=slide-from-top] {
    -webkit-animation: slideFromTop 0.3s;
    animation: slideFromTop 0.3s
}

.showSweetAlert[data-animation=slide-from-bottom] {
    -webkit-animation: slideFromBottom 0.3s;
    animation: slideFromBottom 0.3s
}

.hideSweetAlert[data-animation=pop] {
    -webkit-animation: hideSweetAlert 0.2s;
    animation: hideSweetAlert 0.2s
}

.hideSweetAlert[data-animation=none] {
    -webkit-animation: none;
    animation: none
}

.hideSweetAlert[data-animation=slide-from-top] {
    -webkit-animation: slideToTop 0.4s;
    animation: slideToTop 0.4s
}

.hideSweetAlert[data-animation=slide-from-bottom] {
    -webkit-animation: slideToBottom 0.3s;
    animation: slideToBottom 0.3s
}

@-webkit-keyframes animateSuccessTip {
    0% {
        width: 0;
        left: 1px;
        top: 19px
    }

    54% {
        width: 0;
        left: 1px;
        top: 19px
    }

    70% {
        width: 50px;
        left: -8px;
        top: 37px
    }

    84% {
        width: 17px;
        left: 21px;
        top: 48px
    }

    100% {
        width: 25px;
        left: 14px;
        top: 45px
    }
}

@keyframes animateSuccessTip {
    0% {
        width: 0;
        left: 1px;
        top: 19px
    }

    54% {
        width: 0;
        left: 1px;
        top: 19px
    }

    70% {
        width: 50px;
        left: -8px;
        top: 37px
    }

    84% {
        width: 17px;
        left: 21px;
        top: 48px
    }

    100% {
        width: 25px;
        left: 14px;
        top: 45px
    }
}

@-webkit-keyframes animateSuccessLong {
    0% {
        width: 0;
        right: 46px;
        top: 54px
    }

    65% {
        width: 0;
        right: 46px;
        top: 54px
    }

    84% {
        width: 55px;
        right: 0px;
        top: 35px
    }

    100% {
        width: 47px;
        right: 8px;
        top: 38px
    }
}

@keyframes animateSuccessLong {
    0% {
        width: 0;
        right: 46px;
        top: 54px
    }

    65% {
        width: 0;
        right: 46px;
        top: 54px
    }

    84% {
        width: 55px;
        right: 0px;
        top: 35px
    }

    100% {
        width: 47px;
        right: 8px;
        top: 38px
    }
}

@-webkit-keyframes rotatePlaceholder {
    0% {
        transform: rotate(-45deg);
        -webkit-transform: rotate(-45deg)
    }

    5% {
        transform: rotate(-45deg);
        -webkit-transform: rotate(-45deg)
    }

    12% {
        transform: rotate(-405deg);
        -webkit-transform: rotate(-405deg)
    }

    100% {
        transform: rotate(-405deg);
        -webkit-transform: rotate(-405deg)
    }
}

@keyframes rotatePlaceholder {
    0% {
        transform: rotate(-45deg);
        -webkit-transform: rotate(-45deg)
    }

    5% {
        transform: rotate(-45deg);
        -webkit-transform: rotate(-45deg)
    }

    12% {
        transform: rotate(-405deg);
        -webkit-transform: rotate(-405deg)
    }

    100% {
        transform: rotate(-405deg);
        -webkit-transform: rotate(-405deg)
    }
}

.animateSuccessTip {
    -webkit-animation: animateSuccessTip 0.75s;
    animation: animateSuccessTip 0.75s
}

.animateSuccessLong {
    -webkit-animation: animateSuccessLong 0.75s;
    animation: animateSuccessLong 0.75s
}

.sa-icon.sa-success.animate::after {
    -webkit-animation: rotatePlaceholder 4.25s ease-in;
    animation: rotatePlaceholder 4.25s ease-in
}

@-webkit-keyframes animateErrorIcon {
    0% {
        transform: rotateX(100deg);
        -webkit-transform: rotateX(100deg);
        opacity: 0
    }

    100% {
        transform: rotateX(0deg);
        -webkit-transform: rotateX(0deg);
        opacity: 1
    }
}

@keyframes animateErrorIcon {
    0% {
        transform: rotateX(100deg);
        -webkit-transform: rotateX(100deg);
        opacity: 0
    }

    100% {
        transform: rotateX(0deg);
        -webkit-transform: rotateX(0deg);
        opacity: 1
    }
}

.animateErrorIcon {
    -webkit-animation: animateErrorIcon 0.5s;
    animation: animateErrorIcon 0.5s
}

@-webkit-keyframes animateXMark {
    0% {
        transform: scale(0.4);
        -webkit-transform: scale(0.4);
        margin-top: 26px;
        opacity: 0
    }

    50% {
        transform: scale(0.4);
        -webkit-transform: scale(0.4);
        margin-top: 26px;
        opacity: 0
    }

    80% {
        transform: scale(1.15);
        -webkit-transform: scale(1.15);
        margin-top: -6px
    }

    100% {
        transform: scale(1);
        -webkit-transform: scale(1);
        margin-top: 0;
        opacity: 1
    }
}

@keyframes animateXMark {
    0% {
        transform: scale(0.4);
        -webkit-transform: scale(0.4);
        margin-top: 26px;
        opacity: 0
    }

    50% {
        transform: scale(0.4);
        -webkit-transform: scale(0.4);
        margin-top: 26px;
        opacity: 0
    }

    80% {
        transform: scale(1.15);
        -webkit-transform: scale(1.15);
        margin-top: -6px
    }

    100% {
        transform: scale(1);
        -webkit-transform: scale(1);
        margin-top: 0;
        opacity: 1
    }
}

.animateXMark {
    -webkit-animation: animateXMark 0.5s;
    animation: animateXMark 0.5s
}

@-webkit-keyframes pulseWarning {
    0% {
        border-color: #F8D486
    }

    100% {
        border-color: #F8BB86
    }
}

@keyframes pulseWarning {
    0% {
        border-color: #F8D486
    }

    100% {
        border-color: #F8BB86
    }
}

.pulseWarning {
    -webkit-animation: pulseWarning 0.75s infinite alternate;
    animation: pulseWarning 0.75s infinite alternate
}

@-webkit-keyframes pulseWarningIns {
    0% {
        background-color: #F8D486
    }

    100% {
        background-color: #F8BB86
    }
}

@keyframes pulseWarningIns {
    0% {
        background-color: #F8D486
    }

    100% {
        background-color: #F8BB86
    }
}

.pulseWarningIns {
    -webkit-animation: pulseWarningIns 0.75s infinite alternate;
    animation: pulseWarningIns 0.75s infinite alternate
}

@-webkit-keyframes rotate-loading {
    0% {
        transform: rotate(0deg)
    }

    100% {
        transform: rotate(360deg)
    }
}

@keyframes rotate-loading {
    0% {
        transform: rotate(0deg)
    }

    100% {
        transform: rotate(360deg)
    }
}

.sweet-alert .sa-icon.sa-error .sa-line.sa-left {
    -ms-transform: rotate(45deg) \9
}

.sweet-alert .sa-icon.sa-error .sa-line.sa-right {
    -ms-transform: rotate(-45deg) \9
}

.sweet-alert .sa-icon.sa-success {
    border-color: transparent\9
}

.sweet-alert .sa-icon.sa-success .sa-line.sa-tip {
    -ms-transform: rotate(45deg) \9
}

.sweet-alert .sa-icon.sa-success .sa-line.sa-long {
    -ms-transform: rotate(-45deg) \9
}

/*!
 * Load Awesome v1.1.0 (http://github.danielcardoso.net/load-awesome/)
 * Copyright 2015 Daniel Cardoso <@DanielCardoso>
 * Licensed under MIT
 */
.la-ball-fall,
.la-ball-fall>div {
    position: relative;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.la-ball-fall {
    display: block;
    font-size: 0;
    color: #fff
}

.la-ball-fall.la-dark {
    color: #333
}

.la-ball-fall>div {
    display: inline-block;
    float: none;
    background-color: currentColor;
    border: 0 solid currentColor
}

.la-ball-fall {
    width: 54px;
    height: 18px
}

.la-ball-fall>div {
    width: 10px;
    height: 10px;
    margin: 4px;
    border-radius: 100%;
    opacity: 0;
    -webkit-animation: ball-fall 1s ease-in-out infinite;
    -moz-animation: ball-fall 1s ease-in-out infinite;
    -o-animation: ball-fall 1s ease-in-out infinite;
    animation: ball-fall 1s ease-in-out infinite
}

.la-ball-fall>div:nth-child(1) {
    -webkit-animation-delay: -200ms;
    -moz-animation-delay: -200ms;
    -o-animation-delay: -200ms;
    animation-delay: -200ms
}

.la-ball-fall>div:nth-child(2) {
    -webkit-animation-delay: -100ms;
    -moz-animation-delay: -100ms;
    -o-animation-delay: -100ms;
    animation-delay: -100ms
}

.la-ball-fall>div:nth-child(3) {
    -webkit-animation-delay: 0ms;
    -moz-animation-delay: 0ms;
    -o-animation-delay: 0ms;
    animation-delay: 0ms
}

.la-ball-fall.la-sm {
    width: 26px;
    height: 8px
}

.la-ball-fall.la-sm>div {
    width: 4px;
    height: 4px;
    margin: 2px
}

.la-ball-fall.la-2x {
    width: 108px;
    height: 36px
}

.la-ball-fall.la-2x>div {
    width: 20px;
    height: 20px;
    margin: 8px
}

.la-ball-fall.la-3x {
    width: 162px;
    height: 54px
}

.la-ball-fall.la-3x>div {
    width: 30px;
    height: 30px;
    margin: 12px
}

@-webkit-keyframes ball-fall {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-145%);
        transform: translateY(-145%)
    }

    10% {
        opacity: .5
    }

    20% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }

    80% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }

    90% {
        opacity: .5
    }

    100% {
        opacity: 0;
        -webkit-transform: translateY(145%);
        transform: translateY(145%)
    }
}

@-moz-keyframes ball-fall {
    0% {
        opacity: 0;
        -moz-transform: translateY(-145%);
        transform: translateY(-145%)
    }

    10% {
        opacity: .5
    }

    20% {
        opacity: 1;
        -moz-transform: translateY(0);
        transform: translateY(0)
    }

    80% {
        opacity: 1;
        -moz-transform: translateY(0);
        transform: translateY(0)
    }

    90% {
        opacity: .5
    }

    100% {
        opacity: 0;
        -moz-transform: translateY(145%);
        transform: translateY(145%)
    }
}

@-o-keyframes ball-fall {
    0% {
        opacity: 0;
        -o-transform: translateY(-145%);
        transform: translateY(-145%)
    }

    10% {
        opacity: .5
    }

    20% {
        opacity: 1;
        -o-transform: translateY(0);
        transform: translateY(0)
    }

    80% {
        opacity: 1;
        -o-transform: translateY(0);
        transform: translateY(0)
    }

    90% {
        opacity: .5
    }

    100% {
        opacity: 0;
        -o-transform: translateY(145%);
        transform: translateY(145%)
    }
}

@keyframes ball-fall {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-145%);
        -moz-transform: translateY(-145%);
        -o-transform: translateY(-145%);
        transform: translateY(-145%)
    }

    10% {
        opacity: .5
    }

    20% {
        opacity: 1;
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -o-transform: translateY(0);
        transform: translateY(0)
    }

    80% {
        opacity: 1;
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -o-transform: translateY(0);
        transform: translateY(0)
    }

    90% {
        opacity: .5
    }

    100% {
        opacity: 0;
        -webkit-transform: translateY(145%);
        -moz-transform: translateY(145%);
        -o-transform: translateY(145%);
        transform: translateY(145%)
    }
}

.bagde-box .flow-image-dummy {
    position: relative;
    width: 100%;
    height: 100%;
    padding: 0
}

.bagde-box .flow-image-dummy img {
    width: 100%;
    height: 100%
}

.user-box-title .user-job-photo img {
    max-width: 100%;
    max-height: 100%
}

.bagde-info p {
    font-size: 2.1rem;
    font-weight: bold;
    margin-bottom: 0
}

#withdrawn-reason {
    border: 1px solid #e67e22
}

body.page-online-interview-booking .olsem-list-table {
    width: 100%
}

body.page-online-interview-booking .olsem-list-table th {
    border-right: 1px solid #eee;
    padding: 0.7rem 1rem;
    vertical-align: middle;
    line-height: 1.5rem;
    background: #f3f3f3;
    text-align: center;
    color: #666;
    font-size: 90%
}

body.page-online-interview-booking .olsem-list-table td {
    line-height: 1.7rem
}

body.page-online-interview-booking .form-control-s {
    height: 30px;
    padding: 4px 8px;
    margin: 3px 0;
    font-size: 100%;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px
}

body.page-online-interview-booking .txt-bold {
    font-weight: bold
}

body.page-online-interview-booking .txt-sml {
    font-size: 80% !important
}

body.page-online-interview-booking .txt-left {
    text-align: left !important
}

body.page-online-interview-booking .button1 {
    color: #fff;
    margin: 0;
    display: inline-block;
    cursor: pointer;
    width: 100%
}

body.page-online-interview-booking .button1.disabled {
    cursor: not-allowed
}

body.page-online-interview-booking .button1 a {
    color: #fff;
    font-size: 90%;
    font-weight: 400;
    display: inline-block;
    text-align: center;
    text-decoration: none;
    border-radius: 5px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 7px 7px;
    width: 100%
}

body.page-online-interview-booking .button-1 {
    background-color: #21bf73;
    white-space: nowrap
}

body.page-online-interview-booking .button-1:hover {
    background-color: #40bad5;
    color: #fff;
    transition: 0.3s
}

body.page-online-interview-booking .button-reserved {
    background-color: #f30514;
    white-space: nowrap
}

body.page-online-interview-booking .button-expired {
    background-color: #bbb;
    white-space: nowrap
}

body.online-interview-history .online-interview-line {
    margin-top: 0px !important
}

body.online-interview-history .online-interview-icon {
    background: url(/assets/icon-oli-58a0ad6a66d6203817fd59bdd1463e838ee6ebccccf8ab8333320e52830d9069.png) center 36% no-repeat #F5F9FA !important
}

body.online-interview-history div.button-online-interview .button-cancel {
    margin-top: 5px
}

body.online-interview-history .video-pattern {
    margin-bottom: 15px !important
}

body.page-mypage div.user-select-box #event-applied {
    width: 60%
}

.toast-title {
    font-weight: bold
}

.toast-message {
    -ms-word-wrap: break-word;
    word-wrap: break-word
}

.toast-message a,
.toast-message label {
    color: #ffffff
}

.toast-message a:hover {
    color: #cccccc;
    text-decoration: none
}

.toast-close-button {
    position: relative;
    right: -0.3em;
    top: -0.3em;
    float: right;
    font-size: 20px;
    font-weight: bold;
    color: #ffffff;
    -webkit-text-shadow: 0 1px 0 #ffffff;
    text-shadow: 0 1px 0 #ffffff;
    opacity: 0.8;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
    filter: alpha(opacity=80)
}

.toast-close-button:hover,
.toast-close-button:focus {
    color: #000000;
    text-decoration: none;
    cursor: pointer;
    opacity: 0.4;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
    filter: alpha(opacity=40)
}

button.toast-close-button {
    padding: 0;
    cursor: pointer;
    background: transparent;
    border: 0;
    -webkit-appearance: none
}

.toast-top-full-width {
    top: 0;
    right: 0;
    width: 100%
}

.toast-bottom-full-width {
    bottom: 0;
    right: 0;
    width: 100%
}

.toast-top-left {
    top: 12px;
    left: 12px
}

.toast-top-center {
    top: 12px
}

.toast-top-right {
    top: 12px;
    right: 12px
}

.toast-bottom-right {
    right: 12px;
    bottom: 12px
}

.toast-bottom-center {
    bottom: 12px
}

.toast-bottom-left {
    bottom: 12px;
    left: 12px
}

.toast-center {
    top: 45%
}

#toast-container {
    position: fixed;
    z-index: 999999
}

#toast-container.toast-center,
#toast-container.toast-top-center,
#toast-container.toast-bottom-center {
    width: 100%;
    pointer-events: none
}

#toast-container.toast-center>div,
#toast-container.toast-top-center>div,
#toast-container.toast-bottom-center>div {
    margin: auto;
    pointer-events: auto
}

#toast-container.toast-center>button,
#toast-container.toast-top-center>button,
#toast-container.toast-bottom-center>button {
    pointer-events: auto
}

#toast-container * {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

#toast-container>div {
    margin: 0 0 6px;
    padding: 15px 15px 15px 50px;
    width: 300px;
    -moz-border-radius: 3px 3px 3px 3px;
    -webkit-border-radius: 3px 3px 3px 3px;
    border-radius: 3px 3px 3px 3px;
    background-position: 15px center;
    background-repeat: no-repeat;
    -moz-box-shadow: 0 0 12px #999999;
    -webkit-box-shadow: 0 0 12px #999999;
    box-shadow: 0 0 12px #999999;
    color: #ffffff;
    opacity: 0.8;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
    filter: alpha(opacity=80)
}

#toast-container>:hover {
    -moz-box-shadow: 0 0 12px #000000;
    -webkit-box-shadow: 0 0 12px #000000;
    box-shadow: 0 0 12px #000000;
    opacity: 1;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
    filter: alpha(opacity=100);
    cursor: pointer
}

#toast-container>.toast-info {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGwSURBVEhLtZa9SgNBEMc9sUxxRcoUKSzSWIhXpFMhhYWFhaBg4yPYiWCXZxBLERsLRS3EQkEfwCKdjWJAwSKCgoKCcudv4O5YLrt7EzgXhiU3/4+b2ckmwVjJSpKkQ6wAi4gwhT+z3wRBcEz0yjSseUTrcRyfsHsXmD0AmbHOC9Ii8VImnuXBPglHpQ5wwSVM7sNnTG7Za4JwDdCjxyAiH3nyA2mtaTJufiDZ5dCaqlItILh1NHatfN5skvjx9Z38m69CgzuXmZgVrPIGE763Jx9qKsRozWYw6xOHdER+nn2KkO+Bb+UV5CBN6WC6QtBgbRVozrahAbmm6HtUsgtPC19tFdxXZYBOfkbmFJ1VaHA1VAHjd0pp70oTZzvR+EVrx2Ygfdsq6eu55BHYR8hlcki+n+kERUFG8BrA0BwjeAv2M8WLQBtcy+SD6fNsmnB3AlBLrgTtVW1c2QN4bVWLATaIS60J2Du5y1TiJgjSBvFVZgTmwCU+dAZFoPxGEEs8nyHC9Bwe2GvEJv2WXZb0vjdyFT4Cxk3e/kIqlOGoVLwwPevpYHT+00T+hWwXDf4AJAOUqWcDhbwAAAAASUVORK5CYII=") !important
}

#toast-container>.toast-wait {
    background-image: url("data:image/gif;base64,R0lGODlhIAAgAIQAAAQCBISGhMzKzERCROTm5CQiJKyurHx+fPz+/ExOTOzu7Dw+PIyOjCwqLFRWVAwKDIyKjMzOzOzq7CQmJLy6vFRSVPTy9AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH/C05FVFNDQVBFMi4wAwEAAAAh+QQJCQAXACwAAAAAIAAgAAAF3eAljmRpnmh6VRSVqLDpIDTixOdUlFSNUDhSQUAT7ES9GnD0SFQAKWItMqr4bqKHVPDI+WiTkaOFFVlrFe83rDrT0qeIjwrT0iLdU0GOiBxhAA4VeSk6QYeIOAsQEAuJKgw+EI8nA18IA48JBAQvFxCXDI8SNAQikV+iiaQIpheWX5mJmxKeF6g0qpQmA4yOu8C7EwYWCgZswRcTFj4KyMAGlwYxDwcHhCXMXxYxBzQHKNo+3DDeCOAn0V/TddbYJA0K48gAEAFQicMWFsfwNA3JSgAIAAFfwIMIL4QAACH5BAkJABoALAAAAAAgACAAhAQCBIyKjERCRMzOzCQiJPTy9DQyNGRmZMTCxOTm5CwqLHx+fBQWFJyenNTW1Pz6/Dw6PGxubAwKDIyOjNTS1CQmJCwuLPz+/Dw+PHRydAAAAAAAAAAAAAAAAAAAAAAAAAXboCaOZGmeaKoxWcSosMkk15W8cZ7VdZaXkcEgQtrxfD9RhHchima1GwlCGUBSFCaFxMrgRtnLFhWujWHhs2nJc8KoVlWGQnEn7/i8XgOwWAB7JwoONQ4KgSQAZRcOgHgSCwsSIhZMNRZ5CzULIgaWF5h4mhecfIQ8jXmQkiODhYeIiRYGjrG2PxgBARi3IhNMAbcCnwI5BAQpAZ8TIwK6vCQVDwUVKL+WzAANTA210g/VJ8OWxQefByQE4dZMzBoInwh4zrtgn2p725YNthUFTNRuGYB3AYGBHCEAACH5BAkJAB0ALAAAAAAgACAAhAQCBISChFRWVMzKzCQiJOTm5GxqbCwuLJSWlPz6/NTW1AwODJSSlGRmZCwqLOzu7HR2dDQ2NAQGBISGhFxaXNTS1CQmJOzq7GxubDQyNKSmpPz+/Nza3AAAAAAAAAAAAAXfYCeOZGmeaKqurHBdAiuP17Zdc0lMAVHWt9yI8LA9fCPB4xEjARoNSWpis01kBpshFahurqzsZosiGpErScMAUO0maKF8Tq/bTQCIQgFp30cQXhB1BHEcXhx0FgkJFiOHVYlzi42AgoRxeRx8fn+en3UABwedKgsBAwMBCygOCjYKDisLFV4VrCUAtVUKpSZdXl8mB8EbByQWcQPFAyYZxccdB7sV0cvBzbmvvG0LBV4FrFTBYCWuNhyyHRTFFB20trh4BxmdYl4YIqepq0IRxRE+IfDCAFQHARo0NGERAgAh+QQJCQAgACwAAAAAIAAgAIUEAgSEgoRMTkzMyswcHhzk5uR0cnQUFhRcXlwsKiz09vQMCgyMiozU1tQkJiR8fnxkZmT8/vwEBgSEhoRcWlzU0tQkIiT08vR0dnQcGhxkYmQ0MjT8+vwMDgyMjozc2twAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAG+UCQcEgsGo/IpHLJXDweC6Z0+IhEHlOjRGIMWLHZoUZx0RQlAajxkFFKFFYFl5m5KNpIySU+X2bIBEoQZBBZGQdMElFhjI2Oj5AgHQEDAw8dQxYeDBaNHRVWVhWYCXsRFwmMXqFWEyAerB6MA6xWA6+xs7URt6VWqIwTu64gDh4eDp6goaORQ5OVAZjO1EgEGhB4RwAYDQ0YAEwIcBEKFEgYrBhLBORxgUYfrB9LELuF8fNDAAaVBuEg7NXCVyRdqHVCGLBiIIQAB1Yc4BXh9uEbwAXuyi2iQI7DuSwHdiFqCEGDtizLRFUDsaGAlQIbVoJYIEDAIiZBAAAh+QQJCQAbACwAAAAAIAAgAIQEAgSMioxcWlz08vQcHhysqqwMDgx8enwsKiykoqRkZmT8+vzEwsQMCgyUlpQkJiS0srQEBgSMjoxcXlz09vQkIiSsrqwUEhQ0MjRsamz8/vwAAAAAAAAAAAAAAAAAAAAF7+AmjmRpnmiqruz2PG0sIssCj4CQJAIgj4/abRNJaI6agu9kCAQaphdJgEQKUIFjgGWsahJYLdf7RTWfLKr3+jsBClVlG5Xb9eb4fImgUBBKDVB4ExRHFGwbGRQLGXMEhUgUfw2QC4IyCmSNDQtHlm2ZXgoiGQsUjW0EnUgLfyKBeYSeiHojfH61uS0GBisVEgEVLRcWRxAXKAgDRwMILMVIECgSVRIrBmS9JtRI1iMVBweuGxerSNolyszOIhjLGs0jEFXSKA8SEkMbcEgWIxfzNBxrw6AKgxIGkM05UOWALhERHJhysOThBgAVWYQAACH5BAkJABkALAAAAAAgACAAhAQGBIyKjERCRMzOzCwuLGRiZPz6/OTm5AwODLSytFRSVNTW1Dw6PHx6fAwKDJSSlERGRNTS1DQyNGxqbPz+/BQSFLy6vFRWVNza3AAAAAAAAAAAAAAAAAAAAAAAAAAAAAXqYCaO5FgFwxBUZeu61ULNFMa+eBvQdJD/owFvFhkBBAwHsBQZUooZyWF2YOQkBNJu6ANMaQeli0AxSEwymi0DcUJeEgPlbEJFAghRe/h+Eeg/Dl9UYks5DF9VhksOAgKFi5GSSwh5kzgVCXIJNxknD5aSCTwJIw8zD5MITpanFKmSCHI8NxUPoJejNKWXLZkznL0vCJ3CxsckDpA/ChYJFzkTBgYTSxc80C4OswbLLhY8Fi/bMwYAJVgl4DTiL9LUJADrFuci1zTZLwD1IwU8BSQuWLCQb1EDHg2QiSDALYvCDAISJLDy8FIIACH5BAkJAB4ALAAAAAAgACAAhAQGBISGhFRSVNTW1CQiJKyqrGRmZOzu7CwuLIyOjGxubPz6/BQSFGRiZOTi5CwqLLy6vDQ2NIyKjFRWVCQmJKyurGxqbPT29DQyNJSSlHRydPz+/BQWFOzq7AAAAAAAAAXhoCeOJElYClGubOs117YtjWuvxCLLi3qbhc6h4FPsdorfiNI5dige43GT9AAkHUcCwCpMNxVP7tgTJY4J1uF7EBl0M8Ooueuo2SOCIkVa11kVX2E2EmgsFH4yBz4uAAkdHVstBAUHQ4xKmZqbnJ2bAhAQAiURGJ4eE0cTIxgzpp0QRxCsrp6xO7MjpaepO6unKxOhv8DFxsfIJBwaChw2DAkZDEocDjIOzi0ZMhlKUjIaLtsb3T8aR+EtDBkJ0yQUBQVQI9XX2ZsDMgMlyxr3mzE2XEgmotCGAARFIHiQ0FMIACH5BAkJABgALAAAAAAgACAAhAQCBISGhDw+POTi5CwuLLS2tPTy9BQSFJyenGRiZDQ2NIyOjLy+vPz6/BweHIyKjFRSVOzq7DQyNLy6vBQWFHRydDw6PPz+/AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAXXICaOZHkcZaquIjVd10SxtFrAcFGrVhBYIwoON9uNAsOA6DCEFTEKBEKxEjQvAtELNxkpGrAGNfW4Plpb2QgxRKjKzfPoVGLj3CnLNUv7hscpSDhKOxJSgDwPP0ZGAACMjAQFDQYFBJA0BAZDBpeYGBQVFUU3TV2YFAMwAzNgTQ2PkBVDFRiuQ7CYszi1pUOnkKmrM5qcnqiiTwQTDQ2Wn9DR0tPUfRKQEBEREDQSFw3XRhEwEd3f4TvjF+XWKgJ8JNnb0QkwCdUlCzAL+CQODAwc9BtIMAQAOw==") !important
}

#toast-container>.toast-error {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAHOSURBVEhLrZa/SgNBEMZzh0WKCClSCKaIYOED+AAKeQQLG8HWztLCImBrYadgIdY+gIKNYkBFSwu7CAoqCgkkoGBI/E28PdbLZmeDLgzZzcx83/zZ2SSXC1j9fr+I1Hq93g2yxH4iwM1vkoBWAdxCmpzTxfkN2RcyZNaHFIkSo10+8kgxkXIURV5HGxTmFuc75B2RfQkpxHG8aAgaAFa0tAHqYFfQ7Iwe2yhODk8+J4C7yAoRTWI3w/4klGRgR4lO7Rpn9+gvMyWp+uxFh8+H+ARlgN1nJuJuQAYvNkEnwGFck18Er4q3egEc/oO+mhLdKgRyhdNFiacC0rlOCbhNVz4H9FnAYgDBvU3QIioZlJFLJtsoHYRDfiZoUyIxqCtRpVlANq0EU4dApjrtgezPFad5S19Wgjkc0hNVnuF4HjVA6C7QrSIbylB+oZe3aHgBsqlNqKYH48jXyJKMuAbiyVJ8KzaB3eRc0pg9VwQ4niFryI68qiOi3AbjwdsfnAtk0bCjTLJKr6mrD9g8iq/S/B81hguOMlQTnVyG40wAcjnmgsCNESDrjme7wfftP4P7SP4N3CJZdvzoNyGq2c/HWOXJGsvVg+RA/k2MC/wN6I2YA2Pt8GkAAAAASUVORK5CYII=") !important
}

#toast-container>.toast-success {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAADsSURBVEhLY2AYBfQMgf///3P8+/evAIgvA/FsIF+BavYDDWMBGroaSMMBiE8VC7AZDrIFaMFnii3AZTjUgsUUWUDA8OdAH6iQbQEhw4HyGsPEcKBXBIC4ARhex4G4BsjmweU1soIFaGg/WtoFZRIZdEvIMhxkCCjXIVsATV6gFGACs4Rsw0EGgIIH3QJYJgHSARQZDrWAB+jawzgs+Q2UO49D7jnRSRGoEFRILcdmEMWGI0cm0JJ2QpYA1RDvcmzJEWhABhD/pqrL0S0CWuABKgnRki9lLseS7g2AlqwHWQSKH4oKLrILpRGhEQCw2LiRUIa4lwAAAABJRU5ErkJggg==") !important
}

#toast-container>.toast-warning {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGYSURBVEhL5ZSvTsNQFMbXZGICMYGYmJhAQIJAICYQPAACiSDB8AiICQQJT4CqQEwgJvYASAQCiZiYmJhAIBATCARJy+9rTsldd8sKu1M0+dLb057v6/lbq/2rK0mS/TRNj9cWNAKPYIJII7gIxCcQ51cvqID+GIEX8ASG4B1bK5gIZFeQfoJdEXOfgX4QAQg7kH2A65yQ87lyxb27sggkAzAuFhbbg1K2kgCkB1bVwyIR9m2L7PRPIhDUIXgGtyKw575yz3lTNs6X4JXnjV+LKM/m3MydnTbtOKIjtz6VhCBq4vSm3ncdrD2lk0VgUXSVKjVDJXJzijW1RQdsU7F77He8u68koNZTz8Oz5yGa6J3H3lZ0xYgXBK2QymlWWA+RWnYhskLBv2vmE+hBMCtbA7KX5drWyRT/2JsqZ2IvfB9Y4bWDNMFbJRFmC9E74SoS0CqulwjkC0+5bpcV1CZ8NMej4pjy0U+doDQsGyo1hzVJttIjhQ7GnBtRFN1UarUlH8F3xict+HY07rEzoUGPlWcjRFRr4/gChZgc3ZL2d8oAAAAASUVORK5CYII=") !important
}

#toast-container.toast-top-full-width>div,
#toast-container.toast-bottom-full-width>div {
    width: 96%;
    margin: auto
}

.toast {
    background-color: #030303
}

.toast-success {
    background-color: #51a351
}

.toast-error {
    background-color: #bd362f
}

.toast-info,
.toast-wait {
    background-color: #2f96b4
}

.toast-warning {
    background-color: #f89406
}

@media all and (max-width: 240px) {
    #toast-container>div {
        padding: 8px 8px 8px 50px;
        width: 11em
    }

    #toast-container .toast-close-button {
        right: -0.2em;
        top: -0.2em
    }
}

@media all and (min-width: 241px) and (max-width: 480px) {
    #toast-container>div {
        padding: 8px 8px 8px 50px;
        width: 18em
    }

    #toast-container .toast-close-button {
        right: -0.2em;
        top: -0.2em
    }
}

@media all and (min-width: 481px) and (max-width: 768px) {
    #toast-container>div {
        padding: 15px 15px 15px 50px;
        width: 25em
    }
}

#toast-container:not(.no-enter)>div.ng-enter,
#toast-container:not(.no-leave)>div.ng-leave {
    -webkit-transition: 1000ms cubic-bezier(0.25, 0.25, 0.75, 0.75) all;
    -moz-transition: 1000ms cubic-bezier(0.25, 0.25, 0.75, 0.75) all;
    -ms-transition: 1000ms cubic-bezier(0.25, 0.25, 0.75, 0.75) all;
    -o-transition: 1000ms cubic-bezier(0.25, 0.25, 0.75, 0.75) all;
    transition: 1000ms cubic-bezier(0.25, 0.25, 0.75, 0.75) all
}

#toast-container:not(.no-enter)>div.ng-enter.ng-enter-active {
    opacity: 0.8
}

#toast-container:not(.no-leave)>div.ng-leave {
    opacity: 0.8
}

#toast-container:not(.no-leave)>div.ng-leave.ng-leave-active {
    opacity: 0
}

#toast-container:not(.no-enter)>div.ng-enter {
    opacity: 0
}