@charset "UTF-8";
/* ! ---------- initial ---------- ---------- ---------- ---------- */
/* ---------- setting ---------- ---------- */
/* ! ---------- area ---------- ---------- ---------- ---------- */
/* リセットCSS */
html, body { width: 100%; height: 100%; }

body, h1, h2, h3, h4, h5, h6, p, ol, ul, li, blockquote, pre, a, div { margin: 0; padding: 0; font-size: 100%; line-height: inherit; box-sizing: border-box; }

body { -webkit-text-size-adjust: 100%; line-height: 1; }

ol, ul { list-style: none; }

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

th, td { vertical-align: top; text-align: left; font-weight: normal; }

img { border: 0; vertical-align: bottom; }

a { text-decoration: none; }

body { font-family: "Noto Sans JP", "游ゴシック", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif; color: #323232; color: #5a5a5a; }

main { display: block; }

main p { margin-bottom: 1em; line-height: 1.8; }

main p.is-no-margin { margin-bottom: 0; }

/* ----------------------------------------------------------
.area-wrapper
---------------------------------------------------------- */
.area-wrapper { position: relative; overflow-x: hidden; }

body.page-index .area-wrapper, body.page-atfirst-introduction .area-wrapper { margin-top: 0px; }

body.page-atfirst-introduction { background: #000; }

/* ----------------------------------------------------------
.area-inner
---------------------------------------------------------- */
.area-inner { position: relative; }

/* ----------------------------------------------------------
.block-inner
---------------------------------------------------------- */

/* ----------------------------------------------------------
area-body
---------------------------------------------------------- */
.area-footer { margin-top: 100px; background: #000; background: url(/recruit/images/index/mv/rect.png) left top no-repeat; background-size: 100% 100%; padding: 20px; text-align: center; }

.area-footer small { font-size: 14px; color: #fff; }

/* ----------------------------------------------------------
.btn-pagetop
---------------------------------------------------------- */
.btn-pagetop { position: fixed; display: block; bottom: 20px; right: 20px; width: 40px; height: 40px; background: #000; color: #fff; text-align: center; cursor: pointer; border-radius: 50%; opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; transition-duration: 0.2s; transition-property: opacity; visibility: hidden; }

.btn-pagetop:after { content: ""; position: absolute; top: 18px; left: 10px; width: 12px; height: 1px; background: #fff; -ms-transform: rotate(-45deg); transform: rotate(-45deg); }

.btn-pagetop:before { content: ""; position: absolute; top: 18px; right: 10px; width: 12px; height: 1px; background: #fff; -ms-transform: rotate(45deg); transform: rotate(45deg); }

.btn-pagetop.js-show { opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; visibility: visible; }

.btn-pagetop.js-show:hover { opacity: 0.6; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; }

.btn-pagetop.js-fixed { top: -60px; bottom: auto; position: absolute; }

/* ----------------------------------------------------------
.area-modal
---------------------------------------------------------- */
.area-modal { visibility: hidden; opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; transition-duration: 0.2s; position: fixed; top: 0px; left: 0px; right: 0px; bottom: 0px; z-index: 1000; }

.area-modal.js-show { visibility: visible; opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; }

.area-modal ._modal-bg { position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; background: rgba(0, 0, 0, 0.85); }

.area-modal ._modal-btn-close { position: absolute; cursor: pointer; border-radius: 50%; z-index: 10; transition-duration: 0.2s; }

.area-modal ._modal-btn-close:hover { opacity: 0.8; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; }

.area-modal ._modal-btn-close:after, .area-modal ._modal-btn-close:before { content: ""; position: absolute; top: 18px; left: 8px; width: 25px; height: 4px; -ms-transform: rotate(-45deg); transform: rotate(-45deg); }

.area-modal ._modal-btn-close:before { -ms-transform: rotate(45deg); transform: rotate(45deg); }

.area-modal ._modal-box { position: absolute; background: #fff; box-sizing: border-box; border-radius: 5px; }

.area-modal ._modal-box ._modal-head { position: absolute; top: 0px; left: 0px; right: 0px; padding: 15px 0 0 20px; height: 50px; background: #eee; box-sizing: border-box; }

.area-modal ._modal-box ._modal-body { position: absolute; top: 50px; bottom: 50px; left: 0px; right: 0px; padding: 20px; background: #ccc; box-sizing: border-box; overflow-y: scroll; }

.area-modal ._modal-box ._modal-body ._t1 { font-size: 18px; line-height: 1.2; font-weight: bold; }

.area-modal ._modal-box ._modal-body ._t2 { font-size: 14px; line-height: 1.8; }

.area-modal ._modal-box ._modal-body ._t3 { font-size: 12px; line-height: 1.8; }

.area-modal ._modal-box ._modal-foot { position: absolute; bottom: 0px; left: 0px; right: 0px; padding: 7px 0 0 0; height: 50px; background: #eee; box-sizing: border-box; }

.area-modal ._modal-box ._modal-foot ._btn-do { display: block; box-sizing: border-box; text-align: center; cursor: pointer; width: 200px; margin: 0 auto; padding: 5px 0; font-size: 14px; background: #666; color: #fff; }

.area-modal ._modal-box ._modal-foot ._btn-do:hover { background: #333; }

@media screen and (min-width: 768px){
 main{ font-size: 16px; } }

@media screen and (max-width: 767px){
 main{ font-size: 12px; }
 main img{ max-width: 100%; }
 .block-inner-sp{ padding-right: 15px; padding-left: 15px; }
 /* ----------------------------------------------------------
.area-header
---------------------------------------------------------- */
 .area-header-wap{ height: 50px; }
 .area-header{ position: fixed; top: 0px; left: 0px; right: 0px; z-index: 100; height: 50px; background: #fff; transition-duration: 0.2s; box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.05); }
 body.js-gmenu-active .area-header{ box-shadow: none; background: transparent; }
 .area-header img{ width: 100%; }
 .area-header ._logo{ position: absolute; top: 15px; left: 15px; width: 120px; }
 .area-header ._name{ position: absolute; top: 20px; left: 160px; font-size: 10px; font-weight: bold; color: #323232; }
 .area-header-side{ display: none; }
 .mod-gmenu-btn{ position: absolute; top: 0; right: 0; width: 50px; height: 50px; transition-duration: 0.2s; }
 .mod-gmenu-btn span{ transition-duration: 0.2s; position: absolute; background: #000; height: 2px; left: 5px; right: 10px; }
 .mod-gmenu-btn span:nth-child(1){ top: 15px; }
 .mod-gmenu-btn span:nth-child(2){ top: 24px; left: 17px; }
 .mod-gmenu-btn span:nth-child(3){ bottom: 15px; left: 29px; }
 body.js-gmenu-active .mod-gmenu-btn span:nth-child(1){ position: absolute; top: 25px; left: 10px; -ms-transform: rotate(25deg); transform: rotate(25deg); }
 body.js-gmenu-active .mod-gmenu-btn span:nth-child(2){ display: none; }
 body.js-gmenu-active .mod-gmenu-btn span:nth-child(3){ position: absolute; top: 25px; left: 10px; -ms-transform: rotate(-25deg); transform: rotate(-25deg); }
 /* ----------------------------------------------------------
area-mega-menu
---------------------------------------------------------- */
 .area-modal-menu{ position: fixed; z-index: -1; visibility: hidden; opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; transition-duration: 0.4s; -ms-transform: translate(0, -200px); transform: translate(0, -200px); background: #fff; top: 0px; left: 0px; right: 0px; bottom: 0px; min-height: 140px; padding: 70px 20px 40px 20px; box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.05); overflow-y: scroll; -webkit-overflow-scrolling: touch; background: url(/recruit/common/images/bg.png) left top no-repeat; background-size: 100% 100%; }
 .area-modal-menu ._logo{ position: absolute; top: 35px; left: 35px; width: 120px; }
 .area-modal-menu ._logo img{ width: 100%; }
 .area-modal-menu ._name{ position: absolute; top: 40px; left: 180px; font-size: 10px; font-weight: bold; color: #323232; }
 .area-modal-menu .mod-gmenu-btn{ top: 15px; right: 25px; }
 body.js-gmenu-active .area-modal-menu{ visibility: visible; z-index: 150; opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; -ms-transform: translate(0, 0); transform: translate(0, 0); }
 .area-modal-menu:before{ content: ""; display: block; position: absolute; top: 15px; left: 15px; right: 15px; bottom: 15px; background: #fff; }
 .area-modal-menu a{ color: #333; }
 .area-modal-menu a.is-under{ color: #ccc; }
 .area-modal-menu a.is-under:before{ background: #ccc; }
 .area-modal-menu .area-inner{ padding: 20px; }
 .area-modal-menu .site-links{ opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; transition-duration: 0.4s; transition-delay: 0.4s; }
 body.js-gmenu-active .area-modal-menu .site-links{ opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; }
 .area-modal-menu .site-links ._cols{ display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; text-align: left; }
 .area-modal-menu .site-links ._cols ._col{ -ms-flex: 1; flex: 1; position: relative; }
 .area-modal-menu .site-links ._btns{ position: absolute; left: 0px; bottom: 0px; }
 .area-modal-menu .site-links ._btns ._btn{ display: block; background: #000; margin-top: 5px; width: 126px; height: 35px; color: #fff; font-size: 10px; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; text-align: center; }
 .area-modal-menu .site-links ._btns ._btn.is-entry{ background: #FCC800; }
 .area-modal-menu .site-links ._btns ._btn.is-contact{ background: #323232; }
 .area-modal-menu .site-links ._title{ font-size: 12px; letter-spacing: 0.05em; font-weight: bold; }
 .area-modal-menu .site-links ._title span{ display: block; }
 .area-modal-menu .site-links ._title span:nth-child(1){ font-size: 10px; color: #61A0DA; }
 .area-modal-menu .site-links ._title span:nth-child(2){ margin-top: 2px; font-size: 14px; letter-spacing: 0.1em; color: #5A5A5A; }
 .area-modal-menu .site-links ._links + ._title{ margin-top: 30px; }
 .area-modal-menu .site-links ._links{ margin: 15px 0 0 10px; }
 .area-modal-menu .site-links ._links li{ line-height: 1.4; }
 .area-modal-menu .site-links ._links a{ display: block; position: relative; padding: 2px 0 2px 0; font-size: 10px; font-weight: bold; color: #5A5A5A; }
 .area-modal-menu ._btns-sp{ margin-top: 40px; }
 .area-modal-menu ._btns-sp ._btn{ display: block; background: #000; width: 200px; margin: 0 auto; margin-top: 10px; height: 50px; color: #fff; font-size: 16px; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; text-align: center; }
 .area-modal-menu ._btns-sp ._btn.is-entry{ background: #FCC800; }
 .area-modal-menu ._btns-sp ._btn.is-contact{ background: #323232; }
 .area-modal ._modal-btn-close{ top: 5px; right: 5px; width: 40px; height: 40px; }
 .area-modal ._modal-btn-close:after, .area-modal ._modal-btn-close:before{ background: #000; }
 .area-modal ._modal-box{ top: 10px; left: 10px; bottom: 10px; right: 10px; width: auto; height: auto; margin: 0; } }

@media print, screen and (min-width: 768px){
 .area-wrapper{ margin-top: 100px; }
 .area-inner{ margin: 0 auto; width: 1080px; }
 .block-inner{ margin: 0 auto; width: 1080px; }
 .block-inner2{ margin: 0 auto; width: 900px; }
 /* ----------------------------------------------------------
.area-header
---------------------------------------------------------- */
 .area-header{ position: fixed; top: 0px; left: 0px; right: 0px; z-index: 100; height: 100px; transition-duration: 0.4s; }
 body.js-menu-scrolled1 .area-header{ background: rgba(255, 255, 255, 0.9); box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.05); }
 body.js-menu-scrolled2.js-gmenu-active .area-header{ background: transparent; box-shadow: none; }
 body.js-menu-scrolled2.js-menu-hide .area-header{ -ms-transform: translate(0, -100px); transform: translate(0, -100px); }
 body.page-atfirst-introduction.js-menu-scrolled1 .area-header{ background: rgba(255, 255, 255, 0); }
 body.page-atfirst-introduction.js-gmenu-active .area-header ._bg{ display: none; }
 body.page-atfirst-introduction .area-header ._bg{ position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; }
 body.page-atfirst-introduction .area-header ._bg:before{ content: ""; position: absolute; top: 0px; left: 0px; bottom: 0; width: 400px; background: #fff; }
 body.page-atfirst-introduction .area-header ._bg:after{ content: ""; display: block; position: absolute; top: 0px; right: 0px; bottom: 0; width: 140px; background: #fff; }
 .area-header img{ width: 100%; }
 .area-header ._logo{ position: absolute; top: 30px; left: 35px; width: 170px; }
 .area-header ._name{ position: absolute; top: 30px; left: 250px; font-size: 12px; line-height: 35px; font-weight: bold; color: #323232; }
 .mod-gmenu-btn{ position: absolute; top: 22px; right: 40px; width: 60px; height: 60px; }
 .mod-gmenu-btn span{ transition-duration: 0.2s; position: absolute; background: #5A5A5A; background: #fcc800; height: 3px; left: 5px; right: 5px; }
 .mod-gmenu-btn span:nth-child(1){ top: 15px; }
 .mod-gmenu-btn span:nth-child(2){ top: 29px; left: 25px; }
 .mod-gmenu-btn span:nth-child(3){ bottom: 15px; left: 37px; }
 body.js-gmenu-active .mod-gmenu-btn span:nth-child(1){ position: absolute; top: 30px; left: 5px; -ms-transform: rotate(25deg); transform: rotate(25deg); }
 body.js-gmenu-active .mod-gmenu-btn span:nth-child(2){ display: none; }
 body.js-gmenu-active .mod-gmenu-btn span:nth-child(3){ position: absolute; top: 30px; left: 5px; -ms-transform: rotate(-25deg); transform: rotate(-25deg); }
 .area-header-side{ position: fixed; top: 50%; right: 0px; -ms-transform: translate(0, -50%); transform: translate(0, -50%); display: -ms-flexbox; display: flex; z-index: 40; }
 .area-header-side ._btn{ width: 60px; height: 180px; background: #000; color: #fff; font-size: 20px; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; text-align: center; cursor: pointer; transition-duration: 0.2s; }
 .area-header-side ._btn span{ -ms-transform: rotate(180deg); transform: rotate(180deg); letter-spacing: 0.1em; -ms-writing-mode: tb-lr; writing-mode: vertical-lr; }
 .area-header-side ._btn.is-entry{ background: #FCC800; }
 .area-header-side ._btn:hover{ opacity: 0.8; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; }
 /* ----------------------------------------------------------
area-mega-menu
---------------------------------------------------------- */
 .area-modal-menu-bg{ position: fixed; top: 0px; left: 0px; right: 0px; height: 0px; z-index: 120; transition-duration: 0.2s; background: url(/recruit/common/images/bg.png) left top no-repeat; background-size: 100% 100%; transition-delay: 0.2s; }
 body.js-gmenu-active .area-modal-menu-bg{ transition-delay: 0s; height: 100%; }
 .area-modal-menu{ position: fixed; visibility: hidden; opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; transition-duration: 0.4s; -ms-transform: scale(1.05); transform: scale(1.05); top: 0px; left: 0px; right: 0px; bottom: 0px; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; text-align: center; }
 .area-modal-menu img{ max-width: 100%; }
 .area-modal-menu ._logo{ position: absolute; top: 60px; left: 65px; width: 170px; }
 .area-modal-menu ._name{ position: absolute; top: 70px; left: 250px; font-size: 12px; font-weight: bold; }
 body.js-gmenu-active .area-modal-menu{ transition-delay: 0.4s; visibility: visible; z-index: 150; opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; -ms-transform: scale(1); transform: scale(1); }
 .area-modal-menu:before{ content: ""; display: block; position: absolute; top: 30px; left: 30px; right: 30px; bottom: 30px; background: #fff; }
 .area-modal-menu a{ color: #333; transition-duration: 0.4s; }
 .area-modal-menu a:hover{ color: #61a0da; }
 .area-modal-menu a.is-under{ color: #ccc; }
 .area-modal-menu a.is-under:before{ background: #ccc; }
 .area-modal-menu .site-links{ opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; transition-duration: 0.4s; transition-delay: 0.4s; }
 body.js-gmenu-active .area-modal-menu .site-links{ opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; }
 .area-modal-menu .site-links ._cols{ display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; text-align: left; }
 .area-modal-menu .site-links ._cols ._col{ -ms-flex: 1; flex: 1; position: relative; }
 .area-modal-menu .site-links ._btns{ position: absolute; left: 0px; bottom: 0px; }
 .area-modal-menu .site-links ._btns ._btn{ display: block; background: #000; margin-top: 10px; width: 252px; height: 70px; color: #fff; font-size: 20px; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; text-align: center; }
 .area-modal-menu .site-links ._btns ._btn.is-entry{ background: #FCC800; }
 .area-modal-menu .site-links ._btns ._btn.is-contact{ background: #323232; }
 .area-modal-menu .site-links ._title{ font-size: 24px; letter-spacing: 0.05em; font-weight: bold; }
 .area-modal-menu .site-links ._title span{ display: block; }
 .area-modal-menu .site-links ._title span:nth-child(1){ font-size: 16px; color: #61A0DA; }
 .area-modal-menu .site-links ._title span:nth-child(2){ margin-top: 10px; font-size: 20px; letter-spacing: 0.1em; color: #5A5A5A; }
 .area-modal-menu .site-links ._links + ._title{ margin-top: 40px; }
 .area-modal-menu .site-links ._links{ margin: 30px 0 0 60px; }
 .area-modal-menu .site-links ._links li{ line-height: 1.4; }
 .area-modal-menu .site-links ._links a{ display: block; position: relative; padding: 5px 0 5px 15px; font-weight: bold; color: #5A5A5A; }
 .area-modal ._modal-btn-close{ top: -50px; right: 0px; width: 40px; height: 40px; }
 .area-modal ._modal-btn-close:after, .area-modal ._modal-btn-close:before{ background: #fff; }
 .area-modal ._modal-box{ top: 50%; left: 50%; width: 600px; height: 600px; margin: -300px 0 0 -300px; } }

@media screen and (min-width: 768px) and (max-width: 1120px){
 .area-wrapper{ min-width: 1120px; }
 .area-inner{ margin: 0 20px; }
 .block-inner{ margin: 0 20px; }
 .block-inner2{ margin: 0 20px; } }

/*# sourceMappingURL=maps/area.css.map */