@charset "utf-8";

/* 基本設定 */
.flex                                  { display:flex; }
.flex.between                          { justify-content:space-between; }
#recruit                               { background:#97d5ee; }
#recruit #wrap                         { position:relative; width:100%; padding:70px 0 50px 0; }
#recruit #wrap *                       { box-sizing:border-box; font-feature-settings:"palt"; }
#recruit #wrap .wrap_inner             { width:calc(100% - 100px); max-width:1400px; margin:150px auto 0 auto; padding:100px; background:#fff; border-radius:8px; box-shadow:1px 4px 10px rgba(0,0,0,0.15); }

/* 採用ヘッタ */
#recruit_header                        { position:relative; background:url(../../img/recruit/thumb.jpg) no-repeat center center #111; background-size:cover; }
#recruit_header article                { width:100%; height:100%; padding:8% 30% 15% 30%; text-align:center; background:url(../../img/common/etc/bg_dot_bk.png) repeat 0px 0px fixed rgba(0,0,0,0.7); }
#recruit_header article h1             { font-size:6.0rem; line-height:1.4; margin-bottom:0.2em; color:#ffffff; letter-spacing:0.10em; font-weight:   500; text-shadow:1px 1px 4px rgba(0,0,0,0.5); }
#recruit_header article h2             { font-size:1.2rem; line-height:1.4; margin-bottom:1.5em; color:#97d5ee; letter-spacing:0.40em; font-weight:normal; text-shadow:1px 1px 4px rgba(0,0,0,0.5); text-align:center; font-style:italic; font-family: 'Fjalla One', sans-serif; }
#recruit_header article p              { font-size:1.4rem; line-height:2.0; margin-bottom:2.5em; color:#ffffff; letter-spacing:0.05em; font-weight:  bold; text-shadow:1px 1px 4px rgba(0,0,0,0.5); }
#recruit_header .header_img            { position:absolute; bottom:-150px; left:0; right:0; z-index:2; width:70%; max-width:1000px; min-width:700px; height:auto; margin:0 auto; }

/* 採用ヘッタ:SNS */
#recruit_header article .share         { position:absolute; top:40px; right:40px; }
#recruit_header article .share span    { display:block; width:auto; height:30px; margin-right:10px; float:right; }
#recruit_header article .share span.tw { padding:1px; overflow:hidden; background:#1b95e0; border-radius:3px; }
#recruit_header article .share span.fb { padding:1px; overflow:hidden; background:#1877f2; border-radius:3px; }
#recruit_header article .share span.fb .fb-like { margin:0 -25px; }

/* カラム設定 */
#recruit .col_main                     { width:calc(100% - 380px); }
#recruit .col_side                     { width:300px; margin-left:80px; }

/* 記事タイル調整 */
#recruit .atls article                 { width:47%; background:#eee; }

#box_outline                           { margin:-140px auto 80px auto; padding-top:140px; }
#box_topics                            { margin:-140px auto 80px auto; padding-top:140px; }

/* タイトル */
#recruit #wrap h3                      { color:#111; border-top: 1px solid #063a76; font-size:1.4rem; line-height:1.4; margin: 0px 0 3% 0; padding:11px 15px 10px 15px; background-color:#f1feff; background-image:repeating-linear-gradient(-45deg,#d7f7ff, #d7f7ff 7px,transparent 0, transparent 14px); }
#recruit #wrap h4                      { color:#111; border-left:2px solid #063a76; font-size:1.0rem; line-height:1.4; margin:25px 0 3% 0; padding: 0px 0px 0px 15px; }
#recruit #wrap h5                      { color:#111; font-size:0.9rem; line-height:1.4; margin:20px 0 3% 0; padding: 0px 0px 0px 15px; position:relative; }
#recruit #wrap h5::before              { content:""; position:absolute; top:0; left:0; bottom:0; width:6px; height:6px; margin:auto 0; background:#063a76; border-radius:50%; }

/* フッタ */
#support_footer                        { padding:10px 50px 60px 50px; text-align:center; }
#support_footer p                      { font-size:17px; line-height:1.6em; font-weight:bold; text-align:center; }

/* その他調整 */
.mg_t_0                                { margin-top:0 !important; }
.mg_b_0                                { margin-bottom:0 !important; }
.btn                                   { padding:11px 54px 11px 18px; }
.btn.blank::before                     { background-image:url(../../img/common/wt/blank.svg); }
.btn.down::before                      { background-image:url(../../img/common/wt/down.svg); }

@media screen and (max-width:1200px){
#recruit_header article                { padding:12% 20% 15% 20%; }
}

@media screen and (max-width:1000px){
#recruit_header article                { padding:20% 15% 15% 15%; }
#recruit #box_topics .flex.between     { display:block; }
#recruit .col_main,
#recruit .col_side                     { width:100%; margin-left:auto; }
#recruit .col_side                     { margin-top:80px;}
}

@media screen and (max-width:760px){
#recruit #wrap                         { position:relative; width:100%; padding:0 0 20px 0; }
#recruit_header article                { padding:24% 15% 20% 15%; }
#recruit_header article h1             { font-size:2.4rem; margin-bottom:0.4em; }
#recruit_header article h2             { font-size:0.7rem; }
#recruit_header article p              { font-size:1.0rem; margin-bottom:0.4em; }
#recruit_header .btns                  { display:block; }
#recruit_header .btns .btn             { width:100%; margin:0 auto 10px auto; }
#recruit_header .header_img            { bottom:-50px; width:80%; min-width:320px; }
#recruit_header article .share         { top:20px; right:-10px; transform:scale(0.8); }
#recruit #wrap .wrap_inner             { width:calc(100% - 30px); margin:50px auto 0 auto; padding:20px; }
#box_outline                           { margin:-70px auto 70px auto; padding-top:70px; }
#box_topics                            { margin:-70px auto 70px auto; padding-top:70px; }
}